/* =========================================================
   八王子クリニック新町 — main.css
   Figma "八王子クリニック" pctop (node 287:2) 忠実再現
   ブランドカラーはFigma書き出しPNGから抽出（design.md未定義のため）
   ========================================================= */

:root {
	/* Brand colors — シルバーヒルズ八王子（青×薄黄。ロゴ#004EA2＋メインカラーPNG#FFF3D1抽出）
	   変数名は新町踏襲のため --green-* のままだが実値は青/薄黄 */
	--green-primary: #004ea2;   /* ブランド青: ボタン/フッター/濃カード/表ヘッダー */
	--green-primary-d: #003e82; /* 濃青ホバー */
	--green-accent: #3f76b5;    /* アクセント青: アイコン円/MENUライトカード */
	--green-accent-d: #2e5e9a;
	--green-soft: #fff3d1;      /* 薄黄: セクション淡背景（主役の色） */
	--green-mist: #fffbee;      /* さらに淡い黄 */
	--aqua-1: #9fc2e8;
	--aqua-2: #c3d9f0;

	/* design.md 由来 (グループカード等) */
	--purple-l: #f0e6f6;
	--pink-l: #fcecf3;

	/* Neutrals */
	--ink: #333333;          /* 見出し濃 */
	--ink-2: #555555;        /* 本文 (design.md color.555555) */
	--muted: #8a8a8a;
	--line: #e5e5e5;
	--line-2: #d9d9d9;       /* design.md color.d9d9d9 */
	--title-en: #cbc8c1;     /* 英字大見出し(薄グレー) */
	--white: #ffffff;

	/* Fonts */
	--f-sans: "Noto Sans JP", -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	--f-serif-jp: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
	--f-serif-en: "Cormorant Garamond", "Times New Roman", serif;

	/* Layout */
	--container: 1280px;
	--radius: 12px;
	--shadow-card: 0 10px 30px rgba(0, 29, 60, 0.08);
	--shadow-soft: 0 6px 20px rgba(0, 29, 60, 0.06);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--f-sans);
	color: var(--ink-2);
	font-size: 16px;
	line-height: 1.8;
	background: var(--white);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, p, dl, dd, dt { margin: 0; }
.chev { display: inline-block; }

/* ---------- Section head (共通見出し) ---------- */
.sec-head { display: flex; flex-direction: column; }
.sec-head--center { align-items: center; text-align: center; }
.sec-head--left { align-items: flex-start; text-align: left; }
.sec-head__en {
	font-family: var(--f-serif-en);
	font-weight: 500;
	font-size: clamp(38px, 5vw, 60px);
	line-height: 1;
	letter-spacing: .06em;
	color: var(--title-en);
}
.sec-head__jp {
	font-weight: 700;
	font-size: 17px;
	letter-spacing: .18em;
	color: var(--green-accent);
	margin-top: 12px;
}
.sec-head__jp--top { margin-top: 0; margin-bottom: 10px; }

/* ---------- Buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center;
	gap: 10px;
	font-weight: 700; font-size: 15px;
	padding: 15px 30px;
	border-radius: 999px;
	transition: .25s;
	cursor: pointer;
	line-height: 1.4;
}
.btn .chev { font-size: 1.1em; margin-left: 4px; }
.btn--primary { background: var(--green-accent); color: #fff; box-shadow: 0 8px 18px rgba(64, 126, 192,.35); }
.btn--primary:hover { background: var(--green-accent-d); }
.btn--ghost { background: #fff; color: var(--green-primary); border: 1.5px solid var(--green-accent); }
.btn--ghost:hover { background: var(--green-mist); }
.btn--outline { background: #fff; color: var(--ink); border: 1px solid var(--line-2); font-weight: 500; }
.btn--outline:hover { border-color: var(--green-accent); color: var(--green-primary); }
.btn--dark-outline { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.6); font-weight: 500; }
.btn--dark-outline:hover { background: rgba(255,255,255,.12); }
.btn--sm { padding: 11px 20px; font-size: 13px; }
.btn--block { width: 100%; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header {
	position: sticky; top: 0; z-index: 100;
	background: rgba(255,255,255,.96);
	backdrop-filter: blur(6px);
	box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
.site-header__inner {
	max-width: 1360px; margin: 0 auto;
	display: flex; align-items: center; gap: 20px;
	padding: 12px 28px;
}
.site-header__logo { display: flex; align-items: center; gap: 12px; }
.logo-text { display: flex; align-items: center; gap: 10px; }
.logo-text__en {
	font-family: var(--f-serif-en); font-weight: 600; font-size: 11px;
	line-height: 1.05; letter-spacing: .04em; color: #1f6fb2;
}
.logo-text__jp {
	font-weight: 900; font-size: 24px; letter-spacing: .02em; color: var(--green-primary);
}
.site-header__actions { margin-left: auto; display: flex; gap: 12px; }
.hbtn { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 236px; border-radius: 8px; padding: 8px 12px; line-height: 1.2; }
.hbtn__note { font-size: 11px; }
.hbtn__main { display: flex; align-items: center; gap: 8px; font-weight: 700; white-space: nowrap; }
.hbtn--reserve { background: var(--green-accent); color: #fff; }
.hbtn--reserve .hbtn__note { color: rgba(255,255,255,.9); }
.hbtn--reserve .hbtn__main { font-size: 15px; }
.hbtn--tel { background: #fff; border: 1px solid var(--line-2); color: var(--ink); }
.hbtn--tel .hbtn__note { color: var(--muted); font-size: 10px; }
.hbtn--tel .hbtn__main { font-size: 22px; letter-spacing: .02em; }

.global-nav { border-top: 1px solid var(--line); }
.global-nav__list {
	max-width: 1360px; margin: 0 auto;
	display: flex; justify-content: center;
}
.global-nav__list li { position: relative; flex: 0 0 auto; }
.global-nav__list li + li::before {
	content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
	width: 1px; height: 18px; background: var(--line);
}
.global-nav__list a {
	display: block; padding: 16px 34px; font-weight: 500; font-size: 15px; color: var(--ink);
	transition: .2s;
}
.global-nav__list a:hover { color: var(--green-primary); }

/* ---- 診療案内 メガメニュー / 検査をお考えの方へ ドロップダウン（PCのみ）
     新宿サイトのドロップダウンのトンマナ踏襲（2026-07-15）:
     90度の半透明グラデパネル・白文字・細い白区切り線・下角丸・ホバーで明るく・矢印反転。配色は新町の緑。 ---- */
.global-nav { position: relative; }
/* 矢印は新宿と同形式の「丸バッジ+白シェブロン」SVG（薄緑円。2026-07-16） */
.gn-caret { display: inline-block; width: 12px; height: 12px; margin-left: 6px; vertical-align: -1px;
	background: url(../images/nav-arrow.svg) no-repeat center / contain;
	transition: transform .3s ease; }
.has-mega:hover .gn-caret, .has-dd:hover .gn-caret { transform: scaleY(-1); }
/* ベースの .global-nav__list li { position: relative } を上書き（詳細度確保） */
.global-nav__list li.has-mega { position: static; }  /* メガは全幅(.global-nav基準)で配置 */
.global-nav__list li.has-dd { position: relative; }   /* ドロップダウンは項目基準 */

.mega {
	position: absolute; left: 0; right: 0; top: 100%; z-index: 120;
	background: linear-gradient(90deg, rgba(0, 62, 128, .95) 0%, rgba(55, 110, 169, .93) 100%);
	border-radius: 0 0 10px 10px;
	box-shadow: 0 18px 34px rgba(0, 29, 60, .22);
	opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.has-mega:hover > .mega, .has-mega:focus-within > .mega { opacity: 1; visibility: visible; transform: none; }
.mega__inner { max-width: 1280px; margin: 0 auto; padding: 28px 32px 34px; }
.mega__lead { margin-bottom: 20px; }
.mega__dock { display: inline-flex; align-items: center; background: #fff; color: var(--green-primary); font-weight: 700; font-size: 14px; padding: 11px 24px; border-radius: 999px; }
.mega__dock:hover { background: var(--green-mist); color: var(--green-primary-d); }
/* 整列（2026-07-16）: 6カラム等幅。見出しは高さを揃え、項目は1行固定+均一高で
   列をまたいだ行のガタつき（ラベル折り返しによる段差）を無くす */
.mega__cols { display: grid; grid-template-columns: repeat(6, 1fr); gap: 22px 18px; align-items: start; }
.mega__h { display: flex; align-items: flex-end; justify-content: center; min-height: 34px; font-weight: 700; font-size: 15px; color: #fff; letter-spacing: .06em; white-space: nowrap; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px solid rgba(255, 255, 255, .6); }
/* .global-nav__list a の padding/font-size 継承をリセットし、リンク有無で見出しの高さ・位置が変わらないようにする */
.mega__h a { display: inline; padding: 0; font-size: inherit; font-weight: inherit; letter-spacing: inherit; color: #fff; }
.mega__h a:hover { color: #fff; text-decoration: underline; }
.mega__col ul { display: flex; flex-direction: column; gap: 0; }
.mega__col li a { display: flex; align-items: center; min-height: 40px; padding: 0 6px; font-size: 12.5px; font-weight: 500; color: #fff; line-height: 1.45; letter-spacing: .02em; white-space: nowrap; border-bottom: 1px solid rgba(255, 255, 255, .28); transition: background .2s ease; }
.mega__col li:last-child a { border-bottom: none; }
.mega__col li a:hover { background: rgba(255, 255, 255, .16); color: #fff; text-decoration: none; }

.gn-drop {
	position: absolute; left: 50%; top: 100%; z-index: 120; min-width: 300px;
	transform: translateX(-50%) translateY(6px); background: none; border-radius: 0 0 10px 10px;
	box-shadow: 0 14px 26px rgba(0, 29, 60, .22); padding: 0; overflow: hidden;
	opacity: 0; visibility: hidden; transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.has-dd:hover > .gn-drop, .has-dd:focus-within > .gn-drop { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.gn-drop li a { display: block; padding: 20px 24px; font-size: 14px; font-weight: 500; letter-spacing: .1em; line-height: 1.6; color: #fff;
	background: linear-gradient(90deg, rgba(0, 62, 128, .92) 0%, rgba(55, 110, 169, .9) 100%);
	border-bottom: 1px solid #fff; border-radius: 0; transition: filter .2s ease; }
.gn-drop li:last-child a { border-bottom: none; }
.gn-drop li a:hover { filter: brightness(1.12); background: linear-gradient(90deg, rgba(0, 62, 128, .92) 0%, rgba(55, 110, 169, .9) 100%); color: #fff; }

.site-header__logo-img { height: 30px; width: auto; display: block; }
.nav-toggle { display: none; }

/* SP専用要素（ドロワー / 下部固定バー）はPCでは非表示 */
.sp-drawer { display: none; }
.sp-fixedbar { display: none; }

/* =========================================================
   HERO
   ========================================================= */
/* 新宿KV準拠：明朝の中央白コピー＋SVG波アニメーション。ボタンなし */
.hero {
	position: relative; overflow: hidden;
	/* 新KV画像(1672x941)のアスペクトに追従しつつ上下限を設ける */
	height: 56.28vw; min-height: 540px; max-height: 900px;
	display: flex; align-items: center; justify-content: center;
	background: #f9f5e8;
}
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg img {
	width: 100%; height: 100%; object-fit: cover;
	animation: hcs-kenburns 24s ease-in-out infinite alternate;
	will-change: transform;
}
@keyframes hcs-kenburns {
	0%   { transform: scale(1); }
	100% { transform: scale(1.07) translate(-.8%, .6%); }
}
.hero__bg::after {
	content: ""; position: absolute; inset: 0;
	background: rgba(255, 255, 255, .10); /* ほんのり明るく（新宿はオーバーレイなしの明るい写真） */
}
.hero__inner {
	position: relative; z-index: 2; width: 100%;
	padding: 0 28px 150px; /* 波の高さ分、コピーをやや上へ */
	text-align: center;
}
.hero__copy { max-width: none; }
/* 新宿KVと同じ「黒文字＋白グロー（発光縁取り）」表現 / Noto Serif JP */
.hero__title {
	font-family: var(--f-serif-jp);
	font-weight: 500; color: #000;
	font-size: clamp(38px, 4.8vw, 62px); line-height: 1.6; letter-spacing: .08em;
}
/* 1文字ずつのステガー表示（白グローはspan側に付与） */
.hero__ch {
	display: inline-block;
	-webkit-text-stroke: 2px rgba(255, 255, 255, 0.95);
	paint-order: stroke fill;
	text-shadow:
		0 0 3px rgba(255, 255, 255, 1),
		0 0 8px rgba(255, 255, 255, 1),
		0 0 16px rgba(255, 255, 255, 0.95),
		0 0 28px rgba(255, 255, 255, 0.85),
		0 2px 6px rgba(0, 0, 0, 0.25);
	opacity: 0; transform: translateY(.55em);
	animation: hcs-ch-rise .8s calc(var(--ci, 0) * 45ms + .25s) cubic-bezier(.22, .8, .35, 1) forwards;
}
@keyframes hcs-ch-rise {
	0%   { opacity: 0; transform: translateY(.55em); }
	100% { opacity: 1; transform: translateY(0); }
}
.hero__lead {
	font-family: var(--f-serif-jp);
	/* 最長行「限りなく病院に近い、サービス付き高齢者向け住宅です。」(26文字×letter-spacing .06em＝約27.6em幅)
	   が折り返さず、かつ左右にはみ出さないよう上限を併用（余裕を見て28で割る） */
	margin-top: 26px; font-size: min(clamp(16px, 1.9vw, 26px), calc((100vw - 56px) / 28)); font-weight: 500; color: #000;
	line-height: 1.9; letter-spacing: .06em;
	animation: hcs-ch-rise .9s 1.15s cubic-bezier(.22, .8, .35, 1) both;
	-webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.95);
	paint-order: stroke fill;
	text-shadow:
		0 0 3px rgba(255, 255, 255, 1),
		0 0 8px rgba(255, 255, 255, 1),
		0 0 16px rgba(255, 255, 255, 0.95),
		0 0 28px rgba(255, 255, 255, 0.85),
		0 2px 6px rgba(0, 0, 0, 0.25);
}
/* 各行をnowrapで固定（フォントサイズ側で幅内に収める） */
.hero__lead span { white-space: nowrap; }

/* ---- 浮遊する光の粒（上品なきらめき） ---- */
.hero__particles { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero__particles span {
	position: absolute; bottom: 18%;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.95), rgba(64, 126, 192,.5) 60%, transparent 75%);
	filter: blur(1px);
	opacity: 0;
	animation: hcs-particle 12s linear infinite;
}
.hero__particles span:nth-child(1) { left: 6%;  width: 10px; height: 10px; animation-duration: 13s; animation-delay: -2s; }
.hero__particles span:nth-child(2) { left: 16%; width: 6px;  height: 6px;  animation-duration: 10s; animation-delay: -7s; }
.hero__particles span:nth-child(3) { left: 27%; width: 13px; height: 13px; animation-duration: 15s; animation-delay: -4s; }
.hero__particles span:nth-child(4) { left: 38%; width: 7px;  height: 7px;  animation-duration: 11s; animation-delay: -9s; }
.hero__particles span:nth-child(5) { left: 52%; width: 9px;  height: 9px;  animation-duration: 14s; animation-delay: -1s; }
.hero__particles span:nth-child(6) { left: 64%; width: 6px;  height: 6px;  animation-duration: 10s; animation-delay: -6s; }
.hero__particles span:nth-child(7) { left: 75%; width: 12px; height: 12px; animation-duration: 16s; animation-delay: -3s; }
.hero__particles span:nth-child(8) { left: 86%; width: 8px;  height: 8px;  animation-duration: 12s; animation-delay: -8s; }
.hero__particles span:nth-child(9) { left: 94%; width: 6px;  height: 6px;  animation-duration: 11s; animation-delay: -5s; }
@keyframes hcs-particle {
	0%   { opacity: 0; transform: translateY(0) scale(.8); }
	12%  { opacity: .85; }
	55%  { opacity: .5; }
	100% { opacity: 0; transform: translateY(-52vh) scale(1.25); }
}

@media (prefers-reduced-motion: reduce) {
	.hero__bg img, .hero__ch, .hero__lead, .hero__particles span { animation: none; opacity: 1; transform: none; }
}

/* ---- 波アニメーション（新宿 gentle-wave 実装準拠・新町グリーン） ---- */
.hero__wave {
	position: absolute; left: 0; bottom: 0; width: 100%;
	line-height: 0; z-index: 1; pointer-events: none;
}
.waves {
	display: block; width: 100%;
	height: 230px; min-height: 130px; max-height: 300px;
	margin-bottom: -1px;
	transform: translateZ(0);
}
.parallax > use {
	animation: hcs-move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}
.parallax > use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; }
.parallax > use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; }
.parallax > use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; }
.parallax > use:nth-child(4) { animation-delay: -5s; animation-duration: 20s; }
@keyframes hcs-move-forever {
	0%   { transform: translate3d(-90px, 0, 0); }
	100% { transform: translate3d(85px, 0, 0); }
}

/* ---- ヒーロー直下バッジ（波にオーバーラップする横並び3枚） ---- */
.hero-badges {
	position: relative; z-index: 5;
	max-width: 1128px; margin: -96px auto 0; padding: 0 28px;
}
.hero-badges__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.hcard {
	background: #fff; border-radius: 12px;
	box-shadow: 0 20px 30px rgba(0, 0, 0, .10);
	padding: 40px 20px 36px; text-align: center;
}
.hcard__icon {
	display: flex; align-items: center; justify-content: center;
	width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 24px;
	background: linear-gradient(135deg, var(--green-accent), #578ec9);
	box-shadow: 0 6px 14px rgba(64, 126, 192, .4);
}
.hcard__title { display: block; font-weight: 700; font-size: 28px; color: var(--ink); line-height: 1.4; letter-spacing: .05em; }
.hcard__sub { display: block; margin-top: 16px; font-weight: 700; font-size: 17px; color: var(--green-primary); line-height: 1.6; letter-spacing: .04em; }
.hcard__btn { width: 100%; max-width: 250px; margin: 24px auto 0; justify-content: center; }

.hero__scroll {
	position: absolute; z-index: 4; right: 18px; top: 42%;
	writing-mode: vertical-rl; letter-spacing: .3em; font-size: 12px; font-weight: 600; color: var(--green-primary);
}
.hero__scroll::after {
	content: ""; position: absolute; left: 50%; bottom: -70px; width: 1px; height: 56px; background: var(--green-primary);
}

/* =========================================================
   NEWS
   ========================================================= */
.news { padding: 110px 0; }
.news__inner {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start;
}
.news__head { display: flex; flex-direction: column; gap: 34px; }
.news__list { border-top: 1px solid var(--line); }
.news__item { border-bottom: 1px solid var(--line); }
.news__item a {
	display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 16px;
	padding: 22px 8px; transition: .2s;
}
.news__item a:hover { background: var(--green-mist); }
.news__date { grid-column: 1; font-size: 13px; color: var(--muted); letter-spacing: .05em; }
.news__title { grid-column: 1; grid-row: 2; font-weight: 700; font-size: 17px; color: var(--ink); }
.news__item .chev { grid-column: 2; grid-row: 1 / span 2; color: var(--green-accent); font-size: 20px; }

/* =========================================================
   INFORMATION
   ========================================================= */
.info { padding: 40px 0 90px; }
.info__card {
	max-width: var(--container); margin: 0 auto; background: #fff;
	border-radius: var(--radius); box-shadow: var(--shadow-card);
	padding: 60px 64px 64px;
}
.info__body { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 48px; }
.info__table { display: flex; flex-direction: column; }
.info-row { display: grid; grid-template-columns: 96px 1fr; gap: 20px; padding: 18px 6px; border-bottom: 1px solid var(--line); }
.info-row dt { font-weight: 700; color: var(--ink); font-size: 15px; }
.info-row dd { color: var(--ink-2); font-size: 15px; line-height: 1.7; }
.info-row__tel { font-size: 30px; font-weight: 700; color: var(--ink); letter-spacing: .02em; line-height: 1.2; }
.info-row__tel-sub { display: block; margin-top: 8px; font-size: 14px; font-weight: 500; color: var(--ink-2); letter-spacing: 0; }
.hours { width: 100%; border-collapse: collapse; margin-top: 26px; font-size: 14px; }
.hours thead th { background: var(--green-primary); color: #fff; font-weight: 700; padding: 14px 4px; text-align: center; }
.hours thead th.hours__label { text-align: center; letter-spacing: .1em; }
.hours tbody th { font-weight: 400; color: var(--ink-2); padding: 18px 10px; text-align: left; white-space: nowrap; }
.hours tbody td { text-align: center; color: var(--ink); padding: 18px 4px; border-bottom: 1px solid var(--line); }
.hours tbody th { border-bottom: 1px solid var(--line); }
.hours-note { margin-top: 14px; font-size: 12px; color: var(--muted); line-height: 1.9; }
/* リンク先未確定（サイト準備中）の無効化表示 */
.is-disabled { opacity: .45; pointer-events: none; cursor: default; }
.info__map { border-radius: 10px; overflow: hidden; box-shadow: var(--shadow-soft); }
.info__map iframe { width: 100%; height: 100%; min-height: 400px; border: 0; display: block; }
.info__map img { width: 100%; height: 100%; object-fit: cover; }

/* ---- INFORMATION 3カラム（新宿サイト仕様踏襲・緑ベース 2026-07-15） ---- */
.info__cols { display: grid; grid-template-columns: 1fr 1.2fr 1.3fr; gap: 0; margin-top: 48px; }
.info__hours { padding: 4px 36px 0 4px; }
.info__hours-title {
	text-align: center; font-weight: 700; font-size: 16px; color: var(--ink);
	letter-spacing: .25em; padding: 12px 0; margin-bottom: 18px;
	border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.hours2 { width: 100%; border-collapse: collapse; font-size: 15px; }
.hours2 thead th { background: var(--green-mist); color: var(--green-primary); font-weight: 700; padding: 12px 4px; text-align: center; letter-spacing: .1em; }
.hours2 tbody th { font-weight: 500; color: var(--ink); padding: 12px 4px; text-align: center; border-bottom: 1px solid var(--line); }
.hours2 tbody td { text-align: center; padding: 12px 4px; border-bottom: 1px solid var(--line); color: var(--ink); }
.hours2__closed { color: var(--green-accent); font-size: 13px; font-weight: 700; }
.hours2__ast { font-size: 10px; vertical-align: super; }
.info__hours-time { margin-top: 18px; text-align: center; color: var(--ink); font-size: 15px; line-height: 2; }
.info__hours-note { margin-top: 10px; font-size: 12px; color: var(--muted); line-height: 1.9; text-align: center; }

.info__main {
	padding: 4px 36px 0; text-align: center;
	border-left: 1px solid var(--line); border-right: 1px solid var(--line);
	display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.info__name { font-size: 24px; font-weight: 700; color: var(--ink); letter-spacing: .12em; margin: 0 0 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); width: 100%; }
.info__addr { font-size: 15px; color: var(--ink-2); line-height: 1.9; }
.info__tel-label { margin-top: 22px; font-size: 14px; font-weight: 700; color: var(--green-primary); letter-spacing: .15em; }
.info__tel-sub { margin-top: 8px; font-size: 13px; color: var(--ink-2); }
.info__tel-sub a { color: var(--ink); font-weight: 700; text-decoration: none; }
.info__btn {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 100%; max-width: 320px; border-radius: 8px; padding: 11px 20px; margin-top: 16px;
	font-weight: 700; text-decoration: none; transition: opacity .2s;
}
.info__btn:hover { opacity: .85; }
.info__btn--tel { margin-top: 6px; background: var(--green-primary); color: #fff; box-shadow: var(--shadow-soft); }
.info__btn--tel .info__btn-main { font-size: 24px; letter-spacing: .04em; }
.info__btn--web { background: linear-gradient(90deg, var(--green-accent), var(--green-primary)); color: #fff; box-shadow: var(--shadow-soft); }
.info__btn-small { font-size: 11px; font-weight: 500; opacity: .92; letter-spacing: .2em; }
.info__btn-main { display: inline-flex; align-items: center; gap: 8px; font-size: 17px; letter-spacing: .1em; }
.info__btn--access { background: #fff; border: 1px solid var(--line-2); color: var(--ink); font-size: 15px; letter-spacing: .08em; }
.info__cols .info__map { margin-left: 36px; }

@media (max-width: 980px) {
	.info__cols { grid-template-columns: 1fr; gap: 36px; }
	.info__hours { padding: 0; }
	.info__main { border-left: 0; border-right: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 32px 0 36px; }
	.info__cols .info__map { margin-left: 0; }
	.info__map iframe { min-height: 320px; }
}

/* ---- 医院情報〜診療科目の薄背景写真（新宿サイトの演出踏襲 2026-07-15） ---- */
.photo-bg {
	background:
		linear-gradient(rgba(255, 255, 255, .86), rgba(255, 255, 255, .86)),
		url(../images/section-bg.jpg) center / cover no-repeat;
}

/* 新宿FEATURES風の淡グラデ帯（緑）+ 流線の飾り。医院情報〜診療科目・下部INFORMATIONで使用 */
.grad-band {
	position: relative;
	z-index: 1;
	overflow: hidden;
	background: linear-gradient(180deg, #9ebcdc 0%, #f9f4e7 55%, #ffffff 100%);
}
.grad-band::before,
.grad-band::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	z-index: -1;
	pointer-events: none;
	background-size: 100% auto;
	background-repeat: no-repeat;
}
.grad-band::before {
	top: 30px;
	aspect-ratio: 2880 / 583;
	background-image: url(../images/wave-top.webp);
	background-position: top center;
}
.grad-band::after {
	bottom: 20px;
	aspect-ratio: 2880 / 503;
	background-image: url(../images/wave-bottom.webp);
	background-position: bottom center;
}
/* TOPの上部帯（INFORMATION〜MENU）: 下端の波線はFEATURESセクション側に描くため非表示（2026-07-16デザインデータ準拠） */
.grad-band--flow::after { display: none; }

/* =========================================================
   MENU
   ========================================================= */
.menu { padding: 110px 0; }
.menu > .sec-head { margin-bottom: 50px; }
.menu__grid {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px;
}
.mcard {
	position: relative; border-radius: var(--radius); overflow: hidden;
	background: linear-gradient(135deg, #558ac3, #467eb9);
	box-shadow: var(--shadow-soft);
	transition: transform .25s, box-shadow .25s;
}
.mcard:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.mcard a { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 40px 18px; color: #fff; min-height: 158px; justify-content: center; }
.mcard__title { font-weight: 700; font-size: 27px; letter-spacing: .03em; }
.mcard__sub { margin-top: 12px; font-size: 16px; font-weight: 500; line-height: 1.6; opacity: .95; }
.mcard--pickup { background: linear-gradient(135deg, #0a488a, var(--green-primary)); }
.mcard__badge {
	position: absolute; top: 0; right: 0; z-index: 2;
	background: rgba(255,255,255,.28); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .12em;
	padding: 6px 14px; border-bottom-left-radius: 10px;
}
/* 人間ドックカードのホバーサブメニュー */
.has-flyout { position: relative; }
.mcard__flyout {
	position: absolute; top: calc(100% + 8px); left: 0; z-index: 50;
	display: grid; grid-template-columns: 1fr 1fr; gap: 16px 26px; width: min(620px, 88vw);
	background: #fff; border-radius: 12px; box-shadow: 0 18px 34px rgba(0, 29, 60,.16); padding: 22px 24px; text-align: left;
	opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s, transform .2s, visibility .2s;
}
.has-flyout:hover .mcard__flyout, .has-flyout:focus-within .mcard__flyout { opacity: 1; visibility: visible; transform: none; }
.mcard__flyh { font-weight: 700; font-size: 13px; color: var(--green-primary); border-bottom: 1px solid var(--line); padding-bottom: 6px; margin-bottom: 10px; }
.mcard__flyout ul { display: flex; flex-direction: column; gap: 8px; }
.mcard__flyout a { font-size: 13px; color: var(--ink-2); line-height: 1.5; }
.mcard__flyout a:hover { color: var(--green-primary); text-decoration: underline; }

/* =========================================================
   FEATURES
   ========================================================= */
.features {
	position: relative; padding: 80px 0 120px; overflow: hidden;
	background: linear-gradient(180deg, #ffffff 0%, var(--green-mist) 30%, #f9f5e8 100%);
}
/* 波線: MENUセクション直下・FEATURES見出し背後を横断（デザインデータ準拠 2026-07-16） */
.features::before {
	content: ""; position: absolute; top: -24px; left: 0; width: 100%;
	aspect-ratio: 2880 / 503;
	background: url(../images/wave-bottom.webp) top center / 100% auto no-repeat;
	z-index: 0; pointer-events: none;
}
.features__watermark {
	position: absolute; top: 150px; left: 50%; transform: translateX(-50%);
	font-family: var(--f-serif-en); font-size: 200px; font-weight: 500; letter-spacing: .04em;
	color: rgba(64, 126, 192,.10); z-index: 0; white-space: nowrap; pointer-events: none;
}
.features > .sec-head { position: relative; z-index: 2; margin-bottom: 56px; }
.features .sec-head__jp--top { color: var(--green-accent); font-size: 16px; letter-spacing: .2em; }
.features__title { font-family: var(--f-serif-jp); font-weight: 600; color: var(--ink); font-size: clamp(30px, 4vw, 52px); line-height: 1.5; letter-spacing: .04em; }
.features__grid {
	position: relative; z-index: 2;
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;
}
.fcard {
	background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-card);
	padding: 56px 30px 40px; text-align: center; position: relative;
}
.fcard__badge {
	position: absolute; top: -0px; left: 50%; transform: translate(-50%, -50%);
	width: 64px; height: 64px; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #5f96d0, var(--green-accent));
	color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center;
	line-height: 1; box-shadow: 0 6px 14px rgba(64, 126, 192,.4);
}
.fcard__badge small { font-size: 9px; letter-spacing: .12em; opacity: .95; }
.fcard__badge b { font-size: 20px; font-weight: 700; margin-top: 2px; }
.fcard__title {
	font-weight: 700; font-size: 28px; color: var(--ink); line-height: 1.45; letter-spacing: .02em;
	padding-bottom: 18px; margin-bottom: 18px; position: relative;
}
.fcard__title em { font-style: normal; color: var(--green-accent); }
.fcard__title::after {
	content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
	width: 30px; height: 2px; background: var(--line-2);
}
.fcard__desc { font-size: 17px; color: var(--ink-2); line-height: 1.8; }

/* =========================================================
   CTA バンド
   ========================================================= */
.cta { background: var(--green-accent); padding: 64px 0; }
.cta__inner {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: 360px 1fr; gap: 30px; align-items: stretch;
}
.cta__box { border-radius: var(--radius); padding: 40px; }
.cta__box--light { background: #fff; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px; }
.cta__box--dark { background: var(--green-primary); color: #fff; }
.cta__pill { display: inline-block; font-size: 13px; font-weight: 700; padding: 6px 22px; border-radius: 999px; letter-spacing: .08em; }
.cta__pill--dark { background: #5a5326; color: #fff; }
.cta__pill--outline { border: 1px solid rgba(255,255,255,.7); }
.cta__heading { font-size: 30px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 12px; }
.cta__heading--light { color: #fff; margin: 16px 0 22px; }
.cta__leaf { width: 24px; height: 30px; object-fit: contain; }
.cta__points { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 30px; margin-bottom: 26px; }
.cta__points li { position: relative; padding: 0 0 12px 18px; border-bottom: 1px solid rgba(255,255,255,.3); font-size: 15px; }
.cta__points li::before { content: "・"; position: absolute; left: 0; }
.cta__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

/* =========================================================
   GREETING（新宿#doctorセクション踏襲・新町緑 2026-07-16）
   左=縦書き「理事長あいさつ」+白抜き縦書きGREETING+サブ写真 / 右=白カード
   ========================================================= */
.greeting {
	position: relative; padding: 110px 28px 120px;
	/* 新宿#doctorのdoctor_bg.webp（上=単色→下へ写真が徐々に現れ最下部で白）をCSS多層背景で再現 */
	background:
		linear-gradient(180deg,
			#aec5de 0%, #c3d4e6 30%,
			rgba(195, 212, 230, .8) 55%,
			rgba(214, 226, 238, .55) 78%,
			rgba(252, 249, 242, .8) 94%,
			#ffffff 100%),
		url(../images/greeting-sign.jpg) center bottom / cover no-repeat;
	overflow: hidden;
}
.greeting__inner {
	max-width: 1180px; margin: 0 auto;
	display: flex; justify-content: space-between; align-items: flex-start; gap: 40px;
}
.greeting__side { display: flex; flex-direction: column; width: 37%; align-self: stretch; }
.greeting__vert {
	align-self: center; display: flex; flex-direction: row-reverse; justify-content: center;
	gap: 18px; margin: 8px 0 90px;
}
.greeting__vert-jp {
	writing-mode: vertical-rl; text-orientation: upright;
	font-weight: 700; font-size: clamp(22px, 2.4vw, 34px); letter-spacing: .18em;
	color: var(--ink); line-height: 1.4; padding-top: 10px;
}
.greeting__vert-en {
	writing-mode: vertical-rl; text-orientation: mixed;
	font-family: var(--f-serif-en); font-weight: 400;
	font-size: clamp(96px, 11vw, 160px); line-height: 1; letter-spacing: .02em;
	color: #fff;
}
.greeting__subphoto { border-radius: 8px; overflow: hidden; box-shadow: 0 14px 30px rgba(0, 19, 40, .12); }
.greeting__subphoto img { width: 100%; display: block; }
/* 写真3枚の散らし配置: 左列中段(ラウンジ)→左列下(受付)→右列カード下(待合) と幅・寄せを変えてリズムを出す */
.greeting__subphoto--lounge { margin-top: auto; width: 86%; align-self: flex-start; }
.greeting__subphoto--reception { margin-top: 24px; width: 92%; align-self: flex-end; }
.greeting__subphoto--waiting { margin-top: 26px; width: 74%; align-self: flex-end; }
.greeting__main { width: 58%; display: flex; flex-direction: column; }
.greeting__card {
	width: 100%; background: #fff; border-radius: 10px;
	border: 1px solid rgba(0, 29, 60, .18);
	box-shadow: 0 20px 40px rgba(0, 19, 40, .12);
	padding: 56px 48px; text-align: center;
}
.greeting__badge {
	display: inline-block; background: var(--green-accent); color: #fff;
	font-size: clamp(16px, 1.5vw, 21px); font-weight: 700; letter-spacing: .1em; line-height: 1.4;
	padding: 4px 14px; margin-bottom: 18px;
}
.greeting__name {
	font-size: clamp(28px, 2.6vw, 38px); font-weight: 700; color: var(--ink);
	letter-spacing: .1em; margin-bottom: 26px;
}
.greeting__photo { border-radius: 6px; overflow: hidden; margin-bottom: 28px; }
.greeting__photo img { width: 100%; display: block; }
.greeting__text { margin: 0 0 30px; font-size: 16px; font-weight: 500; line-height: 2.2; letter-spacing: .06em; color: var(--ink-2); text-align: left; }
.greeting__more { display: block; width: 100%; max-width: none; text-align: center; }

/* 〜1100px: 新宿同様、縦書きブロックとサブ写真(受付)を横並び→カードは全幅。ラウンジ写真は非表示 */
@media (max-width: 1100px) {
	.greeting__inner { flex-direction: column; }
	.greeting__side { width: 100%; flex-direction: row; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }
	.greeting__vert { margin: 0; width: 48%; }
	.greeting__subphoto--lounge { display: none; }
	.greeting__subphoto--reception { margin-top: 0; width: 48%; align-self: center; }
	.greeting__main { width: 100%; }
	.greeting__subphoto--waiting { margin-top: 22px; width: 100%; align-self: stretch; }
}

/* =========================================================
   IN-HOSPITAL
   ========================================================= */
.inhospital { padding: 110px 0 110px; }
.inhospital__catch { text-align: center; font-family: var(--f-serif-jp); font-weight: 600; font-size: clamp(24px, 3vw, 34px); color: var(--ink); letter-spacing: .08em; margin: 30px 0 50px; }
.inhospital__grid {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px;
}
.room { border-radius: 10px; overflow: hidden; box-shadow: var(--shadow-soft); background: #fff; }
.room img { width: 100%; aspect-ratio: 409 / 200; object-fit: cover; }
.room__label { display: block; background: var(--green-accent); color: #fff; text-align: center; font-weight: 700; font-size: 16px; padding: 14px; letter-spacing: .06em; }

/* =========================================================
   斗南堂グループ
   ========================================================= */
.group { padding: 30px 0 100px; }
.group__head { text-align: center; margin-bottom: 44px; }
.group__logo { display: inline-block; max-width: 520px; width: 90%; margin: 0 auto; }
.group__sub { margin-top: 18px; font-weight: 700; font-size: 20px; color: var(--green-primary); letter-spacing: .1em; }
.group__banner {
	max-width: var(--container); margin: 0 auto 30px; padding: 0 28px;
	display: grid; grid-template-columns: 280px 1fr auto; gap: 34px; align-items: center;
}
.group__banner {
	background: #fff;
}
.group__banner-inner { }
.group__banner {
	border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-soft);
	padding: 0; overflow: hidden;
}
.group__banner-img img { width: 280px; height: 150px; object-fit: cover; }
.group__banner-body { display: flex; align-items: center; gap: 22px; padding: 20px 0; }
.group__banner-badge { background: var(--green-accent); color: #fff; font-weight: 700; font-size: 14px; text-align: center; line-height: 1.4; padding: 12px 16px; border-radius: 8px; }
.group__banner-title { display: block; font-size: 26px; font-weight: 700; color: var(--green-primary); letter-spacing: .04em; }
.group__banner-desc { display: block; margin-top: 8px; font-size: 14px; color: var(--ink-2); }
.group__banner-btn { margin-right: 28px; }

.group__grid {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
}
.gcard { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-soft); overflow: hidden; display: flex; flex-direction: column; }
.gcard__img img { width: 100%; aspect-ratio: 409/200; object-fit: cover; }
.gcard__label { display: block; text-align: center; padding: 22px 16px 10px; }
.gcard--purple .gcard__label { background: var(--purple-l); }
.gcard--pink .gcard__label { background: var(--pink-l); }
.gcard--green .gcard__label { background: #f8f3e5; }
.gcard--plain .gcard__label { background: #fff; }
.gcard__title { display: block; font-size: 20px; font-weight: 700; color: var(--ink); letter-spacing: .03em; }
.gcard__sub { display: block; margin-top: 6px; font-size: 15px; color: var(--ink-2); }
.gcard__btn { margin: 18px 24px 24px; }
.gcard--purple .gcard__label, .gcard--pink .gcard__label, .gcard--green .gcard__label { padding-bottom: 22px; }
.gcard { }
.gcard--purple, .gcard--pink { }
.gcard--purple .gcard__label { background: var(--purple-l); }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer { background: var(--green-primary); color: #fff; padding: 66px 0 30px; }
.site-footer__brand { max-width: var(--container); margin: 0 auto 44px; padding: 0 28px; }
.site-footer__inner {
	max-width: var(--container); margin: 0 auto; padding: 0 28px;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 38px 40px;
}
.site-footer__inner--map .fcol__list a { font-size: 13px; }
.fcol__title { font-size: 20px; font-weight: 700; letter-spacing: .06em; padding-bottom: 16px; margin-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,.35); }
.fcol h3.fcol__title { font-size: 17px; }
.fcol__addr { font-size: 14px; line-height: 1.9; color: rgba(255,255,255,.9); letter-spacing: .04em; }
.fcol__tel { display: inline-flex; align-items: center; gap: 12px; margin-top: 22px; font-size: 26px; font-weight: 700; letter-spacing: .02em; }
.fcol__tel-icon { width: 34px; height: 34px; border-radius: 50%; background: #fff; display: inline-flex; align-items: center; justify-content: center; }
.fcol__list li { margin-bottom: 16px; }
.fcol__list a { font-size: 15px; color: rgba(255,255,255,.92); transition: .2s; }
.fcol__list a:hover { color: #fff; text-decoration: underline; }
.site-footer__copy { text-align: center; margin-top: 54px; font-size: 12px; letter-spacing: .08em; color: rgba(255,255,255,.8); }

/* generic page */
.generic-page { max-width: 800px; margin: 60px auto; padding: 0 28px; }
.generic-page__title { font-size: 28px; margin-bottom: 24px; color: var(--ink); }

/* =========================================================
   レスポンシブ
   ========================================================= */
@media (max-width: 1100px) {
	.hero { min-height: 560px; }
	.hero__inner { padding-bottom: 110px; }
	.waves { height: 150px; }
	.hero-badges { margin-top: -56px; }
	.hero__scroll { display: none; }
}

/* GREETING SP（新宿SP版準拠 2026-07-16）: GREETINGは小さめ縦書きのまま、カード全幅 */
@media (max-width: 760px) {
	.greeting { padding: 56px 16px 64px; }
	.greeting__side { margin-bottom: 22px; }
	.greeting__vert { gap: 10px; }
	.greeting__vert-jp { font-size: 18px; padding-top: 6px; }
	.greeting__vert-en { font-size: 84px; }
	.greeting__card { padding: 40px 20px; }
	.greeting__badge { font-size: 15px; }
	.greeting__name { font-size: 26px; margin-bottom: 20px; }
	.greeting__text { font-size: 15px; line-height: 2.05; margin-bottom: 24px; }
}

@media (max-width: 960px) {
	.site-header__inner { padding: 0 0 0 16px; }
	.site-header__actions { display: none; }
	/* SP: 緑の四角いハンバーガー（ヘッダー高さいっぱい・右端フラッシュ） */
	.nav-toggle { display: flex; flex-direction: column; gap: 6px; margin-left: auto; align-self: stretch; align-items: center; justify-content: center; width: 62px; min-height: 62px; background: var(--green-primary); border: 0; cursor: pointer; }
	.nav-toggle span { width: 26px; height: 2px; background: #fff; transition: .3s; }
	.site-header.is-nav-open .nav-toggle span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
	.site-header.is-nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
	.site-header.is-nav-open .nav-toggle span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
	/* SPはPC用グローバルナビを隠し、専用ドロワーに置き換え */
	.global-nav { display: none; }

	/* ===== SPドロワーメニュー（緑・全画面オーバーレイ） ===== */
	.sp-drawer {
		display: block; position: fixed; inset: 0; z-index: 96;
		background: var(--green-primary); overflow-y: auto;
		opacity: 0; visibility: hidden; transform: translateY(-6px);
		transition: opacity .28s, transform .28s, visibility .28s;
		-webkit-overflow-scrolling: touch;
	}
	.site-header.is-nav-open ~ .sp-drawer { opacity: 1; visibility: visible; transform: none; }
	.sp-drawer__inner { padding: 86px 22px 40px; display: flex; flex-direction: column; gap: 26px; min-height: 100%; }
	.sp-drawer__nav { display: flex; flex-direction: column; }
	.sp-drawer__nav a { color: #fff; font-size: 17px; font-weight: 500; letter-spacing: .04em; padding: 18px 4px; border-bottom: 1px solid rgba(255,255,255,.4); }
	.sp-drawer__groups { display: flex; flex-direction: column; gap: 14px; }
	.sp-drawer__group { display: flex; align-items: center; justify-content: space-between; color: #fff; border: 1px solid rgba(255,255,255,.7); border-radius: 8px; padding: 16px 20px; font-size: 16px; font-weight: 500; }
	.sp-drawer__group .chev { font-size: 20px; }
	.sp-drawer__contact { background: #fff; border-radius: 10px; padding: 20px; display: flex; flex-direction: column; gap: 14px; margin-top: auto; }
	.sp-drawer__tel { display: flex; flex-direction: column; align-items: center; gap: 4px; border: 1px solid var(--line-2); border-radius: 8px; padding: 12px; color: var(--ink); }
	.sp-drawer__tel-note { font-size: 11px; color: var(--muted); }
	.sp-drawer__tel-num { display: flex; align-items: center; gap: 8px; font-size: 22px; font-weight: 700; letter-spacing: .02em; }
	.sp-drawer__reserve { display: flex; flex-direction: column; align-items: center; gap: 2px; background: var(--green-accent); color: #fff; border-radius: 8px; padding: 12px; }
	.sp-drawer__reserve-note { font-size: 11px; }
	.sp-drawer__reserve-main { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 700; }

	/* ===== SP下部固定 予約バー ===== */
	.sp-fixedbar {
		display: grid; grid-template-columns: 1fr 1fr;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
		box-shadow: 0 -3px 12px rgba(0,0,0,.14);
	}
	.sp-fixedbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 9px 8px; line-height: 1.3; }
	.sp-fixedbar__note { font-size: 10px; }
	.sp-fixedbar__main { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 17px; letter-spacing: .01em; }
	.sp-fixedbar__tel { background: #fff; color: var(--ink); }
	.sp-fixedbar__tel .sp-fixedbar__note { color: var(--muted); }
	.sp-fixedbar__reserve { background: var(--green-primary); color: #fff; }
	.sp-fixedbar__reserve .sp-fixedbar__note { color: rgba(255,255,255,.9); }
	/* 固定バーに隠れないよう本文下部に余白 */
	body { padding-bottom: 62px; }

	/* SP NEWS: 見出し中央 → リスト → ボタン下部中央（親をまたぐ並び替えのため display:contents） */
	.news__inner { display: flex; flex-direction: column; gap: 26px; }
	.news__head { display: contents; }
	.news .sec-head--left { align-items: center; text-align: center; order: 0; }
	.news__list { order: 1; }
	.news__head .btn { order: 2; align-self: center; }
	.info__body { grid-template-columns: 1fr; }
	.info__card { padding: 44px 28px; }
	.menu__grid { grid-template-columns: repeat(2, 1fr); }
	.mcard__flyout { display: none; } /* SP/タブレットではホバーサブメニュー無効 */
	.features__grid { grid-template-columns: repeat(2, 1fr); gap: 44px 24px; }
	.cta__inner { grid-template-columns: 1fr; }
	.inhospital__grid { grid-template-columns: repeat(2, 1fr); }
	.group__banner { grid-template-columns: 1fr; text-align: center; }
	.group__banner-img img { width: 100%; height: 180px; }
	.group__banner-body { flex-direction: column; padding: 20px; }
	.group__banner-btn { margin: 0 20px 24px; }
	.group__grid { grid-template-columns: 1fr; max-width: 460px; }
	.site-footer__inner { grid-template-columns: 1fr 1fr; gap: 30px; }
}

@media (max-width: 560px) {
	.site-header__inner { padding: 0 0 0 16px; }
	.logo-text__jp { font-size: 19px; }
	.logo-text__en { font-size: 9px; }

	/* ヒーロー（SP：明朝中央コピー・波小さめ・バッジ全幅スタック） */
	.hero { height: auto; min-height: 480px; padding: 90px 0 0; }
	.hero__inner { padding: 0 22px 90px; }
	.hero__title { font-size: 32px; line-height: 1.6; letter-spacing: .06em; }
	/* SPは .hero__inner の左右padding 22px＝計44pxが使える幅。字間を詰めて26文字が収まる上限にする */
	.hero__lead { font-size: min(15px, calc((100vw - 44px) / 28)); margin-top: 18px; letter-spacing: .04em; }
	.waves { height: 110px; min-height: 90px; }
	.hero-badges { margin-top: -36px; padding: 0 22px; }
	.hero-badges__grid { grid-template-columns: 1fr; gap: 20px; }
	.hcard { padding: 34px 20px 30px; }
	.hcard__title { font-size: 26px; }
	.hcard__sub { font-size: 16px; }

	/* セクション見出し（SPは全て中央・やや小さめ） */
	.sec-head__en { font-size: 40px; }

	.menu { padding: 64px 0; }
	.menu__grid { grid-template-columns: 1fr 1fr; gap: 16px; padding: 0 22px; }
	.mcard a { padding: 30px 10px; min-height: 130px; }
	.mcard__title { font-size: 23px; }

	.features { padding: 60px 0 80px; }
	.features__grid { grid-template-columns: 1fr; padding: 0 22px; }
	.features__watermark { font-size: 78px; top: 120px; }
	.features__title { font-size: 26px; }

	.cta { padding: 48px 0; }
	.cta__inner { padding: 0 22px; }
	.cta__box { padding: 30px 22px; }
	.cta__points { grid-template-columns: 1fr; gap: 0; }
	.cta__btns { grid-template-columns: 1fr; gap: 14px; }
	.cta__heading { font-size: 26px; }

	/* IN-HOSPITAL は SP でも 2カラム維持 */
	.inhospital { padding: 64px 0 70px; }
	.inhospital__grid { grid-template-columns: repeat(2, 1fr); gap: 16px; padding: 0 22px; }
	.room__label { font-size: 14px; padding: 11px; }
	.inhospital__catch { font-size: 24px; }

	.group { padding: 20px 0 70px; }
	.group__sub { font-size: 17px; }
	.group__banner, .group__grid { padding: 0 22px; }

	.info { padding: 30px 0 64px; }
	.info-row { grid-template-columns: 80px 1fr; gap: 10px; }
	.info-row__tel { font-size: 24px; }
	.hours { font-size: 12px; }
	.hours thead th { padding: 10px 2px; }
	.hours tbody th { padding: 12px 4px; font-size: 12px; }
	.hours tbody td { padding: 12px 2px; }

	.site-footer { padding: 50px 0 26px; }
	.site-footer__inner { grid-template-columns: 1fr; gap: 28px; }
}

/* =========================================================
   スクロール連動アニメーション
   （JSが .js-anim を付与するため、JS無効環境ではコンテンツが隠れない）
   ========================================================= */
.js-anim {
	opacity: 0;
	transform: translateY(26px);
	transition:
		opacity .8s cubic-bezier(.25, .7, .3, 1),
		transform .8s cubic-bezier(.25, .7, .3, 1);
	transition-delay: var(--anim-d, 0s);
	will-change: opacity, transform;
}
.js-anim.is-inview { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.js-anim { opacity: 1; transform: none; transition: none; }
}

/* =========================================================
   カードUIの共通ホバー演出（マウスオーバー時の挙動）
   ========================================================= */
.mcard { transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.mcard:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0, 39, 80, .10); opacity: .92; }
.mcard .mcard__title { transition: color .25s ease; }
.mcard:hover .mcard__title { color: var(--green-primary); }

.hcard { transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.hcard:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(0, 0, 0, .10); opacity: .92; }

.news__item a { transition: background .2s ease, padding-left .2s ease, opacity .2s ease; }
.news__item a:hover { padding-left: 4px; opacity: .75; }
.news__item .chev { transition: transform .25s ease, color .25s ease; }
.news__item a:hover .chev { transform: translateX(4px); color: var(--green-primary); }

.group__banner { transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.group__banner:hover { transform: translateY(-2px); box-shadow: 0 12px 22px rgba(0, 29, 60, .12); opacity: .92; }

.gcard { transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
.gcard:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0, 0, 0, .10); opacity: .92; }

/* ボタン矢印の滑り */
.btn .chev { display: inline-block; transition: transform .25s ease; }
.btn:hover .chev { transform: translateX(3px); }

/* =========================================================
   SPドロワー内アコーディオン（details/summary・デフォルト閉）
   ========================================================= */
.dacc { border-bottom: 1px solid rgba(255, 255, 255, .4); }
.dacc__summary {
	width: 100%; list-style: none; display: flex; align-items: center; justify-content: space-between;
	color: #fff; font-size: 17px; font-weight: 500; letter-spacing: .04em; font-family: inherit;
	background: none; border: 0; text-align: left;
	padding: 18px 4px; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.dacc__chev { font-size: 20px; line-height: 1; transition: transform .35s ease; }
.dacc.is-open > .dacc__summary .dacc__chev { transform: rotate(90deg); }
/* grid-template-rows 0fr→1fr のトラックサイズ遷移で滑らかに開閉（新宿のmax-height 0.35sに準拠） */
.dacc__list {
	display: grid; grid-template-rows: 0fr;
	transition: grid-template-rows .35s ease;
}
.dacc.is-open > .dacc__list { grid-template-rows: 1fr; }
.dacc__list-inner { overflow: hidden; min-height: 0; padding: 0 0 14px; }
.dacc__list-inner li + li { margin-top: 2px; }
.dacc__list-inner a {
	display: block; position: relative;
	color: rgba(255, 255, 255, .95); font-size: 15px; font-weight: 500;
	padding: 10px 6px 10px 22px; border-bottom: 0 !important;
}
.dacc__list-inner a::before { content: "－"; position: absolute; left: 2px; opacity: .6; }

/* TOP CTA パンフレットDLボタン */
.cta__pamphlet { margin-top: 10px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.cta__box--light .cta__pamphlet { color: var(--green-primary); border-color: var(--green-accent); }
.cta__box--light .cta__pamphlet:hover { background: var(--green-soft); }

/* 施設のご紹介: お部屋サブ見出し＋下部ボタン */
.inhospital__catch--sub { margin: 64px 0 40px; }
.inhospital__more { text-align: center; margin-top: 54px; }
.inhospital__more .btn { min-width: 320px; }

/* =========================================================
   TOP ブラッシュアップ（2026-07-23）
   SERVICE背景アニメーション＋カード刷新＋全体の質感向上
   ========================================================= */

/* ---- SERVICE セクション：漂うオーブ＋ウォーターマーク ---- */
.menu { position: relative; overflow: hidden; }
.menu > .sec-head, .menu__grid { position: relative; z-index: 2; }

.menu__watermark {
	position: absolute; top: 34px; left: 50%; transform: translateX(-50%);
	font-family: var(--f-serif-en); font-weight: 500; font-size: 190px; letter-spacing: .04em;
	color: rgba(0, 78, 162, .06); white-space: nowrap; z-index: 0; pointer-events: none; user-select: none;
}
.menu__deco { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.menu__deco span {
	position: absolute; border-radius: 50%; filter: blur(46px); opacity: .55;
	will-change: transform;
}
.menu__deco span:nth-child(1) { width: 380px; height: 380px; left: -80px; top: 40px;
	background: radial-gradient(circle at 30% 30%, rgba(63,118,181,.42), rgba(63,118,181,0) 70%);
	animation: hcs-orb 26s ease-in-out infinite; }
.menu__deco span:nth-child(2) { width: 300px; height: 300px; right: -60px; top: 120px;
	background: radial-gradient(circle at 30% 30%, rgba(255,214,110,.5), rgba(255,214,110,0) 70%);
	animation: hcs-orb 32s ease-in-out infinite reverse; }
.menu__deco span:nth-child(3) { width: 260px; height: 260px; left: 24%; bottom: -60px;
	background: radial-gradient(circle at 30% 30%, rgba(120,170,220,.4), rgba(120,170,220,0) 70%);
	animation: hcs-orb 22s ease-in-out infinite 2s; }
.menu__deco span:nth-child(4) { width: 220px; height: 220px; right: 26%; bottom: 10px;
	background: radial-gradient(circle at 30% 30%, rgba(255,243,209,.6), rgba(255,243,209,0) 70%);
	animation: hcs-orb 28s ease-in-out infinite 1s reverse; }
@keyframes hcs-orb {
	0%   { transform: translate(0,0) scale(1); }
	33%  { transform: translate(40px,-34px) scale(1.14); }
	66%  { transform: translate(-28px,26px) scale(.92); }
	100% { transform: translate(0,0) scale(1); }
}

/* ---- SERVICE カード刷新 ---- */
.menu__grid { gap: 26px; }
.mcard {
	border-radius: 18px;
	background: linear-gradient(140deg, #5b93cb 0%, #3f76b5 55%, #35689f 100%);
	box-shadow: 0 10px 26px rgba(0, 55, 120, .16);
	transition: transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s;
}
/* 角の装飾円（半透明・ホバーで拡大） */
.mcard::before {
	content: ""; position: absolute; top: -46px; right: -46px; width: 130px; height: 130px;
	border-radius: 50%; background: rgba(255,255,255,.12);
	transition: transform .45s cubic-bezier(.22,1,.36,1), background .3s; z-index: 0;
}
/* 斜めのシーン光沢（ホバーで横断） */
.mcard::after {
	content: ""; position: absolute; top: 0; left: -140%; width: 60%; height: 100%; z-index: 1;
	background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,.28) 50%, transparent 100%);
	transform: skewX(-18deg); transition: left .7s ease; pointer-events: none;
}
.mcard:hover::after { left: 140%; }
.mcard:hover::before { transform: scale(1.7); background: rgba(255,255,255,.16); }
.mcard a { position: relative; z-index: 2; padding: 44px 20px 46px; min-height: 168px; gap: 2px; }
.mcard__title { font-size: 26px; letter-spacing: .04em; text-shadow: 0 1px 2px rgba(0,30,70,.12); }
.mcard__sub { margin-top: 14px; opacity: .96; }
/* 下部に現れる「詳しく見る」導線 */
.mcard a::after {
	content: "詳しく見る ›"; position: absolute; left: 0; right: 0; bottom: 14px;
	font-size: 12px; font-weight: 700; letter-spacing: .08em; color: rgba(255,255,255,.92);
	opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s;
}
.mcard:hover a::after { opacity: 1; transform: translateY(0); }
.mcard:hover { transform: translateY(-8px); box-shadow: 0 22px 40px rgba(0, 55, 120, .26); }
/* PICK UP カード：ブランド濃紺＋発光リング */
.mcard--pickup {
	background: linear-gradient(140deg, #0f5aa8 0%, #004ea2 55%, #003c80 100%);
	box-shadow: 0 12px 30px rgba(0, 55, 120, .28), 0 0 0 1px rgba(255,255,255,.10) inset;
}
.mcard--pickup::before { background: rgba(255,255,255,.14); }
.mcard--pickup .mcard__title { font-size: 27px; }
.mcard__badge {
	background: linear-gradient(135deg, #ffe07a, #f5c840); color: #7a5a00;
	letter-spacing: .14em; padding: 7px 15px; box-shadow: 0 3px 8px rgba(0,40,90,.18);
}

/* ---- ヒーロー直下バッジ hcard の質感向上 ---- */
.hcard {
	background: #fff; border-radius: 18px; padding-bottom: 6px;
	box-shadow: 0 10px 30px rgba(0, 55, 120, .10);
	transition: transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s;
}
.hcard:hover { transform: translateY(-6px); box-shadow: 0 22px 42px rgba(0, 55, 120, .18); }
.hcard__icon {
	background: linear-gradient(135deg, #3f76b5, #004ea2);
	box-shadow: 0 8px 18px rgba(0, 78, 162, .30);
	transition: transform .4s cubic-bezier(.22,1,.36,1);
}
.hcard:hover .hcard__icon { transform: translateY(-3px) rotate(-4deg) scale(1.06); }

/* ---- reduced-motion 対応：新規アニメを停止 ---- */
@media (prefers-reduced-motion: reduce) {
	.menu__deco span { animation: none !important; }
	.mcard::after, .mcard a::after { transition: none; }
}

/* =========================================================
   SP: カード見出し/サブの改行最適化＋固定バー（2026-07-23）
   ※ファイル末尾＝最優先で既存SP指定を上書き
   ========================================================= */
.sp-only-br { display: none; }
@media (max-width: 560px) {
	.sp-only-br { display: inline; }
	/* JPは keep-all で単語内改行を防ぎ、改行は明示的な<br>のみ */
	.mcard a { padding: 26px 12px 30px; min-height: 116px; }
	.mcard__title { font-size: 20px; line-height: 1.5; letter-spacing: .01em; word-break: keep-all; }
	.mcard--pickup .mcard__title { font-size: 20px; }
	.mcard__sub { font-size: 12.5px; line-height: 1.65; margin-top: 8px; word-break: keep-all; }
	.mcard a::after { display: none; }  /* SPはホバー無しのため「詳しく見る」導線は非表示 */

	/* 下部固定バーのボタン文言を1行に */
	.sp-fixedbar__main { font-size: 13px; white-space: nowrap; letter-spacing: 0; }
	.sp-fixedbar__note { font-size: 9.5px; }
	.sp-fixedbar a { padding: 8px 6px; }
}
@media (max-width: 360px) {
	.mcard__title { font-size: 18px; }
	.mcard--pickup .mcard__title { font-size: 18px; }
	.sp-fixedbar__main { font-size: 12px; }
}