/*
Theme Name: tsunagu-seitai
Theme URI: https://parte.mixh.jp/tsunagu_new/
Description: 整体院 tsunagu 成増院サイト用のオリジナルWordPressテーマ。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: tsunagu-seitai
*/

/* ==========================================================================
   ベース
   静的HTML（reference-html/*.html）の <helmet> 内 <style> をそのまま移植
   ========================================================================== */

:root {
	/* ヘッダーの高さ。ドロワーの位置計算にも使うため変数化している。 */
	--tsunagu-header-height: 72px;
}

body {
	margin: 0;
	background: #FFFFFF;
	font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "palt" 1;
}

a {
	color: #00875A;
	text-decoration: none;
}

a:hover {
	color: #0E1311;
}

/* サイト全体のラッパー
   静的HTML: <div style="background:#FFFFFF;color:#0E1311;overflow-x:clip"> */
.tsunagu-site {
	background: #FFFFFF;
	color: #0E1311;
	overflow-x: clip;
}

/* Gutenberg Groupブロックの自動挿入div対策
   本番環境ではGroupブロックの子要素が ".wp-block-group__inner-container" という
   1階層のdivでラップされる（WPコアのバージョン差・レイアウトサポートの挙動により発生）。
   以下のセクション群は Group の className（.tsunagu-hero__copy 等）に対して
   直接の子要素を前提にした display:grid / display:flex を指定しているため、
   このdivが挟まると子孫セレクタが効かなくなりレイアウトが崩れる。
   個々のセレクタをすべて複製する代わりに、.tsunagu-section配下に現れる
   inner-container divを display:contents でボックスモデルから除外し、
   孫要素がgrid/flexの直接の子として扱われるようにする。
   （管理画面で投稿者がnews/column本文に独自に追加したGroupブロックまで
   巻き込まないよう、.tsunagu-section配下に限定している） */
.tsunagu-section .wp-block-group__inner-container {
	display: contents;
}

/* box-sizing対策（下層ページ・アーカイブ・記事ページ等の本文幅が静的HTMLより狭く見える問題）
   WordPressコアのブロックライブラリCSS（wp-block-group-inline-css）が
   .wp-block-group { box-sizing: border-box; } を無条件に適用してくる
  （加えて本番環境ではプラグイン snow-monkey-forms のCSSが * { box-sizing: border-box; }
   というスコープなしのグローバルリセットを注入しており、これも同じ方向に働いている。
   このプラグインのリセットは .wp-block-group に限らずページ全体の全要素に及ぶ）。
   一方、静的HTML（reference-html）側のインラインstyleは max-width と padding を
   デフォルトのcontent-box前提の数値で書いている（例: max-width:1440px; padding:0 80px は
   「内側の実コンテンツ幅が1440px、paddingは外側に追加される」という意味）。
   パターン側の各コンテナ（.tsunagu-xxx__inner等）はすべてGroupブロック（.wp-block-group）
   として実装しているため、border-boxを強制されるとpadding分だけ内側の実コンテンツ幅が
   狭くなってしまう（例: 1440pxの箱にpadding 80px×2が食い込み、実質1280pxしか残らない）。
   ページヒーロー（.tsunagu-page-hero__inner）・フッター（.tsunagu-footer__inner）・
   news/columnのアーカイブ（.tsunagu-archive__inner）・個別記事（.tsunagu-single__inner）は
   Groupブロックを使わずpage.php/archive-*.php/single-*.php側で直接HTMLを組んでいるため
   .wp-block-groupには該当しないが、同じ「max-width+padding=content-box前提」の数値で
   書かれているため個別に列挙して対象に含めている。
   静的HTML側で明示的に box-sizing:border-box を指定している箇所（.tsunagu-policy__card等）は
   そちらの個別ルールが後勝ちするため、この指定の影響を受けない。 */
.wp-block-group,
.tsunagu-page-hero__inner,
.tsunagu-footer__inner,
.tsunagu-archive__inner,
.tsunagu-single__inner {
	box-sizing: content-box;
}

/* ==========================================================================
   ヘッダー（全ページ共通・固定）
   ========================================================================== */

.tsunagu-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #FFFFFF;
}

.tsunagu-header__inner {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	height: var(--tsunagu-header-height);
	padding-left: 40px;
}

.tsunagu-header__logo {
	display: flex;
	align-items: center;
	flex: none;
}

.tsunagu-header__logo img {
	width: 132px;
	height: auto;
	display: block;
}

.tsunagu-header__right {
	display: flex;
	align-items: stretch;
	gap: 32px;
	flex: 0 1 auto;
	min-width: 0;
	margin-left: 48px;
}

/* --- グローバルナビゲーション --- */

.tsunagu-gnav {
	display: flex;
	align-items: center;
	/* 項目間の余白（2026-08-18に 22px から拡大） */
	gap: 34px;
	font-size: 13px;
	letter-spacing: .08em;
	color: #2E3633;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.tsunagu-gnav__link {
	color: #2E3633;
	/* 静的HTMLの `.navi a { font-weight: bolder }` / <b> と同じ太さ */
	font-weight: 700;
	white-space: nowrap;
	border-bottom: 2px solid transparent;
	padding-bottom: 5px;
	transition: border-color .25s ease;
}

/* 静的HTMLではインラインstyleのcolorが a:hover より優先されるため、
   ホバーしても文字色は変わらない。その挙動を再現する。 */
.tsunagu-gnav__link:hover {
	color: #2E3633;
	border-bottom-color: #00D084;
}

/* 現在表示中のページ（静的HTMLでは border-bottom:2px solid #00D084 で表現） */
.tsunagu-gnav__link.is-current {
	border-bottom-color: #00D084;
}

/* SP版ドロワーの2カラムグリッドでのみ使う英字ラベル。PC版ナビでは非表示（日本語のみ表示、従来通り）。 */
.tsunagu-gnav__link-en {
	display: none;
}

/* --- 子メニュー（プルダウン） ---
   PC幅はホバー／フォーカスで開く。SP（ドロワー）側は @media (max-width:1079px) で上書きする。 */

.tsunagu-gnav__item {
	position: relative;
	display: flex;
	align-items: center;
}

/* SP専用の開閉ボタン。PC幅では不要。 */
.tsunagu-gnav__subtoggle {
	display: none;
}

.tsunagu-subnav {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 30;
	min-width: 200px;
	margin: 0;
	padding: 8px 0;
	list-style: none;
	background: #fff;
	border: 1px solid #E2E6E4;
	box-shadow: 0 8px 24px rgba(14, 19, 17, .08);
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, visibility .2s ease;
}

/* ナビとメニューの間にわずかな隙間があるとホバーが途切れるため、透明な橋を渡す。 */
.tsunagu-subnav::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 12px;
}

.tsunagu-gnav__item--has-sub:hover .tsunagu-subnav,
.tsunagu-gnav__item--has-sub:focus-within .tsunagu-subnav {
	opacity: 1;
	visibility: visible;
}

.tsunagu-subnav__link {
	display: flex;
	align-items: center;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1.6;
	color: #2E3633;
	white-space: nowrap;
	transition: background-color .2s ease;
}

.tsunagu-subnav__link:hover {
	background: #F5F7F6;
	color: #2E3633;
}

/* ドロワー最下部の店舗情報ブロック（SP専用の新規要素）。PC幅では非表示。 */
.tsunagu-drawer-store {
	display: none;
}

/* --- SP専用：画面最下部に追従する予約ボタン（footer.php） ---
   PC・タブレット幅では非表示。表示は @media (max-width: 768px) で行う。 */
.tsunagu-spbar {
	display: none;
}

/* ==========================================================================
   横並びボタンの高さ揃え（共通方針）
   --------------------------------------------------------------------------
   ボタンを2つ横並びにしている箇所は、以下の3ヶ所。
     1. .tsunagu-header__cta        （LINE / WEB。header.php）
     2. .tsunagu-cta__buttons       （LINE / WEB。patterns/reservation.php）
     3. .tsunagu-symptom__emergency-actions（電話 / LINE。patterns/page-menu.php）
   2と3は、ボタン同士でfont-size（15px対20px）やborder（--web側のみ1px）が
   異なるため、高さを内容任せにすると必ず数px単位でズレる。実際に本番で
   .tsunagu-cta__btn が65px対67px、緊急CTAが69px対61pxになっていた（2026-08-10）。
   個別にpaddingを微調整して合わせる方法は、文言やfont-sizeを変えるたびに
   破綻するため採らない。3ヶ所とも1（ヘッダー）と同じ仕組みに統一する：
     - 外側のラッパー … display:flex + align-items:stretch（行の高さを揃える）
     - 各ボタンの<p> … display:flex（ラッパーの高さを内側へ伝える）
     - 実体の<a>     … display:flex + align-items:center + flex:1
                       + box-sizing:border-box
   これで内容の長さ・font-size・borderに関わらず高さが自動的に揃う。
   ただし768px以下でボタンが縦積みになる箇所（2と3）では、cross axisが幅に
   なるためstretchでは高さが揃わない。そちらはラッパーを
   display:grid + grid-auto-rows:1fr に切り替えて、各行を一番高いボタンに
   合わせる（px指定を使わないので文言変更でも破綻しない）。
   ========================================================================== */

/* --- ヘッダー右端のご予約ボタン --- */

.tsunagu-header__cta {
	display: flex;
	align-items: stretch;
}

.tsunagu-header__cta-btn {
	width: 120px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	color: #FFFFFF;
	font-weight: 700;
}

.tsunagu-header__cta-btn:hover {
	color: #FFFFFF;
}

.tsunagu-header__cta-btn--line {
	background: #00D084;
}

.tsunagu-header__cta-btn--web {
	background: #6B7370;
}

.tsunagu-header__cta-label {
	font-size: 11px;
	letter-spacing: .2em;
}

.tsunagu-header__cta-text {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .08em;
}

/* --- ハンバーガーボタン／オーバーレイ（PC幅では非表示） --- */

.tsunagu-header__toggle,
.tsunagu-header__overlay {
	display: none;
}

/* スクリーンリーダー専用テキスト */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   フッター（全ページ共通・固定）
   ========================================================================== */

.tsunagu-footer {
	background: #FFFFFF;
	padding: 96px 40px 40px;
}

.tsunagu-footer__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
	padding-bottom: 64px;
	border-bottom: 1px solid #E2E6E4;
}

.tsunagu-footer__brand {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-footer__logo {
	width: 168px;
	height: auto;
	display: block;
}

.tsunagu-footer__address {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 14px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
}

/* 住所の直下に置く注記（エレベーターなしの案内）。住所より一段控えめな見た目にする */
.tsunagu-footer__note {
	font-size: 13px;
	line-height: 1.8;
	color: #6B7370;
}

.tsunagu-footer__tel,
.tsunagu-footer__tel:hover {
	color: #00875A;
}

.tsunagu-footer__nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px 32px;
	font-size: 14px;
	letter-spacing: .06em;
	line-height: 2;
}

.tsunagu-footer__nav-link,
.tsunagu-footer__nav-link:hover {
	color: #2E3633;
}

.tsunagu-footer__copyright {
	max-width: 1200px;
	margin: 24px auto 0;
	font-size: 11px;
	letter-spacing: .06em;
	color: #9AA29E;
}

/* ==========================================================================
   トップページ 各セクション共通
   patterns/*.php のブロックマークアップに対応するスタイル。
   数値はすべて静的HTML（reference-html/index.html）のインラインstyle準拠。
   ========================================================================== */

/* ブロックエディタ由来の余白をリセットしてから、静的HTMLの値を当てる */
.tsunagu-section :where(h1, h2, h3, h4, h5, h6, p, figure, ul, ol, table) {
	margin: 0;
}

.tsunagu-section img {
	max-width: 100%;
	height: auto;
}

/* セクション見出し（h2） */
.tsunagu-heading {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 40px;
	letter-spacing: .08em;
	line-height: 1.6;
	color: #0E1311;
}

.tsunagu-heading--light {
	color: #FFFFFF;
}

/* セクションの英字ラベル */
.tsunagu-label {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .24em;
	color: #00875A;
}

.tsunagu-label--light {
	color: #00D084;
}

/* 蛍光ペン風のマーカー */
.tsunagu-marker {
	background: linear-gradient(transparent 64%, rgba(0, 208, 132, .45) 64%);
	padding: 0 4px;
}

.tsunagu-marker--light {
	background: linear-gradient(transparent 62%, rgba(0, 208, 132, .62) 62%);
	padding: 0 4px 2px;
}

/* 「⟶」付きのテキストリンク
   静的HTMLでは<a>自身が width:100%;max-width:440px を持つフレックスアイテムのため、
   ブロックエディタで挟まる<p>側に同じ幅を持たせる。 */
.tsunagu-arrowlink {
	width: 100%;
	max-width: 440px;
}

.tsunagu-arrowlink a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	max-width: 440px;
	padding-bottom: 20px;
	border-bottom: 1px solid #00D084;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .12em;
	color: #0E1311;
}

.tsunagu-arrowlink a:hover {
	color: #0E1311;
}

.tsunagu-arrowlink__arrow {
	font-family: "Zen Maru Gothic", sans-serif;
	color: #00875A;
}

.tsunagu-arrowlink--center {
	display: flex;
	justify-content: center;
	max-width: none;
}

.tsunagu-arrowlink--center a {
	width: auto;
	gap: 24px;
	padding-bottom: 16px;
}

/* --- 埋め込み枠（Googleレビュー / マップ） --- */

.tsunagu-embed {
	display: flex;
}

.tsunagu-embed iframe {
	flex: 1 1 auto;
	width: 100%;
	min-height: inherit;
	border: 0;
	display: block;
}

.tsunagu-embed--review {
	min-height: 320px;
}

/* Trustindexプラグインのショートコードでウィジェットを描画するケース。iframe前提のflexレイアウトだと
   ウィジェット側のdivが引き伸ばされたり潰れたりするため、通常のブロック表示に戻す。
   min-heightは枠の下限として残り、内容が多ければ高さは自動で伸びる。 */
.tsunagu-embed--html {
	display: block;
	height: auto;
}

.tsunagu-embed--html > * {
	max-width: 100%;
}

.tsunagu-embed--map {
	min-height: 520px;
}

/* ACF未設定時のプレースホルダー（静的HTMLのEMBED-01〜02と同じ見た目） */
.tsunagu-embed--placeholder {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 24px;
	text-align: center;
	background: #F5F7F6;
	border: 1px dashed #9AA29E;
}

.tsunagu-embed__code {
	font-family: ui-monospace, monospace;
	font-size: 14px;
	letter-spacing: .08em;
	color: #2E3633;
}

.tsunagu-embed__note {
	font-size: 13px;
	letter-spacing: .06em;
	color: #6B7370;
	line-height: 1.8;
}

.tsunagu-embed--map.tsunagu-embed--placeholder {
	background: repeating-linear-gradient(135deg, #E4E9E6 0 8px, #EDF0EE 8px 16px);
	border: 0;
}

.tsunagu-embed--map .tsunagu-embed__code,
.tsunagu-embed--map .tsunagu-embed__note {
	background: #FFFFFF;
	padding: 10px 14px;
	color: #2E3633;
}

/* ==========================================================================
   01 ヒーロー
   ========================================================================== */

/* 更新バッジ（.tsunagu-hero__update）を右下に絶対配置するための基準 */
.tsunagu-hero {
	position: relative;
}

/* メインビジュアル右下の「NEW｜ブログ更新 …」バッジ */
.tsunagu-hero__update {
	position: absolute;
	right: 24px;
	bottom: 24px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 4px 16px rgba(14, 19, 17, .12);
	font-size: 13px;
	letter-spacing: .04em;
	line-height: 1;
	color: #2E3633;
	transition: background-color .25s ease;
}

.tsunagu-hero__update:hover {
	background: #FFFFFF;
	color: #2E3633;
}

.tsunagu-hero__update-tag {
	display: inline-flex;
	align-items: center;
	padding: 4px 8px;
	background: #00D084;
	color: #FFFFFF;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: .08em;
}

.tsunagu-hero__copy {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 420px;
	gap: 80px;
	align-items: end;
	padding: 28px 40px 24px;
}

.tsunagu-hero__title {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 52px;
	letter-spacing: .08em;
	line-height: 1.55;
	color: #0E1311;
}

/* モバイル幅（768px以下）専用の改行。デスクトップ・タブレットでは非表示 */
.tsunagu-hero__title-break--sp {
	display: none;
}

.tsunagu-hero__lead {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-bottom: 12px;
}

/* 見出し脇の緑のライン */
.tsunagu-hero__lead::before {
	content: "";
	display: block;
	width: 64px;
	height: 2px;
	background: #00D084;
}

.tsunagu-hero__text {
	font-size: 16px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-hero__en {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 300;
	font-size: 13px;
	letter-spacing: .28em;
	color: #6B7370;
}

/* メインビジュアル：3枚をクロスフェード（静的HTMLは5.5秒ごとに切り替え） */
.tsunagu-hero__slider {
	position: relative;
	overflow: hidden;
	aspect-ratio: 15 / 7;
}

.tsunagu-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	animation: tsunagu-hero-fade 16.5s linear infinite;
}

.tsunagu-hero__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 55%;
	display: block;
}

.tsunagu-hero__slide:nth-child(2) {
	animation-delay: 5.5s;
}

.tsunagu-hero__slide:nth-child(3) {
	animation-delay: 11s;
}

/* 3枚目（首の施術写真）は術者の顔が画像上部にあり、既定の object-position: center 55% では
   顔が切れてしまうため、この1枚だけ上寄りにクロップする。 */
.tsunagu-hero__slide:nth-child(3) img {
	object-position: center 12%;
}

@keyframes tsunagu-hero-fade {
	0%   { opacity: 0; }
	9%   { opacity: 1; }
	33%  { opacity: 1; }
	42%  { opacity: 0; }
	100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {

	.tsunagu-hero__slide {
		animation: none;
	}

	.tsunagu-hero__slide:first-child {
		opacity: 1;
	}
}

/* ==========================================================================
   02 コンセプト
   ========================================================================== */

.tsunagu-concept {
	padding: 160px 0;
}

.tsunagu-concept__inner {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 40px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
	align-items: center;
}

.tsunagu-concept__figures {
	position: relative;
	height: 680px;
	margin-top: -60px;
}

.tsunagu-concept__fig {
	position: absolute;
	overflow: hidden;
}

.tsunagu-concept__fig--wide {
	left: 0;
	top: 0;
	width: 460px;
	height: 307px;
}

.tsunagu-concept__fig--wide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 20% center;
	display: block;
}

.tsunagu-concept__fig--tall {
	right: 0;
	bottom: 0;
	width: 296px;
	height: 444px;
	border: 12px solid #FFFFFF;
}

.tsunagu-concept__fig--tall img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-concept__body {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 48px;
	align-items: flex-start;
}

.tsunagu-concept__watermark {
	position: absolute;
	top: -100px;
	right: -20px;
	font-family: "Cormorant Garamond", serif;
	font-weight: 300;
	font-size: 140px;
	line-height: 1;
	color: rgba(154, 162, 158, .24);
	pointer-events: none;
}

.tsunagu-concept__title {
	position: relative;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 40px;
	letter-spacing: .08em;
	line-height: 1.6;
	color: #0E1311;
}

.tsunagu-concept__text {
	display: flex;
	flex-direction: column;
	gap: 32px;
	font-size: 16px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
	max-width: 520px;
	border-left: 2px solid #00D084;
	padding-left: 32px;
}

.tsunagu-concept__text strong {
	font-weight: 500;
	color: #2E3633;
}

/* 本文末尾の注記（エレサス四肢通電のオプション案内）。
   親のgap:32pxだと本文と離れすぎるため、negative marginで詰めて一段控えめにする */
.tsunagu-concept__note {
	margin-top: -16px;
	font-size: 14px;
	line-height: 1.9;
	color: #6B7370;
}

/* ==========================================================================
   03 お悩み別メニュー
   ========================================================================== */

.tsunagu-menu {
	background: #F5F7F6;
	padding: 120px 0;
}

.tsunagu-menu__inner {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.tsunagu-menu__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 24px;
	width: 80%;
	margin: 0 auto;
}

.tsunagu-menu__headtext {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-menu__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	width: 80%;
	margin: 0 auto;
}

.tsunagu-menucard {
	position: relative;
	height: 360px;
	background: #0E1311;
	overflow: hidden;
}

.tsunagu-menucard__bg {
	position: absolute;
	inset: 0;
}

.tsunagu-menucard__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	opacity: .55;
	transition: opacity .5s ease, transform .9s ease;
}

.tsunagu-menucard:hover .tsunagu-menucard__bg img {
	opacity: 1;
	transform: scale(1.04);
}

.tsunagu-menucard::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(14, 19, 17, .30) 0%, rgba(14, 19, 17, 0) 38%, rgba(14, 19, 17, .78) 100%);
	pointer-events: none;
}

.tsunagu-menucard__num {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	background: #00D084;
	color: #FFFFFF;
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 20px;
	letter-spacing: .02em;
	padding: 10px 18px;
	pointer-events: none;
}

.tsunagu-menucard__body {
	position: absolute;
	left: 32px;
	right: 32px;
	bottom: 32px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

.tsunagu-menucard__title {
	/* 静的HTMLではマーカー用spanが直接フレックスアイテムで padding-bottom:2px を持つため、
	   同じ高さになるよう見出し側で2px確保する */
	padding-bottom: 2px;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 400;
	font-size: 30px;
	letter-spacing: .06em;
	color: #FFFFFF;
}

/* 静的HTMLではタイトルと英字のgapのみ4pxのため、差分をマージンで詰める */
.tsunagu-menucard__en {
	margin-top: -8px;
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 12px;
	letter-spacing: .16em;
	color: rgba(255, 255, 255, .7);
}

.tsunagu-menucard__desc {
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: rgba(255, 255, 255, .9);
}

/* <p>の行ボックス分だけ高さが増えないようフレックスにする */
.tsunagu-menucard__more {
	display: flex;
}

.tsunagu-menucard__more a,
.tsunagu-menucard__more a:hover {
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .12em;
	color: #FFFFFF;
	border-bottom: 1px solid rgba(255, 255, 255, .6);
	padding-bottom: 5px;
}

/* カード全面をクリック可能にする（静的HTMLはカード全体が<a>のため） */
.tsunagu-menucard__more a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
}

/* ==========================================================================
   04 施術の流れ
   ========================================================================== */

.tsunagu-flow {
	padding: 112px 0;
}

.tsunagu-flow__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-flow__head {
	display: flex;
	align-items: baseline;
	gap: 32px;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 24px;
}

.tsunagu-flow__list {
	display: flex;
	flex-direction: column;
}

.tsunagu-flowrow {
	display: grid;
	grid-template-columns: 88px 260px 1fr;
	gap: 32px;
	align-items: center;
	padding: 20px 0;
	border-bottom: 1px solid #E2E6E4;
}

.tsunagu-flowrow__num {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 300;
	font-size: 32px;
	line-height: 1.5;
	color: #00875A;
}

/* 施術の流れの見出しだけマーカーの余白が 0 2px（他セクションは 0 4px） */
.tsunagu-flowrow__title .tsunagu-marker {
	padding: 0 2px;
}

.tsunagu-flowrow__title {
	justify-self: start;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 21px;
	line-height: 1.7;
	letter-spacing: .06em;
	color: #0E1311;
}

.tsunagu-flowrow__body {
	font-size: 16px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
}

/* ==========================================================================
   05 ポリシー
   ========================================================================== */

.tsunagu-policy {
	position: relative;
	padding: 0 0 160px;
}

.tsunagu-policy__hero {
	height: 520px;
	margin-right: 200px;
	overflow: hidden;
}

.tsunagu-policy__hero img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 15%;
	display: block;
}

.tsunagu-policy__card {
	position: relative;
	margin: -200px auto 0;
	max-width: 1000px;
	width: 100%;
	box-sizing: border-box;
	background: #FFFFFF;
	padding: 80px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.tsunagu-policy__head {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: center;
	text-align: center;
}

.tsunagu-policy__lead {
	font-size: 16px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
	max-width: 640px;
}

.tsunagu-policy__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 48px;
}

.tsunagu-policy__item {
	display: flex;
	gap: 16px;
	padding: 24px 0;
	border-bottom: 1px solid #E2E6E4;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
}

/* 文末アイコン（電球）。文字サイズに合わせて拡縮するよう em で指定する。
   `.tsunagu-section img { height:auto }` に負けないよう、セレクタを同等の詳細度にしている。 */
.tsunagu-section img.tsunagu-policy__item-icon {
	display: inline-block;
	width: auto;
	height: 1.5em;
	margin-left: .4em;
	vertical-align: -.35em;
}

.tsunagu-policy__item::before {
	content: "●";
	flex: none;
	color: #00D084;
	font-size: 14px;
	line-height: 2.1;
}

/* ==========================================================================
   06 お客様の声
   ========================================================================== */

.tsunagu-voice {
	background: #F5F7F6;
	padding: 160px 0;
}

.tsunagu-voice__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.tsunagu-voice__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 24px;
}

.tsunagu-voice__headtext {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* ==========================================================================
   07 お知らせ・お役立ち情報
   ========================================================================== */

.tsunagu-newscol {
	padding: 160px 0;
}

.tsunagu-newscol__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 40px;
}

.tsunagu-newscol__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
}

.tsunagu-newscol__col {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-newscol__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 20px;
}

.tsunagu-newscol__title {
	display: flex;
	align-items: baseline;
	gap: 20px;
}

.tsunagu-newscol__heading {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 30px;
	letter-spacing: .06em;
	color: #0E1311;
}

.tsunagu-newscol__label {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .24em;
	color: #00875A;
	white-space: nowrap;
}

.tsunagu-newscol__more,
.tsunagu-newscol__more:hover {
	font-size: 13px;
	letter-spacing: .12em;
	color: #0E1311;
	white-space: nowrap;
}

.tsunagu-newscol__list {
	display: flex;
	flex-direction: column;
}

.tsunagu-newscol__empty {
	margin: 0;
	padding: 24px 0;
	font-size: 15px;
	letter-spacing: .04em;
	color: #6B7370;
}

.tsunagu-newsitem,
.tsunagu-newsitem:hover {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 0;
	border-bottom: 1px solid #E2E6E4;
	color: #0E1311;
}

.tsunagu-newsitem__meta {
	display: flex;
	align-items: center;
	gap: 16px;
}

.tsunagu-newsitem__date,
.tsunagu-columnitem__date {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 13px;
	letter-spacing: .12em;
	color: #6B7370;
}

.tsunagu-newsitem__cat {
	background: #E6FAF2;
	color: #00875A;
	font-size: 12px;
	letter-spacing: .06em;
	padding: 5px 12px;
	border-radius: 999px;
}

.tsunagu-newsitem__title,
.tsunagu-columnitem__title {
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .04em;
}

.tsunagu-columnitem,
.tsunagu-columnitem:hover {
	display: grid;
	grid-template-columns: 160px 1fr;
	gap: 24px;
	align-items: center;
	padding: 24px 0;
	border-bottom: 1px solid #E2E6E4;
	color: #0E1311;
}

.tsunagu-columnitem__thumb {
	height: 107px;
	overflow: hidden;
	background: repeating-linear-gradient(135deg, #E4E9E6 0 8px, #EDF0EE 8px 16px);
}

.tsunagu-columnitem__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-columnitem__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* ==========================================================================
   07.5 お知らせ・お役立ち情報 アーカイブ／個別
   静的HTML（reference-html/）にはアーカイブ・個別ページ相当のデザインが
   存在しないため新規設計。トップページのカードスタイル（.tsunagu-newsitem等）
   と共通トーンで揃えている。
   ========================================================================== */

.tsunagu-archive-hero {
	max-width: 1200px;
	margin: 0 auto;
	padding: 72px 40px 40px;
	border-bottom: 1px solid #E2E6E4;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tsunagu-archive__inner {
	max-width: 800px;
	margin: 0 auto;
	padding: 64px 40px 120px;
}

.tsunagu-archive__empty {
	margin: 0;
	font-size: 15px;
	letter-spacing: .04em;
	color: #6B7370;
}

.tsunagu-archive-list {
	display: flex;
	flex-direction: column;
}

.tsunagu-archive-item,
.tsunagu-archive-item:hover {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 32px 0;
	border-bottom: 1px solid #E2E6E4;
	color: #0E1311;
}

.tsunagu-archive-item__meta {
	display: flex;
	align-items: center;
	gap: 16px;
}

.tsunagu-archive-item__date {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 13px;
	letter-spacing: .12em;
	color: #6B7370;
}

.tsunagu-archive-item__cat {
	background: #E6FAF2;
	color: #00875A;
	font-size: 12px;
	letter-spacing: .06em;
	padding: 5px 12px;
	border-radius: 999px;
}

.tsunagu-archive-item__title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 19px;
	letter-spacing: .05em;
	line-height: 1.7;
}

.tsunagu-archive-item__excerpt {
	margin: 0;
	font-size: 14px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #6B7370;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* --- お役立ち情報一覧のカード（サムネイル付き） --- */

.tsunagu-archive-column-list {
	display: flex;
	flex-direction: column;
}

.tsunagu-archive-column-item,
.tsunagu-archive-column-item:hover {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 32px;
	align-items: center;
	padding: 32px 0;
	border-bottom: 1px solid #E2E6E4;
	color: #0E1311;
}

.tsunagu-archive-column-item__thumb {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: repeating-linear-gradient(135deg, #E4E9E6 0 8px, #EDF0EE 8px 16px);
}

.tsunagu-archive-column-item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-archive-column-item__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* --- ページネーション --- */

.tsunagu-pagination {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: 56px;
}

.tsunagu-pagination .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	letter-spacing: .04em;
	color: #0E1311;
	border: 1px solid #E2E6E4;
}

.tsunagu-pagination a.page-numbers:hover {
	border-color: #00D084;
	color: #00875A;
}

.tsunagu-pagination .page-numbers.current {
	background: #00D084;
	border-color: #00D084;
	color: #FFFFFF;
}

.tsunagu-pagination .page-numbers.dots {
	border: none;
}

/* --- 個別ページ（single-news / single-column 共通） --- */

.tsunagu-single__inner {
	max-width: 800px;
	margin: 0 auto;
	padding: 56px 40px 120px;
}

.tsunagu-single__meta {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-bottom: 24px;
	margin-bottom: 40px;
	border-bottom: 1px solid #E2E6E4;
}

.tsunagu-single__date {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 13px;
	letter-spacing: .12em;
	color: #6B7370;
}

.tsunagu-single__cat {
	background: #E6FAF2;
	color: #00875A;
	font-size: 12px;
	letter-spacing: .06em;
	padding: 5px 12px;
	border-radius: 999px;
}

.tsunagu-single__thumbnail {
	margin-bottom: 40px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.tsunagu-single__thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-single__content {
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-single__content > * + * {
	margin-top: 24px;
}

.tsunagu-single__content img {
	max-width: 100%;
	height: auto;
	display: block;
}

.tsunagu-single__back {
	margin: 56px 0 0;
}

.tsunagu-single__back a {
	font-size: 14px;
	letter-spacing: .06em;
	color: #0E1311;
}

.tsunagu-single__back a:hover {
	color: #00875A;
}

/* --- 個別ページ ヘッダー（column：アイキャッチの下にタイトル・日付を置く） --- */

.tsunagu-single__header {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 24px;
}

.tsunagu-single__header .tsunagu-heading {
	margin: 0;
	font-size: 24px;
}

/* --- 旧サイト（blogmedia）から移行した本文のスタイル --- */
/* 移行元の記事本文には、旧テーマ側のCSSに依存したクラス
   （.h2-title-green / .bk-white / .bk-green）が含まれている。
   旧サイトと同じ見え方になるよう、ここで同等のルールを定義する。
   数値は旧サイトの style.css からそのまま移植している。 */

.tsunagu-single__content .h2-title-green {
	font-size: 36px;
	padding: 30px 57px;
	background-color: #00D084 !important;
	margin: 20px 0;
	text-align: center !important;
}

.tsunagu-single__content .wp-block-button {
	margin: 0;
}

.tsunagu-single__content .bk-white {
	justify-content: center;
}

.tsunagu-single__content .bk-white .wp-block-button__link {
	display: inline-block;
	border: 1px solid #00C300;
	background-color: #FFFFFF;
	border-radius: 20px;
	margin: 10px 0;
}

.tsunagu-single__content .bk-green .wp-block-button__link {
	display: inline-block;
	background-color: #00C300;
	border-radius: 20px;
	margin: 10px 0;
}

/* 本文中のリンクは旧サイトと同じ既定色・下線にする */
.tsunagu-single__content p a {
	color: #0000EE;
	text-decoration: underline;
}

.tsunagu-single__content p a:hover {
	color: #0000EE;
	text-decoration: underline;
}

/* 旧サイトのブレークポイント（750px）をそのまま踏襲する。
   テーマ標準の768pxではなく750pxなのは、移植元のルールと
   見出しの折り返し位置を完全に一致させるため。 */
@media (max-width: 750px) {
	.tsunagu-single__content .h2-title-green {
		padding: 0 10px;
	}

	.tsunagu-single__content .h2-title-green span {
		font-size: 18px;
		padding: 10px 0;
		display: flex;
		align-content: center;
		justify-content: center;
		align-items: center;
	}
}

/* ==========================================================================
   08 よくあるご質問
   ========================================================================== */

.tsunagu-faq {
	background: #F5F7F6;
	padding: 160px 0;
}

.tsunagu-faq__inner {
	max-width: 900px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.tsunagu-faq__head {
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
}

.tsunagu-faq__list {
	display: flex;
	flex-direction: column;
}

.tsunagu-faq__item {
	border-bottom: 1px solid #E2E6E4;
}

.tsunagu-faq__q {
	display: grid;
	grid-template-columns: 40px 1fr 24px;
	gap: 20px;
	align-items: center;
	padding: 28px 0;
	cursor: pointer;
	list-style: none;
}

.tsunagu-faq__q::-webkit-details-marker {
	display: none;
}

.tsunagu-faq__mark {
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 20px;
	color: #00875A;
}

.tsunagu-faq__mark--a {
	color: #9AA29E;
}

.tsunagu-faq__question {
	font-size: 18px;
	font-weight: 500;
	line-height: 1.8;
	letter-spacing: .04em;
	color: #0E1311;
}

/* ＋／− アイコン */
.tsunagu-faq__icon {
	position: relative;
	display: block;
	width: 16px;
	height: 16px;
}

.tsunagu-faq__icon::before,
.tsunagu-faq__icon::after {
	content: "";
	position: absolute;
	background: #0E1311;
}

.tsunagu-faq__icon::before {
	top: 7px;
	left: 0;
	width: 16px;
	height: 1px;
}

.tsunagu-faq__icon::after {
	top: 0;
	left: 7px;
	width: 1px;
	height: 16px;
	transition: opacity .2s ease;
}

.tsunagu-faq__item[open] .tsunagu-faq__icon::after {
	opacity: 0;
}

.tsunagu-faq__a {
	display: grid;
	grid-template-columns: 40px 1fr;
	gap: 20px;
	padding: 0 0 32px;
}

.tsunagu-faq__answer {
	font-size: 16px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
}

/* ==========================================================================
   09 アクセス
   ========================================================================== */

.tsunagu-access {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

/* [tsunagu_embed slot="map"] を単独のGroupで包むためのラッパー。
   ショートコード展開時に生成される空の<p>（原因未特定、do_shortcode()実行後の
   ブロック間の空白テキストが<p>化される現象と見られる）がグリッドの直接の子に
   紛れ込むと、.tsunagu-access（2カラムグリッド）の3つ目の子要素として扱われ、
   意図した2カラムが崩れてしまう（2026-08-09に発覚・修正）。
   ショートコードをこのラッパーの中に閉じ込めることで、空の<p>が混ざっても
   グリッドの直接の子は常に2つ（.tsunagu-access__body / このラッパー）に保たれる。
   グリッドのデフォルトalign-items:stretchでラッパー自体は行の高さまで伸びるが、
   中の.tsunagu-embedは通常のブロックなので自動では追従しないため、
   flex-direction:columnと子要素side のflex:1で高さを継承させている。 */
.tsunagu-access__embed {
	display: flex;
	flex-direction: column;
}

.tsunagu-access__embed .tsunagu-embed {
	flex: 1;
}

.tsunagu-access__body {
	background: #F5F7F6;
	color: #0E1311;
	padding: 80px 64px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-access__head {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-access__address {
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-access__station {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tsunagu-access__subtitle {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #0E1311;
}

.tsunagu-access__table {
	border-top: 1px solid #E2E6E4;
	padding-top: 14px;
}

.tsunagu-access__table table {
	width: 100%;
	border-collapse: collapse;
}

.tsunagu-access__table td {
	border: 0;
	padding: 4px 0;
	font-size: 15px;
	line-height: 1.8;
	letter-spacing: .04em;
	color: #2E3633;
	vertical-align: top;
}

.tsunagu-access__table td:first-child {
	width: 120px;
	padding-right: 24px;
}

.tsunagu-access__note {
	border-top: 1px solid #E2E6E4;
	padding-top: 20px;
	font-size: 13px;
	letter-spacing: .06em;
	color: #6B7370;
}

/* ==========================================================================
   10 営業日カレンダー
   ========================================================================== */

.tsunagu-calendar {
	padding: 112px 0;
}

.tsunagu-calendar__inner {
	max-width: 840px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-calendar__head {
	display: flex;
	align-items: baseline;
	gap: 32px;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 24px;
}

/* 予約カレンダー（WP Simple Booking Calendar）を削除したため、その枠
   （.tsunagu-calendar__booking）と、それ用の凡例（.tsunagu-calendar__legend /
   .tsunagu-calendar__legenditem）のスタイルもデッドコードになるので削除した（2026-08-17）。
   このセクションの中身は下記「10-b 診療カレンダー」のカードのみになり、
   凡例はそのカード内（.tsunagu-schedule__legend）が担う。 */

/* ==========================================================================
   10-b 診療カレンダー（月表示・午前/午後ステータス）
   ショートコード [clinic_calendar] の出力（inc/clinic-calendar.php）。
   角丸カード＋緑のヘッダー帯＋●／の記号という参照デザインのトーンに合わせている。

   box-sizing を自前で border-box に固定しているのは、本番環境では
   プラグイン（snow-monkey-forms）が * { box-sizing: border-box } を注入する一方、
   ローカル・素のWordPressでは content-box のままになり、セル幅の計算結果が
   環境によって変わってしまうため（ファイル冒頭の box-sizing 対策コメント参照）。
   ========================================================================== */

.tsunagu-schedule,
.tsunagu-schedule *:not(.screen-reader-text) {
	box-sizing: border-box;
}

.tsunagu-schedule {
	background: #FFFFFF;
	border: 1px solid #E2E6E4;
	overflow: hidden;
}

/* 年月の見出し（緑のヘッダー帯） */
.tsunagu-schedule__head {
	background: #00D084;
	padding: 18px 24px;
	text-align: center;
	/* 月送りボタン（＜前月／翌月＞）を左右に置くための3カラム。
	   ボタンが無いとき（当月のみ設定）でも月名は中央に来る。 */
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 8px;
}

/* 月送りボタン。1枚目の「＜」と最後の「＞」は disabled にして、
   押せないことが見た目でも分かるようにしている。 */
.tsunagu-schedule__nav {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 6px 10px;
	border: 1px solid rgba(255, 255, 255, .5);
	background: transparent;
	color: #FFFFFF;
	font-family: inherit;
	font-size: 13px;
	letter-spacing: .04em;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s ease, opacity .2s ease;
}

.tsunagu-schedule__nav--prev {
	justify-self: start;
}

.tsunagu-schedule__nav--next {
	justify-self: end;
}

.tsunagu-schedule__nav:hover {
	background: rgba(255, 255, 255, .16);
	color: #FFFFFF;
}

.tsunagu-schedule__nav[disabled] {
	opacity: .35;
	cursor: default;
}

.tsunagu-schedule__nav[disabled]:hover {
	background: transparent;
}

.tsunagu-schedule__month {
	/* ボタンの有無に関わらず中央（2列目）に置く。
	   月送りボタンが無いとき（当月のみ設定）に自動配置で左端へ寄るのを防ぐため。 */
	grid-column: 2;
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: .08em;
	color: #FFFFFF;
}

.tsunagu-schedule__month-year {
	margin-right: 4px;
	font-size: 15px;
	letter-spacing: .12em;
	opacity: .85;
}

/* 幅が足りない環境でのみ横スクロールさせる保険。
   セル側を十分に詰めているため、375px幅でもスクロールは発生しない。 */
.tsunagu-schedule__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.tsunagu-schedule__table {
	width: 100%;
	min-width: 320px;
	border-collapse: collapse;
	table-layout: fixed;
}

.tsunagu-schedule__weekday {
	background: #F5F7F6;
	border-bottom: 1px solid #E2E6E4;
	padding: 10px 2px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: .08em;
	color: #6B7370;
}

.tsunagu-schedule__weekday--sunhol {
	color: #B4544B;
}

.tsunagu-schedule__weekday--sat {
	color: #4E7A93;
}

.tsunagu-schedule__cell {
	border-right: 1px solid #EEF1F0;
	border-bottom: 1px solid #EEF1F0;
	padding: 8px 2px 10px;
	vertical-align: top;
	text-align: center;
}

.tsunagu-schedule__cell:last-child {
	border-right: 0;
}

.tsunagu-schedule__table tbody tr:last-child .tsunagu-schedule__cell {
	border-bottom: 0;
}

/* 前月末・翌月初にあたる空白セル */
.tsunagu-schedule__cell--blank {
	background: #FAFBFA;
}

.tsunagu-schedule__cell--sunhol .tsunagu-schedule__date,
.tsunagu-schedule__cell--holiday .tsunagu-schedule__date {
	color: #B4544B;
}

.tsunagu-schedule__cell--sat .tsunagu-schedule__date {
	color: #4E7A93;
}

.tsunagu-schedule__cell--today {
	background: rgba(0, 208, 132, .08);
}

.tsunagu-schedule__cell--today .tsunagu-schedule__date {
	font-weight: 700;
}

/* .tsunagu-schedule__cell--exception は「例外日として上書きされた日」を示すクラス。
   フロントでは週間パターン由来の日と同じ見た目にするため装飾していないが、
   将来アイコン等で区別したくなった場合の取っ掛かりとして出力している。 */

.tsunagu-schedule__date {
	display: block;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: .02em;
	color: #0E1311;
}

/* セル内の●／。日付の下に1つだけ置く（午前/午後には分けない）。 */
.tsunagu-schedule__cell .tsunagu-schedule__mark {
	display: block;
	margin-top: 8px;
	font-size: 17px;
}

.tsunagu-schedule__mark {
	font-size: 13px;
	line-height: 1;
}

.tsunagu-schedule__mark--open {
	color: #00D084;
}

.tsunagu-schedule__mark--closed {
	color: #9AA29E;
}

/* --- 曜日ごとの診療時間（テキスト表記） ---
   当初は7列の表（曜日×時間帯の●／）にしていたが、月カレンダーと同じ情報が
   二重に並ぶため、2026-08-18に「月・火・木・金 … 11:00-21:00（最終受付 20:00）」という
   テキストの行に変更した。曜日ラベルの幅を揃えて、時間の開始位置を縦に合わせている。 */

.tsunagu-schedule__hours {
	margin: 0;
	border-top: 1px solid #E2E6E4;
	padding: 18px 20px;
}

.tsunagu-schedule__hours-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 16px;
}

.tsunagu-schedule__hours-row + .tsunagu-schedule__hours-row {
	margin-top: 10px;
}

.tsunagu-schedule__hours-days {
	flex: none;
	/* 「月・火・木・金」が入る幅。時間の開始位置を行ごとに揃えるため固定にしている。 */
	width: 132px;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: .04em;
	color: #0E1311;
}

.tsunagu-schedule__hours-time {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 8px;
}

.tsunagu-schedule__hours-range {
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: .02em;
	color: #0E1311;
}

.tsunagu-schedule__hours-last {
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: 0;
	color: #6B7370;
}

/* 休診の曜日をまとめた行 */
.tsunagu-schedule__hours-row--closed .tsunagu-schedule__hours-days,
.tsunagu-schedule__hours-row--closed .tsunagu-schedule__hours-range {
	color: #6B7370;
}

/* --- カード下部（凡例＋注記） --- */

.tsunagu-schedule__foot {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px 20px;
	background: #F5F7F6;
	border-top: 1px solid #E2E6E4;
}

.tsunagu-schedule__legend {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	letter-spacing: .06em;
	color: #6B7370;
}

.tsunagu-schedule__legenditem {
	display: flex;
	align-items: center;
	gap: 8px;
}

.tsunagu-schedule__notes {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	padding: 10px 0 0;
	list-style: none;
	border-top: 1px solid #E2E6E4;
	font-size: 13px;
	line-height: 1.7;
	letter-spacing: .04em;
	color: #6B7370;
}

/* ==========================================================================
   11 ご予約（CTA）
   ========================================================================== */

.tsunagu-cta {
	position: relative;
	background: #2E3633;
	color: #FFFFFF;
	padding: 112px 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
	overflow: hidden;
}

.tsunagu-cta__bg {
	position: absolute;
	inset: 0;
}

.tsunagu-cta__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 15%;
	display: block;
}

.tsunagu-cta::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(23, 29, 26, .72) 0%, rgba(23, 29, 26, .62) 100%);
}

.tsunagu-cta__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	text-align: center;
}

/* 静的HTMLでは見出しブロックとボタン行の間だけ48px */
/* 横並びボタンの高さ揃えについては、ファイル冒頭付近の
   「横並びボタンの高さ揃え」の共通方針コメントを参照。 */
.tsunagu-cta__buttons {
	display: flex;
	align-items: stretch;
	margin-top: 24px;
}

.tsunagu-cta__btn {
	display: flex;
	margin: 0;
}

.tsunagu-cta__btn a,
.tsunagu-cta__btn a:hover {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	/* --web 側だけ1pxのborderがあるため、border-boxにしないと2px高くなる */
	box-sizing: border-box;
	padding: 22px 56px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .12em;
	color: #FFFFFF;
}

.tsunagu-cta__btn--line a {
	/* SP下部の追従バー（.tsunagu-spbar__btn--line）と同じ配色に揃えている（2026-08-18）。
	   以前はLINEブランド色の #06C755 だった。 */
	background: #00D084;
}

.tsunagu-cta__btn--web a {
	border: 1px solid rgba(255, 255, 255, .7);
}

/* CTAセクションの予約カレンダー（.tsunagu-cta__calendar）は、静的HTMLの設計に合わせて
   2026-08-10に削除した。その後、中盤の営業日カレンダーセクションに残っていた
   予約カレンダー（WP Simple Booking Calendar）も2026-08-17に削除し、
   テーマ内実装の診療カレンダー（.tsunagu-schedule）に置き換えている。
   したがって現在、サイト内にカレンダーは営業日カレンダーセクションの1つだけ。 */

/* ==========================================================================
   12 下層固定ページ（page.php）
   静的HTML（treatment / about / price / menu）の PAGE HERO は全ページ共通仕様。
   ========================================================================== */

.tsunagu-page-hero {
	position: relative;
	height: 384px;
	overflow: hidden;
	display: flex;
	align-items: center;
	/* 背景画像が未設定の固定ページでも読めるように下地を敷いておく */
	background: #2E3633;
}

.tsunagu-page-hero__bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 55%;
	display: block;
}

/* 施術についてのみ object-position が center 45%（静的HTML準拠） */
.tsunagu-page-hero--treatment .tsunagu-page-hero__bg {
	object-position: center 45%;
}

.tsunagu-page-hero::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg, rgba(14, 19, 17, .72) 0%, rgba(14, 19, 17, .45) 55%, rgba(14, 19, 17, .30) 100%);
}

.tsunagu-page-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 1440px;
	width: 100%;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* 静的HTMLでは緑の斜めラインが独立した<span>。ここでは擬似要素で再現する */
.tsunagu-page-hero__label {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .14em;
	color: #FFFFFF;
}

.tsunagu-page-hero__label::before {
	content: "";
	display: block;
	flex: none;
	width: 3px;
	height: 22px;
	background: #00D084;
	transform: skewX(-18deg);
}

.tsunagu-page-hero__title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 52px;
	letter-spacing: .1em;
	line-height: 1.4;
	color: #FFFFFF;
}

/* 本文にブロックパターン以外（素の段落・見出しなど）が直接置かれた場合の保険。
   パターンの外側Groupは .tsunagu-section を持つため、この指定の影響を受けない。 */
.tsunagu-page > :where(p, h2, h3, h4, ul, ol, blockquote, figure, table) {
	box-sizing: border-box;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 40px;
	padding-right: 40px;
}

.tsunagu-page > :where(p, ul, ol) {
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .05em;
	color: #2E3633;
}

.tsunagu-page > :where(h2, h3, h4) {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1.8;
	color: #0E1311;
}

/* 共通CTA / 共通FAQ は同じブロックパターンを使い回す。
   下層ページも含め全ページでトップページ基準の余白に統一する
   （.tsunagu-page 側での上書きは行わない）。 */

/* ==========================================================================
   13 下層ページ本文（施術について / 当院について / 料金について）
   patterns/page-treatment.php, page-about.php, page-price.php に対応。
   ========================================================================== */

/* --- 施術について：背中が変われば身体が変わる --- */

.tsunagu-treatment-intro {
	padding: 180px 0;
}

.tsunagu-treatment-intro__inner {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 80px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 120px;
	align-items: center;
}

.tsunagu-treatment-intro__body {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 56px;
	align-items: flex-start;
}

/* 装飾用の背景英字（CONCEPT）。position:absoluteでフレックスの gap 計算からは除外される */
.tsunagu-treatment-intro__watermark {
	position: absolute;
	top: -96px;
	left: -16px;
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-weight: 300;
	font-size: 140px;
	line-height: 1;
	color: rgba(154, 162, 158, .22);
	pointer-events: none;
}

.tsunagu-treatment-intro__head {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
}

/* 見出し脇の緑のライン */
.tsunagu-treatment-intro__head::before {
	content: "";
	display: block;
	width: 56px;
	height: 2px;
	background: #00D084;
}

.tsunagu-treatment-intro__text {
	display: flex;
	flex-direction: column;
	gap: 32px;
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .05em;
	color: #2E3633;
	max-width: 540px;
	border-left: 2px solid #00D084;
	padding-left: 40px;
}

.tsunagu-treatment-intro__subtitle {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 24px;
	letter-spacing: .06em;
	line-height: 1.8;
	color: #0E1311;
	padding-bottom: 4px;
}

.tsunagu-treatment-intro__figures {
	position: relative;
	height: 880px;
}

.tsunagu-treatment-intro__fig {
	position: absolute;
	overflow: hidden;
}

.tsunagu-treatment-intro__fig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-treatment-intro__fig--main {
	left: 0;
	top: 0;
	width: 440px;
	height: 294px;
}

.tsunagu-treatment-intro__fig--right {
	right: 0;
	top: 254px;
	width: 296px;
	height: 370px;
	border: 12px solid #FFFFFF;
}

.tsunagu-treatment-intro__fig--bottom {
	left: 40px;
	bottom: 0;
	width: 340px;
	height: 227px;
	border: 12px solid #FFFFFF;
}

/* --- 施術について：エレサス --- */

.tsunagu-elesas {
	background: #F5F7F6;
	padding: 180px 0;
}

.tsunagu-elesas__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	flex-direction: column;
	gap: 80px;
}

.tsunagu-elesas__head {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: center;
	text-align: center;
}

.tsunagu-elesas__body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 88px;
	align-items: start;
}

.tsunagu-elesas__media {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-elesas__mainfig {
	aspect-ratio: 2 / 3;
	overflow: hidden;
}

.tsunagu-elesas__mainfig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	display: block;
}

.tsunagu-elesas__subfigs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.tsunagu-elesas__subfig {
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.tsunagu-elesas__subfig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-elesas__text {
	display: flex;
	flex-direction: column;
	gap: 32px;
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .05em;
	color: #2E3633;
}

.tsunagu-elesas__subtitle {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 24px;
	letter-spacing: .06em;
	line-height: 1.8;
	color: #0E1311;
	padding-bottom: 4px;
}

.tsunagu-elesas__note {
	background: #FFFFFF;
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	border-left: 2px solid #00D084;
}

.tsunagu-elesas__notetitle {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #0E1311;
}

.tsunagu-elesas__notetext {
	margin: 0;
	font-size: 15px;
	line-height: 2;
	letter-spacing: .04em;
	color: #2E3633;
}

/* --- 当院について：ご挨拶 --- */

.tsunagu-greeting {
	padding: 180px 0;
}

.tsunagu-greeting__inner {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 80px;
	display: grid;
	grid-template-columns: 440px 1fr;
	gap: 120px;
	align-items: center;
}

.tsunagu-greeting__profile {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-top: 80px;
}

.tsunagu-greeting__photo {
	aspect-ratio: 2 / 3;
	overflow: hidden;
}

.tsunagu-greeting__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-greeting__name {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.tsunagu-greeting__role {
	margin: 0;
	font-size: 12px;
	letter-spacing: .16em;
	color: #6B7370;
}

.tsunagu-greeting__personname {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	letter-spacing: .08em;
	color: #0E1311;
}

.tsunagu-greeting__body {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 56px;
	align-items: flex-start;
}

.tsunagu-greeting__watermark {
	position: absolute;
	top: -96px;
	left: -16px;
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-weight: 300;
	font-size: 140px;
	line-height: 1;
	color: rgba(154, 162, 158, .22);
	pointer-events: none;
}

.tsunagu-greeting__head {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
}

.tsunagu-greeting__head::before {
	content: "";
	display: block;
	width: 56px;
	height: 2px;
	background: #00D084;
}

.tsunagu-greeting__text {
	display: flex;
	flex-direction: column;
	gap: 32px;
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .05em;
	color: #2E3633;
	max-width: 600px;
	border-left: 2px solid #00D084;
	padding-left: 40px;
}

.tsunagu-greeting__subtitle {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 24px;
	letter-spacing: .06em;
	line-height: 1.8;
	color: #0E1311;
	padding-bottom: 4px;
}

/* --- 当院について：院内風景 --- */

.tsunagu-gallery {
	background: #F5F7F6;
	padding: 80px 64px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.tsunagu-gallery__head {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-gallery__lead {
	margin: 0;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
	max-width: 520px;
}

.tsunagu-gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
}

.tsunagu-gallery__fig {
	overflow: hidden;
}

.tsunagu-gallery__fig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-gallery__fig--room {
	grid-column: span 2;
	aspect-ratio: 3 / 2;
}

.tsunagu-gallery__fig--elesas {
	grid-row: span 2;
}

.tsunagu-gallery__fig--entrance {
	aspect-ratio: 4 / 3;
}

.tsunagu-gallery__fig--clock {
	aspect-ratio: 4 / 3;
}

.tsunagu-gallery__fig--team {
	grid-column: span 3;
}

.tsunagu-gallery__fig--team img {
	height: auto;
	object-position: center top;
	clip-path: inset(0 0 25% 0);
	margin-bottom: -8.33%;
}

/* --- 料金について：料金メニュー --- */

.tsunagu-pricelist {
	padding: 140px 0 120px;
}

.tsunagu-pricelist__inner {
	max-width: 1040px;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	flex-direction: column;
	gap: 64px;
}

.tsunagu-pricelist__head {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
}

.tsunagu-pricelist__watermark {
	position: absolute;
	top: -84px;
	left: -16px;
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-weight: 300;
	font-size: 120px;
	line-height: 1;
	color: rgba(154, 162, 158, .22);
	pointer-events: none;
}

.tsunagu-pricelist__head::before {
	content: "";
	display: block;
	width: 56px;
	height: 2px;
	background: #00D084;
}

.tsunagu-pricelist__note {
	margin: 0;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #6B7370;
}

.tsunagu-pricelist__first {
	background: #F5F7F6;
	border-left: 4px solid #00D084;
	padding: 48px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 40px;
}

.tsunagu-pricelist__first-info {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

.tsunagu-pricelist__badge {
	margin: 0;
	display: inline-block;
	background: #00D084;
	color: #0E1311;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .1em;
	padding: 6px 14px;
}

.tsunagu-pricelist__first-title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 28px;
	letter-spacing: .06em;
	color: #0E1311;
}

.tsunagu-pricelist__first-duration {
	margin: 0;
	font-size: 14px;
	letter-spacing: .06em;
	color: #6B7370;
}

.tsunagu-pricelist__first-price {
	display: flex;
	align-items: baseline;
	gap: 18px;
	white-space: nowrap;
}

.tsunagu-pricelist__strike {
	margin: 0;
	font-size: 20px;
	letter-spacing: .04em;
	color: #9AA29E;
	text-decoration: line-through;
}

.tsunagu-pricelist__now {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 46px;
	letter-spacing: .02em;
	color: #00875A;
}

.tsunagu-pricelist__now-unit {
	font-size: 22px;
}

.tsunagu-pricelist__regular {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-pricelist__regular-head {
	display: flex;
	align-items: baseline;
	gap: 20px;
	border-bottom: 1px solid #E2E6E4;
	padding-bottom: 18px;
}

.tsunagu-pricelist__regular-title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 28px;
	letter-spacing: .08em;
	color: #0E1311;
}

/* 「R E G U L A R」だけ .tsunagu-label 標準（13px）より1px小さい */
.tsunagu-pricelist__regular-head .tsunagu-label {
	font-size: 12px;
}

.tsunagu-pricelist__rows {
	display: flex;
	flex-direction: column;
}

.tsunagu-pricelist__row {
	display: grid;
	grid-template-columns: 1fr 120px 160px;
	gap: 24px;
	align-items: center;
	padding: 24px 0;
	border-bottom: 1px solid #E2E6E4;
}

.tsunagu-pricelist__row-name {
	margin: 0;
	font-size: 19px;
	font-weight: 500;
	letter-spacing: .04em;
	color: #0E1311;
}

.tsunagu-pricelist__row-duration {
	margin: 0;
	font-size: 15px;
	letter-spacing: .06em;
	color: #6B7370;
}

.tsunagu-pricelist__row-price {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 26px;
	letter-spacing: .02em;
	color: #0E1311;
	text-align: right;
}

/* --- 料金について：回数券 --- */

.tsunagu-ticket {
	background: #F5F7F6;
	padding: 120px 0;
}

.tsunagu-ticket__inner {
	max-width: 1040px;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.tsunagu-ticket__head {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-ticket__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.tsunagu-ticket__card {
	background: #FFFFFF;
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-ticket__card-label {
	margin: 0;
	font-size: 13px;
	letter-spacing: .16em;
	color: #00875A;
}

/* 1枚のカードに「10回分」「5回分」の2プランを縦に並べる。
   2つ目以降は区切り線を引いて視覚的に分ける（2026-08-10に5回分を追加） */
.tsunagu-ticket__plan {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.tsunagu-ticket__plan + .tsunagu-ticket__plan {
	padding-top: 16px;
	border-top: 1px solid #E4E9E6;
}

.tsunagu-ticket__plan-count {
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .08em;
	color: #2E3633;
}

.tsunagu-ticket__card-price {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	/* 1カード2プランになり縦に長くなったため、38px→32pxに調整 */
	font-size: 32px;
	letter-spacing: .02em;
	color: #0E1311;
}

.tsunagu-ticket__card-unit {
	margin: 0;
	font-size: 14px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #6B7370;
}

.tsunagu-ticket__note {
	background: #FFFFFF;
	border-left: 2px solid #00D084;
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-ticket__note-title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 22px;
	letter-spacing: .06em;
	line-height: 1.8;
	color: #0E1311;
}

/* 回数券の note-title だけマーカーのグラデーション境界が 66%（他は64%） */
.tsunagu-ticket__note-title .tsunagu-marker {
	background: linear-gradient(transparent 66%, rgba(0, 208, 132, .45) 66%);
}

.tsunagu-ticket__note-text {
	margin: 0;
	font-size: 15px;
	line-height: 2.1;
	letter-spacing: .05em;
	color: #2E3633;
}

/* --- お悩み別メニュー：症状インデックス --- */

.tsunagu-symptom-index {
	border-bottom: 1px solid #E2E6E4;
	padding: 56px 80px;
}

.tsunagu-symptom-index__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.tsunagu-symptom-index__link a {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 0;
	border-top: 2px solid #E2E6E4;
	color: #0E1311;
	transition: border-color .25s ease;
}

.tsunagu-symptom-index__link a:hover {
	color: #0E1311;
	border-top-color: #00D084;
}

.tsunagu-symptom-index__num {
	font-family: "Cormorant Garamond", serif;
	font-size: 15px;
	letter-spacing: .1em;
	color: #00875A;
}

.tsunagu-symptom-index__title {
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	letter-spacing: .06em;
}

.tsunagu-symptom-index__sub {
	font-size: 12px;
	letter-spacing: .06em;
	color: #6B7370;
}

/* --- お悩み別メニュー：症状ブロック（4件共通） --- */

.tsunagu-symptom {
	padding: 140px 0 120px;
}

.tsunagu-symptom--alt {
	background: #F5F7F6;
}

.tsunagu-symptom__inner {
	max-width: 1040px;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	flex-direction: column;
	gap: 72px;
}

.tsunagu-symptom__head {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 24px;
	align-items: flex-start;
}

.tsunagu-symptom__watermark {
	margin: 0;
	position: absolute;
	top: -84px;
	left: -16px;
	font-family: "Cormorant Garamond", serif;
	font-weight: 300;
	font-size: 120px;
	line-height: 1;
	color: rgba(154, 162, 158, .22);
	pointer-events: none;
}

.tsunagu-symptom--alt .tsunagu-symptom__watermark {
	color: rgba(154, 162, 158, .28);
}

.tsunagu-symptom__headinner {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
}

.tsunagu-symptom__lead {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 24px;
	line-height: 1.9;
	letter-spacing: .06em;
	color: #2E3633;
}

/* --- 緊急CTA（寝違え・ぎっくり腰のみ） --- */

.tsunagu-symptom__emergency {
	background: #6B7370;
	padding: 40px 48px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 40px;
	border-left: 4px solid #00D084;
}

.tsunagu-symptom__emergency-info {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tsunagu-symptom__emergency-tag {
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .16em;
	color: #00D084;
}

.tsunagu-symptom__emergency-title {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-size: 26px;
	letter-spacing: .06em;
	color: #FFFFFF;
}

.tsunagu-symptom__emergency-note {
	margin: 0;
	font-size: 13px;
	letter-spacing: .06em;
	color: rgba(255, 255, 255, .72);
}

/* 横並びボタンの高さ揃えについては、ファイル冒頭付近の
   「横並びボタンの高さ揃え」の共通方針コメントを参照。
   電話ボタン（20px）とLINEボタン（15px）でfont-sizeが異なるため、
   高さを内容任せにすると必ずズレる。 */
.tsunagu-symptom__emergency-actions {
	display: flex;
	align-items: stretch;
	gap: 0;
	flex: none;
}

.tsunagu-symptom__emergency-tel,
.tsunagu-symptom__emergency-line {
	display: flex;
	margin: 0;
}

.tsunagu-symptom__emergency-tel a,
.tsunagu-symptom__emergency-line a {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	box-sizing: border-box;
}

.tsunagu-symptom__emergency-tel a {
	padding: 20px 40px;
	background: #FFFFFF;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: .06em;
	color: #0E1311;
	white-space: nowrap;
}

.tsunagu-symptom__emergency-line a {
	padding: 20px 36px;
	background: #00D084;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .1em;
	color: #FFFFFF;
	white-space: nowrap;
}

/* --- こんなお悩みはありませんか？ --- */

.tsunagu-symptom__checklist {
	background: #F5F7F6;
	padding: 48px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-symptom--alt .tsunagu-symptom__checklist {
	background: #FFFFFF;
}

.tsunagu-symptom__checklist-items {
	display: flex;
	flex-direction: column;
	gap: 14px;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-symptom__checklist-item {
	margin: 0;
	display: flex;
	gap: 14px;
}

.tsunagu-symptom__checklist-bullet {
	color: #00D084;
	font-size: 12px;
	line-height: 2.4;
}

/* --- 見出し共通（サイズ違い2種） --- */

.tsunagu-symptom__heading-sm {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 24px;
	letter-spacing: .06em;
	color: #0E1311;
}

.tsunagu-symptom__heading-md {
	margin: 0;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 26px;
	letter-spacing: .06em;
	line-height: 1.7;
	color: #0E1311;
}

/* --- 原因（本文＋画像） --- */

.tsunagu-symptom__cause {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 56px;
	align-items: start;
}

.tsunagu-symptom__cause-text {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-symptom__text-block {
	display: flex;
	flex-direction: column;
	gap: 24px;
	font-size: 16px;
	line-height: 2.15;
	letter-spacing: .05em;
	color: #2E3633;
}

.tsunagu-symptom__text-block--bordered {
	border-left: 2px solid #00D084;
	padding-left: 32px;
}

.tsunagu-symptom__cause-fig {
	margin: 0;
	aspect-ratio: 3 / 4;
	overflow: hidden;
}

.tsunagu-symptom__cause-fig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-symptom__cause-fig--neck img {
	object-position: 20% 40%;
}

.tsunagu-symptom__cause-fig--low-back img {
	object-position: center center;
}

.tsunagu-symptom__cause-fig--acute img {
	object-position: 52% center;
}

.tsunagu-symptom__cause-fig--postpartum img {
	object-position: 65% center;
}

/* --- 放っておくとどうなる？／なぜ「今」ケアするのがよいのか --- */

.tsunagu-symptom__note {
	background: #F5F7F6;
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	border-left: 2px solid #6B7370;
}

.tsunagu-symptom--alt .tsunagu-symptom__note {
	background: #FFFFFF;
}

.tsunagu-symptom__note-title {
	margin: 0;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #0E1311;
}

.tsunagu-symptom__note-text {
	margin: 0;
	font-size: 15px;
	line-height: 2.1;
	letter-spacing: .05em;
	color: #2E3633;
}

.tsunagu-symptom__note-caution {
	margin: 0;
	font-size: 14px;
	line-height: 2;
	letter-spacing: .04em;
	color: #6B7370;
	border-top: 1px solid #E2E6E4;
	padding-top: 16px;
}

.tsunagu-symptom__note--accent {
	border-left-color: #00D084;
}

.tsunagu-symptom__note--accent .tsunagu-symptom__note-title {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500;
	font-size: 22px;
	line-height: 1.8;
	letter-spacing: .06em;
}

/* --- 当院のアプローチ --- */

.tsunagu-symptom__approach {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: start;
}

.tsunagu-symptom__approach-text {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-symptom__approach-media {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tsunagu-symptom__approach-fig {
	margin: 0;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.tsunagu-symptom__approach-fig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tsunagu-symptom__approach-fig--tall {
	aspect-ratio: 2 / 3;
}

/* --- ご来院前にご確認ください（産後ケアのみ） --- */

.tsunagu-symptom__precautions {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-symptom__precautions-table {
	display: flex;
	flex-direction: column;
	background: #FFFFFF;
}

.tsunagu-symptom__precautions-row {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 24px;
	padding: 22px 32px;
	border-bottom: 1px solid #E2E6E4;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-symptom__precautions-row:last-child {
	border-bottom: 0;
}

.tsunagu-symptom__precautions-row > * {
	margin: 0;
}

.tsunagu-symptom__precautions-label {
	font-weight: 500;
	color: #0E1311;
}

/* --- 改善までの目安／通院期間の目安 --- */

.tsunagu-symptom__timeline {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tsunagu-symptom__timeline-table {
	display: flex;
	flex-direction: column;
}

.tsunagu-symptom__timeline-row {
	display: grid;
	grid-template-columns: 220px 160px 1fr;
	gap: 24px;
	padding: 22px 0;
	border-bottom: 1px solid #E2E6E4;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #2E3633;
}

.tsunagu-symptom__timeline-row > * {
	margin: 0;
}

.tsunagu-symptom__timeline-table--wide .tsunagu-symptom__timeline-row {
	grid-template-columns: 220px 200px 1fr;
}

.tsunagu-symptom__timeline-row--head {
	padding: 14px 0;
	border-bottom: 1px solid #0E1311;
	font-size: 13px;
	line-height: 1.4;
	letter-spacing: .1em;
	color: #6B7370;
}

.tsunagu-symptom__timeline-period {
	font-weight: 500;
	color: #0E1311;
}

.tsunagu-symptom__timeline-note {
	margin: 0;
	font-size: 14px;
	line-height: 1.9;
	letter-spacing: .04em;
	color: #6B7370;
}

/* ==========================================================================
   レスポンシブ（タブレット以下）
   静的HTMLはデスクトップ1440px固定のためSP版は存在せず、ここは新規設計。
   グローバルナビ5項目＋ご予約ボタンは 1060px 未満で2段に折り返してしまうため、
   余裕を見て 1079px 以下でハンバーガー＋ドロワーに切り替える。
   （JS側の matchMedia も 1080px と揃えること）
   ========================================================================== */

@media (max-width: 1079px) {

	:root {
		--tsunagu-header-height: 64px;
	}

	.tsunagu-header__inner {
		padding-left: 24px;
	}

	.tsunagu-header__logo img {
		width: 116px;
	}

	/* --- ハンバーガーボタン --- */

	.tsunagu-header__toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: auto;
		width: var(--tsunagu-header-height);
		height: var(--tsunagu-header-height);
		padding: 0;
		border: 0;
		/* WEBご予約ボタンと同じグレー。開閉どちらの状態でも配色は統一。 */
		background: #6B7370;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
	}

	.tsunagu-header__toggle-bars,
	.tsunagu-header__toggle-bars::before,
	.tsunagu-header__toggle-bars::after {
		display: block;
		width: 24px;
		height: 2px;
		/* LINEの緑。閉じている3本線・開いている×アイコンの両方に使う。 */
		background: #00D084;
		transition: transform .3s ease, background-color .2s ease;
	}

	.tsunagu-header__toggle-bars {
		position: relative;
	}

	.tsunagu-header__toggle-bars::before,
	.tsunagu-header__toggle-bars::after {
		content: "";
		position: absolute;
		left: 0;
	}

	.tsunagu-header__toggle-bars::before {
		top: -7px;
	}

	.tsunagu-header__toggle-bars::after {
		top: 7px;
	}

	/* 開いているときは×印に変形 */
	.tsunagu-header__toggle[aria-expanded="true"] .tsunagu-header__toggle-bars {
		background: transparent;
	}

	.tsunagu-header__toggle[aria-expanded="true"] .tsunagu-header__toggle-bars::before {
		transform: translateY(7px) rotate(45deg);
	}

	.tsunagu-header__toggle[aria-expanded="true"] .tsunagu-header__toggle-bars::after {
		transform: translateY(-7px) rotate(-45deg);
	}

	/* --- ドロワー本体（PC用の .tsunagu-header__right を流用） --- */

	.tsunagu-header__right {
		position: fixed;
		top: var(--tsunagu-header-height);
		right: 0;
		z-index: 60;
		width: min(340px, 100%);
		/* コンテンツ量に関わらず常に画面下端まで背景を敷き詰める（旧: max-height でコンテンツ分だけの高さだった）。
		   コンテンツがこの高さを超える場合は overflow-y: auto で従来通りスクロールする。
		   box-sizing: border-box にしないと、下記paddingの分だけ実際のボックスが
		   画面下端を超えてはみ出してしまう（height指定はcontent-boxだとpaddingを含まないため）。 */
		height: calc(100vh - var(--tsunagu-header-height));
		height: calc(100dvh - var(--tsunagu-header-height));
		box-sizing: border-box;
		margin-left: 0;
		gap: 0;
		flex: none;
		flex-direction: column;
		align-items: stretch;
		background: #FFFFFF;
		border-left: 1px solid #E2E6E4;
		padding: 8px 0 32px;
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .3s ease, visibility 0s linear .3s;
	}

	body.tsunagu-drawer-open .tsunagu-header__right {
		transform: translateX(0);
		visibility: visible;
		transition: transform .3s ease, visibility 0s linear 0s;
	}

	/* ドロワーを開いている間は背面をスクロールさせない */
	body.tsunagu-drawer-open {
		overflow: hidden;
	}

	/* --- ドロワー内の並び順 ---
	   DOM順（CTA→ナビ→店舗情報）はPC版と共用のため変更せず、表示順の入れ替えは
	   flexのorderのみで行う（1:ナビ2カラムグリッド → 2:店舗情報 → 3:CTA予約ボタン）。 */

	.tsunagu-header__cta {
		order: 3;
	}

	.tsunagu-gnav {
		order: 1;
	}

	.tsunagu-drawer-store {
		order: 2;
	}

	/* --- ドロワー内のナビゲーション（2カラムグリッド） --- */

	.tsunagu-gnav {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		/* カード間の区切りはボーダーではなく余白で表現する。 */
		gap: 8px 12px;
		font-size: 15px;
		padding: 16px;
	}

	.tsunagu-gnav__link,
	.tsunagu-gnav__link:hover {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 4px;
		min-height: 88px;
		padding: 16px 8px;
		text-align: center;
		box-sizing: border-box;
		/* PC版の border-bottom（下線での現在地表示）を打ち消す。モバイルではボーダーを一切使わない。 */
		border-bottom: 0;
		transition: background-color .25s ease;
	}

	.tsunagu-gnav__link:hover {
		background: #F5F7F6;
	}

	/* 現在表示中のページ。ボーダーは使わず、英字ラベルの色でハイライトする。 */
	.tsunagu-gnav__link.is-current .tsunagu-gnav__link-en,
	.tsunagu-gnav__link.is-current:hover .tsunagu-gnav__link-en {
		color: #00D084;
	}

	.tsunagu-gnav__link-en {
		display: block;
		font-size: 17px;
		font-weight: 800;
		letter-spacing: .04em;
		color: #0E1311;
	}

	.tsunagu-gnav__link-ja {
		display: block;
		font-size: 11px;
		letter-spacing: .02em;
		color: #6B7370;
	}

	/* 表示順の入れ替え（ご指定順: TREATMENT→PRICE→ABOUT→MENU→COLUMN）。
	   header.phpのDOM順（施術/当院/料金/メニュー/コラム/Instagram）は変更しないため、
	   nth-childで対象を特定し、順序と特別な配置のみCSSで制御する。 */
	.tsunagu-gnav__link:nth-child(1) {
		order: 1; /* TREATMENT */
	}

	.tsunagu-gnav__link:nth-child(2) {
		order: 3; /* ABOUT */
	}

	.tsunagu-gnav__link:nth-child(3) {
		order: 2; /* PRICE */
	}

	/* MENU。子メニューを持つためラッパー（.tsunagu-gnav__item）が直下要素になっている。 */
	.tsunagu-gnav__item:nth-child(4) {
		order: 4;
	}

	/* COLUMN */
	.tsunagu-gnav__link:nth-child(5) {
		order: 5;
	}

	/* 公式Instagram（2026-08-18にドロワーへ追加。6項目になり2カラム×3行で埋まる）。 */
	.tsunagu-gnav__link:nth-child(6) {
		order: 6;
	}

	/* --- ドロワー内の子メニュー（アコーディオン） ---
	   PC幅のホバー式プルダウンではタップで開けないため、SPでは開閉ボタン方式にする。 */

	.tsunagu-gnav__item {
		display: block;
		position: relative;
	}

	.tsunagu-gnav__subtoggle {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 44px;
		height: 88px;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
	}

	/* 開閉状態を示す矢印（開くと180度回転する）。 */
	.tsunagu-gnav__subtoggle::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 8px;
		height: 8px;
		margin: -6px 0 0 -4px;
		border-right: 2px solid #6B7370;
		border-bottom: 2px solid #6B7370;
		transform: rotate(45deg);
		transition: transform .2s ease;
	}

	.tsunagu-gnav__subtoggle[aria-expanded="true"]::before {
		margin-top: -2px;
		transform: rotate(-135deg);
	}

	.tsunagu-subnav {
		position: static;
		transform: none;
		min-width: 0;
		padding: 0;
		border: 0;
		box-shadow: none;
		background: transparent;
		opacity: 1;
		visibility: visible;
		transition: none;
		display: none;
	}

	.tsunagu-subnav::before {
		content: none;
	}

	/* ホバーでは開かない（タップ＝ホバー扱いになる端末での誤作動を防ぐ）。 */
	.tsunagu-gnav__item--has-sub:hover .tsunagu-subnav,
	.tsunagu-gnav__item--has-sub:focus-within .tsunagu-subnav {
		display: none;
	}

	.tsunagu-gnav__item.is-open .tsunagu-subnav,
	.tsunagu-gnav__item--has-sub.is-open:hover .tsunagu-subnav,
	.tsunagu-gnav__item--has-sub.is-open:focus-within .tsunagu-subnav {
		display: block;
	}

	.tsunagu-subnav__link {
		justify-content: center;
		padding: 12px 8px;
		font-size: 13px;
		white-space: normal;
	}

	/* --- ドロワー内のご予約ボタン --- */

	.tsunagu-header__cta {
		gap: 12px;
		padding: 24px;
	}

	.tsunagu-header__cta-btn {
		width: auto;
		flex: 1 1 0;
		height: 64px;
		gap: 4px;
	}

	/* --- ドロワー最下部：店舗情報ブロック --- */

	.tsunagu-drawer-store {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		margin-top: 8px;
		padding: 24px;
		border-top: 1px solid #E2E6E4;
		background: #F5F7F6;
		text-align: center;
	}

	.tsunagu-drawer-store__logo {
		width: 120px;
		height: auto;
		display: block;
	}

	.tsunagu-drawer-store__address {
		margin: 0;
		font-size: 12px;
		line-height: 1.7;
		letter-spacing: .02em;
		color: #2E3633;
	}

	.tsunagu-drawer-store__tel,
	.tsunagu-drawer-store__tel:hover {
		font-size: 18px;
		font-weight: 700;
		color: #00875A;
	}

	.tsunagu-drawer-store__note {
		margin: 0;
		font-size: 12px;
		color: #6B7370;
	}

	/* --- 背面のオーバーレイ --- */

	.tsunagu-header__overlay {
		display: block;
		position: fixed;
		top: var(--tsunagu-header-height);
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 55;
		background: rgba(14, 19, 17, .4);
		opacity: 0;
		visibility: hidden;
		transition: opacity .3s ease, visibility 0s linear .3s;
	}

	body.tsunagu-drawer-open .tsunagu-header__overlay {
		opacity: 1;
		visibility: visible;
		transition: opacity .3s ease, visibility 0s linear 0s;
	}

	/* --- フッター --- */

	.tsunagu-footer {
		padding: 80px 32px 40px;
	}

	.tsunagu-footer__inner {
		gap: 48px;
	}

	/* --- トップページ各セクション --- */

	.tsunagu-heading {
		font-size: 32px;
	}

	.tsunagu-hero__copy {
		grid-template-columns: 1fr;
		gap: 32px;
		padding: 24px 24px 24px;
	}

	.tsunagu-hero__title {
		font-size: 40px;
	}

	.tsunagu-concept {
		padding: 96px 0;
	}

	.tsunagu-concept__inner {
		grid-template-columns: 1fr;
		gap: 56px;
		padding: 0 24px;
	}

	/* 重ね合わせをやめて横並びに */
	.tsunagu-concept__figures {
		position: static;
		height: auto;
		margin-top: 0;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 16px;
		align-items: start;
	}

	.tsunagu-concept__fig {
		position: static;
		width: auto;
		height: auto;
	}

	.tsunagu-concept__fig--tall {
		border: 0;
	}

	.tsunagu-concept__fig img {
		width: 100%;
		height: auto;
		aspect-ratio: 3 / 2;
	}

	.tsunagu-concept__watermark {
		top: -70px;
		right: 0;
		font-size: 96px;
	}

	.tsunagu-concept__title {
		font-size: 32px;
	}

	.tsunagu-menu {
		padding: 96px 0;
	}

	.tsunagu-menu__inner {
		padding: 0 24px;
	}

	.tsunagu-menu__head,
	.tsunagu-menu__grid {
		width: 100%;
	}

	.tsunagu-menu__grid {
		gap: 24px;
	}

	.tsunagu-flow {
		padding: 96px 0;
	}

	.tsunagu-flow__inner,
	.tsunagu-voice__inner,
	.tsunagu-newscol__inner,
	.tsunagu-faq__inner,
	.tsunagu-calendar__inner {
		padding: 0 24px;
	}

	.tsunagu-archive-hero {
		padding: 56px 24px 32px;
	}

	.tsunagu-archive__inner {
		padding: 48px 24px 96px;
	}

	.tsunagu-single__inner {
		padding: 48px 24px 96px;
	}

	.tsunagu-archive-column-item {
		grid-template-columns: 200px 1fr;
		gap: 24px;
	}

	.tsunagu-flowrow {
		grid-template-columns: 64px 200px 1fr;
		gap: 20px;
	}

	.tsunagu-policy {
		padding: 0 0 96px;
	}

	.tsunagu-policy__hero {
		height: 400px;
		margin-right: 80px;
	}

	.tsunagu-policy__card {
		margin: -120px 24px 0;
		padding: 48px 40px;
		width: auto;
	}

	.tsunagu-voice,
	.tsunagu-newscol,
	.tsunagu-faq {
		padding: 96px 0;
	}

	.tsunagu-newscol__grid {
		gap: 48px;
	}

	.tsunagu-access__body {
		padding: 64px 40px;
	}

	.tsunagu-embed--map {
		min-height: 420px;
	}

	.tsunagu-calendar {
		padding: 96px 0;
	}

	/* --- 診療カレンダー --- */

	.tsunagu-schedule__head {
		padding: 16px 20px;
	}

	.tsunagu-schedule__nav {
		padding: 6px 8px;
		font-size: 12px;
	}

	.tsunagu-schedule__month {
		font-size: 18px;
	}

	.tsunagu-cta {
		padding: 96px 24px;
	}

	/* --- 下層固定ページ --- */

	.tsunagu-page-hero {
		height: 300px;
	}

	.tsunagu-page-hero__inner {
		padding: 0 40px;
		gap: 16px;
	}

	.tsunagu-page-hero__label {
		font-size: 14px;
	}

	.tsunagu-page-hero__title {
		font-size: 38px;
	}

	/* --- 施術について --- */

	.tsunagu-treatment-intro {
		padding: 96px 0;
	}

	.tsunagu-treatment-intro__inner {
		grid-template-columns: 1fr;
		gap: 56px;
		padding: 0 24px;
	}

	.tsunagu-treatment-intro__watermark {
		top: -70px;
		font-size: 96px;
	}

	/* 重ね合わせをやめてグリッドに */
	.tsunagu-treatment-intro__figures {
		position: static;
		height: auto;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 16px;
	}

	.tsunagu-treatment-intro__fig {
		position: static;
		width: auto;
		height: auto;
	}

	.tsunagu-treatment-intro__fig--right,
	.tsunagu-treatment-intro__fig--bottom {
		border: 0;
	}

	.tsunagu-treatment-intro__fig img {
		width: 100%;
		height: auto;
		aspect-ratio: 3 / 2;
	}

	.tsunagu-treatment-intro__fig--bottom {
		grid-column: span 2;
	}

	.tsunagu-elesas {
		padding: 96px 0;
	}

	.tsunagu-elesas__inner {
		padding: 0 24px;
		gap: 56px;
	}

	.tsunagu-elesas__body {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	/* --- 当院について --- */

	.tsunagu-greeting {
		padding: 96px 0;
	}

	.tsunagu-greeting__inner {
		grid-template-columns: 1fr;
		gap: 56px;
		padding: 0 24px;
	}

	.tsunagu-greeting__profile {
		padding-top: 0;
		max-width: 320px;
	}

	.tsunagu-greeting__watermark {
		top: -70px;
		font-size: 96px;
	}

	.tsunagu-gallery {
		padding: 64px 32px;
	}

	.tsunagu-gallery__grid {
		gap: 10px;
	}

	/* --- 料金について --- */

	.tsunagu-pricelist {
		padding: 96px 0 80px;
	}

	.tsunagu-pricelist__inner {
		padding: 0 24px;
		gap: 48px;
	}

	.tsunagu-pricelist__watermark {
		top: -60px;
		font-size: 88px;
	}

	.tsunagu-pricelist__first {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		padding: 32px;
	}

	.tsunagu-pricelist__row {
		grid-template-columns: 1fr auto auto;
		gap: 16px;
	}

	.tsunagu-ticket {
		padding: 96px 0;
	}

	.tsunagu-ticket__inner {
		padding: 0 24px;
	}

	.tsunagu-ticket__grid {
		grid-template-columns: 1fr;
	}

	/* --- お悩み別メニュー --- */

	.tsunagu-symptom-index {
		padding: 40px 24px;
	}

	.tsunagu-symptom-index__inner {
		grid-template-columns: repeat(2, 1fr);
		gap: 32px 20px;
	}

	.tsunagu-symptom {
		padding: 96px 0;
	}

	.tsunagu-symptom__inner {
		padding: 0 24px;
		gap: 56px;
	}

	.tsunagu-symptom__watermark {
		top: -60px;
		font-size: 88px;
	}

	.tsunagu-symptom__emergency {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		padding: 32px;
	}

	.tsunagu-symptom__cause {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.tsunagu-symptom__cause-fig {
		aspect-ratio: 16 / 9;
	}

	.tsunagu-symptom__approach {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.tsunagu-symptom__approach-media {
		flex-direction: row;
	}

	.tsunagu-symptom__approach-media--single {
		flex-direction: column;
		max-width: 360px;
	}

	.tsunagu-symptom__timeline-row,
	.tsunagu-symptom__timeline-table--wide .tsunagu-symptom__timeline-row {
		grid-template-columns: 160px 140px 1fr;
		gap: 16px;
	}
}

/* ==========================================================================
   レスポンシブ（スマートフォン）
   ========================================================================== */

@media (max-width: 768px) {

	:root {
		--tsunagu-header-height: 60px;
	}

	.tsunagu-header__inner {
		padding-left: 16px;
	}

	.tsunagu-header__logo img {
		width: 104px;
	}

	.tsunagu-header__right {
		width: 100%;
		border-left: 0;
	}

	/* --- フッター：2カラム → 1カラム --- */

	.tsunagu-footer {
		padding: 64px 24px 32px;
	}

	.tsunagu-footer__inner {
		grid-template-columns: 1fr;
		gap: 40px;
		padding-bottom: 40px;
	}

	.tsunagu-footer__logo {
		width: 140px;
	}

	.tsunagu-footer__address {
		font-size: 13px;
		line-height: 1.9;
	}

	.tsunagu-footer__nav {
		gap: 12px 24px;
		font-size: 13px;
	}

	/* --- トップページ各セクション --- */

	.tsunagu-heading {
		font-size: 26px;
	}

	/* ヒーロー：画像を拡大し、テキストパネルを画像下部に半透明で重ねる
	   （コピーをposition:absoluteでフローから外すことで、唯一のフロー内要素になった
	   スライダーがセクション上端から表示される。DOM順の入れ替えは不要） */
	.tsunagu-hero {
		position: relative;
	}

	.tsunagu-hero__copy {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 2;
		display: flex;
		flex-direction: column;
		gap: 14px;
		align-items: flex-start;
		background: rgba(255, 255, 255, .85);
		padding: 20px 20px 24px;
	}

	.tsunagu-hero__title {
		font-size: 26px;
		line-height: 1.4;
	}

	.tsunagu-hero__title-break--sp {
		display: inline;
	}

	.tsunagu-hero__lead {
		gap: 10px;
		padding-bottom: 0;
	}

	.tsunagu-hero__text {
		font-size: 15px;
	}

	.tsunagu-hero__en {
		letter-spacing: .14em;
	}

	.tsunagu-hero__slider {
		aspect-ratio: 2 / 3;
	}

	/* 更新バッジ：下部はテキストパネルが重なるため、モバイルでは画像の右上に置く。 */
	.tsunagu-hero__update {
		right: 16px;
		bottom: auto;
		top: 16px;
		padding: 6px 12px;
		gap: 8px;
		font-size: 12px;
	}

	/* --- SP専用：画面最下部に追従する予約ボタン --- */

	.tsunagu-spbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 55;
		display: flex;
		gap: 1px;
		background: #E2E6E4;
		box-shadow: 0 -2px 12px rgba(14, 19, 17, .12);
	}

	/* ドロワーを開いている間は重ならないよう隠す（ドロワー内にも同じ予約ボタンがあるため）。 */
	body.tsunagu-drawer-open .tsunagu-spbar {
		display: none;
	}

	.tsunagu-spbar__btn {
		flex: 1 1 0;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 56px;
		padding: 8px;
		box-sizing: border-box;
		font-size: 15px;
		font-weight: 700;
		letter-spacing: .06em;
		color: #FFFFFF;
	}

	.tsunagu-spbar__btn--line {
		background: #00D084;
	}

	.tsunagu-spbar__btn--web {
		background: #6B7370;
	}

	.tsunagu-spbar__btn:hover {
		color: #FFFFFF;
	}

	/* 追従バーの高さぶん、ページ末尾に余白を確保する（フッターが隠れないようにするため）。 */
	.tsunagu-site {
		padding-bottom: 56px;
	}

	.tsunagu-concept {
		padding: 72px 0;
	}

	.tsunagu-concept__inner {
		gap: 40px;
		padding: 0 16px;
	}

	/* 斜め配置のオーバーレイをスマホでも踏襲。PC版の実測比率
	   （コンテナ680/640、wide460/307、tall296/444）をそのまま
	   aspect-ratio + %に変換しているため、幅が変わっても重なり方が崩れない */
	.tsunagu-concept__figures {
		position: relative;
		display: block;
		height: auto;
		aspect-ratio: 16 / 17;
		margin-top: 0;
	}

	.tsunagu-concept__fig {
		position: absolute;
	}

	.tsunagu-concept__fig--wide {
		left: 0;
		top: 0;
		width: 72%;
		aspect-ratio: 460 / 307;
	}

	.tsunagu-concept__fig--tall {
		right: 0;
		bottom: 0;
		width: 46.25%;
		aspect-ratio: 2 / 3;
		border: 6px solid #FFFFFF;
	}

	.tsunagu-concept__fig--wide img,
	.tsunagu-concept__fig--tall img {
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
		object-fit: cover;
	}

	.tsunagu-concept__body {
		gap: 32px;
	}

	.tsunagu-concept__watermark {
		top: -46px;
		font-size: 64px;
	}

	.tsunagu-concept__title {
		font-size: 26px;
	}

	.tsunagu-concept__text {
		gap: 24px;
		padding-left: 20px;
		font-size: 15px;
	}

	.tsunagu-menu {
		padding: 72px 0;
	}

	.tsunagu-menu__inner {
		padding: 0 16px;
		gap: 32px;
	}

	.tsunagu-menu__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.tsunagu-menu__grid {
		grid-template-columns: 1fr;
	}

	.tsunagu-menucard {
		height: 280px;
	}

	.tsunagu-menucard__body {
		left: 24px;
		right: 24px;
		bottom: 24px;
	}

	.tsunagu-menucard__title {
		font-size: 24px;
	}

	.tsunagu-flow {
		padding: 72px 0;
	}

	.tsunagu-flow__inner,
	.tsunagu-voice__inner,
	.tsunagu-newscol__inner,
	.tsunagu-faq__inner,
	.tsunagu-calendar__inner {
		padding: 0 16px;
	}

	.tsunagu-archive-hero {
		padding: 40px 16px 24px;
	}

	.tsunagu-archive__inner {
		padding: 40px 16px 72px;
	}

	.tsunagu-single__inner {
		padding: 40px 16px 72px;
	}

	.tsunagu-archive-item__title {
		font-size: 17px;
	}

	.tsunagu-archive-column-item {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.tsunagu-archive-column-item__thumb {
		aspect-ratio: 3 / 2;
	}

	.tsunagu-single__thumbnail {
		margin-bottom: 24px;
	}

	.tsunagu-flow__head,
	.tsunagu-calendar__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.tsunagu-flowrow {
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 24px 0;
	}

	.tsunagu-flowrow__num {
		font-size: 24px;
	}

	.tsunagu-flowrow__body {
		font-size: 15px;
	}

	.tsunagu-policy {
		padding: 0 0 72px;
	}

	.tsunagu-policy__hero {
		height: 260px;
		margin-right: 0;
	}

	.tsunagu-policy__card {
		margin: -60px 16px 0;
		padding: 32px 24px;
		gap: 32px;
	}

	.tsunagu-policy__lead {
		font-size: 15px;
	}

	.tsunagu-policy__list {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.tsunagu-policy__item {
		font-size: 15px;
		padding: 20px 0;
	}

	.tsunagu-voice,
	.tsunagu-newscol,
	.tsunagu-faq {
		padding: 72px 0;
	}

	.tsunagu-voice__inner,
	.tsunagu-faq__inner {
		gap: 32px;
	}

	.tsunagu-voice__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.tsunagu-newscol__grid {
		grid-template-columns: 1fr;
		gap: 56px;
	}

	.tsunagu-newscol__heading {
		font-size: 24px;
	}

	.tsunagu-columnitem {
		grid-template-columns: 96px 1fr;
		gap: 16px;
	}

	.tsunagu-columnitem__thumb {
		height: 72px;
	}

	.tsunagu-faq__q {
		grid-template-columns: 28px 1fr 16px;
		gap: 12px;
		padding: 20px 0;
	}

	.tsunagu-faq__question {
		font-size: 16px;
	}

	.tsunagu-faq__a {
		grid-template-columns: 28px 1fr;
		gap: 12px;
		padding-bottom: 24px;
	}

	.tsunagu-faq__answer {
		font-size: 15px;
	}

	.tsunagu-access {
		grid-template-columns: 1fr;
	}

	.tsunagu-access__body {
		padding: 56px 24px;
	}

	.tsunagu-embed--map {
		min-height: 320px;
	}

	.tsunagu-calendar {
		padding: 72px 0;
	}

	/* --- 診療カレンダー ---
	   7列を横スクロールなしで収めるため、セルの余白・文字サイズを一段詰める。 */

	.tsunagu-schedule__head {
		padding: 14px 12px;
		gap: 4px;
	}

	.tsunagu-schedule__nav {
		padding: 6px;
		font-size: 11px;
		gap: 2px;
	}

	.tsunagu-schedule__month {
		font-size: 17px;
	}

	.tsunagu-schedule__month-year {
		font-size: 13px;
	}

	.tsunagu-schedule__table {
		min-width: 0;
	}

	.tsunagu-schedule__weekday {
		padding: 8px 1px;
		font-size: 12px;
		letter-spacing: 0;
	}

	.tsunagu-schedule__cell {
		padding: 6px 1px 8px;
	}

	.tsunagu-schedule__date {
		font-size: 13px;
	}

	.tsunagu-schedule__cell .tsunagu-schedule__mark {
		margin-top: 6px;
		font-size: 15px;
	}

	.tsunagu-schedule__mark {
		font-size: 11px;
	}

	/* 曜日ごとの診療時間：曜日ラベルの固定幅を詰めて、狭い画面でも
	   「曜日／時間」を1行に保つ（曜日だけが1行を占有すると間延びするため）。
	   幅が足りないときは <dd> 側が内部で折り返し、「（最終受付 …）」だけが
	   次の行に落ちる。時間の開始位置は縦に揃ったままになる。 */

	.tsunagu-schedule__hours {
		padding: 14px 16px;
	}

	.tsunagu-schedule__hours-row {
		gap: 2px 10px;
	}

	.tsunagu-schedule__hours-days {
		width: 100px;
		font-size: 13px;
		letter-spacing: 0;
	}

	.tsunagu-schedule__hours-range {
		font-size: 14px;
	}

	.tsunagu-schedule__hours-last {
		font-size: 11px;
	}

	.tsunagu-schedule__foot {
		gap: 8px;
		padding: 12px 16px;
	}

	.tsunagu-schedule__legend {
		gap: 16px;
		font-size: 12px;
	}

	.tsunagu-schedule__notes {
		padding-top: 8px;
		font-size: 12px;
		letter-spacing: 0;
	}

	.tsunagu-cta {
		padding: 72px 16px;
	}

	/* CTAの見出しは2行構成（<br>で1回改行）だが、モバイルでは26pxのままだと
	   各行がさらに折り返して4行になってしまう。行あたりの最長が17文字あるため、
	   固定pxではなくビューポート幅に追従させ、どの端末幅でも2行に収まるようにする。
	   min() の上限26pxは、幅の広い端末（600〜768px）で元のサイズに戻すため。
	   左右の -8px は、セクションのpadding(16px)を見出しだけ食い込ませて
	   1行あたりの使える幅を稼ぐもの（ボタン等の余白は変えない）。 */
	.tsunagu-cta .tsunagu-heading {
		font-size: min(4.7vw, 26px);
		letter-spacing: .04em;
		line-height: 1.75;
		margin-left: -8px;
		margin-right: -8px;
	}

	/* 縦積みになるとalign-items:stretchでは高さが揃わない（cross axisが幅になるため）。
	   grid + grid-auto-rows:1fr にすると、各行が一番高いボタンに合わせて自動的に揃う
	   （px指定でないので、文言やfont-size、borderの有無が変わっても破綻しない）。 */
	.tsunagu-cta__buttons {
		display: grid;
		grid-auto-rows: 1fr;
		width: 100%;
		max-width: 320px;
		gap: 12px;
	}

	.tsunagu-cta__btn a,
	.tsunagu-cta__btn a:hover {
		padding: 18px 24px;
		text-align: center;
	}

	/* --- 下層固定ページ --- */

	.tsunagu-page-hero {
		height: 240px;
	}

	.tsunagu-page-hero__inner {
		padding: 0 24px;
		gap: 14px;
	}

	.tsunagu-page-hero__label {
		gap: 10px;
		font-size: 13px;
	}

	.tsunagu-page-hero__label::before {
		height: 18px;
	}

	.tsunagu-page-hero__title {
		font-size: 28px;
		letter-spacing: .08em;
	}

	.tsunagu-page > :where(p, h2, h3, h4, ul, ol, blockquote, figure, table) {
		padding-left: 24px;
		padding-right: 24px;
	}

	/* --- 施術について --- */

	.tsunagu-treatment-intro {
		padding: 72px 0;
	}

	.tsunagu-treatment-intro__inner {
		padding: 0 16px;
		gap: 40px;
	}

	.tsunagu-treatment-intro__body {
		gap: 40px;
	}

	.tsunagu-treatment-intro__watermark {
		top: -46px;
		font-size: 64px;
	}

	.tsunagu-treatment-intro__text {
		gap: 24px;
		padding-left: 20px;
		font-size: 15px;
	}

	.tsunagu-treatment-intro__figures {
		grid-template-columns: 1fr;
	}

	.tsunagu-treatment-intro__fig--bottom {
		grid-column: auto;
	}

	.tsunagu-elesas {
		padding: 72px 0;
	}

	.tsunagu-elesas__inner {
		padding: 0 16px;
		gap: 40px;
	}

	.tsunagu-elesas__subfigs {
		gap: 12px;
	}

	.tsunagu-elesas__note {
		padding: 24px;
	}

	/* --- 当院について --- */

	.tsunagu-greeting {
		padding: 72px 0;
	}

	.tsunagu-greeting__inner {
		padding: 0 16px;
		gap: 40px;
	}

	.tsunagu-greeting__watermark {
		top: -46px;
		font-size: 64px;
	}

	.tsunagu-greeting__text {
		gap: 24px;
		padding-left: 20px;
		font-size: 15px;
	}

	.tsunagu-gallery {
		padding: 48px 16px;
	}

	.tsunagu-gallery__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.tsunagu-gallery__fig--room,
	.tsunagu-gallery__fig--team {
		grid-column: span 2;
	}

	.tsunagu-gallery__fig--elesas {
		grid-row: auto;
		aspect-ratio: 4 / 3;
	}

	/* --- 料金について --- */

	.tsunagu-pricelist {
		padding: 72px 0 56px;
	}

	.tsunagu-pricelist__inner {
		padding: 0 16px;
		gap: 40px;
	}

	.tsunagu-pricelist__watermark {
		top: -36px;
		font-size: 56px;
	}

	.tsunagu-pricelist__first {
		padding: 24px;
	}

	.tsunagu-pricelist__first-price {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}

	.tsunagu-pricelist__row {
		grid-template-columns: 1fr;
		row-gap: 4px;
		padding: 16px 0;
	}

	.tsunagu-pricelist__row-price {
		text-align: left;
	}

	.tsunagu-ticket {
		padding: 72px 0;
	}

	.tsunagu-ticket__inner {
		padding: 0 16px;
	}

	.tsunagu-ticket__card,
	.tsunagu-ticket__note {
		padding: 24px;
	}

	/* --- お悩み別メニュー --- */

	.tsunagu-symptom-index {
		padding: 32px 16px;
	}

	.tsunagu-symptom-index__inner {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.tsunagu-symptom-index__link a {
		padding: 20px 0;
	}

	.tsunagu-symptom {
		padding: 72px 0;
	}

	.tsunagu-symptom__inner {
		padding: 0 16px;
		gap: 40px;
	}

	.tsunagu-symptom__watermark {
		top: -40px;
		font-size: 64px;
	}

	.tsunagu-symptom__lead {
		font-size: 19px;
	}

	.tsunagu-symptom__emergency {
		padding: 24px;
	}

	/* 縦積み時の高さ揃えは .tsunagu-cta__buttons と同じ grid + grid-auto-rows:1fr 方式 */
	.tsunagu-symptom__emergency-actions {
		display: grid;
		grid-auto-rows: 1fr;
		width: 100%;
		gap: 8px;
	}

	.tsunagu-symptom__emergency-tel a,
	.tsunagu-symptom__emergency-line a {
		justify-content: center;
		width: 100%;
		padding: 16px 24px;
		box-sizing: border-box;
	}

	.tsunagu-symptom__checklist {
		padding: 24px;
	}

	.tsunagu-symptom__text-block--bordered {
		padding-left: 20px;
	}

	.tsunagu-symptom__approach-media {
		flex-direction: column;
	}

	.tsunagu-symptom__approach-media--single {
		max-width: none;
	}

	.tsunagu-symptom__note {
		padding: 24px;
	}

	.tsunagu-symptom__precautions-row {
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 20px 0;
	}

	.tsunagu-symptom__timeline-row,
	.tsunagu-symptom__timeline-row--head,
	.tsunagu-symptom__timeline-table--wide .tsunagu-symptom__timeline-row {
		grid-template-columns: 1fr;
		row-gap: 4px;
		padding: 16px 0;
	}

	.tsunagu-symptom__timeline-row--head {
		display: none;
	}

	.tsunagu-symptom__timeline-period {
		font-size: 13px;
		letter-spacing: .1em;
		color: #00875A;
	}
}