@charset "utf-8";
@import "reset.css";
@import "tab-menu.css";
@import "swiper-custom.css";
@import "toggle-box.css";

/* img-box */
.img-box {
  position: relative;
}

/* video */
.visual {
  display: block;
  width: 100%;
}

/* marquee */
@keyframes marquee1 {
  from {
    background-position-x: 0;
  }
  to {
    background-position-x: 1000vw;
  }
}
@keyframes marquee2 {
  from {
    background-position-x: 0;
  }
  to {
    background-position-x: -1000vw;
  }
}

.marquee {
  width: 100%;
  height: 19.8666vw;
  position: absolute;
}
.marquee1 {
  background: url(../images/marquee1.png) repeat-x center / cover;
  top: 70vw;
  animation: marquee1 130s linear infinite;
}
.marquee2 {
  background: url(../images/marquee2.png) repeat-x center / cover;
  top: 93vw;
  animation: marquee2 130s linear infinite;
}

/* swiper */
.swiper-mask {
  width: 100%;
  position: absolute;
}

.swiperTop {
  top: 63vw;
}
.swiperTop .swiper {
  padding: 0 19.3333vw;
}

.swiper-basic {
  top: 16vw;
}
.swiper-basic .swiper {
  padding: 0 8vw;
}