.inner {
  position: relative;
  width: 100%;
  height: 100%;
}

/* ----------------------
    mainContents
   ---------------------- */
#mainContents {
  background: url(../img/yugeki/bg.jpg) no-repeat;
  background-size: cover;
  width: 100vw;
  height: 503.06667vw;
  overflow: hidden;
}
#mainContents #yugeki {
  height: 174vw;
}
#mainContents #yugeki h2 {
  background: url("../img/yugeki/title.png") no-repeat;
  background-size: contain;
  width: 100vw;
  height: 36.13333vw;
  position: absolute;
  top: 22.53333vw;
  left: 0;
  text-indent: -9999px;
  opacity: 0;
}
#mainContents #yugeki .per {
  background: url("../img/yugeki/per.png") no-repeat;
  background-size: contain;
  width: 100vw;
  height: 64.4vw;
  position: absolute;
  top: 54.4vw;
  left: 0;
  text-indent: -9999px;
  opacity: 0;
}
#mainContents #yugeki .setting {
  background: url("../img/yugeki/setting.png") no-repeat;
  background-size: contain;
  width: 10vw;
  height: 10vw;
  position: absolute;
  top: 117.6vw;
  right: 4.53333vw;
  text-indent: -9999px;
  display: none;
}
#mainContents #yugeki .chara1 {
  background: url("../img/yugeki/chara1.png") no-repeat;
  background-size: contain;
  width: 35.06667vw;
  height: 52.26667vw;
  position: absolute;
  top: 118.66667vw;
  left: 12.26667vw;
  transform: translate(-53.33334vw, 0);
  transition: transform 0.35s cubic-bezier(0.22, 0.84, 0.31, 1.11);
}
#mainContents #yugeki .chara1.show {
  transform: translate(0, 0);
}
#mainContents #yugeki .chara2 {
  background: url("../img/yugeki/chara2.png") no-repeat;
  background-size: contain;
  width: 43.73333vw;
  height: 53.6vw;
  position: absolute;
  top: 118.93333vw;
  right: 7.46667vw;
  transform: translate(53.33333vw, 0);
  transition: transform 0.35s cubic-bezier(0.22, 0.84, 0.31, 1.11);
}
#mainContents #yugeki .chara2.show {
  transform: translate(0, 0);
}
#mainContents #spec {
  height: 329.33333vw;
  opacity: 0;
}
#mainContents #spec.show {
  opacity: 1;
}
#mainContents #spec h2 {
  background: url("../img/yugeki/spec_title.png") no-repeat;
  background-size: contain;
  width: 63.6vw;
  height: 32.93333vw;
  position: absolute;
  top: -3.73334vw;
  left: 15.86667vw;
  text-indent: -9999px;
  display: none;
}
#mainContents #spec .box {
  background: url("../img/yugeki/spec_box.png") no-repeat;
  background-size: contain;
  width: 100vw;
  height: 209.2vw;
  position: absolute;
  top: -16.8vw;
  left: 0;
  display: none;
}
#mainContents #spec .table {
  background: url("../img/yugeki/spec_table.png") no-repeat;
  background-size: contain;
  width: 100vw;
  height: 193.46667vw;
  position: absolute;
  top: 135.86667vw;
  left: 0;
  display: none;
}