@charset "utf-8";
.w1720{width: 89.5833333%;margin: 0 auto;}
.xz{transform: rotate(180deg);}
.yybj{position: relative;}
.yybj:after{position: absolute;content: ""; top: 0;left: 0; width: 100%;height: 100%;background-image: linear-gradient(rgba(255,255,255,.1), rgba(0,0,0,.8));}
.md{position: relative;top: -200px;}
.pc{display: block;}
.phone{display: none;}
.mdm{position: relative;top: -150px;}


.main .titn {
    margin-bottom: 15px;
    font-weight: bold;
    font-size: 36px;
    line-height: 30px;
}
.i-pro{position: relative;height: 800px;overflow: hidden; margin-top: 77px;}
.i-pro .top{position: absolute; left:5.21%;top: 94px; color: #fff;z-index: 9;}
.i-pro .bottom{height: 100%;}
.i-pro .bottom .bimg{position: absolute;top: 0;left: 0;z-index: -1;transition: 1s linear 6s;transform: scale(1.1); max-width: none; }
.i-pro .bottom .xx{position: relative; top: 40.75%;color: #fff;}
.i-pro .bottom .xx .tit{margin-bottom: 42px; max-height: 48px; font-size: 30px;line-height: 1em;font-weight: bold;overflow: hidden;}
.i-pro .bottom .xx .sum{margin-bottom: 123px; width:60%; overflow: hidden;}
.i-pro .bottom .xx .sum p{font-size: 16px; line-height: 30px;}
.i-pro .bottom .xx .more{color: #fff;}
.i-pro .bottom .xx .more:hover{color: #00a2e9;}
.i-pro .bottom .page-b{display: none;}
.i-pro .page{position: absolute;top: 0;right: 0;box-sizing: border-box;display: flex;flex-flow: column;height: 100%;  z-index: 9;overflow: hidden;}
.i-pro .page li{ position: relative; height: 20%;width: 480px; text-align:center; align-items: center; box-sizing: border-box;border-bottom: 1px solid rgba(255,255,255,.4);border-left:1px solid rgba(255,255,255,.4);background: rgba(0 ,162,233,.1);color: #fff;transition: all .5s;overflow: hidden;cursor: pointer;}
.i-pro .page li .r{color: #fff;}
.i-pro .page li .r .tit{margin-bottom: 10px; font-size: 24px;line-height:161px;}
.i-pro .page li .r .sum{font-size: 18px;line-height: 1em;}
.i-pro .page li .left{opacity: .8;transition: all .5s;}
.i-pro .page li.on {border: none; background: #00368c; }
.i-pro .page li.on .left{opacity: 1;}
.i-pro .page li:hover {background: #00368c; }
.i-pro .page li:hover .left{opacity: 1;}
.i-pro .swiper-slide-active .bimg{/*animation:fd 6s infinite;-webkit-animation:fd 6s infinite;*/transition:6s linear;transform:scale(1);}
.i-pro .page li .l img{display: block;width: 50px;}
.i-pro .page li .border {display: none; position: absolute;background: #fff;transition: all 6s;}
.i-pro .page li .b-l{left: 0; animation:ipro1 6s infinite;-webkit-animation:ipro1 6s infinite; width: 1px;height: 100%; }
.i-pro .page li .b-t{top:0; animation:ipro2 6s infinite;-webkit-animation:ipro2 6s infinite; width: 100%;height: 1px; }
.i-pro .page li .b-r{right: 0; nimation:ipro3 6s infinite;-webkit-animation:ipro3 6s infinite; width: 1px;height: 100%; }
.i-pro .page li .b-b{bottom: 0; animation:ipro4 6s infinite;-webkit-animation:ipro4 6s infinite; width: 100%;height: 1px; }
.i-pro .page li.on .border{display: block;}

@keyframes ipro1{from {bottom:-100%;}to {bottom:0; }}
@-webkit-keyframes ipro1  {from {bottom:-100%;}to {bottom:0; }}

@keyframes ipro2{from {left: -100%;}to {left:0; }}
@-webkit-keyframes ipro2  {from {left: -100%;}to {left:0; }}

@keyframes ipro3{from {top:-100%;}to {top:0; }}
@-webkit-keyframes ipro3  {from {top:-100%;}to {top:0; }}

@keyframes ipro4{from {right: -100%;}to {right: 0;}}
@-webkit-keyframes ipro4  {from {right: -100%;}to {right: 0;}}

.i-ab{/*padding: 77px 0 74px;*/position: relative;padding: 100px 0;}
.i-ab .xx .titn{color: #000;}
.i-ab .xx .sumn{color: #000;}
.i-ab .more{position: absolute;bottom: 110px;left: 0;}
.i-ab .xx{position: relative;width: 50%; padding-top: 30px;color: #333;}
.i-ab .xx .sumn{margin-bottom: 114px;}
.i-ab .xx .tit{margin-bottom: 20px; font-size: 30px;line-height: 1em;}
.i-ab .xx .ftit{margin-bottom: 70px; font-size: 24px;line-height: 1em;}
.i-ab .xx .sum{margin-bottom: 156px; font-size: 16px;line-height: 36px;}
.i-ab .bimg{position: absolute;left: 0px;bottom: 220px;}
.q-zong{position: relative; width: 376px;height: 376px;}
.q-zong .wrapper{position: absolute;top: 0; width:50%;height: 100%;overflow: hidden; }
.q-zong .l{left: 0}
.q-zong .r{right: 0;}
.q-zong .wrapper .yuan{position: absolute; border:1px solid transparent;-webkit-transform: rotate(-135deg); width: 376px;height: 376px;box-sizing: border-box;border-radius: 50%; }
.q-zong .wrapper .yuan-l{left: 0; border-bottom:1px solid #808080;border-left:1px solid #808080;}
.q-zong .wrapper .yuan-r{right: 0; border-top:1px solid #808080;border-right:1px solid #808080;}
.q-zong .xxm{padding-top: 65px;text-align: center;color: #333;}
.q-zong .xxm .mimg{height: 110px;}
.q-zong .xxm .mimg.oth{padding-top: 10px;box-sizing: border-box;}
.q-zong .xxm .img{display: block;margin:0 auto;}
.q-zong .xxm .num{margin-bottom: 30px; font-size: 60px;line-height: 42px; font-weight: bold;}
.q-zong .xxm span{}
.q-zong .xxm .sum{padding: 0 40px; font-size: 16px;line-height: 32px;}
.i-ab .qiu{width: 752px;margin-right: 60px;}
.i-ab .qiu .bottom {margin-top: -50px; display: flex;}
.i-ab .qiu .one{margin: 0 auto;}
.i-ab .qiu-h{display: none;}

.i-fz{position: relative;}
.i-fz .main{position: absolute;left: 0;top: 67.2237697%;z-index: 22;}
.i-fz .main .titn,.i-fz .main .sumn{color: #000;}
.i-fz .i-fzm{padding-bottom: 200px;}
.i-fz .i-fzm .bimg{position: relative; margin-bottom: 64px;}
.i-fz .i-fzm .bbimg{display: block;width: 100%;height: auto;}
.i-fz .i-fzm .xx{padding-left: 645px;width: 800px;color: #333;}
.i-fz .i-fzm .xx .tit{margin-bottom: 25px; font-size: 30px;line-height: 1em;}
.i-fz .i-fzm .xx .sum{font-size: 16px;line-height: 30px;}
.i-fz .i-fzm .page{position: absolute;bottom: 30.362177%;right: 0;z-index: 9;}
#swiper6 .swiper-pagination{bottom:148px;right: 0;}
#swiper6 .swiper-pagination ul{width: 50px; color: #333;line-height: 15px;}
#swiper6 .swiper-pagination ul li{position: absolute;left: 0;right: 0;bottom: 0; font-size: 24px;font-weight: bold;line-height: 18px;}
#swiper6 .swiper-pagination .total{position: relative;margin-left: 50px; font-size: 16px; padding-left:5px;}  
#swiper6 .swiper-pagination .total:before{position: absolute;left: 0;bottom: 0; color: #333;font-weight: bold; content: "/"}




@media (max-width: 1900px) {
  .i-ab .xx{width: 45%;}

  .gl-warp1 .bimg{width: 35.26%;}
  .gl-warp1 .main .r{max-width: 58.33333%;}

  .m12{display: flex;align-items: flex-end;}

}





@media (max-width: 1200px) {
 
  .i-pro .page li{width: 100%; padding-left: 10%; padding-right: 10%;}
  .i-pro .bottom .xx .sum{width: 400px;max-height: 90px;}
	.i-pro .page li .r .tit{ font-size: 20px;}
 

  .pro-warp2 .main{flex-wrap: wrap;}
  .pro-warp2 .main .mn:first-child{width: 100%;margin-bottom: 20px;}
  .pro-warp2 .main .mn{width: 46%;}
}

@media (max-width: 940px) {

  .i-pro .page{top: auto;bottom: 0; width: 100%;flex-flow: row;flex-wrap: wrap;height: 300px;}
  .i-pro .page li{float: left;width: 50%;height: 100px;display: flex; justify-content: center;align-items: center;padding: 0;}
  .i-pro .bottom .xx{top: 30%;}
  .i-pro .bottom .xx .sum{width: 80%;margin-bottom: 50px;}
 

}


@media (max-width: 768px) {
 
  .i-pro .page li .left .iimg{width: 50px;height: auto;}
  .i-pro .page li .r{width: 170px;}
  .i-pro .page li .r .tit{margin-bottom: 6px; font-size: 24px;line-height: 32px;}


  .pro .titn{font-size: 32px;line-height: 48px;}
  .pro-warp1 .title{margin-bottom: 50px;}
  .pro-warp1 .sum p{line-height: 30px;}
  .pro .pro-t{margin-bottom: 40px;}
  .pro .pro-t,.pro-warp2 .main .mn .tit{font-size: 24px;}
  .pro-warp1 .main li{width: calc(50% - 20px);}
  .pro-warp1 .main{padding: 0 10px;}
  .pro-warp2 .main .mn{width: 100%;margin-bottom: 20px;}
  .pro-warp3{background-size:cover; padding: 50px 0;}
  .pro-warp3 .main{padding-top: 0;}
  .pro-warp4 .main .img1{margin-right: 0!important}
	.main .titn{ font-size: 24px;}
	.i-pro .bottom .xx{top: 20%;}
	.i-pro .bottom .xx .tit{ font-size: 20px;}
	.i-pro .page li .r .tit{ font-size: 20px;}
}

@media (max-width: 600px) {
  
 
  .i-pro .bottom .xx .tit{font-size: 20px;}
  .i-pro .page-h{display: none;}
  .i-pro .bottom .page-b{position: absolute; left: 50%;transform: translateX(-50%);
    bottom: 150px; display: block;width: 94px;z-index: 2;}


  .pro-warp3 .main .mn li{width: 46%;margin: 0 2% 15px;}

 
}