body, html, header, section, div, ul, li, div, a, p, h1 { padding: 0; margin: 0; font-family: "Microsoft YaHei", "Arial"; }
li { list-style: none; }
a { text-decoration: none; }
.s1 { background: url("../images/bgNew.jpg") center center no-repeat #080f3b; width: 100% }
.s1 img { position: absolute; top: 50%; left: 50%; margin-left: -424px; margin-top: -240px; opacity: 0; transition: 0.8s 0.8s; }
.s1.active img { opacity: 1 }
.section { overflow: hidden }
.main { width: 1100px; margin: 0 auto; }
.title { width: 150px!important; }
.title img { width: 100% }
.title { -webkit-transform: translateY(-1000px); transform: translateY(-1000px); transition-delay: 1.2s; -webkit-transition: 1.2s; transition: 1.2s; text-align: center; margin: 0 auto; }
.active .title { -webkit-transform: translateY(0); transform: translateY(0); }
.mt50 { margin-top: 3%; }
.s2, .s3, .s4, .s5, .s6 { background: url("../images/bg2.jpg") center no-repeat #080f3b; }
.fl { float: left; }
.fr { float: right }
/*main*/


 @keyframes ringone {  0% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 100% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
 @-webkit-keyframes ringone {  0% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 100% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
 @-moz-keyframes ringone {  0% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 100% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
 @keyframes ringfan {  100% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 0% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
 @-webkit-keyframes ringfan {  100% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 0% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
 @-moz-keyframes ringfan {  100% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
 0% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
}
.s1 .ring { animation: ringone 50s linear infinite normal none; -webkit-animation: ringone 50s linear infinite normal none; }
.s1 .ringf { animation: ringfan 100s linear infinite normal none; -webkit-animation:ringfan 100s linear infinite normal none; }
.s1 .yuan1 { background: url(../images/yuan_1.png) center center no-repeat; width: 799px; height: 799px; position: absolute; top:50%; margin-top:-400px; left: 50%; margin-left: -390px; z-index: 5; }
.s1 .yuan2 { background: url(../images/yuan_2.png) center center no-repeat; width: 954px; height: 954px; position: absolute; top:50%; margin-top:-430px; left: 50%; margin-left: -470px; z-index: 2; }
.s2 .c1nei1, .s2 .c1nei2, .s2 .c1nei3 { -webkit-transform: translateY(1000px); transform: translateY(1000px); transition: all 0.8s; }
.s2.active .c1nei1, .s2.active .c1nei2, .s2.active .c1nei3 { -webkit-transform: translateY(0); transform: translateY(0); }
.s2 .center1 { width: 100%; height: 230px; position: absolute; top: 50%; margin-top: -150px; }
.s2 .c1nei1 { width: 360px; transition-delay: 0.8s }
.s2 .c1zhong1 { padding-top: 40px; }
.s2 .c1zhong1 img { display: block }
.s2 .c1zhong2 { color: #222; background: #d6d6d6; height: 70px; text-align: right; padding-right: 20px; }
.s2 .c1zhong2 h2 { font-size: 33px; font-weight: bold; }
.s2 .c1zhong2 h3 { font-size: 17px; font-weight: normal }
.s2 .c1nei2 { width: 350px; background: #ad8155; height: 470px; transition-delay: 1s }
.s2 .c1zhong3 { padding-top: 15px; color: #fff; }
.s2 .c1zhong3 h2 { font-size: 25px; padding: 15px 25px 15px 25px; }
.s2 .c1zhong3 p { font-size: 16px; padding: 0 25px; line-height: 25px; font-weight: 300; }
.s2 .c1zhong3 h3 { font-size: 42px; font-weight: bold; text-align: right; padding-right: 25px; padding-top: 25px; }
.s2 .c1zhong3 h4 { font-size: 26px; text-align: right; padding-right: 25px; padding-bottom: 26px; }
.s2 .c1zhong4 { margin-top: 80px; background: #d6d6d6; height: 390px; }
.s2 .c1zhong4 h2 { font-size: 25px; padding: 15px 25px 15px 25px; color: #ad8155; border-bottom: 1px dashed #000; }
.s2 .c1zhong4 h2 span { font-size: 26px; }
.s2 .jiandou1 { padding-left: 25px; padding-top: 30px; }
.s2 .c1nei3 { width: 390px; transition-delay: 1.2s }
.s2 .c1zhong5 { margin-left: 25px; padding-bottom: 20px; border-bottom: 1px dashed #000; }
.s2 .c1zhong5 p { font-size: 23px; color: #000; padding-left: 15px; padding-top: 5px; }
.s2 .c1zhong6 { padding-left: 20px; }
.s2 .c1zhong6 a { color: #757575 }
.s2 .c1zhong6 a h3 { color: #171717; }
.s2 .c1zhong6 h3 { font-size: 20px; padding-top: 12px; padding-bottom: 6px; font-weight: bold; }
.s2 .c1zhong6 p { font-size: 14px; color: #666 }
.s2 .c1zhong6 p span { color: #cc0000; font-size: 14px; }
.s2 .v_cont img { width: 320px; float: left; margin: 10px 0 0 30px }
.s3 .ullist li { transition: all 1.5s; -webkit-transform: scale(.5, .5) rotateX(50deg); transform: scale(.5, .5) rotateX(50deg); opacity: 0; }
.s3 .ullist li:nth-child(1) { transition-delay: 0.2s; }
.s3 .ullist li:nth-child(2) { transition-delay: 0.4s; }
.s3 .ullist li:nth-child(3) { transition-delay: 0.6s; }
.s3 .ullist li:nth-child(4) { transition-delay: 0.8s; margin-right: 0; }
.s3.active .ullist li { -webkit-transform: scale(1, 1) rotateX(0deg); transform: scale(1, 1) rotateX(0deg); opacity: 1; }
.s3 .ullist { width: 1100px; position: relative; margin: 0 auto; top: 50%; margin-top: -280px; }
.s3 .ullist li { width: 24%; float: left; display: inline; position: relative; overflow: hidden; margin-right: 1%; }
.s3 .ullist li img { width: 100%; -moz-transition: all .5s; -webkit-transition: all .5s; -ms-transition: all .5s; transition: all .5s; }
.s3 .ullist li p { font-size: 30px; position: absolute; width: 100%; border-left: 3px solid #fff; margin: 10px 0 0 20px; padding-left: 10px; }
.s3 .ullist li .black { width: 100%; background: #00c8dc; position: absolute; left: 0; bottom: 0; -moz-transition: all .5s; -webkit-transition: all .5s; -ms-transition: all .5s; transition: all .5s; color: #fff; height: 100px; }
.s3 .ullist li .black p { font-size: 16px; }
.s3 .ullist li .black strong { font-size: 20px; }
.s3 .ullist li:hover img { -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) }
.s3 .ullist li:nth-child(1) .black { background: #00c8dc; }
.s3 .ullist li:nth-child(2) .black { background: #00a4ff; }
.s3 .ullist li:nth-child(3) .black { background: #5f52a0; }
.s3 .ullist li:nth-child(4) .black { background: #32b16c; }
.s3 .ullist li:nth-child(5) .black { background: #00c8dc; }
.s4 .newlist { float: right; width: 410px; }
.s4 .newlist li { padding: 10px 0; border-bottom: 1px solid #666990; -webkit-transform: translateY(100px); transform: translateY(100px); transition: all 2s; opacity: 0; }
.s4.active .newlist li { -webkit-transform: translateY(0px); transform: translateY(0px); opacity: 1 }
.s4 .newlist li a strong { font-size: 20px; color: #fef0a9; padding-bottom: 5px; display: inline-block }
.s4 .newlist li a { font-size: 14px; color: #c3c3c3; display: block }
.s4 .newlist li a:hover { color: #fff }
.s4 .newlist li:last-child { border-bottom: 0; }
.s4 .newlist li:hover { border-bottom: 1px dashed #666990; }
.s4 .newlist li:nth-child(1) { padding-top: 0; }
.s4.active .newlist li:nth-child(1) { transition-delay: 0.2s }
.s4.active .newlist li:nth-child(2) { transition-delay: 0.6s }
.s4.active .newlist li:nth-child(3) { transition-delay: 1s }
.s4.active .newlist li:nth-child(4) { transition-delay: 1.4s }
.s4.active .newlist li:nth-child(5) { transition-delay: 1.8s }
.s4 .focusBox { position: absolute; top: 50%; margin-top: -150px; width: 1100px; height: 450px; }
.s4 .focus { opacity: 0; transition: 0.8s 0.8s; }
.s4.active .focus { opacity: 1; }
.s4 .focus { width: 660px; height: 430px; overflow: hidden; position: relative; float: left; }
.s4 .focus ul { height: 430px; position: absolute; }
.s4 .focus ul li { float: left; width: 660px; height: 430px; overflow: hidden; position: relative; background: #000; }
.s4 .focus ul li div { position: absolute; overflow: hidden; }
.s4 .focus .btnBg { position: absolute; width: 660px; height: 20px; left: 0; bottom: 0; background: #000; display: none; }
.s4 .focus .btn { position: absolute; width: 660px; height: 23px; padding: 0px 10px 0px 10px; right: 0; bottom: 6px; text-align: right; }
.s4 .focus .btn span { display: inline-block; _display: inline; _zoom: 1; width: 25px; height: 24px; line-height: 24px; text-align: center; _font-size: 0; margin-left: 5px; cursor: pointer; background: #fff; }
.s4 .focus .btn span.on { background: #fff; }
.s4 .focus .preNext { width: 45px; height: 100px; position: absolute; top: 150px; background: url(../images/sprite.png) no-repeat 0 0; cursor: pointer; }
.s4 .focus .pre { left: 0; }
.s4 .focus .next { right: 0; background-position: right top; }
.s5 .schoolList { font-size: 0; overflow: hidden; position: absolute; width: 1100px; margin: 0 auto; height: 400px; top: 50%; margin-top: -160px; }
.s5 .schoolList li { display: inline-block; width: 33%; margin-top: 20px; -webkit-transform: translate3d(-500px, -800px, -500px) rotateX(145deg); transform: translate3d(-500px, -800px, -500px) rotateX(145deg); transition: all 2s; }
.s5.active .schoolList li:nth-child(1) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 0.2s }
.s5.active .schoolList li:nth-child(2) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 0.5s }
.s5.active .schoolList li:nth-child(3) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 0.8s }
.s5.active .schoolList li:nth-child(4) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 1.1s }
.s5.active .schoolList li:nth-child(5) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 1.4s }
.s5.active .schoolList li:nth-child(6) { -webkit-transform: translate3d(0, 0, 0) rotateX(0deg); transform: translate3d(0, 0, 0) rotateX(0deg); transition-delay: 1.7s }
.s5 .mod-item { background-color: #073c72; background-color: rgba(0,164,255,.2); border-top: 3px solid #0183d1; margin: 0 10px; color: #fff; text-align: center }
.s5 .mod-title { font-size: 20px; padding-top: 5%; }
.s5 .mod-txt { margin: 5% 0; font-size: 16px; line-height: 1.5; color: #8e99ae; padding: 0 20px }
.s5 .mod-btn { padding-bottom: 7%; }
.s5 .mod-btn a { display: block; margin: 0 auto; width: 168px; height: 48px; border: 1px solid #00a4ff; color: #00a4ff; text-align: center; line-height: 46px; font-size: 14px; transition: all .5s; }
.s5 .mod-btn a:hover { color: #fff; background: #00a4ff; }
.s6 .weibo { width: 1000px; margin: 0 auto; transition: all 2s; -webkit-transform: translateY(1000px); transform: translateY(1000px); }
.s6.active .weibo { -webkit-transform: translateY(0); transform: translateY(0); }
/*头部导航*/
.hd { position:absolute; left: 0; top: 0; z-index: 1; color: white; width: 100%; height: 60px; margin-top:180px; margin-left:100px;}
.logo {float: left; text-decoration: none; margin: 5px 20px 0 0 }
.menu { float: right; margin-right:50px; }
.menu li { float: left; }
.menu li a { display: block; padding: 0 15px; line-height: 60px; cursor: pointer; color: #fff; font-size: 16px; }
.menu li a:hover, .inner nav .menu li.active a { background: url(../images/border.png) no-repeat 0 10px; background-size: contain; color: #0380ff; }
/*video*/
.c41wz { width: 100%; height: 30px; font-size: 18px; background: url(../img/1/c31.png) no-repeat 10px center; text-indent: 1em; line-height: 30px; margin-top: 10px; font-weight: 100 }
.bkc2pic { width: 350px; height: 150px; background: url(../images/video.jpg) no-repeat center center; margin: 10px auto 0 auto; cursor: pointer }
.sp1 { width: 100%; height: 100%; display: none; opacity: 0; position: fixed; z-index: 99999; top: 0 }
.sp1 .spzz { width: 100%; height: 100%; background: #000; opacity: .7; position: absolute; top: 0; fliter:alpha(opacity=0)\9;background:none\9; }
.spaa { width: 600px; height: 340px; position: absolute; margin: -170px 0 0 -300px; left: 50%; top: 40%; z-index: 9 }
/*arrow*/
.arrow { opacity: 1; animation: arrow 3s cubic-bezier(0.5, 0, 0.1, 1) infinite; -webkit-animation: arrow 3s cubic-bezier(0.5, 0, 0.1, 1) infinite; position: absolute; bottom: 10px; left: 50%; margin-left: -30px; width: 100px; height: 48px; text-align: center; font-size: 20px; color: #fff; overflow: hidden; background: url(../images/mouse.png) no-repeat }
<style>
*{ margin:0; padding:0;}
/**左浮动弹窗**/
.floatleft1{width:129px;position:fixed;z-index:999; top:50%;display:none; left:9px;}
.floatleft1 ul{width:129px}
.floatleft1 ul li{width:129px;display:block;-webkit-transform:translate3d(-97px,20px,0);-moz-transform:translate3d(-97px,20px,0);-ms-transform:translate3d(-97px,20px,0);-o-transform:translate3d(-97px,20px,0);transform:translate3d(-97px,20px,0); margin-top:8px;}
.floatdisplay{-webkit-transform:translate3d(0,0,0)!important;-moz-transform:translate3d(0,0,0)!important;-ms-transform:translate3d(0,0,0)!important;-o-transform:translate3d(0,0,0)!important;transform:translate3d(0,0,0)!important}
.floatleft1 ul .floattw1{height:101px;background:url(../img/1.jpg) no-repeat center center;-webkit-transition:1.2s;-moz-transition:1.2s;-ms-transition:1.2s;-o-transition:1.2s;transition:1.2s}
.floatleft1 ul .floattw2{height:101px;background:url(../img/2.jpg) no-repeat center center;-webkit-transition:1.2s .6s;-moz-transition:1.2s .6s;-ms-transition:1.2s .6s;-o-transition:1.2s .6s;transition:1.2s .6s}
.floatleft1 ul .floattw3{height:160px;background:url(/Images/3.png) no-repeat center center;-webkit-transition:1.2s 1.2s;-moz-transition:1.2s 1.2s;-ms-transition:1.2s 1.2s;-o-transition:1.2s 1.2s;transition:1.2s 1.2s}


.right_fixed{position:fixed;width:80px;height:456px;right:50%;margin-right:-728px;top:100px;z-index:9999;background:#373737;border-radius: 5px;overflow: hidden;}
.right_fixed_t{font-size:16px;text-align:Center;padding:7px 0;background:#EE7800;color:#FFF;}
.right_fixed_box li{margin:1px 0;border-top:1px solid #424242;}
.right_fixed_box li a{display:block;padding:7px 0;text-align:Center;color:#888; text-decoration:none;}
.right_fixed_box i{display:block;width:47px;height:47px;margin:0 auto;font-size:40px;color:#EE7800;transition:.5s;-webkit-transform:rotate(0deg);}
.right_fixed_box li a:hover i{transition:0.5s;-webkit-transform:rotate(360deg);}
.right_fixed_box p{font-size:14px;color:#FFF;}

.fixed_1 {position:fixed;top:200px;right:0px;width:53px;z-index:987654px;
}
.fixed_1 a:link,.fixed_1 a:visited {display:block;width:53px;height:23px;background:#ff8101 ;margin-top:1px;color:#ffffff;background-position:center 8px;
background-repeat:no-repeat;text-align:center;padding-top:30px;line-height:23px;z-index:545;}
.fixed_1 a:hover {background-color:#484848;}


.dd {background: red}
.right-musk {width: 53px;height: 100%;position: fixed;right: -53px;top: 0;background: #FE8101;z-index: 9999911;}
.right-musk .r-musk-menu {width: 53px;height: 375px;position: absolute;top: 150px}
.right-musk .r-musk-menu ul li {width: 53px;height: 65px;float: left;margin-top: 10px;cursor: pointer;list-style: none;position: relative; background:url(http://www.hnxdf.com/Images/rc.png) no-repeat;font-family:"微软雅黑", "宋体";}
.right-musk .r-musk-menu ul li:hover {background-color: #ef7800!important}
.right-musk .r-musk-menu ul li span {display: block;position: relative;margin-top: 37px;text-align: center;color: #fff}
.right-musk .r-musk-menu ul li.rc1{ background-position:0 5px;}
.right-musk .r-musk-menu ul li.rc2{ background-position:-53px 5px;}
.right-musk .r-musk-menu ul li.rc3{ background-position:-106px 5px;}
.right-musk .r-musk-menu ul li.rc4{ background-position:-159px 5px;}
.right-musk .r-musk-menu ul li.rc5{ background-position:-212px 5px;}
.right-musk .r-musk-menu ul li.rc6{ background-position:-265px 5px;}
.right-musk .r-musk-menu ul li.rc7{ background-position:-318px 5px;}
.right-musk .r-musk-menu ul li.rc8{ background-position:-371px 5px;}

@media screen and (max-width:1280px){
.right_fixed{display:none;}

.right-musk{ display:none;}
}

@media screen and (max-width:1280px){
.lxb-container{display:none;}
}

.canguan{ float:left; margin-top:25px; margin-left:100px;}

@media screen and (max-height:960px){
.floatleft1{ top:47%;}
}
@media screen and (max-height:960px){
.floatleft1{ top:51%;}
}
@media screen and (max-height:1024px){
.floatleft1{ top:44%;}
}
@media screen and (max-height:768px){
.floatleft1{ top:52%;}
}
@media screen and (max-height:900px){
.floatleft1{ top:50%;}
}

</style>