@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&family=Outfit:wght@600;700;800&display=swap');:root{--ink:#071a2c;--lime:#d9f45a;--coral:#ff6848;--paper:#f7f7f4;--line:#d7d9d5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:'Noto Sans KR',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}body>header{height:104px;padding:0 4vw;display:flex;align-items:center;border-bottom:1px solid var(--line);background:#fff}.brand{font-size:37px;font-weight:900;letter-spacing:-3px;white-space:nowrap}.brand b{color:#799000}.back{margin-left:auto;border:1px solid;padding:10px 17px;border-radius:50px;font-size:12px}main article{padding-top:90px}.article-head{width:min(1020px,calc(100% - 40px));margin:auto}.article-head>span{color:var(--coral);font:700 12px Outfit;letter-spacing:2px}.article-head h1{font-size:clamp(39px,5vw,72px);line-height:1.25;letter-spacing:-4px;margin:18px 0}.article-head>p{font-size:18px;line-height:1.75;color:#56616b;max-width:780px}.meta{display:flex;align-items:center;gap:12px;margin:35px 0 55px;font-size:12px}.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--lime);font:800 11px Outfit}.meta time{margin-left:15px}.meta>span:last-child{margin-left:auto}figure{margin:0 auto;width:min(1300px,100%);height:min(70vw,740px)}figure img{width:100%;height:100%;object-fit:cover}figcaption{font-size:10px;color:#888;margin-top:8px}.article-layout{width:min(1020px,calc(100% - 40px));margin:90px auto 120px;display:grid;grid-template-columns:minmax(0,680px) 240px;gap:80px}.body{font-size:17px;line-height:2;color:#28333e}.body .lead{font-size:21px;font-weight:600;line-height:1.8}.body h2{font-size:28px;margin:60px 0 15px;letter-spacing:-1px}.body blockquote{margin:50px 0;padding:35px;border-left:5px solid var(--lime);background:#edf4ce;font-size:22px;font-weight:700;line-height:1.65}.article-layout aside{border-left:1px solid var(--line);padding-left:30px}.share{display:flex;flex-direction:column;gap:8px;position:sticky;top:25px}.share>b{font:700 10px Outfit;letter-spacing:2px;margin-bottom:6px}.share button{border:1px solid var(--line);background:white;padding:10px;font-size:11px}.report{background:var(--coral);color:white;padding:22px;margin-top:35px;display:flex;flex-direction:column}.report b{font-size:18px;margin:12px 0 25px}.report a{font-size:11px}.related{background:#0b2b4c;color:white;padding:90px max(30px,calc((100vw - 1200px)/2))}.section-title small{color:var(--lime);font:700 10px Outfit;letter-spacing:2px}.section-title h2{font-size:36px;margin:8px 0 35px}.related>div:last-child{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.related a img{width:100%;height:240px;object-fit:cover}.related a small{display:block;color:var(--lime);margin-top:13px}.related a h3{font-size:18px;line-height:1.5}.article-nav{display:grid;grid-template-columns:1fr auto 1fr;padding:35px max(30px,calc((100vw - 1100px)/2));align-items:center}.article-nav a{font-size:13px}.article-nav a:nth-child(2){border:1px solid;border-radius:50px;padding:9px 16px}.article-nav a:last-child{text-align:right}body>footer{background:var(--ink);color:white;padding:60px 5vw;display:flex;align-items:end}body>footer p{margin-left:auto;font-size:11px;color:#9aa6b2}
@media(max-width:700px){body>header{height:70px;padding:0 15px}.brand{font-size:24px;letter-spacing:-2px}.back{font-size:10px;padding:8px 11px}main article{padding-top:55px}.article-head{width:calc(100% - 30px)}.article-head h1{font-size:36px;letter-spacing:-2px}.article-head>p{font-size:15px}.meta{margin:28px 0 35px}.meta>span:last-child{display:none}figure{height:62vw}figcaption{padding-left:10px}.article-layout{width:calc(100% - 32px);display:block;margin:65px auto 80px}.body{font-size:16px;line-height:1.9}.body .lead{font-size:19px}.body h2{font-size:24px}.body blockquote{font-size:19px;margin:40px 0;padding:25px}.article-layout aside{border:0;padding:0;margin-top:60px}.share{position:static;display:grid;grid-template-columns:1fr 1fr}.share>b{grid-column:1/3}.related{padding:65px 15px}.related>div:last-child{display:flex;overflow:auto;gap:10px}.related a{min-width:210px}.related a img{height:150px}.article-nav{padding:28px 15px;font-size:11px}body>footer{display:block;padding:45px 15px}body>footer p{margin-top:25px}}
