/* poster */
.poster {
	position: relative;
	width: 100%;
	min-height: 200dvh;
	opacity: 1;
	transition: opacity 0.5s ease-out;
	will-change: opacity;
}

.poster article {
	position: relative;
	width: 100%;
	min-height: 200dvh;
}

.poster figure {
	position: sticky;
	top: 0;
	width: 100%;
	height: 100dvh;
	margin: 0;
	aspect-ratio: auto;
	z-index: 1;
	overflow: hidden;
}

.poster figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.poster .artxt {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 9%;
	z-index: 2;
	width: 27%;
	padding: 3rem;
	color: rgb(var(--b) / 1);
	gap: 0;
	overflow: visible;
}

.popup-content .poster .artxt {
	position: absolute;
	top: 25%;
	transform: translateY(-50%);
	left: 9%;
	z-index: 2;
	width: 36%;
	padding: 0;
	border-radius: 1rem;
	color: rgb(var(--b) / 1);
	gap: 0;
}

.poster .artxt dt {
	width: 200%;
	padding: 0;
	overflow-x: visible;
}

.poster .artxt dd {
	width: 100%;
	padding: 3rem;
}

.poster ul {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 9%;
	z-index: 2;
	width: 27%;
	padding: 4rem;
	border-radius: 1rem;
	color: rgb(var(--b) / 1);
	gap: 0;
}

.popup-content .poster ul {
	position: absolute;
	top: 25%;
	transform: translateY(-50%);
	right: 9%;
	z-index: 2;
	width: 27%;
	padding: 4rem;
	border-radius: 1rem;
	color: rgb(var(--b) / 1);
	gap: 0;
}

.poster ul li span {
	font-weight: 600;
}