*{margin:0; padding:0; border:none;}
.container{width:100%; height:100%; position:relative; overflow:hidden; min-width:1200px;}
.header{position:absolute; z-index:3; width:1000px; left:50%; margin-left:-500px; top:24px;}
.logo {
    display: block;
    width: 176px;
    height: 64px;
    position: relative;
    left: -15px;
    top: -10px;
}
.nav {
    position: absolute;
    z-index: 2;
    bottom: 40px;
    width: 874px;
    height: 90px;
    left: 50%;
    margin-left: -420px;
    overflow: hidden;
    top: 0px;
    background: url(../images/line.jpg) no-repeat -5px 56px;
}
.nav span { display: block; width: 110px; height: 110px; float: left; text-indent: -999em; margin-right: 43px; cursor: pointer; }
.nav span.home{background-position:0px 0px;}
.nav span.arms{background-position:-200px 0px;}
.nav span.cool{background-position:-401px 0px;}
.nav span i{  width: 130px; height: 40px; float: left;  text-indent: -999em; margin-right: 36px; cursor: pointer; }
.nav span i.btn-bg-1{/*!  */width: 106px;}
.nav span i.btn-bg-2{background-position:-156px -7px;width: 150px;}
.nav span i.btn-bg-3{background-position:-346px -7px;width: 136px;}
.nav span i.btn-bg-4{background-position:-518px -7px;width: 138px;}
.nav span i.btn-bg-5{background-position:-690px -7px;width: 140px;}
.nav span i.btn-bg-6{background-position:-860px -7px;width: 140px;}
.nav span:hover{}
.nav span:hover{background-position:0px -50px;}
.nav .on{}
.nav span.btn-1,.nav .btn-1.on{background-position:0px -50px;width: 76px;margin-left: 30px;}
.nav span.btn-2,.nav .btn-2.on{background-position:-156px -50px;}
.nav span.btn-3,.nav .btn-3.on{background-position:-346px -50px;}
.nav span.btn-4,.nav .btn-4.on{background-position:-518px -50px;}
.nav span.btn-5,.nav .btn-5.on{background-position:-690px -50px;}
.nav span.btn-6,.nav .btn-6.on{background-position:-860px -50px;width: 140px;}
.prevs {position: absolute; display: block; width: 50px !important; height: 85px !important; background: url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/btn.png?) no-repeat !important; font-size: 0px; left: 50%; margin-left: -660px; top: 360px !important;z-index:9999; display:none;}
.nexts {position: absolute; display: block; width: 50px !important; height: 85px !important; background: url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/btn.png?) no-repeat -50px 0px !important; font-size: 0px; left: 50%; margin-left: 620px; top: 360px !important;z-index:9999;display:none;  }
.nav a{display:block; width:174px; height:73px; float:left; background:url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/sprite.png?) no-repeat -602px 0px; text-indent:-999em; margin-right:36px; cursor:pointer;}
.box{overflow:hidden; position:relative; z-index:1; left:0px; width:5760px;}
.main{width:1200px; margin:0 auto;}
.main .pic { width: 195px; height: 300px; overflow: hidden; position: relative; top: 200px; left: 6px;position: relative; display:none;}
.main .pic span{ display:block;position: absolute;top:97px;left:0px; }
.boxs{ float:left; height:880px overflow:hidden; width:1920px; position:relative;}
.box1{background:url(../images/bg2.jpg) no-repeat center top; height:1004px }
.box2{background:url(../images/bg4.jpg) no-repeat center top; height:1004px }
.box3{background:url(../images/bg3.jpg) no-repeat center top; height:1004px }
.box4{background:url(../images/bg5.jpg) no-repeat center top; height:1004px }
.box5{background:url(../images/bg6.jpg) no-repeat center top; height:1004px }
.box6{background:url(../images/bg1.jpg) no-repeat center top; height:988px }
.main .pic .ligh { width: 198px; height: 204px; overflow: hidden; position: relative; top: 97px; }
.nav-center  { width: 100%; position: absolute; bottom: 0px; height: 110px; z-index: 10; }
.nav-center .bg { width: 100%; position: absolute; bottom: 0px; height: 120px; 
background: #000; opacity: 0.3; }
.main { width: 1100px; margin: 0 auto; }
.box3 ul{ overflow:hidden; width:806px; margin:0 auto;}
.box3 ul li{float:left;width:262px; height:149px; position:relative; list-style:none; cursor:pointer;}
.box3 ul li img{display:block;}
.box3 ul li span{display:block;width:258px; height:145px; position:absolute; top:0px; left:0px; border:2px solid #292c32;}
.box3 ul li span.blue{background:url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/pic1.jpg) no-repeat center center;display:block;width:258px; height:145px; }
.box3 ul li span.green{background:url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/pic2.jpg) no-repeat center center;display:block;width:258px; height:145px; }
.box3 ul li span.red {background:url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/pic3.jpg) no-repeat center center;display:block;width:258px; height:145px; }
.box3 ul li.on span.blue,.box3 ul li span.blue:hover{border:2px solid #0fadc6;}
.box3 ul li.on span.green,.box3 ul li span.green:hover{border:2px solid #769241;}
.box3 ul li.on span.red,.box3 ul li span.red:hover{border:2px solid #603d65;}
.box3 dl{width:962px; height:297px; overflow:hidden; position:relative; margin:0 auto; margin-top:10px; z-index:2;}
.box3 dl dt{position:absolute; top:0px; left:0px; display:none; border:2px solid #292c32;width:958px; height:293px;}
.box3 dl dt img{display:block;}
.btn{position:absolute; width:100%; height:60px; top:270px; overflow:hidden; z-index:1;}
.btn a{display:block; width:60px; height:60px; background:url(https://img1.tiancitycdn.com/project1/csol/event/2017/01/cs170123act/images/sprite.png?) no-repeat; text-indent:-999em;}
.btn a.prev{background-position:0px -85px; float:left; position:relative; left:60px;}
.btn a.next{background-position:-64px -85px; float:right; position:relative; right:60px;}
.sg{background:url(https://img1.tiancitycdn.com/project1/csol/event/cs160831ver/images/sg.png?) no-repeat center center; background-size: 100%; width:335px; height:493px; position:absolute; top:-120px; left:-200px; -webkit-animation:gogogo 5s infinite linear; animation:gogogo 5s infinite linear; -moz-animation:gogogo 5s infinite linear; -ms-animation:gogogo 5s infinite linear; -o-animation:gogogo 5s infinite linear;}
@keyframes gogogo {
    0%{transform:translateX(0px);}
    30%,100%{transform:translateX(400px);}
}
@-webkit-keyframes gogogo {
    0%{-webkit-transform:translateX(0px);}
    30%,100%{-webkittransform:translateX(400px);}
}
@-moz-keyframes gogogo {
    0%{-moz-transform:translateX(0px);}
    30%,100%{-moz-transform:translateX(400px);}
}
@-ms-keyframes gogogo {
    0%{-ms-transform:translateX(0px);}
    30%,100%{-ms-transform:translateX(400px);}
}
@-o-keyframes gogogo {
    0%{-o-transform:translateX(0px);}
    30%,100%{-o-transform:translateX(400px);}
}
.nav-center .hd { background: url(../images/2.png?) no-repeat -700px -16px; display: block; width: 100px; height: 100px; position: absolute; top: 0; right: 0; }
.nav-center .hd:hover{background-position: -700px -104px;}
.boss{width:817px;height:485px;position:relative;top:170px;margin:0 auto}
.boss ul{width:822px;height:100%;position:relative;top:537px}
.boss ul li{width:270px;height:160px;margin-right:1px;float:left;border:1px solid #000;opacity:.5}
.boss ul li.active{background:#9cba58;opacity:1}
.boss .page{width:100%;height:100%;position:absolute;top:50px;left:0}
.boss div.con-page{width:817px;height:100%;position:absolute;top:0;left:0}
.boss .page-1{background:#555}
.boss .page-2{background:#777}
.boss .page-3{background:#999}
.box2 .flash{width:408px;height:270px;float:right;position:relative;top:372px;left:-51px}
.box2 .flash a{width:100%;height:100%;display:block}
.chakan { display: block; width: 240px; height: 60px; position: absolute; top: 808px; left: 50%; margin-left: -123px; }			
.nav a { width: 110px; height: 90px; display: block; }
.video-btn{background: url(../images/1.jpg) no-repeat center top;width:155px;height:97px;display:block;margin:0 auto;position: relative;top:500px;}	
.nav span.btn-1, .nav .btn-1:hover{background: url(../images/4.png?) no-repeat 0px 0px;}
.nav span a { background: url(../images/2.png?) no-repeat 20px -16px; }
.nav span.btn-2 a { background-position: -120px -16px; }
.nav span.btn-3 a { background-position: -265px -16px; }
.nav span.btn-4 a { background-position: -405px -16px; }
.nav span.btn-5 a { background-position: -550px -16px; }
.nav span.btn-6 a { background-position: -694px -16px; }
.nav span.btn-1 a:hover { background-position: 20px -104px; }
.nav span.btn-2 a:hover { background-position: -120px -104px; }
.nav span.btn-3 a:hover { background-position: -265px -104px; }
.nav span.btn-4 a:hover { background-position: -405px -104px; }
.nav span.btn-5 a:hover { background-position: -550px -104px; }
.nav span.btn-6 a:hover { background-position: -694px -104px; }
.nav span.btn-1.on a { background-position: 20px -104px; }
.nav span.btn-2.on a { background-position: -120px -104px; }
.nav span.btn-3.on a { background-position: -265px -104px; }
.nav span.btn-4.on a { background-position: -405px -104px; }
.nav span.btn-5.on a { background-position: -550px -104px; }
.nav span.btn-6.on a { background-position: -694px -104px; }
.header .s{width:143px;height:40px;background: url(../images/3.png?) no-repeat center top;position: absolute;right:0px;top:10px;}