@charset "utf-8";

/**
 * zwsg_main.css
 * @aumagic liangkangren
 * @date 2017-03-12
 **/

html,
body,
div,
span,
iframe,
h1,
h2,
h3,
h4,
h5,
p,
pre,
em,
img,
strong,
b,
i,
dl,
dt,
dd,
ul,
li,
fieldset,
form,
label,
legend,
table,
tbody,
tfoot,
thead,
tr,
th,
td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0
}

a,
input,
button {
    margin: 0;
    padding: 0;
    outline: 0
}

h1,
h2,
h3,
h4,
h5 {
    font-size: 100%
}

ul,
li {
    list-style: none
}

a,
button {
    cursor: pointer
}

table {
    border-spacing: 0;
    border-collapse: collapse;
    margin: 0 auto;
}

.cls {
    *zoom: 1
}

.cls:after {
    display: block;
    visibility: hidden;
    clear: both;
    overflow: hidden;
    height: 0;
    content: '.'
}

.cls {
    clear: both
}

a {
    text-decoration: none;
    color: #fff
}

a:hover {
    text-decoration: none;
    color: #fff
}

.hidden {
    display: none
}

em,
i,
strong {
    font-weight: 400;
    font-style: normal
}

body {
    min-width: 1200px; 
    overflow: auto;
}

.sq-dialog-masking {
    position: fixed!important;
    _position: absolute!important;
}

.r-cover {
    position: fixed!important;
    _position: absolute!important;
}

.body {
    font: 14px 'Microsoft Yahei', SimSun;
    position: relative;
    background: #0c141d;
    color: #fff;
    overflow: hidden;
}


/* header */

.header {
    width: 1200px;
    height: 600px;
    position: relative;
    margin: 0 auto
}

.header embed {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 2;
    margin-left: -40px;
}

.wrap {
    position: relative;
    z-index: 4;
    width: 1200px;
    margin: 0 auto;
    *margin-top: 0;
    padding-bottom: 150px;
}

.main {
    width: 1200px;
    position: relative;
}

.wrap .right h3 {
    font-size: 16px;
    color: #b01503;
    font-weight: 400;
}

.cont-main {
    height: 100%;
}

.kv-top {
    position: absolute;
    left: 50%;
    overflow: hidden;
    width: 2000px;
    height: 1196px;
    margin-left: -1000px;
    *height: 1196px
}

.kv-top-img {
    position: relative;
    clear: both;
    overflow: hidden;
    width: 2000px;
    height: 1196px
}

.kv-top-img li {
    overflow: hidden;
    width: 2000px;
    height: 1196px
}

.kv-top-img a {
    width: 100%;
    height: 100%;
    display: block;
}

.kv-top-img li img {
    width: 2000px;
    height: 1196px
}

.kv-top-num {
    position: absolute;
    top: 492px;
    right: 50%;
    margin-right: -590px;
}

.kv-top-num li {
    font-size: 0;
    line-height: 0;
    float: left;
    overflow: hidden;
    width: 14px;
    height: 14px;
    margin-left: 8px;
    text-indent: -9999em;
    border-radius: 7px;
    background: #C0C0C0
}

.kv-top-num li:hover,
.kv-top-num li.focus {
    background: #BD9D60
}


/**top-nav**/

.top-nav {
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
    font-size: 14px;
    height: auto;
    width: 164px;
    float: left;
    padding-bottom: 100px;
    background: url("images/nav_bg.png") no-repeat left top;
}

.nav {
    margin-top: 48px;
    width: 100%;
    height: auto;
    float: left;
    margin: 0 auto;
}

.nav a.top-nav-a {
    width: 114px;
    height: 44px;
    line-height: 44px;
    margin-left: 20px;
    display: block;
    float: left;
    font-size: 18px;
    color: #fff;
    transition: .3s;
}

.nav a.top-nav-a:hover {
    color: #e7c864;
    padding-left: 2px;
    transition: .3s;
}

.nav-items-icon {
    width: 38px;
    height: 44px;
    line-height: 44px;
    display: block;
    float: left;
    background: url("images/nav_items_icon.png") no-repeat left top;
}

.nav .top-nav-li {
    width: 160px;
    text-align: center;
    position: relative;
    float: left;
}

.nav .logo-main {
    width: 240px;
    height: 130px;
    margin-top: 0;
    left: -40px;
    margin-bottom: 12px;
}

.nav .no-border a {
    border-top: none;
}

.nav .logo-main a {
    width: 240px;
    height: 130px;
    display: block;
}

.nav .last-li .b-line {
    width: 114px;
    height: 14px;
    line-height: 14px;
    display: block;
    float: left;
    margin-left: 24px;
}

.nav .last-li a {
    text-align: right;
}

.nav a.home-p .nav-items-icon {
    background-position: 0px 8px;
}

.nav a.news-p .nav-items-icon {
    background-position: 0px -37px;
}

.nav a.info-p .nav-items-icon {
    background-position: 0px -82px;
}

.nav a.ser-p .nav-items-icon {
    background-position: 0px -126px;
}

.nav a.pay-p .nav-items-icon {
    background-position: 0px -170px;
}

.nav a.bbs-p .nav-items-icon {
    background-position: 0px -213px;
}

.nav a.home-p:hover .nav-items-icon {
    background-position: -49px 8px;
}

.nav a.news-p:hover .nav-items-icon {
    background-position: -49px -37px;
}

.nav a.info-p:hover .nav-items-icon {
    background-position: -49px -82px;
}

.nav a.ser-p:hover .nav-items-icon {
    background-position: -49px -126px;
}

.nav a.pay-p:hover .nav-items-icon {
    background-position: -49px -170px;
}

.nav a.bbs-p:hover .nav-items-icon {
    background-position: -49px -213px;
}

.logo {
    top: 5px;
    text-indent: -9999px;
    position: absolute;
    z-index: 2;
    width: 195px;
    height: 117px;
    background: url(images/logo.png) no-repeat center top;
    z-index: 5;
}

.tips18 {
    font-size: 16px;
    position: absolute;
    z-index: 2;
    top: 575px;
    letter-spacing: 1px;
    color: #fff;
    left: 0;
}

#qq {
    position: absolute;
    bottom: -9px;
    width: 90px;
    height: 22px;
    text-indent: -9999px;
    overflow: hidden;
    z-index: 2;
    left: 50%;
    margin-left: 394px;
    top: 534px
}


/* loginframe */

.lrsbox {
    margin-bottom: 70px;
}

.lrsbox .left,
.lrsbox .right {
    float: left;
}

.lrsbox .left {
    position: relative;
    width: 380px;
    overflow: hidden;
}

.lrsbox .right {
    height: auto;
    min-height: 462px;
    width: 820px;
    background: #242a36;
    position: relative;
}

.start {
    display: block;
    width: 380px;
    height: 164px;
    background: url(images/start.jpg) no-repeat;
}

.start:hover {
    background: url(images/start-h.jpg) no-repeat;
}

.start span {
    display: block;
    width: 250px;
    height: 90px;
    position: absolute;
    top: 38px;
    left: 66px;
    background: url(images/start-zi.png) no-repeat;
    content: "";
    cursor: pointer;
}

.start span:after {
    display: block;
    width: 188px;
    height: 65px;
    background: url(images/start-zi.png) no-repeat;
    content: "";
    cursor: pointer;
}

.start:hover span {
    animation: linear icoBig 1.6s infinite;
    -webkit-animation: linear icoBig 1.6s infinite;
}

.start:hover span:after {
    opacity: .6;
    animation: linear icoBig2 1.6s infinite;
    -webkit-animation: linear icoBig2 1.6s infinite;
}

@-webkit-keyframes icoBig {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    20% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    30% {
        -webkit-transform: scale(.93);
        transform: scale(.93);
    }
    45% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04);
    }
    60% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes icoBig {
    0% {
        transform: scale(1);
    }
    20% {
        transform: scale(1.05);
    }
    30% {
        transform: scale(.93);
    }
    45% {
        transform: scale(1.04);
    }
    60% {
        transform: scale(1);
    }
}

@-webkit-keyframes icoBig2 {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    20% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
        opacity: 0
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
}

@keyframes icoBig2 {
    0% {
        transform: scale(1);
    }
    20% {
        transform: scale(1.3);
        opacity: 0
    }
    100% {
        transform: scale(1);
        opacity: 0
    }
}

.side-a {
    display: block;
    width: 190px;
    height: 58px;
    line-height: 58px;
    text-align: center;
    float: left;
    color: #e7a752;
    font-size: 20px;
    background: url("images/reg-log.png");
}

.side-b {
    background-position: -190px 0;
}

.side-a:hover {
    background-position: 0 -58px;
}

.side-b:hover {
    background-position: -190px -58px;
}

.side {
    background: #3e3f44;
}

.icon-btn-d {
    background-position: -190px 0;
}

.login {
    font-size: 18px;
    height: 240px;
    color: #fff;
    background: #252f41;
    position: relative;
    width: 380px;
}

.log a {
    color: #fff
}

.login .t {
    width: 260px;
    background-position: 2px -238px;
    margin: auto;
}

.login-t a {
    font-size: 16px;
    line-height: 43px;
    float: left;
    width: 130px;
    height: 43px;
    color: #fff;
}

.login-t {
    position: absolute;
    top: 146px;
    left: 15px;
}

.mark {
    display: block;
    float: left;
    margin: 16px 10px 0 45px;
    transition: all .5s ease-out;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    _display: inline
}

.mark:hover {
    transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
}

.icon-btn-c:hover .mark,
.icon-btn-d:hover .mark {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg)
}

.log li {
    position: absolute
}

.text {
    font-family: 'Microsoft Yahei';
    line-height: 32px;
    width: 224px;
    height: 32px;
    font-size: 16px;
    padding-left: 30px;
    color: #d7d8e0;
}

.input-u {
    color: #0b161c;
    background: url("images/count_bg.png") no-repeat 6px center #d9d6d1;
}

.input-p {
    color: #0b161c;
    background: url("images/pw_bg.png") no-repeat 6px center #d9d6d1;
}

.user {
    top: 20px;
    left: 40px;
}

.psw {
    top: 64px;
    left: 40px;
}

.remember {
    top: 106px;
    left: 84px;
    font-size: 14px;
    color: #a8adb6;
}

.get-psw {
    top: 106px;
    left: 200px;
    font-size: 14px;
    color: #a8adb6;
}

.get-psw a {
    color: #a8adb6;
}

.lr-btn {
    text-indent: 0;
    width: 142px;
    height: 48px;
    line-height: 48px;
    text-align: center;
    font-size: 22px;
    top: 134px;
    background: url("images/login.png") no-repeat;
}

.lr-btn:hover {
    background-position: -146px 0;
}

.lr-btn a {
    width: 142px;
    height: 48px;
    display: block;
}

.log-btn {
    left: 38px;
}

.reg-btn {
    left: 200px;
    background-position: -1px -50px;
}

.reg-btn:hover {
    background-position: -147px -50px;
}

.loged {
    width: 260px;
    margin: 0 auto;
    padding: 40px 0 0;
    font-size: 14px;
}

.loged li {
    line-height: 33px;
    padding: 0 13px;
}

.loged a {
    color: #e7c864;
}

.loged-usercenter {
    text-align: right
}

.loged-usercenter a {
    margin-left: 5px
}

.loged .colored {
    color: #e7c864;
}

.c-body .role {
    margin-top: 20px;
    float: none;
    width: 380px;
}

.c-body .icon-service {
    background-repeat: no-repeat;
}

.c-body #gamedata {
    width: 378px;
    margin-top: 10px;
}

.c-body .gamedata-tab {
    width: 378px;
}

.card {
    width: 380px;
    height: 250px;
    float: left;
    margin-top: 20px;
}

.card a {
    display: block;
    width: 380px;
    height: 125px;
    overflow: hidden;
    float: left;
}

.card a img {
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s
}

.card a:hover img {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05)
}


/*left service*/

.left .service {
    width: 380px;
    float: left;
    margin-left: 0px;
    background: #364362;
    margin-top: 20px;
}

.service .servicetl {
    width: 363px;
    height: 44px;
    background-color: #d5d5d5;
    padding: 15px 0 0 20px;
}

.left .service .con {
    width: 100%;
    height: 193px;
    border: none;
    position: relative;
    margin-top: 0;
    color: #fff;
    background: #242c3e;
}

.lcontact {
    float: left;
    width: 173px;
    position: absolute;
    top: 35px;
    left: 33px;
}

.lcontact p {
    height: 28px;
}

.left .service a {
    width: 95px;
    height: 20px;
    display: inline-block;
    background: #af9c59;
    text-align: center;
    line-height: 20px;
    color: #000;
}

.left .service a:hover {
    background: #b19474;
}

.left .service h3 {
    text-indent: 24px;
}

.left .qr {
    float: left;
    position: absolute;
    top: 35px;
    left: 260px;
    width: 90px;
    margin-top: 0;
}

.ser-title-b {
    width: 338px;
    height: 64px;
    margin-left: 10px;
    line-height: 64px;
    position: relative;
    background: #364362;
}

.ser-t-bg-b {
    width: 185px;
    height: 64px;
    line-height: 64px;
    display: block;
    float: left;
    position: absolute;
    left: 10;
    background: url("images/server_title_bg_2.png") no-repeat left center;
}

.left .qr i {
    float: left;
    width: 100%;
}

.left .qr p {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    color: #fff;
}

.qr i {
    float: left;
}


/* server */

.choice-server {
    color: #a8adb6;
    height: 105px;
    width: 804px;
    background: url("images/new-server.jpg") left 4px no-repeat;
    position: relative;
    padding: 0 8px 0;
}

.quick-ingame {
    line-height: 45px;
    width: 197px;
    height: 45px;
    border-bottom: 1px solid #595959;
    margin: auto;
    font-size: 12px;
    color: #26282a;
}

.fastin-input {
    width: 37px;
    height: 19px;
    text-align: center;
    line-height: 19px;
    color: #000000;
    background: #d9dadb;
}

#btnFast {
    width: 76px;
    height: 23px;
    line-height: 23px;
    text-align: center;
    display: inline-block;
    background: #d6b051;
    color: #fff;
    border-radius: 2px;
}

#btnFast:hover {
    background: #b19474;
    color: #000;
}

.choice-list {
    height: 75px;
    width: 410px;
    overflow: hidden;
    position: absolute;
    top: 17px;
    left: 139px;
}

.choice-list i {
    height: 11px;
    width: 11px;
    display: inline-block;
    margin-right: 11px;
}

.choice-list li {
    float: left;
    margin-right: 32px;
    width: 170px;
    height: 36px;
    line-height: 36px;
    overflow: hidden;
}

.choice-list li a span {
    float: right;
    color: #ff1515;
}

.select-server {
    position: absolute;
    top: 27px;
    left: 532px;
}

.server-more {
    line-height: 24px;
    width: 74px;
    height: 24px;
    position: absolute;
    right: 0;
    top: 17px;
    font-size: 14px;
}

.all-server {
    width: 12px;
    height: 12px;
    display: block;
    position: absolute;
    top: 6px;
    right: 8px;
}

.all-server:hover {}

.choice-list li a {
    display: block;
    width: 100%;
    margin: auto;
    color: #cbcbcb;
    background: url(images/server-icon.png) center left no-repeat;
    text-indent: 20px;
}

.choice-list li a:hover {
    color: #cbcbcb;
}

.more {
    display: block;
    background: url("images/more1.png") no-repeat left top;
    width: 32px;
    height: 28px;
    position: absolute;
    right: -4px;
    top: -2px;
}

.more:hover {
    background-position: 0 -28px;
}


/*infolist*/

.info_link {
    height: 286px;
    margin-bottom: 11px;
}

.info_link li {
    width: 113px;
    height: 94px;
    float: left;
    background-color: #FFFFFF;
    margin: 0 1px 1px 0;
    text-align: center;
    line-height: 135px;
    position: relative;
}

.info_link a {
    width: 100%;
    height: 100%;
    display: inline-block;
    color: #333333;
}

.info_link i {
    display: block;
    position: absolute;
    top: 13px;
    left: 40px;
}

.i-icon {
    transition: all .5s ease-out;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.info_link a:hover i {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}


/*media*/

.media {
    width: 258px;
    float: left;
}

.media .t {
    width: 212px;
    margin: 0 0 21px 11px;
}

.media .con {
    overflow: hidden;
    width: 258px;
    height: 116px;
    float: left;
    background: #222a3c;
    border-right: none;
}

.media-box {
    width: 190px;
    height: 84px;
    padding-top: 32px;
    overflow: hidden;
}

.media-scroll {
    overflow: hidden;
    width: 150px;
    height: 50px;
    margin: 0 0 0 40px;
}

.media-scroll li {
    width: 150px;
    height: 50px
}

.media-scroll img {
    width: 150px;
    height: 50px
}

.med-title {
    width: 242px;
    height: 65px;
    float: left;
    position: relative;
}

.med-t-bg {
    width: 228px;
    height: 50px;
    line-height: 50px;
    display: block;
    float: left;
    background: url("images/media_title_bg.png") no-repeat 10px center;
}


/*kv*/

.kv {
    position: absolute;
    float: left;
    width: 820px;
    height: 357px;
    overflow: hidden;
    z-index: 1;
    top: 105px;
}

.kv-num {
    position: absolute;
    right: 50px;
    bottom: 24px;
}

.kv-num li {
    width: 22px;
    height: 22px;
    line-height: 22px;
    float: left;
    overflow: hidden;
    margin-right: 8px;
    cursor: pointer;
    border-radius: 8px;
    background: url("images/kv-icon.png") no-repeat center;
}

.kv-num li:hover,
.kv-num li.focus {
    background: url("images/kv-icon-h.png") no-repeat center;
}

.kv-img img {
    width: 820px;
    height: 359px;
}


/*fast link*/

.fast-link {
    width: 320px;
    height: 381px;
    float: left;
    position: relative;
    margin-bottom: 10px;
    margin-left: 8px;
    background: #0b161c;
    border: 1px solid #202b37;
}

.fast-ul {
    width: 100%;
    height: 100%;
    float: left;
}

.fast-ul li {
    width: 310px;
    height: 118px;
    float: left;
    margin-left: 10px;
    margin-bottom: 10px;
}

.fast-ul li a {
    width: 310px;
    height: 118px;
    float: left;
    background: url("images/fast_in_bg.png") no-repeat left top;
}

.fast-ul li a.f-l-1 {
    background-position: 0 6px;
}

.fast-ul li a.f-l-2 {
    background-position: 0 -120px;
}

.fast-ul li a.f-l-3 {
    background-position: 0 -248px;
}

.fast-ul li a.f-l-1:hover {
    background-position: -320px 6px;
}

.fast-ul li a.f-l-2:hover {
    background-position: -320px -120px;
}

.fast-ul li a.f-l-3:hover {
    background-position: -320px -248px;
}


/*news*/

#news {
    width: 496px;
    height: 383px;
    background: #242c3f;
    overflow: hidden;
    float: left;
    border-left: 1px solid #354057;
    border-right: 1px solid #354057;
}

#news .news-more {
    background: url("images/more2.png");
    width: 24px;
    height: 24px;
    position: absolute;
    right: 20px;
    top: 18px;
}

#news .news-more:hover {
    background-position: 0 -26px;
}

.news-tab {
    width: 496px;
    height: 60px;
    background: url("images/news_title_bg.png") no-repeat left top;
    position: relative;
}

.news-tab li {
    font-size: 16px;
    display: inline;
    float: left;
    position: relative;
}

.news-tab li,
.news-tab li a {
    line-height: 60px;
    display: block;
    width: 78px;
    height: 60px;
    text-align: center;
    color: #fff;
    transition: .5s;
    font-size: 20px;
}

.news-tab li.current a {
    color: #dcc085;
    background: #485982;
}

.news-tab li:hover,
.news-tab li.current {
    color: #dcc085;
    border-bottom-color: #dcc085;
}

.headline {
    height: 44px;
    text-align: center;
    margin: 14px 20px 26px 20px;
    position: relative;
    background: none;
    border-bottom: 1px solid #354057;
}

.headline-title {
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    line-height: 44px;
    height: 44px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    color: #e7c864;
    text-align: center;
}

.headline-title:hover {
    color: #6ecdec;
}

.headline-title i {
    background: url("images/new.jpg");
    width: 13px;
    height: 13px;
    display: block;
    float: right;
    margin-top: 13px;
    *display: none
}

.headline-sum {
    font-size: 12px;
    line-height: 14px;
    display: block;
    overflow: hidden;
    height: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #99a0b1;
}

.news-list {
    height: 230px;
    overflow: hidden;
    padding: 0 20px;
}

.news-list li {
    line-height: 30px;
    overflow: hidden;
    height: 30px;
    margin: 0 auto;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.news-list a {
    color: #fff;
    font-size: 14px;
    margin-left: 5px;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}

.news-list a:hover {
    color: #6ecdec;
}

.a-link:hover {
    padding-left: 5px;
}

.time {
    color: #fff;
    float: right;
}

.news-list a.red-main {
    color: #9e2516;
}

.news-list a.org-main {
    color: #ef5a00;
}

.cate-name {
    float: left;
    padding: 0 10px;
    background: #444449;
    color: #a8adb6;
    border-radius: 4px;
    display: block;
    margin-right: 5px;
    height: 20px;
    line-height: 20px;
    margin-top: 5px;
}

.lrsbox .article-content {
    color: #fff;
}


/* gamedata */

#gamedata {
    width: 322px;
    height: 383px;
    float: left;
    position: relative;
    margin-bottom: 70px;
    background: url("images/games_info_bg.png") no-repeat left top #242c3f;
}

.game-tips-title {
    width: 304px;
    height: 60px;
    position: absolute;
    top: 0;
    left: 8px;
    line-height: 63px;
    border-bottom: 2px solid #333338;
}

.bd-bottom {
    width: 100%;
    height: 62px;
    display: block;
    float: left;
    position: relative;
    top: 0;
    left: 0;
    background: url("images/game_tips_title.png") no-repeat left bottom;
}

.more-game-tips-btn {
    display: block;
    background: url("images/more1.png") no-repeat left top;
    width: 32px;
    height: 32px;
    position: absolute;
    right: -6px;
    top: -2px;
}

.gamedata-tab {
    width: 324px;
    height: auto;
    background: none;
    color: #fff;
    font-size: 14px;
    float: left;
    overflow: hidden;
    padding-top: 8px;
}

.gamedata-tab ul {
    width: 324px;
    height: auto;
    float: left;
    overflow: hidden;
}

.gamedata-tab li {
    float: left;
    height: 86px;
    width: 88px;
    margin: 10px;
    cursor: pointer;
    display: block;
    background: url("images/games_info_btn.png") no-repeat 0 0;
}

.gamedata-tab li.tb1 {
    background-position: 2px 0;
}

.gamedata-tab li.tb2 {
    background-position: -106px 0;
}

.gamedata-tab li.tb3 {
    background-position: -214px 0;
}

.gamedata-tab li.tb1.cur {
    background-position: 2px -86px;
}

.gamedata-tab li.tb2.cur {
    background-position: -106px -86px;
}

.gamedata-tab li.tb3.cur {
    background-position: -214px -86px;
}

.gamedata-list {
    width: 322px;
    height: 269px;
    float: left;
}

.gamedata-list ul {
    height: 250px;
    width: 302px;
    float: left;
    position: relative;
    left: 10px;
    overflow: hidden;
    top: 18px;
}

.gamedata-list .con a {
    display: inline-block;
    width: 88px;
    text-align: center;
    margin-top: 10px;
}

.gamedata-list ul li.gl-more-btn {
    width: 100%;
    text-align: right;
}

.gamedata-list ul li.gl-more-btn a {
    width: 70px;
    text-align: right;
    font-size: 14px;
    float: right;
    color: #55565a;
    margin-right: 15px;
}

.gamedata-list ul li.gl-more-btn a:hover {
    color: #e7c864;
}

.gamedata-list ul li.game-info-big-title {
    width: 100%;
    height: 60px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: url("images/game_info_big_title.png") no-repeat center top;
}

.gamedata-list ul li.tt1 {
    background-position: center 0;
}

.gamedata-list ul li.tt2 {
    background-position: center -74px;
}

.gamedata-list ul li.tt3 {
    background-position: center -148px;
}

.gamedata-list .con {
    position: absolute;
    top: 124px;
    left: 27px;
    width: 274px;
    height: 165px;
    overflow: hidden
}

.gamedata-list .con span {
    margin: 0 6px;
}

.gamedata-list .con p {
    margin-top: 10px;
}

.gamedata-list .gamedata-more {
    position: absolute;
    bottom: 85px;
    right: 29px
}

.gamedata-list .txtbg {
    width: 236px;
    height: 58px;
    position: absolute;
    bottom: 0;
    left: 45px;
}

.gl-items-box {
    width: 100px;
    height: 18px;
    line-height: 18px;
    float: left;
    margin-top: 12px;
    border-right: 1px solid #fff;
}

.gl-items-box a {
    width: 100%;
    height: 18px;
    line-height: 18px;
    color: #fff;
    font-size: 14px;
    display: block;
    text-align: center;
    transition: .2s;
}

.gl-items-box a:hover {
    color: #e7c864;
    padding-left: 2px;
    transition: .2s;
}

.gamedata-list li.no-right-border {
    border-right: none;
}

.game-gear-info {
    width: 808px;
    height: 350px;
    float: left;
    margin-left: 8px;
    background: url("images/game_gear_bg.jpg") no-repeat left top #0b161c;
    border: 1px solid #202b37;
    position: relative;
}

.gear-items {
    width: 185px;
    height: 340px;
    padding: 5px;
    float: left;
}

.gear-items ul {
    width: 100%;
    height: 100%;
    float: left;
    display: none;
    overflow: hidden;
}

.gear-items ul li {
    width: 64px;
    height: 64px;
    float: left;
    margin-top: 16px;
    margin-left: 20px;
    cursor: pointer;
    background: url("images/gear_items.png") no-repeat left top;
}

.gear-items ul.gi-group-1 {
    display: block;
}


/*gi-group-1*/

.gear-items ul li.gig-1-1 {
    background-position: 0 -80px;
}

.gear-items ul li.gig-1-2 {
    background-position: -82px -80px;
}

.gear-items ul li.gig-1-3 {
    background-position: 0 -160px;
}

.gear-items ul li.gig-1-4 {
    background-position: -82px -160px;
}

.gear-items ul li.gig-1-5 {
    background-position: -82px 0;
}

.gear-items ul li.gig-1-6 {
    background-position: 0 0;
}


/*gi-group-1 hover*/

.gear-items ul li.gig-1-1:hover,
.gear-items ul li.gig-1-1.current {
    background-position: -181px -80px;
}

.gear-items ul li.gig-1-2:hover,
.gear-items ul li.gig-1-2.current {
    background-position: -263px -80px;
}

.gear-items ul li.gig-1-3:hover,
.gear-items ul li.gig-1-3.current {
    background-position: -181px -160px;
}

.gear-items ul li.gig-1-4:hover,
.gear-items ul li.gig-1-4.current {
    background-position: -263px -160px;
}

.gear-items ul li.gig-1-5:hover,
.gear-items ul li.gig-1-5.current {
    background-position: -263px 0;
}

.gear-items ul li.gig-1-6:hover,
.gear-items ul li.gig-1-6.current {
    background-position: -181px 0;
}


/*gi-group-2*/

.gear-items ul li.gig-2-1 {
    background-position: 0 -323px;
}

.gear-items ul li.gig-2-2 {
    background-position: -82px -323px;
}

.gear-items ul li.gig-2-3 {
    background-position: -82px -403px;
}

.gear-items ul li.gig-2-4 {
    background-position: 0 -403px;
}

.gear-items ul li.gig-2-5 {
    background-position: -82px -243px;
}

.gear-items ul li.gig-2-6 {
    background-position: 0 -243px;
}


/*gi-group-2 hover*/

.gear-items ul li.gig-2-1:hover,
.gear-items ul li.gig-2-1.current {
    background-position: -181px -323px;
}

.gear-items ul li.gig-2-2:hover,
.gear-items ul li.gig-2-2.current {
    background-position: -263px -323px;
}

.gear-items ul li.gig-2-3:hover,
.gear-items ul li.gig-2-3.current {
    background-position: -263px -403px;
}

.gear-items ul li.gig-2-4:hover,
.gear-items ul li.gig-2-4.current {
    background-position: -181px -403px;
}

.gear-items ul li.gig-2-5:hover,
.gear-items ul li.gig-2-5.current {
    background-position: -263px -243px;
}

.gear-items ul li.gig-2-6:hover,
.gear-items ul li.gig-2-6.current {
    background-position: -181px -243px;
}


/*gi-group-3*/

.gear-items ul li.gig-3-1 {
    background-position: 0 -644px;
}

.gear-items ul li.gig-3-2 {
    background-position: -82px -564px;
}

.gear-items ul li.gig-3-3 {
    background-position: 0 -564px;
}

.gear-items ul li.gig-3-4 {
    background-position: -82px -484px;
}

.gear-items ul li.gig-3-5 {
    background-position: -82px -644px;
}

.gear-items ul li.gig-3-6 {
    background-position: 0 -484px;
}


/*gi-group-3 hover*/

.gear-items ul li.gig-3-1:hover,
.gear-items ul li.gig-3-1.current {
    background-position: -181px -644px;
}

.gear-items ul li.gig-3-2:hover,
.gear-items ul li.gig-3-2.current {
    background-position: -263px -564px;
}

.gear-items ul li.gig-3-3:hover,
.gear-items ul li.gig-3-3.current {
    background-position: -181px -564px;
}

.gear-items ul li.gig-3-4:hover,
.gear-items ul li.gig-3-4.current {
    background-position: -263px -484px;
}

.gear-items ul li.gig-3-5:hover,
.gear-items ul li.gig-3-5.current {
    background-position: -263px -644px;
}

.gear-items ul li.gig-3-6:hover,
.gear-items ul li.gig-3-6.current {
    background-position: -181px -484px;
}


/*gi-group-4*/

.gear-items ul li.gig-4-1 {
    background-position: -82px -724px;
}

.gear-items ul li.gig-4-2 {
    background-position: 0 -804px;
}

.gear-items ul li.gig-4-3 {
    background-position: -82px -804px;
}

.gear-items ul li.gig-4-4 {
    background-position: 0 -883px;
}

.gear-items ul li.gig-4-5 {
    background-position: -82px -883px;
}

.gear-items ul li.gig-4-6 {
    background-position: 0 -964px;
}

.gear-items ul li.gig-4-7 {
    background-position: 0 -724px;
}


/*gi-group-4 hover*/

.gear-items ul li.gig-4-1:hover,
.gear-items ul li.gig-4-1.current {
    background-position: -263px -724px;
}

.gear-items ul li.gig-4-2:hover,
.gear-items ul li.gig-4-2.current {
    background-position: -181px -804px;
}

.gear-items ul li.gig-4-3:hover,
.gear-items ul li.gig-4-3.current {
    background-position: -264px -804px;
}

.gear-items ul li.gig-4-4:hover,
.gear-items ul li.gig-4-4.current {
    background-position: -181px -883px;
}

.gear-items ul li.gig-4-5:hover,
.gear-items ul li.gig-4-5.current {
    background-position: -263px -883px;
}

.gear-items ul li.gig-4-6:hover,
.gear-items ul li.gig-4-6.current {
    background-position: -181px -963px;
}

.gear-items ul li.gig-4-7:hover,
.gear-items ul li.gig-4-7.current {
    background-position: -181px -724px;
}


/*gif*/

.gear-item-detail {
    width: 460px;
    height: 252px;
    float: left;
    position: absolute;
    left: 324px;
    top: 44px;
}

.gear-item-detail ul {
    width: 100%;
    height: 252px;
    float: left;
    display: none;
}

.gear-item-detail ul li {
    width: 100%;
    height: 252px;
    float: left;
    display: none;
}

.gear-item-detail ul li img {
    width: auto;
    height: 100%;
    float: left;
}

.gear-item-detail ul li span {
    width: 30px;
    height: 150px;
    line-height: 150px;
    display: block;
    float: right;
    margin-top: 50px;
    margin-right: 20px;
    background: url("images/gear_items_name.png") no-repeat left top;
}

.gear-item-detail ul.gif-group-1 {
    display: block;
}

.gear-item-detail ul.gif-group-1 li.gif-1-1,
.gear-item-detail ul.gif-group-2 li.gif-2-1,
.gear-item-detail ul.gif-group-3 li.gif-3-1,
.gear-item-detail ul.gif-group-4 li.gif-4-1 {
    display: block;
}


/*gif name*/

.gear-item-detail ul.gif-group-1 li.gif-1-1 span {
    background-position: -158px 12px;
}

.gear-item-detail ul.gif-group-1 li.gif-1-2 span {
    background-position: -197px 12px;
}

.gear-item-detail ul.gif-group-1 li.gif-1-3 span {
    background-position: -80px 12px;
}

.gear-item-detail ul.gif-group-1 li.gif-1-4 span {
    background-position: -120px 12px;
}

.gear-item-detail ul.gif-group-1 li.gif-1-5 span {
    background-position: -37px 12px;
}

.gear-item-detail ul.gif-group-1 li.gif-1-6 span {
    background-position: 0 12px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-1 span {
    background-position: 0 -134px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-2 span {
    background-position: -80px -134px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-3 span {
    background-position: -40px -134px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-4 span {
    background-position: -120px -134px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-5 span {
    background-position: -160px -134px;
}

.gear-item-detail ul.gif-group-2 li.gif-2-6 span {
    background-position: -200px -134px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-1 span {
    background-position: -80px -290px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-2 span {
    background-position: 2px -290px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-3 span {
    background-position: -160px -290px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-4 span {
    background-position: -200px -290px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-5 span {
    background-position: -120px -290px;
}

.gear-item-detail ul.gif-group-3 li.gif-3-6 span {
    background-position: -200px -290px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-1 span {
    background-position: -80px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-2 span {
    background-position: -240px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-3 span {
    background-position: -160px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-4 span {
    background-position: -195px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-5 span {
    background-position: 3px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-6 span {
    background-position: -37px -446px;
}

.gear-item-detail ul.gif-group-4 li.gif-4-7 span {
    background-position: -117px -446px;
}


/*gear-nav-box*/

.gear-nav-box {
    width: 214px;
    height: 342px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}

.gear-nav-box a {
    width: 130px;
    height: 56px;
    line-height: 56px;
    float: left;
    display: block;
    background: url("images/gear_group_bg.png") no-repeat left top;
}

.gear-nav-box a.gn-1 {
    margin-left: 60px;
    margin-top: 16px;
    background-position: 0 -2px;
}

.gear-nav-box a.gn-2 {
    margin-left: 0px;
    margin-top: 20px;
    background-position: 0 -75px;
}

.gear-nav-box a.gn-3 {
    margin-left: 0px;
    margin-top: 45px;
    background-position: 0 -144px;
}

.gear-nav-box a.gn-4 {
    margin-left: 60px;
    margin-top: 20px;
    background-position: 0 -216px;
}

.gear-nav-box a.gn-1:hover,
.gear-nav-box a.gn-1.current {
    margin-left: 60px;
    margin-top: 16px;
    background-position: -130px -2px;
}

.gear-nav-box a.gn-2:hover,
.gear-nav-box a.gn-2.current {
    margin-left: 0px;
    margin-top: 20px;
    background-position: -130px -75px;
}

.gear-nav-box a.gn-3:hover,
.gear-nav-box a.gn-3.current {
    margin-left: 0px;
    margin-top: 45px;
    background-position: -131px -144px;
}

.gear-nav-box a.gn-4:hover,
.gear-nav-box a.gn-4.current {
    margin-left: 60px;
    margin-top: 20px;
    background-position: -131px -215px;
}

.gear-loading {
    width: 50px;
    height: 50px;
    display: block;
    position: absolute;
    top: 100px;
    left: 100px;
    z-index: 9;
    background: url("images/load2.gif") no-repeat left top;
    background-size: 100%;
}


/*role*/

.role {
    position: relative;
    width: 380px;
    height: 381px;
    padding: 0 0 0 0;
    float: left;
}

.role-inner {
    width: 100%;
    height: 383px;
    background: url("images/r_bg.png") no-repeat right top #252f41;
    position: relative;
}

.role-nav {
    position: absolute;
    z-index: 5;
    top: 20px;
    left: 10px;
    width: 50px;
    height: 130px;
}

.role-nav li {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: url("images/gamedata_r.png") no-repeat left bottom;
    color: #dbdfe5;
    float: left;
    font-size: 14px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.f-cf {
    width: 100%;
}

.role-detail {
    height: 383px;
    position: absolute;
}

.role-nav li a {
    width: 100%;
    height: 100%;
    display: block;
    float: left;
}

.role-nav li.nav-0 {
    background-position: 0 -57px;
}

.role-nav li.nav-1 {
    background-position: -63px -57px;
}

.role-nav li.nav-0.cur {
    background-position: -1px 0;
}

.role-nav li.nav-1.cur {
    background-position: -63px 0px;
}

.r-desc {
    height: 383px;
    width: 380px;
    position: absolute;
    left: 0;
    z-index: 1;
    top: -10px;
    opacity: 0;
    overflow: hidden;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    transition: all 0.3s ease;
}

.role-type {
    width: 100px;
    height: 50px;
    position: absolute;
    bottom: 16px;
    left: 20px;
    z-index: 9;
}

.role-type a {
    width: 45px;
    height: 50px;
    line-height: 50px;
    display: block;
    float: left;
    margin-left: 1px;
    cursor: pointer;
    background: url("images/new-server.jpg") no-repeat 100px 0;
}

.curMod .r-desc {
    right: 0px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    opacity: 1;
    transform: scale(1);
    filter: alpha(opacity=100);
}

.curMod .role0 {
    top: -10px;
}

.curMod .role1 {
    top: -10px;
}

.curMod .role2 {
    top: 0px;
}

.curMod .role3 {
    top: -46px;
}

.curMod .role4 {
    top: -37px;
}

.curMod .role5 {
    top: -38px;
}

.curMod .role6 {
    top: -32px;
}

.curMod .role7 {
    top: -45px;
}

.role-detail .r-desc img {
    width: 376px;
    height: 390px;
    float: right;
}


/*links*/

.links {
    float: left;
    height: 96px;
    width: 308px;
}

.links .t {
    margin-bottom: 22px;
    margin-left: 35px;
}

.links .focus {
    border-bottom: 2px solid #000000;
    color: #000000;
}

.links .con {
    width: 314px;
    height: 100px;
    position: relative;
    font-size: 12px;
    color: #fff;
    text-align: left;
    padding: 8px 0px 8px 0;
    overflow: hidden;
    background: #222a3c;
    border-left: none;
}

.links a {
    font-size: 14px;
    display: inline-block;
    white-space: nowrap;
    margin: 20px 10px 6px 0;
    color: #fff;
}

.link-title {
    width: 292px;
    height: 50px;
    position: relative;
}

.link-t-bg {
    width: 166px;
    height: 65px;
    line-height: 65px;
    display: block;
    float: left;
    background: url("images/friend_link_bg.png") no-repeat 0 center;
}

.media h3 {
    margin-left: 10px;
}

h3 {
    height: 85px;
    color: #fff;
    font-size: 10px;
    line-height: 110px;
    overflow: hidden
}

h3 em {
    color: #fff;
    font-size: 24px;
    margin-right: 6px
}


/*article list*/

.content {
    width: 820px;
    position: relative;
}

.content strong {
    font-weight: 700
}

.article-top {
    overflow: hidden;
    width: 100%;
    height: 90px;
    line-height: 90px;
    color: #fff;
    background: url("images/article_nav_bar_bg.jpg") repeat-x left top;
}

.article-top span {
    font-size: 26px;
    line-height: 90px;
    height: 90px;
    width: 130px;
    padding: 0 0 0 31px;
    color: #fff;
    display: block;
    float: left;
}

.bread-nav {
    height: 30px;
    line-height: 30px;
    float: right;
    margin-right: 15px;
    margin-top: 30px;
    color: #fff;
    max-width: 590px;
    overflow: hidden;
}

.bread-nav a {
    color: #fff;
}

.article-main {
    min-height: 1215px;
    padding: 0;
    background: #1b2130;
    _height: 867px;
}

.article-list {
    margin: 0 auto;
    padding-top: 16px
}

.article-list a {
    padding-left: 15px;
    color: #fff;
    transition: .2s;
}

.article-list li {
    line-height: 30px;
    overflow: hidden;
    height: 30px;
    margin: 0 15px;
}

.article-list li:hover {
    background: #252f41;
    color: #cdd2db
}

.article-list li:hover a {
    color: #cdd2db;
    padding-left: 17px;
    transition: .2s;
}

.article-list .time {
    margin-right: 10px;
    color: #59697b;
}

.article-list li:hover .time {
    color: #cdd2db;
}

.article-list .red-main .time,
.article-list .red-main a {
    color: #fff;
}

.article-list .org-main .time,
.article-list .org-main a {
    color: #fff;
}

.news-date {
    float: right
}

.pageNum {
    height: 50px;
    margin: 20px auto 0;
    padding-top: 20px;
    text-align: center
}

.pageNum span {
    font-size: 14px;
    line-height: 30px;
    margin: 3px;
    padding: 6px 11px;
    color: #fff;
    background: #b09c59;
}

.pageNum a {
    font-size: 14px;
    line-height: 30px;
    margin: 3px;
    padding: 6px 11px;
    background: #343f58;
    color: #fff;
}


/*article*/

.article-title {
    font-size: 20px;
    overflow: hidden;
    text-align: center;
    color: #8e1e11;
}

.article-title h1 {
    font-size: 20px;
    color: #e7c864;
    font-weight: 400;
    margin-top: 15px;
}

.article-detail {
    line-height: 30px;
    height: 28px;
    padding: 8px 0;
    text-align: center;
    margin: 0 30px;
    border-bottom: 1px solid #2c3242;
}

.article-detail span {
    color: #8f8f8f;
}

.article-content {
    line-height: 2;
    padding: 20px 30px;
}

.article-relation {
    font-size: 14px;
    height: 150px;
    margin: 0 30px;
    color: #fff;
}

.article-relation a:hover {
    color: #ccc;
}

.article-relation dt {
    line-height: 36px;
    height: 36px;
    text-indent: 8px;
    border-bottom: 1px solid #2c3242;
    color: #fff;
}

.article-relation dd {
    line-height: 30px;
    float: left;
    overflow: hidden;
    width: 48%;
    height: 30px;
    margin: 0 0 0 1%;
    *display: inline;
    color: #fff;
}

.article-relation dd a,
.article-relation dd .time {
    color: #fff;
}


/* server-list */

.s-body {
    background: url(images/s-images/bg.jpg) center 0 no-repeat;
    color: #fff
}

.s-body a {
    color: #fff
}

.s-wrap {
    background: url(images/s-images/main.jpg) no-repeat;
    width: 1000px;
    height: 1100px;
    margin: 0 auto;
}

.s-header {
    position: relative;
    height: 245px;
}

.s-content {
    position: relative;
    margin: 92px 0 0 330px;
}

.s-logo {
    position: absolute;
    top: 20px;
    left: 0;
    overflow: hidden;
    text-indent: -9999px;
    width: 254px;
    height: 165px;
    background: url("images/s-images/big_logo.png") no-repeat right top;
}

.s-nav {
    height: 70px;
    width: 676px;
    position: absolute;
    left: 315px;
    top: 20px;
}

.s-nav a {
    float: left;
    width: 154px;
    height: 66px;
    text-indent: -9999em;
    margin-right: 15px;
    background: url("images/s-images/btns.png") no-repeat left top;
}

.s-nav a#s-nav1 {
    background-position: 0 0;
}

.s-nav a#s-nav2 {
    background-position: -168px 0;
}

.s-nav a#s-nav3 {
    background-position: -336px 0;
}

.s-nav a#s-nav4 {
    background-position: -504px 0;
}

.s-nav a#s-nav1:hover {
    background-position: 0 -66px;
}

.s-nav a#s-nav2:hover {
    background-position: -168px -66px;
}

.s-nav a#s-nav3:hover {
    background-position: -336px -66px;
}

.s-nav a#s-nav4:hover {
    background-position: -504px -66px;
}

/* s-loginframe */

.s-loginframe {
    position: absolute;
    top: 174px;
    left: 315px;
    width: 687px;
    height: 87px;
}

.s-text {
    width: 183px;
    height: 29px;
    padding: 0 5px 0 30px;
    background: #fff url(about:blank) 5px 50% no-repeat;
    line-height: 29px;
    border-radius: 3px;
}

.s-user .s-text {
    background-image: url("images/s-images/i1.png")
}

.s-psw .s-text {
    background-image: url("images/s-images/i2.png")
}

.s-user {
    top: 18px;
    left: 20px;
}

.s-psw {
    top: 18px;
    left: 248px
}

.s-log-btn {
    top: 18px;
    left: 481px;
}

.s-log-btn a {
    display: block;
    width: 188px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 22px;
    background: url(images/s-images/login.png) left top no-repeat;
    text-indent: -9999em;
}

.s-log-btn a:hover {
    background-position: 0 -50px;
}

.s-remember {
    top: 57px;
    left: 20px;
}

.s-psw-btn {
    top: 60px;
    left: 222px
}

.s-reg-btn {
    top: 60px;
    left: 300px
}

.s-three {
    top: 55px;
    left: 248px;
}


/* s-loged */

.s-loged {
    width: 616px;
    color: #fff;
    font-size: 12px;
    margin: 9px 0 0 20px;
}

.s-loged li {
    line-height: 24px;
    float: left;
    width: 295px;
}

.s-loged a {
    color: #c3863b;
}

.s-loged .s-loged-highlight {
    color: #c3863b;
}


/* s-recommend-server */

.s-name {
    font-size: 18px;
    color: #FFF;
    line-height: 42px;
}

.s-name-rec {
    font-weight: 700;
    color: #fff;
    text-indent: 1em;
}

.s-server-list {
    position: relative;
    overflow-y: auto;
}

.s-body .rec-server li,
.s-body #servers li {
    line-height: 42px;
    float: left;
    width: 204px;
    height: 42px;
    margin: 0 10px 10px 0;
    text-align: center;
    font-size: 14px;
}

.s-body .rec-server li {
    color: #000;
    background: url(images/s-images/btn1.png) no-repeat;
}

.s-body .rec-server li a {
    color: #000;
    font-size: 14px;
}

.s-body .rec-server li a span {
    color: #a40004;
}

.s-body .rec-server li:hover {
    background-position: 0 -42px;
}

.s-server-list a {
    display: block;
    height: 100%;
}

.s-server-list span {
    color: #fff;
    margin-left: 5px;
}

.s-body #servers li {
    color: #000;
    background: url(images/s-images/btn2.png) no-repeat;
}

.s-body #servers li:hover {
    background-position: 0 -42px;
}

.s-body #servers li a span {
    color: #fae000;
}

#history {
    float: left;
    /* margin:14px 0 0 200px; */
    overflow: hidden;
    height: 43px;
}


/* s-quick-ingame */

.s-quick-ingame {
    width: 180px;
    height: 28px;
    line-height: 25px;
    font-size: 12px;
    position: absolute;
    bottom: 23px;
    left: 380px;
}

.s-fastin-input {
    width: 44px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    color: #000;
    background: #f4ebdc;
    margin-left: 5px;
}

.s-server-list .s-fastin-btn {
    width: 62px;
    height: 26px;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 77px;
    background-color: #3255c1;
    color: #ffffff;
    text-align: center;
}

.s-server-list .s-fastin-btn:hover {
    color: #90ffee;
}


/* s-all-server- */

.all {
    overflow-y: auto;
    height: 664px
}

.sp-pager {
    overflow: hidden;
}

.sp-pager {
    margin: 0;
    height: 30px;
    margin: 0 10px 12px 0;
    width: 670px;
    height: auto;
}

.sp-pager span {
    color: #b48333
}

#nameList {
    *margin-bottom: 8px
}

.sp-pager li,
#nameList a {
    line-height: 28px;
    width: 84px;
    height: 28px;
    margin: 0px 10px 8px 0;
    cursor: pointer;
    background: #937654;
    color: #fff;
    text-align: center;
    float: left;
    display: block;
}

.sp-pager li.hover,
.sp-pager li:hover,
#nameList a.hover {
    background: #937654;
    color: #fff
}

.sp-pager li a {
    color: #fff
}


/*service*/

.sml {
    float: left;
    width: 1200px;
    color: #fff;
}

.service {
    width: 624px;
    height: auto;
    float: left;
    margin-right: 10px;
}

.service .con {
    width: 100%;
    height: 116px;
    background: #222a3c;
    position: relative;
}

.contact {
    float: left;
    line-height: 24px;
    width: 393px;
    margin-left: 14px;
    padding-top: 5px;
}

.contact p {
    float: left;
    margin-right: 20px;
    margin-top: 20px;
}

.service a {
    width: 95px;
    height: 20px;
    display: inline-block;
    text-align: center;
    line-height: 20px;
    color: #fff;
}

.service .contact a {
    height: 23px;
    line-height: 23px;
    color: #000;
    background: #cab15e;
}

.service .contact a:hover {
    background: #b19474;
}

.ser-title {
    width: 100%;
    height: 65px;
    position: relative;
}

.ser-t-bg {
    width: 200px;
    height: 50px;
    line-height: 50px;
    display: block;
    float: left;
    background: url("images/server_title_bg.png") no-repeat 10px center;
}

.qr {
    float: left;
    margin-top: 14px;
}

.qr-des {
    width: 98px;
    float: left;
    margin-top: 16px;
    margin-left: 10px;
    line-height: 20px;
}

.qr-des em {
    color: #fff;
}

.t {
    margin-bottom: 22px;
}

.icon-code {
    background: url(images/qr.jpg) no-repeat;
    width: 89px;
    height: 89px;
    margin-bottom: 5px;
}


/*server list*/


/*** server ****/

.server-bg {
    background: #4a6387;
    position: absolute;
    right: 0px;
    top: 0;
    width: 324px;
    height: 379px;
    opacity: .9;
    z-index: 1;
}

h2 {
    color: #333;
    font-size: 20px;
    height: 48px;
    line-height: 48px;
}

h2 em {
    color: #7e8083;
    font-size: 14px;
}

.choice-server h2 {
    color: #e2ebff;
    height: 39px;
    line-height: 39px;
}

.choice-server em {
    color: #636f8b;
}

.h2-bg {
    background-color: #152e55;
    opacity: .8;
    position: absolute;
    top: 1px;
    height: 39px;
    width: 323px;
    z-index: 2;
    right: 1px;
}

.quick-ingame {
    height: 38px;
    text-align: center;
    line-height: 38px;
    position: relative;
    top: -6px;
}

.side-enter a {
    display: block;
    border: 1px solid #3c3c3c;
    margin-bottom: 4px;
}

.side-enter a:hover {
    border-color: #c68459;
}

.s-fastin {
    background: #7c7c7c;
    color: #d7d8e0;
    border: 1px solid #454545;
    height: 18px;
    text-align: center;
    width: 42px;
}

#select-dom-xz,
#select-dom-dq {
    width: 58px;
}

#select-dom-xz .select-con,
#select-dom-dq .select-con {
    width: 44px;
}

.option-bg {
    position: absolute;
    display: none;
    left: 63px;
    top: 22px;
    z-index: 9999;
}

.option-bg-type-i {
    left: 64px;
    top: 22px;
    zoom: 1;
}

.option-bg-dq,
.option-bg-xz {
    left: 502px;
}

.option-dom {
    width: 208px;
    padding: 1px;
    background: #989ca3;
    border: 1px solid #3C436B;
    font-size: 12px;
    overflow: hidden;
}

.s-body .option-dom {
    background: #fff;
}

.type-option-dom {
    width: 175px;
    font-size: 12px;
    background: #454545;
    color: #fff;
}

#type-option-dom-1 {}

#type-option-dom-1 li {
    height: 20px;
    font-size: 14px;
    width: 100%;
    text-indent: 6px;
}

#type-option-dom-2 li {
    background: #989ca3
}

#option-dom-1 {
    background: #EED5BB
}

.now-is-0 .select-type-0,
.now-is-1 .select-type-1,
.now-is-2 .select-type-2 {
    display: inline-block;
    vertical-align: top;
    *display: inline;
}

.select-type-hs-i {
    display: block;
}

#select-dom-xz-i,
#select-dom-dq-i {
    width: 69px;
}

.select-con-xz-i,
.select-con-dq-i {
    width: 51px;
}

#select-dom-xz-i .select-btn,
#select-dom-dq-i .select-btn {}


/* fastin */

.f-wrap {
    height: 34px;
    padding-left: 234px;
    margin-top: 40px;
    color: #dcdcdc;
}

.s-body #quick-ingame,
.s-body #quick-ingame-ty,
.s-body #quick-ingame-dq {
    width: 205px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    float: left;
    position: relative;
}

.s-body #quick-ingame a,
.s-body #quick-ingame-ty a,
.s-body #quick-ingame-dq a {
    display: inline-block;
    width: 56px;
    height: 20px;
    margin: 0 3px;
    line-height: 20px;
    text-align: center;
    color: #fff;
    background: #20255c;
    vertical-align: middle;
}

.s-body #quick-ingame a:hover,
.s-body #quick-ingame-ty a:hover,
.s-body #quick-ingame-dq a:hover {
    background: #384187;
}

.s-body .dq-select-dom {
    left: 15px;
    top: 9px;
    position: absolute;
}

.s-body #quick-ingame-dq .s-text {
    position: absolute;
    left: 116px;
    top: 0;
}

#serverTab {}

#serverTab li,
#all-sx-server-tab li {
    float: left;
    width: 86px;
    height: 23px;
    line-height: 23px;
    text-align: center;
    cursor: pointer;
    margin: 0 8px 5px 0;
    text-indent: 0;
    background: #1D3D6B;
    color: #FFF;
}

#serverTab .on,
#all-sx-server-tab .on {
    background: #EC8F00;
    color: #fff;
}

.no-dq-server-wrap #serverTab li,
#all-sx-server-tab li {
    font-size: 12px;
}


/* server */

.st1 {
    padding-top: 75px;
    height: 44px;
}

.st1 a,
.st2 a {
    color: #fff;
    display: inline-block;
    width: 100%;
}

.st1 a span {
    color: #fff100;
}

.st2 {
    padding-top: 18px;
}

.st2 li {
    float: left;
    _display: inline;
    height: 36px;
    line-height: 36px;
    margin: 0 10px 12px 0;
}

.st2 a span {
    color: #fff100;
}

#listContent {
    height: 378px;
    overflow-y: auto;
}

.st2 li .server-tip-1,
.st1 li .server-tip-1 {
    color: #fbdb00;
}

.top-log-btn {
    text-decoration: underline;
}

#all-sx-server-list {
    height: 450px
}

.sx-li {
    display: none;
}

.sx-li7 {
    display: block;
}


/* 地区服新增 */

.s-body .sup-tab {
    margin: 10px 0 10px 234px;
    height: 34px;
    overflow: hidden;
}

.s-body .sup-tab a {
    float: left;
    width: 194px;
    height: 34px;
    color: #fff;
    _display: inline;
    margin-right: 13px;
}

.s-body .sup-tab .current {
    background-position: -1px 0;
}

.s-body .sup-tab strong {
    display: block;
    height: 34px;
    line-height: 34px;
    font-size: 18px;
    padding-left: 84px;
}

.s-body .sup-tab-2 strong {
    background-position: 48px -143px;
}

.s-body .sup-tab-3 strong {
    background-position: 48px -195px;
}

.hs-server-wrap,
.dq-server-wrap,
.sx-server-wrap {
    display: none;
}

.now-is-1 .hs-server-wrap {
    display: block;
}

.now-is-1 .no-dq-server-wrap {
    display: none
}

.now-is-1 .sp-pager,
.now-is-2 .sp-pager {
    display: none;
}

#all-dq-server-tab,
#all-hs-server-tab {
    overflow: hidden;
}

#all-hs-server-tab {
    display: none;
}

#all-dq-server-tab a,
#all-hs-server-tab a {
    float: left;
    width: 85px;
    height: 28px;
    margin: 0 9px 6px 0;
    text-align: center;
    line-height: 28px;
    color: #FFF;
    background: #1D3D6B;
}

#all-dq-server-tab .on,
#all-hs-server-tab .on {
    background: #EC8F00;
}

#all-dq-server-list,
#all-hs-server-list,
.sp-panel-wrap {
    height: 618px;
    overflow-y: auto;
    width: 608px;
}

#all-dq-server-list a,
#all-hs-server-list a {
    float: none;
    text-align: center;
    margin-left: 0;
}


/* server */

.s-fastin {
    color: #d7d8e0;
    height: 19px;
    line-height: 19px;
    text-align: center;
    width: 70px;
}

.select1,
.select2 {
    display: inline-block;
    position: relative;
    *display: inline;
    *margin-right: 4px;
    *z-index: 2
}

.choice-tab {
    height: 31px;
    position: relative;
    z-index: 9;
    font-size: 12px;
}

.option-dom {
    background: #FFFFFF;
    font-size: 12px;
    overflow: hidden;
    width: 180px;
    border: 1px solid #A2A2A2;
    padding: 1px;
}

.option-dom li {
    height: 16px;
    color: #000;
    cursor: pointer;
    float: left;
    line-height: 16px;
    width: 56px;
    _width: 55px;
    padding: 2px;
    text-align: center;
    overflow: hidden;
}

.option-dom li.focus {
    background: #EA9200;
    color: #fff;
}

.select-dom {
    width: 175px;
    height: 22px;
    display: inline-block;
    background: #fff;
    color: #d7d8e0;
    vertical-align: middle;
    position: relative;
}

.select-con {
    width: 175px;
    height: 22px;
    position: absolute;
    left: 0;
    top: 0;
    background: #7c7c7c;
    line-height: 22px;
    cursor: pointer;
    text-align: center;
}

.select-btn {
    position: absolute;
    width: 0;
    height: 0;
    display: block;
    border-top: 8px solid #fdfefe;
    border-left: 8px solid #7c7c7c;
    border-right: 8px solid #7c7c7c;
    border-bottom: none;
    cursor: pointer;
    _font-size: 0;
    overflow: hidden;
    right: 6px;
    top: 8px;
}

.s-wrap #selFastType .select-btn,
.s-wrap #select-dom-xz .select-btn {
    position: absolute;
    width: 0;
    height: 0;
    display: block;
    border-top: 8px solid #143e5a;
    border-left: 8px solid #fff;
    border-right: 8px solid #fff;
    border-bottom: none;
    cursor: pointer;
    _font-size: 0;
    overflow: hidden;
    right: 6px;
    top: 8px;
}

#select-dom-xz {
    width: 60px;
}

#select-dom-xz .select-con {
    width: 60px;
    border: 0;
    overflow: hidden;
}

.option-bg {
    position: absolute;
    display: none;
    left: 0;
    top: 22px;
}

.option-bg-type {
    left: 0px;
    top: 23px;
    width: 175px;
}

.sup-tab-btn {
    line-height: 16px;
    height: 16px;
    width: 175px;
    color: #d7d8e0;
    cursor: pointer;
    padding: 2px 0;
    text-align: center;
}

.sup-tab-btn:hover {
    color: #d7d8e0;
}

.select-type {
    z-index: 2;
    font-size: 12px;
}

.c-more {
    width: 91px;
    height: 30px;
    background: #D5523A;
    display: block;
    color: #fff;
    transition: .5s;
    line-height: 30px;
    border-radius: 15px;
    text-align: center;
}

.c-more:hover {
    background: #4e5c91;
    color: #fff;
}

.more-server {
    margin: 23px 0 0 17px;
}

.s-body .type-choose {
    height: 32px;
    position: relative;
    font-size: 14px;
    margin: 8px 0 14px 0;
    z-index: 2;
}

.s-body .select-dom {
    width: 120px;
    height: 27px;
    color: #1f395f;
    border: 0;
    *margin-right: 4px;
}

.s-body .select-con {
    color: #242425;
    height: 27px;
    line-height: 27px;
    width: 116px;
    background: #fff;
}

.s-body .s-fastin {
    height: 27px;
    line-height: 27px;
    color: #242425;
    background: #fff;
}

.s-body #select-dom-xz {
    width: 116px
}

.s-body #select-dom-xz .select-con {
    width: 110px;
}

.s-body .option-bg {
    display: none;
    z-index: 2;
    top: 28px;
    left: 0;
    *top: 30px;
}

.s-body .option-dom {
    border: 0;
}

.s-body .type-option-dom {
    width: 118px;
    padding: 1px;
    font-size: 12px;
    border: 0;
}

.s-body .type-option-dom li {
    width: 114px;
    padding: 2px;
    line-height: 22px;
    height: 22px;
}

.s-body .type-option-dom li:hover {
    background: #EA9200;
    color: #fff;
}

.s-body #btnFast {
    width: 72px;
    height: 27px;
    background: #cab15e;
    color: #000;
    text-indent: 0;
    line-height: 27px;
    text-align: center;
    margin-left: 4px;
    font-size: 12px;
    border-radius: 0;
}

.s-body #btnFast:hover {
    color: #000;
    background: #d0ae88;
}

#all-xz-server {
    height: 505px;
    overflow: hidden
}

.sq-dialog-alert {
    text-align: center;
}


/*three*/

.loged img,
.s-loged img {
    margin-right: 3px;
    vertical-align: middle;
}

.three {
    top: 194px;
    left: 40px;
    font-size: 12px;
    line-height: 30px;
}

.three-icon {
    background: url(//img1.37wanimg.com/common/css/images/three.png) no-repeat;
    transition: .5s;
    width: 28px;
    height: 28px;
    display: inline-block;
    text-indent: -9999em;
    vertical-align: middle;
    margin: 0 8px;
}

.three-wx {
    background-position: -39px 0;
}

.three-wb {
    background-position: -78px 0;
}

.s-body .log .three {
    left: 222px;
    top: 41px;
}

.s-body .three-icon {
    margin: 0 4px;
}

/*fast*/

.fast {
    width: 100%;
    height: 220px;
    float: left;
    position: relative;
    padding: 10px 0;
    background: #0c141d;
    margin-bottom: 60px;
}

.f {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.f em {
    line-height: 115px;
    font-size: 16px;
    margin-left: 14px;
}

.f1 {
    background: url(images/gt_img_1.jpg) no-repeat;
}

.f2 {
    background: url(images/gt_img_2.jpg) no-repeat;
}

.f3 {
    background: url(images/gt_img_3.jpg) no-repeat;
}

.f4 {
    background: url(images/gt_img_4.jpg) no-repeat;
}

.fast a {
    float: left;
    display: inline-block;
    overflow: hidden;
    width: 265px;
    height: 210px;
    text-indent: -999em;
    position: relative;
    top: 7px;
    transition: all linear .3s;
    -moz-transition: all linear .3s;
    -webkit-transition: all linear .3s;
    -o-transition: all linear .3s;
    -ms-transition: background linear .3s;
    background-repeat: no-repeat;
}

.fast a.cur {
    width: 405px;
    height: 220px;
    top: 0;
    background-size: 100% auto;
}

a.f1 {}

a.f2 {
    *top: -13px;
}

a.f3 {
    *top: -34px;
}

a.f4 {
    *top: -54px;
}

.fast a.f1.cur {}

.fast a.f2.cur {
    *top: -18px;
}

.fast a.f3.cur {
    *top: -38px;
}

.fast a.f4.cur {
    *top: -58px;
}

.f1.cur {
    background: url(images/gt_img_1_1.png) no-repeat left top;
}

.f2.cur {
    background: url(images/gt_img_2_1.png) no-repeat left top;
}

.f3.cur {
    background: url(images/gt_img_3_1.png) no-repeat left top;
}

.f4.cur {
    background: url(images/gt_img_4_1.png) no-repeat left top;
}

.f i {
    position: absolute;
    top: 16px;
    left: 28px;
    display: block;
    width: 68px;
    height: 68px;
    text-indent: -9999em;
    transition: .8s;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.fl-title-bg {
    width: 300px;
    height: 56px;
    line-height: 56px;
    display: block;
    float: left;
    position: absolute;
    bottom: -2px;
    left: 0;
    background: url("images/game_tips_title.png") no-repeat left bottom;
}

.fast-li {
    width: 100%;
    height: auto;
    float: left;
}

.fast-link-title {
    width: 100%;
    height: 54px;
    border-bottom: 2px solid #cfcfcf;
    float: left;
    position: relative;
}

.fast a.more-fast-link-btn {
    display: block;
    background: url("images/more1.png") no-repeat left top;
    width: 32px;
    height: 28px;
    position: absolute;
    right: -4px;
    top: 0px;
}