/* 三本線とサイトメニューだけに適用する。ほかの説明シートには影響させない。 */
.site-header .burger {
	background: #fff;
	border-radius: 50%;
}
.site-header .burger svg { width: 28px; height: 28px; }
.site-header .burger:hover { color: var(--rose-ink); }

#sheet-menu {
	align-items: flex-start;
	justify-content: flex-end;
	padding: 88px max(16px, calc((100vw - var(--page-max)) / 2)) 16px;
	background: rgba(74, 63, 58, .18);
}
#sheet-menu .sheet__panel {
	width: 340px;
	max-width: 100%;
	max-height: calc(100dvh - 104px);
	padding: 12px;
	border-radius: var(--r-14);
	box-shadow: 0 12px 40px rgba(74, 63, 58, .14);
}
#sheet-menu .sheet__head { margin: 0 0 4px; padding-left: 12px; }
#sheet-menu .sheet__title { font-size: var(--fs-label); color: var(--ink-2); }
#sheet-menu .sheet__close { background: transparent; }
#sheet-menu .sheet__body { line-height: 1.5; }
#sheet-menu .sitemenu__primary,
#sheet-menu .sitemenu__secondary { display: flex; flex-direction: column; gap: 2px; }
#sheet-menu .sitemenu__item {
	padding: 0 12px;
	border: 0;
	border-radius: var(--r-12);
	min-height: 48px;
	gap: 12px;
	font-weight: 600;
}
#sheet-menu .sitemenu__item:hover { background: var(--bg); }
#sheet-menu .sitemenu__item:focus-visible,
.site-header .burger:focus-visible { outline: 2px solid var(--rose-ink); outline-offset: 2px; }
#sheet-menu .sitemenu__ico { width: 20px; height: 20px; color: var(--ink-2); }
#sheet-menu .sitemenu__secondary {
	gap: 0;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--line);
}
#sheet-menu .sitemenu__secondary .sitemenu__item {
	min-height: 40px;
	font-size: var(--fs-label);
	font-weight: 400;
	color: var(--ink-2);
	justify-content: space-between;
}
#sheet-menu .sitemenu__secondary .sitemenu__item::after { content: '›'; font-size: 1.2rem; }

@media (max-width: 600px) {
	#sheet-menu { padding-top: 76px; }
	#sheet-menu .sheet__panel { max-height: calc(100dvh - 92px); }
}