/* ===== info-page1.html ===== */
body.page-info-page-1 nav a.current{color:var(--tangerine);}
body.page-info-page-1 .mega-col strong{display:block; font-size:1.9rem; font-weight:800; color:var(--ink); margin-bottom:14px;}
body.page-info-page-1 .mega-col a.current{color:var(--tangerine);}
body.page-info-page-1 .nav-dropdown a.current{color:var(--tangerine-deep); font-weight:700;}
body.page-info-page-1 .guide{padding:70px 0 100px;}
body.page-info-page-1 .flow-section{
background:#fff; border:1px solid #EBE5DF; border-radius:14px;
padding:34px 28px 28px; margin-bottom:32px;
}
body.page-info-page-1 .flow-head{display:flex; align-items:baseline; gap:12px; margin-bottom:32px;}
body.page-info-page-1 .flow-head h2{font-size:2.4rem; font-weight:800; letter-spacing:-0.01em;}
body.page-info-page-1 .flow-head span{font-size:1.35rem; color:var(--text-muted); font-weight:600;}
body.page-info-page-1 .flow{display:flex; align-items:stretch; gap:0;}
body.page-info-page-1 .flow-step{flex:1; min-width:0; text-align:center; display:flex; flex-direction:column;}
body.page-info-page-1 .flow-title{display:flex; align-items:center; justify-content:center; gap:7px; margin-bottom:16px;}
body.page-info-page-1 .flow-num{
width:22px; height:22px; border-radius:50%; flex:0 0 22px;
background:var(--basalt); color:#fff;
font-size:1.2rem; font-weight:800;
display:flex; align-items:center; justify-content:center;
}
body.page-info-page-1 .flow-title h3{font-size:1.7rem; font-weight:800; letter-spacing:-0.01em;}
body.page-info-page-1 .flow-icon{
width:96px; height:96px; margin:0 auto 18px; border-radius:50%;
background:var(--wave); border:1.5px solid var(--line);
display:flex; align-items:center; justify-content:center;
}
body.page-info-page-1 .flow-icon svg{width:46px; height:46px;}
body.page-info-page-1 .flow-step.book .flow-icon{color:var(--sea);}
body.page-info-page-1 .flow-step.pick .flow-icon{color:var(--hallasan-mint);}
body.page-info-page-1 .flow-desc{
margin-top:auto; background:var(--wave); border-radius:10px;
padding:14px 10px; font-size:1.5rem; color:var(--text-body); line-height:1.65;
word-break:keep-all; overflow-wrap:break-word;
}
body.page-info-page-1 .flow-desc b{color:var(--ink); font-weight:700;}
/* 2026-09-06 — 모바일에서만 쓰는 줄바꿈. PC 에서는 무시됩니다. */
body.page-info-page-1 .mbr{display:none;}
@media (max-width:900px){ body.page-info-page-1 .mbr{display:inline;} }
/* 2026-09-06 — PC 화면에서 1~5번 설명 네모박스 높이를 똑같이 맞춥니다.
flow-body 를 세로 flex 로 만들고 flow-desc 가 남은 높이를 모두 채우게 했습니다. */
@media (min-width:861px){
body.page-info-page-1 .flow-body{flex:1; display:flex; flex-direction:column;}
body.page-info-page-1 .flow-desc{
margin-top:0; flex:1 1 auto;
display:flex; align-items:center; justify-content:center;
}
body.page-info-page-1 .flow-desc .fd-in{width:100%;}
}
body.page-info-page-1 .flow-arrow{
flex:0 0 30px; display:flex; align-items:flex-start; justify-content:center;
color:#A3ADA8; font-size:2.2rem; line-height:1;
padding-top:37px;
}
body.page-info-page-1 .notice{
background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px 26px;
}
body.page-info-page-1 .notice h3{font-size:1.5rem; font-weight:800; margin-bottom:12px;}
body.page-info-page-1 .notice li{
font-size:1.35rem; color:var(--text-body); margin-bottom:13px; line-height:1.75;
list-style:none; padding-left:12px; position:relative;
}
body.page-info-page-1 .notice li:last-child{margin-bottom:0;}
body.page-info-page-1 .notice li::before{content:'·'; position:absolute; left:2px; color:#A9A29B;}
body.page-info-page-1 .notice li b{color:var(--ink); font-weight:700;}
body.page-info-page-1 .notice li b.hl{color:var(--tangerine);}
body.page-info-page-1 .notice li a{color:var(--ink); font-weight:700; text-decoration:underline; text-underline-offset:2px;}
@media (max-width:900px){
/* 2026-09-06 — 모바일에서는 아이콘을 글 위로 올리고 아이콘·번호·제목·설명을 모두
화면 한가운데 축에 맞춥니다. (되돌리려면 flex-direction 을 row 로 바꾸면 됩니다) */
body.page-info-page-1 .flow-head{flex-direction:column; align-items:center; text-align:center; gap:5px; margin-bottom:22px;}
body.page-info-page-1 .flow-head h2{font-size:2.1rem; line-height:1.35; word-break:keep-all;}
body.page-info-page-1 .flow-head span{font-size:1.3rem; line-height:1.5; word-break:keep-all;}
body.page-info-page-1 .flow{flex-direction:column; gap:0;}
body.page-info-page-1 .flow-step{text-align:center; flex-direction:column; align-items:center; gap:0; padding:16px 0;}
body.page-info-page-1 .flow-icon{width:64px; height:64px; margin:0 auto 12px; flex:0 0 auto;}
body.page-info-page-1 .flow-icon svg{width:32px; height:32px;}
body.page-info-page-1 .flow-body{flex:none; width:100%; min-width:0;}
body.page-info-page-1 .flow-title{justify-content:center; margin-bottom:6px;}
body.page-info-page-1 .flow-desc{margin-top:0; background:none; padding:0; font-size:1.45rem;}
body.page-info-page-1 .flow-arrow{
flex:0 0 auto; width:30px; height:30px; margin:0 auto; padding:0;
align-items:center; justify-content:center;
transform:rotate(90deg);
}
}
@media (max-width:860px){
body.page-info-page-1 .header-bottom{justify-content:center;}
body.page-info-page-1 .flow-section{padding:26px 20px 22px;}
}
/* ===== info-page2.html ===== */
body.page-info-page-2 .mega-col strong{display:block; font-size:1.9rem; font-weight:800; color:var(--ink); margin-bottom:14px;}
body.page-info-page-2 .mega-col a.current{color:var(--tangerine);}
body.page-info-page-2 .nav-dropdown a.current{color:var(--tangerine-deep); font-weight:700;}
body.page-info-page-2 .steps{padding:36px 0 40px;}
/* ── 2026-09-06 : 상단 핵심 요약 카드 ─────────────────────── */
body.page-info-page-2 .quick-sum{padding:28px 0 0;}
body.page-info-page-2 .qs-card{
display:grid; grid-template-columns:repeat(3,1fr);
background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden;
}
body.page-info-page-2 .qs-item{padding:20px 22px; border-left:1px solid var(--line);}
body.page-info-page-2 .qs-item:first-child{border-left:none;}
body.page-info-page-2 .qs-item b{
display:block; font-size:1.35rem; font-weight:700; color:var(--text-muted); margin-bottom:8px;
}
body.page-info-page-2 .qs-item p{
font-size:1.7rem; font-weight:800; color:var(--ink); line-height:1.45;
word-break:keep-all;
}
/* ── 2026-09-06 : 방향별 운행 시간 표 ─────────────────────── */
body.page-info-page-2 .sb-table{width:100%; border-collapse:collapse; margin-bottom:4px;}
body.page-info-page-2 .sb-table th{
font-size:1.3rem; font-weight:700; color:var(--text-muted); text-align:right;
padding:0 0 8px; border-bottom:1px solid var(--line);
}
body.page-info-page-2 .sb-table th:first-child{text-align:left;}
body.page-info-page-2 .sb-table td{
font-size:1.45rem; font-weight:800; color:var(--ink); text-align:right;
padding:11px 0; border-bottom:1px solid #EFE9E4;
}
body.page-info-page-2 .sb-table td:first-child{text-align:left; font-weight:700; color:var(--text-body);}
body.page-info-page-2 .sb-table tbody tr:last-child td{border-bottom:none;}
body.page-info-page-2 .step{
display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;
padding:44px 0; border-bottom:1px solid var(--line);
}
body.page-info-page-2 .step:last-child{border-bottom:none;}
body.page-info-page-2 .step.reverse .step-media{order:2;}
body.page-info-page-2 .step.reverse .step-text{order:1;}
body.page-info-page-2 .step-num{
display:inline-flex; align-items:center; justify-content:center;
width:28px; height:28px; background:var(--basalt); color:#fff;
font-weight:800; font-size:1.4rem; margin-bottom:18px;
}
body.page-info-page-2 .step-text h2{font-size:2.2rem; font-weight:800; margin-bottom:16px; letter-spacing:-0.01em;}
body.page-info-page-2 .step-text p{color:var(--text-body); font-size:1.5rem; margin-bottom:6px;}
body.page-info-page-2 .step-text .highlight, body.page-info-page-2 .sb-text .highlight{
display:inline-block; background:#FFF3E6; color:var(--tangerine-deep);
font-weight:700; padding:2px 6px; border-radius:4px;
}
/* 2026-09-06 — 고정 280px 대신 16:9. 모바일에서도 높이가 화면 폭을 따라갑니다. */
body.page-info-page-2 .step-media img{
width:100%; height:auto; aspect-ratio:16/9; object-fit:cover;
display:block; border-radius:14px; background:var(--wave);
}
body.page-info-page-2 .shuttle-back{background:var(--wave); padding:20px 0 96px;}
body.page-info-page-2 .sb-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center;}
body.page-info-page-2 .sb-text h2{font-size:2.2rem; font-weight:800; margin-bottom:16px; letter-spacing:-0.01em;}
body.page-info-page-2 .sb-text p{color:var(--text-body); font-size:1.5rem; margin-bottom:6px; line-height:1.75;}
body.page-info-page-2 .sb-time{background:#fff; border:1px solid var(--line); border-radius:14px; padding:26px 28px 22px;}
body.page-info-page-2 .sb-time h3{font-size:1.9rem; font-weight:800; margin-bottom:18px; letter-spacing:-0.01em;}
body.page-info-page-2 .sb-row{padding:14px 0; border-top:1px solid #EFE9E4;}
body.page-info-page-2 .sb-row:first-of-type{border-top:none; padding-top:0;}
body.page-info-page-2 .sb-row:last-child{padding-bottom:0;}
body.page-info-page-2 .sb-row b{display:block; font-size:1.45rem; font-weight:800; margin-bottom:6px;}
body.page-info-page-2 .sb-row p{color:var(--text-body); font-size:1.45rem; margin:0;}
body.page-info-page-2 .sb-row ul{margin:10px 0 0; padding:0; list-style:none;}
body.page-info-page-2 .sb-row li{
color:var(--sea); font-size:1.4rem; line-height:1.95;
padding-left:12px; position:relative;
}
body.page-info-page-2 .sb-row li::before{content:'-'; position:absolute; left:0;}
@media (max-width:860px){
body.page-info-page-2 .shuttle-back{padding:8px 0 70px;}
body.page-info-page-2 .sb-grid{grid-template-columns:1fr; gap:24px;}
body.page-info-page-2 .sb-text h2{font-size:2rem;}
body.page-info-page-2 .sb-time{padding:20px 18px 18px;}
body.page-info-page-2 .sb-time h3{font-size:1.7rem; margin-bottom:14px;}
}
@media (max-width:860px){
body.page-info-page-2 .header-bottom{justify-content:center;}
}
@media (max-width:760px){
body.page-info-page-2 .quick-sum{padding:20px 0 0;}
body.page-info-page-2 .qs-card{grid-template-columns:1fr;}
/* 2026-09-06 — 모바일에서는 요약 카드 3칸을 가운데 정렬 */
body.page-info-page-2 .qs-item{padding:14px 18px; border-left:none; border-top:1px solid var(--line); text-align:center;}
body.page-info-page-2 .qs-item:first-child{border-top:none;}
body.page-info-page-2 .qs-item p{font-size:1.6rem;}
body.page-info-page-2 .pc-only{display:none;}
body.page-info-page-2 .step, body.page-info-page-2 .step.reverse{grid-template-columns:1fr; gap:20px;}
body.page-info-page-2 .step.reverse .step-media, body.page-info-page-2 .step.reverse .step-text{order:initial;}
body.page-info-page-2 .step{padding:32px 0 36px; border-bottom:2px solid var(--line);}
body.page-info-page-2 .step-num{width:32px; height:32px; border-radius:50%; font-size:1.5rem; margin-bottom:14px;}
body.page-info-page-2 .step-text h2{font-size:2rem; margin-bottom:12px;}
}
/* ===== info-page3.html ===== */
body.page-info-page-3 .mega-col strong{display:block; font-size:1.9rem; font-weight:800; color:var(--ink); margin-bottom:14px;}
body.page-info-page-3 .mega-col a.current{color:var(--tangerine);}
body.page-info-page-3 .nav-dropdown a.current{color:var(--tangerine-deep); font-weight:700;}
body.page-info-page-3 .location{padding:32px 0 80px;}
body.page-info-page-3 .loc-grid{
display:grid; grid-template-columns:1fr 1.25fr; gap:32px; align-items:stretch;
}
body.page-info-page-3 .loc-info{
background:#fff; border:1px solid #EBE5DF; border-radius:14px;
padding:34px 30px;
}
body.page-info-page-3 .loc-info h2{font-size:2.4rem; font-weight:800; letter-spacing:-0.02em; margin-bottom:8px;}
body.page-info-page-3 .addr{display:flex; align-items:center; flex-wrap:wrap; gap:10px;}
body.page-info-page-3 .addr-t{font-size:1.45rem; color:var(--sea); font-weight:600;}
body.page-info-page-3 .loc-list{margin-top:26px;}
body.page-info-page-3 .loc-item{padding:18px 0; border-top:1px dashed #DDE3E0;}
body.page-info-page-3 .loc-item:first-child{border-top:none; padding-top:0;}
body.page-info-page-3 .loc-item dt{font-size:1.4rem; font-weight:800; color:var(--ink); margin-bottom:7px;}
body.page-info-page-3 .loc-item dd{font-size:1.45rem; color:var(--text-body);}
body.page-info-page-3 .loc-item dd span{display:block; margin-bottom:4px;}
body.page-info-page-3 .loc-item dd span:last-child{margin-bottom:0;}
body.page-info-page-3 .loc-item dd small{color:var(--text-muted); font-size:1.3rem; font-weight:600;}
body.page-info-page-3 .loc-item dd .after-hours{display:block; margin-top:6px; font-size:1.25rem; color:var(--text-muted); font-weight:600;}
body.page-info-page-3 .loc-item dd .after-hours a{color:var(--tangerine); font-weight:800; text-decoration:underline; text-underline-offset:2px;}
body.page-info-page-3 .loc-item dd b{color:var(--ink); font-weight:700;}
body.page-info-page-3 .loc-item dd a{color:var(--ink); font-weight:700; text-decoration:underline; text-underline-offset:2px;}
body.page-info-page-3 .loc-map-col{display:flex; flex-direction:column; gap:12px;}
body.page-info-page-3 .loc-map-col .loc-map{flex:1;}
body.page-info-page-3 .loc-btns{display:flex; gap:10px; margin-top:0;}
body.page-info-page-3 .loc-btn{
flex:1; text-align:center; padding:13px 10px; border-radius:10px;
font-family:inherit; cursor:pointer; text-decoration:none;
font-size:1.4rem; font-weight:800; border:1.5px solid var(--line);
background:#FCFAF9; color:var(--text-body);
}
body.page-info-page-3 .loc-btn:hover{border-color:var(--tangerine); color:var(--tangerine-deep);}
body.page-info-page-3 .loc-btn.primary{
background:var(--tangerine); border-color:var(--tangerine); color:#fff;
box-shadow:0 8px 18px rgba(176,48,48,0.22);
}
body.page-info-page-3 .loc-btn.primary:hover{background:var(--tangerine-deep); color:#fff;}
body.page-info-page-3 .loc-map{
border:1px solid #EBE5DF; border-radius:14px; overflow:hidden;
background:#E9EEEC; min-height:460px;
}
body.page-info-page-3 .loc-map{position:relative;}
body.page-info-page-3 .map-canvas{width:100%; height:100%; min-height:460px; display:none;}
body.page-info-page-3 .loc-map.ready .map-canvas{display:block;}
body.page-info-page-3 .loc-map.ready .map-fallback{display:none;}
body.page-info-page-3 .map-fallback{
min-height:460px; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;
gap:8px; text-align:center; padding:24px; background:#F4F1ED;
}
body.page-info-page-3 .map-fallback .mf-ico{width:46px; height:46px; color:var(--tangerine-deep);}
body.page-info-page-3 .map-fallback .mf-ico svg{width:100%; height:100%;}
body.page-info-page-3 .map-fallback .mf-tt{font-size:1.6rem; font-weight:800; color:var(--ink); margin-top:4px;}
body.page-info-page-3 .map-fallback .mf-addr{font-size:1.35rem; color:var(--text-muted); font-weight:600;}
body.page-info-page-3 .map-fallback .mf-btn{
margin-top:10px; background:var(--tangerine); color:#fff; font-weight:800; font-size:1.4rem;
padding:11px 22px; border-radius:10px; text-decoration:none;
}
body.page-info-page-3 .map-fallback .mf-btn:hover{background:var(--tangerine-deep);}
/* ── 2026-09-06 : 주소 복사 칩 ────────────────────────────── */
body.page-info-page-3 .copy-chip{
font-family:inherit; cursor:pointer;
border:1.5px solid var(--line); background:#FCFAF9; color:var(--text-body);
font-size:1.25rem; font-weight:800; padding:6px 12px; border-radius:999px;
}
body.page-info-page-3 .copy-chip:hover{border-color:var(--tangerine); color:var(--tangerine-deep);}
body.page-info-page-3 .copy-chip.is-done{border-color:var(--tangerine); background:var(--primary-light); color:var(--tangerine-deep);}
/* ── 2026-09-06 : 전화번호 버튼형 (모바일에서 줄 전체를 눌러 전화) ─ */
/* ⚠️ 위쪽 «.loc-item dd span{display:block}» «.loc-item dd a{underline}» 보다 세게 잡아야
전화번호 줄이 두 줄로 갈라지고 밑줄이 사라집니다. 선택자를 줄이지 마세요. */
body.page-info-page-3 .loc-item dd.tel-list{display:flex; flex-direction:column; gap:8px;}
body.page-info-page-3 .loc-item dd .tel-row{
text-decoration:none; color:inherit; font-weight:400;
display:flex; align-items:center; justify-content:space-between; gap:12px;
border:1.5px solid var(--line); border-radius:10px; padding:11px 14px;
background:#FCFAF9; text-decoration:none;
}
body.page-info-page-3 .loc-item dd .tel-row:hover{border-color:var(--tangerine); background:var(--primary-light);}
body.page-info-page-3 .loc-item dd .tel-txt{display:flex; flex-direction:column; gap:2px; margin:0;}
body.page-info-page-3 .loc-item dd .tel-txt b{font-size:1.25rem; font-weight:700; color:var(--text-muted);}
body.page-info-page-3 .loc-item dd .tel-txt em{font-style:normal; font-size:1.6rem; font-weight:800; color:var(--ink);}
body.page-info-page-3 .loc-item dd .tel-cta{
flex:0 0 auto; font-size:1.25rem; font-weight:800; color:var(--tangerine);
border:1.5px solid var(--tangerine); border-radius:999px; padding:6px 12px; background:#fff;
}
/* ── 2026-09-06 : 지도 아래 동선 안내 2칸 ─────────────────── */
body.page-info-page-3 .loc-guide{
display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px;
}
/* 2026-09-06 — 두 카드의 버튼 높이를 맞추려고 세로 flex + margin-top:auto 를 씁니다. */
body.page-info-page-3 .lg-card{
background:#fff; border:1px solid #EBE5DF; border-radius:14px; padding:24px 26px;
display:flex; flex-direction:column;
}
body.page-info-page-3 .lg-card h3{font-size:1.8rem; font-weight:800; margin-bottom:10px; letter-spacing:-0.01em;}
body.page-info-page-3 .lg-card p{font-size:1.45rem; color:var(--text-body); line-height:1.7; word-break:keep-all; margin-bottom:14px;}
body.page-info-page-3 .lg-card p b{color:var(--ink); font-weight:800;}
body.page-info-page-3 .lg-btn{
align-self:flex-start; margin-top:auto; padding:11px 20px; border-radius:10px;
font-size:1.4rem; font-weight:800; text-decoration:none;
border:1.5px solid var(--line); background:#FCFAF9; color:var(--text-body);
}
body.page-info-page-3 .lg-btn:hover{border-color:var(--tangerine); color:var(--tangerine-deep);}
body.page-info-page-3 .map-label{
background:#fff; border:1.5px solid var(--tangerine); border-radius:999px;
padding:6px 14px; font-size:1.3rem; font-weight:800; color:var(--ink);
white-space:nowrap; box-shadow:0 4px 12px rgba(45,41,36,0.18);
}
@media (max-width:900px){
body.page-info-page-3 .loc-grid{grid-template-columns:1fr; gap:20px;}
body.page-info-page-3 .loc-guide{grid-template-columns:1fr; gap:12px;}
body.page-info-page-3 .loc-map{min-height:320px;}
body.page-info-page-3 .map-canvas, body.page-info-page-3 .map-fallback{min-height:320px;}
}
@media (max-width:860px){
body.page-info-page-3 .header-bottom{justify-content:center;}
body.page-info-page-3 .lg-card{padding:20px 18px;}
body.page-info-page-3 .loc-info{padding:26px 20px;}
body.page-info-page-3 .loc-info h2{font-size:2.1rem;}
}