#member { height:100%; display:flex; justify-content:center; align-items:center; background:#D8E7FF; }

#login { width:100%; max-width:500px; background:#fff; border-radius:20px; padding:40px 45px; }
#login form { width:100%; display:flex; flex-direction:column; align-items:center; }
#login form h2 { font-size:42px; font-weight:bold; }

#login .field-wrap { width:100%; margin-top:50px; display:grid; gap:30px; }
#login .field-wrap .field { background:#eeee; height:50px; border-radius:10px; }
#login .field-wrap .field input { width:100%; height:100%; padding:0 20px; }

#login .button-wrap { width:100%; margin-top:24px; display:flex; align-items:center; justify-content:space-between; }
#login .submit { margin-top:24px; width:100%; height:50px; }

#join { display:flex; justify-content:center; align-items:center; min-height:100vh; }
#join .join-box { width:500px; background:#fff; border-radius:12px; padding:40px 36px; box-shadow:0 10px 30px rgba(0,0,0,0.08); }
#join h2 { font-size:28px; font-weight:700; text-align:center; margin-bottom:6px; }
#join .join-desc { text-align:center; color:#6b7280; font-size:14px; margin-bottom:30px; }
#join .form-group { margin-bottom:18px; }
#join label { display:block; font-size:14px; font-weight:600; margin-bottom:6px; }
#join label span { color:#ef4444; }

#join input { width:100%; height:44px; padding:0 14px; border:1px solid #d1d5db; border-radius:8px; font-size:14px; outline:none; transition:border .2s; }
#join input:focus { border-color:#2563eb; }
#join .input-eye { position:relative; }
#join .input-eye input { padding-right:40px; }
#join .input-eye .eye { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:22px; height:22px; background:url(/img/icon-eye.svg) center center no-repeat; background-size:18px; border:none; cursor:pointer; opacity:.6; }
#join .form-check { margin-top:10px; font-size:14px; }
#join .form-check label { display:flex; align-items:center; gap:8px; font-weight:400; }
#join .form-check input { width:16px; height:16px; }
#join .form-actions { margin-top:24px; }
#join .join-btn { width:100%; height:48px; background:#2563eb; color:#fff; border:none; border-radius:10px; font-size:16px; font-weight:600; cursor:pointer; }
#join .join-btn:hover { background:#1d4ed8; }
#join .login-link { text-align:center; margin-top:18px; font-size:14px; color:#6b7280; }
#join .login-link a { color:#2563eb; text-decoration:none; font-weight:600; }
#join .form-row { display:flex; gap:12px; }
#join .form-row .form-group { flex:1; }