@charset "utf-8";
/* ==========================================================================
   下層ページ共通（診療メニュー・固定ページ）

   TOPのトンマナ（ゴールド #a8803f / #d0b07a、墨 #39353b、地 #ededed、
   ベージュ #e2ddd5、Jost + Noto Sans JP、細い罫線と余白の取り方）を引き継ぐ。
   TOPが「写真で見せる」構成なのに対し、下層は「読ませる」構成なので
   行長・行間・見出しの階層を優先し、装飾は罫線と数字に絞る。
   ========================================================================== */

/* ==========================================================================
   ページヘッダー（ヒーロー）
   ========================================================================== */

.p-page__hero {
	position: relative;
	display: grid;
	align-content: center;
	min-height: 420px;
	padding-block: 40px;
	/* 写真が無いページでも background 宣言が無効にならないよう none を既定にする */
	background: var(--c-ink-deep) var(--hero, none) center / cover no-repeat;
	overflow: hidden;
	text-align: center;
	color: var(--c-wh);
}

/* 写真の上でも文字が読めるように暗幕を敷く */
.p-page__hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(31, 28, 32, 0.52), rgba(31, 28, 32, 0.34) 45%, rgba(31, 28, 32, 0.62));
}

.p-page__hero--plain::before {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.12));
}

.p-page__hero > * { position: relative; }

.p-page__hero-en {
	font-family: var(--f-en);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--c-gold);
}

.p-page__hero-ja {
	margin-top: 14px;
	font-size: clamp(26px, 3.4vw, 44px);
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.4;
	text-wrap: balance;
}

.p-page__hero-lead {
	margin-top: 16px;
	font-size: 14px;
	line-height: 1.9;
	color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 767px) {
	.p-page__hero { min-height: 260px; padding-block: 28px; }
	.p-page__hero-en { font-size: 11px; letter-spacing: 0.18em; }
	.p-page__hero-ja { margin-top: 10px; }
}

/* ==========================================================================
   リード文
   ========================================================================== */

.p-page__lead {
	max-width: 860px;
	margin-inline: auto;
	padding-block: 76px 0;
	font-size: 16px;
	line-height: 2.1;
	letter-spacing: 0.02em;
}

@media (max-width: 767px) {
	.p-page__lead { padding-block: 44px 0; font-size: 15px; line-height: 2; }
}

/* ==========================================================================
   目次
   ========================================================================== */

.c-toc {
	max-width: 860px;
	margin: 56px auto 0;
	padding: 34px 40px 38px;
	background: var(--c-beige);
}

.c-toc__label {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 22px;
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: 0.2em;
	color: var(--c-gold-dark);
}

.c-toc__label::after {
	content: "";
	flex: 1;
	height: 1px;
	background: rgba(168, 128, 63, 0.4);
}

.c-toc__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px 36px;
	counter-reset: toc;
}

.c-toc__list a {
	display: flex;
	align-items: baseline;
	gap: 12px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.7;
}

.c-toc__list a::before {
	counter-increment: toc;
	content: counter(toc, decimal-leading-zero);
	flex: none;
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: 0.06em;
	color: var(--c-gold-dark);
}

.c-toc__list a:hover { color: var(--c-gold-dark); text-decoration: underline; }

@media (max-width: 767px) {
	.c-toc { margin-top: 34px; padding: 24px 20px 26px; }
	.c-toc__list { grid-template-columns: 1fr; gap: 10px; }
	.c-toc__list a { font-size: 14px; }
}

/* ==========================================================================
   セクション
   ========================================================================== */

.c-sec {
	max-width: 1160px;
	margin-inline: auto;
	padding-top: 96px;
	/* 固定ヘッダーの下に見出しが隠れないよう、アンカー位置をずらす */
	scroll-margin-top: calc(var(--h-header) + 24px);
}

.c-sec__en {
	font-family: var(--f-en);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--c-gold-dark);
}

.c-sec > h2 {
	margin-top: 10px;
	padding-bottom: 20px;
	font-size: clamp(21px, 2.4vw, 32px);
	font-weight: 700;
	letter-spacing: 0.03em;
	line-height: 1.5;
	border-bottom: 1px solid var(--c-bdr);
	text-wrap: balance;
}

/* 見出し下の金の短い線 */
.c-sec > h2 {
	position: relative;
}

.c-sec > h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 56px;
	height: 2px;
	background: var(--c-gold-dark);
}

.c-sec__body { padding-top: 34px; }

.c-sec :where(p) {
	font-size: 16px;
	line-height: 2.05;
	letter-spacing: 0.02em;
}

.c-sec :where(p + p) { margin-top: 22px; }

.c-sec__fig {
	margin: 0 0 30px;
	line-height: 0;
}

/* 見開きの帯として見せたいので、縦は切って横長に固定する */
.c-sec__fig img {
	width: 100%;
	height: auto;
	aspect-ratio: 24 / 10;
	object-fit: cover;
}

@media (max-width: 767px) {
	.c-sec { padding-top: 56px; scroll-margin-top: calc(var(--h-header-sp) + 16px); }
	.c-sec > h2 { padding-bottom: 14px; }
	.c-sec > h2::after { width: 40px; }
	.c-sec__body { padding-top: 22px; }
	.c-sec :where(p) { font-size: 15px; line-height: 1.95; }
	.c-sec__fig { margin-bottom: 20px; }
	.c-sec__fig img { aspect-ratio: 16 / 10; }
}

/* 画像とテキストの2カラム */
.c-cols {
	display: grid;
	grid-template-columns: 1fr 480px;
	gap: 40px;
	align-items: start;
}

.c-cols--rev { grid-template-columns: 480px 1fr; }
.c-cols__fig { margin: 0; line-height: 0; }
.c-cols__fig img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }

@media (max-width: 900px) {
	.c-cols,
	.c-cols--rev { grid-template-columns: 1fr; gap: 22px; }
	.c-cols__fig { order: -1; }
}

/* ==========================================================================
   当院の特徴（番号付きの行）
   ========================================================================== */

.c-features { display: grid; }

.c-feature {
	display: grid;
	grid-template-columns: 96px 1fr;
	gap: 0 24px;
	padding-block: 34px;
	border-bottom: 1px solid var(--c-bdr-light);
}

.c-feature:first-child { border-top: 1px solid var(--c-bdr-light); }

.c-feature__no {
	font-family: var(--f-en);
	font-size: 46px;
	font-weight: 500;
	font-style: italic;
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--c-gold);
}

.c-feature__ttl {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.02em;
}

.c-feature__txt {
	grid-column: 2;
	margin-top: 14px;
}

/* 画像を持つ項目は右に写真を置く */
.c-feature--img .c-feature__txt {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 30px;
	align-items: start;
}

.c-feature--img figure { margin: 0; line-height: 0; }
.c-feature--img img { width: 100%; height: auto; }

@media (max-width: 900px) {
	.c-feature--img .c-feature__txt { grid-template-columns: 1fr; gap: 18px; }
	.c-feature--img figure { order: -1; }
}

@media (max-width: 767px) {
	.c-feature { grid-template-columns: 56px 1fr; gap: 0 14px; padding-block: 24px; }
	.c-feature__no { font-size: 32px; }
	.c-feature__ttl { font-size: 17px; }
	.c-feature__txt { grid-column: 1 / -1; margin-top: 12px; }
}

/* ==========================================================================
   小見出しブロック（治療の種類・素材など、番号を振らない項目）
   ========================================================================== */

.c-defs { display: grid; gap: 0; }

.c-def {
	padding-block: 30px;
	border-bottom: 1px solid var(--c-bdr-light);
}

.c-def:first-child { border-top: 1px solid var(--c-bdr-light); }

.c-def__ttl {
	position: relative;
	padding-left: 18px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.02em;
}

/* 見出しの頭に金の短い縦線 */
.c-def__ttl::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45em;
	width: 4px;
	height: 1em;
	background: var(--c-gold-dark);
}

.c-def__txt { margin-top: 12px; }

/* 写真を持つ項目は右に写真を置く */
.c-def--img .c-def__txt {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 30px;
	align-items: start;
}

.c-def--img figure { margin: 0; line-height: 0; }
.c-def--img img { width: 100%; height: auto; }

@media (max-width: 900px) {
	.c-def--img .c-def__txt { grid-template-columns: 1fr; gap: 18px; }
	.c-def--img figure { order: -1; }
}

@media (max-width: 767px) {
	.c-def { padding-block: 22px; }
	.c-def__ttl { padding-left: 14px; font-size: 17px; }
	.c-def__ttl::before { width: 3px; }
}

/* ==========================================================================
   本文中のテキストリンク
   ========================================================================== */

/* 文章の途中に置くリンク。下線＋金色で、読みの流れを止めない見せ方にする。 */
.c-sec .c-textlink,
.c-textlink {
	font-weight: 700;
	color: var(--c-gold-dark);
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}

.c-textlink:hover { color: var(--c-ink); }

/* ==========================================================================
   メリット / デメリット
   ========================================================================== */

.c-pros {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}

.c-pros__box {
	padding: 30px 32px 34px;
	background: var(--c-beige-light);
	border-top: 3px solid var(--c-gold-dark);
}

.c-pros__box--con {
	background: var(--c-base);
	border-top-color: var(--c-txt-sub);
}

.c-pros__ttl {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
	font-family: var(--f-en);
	font-size: 15px;
	letter-spacing: 0.16em;
	color: var(--c-gold-dark);
}

.c-pros__box--con .c-pros__ttl { color: var(--c-txt-sub); }

.c-pros__ttl span {
	font-family: var(--f-ja);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--c-ink);
}

.c-pros__list { display: grid; gap: 12px; }

.c-pros__list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 15px;
	line-height: 1.8;
}

.c-pros__list li::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	margin-top: 6px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark);
	mask: var(--icon-check-mark) center / 11px auto no-repeat;
	-webkit-mask: var(--icon-check-mark) center / 11px auto no-repeat;
}

.c-pros__box--con .c-pros__list li::before {
	background: var(--c-txt-sub);
	mask-image: var(--icon-minus);
	-webkit-mask-image: var(--icon-minus);
}

@media (max-width: 767px) {
	.c-pros { grid-template-columns: 1fr; gap: 14px; }
	.c-pros__box { padding: 22px 20px 24px; }
	.c-pros__list li { font-size: 14px; }
}

/* ==========================================================================
   治療の流れ（ステップ）
   ========================================================================== */

.c-steps {
	display: grid;
	gap: 0;
	counter-reset: step;
}

.c-step {
	position: relative;
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: 0 24px;
	padding-bottom: 34px;
}

/* 縦の線でステップをつなぐ */
.c-step::before {
	content: "";
	position: absolute;
	left: 23px;
	top: 48px;
	bottom: 0;
	width: 1px;
	background: var(--c-gold-light);
}

.c-step:last-child { padding-bottom: 0; }
.c-step:last-child::before { display: none; }

.c-step__no {
	grid-row: 1 / 3;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark);
	color: var(--c-wh);
	font-family: var(--f-en);
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.c-step__ttl {
	align-self: center;
	min-height: 48px;
	display: flex;
	align-items: center;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.5;
}

.c-step__txt { grid-column: 2; margin-top: 10px; }

@media (max-width: 767px) {
	.c-step { grid-template-columns: 44px 1fr; gap: 0 14px; padding-bottom: 24px; }
	.c-step::before { left: 17px; top: 40px; }
	.c-step__no { width: 36px; height: 36px; font-size: 14px; }
	.c-step__ttl { min-height: 36px; font-size: 16px; }
}

/* ==========================================================================
   費用・期間の表
   ========================================================================== */

.c-spec {
	display: grid;
	grid-template-columns: 220px 1fr;
	border-top: 1px solid var(--c-bdr);
}

.c-spec dt,
.c-spec dd {
	margin: 0;
	padding: 20px 24px;
	border-bottom: 1px solid var(--c-bdr);
	font-size: 15px;
	line-height: 1.8;
}

.c-spec dt {
	display: flex;
	align-items: center;
	font-weight: 700;
	background: var(--c-beige);
}

.c-sec .c-spec__note,
.c-spec__note {
	margin-top: 16px;
	font-size: 13px;
	line-height: 1.9;
	color: var(--c-txt-sub);
}

@media (max-width: 767px) {
	.c-spec { grid-template-columns: 1fr; }
	.c-spec dt { padding: 12px 16px; font-size: 14px; }
	.c-spec dd { padding: 16px; font-size: 14px; border-bottom-width: 1px; }
}

/* ==========================================================================
   本文中の「詳しくはこちら」リンク
   ========================================================================== */

.c-inlink {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 4px;
	padding-bottom: 3px;
	border-bottom: 1px solid var(--c-gold-dark);
	font-size: 15px;
	font-weight: 700;
	color: var(--c-gold-dark);
}

.c-inlink::after {
	content: "";
	width: 18px;
	height: 18px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark) var(--icon-arrow-w) center / 11px auto no-repeat;
}

.c-inlink:hover { color: var(--c-ink); border-bottom-color: var(--c-ink); }

.c-sec .c-note,
.c-note {
	margin-top: 26px;
	padding: 20px 24px;
	background: var(--c-base);
	border-left: 3px solid var(--c-gold);
	font-size: 14px;
	line-height: 1.95;
}

@media (max-width: 767px) {
	.c-sec .c-note,
	.c-note { padding: 16px 18px; font-size: 13px; }
}

/* ==========================================================================
   FAQ（下層版・開閉あり）
   ========================================================================== */

.c-faq { display: grid; gap: 14px; }

.c-faq__item { background: var(--c-beige); }

.c-faq__q {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	width: 100%;
	padding: 20px 56px 20px 24px;
	position: relative;
	text-align: left;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.6;
}

.c-faq__q::before {
	content: "Q";
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	background: var(--c-gold-dark);
	color: var(--c-wh);
	font-family: var(--f-en);
	font-size: 15px;
	font-weight: 400;
}

/* 開閉の＋／− */
.c-faq__q::after {
	content: "";
	position: absolute;
	right: 24px;
	top: 50%;
	width: 14px;
	height: 14px;
	translate: 0 -50%;
	background:
		linear-gradient(var(--c-gold-dark), var(--c-gold-dark)) center / 14px 1px no-repeat,
		linear-gradient(var(--c-gold-dark), var(--c-gold-dark)) center / 1px 14px no-repeat;
	transition: rotate var(--dur) var(--ease);
}

.c-faq__q[aria-expanded="true"]::after {
	background: linear-gradient(var(--c-gold-dark), var(--c-gold-dark)) center / 14px 1px no-repeat;
}

/* display 指定が [hidden] の既定を上書きしてしまうので明示的に消す */
.c-faq__a[hidden] { display: none; }

.c-faq__a {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin: 0 12px 12px;
	padding: 18px 22px;
	background: var(--c-wh);
	font-size: 15px;
	line-height: 1.95;
}

.c-faq__a::before {
	content: "A";
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border: 1px solid var(--c-gold-dark);
	color: var(--c-gold-dark);
	font-family: var(--f-en);
	font-size: 15px;
}

@media (max-width: 767px) {
	.c-faq { gap: 12px; }
	.c-faq__q { padding: 16px 44px 16px 16px; gap: 12px; font-size: 15px; }
	.c-faq__q::before { width: 28px; height: 28px; font-size: 14px; }
	.c-faq__q::after { right: 16px; }
	.c-faq__a {
		gap: 12px;
		margin: 0 16px 18px;
		padding: 14px 0 0;
		background: transparent;
		border-top: 1px solid rgba(57, 53, 59, 0.18);
		font-size: 14px;
	}
	.c-faq__a::before { width: 28px; height: 28px; background: var(--c-wh); font-size: 14px; }
}

/* ==========================================================================
   関連ページ
   ========================================================================== */

.p-related {
	margin-top: 110px;
	padding-block: 76px 84px;
	background: var(--c-base);
}

.p-related__ttl {
	margin-top: 10px;
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 700;
	letter-spacing: 0.03em;
	line-height: 1.5;
}

.p-related__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin-top: 34px;
}

.p-related__item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
	min-height: 130px;
	padding: 22px 24px;
	background: var(--c-wh);
	border-bottom: 2px solid var(--c-gold);
	transition: translate var(--dur) var(--ease);
}

.p-related__item:hover { translate: 0 -3px; color: var(--c-ink); }

/* リンク内のテキストは縦積みにする */
.p-related__item > span { display: block; }

.p-related__en {
	display: block;
	font-family: var(--f-en);
	font-size: 11px;
	letter-spacing: 0.16em;
	color: var(--c-gold-dark);
}

.p-related__ja {
	display: block;
	margin-top: 6px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.5;
}

.p-related__arrow {
	align-self: flex-end;
	width: 26px;
	height: 26px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark) var(--icon-arrow-w) center / 13px auto no-repeat;
}

@media (max-width: 900px) {
	.p-related__list { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
	.p-related { margin-top: 56px; padding-block: 44px 48px; }
	.p-related__ttl { margin-top: 6px; }
	.p-related__list { gap: 12px; margin-top: 22px; }
	.p-related__item { min-height: 104px; padding: 16px 18px; gap: 12px; }
	.p-related__ja { font-size: 15px; }
}

/* ==========================================================================
   ページ上部へ戻る
   ========================================================================== */

.c-totop {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: var(--z-float);
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	background: var(--c-ink);
	color: var(--c-wh);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--dur) var(--ease), visibility var(--dur) var(--ease);
}

.c-totop.is-in { opacity: 1; visibility: visible; }
.c-totop:hover { background: var(--c-gold-dark); color: var(--c-wh); }

.c-totop::before {
	content: "";
	width: 12px;
	height: 12px;
	border-top: 1px solid currentColor;
	border-right: 1px solid currentColor;
	rotate: -45deg;
	translate: 0 2px;
}

@media (max-width: 767px) {
	.c-totop {
		right: 12px;
		bottom: calc(56px + 12px); /* 追従CTAの上 */
		width: 42px;
		height: 42px;
	}
}

/* ==========================================================================
   表（料金・診療時間・施設基準など）
   ========================================================================== */

/* 横に長い表はこの箱の中だけで横スクロールさせ、ページ自体は動かさない */
.c-table {
	margin-top: 4px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.c-table table {
	width: 100%;
	min-width: 480px;
	border-collapse: collapse;
}

.c-table th,
.c-table td {
	padding: 18px 22px;
	border-bottom: 1px solid var(--c-bdr);
	font-size: 15px;
	line-height: 1.8;
	text-align: left;
	vertical-align: top;
}

.c-table thead th {
	background: var(--c-ink);
	color: var(--c-wh);
	font-weight: 500;
	letter-spacing: 0.04em;
	border-bottom: 0;
}

.c-table tbody th {
	width: 30%;
	background: var(--c-beige);
	font-weight: 700;
}

/* 金額の列は右寄せで数字をそろえる */
.c-table td.is-price {
	white-space: nowrap;
	font-weight: 700;
	color: var(--c-gold-dark);
}

.c-table + .c-table { margin-top: 24px; }

@media (max-width: 767px) {
	.c-table table { min-width: 420px; }
	.c-table th,
	.c-table td { padding: 13px 14px; font-size: 14px; }
	.c-table tbody th { width: 34%; }
}

/* ==========================================================================
   診療案内の一覧カード
   ========================================================================== */

.c-menugrid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.c-menucard {
	display: grid;
	grid-template-columns: 52px 1fr 26px;
	align-items: start;
	gap: 0 18px;
	padding: 24px 24px 26px;
	background: var(--c-wh);
	border: 1px solid var(--c-bdr-light);
	border-bottom: 2px solid var(--c-gold);
	transition: translate var(--dur) var(--ease);
}

.c-menucard:hover { translate: 0 -3px; color: var(--c-ink); }

/* アイコンは単色マスクなので、色は CSS 側で決める */
.c-menucard__icon {
	width: 52px;
	height: 52px;
	background: var(--c-gold-dark);
	mask: var(--menu-icon) center / contain no-repeat;
	-webkit-mask: var(--menu-icon) center / contain no-repeat;
}

.c-menucard__en {
	display: block;
	font-family: var(--f-en);
	font-size: 11px;
	letter-spacing: 0.16em;
	color: var(--c-gold-dark);
}

.c-menucard__ja {
	display: block;
	margin-top: 4px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
}

.c-menucard__txt {
	grid-column: 2;
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.85;
	color: var(--c-txt-sub);
}

.c-menucard__arrow {
	align-self: center;
	width: 26px;
	height: 26px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark) var(--icon-arrow-w) center / 13px auto no-repeat;
}

@media (max-width: 767px) {
	.c-menugrid { grid-template-columns: 1fr; gap: 12px; }
	.c-menucard {
		grid-template-columns: 40px 1fr 22px;
		gap: 0 14px;
		padding: 18px 18px 20px;
	}
	.c-menucard__icon { width: 40px; height: 40px; }
	.c-menucard__ja { font-size: 16px; }
	.c-menucard__txt { font-size: 13px; margin-top: 8px; }
	.c-menucard__arrow { width: 22px; height: 22px; }
}

/* ==========================================================================
   症状から探す
   ========================================================================== */

.c-symptoms { display: grid; gap: 0; }

.c-symptom {
	padding-block: 26px;
	border-bottom: 1px solid var(--c-bdr-light);
}

.c-symptom:first-child { border-top: 1px solid var(--c-bdr-light); }

.c-symptom__ttl {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
}

/* 症状名の頭に「？」の代わりのしるし */
.c-symptom__ttl::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	margin-top: 0.55em;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark);
}

.c-symptom__txt {
	margin-top: 10px;
	padding-left: 20px;
	font-size: 15px;
	line-height: 1.95;
}

.c-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 14px;
	padding-left: 20px;
}

.c-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: var(--c-beige);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
}

.c-chip::after {
	content: "";
	width: 16px;
	height: 16px;
	border-radius: var(--radius-pill);
	background: var(--c-gold-dark) var(--icon-arrow-w) center / 9px auto no-repeat;
}

.c-chip:hover { background: var(--c-gold-dark); color: var(--c-wh); }
.c-chip:hover::after { background-color: var(--c-wh); }

@media (max-width: 767px) {
	.c-symptom { padding-block: 20px; }
	.c-symptom__ttl { font-size: 16px; gap: 10px; }
	.c-symptom__txt { font-size: 14px; padding-left: 18px; }
	.c-chips { padding-left: 18px; gap: 8px; }
	.c-chip { padding: 7px 13px; font-size: 12px; }
}

/* ==========================================================================
   スタッフのプロフィール
   ========================================================================== */

.c-profile {
	display: grid;
	grid-template-columns: 380px 1fr;
	gap: 44px;
	align-items: start;
}

.c-profile__fig { margin: 0; line-height: 0; }

.c-profile__fig img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

.c-profile__role {
	font-family: var(--f-en);
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-gold-dark);
}

.c-profile__name {
	margin-top: 8px;
	font-size: 28px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.c-profile__charge {
	display: inline-block;
	margin-top: 14px;
	padding: 6px 14px;
	background: var(--c-beige);
	font-size: 13px;
	font-weight: 700;
}

.c-profile__body { margin-top: 18px; }

.c-profile__sub {
	margin-top: 26px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--c-bdr);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.c-profile__sub + p,
.c-profile__sub + .c-table { margin-top: 14px; }

/* 院長以外は写真を小さめの3カラムで並べる */
.c-staff {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px 24px;
	margin-top: 34px;
}

.c-staff__item { display: grid; }

.c-staff__fig { margin: 0 0 16px; line-height: 0; background: var(--c-base); }

.c-staff__fig img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

.c-staff__name {
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.c-staff__charge {
	margin-top: 8px;
	font-size: 13px;
	font-weight: 700;
	color: var(--c-gold-dark);
}

.c-staff__txt { margin-top: 10px; font-size: 14px; line-height: 1.9; }

@media (max-width: 900px) {
	.c-profile { grid-template-columns: 1fr; gap: 22px; }
	.c-profile__fig { max-width: 320px; }
	.c-staff { grid-template-columns: repeat(2, 1fr); gap: 26px 18px; }
}

@media (max-width: 767px) {
	.c-profile__name { font-size: 23px; }
	.c-staff { grid-template-columns: 1fr; gap: 24px; }
	.c-staff__fig { max-width: 260px; }
	.c-staff__name { font-size: 17px; }
}

/* ==========================================================================
   予約フォーム
   ラベルと入力欄を左右に置き、SPでは縦積みにする。
   ========================================================================== */

.c-form { margin-top: 8px; }

.c-form__alert {
	margin-bottom: 28px;
	padding: 16px 20px;
	background: #fdf3f3;
	border-left: 3px solid #c0504d;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.8;
	color: #a33f3c;
}

.c-form__row {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 0 32px;
	padding-block: 24px;
	border-bottom: 1px solid var(--c-bdr);
	align-items: start;
}

.c-form__row:first-of-type { border-top: 1px solid var(--c-bdr); }

.c-form__label {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	padding-top: 12px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
}

.c-form__req {
	flex: none;
	padding: 3px 9px;
	background: var(--c-gold-dark);
	color: var(--c-wh);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.c-form__note {
	margin-bottom: 10px;
	font-size: 13px;
	line-height: 1.8;
	color: var(--c-txt-sub);
}

/* 入力欄。フォーカスは金の枠で分かるようにする */
.c-form input[type="text"],
.c-form input[type="tel"],
.c-form input[type="email"],
.c-form input[type="date"],
.c-form input[type="time"],
.c-form textarea {
	width: 100%;
	padding: 13px 16px;
	background: var(--c-wh);
	border: 1px solid var(--c-bdr);
	border-radius: 0;
	font-family: inherit;
	font-size: 16px; /* iOSで拡大されないように16px以上 */
	line-height: 1.6;
	color: var(--c-txt);
	transition: border-color 0.25s var(--e-soft, ease), box-shadow 0.25s var(--e-soft, ease);
	-webkit-appearance: none;
	appearance: none;
}

.c-form input[type="date"],
.c-form input[type="time"] { max-width: 260px; }

.c-form textarea { resize: vertical; min-height: 130px; }

.c-form input:focus-visible,
.c-form textarea:focus-visible {
	outline: none;
	border-color: var(--c-gold-dark);
	box-shadow: 0 0 0 3px rgba(168, 128, 63, 0.16);
}

.c-form ::placeholder { color: rgba(57, 53, 59, 0.38); }

/* ラジオ・チェックボックス */
.c-form__choices {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 12px;
}

.c-form__choice {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 11px 18px;
	background: var(--c-wh);
	border: 1px solid var(--c-bdr);
	font-size: 15px;
	line-height: 1.5;
	cursor: pointer;
	transition: border-color 0.25s var(--e-soft, ease), background 0.25s var(--e-soft, ease);
}

.c-form__choice:hover { border-color: var(--c-gold); }

.c-form__choice input {
	width: 18px;
	height: 18px;
	margin: 0;
	flex: none;
	accent-color: var(--c-gold-dark);
}

.c-form__choice:has(input:checked) {
	border-color: var(--c-gold-dark);
	background: var(--c-beige-light);
}

.c-form__choice:has(input:focus-visible) {
	box-shadow: 0 0 0 3px rgba(168, 128, 63, 0.16);
}

/* エラー */
.c-form__row.is-error input,
.c-form__row.is-error textarea { border-color: #c0504d; }

.c-form__error {
	margin-top: 8px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.7;
	color: #a33f3c;
}

/* ロボット対策の入力欄は見せない */
.c-form__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* 送信 */
.c-form__submit {
	margin-top: 36px;
	text-align: center;
}

.c-form__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 320px;
	padding: 20px 40px;
	background: var(--c-gold-dark);
	color: var(--c-wh);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	cursor: pointer;
	transition: background 0.3s var(--e-soft, ease), transform 0.3s var(--e-soft, ease),
		box-shadow 0.3s var(--e-soft, ease);
}

.c-form__btn::after {
	content: "";
	width: 20px;
	height: 20px;
	border-radius: var(--radius-pill);
	background: var(--c-wh) var(--icon-arrow) center / 11px auto no-repeat;
}

.c-form__btn:hover {
	background: var(--c-ink);
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(57, 53, 59, 0.2);
}

.c-form__submit .c-form__note { margin: 18px 0 0; }

/* 送信完了 */
.c-form__done {
	margin-top: 8px;
	padding: 56px 40px 60px;
	background: var(--c-beige-light);
	text-align: center;
}

.c-form__done-en {
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: 0.22em;
	color: var(--c-gold-dark);
}

.c-form__done-ttl {
	margin: 12px 0 20px;
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 700;
	letter-spacing: 0.03em;
}

.c-sec .c-form__done p { font-size: 16px; line-height: 2; }

.c-sec .c-form__done-note {
	margin-top: 22px;
	font-size: 14px;
	color: var(--c-txt-sub);
}

@media (max-width: 767px) {
	.c-form__row {
		grid-template-columns: 1fr;
		gap: 12px;
		padding-block: 20px;
	}
	.c-form__label { padding-top: 0; font-size: 14px; }
	.c-form__choice { padding: 10px 14px; font-size: 14px; }
	.c-form__btn { min-width: 0; width: 100%; padding: 18px 24px; font-size: 15px; }
	.c-form__done { padding: 38px 20px 42px; }
	.c-sec .c-form__done p { font-size: 15px; }
}
