html,body,.page{width: 100%;height: 100%;overflow: hidden;}
.page{padding-top: 78px;box-sizing: border-box;}
.page-swiper{height: 100%;}
.part{background:#fafafa url('../images/index-part.jpg') no-repeat center / cover; overflow: hidden; display: -webkit-box;display: -ms-fslexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.index-banner{background: #000;}
.index-banner video{display: block; width: 100%; height: 100%; object-fit: cover;}
.mouse{width: 26px;height: 42px; position: absolute; bottom: 8%; left: 50%; margin-left: -13px; border: 1px solid #fff; border-radius: 13px; overflow: hidden;}
.mouse i{background: #f9d323; width: 4px; height: 11px; margin: 8px auto 0; display: block; border-radius: 2px; -webkit-animation: downJump 2s linear infinite; animation: downJump 2s linear infinite;}
.play{width: 92px; height: 53px; background: url('../images/index-play.png') no-repeat; position: absolute; left: 50%; top: 50%; margin-top: 140px; margin-left: -46px; cursor: pointer;}
.index-about{background-image:url('../images/index-about.jpg');}
.tit_en{height: 68px;margin: 0; background-repeat: no-repeat; background-size: auto 100%;}
.about{width: 870px;margin-top: -180px}
.about .tit_en{width: 400px;background-image: url('../images/index-title-t1.png');}
.about h2{margin: 0; font-size: 40px; line-height: 1; margin: 18px 0;}
.about-txt{font-size: 18px; line-height: 40px; padding: 5px 0 60px;}
.about .more{background:#fcfcfc}
.more{display: inline-block; font-size: 14px; line-height: 44px; width: 142px; border: 1px solid #313132; border-radius: 22px; text-align: center; -webkit-transition: all .2s linear; transition: all .2s linear;}
.more:hover{border-color: #f9d323; background: #f9d323!important;}
@-webkit-keyframes downJump {0% {-webkit-transform: translateY(0);transform: translateY(0);}50% {-webkit-transform: translateY(5px);transform: translateY(5px);}100% {-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes downJump {0%{-webkit-transform: translateY(0);transform: translateY(0);}50%{-webkit-transform: translateY(5px);transform: translateY(5px);}100% {-webkit-transform: translateY(0);transform: translateY(0);}} 
.product{width: 100%; box-sizing: border-box; padding: 0 70px 0 30px; position: relative;}
.product .tit_en{position: absolute; top: -68px;width:661px;background-image: url('../images/index-title-t2.png');}
.product-list li{position: relative; display: none;}
.product-list .on{display: block;}
.product-img{width: 960px; height: 540px; border: 10px solid #ffd71f; position: relative; -webkit-animation: fadeInLeft .6s forwards; animation: fadeInLeft .6s forwards;}
.product-img img{display: block; width: 100%;}
.product-img .character{position: absolute; top: -100px; right: -160px; width: 840px; height: 802px; -webkit-animation: fadeInLeft .8s forwards; animation: fadeInLeft .8s forwards;}
.product-info{position: absolute; right: 0; top: 190px; width: 795px; -webkit-animation: fadeInRight .6s forwards; animation: fadeInRight .6s forwards;}
.product-info .more{width: 170px; background-color: #fff;}
.product-text{height: 313px; font-size: 20px;color: #4b4b4b;letter-spacing: 2px;}
.product-text .en{font-size: 58px; font-weight: bold; line-height: 1; text-transform: uppercase; letter-spacing: -4px;}
.product-text .en2{font-size: 30px; color: #b1b1b1; letter-spacing: -2px;}
.product-text .game-name{font-size: 40px; font-weight: bold; margin:2px 0 20px;}
.game-ico{position: absolute; top: 0; right: 70px; width: 795px; display: flex;justify-content: space-between;align-items: center;z-index: 2;}
.game-ico-list{width: 670px;margin: 0;}
.game-ico-list .swiper-slide{width: 112px;height: 112px;margin-right: 20px;cursor: pointer;border-radius: 20px;overflow: hidden;border: 3px solid transparent;}
.game-ico-list .swiper-slide-active {border-color:#f5c05a;}
.game-next{width: 48px; height: 48px; background: #ffd71f url('../images/next.png') no-repeat center; border: 2px solid #fff; border-radius: 50%;cursor: pointer;}
.game-next:hover{background-color: #ffda30;}
@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-50%,0,0);-ms-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}
@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(50%,0,0);transform:translate3d(50%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(50%,0,0);-ms-transform:translate3d(50%,0,0);transform:translate3d(50%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}
.join{padding-left: 60px; cursor: pointer; width: 100%; box-sizing: border-box; position: relative;}
.join .tit_en{width:351px;background-image: url('../images/index-title-t3.png');}
.join-list .swiper-slide{width: 334px; margin-right: 4px;}
.join-list .join-img{position: relative;}
.join-list .join-img::after{content: ""; position: absolute;left: 0;right: 0;bottom: 0;top: 0;background: rgba(0, 0, 0, .8);-webkit-transition: all .2s linear;transition: all .2s linear;}
.join-list .join-txt{height: 84px; background: #8c8c8c; font-size: 30px; font-weight: bold; color: #fff; display: flex; align-items: center; justify-content: center;-webkit-transition: all .2s linear;transition: all .2s linear;}
.join-list .swiper-slide:hover .join-img::after{opacity: 0;}
.join-list .swiper-slide:hover .join-txt{background: #d3d3d2;}
.join-info{position: absolute;top: 60px;left: 50%; padding-left: 320px; color: #fff;z-index: 2; font-size: 20px;}
.join-name{font-size: 40px; font-weight: bold; margin-bottom: 15px;}
.join-more{background: #ffd71f; margin-top: 45px; display: inline-block; line-height: 48px; width: 158px; text-align: center; border-radius: 24px; font-size: 16px;-webkit-transition: all .2s linear;transition: all .2s linear;}
.news .tit_en{width:230px;margin: 0 auto; background-image: url('../images/index-title-t4.png');}
.news-tit{text-align: center; font-size: 40px; font-weight: bold;}
.news-con{width: 1524px; margin: 14px auto 0; display: flex; justify-content: space-between;}
.news-fist{width: 858px;}
.news-fist .news-img{border: 5px solid #ffd71f; height: 266px; overflow: hidden;}
.news-fist .news-img img{-webkit-transition: all .2s;-moz-transition: all .2s;-ms-transition: all .2s;-o-transition: all .2s;transition: all .2s;display: block;width: 100%;}
.news-fist .news-img:hover img{-webkit-transform: scale(1.04);-moz-transform: scale(1.04);-ms-transform: scale(1.04);-o-transform: scale(1.04);transform: scale(1.04);}
.news-fist .nt{margin: 45px 0 20px; display: flex; justify-content: space-between; align-items: center;}
.news-fist .nt p{font-size: 23px; font-weight: bold; width: 690px; overflow: hidden;text-overflow: ellipsis;white-space: nowrap; word-wrap: break-word;}
.news-fist .nt .more{background-color: #fff;}
.news-fist .news-txt{font-size: 19px; line-height: 40px;}
.news-list{width: 615px;}
.news-item{background: #fff; margin-bottom: 50px; font-size: 18px; font-weight: bold; border: 1px solid #b5b5b5; padding: 0 28px 0 48px; height: 110px; display: flex; justify-content: space-between; align-items: center;}
.news-item .time{font-size: 17px; color: #ffd71f; font-weight: normal; margin-bottom: 4px;}
.mews-right{width: 28px; height: 28px; background:#ffd71f url('../images/news-more.png') no-repeat center; border-radius: 50%;-webkit-transition: all .2s linear;transition: all .2s linear;}
.news-item:hover .mews-right{-webkit-transform: translateX(10px);transform: translateX(10px);}
.foot{height: 230px;background: #141724;}
.en .join-list .join-txt{font-size: 22px;}