
@charset "utf-8";
/*================重置样式部分===============*/
html,
body,
div,
span,
object,
iframe,
table,
tr,
th,
td,
em,
img,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
dl,
dt,
dd,
ul,
li,
ol,
form,
label {
  border: 0 none;
  font-family: inherit;
  font-style: inherit;
  margin: 0;
  padding: 0;
}
body {
  color: #000;
  font-family: 微软雅黑;
  font-size: 22px;
}
input,
select {
  font-size: 12px;
  line-height: 16px;
}
img {
  border: none;
}
a {
  text-decoration: none;
}
ul,
li,ol {
  list-style-type: none;
}
em,i{ font-style:normal}
.p_hide{ overflow:hidden}
.p_block{display: block}
.in-block{ display: inline-block}
.clearfix{ clear: both}
.tc{ text-align: center}
.font_no{ font-weight: normal}
.patb50{ padding: 50px 0}
.pat30{ padding: 30px 0 0}
.patb30{ padding: 30px 0}
.patb20{ padding: 20px 0}
.patb10{ padding: 10px 0}
.paLR20{ padding: 0 20px}
.pa20{ padding: 20px}
.pa10{ padding: 10px}
.mr20{ margin-right: 20px}
.line30{line-height: 30px}
.line35{line-height: 35px}
.line40{line-height: 40px}
.p_pr{ position: relative}
.p_fl{ float: left}
.p_fr{ float: right}

.font20{ font-size: 20px}
.font22{ font-size: 22px}
.font30{ font-size: 30px}
.font34{ font-size: 34px}

.ver_m{ vertical-align: middle}

.wi{ width: 1200px}
.auto{ margin: 0 auto}

.col_green{ color: #206951}
.col_yel{ color: #ffe765}
.col_gray{ color: #605c5c}
.col_white{ color: #fff}
.col_org{ color: #ff8542}

.bg_pic1{ background: url("../images/p1_bg.jpg") repeat-y center}
.bg_pic2{background: url("../images/line.png") no-repeat top center}
.bg_pic3{background: url("../images/bg.png") repeat-x top center}
.bg_pic4{background: url("../images/bg_pic1.jpg") repeat top center}
.bg_pic5{background: url("../images/bg_pic2.jpg") repeat top center}
.bg_pic6{background: url("../images/bg1.png") repeat-x top center}

.ti h3{ font-weight: 600; font-size: 48px}
.ti i{ display: block; width: 50%; height: 1px; background: #206951}
.ti i:after{ content: ""; display: block; width:62px; height: 5px; background: #206951; position: absolute; bottom: -2px; left: 0; right: 0; margin: 0 auto}

h3.ti1 {
  background: url("../images/ti1.png") no-repeat top center;
  padding-top: 0.1rem;
}

.btn a{ display:inline-block;box-shadow: 0px 3px 0px 0px #e4a537; background: #ffda65; border-radius: 50px; color: #41340d; padding: 0 50px; height: 70px; line-height: 70px; font-size: 26px}

.line{ width: 100%; height:16px; position: absolute; bottom: 0; left: 0 }

.banner{ width: 100%; height: 812px; background: url("../images/banner.jpg") no-repeat top center}
.banner .wi{ height: 812px}
.banner a{ display: block; width: 132px; height: 132px;position:absolute;bottom:104px;right:41px}
.banner .sh {
  display: block;  width: 0;  height: 59px;  background: url("../images/sh.png") no-repeat;  position: absolute;  left: 344px;  top: 213px;
  animation: borderX 1.5s infinite; -webkit-animation:borderX 1.5s infinite;
}
.banner .db {  position: absolute;  right:0;  top: 131px;  animation: flipInY 5s;-webkit-animation: flipInY 5s;  }
.dot {  animation: sploosh 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);  }
.dot2 {  animation: sploosh2 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);  }

.dd{ position: absolute; left: 314px;  top: 258px;}
.dot,.dot2{  height: 44px;  width: 44px;  border-radius: 100%;  position: absolute;  z-index: 10;  animation-iteration-count:infinite;  background: transparent;  }

.p1 .btn{ position: absolute; left: 0; top:900px; right: 0; margin: 0 auto}

.p2{ padding: 30px 0 50px}
.p2 ul{ padding: 150px 0 100px; overflow: hidden}
.p2 ul li{ width: 153px; float: left; background: #d3f2e8; font-size: 16px; padding: 93px 20px 20px; position: relative; margin-right: 8px;  }
.p2 ul li:after{ content: "";  width: 0;  height: 0;position: absolute; left: 0; bottom: -47px}
.p2 ul li.i2{ background: #55bbae}
.p2 ul li.i1:after{border-top: 47px solid #d3f2e8;border-left: 193px solid transparent;}
.p2 ul li.i2:after{ border-top: 47px solid #55bbae;border-right: 193px solid transparent;}
.p2 ul li.mr0{ margin-right: 0}
.p2 ul li h3{ font-size: 24px; text-align: center}
.p2 ul li img{ border-radius: 50%; position: absolute; top:-109px; left: 0; border: 7px solid #fff}
.p2 ul li p{ line-height: 25px}
.p2 ul li:nth-child(even) h3{ color: #ffe765}
.p2 ul li:nth-child(even) p{ color: #fff}
.p2 .line,.p5 .line,.p7 .line,.p10 .line{ height: 14px}

.p3 .con{  padding: 40px 0 20px 65px; font-size: 18px; z-index: 2}
.p3 .con{ width: 700px}
.p3 .con ul li{ float: left; width: 237px; height: 300px; margin-right: 61px}
.p3 .con ul li p{ padding: 5px 10px}
.p3 .con ul li h3{color: #fff; text-align: center;  text-shadow:0 0 0.5em #55bbae, -0 -0 0.5em #55bbae; font-size: 26px; line-height: 60px }
.p3 .btn{ z-index: 2}
.p3 .btn1{ background: #e45584;box-shadow: 0px 3px 0px 0px #bd1c51; color: #fff}
.p3 img.mote{ position: absolute; right: -150px; bottom:0;z-index: 1}

.p4 ul{ padding: 60px 0 0}
.p4 ul li{ width: 268px; margin-right: 30px; float: left; position: relative; margin-bottom: 20px; font-size: 22px }
.p4 ul li.mr0{ margin-right: 0}
.p4 ul li p{ padding:10px}
.p4 ul li i{ position: absolute; top:-30px; border-radius: 50%; font-size: 36px; color: #fff; text-align: center;
  left: -10px;font-size: 28px; width: 64px; height: 64px; line-height: 64px; background: #55bbae;
  -webkit-animation: float 2s infinite;
  animation: float 2s infinite;
}
.p4 ul li img{ border: 3px solid #55bbae}


.p6 ul li{ width: 25%; float: left; position: relative; text-align: center}
.p6 ul li img{ width: 100%; vertical-align: middle}
.p6 ul li span{ display: none; background: rgba(0,0,0,0.6); position: absolute; left: 0; top:0; color: #fff; padding: 0 10%}
.p6 ul li span h3{  color: #55bbae}
.p6 ul li span .iner{ padding: 40% 0}
.p6 ul li.active span{ display: block; -webkit-animation: bounceY 0.9s linear;
  -moz-animation: bounceY 0.5s linear;
  -ms-animation: bounceY 0.5s linear;
  animation: bounceY 0.5s linear;
}
.p6 ul .t{ width: 25%; position: absolute; right: 0; bottom:30px}
.p6 ul .t img{ width: 100%}


.p7 .p7_tabs{ width: 1200px; overflow: hidden; height: 530px}
.p7 .tabs ul{ position: absolute; left: 0; top: 0}
.p7 .tabs ul li{ width:1200px;float: left; text-align: center}
.p7 .tabs .prev,.p7 .tabs .next{ color: #fff; position: absolute; z-index: 9; top: 0;bottom:0; margin: auto 0; cursor: pointer; height: 67px; width: 40px;}
.p7 .tabs .prev{ left: 50px;  background: url("../images/l_ico.png") no-repeat}
.p7 .tabs .next{ right:0px;  background: url("../images/r_ico.png") no-repeat}

.p8 .con_text{ width: 526px; position: absolute; right: 0; top:70px}
.p8 .con_text h3{ font-size: 94px; font-weight: 500}
.p8 .con_text p em{ display: inline-block;  color: #fff; line-height: 30px; background: #206951; padding: 0 10px; margin-right: 10px}


.p9 ul{ width: 1120px; margin:0 auto; overflow: hidden}
.p9 ul li{ width:362px; float: left; border: 1px solid #ddd; position: relative; margin-right: 12px; color: #fff }
.p9 ul li a{ display: block; color: #fff}
.p9 ul li.mr0{ margin-right: 0}
.p9 ul li h3{ font-size: 42px;text-shadow: 0 0 0.5em #5a9ec3, -0 -0 0.5em #5a9ec3; padding-bottom: 10px}
.p9 ul li span{ display: block; width: 80%; padding: 10%; position: absolute;; bottom: 0; left: 0;
  background:#5a9ec3;  line-height: 35px }
.p9 ul li:nth-child(1) span{background: -webkit-linear-gradient(top, rgba(90, 158,195, 0) 0%, #5a9ec3 50%, #5a9ec3 100%)}
.p9 ul li:nth-child(2) span{background: -webkit-linear-gradient(top, rgba(86, 192,159, 0) 0%, #56c0a9 50%, #56c0a9 100%);}
.p9 ul li:nth-child(3) span{background: -webkit-linear-gradient(top, rgba(201, 132,91, 0) 0%, #c9845b 50%, #c9845b 100%);}
.p9 ul li:nth-child(2) h3{ text-shadow: 0 0 0.5em #56c0a9, -0 -0 0.5em #56c0a9}
.p9 ul li:nth-child(3) h3{ text-shadow: 0 0 0.5em #c9845b, -0 -0 0.5em #c9845b}


.p10 ul{ width: 80%; margin: 0 auto; font-size: 24px}
.p10 ul li{ width: 30%; float: left; line-height: 75px; background: #e5864e; margin: 3% 3% 3% 0; position: relative}
.p10 ul li i{ display: block; width: 51px; height: 41px; padding: 5px 0; color: #fff; background: #fa3245; border-radius: 50%; font-size: 14px; line-height:20px;
  position: absolute;; right: -10px; top: -20px;-webkit-animation: float 2s infinite;  animation: float 2s infinite;
}
.p10 ul li a{ color: #fff}
.p10 ul li:nth-child(1){background: #e5864e}
.p10 ul li:nth-child(2){background: #80d59e}
.p10 ul li:nth-child(3){background: #55bbae}
.p10 ul li:nth-child(4){background: #ff5a8e}
.p10 ul li:nth-child(5){background: #3d97cc}
.p10 ul li:nth-child(6){background: #ffda65}
.p10 ul li:nth-child(6) a{ color: #000}

.p11 ul li{ width: 312px; display: inline-block; margin-right: 36px}
.p11 ul li.mr0{ margin-right: 0}
.p11 ul li a{ color: #000}



@-webkit-keyframes float {
  0% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
  50% {  -webkit-transform: translateY(1em);  transform: translateY(1em);  }
  100% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
}

@keyframes float {
  0% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
  50% {  -webkit-transform: translateY(0.5em);  transform: translateY(0.5em);  }
  100% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
}

