section.title {
	padding: 80px 5% 0 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			font-size: 2.0rem;
			line-height: 1.3;
			color: #000;
			font-weight: 600;
			text-align: center;
		}
		> h3 {
			margin-top: 10px;
			font-size: 1.0rem;
			line-height: 1.3;
			color: #000;
			text-align: center;
		}
		> p {
			margin-top: 30px;
			font-size: min(1.0rem, 5.0vw);
			line-height: 1.3;
			color: #333;
			text-align: center;
		}
	}
}
section.mark {
	padding: 60px 5% 0 5%;
	> div {
		max-width: 900px;
		margin-inline: auto;
		display: grid;
		grid-template-columns: 1fr auto;
		column-gap: 70px;
		@media (width < 700px) {
			grid-template-columns: 1fr;
			row-gap: 30px;
		}
		> div {
			padding-top: 50px;
			@media (width < 700px) {
				order: 2;
				padding-top: 0px;
			}
			> p {
				margin-top: 5px;
				font-size: min(1rem,5vw);
				line-height: 2.2;
				color: #222;
				text-align: justify;
			}
		}
		> picture {
			text-align: center;
			@media (width < 700px) {
				order: 1;
			}
			> img {
				max-width: 100%;
			}
		}
	}
}
section.example {
	padding: 60px 5% 0 5%;
	> div {
		max-width: 900px;
		margin-inline: auto;
		> h2 {
			font-size: 1.5rem;
			line-height: 1.6;
			color: #000;
			font-weight: 600;
		}
		> div {
			padding-top: 40px;
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			column-gap: 20px;
			row-gap: 20px;
			@media (width < 860px) {
				grid-template-columns: repeat(2, 1fr);
				column-gap: 10px;
				row-gap: 10px;
			}
			> article {
				display: grid;
				border: 1px solid #9da6b0;
				padding: 20px;
				@media (width < 860px) {
					padding: 10px;
				}
				@media (width < 350px) {
					padding: 10px 5px;
				}
				> figure {
					padding-block: 10px 5px;
					align-self: center;
					text-align: center;
					> img {
						max-width: 100%;
						@media (width < 860px) {
							padding-inline: 10px;
						}
					}
				}
				> p {
					align-self: end;
					font-size: min(0.9rem,4.5vw);
					line-height: 1.0;
					color: #0054a7;
					text-align:	center;
				}
			}
		}
	}
}
section.point {
	padding: 60px 5% 0 5%;
	> div {
		border-top: 1px solid #ced2d7;
		max-width: 1000px;
		margin-inline: auto;
		> div {
			padding-top: 60px;
			max-width: 900px;
			margin-inline: auto;
			> h2 {
				font-size: 1.5rem;
				line-height: 1.6;
				color: #000;
				font-weight: 600;
				> span {
					color: #0054a7;
				}
			}
			> p {
				margin-top: 20px;
				font-size: min(1rem,5vw);
				line-height: 1.8;
				color: #222;
				text-align: justify;
			}
			> div {
				padding-top: 40px;
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				column-gap: 20px;
				row-gap: 20px;
				@media (width < 700px) {
					grid-template-columns: repeat(1, 1fr);
				}
				> article {
					display: grid;
					box-shadow: 0px 0px 6px rgba(76, 73, 72, 0.2);
					padding: 25px;
					@media (width < 350px) {
						padding: 20px;
					}
					> div {
						display: flex;
						column-gap: 10px;
						align-items: start;
						> img {
							width: 30px;
							@media (width < 350px) {
								width: 25px;
							}
						}
						> p {
							font-size: min(1.1rem,5vw);
							line-height: 1.6;
							color: #000;
							text-align: justify;
							font-weight: 600;
							@media (width < 350px) {
								line-height: 1.3;
							}
						}
					}
					> figure {
						text-align: center;
						padding-top: 30px;
						> img {
							max-width: 100%;
						}
					}
				}
			}
		}
	}
}
section.disposal {
	padding: 60px 5% 0 5%;
	> div {
		border-top: 1px solid #ced2d7;
		max-width: 1000px;
		margin-inline: auto;
		> div {
			padding-top: 60px;
			max-width: 900px;
			margin-inline: auto;
			> h2 {
				font-size: 1.5rem;
				line-height: 1.6;
				color: #000;
				font-weight: 600;
				> span {
					> b {
						color: #0054a7;
					}
				}
			}
			> p {
				margin-top: 20px;
				font-size: min(1rem,5vw);
				line-height: 2.2;
				color: #222;
				text-align: justify;
			}
			> div {
				padding-top: 40px;
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				column-gap: 20px;
				row-gap: 20px;
				@media (width < 700px) {
					grid-template-columns: repeat(1, 1fr);
				}
				> article {
					display: grid;
					box-shadow: 0px 0px 6px rgba(76, 73, 72, 0.2);
					padding: 25px;
					grid-template-rows: subgrid;
					grid-row: span 2;
					row-gap: 10px;
					@media (width < 350px) {
						padding: 20px;
					}
					&:nth-of-type(4) {
						> figure {
							padding-block: 40px;
						}
					}
					> div {
						display: flex;
						column-gap: 10px;
						align-items: start;
						> img {
							width: 30px;
							@media (width < 350px) {
								width: 25px;
							}
						}
						> p {
							font-size: min(1.1rem,5vw);
							line-height: 1.6;
							color: #000;
							text-align: justify;
							font-weight: 600;
							@media (width < 350px) {
								line-height: 1.3;
							}
						}
					}
					> figure {
						align-self: center;
						text-align: center;
						> img {
							max-width: 100%;
						}
					}
				}
			}
		}
	}
}
section.bottom {
	margin-top: 150px;
	padding: 100px 5% 100px 5%;
	background: url(./image/bottom.webp) #f0f5fa;
	background-position: 100% 0%;
	background-repeat: no-repeat;
	background-size: auto 100%;
	@media (width < 700px) {
		margin-top: 100px;
		padding: 100px 5% 200px 5%;
		background: url(./image/bottom_sp.webp) #f0f5fa;
		background-position: 0% 100%;
		background-repeat: no-repeat;
		background-size: 100% auto;
	}
	> div {
		max-width: 900px;
		margin-inline: auto;
		> p {
			font-size: min(1.1rem, 5.5vw);
			line-height: 2.2;
			color: #333;
			text-align: justify;
			> b {
				color: #0054a7;
			}
			> br {
				&:nth-of-type(2),&:nth-of-type(3),&:nth-of-type(8) {
					@media (width < 700px) {
						display: none;
					}
				}
			}
		}
	}
}