section.panel {
	background-color: #eee;
	> div {
		max-width: 1920px;
		margin: 0 auto;
		> img {
			max-width: 100%;
		}
	}
}

section.intro {
	padding: 60px 5% 100px 5%;
	> div {
		max-width: 800px;
		margin-inline: auto;
		> h1 {
			margin-top: 15px;
			font-size: min(3.0rem, 10vw);
			line-height: 1.3;
			color: #000;
			font-weight: 600;
			text-align: center;
		}
		> p {
			margin-top: 30px;
			font-size: 1.1rem;
			line-height: 1.4;
			color: #222;
			text-align: center;
		}
	}
}

section.link {
	padding: 0px 5% 60px 5%;
	> div {
		max-width: 900px;
		margin-inline: auto;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap: 40px;
		row-gap: 40px;
		&:nth-of-type(1) {
			justify-self: start;
		}
		&:nth-of-type(2) {
			justify-self: end;
		}
		@media (width < 870px) {
			grid-template-columns: repeat(2, 1fr);
			column-gap: 40px;
			row-gap: 40px;
		}
		@media (width < 560px) {
			grid-template-columns: repeat(1, 1fr);
			row-gap: 30px;
		}
		> a {
			text-decoration: none;
			&:hover {
				> div {
					animation-name: linkArrowMove;
					animation-duration: 0.5s;
					animation-timing-function: ease;
					animation-iteration-count: infinite;
				}
			}
			> div {
				padding: 0px 40px 10px 20px;
				border-bottom: 2px solid #e89a3d;
				background-image: url(./image/chevron_down_e89a3d.svg);
				background-repeat: no-repeat;
				background-position: calc(100% - 20px) calc(50% - 5px);
				background-size: 10px;
				> p {
					text-align: center;
					font-size: min(1.5rem, 6vw);
					line-height: 1.0;
					color: #333333;
					font-weight: 800;
					letter-spacing: 0.5px;
				}
			}
		}
	}
}
@keyframes linkArrowMove {
	0% {
		background-position: calc(100% - 20px) calc(50% - 5px);
	}
	50% {
		background-position: calc(100% - 20px) calc(65% - 5px);
	}
	100% {
		background-position: calc(100% - 20px) calc(50% - 5px);
	}
}
section.commonitem {
	padding: 100px 5% 100px 5%;
	> div {
		max-width: 900px;
		margin-inline: auto;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			padding-bottom: 80px;
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-align: center;
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 160px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 0px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						&:nth-of-type(n + 2) {
							font-size: min(0.9rem,4.5vw);
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.new {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.building {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.repair {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
			> small {
				font-size: min(1.6rem, 6.5vw);
				font-weight: 600;
				line-height: 2.0;
			}
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.civil {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.cost {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.architect {
	padding: 100px 5% 100px 5%;
	> div {
		background-color: #fffdf3;
		max-width: 1000px;
		margin-inline: auto;
		padding: 80px 50px;
		@media (width < 620px) {
			padding: 60px 20px;
		}
		> h3 {
			font-size: min(2.2rem, 8vw);
			line-height: 1.0;
			color: #6e4123;
			font-weight: 700;
			letter-spacing: 0.1em;
			padding-bottom: 30px;
			> small {
				font-size: min(1.6rem, 6.5vw);
				font-weight: 600;
				line-height: 2.0;
			}
		}
		> dl {
			> div {
				min-height: 80px;
				display: grid;
				grid-template-columns: 140px 1fr;
				column-gap: 30px;
				&:first-child {
					> dt {
					}
					> dd {
						@media (width < 880px) {
							border-top: none;
						}
					}
				}
				&:last-of-type {
					> dt {
						border: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
							border-top: 1px solid #808080;
						}
					}
					> dd {
						border: none;
					}
				}
				&.noborderbottom {
					> dt {
						border-bottom: none;
						@media (width < 880px) {
							border-bottom: 1px solid #808080;
						}
					}
					> dd {
						border-bottom: none;
					}
				}
				@media (width < 880px) {
					grid-template-columns: 1fr;
					height: auto;
				}
				> dt {
					font-size: min(1.1rem,4.5vw);
					line-height: 1.3;
					color: #333;
					font-weight: 500;
					padding-block: 30px;
					padding-inline: 0px 30px;
					border-bottom: 1px solid #808080;
					@media (width < 880px) {
						border-bottom: 1px solid #808080;
						border-top: 1px solid #808080;
						margin-top: 50px;
					}
				}
				> dd {
					align-content: center;
					border-bottom: 1px solid #808080;
					color: #333;
					font-size: min(1.0rem,5vw);
					line-height: 2.0;
					padding-block: 30px;
					padding-inline: 20px;
					@media (width < 600px) {
						padding-block: 20px;
						padding-inline: 10px;
					}
					> p {
						&:nth-of-type(2) {
							padding-top: 20px;
						}
						> small {
							font-size: min(0.9rem,4.5vw);
						}
						&.down {
							text-indent: -1em;
							padding-left: 1em;
							font-size: min(0.9rem,4.5vw);
						}
						&.topspace {
							padding-top: 20px;
						}
					}
					> dl {
						> div {
							padding-block: 10px;
							display: grid;
							grid-template-columns: 200px 1fr;
							column-gap: 10px;
							&:nth-of-type(1) {
								border-top: none;
							}
							@media (width < 740px) {
								grid-template-columns: 1fr;
								row-gap: 30px;
							}
							> dt {
								background-color: #e89a3d;
								border-radius: 30px;
								text-align: center;
								color: #fff;
								align-self: start;
								font-weight: 800;
							}
						}
					}
					@media (width < 880px) {
						border: none;
					}
				}
			}
		}
	}
}
section.pagelink {
	padding: 0px 5% 120px 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> div.link {
			margin-top: 60px;
			display: flex;
			flex-wrap: wrap;
			column-gap: 60px;
			row-gap: 40px;
			justify-content: center;
			@media (width < 540px) {
				row-gap: 30px;
			}
			> a {
				text-decoration: none;
				&:hover {
					opacity: 0.8;
				}
				> div {
					padding: 15px 60px 15px 30px;
					@media (width < 540px) {
						padding: 15px 40px 15px 20px;
					}
					> p {
						color: #fff;
						font-size: min(2.2rem, 5vw);
						line-height: 1.3;
						font-weight: 800;
					}
				}
				&:nth-of-type(1) {
					> div {
						border-radius: 10px;
						background: url(./image/arrow_fff.svg) #4eafff;
						background-size: 10px;
						background-repeat: no-repeat;
						background-position: calc(100% - 30px) 51%;
						@media (width < 540px) {
							background-position: calc(100% - 20px) 51%;
						}

					}
				}
			}
		}
	}
}
section.bottom {
	> div {
		> figure {
			> img {
				width: 100%;
				max-width: 100%;
			}
		}
	}
}