/* =====================================================================
   떠나셈 공통 디자인 체계 (모든 페이지 공통 · 각 페이지 CSS 뒤에 로드)
   글꼴: 본문·UI = Wanted Sans  /  제목 = Noto Serif KR
   색: 잉크 #0F1A2E · 브랜드 블루 #1450F0 · 선택 상태는 검정 채움 대신 블루 틴트
   ===================================================================== */
:root{
  --ink:#0F1A2E; --ink-2:#273142; --sub:#4B5565; --faint:#6B7280;
  --line:#E6E8ED; --line-2:#D5DAE2; --surface:#F6F7F9; --bg:#FFFFFF;
  --blue:#1450F0; --blue-press:#0E3FC4; --blue-tint:#EEF3FF; --blue-edge:#C7D6FF;
  --hot:#C8371F; --hot-tint:#FCEEEA; --free:#0E7A4D; --free-tint:#E6F4EC;
  --brand:#E0601C;
  --r-img:8px; --r-ctl:10px;
  --sans:"Wanted Sans Variable","Wanted Sans",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --serif:"Noto Serif KR","Nanum Myeongjo","AppleMyungjo",serif;
}

/* ---------- 바탕 ---------- */
html{scrollbar-color:#C9CED8 transparent;scrollbar-width:thin}
body{font-family:var(--sans);font-size:16.5px;line-height:1.65;letter-spacing:-0.006em;color:var(--ink);
  font-feature-settings:"ss01" off;text-rendering:optimizeLegibility;word-break:keep-all;overflow-wrap:anywhere}
::selection{background:#D3E0FF;color:var(--ink)}
input,select,textarea{caret-color:var(--blue)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.num,table,.result .big,.kv dd,.pager{font-variant-numeric:tabular-nums}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#CDD2DB;border-radius:10px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

/* ---------- 제목 체계 (명조) ---------- */
.vh h1,.sh h2,.slide h2,.sheet h2,.calbar h2,.rhead h2,
.layout h1,.ev h1,.doc h1,.tv-hero h1,.tv-post h1,.tv-body h2,article h2,.doc h2{
  font-family:var(--serif);font-weight:700;letter-spacing:-0.025em;color:var(--ink)}
.vh h1{font-size:36px;line-height:1.25}
.vh h1 small{font-family:var(--sans);font-size:17px;font-weight:600;color:var(--faint);margin-left:10px;letter-spacing:0}
.vh p{font-size:14.5px;color:var(--faint)}
.layout h1,.ev h1,.doc h1{font-size:34px;line-height:1.3;margin-top:10px}
.tv-post h1{font-size:36px;line-height:1.32}
article h2,.doc h2{font-size:22px;line-height:1.4}
.calbar h2{font-size:26px}
.sheet h2{font-size:24px;line-height:1.35}
.slide h2{font-size:30px;line-height:1.3;letter-spacing:-0.03em}
@media (max-width:760px){
  .vh h1{font-size:28px}.layout h1,.ev h1,.doc h1{font-size:27px}.tv-post h1{font-size:28px}
  .slide h2{font-size:20px}.calbar h2{font-size:22px}
}

/* ---------- 머리글 ---------- */
.top{background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(12px)}
.top .wrap{height:68px}
.nav a{font-size:16.5px;font-weight:600;color:var(--ink-2);letter-spacing:-0.015em;padding:0 14px}
.nav a:hover{color:var(--ink)}
.nav a.on{color:var(--blue);font-weight:700}
.nav a.on::after{left:14px;right:14px;height:2px;border-radius:0}
.regbtn{height:40px;padding:0 12px 0 11px;border-radius:999px;background:#fff;border:1px solid var(--line-2);color:var(--ink);font-size:15px;font-weight:600}
.regbtn:hover{background:var(--surface);border-color:#C3C9D3}
.regbtn .lb{font-size:13px;font-weight:500;color:var(--faint)}

/* ---------- 섹션 제목 ---------- */
.sh{margin:72px 0 22px;padding-top:0;border-top:0;align-items:baseline}
.sh h2{font-size:26px;line-height:1.3}
.sh h2::before{display:none}
.sh a,.sh button{font-size:14.5px;font-weight:600;color:var(--faint)}
.sh a:hover,.sh button:hover{color:var(--blue)}
@media (max-width:760px){.sh{margin-top:52px}.sh h2{font-size:22px}}

/* ---------- 선택 칩 · 필터 (검정 채움 제거) ---------- */
.chip{height:38px;padding:0 15px;border:1px solid var(--line);font-size:14.5px;font-weight:500;color:var(--sub);background:#fff}
.chip:hover{border-color:var(--line-2);color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--blue-tint);border-color:var(--blue-edge);color:var(--blue);font-weight:700}

/* 지역 선택: 회색 상자 → 밑줄 탭 */
.rstrip{background:transparent;border-radius:0;padding:0;gap:2px;border-bottom:1px solid var(--line);margin-bottom:20px}
.rstrip .rl{font-size:13px;font-weight:600;color:var(--faint);padding:0 10px 0 0}
.rstrip .rl .ic{width:15px;height:15px;color:var(--faint)}
.rstrip button{height:46px;padding:0 12px;border-radius:0;font-size:15px;font-weight:500;color:var(--sub);position:relative}
.rstrip button:hover{background:transparent;color:var(--ink)}
.rstrip button small{font-size:12px;font-weight:500;color:var(--faint);margin-left:5px;font-variant-numeric:tabular-nums}
.rstrip button[aria-pressed="true"]{background:transparent;color:var(--ink);font-weight:700}
.rstrip button[aria-pressed="true"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--blue)}
.rstrip button[aria-pressed="true"] small{color:var(--blue)}
@media (max-width:760px){.rstrip{margin:0 -20px 16px;padding:0 14px}}

/* 지역 시트 */
.rlist button{height:60px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:600}
.rlist button:hover{border-color:var(--line-2)}
.rlist button[aria-pressed="true"]{background:var(--blue-tint);border-color:var(--blue-edge);color:var(--blue)}
.rlist button[aria-pressed="true"] small{color:var(--blue)}

/* 페이지 번호 */
.pager button{font-weight:500}
.pager button[aria-current="page"]{background:var(--blue-tint);color:var(--blue);font-weight:700;border-color:var(--blue-edge)}

/* ---------- 버튼 ---------- */
.btn{border-radius:10px;font-weight:600;letter-spacing:-0.01em}
.btn-dark{background:var(--blue);color:#fff}.btn-dark:hover{background:var(--blue-press)}
.acts2 .btn-blue{background:#fff;color:var(--blue);border:1px solid var(--blue-edge)}
.acts2 .btn-blue:hover{background:var(--blue-tint)}
.btn-line{border-color:var(--line-2)}

/* ---------- 뱃지 ---------- */
.badge{height:22px;padding:0 7px;border-radius:4px;font-size:12px;font-weight:600;letter-spacing:0}
.b-hot{background:var(--hot);color:#fff}
.b-dark{background:rgba(15,26,46,.72);color:#fff}
.b-free{background:var(--free-tint);color:var(--free)}

/* ---------- 카드 ---------- */
.pc .kind,.lc .when{font-size:12.5px;font-weight:600;color:var(--blue);letter-spacing:0}
.pc h3,.lc h3{font-size:16px;font-weight:600;line-height:1.45;letter-spacing:-0.015em;min-height:2.9em}
.pc .meta,.lc p{font-size:13.5px;color:var(--sub)}
.pc .meta2{font-size:13px}
.pc:hover h3,.lc:hover h3{color:var(--blue)}
.noimg{background:linear-gradient(160deg,#2A4FB8,#0F1A2E);font-family:var(--serif);font-weight:700}

/* ---------- 홈: 배너 · 바로가기 ---------- */
.hello{font-size:14.5px;color:var(--faint);margin-bottom:12px}
.hello b{font-weight:600;color:var(--ink-2)}
.slide{border-radius:14px}
.hero-track{border-radius:14px}
.slide .go{border-radius:8px;font-weight:600}
.hero-ctl span{font-weight:600}

/* 카테고리: 색 상자 카드 → 가는 선으로 나눈 목차 */
.cats{gap:0;margin-top:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cat{gap:14px;padding:22px 20px;border-radius:0;background:transparent;border-left:1px solid var(--line)}
.cat:first-child{border-left:0;padding-left:4px}
.cat:hover{background:var(--surface)}
.cat .ci{width:auto;height:auto;border-radius:0;background:none!important;color:var(--blue)}
.cat .ci .ic{width:26px;height:26px;stroke-width:1.7}
.cat b{font-size:18px;font-weight:700;letter-spacing:-0.02em}
.cat span{font-size:13.5px;color:var(--faint);margin-top:2px}
@media (max-width:760px){
  .cats{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:22px}
  .cat{padding:16px 12px;border-left:0;border-top:1px solid var(--line)}
  .cat:nth-child(-n+2){border-top:0}
  .cat:nth-child(even){border-left:1px solid var(--line)}
  .cat:first-child{padding-left:12px}
  .cat b{font-size:16px}
}

/* 날짜·지역 한 줄 */
.pp{background:#fff;border:1px solid var(--blue-edge);font-weight:700;font-size:15.5px;height:36px;border-radius:8px}
.pp:hover{background:var(--blue-tint)}
.pick{font-size:15.5px;font-weight:500}
.psum .n{font-weight:700}

/* 생활 툴 아이콘 */
.tq{font-weight:500;color:var(--ink-2)}
.tq i,.tool .ti{background:#fff;border:1px solid var(--line);color:var(--blue)}
.tq:hover i,.tool:hover .ti{border-color:var(--blue-edge);background:var(--blue-tint)}
.tool{border-radius:12px}
.tool b{font-weight:700;font-size:17px}

/* ---------- 달력 ---------- */
.calgrid{border-radius:10px}
.calgrid .wd{background:#fff;font-weight:600;font-size:13px;color:var(--faint)}
.cd .dn{font-weight:700}
.cd.today .dn b{background:var(--blue)}
.cd[aria-pressed="true"]{box-shadow:inset 0 0 0 1.5px var(--blue);background:#F7F9FF}
.cd .ev{font-weight:500;border-radius:3px}
.cd .ev.f{background:#FFF4ED;color:#9A3E14}
.cd .ev.s{background:#F0F4FF;color:#1C44B5}
.dayp{border-radius:12px}
.dayp h3{font-family:var(--serif);font-weight:700;letter-spacing:-0.02em}
.calbar .nb,.calbar .tb{border-color:var(--line-2)}

/* ---------- 상세 시트 ---------- */
dialog.sheet{border-radius:16px}
.sheet .stay a{border-radius:8px;font-weight:500}

/* ---------- 생활 툴 페이지 ---------- */
.tabs a{height:38px;font-size:14.5px;font-weight:500}
.tabs a.on{background:var(--blue-tint);border-color:var(--blue-edge);color:var(--blue);font-weight:700}
.card{border-radius:14px}
.in{border:1px solid var(--line-2);border-radius:10px}
.in:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #E1E9FF}
.f label,.lab{font-size:14.5px;font-weight:600;color:var(--ink-2)}
.result{border-radius:14px}
.result .big{font-weight:700;letter-spacing:-0.03em}
.kv dd{font-weight:700}
article{border-top:1px solid var(--line);padding-top:28px}
article p,article li{color:#2A3343}
aside h3{font-family:var(--sans);font-size:14px;font-weight:700;color:var(--faint);letter-spacing:0}
aside li a{font-weight:600;font-size:16px}
.tlist a{border-radius:12px}
.tlist b{font-weight:700}

/* ---------- 행사 상세 · 안내 · 여행기 ---------- */
.ev-badges span{border-radius:4px;font-weight:600;font-size:12.5px}
.ev-links a{border-radius:8px;font-weight:500;border-color:var(--line-2)}
.ev-sec h2{font-family:var(--serif);font-weight:700;letter-spacing:-0.02em;font-size:19px}
.ev-sec h2 small{font-family:var(--sans)}
.doc-nav a{border-radius:6px;font-weight:500}
.doc .card{border-radius:10px}

/* ---------- 바닥글 ---------- */
.dir h2{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--ink-2)}
footer{color:var(--faint)}
footer .links a{font-weight:500}

/* 확인 후 보정 */
.slide h2{color:#fff}
@media (max-width:760px){
  .pick .pt{display:none}
  .pick .psum{flex-basis:100%;font-size:14.5px;color:var(--sub)}
}
.tq i{background:none!important;border:0!important;width:auto;height:28px}
.tq{border:1px solid var(--line);border-radius:10px;padding:16px 6px 14px}
.tq:hover{border-color:var(--blue-edge);background:#fff;color:var(--blue)}

/* 로고: 사용자 제공 원본 이미지 */
.brand{flex:none}
.brand img.logo{width:auto;height:36px;display:block}
@media (max-width:640px){.brand img.logo{height:30px}}

/* 아이와 함께 */
.ev-badges .kid{background:#FFF1E6!important;color:#B4470E!important;border-color:#F3C2A5!important}
.ev-sec p.ov{font-size:16px;line-height:1.85;color:#2A3343;margin:0 0 12px;word-break:keep-all}

/* ---------- 모바일 조판 (생활 툴·지역·상세 공통) ---------- */
.layout h1,.rg-hero h1{font-family:var(--serif);font-weight:700;letter-spacing:-0.025em}
.result .big{overflow-wrap:normal}
@media (max-width:640px){
  .crumb{font-size:13.5px}
  .lead{font-size:15.5px;line-height:1.7;margin-bottom:18px}
  .tabs{margin:0 -20px 18px;padding:0 20px 2px}
  .tabs a{height:36px;padding:0 13px;font-size:14px}
  .card{padding:18px 16px}
  .f label,.lab{font-size:14px;margin-bottom:6px}
  .in{height:50px;padding:0 13px}
  .in input,.in select{font-size:17px}
  .seg{display:flex;width:100%}
  .seg button{flex:1;height:40px;padding:0 10px;font-size:14.5px}
  .result{padding:20px 18px;margin-top:16px}
  .result .k{font-size:14px}
  .result .big{font-size:26px;line-height:1.3}
  .result .big small{font-size:16px}
  .result .sub{font-size:14.5px}
  .kv{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
  .kv div{padding:11px 12px}
  .kv dt{font-size:12.5px}
  .kv dd{font-size:16px;line-height:1.4}
  table.t{display:table;font-size:14px;margin-top:14px}
  table.t th,table.t td{padding:10px 9px;white-space:normal;word-break:keep-all}
  table.t th{font-size:12.5px}
  table.t td.n,table.t th.n{white-space:nowrap}
  table.t:has(thead th:nth-child(4)){display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.t:has(thead th:nth-child(4)) th,table.t:has(thead th:nth-child(4)) td{white-space:nowrap}
  .acts .btn-sm{height:36px;font-size:14px}
  article{margin-top:44px}
  article h2{font-size:20px;margin:28px 0 10px}
  article p,article li{font-size:16px;line-height:1.75}
  .formula{font-size:14.5px;padding:14px 15px}
  details.faq summary{font-size:16px}
  body .rg-hero{padding-top:22px}
  body .rg-hero h1{font-size:25px;line-height:1.35}
  body .rg-sum{font-size:15.5px;line-height:1.8}
}