/* CSS Document
Use for:    hbq.99.com
Version:   1.0
Date:        2015-06-10 14:14:37
Author:     Bingyu Yuan
*/

/***********************reset***********************/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td ,span, object, iframe{ padding: 0; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
ol, ul { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }
a{text-decoration: none;}

.clearfix:after{ content:""; height:0; visibility:hidden; display:block; clear:both;}
.clearfix{ zoom:1;}
.dn{display:none}
.fl{float: left;}
.fr{float: right;}

.wrapper{width: 1200px;margin: 0 auto;}

/************************************
* index
*************************************/
/*---------- header ----------*/
.header{background: url(../images/header.jpg) no-repeat top center;}
.header .wrapper{z-index: 1;position: relative;background: url(../images/header.jpg) no-repeat top center;height: 84px;}
/*logo*/
.logo{position: absolute;z-index: 50; width: 280px;top: 0;left: -10px;}
.logo a{display: block;}
.logo img{display: block;width: 100%;}
/*nav*/
.top-nav {margin: 0 0 0 280px;}
.top-nav li{float: left;}
.top-nav a{display: block; width: 130px;padding: 30px 0 0;height: 53px; color: #FF0000;font: 18px/26px "Microsoft Yahei";text-shadow:2px 2px 2px #51644e;text-align: center;}
.top-nav span{display: block;color: #858686;font-size: 12px;line-height: 16px;text-shadow:none;font: 12px/16px "Tahoma","Arial","Microsoft Yahei"}
.line{width: 0;height: 3px;margin: 8px auto 0;-webkit-transition: width 0.2s linear 0s; -moz-transition: width 0.2s linear 0s; -o-transition: width 0.2s linear 0s; -ms-transition: width 0.2s linear 0s; transition: width 0.2s linear 0s; background: #a20300;}
.top-nav .on .line,
.top-nav a:hover .line{width: 100%;}

/*---------- banner ----------*/
.banner{background: url(../images/banner_v2.jpg) no-repeat bottom center;}
.banner .wrapper{position: relative; background: url(../images/banner_v2.jpg) no-repeat bottom center;height: 470px;}
/*banner-btns*/
.banner-btns {position: absolute; bottom: 80px; left: 50%;margin-left: -432px; width: 864px; text-align: center;}
.banner-btns li{float: left;;margin: 0 7px;}
.banner-btns a{position: relative;display: block; padding: 4px 0 0; font: 20px/30px "黑体","Microsoft Yahei";width: 270px;height: 50px;border: 1px solid #3d1919;opacity: 0.8;filter: alpha(opacity=80);/*background: #272a29 url(../images/banner-btn.png) no-repeat center 62px;*/background: #511e1b;-webkit-transition: all 0.2s linear 0s; -moz-transition: all 0.2s linear 0s; -o-transition: all 0.2s linear 0s; -ms-transition: all 0.2s linear 0s; transition: all 0.2s linear 0s;color: #d4d4d4;}
.banner-btns a:hover{/*background: url(../images/banner-btn.png) no-repeat center;*/background: none; border-color: #c0c0c0;color: #dad1b3;}
.banner-btns a:hover span{color: #dad1b3;}
.banner-btns span{display: block;color: #7a7a7a;font: 10px/12px "Arial","Tahoma","Microsoft Yahei";}
/*banner-nav*/
.banner-nav{position: absolute;bottom: 25px;left: 50%;margin-left: -325px; width: 850px;}
.banner-nav li{float: left;margin: 0px 20px;}
.banner-nav a{position: relative;display: block;width: 100px; height: 42px; padding: 0 0 0 30px; font: 18px/28px "Microsoft Yahei";color: #9d9d9d;-webkit-transition: color 0.2s linear 0s; -moz-transition: color 0.2s linear 0s; -o-transition: color 0.2s linear 0s; -ms-transition: color 0.2s linear 0s; transition: color 0.2s linear 0s;color: #d4d4d4; white-space: nowrap;}
.banner-nav span{display: block; color: #7a7a7a;font: 10px/12px "Arial","Tahoma","Microsoft Yahei";}
.bn-icon{position: absolute;top: 4px;left: 0; width: 26px;background: url(../images/sprite.png) no-repeat -26px 0; height: 26px;}
.banner-nav a:hover{color: #fbe997;}
.banner-nav a:hover .bn-icon{background-position: 0 0;-webkit-animation: bn-icon 0.2s forwards;-o-animation: bn-icon 0.2s forwards;-moz-animation: bn-icon 0.2s forwards;animation: bn-icon 0.2s forwards;}


/*---------- main ----------*/
.main,.main .wrapper{background: #191919 url(../images/index-main.jpg) no-repeat bottom center;}

.main .wrapper{padding: 0 0 50px;}
.box-shadow{box-shadow: 5px 5px 10px #161717;}
.main-section{margin-bottom: 50px;}
.ms-last{margin: 0;}
/*---------- news section----------*/
.ms-news{height: 313px;background: #1e2427;}

/*slide*/
.slide{position: relative; width: 820px;height: 312px;overflow: hidden;}
.slide-cont{position: relative;z-index:1;  }
.slide-cont,
.slide-cont li{width: 100%;height: 100%;}
.slide-cont li{zoom:1;}
.slide a,
.slide img{display: block;width: 100%;height: 100%;}

.slide-nav {position: absolute; bottom: 0;right: 0; z-index: 10; padding: 10px 5px;  width: 160px; text-align: right; overflow: hidden;background: url(../images/bfb37f562ec843398b7128fb50dfebb5.gif); background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 ); }
.slide-nav li {display: inline-block; *display: inline; zoom: 1; background: url(../images/sprite.png) no-repeat -29px -31px; width: 15px; height: 15px; *margin: 0 2px;margin: 0 5px; font-size:0; line-height:0; overflow:hidden; cursor: pointer;}
.slide-nav li.on {background-position: -3px -31px;}
/*news*/
.news{width: 380px;}
.news-tab{position: relative;z-index: 2; height: 48px;}
.news-tab li{float: left;}
.news-tab a{background: #1e2427;display: block; padding: 14px 16px 10px;height: 24px;color: #8b8b8b;font: 16px/24px "Microsoft Yahei";text-align: center;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.news-tab .on a{box-shadow: none; background: #353e42 url(../images/news-tab.jpg) repeat top center; color: #ececec;}

/*content*/
.news-cont{position: relative;z-index: 1;background: #343d41 url(../images/news-cont.jpg) repeat-x bottom center;height: 264px;overflow: hidden;}
.news-cont-item{position: relative;height: 100%;width: 100%;}
.news-list a{display: block;padding:0 25px; overflow: hidden;color: #aab3b8;font: 12px/30px "Microsoft Yahei";-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0s;white-space: nowrap;}
.news-list span{cursor: pointer;}
.news-list a:hover,
.news-list a:hover span{text-decoration: underline;color: #b3daef;}
.news-list .time{float: right;vertical-align: middle;}
.news-list .news-tit{float: left; overflow: hidden; display: inline-block; width: 280px; text-overflow: ellipsis;}
.top-news {box-shadow: 0 -10px 20px -10px #1b2023;margin: 0 0 15px; background: #353e42 url(../images/news-tab.jpg) repeat-x bottom center;text-align: center;}
.top-news .time{display: none;}
.top-news .news-tit{float: none;display: block;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.top-news a{color: #b7b39b;text-align: center;font-size: 16px;line-height: 56px;}
.top-news a:hover{text-decoration: none;color: #9b9fb7;}
.news-tab li .more-btn{display: none; padding: 0;margin: -9px 0 0; top: 50%; right: 10px; position: absolute;background: url(../images/sprite.png) no-repeat no-repeat -56px 0; width: 18px; height: 18px;-webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none;}
.news-tab li .more-btn:hover{background-position: -56px -22px;}
.news-tab .on .more-btn{display: block;}

/*---------- gameplay section ----------*/
.gameplay-box{position: relative; height: 314px;overflow: hidden;}
/*tab*/
.gameplay-tab{position: absolute;z-index: 2; bottom: 0;left: 0;width: 100%; height: 40px;padding: 12px 50px 8px;background: url(../images/0ad20d3a686847338a0bc2b31543c7b4.gif);
background: -moz-linear-gradient(left,  rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.9)), color-stop(50%,rgba(0,0,0,0.6)), color-stop(100%,rgba(0,0,0,0)));
background: -webkit-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%);
background: -o-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 );
}
.gameplay-tab li{float: left;margin: 0 50px;}
.gameplay-tab a{display: block; height: 39px; *width: 140px; color: #b1b1b1;font: 16px/36px "Microsoft Yahei";text-align: center;vertical-align: top;-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0s;}
.gameplay-tab span{display: block;*display: inline;*zoom: 1;cursor: pointer;}
.gameplay-tab .on a{color: #f4f4f4;}
.gameplay-tab .txt{padding: 0 30px;white-space: nowrap;}
.gameplay-tab .line{width: 0;height: 3px;background: #8a8066;margin: 0 auto;line-height: 0;-webkit-transition: width 0.5s linear 0s; -moz-transition: width 0.5s linear 0s; -o-transition: width 0.5s linear 0s; -ms-transition: width 0.5s linear 0s; transition: width 0.5s linear 0s;*position: relative;*top: -20px;}
.gameplay-tab .on a .line{width: 100%;}

/*content*/
.gameplay-cont-item{position: relative;z-index: 1;}
.g-detail-btn{left: 260px;top: 200px; background: #590606; padding: 0 10px; position: absolute;color: #ad9e83;font-size: 14px;line-height: 30px;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.g-detail-btn:hover{background: #7B0909;}
.g-detail-btn i{display: inline-block;width: 9px;background: url(../images/sprite.png) no-repeat -454px -143px; height: 16px; vertical-align: middle;}
.gameplay-img{width: 100%;height: 100%;}
.gameplay-w{position: absolute;top: 30px;left: 10px;height: 200px;width: 336px;}

.animate .gameplay-w{-webkit-animation: slideInLeft 0.5s backwards;-moz-animation: slideInLeft 0.5s backwards; -o-animation: slideInLeft 0.5s backwards; animation: slideInLeft 0.5s backwards;}
.animate .g-detail-btn{-webkit-animation: slideInRight 0.5s backwards; -moz-animation: slideInRight 0.5s backwards; -o-animation: slideInRight 0.5s backwards; animation: slideInRight 0.5s backwards;}

/*---------- main-section-sub ----------*/
.main-section-sub{float: left;}
.main-tit{padding: 0 0 0 20px; color: #b0b0b0;font: 22px/40px "Microsoft Yahei";text-transform: uppercase;}
.main-tit span{margin-left: 10px; font-family: "Tahoma","Arial";color: #363637;vertical-align: middle;text-transform: uppercase;font-size: 18px;}
.main-tit-underline{border-bottom: 1px solid #333334;}
/*---------- REVIEWS ----------*/
.mss-reviews{width: 449px;}
/*tab*/
.reviews-tab{position: relative;background: url(../images/reviews-nav.jpg) repeat-x top;height: 39px;padding: 12px 110px 8px;}
.reviews-tab-three{padding: 12px 55px 8px;}
.reviews-tab li{ float: left;margin: 0 10px;}
.reviews-tab a{display: block; height: 39px; *width: 80px; color: #aab0b3;font: 16px/36px "Microsoft Yahei";text-align: center;vertical-align: top;-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0s;}
.reviews-tab .on a{color: #fff;}
.reviews-tab span{display: block;*display: inline;*zoom: 1;cursor: pointer;}
.reviews-tab .txt{padding: 0 30px;white-space: nowrap;}
.reviews-tab .line{width: 0;height: 3px;background: #8a8066;margin: 0 auto;line-height: 0;-webkit-transition: width 0.5s linear 0s; -moz-transition: width 0.5s linear 0s; -o-transition: width 0.5s linear 0s; -ms-transition: width 0.5s linear 0s; transition: width 0.5s linear 0s;*position: relative;*top: -20px;}
.reviews-tab .on a .line{width: 100%;}
.reviews-tab li .more-btn{display: none; padding: 0;margin: -13px 0 0; top: 50%; right: 10px; position: absolute; width: 26px; height: 26px;color: #aab0b3;font-weight: bold;line-height: 1;font-size: 26px;vertical-align: middle;-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0s;}
.reviews-tab li .more-btn:hover{color: #fff;}
.reviews-tab .on .more-btn{display: block;}

/*cont*/
.reviews-cont{height: 260px;overflow: hidden;}
.reviews-cont-item{position: relative; overflow: hidden;display: none;}
.reviews-cont,
.reviews-cont-item,
.reviews-list,
.reviews-list li,
.reviews-list a,
.reviews-list img{display: block;width: 449px;height: 260px;}
.reviews-list li{position: relative;}
.reviews-list a:after{position: absolute;width: 100%;height: 100%;top: 0;left: 0; background: #000;opacity: 0.15;filter: alpha(opacity=15);content: "";-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.reviews-list a:hover:after{opacity: 0;filter: alpha(opacity=0);}
.reviews-list span{position: absolute; bottom: 0;left: 0; width: 100%;height: 46px;overflow: hidden; background: rgba(0,0,0,0.6); *background: #000; *opacity: 0.6;filter: alpha(opacity=60); color: #bfbfbf;font: 14px/46px "Microsoft Yahei";white-space: nowrap; text-align: center;text-overflow:ellipsis;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.reviews-list a:hover span{background: rgba(0,0,0,0.7); *background: #000; *opacity: 0.7;filter: alpha(opacity=70);}
.reviews-list .play-icon,
.play-icon{position: absolute; top: 50%;left: 50%; margin-left: -39px;margin-top: -39px; background:transparent url(../images/sprite_3.png) no-repeat -521px -128px;width: 78px;height: 78px;}

.reviews-list a:hover .play-icon,
a:hover .play-icon{opacity: 1;filter: alpha(opacity=100);background: transparent url(../images/sprite_3.png) no-repeat -521px -128px;}
.reviews-prev,.reviews-next{position: absolute;top: 50%;margin-top: -27px; width: 40px;height: 54px;background: #050505 url(../images/sprite.png) no-repeat;}
.reviews-prev{background-position: -82px 8px;left: 0;}
.reviews-next{background-position: -108px 8px;right: 0;}

/*---------- DATA ----------*/
.data-txt{text-align: center;color: #9e9e9e;}
.mss-data{}
.data-box{background: url(../images/data-bg.png) no-repeat center;width: 448px;height: 320px;}
.data-box a{display: block;height: 87px; padding: 20px 0 0;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.data-box a:hover{background: #3b4953;}
.data-box li{float: left;}
.data-01 a,
.data-03 a{width: 218px; }
.data-02 a,
.data-04 a{width: 230px; }
.data-05 a{width: 150px;}
.data-06 a{width: 146px;}
.data-07 a{width: 151px;}
.data-03 a,
.data-04 a{height: 92px;padding: 15px 0 0;}
.data-icon{display: block;margin: 0 auto;height: 48px;width: 50px;background: url(../images/sprite.png) no-repeat;}
.data-01 .data-icon{background-position: 0px -71px; }
.data-02 .data-icon{background-position: -55px -71px; }
.data-03 .data-icon{background-position: -113px -64px;}
.data-04 .data-icon{background-position: -176px -65px;}
.data-05 .data-icon{background-position: -245px -67px; }
.data-06 .data-icon{background-position: -317px -66px;}
.data-07 .data-icon{background-position: -376px -67px;}

.data-01 a:hover .data-icon{background-position: 0px -143px; }
.data-02 a:hover .data-icon{background-position: -58px -143px; }
.data-03 a:hover .data-icon{background-position: -115px -135px;}
.data-04 a:hover .data-icon{background-position: -175px -136px;}
.data-05 a:hover .data-icon{background-position: -242px -138px; }
.data-06 a:hover .data-icon{background-position: -313px -137px;}
.data-07 a:hover .data-icon{background-position: -371px -138px;}

.data-txt{-webkit-transition: color 0.5s; -moz-transition: color 0.5s; -o-transition: color 0.5s; -ms-transition: color 0.5s; transition: color 0.5s;font: 14px/24px "Microsoft Yahei"; color: #9f9f9f;}
.data-box a:hover .data-txt{color: #fff;}

/*---------- community ----------*/
.mss-community{position: relative; font: 14px/22px "Microsoft Yahei"; }
.community-box{position: relative;background: url(../images/community-bg.jpg);width: 303px;height: 320px;}
/*contact-way*/
.contact-way{padding: 40px 15px 0 ; clear: both; color: #c3c3c3;font-size: 14px;text-shadow: 3px 3px 3px #444649;}
.contact-way span{margin: 0 15px; font-size: 16px;}
.contact-way-hr{height: 2px;width: 100%;background: #fff;opacity: 0.3; filter: alpha(opacity=30);border: none;}

/*list*/
.community-list{position: absolute;width: 140px;bottom: 10px;left: 20px;}
.community-list li{float: left;}
.community-list a{display: block;margin: 6px; width: 55px; height: 55px;background: url(../images/sprite.png) no-repeat;}
.cl-wechat a{background-position: -444px -4px;}
.cl-weibo a{background-position: -514px -4px;}
.cl-forum a{background-position: -444px -70px;}
.cl-tieba a{background-position: -514px -70px;}
.cl-wechat a:hover{background-position: -160px 0;}
.cl-weibo a:hover{background-position: -229px 0;}
.cl-forum a:hover{background-position: -299px 0;}
.cl-tieba a:hover{background-position:  -370px 0;}

/*code*/
.pop-code-box{display: none; position: fixed;z-index: 20;top: 0;left: 0;width: 100%;height: 100%;}
.pop-code{position: absolute;z-index: 10; top: 50%;left: 50%; width: 246px;height: 246px;margin: -143px 0 0 -143px; padding: 20px;background: #566f7c;}
.pop-code-close{position: absolute;width: 40px;height: 32px; top: -30px;right:0;background: #566f7c;color:#1a1a1a;text-align: center;font-size: 26px;line-height: 32px;}
.pop-bg{z-index: 5; position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;opacity: 0.6;}

/*---------- video ----------*/
.video-sec{background: url(../images/video-bg.jpg) repeat-x;height: 407px;overflow: hidden;font-family: "Microsoft Yahei"}
.video-sec a,
.video-sec a *{-webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; text-decoration: none;}
.video-tab{ background: none;padding: 10px 25px;}
.video-tab .txt{padding: 0 20px;}
.video-tab li .more-btn{width: 120px;}
.video-tab .more-btn span{display: inline-block;margin-left: 5px; font-size: 14px;font-weight: normal;vertical-align: middle;}
.video-tab .more-btn:hover span{text-decoration: underline;}
.vci-sec-tab{padding: 0 35px 5px;height: 20px;line-height: 20px;}
.vci-sec-tab a{margin:0 20px; font-size: 14px;color:#7b7b7b;display: inline-block;}
.vci-sec-tab .on,.vci-sec-tab a:hover{color: #b3b3b3;}
/*video-list*/
.video-list {padding: 60px 40px 0;overflow: hidden;height: 240px;}
.video-list li{float: left;margin: 0 15px;width: 250px;height: 240px;}
.video-list a{display: block;}
.video-img{position: relative; height: 166px;overflow: hidden;}
.video-img img{display: block;width: 100%;height: 100%;}
.vl-tit{margin: 5px 0; height: 40px;overflow: hidden; color: #bfbfbf;font-size: 14px;line-height: 20px;}
.vl-hover{position: absolute;top: 100%;left: 0; width: 100%;height: 100%;background: #05040b;opacity: 0; filter: alpha(opacity=0);}
.vl-hover-icon{display: block;position: absolute;width: 58px;height: 58px;left: 50%;top: 50%;margin: -29px 0 0 -29px;background: url(../images/sprite_2.png) no-repeat -297px -202px;}
.video-list a:hover .vl-hover{top: 0; opacity: 0.8; filter: alpha(opacity=80);}
.vl-info{display: none; text-align: right; font-size: 14px;color: #65696c;}
.vl-num{float: left;}
.vl-num-icon{display: inline-block;margin: 0 5px 0 0; background: url(../images/sprite_2.png) no-repeat -375px -245px; width: 13px; height: 13px;vertical-align: middle;}
.vl-time{}


/*---------- partners ----------*/
.partners-list li{float: left;width: 155px;height: 60px;}
.partners-list a{display: block;width: 100%;height: 100%;text-align: center;vertical-align: bottom;}

/*---------- footer ----------*/
.footer{color: #b0b0b0;font: 14px/30px "Microsoft Yahei";}
.footer,
.footer .wrapper{background: #191919;}
.footer .wrapper{padding: 70px 0;}
.footer a{color: #b0b0b0;}
.footer a:hover{color: #fff;}
.footer table{width: 100%;}


/************************************
* sub
*************************************/
/*---------- banner ----------*/
.sub-banner,
.sub-banner .wrapper{background: url(../images/sub-banner.jpg) no-repeat top center;}
.sub-banner .wrapper{position: relative; height: 282px;}

/*---------- main ----------*/
.sub-main,
.sub-main .wrapper{background: #dfdfdf url(../images/sub-bg.jpg) no-repeat top center;}
.sub-main .wrapper{position: relative;}

/*---------- side bar ----------*/
.side-bar{ padding: 8px; background: rgba(219,219,219,.6); width: 296px; font: 14px/30px "Microsoft Yahei";}
.side-bar-fixed .side-bar{position: fixed;top: 0;float: none;}

/*sb-download-btn*/
.sb-download-btn{margin-bottom: 4px; display: block;padding: 40px 0 0; background: url(../images/download-btn.jpg) no-repeat center;width: 296px;height: 88px;text-align: center;color: #d7efff;font-size: 28px;line-height: 38px;}
.sb-download-btn span{display: block; font-size: 10px;color: #d7efff;line-height: 1;color: #567488;}
.sb-download-btn:hover{opacity: 0.9;filter: alpha(opacity=90); -webkit-transition: all 0.4s linear 0.05s; -moz-transition: all 0.4s linear 0.05s; -o-transition: all 0.4s linear 0.05s; -ms-transition: all 0.4s linear 0.05s; transition: all 0.4s linear 0.05s;}
/*sb-nav*/
.sb-nav {margin: 4px 0;}
.sb-nav li{float: left;margin: 0 2px 2px 0;}
.sb-nav a{display: block;background: url(../images/sb-nav.jpg) no-repeat center;width: 147px;height: 76px;padding: 15px 0 0 ; text-align: center;}
.sb-nav a:hover{opacity: 0.85; filter: alpha(opacity=85);}
.sb-nav-icon{
  -webkit-transition: all 0.4s linear;
  -moz-transition: all 0.4s linear;
  -o-transition: all 0.4s linear;
  -ms-transition: all 0.4s linear;
  transition: all 0.4s linear;display: block;height: 46px;width: 46px;margin: 0 auto;background: url(../images/sub-sprite.png) no-repeat;}
.sb-nav a:hover .sb-nav-icon{
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  transform: rotateY(180deg);}
.sb-nav p{color: #fff;font-size: 18px;text-shadow: 1px 1px 5px #70c4f9;line-height: 1;}

.sb-nav .sbn-02,
.sb-nav .sbn-04{margin-right: 0;}
.sbn-01 .sb-nav-icon{background-position: 12px 0;}
.sbn-02 .sb-nav-icon{background-position: -50px 0;}
.sbn-03 .sb-nav-icon{background-position: -106px 0;}
.sbn-04 .sb-nav-icon{background-position: -168px 0;}

/*sb-news*/
.sb-news a,
.sb-news img{display: block;width: 100%;height: 180px;}
.sb-news a{position: relative;overflow: hidden; margin: 0 0 6px;opacity: .95; filter: alpha(opacity=95);}
.sb-news .light{ position: absolute;left: -180px;top: 0;width: 90px;height: 100%;background-image: -moz-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0)); background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));  transform: skewx(-25deg); -o-transform: skewx(-25deg); -moz-transform: skewx(-25deg); -webkit-transform: skewx(-25deg);}
.sb-news a:hover{opacity: 1; filter: alpha(opacity=100);}
.sb-news a:hover .light{left:350px;-moz-transition:0.5s; -o-transition:0.5s; -webkit-transition:0.5s; transition:0.5s; }

/*community*/
.sb-community{background: #5b798d;padding: 0 15px;}
.sb-community-list{}
.sb-community-list li{float: left;}
.sb-community-list a{display: block; width: 66px; height: 55px;background: url(../images/sub-sprite_1.png) no-repeat;-webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  transition: all 0.2s linear;-webkit-transform: scale(.9);
  -moz-transform: scale(.9);
  -o-transform: scale(.9);
  -ms-transform: scale(.9);
  transform: scale(.9);}
.sb-community-list a:hover{ -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);}
.sb-wechat a{background-position: 12px -44px;}
.sb-weibo a{background-position: -57px -44px;}
.sb-forum a{background-position: -123px -44px;}
.sb-tieba a{background-position: -193px -44px;}

/*sub-content*/
.sub-content{width: 828px; padding: 40px 0 50px 40px; font-family: "Microsoft Yahei";}
.side-bar-fixed .sub-content{float: none; margin-left: 312px;}
.sc-main{overflow: hidden;}
.sc-tit-box{margin: 0 15px 40px;padding: 0 0 20px; border-bottom: 1px solid #c2c4c5;}
.sc-tit{height: 40px; color: #000;font-size: 26px;line-height: 40px;}
.sc-tit span{border-bottom: 3px solid #5b90b3;padding: 0 0 40px;}
.breakcrumb{font-size: 14px;color: #797979;}
.breakcrumb a{color: #797979;-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s;}
.breakcrumb a:hover{color: #939393;text-decoration: underline;}

/*scm-nav*/
.scm-nav{margin: 0 0 50px;}
.scm-nav li{float: left;margin: 0 4px;}
.scm-nav a{display: block;width: 196px; padding: 16px 0; background: #314c61;font-size: 18px;line-height: 1; color: #c9c9c9; text-align: center;-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s;}
.scm-nav a:hover,
.scm-nav .on a{background: #4c8bbd;color: #fff;}
.scm-nav-two{padding-left: 140px;}
.scm-nav-three{}
.scm-nav-four{padding-left: 10px;}
.scm-nav-five{}


.scm-nav-five li{margin: 0 3px;}
.scm-nav-five a{width: 158px;}
.scm-nav-seven a{width: 158px;}
.scm-nav-seven li{margin: 0 6px;}
.cont-with-bg{min-height: 550px; padding: 40px; background: #fff;background: rgba(255,255,255,.5);color: #5f5f5f;font-size: 14px;line-height: 30px;}

/*wechat*/
.wechat-side{position: fixed;right: -242px; bottom: 15%;padding: 0px 0 10px; background: #fff;text-align: center;z-index: 100;-webkit-transition: right 0.5s; -o-transition: right 0.5s; transition: right 0.5s;font-family: "Microsoft Yahei";}
.wechat-side-show{right: 0;}
.ws-btn{position: absolute;left: -36px;top: 0;padding: 4px 10px 5px; width: 1em;background: #712a23;color: #fff;line-height: 1;}
.ws-btn span{display: block; margin: 5px 0;}
.ws-box{height:253px;}
.wechat-side p{font-size: 14px;line-height: 18px;}

/*sub title*/
.sub-tit{margin: 10px 0; position: relative;padding: 10px 0; font-size: 18px;line-height: 1;text-indent: 10px;border-bottom: 1px solid #777;}
.sub-tit-dec{position: absolute;top: 50%;left: 0;width: 4px; height: 20px;margin: -10px 0 0 ; background: #B78A57;}
.sub-tit-ch{font-weight: bold;}
.sub-tit-en{margin-left: 5px;font-size: 12px;line-height: 1; text-transform: uppercase;vertical-align: bottom;}

/************************************
* sub 截图壁纸
*************************************/
/*content*/
.vision-img-box{overflow: hidden;}
.vision-img-list{margin-right: -200px;}
.vision-img-list li{float: left;width: 262px;margin:0 20px 20px 0;}
.vision-img-list a{display: block;color: #282828;-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s}
.vision-img-list img{display: block;width: 262px;height: 152px;margin-bottom: 5px;}
.vision-img-list span,
.vision-img-list p,
.painting-txt{height: 48px; overflow: hidden; display: block;font-size: 14px; line-height: 24px;text-align: center;}
.vision-img-list a:hover,
.vision-img-list a:hover span{text-decoration: underline;color: #535353;}

/*wallpaper*/
.wp-list p {height: 72px; text-align: center;}
.wp-list a{display: inline; margin: 0 5px 0 0; }
.wp-list a.dn{display:none;}

/*painting*/
.painting-txt{margin-bottom: 24px; height: 24px;overflow: hidden;white-space: nowrap;text-overflow:ellipsis;}
.painting-download{margin: 0 0 0 5px; display: inline-block; background: url(../images/sub-sprite.png) no-repeat -308px -3px; width: 24px; height: 18px;vertical-align: top;}
/************************************
* sub 游戏视频
*************************************/

/************************************
* sub 下载中心
*************************************/
.sci-tab li{float: left;margin-right: 10px;}
.sci-tab a{display: block;padding: 10px 0; color: #314c61;font: 16px/1 "Microsoft Yahei";text-align: center;*width: 160px;}
.sci-tab span{display: block; *display: inline;*zoom: 1;cursor: pointer;}
.sci-tab .txt{padding: 0 15px;white-space: nowrap;font-weight:bold;color:#000;}
.sci-tab .line{padding: 0; width: 0;height: 5px;margin: 8px auto 0;-webkit-transition: width 0.2s linear 0s; -moz-transition: width 0.2s linear 0s; -o-transition: width 0.2s linear 0s; -ms-transition: width 0.2s linear 0s; transition: width 0.2s linear 0s; background: #b78a57;}
.sci-tab .on .line,
.sci-tab a:hover .line{width: 100%;}

.sci-cont-item{padding: 30px 0;}
/*content*/
.download-btn-box{padding: 0 0 30px 0;}
.download-btn-box a,
.benchmark-btn{margin: 0 auto; background: #60a4cf; display: block;background: #60a4cf;width: 300px;height: 66px;line-height: 66px; color: #fff;font-size: 22px;text-align: center;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.download-btns{text-align: center;}
.download-btn-box a{margin: 0;}
.download-btn-box a:hover{background: #3686B6;}
.download-icon{display: inline-block;margin-left: 10px; background: url(../images/sub-sprite.png) no-repeat -231px -12px; width: 28px; height: 28px;vertical-align: middle;}

/*version-info*/
.version-info{margin: 15px 0; border: 2px solid #919191;background: #fff;width: 100%;table-layout: fixed;text-align: left;color: #5f5f5f;}
.version-info th,
.version-info td{ border-bottom: 1px solid #dcdcdc;line-height: 1.4;}
.version-info th{padding: 10px 40px;width: 90px; font-size: 16px;font-weight: normal;}
.version-info td{padding: 10px 10px 10px 30px; font-size: 14px;}
.download-cont-item .sub-tit{margin-top: 40px;}
.download-tip{margin-bottom: 40px;}

/*other-install*/
.other-install a{margin: 5px 5px 5px 0; padding: 10px 25px;background: #9c2525; display: inline-block;color: #fff;font-size: 14px;text-align: center;line-height: 1;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.other-install a:hover{background: #7B0909;}

.down-media-list{margin-right: -70px;}
.down-media-list li{width: 220px;height: 70px;float: left;margin: 10px 40px 10px auto;}
.down-media-list a,
.down-media-list img{display: block;width: 100%;height: 100%;}


/*configure*/
.configure-red{font-size: 16px;color: #9c2525;}
.benchmark-btn{margin: 50px 30px;display: inline-block;font-size: 20px;}
.configure-list img{margin: 10px 0; display: block;}
.benchmark-btn:hover{background: #3686B6;}
.download-cont-item .configure-tit{font-size: 18px;}
.download-cont-item .configure-table-box{width: 100%; border-top: 1px solid #777;
    padding: 30px 0 0;}

.download-cont-item h6{font-weight: bold;font-size: 20px;margin: 30px 0 10px;}
.fqa-ques{margin:15px 0 5px;}
.fqa-other{color: #23661E;}

/************************************
* sub 游戏资料
*************************************/
.sub-main-nosb .wrapper{overflow: hidden;}
.sub-main-nosb .sub-content{float: none;width: 100%;padding: 40px 0;}
.sub-main-nosb .cont-with-bg{padding: 0;}
.wait{padding: 100px 0;text-align: center;font-weight: bold;font-size: 40px;}

/*---------- 基本操作 ----------*/
.eo-table-box{width: 850px; padding: 70px 0 0; margin: 0 auto;border-bottom:1px solid #314c61;}
.eo-table{width: 100%;  table-layout: fixed;font-size: 24px;color: #000;text-align: center;}
.eo-table th{padding: 8px 0;border-right: 1px solid #bfc1c2;width: 50%;background: #314c61;font-weight: normal;color: #fff;font-size: 16px;}
.eo-table td{padding: 8px 0; border-right: 1px solid #bfc1c2;border-top:1px solid #bfc1c2;background: #fff;font-size: 14px;}
.eo-table th:first-child,
.eo-table td:first-child{border-right: 1px solid #bfc1c2;}
.eo-table td:first-child{border-left: 1px solid #314c61;}

.eo-table .ct-col-last{border-right: 1px solid #314c61!important;}
/*---------- 配置说明 ----------*/
.data-configure{padding: 50px 100px;}
.configure-tit{margin-bottom: 20px; font-weight: bold; font-size: 24px;line-height: 50px;}
.configure-list{margin-bottom: 40px; font-size: 14px;line-height: 28px;}
.configure-list li{margin-bottom: 10px;}
.configure-list a{color: #4c8bbd;}
.configure-list a:hover{text-decoration: underline;}

.configure-table-box{padding: 0;margin: 0;}
.configure-table th{width: 33.3%;}
.configure-table td{font-size: 14px;}

/*download update table*/
.update-table-box{padding-top: 0;width: 100%;}
.update-table{font-size: 18px;table-layout: auto;}
.update-table th{width: auto;}
.update-table td{line-height: 26px;font-size: 14px;}
.update-table a{margin: 0 5px;color: #b78a57;}
.update-table a:hover{text-decoration: underline;}

/*---------- 兵种资料 ----------*/
/*country*/
.country-list-box{height: 70px; border-bottom:2px solid #777;}
.country-list{width: 480px;margin: 0 auto;text-align: center;}
.country-list li{width: 160px;float: left;}
.country-list a{display: block; font-size: 22px;color: #949da4;font-weight: bold;line-height: 70px;-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0s;vertical-align: bottom;}
.country-list .on a{font-size: 42px;color: #4c8bbd;}
.country-list a:hover{color: #4c8bbd;}
/*kind*/
.soldier-kind-list{padding: 10px 0;height: 36px; font-size: 0;line-height: 0;text-align: center;}
.soldier-kind-list li{float: left;width: 33.3%;}
.soldier-kind-list a{border-left: 2px solid #777; display: block; font-size: 22px;line-height: 36px; color: #000;text-align: center;-webkit-transition: color 0.5s linear 0s; -moz-transition: color 0.5s linear 0s; -o-transition: color 0.5s linear 0s; -ms-transition: color 0.5s linear 0s; transition: color 0.5s linear 0;font-weight: bold;}
.soldier-kind-list a:hover,
.soldier-kind-list .on a{color: #4c8bbd;}
.soldier-kind-list li:first-child a{border: none;}

/*soldier info box*/
.soldier-info{color: #000;font-size: 16px;line-height: 30px;}
.soldier-info-cont{background: #eaeae9 url(../images/wei_bg.jpg) no-repeat top left; position: relative; min-height: 900px;}
.data-tit{ background: #314c61; height: 54px; color: #fff; font-size: 26px;line-height: 54px;text-align: center;}
.soldier-info .data-tit{padding-left: 70px;text-align: left;}
.si-tit-keyword{font-size: 16px;}
.soldier-ti-2em{text-indent: 2em;}
.soldier-info-item{padding: 45px 20px;}
.soldier-img{width: 400px;height: 1000px;position: absolute;top: 0;left: 0;text-align: center;}
.soldier-img img{height: 900px;}
.si-item-tit{margin-bottom: 16px;font-weight: bold;font-size: 24px;line-height: 43px;}
.soldier-info-item .si-item-tit{font-size: 22px;}

/*兵种特点*/
.si-feature-item{border-top:1px solid #ddd;}
.sifi-row{width: 50%;}
.sifi-row-inner{ }
.soldier-list{font-size: 16px;}

/*兵种使用指南*/
.si-guide-item{border-top:1px solid #ddd;}

.si-feature-item,
.si-guide-item,
.solider-bg-item{margin-left: 400px;}

/*兵种线一览*/
.soldier-line-list{padding: 40px 30px;}
.soldier-line-list li{position: relative; float: left;width: 96px;height: 150px;text-align: center;margin-left: 20px;}
.sll-tit{margin-top: 2px; font-size: 16px;line-height: 28px; text-align: center;white-space: nowrap;overflow: hidden;text-overflow:ellipsis;}

.sll-arrow{display: block;top: 40px; right: -20px; position: absolute;background: url(../images/s-arrow.png) no-repeat center;width: 20px;height: 27px;}
.sll-img{width: 66px;height: 106px;}
.sll-last .sll-arrow{display: none;}

/*---------- 副将介绍 ----------*/
.s-legatus-list {padding: 10px 0 10px 20px;min-height: 162px;}
.s-legatus-list li{float: left;margin: 20px 6px 10px; width: 100px;text-align: center;}
.s-legatus-list a{position: relative; display: block;color: #000;}
.s-legatus-list img{width: 90px; height: 90px;display: block;margin: 0 auto;}
.s-legatus-list .sll-tit{margin: 0 auto; font-size: 20px;line-height: 36px;}
.s-legatus-list .si-item-tit{font-weight: normal;}
.legatus-info{padding: 0 60px;/*padding: 0 35px;*/color:#000;width: 1090px;}
.legatus-bg-box{ padding: 20px 0 20px; font-size: 16px;}
.legatus-big-img{margin: 0 0 0 50px;float: left;width: 280px;height: 280px;display: none;}
.legatus-bg {/*float: left;*/width: 880px;padding: 60px;/*margin: 0 0 0 50px;*/margin: 0 auto;}

.legatus-other-data{ border-top: 3px solid #777;padding: 15px 0;}
.legatus-data{padding: 20px 50px 20px 80px;width: 360px;}
.legatus-data-list{font-size: 0;line-height: 0;}
.legatus-data-list span{display: inline-block;}
.ld-label{margin-right: 20px; font-size: 18px;line-height: 30px;}
.ld-num{background: #4c8bbd;height: 18px;max-width: 300px;width: 0;}
.legatus-skill-formation{ width: 540px; padding: 10px 0 10px 45px; border-left: 2px solid #777;}
.legatus-skill-formation .si-item-tit{margin-bottom: 10px;}
.lsf-list {height: 78px; margin-bottom: 20px;}
.legatus-skill{border-bottom: 2px solid #777;}
.legatus-skill,
.legatus-formation{position: relative;}
.lsf-list li{width: 70px; float: left; text-align: center;}
.lsf-list a{display: block; padding: 4px 0 0;}
.lsf-list img{width: 40px;height: 40px;-webkit-transition: background 0.5s linear 0s; -moz-transition: background 0.5s linear 0s; -o-transition: background 0.5s linear 0s; -ms-transition: background 0.5s linear 0s; transition: background 0.5s linear 0s;}
.lsf-list a:hover{padding: 0;}
.lsf-list a:hover img{border: 4px solid #4c8bbd;border-radius: 3px;background: #4c8bbd;}
.lsf-list .lsf-tit{ display: block; margin: 4px auto 0; height: 20px; overflow: hidden; font-size: 14px;line-height: 20px;color: #000;text-align: center;text-overflow:ellipsis;white-space: nowrap;}
.lsf-list a:hover .lsf-tit{margin: 0 auto;}

.lsf-detail{position: absolute;top: 30px;right: 0; width: 230px; font-size: 12px;line-height: 24px;}
/*---------- 地图展示 ----------*/
/*small map list*/
.s-map-list{padding: 20px 40px;}
.s-map-list li{ float: left;width: 118px;height: 154px; /* margin-left: 40px; */ margin: 0 20px;}
.s-map-list li:first-child{/* margin: 0; */}
.s-map-list a{display: block;text-align: center;color: #000;font-size: 20px;padding: 5px;}
.s-map-list img{margin-bottom: 5px; display: block; width: 108px;height: 108px;}
.s-map-list .on a,
.s-map-list a:hover{padding: 0 0 5px 0;}
.s-map-list a:hover img,
.s-map-list .on img{margin-bottom: 0; border: 5px solid #4c8bbd;border-radius: 3px;}
.s-map-tit{display: block;}

/*map list*/
.map-list-box{position: relative;width: 906px;height: 510px;margin: 0 auto;padding: 80px 0;}
.map-list ,
.map-list li,
.map-list a,
.map-list img{display: block; width: 100%;height: 510px;}
.map-list-prev,
.map-list-next{top: 50%; margin-top: -12px; position: absolute;width: 0;height: 0;text-indent: -99999px;}
.map-list-prev{left: -100px; border-right:40px solid #314c61; border-left:0 none; border-top:24px solid transparent; border-bottom:24px solid transparent;}
.map-list-next{right: -100px; border-left:40px solid #314c61; border-right:0 none; border-top:24px solid transparent; border-bottom:24px solid transparent;}
.map-list-prev:hover{border-right-color: #4c8bbd; }
.map-list-next:hover{border-left-color: #4c8bbd; }

/*---------- 游戏界面 ----------*/
.jm-box .pop-nav{padding: 50px 0 60px;}
.jm-box .pop-cont{width: 80%;margin: 0 auto;}

/************************************
* sub act
*************************************/
.act-cont{font-family: 'Microsoft Yahei'; padding: 30px 0;}
.act-cont .sc-tit-box{margin: 0 0 10px;}
.scm-nav-act{margin-bottom: 30px;}
.scm-nav-act li{margin: 0 4px 0 0;}
.scm-nav-act a{width: 116px;background: none;color: #797979;}

.act-cont .cont-with-bg{padding: 0;overflow: hidden;}
.act-list{padding: 30px 0; margin-right: -300px;}
.act-list li{float: left; width: 375px;margin: 0 34px 30px 0;border: 1px solid #7c7c7c;}
.act-list a{ -webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.act-img{display: block; width:100%;height: 142px;}
.act-txt{padding: 10px 25px;}
.act-tit{display: block;overflow: hidden; white-space: nowrap; text-overflow:ellipsis; font-size: 18px;font-weight: bold;color: #5b90b3;-webkit-transition: all 0.5s linear 0s; }
.act-tit:hover{color:#305167;}
.act-time{font-size: 12px;color: #828282;}
.act-detail{height: 3.2em;overflow: hidden; font-size: 10px;color: #000;line-height: 1.6em;}
.act-btn{text-align: right}
.act-btn a{font-size: 10px;color: #000;}
.act-btn a:hover{text-decoration: underline;color: #454545;}

/************************************
* sub 游戏资讯
*************************************/
.sub-news-list{height: 690px;border-bottom: 1px solid #b9b9b9;}
.sub-news-list a{display: block;overflow: hidden;}
.sub-news-list span{color: #4b4b4b;font-size: 16px;cursor: pointer;line-height: 40px;}
.sub-news-list .news-tit{float: left;}
.sub-news-list .time{float: right; color: #7ba2b6;font-size: 16px;}
/*page*/
.page {margin: 20px 0; text-align:center;line-height: 0;font-size: 0;}
.page a{position: relative; display: inline-block; padding: 0 8px;line-height: 2rem; color: #4b4b4b;font-size: 16px;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.page a:after{content: '|';position: absolute;right: -2px;top: 0;}
.page a:hover{color: #737373;}
.page .prev:after,
.page .next:after,
.page a:nth-last-child(2):after{content: ""}

/************************************
* sub 游戏指南
*************************************/
.newbie-page .header, .newbie-page .header .wrapper{background-image: url(../images/newbie-header.jpg);}
.newbie-page .sub-banner, .newbie-page .sub-banner .wrapper{background-image: url(../images/newbie-banner.jpg);height: 486px;}

.newbie-sub-main{font-family: "Microsoft Yahei";}
/*nav*/
.newbie-nav{padding:40px 0;}
.newbie-nav li{position: relative; float: left;margin-left: -60px;}
.newbie-nav a{display: block;}
.newbie-nav a * {-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.newbie-nav-l,
.newbie-nav-c,
.newbie-nav-r{float: left;height: 158px;}
.newbie-nav-l{background: url(../images/sub-sprite_2.png) no-repeat -6px -125px; width: 75px; }
.newbie-nav-c{background: #314c61;width: 295px;padding: 20px 10px;height: 118px;}
.newbie-nav-r{background: url(../images/sub-sprite_2.png) no-repeat  -86px -125px;width: 73px; }
.newbie-nav-tit{font-size: 48px;color:#929aa0; line-height: 60px; }
.newbie-nav-sectit{font-size: 16px;color: #929aa0; line-height: 26px;}
.newbie-nav-btn{-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s; margin-top: 6px; display: block; background: #eaeaea;border-radius: 10px; width: 86px;text-align: center;height: 28px;line-height: 28px; font-size: 16px;color: #000; text-indent: 4px;}
.newbie-nav-btn span{display: inline-block;}
.nnb-sj{margin: 0 0 0  6px;width: 0;height: 0;border-left: 10px solid #314c61;border-top: 8px solid transparent;border-bottom: 8px solid transparent;vertical-align: middle;margin-top: -1px;}
.newbie-nav-sj{display: none; position: absolute;bottom: -16px;margin-left: -40px; left: 50%;border-top: 16px solid #4c8bbd;border-left: 10px solid transparent;border-right: 10px solid transparent;}
.nn-dec{position: absolute;background: url(../images/nn-01.png) no-repeat center;width: 230px;height: 199px;bottom: 0;right: 0;pointer-events:none;}
.newbie-nav-02 .nn-dec{background-image: url(../images/nn-02.png);}
.newbie-nav-03 .nn-dec{background-image: url(../images/nn-03.png);}
.newbie-nav a:hover .newbie-nav-btn{background:  #A9B3D6;}

.newbie-nav .on a{cursor: default;}
.newbie-nav .on a:hover .newbie-nav-btn{background: #eaeaea;}
.newbie-nav a:hover .newbie-nav-tit,
.newbie-nav .on .newbie-nav-tit{color:#fefefe; }
.newbie-nav a:hover .newbie-nav-sectit,
.newbie-nav .on .newbie-nav-sectit{color:#fff; }
.newbie-nav .on .newbie-nav-c{background: #4c8bbd;}
.newbie-nav .on .newbie-nav-l{background-position: -186px -123px;}
.newbie-nav .on .newbie-nav-r{background-position: -266px -123px;}
.newbie-nav .on .newbie-nav-sj{display: block;}

.newbie-nav .newbie-nav-first{margin-left: 0;}
.newbie-nav-first .newbie-nav-l{display: none;}

/*cont*/
.newbie-cont{ /* padding: 0 0 100px; */ padding: 0;}
.newbie-sec{position: relative;padding: 50px;border-top: 1px solid #4c8bbd;}
.newbie-video{float: left; width: 632px;height: 306px;background: #2f2f2f;}
.newbie-info{float: left;width: 410px;}
.newbie-info-r{margin-left:50px;}
.newbie-info-l{margin-right:50px;}
.newbie-tit{margin-bottom: 40px; line-height: 50px; font-size: 32px;color: #000;}
.newbie-tit-sm{font-size: 22px;}
.newbie-detail{font-size: 16px;text-indent: 2em;line-height: 28px;color: #302626;}
.newbie-agesbg{min-height: 480px;}
.newbie-dec{position: absolute;top: -130px;right: 130px;}

/*新兵需知*/
.newbie-sec-nav{text-align: center;}
.newbie-sec-nav li{float: none;display: inline-block;margin: 0 50px;*display: inline;*zoom:1;}
.newbie-sec-nav a{padding: 25px 0;width: 225px; font-size: 24px;}

.newbie-sec-cont{border: 1px solid #000;margin: 0 0 100px;}
.newbie-know-cont{padding: 40px 40px;height: 430px;}
.newbie-know-txt{font-size: 24px;color: #000;text-align: left;}
.newbie-know-list{ padding: 30px 0;}
.newbie-know-list li{float: left;margin: 50px 32px;}
.newbie-know-list a{position: relative; padding: 25px 10px 25px 70px; display: block;border: 1px solid #000; width: 108px;height: 40px;color: #000;font-size: 24px;line-height: 40px;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.newbie-know-list a:hover{background: #ddd;}
.nk-dec{display: block;}
.nk-dec{position: absolute; left: -48px;top: -45px; background:url(../images/nk-dec.png) no-repeat; }
.nk-list-07 .nk-dec{height:207px;width:114px;background-position: 0 0;}
.nk-list-05 .nk-dec{height:208px;width:120px;background-position: 0 -207px;top: -55px;}
.nk-list-06 .nk-dec{height:208px;width:120px;background-position: 0 -415px;}
.nk-list-08 .nk-dec{height:180px;width:120px;background-position: 0 -623px;left: -60px;}
.nk-list-02 .nk-dec{height:180px;width:120px;background-position: 0 -803px;}
.nk-list-01 .nk-dec{height:180px;width:120px;background-position: 0 -983px;}
.nk-list-04 .nk-dec{height:180px;width:120px;background-position: 0 -1163px;left: -60px;}
.nk-list-03 .nk-dec{height:180px;width:120px;background-position: 0 -1343px;}

.rideoff-btn{margin: 200px auto 0; display: block;border: 2px solid #000;width: 456px;height: 112px; border-radius: 10px; font-size: 36px;color: #fff;line-height: 112px;text-align: center;background: #6a9fc8; background: -moz-linear-gradient(left,  rgba(106,159,200,1) 0%, rgba(77,129,171,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(106,159,200,1)), color-stop(100%,rgba(77,129,171,1))); background: -webkit-linear-gradient(left,  rgba(106,159,200,1) 0%,rgba(77,129,171,1) 100%); background: -o-linear-gradient(left,  rgba(106,159,200,1) 0%,rgba(77,129,171,1) 100%); background: -ms-linear-gradient(left,  rgba(106,159,200,1) 0%,rgba(77,129,171,1) 100%); background: linear-gradient(to bottom,  rgba(106,159,200,1) 0%,rgba(77,129,171,1) 100%); -webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;}
.rideoff-btn:hover{opacity: .8; filter: alpha(opacity=80);}

.nk-list-old{text-align: center;}
.nk-list-old li{float: none; display: inline-block;margin: 100px 90px 0;*display: inline;*zoom: 1;}
.nk-list-old a{ font-size: 30px; width: 190px; padding: 60px 10px 60px 100px;}
.nk-list-old .nk-dec{background:url(../images/nk-dec-h.png) no-repeat; left: -150px;}
.nk-list-old .nk-list-02 .nk-dec{height:223px;width:265px;background-position: 0 0;}
.nk-list-old .nk-list-01 .nk-dec{height:223px;width:265px;background-position: 0 -223px;}
/*战斗进阶*/
.newbie-restrain-list{ margin:50px -100px 50px 0}
.newbie-restrain-list li{float: left;background: #b7b7b7; padding: 10px 40px; width: 160px;height: 230px;margin: 0 65px;}
.newbie-restrain-list .newbie-rastrain-tit{margin-bottom: 5px; font-size: 50px;color: #646464;font-weight: bold;text-align: center;line-height: 70px;}
.newbie-restrain-lvl dd,
.newbie-restrain-lvl dt{float: left;line-height: 40px;font-weight: bold;}
.newbie-restrain-lvl dt{width: 60px; font-size: 24px;}
.newbie-restrain-lvl dd{width: 70px; font-size: 18px;}
.newbie-restrain-lvl i{font-style: normal;margin: 0 0 0 8px;}
.newbie-info-jj{padding: 90px 0 0;}

/*pop*/
.pop{ position: fixed;top: 0;left: 0;width: 100%;height: 100%;font-family: "Microsoft Yahei"; }
.pop-layer{background: #000;opacity: .1; filter: alpha(opacity=10);width: 100%;height: 100%;position: absolute;top: 0;left: 0;}
.pop-main{position: absolute;top: 70px;left: 50%;margin: 0 0 0 -525px; width: 950px;height: 680px;padding: 50px;background: #fff;overflow: hidden;}

.pop-close{position: absolute;color: #000;right: 10px;top: 0;font-size: 36px;line-height: 50px;}
.pop-close:hover{color: #777;}
.pop-nav {text-align: center;}
.pop-nav a{background: #314c61;width: 114px;height: 46px; display: inline-block; *display: inline;*zoom: 1;font-size: 18px;color: #929aa0;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s; -ms-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s;line-height: 46px; }
.pop-nav .on,
.pop-nav a:hover{color: #fefefe;background: #4c8bbd;}
.pop-cont img{display: block;width: 100%;}

.img-pop .pop-main,
.txt-pop .pop-main,
.video-pop .pop-main{width: 800px;margin-left: -430px;height: auto;padding: 50px 30px;}
.video-box{width: 800px;height: 500px;}
.img-box{width: 800px;}
.img-box img{width: 100%;}
.img-pop .pop-main{top: 200px;}
.txt-pop .pop-main{top: 200px;margin-left: -450px; padding: 100px 50px;}
.txt-pop{font-size: 16px;line-height: 26px; }
.txt-pop p{margin: 0 0 20px;}

/************************************
* 玩法介绍
*************************************/
.play-page{font-family: "Microsoft Yahei"}
.play-page .header,
.play-page .header .wrapper{background-image: url(../images/play-header.jpg);}
/*---------- banner ----------*/
.play-page .sub-banner,
.play-page .sub-banner .wrapper{background: url(../images/play-banner.jpg) no-repeat top center;height: 645px;}
.play-page .sub-banner{position: relative; height: 645px;}

/*---------- nav ----------*/
.play-nav{position: relative;z-index: 5; margin-top: -66px;width: 100%; background: #0b0b0a;opacity: 0.8; filter: alpha(opacity=80);}
.play-nav .wrapper{background: #0b0b0a;}
.play-nav-list {width: 840px;margin: 0 auto;height: 64px;}
.play-nav-list li{float: left;width: 270px;margin: 0 5px;height: 100%;}
.play-nav-list a{position: relative; display: block;width: 100%;color: #fffffe;text-align: center;font: 18px/60px "Microsoft Yahei";}
.play-nav-underline{opacity: 0; filter: alpha(opacity=0); position: absolute; left: 0; bottom: -15px; width: 100%;height: 5px;background: #aa0c00;-webkit-transition: all 0.5s linear 0s; -moz-transition: all 0.5s linear 0s; -o-transition: all 0.5s linear 0s; -ms-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s;}
.play-nav-trai{position: absolute; bottom: -6px; left: 50%;margin-left: -10px; height: 0;width: 0;border-top: 10px solid #aa0c00;border-left: 10px solid transparent;border-right: 10px solid transparent;}
.play-nav-list .on .play-nav-underline,
.play-nav-list a:hover .play-nav-underline{opacity: 1; filter: alpha(opacity=100);bottom: -4px;}
.play-nav-list .on a,
.play-nav-list a:hover{color: #ded8b4;}
/*---------- img & info ----------*/
.play-sub-main .wrapper{padding: 0 0 10px;}
.play-info-img{padding: 50px 0;}
.play-img{float: left; width: 716px;height: 312px;box-shadow: 2px 2px 7px #a7a7a7;}
.play-info-tab{margin-bottom: 40px; border-bottom: 1px solid #777;height: 56px;}
.play-info-tab li{float: left;margin-right: 15px;}
.play-info-tab a{display: block; padding: 24px 0 12px; color: #000;line-height: 20px; font-size: 18px;vertical-align: bottom;}
.play-info-tab .on a{padding: 0; line-height: 56px; font-size: 26px;color: #aa0c00;}
.play-info{float: left;width: 390px;margin-left: 60px;}
.play-info-txt{ font-size: 16px;}

.play-sc-tit { height: 54px; border-bottom: 1px solid #777;}
.play-sc-tit span{padding: 0 0 15px;}

.play-list-box{margin: 0 0 20px; overflow: hidden; }
.plb-img{border-bottom: 1px solid #777;}
.play-list{margin-right: -100px;  padding: 15px 0;}
.play-list li{float: left;margin-right: 40px; text-align: center;}
.play-list a{display: block;}
.play-list img{background: #5b90b3;}
.pl-img img{width: 140px;height: 140px;}
.play-list span{display: block; font-size: 16px;color: #282828;}

.pl-vision img{width: 270px;height: 152px;}
.pl-vision .play-list-tit{font-size: 14px;}

/************************************
* sub content
*************************************/
.title{margin: 20px 0; color: #8f6e48;font-size: 32px;text-align: center;line-height: 42px;}
.by{padding: 0 20px; margin: 0 0 50px; background: #fff;background: rgba(255,255,255,.5); color: #6e6e6e;font-size: 12px;text-align: right;line-height: 30px;white-space: nowrap;}
.detail{min-height: 690px;border-bottom: 1px solid #b9b9b9;color: #302626;font-size: 16px;line-height: 2em;}
.detail p{margin: .5em 0;white-space:pre-wrap;}
.detail .detail-footer{text-align:right;margin-bottom:10px;}
/*share*/
.share-box{padding: 10px 0; text-align: right;color: #86898a;font-size: 12px;}
.share-box a{margin:0 5px; display: inline-block;vertical-align: middle;}

.video-box{width: 800px;height: 500px;margin: 0 auto;}