/* 鍏ㄥ眬 */
.wrap{width:1200px !important;}
body{background:#f6f7f7;}

.live-icon{
  display:inline-block;
  *display:inline;*zoom:1;
  vertical-align:middle;
  width:29px;height:10px;
  background:url(http://www.shanggukt.cn/images/live-icon.png) no-repeat;
}
.index-page {
  /* background: url(../images/bg.jpg); */
}
.index-page .wrap{
  /*overflow:hidden;*/
}

/* banner */
.banner{
  position:relative;
  /* padding-top:39px; */
  height:386px;
  background-image:url(http://www.shanggukt.cn/images/bg_1.jpg);
  background-repeat:no-repeat;
  background-position:top center;
}
.banner .wrap{position:relative;}

.banner .skinA-bg{
  position:absolute;
  top:0;left:0;
  width:100%;
  height:645px;
  z-index:0;
}

.banner .left-area{
  position:relative;
  float:left;
  width:1000px;
  height:566px;
  background:#000 url(http://www.shanggukt.cn/images/1.png) center center no-repeat;
}
.banner .left-area img,
.banner .left-area object{
  display:block;
  width:100%;height:100%;
}

.banner .right-area{
  float:right;
  background:url(http://www.shanggukt.cn/images/banner-right-bg.png) repeat;
}
.banner .right-area li{
  margin-bottom:10px;
  height:86px;
  width:185px;
}
.banner .right-area a{
  position:relative;
  display:block;
  width:100%;height:100%;
}
.banner .right-area .img-box,
.banner .right-area .img-box img{
  display:block;
  width:100%;height:100%;
}

.banner .right-area .img-box{
  position:relative;
}
.banner .right-area .img-box .p-area{
  opacity:0;
  filter:alpha(opacity=00);
  position:absolute;
  bottom:0;left:0;
  padding:0 6px;
  width:173px;height:24px;
  background:url(http://www.shanggukt.cn/images/mask-60.png) repeat;
  -moz-transition:opacity 200ms ease-out;
  -webkit-transition:opacity 200ms ease-out;
  -o-transition:opacity 200ms ease-out;
  transition:opacity 200ms ease-out;
}
.banner .right-area .img-box .name{
  height:24px;line-height:24px;
  width:173px;
  font-size:12px;color:#fff;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.banner .right-area .sub-mask{
  opacity:0;
  filter:alpha(opacity=00);
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:url(http://www.shanggukt.cn/images/banner-focus.png) no-repeat;
  z-index:2;
  -moz-transition:opacity 200ms ease-out;
  -webkit-transition:opacity 200ms ease-out;
  -o-transition:opacity 200ms ease-out;
  transition:opacity 200ms ease-out;
}
.banner .right-area a:hover .p-area,
.banner .right-area .active .p-area,
.banner .right-area .active .sub-mask{
  opacity:1;
  filter:alpha(opacity=100);
}

/* 鍙屽嚮鎾斁鍣ㄥ叏灞� */
.maxScreen .banner .left-area{
  position:fixed;
  top:0;left:0;
  width:100%;height:100%;
  z-index:100;
}
/* 鍙屽嚮鎾斁鍣ㄥ叏灞廍nd */

/* 妯″潡鍖哄煙 */
.modular-area{
  background:#fff;
  padding-bottom:25px;
}
.modular-area .modular{
  float:left;
  margin-right:18px;
  width:388px;
}
.modular-area .modular .hd{
  margin-top:25px;
  height:70px;
  text-align:center;
}
.modular-area .modular .hd img{
  width:99px; height:27px;
  display:inline-block;
  *display:inline;*zoom:1;
}
.modular-area .modular .hd p{
  margin-top:10px;
  line-height:16px;
  font-size:12px;color:#777;
}
.modular-area .modular .bd ul{
  position:relative;
  *zoom:1;
  margin-right:-18px;
}
.modular-area .modular .bd li{
  float:left;
  margin:0 18px 10px 0;
  width:185px;height:104px;
}
.modular-area .modular .bd li a{position:relative;}
.modular-area .modular .bd li a,
.modular-area .modular .bd li img{
  display:block;
  width:100%;height:100%;
}
.modular-area .modular .bd li .img-box{
  width:100%;height:100%;
}

.modular-area .modular .sub-mask{
  position:absolute;
  left:0;top:0;
  width:100%;height:100%;
  z-index:9;
}
.modular-area .modular .mask-sub{
  position:absolute;
  left:0;top:0;
  width:100%;height:100%;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
  opacity:0;
  background-color:#000;
  -webkit-transition:all ease-in 250ms;
  transition:all ease-in 250ms;
  z-index:9;
}
.modular-area .modular li .name{
  position:absolute;
  bottom:0;left:0;
  padding:0 5px;
  width:175px;height:30px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  line-height:30px;
  font-size:12px;color:#fff;
  -webkit-transition:all ease-in 250ms;
  transition:all ease-in 250ms;
  text-align:center;
  z-index:9;
}

.modular-area .modular li .name-bg{
  position:absolute;
  bottom:0;left:0;
  height:30px;width:100%;
  background:url(http://www.shanggukt.cn/images/index-p-bg.png) bottom left no-repeat;
  -webkit-transition:all ease-in 250ms;
  transition:all ease-in 250ms;
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
}

.modular-area .modular li .play-icon{
  position:absolute;
  z-index:10;
  top:50%;left:50%;
  margin-left:-20px;
  width:40px;height:40px;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
  opacity:0;
  background:url(http://www.shanggukt.cn/images/play-icon_1.png) no-repeat;
  -webkit-transform:scale(2);
  -ms-transform:scale(2);
  transform:scale(2);
  -webkit-transition:all ease-in 250ms;
  transition:all ease-in 250ms;
}

.modular-area .modular li a:hover .name{
  bottom:12px;
  background:none;
}

.modular-area .modular li a:hover .play-icon{
  margin-top:-27px;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
  opacity:1;
  -webkit-transform:scale(1);
  -ms-transform:scale(1);
  transform:scale(1);
}

.modular-area .modular li a:hover .mask-sub{
  -ms-filter:alpha(opacity=50);
  filter:alpha(opacity=50);
  opacity:.5;
}

.modular-area .modular li a:hover .name-bg{
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
}

/* 鏂伴椈鍖哄煙 */
.news-area{
  padding-top:30px;
  padding-bottom:26px;
  background:#f5f5f5;
}
.news-area .news-sub-left{
  float:left;
  margin-right:18px;
  width:260px;height:380px;
}
.news-area .news-sub-left .roll_pic_wrap{
  position:relative;
  height:100%;
}
.news-area .news-sub-left .a1d_pic_box{
  position:relative;
  height:100%;
  overflow:hidden;
}
.news-area .news-sub-left .a1d_pic_box a{
  height:100%;
  display:block;
  text-align:left;
}
.news-area .news-sub-left .a1d_pic_box img{
  display:block;
  width:100%;height:100%;
}

.news-area .news-sub-left .a1d_pic_box .text-area{
  position:absolute;
  left:0;bottom:0;
  height:80px;width:260px;
  background:url(http://www.shanggukt.cn/images/text-bg.png) repeat;
}

.news-area .news-sub-left .a1d_pic_box .text-area .title{
  margin:9px 0 0 12px;
  height:32px;line-height:32px;
  font-size:18px;color:#fff;
  width:236px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.news-area .news-sub-left .a1d_pic_box .text-area .sub-title{
  margin-left:12px;
  height:22px;line-height:22px;
  font-size:14px;color:#dedfe0;
  width:140px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.news-area .news-sub-left .a1d_btn{
  display:none;
  position:absolute;
  width:0px;
  right:10px;bottom:10px;
  padding:2px 5px 2px 2px;
  height:12px;
  background:#6b767b;
  background:rgba(107,118,123,.5);
  border-radius:50px;
  -webkit-transition:all .3s ease-out;
  -moz-transition:all .3s ease-out;
  -ms-transition:all .3s ease-out;
  -o-transition:all .3s ease-out;
  transition:all .3s ease-out;
  overflow:hidden;
  z-index:11;
}

.news-area .news-sub-left .a1d_btn .js-roll-btn {
  display:block;
  _display:inline;
  float:left;
  margin-left:3px;
  width:12px;height:12px;
  background:#f1f2f2;
  border-radius:50px;
  text-indent:-99em;
  outline:0;
  -webkit-transition:width .3s ease-out;
  -moz-transition:width .3s ease-out;
  -ms-transition:width .3s ease-out;
  -o-transition:width .3s ease-out;
  transition:width .3s ease-out;
  overflow:hidden;
}

.news-area .news-sub-left .a1d_btn .active {
  background:#11b9f5;
}

.news-area .news-sub-mid{
  float:left;
  margin-right:18px;
  width:678px;
}
.news-area .news-sub-mid .main-title{
  margin-bottom:8px;
  height:30px;line-height:30px;
  font-size:26px;
  text-align:center;
}
.news-area .news-sub-mid .main-title .a{
  color:#e11f1c;
}

.news-area .news-sub-mid .title-bottom{
  margin-bottom:14px;
  height:24px;line-height:24px;
  font-size:12px;
  text-align:center;
}
.news-area .news-sub-mid .title-bottom .a{
  margin:0 20px;
  color:#141414;
  text-decoration:underline;
}
.news-area .news-sub-mid .title-bottom .a:hover{
  color:#12b7f5;
}
.news-area .news-sub-mid .news-bottom-left{
  float:left;
  width:358px;
}
.news-area .news-sub-mid .news-bottom-left .ul-1{
  margin-bottom:22px;
  margin-right:-5px;
}
.news-area .news-sub-mid .news-bottom-left .ul-1 li{
  float:left;
  margin-right:2px;
  width:88px;height:30px;
  line-height:30px;
  font-size:14px;
  text-align:center;
}
.news-area .news-sub-mid .news-bottom-left .ul-1 a{
  display:block;
  width:100%;height:100%;
  color:#777;
  background-color:#f7f7f9;

}
.news-area .news-sub-mid .news-bottom-left .ul-1 a:hover{
  color:#12b7f5;
}

.news-area .news-sub-mid .news-bottom-left .ul-1 .active a,
.news-area .news-sub-mid .news-bottom-left .ul-1 .active a:hover{
  background-color:#12b7f5;
  color:#f5f5f5;
}

.news-area .news-sub-mid .news-bottom-left .tabc li{
  height:30px;
  line-height:30px;
  border-bottom:1px dotted #dedfe0;
  font-size:12px;color:#555;
}
.news-area .news-sub-mid .news-bottom-left .tabc a{
  color:#555;
}

.news-area .news-sub-mid .news-bottom-left .type{
  float:left;
  width:48px;
  cursor:default;
}
.news-area .news-sub-mid .news-bottom-left .sub-content{
  float:left;
  height:30px;line-height:30px;
  font-size:0;
}
.news-area .news-sub-mid .news-bottom-left .sub-content .title{
  max-width:205px;
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.news-area .news-sub-mid .news-bottom-left .sub-content .hot-icon{
  margin-left:5px;
  width:25px;height:11px;
  background:url(http://www.shanggukt.cn/images/hot-icon.png) no-repeat;
}

.news-area .news-sub-mid .news-bottom-left .sub-content:hover{
  color:#12b7f5;
}
.news-area .news-sub-mid .news-bottom-left .time{
  float:right;
  font-size:12px;color:#a5a7aa;
  cursor:default;
}

.news-area .news-sub-mid .news-bottom-left .textC{
  margin-top:36px;
}
.news-area .news-sub-mid .news-bottom-left .more-btn{
  display:inline-block;
  width:198px;height:28px;
  line-height:28px;
  background:#f7f7f9;
  border:1px solid #dedfe0;
  font-size:14px;color:#555;
  text-align:center;
}
.news-area .news-sub-mid .news-bottom-left .more-btn:hover{
  background:#f3f3f3;
}
.news-area .news-sub-mid .news-bottom-right{
  float:right;
  width:302px;
}

.news-area .news-sub-mid .news-bottom-right .ul1{
  position:relative;
  *zoom:1;
  margin-right:-2px;
  margin-bottom:18px;
}
.news-area .news-sub-mid .news-bottom-right .ul1 li{
  float:left;
  margin-right:2px;
  /*width:150px;*/
  width:300px;height:30px;
  line-height:30px;
  background:#f7f7f9;
  font-size:14px;
  text-align:center;
}
.news-area .news-sub-mid .news-bottom-right .ul1 a{
  color:#777;
}
.news-area .news-sub-mid .news-bottom-right .ul1 a:hover{
  color:#12b7f5;
}

.news-area .news-sub-mid .news-bottom-right .ul1 .active{
  background:#12b7f5;
}
.news-area .news-sub-mid .news-bottom-right .ul1 .active a,
.news-area .news-sub-mid .news-bottom-right .ul1 .active a:hover{
  color:#fff;
}

.news-area .news-sub-mid .news-bottom-right .jchd-area{
  height:256px;
  overflow:auto;
  overflow-x:hidden;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .js-scroll{padding-left:17px;}
.news-area .news-sub-mid .news-bottom-right .jchd-area ul{
  display:block;
  padding-left:22px;
  border-left:1px solid #dedfe0;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area li{
  margin-bottom:13px;
}

.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-hd{
  position:relative;
  margin-left:-40px;
  height:32px;width:88px;
  line-height:32px;
  background:#fff;
  border:1px solid #dedfe0;
  text-align:center;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-hd .t-arrow{
  position:absolute;
  top:-4px;left:14px;
  width:5px;height:3px;
  background:url(http://www.shanggukt.cn/images/news-arrow.png) no-repeat;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-hd .b-arrow{
  position:absolute;
  bottom:-4px;left:14px;
  width:5px;height:3px;
  background:url(http://www.shanggukt.cn/images/news-arrow.png) no-repeat;
  background-position:0 -3px;
}

.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-hd span{
  font-size:12px;color:#555;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-hd .num{
  margin-left:5px;
  font-size:24px;color:#12b7f5;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .sub-bd{
  margin-top:2px;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .name{
  width:262px;
  height:36px;line-height:36px;
  font-size:12px;color:#555;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  cursor:default;
  font-weight:700;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .see-btn{
  height:26px;line-height:26px;
  font-size:12px;color:#555;
}
.news-area .news-sub-mid .news-bottom-right .jchd-area .see-btn:hover{
  color:#12b7f5;
}

.news-area .news-sub-mid .news-bottom-right .rmss-area{
  height:256px;
  overflow:auto;
  overflow-x:hidden;
}
.news-area .news-sub-mid .news-bottom-right .rmss-area li{
  margin-bottom:1px;
  height:63px;
  background:#f8f8f8;
}
.news-area .news-sub-mid .news-bottom-right .rmss-area a{
  display:block;
  width:100%;height:100%;
  color:#555;
}
.news-area .news-sub-mid .news-bottom-right .rmss-area .rmss-left{
  float:left;
  margin-right:10px;
  width:91px;height:63px;
}

.news-area .news-sub-mid .news-bottom-right .rmss-area img{
  display:block;
  width:100%;height:100%;
}
.news-area .news-sub-mid .news-bottom-right .rmss-area .rmss-right{
  float:left;
}

.news-area .news-sub-mid .news-bottom-right .rmss-area .name{
  margin-top:10px;
  height:20px;line-height:20px;
  font-size:12px;
  font-weight:700;
}
.news-area .news-sub-mid .news-bottom-right .rmss-area .title{
  width:190px;
  height:24px;line-height:24px;
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.news-area .news-sub-mid .news-bottom-right .rmss-area a:hover{
  color:#12b7f5;
}

.news-area .game-right{
  float:right;
  width:226px;
}
.news-area .game-right li{
  display:block;
  margin-bottom:10px;
  height:120px;
  overflow:hidden;
}
.news-area .game-right a{
  position:relative;
  display:block;
  width:100%;height:100%;
}
.news-area .game-right li .img-box{
  position:relative;
  height:100%;
}
.news-area .game-right img{
  display:block;
  width:100%;height:100%;
}
.news-area .game-right .recommend-icon{
  position:absolute;
  top:10px;right:0;
  width:58px;height:20px;
  line-height:20px;
  font-size:12px;color:#fff;
  background:#12b7f5;
  text-align:center;
}
.news-area .game-right .sub-mask{
  position:absolute;
  bottom:-6px;left:0;
  padding:4px 6px 2px;
  width:214px;max-height:0;
  background:url(http://www.shanggukt.cn/images/mask.png) repeat;
  font-size:12px;color:#fff;
  line-height:20px;
  overflow:hidden;
  -moz-transition:all 0.3s linear;
  -webkit-transition:all 0.3s linear;
  -o-transition:all 0.3s linear;
  transition:all 0.3s linear;
}
.news-area .game-right .sub-mask .name{
  font-weight:700;
}

.news-area .game-right a:hover .sub-mask{
  max-height:66px;
  bottom: 0;
}

/* 鏄庢槦澧� */
.stars-wall{
  padding-top:90px;
  height:170px;
  background:url(http://www.shanggukt.cn/images/stars-wall-bg.jpg) top center no-repeat;
}
.stars-wall .wrap{
  overflow:visible;
}
.stars-wall .pre,
.stars-wall .next{
  position:absolute;
  top:40px;
  width:24px;height:44px;
  background:url(http://www.shanggukt.cn/images/stars-arrow.png) no-repeat;
  z-index:2;
}
.stars-wall .pre{
  left:-34px;
  background-position:0 0;
}
.stars-wall .pre:hover{
  background-position:-24px 0;
}
.stars-wall .next{
  right:-34px;
  background-position:-48px 0;
}
.stars-wall .next:hover{
  background-position:-72px 0;
}
.stars-wall .pre:active,
.stars-wall .next:active{
  top:41px;
}

.stars-wall .gallery{
  width:1200px;
  overflow:hidden;
}
.stars-wall .gallery ul{
  position:relative;
  width:999em;
  display:block;
}
.stars-wall .gallery li{
  float:left;
  width:120px;
  margin-right:15px;
}
.stars-wall .gallery a{
  position:relative;
  display:block;
  width:100%;height:120px;
}
.stars-wall .gallery .img-box{
  height:100%;
}
.stars-wall .gallery img{
  display:block;
  width:100%;height:100%;
}

.stars-wall .gallery .border{
  position:absolute;
  top:0;left:0;
  width:100%;height:120px;
  background:url(http://www.shanggukt.cn/images/stars-live.png) no-repeat;
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
  -webkit-transition:all 0.2s linear;
  -moz-transition:all 0.2s linear;
  -o-transition:all 0.2s linear;
  transition:all 0.2s linear;
  z-index:5;
}

.stars-wall .gallery .live-icon{
  display:none;
  position:absolute;
  left:46px;top:100px;
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
  -webkit-transition:all 0.2s linear;
  -moz-transition:all 0.2s linear;
  -o-transition:all 0.2s linear;
  transition:all 0.2s linear;
  z-index:4;
}
.stars-wall .gallery .sub-mask{
  position:absolute;
  top:0;left:0;
  width:100%;height:120px;
  background:url(http://www.shanggukt.cn/images/mask.png) repeat;
  text-align:center;
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
  -moz-transition:all 0.2s linear;
  -webkit-transition:all 0.2s linear;
  -o-transition:all 0.2s linear;
  transition:all 0.2s linear;
}

.stars-wall .gallery .game-name{
  margin-top:10px;
  height:46px;line-height:46px;
  font-size:12px;color:#fff;
}
.stars-wall .gallery .info{
  margin-bottom:14px;
  height:12px;line-height:12px;
  font-size:0;
  color:#aeabab;
}
.stars-wall .gallery .info .eyes-icon{
  margin-right:5px;
}
.stars-wall .gallery .info span{
  font-size:12px;
}

.stars-wall .gallery .type-btn{
  display:inline-block;
  width:68px;height:22px;
  line-height:22px;
  font-size:12px;color:#fff;
  background:#b6b2b0;
  border-radius:20px;
}

.stars-wall .gallery .name{
  height:42px;line-height:42px;
  font-size:12px;color:#fff;
  text-align:center;
  cursor:default;
}

.stars-wall .gallery .on-live .type-btn{
  background:#12b7f5;
}
.stars-wall .gallery .on-live .live-icon{display:block;}

.stars-wall .gallery a:hover .sub-mask,
.stars-wall .gallery a:hover .border{
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
}

.stars-wall .gallery a:hover .live-icon{
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
}

.hot-games{
  padding-top:15px;
  padding-bottom:25px;
  background:#f0f0f0;
}
.index-hd{
  position:relative;
  height:100px;line-height:100px;
  font-size:0;
  text-align:center;
}
.index-hd .first{
  display:inline-block;
  vertical-align:middle;
  font-size:24px;
  color:#12b7f5;
}
.index-hd .last{
  display:inline-block;
  vertical-align:middle;
  font-size:24px;
  color:#555;
}
.index-hd small{
  display:inline-block;
  vertical-align:middle;
  margin:0 8px;
  width:5px;height:5px;
  border-radius:100%;
  background:#a5a7aa;
}
.index-hd .more{
  position:absolute;
  top:23px;right:0;
  height:20px;line-height:20px;
  font-size:0;color:#777;
}
.index-hd .more span{
  margin-left:8px;
  font-size:12px;
}
.index-hd .more .round{
  margin-left:3px;
  width:4px;height:4px;
  background:#777;
  border-radius:100%;
  -moz-transition:background 200ms ease-out;
  -webkit-transition:background 200ms ease-out;
  -o-transition:background 200ms ease-out;
  transition:background 200ms ease-out;
}
.index-hd .more:hover{color:#12b7f5;}
.index-hd .more:hover .round{
  background:#12b7f5;
}

/* 鐑棬娓告垙 */
.hot-games .bd{margin-top:10px;}

.hot-games .bd ul{
  position:relative;
  *zoom:1;
  margin-right:-20px;
}
.hot-games .bd li{
  float:left;
  margin-right:18px;
  width:134px;height:228px;
}
.hot-games .bd a{
  position:relative;
  display:block;
  width:100%;height:188px;
  overflow:hidden;
}
.hot-games .bd img{
  display:block;
  width:100%;height:100%;
}

.hot-games .bd a .sub-mask{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:#fff;
  opacity:0;
  filter:alpha(opacity=00);
  -moz-transition:opacity 200ms linear;
  -webkit-transition:opacity 200ms linear;
  -o-transition:opacity 200ms linear;
  transition:opacity 200ms linear;
}

.hot-games .bd .name{
  height:40px;line-height:40px;
  text-align:center;
}

.hot-games .bd a:hover .sub-mask{
  opacity:.2;
  filter:alpha(opacity=20);
}

/* 鏃楀鎺ㄨ崘銆€*/
.qn-recommend-area{
  padding-top:15px;
  padding-bottom:25px;
}
.qn-recommend-area .bd{
  margin-top:16px;
}
.qn-recommend-area .bd ul{
  position:relative;
  *zoom:1;
  margin-right:-20px;
}
.qn-recommend-area .bd li{
  margin-right:18px;
  float:left;
  width:286px;
}
.qn-recommend-area .bd a{
  display:block;
}
.qn-recommend-area .bd .img-box{
  position:relative;
  width:100%;height:160px;
}
.qn-recommend-area .bd img{
  display:block;
  width:100%;height:100%;
}
.qn-recommend-area .bd .sub-mask{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:#000;
  opacity:0;
  filter:alpha(opacity=00);
  z-index:1;
}
.qn-recommend-area .bd .play-icon{
  position:absolute;
  top:50%;left:50%;
  margin:-23px 0 0 -23px;
  width:45px;height:45px;
  background:url(http://www.shanggukt.cn/images/play-icon-2.png) no-repeat;
  opacity:0;
  filter:alpha(opacity=0);
  -webkit-transition:all .3s ease-out;
  -moz-transition:all .3s ease-out;
  -ms-transition:all .3s ease-out;
  -o-transition:all .3s ease-out;
  transition:all .3s ease-out;
  -webkit-transform:scale(1.5);
  -moz-transform:scale(1.5);
  -ms-transform:scale(1.5);
  transform:scale(1.5);
  z-index:2;
}
.qn-recommend-area .bd .room-name{
  margin-top:3px;
  width:286px;
  height:24px;line-height:24px;
  font-size:12px;color:#555;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.qn-recommend-area .bd .meat{
  padding-left:5px;
  height:24px;line-height:24px;
  font-size:0;
}
.qn-recommend-area .bd .meat .anchor{
  width:264px;
  font-size:12px;color:#12b7f5;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.qn-recommend-area .bd a:hover .sub-mask{
  opacity:.3;
  filter:alpha(opacity=30);
}

.qn-recommend-area .bd a:hover .play-icon{
  opacity:1;
  filter:alpha(opacity=100);
  -webkit-transform:scale(1);
  -moz-transform:scale(1);
  -ms-transform:scale(1);
  transform:scale(1);
}

/* 骞垮憡 */
.odd-bg{background:#f0f0f0;}

.gg-area li{
  height:100px;width:591px;
}
.gg-area li .img-box{
  height:100px;
}
.gg-area li img,
.gg-area li a{
  display:block;
  width:100%;height:100%;
}

/* 鐑棬瑙嗛 */
.hot-lives .hd{
  position:relative;
  padding:17px 10px 6px;
  height:64px;
  text-align:left;
  font-size:0;
  border: 1px solid #cfcfcf;
  margin-top: 10px;
  background: url(../images/tw.jpg);
}
.lives-list {
  margin-top: 20px;
}

.hot-lives .hd .img-box{
  float:left;
  color:#555;
}

.hot-lives .hd .img-box .img-area{
  position:relative;
  float:left;
  margin-right:20px;
  width:64px;
}
.hot-lives .hd .img-box img{
  display:block;
  height:64px;
}

.hot-lives .hd .img-box .img-area .img-mask{
  position:absolute;
  top:4px;left:4px;
  width:52px;height:52px;
  border-radius:100%;
  background:#000;
  opacity:0;
  filter:alpha(opacity=00);
  -webkit-transition:.5s cubic-bezier(.3,0,0,1.3);
  -moz-transition:.5s cubic-bezier(.3,0,0,1.3);
  -ms-transition:.5s cubic-bezier(.3,0,0,1.3);
  -o-transition:.5s cubic-bezier(.3,0,0,1.3);
  transition:.5s cubic-bezier(.3,0,0,1.3);
  -webkit-transform:scale(0,0);
  -moz-transform:scale(0,0);
  -ms-transform:scale(0,0);
  -o-transform:scale(0,0);
  transform:scale(0,0);
}
.hot-lives .hd .img-box:hover .img-area .img-mask{
  opacity:.3;
  filter:alpha(opacity=30);
  -webkit-transform:scale(1,1);
  -moz-transform:scale(1,1);
  -ms-transform:scale(1,1);
  -o-transform:scale(1,1);
  transform:scale(1,1);
}

.hot-lives .hd .img-box .text-area{
  float:left;
  margin-top:-5px;
  height:64px;line-height:64px;
  font-size:0;
}
.hot-lives .hd .img-box .text-area .first,
.hot-lives .hd .img-box .text-area .last,
.hot-lives .hd .img-box .text-area .small{
  display:inline-block;
  vertical-align:middle;
  font-size:24px;
  color: #777;
}

.hot-lives .hd .img-box .text-area .small{
  margin:0 8px;
  width:5px;height:5px;
  border-radius:100%;
  background:#a5a7aa;
}

.hot-lives .hd .img-box:hover{
  color:#12b7f5;
}

.hot-lives .hd .change{
  position:absolute;
  top:42px;right:70px;
  height:20px;line-height:20px;
  font-size:0;
}
.hot-lives .hd .change .change-icon{
  margin-right:5px;
  width:12px;height:13px;
  background:url(http://www.shanggukt.cn/images/change-icon.png) no-repeat;
}
.hot-lives .hd .change span{
  font-size:12px;color:#777;
}
.hot-lives .hd .change:hover .change-icon{
  background-position:-12px 0; 
}
.hot-lives .hd .change:hover span{color:#12b7f5;}

.hot-lives .hd .more{
  position:absolute;
  top:42px;right:0;
  height:20px;line-height:20px;
  font-size:0;color:#777;
}
.hot-lives .hd .more span{
  margin-left:8px;
  font-size:12px;
}
.hot-lives .hd .more .round{
  display:inline-block;
  vertical-align:middle;
  margin-left:3px;
  width:4px;height:4px;
  background:#777;
  border-radius:100%;
  -moz-transition:background 200ms ease-out;
  -webkit-transition:background 200ms ease-out;
  -o-transition:background 200ms ease-out;
  transition:background 200ms ease-out;
}
.hot-lives .hd .more:hover{color:#12b7f5;}
.hot-lives .hd .more:hover .round{
  background:#12b7f5;
}

.hot-lives .bd li{
  margin: 0 auto;
  width:500px;
  height: 443px;
  background: #fff;
}
.hot-lives .bd a{
  position:relative;
  display:block;
  padding:15px;
  width:470px;
  color:#12b7f5;
}

.hot-lives .bd .img-box{
  position:relative;
  height:412px;
  /* z-index:2; */
}
.hot-lives .bd .img-box img{
  display:block;
  width:100%;height:100%;
}
.hot-lives .bd .game-name{
  position:absolute;
  left:0;bottom:0;
  padding-left:10px;
  width:99px;height:31px;
  line-height:31px;
  background:url(http://www.shanggukt.cn/images/live-list-gamename.png) no-repeat;
  z-index:5;
}
.hot-lives .bd .game-name .name{
  font-size:12px;color:#fff;
}

.hot-lives .bd .sub-mask{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:#000;
  opacity:0;
  filter:alpha(opacity=00);
  /* z-index:1; */
}
.hot-lives .bd .play-icon{
  position:absolute;
  top:50%;left:50%;
  margin:-23px 0 0 -23px;
  width:45px;height:45px;
  background:url(http://www.shanggukt.cn/images/play-icon-2.png) no-repeat;
  opacity:0;
  filter:alpha(opacity=0);
  -webkit-transition:all .3s ease-out;
  -moz-transition:all .3s ease-out;
  -ms-transition:all .3s ease-out;
  -o-transition:all .3s ease-out;
  transition:all .3s ease-out;
  -webkit-transform:scale(1.5);
  -moz-transform:scale(1.5);
  -ms-transform:scale(1.5);
  transform:scale(1.5);
  z-index:2;
}

.hot-lives .bd .room-name{
  margin-top:10px;
  height:76px;line-height:26px;
  /* width:224px; */
  font-size:12px;color:#555;
  font-weight:700;
  /* overflow:hidden; */
  /* white-space:nowrap; */
  /* text-overflow:ellipsis; */
}

.hot-lives .bd .meat{
  height:50px;line-height:26px;
  font-size:0;
}
.hot-lives .bd .meat .views{
  float:right;
  margin-top:7px;
  line-height:12px;height:12px;
  font-size:12px;color:#888;
}
.hot-lives .bd .meat .anchor{
  max-width:130px;
  font-size:12px;
  background: #12b7f5;
  color: #fff;
  padding: 2px 10px;
  border-radius: 4px;
  margin: 10px 0;

}

.index-page .hot-lives{padding-bottom:60px;
margin-bottom: 100px;
}

.hot-lives .bd a:hover{
  border: 1px solid #cfcfcf;
}
.hot-lives .bd a:hover .bg{
  opacity:1;
  filter:alpha(opacity=100);
}
.hot-lives .bd a:hover .sub-mask{
  opacity:.3;
  filter:alpha(opacity=30);
}

.hot-lives .bd a:hover .play-icon{
  opacity:1;
  filter:alpha(opacity=100);
  -webkit-transform:scale(1);
  -moz-transform:scale(1);
  -ms-transform:scale(1);
  transform:scale(1);
}

.hot-lives .hd ul{
  float:left;
  margin:18px 0 0 40px;
}

.hot-lives .hd li{
  float:left;
  margin-right:20px;
}
.hot-lives .hd li a{
  display:block;
  padding:0 8px;
  height:20px;
  line-height:20px;
  border:1px solid #a5a7aa;
  font-size:12px;color:#555;
  text-align:center;
}
.hot-lives .hd li a:hover{
  background:#12b7f5;
  border:1px solid #12b7f5;
  color:#fff;
}

/* 鐧惧彉 */
.baibian-area{
  padding-top:58px;
  background:url(http://www.shanggukt.cn/images/baibian-bg.jpg) top center no-repeat;
  overflow:hidden;
}
.baibian-area .wrap{
  overflow:visible;
}
.baibian-area .hd{
  position:relative;
  height:26px;line-height:26px;
  font-size:16px;color:#f4e5dd;
  text-align:center;
}
.baibian-area .hd .bb-a{
  position:absolute;
  top:-50px;left:525px;
  width:160px;height:50px;
  line-height:50px;
  font-size:30px;color:#fff;
  font-weight:700;
  text-align:center;
}
.baibian-area .hd .bb-a:hover{color:#12b7f5;}
.baibian-area .hd p{font-weight:700;cursor:default;}
.baibian-area .hd .more{
  position:absolute;
  top:2px;right:16px;
  height:20px;line-height:20px;
  font-size:0;color:#fff;
}
.baibian-area .hd .more span{
  margin-left:8px;
  font-size:12px;
}
.baibian-area .hd .more .round{
  display:inline-block;
  vertical-align:middle;
  margin-left:3px;
  width:4px;height:4px;
  background:#fff;
  border-radius:100%;
  -moz-transition:background 200ms ease-out;
  -webkit-transition:background 200ms ease-out;
  -o-transition:background 200ms ease-out;
  transition:background 200ms ease-out;
}
.baibian-area .hd .more:hover{color:#12b7f5;}
.baibian-area .hd .more:hover .round{
  background:#12b7f5;
}
.baibian-area .bd{
  position:relative;
  margin-top:26px;
}

.baibian-area .bd .pre,
.baibian-area .bd .next{
  position:absolute;
  top:178px;
  width:24px;height:44px;
  background:url(http://www.shanggukt.cn/images/stars-arrow.png) no-repeat;
  z-index:2;
}
.baibian-area .bd .pre{
  left:-42px;
  background-position:0 0;
}
.baibian-area .bd .pre:hover{
  background-position:-24px 0;
}
.baibian-area .bd .next{
  right:-42px;
  background-position:-48px 0;
}
.baibian-area .bd .next:hover{
  background-position:-72px 0;
}
.baibian-area .bd .pre:active,
.baibian-area .bd .next:active{
  top:179px;
}

.baibian-area .left-bg-head,
.baibian-area .right-bg-head{
  position:absolute;
  top:0;
  width:360px;
  opacity:.2;
  filter:alpha(opacity=20);
  overflow:hidden;
}
.baibian-area .left-bg-head ul,
.baibian-area .right-bg-head ul{
  display:block;
  width:400px;
}
.baibian-area .left-bg-head ul{
  position:relative;
  margin-left:-40px;
  *zoom:1;
}
.baibian-area .left-bg-head{left:-360px;}
.baibian-area .right-bg-head{right:-360px;}

.baibian-area .left-bg-head li,
.baibian-area .right-bg-head li{
  float:left;
  width:200px;height:200px;
}
.baibian-area .left-bg-head .img-box,
.baibian-area .right-bg-head .img-box{
  height:100%;
}
.baibian-area .left-bg-head img,
.baibian-area .right-bg-head img{
  display:block;
  width:100%;height:100%;
}

.baibian-area .gallery-bg{
  width:1200px;
  overflow:hidden;
}
.baibian-area .gallery-bg .gallery{
  width:9999em;
}
.baibian-area .gallery-bg .gallery ul{
  display:block;
  width:1200px;
}
.baibian-area .gallery-bg .gallery li{
  float:left;
  width:200px;height:200px;
  overflow:hidden;
}
.baibian-area .gallery-bg .gallery a{
  position:relative;
  display:block;
  width:100%;height:100%;
}
.baibian-area .gallery-bg .gallery .img-box{
  position:relative;
  height:100%;
}
.baibian-area .gallery-bg .gallery .img-box img{
  display:block;
  width:100%;height:100%;
}

.baibian-area .gallery-bg .gallery .sub-mask{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:#000;
  -ms-filter:alpha(opacity=30);
  filter:alpha(opacity=30);
  opacity:.3;
  -webkit-transition:all linear 250ms;
  -moz-transition:all linear 250ms;
  -o-transition:all linear 250ms;
  transition:all linear 250ms;
  z-index:1;
}
.baibian-area .gallery-bg .gallery .live-icon{
  display:none;
  position:absolute;
  top:20px;right:0;
  z-index:3;
}

.baibian-area .gallery-bg .gallery .line{
  position:absolute;
  left:0;bottom:0;
  width:0;height:4px;
  background:#12b7f5;
  -webkit-transition:all ease-in-out 250ms;
  -moz-transition:all ease-in-out 250ms;
  -o-transition:all ease-in-out 250ms;
  transition:all ease-in-out 250ms;
  z-index:3;
}

.baibian-area .gallery-bg .gallery .meat{
  position:absolute;
  left:0;bottom:-45px;
  width:100%;
  text-align:center;
  -webkit-transition:all linear 250ms;
  -moz-transition:all linear 250ms;
  -o-transition:all linear 250ms;
  transition:all linear 250ms;
  z-index:3;
}
.baibian-area .gallery-bg .gallery .meat .name{
  height:25px;line-height:25px;
  font-size:16px;color:#fff;
  font-weight:700;
}
.baibian-area .gallery-bg .gallery .meat .views{
  margin-top:6px;
  padding-bottom:10px;
  font-size:12px;
  height:12px;line-height:12px;
  color:#e3ddd9;
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
  -webkit-transition:all linear 250ms;
  -moz-transition:all linear 250ms;
  -o-transition:all linear 250ms;
  transition:all linear 250ms;
}
.baibian-area .gallery-bg .gallery .meat .views .eyes-icon{
  background:url(http://www.shanggukt.cn/images/eyes-icon1.png) no-repeat;
}
.baibian-area .gallery-bg .gallery .meat .state-btn{
  position:relative;
  display:inline-block;
  margin-top:8px;
  padding-bottom:13px;
  width:68px;height:22px;
  line-height:22px;
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
  -webkit-transition:all linear 250ms;
  -moz-transition:all linear 250ms;
  -o-transition:all linear 250ms;
  transition:all linear 250ms;
}
.baibian-area .gallery-bg .gallery .meat .state-btn .btn-bg{
  position:absolute;
  top:0;left:0;
  width:100%;height:22px;
  background:#fff;
  border-radius:20px;
  opacity:.5;
  -ms-filter:alpha(opacity=50);
  filter:alpha(opacity=50);
}
.baibian-area .gallery-bg .gallery .meat .state-btn p{
  position:absolute;
  top:0;left:0;
  width:100%;height:22px;
  font-size:12px;color:#fff;
}

.baibian-area .gallery-bg .gallery a:hover .sub-mask{
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
}
.baibian-area .gallery-bg .gallery a:hover .line{
  width:100%;
}
.baibian-area .gallery-bg .gallery a:hover .meat{
  bottom:0;
}
.baibian-area .gallery-bg .gallery a:hover .meat .state-btn{
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100);
  margin-top:-24px;
}
.baibian-area .gallery-bg .gallery a:hover .views{
  opacity:0;
  -ms-filter:alpha(opacity=0);
  filter:alpha(opacity=0);
}

.baibian-area .gallery-bg .gallery .on-live .live-icon{
  display:block;
}
.baibian-area .gallery-bg .gallery .on-live .meat .state-btn .btn-bg{
  background:#12b7f5;
  opacity:1;
  filter:alpha(opacity=100);
}

/* 姒滃崟 */
.index-rank{padding:13px 0 50px;}
.index-rank .rank-area{
  float:left;
  margin-right:18px;
  padding-top:17px;
  width:388px;
  background:#fff;
  border-radius:5px;
}
.index-rank .rank-area .hd{
  position:relative;
  padding:0 20px;
  height:48px;line-height:48px;
  font-size:20px;color:#555;
  font-weight:700;
}
.index-rank .rank-area .hd-content{
  position:relative;
  border-bottom:1px solid #dedfe0;
}

.index-rank .rank-area .hd-content .hd-xq{
  display:inline-block;
  margin-left:4px;
  width:44px;height:20px;
  line-height:20px;
  border:1px solid #04b0f0;
  background:#fff;
  font-size:12px;color:#04b0f0;
  text-align:center;
}
.index-rank .rank-area .hd-content .hd-xq:hover{
  background:#04b0f0;
  color:#fff;
}

.index-rank .rank-area .hd .ul{
  position:absolute;
  top:4px;right:0;
}
.index-rank .rank-area .hd .ul li{
  position:relative;
  float:left;
  width:60px;height:44px;
  line-height:44px;
  font-size:0;
  background:#fff;
  font-weight:400;
  text-align:center;
}
.index-rank .rank-area .hd .ul a{
  font-size:14px;color:#555;
}
.index-rank .rank-area .hd .ul .arrow{
  display:inline-block;
  margin-left:7px;
  width:0;height:0;
  border:4px dashed transparent;
  border-top-style:solid;
  border-top-color:#555;
  overflow:hidden;
}

.index-rank .rank-area .hd .ul .active .name{
  color:#04b0f0;
}
.index-rank .rank-area .hd .ul .active .arrow{
  border-top-color:#04b0f0;
}

.index-rank .rank-area .hd .ul .rank-select{
  position:absolute;
  left:0;top:44px;
  border:1px solid #edeff0;
  z-index:3;
}
.index-rank .rank-area .hd .ul .rank-select li{
  float:none;
  width:58px;
}
.index-rank .rank-area .hd .ul .rank-select a{
  display:block;
  background:#fff;
}
.index-rank .rank-area .hd .ul .rank-select a:hover{
  background:#04b0f0;
  color:#fff;
}

.index-rank .rank-area .rank-content li{
  height:68px;line-height:68px;
}
.index-rank .rank-area .rank-content li .rank-li-content{
  border-top:1px solid #f3f3f3;
}

.index-rank .rank-area .rank-content a,
.index-rank .th-rank .rank-content li{
  display:block;
  padding:0 20px;
  height:100%;
  background:#fff;
  overflow:hidden;
}
.index-rank .th-rank .rank-content li{
  height:68px;
  cursor:default;
}

.index-rank .rank-area .rank-content .rankNum{
  float:left;
  margin-right:20px;
  width:25px;height:100%;
  line-height:74px;
  font-size:18px;color:#8c8c8c;
  font-family:Arial;
  text-align:center;
}
.index-rank .rank-area .rank-content .mid-area{
  float:left;
  width:154px;
  font-size:0;
}
.index-rank .rank-area .rank-content .mid-area .anchor-grade,
.index-rank .rank-area .rank-content .mid-area .all-level{
  margin-right:14px;
}

.index-rank .rank-area .rank-content .mid-area .name{
  display:inline-block;
  vertical-align:-34px;
  width:94px;
  font-size:12px;color:#555;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.index-rank .rank-area .rank-content .num{
  position:relative;
  float:right;
  font-size:0;color:#555;
}
.index-rank .rank-area .rank-content .num span{
  font-size:12px;
  margin-right:20px;
  display:inline-block;
  vertical-align: middle;
}
.index-rank .rank-area .rank-content .num .live-icon{
  margin-right:10px;
  display:none;
  width:14px;height:14px;
  background:url(http://www.shanggukt.cn/images/new-rank-live.gif) no-repeat;
}

.index-rank .rank-area .rank-content .num .change-icon{
  display:inline-block;
  vertical-align: middle;
  width:8px;height:8px;
  background:url(http://www.shanggukt.cn/images/updown-icon.png) 0 -16px no-repeat;
}

.index-rank .rank-area .rank-content li .down .change-icon{
  background-position:0 -8px;
}
.index-rank .rank-area .rank-content li .up .change-icon{
  background-position:0 0px;
}

.index-rank .rank-area .rank-content .on-live .num .live-icon{
  display:inline-block;
}
.index-rank .rank-area .rank-content{
  height:771px;
  overflow:hidden;
}
.index-rank .rank-area .rank-content .nothing-rank{
  height:100%;
  background:url(http://www.shanggukt.cn/images/nothing-rank.png) center center no-repeat;
}
.index-rank .rank-area .rank-content .first{
  padding-top:20px;
  height:139px;
  line-height:inherit;
}
.index-rank .rank-area .rank-content .first .rank-li-content{
  border-top:none;
}

.index-rank .rank-area .rank-content .first .rankNum{
  margin-top:43px;
  margin-right:44px;
  width:25px;height:30px;
  line-height:inherit;
  background:url(http://www.shanggukt.cn/images/new-rank-num-1.png) no-repeat;
  font-size:0;
}

.index-rank .rank-area .rank-content .second .rankNum{
  margin-top:20px;
  width:25px;height:30px;
  line-height:inherit;
  background:url(http://www.shanggukt.cn/images/new-rank-num-2.png) no-repeat;
  font-size:0;
}
.index-rank .rank-area .rank-content .third .rankNum{
  margin-top:20px;
  width:25px;height:30px;
  line-height:inherit;
  background:url(http://www.shanggukt.cn/images/new-rank-num-3.png) no-repeat;
  font-size:0;
}

.index-rank .rank-area .rank-content .first .mid-area{
  width:204px;
}
.index-rank .rank-area .rank-content .first .img-box{
  position:relative;
  padding:20px 75px 3px 69px;
  width:60px;height:60px;
}
.index-rank .rank-area .rank-content .first .img-bg{
  position:absolute;
  top:0;left:0;
  width:204px;height:83px;
  background:url(http://www.shanggukt.cn/images/new-rank-li-1.png) no-repeat;
  z-index:2;
}

.index-rank .rank-area .rank-content .first img{
  position:relative;
  border-radius:100%;
  z-index:1;
}
.index-rank .rank-area .rank-content .first .anchor-grade,
.index-rank .rank-area .rank-content .first .all-level{
  position:absolute;
  bottom:-6px;left:76px;
  margin-right:0;
  z-index:3;
}

.index-rank .rank-area .rank-content .first .name{
  display:block;
  height:55px;width:100%;
  line-height:55px;
  font-size:18px;color:#333;
  text-align:center;
}

.index-rank .zb-rank .rank-content .first .img-bg{
  background:url(http://www.shanggukt.cn/images/new-rank-li-2.png) no-repeat;
}
.index-rank .zb-rank .rank-content .mid-area{
  width:220px;
}
.index-rank .zb-rank .rank-content .mid-area .mid-top{
  margin-top:16px;
  height:20px;line-height:20px;
}

.index-rank .zb-rank .rank-content .game-name,
.index-rank .zb-rank .rank-content .zb-title{
  font-size:12px;color:#a5a7aa;
  line-height:30px;
}

.index-rank .zb-rank .rank-content .mid-area .name{
  vertical-align:middle;
  width:160px;
}

.index-rank .zb-rank .rank-content .first .mid-area .name{
  width:100%;
}

.index-rank .zb-rank .rank-content a:hover{
  background:#f5f5f5;
}
.index-rank .zb-rank .rank-content .first a:hover{
  background:#fff;
}
.index-rank .zb-rank .rank-content a:hover .game-name{
  display:none;
}
.index-rank .zb-rank .rank-content a:hover .zb-title{
  display:block;
  color:#04b0f0;
}

.index-rank .th-rank .rank-content .mid-area{
  width:250px;
}
.index-rank .th-rank .rank-content .mid-area .name{
  width:192px;
}

/* 鍚戜笂寮圭獥 */
.up-area{
  position:fixed;
  bottom:100px;right:24px;
  width:54px;
  z-index:15;
}

* html .up-area /* IE6 */  {
  _position:absolute;
  _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)-100));
}

.up-area a{
  position:relative;
  display:block;
  margin-bottom:5px;
  width:54px;height:54px;
}

.up-area a i{
  position:absolute;
  right:0;bottom:0;
  width:100%;height:100%;
  background:url(http://www.shanggukt.cn/images/up-icon.png) no-repeat;
  transition:background-position 0.2s ease-in;
  -webkit-transition:background-position 0.2s ease-in;
  -moz-transition:background-position 0.2s ease-in;
  -ms-transition:background-position 0.2s ease-in;
  -o-transition:background-position 0.2s ease-in;
}

.up-area .up-iconz.visiblehide{
  opacity:0;
}
.up-area .up-iconz{
  opacity:1;
}

.up-area .up-iconz i{background-position:0 0;}
.up-area .my-live i{background-position:0 -54px;}
.up-area .mobile-app i{background-position:0 -108px;}
.up-area .feedback-icon i{
  margin-bottom:0;
  background-position:0 -162px;
}

.up-area .up-iconz:hover i{
  background-position:-54px 0;
}
.up-area .my-live:hover i{
  background-position:-54px -54px;
}
.up-area .mobile-app:hover i{
  background-position:-54px -108px;
}
.up-area .feedback-icon:hover i{
  background-position:-54px -162px;
}

.up-area .active i{
	background-position-x:-54px;
}

.up-area .mobile-app:hover .bg{
  position:absolute;
  bottom:0;left:-150px;
  width:143px;height:212px;
  background:url(http://www.shanggukt.cn/images/up-area-qn-icon_1.png) no-repeat;
  z-index:1;
}

.up-area .mobile-app .bg-1{
  position:absolute;
  bottom:0;left:-150px;
  width:143px;height:212px;
  background:url(http://www.shanggukt.cn/images/up-area-qn-icon_1.png) no-repeat;
  z-index:2;
}
.up-area .mobile-app .bg-1 .close{
  position:absolute;
  top:-28px;right:-12px;
  width:22px;height:22px;
  background:url(http://www.shanggukt.cn/images/up-area-qn-icon-close.png) no-repeat;
	cursor:pointer;
}

/* 璧涗簨鍏ュ彛 */
.match-orally-area{
  padding:30px 0 45px;
  background:#f5f5f5;
}
.match-orally-area .bd{
  position:relative;
  margin-top:10px;
}

.match-orally-area .bd .pre,
.match-orally-area .bd .next{
  position:absolute;
  top:70px;
  width:24px;height:44px;
  background:url(http://www.shanggukt.cn/images/index-orally-arrow.png) no-repeat;
}
.match-orally-area .bd .pre{
  left:-54px;
  background-position:0 0;
}
.match-orally-area .bd .pre:hover{
  background-position:-24px 0;
}
.match-orally-area .bd .pre:active{
  top:71px;
  background-position:-48px 0;
}
.match-orally-area .bd .pre.disabled,
.match-orally-area .bd .next.disabled{ display: none; }

.match-orally-area .bd .next{
  right:-54px;
  background-position:-72px 0;
}
.match-orally-area .bd .next:hover{
  background-position:-96px 0;
}
.match-orally-area .bd .next:active{
  top:71px;
  background-position:-120px 0;
}

.match-orally-area .gallery{
  width:1200px;
  overflow:hidden;
}
.match-orally-area .gallery ul{
  position:relative;
  display:block;
  width:9999em;
}
.match-orally-area .gallery li{
  float:left;
  margin-right:30px;
  width:216px;
}
.match-orally-area .gallery a{
  display:block;
  width:212px;height:182px;
  border:2px solid #f5f5f5;
}
.match-orally-area .gallery .img-box,
.match-orally-area .gallery .img-box img{
  position:relative;
  width:100%;height:100%;
}
.match-orally-area .gallery .img-box .match-label{
  position:absolute;
  top:0;left:0;
  padding:0 5px 0 10px;
  height:24px;line-height:24px;
  font-size:12px;color:#fff;
  background:#12b7f5;
}
.match-orally-area .gallery .img-box .match-label span{
  max-width: 180px;
  height: 24px;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.match-orally-area .gallery .img-box .match-label .sub-right{
  position:absolute;
  top:0;right:-16px;
  width:16px;height:24px;
  background:url(http://www.shanggukt.cn/images/index-orally-icon.png) no-repeat;
}

.match-orally-area .gallery a:hover{
  border-color:#12b7f5;
}
.match-orally-area .gallery li .name{
  margin-top:10px;
  width:216px;
  height:22px;line-height:22px;
  font-size:14px;color:#555;
  text-align:center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.match-orally-area .gallery li .sub-title{
  height:22px;line-height:22px;
  font-size:0;color:#a5a7aa;
  text-align:center;
}
.match-orally-area .gallery li .sub-title span{
  max-width:182px;
  font-size:12px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.match-orally-area .gallery li .live-icon{
  margin-left:5px;
}




.gameTitle {
  font-size: 26px;
  font-weight: bolder;
  margin: 20px auto;
  text-align: center;
  color: #555;
}
.infoTitle {
  font-size: 20px;
  margin: 20px 0;
  font-weight: bolder;
  color: #555;
  padding: 10px;
  border: 1px solid #dfdfdf;
}

.infoContent {
  text-indent: 2rem;
  font-size: 16px;
  color: #555;
  margin-bottom: 20px;
}

.infoContent div {
  margin: 0 auto;
  text-align: center;
}

.infoContent div img{
  width: calc(50% - 60px);
  height:900px;
  margin-right: 30px;
} 

















/* buy */
.pay-wrap {min-height:300px;height:auto!important;height:300px}
.m-tab li {float:left;background-color:#f0f0f0;line-height:60px;padding-top:6px;text-align:center}
.m-tab li.active {background-color:#fff;font-size:16px}
.m-tab a, .m-tab label {color:#535353;display:block;line-height:48px;border-top:6px solid #f0f0f0}
.m-tab .active a, .m-tab .active label {border-top-color:#118eea;color:#118eea}
.m-tab label {cursor:pointer}

.pay-panel {background-color:#fff;padding:45px 0;font-size: 16px;}
.pay-panel li {clear:both;margin-bottom:22px}
.label-title, .label-item {float:left}
.label-item {position:relative}
.label-title {width:130px;padding-right:10px;text-align:right;line-height:50px}
.form-item {width:262px;padding:13px 14px 11px;border:1px solid #333;border-radius: 5px;height:24px;display:inline-block;margin-right:10px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition: all 0.3s ease;-ms-transition:all 0.3s ease;transition: all 0.3s ease}
.form-item.active {border-color:#108ee9}
.form-item.has-error {border-color:#f04134}
.form-item input {display:block;width:100%;font-size:14px;height:24px;line-height:24px;border: 0;outline: none; box-shadow: none;}
.form-item input:focus {
  border: none!important;
}
.form-tips {height:50px;line-height:50px;position:absolute;left:100%;top:0;display:block;width:100%}
.amounts .form-tips {height:35px;line-height:35px;top:56px;}
.form-tips i {color:#f8784e;font-size:18px;margin-right:4px;vertical-align:middle}

.label-cell {padding:6px 0 12px;font-size:0px}
.label-cell label {padding:10px 12px;line-height:16px;display:inline-block;cursor:pointer;background-color:#333;color:#f6f7f7;border:1px solid #d9d9d9;border-radius:5px;margin:0 10px 0 0;font-size:14px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition: all 0.3s ease;-ms-transition:all 0.3s ease;transition: all 0.3s ease}
.label-cell label:hover {border-color:#ff9307}
.label-cell label.active {background-color:#ffdea8;border-color:#ff9307}

.label-code, .code-fresh {float:left} 
.code-fresh {line-height:50px;padding:0 20px 0 10px;margin-left: -102px}
.code-fresh span {padding-left:10px}

.label-option {position:relative;width:292px;padding-right:12px;margin-left:140px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}
.label-option .form-tips {height:40px;line-height:40px}
.label-option a, .label-option input {color:#fff;text-align:center;background-color:#333;border:1px solid #000;    font-size: 16px;border-radius:4px;width:100%;height:45px;line-height:45px;display:inline-block;margin:0 0 12px;cursor:pointer}
.label-option.disabled {cursor: not-allowed;}
.label-option.disabled a, .label-option.disabled input {background-color: #f7f7f7;border-color:#d9d9d9;color: #bfbfbf;pointer-events: none;}
.option-loading {color:#fff;text-align:center;background-color:#61b4f1;border:1px solid #61b4f1;width:292px;border-radius:4px;position: absolute;left:0;top:0;cursor: default;}
.option-loading i {font-style: normal;display:inline-block;height:38px;line-height:38px;display:inline-block;padding-left: 40px;background: url(http://www.shanggukt.cn/img/ajax_loading.gif) no-repeat 0 50%}

.auto-mail {background:#fff;border:1px solid #4190db;display:none;width:290px}
.auto-mail ul {padding:10px 0 0;height:150px;overflow-y:scroll}
.auto-mail li {cursor:pointer;padding:0 14px;font-size:12px;line-height:30px;overflow:hidden}
.auto-mail .hover {background-color:#6eb6fe;color:#fff}





.pay-wrap {
  min-height: 300px;
  height: auto!important;
}
.pay-panel {
  background-color: #fff;
  padding: 45px 0;
}
.pay-tab li {width:33.333%;position: relative;}
.pay-tab .ico-hot {position: absolute;left:250px;top:15px;width:32px;height:24px;background:url(http://www.shanggukt.cn/img/ico_hot.png) no-repeat}
.form-small, .custom p {display:inline-block;*display:inline;zoom:1}
.form-small {width:100px;padding:5px 6px 4px;margin-right:4px}
.form-settler {color:#118eea}
.custom p {line-height:35px;vertical-align:top}
.induction {font-style:normal}
.induction strong {color:#f95f4a}

.num, .discount {float:left}
.num {line-height:50px;width:auto;position:relative}
.discount {padding:11px 0 0 10px;position:relative;z-index:100}
.discount p {border:1px solid #76bcf1;height:25px;line-height:25px;background-color:#e1ecf5;position:relative;margin-left:10px;padding:0 10px;border-radius:2px}
.discount em {position:absolute;left:-6px;top:8px;width:6px;height:9px;background:url(http://www.shanggukt.cn/img/ico_arrow_left.png) no-repeat}
.num span, .custom span, .discount b span, .discount i, .tips td strong, .tips td span {color:#f95f4a}
.num span, .discount b span, .custom span, .tips td span {font-weight:700}
.num span i {font-style:normal}
.discount b {font-weight:400}
.discount i {cursor:help}
.tips-show {position:relative;z-index:10}

.tips {line-height:30px;position:absolute;right:-304px;top:48px;display:none}
.tips i {position:absolute;left:14px;top:-7px;width:14px;height:8px;background:url(http://www.shanggukt.cn/img/ico_arrow_top.png) no-repeat}
.tips-wrap {width:340px;border:1px solid #e4e4e4;}
.tips table {width:340px}
.tips th, .tips td {padding:8px 10px}
.tips th {background-color:#f0f4f6;font-weight:400}
.tips td {background-color:#fff;border-top:1px solid #e4e4e4}
.tips td p {text-align:center}
.tips td strong {display:block;text-align:center}


.channel-tab, .others-tab {padding-top:0}
.channel-tab label, .others-tab label {padding:10px 26px;background-position:50% 50%;background-repeat:no-repeat;width:98px;height:27px;text-indent:-9999em;overflow:hidden;-webkit-transition:none;-moz-transition:none;-o-transition:none;-ms-transition:none;transition:none;float:left}
.channel-tab label.active, .others-tab label.active {background-color:#f7f7f7;border-width:2px;padding:9px 25px}
.ico-alipay {background-image: url(../images/ico_channel1.png)}
.ico-wepay {background-image: url(../images/ico_channel2.png)}
.ico-unionpay {background-image: url(../images/ico_channel3.png)}
.ico-unionpayqrc {background-image: url(http://www.shanggukt.cn/img/ico_channel4.jpg)}
.ico-cmcc {background-image: url(http://www.shanggukt.cn/img/ico_cmcc.png)}
.ico-cucc {background-image: url(http://www.shanggukt.cn/img/ico_cucc.png)}
.ico-ctcc {background-image: url(http://www.shanggukt.cn/img/ico_ctcc.png)}

.bank-list {width:600px;display:none}
.bank-list label {float:left;width:97px;padding-left:24px;height:31px;line-height:31px;cursor:pointer;margin:-1px -1px 0 0;background:url(http://www.shanggukt.cn/img/ico_check.png) no-repeat -121px 0;position:relative;font-size:12px;/*z-index:9*/}
.bank-list label:hover {background-position:-242px 0;z-index:3}
.bank-list label.active, .bank-list label.active:hover {background-position:0 0;z-index:3}
.bank-list i {background:url(http://www.shanggukt.cn/img/ico_banks.png) no-repeat;display:inline-block;width:18px;height:18px;position:relative;top:4px;margin-right:3px}
.bank-list .active {border-color:#ffa00a}
i.ico-icbc {background-position:-18px 0}
i.ico-abc {background-position:-54px 0}
i.ico-boc {background-position:-72px 0}
i.ico-ccb {background-position:-36px 0}
i.ico-bcm {background-position:-36px -18px}
i.ico-cmb {background-position:0 0}
i.ico-post {background-position:-18px -18px}
i.ico-cib {background-position:0 -18px}
i.ico-nbcb {background-position:-90px -36px}
i.ico-spdb {background-position:-54px -18px}
i.ico-bos {background-position:0 -54px}
i.ico-pingan {background-position:0 -36px}
i.ico-cmbc {background-position:-90px -18px}
i.ico-cebb {background-position:-90px 0}
i.ico-ecitic {background-position:-126px 0}
i.ico-gdb {background-position:-72px -18px}
i.ico-other {background-position:-172px -18px}

/* ΢Ðŵ¯²ã */
.qrcode, .qrtips {float:left;width:50%}
.qr-start, .qr-success {padding-left: 56px;}
.qrcode p, .qrcode h5 {line-height:1.8;margin-bottom:20px}
.qrcode span {color:#118eea}
.qrtips {padding-top:280px;background:url(http://www.shanggukt.cn/img/bg_qrtips.png) no-repeat 60% 10px;text-align:center}
.qrtips h6 a, .pop-ebank h6 a {color:#fff;background-color:#108ee9;border-color:#108ee9;border-radius:4px;height:32px;line-height:32px;padding:0 30px;display:inline-block;font-size:12px}
.qrtips h6 a {margin-bottom:12px}
.qr-wechat {width: 134px;height: 134px;position: relative}
.wechat-logo {width: 32px;height: 32px;position: absolute;left: 51px;top:51px}
.qr-success {padding-top:40px}
.qr-success h5 {width: 134px;text-align: center;font-size:20px}

/* ÍøÉÏÒøÐи¶¿îµ¯²ã */
.pop-ebank .pop-bd {text-align:center}
.pop-ebank h5 {font-size:16px}
.pop-ebank h6 a {margin:22px 0}

/* ÔÆÉÁ¸¶É¨Â뵯²ã */
.pop-unionpayqrc .qrtips {background-image:url(http://www.shanggukt.cn/img/bg_qrtips_unionpay.png)}

/* ³äÖµ³É¹¦»òʧ°Ü */
.feedback-wrap {background:#f0f0f0 url(http://www.shanggukt.cn/img/bg_feedback.png) no-repeat 50% 100%;padding:60px 0 415px}
.feedback {background-color:#fff;padding:80px 0 100px 530px;background-position:380px 70px;background-repeat:no-repeat}
.feedback h6 {font-size:16px;margin-bottom:12px;line-height:30px}
.feedback p {line-height:24px;margin-bottom:10px}
.feedback.success {background-image:url(http://www.shanggukt.cn/img/ico_feed_success.png)}
.feedback.failed {background-image:url(http://www.shanggukt.cn/img/ico_feed_failed.png)}

/* ÔÚÏß³äÖµ³£¼ûÎÊÌâ */
.pay-tips {padding:40px;border-top:1px solid #e4e4e4;background-color:#fff;margin-bottom:-45px;#zoom:1}
.pay-tips h3 {font-size:16px;margin-bottom:16px}
.pay-tips h3 i {font-size:20px;color:#f3b35f;margin-right:4px;vertical-align:middle}
.pay-tips dl {margin-bottom:12px;line-height:24px;padding-left:24px;}
.pay-tips dt {color:#118eea;cursor:pointer}
.pay-tips dt i {font-size:16px;vertical-align:middle;margin-right:4px}
.pay-tips dd {display:none}

/* ÆäËû³äÖµ·½Ê½ */
/*.pay-mobile {padding-top:35px}*/
.pay-trader, .pay-mobile {display:none}
.others-hd {padding-bottom:45px;text-align:center}
.others-hd label {padding:14px 40px;margin:0 20px;cursor:pointer}
.others-hd label.active {background-color:#d7e4ed;border-radius:5px}
.by-sms, .by-3rd {display:none}
.by-sms .sms-rating {width:400px}
.by-sms .sms-rating label {width:35px;text-align:center;margin-bottom:12px}
.by-sms .custom {margin-top:-12px}
.others-bd .custom span {color:#f95f4a}
.by-3rd .service-tips {margin-left:370px}

/* ³£¼û FAQ */
.faq-wrap h3 {font-size:16px;height:60px;line-height:60px}
.faq-side, .faq-main {float:left}
.faq-side {width:250px;background-color:#ededed;min-height:900px;height:auto!important;height:900px}
.faq-side h3, .faq-side a {padding:0 25px}
.faq-side h3{background-color:#dfdfdf}
.faq-side ul {padding:20px 0}
.faq-side li {line-height:42px;height:42px}
.faq-side a {color:#535353;display:block}
.faq-side .active {background-color:#fff}
.faq-side .active a {color:#00b0ff}
.faq-main {width:960px}
.faq-main h3 {background-color:#ededed;color:#00b0ff;padding-left:35px}
.faq-article {background-color:#fff;padding:35px;min-height:770px;height:auto!important;height:770px;line-height:1.8}
.faq-article dl, .faq-article p {margin-bottom:14px}
.faq-article dt, .faq-article b, .faq-article strong {font-weight:700;color:#00b0ff}
.faq-article a {color:#35adf7;border-bottom:1px solid #35adf7;display:inline-block;line-height:normal;margin:0 2px}
.faq-article a:hover {border-bottom-color:transparent}
.faq-article img {max-width:100%}

/* ¶¨ÏòÓÎÏ·³äÖµ */
.form-settler p {line-height:50px}
.direction .custom {padding-top:6px}

.pay-panel li {
  clear: both;
  margin-bottom: 22px;
}

.clearfix {
  zoom: 1;
}