/* 산 소개 페이지(/m/ - MountainServlet) - 안내(about.html)와 같은 색 */
:root { --bg:#11161d; --panel:#1a212b; --tx:#e9eef4; --dim:#9aa6b4; --ln:rgba(255,255,255,0.12); --sky:#38d9ea; }
* { box-sizing:border-box; }
html, body { margin:0; background:var(--bg); color:var(--tx); font-family:Arial,"Malgun Gothic",sans-serif; line-height:1.6; }
main { max-width:760px; margin:0 auto; padding:calc(env(safe-area-inset-top) + 18px) 16px calc(env(safe-area-inset-bottom) + 40px); }
h1 { font-size:24px; margin:0 0 4px; }
h1.idx { font-size:min(24px, 5.6vw); word-break:keep-all; }   /* 코스 모음 제목 - 360px 에서도 한 줄(한/EN · 가 는 설명 줄로) */
h2 { font-size:17px; margin:0 0 8px; }
a { color:var(--sky); }
.crumb { margin:0 0 6px; font-size:13.5px; }
.lead { color:var(--dim); font-size:14px; margin:0 0 16px; }
.dim { color:var(--dim); font-size:13px; }
section { background:var(--panel); border:1px solid var(--ln); border-radius:12px; padding:14px 16px; margin-bottom:14px; }
#wxBody b { display:block; margin-bottom:4px; }
#wxBody div { font-size:14px; }
ul { margin:0; padding:0; list-style:none; }
.cs li { border-top:1px solid var(--ln); padding:10px 0; display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; }
.cs li:first-child { border-top:0; }
.cs b { flex:1 1 100%; font-size:15px; }
.cs b, .cs span, .cs small { min-width:0; overflow-wrap:anywhere; }   /* 띄어쓰기 없는 긴 이름(Seoraksandaecheongbong…)도 줄바꿈 - 글자 140% 가로 넘침(2026-10-17 PC) */
.cs span { font-size:13.5px; color:var(--dim); }
.cs .go { margin-left:auto; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.cs .go a { text-decoration:none; font-size:13.5px; padding:4px 10px; border:1px solid var(--ln); border-radius:14px; }
.ms { display:flex; flex-wrap:wrap; gap:8px; }
.ms a { display:inline-block; text-decoration:none; color:var(--tx); font-size:14px; padding:6px 11px; border:1px solid var(--ln); border-radius:16px; }
.brand { margin-top:18px; font-size:15px; font-weight:bold; }
.copy { margin:10px 0 0; font-size:11.5px; color:var(--dim); }   /* © 2026 홍TV · routefly */
.support { margin:14px 0 0; }
.support a { display:inline-block; padding:8px 14px; border-radius:10px; background:#2f9e44; color:#fff; text-decoration:none; font-weight:bold; }
.brand span { color:#ffb703; }
/* 글자 크기(RF.textButton) */
.rfz main { zoom: var(--rfz); }
.rfTextBtn { min-width:44px; height:32px; padding:0 8px; border-radius:16px; border:1px solid var(--ln); background:rgba(255,255,255,0.06); color:var(--tx);
             font:bold 13px Arial,"Malgun Gothic",sans-serif; cursor:pointer; }
/* 로고(img/logo-dark.svg) - 목록 맨 위 · 페이지 아래 "열기" */
.logo { display:inline-block; margin:0 0 8px -6px; }
.logo img { display:block; width:256px; max-width:66vw; height:auto; }
.logoRow { display:flex; align-items:center; justify-content:space-between; gap:8px; }   /* 로고 + 따라가기 ›(2026-10-17) */
.logoRow .logo { flex:0 1 auto; min-width:0; }   /* 따라가기 › 자리를 먼저 - 로고가 줄어듦(글자 140% 에서 넘쳤음, 2026-10-17 PC) */
.logoRow .logo img { display:block; max-width:100%; height:auto; }
.goHike { flex:0 0 auto; display:inline-flex; align-items:center; height:38px; padding:0 14px; border-radius:19px; box-sizing:border-box;
          border:1px dashed rgba(255,255,255,0.35); color:var(--tx); font-size:14px; text-decoration:none; white-space:nowrap; }
.brand a { display:inline-flex; align-items:center; gap:6px; text-decoration:none; }
.brand img { width:160px; height:auto; }
/* ☆ 찜 · 가까운 산 거리(2026-10-15) */
.rfFavBtn { background:none; border:1px solid var(--ln); border-radius:14px; color:var(--dim); font-size:15px; line-height:1; padding:3px 9px; cursor:pointer; }
.rfFavBtn.on { color:#ffd43b; border-color:#ffd43b; }
.ms small { color:var(--dim); font-size:12px; }
.gear li { border-top:1px solid var(--ln); padding:8px 0; display:flex; flex-wrap:wrap; gap:2px 10px; align-items:baseline; font-size:14px; }
.gear li:first-child { border-top:0; }
/* 첫 줄은 이름 + 쿠팡 링크(오른쪽), 그 아래 한 줄 전체에 설명(2026-10-15 홍TV님: 핸드폰에서 설명이 꺾이고 링크가 따로 떨어졌음) */
.gear b { flex:0 0 auto; order:0; }
.gear .gl { flex:0 0 auto; margin-left:auto; display:flex; gap:10px; order:1; }
.gear span { color:var(--dim); font-size:13px; flex:1 1 100%; min-width:0; order:2; }
.gear a { text-decoration:none; font-size:13px; white-space:nowrap; }
/* 목록(/m/) 등산 · 걷기 · 자전거 접는 칸 - 도장 · 완주(series.html)와 같은 모양, <details>(2026-10-15 홍TV님) */
.folds { margin-bottom:14px; }
.fold > summary { list-style:none; display:flex; align-items:center; gap:8px; padding:12px 4px; border-bottom:1px solid var(--ln); cursor:pointer; }
.fold > summary::-webkit-details-marker { display:none; }
.fold .ft { flex:0 1 auto; min-width:0; font-weight:bold; word-break:keep-all; overflow-wrap:anywhere; }   /* 큰 글자 · 좁은 화면에서 줄바꿈(2026-10-17 PC: 140% 에서 가로 넘침) */
.fold .fs { flex:1; min-width:0; font-size:12.5px; color:var(--dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fold .fa { flex:0 0 auto; color:var(--dim); transition:transform .15s; }
.fold[open] > summary .fa { transform:rotate(180deg); }
.fold.kind > summary .ft { font-size:17px; }
.fold.kind > .fb { margin-left:10px; padding-left:12px; border-left:2px solid rgba(56,217,234,0.35); }
.fold.group > summary { padding:10px 4px; }
.fold.group > summary .ft { font-size:14.5px; color:#d6dde6; }
.fold.group > .ms { padding:10px 0 8px; }
/* 날씨 날짜 고르기(2026-10-15) */
.days { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 10px; }
.days button { padding:6px 10px; border-radius:14px; border:1px solid var(--ln); background:rgba(255,255,255,0.04); color:var(--tx); font:13px Arial,"Malgun Gothic",sans-serif; cursor:pointer; }
.days button.on { background:var(--sky); border-color:var(--sky); color:#062b30; font-weight:bold; }
.days select { color-scheme:dark; padding:6px 10px; border-radius:14px; border:1px solid var(--ln); background:rgba(255,255,255,0.04); color:var(--tx); font:13px Arial,"Malgun Gothic",sans-serif; cursor:pointer; }
.days select.on { background:var(--sky); border-color:var(--sky); color:#062b30; font-weight:bold; }
.days select option { background:var(--panel); color:var(--tx); font-weight:normal; }
.cs li[hidden] { display:none; }
/* 산불조심기간 · 일출 산행(2026-10-15) */
.fire { margin:-6px 0 14px; padding:8px 12px; border-radius:10px; background:rgba(255,120,60,0.12); border:1px solid rgba(255,120,60,0.35); color:#ffc9a8; font-size:13.5px; }
.cs .sunrise { flex:1 1 100%; color:var(--dim); font-size:12.5px; }
/* 이번 주말 날씨 좋은 곳(/m/ - 2026-10-15) */
#weekend { padding:4px 16px; }
.fun { margin:14px 0 4px; padding:12px 14px; border:1px dashed var(--ln); border-radius:12px; }   /* 🔮 재미로 보는 한마디(2026-10-17) */
.fun .fl { font-size:16px; margin:4px 0; }
.fun small { color:var(--dim); }
.anbuLink { display:block; margin:10px 0 4px; padding:12px 14px; border-radius:12px; background:rgba(74,222,128,0.10); border:1px solid rgba(74,222,128,0.45);
            color:var(--tx); text-decoration:none; font-weight:bold; font-size:16px; }   /* 🏠 오늘의 안부(2026-10-18) - 한마디 아래 */
.toolLink { background:rgba(56,217,234,0.10); border-color:rgba(56,217,234,0.45); }   /* 🧰 별거 별거(2026-10-18) - 안부 아래 */
.anbuLink small { display:block; font-weight:normal; font-size:13px; color:var(--dim); margin-top:2px; }
#weekend .fb { padding:4px 0 10px; }
#weekend .wday { margin:10px 0 4px; font-size:14px; }
#weekend .wreg { margin:6px 0 10px; font-size:13.5px; color:var(--dim); }
#weekend .wreg .ms { margin-top:6px; }
/* 자주 묻는 질문 · 내 근처 산(2026-10-15) */
.faq dt { font-weight:bold; font-size:14.5px; margin-top:10px; }
.faq dd { margin:4px 0 0; color:var(--dim); font-size:13.5px; }
#near { padding:4px 16px; }   /* 📍 내 근처 - 주말 칸과 같은 접는 칸(2026-10-16) */
#near .fb { padding:4px 0 10px; }
#nearList { margin-top:4px; }
/* 운영 통계(/stats - 2026-10-15) */
.st { width:100%; border-collapse:collapse; font-size:13.5px; }
.st th, .st td { text-align:left; padding:5px 6px; border-top:1px solid var(--ln); }
/* 영어 산 페이지 안전 안내(2026-10-15) */
.tips { margin: 0; padding-left: 1.2em; font-size: 0.92rem; line-height: 1.55; }
.tips li { margin: 0.35em 0; list-style: disc; }
/* 오른쪽 위 한/EN · 글자 크기(2026-10-15 홍TV님) */
.rfTools { float:right; display:inline-flex; gap:6px; align-items:center; margin-left:8px; }
.rfLang { display:inline-flex; height:32px; border:1px solid var(--ln); border-radius:16px; overflow:hidden; text-decoration:none;
          font:bold 13px Arial,"Malgun Gothic",sans-serif; }
.rfLang span { display:inline-flex; align-items:center; padding:0 9px; color:var(--dim); background:rgba(255,255,255,0.06); }
.rfLang span.on { color:#0b1118; background:var(--sky); }
/* 📥 신호 없을 때 보기(오프라인 저장 - 2026-10-15) */
.offline button { height:36px; padding:0 14px; border-radius:18px; border:1px solid var(--sky); background:rgba(56,217,234,0.12); color:var(--tx); font:bold 14px Arial,"Malgun Gothic",sans-serif; cursor:pointer; }
.offline button:disabled { opacity:0.6; }
/* 난이도 · 📈 고도(공단 탐방로 안내판처럼 - 2026-10-15) */
.cs .go button.boardBtn { font-size:13.5px; padding:4px 10px; border:1px solid var(--ln); border-radius:14px; background:none; color:var(--sky); cursor:pointer; }
.cs .go button.boardBtn.on { background:rgba(56,217,234,0.15); }
.cs li .board { flex-basis:100%; width:100%; margin-top:8px; }   /* 모양은 course-kit.css .rfBoardBox · .rf-board · .lv(산 페이지도 읽음 - 2026-10-16 겹침 정리) */
/* 🕘 최근 본 산 · ⚖️ 코스 견주기(2026-10-16) */
#recent { padding:4px 16px; }
#recent .fb { padding:4px 0 10px; }
.cs .go button.cmpBtn { font-size:13.5px; padding:4px 10px; border:1px solid var(--ln); border-radius:14px; background:none; color:var(--tx); cursor:pointer; }
.cs .go button.cmpBtn.on { border-color:#ffb703; background:rgba(255,183,3,0.15); }
.cmp { margin:8px 0 12px; padding:10px; border:1px solid #ffb703; border-radius:12px; background:rgba(255,183,3,0.06); }
.cmp .dim { margin:0; }
.cmpHead { display:flex; justify-content:space-between; align-items:center; font-weight:bold; margin-bottom:6px; }
.cmpClose { background:none; border:1px solid var(--ln); border-radius:12px; color:var(--tx); width:30px; height:28px; cursor:pointer; }
.cmpT { width:100%; border-collapse:collapse; font-size:13.5px; table-layout:fixed; }
.cmpT th, .cmpT td { padding:5px 4px; border-top:1px solid var(--ln); text-align:left; vertical-align:top; word-break:keep-all; }
.cmpT tr:first-child th { border-top:0; }
.cmpT th { color:var(--dim); font-weight:normal; width:28%; }
.cmpT th.a, .cmpT th.b { color:var(--tx); font-weight:bold; width:auto; }
.cmpCap { margin:10px 0 4px; font-weight:bold; font-size:13.5px; }
/* 🧗 가파른 산 순위(SteepRank - 2026-10-18 홍TV님): 3칸(# · 산 · 수치) - 360px · 가++ · 영어에서도 안 잘리게, 높이 · 코스는 이름 아래 · 경사 · 1km 는 각도 아래 */
#steep .fb { padding:4px 0 10px; margin-left:0; padding-left:0; border-left:0; }   /* 표가 넓게 - 접는 칸 들여쓰기 없이 */
.stF > .stWrap { padding:4px 0 10px; }   /* 표마다 접는 칸(2026-10-18 홍TV님) */
.stWrap { overflow-x:auto; }
.stT { width:100%; border-collapse:collapse; font-size:13.5px; }
.stT th, .stT td { padding:6px 4px; border-top:1px solid var(--ln); text-align:left; vertical-align:top; word-break:keep-all; }
.stT small { overflow-wrap:anywhere; }   /* 산 이름은 통째로, 높이 · 코스 줄만 아무 데서나 줄바꿈 */
.stT small.cr { color:var(--tx); opacity:.8; }
.stT td.n b { display:block; font-size:14.5px; }
.stT td.n small { margin-top:2px; }
.stT td.n small.s1 { color:#ffb703; }   /* 가장 가파른 1km */
.stT th { color:var(--dim); font-weight:normal; font-size:12px; border-top:0; }
.stT .n { text-align:right; width:5.6em; }   /* "경사 41.2%" 가 한 줄로 - 좁으면(가++ · 영어) 줄바꿈 */
.stT td.n b { white-space:nowrap; }
.stT .rk { color:var(--dim); width:1.6em; }
.stT a { font-weight:bold; }
.stT small { display:block; font-size:12px; color:var(--dim); margin-top:1px; }
/* ⛑️ 오늘의 산행 안전(별거 별거 tools.html 의 .wl · .sfl 과 같게 - 2026-10-18) */
#safe .wl { list-style:none; margin:6px 0 0; padding:0; font-size:15px; }
#safe .wl li { display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px solid var(--ln); }
#safe .wl li b { font-variant-numeric:tabular-nums; white-space:nowrap; }
#safe .wl li span { min-width:0; overflow-wrap:anywhere; }
#safe .wl li small { color:var(--dim); }
#safe .sfl li span { flex:0 1 auto; min-width:4.6em; word-break:keep-all; }   /* 이름은 낱말 단위로만 줄바꿈(가++ 에서 값이 세로로 깨졌음 - 2026-10-18) */
#safe .sfl li b { flex:1 1 0; min-width:4.6em; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; text-align:right; }
#safe .sfl li.bad span { color:#ff8787; font-weight:bold; }
#safe .sfl li.mid span { color:#ffd43b; }
#safe h3 { font-size:15px; margin:14px 0 0; }
/* 11위부터는 접어 둠(SteepRank.more - 표 안 단추 줄, 2026-10-18 홍TV님 "전체") */
.stT:has(.stMore:not([open])) .stRest { display:none; }
.stT tr.stMoreRow td { border-top:1px solid var(--ln); padding:8px 4px; text-align:center; }
.stMore > summary { list-style:none; cursor:pointer; color:var(--sky); font-weight:bold; font-size:14px; }
.stMore > summary::-webkit-details-marker { display:none; }
.stMore > summary::after { content:" ▾"; }
.stMore[open] > summary::after { content:" ▴"; }
/* ⛔ 정상 통제(대암산 - mountains100.json closed, 2026-10-18) */
.closedNote { margin:8px 0 12px; padding:10px 12px; border-radius:10px; background:rgba(255,135,135,0.10); border:1px solid rgba(255,135,135,0.45); font-size:14.5px; }
#gearIdx .fb { padding:4px 0 10px; }   /* 🎒 이번 달 산행 챙길 것(/m/ - 2026-10-18) */