@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));
}


}

/* パンくず */
.s-breadcrumb--builder {
	background-color: #484848;
	color: #f6f6f6;
	padding-top: 9px;
	padding-bottom: 6px;
}
.b-breadcrumb-item {
    display: inline;
    align-items: center;
    line-height: 1.6;
    vertical-align: middle;
    margin: 0;
}
.b-breadcrumb>.svg-icon {
    flex-shrink: 0;
    fill: currentColor;
    display: inline;
    vertical-align: middle;
    width: 1.2em;
    height: 1.2em;
    line-height: 1.6;
    margin-right: .725em;
    margin-left: .725em;
}
.s-breadcrumb--builder>.b-breadcrumb {
	margin-left: auto;
	margin-right: auto;
	max-width: 1200px;
	width: calc(100% - 3rem);
}
@media screen and (min-width: 320px){
	.b-breadcrumb {
		font-size: calc(12px + 2*(100vw - 320px)/880);
	}
}
.b-breadcrumb {
	font-family: "DINNextLTPro", DIN Next W01 Regular,YuGothic,游ゴシック,ＭＳ Ｐゴシック,MS P Gothic,MS-PGothic,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,arial,helvetica,clean,sans-serif;
}
/* ======================================== end ======================================== */