.member-login { display:flex; justify-content:center; min-height:calc(100dvh - 160px); padding:88px 20px; background:#f3f0ea; }
.member-login .login-form { width:min(100%, 420px); align-self:center; padding:42px; border:1px solid #ddd5ca; background:#fffdf9; box-shadow:0 22px 50px rgba(49,42,33,.10); }
.member-login .login-title { margin-bottom:30px; }
.member-login .login-title h2 { margin:0; color:#2f2923; font-size:32px; line-height:1.2; }
.member-login .login-title p { margin:10px 0 0; color:#82776b; font-size:14px; }
.member-login .login-field { display:block; margin-top:18px; }
.member-login .login-field > span { display:block; margin-bottom:8px; color:#4b4138; font-size:13px; font-weight:700; }
.member-login .login-field input { display:block; width:100%; height:48px; padding:0 14px; border:1px solid #d9d1c7; border-radius:0; background:#fff; color:#2f2923; font-size:15px; }
.member-login .login-field input:focus { border-color:#9b7654; outline:2px solid rgba(155,118,84,.14); outline-offset:0; }
.member-login .login-option { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:18px; font-size:13px; }
.member-login .login-option .jw-checkbox { --jw-checkbox-border-color:#9b7654; }
.member-login .login-option .jw-checkbox input:checked + i { border-color:#9b7654; background:#9b7654; }
.member-login .login-option .jw-checkbox span { color:#6d6258; }
.member-login .login-option a { color:#73533a; font-weight:700; text-decoration:none; }
.member-login .login-submit { width:100%; height:50px; margin-top:30px; border:0; border-radius:0; background:#2f2923; color:#fff; font-size:15px; font-weight:700; }
.member-login .login-submit:hover { background:#73533a; }
main#login:has(form[name="join-step1"]), main#login:has(#join-form), main#login:has(#join-complete) { min-height:calc(100dvh - 160px); padding:78px 20px; background:#f3f0ea; }
form[name="join-step1"], #join-form, #join-complete { width:min(100%, 760px); margin:0 auto; padding:42px; border:1px solid #ddd5ca; background:#fffdf9; box-shadow:0 22px 50px rgba(49,42,33,.08); }
form[name="join-step1"] h2, #join-form h2, #join-complete h2 { margin:0 0 28px; color:#2f2923; font-size:30px; }
.terms-container { margin-top:24px; border-top:1px solid #ded6cc; }
.terms-container h3 { margin:20px 0 12px; color:#3f352d; font-size:17px; }
.terms-content { max-height:240px; padding:20px; border:1px solid #ddd5ca; background:#fff; overflow:auto; color:#62584f; font-size:13px; line-height:1.8; }
.terms-footer { display:flex; justify-content:flex-end; padding-top:14px; }
form[name="join-step1"] .jw-center { margin-top:30px; }
#join-form > p, #join-complete > p { margin:-16px 0 30px; color:#74695e; }
#join-form-box { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; }
#join-form-box > div { display:flex; flex-direction:column; gap:8px; }
#join-form-box label:not(.jw-checkbox) { color:#4b4138; font-size:13px; font-weight:700; }
#join-form-box input { width:100%; height:46px; padding:0 14px; border:1px solid #d9d1c7; background:#fff; color:#2f2923; }
#join-form-box .full { grid-column:1 / -1; }
#join-form-box .buttons { display:flex; flex-direction:row; justify-content:flex-end; margin-top:10px; }
#join-form-box .buttons .jw-button, #join-complete .jw-button, form[name="join-step1"] .jw-button { min-width:120px; height:44px; border:0; border-radius:0; background:#2f2923; color:#fff; }
#join-complete .buttons { display:flex; gap:10px; }
@media (max-width:520px) {
	.member-login { min-height:calc(100dvh - 120px); padding:50px 16px; }
	.member-login .login-form { padding:32px 24px; }
	form[name="join-step1"], #join-form, #join-complete { padding:30px 20px; }
	#join-form-box { grid-template-columns:1fr; }
}
