@charset "UTF-8";
.sec09 {
	background-image: url(https://wata-support.jp/wp-content/uploads/2024/03/bg-dots02.png), linear-gradient(to bottom, #fff, #fffac0 60%, #fff365);
	background-repeat: no-repeat;
	background-size: contain;
}
.moreover {
	position: relative;
	margin-bottom: 40px;
}
.moreover .sec__heading {
	top: -50px;
	width: 100%;
	margin: 0 auto;
	margin-bottom: 60px;
}
.moreover .trouble__img {
	padding-bottom: 0;
}
.moreover__txt {
	font-size: 30px;
	line-height: 1.8;
	max-width: 960px;
	margin: 0 auto;
}
.moreover__txt p {
	margin-top: 80px;
}
.moreover-example {
	position: relative;
	padding-top: 220px;
	max-width: 960px;
	margin: 0 auto;
	margin-bottom: 180px;
}
.moreover-balloon01,
.moreover-balloon02 {
	position: absolute;
	width: 100%;
	margin: 0 auto;
	background-color: #fff649;
	border-radius: 50px;
}
.moreover-balloon01 {
	top: 100px;
	left: -2%;
	max-width: 300px;
	transform: rotate(-15deg);
}
.moreover-balloon02 {
	top: 40px;
	right: 0%;
	max-width: 320px;
	transform: rotate(11deg);
}
.moreover-balloon01::before,
.moreover-balloon02::before {
	content: "";
	width: 40px;
	height: 35px;
	position: absolute;
	display: block;
	background-color: #fff649;
}
.moreover-balloon01::before {
	top: calc(100% - 1px);
	right: 16%;
	clip-path: polygon(100% 0%, 100% 100%, 0% 0%);
}
.moreover-balloon02::before {
	top: calc(100% - 1px);
	left: 16%;
	clip-path: polygon(100% 0%, 0% 100%, 0% 0%);
}
.moreover-balloon__txt {
	width: 100%;
	margin: 0 auto;
	padding: 30px 0;
}
.moreover-balloon__txt p {
	font-size: 30px;
	line-height: 1.8;
	text-align: center;
	margin-bottom: 0;
}
.moreover-example__img01 {
	width: 100%;
	margin: 0 auto;
}
.sec09 .merit .sec__heading .large {
	color: #fff55f;
}
.sec09 .merit__item::before {
	content: counter(merit02);
	counter-increment: merit02 1;
}

@media screen and (max-width: 1440px) {
	.moreover {
		padding-top: 67px;
	}
	.moreover .sec__heading {
		top: -10px;
		max-width: 870px;
	}
	.moreover__txt {
		max-width: 670px;
		margin: 0 auto 40px;
	}
	.moreover__txt p {
		font-size: 20px;
		line-height: 40px;
		margin-top: 55px;
	}
	.moreover-example {
		max-width: 670px;
		margin-bottom: 120px;
		padding-top: 145px;
	}
	.moreover-balloon01,
	.moreover-balloon02 {
		border-radius: 33.5px;
	}
	.moreover-balloon01 {
		top: 25px;
		max-width: 250px;
	}
	.moreover-balloon02 {
		top: -5px;
		max-width: 260px;
	}
	.moreover-balloon01::before,
	.moreover-balloon02::before {
		width: 26.8px;
		height: 35px;
	}
	.moreover-balloon__txt {
		max-width: 240px;
		padding: 20px 0;
	}
	.moreover-balloon__txt p {
		font-size: 20px;
	}
	.moreover-example__img01 {
		display: block;
		width: 520px;
		height: auto;
	}
	.moreover-example__img02 {
		width: 307.5px;
		height: auto;
		right: -73.7px;
	}
}
@media screen and (max-width: 1024px) {
	.moreover {
		padding: 0;
		margin-bottom: 80px;
	}
	.moreover .sec__heading {
		top: -30px;
		max-width: 600px;
	}
	.moreover__txt {
		max-width: 480px;
	}
	.moreover__txt p {
		font-size: 14px;
		line-height: 30px;
		margin-top: 40px;
	}
	.moreover-example {
		max-width: 480px;
		padding-top: 100px;
		margin-bottom: 80px;
	}
	.moreover-balloon01,
	.moreover-balloon02 {
		border-radius: 20px;
	}
	.moreover-balloon01 {
		top: 20px;
		left: 30px;
		max-width: 150px;
	}
	.moreover-balloon02 {
		top: 15px;
		max-width: 170px;
	}
	.moreover-balloon01::before,
	.moreover-balloon02::before {
		width: 20px;
		height: 15px;
	}
	.moreover-balloon__txt {
		max-width: 144px;
		padding: 20px 0;
	}
	.moreover-balloon__txt p {
		font-size: 15px;
		line-height: 24px;
		margin-bottom: 0;
	}
	.moreover-example__img01 {
		display: block;
		width: 310px;
		height: auto;
		margin: 0 auto;
	}
	.moreover-example__img02 {
		width: 150px;
		height: auto;
		right: 15px;
	}
}
@media screen and (max-width: 767px) {
	.moreover {
		padding: 0;
		margin-bottom: 40px;
	}
	.moreover .trouble__img {
		padding-bottom: 60px;
	}
	.trouble__img img {
		width: 60%;
	}
	.moreover .trouble-balloon02 {
		top: -10px;
	}
	.moreover .trouble-balloon03 {
		bottom: -20px;
	}
	.moreover__txt {
		margin: 0 auto 20px;
	}
	.moreover__txt p {
		font-size: 13px;
		line-height: 30px;
		margin-top: 28px;
	}
	.moreover-example {
		padding-top: 0px;
		max-width: 500px;
		margin: 0 auto;
		text-align: center;
	}
	.moreover-balloon01,
	.moreover-balloon02 {
		position: relative;
		border-radius: 15px;
	}
	.moreover-balloon01 {
		margin: 40px 0;
	}
	.moreover-balloon02 {
		top: 0;
		left: auto;
		right: 30px;
		margin: 40px 0 40px auto;
	}
	.moreover-balloon01::before,
	.moreover-balloon02::before {
		width: 40px;
		height: 35px;
	}
	.moreover-balloon02::before {
		top: auto;
		bottom: calc(100% - 1px);
		right: 16%;
		clip-path: polygon(100% 0%, 100% 100%, 0% 100%);
	}
	.moreover-balloon__txt {
		padding: 20px 0;
	}
	.moreover-example__img01 {
		width: 100%;
		max-width: 300px;
	}
	.moreover-example__img02 {
		position: static;
		width: 50%;
		height: auto;
		margin: 10px auto 0;
		max-width: 250px;
	}
}