.abtbox{ margin: 0 0 80px; display: flex; justify-content: space-between; align-items: center;}
.abtcon{ width: 50%;}
.abtcon h3{ font-size: 42px; margin: 0 0 25px; position: relative; color: #1a6b36;}
.abtcon h3::after{ display: block; position: absolute; width: 70px; height: 2px; background: #1a6b36; bottom: 0; left: 0; content: '';}
.abtcon p{ margin: 0 0 10px; font-size: 14px; line-height: 24px;}
.abtimg{ width: 45%; }
.abtimg img{ width: 100%; height: auto;}
.hqbj{ font-size: 42px; margin: 0 0 30px; text-align: center;}
.abtn{ margin-top: 35px;}
.abtnbox{ display: flex; justify-content: space-between;}
.abtnitem{ position: relative; padding: 0 0 0 46px; box-sizing: border-box; font-size: 30px; line-height: 50px; display: flex; flex-wrap: wrap;  }
.abtnitem::before{ font: 36px/60px iconfont; color: #1a6b36; position: absolute; top: 8px; left: 0; content: '';}
.abtnitem p{ font-size: 14px;  margin: 0; }
.abtnitem i{ font-style: normal; font-size: 14px; display: block; margin: 0 0 0 10px; line-height: 1.8; }
.cd i,.fa i{ font-size: 20px; line-height: 1; margin: 0;}

.ysjs{ display: flex; justify-content: space-between; border-radius: 30px; overflow: hidden; align-items: center; background: #f2f7f8; margin: 0 0 80px;}
.ysjs img{ width: 50%; height: auto;}
.ysjs p{ width: 50%; margin: 0; background: url(../img/qyysarw.png) no-repeat 0 50% #f2f7f8;  box-sizing: border-box; padding: 80px;}
.ysnr{ display: flex; margin: 0 0 80px; justify-content: space-between; flex-wrap: wrap; padding: 80px 0 0;}
.ysitem{ width: 30%; box-sizing: border-box; border-radius: 30px; padding: 100px 30px 30px; position: relative; background: #edf3ef;}
.ysitem:first-child{ background: #f1f6f3;}
.ysitem:first-child .ysit{ border-color: #f1f6f3;}
.ysitem:last-child{ background: #e3ede7;}
.ysitem:last-child .ysit{ border-color: #e3ede7;}

.ysitem ul li{ line-height: 1.5; margin: 0 0 20px; position: relative; padding: 0 0 0 10px; }
.ysitem ul li::before{ display: block; content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; background: #1a6b36; }
.ysit{ position: absolute; left: 50%; top: -75px; transform: translateX(-50%); width: 150px; height: 150px; border-radius: 50%; background: #fff; border: 8px solid #edf3ef; text-align: center; color: #1a6b36; box-sizing: border-box; padding: 28px 0 0;}
.ysit span{ display: block; font: 50px/1 iconfont; text-align: center;}
.ysit h3{ margin: 0; font-size: 20px;}
.qyysm{ display: none;}
.qyys{ display: block;}
.qywhbg{ padding: 120px 0 200px; background: url(../img/banxw.jpg) 50% 50%; margin: 0 0 80px; }
.whbox{ display: flex; justify-content: space-between;}
.whitem{ width: 30%; background: rgba(255, 255, 255, 0.5); padding: 50px 0; text-align: center; }
.whitem h3{ font-size: 24px; margin: 15px 0 15px;}
.whitem p{ font-size: 18px; margin: 0;}
.whicon{ font:60px/60px iconfont; color: #1a6b36;}

.zl{ }
.zl i{}
.cd::before{ content: "\e618"; }
.fa::before{ content: "\e611"; }
.zl::before{ content: "\e638"; }
.ry::before{ content: "\e6a0"; }
.abtt{ background: url(../img/abttbg.jpg) 0 50%; background-size: 100%;}
.abttbox{ position: relative; height: 855px}
.att{ background: #fff; border: 1px solid #1a6b36; border-radius: 30px; width: 385px; box-sizing: border-box; padding: 20px 20px; font-size: 24px; color: #1a6b36; position: absolute; z-index: 20;}
.tc{ width: 470px; line-height: 0; text-align: center; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.tc img{ width: 260px }
.tc p{ margin: 10px 0 0; line-height: 1.5}
.t1{ left: 170px; top: 140px;}
.t2{ right: 170px; top: 140px;}
.t3{ left: 0; top: 490px;}
.t4{ right: 0; top: 490px;}
.t5{ bottom: 100px; left: 50%; transform: translateX(-50%);}
#line1{ position: absolute; width: 180px; height: 100px; left: 50%; transform: translateX(-350px) rotate(40deg); top: 220px; border-bottom: 2px solid #1a6b36; z-index: 10; }
#line2{ position: absolute; width: 180px; height: 100px; right: 50%; transform: translateX(350px) rotate(320deg); top: 220px; border-bottom: 2px solid #1a6b36; z-index: 10; }
#line3{ position: absolute; width: 350px; height: 80px; left: 40%; transform: translateX(-400px) rotate(345deg); top: 450px; border-bottom: 2px solid #1a6b36; z-index: 10; }
#line4{ position: absolute; width: 350px; height: 80px; right: 40%; transform: translateX(400px) rotate(15deg); top: 450px; border-bottom: 2px solid #1a6b36; z-index: 10; }
#line5{ position: absolute; width: 2px; height: 110px; right: 50%; transform: translateX(50%); bottom: 250px; border-left: 2px solid #1a6b36; z-index: 10; }

.rybox{ margin: 0 0 80px;}

.cli{ border-radius: 30px; position: relative; margin: 0 0 60px 64px ; padding: 40px 0 40px 100px;}
.clicon{ position: absolute; left: -64px; top: 50%; transform: translateY(-50%); width: 128px; height: 128px; border-radius: 64px; background: #1a6b36; color: #fff; font:60px/128px iconfont; text-align: center;}
.clit{ font-size: 24px; color: #1a6b36; font-weight: bold;}
.clit span{ font-size: 18px; color: #999;}
.clic{ font-size: 30px;}
.sm{ background: url(../img/clibg1.png) no-repeat top right #f2f2f2;}
.yj{ background: url(../img/clibg2.png) no-repeat top right #f2f2f2;}
.jz{ background: url(../img/clibg3.png) no-repeat top right #f2f2f2;}

.hbox{ border-radius: 30px; margin: 0 0 20px; padding: 30px 0; display: flex; background: #f0f5f1; align-items: center;}
.hibg1{ background: url(../img/hibg1.jpg) no-repeat 0 0 #f0f5f1; background-size: 100%;}
.hibg2{ background: url(../img/hibg2.jpg) no-repeat 0 0 #f0f5f1; background-size: 100%;}
.hibg3{ background: url(../img/hibg3.jpg) no-repeat 0 0 #f0f5f1; background-size: 100%;}
.hibg2 .ht{ order: 2;}
.hibg2 .hc{ order: 1;}
.ht{ width: 400px; text-align: center; }
.hticon{ color: #fff; font: 50px/60px iconfont; text-align: center; }
.ht h3{ font-size: 50px; margin: 20px 0; color: #fff;}
.hc{ margin: 0 0 80px; }
.bd li{ width: 220px; padding: 40px; background: #f2f7f8; margin: 0 30px; line-height: 0; }
.bd li img{ width: 100%; height: auto;}
.hd{ display: flex; justify-content: center; align-items: center; margin: 20px 0 0;}
.hd a{ display: block; box-sizing: border-box; border: 1px solid #999; width: 48px; height: 48px; border-radius: 24px; cursor: pointer; color: #1a6b36; text-align: center; font: 20px/48px iconfont;}
.hd a:hover{ background: #1a6b36; color: #fff; border: none; text-decoration: none;}
.hd ul{ display: flex; justify-content: center; margin: 0 20px; align-items: center;}
.hd ul li{ width: 60px; height: 1px; overflow: hidden; background: #999;}
.hd ul li.on{ height: 3px; background: #1a6b36;}

#ryjx img{ width: 100%; height: auto;}
.abtqyys{ display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 0 0 80px;}
.aysi{ width: 32%; position: relative; overflow: hidden; line-height: 0;}
.aysi::after{ display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.4); content: ""; z-index: 3; transition: all .5s ease;}
.aysi img{ width: 100%; height: auto;  transform:scale(1); transition: all .5s ease;}
.aysi:hover img{ transform:scale(1.1); transition: all .5s ease; }
.aysi:hover::after{ background: rgba(0,0,0,.2); content: ""; transition: all .5s ease;}
.aysic{ position: absolute; width: 100%; text-align: center; top: 50%; color: #fff; transform: translateY(-50%); z-index: 4;}
.aysic div{ font: 40px/1 iconfont; color: #fff;}
.aysic h3{ font-size: 18px; margin: 12px 0 0;}
.aysic p{ font-size: 16px; margin: 0;}

@media only screen and (max-width: 1440px){


}

@media only screen and (max-width: 1024px){
  .ctbt div h2{ font-size: 40px;}
  .ctbt div p{ font-size: 20px;}
  .abtbox,.rybox{ margin: 0 0 50px;}

  .abtnitem{}
  .abtnitem::before{ padding:0 14px 0 0}
  .abtnitem i{ left: 165px; font-size: 20px;}
  .zl i{ left: 185px;}
  .abttbox{ height: 600px;}
  .att{ font-size: 14px; width: 220px; padding: 10px; border-radius: 15px;}
  .tc{ width: 280px;}
  .tc img{ width: 200px}
  .t1{ top: 80px; left: 120px;}
  .t2{ top: 80px; right: 120px;}
  .t3,.t4{ top: 320px;}
  .t5{ bottom: 80px;}


  #line1{ height: 80px; transform: translateX(-260px) rotate(40deg); top: 130px; }
  #line2{ height: 80px; transform: translateX(260px) rotate(320deg); top: 130px; }
  #line3{ width: 140px; height: 80px; transform: translateX(-280px) rotate(340deg); top: 280px;}
  #line4{ width: 140px; height: 80px; transform: translateX(280px) rotate(20deg); top: 280px;}
  #line5{ bottom: 150px;}
} 



@media only screen and (max-width: 736px){
  .abtqyys{ flex-wrap: wrap;}
  .aysi{ width: 100%; margin: 0 0 30px;}
  .abtcon{ padding: 0; width: 100%;}
  .abtimg{ width: 100%;}
  .abtn{ height: auto; padding: 20px 0 0; margin: 0 0 20px;}
  .abtnbox{ flex-wrap: wrap;}
  .abtnitem{ width: 48%;  margin: 0 0 20px;}
  .abtnitem i{ }
  .abtnitem::before{ padding: 0 10px 0 0;}
  .abttbox{ padding: 20px 0; height: auto;}
  .att{ position: relative; top: 0; left: 0; margin: 0 0 20px; width: 100%; font-size: 18px; border-radius: 20px;}
  .tc img{ width: 200px }
  .tc,.t5{ transform: none;}
  #line1,#line2,#line3,#line4{ display: none;}
  #line5{ height: 90%; top: 20px; bottom: auto;}

  .cli{ border-radius: 30px; position: relative; margin: 80px 0 60px 0 ; padding: 60px 25px 25px;}
  .clicon{ position: absolute; left: 50%; top: -49px; transform: translateX(-50%); width: 98px; height: 98px; border-radius: 49px; font:55px/98px iconfont; text-align: center;}
  .clit{ font-size: 24px; color: #1a6b36; margin: 0 0 10px;}
  .clit span{ font-size: 16px; color: #999;}
  .clic{ font-size: 30px; line-height: 1.2;}
  .sm{ background: url(../img/clibg1m.png) no-repeat bottom right #f2f2f2;}
  .yj{ background: url(../img/clibg2m.png) no-repeat bottom right #f2f2f2;}
  .jz{ background: url(../img/clibg3m.png) no-repeat bottom right #f2f2f2;}

  .ht,.hc{ width: 100%; overflow: hidden; }
  .hc{ margin: 0 0 30px;}
  .ht{ display: flex; justify-content: center; margin: 0 0 20px;}
  .ht h3{ font-size: 30px; margin: 0;}
  .hibg1,.hibg2{ background-size: auto 100%;}
  .hd{ margin: 20px 20px 0;}
  .hd a{}
  .hibg2 .ht{ order: 1;}
  .hibg2 .hc{ order: 2;}
  .hbox{ flex-wrap: wrap;}
  .hd ul { flex: 1;}
  .hd ul li{ width: 10%; }
  .hibg2{ background-position: top right;}
  .hticon{ margin: 0 10px 0 0;}

  .ysitem{ width: 100%; margin: 0 0 100px;}
  .ysjs{ flex-wrap: wrap;}
  .ysjs img{ width: 100%;}
  .ysjs p{ width: 100%; padding: 40px 20px 20px; background: none; position: relative; background: url(../img/qyysarwm.png) no-repeat 50% 0; background-size: 35px; font-size: 18px; line-height: 1.8;}
  .abtnitem p{ line-height: 1.3;}
  .ysitem ul li{ font-size: 18px;}
  .ysjs{ margin: 0 0 20px;}
  .ysnr{ margin: 0;}
  .qyysm{ display: block;}
  .qyys{ display: none;}
  
  .abtcon h3{ font-weight: normal; font-size: 32px; text-align: center; margin: 0 0 10px;}
  .abtcon h3::after{ display: none}
  .abtbox{ flex-wrap: wrap;}

  .hqbj{ font-size: 32px; margin: 0 0 10px;}
  .qywhbg{ padding: 50px 0 20px; margin: 0 0 30px; background-size: cover;}
  .whbox{ flex-wrap: wrap; padding: 0 20px;}
  .whitem{ width: 100%; margin: 0 0 30px;}

}