/* Account screens: handoff2 presentation only; form and authentication hooks stay intact. */
#wrap.portal-wide-layout #container > .inner:has(.portal-login, .find-password) { padding-top: 28px; padding-bottom: 120px; }
#container > .inner:has(.portal-login, .find-password) > .breadcrumb-wrap { margin-bottom: 0; }
.portal-login, .find-password { color: #1e293b; padding-bottom: 0; font-family: "Pretendard Variable", "Pretendard GOV", "Noto Sans KR", "Malgun Gothic", sans-serif; -webkit-font-smoothing: antialiased; }
.portal-login :is(input, button, select), .find-password :is(input, button, select) { font-family: inherit; }
.portal-login, .portal-login * { box-sizing: border-box; }
.portal-login .page-title-wrap, .find-password .fp-heading { display: block; margin: 0 0 40px; text-align: center; }
.portal-login .page-title-wrap .h-tit, .find-password .fp-title { margin: 30px 0; font-size: 31px; font-weight: 700; line-height: 41px; letter-spacing: normal; color: #1e293b; }
.portal-login .page-title-wrap .txt, .find-password .fp-heading .txt { margin: 0; font-size: 15px; line-height: 1.7; color: #64748b; text-wrap: pretty; }
.portal-login .login-form-area, .find-password .fp-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-width: 1120px; padding: 56px 0; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; }
.portal-login .login-form-area .login-wrap, .find-password .fp-form { min-width: 0; margin: 0; padding: 0 60px 0 0; border-right: 1px solid #e2e8f0; }
.portal-login fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.portal-login legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.portal-login .login-form-area .login-info-wrap, .find-password .fp-notes { min-width: 0; margin: 0; padding: 6px 0 0 60px; border-top: 0; }
.portal-login .form-tit, .find-password .fp-label { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.5; }
.portal-login .form-tit label { font: inherit; }
.portal-login .login-wrap input.form-control, .find-password .fp-input { height: 48px; border-color: #ced6dd; border-radius: 6px; font-size: 15px; font-weight: 600; color: #1e293b; }
.portal-login .login-wrap .btn.primary { background: #256ef4; border-color: #256ef4; }
.portal-login .login-wrap .btn.login-sso { background: #fff; border-color: #69a8ff; color: #246beb; }
.portal-login .login-wrap .btn.primary:hover { background: #1f5fd6; }
.portal-login .login-wrap .btn.login-sso:hover { background: #eff5ff; }
.portal-login .fieldset { gap: 20px; }
.portal-login .fieldset > .form-group:last-child { margin-top: 4px; }
.portal-login .link-group { align-items: center; gap: 4px 10px; padding: 0; list-style: none; }
.portal-login .form-group .link-group > li { display: flex; align-items: center; gap: 0; margin: 0; padding: 0; }
.portal-login .form-group .link-group > li + li::before { content: ''; position: static; display: block; flex: 0 0 1px; width: 1px; height: 12px; margin: 0 10px 0 0; background: #cbd5e1; transform: none; }
.portal-login .form-group .link-group .btn { display: inline-flex; align-items: center; justify-content: center; height: 28px; min-height: 28px; padding: 0 4px; color: #64748b; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 20px; text-decoration: none; }
.portal-login .form-group .link-group a:is(:hover, :active),
.find-password .fp-links a:is(:hover, :active) { color: #1e293b; background: transparent; border-color: transparent; box-shadow: none; text-decoration: none; }
.portal-login .form-group .link-group a[href="/portal/regist/ssoJoinForm"], .portal-login .form-group .link-group .login-join { color: #256ef4; }
.portal-login .form-group .link-group a[href="/portal/regist/ssoJoinForm"]:is(:hover, :active),
.portal-login .form-group .link-group .login-join:is(:hover, :active),
.find-password .fp-links .fp-join:is(:hover, :active) { color: #1f5fd6; }
/* Pointer clicks keep the HTML hover appearance; keyboard focus remains visible. */
.portal-login :is(a, button):focus:not(:focus-visible),
.find-password :is(a, button):focus:not(:focus-visible) { outline: none; box-shadow: none; }
.portal-login .login-pw-toggle:is(:hover, :active) { background: #f2f5fa; color: #1e293b; }
.portal-login .login-wrap .btn.primary:active { background: #1f5fd6; border-color: #256ef4; }
.portal-login .login-wrap .btn.login-sso:active { background: #eff5ff; border-color: #69a8ff; color: #246beb; }
.portal-login .login-wrap .login-cert:active,
.find-password .fp-cert:active { background: #e3edff; border-color: #c9dbfb; color: #246beb; }
.find-password .fp-primary:active { background: #1f5fd6; }
.portal-login .info-list { margin: 0; list-style: none; }
.portal-login .info-list li, .find-password .fp-note-list li { padding-left: 16px; font-size: 15px; line-height: 1.7; color: #33404f; text-wrap: pretty; }
.portal-login .info-list li::before { color: #64748b; font-size: 15px; line-height: 1.7; }
.find-password .fp-control:has(> .fp-label) { display: flex; flex-direction: column; gap: 8px; }
@media (max-width: 767px) {
    .portal-login .login-form-area, .find-password .fp-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 32px 0; }
    .portal-login .login-form-area .login-wrap, .find-password .fp-form { padding: 0; border-right: 0; }
    .portal-login .login-form-area .login-info-wrap, .find-password .fp-notes { padding: 0; }
    .portal-login .page-title-wrap .h-tit, .find-password .fp-title { font-size: 28px; line-height: 38px; }
}