/*reset*/
@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {margin:0;padding:0;font-family:"Microsoft Yahei", "Arial", "sans-serif", "simsun";}
* {font-family:"Microsoft Yahei", "Arial", "sans-serif", "simsun";}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;border:none;}
ul,li,dl ,dt,dd ,ol,p,img { list-style:none;border:none;}
address,caption,cite,code,dfn,em,th,var,optgroup {font-style:normal;font-weight:normal;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym {border:0;font-variant:normal;}
legend {color:#000000;}
a {text-decoration:none;color:#353535;cursor:pointer;}
input,a {outline:none;}
.inner {width:1200px;margin:0 auto;text-align:left;}
.inner_zl {width:1218px;margin:0 auto;text-align:left;}
body {min-width:1218px;background:#fff url(../images/zl_bg.png);}

.head {height:500px;margin-bottom:55px;background:url(../images/zl_banner.png) no-repeat center;}
.head .inner {position:relative;height:500px;} 
.head .inner .logo {position:absolute;left:29px;top:43px;}
.head .inner .home {width:124px;height:59px;line-height:45px;position:absolute;right:25px;top:0;background:url(../images/zl_home.png);text-align:center;}
.head .inner .home a {display:block;color:#fff;}
.head .inner .title {width:911px;height:225px;position:absolute;left:152px;top:139px;}
.head .inner .select {width:120px;height:38px;position:absolute;right:27px;bottom:55px;}
.head .inner .select select {width:106px;height:38px;line-height:38px;padding-left:14px;color:#fff;font-size:16px;background:url(../images/zl_select.png);cursor:pointer;box-sizing:content-box;border:none;appearance:none;-moz-appearance:none;-webkit-appearance:none;}
.head .inner .select select option {color:#000;}

.zl_box1 {height:481px;margin-bottom:39px;}
.zl_box1 .inner_zl {height:481px;background:url(../images/zl_box1.png);}
.zl_box1 .inner_zl ul {float:left;width:863px;height:239px;margin-left:202px;margin-top:149px;background:url(../images/zl_square.png) no-repeat left top;}
.zl_box1 .inner_zl ul li {float:left;width:143px;height:239px;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;}
.zl_box1 .inner_zl ul li a {display:block;}
.zl_box1 .inner_zl ul li i {display:block;width:143px;height:148px;}
.zl_box1 .inner_zl ul li p {height:91px;line-height:91px;text-align:center;font-size:22px;}
.zl_box1 .inner_zl ul li.zl_square1 {margin-left:5px;}
.zl_box1 .inner_zl ul li.zl_square1 i {background:url(../images/zl_square_i1.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square2 i {background:url(../images/zl_square_i2.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square3 i {background:url(../images/zl_square_i3.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square4 i {background:url(../images/zl_square_i4.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square5 i {background:url(../images/zl_square_i5.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square6 i {background:url(../images/zl_square_i6.png) no-repeat center;}
.zl_box1 .inner_zl ul li.zl_square1 p {color:#55d6ce;}
.zl_box1 .inner_zl ul li.zl_square2 p {color:#54cad5;}
.zl_box1 .inner_zl ul li.zl_square3 p {color:#3abebb;}
.zl_box1 .inner_zl ul li.zl_square4 p {color:#46b0c8;}
.zl_box1 .inner_zl ul li.zl_square5 p {color:#1e9ba3;}
.zl_box1 .inner_zl ul li.zl_square6 p {color:#038197;}
.zl_box1 .inner_zl ul li:hover i {
-webkit-animation:jump 1.5s ease-out backwards;
-moz-animation:jump 1.5s ease-out backwards;
-ms-animation:jump 1.5s ease-out backwards;
animation:jump 1.5s ease-out backwards;
}

.zl_box2 {height:481px;margin-bottom:39px;}
.zl_box2 .inner_zl {height:481px;background:url(../images/zl_box2.png);}
.zl_box2 .inner_zl ul {margin-left:302px;margin-top:152px;display:inline-block;}
.zl_box2 .inner_zl ul li {float:left;width:124px;height:204px;margin-right:90px;background:url(../images/zl_green.png);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;}
.zl_box2 .inner_zl ul li i {display:block;width:124px;height:66px;margin-top:23px;}
.zl_box2 .inner_zl ul li p {text-align:center;line-height:68px;color:#fff;font-size:22px;}
.zl_box2 .inner_zl ul li.zl_green1 i {background:url(../images/zl_green_i1.png) no-repeat center;}
.zl_box2 .inner_zl ul li.zl_green2 i {background:url(../images/zl_green_i2.png) no-repeat center;}
.zl_box2 .inner_zl ul li.zl_green3 i {background:url(../images/zl_green_i3.png) no-repeat center;}
.zl_box2 .inner_zl ul li.zl_green2 p {margin-top:10px;line-height:30px;}
.zl_box2 .inner_zl ul li:hover i {
-webkit-animation:scale1 ease 1.3s 1;
-moz-animation:scale1 ease 1.3s 1;
-ms-animation:scale1 ease 1.3s 1;
animation:scale1 ease 1.3s 1;
}

.zl_box3 {height:481px;margin-bottom:39px;}
.zl_box3 .inner_zl {height:481px;background:url(../images/zl_box3.png);}
.zl_box3 .inner_zl ul {display:inline-block;margin-left:273px;margin-top:115px;width:733px;height:300px;background:url(../images/zl_color.png);}
.zl_box3 .inner_zl ul li {float:left;width:104px;text-align:center;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;}
.zl_box3 .inner_zl ul li a {display:inline-block;width:100%;}
.zl_box3 .inner_zl ul li p {height:85px;line-height:85px;margin-top:7px;font-size:21px;color:#fff;}
.zl_box3 .inner_zl ul li i {float:left;display:inline-block;width:62px;height:62px;margin-left:23px;}
.zl_box3 .inner_zl ul li.zl_color1 i {background:url(../images/zl_color_i1.png);}
.zl_box3 .inner_zl ul li.zl_color2 i {background:url(../images/zl_color_i2.png);margin-top:77px;}
.zl_box3 .inner_zl ul li.zl_color3 i {background:url(../images/zl_color_i3.png);margin-top:30px;}
.zl_box3 .inner_zl ul li.zl_color4 i {background:url(../images/zl_color_i4.png);margin-top:129px;}
.zl_box3 .inner_zl ul li.zl_color5 i {background:url(../images/zl_color_i5.png);}
.zl_box3 .inner_zl ul li.zl_color6 i {background:url(../images/zl_color_i6.png);margin-top:57px;}
.zl_box3 .inner_zl ul li.zl_color7 i {background:url(../images/zl_color_i7.png);margin-top:27px;}
.zl_box3 .inner_zl ul li:hover i {
-webkit-animation:flipinY 1.5s ease-out backwards;
-moz-animation:flipinY 1.5s ease-out backwards;
-ms-animation:flipinY 1.5s ease-out backwards;
animation:flipinY 1.5s ease-out backwards;
}

.zl_box4 {height:481px;margin-bottom:39px;}
.zl_box4 .inner_zl {height:481px;background:url(../images/zl_box4.png);}
.zl_box4 .inner_zl ul {display:inline-block;width:585px;height:220px;margin-left:298px;margin-top:157px;background:url(../images/zl_hr.png) no-repeat left 60px;}
.zl_box4 .inner_zl ul li {float:left;width:148px;height:220px;margin-left:90px;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;}
.zl_box4 .inner_zl ul li i {display:inline-block;width:148px;height:148px;}
.zl_box4 .inner_zl ul li p {height:80px;line-height:80px;text-align:center;font-size:24px;}
.zl_box4 .inner_zl ul li.zl_orange i {background:url(../images/zl_orange.png);}
.zl_box4 .inner_zl ul li.zl_red i {background:url(../images/zl_red.png);}
.zl_box4 .inner_zl ul li.zl_orange p {color:#f56201;}
.zl_box4 .inner_zl ul li.zl_red p {color:#d72f34;}
.zl_box4 .inner_zl ul li:hover i {
-webkit-animation:flipinY 1.5s ease-out backwards;
-moz-animation:flipinY 1.5s ease-out backwards;
-ms-animation:flipinY 1.5s ease-out backwards;
animation:flipinY 1.5s ease-out backwards;
}

.zl_box5 {height:481px;margin-bottom:102px;}
.zl_box5 .inner_zl {height:481px;background:url(../images/zl_box5.png);}
.zl_box5 .inner_zl ul {display:inline-block;margin-left:135px;margin-top:157px;}
.zl_box5 .inner_zl ul li {float:left;width:137px;margin-right:37px;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;}
.zl_box5 .inner_zl ul li i {display:inline-block;width:137px;height:137px;}
.zl_box5 .inner_zl ul li p {font-size:22px;color:#38a8db;text-align:center;}
.zl_box5 .inner_zl ul li.zl_circle1 i {background:url(../images/zl_circle1.png);}
.zl_box5 .inner_zl ul li.zl_circle2 i {background:url(../images/zl_circle2.png);}
.zl_box5 .inner_zl ul li.zl_circle3 i {background:url(../images/zl_circle3.png);}
.zl_box5 .inner_zl ul li.zl_circle4 i {background:url(../images/zl_circle4.png);}
.zl_box5 .inner_zl ul li.zl_circle5 i {background:url(../images/zl_circle5.png);}
.zl_box5 .inner_zl ul li.zl_circle6 i {background:url(../images/zl_circle6.png);}
.zl_circle1 p, .zl_circle2 p, .zl_circle5 p {line-height:30px;margin-top:10px;}
.zl_circle3 p, .zl_circle4 p, .zl_circle6 p {line-height:77px;}
.zl_box5 .inner_zl ul li:hover i {
-webkit-animation:scalein-1 ease .3s 1;
-moz-animation:scalein-1 ease .3s 1;
-ms-animation:scalein-1 ease .3s 1;
animation:scalein-1 ease .3s 1;
}

.bottom {height:130px;padding-top:32px;background:#198be3;}
.bottom .footPic {float:left;margin-left:150px;margin-top:10px;width:80px;}
.bottom .footText {float:left;margin-left:40px;width:780px;}
.bottom .footText p {color:#fff;height:32px;line-height:32px;font-size:16px;}
.bottom .footText a {color:#fff;}

/*动画效果*/
@keyframes scale1 {
0%,10%,100%,50%,70%{-webkit-transform:scale(1);transform:scale(1)}
30%{-webkit-transform:scale(.9);transform:scale(.9)}
40%{-webkit-transform:scale(1.3);transform:scale(1.3)}
60%{-webkit-transform:scale(1.15);transform:scale(1.15)}
}
@-webkit-keyframes scale1 {
0%,10%,100%,50%,70%{-webkit-transform:scale(1);transform:scale(1)}
30%{-webkit-transform:scale(.9);transform:scale(.9)}
40%{-webkit-transform:scale(1.3);transform:scale(1.3)}
60%{-webkit-transform:scale(1.15);transform:scale(1.15)}
}
@keyframes scalein-1 {
0%{opacity:0;-webkit-transform:scale(.8);transform:scale(.8)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@-webkit-keyframes scalein-1 {
0%{opacity:0;-webkit-transform:scale(.8);transform:scale(.8)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes scalein-2 {
0%{opacity:.5;-webkit-transform:scale(0);transform:scale(0)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@-webkit-keyframes scalein-2 {
0%{opacity:.5;-webkit-transform:scale(0);transform:scale(0)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes bottomIn {
0%{-webkit-transform:translateY(3%);transform:translateY(3%);opacity:0}
100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}
}
@-webkit-keyframes bottomIn {
0%{-webkit-transform:translateY(3%);transform:translateY(3%);opacity:0}
100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}
}
@keyframes bottomin-1 {
0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:.2}
100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}
}
@-webkit-keyframes bottomin-1 {
0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:.2}
100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}
}
@keyframes scalein {
0%{-webkit-transform:scale(1.1);transform:scale(1.1);opacity:0}
100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
}
@-webkit-keyframes scalein {
0%{-webkit-transform:scale(1.1);transform:scale(1.1);opacity:0}
100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
}
@keyframes opacityin {
0%{opacity:0}
100%{opacity:1}
}
@-webkit-keyframes opacityin {
0%{opacity:0}
100%{opacity:1}
}
@keyframes arrowanim1 {
0%,100%,54%{-webkit-transform:translateX(0);transform:translateX(0)}
18%,36%{-webkit-transform:translateX(-4px);transform:translateX(-4px)}
27%{-webkit-transform:translateX(-1px);transform:translateX(-1px)}
}
@-webkit-keyframes arrowanim1 {
0%,100%,54%{-webkit-transform:translateX(0);transform:translateX(0)}
18%,36%{-webkit-transform:translateX(-4px);transform:translateX(-4px)}
27%{-webkit-transform:translateX(-1px);transform:translateX(-1px)}
}
@keyframes scale1 {
0%,10%,100%,50%,70%{-webkit-transform:scale(1);transform:scale(1)}
30%{-webkit-transform:scale(.9);transform:scale(.9)}
40%{-webkit-transform:scale(1.3);transform:scale(1.3)}
60%{-webkit-transform:scale(1.15);transform:scale(1.15)}
}
@-webkit-keyframes scale1 {
0%,10%,100%,50%,70%{-webkit-transform:scale(1);transform:scale(1)}
30%{-webkit-transform:scale(.9);transform:scale(.9)}
40%{-webkit-transform:scale(1.3);transform:scale(1.3)}
60%{-webkit-transform:scale(1.15);transform:scale(1.15)}
}
@keyframes wjsqmove {
0%{border-radius:0;filter:brightness(1);-webkit-filter:brightness(1);-webkit-transform:translateX(0);transform:translateX(0)}
100%,30%{border-radius:50%;filter:brightness(1.3);-webkit-filter:brightness(1.3);-webkit-transform:scale(1) translateX(-40px);transform:scale(1) translateX(-40px)}
}
@-webkit-keyframes wjsqmove {
0%{border-radius:0;filter:brightness(1);-webkit-filter:brightness(1);-webkit-transform:translateX(0);transform:translateX(0)}
100%,30%{border-radius:50%;filter:brightness(1.3);-webkit-filter:brightness(1.3);-webkit-transform:scale(1) translateX(-40px);transform:scale(1) translateX(-40px)}
}
@keyframes circlehovershow {
0%,25%{opacity:0;filter:brightness(2);-webkit-filter:brightness(2);-webkit-transform:scale(.1);transform:scale(.1)}
50%{opacity:1;filter:brightness(2);-webkit-filter:brightness(2);-webkit-transform:scale(.1);transform:scale(.1)}
55%{opacity:1;filter:brightness(1);-webkit-filter:brightness(1);-webkit-transform:scale(.15833);transform:scale(.15833)}
80%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@-webkit-keyframes circlehovershow {
0%,25%{opacity:0;filter:brightness(2);-webkit-filter:brightness(2);-webkit-transform:scale(.1);transform:scale(.1)}
50%{opacity:1;filter:brightness(2);-webkit-filter:brightness(2);-webkit-transform:scale(.1);transform:scale(.1)}
55%{opacity:1;filter:brightness(1);-webkit-filter:brightness(1);-webkit-transform:scale(.15833);transform:scale(.15833)}
80%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes animrotate {
0%{-webkit-transform:rotateZ(0);transform:rotateZ(0)}
100%{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg)}
}
@-webkit-keyframes animrotate{
0%{-webkit-transform:rotateZ(0);transform:rotateZ(0)}
100%{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg)}
}
@keyframes jump {
0%{-webkit-transform:translate(0);transform:translate(0)}
10%{-webkit-transform:translateY(5px) scaleX(1.2) scaleY(.8);transform:translateY(5px) scaleX(1.2) scaleY(.8)}
30%{-webkit-transform:translateY(-13px) scaleX(1) scaleY(1) rotateZ(5deg);transform:translateY(-13px) scaleX(1) scaleY(1) rotateZ(5deg)}
50%{-webkit-transform:translateY(0) scale(1) rotateZ(0);transform:translateY(0) scale(1) rotateZ(0)}
55%{-webkit-transform:translateY(0) scaleX(1.1) scaleY(.9) rotateZ(0);transform:translateY(0) scaleX(1.1) scaleY(.9) rotateZ(0)}
70%{-webkit-transform:translateY(-4px) scaleX(1) scaleY(1) rotateZ(-2deg);transform:translateY(-4px) scaleX(1) scaleY(1) rotateZ(-2deg)}
80%{-webkit-transform:translateY(0) scaleX(1) scaleY(1) rotateZ(0);transform:translateY(0) scaleX(1) scaleY(1) rotateZ(0)}
85%{-webkit-transform:translateY(0) scaleX(1.05) scaleY(.95) rotateZ(0);transform:translateY(0) scaleX(1.05) scaleY(.95) rotateZ(0)}
100%{-webkit-transform:translateY(0) scaleX(1) scaleY(1);transform:translateY(0) scaleX(1) scaleY(1)}
}
@-webkit-keyframes jump {
0%{-webkit-transform:translate(0);transform:translate(0)}
10%{-webkit-transform:translateY(5px) scaleX(1.2) scaleY(.8);transform:translateY(5px) scaleX(1.2) scaleY(.8)}
30%{-webkit-transform:translateY(-13px) scaleX(1) scaleY(1) rotateZ(5deg);transform:translateY(-13px) scaleX(1) scaleY(1) rotateZ(5deg)}
50%{-webkit-transform:translateY(0) scale(1) rotateZ(0);transform:translateY(0) scale(1) rotateZ(0)}
55%{-webkit-transform:translateY(0) scaleX(1.1) scaleY(.9) rotateZ(0);transform:translateY(0) scaleX(1.1) scaleY(.9) rotateZ(0)}
70%{-webkit-transform:translateY(-4px) scaleX(1) scaleY(1) rotateZ(-2deg);transform:translateY(-4px) scaleX(1) scaleY(1) rotateZ(-2deg)}
80%{-webkit-transform:translateY(0) scaleX(1) scaleY(1) rotateZ(0);transform:translateY(0) scaleX(1) scaleY(1) rotateZ(0)}
85%{-webkit-transform:translateY(0) scaleX(1.05) scaleY(.95) rotateZ(0);transform:translateY(0) scaleX(1.05) scaleY(.95) rotateZ(0)}
100%{-webkit-transform:translateY(0) scaleX(1) scaleY(1);transform:translateY(0) scaleX(1) scaleY(1)}
}
@-webkit-keyframes flipinY {
    0%{-webkit-transform:perspective(400px) rotateY(90deg);}
    40%{-webkit-transform:perspective(400px) rotateY(-10deg);}
    70%{-webkit-transform:perspective(400px) rotateY(10deg);}
    100%{-webkit-transform:perspective(400px) rotateY(0);}
}
@-moz-keyframes flipinY {
    0%{-moz-transform:perspective(400px) rotateY(90deg);}
    40%{-moz-transform:perspective(400px) rotateY(-10deg);}
    70%{-moz-transform:perspective(400px) rotateY(10deg);}
    100%{-moz-transform:perspective(400px) rotateY(0);}
}
@-ms-keyframes flipinY {
    0%{-ms-transform:perspective(400px) rotateY(90deg);}
    40%{-ms-transform:perspective(400px) rotateY(-10deg);}
    70%{-ms-transform:perspective(400px) rotateY(10deg);}
    100%{-ms-transform:perspective(400px) rotateY(0);}
}
@keyframes flipinY {
    0%{transform:perspective(400px) rotateY(90deg);}
    40%{transform:perspective(400px) rotateY(-10deg);}
    70%{transform:perspective(400px) rotateY(10deg);}
    100%{transform:perspective(400px) rotateY(0);}
}