/* Generated 390px mobile baseline; rebuild with build-mobile-rem.py. */
.login-page{color: rgb(28, 48, 75);}
.login-page .skip-link{position: fixed; top: 0.5rem; left: 1rem; z-index: 1000; padding: 0.75rem 1.125rem; background: rgb(24, 45, 71); color: white; transform: translateY(calc(-100% - 1rem));}
.login-page .skip-link:focus{transform: none;}
.login-main{background: rgb(255, 255, 255); padding: 1.625rem 0 5.3125rem;}
.login-main > .wrap{max-width: 80rem;}
.login-breadcrumb{display: flex; justify-content: flex-end; gap: 0.625rem; align-items: center; font-size: max(10px,0.6875rem); color: rgb(113, 128, 150); margin: 0 0 2.5rem;}
.login-breadcrumb span{color: rgb(171, 182, 196);}
.login-breadcrumb strong{font-weight: 600; color: rgb(63, 82, 108);}
.login-layout{max-width: 30rem; margin: 0 auto;}
.login-panel{min-width: 0;}
.login-panel h1{text-align: center; font-size: 2.25rem; line-height: 1.3; letter-spacing: -0.045em; font-weight: 700;}
.login-intro{text-align: center; font-size: max(13px,0.9375rem); color: rgb(113, 128, 150); line-height: 1.8; margin-top: 0.8125rem; word-break: keep-all;}
.login-form{margin-top: 1.75rem;}
.login-field{margin-bottom: 1.1875rem;}
.login-field > label{display: block; font-size: max(10px,0.8125rem); font-weight: 600; color: rgb(59, 80, 107); margin-bottom: 0.5625rem;}
.login-field input{display: block; width: 100%; height: 3.375rem; padding: 0 1rem; background: rgb(249, 250, 252); border: 1px solid rgb(216, 225, 235); border-radius: 0.375rem; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: max(13px,1rem); color: rgb(25, 47, 75); outline: none; transition: border-color 0.2s, box-shadow 0.2s;}
.login-field input::placeholder{color: rgb(154, 167, 183); font-size: max(13px,0.875rem);}
.login-field input:focus{border-color: rgb(64, 119, 210); box-shadow: rgba(66, 119, 204, 0.07) 0 0 0 0.1875rem; background: rgb(255, 255, 255);}
.login-password{position: relative;}
.login-password input{padding-right: 3.375rem;}
.login-password-toggle{position: absolute; top: 0.3125rem; right: 0.375rem; width: 2.75rem; height: 2.75rem; display: grid; place-items: center; background: transparent; border: 0; border-radius: 0.25rem; color: rgb(117, 135, 157); cursor: pointer;}
.login-password-toggle svg{width: 1.3125rem; height: 1.3125rem; fill: none; stroke: currentcolor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;}
.login-password-toggle[aria-pressed="true"] .eye-slash{display: none;}
.login-caps{font-size: max(10px,0.75rem); line-height: 1.6; color: rgb(133, 89, 35); margin-top: 0.5rem;}
.login-caps[hidden]{display: none;}
.login-options{display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin: 0.25rem 0 1.5rem; font-size: max(10px,0.8125rem); color: rgb(98, 115, 138);}
.login-auto{display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer; min-height: 1.75rem; white-space: nowrap;}
.login-auto input{width: 1.0625rem; height: 1.0625rem; accent-color: rgb(50, 104, 189); cursor: pointer;}
.login-recovery{text-underline-offset: 0.25rem;}
.login-submit{display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.4375rem; border: 0; border-radius: 0.375rem; background: rgb(50, 105, 192); color: white; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: max(13px,1rem); font-weight: 650; cursor: pointer; transition: background 0.2s, box-shadow 0.2s;}
.login-join{display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.625rem; padding-top: 1.375rem; border-top: 1px solid rgb(229, 234, 240);}
.login-join > p{font-size: max(10px,0.8125rem); color: rgb(119, 134, 154); word-break: keep-all;}
.login-join > a{display: inline-flex; align-items: center; justify-content: center; min-height: 2.5rem; gap: 0.8125rem; font-size: max(13px,0.875rem); font-weight: 650; color: rgb(53, 87, 127); white-space: nowrap;}
.login-join > a span{font-size: max(13px,1.1875rem);}
.login-main a:focus-visible, .login-main button:focus-visible, .login-main input[type="checkbox"]:focus-visible{outline: rgb(130, 169, 220) solid 0.1875rem; outline-offset: 0.1875rem;}
.login-social{margin-top: 1.6875rem;}
.login-social h2{display: flex; align-items: center; gap: 1.0625rem; font-size: max(10px,0.75rem); font-weight: 450; color: rgb(135, 148, 166); line-height: 1.6; margin: 0 0 1.25rem;}
.login-social h2::before, .login-social h2::after{content: ""; flex: 1 1 0%; height: 1px; background: rgb(230, 235, 241);}
.login-social h2 span{white-space: nowrap;}
.login-social-buttons{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem;}
.login-social-button{display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 3.25rem; padding: 0.75rem 0.625rem; border: 0; border-radius: 0.375rem; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: max(13px,0.875rem); font-weight: 600; line-height: 1.4; white-space: nowrap;}
.login-social-button svg{display: block; width: 1.375rem; height: 1.375rem; overflow: hidden; flex-shrink: 0;}
.login-social-kakao{background: rgb(254, 229, 0); color: rgba(0, 0, 0, 0.85);}
.login-social-naver{background: rgb(3, 169, 77); color: white;}
.login-social-button:disabled{cursor: not-allowed;}
@media (hover: hover){.login-recovery:hover{text-decoration: underline; color: rgb(40, 87, 153);}
.login-submit:hover{background: rgb(37, 91, 169); box-shadow: rgba(42, 91, 156, 0.15) 0 0.3125rem 0.9375rem;}
.login-password-toggle:hover{color: rgb(35, 77, 128); background: rgb(234, 240, 246);}
.login-join > a:hover{color: rgb(36, 94, 179);}}
.login-main{padding: 1.25rem 0 4.0625rem;}
.login-breadcrumb{margin-bottom: 2.1875rem;}
.login-panel h1{font-size: 2rem;}
.login-layout{max-width: 28.75rem;}
.login-main > .wrap{padding-inline: 1.25rem;}
.login-intro{font-size: max(13px,0.875rem);}
.login-options{font-size: max(10px,0.75rem); gap: 0.5rem;}
.login-join{gap: 0.625rem;}
.login-join > p{font-size: max(10px,0.75rem);}
.login-join > a{font-size: max(10px,0.8125rem); gap: 0.4375rem;}
.login-social-buttons{gap: 0.625rem;}
.login-social-button{font-size: max(10px,0.8125rem); padding-inline: 0.5rem;}

@media (prefers-reduced-motion: reduce){.login-field input, .login-submit{transition: none;}}