.opening::before { content: ""; position: fixed; inset: 0; background: var(--bg); clip-path: circle(150% at 50% 50%); transition: clip-path 1s cubic-bezier(.7, 0, .2, 1); z-index: 1000; }
.opening__logo { position: fixed; top: 50%; left: 0; right: 0; transform: translateY(-40%); margin: auto; width: 300px; text-align: center; z-index: 1001; color: var(--ink); opacity: 0; transition: opacity 1s ease, transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.opening__logo .script { display: block; font-size: 16rem; }
.opening__logo small { display: block; font-family: var(--font-en); font-size: 1.6rem; letter-spacing: .3em; line-height: 1; margin-top: 4px; }
.opening.is-act .opening__logo { opacity: 1; transform: translateY(-50%); }
.opening.is-hidden .opening__logo { opacity: 0; transition-duration: .4s; }
.opening.is-hidden::before { clip-path: circle(0% at 50% 100%); }
.opening.is-hidden { pointer-events: none; }
.is-capture .opening { display: none; }
@media (max-width: 767px) {
  .opening__logo { width: 220px; }
  .opening__logo .script { font-size: 12rem; }
  .opening__logo small { font-size: 1.2rem; }
}