.service {
	position: relative;
	margin-top: 10rem;
	transition: 2s;
	background-color: #EBE8E4;
	border-top: 1px solid var(--border-color);
	border-bottom: 1px solid var(--border-color);
}
.service.active {
	background-color: #C9D2D2;
}
.service_inner {
	position: relative;
	max-width: 100rem;
	margin: 0 auto;
}
.service_wrap {
	position: relative;
	max-width: 100rem;
	display: grid;
	grid-template-columns: clamp(140px, calc(140px + 0.431 * (100vw - 768px)), 240px) 1fr;
	gap: 6rem;
	margin: auto;
}
.menu_box_line2 {
	top: 100%;
}
.menu_box_line3 {
    position: absolute;
    left: calc(100% / 3 - 6rem);
    width: 1px;
    height: 0;
    background-color: #9D9D9D;
}
.menu_box_line4 {
	display: none;
}
.service_catch {
	padding-top: 10rem;
	font-size: 1.6rem;
	line-height: 2;
	letter-spacing: .02em;
	text-align: center;
}
.service_item {
	position: relative;
	padding: 6rem 4rem;
}
.service_item:not(:first-child)::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%) scaleX(0);
	width: 100vw;
	height: 1px;
	background-color: var(--border-color);
	transform-origin: left;
	transition: transform 2s ease;
}
.service_item.show::before {
  transform: translateX(-50%) scaleX(1);
}
.service_title_number {
	font-family: neue-haas-grotesk-text, sans-serif;
	font-size: 1.4rem;
	letter-spacing: 0.02em;
	color: var(--maincolor);
}
.service_title_en {
	font-family: kudryashev-d-contrast-sans, sans-serif;
	font-size: 4.2rem;
	color: var(--maincolor);
	letter-spacing: -0.01em;
	line-height: 1;
	margin: 1.2rem 0 .5rem;
}
.service_cont {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(20px, calc(20px + 0.259 * (100vw - 768px)), 80px);
}
.service_cont_desc .link_btn {
	padding-top: 8rem;
}
.service_title_ja {
	font-size: 1.4rem;
}
.service_thumb {
	max-width: 300px;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	clip-path: ellipse(36% 50% at 50% 50%);
	transform: rotate(45deg);
}
.service_thumb_img {
	transform: rotate(-45deg);
	object-fit: cover;
	object-position: 50% -7%;
	width: 100%;
	height: 100%;
}
.service_text {
	font-size: 1.4rem;
	line-height: 1.8;
}
@media (max-width: 768px) {
	.service {
		margin-top: 6rem;
	}
	.service_wrap {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.service_cont {
		display: flex;
		flex-direction: column-reverse;
		gap: 2rem;
	}
	.service_thumb {
		max-width: 70%;
		margin: auto;
	}
	.menu_box_line3 {
		left: 2rem;
	}
	.menu_box_line4 {
		display: block;
	}
	.service_cont_desc .link_btn {
		padding-top: 4rem;
	}
	.service_item {
		padding: 3rem 4rem; 
	}
	.service_catch {
	    font-size: 1.5rem;
		padding-top: 4rem;
		text-align: left;
	}
}
