/*===============================================================================
***既存スタイル
================================================================================*/
#footer {
	--c-footer: var(--c-light);
	--c-footer_bgc: var(--c-main);
	background-color: transparent;
}
.l-container.w-footer{
	padding: 0;
}
.l-footer__widgetArea,
.w-footer__box {
	padding: 0;
}
/* 幅広レイアウトに対応する為に必要 */
.w-footer__box {
	max-width: 100%;
}



/*===============================================================================
***マイフッター
================================================================================*/
/* リンクアニメーション */
.myFooter a[href] {
	transition: var(--ani-t--normal);
}



/*===============================================================================
***メニュー
================================================================================*/
/*===============================
* メニュー：SP
* =================================*/
@media not all and (min-width: 600px){
	.myFtr-menuArea{
		--c-this: var(--c-light);
		position: relative;
		margin-inline: calc( 50% - 50vw );
	}
	#content:has(.footerBefore) .myFtr-menuArea{
		margin-top: -9rem; /* マイナスの値 は 「fb__bgArea」と連動させる */
		padding-top: 13rem;
	}
	/* 背景色 */
	.myFtr-menuArea::before{
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: linear-gradient(118.3deg, #5FC4CF 0%, #4A9ED9 43.77%, #175AC4 109.4%);
	}
	.myFtr-menuArea a{
		width: 100%;
		height: 100%;
		line-height: var(--lh-lg);
		color: var(--c-this);
		font-size: .875rem;
	}
}

/*===============================
* メニュー：PC
* =================================*/
.myFtr-menuArea__bgi{
	display: none;
}
@media (min-width: 600px){
	.myFtr-menuArea{
		position: relative;
		margin-top: calc( var(--g-sec--xs) * -1 ); /* マイナスの値 は 「fb__bgArea」と連動させる */
		padding-top: calc( var(--g-sec--md) + var(--g-sec--xs) );
		padding-bottom: var(--g-sec--md);
	}
	.myFtr-menuArea__bgi{
		display: block;
		position: absolute;
		top: 0;
		left: calc( 50% - 50vw );
		z-index: -1;
		max-width: 100vw;
		width: 100vw;
		height: 100%;
	}
	.myFtr-menuArea__bgi img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}



/*===============================================================================
***コンテンツ
================================================================================*/
/*===============================
* 背景色
* =================================*/
.myFooter__bgc {
	position: relative;
	padding: var(--g-sec--xs) 0;
	color: var(--c-footer);
}
.myFooter__bgc::before {
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	content: "";
	width: 100vw;
	height: 100%;
	background: var(--c-footer_bgc);
	z-index: -1;
}

/* カラム */
.myFooter__flex {
	--count: 1;
	--gap: var(--g-sec--xs);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--gap);
}
@media (min-width: 960px) {
	.myFooter__flex {
		--count: 2;
	}
}

/*===============================
* info
* =================================*/
.myFtr-info {
	max-width: 25rem;
	width: calc((90% - var(--gap) * (var(--count) - 1)) / var(--count));
}
.myFtr-info__logo {
	display: inline-block;
	margin-bottom: 1.25rem;
}

/*===============================
* message
* =================================*/
.myFtr-message {
	max-width: 50rem;
	width: calc((110% - var(--gap) * (var(--count) - 1)) / var(--count));
}
.myFtr-message__inner{
	padding: 1.5rem;
	border: 1px solid var(--c-footer);
}



/*===============================================================================
***コピーライト
================================================================================*/
.l-footer__foot {
	position: relative;
	color: var(--c-footer);
}
.l-footer__foot::before {
	position: absolute;
	top: 0;
	left: calc( 50% - 50vw );
	z-index: -1;
	content: "";
	width: 100vw;
	height: 100%;
	background: var(--c-footer_bgc);
}
