/*.md-grid {
/*	max-width: 1400px;
/*}

/*TOC*/


/* ===== 見出しの部分カラー下線（H2/H3） ===== */
.md-typeset h2 {
	position: relative;
	padding-bottom: .6rem;
	/* 下線ぶんの余白 */
	margin-bottom: 1.2rem;
}

/* 既存のborder系は無効化（入れていた場合） */
.md-typeset h2,
.md-typeset h3 {
	border-bottom: none !important;
}

/* 下線本体：左だけアクセント、右はグレー */
.md-typeset h2::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	/* 太さはお好みで */
	border-radius: 4px;
	background:
		linear-gradient(to right,
			var(--md-accent-fg-color) 0 var(--h-underline-accent, 28%),
			var(--md-default-fg-color--light) 0 100%);
	/* ↑ 左から --h-underline-accent% までアクセント色、以降は薄いグレー */
}

/* ===== H3: 見出しの“右側だけ”横線 ===== */
.md-typeset h3 {
	display: flex;
	/* テキスト + 線 を横並びに */
	align-items: center;
	/* 線の縦位置を中央に（好みに応じて baseline にしてもOK） */
	gap: .75rem;
	/* テキストと線の間隔 */
	margin: 1.6rem 0 1rem;
	border-bottom: none !important;
	/* 以前の下線指定を無効化 */
}

/* 右側に伸びる横線 */
.md-typeset h3::after {
	content: "";
	flex: 1 1 auto;
	/* 残り幅いっぱいに伸ばす */
	height: var(--h3-rule-height, 2px);
	background: var(--h3-rule-color, var(--md-default-fg-color--light));
	border-radius: 2px;
	opacity: .9;
}

/* 任意: 行内コードがある h3 のときも高さを合わせる */
.md-typeset h3 code {
	font-size: .9em;
}

/* 右TOCの強調はそのまま */
.md-nav--secondary .md-nav__link--active,
.md-nav--secondary .md-nav__link--active:hover {
	text-decoration: underline;
	text-underline-offset: .2em;
	font-weight: 600;
}


/* ---- フェード（in/out） ----
   JSが <html class="js"> を付与 → 初期は透明 → is-ready で不透明へ
*/
.md-content {
	transition: opacity .24s ease-in-out;
}

html.js .md-content {
	opacity: 0;
}

html.js .md-content.is-ready {
	opacity: 1;
}

/* スムーススクロール（任意） */
html {
	scroll-behavior: smooth;
}


/* ---- テーブルの縦罫線 + ゼブラ背景 ---- */
:root {
	/* 色トークンから計算（必要なら%を調整） */
	--tbl-divider: var(--md-default-fg-color--lightest);
	--tbl-zebra-even: color-mix(in srgb, var(--md-default-bg-color) 3%, var(--md-default-fg-color) 4%);
	--tbl-zebra-hover: color-mix(in srgb, var(--md-default-bg-color) 9%, var(--md-default-fg-color) 8%);
}

/* Markdown標準テーブル（クラス無し）を対象 */
.md-typeset table:not([class]) {
	border-collapse: separate;
	/* 縦罫線を入れるので separate に */
	border-spacing: 0;
	width: 100%;
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
	padding: .6rem .8rem;
	border-top: 1px solid var(--tbl-divider);
}

/* 列ごとの縦罫線 */
.md-typeset table:not([class]) th+th,
.md-typeset table:not([class]) td+td {
	border-left: 2px solid var(--tbl-divider);
}

/* ヘッダーの見分けを少し強めに */
.md-typeset table:not([class]) thead th {
	background: var(--tbl-zebra-even);
	border-bottom: 2px solid var(--tbl-divider);
	font-weight: 700;
}

/* 偶数行のゼブラ */
.md-typeset table:not([class]) tbody tr:nth-child(even) td {
	background: var(--tbl-zebra-even);
}

/* 行ホバー（任意） 
.md-typeset table:not([class]) tbody tr:hover td {
	background: var(--tbl-zebra-hover);
}*/


/* 見出しの左側にパーマリンクアイコンを移動 */
.md-typeset h1[id],
.md-typeset h2[id],
.md-typeset h3[id],
.md-typeset h4[id] {
	position: relative;
	/* 絶対配置の基準にする */
}

/* 右側配置のデフォルト余白を無効化 */
.md-typeset .headerlink {
	margin-left: 0 !important;
}

/* 左に固定配置（レイアウトを押し広げない） */
.md-typeset h1[id]>.headerlink,
.md-typeset h2[id]>.headerlink,
.md-typeset h3[id]>.headerlink,
.md-typeset h4[id]>.headerlink {
	position: absolute;
	left: -1.4em;
	/* 左に出す量。好みで調整 */
	top: 50%;
	transform: translateY(-50%);
	/* 見出しの縦中央に揃える */
	padding: 0;
}

/* （任意）モバイルで少し内側に寄せる */
@media (max-width: 600px) {

	.md-typeset h1[id]>.headerlink,
	.md-typeset h2[id]>.headerlink,
	.md-typeset h3[id]>.headerlink,
	.md-typeset h4[id]>.headerlink {
		left: -1em;
	}
}


/* ==== 回り込み画像のサイズを一定に（大きすぎを防止） ==== */
:root {
	/* 好みで調整：最大幅(px) と 画面に対する割合 */
	--aligned-img-max: 520px;
	--aligned-img-percent: 42%;
}

/* 左右回り込み画像に上限幅を適用（解像度が大きくてもはみ出さない） */
.md-typeset img.align-left,
.md-typeset img.align-right {
	max-width: clamp(260px, var(--aligned-img-percent), var(--aligned-img-max));
	height: auto;
}

/* 余白（Materialのデフォルトより少し広めに） */
.md-typeset img.align-left {
	float: left;
	margin: .25rem 1.25rem 1rem 0;
}

.md-typeset img.align-right {
	float: right;
	margin: .25rem 0 1rem 1.25rem;
}

/* セクション境界では回り込みをリセット（次の見出しが食い込まないように） */
.md-typeset h2,
.md-typeset h3 {
	clear: both;
}

/* モバイルは縦並びに戻す */
@media (max-width: 960px) {

	.md-typeset img.align-left,
	.md-typeset img.align-right {
		float: none;
		display: block;
		margin: .5rem auto 1rem;
		max-width: 100%;
	}
}

/* （任意）段落単位で明示的にクリアしたい時用 */
.md-typeset .clear {
	clear: both;
}