@charset "utf-8";

.bodyBg {overflow-x:hidden;}
.bodyBg::after {content:''; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:100; }

/*로그인*/
.loginWrap { max-width:700px; margin:0 auto; border:1px solid #ddd; }
.loginWrap .cont1 { max-width:600px; padding:50px; margin:0 auto; overflow:hidden; }
.loginWrap .cont1 input { font-size:18px; width:100%; border:0px; border-bottom:1px solid #ddd; line-height:60px; height:60px; margin-bottom:30px;  }
.loginWrap .cont1 input[type="submit"] {border-bottom:0; background:#142543; color:#fff; font-weight:600; margin-bottom:20px; opacity:1; }
.loginWrap .cont1 input[type="submit"].on {opacity:1;}
.loginWrap .cont1 .floatL a { position:relative; display:inline-block; font-size:16px;}
.loginWrap .cont1 .floatL a:first-child {padding-right:20px; }
.loginWrap .cont1 .floatL a:first-child::before { content:''; position:absolute; right:7px; top:20%; height:60%; width:1px; background:#aaa;}
.loginWrap .cont1 .floatR {font-weight:600; color:#111; }
.loginWrap .cont1 .sns {clear:both; padding-top:50px;}
.loginWrap .cont1 .sns a {display:block; float:left; width:100%; text-align:center; background:#1ec800; color:#fff; font-size:16px; font-weight:600; }
.loginWrap .cont1 .sns #naverIdLogin img {height:52px;}
.loginWrap .cont1 .sns a:nth-child(1) {float:right; background:#fae102; color:#000; }
.loginWrap .cont1 .sns a span { position:relative; display:inline-block; padding:13px 0 13px 45px; text-align:left; }
.loginWrap .cont1 .sns a span::before {content:''; position:absolute; left:0; top:50%; width:40px; height:40px; margin-top:-20px; background:url('/Main/Images/new/ko/contents/login_sns.jpg') no-repeat 0 0/200% auto; }
.loginWrap .cont1 .sns a:nth-child(1) span::before { background-position:100% 0; }
.loginWrap .cont2 {padding:20px 30px; background:#f4f4f4; }
.loginWrap .cont2 li { font-size:15px; }
@media all and (max-width:560px){
  .loginWrap .cont1 {padding:30px;}
  .loginWrap .cont1 .sns a {width:100%;}
  .loginWrap .cont1 .sns a:nth-child(1) {margin-top:10px;}
}

/*회원가입*/
.memberWrap { max-width:700px; margin:0 auto; }
.memberWrap .step {overflow:hidden; margin-bottom:30px; }
.memberWrap .step li { position:relative; float:left; width:25%; text-align:center; font-size:15px;}
.memberWrap .step li::before {content:''; position:absolute; top:25px; left:-50%; width:100%; height:1px; background:#eee; z-index:-1; }
.memberWrap .step li:nth-child(1)::before {display:none;}
.memberWrap .step li span { display:block; width:50px; height:50px; line-height:50px; background:#eee; color:#999; text-align:center; margin:0 auto 10px; font-size:19px; font-weight:600; border-radius:50%; }
.memberWrap .step li.on {font-weight:600; color:#111;}
.memberWrap .step li.on span { background:#142543; color:#fff; }
.memberWrap > div { border:1px solid #ddd;}
.memberWrap > div > div { max-width:600px; padding:50px; margin:0 auto; overflow:hidden; }
.memberWrap .memberOk { display:block; background:#142543; color:#fff; font-weight:600; line-height:60px; height:60px; width:100%; border:0; text-align:center; margin-top:50px; opacity:1; font-size:18px; }
.memberWrap .memberOk.on {opacity:1;}
@media all and (max-width:480px){
  .memberWrap > div > div {padding:30px;}
}

/*이용약관*/
.memberWrap .agree p { position:relative; padding:15px 0; }
.memberWrap .agree input[type="checkbox"] { width:25px; height:25px; border:1px solid #999; border-radius:2px; margin:0 10px 0 0; }
.memberWrap .agree p span {color:#142543; }
.memberWrap .agree p a { display:block; position:absolute; right:0; top:14px; font-size:14px; background:#eee; padding:5px 15px; border-radius:20px; font-weight:500;}
.memberWrap .view { display:none; position:fixed; left:50%; top:50%; width:80%; height:80%; max-width:1000px; background:#fff; border-radius:10px; transform:translate(-50%, -50%); z-index:110; }
.memberWrap .view > h4 {position:absolute; left:20px; top:10px; font-size:22px; padding:0; }
.memberWrap .view > h4::before, .memberWrap .view > h4::after {display:none;}
.memberWrap .view > a.closeBtn { display:block; position:absolute; right:10px; top:10px; text-indent:-9999px; width:30px; height:30px; }
.memberWrap .view > a.closeBtn::before,
.memberWrap .view > a.closeBtn::after {content:''; position:absolute; left:50%; top:0; width:1px; height:100%; background:#333; transform:rotate(45deg);}
.memberWrap .view > a.closeBtn::after { transform:rotate(-45deg); }
.memberWrap .view > div { position:absolute; left:0; bottom:0; width:100%; height:calc(100% - 60px); overflow-y:auto; font-size:15px; padding:20px;}
.memberWrap .allCheck { border-top:1px solid #ddd; margin-top:20px; padding-top:20px; }
.memberWrap .allCheck label { font-weight:600; color:#111; }

/*본인인증*/
.memberWrap .check {color:#333;}
.memberWrap .check a.phoneCheck {display:block; background:#4d4d4d; color:#fff; font-weight:600; line-height:60px; height:60px; text-align:center; margin:30px 0 10px;}
.memberWrap .check #B_WRITER {font-size:18px; width:100%; border:0px; border-bottom:1px solid #ddd; line-height:60px; height:60px;}

/*정보입력*/
.memberWrap .form .input { position:relative; border-bottom:1px solid #ddd; margin-bottom:30px;}
.memberWrap .form .input input,
.memberWrap .form .input select {border:0; width:100%; line-height:60px; height:60px; font-size:18px;}
.memberWrap .form .input input[readonly] {background:none; color:#333;}
.memberWrap .form .input select {color:#333;}
.memberWrap .form .input.phone {overflow:hidden; text-align:center;}
.memberWrap .form .input.phone input,
.memberWrap .form .input.phone select {float:left; width:30%;}
.memberWrap .form .input.phone .dash {display:block; float:left; width:5%; line-height:60px; height:60px;}
.memberWrap .form .input.birth {text-align:right;}
.memberWrap .form .input.birth input {width:22%;}
.memberWrap .form .input.birth input:first-child {width:41%;}
.memberWrap .form .input.pass,
.memberWrap .form .input.address {border-bottom:0;}
.memberWrap .form .input.pass input,
.memberWrap .form .input.pass select,
.memberWrap .form .input.address input,
.memberWrap .form .input.address select { border-bottom:1px solid #ddd; color:#333; /* background:rgba(0,64,152,0.05);*/ background:#f8f8f8;}
.memberWrap .form .input.email input {width:47.5%; }
.memberWrap .form .input .explain { display:none; position:absolute; left:5px; bottom:0; font-size:12px; }
.memberWrap .form .input.on .explain {display:block;}
.memberWrap .form .input .checkBtn {position:absolute; right:0; top:8px; font-size:15px; background:#004098; color:#fff; padding:10px; }
@media all and (max-width:480px){
  .memberWrap .form .input .explain {bottom:-20px;}
}


.id_result {color:#222; font-size:20px; line-height:68px; text-align:center; background:#f4f4f4; border:1px solid #ddd;}
.id_result p {padding:22px 0; color:#000; font-size:20px; line-height:28px; font-weight:600;}
.bg_white {background:#fff !important;}