@charset "utf-8";
/* CSS Document */
body{background-color:#fff;}
#login-wrap{width:100%; height: inherit; display:flex; align-items: center; justify-content: center;}
#login-wrap > .inner-wrap{width:calc(100% - var(--gap-40)); max-width:600px;}
#login-wrap > .inner-wrap > h1{color:#000; font-weight: 500; text-align: center; font-size:var(--font-size-xxxxlarge); margin-bottom:var(--gap-40);}
#login-wrap > .inner-wrap > p.guide{color:var(--color-font); font-size:var(--font-size-normal); text-align: center; margin-bottom:var(--gap-100); line-height: 140%;}
.input-wrap{width:100%; background-color: #eff2f8; border-radius: 5px; display:flex; align-items: center; margin:5px 0; padding:0 15px;}
#login-wrap.join-wrap .input-wrap{margin-top:20px;}
#login-wrap .logo{min-width:100px; max-height:110px; margin:0 auto var(--gap-40) auto; display:block;}

.input-wrap > input{background-color: transparent; color:var(--color-font); width:100%; padding:10px 0; height: 65px;}
.input-wrap > input:focus{background-color: transparent;}
.input-wrap > input::placeholder{color:#838383;}
.input-wrap > input.add-btn{width:calc(100% - 120px);}

.input-wrap > svg{margin-right:15px;}
.loginBtn{width:100%; background-color: #fff; color:#000; border:1px solid #000; border-radius: 5px; padding:18px 20px; margin-top:25px; text-align: center;}
.loginBtn:hover{background-color:#000; color:#fff;}
.loginBtn.off{background-color:#A8B1BC;}
.link-wrap{width:100%; margin-top:10px; text-align: right; display:flex; justify-content: flex-end; align-items: center;}
.link-wrap > a{color:var(--color-font);}
.link-wrap > .hv{width:1px; height: 15px; background-color:var(--color-border); margin:0 15px;}

.classify-wrap.on{display:flex;}
.classify-wrap{margin-top:6.25rem;  flex-wrap: wrap; display:none;}
.classify-wrap > p{width:100%;}
.classify-wrap .input-wrap{width:calc(100% - 145px); margin-right:10px;}
.classify-wrap .input-wrap > input{width:calc(100% - 110px); }

.classify-wrap .input-wrap .hv{height: 15px; width:1px; background-color: var(--color-border); margin:0 15px;}
.classify-wrap .resendBtn{width:105px; height: 65px; background-color: #954fdd; color:#fff; border-radius: 5px; margin:5px 0;}
.classify-wrap .resendBtn.off{background-color:#A8B1BC; }

.marketing-wrap{margin-top:3.125rem;}
.marketing-wrap > p{font-size:1.125rem; color:#000; font-weight: 700;}
.marketing-wrap .select-wrap{display:flex; align-items: center; margin-top:15px;}
.marketing-wrap .select-wrap .radio-wrap{display:flex; align-items: center; margin-right:20px;}
.marketing-wrap .select-wrap .radio-wrap:last-child{margin:0;}
.marketing-wrap .select-wrap .radio-wrap > label{width:10px; height:10px; border-radius: 50%; background-color:#cbcacb; padding:4px; cursor: pointer; display:block; position:relative; margin-right:5px; user-select:none;-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
.marketing-wrap .select-wrap .radio-wrap > label > .checkCircle{width:10px; height: 10px; background-color: #3a3e56; opacity:0.3; border-radius: 50%;}
.marketing-wrap .select-wrap .radio-wrap > label > input{display:none;}
.marketing-wrap .select-wrap .radio-wrap > label > input[type="radio"]:checked + .checkCircle{opacity:1;}
.agreement-wrap{margin-top:20px;}
.agreement-wrap .title-box > h1 {word-break: keep-all;}
.agreement-wrap .title-box > h1 > span{font-size:var(--font-size-xlarge);}
.agreement-wrap > p{font-size:1.125rem; color:#000; font-weight: 700;}
.agreement-wrap .content-wrap{width:calc(100% - var(--gap-40)); padding:20px; height: 250px; margin-top:15px; overflow-y: scroll; background-color:#eff2f8; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ }
.agreement-wrap .content-wrap::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/}
.agreement-wrap .check-wrap{display:flex; align-content: center; margin-top:15px;}
.agreement-wrap .check-wrap > p{margin-left:10px; font-size:1rem;}

.verify-wrap{max-width:400px; width:calc(100% - var(--gap-40)); margin:var(--gap-140) auto;}
.verify-wrap .mobile-location{width:100%; padding:15px 20px; box-sizing: border-box;  align-items: center; border-bottom:1px solid #d6d6d6; display:none; position:fixed; top:0; left:0; background-color: #fff;}
.verify-wrap .mobile-location .arrow{width:10px;}
.verify-wrap .mobile-location > p{font-size:var(--font-size-normal); color:#000; text-align: center; width:calc(100% - 10px);}

.verify-wrap .title-box{margin-top:var(--gap-140);}
.verify-wrap .title-box > h1{font-size:var(--font-size-xxxxlarge); color:#000; font-weight: 600; text-align: center; line-height: 100%; margin-bottom:var(--gap-20);}
.verify-wrap .title-box > p{font-size:var(--font-size-normal); color:var(--color-font); text-align: center;}

.verify-wrap .emailSend-box{margin-top:var(--gap-80);}
.verify-wrap .verifyBtn{border:1px solid #d6d6d6; border-radius: 5px; font-size:var(--font-size-normal); color:var(--color-font); text-align: center; height:60px; width:100%; background-color: #fff;}

.verify-wrap .codeVerify-box{margin-top:var(--gap-80);}

.verify-wrap .btn-wrap{margin-top:var(--gap-80); display:flex; justify-content: space-between; width:100%; align-items: center;}
.verify-wrap .btn-wrap > a{width:calc(50% - 10px); border-radius: 5px; text-align: center; height: 50px; display:flex; align-items: center; justify-content: center; font-size:var(--font-size-normal); color:#fff;}
.backwardBtn{background-color:var(--color-primary)}
.forwardBtn{background-color:var(--color-dark)}

.agreement-wrap{max-width:550px; width:calc(100% - var(--gap-40)); margin:0 auto;}
.agreement-wrap .mobile-location{width:100%; padding:15px 20px; box-sizing: border-box;  align-items: center; border-bottom:1px solid #d6d6d6; display:none; position:fixed; top:0; left:0; background-color: #fff;}
.agreement-wrap .mobile-location .arrow{width:10px;}
.agreement-wrap .mobile-location > p{font-size:var(--font-size-normal); color:#000; text-align: center; width:calc(100% - 10px);}

.agreement-wrap .title-box{margin-top:var(--gap-140);}
.agreement-wrap .title-box > h1{font-size:var(--font-size-xxxxlarge); color:#000; font-weight: 600; text-align: center; line-height: 100%; margin-bottom:var(--gap-20);}
.agreement-wrap .title-box > p{font-size:var(--font-size-normal); color:var(--color-font); text-align: center;}

.agreement-wrap .agree-box{margin-top:var(--gap-80);}
.agreement-wrap .terms-actions{display:flex; align-items: center; justify-content: space-between;}
.agreement-wrap .terms-actions a{color:var(--color-font);}
.agreement-wrap .check-wrap p{color:var(--color-font);}
.agreement-wrap .text-box{width:100%; padding:20px; border-radius: 5px; margin-top:10px; height: 200px; background-color:#EFF2F8; color:var(--color-font); overflow-y: scroll; scrollbar-width: none; /* Firefox */ -ms-overflow-style: none;  /* IE and Edge */ box-sizing: border-box;}
.agreement-wrap .text-box::-webkit-scrollbar {display: none;  /* Chrome, Safari, Opera */}
.agreement-wrap .text-box h1, .agreement-wrap .text-box h2 {margin-bottom: 10px; font-size:var(--font-size-large);}
.agreement-wrap .text-box p {margin-bottom: 15px;}
.agreement-wrap .privacy-box{margin-top:var(--gap-80);}

.agreement-wrap .additional-box{margin-top:var(--gap-40);}
.agreement-wrap .additional-box .check-wrap{margin-bottom:10px;}
.agreement-wrap .hr{width:100%; height: 1px; background-color: #d6d6d6; margin:20px 0;}

.agreement-wrap .check-wrap{display:flex; align-content: center; margin-top:15px;}
.agreement-wrap .check-wrap > p{margin-left:10px; font-size:1rem;}

.agreement-wrap .btn-wrap{padding:var(--gap-80) 0; display:flex; justify-content: space-between; width:100%; align-items: center;}
.agreement-wrap .btn-wrap > a{width:calc(50% - 10px); border-radius: 5px; text-align: center; height: 50px; display:flex; align-items: center; justify-content: center; font-size:var(--font-size-normal); color:#fff;}

.join-wrap{padding-bottom:var(--gap-140); margin:0 auto; width:calc(100% - var(--gap-40)) !important; max-width:650px;}
.join-wrap .mobile-location{width:100%; padding:15px 20px; box-sizing: border-box;  align-items: center; border-bottom:1px solid #d6d6d6; display:none; position:fixed; top:0; left:0; background-color: #fff;}

.join-wrap .mobile-location .arrow{width:10px;}
.join-wrap .mobile-location > p{font-size:var(--font-size-normal); color:#000; text-align: center; width:calc(100% - 10px);}

.join-wrap .title-box{margin-top:var(--gap-140);}
.join-wrap .title-box > h1{font-size:var(--font-size-xxxxlarge); color:#000; font-weight: 600; text-align: center; line-height: 100%; margin-bottom:var(--gap-20);}
.join-wrap .title-box > h1 > span{font-size:var(--font-size-xlarge);}
.join-wrap .title-box > p{font-size:var(--font-size-normal); color:var(--color-font); margin-top:var(--gap-40); text-align: center;}
.join-wrap .title-box > p.warn{color:#FC7A7A;}

.join-wrap .btn-wrap{margin-top:var(--gap-80); display:flex; justify-content: space-between; width:100%; align-items: center;}
.join-wrap .btn-wrap > a{width:calc(50% - 10px); border-radius: 5px; text-align: center; height: 50px; display:flex; align-items: center; justify-content: center; font-size:var(--font-size-normal); color:#fff;}

.join-wrap > .inner-wrap{margin:var(--gap-80) 0 0 0 !important;}
.join-wrap > .inner-wrap .ref{font-size:var(--font-size-normal); color:var(--color-font); margin:10px 0 30px 0;}
.join-wrap > .inner-wrap > p.tlt{font-size:var(--font-size-large); font-weight: 600; margin-bottom:var(--gap-20);}
.join-wrap .list-nr{position:relative;}
span.redDot{display:none;}
span.redDot.on{width:5px; height: 5px; display:block; border-radius: 50%; background-color:#A80002; position:absolute; top:0; left:-20px;}
.join-wrap .nation-select{width:100%; height:65px; background-color:#eff2f8; color:#838383;}
.join-wrap .check-dup{background-color:#000; color:#fff; border-radius: 5px; display:flex; align-items: center; width:90px; justify-content: center; font-size:var(--font-size-small); height:45px;}
.join-wrap .part-p{margin:var(--gap-60) 0 var(--gap-20) 0;}

.result-wrap{padding:var(--gap-140) 0; min-height: calc(100vh - 100px); display:flex; align-items: center;}
.result-wrap img{margin:6.25rem auto 40px auto; display:block;}
.result-wrap .inner-wrap{width:calc(100% - var(--layout-flax-margin)); margin:0 auto; max-width:650px;}
.result-wrap .inner-wrap > h1{text-align: center; font-size:var(--font-size-xxxxlarge); margin-bottom:var(--gap-20); line-height: 120%;}
.result-wrap .inner-wrap > p{text-align: center; font-size:var(--font-size-normal); color:var(--color-font);}
.result-wrap .inner-wrap > p.en-message{color:#FC7A7A;}
.result-wrap .inner-wrap > .hr{width:100%; height: 1px; background-color:#d6d6d6; margin:var(--gap-40) 0;}
.result-wrap .btn-wrap{width:100%; margin-top:var(--gap-40); text-align: center;}
.result-wrap .btn-wrap > a{margin:0 3px; padding:var(--gap-10) var(--gap-20); color:#fff; background-color:#000; box-sizing: border-box; border-radius: 5px; border:none;}
.result-wrap .btn-wrap > a.loginBtn{background-color:var(--color-primary);}