#header, #fix_header{
	box-shadow: none;
	background: transparent;
}
.l-fixHeader:before{
	content: none;
}

@media not all and (min-width: 960px){
	#header .l-header__inner{
		padding-left: 4vw;
	}
}

@media (min-width: 960px){
	#header .l-container,
	#fix_header .l-container{
		--container_size: 100%;
	}

	#header .l-header__inner, 
	#fix_header .l-fixHeader__inner{
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		margin-right: 0;
		padding-left: 0;
		padding-right: 0;
	}
	#header .l-header__inner{
		grid-template-rows: repeat(2, 1fr);
	}
	#fix_header .l-fixHeader__inner{
		grid-template-rows: repeat(4, 1fr);
	}
	#header .l-header__inner{
		grid-gap: 0 1.5rem;
		padding-top: 1.5rem;
	}
}


/*===============================================================================
ロゴ
================================================================================*/
@media (min-width: 960px){	
	#header .l-header__logo,
	#fix_header .l-fixHeader__logo{
		align-items: stretch;
		grid-area: 1 / 1 / 5 / 3;
		margin-right: 0;
		padding: 0;
		padding-left: 4rem;
	}
	#fix_header .c-headLogo {
		--logo_size_pcfix: 80px;
	}
}

/*===============================================================================
グロナビ
================================================================================*/
@media (min-width: 960px){
	#header .l-header__gnav,
	#fix_header .l-fixHeader__gnav{
		justify-content: flex-end;
		align-self: self-end;
		width: 100%;
		max-width: 800px;
		border-top-left-radius: var(--bd-r--xl);
		overflow: hidden;
	}
	#header .l-header__gnav{
		grid-area: 2 / 3 / 3 / 7;
	}
	#fix_header .l-fixHeader__gnav{
		grid-area: 4 / 3 / 5 / 7;
		height: 100%;
	}
	/* ul */
	#header .c-gnav,
	#fix_header .c-gnav{
		--count: 5;
		--gap: 0rem;
		gap: var(--gap);
	}
	/* li */
	#header .c-gnav>.menu-item,
	#fix_header .c-gnav>.menu-item{
		flex-grow: 1;
		width: calc( ( 100% - var(--gap) * (var(--count) - 1) ) / var(--count) );
	}

	#header .c-gnav>.menu-item{
		background: var(--c-main);
		color: var(--c-light);
	}
	#header .c-gnav>.menu-item>a{
		padding: 1.375rem 1.5rem;
	}
	#header .c-gnav>.menu-item>a .ttl,
	#fix_header .c-gnav>.menu-item>a .ttl{
		font-size: 1rem;
	}
	/* 追従ヘッダーのアニメーション */
	#fix_header .c-gnav > li:hover > a::after,
	#fix_header .c-gnav > .-current > a::after{
		transform: scaleX(.5);
	}
}

/*===============================================================================
ウィジェット
================================================================================*/
@media (min-width: 960px){
	#header .w-header.pc_,
	#fix_header .w-header.pc_ {
		display: flex !important;
		justify-content: flex-end;
		padding-right: 2.5rem;
	}
	#header .w-header.pc_ {
		grid-area: 1 / 3 / 2 / 7;
	}
	#fix_header .w-header.pc_{
		grid-area: 1 / 3 / 4 / 7;
	}

	#header .w-header__inner,
	#fix_header .w-header__inner {
		width: 100%;
	}

	#header .p-hdrCta,
	#fix_header .p-hdrCta{
		justify-content: flex-end;
	}
}



/*===============================================================================
ハンバーガーメニューの開閉ボタンの位置を揃える
================================================================================*/
@media not all and (min-width: 960px){
	:root{
		--header-vertical-gap: 0rem;
		--header-side-gap: 0rem;
		--icon-size: 5rem;
	}

	/* ヘッダーロゴ周りの余白を削除 */
	:is(#header, #fix_header) :is(.l-header__logo, .c-headLogo__link){
		padding: 0;
	}

	/* 開けるボタンの位置 */
	#header {
		padding: var(--header-vertical-gap) var(--header-side-gap);
	}

	/* 閉じるボタンの位置 */
	#sp_menu .p-spMenu__inner{
		padding-top: calc( var(--swl-headerH) + var(--header-vertical-gap) );
	}
	#sp_menu .p-spMenu__closeBtn{
		top: calc( var(--header-vertical-gap) + 0px );
		right: var(--header-side-gap);
	}

	/*===============================
	サイズの変更
	* =================================*/
	#header .l-header__menuBtn, 
	#sp_menu .p-spMenu__closeBtn,
	#header .c-iconBtn, 
	#sp_menu .c-iconBtn{
		width: var(--icon-size);
		height: var(--icon-size);
	}
	#header .c-iconBtn, 
	#sp_menu .c-iconBtn{
		font-size: calc( var(--icon-size) / 2.5 );
	}
	#header .c-iconBtn__icon, 
	#sp_menu .c-iconBtn__icon{
		font-size: inherit;
	}
}



/*===============================================================================
ハンバーガーメニュー
================================================================================*/
/*===============================
ハンバーガーメニューが開いている時はｽｸﾛｰﾙ禁止
* =================================*/
[data-spmenu="opened"] body{
	height: 100%;
	overflow: hidden;
}

/*===============================
背景色部分
* =================================*/
/* 幅の変更 */
[data-spmenu="closed"] #sp_menu .p-spMenu__inner{
	-webkit-transform: translateX(100vw);
	transform: translateX(100vw);
}
#sp_menu .p-spMenu__inner{
	width: 100vw;
}
/* 背景色の変更 */
#sp_menu .p-spMenu__inner::before{
	background: linear-gradient(118.3deg, #5FC4CF 0%, #4A9ED9 43.77%, #175AC4 109.4%);
}

/*===============================
ハンバーガーメニュー：アイコン
* =================================*/
/* 開くボタン：背景色を付与 */
#header .l-header__menuBtn{
	background: linear-gradient(118.3deg, #5FC4CF 0%, #4A9ED9 43.77%, #175AC4 109.4%);
}
/* ハンバーガーアイコン色の変更 */
#header .c-iconBtn__icon, 
#sp_menu .c-iconBtn__icon{
	color: var(--c-light);
}

#sp_menu .p-spMenu__inner{
	position: relative;
}
#sp_menu .p-spMenu__inner::after{
	content: "MENU";
	position: absolute;
	top: calc( (var(--swl-headerH) + var(--header-vertical-gap)) / 2 );
	left: 4vw;
	transform: translateY(-50%);
	color: var(--c-light);
	font-weight: var(--fw-lg);
	font-size: 1.5rem;
}

/*===============================
コンテンツ部分
* =================================*/
/* MENUテキスト */
.c-widget__title{
	display: none;
}



/*===============================================================================
ハンバーガーメニュー：ウィジェット
================================================================================*/
#custom_html-5{
	margin-inline: calc( 50% - 50vw );
}
#custom_html-5 .myMenu.--main{
	margin-bottom: 0;
}