﻿@charset "UTF-8";

.m-game-empty {
	padding: 88px 0;
	margin-bottom: 20px;
	text-align: center;
	border-radius: 4px;
	color: #ccc
}

.m-game-empty i {
	font-size: 64px;
	line-height: 1
}

.m-pages {
	margin: 5px auto;
	text-align: center;
	font-size: 0
}

.m-pages>* {
	display: inline-block;
	cursor: pointer;
	margin: 0 2px;
	padding: .1em .6em;
	border: 1px solid #e6e6e6;
	font-size: 13px;
	vertical-align: middle
}

.m-pages>*:hover {
	background: #f3f3f3
}

.m-pages>*.cur,
.m-pages>*.cur:hover {
	border-color: #f90;
	background: 0;
	color: #f90
}

.m-pages.z-dot>* {
	text-indent: -9999em;
	width: 11px;
	height: 11px;
	margin: 0 2px;
	padding: 0;
	border: 0;
	background: #ccc;
	border-radius: 50%
}

.m-pages.z-dot>*:hover {
	background: #999
}

.m-pages.z-dot>*.cur,
.m-pages.z-dot>*.cur:hover {
	background: #f90
}

.m-pane-focus {
	position: relative
}

.m-pane-focus .g-inner {
	margin: -320px auto 320px
}

.m-banner {
	position: relative;
	z-index: 1;
	overflow: hidden;
	width: 100%;
	height: 320px
}

.m-banner .gallery li {
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: .5s ease
}

.m-banner .gallery li a {
	display: block;
	width: 100%;
	height: 100%;
	background: no-repeat 50% 0
}

.m-banner .nav {
	position: absolute;
	z-index: 10;
	left: 50%;
	bottom: 20px;
	text-align: center;
	transform: translateX(-50%)
}

.m-banner .nav li {
	display: inline-block;
	margin: 0 3px;
	width: 30px;
	height: 2px;
	background: rgba(250, 250, 250, .6);
	background: #444\0/;
	cursor: pointer;
	transition: .3s ease
}

.m-banner .nav li.cur {
	width: 50px;
	background: rgba(246, 129, 6, .95);
	background: #f68107\0/
}

.m-banner .gallery li.cur {
	opacity: 1;
	z-index: 1
}

.m-banner .slider .btn-prev,
.m-banner .slider .btn-next {
	position: absolute;
	top: 50%;
	z-index: 10;
	margin-top: -36px;
	padding: 20px 0;
	width: 40px;
	height: 72px;
	cursor: pointer;
	line-height: 32px;
	font-size: 32px;
	text-align: center;
	color: #fff;
	text-shadow: 0 0 15px rgba(0, 0, 0, .5);
	opacity: 0;
	transition: .3s ease
}

.m-banner .slider .btn-prev:hover,
.m-banner .slider .btn-next:hover {
	background: rgba(0, 0, 0, .5)
}

.m-banner .slider .btn-prev {
	left: -40px
}

.m-banner .slider .btn-next {
	right: -40px
}

.m-banner.z-over .nav li {
	height: 6px
}

.m-banner.z-over .slider .btn-prev {
	left: 0;
	opacity: 1
}

.m-banner.z-over .slider .btn-next {
	right: 0;
	opacity: 1
}

.m-central-user {
	position: absolute;
	top: 0;
	right: 10;
	z-index: 5;
	width: 320px;
	height: 300px;
	background: rgba(0, 0, 0, .7);
	color: #e3e3e3;
	border-radius: 0 0 6px 6px
}

.m-central-user:after {
	position: absolute;
	left: 5px;
	bottom: -18px;
	border: solid transparent;
	border-width: 18px 155px 0;
	border-top-color: rgba(0, 0, 0, .7);
	content: ''
}

.m-central-user .btn {
	display: block;
	margin-bottom: 10px;
	width: 100%;
	line-height: 32px;
	font-size: 16px
}

.m-central-user .btn.hollow {
	border: 1px solid #d17b0b;
	background: rgba(0, 0, 0, .2);
	line-height: 30px;
	color: #f7930f
}

.m-central-user .m-third-login {
	overflow: hidden
}

.m-central-user .m-third-login label {
	float: left;
	line-height: 32px
}

.m-central-user .m-third-login p {
	float: right
}

.m-central-user .m-third-login p a {
	display: inline-block;
	font-size: 28px;
	line-height: 1
}

.m-central-user .m-third-login p a:hover {
	text-decoration: none
}

.m-central-user .loginbox {
	padding: 20px 30px;
	text-align: center
}

.m-central-user .loginbox .avatar {
	margin: 0 auto 10px;
	width: 64px;
	height: 64px
}

.m-central-user .loginbox .avatar img {
	width: 100%;
	height: 100%;
	border-radius: 50%
}

.m-central-user .loginbox .tip {
	margin-top: 10px;
	font-size: 13px;
	color: #aaa
}

.m-central-user .breginfo {
	padding: 15px 20px 0
}

.m-central-user .breginfo .avatar img {
	width: 50px;
	height: 50px;
	border-radius: 50%
}

.m-central-user .breginfo .oftop {
	height: 50px;
	margin-left: 65px
}

.m-central-user .breginfo .oftop p {
	margin-top: 5px;
	font-size: 13px;
	color: #fc0
}

.m-central-user .breginfo .ofbar {
	clear: both;
	padding: 10px 0 5px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #444;
	text-align: center
}

.m-central-user .logmybox {
	padding: 0 20px
}

.m-central-user .logmybox .logmytit {
	color: #999
}

.m-central-user .logmybox .logmycon {
	min-height: 120px
}

.m-central-user .logmybox .logmycon .m-game-empty {
	padding: 60px 0
}

.m-central-user .logmybox .logmycon a {
	display: block;
	padding: 2px 0;
	overflow: hidden
}

.m-central-user .logmybox .logmycon a>* {
	display: inline-block;
	font-size: 13px;
	vertical-align: middle;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-central-user .logmybox .logmycon a>h4 {
	float: left;
	width: 200px;
	margin-top: 5px;
}

.m-central-user .logmybox .logmycon a>em {
	float: right;
	max-width: 6em;
	padding: 0 .2em;
	text-align: right
}

.m-central-user .logmybox .logmycon a:hover {
	color: #ffd900
}

.m-central-user .logmybox .logmycon a:hover em {
	background: #ffd900;
	color: #000
}

.m-safe-pop {
	position: absolute;
	right: 0;
	top: 32px
}

.m-safe-pop .f-dialog {
	position: absolute;
	top: 0;
	right: 0;
	width: 350px;
	border: 1px solid #e9e9e9;
	border-radius: 0
}

.m-safe-pop .f-dialog:before,
.m-safe-pop .f-dialog:after {
	content: none
}

.m-safe-pop .f-dialog-header {
	padding: 20px 0 0;
	font-size: 18px;
	color: #ff5757
}

.m-safe-pop .f-dialog-footer {
	padding: 20px 0 30px
}

.m-safe-pop .f-dialog-footer .btn {
	background: #ff5757;
	color: #fff;
	width: 180px;
	padding: 0;
	line-height: 40px
}

.m-safe-pop .layer-close {
	position: absolute;
	right: 5px;
	top: 0;
	width: 30px;
	padding: 10px 0;
	text-align: center;
	font-size: 16px;
	cursor: pointer;
	z-index: 20
}

.m-index-service .f-sub-layer {
	float: right;
	margin-left: 5px
}

.m-index-service .f-sub-hook {
	padding: 0 10px;
	border: 1px solid #ccc;
	background: #fff;
	line-height: 18px;
	border-radius: 5px;
}

.m-newposts {
	position: relative;
	overflow: hidden;
	height: 20px;
	padding-left: 22px
}

.m-newposts:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	line-height: 20px;
	color: #aaa;
	font-family: 'iconfont';
	content: '\e6c8'
}

.m-newposts dd.move {
	transition: .3s ease;
	transform: translateY(-20px)
}

.m-newposts a {
	display: block;
	overflow: hidden;
	width: 280px;
	height: 20px;
	line-height: 20px;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-newposts span {
	float: right;
	margin-left: 1em;
	color: #999;
	font-size: 13px
}

.m-heralds {
	background: #fff;
	box-shadow: 0 0 0 1px #f0f0f0
}

.m-heralds .m-tab-hook {
	overflow: hidden;
	margin-top: -1px;
	line-height: 40px
}

.m-heralds .m-tab-hook li {
	position: relative;
	float: left;
	width: 33.33333%;
	border-top: 1px solid transparent;
	cursor: pointer;
	color: #888;
	font-size: 15px;
	text-align: center
}

.m-heralds .m-tab-hook li:not(:last-child):before {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 1px;
	background: linear-gradient(rgba(238, 238, 238, 1), rgba(238, 238, 238, .3));
	background: #eee\0/;
	content: ''
}

.m-heralds .m-tab-hook li.active {
	border-color: #ffd900;
	color: #333;
	font-weight: bold
}

.m-heralds .m-tab-panel {
	padding-bottom: 10px
}

.m-herald-data,
.m-herald-game {
	margin: 2px 2px 12px
}

.m-herald-data li {
	overflow: hidden;
	padding: 0 15px;
	border-bottom: 1px dotted #eee;
	font-size: 13px;
	line-height: 35px
}

.m-herald-data li:hover {
	background: #f9f9f9
}

.m-herald-data li>* {
	display: block;
	overflow: hidden;
	float: left;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-herald-data li .game {
	padding-right: 10px;
	width: 39%;
	background: no-repeat 95% 50%
}

.m-herald-data li .game.hot {
	padding-right: 17px;
	background-image: url(/skin/img/g_hot.gif)
}

.m-herald-data li .game.official {
	padding-right: 16px;
	background-image: url(/skin/img/g_official.gif)
}

.m-herald-data li .game.h5 {
	padding-right: 16px;
	background-image: url(/skin/img/g_h5.gif)
}

.m-herald-data li .time {
	width: 33%
}

.m-herald-data li .server {
	width: 28%;
	text-align: right
}

.m-herald-data li .server em {
	display: inline-block;
	width: 60px;
	background: #197fe3;
	line-height: 24px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	border-radius: 5px
}

.m-herald-data li.now {
	border-color: #f6dd81;
	background: #fffdeb
}

.m-herald-data li.now .time {
	color: #f20;
	font-weight: bold
}

.m-herald-data li.top {
	border-color: #f6dd81;
	background: #fffbbb;
	color: #f20
}

.m-herald-data li.top .time {
	font-weight: bold
}

.m-herald-data li.top .game {
	background-image: url(/skin/img/g_top.gif)
}

.m-herald-game li {
	position: relative;
	overflow: hidden;
	border-bottom: 1px dotted #eee;
	padding: 10px 0;
	font-size: 13px
}

.m-herald-game .figure {
	position: absolute;
	left: 10px;
	top: 10px
}

.m-herald-game .figure img {
	width: 60px;
	height: 60px;
	border-radius: 10px;
}

.m-herald-game .info {
	float: left;
	padding-left: 82px;
	max-width: 200px;
	height: 64px
}

.m-herald-game .info h3 {
	overflow: hidden;
	font-size: 15px;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-herald-game .info p {
	font-size: 12px
}

.m-herald-game .btn {
	float: right;
	margin: 17px 10px 0 0;
	width: 70px;
	line-height: 26px;
	border-radius: 5px
}

.m-panel {
	margin-top: 40px
}

.m-panel-header {
	position: relative;
	margin-bottom: 20px;
	height: 20px;
	line-height: 20px
}

.m-panel-header>h2 {
	display: inline-block;
	border-left: 4px solid #ffd900;
	margin-right: 20px;
	padding-left: 14px;
	font-size: 20px
}

.m-panel-header>p,
.m-panel-header .sub {
	display: inline-block;
	font-size: 14px;
	vertical-align: top
}

.m-panel-header .beside {
	position: absolute;
	top: 0;
	right: 0
}

.m-panel-header .besort {
	margin-right: 20px
}

.m-panel-header .m-tab-hook {
	font-size: 0
}

.m-panel-header .m-tab-hook a {
	display: inline-block;
	border-top: 1px solid transparent;
	margin-right: 1px;
	width: 110px;
	background: #e3e3e3;
	font-size: 16px;
	line-height: 39px;
	text-align: center
}

.m-panel-header .m-tab-hook a.active {
	border-color: #ffd900;
	background: #fff;
	color: #f60;
	font-weight: bold
}

.m-panel-header .m-tab-hook a:hover {
	text-decoration: none
}

.m-panel-header .besort .cur {
	color: #f60;
	font-weight: bold
}

.m-panel-header .besort .cur:before {
	content: '\e60f ';
	font-family: 'iconfont'
}

.m-panel-header .besort .loading {
	position: relative;
	padding-left: 28px
}

.m-panel-header .besort .loading:before {
	content: '';
	position: absolute;
	left: 6px;
	top: 50%;
	margin-top: -9px;
	width: 20px;
	height: 20px;
	vertical-align: middle;
	background: url(/skin/img/g_loading.gif) no-repeat;
	background-size: 100%
}

.m-figure-box {
	position: relative;
	display: block;
	background: #fff
}

.m-figure-box .figure {
	position: relative;
	display: block;
	padding-bottom: 62%;
	height: 0;
	overflow: hidden
}

.m-figure-box.z-vip:before,
.m-figure-box.z-official:before,
.m-figure-box.z-h5:before {
	position: absolute;
	left: -1px;
	top: -1px;
	z-index: 10;
	width: 50px;
	height: 50px;
	background: url(/skin/img/icon_property.png) no-repeat;
	content: ''
}

.m-figure-box.z-official:before {
	background-position: 0 -50px
}

.m-figure-box.z-h5:before {
	background-position: 0 -100px
}

.m-figure-box .figure>img {
	position: absolute;
	width: 100%;
	height: 100%;
	transition: .5s ease
}

.m-figure-box .figure p {
	position: absolute;
	left: 0;
	right: 0;
	padding: .5em 10px;
	top: 100%;
	background: rgba(0, 0, 0, .8);
	color: #fff;
	font-size: 13px;
	line-height: 1.3;
	transition: .3s ease
}

.m-figure-box .discount,
.m-figure-box .ratio {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
	padding: 5px;
	line-height: .8;
	font-size: 12px;
	font-weight: bold;
	color: #ff0;
	background: rgba(255, 17, 0, 1);
	background: #f53629\0
}

.m-figure-box .discount:after,
.m-figure-box .ratio:after {
	position: absolute;
	right: 0;
	bottom: -6px;
	border: 3px solid transparent;
	border-top-color: #f53629;
	border-right-color: #f53629;
	content: ''
}

.m-figure-box .discount {
	background: #51baff;
	color: #fff
}

.m-figure-box .discount:after {
	border-top-color: #51baff;
	border-right-color: #51baff
}

.m-figure-box .tile {
	position: relative;
	overflow: hidden;
	height: 36px;
	line-height: 36px;
	text-align: center
}

.m-figure-box h3 {
	overflow: hidden;
	font-size: 15px;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-figure-box .hover {
	position: absolute;
	left: 0;
	right: 0;
	top: -100%;
	height: 36px;
	background: #fff;
	transition: .3s ease
}

.m-figure-box .hover p {
	float: left;
	padding-left: 12px;
	font-size: 12px
}

.m-figure-box .hover .btn {
	float: right;
	width: 86px
}

.m-figure-box:hover {
	box-shadow: 0 0 0 1px #ffd900
}

.m-figure-box:hover .figure img {
	transform: scale(1.05)
}

.m-figure-box:hover .figure p {
	transform: translateY(-100%)
}

.m-figure-box:hover .hover {
	top: 0
}

.m-figure-box.h5-box .figure p {
	height: 100%
}

.m-figure-box.h5-box .figure p img {
	display: block;
	margin: 6px auto;
	height: 72%
}

.m-figure-box.h5-box .figure p em {
	display: block;
	text-align: center;
	font-size: 12px
}

.m-figure-box.h5-box .hover p {
	display: none
}

.m-figure-box.h5-box .hover .btn {
	width: 100%
}


/**/
.m-prod-wrapper ul {
	overflow: hidden;
	margin: 0 0 -20px -24px
}


.m-prod-wrapper li {
	float: left;
	width: 25%;
	margin-bottom: 20px;
	padding-left: 24px
}

.m-prod-wrapper.col3 li {
	width: 33.33333333%
}

.m-prod-wrapper.col4 li {
	width: 25%;
}

.m-prod-wrapper.col5 li {
	width: 20%
}

.m-prod-wrapper.col6 li {
	width: 16.66666666666%
}

.m-prod-wrapper ul~.m-pagination {
	margin-top: 20px
}

.m-prod-wrapper li.colspan2 {
	width: auto
}



/**/




/**/



.p-index .g-parse .m-figure-box .figure {
	padding-bottom: 125px
}

.p-index .m-heralds {
	height: 524px
}

.p-index .m-herald-data,
.p-index .m-herald-game {
	min-height: 432px
}



.m-sideadv {
	position: absolute;
	z-index: 100;
	width: 1200px
}

.m-sideadv.fix {
	position: fixed;
	top: 0
}

.m-sideadv>* {
	position: absolute;
	top: 80px;
	width: 100px;
	height: 342px
}

.m-sideadv img {
	width: 100%;
	height: 100%
}

.m-sideadv .clearup {
	position: absolute;
	right: 0;
	top: 0;
	width: 20px;
	height: 20px;
	background: rgba(0, 0, 0, .6);
	cursor: pointer;
	color: #fff;
	line-height: 20px;
	text-align: center
}

.m-sideadv .clearup:hover {
	background: #f20
}

.m-sideadv>.left {
	left: -120px
}

.m-sideadv>.right {
	right: -120px
}

.m-filter {
	margin-bottom: 15px;
	padding: 5px 20px;
	background: #fff;
	font-size: 0;
	box-shadow: 0 0 0 1px #f3f3f3
}

.m-filter p {
	position: relative;
	border-bottom: 1px dotted #e3e3e3;
	padding: 10px 0 10px 80px;
	font-size: 0
}

.m-filter p:last-child {
	border: 0
}

.m-filter strong {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	height: 24px;
	line-height: 24px;
	font-size: 13px;
	color: #999
}

.m-filter a {
	display: inline-block;
	margin: 2px;
	width: 72px;
	background: #f0f0f0;
	line-height: 28px;
	text-align: center;
	font-size: 13px
}

.m-filter a:hover,
.m-filter a.active {
	background: #ffd900;
	color: #000;
	text-decoration: none
}

.p-lobby .m-heralds {
	height: 528px
}

.p-lobby .m-herald-data {
	min-height: 369px
		/*769*/
}


.p-news .section .m-panel-body {
	padding: 20px 30px;
	background: #fff
}

.m-art-list {
	margin-bottom: 20px;
	font-size: 16px
}

.m-art-list li {
	position: relative;
	overflow: hidden;
	padding: .6em 0;
	border-bottom: 1px dotted #e3e3e3;
	word-break: keep-all;
	white-space: nowrap;
	text-overflow: ellipsis
}

.m-art-list li:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 5px;
	height: 5px;
	background: #e9e9e9;
	border-radius: 50%
}

.m-art-list li:hover:before {
	background: #ccc
}

.m-art-list a {
	padding-left: .8em
}

.m-art-list a:hover {
	color: #f60
}

.m-art-list em {
	float: right;
	color: #bbb;
	font-size: 14px
}

.m-art-wrapper {
	padding: 0 10px
}

.m-art-header {
	padding-bottom: 10px;
	margin-bottom: 40px;
	border-bottom: 1px dotted #e3e3e3
}

.m-art-header .sort {
	margin-bottom: 15px;
	font-size: 13px
}

.m-art-header .sort span {
	display: inline-block;
	padding: 5px 2px;
	border-bottom: 1px solid #f90;
	color: #f90
}

.m-art-header h1 {
	font-size: 30px;
	line-height: 56px;
	font-weight: bold;
	word-wrap: break-word;
	word-break: break-all;
	margin-top: 10px;
}

.m-art-header .info {
	position: relative;
	font-size: 13px;
	line-height: 36px;
	color: #777;
	overflow: hidden
}

.m-art-header .info span {
	margin-right: 2em
}

.m-art-game {
	position: relative;
	margin-bottom: 30px;
	width: 100%;
	height: 150px;
	background: #2b2927;
	border-radius: 6px;
	overflow: hidden
}

.m-art-game .img {
	width: 100%;
	height: 100%;
	overflow: hidden
}

.m-art-game .img img {
	width: 100%
}

.m-art-game h3 {
	position: absolute;
	right: 35px;
	bottom: 50%;
	line-height: 1.8;
	font-size: 36px;
	color: #fff;
	text-align: right
}

.m-art-game .btnbar {
	position: absolute;
	right: 35px;
	top: 50%;
	width: 230px;
	height: 40px;
	line-height: 40px;
	font-size: 16px;
	text-align: center;
	overflow: hidden
}

.m-art-game .btnbar a {
	float: left;
	display: inline-block;
	width: 50%;
	height: 100%;
	background: rgba(255, 255, 255, .3);
	background: #666\0/;
	color: #fff
}

.m-art-game .btnbar .download {
	background: rgba(255, 217, 0, .9);
	color: #000
}

.m-art-game .btnbar a:hover {
	background: #fff;
	color: #333
}

.m-art-text {
	color: #555;
	font-size: 16px;
	margin-bottom: 50px;
}

.m-art-text p {
	margin: 0;
	padding: 0 0 15px;
	line-height: 20px;
	margin-bottom: 10px;

}

.m-art-text table {
	margin: 10px 0;
	border: 1px solid #ecafaf;
	background: #fff;
	font-size: 14px
}

.m-art-text table td {
	padding: 8px 12px;
	border: 1px solid #e49494;
	border-color: #f56868;
	background: #ffffff;
	color: #000;
	white-space: nowrap
}

.m-art-text img {
	display: block;
	margin: auto;
	max-width: 100%
}

.m-art-side {
	position: relative;
	margin-top: 60px;
	border: solid #e9e9e9;
	border-width: 1px 0;
	overflow: hidden
}

.m-art-side:after {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	border-left: 1px solid #e9e9e9
}

.m-art-side dd {
	float: left;
	display: block;
	width: 50%
}

.m-art-side dd.next {
	float: right
}

.m-art-side dd a {
	display: block;
	padding: 15px 30px;
	font-size: 15px
}

.m-art-side dd a i {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 26px;
	line-height: 26px;
	font-size: 22px;
	color: #999
}

.m-art-side dd.next i {
	left: auto;
	right: 0
}

.p-service {}

.m-service .contact,
.m-service .list li i {
	background: url(./kf-icon.png) no-repeat 999px 999px
}

.m-service {
	padding-top: 30px;
	width: 960px
}

.m-service .hd {
	padding: 25px 0 40px;
	line-height: 26px
}

.m-service .hd h2 {
	font-size: 34px;
	border-left: 4px solid #ffd900;
	padding-left: 15px
}

.m-service .bd {
	position: relative;
	padding-left: 310px
}

.m-service .contact {
	position: absolute;
	left: 0;
	top: 0;
	width: 310px;
	height: 295px;
	background-position: 0 0;
	text-align: center;
	border-radius: 15px
}

.m-service .contact a {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 70px;
	margin: auto;
	width: 140px;
	height: 36px;
	line-height: 36px;
	border-radius: 18px;
	background: #fff
}

.m-service .contact a:hover {
	background: #333;
	color: #fff
}

.m-service .contact p {
	position: absolute;
	bottom: 30px;
	width: 100%;
	color: #000
}

.m-service .list li {
	position: relative;
	float: left;
	width: 310px;
	height: 140px;
	margin-bottom: 15px;
	margin-left: 15px;
	background: #fff;
	border-radius: 15px;
	transition: .3s ease
}

.m-service .list li a {
	display: block;
	height: 90px;
	padding: 30px 0 30px 120px
}

.m-service .list li a:hover {
	text-decoration: none
}

.m-service .list li i {
	position: absolute;
	left: 20px;
	top: 30px;
	width: 90px;
	height: 90px
}

.m-service .list li i.ico1 {
	background-position: 0 -295px
}

.m-service .list li i.ico2 {
	background-position: -90px -295px
}

.m-service .list li i.ico3 {
	background-position: 0 -385px
}

.m-service .list li i.ico4 {
	background-position: -90px -385px
}

.m-service .list li h3 {
	height: 32px;
	line-height: 32px;
	font-size: 18px;
	color: #333
}

.m-service .list li p {
	padding-right: 30px;
	margin-top: 5px;
	line-height: 20px;
	color: #999
}

.m-service .list li:hover {
	-webkit-box-shadow: 0 3px 3px 3px rgba(0, 0, 0, .05);
	-moz-box-shadow: 0 3px 3px 3px rgba(0, 0, 0, .05);
	box-shadow: 0 3px 3px 3px rgba(0, 0, 0, .05);
	-webkit-transform: translateY(-4px);
	-moz-transform: translateY(-4px);
	transform: translateY(-4px)
}

.p-h5 .g-parse .section .m-panel-body {
	padding: 30px;
	background: #fff
}

.m-h5-header {
	position: relative;
	background: #111 url(/skin/img/h5_bg.jpg) no-repeat 50% 0;
	color: #fff
}

.m-h5-header .info {
	position: relative;
	padding: 30px 0 30px 180px
}

.m-h5-header .info .icon {
	position: absolute;
	left: 30px;
	width: 120px;
	height: 120px
}

.m-h5-header .info .text {
	position: relative;
	min-height: 120px
}

.m-h5-header .info .text h1 {
	margin-bottom: 14px;
	font-size: 28px;
	line-height: 1
}

.m-h5-header .info .bar {
	position: absolute;
	bottom: 0
}

.m-h5-header .info .bar .btn-play {
	width: 120px;
	line-height: 36px;
	font-size: 16px;
	border-radius: 100px
}

.m-h5-header .qrcode {
	position: absolute;
	right: 20px;
	bottom: 0;
	width: 250px;
	height: 180px;
	background: url(/skin/img/h5_bg_qrcode.png) no-repeat 100% 0
}

.m-h5-header .qrcode img,
.m-h5-header .qrcode:after {
	position: absolute;
	z-index: 1;
	right: 42px;
	top: 56px;
	width: 100px;
	height: 100px
}

.m-h5-header .qrcode:after {
	z-index: 2;
	height: 10px;
	background: url(/skin/img/h5_bg_qrcode.png) no-repeat 100% -250px;
	content: '';
	animation: qrcodeMove 4s linear infinite
}

@keyframes qrcodeMove {
	0% {
		transform: translateY(0)
	}

	50% {
		transform: translateY(100px)
	}

	100% {
		transform: translateY(0)
	}
}

.m-h5-header .qrcode p {
	position: absolute;
	top: 115px;
	right: 200px;
	width: 150px;
	line-height: 1.4;
	color: #d1dcf3;
	opacity: .5
}

.m-h5-images {
	position: relative;
	height: 380px;
	overflow: hidden;
	margin: 20px 0
}

.m-h5-images ul {
	height: 100%;
	padding-bottom: 5px;
	margin: 0;
	font-size: 0;
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden
}

.m-h5-images li {
	display: inline-block;
	position: relative;
	height: 100%;
	padding-right: 10px;
	vertical-align: middle
}

.m-h5-images img {
	height: 100%;
	border-radius: 4px
}


.m-game-week {
	color: #c1c0c0
}




.smenu {
	background: #fff;
	height: 37px;
	margin: 0px auto 0;
	overflow: hidden;
	width: 1200px;
}

.smenu a {
	display: block;
	float: left;
	font-size: 14px;
	font-weight: bold;
	height: 37px;
	line-height: 34px;
	text-align: center;
	width: 200px;
}

.smenu a.selected {
	background: url(../img/bbt_gg.png) no-repeat scroll 0 0;
	color: #ef0101;
}

.slist {
	background: #fff;
	border-bottom: 3px solid #ebeaea;
	height: 240px;
	padding-top: 20px;
}

.slist ul {
	margin: 0px 0 20px 20px;
}

.slist li {
	height: 36px;
	width: 373px;
	float: left;
	line-height: 36px;
	color: #a8a8a8;
	border-bottom: 1px dashed #e4e2e2;
	margin-right: 20px;
}

.slist li i {
	float: left;
	font-size: 16px;
	color: #888;
}

.slist li p {
	float: left;
	margin-left: 6px;
	height: 36px;
	width: 323px;
	overflow: hidden;
}


/*我就想注释一段*/

.m-rank-box {
	margin-bottom: -20px;
	padding: 10px 20px 20px;
	border: 1px solid #eee;
	background: #fff
}

.m-rank-box dt {
	padding: 2px 0 10px;
	border-bottom: 1px solid #eee;
	text-align: center;
	font-size: 20px
}

.m-rank-box p {
	padding: 4px 15px 0;
	height: 39px;
	overflow: hidden;
	border-bottom: 1px dotted #eee;
	line-height: 30px
}

.m-rank-box p:last-child {
	border-bottom: 0
}

.m-rank-box p.th {
	color: #999
}

.m-rank-box p a,
.m-rank-box p span {
	float: left
}

.m-rank-box p .c1 {
	margin-left: -10px;
	margin-right: 20px;
	width: 15%;
	text-align: center
}

.m-rank-box p .c2 {
	width: 50%
}

.m-rank-box p .c3 {
	float: right;
	width: 30%;
	text-align: right
}

.m-rank-box p .c1 em {
	display: inline-block;
	width: 20px;
	border: 1px solid #ffd900;
	color: #f60;
	font-size: 12px;
	line-height: 18px;
	border-radius: 3px
}

.m-rank-box p .c1 em.num1,
.m-rank-box p .c1 em.num2,
.m-rank-box p .c1 em.num3 {
	display: block;
	margin: auto;
	width: 30px;
	height: 30px;
	border: 0;
	background: no-repeat url(data:image/png;base64,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);
	text-indent: -999em
}

.m-rank-box p .c1 em.num2 {
	background-position: -30px 0
}

.m-rank-box p .c1 em.num3 {
	background-position: -60px 0
}

.m-rank-box p a.c2 {
	color: #36f;
	font-size: 16px
}

.m-icon-box {
	position: relative;
	padding: 15px 10px 15px 100px;
	height: 120px;
	background: #fff;
	border-radius: 8px
}

.m-icon-box .figure {
	position: absolute;
	top: 15px;
	left: 5px;
	width: 90px;
	height: 90px
}

.m-icon-box>h3 {
	font-size: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-icon-box>p {
	margin-bottom: 10px;
	color: #888;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.m-icon-box .btn {
	float: left;
	margin-right: 5px;
	width: 80px;
	border: 1px solid #f90;
	color: #f90;
	line-height: 28px;
	border-radius: 3px
}

.m-icon-box .btn:hover {
	background: #f90;
	color: #fff
}

.m-icon-box .f-sub-layer {
	float: left
}

.m-icon-box .f-sub-layer .btn {
	background: #fff;
	color: #666;
	border-color: #e0e0e0;
	line-height: 28px
}

.m-icon-box .f-sub-layer .btn:hover {
	background: #f6f6f6
}

.m-icon-box .f-sub-layer .top {
	margin-top: -7px
}




/**/