@charset "utf-8";
/***모달에서 페이지로 변경 하면서 css 수정 있습니다***/
/**공통**/
/**동의**/
.join_agree_wrap {
    border: 1px solid #eee;
    padding: 10px;
}
.join_chk_all {
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
.join_arrow_box i {
    /* vertical-align: -2px; */
    /* color: #fff; */
}
.join_agree_wrap label {
    display: flex;
    align-items: center;
}
/* .join_chk_all .join_arrow_box {
    padding: 0px 0px 1px 3px; padding-top:1px; width:20px; height:20px; display: inline-block; line-height:20px; text-align: center; vertical-align: middle;
} */
/* .join_chk_all .join_arrow_box i {
	font-size:15px;
    font-weight: 600;
	padding:1px 0px 2px 3px;
} */
/* .join_chk_sub .join_arrow_box {
    padding: 0px 0px 1px 3px; padding-top:1px; width:20px; height:20px; display: inline-block; line-height:20px; text-align: center; vertical-align: middle;
} */
.join_chk_sub_box {
    margin-bottom: 5px;
}
.join_agree_wrap .join_arrow_box {
    width: 20px;
    height: 20px;;
    margin-right: 5px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #D3D3D3;
    display: flex;
    align-items: center;
    justify-content: center;
}
.join_chk_sub_box label span {
    color: #858585;
    font-size: 12px;
    font-weight: 350;
}
.join_chk_sub_box label span a {
    color: #858585;
    border-bottom: 1px solid #858585;
    font-size: 12px;
    font-weight: 350;
}
.join_chk_sub_box label span b {
    color: var(--main-color);
    font-weight: 400;
}
.join_chk_all label span:last-child {
    font-weight: 500;
    font-size: 12px;
	color: #373737;
}
.join_btn2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    padding-top: 30px;
}
.join_btn2 > div:first-child {
    background: #D3D3D3;
    border-radius: 3px;
    width: 100%;
    margin-right: 8px;
}
.join_btn2_next.on {
    background: #7E8F2D !important;
}
.join_btn2_next.on a {
    color: #fff;
}
.join_btn2 > div:last-child {
    border-radius: 3px;
    width: 100%;
    background: #D3D3D3;
}
.join_btn2 > div > a {
    padding: 10px 0;
    display: block;
    width: 100%;
}
.join_agree_wrap input:checked + label .join_arrow_box {
    background-color: var(--main-color);
    border-color: var(--main-color);
    color: #fff;
}
.join_radio_next {
    background-color: var(--main-color) !important;
}
.join_radio_next a {
    color: #fff !important;
}

/**공통 끝**/
.login-wrapper {padding-bottom: 120px;}
.login-wrapper .logo a {
    display: block;
    width: fit-content;
    margin: 50px auto;
}
.login-wrapper .flex_wrap {}
.join_bg {
    flex: 1 0 50%;
    background-image: url(../main_img/join_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.join_bg_txt {
    padding: 40px;
    color: #fff;
    word-break: keep-all;
}
.join_bg_txt h2 {
    font-weight: 600;
    font-size: 50px;
}
.join_bg_txt p {
    font-size: 28px;
    font-weight: 500;
    padding-top: 60px;
}
.join_form_wrap_right {
    flex: 1 0 50%;
    padding: 0 40px;
}
.join_form_title {
    border-bottom: 1px solid var(--border-color);
}
.join_form_title h3 {
    font-size: 28px;
    color: var(--main-color);
    font-weight: 600;
}
.join_form_title p {
    font-size: 18px;
    padding: 10px 0 30px;
}
.join_agree_wrap {
    border: 0;
    padding: 0;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid var(--border-color);
}


/**수정**/
.joinform_box_wd {
    margin-top: 20px;
}
.joinform_box_tt {
    font-weight: 500;
    margin-bottom: 10px;
}
.idform_box {
    display: flex;
    align-items: center;
    gap: 10px;
}
.confirm_num {
    flex: 1
}
.joinform_input {
    width: 100%;
    border: 1px solid #D3D3D3;
    height: 40px;
    border-radius: 3px;
    padding: 0 10px;
}
.check_btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-color: var(--main-color);
    height: 40px;
    padding: 0 10px;
    border-radius: 5px;
    cursor: pointer;
}
.joinform_box_form_top  .pwbox:first-of-type {
    margin-bottom: 10px;
}
.phone_box_wd .joinform_box_form_top.flex_wrap {
    gap: 10px;
}
.joinform_box_wd.phone_box_wd .joinform_box_form_bottom {
    margin-top: 10px;
    gap: 10px;
}
.phone_box_wd .phone_box2, .phone_code_input {flex: 1;}

#member_save_btn {
    margin: 30px 0 20px;
}
#member_save_btn button{
    width: 100%;
    background-color: var(--main-color);
    border-color: var(--main-color);
    padding: 10px 0;
    color: #fff;
}

p.login_back {
    text-align: center;
}
p.login_back a {
    color: var(--main-color);
}
p.login_back a:hover {
    text-decoration: underline;
}