/* Generated by tools/split-subpage-css.php. Edit assets/css/source/subpage-modern.full.css instead. */
.national-pension-page-heading { margin-bottom: 28px; text-align: left; }
.national-pension-page-heading .national-pension-eyebrow { margin: 0 0 8px; color: #0f766e; font-size: .78rem; font-weight: 800; }
.national-pension-page-heading h1 { margin-bottom: 12px; color: #172033; font-size: 2.15rem; line-height: 1.25; letter-spacing: 0; }
.national-pension-page-heading > p:last-child { max-width: 760px; margin: 0; color: #5b687b; line-height: 1.75; }
.national-pension-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 26px; padding: 4px; border: 1px solid #d9e1eb; border-radius: 8px; background: #eef2f5; }
.national-pension-tabs button { min-width: 0; min-height: 46px; margin: 0; padding: 9px 14px; border: 0; border-radius: 6px; background: transparent; color: #5a687b; font-size: .86rem; font-weight: 800; box-shadow: none; }
.national-pension-tabs button[aria-selected="true"] { background: #fff; color: #0f625c; box-shadow: 0 1px 4px rgba(23, 32, 51, .12); }
.national-pension-tabs button:focus-visible { outline: 2px solid #0f766e; outline-offset: 1px; }
.national-pension-panel[hidden] { display: none; }
.national-pension-panel-heading { margin-bottom: 18px; }
.national-pension-panel-heading h2 { margin-bottom: 8px; color: #172033; font-size: 1.35rem; }
.national-pension-panel-heading > p:last-child { max-width: 760px; margin: 0; color: #627084; font-size: .86rem; line-height: 1.7; }
.national-pension-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, .9fr); gap: 22px; align-items: stretch; }
.national-pension-input-panel, .national-pension-result-panel { min-width: 0; margin: 0; padding: 22px; border: 1px solid #d9e1eb; border-radius: 8px; background: #fff; }
.national-pension-input-panel { display: grid; gap: 16px; align-content: start; }
.national-pension-field { display: grid; min-width: 0; gap: 7px; margin: 0; color: #334155; font-size: .84rem; font-weight: 800; }
.national-pension-field > input, .national-pension-field > select, .national-pension-input-unit { width: 100%; min-width: 0; height: 48px; border: 1px solid #d5deea; border-radius: 7px; background: #fff; }
.national-pension-field > input, .national-pension-field > select { margin: 0; color: #172033; }
.national-pension-input-unit { display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-items: center; overflow: hidden; }
.national-pension-input-unit input { width: 100%; min-width: 0; height: 46px; margin: 0; border: 0; border-radius: 0; background: transparent; color: #172033; }
.national-pension-input-unit b { color: #748095; font-size: .73rem; text-align: center; }
.national-pension-field > input:focus, .national-pension-field > select:focus, .national-pension-input-unit:focus-within { border-color: #0f766e; box-shadow: 0 0 0 3px rgba(15, 118, 110, .11); }
.national-pension-error { min-height: 20px; margin: -2px 0 0; color: #b42318; font-size: .78rem; line-height: 1.55; }
.national-pension-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.national-pension-actions button { min-height: 48px; margin: 0; }
.national-pension-actions .national-pension-primary-button { background: #0f766e; color: #fff; }
.national-pension-actions button[type="reset"] { background: #e9eef4; color: #314158; }
.national-pension-result-panel { display: flex; border-color: #d5e2df; background: #f4f9f8; flex-direction: column; }
.national-pension-result-panel.is-estimate { background: #f7f8fa; border-color: #dce2ea; }
.national-pension-result-panel > strong { color: #172033; font-size: 2.05rem; line-height: 1.25; overflow-wrap: anywhere; }
.national-pension-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.national-pension-result-grid > div { min-width: 0; padding: 10px; border: 1px solid #dde6e4; border-radius: 6px; background: #fff; }
.national-pension-result-grid dt { margin-bottom: 4px; color: #6d7b78; font-size: .67rem; }
.national-pension-result-grid dd { margin: 0; color: #263b37; font-size: .78rem; font-weight: 800; overflow-wrap: anywhere; }
.national-pension-adjustment.is-adjusted { background: #fff3d8; color: #795713; }
.national-pension-guide { margin-top: 44px; padding-top: 30px; border-top: 1px solid #dce3eb; }
.national-pension-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; margin-top: 22px; }
.national-pension-guide-grid section { padding: 22px 0; border-bottom: 1px solid #e2e7ee; }
.national-pension-guide-grid h3 { margin-bottom: 8px; color: #1f2c40; font-size: 1rem; }
.national-pension-guide-grid p { margin: 0; color: #5f6d80; font-size: .88rem; line-height: 1.75; }
@media screen and (max-width: 980px) {
.national-pension-workspace { grid-template-columns: 1fr; }
}
@media screen and (max-width: 620px) {
.national-pension-page-heading h1 { font-size: 1.72rem; }
.national-pension-tabs button { padding: 8px; font-size: .78rem; }
.national-pension-input-panel, .national-pension-result-panel { padding: 16px; }
.national-pension-period-fields, .national-pension-guide-grid, .national-pension-actions { grid-template-columns: 1fr; }
.national-pension-result-grid { grid-template-columns: 1fr; }
}
.cagr-result-grid > .is-wide { grid-column: 1 / -1; }
.revolving-field-grid .is-wide { grid-column: 1 / -1; }
.revolving-result-grid > .is-wide { grid-column: 1 / -1; }
@media screen and (max-width: 620px) {
.revolving-field-grid .is-wide, .revolving-result-grid > .is-wide { grid-column: auto; }
}
.qrcode-field-grid .is-wide { grid-column: 1 / -1; }
@media screen and (max-width: 620px) {
.qrcode-field-grid .is-wide { grid-column: auto; }
}
.ip-convert-result-card.wide { grid-column: 1 / -1; }