﻿input[type=submit]:hover,
input[type=submit]:hover {
    cursor: pointer;
}

/* 2023.03.10, 회원가입 UI 개선(HMI-856) */
.register_bx { width: 554px; height:694px; background-color: white; }
.register_wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.register_wrapper .register_01_v2 { padding: 24px; }
.register_header_v2 { margin-bottom: 23px; }
.register_stepguide_image_v2 { margin-bottom: 5px; }
.register_stepguide_text_wrapper_v2 { display: flex; justify-content: space-around; margin: 0 auto; width: 500px; }
.register_stepguide_text_v2 { font-size: 11px; }
.register_title_v2 { position: relative; margin-left: 7px; padding: 0; text-align: left; }
.register_title_v2 span { font-weight: 700; font-size: 16px; color: black; }
.register_contents_v2 { padding: 2px 30px; height: /* 420px */ /*439px*/ 485px; overflow-y: auto; }
.register_midtitle_v2 { margin-bottom: 24px; }
.register_midtitle_v2 span { font-weight: 700; font-size: 14px; color: black; }
.register_subtitle_v2 { margin-bottom: 5px; }
.register_subtitle_v2 span { font-weight: 700; font-size: 12px; color: black; }

/* 앞에 리스트 아이콘()이 있는 코멘트용 작은 글씨 */
.register_subtext_v2 { padding-left: 20px; }
.register_subtext_v2 span { font-weight: 400; font-size: 9px; color: black; position: relative; }
.register_subtext_v2 span::after { content: "•"; display: inline-block; margin-right: 5px; vertical-align: bottom; position: absolute; left: -15px; top: -4px; font-size: 12px; }
.register_contents_v2 .input_bx {
    height: 30px;
    color: #08599c;
    border: none;
    background: #cedfef;
    padding: 0 17px;
    width: 100%;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 400;
}

span.required_red_bef::before { content: "*"; color: red; margin-right: 1px; font-size: 12px; }
span.required_red_aft::after { content: "*"; color: red; margin-left: 1px; font-size: 12px; }

.register_contents_v2 .input_bx[disabled] { background-color: #e7e7e7; color: #919191; }
/* Chrome, Firefox, Opera, Safari 10.1+ */
.register_contents_v2 .input_bx::placeholder { font-weight: 400; font-size: 12px; color: #818181; opacity: 1; /* Firefox */ }
/* Internet Explorer 10-11 */
.register_contents_v2 .input_bx:-ms-input-placeholder { font-weight: 400; font-size: 12px; color: #818181 !important; }
/* Microsoft Edge */
.register_contents_v2 .input_bx::-ms-input-placeholder { font-weight: 400; font-size: 12px; color: #818181; }

.register_radios_v2 { display: flex; justify-content: flex-start; margin: 9px 6px; }
.register_radios_v2 > div { display: flex; align-items: center; width: 25%; word-break: break-all; }
.register_radios_v2 > div > input[type="radio"] { width: 20px; height: 20px; margin-right: 3px; accent-color: /* 라디오 버튼 색, 지원 브라우저 : Chrome/Edge 93+, Firefox 92+, and Safari 15.4+ */black;  }
.register_verification_container_v2 > div { display: none; }
.register_verification_container_v2 > div[selected] { display: block; }
.register_auth_result_label_v2 {
    min-width: 110px;
    width: 110px;
    margin-left: 9px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background-color: #e7e7e7;
    color: #919191;
    /* 텍스트 드래그(선택) 막기 */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/*.register_verification_container_v2 input[type="submit"] {*/ /* 버튼 */
.register_01_v2 input[type="submit"] {
    height: 30px;
    background-color: #3C87C6;
    border: none;
    color: white;
    padding: 0 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 110px;
    width: 110px;
    font-size: 12px;
    font-weight: 700;
}
/*.register_verification_container_v2 input[type="submit"]:hover*/
.register_01_v2 input[type="submit"]:hover { background-color: #2769a1; }

.register_btns_v2 {
    display: flex;
    justify-content: flex-end;
    margin-right: 24px;
}
.register_btns_v2 > input {
    height: 41px;
    font-size: 12px;
    padding: 0 51px;
    margin-right: 9px;
    color: white;
}

.register_btns_v2 > input:last-child { margin-right: 0; }
.register_btn_prev_v2 { background-color: #939494 !important; }
.register_btn_prev_v2:hover { background-color: #6b6b6b !important; }
.register_btn_close_v2 { background-color: #0862A6 !important; }
.register_btn_close_v2:hover { background-color: #0f416c !important; }
.register_btn_next_v2 { background-color: #0862A6 !important; }
.register_btn_next_v2[disabled] { background-color: #D6D3D6 !important; cursor: not-allowed; }
.register_btn_next_v2:not([disabled]):hover { background-color: #0f416c !important; }

.register_auth_wrapper_v2 { display: flex; }
.register_auth_wrapper_v2 .register_cert_v2 { position: relative; /* 타이머의 absolute position 을 위해... */ width: 100%; }
.register_auth_wrapper_v2 .timer { position: absolute; right: 10px; line-height: 30px; color: red; }
.register_auth_wrapper_v2 > *:not(:first-child) { margin-left: 9px; }

.register_input_with_button_wrapper_v2 { display: flex; justify-content: space-between; }
.register_input_with_button_wrapper_v2 > div > select { width: 141px !important; }
.register_input_with_button_wrapper_v2 > *:not(:first-child) { margin-left: 9px; }

/*.required.lang_us::after { content:"(Required)"; color: #0862A6; margin-left: 5px; }
.required.lang_kr::after { content:"(필수)"; color: #0862A6; margin-left: 5px; }
.optional.lang_us::after { content:"(Optional)"; color: #939494; margin-left: 5px; }
.optional.lang_kr::after { content:"(선택)"; color: #939494; margin-left: 5px; }*/

.required[lang=US]::after { content:"(Required)"; color: #0862A6; margin-left: 5px; }
.required[lang=KR]::after { content:"(필수)"; color: #0862A6; margin-left: 5px; }
.optional[lang=US]::after { content:"(Optional)"; color: #939494; margin-left: 5px; }
.optional[lang=KR]::after { content:"(선택)"; color: #939494; margin-left: 5px; }

input[type="checkbox"] { vertical-align: middle; -webkit-appearance: none; position: relative; width: 15.57px; height: 15.57px; outline: none !important; border: 2px solid #939494; border-radius: 2px; }
input[type="checkbox"]::before { /* 체크 아이콘 */ content: "\2713"; position: absolute; color: black; left: 0; right: 0; text-align: center; line-height: 1; transform: scale(0) translate(-50%, -50%); overflow: hidden; font-weight: 700; }
input[type="checkbox"]:checked { border-color: black; color: black; }
input[type="checkbox"]:checked::before { transform: scale(1) translate(0, 0); }


.mobile_gubun_line { display: none; }
.confirm_pass_match { padding: 5px 10px; border: 1px solid rgba(255, 0, 0, 0.5); border-radius: 5px; margin: 5px 0; background-color: rgba(255, 0, 0, 0.05);display: none; }
.confirm_pass_match.show { display: block; }
.confirm_pass_match > span { font-size: 9px; font-weight: 400; color: red; }

label { display: inline; vertical-align: middle; font-size: 11px; font-weight: 400; }
/* 콤보박스 펼침 화살표 아이콘 커스텀 */
select {
    -webkit-appearance: none; /* for chrome */
    -moz-appearance: none; /*for firefox*/
    appearance: none;
    padding-right: 40px !important;
    background: #ccdfef url("/image/arrow_down_navy.png") no-repeat calc(100% - 12px) 50%/12px !important;
}
select::-ms-expand {
    display: none; /*for IE10,11*/
    padding-right: 40px !important;
}
select[disabled] { background: #e7e7e7 !important; }

/* P2 - 카카오 수신 동의 팝업 */
.register_kakao_agree_pop_wrapper_v2 {
    z-index: 1000;
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    align-items: center;
    justify-content: center;
    left: 0;
    background-color: rgba(0,0,0, 0.3);
    flex-wrap: wrap;
    overflow-y: auto;
}
.register_kakao_agree_pop_wrapper_v2 > iframe { width: 400px; height: 347px; }

.email_wrapper {
    display: flex;
    justify-content: space-between;
}
.email_wrapper .input_bx.sel_domain {
    margin-left: 5px;
}

@media screen and (max-width: 480px) {
    .register_bx { display: block; height: 100%; width: 100%; }
    .register_wrapper form { width: 100%; }
    .register_wrapper .register_bx { display: block; height: 100%; }
    .register_wrapper .register_01 { height: 100%; overflow-y: auto; }
    .register_stepguide_image_v2 { width: 80%; }
    .register_stepguide_text_wrapper_v2 { width: 100%; }
    .register_contents_v2 { height: initial; padding: 2px 10px; }
    .register_radios_v2 { flex-direction: column; margin: 10px 0; padding: 10px; border: 1px dashed #3c87c6; border-radius: 5px; }
    .register_radios_v2 > div { margin: 5px 0; width: 100%; }
    .register_input_with_button_wrapper_v2 { flex-direction: column; }
    .register_input_with_button_wrapper_v2 > input[type="submit"] { margin-left: 0; min-width: 100%; margin-bottom: 5px; }
    .register_input_with_button_wrapper_v2 > .register_auth_result_label_v2 { margin-left: 0; min-width: 100%; margin-bottom: 5px; }

    .register_contents_v2 .input_bx,
    .register_01_v2 input[type="submit"],
    .register_auth_result_label_v2 { height: 40px; line-height: 40px; }
    .register_auth_wrapper_v2 .timer { line-height: 40px; }

    /* iOS 때문에 margin-bottom 100px 줌*/
    .register_btns_v2 { margin-right: 0; margin-bottom: 100px; }
    .register_btns_v2 > input[type=submit]:first-child { width: calc(50% - 9px/2); min-width: unset; }
    .register_btns_v2 > input[type=submit]:last-child { width: calc(50% - 9px/2); min-width: unset; }


    .register_input_with_button_wrapper_v2 > div > select { width: 100px !important; }

    .register_input_with_button_wrapper_v2 > *:not(:first-child) { margin-left: 0; }

    .mobile_width_100per { width: 100% !important; }
    .mobile_gubun_line { display: block; border-bottom: 2px dashed #e7e7e7; margin: 15px auto; }

    .register_kakao_agree_pop_wrapper_v2 > iframe { width: 100%; padding: 20px; overflow-y: auto; }

    .email_wrapper { flex-direction: column; }
    .email_wrapper .input_bx.sel_domain {
        margin-left: 0;
        width: 100% !important;
    }
}