:root { color:#183b56; background:#fff; font-family:Pretendard,"Noto Sans KR",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --primary:#20b8a6; --primary-dark:#118f82; --navy:#183b56; --muted:#687c8b; --line:#dfe8eb; --surface:#f6f9fa; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { min-width:320px; margin:0; background:var(--white); }
a { color:inherit; }
.skip-link { position:fixed; z-index:100; top:8px; left:8px; padding:10px 14px; color:#fff; background:var(--navy); transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.landing-container { width:min(1240px,calc(100% - 48px)); margin:0 auto; }
.public-header { position:sticky; z-index:30; top:0; border-bottom:1px solid rgba(223,232,235,.9); background:rgba(255,255,255,.95); backdrop-filter:blur(14px); }
.public-header-inner { display:flex; align-items:center; width:min(1240px,calc(100% - 48px)); height:72px; margin:0 auto; gap:48px; }
.public-wordmark { color:var(--navy); font-size:1.6rem; font-weight:900; letter-spacing:-.045em; text-decoration:none; }
.public-nav { display:flex; align-items:center; gap:30px; margin-left:auto; }
.public-nav a,.public-footer nav a { color:#526b7b; font-size:.92rem; font-weight:700; text-decoration:none; }
.public-nav a:hover,.public-footer nav a:hover { color:var(--primary-dark); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 22px; border:1px solid transparent; border-radius:10px; font-weight:800; text-decoration:none; }
.button:focus-visible,a:focus-visible { outline:3px solid rgba(32,184,166,.28); outline-offset:3px; }
.eyebrow { margin:0 0 12px; color:var(--primary-dark); font-size:.78rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.hero-visual { margin:0; overflow:hidden; border-radius:28px; background:#fff; box-shadow:0 24px 60px rgba(24,59,86,.1); }
.hero-visual img { display:block; width:100%; height:100%; min-height:390px; object-fit:cover; }
.landing-section { padding:88px 0; scroll-margin-top:72px; }
.section-heading h2,.guide-copy h2,.notice-section-heading h2 { margin:0; color:var(--navy); font-size:clamp(2rem,3.4vw,3rem); letter-spacing:-.05em; line-height:1.25; }
.section-heading>p:last-child,.guide-copy>p:last-child { margin:16px 0 0; color:var(--muted); line-height:1.75; }
.features-section,.guide-section { background:var(--surface); }
.section-heading { max-width:680px; margin-bottom:38px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card { padding:30px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.feature-number { color:var(--primary-dark); font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.feature-card h3 { margin:28px 0 12px; font-size:1.35rem; }
.feature-card p { min-height:78px; margin:0 0 24px; color:var(--muted); line-height:1.7; }
.feature-card strong { color:var(--primary-dark); font-size:.84rem; }
.process-list { display:grid; margin:0; padding:0; grid-template-columns:repeat(5,1fr); list-style:none; }
.process-list li { position:relative; display:grid; padding-right:22px; gap:9px; }
.process-list li:not(:last-child)::after { position:absolute; top:17px; right:12px; width:calc(100% - 55px); height:1px; background:#c9dcdf; content:""; transform:translateX(100%); }
.process-list span { position:relative; z-index:1; display:grid; width:36px; height:36px; border-radius:50%; color:#fff; background:var(--primary-dark); font-size:.85rem; font-weight:900; place-items:center; }
.process-list strong { margin-top:8px; color:var(--navy); }
.process-list small { color:var(--muted); line-height:1.5; }
.guide-grid { display:grid; align-items:start; grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr); gap:72px; }
.guide-list,.notice-board { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#fff; }
.guide-list article { display:grid; padding:24px 26px; border-bottom:1px solid var(--line); grid-template-columns:100px minmax(190px,.75fr) 1fr; gap:20px; }
.guide-list article:last-child { border-bottom:0; }
.guide-list span { color:var(--primary-dark); font-size:.82rem; font-weight:900; }
.guide-list h3,.guide-list p { margin:0; }
.guide-list h3 { font-size:1rem; }
.guide-list p { color:var(--muted); font-size:.86rem; line-height:1.6; }
.notice-section { padding-top:68px; padding-bottom:68px; background:#fff; }
.notice-section-inner { display:grid; align-items:stretch; grid-template-columns:240px minmax(0,1fr); gap:52px; }
.notice-section-heading h2 { font-size:1.8rem; }
.notice-board { min-height:180px; box-shadow:0 10px 28px rgba(24,59,86,.04); }
.notice-empty { display:grid; min-height:178px; margin:0; padding:38px 34px; color:var(--muted); font-size:.9rem; place-items:center; }
.public-notice-row { display:grid; width:100%; min-height:58px; padding:15px 24px; border:0; border-bottom:1px solid var(--line); color:var(--navy); background:#fff; text-align:left; grid-template-columns:minmax(0,1fr) auto; gap:18px; }
.public-notice-row:hover { background:#f5fbfa; }
.public-notice-row time { color:var(--muted); font-size:.8rem; }
.notice-all { display:flex; justify-content:flex-end; padding:14px 22px; color:var(--primary-dark); font-size:.82rem; font-weight:800; text-decoration:none; }
.landing-notice-detail { padding:28px; }
.landing-notice-detail h3 { margin:0 0 8px; font-size:1.25rem; }
.landing-notice-detail time { color:var(--muted); font-size:.8rem; }
.landing-notice-detail p { margin:22px 0; padding-top:22px; border-top:1px solid var(--line); white-space:pre-wrap; line-height:1.75; }
.landing-notice-detail button { padding:0; border:0; color:var(--primary-dark); background:transparent; font-weight:800; }
.service-intro-banner { padding:72px 0; border-bottom:1px solid rgba(17,143,130,.12); background:linear-gradient(115deg,#f7fcfb 0%,#edf8f6 100%); scroll-margin-top:72px; }
.service-intro-inner { display:grid; align-items:center; grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr); gap:64px; }
.service-intro-copy { max-width:610px; }
.service-intro-banner h1 { margin:0; color:var(--navy); font-size:clamp(2.8rem,5vw,4.65rem); letter-spacing:-.065em; line-height:1.12; }
.service-intro-banner .service-intro-copy>p:not(.eyebrow) { margin:24px 0 0; color:#536d7c; font-size:1.08rem; line-height:1.8; }
.service-intro-actions { display:flex; margin-top:32px; gap:12px; }
.button-primary { color:#fff; background:var(--primary-dark); }
.button-primary:hover { background:#0b796f; }
.button-secondary { border-color:#b9d9d5; color:var(--navy); background:rgba(255,255,255,.72); }
.button-secondary:hover { border-color:var(--primary); background:#fff; }
.public-footer { padding:42px 0; border-top:1px solid var(--line); background:#fff; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:32px; }
.footer-inner p { margin:8px 0 0; color:var(--muted); font-size:.84rem; }
.public-footer nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:20px; }
@media (max-width:1000px) { .service-intro-inner { grid-template-columns:minmax(0,1fr) minmax(340px,.85fr); gap:36px; } .hero-visual img { min-height:340px; } }
@media (max-width:900px) { .service-intro-inner,.guide-grid { grid-template-columns:1fr; gap:38px; } .service-intro-copy { max-width:680px; } .hero-visual { width:min(100%,680px); } .hero-visual img { min-height:0; aspect-ratio:16/10; } .feature-grid { grid-template-columns:1fr; } .feature-card p { min-height:0; } .process-list { grid-template-columns:1fr; gap:20px; } .process-list li { min-height:54px; padding:0 0 0 54px; } .process-list span { position:absolute; left:0; } .process-list li:not(:last-child)::after { top:38px; right:auto; left:17px; width:1px; height:38px; transform:none; } .notice-section-inner { grid-template-columns:1fr; gap:22px; } }
@media (max-width:680px) { .landing-container,.public-header-inner { width:min(100% - 32px,1240px); } .public-header-inner { height:64px; } .public-nav { display:none; } .service-intro-banner { padding:52px 0 34px; scroll-margin-top:64px; } .service-intro-banner h1 { font-size:clamp(2.35rem,12vw,3.2rem); } .service-intro-banner .service-intro-copy>p:not(.eyebrow) { font-size:.98rem; } .desktop-break { display:none; } .hero-visual { border-radius:18px; } .landing-section { padding:66px 0; scroll-margin-top:64px; } .guide-list article { grid-template-columns:1fr; gap:8px; } .service-intro-actions { width:100%; flex-wrap:wrap; } .service-intro-actions .button { flex:1 1 140px; } .notice-section { padding-top:54px; padding-bottom:54px; } .footer-inner { align-items:flex-start; flex-direction:column; } .public-footer nav { justify-content:flex-start; } }
