section.stage {
	max-width: 1100px;
	margin-inline: auto;
	> div {
		display: grid;
		grid-template-columns: 420px 1fr;
		column-gap: 30px;
		padding: 20px;
		@media (width < 900px) {
			grid-template-columns: 1fr;
		}
		> div {
			position: sticky;
			top: 20px;
			height: 100svh;
			display: flex;
			flex-direction: column;
			row-gap: 2px;
			margin-bottom: 80px;
			@media (width < 900px) {
				position: static;
				height: auto;
				margin-bottom: 30px;
			}
			> h1 {
				background-color: #a94f3b;
				border-radius: 50px;
				padding-block: 6px;
				padding-inline: 10px;
				font-size: 1.1rem;
				line-height: 1.3;
				font-weight: 500;
				color: #fff;
				text-align: center;
				margin-bottom: 5px;
			}
			> div.each {
				display: grid;
				grid-template-columns: 1fr 1fr;
				column-gap: 5px;
				row-gap: 5px;
				> a {
					display: block;
					font-size: 0.8rem;
					line-height: 1.3;
					color: #a94f3b;
					text-decoration: none;
					border: solid 1px #a94f3b;
					border-radius: 50px;
					background-color: #fff;
					padding-block: 2px;
					padding-inline: 10px;
					transition: 0.05s;
					&:hover {
						background-color: #a94f3b;
						color: #fff;
					}
				}
			}
			> div.all {
				margin-top: 5px;
				> a {
					display: block;
					font-size: 0.9rem;
					line-height: 1.3;
					color: #a94f3b;
					text-decoration: none;
					border: solid 1px #a94f3b;
					border-radius: 50px;
					background-color: #fff;
					padding-block: 4px;
					padding-inline: 10px;
					transition: 0.05s;
					text-align: center;
					&:hover {
						background-color: #a94f3b;
						color: #fff;
					}
				}
			}
		}
		> article {
			max-width: 800px;
			> object {
				display: block;
				width: 100%;
				aspect-ratio: 1/1.5;
			}
		}
	}
}
