/* --------------------------------------------------
Contents
-------------------------------------------------- */
body #wrapper #contents_wrapper .movie-container { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; }
body #wrapper #contents_wrapper .movie-container .movie-wrapper { position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); }
body #wrapper #contents_wrapper .movie-container .movie-wrapper video { width: 100%; }
body #wrapper #contents_wrapper #contents { position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; }
body #wrapper #contents_wrapper #contents .textarea { text-align: center; }
body #wrapper #contents_wrapper #contents .textarea > * { opacity: 0; }
body #wrapper #contents_wrapper #contents .textarea h2 { font-size: 1.5rem; letter-spacing: .05em; margin: 0 0 8px; }
body #wrapper #contents_wrapper #contents .textarea .en { font-size: 1.2rem; line-height: 1.58; letter-spacing: .02em; margin: 0 0 25px; }
body #wrapper #contents_wrapper #contents .textarea .jp { font-size: 1.2rem; line-height: 1.75; letter-spacing: .02em; }
body.is-loaded #wrapper #contents_wrapper #contents .textarea > * { opacity: 1; transition: opacity 2s ease .3s; }
body.is-loaded #wrapper #contents_wrapper #contents .textarea > *:nth-child(2) { transition-delay: 0.8s; }
body.is-loaded #wrapper #contents_wrapper #contents .textarea > *:nth-child(3) { transition-delay: 1.3s; }

@media screen and (orientation: landscape) { body #wrapper #contents_wrapper #contents .textarea h2 { font-size: 1.1vw; margin: 0 0 0.6vw; }
  body #wrapper #contents_wrapper #contents .textarea .en { font-size: 1vw; line-height: 1.57; margin: 0 0 1.7vw; }
  body #wrapper #contents_wrapper #contents .textarea .jp { font-size: 0.9vw; line-height: 1.69; } }
