@charset "utf-8";

/* --------------------

- style.css

-------------------- */
main {
  position: relative;
  z-index: 1;
}

.wind {
  min-width: 1280px;
  pointer-events: none;
  position: fixed;
  top: 0;
  width: 100%;
}

.wind-fore { z-index: 101; }
.wind-back {z-index: 0;}

.wind-a {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 0;
  transform: translateX(80px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 942.5px;
}

.wind-b {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 1.5px;
  transform: translateX(362px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 624px;
  z-index: -1;
}

.wind-c {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 898px;
  transform: translateX(-1504px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 1226.5px;
  z-index: -1;
}

@media screen and (max-width: 767px) {

  .wind {
    min-width: 100%;
  }

  .wind-back {
    /* z-index: -1; */
  }

  .wind-a {
    left: 0;
    margin: 0 0 0 115px;
    width: 100%;
  }

  .wind-b {
    left: 0;
    margin: 0 0 0 -167px;
    width: 100%;
    /* top: 14.84375vw; */
  }

  .wind-c {
    left: 0;
    margin: 0 0 0 1309px;
    top: 0;
    width: 100%;
  }

}

/* --------------------
- top
-------------------- */
.top { padding: 0 0 128px; }

.wind-d {
  bottom: -85px;
  left: -322px;
  opacity: 0;
  position: absolute;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 676.5px;
  z-index: 3;
}

.cp {
  position: absolute;
  right: 0;
  top: 510px;
  transition: .2s;
  width: 178px;
  z-index: 3;
}

.cp:hover { transform: translateX(15px); }

.cp a:hover { opacity: 1; }

.kv {
  margin: 0 auto 170px;
  padding: 64px 0 0;
  position: relative;
  width: 1280px;
}

.kv-slider {
  height: 732px;
  position: relative;
}

.kv-slider-img li {
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  transform: skewY(-5.03deg);
  transform-origin: left bottom;
  width: 1196px;
}

.kv-slider-img li span {
  height: 100%;
  position: absolute;
  left: 100%;
  top: 0;
  width: 100%;
  z-index: 1;
}

.kv-cover-0 {
  background: rgb(0, 220, 255);
  background: linear-gradient(160deg, rgba(0,220,255,1) 0%, rgba(70,249,173,1) 100%);
}
.kv-cover-1 {
  background: rgb(255, 142, 174);
  background: linear-gradient(160deg, rgba(255, 142, 174, 1) 0%, rgba(255, 204, 41, 1) 100%);
}
.kv-cover-2 {
  background: rgb(255, 255, 109);
  background: linear-gradient(160deg, rgba(255, 255, 109, 1) 0%, rgba(139, 255, 70, 1) 100%);
}

.kv-cover-3 {
  background: #d80004;
  background: linear-gradient(160deg, rgba(191, 191, 133, 1) 0%, rgba(224, 219, 194, 1) 100%);
}

.kv-cover-4 {
  background: #fdff6e;
  background: linear-gradient(160deg, rgba(146, 50, 98, 1) 0%, rgba(217, 0, 0, 1) 100%);
}

.kv-cover {
  animation: cover 1.4s cubic-bezier(.77, 0, .175, 1);
}

@keyframes cover {
  0% { left: 100%; }
  50% { left: 0; }
  100% { left: -100%; }
}

.kv-slider-img li img {
  opacity: 0;
  transform: skewY(5.03deg);
  transform-origin: left bottom;
}

.kv-slider-img li:first-child img { opacity: 1; }

.kv-slider-btn {
  position: absolute;
  right: 110px;
  top: 240px;
  width: 7px;
  z-index: 2;
}

.kv-slider-btn li {
  cursor: pointer;
  display: block;
  height: 7px;
  margin: 0 auto 15px;
  position: relative;
  width: 7px;
}

.kv-slider-btn li:last-child { margin: auto; }

.kv-slider-btn li::after {
  background: url('../img/top/kv/on.png') no-repeat left top;
  background-size: 7px auto;
  content: '';
  height: 7px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: 1.4s;
  width: 7px;
}

.act::after { opacity: 1 !important; }

.kv-slider-btn li img { vertical-align: top; }

.kv-txt {
  bottom: -22px;
  position: absolute;
  right: 84px;
  width: 665px;
  z-index: 3;
}

.bnr {
  background: url('../img/top/bnr/bg.png') no-repeat left top;
  background-size: 100% auto;
  height: 175px;
  margin: 0 auto 35px;
  padding: 37px 0 44px;
  position: relative;
  width: 1137px;
  z-index: 2;
}

.bnr-container {
  margin: 0 auto;
  width: 1060px;
}

.swiper-button-prev {
  --swiper-navigation-sides-offset: -55px;
  background-image: url(../img/top/team/prev.png);
  background-size: 100% auto;
  height: 55.5px;
  left: -55px;
  outline: none;
  width: 35px;
}

.swiper-button-next {
  --swiper-navigation-sides-offset: -55px;
  background-image: url('../img/top/team/next.png');
  background-size: 100% auto;
  height: 55.5px;
  right: -55px;
  outline: none;
  width: 35px;
}

.bnr-box {
  width: 244px;
  height: 94px;
  overflow: hidden;
}

.bnr ul li a {
  display: block;
}

.bnr ul li:nth-last-child(1) {
  margin: 0;
}

.tieup-bnr {
  width: 1120px;
  margin: 0 auto 122.5px;
  position: relative;
}

.tieup-bnr-container {
}

.tieup-bnr-box {
  width: 214px;
  height: 70px;
}

.tieup-bnr-box a img {
  width: 100%;
}

.tieup-bnr-prev,
.tieup-bnr-next {
  display: none;
}

.team {
  margin: 0 auto 80px;
  position: relative;
  width: 1280px;
  z-index: 1;
}

.team h2 {
  margin: 0 auto 40px;
  width: 258px;
}

.team-box {
  height: 495px;
  margin: 0 auto;
  position: relative;
  width: 1116px;
}

.arrow {
  left: 50%;
  position: absolute;
  top: 10px;
  transform: translateX(-50%);
  width: 32px;
  z-index: 4;
}

.team-slider { padding: 40px 0; }

.team-slider ul li {
  border: 1px solid #fff;
  cursor: pointer;
  left: 50%;
  position: absolute;
  transform: translate3d(0, 0, 0);
  transition: filter .4s, transform .6s, z-index .4s;
  width: 288px;
}

.team-slider ul li:hover { filter: brightness(1.2); }

.team-slider ul li::after {
  content: '';
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: .8s;
  width: 100%;
}

.team-slider ul li:first-child::after {
  background: url('../img/top/team/0.png') no-repeat left top;
  background-size: 100% auto;
}

.team-slider ul li:first-child.team-future-1::after,
.team-slider ul li:first-child.team-future-2::after {
  background: url('../img/top/team/0_right.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:first-child.team-past-1::after,
.team-slider ul li:first-child.team-past-2::after  {
  background: url('../img/top/team/0_left.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(2)::after  {
  background: url('../img/top/team/1.png') no-repeat left top;
  background-size: 100% auto;
}

.team-slider ul li:nth-child(2).team-future-1::after,
.team-slider ul li:nth-child(2).team-future-2::after {
  background: url('../img/top/team/1_right.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(2).team-past-1::after,
.team-slider ul li:nth-child(2).team-past-2::after  {
  background: url('../img/top/team/1_left.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(3)::after  {
  background: url('../img/top/team/2.png') no-repeat left top;
  background-size: 100% auto;
}

.team-slider ul li:nth-child(3).team-future-1::after,
.team-slider ul li:nth-child(3).team-future-2::after {
  background: url('../img/top/team/2_right.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(3).team-past-1::after,
.team-slider ul li:nth-child(3).team-past-2::after  {
  background: url('../img/top/team/2_left.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(4)::after  {
  background: url('../img/top/team/3.png') no-repeat left top;
  background-size: 100% auto;
}

.team-slider ul li:nth-child(4).team-future-1::after,
.team-slider ul li:nth-child(4).team-future-2::after {
  background: url('../img/top/team/3_right.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(4).team-past-1::after,
.team-slider ul li:nth-child(4).team-past-2::after  {
  background: url('../img/top/team/3_left.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(5)::after  {
  background: url('../img/top/team/4.png') no-repeat left top;
  background-size: 100% auto;
}

.team-slider ul li:nth-child(5).team-future-1::after,
.team-slider ul li:nth-child(5).team-future-2::after {
  background: url('../img/top/team/4_right.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-slider ul li:nth-child(5).team-past-1::after,
.team-slider ul li:nth-child(5).team-past-2::after  {
  background: url('../img/top/team/4_left.png') no-repeat left top;
  background-size: 100% auto;
  opacity: 1;
}

.team-current {
  box-shadow: 10px 10px 20px rgba(25, 76, 75, .5);
  transform: translateX(-50%) scale(1) !important;
  z-index: 3;
}

.team-future-1 {
  box-shadow: 10px 10px 20px rgba(25, 76, 75, .5);
  transform: translateX(31%) scale(.75) !important;
  z-index: 2;
}

.team-past-1 {
  box-shadow: 10px 10px 15px rgba(25, 76, 75, .5);
  transform: translateX(-132.5%) scale(.75) !important;
  z-index: 2;
}

.team-future-2 {
  box-shadow: 5px 5px 7px rgba(25, 76, 75, .4);
  transform: translateX(91.5%) scale(.59) !important;
  z-index: 1;
}

.team-past-2 {
  box-shadow: 5px 5px 7px rgba(25, 76, 75, .4);
  transform: translateX(-194%) scale(.59) !important;
  z-index: 1;
}

.team-prev,
.team-next {
  height: 55.5px;
  outline: none;
  position: absolute;
  transform: translateY(-50%);
  transition: .5s;
  top: 50%;
  width: 35px;
  z-index: 8;
}

.team-prev { left: 0; }

.team-next { right: 0; }

.team-prev:hover,
.team-next:hover { opacity: .5; }

.wind-e {
  left: -495px;
  opacity: 0;
  position: absolute;
  top: 50px;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 1442.5px;
  z-index: -1;
}

.pv-tw {
  margin: 0 auto;
  position: relative;
  width: 1280px;
  z-index: 0;
}

.pv-tw h2 {
  margin: 0 auto 50px;
  width: 411px;
}

.pv-tw-box {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  width: 1116px;
}

.pv { width: 528px; }

.pv h3 {
  margin: 0 auto 20px;
  width: 130px;
}

.pv-box {
  border: 1px solid #fff;
  box-shadow: 0 0 10px rgba(25, 76, 75, .8);
  height: 347px;
  background: #000;
}

.pv-box img {
  height: 100%;
  object-fit: contain;
  font-family: 'object-fit: contain;';  /*IE対策*/
}

.pv-play {
  cursor: pointer;
  margin: 25px auto 0;
  transition: .4s;
  width: 99px;
}

.pv-play:hover { opacity: .5; }

.tw { width: 528px; }

.tw h3 {
  margin: 0 auto 20px;
  width: 187px;
}

.tw-box {
  border: 1px solid #fff;
  box-shadow: 0 0 10px rgba(25, 76, 75, .8);
  height: 347px;
}

.tw p {
  margin: 25px auto 0;
  width: 99px;
}

.wind-f {
  left: 130px;
  opacity: 0;
  position: absolute;
  top: -20px;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 1065.5px;
  z-index: -1;
}

.pv-modal {
  align-items: center;
  background: rgba(255, 255, 255, .9);
  display: none;
  height: 100%;
  justify-content: center;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 102;
}

.pv-modal-box {
  background: #000;
  border: 1px solid #000;
  box-sizing: content-box;
  height: 480px;
  position: relative;
  width: 854px;
}

.pv-modal-close {
  cursor: pointer;
  position: absolute;
  right: 0;
  top: -90px;
  transition: .4s;
  width: 117px;
}

.pv-modal-close:hover { opacity: .5; }

#pv-video {
  height: 100%;
  width: 100%;
}

@media screen and (max-width: 767px) {

  .top { padding: 0 0 90px; }

  h1 {
    left: 4.375vw;
    position: absolute;
    top: 11.875vw;
    width: 63.4375vw;
    z-index: 3;
  }

  .kv-lid {
    background: #fff;
    height: 35.9375vw;
    left: 0;
    position: absolute;
    top: 0;
    transform: skewY(-5.03deg);
    transform-origin: left bottom;
    width: 100%;
    z-index: 2;
  }

  .wind-d { display: none; }

  .cp {
    bottom: -4.6875vw;
    right: 2%;
    top: auto;
    width: 38.75vw;
  }

  .cp:hover { transform: translateX(0); }

  .kv {
    margin: 0 auto 14.0625vw;
    padding: 25vw 0 0;
    width: 100%;
  }

  .kv-slider { height: auto; }

  .kv-slider-img { margin: 0 auto 3.75vw; }

  .kv-slider-img li { width: 100%; }

  .kv-slider-img li:last-child { position: static; }

  .kv-slider-img li img { display: block; }

  .kv-slider-img li:first-child img { opacity: 1; }

  .kv-slider-btn {
    box-sizing: content-box;
    display: flex;
    margin: 0 auto 12.5vw 0;
    padding: 0 0 0 5%;
    position: static;
    transform: skewY(-5.03deg);
    transform-origin: left bottom;
    width: 8.75vw;
  }

  .kv-slider-btn li {
    height: 1.5625vw;
    margin: 0 5.625vw 0 0;
    transform: skewY(5.03deg);
    width: 1.5625vw;
  }

  .kv-slider-btn li::after {
    background-size: 1.5625vw auto;
    height: 1.5625vw;
    width: 1.5625vw;
  }

  .kv-slider-btn li img {
    display: block;
    width: 1.5625vw;
    height: 1.5625vw;
  }

  .kv-txt {
    margin: 0 auto;
    position: static;
    width: 90%;
  }

  .bnr {
    background: url('../img/top/bnr/bg_sp.png') no-repeat left top;
    background-size: 100% auto;
    height: 38.75vw;
    margin: 0 auto 7.03125vw;
    padding: 0;
    width: 78.125vw;
  }

  .bnr .swiper-container {
    margin: 0 auto;
    padding: 6.25vw 0 0;
    width: 60.625vw;
  }

  .swiper-button-prev {
    --swiper-navigation-sides-offset: -7.8125vw;
    background-image: url('../img/top/team/prev.png');
    background-size: 100% auto;
    height: 10.9375vw;
    left: -7.8125vw;
    outline: none;
    width: 6.875vw;
  }

  .swiper-button-next {
    --swiper-navigation-sides-offset: -7.8125vw;
    background-image: url('../img/top/team/next.png');
    background-size: 100% auto;
    height: 10.9375vw;
    outline: none;
    right: -7.8125vw;
    width: 6.875vw;
  }

  .swiper-slide {
    height: auto;
  }

  .tieup-bnr {
    width: 78.125vw;
    margin: 0 auto 28.125vw;
  }
  
  .tieup-bnr-container {
    width: 73.125vw;
    position: relative;
    box-shadow: 1.5625vw 1.5625vw 1.5625vw rgba(25,76,75,.5);
  }
  
  .tieup-bnr-box {
    width: 73.125vw;
    height: 23.90625vw;
  }
  
  .tieup-bnr-box a img {
    width: 100%;
  }
  
  .tieup-bnr-prev,
  .tieup-bnr-next {
    display: block;
  }


  .team { width: 100%; }

  .team h2 {
    margin: 0 auto 6.25vw;
    width: 49.6875vw;
  }

  .team-box {
    height: auto;
    width: 100%;
  }

  .arrow {
    top: 2.1875vw;
    width: 5vw;
  }

  .team-slider {
    box-sizing: content-box;
    padding: 6.25vw 0;
  }

  .team-slider ul li {
    transition: transform .6s, z-index .6s;
    width: 41.5625vw;
  }

  .team-slider ul li:hover { filter: brightness(1); }

  .team-current { box-shadow: 7px 7px 10px rgba(25, 76, 75, .5); }

  .team-future-1 {
    box-shadow: 5px 5px 10px rgba(25, 76, 75, .5);
    transform: translateX(3.125vw) scale(.72) !important;
  }

  .team-past-1 {
    box-shadow: 5px 5px 10px rgba(25, 76, 75, .5);
    transform: translateX(-45.3125vw) scale(.72) !important;
  }

  .team-future-2 {
    box-shadow: 3px 3px 7px rgba(25, 76, 75, .4);
    transform: translateX(27.5vw) scale(.56) !important;
  }

  .team-past-2 {
    box-shadow: 3px 3px 7px rgba(25, 76, 75, .4);
    transform: translateX(-70vw) scale(.56) !important;
  }

  .team-prev,
  .team-next { display: none; }

  .wind-e {
    left: -10%;
    top: -11.7%;
    width: 100%;
  }

  .parallax-e { transition: .4s !important; }

  .pv-tw { width: 100%; }

  .pv-tw h2 {
    margin: 0 auto 7.8125vw;
    width: 45.9375vw;
  }

  .pv-tw-box {
    display: block;
    width: 100%;
  }

  .pv {
    margin: 0 auto 26.5625vw;
    width: 90%;
  }

  .pv h3 {
    margin: 0 auto 4.6875vw;
    width: 20.3125vw;
  }

  .pv h3 img { display: block; }

  .pv-box {
    box-shadow: 0 0 8px rgba(25, 76, 75, .8);
    height: 59.28vw;
  }

  .pv-play {
    margin: 4.6875vw auto 0;
    width: 18.75vw;
  }

  .pv-play:hover { opacity: 1; }

  .tw { width: 100%; }

  .tw h2 {
    margin: 0 auto 7.8125vw;
    width: 45.9375vw;
  }

  .tw h3 {
    margin: 0 auto 4.6875vw;
    width: 29.21875vw;
  }

  .tw h3 img { display: block; }

  .tw-box {
    box-shadow: 0 0 8px rgba(25, 76, 75, .8);
    height: 33.3vh;
    margin: 0 auto;
    width: 90%;
    overflow: hidden;
    background-size: cover;
  }

  .twitter-timeline {
    width: calc(90vw - 24px) !important;
    min-height: auto !important;
    height: calc(33.3vh - 24px) !important;
  }

  .tw p {
    margin: 4.6875vw auto 0;
    width: 18.75vw;
  }

  .wind-f {
    left: 5%;
    top: -5%;
    width: 100%;
  }

  .parallax-f { transition: .4s !important; }

  .wind-g {
    bottom: 20.7%;
    opacity: 0;
    left: -10%;
    position: absolute;
    transition: .7s cubic-bezier(1, 0, 0, 1);
    width: 100%;
    z-index: -1;
  }

  .parallax-g { transition: .4s !important; }

  .pv-modal-box {
    height: 50.58548009375001vw;
    width: 90vw;
  }

  .pv-modal-close {
    top: -18.75vw;
    width: 24.0625vw;
  }

  .pv-modal-close:hover { opacity: 1; }

}

/* --------------------
- archive news
-------------------- */
.arch-news { padding: 200px 0 120px; }

.arch-news h2 {
  margin: 0 auto 65px;
  width: 274px;
}

.tag {
  display: flex;
  justify-content: center;
  margin: 0 auto 65px;
  width: 730px;
  flex-wrap: wrap;
}

.tag li {width: 146px;margin: 0 0 10px;}

.tag li .act { opacity: .5; }

.coming-txt {
  padding: 100px 0;
  text-align: center;
  color: #0f1840;
}

.posts-list { margin: 0 auto 105px; }

.posts-list li {
  margin: 0 auto 70px;
  position: relative;
  width: 1116px;
}

.posts-list li:last-child { margin: 0 auto; }

.posts-list li a { display: block; }

.posts-thumb {
  background: #000;
  border: 1px solid #fff;
  box-shadow: 3px 3px 7px rgba(45, 60, 60, .5);
  display: block;
  height: 158px;
  left: 0;
  position: absolute;
  top: -13px;
  width: 281px;
  z-index: 1;
  overflow: hidden;
}

.new-icon {
  background: url('../img/news/new.png') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 67px;
  left: -20px;
  position: absolute;
  top: -38px;
  width: 68px;
  text-indent: -9999px;
  overflow: hidden;
  z-index: 2;
}

.posts-box {
  background: url('../img/news/bg.jpg') no-repeat left top;
  background-size: 100% auto;
  box-shadow: 3px 3px 7px rgba(45, 60, 60, .5);
  display: flex;
  height: 133px;
  margin: 0 0 0 281px;
  padding: 18px 0 0 35px;
  position: relative;
  width: 835px;
}

.posts-data {
  font-weight: 900;
  margin: 0 85px 0 0;
}

.news-tag {
  background: url('../img/news/frameA.png') no-repeat left top;
  background-size: 100% auto;
  font-style: italic;
  font-weight: 900;
  height: 39px;
  line-height: 39px;
  margin: 0 auto 10px;
  text-align: center;
  width: 143.5px;
}

.news-tag-mini {
  font-size: 14px;
}

.news-date {
  font-size: 15px;
  letter-spacing: .5px;
  line-height: 24px;
  padding: 0 0 0 3px;
}

.posts-cont { width: 445px; }

.posts-cont h3 {
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 1px;
  line-height: 24px;
  margin: 0 auto 15px;
  max-height: 48px;
  overflow: hidden;
  text-align: justify;
}

.posts-cont span {
  background: #fff;
  display: block;
  height: 2px;
  margin: 0 0 10px 0;
  width: 14px;
}

.posts-cont p {
  font-size: 13px;
  font-weight: 700;
  height: 20px;
  letter-spacing: 1px;
  overflow: hidden;
  text-align: justify;
}

.posts-more {
  bottom: 20px;
  position: absolute;
  right: 20px;
  width: 79px;
}

.posts-nav {
  display: flex;
  justify-content: center;
  font-size: 22px;
  font-style: italic;
}

.posts-nav li { margin: 0 30px 0 0; }

.posts-nav li:last-child { margin: 0; }

.current,
.posts-nav li a {
  color: #19234b;
  padding: 0 0 5px;
}

.current {
  border-bottom: 2px solid #19234b;
}

.next,
.prev { width: 136px; }

.next a img,
.prev a img { vertical-align: top; }

.nextpostslink,
.previouspostslink {
  width: 136px;
  height: 38px;
  display: block;
  text-indent: -9999px;
}

.nextpostslink {
  background: url("../img/news/next.png") no-repeat center top;
  background-size: 136px auto;
}

.previouspostslink {
  background: url("../img/news/prev.png") no-repeat center top;
  background-size: 136px auto;
}


@media screen and (max-width: 767px) {

  .arch-news { padding: 21.875vw 0 34.375vw; }

  .arch-news h2 {
    margin: 0 auto 12.5vw;
    width: 42.8125vw;
  }

  .tag {
    flex-wrap: wrap;
    margin: 0 auto 14.0625vw;
    width: 82.5vw;
  }

  .tag li {width: 27.5vw;margin: 0 0 1.5625vw;}

  .tag li:first-child,
  .tag li:nth-child(2),
  .tag li:nth-child(3) { margin: 0 0 1.5625vw; }

  .posts-list { margin: 0 auto 12.5vw; }

  .posts-list li {
    margin: 0 auto 10.9375vw;
    width: 90%;
  }

  .posts-thumb {
    box-shadow: 2px 2px 4px rgba(45, 60, 60, .5);
    height: 29.0625vw;
    top: -2.1875vw;
    width: 51.875vw;
  }

  .new-icon {
    height: 15.46875vw;
    left: -2.1875vw;
    top: -9.375vw;
    width: 15.625vw;
  }

  .posts-box {
    background: #20315d;
    box-shadow: 2px 2px 4px rgba(45, 60, 60, .5);
    display: block;
    height: auto;
    margin: 0 0 0 auto;
    padding: 4.6875vw 0 6.25vw;
    width: 87.8125vw;
  }

  .posts-data {
    margin: 0 0 2.1875vw auto;
    text-align: center;
    white-space: nowrap;
    width: 37.5vw;
  }

  .news-tag {
    font-size: 3.125vw;
    height: 7.1875vw;
    line-height: 6.875vw;
    margin: 0 auto 1.5625vw;
    width: 26.5625vw;
  }

  .news-tag-mini {
    font-size: 2.125vw;
  }

  .news-date {
    font-size: 2.5vw;
    margin: 0 auto;
    line-height: 3.75vw;
    padding: 0;
    text-align: left;
    width: 19.375vw;
  }

  .posts-line { margin: 0 auto 7.8125vw; }

  .posts-line img { display: block; }

  .posts-cont {
    padding: 0 6.25vw;
    width: 100%;
  }

  .posts-cont h3 {
    font-size: 3.4375vw;
    letter-spacing: 0;
    line-height: 5vw;
    margin: 0 auto 3.75vw;
  }

  .posts-cont span {
    height: 1px;
    margin: 0 0 2.1875vw 0;
    width: 2.1875vw;
  }

  .posts-cont p {
    font-size: 2.5vw;
    letter-spacing: 0;
    max-height: 7.5vw;
    height: auto;
    width: 43.75vw;
  }

  .posts-more { width: 19.6875vw; }

  .posts-nav { font-size: 6.875vw; }

  .posts-nav li { margin: 0 6.25vw 0 0; }

  .current,
  .posts-nav li a {
    font-size: 3.75vw;
    padding: 0;
  }

  .current-page a { border-bottom: 1px solid #19234b; }

  .next,
  .prev { width: 14.53125vw; }

  .next a img,
  .prev a img {
    display: block;
    vertical-align: baseline;
  }

  .nextpostslink,
  .previouspostslink {
    width: 14.53125vw;
    height: 3.75vw;
    margin: 4.375vw 0 0 0;
  }

  .nextpostslink {
    background: url("../img/news/next_sp.png") no-repeat center top;
    background-size: 100% auto;
  }

  .previouspostslink {
    background: url("../img/news/prev_sp.png") no-repeat center top;
    background-size: 100% auto;
  }

}

/* --------------------
- single news
-------------------- */
.sgl-news { padding: 200px 0 120px; }

.sgl-news h2 {
  margin: 0 auto 65px;
  width: 274px;
}

.article {
  background: #20315d;
  box-shadow: 3px 3px 7px rgba(45, 60, 60, .5);
  margin: 0 auto 120px;
  padding: 40px 0 90px;
  width: 1116px;
}

.article-data {
  display: flex;
  margin: 0 auto 40px;
  padding: 0 40px;
}

.news-detail-tag {
  background: url('../img/news/frameB.png') no-repeat left top;
  background-size: 100% auto;
  font-style: italic;
  font-weight: 900;
  height: 44px;
  line-height: 44px;
  margin: 0 20px 0 0;
  text-align: center;
  width: 167px;
}

.news-detail-date {
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .5px;
  position: relative;
}

.news-detail-date::after {
  background: #fff;
  bottom: 6px;
  content: '';
  height: 2px;
  position: absolute;
  right: -40px;
  width: 14px;
}

.article-heading {
  font-size: 19px;
  font-weight: 900;
  letter-spacing: 1px;
  margin: 0 auto 15px;
  width: 935px;
}

.article-thumb {
  border: 2px solid #191e1e;
  border-bottom-color: #778596;
  border-right-color: #778596;
  margin: 0 auto 40px;
  width: 935px;
}

.article-line {
  margin: 0 auto 40px;
  width: 1110px;
}

.article-box {
  min-height: 250px;
  padding: 0 270px 0 90.5px;
  position: relative;
}

.article-txt {
  font-size: 15px;
  font-weight: 700;
  line-height: 28px;
}

.article-txt iframe {
  max-width: 100%;
}

.article-txt img {
  width: auto;
  max-width: 100%;
  height: auto;
}

.article-share {
  position: absolute;
  right: 87px;
  top: 0;
}

.article-share li {
  margin: 0 auto 30px;
  width: 28px;
}

.article-share li:last-child { margin: 0 auto; }

.news-top {
  bottom: -55px;
  position: absolute;
  right: 40px;
  width: 130px;
}

.article-nav {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 767px) {

  .sgl-news { padding: 21.875vw 0 34.375vw; }

  .sgl-news h2 {
    margin: 0 auto 12.5vw;
    width: 42.8125vw;
  }

  .article {
    box-shadow: 3px 3px 4px rgba(45, 60, 60, .5);
    margin: 0 auto 10.9375vw;
    padding: 9.375vw 0;
    width: 90%;
  }

  .article-data {
    margin: 0 auto 7.8125vw;
    padding: 0;
    width: 71.875vw;
  }

  .news-detail-tag {
    font-size: 3.125vw;
    height: 6.71875vw;
    line-height: 6.71875vw;
    margin: 0.625 3.125vw 0 0;
    width: 25.625vw;
  }

  .news-tag-mini {
    font-size: 2.125vw;
  }

  .news-detail-date { font-size: 2.5vw; }

  .news-detail-date::after {
    bottom: 0.9375vw;
    height: 1px;
    right: -4.6875vw;
    width: 1.5625vw;
  }

  .article-heading {
    font-size: 3.125vw;
    letter-spacing: 0;
    margin: 0 auto 4.6875vw;
    width: 71.875vw;
  }

  .article-thumb {
    border: 1px solid #191e1e;
    margin: 0 auto 6.25vw;
    width: 71.875vw;
  }

  .article-line {
    margin: 0 auto 6.25vw;
    width: 100%;
  }

  .article-line img { display: block; }

  .article-box {
    min-height: auto;
    margin: 0 auto;
    padding: 0;
    width: 71.875vw;
  }

  .article-txt {
    font-size: 2.5vw;
    line-height: 5vw;
    margin: 0 auto 15.625vw;
  }

  .article-txt iframe {
    width: 100%;
    height: calc(71.875vw * .5625);
  }

  .article-share {
    display: flex;
    position: static;
  }

  .article-share li {
    margin: 0 9.375vw 0 0;
    width: 6.25vw;
  }

  .article-share li:last-child { margin: 0; }

  .article-share li img { display: block; }

  .news-top {
    bottom: 0;
    right: 0;
    width: 18.125vw;
  }

  .article-nav {
    display: flex;
    justify-content: center;
  }

}

/* --------------------
- about project
-------------------- */
.about {
  padding: 250px 0 120px;
  position: relative;
}

.about-bg {
  background: url('../img/about/bg.png') no-repeat center top;
  background-size: 2000px auto;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 0;
}

.concept {
  margin: 0 auto 240px;
  position: relative;
  width: 977px;
}

.concept-particle {
  left: 5px;
  opacity: 0;
  position: absolute;
  top: -40px;
  transform: scale(.8);
  transition: 1.2s cubic-bezier(1, 0, 0, 1);
  width: 900px;
  z-index: 1;
}

.concept-ball {
  opacity: 0;
  position: absolute;
  right: 95px;
  top: 185px;
  transform: translate(60px, -60px);
  transition: .7s cubic-bezier(.68, -.55, .265, 1.55);
  width: 100px;
  z-index: 1;
}

.concept-logo {
  opacity: 0;
  transform: scale(.7);
  transition: .7s cubic-bezier(1, 0, 0, 1.55);
}

.about h2 {
  margin: 0 auto 65px;
  width: 329px;
}

.txt-upper {
  margin: 0 auto 220px;
  opacity: 0;
  transform: translateX(-100px);
  transition: 1s cubic-bezier(1, 0, 0, 1);
}

.txt-upper p:first-child {
  margin: 0 auto 30px;
  width: 532px;
}

.txt-upper p:nth-child(2) {
  margin: 0 auto 35px;
  width: 801.5px;
}

.txt-upper p:last-child {
  margin: 0 auto;
  width: 688px;
}

.media {
  margin: 0 auto 175px;
  position: relative;
  width: 1069px;
}

.media-anime {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: -150px;
  transform: translate(-50%, 60px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 318px;
  z-index: 1;
}

.media-game {
  bottom: -100px;
  left: 85px;
  opacity: 0;
  position: absolute;
  transform: translateX(-60px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 318px;
  z-index: 1;
}

.media-event {
  bottom: -100px;
  opacity: 0;
  position: absolute;
  right: 85px;
  transform: translateX(60px);
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 318px;
  z-index: 1;
}

.media-arrow {
  left: 50%;
  margin: 0 0 0 -196px;
  opacity: 0;
  position: absolute;
  top: 175px;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 392px;
}

.rotate {
  animation: rotate .7s;
}

@keyframes rotate {
  0% { transform: rotate(-30deg) scale(1.2); }
  100% { transform: rotate(0deg) scale(1); }
}

.media-media {
  left: 50%;
  margin: 0 0 0 -114.5px;
  opacity: 0;
  position: absolute;
  top: 230px;
  transform: scale(.7);
  transition: .7s cubic-bezier(1, 0, 0, 1.55);
  width: 229px;
}

.media-circle {
  opacity: 0;
  transform: scale(.9);
  transition: 1s cubic-bezier(.77, 0, .175, 1);
}

.txt-lower {
  margin: 0 auto 95px;
  opacity: 0;
  transform: translateX(100px);
  transition: 1s cubic-bezier(1, 0, 0, 1);
}

.txt-lower p:first-child {
  margin: 0 auto 35px;
  width: 176.5px;
}

.txt-lower p:nth-child(2) {
  margin: 0 auto 25px;
  width: 764px;
}
/*
.txt-lower p:nth-child(3) {
  margin: 0 auto 40px;
  width: 781px;
}
*/

.txt-lower p:last-child {
  margin: 0 auto;
  width: 781px;
}

.big-logo {
  margin: 0 auto;
  width: 370px;
}

@media screen and (max-width: 767px) {

  .about { padding: 21.875vw 0 31.25vw; }

  .about-bg {
    background: url('../img/about/bg_sp.png') no-repeat center top;
    background-size: 100% auto;
  }

  .about h2 {
    margin: 0 auto 3.125vw;
    width: 54.6875vw;
  }

  .concept {
    margin: 0 auto 34.375vw;
    width: 100%;
  }

  .concept-particle {
    left: 0;
    top: 0;
    width: 100%;
  }

  .concept-ball {
    right: 8%;
    top: 34%;
    transform: translate(9.375vw, -9.375vw);
    width: 14.375vw;
  }

  .txt-upper { margin: 0 auto 37.5vw; }

  .txt-upper p:first-child {
    margin: 0 auto 4.6875vw;
    width: 100%;
  }

  .txt-upper p:nth-child(2) {
    margin: 0 auto 4.6875vw;
    width: 100%;
  }

  .txt-upper p:last-child { width: 100%; }

  .media {
    margin: 0 auto 28.125vw;
    width: 100%;
  }

  .media-anime {
    left: 0;
    margin: 0 0 0 50%;
    top: -22%;
    width: 100%;
  }

  .media-game {
    bottom: -20%;
    left: 0;
    width: 100%;
  }

  .media-event {
    bottom: -20%;
    right: 0;
    width: 100%;
  }

  .media-arrow {
    left: 0;
    margin: auto;
    top: -4%;
    width: 100%;
  }

  .media-media {
    left: 0;
    margin: auto;
    top: 29%;
    width: 100%;
    z-index: 2;
  }

  .media-circle { transform: scale(.95); }

  .txt-lower { margin: 0 auto 17.1875vw; }

  .txt-lower p:first-child {
    margin: 0 auto 4.6875vw;
    width: 100%;
  }

  .txt-lower p:nth-child(2) {
    margin: 0 auto 4.6875vw;
    width: 100%;
  }

  .txt-lower p:nth-child(3) {
    margin: 0 auto 7.8125vw;
    width: 100%;
  }

  .txt-lower p:last-child { width: 100%; }

  .big-logo { width: 56.25vw; }

}

/* --------------------
- story
-------------------- */
.story { padding: 200px 0 160px; }

.leaf {
  left: 46%;
  opacity: 0;
  position: absolute;
  transform: translateX(-50%);
  transition: .6s .4s cubic-bezier(1, 0, 0, 1);
  top: 0;
  width: 1280px;
  z-index: 1;
}

.leaf p { position: absolute; }

.leaf-a {
  right: 50px;
  top: 285px;
  width: 461px;
}

.leaf-b {
  left: 105px;
  top: 120px;
  width: 1193px;
}

.story h2 {
  margin: 0 auto 70px;
  width: 293px;
}

.story-bg {
  height: 2000px;
  left: 50%;
  overflow: hidden;
  position: fixed;
  top: 0;
  transform: skewX(-25deg) translateX(-840px);
  width: 510px;
  z-index: 0;
}

.story-bg div {
  background: url('../img/story/bg.jpg') no-repeat left top;
  background-size: cover;
  height: 100vh;
  /* left: 52%; */
  min-height: 1315px;
  min-width: 790px;
  position: absolute;
  top: 0;
  transform: skewX(25deg);
  transform-origin: left bottom;
  width: 215%;
}

.story-upper {
  margin: 0 auto 70px;
  opacity: 0;
  transform: translateX(-100px);
  transition: 1s cubic-bezier(1, 0, 0, 1);
  width: 623px;
}

.story-lower {
  margin: 0 auto;
  opacity: 0;
  transform: translateX(100px);
  transition: 1s cubic-bezier(1, 0, 0, 1);
  width: 845px;
}

@media screen and (max-width: 767px) {

  .story { padding: 21.875vw 0 35.9375vw; }

  .leaf { width: 100%; }

  .leaf-a {
    right: 0;
    top: 0;
    width: 100%;
  }

  .leaf-b {
    left: 0;
    top: 0;
    width: 100%;
  }

  .story h2 {
    margin: 0 auto 11.71875vw;
    width: 45.78125vw;
  }

  .story-bg {
    height: 100%;
    left: 0;
    transform: none;
    width: 100%;
  }

  .story-bg div {
    background: url('../img/story/bg_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    height: 100%;
    left: 0;
    min-height: auto;
    min-width: auto;
    transform: none;
    width: 100%;
  }

  .story-upper {
    margin: 0 auto 11.71875vw;
    transform: translateX(-70px);
    width: 100%;
  }

  .story-lower {
    transform: translateX(70px);
    width: 100%;
  }

}

/* --------------------
- player
-------------------- */
.player { padding: 200px 0 160px; }

.player h2 {
  margin: 0 auto 40px;
  width: 466px;
}

.player-nav {
  display: flex;
  justify-content: space-between;
  margin: 0 auto 15px;
  width: 715px;
}

.player-nav li {
  cursor: pointer;
  transition: .4s;
  width: 99px;
}

.player-nav li:hover { opacity: .5; }

.player-nav-off {
  cursor: default !important;
  opacity: 1 !important;
}

.team-list {
  margin: 0 auto;
  position: relative;
  width: 1217px;
}

.player-slider {
  height: 500px;
  left: 15px;
  position: absolute;
  top: 120px;
}

.player-slider-6 ul {
  left: 50px;
  position: absolute;
  top: 0;
}

.player-slider-5 ul {
  left: 107px;
  position: absolute;
  top: -20px;
}

.player-slider ul li {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transform: translateY(-30px);
  transition: filter .4s, left .6s, opacity .6s, top .6s, transform .4s, width .6s;
  width: calc(452px * .58);
}

.player-act {
  left: 0;
  top: 0;
  width: 452px !important;
  z-index: 8;
}

.second {
  left: 261px;
  top: 92px;
  z-index: 7;
}

.third {
  left: 383px;
  top: 71px;
  z-index: 6;
}

.fourth {
  left: 505px;
  top: 50px;
  z-index: 5;
}

.fifth {
  left: 627px;
  top: 29px;
  z-index: 4;
}

.sixth {
  left: 749px;
  top: 8px;
  z-index: 3;
}

.seventh {
  left: 871px;
  top: -13px;
  z-index: 2;
}

.player-slider-5 ul .second {
  left: 266px;
  top: 92px;
}

.player-slider-5 ul .third {
  left: 393px;
  top: 71px;
}

.player-slider-5 ul .fourth {
  left: 520px;
  top: 50px;
}

.player-slider-5 ul .fifth {
  left: 647px;
  top: 29px;
}

.behind { z-index: 1 !important; }

.player-slider ul li span {
  cursor: pointer;
  height: 227px;
  left: 71px;
  pointer-events: auto;
  position: absolute;
  top: 50px;
  width: 120px;
  z-index: 2;
}

.player-act span {
  height: 391px !important;
  left: 123px !important;
  top: 87px !important;
  width: 206px !important;
}

.player-slider ul li img { transition: .6s; }

.player-off {
  left: 0;
  opacity: 1;
  position: absolute;
  top: 0;
  z-index: 1;
}

.player-on,
.player-act .player-off { opacity: 0; }

.player-act .player-on { opacity: 1; }

.player-prev,
.player-next {
  height: 55.5px;
  outline: none;
  position: absolute;
  transition: .5s;
  width: 35px;
  z-index: 8;
}

.player-prev {
  left: 65px;
  top: 252px;
}

.player-next {
  left: 1080px;
  top: 99px;
}

.player-prev:hover,
.player-next:hover { opacity: .5; }

.team-data {
  left: 310px;
  position: absolute;
  top: 80px;
  width: 475px;
  z-index: 1;
}

.team-data span {
  background: #0f1941;
  border-radius: 50%;
  height: 6px;
  position: absolute;
  transition: .6s;
  width: 6px;
}

.player-pos { background: #ff554b !important; }

.goleiro {
  left: 15px;
  top: 32px;
}

.fixo {
  left: 40px;
  top: 32px;
}

.ala-r {
  left: 66px;
  top: 8px;
}

.ala-l {
  left: 66px;
  top: 56px;
}

.pivo {
  left: 96px;
  top: 32px;
}

.team-coming {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 557px;
  z-index: 1;
}

.team-copy {
  bottom: 195px;
  pointer-events: none;
  position: absolute;
  right: 130px;
  z-index: 1;
}

#koyo .team-copy { width: 355px; }

#adalbert .team-copy { width: 488px; }

#momomi .team-copy {
  width: 599px;
  bottom: 180px;
}

#amanogawa .team-copy {
  width: 511px;
  bottom: 190px;
}

#okazan .team-copy {
  width: 269px;
  bottom: 215px;
}

.team-info {
  bottom: 20px;
  position: absolute;
  right: 40px;
  width: 801.5px;
  z-index: 1;
}

#momomi .team-info {
  width: 761.5px;
}

.prof {
  align-items: center;
  background: rgba(255, 255, 255, .9);
  display: none;
  height: 100%;
  justify-content: center;
  left: 0;
  min-height: 700px;
  min-width: 1280px;
  opacity: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 102;
}

.prof-box {
  height: 620px;
  position: relative;
  width: 1116px;
}

.prof-close {
  cursor: pointer;
  left: -40px;
  position: absolute;
  top: -30px;
  transition: .4s;
  width: 117px;
  z-index: 4;
}

.prof-close:hover { opacity: .5; }

.prof-slider { display: none; }

.prof-list {
  display: none;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.prof-pic {
  left: 60px;
  position: absolute;
  top: -40px;
  width: 567px;
  z-index: 2;
}

.prof-pic p { transition: .4s; }

.pic1 { opacity: 1; }

.pic2 {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  z-index: 1;
}

#kazanin .pic1,
#sogo .pic1,
#aiba .pic1,
#sera .pic1,
#garcia .pic1 {
  height: 757px;
  text-align: center;
  margin: -50px 0 0;
}

#kazanin .pic1 img,
#sogo .pic1 img,
#aiba .pic1 img,
#sera .pic1 img,
#garcia .pic1 img {
  height: 100%;
  width: auto;
}

.prof-base {
  box-shadow: 10px 10px 12px rgba(25, 76, 75, .5);
  left: 460px;
  position: absolute;
  top: 180px;
  width: 595px;
  z-index: 1;
}

#usami .prof-base { top: 335px; }
#komori .prof-base,
#aiba .prof-base {
  top: 160px;
}

.prof-copy {
  bottom: 465px;
  left: 535px;
  position: absolute;
  width: 540px;
  z-index: 1;
}

#yukinaga .prof-copy { left: 515px; }

#usami .prof-copy {
  bottom: 315px;
  left: 520px;
}

#futaba .prof-copy { width: 574px; }

#tachibana .prof-copy {
  width: 438px;
}

#akiduki .prof-copy {
  width: 410px;
}

.prof-bg {
  box-sizing: content-box;
  padding: 0 0 0 40px;
  width: 995px;
}

.prof-prof {
  left: 460px;
  position: absolute;
  top: 180px;
  width: 620px;
  z-index: 3;
}

#usami .prof-prof {
  top: 335px;
  width: 595px;
}

.pic-btn {
  position: absolute;
  right: 50px;
  top: 25px;
  width: 180px;
  z-index: 1;
}

#usami .pic-btn { right: 25px; }

.pic-btn span {
  opacity: 0;
  position: absolute;
  top: 0;
  transition: left .4s cubic-bezier(0.77, 0, 0.175, 1);;
  width: 97px;
}

.pic1-btn { left: 0; }

.pic2-btn { left: 83px; }

.on {
  cursor: pointer;
  opacity: 1 !important;
  z-index: 2;
}

.illust {
  bottom: 63px;
  left: 26px;
  opacity: 0;
  position: absolute;
  transition: .4s;
  width: 93.5px;
  z-index: 1;
}

#usami .illust { bottom: 25px; }

#adalbert-list .illust {
  width: 102.5px;
}

#momomi-list .illust {
  width: 129px;
}

#amanogawa-list .illust {
  width: 175px;
}

#okazan-list .illust {
  width: 102px;
}

.prof-prev,
.prof-next {
  height: 55.5px;
  outline: none;
  position: absolute;
  top: 50%;
  transition: .5s;
  transform: translateY(-50%);
  width: 35px;
  z-index: 8;
}

.prof-prev:hover,
.prof-next:hover { opacity: .5; }

.prof-prev { left: 0; }

.prof-next { right: 0; }

/*表情集*/
.prof-container {
  position: relative;
  display: block;
  opacity: 1;
}

.prof-change-btn {
  position: absolute;
  z-index: 5;
  width: 91px;
  top: 365px;
  left: 38px;
  cursor: pointer;
  transition: opacity .3s ease;
}

#adalbert-list .prof-change-btn {
  top: 357px;
}

#adalbert-list .prof-change-btn-after {
  top: 478px;
}

#momomi-list .prof-change-btn-before {
  top: 350px;
}

#amanogawa-list .prof-change-btn-before {
  top: 352px;
}

#okazan-list .prof-change-btn-before {
  top: 342px;
}

.prof-change-btn:hover {
  opacity: .5;
}

.prof-change-btn-after {
  top: 478px;
}

.face-container {
  position: relative;
  display: none;
  opacity: 0;
}

.face-txt {
  position: absolute;
  z-index: 2;
  left: 47px;
  top: 570px;
  width: 84px;
}

.face-box {
  width: 890px;
  margin: 0 auto;
  position: relative;
}

.face-box .face-box-item:nth-child(2){
  position: absolute;
  z-index: 1;
  top: 0;
  opacity: 0;
}

.face-box-nav {
  display: flex;
  justify-content: center;
  margin: 20px 0;
}

.face-box-nav-btn {
  width: 8px;
  height: 8px;
  margin: 0 12px;
  cursor: pointer;
}

.face-box-nav-btn img {
  vertical-align: top;
}

.face-box-nav-btn.act {
  background: url("../img/top/kv/on.png") no-repeat;
  background-size: cover;
}

.face-box-nav-btn.act img {
  opacity: 0;
}


@media screen and (max-width: 767px) {

  .player { padding: 21.875vw 0 28.125vw; }

  .player h2 { width: 74.21875vw; }

  .player-nav {
    margin: 0 auto 7.8125vw;
    width: 90%;
  }

  .player-nav li {
    width: 14.53125vw;
  }

  .player-nav li:hover { opacity: 1; }

  .team-list {
    margin: 0 auto 3.125vw;
    max-width: 100%;
    width: 100%;
  }

  .player-slider {
    height: auto;
    left: -13.4375vw;
    top: 8%;
    width: 100%;
  }

  .player-slider-6 ul,
  .player-slider-5 ul {
    position: static;
  }

  .player-slider ul li {
    transform: translateY(-6.25vw);
    transition: left .4s, opacity .4s, top .4s, transform .4s, width .4s;
    width: calc(79.375vw * .58);
  }

  .player-act { width: 79.375vw !important; }

  .second,
  .player-slider-5 ul .second {
    left: 46.25vw;
    top: 15.625vw;
  }

  .third,
  .player-slider-5 ul .third {
    left: 68.125vw;
    top: 11.875vw;
  }

  .fourth,
  .player-slider-5 ul .fourth {
    left: 90vw;
    top: 8.125vw;
  }

  .fifth,
  .player-slider-5 ul .fifth {
    left: 111.875vw;
    top: 4.375vw;
  }

  .sixth {
    left: 133.75vw;
    top: .625vw;
  }

  .seventh {
    left: 155.625vw;
    top: 3.125vw;
  }
  
  .player-slider ul li span {
    height: 40vw;
    left: 12.5vw;
    top: 8.75vw;
    width: 20.9375vw;
  }

  .player-act span {
    height: 68.75vw !important;
    left: 21.5625vw !important;
    top: 15.3125vw !important;
    width: 36.25vw !important;
  }

  .player-slider ul li img { transition: .6s; }

  .player-order {
    left: 77.4%;
    position: absolute;
    top: 64.375vw;
    width: 10vw;
    z-index: 1;
  }

  .player-order p {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: .6s;
  }

  .now { opacity: 1 !important; }

  .player-order p:last-child { position: static; }

  .player-prev,
  .player-next {
    height: 8.75vw;
    transform: skewY(-10deg);
    width: 5.46875vw;
  }

  .player-prev {
    left: 66%;
    top: 66.875vw;
  }

  .player-next {
    left: 94%;
    top: 62.1875vw;
  }

  .player-prev:hover,
  .player-next:hover { opacity: 1; }

  .team-data {
    left: 47%;
    top: 6%;
    width: 43.4375vw;
  }

  .team-data span {
    height: .9375vw;
    width: .9375vw;
  }

  .goleiro {
    left: 40.5%;
    top: 25%;
  }

  .fixo {
    left: 48%;
    top: 25%;
  }

  .ala-r {
    left: 58%;
    top: 7%;
  }

  .ala-l {
    left: 58%;
    top: 46%;
  }

  .pivo {
    left: 67%;
    top: 25%;
  }

  .team-coming {
    left: 0;
    transform: translateY(-87%);
    width: 100%;
  }

  .team-copy {
    bottom: 32%;
    right: 0;
    width: 100%;
  }

  #koyo .team-copy,
  #adalbert .team-copy,
  #momomi .team-copy,
  #amanogawa .team-copy,
  #okazan .team-copy { 
    width: 100%;
    bottom: 32%;
  }
  
  #amanogawa .team-copy {
    bottom: 35%;
  }
  
  #okazan .team-copy {
    bottom: 37%;
  }
  
  .team-info,
  #momomi .team-info {
    bottom: 5vw;
    right: 0;
    width: 100%;
  }

  .prof {
    min-height: 100%;
    min-width: 100%;
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
    overflow-y: scroll;
  }

  .prof-box {
    height: auto;
    min-height: 100%;
    width: 100%;
  }

  .prof-close {
    margin: 0 auto 0 5%;
    position: static;
    width: 18.75vw;
  }

  #usami .prof-close { margin: 4.6875vw auto 0 5%; }

  .prof-close:hover { opacity: 1; }

  .prof-list { padding: 0 0 9.375vw; }

  .prof-pic {
    left: 0;
    top: 0;
    width: 100%;
  }

  #kazanin .pic1,
  #sogo .pic1,
  #sera .pic1,
  #garcia .pic1,
  #aiba .pic1 {
    height: auto;
    margin: 0;
  }

  #kazanin .pic1 img,
  #sogo .pic1 img,
  #sera .pic1 img,
  #garcia .pic1 img,
  #aiba .pic1 img {
    height: auto;
    width: 100%;
  }

  .prof-copy {
    bottom: auto;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 3;
  }

  #yukinaga .prof-copy { left: 0; }

  #usami .prof-copy {
    bottom: auto;
    left: 0;
  }

  #tachibana .prof-copy,
  #akiduki .prof-copy,
  #futaba .prof-copy { width: 100%; }

  .prof-bg {
    margin: 0 auto 4.6875vw;
    padding: 0;
    width: 100%;
  }

  .prof-prof {
    left: 0;
    position: relative;
    top: 0;
    width: 100%;
  }

  #usami .prof-prof {
    top: 0;
    width: 100%;
  }

  .pic-btn {
    right: 10%;
    top: 4vw;
    width: 26.5625vw;
  }

  #usami .pic-btn { right: 10%; }

  .pic-btn span { width: 14.84375vw; }

  .pic2-btn { left: 11.5625vw; }

  .pic-btn img { display: block; }

  .illust {
    bottom: 13%;
    left: 9.6%;
    width: 16.71875vw;
  }

  #usami .illust { bottom: 25px; }
  
  #adalbert-list .illust {
    width: 18.28125vw;
  }

  #momomi-list .illust {
    width: 23.125vw;
  }

  #amanogawa-list .illust {
    width: 31.875vw;
  }

  #okazan-list .illust {
    width: 18.75vw;
  }

  .prof-prev,
  .prof-next {
    height: 10.9375vw;
    transform: translateY(-50%);
    top: 32%;
    width: 6.875vw;
  }

  .prof-prev.open-face,
  .prof-next.open-face {
    top: 84vw;
  }

  .prof-prev { left: 3%; }

  .prof-next { right: 3%; }

  .prof-prev:hover,
  .prof-next:hover { opacity: 1; }
  
  /*表情集*/
  .prof-container {
    position: relative;
    display: block;
    opacity: 1;
  }

  .prof-change-btn {
    width: 12.5vw;
    top: 4.21875vw;
    left: auto;
    right: 0;
    cursor: default;
  }
  
  #adalbert-list .prof-change-btn {
    top: 4.21875vw;
  }
  
  #momomi-list .prof-change-btn-before {
    top: 4.21875vw;
  }

  #amanogawa-list .prof-change-btn-before {
    top: 4.21875vw;
  }

  #okazan-list .prof-change-btn-before {
    top: 4.21875vw;
  }

  .prof-change-btn:hover {
    opacity: 1;
  }

  .prof-change-btn-after {
    top: 4.21875vw;
  }

  .face-container {
    position: relative;
    display: none;
    opacity: 0;
    padding: 15.625vw 0 0 0;
  }

  .face-txt {
    position: absolute;
    z-index: 2;
    left: 4.6875vw;
    top: 6.25vw;
    width: 19.0625vw;
  }

  .face-box {
    width: 70.3125vw;
    margin: 0 auto 8.59375vw;
    padding: 0;
  }

}

/* --------------------
- staff
-------------------- */
.staff { padding: 200px 0 152px; }

.staff h2 {
  margin: 0 auto 40px;
  width: 273px;
}

.orig { margin: 0 auto 90px; }

.orig p:first-child {
  margin: 0 auto 15px;
  width: 51px;
}

.orig p:last-child {
  box-shadow: 7px 7px 5px rgba(112, 111, 84, .4);
  margin: 0 auto;
  width: 275px;
}

.chara-ttl {
  margin: 0 auto 10px;
  width: 339.5px;
}

.chara-list { position: relative; }

.chara-list {
  margin: 0 auto 110px;
  position: relative;
  width: 1114px;
}

.koyo-chara { margin: 0 auto 215px; }

.adalbert-chara { margin: 0 auto 141px; }

.momomi-chara {
  margin: 0 auto 197px;
}

.amanogawa-chara {
  margin: 0 auto 244px;
}

.chara-list:last-child { margin: 0 auto 140px; }

.chara-list-coming {
  opacity: 0;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 665px !important;
}

.chara-list-coming-l { transform: translateX(-100px); }

.chara-list-coming-r { transform: translateX(100px); }

.chara-link {
  opacity: 0;
  position: absolute;
  transition: 1s;
  width: 90px;
  z-index: 3;
}

.koyo-chara .chara-link {
  bottom: -50px;
  left: 60px;
}

.adalbert-chara .chara-link {
  bottom: 95px;
  right: 0;
}

.momomi-chara .chara-link {
  bottom: -21px;
  left: 88px;
}

.amanogawa-chara .chara-link {
  bottom: -30px;
  right: 67px;
}

.okazan-chara .chara-link {
  bottom: 182px;
  left: 76px;
}

.chara-img {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 47px;
  transform: scale(.9);
  transition: 1s cubic-bezier(1, 0, 0, 1);
  width: 100%;
  z-index: 2;
}

.momomi-chara .chara-img {
  top: 39px;
}

.amanogawa-chara .chara-img {
  top: 22px;
}

.okazan-chara .chara-img {
  top: 25px;
}

.creator {
  opacity: 0;
  position: absolute;
  transition: 1s;
  width: 227px;
  z-index: 1;
}

.open-chara-list-l .creator {
  right: -10px;
  top: 155px;
}

.open-chara-list-r .creator {
  left: 0;
  top: 300px;
}

.momomi-chara  .creator {
  right: -11px;
  top: 310px;
}

.amanogawa-chara  .creator {
  right: -11px;
  top: 310px;
}

.okazan-chara  .creator {
  right: -13px;
  top: 225px;
}

.creator-r {
  opacity: 1 !important;
  right: -65px !important;
  top: -70px !important;
}

.creator-l {
  left: -50px !important;
  opacity: 1 !important;
  top: -70px !important;
}

.chara-bg {
  opacity: 0;
  transition: .7s cubic-bezier(1, 0, 0, 1);
  width: 100%;
}

.open-chara-list-l .chara-bg { transform: translateX(-100px); }

.open-chara-list-r .chara-bg { transform: translateX(100px); }

.chara-coming {
  margin: 0 auto;
  width: 665px;
}

.cd-s-m {
  display: flex;
  justify-content: space-between;
  margin: 0 auto 75px;
  width: 865px;
}

.cd-s-m div p:last-child {
  box-shadow: 7px 7px 5px rgba(112, 111, 84, .4);
  margin: 0 auto;
  width: 275px;
}

.chara-design p:first-child {
  margin: 0 auto 20px;
  width: 259.5px;
}

.story-construct p:first-child {
  margin: 0 auto 20px;
  width: 182.5px;
}

.music p:first-child {
  margin: 0 auto 20px;
  width: 50px;
}

.production p:first-child {
  margin: 0 auto 20px;
  width: 65.5px;
}

.production p:last-child {
  box-shadow: 7px 7px 5px rgba(112, 111, 84, .4);
  margin: 0 auto;
  width: 865px;
}

@media screen and (max-width: 767px) {

  .staff { padding: 21.875vw 0 31.25vw; }

  .staff h2 { width: 42.8125vw; }

  .orig { margin: 0 auto 15.625vw; }

  .orig p:first-child { width: 10.3125vw; }

  .orig p:last-child {
    box-shadow: 4px 4px 4px rgba(112, 111, 84, .4);
    width: 64.0625vw;
  }

  .chara-ttl {
    margin: 0 auto 6.25vw;
    width: 61.25vw;
  }

  .chara-list {
    margin: 0 auto 23.4375vw;
    width: 100%;
  }

  .chara-list:first-of-type { margin: 0 auto 15.625vw; }

  .chara-list:nth-of-type(2) { margin: 0 auto 15.625vw; }

  .chara-list:last-child { margin: 0 auto 23.4375vw; }

  .chara-list-coming { width: 90% !important; }

  .chara-link {
    margin: 0 auto 0 5%;
    position: static;
    width: 16.71875vw;
  }

  .chara-img,
  .momomi-chara .chara-img {
    top: 37%;
  }

  .amanogawa-chara .chara-img{
    top: 39%;
  }

  .okazan-chara .chara-img{
    top: 40.25vw;
  }

  .creator {
    margin: 0 auto -1.5625vw;
    position: static;
    width: 47.03125vw;
  }

  .creator-r {
    margin: 0 !important;
    position: absolute !important;
    right: -2.1875vw !important;
    top: -11.5625vw !important;
    width: 45.3125vw;
  }

  .creator-l {
    left: 0 !important;
    margin: 0 !important;
    position: absolute !important;
    top: -11.5625vw !important;
    width: 45.3125vw;
  }

  .chara-bg { width: 100%; }

  .koyo-chara .chara-bg { margin: 0 auto 2%; }

  .adalbert-chara .chara-bg { margin: 0 auto 5%; }
  .momomi-chara .chara-bg { margin: 5% auto; }
  .okazan-chara .chara-bg { margin: -13.75vw auto 0; }

  .chara-coming { width: 100%; }

  .cd-s-m {
    display: block;
    margin: 0 auto 9.375vw;
    width: 100%;
  }

  .cd-s-m div p:last-child {
    box-shadow: 4px 4px 4px rgba(112, 111, 84, .4);
    width: 64.0625vw;
  }

  .chara-design { margin: 0 auto 9.375vw; }

  .chara-design p:first-child {
    margin: 0 auto 4.6875vw;
    width: 50.78125vw;
  }

  .story-construct { margin: 0 auto 9.375vw; }

  .story-construct p:first-child {
    margin: 0 auto 4.6875vw;
    width: 35.625vw;
  }

  .music p:first-child {
    margin: 0 auto 4.6875vw;
    width: 9.6875vw;
  }

  .production p:first-child {
    margin: 0 auto 4.6875vw;
    width: 13.75vw;
  }

  .production p:nth-child(2),
  .production p:nth-child(3) {
    box-shadow: 4px 4px 4px rgba(112, 111, 84, .4);
    margin: 0 auto 4.6875vw;
    width: 64.0625vw;
  }

  .production p:last-child {
    box-shadow: 4px 4px 4px rgba(112, 111, 84, .4);
    margin: 0 auto;
    width: 64.0625vw;
  }

}


/* --------------------
- cast
-------------------- */
.cast { 
  padding: 200px 0 152px;
}

.cast-ttl {
  margin: 0 auto 40px;
  width: 250px;
}

.cast-container {
  width: 1280px;
  margin: 0 auto;
  position: relative;
}

.cast-container:nth-child(n + 2) {
  margin: 105px auto 0;
}

.cast-container-inner {
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: scale(.9);
  transition: 1s cubic-bezier(1, 0, 0, 1);
}

.cast-container-ttl {
  margin: 0 auto 20px;
  line-height: 0em;
}

.cast-list-container {
  display: flex;
  flex-wrap: wrap;
}

.cast-photo-box {
  width: 712px;
  margin: 0 auto 35px auto;
  transform: translateX(12px);
}

.cast-team-mark {
  width: 173px;
  margin: 0 83px;
}

.cast-list-container-inner {
  display: flex;
  flex-wrap: wrap;
  width: 900px;
}

.cast-list-box {
  width: 300px;
  height: 101px;
}

.cast-list-box:nth-child(n + 4) {
  margin: 15px 0 0 0;
}

.cast-list-img {
  width: auto;
  height: 100%;
}

.cast-container-bg {
  position: absolute;
  z-index: 0;
  transform: scale(.9);
  transition: 1s cubic-bezier(1, 0, 0, 1);
  opacity: 0;
}

.open-cast-container-l .cast-container-bg {
  transform: translateX(-100px);
}

.open-cast-container-r .cast-container-bg {
  transform: translateX(100px);
}

.cast-container-coming {
  opacity: 0;
  transition: .7s cubic-bezier(1, 0, 0, 1);
}

.cast-container-coming-l {
  transform: translateX(-100px);
}

.cast-container-coming-r {
  transform: translateX(100px);
}

/*koyo*/
.koyo-cast .cast-container-ttl {
  width: 157.5px;
}

.koyo-cast .cast-container-bg {
  width: 1013.5px;
  top: -41px;
  left: 85px;
}

/*adalbert*/
.adalbert-cast .cast-container-ttl {
  width: 309.5px;
}

.adalbert-cast .cast-container-bg {
  width: 1013.5px;
  top: -41px;
  left: 180px;
}

/*momomi*/
.momomi-cast .cast-container-ttl {
  width: 102.5px;
}

.momomi-cast .cast-container-bg {
  width: 1013.5px;
  top: -30px;
  left: 85px;
}

/*amanogawa*/
.amanogawa-cast .cast-container-ttl {
  width: 232px;
}

.amanogawa-cast .cast-container-bg {
  width: 981px;
  top: -23px;
  left: 212px;
}

/*okazan*/
.okazan-cast .cast-container-ttl {
  width: 209px;
}

.okazan-cast .cast-container-bg {
  width: 996px;
  top: -26px;
  left: 85px;
}

.cast-container-coming {
}


@media screen and (max-width: 767px) {

  .cast { 
    padding: 21.875vw 0 31.25vw;
  }

  .cast-ttl {
    margin: 0 auto 40px;
    width: 38.90625vw;
    position: relative;
    z-index: 2;
  }

  .cast-container {
    width: 100%;
  }

  .cast-container:nth-child(n + 2) {
    margin: 17.1875vw auto 0;
  }

  .cast-container-inner {
    position: relative;
    z-index: 1;
  }

  .cast-container-ttl {
    width: auto !important;
    height: 4.375vw;
    margin: 0 auto 4.21875vw;
    line-height: 0em;
    text-align: center;
  }
  
  .cast-container-ttl img {
    width: auto;
    height: 100%;
  }

  .cast-list-container {
    display: block;
  }

  .cast-photo-box {
    width: 95.625vw;
    margin: 0 auto 7.5vw auto;
    transform: translateX(0);
  }

  .cast-team-mark {
    display: none;
  }

  .cast-list-container-inner {
    display: flex;
    flex-wrap: wrap;
    width: 90%;
    margin: 0 auto;
  }

  .cast-list-box {
    width: 50%;
    height: 17.1875vw;
    padding: 0 0 0 .78125vw;
    margin: 0 0 4.21875vw;
  }

  .cast-list-box:nth-child(n + 4) {
    margin: 0 0 4.21875vw;
  }
  
  .cast-list-box:nth-child(2n) {
    padding: 0 0 0 3.28125vw;
  }

  .cast-list-img {
    width: auto;
    height: 100%;
  }

  .cast-container-bg {
    position: absolute;
    z-index: 0;
  }

  /*koyo*/
  .koyo-cast .cast-container-ttl {
    width: auto;
  }

  .koyo-cast .cast-container-bg {
    width: 100vw;
    top: -18.125vw;
    left: 0;
  }

  /*adalbert*/
  .adalbert-cast .cast-container-ttl {
    width: auto;
  }

  .adalbert-cast .cast-container-bg {
    width: 100vw;
    top: -8.4375vw;
    left: 0;
  }

  /*momomi*/
  .momomi-cast .cast-container-ttl {
    width: auto;
  }

  .momomi-cast .cast-container-bg {
    width: 100vw;
    top: -9.375vw;
    left: 0;
  }

  /*amanogawa*/
  .amanogawa-cast .cast-container-ttl {
    width: auto;
  }

  .amanogawa-cast .cast-container-bg {
    width: 100vw;
    top: -7.65625vw;
    left: 0;
  }

  /*okazan*/
  .okazan-cast .cast-container-ttl {
    width: auto;
  }

  .okazan-cast .cast-container-bg {
    width: 100vw;
    top: -7.8125vw;
    left: 0;
  }

  .cast-container-coming {
    opacity: 0;
    transition: .7s cubic-bezier(1, 0, 0, 1);
  }
  
}

/* --------------------
- arch event
-------------------- */
.arch-event { padding: 200px 0 120px; }

.arch-event h2 {
  margin: 0 auto 70px;
  width: 296px;
}

.event-tag {
  display: flex;
  justify-content: center;
  margin: 0 auto 75px;
}

.event-tag li { width: 171px; }

.event-tag li a { display: block; }

.event-tag li .act {
  cursor: default;
  opacity: .5;
  pointer-events: none;
}

.event-posts {
  margin: 0 auto;
  position: relative;
  width: 1116px;
}

.event-lead {
  left: -10px;
  position: absolute;
  top: -10px;
  width: 623.5px;
  z-index: 1;
}

.event-total {
  position: absolute;
  right: 40px;
  top: 40px;
  width: 200px;
  z-index: 1;
}

.event-total span {
  font-size: 28px;
  font-weight: 900;
  position: absolute;
  right: 35px;
  top: 7px;
  z-index: 1;
}

.event-list {
  background: #20315d;
  box-shadow: 3px 3px 8px rgba(45, 60, 60, .7);
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto 105px;
  overflow: hidden;
  padding: 140px 53px 25px;
  position: relative;
}

.event-list li {
  cursor: pointer;
  margin: 63px 0;
  position: relative;
  width: 309px;
}

.event-list li:nth-child(3n-1) { margin: 63px 41px 63px 42px; }

.event-list li::before {
  background: url('../img/event/choice.png') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 46px;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: -22px;
  transform: translate(-50%, -5px);
  transition: .4s;
  width: 28px;
  z-index: 1;
}

.event-list li:hover::before {
  opacity: 1;
  transform: translate(-50%, 0);
}

.event-list li:nth-child(3n+1)::after {
  background: url('../img/event/lineA.jpg') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 6px;
  left: -53px;
  position: absolute;
  top: -66px;
  width: 1116px;
}

.event-list li:first-child::after { display: none; }

.event-list li a { display: block; }

.event-list li a:hover { opacity: .8; }

.event-cont {
  background: #fff;
  border-width: 2px;
  border-style: solid;
  border-color: rgb(25, 30, 30) rgb(119, 133, 150) rgb(119, 133, 150) rgb(25, 30, 30);
  margin: 0 auto 20px;
  max-height: 339px;
  min-height: 314px;
  padding: 9px;
  position: relative;
}

.event-cont-box {
  background: #3e5b6e;
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 10%, rgba(62, 91, 110, 1) 15%);
  border-radius: 5px;
  height: 100%;
  overflow: hidden;
  padding: 0 0 20px;
}

.event-thumb {
  background: url('../img/event/bgA.png') no-repeat left top;
  background-size: 100% auto;
  height: 182px;
  overflow: hidden;
  position: relative;
}

.event-thumb span {
  display: block;
  left: 0;
  position: absolute;
  width: 100%;
}

.event-thumb-cover {
  bottom: 0;
  z-index: 1;
}

.gradation {
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 99px;
  z-index: 3;
}

.event-heading {
  font-size: 17px;
  font-weight: 900;
  max-height: 135px;
  min-height: 110px;
  overflow: hidden;
  padding: 15px 20px 0;
}

@supports (-webkit-line-clamp: 4) {
  .event-heading {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
  }
}

.event-data { position: relative; }

.event-data p:first-child {
  background: url('../img/event/frameA.png') no-repeat left top;
  background-size: 100% auto;
  font-size: 18px;
  font-style: italic;
  font-weight: 900;
  height: 44px;
  line-height: 44px;
  margin: 0 auto 10px 0;
  text-align: center;
  width: 154px;
}

.event-data p:nth-child(2) {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .5px;
  line-height: 22px;
  padding: 0 0 0 3px;
  width: 220px;
}

.event-data p:last-child {
  bottom: 5px;
  position: absolute;
  right: 0;
  width: 79px;
}

.event-blank { cursor: default !important; }

.event-blank::before { display: none !important; }

.event-blank .event-cont {
  background: url('../img/event/blank.png') no-repeat center top;
  background-size: cover;
  margin: 0 auto 30px;
  overflow: hidden;
  padding: 0;
  position: relative;
}

.event-blank .event-cont span {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.event-blank .event-cont span img {
  height: 100%;
  width: 100%;
}

.event-blank p:last-child {
  font-size: 13px;
  font-weight: 900;
  position: relative;
}

.event-blank p:last-child::after {
  background: #fff;
  content: '';
  height: 1px;
  left: 2px;
  letter-spacing: 1px;
  position: absolute;
  top: -10px;
  width: 7px;
}

@media screen and (max-width: 767px) {

  .arch-event { padding: 21.875vw 0 34.375vw; }

  .arch-event h2 {
    margin: 0 auto 12.5vw;
    width: 148px;
  }

  .event-tag { margin: 0 auto 15.625vw; }

  .event-tag li { width: 27.34375vw; }

  .event-posts { width: 90%; }

  .event-lead {
    left: -1.5625vw;
    top: -1.5625vw;
    width: 86.09375vw;
  }

  .event-total {
    left: 50%;
    right: auto;
    top: 25vw;
    transform: translateX(-50%);
    width: 38.90625vw;
  }

  .event-total span {
    font-size: 4.6875vw;
    right: 6.25vw;
    top: .9375vw;
  }

  .event-list {
    box-shadow: 1px 1px 5px rgba(45, 60, 60, .7);
    display: block;
    margin: 0 auto 12.5vw;
    padding: 37.5vw 5.9375vw 6.25vw;
  }

  .event-list li {
    margin: 12.5vw 0 0;
    padding: 0 0 7.03125vw;
    width: 100%;
  }

  .event-list li:nth-child(3n-1) {
    margin: 12.5vw 0 0;
    padding: 0 0 7.03125vw;
  }

  .event-list li::before {
    height: 11.875vw;
    top: -3.125vw;
    width: 7.03125vw;
  }

  .event-list li:hover::before {
    opacity: 0;
    transform: translate(-50%, -5px);
  }

  .event-list-choice::before { opacity: 1 !important; }

  .event-list li:nth-child(3n+1)::after {
    background: url('../img/event/lineA_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: 1.40625vw;
    left: -5.9375vw;
    position: absolute;
    top: -13.125vw;
    width: 115%;
  }

  .event-list li::after {
    background: url('../img/event/lineA_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: 1.40625vw;
    left: -5.9375vw;
    position: absolute;
    top: -13.125vw;
    width: 115%;
  }

  .event-list li a:hover { opacity: 1; }

  .event-cont {
    border-width: 1px;
    margin: 0 auto 3.90625vw;
    max-height: none;
    min-height: auto;
    padding: 2.5vw;
  }

  .event-cont-box { padding: 0 0 5vw; }

  .event-thumb {
    background: url('../img/event/bgA.png') no-repeat center top;
    background-size: auto 100%;
    height: 51.5625vw;
  }

  .gradation { top: 25vw; }

  .event-heading {
    font-size: 3.28125vw;
    max-height: none;
    min-height: auto;
    padding: 5vw 5.625vw 0;
  }

  .event-data p:first-child {
    background: url('../img/event/frameA_sp.png') no-repeat left top;
    background-size: 100% auto;
    font-size: 3.125vw;
    height: 7.1875vw;
    line-height: 7.1875vw;
    margin: 0 auto 1.5625vw 0;
    width: 26.875vw;
  }

  .event-data p:nth-child(2) {
    font-size: 2.5vw;
    line-height: 3.75vw;
    padding: 0;
    width: 50vw;
  }

  .event-data p:last-child {
    bottom: .9375vw;
    width: 19.6875vw;
  }

  .event-blank { display: none; }

}

/* --------------------
- single event
-------------------- */
.sgl-event { padding: 200px 0 120px; }

.sgl-event h2 {
  margin: 0 auto 70px;
  width: 296px;
}

.event-detail {
  background: #20315d;
  box-shadow: 3px 3px 8px rgba(45, 60, 60, .7);
  margin: 0 auto 90px;
  padding: 130px 0 190px;
  position: relative;
  width: 1116px;
}

.event-detail-data {
  background: url('../img/event/frameB.png') no-repeat left top;
  background-size: 100% auto;
  font-size: 18px;
  font-style: italic;
  font-weight: 900;
  height: 44px;
  left: 45px;
  line-height: 44px;
  position: absolute;
  text-align: center;
  top: 40px;
  width: 167px;
}

.event-detail-box {
  display: flex;
  flex-direction : row-reverse;
  justify-content: space-between;
  margin: 0 0 60px 90px;
  width: 1026px;
}

.event-detail-heading { width: 567px; }

.event-detail-heading p:first-of-type { margin: 0 auto 25px; }

.event-detail-heading p:first-of-type img { display: block; }

.event-detail-heading p:nth-of-type(2) {
  font-size: 16px;
  font-style: italic;
  font-weight: 900;
  margin: 0 auto 15px;
  padding: 0 0 0 5px;
  position: relative;
}

.event-detail-heading p:nth-of-type(2)::after {
  background: #fff;
  bottom: 4px;
  content: '';
  height: 2px;
  left: 98px;
  position: absolute;
  transform: skewX(-17deg);
  width: 15px;
}

.event-detail-heading p:nth-of-type(3) {
  font-size: 19px;
  font-weight: 900;
  margin: 0 auto 15px;
  min-height: 135px;
  padding: 0 90px 0 5px;
}

.event-detail-heading p:nth-of-type(4) { margin: 0 auto 35px; }

.event-detail-heading p:nth-of-type(4) img { display: block; }

.event-detail-thumb {
  background: #fff;
  border-width: 2px;
  border-style: solid;
  border-color: rgb(25, 30, 30) rgb(119, 133, 150) rgb(119, 133, 150) rgb(25, 30, 30);
  height: 293px;
  padding: 9px;
  width: 402px;
}

.event-detail-thumb p {
  border-radius: 5px;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.event-detail-thumb p::after {
  background: url('../img/event/gradationB.png') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.event-detail-thumb p img {
  max-height: 100%;
  max-width: 100%;
}

.event-detail-share {
  display: flex;
  justify-content: flex-end;
  padding: 0 90px 0 0;
}

.event-detail-share li {
  margin: 0 50px 0 0;
  width: 28px;
}

.event-detail-share li:last-child { margin: 0; }

.event-detail-txt {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 28px;
  margin: 0 auto;
  width: 936px;
}

.event-top {
  bottom: 40px;
  position: absolute;
  right: 40px;
  width: 131px;
}

@media screen and (max-width: 767px) {

  .sgl-event { padding: 21.875vw 0 26.5625vw; }

  .sgl-event h2 {
    margin: 0 auto 12.5vw;
    width: 148px;
  }

  .event-detail {
    box-shadow: 1px 1px 5px rgba(45, 60, 60, .7);
    margin: 0 auto 10.9375vw;
    padding: 9.375vw 0;
    width: 90%;
  }

  .event-detail-data {
    font-size: 3.125vw;
    height: 6.875vw;
    left: auto;
    line-height: 6.875vw;
    margin: 0 0 9.375vw 9.375vw;
    position: relative;
    top: auto;
    width: 25vw;
  }

  .event-detail-box {
    display: block;
    margin: 0 auto 6.25vw;
    padding: 0 9.375vw;
    width: 100%;
  }

  .event-detail-heading {
    margin: 0 auto 3.125vw;
    position: relative;
    width: 100%;
  }

  .event-detail-heading p:nth-of-type(2) {
    font-size: 2.5vw;
    font-style: normal;
    left: 50%;
    margin: 0;
    padding: 0;
    position: absolute;
    transform: translateX(-50%);
    top: -13.125vw;
  }

  .event-detail-heading p:nth-of-type(2)::after {
    bottom: .9375vw;
    height: 1px;
    left: 16.25vw;
    transform: skewX(0deg);
    width: 1.71875vw;
  }

  .event-detail-heading p:nth-of-type(3) {
    font-size: 3.59375vw;
    margin: 0 auto;
    min-height: auto;
    padding: 0;
  }

  .event-detail-thumb {
    border-width: 1px;
    height: 51.875vw;
    margin: 0 auto 6.25vw;
    padding: 2.5vw;
    width: 100%;
  }

  .event-detail-line { margin: 0 auto 6.25vw; }

  .event-detail-line img { display: block; }

  .event-detail-txt {
    font-size: 2.5vw;
    letter-spacing: 0;
    line-height: 4.375vw;
    margin: 0 auto 15.625vw;
    padding: 0 9.375vw;
    width: 100%;
  }

  .event-detail-share {
    justify-content: flex-start;
    padding: 0 0 0 9.375vw;
  }

  .event-detail-share li {
    margin: 0 9.375vw 0 0;
    width: 7.1875vw;
  }

  .event-top {
    bottom: 9.375vw;
    right: 9.375vw;
    width: 18.75vw;
  }

}

/* --------------------
- arch contents
-------------------- */
.arch-contents { padding: 200px 0 120px; }

.arch-contents h2 {
  margin: 0 auto 70px;
  width: 447px;
}

#searchform { margin: 0 auto 90px; }

.sort-nav ul {
  display: flex;
  justify-content: center;
}

.sort-nav ul li {
  position: relative;
}

.sort-nav ul li:first-child { width: 119px; }

.sort-nav ul li label {
  cursor: pointer;
  display: block;
  height: 100%;
  width: 100%;
}

.cat-coming { cursor: default !important; }

.sort-btn { display: none; }

.sort-check {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 13px;
  width: 20px;
  z-index: 1;
}

.checked { opacity: 1; }

.sort-check img { display: block; }

.cat-nav { margin: 0 auto 10px; }

.cat-nav ul li { width: 137.5px; }

.cat-nav-item-all {
  background: url('../img/contents/tag/cat/all.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -12px;
}

.cat-nav-item-all .sort-check { left: 42px; }

.cat-nav-item-pv {
  background: url('../img/contents/tag/cat/pv.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -12.5px;
}

.cat-nav-item-pv .sort-check {left: 46px;}

.cat-nav-item-drama {
  background: url('../img/contents/tag/cat/drama.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-drama .sort-check { left: 27px; }

.cat-nav-item-text {
  background: url('../img/contents/tag/cat/text.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-text .sort-check {left: 36px;}

.cat-nav-item-comic {
  background: url('../img/contents/tag/cat/comic.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-comic .sort-check { left: 29px; }

.cat-nav-item-cast {
  background: url('../img/contents/tag/cat/cast.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-cast .sort-check {left: 35px;}

.cat-nav-item-event {
  background: url('../img/contents/tag/cat/event.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-event .sort-check { left: 30px; }

.cat-nav-item-other {
  background: url('../img/contents/tag/cat/other.png') no-repeat left top;
  background-size: 100% auto;
  margin: 0 0 0 -13px;
}

.cat-nav-item-other .sort-check {left: 29px;}

.school-nav { margin: 0 auto 30px; }

.school-nav ul li {
  margin: 0 0 0 -12px;
  width: 179px;
}

.school-nav ul li:first-child { margin: 0; }

.school-nav-item-all {
  background: url('../img/contents/tag/school_all.png') no-repeat left top;
  background-size: 100% auto;
  width: 177px;
}

.school-nav-item-all .sort-check { left: 62px; }

.school-nav-item-koyo {
  background: url('../img/contents/tag/koyo.png') no-repeat left top;
  background-size: 100% auto;
  width: 178px;
}

.school-nav-item-koyo .sort-check { left: 55px; }

.school-nav-item-adalbert {
  background: url('../img/contents/tag/adalbert.png') no-repeat left top;
  background-size: 100% auto;
}

.school-nav-item-adalbert .sort-check { left: 37px; }

.school-nav-item-momomi {
  background: url('../img/contents/tag/momomi.png') no-repeat left top;
  background-size: 100% auto;
}

.school-nav-item-momomi .sort-check { left: 42px; }

.school-nav-item-amanogawa {
  background: url('../img/contents/tag/amanogawa.png') no-repeat left top;
  background-size: 100% auto;
}

.school-nav-item-amanogawa .sort-check { left: 23px; }

.school-nav-item-okazan {
  background: url('../img/contents/tag/okazan.png') no-repeat left top;
  background-size: 100% auto;
}

.school-nav-item-okazan .sort-check { left: 44px; }

.action-nav ul {
  display: flex;
  justify-content: center;
}

.action-nav ul li:first-child {
  background: url('../img/contents/tag/search.png') no-repeat left top;
  background-size: 100% auto;
  height: 26px;
  margin: 0 70px 0 0;
  width: 118px;
}

.action-nav ul li:last-child {
  background: url('../img/contents/tag/clear.png') no-repeat left top;
  background-size: 100% auto;
  height: 26px;
  width: 95px;
}

.action-nav ul li label {
  cursor: pointer;
  display: block;
  height: 100%;
  width: 100%;
}

.action-btn { display: none; }

.contents-posts {
  margin: 0 auto;
  position: relative;
  width: 1116px;
}

.contents-list {
  background: #20315d;
  box-shadow: 3px 3px 8px rgba(45, 60, 60, .7);
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto 105px;
  overflow: hidden;
  padding: 0 53px 25px;
  position: relative;
}

.contents-list li {
  margin: 63px 0;
  position: relative;
  width: 309px;
}

.contents-list li:nth-child(3n-1) { margin: 63px 41px 63px 42px; }

.contents-list li::before {
  background: url('../img/event/choice.png') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 46px;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: -22px;
  transform: translate(-50%, -5px);
  transition: .4s;
  width: 28px;
  z-index: 5;
}

.contents-list li:hover::before {
  opacity: 1;
  transform: translate(-50%, 0);
}

.contents-list li:nth-child(3n+1)::after {
  background: url('../img/event/lineA.jpg') no-repeat left top;
  background-size: 100% auto;
  content: '';
  height: 6px;
  left: -53px;
  position: absolute;
  top: -66px;
  width: 1116px;
}

.contents-list li:first-child::after { display: none; }

.contents-list li a { display: block; }

.contents-list li a:hover { opacity: .5; }

.contents-cont {
  background: #fff;
  border-width: 2px;
  border-style: solid;
  border-color: rgb(25, 30, 30) rgb(119, 133, 150) rgb(119, 133, 150) rgb(25, 30, 30);
  margin: 0 auto 20px;
  max-height: 339px;
  min-height: 314px;
  padding: 9px;
  position: relative;
}

.contents-cont-box {
  background: #3e5b6e;
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 10%, rgba(62, 91, 110, 1) 15%);
  border-radius: 5px;
  height: 100%;
  overflow: hidden;
}

.contents-thumb {
  /* background: url('../img/event/bgA.png') no-repeat left top;
  background-size: 100% auto; */
  background: #fff;
  height: 182px;
  overflow: hidden;
  position: relative;
}

.contents-thumb span {
  display: block;
  left: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
}

.contents-thumb-cover {
  bottom: 0;
  z-index: 3;
}

.contents-thumb-gradation {
  top: 0;
  z-index: 4;
}

.contents-thumb-filter,
.contents-thumb-filter-img {
  cursor: pointer;
  pointer-events: auto !important;
  top: 0;
  z-index: 2;
}

.contents-thumb-img {
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  transform: translateX(-50%);
  top: 0;
  width: 100%;
  z-index: 1;
}

.youtube-id { display: none; }

.contents-heading {
  font-size: 17px;
  font-weight: 900;
  max-height: 135px;
  min-height: 110px;
  overflow: hidden;
  padding: 15px 20px 20px;
}

@supports (-webkit-line-clamp: 4) {
  .contents-heading {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
  }
}

.contents-data { position: relative; }

.contents-data p:first-child {
  background: url('../img/contents/frameA.png') no-repeat left top;
  background-size: 100% auto;
  font-size: 18px;
  font-style: italic;
  font-weight: 900;
  height: 44px;
  line-height: 44px;
  margin: 0 auto 15px 0;
  text-align: center;
  width: 154px;
}

.contents-data p:nth-child(2) {
  font-size: 13px;
  font-style: italic;
  font-weight: 900;
  letter-spacing: .5px;
  padding: 0 0 0 3px;
  width: 232px;
  word-break: keep-all;
  word-wrap: break-word;
}

.contents-data p:nth-child(2) span {
  display: inline-block;
  margin: 0 10px 0 0;
}

.contents-data p:nth-child(3) {
  margin: 12px 0 10px;
  width: 229px;
}

.contents-data p:nth-child(3) img { display: block; }

.contents-data p:nth-child(4) {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .5px;
  line-height: 22px;
  padding: 0 0 0 3px;
  width: 220px;
}

.contents-data p:last-child {
  bottom: 5px;
  position: absolute;
  right: 0;
  width: 79px;
}

.contents-blank { cursor: default !important; }

.contents-blank::before { display: none !important; }

.contents-blank .contents-cont {
  background: url('../img/event/blank.png') no-repeat center top;
  background-size: cover;
  margin: 0 auto 30px;
  overflow: hidden;
  padding: 0;
  position: relative;
}

.contents-blank .contents-cont span {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.contents-blank .contents-cont span img {
  height: 100%;
  width: 100%;
}

.contents-blank p:last-child {
  font-size: 13px;
  font-weight: 900;
  position: relative;
}

.contents-blank p:last-child::after {
  background: #fff;
  content: '';
  height: 1px;
  left: 2px;
  letter-spacing: 1px;
  position: absolute;
  top: -10px;
  width: 7px;
}

.contents-detail-img-box {
  padding: 15px 0;
}

.img-modal {
  align-items: center;
  height: 100%;
  justify-content: center;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 102;
  display: none;
  opacity: 0;
}

.img-modal-box {
  box-sizing: content-box;
  height: 580px;
  position: relative;
  width: 854px;
  z-index: 1;
  padding: 0 40px;
}

.img-modal-close {
  cursor: pointer;
  position: absolute;
  right: 40px;
  top: -90px;
  transition: .4s;
  width: 117px;
  z-index: 1;
}

.img-modal-close:hover { opacity: .5; }

.img-modal-item-container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.img-box-item {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  display: block;
  opacity: 0;
}

.img-box-item-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  font-family: 'object-fit: contain;';  /*IE対策*/

}

.img-modal-prev,
.img-modal-next {
  height: 55.5px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 35px;
  z-index: 8;
  outline: none;
  transition: all 0.5s ease 0s;
}

.img-modal-next {
  right: 0px;
}

/*3Dtouch禁止*/
.img-box-item-img,
.contents-detail-img-popup img {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

.img-modal-prev {
  left: 0px;
}

.img-modal-prev:hover,
.img-modal-next:hover {
  opacity: 0.5;
}

.img-modal-bg {
  background: rgba(255, 255, 255, .9);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  cursor: pointer;
}

@media screen and (max-width: 767px) {

  .arch-contents { padding: 21.875vw 0 34.375vw; }

  .arch-contents h2 {
    margin: 0 auto 12.5vw;
    width: 67.1875vw;
  }

  .contents-posts { width: 90%; }

  .contents-list {
    box-shadow: 1px 1px 5px rgba(45, 60, 60, .7);
    display: block;
    margin: 0 auto 12.5vw;
    padding: 0 5.9375vw 6.25vw;
  }

  .contents-list li {
    margin: 12.5vw 0 0;
    padding: 0 0 7.8125vw;
    width: 100%;
  }

  .contents-list li:nth-child(3n-1) {
    margin: 12.5vw 0 0;
    padding: 0 0 7.03125vw;
  }

  .contents-list li::before {
    height: 11.875vw;
    top: -3.125vw;
    width: 7.03125vw;
  }

  .contents-list li:hover::before {
    opacity: 0;
    transform: translate(-50%, -5px);
  }

  .contents-list-choice::before { opacity: 1 !important; }

  .contents-list li:nth-child(3n+1)::after {
    background: url('../img/event/lineA_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: 1.40625vw;
    left: -5.9375vw;
    position: absolute;
    top: -13.125vw;
    width: 115%;
  }

  .contents-list li::after {
    background: url('../img/event/lineA_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: 1.40625vw;
    left: -5.9375vw;
    position: absolute;
    top: -13.125vw;
    width: 115%;
  }

  .contents-list li a:hover { opacity: 1; }

  .contents-cont {
    border-width: 1px;
    margin: 0 auto 3.90625vw;
    max-height: none;
    min-height: auto;
    padding: 2.5vw;
  }

  .contents-thumb {
    background: url('../img/event/bgA.png') no-repeat center top;
    background-size: auto 100%;
    height: 51.5625vw;
    /* padding: 7.8125vw 12.5vw; */
  }

  .contents-thumb-img {
    height: 100%;
    width: auto;
  }

  .contents-heading {
    font-size: 3.28125vw;
    max-height: none;
    min-height: auto;
    padding: 5vw 5.625vw;
  }

  .contents-data p:first-child {
    background: url('../img/event/frameA_sp.png') no-repeat left top;
    background-size: 100% auto;
    font-size: 3.125vw;
    height: 7.1875vw;
    line-height: 7.1875vw;
    margin: 0 auto 3.125vw 0;
    width: 26.875vw;
  }

  .contents-data p:nth-child(2) {
    font-size: 2.5vw;
    line-height: 3.75vw;
    padding: 0;
    width: 44.375vw;
  }

  .contents-data p:nth-child(2) span { margin: 0 1.5625vw 0 0; }

  .contents-data p:nth-child(3) {
    margin: 3.75vw 0 3.125vw;
    width: 43.75vw;
  }

  .contents-data p:nth-child(4) {
    font-size: 2.5vw;
    line-height: 3.75vw;
    padding: 0;
    width: 43.75vw;
  }

  .contents-data p:last-child {
    bottom: .9375vw;
    width: 19.6875vw;
  }

  .contents-blank { display: none; }

  .sort-menu-btn {
    position: fixed;
    right: 0;
    top: 29.6875vw;
    transition: .7s cubic-bezier(1, 0, 0, 1);
    width: 15.9375vw;
    z-index: 102;
  }

  .sort-menu-open { right: 81.25vw; }

  .sort-menu-btn img:first-child {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: .7s;
    z-index: 1;
  }

  .sort-menu-open img:first-child { opacity: 1; }

  .sort-menu {
    position: fixed;
    right: -81.25vw;
    top: 29.6875vw;
    transition: .7s cubic-bezier(1, 0, 0, 1);
    width: 81.25vw;
    z-index: 102;
  }

  #searchform {
    box-shadow: 1px 1px 5px rgba(45, 60, 60, .7);
    margin: 0;
  }

  .sort-menu-box {
    background: #dee7e7;
    display: flex;
    padding: 6.25vw 0 7.03125vw;
    position: relative;
  }

  .sort-menu-box::after {
    background: url('../img/contents/tag/line_h.jpg') no-repeat left top;
    background-size: 100% auto;
    bottom: 0;
    content: '';
    height: .625vw;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 1;
  }

  .sort-menu-box ul { width: 50%; }

  .sort-menu-box ul li { position: relative; }

  .sort-menu-cat,
  .sort-menu-school { padding: 0 0 0 6.25vw; }

  .sort-menu-cat { position: relative; }

  .sort-menu-cat::after {
    background: url('../img/contents/tag/line_v.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: 74.53125vw;
    position: absolute;
    right: -.625vw;
    top: 0;
    width: .625vw;
    z-index: 1;
  }

  .cat-nav-item-sp {
    height: 3.28125vw;
    margin: 0 0 8.59375vw;
    width: 24.0625vw;
  }

  .cat-nav-item-all-sp {
    background: url('../img/contents/tag/cat_all_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-pv-sp {
    background: url('../img/contents/tag/cat_pv_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-drama-sp {
    background: url('../img/contents/tag/cat_drama_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-text-sp {
    background: url('../img/contents/tag/cat/text_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-comic-sp {
    background: url('../img/contents/tag/cat_comic_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-event-sp {
    background: url('../img/contents/tag/cat_event_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-cast-sp {
    background: url('../img/contents/tag/cat_cast_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .cat-nav-item-other-sp {
    background: url('../img/contents/tag/cat_other_sp.png') no-repeat left top;
    background-size: 100% auto;
    margin: 0;
  }

  .school-nav-item-sp {
    height: 3.28125vw;
    margin: 0 0 8.59375vw;
    width: 28.90625vw;
  }

  .school-nav-item-all-sp {
    background: url('../img/contents/tag/all_school_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .school-nav-item-koyo-sp {
    background: url('../img/contents/tag/koyo_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .school-nav-item-adalbert-sp {
    background: url('../img/contents/tag/adalbert_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .school-nav-item-momomi-sp {
    background: url('../img/contents/tag/momomi_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .school-nav-item-amanogawa-sp {
    background: url('../img/contents/tag/amanogawa_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .school-nav-item-okazan-sp {
    background: url('../img/contents/tag/okazan_sp.png') no-repeat left top;
    background-size: 100% auto;
  }

  .sort-menu-box ul li label {
    display: block;
    height: 100%;
    width: 100%;
  }

  .sort-btn-sp { display: none; }

  .sort-check-sp {
    opacity: 0;
    position: absolute;
    top: -.9375vw;
    width: 5.625vw;
    z-index: 1;
  }

  .checked { opacity: 1; }

  .sort-check-sp img { display: block; }

  .sort-menu-nav {
    background: #dee7e7;
    padding: 6.25vw 0;
  }

  .sort-menu-nav ul {
    display: flex;
    justify-content: center;
  }

  .sort-menu-nav ul li:first-child {
    background: url('../img/contents/tag/search_sp.png') no-repeat left top;
    background-size: 100% auto;
    height: 5.625vw;
    margin: 0 9.375vw 0 0;
    width: 28.125vw;
  }

  .sort-menu-nav ul li:last-child {
    background: url('../img/contents/tag/clear_sp.png') no-repeat left top;
    background-size: 100% auto;
    height: 5.625vw;
    width: 22.96875vw;
  }

  .sort-menu-nav ul li label {
    display: block;
    height: 100%;
    width: 100%;
  }

  .sort-menu-input { display: none; }
  
  
  .img-modal {
    align-items: center;
    height: 100%;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 102;
    display: none;
    opacity: 0;
  }

  .img-modal-box {
    box-sizing: content-box;
    height: 50vh;
    position: relative;
    width: 80vw;
    z-index: 1;
    padding: 0 10vw;
  }

  .img-modal-close {
    cursor: default;
    top: -18.75vw;
    width: 24.0625vw;
    right: 5vw;
  }

  .img-modal-close:hover { opacity: 1; }

  .img-modal-item-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
  }

  .img-box-item {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    display: none;
    opacity: 0;
  }

  .img-box-item-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    font-family: 'object-fit: contain;';  /*IE対策*/
  }

  .img-modal-bg {
    cursor: default;
  }

  .img-modal-prev,
  .img-modal-next {
    height: 10.9375vw;
    transform: translateY(-50%);
    top: 50%;
    width: 6.875vw;
  }

  .img-modal-prev { left: 1%; }

  .img-modal-next { right: 1%; }

  .img-modal-prev:hover,
  .img-modal-next:hover {
    opacity: 1;
  }

}

/* --------------------
- sgl contents
-------------------- */
.sgl-contents { padding: 200px 0 120px; }

.sgl-contents h2 {
  margin: 0 auto 70px;
  width: 447px;
}

.contents-detail {
  background: #20315d;
  box-shadow: 3px 3px 8px rgba(45, 60, 60, .7);
  margin: 0 auto 90px;
  padding: 40px 0 100px;
  position: relative;
  width: 1116px;
}

.contents-detail-data {
  display: flex;
  margin: 0 auto 40px;
  padding: 0 40px;
}

.contents-detail-data p:first-child {
  background: url('../img/contents/frameB.png') no-repeat left top;
  background-size: 100% auto;
  font-size: 15px;
  font-style: italic;
  font-weight: 900;
  height: 44px;
  line-height: 44px;
  margin: 0 12px 0 0;
  text-align: center;
  width: 154px;
}

.contents-detail-data p:nth-child(2) {
  overflow: hidden;
  padding: 0 2px;
  position: relative;
}

.contents-detail-data p:nth-child(2)::after {
  background: url('../img/contents/lineB.jpg') no-repeat left top;
  background-size: 100% auto;
  bottom: 0;
  content: '';
  height: 4px;
  left: 0;
  position: absolute;
  width: 418px;
}

.contents-detail-data p:nth-child(2) span {
  display: inline-block;
  font-size: 13px;
  font-style: italic;
  line-height: 44px;
  margin: 0 10px 0 0;
}

.contents-detail-data p:nth-child(2) span:last-child { margin: 0; }

.contents-detail-data p:last-child {
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .5px;
  position: absolute;
  right: 120px;
  top: 42px;
}

.contents-detail-data p:last-child::after {
  background: #fff;
  bottom: 6px;
  content: '';
  height: 2px;
  position: absolute;
  right: -30px;
  width: 14px;
}

.contents-detail-heading {
  font-size: 19px;
  font-weight: 900;
  letter-spacing: 1px;
  margin: 0 auto 15px;
  width: 935px;
}

.contents-detail-thumb {
  background: url('../img/event/gradationB.png') no-repeat left top, #fff;
  background-size: auto 100%;
  border-width: 2px;
  border-style: solid;
  border-color: rgb(25, 30, 30) rgb(119, 133, 150) rgb(119, 133, 150) rgb(25, 30, 30);
  height: 528px;
  margin: 0 auto 50px;
  width: 935px;
}

.contents-detail-thumb iframe {
  height: 100%;
  width: 100%;
}

.contents-detail-line {
  margin: 0 auto 40px;
  width: 100%;
}

.contents-detail-line img { display: block; }

.contents-detail-box {
  padding: 0 270px 0 90.5px;
  position: relative;
}

.contents-detail-txt { min-height: 220px; }

.contents-detail-txt p {
  font-size: 15px;
  font-weight: 700;
  line-height: 30px;
}

.contents-detail-share {
  padding: 7px 0 0;
  position: absolute;
  right: 87px;
  top: 0;
}

.contents-detail-share li {
  margin: 0 auto 30px;
  width: 28px;
}

.contents-detail-share li:last-child { margin: 0 auto; }

.contents-top {
  bottom: -55px;
  position: absolute;
  right: 40px;
  width: 175px;
}

@media screen and (max-width: 767px) {

  .sgl-contents { padding: 21.875vw 0 26.5625vw; }

  .sgl-contents h2 {
    margin: 0 auto 12.5vw;
    width: 67.1875vw;
  }

  .contents-detail {
    box-shadow: 1px 1px 5px rgba(45, 60, 60, .7);
    margin: 0 auto 10.9375vw;
    padding: 9.375vw 0;
    width: 90%;
  }

  .contents-detail-data {
    display: block;
    margin: 0 auto 4.6875vw;
    padding: 0;
    width: 71.875vw;
  }

  .contents-detail-data p:first-child {
    background: url('../img/contents/frameB_sp.png') no-repeat left top;
    background-size: 100% auto;
    font-size: 3.125vw;
    height: 6.875vw;
    line-height: 6.875vw;
    margin: 0 0 3.4375vw;
    width: 25.46875vw;
  }

  .contents-detail-data p:nth-child(2) {
    line-height: 0;
    padding: 2.5vw 0 2.8125vw;
  }

  .contents-detail-data p:nth-child(2)::after {
    background: url('../img/contents/lineB_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    height: .625vw;
    width: 100%;
  }

  .contents-detail-data p:nth-child(2)::before {
    background: url('../img/contents/lineB_sp.jpg') no-repeat left top;
    background-size: 100% auto;
    content: '';
    height: .625vw;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }

  .contents-detail-data p:nth-child(2) span {
    font-size: 2.5vw;
    line-height: normal;
    margin: 0 1.5625vw 0 0;
  }

  .contents-detail-data p:last-child {
    font-size: 2.5vw;
    letter-spacing: .5px;
    right: 13.90625vw;
    top: 9.375vw;
  }

  .contents-detail-data p:last-child::after {
    bottom: .625vw;
    height: 1px;
    right: -4.6875vw;
    width: 1.71875vw;
  }

  .contents-detail-heading {
    font-size: 3.28125vw;
    letter-spacing: 1px;
    line-height: 5vw;
    margin: 0 auto 3.125vw;
    width: 71.875vw;
  }

  .contents-detail-thumb {
    border-width: 1px;
    height: 40.625vw;
    margin: 0 auto 6.25vw;
    width: 71.875vw;
  }

  .contents-detail-line { margin: 0 auto 4.6875vw; }

  .contents-detail-box {
    margin: 0 auto;
    padding: 0;
    width: 71.875vw;
  }

  .contents-detail-txt {
    margin: 0 auto 12.5vw;
    min-height: auto;
  }

  .contents-detail-txt p {
    font-size: 2.5vw;
    line-height: 5vw;
  }

  .contents-detail-share {
    display: flex;
    justify-content: flex-start;
    position: static;
  }

  .contents-detail-share li {
    margin: 0 9.375vw 0 0;
    width: 7.1875vw;
  }

  .contents-detail-share li:last-child { margin: 0; }

  .contents-top {
    bottom: 0;
    right: 0;
    width: 26.5625vw;
  }

}

/* --------------------
- ANIME
-------------------- */
.anime {
  position: relative;
}

.anime-bg-container {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.anime-bg {
  position: absolute;
  top: 0;
  opacity: 0;
  transition: all .5s linear;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.anime-bg:nth-child(2) {
  z-index: 2;
}

.anime-bg:nth-child(3) {
  z-index: 3;
}

.anime-bg:nth-child(4) {
  z-index: 4;
}

.anime-bg.act {
  opacity: 1;
  transition: opacity 1s linear;
}

.anime-bg-img {
  width: 2693px;
}

.anime-nav {
  display: none;
}

.anime-main-onair {
  position: fixed;
  z-index: 102;
  top: 152px;
  left: calc(50% + 280px);
  width: 347px;
  opacity: 0;
  transform: translateX(80px);
  transition-delay: 3s;
}

.anime-main-onair.act {
  opacity: 1;
  transform: translateX(0px);
  transition: all .5s 2.5s cubic-bezier(.14,.71,.42,.98);
}

.anime-main-onair.fade {
  opacity: 0;
}

.anime-main-onair.delay0 {
  transition: all .2s cubic-bezier(.14,.71,.42,.98);
}

.anime-main-onair-icon {
  position: absolute;
  z-index: 1;
  top: -18px;
  left: 7px;
  width: 160px;
}

.wind-anime {
  z-index: 1;
}

.anime-main-ttl {
  display: none;
}

.anime-main {
  position: relative;
  width: 100%;
  height: 1080px;
}

.anime-main-kv-box {
  width: 100%;
  position: absolute;
  top: 0;
  z-index: -1;
}

.anime-kv {
  position: relative;
  z-index: 0;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.anime-kv-overlay {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background: #fff;
  opacity: .5;
  transition: all 2s ease;
}

.anime-kv-overlay2 {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background: #fff;
  mix-blend-mode: overlay;
  transition: all 2s ease;
}

.act .anime-kv-overlay,
.act .anime-kv-overlay2 {
  opacity: 0;
}

.anime-kv-img {
  width: 2563px;
}

.anime-main-assets {
  position: absolute;
  z-index: 1;
  width: 1024px;
  left: calc(50% - 512px);
  top: 0;
}

#anime-main-kv0 {

}

#anime-main-kv0 .anime-main-copy0 {
  position: absolute;
  z-index: 1;
  top: 184px;
  left: 1px;
  width: 388px;
  opacity: 0;
  transform: translateX(-30px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

#anime-main-kv0 .anime-main-copy1 {
  position: absolute;
  z-index: 1;
  top: 252px;
  left: -50px;
  width: 486px;
  opacity: 0;
  transition: all 1s 1.2s linear;
}

#anime-main-kv0 .anime-main-en-txt {
  position: absolute;
  z-index: 1;
  top: 246px;
  left: -8px;
  width: 388px;
  opacity: 0;
  transition: all .5s 2.5s cubic-bezier(.14,.71,.42,.98);
}

#anime-main-kv1 {
  display: none;
  opacity: 0;
}

#anime-main-kv1 .anime-main-copy0 {
  position: absolute;
  z-index: 1;
  top: 149px;
  left: 281px;
  width: 501px;
  opacity: 0;
  transform: translateX(-30px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

#anime-main-kv1 .anime-main-copy1 {
  position: absolute;
  z-index: 1;
  top: 281px;
  left: 285px;
  width: 493px;
  opacity: 0;
  transition: all 1s 1.2s linear;
}

#anime-main-kv1 .anime-main-en-txt {
  position: absolute;
  z-index: 1;
  top: 529px;
  left: 363px;
  width: 296px;
  opacity: 0;
  transition: all .5s 2.5s cubic-bezier(.14,.71,.42,.98);
}

#anime-main-kv0 .anime-main-copy0.act,
#anime-main-kv1 .anime-main-copy0.act {
  opacity: 1;
  transform: translateX(0px);
}

#anime-main-kv0 .anime-main-copy1.act,
#anime-main-kv1 .anime-main-copy1.act {
  opacity: 1;
  transform: translateX(0px);
}

#anime-main-kv0 .anime-main-en-txt.act,
#anime-main-kv1 .anime-main-en-txt.act {
  opacity: 1;
}

.anime-contents-wind {
  width: 339px;
  position: absolute;
  z-index: 1;
  width: 0;
  overflow: hidden;
  transition: all .5s cubic-bezier(1, 0, 0, 1);

}

.anime-contents-wind img {
  width: 339px;
}

.anime-main-change-nav {
  position: absolute;
  z-index: 5;
  top: 335px;
  left: 13px;
  width: 6px;
}

.anime-main-change-btn {
  width: 6px;
  height: 40px;
  background: url(../img/anime/main/current/off.png) no-repeat;
  background-size: 100% 100%;
  margin: 0 0 8px;
  cursor: pointer;
}

.anime-main-change-btn img {
  opacity: 0;
  transition: opacity .5s ease;
}

.anime-main-change-btn.act img {
  opacity: 1;
}

@media screen and (min-width: 768px) {
  .anime-main-change-btn:not(.act):hover img {
    opacity: 1;
  }
}

/*
anime-movie
-------------------- */
.anime-movie {
  margin: 0 0 117px;
  position: relative;
}

.anime-movie-ttl {
  position: relative;
  width: 280px;
  margin: -55px auto 49px;
}

.anime-movie-ttl .anime-contents-wind {
  top: 49px;
  left: -18px;
}

.anime-movie-ttl.act .anime-contents-wind {
  width: 339px;
}

.anime-movie-container {
  width: 1116px;
  height: 616px;
  margin: 0 auto;
  position: relative;
}

.anime-movie-list {
  position: absolute;
  /* z-index: 1; */
}

.anime-movie-box {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  display: none;
  cursor: pointer;
}

.anime-movie-box-inner {
  position: absolute;
  top: 38px;
  left: 131px;
  z-index: 2;
}

.anime-movie-play-btn {
  width: 240px;
  opacity: 0;
  transform: translateX(-30px);
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
  cursor: pointer;
}

.act .anime-movie-play-btn {
  opacity: 1;
  transform: translateX(0px);
}

.anime-movie-box-ttl {
  font-size: 17px;
  color: #0f1941;
  width: 230px;
  padding: 0 0 0 8px;
  line-height: 1.5em;
  height: 3em;
  overflow: hidden;
  opacity: 0;
  transform: translateX(-30px);
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.act .anime-movie-box-ttl {
  opacity: 1;
  transform: translateX(0px);
}

.anime-movie-box-txt {
  width: 225px;
  margin: 10px 0 0 6px;
  opacity: 0;
  transform: translateX(-30px);
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.act .anime-movie-box-txt {
  opacity: 1;
  transform: translateX(0px);
}

.anime-movie-bg {
  width: 914px;
  height: 614px;
  margin: 0 0 0 142px;
  position: relative;
  background: #000;
  z-index: 0;
  overflow: hidden;
  -webkit-mask-image: url(../img/anime/movie/thumb_mask.png);
  -webkit-mask-clip: content-box;
  -webkit-mask-size: 914px 614px;
  /*display: flex;
  justify-content: center;
  align-items: center;*/
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.anime-movie-mask {
  position: absolute;
  z-index: 3;
  top: -1px;
  left: -1px;
  width: 916px;
  height: 616px;
}

.anime-movie-mask0 {
  position: absolute;
  z-index: 0;
  width: 748px;
  height: 100%;
  top: 0px;
  left: 0px;
  overflow: hidden;
  transition: all .3s ease;
}

.anime-movie-mask1 {
  position: absolute;
  z-index: 0;
  width: 831px;
  height: 559px;
  bottom: 11px;
  left: 53px;
  overflow: hidden;
  transition: all .3s .2s ease-out;
}

.anime-movie-mask1 img {
  width: 831px;
  position: absolute;
  bottom: 0;
}

.anime-movie-mask2 {
  position: absolute;
  z-index: 0;
  width: 666px;
  height: 100%;
  top: 82px;
  left: 250px;
  overflow: hidden;
  transition: all .2s .4s ease-in;
}

.anime-movie-mask2 img {
  width: 666px;
}

.anime-movie-mask0 img {
  width: 748px;
}

/*
.anime-movie-mask {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.anime-movie-mask0 {
  position: absolute;
  z-index: 0;
  width: 750px;
  height: 100%;
  top: -1px;
  left: -1px;
  overflow: hidden;
  transition: all .3s ease;
}

.anime-movie-mask1 {
  position: absolute;
  z-index: 0;
  width: 830px;
  height: 560px;
  bottom: 11px;
  left: 54px;
  overflow: hidden;
  transition: all .3s .2s ease-out;
}

.anime-movie-mask1 img {
  width: 830px;
  position: absolute;
  bottom: 0;
}

.anime-movie-mask2 {
  position: absolute;
  z-index: 0;
  width: 668px;
  height: 100%;
  top: 81px;
  left: 248px;
  overflow: hidden;
  transition: all .2s .4s ease-in;
}

.anime-movie-mask2 img {
  width: 668px;
}

.anime-movie-mask0 img {
  width: 750px;
}
*/
.act .anime-movie-mask0 {
  height: 0;
}

.act .anime-movie-mask1 {
  height: 0;
}

.act .anime-movie-mask2 {
  height: 0;
}

.anime-movie-overlay {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.anime-movie-player {
  width: 1280px;
  position: relative;
  z-index: 0;
  top: 0;
  left: calc((1280px - 914px)/-2);
  right: 0;
  bottom: 0;
  height: 100%;
  margin: auto;
  opacity: 0;
  transition: all .5s ease-out;
}

.anime-movie-player.act {
  opacity: 1;
  transition: all 2s .3s cubic-bezier(0,.47,1,.55);
}

.anime-movie-player::after {
  content: "";
  display: block;
  padding-top: 56.25%;
}

.anime-movie-iframe {
  position: absolute;
  z-index: 0;
  top: -100px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: calc(100% + 200px );
}

.anime-movie-control {
  position: absolute;
  z-index: 5;
  width: 100%;
  top: 0;
  opacity: 0;
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.anime-movie-control.act {
  opacity: 1;
}

.anime-movie-next {
  width: 71px;
  position: absolute;
  z-index: 2;
  right: -13px;
  top: 282px;
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.anime-movie-prev {
  width: 72px;
  position: absolute;
  z-index: 2;
  left: -2px;
  top: 282px;
  transition: all .5s cubic-bezier(.14,.71,.42,.98);
}

.anime-movie-nav {
  position: absolute;
  z-index: 2;
  display: flex;
  top: 526px;
  left: 799px;
  width: 182px;
  flex-wrap: wrap;
}

.anime-movie-nav-box {
  width: 41px;
  height: 5px;
  background: url(../img/anime/movie/current/base.png) no-repeat;
  background-size: 100% 100%;
  margin: 0 4px 7px 0;
}

.anime-movie-nav-box.act {
  background: url(../img/anime/movie/current/act.png) no-repeat;
  background-size: cover;
}

.anime-movie-nav-box.blank {
  background: url(../img/anime/movie/current/blank.png) no-repeat;
  background-size: cover;
}

@media screen and (min-width: 768px) {

  .act .anime-movie-play-btn:hover {
    opacity: .6;
  }
    
  .anime-movie-bg:hover {
    opacity: .6;
  }
  
  .anime-movie-next:hover,
  .anime-movie-prev:hover  {
    opacity: .6;
  }  
}

#noise {
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  /*mix-blend-mode: soft-light;*/
  opacity: .15;
}

/*
anime-onair
-------------------- */
.anime-onair {
  margin: 0 0 117px;
  position: relative;
  z-index: 2;
}

.anime-onair-ttl {
  position: relative;
  width: 298px;
  margin: 0 auto 88px;
}

.anime-onair-ttl .anime-contents-wind {
  top: 52px;
  left: -10px;
}

.anime-onair-ttl.act .anime-contents-wind {
  width: 339px;
}

.anime-onair-inner {
  width: 793px;
  margin: 0 auto;
}

.anime-onair-bc {
  margin: 0 0 72px;
}

.anime-onair-bc-ttl {
  width: 170px;
  margin: 0 auto 4px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-bc-box {
  margin: -9px 0 0;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-bc .anime-onair-bc-box:nth-child(2) {
  margin: 0;
  transition-delay: .2s;
}

.anime-onair-bc .anime-onair-bc-box:nth-child(3) {
  transition-delay: .4s;
}

.anime-onair-bc .anime-onair-bc-box:nth-child(4) {
  transition-delay: .6s;
}

.anime-onair-bc-caution {
  width: 292px;
  margin: -59px 0 0 502px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s .8s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-st {
  margin: 0 0 49px;
}

.anime-onair-block {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-st-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: flex-start;
}

.anime-onair-st-link {
  display: block;
}

/*ABEMA*/
.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) {
  width: 339px;
  margin: 0 79px 0 0;
}

.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-link {
  width: 279px;
  margin: 0 0 0 5px;
}

.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-box-txt {
  transform: translateY(-13px);
}

.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
  width: 192px;
  transform: translateY(-28px);
}

.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-link {
  margin: 0 0 4px 1px;
}

.anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-box-txt {
  width: 170px;
}

/*見放題*/
.anime-onair-mihoudai .anime-onair-block-ttl {
  margin: 0 0 17px;
}

.anime-onair-mihoudai .anime-onair-st-list {
  justify-content: flex-start;
  align-items: flex-start;
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box {
  margin: 0 15px 0 0;
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) {
  width: 109px;
  margin-bottom: 9px;
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
  width: 236px;
  transform: translateY(-22px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(3) {
  width: 231px;
  transform: translateY(-43px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(4) {
  width: 155px;
  transform: translateY(-58px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(5) {
  width: 142px;
  margin-bottom: 15px;
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(6) {
  width: 198px;
  transform: translateY(-19px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(7) {
  width: 101px;
  transform: translateY(-29px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(8) {
  width: 180px;
  transform: translateY(-46px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(9) {
  width: 98px;
  transform: translateY(-56px);
  margin: 0;
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(10) {
  width: 64px;
  transform: translateY(0px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(11) {
  width: 65px;
  transform: translateY(-7px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(12) {
  width: 91px;
  transform: translateY(-15px);
}

.anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(13) {
  width: 101px;
  transform: translateY(-26px);
}

/*見放題*/
.anime-onair-tudo .anime-onair-block-ttl {
  margin: 0 0 3px;
}

.anime-onair-tudo .anime-onair-st-list {
  justify-content: flex-start;
  align-items: flex-start;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box {
  margin: 0 15px 0 0;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) {
  width: 255px;
  margin-bottom: 13px;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
  width: 154px;
  transform: translateY(-14px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(3) {
  width: 138px;
  transform: translateY(-28px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(4) {
  width: 198px;
  transform: translateY(-47px);
  margin: 0;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(5) {
  width: 100px;
  transform: translateY(0);
  margin-bottom: 8px;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(6) {
  width: 123px;
  transform: translateY(-11px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(7) {
  width: 182px;
  transform: translateY(-28px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(8) {
  width: 182px;
  transform: translateY(-45px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(9) {
  width: 97px;
  transform: translateY(-56px);
  margin: 0;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(10) {
  width: 158px;
  transform: translateY(0);
  margin-bottom: 10px;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(11) {
  width: 103px;
  transform: translateY(-11px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(12) {
  width: 93px;
  transform: translateY(-20px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(13) {
  width: 126px;
  transform: translateY(-32px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(14) {
  width: 135px;
  transform: translateY(-45px);
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) {
  display: flex;
  align-items: flex-start;
  margin: 0 0 20px;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) .anime-onair-st-link {
  width: 129px;
  margin: 0 14px 0 0;
}

.anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) .anime-onair-st-list-box-txt {
  width: 374px;
  transform: translateY(-30px);
}

/*見逃し*/
.anime-onair-minogashi .anime-onair-block-ttl {
  margin: 0 0 3px;
}

.anime-onair-minogashi .anime-onair-st-list {
  transform: translateY(-5px);
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box {
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) {
  width: 340px;
  margin: 0 28px 0 0;
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-box-txt {
  width: 259px;
  margin: 0 0 9px;
}

.anime-onair-st-list-inner {
  display: flex;
  align-items: flex-start;
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box {
  margin: 0 15px 0 0;
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(1) {
    width: 86px;
  transform: translateY(0);
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(2) {
  width: 68px;
  transform: translateY(-8px);
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(3) {
  width: 156px;
  transform: translateY(-19px);
  margin: 0;
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
  width: 260px;
  transform: translateY(-32px);
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-box-txt {
  width: 260px;
  margin: 0 0 5px;
}

.anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(1) {
  width: 148px;
  transform: translateY(0);
}

.anime-onair-st-notes {
  width: 462px;
  margin: 44px 0 0;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

/*
.anime-onair-st-ttl {
  width: 165px;
  margin: 0 auto 22px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-st-box:nth-last-child(1) {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s 1s cubic-bezier(.14,.71,.42,.98);
}

.flex {
  display: flex;
  flex-wrap: wrap;
}

.anime-onair-st-box-ttl {
  width: 330px;
  padding: 126px 58px 0 60px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s .2s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-st-box-inner {
  width: 463px;
}

.anime-onair-st-box-block {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s .4s cubic-bezier(.14,.71,.42,.98);
}

.anime-onair-st-box-inner .anime-onair-st-box-block:nth-child(2) {
  margin: -6px 0 0;
  transition-delay: .6s;
}

.anime-onair-st-box-line {
  margin: -14px 0 14px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s .8s cubic-bezier(.14,.71,.42,.98);
}
*/

.anime-onair-bc-ttl.act,
.anime-onair-bc-box.act,
.anime-onair-bc-caution.act,
.anime-onair-st-ttl.act,
.anime-onair-st-box:nth-child(2).act .anime-onair-st-box-ttl,
.anime-onair-st-box:nth-child(2).act .anime-onair-st-box-inner .anime-onair-st-box-block,
.anime-onair-st-box:nth-child(2).act .anime-onair-st-box-line,
.anime-onair-st-box:nth-last-child(1).act,
.anime-onair-block.act,
.anime-onair-st-notes.act {
  opacity: 1;
  transform: translateX(0px);
}

/*
anime-story
-------------------- */
.anime-story {
  margin: 0 0 200px;
  position: relative;
  z-index: 2;
}

.anime-story-ttl {
  position: relative;
  width: 283px;
  margin: 0 auto 83px;
}

.anime-story-ttl .anime-contents-wind {
  top: 50px;
  left: -18px;
}

.anime-story-ttl.act .anime-contents-wind {
  width: 339px;
}

.anime-story-inner {
  width: 1116px;
  margin: 0 auto;
  /*padding: 0 0 0 105px;*/
  position: relative;
}

.anime-story-nav {
  display: flex;
  justify-content: center;
  position: relative;
  margin: 0 auto 36px;
  height: 40px;
  opacity: 0;
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-story-nav.act {
  opacity: 1;
}

.anime-story-nav-box {
  position: relative;
  display: flex;
  padding: 0 15px;
  box-sizing: content-box;
}

.anime-story-nav-icon {
  width: 75.5px;
  position: relative;
  left: 5px;
  top: -9px;
  z-index: -1;
  display: none;
}

.anime-story-nav-btn {
  width: 40px;
  height: 40px;
  overflow: hidden;
}

.anim .anime-story-nav-icon {
  display: block;
  animation: storyNavAnimIcon .6s ease;
}

@keyframes storyNavAnimIcon {
  0% { transform: translateX(0px);}
  20% {transform: translateX(-20px);}
  30% {transform: translateX(-20px);}
  50% {transform: translateX(20px);}
  80% {transform: translateX(0px);}
}

.anim .anime-story-nav-btn {
  animation: storyNavAnimBtn .6s ease;
}
@keyframes storyNavAnimBtn {
  0% { transform: translateX(0px);}
  45% {transform: translateX(0px);}
  50% {transform: translateX(20px);}
  80% {transform: translateX(0px);}
}

@media screen and (min-width: 768px) {
  .anime-story-nav-box:hover .anime-story-nav-icon {
    display: block;
  }
}

.anime-story-nav-box.act .anime-story-nav-btn img {
  margin-top: -40px;
}
.anime-story-nav-box.act .anime-story-nav-icon {
  display: block;
}

.anime-story-container {
  height: 300px;
  position: relative;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-story-container.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-story-box {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.anime-story-left {
  display: flex;
  margin: 0 33px 0 0;
}

.anime-story-thumb {
  width: 532px;
  height: 300px;
  overflow: hidden;
  margin: 0 15px 0 0;
  box-shadow: 10px 10px 10px rgba(0,84,82,.4);
  line-height: 0;
}

.anime-story-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  font-family: 'object-fit: cover;';  /*IE対策*/
}

.anime-story-thumb-list {
  width: 165px;
}

.anime-story-thumb-box {
  width: 100%;
  height: 93px;
  margin: 0 0 10px;
  box-shadow: 10px 10px 10px rgba(0,84,82,.4);
  line-height: 0;
}

.anime-story-thumb-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  font-family: 'object-fit: cover;';  /*IE対策*/
}



.anime-story-thumb-box:nth-last-child(1) {
  margin: 0;
}

.anime-story-right {
  width: 370px;
  color: #0f1941;
  border-bottom: 1px solid;
}

.anime-story-box-ttl-num {
  height: 24px;
  margin: 0 0 7px;
}

.anime-story-box-ttl-num-img {
  height: 100%;
  width: auto;
}

.anime-story-box-ttl {
  font-size: 30px;
  font-weight: 900;
  padding: 0 0 10px;
  border-bottom: 1px solid;
  line-height: 1.5em;
  white-space: nowrap;
}

.anime-story-box-txt {
  padding: 25px 0;
  font-size: 14px;
  line-height: 1.85em;
  font-weight: bold;
  text-align: justify;
  text-justify: inter-ideograph;
}

.anime-story-footer {
  display: flex;
  margin: 31px 0 0;
  opacity: 0;
  transition: all .6s .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-story-footer.act {
  opacity: 1;
}

.anime-story-control {
  display: flex;
  margin: 0 0 0 -4px;
}

.anime-story-control.coming {
  opacity: .5;
  pointer-events: none;
}

.anime-story-prev {
  width: 122.5px;
}

.anime-story-next {
  width: 123px;
  margin: 0 0 0 -30px;
}

.anime-story-en-txt {
  width: 365px;
  margin: 10px 0 0 9px;
}

/*
anime-staffcast
-------------------- */
.anime-staffcast {
  position: relative;
  z-index: 2;
}

.anime-staffcast-ttl {
  position: relative;
  width: 545px;
  margin: 0 auto 76px;
}

.anime-staffcast-ttl .anime-contents-wind {
  top: 61px;
  left: 112px;
}

.anime-staffcast-ttl.act .anime-contents-wind {
  width: 339px;
}

.anime-staff {
  margin: 0 0 82px;
}

.anime-staff-ttl {
  width: 74px;
  margin: 0 auto 53px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .5s .5s cubic-bezier(.14,.71,.42,.98);
}

.anime-staff-ttl.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-staff-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 1115px;
  margin: 0 auto;
}

.anime-staff-box {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-staff-box:nth-child(1) {
  width: 149px;
  margin: 0 132px 0 0;
  transition-delay: 1s;
}

.act .anime-staff-box {
  opacity: 1;
  transform: translateX(0px);
}

.anime-staff-box:nth-child(2) {
  width: 191px;
  margin: 0 184px 0 0;
  transition-delay: 1.2s;
}

.anime-staff-box:nth-child(3) {
  width: 124px;
  margin: 0 162px 0 0;
  transition-delay: 1.4s;
}

.anime-staff-box:nth-child(4) {
  width: 173px;
  transition-delay: 1.6s;
}

.anime-staff-box:nth-last-child(1) {
  width: 737px;
  margin: 80px 0 0 0;
  transition-delay: 2s;
}

.anime-cast {
  margin: 0 0 110px;
}

.anime-cast-ttl {
  width: 63px;
  margin: 0 auto 53px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-cast-ttl.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-cast-list {
  justify-content: center;
  width: 756px;
  margin: 0 auto;
}

.anime-cast-box {
  margin: 0 0 64px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}
/*
.anime-cast-box:nth-child(1) {
  transition-delay: .5s;
}

.anime-cast-box:nth-child(2) {
  transition-delay: .7s;
}

.anime-cast-box:nth-child(3) {
  transition-delay: .9s;
}

.anime-cast-box:nth-child(4) {
  transition-delay: 1.1s;
}

.anime-cast-box:nth-child(5) {
  transition-delay: 1.8s;
}

.anime-cast-box:nth-child(6) {
  transition-delay: 2s;
}
*/

.anime-cast-box.act  {
  opacity: 1;
  transform: translateX(0px);
}

/*
anime-bd
-------------------- */
.anime-bd {
  position: relative;
  z-index: 2;
  width: 1116px;
  margin: 0 auto 200px;
}

.anime-bd-ttl {
  position: relative;
  width: 345.5px;
  margin: 0 auto 76px;
}

.anime-bd-ttl .anime-contents-wind {
  top: 51px;
  left: 14px;
}

.anime-bd-ttl.act .anime-contents-wind {
  width: 339px;
}

.anime-bd-container {
  display: flex;
  flex-wrap: wrap;
  width: 837px;
  margin: 0 auto 73px;
}

.anime-bd-box {
  width: 244px;
  margin: 0 17.5px 47px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.act .anime-bd-box {
  opacity: 1;
  transform: translateX(0px);
}

.anime-bd-box:nth-child(1) {
}

.anime-bd-box:nth-child(2) {
  transition-delay: .1s;
}

.anime-bd-box:nth-child(3) {
  transition-delay: .2s;
}

.anime-bd-box:nth-child(4) {
  transition-delay: .3s;
}

.anime-bd-box:nth-child(5) {
  transition-delay: .4s;
}

.anime-bd-box:nth-child(6) {
  transition-delay: .5s;
}

.anime-bd-detail-btn {
  display: block;
}

.anime-bd-thumb {
  box-shadow: 10px 10px 10px rgba(0,84,82,.4);
}

.anime-bd-thumb.coming {
  box-shadow: none;
}

.anime-bd-thumb-ttl {
  width: 195px;
  margin: 14px 0 0 29px;
}

/*
法人特典
*/
.anime-bd-houjin {
  color: #122453;
}

.anime-bd-houjin-ttl {
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #122453;
  margin: 0 0 50px;
  padding: 0 0 18px;
  line-height: 1em;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-bd-houjin-ttl.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-bd-houjin-ttl img {
  width: auto;
  height: 20px;
}

.anime-bd-houjin-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
}

.anime-bd-houjin-block.a-on {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-bd-houjin-block.a-on.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-bd-houjin-block:nth-last-child(1) {
  border-bottom: 1px solid #122453;
  margin: 0 0 73px;
}

.anime-bd-houjin-block:nth-last-child(1) .anime-bd-houjin-box {
  border: none;
}

.anime-bd-houjin-block:nth-last-child(3) .anime-bd-houjin-box  {
  border: none;
  padding: 50px 0 140px;
}

.anime-bd-houjin-block:nth-last-child(2) .anime-bd-houjin-box {
  border-top: 1px solid #122453;
}

.animate,
.amazon,
.tower,
.rakuten {
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-bd-houjin-box.act {
  opacity: 1;
  transform: translateX(0px);

}

.anime-bd-houjin-block-ttl {
  width: 100%;
  font-size: 20px;
  font-weight: 900;
  text-align: center;
  margin: 0 0 50px;
}

.anime-bd-houjin-block-ttl.m0 {
  margin: 0;
}

.anime-bd-houjin-block-ttl span {
  font-size: 14px;
}

.anime-bd-houjin-box {
  width: 531px;
  padding: 50px 0 140px;
  position: relative;
  border-bottom: 1px solid #122453;
}

.anime-bd-houjin-box-ttl {
  font-size: 18px;
  font-weight: 900;
  text-align: center;
  margin: 0 0 15px;
}

.anime-bd-houjin-box-img {
  width: 398px;
  position: relative;
  margin: 0 auto 30px;
}

.anime-bd-houjin-box-img img {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  font-family: 'object-fit: contain;';  /*IE対策*/
}

.anime-bd-houjin-box-img::after {
  content: "";
  display: block;
  padding-top: 67.25%;
}

.anime-bd-houjin-box-txt {
  font-size: 14px;
  font-weight: bold;
  line-height: 1.8em;
}

.anime-bd-houjin-block-footer {
  width: 100%;
}

.anime-bd-houjin-link {
  width: 369px;
  margin: 0 auto;
  display: block;
  position: absolute;
  z-index: 1;
  bottom: 60px;
  left: calc((100% - 369px)/2 - 10px);
  opacity: 0;
  transition: all .6s .6s cubic-bezier(.14,.71,.42,.98);
}

.act .anime-bd-houjin-link { 
  opacity: 1;
}

.act .anime-bd-houjin-link img {
  transition: .4s; 
}

.act .anime-bd-houjin-link img:hover {
  opacity: .5;
}


/*
法人共通特典
*/
.anime-bd-houjin2-block {
  margin: 0 0 70px;
  padding: 20px 75px 70px 75px;
  display: flex;
  border-bottom: 1px solid #122453;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .6s .6s cubic-bezier(.14,.71,.42,.98);
}

.anime-bd-houjin2-block.act {
  opacity: 1;
  transform: translateX(0px);
}

.anime-bd-houjin2-left {
  width: 398px;
}

.anime-bd-houjin2-right {
  width: 575px;
  padding: 40px 0 0 50px;
}

.anime-bd-houjin-notes {
  color: #122453;
  font-size: 12px;
  line-height: 2.2em;
  opacity: 0;
  transition: all .6s 1.2s cubic-bezier(.14,.71,.42,.98);
}

.anime-bd-houjin-notes.act {
  opacity: 1;
}


/*
detail
*/
.anime-bd-modal {
  color: #0f1941;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100000000;
  padding: 180px 0;
  overflow-y: scroll;
  display: none;
}

.anime-bd-modal-prev {
  position: fixed;
  width: 71px;
  height: 105px;
  top: calc((100% - 105px)/2);
  left: calc(50% - 559px);
}

.anime-bd-modal-next {
  position: fixed;
  width: 71px;
  height: 105px;
  top: calc((100% - 105px)/2);
  left: calc(50% + 500px);
}

.anime-bd-modal-close {
  position: absolute;
  z-index: 1;
  width: 53px;
  height: 53px;
  top: 41px;
  right: 39px;
}

.anme-bd-modal-inner {
  width: 943px;
  margin: 0 auto;
  position: relative;
}

.anime-bd-detail-box {
  background: rgba(255,255,255,.9);
  box-shadow: 15px 15px 25px rgb(8 126 130 / 40%);
  padding: 60px 0 20px;
}

.anime-bd-detail-ttl {
  font-size: 35px;
  font-weight: 900;
  text-align: center;
  line-height: 1;
  margin: 0 0 18px;
}

.anime-bd-detail-sub-ttl {
  text-align: center;
  line-height: 0;
  margin: 0 0 70px;
}

.anime-bd-detail-sub-ttl-img {
  height: 14px;
  width: auto;
}

.anime-bd-detail-inner {
  display: flex;
  justify-content: center;
}

.anime-bd-detail-thumb-box {
  width: 333px;
}

.anime-bd-detail-thumb {
  margin: 0 0 20px;
}

.anime-bd-detail-cover-num {

}

.anime-bd-detail-cover-num img {
  height: 26px;
  width: auto;
}

.anime-bd-detail-spec {
  width: 463px;
  margin: 0 0 0 33px;
  font-weight: bold;
}

.anime-bd-detail-release {
  font-size: 18px;
  margin: 0 0 6px;
}

.anime-bd-detail-ep {
  border-top: 1px solid;
  border-bottom: 1px solid;
  display: flex;
  align-items: center;
  padding: 8px 0;
}

.anime-bd-detail-ep-ttl {
  font-size: 18px;
  margin: 0 25px 0 0;
}

.anime-bd-detail-ep-txt {
  font-size: 19px;
  border-left: 1px solid;
  line-height: 1.8em;
  padding: 0 0 0 29px;
}

.anime-bd-detail-tokuten {
  padding: 40px 0;
  font-size: 16px;
  line-height: 1.75em;
}

.anime-bd-detail-tokuten.bb {
  border-bottom: 1px solid;
}

.anime-bd-detail-tokuten.free {
  border-top: 1px solid;
}

.anime-bd-detail-tokuten-ttl {
  font-size: 18px;
  font-weight: 900;
  margin: 0 0 10px;
}

.anime-bd-detail-tokuten-ttl span {
  font-size: 12px;
}

.anime-bd-detail-tokuten-txt {
  font-size: 16px;
}

.no-scroll {
  position: fixed;
  width: 100%;
  overflow: hidden;
}

.hide {
  display: none;
}

@media screen and (max-width: 767px) {
  
  .anime {
    position: relative;
  }

  .anime-nav {
    display: flex;
    align-items: flex-start;
    position: fixed;
    z-index: 100;
    bottom: 0;
    left: 0;
    width: 100vw;
    background: #0d1327 url(../img/game/nav_bg.png) center bottom no-repeat;
    background-size: 100% auto;
    box-sizing: inherit;
    padding-bottom: env(safe-area-inset-bottom);
    overflow: hidden;
  }

  .anime-to-top {
    bottom: 0;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .anime-nav-inner {
    width: 81.40625vw;
    display: flex;
    flex-wrap: wrap;
    height: 17.5vw;
  }

  .anime-nav-box {
    line-height: 1em;
  }

  .anime-nav-box:nth-child(1) {
    width: 26.40625vw;
  }

  .anime-nav-box:nth-child(2) {
    width: 27.1875vw;
  }

  .anime-nav-box:nth-child(3) {
    width: 27.8125vw;
  }

  .anime-nav-box:nth-child(4) {
    width: 40.15625vw;
  }

  .anime-nav-box:nth-child(5) {
    width: 41.09375vw;
  }

  .anime-nav-box {
    height: 8.75vw;
  }

  .anime-nav-img {
    width: 100%;
    height: 100%;
  }

  .anime-nav-top {
    width: 18.59375vw;
    height: 17.5vw;
  }

  .anime-main {
    position: relative;
    height: 141.40625vw;
    margin: 0 0 7.96875vw;
  }

  .anime-main-ttl {
    display: block;
    position: absolute;
    z-index: 1;
    top: 94.21875vw;
    left: 64.84375vw;
    width: 31.71875vw;
    opacity: 0;
    transform: translateX(80px);
    transition: all .5s 2.5s cubic-bezier(.14,.71,.42,.98);
  }

  .anime-main-ttl.act {
    opacity: 1;
    transform: translateX(0px);
  }

  .anime-main-onair {
    z-index: 1;
    top: 126.09375vw;
    left: 55.46875vw;
    width: 43.4375vw;
    position: absolute;
  }
  
  .anime-main-onair-icon {
    display: none;
  }
  
  .wind-anime {
    z-index: 1;
  }

  .wind-anime.sp {
    z-index: 0;
  }
  
  .anime-kv {
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: center;
  }
  
  .anime-kv-img {
    width: 100%;
  }
  
  .anime-main-assets {
    width: 100%;
    left: 0;
  }
  
  #anime-main-kv0 .anime-main-copy0 {
    top: 37.03125vw;
    left: 3.125vw;
    width: 52.5vw;
    transform: translateX(-50px);
  }
  
  #anime-main-kv0 .anime-main-copy1 {
    top: 47.34375vw;
    left: 3.906255vw;
    width: 60.78125vw;
    /*transform: translateX(-50px);
    transition: all 1s .8s cubic-bezier(.14,.71,.42,.98);*/
  }
  
  #anime-main-kv0 .anime-main-en-txt {
    top: 10.15625vw;
    left: 62.1875vw;
    width: 34.375vw;
  }
  
  #anime-main-kv1 .anime-main-copy0 {
    top: 43.28125vw;
    left: 3.75vw;
    width: 94.21875vw;
    transform: translateX(-50px);
  }
  
  #anime-main-kv1 .anime-main-copy1 {
    top: 65.625vw;
    left: 4.53125vw;
    width: 92.5vw;
  }
  
  #anime-main-kv1 .anime-main-en-txt {
    top: 105.625vw;
    left: 0;
    width: 39.375vw;
  }
  
  .anime-contents-wind {
    width: 0;
  }

  .anime-contents-wind img {
    width: 52.96875vw;
  }

  .anime .game-wind-c {
    width: 100%;
    top: 0;
    margin: 0 0 0 961px;
  }

  .anime-bg-container {
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    height: calc(100% - 17.5vw);
  }
  
  .anime-bg {
    position: absolute;
    top: 0;
    opacity: 0;
    padding-bottom: env(safe-area-inset-bottom);
  }
  
  .anime-bg-img {
    width: 100%;
  }

  .anime-main-change-nav {
    position: absolute;
    z-index: 5;
    top: 131.875vw;
    left: 17.65625vw;
    width: 1.09375vw;
    transform: rotate(-97.7deg) translateY(-50px);
    opacity: 0;
    transition: all .5s 2.5s cubic-bezier(.14,.71,.42,.98);
  }

  .anime-main-change-nav.act {
    transform: rotate(-97.7deg) translateY(0px);
    opacity: 1;
  }
  
  .anime-main-change-btn {
    width: 1.09375vw;
    height: 8.75vw;
    background: url(../img/anime/main/current/off.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 0 1.875vw;
    cursor: default;
  }

  .anime-main-change-btn img {
    width: 100%;
    height: 100%;
  }

  

  /*
  anime-movie
  -------------------- */
  .anime-movie {
    margin: 0 0 26.5625vw;
    position: relative;
    /* z-index: 2; */
  }

  .anime-movie-ttl {
    width: 43.75vw;
    margin: 2.8125vw auto 8.75vw;
  }

  .anime-movie-ttl .anime-contents-wind {
    top: 7.65625vw;
    left: -2.8125vw;
  }

  .anime-movie-container {
    width: 90.625vw;
    height: 58.125vw;
    margin: 0 auto;
  }

  .anime-movie-list {
    position: absolute;
    /* z-index: 1; */
  }

  .anime-movie-box {
    top: 0;
    left: 0;
  }

  .anime-movie-box-inner {
    top: 0;
    left: 0;
  }

  .anime-movie-play-btn {
    width: 37.5vw;
    position: absolute;
    z-index: 2;
    top: 38.75vw;
    left: 50.15625vw;
    transform: translateX(30px);
  }

  .anime-movie-box-ttl {
    font-size: 8.5px;
    width: 32vw;
    padding: 0;
    position: absolute;
    z-index: 2;
    top: 54.53125vw;
    left: 50.6875vw;
    transform: translateX(30px);
  }

  .anime-movie-box-txt {
    width: 35.15625vw;
    margin: 0;
    position: absolute;
    z-index: 2;
    top: 2.96875vw;
    left: -.15625vw;
  }

  .anime-movie-bg {
    width: 86.5625vw;
    height: 58.125vw;
    margin: 0 0 0 2.34375vw;
    -webkit-mask-size: 86.5625vw 58.125vw;
    z-index: -2;
    transform: translateZ(-5px);
  }

  .anime-movie-mask {
    width: 86.5625vw;
    height: 58.4375vw;
    top: -0.15625vw;
    left: -0.15625vw;
  }
    
  .anime-movie-mask0 {
    width: 71.25vw;
    top: 0;
    left: 0;
    filter: drop-shadow(1px -1px 0px white);
  }
  
  .anime-movie-mask0 img {
    width: 71.25vw;
  }
  
  .anime-movie-mask1 {
    width: 79.0625vw;
    bottom: .78125vw;
    left: 4.6875vw;
    filter: drop-shadow(1px -1px 0px white);
  }
  
  .anime-movie-mask1 img {
    width: 79.0625vw;
  }
  
  .anime-movie-mask2 {
    width: 63.4375vw;
    top: 7.7vw;
    left: 23.28125vw;
    filter: drop-shadow(2px 0px 0px white);
  }
  
  .anime-movie-mask2 img {
    width: 63.28125vw;
  }  
  /*
  .anime-movie-mask0 {
    width: 70.9375vw;
    top: -.15625vw;
    left: -.15625vw;
  }
  
  .anime-movie-mask0 img {
    width: 70.9375vw;
  }
  
  .anime-movie-mask1 {
    width: 78.59375vw;
    bottom: 1.09375vw;
    left: 5.15625vw;
  }
  
  .anime-movie-mask1 img {
    width: 78.59375vw;
  }
  
  .anime-movie-mask2 {
    width: 63.28125vw;
    top: 7.65625vw;
    left: 23.59375vw;
  }
  
  .anime-movie-mask2 img {
    width: 63.28125vw;
  }
  */

  .anime-movie-overlay {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .anime-movie-player {
    width: 100vw;
    left: calc((100vw - 86.5625vw)/-2);
  }

  .anime-movie-player::after {
    content: "";
    display: block;
    padding-top: 56.25%;
  }

  .anime-movie-iframe {
  }

  .anime-movie-control {
    position: absolute;
    z-index: 2;
    width: 100%;
  }

  .anime-movie-next {
    width: 6.5625vw;
    right: -1.09375vw;
    top: 23.28125vw;
  }

  .anime-movie-prev {
    width: 6.71875vw;
    left: -.15625vw;
    top: 23.28125vw;
  }

  .anime-movie-nav {
    position: absolute;
    z-index: 2;
    display: flex;
    top: 64.84375vw;
    left: 5.3125vw;
    width: 180px;
    flex-wrap: wrap;
  }

  .anime-movie-nav-box {
    width: 9.0625vw;
    height: .78125vw;
    margin: 0 1.25vw 4.53125vw 0;
  }
  
  /*
  anime-onair
  -------------------- */
  .anime-onair {
    margin: 0 0 19.21875vw;
  }
  
  .anime-onair-ttl {
    width: 46.5625vw;
    margin: 2.65625vw auto 6.5625vw;
  }
  
  .anime-onair-ttl .anime-contents-wind {
    top: 7.5vw;
    left: -2.1875vw;
  }
  
  .anime-onair-inner {
    width: 90.625vw;
    margin: 0 auto;
  }
  
  .anime-onair-bc {
    margin: 0 0 10.46875vw;
  }
  
  .anime-onair-bc-ttl {
    width: 28.125vw;
    margin: 0 auto 2.8125vw;
  }
  
  .anime-onair-bc-box {
    margin: 0 0 2.5vw;
  }
  
  .anime-onair-bc .anime-onair-bc-box:nth-child(2) {
    margin: 0 0 2.5vw;
  }
  
  .anime-onair-bc .anime-onair-bc-box:nth-child(4) {
    margin: 0;
  }
  
  .anime-onair-bc-caution {
    width: 49.21875vw;
    margin: -1.71875vw 0 0;
  }
  
  .anime-onair-st {
    margin: 0 0 19.6875vw;
  }
  
  .anime-onair-block {
    opacity: 0;
    transform: translateX(-50px);
    transition: all .6s cubic-bezier(.14,.71,.42,.98);
  }
  
  .anime-onair-st-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  
  .anime-onair-st-link {
    display: block;
    line-height: 0;
  }
  
  /*ABEMA*/
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1),
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
    width: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    transform: translateY(0);
  }
  
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-link {
    width: 65.625vw;
    margin: -1.40625vw auto 1.71875vw;
    order: 2;
  }
  
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-box-txt {
    transform: translateY(0);
    margin: -3.75vw 0 0;
    width: 89.0625vw;
    order: 1;
  }
    
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-link {
    width: 45.3125vw;
    margin: -.78125vw 0 7.8125vw;
    order: 2;
  }
  
  .anime-onair-abema .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-box-txt {
    width: 43.75vw;
    margin: 0 30vw;
    order: 1;
  }
  
  /*見放題*/
  .anime-onair-mihoudai {
    margin: 0 0 5.3125vw;
  }

  .anime-onair-mihoudai .anime-onair-block-ttl {
    margin: 0 0 5.46875vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list {
    justify-content: flex-start;
    align-items: flex-start;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box {
    margin: 0 !important;
    width: 50% !important;
    transform: translateY(0) !important;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-link {
    width: 19.375vw;
    margin-bottom: 1.71875vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-link {
    width: 41.40625vw;
    transform: translateY(-6.5625vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(3) .anime-onair-st-link {
    width: 40.3125vw;
    margin-bottom: 2.96875vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(4) .anime-onair-st-link {
    width: 27.5vw;
    transform: translateY(-3.28125vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(5) .anime-onair-st-link {
    width: 25vw;
    margin-bottom: 3.75vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(6) .anime-onair-st-link {
    width: 35vw;
    transform: translateY(-5.15625vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(7) .anime-onair-st-link {
    width: 17.65625vw;
    transform: translateY(0);
    margin-bottom: 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(8) .anime-onair-st-link {
    width: 31.71875vw;
    transform: translateY(-5.625vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(9) .anime-onair-st-link {
    width: 16.875vw;
    transform: translateY(0);
    margin: 0 0 4.21875vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(10) .anime-onair-st-link {
    width: 11.40625vw;
    transform: translateY(-3.75vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(11) .anime-onair-st-link {
    width: 11.71875vw;
    transform: translateY(0);
    margin-bottom: 3.59375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(12) .anime-onair-st-link {
    width: 16.40625vw;
    transform: translateY(-4.53125vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-mihoudai .anime-onair-st-list .anime-onair-st-list-box:nth-child(13) .anime-onair-st-link {
    width: 17.65625vw;
    transform: translateY(0);
  }
  
  /*見放題*/
  .anime-onair-tudo {
    margin-bottom: 5.15625vw;
  }

  .anime-onair-tudo .anime-onair-block-ttl {
    margin: 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list {
    justify-content: flex-start;
    align-items: flex-start;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box {
    margin: 0 !important;
    width: 50% !important;
    transform: translateY(0) !important;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-link {
    width: 45vw;
    margin-bottom: 2.96875vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-link {
    width: 27.1875vw;
    transform: translateY(-2.5vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(3) .anime-onair-st-link {
    width: 24.53125vw;
    transform: translateY(0);
    margin-bottom: 3.75vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(4) .anime-onair-st-link {
    width: 35.15625vw;
    transform: translateY(-5vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(5) .anime-onair-st-link {
    width: 17.8125vw;
    transform: translateY(0);
    margin-bottom: 2.03125vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(6) .anime-onair-st-link {
    width: 21.875vw;
    transform: translateY(-4.53125vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(7) .anime-onair-st-link {
    width: 32.1875vw;
    transform: translateY(0);
    margin-bottom: 3.90625vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(8) .anime-onair-st-link {
    width: 32.1875vw;
    transform: translateY(-4.21875vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(9) .anime-onair-st-link {
    width: 17.1875vw;
    transform: translateY(0);
    margin: 0 0 3.59375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(10) .anime-onair-st-link {
    width: 27.8125vw;
    transform: translateY(-5.15625vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(11) .anime-onair-st-link {
    width: 18.4375vw;
    transform: translateY(0);
    margin-bottom: 3.28125vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(12) .anime-onair-st-link {
    width: 16.25vw;
    transform: translateY(-4.21875vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(13) .anime-onair-st-link {
    width: 22.03125vw;
    transform: translateY(0);
    margin-bottom: 3.28125vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(14) .anime-onair-st-link {
    width: 24.0625vw;
    transform: translateY(-4.21875vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) {
    display: block;
    margin: 0;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) .anime-onair-st-link {
    width: 33.75vw;
    margin: 0;
  }
  
  .anime-onair-tudo .anime-onair-st-list .anime-onair-st-list-box:nth-child(15) .anime-onair-st-list-box-txt {
    display: none;
  }
  
  /*見逃し*/
  .anime-onair-minogashi .anime-onair-block-ttl {
    margin: 0;
  }
  
  .anime-onair-minogashi .anime-onair-st-list {
    transform: translateY(0);
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box {
    width: 100%;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) {
    width: 100%;
    margin: 0;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-box-txt {
    width: 66.25vw;
    margin: -3.125vw auto 3.59375vw;
  }
  
  .anime-onair-st-list-inner {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box {
    margin: 0 !important;
    width: 50% !important;
    transform: translateY(0) !important;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(1) .anime-onair-st-link {
    width: 15.78125vw;
    transform: translateY(0);
    margin-bottom: 2.8125vw;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(2) .anime-onair-st-link {
    width: 12.03125vw;
    transform: translateY(-3.75vw);
    margin: 0 0 0 3.4375vw;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(1) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(3) .anime-onair-st-link {
    width: 28.125vw;
    transform: translateY(0);
    margin: 0;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) {
    width: 100%;
    transform: translateY(0);
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-box-txt {
    width: 66.40625vw;
    margin: 0 auto 2.65625vw;
  }
  
  .anime-onair-minogashi .anime-onair-st-list .anime-onair-st-list-box:nth-child(2) .anime-onair-st-list-inner .anime-onair-st-list-box:nth-child(1) {
    width: 26.09375vw;
    transform: translateY(0);
  }
  
  .anime-onair-st-notes {
    width: 71.71875vw;
    margin: 4.84375vw 0 0;
    transform: translateX(0);
  }
  
    
  /*
  anime-story
  -------------------- */
  .anime-story {
    margin: 0 0 18.75vw;
  }
  
  .anime-story-ttl {
    width: 44.21875vw;
    margin: 0 auto 11.5625vw;
  }
  
  .anime-story-ttl .anime-contents-wind {
    top: 7.8125vw;
    left: -3.75vw;
  }
  
  .anime-story-inner {
    width: 90.625vw;
    padding: 0;
  }
  
  .anime-story-nav {
    flex-wrap: wrap;
    margin: 0 auto 4.6875vw;
    height: auto;
  }
  
  .anime-story-nav-icon {
    width: 17.1875vw;
    top: -1.875vw;
  }

  .anime-story-nav-box {
    padding: 0 1.25vw 2.5vw;
    height: 10.312vw;
  }

  .anime-story-nav-btn {
    width: 10.312vw;
    height: 10.312vw;
    border-radius: 50%;
  }

  .anime-story-nav-box.act .anime-story-nav-btn img {
    margin-top: -10.312vw;
  }
  
  .anime-story-container {
    height: auto;
  }
  
  .anime-story-box {
    display: block;
  }
  
  .anime-story-left {
    display: block;
    margin: 0 0 4.6875vw;
  }
  
  .anime-story-thumb {
    width: 100%;
    height: 50.9375vw;
    margin: 0 0 2.03125vw;
    box-shadow: 5px 5px 5px rgba(0,84,82,.4);
  }
  
  .anime-story-thumb-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
  .anime-story-thumb-box {
    width: 28.90625vw;
    height: 16.25vw;
    margin: 0;
    box-shadow: 5px 5px 5px rgba(0,84,82,.4);
  }
  
  .anime-story-thumb-box:nth-last-child(1) {
    margin: 0;
  }
  
  .anime-story-right {
    width: 100%;
    margin: 0 0 4.0625vw;
  }

  .anime-story-header {
    display: flex;
    align-items: center;
    border-bottom: 1px solid;
    padding: 0 0 3.90625vw;;
  }
  
  .anime-story-box-ttl-num {
    height: 4.6875vw;
    margin: 0 8px 0 0;
    line-height: 1em;
  }
  
  .anime-story-box-ttl-num-img {
    height: 100%;
    width: auto;
  }
  
  .anime-story-box-ttl {
    font-size: 5.78125vw;
    font-weight: 900;
    padding: 0;
    border-bottom: none;
    line-height: 1.5em;
  }
  
  .anime-story-box-txt {
    padding: 4.375vw 0;
    font-size: 2.5vw;
  }
  
  .anime-story-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0;
  }
  
  .anime-story-control {
    display: flex;
    margin: 0 auto 3.125vw;
  }
  
  .anime-story-prev {
    width: 26.875vw;
  }
  
  .anime-story-next {
    width: 26.71875vw;
    margin: 0 0 0 -7.03125vw;
  }
  
  .anime-story-en-txt {
    width: 67.1875vw;
    margin: 0 auto;
  }
      
  /*
  anime-staffcast
  -------------------- */
  .anime-staffcast {
    position: relative;
    z-index: 2;
  }
  
  .anime-staffcast-ttl {
    width: 41.71875vw;
    margin: 0 auto 12.03125vw;
  }
  
  .anime-staffcast-ttl .anime-contents-wind {
    top: 18.90625vw;
    left: -5.3125vw;
  }
  
  .anime-staff {
    margin: 0 0 12.5vw;
  }
  
  .anime-staff-ttl {
    width: 11.5625vw;
    margin: 0 auto 6.25vw;
    line-height: 0em;
  }
  
  .anime-staff-list {
    display: flex;
    width: 100%;
    margin: 0 auto;
  }
  
  .anime-staff-box:nth-child(1) {
    width: 29.84375vw;
    margin: 0 6.25vw 0 0;
  }
  
  .anime-staff-box:nth-child(2) {
    width: 27.1875vw;
    margin: 0 0 0 6.25vw;
  }
  
  .anime-staff-box:nth-child(3) {
    display: none;
  }
  
  .anime-staff-box:nth-child(4) {
    display: none;
  }
  
  .anime-staff-box:nth-last-child(1) {
    width: 53.75vw;
    margin: 7.8125vw 15vw 0 0;
  }
  
  .anime-cast {
    margin: 0 0 17.96875vw;
  }
  
  .anime-cast-ttl {
    width: 9.84375vw;
    margin: 0 auto 6.25vw;
    line-height: 0em;
  }
  
  .anime-cast-list {
    width: 75vw;
    margin: 0 auto;
  }
  
  .anime-cast-box {
    margin: 0 0 9.53125vw;
  }

  /*
  anime-bd
  -------------------- */
  .anime-bd {
    position: relative;
    z-index: 2;
    width: 90.625vw;
    margin: 0 auto 40vw;
  }

  .anime-bd-ttl {
    width: 54.0625vw;
    margin: 0 auto 12.1875vw;
  }

  .anime-bd-ttl .anime-contents-wind {
    top: 8.125vw;
    left: .78125vw;
  }

  .anime-bd-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    margin: 0 auto 4.0625vw;
  }

  .anime-bd-box {
    width: 42.8125vw;
    margin: 0 0 8.4375vw;
  }

  .anime-bd-thumb-ttl {
    width: 33.90625vw;
    margin: 2.5vw 0 0 5.3125vw;
  }

  /*
  法人特典
  */
  .anime-bd-houjin {
  }

  .anime-bd-houjin-ttl {
    width: 100%;
    margin: 0;
    padding: 0 0 6.25vw;
  }

  .anime-bd-houjin-ttl img {
    height: 3.125vw;
    width: auto;
  }

  .anime-bd-houjin-block {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
  }

  .anime-bd-houjin-block:nth-last-child(3) {
    padding: 11.8755vw 0 9.6875vw;
  }

  .anime-bd-houjin-block:nth-last-child(1) {
    border-bottom: 1px solid #122453;
    margin: 0 0 73px;
  }

  .anime-bd-houjin-block:nth-last-child(1) .anime-bd-houjin-box {
    border: none;
  }

  .anime-bd-houjin-block:nth-last-child(3) .anime-bd-houjin-box  {
    border: none;
    padding: 4.6875vw 0 0;
  }

  .anime-bd-houjin-block:nth-last-child(2) .anime-bd-houjin-box {
    border-top: none;
  }

  .anime-bd-houjin-block:nth-last-child(1) .anime-bd-houjin-box:nth-last-child(1),
  .anime-bd-houjin-block:nth-last-child(2) .anime-bd-houjin-box:nth-child(1) {
    border-top: 1px solid #122453;
  }

  .anime-bd-houjin-block-ttl {
    font-size: 3.125vw;
    margin: 0 0 4.6875vw;
  }

  .anime-bd-houjin-block-ttl.m0 {
    margin: 0;
  }

  .anime-bd-houjin-block-ttl span {
    font-size: 1.875vw;
    display: block;
  }

  .anime-bd-houjin-box {
    width: 100%;
    padding: 11.8755vw 0 9.6875vw;
  }

  .anime-bd-houjin-box-ttl {
    font-size: 2.8125vw;
    margin: 0 0 2.34375vw;
  }

  .anime-bd-houjin-box-img {
    width: 100%;
    margin: 0 auto 3.125vw;
  }

  .anime-bd-houjin-box-img img {
  }

  .anime-bd-houjin-box-txt {
    font-size: 2.5vw;
  }

  .anime-bd-houjin-block-footer {
    width: 100%;
  }

  .anime-bd-houjin-link {
    width: 93.59375vw;
    margin: 5.46875vw auto 0;
    position: initial;
  }

  /*
  法人共通特典
  */
  .anime-bd-houjin2-block {
    margin: 0 0 9.375vw;
    padding: 11.8755vw 0 9.6875vw;
    display: block;
  }

  .anime-bd-houjin2-left {
    width: 100%;
    margin: 0 0 3.125vw;
  }

  .anime-bd-houjin2-right {
    width: 100%;
    padding: 0;
  }

  .anime-bd-houjin-notes {
    font-size: 1.875vw;
  }

  .anime-bd-houjin-notes .sp-br {
    display: block;
    padding-left: 1em;
  }

  /*
  detail
  */
  .anime-bd-modal {
    color: #0f1941;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    padding: 0;
    overflow-y: scroll;
  }

  .anime-bd-modal-prev {
    width: 7.8125vw;
    height: 11.71875vw;
    top: 78.59375vw;
    left: 2.1875vw;
    z-index: 1;
    position: absolute;
  }

  .anime-bd-modal-next {
    position: fixed;
    width: 7.8125vw;
    height: 11.71875vw;
    top: 78.59375vw;
    left: auto;
    right: .9375vw;
    z-index: 1;
    position: absolute;
  }

  .anime-bd-modal-close {
    width: 12.03125vw;
    height: 12.03125vw;
    top: 4.6875vw;
    right: 4.6875vw;
  }

  .anme-bd-modal-inner {
    width: 100%;
    margin: 0 auto;
    position: relative;
    background: rgba(255,255,255,.9);
  }

  .anime-bd-detail-box {
    background: none;
    box-shadow: none;
    padding: 10.625vw 0;
  }

  .anime-bd-detail-ttl {
    font-size: 5.3125vw;
    margin: 0 0 3.125vw;
  }

  .anime-bd-detail-sub-ttl {
    text-align: center;
    line-height: 0;
    margin: 0 0 7.5vw;
  }

  .anime-bd-detail-sub-ttl-img {
    height: 2.03125vw;
  }

  .anime-bd-detail-inner {
    display: block;
  }

  .anime-bd-detail-thumb-box {
    width: 78.125vw;
    margin: 0 auto 9.0625vw;
  }

  .anime-bd-detail-thumb {
    margin: 0 0 2.5vw;
  }

  .anime-bd-detail-cover-num {

  }

  .anime-bd-detail-cover-num img {
    height: 4.6875vw;
    width: auto;
  }

  .anime-bd-detail-spec {
    width: 90.625vw;
    margin: 0 auto;
  }

  .anime-bd-detail-release {
    font-size: 3.4375vw;
    margin: 0 0 .9375vw;
  }

  .anime-bd-detail-ep {
    border-top: 1px solid;
    border-bottom: 1px solid;
    display: flex;
    align-items: center;
    padding: 8px 0;
  }

  .anime-bd-detail-ep-ttl {
    font-size: 3.4375vw;
    margin: 0 4.6875vw 0 0;
  }

  .anime-bd-detail-ep-txt {
    font-size: 3.75vw;
    padding: 0 0 0 4.6875vw;
  }

  .anime-bd-detail-tokuten {
    padding: 7.5vw 0;
    font-size: 2.5vw;
  }

  .anime-bd-detail-tokuten-ttl {
    font-size: 3.4375vw;
    margin: 0 0 3.90625vw;
  }

  .anime-bd-detail-tokuten-ttl span {
    font-size: 2.34375vw;
  }

  .anime-bd-detail-tokuten-txt {
    font-size: 2.5vw;
  }


  
  
}

/* --------------------
- GAME
-------------------- */
.page-game {
  z-index: 0;
  position: relative;
}

.page-game::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  letter-spacing: 0;
  z-index: -2;
  background: #0a0832 url(../img/game/bg_02.jpg) no-repeat;
  background-size: 2000px auto;
  background-position: center 0;
}

.game-nav {
  display: none;
}

.game {
  /* background: #070730; */
  overflow: hidden;
}

.game .wind-b {
  width: 624px;
}

.game-section-inner {
  width: 1280px;
  margin: 0 auto;
  position: relative;
  /* z-index: 1; */
}

#game-contents {
  width: 100%;
  width: 1280px;
  margin: 0 auto;
}

.footer-game {
  height: auto;
}

.footer-game::after {
  background: url(../img/common/footer/goal_white.png) no-repeat left top;
  background-size: 100% auto;
}

.game-popup-bnr {
  position: absolute;
  top: 154px;
  z-index: 10;
  margin: 0 auto;
  width: 400px;
  text-align: center;
  left: calc(50% - 200px);
  background: #fff;
  color: #ff0000;
  border: 2px solid;
  padding: 8px 0;
  font-weight: bold;
}

@media screen and (min-width: 768px) {

  .game-popup-bnr {
    cursor: pointer;
  }

  .game-popup-bnr:hover {
    background: #000;
  }
}


.game-popup {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 999;
  display: none;
}

.game-popup-bg {
  background: rgba(0,0,0,.8);
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
}

.game-popup-inner {
  width: 800px;
  height: 80%;
  max-height: 810px;
  background: #fff;
  border-radius: 10px;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding: 30px;
  overflow-y: scroll;
  color: #000;
  font-size: 13px;
  line-height: 1.8em;
}

.game-popup-inner h3 {
  font-size: 150%;
  padding: 0 0 1em;
  margin: 0 0 1em;
  border-bottom: 3px solid;
}

.game-popup-inner p {
  padding: 0 0 2em;
}

.game-popup-inner p a {
  text-decoration: underline;
  
}

.game-popup-inner p:nth-child(1) {
  padding: 0 0 1em;
}

.game-popup-inner p:nth-last-child(1) {
  padding: 0;
}

.gamepopup-close {
  position: absolute;
  z-index: 10;
  width: 50px;
  height: 50px;
  left: calc(50% + 350px);
  top: 3%;
}

.gamepopup-close::after {
  content: "";
  display: block;
  width: 50px;
  height: 2px;
  background: #fff;
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% - 25px);
  transform: rotate(45deg);
}

.gamepopup-close::before {
  content: "";
  display: block;
  width: 50px;
  height: 2px;
  background: #fff;
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% - 25px);
  transform: rotate(-45deg);
}


/*
game-main
-------------------- */
#game-top {
  padding: 78px 0 0 0;
  position: relative;
  z-index: 0;
}

.game-visual-box {
  
}

.game-wind-a {
  width: 943.5px;
}

.game .wind-back {
  z-index: 1;
}

.game-wind-c {
  width: 879px;
}

.game-visual {
  width: 1407px;
  position: relative;
  top: 0;
  left: calc(((100vw - 1407px)/2) - 6.5px);
  /*transform: scale(1.2);
  opacity: 0;
  transition: all 1s cubic-bezier(.17,.67,.22,.99);*/
}
/*
.game-visual.show {
  transform: scale(1);
  opacity: 1;
}
*/
.game-visual-smoke {
  width: 903px;
  position: absolute;
  z-index: 1;
  top: 457px;
  left: calc(50% - 1036px);
  opacity: 0;
  transition: all 3s cubic-bezier(.17,.67,.22,.99);
}

.game-visual-dust {
  width: 1204px;
  position: absolute;
  z-index: 1;
  top: 127px;
  left: calc(50% - 606px);
  opacity: 0;
  transition: all 3s 1s cubic-bezier(.17,.67,.22,.99);
}

.game-visual-smoke.show,
.game-visual-dust.show {
  opacity: 1;
}

.game-top-logo {
  position: absolute;
  z-index: 1;
  width: 481px;
  top: 480px;
  left: 401px;
  opacity: 0;
  transform: scale(.8);
  transition: 1s cubic-bezier(1, 0, 0, 1)
}

.game-top-logo.show {
  opacity: 1;
  transform: scale(1)
}

.game-top-copy {
  position: absolute;
  z-index: 1;
  width: 522.5px;
  top: 136px;
  left: 388px;
  opacity: 0;
  transform: scale(.8);
  transition: 1s cubic-bezier(1, 0, 0, 1)
}

.game-top-copy.show {
  opacity: 1;
  transform: scale(1)
}

.game-top-otameshi {
  position: fixed;
  z-index: 102;
  width: 141px;
  top: 120px;
  left: calc(50% + 418px);
  transition: all .4s cubic-bezier(1, 0, 0, 1);
  opacity: 0;
  transform: translateX(100px);
}

.game-top-otameshi.show {
  opacity: 1;
  transform: translateX(0);
}

.game-top-otameshi.fade {
  opacity: 0;
  pointer-events: none;
}

.game-top-haishin {
  position: absolute;
  z-index: 2;
  width: 279px;
  top: 413px;
  left: 18px;
  opacity: 0;
  transform: translateX(-100px);
  transition: all .4s cubic-bezier(1, 0, 0, 1);
  }

.game-top-haishin.show {
  opacity: 1;
  transform: translateX(0);
}

.game-top-haishin-link-container {
  position: absolute;
  z-index: 3;
  width: 156px;
  top: 599px;
  left: 83px;
  opacity: 0;
  transform: translateX(-100px);
  transition: all .4s cubic-bezier(1, 0, 0, 1);
}

.game-top-haishin-link-container.show {
  opacity: 1;
  transform: translateX(0);
}

.game-top-haishin-link-box {
  margin: 0 0 5px;
}

.game-top-haishin-link {

}

.game-top-haishin-link-img {
  width: 100%;
}

/*
game-pre
-------------------- */
#game-pre {
  position: relative;
  /* z-index: 01; */
  height: 748px;
}

.game-pre-ttl {
  width: 454px;
  margin: -71px auto 83px;
  position: relative;
  z-index: 1;
}

.game-pre-monitor {
  position: relative;
}

.game-pre-monitor-box {
  width: 858px;
  height: 502px;
  margin: 0 auto 189px;
  position: relative;
  z-index: 2;
  padding: 16px 14px 19px 14px;
}

.game-pre-monitor-box::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  background: url("../img/game/movie/monitor_frame.png") no-repeat;
  background-size: cover;
}

.game-pre-monitor-box::before {
  content: "";
  display: block;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 1;
  background: rgba(0,0,0,.4) url("../img/game/movie/monitor_overlay.png") repeat;
  background-size: 4px 4px;
}

.game-pre-monitor-inner {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000;
}

#game-pre-player {
  width: 100%;
  height: calc(100% + 200px);
  margin-top: -100px;
  opacity: 0;
  transition: opacity 1.5s 1s linear
}
#game-pre-player.show {
  opacity: 1;
}

.game-pre-steel {
  position: absolute;
  z-index: -1;
  top: 71px;
  left: calc((100% - 1841px)/2);
  width: 1841px;
}

.game-pre-steel-light {
  width: 1525px;
  position: absolute;
  z-index: 0;
  top: -12px;
  left: calc((100% - 1525px)/2 - 10px);
  opacity: 0;
  transition: opacity .7s cubic-bezier(.18,.7,.04,-0.98);
}

.game-pre-steel-light.show {
  opacity: 1;
}

.game-pre-inner {
  position: relative;
  z-index: 1;
}

.game-pre-txt {
  width: 473px;
  margin: 0 auto 52px;;
}

.game-pre-entry {
  display: flex;
  justify-content: center;
  margin: 0 auto 203px;
}

.game-pre-entry-box {
  width: 185px;
  margin: 0 26px;
}

.game-pre-entry-link {
  display: block;
}

.game-pre-dust {
  position: absolute;
  z-index: -1;
  top: 375px;
  left: 76px;
  width: 1155px;
}

/*
game-intro
-------------------- */
#game-intro {
  height: 2047px;
  position: relative;
  z-index: 1;
}

.game-intro-lead {
  width: 839px;
  position: absolute;
  z-index: 0;
  top: 0;
  left: calc((100% - 839px)/2);
}

.game-intro-box {
  position: absolute;
  overflow: hidden;
  transition: all 1s cubic-bezier(.17,.67,.22,.99);  
}

#game-intro-box-0 {
  width: 0;
}

.game-intro-lead.show #game-intro-box-0 {
  width: 839px;
}

.game-intro-img-0 {
  width: 839px;
}

#game-intro-box-0-1 {
  display: none;
}

.game-intro-lead.show #game-intro-box-0-1 {
  width: 0;
  transition-delay: .3s;
}

#game-intro-box-1 {
  width: 0;
  top: 97px;
  left: 183px;
}

.game-intro-lead.show #game-intro-box-1 {
  width: 473px;
  transition-delay: .2s;
}

.game-intro-img-1 {
  width: 473px;
}

#game-intro-box-2 {
  width: 0;
  top: 161px;
  left: 93px;
}

.game-intro-lead.show #game-intro-box-2 {
  width: 653px;
  transition-delay: .4s;
}

.game-intro-img-2 {
  width: 653px;
}

#game-intro-box-3 {
  width: 0;
  top: 307px;
  left: 297px;
}

#game-intro-box-3.show {
  width: 343.5px;
}

.game-intro-img-3 {
  width: 343.5px;
}

#game-intro-box-4 {
  width: 0;
  top: 511px;
  left: 700px;
}

#game-intro-box-4.show {
  width: 554px;
}

.game-intro-img-4 {
  width: 579px;
}

#game-intro-box-5 {
  width: 0;
  top: 809px;
  left: 81px;
}

#game-intro-box-5.show {
  width: 308.5px;
}

.game-intro-img-5 {
  width: 308.5px;
}

#game-intro-box-6 {
  width: 0;
  top: 871px;
  left: 449px;
}

#game-intro-box-6.show {
  width: 465px;
  transition-delay: .2s;
}

.game-intro-img-6 {
  width: 465px;
}

#game-intro-box-7 {
  width: 0;
  top: 818px;
  left: 969px;
}

#game-intro-box-7.show {
  width: 286px;
  transition-delay: .4s;
}

.game-intro-img-7 {
  width: 311px;
}

#game-intro-box-8 {
  width: 0;
  top: 1267px;
  left: 763px;
}

#game-intro-box-8.show {
  width: 367px;
}

.game-intro-img-8 {
  width: 367px;
}

#game-intro-box-9 {
  width: 0;
  height: 261px;
  top: 1273px;
  left: 694px;
}

#game-intro-box-9.show {
  width: 694px;
  left: 0;
}

.game-intro-img-9 {
  width: 694px;
  position: absolute;
  right: 0;
}

#game-intro-box-10 {
  width: 0;
  top: 1598px;
  left: 0;
}

#game-intro-box-10.show {
  width: 640px;
}

.game-intro-img-10 {
  width: 640px;
}

#game-intro-box-line {
  display: none;
}

.game-intro-dust {
  position: absolute;
  z-index: -1;
  top: 157px;
  left: -37px;
  width: 1214px;
}

/*
game-teamstory
-------------------- */
#game-teamstory {
  height: 1401px;
  position: relative;
}

.game-teamstory-ttl {
  width: 736px;
  margin: 0 0 0 calc(50% - 379px);
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-teamstory .game-section-ttl-wind {
  width: 369px;
  position: absolute;
  z-index: 1;
  top: 86px;
  left: 449px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-teamstory-contents {
  width: 732px;
  margin: 87px 0 0 551px;
  position: relative;
  z-index: 3;
}

.game-teamstory-item:not(:nth-child(1)) {
  margin: -5px 0 0 0;
}

.game-teamstory-item {
  transition: all .5s cubic-bezier(.17,.67,.22,.99);
  transform: translateX(100px);
  opacity: 0;
  cursor: pointer;
}

#game-teamstory-list.show .game-teamstory-item {
  opacity: 1;
  transform: translateX(0);
}
#game-teamstory-list.show .game-teamstory-item:nth-child(1) { transition-delay: .5s;}
#game-teamstory-list.show .game-teamstory-item:nth-child(2) { transition-delay: .6s;}
#game-teamstory-list.show .game-teamstory-item:nth-child(3) { transition-delay: .7s;}
#game-teamstory-list.show .game-teamstory-item:nth-child(4) { transition-delay: .8s;}
#game-teamstory-list.show .game-teamstory-item:nth-child(5) { transition-delay: .9s;}
#game-teamstory-list.show .game-teamstory-item:nth-child(6) { transition-delay: 1s;}
.game-teamstory-bg-container {
  width: 1280px;
  position: absolute;
  z-index: 0;
  top: 121px;
  left: calc((100% - 1280px)/2);
}

.game-teamstory-chara {
  position: absolute;
  z-index: 1;
  top: 59px;
  left: 110px;
  width: 392px;
  opacity: 0;
  transform: translateX(-100px);
  transition: all 1s cubic-bezier(.17,.67,.22,.99);
}

.game-teamstory-bg {
  width: 0;
  position: absolute;
  z-index: 0;
  top: 0;
  left: calc((1280px - 2560px)/2);
  overflow: hidden;
  transition: all 2s cubic-bezier(.17,.67,.22,.99);
}

.game-bg-img {
  width: 2560px;
}

#game-teamstory-modal-container {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(2,4,46,.85);
  display: none;
  opacity: 0;
}

#game-teamstory-modal-inner {
  width: 1118px;
  height: 800px;
  position: absolute;
  z-index: 1;
  top: calc((100% - 800px)/2);
  left: calc((100% - 1118px)/2);
}

.game-teamstory-close {
  position: absolute;
  z-index: 5;
  top: 54px;
  right: 0;
  width: 57px;
}

.game-teamstory-prev {
  position: absolute;
  z-index: 2;
  top: 348px;
  left: -66px;
  width: 44px;
}

.game-teamstory-next {
  position: absolute;
  z-index: 2;
  top: 348px;
  right: -66px;
  width: 44px;
}

.game-teamstory-modal-box-container {
  position: relative;
}

.game-teamstory-modal-box {
  position: absolute;
  width: 100%;
  top: 0;
  opacity: 0;
}

.game-teamstory-box-txt {
  position: absolute;
  z-index: 1;
  opacity: 0;
  width: 100%;
}

.game-teamstory-box-catch {
  position: absolute;
  z-index: 2;
  opacity: 0;
}

#game-teamstory-modal-0 .game-teamstory-box-catch {
  width: 74px;
  top: 169px;
  right: 34px;
}

#game-teamstory-modal-1 .game-teamstory-box-catch {
  width: 75px;
  top: 168px;
  right: 33px;
}
#game-teamstory-modal-2 .game-teamstory-box-catch {
  width: 74px;
  top: 168px;
  right: 35px;
}
#game-teamstory-modal-3 .game-teamstory-box-catch {
  width: 73px;
  top: 168px;
  right: 35px;
}
#game-teamstory-modal-4 .game-teamstory-box-catch {
  width: 74px;
  top: 168px;
  right: 35px;
}

.game-teamstory-box-bg {
  position: relative;
  z-index: 0;
}

/*アニメーション*/
.game-teamstory-ttl.show,
#game-teamstory .game-teamstory-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-teamstory-txt.show {
  opacity: 1;
  transform: translate(0);
}

.game-teamstory-bg.show {
  width: 2560px;
}

.game-teamstory-chara.show {
  opacity: 1;
  transform: translate(0);
}

#game-teamstory-list.show .game-teamstory-item img {
  transition: all .3s ease;
}

#game-teamstory-list.show .game-teamstory-item img:hover {
  opacity: .6;
}

/*
game-campaign
-------------------- */
#game-campaign {
  height: 1314px;
  position: relative;
  z-index: 1;
}

.game-campaign-ttl {
  width: 684px;
  margin: 0 0 80px calc(50% - 359px);
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-campaign .game-section-ttl-wind {
  width: 268px;
  position: absolute;
  z-index: 1;
  top: 75px;
  left: 455px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-campaign-txt {
  width: 771px;
  margin: 0 0 38px 252px;
  opacity: 0;
  transform: translateX(50px);
  transition: all .5s cubic-bezier(.17,.67,.22,.99);
}

.game-campaign-task {
  margin: 0 0 22px 252px;
}

.game-campaign-task-item {
  height: 120px;
  transition: all .5s cubic-bezier(.17,.67,.22,.99);
  transform: translateX(100px);
  opacity: 0;
  width: 782px;
}

.game-campaign-task-item:nth-child(2) {
  margin: -5px 0 5px;
}

.game-campaign-task-item:nth-child(3) {
  margin: -2px 0 2px;
}

.game-campaign-notes {
  width: 467px;
  line-height: 0em;
  margin: 24px auto 0;
}


.game-campaign-task.show .game-campaign-task-item {
  opacity: 1;
  transform: translateX(0);
}
.game-campaign-task.show .game-campaign-task-item:nth-child(1) { transition-delay: .5s;}
.game-campaign-task.show .game-campaign-task-item:nth-child(2) { transition-delay: .6s;}
.game-campaign-task.show .game-campaign-task-item:nth-child(3) { transition-delay: .7s;}
.game-campaign-task.show .game-campaign-task-item:nth-child(4) { transition-delay: .8s;}
.game-campaign-task.show .game-campaign-task-item:nth-child(5) { transition-delay: .9s;}
.game-campaign-task.show .game-campaign-task-item:nth-child(6) { transition-delay: 1s;}

/*アニメーション*/
.game-campaign-ttl.show,
#game-campaign .game-campaign-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-campaign-txt.show {
  opacity: 1;
  transform: translate(0);
}

.game-campaign-bg.show {
  width: 2560px;
}

.game-campaign-chara.show {
  opacity: 1;
  transform: translate(0);
}

.game-campaign-dust {
  position: absolute;
  z-index: -1;
  top: -122px;
  left: -19px;
  width: 1218px;
}



/*
game-about
-------------------- */
#game-about {
  height: 1011px;
  position: relative;
}

.game-about-ttl {
  width: 413px;
  margin: 0 0 0 calc(50% - 180px);
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-about .game-section-ttl-wind {
  width: 291px;
  position: absolute;
  z-index: 1;
  top: 77px;
  left: 156px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-about-contents {
  width: 475px;
  margin: 87px 0 247px 605px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateY(50px);
  transition: all .5s cubic-bezier(.17,.67,.22,.99);
}

.game-about-txt {
  width: 425px;
  margin: 0 0 43px;
}

.game-about-lead {
  width: 363px;
  margin: 0 0 19px;
}

.game-about-txt-box {
  width: 463px;
  height: 244px;
}

.game-about-img0 {
  position: absolute;
  z-index: 0;
  top: -169px;
  left: 1032px;
  width: 334px;
  opacity: 0;
  transform: translateX(50px);
  transition: all .3s .2s cubic-bezier(.17,.67,.22,.99);
}

.game-about-img1 {
  position: absolute;
  z-index: 1;
  top: 244px ;
  left: -37px;
  width: 586px;
  opacity: 0;
  transform: translateX(-70px);
  transition: all .3s .4s cubic-bezier(.17,.67,.22,.99);
}

.game-about-img2 {
  position: absolute;
  z-index: 0;
  top: 628px;
  left: 1136px;
  width: 334px;
  opacity: 0;
  transform: translateX(80px);
  transition: all .3s .6s cubic-bezier(.17,.67,.22,.99);
}

.game-about-dust {
  position: absolute;
  z-index: -1;
  top: -291px;
  left: 98px;
  width: 919px;
}

/*アニメーション*/
.game-about-ttl.show,
#game-about .game-about-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-about-contents.show {
  opacity: 1;
  transform: translateY(0);
}

.game-about-img0.show,
.game-about-img1.show,
.game-about-img2.show {
  opacity: 1;
  transform: translateX(0);
}

/*
game-system
-------------------- */
#game-system {
  height: 1191px;
  position: relative;
  /* z-index: 71; */
}

.game-system-ttl {
  width: 568px;
  margin: 0 0 41px 153px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

.game-system-ttl .game-section-ttl-wind {
  width: 331px;
  position: absolute;
  z-index: 1;
  top: 82px;
  left: 311px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s cubic-bezier(1, 0, 0, 1);
}

.game-system-container {
  position: relative;
  height: 110vw;
}

.game-system-box {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
}

.game-system-contents {
  margin: 0 0 0 162px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateY(80px);
  transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
}

.game-system-contents0 {
  width: 591px;
}

.game-system-contents1 {
  width: 776px;
}

.game-system-contents2 {
  width: 768px;
  margin: 0 0 0 -26px;
}

.game-system-contents3 {
  width: 721px;
}

.game-system-bg-container {
  width: 1280px;
  position: absolute;
  z-index: 0;
  top: -233px;
  left: calc((100% - 1280px)/2);
}

.game-system-chara {
  opacity: 0;
  transform: translateX(-100px);
  transition: all 1s cubic-bezier(.17,.67,.22,.99);
}

.game-system-chara0 {
  position: absolute;
  z-index: 1;
  top: 84px;
  left: 736px;
  width: 427px;
}

.game-system-chara1 {
  position: absolute;
  z-index: 1;
  top: 78px;
  left: 791px;
  width: 402px;
}

.game-system-chara2 {
  position: absolute;
  z-index: 1;
  top: 112px;
  left: 811px;
  width: 358px;
}

.game-system-chara3 {
  position: absolute;
  z-index: 1;
  top: 107px;
  left: 829px;
  width: 339px;
}

.game-system-bg {
  width: 0;
  position: relative;
  z-index: 0;
  top: 0;
  left: calc((100% - 2560px)/2);
  overflow: hidden;
  transition: all 1.5s cubic-bezier(.17,.67,.22,.99);
}

.game-system-control {
  position: absolute;
  z-index: 10;
  width: 100%;
  top: 0;
  opacity: 0;
}

.game-system-control.show {
  opacity: 1;
  transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
}

.game-system-prev,
.game-system-next {
  width: 61px;
  position: absolute;
  z-index: 2;
  top: 437px;
  transition: all .2s cubic-bezier(.17,.67,.22,.99);
}

.game-system-prev {
  left: 55px;
}

.game-system-prev:hover {
  left: 45px;
}

.game-system-next {
  right: 48px;
}

.game-system-next:hover {
  right: 38px;
}

.game-system-dots {
  display: flex;
  position: absolute;
  z-index: 1;
  top: 914px;
  left: 621px;
}

.game-system-dot {
  width: 13px;
  height: 13px;
  border: 2px solid #fff;
  border-radius: 7px;
  margin: 0 25px 0 0;
  cursor: pointer;
}

.game-system-dot.act,
.game-system-dot:hover {
  background: #fff;
}

.game-system-dust {
  position: absolute;
  z-index: -1;
  top: -187px;
  left: 126px;
  width: 1112px;
}

/*アニメーション*/
.game-system-ttl.show,
.game-system-ttl .game-section-ttl-wind.show {
  opacity: 1;
  transform: translateX(0);
}


.game-system-ttl .game-section-ttl-wind.show {
  /*transition: all .4s .5s cubic-bezier(1, 0, 0, 1);*/
}

.game-system-box.show {
  opacity: 1;
}

/*
.game-system-box.show .game-system-contents {
  opacity: 1;
  transform: translateY(0px);
  transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
}
*/

/*
game-movie
-------------------- */
#game-movie {
  height: 930px;
}

.game-movie-ttl {
  width: 446px;
  margin: 0 0 111px 431px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-movie .game-section-ttl-wind {
  width: 293px;
  position: absolute;
  z-index: 1;
  top: 41px;
  left: 220px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-movie-container {
  display: flex;
  justify-content: center;
  margin: 0 auto 340px;
}

.game-movie-box {
  width: 541px;
  height: 313px;
  position: relative;
  z-index: 1;
  margin: 0 32px;
  cursor: pointer;
}

.game-movie-box::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  background: url("../img/game/movie/monitor_frame_mini.png") no-repeat;
  background-size: cover;
}

.game-movie-box::before {
  content: "";
  display: block;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 1;
  background: rgba(0,0,0,.4) url("../img/game/movie/monitor_overlay.png") repeat;
  background-size: 3px 3px;
}

#game-movie-player0,
#game-movie-player1 {
  width: 100%;
  height: calc(100% + 200px);
  margin-top: -100px;
}

.game-movie-player {
  opacity: 0;
  transition: opacity 1.5s 1s linear
}

.game-movie-steel {
  position: absolute;
  z-index: 0;
  top: 236px;
  left: calc((100% - 1641px)/2);
  width: 1641px;
}

.game-movie-steel-light {
  width: 1376px;
  position: absolute;
  z-index: 1;
  top: -44px;
  left: 129px;
  opacity: 0;
  transition: opacity .7s cubic-bezier(.18,.7,.04,-0.98);
}


/*アニメーション*/
.game-movie-ttl.show,
#game-movie .game-movie-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-movie-steel-light.show {
  opacity: 1;
}

.game-movie-player.show {
  opacity: 1;
}


/*
game-special
-------------------- */
#game-special {
  height: 948px;
  position: relative;
}

.game-special-ttl {
  width: 514px;
  margin: 0 0 30px 507px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-special .game-section-ttl-wind {
  width: 302px;;
  position: absolute;
  z-index: 1;
  top: 85px;;
  left: 344px;;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-special-container {
  position: relative;
  z-index: 1;
  margin: 0 0 322px 512px;
  opacity: 0;
  transform: translateY(50px);
  transition: all .3s .5s cubic-bezier(.17,.67,.22,.99);
}

.game-special-list {
  width: 610px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.game-special-item {
  width: 300px;
  height: 100px;
  margin: 0 0 10px;
  overflow: hidden;
}

.game-special-bg-container {
  width: 1280px;
  position: absolute;
  z-index: 0;
  top: -203px;
  left: calc((100% - 1280px)/2);
}

.game-special-chara {
  position: absolute;
  z-index: 1;
  top: 101px;
  left: 56px;
  width: 432px;
  opacity: 0;
  transform: translateX(-100px);
  transition: all 1s cubic-bezier(.17,.67,.22,.99);
}

.game-special-bg {
  width: 0;
  position: absolute;
  z-index: 0;
  top: 0;
  left: calc((1280px - 2560px)/2);
  overflow: hidden;
  transition: all 2s cubic-bezier(.17,.67,.22,.99);
}

.game-special-dust {
  position: absolute;
  z-index: -1;
  top: -89px;
  left: 67px;
  width: 1108px;
}

/*アニメーション*/
.game-special-ttl.show,
#game-special .game-special-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-special-container.show {
  opacity: 1;
  transform: translateY(0);
}

.game-special-bg.show {
  width: 2560px;
}

.game-special-chara.show {
  opacity: 1;
  transform: translate(0);
}


/*
game-spec
-------------------- */
#game-spec {
  height: 631px;
  position: relative;
}

.game-spec-ttl {
  width: 377px;
  margin: 0 0 53px 465px;
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateX(150px);
  transition: all .6s cubic-bezier(1, 0, 0, 1);
}

#game-spec .game-section-ttl-wind {
  width: 253px;
  position: absolute;
  z-index: 1;
  top: 77px;
  left: 229px;
  opacity: 0;
  transform: translateX(-50px);
  transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
}

.game-spec-container {
  position: relative;
  z-index: 2;
}

.game-spec-txt-box {
  width: 580px;
  margin: 0 0 217px 366px;
  opacity: 0;
  transform: translateY(50px);
  transition: all .3s .5s cubic-bezier(.17,.67,.22,.99);
}
.game-spec-txt-block {
  font-weight: bold;
  line-height: 1em;
  letter-spacing: .8px;
  margin: 0 0 17px;
}

.game-spec-txt0 {
  width: 210px;
  text-align: right;
  display: inline-block;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}

.game-spec-txt-mini {
  font-weight: bold;
  font-size: 12px;
}

.game-spec-txt1 {

}

.game-spec-cc {
  width: 535px;
  margin: 0 auto;
  padding: 0 0 30px;
}

.game-spec-dust {
  position: absolute;
  z-index: -1;
  top: -199px;
  left: 787px;
  width: 448px;
}

/*アニメーション*/
.game-spec-ttl.show,
#game-spec .game-spec-ttl.show .game-section-ttl-wind {
  opacity: 1;
  transform: translateX(0);
}

.game-spec-txt-box.show {
  opacity: 1;
  transform: translateY(0);
}



@media screen and (max-width: 767px) {

  .game-popup-bnr {
    top: 52%;
    width: 70%;
    left: 15%;
    padding: 8px 0;
  font-size: 11px;}
  

  .game-popup {
  }
  
  .game-popup-bg {
  }
  
  .game-popup-inner {
    width: 90%;
    height: 80%;
    max-height: auto;
    padding: 5%;
    font-size: 12px;
  }
  
  .game-popup-inner h3 {
    font-size: 130%;
  }
  
  .game-popup-inner p {
    padding: 0 0 2em;
  }
  
  .game-popup-inner p:nth-last-child(1) {
    padding: 0;
    text-align: right;
  }
  
  .gamepopup-close {
    left: calc(90% - 25px);
    top: calc(10% - 50px);
  }
  
  
  .page-game {
    z-index: auto;
  }

  .page-game::after {
    background-color: #0a0832;
    background-image: url(../img/game/bg_sp_01_2.png), url(../img/game/bg_sp_00_2.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center bottom,center top;
  
  }

  .game {
    overflow: hidden;
  }

  .game-wind-a {
    width: 100%;
    margin: 0 0 0 121px;
  }

  .game .wind-b {
    width: 100%;
    top: 0;
    margin: 0 0 0 -163px;
  }
  
    .game-bg-img {
    width: 100vw;
  }
  
  .game-nav {
    display: flex;
    position: fixed;
    align-items: flex-start;
    overflow: hidden;
    z-index: 100;
    bottom: 0;
    left: 0;
    width: 100vw;
    background: #0d1327 url(../img/game/nav_bg.png) center bottom no-repeat;
    background-size: 100% auto;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .game-to-top {
    bottom: 0;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .game-nav-inner {
    width: 81.40625vw;
    display: flex;
    flex-wrap: wrap;
  }

  .game-nav-box {
    line-height: 1em;
  }

  .game-nav-box:nth-child(1) {
    width: 26.71875vw;
  }

  .game-nav-box:nth-child(2) {
    width: 27.1875vw;
  }

  .game-nav-box:nth-child(3) {
    width: 27.5vw;
  }

  .game-nav-box:nth-child(4) {
    width: 40.3125vw;
  }

  .game-nav-box:nth-child(5) {
    width: 41.09375vw;
  }

  /*.game-nav-box:nth-child(6) {
    width: 27.1875vw;
  }*/

  .game-nav-box:nth-child(1),
  .game-nav-box:nth-child(2),
  .game-nav-box:nth-child(3) {
    height: 8.75vw;
  }

  .game-nav-box:nth-child(4),
  .game-nav-box:nth-child(5),
  .game-nav-box:nth-child(6) {
    height: 8.4375vw;
  }

  .game-nav-img {
    width: 100%;
    height: 100%;
  }

  .game-nav-top {
    width: 18.59375vw;
  }

  .game-section-inner {
    width: 100%;
  }

  #game-contents {
    width: 100%;
    background: none;
    position: relative;
    /* z-index: 0; */
  }

  .footer-game {
    height: auto;
    padding: 0;
  }

  .footer-game::after {
    background: url(../img/common/footer/goal_white.png) no-repeat left top;
    background-size: 100% auto;
  }

  /*
  game-main
  -------------------- */
  #game-top {
    padding: 0;
    height: 171.09375vw;
    margin: 0 0 27.8125vw;
    z-index: 1;
  }

  .game-visual-box {

  }

  .game-wind-c {
    width: 33.75vw;
    top: 120.625vw;
    margin: 0 0 0 970px;
  }

  .game-visual {
    width: 100%;
    left: 0;
  }

  .game-visual-smoke {
    display: none;
  }

  .game-visual-dust {
    display: none;
  }

  .game-top-logo {
    width: 84.0625vw;
    top: 102.34375vw;
    left: 8.28125vw;
  }

  .game-top-copy {
    position: absolute;
    z-index: 1;
    width: 42.65625vw;
    top: 17.34375vw;
    left: 30.46875vw;
  }

  .game-top-otameshi {
    width: 20.78125vw;
    top: 13.125vw;
    left: 3.75vw;
  }

  .game-top-haishin {
    position: absolute;
    z-index: 1;
    width: 57.65625vw;
    top: 153.4375vw;
    left: 28.59375vw;
  }

  .game-top-haishin-link-container {
    display: flex;
    width: auto;
    top: 172.34375vw;
    left: 23.125vw;
  }
  
  .game-top-haishin-link-box {
    margin: 0 2.03125vw 0 0;
    height: 8.59375vw;
  }
  
  .game-top-haishin-link {
  
  }
  
  .game-top-haishin-link-img {
    height: 100%;
    width: auto;
  }
  

  /*
  game-pre
  -------------------- */
  #game-pre {
    /* position: relative; */
    /* z-index: 2; */
    height: auto;
  }

  .game-pre-ttl {
    width: 73.59375vw;
    margin: 0 auto 4.84375vw;
  }

  .game-pre-monitor {
    position: relative;
    margin: 0 auto 26.09375vw;
  }

  .game-pre-monitor-box {
    width: 91.40625vw;
    height: 53.59375vw;
    margin: 0 0 0 4.84375vw;
    /* position: relative; */
    /* z-index: 1; */
    padding: 1vw;
  }

  .game-pre-monitor-box::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    background: url("../img/game/movie/monitor_frame.png") no-repeat;
    background-size: cover;
  }

  .game-pre-monitor-box::before {
    content: "";
    display: block;
    width: calc(100% - 2vw);
    height: calc(100% - 2vw);
    position: absolute;
    top: 1vw;
    left: 1vw;
    z-index: 1;
    background: rgba(0,0,0,.4) url("../img/game/movie/monitor_overlay.png") repeat;
    background-size: 3px 3px;
  }

  #game-pre-player {
  }

  .game-pre-steel {
    position: absolute;
    /* z-index: 0; */
    top: 7.34375vw;
    left: -46.5625vw;
    width: 194.53125vw;
  }

  .game-pre-steel-light {
    width: 153.28125vw;
    /* position: absolute; */
    /* z-index: 0; */
    top: -1.5625vw;
    left: -27.34375vw;
  }

  .game-pre-txt {
    width: 77.34375vw;
    margin: 0 auto 5.9375vw;
  }

  .game-pre-entry {
    display: flex;
    justify-content: center;
    margin: 0 auto 27.65625vw;
  }

  .game-pre-entry-box {
    width: 23.125vw;
    margin: 0 3.28125vw;
  }

  .game-pre-entry-link {
    display: block;
  }

  .game-pre-dust {
    top: -16.875vw;
    left: 2.1875vw;
    width: 94.6875vw;
  }

  /*
  game-intro
  -------------------- */
  #game-intro {
    height: 411.71875vw;
  }

  .game-intro-lead {
    width: 90.625vw;
    position: relative;
    z-index: 0;
    top: 0;
    left: 4.6875vw;
  }

  .game-intro-box {
    position: absolute;
    overflow: hidden;
    transition: all 1s cubic-bezier(.17,.67,.22,.99);  
  }

  #game-intro-box-0 {
    width: 0;
    left: 15.625vw;
  }

  .game-intro-lead.show #game-intro-box-0 {
    width: 59.375vw;
  }

  .game-intro-img-0 {
    width: 59.375vw;
  }

  #game-intro-box-0-1 {
    display: block;
    width: 0;
    top: 15.15625vw;
    left: 0;
  }

  .game-intro-img-0-1 {
    width: 90.625vw;
  }

  .game-intro-lead.show #game-intro-box-0-1 {
    width: 90.625vw;
    transition-delay: .2s;
  }

  #game-intro-box-1 {
    width: 0;
    top: 32.96875vw;
    left: 17.34375vw;
  }

  .game-intro-lead.show #game-intro-box-1 {
    width: 55.9375vw;
    transition-delay: .4s;
  }

  .game-intro-img-1 {
    width: 55.9375vw;
  }

  #game-intro-box-2 {
    width: 0;
    top: 41.09375vw;
    left: 6.71875vw;
  }

  .game-intro-lead.show #game-intro-box-2 {
    width: 77.1875vw;
    transition-delay: .6s;
  }

  .game-intro-img-2 {
    width: 77.1875vw;
  }

  #game-intro-box-3 {
    width: 0;
    top: 62.96875vw;
    left: 4.6875vw;
  }

  #game-intro-box-3.show {
    width: 47.5vw;
  }

  .game-intro-img-3 {
    width: 47.5vw;
  }

  #game-intro-box-4 {
    width: 0;
    top: 93.90625vw;
    left: 56.875vw;
  }

  #game-intro-box-4.show {
    width: 43.28125vw;
  }

  .game-intro-img-4 {
    width: 43.28125vw;
  }

  #game-intro-box-5 {
    width: 0;
    height: 41.40625vw;
    top: 218.59375vw;
    left: calc(5vw + 41.09375vw);
  }

  #game-intro-box-5.show {
    width: 41.09375vw;
    left: 5vw;
  }

  .game-intro-img-5 {
    width: 41.09375vw;
    position: absolute;
    top: 0;
    right: 0;
  }

  #game-intro-box-6 {
    width: 0;
    height: 39.21875vw;
    top: 166.25vw;
    left: calc(42.34375vw + 53.125vw);
  }

  #game-intro-box-6.show {
    width: 53.125vw;
    left: 42.34375vw;
    transition-delay: .2s;
  }

  .game-intro-img-6 {
    width: 53.125vw;
    position: absolute;
    top: 0;
    right: 0;
  }

  #game-intro-box-7 {
    width: 0;
    height: 55vw;
    top: 143.125vw;
    left: 37.8125vw;
  }

  #game-intro-box-7.show {
    width: 37.8125vw;
    left: 0;
    transition-delay: 0;
  }

  .game-intro-img-7 {
    width: 37.8125vw;
    position: absolute;
    top: 0;
    right: 0;
  }

  #game-intro-box-8 {
    width: 0;
    top: 242.7vw;
    left: 54.84375vw;
  }

  #game-intro-box-8.show {
    width: 40vw;
  }

  .game-intro-img-8 {
    width: 40vw;
  }

  #game-intro-box-9 {
    width: 0;
    height: 40.9375vw;
    top: 302.03125vw;
    left: calc(4.6875vw + 95.625vw);
  }

  #game-intro-box-9.show {
    width: 95.625vw;
    left: 4.6875vw;
  }

  .game-intro-img-9 {
    width: 95.625vw;
    position: absolute;
    right: 0;
  }

  #game-intro-box-10 {
    width: 0;
    height: 38.28125vw;
    top: 347.96875vw;
    left: calc(44.53125vw + 55.46875vw);
  }

  #game-intro-box-10.show {
    width: 55.46875vw;
    left: 44.53125vw;
  }

  .game-intro-img-10 {
    width: 55.46875vw;
    position: absolute;
    top: 0;
    right: 0;
  }

  #game-intro-box-line {
    width: .15625vw;
    height: 0;
    top: 217.65625vw;
    left: 50.15625vw;
    overflow: hidden;
    display: block;
  }

  #game-intro-box-line.show {
    height: 74.6875vw;
  }

  .game-intro-img-line {
    width: .15625vw;
  }

  .game-intro-dust {
    top: 56.25vw;
    left: 5.78125vw;
    width: 90.9375vw;
    pointer-events: none;
  }

    /*
  game-teamstory
  -------------------- */
  #game-teamstory {
    height: 300.3125vw;
    position: relative;
    z-index: 1;
  }

  .game-teamstory-ttl {
    width: 77.96875vw;
    margin: 0 0 7.65625vw 10.78125vw;
  }

  #game-teamstory .game-section-ttl-wind {
    width: 39.53125vw;
    top: 8.59375vw;
    left: 47.4vw;
    line-height: 1em;
  }

  .game-teamstory-contents {
    width: 95.3125vw;
    margin: 0 0 22.65625vw 4.6875vw;
  }

  .game-teamstory-item:not(:nth-child(1)) {
    margin: -5px 0 0 0;
  }

  .game-teamstory-item {
    transition: all .5s cubic-bezier(.17,.67,.22,.99);
    transform: translateX(100px);
    opacity: 0;
  }

  #game-teamstory-list.show .game-teamstory-item {
    opacity: 1;
    transform: translateX(0);
  }
  #game-teamstory-list.show .game-teamstory-item:nth-child(1) { transition-delay: .5s;}
  #game-teamstory-list.show .game-teamstory-item:nth-child(2) { transition-delay: .6s;}
  #game-teamstory-list.show .game-teamstory-item:nth-child(3) { transition-delay: .7s;}
  #game-teamstory-list.show .game-teamstory-item:nth-child(4) { transition-delay: .8s;}
  #game-teamstory-list.show .game-teamstory-item:nth-child(5) { transition-delay: .9s;}
  #game-teamstory-list.show .game-teamstory-item:nth-child(6) { transition-delay: 1s;}
  .game-teamstory-bg-container {
    width: 100%;
    position: relative;
    /* z-index: 0; */
    top: 0;
    left: 0;
  }

  .game-teamstory-chara {
    position: absolute;
    z-index: 1;
    top: -1.71875vw;
    left: 13.59375vw;
    width: 35.9375vw;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-teamstory-bg {
    width: 0;
    position: relative;
    z-index: 0;
    top: 0;
    left: 0;
    line-height: 0em;
    transition: all 1s cubic-bezier(.17,.67,.22,.99);
  }

  .game-bg-img {
    width: 100vw;
  }

  #game-teamstory-modal-container {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(2,4,46,.85);
    display: none;
    opacity: 0;
    overflow-y: scroll;
    overflow-x: hidden;
  }

  #game-teamstory-modal-inner {
    width: 100%;
    height: 228.125vw;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow-x: hidden;
  }

  .game-teamstory-close {
    top: 6.09375vw;
    right: 5vw;
    width: 8.90625vw;
  }

  .game-teamstory-prev {
    top: 84.53125vw;
    left: 4.53125vw;
    width: 6.71875vw;
    z-index: 10;
  }

  .game-teamstory-next {
    top: 84.53125vw;
    right: 4.53125vw;
    width: 6.71875vw;
    z-index: 10;
  }

  .game-teamstory-modal-box-container {
    position: relative;
    height: 100%;
  }

  .game-teamstory-modal-box {
    position: absolute;
    width: 100%;
    height: 228.125vw;
    overflow: hidden;
    top: 0;
    opacity: 0;
  }

  .game-teamstory-box-txt {
    width: 90vw;
    left: 5vw;
    top: 111.71875vw;
    margin: 0 0 0 5vw;
  }

  .game-teamstory-box-catch {
    position: absolute;
    z-index: 2;
    opacity: 0;
  }

  #game-teamstory-modal-0 .game-teamstory-box-catch,
  #game-teamstory-modal-1 .game-teamstory-box-catch,
  #game-teamstory-modal-2 .game-teamstory-box-catch,
  #game-teamstory-modal-3 .game-teamstory-box-catch,
  #game-teamstory-modal-4 .game-teamstory-box-catch {
    width: 100%;
    top: 0;
    right: 0;
    }


  .game-teamstory-box-bg {
  width: 90vw;
  left: 5vw;
  top: 111.71875vw;
  }

  .game-teamstory-dust {
    position: absolute;
    z-index: -1;
    top: 56.25vw;
    left: 5.78125vw;
    width: 90.9375vw;
  }

  /*アニメーション*/
  .game-teamstory-ttl.show,
  #game-teamstory .game-teamstory-ttl.show .game-section-ttl-wind {
    opacity: 1;
    transform: translateX(0);
  }

  .game-teamstory-txt.show {
    opacity: 1;
    transform: translate(0);
  }

  .game-teamstory-bg.show {
    width: 100%;
  }

  .game-teamstory-chara.show {
    opacity: 1;
    transform: translate(0);
  }

  .game-teamstory-dust {
    position: absolute;
    z-index: 1;
    top: 139.21875vw;
    left: 5.9375vw;
    width: 87.34375vw;
  }



  /*
  game-campaign
  -------------------- */
  #game-campaign {
    height: auto;
    margin: 0 0 28.125vw;
    position: relative;
  }

  .game-campaign-ttl {
    width: 78.59375vw;
    margin: 0 0 8.59375vw 9.375vw;
    /* line-height: 0em; */
    /* position: relative; */
  }

  #game-campaign .game-section-ttl-wind {
    width: 42.03125vw;
    position: absolute;
    z-index: 1;
    top: 10.46875vw;
    left: 46.40625vw;
    line-height: 0em;
  }

  .game-campaign-contents {
    width: 100%;
    margin: 0 0 17.96875vw;
    /* position: relative; */
    /* z-index: 1; */
  }

  .game-campaign-txt {
    width: 91.40625vw;
    margin: 0 0 4.0625vw 4.375vw;
  }

  .game-campaign-task {
    margin: 0 0 0 4.0625vw;
    width: 93.28125vw;
  }

  .game-campaign-task-item {
    height: 15.15625vw;
    width: auto;
  }

  .game-campaign-task-item:nth-child(2) {
    margin: -.9375vw 0 .9375vw;
  }

  .game-campaign-task-item:nth-child(3) {
    margin: -.46875vw 0 .46875vw;
  }

  .game-campaign-notes {
    width: 57.1875vw;
    margin: 1.25vw 0 0 4.0625vw;
  }

  .game-campaign-bg-container {
    width: 100%;
    position: relative;
    /* z-index: 0; */
    top: 0;
    left: 0;
  }

  .game-campaign-chara {
    position: absolute;
    z-index: 1;
    top: -1.71875vw;
    left: 13.59375vw;
    width: 35.9375vw;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-campaign-bg {
    width: 0;
    position: relative;
    z-index: 0;
    top: 0;
    left: 0;
    line-height: 0em;
    transition: all 1s cubic-bezier(.17,.67,.22,.99);
  }

  .game-campaign-dust {
    position: absolute;
    z-index: -1;
    top: 136.09375vw;
    left: 5.9375vw;
    width: 87.34375vw;
  }

  /*アニメーション*/
  .game-campaign-bg.show {
    width: 100vw;
  }

  /*
  game-about
  -------------------- */
  #game-about {
      height: 238.28125vw;
      /* position: relative; */
  }

  .game-about-ttl {
    width: 48.28125vw;
    margin: 0 0 7.65625vw 24.84375vw;
    position: relative;
  }

  #game-about .game-section-ttl-wind {
    width: 35.9375vw;
    /* position: absolute; */
    /* z-index: 1; */
    top: 8.90625vw;
    left: 18.28125vw;
    line-height: 0em;
  }

  .game-about-contents {
    width: 100%;
    margin: 0;
    position: relative;
    z-index: 1;
  }

  .game-about-txt {
    width: 65.3125vw;
    margin: 0 0 10vw 17.34375vw;
  }

  .game-about-lead {
    width: 89.53125vw;
    margin: 0 0 4.6875vw 5.78125vw;
  }

  .game-about-txt-box {
    width: 88.75vw;
    height: 54.84375vw;
    margin: 0 auto 95.3125vw;
  }

  .game-about-txt-box .game-about-txt {
    margin: 0;
  }

  .game-about-img0 {
    position: absolute;
    /* z-index: 1; */
    top: -40.78125vw;
    left: 62.1875vw;
    width: 37.8125vw;
  }

  .game-about-img1 {
    position: absolute;
    z-index: 1;
    top: 163.90625vw;
    left: -.625vw;
    width: 61.5625vw;
  }

  .game-about-img2 {
    position: absolute;
    /* z-index: 1; */
    top: 155.78125vw;
    left: 70vw;
    width: 30vw;
  }

  .game-about-dust {
    top: 6.40625vw;
    left: 3.75vw;
    width: 90.9375vw;
  }

  /*
  game-system
  -------------------- */
  #game-system {
    height: 169.84375vw;
    position: relative;
  }

  .game-system-ttl {
    width: 66.875vw;
    margin: 0 0 7.8125vw 17.34375vw;
    position: relative;
    z-index: 1;
  }

  #game-system .game-section-ttl-wind {
    width: 39.0625vw;
    /* position: absolute; */
    /* z-index: 1; */
    top: 9.53125vw;
    left: 36.5625vw;
    transition: all .4s .5s cubic-bezier(1, 0, 0, 1);
  }  
  
  .game-system-container {

  }

  .game-system-box {

  }

  .game-system-contents {
    margin: 0;
    /* position: relative; */
    /* z-index: 1; */
    width: 90.625vw;
    margin: 0 auto;
  }

  .game-system-contents0 {
    width: 100%;
  }

  .game-system-contents1 {
    width: 94.0625vw;
  }

  .game-system-contents2 {
    width: 100vw;
    margin: 0 0 0 calc((100vw - 90.625vw)/-2);
  }

  .game-system-contents3 {
    width: 95.15625vw;
  }

  .game-system-bg-container {
    display: none;
  }

  .game-system-bg-container.sp {
    display: block;
    width: 100%;
    position: relative;
    z-index: 1;
    top: 0;
    left: 0;
    margin: 0 0 5.78125vw;
  }

  .game-system-bg-container3 {
    margin-bottom: 8.90625vw;
  }

  .game-system-chara0 {
    width: 44.53125vw;
    top: -5.6vw;
    left: 46.875vw;
    opacity: 0;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-system-chara1 {
    width: 42.1875vw;
    top: -6.25vw;
    left: 11.40625vw;
    opacity: 0;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-system-chara3 {
    top: -10.3125vw;
    left: 51.875vw;
    width: 37.34375vw;
    opacity: 0;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-system-bg {
    width: 0%;
    left: 0;
    transition: all 1s cubic-bezier(.17,.67,.22,.99);
  }

  .game-system-bg-img {
    width: 100vw;
  }

  .game-system-control {
    /* position: relative; */
    z-index: 2;
    width: 55.3125vw;
    top: 141.09375vw;
    /* margin: 0 auto; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    left: 22.65625vw;
  }

  .game-system-prev,
  .game-system-next {
    width: 5.9375vw;
    position: initial;
    z-index: 2;
    top: 0;
  }

  .game-system-prev {
    left: 55px;
  }

  .game-system-next {
    right: 48px;
  }

  .game-system-dots {
    display: flex;
    position: initial;
    z-index: 1;
    top: auto;
    left: auto;
  }

  .game-system-dot {
    width: 2.03125vw;
    height: 2.03125vw;
    border: .3125vw solid #fff;
    border-radius: 100px;
    margin: 0 1.875vw;
    cursor: auto;
  }

  .game-system-dot.act,
  .game-system-dot:hover {
    background: #fff;
  }

  .game-system-dust {
    top: 149.0625vw;
    left: 4.53125vw;
    width: 87.34375vw;
  }

  /*アニメーション*/
  .game-system-bg.show {
    width: 100vw;
  }

  .game-system-chara0.show,
  .game-system-chara1.show,
  .game-system-chara2.show,
  .game-system-chara3.show {
    opacity: 1;
    transform: translate(0);
  }
  
  /*
  game-movie
  -------------------- */
  #game-movie {
    height: auto;
    padding: 0 0 29.6875vw;
    position: relative;
    overflow: hidden;
  }

  .game-movie-ttl {
    width: 52.34375vw;
    margin: 0 0 16.71875vw 23.4375vw;
    /* position: relative; */
    /* z-index: 1; */
  }

  #game-movie .game-section-ttl-wind {
    width: 34.53125vw;
    /* position: absolute; */
    /* z-index: 1; */
    top: 4.6875vw;
    left: 25.78125vw;
  }

  .game-movie-container {
    display: block;
    /* justify-content: center; */
    margin: 0 auto;
  }

  .game-movie-box {
    width: 91.40625vw;
    height: 53.59375vw;
    /* position: relative; */
    margin: 0 auto 2.65625vw;
    padding: 1vw;
  }

  .game-movie-box:nth-last-child(1) {
    margin-bottom: 0;
  }

  .game-movie-box::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background: url("../img/game/movie/monitor_frame_mini.png") no-repeat;
    background-size: 100% auto;
  }

  .game-movie-steel {
    position: absolute;
    z-index: 0;
    top: 31.09375vw;
    left: 0;
    width: 100%;
  }

  .game-movie-steel-light {
    width: 100%;
    /* position: absolute; */
    /* z-index: 1; */
    top: -3.59375vw;
    left: 0;
  }

  .game-movie-dust {
    position: absolute;
    z-index: -1;
    top: -25.46875vw;
    left: 6.25vw;
    width: 89.0625vw;
  }

  /*
  game-special
  -------------------- */
  #game-special {
    height: auto;
    position: relative;
    /* z-index: -6; */
  }

  #game-special::after {
    content: "";
    display: block;
    width: 100%;
    height: 313.28125vw;
    background: url(../img/game/bg_sp_02.png) no-repeat;
    background-size: 100% auto;
    position: absolute;
    z-index: -1;
    top: -205vw;
    left: 0;
  }

  .game-special-ttl {
    width: 60.46875vw;
    margin: 0 0 7.5vw 20.78125vw;
    position: relative;
    z-index: 1;
  }

  #game-special .game-section-ttl-wind {
    width: 35.625vw;
    top: 9.84375vw;
    left: 40.3125vw;
    line-height: 0em;
  }

  .game-special-container {
    position: relative;
    z-index: 1;
    width: 90.3125vw;
    margin: 0 auto 19.53125vw;
  }

  .game-special-list {
    width: 100%;
    display: block;
  }

  .game-special-item {
    width: 100%;
    height: 30.15625vw;
    margin: 0 0 2.96875vw;
  }

  .game-special-item-dummy {
    display: none;
  }

  .game-special-bg-container {
    width: 100%;
    position: relative;
    z-index: 1;
    top: 0;
    left: 0;
    margin: 0 0 14.21875vw;
  }

  .game-special-chara {
    position: absolute;
    z-index: 1;
    top: -.46875vw;
    left: 0;
    width: 47.96875vw;
    transform: translateX(-50px);
    transition: all .5s .5s cubic-bezier(.17,.67,.22,.99);
  }

  .game-special-bg {
    width: 0;
    position: relative;
    z-index: 0;
    top: 0;
    left: 0;
    transition: all 1s cubic-bezier(.17,.67,.22,.99);
  }

  .game-special-bg img {
    width: 100vw;
  }

  .game-special-dust {
    top: -17.65625vw;
    left: 6.25vw;
    width: 88.125vw;
  }

  /*アニメーション*/
  .game-special-bg.show {
    width: 100vw;
  }

  /*
  game-spec
  -------------------- */
  #game-spec {
    height: auto;
    position: relative;
  }

  .game-spec-ttl {
    width: 44.375vw;
    margin: 0 0 7.5vw 30.3125vw;
    position: relative;
    z-index: 1;
  }

  #game-spec .game-section-ttl-wind {
    width: 29.84375vw;
    top: 9.0625vw;
    left: 26.71875vw;
  }

  .game-spec-container {
    font-size: 15px;
  }

  .game-spec-txt-box {
    margin: 0 auto 31.5625vw;
    width: 73.125vw;
  }
  .game-spec-txt-block {
    font-weight: bold;
    line-height: 1em;
    letter-spacing: .8px;
    margin: 0 0 17px;
  }

  .game-spec-txt0 {
    width: 210px;
    text-align: right;
    display: inline-block;
    font-family: "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  }

  .game-spec-txt-mini {
    font-weight: bold;
    font-size: 12px;
  }

  .game-spec-txt1 {

  }

  .game-spec-cc {
    width: 60vw;
    padding: 0 0 11.59375vw;
  }

  .game-spec-dust {
    top: 17.34375vw;
    left: 8.28125vw;
    width: 82.1875vw;
  }
  
}