/*
Theme Name: Subsidy Note
Author: b0h3m3
Version: 2.2.0
*/
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');

:root {
    --ink: #101820;
    --muted: #69747c;
    --line: #dfe4e6;
    --soft-line: #edf0ef;
    --canvas: #f5f6f3;
    --paper: #eef1ee;
    --blue: #2457ff;
    --coral: #ff684d;
    --lime: #c9ed62;
    --white: #ffffff;
}
* { box-sizing: border-box; }
html { font-size: 16px; }
body {
    margin: 0;
    color: var(--ink);
    background: var(--canvas);
    font-family: "Noto Sans KR", "Pretendard", "SUIT", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    letter-spacing: 0;
}
a { color: inherit; }
.wrap { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }

.utility {
    min-height: 34px;
    color: #dce5ff;
    background: var(--blue);
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 10px;
    font-weight: 700;
}
.utility .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
}
.utility strong { color: var(--lime); font-weight: 800; }

.masthead { background: var(--white); border-bottom: 1px solid var(--line); }
.masthead-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 94px;
}
.brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: var(--ink);
    text-decoration: none;
}
.brand-logo {
    display: block;
    width: 210px;
    height: 48px;
    object-fit: contain;
    object-position: left center;
}
.brand-name {
    position: relative;
    padding-left: 19px;
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 32px;
    font-weight: 800;
}
.brand-name::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 8px;
    height: 8px;
    background: var(--coral);
}
.brand-sub {
    padding-left: 14px;
    border-left: 1px solid var(--line);
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}
.issue {
    color: var(--muted);
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 10px;
    font-weight: 800;
    text-align: right;
}
.issue strong {
    display: block;
    margin-top: 4px;
    color: var(--ink);
    font-size: 13px;
}

.nav { background: var(--white); border-bottom: 1px solid var(--ink); }
.nav .wrap {
    display: flex;
    align-items: center;
    gap: 28px;
    min-height: 47px;
    overflow-x: auto;
    white-space: nowrap;
}
.nav a {
    position: relative;
    padding: 15px 0 12px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}
.nav a:hover { color: var(--blue); }
.nav a:first-child { color: var(--blue); }
.nav a:first-child::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin: 0 8px 2px 0;
    background: var(--coral);
}

main { padding: 64px 0 92px; }
.front-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 31px;
}
.eyebrow,
.kicker {
    margin: 0 0 12px;
    color: var(--blue);
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 10px;
    font-weight: 800;
}
.page-title {
    margin: 0;
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.12;
}
.front-note {
    max-width: 290px;
    margin: 0 0 4px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
    text-align: right;
}

.lead {
    display: grid;
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    background: var(--white);
    border-top: 1px solid var(--ink);
    border-bottom: 1px solid var(--ink);
}
.lead-copy {
    grid-column: 1;
    grid-row: 1;
    padding: 38px 39px 36px;
}
.lead-media {
    position: relative;
    grid-column: 2;
    grid-row: 1;
    min-height: 0;
    aspect-ratio: 1200 / 630;
    align-self: center;
    overflow: hidden;
    background: var(--paper);
}
.lead-media::after {
    content: "OFFICIAL NOTICE";
    position: absolute;
    right: 20px;
    bottom: 18px;
    padding: 7px 9px;
    background: var(--ink);
    color: #fff;
    font-family: Manrope, sans-serif;
    font-size: 9px;
    font-weight: 800;
}
.lead-media img,
.thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.lead h2 {
    margin: 0 0 16px;
    font-size: 31px;
    font-weight: 800;
    line-height: 1.42;
    word-break: keep-all;
}
.lead p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.85;
}
.lead .kicker { color: var(--coral); }
.lead-meta {
    display: flex;
    gap: 24px;
    margin-top: 29px;
    padding-top: 17px;
    border-top: 1px solid var(--soft-line);
    color: var(--muted);
    font-size: 10px;
}
.lead-meta strong {
    display: block;
    margin-top: 5px;
    color: var(--ink);
    font-size: 12px;
}
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 43px;
    margin-top: 25px;
    padding: 0 19px;
    background: var(--blue);
    color: #fff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 800;
}
.button:hover { background: var(--ink); }

.front-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 54px;
    padding-top: 47px;
}
.section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 2px solid var(--ink);
}
.section-title,
.sidebar h2 {
    margin: 0;
    padding-bottom: 12px;
    font-size: 18px;
    font-weight: 900;
}
.section-head span { color: var(--muted); font-size: 10px; }
.post-row {
    display: grid;
    grid-template-columns: 33px 196px minmax(0, 1fr);
    gap: 17px;
    align-items: start;
    padding: 21px 0;
    border-bottom: 1px solid var(--line);
}
.row-index {
    padding-top: 2px;
    color: var(--blue);
    font-family: Manrope, sans-serif;
    font-size: 13px;
    font-weight: 800;
}
.thumb {
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--paper);
}
.post-row h3 {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.52;
    word-break: keep-all;
}
.post-row h3 a { text-decoration: none; }
.post-row h3 a:hover { color: var(--blue); }
.post-row p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.75;
}
.meta {
    margin-top: 11px;
    color: var(--blue);
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 9px;
    font-weight: 800;
}
.sidebar h2 { border-bottom: 2px solid var(--ink); }
.sidebar .tag-cloud { padding-top: 18px; line-height: 2.35; }
.sidebar .tag-cloud a {
    display: inline-block;
    margin: 0 9px 5px 0;
    color: var(--muted);
    text-decoration: none;
    font-size: 12px !important;
}
.sidebar .tag-cloud a:hover { color: var(--blue); }
.sidebar-note {
    margin-top: 38px;
    padding-top: 17px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
}
.navigation.pagination { margin-top: 28px; }
.navigation.pagination a,
.navigation.pagination span {
    margin-right: 9px;
    color: var(--blue);
    font-family: Manrope, sans-serif;
    font-size: 11px;
    text-decoration: none;
}

.article {
    max-width: 790px;
    margin: 0 auto;
    padding: 0 0 60px;
}
.article-head {
    margin-bottom: 36px;
    padding-bottom: 25px;
    border-bottom: 1px solid var(--ink);
}
.article-head h1 {
    margin: 0 0 15px;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.45;
    word-break: keep-all;
}
.article-meta { color: var(--muted); font-size: 11px; }
.article-content {
    color: #27323a;
    font-size: 16px;
    line-height: 1.95;
}
.article-content h2,
.article-content h3 { margin-top: 36px; line-height: 1.5; }
.article-content img { max-width: 100%; height: auto; }
.article-content a { color: var(--blue); }
.article-page { padding-top: 34px; }
.article-topline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 43px; color: var(--muted); font-family: Manrope, "Noto Sans KR", sans-serif; font-size: 10px; font-weight: 700; }
.back-link { color: var(--blue); text-decoration: none; }
.back-link span { margin-right: 6px; }
.article-page .article { max-width: 1030px; padding-bottom: 0; }
.article-page .article-head { max-width: 830px; margin: 0 auto 28px; padding-bottom: 27px; }
.article-page .kicker { color: var(--coral); }
.article-page .article-head h1 { font-size: 43px; }
.notice-facts { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 830px; margin: 0 auto 39px; background: var(--white); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
.notice-fact { min-width: 0; padding: 17px 18px 18px; border-right: 1px solid var(--line); }
.notice-fact:last-child { border-right: 0; }
.notice-fact span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 700; }
.notice-fact strong { display: block; overflow-wrap: anywhere; font-size: 12px; line-height: 1.6; }
.article-layout { display: grid; grid-template-columns: minmax(0, 790px) 190px; gap: 50px; align-items: start; justify-content: center; }
.article-side { position: sticky; top: 24px; padding-top: 8px; border-top: 2px solid var(--blue); }
.side-label { margin-bottom: 13px; color: var(--blue); font-family: Manrope, sans-serif; font-size: 9px; font-weight: 800; }
.article-side strong { display: block; margin-bottom: 9px; font-size: 14px; line-height: 1.5; }
.article-side p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.75; }
.source-button { display: block; margin-top: 20px; padding-top: 13px; border-top: 1px solid var(--line); color: var(--blue); font-size: 11px; font-weight: 800; text-decoration: none; }
.source-button span { margin-left: 4px; font-family: Manrope, sans-serif; }
.meta-divider { display: inline-block; width: 3px; height: 3px; margin: 0 10px 2px; background: var(--coral); }
.article-intro { margin-bottom: 34px; padding: 21px 23px 19px; background: var(--white); border-left: 4px solid var(--lime); }
.article-intro strong { display: block; margin-bottom: 8px; color: var(--ink); font-size: 14px; }
.article-intro p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.85; }
.article-content { min-width: 0; overflow-wrap: anywhere; }
.article-content p { margin: 0 0 1.4em; }
.article-content .article-intro p { margin: 0; }
.notice-body h2 { margin: 36px 0 16px; color: var(--ink); font-size: 24px; font-weight: 700; }
.notice-body h3 { font-size: 19px; }
.notice-body > div:first-child h2 { margin-top: 0; }
.notice-body p, .notice-body li { line-height: 1.95; }
.notice-body a { text-underline-offset: 4px; }
.notice-body ul, .notice-body ol { padding-left: 24px; }
.notice-table-scroll { max-width: 100%; overflow-x: auto; margin-bottom: 28px; }
.notice-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.notice-table th, .notice-table td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.notice-table th { width: 110px; font-weight: 600; color: var(--muted); }
.notice-table span { display: block; font-size: 11px; color: var(--muted); }
.notice-table strong { display: block; font-size: 13px; }
.notice-body figure { margin: 28px 0; }
.notice-body figure img { display: block; width: 100%; height: auto; }
.notice-body figcaption { margin-top: 8px; color: var(--muted); font-size: 12px; }
.notice-body .notice-collected { margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.notice-image-details { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 16px; }
.notice-image-details summary { width: fit-content; color: var(--blue); font-size: 13px; cursor: pointer; }
.notice-image-details summary:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }

.footer {
    padding: 34px 0;
    background: var(--ink);
    color: #bcc8ce;
    font-size: 10px;
    line-height: 1.95;
}
.footer strong {
    color: #fff;
    font-family: Manrope, "Noto Sans KR", sans-serif;
    font-size: 17px;
    font-weight: 800;
}
.footer a { color: #fff; }

@media (max-width: 820px) {
    .wrap { width: min(100% - 28px, 680px); }
    .masthead-inner { min-height: 76px; }
    .brand-logo { width: 168px; height: 39px; }
    .brand-name { font-size: 27px; }
    .brand-sub,
    .issue { display: none; }
    .nav .wrap { gap: 22px; min-height: 44px; }
    .nav a { padding: 14px 0 11px; }
    main { padding: 35px 0 60px; }
    .front-head { display: block; margin-bottom: 22px; }
    .page-title { font-size: 33px; }
    .front-note { max-width: none; margin-top: 14px; text-align: left; }
    .lead { display: flex; flex-direction: column-reverse; }
    .lead-media { min-height: 0; aspect-ratio: 16 / 10; }
    .lead-copy { padding: 24px 20px 26px; }
    .lead h2 { font-size: 23px; }
    .front-columns { display: block; padding-top: 34px; }
    .sidebar { margin-top: 37px; }
    .post-row { grid-template-columns: 27px 125px minmax(0, 1fr); gap: 11px; padding: 17px 0; }
    .row-index { font-size: 12px; }
    .post-row h3 { font-size: 14px; line-height: 1.48; }
    .post-row p { display: none; }
    .meta { margin-top: 8px; line-height: 1.5; }
    .article-head h1 { font-size: 29px; }
    .article-content { font-size: 16px; }
    .article-page { padding-top: 25px; }
    .article-topline { margin-bottom: 30px; }
    .article-page .article-head { margin-bottom: 22px; }
    .article-page .article-head h1 { font-size: 29px; }
    .notice-facts { grid-template-columns: 1fr; margin-bottom: 30px; }
    .notice-fact { padding: 14px 16px; border-right: 0; border-bottom: 1px solid var(--line); }
    .notice-fact:last-child { border-bottom: 0; }
    .article-layout { display: block; }
    .article-side { position: static; margin-top: 35px; padding: 19px 0 0; border-top: 2px solid var(--blue); }
}
@media (max-width: 430px) {
    .utility .wrap span:last-child { display: none; }
    .post-row { grid-template-columns: 22px 103px minmax(0, 1fr); gap: 9px; }
    .post-row h3 { font-size: 13px; }
    .meta { font-size: 8px; }
}