body>div{position: relative;}
.header{background: #223448;height: 80px;}
.header .header_ul{width: 880px;height: 80px;float: right;}
.header .header_ul li{float: left;width: 20%;height: 100%;margin-right: 5%;}
.header .header_ul li:last-of-type{margin-right: 0;}
.header .header_ul li.active{background: #58afff;}
.header .header_ul li a p{margin-left: 40px;margin-top: 14px;}
.header .header_ul li a h2{text-align: center;line-height: 35px;font-size: 22px;letter-spacing: 2px;}

body>div>h4{position: absolute;text-align: center;width: 100%;top: 30%;}
body>div.bg3 h4{top:20%;color: #6094d5;font-weight: 700;letter-spacing: 2px;}
body>div.bg4 h4{top:20%;}

div.bg1{width: 100%;height: 854px;background: url("../images/bg1.jpg")no-repeat;background-size:100% 100%}
div.bg2{width: 100%;height: 843px;background: url("../images/bg2.jpg")no-repeat;background-size:100% 100%}
div.bg3{width: 100%;height: 985px;background: url("../images/bg3.jpg")no-repeat;background-size:100% 100%}
div.bg4{width: 100%;height: 1050px;background: url("../images/bg4.jpg")no-repeat;background-size:100% 100%}

div.bg1>div{height: 270px;position: absolute;left: 50%;bottom: -70px;margin-left: -575px;z-index: 2;}
div.bg1>div>div{height: 100%;}
div.bg1>div .news_box{width: 440px;height: 240px;background: #1e3e62;padding: 10px 20px 20px 20px;overflow: hidden;}
div.bg1>div .news_box .news_btn{position: relative;}
.news_box hr{margin: 0;position: absolute;width: 100%;bottom: 0;background-color:#315072;height: 2px;border: none;}
div.bg1>div .news_box .news_btn span{width: 75px;height: 40px;line-height: 40px;text-align: center;display: inline-block;cursor: pointer;float: left;
    margin-right: 8px;}
div.bg1>div .news_box .news_btn span.active{border-bottom: 2px solid cornflowerblue;position: relative;z-index: 2;}
div.bg1>div .news_box .news_btn a.more{width: 20px;height: 20px;background: url("../images/more.png")no-repeat;position: absolute;right: 0;top: 8px;display: none; }

div.bg1>div .news_box .news_ul{display: none;}
div.bg1>div .news_box .news_ul:first-of-type{display: block;}
div.bg1>div .news_box .news_ul li{margin-top: 14px;height: 22px;line-height: 22px;font-size: 18px;}
div.bg1>div .news_box .news_ul li>a{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width: 350px;display: inline-block;font-size: 14px}
div.bg1>div .news_box .news_ul li>span{font-size: 14px;color: #ccc;}
div.bg1>div .slide_box{width: 490px;}
div.bg1>div .slide_box img{width: 490px;height: 270px;}
div.bg1>div .download_box{width: 180px;text-align: center;background: #1e3e62;}
div.bg1>div .download_box a{width: 88%;margin: 0 auto;display: block;margin-top: 4%;}
div.bg1>div .download_box a img{width: 100%;}
div.bg1>div .download_box>div{margin-top: 4%;}
body>div.age{    position: absolute;
    right: 30px;
    top: 100px;
    z-index: 2;
    width: 100px;}
body>div.age img{width: 100%;}




div.bg2 .game_info_container{height: 385px;position: absolute;bottom: 90px;left: 50%;margin-left: -600px;}
.game_info_btn>span{position: absolute;}
.game_info_btn>span:first-of-type{width: 166px;height: 367px;top:14px;background: url("../images/info_1.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:first-of-type.active{background: url("../images/info_11.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(2){width: 190px;height: 380px;left: 75px;background: url("../images/info_2.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(2).active{background: url("../images/info_22.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(2) i{left: 82px;}
.game_info_btn>span:nth-of-type(3){width: 146px;height: 372px;bottom: 0;right: 205px;background: url("../images/info_3.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(3).active{background: url("../images/info_33.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(3) i{left: 40px;}
.game_info_btn>span:nth-of-type(4){width: 120px;height: 348px;bottom: 15px;right: 122px;background: url("../images/info_4.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(4).active{background: url("../images/info_44.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:nth-of-type(4) i{left: 40px;}
.game_info_btn>span:last-of-type{width: 104px;height: 348px;bottom: 15px;right: 0;background: url("../images/info_5.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:last-of-type.active{background: url("../images/info_55.png")no-repeat;background-size: 100% 100%;}
.game_info_btn>span:last-of-type i{left: 6px}
.game_info_btn>span i{cursor: pointer;width: 80px;height: 300px;position: absolute;left: 15px;top: 60px;}
.game_info_box{width: 650px;height: 385px;background: url("../images/game_info_bg.png")no-repeat;background-size: 100% 100%;position: absolute;left: 240px;}
.game_info_box>li{display: none;text-align: center;position: relative;height: 100%;}
.game_info_box>li:first-of-type{display: block}
.game_info_box>li>h2{font-size: 32px;padding: 10px;letter-spacing: 2px;color: yellow;}
.game_info_box>li>img{width: 375px;}
.game_info_box>li>div{width: 80%;position: absolute;left: 50%;margin-left: -42%;font-size: 14px;text-align: left;bottom: 23px;line-height: 20px;text-indent: 2em;}

.game_manual_container{height: 550px;position: absolute;left: 50%;margin-left: -600px;bottom: 16%;}
.manual_main_ul,.manual_main_ul>li{height: 100%;}
.manual_left,.manual_right{width: 600px;height: 100%;float: left;position: relative;}
.manual_main_ul>li,.manual_left>li{display: none;}
.manual_main_ul>li:first-of-type,.manual_left>li:first-of-type{display: block;}
.manual_left .bigIcon{width: 445px;height: 348px;position: absolute;top: 18%;left: -10%;}
.manual_left .manual_text{width: 45%;position: absolute;right: 1%;top: 24%;color: #4167ad;}
.manual_left .manual_text h1{text-align: right;font-size: 50px;font-weight: 700;}
.manual_left .manual_text>p{text-indent: 2.5em;margin-top: 5%;}
.manual_left .manual_text>p>span:last-of-type{color: #333}
.manual_left .manual_text>hr{background-color: #4167ad;height: 2px;border: none;}
.manual_left .smallIcon{position: absolute;bottom: -7%;left: -5%;}
.manual_left .smallIcon>div{float: left;}

.manual_right_avatar{margin-top: 100px;margin-left: 15px;}
.manual_right_avatar li{width: 128px;height: 120px;margin: 0 0 10px 10px;float: left;cursor: pointer;}
.manual_right_avatar1 li:first-of-type.active{background: url("../images/right/1/show1.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(2).active{background: url("../images/right/1/show2.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(3).active{background: url("../images/right/1/show3.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(4).active{background: url("../images/right/1/show4.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(5).active{background: url("../images/right/1/show5.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(6).active{background: url("../images/right/1/show6.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(7).active{background: url("../images/right/1/show7.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(8).active{background: url("../images/right/1/show8.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(9).active{background: url("../images/right/1/show9.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(10).active{background: url("../images/right/1/show10.png")no-repeat!important;}
.manual_right_avatar1 li:nth-of-type(11).active{background: url("../images/right/1/show11.png")no-repeat!important;}

.manual_right_avatar2 li:first-of-type.active{background: url("../images/right/2/show1.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(2).active{background: url("../images/right/2/show2.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(3).active{background: url("../images/right/2/show3.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(4).active{background: url("../images/right/2/show4.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(5).active{background: url("../images/right/2/show5.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(6).active{background: url("../images/right/2/show6.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(7).active{background: url("../images/right/2/show7.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(8).active{background: url("../images/right/2/show8.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(9).active{background: url("../images/right/2/show9.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(10).active{background: url("../images/right/2/show10.png")no-repeat!important;}
.manual_right_avatar2 li:nth-of-type(11).active{background: url("../images/right/2/show11.png")no-repeat!important;}

.manual_right_avatar3 li:first-of-type.active{background: url("../images/right/3/show1.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(2).active{background: url("../images/right/3/show2.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(3).active{background: url("../images/right/3/show3.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(4).active{background: url("../images/right/3/show4.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(5).active{background: url("../images/right/3/show5.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(6).active{background: url("../images/right/3/show6.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(7).active{background: url("../images/right/3/show7.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(8).active{background: url("../images/right/3/show8.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(9).active{background: url("../images/right/3/show9.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(10).active{background: url("../images/right/3/show10.png")no-repeat!important;}
.manual_right_avatar3 li:nth-of-type(11).active{background: url("../images/right/3/show11.png")no-repeat!important;}

.manual_right_avatar4 li:first-of-type.active{background: url("../images/right/4/show1.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(2).active{background: url("../images/right/4/show2.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(3).active{background: url("../images/right/4/show3.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(4).active{background: url("../images/right/4/show4.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(5).active{background: url("../images/right/4/show5.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(6).active{background: url("../images/right/4/show6.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(7).active{background: url("../images/right/4/show7.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(8).active{background: url("../images/right/4/show8.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(9).active{background: url("../images/right/4/show9.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(10).active{background: url("../images/right/4/show10.png")no-repeat!important;}
.manual_right_avatar4 li:nth-of-type(11).active{background: url("../images/right/4/show11.png")no-repeat!important;}

.manual_right_avatar5 li:first-of-type.active{background: url("../images/right/5/show1.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(2).active{background: url("../images/right/5/show2.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(3).active{background: url("../images/right/5/show3.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(4).active{background: url("../images/right/5/show4.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(5).active{background: url("../images/right/5/show5.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(6).active{background: url("../images/right/5/show6.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(7).active{background: url("../images/right/5/show7.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(8).active{background: url("../images/right/5/show8.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(9).active{background: url("../images/right/5/show9.png")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(10).active{background: url("../images/right/5/show10.png?v=0.1")no-repeat!important;}
.manual_right_avatar5 li:nth-of-type(11).active{background: url("../images/right/5/show11.png?v=0.1")no-repeat!important;}

.game_manual_container .manual_right_title{position: absolute;right: 0;width: 630px;height: 60px;line-height: 60px;background: url("../images/manual_title.png")no-repeat;
    background-size: 100% 100%;z-index: 2}
.game_manual_container .manual_right_title>span{width: 85px;margin-left: 20px;cursor: pointer;float: left;text-align: center;color: #959595;}
.game_manual_container .manual_right_title>span.active{color: #fff;}
.game_manual_container .manual_right_title>span:hover{color: #fff;}

.game_screen_container{position: absolute;left: 50%;margin-left: -600px;top: 260px;}
.container_image{width:1180px;height:530px;margin:0 auto;position:relative;}
.container_image .i_btn{display:block;width:25px;height:68px;position:absolute;top:45%;z-index:3;}
.container_image .prev_L{left:-50px;background-image:url(../images/left.png);}
.container_image .next_R{right:-50px;background-image:url(../images/right.png);}
.slide_img {width:880px;height:400px;position:relative;z-index:1;margin: 0 auto;}
.slide_img li{width:300px!important;height:380px;overflow:hidden;position:absolute;top:15px;}
.slide_img li a{display:block;position:relative;width:100%;height:500px;}
.slide_img li a img{position:absolute;height:100%;}
.slide_img li.on a{height:530px;}
.slide_img li.on{width:800px;left:190px;top:0;overflow:hidden;}
.slide_img li.on img{width:100%;}
.slide_img li.left{left:0;}
.slide_img li.right{left:1000px;}
.slide_img li.mid{left:190px;}

#qqgroup{position: fixed;right: 1%;top: 10%;z-index: 10;}

