/* TOPのsession初回だけ流れるオープニング。旧サイトの回転印象を現行markで再構成。 */
.top-opening {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	background: #f7e730;
	opacity: 1;
	visibility: visible;
}

.top-opening.is-playing {
	display: flex;
	animation: top-opening-out 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2s forwards;
}

.top-opening__logo {
	width: 160px;
	height: auto;
	transform-origin: 50% 50%;
	backface-visibility: hidden;
	will-change: transform;
}

.top-opening.is-playing .top-opening__logo {
	animation: top-opening-spin 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s both;
}

@keyframes top-opening-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(1440deg); }
}

@keyframes top-opening-out {
	to { opacity: 0; visibility: hidden; }
}

html.is-opening,
html.is-opening body {
	overflow: hidden;
}

@media (max-width: 767px) {
	.top-opening__logo { width: 80px; }
}

@media (prefers-reduced-motion: reduce) {
	.top-opening { display: none !important; }
	.top-opening__logo { animation: none !important; }
}