@charset "utf-8";
 
/* --------------------------------------------------------------------------------
	PAGE : 온라인대출신청 메인
-----------------------------------------------------------------------------------*/
[data-page="online"] #header {position:-webkit-sticky;position:sticky;left:0;right:0;top:0;background:#e5eef5;z-index:200;}
[data-page="online"] #container {padding:0 2.1rem 4.0rem;background:#e5eef5;}

[data-page="online"] [class*="btn-txt"]:first-child {padding-right:1.6rem;text-align:right;}
[data-page="online"] [class*="btn-txt"]:nth-child(2) {padding-left:1.6rem;text-align:left;}

[data-page="online"] .area-btn1 {background:#e5eef5;}
[data-page="online"] .area-btn1 {display:flex;text-align:center;}
[data-page="online"] .area-btn1 [class*="btn-"]+ [class*="btn-"] {margin:0 0 0 0;}

[data-page="online"] .area-btn1[data-area-fixed="bottom"] {position:fixed;left:0;right:0;bottom:0;padding:2.6rem 2.1rem 6.0rem;background:#e5eef5;z-index:100;}

@media only screen and (max-height:700px){
	[data-page="online"] .mes-headline2 {padding:3.8rem 0 0;}
	[data-page="online"] .area-btn1[data-area-fixed="bottom"] {padding:1.6rem 2.1rem 3.0rem;}
}

#sunLoan-alert-layer .btn-action2 {border-radius:0 !important;}
#sunLoan-alert-layer .btn-action2.btn-default {border-radius:0 !important;}

/* --------------------------------------------------------------------------------
	PAGE : 비대면계좌 모달팝업
-----------------------------------------------------------------------------------*/
/* modal */
[data-page="nonfacing"] #header[class*=modal] {height:5.4rem;border-bottom:0;}
[data-page="nonfacing"] [class*="mes-headline"] {position:relative;margin:0 0 4.0rem;width:100%;text-align:left;} 
[data-page="nonfacing"] [class*="mes-headline"] > p {position:relative;font-size:2.2rem;font-weight:400;line-height:3.2rem;color:#222;letter-spacing:-0.06rem;white-space:normal;}

[data-page="nonfacing"] .modal-content {padding:2.5rem 2.4rem 12.8rem;}

/* --------------------------------------------------------------------------------
	PAGE : 비대면계좌개설
-----------------------------------------------------------------------------------*/
[data-content="join-intro"] {overflow:hidden;position:relative;margin:12.5rem auto 0;padding:0 0 13.5rem;}
[data-content="join-intro"]:before {content:'';display:block;position:absolute;left:50%;top:0;width:16.6rem;height:13.5rem;margin:0 0 0 -8.3rem;background-image:url(../images/nonfacing/img-join-intro.png);background-repeat:no-repeat;background-position:100% 100%;background-size:100% 100%;}
[data-content="join-intro"] > .txt-bul2 {position:fixed;left:0;right:0;bottom:13rem;padding:0 2.4rem 0;}
    
@media only screen and (max-height:700px){
	[data-content="join-intro"] {margin:6.5rem auto 0;}
}
@media only screen and (max-height:660px){
	[data-content="join-intro"] {margin:3.5rem auto 0;}
}

[data-page="nonfacing-join"] > #container {padding:0 2.4rem 12.8rem;}
[data-content="join-form"] > :first-child {margin:4.5rem 0 4.0rem;}

[data-content="join-box"] {position:relative;margin:7.2rem 0 0;padding:8.0rem 0 0;width:100%;height:21.0rem;}
[data-content="join-box"]:before {content:'';display:block;position:absolute;left:50%;top:0;margin:0 0 0 -11.7rem;width:23.3rem;height:17.3rem;background:url(../images/nonfacing/bg-mobile.png) center 0 no-repeat;background-size:100% 100%;}
[data-content="join-box"] > .con-box2 {margin:0 0 6.0rem 0;height:11.8rem;}
[data-content="join-box"] .account-tit {margin:0 0 0.5rem 0;font-size:1.4rem;font-weight:400;line-height:2.0rem;color:#777;}
[data-content="join-box"] .account-info {bottom:3.8rem;}
[data-content="join-box"] .account-money {margin-left:0;font-size:2.0rem;font-weight:500;line-height:2.4rem;color:#333;}
[data-content="join-box"] .account-info > .account-money {margin-left:0.6rem;}
[data-content="join-box"] .account-money.asterisk {position:relative;}
[data-content="join-box"] .account-money.asterisk:after {content:'';display:inline-block;position:absolute;margin-left:0.6rem;width:8.2rem;height:2.5rem;background:url(../images/nonfacing/bg-asterisk.png) 0 0 repeat;background-size:8.2rem 2.5rem;}

@media only screen and (max-width:320px){
	[data-content="join-box"] > .con-box2 {height:14.0rem;min-height:11.8rem;}
	[data-content="join-box"] .account-info {bottom:2.4rem;}
}

.con-box3[data-content="user-info"]:after {content:'';display:block;position:absolute;bottom:0;right:2.4rem;width:6.0rem;height:6.5rem;background:url(../images/nonfacing/img-join-user.png) 0 0 no-repeat;background-size:6.0rem 6.5rem;}
.con-box3[data-content="user-info"] > dl > dd {font-size:1.6rem;color:#999;}
.con-box3[data-content="user-info"] > dl:first-child > dd {font-weight:600;color:#333;}

.idcard-area {position:relative;height:18.0rem;}
.idcard-area:before {content:'';display:block;position:absolute;left:50%;top:0;width:32.7rem;height:18.0rem;margin:0 0 0 -16.35rem;background:url(../images/nonfacing/bg-idcard.png) 0 0 no-repeat;background-size:100% 100%;}

.data-list1[data-content="bank-list"]  {flex-direction:row;}

.data-list1[data-content="bank-list"] li {display:inline-flex;padding:1.0rem 0;width:50%;}
[data-content="bank-list"] li.ico-bank {position:relative;padding-left:2.8rem;}
[data-content="bank-list"] li.ico-bank:before {content:'';display:block;position:absolute;left:0;top:1.1rem;width:2.0rem;height:2.0rem;}
[data-content="bank-list"] li.ico-bank.ka:before {background:url(../images/common/icon-kakao.png) 0 0 no-repeat;background-size:2.0rem 2.0rem;}

.data-list2[data-content="search-list"] {overflow:auto;margin:2.0rem 0 0;height:40.0rem;}

@media only screen and (max-height:670px){
	.form-search1.area-sub2 {margin:4.5rem 0 0 !important;}
	.data-list2[data-content="search-list"] {height:27.0rem;}
}

.data-list2[data-content="search-list"] li a {position:relative;display:block;padding:1.1rem 0 1.1rem 3.8rem;font-size:1.6rem;line-height:2.6rem;}
.data-list2[data-content="search-list"] li a:after {content:'';display:block;position:absolute;left:0;top:1.1rem;width:2.6rem;height:2.6rem;background:url(../images/common/icon-emoti-off.png) 0 0 no-repeat;background-size:100% 100%;}

.data-list2[data-content="search-list"] li a:focus {color:#00854a;}
.data-list2[data-content="search-list"] li a:focus:after {content:'';display:block;position:absolute;left:0;top:1.1rem;width:2.6rem;height:2.6rem;background:url(../images/common/icon-emoti-on.png) 0 0 no-repeat;background-size:100% 100%;}

.mes-headline1[data-content="join-complete"] {position:relative;padding:13.2rem 0 0;}
.mes-headline1[data-content="join-complete"]:before {content:'';display:block;position:absolute;left:50%;top:4.6rem;width:6.6rem;height:6.6rem;margin:0 0 0 -3.3rem;background:url(../images/common/icon-complete.png) 0 0 no-repeat;background-size:100% 100%;}

[class*="info-list"][data-content="complete-list"] {margin:6.4rem 0 1.2rem;padding:1.2rem 0;border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;}
[class*="info-list"][data-content="complete-list"] > dl {display:flex;font-size:1.5rem;line-height:3.2rem;color:#333;justify-content:space-between;}
[class*="info-list"][data-content="complete-list"] > dl > dt {color:#777;}
[class*="info-list"][data-content="complete-list"] > dl > dd > span {display:block;}

.mes-headline1 > .mes1,
.mes-headline1 > .mes2 {position:relative;font-size:2.2rem;line-height:3.2rem;color:#222;}

.staff-info {position:relative;padding:0 0.6rem;display:inline-flex;}
.staff-info > .staff-num {position:relative;padding-right:0.6rem;}
.staff-info:before {content:'(';display:block;position:absolute;left:0;top:0;}
.staff-info > .staff-num:after {content:')';display:block;position:absolute;right:0;top:0;}

/* --------------------------------------------------------------------------------
	PAGE : 비대면계좌개설 가이드
-----------------------------------------------------------------------------------*/
[data-page="nonfacing-list"] [class*="label-chk"] > li {padding:1.5rem 0;font-size:1.7rem;border-bottom:1px solid #eee;}
[data-page="nonfacing-list"] [class*="label-chk"] .link {top:1.5rem;}
[data-page="nonfacing-list"] [class*="label-chk"] .link:after {width:0.8rem;height:0.8rem;border-right:0.1rem solid #777;border-bottom:0.1rem solid #777;}

[data-page="main-list"] .mes-headline3 {padding:5.1rem 0 0;}
[data-page="main-list"] .mes-headline3 > :first-child {font-weight:500;color:#141414;}
[data-page="main-list"] .mes-headline3:not(:first-child) {padding:3.1rem 0 0;border-top:1px solid #e2e2e2;}
[data-page="main-list"] .mes-headline3 > p {position:relative;padding-left:1.5rem;}
[data-page="main-list"] .mes-headline3 > p:before {content:'';display:block;position:absolute;left:0;top:1.4rem;width:0.5rem;height:0.5rem;background:#222;border-radius:100%;}
[data-page="main-list"] [class="contents-area"] > :first-child {margin:2.5rem 0 6.0rem;}
[data-page="main-list"] [class="list1"] > li {margin-bottom:1.0rem;}
[data-page="main-list"] [class="list1"] > li > a {position:relative;display:block;padding:1.2rem 1.5rem;font-size:1.7rem;color:#fff;border-radius:1.0rem;}
[data-page="main-list"] [data-content="nonfacing"] li > a {background:#4fb84f;}
[data-page="main-list"] [data-content="easyloan"] li > a {background:#0088cb;}
[data-page="main-list"] [data-content="app-main"] li > a {background:#fd752e;}
[data-page="main-list"] [class="list1"] > li > a > span {padding-left:0.5rem;font-size:1.5rem;opacity:0.7;}
[data-page="main-list"] [class="list1"] > li > a:after {content:'';display:block;position:absolute;right:1.8rem;top:50%;width:0.6rem;height:0.6rem;margin:-0.5rem -0.2rem;border-right:0.1rem solid #fff;border-bottom:0.1rem solid #fff;transform:rotate(-45deg);}

[data-page="nonfacing-list"] .mes-headline3 p > button {position:absolute;top:-1.0rem;width:5.4rem;height:5.4rem;background-position:50%;background-size:2.4rem 2.0rem;background-repeat:no-repeat;text-indent:-9999px;}
[data-page="nonfacing-list"] .mes-headline3 p > button.ico-menu {right:-1.0rem;background-image:url(../images/common/icon-menu.png);}