@charset "utf-8"; 
/*
   Root : ITBYY_COM_PT_STATIC_ITB_WBZ
   Date : 2025.05.16 Direct Message / 2025.06.02 주소찾기 수정
 */

/*===========================================================================================================
============================================= content common ================================================
=============================================================================================================*/
/*== 지능형이체 알림 ==*/
.alarmList { margin: 0 -5px; padding-bottom: 20px; }
.alarmList ul { overflow: hidden; }
.alarmList li { float: left; width: 33.33%; box-sizing: border-box; padding: 0 5px; position: relative; }
.alarmList li > input[type="radio"] { position: absolute; top: auto; display: inline-block; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: -10; box-sizing: border-box; vertical-align: top; }
.alarmList li > input[type="radio"]+label { position: absolute; top: 20px; left: 20px; width: 25px; height: 24px; background: url("../img/common/bg_alarm_radio.png") no-repeat 0 0; }
.alarmList li > input[type="radio"]+label:hover, .alarmList li > input[type="radio"]:focus+label { cursor: pointer; }
.alarmList li > input[type="radio"]:checked+label { background-position: 0 -24px; }
.alarmList li .alarmBox { background-color: #e4f1fe; padding: 60px 16px 16px; border-radius: 10px; color: #333; box-sizing: border-box; border: #e4f1fe 2px solid; }
.alarmList li .alarmBox > span { display: block; }
.alarmList li .alarmBox .num { text-align: right; padding-top: 10px; font-size: 20px; }
.alarmList li > input[type="radio"]+label:hover + div.alarmBox, .alarmList li > input[type="radio"]:focus+label + div.alarmBox { border: #0063cc 2px solid; }
.alarmList li > input[type="radio"]:checked+label + div.alarmBox { background-color: #0063cc; color: #fff; border: #0063cc 2px solid; }

/* 인쇄용 약정서등  */
.icoOutput{position:relative; margin-right:5px; padding-left:20px; font-size:16px; /*line-height:1.6em;*/}
.icoOutput i.ico{position:absolute; top:4px; left:0; display:inline-block; }

.printGap1{display:inline-block; min-width:35px; text-align:center;}
.printGap2{display:inline-block; min-width:30%; text-align:center;}
.printGap3{display:inline-block; min-width:45%; text-align:center;}
.printGap4{display:inline-block; min-width:18px; text-align:center;}
.printGap5{display:inline-block; min-width:90px; text-align:center;}

/*== 보안카드 ==*/
.securityArea { margin-top: 30px; border-top: #626364 2px solid; width: 100%; }

.securityArea .secuTable { display: table; table-layout: fixed; width: 100%; }
.securityArea .secuTable .imgArea { display: table-cell; width: 34%; text-align: center; vertical-align: middle; padding: 35px 0; }
.securityArea .secuTable .imgArea .txt { padding-top: 20px; }
.securityArea .secuTable .txtArea { display: table-cell; width: 66%; padding: 30px 0; text-align: left; }
.securityArea .secuTable .txtM.line { border-top: #dedede 1px solid; padding-top: 20px; margin-top: 10px; font-size: 14px; }
.securityArea .secuTable .txt.line { border-top: #dedede 1px solid; padding-top: 20px; margin-top: 10px; font-size: 14px; }
.securityArea .secuTable .txtArea .selfBox { padding-bottom: 10px; }

.securityArea .secuTable .infoBox { padding-top: 20px; padding-bottom: 20px; text-align: center; margin-top: 10px; margin-bottom: 20px; }
.securityArea .secuTable .infoBox > * {vertical-align: middle;}
.securityArea .secuTable .infoBox strong { color: #333; font-size: 16px; }
.securityArea .secuTable .infoBox em { padding-left: 15px; padding-right: 5px; font-size: 20px; }
.securityArea .secuTable .infoBox button { margin-left: 10px; }

/* 버튼형 아코디언 */
.moreArea { width: 100%; border-top: #dedede 1px solid; border-bottom: #dedede 1px solid; background-color: #f8f8f8; padding: 20px; box-sizing: border-box; }
.moreArea .moreBtn button { font-size: 16px; background: url(../img/common/btn_secu_acco_off.png) no-repeat right 50%; padding-right: 22px; }
.moreArea.on .moreBtn button { background: url(../img/common/btn_secu_acco_on.png) no-repeat right 50%;  }
.moreArea ul { margin-top: 15px; }
/* //버튼형 아코디언 */

/* 보안카드 */
.kdbSecCard { margin: 0 auto; width: 324px; height: 218px; background:url(../img/common/bg_sec_card2.png) no-repeat 0 0; position: relative; }
.kdbSecCard .securityNum4 { width: 37px; height: 16px; position: absolute; top: 13px; right: 19px; box-sizing: border-box; border: #d7006d 2px solid; background-color: #fff; }
.kdbSecCard .secNum li { width: 60px; height: 17px; position: absolute; text-align: left; }
.kdbSecCard .secNum li strong.num { width: 19px; height: 17px; display: inline-block; float: left; color: #fff; background-color: #d7006d; font-size: 11px; line-height: 17px; text-align: center; vertical-align: top; }
.kdbSecCard .secNum li .secBox { display: inline-block; float: left; margin: 2px; width: 18px; height: 13px; box-sizing: border-box; border: #d7006d 2px solid; background-color: #fff; }
.kdbSecCard .secNum li.back .secBox { float: right; margin: 2px 2px 5px; }

.kdbSecCard .secNum .sec1 { top: 56px; left: 10px; }
.kdbSecCard .secNum .sec2 { top: 56px; left: 71px; }
.kdbSecCard .secNum .sec3 { top: 56px; left: 132px; }
.kdbSecCard .secNum .sec4 { top: 56px; left: 193px; }
.kdbSecCard .secNum .sec5 { top: 56px; left: 254px; }
.kdbSecCard .secNum .sec6 { top: 74px; left: 10px; }
.kdbSecCard .secNum .sec7 { top: 74px; left: 71px; }
.kdbSecCard .secNum .sec8 { top: 74px; left: 132px; }
.kdbSecCard .secNum .sec9 { top: 74px; left: 193px; }
.kdbSecCard .secNum .sec10 { top: 74px; left: 254px; }
.kdbSecCard .secNum .sec11 { top: 92px; left: 10px; }
.kdbSecCard .secNum .sec12 { top: 92px; left: 71px; }
.kdbSecCard .secNum .sec13 { top: 92px; left: 132px; }
.kdbSecCard .secNum .sec14 { top: 92px; left: 193px; }
.kdbSecCard .secNum .sec15 { top: 92px; left: 254px; }
.kdbSecCard .secNum .sec16 { top: 110px; left: 10px; }
.kdbSecCard .secNum .sec17 { top: 110px; left: 71px; }
.kdbSecCard .secNum .sec18 { top: 110px; left: 132px; }
.kdbSecCard .secNum .sec19 { top: 110px; left: 193px; }
.kdbSecCard .secNum .sec20 { top: 110px; left: 254px; }
.kdbSecCard .secNum .sec21 { top: 128px; left: 10px; }
.kdbSecCard .secNum .sec22 { top: 128px; left: 71px; }
.kdbSecCard .secNum .sec23 { top: 128px; left: 132px; }
.kdbSecCard .secNum .sec24 { top: 128px; left: 193px; }
.kdbSecCard .secNum .sec25 { top: 128px; left: 254px; }
.kdbSecCard .secNum .sec26 { top: 146px; left: 10px; }
.kdbSecCard .secNum .sec27 { top: 146px; left: 71px; }
.kdbSecCard .secNum .sec28 { top: 146px; left: 132px; }
.kdbSecCard .secNum .sec29 { top: 146px; left: 193px; }
.kdbSecCard .secNum .sec30 { top: 146px; left: 254px; }

/* OTP */
.kdbOtpCard1 { margin: 0 auto; width: 324px; height: 104px; background:url(../img/common/bg_otp1.png) no-repeat 0 0; position: relative; }
.kdbOtpCard2 { margin: 0 auto; width: 324px; height: 104px; background:url(../img/common/bg_otp2.png) no-repeat 0 0; position: relative; }
/* SMART OTP */
.kdbSmartOtp { margin: 0 auto; width: 324px; height: 250px; background:url(../img/common/bg_smart_otp.png) no-repeat 0 0; position: relative; }
/* TZ-OTP */
.kdbTZOtp { margin: 0 auto; width: 324px; height: 250px; background:url(../img/common/bg_tz_otp.png) no-repeat 0 0; position: relative; }
/* DIGITAL OTP */
.digitalOtp{ margin: 0 auto; width: 171px; height: 271px; background:url(../img/common/bg_digital_otp1.png) no-repeat 0 0; position: relative; }

.secGrayBox { margin-bottom: 20px; padding: 15px 20px; box-sizing: border-box; background-color: #f8f8f8; border-radius: 5px; }
.secGrayBox table.noLine td { padding-bottom: 0; }
.secGrayBox .smartOtpPinNum { color: #d6006d; font-size: 20px; vertical-align: middle; }
.secGrayBox .smartOtpPinNum + span { padding-right: 15px; }

.otpTit { padding: 20px 0 10px; color: #333; font-size: 16px; }
.otpTit input[type="checkbox"]:not(.def)+label { vertical-align: inherit; margin-left: 20px; }

/*== 로그인/로그아웃==*/
/* 로그인 - 자동팝업*/
.switchWrap{float:right; margin-top:10px; width: auto !important;}
.switchWrap input[type="checkbox"]:not(.def) + label{position:relative; display:inline-block; padding-right:55px; font-size:14px; color:#666; vertical-align:top}
.switchWrap input[type="checkbox"]:not(.def) + label:before{position:absolute; top:-1px; right:0; width:50px; height:20px; margin:0; border:0; border-radius:20px; background-color:#d2d2d2;}
.switchWrap input[type="checkbox"]:not(.def) + label:after{content:""; position:absolute; width:14px; height:14px; top:2px; right:33px; border-radius:50%; background-color:#fff; box-shadow:1px 2px 2px #bababa;-webkit-transition:.3s; transition:.3s; z-index:2}
.switchWrap input[type="checkbox"]:not(.def) + label > em{position:absolute; top:1px; display:inline-block; font-size:12px; z-index:1}
.switchWrap input[type="checkbox"]:not(.def) + label > em.on{display:none; right:24px; color:#fff}
.switchWrap input[type="checkbox"]:not(.def) + label > em.off{display:inline-block; right:7px; color:#6A6A6A;}
.switchWrap input[type="checkbox"]:not(.def):checked + label:before{box-shadow:none; border-color:#d6006d; background:none; background-color:#d6006d; transition:unset;}
.switchWrap input[type="checkbox"]:not(.def):checked + label:after{left:auto; right:3px; background:#fff; 
	-webkit-animation:unset; 
	-moz-animation:unset;
	-ms-animation:unset;
	animation:unset; 
}
.switchWrap input[type="checkbox"]:not(.def):checked + label > em.on{display:inline-block;}
.switchWrap input[type="checkbox"]:not(.def):checked + label > em.off{display:none}
.switchWrap input[type="checkbox"]:not(.def) + label:hover,
.switchWrap input[type="checkbox"]:not(.def):focus+label{text-decoration:none; outline:1px dotted #999}

/* 로그인/로그아웃 */
#content.login{padding-bottom:0}
.tab.half{margin-bottom:0}
.tab.half li{width:50%}

.loginBox{padding:50px 40px; border-bottom:1px solid #dedede; overflow:hidden;}
.loginBox > .row.line {position:relative;}
.loginBox > .row.line > [class*=col_] {position:static;}
.loginBox > .row.line > .col_4 {border:none !important;}
.loginBox > .row.line > .col_4:before, .loginBox > .row.line > .col_4:after {content:''; position:absolute; left:33.3%; top:0; bottom:0; border-right:1px solid #dedede;}
.loginBox > .row.line > .col_4:after {left:66.6%;}
.loginBox .btnG{margin-top:10px; width:100%; font-size:16px}
/* 20.12.10 금융인증서 관련 수정 (정현아)*/
.loginBox .cbtnB, .loginBox .cbtnWB {width:100%; height:80px; line-height:normal; margin-bottom:10px; font-size:20px;}
.loginBox .cbtnB > span, .loginBox .cbtnWB > span {display:inline-block; padding:10px 0 10px 47px; line-height:normal;}
.loginBox .btnG{height: auto; line-height: normal; padding: 10px 14px;}

.loginBox .titH4{float:left; font-size:24px}
.loginInBox{display:inline-block; width:290px}
.loginCustom .noticeBox .tit > strong:before{display:none}
.loginCustom .noticeBox .tit.notice > strong:before{display:inline-block}
.customInfo{padding-left:110px; background:url(../img/common/ico_login_custom.png) no-repeat 20px 5px;}
.customNum{font-size:34px; color:#d6006d}

.loginBanner{background-color:#f8f8f8}
.loginBanner .infoBox{position:relative; }
.loginBanner .infoBox .titArea [class^=txt]{position:relative}
.loginBanner section .titArea [class^=txt]{bottom:auto}
.loginBanner .infoBox  > .row.line > [class*=col_]{padding-left:65px;}

.loginFaq li{padding:5px 0 5px 30px; color:#666; background:url(../../img/common/ico_login_faq.png) no-repeat 0 center; box-sizing: border-box;}
.loginFaq li a{display:block; height:30px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.loginFaq li a:hover{text-decoration:underline; color:#0063cc}

/* 로그인 아이콘 모음 */
.icoCerLog span{background:url(../img/common/ico_cer_login.png) no-repeat 0 center;}
.icoGeumLog span{background:url(../img/common/ico_geum_login.png) no-repeat 0 center; padding-left:55px !important;}/* 21.12.09 금융인증서 추가 */
.col_3 > .icoGeumLog span{padding-left:49px !important;}
.icoChinLog span{background:url(../img/common/ico_chain_login.png) no-repeat 0 center; background-size:27px auto}
.icoBodyLog span{background:url(../img/common/ico_body_login.png) no-repeat 0 center;}
.icoTxtMemReg span{background:url(../img/common/ico_register_login.png) no-repeat 0 center;}
.icoLogBnr01{padding:20px 0 20px 95px; font-size:14px; color:#666; background:url(../img/common/ico_login_banner01.png) no-repeat 0 center;}
.icoLogBnr02{padding:20px 0 20px 95px; font-size:14px; color:#666; background:url(../img/common/ico_login_banner02.png) no-repeat 0 center;}
.icoTxtCerNoti{font-size:14px; color:#666; background:url(../img/common/ico_cer_notice.png) no-repeat 0 0}
.icoCerLogRe span{background:url('../img/common/ico_cer_login_re.png') no-repeat 0 center;}

/* 로그인-프로모션 슬라이드 */
.loginSlide{position:relative; width:460px; height:240px; margin:0 12px;}
.loginSlide .swiper-button-prev,
.loginSlide .swiper-button-next{display:none}

/* 바이오인증로그인 인증 */
.bioNum{padding:20px 0; text-align:center; font-size:34px; color:#333}
.bioQR{text-align:center}
.bioTime{margin:30px 0 20px; text-align:center; color:#666; }
.bioTime .tit{padding:2px 0 3px 38px; font-size:16px; color:#333; background:url(../img/common/ico_login_bio.png) no-repeat 0 0}
.bioTime .time{margin-left:5px}
.bioTime .time em{margin-left:5px; font-size:20px}

/* 가상계좌 로그인 */
.virtualAcc section {padding-top:60px; text-align:center}
.virtualAcc .bannerArea {background-color:#daeafa}
.virtualAcc .shapeBox {padding:0}
.virtualoginInBox {display:inline-block; width:365px; padding:60px 40px 70px}
.virtualoginInput {margin-top:40px;}
.virtualoginInput > li {margin-top:10px;}
.virtualoginInput > li:first-child {margin-top:0}
.virtualoginBtn {width:100%; margin-top:20px; height:80px; line-height:80px; font-size:20px}

/*== 주소찾기 ==*/
/* find_address_eng_1 주소(영문)찾기 */
.lineScroll.addrEng {border-left:0; border-right:0; border-top: 2px solid #666; border-radius:0;}
.lineScroll.addrEng .itemList {border:0;}
.lineScroll.addrEng li {vertical-align:middle;}
.lineScroll.addrEng .iptFull input[type="radio"]:not(.def)+label:before, .lineScroll.addrEng .iptFull input[type="checkbox"]:not(.def)+label:before {vertical-align: middle;}
.lineScroll.addrEng .addrTxtEng {display: inline-block; padding-left: 10px; max-width: 500px; vertical-align: middle;}
input[type="radio"]:not(.def)+label:hover .addrTxtEng,
input[type="checkbox"]:not(.def)+label:hover .addrTxtEng,
input[type="radio"]:not(.def):focus+label .addrTxtEng,
input[type="checkbox"]:not(.def):focus+label .addrTxtEng {text-decoration: underline; color: #0063CC;}

/*== 조회/이체 ==*/
/* 기본정보 나오는 summary box */
.accSumBox {position: relative; padding: 22px 30px; border: 1px solid #0063cc; border-radius: 8px; box-shadow: 5px 5px 5px rgba(0,0,0,0.07); background-color: #fff; transition:all 0.5s; overflow: hidden;}
.accSumBox:after {content: ""; display: block; clear: both;}
.accSumBox .accoTit {float: left; display: inline-block; min-width: 165px; padding: 1px 20px 1px 55px; background: url(../img/common/ico_deposit.png) no-repeat left center; font-size: 24px; color: #0063cc; box-sizing: border-box; transition: color 0.5s}
.accSumBox.deposit .accoTit {background:url(../img/common/ico_deposit.png) no-repeat left center;}/* 예금 */
.accSumBox.trust .accoTit {background:url(../img/common/ico_trust.png) no-repeat left center;}/* 신탁 */
.accSumBox.fund .accoTit {background:url(../img/common/ico_fund.png) no-repeat left center;}/* 펀드 */
.accSumBox.bond .accoTit {background:url(../img/common/ico_bond.png) no-repeat left center;}/* 산금채(채권) */
.accSumBox.loan .accoTit {background:url(../img/common/ico_loan.png) no-repeat left center;}/* 대출 */
.accSumBox.foreign .accoTit {background:url(../img/common/ico_foreign.png) no-repeat left center;}/* 외화예금 */
.accSumBox.insurance .accoTit {background:url(../img/common/ico_insurance.png) no-repeat left center;}/* 보험 */
.accSumBox.pension .accoTit {background:url(../img/common/ico_pension.png) no-repeat left center;}/* 퇴직연금 */

.accSumBox .totalNum {position:relative; float:left; margin-top:5px }
.accSumBox .totalNum:before {content:""; display:block; position:absolute; top:2px; left:0; width:1px; height:24px; border-left:1px solid #e7e7e7}
.accSumBox .totalNum li {position:relative; /*float:left;*/ padding:0 0 0 20px; font-size:20px; color:#333}
.accSumBox .totalNum li > .unitR {display:inline-block; margin:7px 8px 0 0; font-size:14px; color:#666; vertical-align:top}
.accSumBox .priceList {float:right; transition: all 0.3s}
.accSumBox .priceList li {position:relative; float:left; padding:0 0 0 41px; font-size:20px; }
.accSumBox .priceList li:before {content:""; display:block; position:absolute; top:6px; left:20px; bottom:3px; border-left:1px solid #e7e7e7}
.accSumBox .priceList li:first-child:before {content: none; padding-left: 0;}
.accSumBox .priceList li .txt {display:inline-block; margin-right:5px; font-size:16px}
.accSumBox .priceList li > strong {color:#d7006d; font-size: 24px;}
.accSumBox .priceList li > .unit {font-size:20px; color:#666}
.accSumBox .priceList li > .unitR {font-size: 20px; color: #666;}
.accSumBox.foreign .priceList li, .accSumBox.fund.multi .priceList li {float: none; margin-top: 5px; padding-left:0; text-align: right;}
.accSumBox.foreign .priceList li:first-child, .accSumBox.fund.multi .priceList li:first-child {margin-top: 0;}
.accSumBox.foreign .priceList li:before, .accSumBox.fund.multi .priceList li:before {content: none;}
.accSumBox.foreign .totalNum, 
.accSumBox.foreign .totalNum {margin-top:4px;}
.accSumBox.foreign .totalNum.vertical li, 
.accSumBox.foreign .totalNum li, 
.accSumBox.fund.multi .totalNum li {float:none; position:relative; display: block; margin-top: 11px; }
.accSumBox.foreign .totalNum.vertical li:first-child, .accSumBox.foreign .totalNum li:first-child, .accSumBox.fund.multi .totalNum li:first-child {margin-top: 0}
.accSumBox.foreign .totalNum.vertical li:after, .accSumBox.foreign .totalNum li:after, .accSumBox.fund.multi .totalNum li:after {content: ''; position: absolute; left: 15px; right: -795px; top:-5px; border-bottom: 1px solid #eee;}
.accSumBox.foreign .totalNum.vertical li:first-child:after, .accSumBox.foreign .totalNum li:first-child:after, .accSumBox.fund.multi .totalNum li:first-child:after {content: none}
.accSumBox .priceList .priceList li {position:relative; display: inline-block; margin-left:40px; margin-top:0 !important; letter-spacing: 0;}
.accSumBox .priceList .priceList li .unitR {font-size: 16px}
.accSumBox .priceList .priceList li:after {content: ''; position: absolute; left: -21px; top: 10px; bottom: 1px; border-left: 1px solid #e7e7e7;}
.accSumBox .priceList .priceList li:first-child {margin-left:0 !important;}
.accSumBox .priceList .priceList li:first-child:after {content: none;}
.accSumBox .priceList .priceList li:first-child > strong {color:#666}

.accSumBox .accoBtn {position: absolute; top: 23px; right: 20px; display: inline-block; width: 38px; height: 38px; background: url(../img/common/btn_acco_off.png) no-repeat center center; transition: transform 0.5s}

/* 아코디언 형태 */
.allAccList .accoWrap {margin-top:20px;}
.allAccList .accoWrap .accoContents {padding-bottom: 20px;}
.allAccList .accoWrap:first-child {margin-top:0px;}
.accoWrap .accSumBox {padding: 22px 76px 22px 30px; border-color:#dedede; background-color: #fcfcfc;}
.accoWrap .accSumBox .accoTit {color:#333;} 
.accoWrap .accSumBox .priceList li > strong {color:#333; transition: color 0.3s ease-out;}
/*.accoWrap .accSumBox.foreign .priceList {float:none; max-height: 20px}*/
.accSumBox.fund.multi .priceList {float: none}
.accoWrap.on .accSumBox.foreign .totalNum li:after {right:-753px}
.accSumBox.fund.multi .totalNum li:after {right:-800px}
.accSumBox.foreign .totalNum.vertical:before, .accoWrap.on .accSumBox.foreign .totalNum:before, 
.accSumBox.fund.multi .totalNum:before {content: none;}
.accoWrap.on .accSumBox.foreign .priceList {max-height:none; /*display: block;*/}
.accoWrap.on .accSumBox {border-color:#0063cc; background-color: #fff;}
.accoWrap.on .accSumBox .accoTit {color:#0063cc;}
.accoWrap.on .accSumBox .priceList li > strong {color:#d7006d;} 
/*.accoWrap.on .accSumBox .priceList {opacity: 1; visibility: visible;}*/
.accoWrap .accList .detailList > li {background-color: #f8f8f8}

/* accList */
.accList {margin-top:24px}
.accList .topArea {padding: 12px 20px; border-bottom: 1px solid #666; background-color: #6a7291; color: #fff;}
.accList .topArea + .detailList {border-top:none;}
.accList .topArea:after {content: ''; clear: both; display: table;}
.accList .topArea .summary {float: left;}
.accList .topArea .txtItem {float:right;}
.accList .topArea .txtItem li {margin-left:40px;}
.accList .topArea .txtItem li:before {left:-20px; }
.accList .topArea .icoTxtCO {height:24px; margin-left: 20px; padding-left: 35px; background: url(../img/common/ico_change_order.png) no-repeat left center; color: #fff; text-decoration: none; font-size: 16px;}
.accList .detailList {border-top:2px solid #666666;}
.accList .detailList > li {display: table; table-layout:fixed; padding: 20px; box-sizing: border-box; border-bottom: 1px solid #dedede; color:#666; border-collapse: collapse;}
.accList .accInfo, .accList .dateInfo, .accList .priceInfo {display: table-cell; padding:20px 0; vertical-align: middle; box-sizing: border-box;}
.accList .accInfo {width:480px; padding: 20px 10px 20px 20px; vertical-align: top;} 
.accList .accInfo .accName {display: block; font-size: 18px; color: #0063cc;}
.accList .accInfo .accName > a, .accList .accInfo .accName > .c333 {margin-right:5px;}
.accList .accInfo .accName > a:hover {text-decoration: underline;}
.accList .accInfo .accName > strong {display: block;}
.accList .accInfo .subTxt {font-size: 16px; color:#666}
.accList .accInfo .txtItem {margin-top:10px;}
.accList .accInfo .txtItem strong {margin-left: 10px; color:#333}
.accList .dateInfo {width: 267px; box-sizing: border-box; vertical-align: middle;}
.accList .dateInfo li {float: left; width: 50%;}
.accList .dateInfo li strong {display: block; font-size: 14px;}
.accList .dateInfo li span {display: inline-block; font-size: 16px; color: #333;}
.accList .dateInfo .plus {color:#e00000}
.accList .dateInfo .minus {color:#0054ad}
.accList .dateInfo [class*=icoBtn] {margin: -20px 0 0 10px}
.accList .priceInfo {position:relative; width: 385px; padding-right:20px; box-sizing: border-box; vertical-align: top; text-align: right;}
.accList .priceInfo:before {content: ''; position: absolute; bottom:20px; top:20px; left:0; border-left:1px solid #e7e7e7;}
.accList .priceInfo strong {color:#333}
.accList .priceInfo .btnGroup {margin-top:15px; margin-right:-5px; text-align: right;}
.accList .priceInfo li .txt {margin-right: 5px; color:#666; font-size:16px;}
.accList .priceInfo li:first-child > strong, .accList .priceInfo li:first-child > [class*=unit] {font-size: 18px; color: #333;}

/*== 인쇄 팝업 ==*/
.toDear { margin-bottom: 30px; }
.toDear p { min-width: 240px; border-bottom: #0063cc 2px solid; display: inline-block; box-sizing: border-box; padding-right: 50px; position: relative; padding-bottom: 10px; }
.toDear p i { position: absolute; bottom: 15px; right: 0; }
.toDear .name { letter-spacing: 1em; font-size: 24px; color: #333;}
.toDear.ar > p {text-align:left;}
.en .toDear .name { letter-spacing: -1px;}
.toDear .titH5 {text-decoration:underline;}


.toDear.foreign p { padding-left:140px; padding-right:0;}
.toDear.foreign p i {left: 0;}
.toDear.foreign .name {letter-spacing:0;}

/*== 통장사본 팝업==*/
.bankbookWrap {width: 688px; margin: 0 auto; }
.bankbook { width: 696px; position: relative; margin: 0 auto; overflow: visible;}
.bankbook .bankbookDetail { padding: 30px; width: 688px; box-sizing: border-box;  border: #d2d2d2 1px solid; border-radius: 20px; background: #f8f8f8 url(../img/common/bg_bankbook.png) no-repeat right 0; box-shadow: 3px 5px 10px rgba(221,221,221,0.5); }
.bankbook .bankbookDetail:after { content: ""; width: 688px; height: 30px; background: url(../img/common/img_bankbook.png) no-repeat 0 0; position: absolute; bottom: 0; left: 0; }
.bankbook .bankbookDetail .txtList { padding-bottom: 30px; min-height: 202px; box-sizing: border-box; }
.bankbook .bankbookDetail .txtList span { display: inline-block; width: 33%; min-width: 190px; vertical-align: top; }
.bankbook .bankbookDetail .txtList strong { display: inline-block; width: 62%; vertical-align: top; }
.bankbook .bankbookDetail .refList { padding-top: 20px; border-top: #e7e7e7 1px solid; }
.bankbook .bankbookDetail .refList li { color: #666; }
.bankbook .bankbookDetail .bankbookSign {position:relative;margin-top:-30px;padding-bottom:20px;text-align:right;}
.bankbook .bankbookDetail.bgbtmout:after {display:none;}
/* 통장사본(퇴직연금) 팝업 */
.bankbook.pension .toDear {margin-bottom:20px;}
.bankbook.pension .bankbookDetail .txtList {height: 220px; padding-bottom:0;}
.bankbook.pension .bankbookDetail .txtList span {width:200px;}
.bankbook.pension .bankbookDetail .bankbookSign {bottom:110px;}
.bankbook.pension .bankbookDetail .refList {padding-top: 15px;}

/*== 카드매출전표 ==*/
.billPaperWrap {position:relative; width:690px; margin:0 auto; padding-bottom:5px;}
.billPaperWrap:before, .billPaperWrap:after {content:''; position:absolute; top:0; left:1px; width:48px; height:13px; background:url('../img/common/bg_billpaper_top.png') no-repeat 0 0; z-index:1;}
.billPaperWrap:after {left:auto; right:1px;}
.billPaper {position:relative; width:100%; box-sizing:border-box; border:1px solid #dedede; box-shadow: 2px 2px 5px rgba(0,0,0,0.07);}
.billPaper:before, .billPaper:after {content:''; position:absolute; top:13px; bottom:0; left:0; width:48px; background:url('../img/common/bg_billpaper_repeat.png') repeat-y 0 0;}
.billPaper:after {left:auto; right:0;}
.billPaper .inner {padding:30px 60px 30px 60px; box-sizing:border-box;}
.billPaper .titH2, .billPaper .titH4 {margin-top:5px; text-align:center;}
.billPaper .titH4 {margin:15px 0 19px 0; font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}
.billPaper .txt {margin-top:15px;}
.billPaper .signLogo {margin-top:20px; text-align:right;}

/* sms service */
.smsService { padding:135px 0 20px; background:url('../img/common/bg_phone_sms_service.png') no-repeat 50% 0; font-size: 20px; color: #333; }


/*====================================================================================================
============================================= content ================================================
=======================================================================================================*/

/*=========================================== 조회 ==============================================*/

/* BPIQAI0112 MY KDB 편집 */
.myKdbArea .myControlBtn { padding-top: 145px; }
.myKdbArea .myControlBtn button { margin: 0 0 10px 0; }
.myKdbArea .lineScroll { height: 280px; margin: 15px 0 10px 0; }
.myKdbArea .lineScroll { padding: 10px 0;  }
.myKdbArea .lineScroll li { padding: 1px 0; box-sizing: border-box; }
.myKdbArea .lineScroll li input[type="checkbox"] {position: absolute; top: auto; display: inline-block; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: -10; box-sizing: border-box; vertical-align: top;}
.myKdbArea .lineScroll li input[type="checkbox"]+label {position:relative; display: block; margin: 0; padding: 7px 20px; cursor: pointer; box-sizing: border-box; color:#666; line-height: 1.25em; vertical-align: top;}
.myKdbArea .lineScroll li input[type="checkbox"]:hover+label,
.myKdbArea .lineScroll li input[type="checkbox"]:focus+label { background-color: #f8f8f8; }
.myKdbArea .lineScroll li input[type="checkbox"]+label span { display: inline-block; position: relative; box-sizing: border-box; max-width: 100%; padding-right: 20px; }
.myKdbArea .lineScroll li input[type="checkbox"]:checked+label { background-color: #f8f8f8; }
.myKdbArea .lineScroll li input[type="checkbox"]:checked+label span:after { content: ""; width: 15px; height: 11px; position: absolute; top: 50%; right: 0; margin-top: -6px; background: url(../img/common/ico_checkbox2.png) no-repeat 0 0; }

/* BPIQAI0129 / BPIQAI0406 / BPIQAI0510 / BPIQAI0511 / BPIQAI0519 */
/* 영수증/계산서 팝업 하단 상환 완료 및 날짜/로고영역 */
.popSignArea { padding: 20px 0 0 0; position: relative; }
.popSignArea > .date { margin-top: 20px; text-align: center; color: #666; font-size: 16px; }
.popSignArea > .signLogo{ position: absolute; bottom: 0; right: 0; }
.popSignArea > .sign{ position: absolute; bottom: 0; right: 0; color: #666; font-size: 16px; }
.popSignArea + .refList { margin-top: 60px; position: relative; }
.popSignArea + .refList:after { content: ""; border-top: #dedede 1px solid; position: absolute; top: -30px; left: 0; right: 0; }

/* BPIQAI0131 자주찾는 계좌 설정 */
.itemListWrap.frequentlyList { margin-top: 5px; }
.itemListWrap.frequentlyList .itemList { max-height: 152px; }
.itemList.frequentlyList { max-height: 220px; margin-top: 0; }

/* BPIQAI0132 나만의 메뉴 편집 */
.itemList li input[type="checkbox"]:not(.def)+label span.txtHover:after { border-bottom: none; }
.itemList li input[type="checkbox"]:not(.def):hover+label span.txtHover,
.itemList li input[type="checkbox"]:not(.def):focus+label span.txtHover { color: #0063cc !important; }
.itemList li input[type="checkbox"]:not(.def):hover+label span.txtHover:after,
.itemList li input[type="checkbox"]:not(.def):focus+label span.txtHover:after { border-bottom: 1px solid #0063cc; }


/*=========================================== 이체 ==============================================*/
/* 선택정보 입력 - 아코디언 */
.choiceInfo .accoBtn{position: absolute; top:7px; right:7px; display:inline-block; width:38px; height:38px; background:url(../img/common/btn_acco_def.png) no-repeat center center }
.choiceInfo .accoContents{padding:30px 0 20px; }
.choiceInfo.accoWrap.on .accoContents{background-color:#f9f9f9}
.choiceInfo.accoWrap.on .titArea.line{margin-bottom:0}
.choiceInfo .titArea.line {cursor: pointer;}

/* 입금은행 */
.bankList{margin-top:20px; border:1px solid #f3f3f3; border-top-width:2px; border-right-width:2px; background-color:#f3f3f3}
.bankList:after{content:""; display:block; clear:both}
.bankList li{float:left; width:20%; border-left:1px solid #f3f3f3; border-bottom:1px solid #f3f3f3; box-sizing:border-box; text-align: center;}
.bankList li button, .bankList li a {display:block; width:100%; border:1px solid #fff; background:#fff; box-sizing:border-box; transition: border ease-out 0.3s; padding: 15px 0 10px 0;}
.bankList li button:hover, .bankList li button:focus, .bankList li a:hover, .bankList li a:focus {border-color:#0050a6;}
.bankList li button img, .bankList li a img {height:45px; vertical-align:middle;}
.bankList li a span {display:flex; align-items:center; justify-content:center; min-height:2.4em; font-size:15px; line-height:1.2em; padding:5px 5px 0;}

.en .bankList li { width: 50%; text-align: left;}
.en .bankList li button, .en .bankList li a { padding: 10px 20px; }
.en .bankList li span { display: inline-block; padding-top: 0; padding-left: 20px; vertical-align: middle; }

/* BPTFQT0109 안내문구 */
.infoTxt:before {display:inline-block; width:20px; height:20px; margin-top:-5px; margin-right:10px; content:""; background:url('../img/common/ico_information.png') no-repeat 0 0; vertical-align:middle;}

/*=========================================== 예금 ==============================================*/
/* BPDPDN0231_2.html */
.tableY.noLine .infoBox { padding: 20px; margin-top: 20px; }
.tableY.noLine .infoBox .tableY > tbody td{padding:15px 20px}


/*=========================================== 대출 ==============================================*/
/* BPLNLD0101 */
.imgLongdesc { text-align: center; }
.imgLongdesc img { max-width: 100%; }
.loanNotice { border-top: #666 2px solid; padding-top: 20px; margin-top: 30px; }
.loanNotice .txtList { margin-top: 15px; }
.loanSign { border-bottom: #dedede 1px solid; padding: 30px 0; }
.loanSign .sign { padding: 30px 0 0 0; text-align: center;}
.loanSign .sign p { padding-bottom: 15px; }

/* BPLNLN0300 */
.shapeBox.capitalHi { padding: 60px 70px 30px; }
.shapeBox.capitalHi [class*=titH].brB { border-bottom: #999 1px solid;; }
.shapeBox.capitalHi .fl { width: 50%; padding-right: 10px; box-sizing: border-box;}
.shapeBox.capitalHi .fr { width: 50%; padding-left: 10px; box-sizing: border-box; }
.shapeBox.capitalHi .btnArea { margin-top: 60px; padding-top: 30px; }

/* BPLNCC0107 대출변경 약정서 */
.stampTitArea {position:relative; height:130px;}
.stampTitArea .loanTaxStamp {display:block; position:absolute; left:0; top:0; width:170px; border:2px solid #666; padding:7px 10px; box-sizing:border-box}
.stampTitArea .loanTaxStamp p {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; color:#333; display:table-cell; line-height:1.8em}
.stampTitArea .loanTaxStamp p span {display:inline-block; width:100%; white-space: nowrap;}
.stampTitArea .loanTaxStamp p span.lts7 i {letter-spacing:0.7em}
.stampTitArea .loanTaxStamp p span.wds6 i {word-spacing:0.6em}
.stampTitArea .stampTitWrap {padding-left:200px;}
.stampTitArea .stampTitWrap .titH2 {padding:20px 0; border-bottom:2px solid #626364; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}

/* BPLNLN0325 */
.revenue [class*=col_] { display: table; }
.revenue .whiteBox { height: 120px; display: table-cell; vertical-align: bottom; box-shadow: none; }
.revenue .whiteBox img { max-width: 100%; } 

/*=========================================== 신탁 ==============================================*/
/* BPTRTQ0401 */
.rightBtnType { padding: 30px 150px 30px 30px; position: relative; border-bottom: #dedede 1px solid; }
.rightBtnType .rightBtn { position: absolute; top: 50%; right: 20px; margin-top: -20px; }

/* BPTRTA0102 */
table.bLine.changeHistory tbody.tbodySet.accoWrap td .accoBtn{position:relative; margin:0; right:0}
table.bLine.changeHistory tbody.tbodySet.accoWrap tr.detail td{padding:30px; background:#f8f8f8 !important}
table.bLine.changeHistory tbody.tbodySet.accoWrap .items td{padding:9px 20px}
table.bLine.changeHistory tbody.tbodySet.accoWrap.on .items .titDate{color:#0063cc}
/*=========================================== 산금채 ==============================================*/

/*=========================================== 펀드 ==============================================*/
/* BPFNFL0801 */
.fnDetail4 li { width: 235px !important; }
.fnDetail2 li { width: 235px !important; }


/*=========================================== 보험 ==============================================*/


/*=========================================== 카드 ==============================================*/
/* 카드 분기 : BPCDKH0802 / BPCDKH0803 */
dl.kdbCardType { padding-bottom: 50px; }
dl.kdbCardType dt { font-size: 24px; color: #003895; padding-bottom: 10px; }
dl.kdbCardType dd { font-size: 16px; color: #666; }
p.kdbCardType { font-size: 24px; color: #003895; padding-bottom: 30px; }

/* BPCDKH0805 */
.cardChoice { border-left: #dedede 1px solid; border-top: #666 2px solid; overflow: hidden; }
.cardChoice ul { overflow: hidden; background-color: #f8f8f8; }
.cardChoice li { width: 16.66%; float: left; padding: 20px; box-sizing: border-box; border-bottom: #dedede 1px solid; border-right: #dedede 1px solid; background-color: #fff; }
.cardChoice li input[type="checkbox"]:not(.def)+label, .cardChoice li p.choice { display: block; padding-bottom: 80px; position: relative; }
.cardChoice li.mart label, .cardChoice li.mart p.choice { background: url("../img/common/bg_crd_mart.png") no-repeat center bottom; }
.cardChoice li.oShop label, .cardChoice li.oShop p.choice { background: url("../img/common/bg_crd_onlineshopping.png") no-repeat center bottom; }
.cardChoice li.depart label, .cardChoice li.depart p.choice { background: url("../img/common/bg_crd_department.png") no-repeat center bottom; }
.cardChoice li.hospital label, .cardChoice li.hospital p.choice { background: url("../img/common/bg_crd_hospital.png") no-repeat center bottom; }
.cardChoice li.hotel label, .cardChoice li.hotel p.choice { background: url("../img/common/bg_crd_hotel.png") no-repeat center bottom; }
.cardChoice li.super label, .cardChoice li.super p.choice { background: url("../img/common/bg_crd_super.png") no-repeat center bottom; }
.cardChoice li.commu label, .cardChoice li.commu p.choice { background: url("../img/common/bg_crd_communication.png") no-repeat center bottom; }
.cardChoice li.leisure label, .cardChoice li.leisure p.choice { background: url("../img/common/bg_crd_leisure.png") no-repeat center bottom; }
.cardChoice li.hShop label, .cardChoice li.hShop p.choice { background: url("../img/common/bg_crd_homeshopping.png") no-repeat center bottom; }
.cardChoice li.coffee label, .cardChoice li.coffee p.choice { background: url("../img/common/bg_crd_coffee.png") no-repeat center bottom; }

/* BPCDKH1000 */
.cardStateArea { border: #d2d2d2 1px solid; border-radius: 8px; overflow: hidden; }
.cardStateArea .stateTit { position: relative; background-color: #f8f8f8; padding: 40px 0; text-align: center; border-bottom: #d2d2d2 1px solid; border-radius: 8px 8px 0 0; }
.cardStateArea .stateTit .tit { color: #333; font-size: 20px; }
.cardStateArea .stateTit button { position: absolute; top: 50%; right: 22px; margin-top: -25px;}
.cardStateArea .icoImgCert.state1 {background-image:url(../img/common/bg_card_state1.png);}
.cardStateArea .icoImgCert.state2 {background-image:url(../img/common/bg_card_state2_off.png);}
.cardStateArea .icoImgCert.state3 {background-image:url(../img/common/bg_card_state3_off.png);}
.cardStateArea .icoImgCert.state3_1 {background-image:url(../img/common/bg_card_state3_1_off.png);}
.cardStateArea .icoImgCert.state3_2 {background-image:url(../img/common/bg_card_state3_2_off.png);}
.cardStateArea .icoImgCert.state4 {background-image:url(../img/common/bg_card_state4_off.png);}
.cardStateArea .icoImgCert.state5 {background-image:url(../img/common/bg_card_state5_off.png);}
.stateBar { text-align: center;  }
.stateBar .box { width: 20%; float: left; box-sizing: border-box; padding: 30px; position: relative; }
.stateBar .box:before { content: ""; width: 100%;  position: absolute; top: -1px; left: -50%; z-index: 0; }
.stateBar .box:first-child:before { display: none; }
.stateBar .box.on:before { border-top: #4960eb 1px solid; }
.stateBar .box .bar { margin: 20px auto; width: 18px; height: 16px; background: url("../img/common/bg_card_state_point.png") no-repeat 0 0; position: absolute; top: -28px; left: 50%; margin-left: -9px; z-index: 1; }
.stateBar .box.on .bar { background-position: 0 -16px; }
.stateBar .box .txt { color: #666; font-size: 16px;}
.stateBar .box .date { display: block; font-size: 14px; color: #666; }
.stateBar.state4 .box { width: 25%; }
.stateBar.state6 .box { width: 16.66%;}
.stateBar.state7 .box { width: 14.28%; }
.cardStateArea .box.on .icoImgCert.state2 {background-image:url(../img/common/bg_card_state2_on.png);}
.cardStateArea .box.on .icoImgCert.state3 {background-image:url(../img/common/bg_card_state3_on.png);}
.cardStateArea .box.on .icoImgCert.state3_1 {background-image:url(../img/common/bg_card_state3_1_on.png);}
.cardStateArea .box.on .icoImgCert.state3_2 {background-image:url(../img/common/bg_card_state3_2_on.png);}
.cardStateArea .box.on .icoImgCert.state4 {background-image:url(../img/common/bg_card_state4_on.png);}
.cardStateArea .box.on .icoImgCert.state5 {background-image:url(../img/common/bg_card_state5_on.png);}



/* BPCDKH0700 */
.cardInfo1 { margin-bottom: 30px; }
.cardInfo1 .depthBox .txt:after { content: ''; width: 110px; height: 110px; position: absolute; right: 30px; bottom: 30px; }
.cardInfo1 .depthBox:nth-child(1) .txt:after { background: url("../img/common/bg_cardInfo1_1.png") no-repeat 0 0; }
.cardInfo1 .depthBox:nth-child(2) .txt:after { background: url("../img/common/bg_cardInfo1_2.png") no-repeat 0 0; }
.cardInfo1 .depthBox:nth-child(3) .txt:after { background: url("../img/common/bg_cardInfo1_3.png") no-repeat 0 0; }
.cardInfo2 { margin-bottom: 30px; }
.cardInfo2 .depthBox .txt:after { content: ''; width: 110px; height: 110px; position: absolute; right: 30px; bottom: 30px; }
.cardInfo2 .depthBox:nth-child(1) .txt:after { background: url("../img/common/bg_cardInfo2_1.png") no-repeat 0 0; }
.cardInfo2 .depthBox:nth-child(2) .txt:after { background: url("../img/common/bg_cardInfo2_2.png") no-repeat 0 0; }
.cardInfo2 .depthBox:nth-child(3) .txt:after { background: url("../img/common/bg_cardInfo2_3.png") no-repeat 0 0; }
.cardInfo3 { margin-bottom: 30px; }
.cardInfo3 .depthBox .txt:after { content: ''; width: 110px; height: 110px; position: absolute; right: 30px; bottom: 30px; }
.cardInfo3 .depthBox:nth-child(1) .txt:after { background: url("../img/common/bg_cardInfo3_1.png") no-repeat 0 0; }
.cardInfo3 .depthBox:nth-child(2) .txt:after { background: url("../img/common/bg_cardInfo3_2.png") no-repeat 0 0; }
.cardInfo3 .depthBox:nth-child(3) .txt:after { background: url("../img/common/bg_cardInfo3_3.png") no-repeat 0 0; }
.cardInfo3 .depthBox:nth-child(4) .txt:after { background: url("../img/common/bg_cardInfo3_4.png") no-repeat 0 0; }

/* BPCDKH1100 */
.cardNumInput input[type="text"], .cardNumInput input[type="password"] { padding-left: 10px; padding-right: 0; }


/*=========================================== B2B ==============================================*/
/*BEBBEL0000, BEBBBL0000*/
.diagramB2b {position: relative; width: 100%;}
.diagramB2b .listWrap01, .diagramB2b .listWrap02, .diagramB2b .listWrap03 {position: relative; left:0;}
.diagramB2b strong {position: absolute; float:left; color: #00a8f1; font-size: 16px;}
.diagramB2b ul {position: absolute;}
.diagramB2b .listWrap01:after, .diagramB2b .listWrap02:after, .diagramB2b .listWrap03:after {display:block; content:""; clear:both;}

.diagramB2b.bbel {height:710px; background: url("../img/common/img_diagram_bebbel.png") no-repeat 0 0;}
.diagramB2b.bbel .listWrap01 {top:50px;}
.diagramB2b.bbel .listWrap01 strong {left:96px; top:36px;}
.diagramB2b.bbel .listWrap01 .list01 {left:267px; top:18px;}
.diagramB2b.bbel .listWrap01 .list02 {left:565px; top:32px;}
.diagramB2b.bbel .listWrap02 {top:189px;}
.diagramB2b.bbel .listWrap02 strong {left:96px; top:29px;}
.diagramB2b.bbel .listWrap02 .list01 {left:266px; top:18px;}
.diagramB2b.bbel .listWrap02 .list02 {left:266px; top:87px;}
.diagramB2b.bbel .listWrap02 .list03 {left:266px; top:157px;}
.diagramB2b.bbel .listWrap02 .list04 {left:266px; top:268px;}
.diagramB2b.bbel .listWrap02 .list05 {left:564px; top:249px;}
.diagramB2b.bbel .listWrap02 .list06 {left:564px; top:87px;}
.diagramB2b.bbel .listWrap03 {top:559px;}
.diagramB2b.bbel .listWrap03 strong {left:96px; top:36px;}
.diagramB2b.bbel .listWrap03 .list01 {left:266px; top:32px;}
.diagramB2b.bbel .listWrap03 .list02 {left:564px; top:32px;}
.diagramB2b.bbel .listWrap04 {position:absolute; left:864px; top:86px; width:150px;}

.diagramB2b.bbbl {height:620px; background: url("../img/common/img_diagram_bebbbl.png") no-repeat 0 0;}
.diagramB2b.bbbl .listWrap01 {top:50px;}
.diagramB2b.bbbl .listWrap01 strong {left:90px; top:36px;}
.diagramB2b.bbbl .listWrap01 .list01 {left:267px; top:18px;}
.diagramB2b.bbbl .listWrap01 .list02 {left:267px; top:148px;}
.diagramB2b.bbbl .listWrap01 .list03 {left:565px; top:148px;}
.diagramB2b.bbbl .listWrap01 .list04 {left:267px; top:238px;}
.diagramB2b.bbbl .listWrap01 .list05 {left:565px; top:238px;}
.diagramB2b.bbbl .listWrap01 .list06 {left:863px; top:238px;}
.diagramB2b.bbbl .listWrap01 .list07 {left:863px; top:108px;}
.diagramB2b.bbbl .listWrap02 {top:380px;}
.diagramB2b.bbbl .listWrap02 strong {left:90px; top:36px;}
.diagramB2b.bbbl .listWrap02 .list01 {left:267px; top:18px;}
.diagramB2b.bbbl .listWrap02 .list02 {left:565px; top:37px;}
.diagramB2b.bbbl .listWrap02 .list03 {left:565px; top:148px;}
.diagramB2b.bbbl .listWrap02 .list04 {left:267px; top:148px;}

.diagramB2b.bbfl {height:622px; background: url("../img/common/img_diagram_bebbfl.png") no-repeat 0 0;}
.diagramB2b.bbfl .listWrap01 {top:50px;}
.diagramB2b.bbfl .listWrap01 strong {left:239px; top:37px;}
.diagramB2b.bbfl .listWrap01 .list01 {left:414px; top:18px;}
.diagramB2b.bbfl .listWrap01 .list02 {left:713px; top:18px;}
.diagramB2b.bbfl .listWrap01 .list03 {left:713px; top:108px;}
.diagramB2b.bbfl .listWrap01 .list04 {left:414px; top:198px;}
.diagramB2b.bbfl .listWrap01 .list05 {left:713px; top:198px;}
.diagramB2b.bbfl .listWrap02 {top:340px;}
.diagramB2b.bbfl .listWrap02 strong {left:239px; top:37px;}
.diagramB2b.bbfl .listWrap02 .list01 {left:414px; top:18px;}
.diagramB2b.bbfl .listWrap02 .list02 {left:414px; top:108px;}
.diagramB2b.bbfl .listWrap02 .list03 {left:713px; top:108px;}
.diagramB2b.bbfl .listWrap02 .list04 {left:713px; top:18px;}

.diagramB2b.bbeb {height:760px; background: url("../img/common/img_diagram_bebbeb.png") no-repeat 0 0;}
.diagramB2b.bbeb .listWrap01 {top:50px;}
.diagramB2b.bbeb .listWrap01 strong {left:90px; top:37px;}
.diagramB2b.bbeb .listWrap01 .list01 {left:266px; top:18px;}
.diagramB2b.bbeb .listWrap01 .list02 {left:564px; top:18px;}
.diagramB2b.bbeb .listWrap01 .list03 {left:564px; top:147px;}
.diagramB2b.bbeb .listWrap01 .list04 {left:266px; top:147px;}
.diagramB2b.bbeb .listWrap01 .list05 {left:266px; top:235px;}
.diagramB2b.bbeb .listWrap01 .list06 {left:564px; top:235px;}
.diagramB2b.bbeb .listWrap01 .list07 {left:862px; top:235px;}
.diagramB2b.bbeb .listWrap02 {top:379px;}
.diagramB2b.bbeb .listWrap02 strong {left:90px; top:37px;}
.diagramB2b.bbeb .listWrap02 .list01 {left:266px; top:18px;}
.diagramB2b.bbeb .listWrap02 .list02 {left:266px; top:108px;}
.diagramB2b.bbeb .listWrap02 .list03 {left:564px; top:108px;}
.diagramB2b.bbeb .listWrap02 .list04 {left:858px; top:198px;}
.diagramB2b.bbeb .listWrap02 .list05 {left:266px; top:198px;}
.diagramB2b.bbeb .listWrap02 .list06 {left:564px; top:198px;}
.diagramB2b.bbeb .listWrap02 .list07 {left:858px; top:108px;}
.diagramB2b.bbeb .listWrap02 .list08 {left:266px; top:287px;}
.diagramB2b.bbeb .listWrap02 .list09 {left:564px; top:287px;}

.diagramB2b.bbcl {height:850px; background: url("../img/common/img_diagram_bebbcl.png") no-repeat 0 0;}
.diagramB2b.bbcl .listWrap01 {top:50px;}
.diagramB2b.bbcl .listWrap01 strong {left:90px; top:37px;}
.diagramB2b.bbcl .listWrap01 .list01 {left:266px; top:18px;}
.diagramB2b.bbcl .listWrap01 .list02 {left:564px; top:18px;}
.diagramB2b.bbcl .listWrap01 .list03 {left:564px; top:147px;}
.diagramB2b.bbcl .listWrap01 .list04 {left:564px; top:237px;}
.diagramB2b.bbcl .listWrap01 .list05 {left:266px; top:147px;}
.diagramB2b.bbcl .listWrap01 .list06 {left:266px; top:326px;}
.diagramB2b.bbcl .listWrap01 .list07 {left:564px; top:326px;}
.diagramB2b.bbcl .listWrap01 .list08 {left:858px; top:326px;}
.diagramB2b.bbcl .listWrap02 {top:468px;}
.diagramB2b.bbcl .listWrap02 strong {left:90px; top:37px;}
.diagramB2b.bbcl .listWrap02 .list01 {left:266px; top:18px;}
.diagramB2b.bbcl .listWrap02 .list02 {left:266px; top:108px;}
.diagramB2b.bbcl .listWrap02 .list03 {left:564px; top:108px;}
.diagramB2b.bbcl .listWrap02 .list04 {left:858px; top:108px;}
.diagramB2b.bbcl .listWrap02 .list05 {left:266px; top:198px;}
.diagramB2b.bbcl .listWrap02 .list06 {left:564px; top:198px;}
.diagramB2b.bbcl .listWrap02 .list07 {left:858px; top:198px;}
.diagramB2b.bbcl .listWrap02 .list08 {left:266px; top:287px;}
.diagramB2b.bbcl .listWrap02 .list09 {left:564px; top:287px;}

/*=========================================== 외환 ==============================================*/
/* BPFXEF0401 */
.callCenter { margin-top: 30px; padding: 20px 30px; margin-bottom: 10px; }
.callCenter .table { display: table; width: 100%; table-layout: fixed; }
.callCenter .left { display: table-cell; width: 80px; }
.callCenter .right { display: table-cell; padding-left: 25px; }
.callCenter .icoImgCert { margin-bottom: 0; }
.callCenter .callNum { font-size: 20px; color: #d6006d; border-top: #dedede 1px solid; padding-top: 5px; }
.callCenter .txt { color: #333; padding-bottom: 10px; }

/* BPFXEF0402 */
.moveTabkeyFx { position: absolute; top: 0; right: 0; }

/* BPFXEF0402 */
.timer { text-align: center; margin-top: 15px; }
.timer span { display: inline-block; background-color: #d7006d; padding: 12px 40px; color: #fff; font-size: 20px; border-radius: 8px; }

/* BPFXEF0201 */
.mapArea { border: #dedede 1px solid; background-color: #f8f8f8; min-height: 200px; }

/* BPFXEF0200 */
.exchangeMap { background-color: #f2f2f2; padding: 20px 30px; border-radius: 10px 10px;}

/* BEFXIP1700 : links 버튼(top/bottom) 추가  */
.links.goTop, .links.goBtm {padding-left: 19px; text-decoration:none;}
.links.goTop:before, .links.goBtm:before {content:''; position: absolute; width:11px; height:13px; top:7px; left:0; z-index: 2;}
.links.goTop:before {background: url(../img/common/ico_arrow_top.png) no-repeat 0;}
.links.goBtm:before {background: url(../img/common/ico_arrow_bottom.png) no-repeat 0;}
.links.goTop > span:after, .links.goBtm > span:after {content: none;}

/* 전국지도 */
.allMap { width: 390px; height: 390px; background: url("../img/common/img_exchangeMap_all.png") no-repeat 0 0; margin: 0 auto; }
.exchangeMap.EN .allMap {background-image: url("../img/common/img_exchangeMap_all_en.png");}
#mapAll area {outline: rgba(0,0,0,0)}
.korea1 .allMap { background-position: -390px 0; }
.korea2 .allMap { background-position: -780px 0; }
.korea3 .allMap { background-position: 0 -390px; }
.korea4 .allMap { background-position: -390px -390px; }
.korea5 .allMap { background-position: -780px -390px; }
.korea6 .allMap { background-position: 0 -780px; }
.korea7 .allMap { background-position: 0 -780px; }
/* 서울지도 */
#seoulMapDiv {display: none}
.seoulMap { width: 420px; height: 360px; background: url("../img/common/img_exchangeMap_seoul.png") no-repeat 0 0; margin: 0 auto; }
.en .seoulMap {background-image: url("../img/common/img_exchangeMap_seoul_en.png");}
.seoul1 .seoulMap { background-position: -420px 0; }
.seoul2 .seoulMap { background-position: -840px 0; }
.seoul3 .seoulMap { background-position: -1260px 0; }
.seoul4 .seoulMap { background-position: -1680px 0; }
.seoul5 .seoulMap { background-position: 0px -360px; }
.seoul6 .seoulMap { background-position: -420px -360px; }
.seoul7 .seoulMap { background-position: -840px -360px; }
.seoul8 .seoulMap { background-position: -1260px -360px; }
.seoul9 .seoulMap { background-position: -1680px -360px; }
.seoul10 .seoulMap { background-position: 0px -720px; }
.seoul11 .seoulMap { background-position: -420px -720px; }
.seoul12 .seoulMap { background-position: -840px -720px; }
.seoul13 .seoulMap { background-position: -1260px -720px; }
.regionCont { padding: 20px 0; }
.regionCont .titBox { padding-bottom: 20px; border-bottom: #999 1px solid; position: relative; }
.regionCont .titBox .title { font-size: 34px; line-height: 1.2; color:#333}
.regionCont .titBox .title strong { display: block; }
.regionCont .titBox .icoTxtReturn { position: absolute; bottom: 20px; right: 0; }
.regionCont .mapBtn { margin: 40px -10px 0; }
.regionCont .mapBtn:before, .regionCont .mapBtn:after {display: table; content: ''}
.regionCont .mapBtn:after {clear: both;}
.regionCont .mapBtn li { float: left; width: 25%; padding: 0 10px 20px; box-sizing: border-box;}
.regionCont .mapBtn li button { width:100%; height:85px; text-align: center; vertical-align: middle; background-color: #fff; box-shadow: 2px 2px 5px #dcdcdc; color: #666; font-size: 16px; border-radius: 6px; line-height: 1.2; }
.regionCont .mapBtn li button:focus, 
.regionCont .mapBtn li button:hover {background-color: #deebf9; border:1px solid #0063CC;} 
.regionCont .mapBtn li button.on { background-color: #0063cc; color: #fff; }
.regionCont .mapBtn.small li { width: 20%; }
.regionCont .mapBtn.small li button { height: 50px; }
.mapList { position: relative; min-height: 40px; padding-top: 10px; box-sizing: border-box; }
.mapList .viewList { position: absolute; top: 0; right: 0; width: 220px; padding-right: 70px; box-sizing: border-box; }
.en .mapList .viewList { width: 265px; }
.mapList .viewList select { width: 100%; }
.mapList .viewList .confBtn { position: absolute; top: 0; right: 0; }
.mapList .viewList .confBtn button { min-width: 60px; }


/*=========================================== 공과금 ==============================================*/
/* BPPDPP0111 */
/* 지로납부 납부일도장 */
.popSignArea.stampTax {padding-top:30px; min-height:90px;}
.popSignArea.stampTax .name {padding:30px 0; font-size:20px; line-height: 1.5em; letter-spacing: -0.05em;}
.popSignArea.stampTax .signLogo {right:110px; bottom:34px; font-size:0;}
.popSignArea.stampTax .stamp {position:absolute; right:0; bottom:0; width:90px; height:90px; background:url(../img/common/bg_tax_stamp.png) no-repeat 0 0; overflow:hidden;}
.popSignArea.stampTax .stamp .date {position:absolute; top:37px; width:100%; text-align:center; font-size:14px; letter-spacing: -0.03em; line-height:14px;}



/*=========================================== 뱅킹관리 ==============================================*/
/* BPBKCI0300 */
.explainBox { background-color: #f8f8f8; border-radius: 10px; padding: 40px 76px; }
.bigTxtType { padding: 0 76px; }
.bigTxtType dt { padding-bottom: 20px; font-size: 34px; }
.bigTxtType dd { font-size: 18px; letter-spacing: -1px; }
.bigTxtType dd .smallTxt { padding-top: 12px; font-size: 14px; }

/* BPBKCI0300 */
.depthArea { border: #c5d1d8 1px solid; display: table; table-layout: fixed; border-radius: 5px; width: 100%; overflow: hidden; }
.depthArea.depth2 .depthBox { width: 50%; }
.depthArea.depth3 .depthBox { width: 33.33%; }
.depthArea.depth3 .depthBox { width: 25%; }
.depthArea .depthBox { display: table-cell; position: relative; box-sizing: border-box; padding: 30px 40px 30px 30px; height: 200px; }
.depthArea .depthBox:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 1px; height: 500px; background-color: #c5d1d8; }
.depthArea .depthBox:after { content: ""; display: block; position: absolute; top: 20px; left: 0; width: 13px; height: 44px;  }
.depthArea .depthBox:first-child:before, .depthArea .depthBox:first-child:after { display: none; }
.depthArea .depthBox:nth-child(1) { background-color: #fff; }
.depthArea .depthBox:nth-child(2) { background-color: #f7fbfd; }
.depthArea .depthBox:nth-child(2):after { content: ""; background:url(../img/common/bg_depth1.png) no-repeat 0 0; }
.depthArea .depthBox:nth-child(3) { background-color: #eff6fa; }
.depthArea .depthBox:nth-child(3):after { content: ""; background:url(../img/common/bg_depth2.png) no-repeat 0 0; }
.depthArea .depthBox:nth-child(4) { background-color: #e7f1f8; }
.depthArea .depthBox:nth-child(4):after { content: ""; background:url(../img/common/bg_depth3.png) no-repeat 0 0; }
.depthArea .depthBox .depthNum { padding-bottom: 10px; font-size: 20px; color: #00a8f1; }
.depthArea .depthBox .txtType dt { padding-bottom: 10px; font-size: 20px; color: #333; }
.depthArea .depthBox .txtType dd { font-size: 16px; }
.depthArea .depthBox .txtType dd span.smallTxt { display: block; padding-top: 5px; font-size: 16px; font-size: 14px; color: #777; }
.depthArea .depthBox .btnType { margin-top: 20px; }

/* BPBKCI0500 */
.infoBox.grayTable { padding: 40px 20px !important; }
.grayTable .exTit { text-align: center; padding-bottom: 20px; font-size: 34px; }
.grayTable .tableType { overflow: hidden; display: table; width: 100%; table-layout: fixed; }
.grayTable .tableType .table { overflow: hidden; display: table; width: 100%; table-layout: fixed; }
.grayTable .tableType .leftArea { display: table-cell; width: 62%; padding-right: 10px; }
.grayTable .tableType .rightArea { display: table-cell; width: 38%; padding-left: 10px; }
.grayTable .tableType .borderLine { min-height: 450px; border: #dedede 1px solid; border-radius: 10px; box-sizing: border-box; background-color: #fff; padding: 20px 20px 0; }
.grayTable .tableType .borderLine .tit { text-align: center; padding-bottom: 20px; font-size: 16px; }
.grayTable .tableType .borderLine .tableX td { vertical-align: top; }
.grayTable .tableType .borderLine .tableX { border-bottom: none; }
.grayTable .tableType .borderLine .tableX td.p25 { padding: 25px 20px; }
.grayTable .tableType .borderLine .tableX td.h140 { height: 141px; }

/* BPBKCI0301 */
.financeNameBox { display: inline-block; padding-right: 30px; color: #0063cc; font-size: 20px;  }
.financeSelect { display: inline-block; padding: 0 20px; position: relative; }
.financeSelect:after { content: ""; width: 1px; background-color: #d2d2d2; position: absolute; top: 5px; bottom: 5px; left: 0; }
.financeSelect li { display: inline-block; padding-right: 30px; font-size: 20px; }

/* BPBKCI0203 주소찾기 */
.addressTit { margin-top: 30px; padding-bottom: 15px; color: #333; font-size: 20px; }
.addressTit span { font-size: 16px; padding-left: 10px; }
.addressNum { font-size: 14px; padding: 0 10px; }
.addrSelect label { position: relative; }
.addrSelect input[type="radio"]:not(.def)+label:before, .addrSelect input[type="checkbox"]:not(.def)+label:before { vertical-align: middle; }
.addrLabel {position: absolute; top: 20px; left: 70px; display:inline-block; max-width: 500px; height: 24px; padding: 0 10px; box-sizing: border-box; line-height: 22px;  border: #cccccc 1px solid; border-radius: 3px; background-color: #fff; text-align: center; font-size: 14px; }
.addrTxt {display: inline-block; padding: 28px 0 0 10px; color: #333; max-width: 500px; vertical-align: middle; }
.addrTxt i { font-size: 14px; color: #666; }
.iptFull.addrSelect input[type="radio"][disabled]:not(.def)+label:hover,
.iptFull.addrSelect input[type="radio"][disabled]:not(.def)+label:focus,
.iptFull.addrSelect input[type="checkbox"][disabled]:not(.def)+label:hover,
.iptFull.addrSelect input[type="checkbox"][disabled]:not(.def)+label:focus { background: none; }
.iptFull.addrSelect input[type="radio"]:not(.def)+label:hover,
.iptFull.addrSelect input[type="radio"]:not(.def)+label:focus,
.iptFull.addrSelect input[type="checkbox"]:not(.def)+label:hover,
.iptFull.addrSelect input[type="checkbox"]:not(.def)+label:focus { background-color: #f8f8f8; }

/* 결재선 테이블 */
.taskBox .tableX {border-bottom:none !important;}
.taskBox .tableX:before {top:-1px;}
.taskBox.hasFinal .tableX:after {content:''; position:absolute; top:-1px; bottom:-1px; right:190px; z-index:1; border-left:20px solid #fff;}
.taskBox .tableX th {padding:15px 0;}
.taskBox .tableX td {position:relative; padding:15px 10px; text-align:left;}
.taskBox .tableX thead th > span {position:relative; display:block; border-left:1px solid #dedede; color:#666;}
.taskBox .tableX thead th:first-child > span, .taskBox .tableX thead th.final > span {border-left:none !important; color:#333;}
.taskBox .tableX thead th:first-child > span {padding-left:27px; background:url(../img/common/ico_message_medium.png) no-repeat 0 50%;}
.taskBox .tableX thead th:first-child + th > span {border-left:none !important;}
.taskBox .tableX tbody th {border-top:0; background:none; color:#666; vertical-align:top;}
.taskBox .tableX tbody th > span {position:relative; display:block; margin-top:5px; padding-left:28px;}
.taskBox .tableX tbody th > span:before {content:''; position:absolute; top:-2px; left:7px; width:12px; height:16px; background:url(../img/common/bg_taskbox_line.png) no-repeat 0 50%;}
.taskBox .tableX thead th:first-child, .taskBox .tableX tbody th {padding-left:20px; text-align:left;}
.taskBox .tableX .final {padding-left:30px; padding-right:10px !important;}
.taskBox .tableX thead th.final > span {display:inline-block; padding-left:30px; background:url(../img/common/ico_line_people.png) no-repeat 0 50%;}
.taskBox .tableX .colGroup {padding-right:10px;}
.taskBox .tableX .bbNone {border-bottom:none !important;}
.taskBox .state {display:inline-block; margin-right:3px; letter-spacing:-2em; vertical-align:middle;}
.oldChrome .taskBox .state {letter-spacing:0;}
.taskBox .state [class^=box] {position:relative; display:inline-block; height:26px; padding:0 5px; vertical-align:top; border-radius:3px; border:1px solid #4b4e68; font-size:14px; line-height:22px; color:#4b4e68; box-sizing:border-box; letter-spacing:0px;}
.taskBox .state .box {background-color:#4b4e68; color:#fff;}
.taskBox .state .boxW.ing {border-color:#d6006d; color:#d6006d;}
.taskBox .state .boxW.finish {padding-left:20px; background:url(../img/common/ico_txt_finish_smallgray.png) no-repeat 6px 50%;}
.taskBox .state.both .boxW {border-left:none; border-top-left-radius:0; border-bottom-left-radius:0;}
.taskBox .state.both .boxW:after {content:''; position:absolute; top:-1px; bottom:-1px; left:-2px; z-index:1; border-left:2px solid #4b4e68;}
.taskBox .state .links {font-size:14px; vertical-align:baseline;}
.taskBox .state .links:after {display:none;}
.taskBox .links {vertical-align:baseline;}
.taskBox .name {position:relative; display:inline-block; margin:-2px 0 0 0 !important; padding:0 !important; font-size:16px !important; vertical-align:middle;}
.taskBox .name:before {display:none !important;}
.taskBox .icoTxtPhone {width:18px; height:26px; margin-left:3px; padding:0;}
.taskBox .dropMenuBox {left:0; margin:15px 0 0 -15px !important; padding:15px 38px 15px 20px; border:2px solid #666; border-radius:5px;}
.taskBox .dropMenuBox:before {top:-11px !important; left:0 !important; margin-left:25px !important; width:18px; height:11px; background:url(../img/common/bg_signlayer.png) no-repeat 0 0;}
.taskBox .dropMenuBox li {margin-top:5px; white-space: nowrap;}
.taskBox .dropMenuBox li > * {display:inline-block; padding:0 !important; vertical-align:top;}
.taskBox .dropMenuBox li > *:hover, .taskBox .dropMenuBox li > *:focus {background:none !important;}
.taskBox .dropMenuBox .close {position:absolute; top:10px; right:10px; width:10px; height:10px; margin:0; padding:0; background:url(../img/common/btn_close_tip.png) no-repeat 50% 50%;}

/*=========================================== 비대면 ==============================================*/
/* BPNFAO0005 */
.qrInfo { box-shadow: none !important; padding: 0 !important; overflow: hidden;}
.qrInfo .titArea { background-color: #f6f6f6; border-bottom: #d2d2d2 1px solid; padding: 40px 0 30px; text-align: center;  }
.qrInfo .infoBox { background: none; }
.qrInfo [class*=col_] { padding: 0 30px !important; }
.qrInfo .qrBg { display: inline-block; padding: 10px; background-color: #f6f6f6; border-radius: 10px; }
.qrInfo .icoImgCert { position: absolute; top: 0; right: 30px; }

/* BPNFAO0002 / BPNFAN0002 */
.productService .whiteBox { height: 360px; border-color: #d2d2d2 !important; box-shadow: none !important; padding: 30px 40px; box-sizing: border-box; text-align: center; position: relative; }
.productService .whiteBox .titH3 { display: block; }
.productService .whiteBox.on { border-color: #0063cc !important; box-shadow: 5px 5px 5px rgba(0,0,0,0.07) !important; }
.productService .txtList { margin-top: 15px; padding-top: 15px; border-top: 1px solid #dedede; text-align: left; margin-bottom: 10px; } 
.productService .serviceRadio { position: absolute; top: 20px; left: 20px; }
.productService .serviceRadio input[type="radio"] {position: absolute; top: auto; display: inline-block; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: -10; box-sizing: border-box; vertical-align: top;}
.productService .serviceRadio input[type="radio"]+label:before { content:""; cursor: pointer; display: inline-block; width: 40px; height: 40px; box-sizing: border-box; border: #e0e0e0 1px solid; border-radius: 50%; background: url("../img/common/bg_service_check.png") no-repeat center 0; }
.productService .serviceRadio input[type="radio"]:checked+label:before { background-position: center -38px; border: none; background-color: #d2eeff; }
.productService .serviceRadio input[type="radio"]:focus+label:before,
.productService .serviceRadio input[type="radio"]+label:hover:before { border: #0063cc 2px solid; background-position: center -1px; }
.productService .serviceRadio input[type="radio"]:checked:focus+label:before,
.productService .serviceRadio input[type="radio"]:checked+label:hover:before { border: none; background-position: center -38px; }
.productService.onlyOne .whiteBox { height: auto; margin:0; padding: 40px 40px; }
.productService.onlyOne .col_6 { border-left: 1px solid #dedede; padding-left: 20px;  } 
.productService.onlyOne .txtList { border-top: none; margin-top: 0; padding-top: 0; } 

.chkCardList > li { position: relative; }
.chkCardList > li:before { content: ""; border-left: #dedede 1px solid; position: absolute; top: 30px; bottom: 30px; right: 16.66667%; }
.chkCardList > li input[type="radio"] {position: absolute; top: auto; display: inline-block; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: -10; box-sizing: border-box; vertical-align: top;}
.chkCardList > li input[type="radio"]+label { display: inline-block; cursor: pointer; min-width: 110px; height: 40px; padding: 0 14px 0 35px; background-color: #fff; background-image: url("../img/common/ico_check_gray.png"); background-repeat: no-repeat; background-position: 12px 50%; line-height: 40px; vertical-align: middle; text-align: center; border-radius: 4px; box-sizing: border-box; color: #555; transition: background-color 0.125s, border 0.125s; font-size: 16px; border: 1px solid #555; }
.chkCardList > li input[type="radio"]:checked+label { border: none; background-color: #0063cc; background-image: url("../img/common/ico_check_white.png"); color: #fff; } 
.chkCardList > li input[type="radio"]:focus+label,
.chkCardList > li input[type="radio"]+label:hover { background-color: #eee; border-color: #333; color: #333;  }
.chkCardList > li input[type="radio"]:checked:focus+label,
.chkCardList > li input[type="radio"]:checked+label:hover { border: none; background-color: #0063cc; background-image: url("../img/common/ico_check_white.png"); color: #fff; } 

.txt.chkCrd { position: relative; }
.txt.chkCrd .abs { display: block; right: 0; bottom: 0;}

/* BPNFAO0007 */
.otpAcco { padding: 0 !important; }
.otpAcco .iptGroup { padding: 23px 20px; }
.otpAcco button.links { font-size: 16px; background: url(../img/common/btn_secu_acco_off.png) no-repeat right 50%; padding-right: 22px; }
.otpAcco.on button.links { background: url(../img/common/btn_secu_acco_on.png) no-repeat right 50%;  }
.otpType { overflow: hidden; padding: 15px 20px; border-top: #d8d8d8 1px solid; }
.otpType .image { float: left; width: 24%; padding-right: 20px; box-sizing: border-box; text-align: center; }
.otpType .contentsText { float: right; width: 76%; box-sizing: border-box;  }
.otpType .contentsText dd { padding-top: 10px; }
.otpType .contentsText dd .txt { color: #666 !important; }
.otpType .contentsText dd ul.refList { margin-top: 5px; }
.otpType .contentsText dd li { color: #d6006d !important; }

/* BPNFPS0002 */
.cardStateArea .stateBar .box.var.on:before { display: none; }
.cardStateArea .stateBar .box.var.on.line:before { display: block; }
.cardStateArea.type4 .stateBar{ width: 100%; padding: 0 10%;}
.cardStateArea.type3 .stateBar{ width: 100%; padding: 0 20%;}
.cardStateArea.type6 .stateBar { padding: 0 30px; }
.cardStateArea.type6 .stateBar .box { width: 16.66%; padding:30px 20px;}
.cardStateArea.otpAdd { padding-bottom: 100px; }
.otpAddArea { height: 150px; box-sizing: border-box; margin-top: -75px; text-align: center; }
.otpAddArea ul { position: relative; overflow: hidden; display: inline-block; padding-left: 44px; background: url("../img/common/bg_nf_more_start.png") no-repeat 0 0; }
.otpAddArea ul:before { content: ""; border-top: #d2d2d2 1px solid; position: absolute; top: 0; left: 43px; right: 44px; z-index: 2;  }
.otpAddArea ul:after { content: ""; border-top: #d2d2d2 1px solid; position: absolute; bottom: 0; left: 43px; right: 44px; z-index: 1; }
.otpAddArea ul li { float: left; width: 205px; height: 150px; padding: 15px 44px 0 0; text-align: center; box-sizing: border-box; background: #fff url("../img/common/bg_nf_more_off.png") no-repeat right 0; position: relative; z-index: 1; }
.otpAddArea ul li [class*=icoImgCert] { margin-bottom: 10px; }
.otpAddArea ul li.on { background: #fff url("../img/common/bg_nf_more_on.png") no-repeat right 0; color: #fff; }
.otpAddArea ul li.on:before { content: ""; width: 44px; height: 150px; background: url("../img/common/bg_nf_more_on_left.png") no-repeat 0 0; position: absolute; top: 0; left: -44px; }
.otpAddArea ul li.on.red { background: #fff url("../img/common/bg_nf_more_red_on.png") no-repeat right 0; }
.otpAddArea ul li.on.red:before { content: ""; width: 44px; height: 150px; background: url("../img/common/bg_nf_more_on_left_red.png") no-repeat 0 0; position: absolute; top: 0; left: -44px; }
.otpAddArea ul li.on + li.on.red:before { content: ""; width: 44px; height: 150px; background: url("../img/common/bg_nf_more_right_on_two.png") no-repeat 0 0; position: absolute; top: 0; left: -44px; }
.otpAddArea ul li:first-child.on:before { content: ""; width: 44px; height: 150px; background: url("../img/common/bg_nf_more_start_on.png") no-repeat 0 0; position: absolute; top: 0; left: -44px; }
.otpAddArea ul li.on a { color: #fff; }
.otpAddArea ul li.on a span:after { border-color: #fff; }
.otpAddArea ul li.on a:focus,
.otpAddArea ul li.on a:hover { outline: #fff 1px dotted; }
/* icon 이미지 */
.icoImgCert.otp1 {background-image:url(../img/common/bg_card_state2_on.png);}
.icoImgCert.otp2 {background-image:url(../img/common/bg_card_state3_on.png);}
.icoImgCert.otp2.off {background-image:url(../img/common/bg_card_state3_off.png);}
.icoImgCert.otpAdd {background-image:url(../img/common/ico_nf_otp_add_on.png);}
.icoImgCert.otpAdd.off {background-image:url(../img/common/ico_nf_otp_add_off.png);}
.icoImgCert.otpBack {background-image:url(../img/common/ico_nf_otp_back.png);}
.icoImgCert.checkCard {background-image:url(../img/common/ico_nf_checkcard.png);}
.icoImgCert.checkCardFail {background-image:url(../img/common/ico_nf_checkcard_fail.png);}
.icoImgCert.otpDel {background-image:url(../img/common/ico_nf_otp_del.png);}
/* cardStateArea on/off 이미지 */
.cardStateArea .icoImgCert.nf1 {background-image:url(../img/common/ico_nf1_on.png);}
.cardStateArea .icoImgCert.nf2 {background-image:url(../img/common/ico_nf2_off.png);}
.cardStateArea .icoImgCert.nf3 {background-image:url(../img/common/ico_nf3_off.png);}
.cardStateArea .box.on .icoImgCert.nf2 {background-image:url(../img/common/ico_nf2_on.png);}
.cardStateArea .box.on .icoImgCert.nf3 {background-image:url(../img/common/ico_nf3_on.png);}
/* CASE1. 계좌개설(신규고객) 신청 시 */
.cardStateArea .icoImgCert.new1 {background-image:url(../img/common/ico_nf_new1_off.png);}
.cardStateArea .icoImgCert.new2 {background-image:url(../img/common/ico_nf_new2_off.png);}
.cardStateArea .box.on .icoImgCert.new1 {background-image:url(../img/common/ico_nf_new1_on.png);}
.cardStateArea .box.on .icoImgCert.new2 {background-image:url(../img/common/ico_nf_new2_on.png);}
/* CASE3. OTP 발급·배송 신청 시 */
.cardStateArea .icoImgCert.otp {background-image:url(../img/common/ico_nf_otp_off.png);}
.cardStateArea .box.on .icoImgCert.otp {background-image:url(../img/common/ico_nf_otp_on.png);}
/* CASE4. 비대면 제변경거래 시 */
.cardStateArea .icoImgCert.etc1 {background-image:url(../img/common/ico_nf_etc1_off.png);}
.cardStateArea .icoImgCert.etc2 {background-image:url(../img/common/ico_nf_etc2_off.png);}
.cardStateArea .icoImgCert.etc3 {background-image:url(../img/common/ico_nf_etc3_off.png);}
.cardStateArea .icoImgCert.etc4 {background-image:url(../img/common/ico_nf_etc4_off.png);}
.cardStateArea .icoImgCert.etc5 {background-image:url(../img/common/ico_nf_etc5_off.png);}
.cardStateArea .icoImgCert.etc6 {background-image:url(../img/common/ico_nf_etc6_off.png);}
.cardStateArea .icoImgCert.etc7 {background-image:url(../img/common/ico_nf_etc7_off.png);}
.cardStateArea .icoImgCert.etc8 {background-image:url(../img/common/ico_nf_etc8_off.png);}
.cardStateArea .icoImgCert.etc9 {background-image:url(../img/common/ico_nf_etc9_off.png);}
.cardStateArea .box.on .icoImgCert.etc1 {background-image:url(../img/common/ico_nf_etc1_on.png);}
.cardStateArea .box.on .icoImgCert.etc2 {background-image:url(../img/common/ico_nf_etc2_on.png);}
.cardStateArea .box.on .icoImgCert.etc3 {background-image:url(../img/common/ico_nf_etc3_on.png);}
.cardStateArea .box.on .icoImgCert.etc4 {background-image:url(../img/common/ico_nf_etc4_on.png);}
.cardStateArea .box.on .icoImgCert.etc5 {background-image:url(../img/common/ico_nf_etc5_on.png);}
.cardStateArea .box.on .icoImgCert.etc6 {background-image:url(../img/common/ico_nf_etc6_on.png);}
.cardStateArea .box.on .icoImgCert.etc7 {background-image:url(../img/common/ico_nf_etc7_on.png);}
.cardStateArea .box.on .icoImgCert.etc8 {background-image:url(../img/common/ico_nf_etc8_on.png);}
.cardStateArea .box.on .icoImgCert.etc9 {background-image:url(../img/common/ico_nf_etc9_on.png);}


/* BEBMDD0100 */
.nameList { padding: 0 5px; min-width: 100px; } 


/*=========================================== 퇴직연금 ==============================================*/
/* 퇴직연금 상단 영역 */
.retireTitWrap{position:relative; padding-bottom:20px; border-bottom:1px solid #ccc; }
.retireTitWrap:after{content:""; display:block; clear:both}
.retireTitWrap .title {display:inline-block; font-size:16px; vertical-align:middle; color: #333;}
.retireTitWrap .btnD { margin-left:20px; font-size:16px}

/* BRIJIJ0010 */
.pdfView { min-height: 300px; text-align: center; }

/* BRIJIJ0005 */
.confirmBox { text-align: center; padding: 20px 0 0 0; }
.confirmBox dt { font-size: 24px; color: #333; }
.confirmBox dd { padding-top: 10px; font-size: 16px; color: #333; }

.irpJoinSelect > .col_4 { position: relative; padding-top: 50px;  }
.irpJoinSelect > .col_4 .blueBox { height: 380px; padding: 50px 22px 26px; box-sizing: border-box; border: #0063cc 2px solid; }
.irpJoinSelect .irpSelTit { width: 100%; height: 75px; font-size: 24px; display: table; table-layout: fixed; color: #333; }
.irpJoinSelect .irpSelTit span { display: table-cell; width: 100%; vertical-align: middle; height: 75px; text-align: center; }
.irpJoinSelect .irpSelCont { padding: 40px 0 15px; margin-top: 20px; position: relative; }
.irpJoinSelect .irpSelCont .selTop { position: absolute; top: 0; left: 0; right: 0; text-align: center;  }
.irpJoinSelect .irpSelCont .selTop span { vertical-align: bottom; }
.irpJoinSelect .irpSelCont .line { border-top: #666 1px solid; padding-top: 15px; height: 90px; }
.irpJoinSelect > .col_4:after { content: ""; width: 100px; height: 100px; position: absolute; top: 0; left: 50%; margin-left: -50px; }
.irpJoinSelect > .col_4:nth-child(1):after { background: url("../img/common/bg_irp_join1.png") no-repeat 0 0; }
.irpJoinSelect > .col_4:nth-child(2):after { background: url("../img/common/bg_irp_join2.png") no-repeat 0 0; }
.irpJoinSelect > .col_4:nth-child(3):after { background: url("../img/common/bg_irp_join3.png") no-repeat 0 0; }

.irpTotal span { display: inline-block; height: 45px; line-height: 45px; padding-right: 15px; font-size: 16px; color: #333; float: left; }
.irpTotal .refList { float: left; height: 45px; }
.irpTotal .refList .pointC1 { font-size: 14px !important; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; }

/* BRIJIJ0009 */
.openList { border-bottom: #dedede 1px solid; }
.openList .tit { padding: 15px 10px; border-top: #666 2px solid; border-bottom: #dedede 1px solid; background-color: #f5f7fb; font-size: 20px; }
.openList .cont { border-bottom: #dedede 1px solid; padding: 20px 10px 10px; }
.openList .cont.last { border: none; }
.surveyArea dt { color: #666; }
.surveyArea dd { padding: 15px 15px; margin-bottom: 10px; }
/* 투자성향결과(BRIJIJ0009,BPFNFL0900) */
.tendencyResult {margin-top:40px; margin-left:0; margin-right:0; padding-top:40px; padding-bottom:40px; padding-left:0;}
.tendencyResult [class*=col_] {max-width:100%;}
.tendencyResult .resultImg { margin: 0 auto; width: 285px; height: 266px; }
.tendencyResult.level1 .resultImg { background: url("../img/common/img_tendency_level1.png") no-repeat 0 0; }
.tendencyResult.level2 .resultImg { background: url("../img/common/img_tendency_level2.png") no-repeat 0 0; }
.tendencyResult.level3 .resultImg { background: url("../img/common/img_tendency_level3.png") no-repeat 0 0; }
.tendencyResult.level4 .resultImg { background: url("../img/common/img_tendency_level4.png") no-repeat 0 0; }
.tendencyResult.level5 .resultImg { background: url("../img/common/img_tendency_level5.png") no-repeat 0 0; }
.tendencyResult .titH3 {background: none; padding-left: 0;}
.tendencyResult .titH3 + .txtM {margin-top:10px; margin-bottom:-10px;}
.tendencyResult .infoBox {margin-top:20px; padding-top:20px; padding-bottom:20px;}
.tendencyResult.level1 .infoBox, .tendencyResult.level2 .infoBox {background-color:#f2f9fe;}
.tendencyResult.level4 .infoBox, .tendencyResult.level5 .infoBox {background-color:#fff5f5;}
.tendencyResult .infoBox .line > li { text-align: center; }
.tendencyResult .infoBox .line > li span { display: block; margin-left:-40px; margin-right:-40px; font-size: 16px; padding-bottom: 10px; }
.tendencyResult .infoBox .line > li strong { display: block; margin-left:-40px; margin-right:-40px; font-size: 24px; }
.tendencyResult.level1 .infoBox strong.levelColor { color: #118000; }
.tendencyResult.level2 .infoBox strong.levelColor { color: #eba600; }
.tendencyResult.level3 .infoBox strong.levelColor { color: #dc6800; }
.tendencyResult.level4 .infoBox strong.levelColor { color: #d7006d; }
.tendencyResult.level5 .infoBox strong.levelColor { color: #e00000; }
.tendencyResult .infoBox + .txt, .tendencyResult .infoBox + .txtList { margin-top: 20px; }
.tendencyResult .boxLineT {margin-top:36px; margin-bottom:-40px; padding-top:16px; padding-bottom:20px; padding-left:40px;}
.tendencyResult .boxLineT:before {left:0 !important;}

/* BREWPM0300 */
.absoluteLinks { position: absolute; top: 10px; right: 0; }

/* BREWSM0300 */
.titIptGroup{position:relative; display: inline-block; vertical-align:top; font-size:24px; letter-spacing: -0.025em; color: #333;}
.titIptGroup input[type="checkbox"]:not(.def)+label{color:#333; line-height: 1.458em; vertical-align:top}
.titIptGroup input[type="checkbox"]:not(.def)+label:before,
.titIptGroup input[type="checkbox"]:not(.def):checked+label:after{top:10px}
.titIptGroup .gap{color:#333; line-height: 1.458em; vertical-align:top}

/* BRCSUG0000 */
.btnPensionInfo{position:absolute; top:263px; right:206px;}

/* BRSCPS1000 */
.imgPensionGuide{height:90px;}


/* BREWCS0300 */
.grayBox.approvalResult {padding:30px}
.approvalResult table.tableY.noLine td {padding-bottom:0}
.approvalResult table.tableY.noLine td strong {display:inline-block; position:relative;}
.approvalResult table.tableY.noLine td strong:before {content:''; position:absolute; left:-22px; top:3px; bottom:1px; border-left:1px solid #ccc}
.approvalResult table.tableY.noLine td:first-child strong:before {content:none;}


/* 퇴직연금 - 영상 자막영역 */
.subTitle {overflow-y:auto; width:100%; height:130px; padding:15px 20px; box-sizing:border-box; background-color:#f8f8f8;}

/*=========================================== 퇴직연금 - 간편서비스 ==============================================*/
.mask{overflow:hidden}
.popService {display:block; position: fixed; top:0; left: 0; right:0; bottom:0; width:100%; height:100%; overflow:auto;  background-color:#e9ecf3; z-index: 500; box-sizing: border-box; outline:rgba(0,0,0,0.5); z-index:600}
.popService:before{content: ''; position:absolute; top:0; left:0; right:0; width:100%; min-width:1192px; height:274px; z-index: -1;
	background: -webkit-linear-gradient(to right, #1775d7 0%, #b528cb 100%);
	background: linear-gradient(to right, #1775d7 0%, #b528cb 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1775d7', endColorstr='#b528cb', GradientType=1);
}
.popService .serviceContain{display:block; width:100%; padding:0;}
.popService .titH2{padding:16px 0 21px 0}
.popService .titH3{padding-left:19px; background:url('../img/common/bul_h3.png') no-repeat 0 10px;}
.popService .titArea {margin-top:30px; padding-bottom:13px; min-height: 34px; box-sizing: border-box;}
.popService .titArea:first-of-type{margin-top:-7px;}
.popService .titArea.line{ border-bottom:2px solid #333; padding-bottom:30px; }
.popService .tooltip{z-index:601}
.popService .titArea .titH3 + *{display:inline-block; margin-left:10px; margin-bottom:0}
.popService .shapeBox [class*=titH]{display:inline-block; vertical-align:middle;}

/* 헤더영역 */
.popService .serviceHeader{position:relative; padding-right:17px; box-sizing: border-box; background:none; z-index:700}
.popService .topArea{position:relative; width:1192px; margin:0 auto; padding-top:12px}
.popService .topArea:before{content:""; display:block; width:100%; height:1px; position:absolute; bottom:0; left:0; background:linear-gradient(to right, #81a6e6,#c585e1); opacity:1; z-index:-1}
.popService .serviceBtnClose {position:absolute; top:24px; right:0; padding-left:34px; vertical-align: middle; font-size:16px; color:#fff; background: url(../img/common/btn_pop_close.png) no-repeat left center;}
.popService .customSlt.retire{display:inline-block; min-width:220px; margin-left:20px; vertical-align:middle}
.popService .customSlt.retire .ipt{font-size:18px; border:2px solid #96a8e7; border-radius:40px 40px; color:#fff; background:none}
.popService .customSlt.retire .ipt:after{background:url('../img/common/btn_pop_select_retire.png') no-repeat 0 0}
.popService .customSlt.retire .customSltBox button{height:50px; font-size:18px}
.popService .customSlt.retire .customSltBox:before{display:none}
.popService .customSlt.retire.on .customSltBox{top:0; padding:15px 0; border:2px solid #4b4e68; border-radius:20px; background-color:#fff}
.popService .customSlt.retire .ipt:focus, .popService .customSlt.retire .ipt:hover {border-color:#eef2ff; box-shadow: 0 0px 6px rgba(255,255,255,0.9);}
.popService .retireTitWrap{padding-bottom:13px; border-bottom:0}
.popService .retireTitWrap .title{font-size:18px; color:#fff; font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important}
.popService .serviceMenu{position:relative; width:1192px; margin:0 auto; padding:18px 0}
.popService .serviceMenu ul:after{content:""; display:block; clear:both}
.popService .serviceMenu ul > li:before{content:""; display:block; position:absolute; top:3px; left:-12px; width:23px; height:46px; background:url('../img/common/bg_service_arrow.png') no-repeat 0 0;}
.popService .serviceMenu ul > li{position:relative; width:20%; float:left; text-align:center;}
.popService .serviceMenu ul > li:first-child:before{display:none}
.popService .serviceMenu ul > li > a{position:relative; display:inline-block; width:206px; padding:10px 0; box-sizing:border-box; font-size:20px; color:#fff}
.popService .serviceMenu ul > li > a:hover:before{content:"";position:absolute;top:0; left:0; width:100%; height:100%;background:#fff; border-radius:25px; opacity:0.1}
.popService .serviceMenu ul > li.on >a{background:#fff; border-radius:25px; color:#333}
.popService .serviceMenu ul > li.on:after{content:""; display:block; position:absolute; bottom:-20px; left:50%; width:34px; height:10px; margin-left:-17px; background:url('../img/common/bg_service_arrow_on.png') no-repeat 0 0;}
/* .serviceMenu.num6 타입  */
.popService .serviceMenu.num6 ul > li{position:relative; width:16.6%; float:left; text-align:center;}
.popService .serviceMenu.num6 ul > li > a{position:relative; display:inline-block; width:164px; padding:10px 0; box-sizing:border-box; font-size:18px; color:#fff}
.popService .serviceMenu.num6 ul > li.on >a{background:#fff; border-radius:25px; color:#333}
/* .serviceMenu.num4 타입(20.11.05) */
.popService .serviceMenu.num4 ul > li{position:relative; width:25%; float:left; text-align:center;}
.popService .serviceMenu.num4 ul > li > a{position:relative; display:inline-block; width:255px; padding:10px 0; box-sizing:border-box; font-size:18px; color:#fff}
.popService .serviceMenu.num4 ul > li.on >a{background:#fff; border-radius:25px; color:#333}
/* .serviceMenu.num4 긴줄타입(23.09.12) */
.popService .serviceMenu.num4.multi ul > li {width:23%;}
.popService .serviceMenu.num4.multi ul > li.longM {width:31%;}
.popService .serviceMenu.num4.multi ul > li > a {width:90%;}


/* 컨텐츠영역 */
.popService .serviceCont{position:relative; width:1192px; margin:0 auto; background-color:#f6f8fb; border-radius:8px; z-index:600}
.popService .serviceCont:after{content:""; display:block; position:absolute; bottom:-1px; right:-6px; width:52px; height:70px; background: url(../img/common/bg_box_edge_service.png) no-repeat 0 0;}
.popService .shapeBox.service{padding:30px; min-height:628px; border:none; background-color:#fff; box-shadow: 6px 6px 6px rgba(0,0,0,0.07);}
.popService .shapeBox.service:after{display:none}
.popService .shapeBox.service .scroll{box-sizing: border-box;}
.popService .shapeBox.service .scroll:not(.on) {outline:rgba(0,0,0,0);}
.popService .shapeBox.service .scroll.on {height:628px; overflow-x:hidden; overflow-y:auto; padding-right:7px}
.popService .shapeBox.service .scroll.on:focus{outline-style:dotted; outline-color: #666; outline-width: 1px;}
.popService .serviceCustom{position:relative; padding:17px 30px 18px;z-index:600}
.popService .serviceCustom:after{content:""; display:block; clear:both}
.popService .serviceCustom .fl{padding-top:3px;}
.popService .serviceCustom .titNoti{position:relative; display:inline-block; padding:5px 8px 4px 11px; margin-right:10px; font-size:14px; color:#fff; background-color:#4b4e68; border-radius:2px 0 0 2px; vertical-align:middle}
.popService .serviceCustom .titNoti:after{content:""; display:block; position:absolute; top:0; right:-9px; width:10px; height:30px; background:url('../img/common/bg_service_notice.png') no-repeat 0 0;}
.popService .serviceCustom .txtNoti{margin-left:20px; max-width:380px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align:middle}
.popService .serviceCustom .titCustom{position:relative; display:inline-block; margin-right:10px; padding-top:2px; font-size:18px; color:#666; vertical-align:middle}
/* 유의사항 : 버튼 */
.popService .serviceNotice{position:absolute; top:0; right:-43px;z-index:600}
.popService .popServiceNotice{display:inline-block; width:30px; height:30px; font-size:20px; color:#333; text-align:center; border-radius:30px 30px; background-color:#eba600; box-shadow: 2px 2px 2px rgba(0,0,0,0.04);}
.popServiceNotice .popHeader .serNotiClose{display:inline-block; width:30px; height:30px; margin-left:6px; vertical-align:middle; background: url(../img/common/btn_pop_close.png) no-repeat center;}

/*=========================================== my KDB ==============================================*/
.myKDB {position: relative; opacity: 0}
.myKDB.onLoad {opacity: 1;}
.myKDB .links:after {content: none}
.myKDB .links > span, .myKDB .links:hover > span, .myKDB .links:focus > span {color:#0063cc; text-shadow:none !important}
.myKDB .links > span:after {opacity: 0}
.myKDB .links:hover > span:after, .myKDB .links:focus > span:after {opacity: 1}
.myKDB .btnArea {margin-top:20px;}
.myKDB .btnArea .txtItem li {margin-left: 37px;}
.myKDB .btnArea .txtItem li:before {margin-left:-11px; left:-10px;}

.kdbItem {position:relative; width:546px; margin-bottom:40px; box-sizing: border-box; float: left;/*테스트용*/}
.kdbItem.right {float: right;/*테스트용*/}
.kdbItem .titArea .icoTxtIntro {margin-top:5px; padding-bottom: 0}
.kdbItem .titArea {padding-bottom: 0}
.myKDB .kdbItem .titH3 {padding-left: 0; background: none; color:#333}

.toggleRadio {position: relative;}
.toggleRadio:after{content:''; position: absolute; top:0; bottom:0; left:20px; right:20px; background-color: #4b4e68;}
.toggleRadio > div {position:relative; display:inline-block; margin-left:-13px; vertical-align: top;}
.toggleRadio > div:first-child {margin-left:0px}
.toggleRadio > div:last-child {float: right;}
.toggleRadio input[type=radio] {position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; -webkit-appearance: none; z-index: 1; cursor: pointer;}
.toggleRadio input[type=radio]:focus { outline-style: dotted; outline-color: #777; outline-width: 1px;}
.toggleRadio label {position:relative; display: block; padding: 0 20px; min-width:84px; border-radius: 17px; box-sizing:border-box; background-color: #4b4e68; border:1px solid #4b4e68; color:#fff; vertical-align: top; box-sizing: border-box; line-height:32px; text-align: center; cursor: pointer; z-index: 2;}
.toggleRadio input[type=radio]:checked + label {background-color: #fff; color:#333; z-index: 3}

.myKDB .noData {display:table; width:100%; min-height:140px; margin-top:25px; background: #F8F8F8; text-align: center; vertical-align: middle;}
.myKDB .noData > div {display:table-cell; vertical-align: middle;}
.myKDB .noData p {padding-top: 45px; background: url(../img/common/mykdb/ico_no_data.png) no-repeat center 0;}

/* 개인정보영역 */
.myKDB .topBox {position:relative; padding:0; margin-bottom:40px; overflow: hidden;}
.myKDB .topBox .myInfo {padding: 30px 0;}
.myKDB .topBox:before, .myKDB .topBox:after {content:''; position: absolute; left:33.333333%; top:107px; bottom:30px; border-right: 1px solid #ccc;}
.myKDB .topBox:after {left: auto !important; right: 33.3333333%;}
.myKDB .topBox .topGray {padding: 24px 30px 27px; background: #f8f8f8}
.myKDB .topBox .infoSection {float: left; width:33.333333%; padding: 0 30px 34px 100px; box-sizing: border-box;}
.myKDB .topBox .infoSection > .linkGroup {position: absolute; bottom:30px;}
.myKDB .topBox .grade {background: url(../img/common/mykdb/ico_grade.png) no-repeat 30px 0;}
.myKDB .topBox .gradeInfo {margin-top:-5px; font-size: 20px; box-sizing: border-box;}
.myKDB .topBox .contact {background: url(../img/common/mykdb/ico_member.png) no-repeat 30px 0;}
.myKDB .topBox .contact img {vertical-align: middle; margin-right: 10px;}
.myKDB .topBox .notice {background: url(../img/common/mykdb/ico_noti.png) no-repeat 30px 0;}
.myKDB .topBox [class*=List] {margin-top:-5px; margin-bottom: 5px;}
.myKDB .topBox [class*=List] li {height:25px; margin-top:9px;}
.myKDB .topBox [class*=List] li:first-child {margin-top:0;}

.myKDB .sectionTit {display:block; margin: -6px 0 15px 0; font-size: 20px; }
.myKDB .topBox .infoSection.def {padding-left: 30px; color:#333}
.myKDB .gradeBenefit {height:46px; padding-left:65px; margin:-10px auto 30px 30px; background:url(../img/common/mykdb/ico_grade.png) no-repeat 0 0; font-size:20px; line-height: 43px; color:#333; text-shadow: none}
.myKDB .gradeBenefit .txt {text-shadow: none;}
.myKDB .txtList.w50 li {float:left; width: 50%; box-sizing: border-box; vertical-align: top}
.myKDB .txtList.w50:before, .myKDB .txtList.w50:after {content: ''; display: table}
.myKDB .txtList.w50:after {clear: both}
.myKDB .topBox [class*=List].w50 li {margin-top:0; margin-bottom: 9px;}

/* 2단 타입 추가 */
.myKDB .topBox.topboxType02:after {display:none;}
.myKDB .topBox.topboxType02:before {left:50%;}
.myKDB .topBox.topboxType02 .infoSection {width:50%;}


/* 자주찾는 계좌 */
.favList {margin:0 -10px -10px;}
.favList > li {float:left; width:263px; margin:10px;}
.favList .shapeBox {position:relative; height: 231px; padding:20px 30px; border-color:#666; box-sizing: border-box;}
.favList .shapeBox:after {background: url(../img/common/mykdb/bg_box_shape.png) no-repeat 0 0;}
.favList .btnWrap {position: absolute; left:0; right:0; bottom:0; border-bottom-left-radius: 8px; overflow: hidden; height: 75px;}
.favList .shapeBox .tit {display:inline-block; height:22px; padding:0 14px; border-radius: 20px; border:1px solid #009add; color:#0079b8; font-size: 14px; vertical-align: top}
.favList .shapeBox .tit.FX {color: #a466cf; border-color: #724ba9;}
.favList .shapeBox .tit.LN {color: #df7300; border-color: #b85f00;}
.favList .shapeBox .tit.FN {color: #e54e80; border-color: #d83072;}
.favList .shapeBox .tit.BR {color: #a49447; border-color: #817037;}
.favList .shapeBox .tit.IL {color: #26a7b5; border-color: #007993;}
.favList .shapeBox .tit.IS {color: #80ab10; border-color: #477d00;}
.favList .shapeBox .accInfo {height: 72px; margin-top:4px;}
.favList .shapeBox em.bold {display: block; overflow: hidden; text-overflow: ellipsis; color:#333; white-space: nowrap; margin-right: -10px;}
.favList .shapeBox .num {color:#666; font-size: 14px;}
.favList .shapeBox .amount {text-align: right;} 
.favList .shapeBox .amount .txtM {display: block;}
.favList .shapeBox .amount strong.bold {display:inline-block; margin:-2px 0 0 5px; font-size: 20px; color:#333}
.favList .shapeBox .amount [class*=unit] {font-size: 14px;}  
.favList .txt.plus, .favList .txt.minus {margin-left: 5px; padding-left: 12px; background-position: 0 center;}

.favList .btnWrap .btns {position: absolute; left:0; right:0; top:100px; padding: 25px 0; border-top:1px solid #e7e7e7; background-color: #fafafa; text-align: center; transition:top 0.25s ease-in-out}
.favList li.on .btnWrap .btns {top:0;}

.favList button.shapeBox {width:100%; background-color: #f8f8f8; color:#666; border-color:#d2d2d2; box-shadow: none; font-size: 16px; line-height: 1.8em; transition:background-color 0.25s ease-in-out;}
.favList button.shapeBox:after {bottom: -1px; right: -1px; width: 27px; height: 37px; background: url(../img/common/bg_box_edge_gray_shadow_none.png) no-repeat 0 0; }
.favList button.shapeBox > span {position:relative; display:block; padding-top:25px; transition:color 0.25s ease-in-out}
.favList button.shapeBox > span:after, .favList button.shapeBox > span:before {content:''; position: absolute; top:0; left:50%; width:1px; height: 17px; background-color: #666; transition:all 0.25s ease-in-out}
.favList button.shapeBox > span:before {width:17px; height: 1px; margin-left:-8px; top:8px;}
.favList button.shapeBox:hover, .favList button.shapeBox:focus {color:#fff; background-color: #0063cc;} 
.favList button.shapeBox:hover > span:after, .favList button.shapeBox:focus > span:after {width:3px; height: 21px; margin-left:-1px; top:-2px; background-color:#fff; transform:rotate(180deg)}
.favList button.shapeBox:hover > span:before, .favList button.shapeBox:focus > span:before {height:3px; width:21px; top:7px; margin-left:-10px; background-color:#fff; transform:rotate(180deg)} 

/* 알아서 챙겨주는 이체 */
.smartTrans .titArea {position: static;}
.smartTrans .titH3.smartIco {padding: 10px 60px 0 0; background: url(../img/common/mykdb/ico_noti2.png) no-repeat right 2px;}
.smartTrans .toggleRadio {position: absolute; top:26px; right: 30px;}
.smartTrans .listItem {position:relative; margin-top:20px}
.smartTrans .listItem:first-child {margin-top: 25px;}
.smartTrans .listItem label {display: table; width: 100%; min-height:78px; background: #e4f1fe url(../img/common/mykdb/bg_mykdb_chk.png) no-repeat 20px center; border-radius: 10px; color:#333; transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out}
.smartTrans .listItem .info {display: table-cell; padding:15px 20px 15px 60px; vertical-align: middle;}
.smartTrans .listItem .info > strong {position: relative; display: inline-block;padding-left: 18px; }
.smartTrans .listItem .info > strong:before {content: ''; position: absolute; left:9px; top:7px; bottom:4px; border-left: 1px solid #333; transition: border-color 0.15s ease-in-out}
.smartTrans .listItem .info > strong:first-child {padding-left: 0}
.smartTrans .listItem .info > strong:first-child:before {content: none}
.smartTrans .listItem .info .num {display: block; color:#666; transition: color 0.15s ease-in-out}
.smartTrans .listItem .amount {display: table-cell; padding-right:20px; vertical-align: middle; text-align: right; font-size: 20px;}
.smartTrans .listItem input[type=radio] {position: absolute; top: 1px; bottom: 1px; left: 0; right: 0; width: 100%; height: 98%; -webkit-appearance: none; z-index: 1; cursor: pointer;}
.smartTrans .listItem input[type=radio]:focus + label {background: #0063cc url(../img/common/mykdb/bg_mykdb_chk_focus.png) no-repeat 20px center;; color:#fff} 
.smartTrans .listItem input[type=radio]:focus + label .num {color:#fff}
.smartTrans .listItem label {position: relative; z-index: 2; cursor: pointer;}
.smartTrans .listItem input[type=radio]:checked + label {background: #0063cc url(../img/common/mykdb/bg_mykdb_chk_on.png) no-repeat 20px center; color:#fff}
.smartTrans .listItem input[type=radio]:checked + label .num {color:#fff}
.smartTrans .listItem input[type=radio]:checked + label strong:before {border-color:#fff}

.myKDB .smartTrans .txtItem > li {margin-left:37px}
.myKDB .smartTrans .txtItem > li:before {top:50%; bottom: auto; height: 16px; margin-top:-8px}
.smartTrans [class*=mykdbIco] {min-height:34px; padding-left: 47px; background: url(../img/common/mykdb/ico_trans.png) no-repeat 0 center;}
.smartTrans [class*=mykdbIco] > span {line-height: 32px;}
.smartTrans .mykdbIcoAuto {padding-left:51px; background: url(../img/common/mykdb/ico_auto_trans.png) no-repeat 0 center;}
.smartTrans .mykdbIcoSearch {padding-left:47px; background: url(../img/common/mykdb/ico_auto_search.png) no-repeat 0 center;}

/* 최근 카드 승인내역 */
.kdbCard .whiteBox {position:relative; padding-top:30px; padding-bottom:36px; border-color: #d2d2d2; background: #f3f6f8}
.kdbCard .whiteBox:after {content: ''; display:block; position: absolute; height:9px; bottom:0; left:28px; right:20px; background: url(../img/common/mykdb/bg_card_box.png) repeat-x 0 bottom; }
.kdbCard .cardInfo {position:relative; padding-left: 132px; margin-top: 25px;}
.kdbCard .cardInfo .cardImg {position: absolute; left:0px; top:0; width:112px; height:70px; border-radius: 4px; }
.kdbCard .cardInfo select.ipt {padding-right: 30px; border-color: #f8f8f8}
.kdbCard .cardInfo .amountArea {margin-top:12px}
.kdbCard .cardInfo .amountArea .labelTxt {margin-top:5px; float: left; color:#333} 
.kdbCard .cardInfo .amountArea .amount {float: right; font-size: 20px} 
.kdbCard .cardInfo .amountArea .amount .unit {font-size: 16px}
.kdbCard .noData {background-color: #fafbfc} 

.useList {margin:25px -30px 0 -30px;}
.useList > li {border-bottom: 1px solid #dedede;}
.useList > li .wrap {display: table; width: 100%; min-height: 80px; padding:20px 30px; box-sizing:border-box; }
.useList > li:first-child {border-top: 1px solid #dedede;}
.useList .grayTxt {display: table-cell; vertical-align: middle; color:#999; font-size: 14px;}
.useList .grayTxt em.bold {display: block; margin-top:3px; font-size: 16px; color:#666}
.useList .grayTxt .txtItem {display: inline-block;}
.useList .amount {display: table-cell; vertical-align: middle; text-align: right; font-size: 18px; color: #333}
.useList .amount .unit {color:#666; font-size: 16px}

/* 최근 이체내역 */
.recentTrans .whiteBox {position:relative; padding-top:30px; background-color: #f8f8f8; border-color: #d2d2d2;}
.recentTrans .useList .grayTxt .topTxt {position: absolute; left:30px; transition: all 0.2s ease-in-out;}
.recentTrans .useList .grayTxt .date {display:inline-block; margin-right: 5px; transition: all 0.2s ease-out; max-height: 20px;}
.recentTrans .useList .grayTxt em.bold {padding-top:20px; transition: all 0.2s ease-in-out;}
.recentTrans .useList > li {position:relative; transition: all 0.2s ease-in-out; box-sizing: border-box; overflow: hidden;}
.recentTrans .useList > li .blueBtn {position:absolute; top:0; bottom:0; right:-140px; width:133px; background-color: #0063cc; color:#fff; font-size: 16px; transition: all 0.2s ease-in-out}
.recentTrans .useList > li.on {padding-right:149px; background-color: #fff}
.recentTrans .useList > li.on .topTxt {left: -45px;}
.recentTrans .useList > li.on .date {opacity: 0;}
.recentTrans .useList > li.on .txtItem {color:#666; font-size: 16px}
.recentTrans .useList > li.on .blueBtn {right: 0;} 
.recentTrans .useList > li.on .txtItem > li:before {border-color: #666}
.recentTrans .noData {background-color: #fcfcfc;}

/* my 메뉴 */
.myMenu .whiteBox {border-color:#d2d2d2; background-color: #fff}
.myMenuList {margin-top: 15px}
.myMenuList li {position: relative; float: left; width:50%; margin:5px 0; padding-left:22px; background:url(../img/common/mykdb/ico_my_menu.png) no-repeat 0 center; box-sizing: border-box;}
.myMenuList li .links:hover + .linkPath, .myMenuList li .links:focus + .linkPath {display:block;}
.myMenuList li .linkPath {display:none; position:absolute; margin-top:10px; padding:15px; font-size:14px; white-space:nowrap; border:1px solid #999; border-radius: 4px; box-sizing: border-box; background-color: #fff; z-index: 50; transition:opacity .15s linear;}
.myMenuList li .linkPath:before {content: ''; position: absolute; top:-8px; left:20px; width:14px; height: 8px; background: url('/img/common/bg_drop_menu.png') no-repeat 0;}
.myMenu .noData {background-color: #f8f8f8}

/* 일정 영역 */
.schedule .whiteBox {padding:30px 0; border-color:#d2d2d2;}
.schedule .titArea {padding-left:29px; padding-bottom: 23px;}
.schedule .scheUnit {display:inline-block; margin-left:15px !important; font-size:14px; vertical-align: middle;}
.schedule .scheUnit > * {position:relative; display: inline-block; margin-right:15px; padding-left: 15px; padding-top:4px; }
.schedule .scheUnit > *:before {content: ''; position: absolute; top:12px; left:0; width:7px; height: 7px; border-radius: 50%; background-color: #d6006d;}
.schedule .scheUnit > *.private:before {background-color: #0063cc; border-radius:0;}
.schedule .scheUnit > *.repay {margin-right:15px; padding-left: 15px; font-size:14px; padding-top:4px;}
.schedule .scheUnit > *.repay:before {content: ''; position: absolute; top:12px; left:0; background-color: #eba600; width:7px; height: 7px; border-radius: 0; transform:rotate(45deg)}
.schedule .scheUnit > *.repay:hover, .schedule .scheUnit > *.repay:focus {color:#0063cc; text-decoration: underline;}

.schedule .notiListWrap {position: absolute; left:0; right:0; max-height:66px; padding:20px 50px 22px 20px; background: #4b4e68; color:#fff; z-index: 1; overflow: hidden; box-sizing: border-box;}
.schedule .notiListWrap .dateInfo {position: absolute; left: 30px; top: 11px; color:#ccc; font-size: 12px;}
.schedule .notiListWrap .dateInfo strong {display:block; color:#fff; font-size: 16px;}
.schedule .notiListWrap .notiList {padding-left: 80px;}
.schedule .notiListWrap .notiList:focus {/*outline-style: dotted; outline-color: #666; outline-width: 1px;*/ outline: none;}
.schedule .notiListWrap .notiList li {display: none; margin-bottom:50px;}
.schedule .notiListWrap .notiList li:first-child {display: block; margin-top: 0}
.schedule .notiListWrap .accoBtn {position: absolute; top: 15px; right: 20px; display: inline-block; width: 38px; height: 38px; background: url(../img/common/mykdb/btn_cal_select.png) no-repeat center center; transition: none;}
.schedule .notiListWrap.on {max-height: none; overflow: auto;}
.schedule .notiListWrap.on .accoBtn {transform:rotate(180deg)}
.schedule .notiListWrap.on .accoBtn .off {display: block;}
.schedule .notiListWrap.on .accoBtn .on, .schedule .notiListWrap .accoBtn .off {display: none;}
.schedule .notiListWrap.on .dateInfo {top:21px;}
.schedule .notiListWrap.on .notiList li {display: block; margin-bottom: 15px;}

.schedule .paging {margin-top:15px; letter-spacing: 4px}
.schedule .paging .num {display: inline-block; line-height: 35px;}
.schedule .notiListWrap .paging {display:none; padding-top:20px; margin-left:10px; margin-right:-20px; border-top:1px solid #6f7186;}
.schedule .notiListWrap.on .paging {display: block;}
.schedule .notiListWrap .bullet {display:inline-block; width:10px; height: 10px; border-radius: 50%; background-color: #ff2293; vertical-align: middle; margin-right: 10px; margin-top: -2px}
.schedule .notiListWrap .bullet.private {background-color: #00a8f1}
.schedule .notiListWrap .bullet.repay {background-color: #eba600;}

.schedule .tblCalWrap {padding-left: 20px; padding-right: 20px;}
.schedule .tblCalWrap .topArea {padding:10px 0 0 0; background-color: transparent; }
.schedule .tblCalWrap .topArea button {width:40px; height:40px; border:none; background: url(../img/common/mykdb/btn_arrow.png) no-repeat 0 0; border-radius: 50%}
.schedule .tblCalWrap .topArea button.next {background-position: right 0;}
.schedule .tblCalWrap .topArea button:hover, .schedule .tblCalWrap .topArea button:focus {background-color: #f2f9ff}
.schedule .tblCalWrap .topArea strong {font-size: 20px; color:#666; line-height: 38px;}

.schedule .tblCalWrap {margin-top:66px; border-top: none}
.schedule .tableCal {border-bottom: none;}
.schedule .tableCal:before {content: none;}
.schedule .tableCal th, .schedule .tableCal td {height: auto; border:none; background:none; padding:7px 10px; text-align: center; vertical-align: middle;}

.schedule .tableCal td .day {display: block; height: 32px; width: 32px; margin: 0 auto; font-size: 16px; line-height: 30px; border-radius: 50%;}
.schedule .tableCal td .day {position: static;}
.schedule .tableCal td .day {cursor: default;}
.schedule .tableCal td .day.today,
.schedule .tableCal td .day.on {color:#fff !important; background-color:#0063cc !important;}
.schedule .tableCal td.holiday .day.today, .schedule .tableCal td.holiday[class*=has] .day.today {color:#fee2f4 !important;}
.schedule .tableCal td.on .day {background:none;}
.schedule .tableCal td.holiday .day, .schedule .tableCal th:first-child, .schedule .tableCal td.holiday[class*=has] .day {color:#d6006d}
.schedule .tableCal td.saturday .day, .schedule .tableCal th.saturday {color:#0063cc}

.schedule .tableCal td[class*=has] {position: relative;}
.schedule .tableCal td[class*=has] button.day {position:relative;  top:0; left:0; cursor: pointer; background-color:#d2eafb; color:#0063cc;}
.schedule .tableCal td.hasPri .day:after, .schedule .tableCal td.hasFin .day:before, .schedule .tableCal td.hasRepay:after {content: ''; position: absolute; top:7px; right:-9px; width: 7px; height: 7px; border-radius: 50%; background-color: #d6006d;}
.schedule .tableCal td.hasPri .day:after {background-color: #0063cc;border-radius:0;}
.schedule .tableCal td.hasPri.hasFin .day:after {top:17px}
.schedule .tableCal td.hasRepay:after {top: 15px; right: 12px; background-color: #eba600; width: 5px; height: 5px; border-radius: 0; transform: rotate(45deg);}
.schedule .tableCal td.hasPri.hasRepay:after, .schedule .tableCal td.hasFin.hasRepay:after {top:25px;}  
.schedule .tableCal td.hasPri .day:before {top:3px;}
.schedule .tableCal td.hasPri.hasFin .day:after {top:13px;}
.schedule .tableCal td.hasPri.hasFin.hasRepay:after {top:31px;}

.schedule .tableCal .memoWrap {display:none; position: absolute; z-index: 10; left:-95px }
.schedule .tableCal td.on .memoWrap {display: block;}
.schedule .tableCal .memoWrap .icoBtnClose {display: block;} 
.schedule .tableCal .memoWrap .date {font-size: 14px; color:#999;}
.schedule .tableCal .tooltip {display: block; width:260px; min-width:0; opacity: 1; z-index: 5}
.schedule .tableCal .tooltip .cont {padding-right: 0}
.schedule .tableCal .tooltip .arrow {margin-left: -10px;}
.schedule .scheList li {padding:5px 0; border-top:1px solid #dedede;}
.schedule .scheList li:first-child {border-top: none}
.schedule .scheList li strong {display: block;}

.schedule .tblCalWrap .listViewContain {display: none; /* 리스트뷰 */}
.schedule .tblCalWrap .itemList {max-height:274px; border-top: none; margin-top:0px;}
.schedule .tblCalWrap .itemList li {text-align: left;}
.schedule .tblCalWrap .itemList li .bold {margin-right: 10px} 

.schedule .rightBtn {float:right; margin-top:-3px; margin-right:17px; white-space: nowrap;}
.schedule .rightBtn > button {vertical-align: middle;}
.icoTxtPuls {position:relative; padding-left:26px; background: none; color:#666}
.icoTxtPuls:before {content: ''; position: absolute; top:5px; left:3px; width:16px; height: 16px; background: url(../img/common/mykdb/btn_cal.png) no-repeat -12px -92px; }
.icoTxtPuls:hover, .icoTxtPuls:focus {color:#0063cc}
.icoTxtPuls:hover:before, .icoTxtPuls:focus:before {color:#0063cc; background: url(../img/common/mykdb/btn_cal.png) no-repeat -52px -92px;}
.schedule button[class*=View] {position:relative; display:inline-block; width: 40px; height: 40px; margin-left:29px; background: url(../img/common/mykdb/btn_cal.png) no-repeat 0 -40px; }
.schedule button[class*=View]:before {content: ''; position: absolute; top: 7px; bottom: 6px; left: -12px; border-left: 1px solid #ccc;}
.schedule button.listView {display:none; background-position: 0 0;}
.schedule button.listView:hover, .schedule button.listView:focus {background-position: -40px 0;}
.schedule button.calView:hover, .schedule button.calView:focus {background-position: -40px -40px;}

.schedule .noData {margin-top:10px; height: 304px}
.schedule p.refList {margin: 12px 0 0 30px; color:#777}

/* 이체한도 */
.transLimit .whiteBox {position:relative; padding-top:30px; padding-bottom:10px; background-color: #f8f8f8; border-color: #d2d2d2;}
.transLimit select.ipt {margin-top: 25px; border-color: #f8f8f8}
.transLimit .limitList {margin: 0 -10px;}
.transLimit .limitList:before, .transLimit .limitList:after {content: ''; display: table}
.transLimit .limitList:after {clear: both}
.limitList li {border-top: 1px solid #dedede; padding:15px 0; }
.limitList li:after,.transLimit .limitList li:before {content: ''; display: table}
.limitList li:after {clear: both;}
.limitList li .tit {float: left}
.limitList li .amount {float: right;}
.limitList .amount {color:#333}
.limitList li.top {float:left; width:50%; padding: 0 10px 30px 10px; border: none; box-sizing: border-box;}
.limitList li.top + li {border: none;}
.limitList li.top .label, .limitList li.top .amount {display:block; text-align: right;}
.limitList li.top .label {padding: 25px 0 15px 0; margin-bottom:13px; border-bottom: 1px solid #666; text-align: left;}
.limitList li.top .amount [class*=pointC] {font-size: 20px;}
.limitList li:not(.top) {margin: 0 10px;}

/* 이벤트 배너 영역 */
.mykdbEvent {height: 268px;}
.mykdbEvent .shapeBox {padding:0;}
.mykdbEvent .shapeBox .slideList {border-radius: 8px; overflow: hidden;}
.mykdbEvent .shapeBox:after {background: url(../img/common/mykdb/bg_box_shape_white.png) no-repeat 0 0; z-index: 10}
.mykdbEvent .slideList a {display: block;}
.mykdbEvent .swiper-controls {bottom: 23px; padding-right:26px; text-align: right; } 

/* 상품 배너 영역 */
.kdbGoods .wrap {position:relative; width: 1132px; height:400px; margin: 0 auto; padding:0 30px; box-sizing: border-box;}
.toggleContain {position: relative; width:1132px; margin: 0 auto}
.kdbGoods .titH3 {position: absolute; top:23px; left: 110px; z-index: 100}
.kdbGoods .titH3 .txt {display: none;}
.kdbGoods .titH3.noBadge {left:30px}
.kdbGoods .titH3.noBadge .txt {position:relative; top:-2px; display:inline-block; margin-left: 30px; color:#666}
.kdbGoods .toggleArea { position: absolute; top:30px; right:30px; z-index: 100; padding-right: 84px;}
.kdbGoods .toggleArea > .links {position: absolute; top: 5px; right: 0; }
.kdbGoods .toggleContain > .toggleRadio {position: absolute; top:30px; right:30px; z-index: 100;}
.kdbGoods .btnNext,.kdbGoods .btnPrev {left:50%;}
.kdbGoods .btnPrev {margin-left: -626px}
.kdbGoods .btnNext {margin-left: 566px}
.kdbGoods .badge {position:relative; top:11px; display: table; width:60px; height: 61px; padding:0; margin-bottom:57px; border-radius: 5px; border-bottom-left-radius:0; border-bottom-right-radius:0; border: none}
.kdbGoods .badge > span {display: table-cell; vertical-align: middle; text-align: center; color:#fff; font-size: 16px; line-height: 1.15em}
.kdbGoods .badge:before, .kdbGoods .badge:after {content: ''; display: block; position: absolute; top: 60px; left: 0px; width: 0; height: 0; border-left: 30px solid rgba(0,154,221,1); border-right: none; border-bottom: 29px solid rgba(0,154,221,0) !important;border-top: none;}
.kdbGoods .badge:after {left:auto; right:0; border-right: 30px solid rgba(0,154,221,1); border-left: none; border-bottom: 29px solid rgba(0,154,221,0) !important; border-top: none;}
.kdbGoods .badge ~ .tagList {top: 116px;}
.kdbGoods .slideList > li {box-sizing: border-box;}
.kdbGoods .goodsImg {position: absolute; bottom: 0; right: 96px; width: 460px; height: 300px; }
.kdbGoods li.CD .goodsImg {width: 320px; height: 202px; padding: 20px 70px 78px 70px;}
.kdbGoods .tagList {position: absolute; top: 0; left: 30px; }
.kdbGoods .tagList li {display:inline-block; height:22px; padding:0 10px; margin-right:2px; border:1px solid #666; border-radius: 2px; font-size:14px; color:#666; line-height:21px;}
.kdbGoods .tagList li.noLine {border: none; font-size: 16px;}
.kdbGoods .goodsTit {width:50%; margin:67px 0 15px; padding-top: 40px; letter-spacing: -0.05em; font-size: 42px; color:#0063cc; white-space: normal; line-height: 1.1em}
.kdbGoods .goodsDes {font-size: 18px; line-height: 1.35em; width: 50%;}
.kdbGoods .goodsBtn {margin-top:20px;}
.kdbGoods .goodsBtn > * {margin-right: 5px}
.kdbGoods .goodsBtn .links {color: #555}
.kdbGoods .goodsBtn .links > span:after {border-color: rgba(102,102,102,0.5)}
.kdbGoods .goodsBtn .links:after {content: none;} 
.kdbGoods .swiper-controls {width:auto; bottom: 37px; right: 50%; margin-right: -566px;}
.kdbGoods .slide.zIndexSet {max-height:1px; margin-top:-1px; z-index: -1; visibility: hidden;} 
/* 프로모션 */
.kdbGoods .EV {background-color: #91695c; color: #fff; }
.kdbGoods .badge {background-color: #009add}
.kdbGoods .EV .tagList li { border-color: #fff; color: #fff; }
.kdbGoods .EV .goodsTit { color: #fff; }
.kdbGoods .EV .goodsBtn .links { color: #fff; }
.kdbGoods .EV .goodsBtn .links > span:after { border-color: rgba(255,255,255,0.5); }

/*예금 , 신탁*/
.kdbGoods .DP{background-color: #e6f1f7;}
.kdbGoods .badge {background-color: #009add}
.kdbGoods .DP .goodsTit { color: #0079b8; }
/*외화예금*/
.kdbGoods .FX {background-color: #e6f1f7}
.kdbGoods .FX .badge {background-color: #009add;}
.kdbGoods .FX .badge:before {border-left: 30px solid rgba(0,154,221,1);}
.kdbGoods .FX .badge:after {border-right: 30px solid rgba(0,154,221,1);}
.kdbGoods .FX .goodsTit { color: #0079b8; }
/*카드*/
.kdbGoods .CD {background-color: #ecebf7}
.kdbGoods .CD .badge {background-color: #a466cf;}
.kdbGoods .CD .badge:before {border-left: 30px solid rgba(164,102,207,1);}
.kdbGoods .CD .badge:after {border-right: 30px solid rgba(164,102,207,1);}
.kdbGoods .CD .goodsTit { color: #724ba9; }
/*펀드*/
.kdbGoods .FN {background-color: #f1e9ec}
.kdbGoods .FN .badge {background-color: #e54e80;}
.kdbGoods .FN .badge:before {border-left: 30px solid rgba(229,78,128,1);}
.kdbGoods .FN .badge:after {border-right: 30px solid rgba(229,78,128,1);}
.kdbGoods .FN .goodsTit { color: #d83072; }
/*대출*/
.kdbGoods .LN {background-color: #f4ebe1}
.kdbGoods .LN .badge {background-color: #df7300;}
.kdbGoods .LN .badge:before {border-left: 30px solid rgba(223,115,0,1);}
.kdbGoods .LN .badge:after {border-right: 30px solid rgba(223,115,0,1);}
.kdbGoods .LN .goodsTit { color: #b85f00; }
/*퇴직연금*/
.kdbGoods .BR {background-color: #f0eedf}
.kdbGoods .BR .badge {background-color: #a49447;}
.kdbGoods .BR .badge:before {border-left: 30px solid rgba(164,148,71,1);}
.kdbGoods .BR .badge:after {border-right: 30px solid rgba(164,148,71,1);}
.kdbGoods .BR .goodsTit { color: #7d7136; }
/*산금채, 신탁*/
.kdbGoods .IL, .kdbGoods .TR {background-color: #e1f2f4}
.kdbGoods .IL .badge, .kdbGoods .TR .badge {background-color: #26a7b5;}
.kdbGoods .IL .badge:before, .kdbGoods .TR .badge:before {border-left: 30px solid rgba(38,162,181,1);}
.kdbGoods .IL .badge:after, .kdbGoods .TR .badge:after {border-right: 30px solid rgba(38,162,181,1);}
.kdbGoods .IL .goodsTit, .kdbGoods .TR .goodsTit { color: #007993; }
/*보험*/
.kdbGoods .IS {background-color: #edf3df}
.kdbGoods .IS .badge {background-color: #80ab10;}
.kdbGoods .IS .badge:before {border-left: 30px solid rgba(128,171,16,1);}
.kdbGoods .IS .badge:after {border-right: 30px solid rgba(128,171,16,1);}
.kdbGoods .IS .goodsTit { color: #477d00; }
.noGoods {height: 400px; padding-top:102px; background:#f8f8f8;  box-sizing: border-box;  text-align: center;}
.noGoods .txtL {display: block; width:1132px; margin:0 auto 30px; padding-top:23px; border-top:1px solid #dedede; color:#333; font-size:24px; text-align: center;}
.noGoods .goodsMenu > li {display:inline-block; width:80px; margin:0 20px; background: none !important;}
.noGoods .goodsMenu > li a {position:relative; display: block; padding-top: 90px;  transition: color 0.18s ease-in-out}
.noGoods .goodsMenu > li a:before {content:''; position: absolute; top:0; left:0; width: 80px; height: 80px; border-radius: 50%; background: #fff url(../img/common/mykdb/ico_banner_def.png) no-repeat 0 0; overflow: hidden; transition: background-color 0.18s ease-in-out, background-position 0.18s ease-in-out}
.noGoods .goodsMenu > li.TR a:before {background-position: -80px 0;}
.noGoods .goodsMenu > li.FN a:before {background-position: -160px 0;}
.noGoods .goodsMenu > li.IL a:before {background-position: -240px 0;}
.noGoods .goodsMenu > li.LN a:before {background-position: -320px 0;}
.noGoods .goodsMenu > li.FX a:before {background-position: -400px 0;}
.noGoods .goodsMenu > li.IS a:before {background-position: -480px 0;}
.noGoods .goodsMenu > li.BR a:before {background-position: -560px 0;}
.noGoods .goodsMenu > li a:hover:before, .noGoods .goodsMenu > li a:focus:before {background-position: 0 bottom; background-color: #0063cc;}
.noGoods .goodsMenu > li.TR a:hover:before, .noGoods .goodsMenu > li.TR a:focus:before {background-position: -80px bottom;}
.noGoods .goodsMenu > li.FN a:hover:before, .noGoods .goodsMenu > li.FN a:focus:before {background-position: -160px bottom;}
.noGoods .goodsMenu > li.IL a:hover:before, .noGoods .goodsMenu > li.IL a:focus:before {background-position: -240px bottom;}
.noGoods .goodsMenu > li.LN a:hover:before, .noGoods .goodsMenu > li.LN a:focus:before {background-position: -320px bottom;}
.noGoods .goodsMenu > li.FX a:hover:before, .noGoods .goodsMenu > li.FX a:focus:before {background-position: -400px bottom;}
.noGoods .goodsMenu > li.IS a:hover:before, .noGoods .goodsMenu > li.IS a:focus:before {background-position: -480px bottom;}
.noGoods .goodsMenu > li.BR a:hover:before, .noGoods .goodsMenu > li.BR a:focus:before {background-position: -560px bottom;}
.noGoods .goodsMenu > li a:hover, .noGoods .goodsMenu > li a:focus {color:#0063cc}

/* 카드-인터넷·모바일결제안내 */
.frListWrap > li {margin-bottom:20px}
.frListWrap > li:last-child {margin-bottom:0; padding-bottom:30px; border-bottom:1px solid #e7e7e7}
.franList {margin-top:10px;}
.franList:before, .franList:after {display:block; content:""; clear:both;}
.franList li {float:left; width:150px; height:100px;}
.franList li img {width:100%; height:auto;}
.franList li + li {margin-left:10px;}
.easyPayList:before, .easyPayList:after {display:block; content:""; clear:both;}
.easyPayList li {float:left; width:57px; height:54px;}
.easyPayList li + li {margin-left:2px;}
.easyMobile {padding:10px 0 30px; border-bottom:1px solid #e7e7e7;}

/* 공지사항 - 사이트 공통 common.css로 이동해야 함.*/
.notice .txtList .links {position:relative; display: inline-block; width:100%; color:#666; vertical-align:top; box-sizing: border-box;}
.notice .txtList .links:after {display: none}
.notice .txtList .links:hover > span, .myKDB .notice .links:focus > span {color:#0063cc !important}
.notice .txtList .links:hover span:after, .myKDB .notice .links:focus span:after {opacity: 1}
.notice .txtList .links span {display:inline-block; max-width:90%; text-shadow: none; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; color:#666;}
.notice .txtList .links span:after {opacity: 0}
.notice .txtList .links .new {display: inline-block; width: 18px; height: 24px; margin-left: 3px; background: url(../img/common/ico_new.png) no-repeat 0 center;}

/* My Task */
.myTask .topBox {overflow:visible;}
.myTask .topBox .topGray {border-radius:8px 8px 0 0;}
.myTask .topBox .myInfo {border-radius:0 0 8px 8px;}
.myTask .topBox:before, .myTask .topBox:after {top:129px;}
.myKDB .topBox .place {background:url(../img/common/mykdb/ico_place.png) no-repeat 30px 0;}
.myKDB .topBox .notice.message {min-height:59px; background:url(../img/common/mykdb/ico_message.png) no-repeat 30px 0;}
.myKDB .topBox .notice.message .no_data {display:flex; height:45px; align-items:center;}
.myTask .topBox .infoSection.place .gradeInfo {line-height:51px;}
.myTask .topBox .infoSection.place .gradeInfo strong {display:inline-block; line-height:1.2; vertical-align:middle; word-break:break-word;}
.myTask .topBox .linkGroup .tooltip .cont {letter-spacing:initial;}
.myTask .kdbItemWrap {display:flex; flex-wrap:wrap; gap:40px;}
.myTask .kdbItemWrap .kdbItem {float:none;}
.myTask .kdbItemWrap .whiteBox {height:100%; box-sizing:border-box;}
.myTask .kdbReport .whiteBox {padding-right:0;}
.myTask .scrollBox {overflow-x:visible; overflow-y:auto;}
.myTask .kdbReport .scrollBox {width:100%; height:463px; padding-bottom:10px; margin-top:15px;}
.myTask .kdbReport .titH3.loanIco {padding: 10px 60px 0 0; background: url(../img/common/mykdb/ico_com_loan.png) no-repeat right bottom;}
.myTask .favList {width:484px; margin:0; display:flex; flex-wrap:wrap; gap:10px;}
.myTask .favList > li {width:237px; float:none; margin:0;}
.myTask .favList > li.on .shapeBox {background:#0063cc; color:#FFF;}
.myTask .favList .shapeBox {height:226px; padding:20px; transition:all 0.25s ease-in-out;}
.myTask .favList .shapeBox .tit {margin-bottom:0; line-height:21px; background-color:#FFF;}
.myTask .favList .shapeBox .d-day {position:absolute; right:20px; top:15px;}
.myTask .favList .shapeBox .bankLogo {margin-top:5px;}
.myTask .favList .shapeBox .bankLogo strong {width:calc(100% - 30px); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; max-width: 100%;}
.myTask .favList .shapeBox .accInfo {height:24px; padding-left:22px; margin:0;}
.myTask .favList .shapeBox .amount {color:#333;}
.myTask .favList .shapeBox .amount strong.bold {font-size:16px;}
.myTask .favList .shapeBox .date {margin-top:25px;}
.myTask .favList .shapeBox .date .txtM {color:#333;}
.myTask .favList .shapeBox .date strong {border-bottom:1px solid #003ca6; color:#003ca6;}
.myTask .favList .btnWrap {height:70px;}
.myTask .favList .btnWrap .btns {padding:14px 0;}
.myTask .favList .btnWrap .btns .txtItem {min-height:42px;}
.myTask .favList .btnWrap .btns .txtItem li {vertical-align:middle;}
.myTask .favList .btnWrap .links {vertical-align:middle; text-align:left; font-size:14px;}
.myTask .favList .btnWrap .links.consult {padding-left:45px; text-align:left; background:url('../img/common/mykdb/ico_com_kdb.png') no-repeat -3px center/ 40px auto;}
.myTask .favList .shapeBox.blank {background-color:#f8f8f8; border-color:#d2d2d2; box-shadow:none;}
.myTask .favList .shapeBox.blank:after {bottom:-1px; right:-1px; width:27px; height:37px; background:url('../img/common/bg_box_edge_gray_shadow_none.png') no-repeat 0 0;}
.myTask .favList > li.on .bankLogo img {opacity:0;}
.myTask .favList > li.on .bankLogo strong, .myTask .favList > li.on .shapeBox .num, 
.myTask .favList > li.on .shapeBox .amount, .myTask .favList > li.on .shapeBox .amount strong {color:#FFF;}
.myTask .txt_notice {padding:0 30px 0 22px; color:#777; background:url('../img/common/mykdb/ico_noti3.png') no-repeat left 4px;}
.myTask .kdbReport .btnArea, .myTask .smartTrans .btnArea {padding-right:30px;}
.myTask .icoTxtMore {position:relative; padding-left:21px; background:none;}
.myTask .icoTxtMore span {position:relative; display:block;}
.myTask .icoTxtMore span:after {content:''; position:absolute; bottom:0; left:0; right:0; border-bottom:1px solid #0063cc; opacity:0;}
.myTask .icoTxtMore:hover span:after, .myTask .icoTxtMore:focus span:after {opacity:1;}
.myTask .icoTxtMore:before {content:''; position:absolute; left:0; top:50%; display:block; width:14px; height:14px; margin-top:-7px; background:url('../img/common/mykdb/ico_btn_more.png') no-repeat center; transition:all 0.25s ease-in-out}
.myTask .icoTxtMore:hover:before, .myTask .icoTxtMore:focus:before {transform:rotate(360deg); transition:transform 0.5s;}

.myTask .smartTrans .whiteBox {position:relative; padding:20px 0 71px 30px;}
.myTask .smartTrans .titArea, .myTask .smartTrans .btnArea {padding-right:30px;}
.myTask .smartTrans .scrollBox {width:100%; height:372px; margin-top:25px;}
.myTask .smartTrans .smartList {width:484px;}
.myTask .toggleRadio label {font-size:13px; padding:0 15px;}
.myTask .smartTrans .listItem {margin-top:17px;}
.myTask .smartTrans .listItem:first-child {margin-top:0;}
.myTask .smartTrans .listItem label {display:block; background-image:url('../img/common/mykdb/bg_mytask_chk.png'); padding:15px 20px 15px 60px; box-sizing:border-box;}
.myTask .smartTrans .listItem input[type=radio]:disabled + label {background-image:url('../img/common/mykdb/bg_mykdb_chk_off.png');}
.myTask .smartTrans .listItem .item_info {display:flex; flex-direction:row; justify-content:space-between; align-items:center; gap:20px;}
.myTask .smartTrans .listItem .item_info .info {display:inline-block; width:calc(100% - 250px); padding:0;}
.myTask .smartTrans .listItem .item_info .info > strong:first-child {display:inline;}
.myTask .smartTrans .listItem .item_info .info > strong:before {content:none;}
.myTask .smartTrans .listItem .item_info .info .today {font-size:14px; color:#d6006d;}
.myTask .smartTrans .listItem .item_info .price {display:inline-block; width:250px; flex:1; text-align:right;}
.myTask .smartTrans .listItem .item_info .price .txtItem {display:inline-block;}
.myTask .smartTrans .listItem .item_info .price .txtItem > li {margin-left:20px; font-size:15px;}
.myTask .smartTrans .listItem .price .badge {border-radius:4px;} 
.myTask .smartTrans .listItem .item_title {margin-top:3px; color:#666; transition:color 0.15s ease-in-out;}
.myTask .smartTrans .listItem .amount {display:block; padding:0;}
.myTask .smartTrans .listItem .amount i {margin-right:5px;}
.myTask .smartTrans .mykdbIcoPrint {padding-left:51px; background: url('../img/common/mykdb/ico_print.png') no-repeat 0 center;}
.myTask .smartTrans .refList .links:after {content:''; top:-2px;}
.myTask .smartTrans .refList .links:hover:after, .myTask .smartTrans .refList .links:focus:after {background:rgba(0,138,255,0.09);}
.myTask .smartTrans .refList .links:hover span:after, .myTask .smartTrans .refList .links:focus span:after {content:none;}
.myTask .smartTrans .whiteBox .refList {position:absolute; left:30px; bottom:26px; padding-right:30px;}
.myTask .noData {width:calc(100% - 30px);}
.myTask .noData.wide {min-height:210px;}

.myTask .schedule {width:100%; height:1022px;}
.myTask .schedule .whiteBox {display:flex; flex-direction:row;}
.myTask .schedule .calSection {position:relative; width:calc(100% - 300px);}
.myTask .schedule .calSection:after {content:''; position:absolute; right:0; top:-15px; display:block; width:1px; height:calc(100% + 30px); background:#d2d2d2;}
.myTask .schedule .btnFilter {display:inline-block; width:40px; min-width:auto; height:40px; padding:0; background: url('../img/common/mykdb/ico_calendar.png') no-repeat center;}
.myTask .schedule .scheUnit li {padding-top:0;}
.myTask .schedule .scheUnit li:before {top:0; width:15px; height:100%; border-radius:0; background-color:#FFF; background-repeat:no-repeat; background-position:left center;}
.myTask .schedule .category_1:before {background-image:url('../img/common/mykdb/ico_sche1.png');}
.myTask .schedule .category_2:before {background-image:url('../img/common/mykdb/ico_sche2.png');}
.myTask .schedule .category_3:before {background-image:url('../img/common/mykdb/ico_sche3.png');}
.myTask .schedule .category_4:before {background-image:url('../img/common/mykdb/ico_sche4.png');}
.myTask .schedule .category_5:before {background-image:url('../img/common/mykdb/ico_sche5.png');}
.myTask .schedule .rightBtn {margin-top:5px;}
.myTask .schedule .notiListWrap .notiList {padding-left:90px;}
.myTask .schedule .notiListWrap .notiList li span {position:relative; display:inline-block; width:15px; height:24px; vertical-align:top;}
.myTask .schedule .notiListWrap .notiList li span::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:left center;}
.myTask .schedule .tblCalWrap .topArea {padding:20px 0 20px 0;}
.myTask .schedule .tableCal th, .myTask .schedule .tableCal td {text-align:left; vertical-align:top;}
.myTask .schedule .tableCal th {padding-left:18px;}
.myTask .schedule .tableCal td {height:120px;}
.myTask .schedule .tableCal td .day {margin:0; cursor:pointer;}
.myTask .schedule .tableCal td .listBtn {display:block; width:100%; text-align:left;}
.myTask .schedule .tableCal td .day.on {cursor:pointer;}
.myTask .schedule .calList li {position:relative; padding-left:15px; font-size:12px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.myTask .schedule .calList li:before {content:''; position:absolute; left:0; top:0; width:15px; height:100%; background-repeat:no-repeat; background-position:left center;}
.myTask .schedule .calList li.more {padding:0;}
.myTask .schedule .calList li.more:before {content:none;}
.myTask .schedule .popupBase {position:absolute; left:0; top:0; right:0; bottom:0; background:transparents; z-index:5;}
.myTask .schedule .scheduleFilterPop.popCont {display:none; position:absolute; left:5px; top:92px; border:1px solid #666; box-shadow:3px 3px 5px rgba(0,0,0,0.15);}
.myTask .schedule .scheduleFilterPop .scroll {margin-bottom:0;}
.myTask .schedule .popCont .titH4 {padding:15px 0; border-bottom:1px solid #dedede;}
.myTask .schedule .popCont .filterSec {padding:20px; display:flex; flex-direction:row;}
.myTask .schedule .popCont .filterSec .iptGroup {width:100%;}
.myTask .schedule .popCont .filterSec .categoryList label span{position:relative; padding-left:15px;}
.myTask .schedule .popCont .filterSec .categoryList label span:before {content:''; position:absolute; left:0; top:0; width:15px; height:100%; background-repeat:no-repeat; background-position:left center;}
.myTask .schedule .detailSection {display:flex; flex-direction:column; width:300px;}
.myTask .schedule .detailSection .scrollBox {flex:1 1 930px; margin-top:-10px;}
.myTask .schedule .detailSection .detailList {padding:20px;}
.myTask .schedule .detailSection .detailList > li + li {margin-top:30px;}
.myTask .schedule .detailSection .detailList li ul {margin-top:10px;}
.myTask .schedule .detailSection .detailList li ul li {margin-top:5px;}
.myTask .schedule .detailSection .detailList .links {position:relative; padding-left:15px;}
.myTask .schedule .detailSection .detailList .links:before {content:''; position:absolute; left:0; top:0; width:15px; height:100%; background-repeat:no-repeat; background-position:left 10px;}
.myTask .schedule .detailSection .detailList .links > span {color:#666; font-size:15px; font-family:'NotoSans Light', 'Roboto Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
.myTask .schedule .detailSection .detailList .links span:after {opacity:0;}
.myTask .schedule .detailSection .detailList .links:hover span,
.myTask .schedule .detailSection .detailList .links:focus span {color:#0063cc; text-decoration:underline;}

.icoTxtConsult {line-height:30px; padding-left:37px; background:url('../img/common/ico_after_login.png') no-repeat left 1px/ auto 100%;}
.icoTxtDelete {margin-top:5px; background:url('../img/common/ico_pop_del.png') no-repeat left 2px/22px;}

/*MyTask - Direct Message 팝업*/
.inTabBox {position:relative;}
.inTabBox p {position:absolute; right:0; top:27px;}
.writerInfo {position:relative; display:inline-block; min-height:30px; padding-left:45px; line-height:29px;}
.writerInfo i {position:absolute; left:0; top:50%; width:36px; height:30px; margin-top:-15px; background-repeat:no-repeat; background-position:center;}
.icoWriter {background-image:url('../img/common/ico_dm_writer.png');}
.icoWriterKDB {background-image:url('../img/common/ico_dm_kdb.png');}
.icoDMon{display:block; width:22px; height:16px; margin:0 auto; background:url('../img/common/ico_dm_on.png') no-repeat;}
.icoDMoff{display:block; width:22px; height:20px; margin:0 auto; background:url('../img/common/ico_dm_off.png') no-repeat;}
.messageForm {border-top:2px solid #333; border-bottom:1px solid #999; background-color:#f8f8f8;}
.messageForm .messageInfo {width:100%; height:50px;}
.messageForm .messageInfo::after {content:''; display:block; clear:both;}
.messageForm .messageInfo dt {float:left; width:80px; height:100%; text-align:center; line-height:50px;}
.messageForm .messageInfo dd {float:left; width:calc(100% - 80px); height:100%; padding-right:20px; display:flex; flex-direction:row; justify-content:flex-start; align-items:center; gap:10px; box-sizing:border-box;}
.messageForm .messageInfo dd .writerInfo {color:#333;}
.messageForm .messageInfo dd em {margin-top:2px; font-size:14px;}
.messageForm .messageInfo dd .service {margin-left:auto;}
.messageForm .messageConts {padding:10px 20px 10px 80px; border-top:1px solid #dedede;}
.messageForm .messageConts dt {padding:10px 0; color:#333;}
.messageForm .messageConts dd {height:220px; padding:10px 0; overflow-y:auto;}
.messageForm .noteArea {display:table; width:100%; padding-left:80px; box-sizing:border-box;}
.messageForm .noteArea > strong,
.messageForm .noteArea .cnt {display:table-cell;}
.messageForm .noteArea > strong {width:70px; padding-right:10px;}

/*=========================================== 인증센터 ==============================================*/




/* BCPCCN0000
.regist p.txt {min-height:50px; padding-top: 15px;}
.regist p.regiImg { text-align: center; }
.regist dl.titType dt { border-bottom: #dedede 1px solid; padding: 15px 0; text-align: center; font-size: 24px; }
.regist dl.titType dd { padding: 25px 0 15px 0; }

.regist .icoTxtRegist01 { background: url("../img/temp/temp_auth_regist.png") no-repeat 50% 0;}
.regist .icoTxtRegist02 { background: url("../img/temp/temp_auth_regist.png") no-repeat 50% 0;} */

/* BPNFAO0005 : 사용 html 없음
.btmLineBox {padding-bottom:20px; border-bottom:1px solid #dedede;}
*/

/*: 사용 html 없음
.agreeDate { padding: 20px 0 0; text-align: center; font-size: 20px; }
.agreeDate.line { padding-bottom: 30px; border-bottom: #dedede 1px solid; }
*/
/*: 사용 html 없음
.identification { height: 120px; }
*/


/*===========================================================================================================
============================================= wbiz contentns ================================================
=============================================================================================================*/

/*================= 금융상품몰 ====================*/

.btnBlk{display:block; width:100%; margin-bottom:15px;}

/* 관심상품/비교하기 버튼 on/off */
input[type="checkbox"][class*=mall] {position: absolute; top: auto; display: inline-block; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: -10; box-sizing: border-box; vertical-align: top;}
input[type="checkbox"][class*=mall] + label { cursor: pointer; display: inline-block; min-width: 180px; height: 50px; padding: 0 20px; background-color: #0063cc; line-height: 48px; vertical-align: middle; text-align: center; border-radius: 9px; border-top-right-radius: 0; border-bottom-left-radius: 0; box-sizing: border-box; color: #fff; font-size: 18px; transition: background-color 0.125s, border 0.125s; }
input[type="checkbox"][class*=mall] + label:hover,
input[type="checkbox"][class*=mall]:focus + label { background-color: #deebf9; color: #0050a6; border-color: #004a99; }
input[type="checkbox"][class*=mall] + label span { display: inline-block; padding-left: 28px; }
input[type="checkbox"][class*=mall] + label span.inte { background: url(../img/common/bg_interest_plus.png) no-repeat 0 50%; }
input[type="checkbox"][class*=mall] + label span.comp { background: url(../img/common/bg_compare.png) no-repeat 0 50%; }
input[type="checkbox"][class*=mall]:checked + label { background-color: #fff; border: 1px solid #004a99; color: #0063cc; }
input[type="checkbox"][class*=mall]:checked + label:hover,
input[type="checkbox"][class*=mall]:checked:focus + label { background-color: #deebf9; color: #0050a6; border-color: #004a99; }
input[type="checkbox"][class*=mall]:checked + label span.inte, input[type="checkbox"][class*=mall].on + label span.inte { background: url(../img/common/bg_interest_minus.png) no-repeat 0 50%; }
input[type="checkbox"][class*=mall]:checked + label span.comp, input[type="checkbox"][class*=mall].on + label span.comp { background: url(../img/common/bg_compare_minus.png) no-repeat 0 50%; }
input[type="checkbox"][class*=mall]:checked + label[disabled]:hover,
input[type="checkbox"][class*=mall]:checked:focus + label[disabled] { background-color: #f5f5f5; border-color: #d2d2d2; }


input[type="checkbox"].mallWB + label { background-color: #fff; border: 1px solid #0063cc; color: #0063cc; }
input[type="checkbox"][class*=mall].S + label { min-width: 100px; height: 40px; padding: 0 14px; line-height: 40px; font-size: 16px; }
input[type="checkbox"].mallWB ~ .cbtnB {margin-left:10px;}
input[type="checkbox"].mallWB + label[disabled]{border-color: #d2d2d2; background-color: #f5f5f5; cursor: default; outline: none}
input[type="checkbox"].mallWB + label[disabled] span{color:#9ea09e}
input[type="checkbox"][class*=mall] + label[disabled] span.inte{background-image: url(../img/common/bg_interest_disabled.png)}
input[type="checkbox"][class*=mall] + label[disabled] span.comp{background-image: url(../img/common/bg_compare_disabled.png)}
input[type="checkbox"].mallN + label { min-width: auto; height: auto; padding: 0; border: none; background: none; line-height: normal; text-align: left; border-radius: 0; color: #0063cc; font-size: 16px; }
input[type="checkbox"].mallN + label:hover,
input[type="checkbox"].mallN:focus + label { color: #0050a6; border: none; background: none; }
input[type="checkbox"].mallN + label:hover:after,
input[type="checkbox"].mallN:focus + label:after { content: ''; position: absolute; width: auto; z-index: 1; height: 30px; right: -5px; left: -5px; top: -1px; border-radius: 4px; background-color: rgba(0,138,255,0.05);} 
input[type="checkbox"].mallN:checked + label { border: none; background: none; }
input[type="checkbox"].mallN:checked + label:hover,
input[type="checkbox"].mallN:checked:focus + label { color: #0063cc; background: none; }

/* 접근성 관련 시각적처리 */
input[type="checkbox"].mallN + label:hover span,
input[type="checkbox"].mallN:focus + label span { text-decoration: underline; }
input[type="checkbox"].mallN:checked + label:hover span,
input[type="checkbox"].mallN:checked:focus + label span { text-decoration: underline; }
/*input[type="checkbox"].mallWB + label:hover,*/
input[type="checkbox"].mallWB:focus + label { outline: dotted 1px; }
.mallProduct .icoTxtClassComp:hover:before,
.mallProduct .icoTxtClassComp:focus:before { content: ''; position: absolute; bottom: 3px; left: 26px; right: 0; border-bottom: #0063cc 1px solid; } 

/* 금융상품몰 목록 여백 재정의 */
.cntList.mallPd > li { padding: 26px 0; }

/* === 상세화면 상단 상품케이스별 === */
.depositBg.finish { min-height: auto; margin-bottom: 110px !important; }
.depositBg { background-color: #e6f1f7; min-height: 300px; margin-bottom: 30px !important; }
.loanBg { background-color: #f4ebe1; min-height: 300px; margin-bottom: 30px !important; }
.bondBg { background-color: #e1f2f4; min-height: 300px; margin-bottom: 30px !important; }
.insurBg { background-color: #edf3df; min-height: 300px; margin-bottom: 30px !important; }
.cardBg { background-color: #ecebf7; min-height: 300px; margin-bottom: 30px !important; }
.fundBg { background-color: #f1e9ec; min-height: 300px; margin-bottom: 30px !important; }
.pensionBg { background-color: #f0eedf; min-height: 300px; margin-bottom: 30px !important; }

.topProduct { width: 1132px; margin: 0 auto; position: relative; }
.topProduct .pageUtil { top: -40px !important; }
.topProduct .productArea { display: table; width: 100%; table-layout: fixed; }
.topProduct .productTit { display: table-cell; padding: 0 0 40px 0; }
.topProduct .productCard { display: table-cell; width: 320px; padding: 0 0 0 20px; vertical-align: middle; }
.topProduct .productCard > img {width:100%; height:100%; max-height:250px;}
/* 상세화면 상단 */
.topProduct .productTit h1 { margin-bottom: 12px; }
.topProduct .productTit > .txt { font-size: 18px; height: 56px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient:vertical; word-wrap:break-word; -webkit-line-clamp: 2;}
.topProduct .badgeList { margin-bottom: 25px; }
.topProduct .productTit .summary { margin-top: 25px; }
.topProduct .productTit .summary li > div { padding-left: 76px; min-height: 65px; }
.topProduct .productTit .summary li > div p { font-size: 24px; color: #333; letter-spacing: -.9px; line-height: 1.3; margin-top: 4px; }
.topProduct .productTit .summary li > div p em.txtM { display: inline-block; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; color: #666 !important; margin-left: 5px; }
.topProduct .productTit .summary li > div .skyblueC { color: #009add; }
.topProduct .productTit .summary li > div .blueC { color: #0054ad; }
.topProduct .productTit .summary li > div .greenC { color: #118000; }
.topProduct .productTit .summary li > div .orangeC { color: #dc6800; }
.topProduct .productTit .summary li > div .pinkC { color: #d6006d; }
.topProduct .productTit .summary li > div .redC { color: #e00000; }
.topProduct .productTit .summary li .txt.minus, 
.topProduct .productTit .summary li .txt.plus { font-size: 18px; }

.topProduct .productTit .summary .percent > div { background: url("../img/common/cnt/ico_product_percent.png") no-repeat 0 0; }
.topProduct .productTit .summary .money > div { background: url("../img/common/cnt/ico_product_money.png") no-repeat 0 0; }
.topProduct .productTit .summary .startDate > div { background: url("../img/common/cnt/ico_product_start_date.png") no-repeat 0 0; }
.topProduct .productTit .summary .endDate > div { background: url("../img/common/cnt/ico_product_end_date.png") no-repeat 0 0; }
.topProduct .productTit .summary .gauge > div { background: url("../img/common/cnt/ico_product_gauge.png") no-repeat 0 0; }
.topProduct .productTit .summary .person > div { background: url("../img/common/cnt/ico_product_person.png") no-repeat 0 0; }
.topProduct .productTit .summary .card > div { background: url("../img/common/cnt/ico_product_card.png") no-repeat 0 0; }
.topProduct .productTit .summary .bus > div { background: url("../img/common/cnt/ico_product_bus.png") no-repeat 0 0; }
.topProduct .productTit .summary .calculator > div { background: url("../img/common/cnt/ico_product_calculator.png") no-repeat 0 0; }
.topProduct .productTit .summary .proLabel > div { background: url("../img/common/cnt/ico_product_label.png") no-repeat 0 0; }
.topProduct .productTit .summary .chart > div { background: url("../img/common/cnt/ico_product_chart.png") no-repeat 0 0; }
.topProduct .productTit .summary .umbrella > div { background: url("../img/common/cnt/ico_product_umbrella.png") no-repeat 0 0; }
.topProduct .productTit .summary .office > div { background: url("../img/common/cnt/ico_product_office.png") no-repeat 0 0; }
.topProduct .productTit .summary .weekly > div { background: url("../img/common/cnt/ico_product_weekly.png") no-repeat 0 0; }

.topProduct .productTit .summary .rateOfReturn { padding-right: 145px; box-sizing: border-box; position: relative; }
.topProduct .productTit .summary .rateOfReturn ul { position: absolute; top: 0; bottom: 0; right: 0; width: 145px; padding-left: 15px; box-sizing: border-box; font-size: 14px; border-left: #dedede 1px solid; position: absolute; }
.topProduct .productTit .summary .rateOfReturn ul li { height: 24px; }



/* === 상품비교레이어(윈도우팝업) === */
/* 기본 > 금상몰 공통 */
.mallProduct .badgeList + .infoTit { padding-top: 5px; }
.mallProduct .infoTit { padding-bottom: 8px; }
.mallProduct .infoTit a { display: inline-block; font-size: 18px; color: #333; word-break: break-all; }
.mallProduct .infoTit a:hover, .mallProduct .infoTit a:focus { color: #0063cc; text-decoration: underline; }
.mallProduct .infoTit a:hover:after, .mallProduct .infoTit a:focus:after { display: none; }
.mallProduct .infoFigure { padding-top: 5px; position: absolute; bottom: 82px; left: 0; right: 0; padding: 0 20px; }
.mallProduct .infoFigure strong { font-size: 20px; color: #d6006d; padding-left: 5px; }
.mallProduct .infoFigure strong span { font-size: 24px; }
.mallProduct .infoFigure strong.red { color: #e00000; }
.mallProduct .infoFigure > div {display:inline-block; text-align:center; margin-top:-1.5em;}
.mallProduct .infoFigure > div + div {margin-left:20px;}
table.tableY.compareTable td { vertical-align: top !important; }
table.tableY tbody td.mallProduct { position: relative; padding-bottom: 135px; vertical-align: top; }
table.tableY tbody td.mallProduct .infoTit { padding-right: 30px; padding-bottom: 0; }
/* 카드비교*/
table.tableY tbody td.mallProduct.card { padding-bottom: 235px; }
table.tableY tbody td.mallProduct.card .infoFigure { text-align: center; box-sizing: border-box; bottom: 90px; }
table.tableY tbody td.mallProduct.card .infoFigure span { display: block; margin: 0 auto; text-align: left; width: 198px; height: 128px; padding-right: 8px; padding-bottom: 8px; box-sizing: border-box; background: url(../img/common/cnt/bg_compare_card.png) no-repeat -1px 0; }
table.tableY tbody td.mallProduct.card .infoFigure img { width: 100%; }
.mallProduct .btnArea { position: absolute; bottom: 20px; left: 0; right: 0; margin-top: 0; }
.mallProduct .btnArea button { vertical-align: top;  }
.mallProduct .btnArea label + button { margin-left: 10px !important; }
.mallProduct button.icoBtnDel { position: absolute; top: 17px; right: 15px; }
table.tableY tbody td.mallProduct.titOnly { padding-bottom: 70px; }
table.tableY tbody td.mallProduct.titOnly .infoTit { padding-bottom: 30px; }
.mallProduct .icoTxtClassComp:hover:after,
.mallProduct .icoTxtClassComp:focus:after { content: ''; position: absolute; width: auto; z-index: 1; height: 30px; right: -5px; left: -5px; top: -1px; border-radius: 4px; background-color: rgba(0,138,255,0.05);} 
.mallProduct .icoTxtClassComp:focus { outline: none; }


/* ======== [Wbiz] Global > 비교하기 팝업 ======== */
table.tableY tbody td.mallProduct.noneBtn { padding-bottom: 68px; }
table.tableY tbody td.mallProduct.noneBtn .infoFigure { bottom: 15px; }


/* 펀드상품비교레이어 수익률 */
td.rateOfReturn { padding: 15px 0 !important; position: relative; overflow: hidden;  font-size: 14px; }
td.rateOfReturn:before { content: ""; border-left: #dedede 1px solid; position: absolute; top: 15px; bottom: 15px; left: 50%; }
td.rateOfReturn > div { display: block; width: 50%; float: left; height: 24px; padding: 0 20px; box-sizing: border-box; }

/* 펀드상품목록 */
.txtItem.rateOfReturn { margin-bottom: 2px; }
.txtItem.rateOfReturn > li span { padding-left: 5px; }
.mallProduct .infoWrap .txtItem > li { margin-left: 30px; }
.mallProduct .infoWrap .txtItem > li:before { left: -15px; top: 5px; }

/* === 나의관심상품 === */
.cntList .mallProduct { display: table; width: 100%; table-layout: fixed; }
.cntList .mallProduct .infoWrap { display: table-cell; padding-right: 30px;}
.cntList .mallProduct .infoWrap .infoTit a { margin-right: 10px; font-size: 20px; }
.cntList .mallProduct .infoWrap > .txt { color: #333; }
.cntList .mallProduct .infoFigure { position: static; display: table-cell; width: 220px; vertical-align: middle; text-align: center; padding: 0; }
.cntList .mallProduct .infoFigure strong { display: block; font-size: 20px; line-height: 1.3; }
.cntList .mallProduct .infoFigure strong span { font-size: 28px; }
.cntList .mallProduct .btnArea { position: static; display: table-cell; width: 120px; text-align: right; vertical-align: middle; }
.cntList .mallProduct .infoFinish { display: table-cell; width: 150px; vertical-align: middle; color: #666; text-align: center; }
.cntList .mallProduct .infoFinish strong { display: block; }
.cntList .mallProduct .infoCard { display: table-cell; width: 190px; padding-right: 20px; }
.cntList .mallProduct .infoCard img { width: 190px; height: 120px; }
.cntList .msgArea { text-align: center; padding: 120px 0 !important; }
.cntList .msgArea .txt { color: #333; font-size: 20px; }
.cntList .msgArea .btnArea { margin-top: 20px; }
/* 카드 */
.cntList .mallProduct .cardImg { display: table-cell; width: 160px; }
.cntList .mallProduct .cardImg span { display: inline-block; border-radius: 5px; box-shadow:5px 5px 5px rgba(0,0,0,0.1); overflow:hidden;}
.cntList .mallProduct .cardImg img { width: 160px; height:100px;}
.cntList .mallProduct .cardImg + .infoWrap { padding-left: 20px; vertical-align: top; }
/* 창립이벤트 */
.cntList li.foundingList { padding-bottom: 0; border-bottom: #734df2 1px solid; }
.cntList .foundingEvent { display: table; width: 100%; table-layout: fixed; border-top: #dedede 1px solid; padding: 15px 0; margin-top: 30px; }
.cntList .foundingEvent .founding { display: table-cell; width: 100px; }
.cntList .foundingEvent .anievent {display: table-cell; width: 140px;}
.cntList .foundingEvent .txt { display: table-cell; color: #734df2; /*overflow: hidden; text-overflow: ellipsis; white-space: nowrap;*/ }
.cntList li.foundingList + li { border-top: none; }

/* ======== [Wbiz] Glabal > 퇴직연금/펀드 목록 ======== */
.chgl .cntList .mallProduct .infoFigure { width: 200px; }


/* === 하단 상품비교 === */
.footCompare { border-top: #666 1px solid; background-color: #cae1ef; padding: 15px 0; display: block; position: fixed; bottom: 0; left: 0; right: 0; z-index: 500; margin-bottom: 0; margin-top: 0; }
.footCompare.bottom {position: relative; top: 160px; background-color: #d1e7f4; }
.footCompare section { position: relative; }
.compareTit { position: absolute; top: 0; left: 0; color: #333; font-size: 18px; padding-right: 22px;}
.compareTit:after { content: ""; display: inline-block; width: 13px; height: 8px; background:url("../img/common/cnt/bg_compare_toggle.png") no-repeat 0 0; position: absolute; top: 50%; right: 0; margin-top: -4px; }
.footCompare .mallProduct .infoFigure strong span { font-size: 28px; }
/* 닫힘 */
.footCompare .compareList { display: table; table-layout: fixed; width: 912px; margin: 0 110px; }
.footCompare .compareList > li { display: table-cell; width: 33.33%; height: 32px; box-sizing: border-box; border-left: 1px solid; border-color: rgba(0,0,0,.14); padding: 0 20px; position: relative; vertical-align: top; }
.footCompare .compareList > li > .txt { line-height: 28px; }
.footCompare .mallProduct { padding-bottom: 0; }
.footCompare .mallProduct .infoTit { position: relative; padding-right: 28px; font-size: 16px; display: inline-block; max-width: 100%; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-weight: bold; color: #333; padding-bottom: 0; }
.footCompare .mallProduct .infoTit .compareDel { position: absolute; top: 1px; right: 0; width: 22px; height: 22px; background:url("../img/common/btn_file_del.png") no-repeat center center; margin-left: 5px; }
.footCompare .mallProduct .infoFigure { display: none; position: absolute; bottom: 0; left: 20px; right: 20px; padding: 0; }
.footCompare section > button.btnW { position: absolute; top: -5px; right: 0; }
/* 열림 */
.footCompare.bottom .compareTit:after { background-position: 0 -12px; }
.footCompare.bottom .compareList .mallProduct { padding-bottom: 45px; }
.footCompare.bottom .compareList .mallProduct .infoTit { max-width: 100%; overflow: unset; text-overflow: unset; white-space: normal; padding-right: 0; padding-bottom: 0; font-weight: bold; color: #333; }
.footCompare.bottom .compareList .mallProduct .infoTit .compareDel { position: static; vertical-align: middle; margin: 0 0 2px 2px; }
.footCompare.bottom .compareList .mallProduct .infoFigure { display: block; }
.footCompare.bottom .compareList + button.btnW { top: 0; }



/* === 금융상품몰 목록 === */
/* 투자성향 */
.tendencyBox { padding: 20px 30px 26px; border: 1px solid #0063cc; border-radius: 8px; box-shadow: 5px 5px 5px rgba(0,0,0,0.07); text-align: center; }
.tendencyBox .txt { font-size: 20px; color: #333; }
.tendencyBox .txt strong { font-weight: bold; }
.tendencyBox .txt strong.level1 { color: #118000; }
.tendencyBox .txt strong.level2 { color: #eba600; }
.tendencyBox .txt strong.level3 { color: #dc6800; }
.tendencyBox .txt strong.level4 { color: #d7006d; }
.tendencyBox .txt strong.level5 { color: #e00000; }
.tendencyBox.blue { border-color: #dfe5ea; background-color: #f2f9fe; }
.tendencyBox.purple { border-color: #e5e5e5; background-color: #f8f8f8; }
.tendencyBox.pink { border-color: #ebe2e2; background-color: #fff5f5; }
.tendencyBox + .tendencyBox { margin-top: 20px; }

/* 상품목록 > 왼쪽 > 검색 */
.mallSearch { position: relative; width: 100%;  }
.mallSearch .ipt { padding-right: 45px; }
.mallSearch .delete.on .icoBtn { display: none !important; }
.mallSearch[class*=col_] .ipt { width: 100%; }
.mallSearch button { border: none; position: absolute; top: 50%; right: 0; margin-top: -19px; }
.mallCondition { border-top: none; border-bottom: none; }
.mallCondition li { padding: 20px 0; border-bottom: #e7e7e7 1px solid; }
.mallCondition li:last-child { border-bottom: #999 1px solid; }
/* 상품목록 > 왼쪽 > 아코디언 */
.mallCondition .accoWrap { border-top: none; }
.mallCondition .accoWrap .accTopArea { padding: 0; }
.mallCondition .accoWrap .accoTit.click {display: block;}
.mallCondition .accoWrap .accoContents { border-top: none; background-color: #fff; padding: 0; }
.mallCondition .accoWrap .accTopArea .accoBtn { right: 0; background: none; }
.mallCondition .accoWrap .accTopArea .accoBtn:after { content: ""; display: inline-block; width: 13px; height: 8px; background: url(../img/common/cnt/bg_compare_toggle.png) no-repeat 0 -12px; position: absolute; top: 50%; right: 50%; margin: -4px -6px 0 0; }
.mallCondition .condiWrap .accoContents { display: block !important; padding: 0; }
.mallCondition .accoContents .iptGroup { margin-bottom: 6px; }
.mallCondition .accTopArea .bold { color: #333; }
.mallCondition .accoContents .iptGroup > div { display: inline-block; min-width: 48.5%; box-sizing: border-box; word-break: normal; margin-top: 16px; }
.mallCondition .accoContents .iptGroup > div label { letter-spacing: -1px; }
.mallCondition .accoContents .iptGroup > div:first-child { margin-top: 16px;}
.mallCondition .accoContents.hScroll { margin-bottom: -20px; outline-style: dotted; outline-color: #999; outline-width: 1px}
.mallCondition .accoContents.hScroll .iptGroup { height: 200px; overflow-y: scroll; margin-top: 15px; margin-bottom: 0; }
.mallCondition .accoContents.hScroll .iptGroup > div { width: 99%; }
.mallCondition .accoContents.hScroll .iptGroup > div:first-child { margin-top: 0; }
.mallCondition .accoContents.full .iptGroup > div  { min-width: 100%; }
/* 상품목록 > 왼쪽 > 아코디언(펀드 수익률) */
.mallCondition .rangeArea { margin-top: 20px; margin-bottom: 6px; }
.mallCondition .rangeArea .row { position: relative; overflow: hidden; margin-bottom: 20px; }
.mallCondition .rangeArea .row .gap { position: absolute; top: 50%; left: 50%; width: 20px; height: 30px; margin-left: -12px; margin-top: -15px; text-align: center; display: inline-block;}
.mallCondition .rangeArea .ipt.unit {padding-left: 0px; padding-right: 30px;}
.mallCondition .rangeArea .ipt.unit + i {right: 11px;}
.mallCondition .rangeArea .delete .icoBtn {right: 11px; width:35px}
.accoContents.rateOfReturn .rangeArea .bgRange { position: relative; height: 4px; border: none; border-top: #d4d7db 1px solid; background-color: #e6e9ee; border-radius: 0; box-sizing: border-box;}
.accoContents.rateOfReturn .rangeArea .slider-range { position: relative; margin: 0 10px; }
.accoContents.rateOfReturn .rangeArea .ui-widget.ui-widget-content { height: 3px; border: none; background: none; border-radius: 0; }
.accoContents.rateOfReturn .rangeArea .ui-slider-horizontal { height: 4px; }
.accoContents.rateOfReturn .rangeArea .ui-widget-header { background: #00a8f1; height: 4px; top: -1px; border-top: #009bde 1px solid; box-sizing: border-box; }
.accoContents.rateOfReturn .rangeArea .ui-state-default,
.accoContents.rateOfReturn .rangeArea .ui-widget-content .ui-state-default,
.accoContents.rateOfReturn .rangeArea .ui-widget-header .ui-state-default,
.accoContents.rateOfReturn .rangeArea .ui-button,
.accoContents.rateOfReturn .rangeArea .ui-button.ui-state-disabled:hover,
.accoContents.rateOfReturn .rangeArea .ui-button.ui-state-disabled:active { border: none; background: url("../img/common/cnt/ico_range_point.png") no-repeat 0 0; width: 20px; height: 20px; }
.accoContents.rateOfReturn .rangeArea .ui-slider-horizontal .ui-slider-handle { top: -0.5em; }
.accoContents.rateOfReturn .rangeArea .fNote { margin-top: 10px; font-size: 14px; width: 100%; height: 21px; }
.accoContents.rateOfReturn .rangeArea .fNote:after { content: ""; clear: both; }
.accoContents.rateOfReturn .rangeArea .fNote strong { display: block; position: relative; width: 33.33%; }
.accoContents.rateOfReturn .rangeArea .fNote .first { float: left;  }
.accoContents.rateOfReturn .rangeArea .fNote .center { float: left; text-align: center; }
.accoContents.rateOfReturn .rangeArea .fNote .last { float: right; text-align: right; }
.accoContents.rateOfReturn .rangeArea .fNote .first:before { content: ""; height: 12px; border-left: #d2d2d2 1px solid; position: absolute; left: 0%; top: -18px; }
.accoContents.rateOfReturn .rangeArea .fNote .center:before { content: ""; height: 12px; border-right: #d2d2d2 1px solid; position: absolute; right: 50%; top: -18px; margin-right: -1px; }
.accoContents.rateOfReturn .rangeArea .fNote .last:before { content: ""; height: 12px; border-right: #d2d2d2 1px solid; position: absolute; right: 0%; top: -18px; }
/* 상품목록 > 오른쪽 > 검색조건 키워드 */
.condiPuzzle { padding-bottom: 5px; margin-bottom: 15px; border-bottom: #e7e7e7 1px solid; position: relative; padding-right: 70px; }
.condiPuzzle .apply { position: absolute; top: 0; right: 0; }
.condiPuzzle .puzzleList span { font-size: 14px; display: inline-block; padding: 3px 10px; background-color: #f5f7fb; border-radius: 5px; padding-right: 30px; position: relative; margin: 0 5px 10px 0;}
.condiPuzzle .puzzleList span button { position: absolute; top: 50%; right: 5px; margin-top: -10px; width: 20px; height: 20px; background:url("../img/common/btn_file_del.png") no-repeat center 50%; }



/* === 금융상품몰 상세 === */
/* 창립 오픈 이벤트 */
.openEvent { color: #fff; text-align: center; background: url("../img/common/cnt/bg_open_event_banner.png") no-repeat 0 0; height: 80px; padding-top: 10px; box-sizing: border-box; }
.openEvent dt { font-size: 20px;}
.openEvent dd { height: 24px; padding: 0 80px; overflow: hidden; }

/* == 상세화면 컨텐츠 == */
/* 상세화면 */
.mallDetail { border-bottom: #d2d2d2 1px solid;  margin-bottom: 30px; padding-bottom: 50px; position: relative; }
.mallDetail.line { margin-top: 80px; }
.mallDetail.line:before { content: ""; border-top: #d2d2d2 1px solid; position: absolute; top: -30px; left: 0; right: 0;}
.mallDetail:after { content:''; display:block; clear:both;}

/* 상품상세 > 왼쪽 > 메뉴 */
.mallDetailLeft { float:left; width: 268px; position: relative; top: 0; left:0; background-color: #fff; }
.mallDetailLeft:not(.fixed) { left: 0 !important}
.mallDetailLeft .titName { display: none; border-bottom: #dedede 1px solid; }
.mallDetailLeft .titName p { display: -webkit-box; font-size: 20px; color: #333; border-top: #666 2px solid; padding-top: 10px; margin-bottom: 10px; width: 100%; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient:vertical; word-wrap:break-word; max-height: 75px; -webkit-line-clamp:2; }
.mallDetailLeft .leftTab li > button { display: block; position: relative; width: 100%; height: 59px; text-align: left; font-size: 18px; color: #666; border-bottom: #dedede 1px solid;}
.mallDetailLeft .leftTab li > button:hover, .mallDetailLeft .leftTab li > button:focus { color: #0063cc;}
.mallDetailLeft .leftTab li.on > button, .mallDetailLeft .leftTab li.open > button { color: #0063cc; border-bottom: #0063cc 1px solid; }
.mallDetailLeft .leftTab li.on > button:after { content: ""; width: 8px; height: 14px; background: url(../img/common/bg_main_arr_on.png) no-repeat 0 0; position: absolute; top: 50%; right: 20px; margin-top: -7px; }
.mallDetailLeft .leftTab li.fileArea { position: relative; display: none; }
.mallDetailLeft .leftTab li.fileArea > button:after {content: ""; width: 14px; height: 14px; background: url(../img/common/cnt/ico_file_more_plus.png) no-repeat center center; position: absolute; top: 50%; right: 20px; margin-top: -7px; transform: rotate(0deg);}
.mallDetailLeft .leftTab li.fileArea > button:hover:after,
.mallDetailLeft .leftTab li.fileArea > button:focus:after {transform:rotate(180deg); transition: transform 0.25s;}
.mallDetailLeft .leftTab li.fileArea .here {display:none; width: 9px; height: 14px; position: absolute; right: -1px; top: 50%; margin-top: -7px; background: url(../img/common/cnt/ico_left_tip_box.png) no-repeat center center; z-index: 2; }
.mallDetailLeft .leftTab li.fileArea .leftTipBox {display:none; position: absolute; left: 268px; top: 50%; max-width: 350px; padding: 10px 25px 10px 0; background-color: #fff; border: 1px solid #666; text-align: left; transition: opacity .15s linear; box-sizing: border-box; border-radius: 5px;box-shadow: 3px 3px 5px rgba(0,0,0,0.15); z-index: 1;}
.mallDetailLeft .leftTab li.fileArea .leftTipBox:focus {outline-style: dotted; outline-color: #666; outline-width: 1px}
.mallDetailLeft .leftTab li.fileArea .leftTipBox a { display: inline-block; width: 100%; line-height: 40px !important; height: 40px !important; padding: 0 20px 0 40px !important; }
.mallDetailLeft .leftTab li.fileArea .leftTipBox a:before { top: 50% !important; left: 15px !important; margin-top: -8px; }
.mallDetailLeft .leftTab li.fileArea .leftTipBox a:hover, 
.mallDetailLeft .leftTab li.fileArea .leftTipBox a:focus { background-color: #f2f2f2; color: #666 !important; text-decoration: none !important; }
.leftTipBox .listClose {position: absolute; top:5px; right: 5px; width:30px; height: 30px; }
.leftTipBox .listClose:before {content: ''; position: absolute; top: 9px; left: 9px; width: 12px; height: 12px; background: url('../img/common/bg_gnb_close.png') no-repeat 0 0; transition:transform 0.2s ease-in-out}
.leftTipBox .listClose:hover:before, .leftTipBox .listClose:focus:before {transform:rotate(-90deg); background-position: 0 bottom;}
.mallDetailLeft .leftTab li.fileArea .leftTipBox .icoBtnClose {top: 0; right: 0; width: 36px; height: 36px; background-position: center center;}
.mallDetailLeft div.fileArea { margin-top: 25px; }
.mallDetailLeft div.fileArea .fileList { margin-top: 5px; }
.mallDetailLeft .btnArea { display: none; margin-top: 20px; }
.mallDetailLeft .btnArea .full { margin-bottom: 10px; }
.mallDetailLeft .btnArea .full button { width: 100%; }
.mallDetailLeft .btnArea .txtItem li { padding: 0 3px; }
.mallDetailLeft .btnArea .txtItem li:last-child { padding-left: 5px; }
.mallDetailLeft.fixed .leftTab li.fileArea .focusSet {display: none;}
.mallDetailLeft.fixed .leftTab li.fileArea.open .here {display: block;}
.mallDetailLeft.fixed .leftTab li.fileArea.open .leftTipBox {display: block;}
.mallDetailLeft.fixed .leftTab li.fileArea.open .focusSet {display: block;}
.mallDetailLeft.fixed { position: fixed; top: 120px; left: 0; z-index: 2; }
.mallDetailLeft.fixed.bottom {position: absolute; top:auto !important; bottom: 35px; left: 0 !important}
.mallDetailLeft.fixed .leftTab li.fileArea { display: block; }
.mallDetailLeft.fixed .leftTab li > button { height: 45px; }
/* 상품상세 > 왼쪽 > 상품내용 */
.mallDetailRight { padding-left: 25px; float: right; margin-top: -15px; }
.mallDetailRight:focus { outline-style: dotted; outline-width: 1px; outline-color: #999 }
.mallDetail .col_9.mallDetailRight .titArea { margin-top: 30px; padding-bottom: 5px; }
.mallDetail .col_9.mallDetailRight .titArea span { margin-left: 10px; bottom: 8px; }
.mallDetail .col_9.mallDetailRight table { margin-top: 10px; }
.mallDetailRight .cntList .mallProduct .infoWrap { padding-right: 20px; }
.mallDetailRight .cntList .mallProduct .infoFigure { width: 125px; }
/* 알려드립니다 */
.mallDetailRight .noticeBox { padding: 0; border: none; border-radius: 0; box-shadow: none; margin-top: 40px;  }
.mallDetailRight .noticeBox .tit { font-size: 20px; }
.mallDetailRight .noticeBox .titH6 { padding-top: 10px; padding-bottom: 10px; }
.mallDetailRight .noticeBox .titH6:first-child { padding-top: 0; }
/* 카드혜택안내 */
.mallDetailRight .whiteBox.shadowNone { margin-top: 10px; }
.mallDetailRight .benefit { padding-left: 110px; position: relative; min-height: 85px; border-top: #e7e7e7 1px solid; padding-top: 25px; margin-top: 25px; }
.mallDetailRight .benefit:first-child { margin-top: 0; border-top: 0; }
.mallDetailRight .benefit .titH5 { color: #001f5b; margin-bottom: 10px; }
.mallDetailRight .benefit .ico { display: block; width: 80px; height: 80px; position: absolute; top: 30px; left: 0; background-repeat: no-repeat; background-position: 0 0; }
.mallDetailRight .benefit .ico.dcStore { background-image: url("../img/common/cnt/ico_mall_card_dcstore.png"); }
.mallDetailRight .benefit .ico.market { background-image: url("../img/common/cnt/ico_mall_card_market.png"); }
.mallDetailRight .benefit .ico.onShopping { background-image: url("../img/common/cnt/ico_mall_card_onshopping.png"); }
.mallDetailRight .benefit .ico.mobile { background-image: url("../img/common/cnt/ico_mall_card_mobile.png"); }
.mallDetailRight .benefit .ico.departmentStore { background-image: url("../img/common/cnt/ico_mall_card_department.png"); }
.mallDetailRight .benefit .ico.leisure { background-image: url("../img/common/cnt/ico_mall_card_leisure.png"); }
.mallDetailRight .benefit .ico.homeShopping { background-image: url("../img/common/cnt/ico_mall_card_homeshopping.png"); }
.mallDetailRight .benefit .ico.hospital { background-image: url("../img/common/cnt/ico_mall_card_hospital.png"); }
.mallDetailRight .benefit .ico.hotel { background-image: url("../img/common/cnt/ico_mall_card_hotel.png"); }
.mallDetailRight .benefit .ico.coffee { background-image: url("../img/common/cnt/ico_mall_card_coffee.png"); }
.mallDetailRight .benefit .ico.banking { background-image: url("../img/common/cnt/ico_mall_card_banking.png"); }
.mallDetailRight .benefit .ico.cashbag { background-image: url("../img/common/cnt/ico_mall_card_cashbag.png"); }
.mallDetailRight .benefit .ico.etc { background-image: url("../img/common/cnt/ico_mall_card_etc.png"); }
.mallDetailRight .benefit .txtList > li { padding-left: 9px; margin-top: 7px; }
.mallDetailRight .benefit .txtList > li:before { width: 3px; height: 3px; transform: rotate(0deg); }


/* === 베스트상품 === */
/* 베스트상품 타이틀 */
.bestProTit { padding: 60px 0 40px 0 !important; margin-bottom: 0 !important; z-index: 2; }
.bestProTit .titWrap { display: inline-block; position: relative; }
.bestProTit .titWrap h1 { display: inline-block; vertical-align: middle;  }
.bestProTit .titWrap .toggleRadio { float: right; margin: 5px 0 0 20px; }
.bestProTit .titWrap .toggleRadio label { min-width: 64px; }
.bestProTit .titWrap .toggleRadio input[type=radio]:checked + label { color: #4960eb; }
/* 베스트상품 1, 2, 3 */
.fullBg { background-color: #f5f7fb; }
.bestTop { margin-top: -150px !important; margin-bottom: 40px !important; padding: 150px 0 10px 0; }
.bestList { padding-bottom: 40px; width: 1132px; margin: 0 auto; }
.bestList .shapeBox { padding: 30px 30px 100px 30px; position: relative; height: 335px; box-sizing: border-box;}
.bestList .shapeBox .mallProduct .infoTit { padding-right: 0; padding-bottom: 7px; }
.bestList .shapeBox .mallProduct .infoTit a { font-size: 20px; line-height: 1.3; }
.bestList .shapeBox .mallProduct .infoFigure { position: absolute; bottom: 30px; left: 30px; right: 30px; line-height: 1.2; padding: 0; }
.bestList .shapeBox .mallProduct .infoFigure strong { display: block; padding-left: 0; font-size: 20px; }
.bestList .shapeBox .mallProduct .infoFigure strong span { font-size: 28px; }
.bestList .shapeBox .mallProduct .numDia { position: absolute; top: 12px; right: 5px; display: inline-block; width: 48px; height: 51px; background: url("../img/common/cnt/bg_num_dia.png") no-repeat 0 0; }
.bestList .shapeBox .mallProduct .numDia i.num { display: inline-block; width: 41px; height: 44px; line-height: 42px; text-align: center; color: #fff; font-size: 18px;}

.bm .bestList .shapeBox .mallProduct .infoTit {padding-bottom: 0; }
.bm .bestList .shapeBox .mallProduct .txt{padding-top:7px;}

/* 다른고객님의 관심상품 */
.anotherList { margin-top: 15px; }
.anotherList .badgeList { margin-bottom: 0; }
.anotherList > li { position: relative; padding: 20px 120px 20px 0 !important; }
.anotherList > li .tit { margin-bottom: 10px; }
.anotherList > li .tit a { font-size: 20px; line-height: 1.5em; letter-spacing: -0.05em; color:#333; }
.anotherList > li .tit a:hover, .anotherList > li .tit a:focus { color: #0063cc; text-decoration: underline; }
.anotherList > li .tit a:after { display: none; }
.anotherList > li .interestBtn { position: absolute; right: 0; top: 50%; margin-top: -20px; }
.anotherList > li .bestBadge { font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; }
/* 베스트상품 - 상품명배지 */
.proBadge { display: inline-block; position: relative; margin-right: 8px; font-size: 14px; border-radius: 12px; padding: 0 14px; background: none; height: 24px; line-height: 24px;}
.proBadge.deposit, .depositBg .proBadge { border: #009add 1px solid; color: #0079b8; } /* 예금/외화예금 */
.proBadge.card, .cardBg .proBadge { border: #a466cf 1px solid; color: #724ba9; } /* 카드 */
.proBadge.loan, .loanBg .proBadge { border: #df7300 1px solid; color: #b85f00; } /* 대출 */
.proBadge.fund, .fundBg .proBadge { border: #e54e80 1px solid; color: #d83072; } /* 펀드 */
.proBadge.insurance, .insurBg .proBadge { border: #80ab10 1px solid; color: #477d00; } /* 보험 */
.proBadge.bond, .bondBg .proBadge { border: #26a7b5 1px solid; color: #007993; } /* 산금채 */
.proBadge.trust, .depositBg .proBadge { border: #26a7b5 1px solid; color: #007993; } /* 신탁 */
.proBadge.pension, .pensionBg .proBadge { border: #a39346 1px solid; color: #817037; } /* 퇴직연금 */


/* === 수익률TOP10 === */
.tableX .blankLine { border-bottom: none !important; position: relative;}
.tableX .blankLine > div.line:after { content: ""; border-bottom: #dedede 1px solid; position: absolute; bottom: 0; left: 20px; right: 20px; }
.tableX th.blankBottom { border-bottom: none !important; }
.tableX th.blankBottom > div.line { position: relative; }
.tableX th.blankBottom > div.line:after { content: ""; border-bottom: #dedede 1px solid; position: absolute; bottom: -16px; left: 15px; right: 15px; }
.tableX th.blankBottom > div.line.long:after { left: 0; right: 0; }
.tableX th.blankTop { border-top: none !important; }
.mallProduct .company { font-size: 14px; margin-top: 5px; }
.mallProduct .company strong { padding-right: 10px; }


/* === 가입 중 상품 === */
.prodList .whiteBox{margin-bottom:20px; border:0; background:#DEECF9;}
.prodList .singleInfo strong,.bm .prodList .singleInfo ul.subInfo li > .pointC1{font-size:24px;}
.prodList .prodInfo{margin-top:10px; color:#333; font-size:18px; text-shadow: 0px 0px 0px rgba(102,102,102, 0.5);}
.prodList .prodDesc{position:relative;}
.prodList .prodDesc .txt{display: inline-block; margin: 20px 30px 0 0;}
.prodList .prodDesc .date{margin-left:5px;}
.prodList .prodDesc .btnArea{position:absolute; bottom:0; right:0; margin:0;}
.prodList .prodDesc .btnArea .cbtnB{min-width:140px; background-color:#4960EA;}


/*================== 퇴직연금 ===================*/
/* 퇴직연금-My연금시뮬레이션(BRIGPS1005)*/
.myPension .bdB {border-bottom:1px solid #dedede;}
.grayBox.ac .myPension .colGroup [class*=col_] {margin:0;}
.myPension > [class*=col_] {float:left; margin:0; box-sizing:border-box;}
.myPension:after {display:block; content:""; clear:both;}
.myPension .inner:before {content:""; position:absolute; left:0px; top:0px; bottom:0px; border-left:1px solid #dedede;}
.myPension table td {background:#fff;}
.grayBox.ac .myPension [class*=col_]:not(.iptGroup) > label {margin-top:-7px;}

/* 퇴직연금-My연금시뮬레이션(BRIGPS1006)*/
.retireTop {padding:20px 30px;}
.retireBarWrap {position:relative; padding:90px 0 40px;}

.retireBarWrap .retireBar {margin-left:192px;}
.retireBarWrap .retireBar + .retireBar {margin-top:13px;}
.retireBarWrap .retireBar * {display: inline-block; box-sizing:border-box;}
.retireBarWrap .retireBar .label {width:78px; margin-right:18px; text-align:right;}
.retireBarWrap .retireBar .barWRap {display:inline-block; position:relative; top:10px; width:550px; margin-right:18px; height:6px; background:#dbdbdb; border-radius:6px; z-index:10;}
.retireBarWrap .retireBar .bar {position:relative; top:-13px; width:0; height:6px; border-radius:6px; z-index:20;}
.retireBarWrap .retireBar .bar.red {background:#d6006d;}
.retireBarWrap .retireBar .bar.blue {background:#4960eb;}
.retireBarWrap .retireBar .bar:after {display:block; position:absolute; left:100%; top:-5px; width:16px; height:16px; margin-left:-8px; background:#fff; border-radius:50%; box-sizing:border-box; content:""; z-index:10;}
.retireBarWrap .retireBar .bar.red:after {border:4px solid #d6006d;}
.retireBarWrap .retireBar .bar.blue:after {border:4px solid #4960eb;}
.retireBarWrap .retireBar .pension strong {font-size:24px;}
.retireBarWrap .retireBar .label, .retireBarWrap .retireBar .pension {color:#333;}

.retireBarWrap .totalWrap {position:absolute; right:288px; top:85px; width:165px; height:82px; background:#fff5f5; border-left:1px dashed #e00000; border-right:1px dashed #e00000; z-index:0;}
.retireBarWrap .totalWrap .total {position:absolute; top:-55px; left:0; padding:8px 20px; border:1px solid #666; border-radius:5px; background-color:#fff; box-shadow:5px 5px 5px rgba(0,0,0,0.07); text-align:center; white-space:nowrap; box-sizing:border-box;}
.retireBarWrap .totalWrap .total span {color:#333}
.retireBarWrap .totalWrap .total .label {font-size:14px;}
.retireBarWrap .totalWrap .total strong {color:#e00000}
.retireBarWrap .totalWrap .arrow {display:block; position:absolute; left:50%; top:-11px; margin-left:-8px; width:16px; height:9px; background: url(../img/common/bg_tip_box.png) no-repeat 0; transform:rotate(180deg);}


/* BRRGIG0700 */
.stepbrrgig0700 {width: 100%;}
.stepbrrgig0700 li {float:left; position:relative; width:33.3%; height:63px; padding:10px 16px 0; box-sizing:border-box;}
.stepbrrgig0700 li:before{content:''; display:block; position:absolute; left:1px; top:0; width:18px; height:63px; background:url("../img/common/cnt/bg_brrgig0700.png") no-repeat 0 50%;}
.stepbrrgig0700 li:first-child:before{left:0px;}
.stepbrrgig0700 li:after{content:''; display:block; position:absolute; right:-2px; top:0; width:18px; height:63px; background:url("../img/common/cnt/bg_brrgig0700.png") no-repeat 100% 50%;}
.stepbrrgig0700 li > p{width:100%; height:43px; border-top:1px solid #74caff; border-bottom:1px solid #74caff; background:#e8f7ff; font-size:14px; text-align:center; box-sizing:border-box; line-height: 43px;}

/* === 투자성향알아보기 === */
.openList { border-bottom: #ccc 1px solid; }
.openList .cont { border-bottom: none; }
.openList .tit { padding: 17px 20px; color: #333; }

/* ================== 부가서비스================== */
/* 금리,수익률 조회 : CBADIE2100 */
.tblCalWrap.singleDate{border-top:0}
.tblCalWrap.singleDate .topArea{background:none}

/* ================== 아코디언================== */
/* 19.12.16-일부컨텐츠보여지는 아코디언 추가(강석희) */
.accoWrapNew{background-color: #f9f9f9; padding:7px 0 30px 0; overflow:hidden;}
.accoWrapNew .titArea{background-color: #fff;}
/* .accoWrapNew .accoBtn{transition:transform .2s ease-out; -webkit-transition:transform .2s ease-out; -ms-transition:transform .2s ease-out} */
.accoWrapNew.on .accoBtn{transform:rotate(180deg); -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg)}
.accoWrapNew .accoContents{display: block;  margin:30px 0 0 0; padding:0; }
.accoWrapNew.ani .accoContents{transition:max-height .3s ease-in-out; -webkit-transition:max-height .3s ease-in-out; -ms-transition:max-height .3s ease-in-out}
.accoWrapNew .accoContents > table > tbody > tr.last_default > td{transition:padding-bottom .3s ease-out; -webkit-transition:padding-bottom .3s ease-out; -ms-transition:padding-bottom .3s ease-out; transition-delay:.1s; -webkit-transition-delay:.1s; -ms-transition-delay:.1s; padding-bottom:0; }
.accoWrapNew.on .accoContents > table > tbody > tr.last_default > td{padding-bottom:20px}
.accoWrapNew .accoContents > table > tbody > tr.alpha > td{opacity:0; filter:alpha(opacity=0); -webkit-filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transition:opacity .3s ease-out; -webkit-transition:opacity .3s ease-out; -ms-transition:opacity .3s ease-out;}
.accoWrapNew.on .accoContents > table > tbody > tr.alpha > td{opacity:1; filter:alpha(opacity=100); -webkit-filter:alpha(opacity=100); -ms-filter:alpha(opacity=100);}

/* 19.12.17-기존아코디언 수정(강석희) */
.accoWrap.choiceInfo{background-color: #f9f9f9;}
.choiceInfo .accoBtn{transition:transform .2s ease-out; -webkit-transition:transform .2s ease-out; -ms-transition:transform .2s ease-out}
.choiceInfo.accoWrap .titArea{background-color: #fff}
.choiceInfo.accoWrap.on .titArea.line{margin-bottom:19px; }
.accoWrap.choiceInfo .accoContents{margin-top:-20px}
.accoWrap.choiceInfo .accoContents > table{opacity:0; filter:alpha(opacity=0); -webkit-filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transition:opacity .3s ease-out; -webkit-transition:opacity .3s ease-out; -ms-transition:opacity .3s ease-out;}
.accoWrap.choiceInfo.on .accoContents > table{opacity:1; filter:alpha(opacity=100); -webkit-filter:alpha(opacity=100); -ms-filter:alpha(opacity=100);}

table.bLine tbody.tbodySet.accoWrap td .accoBtn{outline:none;transition:transform .2s ease-out !important; -webkit-transition:transform .2s ease-out !important; -ms-transition:transform .2s ease-out !important}
.accSumBox .accoBtn,
.moreArea .moreBtn button,
.accoList .accoWrap .accTopArea .accoBtn{outline:none;}
.moreArea .moreBtn button{position: relative; background: none}
.moreArea .moreBtn button:after{content: ''; display: block; position: absolute; width:15px; height:15px; background: url(../img/common/btn_secu_acco_off.png) no-repeat center center; right:0; top:50%; margin-top:-6px; transition:transform .2s ease-out; -webkit-transition:transform .2s ease-out; -ms-transition:transform .2s ease-out}
.moreArea.on .moreBtn button{background: none}
.moreArea.on .moreBtn button:after{transform:rotate(180deg); -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg)}

/* 20.02.06 오픈뱅킹 계좌통합조회 페이지(정현아) */
.openSection .accList .topArea{padding:15px 20px;}

.openSection .allAccList .accoWrap {margin-top:20px;}
.openSection .allAccList .accoWrap .accoContents {padding-bottom: 0;}
.openSection .accSumBox{padding: 12px 20px; border:0; border-radius:0; background-color: #6a7291; color: #fff; }
.openSection .accSumBox .topArea .summary {float: left; line-height:34px;}
.openSection .bankName{position:relative;}
.openSection .bankName .bankImg{position:absolute; width:30px; top:2px; left:0;}
.openSection .bankName span{display:block; padding-left:37px; }
.openSection .accSumBox .topArea .txtItem {float:right; line-height:34px; padding-right:30px;}
.openSection .accSumBox .accoBtn{top:9px; right:15px;}
.openSection .accSumBox .accoBtn{background: url(../img/common/btn_acco_off_white.png) no-repeat center center;}
.openSection .accoWrap.on .accSumBox{background-color: #6a7291; color: #fff;}
.openSection .accoWrap.on .accoBtn.def{background: url(../img/common/btn_acco_off_white.png) no-repeat center center;}
.openSection .accList {margin-top:10px;}


.openSection .accList .accInfo .accName{display:inline-block; color:#666; vertical-align:middle;}

.openSection .badge.active{margin-right:3px; border:1px solid #0054ad; background-color: #fff; color:#0054ad; }
.openSection .badge.inactive{margin-right:3px; border:1px solid #999; background-color: #fff; color:#999; }
.openSection .badge.complete{margin:10px -5px 0 0; border:1px solid #0054ad; background-color: #fff; color:#0054ad;}
.openSection .badge.unable{margin:10px -5px 0 0; border:1px solid #e00000; background-color: #fff; color:#e00000; }
.openSection .badge.unableWithdraw{margin-right:7px; border:1px solid  #d6006d; background-color:  #fff9fb; color:#d6006d;}
.openSection .iptGroup{margin:10px -5px 0 0;}
.openSection .iptGroup .desc{margin-right:5px;}

.openSection input[type="checkbox"]:not(.def)+label:before {top: 2px;}

.openSection .tableX td{padding:22px 20px;}
.openSection td.unableWrap{position:relative;}
.openSection td.unableWrap .unableTip{position:absolute; bottom:12px; left:20px; }
.openSection td.unableWrap .unableTip .tipWrap .help{top:0; width:15px; height: 15px; overflow: hidden; background: url('../img/common/ico_question_small.png') no-repeat 0 0;}
body:not(.isMobile) .openSection .tipWrap:hover .help, .openSection .tipWrap .help:focus, .openSection .tipWrap.on .help {background-position: 0 center; }


/* 20.04.17 오픈뱅킹 잔액모으기(정현아) */
.openSection .tableX.bLine td{padding:20px 15px;}
.openSection td .numWrap{position:relative;}
.openSection td .numWrap img{position:absolute; top:2px; left:0; width:20px;}
.openSection td .numWrap .num{font-size:16px; display:block; padding-left:25px;}
.openSection td .txtItem .icoTxtReload{font-size:14px;}
.openSection td .txtItem .icoTxtReload:before{left:2px; margin-top:-6px;}
table .colGroup .descTxt{font-size:14px !important;}

/* 20.03.06 추가(정현아) */
.openSection .accList .dateInfo{width:360px;}
.openSection .accList .dateInfo li{width:33.3%;}
.openSection .accList .priceInfo{width:292px;}

/* 2024.10 기업뱅킹 */
.openSection.openBE .allAccList .accoWrap {margin-top:0 !important;}
.openSection.openBE .bankName span {padding-left:0 !important;}
.openSection.openBE .accList .dateInfo ul {display:flex; justify-content:flex-end;}

/* 20.04.07 접근성추가(정현아)*/
.moreArea.accoWrap .moreBtn button:focus{outline:1px dotted #999 !important;}
.accoList .accoWrap .accTopArea .accoBtn:focus{outline:1px dotted #999 !important;}
input[type="checkbox"].mallN:focus + label:after{outline:1px dotted #999 !important;}
table.bLine tbody.tbodySet.accoWrap td .accoBtn:focus{outline:1px dotted #999 !important;}

/* 21.02.09 My KDB 탭추가(박혜미)*/
.tab.typeTxt{display:inline-block;margin-top:5px;margin-bottom:0;border-bottom:0;vertical-align:top;}
.tab.typeTxt > li{width:auto;height:28px;border:none;border-bottom:2px solid transparent;}
.tab.typeTxt > li + li{margin-left:18px;}
.tab.typeTxt > li > *{min-height:28px;color:#666;font-size:16px;}
.tab.typeTxt > li.on{border-color:#333;background:none;}
.tab.typeTxt > li.on > *{top:auto;padding-top:0;background:none;color:#333;font-weight:bold;}

/* 21.03.17 상담용 가이드 */
table tr.guide_row td{padding:0 !important;}
table tr.guide_row .caseBox{margin:0 -1px;}
table tr.guide_row .caseBox:before{position:absolute;top:0;left:100%;width:2px;height:100%;border-bottom:2px solid #003895;background:inherit;content:'';}
table tr.guide_row+tr{position:relative;}
table tr.guide_row.row1+tr td,
table tr.guide_row.row2+tr+tr td{border-bottom:2px solid #003895;}
table tr.guide_row+tr td:first-child,
table tr.guide_row.row2+tr+tr td:first-child{border-left:2px solid #003895 !important;}
table tr.guide_row+tr td:last-child,
table tr.guide_row.row2+tr+tr td:last-child{border-right:2px solid #003895;}
table tr.guide_row.row1.hidden_guide+tr td,
table tr.guide_row.row2.hidden_guide+tr+tr td{border-bottom-width:0;}
table tr.guide_row.hidden_guide + tr td:first-child,
table tr.guide_row.hidden_guide.row2 + tr+tr td:first-child{border-left-width:0 !important;}
table tr.guide_row.hidden_guide+tr td:last-child,
table tr.guide_row.hidden_guide.row2+tr+tr td:last-child{border-right-width:0;}

/* 21.05.21 다른금융 계좌조회 추가 (정현아) */
.accSumBox.account .accoTit {background:url(../img/common/ico_account.png) no-repeat left center;}/* 계좌 */
.accSumBox.card .accoTit {background:url(../img/common/ico_card.png) no-repeat left center;}/* 카드 */
.accSumBox.foreign.fint .accoTit {background:url(../img/common/ico_fint.png) no-repeat left center;}/* 선불정보 21.07.06 */
.accList.ob .openName{vertical-align: baseline;}
.accList.ob .openName img{display:inline-block; vertical-align:middle; width: 19px;}
.accList.ob .openName span{display:inline-block; vertical-align:middle; margin-left:2px;}
.accList.ob .icoTxtReload:before{margin-top:-8px;}
.accList.ob .txtItem{white-space: normal; word-break: break-word;}

/* 21.05.27 bankLogo 추가 (정현아) */
.bankLogo{margin-top: 9px;}
.bankLogo img{display: inline-block; vertical-align: middle; width: 19px;}
.bankLogo strong{display: inline-block; margin-left:2px; vertical-align: middle; color:#333;}
.bankLogo.line{position:relative; display: inline-block; margin-top:0; margin-right: 9px;}
.bankLogo.line:after{content: ''; position: absolute; right: -10px; top: 4px; bottom: 3px; border-left: 1px solid #ccc;}

/* 21.06.11 오픈뱅킹 카드사 수정 (정현아) */
.accList.obCard .topArea{line-height:30px;}
.accList.obCard .topArea .txtItem .links.wh, .accList.obCard .topArea .txtItem .links.wh > span{color:#fff; font-size: 15px;}
.accList.obCard .topArea .txtItem .links.wh > span:after{border-color:#fff;}
.accList.obCard .detailList .accInfo{padding:20px 20px; vertical-align: middle; }
.accList.obCard .detailList .dateInfo{width: 432px;}
.accList.obCard .detailList .priceInfo{width: 220px; vertical-align: middle;}
.accList.obCard .detailList .dateInfo li:nth-child(1){width:40%}
.accList.obCard .detailList .dateInfo li:nth-child(2){width:60%}
.accList.obCard .priceInfo .btnGroup{margin-top: 5px;}
.accList.obCard .priceInfo .links.red > span{color:#e00000;}

.allAccList.obCheck .accSumBox .badge{position:absolute; top:18px; right:62px; margin:0; font-size:14px;}
.allAccList.obCheck .accSumBox .accoBtn {top:11px;}
.allAccList.obCheck .accSumBox .iptGroup{position:absolute; top:17px; right: 57px; margin:0;}
.allAccList.obCheck .summary .bankName{display: inline-block;}
.allAccList.obCheck .accInfo{width: 380px;} 
.allAccList.obCheck .accInfo .badge{margin:0 3px 0 0 !important;}
.allAccList.obCheck .dateInfo{width:752px;}

/* 21.07.06 오픈뱅킹 선불정보 추가 (정현아) */
.accList.obFint .topArea{position:relative;}
.accList.obFint .topArea .summary{float:none; position: absolute; top:50%; transform: translateY(-50%);}
.accList.obFint .topArea .txtItem .links.wh, .accList.obFint .topArea .txtItem .links.wh > span{color:#fff; font-size: 15px;}
.accList.obFint .topArea .txtItem .links.wh > span:after{border-color:#fff;}
.accList.obFint .topArea .txtItem.currency li{display: block; margin-left:0;}
.accList.obFint .topArea .txtItem.currency li:before{position:static; border-left:0;}
.accList.obFint .accInfo{vertical-align: middle;}

/* 21.12.24 기업뱅킹 로그인 후 화면 개선 (정현아) */
.newBe .titArea .titH3 {padding-left:0; background:none; color:#333;}
.newBe .titArea .icoTxtIntro{width:21px; height:22px; margin-top:0; padding-left:0;}

.newBe .topArea{margin-bottom:40px;}
.newBe .topArea:after{content:''; display:block; clear: both;}
.newBe .kdbinfoBox{position:relative; float:left; width:360px; height:265px; border: 1px solid #0063cc; border-radius: 8px; box-shadow:5px 5px 5px rgba(0,0,0,0.07); box-sizing: content-box;}
.newBe .kdbinfoBox .topGray{padding: 15px 30px; background: #f8f8f8; border-radius: 8px;}
.newBe .kdbinfoBox .topGray .icoTxtIntro{position:absolute; top:0; right:0;}
.newBe .kdbinfoBox .myInfo{padding: 10px 30px 0 30px;}
.newBe .kdbinfoBox .myInfo .txtList li{margin-top:0; font-size:15px;}
.newBe .kdbinfoBox .state{margin-top:15px;}
.newBe .kdbinfoBox .state li{display:inline-block; padding-right:18px;}
.newBe .kdbinfoBox .state li:last-child{padding-right: 0;}
.newBe .kdbinfoBox .state li a{display:block; width:58px; height: 58px; line-height:58px; border-radius: 12px; color:#333; background-color: #f0f3f6;  text-align:center;}
.newBe .kdbinfoBox .state li a .num{color:#b45ce5; font-size: 26px; font-family: 'Roboto Medium';}
.newBe .kdbinfoBox .state li:nth-child(2) a .num{color: #00a8f1;}
.newBe .kdbinfoBox .state li:nth-child(3) a .num{color: #25c9cb;}
.newBe .kdbinfoBox .state li:nth-child(4) a .num{color: #666;}
.newBe .kdbinfoBox .state .txt{display:block; color:#333; font-size:15px;}
.newBe .kdbinfoBox .linkGroup{position:absolute; bottom:15px; left:30px;}
.newBe .kdbinfoBox .links > span:after{border:0;}

.newBe .quickMenu{float:right; width:742px;}
.newBe .quickMenu:after{content:''; display:block; clear: both;}
.newBe .quickMenu .titArea{padding-bottom:0; margin-top:0;}
.newBe .quickMenu ul{margin-top: -9px;}
.newBe .quickMenu li[class*=ico]{border:1px solid #666; box-shadow:5px 5px 5px rgba(0,0,0,0.07); }
.newBe .quickMenu li{float:left; width:170px; height:100px; margin:20px 0 0 20px; border:1px solid #d2d2d2; border-radius: 8px; box-sizing: border-box; text-align: center; overflow: hidden;}
.newBe .quickMenu li a{display:block; width:100%; margin:0 auto; padding:14px 0 10px 0; transition:background-color 0.25s ease-in-out;}
.newBe .quickMenu li a:hover, .newBe .quickMenu li a:focus{background-color: #0063cc;}
.newBe .quickMenu li a:hover > span, .newBe .quickMenu li a:focus > span{color:#fff;}
.newBe .quickMenu li a span{width:100%; padding: 0 15px; font-size:18px; font-weight: bold; color:#333; word-break: break-all; box-sizing: border-box;}
.newBe .quickMenu li.icoNone a{position:relative; height:100%; padding:0;}
.newBe .quickMenu li.icoNone a span{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.newBe .quickMenu [class*=ico] > a:before {content:''; display:block; width:40px; height:40px; margin:0 auto 7px auto;}
.newBe .quickMenu ul > li.ico1 > a:before {background:url(../img/main/be/ico_direct1.png) no-repeat 0 0;}
.newBe .quickMenu ul > li.ico2 > a:before {background:url(../img/main/be/ico_direct2.png) no-repeat 0 0;}
.newBe .quickMenu ul > li.ico3 > a:before {background:url(../img/main/be/ico_direct3.png) no-repeat 0 0;}
.newBe .quickMenu ul > li.ico4 > a:before {background:url(../img/main/be/ico_direct5.png) no-repeat 0 0;}
.newBe .quickMenu ul > li.ico5 > a:before {background:url(../img/main/be/ico_direct_daechul.png) no-repeat 0 0;} 
.newBe .quickMenu ul > li:nth-child(5){margin-left:0;}
.newBe .quickMenu .ico1 a:hover:before, .newBe .quickMenu .ico1 a:focus:before{background:url(../img/main/be/ico_direct1_hover.png) no-repeat 0 0;}
.newBe .quickMenu .ico2 a:hover:before, .newBe .quickMenu .ico2 a:focus:before{background:url(../img/main/be/ico_direct2_hover.png) no-repeat 0 0;}
.newBe .quickMenu .ico3 a:hover:before, .newBe .quickMenu .ico3 a:focus:before{background:url(../img/main/be/ico_direct3_hover.png) no-repeat 0 0;}
.newBe .quickMenu .ico4 a:hover:before, .newBe .quickMenu .ico4 a:focus:before{background:url(../img/main/be/ico_direct5_hover.png) no-repeat 0 0;}
.newBe .quickMenu .ico5 a:hover:before, .newBe .quickMenu .ico5 a:focus:before{background:url(../img/main/be/ico_direct_daechul_hover.png) no-repeat 0 0;}

.newBe button.addBox {width:100%; height: 100%; background-color: #f8f8f8; color:#666; border-color:#d2d2d2; box-shadow: none; border-radius: 8px; transition:background-color 0.25s ease-in-out;}
.newBe button.addBox > span {position:relative; display:block; padding-top:25px; line-height:1.4em; transition:color 0.25s ease-in-out; font-size: 16px; }
.newBe button.addBox > span:after, .newBe button.addBox > span:before {content:''; position: absolute; top:0; left:50%; width:1px; height: 17px; background-color: #666; transition:all 0.25s ease-in-out}
.newBe button.addBox > span:before {width:17px; height: 1px; margin-left:-8px; top:8px;}
.newBe button.addBox:hover, .newBe button.addBox:focus {color:#fff; background-color: #0063cc; border-color:#0063cc;} 
.newBe button.addBox:hover > span:after, .newBe button.addBox:focus > span:after {width:3px; height:21px; margin-left:-1px; top:-2px; background-color:#fff; transform:rotate(180deg);}
.newBe button.addBox:hover > span:before, .newBe button.addBox:focus > span:before {width:21px; height:3px; top:7px; margin-left:-10px; background-color:#fff; transform:rotate(180deg);} 

.newBe .titArea .icoTxtIntro{margin-left:10px;}
.newBe .accountList{transition:transform 0.3s ease-in-out; -ms-transition:transform 0.3s ease-in-out; }
.newBe .accountList:after{content:''; display:block; clear:both;}
.newBe .accountList > li{position:relative; float:left; width:286px; height:105px; padding:0 7px; overflow: hidden}
.newBe .accountList > li:first-child{margin-left:0;}
.newBe .accountList > li > a.item{position:relative; display: block; width:100%; height:100%; padding: 15px 20px; color:#666; background-color:#f8f8f8; border-radius: 8px; border:1px solid #d2d2d2; box-sizing: border-box;}
.newBe .accountList > li > a.item .tit{position:absolute; top:15px; width:52px; height:22px; padding: 0 10px; border:1px solid #009add; color:#0079b8; border-radius:4px; background-color:#fff; font-size:14px; line-height:21px; text-align: center;}
.newBe .accountList > li > a.item .tit.FX {color: #a466cf; border-color: #724ba9;}
.newBe .accountList > li > a.item .tit.LN {color: #df7300; border-color: #b85f00;}
.newBe .accountList > li > a.item .tit.FN {color: #e54e80; border-color: #d83072;}
.newBe .accountList > li > a.item .tit.BR {color: #a49447; border-color: #817037;}
.newBe .accountList > li > a.item .tit.IL {color: #26a7b5; border-color: #007993;}
.newBe .accountList > li > a.item .tit.IS {color: #80ab10; border-color: #477d00;}
.newBe .accountList > li > a.item em{display:block; padding:0 0 5px 80px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box;}
.newBe .accountList > li > a.item em, .newBe .accountList li > a.item span{white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.newBe .accountList > li > a.item .price{display:block; margin-top:5px; text-align: right; font-size:18px;}
.newBe .accountList.bbs .txtItem{width:270px;}
.newBe .accountList.bbs .txtItem > li .links span{max-width:100%; font-family:'NotoSans Light', 'Roboto Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; text-overflow:clip;}
.newBe .accountList .btnWrap {position: absolute; left:8px; right:0; bottom:1px; width:270px; height:34px; overflow:hidden; border-bottom-left-radius:7px; border-bottom-right-radius:7px;}
.newBe .accountList .btnWrap .btns {position: absolute; left:0; right:0; top:100px; padding: 6px 0; background-color: #fafafa; text-align: center; transition:top 0.2s ease-in-out;}
.newBe .accountList .btnWrap .btns .links{display:inline-block; height:auto; color:#666 !important; text-shadow: none !important;}
.newBe .accountList .btnWrap .btns .links:hover > span, .newBe .accountList .btnWrap .btns .links:focus > span{text-shadow: none !important;}
.newBe .accountList .btnWrap .btns .links > span:after{border-bottom:1px solid #fafafa !important;}
.newBe .accountList .btnWrap .btns .links:hover > span:after,.newBe .accountList .btnWrap .btns .links:focus > span:after{border-bottom:1px solid #666 !important;}
.newBe .accountList .btnWrap .btns .links:hover:after,.newBe .accountList .btnWrap .btns .links:focus:after{background-color: transparent;}
.newBe .accountList .btnWrap .txtItem > li:before {bottom:12px;}
.newBe .accountList .btnWrap.active .btns{top:0;}
.newBe .accountList li.on > a, .newBe .accountList li > a.active{color:#fff; background-color: #0063cc;}
.newBe .accountList.bbs.grid{padding:0;}
.newBe .carouselSlide {margin-top:0;}
.newBe .carouselSlide .slideWrapper {margin:0 -7px; padding:0;}
.newBe .carouselSlide button[class*=btn] {position:absolute; left:0; top:95px; width:30px; height:30px; min-width:0; background: url(/img/common/img_common.png) no-repeat -370px 0; z-index:3}
.newBe .carouselSlide button.btnNext {left:auto; right:0; background-position:-370px -30px}
.newBe .carouselSlide button.circle[class*=btn] {width:54px; height:54px; left:-64px; background: rgba(255,255,255,0.5) url(../img/common/img_common.png) no-repeat -260px 0px; border-radius:50%; box-shadow: 3px 3px 15px 0px rgba(0,0,0,0.2)}
.newBe .carouselSlide button.circle.btnNext {background-position: -314px 0px; left:auto; right:-64px;}
.newBe .carouselSlide button.circle[class*=btn]:hover, .carouselSlide button.circle[class*=btn]:focus {background-position: -260px -54px;}
.newBe .carouselSlide button.circle.btnNext:hover, .carouselSlide button.circle.btnNext:focus {background-position: -314px -54px;}
.newBe .carouselSlide button.circle[class*=btn][disabled] {background-position:-260px 0px !important;}
.newBe .carouselSlide button.circle.btnNext[disabled] {background-position:-314px 0px !important;}
.newBe .carouselSlide.center button[class*=btn] {top:50%; margin-top:-27px;}

.newBe .tableWrap{border:2px solid #0063cc; border-radius:5px; background-color:#0063cc;}
.newBe .tableTit:after, .newBe .tableInfo:after{content:''; display:block; clear: both;}
.newBe .tableTit{position:relative; padding: 10px 20px;}
.newBe .tableTit .titH3{vertical-align:middle; color:#fff; line-height: 1.5;}
.newBe .tableTit .txt16{color:#fff;}
.newBe .tableTit .txtInfo{position:absolute; top:50%; transform: translateY(-50%); left:0; width:100%; text-align:center; color:#fff; font-size:24px; }
.newBe .tableTit .btnGroup button{position:relative; width:34px; height:34px; border:none; border-radius:8px; background-color: #2b84de;}
.newBe .tableTit .btnGroup button:after{content:''; display:inline-block; width:20px; height:20px; vertical-align: middle;}
.newBe .tableTit .btnGroup button.icoBtnReload:after{background:url('../img/main/be/btn_newbe_reload.png') no-repeat;}
.newBe .tableTit .btnGroup button.icoBtnLookup:after{width:18px; height:18px; background:url('../img/main/be/btn_newbe_plus.png') no-repeat;}
.newBe .tableTit .btnGroup button:hover:after,.newBe .tableTit .btnGroup button:focus:after{transform:rotate(-180deg); transition: transform 0.5s;}

.newBe .tableInner{padding: 20px 20px 40px 20px; border-bottom-left-radius:5px; border-bottom-right-radius:5px; background-color:#fff; box-sizing: border-box;}
.newBe .tableInfo{padding: 5px 0 7px 0;}
.newBe .tableInfo .price{display: inline-block; vertical-align: middle;}
.newBe .tableInfo .price .txt{font-size:16px;}
.newBe .tableInfo .price strong{color:#d7006d; font-size: 24px; font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
.newBe .tableInfo .price .unit{font-size:20px; color:#666}
.newBe .tableInfo .fl .btnGroup{display: inline-block; margin-left: 15px;}

.newBe .btnD{background-color:#555;}
.newBe .btnD:hover, .newBe .btnD:focus{background-color:#2e3040;}
.newBe .btnG:hover, .newBe .btnG:focus {background-color:#2b84de; color:#fff;}
.newBe .btnG.on{background-color:#2b84de; color:#fff;}

/* 22.05.16 기업뱅킹 대시보드 추가 */
.newBe .topBox {position:relative; padding:0; margin-bottom:40px; overflow: hidden;}
.newBe .topBox .topGray {padding: 24px 30px 27px; background: #f8f8f8;}
.newBe .topBox .topGray:after{content:''; display: block; clear: both;}
.newBe .topBox .topGray .fl span.bold{display: inline-block; margin-right:5px; vertical-align: middle; font-size:20px;}
.newBe .topBox .topGray .fl .links{margin:4px 0;}
.newBe .topBox .topGray .fl .alert{display: inline-block; width:22px; height:22px; margin-right:5px; vertical-align:middle; animation: alarm_ani 4.3s .5s linear infinite;}
.newBe .topBox .topGray .fl .alert:before{content: ''; position:absolute; top:-2px; left:0;  display: inline-block; width: 22px; height: 22px; background: url('../img/common/ico_alert_be.png') no-repeat;}
.newBe .topBox .topGray .fr{margin-top:3px;}
.newBe .topBox .topGray .fr .links.pop:before{border-left:0;}
.newBe .topBox .bottomWhite {padding: 30px 0;}
.newBe .topBox .bottomWhite button{width:250px; margin-left:20px;}
.newBe .topBox .bottomWhite button:first-child{margin-left:0;}

@keyframes alarm_ani{
	0%{transform: rotate(0deg)}
	2.5%{transform: rotate(15deg)}
	5%{transform: rotate(0deg)}
	7.5%{transform: rotate(-15deg)}
	10%{transform: rotate(0deg)}

	12.5%{transform: rotate(15deg)}
	15%{transform: rotate(0deg)}
	17.5%{transform: rotate(-15deg)}
	20%{transform: rotate(0deg)}

	22.5%{transform: rotate(15deg)}
	25%{transform: rotate(0deg)}
	27.5%{transform: rotate(-15deg)}
	30%{transform: rotate(0deg)}
}


/*=========================================== 비대면 여신 2022-02-25 ==============================================*/
/* 진행상태조회 caseSlt */
.beUntact {min-width: 530px;}
.beUntact ~ .titH2 {margin-top: 0;}

/* 상단 상담용 header에 비대면기업 추가로 인해 추가된 css */
.csMode .header .topWrap .logo {margin-right: 0;}
.csMode .header .gate li a span {letter-spacing: -1px;}

.progress.noNum li.on:before {display: none;} /* 숫자 없는 progress */

/* 공통 BENFCO01N10 김다해 */
.imgBgBox {padding: 23px 30px 30px;background: url('../img/common/img_company.png') no-repeat 882px center;}
.imgBgBox > .titH4 + .txt {margin-top: 10px;}
.imgBgBox ~ .titArea {margin-top: 44px;}

/* 공통 BENFCO01N15 김다해 */
.icoImgCert.ceo {background-image: url("../img/common/ico_ceo.png");}
.icoImgCert.ceo.active {background-image: url("../img/common/ico_ceo_act.png");}
.icoImgCert.part {background-image: url("../img/common/ico_part.png");}
.icoImgCert.part.active {background-image: url("../img/common/ico_part_act.png");}
.icoImgCert.indivi {background-image: url("../img/common/ico_individual.png");}
.icoImgCert.indivi.active {background-image: url("../img/common/ico_individual_act.png");}
.icoImgCert.subPost {background-image: url("../img/common/ico_submit_post.png");}
.icoImgCert.subPost.active {background-image: url("../img/common/ico_submit_post_act.png");}
.icoImgCert.subWeb {background-image: url("../img/common/ico_submit_web.png");}
.icoImgCert.subWeb.active {background-image: url("../img/common/ico_submit_web_act.png");}

.untactService.productService .whiteBox {height: 281px;}
.untactService.productService .whiteBox.icoBox {height: 195px;}
.untactService .txtList > li {letter-spacing: -0.03em;}

.termsArea .termsDetail.typeWhite {border-top: #dedede 1px solid;}
.termsArea .termsDetail.typeWhite .titBox {background-color: #fff;}
.termsArea .termsDetail.typeWhite .titBox .accoTit{font-size: 16px;line-height:30px;}

/* 공통 BENFCO01N45 김다해 */

.wrapTitbtn {display: table;margin-top: 30px;}
.wrapTitbtn > * {display: table-cell;vertical-align: middle;}
.choiceInfo.accoWrap .qrInfo .titArea {padding: 40px 30px 30px;background-color: #f6f6f6;}
.choiceInfo.accoWrap .selectBtn[disabled] {opacity: 1;}

section .titArea .titH3 + .accoTag {margin-left:15px;}
.accoTag {padding:5px 20px 5px 5px;background-color: #0063cc;color: #fff;border-radius: 20px;vertical-align: middle;}
.accoTag .tagTxt {display: inline-block;margin-top:2px;font-weight: bold;vertical-align: middle;}
.accoTag .tagTxt:before {content:"";display: inline-block;width: 30px;height: 30px;margin-top:-2px;margin-right: 10px;box-sizing: border-box;border-radius: 50%;background:#fff url("../img/common/ico_tag_check.png") no-repeat center center;vertical-align: middle;}



/* 공통 BENFCO01N70 김다해 */
.scroll .ac + .btnArea {overflow-y: hidden;} /* ie에서 btnArea 영역 스크롤 생성 막기 */

.cbtnB.loginBtnGong span {display: inline-block;padding-left: 40px;background: url("../img/common/ico_cer_login.png") no-repeat 0 50%;}
.cbtnB.loginBtnGeum span {display: inline-block;padding-left: 53px;background: url("../img/common/ico_geum_login.png") no-repeat 0 50%;}

/* 비대면 대출 신청/조회 - 진행사항 안내 BENFLN03N10 김다해 */
.infoRow .shapeBox {min-height: 177px; padding: 25px 30px;}
.infoRow.type2 .shapeBox {min-height: 324px;}
.infoRow.type3 .shapeBox {min-height: 198px;}
.infoRow .shapeBox .txtList {margin-top: 7px; font-size: 16px !important;}
.infoRow .shapeBox .txtList > li {margin-top: 5px !important;}


/* 비대면 대출 신청/조회 - 상담신청서 작성 BENFLN03N40 김다해 */
.choiceFile {position: relative;}
.choiceFile + .choiceFile {margin-top: 10px;}
.choiceFile > [class*="btnFile"] {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}

/* 비대면 대출 신청/조회 - 차입신청 안내 BENFLN04N20 김다해 */
.loanStep .stepBox > li {min-height: 180px;}

.icoImgCert.afterLogin {background-image: url("../img/common/ico_after_login.png");}
.icoImgCert.afterCheck {background-image: url("../img/common/ico_after_check.png");}


/* 비대면 대출 신청/조회 - 대환/연장신청(차입신청) BENFLN04N60 김다해 */
table .ls2 {letter-spacing: -2em;}
table .ls2 > *{letter-spacing: 0;}

.arBtnWrap {position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-size: 0;}
.arBtnWrap > *[class^=btn] + *[class^=btn] {margin-left: 5px;}

.noticeChk .noticeDetail .btnRbox {position: absolute; top: 50%; right: 20px; transform: translateY(-50%);}

.tableInfo .accoWrap.choiceInfo {background-color: #fff;}
.tableInfo .accoWrap.choiceInfo .titArea.line {margin-bottom: 0;}
.tableInfo .accoWrap.choiceInfo .accoContents {margin-top: 0;padding: 0;background-color: #fff;}
.tableInfo .accoWrap.choiceInfo .accoContents .tableY.noTline,
.tableInfo .accoWrap.choiceInfo .accoContents .tableX.noTline thead tr:first-child th {border-top: 0;}
.tableInfo .accoWrap.choiceInfo .accoContents table.tableY tbody td {border-bottom: 1px solid #d8d8d8}
.tableInfo .accoWrap.choiceInfo .accoContents table.tableY tbody td:nth-child(2n) {background: transparent;}
/* .tableInfo .borrowTable tbody + tbody tr:first-child td {border-top: 1px solid #dedede;} */
.tableInfo .borrowTable .tableBg td {background-color: #f6f8fb !important;}
.tableInfo .borrowTable tr.tableTotal td {background-color: #f8f8f8 !important; border-left: none;}
.tableInfo .borrowTable tr.tableTotal td.first {border-left: 1px solid #d8d8d8;}
.tableInfo .borrowTable tr.trBorrow td:first-child {border-right: 1px solid #d8d8d8; }
.tableInfo .borrowTable tr.trBorrow td:not(:first-child) {padding-left: 0; padding-right: 0; border-left: none; text-align: right;}
.tableInfo .borrowTable tbody tr.trBorrow td.tdBorrow {padding-left: 0;background-color: #fff; padding-right: 0; border-right: none; text-align: right; color: #666; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal;}
.tableInfo .borrowTable tbody tr.trBorrow td.tdBorrow.addBl {border-left: 1px solid #d8d8d8;}
.tableInfo .borrowTable tbody tr.trBorrow.type2 td.tdBorrow {padding-right: 15px;}

/* 비대면 대출 신청/조회 - 차입신청전자서식 확인 BENFLN04N80 김다해 */
.termsArea .termsDetail .titBox .termsTag {display: inline-block; padding: 0 9px; margin-left: 20px; background-color: #0063cc; color: #fff; border-radius: 2px; vertical-align: middle; overflow: hidden; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-size: 14px; line-height: 24px; letter-spacing: -0.8px;}
.fileTitle {display:block; padding: 8px 0;}


/* table form 양식 추가 BENFCO01N35 김민경 */
.profileBox {display:table; padding:30px 0 24px; margin: 0; box-shadow: none;}
.profileBox > [class*=col_] {display: table-cell;}
.profileBox .lineBox {height: 276px; padding: 0; margin-top: 0; border: none; border-right: 1px solid #d2d2d2; text-align: center;}
.profileBox .tableY td {border-bottom: none;}
.profileBox .tableY .listLabel>span {position: relative; padding-left: 20px;}
.profileBox .tableY .listLabel>span::before{display: block; content: ''; position: absolute; top: 6px; left: 1px; width: 5px; height: 5px; border-radius: 1px; transform: rotate(45deg); background: #333;}

.tableInfo .accoWrap.choiceInfo .accoContents .profileBox .tableY td {border-bottom: none;}

/* 문의/알림 팝업-list BENFIQ01N48 */ 
.qnaAccoList {margin-top: 20px; border-top: 2px solid #333; border-bottom: 1px solid #dedede;}
.qnaAccoList .qnaWrap{position: relative; padding: 20px 20px 16px 64px;}
.qnaAccoList .qnaWrap:not(:first-child){border-top: 1px solid #dedede;}

.qnaAccoList .qnaTopArea{padding: 3px 0; font-size: 0;}
.qnaAccoList .qnaTopArea > *{display: inline-block; font-size: 16px; vertical-align: middle;}
.qnaAccoList .qnaTit{position: relative; max-width: 160px; margin-right: 10px; padding-right: 10px; color: #333; font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.qnaAccoList .qnaTit::after{content: ''; position: absolute; top: 50%; right: 0; height: 16px; border-right: 1px solid #ccc; transform: translateY(-50%);}
.qnaAccoList .time{margin-left: 10px; margin-right: 20px;}
.qnaAccoList .links{transform: translateY(-2px);}
.qnaAccoList .qnaIco{display: block; position: absolute; top: 20px; left: 20px; width: 34px; height: 30px; background: url('../img/common/qna_question.png') no-repeat center / cover;}

.qnaAccoList .qnaWrap.answer{background-color: #f8f8f8;}
.qnaAccoList .qnaWrap.answer .qnaIco{background-image: url('../img/common/qna_answer.png');}
.qnaAccoList .qnaWrap.answer .qnaTit{max-width: 230px;}

.qnaAccoList .qnaTopArea + div {margin-top: 8px; margin-right: 50px; word-break: break-word;} /* 띄어쓰기 없는 텍스트 이슈 */
.qnaAccoList .qnaCont{display: -webkit-box; max-height: 75px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.qnaAccoList .qnaCont.on{display:block; max-height: none; overflow:unset; text-overflow:unset; -webkit-line-clamp:unset; -webkit-box-orient:unset;}

.qnaAccoList .qnaAccoBtn {display: none; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); width: 40px; height: 40px; background: url('../img/common/btn_acco_off.png') no-repeat center center;}
.qnaAccoList .qnaCont.acco + .qnaAccoBtn{display: inline-block;}
.qnaAccoList .qnaCont.acco.on + .qnaAccoBtn{background-image: url('../img/common/btn_acco_def_rotate.png');}

.qnaAccoList + .moreArea{padding: 15px 0; text-align: center;}
.qnaAccoList + .moreArea .moreBtn button:after{background-image: url('../img/common/qna_more_btn.png');}

.qnaNone{padding: 87px 0; border-top: #666 1px solid;border-bottom: #dedede 1px solid; text-align: center;color: #333;}

/* 문의/알림 팝업-Edit BENFIQ01N49 */  
textarea.qna {height: 450px; resize: none;}

/* 샘플 확인 팝업 BENFCO01N60 */  
.sampleImgWrap > img {width: 100%;}

/* 아코디언 내에 다른 아코디언이 들어올 때 버튼 꼬임 방지 */
.choiceInfo .accoContents .accoBtn {position: static; width: auto; height: 30px;background: #fff;}
.tableInfo .accoWrap.choiceInfo .termsDetail  .accoContents {padding: 25px 20px; background-color: #f8f8f8;}

/* 당구장 표시 리스트 안의 가로정렬 목록 BENFBK02N20 김민경 */
.refList .rowList > span{position: relative; margin: 0 8px 0 8px;}
.refList .rowList > span:first-child{margin-left: 0 !important;}
.refList .rowList > span + span::before{content:''; position: absolute; top:6px; bottom:4px; left:-8px; border-left:1px solid #d2d2d2;}

/* acco title에 radio 버튼이 추가됐을 때 김민경 */
.accoContents.accoRadioCont{display: block;}

/* radio 중 '기타' 선택하면 입력 input 나오게 하기 (BENFDT01N60) 김민경 */
.hasEtc {height: 40px; line-height: 40px;}
.hasEtc > *{vertical-align: middle !important;}
.hasEtc .ipt_etc{display: none; margin-right: 0;}
.hasEtc.delete .ipt_etc + .icoBtn{right: 15px;}

/* BENFDT01N50 김민경 */ 
/* IE border issue 방지용 */ 
.printTable.iptTable td:not(.label){background: transparent;}
/* 수신 정보 간격 조절 */
td.double p + p{margin-top: 5px;}


/* 부가 내용을 가진 radio 선택시 움직임 방지 (BENFDT01N70) 김민경 */
.iptGroup.hasAdd input[type="radio"]+label{vertical-align: baseline;}

/* check box 약정 내용이 여러줄일 때 keep all 설정 (BENFLN05N20) 김민경 */
.tableY.keepAll td{word-break: keep-all;}
.tableY.keepAll td .col_11{padding-right: 10px;}

/* check box 약정이 한 개일 때 (BENFLN05N21) 김민경 */
.termsDetail.alone{border-bottom: #666 1px solid;}

/* <i> bold 방지 (BENFLN05N21) 김민경 */
.unitFront .ipt.unit + i{font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}

/* 휴대폰 SMS 인증 팝업 */
.icoTxtChk.pink {margin: 0; padding: 0; color:#d6006d; background:none;}
.links.c333 > span:after{border-color: #333;}
.links.c333{padding-bottom: 10px;}

/* 관리자 변경 아코디언 BENFBK03N20 김민경 */
.titArea.line.radio{cursor:auto;}

/* 대출변경 - 금리인하신청 BELNLD12N20 김민경 */
.titArea.line + .noticeChk.radioAdd{border-top: none;}
.noticeChk.radioAdd{padding: 15px 20px; /* background: #fff; */}
.radioAdd .radioWrap{margin: 0; padding: 7px 0 7px 27px;}
.radioAdd .radioAdded{margin: 13px 0; padding: 16px 0 16px 32px; border: 1px solid #dedede; border-width: 1px 0;}
.radioAdd .radioAdded .label{margin-right: 20px; font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; color: #333;}

/* 대출조회 - 기한전원리금상환조회 BELNLD09N10 김다해 */
.grayBox.rowGroup {padding: 30px 100px;}
.grayBox.rowGroup .tableY.noLine {width: 100%; margin: 0;}
.ls40 {letter-spacing: -0.04em;}
.noticeChk.bb9 {border-bottom: 1px solid #999;}

/* 대출조회 - 기한전상환 예정금액 인쇄 팝업 BELNLD09N30 김다해 */
.graytbBox {position: relative; border-top: #666 1px solid; border-bottom: #dedede 1px solid; background-color: #f8f8f8;}
.graytbBox .graytbDetail {padding: 20px; overflow: hidden;}
.graytbBox .graytbDetail .tableY.noLine {margin-bottom: 0;}
.graytbBox .graytbDetail .tableY.noLine td {padding-bottom: 0;}
.graytbBox .graytbDetail .tableY.noLine .pt20 td {padding-top: 20px;}

/* 예금신규 - 사전체크 안내 BENFDT01N30 김다해 */
.productService.icoBox .whiteBox {height: 184px;}
.productService.icoBox .whiteBox.type2 {height: 206px;}
.productService.icoBox .msgBox .txtList {margin-top: 0; margin-bottom: 0; padding-top: 0; border-top: none;}
.productService.icoBox .col_8 .msgBox .col_6 {padding: 0} 
.boxNotice.msgBox.row {padding:30px; margin: 0; border:1px solid #e9e9e9; border-radius:5px; box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.07);}
.boxNotice.msgBox.row > .col_4 {padding:0px;}
.boxNotice.msgBox.row .titH4 + .cont {padding-top: 5px;}
.boxNotice.msgBox.row .txtList li:before {width:3px; height: 3px; transform: rotate(0deg);}
.boxNotice.msgBox.row .txtList li .dashList {font-size: 14px;}
.boxNotice.msgBox .txtList > li {margin-top: 3px;}

.boxNotice.msgBox .tit {position:relative; display:block; margin-bottom:15px; padding-bottom:17px; font-size:24px; color:#252525; line-height:1;}
.boxNotice.msgBox .tit:after {content:''; position:absolute; bottom:0; left:0; right:0; border-top: 1px solid #666;}
.boxNotice.msgBox .tit > strong {display:block; height: 18px; font-family: 'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
.boxNotice.msgBox .txtList > li { margin-top: 3px; }


/* 비대면서비스 진행상태 조회 BENFIQ01N10_1~13 */
#content section.stepProgressWrap {margin-bottom: 0;} /* 다건 progress */
section.untactError {margin: 60px auto 50px !important;}
.textGroup {display: inline-block;position: absolute; left: auto; bottom: 13px; margin-left: 20px;}
.textGroup > span {position: relative; padding-left: 10px; margin-left: 10px; font-size: 14px !important; line-height: 1.6em; border-left: 1px solid #d2d2d2;}

.links.go.h60:after {height: 61px;}
.links.go.h80:after {height: 81px;}
.links.btnLink:after {height: 61px;right:-10px; left:-10px; top:-7px; border-radius: 4px;}
.links.btnLink.h80:after {height: 91px}
.links.btnLink > span:after {border-bottom: none;}

.links.small {font-size: 14px; line-height: 1.6em; text-decoration: underline;}
.links.small:after {display: none;}

.mH76 {min-height: 76.67px;}
.mH100 {min-height: 100px;}

.contBtn {position: absolute; top:7px; right:7px; display:inline-block; width:38px; height:38px; background:url("../img/common/btn_acco_def.png") no-repeat center center }

.toggleWrap .toggleBtn {position: absolute; top:7px; right:7px; display:inline-block; width:38px; height:38px; background:url("../img/common/btn_acco_def.png") no-repeat center center;transition:transform .2s ease-out; -webkit-transition:transform .2s ease-out; -ms-transition:transform .2s ease-out}
.toggleWrap .toggleCont {display: none;}
/* .toggleWrap.on .titArea {border-bottom: none;}
 */.toggleWrap.on .toggleBtn {transform: rotate(180deg);}
/* .toggleWrap.on .toggleCont {display: block;} */

.linkGroup.uc {margin-top: 30px; text-align: center;}
.linkGroup.uc .links {padding-left: 30px;}
.linkGroup.uc .links > span:after {border-bottom: 0;}
.linkGroup.uc > .links:before {display: none;}
.linkGroup.uc > .links {margin-right: 35px; margin-left: 0;}
.linkGroup.uc > .links:last-child {margin-right: 0;}

.links.ask {background: url("../img/common/ico_inquire.png") no-repeat 0 50%;} /* 문의/알림 버튼 */
.links.ask span {color: #0063cc;}
.links.document {padding-left: 30px; background: url("../img/common/ico_document.png") no-repeat 0 50%; } /* 서류제출 버튼 */
.links.document:after {height:40px; right:-12px; left:-10px; top:-7px; border-radius: 4px;}
.links.advise {background: url("../img/common/ico_advise.png") no-repeat 0 50%; } /* 통지자 조회/변경 버튼 */
.links span + .tag {margin-left: 5px;}
.links .tag {display: inline-block; width: 20px; height: 20px; background: url("../img/common/ico_newtag.png") no-repeat 0 50%; vertical-align: text-top;}
.titArea .titH2 + .applicant {margin-left: 20px;}
.links.applicant {padding-left: 26px; background: url("../img/common/ico_applicant.png") no-repeat 0 50%; vertical-align: middle;} /* 신청자 정보 변경 버튼 */
.links.applicant:after {height:40px; right:-12px; left:-10px; top:-7px; border-radius: 4px;}
.links.applicant span:after {border-bottom: 0;}
.links.txtLinks:after {display: none;}
.links.txtLinks span {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif}

.cardStateArea .stateTit .btnWrap {position: absolute; top: 50%; right: 22px; margin-top: -45px; font-size: 0; text-align: right;}
.cardStateArea .stateTit .btnWrap > button {display: block; position: static; top: auto; bottom: auto; left: auto; right: auto; margin-top: 0; margin-left:auto; font-size: 16px;}
.cardStateArea .stateTit .btnWrap > button + button{margin-top: 10px;}
.cardStateArea.rowItem .stateBar:before, 
.cardStateArea.rowItem .stateBar:after {content:'';display: block;clear: both;}
.cardStateArea.type7 .stateBar{width: 100%; padding: 0 30%;} /* box 2개 */
.cardStateArea.type8 .stateBar{width: 100%; padding: 0 0} /* box 7개 */
.cardStateArea.type8 .stateBar .box{width: 14.28%;}
.cardStateArea .stateBar .box.full {width: 100%;} /* box 1개 */
.cardStateArea .stateBar .box.now:after {content:'';display: block;position: absolute;left: 50%;bottom: 0;margin-bottom: -2px;width: 17px; height: 12px; background: url('../img/common/bg_statestep_arrow.png');transform: translateX(-50%);} /* 상단 아이콘 포커싱 */

/* 하단 step */
.cardStateArea .stateStep {margin:0 30px;padding-top:0; background-color: #f7fbfe; border: 1px solid #c4d1d7; border-radius: 5px;font-size: 0;text-align: center;}
.cardStateArea .stateStep:before, .stateStep:after {content: '';display: block;clear: both;}

.cardStateArea .stateStep .box {position: relative;display: inline-block;width: 20%;height: 88px; padding-top: 30px;vertical-align: top;} /* step 1~5개 */
.cardStateArea .stateStep.type2 .box {width: 16.6666%;} /* step 6개 */
.cardStateArea .stateStep .box > p {color: #777;font-size: 14px;font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}

.cardStateArea .stateStep .box .bar {display: block;position: absolute; top:50%;right: 0;width:30px;height: 30px;margin-right: -15px;background-image: url('../img/common/bg_hexagon_arrow_gray.png');background-repeat: no-repeat;transform: translateY(-50%);}
.cardStateArea .stateStep .box.on .bar {background-image: url("../img/common/bg_hexagon_arrow_blue.png");}
.cardStateArea .stateStep .box:last-child .bar {display: none;}

.cardStateArea .stateStep .box a.links {font-size: 14px; text-decoration: underline;}
.cardStateArea .stateStep .box a.links span:after {display: none;}
.cardStateArea .stateStep .box a.links.go {text-decoration: none;}
.cardStateArea .stateStep .box a.links.links.go:after {top: -4px;}
.cardStateArea .stateStep .box a.links.go span:after {content:''; display: inline-block; position: static; bottom: auto; top: auto; right: auto; left: auto; margin-left: 5px; width:12px; height:12px; background: url('../img/common/ico_go3.png') no-repeat; border: none;} 

.cardStateArea .stateStep .box.on p {color:#333;}
.cardStateArea .stateStep .box.on .num {color: #0063cc;}
.cardStateArea .stateStep .box .num.live {color: #0063cc;}

.cFff {color:#fff}

/* case1. 인터넷뱅킹 가입(단독거래) */
.cardStateArea .icoImgCert.banking {background-image:url("../img/common/ico_untact_banking_off.png");} /* 인뱅가입이어하기 */
.cardStateArea .icoImgCert.charge {background-image:url("../img/common/ico_untact_charge_off.png");} /* 수수료입금 */
.cardStateArea .icoImgCert.entrust {background-image:url("../img/common/ico_untact_entrust_off.png");} /* 위임장대표자승인 */
.cardStateArea .icoImgCert.post {background-image:url("../img/common/ico_untact_post_off.png");} /* 위임서류우편접수 */
.cardStateArea .icoImgCert.submit {background-image:url("../img/common/ico_untact_submit_off.png");} /* 위임서류파일제출대기 */
.cardStateArea .icoImgCert.review {background-image:url("../img/common/ico_untact_review_off.png");} /* 사전검토대기 */
.cardStateArea .icoImgCert.document {background-image:url("../img/common/ico_untact_document_off.png");} /* 제출서류검토 */
.cardStateArea .icoImgCert.iBanking {background-image:url("../img/common/ico_untact_ibanking_off.png");} /* 인터넷뱅킹가입 */

.cardStateArea .box.on .icoImgCert.banking {background-image:url("../img/common/ico_untact_banking_on.png");}
.cardStateArea .box.on .icoImgCert.charge {background-image:url("../img/common/ico_untact_charge_on.png");}
.cardStateArea .box.on .icoImgCert.entrust {background-image:url("../img/common/ico_untact_entrust_on.png");}
.cardStateArea .box.on .icoImgCert.post {background-image:url("../img/common/ico_untact_post_on.png");}
.cardStateArea .box.on .icoImgCert.submit {background-image:url("../img/common/ico_untact_submit_on.png");}
.cardStateArea .box.on .icoImgCert.review {background-image:url("../img/common/ico_untact_review_on.png");}
.cardStateArea .box.on .icoImgCert.document {background-image:url("../img/common/ico_untact_document_on.png");}
.cardStateArea .box.on .icoImgCert.iBanking {background-image:url("../img/common/ico_untact_ibanking_on.png");}

/* case2. 계좌개설-인터넷뱅킹 가입 */
.cardStateArea .icoImgCert.openAccount {background-image:url("../img/common/ico_untact_openaccount_off.png");} /* 계좌개설이어하기 */
.cardStateArea .icoImgCert.newAccount {background-image:url("../img/common/ico_untact_newaccount_off.png");} /* 계좌신규 */

.cardStateArea .box.on .icoImgCert.openAccount {background-image:url("../img/common/ico_untact_openaccount_on.png");}
.cardStateArea .box.on .icoImgCert.newAccount {background-image:url("../img/common/ico_untact_newaccount_on.png");}

/* case4. OTP 이용등록 */
.cardStateArea .box .icoImgCert.otpAdded {background-image:url("../img/common/ico_nf_otp_added_off.png");}
.cardStateArea .box.on .icoImgCert.otpAdded {background-image:url("../img/common/ico_nf_otp_added_on.png");}


/* case5. 상담신청-인뱅가입-차입신청 */
.cardStateArea .icoImgCert.borrowWrite {background-image:url("../img/common/ico_untact_write_off.png");} /* 차입신청서작성 */
.cardStateArea .icoImgCert.borrowConfirm {background-image:url("../img/common/ico_untact_confirm_off.png");} /* 차입신청서확정 */
.cardStateArea .icoImgCert.examine {background-image:url("../img/common/ico_untact_examine_off.png");} /* 여신/심사승인 */
.cardStateArea .icoImgCert.checking {background-image:url("../img/common/ico_untact_checking_off.png");} /* 약정확인 */
.cardStateArea .icoImgCert.contract {background-image:url("../img/common/ico_untact_contract_off.png");} /* 약정체결 */

.cardStateArea .box.on .icoImgCert.borrowWrite {background-image:url("../img/common/ico_untact_write_on.png");}
.cardStateArea .box.on .icoImgCert.borrowConfirm {background-image:url("../img/common/ico_untact_confirm_on.png");}
.cardStateArea .box.on .icoImgCert.examine {background-image:url("../img/common/ico_untact_examine_on.png");}
.cardStateArea .box.on .icoImgCert.checking {background-image:url("../img/common/ico_untact_checking_on.png");}
.cardStateArea .box.on .icoImgCert.contract {background-image:url("../img/common/ico_untact_contract_on.png");}

/* case7. 상담신청-차입신청-약정체결 */
.cardStateArea .icoImgCert.consult {background-image:url("../img/common/ico_untact_consult_off.png");} /* 간편대출상담 */
.cardStateArea .box.on .icoImgCert.consult {background-image:url("../img/common/ico_untact_consult_on.png");}

/* case11. OTP 인증번호 오류 초기화 */
.cardStateArea .icoImgCert.otpReset {background-image:url("../img/common/ico_untact_otp_reset_off.png");} /* OTP 인증번호 오류 초기화 */
.cardStateArea .box.on .icoImgCert.otpReset {background-image:url("../img/common/ico_untact_otp_reset_on.png");} /* OTP 인증번호 오류 초기화 */

/* case12. 계좌 비밀번호 오류 초기화 */
.cardStateArea .icoImgCert.accountReset {background-image:url("../img/common/ico_untact_account_reset_off.png");} /* 계좌 비밀번호 오류 초기화 */
.cardStateArea .box.on .icoImgCert.accountReset {background-image:url("../img/common/ico_untact_account_reset_on.png");} /* 계좌 비밀번호 오류 초기화 */

.messageBox {position:relative; padding:43px 30px 44px; margin-bottom: 30px; border:1px solid #d6006d; border-radius: 8px; box-shadow:5px 5px 5px rgba(0,0,0,0.07); text-align: center; z-index: 1;}
.messageBox .txtL {margin-bottom: 10px;}
.messageBox .txtL.bold {color:#333;}
.messageBox > .txt { color: #333; }
.messageBox .msgClose {display: block; position: absolute; top: 14px; right: 9px; width: 30px; height: 30px; background: url('../img/common/msg_close.png') no-repeat center;}

/* 비대면서비스 이용안내 팝업 BENFMN01N11 */
.untactNotice .blueLine{letter-spacing: -0.025em;}
.untactNotice .blueLine > li.on a { font-family:inherit; font-weight: bold;}
.untactNotice .stepBox.vertical .links{text-decoration: underline;}
/* .untactNotice .stepBox.vertical {color: #333;} */
.untactNotice .stepBox.vertical .imgBox.thumb.col_6{margin-right: 0;}
.untactNotice .stepBox.vertical > li:first-child{border-top: none;}
.untactNotice .titH4.pointC1 .links{font-size: 20px; color: #d6006d;}
.untactNotice .titH4.pointC1 .links:hover:after{background-color: rgba(214, 0, 109, .05);}
.untactNotice .titH4.pointC1 .links > span:after{border-color: #d6006d;}

.fullBox {width: 100% !important; max-width: 100% !important;}


/* 신청자 정보 변경 팝업-목록 BENFIQ01N11 */
.btnB {background-color: #0063cc !important;}


/* 통지자 조회/변경 팝업 BENFIQ01N13 */
.linkGroup.inTbl {width: 100px; margin: 0 !important; white-space: nowrap; text-align: left;}

/* (공통)신청자 변경 팝업 BENFCO01N20 */
.tableX td.bgGray {background-color: #f8f8f8;}

/* 간편 대출 상담 내역 팝업 BENFIQ01N40 */
.popCont .tableY tr > td.rel.first {background-color: transparent; color: #666; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
table tr td .fileName {display: block;max-width: calc(100% - 90px);}
table tr td .fileTitle {display: inline-block;max-width: calc(100% - 160px);}


/* 비대면서비스_서브메인 */
.usVisual {padding-top: 96px; margin-bottom: -100px !important;padding-bottom: 191px;background: url('../img/common/bg_us_main_visual.jpg') no-repeat 0 0; background-size: cover;}
.usVisual .titWrap * {color: #fff;}
.usVisual .titWrap .titH1 + .txtL{padding-top: 28px;}
.infoArea .usInfoBox {position: relative; padding: 25px 30px;}
.infoArea .usInfoBox:before {content: '';display: block; position: absolute; top: -28px; left: -28px; width: 1188px; height: 266px; background: url('../img/common/bg_usmenu.png') no-repeat 0 0;}
.infoArea .usInfoBox > .row.line {margin: 0 -30px;}
.infoArea .usInfoBox > .row.line > [class*=col_] {padding: 0 30px; border: 0;}
.infoArea .usInfoBox > .row.line > [class*=col_] .txtList > li {margin-top: 5px;}
.infoArea .usInfoBox > .row.line > [class*=col_]:first-child {border-right: 1px solid #dedede;}
.infoArea .usInfoBox > .row.line > [class*=col_]:last-child {color: #fff;}
.infoArea .usInfoBox > .row.line > [class*=col_]:last-child [class*=titH] {color: #fff;}

.infoArea .iconList{display: block;  width: 100%; text-align: center; font-size: 0;}
.infoArea .iconList li {display: inline-block; width: 50%;}
.infoArea .iconList li > span {display: block; padding-top: 102px;font-size: 16px; background-repeat: no-repeat; background-size: 66px auto; background-position: center 24px;}
.infoArea .iconList li:nth-child(1) > span {background-image: url('../img/common/ico_corp_biz.png');}
.infoArea .iconList li:nth-child(2) > span {background-image: url('../img/common/ico_indi_biz.png');}

.infoArea .linkBox {position: absolute; bottom: -58px; left: 30px;}
.infoArea .linkBox .goLink {color: #fff;}
.infoArea .linkBox .goLink span {position: relative;;padding-right: 16px; padding-bottom: 8px; border-bottom: 1px solid #fff;}
.infoArea .linkBox .goLink span:before {content:''; display: block; position: absolute; right: -2px; bottom: 4px; width: 14px; border-top: 1px solid #fff; transform: rotate(45deg);}

section .titArea + .usList {margin-top: 20px;}
.usList p {padding-top: 10px;color: #777;letter-spacing: -0.04em;}
.usList .shapeBox {min-height: 155px;padding: 25px 30px; background-color: #fff; background-position: 435px 86px; background-repeat: no-repeat;}
.usList .shapeBox .titH4 {min-height: 60px;}
.usList .shapeBox .usListBt {position: absolute; bottom: 35px; left:30px}
.usList .shapeBox.item1 {background-image: url('../img/common/ico_uslist08.png');}
.usList .shapeBox.item2 {background-image: url('../img/common/ico_uslist09.png');}

.usList.type2 .shapeBox {min-height: 209px; background-position: 191px 25px;}
.usList.type2 .shapeBox.item1 {background-image: url('../img/common/ico_uslist01.png');}
.usList.type2 .shapeBox.item2 {background-image: url('../img/common/ico_uslist02.png');}
.usList.type2 .shapeBox.item3 {background-image: url('../img/common/ico_uslist03.png');}
.usList.type2 .shapeBox.item4 {background-image: url('../img/common/ico_uslist04.png');}

.usList .infoBox {padding: 35px 40px;min-height: 260px;}
.usList .infoBox.item1 {background: #f5f7fb url('../img/common/ico_uslist05.png') no-repeat 322px 161px;}
.usList .infoBox.item2 {background: #f5f7fb url('../img/common/ico_uslist06.png') no-repeat 322px 161px;}
.usList .infoBox.item3 {min-height: auto; background: #f5f7fb url('../img/common/ico_uslist10.png') no-repeat 838px 46px;}
.usList .infoBox.item3:hover .titH3 {color: #0063cb; border-bottom: 1px solid #0063cb;}

.usList + .usBottom {margin-top: 50px;}

.usBottom p{padding-top: 10px;}
.usBottom .infoBox.faq {min-height: 244px;padding: 35px 40px 40px; background-color: #f8f8f8; box-sizing: border-box;}
.usBottom .infoBox.faq ul {padding-top: 20px;}
.usBottom .infoBox.faq li {height: 28px;line-height: 28px;padding-left: 40px;margin-bottom: 9px;background: url('../img/common/ico_q_s.png') no-repeat 0 50%;}
.usBottom .infoBox.faq li:last-child {margin-bottom: 0;}
.usBottom .infoBox.faq li a {display: inline-block;position: relative;max-width: 100%;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.usBottom .infoBox.faq li a:after {content: ""; position: absolute; bottom: 0; left: 0; right: 0; border-bottom: 1px solid #0063cc; opacity: 0;}
.usBottom .infoBox.faq li a:focus, .usBottom .infoBox.faq li a:hover { color: #0063cc; }
.usBottom .infoBox.faq li a:focus:after, .usBottom .infoBox.faq li a:hover:after { opacity: 1; }
.usBottom .infoBox.faq .titArea {padding-bottom: 12px; margin-top: 0; border-bottom: #666 1px solid}
.usBottom .infoBox.faq .titArea .titH3{padding-left: 0; background: none;}
.usBottom .infoBox.faq .titArea .titH3 + * {display: inline-block; margin-left: 10px; margin-bottom: 0;}
.usBottom .infoBox.faq .titArea .titH3 ~ .utilBtnWrap {top: 5px;}
.usBottom .infoBox.faq .utilBtnWrap .links.arr:before {top: 8px;}
.usBottom .infoBox.faq .utilBtnWrap .links.arr:after {top: -5px;}
.usBottom .infoBox.blue {min-height: 244px;padding: 35px 40px 30px; background: #f1faff url('../img/common/ico_uslist07.png') no-repeat 443px 74px;; box-sizing: border-box;}
.usBottom .infoBox.blue .bcBt { position: absolute; bottom: 25px; left: 40px; right: 40px; border-top: #dedede 1px solid; text-align: center; padding-top: 25px; }


/* 서류제출 자동화 안내(홈택스용)_스크래핑 진행중 로더 BENFCO02N30 */
.linkArea {margin: 15px 20px;}
.linkArea > .links {font-weight: bold;}

.links.scrapDown {padding-right: 30px; text-decoration: none; color: #d6006d; font-weight: bold;}
.links.scrapDown:hover {color: #d6006d;}
.links.scrapDown:before {content:''; position: absolute; width:22px; height:20px; top:3px; left:auto; right:0; background: url(../img/common/btn_download3.png) no-repeat 0; z-index: 2;}
.links.scrapDown:after {display: none;}

.boxLoading {padding: 40px 0;}
.boxLoading .loadBg {position: relative; top: 0; left: 0; bottom:0; right:0; width: 60px; height: 60px; margin:auto; background-color:#fff; border-radius: 50%; overflow: hidden; box-shadow: 3px 3px 6px 0px rgba(0,0,0,0.2)}
.boxLoading .loadIcon:before {content:''; position:relative; display: block; width:100%; height: 100%; background: url("../img/common/img_common.png") no-repeat -195px 0; z-index: 2 }
.boxLoading .loadIcon:after {content:''; position: absolute; top: 0; left: 0; display: block; width:100%; height: 100%; background: url("../img/common/img_common.png") no-repeat -195px -60px; z-index: 1; -webkit-animation: iconLoading 0.5s linear infinite; animation: jexLoading 0.5s linear infinite;}

@-webkit-keyframes iconLoading {0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes iconLoading {0%{transform:rotate(0)}100%{transform:rotate(360deg)}}



/*================== 기업용 웹CMS 2022.04,05,06 ===================*/
button[class^=btn].cmsRefresh {padding-left:30px; background-image: url("../img/common/img_cms_refresh.png"); background-repeat: no-repeat;background-position: 9px center;}
.cmsMoreDiv{width:100%;display:table;}
.cmsMoreDiv > div{padding-bottom: 20px;}
.cmsMoreDiv .label{width:129px;display:table-cell;}
.cmsMoreDiv .cont{width:auto;display:table-cell;padding-left: 20px;}
.cmsMoreDiv .cont.col_wh{width:325px}

 /* cms banking list */
 .bankListCms{margin-top:20px; border:1px solid #f3f3f3; border-top-width:2px; border-right-width:2px; background-color:#f3f3f3}
 .bankListCms:after{content:""; display:block; clear:both}
 .bankListCms li{position:relative; float:left; width:20%; border-left:1px solid #f3f3f3; border-bottom:1px solid #f3f3f3; box-sizing:border-box; text-align: center;}
 .bankListCms li a {display:block; width:100%; border:1px solid #fff; background:#fff; box-sizing:border-box; transition: border ease-out 0.3s; padding: 15px 0 10px 0;}
 .bankListCms li button:hover, .bankList li button:focus, .bankList li a:hover, .bankList li a:focus {border-color:#0050a6;}
 .bankListCms li a img {height:45px; vertical-align:middle;}
 .bankListCms li.on a{border-color:#0050a6;}
 .bankListCms li a span {display:flex; align-items:center; justify-content:center; min-height:2.4em; font-size:15px; line-height:1.2em; padding:5px 5px 0;}
 .bankListCms li.disabled::after {content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:5;}
 .bankListCms li.on.disabled a {border-color:#FFF;}
 .cmsBankListA .bankListCms{background: #fff}
 .cmsBankListA .bankListCms li{width:14.28%}
 .cmsBankListA .bankListCms li:last-child{border-right:1px solid #f3f3f3}
 .cmsBankListA .bankListCms li:nth-child(7n){border-right:0}
.cmsBankListB li{float:left; width:20%; box-sizing:border-box; text-align: center;padding:15px}
.cmsBankListB li button img, .cmsBankListB li img {height:50px; vertical-align:middle;}
.cmsBankListB li span { display: block; padding-top: 5px; }

.cmsTxtLinks{text-decoration:underline !important; color:#0063cc !important;word-break: break-all !important;} 
.cmsTxtLinks:hover{background:#f2f9ff !important;color:#004a99 !important}
.webCmsInfo p.img img{box-shadow: 1px 1px 10px rgba(0,0,0,.3);}
.cmsCardipt input.ipt {width:25%;padding:0 10px}
.phoneWrap.cmsCardipt .ipt:first-child{width:25%;}
.cmsTxtLineTh{text-decoration: line-through;} /*텍스트 가운데 취소삭제라인*/

/* 계좌조회 총계 다른형태 */
.cmsVertical .priceList li{float: none;text-align:right}
.accSumBox .cmsVertical li{padding:2px 0 2px 20px;height:36px}
.accSumBox .cmsVertical .totalNum li:after {content: '';position: absolute;left: 15px;right: -840px;bottom:3px;border-bottom: 1px solid #eee;}
.accSumBox .cmsVertical .totalNum li:last-child:after {content: none; padding-left: 0;}
.accSumBox .cmsVertical .totalNum:before {content: none;}
.accSumBox .cmsVertical .priceList li:before{border-left:0;}


/* cms 테이블 다른 조건*/
.cmstb_none01{border-left:none !important}
.cmsNone{font-size: 16px;line-height: 1.6em;text-align: center;padding:20px}
.cmsNone::before{content:'';display: inline-block;background: url('../img/common/cmsnone.png') no-repeat center;width:25px;height:25px;padding-right: 15px;vertical-align: bottom;}
.cmsGrid thead th{padding:10px 5px}
.cmsGrid tbody td{padding:15px 5px}
.cmsGrid .ar{padding-right:15px !important}
.cmsGrid .al{padding-left:15px !important;}

select.notsel{position: relative !important;border: 1px solid #d2d2d2 !important;border-radius: 4px !important;height: 40px !important;}
.checkXtd tbody td{height:40px}

/* 집금설정 내역 */
.cmsCollectDiv{border-top: 2px solid #626364;}
.cmsCollectDiv > ul{display: table;width:100%;border-bottom:1px solid #ccc;padding:20px 0px;}
.cmsCollectDiv > ul > li{display: table-cell;vertical-align: middle;}
.cmsCollectDiv > ul > li:nth-child(1){width:40px;text-align: center;}
.cmsCollectDiv > ul > li:nth-child(2){width:auto}
.cmsCollectDiv > ul > li:nth-child(3){width:105px;text-align: center;}
.cmsCollectDiv > ul > li:nth-child(4){width:115px;text-align: center;}
.cmsCollectDiv > ul > li:nth-child(5){width:160px;border-right: 1px solid #e7e7e7;padding-right:10px}
.cmsCollectDiv > ul > li:nth-child(6){width:100px;text-align:center}
.cmsCollectDiv > ul > li:nth-child(6) p{padding:2px 0}
.cmsCollectDiv > ul > li:nth-child(6) span{display: block;}
.cmsCollectDiv > ul > li:nth-child(7){width:140px;text-align:right;padding-right:5px;box-sizing: border-box;}
.cmsCollectDiv > ul > li:nth-child(8){width:240px;text-align:right;padding-right:5px}
.cmsCollectDiv > ul > li:nth-child(8) p:first-child{margin-bottom:5px}
.cmsCollectDiv > ul > li:nth-child(2) p{color:#0063cc;}
.cmsCollectDiv > ul > li:nth-child(5) .ipt.unit {padding-right:33px !important}
.cmsCollectDiv > ul > li:nth-child(8) .txtWon{display: inline-block;width: 120px;}
.cmsCollectDiv .errorlink{color: #e00000 ;text-decoration: underline;}
.cmsCollectDiv .errorlink:hover span{background: #faf4f4;}

/* 통합자금관리 서비스 체험관 */
.cmsExperience {/*max-width: 690px;*/position: relative;}
.cmsExperience .row { margin-left: 0 !important; margin-right: 0 !important; }
.cmsExperience .stepBox.vertical .imgBox.thumb.col_6 {float: left; width: auto; max-width: none; margin-left: 0; margin-right: 0 }
.cmsExperience .row > [class*=col_].step {float: right !important;width:calc(100% - 750px); max-width: none; padding-left: 0; padding-right: 0; }
.cmsExperience .stepBox.vertical > li:first-child { border: 0 !important; padding: 0; }
.cmsExperience .stepBox.vertical > li { border: 0 !important; padding: 0 !important; }
.cmsExperience .stepBox > li:before { display: none; }
.cmsExperience .stepBox.vertical .imgBox.thumb {padding: 20px;}
/* BTN */
.cmsExperience > button { display: none; width: 54px; height: 54px; border: #e9e9e9 1px solid; border-radius: 50%; box-shadow: 3px 5px 10px rgba(200,200,200,0.5); box-sizing: border-box; background-color: rgba(255,255,255,0.5); position: absolute; top: 200px; }
.cmsExperience > button:after { content: ""; background: url(/img/common/ico_circle_slide_arrow.png) no-repeat 0 0; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 0;}
.cmsExperience > button.peExPrev { left: 0; }
.cmsExperience > button.peExNext { right: 0; }
/* BTN hover/focus*/
.cmsExperience > button.peExPrev:after { background-position: 0 0; }
.cmsExperience > button.peExNext:after { background-position: -54px 0; }
.cmsExperience > button.peExPrev:hover:after, .cmsExperience > button.peExPrev:focus:after { background-position: 0 -54px; }
.cmsExperience > button.peExNext:hover:after, .cmsExperience > button.peExNext:focus:after { background-position: -54px -54px; }
/* BTN disabled */
.cmsExperience > button:disabled {opacity: 0.4; cursor: default;}
.cmsExperience > button.peExPrev:disabled:hover:after, .cmsExperience > button.peExPrev:disabled:focus:after { background-position: 0 0; }
.cmsExperience > button.peExNext:disabled:hover:after, .cmsExperience > button.peExNext:disabled:focus:after { background-position: -54px 0; }
/* rolling on */
.cmsExperience.on { padding: 0 0px; box-sizing: border-box; }
.cmsExperience.on .stepBox.vertical .imgBox.thumb.col_6 { width: auto; }
.cmsExperience.on .row > [class*=col_].step {/* width: 360px; */margin-right: 35px; padding-left:30px}
.cmsExperience.on > button { display: block; }

/* cms이용가이드 이미지배경 수정 */
.stepBox.imgBgGray.cmsStep > li.pre .imgWrap{background-color: #fff;}

/* cms 로딩바 */
.overlayCms {position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.5); z-index:999;}
.loadCms{ position: absolute;top: 50%;  left: 50%;text-align: center;border-radius: 20px; color: #000;  transform: translate(-50%,-50%);  -ms-transform: translate(-50%,-50%);}
.loadCms h2{color: #fff;font-size: 18px;text-shadow: 2px 2px 2px rgba(0,0,0,.5)}
#loading{display: inline-block;width: 50px;height: 50px;border:7px solid #fff;border-radius: 50%;border-top-color:blue ;
animation: spin 1s ease-in-out infinite;-webkit-animation:spin 1s ease-in-out infinite ;}
@keyframes spin{
	to{-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes spin{
	to{-webkit-transform: rotate(360deg);}
}

/* cms 인증서 */ 
.popCmsCert{position: absolute;bottom:0px;height:125px;left:0;width:100%;}
.popCmsCert .csIpt{display: block;width:196px;height:22px;margin-left:200px;border:0}
.popCmsCert .csCertBtn1, .popCmsCert .csCertBtn2{display: inline-block;width:50px;height:25px;margin-top:57px;}
.popCmsCert .csCertBtn1{margin-left:169px}
.popCmsCert .csCertBtn2{margin-left: 8px;}

/*온라인 설명 가이드*/
.guide_contain [class^=btn].calculator {margin-top:-10px;}
.guide_contain .grayBox {height:415px; overflow-y:auto; background-color:#f8f8f8; border-color:#B0B0B0 !important;}
.guide_contain .importBox {background-color:#F1F4F8 !important; border-color:#B7D3ED !important;}
.guide_contain .grayBox .tableX:before {border-color:#f8f8f8 !important;}
.guide_contain .grayBox.importBox .tableX:before {border-color:#F1F4F8 !important;}
.guide_contain .grayBox.importBox .tableX thead th {background-color:#e8f0f8 !important;}
.guide_contain .grayBox .tableX th, .guide_contain .grayBox .tableX td {padding-top:8px !important; padding-bottom:8px !important;}
.guide_contain .grayBox .tableX td img {margin:10px 0;}
.guide_contain .grayBox .whiteBox.shadowNone {padding-top:5px !important; padding-bottom:5px !important; border-radius:0 !important;}
.guide_contain .btn_charge,.guide_contain .btn_pay {position:absolute; right:0; top:0; z-index:10; width:184px; height:50px; background-color:transparent;}
.guide_contain .grayBox > .btn_charge, .guide_contain .grayBox > .btn_pay {position:absolute; right:20px; top:30px; z-index:10; width:184px; height:50px; background-color:transparent;}
.btn_charge {background:url('../img/common/btn_charge.png') no-repeat 100% 100%;}
.btn_pay {background:url('../img/common/btn_pay.png') no-repeat 100% 100%;}
.guide_contain .grayBox .tableSize {width:800px; clear:both;}
.guide_contain .grayBox .tableSize .links {float:right;}
.guide_contain .guide_title {color:#0063cc;}
.guide_contain .guide_title:before {content:"[ ";}
.guide_contain .guide_title:after {content:" ]";}
.guide_contain .guide_title > span {text-decoration:underline;}

.guide_contain .grayBox .tableSmall {width:750px;}
.guide_contain .grayBox .tableSmall th, .guide_contain .grayBox .tableSmall td {padding-top:5px !important; padding-bottom:5px !important; font-size:15px;}
.guide_contain .grayBox .tableSmall tbody th {font-family:'NotoSans Light', 'Roboto Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}

/*위험등급 배경 색상*/
.grade_table .grade01 {background-color:#ff0c00; color:#FFFFFF !important;}
.grade_table .grade02 {background-color:#ff9400; color:#000000 !important;}
.grade_table .grade03 {background-color:#e7e100; color:#000000 !important;}
.grade_table .grade04 {background-color:#71d925; color:#000000 !important;}
.grade_table .grade05 {background-color:#2775d6; color:#FFFFFF !important;}
.grade_table .grade06 {background-color:#2b3d79; color:#FFFFFF !important;}