@import "screen.fonts.css";
@import "screen.reset.css";
@import "screen.properties.css";
@import "screen.elements.css";
@import "screen.classes.css";
@import "screen.animations.css";
:root{
	/* layout */
	--layout-content-half-max-width: calc(var(--layout-content-max-width) / 2);
	--layout-content-max-width: 96rem;
	--layout-header-height: 4.8rem;
	--layout-header-z-index: 10000;
	--layout-safe-area-inline: max(env(safe-area-inset-left),env(safe-area-inset-right));
	--layout-safe-area-block: max(env(safe-area-inset-top),env(safe-area-inset-bottom));
	/* theme : dark */
	/* theme : light */
	/* theme : default */
}
body{
	/*
	background: var(--scheme-default-body-background-color);
	color: var(--scheme-default-body-foreground-color);
	*/
	font-size: var(--font-size-fixed);
	padding-top: 9.6rem;
}
main{
	min-height: 100vh;
}
/* siteHeader */
#sh{
	left: 0;
	position: fixed;
	top: 0;
	width: 100vw;
}
#sh-main{
	background-color: #FFBBCC;
	height: 4.8rem;
}
#sh-nav{
	background-color: #FFFFFF;
	overflow: hidden;
}
#sh-nav ul{
	display: flex;
	height: 4.8rem;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
}
#sh-nav ul li{
	display: inline-flex;
	scroll-snap-align: start;
	/* dev */
	font-size: 1.4rem;
	/*
	padding: .8rem .8rem .8rem 0;
	*/
}
#sh-nav ul li:first-child{
	padding-left: var(--gutter-safe-width);
}
#sh-nav ul li:last-child{
	padding-right: var(--gutter-safe-width);
}
#sh-nav ul li a{
	display: block;
	/* dev */
	height: 4.8rem;
	line-height: 4.8rem;
	padding: 0 1.6rem;
	white-space: nowrap;
}
#sh-nav ul li.active a{
	color: var(--theme-default-body-accent-color);
}
#sh-nav ul li a:hover{
	color: var(--theme-default-body-accent-color);
}