@charset "UTF-8";

/* ================================================================================
header
================================================================================ */
@media print, screen
{

body > header
{
	z-index: var(--priorityHeader);
	position: sticky;
	top: 0;

	background-color: var(--Cgray0);
}
body > header > .inner
{
	display: flex;	justify-content: space-between;	align-items: center;
	gap: calc(50 * var(--v));

	height: var(--headerH);
	max-width: var(--pageW);
	padding: 0 var(--pageP);
	margin: 0 auto;
}

body > header h1
{
	flex-shrink: 0;
	width: calc(117 * var(--v));
}
body > header h1 picture
{
	display: block;
	width: 100%;
}
body > header h1 picture img
{
	display: block;
	width: 100%;	height: 100%;
	object-fit: contain;
}

body > header ul
{
	display: flex;	flex-wrap: wrap;	justify-content: end;	align-items: center;
	gap: calc(12 * var(--v)) calc(25 * var(--v));
	width: 100%;
}
body > header li p
{
	color: white;
	font-family: var(--FF);
	font-size: calc(14 * var(--v));
	font-weight: 700;
}

body > header h1 a,
body > header li a
{
	text-decoration: none !important;
	transition: 0.3s ease-in-out 0s;
}
body > header h1 a:hover,
body > header li a:hover
{	opacity: 0.7;	}

}
@media screen and (max-width: 767px)
{

body > header ul
{
	padding: calc(25 * var(--v)) 0 0;
	gap: calc(25 * var(--v)) calc(30 * var(--v));
}
body > header li p
{
	font-size: calc(18 * var(--v));
}


}


/* ======================================== end ======================================== */
