@charset "UTF-8";

/* vietnamese */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Regular'), local('Asap-Regular'), url(https://fonts.gstatic.com/s/asap/v9/KFOoCniXp96ayzQe4HRO.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Regular'), local('Asap-Regular'), url(https://fonts.gstatic.com/s/asap/v9/KFOoCniXp96ayzUe4HRO.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Regular'), local('Asap-Regular'), url(https://fonts.gstatic.com/s/asap/v9/KFOoCniXp96ayzse4A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Asap Condensed';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Condensed Regular'), local('AsapCondensed-Regular'), url(https://fonts.gstatic.com/s/asapcondensed/v3/pxidypY1o9NHyXh3WvSbGSggdOeDaEx8qw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Asap Condensed';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Condensed Regular'), local('AsapCondensed-Regular'), url(https://fonts.gstatic.com/s/asapcondensed/v3/pxidypY1o9NHyXh3WvSbGSggdOeCaEx8qw.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Asap Condensed';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Asap Condensed Regular'), local('AsapCondensed-Regular'), url(https://fonts.gstatic.com/s/asapcondensed/v3/pxidypY1o9NHyXh3WvSbGSggdOeMaEw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDr4fIA9c.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDrcfIA9c.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDrAfIA9c.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDrwfIA9c.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDr0fIA9c.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: local('Comfortaa'), url(https://fonts.gstatic.com/s/comfortaa/v22/1Pt_g8LJRfWJmhDAuUsSQamb1W0lwk4S4WjMDrMfIA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-400.woff") format('woff');
    src: url("./fonts/asap-latin-400.woff2") format('woff2');
	font-weight:400;
}
@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-400italic.woff") format('woff');
    src: url("./fonts/asap-latin-400italic.woff2") format('woff2');
	font-weight:400;
	font-style:italic
}
@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-500.woff") format('woff');
    src: url("./fonts/asap-latin-500.woff2") format('woff2');
	font-weight:500;
}
@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-500italic.woff") format('woff');
    src: url("./fonts/asap-latin-500italic.woff2") format('woff2');
	font-weight:500;
	font-style:italic
}

@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-600.woff") format('woff');
    src: url("./fonts/asap-latin-600.woff2") format('woff2');
	font-weight:500;
}
@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-600italic.woff") format('woff');
    src: url("./fonts/asap-latin-600italic.woff2") format('woff2');
	font-weight:500;
	font-style:italic
}

@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-700.woff") format('woff');
    src: url("./fonts/asap-latin-700.woff2") format('woff2');
	font-weight:500;
}
@font-face {
    font-family: "Asap";
	font-display: swap;
    src: url("./fonts/asap-latin-700italic.woff") format('woff');
    src: url("./fonts/asap-latin-700italic.woff2") format('woff2');
	font-weight:500;
	font-style:italic
}



*{padding:0;margin:0;box-sizing:border-box;list-style:none !important;font-size:inherit;list-style:inherit;outline:none;font-family: 'Noto Sans KR', sans-serif;line-height:inherit;color:inherit;}
h3 , h4 , h5 {font-family: 'Noto Sans KR', sans-serif;font-weight:500;}
html{font-size:16px;color:#333;background:#1798c0;width:100%;display:block;height:100%;position:relative;overflow-x:hidden;}
body{display:flex;flex-direction:column;overflow-x:hidden;height:100%;width:100%;}

input:focus , select:focus , select:active , a:focus{outline:none;}
a{text-decoration:none;position:relative;cursor:pointer;}
a:hover{text-decoration:underline;}
a:active{color:#0d2077;}
table { border-collapse:collapse; border-spacing: 0; table-layout:fixed; }
table caption{position:relative;text-indent:-9999px;overflow:hidden;width:0;height:0;}
.selecth{-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;width:300px;height:50px;border:1px solid #c0c0c0;border-radius:5px;line-height:50px;font-size:16px;padding:0 10px;background:#fff url('../img/landing/bg_select.svg') no-repeat 95% 40%;}
select::-ms-expand{display:none;}

/*button*/

button{cursor:pointer;background:none;border:none;outline:none;}
button:disabled{opacity:0.5;cursor:default}

.header{top:-60px;height:120px;width:100%;display:flex;z-index:999;max-width:1200px;margin:0 auto;justify-content:space-between;align-items:center;padding:15px 0;}
.container{position:relative;clear:both;width:100%;height:100%;}

.curved_toped1{position:relative;height:100%;padding-top:50px;}
.curved_toped1:before{content: '';width:100%;background:#eafffb;/*border-top-left-radius: 100% 10px;*/ height: 100%;display: inline-block;left: 0;top: 0;position: absolute;}
.curved_toped1:after{content: '';/*width:calc(53% + 30px);*/background:#fff;/*border-top-right-radius: 100% 150px;*/ height:100%;display:inline-block;right:-30px;top:0;position:absolute;}

#Verify{position:relative;height:100%;}
#Verify .HL{z-index:1;}
#Verify .curved_toped1:after{background:#fff;}
#Verify p{font-size:14px;line-height:16px;text-align:center;color:#333;margin-top:25px;position:relative;z-index:1}
#Verify p strong{font-weight:600;}

.Rlogin{display:flex;justify-content:space-between;width:1200px;margin:0 auto;position:relative;}
.Rlogin .login{width:390px; margin: 0 auto;}
.Rlogin .login > p{margin:20px 0;}
.Rlogin .f-copy{width:500px;display:block;margin:0;position:relative;z-index:1;}

.Rlogin .copy{font-size:14px;line-height:20px;margin-top:15px;display:inline-block;margin-left:25px;width:450px;}


.Rlogin .inputArea{position:relative;clear:both;padding-top:10px;}
.Rlogin .inputArea .top-con{text-align:center;margin-bottom:15px;}
.Rlogin .inputArea .top-con a{color:#1798c0}
.Rlogin .inputArea .top-con button{height:auto;background:none;width:auto;color:#333;padding:0;margin:0;color:#1798c0}
.Rlogin .inputArea p{position:relative;text-align:left;}

.Rlogin .wrong-noti{overflow:hidden;}
.Rlogin .wrong-noti span{text-align:left;margin-bottom:10px;font-size:14px;color:#fff;background:#db4f5f;padding:5px 10px;border-radius:5px;display:none;}
.Rlogin .wrong-noti span.on{display:inline-block;float:left;clear:both;}
.Rlogin .pw-noti {margin-bottom:10px;font-size:14px;color:#fff;background:#db4f5f;padding:5px 10px;border-radius:5px;}
.Rlogin .pw-noti.hide{display:none;}
.Rlogin .pw-noti.pd{margin-bottom:0;margin-top:10px;}
.Rlogin  input.wrong{border-color:#d93900 !important;background:#fff8f6 !important}
.Rlogin .inputArea input[type="email"] , .Rlogin .inputArea input[type="password"] , .Rlogin .inputArea input[type="text"]{position:relative;border:1px solid #c0c0c0;border-radius:5px;background:#fff;font-size:16px;color:#333;line-height:20px;padding:14px 10px;width:100%;margin-bottom:10px;}
.Rlogin .inputArea input[type="password"]{padding-right:65px;}

.Rlogin .inputArea input[type="checkbox"]{appearance:none;-webkit-appearance:none;display:inline-block;width:16px;height:16px;border:1px solid #c0c0c0;background:#fff;border-radius:3px;-moz-appearance:none;}
.Rlogin .inputArea input[type="checkbox"]:checked{width:16px;height:16px;background:#1798c0 url('../img/landing/icon-check.png') no-repeat center center; background-size:10px auto;border-radius:3px;line-height:20px;}
.Rlogin .inputArea input[type="checkbox"] + label{font-size:16px;line-height:20px;vertical-align:text-bottom;cursor:pointer;}
.Rlogin .inputArea button{background:#54b9b5;text-align:center;font-size:16px;line-height:20px;padding:15px 0;border-radius:5px;color:#fff;width:100%;margin-top:20px;}

.Rlogin .bottom{position:relative;clear:both;text-align:center;margin-top:10px;padding-top:10px;}
.Rlogin .bottom p .btn{background:#54b9b5;text-align:center;font-size:16px;line-height:20px;padding:15px 0;border-radius:5px;color:#fff;width:100%;margin-left:0;}
.Rlogin .bottom p .btn:hover{background:#87cecb !important;text-decoration:none;}
.Rlogin .bottom p{font-size:14px;line-height:16px;color:#333;text-align:center; padding-bottom:10%;}
.Rlogin .bottom p:first-child{padding-bottom:10px;border-bottom:1px solid #c0c0c0;margin-bottom:10px;}
.Rlogin .bottom p:first-child .txt1{color:#1798c0;font-weight:300;}
.Rlogin .bottom a{font-weight:700;color:#1798c0}
.Rlogin .bottom a:hover{background:none !important;text-decoration:underline;}

.inputArea input[type="text"] + label , .inputArea input[type="password"] + label{position:absolute;right:20px;font-size:16px;color:#1798c0;top:15px;cursor:pointer}


.HL{text-align:center;width:1200px;margin:0 auto; margin-bottom:1%; font-weight:300;font-size:40px;line-height:45px;clear:both;color:#333;position:relative;}
.HL.ct{text-align:center;width:400px;}
.msg_img{text-align:center;margin:60px 0 0;}
.msg_img img{width:200px;margin-left:-80px;}

.block-area{display:block;text-align:center;position:relative;z-index:1;width:370px;margin:20px auto 0;}
.block-area input{height:50px;border-radius:5px;border:1px solid #c0c0c0;padding:0 10px;}
.block-area button{background:#54b9b5;text-align:center;font-size:16px;line-height:20px;padding:15px;border-radius:5px;color:#fff;margin-top:20px;}
.error_msg{color:#fff;font-size:16px;line-height:19px;padding:3px 20px;background:#db4f5f;font-style:italic;display:inline-block;border-radius:5px;margin-top:10px}
.error_msg.gr{background:#86d579}

#customBtn_login{position:relative;text-align:left;padding-left:60px;}
#customBtn_login span{width:40px;height:40px;display:flex;justify-content:center;align-items:center;background:#fff;border-radius:5px;position:absolute;left:5px;top:5px;}

.login .txt{text-align:center;padding:10px 0 0;position:relative;}
.login .txt span{font-size:16px;line-height:20px;color:#333;display:inline-block;background:#fff;position:relative;z-index:10;padding:0 10px;}
.login .txt:after{content:'';width:100%;height:1px;background:#c0c0c0;position:absolute;left:0;top:20px}

.login .btnArea{position:relative;clear:both;}
.login .btnArea button{display:block;text-align:center;color:#fff;font-size:16px;line-height:20px;padding:15px 0;background:#5286ec;border-radius:5px;margin-top:10px;width:100%}

#customName.active:focus{background:#ffcc03}

.twist{width:1000px;margin:0 auto;}
.twist .txt{font-size:14px;line-height:16px;margin-top:10px;margin-bottom:10px;max-width:420px;}
.s-pw{position:relative;}
.password-condition{position:relative;display:block;overflow:hidden;margin-bottom:20px;}
.password-condition span{display:inline-block;width:40%;text-align:left;float:left;padding-left:20px;margin-bottom:10px;position:relative;}
.password-condition span:first-child{display:inline-block;width:60%;text-align:left;float:left;padding-left:20px;margin-bottom:10px;position:relative;}
.password-condition span:before{position:absolute;content:'';width:10px;height:10px;border-radius:100%;background:#ccc;display:inline-block;left:5px;top:5px;}
.password-condition span.on:before{background:#54b9b5}

/* layer popup */
.layerPop{position:fixed;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:9999;overflow-y:auto;background:rgba(0,0,0,0.5)}
.popup_in{position:relative;width:480px;background:#f8f8f8;z-index:99;padding:40px 20px;border-radius:10px;}
.layerPop.vd-container .popup_in{width:1200px;height:640px;padding:10px}
.layerPop .vd-con{position:relative;clear:both;height:100%;}
.layerPop .close{position:absolute;right:20px;top:20px;}
.layerPop .close1{position:absolute;right:30px;top:30px;z-index:100;}

.layerPop .layer-center{text-align:center;}
.layerPop .layer-center h3{text-align:center;font-size:24px;color:#333;font-weight:500; font-family:'Noto Sans KR', cursive;}
.layerPop .layer-center > p{padding:20px 0;color:#333;font-size:16px;line-height:20px;line-height:24px;}
.layerPop .layer-center p.txt_small{padding:5px 0 55px;color:#828282;font-size:16px;line-height:18px;}
.layerPop .layer-center .line-break{display:block;}

.layerPop .pwBtn{position:relative;clear:both;width:280px;margin:0 auto;}
.layerPop .pwBtn input{position:relative;border:1px solid #c0c0c0;border-radius:5px;background:#fff;font-size:16px;color:#828282;line-height:20px;padding:14px 10px;width:100%;margin-bottom:10px}
.layerPop .pwBtn label[for="userName"] , .layerPop .pwBtn label[for="userName_info"]{display:inline-block;width:280px;text-align:left;margin-bottom:5px;font-size:16px;color:#000;line-height:18px;}
.layerPop .pwBtn button{clear:both;width:280px;background:#54b9b5;text-align:center;font-size:16px;line-height:20px;padding:15px 0;border-radius:5px;color:#fff;}


.closeBtn{display:inline-block;width:40px;height:40px;border-radius:100%;background:#54b9b5;box-shadow:0 14px 26px 0 rgba(50,59,81,0.1);position:relative;text-indent:-9999px;}
.closeBtn:hover{background:#54b9b5;}
.closeBtn:before{position:absolute;content:'';height:26px;width:4px;border-radius:5px;background:#fff;left:18px;top:7px;transform:rotate(-45deg)}
.closeBtn:after{position:absolute;content:'';height:26px;width:4px;border-radius:5px;background:#fff;left:18px;top:7px;transform:rotate(45deg)}

.loader{position:fixed;left:0;top:0;background:rgba(0,0,0,0.7);width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:10000}
.loaderCon{position:relative;width:250px;height:250px;border-width:12px;border-style:solid;border-color:#1798c0 transparent rgba(56,103,212,0.8) transparent;border-radius:100%;animation:spin 1s infinite;animation-timing-function:linear;}
.loaderTxt{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-size:25px;color:#fff;font-weight:600;line-height:35px;animation:opa 1.5s infinite;animation-timing-function:linear;}


/* ������� */
.MAB20 {
	margin-bottom: 20px;
}
.join_tit {
	text-align: center;
	font-size: 16px;
	color: #2c75a8

}
.join_agreement{overflow-y:auto;height:100px;/* height:190px; */padding:10px 10px 10px 0;border:1px solid #d8d8d8;background-color:white; border-radius:5px;}
.join_agreement .personal_wrap{padding-bottom:10px;font-size: 12px;line-height: 16px;}
.join_agreement .personal_wrap h2{margin:15px 0 20px 0;font-size:14px;font-weight: bold;color:#2c75a8;text-align: center;}
.join_agreement .personal_wrap h3{margin:25px 0 5px 10px;font-weight:bold;color:#787878;}
.join_agreement .personal_wrap p,
.join_agreement .personal_wrap ol,
.join_agreement .personal_wrap ul,
.join_agreement .personal_wrap dl{margin-left:15px;line-height:18px}
.join_agreement .personal_wrap dl dd {color:#231F20}
.join_check{padding:7px 0 7px 0;margin: 0 0 0 10px; text-align:center; font-size:0.9rem;}
.join_check input{vertical-align: middle;} 
/* ������� */

@keyframes spin {
	from {transform:rotate(0deg)}
	to{transform:rotate(360deg)}
	
}

@media only screen and (max-width:1200px){
	.header{padding:30px 0 30px 15px;}
	.layerPop.vd-container .popup_in{width:calc(100% - 20px);height:calc(100vw * 0.5325)}
	.Rlogin , .HL , .HL.ct{width:calc(100% - 30px);z-index:1;}
}

@media only screen and (max-width:950px){
	.Rlogin .f-copy{display:none;}
	.curved_toped1:before{display:none;}
	.curved_toped1:after{width:calc(100% + 30px);/*border-top-right-radius: 100% 200px;*/background:#eafffb;right:-30px; height:700px}
}

@media only screen and (max-width:580px){
	#Verify .HL{font-size:24px;line-height:30px;padding-top:50px}
	.popup_cookie{display:none;}
}

@media only screen and (max-width:500px){
	.popup_in{width:calc(100% - 30px)

}

@media only screen and (max-width:380px){
	.password-condition span:first-child{width:100%;}
}