/* Shared service section: activity cases */
.c-service-cases {
	position: relative;
	padding: 128px 0;
	background: #fff;
	color: #382710;
	font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.8;
	overflow: clip;
}

.c-service-cases *,
.c-service-cases *::before,
.c-service-cases *::after {
	box-sizing: border-box;
}

.c-service-cases .c-service-section-heading {
	width: 353px;
	margin-bottom: 32px;
}

.c-service-cases__slider {
	width: 100%;
	height: 359px;
	overflow: visible;
}

.c-service-cases__slider .splide__track {
	overflow: visible;
}

.c-service-cases__list {
	align-items: stretch;
}

.c-service-cases__slide {
	height: 345px;
}

.c-service-case {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
	color: #382710;
}

.c-service-case__media {
	width: 100%;
	height: 182px;
	flex: 0 0 182px;
	overflow: hidden;
	border-radius: 8px 8px 0 0;
	background: #f5f3ef;
}

.c-service-case__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.c-service-case__body {
	padding: 8px;
}

.c-service-case h3 {
	margin: 0;
	color: #382710;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.7;
}

.c-service-case p {
	margin: 0;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.8;
}

.c-service-cases .splide__pagination {
	bottom: -32px;
}

.c-service-cases .splide__pagination__page {
	display: block;
	width: 8px;
	height: 8px;
	min-width: 0;
	min-height: 0;
	margin: 4px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(56, 39, 16, 0.25);
	transform: none;
}

.c-service-cases .splide__pagination__page.is-active {
	background: #e4abcc;
	transform: scale(1.15);
}

@media (max-width: 767px) {
	.c-service-cases {
		padding: 92px 0 110px;
	}

	.c-service-cases .c-service-section-heading {
		margin-bottom: 40px;
	}

	.c-service-cases__slider {
		height: auto;
	}

	.c-service-cases__slide {
		height: auto;
		min-height: 345px;
	}

	.c-service-case {
		min-height: 345px;
	}

	.c-service-case__media {
		height: auto;
		flex-basis: auto;
		aspect-ratio: 286 / 182;
	}
}

@media (max-width: 374px) {
	.c-service-cases__slider {
		padding-bottom: 4px;
	}
}
