@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,figure{margin:0;padding:0}fieldset,img{border:0}:focus{outline:0}address,caption,cite,code,dfn,em,th,var,optgroup{font-style:normal;font-weight:normal}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}abbr,acronym{border:0;font-variant:normal}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}code,kbd,samp,tt{font-size:100%}input,button,textarea,select{*font-size:100%}body{line-height:1.5}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}caption,th{text-align:left}sup,sub{font-size:100%;vertical-align:baseline}:link,:visited ,ins{text-decoration:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
.clearfix{margin-right:auto;margin-left:auto;*zoom:1}.clearfix:before,.clearfix:after{display:table;content:"";line-height:0}.clearfix:after{clear:both}
b,em,i{font-style:normal;}
html,body{width:100%;}
a{color:#333;text-decoration:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
body{margin:0;font-family:"Microsoft Yahei",Arial,Tahoma,Helvetica,"SimSun","Hiragino Sans GB",sans-serif;font-size:12px;line-height:1.5;position:relative;color:#333;background:#F4F5F5;height:100%;}
button,input,select,textarea,th{background:#fff;font-size:12px;line-height:1;font-family:"Microsoft Yahei",Arial,Tahoma,Helvetica,"SimSun";}
input[type="submit"],input[type="reset"],input[type="password"],input[type="button"],input[type="text"],button{-webkit-appearance:none;}/*取消苹果渲染*/
*{-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-moz-text-size-adjust:none;-webkit-text-size-adjust: none;-ms-text-size-adjust: none;}
html {font-size:100px;}
body {font-size:.24rem;}
.h10{width:100%;height:.1rem;background-color: #F4F5F5 }
.bg{background:#fff;}
.flex_grow{-moz-flex-grow:1;flex-grow:1;}
.wrap{width:100%;max-width:7.5rem;min-width:3.2rem;margin:0 auto;overflow: hidden;position: relative;}
.hide{display: none;}
.flex{display: flex;}
.hidden{display: none!important;}
.auto { height: auto!important; }
.hidden { max-height: 12rem; overflow: hidden; }
.icon{display: inline-block;background-image: url(../images/m_icon.png);background-size: 5rem 5rem;}
.h30{width:100%;height:.3rem;background-color: #F4F5F5}
/*----------------------------------- 公共 头部 --------------------------------*/
/*
header{height: .89rem;padding-bottom: .1rem;background-color: #fff;}
header>a{display: block;float: left;width: 2.2rem;margin: .2rem .08rem 0 .1rem;}
header>a img{width: 2.2rem;}
header>span{width: .96rem;height: 1rem;float: right;text-align: center;line-height: 1rem;display: block;}
header>span i{background-position: -.17rem -1.54rem !important;width: .55rem;height: .55rem;position: relative;top: .19rem;}
header>div{display: none; width: 100%;max-width: 7.5rem;position: absolute;top: .9rem;left: 50%;margin-left: -3.75rem;z-index: 98;}
header .Nav{display: flex;justify-content: space-between;flex-wrap: wrap;padding: 0rem .26rem;padding-bottom: .1rem;background-color: #fff;border-bottom: 1px solid #e6e6e6;}
.Nav a{display: block;width: .94rem;height: 1rem;padding-top: .2rem;color: #424242;line-height: .56rem;font-size: .3rem;border-radius: .1rem;text-align: center;}
.Nav a i{display: block;width: .52rem;height: .52rem;margin: 0 auto;}
.Nav a:nth-of-type(1) i{background-position: -.13rem -2.6rem;}
.Nav a:nth-of-type(2) i{background-position:  -1rem -2.6rem;}
.Nav a:nth-of-type(3) i{background-position:  -1.95rem -2.6rem;}
.Nav a:nth-of-type(4) i{background-position:  -2.95rem -2.6rem;}*/
header{height: .696rem;background-color: #fff;border-bottom: 1px solid #d8dfe3;padding: .1rem .26rem;}
header > a{display: block;float: left;width: 2.2rem;}
header > a > img{width: 2.2rem;}
header > div{width: 0.6rem;float: right}
header > div > i{display: block;width: .6rem;height: .52rem;background-position: -.1rem -3.45rem;position: relative;top: 0.05rem;}

/*header > div{width: 3.5rem;height: 0.48rem;background-color:#f2f2f2;float: right;border-radius: 0.4rem;overflow: hidden;position: relative;margin-top: .1rem;}
header > div input[type='text']{line-height: .48rem;width: 85%;padding-left: 2%;border: none;background-color: rgba(213, 209, 209, 0.2)
}
header > div i{height: .28rem;width: .29rem;background-position: -.1rem -.1rem;position: relative;top: .05rem;}*/
nav{background-color:#fff;height: .89rem;}
nav > ul{overflow-x: auto;white-space: nowrap;}
nav > ul li{display: inline-block;height: .89rem;line-height: .89rem;color: #666;text-align: center;width: 1.7rem;font-size: .31rem;box-sizing: border-box;border-bottom: 0.08rem solid transparent;}
nav > ul li a{display: block;width: 100%;height: 100%;}
nav > ul li.current{border-bottom-color: #209bf7}

.headNav{position: fixed;z-index: 100;top: 0;left: 0;max-width: 15rem;height: 100vh;padding: .24rem;background: #FFF;padding-top: 0;}
.hdv-log{display: flex;align-items: center;height: 1rem;text-align: center;}
.hdv-log>a{display: block;}
.hdv-log>a img{display: block;height: .52rem;}
.hdv-log>p{flex: 1;font-size: .28rem;color: #111;font-weight: bold;}
.hdv-log>i{display: block;width: .28rem;height: .28rem;background-position: -.16rem -4.1rem;}
.hdv-list ul{overflow: hidden;}
.hdv-list ul li{float: left;width: 25%;text-align: center;}
.hdv-list ul li a{display: block;width: 90%;height: .48rem;font-size: .24rem; border: 1px solid #d5d5d5;border-radius: .04rem;color: #333;line-height: .48rem;margin: .2rem .08rem;}
.hdv-list ul li.on a{background: #209bf7;color: #fff;border-color:#209bf7;}
.hdv-list span{display: block;font-size: .24rem; width: 3.6rem;height: .52rem;background: #209bf7;border-radius: .26rem;color: #fff;line-height: .52rem;text-align: center;margin: .5rem auto 0;}
.ingame{position: relative;margin-top: .2rem;}
.ingame>p{font-size: .28rem;color: #333;font-weight: 600;line-height: .32rem;position: relative;z-index: 3;}
.ingame>a{display: block;float: left;width: 1.55rem;text-align: center;height: 0.48rem;font-size: .24rem;border: 1px solid #d5d5d5;border-radius: 0.04rem;color: #333;line-height: .44rem;margin: 0.2rem 0.08rem;}

/*----------------------------------- 公共 底部 --------------------------------*/
footer{padding-top: .2rem;padding-bottom:.2rem;background-color: #eee;}
footer > a:nth-child(1){display: block;width: 2.63rem;height: .8rem;margin: 0 auto .12rem;}
footer > a:nth-child(1) img{width: 2.63rem;height: .8rem;display: block;}
footer > p{text-align: center;height: 0.48rem;line-height: 0.48rem;color: #999999;font-size: 0.21rem;}


/*----------------------------------- 公共  --------------------------------*/
.wraper{width: 100%;min-width: 3.2rem;max-width: 7.5rem;margin: 0 auto;overflow: hidden;}

.pages{justify-content:space-between;-webkit-justify-content:space-between;padding: .2rem .24rem .3rem}
.pages a,.pages span{width:1rem;height:.58rem;line-height:.58rem;text-align:center;font-size:.22rem;color:#454545;border-radius:.06rem;background-color:#fff;}
.pages .current{color:#fff;font-size:.22rem;background:#209bf7;}
.pages .disabled{background:#ececec;color:#b1b1b1;}
.pages .ico_l{width: .18rem;height: .32rem;background-position: -1.65rem -.75rem;position: relative;top: .12rem;left: .2rem;display: block;}
.pages .ico_r{width: .18rem;height: .32rem;background-position: -2.03rem -.75rem;position: relative;top: .12rem;left: .2rem;display: block;}
.pages a:first-child,.pages a:last-child{width: 1rem;}

.crumb{height: .65rem;}
.crumb i{width: .22rem;height: .27rem;background-position: -1.07rem -.1rem;margin: .16rem .12rem 0 .29rem;float: left;}
.crumb p{float:left;display: inline-block;max-width: 5rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;color: #999;font-size: .25rem;line-height: .65rem;}

/*----------------------------------- 游戏列表 --------------------------------*/
.List{width: 100%;background-color: #F4F5F5;background-size: 100% 100%;}
.list-tit{height: .52rem;line-height: .52rem;padding: .2rem .24rem;}
.list-tit > p{display: inline-block;height: .52rem;font-size: .32rem;font-weight: bold;overflow: hidden;text-overflow: ellipsis;}
.list-tit > span{float: right;color: #aaa;font-size: .22rem;}

.game-nav{background-color: #fff;border-radius: 0.2rem;margin: 0 .24rem;padding: 0.2rem .12rem;margin-bottom: 0.2rem;}
.game-nav ul{height: 1.63rem;overflow: hidden;}
.game-nav ul li{width: 1.45rem;border-radius: 0.1rem;float: left;overflow: hidden;margin: 0.08rem 0.1rem;color: #000;background: #fff;font-size: .28rem;text-align: center;height: 0.64rem;line-height: .64rem;border: 0.02rem solid #dcdcdc;}
.game-nav ul li[data-none="1"]{display: none !important;}
.game-nav ul li.on{border-color: #209bf7;background: #209bf7;}
.game-nav ul li > a{display: block;}
.game-nav ul li > a > p{line-height: .65rem;}
.game-nav ul li.on>a{color: #fff;}

.game-list{width: 6.54rem;background-color: #fff;border-radius: .4rem;margin: 0 auto;padding: .2rem .24rem 0;margin-bottom: .2rem;}
.game-list > ul{}

.game-list ul li{padding: .3rem 0;border-bottom: .02rem solid #e2eaed;position: relative;}
.game-list ul li:first-child{padding-top: 0;}
.game-list ul li > i{position: absolute;left: 0;width: .81rem;height: .81rem;background-position: -.1rem -1.26rem;}
.game-list ul li:first-child > i{}
.game-list ul li > a{display: block;width: 100%;height: 1.3rem;}
.game-list ul li > a > img{width: 1.3rem;height: 1.3rem;border-radius: .28rem;margin-right: .24rem;float: left;}
.game-list ul li > a > div{float: left;width: 3.75rem;white-space: nowrap;overflow: hidden;}
.game-list ul li > a > div > p{font-size: .24rem;height: .4rem;line-height: .4rem;color: #999;}
.game-list ul li > a > div > p:nth-child(1){height: .55rem;line-height: .55rem;font-size: .28rem;color: #333;font-weight: bold;}
.game-list ul li > a > span{display: block;float: left;width: 1.2rem;height: .62rem;line-height: .62rem;border: 1px solid #209bf7;border-radius: .1rem;font-size: .26rem;color:#209bf7;text-align: center;margin-top: .33rem;}


/*----------------------------------- 专题列表 --------------------------------*/
.top-slider{width: 7.02rem;height: 2.9rem;margin: 0 auto; border-radius: .2rem;}
.top-slider .swiper-slide{}
.top-slider .swiper-slide > a{display: block;width: 100%;height: 100%;position: relative;}
.top-slider .swiper-slide > a img{width: 7.02rem;height: auto;min-height: 2.9rem;border-radius: .2rem;}
.top-slider .swiper-slide > a p{font-size: .32rem;color: #fff;width: 7.02rem;position: absolute;background-color: rgba(173, 171, 171, 0.6);top: 1rem;height:.7rem;line-height:.7rem;text-align: center;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.top-slider .swiper-pagination{position: absolute;bottom: .25rem !important;left: auto !important;right: .3rem;text-align: right;width: 50% !important;}
.top-slider .swiper-pagination-bullet{width: .06rem;height: .06rem;background-color: #fff;opacity: 0.5;border-radius: .03rem;}
.top-slider .swiper-pagination-bullet-active{width: .17rem;opacity: 1;}
.top-slider .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 .015rem;}

.Title{padding: .2rem .24rem;height: .52rem;line-height: .52rem;font-size: .32rem;color: #333;font-weight: bold;}
.Title:before{content: '';width: .16rem;height: .16rem;background: linear-gradient(90deg, #209bf7 0%, #5faeef 100%);border-radius: 50%;display:inline-block;margin-right: .05rem;}
.zt-list,.gl-list{position: relative;width: 7.02rem;margin: auto;border-radius: 0.4rem;background-color: #fff;padding: 0.08rem 0;overflow: hidden;margin-top: .2rem;}
.zt-list > ul{padding: 0 .24rem;}
.zt-list > ul li{width: 3.17rem;height:2.75rem;display: block;float: left;border-radius: 0.2rem;background: #fff;box-shadow: 0 0.08rem 0.5rem 0 rgb(170 170 170 / 20%);margin-right: 0.2rem;margin-bottom: 0.4rem;}
.zt-list > ul li:nth-child(2n){margin-right: 0;}
.zt-list > ul li a{display: block;}
.zt-list > ul li a img{width: 3.18rem;height: 1.78rem;display: block;border-radius: 0.2rem 0.2rem 0 0;}
.zt-list > ul li a > p{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.zt-list > ul li a > p:nth-child(2){font-size: .28rem;height: .3rem;line-height: .3rem;font-weight: bold;color: #333;margin: .14rem .2rem .1rem;}
.zt-list > ul li a > p:nth-child(3){font-size: .22rem;color: #aaa;line-height: .24rem;margin-left: 0.2rem;}
/*----------------------------------- 攻略列表 --------------------------------*/
.gl-list{}
.gl-list > ul{padding:0 .24rem;}
.gl-list > ul li{position: relative;height: 1.5rem;padding-bottom: 0.2rem;margin-top: 0.2rem;border-bottom: 0.01rem solid #ccc;}
.gl-list > ul li:first-child{margin-top: 0;}
.gl-list > ul li:last-child{border: 0;}
.gl-list > ul li a{display: block;}
.gl-list > ul li a img{width: 2.68rem;height: 1.5rem;display: block;float: left;border-radius: 0.08rem;margin-right: .3rem;}
.gl-list > ul li a > div{width: 3.55rem;height: 1.5rem;float: left;}
.gl-list > ul li a > div > p{font-size: .28rem;font-weight: 600;color: #333;line-height: .42rem;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.gl-list > ul li a > div > span{position: absolute;bottom: 0.12rem;font-size: .22rem;color: #aaa;display: block;text-align: left;white-space: nowrap;overflow: hidden;}

/*----------------------------------- 专题内容 --------------------------------*/
.zt-header{width: 7.02rem;border-radius: .4rem;background-color: transparent;max-height: 7.3rem;margin: 2.1rem auto .3rem;}
.zt-header > div{position: relative;box-shadow: 0 -1.2rem 0.8rem 0 rgb(47 87 102 / 20%);padding: 2.14rem 0.3rem 0.2rem;border-radius: 0.4rem;background-color: #fff;}
.zt-header > div > div:nth-child(1){position: absolute;top: -2rem;z-index: 2;width: 6.42rem;height: 3.95rem;margin: auto;overflow: hidden;border-radius: 0.4rem;}
.zt-header > div > div:nth-child(1) > img{width: 6.42rem;min-height: 3.95rem;height: auto;}
.zt-header > div > div:nth-child(1) > div{height: 1.2rem;width: 100%;position: absolute;bottom: 0;background-color: rgba(0,0,0,0.5);}
.zt-header > div > div:nth-child(1) > div h1{font-size: .32rem;font-weight: bold;color: #fff;text-align: center;line-height: .66rem;height: .66rem;}
.zt-header > div > div:nth-child(1) > div span{font-size: .24rem;color: #fff;display: block;text-align: center;height: .4rem;line-height: .4rem;}
.zt-header > div > div:nth-child(2){height: 1.2rem;font-size: .26rem;color: #666;line-height: .4rem;overflow-y: auto;}

.hot-zt{}
.hot-zt ul{overflow-x: auto;display: flex;margin-bottom: .2rem;}
.hot-zt ul li{position: relative;margin-left: .3rem;width: 4.9rem;height: 3.36rem;float: left;display: block;}
.hot-zt ul li:nth-child(1){margin-left: .24rem;}
.hot-zt ul li img{width: 4.9rem;height: 2.76rem;border-radius: .1rem;}
.hot-zt ul li .info{position: absolute;top: 1.36rem;left: .37rem;background: #fff;width: 4.16rem;height: 2rem;border-radius: .2rem;box-shadow: 0px 8px 50px 0px rgba(170, 170, 170, 0.2);display: block;}
.hot-zt ul li .info p:nth-child(1){font-size: .3rem;font-weight: 600;color: #333;line-height: .32rem;margin: .28rem .24rem 0;white-space: nowrap;overflow: hidden;}
.hot-zt ul li .info p:nth-child(2){font-size: .22rem;color: #aaa;line-height: .36rem;margin-left: .24rem;margin-top: .08rem;margin-bottom: .06rem;}
.hot-zt ul li .info p:nth-child(2) i{width: .2rem;height: .2rem;display: inline-block;background-position: -1.1rem -.51rem;margin-right: .08rem;}
.hot-zt ul li .info p:nth-child(3){font-size: .24rem;color: #666;line-height: .36rem;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;margin: 0 .24rem;}


/*----------------------------------- 攻略内容 --------------------------------*/
.gl-tit{width: 7.02rem;margin: 0 auto .3rem;background-color: #fff;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);border-radius: .2rem;position: relative;padding: .3rem 0;}
.gl-tit > h1{font-size: .32rem;color: #333;line-height: .42rem;font-weight: 700;text-align: center;}
.gl-tit > p{text-align: center;margin-top: 0.24rem;}
.gl-tit > p span{font-size: .22rem;color: #aaa;line-height: .24rem;margin-right: 0.4rem;}
.gl-tit > p span i{width: 0.2rem;height: 0.2rem;display: inline-block;margin-right: 0.08rem;}
.gl-tit > p span:nth-child(1) i{background-position: -.57rem -1.09rem;}
.gl-tit > p span:nth-child(2) i{background-position: -.1rem -1.09rem;}
.gl-tit > p span:nth-child(3) i{background-position: -1.05rem -1.09rem;}

.gl-cont{width: 7.02rem;margin: 0 auto .3rem;background-color: #fff;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);border-radius: .2rem;position: relative;padding: .3rem;font-size: .26rem;line-height: .4rem;color: #666;overflow: hidden;box-sizing: border-box;}

.gl-cont a {color: #209bf7;line-height: .42rem;border-bottom: 1px solid #209bf7;text-indent: 0;}
.gl-cont p{margin-bottom:.16rem;}
.gl-cont img{display:block;max-width:100%;height: auto;margin:.12rem auto;}
.gl-cont h3{display:block;font-size:.26rem;line-height:.42rem;margin-bottom:.2rem;font-weight:bold;color:#454545;}
.gl-cont iframe {width: 100%;height: 3.6rem;margin: 0 auto;display: block;border: none;}
.gl-cont table{width: 100% !important; margin-bottom: .2rem;}
.gl-cont table a{border-bottom: none;}
.gl-cont strong{ font-weight: bold;}
.gl-cont video{display: block;position: relative;width: 100%;height:auto;margin: .1rem auto;}

.news_relate_game{overflow: hidden;margin: 0.3rem 0.24rem;background: #fff;border-radius: 0.2rem;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);padding: 0.26rem 0;}
.news_relate_game img{width: 1.28rem;height: 1.28rem;display: block;float: left;border-radius: .3rem;margin-left: .28rem;}
.news_relate_game a > div{float: left;width: 3.5rem;margin-left: .2rem;}
.news_relate_game a > div p:nth-child(1){font-size: .28rem;color: #333;font-weight: 600;white-space: nowrap;overflow: hidden;line-height: .4rem;margin-top: .08rem;}
.news_relate_game a > div p:nth-child(2){font-size: .24rem;color: #aaa;line-height: .4rem;}
.news_relate_game a > div p:nth-child(3){font-size: .24rem;color: #666;line-height: .4rem;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.news_relate_game span{float: right;width: 1.18rem;height: .6rem;border: .01rem solid #209bf7;text-align: center;line-height: .6rem;border-radius: .1rem;display: block;color: #209bf7;font-size: .26rem;margin-top: .34rem;margin-right: .34rem;}
.news_relate_game span.no_down{border-color: #f98700;color: #f98700;}

.news-game{margin: .3rem .24rem .3rem;overflow: hidden;background: #fff;border-radius: 0.2rem;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);padding-bottom: .26rem;}
.news-game > ul{margin: 0 .24rem;}
.news-game ul li{width: 1.485rem;float: left;overflow: hidden;margin-right: .2rem;}
.news-game ul li:nth-child(4n){margin-right: 0;}
.news-game ul li img{width: 1.2rem;height: 1.2rem;display: block;border-radius: .26rem;border: .03rem solid #fff;}
.news-game ul li p{font-size: .28rem;line-height: .48rem;white-space: nowrap;overflow: hidden;text-align: center;margin-top: .06rem;color: #333;text-overflow: ellipsis;}
.news-game ul li span{display: block;width: 1.18rem;height: .6rem;border: .01rem solid #209bf7;border-radius: .1rem;line-height: .6rem;text-align: center;color: #209bf7;margin: .1rem auto 0;}
.news-game ul li span.no_down{border-color: #f98700;color: #f98700;}

/*----------------------------------- 游戏内容 --------------------------------*/
.game-tit{position: relative;padding: 0 0.24rem;margin: 0.51rem 0 .3rem;}
/*.game-tit::after{content: '';position: absolute;z-index: 1;top: 0.2rem;left: 0;right: 0;margin: auto;width: 6.46rem;height: 100%;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 21%);background-color: rgba(255,255,255,.5);border-radius: 0.3rem;}*/
.game-tit > div{padding-bottom: 0.2rem;position: relative;z-index: 2;top: 0;left: 0;right: 0;margin: auto;width: 7.02rem;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);background-color: rgba(255,255,255,.9);border-radius: 0.2rem;text-align: center;}
.game-tit > div > img{position: relative;top: -0.4rem;display: block;margin: auto;width: 1.8rem;height: 1.8rem;box-shadow: 0 0.2rem 0.26rem 0 rgb(150 236 249 / 40%);border-radius: 0.4rem;}
.game-tit > div > h1{position: relative;top: -0.13rem;margin: auto;display: block;font-size: .36rem;color: #1B323B;font-weight: bold;line-height: .5rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;text-align: center;}
.game-tit > div > p:nth-child(3){padding: 0 0.3rem;margin: 0.02rem 0 0.24rem;justify-content: space-around;display: flex;}
.game-tit > div > p:nth-child(3) > span{font-size: .26rem;color: #999;line-height: .4rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.game-tit > div > p:nth-child(3) > span em{color: #333;}
.game-tit > div > div:nth-child(4){display: flex;flex-wrap: wrap;justify-content: center;width: 7.18rem;}



.down-btn > span,.down-btn > a{color: #fff;font-size: .35rem;letter-spacing: .02rem;border-radius: .5rem;display: block;height: .8rem;line-height: .8rem;text-align: center;width: 5.6rem;margin: .2rem auto;background: linear-gradient(134deg,#4df8e1,#23A0FD);font-weight: bold;}
.down-btn > span i,.down-btn > a i{width: .4rem;height: .4rem;margin-right: .2rem;position: relative;top: .058rem;}
.down-btn > span.and,.down-btn > a.and{background: linear-gradient(134deg,#9cdd7b,#75b25d);}
.down-btn > span.ios,.down-btn > a.ios{background: linear-gradient(134deg,#b0d4ff,#2E95FF);}
.down-btn > span.order{background: linear-gradient(134deg,#f3a183,#ec6f66);}
.down-btn > span.and i,.down-btn > a.and i{background-position: -.1rem -.52rem;}
.down-btn > span.ios i,.down-btn > a.ios i{background-position: -.65rem -.52rem;}

.down-btn > span.none{background: #8f8a84;}
.noGm{padding: .12rem .4rem;text-align: left;}
.noGm i{display: inline-block; margin-right: .1rem; width: .3rem;height: .3rem;border-radius: 50%;background: red;color: #fff;text-align: center;}


.game-cont,.cnxh,.game-info{margin: 0 auto 0.3rem;width: 7.02rem;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);background-color: rgba(255,255,255,.9);border-radius: 0.2rem;}
.game-cont{position: relative;z-index: 1;padding-bottom: 0.2rem;}

.game-cont-nav{display: flex;justify-content: space-around;margin-bottom: 0.2rem;}
.game-cont-nav > span{position: relative;display: block;height: 0.88rem;line-height: .88rem;font-size: .32rem;color: #666;}
.game-cont-nav > span.current:after{content: '';position: absolute;bottom: 0;left: 0;right: 0;margin: auto;width: 100%;height: 0.08rem;background-color: #209bf7;}

.bjdp{position: relative;padding-left: 1.5rem;margin: auto;margin-bottom: 0.05rem;width: 5.12rem;height: 0.76rem;line-height: .76rem;font-size: .24rem;color: #666;background-color: #FFF5E9;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.bjdp::before{content: '';position: absolute;top: 0.22rem;left: 0.2rem;width: 1.1rem;height: 0.32rem;background-image: url(../images/m_icon.png);background-size: 5rem 5rem;background-position: -1.5rem -.1rem;}
.showImg{}
.showImg > .showImg-box{padding: .05rem 0 0 .24rem;}
.showImg > .showImg-box ul{    overflow-x: auto;padding: 0 0 0.1rem;overflow-y: hidden;white-space: nowrap;}
.showImg > .showImg-box ul li{margin-right: 0.2rem;display: inline-block;}
.showImg > .showImg-box ul li > img{width: auto;height: 100%;max-height: 4.6rem;border-radius: 0.2rem;}


.game-cont-box {overflow: hidden;}
.game-cont-box .cont{font-size:.26rem;line-height:.42rem;color:#666;padding: 0 .24rem;}
.game-cont-box .cont a {color: #209bf7;display: inline-block;line-height: .42rem;border-bottom: 1px solid #209bf7;text-indent: 0;}
.game-cont-box .cont p{margin-bottom:.16rem;}
.game-cont-box .cont img{display:block;max-width: 6.3rem;max-height:5rem;margin:.1rem auto;}
.game-cont-box .cont br:last-child{display: none;}
.game-cont-box .cont h3{font-size:.3rem;color:#209bf7;height: .6rem;line-height: .6rem;font-weight:700;margin:.1rem 0;border: 0;}
.game-cont-box .cont h3:before{content: '';display: inline-block;width: .1rem;height: .1rem;background-color: #209bf7;transform: rotate(45deg);vertical-align: middle;margin-right: .16rem;}
.game-cont-box .cont h3:after{content: '';display: inline-block;width: .1rem;height: .1rem;background-color: #209bf7;transform: rotate(45deg);vertical-align: middle;margin-left: .16rem;}
.game-cont-box .cont iframe {width: 100%;height: 3.6rem;margin: 0 auto;display: block;border: none;}
.game-cont-box .cont table{width: 100% !important;border-color: #d9d9d9;}
.game-cont-box .cont table a{border-bottom: none;}
.game-cont-box .cont strong{font-weight: bold;}

.game-info{position: relative;}
.game-info ul{display: flex;justify-content: space-between;flex-wrap: wrap;padding: 0 0.48rem 0.12rem;}
.game-info ul li{width: 50%;line-height: .42rem;margin-bottom: .2rem;overflow: hidden;}
.game-info ul span,.game-info ul em{display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.game-info ul p{font-size: .22rem;color: #999;}
.game-info ul em{font-size: .26rem;color: #333;}
.game-info ul em.qx{color: #209bf7;}

.cnxh{}
.cnxh > div.tabMenu::-webkit-scrollbar {display:none}
.cnxh > div.tabMenu{white-space: nowrap;overflow-x: auto;margin-left: .3rem;}
.cnxh > div.tabMenu > span{display: inline-block;height: .5rem;line-height: .5rem;min-width: .6rem;font-size: .26rem;color: #666;margin-right: .2rem;padding: 0 .5rem;text-align: center;}
.cnxh > div.tabMenu > span.current{color: #209bf7;border-bottom: .03rem solid #209bf7;}

.cnxh > div.tabCont{padding: .1rem .24rem 0;}

.cnxh > div.tabCont > div{display: none;}
.cnxh > div.tabCont > div:first-child{display: block;}

.cnxh > div.tabCont > div > a{display: block;background-color: #f0f9fa;border-radius: .1rem;width: 100%;height: 2.1rem;margin-bottom: .3rem;}
.cnxh > div.tabCont > div > a > img{width: 3rem;height: 2.1rem;border-radius: 0.06rem 0 0 0.06rem;margin-right: 0.24rem;float: left;}
.cnxh > div.tabCont > div > a > div{float: left;width: 3.3rem;}
.cnxh > div.tabCont > div > a > div > p:nth-child(1){font-size: .28rem;color: #333;line-height: .62rem;font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;margin: 0.05rem;}
.cnxh > div.tabCont > div > a > div > p:nth-child(2){font-size: .26rem;color: #666;line-height: .4rem;height: 1.2rem;display: block;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}

.cnxh > div.tabCont > div > ul{}
.cnxh > div.tabCont > div > ul li{display: inline-block;width:1.57rem;margin-bottom: .15rem;}
.cnxh > div.tabCont > div > ul li > a{display: block;}
.cnxh > div.tabCont > div > ul li > a img{display: block;width: 1.28rem;height: 1.28rem;border-radius: .3rem;margin: auto;}
.cnxh > div.tabCont > div > ul li p{display: block;width: 80%;font-size: .28rem;color: #333;line-height: .62rem;margin: auto;overflow: hidden;white-space: nowrap;text-align: center;}
.cnxh > div.tabCont > div > ul li span{display: block;width: 1.18rem;height: 0.6rem;border: 0.01rem solid #209bf7;border-radius: 0.1rem;line-height: .6rem;text-align: center;color: #fff;margin:0 auto;background-color: #209bf7;}

/* 预约 */
.orderList{position: fixed;top: 0;left: 0;right: 0;bottom: 0;margin: auto;z-index: 10;width: 100%;height: 100%;background-color: rgba(0,0,0,.6);}
.oOrder{background: #fff;border-radius: .3rem;}
.orderBox{position: absolute;z-index: 5;top: 3.94rem;left: 0;right: 0;margin: auto;background: #fff;width: 5.7rem;border-radius: .12rem;text-align: center;}
.orderBox .oClose{position: absolute;bottom: -1.48rem;right: 44%;z-index: 10;}
.orderBox .oClose .mclose{background: url(../images/mclose.png) no-repeat;background-size: .66rem .66rem;display: block;height: .66rem;width: .66rem;}
.orderBox .oTitle{width: 100%;text-align: center;font-size: .34rem;color: #fff;}
.orderBox .oTitle p:nth-child(1){margin-top: 1.2rem;font-size: .32rem;color: #333;white-space: nowrap;overflow: hidden;font-weight: 600;position: relative;z-index: 3;}
.orderBox form .tel{width:4.48rem;border:1px solid #dadada;background: rgba(33, 33, 33, .1);color:#999;font-size:.28rem;border-radius:.08rem;padding:0 .26rem;line-height: .82rem;margin: .3rem auto .06rem;overflow: hidden;white-space: nowrap;}
.orderBox form span{display: block;color:#ccc;font-size:.24rem;line-height: .4rem;overflow: hidden;white-space: nowrap;}
.orderBox form .oBtn{width: 5rem;border: 0;background-color: #184C42;color:#fff;font-size: .32rem;border-radius: .1rem;line-height: .86rem;margin: .4rem auto .64rem;font-weight: 600;overflow: hidden;white-space: nowrap;}
.orderBox .msg{color: #fe684d;font-size: .18rem;text-align: left;display: block;width:5.6rem;margin: 0 auto;}
.orderBox .oKnow{display: block;width: 5rem;height: .88rem;border: 0;background-color: #184C42;color:#fff;font-size:.32rem;border-radius: .1rem;line-height: .88rem;margin: .6rem auto 0rem;overflow: hidden;font-weight: 600;white-space: nowrap;}

.orderBox .oWin{width: 100%;font-size: .36rem;border-radius: .12rem;text-align: center;background: linear-gradient(0deg, #FDFFEF 0%, #FFFFFF 100%);padding-bottom: .5rem;}
.orderBox .oWin p:nth-child(2){font-size:.38rem;color: #333333;font-weight: 600;line-height: .38rem;margin-top: 1.3rem;}
.orderBox .oWin p:nth-child(2) .cgbg{display: inline-block;width: 1.5rem;height: .95rem;vertical-align: middle;margin-right: .14rem;background-position: -2.85rem -.1rem;}
.orderBox .oWin p:nth-child(3){font-size: .24rem;color: #999999;line-height: .24rem;margin-top: .28rem;}
.orderBox .oWin p span{color: #209bf7;}
.orderBox .oWin p:nth-child(4){font-size: .24rem;color: #999999;line-height: .24rem;margin-top: .24rem;}

.orderBox .oLose{width: 100%;height: 4.6rem;padding: .52rem 0;font-size: .36rem;border-radius: .12rem;text-align: center;}
.orderBox .oLose>p{font-size:.32rem;color: #141414;font-weight: 500;line-height: .86rem;margin-bottom: .2rem;margin-top: 1.2rem;}

.orderBox .oAgin{width: 100%;height: 4.6rem;padding: .52rem 0;font-size: .36rem;border-radius: .12rem;text-align: center;}
.orderBox .oAgin>p{font-size:.32rem;color: #141414;font-weight: 500;line-height: .86rem;margin-bottom: .2rem;margin-top: 1.2rem;}

.order{margin-top: 0.2rem; border: none;display: inline-block; width: 100%; height: 0.72rem; line-height: 0.72rem; text-align: center; font-size: 0.24rem; color: #fff; border-radius: 0.08rem;background: linear-gradient(to right, #0ed2d0, #01d5b1);}

.orderBox .oTitle i{display:block;width: .59rem;height: .58rem;background-position:-.56rem 0rem ;position: relative;top: .42rem;margin: 0 auto;}
.orderBox .oWin i{display:inline-block;width: 3.34rem;height: 2.01rem;background-position:-1.64rem 0rem ;position: relative;}
.orderBox .oLose i{display:inline-block;width: 3.34rem;height: 2.01rem;background-position: -1.64rem -4.2rem;position: relative;}
.orderBox .oAgin i{display:inline-block;width: 3.34rem;height: 2.01rem;background-position: -1.5rem -2.1rem;position: relative;}

.yxbbg{background: url(../images/ele_pop.png) no-repeat;background-size: 2.6rem 2.2rem;display: block;height: 2.2rem;width: 2.6rem;margin-left: 1.9rem;position: absolute;top: -.7rem;}
.yxbbg p{font-size: .28rem;color: #fff;position: absolute;left: 1.6rem;top: .2rem;font-weight: 600;}

/* 权限 */
.gRule{position: fixed;top: 0;left: 0;right: 0;bottom: 0;margin: auto;z-index: 10;max-width: 7.5rem;width: 100%;height: 100%;background-color: rgba(0,0,0,.62);}
.ruleBox{position: absolute;z-index: 10;top: 3rem;left: 0;right: 0;margin: auto;background: #fff;width: 5.7rem;max-height: 8.5rem;border-radius: .1rem;text-align: center;}
.ruleMain{display: block;width: 4.6rem;height: 4.8rem;border: none;padding: 0 .3rem;line-height: .42rem;font-size: .26rem;color: #666;margin: .26rem auto .46rem;overflow: auto;}
.ruleMain p{text-align: left;}
.ruleMain strong{display: block;color: #333;line-height:.52rem;font-size: .26rem; font-weight: bold;text-indent:0em;text-align: left;}
.gRule .bg{width: 2.6rem;height: 2.2rem;position: relative;background: url(../images/ele_pop.png) no-repeat;background-size: 2.6rem 2.2rem;margin-left: 1.8rem;margin-top: -.7rem;}
.gRule .bg p{font-size: .28rem;color: #fff;position: absolute;left: 1.6rem;top: .2rem;font-weight: 600;}
.ruleBox>p{color: #333;font-size: .38rem;text-align: center;font-weight: 600;margin-top: -.4rem;position: relative;z-index: 3;}
.ruleBox .rSure{position: absolute;bottom: -1.48rem;right: 44%;z-index: 10;}
.ruleBox .rSure i{background: url(../images/mclose.png) no-repeat;background-size: .66rem .66rem;display: block;height: .66rem;width: .66rem;}


.popupsIcon{background-image: url(../images/popups.png);background-size: 6.7rem 9.5rem;display: inline-block;}

.jbBtn{display:inline-block;color: #ffbe00;text-indent: .05rem;position: absolute;right: .2rem;top: .2rem;border: 1px solid #ffbe00;border-radius: .5rem;padding:.02rem .08rem;}
.jubao{display: block;width: 0.48rem;line-height: 0.26rem;padding: 0.2rem 0;position: fixed;right: 0;font-size: 0.26rem;text-align: center;top: 36%;color: #fff;z-index: 999999;background: #209bf7;border-radius: 3px;}
.art .time .jubao { padding-left: 0.1rem }
#popupsBox { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #00000050; z-index: 99; }
#popupsBox .orderBox { width: 6.5rem; margin: 3rem auto 0; border-radius: 0.2rem;background: linear-gradient(to right bottom, #5a9fff, #478dff); position: relative; }
.popupsClose { position: absolute; bottom: -0.98rem; left: 0;right: 0;margin: auto; width: 0.54rem; height: 0.54rem; background-position: -5.1rem -1rem; cursor: pointer; }
#popupsBox .orderBg { width: 4.4rem; height: 2.3rem;background-position: -0.06rem -0.1rem;position: absolute;top: -1.3rem;left: 0.6rem; }
#popupsBox .orderBg p {height: 0.4rem;line-height: 0.4rem;color: #fff;font-size: 0.26rem;font-weight: bold;margin: 1.64rem 0 0 2.2rem;}
#popupsBox .orderContent {height: 2.52rem;width: 5.76rem;background: #fff;margin: 0 auto;border-radius: 0.1rem;position: relative;overflow: hidden;}
#popupsBox .orderBg .orderContent>p { margin-top: 1.52rem; line-height: 1.24rem; font-size: 0.34rem; font-weight: bold; text-align: center; color: #404040; }
#popupsBox .orderBox .order { position: relative; width: 100%; padding: 1rem 0 0.38rem; border-radius: 0.2rem; }
#popupsBox .orderBox .order input[type=text]{ width: 4.33rem; height: 0.74rem;border: 1px solid #d8d8d8;border-radius: 0.1rem; background: #ffffff; padding-left: 0.86rem; font-size: 0.2rem; color: #cccccc; margin: 0.45rem 0 0 0.36rem; }
#popupsBox .orderBox .order .phone { position: absolute; width: 0.26rem; height: 0.4rem; top: 0.63rem; left: 0.58rem; background-position: -5.26rem -0.28rem; }
#popupsBox .orderBox .order .phone::after {content: '';position: absolute;width: 1px;height: 0.5rem;background: #e3e3e3;top: -0.06rem;right: -0.22rem;}
#popupsBox .orderBox .order .errTips { height: 0.3rem; line-height: 0.3rem; color: #209bf7; font-size: 0.2rem; margin-left: 0.38rem; }
#popupsBox .orderBox .order .msg { height: 0.36rem; line-height: 0.36rem; color: #404040; font-size: 0.22rem; text-align: center; }
#popupsBox .orderBox .order .msg em { color: #cc0000; }
#popupsBox .orderBox .order .tip { height: 0.34rem; line-height: 0.34rem; color: #cccccc; font-size: 0.2rem; text-align: center; }
#popupsBox .orderBox .order .nextBtn, #popupsBox .orderBox .orderWin .knowBtn, #popupsBox .orderBox .hasOrder .knowBtn { width: 2.68rem; height: 0.62rem; line-height: 0.62rem; text-align: center; font-size: 0.3rem; color: #fff; background: #ffc700; border-radius: 0.32rem; margin: 0.28rem auto 0; cursor: pointer; }
#popupsBox .orderBox .orderWin .knowBtn, #popupsBox .orderBox .hasOrder .knowBtn { margin-top: 0.28rem; }
#popupsBox .orderBox .orderWin, #popupsBox .orderBox .hasOrder { padding: 1rem 0 0.48rem; border-radius: 0.2rem;}
#popupsBox .orderBox .orderWin i, #popupsBox .orderBox .hasOrder i { display: block; width: 2.14rem; height: 1.26rem; background-position: -0.12rem -2.88rem; margin: 0.28rem auto 0; }
#popupsBox .orderBox .hasOrder i { width: 2.06rem; height: 1.32rem; margin-top: 0.24rem; background-position: -2.92rem -2.8rem; }
#popupsBox .orderBox .orderWin p, #popupsBox .orderBox .hasOrder p { height: 0.82rem; line-height: 0.82rem; font-size: 0.3rem; color: #14cab4; text-align: center; font-weight: bold; }
#popupsBox .orderBox .hasOrder p { color: #ffb800; }
#popupsBox .feedback, #popupsBox .permissionStatement{ width: 6.5rem; height: 9.3rem; margin: 1.4rem auto 0; background: #ffffff; border-radius: 0.1rem; position: relative; }
#popupsBox .permissionStatement .topBg {width: 6.5rem;height: 1.45rem;border-radius: 0.1rem 0.1rem 0 0;background-position: -0.05rem -7.72rem;}
#popupsBox .feedback .topBg {width: 6.5rem;height: 2.6rem;background-position: -0.1rem -4.68rem;border-radius: 0.1rem 0.1rem 0 0;position: relative;top: -0.22rem;}
#popupsBox .permissionStatement {height: 9rem;}
#popupsBox .permissionStatement .topBg p { height: 1.36rem; line-height: 1.36rem; color: #6c2e00; font-size: 0.42rem; font-weight: bold; text-align: center; }
#popupsBox .permissionStatement .state { height: 5.66rem; overflow: auto; margin: 0.24rem 0.36rem; position: relative; }
#popupsBox .permissionStatement .linear {content: "";position: absolute;bottom: 1.58rem;left: 0.32rem;width: 5.6rem;height: 0.41rem;background: linear-gradient(to top, #fff, #fff0);background: linear-gradient(to top, #fff, rgba(255,255,255,0));}
#popupsBox .privacyStatement .know, #popupsBox .permissionStatement .know { width: 3.48rem; height: 0.8rem; line-height: 0.8rem; text-align: center; font-size: 0.3rem; color: #fff; background: #f4696a; border-radius: 0.4rem; margin: 0.28rem auto 0; cursor: pointer; }
#popupsBox .permissionStatement .state::-webkit-scrollbar { width: 0.08rem;background: transparent; }
#popupsBox .permissionStatement .state::-webkit-scrollbar-thumb { background: #dfdfdf;border-radius: 0.08rem; }
#popupsBox .permissionStatement .state p { line-height: 0.44rem; font-size: 0.24rem; color: #333333; margin-right: 0.2rem; }
#popupsBox .permissionStatement .state .h3 { line-height: 0.54rem; font-size: 0.24rem; color: #333333; font-weight: bold; margin-right: 0.2rem; }
#popupsBox .feBack { height: 5rem; overflow: auto; margin: 0 0.3rem 0; }
#popupsBox .feBack::-webkit-scrollbar { width: 0.08rem;background: transparent; }
#popupsBox .feBack::-webkit-scrollbar-thumb { background: #dfdfdf;border-radius: 0.08rem; }
#popupsBox .feBack>p { height: 0.47rem; line-height: 0.47rem; font-size: 0.28rem; color: #000000; }
#popupsBox .feBack>p:nth-child(3), #popupsBox .feBack>p:nth-child(5) { height: 0.66rem; line-height: 0.66rem; }
#popupsBox .feBack .checkbox {position: relative;height: 0.63rem;line-height: 0.63rem;width: 5.2rem;}
#popupsBox .feBack .checkbox input[type='checkbox'] {position: absolute;right: 0;top: 0;width: 0.2rem;height: 0.2rem;opacity: 0;}
#popupsBox .feBack .checkbox label {position: absolute;left: 0px;top: 0;height: 0.63rem;line-height: 0.63rem;font-size: 0.24rem;color: #666666;text-align: left;padding-left: 0.48rem;}
#popupsBox .feBack .checkbox label::before {content: '';position: absolute;left: 0.02rem;top: 0.16rem;width: 0.3rem;height: 0.3rem;border: 0.01rem solid #d0d0d0;border-radius: 50%;box-sizing: border-box;}
#popupsBox .feBack .checkbox input[type='checkbox']:checked + label::before {background: url(../images/popups.png);background-size: 6.7rem 9.5rem;background-position: -5.21rem -1.85rem;border: none;}
#popupsBox .feBack textarea{width: 4.86rem;height: 0.96rem;border: none;border-radius: 0.1rem;resize:none;background: #f0f0f0;padding: 0.14rem;font-size: 0.2rem;color: #999999;margin-bottom: 0.06rem;}
#popupsBox input[type=tel]{border: none;height: 0.6rem;width: 5.1rem;font-size:14px;padding-left: 0.06rem;border-radius: 0.1rem;color: #999999;background: #f0f0f0;margin-bottom: 0.2rem;padding-left: 0.2rem;}
#popupsBox input[type=tel]::-webkit-input-placeholder {color: #888;}
#popupsBox input[type=tel]:-moz-placeholder { color: #888;}
#popupsBox input[type=tel]::-moz-placeholder { color: #888;}
#popupsBox input[type=tel]:-ms-input-placeholder { color: #888;}
#popupsBox .feedback input[type=button] { display: block; height: 0.8rem; line-height: 0.8rem; width: 3.5rem; background: #5978f5; border-radius: 0.4rem; font-size: 0.3rem; color: #fff; border: none; margin: 0.24rem auto 0;box-shadow: 0 0.05rem 0.08rem 0 rgba(0, 42, 255, .3); }
#popupsBox .feedback .linear { content: ""; position: absolute; bottom: 1.6rem; left: 0.3rem; width: 5.6rem; height: 0.3rem; background: linear-gradient(to top, #fff, rgba(255,255,255,0)); }


.in-slider{height: 3.85rem;width: 7.02rem;margin:.1rem .24rem .3rem;z-index: 3;position: relative;border-radius: 0.08rem;overflow: hidden;}
.in-slider > .swiper{width: 100%;height: 100%;}
.in-slider .swiper-slide > a,.in-slider .swiper-slide > div > a{display:block;width:100%;height:100%;}
.in-slider .swiper-slide > a > img{display:block;width:100%;height:100%;}
.in-slider .swiper-pagination{position: absolute;bottom: .25rem !important;left: auto !important;right: .3rem;text-align: right;width: 50% !important;}
.in-slider .swiper-pagination-bullet{width: .06rem;height: .06rem;background-color: #fff;opacity: 0.5;border-radius: .03rem;}
.in-slider .swiper-pagination-bullet-active{width: .17rem;opacity: 1;}
.in-slider .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 .015rem;}

.in-slider .swiper-slide > div{position: absolute;bottom: 0;left: 0;width: 100%;height: 2.3rem;background: linear-gradient(to top,#212121, #0000);border-bottom-left-radius: .08rem;border-bottom-right-radius: .08rem;}
.in-slider .swiper-slide > div > a > img{width: 1.28rem;height: 1.28rem;display: block;border-radius: .3rem;float: left;margin-left: .24rem;margin-top: .78rem;}
.in-slider .swiper-slide > div > a > div{float: left;margin-left: .16rem;}
.in-slider .swiper-slide > div > a > div > p{}
.in-slider .swiper-slide > div > a > div > p:nth-child(1){font-size: .32rem;color: #fff;line-height: .32rem;margin-top: 1.2rem;}
.in-slider .swiper-slide > div > a > div > p:nth-child(2){font-size: .24rem;color: rgba(255, 255, 255, .6);line-height: .24rem;margin-top: .16rem;}
.in-slider .swiper-slide > div > a > span{width: 1.2rem;height: .62rem;display: block;background: #209bf7;border-radius: .1rem;color: #fff;line-height: .62rem;text-align: center;font-size: .26rem;position: absolute;right: .58rem;top: 1.1rem;}
.in-slider .swiper-slide > div > a > span.no_down{background: #f98700;}



.hot-games,.friend{position: relative;z-index: 1;margin: 0 auto 0.3rem;width: 7.02rem;box-shadow: 0 0.06rem 0.29rem 0 rgb(133 212 222 / 18%);background-color: rgba(255,255,255,.9);border-radius: 0.2rem;overflow: hidden;}

.hot-games{margin-bottom: .1rem;}
.hot-games ul{margin: 0 .24rem;}
.hot-games ul li{width: 1.45rem;float: left;overflow: hidden;margin-right: .24rem;margin-bottom: .34rem;}
.hot-games ul li:nth-child(4n){margin-right: 0;}
.hot-games ul li img{width: 1.2rem;height: 1.2rem;display: block;border-radius: .26rem;border: .03rem solid #fff;margin:0 auto}
.hot-games ul li p{font-size: .28rem;line-height: .48rem;white-space: nowrap;overflow: hidden;text-align: center;margin-top: .06rem;color: #333;text-overflow: ellipsis;}
.hot-games ul li span{display: block;width: 1.18rem;height: .6rem;border: .01rem solid #209bf7;border-radius: .1rem;line-height: .6rem;text-align: center;color: #fff;margin: .1rem auto 0;background-color: #209bf7;}
.hot-games ul li span.no_down{color: #f98700;border-color: #f98700;background-color: transparent;}


.mid_recom_rank{margin-bottom: .3rem;}
.in-rank{position: relative;z-index: 2;width: 6.54rem;background-color: #fff;border-radius: 0.4rem;margin: auto;padding: 0.3rem 0.24rem 0.04rem;text-align: center;}

.in-rank > .in-rank-menu{display: inline-block;padding: 0.04rem 0.05rem;height: 0.52rem;line-height: .52rem;background: #fff;border: 1px solid #209bf7;border-radius: 0.3rem;margin: auto;text-align: center;overflow: hidden;}
.in-rank > .in-rank-menu span{float: left;display: block;color: #209bf7;font-size: .26rem;padding: 0 0.22rem;}
.in-rank > .in-rank-menu span.current{display: block;padding: 0 0.22rem;height: 0.52rem;font-weight: bold;color: #fff;background: linear-gradient(90deg, #209bf7 0%, #5faeef 100%);border-radius: 0.26rem;}

.in-rank > .in-rank-cont{}
.in-rank > .in-rank-cont > ul{display:none;text-align: left;margin-top: .3rem;}
.in-rank > .in-rank-cont > ul:first-child{display: block;}
.in-rank > .in-rank-cont > ul > li{width: 100%;height: 1.28rem;margin-bottom: .3rem;}
.in-rank > .in-rank-cont > ul > li > a{display: block;width: 100%;height: 100%;}
.in-rank > .in-rank-cont > ul > li > a > em{display: block;width: 0.44rem;height: 0.44rem;line-height: .44rem;background-color: #eee;border-radius: 0.1rem;font-size: .24rem;color: #999;font-weight: bold;text-align: center;margin: 0.42rem 0.2rem 0 0;float: left;}
.in-rank > .in-rank-cont > ul > li:nth-child(1) > a > em{background-color: #F55636;color: #fff;}
.in-rank > .in-rank-cont > ul > li:nth-child(2) > a > em{background-color: #f98700;color: #fff;}
.in-rank > .in-rank-cont > ul > li:nth-child(3) > a > em{background-color: #f9d602;color: #fff;}
.in-rank > .in-rank-cont > ul > li > a > img{width: 1.28rem;height: 1.28rem;border-radius: 0.3rem;margin-right: 0.24rem;float: left;}
.in-rank > .in-rank-cont > ul > li > a > div{float: left;width: 2.9rem;height: 1.28rem;margin-right: 0.16rem;}
.in-rank > .in-rank-cont > ul > li > a > div > p{font-size: .24rem;color: #999;line-height: .4rem;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.in-rank > .in-rank-cont > ul > li > a > div > p:nth-child(1){color: #333;font-size: .28rem;font-weight: bold;line-height: .46rem;}
.in-rank > .in-rank-cont > ul > li > a > span{margin-top: 0.33rem;width: 1.2rem;height: 0.62rem;line-height: .62rem;border: 1px solid #209bf7;border-radius: 0.1rem;font-size: .26rem;color: #fff;text-align: center;background-color: #209bf7;display: block;float: left;}