body { background-color:#f9f6f1; }
.join { background-image:url('/images/W/common/common_bg2.png'); background-position:top center; background-repeat:no-repeat; background-size:100% auto; padding:135px 0; }
.join .join-container { margin:0 auto; width:1100px; padding:70px 80px; background:#ffffff; border-radius:10px; }
.join .join-container .join-logo { margin-bottom:10px; text-align:center; }
.join .join-container h1 { font-size:40px;  font-weight:700; letter-spacing:-1px; color:#222222; }
.join .join-container p { font-size:20px; font-weight:400; letter-spacing:-1px; color:#222222; line-height:25px; border-bottom:2px solid #222222; margin-bottom:10px; padding-bottom:10px; }
.join .cert-wrap{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 45px;
}
.join .cert-wrap button.join-btn-green{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20%;
    height: 180px;
    margin-top: 0;
}
.join .cert-wrap button.join-btn-gray{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20%;
    height: 180px;
    margin-top: 0;
}
.join .join-input-row { margin-top:20px; display:flex; }
.join .join-input-row.cert-cont {
    width: 80%;
    flex-wrap: wrap;
    margin-top: 0;
 }

.join .join-input-row.cert-cont .join-input-container:nth-child(n + 3){
   margin-top: 20px;
 }
.join .join-input-row .join-input-container { margin-left:20px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#222222; }
.join .join-input-row .join-input-container:first-child ,.join .join-input-row.cert-cont .join-input-container:nth-child(3) { margin-left:0; }
.join .join-input-row .join-input-container input { width:340px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:r00; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-row .join-input-container input:focus { border:3px solid #00c973; }
.join .join-input-row .join-input-container .readonly { 
    width:356px; 
    height:80px; 
    font-size:22px;
    line-height:80px;
    color:#222222;
    background-color:
    #e2e2e2;
    font-weight:r00;
    border:1px solid #b5b5b5; 
    border-radius:5px; 
    padding:0 20px;
    letter-spacing:-1px;
    margin-top:0;
}
.join .join-input-row .join-input-container .readonly:focus { border:1px solid #b5b5b5; }
.join .join-input-row .join-input-container select { width:340px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:r00; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-row .join-input-container select:focus { border:3px solid #00c973; }

.join .join-input-column { margin-top:20px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#222222; }
.join .join-input-column small { font-size:15px; font-weight:400; letter-spacing:-1px; color:#00c973; }
.join .join-input-column .join-warning { font-size:15px; font-weight:400; letter-spacing:-1px; color:red; margin-top:10px; opacity:0; }
.join .join-input-column .join-input-button { display:flex; }
.join .join-input-column .join-input-button input { width:480px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:400; border:1px solid #b5b5b5; border-right:0; border-top-left-radius:5px;  border-bottom-left-radius:5px;border-top-right-radius:0px;  border-bottom-right-radius:0px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-column .join-input-button input:focus { border:3px solid #00c973; border-right:0; }
.join .join-input-column .join-input-button input.join-input-dark { border:1px solid #222222; border-right:0; }
/* .join .join-input-column .join-input-button button { width:160px; height:80px; background-color:#3c3c3c; font-size:22px; line-height:80px; color:#ffffff; font-weight:700; border:0; border-top-right-radius:5px;  border-bottom-right-radius:5px; margin-top:10px; letter-spacing:-1px; } */
.join button { width:160px; height:80px; background-color:#3c3c3c; font-size:22px; line-height:80px; color:#ffffff; font-weight:700; border:0; border-radius:5px; margin-top:10px; letter-spacing:-1px; }
.join .join-btn-green { background-color:#00c973; }
.join .join-btn-gray { background-color:#414449; }

.join .join-input-divide { width:100%; height:1px; background-color:#979797; margin:45px 0 25px 0; }
.join .join-input-column .join-input-row2 { display:flex; }
.join .join-input-column .join-input-row2 .join-input-container { margin-left:20px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#222222; }
.join .join-input-column .join-input-row2 .join-input-container:first-child { margin-left:0; }

.join .join-input-column .join-input-row2 .join-input-container input { width:280px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:400; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-column .join-input-row2 .join-input-container input:focus { border:3px solid #00c973; }
.join .join-input-column .join-input-row2 .join-input-container select { width:280px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:400; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-column .join-input-row2.join-input-container select:focus { border:3px solid #00c973; }
.join .join-input-column .join-input-row2 .join-input-container span { line-height:90px; }
.join .join-input-column input { width:480px; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:400; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:10px; }
.join .join-input-column input:focus { border:3px solid #00c973; }



.join .join-textarea { padding-top:10px; text-align:center; }
.join .join-textarea .join-number { width:30px; height:30px; border-radius:50%; background:#00c973; line-height:30px; font-size:18px; font-weight:400; letter-spacing:-1px; color:#ffffff; margin:20px auto 0; }
.join .join-textarea .join-title { font-size:30px; line-height:35px; font-weight:500; letter-spacing:-1px; color:#222222; margin:10px auto 0; }
.join .join-textarea .join-subtitle { font-size:22px; line-height:27px; font-weight:400; letter-spacing:-1px; color:#4c4c4c; margin:10px auto 0; }
.join .join-textarea textarea { font-size:22px; line-height:80px; color:#222222; font-weight:400; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; margin-top:20px; resize:none; width:100%; height:100px; }
.join .join-textarea textarea:focus { border:3px solid #00c973; }

.join .join-addinfo { padding-top:10px; display:flex; }
.join .join-addinfo .join-addinfo-detail {  }
.join .join-addinfo .join-addinfo-detail .join-checkbox { display:flex; align-items:center; width:390px; height:86px; border-radius:5px; border:1px solid #b5b5b5; text-align:center; margin-top:10px; }
.join .join-addinfo .join-addinfo-detail .join-checkbox input[type="checkbox"] { width:30px; height:30px; margin-left:20px; }
.join .join-addinfo .join-addinfo-detail .join-checkbox span { margin-left:10px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#4c4c4c; }
.join .join-addinfo .join-addinfo-detail .join-checkbox a { margin-left:auto; margin-right:20px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#4c4c4c; }
.join .join-addinfo .join-addinfo-detail .join-checkbox input[type="radio"] { width:30px; height:30px; margin-left:20px; }
.join .join-addinfo .join-addinfo-line { padding-top:20px; margin:0 30px; width:1px; background-color:#979797; }

.join .join-addinfo .join-addinfo-detail .join-addinfo-title { font-size:22px; font-weight:400; letter-spacing:-1px; color:#4c4c4c; margin-top:10px; }
.join .join-addinfo .join-addinfo-detail .join-addinfo-row { display:flex; }
.join .join-addinfo .join-addinfo-detail .join-addinfo-row  .join-checkbox { display:flex; align-items:center; width:auto; height:auto; border-radius:0; border:0; }

.join .join-all-agree { margin-top:20px; text-align:right; }
.join .join-all-agree .join-checkbox { display:flex; justify-content:flex-end; }
.join .join-all-agree .join-checkbox span { margin-left:10px; font-size:22px; font-weight:400; letter-spacing:-1px; color:#4c4c4c; }
.join .join-all-agree input[type="checkbox"] { width:30px; height:30px; margin-left:20px; }
.join button.join-submit { margin:35px auto 0; width:450px; height:86px; border-radius:43px; background-color:#00c973; font-size:30px; line-height:86px; color:#ffffff; font-weight:500; border:none; letter-spacing:-1px; display:block; }

.join_complete { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.6); z-index: 10; }
.join_complete .join_complete_container { position:absolute; top:50%; left:50%; width:500px; height:700px; transform:translate(-50%, -50%); background-image:url('/images/W/member/join_complete.png'); background-position:top center; background-repeat:no-repeat; }
.join_complete .join_complete_container .join_complete_close { display:block; position:absolute; top:0; right:0; width:80px; height:80px; text-indent:-999999px; }
.join_complete .join_complete_container .join_complete_go { display:block; position:absolute; top: 589px; left: 80px; width: 340px; height: 70px; text-indent:-999999px;  }




/*
.join .join-container .join-input { margin-top:10px; }
.join .join-container .join-input input { width:100%; height:80px; font-size:22px; line-height:80px; color:#222222; font-weight:300; border:1px solid #b5b5b5; border-radius:5px; padding:0 20px; letter-spacing:-1px; }
.join .join-container .join-input input:focus { border:3px solid #00c973; }
.join .join-container .join-autojoin { margin-top:10px; text-align:left; }
.join .join-container .join-autojoin input[type="checkbox"] { width:30px; height:30px; }
.join .join-container .join-autojoin label { display:flex; font-size:20px; color:#222222; font-weight:400; letter-spacing:-1px; }
.join .join-container .join-autojoin label span { margin-left:10px; }
.join .join-container button { margin-top:35px; width:100%; height:86px; border-radius:43px; background-color:#00c973; font-size:30px; line-height:86px; color:#ffffff; font-weight:500; border:none; letter-spacing:-1px; }
.join .join-container .join-btns { display:flex; justify-content:space-between; margin:10px auto 0; width:85%; }
.join .join-container .join-btns a { font-size:20px; color:#222222; font-weight:300; letter-spacing:-1px; }
.join .join-container .join-btns span { color:#b5b5b5; }
.join .join-container .join-sns { margin-top:25px; }
.join .join-container .join-sns a { display:block; margin-top:10px; width:100%; height:86px; border-radius:43px; font-size:30px; line-height:86px; color:#222222; font-weight:300; letter-spacing:-1px; border:1px solid #b5b5b5; text-align:left; padding-left:120px; background-position:70px 30px; background-repeat:no-repeat; }
.join .join-container .join-sns a.azoomma { background-image:url('/images/W/common/favicon_azoomma.png'); }
.join .join-container .join-sns a.womantable { background-image:url('/images/W/common/favicon_womantable.png'); }
.join .join-container .join-sns a.naver { background-image:url('/images/W/common/favicon_naver.png'); }
.join .join-container .join-sns a.kakao { background-image:url('/images/W/common/favicon_kakao.png'); }
.join .join-container .join-sns a.facebook { background-image:url('/images/W/common/favicon_facebook.png'); }


.brand .wrap-container  { display:flex; background-color:#f9f6f1; }
.brand .brand-msg { margin-left:90px; }
.brand .brand-msg .brand-pre { font-size:33px; line-height:39px; color:#222222; font-weight:400; padding-top:250px; }
.brand .brand-msg h1 { font-size:60px; line-height:70px; color:#222222; font-weight:700; margin-top:30px; }
.brand .brand-msg p { font-size:30px; line-height:40px; color:#222222; font-weight:400; margin-top:50px ; letter-spacing:-1px; }
.brand a { display:inline-block; width:360px; height:90px; font-size:30px; line-height:90px; font-weight:500; letter-spacing:-3px; color:#ffffff; margin-top:30px; background-color:#00c973; text-align:center; }
.brand .brand-icon { margin-top:175px; margin-left:60px; }
*/