@charset "utf-8";

@import "../../../common/css/layout.css";

/*-------------------------------------------------------------------------
  Key Visual
/*-----------------------------------------------------------------------*/

#kv {
}
img {
  width: 100%;
  height: auto;
}

#container {
  position: relative;
}

.logo-3ds {
  width: 34.13%;
  position: absolute;
  top: 0.42%;
  right: 2%;
  z-index: 10;
}

#key-visual {
  position: relative;
}
  #key-visual .badge {
    position: absolute;
    bottom: 2%;
    right: 2%;
    width: 35.33%;
    z-index: 15;
  }

#key-visual .parts01 .anm img{
  position: relative;
}
  #key-visual .parts01 .anm img{
    transition: all 0.3s ease-out;
    width: 40%;
    top: -27vw;
    right: -115%;
  }
  #key-visual .show .parts01 img{
    right: -61%;
  }

/*-------------------------------------------------------------------------
  parttime
/*-----------------------------------------------------------------------*/
#parttime{
  margin-top: -75vw;
}

#parttime .slide_frame{
  margin-top: -90vw;
}
#parttime .copy{
    margin-top: -48vw;
    width: 78%;
    z-index: 10;
    position: relative;
    margin-left: 3%;
}
.prev-arrow{
    left: 3%;
    width: 8%;
    position: relative;
    top: 35.5vw;
    z-index: 1;
}
.next-arrow {
    width: 8%;
    position: relative;
    left: 89.5%;
    top: -41.5vw;
    z-index: 1;
}
.slick-dots{
  top: 81vw !important
}
  .slick-dots li{
      width: 4vw !important;
      height: 4vw  !important;
      border-radius: 50px  !important;
      background-color: #fee600  !important;
      border: 4px solid #fee600 !important;
  }
    .slick-dots li button{
      display: none !important;
    }
    .slick-dots li.slick-active{
        background-color: #000  !important;
    }
#parttime  .video {
    position: relative;
    width: 58%;
    padding-top: 31.25%;
    margin-top: -53vw;
    margin-left: 21.5%;
    border: 5px solid #000;
}
  #parttime  .video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }
  #parttime  .slick-list{
    overflow: -webkit-paged-x !important;
  }

@keyframes arrow-move-right {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  70% {
    -webkit-transform: translate3d(-10%, 0, 0);
            transform: translate3d(-10%, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes arrow-move-left {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  70% {
    -webkit-transform: translate3d(10%, 0, 0);
            transform: translate3d(10%, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
  .next-arrow{
  -webkit-animation: arrow-move-right 0.7s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
  animation: arrow-move-right 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
  }
  .prev-arrow{
  -webkit-animation: arrow-move-left  0.7s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
  animation: arrow-move-left  0.7s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
  }

/*-------------------------------------------------------------------------
  play
/*-----------------------------------------------------------------------*/

#play{
margin-top: -12vw;
}

/*-------------------------------------------------------------------------
  race
/*-----------------------------------------------------------------------*/
#race{
  margin-top: -1vw;
}
#race  .video {
  position: relative;
  width: 72%;
  padding-top: 41.25%;
  margin-top: -53vw;
  margin-left: 14%;
}
  #race  .video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }
/*   #race  .slick-list{
      overflow: inherit !important;
  } */

/*-------------------------------------------------------------------------
  mine
/*-----------------------------------------------------------------------*/

#mine{
  margin-top: 11vw;
}

#hiscore{
  margin-top: -1vw;
}
/*-------------------------------------------------------------------------
  footer_nav
/*-----------------------------------------------------------------------*/

#footer_nav {
  margin-top:-24vw
}