@charset "utf-8";

/* 인트로 */
.intro{display:flex; justify-content:center; align-items:center; width:100%; height:100vh; background-color:var(--c-01);}
/* .intro img{height:60rem;} */

/* 로그인 */
#content.login{padding-top: 93rem;padding-bottom: 0;height: 100vh;}
.login-cover{background-color: var(--c-01);border-radius: 20rem 20rem 0 0;padding-top: 40rem;height: 75vh;}
.login-head img{display:inline-block;height: 116rem;}
.login-head{height: 25vh; display: flex; justify-content:center;}
.login-btn button{font-size: 15rem;text-align:center;border-radius: 5rem;background-color: rgba(255,255,255,.27);box-shadow: 2px 14px 24px 0px rgba(249, 155, 53, 0.90);}
.login-btn button + button{margin-top:6rem;}
.login-input input + input{margin-top:7rem;}
.login-btn{margin-top:6rem;}
.login-sns__tit{display:block; display:flex; justify-content:center; align-items:center; position:relative; width:100%; text-align:center;}
.login-sns__tit i{position:relative;padding:0rem 10rem;/* background:var(--f); */font-size:13rem;color: var(--f);}
/* .login-sns__tit::before{content:""; position:absolute; left:0; width:100%; height:1px; background:var(--g);} */
.login-find button{position: relative;color: #fff;font-weight: 300;}
.login-find button::before{content: ""; width: 1px; height: 12rem; background-color: rgba(255,255,255,.3); position: absolute; left: -10rem; top: 3rem;}
.login-find li:nth-child(1) button::before{display: none;}
.login-find{margin-top: 18rem;gap: 20rem;}
.login-sns{margin-top: 83rem;}
.login-sns__list{margin-top:17rem;gap: 13rem;}
.login-sns__list button{overflow:hidden; border-radius:8rem;}
.btn-ment-wrap{margin-top:45rem;}
.btn-ment *{margin-left:6rem;}
.btn-ment i{border-bottom:1px solid;}
.login-sns__list button img{width: 46rem;border-radius: 100%;}
.login-sns__list .bd button{border:1px solid #e7e7e7;border-radius: 100%;}

.login-input input:is([type="text"],
.login-input [type="password"]){background-color: transparent;border-color: rgba(255,255,255,.43);color: #fff;border: 1px solid rgba(255,255,255,.43);}
.login-input input::placeholder{color:#fff !important}

/* 회원가입 */
#content.join{padding-top: 100rem;}
.join-tit{font-size:22rem; color:var(--b-01);}
.join-tit strong{font-weight:600;}
.join-tit p{margin-top:10rem; font-size:14rem; color:#757575;}
.join-check{margin-top:30rem;}
.join-check__list{display:flex; margin-top:20rem; padding-top:20rem; border-top:1px solid #ededed; flex-direction:column; gap:22rem;}
.join-check__list li{display:flex; justify-content:space-between; align-items:center;}
.join-check__list li a{font-weight:400; font-size:12rem; color:#b3b3b3; white-space:nowrap; word-spacing:revert-layer;}
.join-check input[type="checkbox"] + label{font-weight:400; color:var(--b-01);}
.join-check__option{width:100%; padding:18rem 20rem; border-radius:5rem; gap:20rem;}
.join-check__option input[type="checkbox"] + label{font-weight:300; font-size:13rem; color:#a3a3a3;}
.join-check__option input[type="checkbox"]:checked + label{font-weight:400; color:var(--b-01);}
.join-check #chk-all + label{font-weight:600;}
.join-check input[type="checkbox"] + label strong:not(data-color){color:#a7a7a7;}
.join-check input[type="checkbox"] + label strong{margin-right:2rem;}
.input-box input + *{margin-top:8rem;}
.input-box__time span{position:absolute; right:20rem; margin-top:0; font-weight:600;}
.input-box__time{display:flex; align-items:center; position:relative;}
.btn-ment{color:#a5a5a5;}
.btn-ment i{color:var(--b-01);}

/* 회원가입 약관보기 */
.join-pop .content-header{border-bottom:1px solid #f1f1f1;}
.join-popup{padding:20rem; background:#f5f5f5; border-radius:10rem;}
.join-popup-tit{display:block; margin-bottom:9rem; color:var(--b-01);}
.join-tit + .input-box{margin-top:20rem;}

/* 완료화면 */
.content-done{display:flex; justify-content:center; align-items:center; padding-top:100rem; flex-direction:column;}
.content-done > strong{margin-top: 17rem;font-weight: 700;font-size: 19rem;color:var(--b-01);text-align:center;line-height: 1.3;}
.content-done__box{width:100%;margin-top: 16rem;padding:19rem 20rem;background:#f7f7f7;text-align:center;border-radius:5rem;}
.content-done__box i{display:block; margin-top:3rem; font-weight:300; font-size:12rem;}
.content-done__box strong{font-size:15rem;}
.content-done img{height:90rem;}
.content-done:has(.content-done__box){padding-top:50rem;}
.content-done__svg{display:flex; justify-content:center; align-items:center; width:70rem; height:70rem; background:var(--c-01); border-radius:100%;}
.content-done svg{height: 18rem;}