.join-tab-wrap { padding-top:40px; padding-bottom:40px; border-bottom:1px solid #E5E5E5; }
    .join-tab-wrap h2 { text-align:center; font-size:20px; color:#000; margin:0; margin-bottom:26px; }

.agreement-wrap { margin-bottom:30px; }
    .agreement-wrap h3 { font-size:18px; color:#000000; position:relative; }
        .agreement-wrap h3 .image-checkbox { position:absolute; right:0; top:0; font-weight:normal; font-size:16px; }
        .agreement-wrap h3 .image-checkbox span { font-weight:normal; font-size:16px; }

    .agreement-wrap .terms-wrap { position: relative; overflow: auto; box-sizing: border-box; height: 180px; margin-top: 11px; padding: 8px 10px; border: 1px solid #f0f0f0; background: #f7f7f7; }
        .agreement-wrap .terms-wrap h4 { font-size:18px; font-weight:bold; margin-bottom:10px; margin-top:20px; }
        .agreement-wrap .terms-wrap h4:first-child { margin-top:0; }
        .agreement-wrap .terms-wrap ul {}
        .agreement-wrap .terms-wrap ul li {}
        .agreement-wrap .terms-wrap ol {}
        .agreement-wrap .terms-wrap ol li { margin-bottom:10px; }
        .agreement-wrap .terms-wrap ol li > strong { margin-bottom:5px; }
        .agreement-wrap .terms-wrap ol li small { display:inline-block; margin-left:10px; }
        .agreement-wrap .terms-wrap ol li ul { list-style:disc; padding-left:20px; }
        .agreement-wrap .terms-wrap ol li ul li { margin-bottom:5px; }
        .agreement-wrap .terms-wrap ol li ul li ul { list-style:none; padding-left:0; }

        .agreement-wrap .terms-wrap table {}

.join-welcome-wrap { background:url(/img/admin/img_welcome_drawing.png) no-repeat center; background-size:contain; width:100%; height:243px; margin-top:52px; margin-bottom:52px; }

/* LOGIN WRAP */
.login-wrap { border-radius: 30px; width:600px; min-height:490px; background:#fff; padding-top:52px; padding-bottom:52px; display:flex; justify-content: center; margin-top:40px; margin-bottom:120px; }
    .login-wrap.center { align-items: center; }

    .login-wrap .login-social-wrap { margin-bottom:60px; }

    .login-wrap h1 { 
        font-weight: 700;
        font-size: 24px;
        line-height: 32px;
        text-align: center;
        letter-spacing: -2px;
    }

    .login-wrap h1 span.title {
        display:block;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 5px;
        color: #936DFE;
        margin-bottom:4px;
    }

    .login-wrap h3 { line-height:32px; }
    .login-wrap h4 { margin-top:10px; }

.login-wrap.leave-ok-mode {
    min-height:300px;
}

.login-wrap.leave-ok-mode .leave-ok-wrap {
    text-align:center;
}

.login-wrap.leave-ok-mode .leave-ok-wrap p {
    text-align:left;

    padding:0 20px;
    padding-top:20px;
}

.login-wrap.leave-ok-mode .leave-ok-wrap p a {
    text-decoration:underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

.login-wrap.leave-ok-mode .leave-ok-wrap .button-wrap {
    border-top:1px solid #eee;
    margin-top:40px;
    padding-top:40px;
}
    
.login-form { width:510px; margin:0 auto; }
    .login-form .alert { text-align:center; margin-top: 24px; }
    .login-form .login-form-heading { text-align:left; font-weight: 700; font-size: 28px; line-height: 24px; letter-spacing: -2px; border-bottom:3px solid #000; padding-bottom: 28px; margin-bottom:36px; }

    .login-form .login-form-heading span { display:block; }
    .login-form .login-form-heading p {
        margin-top:16px;
        font-size: 13px;
        line-height: 20px;
        letter-spacing: -0.02em;
        color: #B3B3B3;
    }

    .login-form > h3 { font-size:18px; }
    .login-form > h4 { font-size: 16px; font-weight: 300; }
    .login-form .form-group { margin-bottom:15px; }
    .login-form .form-group:last-child { margin-bottom:0; }

    .login-form .form-group#contact-check-group input[type=text] {
        pointer-events: none;
        background-color: #eee;
    }
    .login-form .form-group#contact-check-group .input-group-btn {
        display:none;
    }

    .login-form .form-group#contact-check-group.start-input input[type=text]:not(.disabled) {
        pointer-events: all;
        background-color: #fff;
    }
    .login-form .form-group#contact-check-group.start-input .input-group-btn {
        display:table-cell;
    }

    .login-form .checkbox label { font-weight:700; }

    .login-form .buttons { max-width:280px; margin:0 auto; }
    .login-form .buttons .btn { font-size: 15px; line-height: 48px; text-align: center; letter-spacing: -2px; }
    .login-form .buttons .btn + .btn { margin-top:10px; }
    .login-form .buttons .btn-login-kakao { background-color:#FEE500; color:#191919; }
    .login-form .buttons .btn-login-kakao:before { content:''; width:18px; height:16px; display:inline-block; background:url(/img/layout/icon_kakao.svg) no-repeat center / contain; vertical-align: middle; margin-right:30px; margin-top:-3px; }

    .login-form .buttons .btn-login-naver { background-color:#03C75A; color:#fff; }
    .login-form .buttons .btn-login-naver:before { content:''; width:12px; height:12px; display:inline-block; background:url(/img/layout/icon_naver.svg) no-repeat center / contain; vertical-align: middle; margin-right:34px; margin-top:-3px; }

    .login-form .login-form-footer {
        position:relative;
        margin-top:20px;
        margin-bottom: 20px;
        margin-left:100px;
        font-weight: 700;
        letter-spacing: -0.02em;
    }

    .login-form .login-form-footer .right {
        position:absolute;
        right:0;
        top:0;

    }

    .login-form .submit-wrap {
        position:relative;
        border-top:0.5px solid #000;
        margin-top:35px;
        padding-top:35px;
        text-align:center;
        font-size:0;
        line-height:0;
        display:flex;
        justify-content: space-between;
    }

    .login-form .submit-wrap.center {
        justify-content: center;
    }
    
    /* .login-form .submit-wrap .btn + .btn {
        margin-left:28px;
    } */

    .login-form .submit-wrap .right {
        position:absolute; right:0; top:60px;
    }

    .login-form .submit-wrap .right a {
        font-size:14px;
        line-height: 14px;
        font-weight: 700;
        letter-spacing: -0.02em;
    }

    .login-form .join-wrap { padding-top:5px; max-width:280px; margin:0 auto; }
    .login-form .join-wrap.flex-mode { display:flex; justify-content: space-between; }
    .login-form .join-wrap.flex-mode .left { text-align:left; }
    .login-form .join-wrap.flex-mode .right { text-align:right; }

        .login-form .join-wrap a { 
            font-weight: 700;
            font-size: 15px;
            line-height: 32px;
            letter-spacing: -2px;

            color: #B3B3B3;
        }

    .login-form .form-join-additional .form-group:not(:last-child) {
        margin-bottom: 30px;
    }

/* PASSWORD WRAP */
@media (max-width: 991px) {  
    .login-wrap { width:auto; padding-top:20px; margin-left:20px; margin-right:20px; }

    .login-form { width:100%; padding-left:15px; padding-right:15px; }
    .login-form > h3 { font-size:16px; margin-top:20px; }
    .login-form > h4 { font-size:14px; }
    .login-form .join-wrap h3 { font-size:14px; }
    .login-form .login-form-heading { 
        font-size: 24px;
        line-height: 24px;
        letter-spacing: -2px;
        padding-bottom:14px;
        margin-top:38px;
        margin-bottom:12px;
    }
    .login-form fieldset { margin-top:40px; }

    .login-form .form-group {
        margin-bottom: 40px;
    }

    .input-group .input-group-addon { 
        color:#000; 
        font-weight: 700;
        font-size: 15px;
        line-height: 28px;
    }
    .login-form .input-group { display:block; }
    .login-form .input-group .form-control { float:none; margin-top:10px; }

    .login-form .login-form-heading p {
        font-size: 12px;
        line-height: 18px;
    }

    .login-form .login-form-footer { margin-left:0; margin-bottom:0; }


    .login-form .login-form-footer .image-checkbox.lg .form-check-input + span {
        padding-left: 26px;
    }

    .login-form .login-form-footer .image-checkbox.md .form-check-input + span {
        font-size: 13px;
        line-height: 28px;
        padding-left: 26px;
    }

    .login-form .submit-wrap.mobile-left {
        justify-content: flex-start;
    }

    .login-form .submit-wrap.mobile-left .btn {
        min-width:160px;
    }

    .login-form .submit-wrap .btn.hide-mobile + .btn {
        margin-left:0px;
    }
    
    .join-tab-wrap { padding-top:12px; padding-bottom:20px; border-top:1px solid #ddd; }
    .join-tab-wrap h2 { font-size:16px; margin-bottom:10px; }

    .select-group .radio-group .btn { font-size:14px; height:60px; line-height:60px; }

    .agreement-wrap h3 { font-size:14px; }
    .agreement-wrap h3 .image-checkbox span { font-size:14px; }
    
}