@charset "utf-8";

/* margin and padding */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,
s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,
td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video,input {
  margin: 0;  padding: 0;  border: none;  outline: 0;  font-size: 100%;  font: inherit;  vertical-align: baseline;
}
html {
  -webkit-user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  width: 100%;
  height: 100%;
}
div {
  cursor:pointer;
}
/* body */
body {
  font-family: "微软雅黑";
  font-size: 10px;
  color: #666;
  min-width: 320px;
  max-width: 720px;
  height: 100%;
  margin: 0 auto;
  background: #F3F4F5;
  position:relative;
}
body,div,fieldset,form,h1,h2,h3,h4,h5,h6,html,p {
  -webkit-text-size-adjust: none
}
input::-ms-clear {
  display: none;
}
/*提示框*/
.box-tip {
  width: 5.2rem;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: white;
  display: none;
  z-index: 999;
  border-radius: .2rem;
  padding: .4rem .6rem;
  text-align: center;
  box-sizing: border-box;
}
.box-tip ul{
  margin-top: .4rem;
  display: flex;
  justify-content: space-between;
}
.box-tip ul a{
  width: 45%;
  height: .6rem;
  color: #FFFFFF;
  border: none;
  border-radius:.7rem;
  outline: 0;
  line-height: .6rem;
  font-size: .24rem;
  background: #0089FF;
}
.box_tip p{font-size: 0.8rem;width: 90%;margin: 0 auto 1rem;}
.box_tip ul{border-top: 1px solid #b3b3b3;}
.box_tip ul a{width: 49%;display: inline-block;font-size: 1rem;}
.box_tip ul a:first-child.cancle{border-right: 1px solid #b3b3b3;}
.box_tip_1 ul{line-height: 1.5rem;}
.box_tip_1 ul a{width: 100%;overflow: hidden;margin-top: 0.5rem;}
.box_tip ul a:first-child{border: none;}
.box_tip .tip_pic{width: 20%;margin: 1rem auto;}

/*清楚文本框X*/
input,select,textarea {
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #999999;
}

strong {
  font-weight: bold;
}

/* img */
img {
  padding: 0;
  margin: 0 auto;
  vertical-align: middle;
  border: none;
}

i,em {
  font-style: normal;
}
/* a */
a {
  color: #555;
  text-decoration: none;
}
/* ul li */
ul,li {
  outline:none;
  list-style: none;
}
.fl{ float: left;}
.fr{ float: right;}
.img100{ width: 100%; height: 100%;}
/*去浮动*/
.clearFloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}
.clearFloat{zoom:1}
/*超过宽度显示...*/
.white-space{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
/*公共头部*/
.wrap{ width: 100%; min-width: 320px;  max-width: 720px;}
.radius-8{border-radius:0.08rem; }
.radius-24{border-radius: 0.24rem;}
header{
  z-index: 100;background: #fff;position: fixed;top: 0;
  /*position: fixed;top: 0; display: flex;align-items: center;*/
}
.fill-top{ height:1.92rem;}
.menu{padding:0.15rem 0.16rem; background: #fff; height: 0.8rem; display: none; }
.close{ width: 0.4rem; height: 0.4rem;  cursor: pointer;  float: left; margin-top: 0.2rem;}
.close img{ width: 100%; height: 100%;}
.menu-list{ float: left; margin-left: 0.16rem;height: 0.8rem;}
.menu-list-img{margin-right: 0.24rem; float: left;height: 0.8rem;}
.menu-list-img img{height: 100%;}
.menu-list-title{ float: left;}
.menu-list-title h3{max-width: 3.4rem; text-align: left; font-size: 0.3rem; line-height: 0.38rem; color: #333;}
.menu-list-title p{max-width: 3.4rem; padding-top: 0.1rem; text-align: left; font-size: 0.22rem; line-height: 0.33rem; color: #999;}
.menu-list-url{ width:1.86rem; height: 0.58rem; float: right; color: #fff; line-height: 0.58rem; font-size: 0.24rem; border-radius: 0.27rem; text-align: center;
  background: #0089FF; display: block;margin-top: 0.12rem;
}

.downimg {    vertical-align: middle;
  width: .3rem;
  height: .3rem;
  margin-right: .05rem;padding-bottom: 0.04rem;}
.header{ padding:0.2rem 0.3rem; background: #0089FF; height: 0.56rem; }
.header a{ float: right; margin-left: 0.3rem;}
.header a:first-child{ float: left;margin-left:0;}
.header img{ max-height: 0.54rem;}

html {
  font-size: 50px;
}
@media screen and (min-width:320px){
  html{font-size:44.44444444444444px;}
}
@media screen and (min-width:360px){
  html{font-size:50px}
}
@media screen and (min-width:375px){
  html{font-size:52.083333333333336px;}
}
@media screen and (min-width:384px){
  html{font-size:375%;}
}
@media screen and (min-width:390px){
  html{font-size:380.85%;}
}
@media screen and (min-width:393px){    /* 小米NOTE */
  html{font-size:383.79%;}
}
@media screen and (min-width:410px){
  html{font-size:57.083333333333336px;}
}
@media screen and (min-width:432px){ /* 魅族3 */
  html{font-size:421.875%;}
}
@media screen and (min-width:480px){
  html{font-size:469%;}
}
@media screen and (min-width:540px){
  html{font-size:527.34%;}
}
@media screen and (min-width:640px){
  html{font-size: 625%;}
}

@media screen and (width:720px){
  html{font-size: 703.125%;}
}

.nav {
  margin-top: 0.3rem;
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  z-index: 100;
  background: #fff;
  position: relative;
  height: 0.54rem;
  line-height: 0.54rem;padding-bottom: 0.16rem;
  border-bottom: 1px #d9d9d9 solid;
  /*top: 2.58rem;*/
}

.nav a{
  width: 17%;
  text-align: center;
  margin: 0 0.3rem;
  color: #505050;
  display:inline-block;
  text-align: center;
  position: relative;
  font-size: 0.28rem;
}
@media(min-width: 721px)  {
  .nav a{ width:auto;}
}
.nav .select:before{
  content: '';
  display: block;
  width: 100%;
  height: 0.16rem;
  background: #0089FF;
  position: absolute;
  bottom: 0.01rem;
  left: 0%;
  opacity: .9;
  z-index: -1;
  border-radius: 0.1rem;
}
.nav .select {
  font-size: 0.4rem;
  color: black
}
/*公共尾部*/
footer{ background: #fff;padding:0.16rem 0.3rem; }
footer .menu-list{ width: 100%; float: none; margin-left: 0;}
.menu-list-plate{ float: right; color: #ccc;margin-right: 0.3rem; padding-top: 0.2rem; font-size: 0.3rem;}
.menu-list-plate a{ color: #333;}
.menu-list-plate a:last-child{ color: #ccc;}
.menu-list-plate span{ padding: 0px 10px; font-size: 0.16rem;}
.footer-end{ border-top: 1px #ccc solid; margin-top:0.24rem; text-align:center; }
.footer-menu{ width: 100%; height: 0.3rem; line-height: 0.36rem; margin: 0.2rem 0;}
.footer-menu a{color: #333; font-size: 0.24rem; display: inline-block;}
.footer-menu span{color: #ccc; font-size: 0.12rem;display: inline-block; padding: 0rem 0.12rem;}
.footer-end p{ font-size: 0.24rem; line-height: 0.38rem; color: #333;}
/*公共游戏列表页*/
.common-tag{ width: 6.6rem; padding: 0 0.3rem; font-size: 0.28rem; text-align: left; line-height: 0.96rem;height: 0.96rem;background: #fff; }
.common-tag span{color: #909090; font-family: 宋体;}
.common-tab{height: 0.96rem;line-height: 0.96rem;background: #F3F4F5;}
.common-tab a{ display: inline-block;font-size: 0.24rem; background:#E8E8E8;line-height: 0.44rem;padding: 0rem 0.24rem; color: #999; margin-left: 0.1rem;
 border-radius: 0.26rem;}
 .common-tab a:first-child{ margin-left: 0.3rem;}
.common-tab a.current{background: #0089FF; color: #fff; }

.common-list{margin:0.1rem 0.3rem;}
.common-list li{ margin:0.24rem 0rem; display: block;}
.common-list-game{ display: block; width: 100%; min-height: 1.2rem; position: relative; z-index: 1;}
.common-img{ width: 1.2rem; height: 1.2rem;position: relative; float: left;display: block; overflow: hidden;border-radius: 0.08rem;}
.common-col{ width:4.5rem; margin-left: 0.16rem; float: left;}
.common-col strong{ display: block; font-size: 0.28rem; font-weight: normal;}
.common-col i{display: block;font-size: 0.24rem;}
.common-url{ height: 0.54rem; width: 1.08rem; text-align: center; display: block; line-height: 0.54rem; color: #fff;background:#0089FF;
  position: absolute; right: 0;top:0.27rem; border-radius: 0.54rem; z-index: 2; font-size: 0.24rem;}
.common-tags{ font-size: 0.22rem;color: #999; margin: 0.06rem 0rem; display:block; overflow: hidden; line-height: 0.33rem; height: 0.33rem;}
.common-tags span{display: inline-block; position: relative;padding-left: 0.1rem;}
.common-tags span:first-child{padding-left: 0rem;}
.common-tags span:before{content:"."; position: absolute;bottom: 0.08rem; left: 0rem;  }
.common-tags span:first-child:before{content:'';}
.common-keyword{ display:block; overflow: hidden; }
.common-keyword span{color: #fff;display:inline-block;background:#FDB448;font-size: 0.1rem;padding:0.02rem 0.06rem; border-radius: 4px; margin-right: 0.06rem;}
.common-keyword span:first-child{margin-left: 0rem;}
.links{margin: 0rem 0.3rem; color: #999; padding-top: 0.3rem; padding-bottom: 0.4rem;  }
.links h3{line-height: 0.5rem; text-align: center; color: #505050; font-size: 0.28rem;}
.links a{display:inline-block;padding-right: 0.2rem; color: #999; font-size: 0.24rem;word-wrap: break-word;}
.common-tabs{ width: 1.44rem;overflow-y: auto;position: fixed;z-index: 2; top:2.08rem;}
.common-tabs a{height: 0.8rem;  display: block; text-align: center; line-height: 0.8rem; font-size: 0.28rem; border-left: 0.03rem #F3F4F5 solid; border-bottom: 1px #eee solid;}
.common-tabs a.blue{border-left: 0.03rem #0089FF solid; color:#0089FF;background: #fff;}
.tabsCon{}
.common-mod{ width:5.76rem; float:left;  overflow: hidden;background: #fff; overflow-y: auto;}
.common-mod li{margin-left: 0.27rem; margin-top:0.3rem;}
.common-cols{ width:3.2rem;}

.masking{ width: 100%;height: 100%;position: fixed; left: 0; top: 0; background: rgba(0,0,0,0.6); z-index: 108; display: none;}
.down-popup{ width:5.8rem; height:5.2rem; position: absolute; left: 50%;top:50%;margin-left: -2.9rem; margin-top: -2.6rem; background: #fff;
  border-radius: 0.1rem;}
.down-popup img{ border-radius: 0.1rem; width: 1.3rem; height: 1.3rem;position: absolute; left: 50%;top:0;margin-left: -0.65rem; margin-top: -0.65rem;}
.down-popup h3{ width: 100%; margin-top: 0.9rem; line-height: 0.4rem; font-size: 0.3rem; text-align: center;}
.down-popup-tips{ width: 80%; margin: 0.3rem auto; font-size: 0.22rem; line-height: 0.38rem; color: #999;}
.down-popup-tips p{ font-size: 0.26rem; padding-bottom: 0.2rem; color: #666;}
.down-popup-link{ width: 80%; margin: 0 auto; display: block; text-align: right;}
.down-popup-link label,.down-popup-link a{ margin-left: 0.4rem;}
.col-blue{ color: #0089FF;}
.down-pop{ width:5.8rem; height:6.3rem; position: absolute; left: 50%;top:50%;margin-left: -2.9rem; margin-top: -3.15rem; background: #fff;
  border-radius: 0.1rem;}
.down-pop img{ width: 100%;}
.down-pop h3{ width: 100%; margin-top: 0.2rem; line-height: 0.4rem; font-size: 0.3rem; text-align: center;}
.col-blue{ color: #0089FF;}
/*角标*/
.marker{width:1.2rem;height: 1.2rem;position: absolute; left: 0; top:0;display: block;}
.marker img{ width: 100%; height: auto;}
.top-selling-img .marker{width:0.96rem;height: 0.96rem;}
.game-icon  .marker{width:1.34rem;height: 1.34rem;}

/*提示*/
.toast-container {
  line-height: 17px;
  position: fixed;
  z-index: 9999;
  bottom: 180px;
  left: 50%;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  opacity: 0
}

.toast-container.active {
  opacity: .9
}

.toast-message {
  font-size: 14px;
  padding: 10px 25px;
  text-align: center;
  color: #fff;
  border-radius: 6px;
  background-color: #323232
}