/* 連番用変数定義 number=0; */
:root {
	counter-reset: number 0;
}
.service {
	border-top: 0.1rem solid #212121;
	width: 100%;
}
.service:first-child {
	border-top: 0;
}
.service_wrapper {
	display: flex;
	justify-content: center;
	font-weight: 500;
}
.service_left {
	margin: 0 auto;
	padding: 7rem 0 0 5rem;
	width: calc(128rem / 2);
	height: auto;
}
.service_left .service_title_box {
	position: relative;
	display: flex;
	margin: 0 0 0 12.5rem;
	flex-direction: column-reverse;
}
.service_left .service_title_box::before {
	counter-increment: number 1;
  content: counter(number, decimal-leading-zero); /* 0埋めした連番が振られる */
	display: block;
	position: absolute;
	top: -2.125rem;
	left: -12.55rem;
	color: #024391;
	font-size: 6.0rem;
	font-family: var(--Train-One);
}
.service_left .service_title_box .service_title {
	color: #212121;
	font-size: 2.0rem;
}
.service_left .service_title_box .service_sub_title {
	color: #024391;
	font-size: 1.6rem;
	text-wrap: nowrap;
}
.service_left .service_description {
	line-height: 1.42em;
	margin: 5rem 0 0 -0.1rem;
	padding: 0 5rem 0 0;
	font-size: 1.4rem;
}
.spbr {
	display: none;
}
.service_right {
	border-left: 0.1rem solid #212121;
	width: calc(128rem / 2);
	height: auto;
}
.service_right .stones_img_box {
	position: relative;
	margin: 3.8rem auto 3.9rem auto;
	width: 49.2rem;
	height: 31.69rem;
}
.service_right .stones_img_corner {
	position: relative;
	width: 100%;
	height: 100%;
}
.service_right .stones_img_corner::after {  /* 四隅の線（黒） */
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		background:
			linear-gradient(45deg, #212121 3.5rem, transparent 0),
			linear-gradient(-45deg, #212121 3.5rem, transparent 0),
			linear-gradient(135deg, #212121 3.5rem, transparent 0),
			linear-gradient(-135deg, #212121 3.5rem, transparent 0);
		z-index: 1;
}
.service_right .stones_img_corner::before { /* 四隅の三角（白） */
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		background:
			linear-gradient(45deg, #f6f5f3 3.565rem, transparent 0),
			linear-gradient(-45deg, #f6f5f3 3.565rem, transparent 0),
			linear-gradient(135deg, #f6f5f3 3.565rem, transparent 0),
			linear-gradient(-135deg, #f6f5f3 3.565rem, transparent 0);
		z-index: 2;
}
.service_right .stones_img {
	border: 0.1rem solid #212121;
	width: 100%;
	height: 100%;
}
.service_right .service_link_button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 0.1rem solid #212121;
	font-size: 2rem;
	padding: 0.1rem 5.1rem 0rem 6.1rem;
	width: 100%;
	height: 8rem;
}
.service_right .service_link_button:hover {
	background: #024391;
	color: #fff;
}
.service_right .service_link_button:hover .a {
	fill: #fff;
}
.service_right .service_link_button svg {
	width: 3.6rem;
	height: 3.6rem;
}

/*
*		[responsive] .service
*/
@media screen and (max-width: 699.98px) {
	.service_wrapper {
		flex-direction: column;
		margin: 0;
	}
	.service_left {
		margin: 0 0 -0.2rem 0;
		padding: 1.5rem;
		width: 100%;
	}
	.service_left .service_title_box {
		position: relative;
		display: flex;
		margin: 10rem 0 0 0;
		flex-direction: column-reverse;
	}
	.service_left .service_title_box::before {
		top: -8rem;
		left: 0;
		font-size: 4.0rem;
	}
	.service_left .service_title_box .service_title {
		padding: 0.8rem 0 0 0;
	}
	.service_left .service_title_box .service_sub_title {
		font-size: 1.4rem;
	}
	.service_left .service_description {
		font-size: 1.4rem;
		margin: 3rem 0 3.6rem 0;
		padding: 0;
	}
	.spbr {
		display: inline;
	}
	.service_right {
		border-left: 0;
		border-top: 0.1rem solid #212121;
		width: 100%;
	}
	.service_right .stones_img_box {
		padding: 1.5rem;
		margin: 1rem 0 2rem 0;
		width: 100%;
		height: 25.2rem;
	}
	.service_right .stones_img_corner::after {  /* 四隅の線（黒） */
			background:
				linear-gradient(45deg, #212121 2.55rem, transparent 0),
				linear-gradient(-45deg, #212121 2.55rem, transparent 0),
				linear-gradient(135deg, #212121 2.55rem, transparent 0),
				linear-gradient(-135deg, #212121 2.55rem, transparent 0);
	}
	.service_right .stones_img_corner::before { /* 四隅の三角（白） */
			background:
				linear-gradient(45deg, #f6f5f3 2.5rem, transparent 0),
				linear-gradient(-45deg, #f6f5f3 2.5rem, transparent 0),
				linear-gradient(135deg, #f6f5f3 2.5rem, transparent 0),
				linear-gradient(-135deg, #f6f5f3 2.5rem, transparent 0);
	}
	.service_right .service_link_button {
		font-size: 1.4rem;
		padding: 0 3rem 0 3.6rem;
		height: 4.7rem;
	}
	.service_right .service_link_button .service_link_button_icon {
		width: 2.1rem;
		height: 2.1rem;
	}
}