@charset "UTF-8";

/* 2019.04.01 맞춤카드 */
.tabBox .radioSel>.formWrap {height:48px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 190807 추가 */

/* 맞춤카드 - swiper default */
.swiper-container.type2 {position:relative; z-index:1; margin:0 -16px;}
.swiper-container.type2 .swiper-wrapper {display:-webkit-box; display:-ms-flexbox; display:flex; position:relative; z-index:1; width:100%; height:100%;}
.swiper-container.type2 .swiper-slide {position:relative; width:100%; height:100%; -ms-flex-negative:0; flex-shrink:0;}
.swiper-container-android.type2 .swiper-slide .img {-webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}

/* 맞춤카드 - swiper custom */
.swiper-container.type2 .swiper-wrapper {width:200px; height:190px; margin:0 auto;}
.swiper-container.type2 .swiper-slide {width:100%;}
.swiper-container.type2 .swiper-slide a {display:block; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:10px !important;}
.swiper-container.type2 .swiper-slide a .img {display:block; position:relative; -webkit-transform:scale(0.7) !important; transform:scale(0.7) !important;}
.swiper-container.type2 .swiper-slide a .img:after {content:''; position:absolute; top:16px; left:0; z-index:-1; width:100%; height:100%; background:rgba(0, 0, 0, 0.16); -webkit-filter:blur(16px); filter:blur(16px);}
.swiper-container.type2 .swiper-slide a strong {display:block; margin-top:20px; font-size:18px; line-height:21px; letter-spacing:-.22px; text-align:center; opacity:0;}
.swiper-container.type2 .swiper-slide a em {display:block; color:#f46600; letter-spacing:-.2px; text-align:center; opacity:0;}
.swiper-container.type2 .swiper-slide-active a .img {-webkit-transition:-webkit-transform 1s; transition:transform 1s; -webkit-transform:scale(1) !important; transform:scale(1) !important;}
.swiper-container.type2 .swiper-slide-active a strong,
.swiper-container.type2 .swiper-slide-active a em {margin-left:-20px; margin-right:-20px; -webkit-transition:-webkit-opacity 1s; transition:opacity 1s; opacity:1;}
.swiper-container.type2 .swiper-slide img {width:100%; vertical-align:top;}
.swiper-container.type2 .swiper-pagination {margin-top:24px; font-size:0; line-height:0; text-align:center;}
.swiper-container.type2 .swiper-pagination > span {display:inline-block; width:8px; height:8px; border:0 none; border-radius:50%; background:#c5c9ca; text-indent:-9999px;}
.swiper-container.type2 .swiper-pagination > span + span {margin-left:4px;}
.swiper-container.type2 .swiper-pagination .swiper-pagination-bullet-active {background:#000;}
.swiper-container.type2 .swiper-container .btnPrev,
.swiper-container.type2 .swiper-container .btnNext{display:block; position:absolute; top:0 !important; z-index:10; width:32px; height:100%; margin:0 !important;}
.swiper-container.type2 .swiper-container .btnPrev {left:0; padding-right:16px;}
.swiper-container.type2 .swiper-container .btnNext {right:0; padding-left:16px;}
.swiper-container.type2 .swiper-container .btnPrev:before,
.swiper-container.type2 .swiper-container .btnNext:before {content:''; display:block; position:relative; top:50%; width:32px; height:32px; margin-top:-10px; background-size:32px;}
.swiper-container.type2 .swiper-container .btnPrev:before {background-image:url('https://img1.kbcard.com/LT/cxh/kbcard_img/main/arr_ban_l_32.png');}
.swiper-container.type2 .swiper-container .btnNext:before {background-image:url('https://img1.kbcard.com/LT/cxh/kbcard_img/main/arr_ban_r_32.png');}

/* 맞춤카드 - 카드리스트 */
.madeCard .cardList .cardBox ul li a .tit {margin-top:16px;}
.madeCard .cardList .cardBox ul li a .txt {display:block; margin-top:7px; font-size:14px; line-height:20px;}
.madeCard .cardList + .cardList {margin-top:36px; border-top-color:rgba(0,0,0,0.16);}
.madeCard .cardList + .cardList:before {display:none;}

/* 맞춤카드 - 키워드 맞춤카드 (하단 레이어) */
.customCard .btnMore {position:relative; display:block; padding:16px 0; height:16px; text-align:center; color:#fff; font-size:16px; line-height:16px;}
.customCard .btnMore:after {content:''; display:inline-block; position:relative; left:6px; top:-2px; width:14px; height:8px; background-image:url('https://img1.kbcard.com/cxh/ia_img/common/ico_card.png'); background-size:14px 16px;}
.customCard.open .btnMore:after {background-position:0 100%;}

.customCard.type2 .listBox {display:block !important; overflow-x:auto; position:relative; margin:0; padding:16px 8px; background:#62636c; -webkit-overflow-scrolling:touch;}
.customCard.type2 .listBox > ul {height:50px; padding-right:8px; background:url('https://img1.kbcard.com/cxh/img/bg_nocard.png') 0 0 repeat-x; background-size:95px 50px;}
.customCard.type2 .listBox > ul:after {content:''; display:block; clear:both;}
.customCard.type2 .listBox > ul > li {float:left; width:79px; height:50px; padding:0 8px; border-top:0 none;}
.customCard.type2 .cardInfo {display:inline-block;}
.customCard.type2 .cardInfo .img {display:block; width:100%; padding-right:0;}
.customCard.type2 .cardInfo .img img {position:relative; z-index:2;}
.customCard.type2 .cardInfo .img:after {content:''; position:absolute; top:4px; left:4px; width:100%; height:100%; background:rgba(0, 0, 0, 0.24); -webkit-filter:blur(8px); filter:blur(8px);}
.customCard.type2 .cardInfo .infoTxt {display:none;}
.customCard.type2 .cardInfo .infoTxt > strong {padding-bottom:7px;}
.customCard.type2 .benefitBox {display:none;}
.customCard.type2 .benefitBox:after {content:''; display:block; clear:both;}
.customCard.type2 .listBox .benefitBox strong {float:left; width:100%; padding-top:16px; font-size:14px; line-height:20px; font-weight:normal;}
.customCard.type2 .listBox .benefitBox span {float:left; padding:3px 6px; background:rgba(0,0,0,0.16); font-size:12px; line-height:16px; color:#000;}
.customCard.type2 .noItem {display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:#fff;}
.customCard.type2 .noItem .inner {position:absolute; top:50%; left:0; width:100%; padding-top:80px; -webkit-transform:translateY(-50%); transform:translateY(-50%); text-align:center; background:url('https://img1.kbcard.com/cxh/img/bg_nocard.png') 50% 0 no-repeat; background-size:112px 60px;}
.customCard.type2 .noItem .inner .txt {font-size:14px; line-height:20px;}

.customCard.type2.open .listBox {margin:0 10px 10px; padding:0; background:transparent;}
.customCard.type2.open .listBox > ul {width:100% !important; height:auto; padding-right:0; background:none;}
.customCard.type2.open .listBox > ul > li {float:none; width:auto; height:auto; padding:20px 22px; background:#fff; background-clip:padding-box; box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.2);}
.customCard.type2.open .listBox > ul > li + li {margin-top:5px;}
.customCard.type2.open .cardInfo {display:table;}
.customCard.type2.open .cardInfo .img {display:table-cell; width:112px; padding-right:17px; vertical-align:top;}
.customCard.type2.open .cardInfo .img:after {display:none;}
.customCard.type2.open .cardInfo .img img {width:inherit; z-index:auto;}
.customCard.type2.open .cardInfo .infoTxt {display:table-cell;}
.customCard.type2.open .benefitBox,
.customCard.type2.open .noItem {display:block;}


/* 맞춤카드 공통 - 왼쪽 아이콘 작은버튼 */
.btnSS.type2 {padding:3px 16px; line-height:24px;}
.btnSS.type2 .icon {display:inline-block; width:24px; height:24px; margin:-1px 0 0 -6px; vertical-align:top;}
.btnSS.type2 .icon + .txt {margin-left:-4px;}

.ios .btnSS.type2 {line-height:26px;}
.ios .btnSS.type2 .icon {margin-top:-1px;}

/* 맞춤카드 공통 - 상단배너 */
.topBanner {overflow:hidden; position:relative; box-shadow:0 1px 8px 0 rgba(0, 0, 0, 0.5);}
.topBanner > .topBannerCon {display:block; position:relative; padding:12px 16px; background-color:#2d2f32; color:#fff;}
.topBanner em .fc9 {display:inline-block; margin-right:4px; text-decoration:underline;}
.topBanner .close {position:absolute; top:0; right:0; width:40px; height:40px; background:url('https://img1.kbcard.com/LT/cxh/kbcard_img/common/ico/basic/24/ico_close_24_fff.png') no-repeat center; background-size:24px;}
.topBanner .close:after {content:''; position:absolute; top:0; right:0; width:40px; height:76px;}




/* 2019.04.09 결제계좌다원화 */

/* 다원화 공통 - 밑줄 텍스트 버튼 */
.btnTxtN {display:inline-block; font-weight:normal; font-size:0.867rem; text-decoration:underline;}

/* 다원화 공통 - 카드박스 내 금액영역 추가 (absolute로 현업이 요청) */
.cardBox .cardTxt .landingArea {position:absolute; right:15px; bottom:16px; color:#000; text-align:right;}
.cardBox .cardTxt .inform {line-height:1.6rem;}
.cardBox .cardTxt .inform .cardBrand {margin-right:4px;}
.cardBox .cardTxt .cardBrand {display:inline-block; height:24px; padding:0; vertical-align:top;}
.cardBox .cardTxt .cardBrand img {width:32px;}

/* 다원화 공통 - 카드박스 타입 추가 */
.cardBox.listTypeFull .cardTxt {margin-top:0; border-left:0 none; border-right:0 none;}
.cardBox.listTypeFull .cardTxt.pr110 {padding-right:110px;}
.cardBox.listTypeFull .cardTxt.pr110 strong {display:block; margin-right:-94px;}
.cardBox.listTypeFull .cardTxt + .cardTxt {margin-top:-1px;}
.layerWrap .cardBox.listTypeFull .cardTxt {padding:16px 0;}
.layerWrap .cardBox.listTypeFull .cardTxt:first-child {border-top:0;}
.layerWrap .cardBox.listTypeFull .cardTxt:last-child {border-bottom:0 none;}
.layerWrap .cardBox.listTypeFull .cardTxt .landingArea {right:16px;}
.layerWrap.newType .cardBox.listTypeFull {margin:-16px -16px -16px 0;}
.layerWrap.newType .cardBox.listTypeFull .cardTxt {padding-right:16px;}


/* 다원화 - 결제예정금액 */
.stateSum.midType dt, .stateSum.midType dd {vertical-align:middle;}
.stateSum.midType .dBlock {display:block;}

/* 다원화 - 이용대금명세서 */
.titBox.blockType .tit {display:block;}
.titBox.blockType .selType1 {display:block; margin-top:16px;}
.titBox.blockType .cardBox {display:block; margin-top:16px;}
.titBox.blockType .btn {display:block; margin-top:16px;}

/* 190524 기존 스타일 삭제 및 추가 */
.cardStatement .cardBox .cont h4 a{text-decoration:underline}
.cardStatement .cardBox .cardTxt .inform {line-height:1.6rem}
.cardStatement .cardBox .cardTxt .landingArea {position:absolute;right:15px;bottom:16px;color:#000;text-align:right}
/* //190524 기존 스타일 삭제 및 추가 */

/* 다원화 - 바로출금결제 */
.cardBox.paymentType .cardTxt .landingArea {display:none;}
.cardBox.inlineType .cardTxt strong {word-break:break-word;}
.cardBox.inlineType .cardTxt em {display:inline-block; vertical-align:middle;}
.cardBox.inlineType .cardTxt .name {display:inline-block; line-height:1.429em; vertical-align:middle;}




/* 2019.04.11 장기카드대출 */

/* 장기카드대출 - 월별 상환액 보기 팝업 */
.resultBox {border:1px solid rgba(0, 0, 0, .16);}
.resultBox dl {display:table; table-layout:fixed; width:100%; padding:18px 24px; box-sizing:border-box;}
.resultBox dt {display:table-cell; width:46%; vertical-align:middle;}
.resultBox dd {display:table-cell; width:54%; font-size:24px; line-height:40px; text-align:right; vertical-align:middle;}
.resultBox dd .resultNum {display:inline-block; font-weight:bold; font-size:32px; line-height:inherit; vertical-align:middle;}
.resultBox dd .resultUnit {display:inline-block; margin-left:2px; font-size:inherit; line-height:32px; vertical-align:middle;}

/* 장기카드대출 - step2 정보입력 */
.loanableBox {padding:24px 0; border:1px solid rgba(0, 0, 0, 0.16); background:#fff;}
.loanableBox:after {content:''; display:block; clear:both;}
.loanableBox dl {float:left; width:50%; text-align:center; }
.loanableBox dt {margin-bottom:4px; font-size:0.933rem; line-height:1.429em; color:rgba(0, 0, 0, 0.6);}
.loanableBox dd.rate {font-size:1.200rem; line-height:1.333em; color:#01a0c7;}
.loanableBox dd.rate em {font-size:1.600rem; line-height:1.167em; vertical-align:bottom;}
.loanableBox dd.rate .through {display:block;}
.loanableBox dd.rate .through,
.loanableBox dd.rate .through em {font-size:0.934rem; line-height:1.333em; color:rgba(0, 0, 0, 0.47);}
.loanableBox h3 {font-size:0.933rem; line-height:1.429rem; margin-bottom:10px; text-align:center; color:#696e76;}
.loanableBox dt.badge {display:inline-block; margin-bottom:5px; padding:0 8px; font-size:0.813rem; line-height:1.71rem; background:#eef1f2; border-radius:22px;}

/* 190508 추가 / 190515 수정 */
/* 공통 - 라디오박스 */
.radioDefaultBox:after {content:''; display:block; clear:both;}
/*.radioDefaultBox li {float:left;} 2022-04-07 주석처리 (결함DEFC-0000009101) */
.radioDefaultBox li label {display:block; padding:12px 0;}
/* //190508 추가 / 190515 수정 */



/* 2019.04.16 해외이용 이의신청 */

/* 해외이용 이의신청 - 내역조회 */
.billingList.bt1 {border-top:1px solid rgba(0, 0, 0, 0.87);}
.billingList.listType {padding-left:0; border-top:1px solid rgba(0, 0, 0, 0.87); border-bottom:1px solid rgba(0, 0, 0, 0.16);}
.billingList.listType li {padding-left:16px; padding-right:120px;}
.billingList.listType li .info1{color:#666;}
.billingList.listType li .info1 strong {font-size:1.067rem !important; line-height:1.5em; font-weight:normal; color:rgba(0,0,0, 0.87); word-break:normal;}
.billingList.listType li .info1 em {position:absolute; top:50%; right:16px; font-weight:bold; color:rgba(0, 0, 0, 0.87); text-align:right; transform:translateY(-50%);}
.billingList.listType li .info2{display:block; margin-top:4px; font-size:0.933rem !important; line-height:1.429em;}
.billingList.listType li .info2 span {font-size:0.857rem; color:#888;}


/* 2019.07.02 본인인증 */

/* 공통 카드 인증 */
.cardBox .cardTxt.dCardNum > p,
.cardBox .cardTxt.dCardNum .info,
.cardBox .cardTxt.dCardNum .info span {color:rgba(0,0,0,.47) !important}