@charset "UTF-8";

/* ==========================================================================
   サイトマップ（page-sitemap.php  .p-sitemap）
   と
   ページが見つかりません（404.php  .p-404）

   見出し・案内文・ボタンは css/components.css の部品
   （.c-heading / .c-lead / .c-button）をそのまま使う。
   このファイルにあるのは、余白と一覧・ボタンの並びだけ。

   サイトマップの項目は inc/sitemap-data.php が自動で組み立てる。
   SP ファーストで記述し、840px 以上を PC レイアウトとしている。
   ========================================================================== */

.p-sitemap,
.p-404 {
	padding: 40px 0 64px;
}

/* --------------------------------------------------------------------------
   サイトマップ
   -------------------------------------------------------------------------- */

/* SP は1列 */
.p-sitemap__groups {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	margin-top: 32px;
}

/* グループ見出し（イベントの自動一覧の見出しも同じ見た目） */
.p-sitemap__group-title,
.p-sitemap__auto h2 {
	margin: 0 0 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--color-primary);
	font-family: var(--font-mincho);
	font-size: 18px;
	/* 明朝体は太字にしない */
	font-weight: 400;
	line-height: 1.5;
	color: var(--color-text);
}

.p-sitemap__list,
.p-sitemap__auto ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.p-sitemap__link,
.p-sitemap__auto a {
	display: inline-block;
	padding: 5px 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
}

.p-sitemap__link:hover,
.p-sitemap__auto a:hover {
	color: var(--color-primary);
	text-decoration: underline;
}

/* 子ページは字下げ */
.p-sitemap__list .p-sitemap__list {
	padding-left: 1.25em;
}

.p-sitemap__list .p-sitemap__list .p-sitemap__link {
	font-size: 13px;
}

/* イベントの自動一覧（All in One SEO） */
.p-sitemap__auto {
	margin-top: 40px;
}

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */
.p-404__lead {
	margin-top: 20px;
	text-align: center;
}

.p-404__buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
}

.p-404__buttons .c-button {
	min-width: 260px;
}


/* ==========================================================================
   PC
   ========================================================================== */

@media (min-width: 840px) {

	.p-sitemap,
	.p-404 {
		padding: 64px 0 120px;
	}

	/* PC は3列 */
	.p-sitemap__groups {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 48px 40px;
		margin-top: 48px;
	}

	/* 大庭さん版（2026-09-25）に合わせ、PC のグループ見出しは 17px */
	.p-sitemap__group-title,
	.p-sitemap__auto h2 {
		font-size: 17px;
	}

	.p-sitemap__link,
	.p-sitemap__auto a {
		font-size: 15px;
	}

	/* リンクが多いイベントの自動一覧は3段組み */
	.p-sitemap__auto ul {
		columns: 3;
		column-gap: 40px;
	}

	.p-sitemap__auto li {
		break-inside: avoid;
	}

	.p-sitemap__auto {
		margin-top: 56px;
	}

	.p-404__buttons {
		flex-direction: row;
		justify-content: center;
		gap: 16px;
		margin-top: 40px;
	}
}