@charset "utf-8";
/* ===============================================
   About 共通：サブナビゲーション
   =============================================== */

/* --- 全体：本文の幅に収める --- */
.about-nav.about-nav {
	width: auto;
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding: 0 !important;
	border-top: 3px solid var(--blue);
	border-bottom: 0;
	background: var(--white);
}
.about-nav .about-nav__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 var(--content-gutter);
}

/* 文字の左端を本文・パンくずにそろえる */
.about-nav .about-nav__inner.about-nav__inner {
	padding-left: 0;
}

/* ラベル「ABOUT」は出さない */
.about-nav .about-nav__label {
	display: none;
}

/* --- ナビゲーション --- */
.about-nav__menu {
	flex: 0 0 auto;
}
/* 横スクロールは出さない（入りきらないときは折り返す） */
.about-nav__menu .wp-block-navigation__container {
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
}
/* 項目の間は区切り線なし・余白だけ */
.about-nav__menu .wp-block-navigation-item {
	margin: 0 36px 0 0;
	padding: 0;
	border-right: 0;
}
.about-nav__menu .wp-block-navigation-item:last-child {
	margin-right: 0;
}
.about-nav__menu .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	padding: 14px 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	color: #444;
	text-decoration: none;
	white-space: nowrap;
	transition: color .15s;
}
.about-nav__menu .wp-block-navigation-item__content:hover,
.about-nav__menu .wp-block-navigation-item__content:focus {
	color: var(--blue);
	text-decoration: none;
}

/* 現在のページ */
.about-nav__menu .current-menu-item .wp-block-navigation-item__content {
	color: var(--blue);
}

/* --- ページ上部に置いたとき：パンくずのすぐ下、本文との間をあける --- */
.site-body:has(.entry-body > .about-nav:first-child) {
	padding-top: 0;
}
.entry-body > .about-nav.about-nav:first-child {
	margin-top: 0;
	margin-bottom: 72px;
}
/* 本文の最後とフッターの間（色付きの帯で終わるページは除く） */
.entry-body:has(> .about-nav:first-child):not(:has(.about-keys)) {
	padding-bottom: 72px;
}
@media (max-width: 991.98px) {
	.entry-body > .about-nav.about-nav:first-child {
		margin-bottom: 56px;
	}
	.entry-body:has(> .about-nav:first-child):not(:has(.about-keys)) {
		padding-bottom: 56px;
	}
}

/* --- タブレット以下：4項目を 2×2 で並べる --- */
@media (max-width: 991.98px) {
	.about-nav__menu,
	.about-nav__menu .wp-block-navigation__container {
		width: 100%;
	}
	.about-nav__menu .wp-block-navigation__container {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 16px;
	}
	.about-nav__menu .wp-block-navigation-item {
		margin: 0;
	}
	.about-nav__menu .wp-block-navigation-item__content {
		padding: 10px 0;
		white-space: normal;
	}
}

/* --- スマホ --- */
@media (max-width: 575.98px) {
	.about-nav .about-nav__inner {
		padding: 0 20px;
	}
}


/* ===============================================
   About 子ページ共通：ページヘッダー
   =============================================== */
.about-child .page-header {
	display: flex;
	align-items: center;
	text-align: left;
}

@media (max-width: 767.98px) {
	.about-child .page-header-title {
		font-size: 36px;
	}
}


/* ===============================================
   About 子ページ共通：本文
   =============================================== */
.about-child .site-body {
	padding-top: 72px;
	padding-bottom: 0;
}

.about-child .about-nav {
	margin-top: 72px;
	margin-bottom: 0;
}
/* 色付きの帯の直後は隙間なし（タブレットの margin-top より強くする） */
.about-nav.about-nav:is(.about-keys + *) {
	margin-top: 0;
}

/* 見出し・文章 */
.about-child .entry-body > h2 {
	margin: 0 0 32px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3;
	color: #222;
}
.about-child .entry-body > p {
	max-width: 760px;
	margin: 0 0 20px;
	font-size: var(--fs-text);
	line-height: var(--lh-text);
	color: #444;
}
.about-child .entry-body > p:last-child {
	margin-bottom: 0;
}

/* PC */
@media (min-width: 992px) {
	.about-child .site-body-container {
		max-width: var(--page-width);
		margin: 0 auto;
		padding-left: 80px;
		padding-right: 80px;
	}
}

@media (max-width: 991.98px) {
	.about-child .site-body {
		padding-top: 56px;
	}
	.about-child .about-nav {
		margin-top: 56px;
	}
}

/* SP：見出し */
@media (max-width: 767.98px) {
	.about-child .entry-body > h2 {
		font-size: 26px;
	}
}

/* SP：ページの上下の余白 48px */
@media (max-width: 767.98px) {
	.about-child .site-body {
		padding-top: 48px;
	}
	.about-child .about-nav {
		margin-top: 48px;
	}
	.entry-body > .about-nav.about-nav:first-child {
		margin-bottom: 48px;
	}
	.entry-body:has(> .about-nav:first-child):not(:has(.about-keys)) {
		padding-bottom: 48px;
	}
}
