@charset "utf-8";
/* ==================================================================================
    [style.css]
        - stylesheets of users page in users folder
================================================================================== */

/* ----------------------------------------------------------------------------------
    style : common
---------------------------------------------------------------------------------- */
/* userForm */
.userForm {

}
.userForm h3 {
    margin: 0 0 30px;
    text-align: center;
    font-weight: 700;
    color: #484848;
}

/* ----------------------------------------------------------------------------------
    style : login
---------------------------------------------------------------------------------- */
/* login-form */
.login-form {

}
.login-form h3 {
    margin: 0 0 30px;
    text-align: center;
    font-weight: 700;
    color: #484848;
}

/* form */
.login-area form {

}
.login-area form .control-group {
    margin: 0 0 20px;
}
.login-area form label {
    margin: 0 0 3px;
    color: #484848;
}
.login-area form input {
    height: 42px;
    padding: 0 12px;
    line-height: 42px;
    border: 2px solid #dfdfdf;
}

/* btn-login */
.btn-login {
    display: block;
    width: 100%;
    margin: 0 0 30px;
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    border: 1px solid #2690ea;
    border-radius: 2px;
    background-color: #2690ea;
}
.aik-none-user .btn-login {
    display: block;
    width: 100%;
    margin: 0 0 30px;
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    border: 1px solid #137c61;
    border-radius: 2px;
    background-color: #137c61;
}

/* login-more-info */
.login-more-info {
    text-align: center;
}
.login-more-info li {
    display: inline-block;
}
.login-more-info li.divline {
    margin: 0 20px;
    weight: 300;
    color: #767676;
}
.login-more-info li a {
    weight: 300;
    color: #767676;
}
.login-more-info li a:hover {
    color: #2690ea;
}
.login-more-info li a i {
    margin: 0 5px 0 0;
}

/* 로그인 추가 정보 */
.login-info {
    padding: 8px;
    font-size: 13px;
}
.login-info p {
    font-weight: bold;
    font-size: 14px;
    color: #333;
}
.login-info .paper-more-info > li {
    color: #333;
}
.login-info .paper-more-info > li > ul {

}
.login-info .paper-more-info > li > ul > li {
    font-weight: bold;
    font-size: 12px;
    letter-spacing: -0.25px;
    color: #11f;
}

/* ----------------------------------------------------------------------------------
    style : join
---------------------------------------------------------------------------------- */
.article .section .join-area {

}
.article .section .join-area .join-box {
    max-width: 100%;
    margin: 0 auto;
    padding: 30px;
    border: 1px solid #eee;
}
.article .section .join-area .join-box h3 {
    margin: 0 0 30px;
    padding: 0;
    font-size: 22px;
    font-weight: 900;
}
.article .section .join-area .join-box h4 {
    margin: 20px 0 10px;
    padding: 0;
    font-size: 17px;
    font-weight: 800;
    color: #125acd;
}

.article .section .join-area .join-box .popover {
    width: 360px;
	font-family: 'NanumSquareNeo', 'Roboto', 'Nanum Gothic', 'Malgun Gothic', Dotum, Gulim, sans-serif;
}
.article .section .join-area .join-box .popover h3 {
    margin: 0;
    padding: 10px;
    font-size: 14px;
    font-weight: 800;
    color: #000;
}
.article .section .join-area .join-box .popover .popover-content {
    font-size: 13px;
    font-weight: 400;
    color: #000;
}

/* ----------------------------------------------------------------------------------
    style : join - step1
---------------------------------------------------------------------------------- */
.article .section .join-box .policy-area {

}
.article .section .join-box .policy-area p {
    margin: 0 0 20px;
}
.article .section .join-box .policy-area ul {
    list-style: disc;
    margin: 0 0 20px 20px;
}
.article .section .join-box .policy-area ul li {
    margin: 0 0 10px;
}
.article .section .join-box .form-group .checkbox {
    font-size: 14px;
}
.article .section .join-box .email-area {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.article .section .join-box .email-area label {
    width: 70px;
}
.article .section .join-box .email-area input {
    width: 240px;
}

/* ----------------------------------------------------------------------------------
    style : join - step2
---------------------------------------------------------------------------------- */
.article .section .join-box .form-area {
    margin: 0 0 50px;
    padding: 0 0 30px;
    border-bottom: 1px solid #eee;
}
.article .section .join-box .form-area .form-group {

}
.article .section .join-box .form-area .form-group > label {
    margin: 0 0 7px;
    font-weight: 800;
}

/* radio-group */
.article .section .join-box .form-area .form-group .radio-group {
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px;
}
.article .section .join-box .form-area .form-group .radio-group.hidden-field {
    display: none;
}
.article .section .join-box .form-area .form-group .radio-group.type-inline {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px 20px;
}
.article .section .join-box .form-area .form-group .radio-group label {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px;

    margin: 0;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}
.article .section .join-box .form-area .form-group .radio-group input[type=radio] {
    margin: 3px 0 0;
}

/* radio-group */
.article .section .join-box .form-area .form-group .checkbox-group {
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px;
}
.article .section .join-box .form-area .form-group .checkbox-group.hidden-field {
    display: none;
}
.article .section .join-box .form-area .form-group .checkbox-group.type-inline {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px 20px;
}
.article .section .join-box .form-area .form-group .checkbox-group label {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 7px;

    margin: 0;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}
.article .section .join-box .form-area .form-group .checkbox-group input[type=checkbox] {
    margin: 3px 0 0;
}

#membershipNumberGroup {
    margin: 20px 0 0;
}
#membershipNumberGroup .alert {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;

    margin: 0;
}
#membershipNumberGroup .alert label {
    width: 180px;
    margin: 0;
}
#membershipNumberGroup .alert input {
    width: 240px;
}
#membershipNumberGroup .alert .input-group-btn {
    width: 84px;
}

/* ----------------------------------------------------------------------------------
    style : join - etc
---------------------------------------------------------------------------------- */
.password-progress {
    margin-top: 5px;
    margin-bottom: 0;
}