/*===========================================================================
footer
footerで使用するCSS
接頭辞【.l-】
===========================================================================*/
.l-footer {
	width: 100%;
	padding-bottom: var(--spacing-64);
	background-color: #fff;
	position: relative;
	z-index: 10;
}
.l-footer__inr {
	padding-top: var(--spacing-200);
}
.l-footer__logo {
	width: 80rem;
	margin: 0 auto;
	display: block;
}
.l-footer__menu {
	margin-top: var(--spacing-120);
}
.l-footer__navTtl {
	color: rgb(51, 51, 51,0.7);
}
.l-footer__navTtl a {
}
.l-footer__navTtl a:hover {
	opacity: 0.7;
}
.l-footer__navDtl {
	margin-top: var(--spacing-16);
	gap: var(--spacing-02);
}
.l-footer__copy {
	margin-top: var(--spacing-120);
}

.l-support .l-footer {
	background-color: var(--back-color-Sand);
}
/* SP
----------------------------------*/
@media screen and (max-width: 1200px) {
	.l-footer {
	}
	.l-footer__inr {
		padding-top: var(--spacing-160);
	}
	.l-footer__menu {
		margin-top: var(--spacing-96);
	}
	.l-footer__nav + .l-footer__nav {
		margin-top: var(--spacing-32);
	}
	.l-footer__navTtl {
		color: rgb(0, 0, 0,0.7);
	}
	.l-footer__navDtl {
		margin-top: 0;
		gap: var(--spacing-02);
	}
	.l-footer__copy {
		margin-top: var(--spacing-96);
	}
}