/* 下層ページ PC: 左メニューの固定と、表示中セクションの強調 */
@media (min-width: 768px) {
	main.has-side-toc {
		overflow: clip !important;
	}

	.side-toc {
		position: sticky;
		top: 160px;
		align-self: flex-start;
		max-height: calc(100vh - 180px);
		overflow-y: auto;
		scrollbar-width: thin;
	}

	.side-toc a span {
		transition: color 0.2s ease, text-shadow 0.2s ease;
	}

	.side-toc a.is-current,
	.side-toc a.is-current span {
		color: #4fa528 !important;
		font-weight: 700 !important;
		text-shadow: 0 0 10px rgba(112, 192, 63, 0.75);
	}
}

/* スマホでは左メニューを出さない */
@media (max-width: 767.98px) {
	main .row > .col-12.col-md-3:has(a[href^="#"]) {
		display: none !important;
	}

	/* 緑の線つきの大見出しの行間を、/inher_tax/ などと同じ 1.4 に揃える */
	.sub-feautre-1.fs-32 {
		line-height: 1.4 !important;
	}

	/* 本文の上の説明画像: 中央揃え・少し大きく・本文との余白 */
	main .row > .col-12.col-md-3:not(.mission_img):has(> svg, > img) {
		margin-bottom: 24px;
	}

	main .row > .col-12.col-md-3:not(.mission_img) > svg,
	main .row > .col-12.col-md-3:not(.mission_img) > img {
		display: block;
		width: 220px !important;
		height: 220px !important;
		margin-inline: auto;
	}

	/* 英字の大見出し: 単語の途中で改行しない */
	main span.fs-50 {
		word-break: normal !important;
		overflow-wrap: break-word;
	}

	main span.fs-50:not(.inbox) {
		font-size: 9.2vw !important;
		line-height: 1.2 !important;
	}

	/* ブログ記事のパンくず: 長い記事名を折り返す */
	.title-div .fs-16.lh-22.ls-8.nowrap {
		white-space: normal !important;
		min-width: 0;
		font-size: 13px !important;
		letter-spacing: normal !important;
	}

	/* ブログ記事のタイトルまわり: ほかの下層ページと同じ位置・大きさに揃える */
	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div {
		padding: 83vw 28px 92px;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .fs-40 {
		font-size: 9.48vw !important;
		letter-spacing: 0.05em !important;
		line-height: 1.4 !important;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .fs-16 {
		margin-top: 8px !important;
		font-size: 4.6vw !important;
		letter-spacing: normal !important;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .row {
		display: flex;
		flex-wrap: wrap;
		margin-top: 24px !important;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .row > .d-flex {
		flex: 0 0 auto;
		width: auto;
		max-width: 100%;
		padding: 0;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .row > .d-flex:last-child {
		flex: 0 1 100%;
		margin-top: 4px;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .title-div > .row .mx-20 {
		margin-inline: 8px !important;
	}

	#mainvisual:has(.fs-16.lh-22.ls-8.nowrap) .content-div2 {
		margin-inline: 42px;
	}
}
