@charset "utf-8";
/* CSS Document */
.current-wrap{display:flex; justify-content: space-between; align-items: center; width:100%; max-width:330px; margin:30px auto 0 auto;}
.current-wrap > .circle-wrap{border:1px solid #d6d6d6; text-align: center; width:39px; height: 39px; line-height: 39px; border-radius: 50%;}
.current-wrap > .circle-wrap.on{color:#fff; background-color: #445CB4;}
#login-wrap{width:100%;}
#login-wrap > .inner-wrap{margin:8.75rem auto; width:calc(100% - 60px); max-width:600px;}
#login-wrap > .inner-wrap > h1{color:#000; font-weight: 900; text-align: center;}
#login-wrap > .inner-wrap > p.guide{color:#858585; font-size:1.125rem; text-align: center; margin-bottom:6.25rem;}
.input-wrap{width:calc(100% - 30px); 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;}
.input-wrap > input{background-color: transparent; color:#858585; width:calc(100% - 44px); padding:10px 0; height: 65px;}
.input-wrap > input:focus{background-color: transparent;}
.input-wrap > svg{margin-right:15px;}
.loginBtn{width:100%; background-color: #445CB4; color:#fff; border-radius: 5px; padding:18px 20px; margin-top:25px;}
.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:#858585;}
.link-wrap > .hv{width:1px; height: 15px; background-color:#d6d6d6; 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: #d6d6d6; margin:0 15px;}
.classify-wrap .resendBtn{width:105px; height: 65px; background-color: #445CB4; 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: #445CB4; 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 > p{font-size:1.125rem; color:#000; font-weight: 700;}
.agreement-wrap .content-wrap{width:calc(100% - 40px); padding:20px; height: 250px; margin-top:15px; overflow-y: scroll; background-color:#eff2f8; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ font-family: 'Noto Sans KR', sans-serif; }
.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;}

#recommendList{position:absolute; width:100%; top:65px; border:1px solid #d6d6d6; background-color:#fff; display:none; left:0;}
#recommendList > div{padding:10px 20px; border-bottom:1px solid #d6d6d6; cursor: pointer;}
#recommendList > div:last-child{border:none;}
#recommendList > div:hover{background-color:#E6E7EC;}

span.redDot{display:none;}

#login-wrap.result-wrap img{margin:6.25rem auto; display:block; width:100%; max-width:515px;}
#login-wrap.result-wrap .btn-wrap{width:100%; margin-bottom:6.25rem; text-align: center;}
#login-wrap.result-wrap .btn-wrap > a{margin:0 3px;}

.button-wrap{width:100%; max-width:415px; margin:3.125rem auto; display: flex; justify-content:space-between; align-items: center;}
.button-wrap > .nextBtn{width: 200px; height: 50px; display: flex; align-items: center; justify-content: center; border-radius: 25px; color: #fff; font-size: 16px; background-color: #445CB4; margin-left:15px;}

/* 회원가입 4단계: 2단계에서 인증한 번호를 채워 두고 수정하지 못하게 한다 */
.input-wrap > input.input-mobilephone[readonly]{color:#333;}
.joinAuthDone{flex:0 0 auto; font-size:14px; color:#2E7D32; font-weight:700; margin-left:8px; white-space:nowrap;}
