@import url("layout.css");
/*-------------------------------------------------
Author : SY,CHo
Create date : 2020. 03. 10.

YHY : 2011202 웹접근성 명도대비 수정
-------------------------------------------------*/

#header {position: relative; top: auto; left: auto; z-index: 9999;}

/* 251127 순차적 구조 나중에 롤백 */
.locationWrap {position: relative; height: 60px; background: #f3f3f3; z-index: 11;}
.locationWrap .container {position: absolute; top: 0;left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
.location .home,
.location a {display: inline-block; padding: 0 1rem; line-height: 60px; color: #666;}
.location a {width: 100%; white-space: nowrap;}
.location .home,
.location .depth1 {float: left;}
.location .home i {margin-right: 0.5rem; width: 35px; height: 35px; line-height: 35px; text-align: center; font-size: 1rem; color: #fff; background: #666; border-radius: 50%;}

.location .depth1 {position: relative; transition: all .25s ease; -webkit-transition: all .25s ease;}
.location ul {padding-top: 60px;}
.location li {width: 100%; min-width: 290px; height: 60px; opacity: 0; visibility: hidden; transition: all .25s ease; -webkit-transition: all .25s ease;}/* 200518 */
.location li.active {position: absolute; top: 0; left: 0; opacity: 1; visibility: visible;}
.location li.active > a {position: relative; padding: 0 3rem; color: #000;}
.location li.active > a:before {position: absolute; top: 0; left: 1rem; font-family: 'xeicon'; content: "\e940";}
.location li.active > a:after {position: absolute; top: 0; right: 1rem; font-family: 'xeicon'; content: "\e936";}
.location .depthWrap{display: flex;}
.location .depth1Wrap,
.location .depth2Wrap,
.location .depth3Wrap {position: relative;}
.location .depth1 > li.active .depth2,
.location .depth2 > li.active .depth3 {opacity: 1; visibility: visible;}
.location .depth1,
.location .depth2,
.location .depth3 {display:none; position: relative;top: 0;height: 0;}
.location .depth1.on,
.location .depth2.on,
.location .depth3.on {display:block;}
.location .depth1.open,
.location .depth2.open,
.location .depth3.open {height: auto;}
.location .depth1.open > li,
.location .depth2.open > li,
.location .depth3.open > li {opacity: 1; visibility: visible; background: rgba(57,60,69,0.63);}
.location .depth1.open > li > a,
.location .depth2.open > li > a,
.location .depth3.open > li > a {color: #fff;}
.location .depth1.open > li.active > a:after,
.location .depth2.open > li.active > a:after,
.location .depth3.open > li.active > a:after {content: "\e930";}

/* // 251127 순차적 구조 나중에 롤백 */

.shareWrap {position: absolute; top: 0; right: 0;}
.shareWrap > li {position: relative; float: left;}
.shareWrap a {display: inline-block; width: 60px; height: 60px; line-height: 60px; text-align: center; font-size: 1rem;}
.shareWrap > li > a {color: #7f7f7f;}
.shareWrap > li > a.share {position: relative;}
.shareWrap > li > a.share:after {position: absolute; left: 0; top: 20px; width: 1px; height: 1rem; background: #ccc; content: "";}
.shareWrap > li > a:hover,
.shareWrap > li > a.active {color: #000;}
.shareWrap a.facebook {color: #fff; background: #1a3d95;}
.shareWrap a.twitter {color: #fff; background: #1da1f2;}
.shareWrap a.kakaotalk {font-size: 25px; color: #3c1e1e; background: #fae301;}
.shareWrap a.kakaostory {font-size: 22px; color: #fff; background: #fbcb00;}
#shareList {position: absolute; left: 0; top: 60px; display: none;}
#shareList a {height: 60px; line-height: 60px;}
#shareList a:focus {border:2px solid #fff; outline-offset:3px !important;} /*20240909 웹접근성*/

/* ========================================== 컨텐츠 레이아웃 */

#contents {position:relative; padding: 1.5rem 0 3rem; }
#contents:after {clear: both; display: block; width: 100%; content: "";}
#contents .container{max-width:100%;}

.subCont{position:relative; width:100%; max-width:1400px; margin:0 auto;}
.subCont:after{content:""; display:block; clear:both;}
.subContFull{width:100%;}
.subContFull:after{content:""; display:block; clear:both;}
.subBgGray {background:#f8f8f8; padding:3rem 0; overflow:hidden;}

.titleH2 {width:100%; max-width:1400px; margin:0 auto 1.5rem; padding-bottom: 1.5rem; font-size:2rem; font-weight:500; color:#111; text-align: center; border-bottom: 4px solid #ebebea;}

/* ========================================== 서브 컨텐츠 */

/* animation */
.mtBox *[class*="mot"]{opacity:0; transition:all .5s ease-out; -webkit-transition:all .5s ease-out;}
.mtBox *[class*="mot"][class$="-left"]{transform:translateX(-30px); -webkit-transform:translateX(-30px);}
.mtBox *[class*="mot"][class$="-right"]{transform:translateX(30px); -webkit-transform:translateX(30px);}
.mtBox *[class*="mot"][class$="-top"]{transform:translateY(-30px); -webkit-transform:translateY(-30px);}
.mtBox *[class*="mot"][class$="-bottom"]{transform:translateY(30px); -webkit-transform:translateY(30px);}
.mtBox.active *[class*="mot"]{opacity:1; transition:all .5s ease-out; -webkit-transition:all .5s ease-out;}
.mtBox.active *[class*="mot1"]{ transition-delay:0s; -webkit-transition-delay:0s; }
.mtBox.active *[class*="mot2"]{ transition-delay:.45s; -webkit-transition-delay:.45s; }
.mtBox.active *[class*="mot3"]{ transition-delay:.9s; -webkit-transition-delay:.9s; }
.mtBox.active *[class*="mot4"]{ transition-delay:1.1s; -webkit-transition-delay:1.1s; }
.mtBox.active *[class*="mot5"]{ transition-delay:1.45s; -webkit-transition-delay:1.45s; }
.mtBox.active *[class*="mot6"]{ transition-delay:1.9s; -webkit-transition-delay:1.9s; }
.mtBox.active *[class*="mot"][class$="-left"]{transform:translateX(0px); -webkit-transform:translateX(0px);}
.mtBox.active *[class*="mot"][class$="-right"]{transform:translateX(0px); -webkit-transform:translateX(0px);}
.mtBox.active *[class*="mot"][class$="-top"]{transform:translateY(0px); -webkit-transform:translateY(0px);}
.mtBox.active *[class*="mot"][class$="-bottom"]{transform:translateY(0px); -webkit-transform:translateY(0px);}

/* icons */
.icons { position:relative; display:inline-block;  }
.icons01 { width: 60px; height: 60px; }
.icons02 { width: 80px; height: 80px; background:#f3f3f3; border-radius: 50%; }
.icon_light { background:#f3f3f3; border-radius: 50%; }

.icons img { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); }

/*온뱅크 안내페이지*/
.onbankTit { margin-bottom:2.5rem; }
.onbankTit p { float:left; }
.onbankTit p:nth-child(1) { margin-right:2.5rem; }
.onbankTit p img { max-width:100%; }
.onbankTit p.qrcode { position:absolute; right:0; top:0; } /* 200908 */
.onbankTop { position:relative; height:auto; overflow:hidden; background:#f2f3f7; word-break:keep-all; }
.onbankTop > div { width:100%; max-width:1400px; height:auto; margin:2.5rem auto 4.5rem; overflow:hidden; }
.onbankTop div .img { position: relative; float:left; width:50%; height:242px; }
.onbankTop div .img img { position:absolute; max-width:80%; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
.onbankTop div .txt { position:relative; float:right; width:50%; }
.onbankTop div .txt ul li { position: relative; font-size:1.2rem; color:#222; font-weight:500; padding:0.2rem 0 0.2rem 2.5rem; word-break:keep-all; letter-spacing:-1px; }
.onbankTop div .txt ul li:before { content:''; position:absolute; left:0; top:0.7rem; width:2rem; height:1rem; background:url('/images/web/product/sub/dot_onbank.png') no-repeat; background-size: 100%; }
.onbankList { position: relative; height:auto; overflow:hidden; margin-top:-3.5rem; word-break:keep-all; }
.onbankList .cont1 { position: relative; height:auto; padding:0.5rem; overflow:hidden; padding-bottom:3rem; border-bottom:1px solid #dadbdd; }
.onbankList .cont1:before { content:''; position:absolute; left:0; top:0; width:100%; height:0; background:#507aff; transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); -webkit-transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); }
.onbankList .cont1.active:before { height:3.5rem; }
.onbankList .cont1 ul li { width:50%; float:left; }
.onbankList .cont1 ul li .img { position:relative; width:100%; height:15.5rem; background:#fff; }
.onbankList .cont1 ul li .img img { position:absolute; max-width:80%; bottom:0; left:50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); }
.onbankList .cont1 ul li:nth-child(1) .img { background:#e3dbf3; }
.onbankList .cont1 ul li dl { padding-right:2rem; }
.onbankList .cont2 { height:auto; overflow:hidden; margin:3.5rem 0; } 
.onbankList .cont2 dl { width:30%; float:left; }
.onbankList .cont2 dl + dl { margin-left:5%; }
.onbankList .cont2 dl dt { display:block; width:100%; line-height:3rem; border-radius:3rem; text-align:center; color:#fff; font-size:1.2rem; }
.onbankList .cont2 dl:nth-child(1) dt {background:#1358a5; /*color: #402F08;*/} /* 210107 color 주석처리 */
.onbankList .cont2 dl:nth-child(2) dt { background:#1358a5; }
.onbankList .cont2 dl:nth-child(3) dt {background:#1358a5; /*color: #0E282F;*/} /* 210107 color 주석처리 */

/* 200908 */
.onbankPop { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:100; }
.onbankPop .box { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); display:block; width:95%; max-width:27.5rem; height:auto; background:#fff; padding:4.5rem 1.5rem 2rem; }
.onbankPop .box h3 { position:absolute; top:0; left:0; display:block; width:100%; height:3rem; background:#1358a5; padding:0 1rem; line-height:3rem; color:#fff; font-size:1.1rem; font-weight:400; }
.onbankPop .box p { text-align:center; font-size:0.9rem; word-break:keep-all; line-height:2; }
.onbankPop .box a.btn_yell { display:block; width:100%; text-align:center; margin:2rem auto 0; }
.onbankPop .box a.btnClose { position:absolute; top:0.5rem; right:0.5rem; width:2rem; height:2rem; color:#fff; text-align:center; line-height:2rem; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; }
.onbankPop .box a.btnClose:hover { transform:rotate(180deg); -webkit-transform:rotate(180deg); }



/* 예금 전체상품 */
.bbs_srch.quickType {position: relative; padding: 20px 30px;}
.bbs_srch.quickType h3 {position: absolute; top: 20px; left: 30px; line-height: 40px; font-size: 1.1rem; font-weight: 400;}
.bbs_srch.quickType select {padding:0 1rem; min-width: 12rem; background:#fff url('/images/common/board/arrw_pbn2.png') no-repeat right 9px center; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
.bbs_srch.quickType select::-ms-expand { display:none; }
.bbs_srch.quickType .btnSearch {position: absolute; top: 20px; right: 30px; padding: 0 20px; font-size: 0.8rem; background: #1258a5;}
.bbsCnt strong {color: #1258a5;}
.bbsSlt {margin: -1.7rem 0 1rem; text-align: right; padding-left:3rem; overflow: hidden;}
.bbsSlt ul {display: inline-block; line-height: 2rem; vertical-align: bottom; overflow: hidden;}
.bbsSlt ul li {position: relative; float: left;}
.bbsSlt ul li.on {border-bottom:2px solid #1258a5;} /*211028 접근성 수정*/
.bbsSlt ul li:after {position: absolute; top: 0.65rem; left: 0; width: 1px; height: 0.7rem; background: #ccc; content: "";}
.bbsSlt ul li:first-child:after { display:none; }
.bbsSlt ul li a {display: inline-block; padding: 0 1rem; outline-offset: -2px;} /*221027 접근성 수정*/
.bbsSlt ul li.on {border-bottom:2px solid #1258a5;}/*230110추가*/ 
.bbsSlt select {padding: 0 2rem 0 0.5rem; height: 2rem; background:url('/images/common/board/arrw_pbn2.png') no-repeat right 9px center; border:1px solid #ccc; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
.bbsSlt select::-ms-expand { display:none; }
.listTypeBasic {border-top: 2px solid #1258a5; overflow: hidden;}
.listTypeBasic > li { position:relative; display: table; padding: 1.5rem 0; width: 100%; border-bottom: 1px solid #ddd;}
.listTypeBasic > li > div {display: table-cell; vertical-align: middle;}
.listTypeBasic .pictogram {width: 5rem; text-align: center;}
.listTypeBasic .info {padding: 0 1rem; width: calc(100% - 15rem); color: #555;}
.listTypeBasic .info > span {display: block; font-size: 0.7rem;}
.listTypeBasic .info > strong {display: block; margin-top: 0.25rem; font-size: 1.1rem; font-weight: 500; color: #000;}
.listTypeBasic .info > p {margin-top: 0.25rem;}
.listTypeBasic .btns { position:absolute; right:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%) } /* 200908 */

/* 예금 상품설명 */
.plusTag {position: relative; margin-bottom: 4rem; padding: 1rem;}
.plusTag:before {position: absolute; top: 2rem; left: 0; width: 100%; height: calc(100% - 1rem); background: #f7f7f7; content: "";}
.plusTag .tag {position: absolute; top: -1rem; right: 1rem; padding-top: 0.5rem; width: 3.5rem; height: 3.5rem; text-align: center; color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#006fba+0,17a7db+100 */
background: rgb(0,111,186); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=0 ); /* IE6-9 */
}
.plusTag .tag:before {content:''; position:absolute; bottom:0; left:50%; transform: translateX(-50%); width:0; height:0; border-top:none; border-left: 35px solid transparent; border-right: 35px solid transparent; border-bottom: 20px solid #fff;}
.plusTag .box_st6 {padding: 3rem 3rem 1.5rem;}
.explanation {position: relative; line-height: 2rem;}
.explanation h3 {position: absolute; top: 0; left: 0; display: inline-block; padding-right: 1rem; font-weight:400; font-size:1.4rem; color:#777; }
.explanation h3:after {position: absolute; top: 0.4rem; right: 0; width: 2px; height: 1.2rem; background: #a9a9a9; content: "";}
.explanation p {padding:0 2rem 0 10rem; font-size:1.5rem; word-break:keep-all; }
.explanation p strong { color:#1276a0; font-weight:400; } /* 210107 컬러값 수정 : 기존 color:#00a9ef; */ 
.explandata { height:auto; overflow:hidden; margin-top:3rem; }
.explandata li { position:relative; width:31%; float:left; margin-right:3.5%; padding:0 2rem 0 4.2rem;  font-size:1rem; line-height:1.3; letter-spacing:-0.5px; /* word-break:keep-all; */ word-break:break-all; }
.explandata li:last-child { margin-right:0; }
.explandata li:before { content:""; position:absolute; right:0; top:0; width:1px; height:300px; border-left:1px dotted #b2b2b2; }
.explandata li:last-child:before { display:none; } 
.explandata li .pictogram { position:absolute; left:0; top:0; }
.explandata li strong { display:block; font-weight:500; font-size:0.9rem; color:#777; margin-bottom:0.5rem; }
.bu_info { width:100%; display:table; border-bottom:1px dotted #777; margin-bottom:1rem; padding-bottom:1rem; }
.bu_info2 { margin-bottom:0; border-bottom:none; }
.bu_info p { display:table-cell; vertical-align:middle; width:100%; padding-left:1rem; }
.info_list > li { position:relative; padding:1rem 0 1rem 12rem; }
.info_list > li:before { content:''; position:absolute; left:10rem; top:1.5rem; width:1px; height:1rem; background:#bfbfbf; }
.info_list > li strong { position:absolute; left:0; top:1rem; font-size:1rem; font-weight:500; }
.info_list > li span { font-weight:500;}
.info_list > li .list_stT1 > li { font-size:0.9rem; word-break:keep-all; }
.explandata li p.bu_atte2_line, .info_list li p.bu_atte2_line { font-size:0.8rem; color:#555; line-height:1.6; word-break:break-all; }

i.underline { text-decoration:underline; }

.tbl_graph { border-collapse: collapse; }
.tbl_graph td { height:2rem; }
.tbl_graph td.graph { background:#f4f8fb; border:1px dotted #afb3b6; border-bottom:1px solid #000; font-size:0.7rem; text-align:center; padding:0 0.5rem; }
.tbl_graph .data { vertical-align: top;}
.functionWrap { word-break:keep-all;}
.function { position:relative; display:inline-block; text-align:center; vertical-align:middle; }
.function .line { position:relative; display:block; width:100%; font-size:0; }
.function .line:before { content:""; position:absolute; left:-50%; transform:translateX(50%); width:100%; height:1px; background:#777; }

/* 여신 상품설명 */
.plusTag .loanbox { border-bottom:none; }
.box_atte { position:relative; width:100%; height:auto; padding:1.5rem 3rem; background:#f1f8fb; border:1px solid #ddd; border-top:none; word-break: keep-all; }
.box_atte .bu_atteT { font-size:1.2rem; background-position:left 8px; }
.explan_st2 { min-height:80px; }
.explan_st2 p { padding:0 3rem 0 15rem; }
.explan_st2 h3 { padding-right:1.5rem; word-break:keep-all; }
.explan_st2 h3:after { top:0; height:100%; }
.explan_st2 h3 span { display:none; }

/* 대출금계산기 */
.info_input tbody td { padding-left:10px !important; }
.info_input tbody td input[type="text"] { width:50%; margin-right:5px; }
.tbl_st2_row .in_th { border-left:1px solid #ddd; }

/* 대출관련서식 */
.loan_dcmt { font-size:0; text-align:center; }
.loan_dcmt li { display:inline-block; width:33%; text-align:left; vertical-align:top; }
.loan_dcmt li a { position:relative; display:block; width:95%; font-size:0.8rem; color:#000; margin:0 auto; padding:1.5rem 7rem 1.5rem 3.5rem; border:1px solid #d9d9d9; background:#fff; word-break:keep-all;  }
.loan_dcmt li a:before { content:''; position:absolute; display:none; width:100%; height:100%; border:1px solid #057bc1; left:0; top:0; }
.loan_dcmt li a .num { position:absolute; left:0.8rem; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); display:block; width:2rem; height:2rem; line-height:2rem; font-family: 'Titillium Web', sans-serif; font-weight:600; color:#fff; text-align:center; border-radius:1rem; float:left; 
	background: #006fba; /* Old browsers */
	background: -moz-linear-gradient(left,  #006fba 0%, #17a7db 100%) ; /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #006fba 0%,#17a7db 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #006fba 0%,#17a7db 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
.loan_dcmt li a .s_btn { position:absolute; right:0.8rem; top:1.3rem; display:block; float:right; font-size:0.7rem;  padding:4px 34px 4px 9px; border:1px solid #111; }
.loan_dcmt li a .s_btn:before { content:''; position:absolute; right:12px; top:9px; width:13px; height:13px; }
.loan_dcmt li a .viewall:before { background:url("/images/web/cu/con_com/btn_glanG_SML.png") no-repeat; }
.loan_dcmt li a .download:before { background:url("/images/web/cu/con_com/btn_dwldG_SML.png") no-repeat; }
.loan_dcmt li a:hover { border:1px solid #057bc1; }
.loan_dcmt li a:hover:before { display:block; }
.loan_dcmt li a, .loan_dcmt li a:hover { transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }

/* 카드 전체상품 */
.cardListWrap { position:relative; }
.cardListWrap .slick-slide { vertical-align:top; } 
.cardListWrap h3 { position:absolute; top:0; left:0; display:table; width:112px; height:112px; background:#09aed6; font-weight:500; color:#000; font-size:1.2rem; line-height:1.3rem; border-radius:50%; text-align:center; z-index:2; }/* 210107 컬러값 수정 : 기존 color:#fff; */
.cardListWrap h3 span { display:table-cell; vertical-align:middle; }
.cardListWrap .cardList { width:85%; margin:0 auto; }
.cardListWrap .cardList li a { display:block; outline-offset:-2px; padding:1rem 0; } /*221027 접근성 수정*/
.cardListWrap .cardList li a span { display:block; }
.cardListWrap .cardList li a .img { position:relative; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); width:60%; max-width:211px; height:auto; }
.cardListWrap .cardList li a .img img { width:100%; height:auto; }
.cardListWrap .cardList li a .tit { text-align:center; font-size:1rem; color:#222; margin:1.5rem 0 0.3rem; word-break:keep-all; }
.cardListWrap .cardList li a .txt { text-align:center; color:#555; word-break:break-all; }
.cardListWrap .cardList li a:hover .img { transform: translate(-50%, -0.5rem); -webkit-transform: translate(-50%, -0.5rem); }
.cardListWrap .cardList li a:hover .tit { color:#09aed6; }
.cardListWrap .cl_control a { position:absolute; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); display:block !important; width:62px; height:62px; color:transparent; background-size:100%; }
.cardListWrap .cl_control a.btn_prev { left:0; background:url('/images/web/product/sub/l_arrw.png') no-repeat center; }
.cardListWrap .cl_control a.btn_next { right:0; background:url('/images/web/product/sub/r_arrw.png') no-repeat center; }
i.hybrid { display:inline-block; position:relative; color:#666; padding-left:1.5rem; }
i.hybrid:before { position:absolute; left:0.7rem; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); width:1px; height:15px; background:#c1c1c1; content:""; }
.cardListWrap .cardList li a .img, .cardListWrap .cardList li a .tit, .cardListWrap .cl_control a { transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }

.listTypeBasic .card_mini img { width:58px; height:auto;}

/* 제휴카드 전체 */
.cfCard_list .card_mini img { width:130px; height:auto; }
.cfCard_list .info { padding-left:2rem; }
.cfCard_list .btns { width:10rem; }

/* 카드 상품이미지 active */
.card_slide.active .img { opacity:1; transform: translateY(0); -webkit-transform: translateY(0); }
.card_slide.active .contbox { opacity:1; transform: translateX(0); -webkit-transform: translateX(0); }

/* 카드 상품설명 */
.cardView { position:relative; height:auto; overflow:hidden; padding:0 6rem; }
.card_slide .img { width:25%; float:left; opacity:0; transform:translateY(-30px); -webkit-transform:translateY(-30px); transition: 0.5s ease; -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }
.card_slide .img img { max-width:211px; width:100%; }
.cardView .contbox { width:70%; float:right; word-break:keep-all; opacity:0; transform:translateX(-30px); -webkit-transform:translateX(-30px); transition: 0.5s ease; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; }
.cardView .contbox h5 { letter-spacing:0; }
.cardView .contbox h5 span { display:block; color:#ff5252; }
.cardView .contbox h6 {font-size:1rem;color: #007c9a;font-weight:500;margin-top:1.5rem;}
.cardView .contbox p { font-size:0.9rem; color:#666; margin-bottom:0.5rem; }
.cardView .contbox ul li { position:relative; padding-left:15px; }
.cardView .contbox ul li span {color: #d8302f;}
.cardView .contbox ul li:before { content:''; position: absolute; left:0; top:0.5rem; width:6px; height:6px; border-radius:50%; background:#efb52e; }
.btnBox { margin-top:1.5rem; }
.btnBox a { position:relative; display:inline-block; height:38px; line-height:38px; color:#fff; text-align:center; margin:0 0.5rem 0.5rem 0; padding:0 2.5rem 0 1.2rem; box-sizing:border-box; }
.btnBox a .icon { position:absolute; right:0.5rem; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); width:18px; height:18px; background:url(/images/web/product/sub/ico_btn.png) no-repeat; }
.btnBox a.btn_list { line-height:36px; color:#222; border:1px solid #c1c1c1; padding:0 2rem; }
.btnBox a.btn_download { background:#057ebe; }/*220203 접근성 명도대비 수정*/
.btnBox a.btn_newpage { background:#0a86c8; }
.btnBox a.btn_download:focus, .btnBox a.btn_newpage:focus{border:1px solid #fff; outline-offset:2px; outline-style:dotted; outline-width:2px; outline-color:#000; box-sizing:border-box;}/*231027*/
.btnBox a.btn_list:hover { border:1px solid #000; }
.btnBox a.btn_download:hover { background:#006fba; }/*220203 접근성 명도대비 수정*/
.btnBox a.btn_newpage:hover { background:#037ab9; }

.serviceBox .serviceList > li { display:table-cell; position:relative;  }
.service { position:relative; width:85%; margin:0 auto; text-align:center; word-break:break-all;}
.iconImg { position:relative; display:block; width:80px; height:80px; margin:0 auto; background:#ebeff3; border-radius:50%;}
.iconImg img { position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
.service h4 { font-size:1rem; font-weight:500; color:#333; margin-top:5px; }
.service h4 strong { font-weight:500; color:#0a86c8; }
.service p { font-size:0.8rem; color:#555; margin:0.2rem 0 1rem; }
.serviceBox .serviceList .service h5 { font-weight:400; font-size:0.9rem; color:#333; text-align:left; margin-top:1.5rem; }
.serviceBox .serviceList .service h5.mgt3rem { margin-top:3rem; }
.serviceBox .serviceList .service ul { max-width:500px; margin:0 auto;}

.serviceBox .specialserv  { margin-bottom:2rem; }
.serviceBox .specialserv > li { border-right:1px dashed #999; }
.serviceBox .specialserv > li:last-child { border-right:none; }

.serviceBox .ms_st3 { font-size:0; }
.serviceBox .ms_st3 > li { display:inline-block; width:25%; vertical-align:top; margin:1rem 0;}

.bu_blue li{ position:relative; padding-left:10px; margin:5px 0; font-size:0.9rem; }
.bu_blue li:before { content:''; position:absolute; left:0; top:0.6rem; width:4px; height:4px; background:#0a86c8; }
.bu_blue li .bu_atte_line { font-size:0.8rem; }

.bu_gray { font-size:0.8rem; color:#555; text-align:left; }
.bu_gray li { position:relative; margin:5px 0; padding-left:10px; line-height:1.2rem; }
.bu_gray li:before { content:''; position:absolute; left:0; top:0.5rem; width:3px; height:3px; background:#aaa; }
.bu_gray li ul li:before { content:''; position:absolute; left:0; top:0.6rem; width:4px; height:1px; background:#bababa; }

/* 카드 기능페이지 */
.slct_temp { position:relative; height:auto; overflow:hidden; }
.slct_temp .tempbox { position:relative; width:32%; height:auto; border:1px solid #aaa; margin-right:2%; overflow:hidden; float:left; }
.slct_temp .tempbox:nth-child(3) { margin-right:0; }
.temptitWrap { position:relative; height:auto; overflow:hidden; border-bottom:1px dashed #aaa; background:#fff; }
.temptit { display:block; width:100%; font-size:1.2rem; font-weight:500; line-height:3rem; text-align: center;  }
.checkbox { position:absolute; top:50%; right:0.7rem; height:1.9rem; font-size:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.checkst1 { width:80px; }
.checkst2 { width:90px; }
.checkbox input[type="checkbox"] { position:absolute; top:0.5rem; left:0; width:17px; height:17px; margin:0; padding:5px; }
.checkbox input[type="checkbox"] + label { position:absolute; top:0.5rem; left:0; color:#555; cursor:pointer; }
.checkbox input[type="checkbox"] + label span { position:relative; display:inline-block; width:17px; height:17px; background:#fff; border:1px solid #666; border-radius:3px; cursor: pointer; }
.checkbox input[type="checkbox"]:checked + label span { background:#fff url('/images/web/product/sub/check.png') no-repeat center; }
.checkbox a { display:block; line-height:1.9rem; color:#fff; font-weight:500; font-size:0.8rem; padding:0 0.5rem; background:#0a86c8; border-radius:5px; float:right; }
.checkbox .text { display:block; width:3.5rem; font-size:0.8rem; margin-top:-0.2rem; text-align:right; float:right; }
.checkbox a:hover { background:#037ab9; }
.slct_temp .tempbox .img { width:100%; height:auto; overflow:hidden; padding:0.7rem; text-align:center; }
.slct_temp .tempbox .img img { width:100%; max-width:400px;}

.btnwrap { position:relative; width:100%; overflow:hidden; text-align:center; }
.btnwrap a { display:inline-block; line-height:1.9rem; color:#fff; font-size:0.75rem; border-radius:5px; padding:0 1rem; }
.btnwrap a.use { background:#5aa225; }
.btnwrap a.notuse { background:#898989; }
.btnwrap a.delete { background:#5c5c5c; }
.btnwrap a.use:hover { background:#429618; }
.btnwrap a.notuse:hover { background:#797979 }
.btnwrap a.delete:hover { background:#424242 }

.templateWrap { position:relative; height:auto; overflow:hidden; border:1px solid #aaa; background:#f4f4f4; margin-top:3rem; }
.templateWrap .editBox { position:relative; width:95%; min-height:5rem; background:#fff; border:1px dashed #b7b7b7; margin:1.5rem auto; padding:1rem 1.5rem; }
.templateWrap .editBox .pre_con:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(25,28,49,0.6); z-index:2; }
.templateWrap .editBox .btn_wrap { position:absolute; top:50%; left:0; width:100%; height:auto; text-align:center; line-height:0; transform:translate(0, -50%); -webkit-transform:translate(0, -50%);  z-index:10; }
.templateWrap .editBox .icon { position:relative; display:inline-block; width:68px; height:68px; border-radius:50%; background:#bfbfbf; }
.templateWrap .editBox .icon:hover { background:#73b9dd; }
.templateWrap .editBox .icon:before { content:''; position:absolute; left:50%; top:50%; width:68px; height:68px; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); }
.templateWrap .editBox .editicon { opacity:0.7; }
.templateWrap .editBox .editicon:hover { opacity:1; }
.templateWrap .editBox .btnwrap { position:absolute; right:0.5rem; top:50%; max-width:250px; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.templateWrap .iconCont { position:relative; width:95%; height:auto; margin:0 auto; overflow:hidden; }
.templateWrap .iconCont .iconbox { width:18%; float:left; margin-right:2.5%; margin-bottom:1rem; }
.templateWrap .iconCont .iconbox:nth-child(5n) { margin-right:0; }
.templateWrap .iconCont .iconbox .service { width:100%; height:268px; background:#fff; border-radius:10px; padding:1rem; overflow:hidden; }
.templateWrap .iconCont .iconbox .service ul { font-size:0.6rem; }
.templateWrap .iconCont .iconbox .service ul li { line-height:1rem; }
.templateWrap .iconCont .iconbox .service a.icobg { position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:rgba(25,28,49,0.7); }
.templateWrap .iconCont .iconbox .service a.icobg:before { content:''; position:absolute; left:50%; top:50%; width:110px; height:110px; border-radius:50%; border:1px dashed #fff; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); }
.templateWrap .iconCont .iconbox .service a.icobg:hover { background:rgba(25,28,49,0.85); }
.templateWrap .iconCont .plusbox .service a.icobg { background:#50a7d5; }
.templateWrap .iconCont .plusbox .service a.icobg:hover { background:#0a86c8; }
.templateWrap .iconCont .iconbox .btnwrap { margin-top:0.5rem; }

a.plusicon::before {background:url('/images/web/product/sub/ico_plus.png') no-repeat center; }
a.editicon:before { background:url('/images/web/product/sub/ico_edit.png') no-repeat center; }
a.notUseicon:before { background:url('/images/web/product/sub/ico_notuse.png') no-repeat center; }

.templateWrap .iconCont .iconbox .service a.icobg:hover:before { transform:translate(-50%, -50%) rotateY(360deg); -webkit-transform:translate(-50%, -50%) rotateY(360deg); }
.checkbox a, .templateWrap a, .templateWrap a:before{ transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }


/* 카드 기능페이지(팝업) */
.popupWrap { display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:9999; }
.popupWrap .popup { position:absolute; left:50%; top:50%; max-width:1300px; width:90%; max-height:90%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);  background:#f3f3f3; overflow-y:auto; }
.popupWrap .popup h3 { line-height:3rem; font-size:1.2rem; color:#fff; text-align:center; font-weight:500; background:#2369b0; }
.popupWrap .popup .box_st6 { width:95%; margin:0 auto; padding:2rem 1.5rem; }
.popupWrap .popup .box_st6 dl { position:relative; }
.popupWrap .popup dl { position:relative; width:100%; overflow:hidden; margin: 20px 0 0; border-bottom:1px dotted #b6b6b6;}
.popupWrap .popup dl dt { position:absolute; top:0; left:0; width:70px; font-size:0.9rem; color:#222; font-weight:500; padding:0.7rem 0; float:left;}
.popupWrap .popup dl dt:before { content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:#006fba}
.popupWrap .popup dl dd { position:relative; width:100%; padding-left:140px; min-height:55px; }
.popupWrap .popup dl dd .iconlist { width:100%; height:300px; overflow-y:auto; margin-bottom:1rem; }
.popupWrap .popup dl dd ul li { display:block; float:left; width:12%; height:134px; background:#fff; border:1px dashed #c0c8cf; margin:0 2% 0.8rem 0; padding:1rem 0 0; border-radius:5px; font-size:0; text-align:center; transition:all .2s ease; -ms-transition:all .2s ease; -webkit-transition:all .2s ease; }
.popupWrap .popup dl dd ul li:hover { border:1px dashed #2369b0; }
.popupWrap .popup dl dd ul li label { display:block;  cursor:pointer; }
.popupWrap .popup dl dd ul li .circle { position:relative; display:block; width:14px; height:14px; border:1px solid #b6b6b6; border-radius:50%; margin:0.5rem auto; }
.popupWrap .popup dl dd ul li input[type="radio"] { cursor:pointer; margin:0.5rem 0; }

.popupWrap .popup dl dd ul li.on { border:1px dashed #2369b0; }
.popupWrap .popup dl dd ul li.on .circle:before { content:''; position:absolute; top:2px; left:2px; width:8px; height:8px; background:#2369b0; border-radius:50%; }

.popupWrap .popup dl dd input[type="text"] { width:100%; height:35px; border:1px solid #9eaab7; background:#f7f7f7; padding:0 10px; }
.popupWrap .popup dl dd textarea { width:100%; height:105px; border:1px solid #9eaab7; background:#f7f7f7; resize:vertical; margin-bottom:20px; padding:10px; }
.popupWrap .popup dl dd select { position:relative; width:100%; width:11rem; height:35px; border:1px solid #9eaab7; padding:0 30px 0 10px; box-sizing:border-box; float:left; margin-bottom:12px; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:url('/images/web/product/sub/btn_arrow.png') no-repeat right 10px center;}
.popupWrap .popup dl dd select::-ms-expand { display:none; }
.popupWrap .popup dl dd input:focus, .popupWrap .popup dl dd textarea:focus { background:#fff; }
.popupWrap .popbtnWrap { margin:2rem 0 0; text-align:center;}
.popupWrap .popbtnWrap a { display:inline-block; position:relative; line-height:2rem; margin-bottom:5px; padding:0 0.7rem 0 1.7rem; border-radius:5px; color:#fff; transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }
.popupWrap .popbtnWrap a.post { background:#0a86c8; }
.popupWrap .popbtnWrap a.edit { background:#898989 ; }
.popupWrap .popbtnWrap a.delete { background:#5c5c5c; }
.popupWrap .popbtnWrap a.close { background:#717f8e; }
.popupWrap .popbtnWrap a.post:hover { background:#0072af }
.popupWrap .popbtnWrap a.edit:hover { background:#757575 }
.popupWrap .popbtnWrap a.delete:hover { background:#505050 }
.popupWrap .popbtnWrap a.close:hover { background:#53687d }
.popupWrap .popbtnWrap a:before { position:absolute; left:0; width:2rem; height:2rem; font-family:'xeicon'; font-size:1.2rem; }
.popupWrap .popbtnWrap a.post:before { content:'\e914'; }
.popupWrap .popbtnWrap a.edit:before { content:''; background:url('/images/web/product/sub/ico_edit.png') no-repeat center; background-size:18px; }
.popupWrap .popbtnWrap a.delete:before { content:'\e91b'; }
.popupWrap .popbtnWrap a.close:before { content:'\e922'; }
.popupWrap .btn_close { position:absolute; top:1rem; right:1.5rem; width:20px; height:20px; }
.popupWrap .btn_close:before { content:'\e921'; font-size:1rem; line-height:0; color:#fff; font-family:'xeicon' }



@media screen and (max-width: 1440px){

	.subCont{width:96%; padding:20px 0;}
	.explandata li p.bu_atte2_line, .info_list li p.bu_atte2_line { line-height:1.8; }
	
	/* 카드 상품설명 */
	.serviceBox .mainserv { display:block; font-size:0; }
	.serviceBox .mainserv > li { display:inline-block; width:33%; vertical-align:top; margin:0 0 2rem;}

	.serviceBox .ms_st1 { text-align:center; }
	.serviceBox .ms_st2 > li { width:25%; }
	.serviceBox .ms_st3 > li { width:33%; }

	/* 카드 기능페이지 */
	.btnwrap a { width:32%; padding:0; }

	/* 카드 기능페이지(팝업) */
	.popupWrap .popup dl dd ul li { width:18%; }

	
}

@media screen and (max-width: 1240px){
 /* 251127 순차적 구조 나중에 롤백 */
    	.locationWrap .container {padding-right: 120px;}
	.location .home {display: none;}
	.location li {min-width: 100%;}
	.location li.active:after {position: absolute; top: 0; right: -1px; width: 1px; height: 100%; background: #ccc; content: "";}
	.location li.active.depCt:after{display:none;}
	.location li.active > a {padding: 0 1rem;}
	.location li.active > a:before {display: none;}

	.location .depth1Wrap,
	.location .depth2Wrap,
	.location .depth3Wrap {width:100%;}
	.location .depthWrap div:not(.mobLnb){display: none;}
	.location .depth1{width:100%;}
	.location .depth2{width:100%; left:0;}
	.location .depth3 {width:100%; left:0;}
	.location .depth1 > li.active > a{display:none;}
	.location .depth2 > li.active.depCt > a{display:none;}
/* // 251127 순차적 구조 나중에 롤백 */
	/* 예금 상품설명 */
	.explandata li { padding:4.5rem 1.5rem 0 0; }
	.explandata li .pictogram { left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); }

	/* 카드기능페이지 */
	.templateWrap .iconCont .iconbox { width:32%; margin-right:2%; }
	.templateWrap .iconCont .iconbox:nth-child(5n) { margin-right:2%; }
	.templateWrap .iconCont .iconbox:nth-child(3n) { margin-right:0; }
	
	/*온뱅크 안내페이지 200908*/
	.onbankTit p { float:none;}
	.onbankTit p.qrcode { top:auto; bottom:0; }

}

@media screen and (max-width: 1024px){

	.locationWrap .container {padding-right: 60px;}
	/* .location .home {display: none;}
	.location li {min-width: 100%;}
	.location li.active:after {position: absolute; top: 0; right: -1px; width: 1px; height: 100%; background: #ccc; content: "";}
	.location li.active.depCt:after{display:none;}
	.location li.active > a {padding: 0 1rem;}
	.location li.active > a:before {display: none;}

	.location .depth1{width:100%;}
	.location .depth2{width:100%; left:0;}
	.location .depth3 {width:100%; left:0;}
	.location .depth1 > li.active > a{display:none;}
	.location .depth2 > li.active.depCt > a{display:none;} */
		
	.shareWrap > li > a.print{display:none;}
	.shareWrap > li > a.share:after {display:none;}

	/*온뱅크 안내페이지*/
	.onbankTop div .img { width:100%; }
	.onbankTop div .txt { width:95%; height:auto; overflow:hidden; margin:0 auto; padding-top:2rem; float:none; }

	/* 여신 상품설명 */
	.explan_st2 h3 { position:relative; }
	.explan_st2 h3:after { display:none; }
	.explan_st2 h3 span { display:inline-block; padding:0 10px; }
	.explan_st2 h3 br { display:none; } 
	.explan_st2 p { padding: 0; font-size: 1.2rem; line-height: 1.5;}

	/* 대출관련서식 */
	.loan_dcmt li { width:100%; margin-bottom:15px; }
	.loan_dcmt li:last-child { margin-bottom:0; }
	.loan_dcmt li a .viewall { top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); }

	/* 카드 상품설명 */
	.cardView .img { width:100%; height:336px; text-align:center; margin-bottom:1rem; }
	.cardView .contbox { width:100%; }
	.serviceBox .mainserv2 > li { width:33%; }
	
	/* 카드 기능페이지(팝업) */
	.popupWrap .popup dl dd ul li { width:31%; }

	/* 예금 전체상품 */
	.info_list > li { padding:0 0 1.5rem; }
	.info_list > li:before { display:none;}
	.info_list li strong { position:relative; left:auto; top:auto; display:block; margin-bottom:5px; }
	.info_list li strong br { display:none; }

}

@media screen and (max-width: 900px){

	/*온뱅크 안내페이지*/
	.onbankList .cont1 ul li { width:100%; }
	.onbankList .cont1 ul li + li { margin-top:2rem; } 
	.onbankList .cont1 ul li .img { height:auto; }
	.onbankList .cont1 ul li .img img { position:relative; padding-top:1.5rem; }
	.onbankList .cont2 dl { width:100%; }
	.onbankList .cont2 dl + dl { margin-left:0; margin-top:2rem; }
	
}

@media screen and (max-width: 800px){


	/* 예금 전체상품 */
	.bbs_srch.quickType h3 { position:relative; top:auto; left:auto; margin-bottom:10px; }
	.bbs_srch.quickType .btnSearch  { position:relative; top:auto; right:auto; }
	.listTypeBasic > li { padding: 1.5rem 0 4rem; }
	.listTypeBasic .info { width: calc(100% - 5rem); }
	.listTypeBasic .btns { position:absolute; bottom:1rem; right:0; display:block; }
 	.listTypeBasic .info { width: 100%; }/* 200908 */
 	.listTypeBasic .btns { top:auto; bottom:1rem; transform:none; -webkit-transform:none;  } /* 200908 */
 	
	/* 예금 상품설명 */
	.explandata li { width:100%; margin-right:0; padding:0 0 3rem 5rem; }
	.explandata li:last-child { padding-bottom:0; }
	.explandata li:before { top:auto; bottom:1.5rem; bottom:1.5rem; width:100%; height:1px; border-bottom:1px dotted #b2b2b2;}
	.explandata li .pictogram { left:0; transform:translateX(0); -webkit-transform:translateX(0);  }

	/* 카드 상품설명 */
	.serviceBox .specialserv { display:block; margin-bottom:0; }
	.serviceBox .specialserv > li { display:block; padding:2rem 0; min-height:80px; border-right:none; border-top:1px dashed #999; }
	.serviceBox .specialserv > li:last-child { padding-bottom:0; }
	.serviceBox .specialserv .service { width:100%; text-align:left; padding-left:6rem;}
	.serviceBox .serviceList .service h5 { margin-top:1rem !important;}
	.serviceBox .serviceList .service ul { max-width:100%; }
	.serviceBox .specialserv .iconImg { position:absolute !important; left:0; }
	.serviceBox .mainserv > li { width:50%; }
	.serviceBox .ms_st1 > li { width:100%; }
	.serviceBox .ms_st2 > li { width:100%; }
	.serviceBox .ms_st3 > li { width:100%; }
	
	/* 대출금계산기 */
	.info_input tbody td input[type="text"] { width:80%; }

	/* 카드 기능페이지 */
	.templateWrap .editBox { min-height:9rem; padding:1.5rem; }
	.slct_temp .tempbox .temptitWrap .temptit { text-align:left;  padding-left: 0.7rem; font-size:1rem; }
	.templateWrap .editBox .btnwrap {position:relative; right:auto; top:auto; margin:1rem auto 0.5rem; transform:translateY(0); -webkit-transform:translateY(0); }
	.pre_con .info_list > li { padding:0; }
	
	/* 카드 기능페이지(팝업) */
	.popupWrap .popup dl dt { position:relative; float:none; }
	.popupWrap .popup dl dd { padding-left:0; }
	
}

@media screen and (max-width: 720px){

	/* 카드 상품설명 */
	.cardView { padding:0; }
	.cardListWrap .cvcont a { top:7.5rem !important; transform:translate(0); -webkit-transform:translate(0); }


}

@media screen and (max-width: 640px){

	.locationWrap .container{padding-right:60px;}
	.location .depth1{width:100%;}
	.location .depth1 > li.active > a{display:none;}
	.location .depth2{left:0;}

	/*온뱅크 설명페이지*/
	.onbankTit p:nth-child(1) { width:8rem; }

	/* 예금 전체상품 */
	.explanation h3 { position:relative; }
	.explanation p {  padding:0; font-size:1.2rem; line-height:1.5; }

	/* 대출 상품설명 */
	.box_atte .bu_atteT { font-size:1rem; background-position:left 2px; } 

	/* 카드 전체상품 */
	.cardListWrap h3 { width: 90px; height: 90px; }

	/* 카드 상품설명 */
	.cardView .img img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); width:150px; }

	/* 카드기능페이지 */
	.templateWrap .editBox .icon { top:5px; width:50px; height:50px; }
	.templateWrap .editBox .icon:before { width:50px; height:50px; background-size:25px; }
	.templateWrap .iconCont .iconbox { width:49%; margin-right:2%; }
	.templateWrap .iconCont .iconbox:nth-child(3n) { margin-right:2%; }
	.templateWrap .iconCont .iconbox:nth-child(2n) { margin-right:0; }

}


@media screen and (max-width: 560px){

	.locationWrap .container{padding-right:60px;}
	.location .depth1{width:100%;}
	.location .depth1 > li.active > a {display:none;}
	.location .depth2{left:0;}
		
	/* 예금 전체상품 */
	.plusTag .box_st6 { padding:2.5rem 2rem; }
	.plusTag .box_st6:after { display:none; }
	.bbsSlt { width:100%; }
	.bbsSlt ul li a { padding: 0 0.5rem;}

	/* 대출 상품설명 */
	.box_atte { padding: 1.5rem 2rem; }

	/* 카드 전체상품 */
	.cardListWrap h3 { width: 70px; height: 70px; font-size:1rem; }
	.cardListWrap .cardList li a { padding:4rem 0 1rem; }
	.cardListWrap .cl_control a.btn_prev, .cardListWrap .cl_control a.btn_next { background:none; }
	.cardListWrap .cl_control a.btn_prev { left:-1rem; }
	.cardListWrap .cl_control a.btn_next { right:-1rem; }
	.cardListWrap .cl_control a:before { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); font-family: 'xeicon'; color:#d0d0d0; font-size:2.5rem; }
	.cardListWrap .cl_control a.btn_prev:before { content:"\e93d"; }
	.cardListWrap .cl_control a.btn_next:before { content:"\e940"; }

	/* 카드 상품설명 */
	.btnBox a { width:99%; margin-right:0;}

	/* 카드 기능페이지 */
	.slct_temp .tempbox { width:100%; height:125px; margin-right:0; margin-bottom:10px; }
	.slct_temp .temptitWrap {position: absolute; width:6rem; height:100%; border-bottom:none; border-right: 1px dashed #aaa;}
	.slct_temp .temptitWrap .checkbox { top:auto; bottom: 0.7rem; transform:translateY(0); -webkit-transform:translateY(0); }
	.slct_temp .tempbox .img { height:125px; padding:0.7rem 0.7rem 0.7rem 7rem; }
	.slct_temp .tempbox .img img { width:auto; height:100%;}

	/* 카드 기능페이지(팝업) */
	.popupWrap .popup dl dd ul li { width:48%; }

	/* 제휴카드 전체 */
	.cfCard_list > li > div { display:block; }
	.cfCard_list .info { width:100%; padding-left:1rem; }
	.cfCard_list .pictogram { width:100%; }
	.cfCard_list .card_mini img { transform: rotate(-90deg); -webkit-transform: rotate(-90deg); }

}

@media screen and (max-width: 480px){

	/* 카드 상품설명 */
	.serviceBox .specialserv .service { padding-left:0; padding-top:90px; }
	.serviceBox .specialserv .iconImg { top:0; left:50%; transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); }

}

@media screen and (max-width: 380px){

	/* 카드 전체상품 */
	i.hybrid { display:block; padding-left:0; }
	i.hybrid:before { display:none; }
	.cardListWrap .cl_control a { top:40%; }

	/* 카드 상품설명 */
	.cardView .img img { width:120px; }
	.cardListWrap .cl_control a.btn_prev { left:-2rem; }
	.cardListWrap .cl_control a.btn_next { right:-2rem; }

	/* 카드 기능페이지 */
	.templateWrap .iconCont { width:75%; }
	.templateWrap .iconCont .iconbox { width:100%; margin-right:0 !important; }
	
	/*온뱅크 안내페이지 200908*/
	.onbankPop .box { padding:4.5rem 1rem 2rem; }
}
}

@media print {
	.mtBox *[class*="mot"]{opacity:1 !important;}
	.mtBox.active *[class*="mot"]{transition-delay:0 !important; -webkit-transition-delay:0 !important;}
	#header, #footer, .sVisual, .locationWrap, .titleH2 {display: none; width: 0; height: 0;}
	.container { min-width:100%; page-break-after:always; zoom:65%; }
}