@charset "utf-8";
/*
	Root : ITBYY_COM_PT_STATIC_ITB_WBZ
	Comment : 버튼 사이즈 수정
	Date : 2025.05.12
	작성자 : 김효정
 */


@import url('jquery-ui.css');
@import url('swiper.min.css');
 
/*=========================================== Font & color ================================================*/
.notoR {font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
.notoM {font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; /*letter-spacing: -0.028em;*/; color:#333 !important;}
/* Normal(s) */
.normal, table .bgNone, .whiteBox .itemTable td, .itemTable .price .unit, .itemTable .semiTit > span, table tr.bg td, .monthPicker .monthList .btnW, .useList li.on .grayTxt em.bold, .myMenuList li .links > span, .schedule .tableCal td .day,
.accSec .accCont li > .accPrice .accPartP li.origin > strong, button[class^=btn].btnMore, .icoTxtQ.S, .bbs.grid > li .links em, .fileList [class^=btn], .historyList > li .dashList > li, [class*=titH].normal, .tableY:not(.mod) td:nth-child(2n-1).normal {font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal;}
/* Normal(e) */


/* Bold(s) */
.bold, .cautionBox .caution, .cautionBox.msg .errorTxt, .accSumBox .accoTit, .accSumBox .priceList li > strong, .accList .priceInfo li:first-child > strong, table .bg, table.mod td:not(.bgNone):first-child,
.singleInfo, .whiteBox .itemTable tbody tr:first-child td, .whiteBox .receiptTable tbody td, .grayBox.ac [class*=col_]:not(.iptGroup) > label, .grayBox.ac [class*=col_]:not(.iptGroup) > .label, .itemTable .semiTit .price strong, .gridWrap .gridItem .label, .bankbookMsg,
.stepBox > li .num, .stepBox > li .tit,.accSec .accCont li > .accPrice .accPartP li > strong, .accSum .accSumTit, .accSum .accSumPrice > li > strong, .itemListWrap .topArea,
.infoBox .icoTit, .switchWrap .label em, .countTime, th .sort, .icoTxtQ, .retireTitWrap .title, .favList .shapeBox .btns .links,.recentTrans .useList li .blueBtn,
.bbsTop .txtItem .on, table.bbs thead th, .bbs:not(.faq) > li .links, ul.faq > li [class*=ico], .recentTrans .useList li.on .txtItem , .limitList li.top .label, .myKDB .sectionTit,
.smartTrans [class*=mykdbIco], .faq .ques, .fileList .label, .myKDB .links > span, .kdbGoods .badge > span, .commentList li .info .name, .historyList > li .tit, 
.historyList > li p.txtDot, .historyList > li .txtDot > li, .schedule .notiListWrap .dateInfo , .popGlobal .customSlt.global .customSltBox a, .accList .detailList > li.noData,
.supportInfo .tit, .faq.num .accoTit, .bbsAnswer .topArea .tit,.titH2,.titH3,.titH4,.titH5,.titH6,button[class^=btn], a[class^=btn], label[class^=btn],.ranking i.num,.videoLink,.tableX th,.tableX tfoot .pointC1, table .noData, .tableY th, .tableY:not(.mod) td:nth-child(2n-1),.itemTable td,.printTable .bg,.singleInfo ul.subInfo li > .pointC1,.receiptTable tbody td strong,
.receiptTable .circleNum,.tblCalWrap .topArea,.tableCal th,.tableCal td .day, .blueBox .topArea > .fr > strong, .whiteBox .tit, .noticeBox .tit, .caseSlt:before, .caseSlt select,.tooltip > .tit, .progress li, article.bbs .eventInfo .evtShape > span ,
.sitemapLnb .list > li > a, .sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoTit, .sitemapAccoList .depth2 > li > a, .tableX tfoot.wbizLine tr:first-child, tfoot.wbizLineNo tr:first-child, .tableX tfoot.wbizLine1 td:first-child,
.cardList > li .cardWrap .cardOver .btnCArea .down, .calcWrap .calcInfo ul li > label,.shapeBox.suggestion > .cntList > li .num,.bcmnMainTit .titWrap .toggleRadio input[type=radio]:checked + label, .bcmnMain dt, .installBox .installTit,
.addrResult .addrList .branch > *, .addrResult .addrList .txtItem > *, .termsArea .termsDetail .titBox .termsTit,.switchWrap input[type="checkbox"]:not(.def) + label > em, .bioNum, .toDear .name, .popSignArea > .date, .popSignArea > .sign, .diagramB2b strong, .regionCont .mapBtn li button, .popSignArea.stampTax .name,
.popSignArea.stampTax .stamp .date, .taskBox .tableX thead th:first-child, .taskBox .tableX tbody th, .chkCardList > li input[type="radio"]+label, .titIptGroup, .btnPensionInfo, .popService .customSlt.retire .customSltBox button,
.popService .serviceMenu ul > li > a, .popService .serviceCustom .titCustom, .mallProduct .infoTit a, .mallProduct .infoFigure strong, .compareTit, .openEvent dt, .mallDetailLeft .leftTab li > button, .bestProTit .titWrap .toggleRadio input[type=radio]:checked + label,
.bestList .shapeBox .mallProduct .numDia i.num, .anotherList > li .tit a, .quick .infoBox .topArea .fl > em, .goTop .btnGoTop, .pxNavi li.on a, .pxNavi.invert li a, .fafl.main .filter > li > input[type="radio"]:checked + label, .fafl.main .filter > li > input[type="radio"]:focus + label,.fafl.main .filter > li > input[type="radio"]:hover + label, 
.fafl.main .search > select.ipt, .chef.main .chefSubMenu a, .chef.main .visualCont .btnGroup a, .chef.main .visualCont .hexaLink li > a, .chef.main .chefMenu a > span.num, .bm.main .fitArea li input[type="radio"]+label, .cbps.main .keyContents .goList li > a,
.co.main .searchCont .search > select.ipt, .ce.main .keyContents .item button, .cl.main .keyContents .goList li > a, .ng.main .keyContents .goList li > a > span, .notiCont strong.tit, .bbsPrevNext dl dt, .totalSearch .resultTit .links,
.popSignArea > .date, .nextRoundBlue .nextRoundIs .nrTitle dd, .clRule .accoWrap .accoContents > ul > li > strong, .popGlobal .globalLnb .list > li > a, .popGlobal .globalCont .titArea .tit, .popGlobal .jobNotice .jobBtn > span, .pxNavi li a,
.chgl .historyWrap .txtArea .historyList .txt, input[type="checkbox"][class*=mall] + label, .popBox.paging li > a, .gnb .depthTit, .gnb .cateTit, .csGridHeader .tableX thead td, .parallax .scrollGuide,
.chhm .mainTxtSlide .bigTit, .mna.main .wrap .bigTit, .ck.main .pgCustomSlide .slide-cont .bigTit, .ck.main .pgCustomPagination .swiper-pagination-bullet span, .bank.main .copyArea .bigTit, .brMain .visualTop .copyArea .bigTit, .bank.main .hotKDB li .tit, .chhm .filter > li > input[type="radio"]:checked + label {font-family:'NotoSans Medium', 'Roboto Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
/* Bold(e) */


[class ^=fontCheck] {font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; position:absolute; top:-30px; font-size: 12px; width:1132px; margin:0 auto; letter-spacing: 0; opacity: 0}
.fontCheck2 {font-family:'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; }

.c000 {color:#000000 !important;}
.c333 {color:#333333 !important;}
.c666 {color:#666666 !important;}
.c999 {color:#999999 !important;}
.blueC {color:#0063cc !important;}
.greenC {color:#118000 !important;}
.pointC1 {color:#d6006d !important;}
.pointC2 {color:#5d0b8a !important;}
.pointC3 {color:#4960eb !important;}
.pointC4 {color:#4960eb !important;}
.pointC5 {color:#e00000 !important;}
.pointC6{color:#003ca6 !important;}
.pointC7{color:#008bf1 !important;}
.pointC8{color:#001f5b !important;}
.errorRed { color: #ed0f0f; }
.red{color:#e00000 !important;}
.italic{font-style:italic;}

.mh50 { min-height: 50px !important; }
.mh60 { min-height: 60px; }
.mh70 { min-height: 70px; }
.mh80 { min-height: 80px; }
.mh105 { min-height: 105px; }
.mh130 { min-height: 130px; }
.mh150 { min-height: 150px; }
.mh170 { min-height: 170px; }
.mh250 { min-height: 250px; }
.mh276 { min-height: 276px !important; }
.mh300 { min-height: 300px !important; }
.mh325 { min-height: 325px !important; }
.mh360 { min-height: 360px !important; }
.mh400 { min-height: 400px !important; }
.mh430 { min-height: 430px !important; }

.mwAuto { min-width: auto !important; }
.mw50 {min-width:50px;}
.mw60 {min-width:60px;}
.mw70 {min-width:70px;}
.mw100 {min-width:100px;}
.mw110 {min-width:110px;}
.mw160 {min-width:160px;}
.mw190 {min-width:190px;}
.mw250 {min-width:250px;}

.mlBack{margin-left:-19px}

/*=========================================== Title/Text =============================================*/
.titH1 {font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-size: 58px; line-height: 1.068em; letter-spacing: -0.05em; color:#333}
.titH2 {font-size: 34px; line-height: 1.2em; letter-spacing: -0.03em; color:#333; outline-color: rgba(0,0,0,0)}
.titH3 {font-size: 24px; line-height: 1.458em; letter-spacing: -0.025em; color:#333}
section .titArea, .popCont .titArea{padding-bottom:13px; min-height: 34px; margin-top:-7px; box-sizing: border-box;}
section .titArea .titH3.line:after {content: ''; position: absolute; left: 0; right: 0; bottom: 18px; border-bottom: 2px solid #666;} 
section .titArea.line {padding-bottom:13px; margin-bottom:19px; border-bottom: 2px solid #666;}
.popCont .titArea.line { border-bottom:2px solid #333; padding-bottom:30px; }
section .titArea .titH3, .popCont .titH3, .titArea.icon .titH3 {padding-left:19px; background:url('../img/common/bul_h3.png') no-repeat 0 10px;}
.noIcon {padding-left: 0 !important; background: none !important;}
.titH4 {font-size: 20px; line-height: 1.5em; letter-spacing: -0.05em; color:#333}
.titH5 {font-size: 18px; line-height: 1.444em; letter-spacing: -0.025em; color:#333}
.titH6 {font-size: 16px; line-height: 1.5em; letter-spacing: 0; color:#333}

.txt {line-height: 1.6em; font-size:16px}
.txt.plus {padding-left:17px; color:#e00000; background:url(../img/common/ico_fnd_plus.png) no-repeat 0 6px; box-sizing:border-box;}
.txt.minus {padding-left:17px; color:#0054ad; background:url(../img/common/ico_fnd_minus.png) no-repeat 0 6px; box-sizing:border-box;}

.txt15 { font-size: 15px !important; }
.txt16 { font-size: 16px !important; }
.txt18 { font-size: 18px !important; }
.txt20 {font-size: 20px !important; line-height: 1.6em;}
.txt28 { font-size: 28px !important; }
.txt30 { font-size: 30px !important; }
.txt34 { font-size: 34px !important; }
.txtL {font-size: 24px !important; line-height: 1.47em; letter-spacing: -0.03em;}
.txtM {font-size: 14px !important; line-height: 1.6em;}
.txtS {font-size: 12px !important; line-height: 1.6em;}
.txtLetter { letter-spacing: -0.03em; }

.tb_bor_sp{border-collapse:separate;}

.titArea {position: relative;}
section .titArea:before, section .titArea:after {content: ''; display: table;} 
section .titArea:after {clear: both;} 
section .titArea .titH3, section .titArea .titH4, .popCont .titArea .titH3, .popCont .titArea .titH4 {display: inline-block; vertical-align: middle; }
section .titArea .titH3 + *, .popCont .titArea .titH3 + *, .popCont .titArea .titH4 + * {display: inline-block; margin-left:10px; margin-bottom: 0}
section .titArea [class^=txt], .popCont .titArea [class^=txt] {position: absolute; bottom: 13px; left:auto}
section .titArea [class^=txt].right, .popCont .titArea [class^=txt].right {right:0}
section .titArea .tooltip .txtM {position: static;}
section .titArea .titH3 + .refList{display:block; margin:7px 0 0}
section .topProduct .productArea [class^=txt] {position: static;}

.titArea .num{position:relative;margin-right:10px; padding-left:10px; font-size:24px; vertical-align:middle;}
.titArea .num:before{content:""; display:inline-block; position:absolute; top:9px; left:0; width:1px; height:22px; border-left:1px solid #e7e7e7}

.titArea .utilBtnWrap {float: right; position: relative;}
.titArea .utilBtnWrap .customSlt {min-width:250px}
.titArea .titH3 ~ .utilBtnWrap {top:5px;} 
.titArea .titH3 ~ .utilBtnWrap.t0 {top:0;} 
.titArea .utilBtnWrap button, .titArea .utilBtnWrap a {margin-left: 10px; vertical-align: middle; min-height: 24px;}
.titArea .utilBtnWrap .dropMenuWrap button, .titArea .utilBtnWrap .dropMenuWrap a {margin-left: auto}
.titArea .utilBtnWrap button:first-child { margin-left: 0; }
.titArea .utilBtnWrap .linkGroup { letter-spacing: 0 !important; }

.titArea .inputWrap {position:absolute; left:auto; bottom:15px;}
.titArea .titH3+.inputWrap:before {display:block; content:''; position:absolute; left:0; top:0; width: 1px; height: 22px; border-left:1px solid #dedede;}
.titArea .titH3+.inputWrap {margin-left:20px;}
.titArea .titH3+.inputWrap label {margin-left:20px; font-size:18px; color:#333;}

.titArea .tab ~ .utilBtnWrap {position:absolute; right:0; top:5px;}

.utilBtnWrap .linkGroup > .links:last-child {margin-right:0 !important;}
section.titArea:after {content:''; display:block; clear:both;}
section.titArea .titH2 {display:inline-block; max-width:100%; vertical-align:middle;}


.titH4.brB2 { margin-bottom: 20px; padding-bottom: 17px; border-bottom: 2px solid #666; }
.titH4.paraList {margin-top:26px; margin-bottom:10px; padding-top:24px; border-top:1px solid #e7e7e7;}
.titH4.paraList:first-of-type, .titH4.paraList.btNone, table + .titH4.paraList {padding-top:0; border-top:0;}
.grayBox .titH4.paraList:first-of-type {margin-top:0;}

/*=========================================== Text list =============================================*/
.txtList > li {display:list-item; position:relative; margin-top:11px; padding-left:19px; letter-spacing: 0; line-height: 1.6em}
.txtList > li:before {display:block; content:''; position:absolute; top:11px; left:1px; width: 5px; height: 5px;  border-radius: 1px; transform: rotate(45deg); background: #333;}
.txtList > li:after{content:""; display:block; clear:both}
.txtList > li > .txtList {margin-left: 1px; margin-top: 9px;}
.txtList > li > ul.txtList:not(.circle) > li, .txtList.txtM > li, .cautionBox > .txtList > li {padding-left: 9px; margin-top:7px}
.txtList.txtM > li {margin-top:1px !important;}
.txtList > li > ul.txtList > li:before, .txtList.txtM > li:before, .cautionBox > .txtList > li:before {width:3px; height: 3px; transform: rotate(0deg);}
.txtList > li > .txtList > li > .txtList, .noticeBox .txtList > li > .txtList, .tipBox .txtList > li > .txtList {margin-left: 0; margin-top:3px; margin-bottom: 2px}
.txtList > li > .txtList > li > .txtList > li, .txtList.txtM > li > .txtList > li, .cautionBox > .txtList > li > .txtList > li {padding-left: 9px; margin-top:0px}
.txtList > li > .txtList > li > .txtList > li:before, .txtList.txtM > li > .txtList > li:before, .cautionBox > .txtList > li > .txtList > li:before {content:'-'; top:-1px; width:auto; height: auto; transform: rotate(0deg); background: none;}

.txtList.big > li {padding-left: 21px; margin-top:11px}
.txtList.big > li:before {top:9px; left:2px; width:10px; height: 10px; box-sizing: border-box; border:2px solid #2c2c2c; border-radius: 2px; background-color: #fff}

.txtList.line { border-bottom: #e7e7e7 1px solid; padding-bottom: 30px; }

.tableY .txtList > li .links {vertical-align:baseline;}

ol.txtList {counter-reset: section;}
ol.txtList > li {padding-left: 19px;}
ol.txtList > li:before {width:auto; height:auto; top:0; left:0; counter-increment:section; content:counter(section)". "; transform:rotate(0deg); background: none}

ol.txtList li > ol.txtList li { padding-left: 19px; }
ol.txtList li > ol.txtList li:before { width: auto; height: auto; content: counter(section)"） "; }

ol.countList {counter-reset: section;}
ol.countList > li {position:relative; display: list-item; padding-left: 19px;}
ol.countList > li:before {position: absolute; width:auto; height:auto; top:0; left:0; counter-increment:section; content:counter(section)". ";}

/* noIcon */
.txtList.noIcon > li {padding-left:0 !important;}
.txtList.noIcon > li:before {display:none;}

/* Diamond */
.icoNumDia{position:relative; display:block; padding:3px 0 0 34px;}
.icoNumDia > i.num{display:inline-block; position:absolute; top:3px; left:0; width:25px; height:27px; text-align:center; margin-right:15px; color: #fff; font-size:14px; line-height:26px; background:url(../img/common/ico_bullet_diamond.png) no-repeat 0 0}
.icoNumDia.yellow > i.num{background:url(../img/common/ico_bullet_diamond2.png) no-repeat 0 0;}

ol.txtList.icoNumDia{display:block; padding:0}
ol.txtList.icoNumDia > li {position:relative; padding:3px 0 0 34px;}
ol.txtList.icoNumDia > li:before{display:none}
ol.txtList.icoNumDia > li i.num{display:inline-block; position:absolute; top:3px; left:0; width:25px; height:27px; text-align:center; margin-right:15px; color: #fff; font-size:14px; line-height:26px; background:url(../img/common/ico_bullet_diamond.png) no-repeat 0 0}
ol.txtList.icoNumDia.yellow > li i.num{background:url(../img/common/ico_bullet_diamond2.png) no-repeat 0 0;}

ol.txtList.icoNumDia.authList > li{margin-top:0; padding:35px 0 3px 45px;}
ol.txtList.icoNumDia.authList > li:first-child{padding-top:5px !important}
ol.txtList.icoNumDia.authList > li i.num{top:35px}
ol.txtList.icoNumDia.authList > li:first-child i.num{top:5px}
ol.txtList.icoNumDia.authList > li:before{content:""; display:block; position:absolute; top:0; left:12px; width:1px; height:100%; border-left:1px solid #e7e7e7}
ol.txtList.icoNumDia.authList > li:first-child:before{top:5px}
ol.txtList.icoNumDia.authList > li:last-child:before{height:40px}
ol.txtList.icoNumDia.authList > li:first-child:last-child:before{height:27px}

ol.txtList.icoNumDia.authList.mobile > li{padding:20px 0 3px 45px;}
ol.txtList.icoNumDia.authList.mobile > li:first-child{padding-top:5px !important}
ol.txtList.icoNumDia.authList.mobile > li i.num{top:20px}
ol.txtList.icoNumDia.authList.mobile > li:first-child i.num{top:5px}

ol.txtList.icoNumDia.hList{border:0}
ol.txtList.icoNumDia.hList > li{margin-top:0; padding:27px 0 30px 45px; border-top:1px solid #d2d2d2;}
ol.txtList.icoNumDia.hList > li:first-child{padding-top:5px !important; border-top:0}
ol.txtList.icoNumDia.hList > li i.num{top:25px}
ol.txtList.icoNumDia.hList > li:first-child i.num{top:5px} 
ol.txtList.icoNumDia.hList > li > .txtList > li{margin-top:11px; padding-left:19px}
ol.txtList.icoNumDia.hList > li > .txtList > li:before{width:5px; height:5px;transform:rotate(45deg)}

/* refList : 당구장표시 */
.refList > li, .refList:not(ul) {display:list-item; position:relative; padding-left:18px; font-size:14px; color:#777; line-height: 1.6em}
.refList:not(ul) {display: block;}
.txtList .refList {margin-top: 5px}
.refList > li:before, .refList:not(ul):before {display:block; content:'※'; position:absolute; top:0; left:0;}
.refList > li > .txtList {margin-top:2px}
.refList > li > .txtList > li, .txtList.txtS > li {padding-left:8px; margin-top:2px}
.refList > li > .txtList > li:before, .txtList.txtS > li:before {top:9px; width:2px; height: 2px; transform: rotate(0deg); background-color: #666}
.refList > li > .txtList > li > .txtList {margin-left:0}
.refList > li > .txtList > li > .txtList > li {padding-left:8px; margin-top:0}
.refList > li > .txtList > li > .txtList > li:before {content:'-'; top:0px; width:auto; height: auto; transform: rotate(0deg); background:none;}
.refList .links {font-size:14px; vertical-align:baseline;}

/* blueCircleList : 리스트형식 */
.blueCircleList{padding-bottom:5px;}
.blueCircleList li{position:relative; padding-left:30px; padding-bottom:10px; }
.blueCircleList i.num{position:absolute; top:4px; left:0; width:20px; height:20px; text-align:center; display:inline-block; border-radius:50%; margin-right:15px; background-color: #0063cc; color: #fff; font-size:12px; line-height:19px; }
.blueCircleList a.links{ margin-left: 10px; }

/* blueCircleNum : 개별사용형식 */
.blueCircleNum { width: 24px; height: 27px; line-height: 27px; padding-right:1px; text-align: center; display: inline-block; background: url(../img/common/ico_bullet_diamond.png) no-repeat 0 0; color: #fff; font-size: 14px; font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}
.blueCircleNum.bgNone {color:#0063cc; border:1px solid #0063cc; box-sizing:border-box; line-height:18px;}
.tableY td .blueCircleNum, .tableX th .blueCircleNum {margin-left:7px; vertical-align:top; }
.blueCircleNum.small {width:15px; height:15px; font-size:10px; line-height:13px;}

/* txtList(textType circle) */
ol.txtList.circle > li:before {border:1px solid #999; border-radius:50%; text-align:center; box-sizing:border-box; background:none;}
ol.txtList.circle > li:before {content: counter(section) !important; top:5px; width:16px !important; height:16px !important; font-size:12px !important; line-height:14px !important;}
ol.txtList.circle.txtM > li {padding-left:17px !important;}
ol.txtList.circle.txtM > li:before {top:5px !important; width:14px !important; height:14px !important; font-size:10px !important; line-height:12px !important;}
ol.txtList.circle.txtS > li {padding-left:15px !important;}
ol.txtList.circle.txtS > li:before {top:4px !important; width:12px !important; height:12px !important; font-size:8px !important; line-height:10px !important;}
.txtList > li > .txtList > li > .txtList.circle.txtS > li {margin-top:2px;}

/* dashList */
.dashList > li{display:list-item; position:relative; margin-top:3px; padding-left:12px;}
.dashList > li:before{display:block; content:'-'; position:absolute; top:0; left:0;}
p.dashList{display:list-item; position:relative; padding-left:12px;}
p.dashList:before{display:block; content:'-'; position:absolute; top:0; left:0;}

.txtList > li:first-child, .refList > li:first-child, .dashList > li:first-child {margin-top: 0 !important;}

.txtItem {letter-spacing: -2em; white-space: nowrap;}
.txtItem > li {position:relative; display: inline-block; letter-spacing: 0; margin-left:20px;}
.txtItem > li:before {content: ''; position: absolute; left: -11px; top: 4px; bottom: 3px; border-left: 1px solid #ccc;}
.txtItem > li:first-child {margin-left:0 !important;}
.txtItem > li:first-child:before {content: none;}

/* 상한가 / 하한가 / 상승폭 / 하락폭 */
.upperLimit { color: #e00000; }
.upperLimit:before { content: "▲"; padding-right: 5px; color: #e00000; font-size: 11px; } /* 20.07.09 컬러값 수정 */
.lowerLimit { color: #0054ad; }
.lowerLimit:before { content: "▼"; padding-right: 5px; color: #0054ad; font-size: 11px; }
.blueBox .topArea > .fr > [class*=Limit] { margin-right: 10px; }

/* itemList */
.itemList{margin-top:20px; border-top:2px solid #666; border-bottom:1px solid #dedede; max-height:270px; overflow-x:hidden; overflow:auto}
.itemList > li{padding:15px 20px; font-size:16px; color:#666; border-top:1px solid #dedede}
.itemList > li:first-child{border-top:0}
.itemList > li:after{content:""; display:block; clear:both}
.itemList > li .icoBtnDel{float:right}
.itemList > li .links:after{content:none}
.itemList > li .links.black{float:left;}
.itemList > li input[type="checkbox"]:not(.def)+label{color:#0063cc}
.itemList > li input[type="checkbox"]:not(.def)+label:hover,
.itemList > li input[type="checkbox"]:not(.def):focus+label{text-decoration:none; color:#004a99}
.itemList > li input[type="checkbox"]:not(.def)+label span{position:relative;}
body:not(.isIE) .itemList > li input[type="checkbox"]:not(.def)+label span {text-shadow: 0px 0px 0px rgba(0,102,204, 0.8);}
.itemList > li input[type="checkbox"]:not(.def)+label span:after{content:''; position:absolute; bottom:0; left:0; right:0; border-bottom:1px solid #0063cc;}
.itemList.tSdwNone > li input[type="checkbox"]:not(.def)+label span {text-shadow: none !important;}

/* itemList + noScroll*/
.itemList.noScroll{max-height:none;}

/* itemList + topArea */
.itemListWrap{position:relative; margin-top:20px;}
.itemListWrap .topArea{padding:20px 20px; background-color:#f8f8f8}
.itemListWrap .itemList{margin-top:0}

/* itemList + confirmList */
.itemList.confirmList li { position: relative; padding-top: 20px; padding-bottom: 20px;}
.itemList.confirmList .tit { padding-right: 170px; }
.itemList.confirmList .confirmRadio { position: absolute; top: 50%; right: 20px; margin-top: -10px; }
.itemList.confirmList .confirmRadio label { margin-left: 15px; } 

/* itemList + exchangeInfo */
.itemList.exchangeInfo > li { padding-top: 30px; padding-bottom: 30px; }

/* itemList + iptFull */
.itemList.iptFull { max-height: none; margin-top: 0; }
.itemList.iptFull li { padding: 0; }
.itemList.iptFull li input[type="radio"]:not(.def)+label, .iptFull input[type="checkbox"]:not(.def)+label { display: block; padding: 20px 30px; }

/* itemBoth : 텍스트 양쪽타입 (기본) */
.itemBoth {position:relative;}
.itemBoth:after {content:''; display:block; clear:both;}
.itemBoth .item {display:inline-block;}
.itemBoth .ar {float:right;}
/* itemBoth : 텍스트 양쪽타입 (영수증 상단) */
.itemBoth.receipt {margin-bottom:20px; font-size:14px;}
.itemBoth.stamp .item {line-height:26px;}
.itemBoth.stamp img {width:26px; height:26px;}

/* starList */
.starList > li, .starList:not(ul) {position:relative; padding-left:12px; font-size:14px; color: #777; line-height: 1.6em;}
.starList > li:before, .starList:not(ul):before {display:block; content:'*'; position:absolute; top:0; left:0;}

/*=========================================== Form =============================================*/
/* Grid */
.row {margin-left:-10px; margin-right: -10px;}
.row:after, .row:before {content: " "; display: table;}
.row:after {clear: both;}
.row + .row {margin-top:20px}

[class*=col_] {display:inline-block; position: relative; min-height: 1px; box-sizing: border-box; vertical-align: middle;} 
.row > [class*=col_] {float: left; padding-left:10px; padding-right:10px;}
.col_1 {width: 8.33333%; max-width:96px}.col_2 {width: 16.66667%; max-width:192px}.col_3 {width: 25%; max-width:288px !important}.col_4 {width: 33.33333%; max-width:383px !important}.col_5 {width: 41.66667%; max-width:480px}.col_6 {width: 50%; max-width:576px}.col_7 {width: 58.33333%; max-width:671px}.col_8 {width: 66.66667%; max-width:768px}.col_9 {width: 75%; max-width:864px}.col_10 {width: 83.33333%; max-width:959px}.col_11 {width: 91.66667%; max-width:1056px}.col_12 {width: 100%; max-width:1152px}.col_20 {width: 20%; max-width:230px}
.pull_1 {margin-left: 8.33333%;}.pull_2 {margin-left: 16.66667%;}.pull_3 {margin-left: 25%;}.pull_4 {margin-left: 33.33333%;}.pull_5 {margin-left: 41.66667%;}.pull_6 {margin-left: 50%;}.pull_7 {margin-left: 58.33333%;}.pull_8 {margin-left: 66.66667%;}.pull_9 {margin-left: 75%;}.pull_10 {margin-left: 83.33333%;}.pull_11 {margin-left: 91.66667%;}.pull_12 {margin-left: 100%;}
.push_1 {margin-right: 8.33333%;}.push_2 {margin-right: 16.66667%;}.push_3 {margin-right: 25%;}.push_4 {margin-right: 33.33333%;}.push_5 {margin-right: 41.66667%;}.push_6 {margin-right: 50%;}.push_7 {margin-right: 58.33333%;}.push_8 {margin-right: 66.66667%;}.push_9 {margin-right: 75%;}.push_10 {margin-right: 83.33333%;}.push_11 {margin-right: 91.66667%;}.push_12 {margin-right: 100%;}
.half .col_1 {width: 12.499999999%; max-width:192px}.half .col_2 {width: 20.8333333%; max-width:192px}

/* 20.04.07 지방세 관련 col 사이즈 추가 (정현아) */
.small.col_1{width:48px !important;}
.small.col_2{width:57px !important;}
.small.col_5{width:85px !important;}
.small.col_7{width:99px !important;}
.small.col_9{width:120px !important;}

/* 20.04.10 input과 gap 사이 공백 조절 (정현아) */
.grayBox .notDelWrap [class*=col_] {margin-right: 10px;}

/* colGroup */
.colGroup {position: relative; letter-spacing: -2em; margin-bottom: 10px;}
.colGroup > * {letter-spacing: 0;}
.colGroup .subTxt {margin-top:5px; font-size:14px;}
 
/* input */
.ipt, .newIpt {display: inline-block; height: 40px; padding: 0 18px; border: 1px solid #d2d2d2; border-radius: 4px; background-color: #fff; transition: border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s; color: #333; box-sizing: border-box; font-size:16px; font-family: 'Roboto Light', 'NotoSans Light', sans-serif; line-height: 38px;}
.ipt:focus, .phoneWrap .ipt:focus, .newIpt:focus {outline:rgba(0,0,0,0); border:1.1px solid #0068d4; box-shadow: 0px 0px 6px rgba(0,104,212,0.9);}
.ipt.blue {border-color:#b1d7e6 !important; background-color: #e8f7ff !important;}
.ipt.blue:focus {background-color: #e8f7ff; border-color:#0068d4 !important;}
.ipt::-moz-placeholder {color: #333333 !important;}.ipt:-ms-input-placeholder {color: #333333 !important;}.ipt::-webkit-input-placeholder {color: #333333 !important;}
.ipt.error {background-color: #fff5f5 !important; border-color:#e00000 !important;}
.ipt.error:focus {box-shadow: 0 0px 5px rgba(237,15,15,0.9);}
.ipt.error + .subTxt, .errorTxt {position:relative; padding-left:18px; color:#ed0f0f;}
.ipt.error + .subTxt:before, .errorTxt:before {content:'!'; position: absolute; top:5px; left:0;  width:13px; height:13px; background-color: #ed0f0f; border-radius: 50%; line-height: 11px; color:#fff; text-align: center; font-size:10px; font-family: 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;} 
.ipt[disabled], .ipt[readonly] {background-color: #f5f5f5 !important; border-color: #d2d2d2  !important; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none}
.ipt[readonly].blue {background-color: #e8f7ff !important;}
.errorTxt {margin-top:5px; font-size:14px;}
.col_w.errorTxt {margin-top: 0;}
.confirmTxt { margin-top: 5px; font-size: 14px; position: relative; padding-left: 18px; color: #118000; }
.confirmTxt:before { content: ""; display: block; position: absolute; top: 5px; left: 0; width: 13px; height: 13px; background: url("../img/common/ico_circle_green_check.png") no-repeat 0 0; }
.col_w.confirmTxt { margin-top: 0; }

/* select, textarea */
select.ipt, .selectBtn {background: #fff url('../img/common/btn_select.png') no-repeat right center; padding-right: 45px;}
select.ipt:focus::-ms-value {color:#333 !important; background-color: transparent !important;}
.ie select.ipt {padding-right: 0; background: none;}
textarea.ipt {resize: vertical; padding:12px 18px 0; min-height: 130px; line-height: 1.5em; overflow: auto}
.selectBtn {display: inline-block; height: 40px; padding: 0 18px; border: 1px solid #d2d2d2; border-radius: 4px;padding-right: 45px; color: #333; box-sizing: border-box; font-size:16px; font-family: 'Roboto Light', 'NotoSans Light', sans-serif; line-height: 38px; text-align: left; white-space: nowrap; overflow: hidden;}
.selectBtn:before {content: ''; position:absolute; width:40px; height:40px; right:0; background-color:inherit !important; background:url('../img/common/btn_select.png') no-repeat right center; }
[class*=col_] > .selectBtn {display: block; width: 100%; text-align: left;}
.selectBtn[disabled] {opacity:0.6; cursor: default; background-color: #f5f5f5 !important; border-color: #d2d2d2 !important;}
.selectBtn:focus{border-color:#0068d4 !important;}
.oldChrome table [class*=col_] > select.ipt {vertical-align:top;} /* old(크롬) 셀럭트 옵션 선택 시 춤추는 현상 */

/* customSlt */
.customSlt {position: relative;}
.customSlt .ipt {width:100%; padding-right: 45px; box-sizing: border-box; text-align: left} 
.customSlt .ipt:after {content: ''; position:absolute; right:0; top:1px; width:41px; height: 38px; background: url('../img/common/btn_select.png') no-repeat 0 0;}
.customSlt .customSltBox {display: none;}
.customSlt.on .ipt {border-color:#0068d4; box-shadow: 0 0px 6px rgba(0,104,212,0.9); border-bottom: 1px solid #fff; border-bottom-left-radius:0; border-bottom-right-radius: 0; outline:rgba(0,0,0,0); color:#999}
.customSlt.on .ipt:after {transform: rotate(180deg)} 
.customSlt.on .customSltBox {position:absolute; top: 40px; left:0; right:0; display: block; z-index: 100;  outline:rgba(0,0,0,0); border-bottom-left-radius:4px; border-bottom-right-radius:4px; border:1px solid #0068d4; box-shadow: 0 0px 6px rgba(0,104,212,0.9); border-top:none;}
.customSltBox:before {content: ''; position: absolute; top:-5px; left:0; right:0; height: 5px; background: #fff; z-index: 101}
.customSltBox button, .customSltBox a {width:100%; height:40px; padding-left:18px; background:#fff; font-size:16px; color:#333; text-align: left;}
.customSltBox button:hover, .customSltBox button:focus, .customSltBox a:hover, .customSltBox a:focus {background: #eee}
.customSltBox button.on, .customSltBox a.on {background: #efefef}
.customSltBox li:last-child button, .customSltBox li:last-child a {border-bottom-left-radius:4px; border-bottom-right-radius: 4px;}

/* customSlt + retire : 퇴직연금용 */
.customSlt.retire{display:inline-block; min-width:260px; margin-left:20px; vertical-align:middle}
.customSlt.on.retire .ipt {opacity: 0}
.customSlt.on.retire .customSltBox {top:0px; border-top:1px solid #0068d4; border-radius: 4px; overflow: hidden;}
.customSlt.on.retire .customSltBox:before {content: none;}

/* 우측에 아이콘 있는 입력 Form */
.calendarWrap {white-space: nowrap; min-width: 320px;}
.calendarWrap .calendar {width:46%}
.calendarWrap.col_5 .calendar {width:46.5%}
.calendar, .keypad {position: relative;}
.calendar .ipt, .keypad .ipt, .delete.on .ipt {padding-right:45px;}
.calendar .icoBtn, .keypad .icoBtn, .delete .icoBtn, .ui-datepicker-trigger {position: absolute; top:1px; right: 1px; width:41px; height: 38px; background: url('../img/common/btn_calendar.png') no-repeat center; border:none; transition:none;}
.ui-datepicker {z-index: 800 !important}
.calendar {min-width: 145px}
.calendar .icoBtn:hover, .keypad .icoBtn:hover, .delete .icoBtn:hover,
.calendar .icoBtn:focus, .keypad .icoBtn:focus, .delete .icoBtn:focus, .ui-datepicker-trigger {background-color: transparent;}
.calendar +.calendar {margin-left:20px;}
.calendar +.calendar:before {content: '~'; position: absolute; top: 0; left: -21px; width: 20px; display: block; text-align: center; color: #666; line-height: 38px;}
.calendar input[disabled], .calendar input[readonly] {position:relative; padding-right: 0; background: #f5f5f5 url('../img/common/btn_calendar.png') no-repeat right 0;  z-index: 1;}
.calendar input[disabled] + button, .calendar input[readonly] + button {display: none;}
.calendar.month .icoBtn {background:url(../img/common/btn_month_pop.png) no-repeat center;}
#monthSelect {display: none}

.keypad .icoBtn {width:39px; background: url('../img/common/btn_security.png') no-repeat center;}
.delete .icoBtn {visibility: hidden; background: url(/img/common/img_common.png) no-repeat -400px 0px}
.delete.on .icoBtn {visibility: visible;}
.delete.on .ipt[disabled] ~ .icoBtn, .delete.on .ipt[readonly] ~ .icoBtn {visibility: hidden;}
.delete.on .ipt:focus + i {display: none} 
.delete.on .ipt[disabled]:focus + i, .delete.on .ipt[readonly]:focus + i {display: inline-block;} 
table .calendar +.calendar {margin-left: 0; }

/* 휴대전화 번호 입력 Form */
.phoneWrap {position: relative; letter-spacing: -2em}
.phoneWrap > * {vertical-align: middle;  border-radius: 0; letter-spacing: 0; vertical-align: top}
.phoneWrap > *:focus {position:relative; z-index: 2;}
.phoneWrap select.ipt {padding-right: 25px}
.phoneWrap .ipt:first-child {width:34%; border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.phoneWrap input.ipt {width:33%;}
.phoneWrap select + input, .phoenWrap .ipt:nth-child(2) {border-left-color: #fff; border-right-color: #fff;}
.phoneWrap input:last-child, .phoneWrap input:last-of-type {border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.phoneWrap .ipt:first-child:focus {border-color: #0068d4;}
.phoneWrap .ipt[disabled]:nth-child(2), .phoneWrap .ipt[readonly]:nth-child(2) {border-left-color: #f5f5f5 !important; border-right-color: #f5f5f5 !important; }
.phoneWrap .ipt[disabled]:focus, .phoneWrap .ipt[readonly]:focus {border-left-color: #0068d4; border-right-color: #0068d4}
.phoneWrap .keypad {width: 33%; margin-right: 0 !important;}
.phoneWrap .keypad .ipt {border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -3px;}

/* 화폐단위 */
.ipt.unit + i {display:inline-block; position: absolute; top:1px; right: 5px; height: 38px; padding:0 10px; line-height: 38px;}
.ipt.unit {padding-right:45px; text-align: right;}
.ipt.unit.two {padding-right:60px;}

/* input 고정 텍스트(Left) 191205(오픈뱅킹)*/
.ipt.fixTxt + i {display:inline-block; position: absolute; top:3px; left: 5px; right:auto; height: 38px; padding:0 10px; line-height: 38px;}
.isIE .ipt.fixTxt + i{top:1px;}
.ipt.fixTxt {padding-left:75px; text-align: left;}
.delete.on .ipt.fixTxt:focus + i {display: block;} 

/* unitFront */
.unitFront .ipt.unit {padding-right:18px; padding-left:45px;}
.unitFront .ipt.unit + i {display:block !important; left:5px; right:auto;}
.unitFront.delete.on  .ipt.unit {padding-right:45px;}

/* radio, checkbox */
input[type="radio"]:not(.def), input[type="checkbox"]:not(.def) {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="radio"]:not(.def)+label, input[type="checkbox"]:not(.def)+label {position:relative; display: inline-block; margin: 0; padding: 0; cursor: pointer; /*min-height: 27px;*/ box-sizing: border-box; color:#666; line-height: 1.25em; vertical-align: top;}
input[type="radio"]:not(.def)+label:hover, input[type="checkbox"]:not(.def)+label:hover,
input[type="radio"]:not(.def):focus+label, input[type="checkbox"]:not(.def):focus+label {text-decoration: underline; color:#0063CC}
input[type="radio"]:not(.def)+label:before, input[type="checkbox"]:not(.def)+label:before {content: ""; position: relative; top: -1px; display: inline-block; width: 24px; height: 24px; margin: 0 6px 0 0; border: 1px solid #999; border-radius: 50%; background-color:#fff; box-sizing: border-box; transition: border-color linear 0.5s; vertical-align: top}
input[type="radio"]:not(.def)+label:before {box-shadow: inset 0 0 0 12px #fff; transition: border 0.225s, box-shadow ease-in-out 0.225s}
input[type="radio"]:not(.def):checked+label:hover:before, input[type="checkbox"]:not(.def):checked+label:hover:before,
input[type="radio"]:not(.def):checked:focus+label:before, input[type="checkbox"]:not(.def):checked:focus+label:before {border:1px solid #0063cc;}
input[type="radio"]:not(.def):checked+label:before, input[type="checkbox"]:not(.def):checked+label:before {border-color:#0667cd; background-color: #0063cc; box-shadow: inset 0 0 0 5px #fff;}
input[type="radio"]:not(.def)+label:hover:before, input[type="checkbox"]:not(.def)+label:hover:before,
/* 20.04.10 접근성 추가(정현아) */
input[type="radio"]:not(.def):focus+label:before, input[type="checkbox"]:not(.def):focus+label:before {border:2px solid #0063cc; outline:1px dotted #999 !important;}
input[type="radio"]:not(.def):checked:focus+label:before {border-color: #001f5b; background-color: #001f5b;}
input[type="checkbox"]:not(.def):checked:focus+label:before {outline:1px dotted #0063cc;}

.surveyArea input[type="radio"]:not(.def), .surveyArea input[type="checkbox"]:not(.def){position: relative;}


/* checkbox 재정의  */
input[type="checkbox"]:not(.def)+label:before {top:1px; width: 20px; height: 20px; border-radius: 2px; z-index: 1; transition: background-color ease-in-out 0.225s;}
input[type="checkbox"]:not(.def):checked+label:before {border-color:#0063cc; background: #0063cc url('../img/common/ico_checkbox.png') no-repeat -1px; box-shadow: none; transition: background-color 0s}
input[type="checkbox"]:not(.def):checked+label:after {
	content:''; position:absolute; top:1px; left:0; width: 20px; height: 20px; border-radius: 2px; background: #0063cc; z-index:2;
	-webkit-animation: chkmotion 0.25s 1 linear forwards;
	animation: chkmotion 0.25s 1 linear forwards;
}
@-webkit-keyframes chkmotion {0%{width: 20px; left:0}45%{width: 12px; left:8px;}75%{width: 12px; left:8px;}100%{width: 0; left:20px;}}
@keyframes chkmotion {0%{width: 20px; left:0}55%{width: 12px; left:8px;}65%{width: 12px; left:8px;}100%{width: 0; left:20px;}}
@-webkit-keyframes chkmotionBlk {0%{width: 20px; left:-27px}45%{width: 12px; left:-19px;}75%{width: 12px; left:-19px;}100%{width: 0; left:-7px;}}
@keyframes chkmotionBlk {0%{width: 20px; left:-27px}55%{width: 12px; left:-19px;}65%{width: 12px; left:-19px;}100%{width: 0; left:-7px;}}
.ie .iptGroup input[type="checkbox"]:checked+label:after {content: none;}
@keyframes iptGlow {
	0%{box-shadow: 0px 0px 6px 0px rgba(0,104,212,0.9);}
	30%{box-shadow: 0px 0px 6px 0px rgba(0,104,212,0.9);}
	50%{box-shadow: 0px 0px 13px 0px rgba(0,104,212,0.9);}
	100%{box-shadow: 0px 0px 6px 0px rgba(0,104,212,0.9);}
}

/* ipt 간격 */
.iptGroup {vertical-align: middle;}
.iptGroup input[type=checkbox]:not(.def) + label, .iptGroup input[type=radio]:not(.def) + label {margin-right:20px}
.ie8 .iptGroup input[type=checkbox]:not(.def) + label, .ie8 .iptGroup input[type=radio]:not(.def) + label {margin:0px 20px 0 0; vertical-align: middle;}
.iptGroup input[type=checkbox]:not(.def):last-of-type + label,.iptGroup input[type=radio]:not(.def):last-of-type + label {margin-right:0}
.iptGroup > div {position:relative; margin-top: 15px; padding-left:27px;} 
.iptGroup > div > label:before {position:absolute !important; left:-27px;}
.iptGroup > div > input[type="checkbox"]:not(.def):checked+label:after {left:-27px;
	-webkit-animation: chkmotionBlk 0.25s 1 linear forwards;
	animation: chkmotionBlk 0.25s 1 linear forwards;
}
.iptGroup > div:first-child {margin-top: 0px} 
.col_10.iptGroup {vertical-align: top}
/* iptGroup inline */
.iptGroup.inline > div {display:inline-block; margin-top:0; margin-right:20px;}
.iptGroup.inline > div .tip {margin-left:5px; margin-right:0;}
.iptGroup.inline > div .tip .tipWrap {vertical-align:top;}
.iptGroup.inline > div .tip .tipWrap .help {top:-2px;}
.iptGroup.inline > div.delete[class*=col_] {margin-left:-10px; padding-left:0 !important;}

/* disabled */
input[type="radio"][disabled]:not(.def)+label, input[type="checkbox"][disabled]:not(.def)+label,
input[type="radio"][readonly]:not(.def)+label, input[type="checkbox"][readonly]:not(.def)+label {cursor: default; color:#999}
input[type="radio"][disabled]:not(.def)+label:before, input[type="checkbox"][disabled]:not(.def)+label:before,
input[type="radio"][readonly]:not(.def)+label:before, input[type="checkbox"][readonly]:not(.def)+label:before {background-color:#eee; border-color:#c2c2c2}
input[type="checkbox"][disabled]:not(.def):checked+label:before,
input[type="checkbox"][readonly]:not(.def):checked+label:before {background-color:#8fb8e0; border-color: #8fb8e0}
input[type="radio"][disabled]:not(.def)+label:before,
input[type="radio"][readonly]:not(.def)+label:before {box-shadow: inset 0 0 0 12px #eee}
input[type="radio"][disabled]:not(.def):checked+label:before,
input[type="radio"][readonly]:not(.def):checked+label:before {box-shadow: inset 0 0 0 5px #eee; background-color: #8fb8e0; border-color: #8fb8e0}
input[type="radio"][disabled]:not(.def)+label:hover:before, input[type="checkbox"][disabled]:not(.def)+label:hover:before,
input[type="radio"][readonly]:not(.def)+label:hover:before, input[type="checkbox"][readonly]:not(.def)+label:hover:before {border:1px solid #ccc;}
input[type="radio"][disabled]:not(.def)+label:hover, input[type="checkbox"][disabled]:not(.def)+label:hover, 
input[type="radio"][readonly]:not(.def)+label:hover, input[type="checkbox"][readonly]:not(.def)+label:hover {text-decoration: none;}
input[type="checkbox"][disabled]:not(.def):checked+label:after, input[type="checkbox"][readonly]:not(.def):checked+label:after, 
input[type="radio"][disabled]:not(.def)+label:after, input[type="radio"][readonly]:not(.def)+label:after {
	-webkit-animation: chkmotionBlk 0s 1 linear forwards;
	animation: chkmotionBlk 0s 1 linear forwards;
}

/* 체크 & 라디오 리스트 */
.iptList:before, .iptList:after {content: ''; display: table}
.iptList:after {clear: both;}
.iptList {letter-spacing:-2em;}
.iptList > li {display:inline-block; width: 25%; box-sizing: border-box; vertical-align: top; letter-spacing: 0px;}
.iptList.div3 > li { width: 33.1%; }
.iptList > li > div {padding: 10px 20px 10px 0; box-sizing: border-box;}
.iptList > li > div input[type="radio"]:not(.def)+label {display:block; padding-left:30px;}
.iptList > li > div input[type="checkbox"]:not(.def)+label {display:block; padding-left:26px;}
.iptList > li > div input[type="radio"]:not(.def)+label:before, 
.iptList > li > div input[type="checkbox"]:not(.def)+label:before {position:absolute; left:0;}
.oldChrome .iptList {letter-spacing: 0px;}
.oldChrome .iptList > li {margin-right: -3px;}

/* 파일업로드 */
label[class^=btn] {cursor: pointer;}
.fileWrap.col_w {position: relative;}
.fileWrap label {position: relative; z-index: 1}
.fileWrap input[type=file]{position:absolute; top:0; left:0; width:1px; height:1px; margin-left:-1px; clip: rect(0 0 0 0); opacity: 0; z-index: 0; -webkit-appearance:none; appearance:none;}
.fileWrap input[type=file]::-ms-browse {display: none; visibility:hidden;}
.fileWrap input[type=file]:focus ~ label {background-color: #2e3040;}
.fileWrap input[type=file]:focus, .fileWrap input[type=file]:focus + label {outline:1px dotted #333;}
.fileWrap .btnD.on {background-color:#2e3040;}

/* input radio/checkbox 가로사이즈 100% / 오버시 배경색상 */
.iptFull { width: 100%; }
.iptFull input[type="radio"]:not(.def)+label, .iptFull input[type="checkbox"]:not(.def)+label { display: block; padding: 8px 20px; }
.iptFull input[type="radio"]:not(.def)+label:hover,
.iptFull input[type="radio"]:not(.def)+label:focus,
.iptFull input[type="checkbox"]:not(.def)+label:hover,
.iptFull input[type="checkbox"]:not(.def)+label:focus,
.iptFull input[type="radio"]:checked:not(.def)+label, 
.iptFull input[type="checkbox"]:checked:not(.def)+label { background-color: #f8f8f8; }

/* email */
ul.mailtip {zoom: 1; background-color: #fff; list-style: none; border: 1px solid #ccc; overflow: hidden; text-align: left; font-size: 14px }
ul.mailtip:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
ul.mailtip li p { height: 28px; text-align: inherit; line-height: 28px; cursor: pointer; margin: 0 9px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
ul.mailtip li.active { color: #eb7350; background: #eaeaea;}
ul.mailtip li.hover { background: #e7f6ff;}


/*=========================================== Button(2025_웹접근성_공통수정) ==============================================*/
button[class^=btn], a[class^=btn], label[class^=btn] {display: inline-block; min-width: 100px; height: 40px; padding:0 14px; background-color:#4b4e68; line-height: 38px; vertical-align: middle; text-align: center; border-radius:4px; box-sizing: border-box; color:#fff; transition:background-color 0.125s, border 0.125s; font-size:16px}
[class^=btn].S {min-width:64px; min-height:30px; height:auto; padding:4px 10px; line-height:20px; font-size:14px; font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal;}
[class^=btn][disabled],[class^=btn].disabled {cursor: default;}
/*.btnD:not(div) {font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;} */
.btnG:not(div) {color:#333; background-color: #e6e9ee;}
.btnW:not(div) {background-color: #fff; border:1px solid #555; color:#555}
.btnWB:not(div) {background-color: #f3f9ff; border:1px solid #0063CC; color:#0063CC}
.btnR:not(div){background-color: #fef9fb; border: 1px solid #b92770; color:#b92770;}
.btnGroup, .btnArea {letter-spacing: -2em; vertical-align: middle;}
.btnGroup > * {margin: 0 5px; letter-spacing: 0px;}
table td > [class^=btn] {margin-left: 5px; margin-right: 5px}
.btnGroup > *:first-of-type, table td > [class^=btn]:first-of-type {margin-left:0;}
.btnGroup > .dropMenuWrap + [class*=btn] {margin-left:5px;}
table .colGroup .btnGroup.col_w {margin-right: 0}
.btnD:hover, .btnD:focus {background-color:#2e3040;}
.btnG:hover, .btnG:focus {background-color:#c5cbd5;}
.btnW:hover, .btnW:focus {background-color:#eee; border-color:#333; color:#333 }
.btnWB:hover, .btnWB:focus {background-color:#deebf9; border-color:#004a99; color:#004a99 }
.btnR:hover, .btnR:focus {background-color:#fbe5ec;}

.btnD[disabled], .btnD.disabled, 
.btnG[disabled], .btnG.disabled,  
.btnD[disabled]:hover, .btnD.disabled:hover,
.btnG[disabled]:hover, .btnG.disabled:hover {background-color:#eceef2; color:#7c7c7c;}
.btnW[disabled], .btnW.disabled, .btnW[disabled]:hover, .btnW.disabled:hover {background-color:#fff; border-color:#858585; color:#858585;}
.btnWB[disabled], .btnWB.disabled, .btnWB[disabled]:hover, .btnWB.disabled:hover {background-color:#fff; border-color:#5c8bbe; color:#5c8bbe;}
.btnR[disabled], .btnR.disabled, .btnR[disabled]:hover, .btnR.disabled:hover{background-color:#fff; border-color:#cd6699; color:#cd6699;}

[class^=cbtn] {display: inline-block; min-width: 180px; height: 50px; padding:0 20px; background-color:#0063cc; line-height: 50px; 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-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-size:18px; transition:background-color 0.125s, border 0.125s;}
[class^=cbtn].S {min-width:100px; height:40px; padding:0 14px; line-height: 40px; font-size:16px;}
[class^=cbtn].L {min-width:260px; height:60px; padding:0 20px; line-height: 60px; font-size:18px;}
[class^=cbtn][disabled], [class^=cbtn].disabled {cursor: default;}
.cbtnP {background-color: #b92770;}
.cbtnWB {background-color: #fff; border:1px solid #0063cc; color:#0063cc}
.cbtnWP {background-color: #fff; border:1px solid #b92770; color:#b92770}

/* 22.05.17 버튼 케이스 추가 (정현아)*/
.cbtnWB.hoverB:hover, .cbtnWB.hoverB:hover:focus{background-color: #0063CC !important; color:#fff !important; border-color:#0063CC !important;}
.cbtnWB.hoverB.on{background-color: #0063CC !important; color:#fff !important; border-color:#0063CC !important;}
.btnW.on, .btnW.on {background-color:#eee; border-color:#333; color:#333 }


/* 20.05.04 추가 (스마트알림 3줄 버튼)*/
[class^=cbtn].Big {height:115px !important; margin:0 5px !important; line-height:1.5em !important;}
[class^=cbtn].AutoH{height:auto !important; padding:20px 20px; margin: 0 15px !important; line-height:1.5em !important;}

.cbtnB:hover, .cbtnB:focus {background-color: #004a99;}
.cbtnP:hover, .cbtnP:focus {background-color: #990764;}
.cbtnWB:hover, .cbtnWB:focus {background-color: #deebf9; color:#004a99; border-color: #004a99;}
.cbtnWP:hover, .cbtnWP:focus {background-color: #fbe5ec; color:#990764; border-color: #990764;}

.cbtnB[disabled], .cbtnB.disabled,
.cbtnB[disabled]:hover, .cbtnB.disabled:hover {background-color: #5989bd;}
.cbtnP[disabled], .cbtnP.disabled,
.cbtnP[disabled]:hover, .cbtnP.disabled:hover {background-color: #c26aa2;}
.cbtnWB[disabled], .cbtnWB[disabled]:hover, .cbtnWB.disabled:hover {background-color: #fff; border-color: #5c8bbe; color:#5c8bbe;}
.cbtnWP[disabled], .cbtnWP[disabled]:hover, .cbtnWP.disabled:hover {background-color: #fff; border-color: #cd6699; color:#cd6699;}

.cbtnWB.interest span { display: inline-block; padding-left: 28px; background: url("../img/common/bg_interest_blue.png") no-repeat 0 50%; }
.cbtnWP.interest span { display: inline-block; padding-left: 28px; background: url("../img/common/bg_interest_red.png") no-repeat 0 50%; }
.compare span { display: inline-block; padding-left: 28px; background: url(../img/common/bg_compare.png) no-repeat 0 50%; }

/* 가로나열 자음 검색 */
.wordBtn { margin-bottom: 30px; }
.wordBtn [class^=btn].S { min-width: 40px; margin: 0 6px; }
.wordBtn [class^=btn].S.all { min-width: 64px; }
.wordBtn [class^=btn].S.on {background-color: #4b4e68; color: #fff}

.links {position:relative; display:inline-block; color:#0063cc; /*text-decoration:underline;*/ word-break:break-all; font-size:16px;}
.links > span {position: relative; z-index: 2;}
.links > span:after {content:''; position:absolute; bottom:0; left:0; right:0; border-bottom: 1px solid #0063cc;}
a.links:hover, button.links:hover {color:#004a99; /*text-decoration:underline;*/}
.links:after, .tableY .refList .links:after, .tableY .txtList .links:after {content:''; position: absolute; width:auto; height:30px; right:-4px; left:-4px; top:-1px; background-color: rgba(0,138,255,0); z-index: 1; border-radius: 2px; transition: background-color ease-out 0.155s;}
a.links:hover:after, a.links:focus:after, button.links:hover:after, button.links:focus:after, .tableY .refList .links:hover:after, .tableY .refList .links:focus:after, .tableY .txtList .links:hover:after, .tableY .txtList .links:focus:after {background-color: rgba(0,138,255,0.05);}
.links:hover > span:after, .links:focus > span:after {border-color: #004a99}
.links.arr {padding-right: 23px; text-decoration:none;}
.links.arr:before, .linkGroup > .links.arr span:before {content:''; position: absolute; width:16px; height:11px; top:7px; left:auto; right:0; background: url(../img/common/img_common.png) no-repeat -515px 0; z-index: 2;}

/* 2019.11.6 강석희 추가 */
.utilBtnWrap > .linkGroup{margin-top: 5px;}
.utilBtnWrap .links.arr:before{height: 13px;top: 4px;}
.utilBtnWrap .linkGroup > .links.arr span:before{top:3px}
.utilBtnWrap .links:after{height:35px !important;}

/* 2019.11.6 강석희 추가 */
/*.links.arr:hover:before {content:''; position: absolute; width:auto; height:40px; right:-10px; left:-10px; top:-8px; background-color: rgba(0,138,255,0.05); z-index: 1; border-radius: 4px;}*/ 
.links.blank {padding-right: 23px; text-decoration:none;}
.links.blank:before, .linkGroup > .links.blank span:before {content:''; position: absolute; width:14px; height:14px; top:6px; left:auto; right:0; background: url(../img/common/ico_blank_link.png) no-repeat 0; z-index: 2;}

.links.download {padding-right: 27px; background: url(../img/common/btn_download.png) no-repeat right 15px;}
.links.download > span:after {left: auto; right: -23px; top: 3px; width: 11px; height: 17px; border-bottom: none; background: url(../img/common/btn_download2.png) no-repeat 0 0;}
.links.go {text-decoration:none; height: auto; }
.links.go span { border-bottom: none; }
.links.go span:after {content:''; display: inline-block; width:14px; height:14px; background: url(../img/common/ico_go2.png) no-repeat right 50%; z-index: 2; position: static; top: auto; bottom: auto; left: auto; right: auto; border: none; }
.links.go.h50:after { height: 51px; }
.links.interest { padding-left: 26px; background: url(../../img/common/bg_interest_blue.png) no-repeat 0 50%; }
.links.interest.R { padding-left: 26px; background: url(../../img/common/bg_interest_red.png) no-repeat 0 50%; color: #d6006d; }
.links.compare { padding-left: 26px; background: url(../../img/common/bg_compare.png) no-repeat 0 50%; }
.links.pop {padding-right: 23px; text-decoration:none;}
.links.pop:before, .linkGroup > .links.pop span:before {content:''; position: absolute; width:16px; height:14px; top:6px; left:auto; right:0; background: url(../img/common/ico_layer_link.png) no-repeat 0; z-index: 2;}

/* 2020.4.17 강석희 추가 */
.links.type_new{width:auto !important; color:#0063cc !important;}
.links.type_new span{max-width:100% !important; overflow:inherit !important;}
.links.type_new span:after{opacity:1 !important;}
.bbs .links.type_new{margin-top:10px; clear:both}

.logoTxt .links:after, .links.arr > span:after, .links.blank > span:after, .links.interest span:after, .links.compare span:after, .links.pop > span:after {content: none;}

.linkGroup {letter-spacing: -2em;}
.linkGroup > .links {min-height:20px; margin: 0 16px 0 15px; letter-spacing: 0; vertical-align: top; /*font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;*/}
.linkGroup > .links:first-child {margin-left:0 !important;}
.linkGroup > .links:first-child:before {content:none;}
.linkGroup > .links:before {content:''; position: absolute; top:6px; bottom:4px; left:-16px; border-left:1px solid #d2d2d2;}
.linkGroup > .links:after, .tableY .links:after, .links.arr:after, .links.blank:after, .links.download:after, .links.go:after, .links.pop:after {height:40px; right:-10px; left:-10px; top:-7px; background-color: rgba(0,138,255,0); border-radius: 4px;}
/*.linkGroup > .links:hover:after, .linkGroup > .links:focus:after, .links.arr:hover:after, .links.arr:focus:after {background-color: rgba(0,138,255,0.05);}*/

.linkGroup > .links.blank:before, .linkGroup > .links.pop:before, .linkGroup > .links.arr:before {background:none;}
.linkGroup > .links.blank span:before, .linkGroup > .links.pop span:before, .linkGroup > .links.arr span:before {right:-23px;}
.linkGroup > .links.blank span:after, .linkGroup > .links.pop span:after, .linkGroup > .links.arr span:after {content:none;}

.links.bold {line-height:1.7em;}

.txtList.txtM .linkGroup {/*margin:7px 0 9px 0;*/}
.txtList.txtM .linkGroup > .links {margin:0 11px 0 10px;}
.txtList.txtM .linkGroup > .links:before {left:-11px;}
.txtList.txtM .linkGroup > .links:after {height:30px; right:-4px; left:-4px; top:-1px; border-radius: 2px;}
/* Button animation */
.links.arr:hover:before, .links.arr:focus:before {
	-webkit-animation: arrmotion 0.6s ease-in-out infinite;
	animation: arrmotion 0.6s ease-in-out infinite;
}
.linkGroup > .links.arr span:hover:before, .linkGroup > .links.arr span:focus:before {
	-webkit-animation: arrmotion2 0.6s ease-in-out infinite;
	animation: arrmotion2 0.6s ease-in-out infinite;
}
@-webkit-keyframes arrmotion {0%{right: 0;}50%{right:-5px;}100%{right:0px;}}
@keyframes arrmotion {0%{right: 0;}50%{right:-5px;}100%{right:0px;}}
@-webkit-keyframes arrmotion2 {0%{right: -23px;}50%{right:-28px;}100%{right:-23px;}}
@keyframes arrmotion2 {0%{right: -23px;}50%{right:-28px;}100%{right:-23px;}}

.links.download:hover > span:after, .links.download:focus > span:after {
	-webkit-animation: downloadmotion 0.65s ease-in-out infinite;
	animation: downloadmotion 0.65s ease-in-out infinite;
}
@-webkit-keyframes downloadmotion {0%{top: 0;}50%{background-position:0 5px;}100%{background-position:0px;}}
@keyframes downloadmotion {0%{top: 0;}50%{top:5px}100%{top:0px}}

/* links : red*/
.links.red{color:#e00000}
.links.red > span:after{border-color:#e00000}
.links.red:hover {color:#e00000;}
.links.red:after {background-color: rgba(224,0,0,0);}
.links.red:hover:after, .links.red:focus:after {background-color: rgba(224,0,0,0.05);}
.links.red:hover > span:after, .links.red:focus > span:after {border-color: #e00000}
body:not(.isIE) .links.red > span {text-shadow: 0px 0px 0px rgba(224,0,0, 0.8);}

/* txtHover : 텍스트가 검은색일경우 */
.txtHover{position:relative; display:inline-block; color:#666; word-break:break-all; font-size:16px;}
.txtHover:hover,
.txtHover:focus{color:#0063cc;}
.txtHover:hover:after,
.txtHover:focus:after{content:''; position:absolute; bottom:0; left:0; right:0; border-bottom: 1px solid #0063cc;}


/* paging */
.paging {margin-top:30px; text-align: center; letter-spacing: -6px}
.paging ol {display: inline-block; margin:0 40px;}
.paging button, .paging li, .paging .state {display: inline-block; width:35px; height: 35px; letter-spacing: 0; box-sizing: border-box; vertical-align: top;}
.paging button {background: #fff url('../img/common/btn_bbs.png') no-repeat 0 0; border:1px solid #555; border-radius: 4px; margin:0 5px; transition:background-color ease-out 0.125s}
.paging button.prev {background: #fff url('../img/common/btn_bbs.png') no-repeat -33px 0;}
.paging button.next {background: #fff url('../img/common/btn_bbs.png') no-repeat -66px 0;}
.paging button.last {background: #fff url('../img/common/btn_bbs.png') no-repeat right 0;}
.paging button:hover, .paging button:focus {background-color: #eee}
.paging li {width:auto; min-width:42px;}
.paging li > a {position:relative; display: block; text-align: center; color:#666; line-height: 35px; font-family:'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}
.paging li > a:after {content:''; position:absolute; bottom:0; left:50%; right:50%; border-bottom: 1px solid #3382d6; transition:left ease-out 0.125s, right ease-in-out 0.125s;}
.paging li > a:hover:after, .paging li > a:focus:after, .paging li.on > a:after {left:5px; right:5px;}
.paging li.on > a {color:#3382d6}
.paging button[disabled] {opacity: 0.4; cursor: default;}
.paging button[disabled]:hover {background-color: #fff}
.paging.onlyView li { min-width: auto; margin-left: 5px; }
.paging.onlyView li:first-child { margin-left: 0; }
.paging .state {width:auto; margin:0 8px; line-height:33px;}
.paging .state .bold {color:#333;}

/* 아이콘 버튼 */
[class^=icoBtn] {display: inline-block; width:30px; height: 30px; box-sizing: border-box; border-radius: 3px; border:1px solid #e6e9ee; background-color: #fcfcfc; transition: all ease-out 0.125s; transition-property: border-color, background-color; }
[class^=icoBtn] > span {position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}
[class^=icoBtn]:hover, [class^=icoBtn]:focus {background-color: #eee}
.icoBtnPrint {background:#fff url('../img/common/ico_page_util.png') no-repeat 0 0;}
.icoBtnPlus {background:#fff url('../img/common/ico_page_util.png') no-repeat -28px 0;}
.icoBtnMinus {background:#fff url('../img/common/ico_page_util.png') no-repeat -56px 0;}
.icoBtnGraph {border: 1px solid #0063CC; background: #f3f9ff url('../img/common/ico_graph.png') no-repeat center center;}
.icoBtnGraph:hover, .icoBtnGraph:focus {background-color:#deebf9; border-color:#004a99;}
.icoBtnDel {width:24px; height:24px; border:1px solid #d2d2d2; background:#f5f5f5 url('../img/common/ico_del.png') no-repeat center center;}
.icoBtnDel:hover, .icoBtnDel:focus {border-color:#999; background-color:#eee }
.icoBtnDown { background: #f5f5f5 url('../img/common/btn_order_down.png') no-repeat -1px -1px; }
.icoBtnUp { background: #f5f5f5 url('../img/common/btn_order_up.png') no-repeat -1px -1px; }
.icoBtnArrR { background: url('../img/common/btn_arrowRight.png') no-repeat center center; }
.icoBtnDown:hover, .icoBtnDown:focus { background: #0063cc url('../img/common/btn_order_down.png') no-repeat -1px -31px; border-color:#0063cc; }
.icoBtnUp:hover, .icoBtnUp:focus { background: #0063cc url('../img/common/btn_order_up.png') no-repeat -1px -31px; border-color:#0063cc; }
[class^=icoBtn][disabled] { opacity: 0.4; cursor: default; background-color: #f5f5f5; border: #d2d2d2 1px solid; }
.icoBtnDown[disabled]:hover, .icoBtnDown[disabled]:focus { background: #f5f5f5 url('../img/common/btn_order_down.png') no-repeat -1px -1px; }
.icoBtnUp[disabled]:hover, .icoBtnUp[disabled]:focus { background: #f5f5f5 url('../img/common/btn_order_up.png') no-repeat -1px -1px; }
.icoBtnFav,.icoBtnSns {position: relative;}
.icoBtnFav:after {content: ''; position: absolute; top:-1px; left:-1px; width:30px; height: 30px; background: url(../img/common/btn_fav.png) no-repeat center bottom;}
.icoBtnFav.on:after {background-position:center 0;}
.icoBtnSns:after {content: ''; position: absolute; top:-1px; left:-2px; width:30px; height: 30px; background: url(../img/common/btn_sns.png) no-repeat center center;}
.icoBtnOpn{position:absolute;width:130px;height:34px;border:0 none;top:63px;right:138px;}
.icoBtnOpn:hover{background:none;}
.icoBtnMemo{border: 1px solid #0063CC; background:#fff url('../img/common/ico_memo.png') no-repeat center center;}
.icoBtnMemo:hover, .icoBtnMemo:focus {background-color:#deebf9; border-color:#004a99;}

.titBtn {position:absolute; top:63px; right:0; height:34px;}
.titBtn > button {position:static; width:auto; height:34px; vertical-align:top; border:none;}
.titBtn > .icoBtnMy {background-color:transparent; margin:0 6px;}
.titBtn > .icoBtnOpnR:hover, .titBtn > .icoBtnMy:hover {background:none;}

/* 아이콘 + 텍스트 버튼 */
[class^=icoTxt] {display: inline-block; position:relative; padding-left: 30px; background: url('../img/common/ico_print.png') no-repeat 0 center; color:#0063cc; font-size: 16px; vertical-align: middle; letter-spacing: 0}
.icoTxtMsg {display:inline-block; padding-left:20px; color:#666; background: url(../img/common/ico_message.png) no-repeat 0 6px; word-break: break-all;}
.icoTxtChk {padding-left:20px; font-size:14px; color:#118000; vertical-align:top; background:url(../img/common/ico_txt_finish.png) no-repeat left center}
.icoTxtChk.gray {padding-left:17px; font-size:16px; color:#4b4e68; background:url(../img/common/ico_check_gray2.png) no-repeat left center;}
.icoTxtTotal { min-width: 220px; display:inline-block; height:40px; padding-left:35px; background: url(../img/common/ico_totalList.png) no-repeat 0 center; line-height: 38px; color:#333;}

.icoTxtHome{position:absolute; top:63px; right:0; height:34px; padding-left:43px; color:#666; background: url(../img/common/ico_my_home_off_be.png) no-repeat;}
.icoTxtHome.active{background: url(../img/common/ico_my_home_on_be.png) no-repeat;}
.icoTxtHome:hover, .icoTxtHome:hover:focus{color:#0063cc;}

/* 초기화면설정 */
.icoTxtIntro {position:relative; color:#666; background: url(../img/common/ico_set_intro.png) no-repeat 0 center;}
.titArea .icoTxtIntro {position:relative; margin-left:27px; margin-top:1px; padding-bottom:2px; vertical-align:middle; background:none;}
.icoTxtIntro:before {content:''; position:absolute; top:50%; left:0; width:21px; height:22px; margin-top:-11px; background: url(../img/common/ico_set_intro.png) no-repeat 0 center;}
.icoTxtIntro:hover, .icoTxtIntro:focus {color:#0063cc; background: none;}
.icoTxtIntro:hover:before, .icoTxtIntro:focus:before {background: url(../img/common/ico_set_intro_blue.png) no-repeat 0 center; transform:rotate(180deg); transition: transform 0.5s;}
/* 재조회 */
.icoTxtReload {position:relative; padding-left:21px; padding-bottom:1px; background:none;}
.icoTxtReload:before {content:''; position:absolute; top:50%; left:0; width:14px; height:14px; margin-top:-7px; background: url(../img/common/ico_reload.png) no-repeat 0 center;}
.icoTxtReload:hover:before {transform:rotate(360deg); transition: transform 0.5s;}
.icoTxtReload.ob:before{margin-top:-9px;}
/* 보안계좌 신고하기 */
.icoTxt.rightArrow { padding-left: 0; padding-right: 25px; background: url('../img/common/ico_notify_arrow.png') no-repeat right center; }
/* 순서변경 */
.icoTxtChange { background: url('../img/common/ico_product_change.png') no-repeat 10px center; }
/* 시간 아이콘 */
.icoTxtTime {position:relative; display:inline-block; padding-left:38px; color:#666; background:none; text-align:left; vertical-align:top;}
.icoTxtTime:before {content:''; position:absolute; top:0; left:0; width:26px; height:28px; background:url('../img/common/ico_time_bg.png') no-repeat 0 0;}
.icoTxtTime:after {content:''; position:absolute; top: 13px; left: 12px; width: 2px; height: 8px; background: #001f5b; transform:rotate(-45deg); transform-origin:50% 0;
	-webkit-animation: timemotion 60s steps(60,end) infinite;
	animation: timemotion 60s steps(60,end) infinite;
}
@-webkit-keyframes timemotion {to{transform:rotate(315deg)}}
@keyframes timemotion {to{transform:rotate(315deg)}}
/* 되돌아가기 */
.icoTxtReturn { background: url("../img/common/ico_allMap.png") no-repeat 0 1px; padding-left: 24px; }
/* 초기화 */
.icoTxtReset {padding-left:23px; }
.icoTxtReset  {position:relative; padding-left:21px; padding-bottom:1px; background:none;}
.icoTxtReset:before {content:''; position:absolute; top:50%; left:0; width:17px; height:14px; margin-top:-7px; background:url(../img/common/ico_reset.png) no-repeat 0 50%; transform-origin: 58% 50%;}
.icoTxtReset:hover:before {transform:rotate(360deg); transition: transform 0.5s;}
/* 결재요청 */
.icoTxtPhone {background:url(../img/common/ico_phone_submit.png) no-repeat 0 50%;}
/*관심상품*/
.icoTxtInterest { padding-left: 26px; background:url(../img/common/bg_interest_blue.png) no-repeat 0 50%;}
.icoTxtInterest.R { padding-left: 26px; background:url(../img/common/bg_interest_red.png) no-repeat 0 50%; color: #d6006d; }
/*비교하기*/
.icoTxtCompare { padding-left: 26px; background:url(../img/common/bg_compare.png) no-repeat 0 50%;}
/*클래스비교*/
.icoTxtClassComp { padding-left: 26px; background:url(../img/common/bg_class_compare.png) no-repeat 0 50%;}
/* SNS 공유 */
.pageUtil .dropMenuBox [class*=icoTxt] {position:relative; width:154px; background-image: none; margin-right: 0; padding: 8px 10px 8px 60px; box-sizing: border-box; }
.pageUtil .dropMenuBox [class*=icoTxt]:after {content:''; position:absolute; top:5px; left:19px; width:30px; height:30px; background:url(../img/common/btn_sns_list.png) no-repeat 0 0;}
.pageUtil .dropMenuBox .icoTxtFB:after {background: url(../img/common/btn_sns_list.png) no-repeat 0 -30px;}
.pageUtil .dropMenuBox .icoTxtURL:after {background: url(../img/common/btn_sns_list.png) no-repeat 0 -60px;}
.pageUtil .dropMenuBox [class*=icoTxt]:hover, .pageUtil .dropMenuBox [class*=icoTxt]:focus {color:#0063cc}
.pageUtil .dropMenuBox [class*=icoTxt]:hover:after, .pageUtil .dropMenuBox [class*=icoTxt]:focus:after {background-position: -30px 0px;}
.pageUtil .dropMenuBox .icoTxtFB:hover:after, .pageUtil .dropMenuBox .icoTxtFB:focus:after {background-position: -30px -30px;}
.pageUtil .dropMenuBox .icoTxtURL:hover:after, .pageUtil .dropMenuBox .icoTxtURL:focus:after {background-position: -30px -60px;}

/* NetWork */
.icoBtnHome { padding-left: 26px; background: #f5f5f5 url(../img/common/ico_network_home.png) no-repeat center center; border-color: #d2d2d2; }
.icoBtnHome:hover,
.icoBtnHome:focus { padding-left: 26px; background: #0063cc url(../img/common/ico_network_home_on.png) no-repeat center center; border-color: #0063cc; }
.icoBtnMap { padding-left: 26px; background: #f5f5f5 url(../img/common/ico_network_map.png) no-repeat center center; border-color: #d2d2d2; }
.icoBtnMap:hover,
.icoBtnMap:focus { padding-left: 26px; background: #0063cc url(../img/common/ico_network_map_on.png) no-repeat center center; border-color: #0063cc; }


/* 외환 통화 아이콘 */
[class^=icoFlag] {padding-left:27px;}
.icoFlagUsd {background: url('../img/common/ico_flag_usd.png') no-repeat 0 8px;}
.icoFlagJpy {background: url('../img/common/ico_flag_jpy.png') no-repeat 0 8px;}
.icoFlagEur {background: url('../img/common/ico_flag_eur.png') no-repeat 0 8px;}
.icoFlagGbp {background: url('../img/common/ico_flag_gbp.png') no-repeat 0 8px;}
.icoFlagChf {background: url('../img/common/ico_flag_chf.png') no-repeat 0 8px;}
.icoFlagHkd {background: url('../img/common/ico_flag_hkd.png') no-repeat 0 8px;}
.icoFlagCad {background: url('../img/common/ico_flag_cad.png') no-repeat 0 8px;}
.icoFlagAud {background: url('../img/common/ico_flag_aud.png') no-repeat 0 8px;}
.icoFlagDkk {background: url('../img/common/ico_flag_dkk.png') no-repeat 0 8px;}
.icoFlagSar {background: url('../img/common/ico_flag_sar.png') no-repeat 0 8px;}
.icoFlagAed {background: url('../img/common/ico_flag_aed.png') no-repeat 0 8px;}
.icoFlagKwd {background: url('../img/common/ico_flag_kwd.png') no-repeat 0 8px;}
.icoFlagNok {background: url('../img/common/ico_flag_nok.png') no-repeat 0 8px;}
.icoFlagSek {background: url('../img/common/ico_flag_sek.png') no-repeat 0 8px;}
.icoFlagBhd {background: url('../img/common/ico_flag_bhd.png') no-repeat 0 8px;}
.icoFlagSgd {background: url('../img/common/ico_flag_sgd.png') no-repeat 0 8px;}
.icoFlagMyr {background: url('../img/common/ico_flag_myr.png') no-repeat 0 8px;}
.icoFlagNzd {background: url('../img/common/ico_flag_nzd.png') no-repeat 0 8px;}
.icoFlagCnh {background: url('../img/common/ico_flag_cnh.png') no-repeat 0 8px;}
.icoFlagIdr {background: url('../img/common/ico_flag_idr.png') no-repeat 0 8px;}
.icoFlagThb {background: url('../img/common/ico_flag_thb.png') no-repeat 0 8px;}
.icoFlagMxn {background: url('../img/common/ico_flag_mxn.png') no-repeat 0 8px;}
.icoFlagTry {background: url('../img/common/ico_flag_try.png') no-repeat 0 8px;}
.icoFlagZar {background: url('../img/common/ico_flag_zar.png') no-repeat 0 8px;}
.icoFlagBrl {background: url('../img/common/ico_flag_brl.png') no-repeat 0 8px;}
.icoFlagPln {background: url('../img/common/ico_flag_pln.png') no-repeat 0 8px;}

/* FAQ */
.icoTxtQ{position:relative; padding-left:45px; background:none; text-decoration:none; box-sizing:border-box}
.icoTxtQ:before{content:""; display:inline-block; position:absolute; top:0; left:0; width:44px; height:40px; line-height:39px; text-align:center; font-size:18px; background:url(../../img/common/ico_q.png) no-repeat 0 0}
.icoTxtQ > span{display:inline-block; margin-left:20px; line-height:40px; color:#333; word-break:break-all; font-size:20px;}
.icoTxtQ.S{padding-left:30px}
.icoTxtQ.S:before{width:33px; height:30px; line-height:28px; background:url(../img/common/ico_q_s.png) no-repeat 0 0 }
.icoTxtQ.S > span{line-height:30px; color:#666;  font-size:16px;}
.icoTxtQ.S:hover > span{color:#0063cc; border-bottom: 1px solid #0063cc;}
.icoTxtA{position:absolute; top:30px; left:20px;}
.icoTxtA:before{content:""; display:inline-block; position:absolute; top:0; left:0; width:44px; height:40px; line-height:39px; text-align:center; font-size:18px; background:url(../img/common/ico_a.png) no-repeat 0 0}

/* 보안설치 */
.icoTxtWindows{display:block; padding:115px 0 0 0; font-size:20px; color:#333; line-height:20px; text-align:center; background:url(../img/common/ico_windows.png) no-repeat center 12px}
.icoTxtMac{display:block; padding:115px 0 0 0; font-size:20px; color:#333; line-height:20px; text-align:center; background:url(../img/common/ico_mac.png) no-repeat center 7px}
.icoTxtUbuntu{display:block; padding:115px 0 0 0; font-size:20px; color:#333; line-height:20px; text-align:center; background:url(../img/common/ico_ubuntu.png) no-repeat center 6px}
.icoTxtFedpra{display:block; padding:115px 0 0 0; font-size:20px; color:#333; line-height:20px; text-align:center; background:url(../img/common/ico_fedora.png) no-repeat center 3px}

/*자동로그아웃*/
.countDown{padding:20px 0 20px 115px; font-size:14px; color:#333;}
.countDown > strong{font-size:16px;}
.countTime{display:inline-block; margin:0 3px 0 10px; font-size:22px; color:#d6006d}
.countDown:before {content:''; position:absolute; top: 35px;left: 65px; width:60px; height:60px; background:url('../img/common/ico_count_down.png') no-repeat 0 0;}
.countDown:after {content:''; position:absolute; top: 66px; left: 94px; width: 2px; height: 14px; background: #001f5b; transform:rotate(180deg); transform-origin:50% 0;
	-webkit-animation: timemotion360 60s steps(60,end) infinite; -moz-animation: timemotion360 60s steps(60,end) infinite; -ms-animation: timemotion360 60s steps(60,end) infinite; animation: timemotion360 60s steps(60,end) infinite;
}
@-webkit-keyframes timemotion360 {to{transform:rotate(540deg)}}
@-moz-keyframes timemotion360 {to{transform:rotate(540deg)}}
@-ms-keyframes timemotion360 {to{transform:rotate(540deg)}}
@keyframes timemotion360 {to{transform:rotate(540deg)}}

/* 정사각형아이콘(80*80) */
/* 인증센터 */
[class*=icoImgCert]{display:inline-block; width:80px; height:80px; margin-bottom:15px; background-repeat:no-repeat; background-position:0 0; vertical-align:top;}
.icoImgCert.delete{background-image:url(../img/common/ico_cert_delete.png);}
.icoImgCert.delete2 {background-image:url(../img/common/ico_cert_delete2.png);}
.icoImgCert.update{background-image:url(../img/common/ico_cert_update.png);}
.icoImgCert.search{background-image:url(../img/common/ico_cert_search.png);}
.icoImgCert.search2 {background-image:url(../img/common/ico_cert_search2.png);}
.icoImgCert.pause{background-image:url(../img/common/ico_cert_pause.png);}
.icoImgCert.run{background-image:url(../img/common/ico_cert_run.png);}
.icoImgCert.other{background-image:url(../img/common/ico_cert_other.png);}
.icoImgCert.other2{background-image:url(../img/common/ico_cert_other2.png);}
.icoImgCert.baro{background-image:url(../img/common/ico_cert_baro.png);}
.icoImgCert.internet{background-image:url(../img/common/ico_cert_internet.png);}
.icoImgCert.man{background-image:url(../img/common/ico_login_custom.png); background-position: center 50%;}
.icoImgCert.cancle{background-image:url(../img/common/ico_cert_cancle.png);}
.icoImgCert.cancle2{background-image:url(../img/common/ico_cert_cancle2.png);}
.icoImgCert.orderDel{background-image:url(../img/common/ico_cert_order_delete.png);}
.icoImgCert.pause2 {background-image:url(../img/common/ico_cert_pause2.png);}
.icoImgCert.finance{background-image:url(../img/common/ico_cert_finance.png);}
.icoImgCert.public{background-image:url(../img/common/ico_cert_public.png);}
.icoImgCert.loginOtp{background-image:url(../img/common/ico_cert_loginOtp.png);}
.icoImgCert.confirmOtp{background-image:url(../img/common/ico_cert_confirmOtp.png);}
.icoImgCert.qrSms {background-image:url(../img/common/ico_cert_qr_sms.png);}
.icoImgCert.push {background-image:url(../img/common/ico_cert_push.png);}
.icoImgCert.dc {background-image:url(../img/common/ico_cert_dc.png);}
.icoImgCert.db {background-image:url(../img/common/ico_cert_db.png);}
.icoImgCert.mbid {background-image:url(../img/common/ico_cert_mobile_id.png);}
.icoImgCert.idshoot {background-image:url(../img/common/ico_cert_id_shoot.png);}


/* 웹비즈 > 정보마당 > 대출 */
[class*=icoImgWbiz] {display:inline-block; width:105px; height:115px; background-repeat:no-repeat; background-position:0 0; vertical-align:top;}
.icoImgWbiz.money {background-image:url(../img/common/ico_lon_info1.png);}
.icoImgWbiz.money2 {background-image:url(../img/common/ico_lon_info2.png);}
.icoImgWbiz.note {background-image:url(../img/common/ico_lon_info3.png);}
.icoImgWbiz.hand {background-image:url(../img/common/ico_lon_info4.png);}
/* 웹비즈 > 정보마당 > 선박항공기 금융 */
.icoImgWbiz.ship {background-image: url("../img/wbiz/img_chefcm4200_ico1.png");}
.icoImgWbiz.airplane {background-image: url("../img/wbiz/img_chefcm4200_ico2.png");}
/* 웹비즈 > 정보마당 > Track Record */
.icoImgWbiz.car {background-image: url("../img/wbiz/ico_cbgipf3900_1.png");}
.icoImgWbiz.train {background-image: url("../img/wbiz/ico_cbgipf3900_2.png");}
.icoImgWbiz.hospital {background-image: url("../img/wbiz/ico_cbgipf3900_3.png");}
.icoImgWbiz.fire {background-image: url("../img/wbiz/ico_cbgipf3900_4.png");}
.icoImgWbiz.map {background-image: url("../img/wbiz/ico_cbgipf3900_5.png");}
/* 웹비즈 > 정보마당 > 지역개발금융 */
.icoImgWbiz.factory {background-image: url("../img/wbiz/ico_cbgiaf4900_1.png");}
.icoImgWbiz.village {background-image: url("../img/wbiz/ico_cbgiaf4900_2.png");}
.icoImgWbiz.castle {background-image: url("../img/wbiz/ico_cbgiaf4900_3.png");}
.icoImgWbiz.earth {background-image: url("../img/wbiz/ico_cbgiaf4900_4.png");}
/* 웹비즈 > 정보마당 > 금융결제원CMS */
.icoImgWbiz.withdraw {background-image: url("../img/wbiz/ico_chefcm4200_1.png");}
.icoImgWbiz.deposit {background-image: url("../img/wbiz/ico_chefcm4200_2.png");}
/* 웹비즈 > 정보마당 > 한국계 최초 발행실적 */
.icoImgWbiz.awarded {background-image: url("../img/wbiz/ico_cbgifd1500_1.png");}
/* 웹비즈 > 정보마당 > 한국계 최초 발행실적 */
.icoImgWbiz.medal {background-image: url("../img/wbiz/ico_cbgifd1600_1.png");}
/* 웹비즈 > 정보마당 > KDB-TECH */
.icoImgWbiz.tech1 {background-image: url("../img/wbiz/ico_chefer2200_1.png");}
.icoImgWbiz.tech2 {background-image: url("../img/wbiz/ico_chefer2200_2.png");}
.icoImgWbiz.tech3 {background-image: url("../img/wbiz/ico_chefer2200_3.png");}
.icoImgWbiz.tech4 {background-image: url("../img/wbiz/ico_chefer2200_4.png");}
/* 웹비즈 > 정보마당 > PF 개요 */
.icoImgWbiz.pfInfo1 {background-image: url("../img/wbiz/img_cbgipf3700_info1.png");}
.icoImgWbiz.pfInfo2 {background-image: url("../img/wbiz/img_cbgipf3700_info2.png");}
.icoImgWbiz.pfInfo3 {background-image: url("../img/wbiz/img_cbgipf3700_info3.png");}

/* 웹비즈 > 금상몰 > 베스트상품 : ranking label */
.ranking{position:absolute; display:inline-block; top:-1px; right:15px; width:40px; height:55px; background: url(../img/common/bg_ranking.png) no-repeat 0 0;}
.ranking i.num{display:inline-block; width:36px; height:40px; line-height:40px; text-align:center; color:#fff; font-size:18px;}

.btnArea {margin-top:30px; text-align: center;}
.btnArea > * {letter-spacing: 0; margin-left:10px;}
.btnArea > *:first-of-type {margin-left: 0}
.btnArea.line{padding-top:20px; border-top:1px solid #d2d2d2}

/* btn */
[class^=btn].arrD{position:relative; padding-right:25px;}
[class^=btn].arrD:after{content:''; display:inline-block; position:absolute; top:50%; right:10px; margin-top:-3px; width:9px; height:6px; background:url(../img/common/ico_arrow_down.png) no-repeat right center}
.btnWB.arrD:after {background:url(../img/common/ico_arrow_down_blue.png) no-repeat right center;}
/*btn : 더보기 */
button[class^=btn].btnMore{display:block; margin-top:4px; width:100%; height:50px; line-height:49px; color:#666; font-size:16px; border-top:1px solid #dedede; border-bottom:1px solid #dedede; border-radius:0; background-color:#f8f8f8}
button[class^=btn].btnMore span{display:inline-block; padding-right:22px; background:url(../img/common/btn_acco_off.png) no-repeat right center; background-size:12px 7px}
/* 좌 / 우 화살표 > or < */
button[class^=btn].arrR { padding-right: 28px; background-image: url(../img/common/btn_arrowRight.png); background-repeat: no-repeat; background-position: right center; }
button[class^=btn].arrL { padding-left: 28px; background-image: url(../img/common/btn_arrowLeft.png); background-repeat: no-repeat; background-position: 0 center; }
/*btn : 플러스 */
button[class^=btn].plusL:before, button[class^=btn].plusR:after {content:''; display:inline-block; width:12px; height:40px; margin-right:5px; vertical-align:top; background-image:url(../img/common/ico_plus.png); background-repeat:no-repeat; background-position:left center;}
button[class^=btn].plusR:after {margin-left:5px; margin-right:0;}
/* btn : pdf */
[class^=btn].pdf.S { padding-left: 35px; background: url("../img/common/ico_pdf.png") no-repeat 12px 50%; }
[class^=btn].xls.S { padding-left: 35px; background: url("../img/common/ico_xls.png") no-repeat 12px 50%; }
[class^=btn].pdf.S.bgW{background-color:#fff}
[class^=btn].pdf.on { background-color: #0063cc; background-image: url("../img/common/ico_check_white.png"); border: #0063cc 1px solid; color: #fff; }
[class^=btn].minus { padding-left: 35px !important; background-image: url("../img/common/ico_minus.png"); background-repeat: no-repeat; background-position: 12px 50%; }
[class^=btn].plus { padding-left: 35px !important; background-image: url("../img/common/ico_plus.png"); background-repeat: no-repeat; background-position: 12px 50%; }


/* btn : 영상관련 */
button[class^=btn].play {padding-left:27px; background-image: url("../img/common/img_video_play.png"); background-repeat: no-repeat; background-position: 10px center;}
button[class^=btn].stop {padding-left:28px; background-image: url("../img/common/img_video_stop.png"); background-repeat: no-repeat; background-position: 10px center;}
button[class^=btn].replay {padding-left:28px; background-image: url("../img/common/img_video_replay.png"); background-repeat: no-repeat; background-position: 7px center;}
button[class^=btn].prev {padding-left:28px; background-image: url("../img/common/img_video_prev.png"); background-repeat: no-repeat; background-position: 10px center;}
button[class^=btn].next {padding-left:28px; background-image: url("../img/common/img_video_next.png"); background-repeat: no-repeat; background-position: 10px center;}
/* btn : 새창열림 */
[class^=btn].pop { padding-right: 30px !important; background-image: url("../img/common/ico_layer_link.png"); background-repeat: no-repeat; background-position: 90% 50%; }

/* btnD + service*/
.btnD.service{border-radius:40px 40px}
.btnD.service span{position:relative; padding-right:20px}
.btnD.service span:before{content:""; position:absolute; top:5px; right:0; width:22px; height:14px; background: url(../img/common/ico_blank_link_white.png) no-repeat right 0 ;}

.videoLink {display:inline-block; height:74px; border:1px solid #666; border-radius: 4px; padding:0 20px 0 90px; box-sizing: border-box; background: url(../img/wbiz/img_video.png) no-repeat 20px center; font-size: 20px; color:#333; line-height: 72px;}
.videoLink:hover, .videoLink:focus {background-color: #f2f9ff; color: #0063cc; border-color: #0063cc}



/*=========================================== Table =============================================*/
/* 가로형 */
.tableX {position:relative; width:100%; table-layout:fixed; border-bottom: 1px solid #dedede; text-align: center; color:#333; word-break:normal;}
.tableX th, .tableX td {padding:15px 20px; border-left: 1px solid #dedede; font-weight: normal; vertical-align: middle;}
.tableX thead tr th {border-top:1px solid #d8d8d8;}
.tableX thead tr:first-child th {border-top:2px solid #626364;}
.tableX td.first, .tableX th.first {border-left: 1px solid #dedede !important;}
.tableX td:not(.redR):last-child {border-right: none !important;} 
/*.tableX th:not(.first):first-child, .tableX td:not(.first):first-child {border-left: none;}*/
.tableX .refList a.links.underline { display: inline !important; }
.tableX .bold{font-weight:bold} 
.tableX.multiLine tbody tr:first-child th {border-top:2px solid #626364;}
.tableX.multiLine tfoot:before{display: none}
.tableX.multiLine th,
.tableX.multiLine td{text-align: center}
/* .tableX .delete{position: relative;}
.tableX .delete.on .ipt{padding-right:18px}
.tableX .ar .ipt{text-align: right !important}
.tableX .delete.on .icoBtn{display: none} */

.titArea .titH2 .logo{width:160px; height:40px; background:url(../img/wbiz/img_symbol_chbi_kor3.png) no-repeat center center; background-size:100% auto; display: inline-block; vertical-align: middle; margin: -5px 20px 0 0;text-indent:-9999px}

.tbl_loading{display: block; width:20px; height:20px; margin: 0 auto; border-radius:50%; background:#9e9e9e; background:linear-gradient(to right, #9e9e9e 10%, rgba(158,158,158,0) 65%); position: relative; animation:loading_key 1s linear infinite;}
.tbl_loading:before{width:50%;height:50%; background:#9e9e9e;border-radius:100% 0 0 0; position:absolute; top:0; left:0; content: ""}
.tbl_loading:after{width:60%;height:60%; background:#fff;border-radius:50%; position:absolute; top:0; left:0; bottom:0;right:0;margin:auto; content: ""}
@keyframes loading_key{
	100%{transform:rotate(350deg)}
}
.tbl_loading1{display: block; width:25px; height:20px; margin: 0 auto; background-image: url(../img/common/img_loading.png); animation:loading_key1 .8s steps(6) infinite;}
@keyframes loading_key1{
	from{background-position-x:0px}
	to{background-position-x:-150px}
}

.tableX tr.active > *, .tableY tr.active > *, table.bbs tr.active > * {background-color:#f1f8fe !important;}

/* 말줄임 추가 2019.11.06 */
.tableX td.sum{text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

/*  동적 데이타 생성시 라인 문제 해결하기 위해 임시로 추가 (s) */
.tableX thead tr th {border-bottom: 1px solid #d8d8d8;}
.tableX tbody tr:first-child td {border-top: none;}
/*  동적 데이타 생성시 라인 문제 해결하기 위해 임시로 추가 (e) */

.tableX th {padding:16px 20px; background-color: #f6f8fb; border-top:none; color:#333;}
.tableX td {color:#666}
.tableX td,.tableX tbody th,.tableX tfoot th {border-top: 1px solid #dedede; }
.tableX tbody tr:first-child th { border-top: none; }
.tableX tbody th { text-align: left; }
.tableX.zebra:not(.row2) tbody tr:nth-child(2n) {background-color: #f8f8f8;}
.tableX.zebra.row2 tbody tr:nth-child(4n),.tableX.zebra.row2 tbody tr:nth-child(4n-1) {background-color: #f8f8f8;}
.tableX tfoot {position: relative;}
.tableX tfoot:before {content: ''; position: absolute; left:0; width:100%; height:3px; margin-top:1px; background: #fff; border-bottom:1px solid #dedede;}
.tableX tfoot td, .tableX tfoot th {padding-top: 18px; border-left: none}
.tableX tfoot .pointC1 {font-size: 18px;}
.tableX tfoot .unitR {margin-right:5px; font-size: 18px;}
.tableX tfoot td.bold.c333 {text-align:left;}
.tableX.sPd tfoot td.bold.c333 {padding-left:20px;}
.tableX.price tbody th, .tableX.price tbody td.bg {text-align: left; color: #333;}
.tableX.price tbody td {text-align: right;}
table .noData {padding: 50px 0; color:#666; text-align: center !important;}
.tableX.topLine tbody { border-top: 2px solid #626364; }
.tableX tfoot .line { border-left: 1px solid #dedede; }
.tableX .dashLine { border-left: 1px dashed #ccc; }


/* 좌측보더 문제가 있을 경우 */
.tableX:before {content: ''; position: absolute; left:-1px; top:0; bottom:0; border-left: 2px solid #fff;}
table.fixLine td, table.fixLine th {border-left: 1px solid #dedede !important;}

/* 다른은행 약관 보기일경우  */
.tableX.tblAcco tbody tr.detail{box-sizing: border-box;background-color: #f8f8f8;display:none;}
.tableX.tblAcco tbody tr.detail.show{display:table-row;}
.tableX.tblAcco tbody tr.detail.hide{display:none;}
.tableX.tblAcco tbody tr.detail > td{padding:0;}
.tableX.tblAcco tbody tr.detail td > div{box-sizing: border-box;overflow-y: scroll;height: 240px; max-height: 240px;text-align:left !important;padding: 25px 20px !important;}
.tableX.tblAcco tbody tr.detail td div span,
.tableX.tblAcco tbody tr.detail td div h3,
.tableX.tblAcco tbody tr.detail td div h4,
.tableX.tblAcco tbody tr.detail td div p{font-size:14px !important;line-height:1.6 !important;}
.tableX.tblAcco tbody tr.detail td div table tr th{text-align:center !important;}
.tableX.tblAcco tbody tr.detail td div table tr th:first-child{border-left:none}
.tableX.tblAcco tbody tr.detail td div table{border:1px solid #d8d8d8;}
.tableX.tblAcco tbody tr.detail td div table td{background-color:#fff;}
.tableX.tblAcco tbody tr.items{border-top:#dedede solid 1px;border-bottom:#dedede solid 1px;}
.tableX.tblAcco tbody tr:first-child.items{border-top:none 0;}


table.sPd th, table.sPd td {padding-left: 5px; padding-right: 5px;}
table.sPd td.ar, table.tableX.bbs td.ar {padding-right: 20px}
table.sPd td.al, table.tableX.bbs td.al {padding-left: 20px;}
table.sPd td .iptGroup label {margin-right: 5px !important;}


/* 전체적인 테이블 폰트 및 패딩 값 조절 191205(오픈뱅킹) */
table.opensPd th, table.opensPd td{padding:15px 14px; font-size:15px;}

/* 상단고정 */
.tableX tr.fixed td { background-color: #f0f7fd !important; }

/* 테이블 제목셀 우측 화살표 : BEFXRM1600 */
.tableX th.arrR {background:url('../img/common/ico_table_arr.png') no-repeat 100% 50% #f6f8fb;}

/* 테이블 라인이 없는경우(thead없음) */
.tableX.line tbody > tr:first-child th {border-top:2px solid #626364;}

/* 세로형 */
.tableY {width:100%; table-layout:fixed; border-top:2px solid #626364; border-bottom: 1px solid #dedede; text-align: left; color:#666; word-break:normal;}
table.tableY tbody th,
table.tableY tbody td {padding:15px 20px; border-top: 1px solid #d8d8d8; border-left: 1px solid #dedede; vertical-align: middle;}
.tableY th{font-weight:normal;}
.tableY th,
.tableY:not(.mod) td:nth-child(2n-1) {background-color: #f5f7fb; color:#333; }
.tableY th:not(.first):first-child,
.tableY td:not(.first):first-child {border-left:none}
.tableY.mod td.bg{border-left: 1px solid #dedede;}
.tableY.mod td:first-child {background-color: #f5f7fb; color: #333; }
.tableY tr.tfootLine td, .tableY tr.tDivLine td {padding:0; height:4px;}


table .bg {background-color: #f5f7fb !important; color: #333 !important; }
table .bgonly {background-color: #f5f7fb !important;}
table tr.bg td, table tr.bg th {background-color: #f8f8f8 !important;} 
table .bgNone, .tableY td.bgNone, .tableY:not(.mod) td:nth-child(2n-1).bgNone {background: #fff !important; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; color: #666 !important; }
table .bgW {background:#fff;}
table td.bdtNone{border-top:0 !important}

/* 테이블 내 ipt 재정의 */
table [class*=col_] {margin-right: 10px;}
table .calendarWrap .calendar:first-child {margin-right: 20px !important;}
table.noLine [class*=col_], .colGroup [class*=col_], .grayBox [class*=col_] {margin-right: 20px;}
table .linkGroup {display:inline-block;}
table td.colGroup {padding-right: 0; padding-bottom: 5px}
table.noLine td.colGroup {padding-bottom: 10px}
.keypad[class*=col_], .calendar[class*=col_] {padding:0}
.keypad[class*=col_] .ipt, .calendar[class*=col_] .ipt, [class*=col_] .ipt.unit, [class*=col_] > select.ipt {width:100%}
table .links {vertical-align: middle;}
/*table:not(.noLine) .iptGroup {margin-bottom: -5px}
table:not(.noLine) .iptGroup label {margin-bottom: 5px}*/
table.tableY:not(.noLine) .label {vertical-align: middle;}

/* ipt사이 물결표시/점 표기 */
.gap {position:relative; display:inline-block; min-width:24px; min-height:1px; margin-left:-14px; margin-right:-3px; line-height: 1.6em; color:#666; text-align:center; box-sizing:border-box; vertical-align:middle;}
.gap.al {padding-left:5px;}
.gap.ar {padding-right:5px;}
table.noLine .gap, .grayBox .gap {margin-left:-23px; margin-right:-4px !important;}
.grayBox .colGroup .gap {margin-left:-10px !important; margin-right:-10px !important;}
.colGroup .gap{margin-left:-10px; margin-right:0 !important;}
table.noLine .colGroup .gap {margin-left:-20px; margin-right:0 !important;}

/* 20.05.12 추가*/
.grayBox .notDelNew + .gap {margin-left:-20px !important;}

table .colGroup .txtItem, table .colGroup .errorTxt, table .colGroup .refList {display:block; margin-top: -4px; vertical-align: top}
table .colGroup .txtItem .refList {margin-top:0;}
table .colGroup > * {display:inline-block; /*margin-left:5px; margin-right: 5px;*/ margin-bottom: 10px; box-sizing: border-box;}
table .colGroup .linkGroup .links {margin:0px 16px 0 15px;}
table .colGroup:last-child {margin-bottom: -10px}
table [class*=col_]:not(.phoneWrap) .ipt {width:100%}
table:not(.noLine) .colGroup [class*=col_] {margin-left: 0px; margin-right: 10px;}

table .label {padding-left:10px; padding-right:10px; vertical-align: top; text-align:left;}
table.tableY .label {padding-left:20px; padding-right:20px; vertical-align: top;}
table .label > * {display: table-cell; height: 40px; vertical-align: middle; line-height: 1.2em}
table.noLine {background: none !important; border: none; margin-bottom: -15px;}/*margin-bottom:-15px 는 임시 방편. 추후 어떤 현상 일어나는지 봐야함.*/
table.noLine > tbody > tr > td {border:none; background: none !important}
table.noLine .tableY td.bgNone {background: #fff !important; border-top: 1px solid #d8d8d8; border-left: 1px solid #dedede;}
table.noLine .label {padding-right: 0; text-align: right;}
table.noLine .label > * {width: 300px; padding-right: 0;}
/*table.tableY.noLine tr:last-child td {padding-bottom: 0}*/
/*table.tableY.noLine tr:last-child .colGroup > [class*=col_]:last-child {margin-bottom: 0}*/
/* 라인맞춤(줄바꿈이 되는 라디오버튼 혹은 텍스트) */
table.noLine .label > *.vt {line-height:1.5;}


/* table.bLine */
table.bLine th{border-bottom:1px solid #d8d8d8; border-left:0}
table.bLine td{border-top:0; border-bottom: 1px solid #dedede !important; border-left: none !important; border-right: none !important; background: none !important}
table.bLine td .refList{display:block; }
table.bLine .label {padding-right: 0; padding-left:0}
table.bLine .time{display:block}
table.bLine .price{font-size:18px;}
table.bLine .reservInfo{margin:10px 0}
table.bLine .reservInfo .status{min-width:40px;padding-bottom:48px; background:url(../img/common/ico_reserv_arrow.png) no-repeat center bottom}
table.bLine .reservInfo .date{margin-top:10px;}
table.bLine .bank,
table.bLine .num,
table.bLine .name{font-size:18px; color:#333}
table.bLine .name{position:relative; margin-left:15px;padding-left:15px;}
table.bLine .name:before{content:""; display:block; position:absolute; top:5px; left:0; width:1px; height:16px; border-left:1px solid #ccc}
table.bLine .payInfo{margin:10px 0}
table.bLine .payInfo .top{padding-bottom:15px;}
table.bLine .payInfo .top:after{content:""; display:block;clear:both}
table.bLine .payInfo .top > *{display:inline-block}
table.bLine .payInfo .top .price{float:right; color:#333}
table.bLine .payInfo .top .price .fees{text-align:right; font-size:16px;}
table.bLine .payInfo .top .price .fees > span{color:#666}
table.bLine .payInfo .bottom{padding-top:10px; border-top:1px solid #d6006d}
table.bLine .payInfo .bottom .cmsCode{color:#333}
table.bLine .payInfo .bottom .cmsCode .codeNum{color:#666}
table.bLine .info:after{content:""; display:block; clear:both}
table.bLine .info li{position:relative; display:inline-block; margin-left:10px;padding-left:10px;}
table.bLine .info li:before{content:""; display:block; position:absolute; top:5px; left:0; width:1px; height:14px; border-left:1px solid #dedede}
table.bLine .info li:first-child{margin-left:0; padding-left:0;}
table.bLine .info li:first-child:before{display:none}
table.bLine .info li strong{color:#333}
table.bLine .result > *{display:block;}
table.bLine .name ~ .icoTxtMsg { display: block; }

/* table.bLine - tbodySet + 아코디언 */
table.bLine tbody.tbodySet tr > td{border:0 !important}
table.bLine tbody.tbodySet{border-bottom:1px solid #dedede}
table.bLine tbody.tbodySet tr.detail td{padding:0 20px 20px 20px; border-top:0; vertical-align:top}
table.bLine tbody.tbodySet tr.detail td ul{padding:30px 60px; text-align:center; background-color:#f6f6f6}
table.bLine tbody.tbodySet tr.detail td ul:after{content:""; display:block; clear:both}
table.bLine tbody.tbodySet tr.detail td ul li{display:inline-block; width:318px; padding:0 15px; text-align:left; vertical-align:top; box-sizing:border-box}
table.bLine tbody.tbodySet tr.detail td ul li strong{display:block; font-size:14px; color:#333}
table.bLine tbody.tbodySet tr.detail td ul li span{display:block}
table.bLine tbody.tbodySet tr.detail td ul.item4{padding:30px 40px}
table.bLine tbody.tbodySet tr.detail td ul.item4 li{width:248px;}
table.bLine tbody.tbodySet tr.detail td ul.item5{padding:30px}
table.bLine tbody.tbodySet tr.detail td ul.item5 li{width:200px;}
table.bLine tbody.tbodySet td{position:relative;}
table.bLine tbody.tbodySet.accoWrap td .accoBtn{position:absolute; right:20px; display:inline-block; width:38px; height:38px; margin-top:-16px; background:url(../img/common/btn_acco_off.png) no-repeat center center; transition: transform 0.5s;}
table.bLine tbody.tbodySet.accoWrap.on td .accoBtn.def{transform: rotate(180deg); background: url(../img/common/btn_acco_def.png) no-repeat center center;}
table.bLine tbody.tbodySet.accoWrap tr.detail td{padding:0 20px 20px 20px}

table.bLine.noLine .label {text-align: left;}
table.bLine.noLine {border-top: 1px solid #666}
table.tableY.bLine.noLine td {padding-top: 20px;} 
table.tableY.bLine.noLine td.label{padding-top:10px}
table .linkGroup, table .iptGroup, table .txtItem, table .btnGroup {vertical-align: middle; margin-right: 10px;}
table .iptGroup ~ .links {margin-top:-4px;}
table.noLine .linkGroup, table.noLine .iptGroup, table.noLine .txtItem, table.noLine .btnGroup {margin-right: 20px;}
table.noLine .linkGroup + .tip {margin-left: -15px}
table.tableY.noLine > tbody td {padding-top:0px; padding-bottom: 20px}
table .tip {margin-right: 10px;}
table.noLine .tip {margin-left: -10px;} 
table .linkGroup {margin-left:5px}
table:not(.noLine) .colGroup {margin-left:0; margin-right: 0; }
table:not(.noLine) .linkGroup {margin-left:10px;}
table .iptGroup, table .linkGroup {display:inline-block; vertical-align: middle;}
.accoContents table.noLine .label {color:#666}

/* 특정영역 적색보더 */
table.redBorder .redT {border-top: 2px solid #d6006d !important;}
table.redBorder .redL {border-left: 2px solid #d6006d !important;}
table.redBorder .redR {border-right: 2px solid #d6006d !important;}
table.redBorder .redB {border-bottom: 2px solid #d6006d !important;}
table.redBorder:before {content: none;}
table.redBorder thead th:first-child {border-left: none}

/*td.bdLRed {position: relative;}
.bdLRed:before {content:''; position:absolute; top:0; left:2px; bottom:0; border-left: 2px solid #d6006d !important;}*/

/* 아이템형 */
.itemTable {width:100%; table-layout:fixed; text-align: left;}
.itemTable th {position: relative; padding:5px 0 7px 20px; font-weight: normal; text-align: left; color:#666}
.itemTable th:after {content:''; position: absolute; bottom:0; left:20px; right: 0px; border-top:1px solid #666;}
.itemTable td {padding:14px 0 14px 20px; text-align: left; color:#333; vertical-align: bottom;}
.itemTable tbody td:first-child, .itemTable thead th:first-child {padding-left: 0; padding-right: 20px;}
.itemTable th:first-child:after {left: 0px; right:20px;}

/*.itemTable td:first-child .semiTit {padding-right:40px;}*/
.itemTable .semiTit {position: relative; padding-left: 26px;}
.itemTable .semiTit:before {content:''; position: absolute; top:0px; bottom:0; left:4px; border-left:1px solid #dedede;}
.itemTable .semiTit.pl0:before {content: none}
.itemTable .semiTit .price {margin-top:10px; font-size: 16px; text-align: right;}
.itemTable .semiTit .price .pointC1 {font-size: 20px;}

.blueBox .itemTable td .semiTit2 {border-right: #dedede 1px solid; box-sizing: border-box; padding-left: 20px; }
.blueBox .itemTable td:first-child .semiTit2 {padding-right:40px; border-left: none; padding-left: 0; }

/* 인쇄테이블 : tableY와 X모양이 복합적인 형태 사용가능(BCPCRI0001) */
.printTable {width:100%; table-layout:fixed; border-top:2px solid #626364; border-bottom:1px solid #dedede; text-align:left; color:#333; word-break:normal;}
.printTable td { color: #666; padding:15px 20px; height:25px; border-top:1px solid #d8d8d8; border-left: 1px solid #dedede; font-weight: normal; vertical-align: middle; background-color:#fff; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}
.printTable .bg { color: #333; background-color:#f5f7fb;}
.printTable tr.tfootLine td {padding:0; height:4px;}
.printTable .first {border-left:none !important;}

.whiteBox {border-color: #666}
.whiteBox:before, .whiteBox:after {content: ''; display: table;}
.whiteBox:after {clear: both;}
.whiteBox.gray, .whiteBoxWbiz.gray {border-color:#d2d2d2;}

.singleInfo {width: 100%; padding-top:4px; color:#666}
.singleInfo > * {display: inline-block; margin-right:15px; vertical-align: middle;}
.singleInfo strong {color:#0063cc; font-size:20px;}
.singleInfo.line { padding-bottom: 15px; border-bottom: #dedede 1px solid; margin-bottom: 15px; }
/* 좌우타입 */
.singleInfo ul.subInfo {letter-spacing: -2em; white-space: nowrap;}
.singleInfo ul.subInfo li {position:relative; display:inline-block; margin-left:40px; margin-bottom:1px; letter-spacing:0; vertical-align:middle;}
.singleInfo ul.subInfo li:first-child {margin-left:21px !important;}
.singleInfo ul.subInfo li:before {content:''; position:absolute; left:-20px; top:7px; bottom:3px; border-left:1px solid #ccc;}
.singleInfo ul.subInfo.price, .singleInfo ul.fr {float:right; margin-right:0;}
.singleInfo ul.subInfo.price li:first-child {margin-left:0 !important;}
.singleInfo ul.subInfo.price li:first-child:before {content:none !important;}
.singleInfo ul.subInfo li > * {display:inline-block; font-size:14px; color:#333; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-weight:normal;}
.singleInfo ul.subInfo li > *:first-child:last-child {padding-right:0;}
.singleInfo ul.subInfo li .txtM {padding-right:15px; color:#666;}
.singleInfo ul.subInfo li em, 
.singleInfo ul.subInfo li > .pointC1 {display:inline-block; margin-top:1px; font-size:16px; vertical-align:middle;}
.singleInfo ul.subInfo li em {padding-right:15px;}
.singleInfo ul.subInfo li > .pointC1, 
.singleInfo ul.subInfo li .unit {margin-left:0; font-size:20px; vertical-align:middle;}

.whiteBox .itemTable td, .whiteBox .itemTable th {padding-left:40px; color:#666}
.whiteBox .itemTable td:first-child, .whiteBox .itemTable th:first-child {padding-left:0px;}
.whiteBox .itemTable th:after {content: none}
.whiteBox .itemTable tr:first-child td {position: relative;}
.whiteBox .itemTable tbody tr:first-child td {padding-top:0; font-size: 20px; color:#333; vertical-align: top}
.whiteBox .itemTable tbody tr:first-child td:after {content:''; position: absolute; left:40px; right:0px; bottom:0; border-bottom: 1px solid #dedede;}
.whiteBox .itemTable tbody tr:first-child td:first-child:after {left:0;}
.whiteBox .itemTable tbody tr:first-child td.bdNone:after{border:0}
.whiteBox .itemTable tbody tr:last-child td {padding-bottom: 0}
.whiteBox .itemTable tbody tr:first-child td.noLine:after {display: none !important;}

.whiteBox .itemTable .subInfo > * {display:inline-block; font-size: 14px; color:#666}
.whiteBox .itemTable .subInfo .txtM {padding-right: 15px}
.whiteBox .itemTable .subInfo strong {color:#000}
.whiteBox .itemTable .price {text-align: right; color:#d6006d}
.whiteBox .itemTable .price .unit {color:#333}

.whiteBox .receiptWrap {margin:20px -30px -26px; padding:15px 30px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: #f8f8f8; }
.whiteBox .receiptTable th {font-size: 14px} 
.whiteBox .receiptTable th, .whiteBox .receiptTable td {border-left: 1px solid #dedede;}
.whiteBox .receiptTable tbody th, .whiteBox .receiptTable tbody td:first-of-type , .whiteBox .receiptTable thead th:first-child {border-left: none;}

/* 위아래 #999 줄 하나 */
.lineBox { border-top: #999 1px solid; border-bottom: #999 1px solid; padding: 15px 20px; margin-top: 3px; }
.lineBox .colGroup { margin-bottom: 0; }
.lineBox .colGroup [class*=col_] { margin: 0; padding: 0 10px; }
.oldChrome .lineBox .col_3 { width: 24.5%; }

/* table > total*/
table .total{font-size:18px; color:#333}
table .total:after{content:""; display:block; clear:both}
table .total li{position:relative; display:inline-block; margin-left:10px;padding-left:15px;}
table .total li:before{content:""; display:block; position:absolute; top:7px; left:0; width:1px; height:16px; border-left:1px solid #ccc}
table .total li:first-child:before{display:none}
table .total li strong{margin-left:5px}

/* 영수증형 */
.receiptTable {table-layout:fixed; width: 100%;}
.receiptTable thead th {padding: 10px 20px; text-align: right; font-size: 16px; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-weight: normal; }
.receiptTable tbody th {text-align: left; font-size: 16px; color: #666; }
.receiptTable tbody td {padding: 5px 20px; text-align: right; border-left: #dedede 1px solid; color: #333; }
.receiptTable tbody tr td:last-of-type, .receiptTable thead th:last-of-type {padding-right: 0}
.receiptTable .circleNum {padding-right: 10px; color: #0063cc;}

/* 달력 테이블 */
.tblCalWrap{position:relative; border-top:2px solid #626364; text-align: center; color:#333; word-break:normal;}
.tblCalWrap .topArea{padding:20px; background-color:#f6f8fb; color:#333;}
.tblCalWrap .topArea button{display:inline-block; width:35px; height:35px; letter-spacing:0; box-sizing:border-box; vertical-align:top; border:1px solid #555; border-radius: 4px; background: #fff url('../img/common/btn_bbs.png') no-repeat 0 0; transition:background-color ease-out 0.125s}
.tblCalWrap .topArea button.prev{background: #fff url('../img/common/btn_bbs.png') no-repeat -33px 0;}
.tblCalWrap .topArea button.next{background: #fff url('../img/common/btn_bbs.png') no-repeat -66px 0;}
.tblCalWrap .topArea button[disabled]{opacity:0.4; cursor:default;}
.tblCalWrap .topArea button[disabled]:hover{background-color: #fff}
.tblCalWrap .topArea button:hover,
.tblCalWrap .topArea button:focus{background-color: #eee}
.tblCalWrap .topArea strong{display:inline-block; margin:0 27px; line-height:34px; font-size:24px; vertical-align:top; }
.tableCal{position:relative; width:100%; table-layout:fixed; border-bottom: 1px solid #dedede; text-align:center; color:#333; word-break:normal;}
.tableCal:before{content: ''; position: absolute; left:-1px; top:0; bottom:0; border-left: 2px solid #fff;}
.tableCal th,
.tableCal td{border-top: 1px solid #d8d8d8; border-left: 1px solid #dedede; font-weight: normal; vertical-align: middle;}
.tableCal th{padding:16px 20px; background-color: #f6f8fb; border-top:1px solid #d8d8d8; color:#333;}
.tableCal td{position:relative; height:187px; padding:10px; text-align:left; color:#666; box-sizing:border-box}
.tableCal td .day{position:absolute; top:10px; left:10px; width:40px; height:40px; line-height:40px; text-align:center; font-size:16px; color:#333;}
.tableCal td.holiday .day{color:#e00000}
.tableCal td.saturday .day{color:#0054ad}
.tableCal td.disabled .day{color:#999}
.tableCal td.on .day{background-color:#f8f8f8}
.tableCal td .links:after{height:55px}

/*=========================================== Sorting ==============================================*/
.sort {position:relative; display:inline-block; padding-right:16px; font-size: 16px;}
.sort:before{content:""; display:inline-block; position:absolute; top:4px; right:0; width:8px; height:14px; background:url(../img/common/ico_table_sorting.png) no-repeat 0 0}
.sort .blind, .sort.up .blind.def, .sort.down .blind.def {display: none;}
.sort .blind.def, .sort.up .blind.up, .sort.down .blind.down {display: block;}
/* 오름차순 */
.sort.up:before {background-position:-8px 0}
/* 내림차순 */
.sort.down:before {background-position:-16px 0}


/*=========================================== Tab ==============================================*/
.tab:before, .tab:after {content:""; display:table}
.tab:after {clear:both;}
.tab {margin-bottom:30px; border-bottom: 1px solid #4b4e68; letter-spacing: -0.025em}
.tab > li {float: left; display: table; width:193px; height: 53px; margin-left:-1px; box-sizing: border-box; border:1px solid #d2d2d2; border-bottom: none; }
.tab.div2 > li {width:50% !important;}
.tab > li:first-child {margin-left:0; padding-left: 0px;}
.tab > li > * {display: table-cell; width:100%; text-align: center; vertical-align: middle; font-size: 18px; box-sizing: border-box; min-height: 53px; color:#666; line-height: 1.25em}
.tab > li > *:hover, .tab > li > *:focus {text-decoration: underline;}
.tab > li.on {border-right:none; color:#fff; background: url(../img/common/bg_tab_over.png) no-repeat right 1px; border-left-color:#4b4e68}
.tab > li.on > * {position:relative; top:-1px; padding-top:1px; background: url(../img/common/bg_tab_over.png) no-repeat right 0; color:#fff}
.tab > li.on > *:hover, .tab > li.on > *:focus {text-decoration: none}
.tab > li.on + li {border-left:none;}
.tab > li:nth-child(6) {width:172px;}
.tab > li:last-child.on, .tab > li.last.on {border-color:#fff;}
.ie8 .tab > li{width:189px;}
.tab.var > li {width:auto; min-width:100px;} 
.tab.var > li > * { padding:0 30px;}
.tabContain .tabContents {display: none}
.tab.multi > li {height: 62px;}
.tab.multi > li > * {font-size: 16px; min-height: 62px;}
.tab.multi.var > li {min-width:80px;} 
.tab.multi.var > li > * {padding:0 18px;}
.tab.multi > li.on {background-position: right 8px}

/* in tab */
.inTab { padding: 20px 10px; text-align: left; border-bottom: #dedede 1px solid; margin-top: -25px; margin-bottom: 25px; }
.inTab > li { display: inline-block; padding: 10px 19px 10px 13px; position: relative; }
.inTab > li a { font-size: 16px; color: #666; }
.inTab > li.on a { font-family: '맑은 고딕', sans-serif; font-weight: bold;}
.inTab > li:before { content: ""; position: absolute; top: 50%; bottom: 0; right: 0; margin-top: -9px; width: 1px; height: 18px; background-color: #d2d2d2; }
.inTab > li:last-child:before { display: none; }
/* in tab + blueLine */
.inTab.blueLine{padding:15px 10px}
.inTab.blueLine > li a:hover, .inTab.blueLine > li.on a{position:relative; display:inline-block; color:#0063cc; font-weight:normal}
.inTab.blueLine > li a:hover:before, .inTab.blueLine > li.on a:before{content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:1px; border-bottom:2px solid #0063cc}

i.unit {margin-left:3px}
i.unitR {margin-right:3px}

/* filterTab */
.filterTab { text-align: center; margin-bottom: 20px; }
.filterTab ul { display: inline-block; border: #cccccc 1px solid; overflow: hidden; }
.filterTab ul:after { content: ""; clear: both; }
.filterTab li {float: left; min-width: 110px; box-sizing: border-box; text-align: center; }
.filterTab li button {display:block; min-width: 110px; padding-left: 10px; padding-right: 10px; height: 40px; line-height: 38px; border-right: #cccccc 1px solid; background-color: #f8f8f8; text-align: center; color: #555; font-size: 16px; }
.filterTab li button.on {border: #4b4e68; background-color: #4b4e68; color: #fff; }
.filterTab li button:hover { border: #4b4e68; background-color: #4b4e68; color: #fff; }
.filterTab li:last-child button { border-right:none;}

/* subTab */
.tab.subTab{border-bottom:1px solid #dedede}
.tab.subTab > li {width:193px; height:37px; border:1px solid #dedede; background:#f8f8f8; border-bottom: none; }
.tab.subTab > li:last-child{width:172px}
.tab.subTab > li > * {font-size:16px; min-height: 37px; color:#666; line-height: 1.25em}
.tab.subTab > li.on {color:#fff; background:#4b4e68; border-left-color:#4b4e68; border-right-color:#4b4e68}
.tab.subTab > li.on > * {position:relative; top:-1px; padding-top:1px; background:#4b4e68; color:#fff}

/* 온라인설명 가이드 Tab */
.guide_tab {display:flex; flex-direction:row;}
.guide_tab > li {float:none; position:relative; display:block; width:auto; height:auto; margin:0; border:none;}
.guide_tab > li.on {background:none;}

.guide_tab.tab > li button {display:block; position:relative; padding:0 50px 0 13px; text-align:left; font-size:16px; color:#777; border-top:1px solid #d2d2d2; border-right:1px solid #d2d2d2;
background-image:url('../img/common/bg_tab_general.png'); background-repeat:no-repeat; background-size:auto 100%;
font-family:'NotoSans Medium', 'Roboto Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;}
.guide_tab.tab > li:first-child > button {border-left:1px solid #d2d2d2;}
.guide_tab.tab > li.on > button {top:0; padding-top:1px; background-image:url('../img/common/bg_tab_over.png'); background-position:right 0;  background-size:auto 100%; 
border-top:none; z-index:1;}
.guide_tab.tab > li.on:last-child button {border-right:none;}
.guide_tab.tab > li.on.check > button {text-decoration:underline;}
.guide_tab > li.on button {color:#FFFFFF;}
.guide_tab > li.check button{color:#333333;}
.guide_tab > li.check button, .guide_tab > li.check.on button {background-image:url('../img/common/bg_tab_general_check.png');} 
.guide_tab > li.import button {background-image:url('../img/common/bg_tab_import.png');}
.guide_tab > li.import.on button {background-image:url('../img/common/bg_tab_import_on.png');}
.guide_tab > li.import.check button, .guide_tab > li.import.check.on button {background-image:url('../img/common/bg_tab_import_check.png');}

.guide_tab > li .agreeUserChk {position:absolute; right:13px; top:50%; width:24px; height:24px; margin-top:-12px; background-image:url('../img/common/bg_guide_check.png');
background-repeat:no-repeat; background-position:0 0;}
.guide_tab > li .agreeUserChk i {position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}
.guide_tab > li .agreeUserChk .userMiss,
.guide_tab > li.check .agreeUserChk .userConfirm {display:block;}
.guide_tab > li .agreeUserChk .userConfirm,
.guide_tab > li.check .agreeUserChk .userMiss {display:none;}
.guide_tab > li.on .agreeUserChk {background-position:0 -35px;}
.guide_tab > li.import.on .agreeUserChk {background-position:0 -71px;}
.guide_tab > li.check .agreeUserChk, .guide_tab > li.import.check .agreeUserChk, 
.guide_tab > li.on.check .agreeUserChk, .guide_tab > li.on.import.check .agreeUserChk {background-position:0 -106px;}

/*=========================================== Text Box ==============================================*/
/* grayBox */
.grayBox.ac [class*=col_]:not(.iptGroup) > label, .grayBox.ac [class*=col_]:not(.iptGroup) > .label {display:block; margin-top:-10px; margin-bottom:5px; font-size:14px; line-height:1.6em; color:#333;}
[class*=col_].delete > .ipt.uiAct + .icoBtn {top: auto; bottom: 0} 
.grayBox {position:relative; padding:30px 20px; border:1px solid #d2d2d2; background-color: #fbfbfb; border-radius: 8px;}
.grayBox .colGroup {margin-bottom:0;}
.grayBox .colGroup [class*=col_] {text-align:left; /*vertical-align:bottom;*/}
.grayBox .colGroup [class*=col_] > .ipt {width:100%;}
.oldChrome .grayBox .colGroup [class*=col_] > select.ipt {vertical-align:top;}/* old(크롬) 셀럭트 옵션 선택 시 춤추는 현상 */
.grayBox .colGroup .btnGroup > *:last-child {margin-right:0;}
.delete > .ipt {width:100%;}
.grayBox.ac .colGroup [class*=col_] {margin-left:10px; margin-right: 10px}
.grayBox.ac .colGroup .btnGroup {display:inline-block; margin-right:10px; vertical-align:bottom;}
.grayBox .tableY.noLine {width: 1130px; margin: 0 -20px;}
.grayBox table.noLine tr:last-child td, .grayBox table.noLine tr.last td { padding-bottom: 0 !important; }
.grayBox table.noLine tr:first-child td {padding-top: 0 !important}
.grayBox.topLine { margin-top: 20px; }
.grayBox.topLine:after { content: ""; border-top: #dedede 1px solid; position: absolute; top: -20px; left: 0; right: 0; }

.grayBox .grayBoxMore { position: absolute; bottom: 30px; right: 20px; padding:0 24px 0 0; font-size:16px; color: #0063cc; }
.grayBox .grayBoxMore:after {content:''; position:absolute; top:50%; right:0; margin-top:-7px; width:16px; height:16px; background:url(../img/common/ico_toggle_notice.png) no-repeat 0 0; transition: transform 0.5s}
.grayBox .grayBoxMore.on:after {transform: rotate(180deg); }
.grayBox.extendBox {transition: max-height 0.3s ease-in-out; overflow: hidden; box-sizing: border-box;}
.grayBox.extendBox:not(.on) {padding-bottom: 10px;}
.grayBox.extendBox tr.hideLine {display: none;}
.grayBox.extendBox.on tr.hideLine {display: table-row; outline: none;}
.grayBox .tableY.noLine tbody tr:first-child td {padding-top: 0}

.grayBox.ac .colGroup [class*=col_] .calendar {width:47%; margin:0;}
.grayBox.ac .colGroup [class*=col_] .calendar + .calendar {margin-left:17px;}
.grayBox.ac .colGroup [class*=col_] .selectBtn {position:relative;}

/* blueBox */
.blueBox, .whiteBox {padding:20px 30px 26px; border:1px solid #0063cc; border-radius: 8px; box-shadow:5px 5px 5px rgba(0,0,0,0.07);}
.blueBox.pink {border-color: #ed0f0f}
.blueBox .topArea:before, .blueBox .topArea:after {content:""; display:table}
.blueBox .topArea:after {clear:both;}
.blueBox .topArea {margin-bottom:20px;}
.blueBox .topArea > em {float:left; color:#0063cc; font-size: 24px;}
.blueBox .topArea > .memNum { float: left; padding: 8px 0 0 10px; }
.blueBox .topArea > .memNum strong { padding-right: 10px; }
.blueBox .topArea > .memNum i { padding-left: 5px; }
.blueBox .topArea > .fr > .txt {margin-right: 10px}
.blueBox .topArea > .fr > strong {color:#d7006d; font-size: 28px;}
.blueBox .topArea > .fr > .unit {font-size: 24px;}
.blueBox .topArea > .fr > .unitR {font-size: 24px; margin-right: 10px; }
.blueBox .btnArea {margin-top: 5px; text-align: right;}

/* whiteBox */
.whiteBox {border-color: #666}
.whiteBox .tit{position: relative; display: block; margin-bottom:15px; font-size:16px; color:#252525; line-height:1;}
.whiteBox .tit.noLine > strong + a.links { font-size: 16px; margin-left: 10px; line-height: 1.6; }
.whiteBox.al .colGroup {margin-bottom:0;}
.whiteBox.al .colGroup [class*=col_] {margin-right:0;}


/* finishBox */
.finishBox {position:relative; padding:73px 30px 26px; border:1px solid #0063cc; border-radius: 8px; box-shadow:5px 5px 5px rgba(0,0,0,0.07); text-align: center; z-index: 1;}
.finishBox .topIco {position: absolute; top:-18px; left:50%; width:64px; height: 68px; margin-left:-32px; background: url('../img/common/bg_finish.png') no-repeat 0 0; overflow: hidden;}
.finishBox .detailBox {width:50%; margin:20px auto; padding:20px; background-color: #f8f8f8;}
.finishBox.fail {border-color:#ed0f0f;}
.finishBox.fail .topIco {background-position:0 bottom;}
.finishBox .txtL {margin-bottom: 10px;}
.finishBox .lineBox { padding: 0px 0 25px 0; margin: 0 20px 30px; border-bottom: #dedede 1px solid; border-top: none;}
.finishBox .txtL.bold {color:#333;}
.finishBox > .txt { color: #333; }

/* finish smile */
.finishBox .topIco.ani .eye {position:absolute; top:24px; left:20px; width: 5px; height: 7px; background: #0063cc; border-radius: 50%;}
.finishBox .topIco.ani .eye.right {left:39px}
.finishBox .topIco.ani .mouth {position: absolute; top: 43px; left: 33px; width: 6px; height: 3px; background: #0063cc; border-radius: 10px; transform: rotate(180deg); transform-origin: center left;}
.finishBox .topIco.ani .mouth.right {left: 31px; transform: rotate(0deg);}
.finishBox .topIco.ani2 .eye, .finishBox .topIco.ani2 .mouth {display: none}
.finishBox .topIco.ani2 .check {position: absolute; top: 31px; right: 19px; width:0; height: 4px; background: #0063cc; border-radius: 10px; transform: rotate(-46deg); transform-origin: center right;}
.finishBox .topIco.ani2 .check.right {width: 0; top: 43px; right:auto; left: 36px; transform: rotate(225deg); transform-origin: center left;}
.ie9 .finishBox .topIco > div, .ie8 .finishBox .topIco > div {display: none}
.ie9 .finishBox .topIco, .ie8 .finishBox .topIco {background: url('../img/common/bg_finish_ie.png') no-repeat 0 0;}
.ie9 .finishBox.fail .topIco, .ie8 .finishBox.fail .topIco {background: url('../img/common/bg_finish.png') no-repeat 0 bottom; }

.ani .mouth {animation: smileMouth 0.3s 1 0.2s ease-in-out forwards; -webkit-animation: smileMouth 0.3s 1 0.2s ease-in-out forwards;}
.ani .mouth.right {animation: smileMouthR 0.3s 1 0.2s ease-in-out forwards; -webkit-animation: smileMouthR 0.3s 1 0.2s ease-in-out forwards;}
.eyes .eye {animation: smileEye 0.25s 2 0.2s linear forwards; -webkit-animation: smileEye 0.25s 2 0.2s linear forwards;}
.topIco.reverse {animation: smileRotate 0.7s 1 cubic-bezier(0.755, 0.050, 0.855, 0.060) forwards; -webkit-animation: smileRotate 0.7s 1 cubic-bezier(0.755, 0.050, 0.855, 0.060) forwards;}
.topIco.ani2{animation: smileRotate2 0.7s 1 cubic-bezier(0.230, 1.000, 0.320, 1.000) forwards; -webkit-animation: smileRotate2 0.7s 1 cubic-bezier(0.230, 1.000, 0.320, 1.000) forwards;}
.topIco.checkAni .check {animation: smileCheck 0.25s 1 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000) forwards;-webkit-animation: smileCheck 0.25s 1 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000) forwards;}
.topIco.checkAni .check.right {animation: smileCheck2 0.4s 1 0.55s cubic-bezier(0.230, 1.000, 0.320, 1.000) forwards; -webkit-animation: smileCheck2 0.4s 1 0.55s cubic-bezier(0.230, 1.000, 0.320, 1.000) forwards;}

@keyframes smileEye {0%{transform:scale(1,1)}50%{transform:scale(1,0.1)}100%{transform:scale(1,1)}}
@keyframes smileMouth {100%{top:47px; width:16px; left: 32px; transform: rotate(211deg);}}
@keyframes smileMouthR {100%{top:47px; width:15px; left: 31px; transform: rotate(-33deg);}}
@keyframes smileRotate {100%{transform: rotateY(90deg);}}
@keyframes smileRotate2 {0%{transform: rotateY(90deg);}100%{transform: rotateY(180deg);}}
@keyframes smileCheck {100%{width:15px;}}
@keyframes smileCheck2 {100%{width:25px;}}
@-webkit-keyframes smileEye {0%{transform:scale(1,1)}50%{transform:scale(1,0.1)}100%{transform:scale(1,1)}}
@-webkit-keyframes smileMouth {100%{top:47px; width:16px; left: 32px; transform: rotate(211deg);}}
@-webkit-keyframes smileMouthR {100%{top:47px; width:15px; left: 31px; transform: rotate(-33deg);}}
@-webkit-keyframes smileRotate {100%{transform: rotateY(90deg);}}
@-webkit-keyframes smileRotate2 {0%{transform: rotateY(90deg);}100%{transform: rotateY(180deg);}}
@-webkit-keyframes smileCheck {100%{width:15px;}}
@-webkit-keyframes smileCheck2 {100%{width:25px;}}

/* cautionBox */
.cautionBox:before,.cautionBox:after {content:""; display:table}
.cautionBox:after {clear:both}
.cautionBox {padding:25px 30px; border:1px solid #d6006d; border-radius: 8px;}
.cautionBox .caution {float:left; height:39px; min-height: 60px; box-sizing: border-box; padding-top: 10px; padding-left:69px; margin:0 24px 0 0; background:url('../img/common/ico_caution.png') no-repeat 0; color:#d6006d; font-size: 22px; line-height: 39px;}
.cautionBox > .txtList {float: left;}
.cautionBox.msg {padding:25px 30px 28px; text-align: center;}
.cautionBox.msg .errorTxt {position:relative; display:inline-block; padding-left:29px; margin-top:0px; color:#333; font-size: 16px; text-shadow: none;}
.cautionBox.msg .errorTxt:before {top:3px; width:20px; height: 20px; background-color:#d6006d; font-size: 15px; line-height: 18px; font-weight: bold;}

/* tipBox */
.tipBox {position:relative; padding:20px; margin-top:18px; border: 1px solid #666; border-radius: 5px; background-color:#fff; box-shadow:5px 5px 5px rgba(0,0,0,0.07);}
.tipBox:before {content:''; position: absolute; top:-9px; left:20px; width:16px; height: 9px; background: url('../img/common/bg_tip_box.png') no-repeat 0; overflow: hidden;}

/* noticeBox */
.noticeBox {padding:30px; border:1px solid #e9e9e9; border-radius:5px; box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.07);}
.noticeBox .tit {position:relative; display:block; margin-bottom:15px; padding-bottom:17px; font-size:16px; color:#252525; line-height:1;}
.noticeBox .tit:after {content:''; position:absolute; bottom:0; left:0; right:0; border-top: 1px solid #666;}
.noticeBox .tit > strong {display:block; height: 18px;}
.noticeBox .tit > strong:before {content:''; display:inline-block; width:17px; height:17px; margin-top:-2px; margin-right:5px; vertical-align:middle; background:url(../img/common/ico_notice_blue.png) no-repeat 0 0;}
.noticeBox .tit.red {color: #d7006d !important;}
.noticeBox .tit.red > strong:before {width:20px; height:16px; background:url(../img/common/ico_notice_red.png) no-repeat 0 0;}
.noticeBox .tit.red:after {border-color:#d7006d;}
.noticeBox .tit > button {position:absolute; bottom:-10px; right:0; padding:0 24px 0 20px; font-size:16px; color:#0063cc; background-color:#fff; z-index:1; text-align:right;}
.noticeBox .tit > button:after {content:''; position:absolute; top:50%; right:0; margin-top:-7px; width:16px; height:16px; background:url(../img/common/ico_toggle_notice.png) no-repeat 0 0;}
.noticeBox .tit.noLine { padding-bottom: 0; }
.noticeBox .tit.noLine:after { display: none; }
.noticeBox .tit.noLine > strong { display: inline-block; }
.noticeBox .tit.noLine > strong + a.links { font-size: 16px; margin-left: 10px; }
.noticeBox .tit.noLine > strong:before { display: none; }
.noticeBox .cont {position:relative; /*overflow:hidden;*/}
.noticeBox .links {font-size:14px}
.noticeBox .infoBox { padding: 20px; }

/* noticeBox > msgBox */
.noticeBox.msgBox .tit { font-size: 24px; }
.noticeBox.msgBox .tit > strong:before { display: none; }
.noticeBox.msgBox .txtList > li { margin-top: 3px; }

.offGuide .caseBox {display: none;}
.caseBox {position:relative; max-width:1132px; padding:15px 20px 15px; margin:30px auto 10px; background-color:#e8f0f8; color:#003895; font-size: 16px; box-sizing: border-box; border-bottom: 2px solid #003591; font-weight: bold}
.windowPop .caseBox {max-width: none;}
.caseBox .txt {font-size: 16px}
/*.caseBox:after {content: ''; position: absolute; width:0px; height:0; bottom: 0; left:20px; border:10px solid #fff; border-left-color: rgba(0,0,0,0); border-right-color: rgba(0,0,0,0); border-top: none;}*/
.caseBox:after {content: ''; position: absolute; width:18px; height:10px; bottom: -2px; left:20px;background: url('../img/common/bg_casebox.png') no-repeat 0 0;}

.caseSlt {position:relative; float:right; min-width:650px; margin:20px 0; padding-left:97px; border-radius:40px 40px; background: #e8f0f8 url(../img/common/ico_caseguide.png) no-repeat 100% 50%; transition: border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s; box-sizing:border-box;}
.caseSlt.on {outline:rgba(0,0,0,0); border-color:#0068d4; box-shadow: 0 0px 6px rgba(0,104,212,0.9);}
.caseSlt:before, .caseSlt select {font-size:16px; color:#003895;}
.caseSlt:before {content:'CASE 선택'; position:absolute; top:12px; left:0; padding:0 10px 0 19px; color:#333; line-height:17px; border-right:1px solid #ccc;}
.caseSlt select {width:100%; border:none; background:none; height:40px; padding:0 45px 0 15px; line-height:38px; outline: rgba(0,0,0,0);}
.caseSlt select option {width:50%; background:#fff;}
.caseSlt ~ .titH2 {margin-top: 20px;}
.popCont .caseSlt { min-width: 50%; margin: 0 0 10px 0; }
.popCont .caseSlt + .removeData { clear: both; }

/* box layout */
[class*=Box] > .row.line{margin:0 -40px}
[class*=Box] > .row.line > [class*=col_]{margin-left:-1px; padding:0 40px; border-left:1px solid #dedede; border-right:1px solid #dedede; box-sizing:border-box}
[class*=Box] > .row.line > [class*=col_]:first-child{margin-left:0; border-left:0}
[class*=Box] > .row.line > [class*=col_]:last-child{border-right:0}

[class*=List] .row.line > [class*=col_]{margin-left:-1px; padding:0 40px; border-left:1px solid #dedede; border-right:1px solid #dedede; box-sizing:border-box}
[class*=List] .row.line > [class*=col_]:first-child{margin-left:0; border-left:0}
[class*=List] .row.line > [class*=col_]:last-child{border-right:0}
[class*=List] .row.line > [class*=col_].arr{min-height:85px; border-right:0; background:url(../img/wbiz/bg_shapebox_in_arr.png) no-repeat 100% 0}
[class*=List] .row.line > [class*=col_].arr + [class*=col_]{border-left:0}

[class*=Box].grayBox > .row.line{margin:0 -20px}
[class*=Box].grayBox > .row.line > [class*=col_]{margin-right:0; padding:0 20px}

[class*=Box] .labelArea { margin-bottom: 17px; }
[class*=Box] .labelArea span { display: inline-block; margin-right: 5px; color: #fff !important; border-radius: 5px; font-size: 14px; min-width: 62px; height: 23px; line-height: 23px; padding: 0 12px; box-sizing: border-box; }
[class*=Box] .labelArea span.green { background-color: #118000; }
[class*=Box] .labelArea span.orange { background-color: #dc6800; }
[class*=Box] .labelArea span.red { background-color: #a50000; }
[class*=Box] .labelArea span.disable { background-color: #f5f6f8 !important; color: #c3c4c6 !important; }
[class*=Box] .cont.line {padding-top:20px; border-top:1px solid #d2d2d2;}
[class*=Box] .singleInfo + .labelArea, [class*=Box] .cont.line, [class*=Box] .singleInfo + .tit {margin-top:20px;}
[class*=Box].pd50 .cont.line {margin-top:30px; padding-top:30px;}

[class*=Box] [class*='titH'].normal {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}

/* boxLine : 우선은 blueBox, whiteBox 간격에 맞춰져있습니다. */
[class*=Box] .boxLineT {position:relative; margin-top:26px; padding-top:26px;}
[class*=Box] .boxLineT:before {content:''; position:absolute; top:0; left:-30px; right:-30px; border-top:1px solid #d2d2d2;}

/* speakBox:말풍선박스 */
.speakBox{position:relative; margin:20px; padding:30px 20px; border:1px solid #0054ad; border-radius:8px; background-color:#fcfcfc}
.speakBox:before{content:''; position:absolute; bottom:-21px; right:54px; width:25px; height:21px; background: url(../img/common/bg_speack_box.png) no-repeat 0; overflow:hidden;}

/* infoBox */
.infoBox{position:relative; padding:40px; border-radius:8px 8px; background-color:#f8f8f8}
.infoBox.blue { background-color: #f2f9fe; }
.infoBox .icoTit{display:block; padding:135px 20px 20px; text-align:center; background:url('../img/common/ico_auto_rimit.png') no-repeat 50% 0}
.infoBox .icoTit span{display:inline-block; font-size:20px; color:#0063cc; }
.infoBox .icoTit.icoAutoPay{background:url('../img/common/ico_auto_pay.png') no-repeat 50% 0}
.infoBox > .brT {margin-top:20px; padding-top:20px; border-top:1px solid #e7e7e7;}
.infoBox.pd20 { padding: 20px; }
.infoBox.blueBg{background-color:#e4f1fe}
.infoBox.noRadius{border-radius:0}
.infoBoxList {margin-top:-20px; margin-left:-10px; margin-right:-10px;}
.infoBoxList:after {content:''; display:block; clear:both;}
.infoBoxList > * {float:left; width:50%; margin-top:20px; padding-left:10px; padding-right:10px; box-sizing:border-box;}
.infoBoxList > * > .inner {position:relative; padding:20px; border-radius:6px 6px; background-color:#f8f8f8}
.infoBoxList.div4 > * {width:25%;}
.infoBoxList.div3 > * {width:33.3%;}
.infoBoxList .brT {margin-top:20px; padding-top:15px; border-top:1px solid #dedede;}
.infoBoxList .linkGroup > .links:last-child {margin-right:0 !important;}
.infoBoxList .linkGroup > .links.blank:before { content: ''; top: 5px; left: auto; right: 0; }

/* infoBox + install : 보안설치 */
.infoBoxList.install li > .grayBox .btnArea{min-height:90px;}

.infoBox.irpInfo { padding: 20px 20px 30px; background-color: #f3f3f3; }
.infoBox .infoTit{ text-align: center; padding-bottom: 20px; font-size: 24px; }
.irpInfoNum { text-align: center; }
.irpInfoNum span { padding-left: 108px; background: url("../img/common/bg_irp_info1.png") no-repeat 0 50%; display: inline-block; height: 96px; line-height: 96px; font-size: 34px; color: #333; }
.irpInfoCenter { text-align: center; }
.irpInfoCenter dl { padding-left: 118px; background: url("../img/common/bg_irp_info2.png") no-repeat 0 50%; display: inline-block; min-height: 96px; text-align: left; }
.irpInfoCenter dt { padding: 10px 0 2px; font-size: 18px; color: #333; }
.irpInfoCenter dd { font-size: 16px; }

/* shapeBox */
.shapeBox {position:relative; padding:40px; border:1px solid #d2d2d2; border-radius:8px; box-shadow:4px 4px 4px rgba(0,0,0,0.07);}
.shapeBox:after {content:''; position:absolute; bottom:-11px; right:-11px; width:37px; height:48px; background:url(../img/common/bg_box_edge.png) no-repeat 0 0;}
.shapeBox [class*=titH].brB {margin-bottom:20px; padding-bottom:17px; border-bottom:1px solid #dedede;}
.shapeBox.blue{border:1px solid #0063cc; }
.shapeBox.blue:after{background:url(../img/common/bg_box_edge_blue.png) no-repeat 0 0;}
.shapeBox.black{border:1px solid #666; }
.shapeBox.black:after{background:url(../img/common/bg_box_edge_black.png) no-repeat 0 0;}
.shapeBox.gray{background-color:#fff}
.shapeBox.gray:after{background: url(../img/common/bg_box_edge_gray.png) no-repeat 0 0;}
.shapeBox.blackGray { border:1px solid #666; background-color: #fff; }
.shapeBox.blackGray:after { background: url(../img/common/bg_box_edge_black_gray.png) no-repeat 0 0;  }
.shapeBox.shadowNone:after {background: url(../img/common/bg_box_edge_shadow_none.png) no-repeat 0 0;}
.shapeBox.blue.shadowNone:after {background: url(../img/common/bg_box_edge_blue_shadow_none.png) no-repeat 0 0;}
.shapeBox.black.shadowNone:after {background: url(../img/common/bg_box_edge_black_shadow_none.png) no-repeat 0 0;}
.shapeBox.gray.shadowNone:after {background: url(../img/common/bg_box_edge_gray_shadow_none.png) no-repeat 0 0;}
.shapeBox.bg{background-color:#f8f8f8}
.shapeBox.bg.shadowNone:after{background: url(../img/common/bg_box_edge_bg_shadow_none.png) no-repeat 0 0;}
.shapeBox.bgBlue{border-color:transparent; background-color:#e8f7ff}
.shapeBox.bgBlue.shadowNone:after{background: url(../img/common/bg_box_edge_border_none.png) no-repeat 0 0;}
.shapeBox.sky{border:1px solid #9ed3f4;}
.shapeBox.sky.shadowNone:after{background: url(../img/common/bg_box_edge_sky_shadow_none.png) no-repeat 0 0;}
.shapeBox[class*=cntList] {overflow:visible !important;}
.shapeBox [class*=titH] {display:block;}
.shapeBox [class*=icoImg] {margin-top:-10px;}
.shapeBox .btnArea {margin-top:35px;}
.shapeBox.ac .txt, .shapeBox.ac .txtList {text-align:left;}
.shapeBox.bdNone:after {background:url(../img/common/bg_box_edge_border_none.png) no-repeat 0 0;}
.shapeBox.dotted {border:1px dotted #666;}

/* nodata */
.shapeBox .noData {padding:50px 0; text-align:center !important;}

/* single */
.shapeBox.single{display:block}
.shapeBox.single:after{clear:both}
.shapeBox.single [class*=icoImg]{position:absolute; top:50px; left:55px;}
.shapeBox.single .singleCont{display:block; padding-left:150px}
.shapeBox.single .btnArea{margin-top:25px}

/*=========================================== Tooltip ==============================================*/
.tip {position: relative; display: inline-block; vertical-align: middle;}
.tip + p {margin-left:10px; vertical-align: middle;}
.tipWrap {position: relative; display: inline-block; width: 20px; height: 20px; vertical-align: middle; text-align: left;}
.tipWrap .help {position:absolute; display: inline-block; top:-1px; width:20px; height: 20px; overflow: hidden; background: url('../img/common/ico_question.png') no-repeat 0 0;}

.row > [class*=col_] + .tip .tipWrap .help {top:3px}

/* helpPoint 클래스 추가 191205(오픈뱅킹) */
.tipWrap.multiple {width:auto; text-align: right;}
.tipWrap.multiple .help {width:auto; height:auto; white-space: nowrap; background: rgba(0,0,0,0); }
.tipWrap.multiple .help > button {margin-top:-6px;}
.tipWrap.multiple .help:hover > button {background-position: 0 center;}
.tipWrap.multiple .helpPoint:hover > button {background-position: 0 bottom;}
.tipWrap.multiple .help {position: static;}

body:not(.isMobile) .tipWrap:hover .help, .tipWrap .help:focus, .tipWrap.on .help {background-position: 0 center; }
body:not(.isMobile) .tipWrap:hover .helpPoint, .tipWrap .helpPoint:focus, .tipWrap.on .helpPoint {background-position: 0 bottom; }
.tipWrap.on .tooltip {display:block; opacity:1; outline:rgba(0,0,0,0);}
.tipWrap.on .icoBtnClose {display:block;}
.tip [class*=col_] {float: none;}

.tooltip {display:none; position:absolute; top:50%; left:0; width:auto; min-width:300px; padding:15px; margin-left:31px; background-color:#fff; border: 1px solid #666; text-align:left; font-size:14px; transition:opacity .15s linear; box-sizing: border-box; z-index:500; opacity: 0; border-radius: 5px; box-shadow:  3px 3px 5px rgba(0,0,0,0.15);}
.tooltip.in {display:block; opacity:1;}
.tooltip > .tit {display:block; margin-bottom:10px; border-radius:5px 5px 0 0; line-height:1;}
.tooltip .cont {padding-right: 25px; font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif;}
.tooltip .cont li {/*font-size:12px;*/color: #666; }
.tooltip.large .tit {margin-bottom:16px; font-size:26px; font-weight:normal}
.tooltip.large .cont {font-size:16px; line-height:1.6}
.tooltip .icoBtnClose {display:none;}
.icoBtnClose:hover, .icoBtnClose:focus {background-color: #fff}
.icoBtnClose {position: absolute; top: 10px; right: 10px; width: 16px; height: 16px; border: none; background: url('../img/common/btn_close_tip.png') no-repeat 0 0;}
.tooltip .arrow {position: absolute; overflow: hidden; border-width: 0; width: 8px; height: 22px; top: 50%; left: -8px; margin-top: -13px;}
.tooltip .arrow:after {content: ""; display: block; position: absolute; width: 12px; height: 12px; left: 3px; bottom: 3px; text-align: center; background: #fff; transform: rotate(45deg); border: 1px solid #666;}

.left .tooltip {margin-right:auto; margin-left: -12px;}
.left .tooltip .arrow {width:9px; height:14px; top:50%; left:auto; right:-8px; margin-top:-9px}
.left .tooltip .arrow:after {content:""; display:block; width:11px; height:11px; left:auto; right:2px; bottom:0;}

.top .tooltip {top: auto; bottom: 34px; margin-left: auto; margin-right: auto; }
.top .tooltip .arrow {width: 16px; height: 9px; left: 50%; top: auto; bottom: -9px; margin-left: 0px;}
.top .tooltip .arrow:after{content: ""; display: block; width: 11px; height: 11px; bottom: 3px;}

.bottom .tooltip {left:-50%; top:32px; margin-left:10px; margin-right: auto}
.bottom .tooltip .arrow {width: 20px; height: 9px; left: 50%; right: 0; top: 0; margin-top: -9px; margin-left: -8px;}
.bottom .tooltip .arrow:after {content: ""; display: block; width: 11px; height: 11px; top: 3px; left: 1px;}

/* badge */
.badge {display:inline-block; position:relative; padding:0 5px; margin-right:8px; border:1px solid #999999; border-radius:2px; background-color:#e6e9ee; font-size:14px; color:#666;}
/*.badge:after {content: ''; position: absolute; width: 5px; height: 7px; top: 50%; margin-top: -5px; right: -5px; background: url('../img/common/bg_badge_gray.png') no-repeat 0;}*/
.badge.red{color:#fff !important; border-color:#ed0f0f; background-color:#ed0f0f;}
/*.badge.red:after {content: ''; position: absolute; width: 0px; height: 0; top: 50%; margin-top: -5px; right: -5px; border: 4px solid #ed0f0f; border-top-color: rgba(0,0,0,0); border-bottom-color: rgba(0,0,0,0); border-right: none; box-shadow: none}*/
.badge.white{color:#666; background-color:#fff;}
.badge.violet{color:#fff !important; border-color:#734df2; background-color:#734df2;}
.badge.blue{border: 1px solid #0063cc; color: #0063cc; background-color:#fff;}
.badge.green{border: 1px solid #118000; color: #118000; background-color:#fff;}
.badge.redB{border: 1px solid #ed0f0f; color: #ed0f0f; background-color:#fff;}

/*=========================================== Popup ==============================================*/
/* popup */
body.popOn {overflow: hidden;}
body.popOn .wrapper {overflow: hidden;}
body.windowPop {overflow: auto; min-width: 0; background: #fff}
body.windowPop.popOn {overflow: hidden;}
body.hasScroll.windowPop.popOn, body.hasScroll.windowPop.popOn .popCont > .btnArea {padding-right: 17px; background: #fff}
.popCont .titArea {margin-top:30px;}
.popCont .titArea:first-of-type {margin-top:0px;}
body.windowPop .scroll > table:not(.mt30):first-of-type, body.windowPop .scroll > .titArea:first-of-type {margin-top:0 !important}
body.windowPop .popCont {box-shadow: none; border-radius: 0;}
body.windowPop .popCont > .btnArea, body.windowPop form > .btnArea {padding:30px 0;}
body.windowPop.hasPrint {overflow: auto}
body.windowPop.hasPrint .popCont .scroll {height: auto !important;}

/* window 팝업 신규 */
body.windowPop .popCont .scroll {overflow: visible; padding:94px 30px 101px 30px}
body.windowPop .popHeader {position: fixed; top: 0; left:0; right:0; z-index: 1000}
body.windowPop .popCont > .btnArea, body.windowPop form > .btnArea  {position: fixed; bottom: 0; left:-20px; right:-20px; margin:0; background-color: #fff; z-index: 1000}
body.windowPop section {margin: 0 auto 50px;}
/* 윈팝업속 레이어 */
body.windowPop .popWrap.nowOpen .popCont .scroll {overflow: auto; padding-top:0; padding-bottom: 0px;}
body.windowPop .popWrap.nowOpen .popCont > .btnArea {position: static;}

.popWrap {display:none; position: fixed; top:0; left: 0; right:0; bottom:0; width:100%; height:100%; overflow:auto; background: rgba(0,0,0,0.4); z-index: 700; box-sizing: border-box; outline:rgba(0,0,0,0.5)}
.popWrap.noBG {background: none;}
.popWrap.loading .popCont > * {display:none;}
.popContain {position:relative; display:table; width:1132px; height:100%; padding:30px 0; margin:0 auto; box-sizing: border-box; text-align: center; z-index: 10; table-layout: fixed;}

.popHeader {min-height: 64px; padding: 11px 30px; margin-bottom:30px; background: #001f5b; box-sizing: border-box;}
.popHeader:after, .popHeader:before {content: " "; display: table;}
.popHeader:after {clear: both;}
.popHeader .tit {float:left; font-size: 28px; color:#fff;}
.popHeader .popBtnArea {float:right; margin-top: 6px;}
.popHeader .popBtnPrint, .popHeader .icoBtnPrint {background: url(../img/common/btn_pop_print.png) no-repeat center; border:none;}
.popHeader .popBtnClose {background: url(../img/common/btn_pop_close.png) no-repeat center;}
.popHeader [class*=popBtn]:not(.popBtnArea), .popHeader .icoBtnPrint {display: inline-block; width:30px; height: 30px; margin-left: 6px; vertical-align: middle;}

.popup {display:table-cell; height:100%; margin: 0 auto; z-index:10; box-sizing:border-box; vertical-align: middle;}
.popup.fixed {position:fixed; top:50%; }
.popup .colGroup > .tit{min-width:0}
.ie8 .popWrap, .ie7 .popWrap {background: url(../img/common/bg_ie_dim.png) repeat 0 0; }

.popCont {position:relative; float:none !important; /*max-width:1132px;*/ padding:0; overflow: hidden; margin:0 auto; background: #fff; box-sizing:border-box; text-align: left; z-index: 10; border-radius: 5px; box-shadow: 5px 5px 5px rgba(0,0,0,0.1)}
.popCont > .scroll {padding:0 30px 0; margin-bottom: 30px; overflow: auto; box-sizing: border-box;}
.popCont > .noScroll {padding:0 30px 0; margin-bottom: 30px; overflow: auto; box-sizing: border-box;} 
.popCont > .scroll.on:focus {outline-style: dotted; outline-color: #666; outline-width: 1px;}
.popCont > .scroll.on {padding-right: 13px}
.popCont > .btnArea {padding-top:20px; margin:0 30px; padding-bottom:30px; border-top:1px solid #dedede; text-align: center;} 
/* .popCont > .btnArea, .popCont form > .btnArea */
.popCont > .btnArea.bdNone {padding-top: 0 !important}
.popCont .sticky {padding: 0 30px;}
.popCont .sticky.grayBox {padding-top: 30px; padding-bottom: 20px; margin: 0 30px 20px;}
.popCont > .scroll .listScroll {max-height: 400px;}
.popCont .grayBox .tableY.noLine {width:100%; margin:0 auto}
.popCont .noticeBox {margin-bottom:10px;}
.popCont .popFinish .detailBox {margin-bottom: 0}
.popCont .tab {margin-bottom: 20px;}

/* popup loading */
.popup .loadingWrap {display:table !important; width:100%; padding:40px 0; box-sizing: border-box;}
.popup .loadingWrap .loadingArea {display:table-cell; vertical-align:middle; text-align: center;}
.popup .loadingWrap .loading {display:block; width:40px; height:40px; background: url('../img/common/ico_loading.gif') no-repeat 0 0; margin:auto}
.popup .loadingWrap ~ div {display: none} 

/* alert */
.alert .msg {text-align: center;}
.alert .popup .popCont {padding: 50px 20px 100px; min-height: 200px;}
.alert .popup .popCont .btnArea {position:absolute;left:20px; right:20px; bottom:0; margin:0; padding:20px 0;}
.alert .popup .popBtnClose {position:absolute; top:10px; right:10px; background: url(../img/common/btn_alert_close.png) no-repeat center; display: none}
.nowAlert {z-index: 1201}

/* 20.08.19 chorme 업데이트 개선*/
.alert .popup .popCont .btnArea > * {margin-left:8px;}
.alert .popup .popCont .btnArea > *:first-of-type {margin-left:0;}

/* 윈도우 팝업속 알럿 */
body.windowPop .popWrap .popHeader {position: relative; top:0; }
body.windowPop .popWrap .popCont .btnArea {position: absolute; bottom:0; }
body.windowPop .popWrap .popCont .scroll .btnArea {position: static; }
body.windowPop .popWrap .popContain {width: 100%;}

/* confirm 및 결과  */
.popFinish {position:relative; text-align:center;}
.popFinish .resultIco {position: relative; width:48px; height:50px; margin:0 auto 25px; background:url('../img/common/ico_pop_success.png') no-repeat 0 0;}
.popFinish .resultIco.fail {background:url('../img/common/ico_pop_fail.png') no-repeat 0 0;}
.popFinish .detailBox {width:100%; margin:15px auto 0; padding:25px 15px; font-size:18px; background-color:#f8f8f8; box-sizing:border-box; margin-bottom:-10px;}
.popFinish .detailBox .bold {color:#333;}
.popFinish .detailBox .txt + .txtM {margin-top:5px;}

/* 오늘 하루 보이지 않기 */
.popCont .popOption {margin:20px -30px -30px -30px !important; padding:20px 30px; background:#eee; text-align:left; overflow:hidden;}
.popCont .popOption:after {content:''; display:table; clear:both;}
body.windowPop .popCont .popOption {margin:30px 0 -30px 0 !important; padding:20px 50px;}

/* 동영상 팝업 */
.popWrap.popMovie{background: rgba(0,0,0,0.7);}
.popWrap.popMovie .popBtnClose{display:inline-block; position:absolute; top:30px; right:-71px; width:51px; height:51px; background:url(../img/common/btn_pop_movie_close.png) no-repeat 0 0}
.popWrap.popMovie .popCont{border-radius:0; overflow:visible}
.popWrap.popMovie .playerArea{width:100%; height:auto}
.popWrap.popMovie .txtArea{padding:20px 30px; height:85px; box-sizing:border-box; color:#999; background:#000; overflow-x:hidden; overflow-y:auto}
.popWrap.popMovie .txtArea:focus {outline: 1px dotted #fff;}
.popMovie.comment {display: none;}

/* 보이스피싱 피해주의 */
.reportBox { box-sizing: border-box; padding: 5px 0 5px 80px; margin-top: 20px; background: url("../img/common/bg_reportBox.png") no-repeat 0 50%; }
/*=========================================== Progress ==============================================*/
.progress {margin-bottom:20px; text-align: right;}
.progress ol {counter-reset: section; letter-spacing: -2em;}
.progress li {display: inline-block; height:40px; width:40px; margin-left:8px; background-color: #f5f5f5; border-radius:20px; letter-spacing: 0; box-sizing: border-box; color:#808080; font-size:18px; line-height: 39px; text-align: center;}
.progress li:first-child {margin-left: 0}
.progress li:before {width:auto; height:auto; top:0; left:0; counter-increment:section; content:counter(section);}
.progress li.on {width:auto; padding:0 20px; background-color: #0054ad; color:#fff; box-shadow: 6px 6px 8px rgba(0,0,0,0.15)}
.progress li.finish {color:#333;}
.progress li.on:before {content:counter(section)". ";}
.progress ~ .finishBox {margin-top:60px;}
.progress.hasTab {margin-top: -5px;}

/*=========================================== 아코디언 ==============================================*/
/* 아코디언 리스트 기본형 */
.accoList { border-top: 2px solid #666; border-bottom: 1px solid #dedede; }
.accoList .accoWrap { font-size: 16px; color: #666; border-top: 1px solid #dedede; }
.accoList .accoWrap:first-child { border-top: none; }
.accoList .accoWrap .accTopArea { padding: 20px; position: relative; }
.accoList .accoWrap .accTopArea .accoBtn { position: absolute; top: 50%; right: 20px; margin-top: -19px; display: inline-block; width: 38px; height: 38px; background: url(../img/common/btn_acco_off.png) no-repeat center center; transition: transform 0.5s; }
.accoList .accoWrap .accoContents { padding: 20px; border-top: #dedede 1px solid; background-color: #f8f8f8; }
.accoContents {display: none;}
.accoList .accoWrap.on .accoTit.click, .accoList .accoTit.click:hover {color:#0063cc;}
.accoContents table.tableX td, .accoContents table.tableY tbody td {background-color:#fff;}
.accoWrap.on .accoBtn.def {transform: rotate(180deg); background: url(../img/common/btn_acco_def.png) no-repeat center center;}
.s0 {transition: transform 0s !important}

/*=========================================== 버튼형 아코디언 ==============================================*/
/* 기본형 */
.moreArea {position:relative;  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; }

.moreArea.bgNone .hiddenMemo {margin-top:0 !important; margin-bottom:20px; padding:16px; background-color:#f8f8f8;}
.moreArea.on .hiddenMemo {display:none;}

/* 버튼이 하단에 고정되는 유형 */
.moreArea.bottom {position:relative; padding-bottom:37px;}
.moreArea.bottom.on {padding-bottom:57px;}
.moreArea.bottom > .accoBtn {position:absolute; left:0; bottom:17px; width:100%; font-size:16px; color:#0063cc; text-align:center;}
.moreArea.bottom > .accoBtn .close, 
.moreArea.bottom.on > .accoBtn .more {display:none;}
.moreArea.bottom > .accoBtn .more, 
.moreArea.bottom.on  > .accoBtn .close {display:block;}
.moreArea.bottom > .accoBtn > span:after {content:''; display:inline-block; width:5px; height:9px; margin:-2px 0 0 10px; vertical-align:middle; background:url(../img/common/ico_go2.png) no-repeat 0 0; transform:rotate(90deg);}
.moreArea.bottom.on > .accoBtn > span:after {transform:rotate(-90deg);}
.moreArea.bottom > .accoContents > *:first-of-type {margin-top:0 !important;}
.popFinish .moreArea.bottom {margin-top:17px;}
.popFinish .moreArea.bottom > [class*=txt] {margin-top:-5px;}

/* 아코디언 안에 아코디언 재정의 */
.moreArea .accoList.inAcco {margin:20px -15px -25px -15px; border:none; text-align:left;}
.moreArea .accoList.inAcco .accoWrap {border-top:1px solid #ccc;}
.moreArea .accoList.inAcco .accoWrap .accTopArea {padding-top:16px; padding-bottom:17px; padding-right:55px; word-break:break-all;}
.moreArea .accoList.inAcco .accoWrap .accoContents {padding-top:0; padding-left:38px; border-top:none;}
.moreArea .accoList.inAcco .accoWrap .accoContents .c333 + .txtM {margin-top:5px;}
.moreArea.on .accoList.inAcco .accoWrap.on, .moreArea.on .accoList.inAcco .accoWrap.on .accoContents {background-color:#f2f2f2;}
.moreArea.on .accoList.inAcco .accoBtn {background: url(../img/common/btn_acco_off.png) no-repeat center center; transform: rotate(0deg);}
.moreArea.on .accoList.inAcco .accoWrap.on .accoBtn {background: url(../img/common/btn_acco_def.png) no-repeat center center; transform: rotate(180deg);}

/*=========================================== dropMenu ==============================================*/
.btnGroup .dropMenuWrap, table .dropMenuWrap, [class*=Box] .dropMenuWrap {position:relative; display: inline-block;}
.dropMenuWrap.on .dropMenuBox {display: block; opacity: 1}
.dropMenuBox {display:none; position: absolute; margin-top:10px; padding:9px 0 2px; border:1px solid #999; border-radius: 4px; box-sizing: border-box; background-color: #fff; z-index: 50; transition:opacity .15s linear;}
.dropMenuBox:before {content: ''; position: absolute; top:-8px; left:50%; margin-left:-7px; width:14px; height: 8px; background: url('../img/common/bg_drop_menu.png') no-repeat 0;}
.dropMenuBox li > * {display: block; padding: 10px 15px; text-align: left; color:#666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.dropMenuBox li > *:hover, .dropMenuBox li > *:focus {background-color: #f2f2f2}
.dropMenuBox .menu {position:relative; padding-bottom: 10px;}
.dropMenuBox .menu:after {content: ''; position:absolute; left:18px; right:18px; bottom:0px; border-bottom: 1px solid #e7e7e7;}
.dropMenuBox .close {display: block; padding: 5px 5px 5px 20px; margin: 2px auto 0; background: url(../img/common/btn_close_dropmenu.png) no-repeat 0; text-align: center; font-size: 14px; color: #666;}
.dropMenuBox .close:hover {color:#0063cc;}
.windowPop .scroll .dropMenuWrap.on .dropMenuBox {z-index:1001;}

.dropMenuWrap.al .dropMenuBox {left:0; margin:8px 0 0 0 !important; padding:13px 33px 13px 13px;}
.dropMenuWrap.al .dropMenuBox:before {display:none;}
.dropMenuWrap.al.on:before {content: ''; position: absolute; bottom:-9px; left:50%; z-index:51; margin-left:-7px; width:14px; height: 8px; background: url('../img/common/bg_drop_menu.png') no-repeat 0;}
.dropMenuWrap.al .dropMenuBox li > * {padding:0 !important; white-space:normal;}
.dropMenuWrap.al .dropMenuBox li > *:hover, .dropMenuWrap.al .dropMenuBox li > *:focus {background:none !important;}
.dropMenuWrap.al .dropMenuBox .close {position:absolute; top:10px; right:10px; width:16px; height:16px; margin:0; padding:0; background:url('../img/common/btn_close_tip.png') no-repeat 0 0;}
.dropMenuWrap.al .dropMenuBox.col_4 {min-width:383px !important;}
.dropMenuWrap.al .dropMenuBox.shadow {box-shadow:3px 3px 5px rgba(0,0,0,0.15);}

.dropMenuBox .menu li a { position: relative; }
.dropMenuBox .doc { padding-left: 35px; }
.dropMenuBox .doc:before { content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -20px center;  position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .xls { padding-left: 35px; }
.dropMenuBox .xls:before { content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -40px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .pdf { padding-left: 35px; }
.dropMenuBox .pdf:before{ content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -60px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .hwp { padding-left: 35px; }
.dropMenuBox .hwp:before{ content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -80px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .zip { padding-left: 35px; }
.dropMenuBox .zip:before{ content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -100px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .jpg { padding-left: 35px; }
.dropMenuBox .jpg:before{ content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -122px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }
.dropMenuBox .ppt { padding-left: 35px; }
.dropMenuBox .ppt:before{ content: ''; display: block; width: 20px; height: 24px; background: url(../img/common/ico_file.png) no-repeat -142px center; position: absolute; top: 9px; left: 9px; overflow: hidden; box-sizing: border-box; }

/*=========================================== gridTable ==============================================*/
.gridWrap .gridItemBox {margin-top:3px; border-top: 1px solid #dedede;}
.gridWrap .gridItemBox .txtItem > li { color: #333; font-size: 18px; }
.gridWrap .gridTop .gridItemBox {margin-top:0; border-top:0;}
.gridWrap .gridItemBox > li {display:table; width:100%; padding:15px 20px; font-size:16px; color:#666; border-bottom:1px solid #999; background-color:#f8f8f8; box-sizing:border-box;}
.gridWrap .gridTop .gridItemBox > li:last-child {border-bottom:0;}
.gridWrap .gridItemBox > li.bgNone {border-bottom:1px solid #dedede;}
.gridWrap .gridItemBox > li .gridItem {display:table-cell; /*width:50%;*/ max-width:100%; font-size:0;}
.gridWrap .gridItemBox > li .gridItem:first-child:last-child {/*width:100%;*/}
.gridWrap .gridItemBox > li .gridItem > * {font-size:16px;}
.gridWrap .gridItemBox > li .col_w > .ipt {width:85px;}
.gridWrap .gridItem [class*=col_] {margin-right:20px; line-height:1;}
.gridWrap .gridItem .label {color:#333;}
.gridWrap .gridItem [class*=col_].dash + [class*=col_]:before {content:'~'; position:absolute; top:0; left:-20px; width:20px; display:block; text-align:center; color:#666; line-height:38px;}
.gridWrap .gridItemBox [class^=btn] {font-size:16px; line-height:38px;}
.gridWrap .gridItemBox .gridItem > [class^=btn] {margin-right:10px;}
.gridWrap .gridItemBox .gridItem.ar > [class^=btn] {margin-left:10px; margin-right:0;}
.gridWrap .gridArea > img {max-width:100%;}
[class*=GridMain] [class*=GMHead] input[type="checkbox"], [class*=GridMain] [class*=DLGHead] input[type="checkbox"] {position:static !important; opacity:1 !important; z-index: 1 !important;  vertical-align: baseline !important;}
[class*=GridMain] [class*=GMHead] input[type="checkbox"]:focus, [class*=GridMain] [class*=DLGHead] input[type="checkbox"]:focus {outline: 1px dotted #0063cc !important;}
.isIE .checkTable [class*=DLGHeadMid] table > tbody > tr:first-child + tr > td[class*=DLGCellHeader] input[type='checkbox'] {position:absolute !important; opacity:1 !important;}
.isIE .checkTable [class*=DLGHeadMid] table > tbody > tr:first-child + tr > td[class*=DLGCellHeader] input[type='checkbox']:focus,
.isIE .checkTable [class*=DLGHeadMid] table > tbody > tr:first-child + tr > td[class*=DLGCellHeader] input[type='checkbox']:checked:focus {opacity:1 !important;}

/*========================================= bbs ==============================================*/
/* 목록 - 일반 */
table.bbs {table-layout: fixed; width:100%;}
table.bbs thead th {padding:16px 10px; border-top:2px solid #666; border-bottom:1px solid #dedede; background-color:#f5f7fb; text-align: center; color:#333; vertical-align: middle;}
table.bbs td {padding:20px 10px; border-bottom: 1px solid #dedede; text-align: center;}
table.bbs td .bbsBtn {vertical-align:middle;}
table.vm tbody td {vertical-align: middle;}

/* 목록 - 리스트 */
ul.bbs {border-top: 2px solid #666666;}
.bbs > li {padding: 30px; border-bottom: 1px solid #dedede; }
.bbs:not(.faq) > li .links {margin-bottom:5px; font-size: 20px; color:#333}
.bbs > li .links em {margin-right: 8px;}
.bbs > li .links span {max-width:95%;} 
.bbs > li .cont {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient:vertical; word-wrap:break-word; max-height: 50px; -webkit-line-clamp:2; }
.bbs .subInfo {margin-top: 25px; font-size: 16px;}
.bbs .subInfo > * {display: inline-block; vertical-align: middle;}
.bbs .subInfo .txtItem {margin-right: 10px;}

.bbs .imgWrap {position: relative;display:inline-block; width:26%; max-width:282px; height:auto; background-color:#f2f4f8; overflow: hidden; padding:20px; box-sizing: border-box;}
.bbs .imgWrap:before {content: ''; display:block; padding-top: 75%}
.bbs .imgWrap img {position:absolute; top:20px; left:20px; right: 20px; bottom:20px; width: 240px; height: 180px;}
.bbs .imgWrap, .bbs .contWrap {display:inline-block; vertical-align: top;}
.bbs li > .imgWrap:before {content: none;}
.bbs li > .imgWrap {max-height: 180px; padding-bottom:0; overflow: hidden; border-bottom: 20px solid #f2f4f8;}
.bbs li > .imgWrap img {position: static; height: auto}

.bbs .contWrap {width:100%; /* max-width:100%;*/}/*내용없을때 말줄임 되는 현상 수정*/
.bbs .imgWrap ~ .contWrap {width:73%; padding-left:30px; padding-top:10px; box-sizing: border-box;}
.bbs .imgWrap ~ .contWrap .cont { max-height: 75px; -webkit-line-clamp:2; }
/*.bbs .links .new { margin-bottom: 3px; }*/

/* 목록 - 갤러리형 */
.bbs.grid {border-top:2px solid #666; border-bottom: 1px solid #dedede; padding:0 12px 5px 11px; }
.bbs.grid:before, .bbs.grid:after {content: ''; display: block;}
.bbs.grid:after {clear: both;}
.bbs.grid > li {float:left; width:25%; padding: 30px 18px 30px 19px; border:none; box-sizing: border-box;}
.bbs.grid > li > a {display: block;}
.bbs.grid > li > a:hover img, .bbs.grid > li > a:focus img, .bbs.grid > li > a:focus .imgBG, .bbs.grid > li > a:hover .imgBG {transform:scale(1.2);}
.bbs.grid .imgWrap {width:100%; max-width:270px; padding:0}
.bbs.grid .imgWrap:before {padding-top: 66.6666666666666666666666%}
.bbs.grid .imgWrap img, .bbs.grid .imgWrap .imgBG {top:0px; left:0px; right: 0px; bottom:0px; width: 100%; height: auto; transition: transform ease-in-out 0.25s; }
.bbs.grid .imgWrap .imgBG {position: absolute; height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat;}
.bbs.grid .contWrap {padding-left: 0;}
.bbs.grid .imgWrap ~ .contWrap {width: auto}
.bbs.grid > li > a:hover .links, .bbs.grid > li > a:focus .links, .bbs.grid > li.on > a .links {color: #0063cc; text-decoration: underline;}
.bbs.grid > li .links {height: 110px; -webkit-line-clamp:3; display: -webkit-box; -webkit-box-orient:vertical; word-wrap:break-word; white-space: normal; text-shadow: none; font-size: 16px; overflow: hidden;}
.bbs.grid > li .links em {display: block; margin: 6px 0 8px 0; font-size: 14px}
.bbs.grid .subInfo {margin: 11px 0 -5px 0;}
.bbs.video .imgWrap:before {padding-top: 56.25%}
.bbs.video .imgWrap:after, .bbs > li.video .imgWrap:after {content: ''; position: absolute; top:0; left:0; right:0; bottom:0; z-index: 10; background: url(../img/common/ico_video.png) no-repeat center center; opacity: 0.5; transition: all ease-in-out 0.25s}
.bbs.video > li > a:hover .imgWrap:after, .bbs > li.video > a:hover .imgWrap:after,
.bbs.video > li > a:focus .imgWrap:after, .bbs > li.video > a:focus .imgWrap:after {opacity: 1;}
.bbs.grid > li .links.hAuto { height: auto; }
.bbs.grid.radio > li .links {height: 75px;}
video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important}

/* 목록 - 갤러리형(이벤트) */
.event pre {font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; white-space:pre-line;}
.evtShape {position:relative; display:inline-block; padding-bottom:10px; color:#fff; line-height:1; box-sizing:border-box;}
.evtShape:before, .evtShape:after {content:''; position:absolute; bottom:0; left:0; right:6px; height:10px; background:#4b4e68;}
.evtShape:after {left:auto; right:0; width:6px; background:url(../img/common/bg_box_edge_bg_darkgray_smallest.png) no-repeat 100% 100%;}
.evtShape > span {display:table-cell; min-width:50px; padding:10px 10px 0 10px; box-sizing:border-box; text-align:center; vertical-align:middle; background:#4b4e68;}
.bbs.grid.event {position:relative; margin:0 -10px; padding:22px 0 20px 0; border-top:none;}
.bbs.grid.event:before {content:''; position:absolute; top:0; left:10px; right:10px; border-top:2px solid #666;}
.bbs.grid.event > li {width:384px; padding:10px;}
.bbs.grid.event > li > a {position:relative;}
.bbs.grid.event .evtShape {position:absolute; top:10px; left:10px; z-index:10; font-size:16px;}
.bbs.grid.event .evtShape > span {height:40px;}
.bbs.grid.event .evtShape:before, .bbs.grid.event .evtShape > span {background:#d6006d;}
.bbs.grid.event .evtShape:after {background:url(../img/common/bg_box_edge_bg_red_smallest.png) no-repeat 100% 100%;}
.bbs.grid.event .imgWrap {max-width:100%; max-height:180px; background:#d2d2d2 url(../img/common/bg_bbs_event.png) no-repeat 50% 50%; overflow:hidden;border: #d2d2d2 1px solid;}
.bbs.grid.event .imgWrap:before {padding-top:180px;}
.bbs.grid.event .imgWrap img {height:180px;}
.bbs.grid.event .contWrap {width:100%; padding:25px 30px 35px 30px; box-sizing:border-box;}
.bbs.grid.event .contWrap:before {content:''; position:absolute; top:180px; bottom:0; left:0; right:0; border:1px solid #d2d2d2; border-top:none; border-radius:8px; border-top-left-radius:0; border-top-right-radius:0;}
.bbs.grid.event .contWrap:after {content:''; position:absolute; bottom:0px; right:0px; width:27px; height:38px; background:url(../img/common/bg_box_edge_shadow_none.png) no-repeat 0 0;}
.bbs.grid.event > li .links {width:auto; height:60px; -ms-line-clamp:2; -webkit-line-clamp:2; font-size:20px; line-height:1.5em;}
.bbs.grid.event > li > a img, .bbs.grid.event > li > a:hover img, .bbs.grid.event > li > a:focus img {/*transition:initial;*/ transform:none;}
.bbs.grid.event > li > a:hover .links, .bbs.grid > li > a:focus .links {text-decoration: none;}
.bbs.grid.event > li > a:hover .contWrap:before, .bbs.grid.event > li > a:focus .contWrap:before {top:0px; border:2px solid #0063cc;}
.bbs.grid.event > li > a:hover .contWrap:after, .bbs.grid.event > li > a:focus .contWrap:after {background:url(../img/common/bg_box_edge_blue_2px_shadow_none.png) no-repeat 0 0 !important;}
.bbs.grid.event .subInfo {height:77px; padding-top:1px; overflow:hidden;}
.bbs.grid.event .subInfo .txtList.noIcon > li {display:table; width:100%; box-sizing:border-box; line-height:1.5;}
.bbs.grid.event .subInfo .txtList.noIcon > li strong, .bbs.grid.event .subInfo .txtList.noIcon > li pre {display:table-cell; vertical-align:top; font-size:14px;}
.bbs.grid.event .subInfo .txtList.noIcon > li strong {width:35px; color:#333;}
.bbs.grid.event .subInfo .txtList.noIcon > li pre.date {white-space:normal;}
.bbs.grid.event .subInfo .txtList.noIcon > li pre.date .badge {margin-top:-1px;}
.bbs.grid.event .subInfo .txtList.noIcon > li pre:not(.date) {display:inline-block; overflow:hidden; margin-left:5px; width:284px; text-overflow:ellipsis; white-space:nowrap;}
.bbs.grid.event > .disable > a:hover .contWrap:before, .bbs.grid.event > .disable > a:focus .contWrap:before {top:0px; border:1px solid #d2d2d2;}
.bbs.grid.event > .disable > a:hover .contWrap:after, .bbs.grid.event > .disable > a:focus .contWrap:after {background:url(../img/common/bg_box_edge_shadow_none.png) no-repeat 0 0 !important;}
.bbs.grid.event > .disable > a:hover .links, .bbs.grid > .disable > a:focus .links {color:#333;}
.bbs.grid.event > .disable > a {opacity:0.5; cursor:default;}


/* 목록 - 갤러리형 (사이트링크) */
.bbs.grid.siteLink { padding-bottom: 30px; letter-spacing: -2em; }
.bbs.grid.siteLink .imgWrap {display:table; box-sizing: border-box; padding: 10px 29px; width: 240px; height: 110px; text-align: center; background-color: #fff; border: #d2d2d2 1px solid; border-radius: 5px;}
.bbs.grid.siteLink .imgWrap > .tblCell {display: table-cell; vertical-align: middle; text-align: center;}
.bbs.grid.siteLink .imgWrap img { position: static; display:block; text-align: center; max-width: 180px; height:auto; margin: auto;}
.bbs.grid.siteLink .imgWrap:before {display:none; }
.bbs.grid.siteLink .contWrap { padding-top: 20px; }
.bbs.grid.siteLink > li > a:hover img, .bbs.grid.siteLink > li > a:focus img {transform:none;}
.bbs.grid.siteLink > li .links { height: auto; padding-left: 5px; padding-right: 5px; }
.bbs.grid.siteLink li { float: none; display: inline-block; width: 25%; margin-top: 40px; padding: 0 17px; text-align: center; vertical-align: top; letter-spacing: 0; box-sizing: border-box; }

.oldChrome .bbs.grid.siteLink { letter-spacing:0; }
.oldChrome .bbs.grid.siteLink li { margin-left: -3px; margin-right: -3px; }

/* 목록 - 갤러리형 (구성원소개 웹비즈) */
.bbs.grid.member {padding:0 0 30px 0; letter-spacing:-2em;}
.bbs.grid.member li {float: none; display: inline-block; width:25%; margin-top: 40px; padding:0 27px; vertical-align: top; letter-spacing: 0; box-sizing: border-box;}
.bbs.grid.member .imgWrap {width:228px; height:170px; border:1px solid #dedede; box-sizing:border-box; background:#fff; text-align: center;}
.bbs.grid.member .imgWrap:before {display:none; }
.bbs.grid.member .imgWrap img {text-align: center; width:auto; max-width:226px; height:168px;}
.bbs.grid.member .contWrap {padding-top:20px;}
.bbs.grid.member .subInfo em {display:block; position:relative;}
.bbs.grid.member .subInfo em.bullet {padding-left:10px;}
.bbs.grid.member .subInfo em.bullet:before {display: block; content: ''; position: absolute; top: 9px; left: 0; width: 3px; height: 3px; transform: rotate(0deg); background: #333;}
.bbs.grid.member .subInfo span {display:block;}
.bbs.grid.member .subInfo em.bullet + span {padding-left:10px;}
li.noData {display:block !important; width:100% !important; padding:100px !important; text-align: center !important; color:#666 !important; box-sizing:border-box;}

/* 게시판 상세 */
.bbs .cate {margin-bottom:5px; font-size: 16px;}
.bbs .notice {display:inline-block; width:45px; height:25px; margin:1px 8px 0 0; background:url(../img/wbiz/ico_notice.png) no-repeat 0 center; vertical-align:top;}
.bbs .notice.txt {width: auto; line-height: 25px; padding: 0 5px; background: #0063cc; color:#fff; font-size: 14px; border-radius: 4px} 
.bbs .secret { display:inline-block; width: 25px; height: 25px; margin: 1px 8px 0 0; background: url("../img/wbiz/ico_secret.png") no-repeat 0 0; vertical-align:top; }
article.bbs .notice {margin-top:3px;}
.bbs .context {padding: 30px 30px 50px; margin-top:25px; border-top:2px solid #666;}
.bbs .context.line{border-bottom:1px solid #dedede }
.bbs .context img {display:block; margin: 30px auto 60px 0; max-width:100%;}
.bbs .context.editor img {display:inline-block; margin: 0;}
.bbs .context table{border-top:0}
.bbs .tit {font-size: 24px; color:#333; line-height:30px}
.bbsInfo {margin-top: 15px;}
.bbsInfo > * {margin-right: 20px;}
article.bbs ~ .btnArea.line {padding-top: 30px}
.bbs .infoBox{margin:20px 0; padding:15px 20px;}
table.mod .editor td:not(.bgNone):first-child,
.editor .tableY:not(.mod) td:nth-child(2n-1) {font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important}

/* 게시판 상세 - 갤러리형 */
.bbs .context.bg {background-color:#f8f8f8;}
.bbs .context [class*=box] img {max-width:100%;}
.bbs .context.bg .fileList {margin-top: 20px; padding-left: 52px;}
.bbs .context.bg .galleryWrap:not(.hasThumb) ~ .fileList {margin-top:-10px;} 
.bbs .context.bg .galleryWrap {padding: 30px 52px;}
.bbs .context.bg .galleryWrap .imgArea img {max-width:980px;}
.bbs .context.bg .galleryWrap.hasThumb {padding: 0;}
.bbs .context.bg .galleryWrap.hasThumb .imgArea {float:left; display: table; width:757px; height:490px; padding: 0 52px;}
.bbs .context.bg .galleryWrap.hasThumb .imgArea .img {display:table-cell; vertical-align: middle;}
.bbs .context.bg .galleryWrap.hasThumb .imgArea img {max-width:653px; max-height:490px;}

.galleryWrap:after {content:""; clear:both; display:block;}
.galleryWrap .imgArea {position:relative; text-align: center; box-sizing:border-box; }
.galleryWrap .imgArea img {margin:0 auto;}

.galleryWrap .imgArea button {position:absolute; top:50%; min-width:0; margin-top:-17px; display: inline-block; width:35px; height: 35px; background: #fff url('../img/common/btn_bbs.png') no-repeat 0 0; border:1px solid #555; border-radius: 4px; transition:background-color ease-out 0.125s; box-sizing: border-box;}
.galleryWrap .imgArea button.btnPrev {left:0; background: #fff url('../img/common/btn_bbs.png') no-repeat -33px 0;}
.galleryWrap .imgArea button.btnNext {right:0; background: #fff url('../img/common/btn_bbs.png') no-repeat -66px 0;}
.galleryWrap .imgArea button:hover, .boxGallery button:focus {background-color: #eee}
.galleryWrap .imgArea button[disabled] {opacity: 0.4; cursor: default;}
.galleryWrap .imgArea button[disabled]:hover {background-color: #fff}

.galleryWrap .galleryThum {position:relative; float:right; width:290px; box-sizing:border-box; margin:-5px -5px 0 0;}
.galleryWrap .galleryThum:after {content:''; display:block; clear:both;}
.galleryWrap .galleryThum li {position:relative; float:left; height:94px; width:150px; margin-top:5px; padding:0 5px; box-sizing:border-box; margin-left:-5px;}
.galleryWrap .galleryThum li img {position:relative; z-index:1; width:140px; height:94px; transition: transform ease-in-out 0.25s; margin:0;}
.galleryWrap .galleryThum li.noImg {width:150px !important; padding:0 !important; }
.galleryWrap .galleryThum li.noImg:before {content:''; position:absolute; top:0; bottom:0; left:5px; right:5px; background:#fff url(../img/common/bg_gallery_nodata.png) no-repeat center center;}
.galleryWrap .galleryThum li.on:after {content:''; position:absolute; top:0; bottom:0; left:5px; right:5px; z-index:1; background-color:#0063CC; opacity:0.5; pointer-events: none;}
.galleryWrap .galleryThum li a {display:block; width:140px; height:94px; overflow:hidden}
.galleryWrap .galleryThum li a:hover img, .galleryThum li a:focus img {transform:scale(1.2); opacity:0.4}

.bbs .galleryTxt{margin-left:52px; padding-top:20px;}
.bbs .galleryTxt ~ .fileList {margin-left:52px; padding-left:0 !important; padding-top:20px; border-top:1px solid #d2d2d2;}

.carouselSlide {position:relative; margin-top:-10px; opacity: 0}
.carouselSlide.uiAct {opacity: 1}
.carouselSlide .slideWrapper {overflow:hidden}
.carouselSlide .bbs.grid {position:relative; left:0; border: none; transition: transform 0.3s ease-in-out; -ms-transition: transform 0.3s ease-in-out }
.carouselSlide li > a {display:block; width:100%}
.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}
.carouselSlide button.btnPrev, .carouselSlide button.btnNext {width:15px; padding:0 !important;}
.carouselSlide button.btnNext {left:auto; right:0; background-position:-370px -30px}
.carouselSlide button.circle[class*=btn] {width:54px; height:54px; left:-26px; 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)}
.carouselSlide button.circle.btnNext {background-position: -314px 0px; left:auto; right:-26px;}
.carouselSlide button.circle[class*=btn]:hover, .carouselSlide button.circle[class*=btn]:focus {background-position: -260px -54px;}
.carouselSlide button.circle.btnNext:hover, .carouselSlide button.circle.btnNext:focus {background-position: -314px -54px;}
.carouselSlide button.circle[class*=btn][disabled] {background-position:-260px 0px !important;}
.carouselSlide button.circle.btnNext[disabled] {background-position:-314px 0px !important;}
.carouselSlide.center button[class*=btn] {top:50%; margin-top:-3px;}
.carouselSlide .bbs.grid .subInfo {margin-top:0; border-top:0}
.carouselSlide .bbs.grid > li {padding-bottom: 0}
.carouselSlide .noImg {position: relative; min-height: 166px;}
.carouselSlide .noImg:before {content:''; position:absolute; top:30px; left:18px; right:19px; bottom:0; background:#fafafa url(../img/common/bg_gallery_nodata.png) no-repeat center center; border:1px solid #ddd;}

/* 게시판 상세 - 홍보동영상/라디오광고 */
.playerArea{position:relative; display:block; width:640px; height:360px; margin:0;padding:0;z-index:0}
.playerArea video, .playerArea audio {position:relative; width:100%; margin:0;padding:0;z-index:0; background-color:#000; vertical-align:top;}
.playerArea video {height:100%;}
.videoVerError {position:absolute; top:0; left:0; right:0; bottom:0; background-color: #fff}
.videoVerError p {position:absolute; top:50%; left:0; right:0; margin-top:-100px; padding-top:155px; vertical-align: middle; color:#666; text-align: center; background: url(../img/common/bg_ie_error.png) no-repeat center 0; }
audio .videoVerError {position:relative; }
audio .videoVerError p {position:relative; padding-top:0; background: #fff; margin-top: 0; padding:10px 0}

.bbs .context .boxGallery.videoGallery,
.bbs .context .boxGallery.radioGallery{padding:0; }
.bbs .context .boxGallery.videoGallery:after,
.bbs .context .boxGallery.radioGallery:after{content:""; display:block; clear:both}
.videoGallery .playerArea{float:left; width:730px; height:410px;z-index:1}
.videoGallery .playerArea embed{position:relative; width:100%; height:100%; z-index:0; background:#000}
.videoGallery .txt{margin-left:22px; float:left; width:320px; }
.videoGallery .radio + .txt{width:730px}
.videoGallery .scrollTxt{margin-top:5px; padding:20px; height:380px; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; background-color:#fff}
.videoGallery .radio + .txt .scrollTxt{height:250px}
.videoGallery .concept{float:left; width:100%; margin-top:30px;}
.videoGallery .concept .cont{margin-top:15px; padding-top:10px; border-top:1px solid #d2d2d2}

.radioGallery .radio{float:left; width:320px; height:280px; padding-top:230px; box-sizing:border-box; /*background:url(../img/common/ico_radio_player.png) no-repeat center 55px*/}
.radioGallery .playerArea{float:left; width:100%; min-height:54px; height:auto; z-index:1; /*background:url(../../img/common/bg_radio_player.png) no-repeat 0 0*/}
.radioGallery .playerArea embed{position:relative; width:100%; height:auto; z-index:0; background:#000}
.radioGallery .concept{float:left; width:50%; margin-top:30px;padding-right:10px;box-sizing:border-box; }
.radioGallery .concept .cont{margin-top:15px; padding-top:10px; border-top:1px solid #d2d2d2}
.radioGallery .txt{float:left; width:50%; margin-top:30px; padding-left:10px;box-sizing:border-box;}
.radioGallery .scrollTxt{margin-top:15px; padding:20px; height:250px; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; background-color:#fff}

.bbs.radio .imgWrap{border:1px solid #d2d2d2}
.bbs.radio .imgWrap:before {padding-top: 56.25%}
.bbs.radio .imgWrap:after, .bbs > li.radio .imgWrap:after {content: ''; position: absolute; top:0; left:0; right:0; bottom:0; z-index: 10; background: url(../img/common/ico_radio.png) no-repeat center center; opacity: 0.5; transition: all ease-in-out 0.25s}
.bbs.radio > li > a:hover .imgWrap,
.bbs.radio > li > a:focus .imgWrap{border:1px solid #7e7e7e}
.bbs.radio > li > a:hover .imgWrap:after, .bbs > li.video > a:hover .imgWrap:after,
.bbs.radio > li > a:focus .imgWrap:after, .bbs > li.video > a:focus .imgWrap:after {opacity: 1;}

/* 게시판 상세 - 은행소개 */
.bbs.chbi .context img {margin:0 auto 30px;}
.bbs.chbi .context .playerArea {width:854px; height:auto; min-height:35px; margin:0 auto;}
.bbs.chbi .context .tableY.bbs {margin-top:30px !important;}
.bbs.chbi .context .tableY.bbs td:not(.label) {padding:15px 20px;}
.bbs.chbi .scrollTxt {padding:20px; height:140px; overflow-x:hidden; overflow-y:auto; box-sizing:border-box;}
.bbs.chbi .fileList {margin-top:30px; padding-left:0;}
#cmsBBS .tit {outline:rgba(0,0,0,0);}
.bbs.grid.chbi > li .links {height:53px; margin-bottom:0; -webkit-line-clamp:2;}
.bbs.grid.chbi .imgWrap {border:1px solid #d2d2d2; background-color:#000;}
.bbs.grid.chbi .on .imgWrap {border:2px solid #0063cc; background-color:#0063cc;}
.bbs.grid.chbi > li > a:hover img, 
.bbs.grid.chbi > li > a:focus img {opacity:0.6;} 
.bbs.grid.chbi > li.on > a img {opacity:0.5;}
.bbs.grid.chbi .imgWrap:before {padding-top: 66.6666666666666666666666%;}

/* 게시판 상세 - 댓글달기 */
.commentWrite{position:relative; margin-top:40px; padding:20px 30px; border-top:1px solid #dedede; border-bottom:1px solid #dedede; background-color:#f8f8f8}
.commentWrite .tit{margin-bottom:20px}
.commentIpt{position:relative; padding-right:115px}
.commentIpt textarea.ipt{width:100%; min-height:80px; border-radius:0}
.commentIpt .btnComment{position:absolute; top:0; right:0; min-width:95px; min-height:80px; background-color:#4b4e68}

.commentListWrap{padding-bottom:30px; border-bottom:1px solid #dedede}
.commentListWrap.topLine{border-top:1px solid #dedede}
.commentListWrap .topArea{padding:20px 30px}
.commentList li{padding:30px; border-top:1px solid #dedede}
.commentList li:last-child{padding-bottom:0}
.commentList li .info{padding-bottom:20px}
.commentList li .info:after{content:""; display:block; clear:both}
.commentList li .info .name{position:relative; display:inline-block; color:#333}
.commentList li .info .name:before{content:""; display:block; position:absolute; bottom:-20px; left:0; width:100%; height:1px; border-bottom:1px solid #333}
.commentList li .info time{display:inline-block; margin-left:20px}
.commentList li .cont{padding-top:15px;}
.commentList .links{width:auto; color:#0063cc}
.commentList .links span{max-width:100%}
.commentList .linkGroup{display:inline-block; margin-left:25px}

/* 게시판 상세 - 이벤트 */
article.bbs .eventInfo .txtList.event > li .bold, article.bbs .grayBox.event .refList > li.bold, article.bbs .grayBox.event .refList > li:before {color:#333;}
article.bbs .eventInfo {margin-top:-15px;}
article.bbs .eventInfo .txtList.event {margin-top:15px;}
article.bbs .eventInfo .txtList.event > li {display:table; width:100%; margin-top:19px; box-sizing:border-box;}
article.bbs .eventInfo .txtList.event > li .evTit {width:124px;}
article.bbs .eventInfo .txtList.event > li .evTit, article.bbs .eventInfo .txtList > li .evTxt {display:table-cell; vertical-align:top;}
article.bbs .eventInfo.line .txtList.event {padding-bottom:47px; border-bottom:1px solid #e7e7e7;}
article.bbs .eventInfo .evtShape {margin-top:30px; margin-bottom:11px; vertical-align:top;}
article.bbs .eventInfo .evtShape > span {min-width:142px; font-size:18px; text-align:left; letter-spacing:1px;}
article.bbs .grayBox.event {margin-top:50px; padding:26px 20px;}
article.bbs .grayBox.event .refList li, article.bbs .grayBox.event .refList > li a {font-size:16px;}
article.bbs .grayBox.event .refList > li {margin-top:9px;}
article.bbs .grayBox.event .refList > li:first-child {margin-top:0;}
article.bbs .grayBox.event .refList > li a.links {display:inline-block; width:auto; color:#0063cc;}
article.bbs .grayBox.event .refList > li a.links:after {display:block;}
article.bbs .grayBox.event .refList > li a.links span {max-width:100%; white-space:normal;}
article.bbs .grayBox.event .refList > li a.links span:after {border-color:#0063cc; opacity:1;}
article.bbs .grayBox.event.bgNone {padding:40px 30px;}
article.bbs .grayBox.event.bgNone .icoNumDia {margin-top:30px; margin-bottom:20px; padding:0 0 0 35px;}
article.bbs .grayBox.event.bgNone .icoNumDia > i.num {top:0; width:26px; height:24px; background:url(../img/common/ico_bullet_diamond_q.png) no-repeat 0 0; text-indent:-99999px;}

/* 게시판 쓰기 */
.bbs .bbsWrite .uploadArea{margin-top:20px; padding-top:15px; border-top:1px solid #d2d2d2}
.bbs .bbsWrite .uploadArea .byteBox{display:inline-block;}
.bbs .bbsWrite .uploadArea .refList{margin-top:5px;}

/* 이전글, 다음글 */
.tableY.bbs, body.windowPop .scroll > .tableY.bbs {margin-top:60px !important; border-top: none;}
.tableY.bbs td {padding:9px 20px 7px; text-align: left;}
.tableY.bbs td:first-child {padding-left: 30px;}
.tableY.bbs tbody tr:first-child td {border-top:1px solid #666}
.tableY.bbs tbody tr:last-child td {border-bottom: 1px solid #666}
.tableY.bbs .links {width: auto}

/* 첨부파일 */
.fileList {position:relative; padding-left:30px;}
.fileList .label{position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}
.fileList [class^=btn] {position:relative; padding:0 20px 0 45px; margin-right:5px; margin-bottom:10px; line-height: 38px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.fileList [class^=btn]:before {content: ''; position:absolute; top:12px; left:17px; width:20px; height: 16px; background: url('../img/common/ico_file.png') no-repeat 0 center;}
.fileList.noLine { padding-left: 0; }
.fileList.noLine [class^=btn] { border: none; margin-bottom: 2px; padding: 0 16px 0 35px; height: auto; line-height: 1.9; }
.fileList.noLine [class^=btn]:before { top: 8px; left: 5px; }
.fileList .btnTxt {height:auto !important; margin:0 !important; padding:0 0 0 30px !important; background:none; color:#666; text-align:left; line-height:1.5em !important;}
.fileList .btnTxt:hover, .fileList .btnTxt:focus {color:#0063cc; text-decoration:underline;}
.fileList .btnTxt:before {top:5px !important; left:0 !important;}
.fileList .tit {display:inline-block; vertical-align:top; color:#333;}
.fileList .tit + .btnTxt {vertical-align:top;}
[class*=cntList] .fileList {padding-left:0;}
.fileList [class^=btn].down:before {background: url('../img/common/ico_download.png') no-repeat 0 center;}
/* KDB다운로드 문제해결 */
.fileList.viewer {margin-right:-15px; padding:0;}
.fileList.viewer [class*=btn] {width:220px; height:120px; margin-right:15px; margin-top:15px; margin-bottom:0; padding:0 15px 0 15px; line-height: 1.6em; border-color:#dedede; background-color:#fcfcfc;}
.fileList.viewer [class*=btn]:before {position:static; display:block; width:34px; height:34px; margin:2px auto 10px auto;}
.fileList.viewer [class^=btn]:hover, .fileList.viewer [class^=btn]:focus {border-color:#0063cc !important; background-color:#fff !important;}
.fileList.viewer [class*=btn].hangul:before {background:url(../img/common/ico_viewer_hangul.png) no-repeat 0 0;}
.fileList.viewer [class*=btn].acrobat:before {background:url(../img/common/ico_viewer_acrobat.png) no-repeat 0 0;}
.fileList.viewer [class*=btn].micro:before {background:url(../img/common/ico_viewer_micro.png) no-repeat 0 0;}
.fileList.viewer [class*=btn].alzip:before {background:url(../img/common/ico_viewer_alzip.png) no-repeat 0 0;}
.fileList.viewer [class*=btn].winzip:before {background:url(../img/common/ico_viewer_winzip.png) no-repeat 0 0;}

/* FAQ */
.faq [class^=ico] {display:inline-block; width: 44px; height:40px; vertical-align: middle;}
.faq .icoQ {background:url(../img/common/ico_q.png) no-repeat center center;}
.faq .icoA {background:url(../img/common/ico_a.png) no-repeat center center;}
.faq > li {padding: 0}
.faq.accoList .accoWrap .accTopArea {padding:25px 80px 25px 96px}
.faq .accoTit {display:block; font-size:18px; color:#333; cursor: pointer;}
.faq .accoTit:hover, .faq > li.on .accoTit {color:#0063cc;}
.faq > li [class*=ico] {position: absolute; left: 0; width: 76px; color: #333; font-size: 20px; text-align: center;}
.faq.accoList > li .icoQ {top:18px;}
.faq.accoList > li .icoA {position:static; margin:5px 0 0 -96px;}
.faq .accoWrap .accoContents {position: relative; padding: 25px 80px 25px 96px;}
.faq .accoContents > * {float: left; width:100%;}
.faq .accoContents:before, .faq > li .accoContents:after {content:''; display: block;}
.faq .accoContents:after {clear: both;}
.faq .fileList {padding-left: 0; margin-top: 30px;}

/*FAQ - 번호, 카테고리 있는 유형 */
.faq .accTopArea .num {position: absolute; top:50%; left:0px; width:72px; margin-top:-13px; text-align: center; padding: 0 10px; box-sizing: border-box;}
.faq.num .accoWrap .accoContents, .faq.num.accoList .accoWrap .accTopArea {padding-left: 124px;} 
.faq.num > li [class*=ico] {width: 33px; height: 30px}
.faq.num > li .icoQ {top:50%; left:71px; margin-top:-15px; background:url(../img/common/ico_q_s.png) no-repeat 0 center;}
.faq.num > li .icoA {top:5px; background:url(../img/common/ico_a_s.png) no-repeat 0 center;} 
.faq.num.accoList > li .icoA {margin: 5px 0 0 -53px}
.faq.num .accTopArea .txtItem {margin-bottom: 5px}

/* windowPop FAQ */
.popCont .faq.bbs:not(article) {margin-top: 15px;} 
.faq.bbs > li {position:relative; padding:20px}
.faq.bbs > li [class^=ico] {left: 20px; height: 30px; margin: 0; text-align: left; font-size: 18px;} 
.faq.bbs > li .icoQ {background:url(../img/common/ico_q_s.png) no-repeat 0 center;}
.faq.bbs > li .icoA {background:url(../img/common/ico_a_s.png) no-repeat 0 center;} 
.faq.bbs .links {max-width: 100%; width: auto; padding-left:51px; box-sizing: border-box;}
.faq.bbs > li .links span {max-width:100%;} 
article.faq .tit, article.faq .context {position:relative; padding: 0 60px 25px 86px;}
article.faq .context {margin-top:0; padding-top:30px; padding-bottom:30px; background-color: #f8f8f8; font-size:13.33333px}
article.faq .icoQ, article.faq .icoA {position: absolute; left:20px; top:-4px}
article.faq .icoA {top:30px;}

/* links 버튼 */
.bbs .links {position:relative; display: inline-block; width:100%; color:#666; vertical-align:top; box-sizing: border-box;}
.bbs .links:after {display: none}
.bbs a.links:hover, .bbs a.links:focus {color:#0063cc !important}
.bbs a.links:hover span:after, .bbs a.links:focus span:after {opacity: 1}
.bbs .links span {display:inline-block; max-width:85%; text-shadow: none; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.bbs .links span:after {opacity: 0}
.bbs .links .notice + span {max-width:77%;}
.bbs .links .new {display: inline-block; width: 18px; height: 22px; margin-left: 8px; background: url(../img/common/ico_new.png) no-repeat 0 center;}
.bbs .links.w0{width:auto; color:#0063cc}
.bbs .links.w0 span{max-width:100%}
/* 상단정렬영역 */
.bbsTop {margin: 20px 0 18px 0;}
.bbsTop:before, .bbsTop:after {content: ''; display: block;}
.bbsTop:after {clear: both;}
.bbsTop .fr > * {display:inline-block; margin-left:7px; vertical-align: middle;}
.bbsTop .fr > .btnG {min-width: 0}
.bbsTop .txtItem {margin-right: 10px;}
.bbsTop .txtItem .on {color: #0063cc; }
.bbsTop .txtItem  a {padding:0 5px;}
.bbsTop .txtItem  a:not(.on):hover {text-decoration: underline; color:#0063cc;}
.bbsTop .txtItem  a:not(.on) .blind {display: none}
.bbsTop .txtItem li.on a:not(.on) .blind {display: block; }

/* File Btn */
.bbsBtn {display: inline-block; width:24px; height:24px; background: url('../img/common/ico_file.png') no-repeat 0 center; border:2px solid #fff; border-radius: 2px; overflow: hidden; box-sizing: border-box;}
.bbsBtn:hover {border-color: #a6c8ff}
/* File Btn - write */
.bbs .bbsWrite .fileList{margin-top:25px; padding-left:0}
.bbs .fileItem{margin-bottom:10px}
.bbs .fileItem .item{position:relative; display:inline-block; max-width:100%; padding:0 20px 0 52px; vertical-align: middle; text-align:center; border:1px solid #d2d2d2; border-radius: 4px; box-sizing: border-box; line-height:38px; background-color: #fff; color: #666; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.bbs .fileItem .item:before{content:""; display:inline-block; position:absolute; top:12px; left:17px; width:20px; height:16px; background: url('../img/common/ico_file.png') no-repeat 0 center;}
.bbs .btnFileDel{margin:0; padding:0; min-width:40px; background:url(../img/common/btn_file_del.png) no-repeat center center}
.bbs .btnFileDel:before{display:none}
.bbs .btnFileAdd{margin:0; padding:0; line-height:29px;}
.bbs .btnFileAdd:before{display:none}
/* File Btn - icon */
.bbsBtn.doc, .fileList [class^=btn].doc:before, .bbs .fileItem .item.doc:before{background-position: -20px center;}
.bbsBtn.xls, .fileList [class^=btn].xls:before, .bbs .fileItem .item.xls:before{background-position: -40px center;}
.bbsBtn.pdf, .fileList [class^=btn].pdf:before, .bbs .fileItem .item.pdf:before{background-position: -60px center;}
.bbsBtn.hwp, .fileList [class^=btn].hwp:before, .bbs .fileItem .item.hwp:before{background-position: -80px center;}
.bbsBtn.zip, .fileList [class^=btn].zip:before, .bbs .fileItem .item.zip:before{background-position: -100px center;}
.bbsBtn.jpg, .fileList [class^=btn].jpg:before, .bbs .fileItem .item.jpg:before{background-position: -122px center;}
.bbsBtn.ppt, .fileList [class^=btn].ppt:before, .bbs .fileItem .item.ppt:before{background-position: -140px center;}

.bbsBtn.pdf.L{width:28px; height:28px; background:url(../img/common/ico_pdf_large.png) no-repeat 0 0}
/* byte 제한 */
table textarea.ipt {height: 250px;}
table textarea.ipt + .byteBox { margin-top: 10px; }
.byteBox:before, .byteBox:after {content: ''; display: table;}
.byteBox:after {clear: both}

 /* bbsAnswer */
.bbsAnswer{position:relative; margin-top:-1px; padding:30px 30px 30px 140px; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; background-color:#f8f8f8}
.bbsAnswer:before{content:""; position:absolute; top:-7px; left:55px; width:16px; height:8px; background:url(../img/common/bg_view_answer_arrow.png) no-repeat 0 0; overflow:hidden;}
.bbsAnswer:after{content:""; position:absolute; top:28px; left:39px; width:75px; height:88px; background:url(../img/common/bg_view_answer_qna.png) no-repeat 0 0; overflow:hidden;}
.bbsAnswer .topArea{position:relative; display:table; table-layout:fixed; width:100%}
.bbsAnswer .topArea .tit{display:table-cell; width:100%; font-size:18px; color:#333}
.bbsAnswer .topArea .date{display:table-cell; width:150px; text-align:right}
/* === 통합게시판 타입별 === */
/* 게시판 상단공통 */
.topInfoWrap.bbsSys {padding-top:40px; padding-bottom:30px; border-bottom:1px solid #d2d2d2}
.topInfoWrap.bbsSys .imgArea { text-align: right; }
.topInfoWrap.bbsSys .imgArea span { display: inline-block; background-color: #f8f8f8; padding: 20px; }
.topInfoWrap.bbsSys .imgArea img { display: inline-block; width: 240px; height: auto; }
.topInfoWrap.bbsSys .txt { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient:vertical; word-wrap:break-word; max-height: 125px; -webkit-line-clamp: 5; }
.topInfoWrap.bbsSys .fileList [class^=btn] { border: #d2d2d2 1px solid; }
.topInfoWrap.bbsSys .fileList p:last-child [class^=btn] { margin-bottom: 0; }

/* 일반형게시판 */
table.bbs .linksThumb { display: inline-block; width: 90px; height: 68px; border: #f8f8f8 5px solid; vertical-align: middle; margin-right: 10px; }
table.bbs .linksThumb ~ .notice {vertical-align: middle;}
table.bbs .linksThumb ~ .links { width: 76%; vertical-align: middle; }
table.bbs .linksThumb ~ .links span {width: 90%}

/* 계층형게시판 */
.replyLabel + .links { width: 87%; }
.replyLabel {position: relative; display: inline-block; width: 55px; height: 18px; box-sizing: border-box; padding-left: 16px; text-align: left; color: #4960eb; line-height: 18px; background: url("../img/common/bg_bbs_reply.png") no-repeat 0 0;}
table.bbs .rep { display: inline-block; vertical-align: top; }
table.bbs .replyLabel ~ .links span { max-width: 83%; }

/* 게시판 상세 */
.commentList.grayTipBox { margin-top: 30px; }
.commentList.grayTipBox li { position:relative; padding: 25px 30px; border:1px solid #d2d2d2; background-color: #f8f8f8; border-radius: 8px; margin-bottom: 11px; }
.commentList.grayTipBox li:before { content:''; position: absolute; top: -8px; left: 54px; width: 14px; height: 8px; background: url('../img/wbiz/ico_gray_tip_box.png') no-repeat 0; overflow: hidden;}
.commentList.grayTipBox li .info { padding-bottom: 0; }
.commentList.grayTipBox li .info .name:before { display: none; }
.commentList.grayTipBox li .cont { padding-top: 10px; }
.commentList.grayTipBox + .commentWrite { margin-top: 60px; }

.saveThumbnail { display: table; width: 100%; table-layout: fixed; }
.saveThumbnail .imgArea { width: 280px; display: table-cell; vertical-align: top; padding-right: 20px; }
.saveThumbnail .imgArea img {width: 100%; height: auto}
.saveThumbnail .imgArea span { display: inline-block; background-color: #f8f8f8; padding: 20px; }
.saveThumbnail .fileArea { display: table-cell; vertical-align: top; }

/* 이미지형게시판 상세 */
.bbs.grid .contWrap .links .new { margin-left: 0; vertical-align: middle; margin-right: 5px; margin-bottom: 2px; }

/* 카드형게시판 상세 */
.bbs.cardList .new {display: inline-block; width: 18px; height: 24px; margin-left: 8px; background: url(../img/common/ico_new.png) no-repeat 0 center; vertical-align: middle; margin-bottom: 3px; }


/*=========================================== 영역 ==============================================*/
.tempImg {width:100%; height: auto}
.graphArea {margin-bottom: 30px;}
/* 라인/스크롤/높이240 */
.lineScroll { width: 100%; height:240px; margin-bottom: 30px; box-sizing: border-box; overflow: auto; border: #d2d2d2 1px solid; border-radius: 5px; }
/* 임의의 출력 박스*/
.addCertContain .tempBtn,
div > .tempBtn,
.secuContain .tempBtn,
.payInfoContain .tempBtn {display:block; background-color:#ddd; height:200px; width:100%; text-align:center; line-height: 200px; font-size:20px; color:#fff; font-family: '맑은 고딕', sans-serif; font-weight: bold }

/*=========================================== stepBox ==============================================*/
.stepBox:not(.vertical):before, .stepBox:not(.vertical):after {content: ''; display: table;}
.stepBox:not(.vertical):after {clear: both}
.stepBox:not(.vertical) {opacity: 0; }
.stepBox.uiAct {opacity: 1}
.stepBox > li {float:left; position:relative; width:25%; display: block; border:1px solid #c5d1d8; border-left:none; padding:24px 30px 30px; box-sizing: border-box;}
.stepBox > li:not(.rowCnt0) {border-top:none}
.stepBox > li.col0 {border-left:1px solid #c5d1d8;}
.stepBox > li.col1 {background-color: #f7fbfd}
.stepBox > li.col2 {background-color: #eff6fa}
.stepBox > li.col3 {background-color: #e7f1f8}
.stepBox > li:before {content: ''; position: absolute; left: -1px; top:16px; width:13px; height: 44px; background: url(../img/common/bg_step.png) no-repeat 0 0;}
.stepBox > li.col0:before, .stepBox.vertical > li:first-child:before {content:none;}
.stepBox > li.col2:before {background-position: -13px 0;}
.stepBox > li.col3:before {background-position: -26px 0;}
.stepBox.div2 > li {width: 50%}
.stepBox.div3 > li {width: 33%}
.stepBox.div3 > li.col1 {width: 34%}
.stepBox.div5 > li {width: 20%}
.stepBox > li.tR {border-top-right-radius: 5px}
.stepBox > li.tL {border-top-left-radius: 5px}
.stepBox > li.bR {border-bottom-right-radius: 5px}
.stepBox > li.bL {border-bottom-left-radius: 5px}
.stepBox > li.noArr:before{background:none}
.stepBox > li .num {display:block; padding-bottom: 10px; font-size: 20px; color: #065281;}
.stepBox > li .icoNumDia > i.num { font-size: 14px !important; color: #fff !important; } 
.stepBox > li .tit {display:block; padding-bottom: 10px; color: #333; font-size: 16px}
.stepBox > li .tit.txt20 {font-size:20px;} 

.stepBox > li .step.inline:after{content:""; display:block; clear:both}
.stepBox > li .step.inline .num{display:inline-block;}
.stepBox > li .step.inline .tit{display:inline-block; margin-left:10px}

.stepBox.hor .imgWrap {float:right; margin-top:45px}
.stepBox.vertical > li {float:none; width: auto; padding:30px 0; border-right: none}
.stepBox.vertical > li:first-child {border-top: 1px solid #c5d1d8;}
.stepBox.vertical > li:before {position: absolute; left: 20px; top:-1px; width:44px; height: 13px; background-position:0 bottom;}
.stepBox.vertical > li .tit {font-size: 20px}
.stepBox.vertical .imgWrap {padding-left: 20px;}
.stepBox.vertical .imgWrap img, .stepBox.vertical .cont img {width: 100%; height: auto; opacity: 0}
.stepBox.vertical.act .imgWrap img, .stepBox.vertical.act .cont img {opacity: 1}
.stepBox.vertical .imgBox.thumb.col_6 {float: right; width:auto; max-width:556px; margin-right: 10px;}
.popCont .stepBox.vertical .imgBox.thumb.col_6 {max-width: 537px;} 
.stepBox.vertical ol.long {margin-left:0;}
.stepBox.vertical ol.long > li .imgWrap {width:100% !important; height:auto; padding:0;}
.stepBox.vertical > li ol.long > li .num {display: inline-block; padding-bottom:0; font-size: 14px; color: #fff;}
.stepBox.vertical > li ol.long.step5 {margin-right:0;}
.stepBox.vertical > li ol.long.step5 > li {float:left; width:20%; padding:0 10px; box-sizing:border-box;}
.stepBox.vertical.btNone > li:first-child {padding-top:5px; border-top:none;}

.stepBox.bgNone > li {background:none !important;}
.stepBox.bgNone > li:before {background-position:0 0;}
.stepBox > li.pre:before {top:50%; margin-top:-22px;}
.stepBox > li.pre .imgWrap {width:100%; margin-top:0; margin-bottom:15px; text-align:center;}	
.stepBox.imgBgGray > li.pre .imgWrap {background-color:#f8f8f8;} 

.stepBox .step > img {position: absolute; top: 65px; right: 25px; display: inline-block; width: 60px; height: 60px;}

.txtList > li .stepBox {margin-left: -19px}

/* 그라데이션 모드 */
.stepBox.gra {border: #c5d1d8 1px solid; border-radius: 5px; background: -webkit-linear-gradient(to right, #fff 0%, #f7fbfd 33%, #eff6fa 66%, #e7f1f8 100%); background: linear-gradient(to right, #fff 0%, #f7fbfd 33%, #eff6fa 66%, #e7f1f8 100%);}
.stepBox.gra > li {padding:25px 30px 25px 30px; border-radius: 0; border:none; border-bottom: 1px solid #c5d1d8; background-color:transparent !important; background: url(../img/common/bg_gra_stepbox_line.png) no-repeat 0 0; }
.stepBox.gra > li.col0 {background: none !important;}
.stepBox.gra > li:before {content: none;}
.stepBox.gra > li.lastLine {border-bottom: none;}
.stepBox.gra > li.last:before {content: ''; position: absolute; top: 0; right: -1px; bottom: 0; left: auto; height: auto; width: 1px; background: #c5d1d8;}
.stepBox.gra.div2 > li.col1.last:before, .stepBox.gra.div3 > li.col2.last:before, .stepBox.gra.div4 > li.col3.last:before, .stepBox.gra.div5 > li.col4.last:before, .stepBox.gra.div6 > li.col5.last:before {content: none}

.cl .stepBox.gra {border-color:#938282; background: -webkit-linear-gradient(to right, #fff 0%, #e7e3e3 50%, #cec7c7 100%); background: linear-gradient(to right, #fff 0%, #e7e3e3 50%, #cec7c7 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#cec7c7', GradientType=1);}
.cl .stepBox.gra > li {background:url(../img/wbiz/bg_stepbox_brown.png) no-repeat 0 0}
.cl .stepBox.gra .num {color:#725c5c} 
.ie9 .stepBox.gra, .ie8 .gradient:before {background:url(../img/common/bg_old_ie_stepbox.png) repeat-y 0 0;}

/* 그룹박스 */
.stepBox .grpBox { border: #22aef2 1px solid; border-radius: 5px; background-color: #fff; height: 34px; line-height: 31px; box-sizing: border-box; text-align: center; font-size: 14px; color: #565e64; margin-top: 10px; position: relative; z-index: 10; }


/*=========================================== monthPicker ==============================================*/
.monthPicker {display:none; position: absolute; top:300px; left:300px; min-width:310px; width:310px; margin:0; padding:0; border:2px solid #001f5b; border-radius:0 0; z-index: 99;}
.monthPicker.on {display: block;}
.monthPicker .topArea {margin:0; padding:20px 20px 10px 20px; text-align:left; background-color:#f3f3f3; box-sizing:border-box}
.monthPicker select.ipt {display:inline-block; width:110px; height:40px; line-height:38px; padding:0 25px 0 15px; text-align:left; vertical-align:top; color:#333; border:1px solid #d2d2d2; border-radius:4px; background: #fff url(../img/common/btn_select.png) no-repeat right center; box-sizing: border-box; transition:border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s; z-index:3}
.monthPicker .links {float:right; color: #0063cc; font-size: 14px; line-height: 38px; margin-left: 15px; font-family: 'Roboto Regular', 'NotoSans Regular', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; font-weight: normal; font-size:14px}
.monthPicker .monthList {width:auto; padding:15px 15px; background: #fff}
.monthPicker .monthList:before, .monthPicker .monthList:after {content: ''; display: table;}
.monthPicker .monthList:after {clear: both}
.monthPicker .monthList .btnW {float:left; min-width: 60px; width: 60px; height: 50px; margin: 5px; padding: 0; text-align: center; line-height: 50px; vertical-align: middle; font-size: 16px; color: #333; box-sizing: border-box; border: 1px solid #d2d2d2; border-radius: 4px;}
.monthPicker .monthList .btnW {min-width:60px; width:60px; height:50px; margin:5px; padding:0; text-align:center; line-height:50px; vertical-align:middle; font-size:16px; color:#333; box-sizing:border-box; border:1px solid #d2d2d2; border-radius:4px}
.monthPicker .monthList .btnW.on {color:#fff; border-color:#0063cc; background-color:#0063cc }
.monthPicker .monthList .btnW:not(.on).today {background-color:#d8edfb; border-color:rgba(0,0,0,0)}
.monthPicker .monthList .btnW .blind {display: none}
.monthPicker .monthList .btnW.today .blind.to, .monthPicker .monthList .btnW.on .blind.sel {display: block;} 
.monthPicker .btnArea {position:relative; border-top: 1px solid #e0e3e8; padding: 10px 0 20px; margin: 0; background: #fff}
.monthPicker .links:after {content: none}
.en .monthPicker .monthList .btnW span{display:block; width:30px; height: 100%; margin: 0 auto; overflow:hidden;}
.en .monthPicker .monthList .btnW:nth-child(4) span, .en .monthPicker .monthList .btnW:nth-child(7) span{width:27px;}

/*=========================================== cntList ==============================================*/
/* 이미지+컨텐츠 */
[class*=Box][class*=cntList] {padding:0; overflow:hidden;}
[class*=cntList] [class*=titH] {display:inline-block; color:#333;}
[class*=cntList] .titH3, [class*=cntList] .titH4, [class*=cntList] .titH6 {margin-bottom:10px;}
[class*=Box][class*=cntList], ul[class*=cntList] > li {white-space:nowrap;}
[class*=Box][class*=cntList] > *, ul[class*=cntList] > li > *, ul[class*=cntList][class*=div] > li {white-space:normal;}
[class*=cntList] [class*=col_] {padding:40px; box-sizing:border-box; vertical-align:top;}
[class*=cntList] [class*=col_][class*=img] {padding-left:0px; padding-right:0px; text-align:center;}
[class*=cntList] [class*=col_][class*=img] + [class*=col_] {padding-left:0;}
[class*=cntList] [class*=col_] + [class*=img] {margin-left:-3px;}

.isIE [class*=cntList] [class*=col_] + [class*=img] {margin-left:-5px;}

[class*=cntList] [class*=img] img {max-width:100%;}
[class*=cntList] [class*=img] .desc.cover {position:absolute; left:0; right:0; bottom:0; padding:19px; color:#fff; box-sizing:border-box;}
[class*=cntList] [class*=img] .desc.cover:before {content:''; position:absolute; top:0; left:0; right:0; bottom:0; background-color:#001f5b; opacity:0.6;}
[class*=cntList] [class*=img] .desc.cover > * {position:relative; z-index:1;}
[class*=cntList] [class*=col_].imgFull + [class*=col_] {padding-left:30px;}
[class*=cntList] .imgFull .bgGray, [class*=cntList] .imgFull.bgGray {position:relative; padding:20px; background-color:#f9f9f9;}
[class*=cntList] .imgFull .bgGray .desc.cover {left:20px; right:20px; bottom:20px;}
[class*=cntList] .imgFull .bgGray.pd0 .desc.cover {left:0; right:0; bottom:0;}
[class*=cntList] .imgFull .bgGray + .bgGray {margin-top:20px;}
.cntList li > [class*=col_]:not(.imgFull) [class*=titH]:first-child {margin-top:15px;}
.cntList li.txtOnly {padding:45px 0;}

/* 그리드타입 */
ul[class*=cntList][class*=div] {position:relative; border:0; margin:0 -10px 0 -10px; letter-spacing:-2em;}
ul[class*=cntList][class*=div]:before {content:''; display:block; margin:0 10px -20px 10px; border-top:2px solid #666;}
ul[class*=cntList][class*=div].btNone {overflow:hidden;}
ul[class*=cntList][class*=div].btNone:before {border-top:0; margin-bottom:-50px;}
ul[class*=cntList][class*=div] > li {display:inline-block; margin-top:50px; vertical-align:top; padding:0 10px; border:0; letter-spacing:0;}
ul[class*=cntList][class*=div] > li .tbC, ul[class*=cntList][class*=div] > li .tbC + * {display:table-cell; box-sizing:border-box;}
ul[class*=cntList][class*=div] > li [class*=icoImg].tbC + * {padding-left:30px;}
ul[class*=cntList].div2 > li {width:50%;}
ul[class*=cntList].div3 > li {width:33.3%;}
ul[class*=cntList].div4 > li {width:25%;}
ul[class*=cntList] .imgFull.bgGray + .txtWrap {padding:25px 20px 0 20px;}
ul[class*=cntList] .txtWrap.bgGray {background-color:#f9f9f9;}


.oldChrome ul[class*=cntList][class*=div] > li {padding:0 15px; margin:0 10px;}
.oldChrome ul[class*=cntList].div3 > li {width:33.2%;}


/* 일반적인 라인리스트 */
ul[class*=cntList] {border-top:2px solid #666; border-bottom:1px solid #dedede;}
ul[class*=cntList] > li {padding:30px 0; border-top:1px solid #dedede; box-sizing:border-box;}
ul[class*=cntList] > li:first-child {border-top:none;}
ul[class*=cntList] > li [class*=col_] {padding:0 30px;}
ul[class*=cntList] > li [class*=col_]:first-child {padding-left:0;}
ul[class*=cntList].thinLine {border-top-width:1px; border-bottom:0}

ul[class*=cntList].vertical li {display: table; width: 100%; table-layout: fixed; }
ul[class*=cntList].vertical li .titH4 {display: table-cell; width: 268px; padding-right: 20px; }
ul[class*=cntList].vertical li .verCont {display: table-cell; padding-left: 20px; }


/*======================================= 페이지하단에 오는 컨텐츠 ===========================================*/
/* noteArea */
.noteArea.brT {padding:20px 0; border-top:1px solid #dedede;}
.noteArea.brB {border-bottom:1px solid #dedede;}
.noteArea .tit {position:relative; margin-right:6px; padding-right:14px;}
.noteArea .tit:after {content:''; position:absolute; top:50%; right:0; width:4px; height:4px; margin-top:-2px; background:#d2d2d2; border-radius:50%;}
/* noteArea + bgGray */
.noteArea.bgGray{margin-bottom:20px; padding:17px 20px; border-radius:4px; background-color:#f8f8f8}

/* footNote */
#content .footNote {position: absolute; bottom:0; left:0; right:0;}
#content .footNote section {margin-bottom: 0}
.popCont .footNote {margin-bottom:0; margin-top: 40px; }
.popCont .footNote .noteArea.brB{margin-bottom:-31px;}
/*=========================================== 사이트맵 ==============================================*/
.sitemap{position: fixed; top:0; left:0; right:0; bottom:0; display:block; height:100%; background-color:#fff; box-sizing: border-box; outline:rgba(0,0,0,0.5); z-index:600; overflow: hidden;}
.sitemap .sitemapWrap {display:block; width:100%; height:100%; overflow: auto}

/* sitemapHeader */
.sitemapHeader{position:relative; left:0; right:0; height:175px; box-sizing: border-box; z-index:601}
.sitemapHeader:before{content: ''; position:absolute; top:0; left:0; right:0; width:100%; min-width:1132px; height:100%; 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);
}
.sitemapHeader .topArea{position:relative; width:1132px; margin:0 auto; padding-left: 288px; box-sizing: border-box;}
.sitemapHeader .logo {position: fixed; top:44px; left:50%; margin-left:-574px;}
.sitemapHeader .topArea:after{content:""; display:block; clear:both}
.sitemapHeader .titH2{padding-left:219px; padding-top:33px; color:#fff}
.sitemapHeader .sitemapSearch{margin-top:28px;width:556px;}
.sitemapHeader .sitemapBtnClose {position: fixed; top:31px; left:50%; margin-left:520px; width:38px; height:38px;}
.sitemapHeader .sitemapBtnClose:before {content:''; position:absolute; top:0; left:0; width:38px; height:38px; background: url('../img/common/btn_gnb_side_close.png') no-repeat 0 0; transition:transform 0.25s ease-out}
.sitemapHeader .sitemapBtnClose:hover:before, .sitemapHeader .sitemapBtnClose:focus:before {transform:rotate(90deg)}

/* sitemapHeader - sticky */
.sitemap.sticky .sitemapContain {padding-top: 175px}
.sitemapOpen .sticky .sitemapHeader{position:fixed; height:100px; right:17px;}
.sitemapOpen .sticky .sitemapHeader .titH2 {display:none}
.sitemapOpen .sticky .sitemapHeader .searchArea {padding:26px 0 0; }
.sitemapOpen .sticky .sitemapHeader .sitemapSearch {margin-top:0;}

/* sitemapSearch */
.sitemapSearch{position:relative;}
.sitemapSearch .ipt {height:50px; line-height:48px; padding-right:55px; border:1px solid #fff; }
.sitemapSearch .ipt:focus{outline:none; box-shadow:none}
.sitemapSearch .icoBtn{position: absolute; top:1px; right: 1px; width:51px; height:48px; background: url('../img/common/btn_sitemap_search.png') no-repeat center; border:none; transition:none;}
.sitemapSearch .layer{display:none}

.sitemapSearch.on{ box-shadow:3px 3px 6px 0px rgba(0,0,0,0.1);}
.sitemapSearch.on .ipt{border-radius:4px 4px 0 0 ; border:1px solid #0068d4}
.sitemapSearch.on .layer{display:block; position:absolute; top:49px; left:0; width:100%; max-height:358px; padding:12px 18px;
border:1px solid #0068d4; border-radius:0 0 4px 4px; background-color:#fff; color:#333; box-sizing:border-box; font-size:16px;
box-shadow:3px 3px 6px 0px rgba(0,0,0,0.1);overflow:auto;}
.sitemapSearch.on .resultList{padding:8px 0 0}
.sitemapSearch.on .resultList > li{padding-bottom:8px}
.sitemapSearch.on .resultList > li .links{line-height:22px; color:#666; border:0;}
.sitemapSearch.on .resultList > li .links.ui-state-active {background-color: #eee !important}
.sitemapSearch.on .resultList > li .links:after{content:""; display:none; clear:both}
.sitemapSearch.on .resultList > li .links:hover{color:#0063cc;}
.sitemapSearch.on .resultList > li .links:hover:after{display:none}
.sitemapSearch.on .resultList > li .links > span{position:relative; float:left; display:inline-block; padding-left:15px; border-bottom:1px solid #fff}
.sitemapSearch.on .resultList > li .links > span:after{display:none}
.sitemapSearch.on .resultList > li .links > span:before{content:""; display:block; position:absolute; top:0; left:0; width:15px; height:22px; padding-left:3px; background:url('../img/common/bul_sitemap_arrow.png') no-repeat 3px center;}
.sitemapSearch.on .resultList > li .links > span:first-child:before{display:none}
.sitemapSearch.on .resultList > li .links > span:first-child{padding-left:0}
.sitemapSearch.on .resultList > li .links:hover > span,
.sitemapSearch.on .resultList > li .links:focus > span{color:#0063cc; border-bottom:1px solid #0063cc;}
.sitemapSearch.on .resultList > li .links:hover > span:before,
.sitemapSearch.on .resultList > li .links:focus > span:before{color:#0063cc; border-bottom:1px solid #0063cc; background:url('../img/common/bul_sitemap_arrow_on.png') no-repeat 3px center;}

/* sitemapContain */
.sitemapContain {position:relative; display:block; width:1132px; margin:0 auto; padding-top:0; padding-bottom: 200px;}
.sitemapContain:after{content:""; display:block; clear:both}

/* sitemapLnb */
.sitemapLnb{position:absolute; top:0; width:192px;}
.sitemapOpen .sticky .sitemapLnb {position:fixed; top:100px}
.sitemapLnb .list{margin-top:34px;}
.sitemapLnb .list > li{position:relative; border-bottom:1px solid #e7e7e7}
.sitemapLnb .list > li > a{display:block; min-height:60px; padding:17px 0 18px; font-size:16px; color:#666; transition: font-size 0.15s ease-out, padding-left 0.15s ease-in-out, background-color 0.2s ease-out; box-sizing: border-box;}
.sitemapLnb .list > li > a:hover,
.sitemapLnb .list > li > a:focus {color:#0063cc; padding-left:20px;}
.sitemapLnb .list > li:before{content:""; display:block; position:absolute; top:-3px; right:0; width:14px; height:25px; background:url('../img/common/bg_sitemap_lnb.png') no-repeat 0 0; opacity: 1;}
.sitemapLnb .list > li.on{border-bottom:1px solid #4b4e68; z-index:2}
.sitemapLnb .list > li.on > a{padding:16px 0 16px 20px; color:#fff; font-size:18px; background-color:#4b4e68}
.sitemapLnb .list > li.on > a:hover,
.sitemapLnb .list > li.on > a:focus {color:#fff;}

/* sitemapCont */
.sitemapCont{position:relative; display:none; margin-left:288px; width:844px; padding:20px 0 30px; box-sizing:border-box}
.sitemapCont .sitemapAccoList .accoWrap {position:relative; background-color: #fff; }
.sitemapCont .sitemapAccoList .accoWrap .accTopArea{position: relative; border-bottom:2px solid #666}
.sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoTit{display:block; padding:21px 0 17px; font-size:24px; color:#333; cursor:pointer; background-color: #fff;}
.sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoBtn { position: absolute; top: 50%; right: 20px; margin-top: -19px; display: inline-block; width: 38px; height: 38px; background: url(../img/common/btn_acco_off.png) no-repeat center center; transition: transform 0.5s; }
.sitemapCont .sitemapAccoList .accoWrap .accoContents{padding-bottom:40px; overflow: visible !important; background-color: #fff;}
.sitemapCont .sitemapAccoList .accoWrap.on .accoTit.click, 
.sitemapCont .sitemapAccoList .accoTit.click:hover, .sitemapCont .sitemapAccoList .accoTit.click:focus {color:#0063cc;}
.sitemapCont .sitemapAccoList .accoWrap.on .accoBtn.def {transform: rotate(180deg); background: url(../img/common/btn_acco_def.png) no-repeat center center;}
.sitemapCont.active {display: block;}

/* 20.08.05 사이트맵 링크 아이콘 추가 (정현아) */
.sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoTit.linksBig{position:relative; display:inline-block;}
.sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoTit.linksBig span{padding-right: 25px; text-decoration:none;}
.sitemapCont .sitemapAccoList .accoWrap .accTopArea .accoTit.linksBig span:before {content:''; position: absolute; width:22px; height:22px; top:27px; left:auto; right:0; background: url(../img/common/ico_blank_link_big.png) no-repeat 0; z-index: 2;}


/* sitemapResult */
.sitemapResult .titArea{padding:23px 0 16px;}
.sitemapResult .titArea .titH3{padding-left:19px; background: url(../img/common/bul_h3.png) no-repeat 0 10px;}
.sitemapResult .txtList > li .links{line-height:22px; color:#666; border:0}
.sitemapResult .txtList > li .links:after{content:""; display:inline-block; clear:both}
.sitemapResult .txtList > li .links:hover{color:#0063cc;}
.sitemapResult .txtList > li .links > span{position:relative; float:left; display:inline-block; padding-left:15px; border-bottom:1px solid #fff}
.sitemapResult .txtList > li .links > span:after{display:none}
.sitemapResult .txtList > li .links > span:before{content:""; display:block; position:absolute; top:0; left:0; width:15px; height:22px; padding-left:3px;  background:url('../img/common/bul_sitemap_arrow.png') no-repeat 3px center;}
.sitemapResult .txtList > li .links > span:first-child:before{display:none}
.sitemapResult .txtList > li .links > span:first-child{padding-left:0}
.sitemapResult .txtList > li .links:hover > span,
.sitemapResult .txtList > li .links:focus > span{color:#0063cc; border-bottom:1px solid #0063cc;}
.sitemapResult .txtList > li .links:hover > span:before,
.sitemapResult .txtList > li .links:focus > span:before{color:#0063cc; border-bottom:1px solid #0063cc;  background:url('../img/common/bul_sitemap_arrow_on.png') no-repeat 3px center;}

/* sitemapAccoList - depth2*/
.sitemapAccoList .subWrap {position:relative; width:844px;}
.sitemapAccoList .depth2 {font-size: 0; }
.sitemapAccoList .depth2 > li {display:inline-block; width:33%; margin-top:24px; box-sizing: border-box; font-size:16px; vertical-align: top;}
.sitemapAccoList .depth2 > li > a {display:inline-block; padding:0; margin-bottom:15px; font-size:16px; color:#333;}
.isIE .sitemapAccoList .depth2 > li > a {font-weight: bold}
.sitemapAccoList .depth2 li > a:hover,
.sitemapAccoList .depth2 li > a:focus{color:#0063cc}

/* sitemapAccoList - depth3*/
.sitemapAccoList .depth3 li {position: relative; /*overflow: hidden;*/}
.sitemapAccoList .depth3 > li a {display:block; padding: 0 10px 5px 0; font-size: 16px; color:#666; letter-spacing: -0.045em; line-height: 1.5em}
.sitemapAccoList .depth3 a {word-break: break-all;}
.sitemapAccoList .depth3 a > span{position: relative;}
.sitemapAccoList .depth3 a > span:after,
.sitemapAccoList .depth3 a:before{content: ''; position: absolute; width:0; bottom:0px; left:-5px; right:100%; border-bottom: 1px solid #0063cc; transition: all 0.25s ease-out;}
.sitemapAccoList .depth3 a:before {position:absolute; left:10px; bottom: 28px;}
.sitemapAccoList .depth3 a:hover > span:after,
.sitemapAccoList .depth3 a:focus > span:after {left:0; right: 0; width:auto}
.sitemapAccoList .depth3 a:hover:before,
.sitemapAccoList .depth3 a:focus:before {width:auto; }

/* sitemapAccoList - depth4*/
.sitemapAccoList .depth4 {display:none; position: absolute; width:240px; padding-top: 20px; background: url('../img/common/bg_gnb_d4_box.png') no-repeat right 0; box-sizing: border-box; z-index: 50; }
.sitemapAccoList .depth4.on {display: block;}
.sitemapAccoList .depth4 > ul {background: #fff; border:1px solid #666; border-top:none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px}
.sitemapAccoList .depth3 > li.on {overflow: visible;}
.sitemapAccoList .depth3 > li.on > a:before,
.sitemapAccoList .depth3 > li.on > a span:after {content: none;}

.sitemapAccoList .depth4 li {top:-6px;}
.sitemapAccoList .depth4 li a {padding-left: 19px;} 
.sitemapAccoList .depth4 li:first-child a {padding-right: 40px}
.sitemapAccoList .depth4 .close {position: absolute; top:15px; right: 15px; width:20px; height: 20px; }
.sitemapAccoList .depth4 .close:before {content: ''; position: absolute; top:4px; left:4px; width: 12px; height: 12px; background: url('../img/common/bg_gnb_close.png') no-repeat 0 0; transition:transform 0.2s ease-in-out}
.sitemapAccoList .depth4 .close:hover:before,
.sitemapAccoList .depth4 .close:focus:before {transform:rotate(-90deg); background-position: 0 bottom;}

.sitemapAccoList .d4Btn {position:relative; display:inline-block; width:25px; height: 17px; margin-left:7px; box-sizing: border-box; border:4px solid #fff; border-radius:2px; margin-top:-3px; vertical-align: middle; box-shadow: 0 0 0 1px #777 inset; border-top: none; border-bottom: none;}
.sitemapAccoList .d4Btn:before,
.sitemapAccoList .d4Btn:after {content: ''; position: absolute; top:4px; left:8px; width:1px; height:9px; background-color: #666; transition: transform 0.25s ease-in-out, background-color 0.25s ease-in-out, height 0.3s linear, width 0.3s linear, top 0.3s linear;}
.sitemapAccoList .d4Btn:after {left:4px; top:8px; width: 9px; height: 1px;}
.sitemapAccoList .on > a > .d4Btn:before {height: 1px; top:8px}
.sitemapAccoList .d4Btn:hover,
.sitemapAccoList .d4Btn:focus {box-shadow: 0 0 0 1px #0063cc inset;}
.sitemapAccoList .d4Btn:hover:before,
.sitemapAccoList .d4Btn:hover:after,
.sitemapAccoList .d4Btn:focus:before,
.sitemapAccoList .d4Btn:focus:after {transform: rotate(180deg); background-color: #0063cc}


/*=========================================== slide ==============================================*/
/* Slide Button */
.slide {opacity: 0;} 
.slide.on {opacity: 1;} 
.slide .btnPrev, .slide .btnNext {position: absolute; left:0; top:50%; width:60px; height: 60px; margin-top:-30px; z-index: 100; min-width: 0; padding:0; background: transparent url(../img/common/img_common.png) no-repeat -260px -176px; border:1px solid rgba(0,0,0,0.0); transition: border-color 0.15s ease-out, background-color 0.15s ease-out}
.slide .btnNext {left:auto; right:0; background-position: -320px -176px;}
.slide .btnPrev:hover, .slide .btnNext:hover, .slide .btnPrev:focus, .slide .btnNext:focus {background-color: rgba(0,0,0,0.1); border-color:rgba(0,0,0,0.5);}
.swiper-controls {position:absolute; display:inline-block; bottom:15px; width:100%; text-align: center; box-sizing: border-box; z-index: 100;}
.swiper-pagination {position:static !important; display: inline-block; white-space: nowrap; vertical-align: top}
button.swiper-pagination-bullet {position:relative; display:inline-block; width:21px; height:23px; margin:0; background: none !important; opacity: 1 !important; vertical-align: top}
button.swiper-pagination-bullet:before {content: ''; position: absolute; top: 7px; left: 5px; right: 6px; bottom: 6px; background-color: #000; opacity: 0.2; border-radius: 50%;}
button.swiper-pagination-bullet.swiper-pagination-bullet-active:before {opacity: 0.5}
button[class^=swiper-button-] {position:relative; display:inline-block; width:23px; height: 23px; margin:0 5px; border:1px solid rgba(0,0,0,0.5); border-radius: 3px; transition: background-color 0.15s linear, border 0.15s linear; vertical-align: top;}
button[class^=swiper-button-]:hover, button[class^=swiper-button-]:focus {background-color: rgba(0,0,0,0.1); border-color:rgba(0,0,0,0.8);}

button.swiper-button-stop:before, button.swiper-button-stop:after {content: ''; position: absolute; top:6px; left:7px; bottom: 6px; width:2px; background-color: rgba(0,0,0,0.5); transition:background-color 0.15s ease-out;}
button.swiper-button-stop:hover:before, button.swiper-button-stop:hover:after,
button.swiper-button-stop:focus:before, button.swiper-button-stop:focus:after {background-color: rgba(0,0,0,0.8);}
button.swiper-button-stop:after {left: auto; right: 7px;}
button.swiper-button-play {display: none}
button.swiper-button-play:after {content: ''; position: absolute; top: 6px; left: 8px; width: 0; height: 0; border-left: 7px solid rgba(0,0,0,0.5); border-right: 7px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0); border-top: 5px solid rgba(0,0,0,0); transition:border-color 0.15s ease-out;}
button.swiper-button-play:hover:after, button.swiper-button-play:focus:after {border-left-color: rgba(0,0,0,0.8);}

.whiteBullet.slide .btnPrev{background-position: -260px -115px;}
.whiteBullet.slide .btnNext {background-position: -320px -115px;}
.whiteBullet.slide .btnPrev:hover, .whiteBullet.slide .btnNext:hover, .whiteBullet.slide .btnPrev:focus, .whiteBullet.slide .btnNext:focus {background-color: rgba(255,255,255,0.2); border-color:rgba(255,255,255,0.5);}
.whiteBullet button.swiper-pagination-bullet:before {background-color:#fff; opacity: 0.4}
.whiteBullet button.swiper-pagination-bullet.swiper-pagination-bullet-active:before {opacity: 1}
.whiteBullet button[class^=swiper-button-] {border-color: rgba(255,255,255,0.5)}
.whiteBullet button[class^=swiper-button-]:hover, .whiteBullet button[class^=swiper-button-]:focus {background-color: rgba(255,255,255,0.2); border-color:#fff}
.whiteBullet button.swiper-button-stop:before, .whiteBullet button.swiper-button-stop:after {background-color:rgba(255,255,255,0.5);}
.whiteBullet button.swiper-button-stop:hover:before, .whiteBullet button.swiper-button-stop:hover:after,
.whiteBullet button.swiper-button-stop:focus:before, .whiteBullet button.swiper-button-stop:focus:after {background-color:rgba(255,255,255,1);}
.whiteBullet button.swiper-button-play:after {border-left-color: rgba(255,255,255,0.5);}
.whiteBullet button.swiper-button-play:hover:after, .whiteBullet button.swiper-button-play:focus:after {border-left-color:rgba(255,255,255,1);}

.longBullet button:focus {outline: none}
.longBullet button:focus:before {opacity: 1 !important;}
.longBullet button.swiper-pagination-bullet:before {border-radius: 5px; }
.longBullet button.swiper-pagination-bullet, .longBullet button.swiper-pagination-bullet:before {transition:all 0.2s ease-out}
.longBullet button.swiper-pagination-bullet-active {width: 44px;}
.longBullet button.swiper-pagination-bullet-active:before {width:auto; border-radius: 5px; opacity: 0.4;}

/* 리스트_카드형 */
.bbsCardBox {position:relative; width:175px; min-height:240px; padding:33px 25px 30px 30px; color:#333333; border:1px solid #dedede; border-radius:10px; box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.07);}
.bbsCardBox .titArea {min-height:197px;}
.bbsCardBox .titArea .cate {clear:both; display:inline-block; width:100%; font-size:16px; font-weight:bold;}
.bbsCardBox .titArea .tit {padding-top:10px; font-size:17px; line-height:24px;}	
.bbsCardBox .contArea {position:absolute;}
.bbsCardBox .contName {display:block; padding-bottom:10px; color:#666;}
.bbsCardBox .btnCArea {display:none;}

.bbsCardBoxOn:hover:before {content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0.7; border-radius:10px; background:rgba(25,114,209,0.97); }
.bbsCardBoxOn:hover {content:""; width:175px; border-radius:10px; background:rgba(25,114,209,0.97);}
.bbsCardBoxOn:hover .titArea {content:""; min-height:197px;}
.bbsCardBoxOn a:hover {color:#fff;}
.bbsCardBoxOn:hover .titArea .cate {content:""; opacity:0.3; font-size:16px;}
.bbsCardBoxOn:hover .titArea {min-height:197px;}
.bbsCardBoxOn:hover .titArea .tit {content:""; color:#fff;}
.bbsCardBoxOn:hover .contName {content:""; display:block; padding-bottom:10px; opacity:0.8;}	
.bbsCardBoxOn:hover .btnCArea {content:""; margin-top:15px;  content:""; display:block; position: relative; top:-55px; left:0;}
.bbsCardBoxOn:hover .btnCArea button.pdfDown {content:""; width:100%; color:#fff; font-size:15px; font-weight:bold; padding:7px 20px; border-radius:5px; border:1px solid #fff;}
.bbsCardBoxOn:hover .btnCArea button.pdfDown span {content:""; padding-right:40px; width:19px; height:16px; background:url('../img/common/ico_download_bbs.png') no-repeat right 2px;}


/* Chrome에서 글씨 흐리게 나오는 문제 해결 */
body:not(.isIE) .ipt.error + .subTxt, body:not(.isIE) .errorTxt {text-shadow: 0px 0px 0px rgba(255,0,0, 1);} 
body:not(.isIE) .iptGroup input[type="radio"]+label, .iptGroup input[type="checkbox"]+label, body:not(.isIE) [class^=txt] {text-shadow: 0px 0px 0px rgba(102,102,102, 0.5);} 
body:not(.isIE) .txtList {text-shadow: none;}
body:not(.isIE) .btnG.S {text-shadow: 0px 0px 0px rgba(0,0,0, 1);}
body:not(.isIE) .btnW.S {text-shadow: 0px 0px 0px rgba(0,0,0, 1);}
body:not(.isIE) .btnWB.S {text-shadow: 0px 0px 0px rgba(0,99,204, 1);}
body:not(.isIE) a.links:hover > span, body:not(.isIE) button.links:hover > span {text-shadow: 0px 0px 0px rgba(0,102,204, 0.8);}
body:not(.isIE) .header .gate li.on a, 
body:not(.isIE) .header .gate li a:hover, 
body:not(.isIE) .header .gate li a:focus {text-shadow: 0px 0px 0px rgba(0,0,0, 1);}

/* Chrome old 버전  */
.oldChrome .linkGroup, 
.oldChrome .progress ol,
.oldChrome .txtItem,
.oldChrome .colGroup, 
.oldChrome .phoneWrap, 
.oldChrome .btnGroup, 
.oldChrome .singleInfo ul.subInfo,
.oldChrome .btnArea {letter-spacing: 0}
.oldChrome .btnGroup, .oldChrome .txtItem {white-space: nowrap;}

.oldChrome .linkGroup > *, 
.oldChrome .progress ol > *,
.oldChrome .txtItem > *,
.oldChrome .colGroup > *, 
.oldChrome .phoneWrap > *, 
.oldChrome .btnGroup > *, 
.oldChrome .btnArea > * {/*margin:0 3px*/}
.oldChrome .phoneWrap > * {float: left;}
.oldChrome .phoneWrap:before, .oldChrome .phoneWrap:after {content: ''; display: table;}
.oldChrome .phoneWrap:after {clear: both;}

/* ie8 */
.bbs .links span:after {border-color: #fff}
.bbs .links span:hover:after {border-color: #0063cc}

/* 로고+텍스트 (웹비즈) */
.logoTxt {position:relative; margin-top:3px; /*overflow:hidden;*/}
.logoTxt > ul {margin:-30px -17px 0 -17px; letter-spacing:-2em;}
.logoTxt > ul > li {display:inline-block; width:20%; margin-top:30px; padding:0 17px; text-align:center; vertical-align:top; letter-spacing:0; box-sizing:border-box;}
.logoTxt .imgWrap {display: table; width:100%; height:110px; padding:10px 5px; background-color:#fff; border:1px solid #d2d2d2; border-radius:5px; box-sizing:border-box;}
.logoTxt .imgWrap .tblCell { display: table-cell; vertical-align: middle; text-align: center; height: 90px; }
.logoTxt .imgWrap .tblCell img {max-width:100%; max-height:90px;}
.logoTxt a.imgWrap{display:block;}
.logoTxt a.imgWrap:hover,
.logoTxt a.imgWrap:focus{border-color:#0050a6}
.logoTxt > ul > li .contWrap {padding-top:20px;}
.logoTxt > ul > li .contWrap a:not(.links) {position:relative; display:block; color:#666;}
.logoTxt > ul > li .contWrap a:focus span,
.logoTxt > ul > li .contWrap a:hover span {color:#0063cc; text-decoration:underline;}
.logoTxt.line { border-top: #666 2px solid; padding-top: 30px; }
.logoTxt .imgWrap .tbl {display:table; width: 180px; height: 90px; }
.logoTxt a.imgWrap .tbl {width: 100%;}

.logoTxt.div3 > ul {margin:-30px -40px 0 -40px;}
.logoTxt.div3 > ul > li {width:33.3333%; padding:0 40px;}

.logoTxt.div2 > ul {margin:-30px -20px 0 -20px;}
.logoTxt.div2 > ul > li {width:50%; padding:0 20px;}

.logoTxt > .imgWrap {display:inline-block; width:auto; vertical-align:top;}
.logoTxt > .contWrap {display:inline-block; margin:15px 0 0 17px; vertical-align:top;}


/*
.logoTxt.onlyImg ul {margin-top:-30px;}
.logoTxt.onlyImg li {margin-top:30px;}
*/

.oldChrome .logoTxt > ul {margin-left:-13px; margin-right:-13px; letter-spacing:0;}
.oldChrome .logoTxt > ul > li {width:17.5%; margin-left:12px; margin-right:12px; padding:0;}
.oldChrome .logoTxt.div2 > ul {margin-left:-40px; margin-right:-40px;}
.oldChrome .logoTxt.div2 > ul > li {width: 43%;margin-left: 41px;margin-right: 41px;padding:0;}
.oldChrome .logoTxt.div3 > ul{margin-left:-40px; margin-right:-40px;}
.oldChrome .logoTxt.div3 > ul > li {width:26%;margin-left: 43px;margin-right: 43px;padding:0;}
.oldChrome .ckCont .logoTxt li {width:226px; padding:0 13px;} /* 나눔재단 사회적기업 지원 부분 로고*/



/* == 사이트링크 리스트형 == */
.cntList.logoList { border-top: none; width: 100%;  }
.cntList.logoList > li:first-child { padding-top: 10px; }
.cntList.logoList > li .img { text-align: left; }
.cntList.logoList > li .img .tbl { display: table; width: 324px; height: 110px; padding: 10px; background-color: #fff; border: 1px solid #d2d2d2; border-radius: 5px; box-sizing: border-box; }
.cntList.logoList > li .img .tbl span { display: table-cell; vertical-align: middle; text-align: center; } 
.cntList.logoList > li .img .tbl span img { max-width:100%; max-height:90px; }
.cntList.logoList > li [class*=col_] { padding-right: 20px; }
.cntList.logoList li > [class*=col_]:not(.imgFull) [class*=titH]:first-child { margin-top: 0; }

/*  테이블박스 (웹비즈)*/
.whiteBoxWbiz {padding:20px 30px 26px; border:1px solid #666; border-radius: 8px; box-shadow:5px 5px 5px rgba(0,0,0,0.07);}
.squareBoxArea {padding:20px 15px; border:1px solid #d2d2d2;}


/* 테이블 Footer 기타사항(웹비즈)*/
.tableX thead tr.wbizLine:first-child th {border-top:1px solid #dedede;}
.tableX tfoot.wbizLine:before {content: ''; position: absolute; left:0; width:100%; height:9px; margin-top:1px; border-bottom:none;}
.tableX tfoot.wbizLineNo:before, tfoot.wbizLine1:before  {content: ''; position: absolute; left:0; width:100%; height:0; margin-top:1px; border-bottom:none;}
.tableX tfoot.wbizLine tr:first-child, tfoot.wbizLineNo tr:first-child, .tableX tfoot.wbizLine1 td:first-child {background:#f6f8fb; color:#333;}


/* 카드형 */
.cardList > li .cardWrap {position: relative; top:0; left:0; width: 184px; height: 240px; padding: 25px 25px 30px 30px; color: #333333; border: 1px solid #dedede; border-radius: 10px; box-shadow: 5px 5px 5px rgba(0,0,0,0.07); transition: all 0.2s ease-in-out; overflow: hidden;}
.cardList > li .cardWrap .cardDefault { color: #333; overflow: hidden;} 
.cardList > li .cardWrap .cardDefault .midCont .bold { color: #666; } 
.cardList > li .cardWrap .cardOver { color: #fff;} 
.cardList > li .cardWrap .cardOver .bottomCont { color: #fff; }
.cardList > li .cardWrap .cardOver .midCont .bold { color: #fff; } 

.cardList > li .cardWrap .cardTit {margin-bottom: 15px;}
.cardList > li .cardWrap .midCont { /*overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient:vertical; word-wrap:break-word; -webkit-line-clamp:4;*/ }
.cardList > li .cardWrap .bottomCont { position: absolute; bottom: 27px; left: 30px; color: #666; }

.cardList > li .cardWrap .cardOver { position: absolute; top: 0; bottom: 0; right: 0; left: 0; min-height: 240px; padding: 25px 25px 30px 30px; opacity: 0; transition: opacity 0.2s ease-in-out; box-sizing: border-box; border-radius: 10px; }
.cardList > li.on .cardWrap {top:-5px; left:-5px; box-shadow: 10px 10px 10px rgba(0,0,0,0.14); overflow: visible;}
.cardList > li.on .cardWrap .cardDefault {height: 270px; overflow: hidden; opacity: 1; z-index: 1}
.cardList > li.on .cardWrap .cardOver {z-index: 10; opacity: 1;}
.cardList > li.on .cardWrap .cardOver .midCont {height: 270px; overflow: hidden;}
.cardList > li.on .cardWrap .cardOver:before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #1972d1; opacity: 0.9;  z-index: -1; border-radius: 10px; } 
.cardList > li .cardWrap .cardOver .btnCArea {margin-top:15px; display:block; position: absolute; bottom: 27px; left:30px; right: 30px; }
.cardList > li .cardWrap .cardOver .btnCArea .down { display: block; box-sizing: border-box; margin-top: 5px; width: 100%; font-size: 15px; color: #fff; padding: 7px 20px; border-radius: 5px; border: 1px solid #fff; }
.cardList > li .cardWrap .cardOver .btnCArea .down span { display: block; width: 100%; text-align: left; box-sizing: border-box; padding-right: 30px; }
.cardList > li .cardWrap .cardOver .btnCArea .down span { position: relative; background: none !important;}
.cardList > li .cardWrap .cardOver .btnCArea .down span:after{content: '';display: block; position:absolute; right:-2px; top:4px; width:19px; height:16px; background: url(/img/common/img_common.png) no-repeat -531px -13px;}
.cardList > li .cardWrap .cardOver .btnCArea .down.link span { position: relative; background: none !important;}
.cardList > li .cardWrap .cardOver .btnCArea .down.link span:after{content: ''; display: block; position:absolute; right:0; top:6px; width:15px; height:12px; background: url(/img/common/img_common.png) no-repeat -531px 0px;}
.cardList > li .cardWrap .cardOver .btnCArea .dropMenuWrap.on .down,
.cardList > li .cardWrap .cardOver .btnCArea .down.hover,
.cardList > li .cardWrap .cardOver .btnCArea .down:hover { background-color: #fff; color: #0063cc; }
.cardList > li .cardWrap .cardOver .btnCArea .dropMenuWrap.on .down span,
.cardList > li .cardWrap .cardOver .btnCArea .down.hover span,
.cardList > li .cardWrap .cardOver .btnCArea .down:hover span:after { background-position: -531px -30px; }
.cardList > li .cardWrap .cardOver .btnCArea .dropMenuWrap.on .link span,
.cardList > li .cardWrap .cardOver .btnCArea .down.link.hover span,
.cardList > li .cardWrap .cardOver .btnCArea .down.link:hover span:after { background-position: -515px 0; }
.cardList > li .cardWrap .cardOver .btnCArea .down.col_w {display:inline-block; width:auto;}
.cardList > li .cardWrap .cardOver .btnCArea .down.col_w span {background:none; padding-right:0;}
.cardList > li .dropMenuBox {min-width: 239px;}
.cardList.cateType .cardOver .cardTit { opacity: 0; }

.cardList.onlyImg > li {text-align:center;}
.cardList.onlyImg > li .cardWrap {display:inline-block; width:auto; height:auto; padding:0; border-radius:5px; box-shadow: none !important; vertical-align:top;}
.cardList.onlyImg > li .cardWrap .cardOver {min-height:0;}
.cardList.onlyImg > li.on .cardWrap {top:0; left:0; /*overflow:hidden;*/}
.cardList.onlyImg > li.on .cardWrap .cardDefault {height:auto;}
.cardList.onlyImg > li.on .cardWrap .cardOver:before {border-radius:5px; top:-1px; bottom:-1px; left:-1px; right:-1px;}

#content.main .cardList > li .cardWrap {background-color: #fff}

/* 구성원소개 (리스트형 웹비즈) */
.memberList {margin: -30px -36px 0; letter-spacing:-2em;}
.memberList li {float: none; display: inline-block; width:25%; margin-top:30px; padding:0 36px; vertical-align: top; letter-spacing: 0; box-sizing: border-box;}
.memberList .imgWrap {width:228px; height:170px; border:1px solid #dedede; box-sizing:border-box; background:#fff;}
.memberList .imgWrap:before {display:none; }
.memberList .imgWrap img {text-align: center; max-width:226px; height:168px;}
.memberList .contWrap {padding-top:20px;}
.memberList .contWrap .txtWrap.line {padding-bottom:20px; border-bottom:1px solid #d2d2d2;}
.memberList .subInfo {margin-top:15px; font-size:14px;}
.memberList .subInfo + .subInfo {margin-top:30px;}
.memberList .subInfo em {display:block; position:relative;}
.memberList .subInfo em.bullet {padding-left:10px;}
.memberList .subInfo em.bullet:before {display: block; content: ''; position: absolute; top: 9px; left: 0; width: 3px; height: 3px; transform: rotate(0deg); background: #333;}
.memberList .subInfo span {display:block;}
.memberList .subInfo em.bullet + span {padding-left:10px;}

/* 서비스지연,점검,일반안내 팝업 */
.popNotice {padding-top:115px;}
.popNotice.delay {background:url('../img/common/bg_notice_delay.png') no-repeat 50% 0;}
.popNotice.check {background:url('../img/common/bg_notice_check.png') no-repeat 50% 0;}
.popNotice.general {padding-top:125px; background:url('../img/common/bg_notice_general.png') no-repeat 50% 0;}

/* imgBox */
.imgBox {padding:20px; background-color: #f9f9f9; border-radius:8px; text-align: center;}
.imgBox img {max-width: 100%;}
.imgBox.flow {padding:50px 30px;}
.imgBox.thumb {padding:30px; opacity: 0}
.imgBox.thumb.uiAct {opacity: 1}
.stepBox .imgBox.thumb {border-radius: 0}
.imgBox.noBg {background:none; padding: 0; border-radius: 0}
.imgBox > .brT{margin-top:20px; padding-top:20px; border-top:1px solid #e7e7e7;}

/*=========================================== 약관 =============================================*/
.termsArea { width: 100%; box-sizing: border-box; }
.termsArea.line { border-bottom: #dedede 1px solid; }
.termsArea .termsDetail { position: relative; border-top: #666 1px solid; }
.termsArea .termsDetail.on { border-top: #0063cc 2px solid; }
.termsArea .termsDetail .titBox { position: relative; box-sizing: border-box; background-color: #f6f8fb; padding: 15px 20px; font-size: 18px; color: #333; }
.termsArea .termsDetail .titBox .termsTit { line-height: 30px; }
.termsArea .termsDetail .titBox .agreeUserChk { display: inline-block; vertical-align: bottom; overflow: hidden; margin-left: 20px; width: 30px; height: 30px; background: url("../img/common/bg_agree_check_new.png") no-repeat 0 0; }
.termsArea .termsDetail .titBox .agreeUserChk > i { position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0); }
.termsArea .termsDetail .titBox .userMiss { display: block; }
.termsArea .termsDetail .titBox .userConfirm { display: none; }
.termsArea .termsDetail .titBox .checked { color: #0050a6; }
.termsArea .termsDetail .titBox .checked .agreeUserChk { background-position: 0 -30px; }
.termsArea .termsDetail .titBox .checked .agreeUserChk .userMiss { display: none; }
.termsArea .termsDetail .titBox .checked .agreeUserChk .userConfirm { display: block; }
.termsArea .termsDetail .titBox .btnGroup { position: absolute; top: 50%; right: 20px; margin-top: -15px; }
.termsArea .agreeScroll { width: 100%; border-top: #dedede 1px solid; box-sizing: border-box; overflow-y: scroll; height: 240px; max-height: 240px; background-color: #f8f8f8; padding: 25px 20px; font-size: 16px; }
.termsArea .agreeScroll + .titBox { border-top: #666 1px solid; }
.termsArea .agreeBox { border-top: #dedede 1px solid; position: relative; padding: 0 20px; min-height: 65px; box-sizing: border-box; }
.termsArea .agreeBox.bg {background-color:#f8f8f8;}
.termsArea .termsDetail.on .agreeBox { border-top: none; }
.termsArea .termsDetail.on .agreeBox + .agreeBox { border-top: #dedede 1px solid; }
.termsArea .agreeBox .box { clear: both; overflow: hidden; position: relative; border-top: #dedede 1px solid; padding: 20px 0; }
.termsArea .agreeBox .box:first-child { border-top: none; }
.termsArea .agreeBox .box.bdNone {padding-top:0;}
.termsArea .agreeBox .box .msg { float: left; width: 65%; }
.termsArea .agreeBox .iptGroup { float: right; text-align: right; }
.termsArea .agreeBox .iptGroup p strong { padding-right: 15px; }
.termsArea .agreeBox .box.checkBlock .msg { float: none; width: 100%; }
.termsArea .agreeBox .box.checkBlock .iptGroup { float: none; padding-top: 15px; text-align: right; }
.termsArea .agreeBox .box.checkRight { text-align: right; }
.termsArea .agreeBox .box.checkRight .msg { float: none; width: auto; display: inline-block; padding-right: 15px; }
.termsArea .agreeBox .box.checkRight .iptGroup { float: none; display: inline-block; text-align: right;}
.termsArea > .agreeBox { border-bottom: #dedede 1px solid; }
.termsArea > .agreeBox + .agreeBox { border-top: none; }
.termsArea .termsDetail:last-child > .agreeBox:last-child { border-bottom: #dedede 1px solid; }
.termsDate { padding: 20px 0 0; text-align: center; font-size: 20px; }
.termsDate.line { border-bottom: #dedede 1px solid; padding-bottom: 30px; }

/* 약관동의 : 유의사항 확인 */
.noticeChk { position: relative; border-top: #666 1px solid; border-bottom: #dedede 1px solid; background-color: #f8f8f8; }
.noticeChk.noTopLine { border-top: none !important; }
.noticeChk .noticeDetail { padding: 20px; overflow: hidden; }
.noticeChk .noticeDetail .txtList > li { margin-top: 5px; }
.noticeChk .noticeDetail.noticeScroll { max-height: 240px; overflow-y: scroll; }
.noticeChk .noticeDetail.noticeScroll + .agreeBox { margin-top: 0; }
.noticeChk .agreeBox { margin: 0 20px; border-top: #dedede 1px solid; }
.noticeChk .agreeBox .box { clear: both; overflow: hidden; min-height: 66px; box-sizing: border-box; position: relative; border-top: #dedede 1px solid; padding: 20px 0; }
.noticeChk .agreeBox .box:first-child { border-top: none; }
.noticeChk .agreeBox .box .msg { float: left; width: 65%; }
.noticeChk .agreeBox .box .msg.wAuto { width: auto; }
.noticeChk .agreeBox .iptGroup { float: right; text-align: right; }
.noticeChk .agreeBox .iptGroup p strong { padding-right: 15px; }
.noticeChk .agreeBox .box.checkBlock .msg { float: none; width: 100%; }
.noticeChk .agreeBox .box.checkBlock .iptGroup { float: none; padding-top: 15px; text-align: right; }
.noticeChk .agreeBox .box.checkRight { text-align: right; }
.noticeChk .agreeBox .box.checkRight .msg { float: none; width: auto; display: inline-block; padding-right: 15px; }
.noticeChk .agreeBox .box.checkRight .iptGroup { float: none; display: inline-block; text-align: right;}
.noticeChk .agreeBox .box.checkBig .iptGroup label { font-size: 18px; line-height: 30px; }
.noticeChk .agreeBox .box.checkBig .iptGroup input[type="checkbox"]:not(.def)+label:before { top: 1px; width: 30px; height: 30px; }
.noticeChk .agreeBox .box.checkBig .iptGroup input[type="checkbox"]:not(.def):checked+label:before { background: #0066cc url(../img/common/ico_checkbox_big.png) no-repeat -1px; }
.noticeChk .agreeBox .box.checkBig .iptGroup input[type="checkbox"]:not(.def):checked+label:after {
	content:''; position:absolute; top:1px; left:0; width: 30px; height: 30px; border-radius: 2px; background: #0066cc; z-index:2;
	-webkit-animation: chkmotionBig 0.25s 1 linear forwards;
	-moz-animation: chkmotionBig 0.25s 1 linear forwards;
	-ms-animation: chkmotionBig 0.25s 1 linear forwards;
	animation: chkmotionBig 0.25s 1 linear forwards;
}
@-webkit-keyframes chkmotionBig {0%{width: 30px; left:0}45%{width: 12px; left:16px;}75%{width: 12px; left:16px;}100%{width: 0; left:30px;}}
@-moz-keyframes chkmotionBig {0%{width: 30px; left:0}45%{width: 12px; left:16px;}75%{width: 12px; left:16px;}100%{width: 0; left:30px;}}
@-ms-keyframes chkmotionBig {0%{width: 30px; left:0}45%{width: 12px; left:16px;}75%{width: 12px; left:16px;}100%{width: 0; left:30px;}}
@keyframes chkmotionBig {0%{width: 30px; left:0}55%{width: 12px; left:16px;}65%{width: 12px; left:16px;}100%{width: 0; left:30px;}}
.noticeChk.detailNone { padding-top: 0; }
.noticeChk.detailNone .agreeBox { margin-top: 0; border-top: none; }

/* 약관 내용 */
.noticeChk pre, .termsArea pre {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; white-space:pre-wrap;}
.termsArea .agreeScroll .bgW {padding:20px; background-color:#fff; box-sizing:border-box;}
.termsArea .agreeScroll .titArea {margin-top: 30px;}


/*=========================================== error ==============================================*/
/*== 에러페이지(503,404) ==*/
.exceptionPage {display: table; width:100%; height: 100%; background-color: #fff !important; min-width: 800px}
.exceptionPage .errorMsg {display: table-cell; padding: 10px 0 60px; vertical-align: middle;}
.exceptionPage .errorMsg .btnArea {margin-top:60px} 
.errorMsg {padding: 50px 0 80px; text-align: center; letter-spacing: 0}
.errorMsg .kdbLogo {display: block; padding-bottom: 70px; margin: 0 auto;}
.errorMsg .errorTit {padding-top: 45px; font-size: 34px; color: #333; letter-spacing: -1px;}
.errorMsg .txtL {letter-spacing: 0}
.errorMsg .btnArea {padding-top:30px; border-top:1px #d2d2d2 solid;}
.errorMsg .finishBox + .btnArea { padding-top: 0; border-top: none; }
/*== 금융거래 일시중단 페이지 ==*/
.exceptionPage #content { min-height: auto; padding-bottom: 100px; }
.stopMsg { width: 100%; background: url(/img/common/img_page_stop.png) no-repeat center 0; }
.stopMsg p.msgArea { width: 1132px; height: 820px; margin: 0 auto; }
.browserSet { padding-top: 20px;}
.browserSet a { display: inline-block; width: 50px; height: 50px; margin: 0 10px; }
/* 브라우저 업그레이드 레이어 */
.popCont .browserSet { padding-top: 0; }
.popCont .browserSet a { height: auto; width: 80px; color: #666; margin: 0 5px; }
.popCont .browserSet a span { display: inline-block; font-size: 16px; padding-top: 20px}
.popCont .browserSet a:hover span,
.popCont .browserSet a:focus span { text-decoration: underline; color: #0063cc; }

/*=========================================== 로딩 ==============================================*/
.jexjs-indicator {display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; z-index: 9999999990; text-align: center; background: rgba(0, 0, 0, 0); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000,endColorstr=#00000000);}
.jexjs-indicator-bg {position: fixed; top: 0; left: 0; bottom:0; right:0; width: 60px; height: 60px; margin:auto; background-color:#fff; border-radius: 50%; overflow: hidden; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3)}
.jexjs-indicator-img:before {content:''; position:relative; display: block; width:100%; height: 100%; background: url(/img/common/img_common.png) no-repeat -195px 0; z-index: 2 }
.jexjs-indicator-img: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}

/* modal, active */
.jexjs-indicator.modal, .jexjs-indicator-target.modal {background: rgba(255, 255, 255, 0.4);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#40000000,endColorstr=#40000000);}
.jexjs-indicator.active, .jexjs-indicator-target.active {display: block;}
.jexjs-indicator-img:after {-webkit-animation: jexLoading 0.5s linear infinite; animation: jexLoading 0.5s linear infinite;}

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

/*=========================================== 퇴직연금 ==============================================*/
/* BRRGRK1000,BRGLRP1100 */
.tableView {border:1px solid #d2d2d2; border-radius: 7px;}
.tableView ul {display:table; table-layout: fixed; width:100%;}
.tableView ul li {display: table-cell; width:33.3333%; text-align: center; vertical-align: top;}
.tableView ul li + li {border-left:1px solid #d2d2d2;}
.tableView ul li strong {display: block; padding:35px 0; background:#f5f7fb; border-bottom:1px solid #d2d2d2;}
.tableView ul li p {position:relative; padding:37px 0;}
.tableView ul li p:before {content:''; display:block; position:absolute; top:-1px; left:50%; margin-left:-8px; width:34px; height:16px; background:url('../img/common/cnt/bg_arrow_box.png') no-repeat 0 0;}

/* 퇴직연금계산기*/
.calcWrap {display:table; position:relative; border-bottom:1px solid #dedede;}
.calcWrap:after {display:block; content:""; clear:both;}
.calcWrap > [class*=col_] {display:table-cell; vertical-align:top;}
.calcWrap .calcList {padding:0 30px; border-top:2px solid #0063cc; border-right:1px solid #dedede;}
.calcWrap .calcList:after {position:absolute; right:-13px; top:50%; width:13px; height:46px; margin-top:-23px; content:""; background:url('../img/common/bg_retire_calc.png') no-repeat 0 0; z-index:10}
.calcWrap .calcList li {padding:20px 0; border-top:1px solid #dedede;}
.calcWrap .calcList li.on {padding:30px 0;}
.calcWrap .calcList li:first-child {border-top:none;}
.calcWrap .calcList li a {display:block;}
.calcWrap .calcList li a .titH4 {display:block; margin-bottom:10px;}
.calcWrap .calcInfo {padding:30px 30px 30px 0; border-top:2px solid #666; background:#f8f8f8;}
.calcWrap .calcInfo li + li {margin-top:20px;}
.calcWrap .calcInfo ul li > label {display:inline-block; width:170px; color:#333; text-align:right; vertical-align:middle;}
.calcWrap .calcInfo.wEn ul li > label { width: 250px; }
.calcWrap .calcInfo label span {font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; color:#666; font-weight:normal;}
.calcWrap .calcInfo label + div[class*=col_] {margin-left:20px;}
.calcWrap .calcInfo label + div[class*=col_] + span { margin-left:10px; }


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

/*================= 웹비즈 공통 ====================*/
/* 상단 정보 영역 */
.fullBgGray{border-bottom:1px solid #dedede; background-color:#f8f8f8}
section.titArea .titWrap.line{padding-bottom:40px; border-bottom:1px solid #d2d2d2}
.topInfoWrap{position:relative; display:table; table-layout:fixed; width:100%; padding:30px 0 0; box-sizing:border-box}
section.titArea ~ section .topInfoWrap {margin-top: -10px; margin-bottom: -10px; padding-top: 0} /* wcms section에서 분리 작업중 임시 처리 */
.fullBgGray .topInfoWrap {padding-bottom:30px;}/* 기술거래마트 */
.topInfoWrap.infoBox{margin-top:20px !important; margin-bottom:0 !important; padding:25px 30px !important; border-radius:8px 8px}
.topInfoWrap.line{padding-bottom:30px; border-bottom:1px solid #d2d2d2}
.topInfoWrap:after{content:""; display:block; clear:both}
.topInfoWrap .full{width:100%}
.topInfoWrap .txtArea{display:table-cell; width:100%}
.topInfoWrap .txtArea > .date{margin-bottom:8px; font-size:16px; color:#666}
.topInfoWrap .txtArea > .tit{margin-bottom:8px; font-size:24px; color:#333}
.topInfoWrap .txtArea > .tit.txt34{margin-top:-10px}
.topInfoWrap .txtArea > .txt{font-size:16px; color:#666}
.topInfoWrap .txtArea > .nonList > li{font-size:16px; color:#666; line-height:25px}
.topInfoWrap .txtArea > .logoTxt {margin-top:26px;}
.topInfoWrap .btnArea{margin:18px 0 0 0; text-align:left; vertical-align:top}
.topInfoWrap .fileList{margin:18px 0 0 0; padding-left:0; text-align:left; vertical-align:top}
.topInfoWrap .imgArea{display:table-cell; width:333px; vertical-align:top; text-align:center}
.topInfoWrap .imgArea img{display:inline-block;}
.topInfoWrap .imgArea.left{width:340px; padding-right:40px; box-sizing:border-box; }
.topInfoWrap .imgArea.left .imgCont{width:300px; padding:20px; border:1px solid #d2d2d2; border-radius:8px 8px; box-sizing:border-box; }

/* 사이트제정 shapeBox > cntList */
.shapeBox.suggestion { padding-top: 0; }
.shapeBox.suggestion > .cntList {  border-top: none; border-bottom: none;  }
.shapeBox.suggestion > .cntList > li { padding: 40px 0 40px 60px; position: relative; }
.shapeBox.suggestion > .cntList > li .num { position: absolute; top: 40px; left: 0; font-size: 20px; color: #333;}
.shapeBox.suggestion > .cntList > li:last-child { border-bottom: none; padding-bottom: 0; }
.shapeBox.suggestion > .cntList + .cntList { border-top: #dedede 1px solid; margin-top: 40px; }

/* 박스 - 컨텐츠영역 */
.doubleBox {width:100%;}
.doubleBox .row {margin:0;}
.doubleBox > li .cont .inner {border-top:1px dashed #ccc;}
.doubleBox.unline > li .cont .inner {border-top:0; border-bottom:1px dashed #ccc;}
.doubleBox > li .cont .inner.brTNone{border-top:0}
.doubleBox > li + li {margin-top:20px;}
.doubleBox [class*=Box] {min-height:75px;}
.doubleBox [class*=col_] {float:none; display:table-cell; vertical-align:top;}
.doubleBox [class*=tit] {padding:25px 30px;}
.doubleBox .cont {padding-left:20px;}
.doubleBox .cont .inner {padding:25px 20px 25px 0;}
.doubleBox .row .col_3 {width:268px;}
.doubleBox .row .col_9 {width:864px;}
/* type2 */
.doubleBox.upLine [class*=Box] {height:110px;}

/* 디자인 체크박스 */
.radioInBox label{position: relative; display:block; padding:30px 40px; border: 1px solid #dedede; border-radius:8px; box-shadow: 5px 5px 5px rgba(0,0,0,0.07); box-sizing: border-box; text-align: center; }
.radioInBox label:before { content:""; display: inline-block; position:absolute; top:20px; left:20px; 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; }
.radioInBox 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;}
.radioInBox input[type="radio"] + label:hover,
.radioInBox input[type="radio"]:focus + label,
.radioInBox input[type="radio"]:checked + label{border: 1px solid #0063cc;}
.radioInBox input[type="radio"]:focus + label {outline-color: #333; outline-style: dotted; outline-width: 1px}
.radioInBox input[type="radio"] + label:hover:before,
.radioInBox input[type="radio"]:focus + label:before, 
.radioInBox input[type="radio"]:checked + label:before { background-position: center -38px; border: none; background-color: #d2eeff; }

.radioInBox label > strong{display:block; text-align:center}
.radioInBox label > .titH3 {padding-left:0; background:none;}
.radioInBox label > .txtArea{display:block; text-align:left; margin-top:20px; padding-top:9px; border-top:1px solid #dedede}
.radioInBox label > .txtArea .txt.bul{position:relative; display:block; margin-top:11px; padding-left:19px; letter-spacing:0; line-height:1.6em;}
.radioInBox label > .txtArea .txt.bul:before{display:block; content:''; position:absolute; top:11px; left:1px; width: 5px; height: 5px;  border-radius: 1px; transform: rotate(45deg); background: #333;}

/*================= 금융상품몰 ====================*/
/* Badge List 공통 */
.badgeList li { display: inline-block; /*padding-right: 5px;*/ }
.badgeList li .badge { padding-left: 8px; padding-right: 8px; background: none; display: inline-block; /*margin-left: -5px;*/ margin-right: 2px; }
.badgeList li span.tag { font-size: 14px; margin: 0 5px 0 0; }
.badgeList li span.tag:before { content: "#"; }

.badge.gl { border: #118000 1px solid; color: #118000; }
.badge.rl { border: #e00000 1px solid; color: #e00000; }
.badge.bl { border: #4960eb 1px solid; color: #4960eb; }
.badge.sbBg { border: #009add 1px solid; background-color: #009add !important; color: #fff; }
.badge.bBg { border: #0054ad 1px solid; background-color: #0054ad !important; color: #fff; }
.badge.gBg { border: #118000 1px solid; background-color: #118000 !important; color: #fff; }
.badge.oBg { border: #dc6800 1px solid; background-color: #dc6800 !important; color: #fff; }
.badge.pBg { border: #d6006d 1px solid; background-color: #d6006d !important; color: #fff; }
.badge.rBg { border: #e00000 1px solid; background-color: #e00000 !important; color: #fff; }
.badge.pRibon { border: #734df2 1px solid; background-color: #734df2 !important; color: #fff; position: relative; margin-right: 12px !important; }
.badge.pRibon:after { content: ""; width: 12px; height: 23px; background: url("../img/common/bg_badge_ribon.png") no-repeat; right: 0; position: absolute; top: -1px; right: -12px; }


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

/* ========= 인증센터 메인(wbiz Global - CHGLMN0100도 적용중) ========= */
/* === 타이틀 === */
.bcmnMainTit { padding: 60px 0 50px 0; margin: 0 auto !important; text-align: center; }
.bcmnMainTit .titWrap { display: inline-block; position: relative; }
.bcmnMainTit .titWrap h1 { display: inline-block; vertical-align: middle; font-size: 38px; }
.bcmnMainTit .titWrap .toggleRadio { float: right; margin: 8px 0 0 20px; }
.bcmnMainTit .titWrap .toggleRadio label { min-width: 64px; }
.bcmnMainTit .titWrap .toggleRadio input[type=radio]:checked + label { color: #4960eb; }

/* === 개인인증센터/기업인증센터 공통 === */
.fullBg { background-color: #f5f7fb; }
.bcTop { margin-top: -155px !important; padding: 155px 0 10px 0; }
.bcmnMain dt { padding-bottom: 14px; line-height: 1; font-size: 24px;}
.bcmnMain dt a { color: #333; padding-right: 18px; background: url("../../img/common/bg_main_arr.png") no-repeat right 50%; position: relative; }
.bcmnMain dt a:after { content: ""; position: absolute; bottom: 0; left: 0; right: 18px; border-bottom: 1px solid #0063cc; opacity: 0; }
.bcmnMain dt a:focus, .bcmnMain dt a:hover { color: #0063cc; background: url("../../img/common/bg_main_arr_on.png") no-repeat right 50%; }
.bcmnMain dt a:focus:after, .bcmnMain dt a:hover:after { opacity: 1; }
.bcmnMain dd { color: #666; font-size: 16px; letter-spacing: -.4px; }
.chgl .bcmnMain dt { line-height: 1.4; }
/* 하단 */
.bcBottom { padding-top: 50px; }
.bcBottom .infoBox { background-color: #f8f8f8; padding: 23px 28px; min-height: 225px; box-sizing: border-box; }
.bcBottom .infoBox h3 { padding-bottom: 15px; }
.bcBottom .infoBox.blue { background-color: #f1faff; background-position: 167px 70px; background-repeat: no-repeat; position: relative; }
.bcBottom .infoBox.blue.otp { background-image: url("../../img/common/bg_bc_otp.png"); }
.bcBottom .infoBox.blue.center { background-image: url("../../img/common/bg_bc_incenter.png"); }
.bcBottom .infoBox.blue .bcBt { position: absolute; bottom: 23px; left: 28px; right: 28px; border-top: #dedede 1px solid; text-align: center; padding-top: 15px; }
.bcBottom .infoBox.faq h3 { border-bottom: #666 1px solid; }
.bcBottom .infoBox.faq ul { padding-top: 20px; }
.bcBottom .infoBox.faq li { height: 28px; line-height: 28px; background: url("../../img/common/ico_q_s.png") no-repeat 0 50%; background-size: 30px; padding-left: 40px; margin-bottom: 10px; }
.bcBottom .infoBox.faq li:last-child { margin-bottom: 0; }
.bcBottom .infoBox.faq li a { display: inline-block; color: #666; position: relative; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bcBottom .infoBox.faq li a:after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; border-bottom: 1px solid #0063cc; opacity: 0; }
.bcBottom .infoBox.faq li a:focus, .bcBottom .infoBox.faq li a:hover { color: #0063cc; }
.bcBottom .infoBox.faq li a:focus:after, .bcBottom .infoBox.faq li a:hover:after { opacity: 1; }

/* === 개인인증센터 === */
.bcmnMain .shapeBox { padding: 30px; }
.bcmnMain .shapeBox .row.line { margin: 0 -30px; }	
.bcmnMain .shapeBox li { min-height: 155px; padding: 0 20px 0 30px !important; }
.bcmnMain .shapeBox li dl:nth-child(2) { margin-top: 15px; padding-top: 15px; border-top: #dedede 1px solid; }
.bcmnMain .shapeBox li .txtList li {min-height:20px; padding:0 0 0 19px !important;}
.bcmnMain .shapeBox li .txtList li + li {margin-top:5px;}
.bcmnMain .bcbpBox { padding: 0 30px; margin: 40px 0; }
.bcmnMain .bcbpBox .row.line { margin: 0 -30px; }	
.bcmnMain .bcbpBox li { min-height: 155px; padding: 0 20px 0 30px !important; }
.bcmnMain .bcbpBox li dl { text-align: center; padding-top: 110px; }
.bcmnMain .bcbpBox li dl.banksign { background: url("../../img/common/ico_bcmain_banksign.png") no-repeat center 0;}
.bcmnMain .bcbpBox li dl.bio { background: url("../../img/common/ico_cert_bio.png") no-repeat center 0;}
.bcmnMain .bcbpBox li dl.mobile { background: url("../../img/common/ico_cert_mobile.png") no-repeat center 0;}
.bcmnMain .bcbpBox li dl.fcert{background: url("../../img/common/ico_cert_fcert.png") no-repeat center 0;}

/* === 개선 24.11.19 === */
.bcmnMain .whBox:after{content:''; display:block; clear:both;}
.bcmnMain .whBox > li{float:left; width: calc(25% - 15px); padding-left: 20px;}
.bcmnMain .whBox > li:first-child{padding:0;}
.bcmnMain .whBox > li .boxInner{position: relative; height:220px; border:1px solid #d2d2d2;border-radius:8px;background-color:#fff; box-sizing:border-box;}
.bcmnMain .whBox > li .boxInner > a{position: relative; display:block; height:100%; padding: 20px; box-sizing:border-box; z-index: 10;}
.bcmnMain .whBox > li.rowBox .boxInner{height: 105px;margin-top:10px;}
.bcmnMain .whBox > li.rowBox .boxInner:first-child{margin:0;}
.bcmnMain .whBox > li.smart .boxInner{padding:20px 30px;}
.bcmnMain .whBox .txtInfo{position:absolute;bottom:20px;left:20px;font-size:16px !important;/* z-index: 999; */}
.bcmnMain .boxTit, .bcmnMain .smartTit{position:relative; display:block; font-size: 22px; color: #333;}
.bcmnMain .boxTit:after{content: "";position: absolute; top:10px; right:0; width:8px; height:14px; background: url("../../img/common/bg_main_arr.png") no-repeat right 50%;}
.bcmnMain .boxTit span{position:relative; display:inline-block; }
.bcmnMain .boxTit span:before {content: "";position: absolute;bottom: 0;left: 0;right: 0;border-bottom: 1px solid #0063cc;opacity: 0;}
.bcmnMain .boxInner a:focus span:before, .bcmnMain .boxInner a:hover span:before { opacity: 1; }
.bcmnMain .boxInner a:focus span, .bcmnMain .boxInner a:hover span{ color: #0063cc;}
.bcmnMain .boxInner a:focus .boxTit:after, .bcmnMain .boxInner a:hover .boxTit:after{background: url("../../img/common/bg_main_arr_on.png") no-repeat right 50%;}
.bcmnMain .smartTit{padding: 10px 0 25px 85px;}
.bcmnMain .smartTit:after{content: "";display: inline-block;position: absolute;top:0;left:0;width: 75px;height:80px;background: url("../../img/common/ico_cert_secure.png") no-repeat right;}
.bcmnMain a.arrLink{position:relative;display:inline-block;padding-right:18px; font-size: 22px;color: #0063cc;}
.bcmnMain a.arrLink:after{content: ""; position: absolute; top: 10px; right:0; width:8px; height:14px; background: url("../../img/common/bg_main_arr_on.png") no-repeat right 50%;}
.bcmnMain a.arrLink:before{content: ""; position: absolute; bottom: 0; left: 0; right: 18px; border-bottom: 1px solid #0063cc; opacity: 0; }
.bcmnMain a.arrLink:focus:before, .bcmnMain a.arrLink:hover:before{opacity: 1;}
.bcmnMain .bcbpBox.new dt{color:#333;}
.bcmnMain .bcbpBox.new li{min-height: 110px; padding: 0!important; text-align:center;}
.bcmnMain .bcbpBox.new li dl{position:relative; display:inline-block; margin-top:12px; padding: 0 0 0 80px; text-align:left; background:none;}
.bcmnMain .bcbpBox.new li dl.bio{margin: 25px 0 0 17px;}
.bcmnMain .bcbpBox.new li dl:before{content:'';position:absolute;top:5px;left:0; width:65px; height:65px;}
.bcmnMain .bcbpBox.new li dl.fcert:before{width:57px; height:67px; left:3px; background: url("../../img/common/ico_cert_fcert.png") no-repeat; background-size:100% auto;}
.bcmnMain .bcbpBox.new li dl.public:before{background: url("../../img/common/ico_cert_public.png") no-repeat; background-size:100% auto;}
.bcmnMain .bcbpBox.new li dl.bio:before{background: url("../../img/common/ico_cert_bio.png") no-repeat; background-size:100% auto;}
.bcmnMain .bcbpBox.new .guide_banner{position:relative; display:block; width:400px; margin:0 auto; padding:20px 30px; border-radius:8px; color:#fff; background-color:#0063cc; text-align:left;}
.bcmnMain .bcbpBox.new .guide_banner:after{content:''; position:absolute; top:30px; right:30px; width:80px; height:80px; background: url("../../img/common/bg_cert_guide.png") no-repeat; background-size: 100% auto;}
.bcmnMain .bcbpBox.new .guide_banner .tit{display:block; padding-bottom:15px;font-size:24px;}

/* === 기업인증센터 === */
.bcmnMain .bcbeBox { padding: 0 30px; }
.bcmnMain .bcbeBox .row.line { margin: 0 -30px; }	
.bcmnMain .bcbeBox li { min-height: 320px; padding: 0 20px 0 30px !important;}
.bcmnMain .bcbeBox li dl:nth-child(2) { margin-top: 15px; padding-top: 15px; border-top: #dedede 1px solid; }
.bcmnMain .bcbeBox li dl:first-child { padding-top: 153px; }
.bcmnMain .bcbeBox li dl.kdb { background: url("../../img/common/ico_cert_kdb.png") no-repeat center 18px; }
.bcmnMain .bcbeBox li dl.add { background: url("../../img/common/ico_cert_add.png") no-repeat center 18px; }
.bcmnMain .bcbeBox li dl.kdbRe { background: url("../../img/common/ico_cert_kdb_re.png") no-repeat center 18px; }
.bcmnMain .bcbeBox li .txtList li {min-height: 20px; padding:0 0 0 19px !important; background:none;}
.bcmnMain .bcbeBox li .txtList li + li {margin-top:5px;}
/* 스마트폰 인증서복사 */
.bcmnMain dl.smart { padding: 40px 100px; background: url("../../img/common/ico_cert_mobile_capy.png") no-repeat 0 50%; }
.bcmnMain dl.smart dd a { margin-left: 20px; }

/* === 웹비즈 global === */
.chgl .bcBottom .infoBox.blue.center { background-position: 440px 35px;}
.chgl .bcmnMain .shapeBox li {min-height:208px;}
.chgl .bcBottom .infoBox.faq .btnMore {position: absolute; top:30px; right:30px;}


/*=========================================== 고객센터 / Global 공통 ==============================================*/
/*== 보안설치 ==*/
.installBox{position:relative; border:1px solid #dedede; border-radius:8px;}
.installBox .topArea{padding:30px; border-bottom:1px solid #dedede}
.installBox .topArea:after{content:""; display:block; clear:both}
.installBox .row > li{padding:30px; text-align:center; border-left:1px solid #dedede}
.installBox .row > li:first-child{border-left:0}
.installBox .installTit{padding-top:98px; font-size:24px; line-height:1.2em; background:url('../img/common/ico_success.png') no-repeat center 0; color:#333}
.installBox .installTit.fail{background:url('../img/common/ico_fail.png') no-repeat center 0}
.installBox .installTxt{margin-top:23px}
.installBox .installTxt .bold {color:#333;}
.installBox .btnGroup{margin-top:20px}


/*=========================================== 신성장정책금융센터===========================================*/
/* 본문 가이드 */
.wSubInfo {margin-top:3px; border-top:2px solid #666;}
.wSubInfo.thinLine {margin-top:9px; border-top:1px solid #666;}
.wSubInfo.nonLine {margin-top:9px; border-top:none;}
.txt + .wSubInfo.nonLine {margin-top:18px;}
.scroll .wSubInfo:first-child {margin-top:0;}
.wSubInfo .titH4 {margin:22px 0 10px 0;}
.wSubInfo .titH5 {margin:22px 0 13px 0;}
.wSubInfo.nonLine .titH4 {margin:30px 0 10px 0;}
.wSubInfo .titH5 {position:relative; padding-left:20px; box-sizing:border-box;}
.wSubInfo .titH5:before {display:block; content:''; position:absolute; top:8px; left:2px; width: 9px; height: 9px;  border-radius: 1px; transform: rotate(45deg); border: 2px solid #333; box-sizing:border-box;}
.wSubInfo .titArea {margin:20px 0 7px 0; padding:0; min-height:0;}
.wSubInfo .titArea .titH4 {margin:0;}
.wSubInfo .contWrap .titH5:first-child {margin-top:0;}
.wSubInfo.nonLine .titH4:first-child {margin-top:0;}
.wSubInfo .contWrap [class*=Box] [class*=titH] {margin:0; padding:0;}
.wSubInfo .contWrap [class*=Box] [class*=titH]:before {display:none;}
.wSubInfo .contWrap {padding-bottom:26px; border-bottom:1px solid #e7e7e7; overflow:hidden;}
.wSubInfo .contWrap.bdBNone, .wSubInfo.nonLine .contWrap {padding-bottom:0; border-bottom:0;}
.wSubInfo .contWrap [class*=Box], .wSubInfo .contWrap table {margin-top:20px;}
.wSubInfo .contWrap [class*=Box]:first-child, .wSubInfo .contWrap [class*=titH] + [class*=Box],
.wSubInfo .contWrap table:first-child, .wSubInfo .contWrap [class*=titH] + table {margin-top:5px;}
.wSubInfo .paging .last {border-bottom:1px solid #555;}


/*================== 은행소개 ===================*/
/* 해외영업점 및 업무안내 */
.overseaMap {position:relative;}
.overseaMap a {position:absolute; height:22px; z-index:1; overflow:hidden; text-indent:-9999px; }
.imgBox .overseaMap { width:1017px; margin: 0 auto;}

/* 영업점검색 */
.grayBox.addrSrch {display:table; width:100%; padding:30px 0; text-align:center;}
.grayBox.addrSrch .chkWrap, .grayBox.addrSrch .iptWrap {position:relative; display:table-cell; min-width:382px; margin-right:0; padding-left:30px; box-sizing:border-box;}
.grayBox.addrSrch .chkWrap:after {position:absolute; top:0; bottom:0; right:0; content:""; border-left:1px solid #dedede;}
.grayBox.addrSrch .chkWrap .iptGroup {text-align:left;}
.grayBox.addrSrch .chkWrap .iptGroup div {width:32%; margin-top:2px; margin-right:0; box-sizing:border-box; vertical-align:top}
.grayBox.addrSrch .chkWrap .iptGroup div.w25 { width: 25%; }
.grayBox.addrSrch .chkWrap .iptGroup div.w38 { width: 38%; }
.grayBox.addrSrch .iptWrap {padding-right:30px; white-space: nowrap; text-align:left; vertical-align:middle;}

.addrResult:after {display:block; content:""; clear:both;}
.addrResult .addrList, .addrResult .addrMap {float:left; height:690px; box-sizing:border-box;}
.addrResult .addrList {width:384px; border:1px solid #dedede; border-top:2px solid #666;}
.addrResult .addrMap {position:relative; width:748px; border:1px solid #dedede; border-left:0; border-top:2px solid #666;}
.addrResult .addrList .addrListTop {padding:17px 30px; background-color:#f8f8f8; border-bottom:1px solid #dedede;}
.addrResult .addrList .inner {overflow-y:scroll; margin-bottom:-1px; height:563px;}
.addrResult .addrList .inner > ul > li {border-bottom:1px solid #dedede;}
.addrResult .addrList a {display:block; padding:20px 20px 20px 60px;}
.addrResult .addrList li.on a, .addrResult .addrList a:hover {background:#f5f7fb}
.addrResult .addrList .branch {position:relative; margin-bottom:10px; line-height:28px;}
.addrResult .addrList .branch > *, .addrResult .addrList .txtItem > * {color: #333;}
.addrResult .addrList .branch em {display:inline-block; position:absolute; left:-40px; top:0; width:30px; height:30px; background:#0063cc; border-radius:50%; color:#fff; text-align:center; line-height:28px;}
.addrResult .addrList .badgeList {margin-bottom:0; margin-top:13px;}
.addrResult .addrList .badgeList strong.badge.bl {margin-right:3px; background:#fff; font-size:13px; line-height:22px; margin-bottom: 3px; }
.addrResult .addrList .paging {height:65px; padding-top:15px; border-top:1px solid #dedede; box-sizing:border-box;}
.addrResult .addrList .paging .num {display:inline-block; min-width:100px; letter-spacing:0; vertical-align:middle;}
.addrResult .addrMap .aadrPop {position:absolute; left:133px; top:92px; width:482px; height:502px; border-radius: 5px; box-shadow: 5px 5px 5px rgba(0,0,0,0.1);}
.addrResult .addrMap .popCont.aadrPop .scroll {height:287px !important;}
.addrResult .addrMap .aadrPop .scroll > ul {margin-top:-5px;}
.addrResult .addrMap .aadrPop .scroll > ul > li + li {margin-top:10px;}
.addrResult .addrMap .aadrPop .scroll .txtItem {display:inline-block;}
.addrResult .addrMap .noResult{position:absolute; top:0; left:0; background:#f2f2f2; width:100%; height:100%; text-align:center;}
.addrResult .addrMap .noResult .noResultTxt{display:inline-block; margin-top:290px; padding-top:80px; font-size:16px; color:#333; background:url(../img/common/ico_addr_map_noresult.png) no-repeat center 0}

/* 영업점 영문일때 */
.en .addrResult .addrList {width: 100%;}
.en .addrResult .addrMap {display:none; position:absolute; width: 100%; left:0; right:0; background-color: rgba(255,255,255,0.5)}
.en .addrResult .addrMap .aadrPop {left:0; right: 0}

/* 부가서비스 - 윈도우팝업 영업점검색*/
body.windowPop .addrResult { display:table; width:100%; table-layout:fixed; }
body.windowPop .addrResult .addrList, body.windowPop .addrResult .addrMap { float: none; display: table-cell; vertical-align: top;}
body.windowPop .addrResult .addrMap { width: 100%; overflow: hidden;}
body.windowPop .popCont.aadrPop .popHeader { position: static; }
body.windowPop .addrResult .addrMap .popCont.aadrPop .scroll { padding: 0 30px 0; overflow: auto; }
body.windowPop .popCont.aadrPop > .btnArea { position: static; margin: 0 30px;}

pre.cmsArea, pre.preLine {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; white-space: pre-line;}


/*================= editor ====================*/
/* common */
.editor {color: #333;}
.editor h1 {font-size: 2em;}
.editor h1, .editor h2, .editor h3, .editor h4, .editor h5, .editor h6, .editor b {font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal !important; line-height: 1.6em}
.editor p, .editor strong, .editor span, .editor font, .editor div, .editor li, .editor dt, .editor dd, .context.editor h3, .context.editor h3 > span {font-size:16px; line-height:1.6em !important;}
.editor .refList > li, .editor .refList:not(ul) {font-size:14px !important;}
.editor .titH3 {font-size:24px !important;}
.editor p, .editor span, .editor strong, .editor ul, .editor dl {height:auto !important; padding-top:0 !important; padding-bottom:0 !important;} 
.editor div {margin-bottom:0 !important;}
.editor .normal, .editor span, .editor p, .editor font, .editor div, .editor li, .editor dl, .editor dt, .editor dd, .context.editor table thead ~ tbody td:not(.bg), .popup .compareTable span[style], .popup .compareTable p[style], .popup .compareTable span[style] {font-family:'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight:normal;}
.editor .bold, .editor table th, .editor table th *, .context.editor h3, .context.editor h3 > span, .mallDetailRight .noticeBox .cont.editor .titH6, .editor .tit2, .editor .tit3, .editor .titH3,
.editor p strong, .editor strong *, .editor b *, .csHELP .editor b, .csHELP .editor > p[style='font-weight: bold; color:#0063cc'], .csHELP .editor .location {font-family:'Roboto Medium', 'NotoSans Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal !important;}

.editor a:not(.btnWB) {position:relative !important; display:inline-block !important; text-decoration:underline;}
.editor a:not(.btnWB), .editor a:not(.btnWB) * {color:#0063cc !important; width:auto !important; }
.editor a:not(.btnWB) * {text-decoration:none !important;}
.editor a:not(.btnWB):hover, .editor a:not(.btnWB):hover *, .editor a:not(.btnWB):focus, .editor a:not(.btnWB):focus * {color:#004a99 !important;}
.editor a.links, .editor a.links > span {text-decoration:none !important;}

.editor table {position:relative; width:100% !important; margin-left:0 !important; table-layout:fixed; border-top:none !important; border-bottom:1px solid #dedede !important; text-align:center; color:#333; word-break:normal;}
.editor table:before {content: ''; position: absolute; left:-1px; top:0; bottom:0; border-left: 2px solid #fff;}
.editor table th, .editor table td {padding:15px 20px !important; border-left:1px solid #dedede !important; border-top:1px solid #dedede !important; border-color:#dedede !important; border-right:none !important; font-size:16px !important; vertical-align:middle;}
.editor table th {padding:16px 20px !important; background-color:#f6f8fb !important; border-top:none; color:#333;}
.editor table thead tr th {border-bottom:1px solid #d8d8d8;}
.editor table tbody tr:first-child > *, .editor table thead tr:first-child > * {border-top:2px solid #626364 !important;}
.editor table thead ~ tbody tr:first-child > * {border-top:none !important;}
.editor table .al, .editor table.al th, .editor table.al td, .editor table.tableY td {text-align:left;}

.editor .txtDot, .context.editor h3 {position:relative !important; margin-top:11px !important; padding-left:19px !important; letter-spacing: 0 !important; line-height: 1.6em !important; background:none !important;}
.editor .txtDot:before, .context.editor h3:before {display:block; content:''; position:absolute; top:11px; left:1px; width: 5px; height: 5px;  border-radius: 1px; transform: rotate(45deg); background: #333;}
.editor .refList:not(ul) + .refList:not(ul) {margin-top:0 !important;}

/* bbs */
.context.editor table {border-right:1px solid #dedede !important; color:#666;}
.context.editor table:before {content:none;}
.context.editor table tbody tr:first-child > *, .context.editor table thead tr:first-child > * {border-top:1px solid #dedede !important;}
/*.context.editor table td, .context.editor table td *, .context.editor table th, .context.editor table th * {}*/
.context.editor .btnArea {margin-left:0 !important; margin-right:0 !important; text-align:center !important;}
.context.editor table thead ~ tbody td:not(.bg) {background: none !important;}
.context.editor .grayBox {padding: 26px 20px;}


/* gallery */
.editor .galleryWrap .galleryThum li a,
.editor .galleryWrap .galleryThum li a img {display:block !important; width:140px !important;}
.editor .fileList a, .editor .fileList a:hover, .editor .fileList a:focus {color:#555 !important; text-decoration:none !important;}

/* mall */
.mallDetailRight .editor > *:first-child {margin-top:0 !important;}
.mallDetailRight .noticeBox .cont.editor .titH6 {padding:10px 0 !important;}
.mallDetailRight .noticeBox .cont.editor .titH6:first-child {padding-top:0 !important;}
.mallDetailRight .noticeBox .cont.editor .titH6 ~ .txt p, .mallDetailRight .noticeBox .cont.editor .titH6 ~ .txt span {font-size:14px !important;}
.popup .compareTable span[style], .popup .compareTable p[style], .popup .compareTable span[style] {font-size:16px !important;}

/* page */
.editor:not(li) > .tit2 {margin:27px 0 12px 0; padding:0 0 0 19px; clear:both; font-size:24px !important; line-height:1.458em !important; letter-spacing:-0.025em !important; color:#333 !important; background:url(../img/common/bul_h3.png) no-repeat 0 50%;}
.editor:not(li) > .tit3 {margin:30px 0 10px 0; font-size:20px; line-height:1.5em; letter-spacing:-0.05em; color:#333;}
.editor:not(li) > .tit2 + .tit3 {margin-top:22px !important;}

/* faq */
.accoContents .editor table:before {border-color:#f8f8f8 !important;}
.accoContents .editor table td {background-color:#fff;}

/* 상담용 도움말 */
.csHELP .editor table:before {border-color:#f8f8f8 !important;}
.csHELP .editor td {background-color:#fff;}
.csHELP .editor > p, .csHELP .editor > strong, .csHELP .editor > span {background:none !important; color:#666 !important;}
.csHELP .editor > p[style='font-weight: bold; color:#0063cc'], .csHELP .editor .location {color:#0063cc !important; text-decoration:underline;}

/*================= 상담용 작업 ====================*/
.csMode .csHide {display: none;}
.csMode html {background: #fff}
body.csMode:not(.ready) .csMainGnb {display: none}
.csMode *[class*=TYPE_], .csMode *[class*=cs_], .csMode *[class*=_case], .csMode *[class*=USETab_] {visibility: hidden;}
.csMode.ready *[class*=TYPE_], .csMode.ready *[class*=cs_], .csMode.ready *[class*=_case], .csMode.ready *[class*=USETab_] {visibility: visible;}
.csMode .br.logo > * {float:left; display:inline-block; vertical-align: middle; color:#fff; line-height: 20px;}
.csMode:not(.ready) .blind, .header.csMode:not(.onLoad) .blind {display: none;}
.csMode:not(.ready) .main .crumbArea, .header.csMode:not(.onLoad) .main .crumbArea {display: none;}
.csMode:not(.ready) .header .topArea .right, .header.csMode:not(.onLoad) .header .topArea .right {display: none;} 
.csMode .gnbArea .right li {color:#fff}

/* 인증서팝업 */
.csMode .popCertContain .popCont {width:452px; height:572px;}
.csMode .popCertContain .popCont [class*=csIpt] {display: block; position: absolute; width:187px; height:23px; right:64px; bottom:102px; border:none; background:none; box-sizing: border-box; padding: 0 5px;}
.csMode .popCertContain .popCont [class*=csCertBtn] {display: block; position: absolute; width:52px; height:25px; bottom:21px; cursor: pointer;}
.csMode .popCertContain .popCont .csCertBtn1 {left:169px;}
.csMode .popCertContain .popCont .csCertBtn2 {right:169px;}
.csMode .popCertContain.create .popCont {width:400px; height:auto;}
.csMode .popCertContain.create .popCont .csIpt1 {right:125px; bottom:95px; width:140px; height:26px;}
.csMode .popCertContain.create .popCont .csIpt2 {right:125px; bottom:61px; width:140px; height:26px;}
.csMode .popCertContain.create .popCont .csCertBtn1 {left:142px;}
.csMode .popCertContain.create .popCont .csCertBtn2 {right:144px;}
.csMode .popCertContain.manage .popCont {width:500px; height:auto;}
.csMode .popCertContain.manage .popCont .csCertBtn1 {left:193px;}
.csMode .popCertContain.manage .popCont .csCertBtn2 {right:193px;}
.csMode .popCertContain.copy01 .popCont, .csMode .popCertContain.copy02 .popCont {width:452px; height:auto;}
.csMode .popCertContain.copy01 .popCont .csIpt {right: 39px; bottom: 90px; width:293px;}
.csMode .popCertContain.copy01 .popCont .csCertBtn1 {left:126px; bottom:21px;}
.csMode .popCertContain.copy01 .popCont .csCertBtn2 {right:125px; bottom:21px; width:65px;}
.csMode .popCertContain.copy02 .popCont .csIpt1 {right: 300px; bottom: 340px; width:58px;}
.csMode .popCertContain.copy02 .popCont .csIpt2 {right: 230px; bottom: 340px; width:58px;}
.csMode .popCertContain.copy02 .popCont .csIpt3 {right: 160px; bottom: 340px; width:58px;}
.csMode .popCertContain.copy02 .popCont .csCertBtn1 {left:133px; bottom:22px;}
.csMode .popCertContain.copy02 .popCont .csCertBtn2 {right:133px; bottom:22px;}
.csMode .popCertContain.save .popCont {width:377px; height:auto;}
.csMode .popCertContain.save .popCont .csCertBtn1 {left:87px; bottom:45px; width:82px;}
.csMode .popCertContain.save .popCont .csCertBtn2 {right:90px; bottom:45px; width:82px;}

.csMode .popBankSignContain .popCont {width:405px; height:480px;}
.csMode .popBankSignContain .popCont [class*=csCertBtn] {display: block; position: absolute; cursor: pointer;}
.csMode .popBankSignContain .popCont .csCertBtn1 {top:248px; left:53px; width:296px; height:40px;}
.csMode .popBankSignContain .popCont .csCertBtn2 {top:4px; right:14px; width:30px; height:30px;}

/* 추가인증 */
.csMode .secuContents .accoList {border:none; margin-bottom: 30px; border-bottom: 1px solid #666;}
.csMode .addCertContain {border:none}
.csMode .addCertContain .accTopArea {padding: 0 0 13px 0;}

.csMode .secuContents .accoList .addCertContain.accoWrap .accoContents {border-top:none}
.csMode .addCertContain.accoWrap.on .accTopArea {border-bottom: none;}
.csMode .addCertContain .accoContents {background: none; padding: 0}

/* 보안수단 */
.secu1,.secu2,.secu3,.secu4,.secu5 {display: none}

[id*=xk_dialog] {z-index: 300 !important} /* 보안키패드 z-index 줄이기*/
.csMemo {display: none;}
.memoWrap {position:relative; z-index: 10}
.btnArea > .memoWrap {margin-left: 10px; margin-right: 10px;}
.btnArea > .memoWrap + button { margin-left: 0; }
.btnArea > .memoWrap + .memoWrap { margin-left: 0; }
.csMode .csMemo {position: absolute; left: -10px; right: auto;  display:inline-block; max-width:200px; margin: 10px; padding: 18px 10px 18px 30px; background-color: #fbed6f; font-size: 14px; color: #002665; box-shadow: 7px 7px 7px rgba(0,0,0,0.15); line-height: 1.25em; text-align: left;}
.csMode .csMemo.nowrap {white-space: nowrap; max-width: none}
.csMode .csMemo:before {content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 1px; height: 100%; border-right: 10px solid #ffd929;}
.csMode .csMemo:after {content: ''; position:absolute; top:0; right:-31px; width: 31px; height: 100%; padding-bottom:9px; background: url(/img/cs/bg_memo.png) no-repeat 0 bottom;}
.csMode .csMemo.titNext {position: relative; left:10px; margin:0;}
.csMode .csMemo.multiLine:not(.nowrap) {width:200px; text-align: center;}
.btnArea .memoWrap.full .csMemo {position: relative; max-width:none; top: 0 !important; left: auto !important; white-space: nowrap;}
.csMemo.fit {width: auto !important; max-width: none !important; box-sizing: border-box; left:0 !important; right:30px !important; margin-left: 0 !important; margin-right: 0 !important;}
.csMode .csMemo.fit.auto{left: 50% !important; transform: translateX(-50%);}
.csMemo.layerTit {left: auto; margin: 10px auto auto 10px;}
.csMode .titH4 .csMemo {position:relative; display:inline-block; top: -20px; left: 0px; margin-bottom: -20px; white-space: nowrap; max-width: none; vertical-align: top; } 

/* 그리드 */
.csGrid {position:relative; max-height:500px; overflow: hidden; border-top: 2px solid #626364; background-color: #fff}
.csGrid > .clfix {background-color: #F4F4F4; }

.csGridHeader {position: absolute; top:0; left:0; z-index: 2; overflow: hidden;}
.csGrid .tableX {position:relative; border-bottom: none}
.csGrid .tableX thead td {padding:6px 0 7px; border-bottom: 1px solid #d8d8d8; background-color: #f6f8fb; border-color:#c1d0ec; color:#333; cursor: pointer;}
.csGrid .tableX thead label {color:#333}
.csGrid .tableX thead td:hover, .csGrid .tableX thead td:focus {background-color: #e3eaf6} 

.csGridCont {position:relative; width:100%; min-height: 300px; max-height: 500px; overflow: auto; z-index: 1}
.csGrid .tableX tbody td {color:#666; padding: 16px 5px}
.csGrid .tableX tbody tr:nth-child(2n) td {background-color: #f8f8f8 }
.csGrid .tableX tbody td:focus {position:relative; outline: none; z-index: 1}
.csGrid .tableX tbody td:focus, .csGridLeft .tableX td:not(.redR):last-child:focus {border:1px solid #0063cc !important;}
.csGrid .tableX tbody td.over {background-color: #e2f1fc !important}
.csGrid .tableX tbody td.over:hover, .csGrid .tableX tbody td.over:focus {background: #fff !important}
.csGrid .tableX tbody tr:nth-child(2n) td.over:hover, .csGrid .tableX tbody tr:nth-child(2n) td.over:focus {background: #f8f8f8 !important}
.csGrid .tableX tbody tr:last-child td, .csGrid .tableX tbody tr td.last {border-bottom: 1px solid #d8d8d8;}
.csGrid .tableX tbody td.ar{padding-right:15px}
.csGrid .tableX tbody td.al{padding-left:15px}


.csGridSel .csGridHeader .tableX { border-bottom: none; }
.csGridSel .tableX tbody td {color:#666; padding: 16px 5px}
.csGridSel .tableX tbody tr:nth-child(2n) td {background-color: #f8f8f8 }
.csGridSel .tableX tbody td:focus {position:relative; outline: none; z-index: 1}
.csGridSel .tableX tbody td:focus, .csGridLeft .tableX td:not(.redR):last-child:focus {border:1px solid #0063cc !important;}
.csGridSel .tableX tbody td.over {background-color: #e2f1fc !important}
.csGridSel .tableX tbody td.over:hover, .csGrid .tableX tbody td.over:focus {background: #fff !important}
.csGridSel .tableX tbody tr:nth-child(2n) td.over:hover, .csGrid .tableX tbody tr:nth-child(2n) td.over:focus {background: #f8f8f8 !important}
.csGridSel .tableX tbody tr:last-child td {border-bottom: 1px solid #d8d8d8;}
.csGridSel .tableX tbody td.ar{padding-right:15px}
.csGridSel .tableX tbody td.al{padding-left:15px}


.csGridLeft {float: left; position: relative; width:100px; z-index: 3; box-sizing: border-box; overflow: hidden; background-color: #fff}
.csGridLeft .tableX td {border-right:1px solid #c0c0ff !important;}
.csGridLeft .tableX td:not(.redR):last-child {border-right:1px solid #c0c0ff !important;}
.csGridLeft tbody td {background-color: #fff;}
.csGridLeft .csGridCont {overflow: hidden;}
.csGridLeft thead td {border-bottom: none; padding-left: 0; padding-right: 0}

.csGridRight {position:relative;width: 1132px;background-color: #fff;}
.popWrap .csGridRight, .windowPop .csGridRight {width:100%;} 
.csGridLeft ~ .csGridRight {float: left; width:1032px;}
.csGridLeft ~ .csGridRight .tableX td:first-child {border-left:none}
.csGridLeft ~ .csGridRight .tableX:before {content: none}
.csGrid .csSort {width:18px; height:16px; margin-left:4px; background: url(/img/cs/sort0.gif) no-repeat 0 0; }

.csMode .hasSelect {position: relative; padding: 0}
.csMode .hasSelect select {position: absolute; top:0; left: 0; right: 0; bottom: 0; width:100%; height:100%; box-shadow: none; border: 1px solid rgba(255,255,255,0); border-radius: 0}
.csMode .hasSelect select:focus {border:1px solid #0063cc;}
.csGrid .btnGroup .dropMenuWrap, .csGrid table .dropMenuWrap, .csGrid [class*=Box] .dropMenuWrap {z-index: 1}
.csGrid .btnGroup .dropMenuWrap.on, .csGrid table .dropMenuWrap.on, .csGrid [class*=Box] .dropMenuWrap.on {z-index: 500}
.csGrid .dropMenuWrap.al .dropMenuBox.col_3 {width:288px !important;}
.csGrid .dropMenuWrap .links > span.red:after {border-bottom: 1px solid #e00000;}

.csGridPop select[multiple="multiple"] {width:100%; height:254px; padding:0; background:none;}
.csMode .popCont > .scroll.on:focus {outline: none}
.csMode .csGrid.savePop {max-height: 200px;}
.csMode .csGrid.savePop .csGridCont {min-height:0; max-height: 200px;}
.csMode .header .lang.ko {display: none;}
.csMode #content .csCtrl {visibility: hidden; width: 0; height: 0; overflow: hidden; z-index: 0; position: absolute; top: -10000px; left: -10000px; text-indent: -9999px; }

.en .csMode .header .lang.en, .en .csMode .header .KDB_CMS {display: none;}
.en .csMode .header .lang.ko {display: block;}
.csMode .header .gnb li a.pass {display: none; cursor: default;}
.noticeWrap .caseBox {display: block !important;}

#UploadFullDlg .tableX tr th {padding:0px !important;} 
#UploadFullDlg .tableX tbody tr td {padding: 5px 10px !important;} 

/*=========================================== 영문 ==============================================*/
.en .gnb .depthTit {letter-spacing: -0.005em}
.en .ui-datepicker th {font-size: 12px;}
.en .monthPicker .links {font-weight: normal;}
.en .monthPicker .btnArea .btnW, .en .ui-datepicker .btnArea .btnW {font-family: 'Roboto Light', 'NotoSans Light', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important; font-weight: normal !important; font-size:12px;}
.en .ipt.unit{padding-right:60px}



/*=========================================== 기업 체험관 ==============================================*/
.beExperience { max-width: 1072px; position: relative; }
.beExperience .row { margin-left: 0 !important; margin-right: 0 !important; }
.beExperience .stepBox.vertical .imgBox.thumb.col_6 { float: left; width: 622px; max-width: none; margin-left: 0; margin-right: 0 }
.beExperience .row > [class*=col_].step { float: right !important; width: 430px; max-width: none; padding-left: 0; padding-right: 0; }
.beExperience .stepBox.vertical > li:first-child { border: 0 !important; padding: 0; }
.beExperience .stepBox.vertical > li { border: 0 !important; padding: 0 !important; }
.beExperience .stepBox > li:before { display: none; }
/* BTN */
.beExperience > 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; }
.beExperience > 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;}
.beExperience > button.peExPrev { left: 0; }
.beExperience > button.peExNext { right: 0; }
/* BTN hover/focus*/
.beExperience > button.peExPrev:after { background-position: 0 0; }
.beExperience > button.peExNext:after { background-position: -54px 0; }
.beExperience > button.peExPrev:hover:after, .beExperience > button.peExPrev:focus:after { background-position: 0 -54px; }
.beExperience > button.peExNext:hover:after, .beExperience > button.peExNext:focus:after { background-position: -54px -54px; }
/* BTN disabled */
.beExperience > button:disabled {opacity: 0.4; cursor: default;}
.beExperience > button.peExPrev:disabled:hover:after, .beExperience > button.peExPrev:disabled:focus:after { background-position: 0 0; }
.beExperience > button.peExNext:disabled:hover:after, .beExperience > button.peExNext:disabled:focus:after { background-position: -54px 0; }
/* rolling on */
.beExperience.on { padding: 0 30px; box-sizing: border-box; }
.beExperience.on .stepBox.vertical .imgBox.thumb.col_6 { width: 588px; }
.beExperience.on .row > [class*=col_].step { width: 360px; margin-right: 40px; }
.beExperience.on > button { display: block; }



/*=========================================== 통합검색 ==============================================*/
body .ui-menu{display:block; position:absolute; top:45px; left:0; width:378px; max-height:358px; padding:12px 18px; border:1px solid #0068d4; border-radius:0 0 4px 4px; background-color:#fff; color:#333; box-sizing:border-box; font-size:16px; box-shadow:3px 3px 6px 0px rgba(0,0,0,0.1);overflow:auto; z-index:5}
body .ui-menu > li{position:relative; padding-left:10px; padding-bottom:5px}
body .ui-menu > li:before{display: block; content:''; position:absolute; top:9px; left:1px; width:3px; height:3px; border-radius:1px; transform:rotate(45deg); background:#666;}
body .ui-menu > li .links{display:inline-block; line-height:22px; color:#666; border:0}
body .ui-menu > li .links .pointC1{color:#0063cc !important}
body .ui-menu > li .links.ui-menu-item-wrapper{padding:0;}
body .ui-menu > li .links.ui-state-active {margin:0; background-color: #eee !important}
body .ui-menu > li .links:after{content:""; display:none; clear:both}
body .ui-menu > li .links:hover{color:#0063cc;}
body .ui-menu > li .links:hover:after{display:none}
body .ui-menu > li .links > span{position:relative; float:left; display:inline-block; padding-left:15px; border-bottom:1px solid #fff}
body .ui-menu > li .links > span:after{display:none}
body .ui-menu > li .links > span:before{content:""; display:block; position:absolute; top:0; left:0; width:15px; height:22px; padding-left:3px; background:url('../img/common/bul_sitemap_arrow.png') no-repeat 3px center;}
body .ui-menu > li .links > span:first-child:before{display:none}
body .ui-menu > li .links > span:first-child{padding-left:0}
body .ui-menu > li .links:hover > span,
body .ui-menu > li .links:focus > span{color:#0063cc; border-bottom:1px solid #0063cc;}
body .ui-menu > li .links:hover > span:before,
body .ui-menu > li .links:focus > span:before{color:#0063cc; border-bottom:1px solid #0063cc; background:url('../img/common/bul_sitemap_arrow_on.png') no-repeat 3px center;}


/*=========================================== 오픈뱅킹 ==============================================*/
.tableX .openAcc{display:block;}
.tableX .date{display:block;}

.openArea{position:relative; min-height:34px; margin:10px 0 0 0; box-sizing: border-box;}
.titArea .titH3 ~ .utilBtnWrap.openUtilBtn {top:2px;} 
.titArea .openDesc{display:block !important; padding-left:11px; color:#d6006d; font-weight:bold;}

.openUtilBtn > p { display: inline-block; margin-right: 15px; }
.openUtilBtn > div.customSlt { display: inline-block; }

.fixBtnArea > .btnW{position: absolute; right:0; top:-50px}

/* 재조회 */
.openName{vertical-align: middle; margin-right:5px;}
.openName img{width:20px; margin-right:3px;}
.icoTxtopenReload {position:relative; padding-bottom:1px; background:none; font-size:13px; padding:0 3px 0 16px; border:1px solid #dedede; border-radius: 5px;}
.icoTxtopenReload:before {content:''; position:absolute; top:50%; left:3px; width:10px; height:11px; margin-top:-5px; background: url(../img/common/ico_open_reload.png) no-repeat 0 center;}
.icoTxtopenReload:hover:before {transform:rotate(360deg); transition: transform 0.5s;}


/* btn: 다른 은행계좌에서 조회하기/다른 은행계좌에서 이체하기 191209 */
[class^=btn].icoTxtopen.S {padding-left: 35px; border:1px solid #4960eb; background-color: #4960eb; background-image: url("../img/common/ico_openbanking.png"); background-repeat: no-repeat; background-position: 12px 50%; color:#fff;}


/* tooltip 위치 */
table .openTip{margin-right:0;}
.openTip .tipWrap .help{top:-3px;}

/* 출금이체 ci 추가 20.04.16(정현아) */
.opennum img{width:20px;}
.opennum img, .opennum .subTxt, .opennum strong{vertical-align: middle;}
/* thead 고정 스크롤 테이블 20.08.11(정현아)*/
.fixedTableWrap{position:relative; width:100%; padding-top:57px; height:auto; }/* height로 스크롤 범위 수정*/
.fixedTableWrap .fixedTable{max-height:550px; overflow-x: hidden; overflow-y: auto;}
.fixedTableWrap .fixedTable table{position:static;}
.fixedTableWrap .fixedTable table thead{position:absolute; top:0;}

/* 상단 고정 팝업 20.08.18(정현아) */
.fixedArea .itemList{overflow-x:hidden !important; overflow:visible; max-height: 367px;}
.fixedArea .itemList .tableX thead tr:first-child th {border-top:1px solid #d8d8d8;}

/* 퇴직연금 사전지정운용제도 도입을 위한 시스템 개발 2023-05-09 */
.w80p { width:80px !important; }
.w100p { width:100px !important; }
.w180p { width:180px !important; }
.wauto { width: initial !important; }
.detable_yes {  position: relative; }
.detable_yes:after { content:''; position:absolute; top:15px; left:45px; display: block; width:18px; height: 18px; border:solid 2px #008bf1; border-radius: 50%; }
.detable_no { width:30px; height:30px; position: relative; }
.detable_no:before, .detable_no:after { content:''; position: absolute; top:20px; width: 2px; height: 20px; background-color: #d6006d }
.detable_no:before { transform:rotate(45deg);}
.detable_no:after { transform:rotate(-45deg);}

.irpJoinSelect.default > .col_3 { width: 33.33333%; max-width: 383px !important; }
.irpJoinSelect.default > .col_3, .irpJoinSelect.portfolio > .col_4 { position: relative; padding: 50px 10px; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center;  }
.irpJoinSelect.default > .col_3 .blueBox { border: 2px solid #0063cc; }
.irpJoinSelect.default > .col_3 .blueBox .irpSelTit span {display:block; padding:25px 0 10px; height: 75px;max-height: 75px;}
.irpJoinSelect.default > .col_3 .blueBox .irpSelTit { font-size: 20px; }
.irpJoinSelect.default > .col_3 .blueBox .defult_txt { position: relative; text-align: center; }
.irpJoinSelect.portfolio > .col_4 .blueBox .defult_txt { position: relative; text-align: center; }
.irpJoinSelect.portfolio > .col_4 .blueBox .irpSelTit span { padding: 20px 0 10px; height: initial; }
.irpJoinSelect.default > .col_3 .blueBox .defult_txt li { font-size:15px; }
.irpJoinSelect.default > .col_3 .blueBox .defult_txt .sm { font-size:13px; }
.irpJoinSelect.default > .col_3 .blueBox .defult_txt .bold { font-size: 20px; }
.irpJoinSelect.default > .col_3:after {content: "";width: 80px;height: 80px;position: absolute;top:0;left: 80%;margin-left: -155px;background: url("../img/common/ico_cert_internet.png") no-repeat 0 0;}
.irpJoinSelect.portfolio > .col_4 .blueBox { padding-top:25px; height: 430px; }
.irpJoinSelect.portfolio > .col_4:after { margin-left: -40px; background: url("../img/common/ico_cert_internet.png") no-repeat 0 0 !important;}

.portfolio { display:flex; justify-content: center; flex-direction: row; align-items: center; }
.portfolio .fontsm { font-size: 14px; color:#000000; }
.portfolio .arrow { width: 35px; height: 35px; position: relative; margin:0 30px 0 50px;  }
.portfolio .arrow:before,  .irpJoinSelect .arrow:after { content: ''; position:absolute;  }
.portfolio .arrow:before { width: 100%; height: 100%; border:3px solid #cccccc; border-right:0; border-bottom:0; }
.portfolio .arrow:after { width:70px; height:3px; background-color:#cccccc; transform-origin:0 100%; transform: rotate(45deg);  }
.portfolio .arrow.right { transform:rotate(135deg); }
.portfolio .btop { border-top: 1px dotted #666; margin-top: 15px; padding-top:15px}
.portfolio .btop p { width: 312px; font-size: 14px; display: flex; justify-content: space-between;}
.portfolio .btop p > span:first-child { width:275px; }

.stepbrrgig4 {width: 100%;}
.stepbrrgig4 li { float: left; position: relative; width: 25%; height: 63px; padding: 10px 16px 0; box-sizing: border-box; } 
.stepbrrgig4 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%;}
.stepbrrgig4 li:first-child:before{left:0px;}
.stepbrrgig4 li.w50 {width:50% !important}
.stepbrrgig4 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%;}
.stepbrrgig4 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;}

.mallDetailLeft .accoWrap button {display: block; position: relative; width: 100%; height: 59px; text-align: left; font-size: 18px; color: #666; border-bottom: #dedede 1px solid;}
.mallDetailLeft .accoWrap 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 .accoWrap button:hover:after,
.mallDetailLeft .accoWrap button:focus:after {transform:rotate(180deg); transition: transform 0.25s;}
.mallDetailLeft .accoWrap .fileList { padding:20px 15px; }
.mallDetailLeft .accoWrap.on button { color: #0063cc; border-bottom: #0063cc 1px solid; }
.mallDetailLeft.fixed .accoWrap button { height: 45px;}
.mallDetailLeft .leftTip {display:none; position: absolute; left: 268px; top: 50%; max-width: 350px; padding: 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 .leftTip:focus {outline-style: dotted; outline-color: #666; outline-width: 1px}
.mallDetailLeft .leftTip a { display: inline-block; width: 100%; line-height: 40px !important; height: 40px !important; padding: 0 20px 0 40px !important; }
.mallDetailLeft .leftTip a:before { top: 50% !important; left: 15px !important; margin-top: -8px; }
.mallDetailLeft .leftTip a:hover, 
.mallDetailLeft .leftTip a:focus { background-color: #f2f2f2; color: #666 !important; text-decoration: none !important; }
.mallDetailLeft.fixed .leftTip .here { display: block;}
.mallDetailLeft .leftTip .here { display: none; width: 9px; height: 14px; position: absolute; left: -9px; top: 8%; margin-top: -7px; background: url(../img/common/cnt/ico_left_tip_box.png) no-repeat center center; z-index: 2;}
.fileList2 {position:relative; padding-left:30px;}
.fileList2 .label{position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}
.fileList2 [class^=btn] {font-family: 'NotoSans Light' !important;position:relative; padding:0 20px 0 45px; margin-right:5px; margin-bottom:10px; line-height: 38px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.fileList2 [class^=btn]:before {content: ''; position:absolute; top:12px; left:17px; width:20px; height: 16px; background: url('../img/common/ico_file.png') no-repeat 0 center;}
.fileList2.noLine { padding-left: 0; }
.fileList2.noLine li { padding: 0 10px; }
.fileList2.noLine > li > ul > li { display: list-item; position: relative; margin-top: 11px; padding-left: 19px; letter-spacing: 0; line-height: 1.6em;}
.fileList2.noLine li > ul > li:before { display: block; content: ''; position: absolute; top: 11px; left: 1px; width: 5px; height: 5px; border-radius: 1px; transform: rotate(45deg);background: #333;}
.fileList2.noLine [class^=btn] { border: none; margin-bottom: 2px; padding: 0 16px 0 35px; height: auto; line-height: 1.9; }
.fileList2.noLine [class^=btn]:before { top: 8px; left: 5px; }
.fileList2 .btnTxt {height:auto !important; margin:0 !important; padding:0 0 0 30px !important; background:none; color:#666; text-align:left; line-height:1.5em !important;}
.fileList2 .btnTxt:hover, .fileList .btnTxt:focus {color:#0063cc; text-decoration:underline;}
.fileList2 .btnTxt:before {top:5px !important; left:0 !important;}
.fileList2 .tit {display:inline-block; vertical-align:top; color:#333;}
.fileList2 .tit + .btnTxt {vertical-align:top;}
[class*=cntList] .fileList2 {padding-left:0;}
.fileList2 [class^=btn].down:before {background: url('../img/common/ico_download.png') no-repeat 0 center;}
.bbsBtn.pdf, .fileList2 [class^=btn].pdf:before, .bbs .fileItem .item.pdf:before { background-position: -60px center;}
.leftTip .listClose {position: absolute; top:5px; right: 5px; width:30px; height: 30px; z-index: 100; }
.leftTip .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}
.leftTip .listClose:hover:before, .leftTip .listClose:focus:before {transform:rotate(-90deg); background-position: 0 bottom;}
.leftTab li.fileArea .leftTip .icoBtnClose {top: 0; right: 0; width: 36px; height: 36px; background-position: center center;}
.mallDetailLeft.fixed .leftTab li.fileArea.open .leftTip {display: block;}
.mallDetail .Wrap_more { border-top: #dedede 1px solid; padding-top:10px; }

.pointdc1 {color: #1f3fb6 !important; }
.pointdc2 {color: #00930A !important; }
.pointdc3 {color: #887e00 !important; }
.pointdc4 {color: #ff3e00 !important; }
.pointdc5 {color: #FF0000 !important; }

.popService .title02 { font-size: 34px; color: #fff; position: relative; width: 1192px; margin: 0 auto; padding-top: 30px; font-weight:600; }
.popService .title02 .serviceBtnClose { top:40px; }
.borderbt { position: relative; border-top: 1px dotted #666; padding: 40px 0 60px; }
.borderbt .flex { display: flex; margin:15px 0; }
.borderbt .flex li { display: table; table-layout: fixed; width:50%; height: 120px;box-sizing: border-box;}
.borderbt .flex li:nth-child(1) { background: url('../img/common/ico_lon_info2.png') no-repeat; padding: 30px 130px 0;}
.borderbt .flex li:nth-child(2) { background: url('../img/common/ico_lon_info1.png') no-repeat; padding: 30px 130px 0;}
.popOption .alignf { display: flex; align-items: center;}
.topProduct .productTit.df { padding:30px; height: 250px; }
.topProduct .productTit.df > .txt { font-size: 16px; left:20px; bottom:inherit; top:125px; width:1000px; }
.topProduct .productTit.df .summary { margin-top:100px; }

.usList .shapeBox .usListBt {position: absolute; bottom: 35px; left:30px}
.usList.type3 .shapeBox .titH4 {min-height: 20px;}
.usList.type3 .shapeBox { background-position: 250px 25px;}
.usList.type3 .shapeBox.item1 {background-image: url('../img/common/ico_nf_etc8_on.png');}
.usList.type3 .shapeBox.item2 {background-image: url('../img/common/ico_uslist08.png');}
.usList.type3 .shapeBox.item3 {background-image: url('../img/common/ico_login_custom.png');}

.btn_wrap button { margin-bottom:5px; margin-left: 0 !important;}
.appoint { position:absolute; right:30px; display: inline-block; border-radius: 25px; font-size: 12px; box-sizing: border-box; width: 50px; height:20px; line-height:20px; text-align: center; background-color: #568cd4; color: #666;  font-weight: normal}

.appoint .check { color: #fff; border-color: #568cd4; }
.rel .tip { vertical-align: top; margin-left: 5px; }
.pd5.tableX th, .pd5.tableX td { padding:10px 10px; }
.links_def { color: #0063cc; text-decoration:underline; }
.links_def:hover, .links_def:focus {background-color: rgba(0,138,255,0.05);} 

/* 퀵메뉴 상담팝업 */
.customNumList {margin:20px 0 0 20px;}
.customNumList:after {content:""; display:block; clear:both;}
.customNumList > li {float:left; width:50%; text-align:left;}
.customNumList > li .tit {display:inline-block; margin-bottom:10px; padding:2px 10px; font-size:14px; color:#fff; border-radius:2px;}
.customNumList > li.domestic .tit {background-color:#d6006d}
.customNumList > li.oversea .tit {background-color:#4960eb}

/* 금융계산기-대출  */
.unitDouble span { display: block !important; position: absolute; top: 1px; left: 5px; height: 38px; padding: 0 10px; line-height: 38px; }
.unitDouble span + .ipt.unit { padding-left: 40px; }

/* 개인정보처리방침 2023개편*/
.labeling.whiteBox {background:#fff; border-color:rgb(222, 222, 222);}
.labeling .titH4 {border-bottom:1px solid rgb(222, 222, 222);}
.labelingImg {width:auto; height:88px;}
.labelingImg+p {margin-top:5px;}
.labelingImg+p>span {display:block;}

.privacyWrap {font-size:16px; letter-spacing:0; line-height:1.6em;}
.privacyWrap > article + article {margin-top:50px;}
.privacyWrap .mgl {margin-left:25px;}
.privacyWrap h2 {font-family:'NotoSans Medium', 'Roboto Medium', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif !important;
				min-height:34px; position:relative; background:url('../img/common/bul_h3.png') no-repeat 0 10px; padding:0 0 13px 19px; 
				font-size:24px; line-height:1.458em; letter-spacing:-0.025em; color:#333}
.privacyWrap h2 > span.titLabel {display:inline-block; width:44px; height:44px; position:absolute; top:-4px; margin-left:10px;}
.privacyWrap h2 > span.titLabel > img {width:100%; height:100%;}
.privacyWrap h3 {font-size:16px; line-height:1.6em; margin-top:20px;}
.privacyWrap li:first-child h3 {margin-top:10px;}
.privacyWrap p + p {margin-top:10px;}
.privacyWrap ol li + li {margin-top:10px;}
.privacyWrap ul li + li {margin-top:5px;}
.privacyWrap ul.bulType02 li + li {margin-top:0;}
.privacyWrap li {position:relative;}
.privacyWrap li:first-child {margin-top:0;}
.privacyWrap ol.numType01 > li {padding-left:25px;}
.privacyWrap ol.numType01 > li > i,
.privacyWrap ol.numType01 > li > p > i {display:block; position:absolute; left:0; top:5px; width:25px; font-size:1.1em; line-height:1em;}
.privacyWrap ol.numType01 li > ol {margin-top:10px;}
.privacyWrap ol.numType01 > li > h3 {font-weight:bold;}
.privacyWrap ol.numType02 > li {padding-left:20px;}
.privacyWrap ol.numType02 li > i,
.privacyWrap ol.numType02 li > h3 > i {display:block; position:absolute; left:0; top:0; width:20px;}
.privacyWrap ul.bulType01 {margin-top:10px;}
.privacyWrap ul.bulType01 li {padding-left:20px;}
.privacyWrap ul.bulType01 li:before {content:''; display:block; position:absolute; left:0; top:12px; background-color:#666; width:8px; height:1px;}
.privacyWrap ul.bulType02 {margin-top:3px;}
.privacyWrap ul.bulType02 li {padding-left:15px;}
.privacyWrap ul.bulType02 li:before {content:''; display:block; position:absolute; left:3px; top:10px; background-color:#666; width:4px; height:4px; border-radius:100%;}
.privacyWrap .refType01 {margin-top:5px !important; font-size:14px; color:#777; padding-left:20px;}
.privacyWrap .refType01:before {content:'※'; display:inline-block; width:20px; margin-left:-20px;}
.privacyWrap table {margin-top:10px;}
.privacyWrap .btn {margin-top:10px;}
.privacyWrap .btnW + .btnW {margin-left:10px;}
.privacyWrap ul.verList {background-color:#f8f8f8; border-radius:8px; padding:30px; color:#333;}
.privacyWrap ul.verList li {padding-left:15px;}
.privacyWrap ul.verList li:before {content:''; display:block; position:absolute; left:0; top:10px; background-color:#333; width:5px; height:5px;}
.privacyLink a span,
.privacyLink02 a span {display:inline-block; position:relative;}
.privacyLink a span:after {content: ''; position: absolute; width:0; bottom:0px; left:50%; right:100%; border-bottom: 1px solid #0063cc; transition: all 0.25s ease-out;}
.privacyLink02 a span:after {content: ''; position: absolute; width:0; bottom:0px; left:-5px; right:100%; border-bottom: 1px solid #0063cc; transition: all 0.25s ease-out;}
.privacyLink a:hover, .privacyLink a:focus,
.privacyLink02 a:hover, .privacyLink02 a:focus {color:#0063cc;}
.privacyLink a:hover span:after,
.privacyLink a:focus span:after,
.privacyLink02 a:hover span:after,
.privacyLink02 a:focus span:after {left:0; right: 0; width:auto;}