.js-overlap{
	position: relative;
}
/*===============================
* オーバーレイ
* =================================*/
.js-overlap__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 0;
	opacity: 0;
	visibility: hidden;
	transition: var(--ani-t--normal) ease-out;
}
@media (min-width: 768px) {
	/* JSで付与される表示クラス */
	.js-overlap__overlay.is-show {
		opacity: 0.8;
		visibility: visible;
	}
	/* アクティブではない「.js-overlap__el」に対するCSS */
	.js-overlap:has(.js-overlap__overlay.is-show)
	.js-overlap__el:not(.is-active) {
		opacity: 0.2;
	}
	/* オーバーレイが表示中のカードの背景画像に対するCSS */
	.js-overlap:has(.js-overlap__overlay.is-show) .js-overlap__bgi {
		opacity: 0;
	}
	/* カード全体を覆う透明なリンクレイヤー */
	.js-overlap__cover-link {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 10; /* カード内の他のテキストや画像より前面に重ねる */
	}
}