@charset "utf-8";
 
 /*
* Noto Sans KR (korean) http://www.google.com/font/earlyaccess
*/

@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:100;
	src:url(../font/notosanskr/NotoSansKR-Thin.woff2) format('woff2'),
		url(../font/notosanskr/NotoSansKR-Thin.woff) format('woff'),
		url(../font/notosanskr/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:300;
	src:url(../font/notosanskr/NotoSansKR-Light.woff2) format('woff2'),
		url(../font/notosanskr/NotoSansKR-Light.woff) format('woff'),
		url(../font/notosanskr/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:400;
	src:url(../font/notosanskr/NotoSansKR-Regular.woff2) format('woff2'),
		url(../font/notosanskr/NotoSansKR-Regular.woff) format('woff'),
		url(../font/notosanskr/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:500;
	src:url(../font/notosanskr/NotoSansKR-Medium.woff2) format('woff2'),
		url(../font/notosanskr/NotoSansKR-Medium.woff) format('woff'),
		url(../font/notosanskr/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:700;
	src:url(../font/notosanskr/NotoSansKR-Bold.woff2) format('woff2'),
		url(../font/notosanskr/NotoSansKR-Bold.woff) format('woff'),
		url(../font/notosanskr/NotoSansKR-Bold.otf) format('opentype');
}

/* --------------------------------------------------------------------------------
	# COMMONET
	# 초기화 및 LAYOUT
-----------------------------------------------------------------------------------
	RESET
--------------------------------------------------------------------------------- */
html, body, div, span, object, iframe,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main, summary,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
form, fieldset, legend, input, label, button, textarea, select, textarea, input, data,
table, caption, tbody, tfoot, thead, tr, th, td,
b, i, dl, dt, dd, ol, ul, li,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var,
time, mark, audio, video, a {margin:0;padding:0;box-sizing:border-box;}

html {font-size:62.5%;-webkit-overflow-scrollng:touch;}
html, body {width:100%;height:100%;}
body {background:#fff;line-height:1.625;color:#666;word-break:keep-all;-ms-text-size-adjust:100%;-webkit-test-size-adjust:100%;}
body, select, input, button, textarea, button, pre {font-size:1.6rem;font-family:'Pretendard', -apple-system, BlinkMacSystemfont, AppleSDGothicNeo-Regular, 'Noto Sans KR', Roboto, Mulgun Gothic, '맑은 고딕', dotum, '돋움', sans-serif;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main, summary {display:block;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:none;}

h1, h2, h3, h4, h5, h6 {font-size:100%;font-weight:normal;}
cite, em, dfn, address {font-style:normal;}
fieldset, iframe {border:0 none;}
fieldset {min-width:0;}
ins {text-decoration:none;}
del {text-decoration:line-through;}

ol, ul, li {list-style:none;}
img, fieldset, iframe {border:0 none;}
img, video, audio, object, embed, iframe {max-width:100%;height:auto;}

legend:not([class]), caption {position:absolute;width:1px;height:1px;margin:-1px;font-size:1px;opacity:0;white-space:nowrap;overflow:hidden;}
i, em, address {font-style:normal;}

input, select, textarea {border:1px solid #ccc;color:#333;/*border-radius:0.6rem;*/-webkit-appearance:none;-moz-appearance:none;appearance:none;}
label, button {cursor:pointer;}
button {cursor:pointer;padding:0;background:none;border:0 none;}
select::-ms-expand {display:none;}
textarea {border:1px solid #ccc;resize:vertical;}
input[type="text"]::-ms-clear {display:none;}
input[type="radio"], input[type="checkbox"], input[type="tel"], input[type="number"] {vertical-align:middle;}
input[type="number"] {-moz-appearace:textfield;}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {-webkit-appearance:none;}
input[type="file"]::-webkit-file-upload-button {cursor:pointer;}
input::-ms-clear {display:none;width:0;height:0;}

table {width:100%;empty-cells:show;border-collapse:separate;border-spacing:0;table-layout:fixed;}
table th {font-weight:normal;}

mark {background:none;}

a, a:visited {color:inherit;}
a:link, a:hover {text-decoration:none;}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus {background-color:transparent;transition:background-color 5000s ease-in-out 0s;}

.hide {overflow:hidden;position:absolute;left:-1px;top:-1px;width:1px;height:1px;opacity:0;}
.none {display:none;}

[role="button"] {cursor:pointer;}

/* --------------------------------------------------------------------------------
	LAYOUT : HEADER
--------------------------------------------------------------------------------- */
#header {position:-webkit-sticky;position:sticky;left:0;right:0;top:0;height:5.4rem;background:#fff;z-index:200;}
#header > h1 {line-height:5.4rem;font-size:1.8rem;font-weight:500;text-align:center;color:#111;letter-spacing:-0.02rem;}
#header > button {position:absolute;top:0;width:5.4rem;height:5.4rem;background-position:50%;background-size:2.4rem 2.0rem;background-repeat:no-repeat;text-indent:-9999px;}
#header > button.ico-prev {left:0;background-image:url(../images/common/icon-prev.png);}
#header > button.ico-menu {right:0;background-image:url(../images/common/icon-menu.png);}

/* --------------------------------------------------------------------------------
	LAYOUT : CONTAINER
--------------------------------------------------------------------------------- */
#container {margin:0 auto;padding:0 2.4rem 4.0rem;max-width:100vw;min-height:calc(100vh - 5.4rem);}

/* --------------------------------------------------------------------------------
	COMMONET : MESSAGE
-----------------------------------------------------------------------------------*/
[class*="mes-headline"] {position:relative;width:100%;text-align:center;}
[class*="mes-headline"] > :first-child {color:#222;}
[class*="mes-headline"] > :first-child ~ .sub {margin:2.4rem 0 0;font-size:1.4rem;font-weight:400;line-height:2.2rem;color:rgba(255, 255, 255, .85);}

.mes-headline1 {padding:7.8rem 0 0;}
.mes-headline1 > :first-child {position:relative;font-size:2.2rem;line-height:3.2rem;}
.mes-headline1 > :first-child strong {display:block;font-weight:500;}

.mes-headline2 {padding:5.8rem 0 0;}
.mes-headline2 > :first-child {position:relative;font-size:2.0rem;font-weight:300;line-height:3.2rem;color:#111;letter-spacing:-0.1rem;}
.mes-headline2 > p > span {display:inline-block;font-size:2.1rem;font-weight:500;}

.mes-headline3 {padding:2.1rem 0 0;}
.mes-headline3 > :first-child {position:relative;font-size:2.2rem;font-weight:400;line-height:3.2rem;color:#222;letter-spacing:0.02rem;}

/* --------------------------------------------------------------------------------
	# COMMONET : TITIE
-----------------------------------------------------------------------------------*/
.tit-sub1 {font-size:1.6rem;font-weight:400;line-height:2.2rem;color:#333;word-break:break-all;}
.tit-sub1 + [class*="label-btn"] {margin:1.8rem 0 0;}

/* --------------------------------------------------------------------------------
	COMMONET : BOX-CONTENT
-----------------------------------------------------------------------------------*/
.con-box1 li {position:relative;margin:2.0rem 0 0;padding:2.6rem 0 0;height:18.0rem;background:#fff;border-radius:1.2rem;box-shadow:0 3px 9px 0 rgba(0, 0, 0, 0.06);}
.con-box1 li:first-child {margin:4.5rem 0 0;}
.con-box1 li[class*="ic"]:before {content:'';display:block;position:absolute;right:2.8rem;top:2.8rem;}
.con-box1 li.ic1:before {width:5.0rem;height:5.0rem;background:url(../images/sunloan/bg-online01.png) 0 0 no-repeat;background-size:5.0rem 5.0rem;}
.con-box1 li.ic2:before {width:9.3rem;height:7.5rem;background:url(../images/sunloan/bg-online02.png) 0 0 no-repeat;background-size:9.3rem 7.5rem;}
.con-box1 li > p {padding:0 0 0 2.4rem;}
.con-box1 li > .tit {font-size:1.8rem;font-weight:600;line-height:2.4rem;color:#111;}
.con-box1 li > .tit + p {margin-top:1.0rem;font-size:1.4rem;font-weight:400;line-height:1.8rem;}

.con-box2 {position:relative;margin:4.0rem 0 0;padding:2.8rem 2.4rem 2.4rem;height:15.0rem;background:#fff;border:1px solid #00854a;border-radius:1.0rem;box-shadow:0 3px 9px 0 rgba(0, 0, 0, 0.06);}
.con-box2 .icon-tit {position:absolute;left:-0.1rem;top:-1.2rem;padding:0 1.2rem;height:2.4rem;line-height:2.4rem;font-size:1.3rem;font-weight:300;letter-spacing:-0.1rem;color:#fff;background:#4fb84f;border-top-right-radius:1.2rem;border-bottom-right-radius:1.2rem;}
.con-box2 .account-tit {font-size:1.6rem;font-weight:600;line-height:2.0rem;color:#00854a;}
.con-box2 .account-num {margin-top:0.2rem;font-size:1.4rem;font-weight:300;line-height:2.0rem;color:#aaa;letter-spacing:0.05rem;}

.con-box2 .account-info {position:absolute;right:2.4rem;bottom:2.4rem;}
.account-info {font-size:1.4rem;font-weight:400;line-height:2.0rem;color:#777;}
.account-money {margin-left:0.6rem;font-size:2.2rem;font-weight:700;line-height:3.2rem;color:#222;letter-spacing:0;}
.account-money > em {font-size:2.4rem;}

.con-box3 {position:relative;padding:1.7rem 2.4rem;background:#fff;border:1px solid #e2e2e2;border-radius:0.8rem;box-shadow:0 3px 9px 0 rgba(0, 0, 0, 0.06);}

/* --------------------------------------------------------------------------------
	COMMONET : BUTTON
-----------------------------------------------------------------------------------*/
[class*="btn-action"] {position:relative;display:inline-block;padding:0 0.6rem;text-align:center;vertical-align:top;white-space:nowrap;font-weight:700;}
[class*="btn-action"], [class*="btn-action"]:visited {color:#fff;}
[class*="btn-"]:disabled, [class*="btn-"]:disabled:focus {color:#999;background:#eee;border:1px solid #eee;}

.area-btn1 {position:relative;}
.area-btn1[data-area-fixed="bottom"] {position:fixed;left:0;right:0;bottom:0;padding:2.6rem 1.6rem 4.0rem;background-image:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.8) 2rem, rgba(255,255,255,1));z-index:100;}

.area-btn1 > .icon-tit {position:absolute;left:0;top:-1.2rem;padding:0 0.8rem;height:2.5rem;line-height:2.7rem;font-size:1.2rem;font-weight:400;letter-spacing:-0.1rem;color:#fff;background:#4fb84f;border-top-right-radius:1.2rem;border-bottom-right-radius:1.2rem;z-index:100;}
.btn-action1 {position:relative;display:inline-flex;height:5.0rem;padding:1.0rem 0.6rem;font-size:1.6rem;font-weight:500;line-height:2.1rem;color:#00854a;background:#fff;border:1px solid #00854a;flex-direction:column;justify-content:center;align-items:center;border-radius:0.8rem;}

.area-btn1 ~ [class*="txt-bul"] {margin:2.4rem 0 0;}

.btn-action2 {display:inline-flex;height:5.0rem;padding:1.8rem 0.6rem;font-size:1.5rem;font-weight:400;line-height:2.0rem;color:#fff;background:#3191dd;flex-direction:column;justify-content:center;align-items:center;border-bottom-left-radius:1.2rem;border-bottom-right-radius:1.2rem;}
.btn-action2:first-child {border-bottom-right-radius:0;}
.btn-action2:nth-child(2) {border-bottom-left-radius:0;}
.btn-action2:only-child {width:100%;border-bottom-left-radius:1.2rem;border-bottom-right-radius:1.2rem;}

.btn-action2.btn-default {color:#666;background:#f6f6f6;}

.btn-action2 .ic1 {position:relative;padding-left:2.8rem;}
.btn-action2 .ic1:before {content:'';display:block;position:absolute;left:0;top:0;width:2.0rem;height:2.0rem;background:url(../images/sunloan/icon-confirm.png) 0 0 no-repeat;background-size:2.0rem 2.0rem;}

a[class*="btn-txt"] {position:relative;font-size:1.4rem;font-weight:400;line-height:2.0rem;color:#333;}
[class*="btn-txt"]:before {content:'';display:block;position:absolute;left:0;top:0.4rem;bottom:0.2rem;width:0.1rem;background:#ccc;}
[class*="btn-txt"]:first-child:before {display:none;}

.btn-action3 {display:inline-block;height:5.6rem;padding:1.8rem 0.6rem;font-size:1.7rem;font-weight:400;line-height:2.4rem;color:#fff;background:#00854a;border:1px solid #00854a;flex-direction:column;justify-content:center;align-items:center;border-radius:0.8rem;}
.btn-action3:only-child {width:100%;}
.btn-action3.btn-default {color:#666;background:#fff;border:1px solid #ddd;}
.area-btn1 [class*="btn-"] + [class*="btn-"] {margin:0 0 0 0.6rem;}

[class*="btn-"].c1 {background:#f2f2f2;}
[class*="btn-"].c1, 
[class*="btn-"].c1:visited {color:#999;}
.btn-sub3 {padding:0.7rem 0.9rem;font-size:1.3rem;line-height:1.8rem;color:#00854a;background:#edf7ed;border-radius:1.5rem;}

.btn-check1 span {position:relative;padding-right:2.6rem;}
.btn-check1 span:after {content:'';display:block;position:absolute;right:0;top:50%;width:2.4rem;height:2.4rem;margin:-1.2rem 0 0;background:url(../images/common/icon-check1-on.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}
.alpah50 {opacity:0.5;}

.btn-action1[class*="btn-sub"] {min-width:8.5rem;height:3.3rem;font-size:1.3rem;color:#666;border:1px solid #e2e2e2;}

/* --------------------------------------------------------------------------------
	COMMONET : BUTTON AREA
-----------------------------------------------------------------------------------*/
.area-btn1 {display:flex;text-align:center;}
.area-btn1 [class*="btn-"] {flex:1;}

.con-box1 .area-btn1 {position:absolute;bottom:0;width:100%;}

.area-btn2 {overflow:hidden;text-align:right;}

/* --------------------------------------------------------------------------------
	# COMMONET : TEXT : 블릿형
-----------------------------------------------------------------------------------*/
.info-txt dl {margin:3.0rem 0 0;}
.info-txt dt + dd {margin:1.0rem 0 0;}

[class*="txt-bul"] > li, 
[class*="txt-bul"] > dd, 
[class*="txt-bul"]:not(ol):not(ul):not(dl) {padding:0 0 0 1.4rem;}
[class*="txt-bul"] > li:before, 
[class*="txt-bul"] > dd:before, 
[class*="txt-bul"]:not(ol):not(ul):not(dl):before {content:'';display:block;float:left;}

.txt-bul1 > li:before, 
.txt-bul1 > dd:before, 
.txt-bul1:not(ol):not(ul):not(dl):before {content:'※';margin:0 0 0 -1.6rem;}

dt.txt-bul1 {padding:0 0 0 1.6rem !important;font-size:1.5rem;font-weight:500;line-height:1.8rem;text-align:left;color:#666;}
dt.txt-bul1 + dd:only-of-type {font-size:1.4rem;line-height:2.0rem;text-align:left;color:#777;word-break:break-all;}

.txt-bul2 > li, 
.txt-bul2 > dd, 
.txt-bul2:not(ol):not(ul):not(dl) {font-size:1.4rem;line-height:2.0rem;text-align:left;color:#777;}
.txt-bul2 > li:before, 
.txt-bul2 > dd:before, 
.txt-bul2:not(ul):not(dl):before {width:0.4rem;height:0.4rem;margin:0.8rem 0.7rem 0 -1.4rem;background:#00854a;border-radius:100%;}
.txt-bul2 > li + li {margin-top:1.0rem;}

.txt-bul3 > li, 
.txt-bul3 > dd, 
.txt-bul3:not(ol):not(ul):not(dl) {font-size:1.5rem;line-height:3.2rem;text-align:left;color:#777;}
.txt-bul3 > li:before, 
.txt-bul3 > dd:before, 
.txt-bul3:not(ul):not(dl):before {width:0.4rem;height:0.4rem;margin:1.3rem 0.7rem 0 -1.4rem;background:#00854a;border-radius:100%;}

/* --------------------------------------------------------------------------------
	# COMMONET : TEXT : 하이라이트/강조형
-----------------------------------------------------------------------------------*/
[class*="txt-t-"] {display:inline-block;position:relative;padding:0 2px;margin:0 -2px;}
.txt-t1 {box-shadow:inset 0 -15px rgba(113, 233, 232, .35);}
.txt-t2 {box-shadow:inset 0 -8px rgba(253, 117, 46, .25);}

.txt-color1 {color:#f15a22;}

.txt-left {text-align:left !important;}
.txt-center {text-align:center !important;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM AREA
--------------------------------------------------------------------------------- */
.form[class*="mode"] ~ .form[class*="mode"] {margin:4.0rem 0 0;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM ELEMENT : RADIO/CHECKBOX(기본형)
--------------------------------------------------------------------------------- */
[class*="label-chk"] {position:relative;}
[class*="label-chk"] > label, 
[class*="label-chk"] > div {position:relative;display:inline-block;vertical-align:top;}
[class*="label-chk"] input {position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;width:100%;height:100%;z-index:1;cursor:pointer;}
[class*="label-chk"] input + span {position:relative;display:inline-block;font-size:1.7rem;font-weight:500;line-height:2.5rem;color:#333;}
[class*="label-chk"] input + span:before,
[class*="label-chk"] input + span:after {content:'';display:block;position:absolute;left:0;top:0.5rem;box-sizing:border-box;}

[class*="label-chk"] > li {position:relative;}
[class*="label-chk"] > li > label {position:relative;display:inline-block;vertical-align:top;}

[class*="label-chk"][class*=" list"],
[class*="label-chk"][class*=" list"] > label, 
[class*="label-chk"][class*=" list1"] > div {display:block;}
[class*="label-chk"][class*=" list"] > label, 
[class*="label-chk"][class*=" list1"] > div {padding:1.2rem 0;}
[class*="label-chk"][class*=" list"] input + span {padding-right:0;white-space:normal;word-break:break-all;}

.label-chk1 input + span {display:block;padding:0.5rem 1.2rem 0.5rem 3.4rem;}
.label-chk1 input + span:after {width:2.4rem;height:2.4rem;background:url(../images/common/icon-check2-off.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}
.label-chk1 input:checked + span:after {background:url(../images/common/icon-check2-on.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}

[class*="label-chk"] .link {right:-0.4rem;top:0;color:transparent;}
[class*="label-chk"] .link:after {border-right:0.1rem solid #aaa;border-bottom:0.1rem solid #aaa;}

.label-chk1.list1 input + span {padding:0.4rem 0 0.4rem 3.0rem;font-size:1.4rem;font-weight:400;line-height:2.5rem;color:#777;}
.label-chk1.list1 input + span:after {width:2.4rem;height:2.4rem;background:url(../images/common/icon-check1-off.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}
.label-chk1.list1 input:checked + span:after {background:url(../images/common/icon-check1-on.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM : RADIO/CHECKBOX(버튼형)
--------------------------------------------------------------------------------- */
[class*="label-btn"] {position:relative;overflow:hidden;display:flex;text-align:center;}
[class*="label-btn"]:not(:last-child) {margin:0 0 2.0rem;}
[class*="label-btn"] input {position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;width:100%;height:100%;}
[class*="label-btn"] > label {overflow:hidden;position:relative;flex:1;display:flex;align-items:center;}
[class*="label-btn"] > label > span {display:block;padding:0 0.4rem;font-size:1.6rem;line-height:2.4rem;color:#333;background:#f6f6f6;width:100%;}
[class*="label-btn"] > label > span:before {content:'';position:absolute;left:0;right:0;top:0;bottom:0;border:1px solid #e2e2e2;transition:all 0.3s ease;}
[class*="label-btn"] > label > input:checked + span {font-weight:500;color:#00854a;background:#fff;}
[class*="label-btn"] > label > input:checked + span:before {border:1px solid #00854a;}
[class*="label-btn"] > label > input:disabled + span {color:#eee;}

.label-btn1 > label > span {padding:1.2rem 0.4rem;}
.label-btn1 > label > span, 
.label-btn1 > label > span:before {border-radius:0.8rem;}
.label-btn1 > label:first-child > span, 
.label-btn1 > label:first-child > span:before {border-top-right-radius:0;border-bottom-right-radius:0;}
.label-btn1 > label:last-child > span, 
.label-btn1 > label:last-child > span:before {border-top-left-radius:0;border-bottom-left-radius:0;}

.label-btn2:not(:last-child) {margin:0 0 1.0rem;}
.label-btn2 > label > span {padding:1.2rem 2.0rem;text-align:left;background:#fff;border:1px solid #e2e2e2;border-radius:0.8rem;}
.label-btn2 > label > span:before {border-radius:0.8rem;transition:none;}
.label-btn2 > label > input:checked + span {font-weight:500;color:#00854a;background:#fff;}
.label-btn2 > label > input:checked + span:before {background:url(../images/common/icon-radio1-on.png) right 1.6rem center no-repeat;background-size:2.8rem 2.8rem;border:1px solid #00854a;}

.label-btn3 {margin:0 -0.3rem;}
.label-btn3 > label > span {margin:0 0.3rem;padding:0.8rem 0.4rem;font-size:1.4rem;line-height:1.8rem;color:#666;background:#f6f6f6;}
.label-btn3 > label > span, 
.label-btn3 > label > span:before {border:0;border-radius:0.3rem;}
.label-btn3 > label > input:checked + span {font-weight:500;color:#00854a;background:#edf7ed;}
.label-btn3 > label > input:checked + span:before {border:0;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM AREA : 약관동의
--------------------------------------------------------------------------------- */
.form-agree1 .area {padding:0 0 1.6rem 3.0rem;color:#999;}
.form-agree1 .area .label-chk1 {margin:0 0 0 -3.0rem;}
.form-agree1 .area .label-chk1 + .label-chk1.basic:before {margin-top:0.6rem;}
.form-agree1 .area .label-chk1 + .label-chk1.list1 > label {padding:0;}
.form-agree1 .area .label-chk1 label:not(:last-child) input + span {padding-right:2.4rem;}
.form-agree1 .area > .label-chk1:first-child {margin-top:-0.6rem;}
.form-agree1 .area .mes {margin:1.2rem 0 0;font-size:1.2rem;line-height:1.8rem;text-align:left;}
.form-agree1 .validation {padding:0 1.6rem;}
.form-agree1 fieldset.area:not(:only-of-type) + fieldset.area:not(:only-of-type) {margin-top:-2.0rem;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM ELEMENT : 공통
--------------------------------------------------------------------------------- */
::-webkit-input-placeholder {font-weight:normal;color:#c2c2c2;text-align:left;-webkit-text-fill-color:#c2c2c2;}
::placeholder {font-weight:normal;color:#c2c2c2;text-align:left;-webkit-text-fill-color:#c2c2c2;}
.inline-form [data-input="password"] > input[type="password"]::-webkit-input-placeholder {font-size:1.8rem;font-weight:normal;color:#ddd;text-align:center;-webkit-text-fill-color:#ddd;}
.inline-form [data-input="password"] > input[type="password"]::placeholder {font-size:1.8rem;font-weight:normal;color:#ddd;text-align:center;-webkit-text-fill-color:#ddd;}

[class*="el-"].w-p100 {margin-left:0 !important;}

[class*="el-text"], 
[class*="el-select"] {position:relative;display:inline-block;vertical-align:top;color:#333;}
[class*="el-text"] input, 
input[class*="el-text"], 
[class*="el-select"] {border:0;border:0;background:transparent;}
[class*="el-text"] input, 
input[class*="el-text"] {width:100%;}

[class*="el-text"] input, 
input[class*="el-text"],
[class*="el-select"] select,
[class*="el-select"] input {padding:0;border:0;border-radius:0;}
[class*="el-text"] input:focus,
[class*="el-select"] select:focus,
[class*="el-select"] input:focus {outline:0;}
[class*="el-select"] select,
[class*="el-select"] input {background:url(../images/common/icon-select.png) 100% 50% no-repeat;background-size:1.8rem 1.6rem;}

.form-search1 {position:relative;}
.form-search1 [class*="el-text"] {width:100%;}
.form-search1 [class*="el-text"] input {padding-right:4.4rem;}
.form-search1 .btn {position:absolute;right:0;bottom:0;z-index:2;}
.btn[class*="icon-"] {overflow:hidden;display:inline-block;width:4.4rem;height:4.4rem;}
.btn[class*="icon-"]:after {content:'';display:block;position:absolute;left:1.0rem;top:1.0rem;}
.icon-search:after {width:2.4rem;height:2.4rem;background:url(../images/common/icon-search.png) 0 0 no-repeat;background-size:2.4rem 2.4rem;}

.el-text1 input, 
input.el-text1,
.el-select1 select,
.el-select2 input {width:100%;height:4.4rem;font-size:1.8rem;line-height:2.4rem;border-bottom:1px solid #e2e2e2;}
.el-text1 input:focus, 
input:focus.el-text1,
.el-select1 select:focus,
.el-select2 input:focus {border-color:#00854a;}

.inline-form {display:flex;}
.inline-form [class*="el-"] {display:inline-flex;flex:1;}
.inline-form > span {display:inline-flex;margin:0 1.5rem;font-size:2.0rem;justify-content:center;align-items:center;}

input[type="number"].num-pw {-webkit-text-security:disc;}
/*input[type="password"].num-pw {font-size:5rem;color:#00854a;-webkit-text-security:disc;}*/

.inline-form [data-input="password"] {position:relative;margin:1.0rem 0;justify-content:center;}
.inline-form [data-input="password"] > input[type="password"] {position:relative;font-size:2.2rem;text-align:center;border-bottom:0;}

[class*="el-text"] .link {right:-0.4rem;top:0.8rem;color:transparent;}
[class*="el-text"] .link:after {border-right:0.1rem solid #ccc;border-bottom:0.1rem solid #ccc;}

button.ico-close {position:absolute;right:0;top:1.2rem;width:3.0rem;height:3.0rem;background:url(../images/common/icon-close.png) center no-repeat;background-size:2.6rem 2.6rem;text-indent:-9999px;}

[data-page="modal-bottom"].select-open .modal {bottom:0;}
[data-page="modal-bottom"].select-open {position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, .5);transition:all 600ms cubic-bezier(0.86, 0, 0.07, 1);z-index:1000;}

/* --------------------------------------------------------------------------------
	COMPONENT : FORM AREA : 입력폼 유형1
--------------------------------------------------------------------------------- */
[class*="wrap-form"] {position:relative;margin:0 0 5.6rem;}
[class*="wrap-form"] legend[class*="headline"] {width:100%;font-weight:700;color:#999;}
[class*="wrap-form"] legend.headline {margin:0 0 1.2rem;font-size:1.6rem;line-height:2.2rem;}
[class*="wrap-form"] legend.headline1 {margin:0 0 2.0rem;font-size:2.0rem;line-height:2.6rem;}
[class*="wrap-form"] legend.line {padding:0 0 1.1rem;border-bottom:2px solid #999;}
[class*="wrap-form"] .form {position:relative;display:block;}
[class*="wrap-form"] .form > [class*="el-text"]:only-child,
[class*="wrap-form"] .form > [class*="el-select"]:only-child {width:100%;}
[class*="wrap-form"] .form > dt {font-size:1.4rem;color:#777;}
[class*="wrap-form"] .form > dd > [class*="el-text"]:only-child,
[class*="wrap-form"] .form > dd > [class*="el-select"]:only-child {width:100%;}
[class*="wrap-form"] .form > dd + dd {margin:1.5rem 0 0;}
[class*="wrap-form"] .form ~ .form {margin:4.0rem 0 0;}
[class*="wrap-form"] .form ~ .form.el-textarea1 {margin:2.0rem 0 0;}
[class*="wrap-form"] .form ~ .form.form-agree1 {margin:2.4rem 0 0;}
[class*="wrap-form"] .form.form-agree1 + .form {margin:2.4rem 0 0;}
[class*="wrap-form"] .form .bottom {font-size:1.2rem;line-height:1.6rem;color:#999;}
[class*="wrap-form"] .form .bottom {margin:0.6rem 0 0;}
[class*="wrap-form"] .form .side {position:absolute;right:0;bottom:0.5rem;margin:0;z-index:10;}
[class*="wrap-form"] .form .side.btn {bottom:0.8rem;}
[class*="wrap-form"] .form .side.area-tooltip1 {position:absolute;right:0;top:2.0rem;}

[class*="wrap-form"] .fieldset + .fieldset {margin:4.0rem 0 0;}

form [class*="wrap-form"] legend:not(.headline) + div.form {margin-top:0;}

/* 단일형 */
.wrap-form1 dl.form[class*=" mode"] {margin:4.0rem 0 0;}
.wrap-form1 dl.form[class*=" mode"] > dt {margin:0 0 1.0rem;color:#999;font-size:1.6rem;line-height:2.4rem;font-weight:700;}
.wrap-form1 dl.form[class*=" mode"] > dt [class*="icon-com"] {vertical-align:top;}
.wrap-form1 dl.form[class*=" mode"]:first-child,
.wrap-form1 legend + dl.form[class*=" mode"] {margin-top:0;}

.form[class*=" mode"] + [class*="txt-bul"] {margin:2.0rem 0 0;}
.form ~ [class*="txt-bul"] {margin:7.0rem 0 0;}
.form ~ p[class*="txt-bul"] {margin:2.4rem 0 0;}

[class*="wrap-form"] .form .side [class*="txt-"] {font-size:1.4rem;line-height:1.8rem;}

/* --------------------------------------------------------------------------------
	COMPONENT : LINK
--------------------------------------------------------------------------------- */
.link {overflow:hidden;display:block;position:absolute;right:-0.4rem;top:0;width:3.2rem;height:3.2rem;font-size:1px;color:transparent;z-index:1;}
.link:after {content:'';display:block;position:absolute;right:50%;top:50%;width:0.6rem;height:0.6rem;margin:-0.5rem -0.2rem;border-right:0.1rem solid #ccc;border-bottom:0.1rem solid #ccc;transform:rotate(-45deg);}

/* --------------------------------------------------------------------------------
	COMPONENT : 간격
--------------------------------------------------------------------------------- */
.area-sub1 {margin:11.4rem 0 0 !important;}
.area-sub2 {margin:7.0rem 0 0 !important;}

/* --------------------------------------------------------------------------------
	COMMONET : IMG
-----------------------------------------------------------------------------------*/
.info-img1 {margin:8.0rem 1.6rem 4.8rem;text-align:center;}
.info-img2 {margin:0 0 1.6rem;}

/* --------------------------------------------------------------------------------
	COMMONET : LIST
-----------------------------------------------------------------------------------*/
[class*="data-list"] {display:flex;}

.data-list1 {display:flex;flex-wrap:wrap;flex-direction:column;text-align:left;}
.data-list1 li {padding:0.6rem 0;font-size:1.6rem;line-height:2.4rem;color:#222;}

[class*="info-list"][data-content="complete-list"] {margin:6.4rem 0 0;border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;}

/* --------------------------------------------------------------------------------
	COMMONET : MODAL1 : full
-----------------------------------------------------------------------------------*/
#header[class*=modal] {height:5.4rem;border-bottom:0;}
#header[class*=modal-header] > .ico-close {position:absolute;right:0;top:0;width:5.4rem;height:5.4rem;background-image:url(../images/common/icon-close.png);background-size:2.6rem 2.6rem;}

[class*="modal-mes-headline"] {position:relative;width:100%;}
[class*="modal-mes-headline"] > :first-child {color:#666;font-weight:500;white-space:break-spaces;}
[class*="modal-mes-headline"] > :first-child ~ .sub,
.sub:only-of-type {margin:1.5rem 0 0;font-size:1.4rem;line-height:2.2rem;text-align:center;color:#666;}

.modal-mes-headline1 > :first-child {position:relative;font-size:1.5rem;line-height:2.4rem;}

.modal-body {max-height:100vh;}
.modal-content {padding:2.5rem 2.1rem;min-height:calc(100vh - 5.4rem);overflow-y:auto;}

.tbl-basic {position:relative;margin-top:2.5rem;width:100%;border-top:1px solid #666;}
.tbl-basic th,
.tbl-basic td {padding:1.0rem 0.5rem;font-size:1.4rem;font-weight:300;line-height:1.8rem;color:#666;letter-spacing:0.1rem;word-break:break-all;border-bottom:1px solid #ddd;}
.tbl-basic th {font-weight:500;color:#333;}

/* --------------------------------------------------------------------------------
	COMMONET : MODAL2 : bottom
-----------------------------------------------------------------------------------*/
body.no-scroll {position:fixed;overflow:hidden;width:100%;max-height:100vh;}
[data-page="modal-bottom"] .modal {position:fixed;left:0;right:0;bottom:-100%;margin:0;
padding:0 2.4rem 3.0rem;max-height:60vh;min-height:26.6rem;background:#fff;border-top-left-radius:1.0rem;border-top-right-radius:1.0rem;transition:all 600ms cubic-bezier(0.86, 0, 0.07, 1);}
[data-page="modal-bottom"] .modal-header {position:sticky;left:0;right:0;top:0;line-height:6.4rem;background:#fff;z-index:100;}

[data-page="modal-bottom"] .modal-header[class*="notice"] {margin-top:3.2rem;}
[data-page="modal-bottom"] .modal-header[class*="notice"]:before {content:'';display:block;position:absolute;left:50%;}
[data-page="modal-bottom"] .modal-header.notice1:before {margin:0 0 0 -1.8rem;width:3.6rem;height:3.6rem;background-image:url(../images/common/icon_point.png);background-size:3.6rem 3.6rem;}
[data-page="modal-bottom"] .modal-header.notice2:before {margin:0 0 0 -2.25rem;width:4.5rem;height:3.6rem;background-image:url(../images/common/icon-alert2.png);background-size:4.5rem 3.6rem;}
[data-page="modal-bottom"] .modal-header h1 {font-size:1.8rem;font-weight:500;color:#333;}

[data-page="modal-bottom"] [class*="notice"] + .modal-body {padding:3.6rem 0 0;}
[data-page="modal-bottom"] .modal-body {overflow-y:auto;max-height:40vh;font-size:1.6rem;line-height:2.4rem;text-align:center;color:#333;} 
[data-page="modal-bottom"] .modal-body > p {margin:1.8rem 0 0;}
[data-page="modal-bottom"].modal-open .modal {bottom:0;}
[data-page="modal-bottom"].modal-open {position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, .5);transition:all 600ms cubic-bezier(0.86, 0, 0.07, 1);z-index:1000;}
[data-page="modal-bottom"] .area-btn1[data-area-fixed="bottom"] {background:#fff;z-index:1000;}

@media only screen and (max-width:320px){
	[data-page="modal-bottom"] .modal {min-height:28.0rem;}
}

/* --------------------------------------------------------------------------------
	COMMONET : As-Is 링크 관련
-----------------------------------------------------------------------------------*/
.modal .btn_wrap.one {margin:0;padding:3.0rem 0 0;}
.contents.bg {background:#f2f2f2;}
.photo_container {display:flex;height:200px; justify-content:center;align-items:center;}
   
/* --------------------------------------------------------------------------------
	COMMONET : NAV : bottom
-----------------------------------------------------------------------------------*/
[data-content="nav-bottom"].bottomNav {position:fixed;left:0;bottom:0;padding:0 2.4rem;width:100%;height:5.2rem;line-height:5.2rem;color:#333;z-index:1000;}
[data-content="nav-bottom"].bottomNav {bottom:-52px;background:rgba(255, 255, 255, .9);border-top:1px solid #f0f0f0;transition:bottom .2s;}
[data-content="nav-bottom"].bottomNav.show {bottom:0;background:rgba(255, 255, 255, .9);}

[data-content="nav-bottom"].bottomNav > button {position:absolute;top:0;width:5.2rem;height:5.2rem;background-position:50%;background-size:2.4rem 2rem;background-repeat:no-repeat;opacity:.5;text-indent:-9999px;}
[data-content="nav-bottom"].bottomNav > .ico-prev {left:1.0rem;background-image:url(../images/common/icon-prev.png);}
[data-content="nav-bottom"].bottomNav > .ico-next {right:1.0rem;background-image:url(../images/common/icon-prev.png);transform:rotate(180deg);}
[data-content="nav-bottom"].bottomNav > .ico-home {left:50%;margin-left:-2.6rem;background-size:2.4rem 2.4rem;background-image:url(../images/common/icon-home.png);}