@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
/* =============================================================================
   コーポレート（プロシーズ）ヘッダー　共通パーツ
   -----------------------------------------------------------------------------
   learningware の上段ヘッダー（src/sass/_layout/_corpheader.scss）を、
   どのサイトにも差し込めるように作り直したもの。使い方は README.md。

   learningware 版との違い
   - 単位は px。サイトごとに html の font-size が違っても崩れないようにしている
     （learningware は 1rem=10px、SPは vw 換算。こちらは PC/SP とも設計値の px 固定）
   - ホバーの判定は html.notouch ではなく @media (hover: hover)
   - サイト側のリセットCSS（div や p への font-size 指定など）に負けないよう、
     冒頭で .corpHeader 配下の要素を打ち消している
   - .pc-hidden / .en などサイト共通のユーティリティには頼らず、
     .corpHeader_spOnly / .corpHeader_nav_dropdownTtlTxt で完結させている

   サイトから触ってよい CSS 変数
   --corpHeader-z      : 重なり順。サイトの固定ヘッダーより上にしたいときに上げる（既定 100）
   --corpHeader-height : バーの高さ（読み取り用。サイト側の余白計算に使う）
   --corp-offset       : スクロールで流れたバーの量(px)。JS が :root に書き込む
============================================================================= */
:root {
	--corpHeader-height: 50px;
	--corp-offset: 0px;
}

/* SPに切り替える幅は 1199px（learningware と同じ）。
   JS の SP_QUERY と必ず揃えること */

/* -----------------------------------------------------------------------------
   サイト側のCSSの打ち消し
----------------------------------------------------------------------------- */
.corpHeader,
.corpHeader *,
.corpHeader *::before,
.corpHeader *::after {
	box-sizing: border-box;
}
.corpHeader :where(div, p, ul, li, a, span, nav, button) {
	margin: 0;
	padding: 0;
	border: none;
	list-style: none;
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-align: inherit;
	text-decoration: none;
	background: none;
	opacity: 1;
}
.corpHeader a:hover,
.corpHeader button:hover {
	opacity: 1;
}

/* -----------------------------------------------------------------------------
   .corpHeader
----------------------------------------------------------------------------- */
.corpHeader {
	/* 追従させない。スクロールでそのまま流れる。
	   通常フローに置くので、サイトのコンテンツは自動でバーの高さぶん下がる */
	position: relative;
	z-index: var(--corpHeader-z, 100);
	width: 100%;
	height: var(--corpHeader-height);
	color: #222530;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.72;
	letter-spacing: 0.02em;
	text-align: left;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
/* バーの地とブラーは ::before に持たせる。.corpHeader 自身に backdrop-filter を
   付けると子（::after の暗幕）の backdrop-filter が背面を拾えなくなる */
.corpHeader::before {
	content: "";
	display: block;
	position: absolute;
	inset: 0;
	z-index: 1;
	border-bottom: 1px solid #e7e7e7;
	background: rgba(255, 255, 255, 0.8);
	-webkit-backdrop-filter: blur(7px);
	backdrop-filter: blur(7px);
}
/* メガメニューを開いている間の暗幕。画面全体にかける */
.corpHeader::after {
	content: "";
	display: block;
	position: fixed;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.2);
	-webkit-backdrop-filter: blur(25px);
	backdrop-filter: blur(25px);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.5s cubic-bezier(0.4, 0, 0, 1);
}
html.corpNav-open .corpHeader::after {
	opacity: 1;
}
.corpHeader_inner {
	position: relative;
	z-index: 2;
	height: 100%;
}

/* -----------------------------------------------------------------------------
   ロゴ
----------------------------------------------------------------------------- */
.corpHeader_logo {
	position: absolute;
	left: 14.09px;
	top: 5.86px;
	width: 146.66px;
}
.corpHeader_logo a {
	display: block;
}
.corpHeader_logo svg {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 184.879 / 45.383;
}

/* -----------------------------------------------------------------------------
   ナビ（PC: バー中央 / SP: ハンバーガーで開くドロワー）
----------------------------------------------------------------------------- */
.corpHeader_nav {
	position: absolute;
	top: 0;
	height: 100%;
	/* transform で中央寄せしないこと。transform を持つと position:fixed の基準になり、
	   中のメガメニューを画面中央に出せなくなる。left を 41px にすると中心が
	   画面中央 +20.5px になる（設計値） */
	left: 41px;
	right: 0;
	margin: 0 auto;
	width: max-content;
}
.corpHeader_nav_wrap,
.corpHeader_nav_inner {
	height: 100%;
}
.corpHeader_nav_menu {
	position: relative;
	display: flex;
	height: 100%;
}
/* セーフトライアングル。
   カーソルとメガメニュー上辺で三角形を作り、斜めに動かす間だけ隣の項目に
   ホバーが渡らないよう覆う。矩形の位置と大きさは JS が CSS変数で渡す。
   参考: https://ics.media/entry/260803/ */
.corpHeader_nav_menuItem.has-dropdown.is-safearea::before {
	content: "";
	display: block;
	position: fixed;
	z-index: 2;
	left: var(--safe-left, 0);
	top: var(--safe-top, 0);
	width: var(--safe-width, 0);
	height: var(--safe-height, 0);
	--safe-inset: 10%;
	clip-path: polygon(
		var(--safe-x, 50%) 0,
		var(--safe-inset) 100%,
		calc(100% - var(--safe-inset)) 100%
	);
}
.corpHeader_nav_menuItem.is-open .corpHeader_nav_menuItemLabel {
	z-index: 3;
}
/* ホバー中の項目を示す黄色い線（バーの上端）。位置と幅は JS が渡す */
.corpHeader_nav_menu_line {
	position: absolute;
	left: 0;
	top: 0;
	height: 2px;
	background: #fad134;
	pointer-events: none;
	transform: translateX(calc(var(--line-left, 0) * 1px + 8px));
	width: calc(var(--line-width, 0) * 1px - 16px);
	opacity: 0;
	transition: opacity 0.5s cubic-bezier(0.4, 0, 0, 1), transform 0.5s cubic-bezier(0.4, 0, 0, 1), width 0.5s cubic-bezier(0.4, 0, 0, 1);
}
.corpHeader_nav_menu_line.is-visible {
	opacity: 1;
}
.corpHeader_nav_menuItemLabel {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 8px;
	color: #222530;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
	white-space: nowrap;
	position: relative;
	z-index: 1;
	transition: color 0.5s cubic-bezier(0.4, 0, 0, 1);
}
@media (hover: hover) {
	.corpHeader_nav_menuItemLabel:hover {
		color: #152754;
	}
}
/* メガメニューの吹き出し（▲）。ラベルの下、パネルの上辺に食い込ませる */
.corpHeader_nav_menuItemLabel::before {
	content: "";
	display: block;
	position: absolute;
	bottom: -28px;
	left: calc(50% - 12.816px);
	width: 25.632px;
	height: 15.473px;
	background: #ffffff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25.632 15.473'%3E%3Cpath d='M0 15.473 12.812 0l12.82 15.464H.008L0 15.472Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25.632 15.473'%3E%3Cpath d='M0 15.473 12.812 0l12.82 15.464H.008L0 15.472Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	transition: visibility 0.5s cubic-bezier(0.4, 0, 0, 1), opacity 0.5s cubic-bezier(0.4, 0, 0, 1), bottom 0.5s cubic-bezier(0.4, 0, 0, 1);
	visibility: hidden;
	opacity: 0;
}
.corpHeader_nav_menuItem.is-open .corpHeader_nav_menuItemLabel::before {
	visibility: visible;
	opacity: 1;
	bottom: -19px;
}
/* SPのアコーディオン開閉アイコン（PCでは出さない） */
.corpHeader_nav_menuItemIcon {
	display: none;
}

/* メガメニュー本体。
   基準の .corpHeader_nav_menu はナビ幅しかないので、画面中央に出すため fixed にしている */
.corpHeader_nav_dropdownInner {
	position: fixed;
	top: 10px;
	left: 0;
	right: 0;
	width: 100vw;
	/* バー(50px) ＋ 吹き出しぶんの隙間(15px) */
	padding-top: calc(var(--corpHeader-height) + 15px);
	margin: 0 auto;
	overflow: hidden;
	transition: visibility 0.5s cubic-bezier(0.4, 0, 0, 1), opacity 0.5s cubic-bezier(0.4, 0, 0, 1), top 0.5s cubic-bezier(0.4, 0, 0, 1);
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}
.corpHeader_nav_menuItem.is-open .corpHeader_nav_dropdownInner {
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	top: 0;
}
.corpHeader_nav_dropdownContainer {
	max-width: 1060px;
	margin: 0 auto;
	padding: 48px 40px;
	position: relative;
	display: flex;
	align-items: center;
	column-gap: 24px;
	border-radius: 8px;
	background: #ffffff;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
}
.corpHeader_nav_dropdownTtl {
	flex-shrink: 0;
	width: 320px;
	position: relative;
	top: -5px;
}
.corpHeader_nav_dropdownTtlLink {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.corpHeader_nav_dropdownTtlLinkJp {
	position: relative;
	padding-left: 23px;
	color: #222530;
	font-size: 13px;
	font-weight: 700;
}
.corpHeader_nav_dropdownTtlLinkJp::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 3.5px;
	width: 16px;
	height: 16px;
	background: #fad134;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.22 12.67'%3E%3Cpath d='M8.96 0H5.85s.18 3.87.21 4.76C5.14 4.48.8 3.15.8 3.15L0 6.23l5 1.13c-.62.75-3.14 3.85-3.14 3.85l3.04 1.46 2.75-3.59c.53.71 2.65 3.59 2.65 3.59l3.04-1.46-3.1-3.85 4.98-1.14-.86-3.07S10.1 4.48 9.18 4.76L9.39 0h-.44.01Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.22 12.67'%3E%3Cpath d='M8.96 0H5.85s.18 3.87.21 4.76C5.14 4.48.8 3.15.8 3.15L0 6.23l5 1.13c-.62.75-3.14 3.85-3.14 3.85l3.04 1.46 2.75-3.59c.53.71 2.65 3.59 2.65 3.59l3.04-1.46-3.1-3.85 4.98-1.14-.86-3.07S10.1 4.48 9.18 4.76L9.39 0h-.44.01Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}
.corpHeader_nav_dropdownTtlLinkEn {
	display: flex;
	align-items: center;
	gap: 12px;
}
.corpHeader_nav_dropdownTtlTxt {
	color: #152754;
	font-family: 'Poppins', 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
}
.corpHeader_nav_dropdownBody {
	flex-grow: 1;
}
.corpHeader_nav_dropdownList {
	letter-spacing: 0;
}
.corpHeader_nav_dropdownList ul {
	margin-top: -20px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 40px;
	width: 100%;
}
.corpHeader_nav_dropdownList a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 0;
	border-bottom: 1px solid #e7e7e7;
	color: #222530;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
	transition: color 0.5s cubic-bezier(0.4, 0, 0, 1);
}
/* ホバーで紺の線が左から入り、外すと右へ抜ける */
.corpHeader_nav_dropdownList a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 1px;
	background: #152754;
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0, 1);
}
@media (hover: hover) {
	.corpHeader_nav_dropdownList a:hover {
		color: #152754;
	}
	.corpHeader_nav_dropdownList a:hover::after {
		transform: scaleX(1);
		transform-origin: left center;
	}
}
.corpHeader_nav_dropdownList a .corpHeader_arw {
	padding-left: 20px;
}

/* SPドロワーにだけ出す項目（ホーム / 〜トップ） */
.corpHeader_spOnly {
	display: none;
}

/* -----------------------------------------------------------------------------
   矢印アイコン（本家 pro-seeds の .l_arw_moveIcon 相当）
----------------------------------------------------------------------------- */
@keyframes corpHeader_arw_r {
	0%, 100% { opacity: 1; transform: translateX(0); }
	50%      { opacity: 0; transform: translateX(5px); }
	50.1%    { opacity: 0; transform: translateX(-5px); }
}
.corpHeader_arw {
	position: relative;
	display: block;
	flex-shrink: 0;
	transform: rotate(45deg);
}
.corpHeader_arw::after {
	content: "";
	display: block;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #152754;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11.426 8.971'%3E%3Cpath d='M11.426 4.484 6.01 0h.001l.003.004v3.177H0v2.605h6.014v3.185l5.412-4.487z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11.426 8.971'%3E%3Cpath d='M11.426 4.484 6.01 0h.001l.003.004v3.177H0v2.605h6.014v3.185l5.412-4.487z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	transition: background 0.5s cubic-bezier(0.4, 0, 0, 1);
}
.corpHeader_arw.__circle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid #152754;
	border-radius: 50%;
	transition: border 0.5s cubic-bezier(0.4, 0, 0, 1), background 0.5s cubic-bezier(0.4, 0, 0, 1);
}
.corpHeader_arw.__circle::after {
	position: relative;
	top: 1px;
}
@media (hover: hover) {
	.corpHeader a:hover .corpHeader_arw.__circle {
		background: #152754;
	}
	.corpHeader a:hover .corpHeader_arw.__circle::after {
		background: #fad134;
	}
	/* ホバーで進行方向へ抜けて反対から戻る */
	.corpHeader a:hover .corpHeader_arw::after {
		animation: corpHeader_arw_r 0.75s cubic-bezier(0.4, 0, 0, 1) 0s;
	}
}

/* -----------------------------------------------------------------------------
   CVボタン（資料DL / お問い合わせ）。150x50 の角ばったボタンがバー右端に付く
----------------------------------------------------------------------------- */
.corpHeader_cv {
	position: absolute;
	right: 0;
	top: 0;
	display: flex;
	height: 100%;
}
.corpHeader_cv_btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 150px;
	height: 100%;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	overflow: hidden;
	isolation: isolate;
}
.corpHeader_cv_btn.__dl {
	color: #ffffff;
	background: #152754;
}
.corpHeader_cv_btn.__mail {
	color: #152754;
	background: #fad134;
}
.corpHeader_cv_btnIcon {
	display: block;
	flex-shrink: 0;
}
.__dl .corpHeader_cv_btnIcon {
	position: relative;
	top: -1px;
	width: 13.315px;
	height: 14.466px;
	background: #ffffff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.315 14.466'%3E%3Cpath d='M6.493 11.224c.045.045.105.067.165.067s.119-.022.165-.068l3.903-3.903a.238.238 0 0 0-.002-.332l-.892-.872c-.066-.065-.167-.083-.271-.038L7.515 8.107V.233A.233.233 0 0 0 7.282 0H6.036a.233.233 0 0 0-.234.233v7.875l-1.99-1.99c-.066-.065-.165-.084-.271-.041l-.947.911a.235.235 0 0 0-.002.333l3.902 3.903Z'/%3E%3Cpath d='M13.083 11.01h-1.247a.232.232 0 0 0-.232.232v1.449c0 .012-.016.028-.024.038a.043.043 0 0 0-.007.006c-.009.009-.021.019-.031.019H1.775c-.012 0-.029-.016-.038-.024-.016-.016-.024-.029-.024-.038v-1.449a.233.233 0 0 0-.234-.232H.233a.233.233 0 0 0-.233.232v1.449c0 .493.172.917.511 1.259.34.343.763.516 1.257.516h9.771c.495 0 .919-.173 1.261-.515.342-.343.515-.767.515-1.26v-1.449a.232.232 0 0 0-.232-.232Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.315 14.466'%3E%3Cpath d='M6.493 11.224c.045.045.105.067.165.067s.119-.022.165-.068l3.903-3.903a.238.238 0 0 0-.002-.332l-.892-.872c-.066-.065-.167-.083-.271-.038L7.515 8.107V.233A.233.233 0 0 0 7.282 0H6.036a.233.233 0 0 0-.234.233v7.875l-1.99-1.99c-.066-.065-.165-.084-.271-.041l-.947.911a.235.235 0 0 0-.002.333l3.902 3.903Z'/%3E%3Cpath d='M13.083 11.01h-1.247a.232.232 0 0 0-.232.232v1.449c0 .012-.016.028-.024.038a.043.043 0 0 0-.007.006c-.009.009-.021.019-.031.019H1.775c-.012 0-.029-.016-.038-.024-.016-.016-.024-.029-.024-.038v-1.449a.233.233 0 0 0-.234-.232H.233a.233.233 0 0 0-.233.232v1.449c0 .493.172.917.511 1.259.34.343.763.516 1.257.516h9.771c.495 0 .919-.173 1.261-.515.342-.343.515-.767.515-1.26v-1.449a.232.232 0 0 0-.232-.232Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}
.__mail .corpHeader_cv_btnIcon {
	width: 15.199px;
	height: 11.244px;
	background: #152754;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.199 11.244'%3E%3Cpath d='M14.786.414A1.38 1.38 0 0 0 13.774 0H1.425C1.028 0 .687.138.413.41A1.373 1.373 0 0 0 0 1.419v8.399c0 .396.139.736.413 1.012s.615.414 1.012.414h12.35a1.39 1.39 0 0 0 1.012-.41 1.37 1.37 0 0 0 .413-1.009V1.426c0-.397-.139-.737-.413-1.012ZM7.6 4.743 1.666 1.271h11.867L7.599 4.743ZM1.271 2.637 7.55 6.332l.05.029 6.329-3.724v7.182a.15.15 0 0 1-.042.112.15.15 0 0 1-.112.042H1.425a.149.149 0 0 1-.108-.038l-.021-.026a.161.161 0 0 1-.024-.09V2.637Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.199 11.244'%3E%3Cpath d='M14.786.414A1.38 1.38 0 0 0 13.774 0H1.425C1.028 0 .687.138.413.41A1.373 1.373 0 0 0 0 1.419v8.399c0 .396.139.736.413 1.012s.615.414 1.012.414h12.35a1.39 1.39 0 0 0 1.012-.41 1.37 1.37 0 0 0 .413-1.009V1.426c0-.397-.139-.737-.413-1.012ZM7.6 4.743 1.666 1.271h11.867L7.599 4.743ZM1.271 2.637 7.55 6.332l.05.029 6.329-3.724v7.182a.15.15 0 0 1-.042.112.15.15 0 0 1-.112.042H1.425a.149.149 0 0 1-.108-.038l-.021-.026a.161.161 0 0 1-.024-.09V2.637Z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}
/* ホバーで文字が縦に回転して入れ替わる。回すのは内側の span だけ */
.corpHeader_cv_btnTxt {
	position: relative;
	top: -1px;
	display: block;
}
.corpHeader_cv_btnTxt > span {
	display: block;
	opacity: 1;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform-origin: 50% 50% 0.7em;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0, 1), opacity 0.5s cubic-bezier(0.4, 0, 0, 1);
}
.corpHeader_cv_btnTxt::after {
	content: attr(data-txt);
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	white-space: nowrap;
	opacity: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: rotateX(-90deg);
	transform-origin: 50% 50% 0.7em;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0, 1), opacity 0.5s cubic-bezier(0.4, 0, 0, 1);
}
@media (hover: hover) {
	.corpHeader_cv_btn:hover .corpHeader_cv_btnTxt > span {
		opacity: 0;
		transform: rotateX(90deg);
	}
	.corpHeader_cv_btn:hover .corpHeader_cv_btnTxt::after {
		opacity: 1;
		transform: rotateX(0);
	}
}
.corpHeader_cv_btnArw {
	position: absolute;
	right: 3px;
	bottom: 3px;
}
.__dl .corpHeader_cv_btnArw .corpHeader_arw::after {
	background: #fad134;
}

/* -----------------------------------------------------------------------------
   ハンバーガー（SPのみ）
----------------------------------------------------------------------------- */
.corpHeader_menu {
	display: none;
}

/* =============================================================================
   PC 狭め：中央寄せだと右端のCVボタン(300px)にナビが潜り込むので左寄せにする。
   左端はロゴ（右端 約161px）に被らない位置。

   中央寄せが成立するのはレイアウト幅 約1346px 以上（ナビ幅 約665px のとき）。
   メディアクエリはスクロールバー込みの幅で判定されるので余裕を見て 1365px にしている。
   メニュー項目を増やしたらナビ幅が変わるので、この値も測り直すこと。
   左寄せ時は 1200px でもナビ右端 845px < CVボタン左端 900px で収まる
============================================================================= */
@media only screen and (max-width: 1365px) {
	.corpHeader_nav {
		left: 180px;
		right: auto;
		margin: 0;
	}
}

/* =============================================================================
   SP（1199px 以下）
============================================================================= */
@media only screen and (max-width: 1199px) {
	/* SPは透過せずベタ白。メガメニューを開かないので暗幕も出さない */
	.corpHeader::before {
		background: #ffffff;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	.corpHeader::after {
		display: none;
	}

	.corpHeader_logo {
		left: 15px;
		top: 11px;
		width: 114.07px;
		/* ドロワーより上に置き、開いている間もロゴを残す */
		z-index: 2;
	}

	.corpHeader_nav {
		position: fixed;
		inset: 0;
		width: 100%;
		height: auto;
		margin: 0;
		/* フロストガラス（白50% + blur20px） */
		background: rgba(255, 255, 255, 0.5);
		-webkit-backdrop-filter: blur(20px);
		backdrop-filter: blur(20px);
		transition: opacity 0.5s cubic-bezier(0.4, 0, 0, 1), visibility 0.5s cubic-bezier(0.4, 0, 0, 1);
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
	}
	html.corpDrawer-open .corpHeader_nav {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
	}
	.corpHeader_nav_wrap {
		position: relative;
		z-index: 1;
		display: block;
		height: 100%;
		overflow: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.corpHeader_nav_inner {
		height: auto;
		/* バーぶん下げて始める */
		margin: calc(var(--corpHeader-height) + 20px) 20px 80px;
		padding: 8px 20px 24px;
		background: #ffffff;
		border-radius: 8px;
	}
	.corpHeader_nav_menu {
		display: block;
		height: auto;
	}
	.corpHeader_nav_menuItem {
		border-bottom: 1px solid #e7e7e7;
	}
	.corpHeader_nav_menu_line {
		display: none;
	}
	.corpHeader_nav_menuItemLabel {
		justify-content: space-between;
		height: auto;
		padding: 24px 0;
		font-size: 13px;
	}
	.corpHeader_nav_menuItem.has-dropdown .corpHeader_nav_menuItemLabel {
		padding-right: 12.5px;
	}
	.corpHeader_nav_menuItemLabel::before {
		display: none;
	}
	/* 11×11・線幅1.222の＋。開いたら − になる */
	.corpHeader_nav_menuItemIcon {
		display: block;
		position: relative;
		flex-shrink: 0;
		width: 11px;
		height: 11px;
	}
	.corpHeader_nav_menuItemIcon::before,
	.corpHeader_nav_menuItemIcon::after {
		content: "";
		position: absolute;
		top: calc(50% - 0.61px);
		left: 0;
		width: 11px;
		height: 1.222px;
		background: #152754;
		transition: transform 0.5s cubic-bezier(0.4, 0, 0, 1);
	}
	.corpHeader_nav_menuItemIcon::after {
		transform: rotate(90deg);
	}
	.corpHeader_nav_menuItem.is-open .corpHeader_nav_menuItemIcon::after {
		transform: rotate(0);
	}

	/* アコーディオン。grid-template-rows で高さを 0fr→1fr にする */
	.corpHeader_nav_dropdownInner {
		position: static;
		display: grid;
		grid-template-rows: 0fr;
		width: auto;
		padding-top: 0;
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
		transition: grid-template-rows 0.5s cubic-bezier(0.4, 0, 0, 1);
	}
	.corpHeader_nav_menuItem.is-open .corpHeader_nav_dropdownInner {
		grid-template-rows: 1fr;
	}
	.corpHeader_nav_dropdownContainer {
		display: block;
		min-height: 0; /* grid の 0fr を効かせるために必要 */
		overflow: hidden;
		/* PC用の中央寄せを必ず打ち消す。残っていると幅が縮んでサブ項目が右にずれる */
		max-width: none;
		margin: 0;
		padding: 0;
		border-radius: 0;
		box-shadow: none;
	}
	.corpHeader_nav_dropdownTtl {
		display: none;
	}
	.corpHeader_nav_dropdownList ul {
		display: flex;
		flex-direction: column;
		gap: 16px;
		margin-top: 0;
		padding: 0 0 24px;
	}
	.corpHeader_nav_dropdownList a {
		display: block;
		padding: 0 0 0 14px; /* 行頭「・」ぶんの字下げ */
		border-bottom: none;
		font-size: 13px;
		opacity: 0.7;
	}
	.corpHeader_nav_dropdownList a::after {
		display: none;
	}
	.corpHeader_nav_dropdownList a::before {
		content: "・";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		line-height: 1;
	}
	.corpHeader_nav_dropdownList a .corpHeader_arw {
		display: none;
	}

	.corpHeader_spOnly {
		display: block;
	}

	/* CVボタンは上段バーには出さない（設計。サイト側のCVを使う） */
	.corpHeader_cv {
		display: none;
	}

	/* ハンバーガー。閉じているとき 20x2 の線3本、開いたら紺の丸に白い× */
	.corpHeader_menu {
		display: block;
		position: absolute;
		right: 5px;
		top: 5px;
		z-index: 2;
		width: 40px;
		height: 40px;
		padding: 0;
		margin: 0;
		border: none;
		border-radius: 50%;
		background: transparent;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transition: background 0.5s cubic-bezier(0.4, 0, 0, 1);
	}
	html.corpDrawer-open .corpHeader_menu {
		background: #152754;
	}
	.corpHeader_menu_inner {
		display: block;
		position: absolute;
		inset: 0;
	}
	.corpHeader_menu_inner .line {
		position: absolute;
		left: calc(50% - 10px);
		width: 20px;
		height: 2px;
		background: #152754;
		transition: top 0.25s cubic-bezier(0.4, 0, 0, 1), left 0.25s cubic-bezier(0.4, 0, 0, 1), opacity 0.25s cubic-bezier(0.4, 0, 0, 1), transform 0.25s cubic-bezier(0.4, 0, 0, 1), background 0.25s cubic-bezier(0.4, 0, 0, 1);
	}
	html.corpDrawer-open .corpHeader_menu_inner .line {
		background: #ffffff;
	}
	/* 上の線。開くと右へ流れて消える */
	.corpHeader_menu_inner .line.__1 {
		top: calc(50% - 7px);
	}
	html.corpDrawer-open .corpHeader_menu_inner .line.__1 {
		transform: translateX(30%);
		opacity: 0;
	}
	/* 中央の線。× の1本目になる */
	.corpHeader_menu_inner .line.__2 {
		top: calc(50% - 1px);
	}
	html.corpDrawer-open .corpHeader_menu_inner .line.__2 {
		transform: rotate(-45deg);
	}
	/* 閉じている間は透明。開くと × の2本目として出てくる */
	.corpHeader_menu_inner .line.__3 {
		top: calc(50% - 1px);
		opacity: 0;
	}
	html.corpDrawer-open .corpHeader_menu_inner .line.__3 {
		transform: rotate(45deg);
		opacity: 1;
	}
	/* 下の線。開くと左へ流れて消える */
	.corpHeader_menu_inner .line.__4 {
		top: calc(50% + 5px);
	}
	html.corpDrawer-open .corpHeader_menu_inner .line.__4 {
		transform: translateX(-30%);
		opacity: 0;
	}

	/* ドロワーを開いている間は背面をスクロールさせない */
	html.corpDrawer-open,
	html.corpDrawer-open body {
		overflow: hidden;
	}
}
