@charset "utf-8";

/* ============================================================
   2026 서브페이지 공통 (Figma: 개발 캔버스 915:57)
   골격: 헤더 pill(main2026.css 재사용) → 서브비주얼 → LNB탭 → 콘텐츠 → m26 푸터
   ============================================================ */

/* ----- PAGE ----- */
/* 콘텐츠는 밝은 배경 (메인의 #160d1d 오버라이드) */
html:has(body.s26-body), body.s26-body { background-color: #fff; } /* Figma 프레임 배경 = 순백 (픽셀 검증) */

/* ----- 서브 비주얼 ----- */
.s26-visual {
	position: relative;
	width: 100%;
	height: clamp(340px, 32.8vw, 630px);
	overflow: hidden;
}
.s26-visual__bg { position: absolute; inset: 0; z-index: 0; }
.s26-visual__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s26-visual__title {
	position: relative;
	z-index: 2;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/* 헤더 pill(46+70px)과 LNB(64px)를 피해 살짝 아래 중앙 */
	padding: clamp(60px, 6vw, 116px) 20px clamp(48px, 3.4vw, 64px);
	box-sizing: border-box;
}
.s26-visual__title img { width: clamp(280px, 33.8vw, 649px); height: auto; display: block; }

/* ----- LNB 탭 (비주얼 하단 겹침) ----- */
.s26-lnb {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 5;
	background: rgba(0, 0, 0, 0.42);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.s26-lnb ul {
	display: flex;
	justify-content: center;
	list-style: none;
	margin: 0; padding: 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* 모바일 가로 스와이프는 유지, 스크롤바만 숨김 */
}
.s26-lnb ul::-webkit-scrollbar { display: none; }
.s26-lnb li { flex: 0 0 auto; }
.s26-lnb a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: clamp(110px, 10.4vw, 200px);
	height: clamp(48px, 3.4vw, 64px);
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.02em;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s;
}
.s26-lnb li.on a,
.s26-lnb a:hover { background: #fff; color: #140e4e; }
.s26-lnb__toggle { display: none; } /* 모바일 드롭다운 전용 */

/* ----- 콘텐츠 공통 ----- */
.s26-content {
	position: relative;
	/* Figma: 비주얼끝→eyebrow 90 / 카드끝→푸터 128 */
	padding: clamp(50px, 4.7vw, 90px) 20px clamp(70px, 6.7vw, 128px);
	overflow: hidden;
}
/* 은은한 배경 글로우 (Figma: Glow-Gold / Glow-Violet 타원) */
.s26-content::before,
.s26-content::after {
	content: '';
	position: absolute;
	pointer-events: none;
	z-index: 0;
}
/* Figma 글로우는 전 페이지 공통 고정 좌표 (프레임 기준 실측):
   골드 중심 (1070, 980) → 콘텐츠 상단에서 350px / 좌 보라 (345, 1340) → 710px / 우 보라 (1608, 2173) → 1543px */
.s26-content::before { /* 골드 — 상단 중앙 살짝 우측 */
	top: 0; left: 55.7%;
	transform: translateX(-50%);
	width: min(900px, 80vw);
	height: 680px;
	background: radial-gradient(closest-side, rgba(255, 236, 150, 0.35), transparent 70%);
}
.s26-content::after { /* 바이올렛 2개 — 좌측 + 우측 */
	inset: 0;
	background:
		radial-gradient(min(850px, 70vw) 680px at 18% 710px, rgba(150, 110, 255, 0.20), transparent 70%),
		radial-gradient(min(850px, 70vw) 680px at 84% 1543px, rgba(150, 110, 255, 0.14), transparent 70%);
}
.s26-content__inner {
	position: relative;
	z-index: 2;
	max-width: 1400px;
	margin: 0 auto;
}

/* 흰 배경 콘텐츠 (게시판 등) — 글로우·반짝이 장식 제거 */
.s26-content--plain { background: #fff; }
.s26-content--plain::before,
.s26-content--plain::after,
.s26-content--plain .s26-sparkle { display: none; }

/* 반짝이 장식 (Figma Sparkle — JS가 좌우 여백대에 무작위 배치) */
/* z-index 1 = __inner(2) 아래 → 콘텐츠를 절대 가리지 않음 */
.s26-sparkle {
	position: absolute;
	z-index: 1;
	pointer-events: none;
	animation: s26-twinkle 3.5s ease-in-out infinite;
}
@keyframes s26-twinkle {
	0%, 100% { opacity: var(--tw, 0.8); }
	50%      { opacity: calc(var(--tw, 0.8) * 0.35); }
}
@media (prefers-reduced-motion: reduce) {
	.s26-sparkle { animation: none; opacity: var(--tw, 0.8); }
}

/* 타이포 */
.s26-eyebrow {
	font-weight: 300;
	font-size: clamp(14px, 13px + 0.31vw, 20px);
	letter-spacing: clamp(3px, 0.31vw, 6px);
	color: #cac4d0;
	text-align: center;
	text-transform: uppercase;
}
.s26-title {
	margin-top: clamp(32px, 4.2vw, 80px); /* Figma 80 */
	font-weight: 900;
	font-size: clamp(30px, 24px + 1.9vw, 60px);
	letter-spacing: -0.04em;
	line-height: 1.2;
	color: #140e4e;
	text-align: center;
	word-break: keep-all;
}
.s26-title em { font-style: normal; color: #190e99; }
.s26-desc {
	margin-top: clamp(32px, 4.2vw, 80px); /* Figma 80 */
	font-weight: 400;
	font-size: clamp(16px, 15px + 0.36vw, 22px);
	letter-spacing: -0.04em;
	/* Figma 본문 공통: 줄피치 36px @22px (leading normal 26 + 줄간 10) = 1.64 */
	line-height: 1.65;
	color: #111;
	text-align: center;
	word-break: keep-all;
}
.s26-desc p { margin: 0; } /* 연속 문장 = 줄 흐름 그대로 (시안과 동일) */
.s26-desc strong { font-weight: 700; }
/* 리드 문장 (Figma 915:3056 — 32px Bold 검정, sub1-3 엠블럼 소개 등) */
.s26-desc--lead { font-weight: 700; font-size: clamp(20px, 18px + 0.73vw, 32px); }

/* ----- 정보 카드 (기간/주최) ----- */
.s26-cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(20px, 2.8vw, 40px);
	margin-top: clamp(44px, 5vw, 80px);
}
.s26-card {
	background: #fff;
	border-radius: 30px;
	box-shadow: 0 12px 32px 0 rgba(20, 15, 79, 0.16);
	width: 440px;
	max-width: 100%;
	min-height: clamp(240px, 16vw, 312px);
	padding: clamp(26px, 2.5vw, 35px) 20px clamp(30px, 2.9vw, 40px);
	box-sizing: border-box;
	text-align: center;
}
.s26-card__icon { width: 30px; height: 30px; display: block; margin: 0 auto; }
.s26-card__tit {
	margin-top: clamp(12px, 1.2vw, 17px);
	font-weight: 700;
	font-size: clamp(20px, 18px + 0.42vw, 26px);
	letter-spacing: -0.04em;
	color: #8a8a9a;
}
.s26-card__line {
	display: block; /* reset.css의 hr{display:none} 해제 */
	width: min(345px, 88%);
	margin: clamp(22px, 1.8vw, 35px) auto 0; /* Figma 35 */
	border: 0;
	border-top: 1px solid #d4d3db; /* Figma Line 61 stroke (SVG 검증) */
}

/* 기간 (10.09 — 10.18) */
.s26-period {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(16px, 2.1vw, 30px);
	margin-top: clamp(18px, 1.9vw, 26px);
}
.s26-date { width: clamp(96px, 8vw, 113px); }
.s26-date span {
	display: block;
	font-weight: 400;
	font-size: clamp(17px, 16px + 0.31vw, 22px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-date strong {
	display: block;
	font-weight: 900;
	font-size: clamp(30px, 26px + 0.9vw, 40px);
	letter-spacing: -0.04em;
	line-height: 1.2;
	color: #3605bc;
}
.s26-date em {
	display: inline-block;
	margin-top: 9px;
	padding: 2px 20px;
	border: 1px solid #140e4e;
	border-radius: 100px;
	font-style: normal;
	font-weight: 400;
	font-size: clamp(13px, 12px + 0.25vw, 16px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-period__dash {
	width: clamp(28px, 4.2vw, 60px);
	height: 3px;
	background: #140e4e;
	flex-shrink: 0;
	/* 요일 pill 만큼 위로 (숫자 라인 기준 정렬) */
	margin-top: calc(-1 * clamp(14px, 1.4vw, 20px));
}

/* 주최/주관 텍스트 */
.s26-card__org {
	margin-top: clamp(30px, 2.8vw, 54px); /* Figma 54 */
	font-weight: 700;
	font-size: clamp(24px, 22px + 0.73vw, 36px); /* Figma 36 Bold */
	letter-spacing: -0.04em;
	color: #140e4e;
}

/* ============================================================
   페이지 전용 컴포넌트
   ============================================================ */

/* ----- 준비중 안내 (주요행사·일자별행사안내 — 75회 일정 확정 전) ----- */
.s26-prep {
	margin-top: clamp(40px, 4.2vw, 80px);
	padding: clamp(60px, 8vw, 140px) 20px;
	background: #f7f6fb;
	border-radius: 20px;
	text-align: center;
}
.s26-prep__tit {
	margin: 0 0 12px;
	font-weight: 900;
	font-size: clamp(22px, 20px + 0.83vw, 36px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-prep__desc {
	margin: 0;
	font-size: clamp(14px, 13px + 0.31vw, 18px);
	letter-spacing: -0.03em;
	color: #8a8a9a;
	word-break: keep-all;
}

/* ----- 좌측 정렬 섹션 (취지문 등) ----- */
.s26-sec-tit {
	font-weight: 900;
	font-size: clamp(32px, 26px + 1.77vw, 60px); /* Figma 60 Black */
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-desc--left { text-align: left; }
/* 문단 블록 구분 (취지문·엠블럼·관광지 등) — Figma 빈 줄 하나 = 36px */
.s26-desc--left p,
.s26-desc--loose p { margin-bottom: clamp(20px, 1.9vw, 36px); }
.s26-desc--left p:last-child,
.s26-desc--loose p:last-child { margin-bottom: 0; }
.s26-note {
	margin-top: clamp(24px, 2.4vw, 44px);
	font-weight: 700;
	font-size: clamp(17px, 16px + 0.42vw, 24px); /* Figma 24 Bold */
	letter-spacing: -0.04em;
	color: #140e4e;
}
/* 섹션 사이 구분선 (Figma Line 3) — reset.css의 hr{display:none} 해제 */
.s26-hr {
	display: block;
	max-width: 1400px;
	margin: clamp(50px, 5vw, 90px) auto;
	border: 0;
	border-top: 1px solid #d4d3db;
}

/* ----- 2컬럼: 텍스트 + 원형 사진 클러스터 (취지문) ----- */
.s26-two {
	display: flex;
	align-items: flex-start;
	gap: clamp(40px, 5vw, 100px);
}
.s26-two--rev { flex-direction: row-reverse; }
.s26-two__txt { flex: 1; min-width: 0; }
.s26-two__txt .s26-desc { margin-top: clamp(24px, 2.9vw, 56px); }
/* 원형 사진 클러스터 — Figma 절대배치를 %로 환산해 그대로 스케일 */
.s26-two__media {
	position: relative;
	flex-shrink: 0;
	width: clamp(260px, 25.5vw, 490px);
}
/* 사진은 원본(사각)을 CSS로 원형 크롭 — Figma 익스포트의 흰 배경 합성 회피 */
.s26-two__media img,
.s26-two__media i {
	position: absolute;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	box-shadow: 0 12px 32px 0 rgba(20, 15, 79, 0.16); /* Figma 바깥쪽 그림자 X0 Y12 B32 #140F4F 16% */
}
/* 장식 원 (Figma 그라데이션 — 이미지 대신 CSS) */
.s26-two__media .d1 { background: linear-gradient(180deg, #d7cdf1, #f1cdf1); }
.s26-two__media .d2 { background: linear-gradient(180deg, #cce0fc, #d3f1ce); }
/* 섹션1 (기준 490x607) */
.s26-two__media--a { aspect-ratio: 490 / 607; }
.s26-two__media--a .c1 { width: 53.5%; left: 46.5%; top: 0; }
.s26-two__media--a .c2 { width: 64.5%; left: 0;     top: 35.9%; }
.s26-two__media--a .d1 { width: 29.6%; left: 59.2%; top: 76.1%; }
/* 섹션2 (기준 480x751) */
.s26-two__media--b { aspect-ratio: 480 / 751; }
.s26-two__media--b .c3 { width: 79.2%; left: 0;     top: 0; }
.s26-two__media--b .c4 { width: 54.6%; left: 45.4%; top: 49.1%; }
.s26-two__media--b .d2 { width: 27.7%; left: 15.2%; top: 82.3%; }

/* ----- 엠블럼 (sub1-3) ----- */
.s26-emblems {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: clamp(24px, 3vw, 58px);
	margin-top: clamp(40px, 4.7vw, 90px);
}
.s26-emblems img {
	width: min(671px, 100%);
	border-radius: 30px;
	 /* Figma Rectangle 5 */
	display: block;
}
/* 중간 소제목 (색상규정 등 — Figma 40 Black) */
.s26-mid-tit {
	margin-top: clamp(16px, 1.6vw, 28px);
	font-weight: 900;
	font-size: clamp(26px, 22px + 0.94vw, 40px);
	letter-spacing: -0.04em;
	color: #140e4e;
	text-align: center;
}

/* 색상규정 카드 */
.s26-colors {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: clamp(20px, 2.9vw, 55px);
	margin-top: clamp(40px, 3.1vw, 60px);
}
.s26-color-card {
	position: relative;
	width: 430px;
	max-width: 100%;
	min-height: clamp(200px, 15.6vw, 300px);
	background: #fff;
	border-radius: 30px;
	box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
	padding: clamp(28px, 2.2vw, 42px) clamp(24px, 2.1vw, 40px);
	box-sizing: border-box;
}
.s26-color-card__hex {
	font-weight: 900;
	font-size: clamp(20px, 18px + 0.42vw, 26px); /* Figma 26 Black */
	letter-spacing: -0.04em;
	text-transform: uppercase;
	color: #000;
}
.s26-color-card__cmyk {
	display: flex;
	gap: clamp(16px, 1.6vw, 30px);
	margin-top: clamp(14px, 1.2vw, 22px);
	font-size: clamp(15px, 14px + 0.26vw, 19px);
	color: #000;
}
.s26-color-card__cmyk b { font-weight: 700; margin-right: 8px; }
.s26-color-card__circle {
	position: absolute;
	right: clamp(24px, 2.1vw, 40px);
	bottom: clamp(20px, 1.7vw, 32px);
	width: clamp(72px, 5.7vw, 110px);
	height: clamp(72px, 5.7vw, 110px);
	border-radius: 50%;
}

/* ----- 연혁 (sub1-4) ----- */
.s26-tabs {
	display: flex;
	flex-wrap: wrap; /* 탭 다수(관광지 8개 등) 시 줄바꿈 */
	justify-content: center;
	gap: clamp(10px, 1.4vw, 40px);
	margin-top: clamp(36px, 4.2vw, 80px);
}
.s26-tabs button {
	/* Figma sub2-2: 고정폭 200 pill × 6 = 1400 한 줄 — min-width 보장 + 패딩 축소로 줄바꿈 방지 */
	min-width: clamp(120px, 10.4vw, 200px);
	padding: clamp(12px, 1vw, 20px) clamp(20px, 2vw, 38px);
	border: 1px solid #f1f1f1;
	border-radius: 39px;
	background: #fff;
	font-weight: 400;
	font-size: clamp(18px, 17px + 0.47vw, 26px);
	letter-spacing: -0.04em;
	color: #000;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
	box-sizing: border-box;
}
.s26-tabs button.active {
	background: #190e99;
	border-color: #190e99;
	color: #fff;
	font-weight: 700;
}
.s26-tabs button:hover { background: #190e99; border-color: #190e99; color: #fff; }
.s26-table-wrap {
	position: relative; /* 스와이프 힌트 오버레이 기준 */
	max-width: 1400px;
	margin: clamp(32px, 3.3vw, 64px) auto 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	background: #fff;
	border: 1px solid #eceaf4;
	border-radius: 8px;
	scrollbar-width: none; /* 스크롤바 숨김 — 이동은 드래그/스와이프 */
}
.s26-table-wrap::-webkit-scrollbar { display: none; }

/* 스와이프 유도 오버레이 (구 x-scr-view 패턴 · swipe.png 재사용, 첫 조작 시 JS가 제거) */
.s26-swipe-hint {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	z-index: 5;
	background: url('../img/page/swipe.png') no-repeat center 30% rgba(255, 255, 255, 0.6);
	background-size: 120px;
	transition: opacity 0.3s;
}
@media (min-width: 1025px) {
	.s26-swipe-hint { display: none; } /* 데스크톱에선 힌트 불필요 */
}
.s26-table {
	width: 100%;
	min-width: 860px;
	border-collapse: collapse;
	text-align: center;
}
/* 캡션은 화면에서 숨김 (스크린리더 전용) — 음악부 '음악 경연대회 일정' 등 노출 방지 */
.s26-table caption {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
.s26-table th {
	background: #faf7fe; /* Figma Rectangle 3 */
	font-weight: 700;
	font-size: clamp(16px, 15px + 0.36vw, 22px);
	color: #140e4e;
	padding: clamp(16px, 1.5vw, 30px) 10px;
}
.s26-table td {
	font-weight: 400;
	font-size: clamp(14px, 13px + 0.36vw, 20px);
	letter-spacing: -0.04em;
	color: #000;
	padding: clamp(14px, 1.4vw, 28px) 10px;
	border-top: 1px solid #eceaf4;
	word-break: keep-all;
}
.s26-tab-panel { display: none; }
.s26-tab-panel.active { display: block; }

/* ----- 지그재그 이미지+텍스트 (sub1-5 축제유래) ----- */
.s26-zig {
	display: flex;
	align-items: center;
	gap: clamp(40px, 5.2vw, 100px);
	margin-top: clamp(44px, 5.2vw, 100px);
}
.s26-zig--rev { flex-direction: row-reverse; }
/* 반전 행(이미지 우측)은 텍스트 우측 정렬 (Figma sub1-5) */
.s26-zig--rev .s26-zig__txt,
.s26-zig--rev .s26-zig__txt .s26-desc--left,
.s26-zig--rev .s26-zig__txt .s26-mid-tit { text-align: right; }
.s26-zig__img {
	flex-shrink: 0;
	width: clamp(300px, 33.9vw, 650px);
	max-width: 100%;
	border-radius: 30px;
	display: block;
}
.s26-zig__txt { flex: 1; min-width: 0; }
/* s26-desc 기본 상단 마진(타이틀 아래 80px 리듬용) 무효화 — 지그재그에선 이미지와 세로 중앙 정렬 유지 */
.s26-zig .s26-zig__txt.s26-desc, .s26-zig .s26-zig__txt .s26-desc { margin-top: 0; }
.s26-zig__txt .s26-mid-tit { text-align: left; } /* 정방향 행 소제목 좌측 (진주의맛) */

/* 진주의맛 지그재그 (Figma 915:946) — 이미지 680x400 r30 · 행간격 80 · 소제목 30 Bold 검정 · 본문 22/33 · 반전 행도 좌측정렬 */
.s26-zig--food { gap: clamp(40px, 4.16vw, 80px); margin-top: clamp(40px, 4.16vw, 80px); }
.s26-zig--food .s26-zig__img { width: clamp(300px, 35.4vw, 680px); aspect-ratio: 680 / 400; object-fit: cover; }
.s26-zig--food .s26-mid-tit { font-weight: 700; font-size: clamp(22px, 20px + 0.52vw, 30px); color: #000; }
.s26-zig--food .s26-desc { line-height: 1.5; }
.s26-zig--food.s26-zig--rev .s26-zig__txt,
.s26-zig--food.s26-zig--rev .s26-zig__txt .s26-desc--left,
.s26-zig--food.s26-zig--rev .s26-zig__txt .s26-mid-tit { text-align: left; }

/* ----- CI/엠블럼 다운로드 배너 (sub1-3 · Figma 1048:180) ----- */
.s26-dl {
	position: relative;
	max-width: 1400px;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
	padding: clamp(40px, 3.1vw, 60px) 20px;
	border-radius: 30px;
	background: linear-gradient(180deg, #3605bc, #bc05bc);
	overflow: hidden;
	text-align: center;
}
.s26-dl::before { /* 불꽃 패턴 오버레이 20% */
	content: '';
	position: absolute;
	inset: 0;
	background: url('../img/2026/sub/sub1_3_dl_bg.png') center / cover no-repeat;
}
.s26-dl > * { position: relative; }
.s26-dl__eyebrow {
	font-weight: 300;
	font-size: clamp(14px, 13px + 0.31vw, 20px);
	letter-spacing: clamp(3px, 0.31vw, 6px);
	text-transform: uppercase;
	color: rgba(212, 211, 219, 0.6);
}
.s26-dl__tit {
	margin-top: clamp(12px, 1.04vw, 20px);
	font-weight: 900;
	font-size: clamp(24px, 22px + 0.94vw, 40px);
	letter-spacing: -0.04em;
	color: #fff;
}
.s26-dl__txt {
	margin-top: clamp(20px, 2.08vw, 40px);
	font-weight: 300;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #fff;
	word-break: keep-all;
}
.s26-dl__btns {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(12px, 1.04vw, 20px);
	margin-top: clamp(20px, 2.08vw, 40px);
}
.s26-dl__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px clamp(24px, 2.08vw, 40px);
	border-radius: 100px;
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}
/* 기본 = 반투명 필(기존 AI 버튼 모습), 호버 = 흰색 교체 — PNG·AI 공통 */
.s26-dl__btn--png,
.s26-dl__btn--ai {
	background: rgba(255, 255, 255, 0.3);
	border: 1px solid rgba(255, 255, 255, 0.4);
	color: #fff;
}
.s26-dl__btn--png:hover,
.s26-dl__btn--ai:hover { background: #fff; border-color: #fff; color: #3605bc; }

/* ----- 안내도 (sub1-6) ----- */
.s26-map {
	display: block;
	width: 100%;
	max-width: 1400px;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
	height: auto;
}
/* 안내도 스와이프 래퍼 — s26-table-wrap 재사용(힌트·드래그), 표용 테두리·배경만 제거 */
.s26-map-wrap {
	border: 0;
	border-radius: 0;
	background: none;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
}
.s26-map-wrap .s26-map { margin: 0; min-width: 900px; } /* 좁은 화면에서 축소 대신 가로 스와이프 */

/* ----- 행사개요 (sub2-1) ----- */
/* 정보 카드 8개 (4열, Figma 332x210/220 · r20 · 라벨 20 Medium #8a8a9a · 값 28 Bold) */
.s26-ov-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(14px, 1.25vw, 24px);
	max-width: 1400px;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
}
.s26-ov-card {
	position: relative;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 12px 32px 0 rgba(20, 15, 79, 0.16);
	min-height: clamp(150px, 10.9vw, 210px);
	padding: clamp(20px, 1.7vw, 26px) clamp(16px, 1.5vw, 26px);
	box-sizing: border-box;
}
.s26-ov-card__label {
	font-weight: 500;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	color: #8a8a9a;
}
.s26-ov-card__val {
	margin-top: clamp(10px, 1vw, 14px);
	font-weight: 700;
	font-size: clamp(19px, 17px + 0.57vw, 28px);
	letter-spacing: -0.04em;
	line-height: 1.2;
	color: #000;
	word-break: keep-all;
}
.s26-ov-card__val small { /* 부가 문구 (예: 전국문화예술제의 효시) */
	display: block;
	margin-top: 4px;
	font-weight: 400;
	font-size: clamp(13px, 12px + 0.21vw, 16px);
	color: #8a8a9a;
}
.s26-ov-card__icon {
	position: absolute;
	right: clamp(18px, 1.6vw, 30px);
	bottom: clamp(16px, 1.5vw, 28px);
	height: clamp(26px, 2.2vw, 42px);
	width: auto;
}

/* 소제목 언더바 옵션 (주요행사 등) */
.s26-mid-tit--bar { margin-top: 0; }
.s26-mid-tit--bar::after {
	content: '';
	display: block;
	width: 60px;
	height: 5px;
	border-radius: 3px;
	background: #190e99;
	margin: clamp(14px, 1.2vw, 22px) auto 0;
}

/* 주요행사 카드 6개 (2열 · 배너형 이미지 680x200) */
.s26-events {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(28px, 3.4vw, 66px) clamp(20px, 2.1vw, 40px);
	max-width: 1400px;
	margin: clamp(36px, 3.1vw, 60px) auto 0;
}
.s26-event__img {
	width: 100%;
	aspect-ratio: 680 / 200;
	object-fit: cover;
	border-radius: 20px;
	display: block;
	box-shadow: 0 10px 24px 0 rgba(20, 15, 79, 0.14); /* Figma 바깥쪽 그림자 X0 Y10 B24 #140F4F 14% */
}
.s26-event__tit {
	margin-top: clamp(16px, 1.6vw, 30px);
	font-weight: 700;
	font-size: clamp(19px, 18px + 0.31vw, 24px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-event__txt {
	margin-top: clamp(6px, 0.5vw, 10px);
	font-weight: 400;
	font-size: clamp(14px, 13px + 0.16vw, 16px);
	letter-spacing: -0.04em;
	color: #595966; /* Figma 915:280 */
}

/* ----- 주요행사 상세 (sub2-2) ----- */
/* 다크 배너 (Figma Rectangle 17 1400x300) */
.s26-banner {
	position: relative;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
	border-radius: clamp(20px, 1.56vw, 30px); /* Figma r30 */
	overflow: hidden;
	min-height: clamp(190px, 15.6vw, 300px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: clamp(24px, 2.5vw, 48px) 20px;
	box-sizing: border-box;
}
/* 바로가기 외부링크 아이콘 (Figma 877:197 — 18px, mask라 글자색 따라감: 기본 #190e99 → 호버 흰색) */
.s26-ico-link {
	display: inline-block;
	width: clamp(14px, 0.94vw, 18px);
	height: clamp(14px, 0.94vw, 18px);
	background: currentColor;
	-webkit-mask: url('../img/2026/sub/ico_link.svg') no-repeat center / contain;
	mask: url('../img/2026/sub/ico_link.svg') no-repeat center / contain;
}

/* ----- 교통안내 (Figma sub7-4) ----- */
/* 안내 바 — 흰 카드 + 그림자, 좌 문구 / 우 바로가기 버튼 (915:1138) */
.s26-notice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 20px;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
	padding: clamp(12px, 1.04vw, 20px) clamp(20px, 2.08vw, 40px);
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 12px 16px 0 rgba(20, 15, 79, 0.16);
}
.s26-notice--center { justify-content: center; }
.s26-notice__txt {
	font-weight: 500;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-notice__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: clamp(12px, 1.04vw, 20px) clamp(24px, 2.08vw, 40px);
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 39px;
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #190e99;
	text-decoration: none;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.s26-notice__btn:hover { background: #190e99; border-color: #190e99; color: #fff; }

/* 노선/전화 pill — 표 위 중앙 (915:1143) */
.s26-route {
	display: table;
	margin: clamp(12px, 1.25vw, 24px) auto 0;
	padding: 12px clamp(24px, 2.08vw, 40px);
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 39px;
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #190e99;
	text-align: center;
}

/* 페이지 표 괘선 (Figma sub2-4 실측) — 2px #D4D3DB · 헤더 92 / 행 93 · 모서리 각 · 좌우 테두리 없음 */
/* 세로줄: 모든 셀에 좌우 보더 + 표 가장자리는 hidden으로 상쇄
   (td+td 인접선택자는 rowspan 셀이 낀 행에서 첫 세로줄이 빠짐) */
.s26-table--lines th, .s26-table--lines td { border-left: 1px solid #d4d3db; border-right: 1px solid #d4d3db; }
.s26-table--lines { border-left: hidden; border-right: hidden; }
.s26-table--lines thead tr + tr th { border-top: 1px solid #d4d3db; }
.s26-table--lines td { border-top: 1px solid #d4d3db; }
/* 행 경계선을 tr에도 걸어 rowspan 셀·헤더 경계에서 줄이 끊기지 않게 */
.s26-table--lines thead th { border-bottom: 1px solid #d4d3db; }
.s26-table--lines tbody tr + tr { border-top: 1px solid #d4d3db; }
.s26-table--lines th { padding: clamp(18px, 1.7vw, 33px) 10px; }
.s26-table--lines td { padding: clamp(14px, 1.8vw, 34px) 10px; }
.s26-table-wrap:has(> .s26-table--lines) {
	border: 0;
	border-top: 1px solid #d4d3db;
	border-bottom: 1px solid #d4d3db;
	border-radius: 0;
}
/* 컬럼 많은 표(운항표 13열 등)는 최소폭 확대 — 좁은 화면에선 가로 스와이프 */
.s26-table--wide { min-width: 1200px; }

/* 항공사 셀 (Figma 915:1175/1177 — 이름 22 Bold · 노선 16 Regular 검정) */
.s26-table .air {
	display: block;
	font-weight: 700;
	font-size: clamp(16px, 15px + 0.36vw, 22px);
	letter-spacing: -0.04em;
	color: #000;
}
.s26-table .sub {
	display: block;
	margin-top: 4px;
	font-weight: 400;
	font-size: clamp(13px, 12px + 0.21vw, 16px);
	letter-spacing: -0.04em;
	color: #000;
}
.s26-dot {
	display: inline-block;
	width: clamp(12px, 0.83vw, 16px);
	height: clamp(12px, 0.83vw, 16px);
	border-radius: 50%;
	background: #190e99;
	vertical-align: middle;
}

/* 바로가기 링크 라인 (915:1295) */
.s26-golink {
	max-width: 1400px;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
	text-align: center;
	font-weight: 700;
	font-size: clamp(17px, 15px + 0.68vw, 30px);
	letter-spacing: -0.04em;
	color: #000;
	word-break: break-all;
}
.s26-golink a { color: inherit; text-decoration: none; }
.s26-golink a:hover { text-decoration: underline; }

/* VR전시관 — 큰 배너 + 타이틀 이미지 */
.s26-banner--tall { min-height: clamp(320px, 31vw, 600px); }
.s26-vr-ttl {
	position: relative;
	z-index: 1;
	max-width: min(70%, 560px);
	height: auto;
}
.s26-banner--tall .s26-banner__meta { margin-top: clamp(24px, 2.6vw, 50px); }

/* 배너 그림자 — 페이지별 시안: 관광(0 12 16) / 주요행사(0 12 32) / 특산물은 없음 */
.s26-banner--shadow { box-shadow: 0 12px 16px 0 rgba(20, 15, 79, 0.16); }
.s26-banner--shadow-lg { box-shadow: 0 12px 32px 0 rgba(20, 15, 79, 0.16); }

.s26-banner__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.s26-banner__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s26-banner__bg::after { /* 검정 60% 오버레이 — 배너 텍스트 가독성 */
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
}

.s26-banner__tit {
	position: relative;
	z-index: 1;
	font-weight: 900;
	font-size: clamp(26px, 22px + 0.94vw, 40px);
	letter-spacing: -0.04em;
	color: #fff;
}
.s26-banner__txt {
	position: relative;
	z-index: 1;
	margin-top: clamp(12px, 1vw, 20px);
	max-width: 660px;
	font-weight: 400;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.03em;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.92);
	word-break: keep-all;
}

/* 세부 행사 카드 (3열 · Figma 452x300 · 제목 30 Bold) */
.s26-ev-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
}
.s26-ev-card {
	position: relative;
	background: #fff;
	border-radius: clamp(20px, 1.56vw, 30px); /* Figma r30 */
	box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.1); /* Figma X4 Y4 B20 10% */
	min-height: clamp(200px, 15.6vw, 300px);
	padding: clamp(24px, 2.1vw, 40px) clamp(24px, 2.4vw, 46px);
	box-sizing: border-box;
}
.s26-ev-card__tit {
	font-weight: 700;
	font-size: clamp(20px, 18px + 0.63vw, 30px);
	letter-spacing: -0.04em;
	color: #000;
	word-break: keep-all;
}
.s26-ev-card__info {
	margin-top: clamp(14px, 1.3vw, 25px);
	font-weight: 400;
	font-size: clamp(16px, 15px + 0.36vw, 22px); /* Figma 915:424 — 22px Regular */
	letter-spacing: -0.04em;
	line-height: 1.65;
	color: #000;
	word-break: keep-all;
}
.s26-ev-card__icon {
	position: absolute;
	right: clamp(20px, 2.1vw, 40px);
	bottom: clamp(18px, 1.9vw, 36px);
	height: clamp(38px, 3.1vw, 60px);
	width: auto;
}
/* 카드 호버 시 카드 자리에 현장 사진 표시 (sub2_2 주요행사) */
.s26-ev-card { overflow: hidden; }
.s26-ev-card__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}
.s26-ev-card:hover .s26-ev-card__photo { opacity: 1; }

/* 와이드 행사 카드 2열 (Figma 1082:615 — 항목 4개 탭: 가장행렬) */
.s26-evw-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 25px 22px;
	margin-top: clamp(28px, 3.1vw, 60px);
}
.s26-evw {
	position: relative;
	overflow: hidden; /* 호버 사진 라운드 크롭 */
	display: flex;
	justify-content: space-between;
	background: #fff;
	border-radius: 30px;
	box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.1); /* Figma X4 Y4 B10 10% */
	min-height: clamp(200px, 15.6vw, 300px);
	padding: clamp(24px, 2.1vw, 40px) clamp(24px, 2.4vw, 46px);
	box-sizing: border-box;
}
/* 호버 시 카드 자리에 현장 사진 (ev-card와 동일 패턴) */
.s26-evw__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}
.s26-evw:hover .s26-evw__photo { opacity: 1; }
.s26-evw__tit {
	font-weight: 700;
	font-size: clamp(20px, 18px + 0.63vw, 30px);
	letter-spacing: -0.04em;
	color: #000;
}
.s26-evw__info {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: clamp(14px, 1.3vw, 25px);
	font-size: clamp(15px, 14px + 0.42vw, 22px);
	letter-spacing: -0.04em;
	color: #000;
	word-break: keep-all;
}
.s26-evw__icon {
	align-self: flex-end;
	flex-shrink: 0;
	width: clamp(40px, 3.1vw, 60px);
	height: auto;
	margin-left: 16px;
}
/* 사진 그리드 (3열 · 452x300) */
.s26-photos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
}
.s26-photos img {
	width: 100%;
	aspect-ratio: 452 / 300;
	object-fit: cover;
	border-radius: clamp(20px, 1.56vw, 30px); /* Figma r30 */
	display: block;
	box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.1); /* Figma 바깥쪽 그림자 X4 Y4 B20 #000 10% (sub7-1 관광) */
}
.s26-photos--plain img { box-shadow: none; } /* sub7-3 특산물 사진은 시안에 그림자 없음 */

/* ----- 일자별 탭 (sub2-4) ----- */
/* Figma 915:2763 — 균등폭 · r20 · 날짜 26 / 요일 20 · 활성 #190E99 */
.s26-days {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(8px, 1.04vw, 20px);
	margin-top: clamp(36px, 4.2vw, 80px);
}
/* min-width 합이 1400을 넘지 않아야 한 줄 유지: 110×10 + gap 20×9 = 1280 */
.s26-days li { flex: 1 1 0; min-width: clamp(72px, 5.7vw, 110px); }
.s26-days a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: clamp(12px, 1.04vw, 20px) 10px;
	background: #fff;
	border: 1px solid #f1f1f1;
	border-radius: 20px;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}
.s26-days a strong {
	font-weight: 400;
	font-size: clamp(17px, 16px + 0.52vw, 26px);
	letter-spacing: -0.04em;
	color: #000;
}
.s26-days a span {
	font-weight: 400;
	font-size: clamp(14px, 13px + 0.36vw, 20px);
	letter-spacing: -0.04em;
	color: #000;
}
.s26-days li.on a,
.s26-days a:hover { background: #190e99; border-color: #190e99; }
.s26-days li.on a strong { font-weight: 700; }
.s26-days li.on a strong, .s26-days a:hover strong,
.s26-days li.on a span, .s26-days a:hover span { color: #fff; }
.s26-days ul { display: contents; list-style: none; margin: 0; padding: 0; }
/* 한 줄(10개)이 안 들어가는 폭부터는 균등 분할: 5×2줄 → 2×5줄 */
@media (max-width: 860px) {
	.s26-days { display: grid; grid-template-columns: repeat(5, 1fr); }
	.s26-days li { min-width: 0; }
}
@media (max-width: 460px) {
	.s26-days { grid-template-columns: repeat(2, 1fr); }
}

/* ----- 예술경연대회 (sub3-1) ----- */
/* 타이틀 아래 대시 + 안내문 */
.s26-title-dash {
	display: block;
	width: 50px;
	height: 5px;
	background: #d4d3db;
	margin: clamp(24px, 3.1vw, 60px) auto 0;
	border: 0;
}
/* 부문 카드 9개 (3열 452x300, 좌상단 제목 40 Black + 우하단 아이콘) */
.s26-cat-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
}
.s26-cat-card {
	position: relative;
	display: block;
	background: #fff;
	border-radius: 20px;
	box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.1); /* Figma 바깥쪽 그림자 X4 Y4 B20 #000 10% */
	min-height: clamp(180px, 15.6vw, 250px);
	padding: clamp(24px, 2.1vw, 40px) clamp(24px, 2.4vw, 46px);
	box-sizing: border-box;
	text-decoration: none;
	transition: transform 0.2s, box-shadow 0.2s;
}
.s26-cat-card:hover { transform: translateY(-4px); box-shadow: 0 10px 25px 0 rgba(20, 15, 79, 0.16); }
.s26-cat-card__tit {
	font-weight: 900;
	font-size: clamp(24px, 21px + 0.94vw, 30px);
	letter-spacing: -0.04em;
	color: #140e4e;
}
.s26-cat-card__icon {
	position: absolute;
	right: clamp(24px, 2.4vw, 46px);
	bottom: clamp(20px, 2.1vw, 40px);
	height: clamp(44px, 4.2vw, 66px);
	width: auto;
}

/* ----- 부문 상세 (sub3-1 버튼클릭시) ----- */
.s26-detail {
	position: relative;
	background: #fff;
	border-radius: 30px;
	box-shadow: 0 12px 32px 0 rgba(20, 15, 79, 0.16);
	max-width: 1400px;
	margin: clamp(24px, 3.1vw, 60px) auto 0;
	padding: clamp(28px, 3.1vw, 60px) clamp(20px, 4.2vw, 80px) clamp(40px, 4.2vw, 80px);
	box-sizing: border-box;
}
.s26-detail__label { /* Figma 876:178 — eyebrow와 동일 (Light 20 · 자간 6) */
	font-weight: 300;
	font-size: clamp(14px, 13px + 0.31vw, 20px);
	letter-spacing: clamp(3px, 0.31vw, 6px);
	color: #cac4d0;
	text-align: center;
	text-transform: uppercase;
}
.s26-detail__tit {
	margin-top: clamp(8px, 0.8vw, 14px);
	font-weight: 900;
	font-size: clamp(26px, 22px + 0.94vw, 40px);
	letter-spacing: -0.04em;
	color: #140e4e;
	text-align: center;
}
.s26-detail__tit::after { /* Figma 876:175 — 제목 아래 보라 언더바 60x5 */
	content: '';
	display: block;
	width: 60px;
	height: 5px;
	border-radius: 3px;
	background: #190e99;
	margin: clamp(12px, 1.1vw, 22px) auto 0;
}
/* 이전/다음 부문 네비 — 기본 인라인, 초광폭에선 카드 밖 원형 */
.s26-detail__nav {
	display: flex;
	justify-content: space-between;
	margin-top: clamp(14px, 1.3vw, 24px);
}
.s26-detail__nav a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	font-size: clamp(13px, 12px + 0.21vw, 16px);
	color: #8a8a9a;
	text-decoration: none;
	transition: color 0.2s;
}
.s26-detail__nav a:hover { color: #140e4e; }
/* Figma 셰브론 (877:314 — 16x25 #D0CCE9, mask라 색 변경 용이) */
.s26-ico-arrow {
	display: inline-block;
	width: clamp(10px, 0.83vw, 16px);
	height: clamp(16px, 1.3vw, 25px);
	background: #d0cce9;
	-webkit-mask: url('../img/2026/sub/ico_arrow.svg') no-repeat center / contain;
	mask: url('../img/2026/sub/ico_arrow.svg') no-repeat center / contain;
}
.s26-ico-arrow--r { transform: scaleX(-1); }
@media (min-width: 1680px) {
	/* Figma 876:58 — 카드 밖 화면 가장자리 원형 네비 (136px 원 · 부문명 20px) */
	.s26-detail__nav { margin: 0; }
	.s26-detail__nav a {
		position: absolute;
		top: 50%;
		flex-direction: row;
		gap: clamp(8px, 0.73vw, 14px); /* Figma 877:321 gap 14 */
		width: clamp(96px, 7.1vw, 136px);
		height: clamp(96px, 7.1vw, 136px);
		justify-content: center;
		background: #fff;
		border-radius: 50%;
		box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15); /* Figma 877:308 blur 40 15% */
		font-weight: 600; /* Figma SemiBold */
		font-size: clamp(15px, 14px + 0.31vw, 20px);
		color: #140e4e;
	}
	.s26-detail__nav a.prev { left: calc(-1 * clamp(128px, 10.3vw, 198px)); }
	.s26-detail__nav a.next { right: calc(-1 * clamp(128px, 10.3vw, 198px)); }

	/* 모달에서는 화면 기준 고정 — 스크롤해도 항상 화면 중앙 좌우에 보임 (Figma x62/x1712) */
	.s26-modal .s26-detail__nav a {
		position: fixed;
		top: 50%;
		transform: translateY(-50%);
	}
	.s26-modal .s26-detail__nav a.prev { left: clamp(24px, 3.2vw, 62px); }
	.s26-modal .s26-detail__nav a.next { right: clamp(24px, 3.2vw, 62px); left: auto; }
}

/* ----- 부문 상세 모달 (Figma 876:58 — 카드 클릭 시 딤 배경 위 표시) ----- */
.s26-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: none;
	overflow-y: auto;
	background: rgba(0, 0, 0, 0.4); /* Figma 876:172 */
	padding: clamp(24px, 4vw, 60px) 20px;
}
.s26-modal.open { display: block; }
body.s26-modal-open { overflow: hidden; }
.s26-modal .s26-detail { margin: 0 auto; }
.s26-modal__close {
	position: absolute;
	top: clamp(16px, 1.6vw, 28px);
	right: clamp(16px, 1.8vw, 32px);
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 30px;
	line-height: 1;
	color: #8a8a9a;
	cursor: pointer;
	z-index: 2;
	transition: color 0.2s;
}
.s26-modal__close:hover { color: #140e4e; }

/* 상세 내부 — 기존(sub2025) 마크업을 치환한 s26-x-* 컴포넌트 */
.s26-x-tablist {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(8px, 0.8vw, 15px);
	list-style: none;
	margin: clamp(24px, 2.6vw, 50px) 0 0;
	padding: 0;
}
.s26-x-tab {
	padding: clamp(10px, 0.9vw, 16px) clamp(18px, 1.8vw, 34px);
	border: 1px solid #f1f1f1;
	border-radius: 39px;
	background: #fff;
	font-weight: 400;
	font-size: clamp(14px, 13px + 0.26vw, 18px);
	letter-spacing: -0.03em;
	color: #000;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
	word-break: keep-all;
}
.s26-x-tab.active { background: #190e99; border-color: #190e99; color: #fff; font-weight: 700; }
.s26-x-tab:hover { background: #190e99; border-color: #190e99; color: #fff; }

/* Figma 877:191 — 라벤더 바(r20) + 문구 20 Bold #140e4e + 흰 필 버튼(r39 · #190e99) */
.s26-x-quick {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px 20px;
	flex-wrap: wrap;
	background: #eeedf8;
	border-radius: 20px;
	padding: clamp(12px, 1.04vw, 20px) clamp(20px, 2.08vw, 40px);
	margin-top: clamp(20px, 2.1vw, 40px);
}
.s26-x-quick + .wr_1300 { margin-top: clamp(28px, 3.1vw, 60px); } /* 퀵바로가기 바 아래 본문 간격 (연극부 등) */
.s26-x-quick .tit {
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #140e4e;
	word-break: keep-all;
}
.s26-x-quick a {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: clamp(12px, 1.04vw, 20px) clamp(24px, 2.08vw, 40px);
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 39px;
	font-weight: 700;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.04em;
	color: #190e99;
	text-decoration: none;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.s26-x-quick a:hover { background: #190e99; border-color: #190e99; color: #fff; }

.s26-x-panel { display: none; }
.s26-x-panel.active { display: block; }

/* 패널 섹션 제목 (┃세부내용 — Figma 877:198: 30px Bold 검정 + 세로 라인) */
.s26-x-sec {
	display: flex;
	align-items: center;
	gap: clamp(12px, 1vw, 20px);
	margin-top: clamp(28px, 3.1vw, 60px);
	font-weight: 700;
	font-size: clamp(20px, 18px + 0.63vw, 30px);
	letter-spacing: -0.02em;
	color: #000;
}
.s26-x-sec::before { /* Figma 1077:765 — 노란 이중 원(#FFD65C) 아이콘 */
	content: '';
	width: clamp(22px, 1.56vw, 30px);
	height: clamp(22px, 1.56vw, 30px);
	background: url('../img/2026/sub/ico_sec.svg') no-repeat center / contain;
	flex-shrink: 0;
}
.s26-x-lines {
	display: flex;
	flex-wrap: wrap;
	border-bottom: 1px solid #eee;
	padding: clamp(6px, 0.6vw, 12px) 0;
}
.s26-x-lines.no-bo-ba { border-bottom: 0; }
.s26-x-info {
	flex: 1 1 50%;
	min-width: min(100%, 320px);
	padding: clamp(12px, 1.2vw, 22px) 10px;
	box-sizing: border-box;
}
.s26-x-info.full { flex-basis: 100%; }
.s26-x-info h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	font-size: clamp(16px, 15px + 0.26vw, 20px);
	letter-spacing: -0.03em;
	color: #140e4e;
}
.s26-x-info h3::before { /* 세로 바 (시안 ┃세부내용) */
	content: '';
	width: 4px;
	height: 1em;
	border-radius: 2px;
	background: #190e99;
	flex-shrink: 0;
}
.s26-x-info > p, .s26-x-info > ul, .s26-x-info .s26-x-p {
	margin-top: clamp(8px, 0.8vw, 14px);
	font-size: clamp(14px, 13px + 0.21vw, 17px);
	line-height: 1.7;
	color: #444;
	word-break: keep-all;
}
.s26-x-dotul { list-style: none; margin: 0; padding: 0; }
.s26-x-dotul li { position: relative; padding-left: 14px; }
.s26-x-dotul li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.7em;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #8a8a9a;
}

/* h4 소제목 — 앞에 점(●) 표기 · 상하 여백으로 항목 그룹 구분 */
.s26-x-info h4 {
	position: relative;
	padding-left: 14px;
	margin-top: clamp(18px, 1.8vw, 32px);
	margin-bottom: clamp(6px, 0.6vw, 10px);
}
.s26-x-info h4:first-of-type { margin-top: clamp(10px, 1vw, 16px); } /* h3 바로 아래 첫 h4는 과한 간격 방지 */
.s26-x-info h4::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.5em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #140e4e;
}
/* h4 하위 리스트 — 점 대신 하이픈(-) */
.s26-x-info h4 ~ .s26-x-dotul li::before {
	content: '-';
	width: auto;
	height: auto;
	top: 0;
	border-radius: 0;
	background: none;
	color: #8a8a9a;
}
.s26-x-red { color: #d3273e; }
.s26-detail .s26-table-wrap { margin-top: clamp(12px, 1.2vw, 20px); }
/* 상세(모달) 표는 시안(876:58)에 세로 컬럼 구분선 있음 */
/* 모든 셀에 좌우 보더 + 표 가장자리 hidden — td+td 인접선택자는 rowspan 셀 낀 행에서 첫 세로줄 누락 */
.s26-detail .s26-table th,
.s26-detail .s26-table td { border-left: 1px solid #eceaf4; border-right: 1px solid #eceaf4; }
.s26-detail .s26-table { border-left: hidden; border-right: hidden; }

/* ----- 지역안내 (sub7) ----- */
/* 알약 탭 — 링크형 (관광지/특산물/교통 페이지 이동) */
.s26-tabs a {
	display: inline-flex;
	align-items: center;
	padding: clamp(10px, 0.9vw, 20px) clamp(18px, 1.7vw, 32px);
	border: 1px solid #f1f1f1;
	border-radius: 39px;
	background: #fff;
	font-weight: 400;
	font-size: clamp(15px, 14px + 0.31vw, 20px);
	letter-spacing: -0.03em;
	color: #000;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s;
}
.s26-tabs a.active { background: #190e99; border-color: #190e99; color: #fff; font-weight: 700; }
.s26-tabs a:hover { background: #190e99; border-color: #190e99; color: #fff; }
/* 와이드 탭 (Figma sub7-3 특산물: 315px 균등폭 3개) */
.s26-tabs--wide a, .s26-tabs--wide button { min-width: clamp(160px, 16.4vw, 315px); justify-content: center; }

/* 배너 메타 (주소 · 전화 — 관광지 배너 하단 줄) */
/* Figma 877:491 — 반투명 블러 필 안에 주소·전화 + 세로 구분선 */
.s26-banner__meta {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: clamp(16px, 1.66vw, 32px);
	margin-top: clamp(12px, 1.3vw, 25px);
	padding: 10px clamp(32px, 5.2vw, 100px);
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 25px;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}
.s26-banner__meta a {
	display: inline-flex;
	align-items: center;
	gap: clamp(8px, 0.73vw, 14px);
	font-weight: 400;
	font-size: clamp(16px, 15px + 0.47vw, 24px);
	letter-spacing: -0.04em;
	color: #fff;
	text-decoration: none;
}
.s26-banner__meta a:hover { text-decoration: underline; }
.s26-banner__meta .ico { width: auto; height: clamp(17px, 16px + 0.42vw, 24px); display: block; }
.s26-banner__meta-bar { width: 1px; height: 17px; background: rgba(255, 255, 255, 0.5); }

/* 사진 스트립 (시안 3장 그리드를 통짜 렌더 이미지 1장으로) */
.s26-photo-strip {
	display: block;
	width: 100%;
	max-width: 1400px;
	margin: clamp(32px, 4.2vw, 80px) auto 0;
	height: auto;
}

/* 숙박/식당 카드 (sub7-2 — 이미지 배경 + 오버레이 + 아이콘/제목/설명) */
/* Figma 915:651 — 카드 680x560 · r30 · 그림자 0 12 16 #140F4F 16% · 오버레이 60% */
.s26-stay-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(20px, 2.08vw, 40px);
	max-width: 1400px;
	margin: clamp(40px, 4.2vw, 80px) auto 0;
}
.s26-stay-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-height: clamp(300px, 29.2vw, 560px);
	border-radius: clamp(20px, 1.56vw, 30px);
	overflow: hidden;
	padding: clamp(40px, 4.2vw, 80px) 20px;
	box-sizing: border-box;
	text-decoration: none;
	box-shadow: 0 12px 16px 0 rgba(20, 15, 79, 0.16);
}
.s26-stay-card__bg { position: absolute; inset: 0; z-index: 0; }
.s26-stay-card__bg img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.s26-stay-card__bg::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.6); }
.s26-stay-card:hover .s26-stay-card__bg img { transform: scale(1.05); }
.s26-stay-card__icon { position: relative; z-index: 1; width: clamp(24px, 1.56vw, 30px); height: auto; }
.s26-stay-card__tit {
	position: relative;
	z-index: 1;
	margin-top: clamp(12px, 1.04vw, 20px);
	font-weight: 900;
	font-size: clamp(26px, 24px + 0.83vw, 40px);
	letter-spacing: -0.04em;
	color: #fff;
}
.s26-stay-card__txt {
	position: relative;
	z-index: 1;
	margin-top: clamp(20px, 2.08vw, 40px);
	font-weight: 400;
	font-size: clamp(18px, 17px + 0.68vw, 30px);
	letter-spacing: -0.04em;
	color: #fff;
}

/* ----- 푸터 (밝은 배경 위 솔리드 블랙으로 전환) ----- */
body.s26-body .m26-footer {
	background: #000; /* Figma 푸터 = 순흑 (픽셀 검증) */
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	box-shadow: none;
	/* 카드→푸터 간격은 .s26-content 하단 패딩(128)이 담당 */
}

/* 시안 고정 줄넘김 — 데스크톱에서만 적용, 좁은 화면은 자연 줄바꿈 */
@media (max-width: 1024px) {
	.s26-content br.pc_only { display: none; }
}

/* ----- 반응형 (레이아웃 얽힌 값만 미디어쿼리) ----- */
@media (max-width: 1024px) {
	/* LNB — 좁은 화면에선 드롭다운 (활성 메뉴명 버튼 → 세로 목록) */
	.s26-visual { overflow: visible; } /* 드롭다운 목록이 비주얼 밖으로 펼쳐지도록 */
	.s26-lnb__toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		width: 100%;
		height: 48px;
		padding: 0 20px;
		background: none;
		border: 0;
		font-weight: 700;
		font-size: 15px;
		letter-spacing: -0.02em;
		color: #fff;
		cursor: pointer;
	}
	.s26-lnb__toggle::after {
		content: '';
		width: 8px; height: 8px;
		margin-top: -4px;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		transform: rotate(45deg);
		transition: transform 0.2s;
	}
	.s26-lnb.open .s26-lnb__toggle::after { transform: rotate(225deg); margin-top: 4px; }
	.s26-lnb ul {
		display: none;
		position: absolute;
		top: 100%; left: 0; right: 0;
		flex-direction: column;
		overflow: visible;
		background: rgba(0, 0, 0, 0.8);
		backdrop-filter: blur(4px);
		-webkit-backdrop-filter: blur(4px);
	}
	.s26-lnb.open ul { display: flex; }
	.s26-lnb li { width: 100%; }
	.s26-lnb a { width: 100%; height: 46px; }

	/* 2컬럼/지그재그 → 세로 스택 */
	.s26-two, .s26-two--rev { flex-direction: column; align-items: center; }
	.s26-two__media { width: min(420px, 80vw); }
	.s26-two__txt .s26-sec-tit, .s26-two__txt .s26-desc--left, .s26-two__txt .s26-note { text-align: center; }
	.s26-zig, .s26-zig--rev { flex-direction: column; gap: 20px; } /* 세로 스택에선 이미지-텍스트 간격 축소 */
	.s26-zig .s26-desc { margin-top: 0; } /* s26-desc 기본 상단 마진이 gap과 겹쳐 과대 간격 방지 */
	.s26-zig__img { width: 100%; }
	/* 세로 스택에서는 반전 행도 좌측 정렬로 통일 */
	.s26-zig--rev .s26-zig__txt,
	.s26-zig--rev .s26-zig__txt .s26-desc--left,
	.s26-zig--rev .s26-zig__txt .s26-mid-tit { text-align: left; }
	/* 세로 스택 본문 가운데 정렬 (좌측 정렬 유지하는 --food 제외)
	   — sub1_5는 __txt와 --left가 같은 엘리먼트, 자손 형태도 함께 커버 */
	.s26-zig:not(.s26-zig--food) .s26-zig__txt.s26-desc--left,
	.s26-zig:not(.s26-zig--food) .s26-zig__txt .s26-desc--left { text-align: center; }

	/* 카드 그리드 축소 */
	.s26-ov-grid { grid-template-columns: repeat(2, 1fr); }
	.s26-ev-grid, .s26-photos, .s26-cat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ----- 640px 이하: 카드 1열 ----- */
@media (max-width: 640px) {
	.s26-ov-grid, .s26-events, .s26-ev-grid, .s26-photos, .s26-cat-grid, .s26-stay-grid, .s26-evw-grid { grid-template-columns: 1fr; }
}