:root {
	--color-green01: #449739;
	--color-green02: #9DCA52;
	--color-green03: #1CA954;
}

.border_ttl_2 .txt::after {
	background: var(--color-green01);
}

.page_ttl_details {
	background-image: url(../img/bg_detail_ttl.png);
}

.page_ttl_details .inner_wrapper {
	padding-bottom: 42px;
}

.page_ttl_details .inner_wrapper .img img {
	max-width: none;
	width: 100%;
	height: auto;
}

.page_ttl_details .ttl_balloon {
	max-width: 454px;
}

.left_img_sec .inner .ttl .inner_txt.green01::after {
	background: var(--color-green01);
}

.scroll.msk-bg.green01::after {
	background: var(--color-green01);
}

.scroll.msk-bg img {
	max-width: none;
	width: 100%;
	height: auto;
}

.service_card .inner {
	background: var(--color-green02);
	color: #fff;
	border: 0;
	margin: 0;
}

.service_card .inner .ttl {
	font-size: 112%;
	margin-bottom: 20px;
}

.sec_service_3 .inner .sec_right .ttl .inner {
	background: var(--color-green01);
}

.sec_service_3 .inner .sec_right .ttl::before {
	background-image: url(../img/icon_balloon.png);
}

.sec_service_3::before {
	background: url(../img/bg_stripe.png) right bottom repeat;
}

.steps_list li .step {
	background: var(--color-green01);
	color: #fff;
}

.sec_details {
	background: #F9F9F9;
	max-width: 1148px;
	margin: 200px auto;
	.sec_details_inner {
		padding: 100px 30px;
		.border_ttl_2 .txt {
			span {
				font-size: 30px;
				display: inline-block;
				font-weight: bold;
			}
		}
		> section {
			margin-block: 100px;
			.-cols01 {
				display: flex;
				gap: 20px;
				> h3 {
					margin: 0;
					> div {
						width: 300px;
						font-size: 26px;
						font-weight: bold;
						padding-left: 20px;
						border-left: 10px solid var(--color-green01);
					}
				}
				> dl {
					dt {
						font-size: 20px;
						font-weight: bold;
						margin-bottom: 1em;
					}
				}
			}
			.-cols02 {
				display: flex;
				align-items: center;
				max-width: 956px;
				margin: 50px auto 0;
				.-img {
					flex: 1;
					> img {
						display: block;
						width: 80%;
						margin: 0 auto;
					}
				}
				.-txt {
					flex-shrink: 0;
					width: 568px;
					> dl {
						dt {
							font-size: 20px;
							font-weight: bold;
							text-align: center;
							color: var(--color-green01);
							margin-bottom: 1em;
							margin-inline: -2em;
						}
						dd {
							ul {
								display: flex;
								flex-direction: column;
								gap: 6px;
								list-style: none;
								padding: 0;
								margin: 0;
								li {
									padding: 18px 10px 18px 78px;
									font-size: 20px;
									font-weight: bold;
									color: #fff;
									line-height: 1.75;
									background: url(../img/bg01.svg) center / contain no-repeat;
									&:nth-child(2) {
										background-image: url(../img/bg02.svg);
									}
									&:nth-child(3) {
										background-image: url(../img/bg03.svg);
									}
								}
							}
						}
					}
				}
			}
			.-img01 {
				display: block;
				width: 100%;
				max-width: 778px;
				margin: 60px auto 0;
			}
			.-img02 {
				display: block;
				width: 100%;
				max-width: 733px;
				margin: 30px auto 0;
			}
		}
	}
}

@media screen and (max-width: 980px) {
	.page_ttl_details .inner_wrapper .img {
		width: 290px;
		margin: 0 auto;
	}

	.page_ttl_details .ttl_balloon {
		transform: translateY(-32%);
	}
}

@media screen and (max-width: 800px) {
	.service_card .inner {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		gap: 15px;
		margin-bottom: 25px;
		padding: 4px;
	}

	.service_card .inner .img {
		flex-shrink: 0;
		float: none;
		width: 90px;
	}

	.service_card .inner .ttl {
		font-size: 20px;
		margin: 0;
	}

	.service_card .inner .ttl br {
		display: none;
	}

	.page_ttl_details .ttl_balloon {
			margin-top: -6%;
			transform: none;
	}

	.sec_details {
		margin: 100px auto;
		.sec_details_inner {
			padding: 45px 25px;
			.border_ttl_2 .txt {
				span {
					font-size: 26px;
				}
			}
			> section {
				margin-block: 50px;
				.-cols01 {
					flex-direction: column;
					gap: 40px;
					> h3 {
						> div {
							width: auto;
							font-size: 20px;
							padding-left: 10px;
						}
					}
				}
				.-cols02 {
					flex-direction: column-reverse;
					.-img {
						flex: 1;
						> img {
							width: 60%;
						}
					}
					.-txt {
						width: 100%;
						> dl {
							dt {
								font-size: 3.4vw;
								margin-bottom: 1.5em;
								margin-inline: 0;
							}
							dd {
								ul {
									li {
										padding: 5.1vw 4vw 8vw 8vw;
										font-size: 3.4vw;
										line-height: 2;
										background-image: url(../img/bg01-sp.svg);
										&:nth-child(2) {
											background-image: url(../img/bg02-sp.svg);
										}
										&:nth-child(3) {
											background-image: url(../img/bg03-sp.svg);
										}
									}
								}
							}
						}
					}
				}
				.-img01 {
					display: block;
					width: 100%;
					max-width: 778px;
					margin: 60px auto 0;
				}
				.-img02 {
					display: block;
					width: 100%;
					max-width: 733px;
					margin: 30px auto 0;
				}
			}
		}
	}
}

@media screen and (min-width: 800px) {
	.left_img_sec .img {
		width: 43.2%;
	}

	.left_img_sec .inner {
		width: 55%;
	}
}
