@charset "utf-8";
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img {margin: 0; padding: 0; } 
fieldset, img {border: none; }
img{vertical-align:middle;}
ul, ol {list-style: none; }
input {padding-top: 0; padding-bottom: 0; font-family: "SimSun", "宋体"; }
select, input {vertical-align: middle; }
select, input, textarea {font-size: 12px; margin: 0; }
textarea {resize: none; }
table {border-collapse: collapse; }
body {font: 21px '微软雅黑'; }
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,h1,h2,h3 ,h4 ,h5 ,h6{font-weight:normal; }
i,em{font-style: normal;}
a {color: #fff; text-decoration: none; }
.fl{ float:left;}
.fr{ float:right;}
.fix:after{ clear:both; content:"."; height:0px; display:block; overflow:hidden; visibility:hidden; }
.fix{*zoom:1;}
.mr0{ margin-right:0!important}
body {
    color: #fff;
}
.wrap{
	max-width: 1680px;
	min-width: 1200px;
	margin:0 auto;
}
.wrap .minkuan{ width:1200px; margin:0 auto;}
.wrap .re{ position: relative;}
.wrap .te{ text-align: center;}
.wrap .fl{ float: left;}
.wrap .fr{ float: right;}
.wrap .ov{ overflow: hidden;}
.wrap .pat30{ padding-top: 30px;}
.bglanse{ background:#cce1ff;}

.wrap .shuiguangz-kv{ width:100%; height:832px; background: url(../images/kv.jpg) no-repeat top center;}
.wrap .shuiguangz-kv .minkuan{ height:832px;}
.wrap .shuiguangz-kv .kv-1{ position: absolute; top: 32%; left:0;}
.wrap .shuiguangz-kv .kv-a{ position: absolute; bottom: -95px; left: 50%; margin-left: -107px;animation: flipInX 3s .2s ease both infinite;
    -webkit-animation: flipInX 5s .2s ease both infinite;
    -moz-animation: flipInX 5s .2s ease both infinite;}

.part1{ padding-top: 65px;}
.wrap .shuiguangz-ti{ font-size: 52px; color:#005982; font-weight: bold; padding-top: 60px; line-height: 52px;}
.wrap .shuiguangz-ti p{ font-size: 38px; color:#000; font-weight: normal;}
.part1 .p1-1{ position: absolute; width:212px; height:212px; border-radius: 50%; font-size: 32px; line-height: 42px; color:#000; padding-top: 68px; box-sizing: border-box;animation: bounce 3s .2s ease both infinite;
    -webkit-animation: bounce 3s .2s ease both infinite;
    -moz-animation: bounce 3s .2s ease both infinite;}
.part1 .p1-1.pat{ padding-top: 85px;}
.part1 .p1-1.ls{ background:rgba(80, 175, 226, 0.3); border:1px solid #53b0e2; animation-delay: 0.3s;}
.part1 .p1-1.fs{ background:rgba(242, 156, 159, 0.3); border:1px solid #f29c9f;}
.part1 .p1-1.hs{ background:rgba(250, 205, 137, 0.3); border:1px solid #facd89;animation-delay: 0.5s;}
.part1 .minkuan{ margin-top: 45px;}
.wrap .shuiguangz-aa{ display:inline-block; padding:0 60px; box-shadow: 0px 5px 0px #005982; background:#50afe2; font-size: 32px; border-radius: 60px; margin:30px 0 45px; line-height: 70px;/*animation: shake 10s .2s ease both infinite;
    -webkit-animation: shake 10s .2s ease both infinite;
    -moz-animation: shake 10s .2s ease both infinite;*/}
.wrap .shuiguangz-aa span{ color:#f6ff00;}
.wrap .shuiguangz-aa img{ margin-top: -5px; margin-left:10px;}

.part2{ width:100%; height:1123px; background: url(../images/p2-bg.png) no-repeat top center;}
.part2 .p2-pp{ font-size: 26px; line-height: 35px; color:#000; padding:35px 65px;}
.part2 .p2-pp span{ color:#005982; font-weight: bold;}

.part3 ul{ margin-top: 55px;}
.part3 ul li{ float: left; width:588px; height:163px; background:#61a4db; border-radius: 165px 0 0 165px; position: relative; padding-left: 178px; box-sizing: border-box; margin-bottom: 15px;}
.part3 ul li:nth-of-type(2n){ width:602px; margin-left: 10px;}
.part3 ul li img{ position: absolute; left: 0; top: 0;}
.part3 ul li h2{ font-size: 34px; padding-top: 30px;}
.part3 ul li h2 span{ color:#fff600;}
.part3 ul li p{  font-size: 20px; line-height: 25px; padding:5px 10px 0 0;}

.part4{ background:#91c8e0;}
.part4 .p4-1{ width:918px; height:237px; background:url(../images/p4-2.png) no-repeat; margin:0 auto; padding:138px 0 0 215px; box-sizing: border-box; color:#000; font-size: 20px; line-height: 30px;}
.part4 .p4-1 span{ color:#ff7200;}

.part5 .minkuan{ padding:75px 0 0 85px; box-sizing: border-box; margin-bottom: 55px;}
.part5 .p5-1{ position: absolute; top: 3%; left:55%;}
.part5 .p5-2{ top: 40%; left:63%;}
.part5 .p5-3{ top: 76%; left:55%;}

.npbox{ width:1200px; margin:0 auto; padding-top:30px; overflow:hidden}
.npbox .list{ width:390px; display:inline; margin-right:15px; background:#91c8e0}
.npbox .list .pic{ float:left; width:166px}
.npbox .list .txt{ float:right; width:224px}

.npbox .list .txt .t1{ font-size:35px; line-height:1; padding:33px 0 20px 0; color:#005982; text-align:center}
.npbox .list .txt .t2{ margin:0 auto;  width:205px; height:38px; border-radius:38px; background:#005982; font-size:20px; line-height:38px;color:#fff; text-align:center}
.npbox .list .txt .t3{ padding-top:20px; color:#333; margin:0 auto; width:205px; height:100px;font-size:20px; line-height:30px;}
.npbox .list .txt .t3 span{ font-weight:700; color:#005982}

.npbox .list .txt .btnc{ text-align:center; font-size:0; padding-top:10px;}
.npbox .list .txt .btnc a{ padding:0 25px; display: inline-block; height: 40px; line-height: 40px; color: #fff;font-size:20px;  border-radius: 30px;
	background:#50afe2;
	animation: bounce 3s .2s ease both infinite;
	-webkit-animation: bounce 3s .2s ease both infinite;
	-moz-animation: bounce 3s .2s ease both infinite;
	box-shadow:0 5px 3px #005982;
}

/* 本例子css */
    .part6 .slideBox{ width:1200px; height:706px; position:relative; margin:45px auto 0; padding-left: 147px; box-sizing: border-box;  }
    .part6 .slideBox .hd{   position:absolute; left:0; top:0; z-index:1; }
    .part6 .slideBox .hd ul{  zoom:1;  }
    .part6 .slideBox .hd ul li{ text-align:center;  cursor:pointer; position: relative; }
    .part6 .slideBox .hd ul li .heigai{ width:147px; height:226px; border-radius: 20px 0 0 20px; position: absolute; top: 0; left: 0; background:rgba(0,0,0,0.3);}
    .part6 .slideBox .hd ul li.on .heigai{ display:none; }
    .part6 .slideBox .bd{ position:relative; height:100%; z-index:0;   }
    .part6 .slideBox .bd li{ zoom:1; vertical-align:middle; position: relative; }

.wrap .shuiguangz-aa2{ background:#0db982; margin-left:45px; box-shadow: 0px 5px 0px #006a48;}

.part7 ul{ padding:35px 20px;}
.part7 ul li{ float: left; margin:0 2px 10px;}

/* 本例子css */
    .part8 .slideBox{ width:100%; height:675px; position:relative; margin-top: 45px;  }
    .part8 .slideBox .bd{ position:relative; height:100%; z-index:0;   }
    .part8 .slideBox .bd li{ zoom:1; vertical-align:middle; position: relative; }

    /* 下面是前/后按钮代码，如果不需要删除即可 */
    .part8 .slideBox .prev,
    .part8 .slideBox .next{ position:absolute; left:0; top:50%; margin-top:-25px; display:block; width:132px; height:131px; background:url(../images/left.png) no-repeat;  }
    .part8 .slideBox .next{ left:auto; right:0; background:url(../images/right.png) no-repeat; }


.part8-tihuan{ max-width: 1680px; min-width: 1200px; margin:0 auto; overflow: hidden; background:#c8e3ef;}
.part8-tihuan .te{ text-align: center;}
.part8-tihuan .shuiguangz-ti{ font-size: 52px;color: #005982;font-weight: bold;padding-top: 60px;line-height: 52px;}
.part8-tihuan .slideBox{ width:1140px;  position:relative; margin:55px auto; padding-top: 65px;   }
.part8-tihuan .slideBox .hd{  position:absolute; top:0; left:0; z-index:1; }
.part8-tihuan .slideBox .hd ul{ zoom:1; float:left;  }
.part8-tihuan .slideBox .hd ul li{ float:left; width:185px; line-height: 65px; text-align:center; background:#005982; cursor:pointer; font-size: 32px; color:#fff; border-radius: 10px 10px 0 0; }
.part8-tihuan .slideBox .hd ul li.on{ background:#fff; color:#005982; }
.part8-tihuan .slideBox .hd ul li:not(:last-of-type){ margin-right: 6px;}
.part8-tihuan .slideBox .bd{ position:relative; height:100%; z-index:0;background:#fff; padding-top: 25px;   }
.part8-tihuan .slideBox .bd li{ zoom:1; vertical-align:middle; position: relative; }
.part8-tihuan .slideBox .bd img{ width:1077px;  display:block; margin:0 auto;  }
.part8-tihuan .shuiguangz-aa{ display:inline-block; padding:0 60px; box-shadow: 0px 5px 0px #005982; background:#50afe2; font-size: 32px; border-radius: 60px; margin:30px 0 45px; line-height: 70px;}



.part9 ul{ margin:35px 0;}
.part9 ul li{ float: left; width:50%; background:#61a4db; padding:25px 18px; box-sizing: border-box;}
.part9 ul li h2{ font-size: 34px; font-weight: bold; padding:42px 0 10px;}
.part9 ul li p{ font-size: 22px; line-height: 30px; width:225px; padding-top: 10px; border-top: 1px solid #fff;}
.part9 ul li.ls{ background:#0db982;}
.part9 ul li:last-of-type h2{ padding:10px 0 15px; line-height: 35px;}


.part10 .minkuan{ height:412px; margin:35px auto;}
.part10 a{ position: absolute; width:200px; height:200px; border-radius: 50%; background:#61a4db; font-size: 24px; line-height: 30px; padding-top: 70px; box-sizing: border-box;animation: bounce 3s .2s ease both infinite;
    -webkit-animation: bounce 3s .2s ease both infinite;
    -moz-animation: bounce 3s .2s ease both infinite;}
.part10 a:nth-of-type(1){ top: 65px; left: 45px;padding-top: 58px; animation-delay: 0.3s;}
.part10 a:nth-of-type(2){ top: 0; left: 370px;}
.part10 a:nth-of-type(3){ top: 60px; right: 388px;animation-delay: 0.3s;}
.part10 a:nth-of-type(4){ top: 35px; right: 35px;}
.part10 a:nth-of-type(5){ bottom: 0; left: 280px;animation-delay: 0.3s;}
.part10 a:nth-of-type(6){ bottom: 0; right: 198px;}
.part10 a.ls{ background:#0db982;}
.part10 a .dilin{ display:inline-block;}
.part10 a img{ margin: -35px 0 0 10px;}

.part11 .p9_bd .bd{padding:20px 106px;}
.part11 .p9_bd li{width:290px;padding: 0 20px; }
.part11 .arrow{
  position: absolute;
  width: 46px;
  height:109px;
  background:url("../images/arrow1.png") no-repeat center;
  z-index: 8;
}
.part11 .prev{left: -20px;}
.part11 .next{right:-20px;-webkit-transform: rotateY(180deg);
  -moz-transform:  rotateY(180deg);
  -ms-transform:  rotateY(180deg);
  -o-transform:  rotateY(180deg);
  transform:  rotateY(180deg);}
.part11 .arrow{top: 54px;}
.part11 .prev{left: 0;}
.part11 .next{right: 0;}


@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 3deg);
    transform: rotate3d(0, 0, 1, 3deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 3deg);
    transform: rotate3d(0, 0, 1, 3deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.fadeInUp {
   -webkit-animation:fadeInUp 2s ease-in-out alternate forwards;
}
.tada {
   -webkit-animation:tada 2s ease-in-out alternate forwards;
}
@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
        transform: translateY(20px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -10px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -3px, 0);
    transform: translate3d(0, -3px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-2px,0);
    transform: translate3d(0,-2px,0);
  }
}

@keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -10px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -3px, 0);
    transform: translate3d(0, -3px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-2px,0);
    transform: translate3d(0,-2px,0);
  }
}
@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}


