html,body,.app,.page-swiper{height: 100%;}
.home{background: #000 url('../imgs/home.jpg') no-repeat center top / 7.5rem;}
.part{background:#fcfcfb url('../imgs/part-top.jpg') no-repeat center top / 7.5rem;display: flex;align-items: center;justify-content: center;text-align: center;}
.part::after{content: '';position: absolute;bottom: 0;left: 0;width: 100%;background:url('../imgs/part-foot.jpg') no-repeat center top / 7.5rem;height: 4.1rem;}
.part .main{position: relative; z-index: 1;padding: 0;}
.mouse{width: .62rem;height: 1.04rem;border-radius: .31rem;border: 1px solid #fff;position: absolute;left: 50%;margin-left: -.31rem;bottom: 8%; overflow: hidden;}
.mouse i{display: block; margin: .38rem auto 0; width: .34rem; height: .2rem; background: url('../imgs/mouse-down.png') no-repeat center / cover; -webkit-animation: downJump 2s linear infinite;animation: downJump 2s linear infinite;}
@-webkit-keyframes downJump {0% {-webkit-transform: translateY(0);transform: translateY(0);}50% {-webkit-transform: translateY(.12rem);transform: translateY(.12rem);}100% {-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes downJump {0%{-webkit-transform: translateY(0);transform: translateY(0);}50% {-webkit-transform: translateY(.12rem);transform: translateY(.12rem);}100% {-webkit-transform: translateY(0);transform: translateY(0);}} 
.title{font-size: .4rem; font-weight: bold;}
.more{line-height: .88rem; display: inline-block; padding: 0 .85rem; border-radius: .44rem; border: 1px solid #797978; color: #000; font-size: .28rem;}
.about-us{width: 4.01rem;height: .67rem;display: block;margin: 0 auto;}
.about-text{color: #4e5259; line-height: .5rem; width: 5.56rem; text-align: justify; margin: .4rem auto;}
.about-rem{width: 7.5rem;height: 6.94rem; display: block; position: absolute; bottom: 0; left: 0; z-index: 1;}
.pg{width: 6.62rem;height: .68rem;display: block;margin:0 auto;}
.product-list{margin: .4rem auto 0;}
.product-list li{position: relative; display: none;}
.product-list .on{display: block;}
.product-img{width: 6.84rem; height: 3.84rem; border: .09rem solid #ffd71f;}
.product-img .character{position: absolute; right: -.3rem; top: -.92rem; width: 6.3rem; height: 6.14rem; -webkit-animation: fadeInLeft .8s forwards; animation: fadeInLeft .8s forwards;}
.product-info{padding-top: .4rem; min-height: 4rem; position: relative;}
.product-info .en{font-size: .58rem; font-weight: bold; line-height: 1; text-transform: uppercase; letter-spacing: -2px;}
.product-info .en2{font-size: .3rem; color: #b1b1b1; line-height: 1; letter-spacing: -1px;}
.product-info .game-name{font-size: .4rem; font-weight: bold;}
.product-info .more{margin-top: .3rem;}
.game-ico{position: absolute;bottom: .6rem; width: 7rem; left: 50%; margin-left: -3.5rem; z-index: 10; display: flex;justify-content: space-between;align-items: center;}
.game-next{ width: .48rem; height: .48rem; background: #ffd71f url('../imgs/next.png') no-repeat center / .14rem auto; border: 2px solid #fff; border-radius: 50%;cursor: pointer;}
.game-ico-list{width: 6.34rem;margin: 0;}
.game-ico-list .swiper-slide{width: 1.12rem;height: 1.12rem;border-radius:.2rem;overflow: hidden;border: .09rem solid transparent;}
.game-ico-list .swiper-slide-active {border-color:#f5c05a;}
@-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}}

.join-us{width: 3.53rem;height: .68rem;display: block;margin: 0 auto;}
.join-text{margin: .3rem 0 .44rem;}
.join-list{overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; width: 7.26rem; height: 6.1rem; margin: .4rem 0 0 .24rem; padding-right: .1rem;}
.join-list li{width: 3.34rem; margin-right: .04rem;user-select: none;display: inline-block;}
.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, .7);-webkit-transition: all .2s linear;transition: all .2s linear;} */
.join-list .join-txt{height: .8rem; background: #d3d3d2; font-size: .3rem; font-weight: bold; color: #fff; display: flex; align-items: center; justify-content: center;-webkit-transition: all .2s linear;transition: all .2s linear;}
/* .join-list li:hover .join-img::after{opacity: 0;}
.join-list li:hover .join-txt{background: #d3d3d2;} */
.news-en{width: 2.27rem;height: .68rem;display: block;margin: 0 auto;}

.news-top{margin: .4rem auto 0; width: 7rem; text-align: left;}
.news-img{border: .1rem solid #ffd71f;display: block; margin-bottom: .263rem;}
.news-tit{font-weight: bold;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; word-wrap: break-word;}
.news-txt{color: #4e5259; line-height: .6rem; max-height: 1.2rem; overflow: hidden;}
.news-list{margin: .5rem 0 .9rem; text-align: left; padding:0 .2rem; width: 7.5rem; box-sizing: border-box; overflow-x: auto;-webkit-overflow-scrolling: touch; white-space: nowrap;}
.news-item{width: 2.68rem; border: 1px solid #848484; padding: .15rem .3rem; box-sizing: border-box; background: #fff;display: inline-block; margin-right: .04rem;}
.news-item .time{color: #ffd71f;}
.news-item .text{white-space: normal;line-height: .42rem;height: .84rem;position: relative;text-align: justify;overflow:hidden;}
.news-item .text::before{content: ''; position: absolute; bottom: .04rem; right: 0; background: #ffd71f url('../imgs/arrow-right.png') no-repeat center / .08rem auto; border-radius: 50%; width: .34rem; height: .34rem;}
.foot{background: #141724;height: 3.8rem;}
.en .join-list .join-txt{font-size: .23rem;}
.en .news-item .text{text-align: left;}