@charset "utf-8";
/* 로그인 (원본 global_responsive_b_home_mobile/pc.css 중 .glores-B-login 규칙) */
.glores-B-login { max-width: 500px; margin: 0 auto; }
.glores-B-login-title { margin: 0 0 20px; padding: 0 0 12px; border-bottom: 2px solid #000; font-size: 18px; font-weight: bold; line-height: 22px; letter-spacing: -.03em; color: #000; text-align: center; }

.login-input-box li { margin: 10px 0 0; border-bottom: 1px solid #ddd; }
.login-input-box label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.login-input-box input { box-sizing: border-box; width: 100%; height: 45px; padding: 0 10px; border: 0; font-size: 14px; color: #aaa; }
.login-input-box input::placeholder { color: #aaa; }

/* 체크박스: 실제 input 은 숨기고(키보드 포커스는 유지) label 앞 동그라미로 */
.login-check-box { margin-top: 12px; font-size: 0; }
.login-check-box > span { display: inline-block; margin-left: 15px; vertical-align: top; }
.login-check-box > span:first-child { margin-left: 0; }
.login-check-box input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.login-check-box label { display: inline-block; position: relative; padding-left: 25px; font-size: 13px; line-height: 20px; letter-spacing: -.03em; color: #666; vertical-align: top; cursor: pointer; }
.login-check-box label:before { content: ''; position: absolute; top: 1px; left: 0; box-sizing: border-box; width: 20px; height: 20px; border: 1px solid #ddd; border-radius: 50%; background: #fff; }
.login-check-box label:after { content: ''; position: absolute; top: 6px; left: 5px; box-sizing: border-box; width: 10px; height: 7px; border: 3px solid #e1e1e1; border-width: 0 0 3px 3px; transform: rotate(315deg); }
.login-check-box input:checked + label:after { border-color: var(--point); }
.login-check-box input:focus-visible + label:before { outline: 2px solid var(--point); outline-offset: 1px; }

.login-btn-box { margin-top: 20px; font-size: 0; text-align: center; }
.login-btn-box > span { display: inline-block; position: relative; margin-left: 10px; padding-left: 10px; vertical-align: top; }
.login-btn-box > span:before { content: ''; position: absolute; top: 5px; left: 0; width: 1px; height: 13px; background: #ddd; }
.login-btn-box > span:first-child { margin-left: 0; padding-left: 0; }
.login-btn-box > span:first-child:before { display: none; }
.login-btn-box a { display: inline-block; font-size: 14px; line-height: 20px; letter-spacing: -.03em; color: #666; vertical-align: top; }
.login-btn-box a.btn-join { font-weight: bold; color: #000; }

.login-btn-submit { margin-top: 25px; }
.login-btn-submit button { width: 100%; height: 50px; margin: 0; padding: 0; border: 0; border-radius: 5px; background: var(--point); font-size: 14px; font-weight: bold; line-height: 18px; letter-spacing: -.03em; color: #fff; }

/* 원본 PC 규칙은 1024px 부터 */
@media (min-width: 1024px) {
  .glores-B-login-title { margin-bottom: 40px; padding-bottom: 30px; border-bottom-width: 3px; font-size: 22px; line-height: 25px; letter-spacing: -.05em; }
  .login-input-box li { margin-top: 25px; }
  .login-input-box input { height: 75px; font-size: 18px; font-weight: bold; }
  .login-check-box { margin-top: 20px; }
  .login-check-box > span { margin-left: 25px; }
  .login-check-box label { padding-left: 32px; font-size: 16px; line-height: 23px; }
  .login-check-box label:before { width: 23px; height: 23px; }
  .login-check-box label:after { top: 8px; left: 6px; width: 11px; }
  .login-btn-box { margin-top: 65px; }
  .login-btn-box > span { margin-left: 15px; padding-left: 15px; }
  .login-btn-box > span:before { top: 3px; height: 16px; }
  .login-btn-box a { font-size: 18px; line-height: 22px; }
  .login-btn-submit { margin-top: 48px; }
  .login-btn-submit button { height: 70px; font-size: 20px; line-height: 25px; }
}