:root
{
	font-family: "Helvetica", "Arial", "Apple Emoji Font", "Segoe UI Emoji", "BIZ UDゴシック", "Noto Sans CJK JP", "Source Han Sans JP", "Noto Sans CJK", "Source Han Sans", "ヒラギノ角ゴ Pro", "メイリオ", "游ゴシック Medium", sans-serif;
	scroll-behavior:	smooth;
	line-height: 150%;
	
	--current-bg: #D0E0FF;
	--title-bg: #E0F0FF;
	--body-bg: #F6FAFF;
	--emph-bg: #D0FFD0;
	--maj-bdcol: #2040A0; 
	--min-bdcol: #4080B0;
}

.bold
{
	font-weight: bold;
}

@keyframes fadein
{
	from{
		z-index: -100;
		height: 0;
		max-height: 0;
		padding:	0;
		opacity: 0;
	}
	to{
		z-index: auto;
		height: auto;
		max-height: none;
		opacity: 1;
	}
}
@keyframes fadeout
{
	from{
		z-index: auto;
		height: auto;
		max-height: none;
		opacity: 1;
	}
/*	99%{ height: auto; }*/
	to{
		z-index: -100;
		height: 0;
		max-height: 0;
		padding:	0;
		opacity: 0;
	}
}


.emoji
{
	font-family: "Noto Color Emoji", "Segoe UI Emoji", "Apple Color Emoji";
}

body
{
	display:	flex;
	--media:	big;
}

#navmenu
{
	top:	2.5rem;
	width:	20vw;
	position:	sticky;
	padding: 0;
	overflow: hidden;
	border: thin solid var(--maj-bdcol);
	border-collapse: collapse;
	border-radius:	0.5rem;
	margin: 1rem;
}

#navtoggle
{
	display:	none;
}

.nav-toggle-label
{
	display: inline-flex;
	align-items: center;
}

@media (max-width:768px)
{
	body
	{
		--media: small;
	}
}

#navmenu>*:first-child
{
	border-radius:	0.5rem 0.5rem 0 0;
}

#navmenu>*:last-child, #navmenu>*:last-child>*:last-child
{
	border-radius:	0 0 0.5rem 0.5rem;
}

h2.nav-item
{
	border-bottom: 1px solid var(--maj-bdcol);
}

.nav-header
{
	display: flex;
	align-items: stretch;
}

.nav-home-link
{
	flex: 1;
}

.nav-home-text
{
	display: inline-block;
}

.nav-item+.nav-item
{
	border-top: 1px solid var(--min-bdcol);
}

#navmenu>*
{
	margin: 0;
	padding: 0;
}

.nav-item>a
{
	display: block;
	padding: .5em;
	color:	#000040;
	text-decoration: none;
	font-size: 90%;
}

.nav-item
{
	display: block;
}

h2.nav-item
{
	font-size: large;
	background-color: var(--title-bg);
}

.nav-item
{
	background-color: var(--body-bg);
	margin: 0;
	transition-duration:	0.5s;
}

.nav-item.here>a
{
	background-color: var(--current-bg);
	text-decoration:	underline;
}

.nav-item > a[aria-current="location"]
{
	background-color: var(--current-bg);
	text-decoration:	underline;
}


.nav-item>a:hover
{
	color: #004000;
	background-color:	var(--emph-bg);
	text-decoration:	underline;
}

.nav-item>a
{
	transition-duration:	0.5s;
}

.nav-sublist
{
	display: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.nav-item.here > .nav-sublist,
.nav-item:has(.nav-item.here) > .nav-sublist,
.nav-item:has(> a.nav-group-link:hover) > .nav-sublist,
.nav-item:has(> a.nav-group-link:focus-visible) > .nav-sublist
{
	display: block;
	animation: fadein .4s both;
}


ul h3
{
	font-size:	large;
	font-weight:	bold;
	margin:	0;
}

main
{
	width: 75vw;
}

section
{
	padding: 0;
	overflow: hidden;
	border: thin solid var(--maj-bdcol);
	border-radius:	1rem;
	margin: 2rem;
}


section>h1, section>h2
{
	border-radius:	0.5rem 0.5rem 0 0;
	padding: 0.5em;
	background-color: var(--title-bg);
}

section>.secmain
{
	border-radius:	0 0 0.5rem 0.5rem;
	border-top: thin solid var(--min-bdcol);
	padding: 1em;
	background-color: var(--body-bg);
}

section>*
{
	margin: 0;
}

section>ul.secmain, section>ul.secmain ul
{
	padding-left: 32px;
}


@media (max-width:768px)
{
	
	body
	{
		margin:	5px;
	}
	#navtoggle
	{
		display:	inline-flex;
		align-items: center;
		padding-left: 0.5em;
	}
	#navmenu
	{
		position:	fixed;
		width:	calc(100% - 10px);
		margin:	0;
		top:	0rem;
		left:	auto;
		right:	auto;
		z-index:	100;
	}
	.nav-item
	{
		padding: 0px;
	}
	#isopen
	{
		display:	none;
	}
	#btnopen,
	#btnclosed,
	#navmenu > ul.nav-main-list
	{
		display: none;
	}
	#navmenu:has(#isopen:checked) #btnopen
	{
		display: inline-block;
	}
	#navmenu:has(#isopen:not(:checked)) #btnclosed
	{
		display: inline-block;
	}
	#navmenu:has(#isopen:checked) > ul.nav-main-list
	{
		display: block;
		animation: fadein .4s both;
	}
	#navmenu:has(#isopen:not(:checked)) > ul.nav-main-list
	{
		display: none;
	}
	#btnopen, #btnclosed
	{
		transition-duration:	0.5s;
		font-size:	x-large;
		border-style:	solid;
		border-color:	#404040;
		border-width:	thin;
		border-radius:	4px;
		background-color:	#F0F0F0;
		margin-right:	0.5em;
	}
	.nav-home-link
	{
		min-width: 0;
	}
	/* On mobile, submenu visibility follows current scroll target as well. */
	.nav-item.here > .nav-sublist,
	.nav-item:has(.nav-item.here) > .nav-sublist
	{
		display: block;
	}


	main
	{
		width:	calc(100% - 10px);
		position:	fixed;
		top:	6rem;
		bottom:	0;
		left:	auto;
		right:	auto;
		overflow-y:	auto;
	}
	section
	{
		margin: 0 0 2rem 0;
	}
	
	dl, ul
	{
		padding-left: 16px;
	}
	section>ul.secmain
	{
		padding-left: 24px;
	
	}
}


li
{
	margin: 0.5em;
}

cite, address
{
	font-style:	normal;
}

a
{
	color:	#0040A0;
	text-decoration: none;
}

a:hover
{
	color:	#000040;
	text-decoration: underline;
}

a[href^="#"]:not(.nav-link)
{
	color:	#006000;
}

a:hover[href^="#"]:not(.nav-link)
{
	color:	#002000;
}


dt
{
	font-weight: bold;
}

.smaller
{
	font-size: 75%;
}

.smallcaps
{
	font-variant: small-caps;
}