@charset "UTF-8";
html { font-size: 62.5%; }

body { margin: 0; padding: 0; height: 100%; color: #eee; font-family: "Helvetica Neue", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", Arial, "メイリオ", Meiryo, serif; font-weight: 500; background: #0b0808; }

a { color: #eee; text-decoration: underline; }

img { max-width: 100%; }

#top .content { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: url(../img/teaser_top.jpg) no-repeat center center; background-size: cover; }

@media screen and (max-width: 880px) { #top .content { background-position: 76% center; } }

#top .inner { width: 90%; margin: auto; }

#top h1 { /*margin: 0; font-weight: normal; .t1 { font-size: 5rem; letter-spacing: .2rem; } .t2 { font-size: 6.6rem; letter-spacing: .3rem; } @include sm { .t1 { display: inline-block; font-size: 2.8rem; } .t2 { display: inline-block; margin-top: 1rem; font-size: 2.0rem; } }*/ margin: 6rem 0 0; font-weight: normal; font-size: 2.6rem; }

@media screen and (max-width: 880px) { #top h1 { font-size: 1.8rem; } }

#top p { margin: 1rem 0 0; font-size: 2.2rem; line-height: 2; letter-spacing: .3rem; }

@media screen and (max-width: 880px) { #top p { margin: 2rem 0 0; font-size: 1.6rem; letter-spacing: .2rem; } }

#top .logo { width: 900px; }

@media screen and (max-width: 880px) { #top .logo { width: 100%; } }

#story .content { margin: 8rem auto 0; }

#story .inner { width: 90%; margin: auto; text-align: center; }

#story .inner h2 { margin: 5rem 0 0; color: #97817e; font-size: 2.8rem; font-weight: normal; }

#story .inner p { margin: 2rem 0 0; font-size: 1.6rem; line-height: 2; letter-spacing: .3rem; }

@media screen and (max-width: 880px) { #story .inner h2 { font-size: 2.2rem; }
  #story .inner p { font-size: 1.4rem; letter-spacing: .2rem; } }

#copyright { padding-bottom: 3rem; }

#copyright .content { margin: 8rem auto 0; padding-top: 3rem; text-align: center; border-top: 1px solid #2e201e; }

#copyright p { color: #aaa; font-size: 1.1rem; letter-spacing: .2rem; }

@media screen and (max-width: 880px) { #copyright p { font-size: 1rem; } }

#copyright a img { width: 8%; opacity: .8; }

@media screen and (max-width: 880px) { #copyright a img { width: 20%; } }

.cast { margin-top: 2rem; text-align: center; background: #010600; }

.content-full { width: 100%; height: 100vh; }

.visible-sm { display: none; }

.flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.flex > div, .flex > p { text-align: left; }

@media screen and (max-width: 880px) { .visible-sm { display: inline; } }