@charset "utf-8";
@media screen and (min-width:1080px){
	html,body{  position: relative;}
	.box{ width:100%; overflow:hidden;}
	.n1{ width:1024px; margin:auto; padding-top:18px; margin-bottom:18px;}
	.n1 img{ width:50px; height:50px; margin-right:12px;}
	.n1 p{ color:#0080a7; height:50px; line-height:50px; font-size:18px;}
	.n1 li{margin-left:40px; float:left;}
	.n1 li a{ display:block;width:66px; height:50px;line-height:50px;text-align:center; font-size:16px;border-bottom:2px solid #fff;}
	.n1 li a:hover{ color:#0794fe; border-bottom:2px solid #0794fe;}
	.n1 .sy{ border-bottom:2px solid #0794fe;}
	.swiper-container {width: 100%;height:592px;}
	/*未选中分也标样式*/
	.swiper-pagination-bullet{ width:10px; height:10px;} 
	/*选中分也标样式*/
	.swiper-pagination-bullet-active{ background:#fff;}
    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
	.con{width:1024px; margin:auto; }
	.con h1{ text-align:center; font-size:32px; font-weight:normal; margin:60px 0;}
	.con li{ float:left; width:134px; height:174px; margin-right:162px;}
	.con .l1{ background:url(img/1.png) no-repeat center; background-size: 100%;}
	.con .l2{ background:url(img/2.png) no-repeat center; background-size: 100%;}
	.con .l3{ background:url(img/3.png) no-repeat center; background-size: 100%;}
	.con .l4{ background:url(img/4.png) no-repeat center; background-size: 100%;}
	.con .l1:hover{ background:url(img/1-1.png) no-repeat center; background-size: 100%;}
	.con .l2:hover{ background:url(img/2-2.png) no-repeat center; background-size: 100%;}
	.con .l3:hover{ background:url(img/3-3.png) no-repeat center; background-size: 100%;}
	.con .l4:hover{ background:url(img/4-4.png) no-repeat center; background-size: 100%;}
	
	.con-1{ width:815px;margin:auto;margin-top:37px;opacity:0; height:200px;}
	.con1-1{text-indent:36px;font-size:16px; line-height:30px;}
	@keyframes myfirst{
		0%   {opacity:0}
    	100%  {opacity:1}
	}
	@keyframes myfirst2{
		0%   {opacity:1}
    	100%  {opacity:0}
	}
	@keyframes myfirst3{
		0%   {transform: scale(1,1)}
    	100%  {transform: scale(1.1,1.1)}
	}
	@keyframes myfirst4{
		0%   {transform: scale(1.1,1.1)}
   		100%  {transform: scale(1,1)}
	}
	@keyframes myfirst5{
		0%   {transform:rotate(0deg);}
   		100%  {transform:rotate(360deg);}
	}
	
	
	.on{animation:myfirst 1s linear;animation-fill-mode:forwards;width:815px; height:200px;  margin:auto;margin-top:37px;}
	.end{animation:myfirst2 1s linear;animation-fill-mode:forwards;width:815px;  height:200px; margin:auto;margin-top:37px;}
	.liaojie{display:block; width:180px; height:45px; color:#fff; background:#78be20; text-align:center; line-height:45px; margin:auto; margin-bottom:60px; font-size:16px; margin-top:20px;}
	.con2{ width:100%; height:784px; background:url(img/con2.png) center no-repeat; background-size:100% 784px;}
	.con2-1{ width:1024px; margin:auto; padding-top:76px;height:708px;}
	.con2-1 h1{ font-size:30px; text-align:center; color:#fff; font-weight:normal; margin-bottom:24px;}
	.con2-1 p{ font-size:14px; text-align:center; color:#fff; margin-bottom:46px;}
	.con2 ul{ margin-bottom:52px;}
	.con2 li{float:left; width:320px; height:450px; border-radius:6px; background:#fff; margin-right:32px;}
	.con2 li img{border-radius:6px;}
	.con2 li p{ margin:23px 0; text-align:center; font-size:20px; color:#000;}
	.con2 li div{ width:270px; height:150px; margin:auto;font-size:14px; color:#000; text-indent:28px; line-height:20px;}
	#u2 img{width:100%; height:188px;}
	.on2{animation:myfirst3 0.5s linear;animation-fill-mode:forwards;}
	.end2{animation:myfirst4 0.5s linear;animation-fill-mode:forwards;}
	.con3{ width:1024px; margin:auto;}
	.con3 h1{ font-size:30px; margin-top:74px; text-align:center;font-weight:normal; margin-bottom:54px;}
	.con3 li{ float:left; width:254px; height:200px;}
	.con3 img{ width:100%; height:100%;}
	.on3{animation:myfirst5 1s linear;animation-fill-mode:forwards;}
	.con4{ width:100%; height:428px; padding-top:74px; background:url(img/con4.png) no-repeat center; background-size:100% 428px;}
	.con4 h1{ font-size:30px;text-align:center;font-weight:normal; margin-bottom:54px; color:#0080a7;}
	.con4 ul{ width:1024px; margin:auto;}
	.con4 li{width:400px; height:94px; background:url(img/dui.png) no-repeat left top; background-size:25px; font-size:12px; text-indent:30px; line-height:26px;}
	.con4 .ys{width:100%; height:2px; background:#dedede; margin-top:22px; margin-bottom:22px;}
	.con5{ width:100%; background:#198cb0; height:56px; text-align:center; padding-top:36px; color:#fff; font-size:14px;}

}

@media screen and (max-width:1080px){
	html,body{  position: relative;}
	.box{ width:100%;}
	.a1{ display:block; width:100%; border-bottom:0.02666rem solid #d5d5d5;}
	.n1 img{ width:1.4666rem; height:1.4666rem; margin-top:0.3733rem; margin-right:0.53333rem; margin-left:4.8rem;}
	.n1 p{ color:#0080a7;  font-size:0.42666rem; height:2.24rem; line-height:2.24rem;}
	.n1 ul{ width:100%;height:2.45333rem; float:left;}
	.n1 li{float:left; padding-top:0.64rem; margin-left:0.8rem;}
	.n1 li a{ display:block;width:3rem;height:1.2rem;line-height:1.2rem; text-align:center; font-size:0.48rem;border-bottom:0.1066rem solid #fff;}
	.n1 .sy{border-bottom:0.1066rem solid #0794fe;}
	
	.swiper-container {width: 100%;height:7rem;}
	.swiper-pagination-bullet{ width:.4rem; height:.4rem;} 
	
	.swiper-pagination-bullet-active{ background:#fff;}
    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

    
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
	
	.con{width:100%;}
	.con ul{ margin-bottom:1.0666rem;}
	.con h1{ text-align:center; font-size:0.96rem; font-weight:normal; margin:1.0666rem 0;}
	.con li{ float:left; width:4.21333rem; height:5.2rem; margin-right:1.04rem;}
	.con .l1{ background:url(img/1.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l2{ background:url(img/2.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l3{ background:url(img/3.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l4{ margin-right:0;background:url(img/4.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l1:hover{ background:url(img/1-1.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l2:hover{ background:url(img/2-2.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l3:hover{ background:url(img/3-3.png) no-repeat center; background-size:4.21333rem 5.2rem;}
	.con .l4:hover{ background:url(img/4-4.png) no-repeat center;background-size:4.21333rem 5.2rem;}
	.con-1{ width:100%;height:14.8rem;}
	.con1-1{font-size:0.8rem; line-height:1rem; text-indent:2em;text-align:justify; padding:0 .32rem;}

	@keyframes myfirst{
		0%   {opacity:0}
    	100%  {opacity:1}
	}
	@keyframes myfirst2{
		0%   {opacity:1}
    	100%  {opacity:0}
	}
	@keyframes myfirst3{
		0%   {transform: scale(1,1)}
    	100%  {transform: scale(1.1,1.1)}
	}
	@keyframes myfirst4{
		0%   {transform: scale(1.1,1.1)}
   		100%  {transform: scale(1,1)}
	}
	@keyframes myfirst5{
		0%   {transform:rotate(0deg);}
   		100%  {transform:rotate(360deg);}
	}
	.on{animation:myfirst 1s linear;animation-fill-mode:forwards;width:100%; height:14.8rem;}
	.end{animation:myfirst2 1s linear;animation-fill-mode:forwards;width:100%; height:14.8rem;}
	.liaojie{display:block; width:5.8666rem; height:1.6rem; color:#fff; background:#78be20; text-align:center; line-height:1.6rem; margin:auto; margin-top:1.066666rem;margin-bottom:1.066666rem; font-size:0.58666rem;}
	
	.con2{ width:100%;background:url(img/con2-1.png) center no-repeat; color:#fff; background-size:100% 100%; overflow:hidden; }
	.con2-1{ width:100%; padding-top:1.066rem; color:#fff;}
	.con2-1 h1{ font-size:0.96rem; text-align:center; font-weight:normal;margin-bottom:0.53333rem;}
	.con2-1 p{ font-size:0.53333rem; text-align:center; margin-bottom:1rem;}
	.con2 ul{ width:100%;}
	.con2 li{width:100%;border-radius:0.16rem; background:#fff;}
	.con2 li img{ width:100%;border-radius:0.16rem;}
	.con2 li p{text-align:center; font-size:0.9rem; color:#000; margin:0;}
	.con2 li div{font-size:0.9rem; color:#000; text-indent:2em; text-align:justify; padding:1rem 2rem;}
	
	.con3{ width:100%;}
	.con3 h1{ font-size:0.96rem; text-align:center; font-weight:normal;margin:0.53333rem 0;}
	.con3 li{ float:left; width:6.4rem; height:3.46666rem; margin-left:0.2674rem;}
	.con3 li img{ width:100%; height:100%;}
	.on3{animation:myfirst5 1s linear;animation-fill-mode:forwards;}
	
	.con4{ width:100%; height:18rem;background:url(img/con4.png) no-repeat center; background-size:100% 18rem; overflow:hidden;}
	.con4 h1{font-size:0.96rem; text-align:center; font-weight:normal;margin:0.53333rem 0;color:#0080a7;}
	.con4 ul{ margin:auto; padding:0 1rem;}
	.con4 li{font-size:0.7rem; text-align:justify;width:100%; margin-bottom:1rem; background:url(img/dui.png) no-repeat left top; background-size:1.2rem; text-indent:2em; line-height:1.1rem;}
	.con4 .ys{width:100%; height:0.1rem; background:#dedede;}
	.con5{ width:100%; background:#198cb0;text-align:center; padding:1rem 0; color:#fff; font-size:0.53333rem;}

}