@charset "utf-8";
/* CSS Document */
body, h1, h2, h3, h4, h5, h6, hr, p, dl, dt, dd, ul, ol, li, form, button, input, textarea, th, td{margin:0;padding:0;}
body{font:14px/1.42 Microsoft yahei,simsun,sans-serif; color: #fff; background: #000; margin: auto;}
h1, h2, h3, h4, h5, h6 {font-size:100%; font-weight: normal;}
ul, ol {list-style:none;}
a,a:hover{ text-decoration: none; color: #939393}
a:hover{color: #e0ca62}
img {border:0; vertical-align: middle;}
button, input, select, textarea {font-size:100%;}
.fl{float:left;}
.fr{float: right;}
.clearfix:after {content:" ";display:block;height:0;font-size:0;clear:both;visibility:hidden;}
.clearfix {zoom:1;}
table{width: 100%;border:0;margin:0;border-collapse:collapse;border-spacing:0;}
/*top and foot*/
.topbar {height: 40px;background-image: -webkit-linear-gradient(top, #fff, #f6f6f6);background-image: linear-gradient(to bottom, #fff, #f6f6f6);color: #333;background-color: #f6f6f6;font-size: 12px; position: relative; z-index: 1200;}
.topbar-container { *zoom:1;overflow: hidden;margin-left: auto;margin-right: auto;width: 1000px;height: 40px}
.topbar-container:before,.topbar-container:after { content: " ";display: table}
.topbar-container:after {   clear: both}
.topbar-logo {float: left;width: 125px;height: 40px}
.topbar-logo a {display: block; width: 125px;height: 40px;background: url(../images/img_logo_58game.jpg) no-repeat;text-indent: -9999em}
.topbar-nav { float: right;padding: 10px 0 0 0}
.topbar-nav-inner {  *zoom:1}
.topbar-nav-inner:before,.topbar-nav-inner:after { content: " "; display: table}
.topbar-nav-inner:after {   clear: both}
.topbar-nav li { float: left; line-height: 20px;color: #333}
.topbar-nav a {display: block;padding: 0 10px;color: #333}
.topbar-nav .nobg { background: none}
.footer{ height: 60px; line-height: 60px; font-size: 12px; color: #97dc00; text-align: center; overflow: hidden;width: 100%;}
.footer a{color: #97dc00; }

.wrapper{width: 100%;position: relative;left: 0; left: 0; }
.main{width: 1000px; margin:0 auto; position: relative; left: 0; left: 0; overflow: hidden;}
.bg{ position: absolute; width: 100%;left: 0; top: 0px; z-index: -1;}
.bg div{width: 100%; height: 277px; background-position: center top; background-repeat: no-repeat;    position: static;}
.bg1{ background-image: url(../images/bg_01.jpg);}
.bg2{ background-image: url(../images/bg_02.jpg);}
.bg3{ background-image: url(../images/bg_03.jpg);}
.bg4{ background-image: url(../images/bg_04.jpg);}
.bg5{ background-image: url(../images/bg_05.jpg);}
.bg6{ background-image: url(../images/bg_06.jpg);}
.bg7{ background-image: url(../images/bg_07.jpg);}
.bg8{ background-image: url(../images/bg_08.jpg);}
.bg9{ background-image: url(../images/bg_09.jpg);}
.bg10{ background-image: url(../images/bg_10.jpg);}
.bg11{ background-image: url(../images/bg_11.jpg);}
.bg12{ background-image: url(../images/bg_12.jpg);}
.bg13{ background-image: url(../images/bg_13.jpg);}
.bg14{ background-image: url(../images/bg_14.jpg);}
.bg15{ background-image: url(../images/bg_15.jpg);}
.bg16{ background-image: url(../images/bg_16.jpg);}
.bg17{ background-image: url(../images/bg_17.jpg);}
.bg18{ background-image: url(../images/bg_18.jpg);}
.bg19{ background-image: url(../images/bg_19.jpg);}
.bg20{ background-image: url(../images/bg_20.jpg);}

.topbtn{ width: 485px; height: 96px; margin: 0 auto; padding-top: 530px;}
.topbtn a{ display: block; width: 230px; height: 96px; text-indent: -9999em;}
.topbtn .topbtn1{ background: url(../images/topbtn1.jpg); float: left;}
.topbtn .topbtn2{ background: url(../images/topbtn2.jpg); float: right;}
.topbtn .topbtn1:hover{ background: url(../images/topbtn1_h.jpg);}
.topbtn .topbtn2:hover{ background: url(../images/topbtn2_h.jpg);}

.box1{ width: 980px; margin: auto; height: 494px; overflow: hidden; padding-top: 280px;}
.video_box{ display: block; width: 768px; height: 494px; float: left; background:url(../images/video_bg.jpg);}
.video_box a{ display:block;width: 768px; height: 494px; }
.video_list{ width: 205px; float: right; height: 494px; overflow: hidden;}
.video_list a{ width: 205px; height: 116px; display: block; margin-bottom: 10px; position: relative;}
.video_list a img{ width: 100%; height: 100%;}
.video_list a span{ display: block; position: absolute; width: 42px; height: 38px; background: url(../images/video_play.png); left: 50%; top: 50%; margin-left: -21px; margin-top: -19px;}

.box2{ width: 1000px; height: 767px; background: url(../images/vs_bg.png); margin-top: 300px; position: relative;}
.box2 .player{ display: block; position: absolute; width: 78px; height: 32px; text-align:center; line-height: 32px;}
.left_box,.right_box{ position: absolute; width: 435px; height: 767px;top: 0;}
.left_box{ left: 0;}
.right_box{ right: 0;}
.pl1{top: 0; left: 0;}
.pl2{top: 47px; left: 0;}
.pl3{top: 90px; left: 0;}
.pl4{top: 137px; left: 0;}
.pl5{top: 201px; left: 0;}
.pl6{top: 248px; left: 0;}
.pl7{top: 291px; left: 0;}
.pl8{top: 338px; left: 0;}
.pl9{top: 401px; left: 0;}
.pl10{top: 448px; left: 0;}
.pl11{top: 491px; left: 0;}
.pl12{top: 538px; left: 0;}
.pl13{top: 598px; left: 0;}
.pl14{top: 645px; left: 0;}
.pl15{top: 688px; left: 0;}
.pl16{top: 735px; left: 0;}
.pl17{top: 23px; left:95px;}
.pl18{top: 113px;left:95px;}
.pl19{top: 224px; left: 95px;}
.pl20{top: 314px; left: 95px;}
.pl21{top: 424px; left: 95px;}
.pl22{top: 514px; left: 95px;}
.pl23{top: 621px; left: 95px;}
.pl24{top: 711px; left: 95px;}
.pl25{top: 69px;left:195px;}
.pl26{top: 270px; left: 195px;}
.pl27{top: 470px; left: 195px;}
.pl28{top: 667px; left: 195px;}
.pl29{top: 171px; left:283px;}
.pl30{top: 568px; left: 283px;}
.pl31{top: 370px; left: 358px;}

.pr1{top: 0; right: 0;}
.pr2{top: 47px; right: 0;}
.pr3{top: 90px; right: 0;}
.pr4{top: 137px; right: 0;}
.pr5{top: 201px; right: 0;}
.pr6{top: 248px; right: 0;}
.pr7{top: 291px; right: 0;}
.pr8{top: 338px; right: 0;}
.pr9{top: 401px; right: 0;}
.pr10{top: 448px; right: 0;}
.pr11{top: 491px; right: 0;}
.pr12{top: 538px; right: 0;}
.pr13{top: 598px; right: 0;}
.pr14{top: 645px; right: 0;}
.pr15{top: 688px; right: 0;}
.pr16{top: 735px; right: 0;}
.pr17{top: 23px; right:95px;}
.pr18{top: 113px;right:95px;}
.pr19{top: 224px; right: 95px;}
.pr20{top: 314px; right: 95px;}
.pr21{top: 424px; right: 95px;}
.pr22{top: 514px; right: 95px;}
.pr23{top: 621px; right: 95px;}
.pr24{top: 711px; right: 95px;}
.pr25{top: 69px;right:195px;}
.pr26{top: 270px; right: 195px;}
.pr27{top: 470px; right: 195px;}
.pr28{top: 667px; right: 195px;}
.pr29{top: 171px; right:283px;}
.pr30{top: 568px; right: 283px;}
.pr31{top: 370px; right: 358px;}

.box3{ height: 440px; margin-top: 400px;}
.box3_list{ float: left; width: 100%;}
.box3_list span{ display: block; float: left;width: 160px; height: 49px; background: url(../images/btn_red.png); text-align: center; line-height: 49px; font-size: 24px; color: #fedfde; margin-bottom: 20px;}
.box3_list p{ float: left; margin-left: 20px; line-height: 49px; font-size: 18px; color: #b2b2b2; width: 50%;}
.box3_list .f14{ font-size: 14px; line-height: 1.8;}

.box4{ height: 513px; margin-top: 164px; padding: 20px;}
.video_lists{ display: block; float: left; padding: 20px 52px 0px; position: relative;width: 215px; height: 240px; overflow: hidden;}
.video_lists img{ width: 215px; height: 167px; margin-bottom: 5px;}
.video_lists p{ font-size: 16px; text-align: center; color: #fff;}
.video_lists span{ display: block; position: absolute; width: 76px; height: 66px; background: url(../images/pic_play.png); top: 50%; left: 50%; margin-left: -38px; margin-top: -60px;}
.video_lists .green{ color: #64d102}

.box5{ height: 377px; margin-top: 367px; overflow: hidden; padding: 10px 15px;}
.slide-box{ position: relative; float: left; width: 500px;}
.slide-con{ width: 500px; height: 297px; overflow: hidden; margin-bottom: 5px;}
.slide-con li{ width: 500px; height: 297px; float: left;}
.slide-point{ width: 100%; height: 71px;}
.slide-point li{ width: 123px; height: 71px; float: left; margin-right: 1px; opacity: 0.6;filter:alpha(opacity=60);}
.slide-point li.on{ border:1px #feffae solid;opacity: 1;filter:alpha(opacity=100);}
.new{ width: 450px; float: right;}
.new h2{ margin-bottom: 10px}
.new li{ margin-left: 10px; padding-left: 10px; background: url(../images/dotted.jpg) left center no-repeat; float: left; width: 430px; padding-bottom: 8px; border-bottom: 1px #474747 dashed; padding-top: 10px; margin-bottom: 7px;}
.new li span{ float: right;}

.slide2{ position: relative; width:1000px; height: 267px;}
.prev{ display: none; position: absolute; width: 38px; height:73px;top: 85px; cursor: pointer; left: 20px; z-index: 99; background: url(../images/left_icon.png);}
.next{ display: none; position: absolute; width: 38px; height: 73px;top: 85px; cursor: pointer;right: 20px;z-index: 99;background: url(../images/right_icon.png);}
.slide2:hover .prev{display: block;}
.slide2:hover .next,.box6_bg:hover .next{display: block; }
.box6_bg:hover .prev{ display: block;  background: #f90;}
.slide2 img{display:block; }
.slide2 .poster-list{width:1000px;height:267px;}
.slide2 .poster-list .poster-item{ position:absolute;left:0;top:0;width: 272px; height: 267px;}
.box6{ height: 320px;margin-top: 300px; position: relative;}
.box6_bg{ width: 534px; height: 89px; background: url(../images/pic_fix_bg.png); position: absolute;left:220px; top: 218px;z-index: 88;}

.tksp{ position: fixed; width: 143px; top: 20%; right: 30px; z-index: 100;}
.tksp div{ width: 143px; height: 57px; text-align: center; line-height: 57px; font-size: 16px; color: #fff; margin:0 auto 5px; background: url(../images/xf_btnbg.png); cursor: pointer; background-size: 100% auto;}
.tksp div:hover{ background: url(../images/xf_btnbg_h.png);background-size: 100% auto;}
.tksp .xf_top{ width: 143px; height: 245px; background: url(../images/xf_topbg.png); cursor: pointer;background-size: 100% auto;}
.tksp .xf_top:hover{ background: url(../images/xf_topbg_h.png);background-size: 100% auto;}

@media screen and (max-width: 1500px) { 
	.tksp{ width: 70px; top: 20%; right: 20px;}
	.tksp div{ width: 100%; height:27px; text-align: center; line-height: 27px; font-size: 12px; cursor: pointer; margin-bottom: 2px}
	.tksp .xf_top{ width: 100%; height: 119px;}
}