section.panel {
	position: relative;
	> picture {
		max-width: 3840px;
		margin-inline: auto;
		> img {
			max-width: 100%;
			max-height: 100vh;
			width: 100%;
			object-fit: cover;
			object-position: 0 50%;
		}
	}
	> div {
		position: absolute;
		top: 50%;
		left: 50%;
		font-size: min(2.6rem, 6.5vw);
		line-height: 1.3;
		color: #111;
		font-weight: 600;
		white-space: nowrap;
		transform: translate(-50%, -50%);
		animation-name: panelTextMove;
		animation-duration: 1s;
		animation-fill-mode: forwards;
		animation-timing-function: ease-out;
	}
}
@keyframes panelTextMove {
	0% {
		margin-left: 50px;
		opacity: 0;
	}
	100% {
		margin-left: 0px;
		opacity: 1;
	}
}
section.link {
	padding: 80px 5% 80px 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			text-align: center;
            font-size: min(2.5rem, 7vw);
            line-height: 1.6;
            color: #000;
            font-weight: 600;
		}
		> div.block {
			padding-block: 40px 80px;
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			column-gap: 40px;
			row-gap: 40px;
			@media (width < 930px) {
				grid-template-columns: repeat(1, 1fr);
			}
			&.oneitem {
				max-width: 50%;
				grid-template-columns: repeat(1, 1fr);
				margin-inline: auto;
				@media (width < 930px) {
					max-width: 100%;
				}
			}
			> a {
				text-decoration: none;
				&:hover {
					opacity: 0.8;
				}
				> article {
					border-radius: 50px;
					width: 95%;
					padding-block: 20px;
					justify-self: center;
					background: url(./image/downlink.svg), linear-gradient(to top, #171c61, #006bb4);
					background-position: 95% 50%;
					background-repeat: no-repeat;
					padding-inline: calc(5% + 35px);
					> h3 {
						text-align: center;
						font-size: min(2.0rem, 6vw);
						line-height: 1.0;
						color: #fff;
						font-weight: 600;
						> small {
							font-size: min(1.5rem, 5.0vw);
						}
					}
				}
			}
		}
	}
}