/* ======================================
   Facility - ページ全体レイアウトスケール再設計
   1) コンテンツ幅ルール 2) outer/inner 3) 要素余白
   ====================================== */

:root {
	/* ページ：より明るいクリーム / カード：柔らかい薄ベージュ（参照右HP） */
	--facility-page-bg: #fcf0e0;
	--facility-header-bg: #ffffff;
	--facility-text-main: #544631;
	--facility-card-title: #333333;
	--facility-accent: #e1bc3b;
	--facility-green: #16a172;
	--facility-card-outer-bg: #faf6ec;
	/* 施設詳細カード */
	--facility-detail-card-bg: #f7efe3;
	--facility-detail-inner-bg: #f7efe3;
	--facility-detail-title: #333333;
	/* 施設概要・やや抑えめのティールグリーン */
	--facility-detail-green: #0d9a6a;
	--facility-detail-label-bg: #ffebb7ff;
	--facility-detail-accent: #e1bc3b;
	/* 旧変数互換（施設カード等） */
	--facility-card-bg: var(--facility-detail-card-bg);
	--facility-inner-bg: var(--facility-detail-inner-bg);
	--facility-text: var(--facility-detail-title);
	--facility-title: var(--facility-detail-title);
	--facility-green-text: var(--facility-detail-green);
	--facility-label-bg: var(--facility-detail-label-bg);
	/* 施設利用ガイド（移管元 Studio 計測値に準拠） */
	--facility-guide-pill-radius: 128px;
	--facility-guide-pill-border: #fad74a;
	--facility-guide-pill-hover-bg: #fad74a;
	--facility-guide-pill-hover-border: #fad74a;
	--facility-guide-cta-w: 759px;
	--facility-guide-cta-h: 80px;
	/* 施設利用ガイド・バッジ（緑ラベル） */
	--facility-guide-badge-w: 160px;
	--facility-guide-badge-h: 34px;
	/* 店舗棟 CTA：340×72（画像との gap は 40px） */
	--facility-west-cta-radius: 36px;
	--facility-west-cta-padding: 0 28px;
	--facility-west-cta-gap: 8px;
	--facility-west-cta-w: 340px;
	--facility-west-cta-h: 72px;
	--facility-west-cta-font-size: 24px;
	/* 店舗棟 CTA 枠線 */
	--facility-west-cta-border: #fad74a;
	/* 店舗棟画像：画面幅1500px時 752×423、それ以外は同比率で可変 */
	--facility-west-design-vw: 1500;
	--facility-west-image-w: 752px;
	--facility-west-image-h: 423px;
	--facility-west-img-w-fluid: min(
		var(--facility-west-image-w),
		calc(100vw * 752 / var(--facility-west-design-vw))
	);
	--facility-west-card-max-w: 1344px;
	--facility-west-card-pad: 32px;
	--facility-west-card-bg: #fcefdf;
	--facility-west-card-radius: 8px;
	--facility-west-card-min-h: 640px;
	--facility-west-row-gap: 40px;
	/* SP：店舗棟（西棟）カード枠 390×592 */
	--facility-west-sp-card-w: 390px;
	--facility-west-sp-card-h: 592px;
	/* ことまちベース外観画像：画面幅1500px時 674.63×449.75、それ以外は同比率で可変（上限674.63） */
	--facility-exterior-design-vw: 1500;
	--facility-exterior-img-w: 674.63px;
	--facility-exterior-img-h: 449.75px;
	--facility-exterior-img-w-fluid: min(
		var(--facility-exterior-img-w),
		calc(100vw * 674.63 / var(--facility-exterior-design-vw))
	);
	/* ラボ棟(東棟)1階画像：画面幅1500px時 622×349.69 */
	--facility-lab1-design-vw: 1500;
	--facility-lab1-img-w: 622px;
	--facility-lab1-img-h: 349.69px;
	--facility-lab1-img-w-fluid: min(
		var(--facility-lab1-img-w),
		calc(100vw * 622 / var(--facility-lab1-design-vw))
	);
	/* 固定header: margin-top 34px + 白バー min-height 65.33px（header微調整と同期） */
	--facility-fixed-header-offset: calc(34px + 65.33px);
	/* ラボ棟2階・主要設備テキストブロック（Figma: 幅431.84px・高さ67.17px・16px・#333） */
	--facility-equipment-text-max-w: 431.84px;
	--facility-equipment-text-line-height: 1.4; /* 67.17 ÷ 3行 ÷ 16px */
	--facility-equipment-text-color: #333333;
	/* ラボ棟2階パネル（Figma: 1344幅・padding32・背景#FFF7E5） */
	--facility-lab2-inner-bg: #fff7e5;
	--facility-lab2-inner-max-w: 1344px;
	--facility-lab2-inner-pad: 32px;
	--facility-lab2-inner-radius: 24px;
	/* SP：ラボ棟(東棟)2階 .facility-lab2-inner */
	--facility-lab2-sp-inner-w: 340px;
	--facility-lab2-sp-inner-h: 850px;
	/* SP：ラボ2階 縦並び画像（各 235×132） */
	--facility-lab2-sp-img-w: 235px;
	--facility-lab2-sp-img-h: 132px;
	/* ことまちベース外観：外＝薄ベージュのドーム、内＝一段明るいクリーム（ホワイトは使わない） */
	--facility-exterior-outer-bg: #fff7e5ff;
	--facility-exterior-arch-bg: #edd5c8;
	--facility-exterior-inner-bg: #fcefdf;
	--facility-exterior-inner-max-w: 1344px;
	--facility-exterior-inner-pad: 32px;
	--facility-exterior-inner-radius: 20px;
	--facility-exterior-shell-top-r: clamp(40px, 11.5vw, 64px);
	--facility-exterior-shell-bottom-r: clamp(0px, 0vw, 0px);
	/* SP 390 設計：ことまちベース外観シェル（幅のみ固定、高さはコンテンツに追従） */
	--facility-exterior-sp-w: 390px;
	/* SP 390 時：外観画像（294×196） */
	--facility-exterior-sp-img-w: 294px;
	--facility-exterior-sp-img-h: 196px;
	/* SP 390 時：外観見出しブロック幅 */
	--facility-exterior-sp-heading-w: 294px;
	/* SP 390 時：.facility-exterior-inner 内側幅 */
	--facility-exterior-sp-inner-w: 340px;
	/* SP：外観ブロック全体を下方向へずらす量（タブ〜シェル間の余白に加算） */
	--facility-exterior-sp-block-shift-y: 24px;
	/* 画面幅 1500px 以上：外観シェル全体（840 以下の SP ルールとは別） */
	--facility-exterior-design1500-shell-w: 1500px;
	--facility-exterior-design1500-shell-h: 770px;
	/* 画面幅 1500px 以上：外観内パネル .facility-exterior-inner */
	--facility-exterior-design1500-inner-w: 1344px;
	--facility-exterior-design1500-inner-h: 609px;
	/* ラボ棟1階パネル（Studio: 1344幅・padding32・角丸8px） */
	--s-color-1f85e7f7: #fdf9f3;
	--facility-lab1-inner-max-w: 1344px;
	--facility-lab1-inner-pad: 32px;
	--facility-lab1-inner-radius: 8px;
	/* SP 390：ラボ棟(東棟)1階 .facility-lab1-inner */
	--facility-lab1-sp-inner-w: 342px;
	--facility-lab1-sp-inner-h: 572px;
	--facility-lab1-sp-img-w: 222px;
	--facility-lab1-sp-img-h: 124px;
	/* SP：ラボ1階 施設概要ラベル（3つとも 116×42） */
	--facility-lab1-sp-label-w: 116px;
	--facility-lab1-sp-label-h: 42px;
	/* ヒーロー下ナビタブ（4枚共通） */
	--facility-tab-w: 278px;
	--facility-tab-h: 90px;
	/* SP：FACILITY / 施設情報 ブロック（Studio 実測 265×112 相当） */
	--facility-hero-head-w: 265px;
	--facility-hero-head-h: 112px;
}

/* --------------------------------------
   ページ全体・親要素干渉排除（Y座標・幅）
   style.css body { padding-top: 40px } 等を無効化
   -------------------------------------- */
body.page-facility,
body.page-template-page-facility,
body:has(.page-facility) {
	margin: 0 !important;
	padding-top: 0 !important;
	background: #fcefdfff;
}

html:has(body.page-facility) {
	background: var(--facility-page-bg);
}

body.page-facility #page,
body.page-facility .site,
body.page-template-page-facility #page,
body.page-template-page-facility .site,
body:has(.page-facility) #page,
body:has(.page-facility) .site {
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.page-facility main,
body.page-facility main.site-main,
body.page-facility .site-main,
body.page-facility .entry-content,
body.page-facility .page-content {
	max-width: none !important;
	margin: 0 !important;
	width: 100%;
	box-sizing: border-box;
}

/* main 以外は padding 0。page-facility main だけ下記で上書き */
body.page-facility .entry-content,
body.page-facility .page-content,
body.page-facility .site-main:not(main) {
	padding: 0 !important;
}

/* 固定ヘッダー直下に main を開始 → hero の padding-top 100px でタイトルYを移管元と整合 */
body.page-facility main.page-facility {
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-bottom: 0 !important;
	/* 横はみ出し・右側ベージュ帯を防ぐ */
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: clip;
}

.page-facility p,
.page-facility h1,
.page-facility h2,
.page-facility h3,
.page-facility ul,
.page-facility li {
	margin: 0;
}

.page-facility *,
.page-facility *::before,
.page-facility *::after {
	box-sizing: border-box;
}

.facility-page {
	background: var(--facility-page-bg);
	min-height: 100vh;
	padding: 0;
	margin: 0;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	color: var(--facility-text-main);
	overflow-x: clip;
}

/* --------------------------------------
   ヒーロー（DevTools実測）
   width 1500px / min-height 481.98px / padding 100px 上下
   -------------------------------------- */
.facility-hero {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0 auto;
	/* event/passion と同じFV感：余白はセクションの padding でコントロール */
	padding: 200px 0px 100px 0px;
	text-align: center;
	box-sizing: border-box;
	background: transparent;
}

.facility-hero-inner {
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
	padding: 0 24px;
	box-sizing: border-box;
}

/* FACILITY / 施設情報（SP で寸法指定時は .facility-hero-head で括る） */
.facility-hero-head {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

.facility-hero-title {
	margin: 0;
	color: var(--facility-text-main);
	font-family: inherit !important;
	font-size: 56px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.04em;
}

.facility-hero-subtitle {
	margin: 0;
	color: var(--facility-text-main);
	font-family: inherit !important;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.04em;
}

/* タブ列（実測ベース + 微調整でやや下げ） */
.facility-tabs {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 48px;
	margin-bottom: 0;
	padding: 0;
	width: 100%;
}

.facility-tab {
	width: var(--facility-tab-w);
	max-width: min(var(--facility-tab-w), 100%);
	height: var(--facility-tab-h);
	min-height: var(--facility-tab-h);
	padding: 10px 16px 10px 18px;
	box-sizing: border-box;
	border-radius: 8px;
	background: #ffffff;
	border: 1px solid rgba(74, 61, 48, 0.08);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	color: #493d33;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	align-content: center;
	gap: 12px;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	/* テキストと緑アイコンの縦位置を揃える */
	flex-wrap: nowrap;
}

.facility-tab:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* ヒーロー下4タブのラベル（ことまちベース外観・ラボ棟1階/2階・店舗棟） */
.facility-tab-text {
	font-family: inherit !important;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	min-height: 0;
	color: #333333;
}

.facility-tab-icon {
	width: 18px;
	height: 18px;
	min-width: 18px;
	min-height: 18px;
	padding: 0;
	background: var(--facility-green);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	align-self: center;
	line-height: 0;
}

.facility-tab-icon .material-icons {
	font-family: 'Material Icons' !important;
	font-size: 16px;
	line-height: 1;
	width: 16px;
	height: 16px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	/* アイコン字形のベースラインずれを抑える */
	vertical-align: middle;
}

/* --------------------------------------
   施設詳細セクション（2カラム：左 概要 / 右 画像）
   -------------------------------------- */
.facility-detail-block {
	padding: 0px 32px;
	box-sizing: border-box;
	background-color: #fcf1e1;
}

.facility-detail-block2 {
	padding: 80px 32px;
	box-sizing: border-box;
	background-color: #fdf9f3ff;
}

.facility-detail-block:last-of-type {
	margin-bottom: 0;
}

/* ことまちベース外観：店舗棟（西棟）タブ直下〜セクション上端まで 180px */
/* ↔ ラボ棟1階：セクション間は右デザインに合わせて詰める */
#facility.facility-detail-block {
	margin-bottom: 88px;
}

/* ラボ棟1階：セクション全体をクリームで括る（Studio #utilization: bg #FCEFDF・padding 80px 60px） */
#utilization.facility-detail-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 80px 60px;
	background: #fcefdf;
	box-sizing: border-box;
	
}

/* ことまちベース外観の直下ではラボ1階セクションの上余白だけ詰める（右デザイン） */
.page-facility #facility + #utilization.facility-detail-block {
	padding-top: 44px;
}

.facility-detail-card {
	max-width: 1520px;
	margin: 0 auto;
	padding: 64px 64px 72px;
	background: var(--facility-detail-card-bg);
	border-radius: 40px;
	box-sizing: border-box;
	box-shadow: 0 6px 32px rgba(74, 61, 48, 0.08);
}

.facility-detail-heading {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 40px;
}

.facility-detail-bar {
	width: 5px;
	height: 52px;
	border-radius: 999px;
	background: var(--facility-detail-accent);
	flex-shrink: 0;
}

.facility-detail-heading h2 {
	margin: 0;
	color: var(--facility-detail-title);
	font-family: inherit !important;
	font-size: 40px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.05em;
}

.facility-detail-content {
	display: grid;
	/* 左：概要 約42% / 右：画像 約58%（参照：画像列を大きく） */
	grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr);
	gap: 88px;
	align-items: start;
}

/* ラボ棟2階: 主要設備テキスト幅431.84px相当を確保（左列をやや広げる） */
#other .facility-detail-content {
	grid-template-columns: minmax(0, 0.48fr) minmax(0, 0.52fr);
}

.facility-detail-card--lab2 {
	max-width: var(--facility-lab2-inner-max-w);
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	background: transparent;
	box-shadow: none;
}

.facility-lab2-inner {
	width: 100%;
	max-width: var(--facility-lab2-inner-max-w);
	margin: 0 auto;
	padding: var(--facility-lab2-inner-pad);
	background: var(--facility-lab2-inner-bg);
	border-radius: var(--facility-lab2-inner-radius);
	box-sizing: border-box;
	box-shadow: 0 6px 32px rgba(74, 61, 48, 0.08);
}

/* 施設利用ガイドはパネル（.facility-lab2-inner）の外・下に配置 */
#other .facility-detail-guide {
	margin-top: 0;
}

/* ことまちベース外観：薄色ドーム＋背面のアーチ（::before）＋手前の内側パネル */
#facility .facility-exterior-shell {
	position: relative;
	z-index: 0;
	width: 100%;
	max-width: var(--facility-exterior-inner-max-w);
	margin-left: auto;
	margin-right: auto;
	padding: 36px 28px 32px;
	overflow: visible;
	background: var(--facility-exterior-outer-bg);
	border-radius: var(--facility-exterior-shell-top-r) var(--facility-exterior-shell-top-r)
		var(--facility-exterior-shell-bottom-r) var(--facility-exterior-shell-bottom-r);
	box-sizing: border-box;
	box-shadow: 0 6px 32px rgba(74, 61, 48, 0.08);
}

/* 中央画像上部のアーチ装飾（::before）は全画面幅で非表示 */
#facility .facility-exterior-shell::before {
	display: none;
	content: none;
}

.facility-exterior-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	padding: var(--facility-exterior-inner-pad);
	background: var(--facility-exterior-inner-bg);
	border-radius: var(--facility-exterior-inner-radius);
	box-sizing: border-box;
	box-shadow: 0 2px 16px rgba(74, 61, 48, 0.06);
}

/* 右デザイン：見出し2行（ことまちベース / 外観） */
.facility-detail-heading--exterior {
	align-items: stretch;
}

.facility-exterior-title {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.08em;
	margin: 0;
	color: var(--facility-detail-title);
	font-family: inherit !important;
	font-size: inherit;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.05em;
}

.facility-exterior-title__line {
	display: block;
}

/* 2行見出しに合わせてバーを縦に伸ばす */
#facility .facility-detail-heading--exterior .facility-detail-bar {
	width: 5px;
	height: auto;
	align-self: stretch;
	min-height: 2.6em;
}

.facility-detail-card--lab1 {
	max-width: var(--facility-lab1-inner-max-w);
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	background: transparent;
	box-shadow: none;
}

.facility-lab1-inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	max-width: var(--facility-lab1-inner-max-w);
	margin: 0 auto;
	padding: var(--facility-lab1-inner-pad);
	background: var(--s-color-1f85e7f7);
	border-radius: var(--facility-lab1-inner-radius);
	box-sizing: border-box;
	box-shadow: 0 6px 32px rgba(74, 61, 48, 0.08);
}

.facility-lab1-inner .facility-detail-content {
	width: 100%;
}

/* ラボ棟1階：マークアップは「画像 → 施設概要」。1025px+ の 2 列では左=概要・右=画像 */
@media screen and (min-width: 1025px) {
	#utilization .facility-detail-content--lab1 .facility-detail-info {
		grid-column: 1;
		grid-row: 1;
	}

	#utilization .facility-detail-content--lab1 .facility-detail-media {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
	}
}

.facility-detail-info {
	min-width: 0;
}

.facility-detail-subheading {
	margin: 0 0 28px 0;
	color: var(--facility-detail-green);
	font-family: inherit !important;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.45;
	padding-bottom: 30px;
}

.facility-spec-list {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.facility-spec-row {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: 24px;
	align-items: start;
}

.facility-spec-label {
	min-height: 52px;
	padding: 14px 14px;
	background: var(--facility-detail-label-bg);
	border-radius: 4px;
	color: var(--facility-detail-title);
	font-family: inherit !important;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.facility-spec-value {
	color: #444444;
	font-family: inherit !important;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.95;
	padding-top: 14px;
	word-break: keep-all;
	overflow-wrap: break-word;
	overflow-x: visible;
	/* 横スクロールバーが下線に見えるのを防ぐ・装飾線なし */
	text-decoration: none;
	border-bottom: none;
}

/*
 * ラボ棟2階・主要設備: テキスト群を facility-spec-equipment-text で囲み、
 * デザイン幅431.84px・行間1.4 に合わせる。全文が欠けないよう overflow は visible。
 */
.facility-spec-equipment-text {
	width: min(100%, var(--facility-equipment-text-max-w));
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
	font-size: 16px;
	font-weight: 500;
	line-height: var(--facility-equipment-text-line-height);
	color: var(--facility-equipment-text-color);
	font-family: inherit !important;
	word-break: keep-all;
	overflow-wrap: break-word;
	overflow: visible;
}

.facility-spec-equipment-text .facility-spec-inline-nowrap {
	display: inline;
	white-space: normal;
	font-size: inherit;
	font-weight: inherit;
	overflow-wrap: anywhere;
}

.facility-detail-media {
	display: flex;
	flex-direction: column;
	gap: 32px;
	width: 100%;
	max-width: none;
	min-width: 0;
	justify-self: stretch;
}

.facility-detail-media img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	object-fit: cover;
}

.page-facility .facility-detail-media img {
	max-width: 100%;
}

.facility-detail-media--stack img {
	width: 100%;
}

/* ことまちベース外観：1500px幅時 674.63×449.75、画面に合わせて比率維持でスケール */
.facility-detail-content--image-only {
	grid-template-columns: 1fr;
	justify-items: center;
}

.facility-detail-content--image-only .facility-detail-media {
	width: min(100%, var(--facility-exterior-img-w-fluid));
	max-width: 100%;
	box-sizing: border-box;
	justify-self: center;
}

.facility-detail-content--image-only .facility-detail-media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 674.63 / 449.75;
	object-fit: cover;
	border-radius: 8px;
}

/* ことまちベース外観：右デザインどおり画像を大きく丸める */
#facility .facility-detail-content--image-only .facility-detail-media img {
	border-radius: clamp(14px, 3.8vw, 22px);
}

/* ラボ棟(東棟)1階：右カラム画像 1500px幅時 622×349.69、比率維持でスケール */
#utilization .facility-detail-media {
	width: min(100%, var(--facility-lab1-img-w-fluid));
	max-width: 100%;
	box-sizing: border-box;
	justify-self: end;
}

#utilization .facility-detail-media img {
	aspect-ratio: 622 / 349.69;
}

/* ラボ棟(東棟)2階：縦並び2枚 各 1500px幅時 622×349、比率維持でスケール（流体幅は1階と同じ 622/1500） */
#other .facility-detail-media--stack {
	width: min(100%, var(--facility-lab1-img-w-fluid));
	max-width: 100%;
	box-sizing: border-box;
	justify-self: end;
}

#other .facility-detail-media--stack img {
	aspect-ratio: 622 / 349;
}

/* 店舗棟（西棟）：クリーム背景のみビューポート全幅（テキスト・画像の配置・カード max-width は従来どおり） */
#facility-west.facility-detail-block {
	position: relative;
	isolation: isolate;
}

#facility-west.facility-detail-block::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
	background: var(--facility-west-card-bg);
	z-index: 0;
	pointer-events: none;
}

/* 店舗棟（西棟）：カード 1344 系・画像 752×423（背景は ::before に委譲） */
#facility-west .facility-detail-card {
	position: relative;
	z-index: 1;
	max-width: var(--facility-west-card-max-w);
	padding: 50px 32px 32px 32px;
	background: transparent;
	border-radius: var(--facility-west-card-radius);
	box-shadow: none;
}

@media screen and (min-width: 1025px) {
	#facility-west .facility-detail-card {
		min-height: var(--facility-west-card-min-h);
		box-sizing: border-box;
	}
}

#facility-west .facility-detail-heading {
	margin-bottom: 32px;
}

#facility-west .facility-detail-heading h2 {
	font-size: 40px;
	font-weight: 600;
	line-height: 1.32;
	letter-spacing: 0.05em;
}

.facility-detail-content--west {
	display: grid;
	/* 左列：画像 752px 相当（流体幅） / 右列：CTA（auto＝本文＋矢印の必要幅を確保、1fr だと minmax(0,1fr) で列が潰れてはみ出しやすい） */
	grid-template-columns: minmax(0, min(100%, var(--facility-west-img-w-fluid))) auto;
	/* 画像とボタンの間隔 40px（.facility-detail-content の gap:88px より優先させる） */
	gap: var(--facility-west-row-gap);
	column-gap: var(--facility-west-row-gap);
	row-gap: var(--facility-west-row-gap);
	align-items: center;
	/* 右列 auto のときもセルいっぱいに伸ばして配置を揃える */
	justify-items: stretch;
}

/* 店舗棟（西棟）：画像デザイン寸法 752×423（狭い幅では幅100%・比率維持で縮小） */
#facility-west .facility-detail-content--west {
	gap: 40px;
	column-gap: 40px;
	row-gap: 40px;
	grid-template-columns: minmax(0, min(100%, var(--facility-west-image-w))) auto;
}

#facility-west .facility-west-visual {
	min-width: 0;
	/* grid横並び時に width:100% が「列いっぱいに伸びる」→見た目上、画像側が主張しすぎて右列を圧迫しやすい。
	   画像列は grid-template-columns で制御し、要素自体は自動幅＋上限で扱う。 */
	width: auto;
	max-width: min(var(--facility-west-image-w), 100%);
	justify-self: start;
	align-self: center;
	box-sizing: border-box;
}

/* 右列（CTA）：ボタンは内容幅。列自体は auto で必要最小を確保し、セル内は左寄せ */
#facility-west .facility-west-actions {
	min-width: 0;
	width: max-content;
	max-width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	box-sizing: border-box;
}

#facility-west .facility-detail-media--west {
	display: block;
	width: 100%;
	max-width: min(var(--facility-west-image-w), 100%);
	margin: 0;
	overflow: hidden;
	border-radius: 8px;
}

#facility-west .facility-detail-media--west img {
	display: block;
	width: min(var(--facility-west-image-w), 100%);
	max-width: var(--facility-west-image-w);
	height: auto;
	max-height: var(--facility-west-image-h);
	aspect-ratio: 752 / 423;
	border-radius: 8px;
	object-fit: cover;
	object-position: center;
	box-sizing: border-box;
}

/* 画面幅 1500px 以上のみ：ことまちベース外観など（店舗棟のテキスト・画像配置はベースのまま／max-width:840px 系は無変更） */
@media screen and (min-width: 1500px) {
	/* .facility-detail-block の左右 32px を外し、シェルが実寸 1500px になるようにする */
	#facility.facility-detail-block {
		padding-left: 0;
		padding-right: 0;
	}

	/* ことまちベース外観：1500幅時は見出しを1行（SP〜1499px の2行レイアウトはそのまま） */
	#facility .facility-exterior-title {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		gap: 0;
		white-space: nowrap;
	}

	#facility .facility-exterior-title__line {
		display: inline;
		white-space: nowrap;
	}

	/* ことまちベース外観：シェル 1500×770（min-width:1500px のみ・max-width:840px 系は無変更） */
	#facility .facility-exterior-shell {
		box-sizing: border-box;
		width: min(100%, var(--facility-exterior-design1500-shell-w));
		max-width: var(--facility-exterior-design1500-shell-w);
		height: var(--facility-exterior-design1500-shell-h);
		min-height: var(--facility-exterior-design1500-shell-h);
		max-height: var(--facility-exterior-design1500-shell-h);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		overflow: hidden;
	}

	/* 内パネル 1344×609（border-box・中身ははみ出し時のみ縦スクロール） */
	#facility .facility-exterior-shell .facility-exterior-inner {
		box-sizing: border-box;
		flex: 0 0 auto;
		width: min(100%, var(--facility-exterior-design1500-inner-w));
		max-width: var(--facility-exterior-design1500-inner-w);
		height: var(--facility-exterior-design1500-inner-h);
		min-height: var(--facility-exterior-design1500-inner-h);
		max-height: var(--facility-exterior-design1500-inner-h);
		margin-left: auto;
		margin-right: auto;
		display: flex;
		flex-direction: column;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/*
 * 1241〜2500px で #facility-design-scale-root が is-scaled のとき、論理キャンバス幅は常に 1500px。
 * この間で viewport が 1500 未満のとき、上記 @media (min-width:1500px) が効かず外観だけ vw / 100vw 基準のままズレる。
 * スケール中は常に 1500 設計の外観ブロックに揃える。
 */
.facility-design-scale-root.is-scaled #facility.facility-detail-block {
	padding-left: 0;
	padding-right: 0;
}

.facility-design-scale-root.is-scaled #facility .facility-exterior-title {
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0;
	white-space: nowrap;
}

.facility-design-scale-root.is-scaled #facility .facility-exterior-title__line {
	display: inline;
	white-space: nowrap;
}

.facility-design-scale-root.is-scaled #facility .facility-exterior-shell {
	box-sizing: border-box;
	width: min(100%, var(--facility-exterior-design1500-shell-w));
	max-width: var(--facility-exterior-design1500-shell-w);
	height: var(--facility-exterior-design1500-shell-h);
	min-height: var(--facility-exterior-design1500-shell-h);
	max-height: var(--facility-exterior-design1500-shell-h);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.facility-design-scale-root.is-scaled #facility .facility-exterior-shell .facility-exterior-inner {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: min(100%, var(--facility-exterior-design1500-inner-w));
	max-width: var(--facility-exterior-design1500-inner-w);
	height: var(--facility-exterior-design1500-inner-h);
	min-height: var(--facility-exterior-design1500-inner-h);
	max-height: var(--facility-exterior-design1500-inner-h);
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* 100vw は transform 外のビューポート基準のため、スケール中は設計寸法の固定幅にする */
.facility-design-scale-root.is-scaled #facility .facility-detail-content--image-only .facility-detail-media {
	width: min(100%, var(--facility-exterior-img-w));
	max-width: var(--facility-exterior-img-w);
}

.facility-design-scale-root.is-scaled #facility .facility-detail-content--image-only .facility-detail-media img {
	border-radius: 22px;
}

.facility-west-actions {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	min-width: 0;
	padding: 0;
	box-sizing: border-box;
}

/* 店舗の詳細はこちら：高さ72固定・横幅は本文＋矢印に追従（親を超えない）。340px は目安で max にしない */
.facility-west-cta {
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
	gap: var(--facility-west-cta-gap);
	width: fit-content;
	max-width: 100%;
	min-width: 0;
	min-height: var(--facility-west-cta-h);
	max-height: var(--facility-west-cta-h);
	height: var(--facility-west-cta-h);
	padding: var(--facility-west-cta-padding);
	box-sizing: border-box;
	background: #ffffff;
	border: 1px solid var(--facility-west-cta-border);
	border-radius: var(--facility-west-cta-radius);
	color: #333333;
	text-decoration: none;
	font-family: inherit !important;
	/* 340px幅のCTAに対してテキストがはみ出す場合があるため、下限つきで自動縮小 */
	font-size: clamp(14px, 4.2vw, var(--facility-west-cta-font-size));
	font-weight: 500;
	line-height: 1.25;
	white-space: nowrap;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.facility-west-cta-text {
	display: block;
	flex: 0 1 auto;
	min-width: 0;
	line-height: 1.25;
}

.facility-west-cta:hover {
	background: #ffffff;
	border-color: var(--facility-west-cta-border);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	color: #333333;
}

.facility-west-cta-icon {
	/* 親(.facility-west-cta)の font-size に追従 */
	font-size: 1em !important;
	width: 1em;
	height: 1em;
	color: #333333;
	flex-shrink: 0;
}

/* 単体画像ブロック（他セクション用・中央寄せ） */
.facility-detail-media--single {
	max-width: 880px;
	width: 100%;
	justify-self: center;
}

/* 施設利用ガイド：759×80px（border-radius 128px・2px 枠・gap 16px）中央揃え */
.facility-detail-guide {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin-top: 0;
	padding: 0;
	box-sizing: border-box;
}

.facility-guide-cta {
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	gap: 16px;
	width: min(100%, var(--facility-guide-cta-w));
	max-width: var(--facility-guide-cta-w);
	height: var(--facility-guide-cta-h);
	min-height: var(--facility-guide-cta-h);
	padding: 0 20px 0 12px;
	background: #ffffff;
	border-radius: var(--facility-guide-pill-radius);
	border: 2px solid var(--facility-guide-pill-border);
	box-shadow: none;
	text-decoration: none;
	box-sizing: border-box;
	transition: background 0.2s ease, border-color 0.2s ease;
	margin-top: 180px;
	
}

.facility-guide-cta:hover {
	background: var(--facility-guide-pill-hover-bg);
	border-color: var(--facility-guide-pill-hover-border);
}

.facility-guide-cta-badge {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--facility-guide-badge-w);
	min-width: var(--facility-guide-badge-w);
	max-width: var(--facility-guide-badge-w);
	height: var(--facility-guide-badge-h);
	min-height: var(--facility-guide-badge-h);
	max-height: var(--facility-guide-badge-h);
	padding: 0 8px;
	background: var(--facility-green);
	color: #ffffff;
	border-radius: 999px;
	font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif !important;
	font-size: 18px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

.facility-guide-cta-text-wrap {
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
	flex: 0 1 auto;
	min-width: 0;
}

.facility-guide-cta-text {
	font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif !important;
	font-size: 20px;
	font-weight: 600;
	color: var(--facility-text-main);
	line-height: 1.35;
	white-space: nowrap;
}

.facility-guide-cta-icon {
	font-size: 32px !important;
	width: 24px;
	height: 24px;
	color: var(--facility-text-main);
	flex-shrink: 0;
}

/* --------------------------------------
   レスポンシブ（PC比率優先・狭幅で縮小）
   -------------------------------------- */
@media screen and (max-width: 1400px) {
	.facility-hero {
		padding-left: 16px;
		padding-right: 16px;
	}
}

@media screen and (max-width: 1024px) {
	body.page-facility main.page-facility {
		padding-top: calc(12px + 56px) !important;
	}

	.facility-hero {
		min-height: 0;
		padding-top: 80px;
		padding-bottom: 100px;
	}

	.facility-hero-title {
		font-size: 48px;
	}

	.facility-hero-subtitle {
		font-size: 20px;
	}

	.facility-tab {
		width: min(var(--facility-tab-w), 100%);
		max-width: var(--facility-tab-w);
		height: var(--facility-tab-h);
		min-height: var(--facility-tab-h);
		align-items: center;
	}

	#utilization.facility-detail-block {
		padding: 48px 32px;
	}

	.page-facility #facility + #utilization.facility-detail-block {
		padding-top: 28px;
	}

	#utilization .facility-detail-card {
		margin-left: 0;
		margin-right: 0;
		max-width: 100%;
	}

	.facility-detail-card {
		margin-left: 16px;
		margin-right: 16px;
		max-width: calc(100% - 32px);
		padding: 40px 32px 44px;
	}

	.facility-detail-card--lab2 {
		padding: 0;
	}

	.facility-lab2-inner {
		padding: 24px 20px;
		border-radius: 20px;
	}

	#facility .facility-exterior-shell {
		padding: 24px 22px 32px;
	}

	.facility-exterior-inner {
		padding: 24px 20px;
		border-radius: 18px;
	}

	.facility-detail-card--lab1 {
		padding: 0;
	}

	.facility-lab1-inner {
		padding: 24px 20px;
		border-radius: 8px;
	}

	.facility-detail-heading h2 {
		font-size: 36px;
	}

	.facility-detail-subheading {
		font-size: 20px;
		margin-bottom: 22px;
	}

	.facility-detail-content {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	/* #other の 48/52 を上書きし、狭幅でも1カラムに */
	#other .facility-detail-content {
		grid-template-columns: 1fr;
	}

	#utilization .facility-detail-media {
		justify-self: center;
	}

	#other .facility-detail-media--stack {
		justify-self: center;
	}

	/* 店舗棟：狭幅では画像→ボタンの縦並び（計測比は維持）・間隔40px */
	#facility-west .facility-detail-content--west {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 40px;
		row-gap: 40px;
		column-gap: 40px;
	}

	#facility-west .facility-detail-card {
		min-height: 0;
	}

	#facility-west .facility-detail-heading h2 {
		font-size: 32px;
	}

	.facility-west-visual {
		width: 100%;
		max-width: min(752px, 100%);
		margin: 0 auto;
	}

	.facility-detail-media--west {
		width: 100%;
	}

	.facility-detail-media--west img {
		width: 100%;
		height: auto;
		aspect-ratio: 752 / 423;
	}

	/* 店舗棟（西棟）：画像 752×423（1024px 以下・1カラム時も比率維持） */
	#facility-west .facility-west-visual {
		max-width: min(var(--facility-west-image-w), 100%);
	}

	#facility-west .facility-detail-media--west img {
		display: block;
		width: min(var(--facility-west-image-w), 100%);
		max-width: var(--facility-west-image-w);
		height: auto;
		max-height: var(--facility-west-image-h);
		aspect-ratio: 752 / 423;
		object-fit: cover;
		object-position: center;
	}

	.facility-west-actions {
		padding: 0;
	}

	.facility-west-cta {
		width: fit-content;
		max-width: 100%;
		min-width: 0;
		min-height: var(--facility-west-cta-h);
		max-height: var(--facility-west-cta-h);
		height: var(--facility-west-cta-h);
		padding: var(--facility-west-cta-padding);
		box-sizing: border-box;
		gap: var(--facility-west-cta-gap);
		white-space: nowrap;
		text-align: center;
		justify-content: center;
		margin: 0 auto;
	}

	.facility-detail-media {
		max-width: 640px;
		width: 100%;
		justify-self: center;
	}

	.facility-detail-guide {
		margin-top: 0;
	}

	.facility-guide-cta {
		width: min(100%, var(--facility-guide-cta-w));
		max-width: var(--facility-guide-cta-w);
		min-height: var(--facility-guide-cta-h);
		height: auto;
		flex-wrap: wrap;
		justify-content: center;
		padding: 0 16px 0 10px;
		gap: 16px;
	}

	.facility-guide-cta-badge {
		width: var(--facility-guide-badge-w);
		min-width: var(--facility-guide-badge-w);
		max-width: var(--facility-guide-badge-w);
		height: var(--facility-guide-badge-h);
		min-height: var(--facility-guide-badge-h);
		max-height: var(--facility-guide-badge-h);
		padding: 0 8px;
		font-size: 16px;
		line-height: 1;
	}

	.facility-guide-cta-text {
		font-size: 16px;
	}

	.facility-guide-cta-icon {
		font-size: 22px !important;
		width: 22px;
		height: 22px;
	}
}

/* ヒーロー下タブ：841〜1240px は 2×2 グリッド（テキスト左・アイコン右） */
@media screen and (min-width: 841px) and (max-width: 1240px) {
	.facility-tabs {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-content: center;
		align-items: stretch;
		gap: 16px;
		width: 100%;
		max-width: min(572px, 100%);
		margin-left: auto;
		margin-right: auto;
	}

	.facility-tab {
		width: 100%;
		max-width: none;
		height: var(--facility-tab-h);
		min-height: var(--facility-tab-h);
		justify-content: space-between;
		align-items: center;
		padding: 10px 16px 10px 18px;
		box-sizing: border-box;
	}

	.facility-tab-text {
		display: flex;
		align-items: center;
		align-self: center;
		text-align: left;
		justify-content: flex-start;
		flex: 1;
		min-width: 0;
	}

	.facility-tab-icon {
		align-self: center;
		flex-shrink: 0;
	}

	/*
	 * ことまちベース外観：1500px 時と同一レイアウト（841〜1240・全体スケール対象外）
	 * max-width:1024px 帯のシェル／内パネル／画像上書きより後で指定するため本ブロックで勝つ
	 */
	#facility.facility-detail-block {
		padding-left: 0;
		padding-right: 0;
	}

	#facility .facility-exterior-title {
		font-size: 40px;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		gap: 0;
		white-space: nowrap;
	}

	#facility .facility-exterior-title__line {
		display: inline;
		white-space: nowrap;
	}

	#facility .facility-exterior-shell {
		box-sizing: border-box;
		width: min(100%, var(--facility-exterior-design1500-shell-w));
		max-width: var(--facility-exterior-design1500-shell-w);
		height: var(--facility-exterior-design1500-shell-h);
		min-height: var(--facility-exterior-design1500-shell-h);
		max-height: var(--facility-exterior-design1500-shell-h);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		overflow: hidden;
		padding: 36px 28px 32px;
	}

	#facility .facility-exterior-shell .facility-exterior-inner {
		box-sizing: border-box;
		flex: 0 0 auto;
		width: min(100%, var(--facility-exterior-design1500-inner-w));
		max-width: var(--facility-exterior-design1500-inner-w);
		height: var(--facility-exterior-design1500-inner-h);
		min-height: var(--facility-exterior-design1500-inner-h);
		max-height: var(--facility-exterior-design1500-inner-h);
		margin-left: auto;
		margin-right: auto;
		padding: var(--facility-exterior-inner-pad);
		border-radius: var(--facility-exterior-inner-radius);
		display: flex;
		flex-direction: column;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	#facility .facility-detail-content--image-only .facility-detail-media {
		width: min(100%, var(--facility-exterior-img-w));
		max-width: var(--facility-exterior-img-w);
	}

	#facility .facility-detail-content--image-only .facility-detail-media img {
		border-radius: 22px;
	}
}

/* ラボ棟2階：840px以下（340×850・画像上→施設概要下・背景#fdf9f3） */
@media screen and (max-width: 840px) {
	/* 390 幅で内側 340px になるよう横余白を抑え、カードに余計な padding を付けない */
	#other.facility-detail-block {
		padding-left: 16px;
		padding-right: 16px;
		box-sizing: border-box;
	}

	#other .facility-detail-card.facility-detail-card--lab2 {
		padding: 0;
		margin-left: auto;
		margin-right: auto;
		max-width: var(--facility-lab2-sp-inner-w);
		width: 100%;
		box-sizing: border-box;
	}

	#other .facility-lab2-inner {
		box-sizing: border-box;
		width: 100%;
		max-width: var(--facility-lab2-sp-inner-w);
		height: var(--facility-lab2-sp-inner-h);
		min-height: var(--facility-lab2-sp-inner-h);
		max-height: var(--facility-lab2-sp-inner-h);
		margin-left: auto;
		margin-right: auto;
		padding: 14px 12px 16px;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 16px;
		background: #fdf9f3;
		border-radius: 16px;
		box-shadow: 0 4px 24px rgba(74, 61, 48, 0.07);
	}

	#other .facility-lab2-inner .facility-detail-heading {
		flex-shrink: 0;
		margin-bottom: 0;
	}

	#other .facility-lab2-inner .facility-detail-content {
		flex: 1 1 auto;
		min-height: 0;
		display: flex;
		flex-direction: column;
		gap: 28px;
		align-items: stretch;
	}

	#other .facility-detail-heading {
		margin-bottom: 24px;
	}

	#other .facility-detail-media.facility-detail-media--stack {
		order: 1;
		width: 100%;
		max-width: 100%;
		justify-self: stretch;
		align-self: stretch;
		align-items: center;
		gap: 24px;
	}

	#other .facility-detail-media--stack img {
		display: block;
		width: min(var(--facility-lab2-sp-img-w), 100%);
		height: auto;
		max-width: var(--facility-lab2-sp-img-w);
		max-height: var(--facility-lab2-sp-img-h);
		aspect-ratio: 235 / 132;
		object-fit: cover;
		object-position: center;
		border-radius: 8px;
	}

	#other .facility-detail-info {
		order: 2;
		width: 100%;
		min-width: 0;
	}

	#other .facility-lab2-inner .facility-spec-list {
		align-items: stretch;
		width: 100%;
	}

	#other .facility-lab2-inner .facility-spec-row {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		box-sizing: border-box;
		grid-template-columns: var(--facility-lab1-sp-label-w) minmax(0, 1fr);
		gap: 12px;
		align-items: start;
		justify-items: stretch;
	}

	#other .facility-lab2-inner .facility-spec-label {
		box-sizing: border-box;
		width: 100%;
		max-width: var(--facility-lab1-sp-label-w);
		height: var(--facility-lab1-sp-label-h);
		min-height: var(--facility-lab1-sp-label-h);
		max-height: var(--facility-lab1-sp-label-h);
		min-width: 0;
		padding: 4px 8px;
		font-size: 16px;
		line-height: 1.3;
	}

	#other .facility-lab2-inner .facility-spec-value {
		text-align: left;
		min-width: 0;
	}

	#other .facility-detail-subheading {
		margin-bottom: 18px;
		padding-bottom: 16px;
	}

	/* 店舗棟（西棟）：390×592（841px 以下・カード全体）／全幅 ::before は使わず従来のカード背景 */
	#facility-west.facility-detail-block::before {
		display: none;
	}

	#facility-west.facility-detail-block {
		padding-left: 0;
		padding-right: 0;
		box-sizing: border-box;
	}

	#facility-west .facility-detail-card {
		box-sizing: border-box;
		width: min(100%, var(--facility-west-sp-card-w));
		max-width: var(--facility-west-sp-card-w);
		height: var(--facility-west-sp-card-h);
		min-height: var(--facility-west-sp-card-h);
		max-height: var(--facility-west-sp-card-h);
		margin-left: auto;
		margin-right: auto;
		padding: 20px 18px 22px;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		background: var(--facility-west-card-bg);
	}

	#facility-west .facility-detail-heading {
		flex-shrink: 0;
		margin-bottom: 20px;
		padding-top: 80px;
	}

	#facility-west .facility-detail-content--west {
		flex: 1 1 auto;
		min-height: 0;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 28px;
		row-gap: 60px;
		column-gap: 28px;
	}

	#facility-west .facility-west-visual {
		flex-shrink: 0;
		width: 100%;
		max-width: min(var(--facility-west-image-w), 100%);
		margin-left: auto;
		margin-right: auto;
	}

	#facility-west .facility-detail-media--west img {
		display: block;
		width: min(var(--facility-west-image-w), 100%);
		max-width: var(--facility-west-image-w);
		height: auto;
		max-height: var(--facility-west-image-h);
		aspect-ratio: 752 / 423;
		object-fit: cover;
		object-position: center;
	}

	#facility-west .facility-west-actions {
		flex-shrink: 0;
		align-self: center;
		width: 100%;
		max-width: 100%;
		justify-content: center;
	}
}

@media screen and (max-width: 768px) {
	.facility-hero {
		padding-top: 64px;
		padding-bottom: 0;
	}

	.facility-hero-inner {
		padding: 0 16px;
	}

	.facility-tabs {
		flex-direction: column;
		margin-top: 36px;
		gap: 12px;
	}

	.facility-tab {
		width: min(var(--facility-tab-w), 100%);
		max-width: var(--facility-tab-w);
		height: var(--facility-tab-h);
		min-height: var(--facility-tab-h);
		align-items: center;
	}

	.facility-tab-text {
		display: flex;
		align-items: center;
		align-self: center;
	}

	.facility-detail-card {
		border-radius: 32px;
		padding: 32px 24px 36px;
	}

	.facility-detail-card--lab2 {
		padding: 0;
	}

	.facility-lab2-inner {
		padding: 20px 18px;
		border-radius: 20px;
	}

	#facility .facility-exterior-shell {
		padding: 20px 18px 28px;
	}

	.facility-exterior-inner {
		padding: 20px 18px;
		border-radius: 16px;
	}

	.facility-detail-card--lab1 {
		padding: 0;
	}

	.facility-lab1-inner {
		padding: 20px 18px;
		border-radius: 8px;
	}

	.facility-detail-heading h2 {
		font-size: 28px;
	}

	#facility-west .facility-detail-heading h2 {
		font-size: 32px;
	}

	.facility-detail-subheading {
		font-size: 19px;
	}

	.facility-detail-bar {
		height: 36px;
	}

	.facility-guide-cta {
		flex-wrap: wrap;
		justify-content: center;
		padding: 0 14px 0 10px;
		gap: 4px;
	}

	.facility-guide-cta-text-wrap {
		flex: 1 1 auto;
		justify-content: center;
	}
}

@media screen and (max-width: 540px) {
	/* .facility-hero-title は max-width:840px ブロックで clamp 指定（421〜840 で崩れ防止） */

	#utilization.facility-detail-block {
		padding: 40px 16px;
	}

	.page-facility #facility + #utilization.facility-detail-block {
		padding-top: 22px;
	}

	#utilization .facility-detail-card {
		margin-left: 0;
		margin-right: 0;
		max-width: 100%;
	}

	.facility-detail-card {
		border-radius: 28px;
		padding: 24px 18px 28px;
		margin-left: 12px;
		margin-right: 12px;
		max-width: calc(100% - 24px);
	}

	.facility-detail-card--lab2 {
		padding: 0;
	}

	.facility-lab2-inner {
		padding: 18px 14px;
		border-radius: 18px;
	}

	#facility .facility-exterior-shell {
		padding: 18px 14px 24px;
	}

	.facility-exterior-inner {
		padding: 18px 14px;
		border-radius: 14px;
	}

	.facility-detail-card--lab1 {
		padding: 0;
	}

	.facility-lab1-inner {
		padding: 18px 14px;
		border-radius: 8px;
	}

	.facility-detail-heading h2 {
		font-size: 32px;
	}

	#facility-west .facility-detail-heading h2 {
		font-size: 32px;
	}

	.facility-detail-subheading {
		font-size: 17px;
		margin-bottom: 18px;
	}

	.facility-spec-list {
		gap: 18px;
	}

	.facility-spec-row {
		grid-template-columns: 88px 1fr;
		gap: 12px;
	}

	.facility-spec-label {
		font-size: 13px;
		padding: 10px 8px;
		min-height: 44px;
	}

	.facility-spec-value {
		font-size: 16px;
		line-height: 1.85;
		padding-top: 10px;
	}

	.facility-spec-equipment-text {
		font-size: 16px;
		line-height: var(--facility-equipment-text-line-height);
	}

	.facility-guide-cta {
		flex-direction: column;
		align-items: stretch;
		border-radius: 48px;
		padding: 12px 14px;
		width: min(100%, var(--facility-guide-cta-w));
		max-width: min(var(--facility-guide-cta-w), calc(100% - 8px));
		min-height: var(--facility-guide-cta-h);
		height: auto;
	}

	.facility-guide-cta-badge {
		align-self: center;
		width: var(--facility-guide-badge-w);
		min-width: var(--facility-guide-badge-w);
		max-width: var(--facility-guide-badge-w);
		height: var(--facility-guide-badge-h);
		min-height: var(--facility-guide-badge-h);
		max-height: var(--facility-guide-badge-h);
		justify-content: center;
		white-space: nowrap;
		text-align: center;
		padding: 0 8px;
		font-size: 12px;
		line-height: 1;
	}

	.facility-guide-cta-text-wrap {
		justify-content: center;
		text-align: center;
		flex-wrap: wrap;
	}

	.facility-guide-cta-text {
		font-size: 15px;
		white-space: normal;
	}

	.facility-guide-cta-icon {
		font-size: 20px !important;
		width: 20px;
		height: 20px;
	}

	/* 店舗棟（西棟）画像 752×423（狭いカード内は幅100%・比率維持） */
	#facility-west .facility-detail-media--west img {
		display: block;
		width: min(var(--facility-west-image-w), 100%);
		max-width: var(--facility-west-image-w);
		height: auto;
		max-height: var(--facility-west-image-h);
		aspect-ratio: 752 / 423;
		object-fit: cover;
		object-position: center;
	}

	.facility-west-cta {
		width: fit-content;
		max-width: 100%;
		min-width: 0;
		min-height: var(--facility-west-cta-h);
		max-height: var(--facility-west-cta-h);
		height: var(--facility-west-cta-h);
		padding: 0 16px;
		box-sizing: border-box;
		font-size: clamp(14px, 4.2vw, var(--facility-west-cta-font-size));
		border-radius: var(--facility-west-cta-radius);
		white-space: nowrap;
	}

	.facility-west-cta-icon {
		font-size: 1em !important;
		width: 1em;
		height: 1em;
	}
}

/* --------------------------------------
   300〜840px：施設ヒーロー＋タブ（390基準の比率を clamp で維持）
   390px 時の見た目を基準に、狭い幅では比例縮小・841px 未満では上限で固定
   ※ 839px 以下では JS により .is-scaled-mobile で 390 キャンバス＋等比スケール。
      その際 vw はズレるため、末尾「モバイル一括スケール」で cqw に置換。
   -------------------------------------- */
@media screen and (max-width: 840px) {
	body.page-facility main.page-facility {
		/* header.css（固定ヘッダー）と同期 */
		--facility-sp-main-top: calc(12px + 72px + 8px);
		padding-top: var(--facility-sp-main-top) !important;
	}

	.facility-hero {
		/* 上のみ。タブ〜外観セクション間は #facility margin-top:180px */
		/* 初回1画面フィル用の min-height / flex:1 は余白が ~100vh になるため廃止 */
		padding: clamp(40px, 16.41vw, 64px) 0 0;
		min-height: 0;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.facility-hero-inner {
		padding: 0;
		width: 100%;
		max-width: 100%;
		flex: none;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		min-height: 0;
	}

	.facility-hero-head {
		width: min(100%, clamp(204px, 67.95vw, 265px));
		max-width: clamp(204px, 67.95vw, 265px);
		min-height: var(--facility-hero-head-h);
		height: auto;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		flex-shrink: 0;
	}

	/* 56 / 390・24 / 390 を vw で再現し、上限で 390 相当に固定 */
	.facility-hero-title {
		font-size: clamp(2.5rem, 14.359vw, 3.5rem);
		line-height: 1.2;
		letter-spacing: 0.03em;
		margin: 0;
	}

	.facility-hero-subtitle {
		font-size: clamp(1.125rem, 6.154vw, 1.5rem);
		line-height: 1.45;
		margin: 0;
		margin-top: clamp(4px, 1.54vw, 6px);
	}

	.facility-tabs {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		align-self: center;
		justify-content: flex-start;
		width: min(278px, calc(100% - 32px));
		max-width: min(278px, calc(100% - 24px));
		margin: clamp(48px, 20.51vw, 80px) auto 0;
		padding: 0;
		gap: clamp(16px, 6.154vw, 24px);
		box-sizing: border-box;
	}

	.facility-tab {
		width: 100%;
		max-width: none;
		height: var(--facility-tab-h);
		min-height: var(--facility-tab-h);
		margin: 0;
		padding: clamp(8px, 2.56vw, 10px) clamp(10px, 3.59vw, 14px) clamp(8px, 2.56vw, 10px)
			clamp(12px, 4.1vw, 16px);
		justify-content: space-between;
		align-items: center;
		gap: clamp(8px, 2.56vw, 10px);
		border-radius: 10px;
		box-sizing: border-box;
	}

	.facility-tab-text {
		display: flex;
		align-items: center;
		align-self: center;
		font-size: clamp(0.9375rem, 5.128vw, 1.25rem);
		line-height: 1.35;
		text-align: center;
		justify-content: center;
		flex: 1;
		min-width: 0;
	}

	.facility-tab-icon {
		flex-shrink: 0;
		align-self: center;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* ことまちベース外観：幅は 390 設計、高さは中身に合わせる（固定 549/390 だと下に空きができる） */
	#facility.facility-detail-block {
		padding-left: 0;
		padding-right: 0;
		padding-top: var(--facility-exterior-sp-block-shift-y);
		margin-bottom: clamp(40px, 9vw, 72px);
	}

	#facility .facility-exterior-shell {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		width: min(100%, var(--facility-exterior-sp-w));
		height: auto;
		min-height: 0;
		max-width: var(--facility-exterior-sp-w);
		margin-left: auto;
		margin-right: auto;
		padding: 12px 12px 14px;
		overflow: hidden;
		border-radius: clamp(40px, 12.3vw, 56px) clamp(40px, 12.3vw, 56px)
			clamp(22px, 5.6vw, 30px) clamp(22px, 5.6vw, 30px);
		box-shadow: 0 4px 22px rgba(74, 61, 48, 0.07);
	}

	#facility .facility-exterior-inner {
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		flex: 0 0 auto;
		align-items: center;
		justify-content: flex-start;
		gap: 12px;
		width: min(var(--facility-exterior-sp-inner-w), 100%);
		max-width: var(--facility-exterior-sp-inner-w);
		height: auto;
		min-height: 0;
		max-height: none;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		overflow: hidden;
		border-radius: clamp(14px, 3.8vw, 20px) clamp(14px, 3.8vw, 20px)
			clamp(12px, 3.2vw, 16px) clamp(12px, 3.2vw, 16px);
		box-shadow: inset 0 1px 0 rgba(84, 70, 49, 0.06);
	}

	#facility .facility-detail-heading.facility-detail-heading--exterior {
		box-sizing: border-box;
		flex-shrink: 0;
		width: min(var(--facility-exterior-sp-heading-w), 100%);
		max-width: var(--facility-exterior-sp-heading-w);
		height: auto;
		min-height: 0;
		max-height: none;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0;
		gap: clamp(8px, 2.2vw, 12px);
		align-items: stretch;
		justify-content: flex-start;
		overflow: hidden;
	}

	#facility .facility-detail-heading--exterior .facility-detail-bar {
		width: clamp(5px, 1.4vw, 8px);
		height: auto;
		min-height: 0;
		align-self: stretch;
		flex-shrink: 0;
	}

	#facility .facility-detail-heading h2,
	#facility .facility-exterior-title {
		font-size: 32px;
		line-height: 1.25;
		letter-spacing: 0.04em;
		word-break: keep-all;
		overflow-wrap: anywhere;
	}

	#facility .facility-exterior-title {
		flex: 0 0 auto;
		min-width: 0;
		max-height: none;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		line-height: 1.22;
	}

	/* 見出し＋画像（390 時 画像 294×196） */
	#facility .facility-detail-content.facility-detail-content--image-only {
		display: flex;
		flex-direction: column;
		flex: 0 0 auto;
		align-items: center;
		gap: 0;
		grid-template-columns: none;
		justify-items: center;
	}

	#facility .facility-detail-content--image-only .facility-detail-media {
		display: block;
		flex: 0 0 auto;
		width: min(var(--facility-exterior-sp-img-w), 100%);
		max-width: var(--facility-exterior-sp-img-w);
		margin-left: auto;
		margin-right: auto;
	}

	#facility .facility-detail-content--image-only .facility-detail-media img {
		display: block;
		width: min(var(--facility-exterior-sp-img-w), 100%);
		height: auto;
		max-width: var(--facility-exterior-sp-img-w);
		max-height: var(--facility-exterior-sp-img-h);
		aspect-ratio: 294 / 196;
		object-fit: cover;
		object-position: center;
		border-radius: clamp(12px, 3.5vw, 20px);
	}

	/* ラボ棟(東棟)1階：SP 390 時 342×572 */
	#utilization .facility-lab1-inner {
		box-sizing: border-box;
		width: min(var(--facility-lab1-sp-inner-w), 100%);
		max-width: var(--facility-lab1-sp-inner-w);
		height: var(--facility-lab1-sp-inner-h);
		min-height: var(--facility-lab1-sp-inner-h);
		max-height: var(--facility-lab1-sp-inner-h);
		margin-left: auto;
		margin-right: auto;
		padding: 14px 12px 16px;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 16px;
	}

	#utilization .facility-lab1-inner .facility-detail-heading {
		flex-shrink: 0;
	}

	#utilization .facility-lab1-inner .facility-detail-heading h2 {
		font-size: 32px;
	}

	/*
	 * SP：マークアップ順「画像 → 施設概要 → 表」（flex で grid 上書き・order は使わない）
	 * 表ブロック全体は中央／値は左揃え
	 */
	#utilization .facility-lab1-inner .facility-detail-content {
		flex: 1 1 auto;
		min-height: 0;
		display: flex;
		flex-direction: column;
		gap: 30px;
		align-items: stretch;
	}

	#utilization .facility-lab1-inner .facility-detail-info {
		flex-shrink: 0;
		min-width: 0;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
	}

	#utilization .facility-lab1-inner .facility-detail-subheading {
		text-align: left;
		align-self: stretch;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	/* 行ごと width:fit-content + 中央寄せをやめ、列を縦に一直線にする */
	#utilization .facility-lab1-inner .facility-spec-list {
		align-items: stretch;
		width: 100%;
	}

	#utilization .facility-lab1-inner .facility-spec-row {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		box-sizing: border-box;
		grid-template-columns: var(--facility-lab1-sp-label-w) minmax(0, 1fr);
		gap: 12px;
		align-items: start;
		justify-items: stretch;
	}

	#utilization .facility-lab1-inner .facility-spec-label {
		box-sizing: border-box;
		width: 100%;
		max-width: var(--facility-lab1-sp-label-w);
		height: var(--facility-lab1-sp-label-h);
		min-height: var(--facility-lab1-sp-label-h);
		max-height: var(--facility-lab1-sp-label-h);
		min-width: 0;
		padding: 4px 8px;
		font-size: 16px;
		line-height: 1.3;
	}

	#utilization .facility-lab1-inner .facility-spec-value {
		text-align: left;
		min-width: 0;
	}

	#utilization .facility-lab1-inner .facility-detail-media {
		width: min(var(--facility-lab1-sp-img-w), 100%);
		max-width: var(--facility-lab1-sp-img-w);
		margin-left: auto;
		margin-right: auto;
		justify-self: center;
		flex-shrink: 0;
		align-self: center;
	}

	#utilization .facility-lab1-inner .facility-detail-media img {
		display: block;
		width: min(var(--facility-lab1-sp-img-w), 100%);
		height: auto;
		max-width: var(--facility-lab1-sp-img-w);
		max-height: var(--facility-lab1-sp-img-h);
		aspect-ratio: 222 / 124;
		object-fit: cover;
		object-position: center;
		border-radius: 8px;
	}
}

/* --------------------------------------
   施設ページ全体スケール：1241〜2500px で 1500px 設計を等比一括スケール
   （.facility-design-scale-clip → #facility-design-scale-root）
   -------------------------------------- */
.facility-design-scale-clip {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

.facility-design-scale-root:not(.is-scaled):not(.is-scaled-mobile) {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

/*
 * デスクトップ（1500 キャンバス）またはモバイル（390 キャンバス）でスケール中のみ。
 * JS が .facility-design-scale-clip--active を付与。
 */
body.page-facility:has(.facility-design-scale-clip--active) {
	overflow-x: hidden;
}

.facility-design-scale-clip--active {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: hidden;
	overflow-x: clip;
}

@media screen and (min-width: 1241px) and (max-width: 2500px) {
	body.page-facility {
		overflow-x: hidden;
	}

	.facility-design-scale-root.is-scaled {
		width: 1500px;
		max-width: none;
		flex-shrink: 0;
		margin-left: 0;
		margin-right: 0;
		transform-origin: top center;
		transform: scale(var(--fds-scale, 1));
		will-change: transform;
	}
}

/* 839px 以下：390px モバイル完成形を w/390 で一括スケール */
@media screen and (max-width: 839px) {
	body.page-facility {
		overflow-x: hidden;
	}

	.facility-design-scale-root.is-scaled-mobile {
		width: 390px;
		max-width: none;
		flex-shrink: 0;
		margin-left: 0;
		margin-right: 0;
		transform-origin: top center;
		transform: scale(var(--fms-scale, 1));
		will-change: transform;
	}
}

/*
 * is-scaled-mobile 時、ルートのレイアウト幅は 390px。vw は依然ビューポート基準のため
 * clamp 内の vw を cqw（コンテナ＝390px）に置き換え、390px 時と同じ計算にする。
 */
@media screen and (max-width: 839px) {
	@supports (width: 1cqw) {
		.facility-design-scale-root.is-scaled-mobile {
			container-type: inline-size;
			container-name: facility-mob;
		}

		.facility-design-scale-root.is-scaled-mobile .facility-hero {
			padding: clamp(40px, 16.41cqw, 64px) 0 0;
		}

		.facility-design-scale-root.is-scaled-mobile .facility-hero-head {
			width: min(100%, clamp(204px, 67.95cqw, 265px));
			max-width: clamp(204px, 67.95cqw, 265px);
		}

		.facility-design-scale-root.is-scaled-mobile .facility-hero-title {
			font-size: clamp(2.5rem, 14.359cqw, 3.5rem);
		}

		.facility-design-scale-root.is-scaled-mobile .facility-hero-subtitle {
			font-size: clamp(1.125rem, 6.154cqw, 1.5rem);
			margin-top: clamp(4px, 1.54cqw, 6px);
		}

		.facility-design-scale-root.is-scaled-mobile .facility-tabs {
			margin: clamp(48px, 20.51cqw, 80px) auto 0;
			gap: clamp(16px, 6.154cqw, 24px);
		}

		.facility-design-scale-root.is-scaled-mobile .facility-tab {
			padding: clamp(8px, 2.56cqw, 10px) clamp(10px, 3.59cqw, 14px) clamp(8px, 2.56cqw, 10px)
				clamp(12px, 4.1cqw, 16px);
			gap: clamp(8px, 2.56cqw, 10px);
		}

		.facility-design-scale-root.is-scaled-mobile .facility-tab-text {
			font-size: clamp(0.9375rem, 5.128cqw, 1.25rem);
		}

		.facility-design-scale-root.is-scaled-mobile #facility.facility-detail-block {
			margin-bottom: clamp(40px, 9cqw, 72px);
		}

		.facility-design-scale-root.is-scaled-mobile #facility .facility-exterior-shell {
			border-radius: clamp(40px, 12.3cqw, 56px) clamp(40px, 12.3cqw, 56px)
				clamp(22px, 5.6cqw, 30px) clamp(22px, 5.6cqw, 30px);
		}

		.facility-design-scale-root.is-scaled-mobile #facility .facility-exterior-inner {
			border-radius: clamp(14px, 3.8cqw, 20px) clamp(14px, 3.8cqw, 20px)
				clamp(12px, 3.2cqw, 16px) clamp(12px, 3.2cqw, 16px);
			padding-top: 15px;
			padding-bottom: 15px;
		}

		.facility-design-scale-root.is-scaled-mobile
			#facility
			.facility-detail-heading.facility-detail-heading--exterior {
			gap: clamp(8px, 2.2cqw, 12px);
		}

		.facility-design-scale-root.is-scaled-mobile
			#facility
			.facility-detail-heading--exterior
			.facility-detail-bar {
			width: clamp(5px, 1.4cqw, 8px);
		}

		.facility-design-scale-root.is-scaled-mobile
			#facility
			.facility-detail-content--image-only
			.facility-detail-media
			img {
			border-radius: clamp(12px, 3.5cqw, 20px);
		}

		.facility-design-scale-root.is-scaled-mobile #facility-west.facility-detail-block::before {
			left: 0;
			width: 100%;
			transform: none;
		}
	}
}

#facility.facility-detail-block {
	scroll-margin-top: 50px;
}

#utilization.facility-detail-block {
	scroll-margin-top: 70px;
}

#other.facility-detail-block2 {
	scroll-margin-top: 50px;
}

#facility-west.facility-detail-block {
	scroll-margin-top: 80px;
}