section.panel {
	padding: 40px 5% 0px 5%;
	@media (width < 550px) {
		padding: 40px 0% 0px 0%;
	}
	> div {
		max-width: 1920px;
		margin-inline: auto;
		display: grid;
		> picture {
			padding-inline: 4%;
			grid-area: 1/1/2/2;
			@media (width < 550px) {
				padding-inline: 0%;
			}
			> img {
				width: 100%;
				max-width: 100%;
			}
		}
		> div {
			grid-area: 1/1/2/2;
			justify-self: start;
            align-self: center;
			@media (width < 550px) {
				padding-left: 2%;
			}
			> figure {
				> img {
					width: 28vw;
					@media (width < 550px) {
						width: 30vw;
					}
				}
			}
			> p {
				display: inline-block;
				padding-block: 2px 4px;
				padding-inline: 40px;
				margin-top: 10px;
				margin-right: 4%;
				text-align: center;
				background: linear-gradient(to right,#4065ff,#48edfc);
				font-size: min(1.1rem, 6vw);
				line-height: 1.5;
				color: #fff;
				white-space: nowrap;
			}
		}
	}
}
section.breadcrumbs {
	padding-inline: 8.5vw;
	@media (width < 550px) {
		padding-inline: 5vw;
	}
}
section.equipment {
	display: grid;
	background-image: url(./image/bg_text.svg);
	background-repeat: no-repeat;
	background-position: 100% 100%;
	background-size: 1000px auto;
	@media (width < 1300px) {
		background-image: url(./image/bg_text.svg);
		background-repeat: no-repeat;
		background-position: 100% 100%;
		background-size: 90% auto;
	}
	> div.bg {
		grid-area: 1/1/2/2;
		align-self: end;
		> figure {
			> img {
				max-width: 100%;
				object-fit: cover;
				object-position: 100% center;
				height: 100%;
				width: 100%;
				max-height: 1900px;
				@media (width < 1370px) {
					max-width: 100%;
					object-fit: cover;
					object-position: center 100%;
					height: 100%;
					width: 100%;
					max-height: unset;
				}
			}
		}
	}
	> div.main {
		align-self: start;
		padding: 0px 5% 100px 5%;
		grid-area: 1/1/2/2;
		> div {
			max-width: 1000px;
			margin-inline: auto;
			> h3 {
				font-size: min(2.5rem, 8vw);
				line-height: 1.5;
				color: #000;
				font-weight: 700;
			}
			> p {
				margin-top: 3px;
				font-size: 1.2rem;
				line-height: 1.0;
				color: var(--color-accent2);
				font-weight: 600;
			}
			> div {
				margin-top: 60px;
				display: grid;
				grid-template-columns: 1fr 1fr;
				column-gap: 40px;
				row-gap: 40px;
				@media (width < 860px) {
					grid-template-columns: 1fr;
					row-gap: 50px;
				}
				> article {
					display: grid;
					grid-template-rows: subgrid;
					grid-row: span 2;
					row-gap: 0;
					filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.25));
					> figure {
						> img {
							max-width: 100%;
						}
					}
					> div {
						background-color: #fff;
						padding-block: 20px 40px;
						padding-inline: 30px;
						display: grid;
						@media (width < 450px) {
							padding-inline: 15px;
						}
						> h4 {
							font-size: min(1.3rem, 6vw);
							line-height: 1.0;
							color: #000;
							font-weight: 500;
							text-align: center;
						}
						> p {
							padding-block: 10px 20px;
							font-size: min(1.1rem, 5vw);
							line-height: 1.6;
							color: #222;
							font-weight: 500;
							text-align: justify;
						}
						> a {
							align-self: end;
							justify-self: center;
							text-decoration: none;
							&:hover {
								opacity: 0.8;
							}
							> p {
								display: inline-block;
								border-radius: 50px;
								background-image: url(./image/link.svg);
								background-repeat: no-repeat;
								background-position: right 10px top 50%;
								padding-block: 10px;
								padding-inline: 40px;
								background-color: #002060;
								font-size: min(1.2rem, 4.5vw);
								line-height: 1.0;
								color: #fff;
							}
						}
					}
				}
			}
		}
	}
}