/* ==========================================================================
   事業領域（Figma: 05_Business 1440x8187 / node 2030:2144）
   数値はすべて Figma 実寸。y 座標のコメントは Figma のフレーム基準。
   ========================================================================== */

/* --------------------------------------------------------------------------
   共通パーツ
   philosophy.css と同じ定義だが、あちらは philosophy ページでしか
   読み込まれないのでここにも持たせる。
   -------------------------------------------------------------------------- */
.kro-t-red {
	color: var(--kro-red);
}

/* リード本文（20px Bold 200%）。段落間は1行ぶん（40px）。 */
.kro-psec__lead-body p {
	margin: 0;
	font-family: var(--kro-font-ja);
	font-size: 20px;
	font-weight: 700;
	line-height: 2;
	color: #000;
}

.kro-psec__lead-body p + p {
	margin-top: 40px;
}

/* 見出し（24px Bold 160%）。運営施設 / 3事業ラインの各タイトル / 提供内容。 */
.kro-business-page .kro-biz-h3 {
	margin: 0;
	font-family: var(--kro-font-ja);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.6;
	color: #000;
}

/* 見出し下の赤い罫線。Figma: 幅80 / 太さ1px / #E60012 */
.kro-biz-rule {
	display: block;
	/* 見出し下端（24px x 1.6 = 38.4）→ 罫線 17.6px */
	margin-top: 17.6px;
	width: 80px;
	height: 1px;
	background-color: var(--kro-red);
}

/* 本文（16px Regular 180%）。Figma の段落は詰めて置かれているので既定は 0。 */
.kro-biz-note p {
	margin: 0;
	font-family: var(--kro-font-ja);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.8;
	color: #000;
}

/* Figma で空行が1行入っているブロックだけ 1行ぶん（28.8px）空ける。 */
.kro-biz-note--gap p + p {
	margin-top: 28.8px;
}

/* 本文中の強調（赤 Bold）。 */
.kro-biz-em {
	font-weight: 700;
	color: var(--kro-red);
}

/* 中黒つきの箇条書き（提供内容）。 */
.kro-biz-list li {
	font-family: var(--kro-font-ja);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.8;
	color: #000;
}

.kro-biz-list li::before {
	content: "・";
}

.kro-business-page figure {
	margin: 0;
}

.kro-business-page figure img {
	display: block;
	width: 100%;
	height: auto;
}

/* --------------------------------------------------------------------------
   ページ内アンカーボタン
   Figma: 274x64 を4つ（x128 / 431 / 734 / 1039）、白地＋navy 1px。
   -------------------------------------------------------------------------- */
.kro-biz-anchors {
	/* パンくず下端 y437.4 → ボタン上端 y588 */
	padding-top: 150.6px;
}

.kro-biz-anchors ul {
	display: grid;
	grid-template-columns: repeat(4, 274px);
	justify-content: space-between;
}

.kro-biz-anchors a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 64px;
	padding-inline: 8px;
	background-color: #fff;
	border: 1px solid var(--kro-navy);
	font-family: var(--kro-font-en), var(--kro-font-ja);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
	color: var(--kro-navy);
	text-align: center;
	transition: background-color .2s ease, color .2s ease;
}

.kro-biz-anchors a:hover {
	background-color: var(--kro-navy);
	color: #fff;
}

/* ヘッダーが sticky で画面上部に残るため、着地点をヘッダー高さぶん下げないと
   見出しがヘッダーの裏に隠れる（AUN 指示 8「ヘッダー分でずれないように」）。
   2026-09-25：以前は Lightning が html に入れていた scroll-padding-top:60px を
   見込んで負の値にしていたが、その指定が無くなり着地が 60px 下へずれていた。
   テーマ側の指定に頼らず、ここだけで決める。
   PC はバッジがセクション上端から 120px 下（事業03だけ 152px）、SP は 64px 下。
   ヘッダー100 + 余白24 - 120 = 4px（事業03は -28px）、SP は 64 + 24 - 64 = 24px。
   管理バーが出ているときはその高さぶん足す。 */
.kro-psec--biz {
	scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + 4px);
}

/* 事業03だけセクションの上余白が 32px 広い。SPでは余白が揃うのでPC幅だけに効かせる。 */
@media (min-width: 768px) {
	.kro-psec--biz3 {
		scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) - 28px);
	}
}

/* --------------------------------------------------------------------------
   Our Business
   -------------------------------------------------------------------------- */
.kro-psec--ob {
	/* ボタン下端 y652 → 欧文ラベル y752 */
	padding-top: 100px;
}

.kro-biz-ob {
	display: grid;
	/* Figma: 本文575 + 写真577（写真は x736 = コンテナ右端揃え） */
	grid-template-columns: 575px 577px;
	justify-content: space-between;
	align-items: start;
	/* 和文見出し下端 y904 → 本文・写真 y953 */
	margin-top: 49px;
}

/* --------------------------------------------------------------------------
   事業ブロック共通（バッジ → 見出し → 定義表 → 本文）
   -------------------------------------------------------------------------- */

/* 青ベタの「事業 01」＋ 欧文ラベル。Figma: 箱 100x41 #78AEFF、y1469。 */
.kro-biz-badge {
	display: flex;
	align-items: center;
	/* 欧文ラベル（40px x 1.6）の高さがブロックの高さになる */
	height: 64px;
}

.kro-biz-badge__box {
	position: relative;
	flex: none;
	/* Figma のバッジはコンテナ左端から 3px 内側 */
	margin-left: 3px;
	width: 100px;
	height: 41px;
	background-color: #78aeff;
}

.kro-biz-badge__ja {
	position: absolute;
	top: 10px;
	left: 10px;
	font-family: var(--kro-font-ja);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	color: #fff;
}

.kro-biz-badge__no {
	position: absolute;
	/* 箱（y1469）より 11px 上から始まる 40px の欧文ボックス */
	top: -11px;
	left: 46px;
	font-family: var(--kro-font-en);
	font-size: 40px;
	font-weight: 500;
	line-height: 1.6;
	color: #fff;
}

.kro-biz-badge__en {
	/* 箱の右端 x231 → 欧文ラベル x244 */
	margin-left: 13px;
	font-family: var(--kro-font-en);
	font-size: 40px;
	font-weight: 500;
	line-height: 1.6;
	color: var(--kro-navy);
}

.kro-biz-badge + .kro-sechead {
	/* バッジ下端 → 欧文ラベル 21px */
	margin-top: 21px;
}

/* 定義表。Figma: 罫線 #DEDEDE 1px、行の内寸 60px、ラベル列 304px。 */
.kro-biz-table {
	/* 和文見出し下端 → 表の1本目の罫線 59px */
	margin-top: 59px;
	border-top: 1px solid #dedede;
}

.kro-biz-table__row {
	display: grid;
	grid-template-columns: 304px 1fr;
	border-bottom: 1px solid #dedede;
}

.kro-biz-table__th {
	/* 親テーマの dt に付く下マージンを打ち消し、行の内寸を 60px に保つ */
	margin: 0;
	/* Figma: rgba(152,190,255,0.2) を白地に重ねた色 */
	background-color: rgba(152, 190, 255, .2);
	/* ラベルはセル左端から 63px */
	padding-left: 63px;
	font-family: var(--kro-font-ja);
	font-size: 16px;
	font-weight: 800;
	line-height: 60px;
	color: #000;
}

.kro-biz-table__td {
	margin: 0;
	/* ラベル列の右端 x432 → 値 x457 */
	padding-left: 25px;
	font-family: var(--kro-font-ja);
	font-size: 16px;
	font-weight: 400;
	line-height: 60px;
	color: #000;
}

/* 運営法人名は navy ＋ 外部リンクアイコン。 */
/* --------------------------------------------------------------------------
   事業01 整形外科クリニック事業
   -------------------------------------------------------------------------- */
.kro-psec--biz1 {
	/* Our Business の写真下端 y1338 → バッジ y1458 */
	padding-top: 120px;
}

.kro-biz-cols {
	display: grid;
	/* Figma: 左 574（写真272 x2 + 30）+ 35 + 右 575 */
	grid-template-columns: 1fr 575px;
	column-gap: 35px;
	align-items: start;
	/* 表の下端 y1874 → 「運営施設」 y1927 */
	margin-top: 53px;
}

.kro-biz-cols__right {
	/* 右の本文だけ 6px 下がる（Figma: y1933） */
	padding-top: 6px;
}

.kro-biz-facilities {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 30px;
	/* 赤い罫線 y1984 → 写真 y2013 */
	margin-top: 29px;
}

.kro-biz-facility img {
	/* 2枚目の元画像だけ 1px 高い（Figma 側の誤差）ので比率で揃える。 */
	aspect-ratio: 272 / 181;
	object-fit: cover;
}

.kro-biz-facility__caption {
	/* 写真下端 y2194 → キャプション y2208 */
	margin-top: 14px;
	font-family: var(--kro-font-ja);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.8;
	color: #000;
}

/* --------------------------------------------------------------------------
   事業02 予防事業
   -------------------------------------------------------------------------- */
.kro-psec--biz2 {
	/* キャプション下端 y2294.4 → バッジ y2415 */
	padding-top: 120.6px;
}

.kro-biz-note--full {
	/* 表の下端 → 本文 59px */
	margin-top: 59px;
}

.kro-biz-lines__head {
	margin: 0;
	/* 本文の実描画下端 y2976.4 → 見出し y3081 */
	margin-top: 104.6px;
	font-family: var(--kro-font-ja);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.6;
	color: #000;
	text-align: center;
}

.kro-biz-lines {
	/* 見出し下端 y3132.2 → 1本目 y3157 */
	margin-top: 24.8px;
}

.kro-biz-line {
	display: grid;
	/* Figma: 写真577 + 30 + 本文577 */
	grid-template-columns: 577px 1fr;
	column-gap: 30px;
	align-items: start;
}

.kro-biz-line + .kro-biz-line {
	/* 写真下端 → 次の写真 80px */
	margin-top: 80px;
}

.kro-biz-line__body .kro-biz-note,
.kro-biz-line__body .kro-biz-list {
	/* 赤い罫線 y3214 → 本文 y3252 */
	margin-top: 38px;
}

/* --------------------------------------------------------------------------
   事業03 デイケア事業
   -------------------------------------------------------------------------- */
.kro-psec--biz3 {
	/* 3本目の写真下端 y4469 → バッジ y4621 */
	padding-top: 152px;
}

.kro-biz-line--service {
	/* 本文下端 y5153.6 → 写真 y5234 */
	margin-top: 80.4px;
}

.kro-biz-closing {
	/* 写真下端 y5618 → 結び y5698 */
	margin-top: 80px;
	font-family: var(--kro-font-ja);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.6;
	color: #000;
	text-align: center;
}

/* --------------------------------------------------------------------------
   事業04 クリニック開業支援・事業承継事業
   -------------------------------------------------------------------------- */
.kro-psec--biz4 {
	/* 事業03の結び下端 y5813.2 → バッジ y5932 */
	padding-top: 118.8px;
	/* 結び下端 y7076 → フッター上端 y7276 */
	padding-bottom: 200px;
}

/* 事業04だけ表と本文の間が狭い（Figma 実寸）。 */
.kro-psec--biz4 .kro-biz-note--full {
	margin-top: 34px;
}

.kro-psec--biz4 .kro-biz-line--service {
	/* 本文下端 y6407.4 → 写真 y6468 */
	margin-top: 60.6px;
}

.kro-biz-closing--wide {
	/* 写真下端 y6853 → 結び y6932。行送りは 200%（48px x 3 = 144） */
	margin-top: 79px;
	line-height: 2;
}

/* 事業02 の下に添える別枠（整骨院・接骨院の事業承継）。
   装飾を増やさないよう、細い罫線の囲みだけにする（2026-09-25）。 */
.kro-biz-aside {
	max-width: 760px;
	margin: 64px auto 0;
	padding: 28px 32px;
	border: 1px solid #dbe3ea;
}

.kro-biz-aside__title {
	margin: 0;
	font-family: var(--kro-font-ja);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
	color: var(--kro-navy);
}

.kro-biz-aside__body {
	margin: 12px 0 0;
	font-family: var(--kro-font-ja);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.9;
	color: #000;
}

.kro-biz-aside__link {
	margin: 14px 0 0;
	font-family: var(--kro-font-ja);
	font-size: 15px;
	font-weight: 700;
}

.kro-biz-aside__link a {
	color: var(--kro-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.kro-biz-aside__link a:hover {
	text-decoration: none;
}

@media (max-width: 767px) {
	.kro-biz-aside {
		margin-top: 40px;
		padding: 20px;
	}

	.kro-biz-aside__title {
		font-size: 16px;
	}

	.kro-biz-aside__body,
	.kro-biz-aside__link {
		font-size: 14px;
	}
}

/* 事業04 のキャッチコピー・2つ目の提供内容・注記（2026-09-24 別紙②）。 */
.kro-biz-note p.kro-biz-catch {
	font-family: var(--kro-font-ja);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.6;
	color: var(--kro-navy);
}

.kro-business-page .kro-biz-h3--second {
	/* 1つ目のリスト下端 → 2つ目の見出し */
	margin-top: 48px;
}

.kro-biz-fineprint {
	margin-top: 24px;
	font-family: var(--kro-font-ja);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.9;
	color: #5c6b7a;
}

@media (max-width: 767px) {
	.kro-biz-note p.kro-biz-catch {
		font-size: 20px;
	}

	.kro-business-page .kro-biz-h3--second {
		margin-top: 36px;
	}
}

/* ==========================================================================
   タブレット（可変幅）
   Figma に下層ページの可変デザインは無いので、PC の比率を保ったまま畳む。
   ========================================================================== */
@media (max-width: 1215px) {
	.kro-biz-anchors {
		padding-top: 80px;
	}

	.kro-biz-anchors ul {
		grid-template-columns: repeat(4, 1fr);
		gap: 16px;
	}

	.kro-biz-anchors a {
		height: 56px;
		font-size: 15px;
	}

	.kro-psec--ob {
		padding-top: 72px;
	}

	/* 固定 575/577px のままだと器からはみ出すので等分に切り替える。 */
	.kro-biz-ob,
	.kro-biz-line {
		grid-template-columns: 1fr 1fr;
		column-gap: 28px;
	}

	.kro-biz-ob {
		margin-top: 36px;
	}

	.kro-biz-cols {
		grid-template-columns: 1fr 1fr;
		column-gap: 28px;
	}

	.kro-psec__lead-body p {
		font-size: 18px;
	}

	.kro-psec__lead-body p + p {
		margin-top: 36px;
	}

	.kro-biz-table {
		margin-top: 40px;
	}

	.kro-biz-table__row {
		grid-template-columns: 220px 1fr;
	}

	.kro-biz-table__th {
		padding-left: 24px;
	}

	.kro-biz-table__td {
		padding-left: 24px;
	}

	.kro-psec--biz1,
	.kro-psec--biz2,
	.kro-psec--biz3,
	.kro-psec--biz4 {
		padding-top: 88px;
	}

	.kro-psec--biz4 {
		padding-bottom: 120px;
	}

	.kro-biz-cols {
		margin-top: 40px;
	}

	.kro-biz-note--full,
	.kro-psec--biz4 .kro-biz-note--full {
		margin-top: 40px;
	}

	.kro-biz-lines__head {
		font-size: 28px;
		margin-top: 40px;
	}

	.kro-biz-lines {
		margin-top: 24px;
	}

	.kro-biz-line + .kro-biz-line,
	.kro-biz-line--service,
	.kro-psec--biz4 .kro-biz-line--service {
		margin-top: 56px;
	}

	.kro-biz-line__body .kro-biz-note,
	.kro-biz-line__body .kro-biz-list {
		margin-top: 24px;
	}

	.kro-biz-closing {
		margin-top: 56px;
		font-size: 20px;
	}
}

/* ==========================================================================
   タブレット縦〜小型ノート
   ========================================================================== */
@media (max-width: 900px) {
	.kro-biz-anchors {
		padding-top: 56px;
	}

	.kro-biz-anchors ul {
		grid-template-columns: repeat(2, 1fr);
	}

	/* 写真と本文を積み上げる。写真が先に来る Figma の並びを保つ。 */
	.kro-biz-ob,
	.kro-biz-cols,
	.kro-biz-line {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}

	.kro-biz-ob__photo {
		/* Figma では本文が左・写真が右。積んだときは写真を先に見せる。 */
		order: -1;
	}

	.kro-biz-badge {
		height: 52px;
	}

	.kro-biz-badge__no,
	.kro-biz-badge__en {
		font-size: 32px;
	}

	.kro-biz-badge__box {
		width: 88px;
		height: 36px;
	}

	.kro-biz-badge__ja {
		top: 8px;
		left: 8px;
		font-size: 13px;
	}

	.kro-biz-badge__no {
		/* SPと同じ理由で、箱の中央に来るよう2px下げる */
		top: -7px;
		left: 40px;
	}

	.kro-business-page .kro-biz-h3 {
		font-size: 20px;
	}

	.kro-biz-lines__head {
		font-size: 24px;
	}

	.kro-biz-closing {
		font-size: 18px;
	}

	/* 3行の <br> を残したままだと1行が長すぎて溢れるので折り返しに任せる。 */
	.kro-biz-closing br {
		display: none;
	}
}

/* ==========================================================================
   SP（Figma に下層のSPデザインは無いため、TOP のSPルールに合わせる）
   ========================================================================== */
@media (max-width: 767px) {
	/* SP はヘッダーが 64px に縮むので着地点の余白も揃える。 */
	.kro-psec--biz {
		scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + 24px);
	}

	.kro-biz-anchors {
		padding-top: 40px;
	}

	.kro-biz-anchors ul {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.kro-biz-anchors a {
		height: 52px;
		font-size: 14px;
	}

	.kro-psec--ob {
		padding-top: 48px;
	}

	.kro-psec--biz1,
	.kro-psec--biz2,
	.kro-psec--biz3,
	.kro-psec--biz4 {
		padding-top: 64px;
	}

	.kro-psec--biz4 {
		padding-bottom: 80px;
	}

	.kro-psec__lead-body p {
		font-size: 16px;
	}

	/* 20px 前提で入れた <br> は SP では不自然な位置で折れるので無効化する。 */
	.kro-psec__lead-body br {
		display: none;
	}

	.kro-biz-badge {
		height: 44px;
	}

	.kro-biz-badge__box {
		width: 78px;
		height: 32px;
	}

	.kro-biz-badge__ja {
		top: 6px;
		left: 7px;
		font-size: 12px;
	}

	.kro-biz-badge__no {
		/* 26px×1.6 の行ボックスを 32px の箱の中央へ（-8px だと上に寄る） */
		top: -5px;
		left: 35px;
		font-size: 26px;
	}

	.kro-biz-badge__en {
		margin-left: 10px;
		font-size: 26px;
	}

	.kro-biz-badge + .kro-sechead {
		margin-top: 14px;
	}

	/* ラベル列を固定幅で持つと値が数文字ずつしか入らないので上下に積む。 */
	.kro-biz-table__row {
		grid-template-columns: 1fr;
	}

	.kro-biz-table__th {
		padding-left: 16px;
		font-size: 14px;
		line-height: 40px;
	}

	.kro-biz-table__td {
		padding: 10px 16px;
		font-size: 14px;
		line-height: 1.8;
	}

	.kro-biz-note p,
	.kro-biz-list li,
	.kro-biz-facility__caption {
		font-size: 14px;
	}

	.kro-biz-facilities {
		grid-template-columns: 1fr;
		row-gap: 24px;
	}

	.kro-business-page .kro-biz-h3 {
		font-size: 18px;
	}

	.kro-biz-lines__head {
		font-size: 20px;
	}

	/* 中央揃えのまま折り返すと行頭が揃わず読みづらいので、SPは左寄せ。 */
	.kro-biz-closing {
		margin-top: 40px;
		font-size: 16px;
		line-height: 1.8;
		text-align: left;
	}

	.kro-biz-closing--wide {
		margin-top: 40px;
		line-height: 1.8;
	}
}

/* 2026-09-25：着地の指定は上部（.kro-psec--biz）に一本化した。 */