/*////////////////////////////////////////////////////////////////////////////*/

/*! header.css */

/*////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	変数

------------------------------------------------------------------------------*/


/*	:root
------------------------------------------------------------------------------*/

:root {

	/* グローバルナビゲーション */

	/* ナビバー余白 */
	--gnav-padding-x: 1.5em;
	--gnav-padding-y: 1.5em;
	/* ナビバー内容の高さ */
	--gnav-content-height: 3em;
	/* ナビバー高さ（ステータスバーを含む高さ合計） */
	--gnav-height: calc(var(--gnav-content-height) + var(--gnav-padding-y) * 2);
	/* 開始時のナビバー高さ */
	--gnav-start-height: var(--gnav-height);
	/* ラッバーの最大高さ */
	--gnav-full-height: var(--gnav-height);
	/* メニューボタンのマージン */
	--gnav-menu-margin: calc((var(--gnav-height) - var(--menu-height)) / 2);
	--gnav-menu-start-margin: var(--gnav-menu-margin);

	/* スクロール時のナビバー高さ可変アニメ秒数 */
	--scrolled-transition-duration: .2s;

	/* メニューボタン */

	--menu-width: auto;
	--menu-padding: 1.25em;
	--menu-content-height: 1em;
	--menu-height: calc(var(--menu-content-height) + (var(--menu-padding) * 2));
	/**/
	--menu-icon-width: var(--menu-content-height);
	--menu-icon-height: var(--menu-content-height);
	--menu-icon-gap: 1em;/* アイコンとラベルの間隔 */
	--menu-burger-width: 2px;/* バーガーアイコンの線の幅 */
	/**/
	--menu-bg-color-rgb: var(--color-text-h-rgb, 17 17 17);
	--menu-bg-color-a: 1;
	--menu-border-color-rgb: var(--color-text-h-rgb, 17 17 17);
	--menu-border-color-a: 1;
	--menu-text-color-rgb: var(--color-bg-body-rgb, 255 255 255);
	--menu-text-color-a: 1;
}


@media (min-width: 721px) {

	.scrolled {
		/* 可変高さ */
		--gnav-padding-y: .75em;
		/* --gnav-padding-y に依存している変数を再計算 */
		--gnav-height: calc(var(--gnav-content-height) + var(--gnav-padding-y) * 2);
		--gnav-menu-margin: calc((var(--gnav-height) - var(--menu-height)) / 2);
	}

/**/}


/*	サイトヘッダー
------------------------------------------------------------------------------*/

.site-header {

	/* ベース書式 */

	/* 行送り */
	--line-height: 1.5;
	/* 行と文字との間隔高さ(半分) */
	--line-padding: calc((var(--line-height) - 1) / 2 * var(--font-size));
	/* テキストシャドウ */
	--text-shadow: drop-shadow(0 0 1px rgb(0 0 0 / .5))
	               drop-shadow(0 0 2px rgb(0 0 0 / .5));

	/**/

	/* サイトヘッダー全体 */

	/* ナビバーの背景色 */
	--header-bg-color-rgb: var(--color-bg-body-rgb, 255 255 255);
	--header-bg-color-a: 0;
	/* スクロール後のナビバーの背景色 */
	--header-scrolled-bg-color-rgb: var(--color-bg-body-rgb, 255 255 255);
	--header-scrolled-bg-color-a: .8;
	/* スクロール後のナビバーのシャドウ */
	--header-scrolled-shadow: drop-shadow(0 0 5px rgb(0 0 0 / .1));

	/**/

	/* サイトロゴ */

	/* ロゴ周囲の余白 */
	--logo-padding-y: var(--gnav-padding-y);
	--logo-padding-x: var(--gnav-padding-x);
	--logo-padding-start-x: var(--gnav-padding-x);/* 可変する前の左余白 */
	/* ロゴ高さ */
	--logo-height: var(--gnav-content-height);
	/* ロゴ幅 */
	--logo-width: auto;
	/* ロゴ色 */
	--site-logo-color-rgb: var(--color-text-h-rgb, 17 17 17);
	--site-logo-color-a: 1;
	--site-logo-color: rgb(var(--site-logo-color-rgb) / var(--site-logo-color-a));

	/* ボタン共通 */

	/* テキストとアイコンの間隔 */
	/*
	--btn-icon-gap: .5em;
	/* ボタン内余白 */
	--btn-padding-y: calc(var(--btn-padding-x) - var(--btn-line-height-gap) - var(--btn-border-width));

	/* 行動ボタン */

	/* 行動ボタン同士の感覚 */
	--action-gap: .25em;/* ボタン同士が隣り合うので2倍になる */
	/* 行動ボタンの余白(YX) */
	--action-padding-y: var(--btn-padding-y);
	--action-padding-x: calc(var(--btn-padding-y) - var(--btn-border-width));
	--action-button-height: calc(var(--btn-border-width) * 2 + var(--action-padding-y) * 2 + var(--line-height) * 1em);
	/* 重要ボタンのボーダー幅 */
	--action-important-border-width: var(--btn-border-width);
	--action-important-padding_y: calc(var(--btn-padding-y) - (var(--action-important-border-width) - var(--btn-border-width)));
	--action-important-padding_x: calc(var(--btn-padding-x) - (var(--action-important-border-width) - var(--btn-border-width)));
	--action-important-height: calc(var(--action-important-border-width) * 2 + var(--action-important-padding_y) * 2 + var(--line-height) * 1em);
	/* ボーダー */
	--action-border-width: var(--btn-border-width);
	--action-border-radius: .25em;
	/* カラー */
	--action-text-color-rgb: var(--color-text-h-rgb, 17 17 17);
	--action-text-color-a: 1;
	--action-current-color-rgb: var(--color-bg-body-rgb, 255 255 255);/* カレントボタン(選択状態) */
	--action-current-color-a: 1;
	--action-bg-color-rgb: var(--action-text-color-rgb);
	--action-bg-color-a: 0;
	--action-border-color-rgb: var(--action-text-color-rgb);
	--action-border-color-a: 0;

	/* サブメニュー */

	--submenu-margin: .5em;
	--submenu-padding: .5em;
	--submenu-item-gap: var(--submenu-margin);
	/**/
	--submenu-text-color-rgb: var(--color-bg-body-rgb, 255 255 255);
	--submenu-text-color-a: 1;
	--submenu-bg-color-rgb: var(--action-text-color-rgb);
	--submenu-bg-color-a: 1;
	/**/
	--submenu-border-width: 2px;
	--submenu-border-radius: calc(var(--action-border-radius) + var(--submenu-padding));
	--submenu-border-color-rgb: var(--action-text-color-rgb);
	--submenu-border-color-a: 1;
}


/*	BP
------------------------------------------------------------------------------*/

@media (max-width: 720px) {

	:root {
		--logo-padding-x: var(--gnav-padding-x);
		--logo-padding-y: var(--gnav-padding-y);
		--logo-height: var(--gnav-content-height);
	}

/**/}


/*------------------------------------------------------------------------------

	サイトヘッダーコンテナ

------------------------------------------------------------------------------*/


/* 親コンテナー
------------------------------------------------------------------------------*/

.site-header {
	--header-top: var(--wp-adminbar-height, 0px);
	/**/
	position: fixed;
	z-index: 100;
	left: 0;
	top: var(--header-top);
	width: 100%;
	line-height: var(--line-height);
	font-feature-settings: "palt";
}


/* 共通
------------------------------------------------------------------------------*/

/* ★ユーザーのテキスト選択を禁止する */
.site-header * {
	user-select: none;
}


/* ヘッダーナビバー背景
------------------------------------------------------------------------------*/

.site-header-nav::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: calc(var(--gnav-content-height) + var(--gnav-padding-y) * 2);
	background: rgb(var(--gnav-bg-color-rgb, 255 255 255) / var(--gnav-bg-color-a, 1));
	/**/
	-webkit-backdrop-filter: var(--gnav-bg-blur, none);
	backdrop-filter: var(--gnav-bg-blur, none);
	/**/
	transition: height var(--scrolled-transition-duration) ease-out,
	            background-color .2s ease-out,
	            opacity .2s ease-out;
}

.over-header .site-header-nav::before {
	--gnav-bg-color-a: 0;
}

.site-header-nav::after {/* 可変ヘッダー対策 */
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: var(--gnav-full-height);
}


/*	WordPress 管理バー補正
------------------------------------------------------------------------------*/

.customize-support.menu-open .site-header {
	height: calc(100% - var(--wp-adminbar-height, 0px));
}


/*------------------------------------------------------------------------------

	装飾・状態

------------------------------------------------------------------------------*/


/*	ダークモード
------------------------------------------------------------------------------*/

.darkmode .site-header {
	--header-scrolled-bg-color-rgb: 0 0 0;
	--header-scrolled-bg-color-a: .5;
}


/*	白抜き
------------------------------------------------------------------------------*/

body:not(.scrolled) .site-header.white {
	--action-text-color-rgb: 255 255 255;
	--action-current-color-rgb: var(--color-text-h-rgb, 17 17 17);
	--submenu-text-color-rgb: var(--action-current-color-rgb);
}


/*	シャドウ
------------------------------------------------------------------------------*/

body:not(.scrolled) .site-header.shadow .site-header-logo-link,
body:not(.scrolled) .site-header.shadow .site-header-action > li > a {
	filter: var(--text-shadow);
}


/*	スクロール時
------------------------------------------------------------------------------*/

/* ヘッダーナビバー背景色 */
.scrolled .site-header-nav::before {
	background: rgb(var(--header-scrolled-bg-color-rgb) / var(--header-scrolled-bg-color-a));
}

.scrolled .scrolled-shadow .site-header-nav::before {
	--header-scrolled-bg-color-a: 1;
	/**/
	box-shadow: 0 0 5px rgb(0 0 0 / .2);
	/*filter: var(--header-scrolled-shadow);*//* ※iPadで影のレンダリングが上手くいかないため利用不可 */
}

/* 背景ぼかし */
.site-header.backdrop-blur {
	--blur-radius: 12px;
	--header-scrolled-bg-color-a: .9;
	/**/
	-webkit-backdrop-filter: blur(var(--blur-radius));
	backdrop-filter: blur(var(--blur-radius));
}


/*------------------------------------------------------------------------------

	ステータス

------------------------------------------------------------------------------*/


/*	No Script
------------------------------------------------------------------------------*/

.site-noscript {
	background-color: rgb(235 0 0);
}

.site-noscript-message {
	margin: 0;
	padding: 0;
	line-height: 1.5;
	font-size: 75%;
	font-feature-settings: "palt";
	color: #FFF;
}


/*	InternetExplorer
------------------------------------------------------------------------------*/

#ie {
	padding: 1em;
	background-size: auto auto;
	background-color: rgb(235 0 0);
	background-image: repeating-linear-gradient(45deg, transparent, transparent 10px, rgb(0 0 0 / .07) 10px, rgb(0 0 0 / .07) 20px);
	color: #FFF;
}

#ie h2 {
	margin: 0;
	text-align: center;
	font-size: 100%;
	color: inherit;
}

#ie p {
	margin: 1em 0 0;
	text-align: center;
	font-size: 75%;
}

#ie a {
	color: #FFF;
}


/*	コンテナ
------------------------------------------------------------------------------*/

.site-header-announce {
	margin: 0;
	padding: 0;
	background: rgb(var(--menu-bg-color-rgb) / var(--menu-bg-color-a, 1));
	text-align: center;
	line-height: 1.25;
	font-weight: bold;
	font-size: 75%;
	color: rgb(var(--menu-text-color-rgb) / var(--menu-text-color-a, 1));
}

.site-header-announce > * {
	margin: 0;
	padding: 1em;
}

.site-header-announce .info {
	background: rgb(0 128 255);
	color: #FFF;
}

.site-header-announce .attention {
	background: #FE0;
	color: #000;
}

.site-header-announce .alert {
	background: #900;
	color: #FFF;
}


/*------------------------------------------------------------------------------

	グローバルナビゲーションバー

------------------------------------------------------------------------------*/


/*	コンテナー
------------------------------------------------------------------------------*/

.site-header-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/**/
	position: relative;
	margin: 0;
	padding: 0;
	max-width: 100%;
	transition: height .2s ease-out,
	            box-shadow .2s ease-out;
}


/*------------------------------------------------------------------------------

	サイトロゴ

------------------------------------------------------------------------------*/


/*	ロゴコンテナー
------------------------------------------------------------------------------*/

.site-header-logo {
	display: flex;
	align-items: center;
	/**/
	margin: 0;
	padding: var(--logo-padding-y) var(--logo-padding-x);
	padding-right: calc(var(--logo-padding-x) * 3);
	height: calc(var(--gnav-content-height) + var(--gnav-padding-y) * 2);
	/**/
	visibility: hidden;
	transition: height var(--scrolled-transition-duration) ease-out,
	            padding var(--scrolled-transition-duration) ease-out,/* ページスクロール後に高さを減らしたい場合 */
	            opacity .2s ease-out;/* 同期注意 header.js */
	opacity: 0;
}

.site-header-logo.active {
	visibility: visible;
	opacity: 1;
}

/* 白抜き */
body:not(.scrolled) .white .site-header-logo,
body:not(.scrolled) .white .site-header-action {
	filter: brightness(0) invert(1) drop-shadow(0 0 .125em rgb(0 0 0 / .3));
}


/*	HOVER
------------------------------------------------------------------------------*/

@media (any-hover: hover) {

	.site-header .logo > a:hover {
		opacity: .7;
	}

	.scrolled .site-header.white .site-header-logo > a:hover {
		--action-text-color-a: 1;
	}

/**/}
@media (any-hover: none) {

	.site-header .logo > a:active {
		opacity: .7;
	}

	.scrolled .site-header.white .site-header-logo > a:active {
		--action-text-color-a: 1;
	}

/**/}


/*	BP
------------------------------------------------------------------------------*/

@media (max-width: 720px) {

	:root {
		--gnav-padding-x: 1em;/* ロゴX余白：15px*1=15px */
		--gnav-padding-y: 1em;/* ロゴY余白：15px*1=15px */
	}

	.site-header-logo {
		padding-left: calc(var(--logo-padding-x) * 1.25);
		padding-right: calc(var(--logo-padding-x) * 2);
	}

	.logo-tagline {
		padding-right: 4em;
		font-size: 1.875vw;
	}

/**/}


/*------------------------------------------------------------------------------

	キャッチフレーズ

------------------------------------------------------------------------------*/


/*	コンテナ
------------------------------------------------------------------------------*/

.site-header-catchphrase {
	flex: 1;
	/**/
	display: flex;
	flex-direction: column;
	/**/
	position: relative;
	margin: 0 calc(var(--gnav-padding-x) * 2) 0 0;
	/**/
	visibility: hidden;
	transition: opacity .2s ease-out;
	opacity: 0;
}

.site-header-catchphrase.active {
	visibility: visible;
	opacity: 1;
}

.site-header-catchphrase > p {
	margin: 0;
	text-align: left;
	line-height: 1.5;
	font-size: 75%;
	white-space: nowrap;
}

@media (max-width: 1440px) {

	.site-header-catchphrase[data-hide-width="1440"] {
		display: none;
	}

/**/}
@media (max-width: 1080px) {

	.site-header-catchphrase {
		display: none;
	}

/**/}


/*------------------------------------------------------------------------------

	CTA

------------------------------------------------------------------------------*/


/*	コンテナ
------------------------------------------------------------------------------*/

.site-header-cta {
	display: flex;
	align-items: center;
	gap: .5em;
	/**/
	position: relative;
	list-style: none;
	margin: 0 var(--gnav-padding-x);
	padding: 0;
	/**/
	visibility: hidden;
	transition: opacity .2s ease-out;
	opacity: 0;
}

.site-header-cta.active {
	visibility: visible;
	opacity: 1;
}

@media (max-width: 1023px) {

	.site-header-cta {
		margin-left: auto;
	}

/**/}

.site-header-cta .de {
	vertical-align: baseline;
	margin: 0 .125em;
	font-size: 90%;
}


/*	電話ボタン
------------------------------------------------------------------------------*/

.site-header-phone > .btn-border-style {
	--btn-bg-color-rgb: var(--color-izumi-blue-rgb);
	--btn-border-color-rgb: var(--color-izumi-blue-rgb);
	--btn-text-color-rgb: var(--color-izumi-blue-rgb);
	--btn-icon-color-rgb: var(--color-izumi-blue-rgb);
	--btn-icon-gap: .25em;
	/**/
	--btn-bg-color-inverted-rgb: var(--color-izumi-blue-rgb);
	--btn-border-color-inverted-rgb: var(--btn-bg-color-inverted-rgb);
	--btn-text-color-inverted-rgb: 255 255 255;
	--btn-icon-color-inverted-rgb: var(--btn-text-color-inverted-rgb);
}

@media (max-width: 1023px) {

	.site-header-phone > .btn::after,
	.site-header-phone > .btn > .btn-label {
		display: none;
	}

	.site-header-phone > .btn > .btn-icon {
		margin: 0;
	}

	.site-header-phone > .btn {
		--btn-padding-y: .75em;
		--btn-padding-x: .75em;
		--btn-icon-size: 1.5em;
	}

/**/}


/*	LINEボタン
------------------------------------------------------------------------------*/

.site-header-line > .btn {
	--btn-bg-color-rgb: var(--color-line-rgb);
	--btn-border-color-rgb: var(--color-line-rgb);
	--btn-icon-gap: .25em;
}

@media (max-width: 1280px) {

	.site-header-line > .btn::after,
	.site-header-line > .btn > .btn-label {
		display: none;
	}

	.site-header-line > .btn > .btn-icon {
		margin: 0;
	}

	.site-header-line > .btn {
		--btn-padding-y: .75em;
		--btn-padding-x: .75em;
		--btn-icon-size: 1.5em;
	}

/**/}


/*	お問い合わせボタン
------------------------------------------------------------------------------*/

.site-header-contact > .btn {
	--btn-bg-color-rgb: var(--color-izumi-blue-rgb);
	--btn-border-color-rgb: var(--color-izumi-blue-rgb);
	--btn-icon-gap: .5em;
}


/*------------------------------------------------------------------------------

	グローバルメニュー

------------------------------------------------------------------------------*/


/*	リストコンテナー
------------------------------------------------------------------------------*/

.site-header-action {
	--action-text-color-rgb: var(--color-izumi-blue-rgb);
	/**/
	display: flex;
	/**/
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-header-action li {
	position: relative;
}


/*	リンクコンテナー
------------------------------------------------------------------------------*/

.site-header-action-link {
	display: flex;
	align-items: center;
	/**/
	position: relative;
	padding: var(--action-padding-y) var(--action-padding-x);
	background: rgb(var(--action-bg-color-rgb) / var(--action-bg-color-a));
	border: var(--action-border-width) solid rgb(var(--action-border-color-rgb) / var(--action-border-color-a));
	border-radius: var(--action-border-radius);
	line-height: var(--line-height);
	text-decoration: none;
	font-weight: bold;
	color: rgb(var(--action-text-color-rgb) / var(--action-text-color-a));
	fill: rgb(var(--action-text-color-rgb) / var(--action-text-color-a));
}


/*	アイコン
------------------------------------------------------------------------------*/

.site-header-action-icon {
	margin-top: -.125em;
	margin-bottom: -.125em;
}

.site-header-action-icon > svg {
	width: 1.25em;
	height: 1.25em;
}


/*	重要ボタン
------------------------------------------------------------------------------*/

.site-header-action-important > .site-header-action-link {
	--action-border-width: var(--action-important-border-width);
	--action-border-color-a: 1;
}


/*	親メニューボタンアロー
------------------------------------------------------------------------------*/

.site-header-action-parent > .site-header-action-link::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: calc(var(--action-border-width) * -1);
	width: 0;
	height: 0;
	border: calc(var(--submenu-margin) * .8) solid transparent;
	border-top-color: rgb(var(--action-bg-color-rgb) / var(--action-bg-color-a));
	transform: translateX(-50%) translateY(100%);
	opacity: 0;
}

.active > .site-header-action-link::after {
	opacity: 1;
}

.site-header-action-link,
.site-header-action-link::after {
	transition: background-color .2s ease-out,
	            border-color .2s ease-out,
	            opacity .2s ease-out;
}


/*	親メニュー
------------------------------------------------------------------------------*/

.site-header-action {
	visibility: hidden;
	transition: opacity .2s ease-out;
	opacity: 0;
	/**/
	align-items: center;
	justify-content: flex-end;
	/**/
	width: 100%;
	margin: 0 var(--gnav-padding-x) 0 auto;
}

@media (max-width: 1280px) {

	.site-header-action {
		margin-right: 1em;
	}

/**/}

.site-header-contact:not(.hidden) + .site-header-action {
	margin-left: 0;
}

.site-header-action.active {
	visibility: visible;
	opacity: 1;
}

.site-header-action-item {
	display: none;/* ※JSによって表示される */
	/**/
	margin: 0;
	padding: calc((var(--gnav-height) - var(--action-button-height)) / 2) var(--action-gap);
	/**/
	transition: padding var(--scrolled-transition-duration) ease-out;
}


/*	親メニューボタン
------------------------------------------------------------------------------*/

.current > .site-header-action-link {
	--action-bg-color-a: var(--action-current-color-a);
	--action-text-color-rgb: var(--action-current-color-rgb);
}

.site-header-action > .current > .site-header-action-link {
	opacity: .5;
}

/*【案形】*/

.site-header-action-link {
	--action-border-color-rgb: var(--action-text-color-rgb);/* 文字と同色 */
}

.site-header-action-important > .site-header-action-link {
	--action-border-color-a: 0;/* 強調表示をしない */
}

.site-header-action-parent > .site-header-action-link {
	--action-bg-color-rgb: var(--color-izumi-blue-rgb);
}

.site-header-action-parent {
	--submenu-bg-color-rgb: var(--color-izumi-darkblue-rgb);
	--submenu-border-color-rgb: var(--submenu-bg-color-rgb);
}

/**/

@media (any-hover: hover) {

	.site-header-action-item:not(.site-header-action-parent) > .site-header-action-link:hover {
		--action-border-color-a: 1;
	}

	.site-header-action-parent:not(.current):hover > .site-header-action-link,
	.site-header-action-parent:not(.current):hover > .site-header-action-link::after {
		--action-bg-color-a: .7;
		--action-border-color-a: 0;
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	.site-header-action-important > .site-header-action-link:hover {
		--action-bg-color-a: 1;
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	.current > .site-header-action-link:hover,
	.site-header-action-parent > .site-header-action-link:hover::after,
	.site-header-action-parent:hover > .site-header-action-link::after {
		opacity: 1;
	}

	/**/

	.site-header.white .site-header-action-important > .site-header-action-link:hover {
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	.scrolled .site-header.white .site-header-action-item > .site-header-action-link:hover {
		--action-text-color-a: 1;
	}

/**/}
@media (any-hover: none) {

	.site-header-action-item:not(.site-header-action-parent) > .site-header-action-link:active {
		--action-border-color-a: 1;
	}

	.site-header-action-parent:not(.current):active > .site-header-action-link,
	.site-header-action-parent:not(.current):active > .site-header-action-link::after,
	.site-header-action-link[aria-expanded="true"],
	.site-header-action-link[aria-expanded="true"]::after {
		--action-bg-color-a: .7;
		--action-border-color-a: 0;
	}

	.site-header-action-important > .site-header-action-link:active {
		--action-bg-color-a: 1;
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	.current > .site-header-action-link:active,
	.site-header-action-parent > .site-header-action-link:active::after,
	.site-header-action-parent:active > .site-header-action-link::after {
		opacity: 1;
	}

	.site-header-action-link[aria-expanded="true"] {
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	/**/

	.site-header.white .site-header-action-important > .site-header-action-link:active {
		--action-text-color-rgb: var(--action-current-color-rgb);
	}

	.scrolled .site-header.white .site-header-action-item > .site-header-action-link:active {
		--action-text-color-a: 1;
	}

/**/}


/*	SP
------------------------------------------------------------------------------*/

@media (max-width: 720px) {

	.site-header-action {
		margin-left: auto;
		margin-right: 0;
	}

	/**/

	/* スマホ時表示ボタン */

	.site-header-action .site-header-sp-button {
		--btn_padding: calc(var(--gnav-padding-y) - var(--action-border-width));
		--btn_content_height: calc(var(--gnav-height) - var(--btn_padding) * 2);
		/**/
		min-width: var(--gnav-height);
		height: var(--gnav-height);
		padding: 0;
	}

	.site-header-action .site-header-sp-button > .site-header-action-link {
		display: flex;
		align-items: center;
		justify-content: center;
		/**/
		margin: 0;
		padding: var(--btn_padding);
		border-radius: 0;
	}

	.site-header-action .site-header-sp-button > .site-header-action-link > .site-header-action-label {
		display: none;
	}

	/**/

	.site-header-action-icon {
		margin: 0 !important;
	}

	.site-header-action-icon > svg {
		min-width: var(--btn_content_height);
		height: var(--btn_content_height);
	}

/**/}


/*------------------------------------------------------------------------------

	サブメニュー

------------------------------------------------------------------------------*/


/*	サブメニュー親コンテナ
------------------------------------------------------------------------------*/

.site-header-action-child {
	visibility: hidden;
	opacity: 0;
	margin-top: calc(var(--submenu-margin) + .5em);
	transition: opacity .2s ease-out, margin .2s ease-out;
	/**/
	position: absolute;
	left: 50%;
	max-width: calc(100% + 9em);/* サブメニューの最大幅 */
	transform: translateX(-50%);
	/**/
	display: flex;
	flex-direction: column;
	/**/
	list-style: none;
	margin: 0;
	padding: var(--submenu-padding);
	background: rgb(var(--submenu-bg-color-rgb) / var(--submenu-bg-color-a));
	border: var(--submenu-border-width) solid rgb(var(--submenu-border-color-rgb) / var(--submenu-border-color-a));
	border-radius: var(--submenu-border-radius);
	box-shadow: 0 0 1px rgb(0 0 0 / .1),
	            0 .125em .5em rgb(0 0 0 / .1);
	font-size: 90%;
	/**/
	-webkit-backdrop-filter: blur(9px);
	backdrop-filter: blur(9px);
}

.site-header-column-action-child {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* タッチ対応調整 */
.site-header-action-item.active > .site-header-action-child {
	visibility: visible;
	opacity: 1;
	margin-top: var(--submenu-margin);
}

/**/

@media (any-hover: hover) {

	.site-header-action-item:hover > .site-header-action-child {
		visibility: visible;
		opacity: 1;
		margin-top: var(--submenu-margin);
	}

/**/}


/*	コラム対応
------------------------------------------------------------------------------*/

.site-header-action-child.services-columns {
	position: absolute;
	left: 50%;
	max-width: initial;
	width: 18em;
	padding: .75em;
	transform: translateX(-50%);
}

.site-header-action-column + .site-header-action-column {
	margin-top: calc(.5em / .75);
}

.site-header-column-title {
	display: flex;
	align-items: baseline;
	/**/
	position: relative;
	margin: 0 0 calc(.5em / .75);
	white-space: nowrap;
	font-size: 75%;
	color: rgb(var(--color-izumi-yellow-rgb));
}

.site-header-column-title::after {
	content: '';
	flex: 1;
	width: 100%;
	height: 1px;
	margin: 0 0 0 .25em;
	background: rgb(var(--color-izumi-yellow-rgb) / .5);
}

.site-header-action-column .site-header-column-action-child {
	--cols: 2;
	--gap: .5em;
	--w: calc((100% - var(--gap) * (var(--cols) - 1)) / var(--cols));
	/**/
	display: grid;
	grid-template-columns: var(--w) var(--w);
	grid-gap: .5em;
}

.site-header-action-column .site-header-column-action-child .site-header-action-childitem {
	margin: 0;
}


/*	サブメニューコンテナ
------------------------------------------------------------------------------*/

.site-header-action-childitem + .site-header-action-childitem {
	margin-top: var(--submenu-item-gap);
}


/*	サブメニューボタン
------------------------------------------------------------------------------*/

.site-header-action-child .site-header-action-link {
	--action-bg-color-rgb: var(--submenu-text-color-rgb);
	--action-border-color-rgb: var(--submenu-text-color-rgb);
	--action-border-color-a: .2;
	/**/
	color: rgb(var(--submenu-text-color-rgb) / var(--submenu-text-color-a, 1));
	fill: rgb(var(--submenu-text-color-rgb) / var(--submenu-text-color-a, 1));
}

.site-header-action-child .current .site-header-action-link {
	--action-bg-color-a: 1;
	/**/
	/*pointer-events: none;/* サブのサブメニューは作らない前提 */
	color: rgb(var(--submenu-bg-color-rgb) / var(--submenu-bg-color-a, 1));
}

.site-header-action-child .site-header-action-link.has-icon {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.site-header-action-child .site-header-action-link.has-icon .site-header-action-icon {
	order: 1;
	flex: none;
	margin: 0 .25em 0 0;
}

.site-header-action-child .site-header-action-link.has-icon .site-header-action-icon svg {
	display: block;
	width: 1em;
	height: calc(var(--line-height) * 1em);
	object-fit: contain;
	object-position: center center;
}

.site-header-action-child .site-header-action-link.has-icon .site-header-action-label {
	order: 2;
	flex: 1;
}


@media (any-hover: hover) {

	.site-header-action-child li:not(.current) .site-header-action-link:hover {
		--action-bg-color-a: .2;
		--action-border-color-a: 1;
	}

/**/}
@media (any-hover: none) {

	.site-header-action-child li:not(.current) .site-header-action-link:active {
		--action-bg-color-a: .2;
		--action-border-color-a: 1;
	}

/**/}


/*------------------------------------------------------------------------------

	メニューボタン

------------------------------------------------------------------------------*/


/*	親コンテナー
------------------------------------------------------------------------------*/

.menu-button {
	flex: none;
	/**/
	display: flex;
	align-items: center;
	justify-content: center;
	/**/
	overflow: hidden;
	position: relative;
	margin: 0 var(--menu-margin-right, 0px) 0 0;
	padding: var(--menu-padding) calc(var(--menu-padding) - var(--btn-border-width));
	min-width: calc(var(--menu-icon-width) + var(--menu-padding) * 2);
	height: var(--menu-height);
	background: rgb(var(--menu-bg-color-rgb) / var(--menu-bg-color-a, 1));
	border: var(--btn-border-width) solid rgb(var(--menu-border-color-rgb) / var(--menu-border-color-a, 1));
	border-radius: var(--menu-border-radius, 0px);
	line-height: 1;
	font-family: var(--btn-font-family);
	color: rgb(var(--menu-text-color-rgb) / var(--menu-text-color-a, 1));
	fill: rgb(var(--menu-text-color-rgb) / var(--menu-text-color-a, 1));
	/**/
	opacity: 0;
	transition: opacity .2s ease-out,
	            background-color .2s ease-out,
	            margin .2s ease-out;
}

.menu-button.active {
	opacity: 1;
}

/* 表示幅指定 */
.menu-button.mobile-only {
	display: none;
}


/*	アイコン
------------------------------------------------------------------------------*/

.menu-button-icon {
	position: relative;
	display: block;
	width: var(--menu-icon-width);
	height: var(--menu-icon-height);
	transition: all .2s ease-out;
}

.menu-button-icon svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}


/*	ラベル
------------------------------------------------------------------------------*/

.menu-button-label {
	display: none;
	/**/
	flex: none;
	margin: 0 0 0 1em;
	padding: 0;
	font-weight: bold;
}

@media (min-width: 1281px) {

	.menu-button[data-show-label="true"] > .menu-button-label {
		display: block;
	}

/**/}
@media (max-width: 1280px) {

	.menu-button {
		--menu-width: var(--menu-height);
	}

/**/}
@media (max-width: 720px) {

	.menu-button.mobile-only.active {
		display: flex;
	}

/**/}


/*	アイコン
------------------------------------------------------------------------------*/

.menu-button-icon.burger::before,
.menu-button-icon.burger::after,
.menu-button-icon.burger > span {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: var(--menu-icon-width);
	height: var(--menu-burger-width);
	background: rgb(var(--menu-text-color-rgb) / var(--menu-text-color-a, 1));
	transform: translateX(-50%) translateY(-50%);
}

.menu-button-icon.burger::before {
	margin-top: calc(var(--menu-icon-height) / -2);
	transform: translateX(-50%);
}

.menu-button-icon.burger::after {
	margin-top: calc(var(--menu-icon-height) / 2 - var(--menu-burger-width));
	transform: translateX(-50%);
}


/*	HOVER
------------------------------------------------------------------------------*/

@media (any-hover: hover) {

	.menu-button:hover {
		--menu-bg-color-a: .7;
		/**/
		cursor: pointer;
	}

/**/}
@media (any-hover: none) {

	.menu-button:active {
		--menu-bg-color-a: .7;
	}

/**/}


/*【案件】
------------------------------------------------------------------------------*/

.menu-button {
	--menu-margin-right: var(--gnav-menu-start-margin, var(--gnav-menu-margin));/* --gnav-menu-start-margin: 右マージン変えない */
	--menu-border-radius: .25em;
	/**/
	--menu-bg-color-rgb: var(--color-izumi-blue-rgb);
	--menu-bg-color-a: 0;
	--menu-border-color-rgb: var(--color-izumi-blue-rgb);
	--menu-border-color-a: 1;
	--menu-text-color-rgb: var(--color-izumi-blue-rgb);
	/**/
	--gmenu-button-right: var(--menu-margin-right);
	--gmenu-button-top: var(--menu-margin-right);
}

@media (any-hover: hover) {

	.menu-button:hover {
		--menu-bg-color-a: 1;
		--menu-text-color-rgb: 255 255 255;
	}

/**/}
@media (any-hover: none) {

	.menu-button:active {
		--menu-bg-color-a: 1;
		--menu-text-color-rgb: 255 255 255;
	}

/**/}