/* Splide.js カスタムスタイル - tombstoneページ用 */
/* ページネーションのカスタマイズ */
.splide__pagination {
	bottom: -80px;
	gap:0.5em;
}

.splide__pagination__page {
	background: #8C8C8C;
	opacity: 0.5;
}

.splide__pagination__page.is-active {
	background: var(--wp--preset--color--arisaka-main-color);
	opacity: 1;
}


.splide__arrow splide__arrow--prev,
.splide__arrow splide__arrow--next{
	background-color: var(--wp--preset--color--white);
}


/* 矢印のカスタマイズ */
.splide__arrow {
	background: var(--wp--preset--color--arisaka-main-color);
	opacity: 1;
	z-index: 10;
	pointer-events: auto;
	cursor: pointer;
	width: clamp(2.25rem, 1.084rem + 4.98vw, 5.563rem);
	height:clamp(2.25rem, 1.084rem + 4.98vw, 5.563rem);
}
.splide__arrow svg{
	fill:var(--wp--preset--color--white);
	width:clamp(0.75rem, 0.592rem + 0.68vw, 1.2rem);
	height:clamp(0.75rem, 0.592rem + 0.68vw, 1.2rem)
}

.splide__arrow:hover {
	opacity: 0.8;
}

.splide__arrow:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

/* 矢印の位置設定（CSSでコントロール） */
.splide__arrow--prev {
	left: 16.666%; /* スライド幅の1/6（perPage: 3の場合、1スライドの半分） */
}

.splide__arrow--next {
	right: 16.666%; /* スライド幅の1/6（perPage: 3の場合、1スライドの半分） */
}

/* ブレークポイント: 1024px以下（perPage: 2） */
@media (max-width: 1024px) {
	.splide__arrow--prev {
		left: 25%; /* スライド幅の1/4（perPage: 2の場合、1スライドの半分） */
	}
	
	.splide__arrow--next {
		right: 25%; /* スライド幅の1/4（perPage: 2の場合、1スライドの半分） */
	}
}

/* ブレークポイント: 768px以下（perPage: 1） */
@media (max-width: 768px) {
	.splide__arrow--prev {
		left: 10px; /* モバイルでは固定値 */
	}
	
	.splide__arrow--next {
		right: 10px; /* モバイルでは固定値 */
	}
}