*{margin: 0;padding: 0;border: 0;list-style: none;}
a{text-decoration: none;-webkit-transition: all 0.45s;transition: all 0.45s;}
.allclear{ clear: both;}



html,body{width: 100%; height: 100%; font-family: "Arial";background: #00000b; min-width: 1200px; min-height: 720px;}
.wrap{position: relative; width: 100%;height: 100%;overflow: hidden;transition: transform 1s;-webkit-transition: -webkit-transform 1s;}
.swiper-main{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.swiper-main .swiper-slide{overflow: hidden;}
.post{position: absolute;}
.center{position: absolute;left: 0;width: 100%;text-align: center;}
.part{position: relative;width: 100%;height: 100%;box-sizing: border-box;}
.part .bg{position: absolute;top: 0;left: 50%;width: 1920px;height: 1080px; margin-left: -960px;}
.part1 .bg{background: url("../images/bg1.webp") center no-repeat;background-size: cover;}
.part2 .bg{background: url("../images/bg2.webp") center no-repeat;background-size: cover;}
.part .container{ width: 1200px; height: 1080px; z-index: 4;position: absolute;top: 0;left: 50%; margin-left: -600px;}
.top_logo{ position: absolute;top: 6.5%;left: 100px; pointer-events: none;}
.playnow,.bot_play{ width: 430px; height: 165px; background: url("../images/playnow.webp") no-repeat; position: absolute; left: 385px; -webkit-animation: playnow 4s steps(84) infinite;animation: playnow 4s steps(84) infinite;}
.playnow:hover,.bot_play:hover{ background: url("../images/playnow2.webp") no-repeat;}
.playnow{ top: 68%;}
.down{position: -webkit-sticky; position: sticky; left: 0; top:90%;width: 100px;height: 95px; background: url("../images/down.png") no-repeat;-webkit-animation: pulse 2s infinite; -moz-animation: pulse 2s infinite; -o-animation: pulse 2s infinite; animation: pulse 2s infinite; opacity: 0.5; cursor: pointer; z-index: 3;}
.down:after{position: absolute;top: 0;left: 34px; content: ""; width: 30px;height: 45px; background: url("../images/mouse.png") no-repeat;  animation:fadeInDown 1.5s infinite; -o-animation:fadeInDown 1.5s infinite;
    -moz-animation:fadeInDown 1.5s infinite;
    -webkit-animation:fadeInDown 1.5s infinite;
    animation-fill-mode:both;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -o-animation-fill-mode:both;}

.part1_nav{position: absolute;top: 8%;left: 0;width: 1200px;display: flex;justify-content: space-between;}
.part1_nav a{width: 235px; height: 63px;}
.part1_news{background: url(../images/sub/news.png) no-repeat;}
.part1_news:hover{background: url(../images/sub/news2.png) no-repeat;}
.part1_guides{background: url(../images/sub/guides.png) no-repeat;}
.part1_guides:hover{background: url(../images/sub/guides2.png) no-repeat;}
.part1_faq{background: url(../images/sub/faq.png) no-repeat;}
.part1_faq:hover{background: url(../images/sub/faq2.png) no-repeat;}
.part1_code{background: url(../images/sub/code.png) no-repeat;}
.part1_code:hover{background: url(../images/sub/code2.png) no-repeat;}
.part1_support{background: url(../images/sub/support.png) no-repeat;}
.part1_support:hover{background: url(../images/sub/support2.png) no-repeat;}


/*多语言*/
.part1_language{position: absolute;top: 50%;margin-top: -70px; right: -225px;width: 280px;height: 140px;z-index: 5;-webkit-transition: all 0.35s ease-in-out;transition: all 0.35s ease-in-out;}
.part1_language:hover{right: 20px;}
.part1_language a{position: relative; display: block;width: 58px;height: 58px;margin-bottom: 20px;}
.part1_language a span{position: absolute;top: 14px;left: 50px; min-width: 220px; padding: 0 5px 0 15px;height: 24px;line-height: 24px;background-color: #5346e7;border: 3px solid #fff;color: #fff;font-size: 14px;font-weight: bold;z-index: -1;border-radius: 5px;}
.part1_en{background: url("../images/en.png") no-repeat;}
.part1_de{background: url("../images/de.png") no-repeat;}
.part1_fr{background: url("../images/fr.png") no-repeat;}



/*app_store*/
.app_store{position:fixed;right: 10px;top: 70px; width: 90px;height: 104px; background: url("../images/ios.png") no-repeat;z-index: 5;}
.app_store:hover{background: url("../images/ios2.png") no-repeat;}
.app_store:after{content: '';position: absolute;top: 20px;left: 50%;margin-left: -18.5px; width: 37px;height: 47px; background: url("../images/phone.png") no-repeat}
.app_store:hover:after{-webkit-animation:shake .2s infinite; -moz-animation:shake .2s infinite; animation:shake .2s infinite;}
.app_store span{position: absolute;bottom: 10px;left: 0;width: 100%;text-align: center;font-size: 12px;color: #fff;}


/*左侧五个按钮*/
.part1_bar{ width: 100px; height: 370px; position: absolute; left: -55px; top: 35%; z-index: 5;}
.part1_bar:hover{ left: 0;}
.part1_fb,.part1_discord,.part1_ytb,.gotop,.part1_forum{position: absolute;left: 25px; width: 60px;height: 60px;background: url(../images/sidebar.webp) no-repeat; -webkit-transition: none; transition: none;}
.gotop{ top: 0; background-position: -10px -10px;}
.gotop:hover{ background-position: -90px -10px;}
.part1_fb{top: 65px; background-position: -10px -80px;}
.part1_fb:hover{background-position: -90px -80px;}
.part1_ytb{top: 130px; background-position: -10px -150px;}
.part1_ytb:hover{background-position: -90px -150px;}
.part1_discord{top: 195px; background-position: -10px -220px;}
.part1_discord:hover{background-position: -90px -220px;}
.part1_forum{top: 260px;background-position: -10px -290px;}
.part1_forum:hover{background-position: -90px -290px;}


/* 第五屏 */
#slideStore{ position: absolute; top: 19%; left: 105px; width: 990px;}
#slideStore .swiper-container{ width: 990px; overflow: hidden;}
#slideStore .swiper-slide{ width: 990px; height: 458px; box-sizing: border-box;}
#slideStore .swiper-slide img{ display: block; width: 100%;}
#slideStore .swiper-button-prev,#slideStore .swiper-button-next{ position: absolute; top: 50%; margin-top: -48.5px; width: 97px; height: 97px; background: url(../images/part5_arrow.png) no-repeat; }
#slideStore .swiper-button-prev:hover,#slideStore .swiper-button-next:hover{ background: url(../images/part5_arrow2.png) no-repeat;}
#slideStore .swiper-button-prev:after,#slideStore .swiper-button-next:after{ display: none;}
#slideStore .swiper-button-prev{left: -11%;-webkit-transform: rotate(180deg);transform: rotate(180deg);}
#slideStore .swiper-button-next{right: -11%;}
.part5_box{top: 16.2%;left: 78.5px;width: 1043px;height: 518px; background: url(../images/part5_box.webp) no-repeat;pointer-events: none;}
.bot_play{ top: 63%;}


/*底部信息*/
.swiper_footer{position: absolute;top: 90%;left: 0;width: 100%;height: 100px;background:#4e505b; z-index: 5;}
.copyright{position: relative;margin: 20px auto 0; width:1200px; text-align:center; line-height:20px; display:block;font-size: 16px; color: #e0e1e5;}
.copyright a{ color: #e0e1e5;}
.copyright a:hover{ color: #FFFFFF;}


@-webkit-keyframes playnow {
    to{
        background-position: 0 -13860px;
    }
}
@keyframes playnow {
    to{
        background-position: 0 -13860px;
    }
}
/*向下箭头--动画效果*/
@-webkit-keyframes fadeInDown {
  from {
      -webkit-transform: translate3d(0, -30%, 0);
      transform: translate3d(0, -30%, 0);
  }

  to {
      -webkit-transform: none;
      transform: none;
  }
}
@-o-keyframes fadeInDown {
  from {
      -o-transform: translate3d(0, -30%, 0);
      transform: translate3d(0, -30%, 0);
  }

  to {
      -o-transform: none;
      transform: none;
  }
}
@-moz-keyframes fadeInDown {
  from {
      -moz-transform: translate3d(0, -30%, 0);
      transform: translate3d(0, -30%, 0);
  }

  to {
      -moz-transform: none;
      transform: none;
  }
}
@keyframes fadeInDown {
  from {
      transform: translate3d(0, -30%, 0);
      transform: translate3d(0, -30%, 0);
  }

  to {
      transform: none;
      transform: none;
  }
}
@media screen and (max-width: 1800px) {
  .swiper_footer{ width: 150%; top: 94%; left: -25%;}
  .part{-webkit-transform: scale(0.96);-moz-transform: scale(0.96);-ms-transform: scale(0.96);-o-transform: scale(0.96);transform: scale(0.96);
      -webkit-transition: all 0.25s ease;
      -o-transition: all 0.25s ease;
      transition: all 0.25s ease;}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{ top: 92%;}
}
@media screen and (max-width: 1700px) {
  .swiper_footer{ width: 150%; top: 99%; left: -25%;}
  .part{-webkit-transform: scale(0.92);-moz-transform: scale(0.92);-ms-transform: scale(0.92);-o-transform: scale(0.92);transform: scale(0.92);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{ top: 95%;}
}
@media screen and (max-width: 1600px) {
  .swiper_footer{ width: 150%; top: 103%; left: -25%;}
  .part{-webkit-transform: scale(0.88);-moz-transform: scale(0.88);-ms-transform: scale(0.88);-o-transform: scale(0.88);transform: scale(0.88);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{top: 100%;}
}
@media screen and (max-width: 1500px) {
  .swiper_footer{ width: 150%; top: 108%; left: -25%;}
  .part{-webkit-transform: scale(0.84);-moz-transform: scale(0.84);-ms-transform: scale(0.84);-o-transform: scale(0.84);transform: scale(0.84);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{top: 105%;}
}
@media screen and (max-width: 1400px) {
  .swiper_footer{ width: 150%; top: 113%; left: -25%;}
  .part{-webkit-transform: scale(0.8);-moz-transform: scale(0.8);-ms-transform: scale(0.8);-o-transform: scale(0.8);transform: scale(0.8);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{top: 110%;}
}
@media screen and (max-width: 1300px) {
  .swiper_footer{ width: 150%; top: 119%; left: -25%;}
  .part{-webkit-transform: scale(0.76);-moz-transform: scale(0.76);-ms-transform: scale(0.76);-o-transform: scale(0.76);transform: scale(0.76);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{top: 115%;}
}
@media screen and (max-width: 1200px) {
  .swiper_footer{ width: 150%; top: 126%; left: -25%;}
  .part{-webkit-transform: scale(0.72);-moz-transform: scale(0.72);-ms-transform: scale(0.72);-o-transform: scale(0.72);transform: scale(0.72);}
  .part{-webkit-transform-origin: center 0;-moz-transform-origin: center 0;-ms-transform-origin: center 0;-o-transform-origin: center 0;transform-origin: center 0;}
  .down{top: 119%;}
}