@charset "utf-8";

body.ws-login-open {overflow:hidden}
.ws-login-modal[hidden] {display:none !important}
.ws-login-modal {position:fixed;inset:0;z-index:100500;display:flex;align-items:center;justify-content:center;padding:20px}
.ws-login-modal__backdrop {position:absolute;inset:0;background:rgba(22,34,27,.66);backdrop-filter:blur(4px)}
.ws-login-modal__dialog {position:relative;width:min(100%,430px);max-height:calc(100vh - 40px);overflow-y:auto;padding:42px 40px 36px;border:1px solid var(--ws-line,#dce5de);border-radius:20px;background:var(--ws-surface,#fff);color:var(--ws-ink,#1f2a24);box-shadow:0 28px 80px rgba(20,42,30,.25)}
.ws-login-modal__dialog:focus {outline:0}
.ws-login-modal__close {position:absolute;top:14px;right:14px;width:38px;height:38px;border:0;border-radius:50%;background:transparent;color:#66756c;font-size:18px}
.ws-login-modal__close:hover,.ws-login-modal__close:focus {background:#eef4ef;color:var(--ws-green-deep,#234334)}
.ws-login-modal__brand {display:flex;justify-content:center;align-items:baseline;gap:5px;margin-bottom:24px;font-family:Georgia,"Times New Roman",serif;font-size:25px}
.ws-login-modal__brand strong {font-weight:600}
.ws-login-modal__brand em {color:var(--ws-green,#365f4a);font-style:italic}
.ws-login-modal__eyebrow {margin:0 0 7px;color:var(--ws-gold,#b78a4a);font-size:11px;font-weight:700;letter-spacing:2px;text-align:center}
.ws-login-modal h2 {margin:0;font-size:27px;line-height:1.3;text-align:center}
.ws-login-modal__intro {margin:9px 0 26px;color:#718078;font-size:14px;line-height:1.6;text-align:center}
.ws-login-modal form>label {display:block;margin:15px 0 7px;font-size:13px;font-weight:700}
.ws-login-modal form>input[type="text"],.ws-login-modal form>input[type="password"] {display:block;width:100%;height:50px;padding:0 15px;border:1px solid var(--ws-line,#dce5de);border-radius:8px;background:#fff;color:var(--ws-ink,#1f2a24);font-size:15px;box-shadow:none}
.ws-login-modal form>input:focus {border-color:var(--ws-green,#365f4a);outline:3px solid rgba(54,95,74,.12)}
.ws-login-modal__options {display:flex;align-items:center;justify-content:space-between;gap:15px;margin:16px 0 22px;color:#65736b;font-size:12px}
.ws-login-modal__options a {color:var(--ws-green,#365f4a);text-decoration:none}
.ws-login-modal__auto {display:flex;align-items:center;gap:7px;cursor:pointer}
.ws-login-modal__auto input {width:16px;height:16px;accent-color:var(--ws-green,#365f4a)}
.ws-login-modal__submit {width:100%;height:51px;border:0;border-radius:8px;background:var(--ws-green,#365f4a);color:#fff;font-size:15px;font-weight:700}
.ws-login-modal__submit:hover,.ws-login-modal__submit:focus {background:var(--ws-green-deep,#234334)}
.ws-login-modal__join {display:flex;align-items:center;justify-content:center;gap:10px;margin-top:23px;padding-top:22px;border-top:1px solid var(--ws-line,#dce5de);color:#718078;font-size:13px}
.ws-login-modal__join a {color:var(--ws-green,#365f4a);font-weight:700;text-decoration:none}

#ws_mobile_login {position:absolute;top:12px;right:58px;z-index:3;display:flex;align-items:center;justify-content:center;gap:4px;height:40px;padding:0 9px;border:1px solid var(--ws-green,#365f4a);border-radius:4px;background:#fff;color:var(--ws-green,#365f4a);font-size:12px;font-weight:700;line-height:38px}
#ws_mobile_login i {font-size:14px}
#user_btn.ws-user-with-login {right:12px}

/* 로그인 전용 페이지와 회원가입: 그누보드 처리 로직은 유지하고 화면만 테마에 맞춘다. */
.mbskin,.register {color:var(--ws-ink,#1f2a24)}
#mb_login.mbskin {max-width:500px;margin:45px auto 70px;padding:0 18px}
#mb_login .mbskin_box {overflow:hidden;border:1px solid var(--ws-line,#dce5de);border-radius:18px;background:var(--ws-surface,#fff);box-shadow:0 18px 50px rgba(35,67,52,.08)}
#mb_login .mb_log_cate {display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--ws-line,#dce5de)}
#mb_login .mb_log_cate h2,#mb_login .mb_log_cate .join {width:auto;float:none;padding:19px;text-align:center}
#mb_login .mb_log_cate h2 {color:var(--ws-green-deep,#234334)}
#mb_login .mb_log_cate .join {background:#fbf8f0;color:var(--ws-green,#365f4a)}
#mb_login #login_fs {padding:34px}
#mb_login #login_fs .frm_input {width:100%;height:50px;margin:0 0 12px;padding:0 14px;border:1px solid var(--ws-line,#dce5de);border-radius:8px}
#mb_login #login_fs .frm_input:focus {border-color:var(--ws-green,#365f4a);outline:3px solid rgba(54,95,74,.12)}
#mb_login #login_fs .btn_submit {width:100%;height:50px;margin:2px 0 16px;border-radius:8px;background:var(--ws-green,#365f4a);font-weight:700}
#mb_login #login_password_lost,#mb_login .login_if_lpl a {color:var(--ws-green,#365f4a)}
#mb_login #login_frm {padding:24px 20px;background:var(--ws-surface,#fff)}
#mb_login #login_frm .frm_input {width:100%;height:50px;margin:0 0 11px;padding:0 14px;border:1px solid var(--ws-line,#dce5de);border-radius:8px;background:#fff}
#mb_login #login_frm .frm_input:focus {border-color:var(--ws-green,#365f4a);outline:3px solid rgba(54,95,74,.12)}
#mb_login #login_frm .btn_submit {height:50px;border-radius:8px;background:var(--ws-green,#365f4a)}
#mb_login .mb_login_join {padding:0 20px 22px;background:var(--ws-surface,#fff)}
#mb_login .mb_login_join a {color:var(--ws-green,#365f4a)}

body .register {width:min(calc(100% - 32px),860px);margin:36px auto 70px;padding:0}
.register:before {display:block;margin-bottom:8px;color:var(--ws-gold,#b78a4a);font-size:11px;font-weight:700;letter-spacing:2px;content:"WELL STORY ME";text-align:center}
.register:after {display:block;clear:both;content:""}
.register>form>p {height:auto!important;margin:0 0 22px!important;padding:18px 20px!important;border:1px solid var(--ws-line,#dce5de);border-radius:10px;background:#eef4ef!important;color:var(--ws-green-deep,#234334)!important;line-height:1.6!important;text-align:center}
.register>form>p:before {display:none!important}
.register #fregister_term,.register #fregister_private,.register .register_form_inner,.register .form_01:not(#register_form) {margin:0 0 18px;padding:26px;border:1px solid var(--ws-line,#dce5de);border-radius:14px;background:var(--ws-surface,#fff);box-shadow:0 10px 28px rgba(35,67,52,.05)}
.register section h2,.register .register_form_inner h2,.register .form_01>h2 {margin:0 0 18px;padding:0 0 13px;border-bottom:1px solid var(--ws-line,#dce5de);color:var(--ws-green-deep,#234334);font-size:18px}
.register #fregister_term textarea {width:100%;height:190px;padding:16px;border:1px solid var(--ws-line,#dce5de);border-radius:8px;background:#fafbf9;color:#59665e;line-height:1.7;resize:vertical}
.register #fregister_private>div {padding:0;overflow-x:auto}
.register #fregister_private table {width:100%;border-collapse:collapse}
.register #fregister_private th,.register #fregister_private td {padding:12px;border:1px solid var(--ws-line,#dce5de);line-height:1.55;text-align:left}
.register #fregister_private th {background:#eef4ef;color:var(--ws-green-deep,#234334)}
.register .fregister_agree {position:static;display:flex;justify-content:flex-end;align-items:center;min-height:42px;margin-top:12px;padding:0;border:0}
.register #fregister_chkall {height:auto;margin:18px 0;padding:18px 20px;border:1px solid var(--ws-green,#365f4a);border-radius:10px;background:#eef4ef;line-height:1.5;text-align:center}
.register .register_form_inner>ul,.register .form_01>ul {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 18px;margin:0;padding:0;list-style:none}
.register .register_form_inner>ul>li,.register .form_01>ul>li {width:auto!important;margin:0!important;float:none!important;min-width:0}
.register .register_form_inner>ul>li:not(.half_input),.register .form_01>ul>li:not(.half_input) {grid-column:1/-1}
.register label:not(.chk_box label) {display:block;margin:0 0 7px;color:#405047;font-size:13px;font-weight:700;line-height:1.45}
.register .frm_input,.register select {width:100%;height:48px;padding:0 13px;border:1px solid var(--ws-line,#dce5de);border-radius:7px;background:#fff;color:var(--ws-ink,#1f2a24);box-shadow:none}
.register textarea.frm_input {height:120px;padding:13px}
.register .frm_input:focus,.register select:focus {border-color:var(--ws-green,#365f4a);outline:3px solid rgba(54,95,74,.12)}
.register .btn_frmline {height:42px;padding:0 13px;border:1px solid var(--ws-green,#365f4a);border-radius:6px;background:#fff;color:var(--ws-green,#365f4a);line-height:40px}
.register .frm_info {display:block;margin:7px 0 0;color:#758078;line-height:1.55}
.register .btn_confirm {display:flex;justify-content:center;gap:10px;margin:26px 0 0}
.register .btn_confirm .btn_submit,.register .btn_confirm .btn_cancel,.register .btn_confirm .btn_close {min-width:145px;width:auto!important;height:49px!important;float:none!important;padding:0 20px;border-radius:8px;line-height:49px;text-align:center}
.register .btn_confirm .btn_submit {margin-left:0;background:var(--ws-green,#365f4a)}
.register .btn_confirm .btn_cancel,.register .btn_confirm .btn_close {border:1px solid var(--ws-line,#dce5de);background:#fff;color:#59665e}
.register .tooltip_icon {color:var(--ws-green,#365f4a)}
.register .tooltip {max-width:390px;border-radius:6px;background:var(--ws-green-deep,#234334)}
.register .consent-line {display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.register .sub-consents {margin:12px 0 0 25px}
.register .js-open-consent {margin-left:auto;border:0;background:transparent;color:var(--ws-green,#365f4a);text-decoration:underline}

@media (max-width:768px) {
    .ws-login-modal {padding:14px}
    .ws-login-modal__dialog {padding:38px 23px 28px;border-radius:16px}
    .ws-login-modal__brand {margin-bottom:19px;font-size:23px}
    .ws-login-modal h2 {font-size:24px}
    .ws-login-modal__options {align-items:flex-start}
    #mb_login.mbskin {margin:24px auto 45px;padding:0 14px}
    #mb_login .mbskin_box {border-radius:14px}
    #mb_login #login_fs {padding:24px 20px}
    body .register {width:calc(100% - 24px);margin:22px auto 50px;padding:0}
    .register #fregister_term,.register #fregister_private,.register .register_form_inner,.register .form_01:not(#register_form) {padding:19px 16px;border-radius:11px}
    .register .register_form_inner>ul,.register .form_01>ul {grid-template-columns:1fr;gap:14px}
    .register .register_form_inner>ul>li,.register .form_01>ul>li {grid-column:1!important}
    .register #fregister_private th,.register #fregister_private td {min-width:105px;padding:9px;font-size:12px}
    .register .btn_confirm .btn_submit,.register .btn_confirm .btn_cancel,.register .btn_confirm .btn_close {min-width:0;flex:1}
    .register #captcha {overflow-x:auto}
}
