@font-face {
    font-family: 'AlibabaPuHui';
    src: url(../fonts/Alibaba-PuHuiTi-Medium.ttf);
}
*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    font-family: 'AlibabaPuHui';
}
.head-container{
    width: 1500px;
    margin: auto;
}
.container{
    width: 1400px;
    margin: auto;
}
.header{
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}
.head-top{
    border-bottom: 1px solid rgba(255,255,255,.3);
}
.head-tops{
    display: none !important;
}
.header-pro>.head-container>.head-top{
    display: none !important;
}
.head-conts .head-tops{
    display: block !important;
}
.head-cont{
    position: relative;
}
.head-cont ul{
    width: 60%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.head-cont ul li{
    font-size: 16px;
    position: relative;
}
.head-cont>ul>li:hover>a{
    color: #2A62AE !important;
}
.head-cont ul li a{
    color: #fff;
    display: block;
    line-height: 72px;
}
.lang .lan{
    position: relative;
}
.head-cont .lang{
    position: absolute;
    right: 0;
    top: 20px;
}
.lang .lan:hover ul{
    display: block;
}
.lang div{
    float: left;
}
.lang div ul{
    width: 210% !important;
    position: absolute;
    left: -5%;
    top: 100%;
    display: none;
    padding-top: 20px;
    border-radius: 5px;
}
.header-pro .lang div ul{
    padding-top: 60px;
}
.lang div ul li{
    width: 100%;
    display: block;
    text-align: center;
    background-color: #fff;
}
.lang div ul li a{
    font-size: 15px;
    line-height: 52px;
    color: #666666;
}
.lan ul li:hover a{
    color: #2962AC !important;
}
.search form{
    position: relative;
}
.search form .form-group{
    width: 100%;
    margin-top: -7px;
    display: none;
}
.search form .form-group input{
    width: 100%;
    box-sizing: border-box;
    outline: none;
    background-color: #fff;
    border: none;
    padding: 10px;
    border-radius: 25px;
    border: 1px solid transparent;
}
.header-pro .search form input{
    border: 1px solid #666666;
}
.search form i{
    margin-left: 0;
    color: #666666;
    position: absolute;
    right: 10px;
    top: 0px;
}
.act form .form-group{
    display: block;
}
.act form i{
    color: #666666 !important;
    margin-left: 0 !important;
}
.head-cont .lang i{
    font-size: 20px;
    color: #fff;
    margin-left: 30px;
}
.lan i{
    display: block;
    animation: dong 3s infinite linear;
}
@keyframes dong {
    0%{
        transform: rotate(0);
    }
    50%{
        transform: rotate(180deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
.head-top img{
    width: 90px;
    display: block;
    margin: 15px auto;
}
.head-tops img{
    margin: auto;
}
.head-cont ul li:nth-child(2) .xiala{
    width: 150% !important;
    left: -25% !important;
}
.head-cont ul li:hover .xiala{
    display: block !important;
    height: 100%;
    transition-property:all; /* 触发transition的属性值，默认all */
    transition-duration:.3s; /* transition执行时间 */
    transition-timing-function:linear; /* 时间变化函数 */
}
.xiala{
    position: absolute;
    width: 300% !important;
    height: 0;
    /* background-color: #fff; */
    left: -100%;
    border-radius: 5px;
    display: none !important;
    top: 100%;
    transition: .3s ease-in;
}
.xiala li:first-child{
    margin-top: 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.xiala li:last-child{
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.xiala li{
    width: 100%;
    background-color: #fff;
}
.xiala li a{
    color: #666666 !important;
    text-align: center;
    line-height: 52px !important;
}
.xiala li:hover a{
    color: #2A62AE !important;
}
.banner{
    height: 100vh;
    position: relative;
    overflow: hidden;
}
.shang .da{
    width: 100%;
}
.da .swiper-slide{
    overflow: hidden;
    position: relative;
}
.da .banner-p{
    position: absolute;
    top: 40%;
    left: 20%;
}
.banner-p h2{
    font-size: 70px;
    color: #fff;
}
.banner-p p{
    font-size: 18px;
    line-height: 32px;
    color: #fff;
    margin: 30px 0;
}
.banner-p>span{
    font-size: 14px;
    color: #fff;
    background-color: #6EBA44;
    border-radius: 35px;
    display: inline-block;
    border: 1px solid transparent;
    transition: .3s ease-in;
}
.banner-p>span:hover{
    background-color: transparent;
    border: 1px solid #fff;
}
.banner-p>span a{
    color: #fff;
    padding: 20px 40px;
    display: block;
}
.ban-share{
    margin-top: 40px;
    overflow: hidden;
}
.ban-share p{
    float: left;
    margin-right: 30px;
}
.ban-share p a{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}
.ban-share p:hover i{
    color: #2962AC;
}
.ban-share p:hover span{
    color: #2962AC;
}
.ban-share p i{
    font-size: 24px;
    color: #fff;
    transition: .3s ease-in;
}
.ban-share p span{
    display: inline-block;
    font-size: 14px;
    color: #fff;
    margin-left: 10px;
}
.play{
    width: 72px;
    position: absolute;
    right: 20%;
    bottom: 20%;
    transition: .3s ease-in;
}
.play:hover img{
    transform: scale(1.1);
}
.play img{
    width: 100%;
    height: 72px;
    display: block;
    transition: .3s ease-in;
}
.play p{
    font-size: 16px;
    color: #fff;
    margin-top: 10px;
    text-align: center;
}
.video-play{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.4);
    z-index: 9998;
    display: none;
}
.video-play-cang{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.4);
    z-index: 9998;
}
.video-play-all{
    width: 60%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 9999;
}
.video-play-all video{
    width: 100%;
    height: auto;
}
.tan-close{
    position: absolute;
    color: #fff;
    font-size: 50px;
    font-weight: bold;
    top: -50px;
    right: -50px;
    cursor: pointer;
}
.shang{
    height: 100%;
    overflow: hidden;
}
.shang .swiper{
    height: 100%;
    overflow: hidden;
    position: relative;
}
.shang .swiper .swiper-slide>img{
    width: 100%;
    display: block;
    margin-left: -6%;
    height: 106vh;
    width: 112%;
    display: block;
    animation: dong1 11s infinite linear;
}
@keyframes dong1{
    0%{
        transform: translateX(0);
    }
    50%{
        transform: translateX(5%);
    }
    100%{
        transform: translate(0%);
    }
}
.banner-xia{
    width: 1500px;
    margin: auto;
    background-color: #fff;
    height: auto;
    position: absolute;
    bottom: 0;
    overflow: hidden;
    z-index: 998;
    left: 50%;
    transform: translate(-50%,0);
    box-shadow: 0 0 5px 0 #eee;
}
.banner-xia::after{
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 155px;
    top: 0;
    background-color: #E5E5E6;
}
.xia .swiper{
    overflow: hidden;
    position: relative;
}
.xia{
    width: 180px !important;
    height: 80px;
    margin: 10px;
    float: right;
}
.xia .swiper .swiper-slide img{
    width: 100%;
    height: 80px;
    object-fit: cover;
}
.da-you::after,.da-zuo::after{
    font-size: 20px !important;
}
.da-you{
    top: unset !important;
    bottom: 20px;
    right: unset !important;
    left: 90px !important;
    color: #C9CACA !important;
}
.da-zuo{
    top: unset !important;
    bottom: 20px;
    color: #C9CACA !important;
    left: 30px !important;
}
.da-page{
    width: unset !important;
    left: unset !important;
    right: 20%;
    bottom: unset !important;
    top: 50%;
    transform: translate(0,-50%);
}
.da-page .swiper-pagination-bullet{
  width: 36px !important;
  height: 36px !important;
    display: block;
    background: unset !important;
    margin: 0px 0 !important;
    position: relative;
}
.da-page .swiper-pagination-bullet .yuan{
    width: 4px !important;
    height: 4px !important;
    background: #fff !important;
    border-radius: 50%;
    display: block;
    margin: 0px 0 !important;
    display: none;
}
.da-page .number{
  font-size: 16px;
  line-height: 36px;
  color: #fff;
  font-weight: bold;
  position: relative;
}
.da-page .swiper-pagination-bullet::after{
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.da-page .swiper-pagination-bullet:hover{
  opacity: 1;
}
.da-page .swiper-pagination-bullet:hover .number{
  display: block;
  opacity: 1;
}
.da-page .swiper-pagination-bullet:hover::after{
  display: none;
}
.da-page .swiper-pagination-bullet .number{
  display: none;
  transition: .3s ease-in;
}

.da-page .swiper-pagination-bullet-active .number{
  display: block;
}
.da-page .swiper-pagination-bullet-active::after{
  display: none;
}
.about{
    padding: 100px 0;
}
.about-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.about-left{
    width: 55%;
}
.about-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.about-left p{
    font-size: 16px;
    line-height: 26px;
    color: #999999;
    margin-top: 30px;
}
.about-left span{
    display: inline-block;
    font-size: 14px;
    color: #999999;
    border: 1px solid #999999;
    border-radius: 35px;
    margin-top: 30px;
}
.about-left span:hover {
    background-color: #2962AC;
    color: #fff;
}
.about-left span:hover a{
    color: #fff;
}
.about-left span a{
    padding: 20px 40px;
    color: #999999;
    display: block;
}
.about-right{
    width: 30%;
}
.about-right:hover img{
    transform: scale(1.1);
}
.about-right-img{
    overflow: hidden;
}
.about-right img{
    width: 100%;
    display: block;
    transition: .3s ease-in;
}
.about-right-img video{
    width: 100%;
    display: block;
}
.product{
    padding: 100px 0;
    background-color: #F7F8F8;
}
.product-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.product-left{
    width: 20%;
}
.product-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.product-left h3{
    font-size: 24px;
    color: #E5E5E6;
    margin-top: 20px;
}
.product-left p{
    width: 25px;
    height: 4px;
    background-color: #E5E5E6;
    margin-top: 30px;
}
.product-right{
    width: 75%;
    position: relative;
}
.product-right .pro-shang{
    overflow: hidden;
}
.pro-shang .swiper-slide .pro-shang-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-shang-all:hover img{
    transform: scale(1.1);
}
.pro-shang-left{
    width: 60%;
    background-color: #EFEFEF;
    overflow: hidden;
}
.pro-shang-left img{
    width: 40%;
    display: block;
    margin: 30px auto;
    transition: .3s ease-in;
}
.pro-shang-right{
    width: 40%;
    background-color: #fff;
    padding: 40px;
    box-sizing: border-box;
}
.pro-shang-right-top{
    border-bottom: 1px solid #EBEDF2;
}
.pro-shang-right-top h2{
    font-size: 22px;
    color: #333333;
    font-weight: normal;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
     -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.pro-shang-right-top h3{
    font-size: 14px;
    color: #666666;
    font-weight: normal;
    margin: 10px 0;
}
.pro-shang-right-cont{
    margin-top: 20px;
    max-height: 150px;
    overflow: hidden;
}
.pro-shang-right-cont p{
    font-size: 13px;
    line-height: 24px;
    color: #666666;
}
.product-right .pro-xia{
    width: 60%;
    overflow: hidden;
    position: relative;
}
.pro-xia .swiper-slide p{
    font-size: 14px;
    margin: 20px 0;
    color: #666666;
    text-align: center;
    cursor: pointer;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
     -webkit-box-orient:vertical;
    -webkit-line-clamp:1;
}
.pro-xia .swiper-slide-thumb-active{
    color: #2A62AE;
    border-bottom: 1px solid #2A62AE;
}
.pro-xia .swiper-slide-thumb-active p{
    color: #2A62AE;
}
.pro-zy{
    width: 40%;
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #fff;
    height: 59px;
}
.pro-shang-next::after,.pro-shang-prev::after{
    color: #555555;
    font-size: 20px !important;
}
.pro-zy .pro-shang-next{
    right: 30px !important;
}
.pro-zy .pro-shang-prev{
    left: 30px !important;
}
.jishu{
    padding: 100px 0;
}
.jishu-all{
    position: relative;
}
.jishu-top{}
.jishu-top h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.jishu-top h3{
    font-size: 24px;
    color: #E5E5E6;
    margin-top: 20px;
}
.jishu-top p{
    width: 25px;
    height: 4px;
    background-color: #E5E5E6;
    margin-top: 30px;
}
.jishu-cont{
    margin-top: 40px;
}
.js-swiper{
    overflow: hidden;
}
.js-prev::after,.js-next::after{
    font-size: 20px !important;
    color: #555555;
}
.js-prev{
    left: unset !important;
    right: 60px !important;
    top: 20px !important;
}
.js-next{
    right: 20px !important;
    top: 20px !important;
}
.js-content{}
.js-content:hover li{
    background-color: #2962AC;
}
.js-content:hover i{
    color: #fff;
}
.js-content li{
    width: 105px;
    height: 105px;
    border: 1px solid #C9CACA;
    border-radius: 50%;
    position: relative;
    transition: .3s ease-in;
}
.js-content i{
    font-size: 50px;
    color: #C9CACA;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: .3s ease-in;
}
.js-content h2{
    font-size: 18px;
    color: #333333;
    font-weight: normal;
    margin: 30px 0;
}
.js-content p{
    font-size: 14px;
    line-height: 24px;
    color: #666666;
}
.youshi{
    background: url(../img/youshi.png) no-repeat center;
    background-size: cover;
}
.youshi-all{
    padding: 60px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.youshi-left{
    width: 10%;
    writing-mode:tb-rl
}
.youshi-left h2{
    font-size: 24px;
    color: #fff;
    font-weight: normal;
}
.youshi-left h3{
    font-size: 24px;
    color: #fff;
    margin-right: 10px;
}
.youshi-right{
    width: 80%;
}
.youshi-right-cont{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.youshi-right-cont li{
    width: 19.8%;
    border-right: 1px solid rgba(255,255,255,.2);
}
.youshi-right-cont li:last-child{
    border-right: none;
}
.youshi-right-cont li i{
    font-size: 50px;
    color: #fff;
    display: block;
    text-align: center;
}
.youshi-right-cont li p{
    font-size: 14px;
    color: #fff;
    margin-top: 10px;
    text-align: center;
}
.earth{
    padding: 100px 0;
}
.earth-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}
.earth-left{
    width: 20%;
}
.earth-left-top{}
.earth-left-top h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.earth-left-top h3{
    font-size: 24px;
    color: #E5E5E6;
    margin-top: 20px;
}
.earth-left-top p{
    width: 25px;
    height: 4px;
    background-color: #E5E5E6;
    margin-top: 30px;
}
.earth-left>p{
    font-size: 14px;
    line-height: 24px;
    color: #666666;
}
.earth-left-bottom{
    margin-top: 40px;
}
.earth-left-bottom h2 p{
    font-size: 47px;
    color: #2A62AE;
    display: inline-block;
}
.earth-left-bottom h2 i{
    font-size: 16px;
    color: #666666;
    display: inline-block;
    animation: dong 5s infinite linear;
}
.earth-left-bottom p{
    font-size: 13px;
    color: #666666;
}
.earth-right{
    width: 75%;
    position: relative;
}
.earth-right img{
    width: 100%;
    height: auto;
    position: relative;
}
.map-icon{
    position: absolute;
    /* overflow: hidden; */
}
.map-icon p{
    font-size: 16px;
    line-height: 32px;
    color: #666666;
    text-align: right;
}
.map-yuan{}
.map-yuan span{
    width: 1px;
    height: 200px;
    display: block;
    background-color: #2A62AE;
    margin-left: auto;
    margin-right: 5px;
}
.map-yuan .circle{
    width: 10px;
    height: 10px;
    background-color: #2A62AE;
    border-radius: 50%;
    position: relative;
    float: right;
}
.map-yuan .circle::before{
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: rgba(42,98,147,.5);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    animation-name: circle;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}
@keyframes circle{
    0% {
        transform:translate(-50%,-50%) scale(1);
    }
50% {
        transform:translate(-50%,-50%) scale(1.3);
    }
    100% {
        transform:translate(-50%,-50%) scale(1);
    }
}
.map-yuan .circle::after{
    content: "";
    display: block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: rgba(42,98,147,.4);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    animation-name: circle;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}
.map1{
    top: -2%;
    left: 6%;
}
.map2{
    top: -20%;
    left: 20%;
}
.map3{
    top: -10%;
    left: 33%;
}
.map4{
    top: 17%;
    right: 7%;
}
.news{
    padding: 60px 0;
}
.news-all{}
.news-top{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.news-top-left{}
.news-top-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.news-top-left h3{
    font-size: 24px;
    color: #E5E5E6;
    margin-top: 20px;
}
.news-top-left p{
    width: 25px;
    height: 4px;
    background-color: #E5E5E6;
    margin-top: 30px;
}
.news-top-right{}
.news-top-right i{
    font-size: 30px;
    color: #555555;
    transform: rotate(-90deg);
    display: block;
}
.news-cont{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.news-p{
    width: 32%;
    box-shadow: 0 0 5px 0 #eee;
    border: 1px solid transparent;
    transition: .3s ease-in;
}
.news-p:hover h2{
    color: #2962AC;
}
.news-p:hover{
    border: 1px solid #2A62AE;
}
.news-p:hover img{
    transform: scale(1.1);
}
.news-p-img{
    overflow: hidden;
}
.news-p-img img{
    width: 100%;
    display: block;
    transition: .3s ease-in;
}
.news-p span{
    font-size: 14px;
    color: #666666;
    display: block;
    margin-top: 20px;
    padding: 0 20px;
}
.news-p h2{
    font-size: 20px;
    line-height: 30px;
    color: #333333;
    font-weight: normal;
    margin-top: 10px;
    padding: 0 20px;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
     -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.news-p p{
    font-size: 14px;
    color: #666666;
    margin-top: 30px;
    padding: 0 20px;
    margin-bottom: 30px;
}
.footer{
    background-color: #EFEFEF;
    position: relative;
}
.top{
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translate(-50%,0);
}
.top img{
    display: block;
    margin: auto;
}
.top p{
    font-size: 16px;
    color: #666666;
    text-align: center;
    margin-top: 10px;
}
.foot-top{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 100px;
    padding-bottom: 40px;
}
.foot-top li{
    width: 32%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}
.foot-top li i{
    font-size: 30px;
    color: #666666;
}
.foot-top li p{
    width: calc(100% - 50px);
    font-size: 16px;
    color: #666666;
    margin-left: 10px;
}
.foot-top li p a{
    color: #666666;
}
.foot-top li form{
    width: 100%;
    position: relative;
}
.foot-top  li form .form-group{}
.foot-top  li form .form-group input{
    width: 100%;
    box-sizing: border-box;
    outline: none;
    padding: 10px;
    border: none;
    border-bottom: 1px solid #C9CACA;
    background-color: transparent;
    font-size: 16px;
}
.foot-top  li form .form-group input::placeholder{
    font-size: 16px;
    color: #999999;
}
.foot-top li form .btn{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    right: 0;
    top: 10px;
    box-sizing: border-box;
    outline: none;
    border: none;
}
.foot-top li form .btn span{
    font-size: 16px;
    color: #666666;
}
.foot-top li form .btn i{
    font-size: 20px;
    color: #2A62AE;
    margin-left: 10px;
}
.logo-di{
    display: block;
}
.foot-bottom{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 30px 0;
}
.foot-bottom-left{}
.foot-bottom-left p{
    font-size: 14px;
    line-height: 26px;
    color: #999999;
}
.foot-bottom-right a{
    display: inline-block;
    position: relative;
}
.foot-bottom-right i{
    font-size: 26px;
    margin-left: 10px;
    color: #999999;
}
.foot-bottom-right .fen-1{

}
.fen-1:hover .ewm{
    display: block;
}
.fen-1 .ewm{
    position: absolute;
    top: -130px;
    left: -40px;
    display: none;
}
.foot-di{
    border-top: 1px solid #C9CACA;
}
.foot-di-all{}
.foot-di-left{}
.foot-di-left ul{
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.foot-di-left ul li{
    /* width: 16.666666%; */
    font-size: 16px;
    color: #666666;
    /* text-align: center; */
}
.foot-di-left ul li a{
    color: #666666;
    display: block;
    padding: 50px 0;
}
.foot-shang{
    position: fixed;
    right: 22%;
    bottom: 50px;
    font-size: 16px;
    color: #666666;
    z-index: 9999;
    cursor: pointer;
}
.header-pro{
    background-color: #fff;
    box-shadow: 0 0 5px 0 #cbcbcb;
}
.header-pro .head-top img{
    margin: auto;
    width: 70px;
}
.header-pro .head-cont{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.header-pro .head-cont ul{
    width: 50%;
}
.header-pro .head-cont ul li{}
.header-pro .head-cont ul li a{
    color: #666666;
}
.header-pro .head-cont ul .active a{
    color: #2962AC;
}
.header-pro .head-cont .lang{
    top: 25px;
}
.header-pro .head-cont .lang i{
    color: #666666;
}
.pro-banner{
    padding-top: 72px;
}
.pro-swiper{
    overflow: hidden;
    position: relative;
}
.pro-swiper .swiper-slide{
    position: relative;
    overflow: hidden;
}
.pro-swiper .swiper-slide img{
    width: 100%;
    display: block;
    margin-left: -6%;
    width: 112%;
    display: block;
    animation: dong1 11s infinite linear;
}
@keyframes dong1{
    0%{
        transform: translateX(0);
    }
    50%{
        transform: translateX(5%);
    }
    100%{
        transform: translate(0%);
    }
}
.pro-swiper .pro-cont{
    position: absolute;
    left: 20%;
    top: 30%;
}
.pro-swiper .pro-cont p{
    font-size: 24px;
    color: #fff;
}
.pro-swiper .pro-cont h2{
    font-size: 70px;
    color: #fff;
    margin: 10px 0;
}
.pro-page{
    width: unset !important;
    left: unset !important;
    right: 20%;
    bottom: 50% !important;
}
.pro-page .swiper-pagination-bullet{
  width: 36px !important;
  height: 36px !important;
    display: block;
    background: unset !important;
    margin: 0px 0 !important;
    position: relative;
    opacity: 1 !important;
}
.pro-page .swiper-pagination-bullet .yuan{
    width: 4px !important;
    height: 4px !important;
    background: #fff !important;
    border-radius: 50%;
    display: block;
    margin: 0px 0 !important;
    display: none;
}
.pro-page .number{
  font-size: 16px;
  line-height: 36px;
  color: #fff;
  font-weight: bold;
  position: relative;
}
.pro-page .swiper-pagination-bullet::after{
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.pro-page .swiper-pagination-bullet:hover{
  opacity: 1;
}
.pro-page .swiper-pagination-bullet:hover .number{
  display: block;
  opacity: 1;
}
.pro-page .swiper-pagination-bullet:hover::after{
  display: none;
}
.pro-page .swiper-pagination-bullet .number{
  display: none;
  transition: .3s ease-in;
}
.pro-page .swiper-pagination-bullet-active .number{
  display: block;
}
.pro-page .swiper-pagination-bullet-active::after{
  display: none;
}
.pro{
    padding: 60px 0;
}
.pro-all{}
.pro-content{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-cool{
    width: 48%;
    box-shadow: 0 0 5px 0 #d1d1d1;
    padding: 30px;
    box-sizing: border-box;
    border-radius: 5px;
    margin-bottom: 40px;
}
.pro-cool a{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-cool:hover img{
    transform: scale(1.1);
}
.pro-cool:hover span{
    background-color: #2962AC;
    color: #fff;
    border: 1px solid transparent;
}
.pro-cool .pro-left{
    width: 45%;
}
.pro-left h2{
    font-size: 22px;
    color: #333333;
}
.pro-left h3{
    font-size: 15px;
    color: #999999;
    font-weight: normal;
    margin-top: 10px;
}
.pro-left .pro-p{
    margin: 30px 0;
    overflow: hidden;
}
.pro-left .pro-p p{
    font-size: 14px;
    line-height: 28px;
    color: #666666;
    position: relative;
    padding-left: 15px;
}
.pro-left .pro-p p::before{
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background-color: #2962AC;
    border-radius: 50%;
    position: absolute;
    top: 13px;
    left: 0;
}
.pro-left span{
    font-size: 14px;
    color: #C8C9C9;
    display: inline-block;
    border: 1px solid #C8C9C9;
    /* background-color: #C8C9C9; */
    border-radius: 25px;
    padding: 10px 20px;
    transition: .3s ease-in;
}
.pro-left span i{
    margin-left: 5px;
}
.pro-cool .pro-right{
    width: 50%;
    overflow: hidden;
}
.pro-right img{
    width: 80%;
    display: block;
    margin: auto;
    transition: .3s ease-in;
}
.pro-detail{
    padding-top: 72px;
}
.pro-detail-top{
    background: url(../img/pro-detail-bj.png) no-repeat center;
    background-size: cover;
    padding-top: 100px;
    padding-bottom: 200px;
}
.pro-detail-top-all{}
.pro-detail-top-cont{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.pro-detail-top-left{
    width: 50%;
}
.pro-detail-img{
    overflow: hidden;
}
.pro-detail-img img{
    width: 65%;
    display: block;
    margin: auto;
    /* transition: .3s ease-in; */
}
.pro-detail-top-right{
    width: 50%;
}
.pro-detail-top-right h2{
    font-size: 40px;
    color: #333333;
    font-weight: normal;
}
.pro-detail-top-right h3{
    font-size: 15px;
    color: #989898;
    margin-top: 10px;
    font-weight: normal;
}
.pro-detail-top-right .pro-detail-p{
    margin: 30px 0;
    padding: 20px 0;
    border-top: 1px solid #EEEEEE;
    border-bottom: 1px solid #EEEEEE;
    overflow: hidden;
}
.pro-detail-p p{
    overflow: hidden;
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.pro-detail-top-right .pro-detail-p span{
    font-size: 14px;
    line-height: 28px;
    color: #666666;
    width: 33%;
    padding-left: 15px;
    position: relative;
    box-sizing: border-box;
}
.pro-detail-p span::before{
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background-color: #2962AC;
    border-radius: 50%;
    position: absolute;
    top: 13px;
    left: 0;
}
.pro-detail-top-right .pro-detail-p1{
    font-size: 14px;
    color: #fff;
    display: inline-block;
    background-color: #2962AB;
}
.pro-detail-p1 a{
    padding: 10px 40px;
    color: #fff;
    display: block;
}
.pro-detail-top-right .pro-detail-p2{
    font-size: 14px;
    color: #666666;
    margin-top: 30px;
}
.pro-detail-p2 span{
    float: left;
}
.pro-detail-p2 a{
    width: 20px;
    height: 20px;
    margin-left: 10px;
    float: left;
    display: block;
}
.pro-detail-top-right .pro-detail-p2 .we{
    display: block !important;
}
.pro-detail-top-right .pro-detail-p2 img{
    height: auto;
    display: none !important;
    padding-bottom: 20px;
}
#qrcode:hover img{
    display: block !important;
    position: relative;
    z-index: 10;
}
.pro-detail-bottom{}
.pro-detail-bottom ul{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-detail-bottom ul li{
    width: 24%;
    font-size: 18px;
    color: #333333;
    text-align: center;
    padding: 20px 0;
    background-color: #EEEEEE;
    cursor: pointer;
}
.pro-detail-bottom ul .active{
    background-color: #2962AB;
    color: #fff;
}
.pro-detail-bottom-all{
    margin: 60px 0;
}
.pro-bottom-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-bottom-left{
    width: 50%;
}
.pro-bottom-left img{
    display: block;
}
.pro-bottom-right{
    width: 50%;
}
.pro-bottom-right p{
    color: #333333;
}
.pro-bottom-img{
    margin-top: 40px;
}
.pro-bottom-img p{
    font-size: 16px;
    text-align: center;
}
.product-detail-swiper,
.pro-one-swiper,
.pro-two-swiper{
    overflow: hidden;
    position: relative;
    padding-bottom: 40px;
}
.pro-one-swiper .swiper-slide img,
.product-detail-swiper .swiper-slide img,
.pro-two-swiper .swiper-slide img{
    max-width: 100%;
    display: block;
    margin: auto;
}
.pro-bottom-div{}
.pro-bottom-li{
    position: relative;
    padding-left: 30px;
    margin-bottom: 30px;
}
.pro-bottom-li::before{
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background: url(../img/dui.png) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 5px;
    left: 0;
}
.pro-bottom-li h2{
    font-size: 24px;
    color: #333333;
    font-weight: normal;
}
.pro-bottom-li p{
    font-size: 15px;
    line-height: 30px;
    color: #666666;
}
#pro-li-2 img{
    width: 100%;
    display: block;
}
#pro-li-3 img{
    width: 100%;
    display: block;
}
.pro-yc{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pro-yc li{
    width: 48%;
    box-sizing: border-box;
    border-radius: 5px;
    box-shadow: 0 0 5px 0 #eee;
    transition: .3s ease-in;
}
.pro-yc li a{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
}
.pro-yc li:hover{
    background-color: #2962AB;
}
.pro-yc li:hover span{
    color: #fff;
}
.pro-yc li:hover span::before{
    background-color: #fff;
}
.pro-yc li:hover i{
    color: #fff;
}
.pro-yc li span{
    font-size: 18px;
    color: #333333;
    position: relative;
    padding-left: 20px;
    transition: .3s ease-in;
}
.pro-yc li span::before{
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    background-color: #2962AB;
    border-radius: 50%;
    position: absolute;
    top: 10px;
    left: 0;
}
.pro-yc li i{
    font-size: 20px;
    color: #2962AB;
}
.media{
    padding: 60px 0;
}
.media-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-left: -2%;
}
.media-cont{
    width: 31%;
    margin-left: 2%;
    border: 1px solid #EFEFEF;
    margin-bottom: 40px;
}
.media-cont:hover h2{
    color: #2962AC;
}
.media-cont:hover{
    border: 1px solid #2A62AE;
}
.media-cont:hover img{
    transform: scale(1.1);
}
.media-cont-img{
    overflow: hidden;
}
.media-cont-img img{
    width: 100%;
    display: block;
    transition: .3s ease-in;
}
.media-cont .media-cont-p{
    padding: 20px;
    box-sizing: border-box;
}
.media-cont-p span{
    display: block;
    font-size: 14px;
    color: #666666;
}
.media-cont-p h2{
    font-size: 20px;
    line-height: 30px;
    color: #333333;
    margin: 20px 0;
    font-weight: normal;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
     -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.media-cont-p p{
    font-size: 14px;
    color: #666666;
}
.media-qb{
    text-align: center;
    margin: auto;
}
.media-qb a{
    font-size: 16px;
    line-height: 32px;
    color: #666666;
    display: inline-block;
    border-bottom: 2px solid #666666;
}
.media-detail{
    padding: 60px 0;
    padding-top: 108px;
}
.media-detail-top{
    padding-top: 60px;
}
.media-detail-top h2{
    font-size: 30px;
    color: #333333;
    font-weight: normal;
}
.media-detail-time{
    padding: 20px 0;
    border-bottom: 1px solid #EFEFEF;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.media-detail-time p{
    font-size: 14px;
    color: #666666;
    overflow: hidden;
}
.media-detail-time p span{
    font-size: 14px;
    line-height: 15px;
    color: #666666;
    float: left;
}
.media-detail-time p a{
    display: block;
    width: 15px;
    height: 15px;
    float: left;
    margin-left: 10px;
    overflow: hidden;
}
.media-detail-time p img{
    width: 15px;
    height: 15px;
    display: block;
}
.media-detail-cont{
    padding: 20px 60px;
}
.media-detail-cont p{
    color: #333333;
}
.page{}
.page p{
    font-size: 18px;
    color: #666666;
}
.page p a{
    display: block;
    color: #666666;
    padding: 20px 0;
}
.page .s a{
    border-bottom: 1px solid #EFEFEF;
}
.advantage{
    padding: 60px 0;
}
.advantage-one{
    padding-left: 20%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.advantage-one-left{
    width: 28%;
}
.advantage-one-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.advantage-one-left h3{
    font-size: 18px;
    line-height: 26px;
    color: #555555;
    font-weight: normal;
    margin-top: 40px;
}
.advantage-one-left p{
    font-size: 14px;
    line-height: 28px;
    color: #979797;
    margin-top: 20px;
}
.advantage-one-right{
    width: 65%;
}
.advantage-one-right img{
    width: 100%;
    display: block;
}
.advantage-two{
    padding: 60px 0;
    margin-top: 60px;
    background: url(../img/advan-1.png) no-repeat center;
    background-size: cover;
}
.advantage-two-top{}
.advantage-two-top h2{
    font-size: 24px;
    color: #fff;
    font-weight: normal;
}
.advantage-two-top p{
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    margin-top: 20px;
}
.advantage-two-zhong{
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.advan-two-left{
    width: 20%;
}
.advan-two-left h2{
    font-size: 18px;
    color: #fff;
}
.advan-two-left p{
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    margin-top: 10px;
}
.advan-two-zhong{
    width: 40%;
}
.advan-two-zhong img{
    width: 100%;
    display: block;
}
.advan-two-right{
    width: 15%;
}
.advan-two-right p{
    font-size: 14px;
    line-height: 32px;
    color: #fff;
}
.advantage-two-bottom{
}
.advantage-two-bottom{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}
.advantage-two-cont{
    /* width: 25%; */
}
.advantage-two-cont h2{
    font-size: 24px;
    color: #fff;
}
.advantage-two-cont p{
    font-size: 14px;
    color: #fff;
    margin-top: 10px;
}
.advantage-three{
    padding: 60px 0;
}
.advantage-three-top{}
.advantage-three-top h2{
    font-size: 24px;
    color: #555555;
    text-align: center;
    font-weight: normal;
}
.advantage-three-top h3{
    font-size: 24px;
    color: #E4E4E5;
    text-align: center;
    margin-top: 10px;
}
.advantage-three-top p{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    text-align: center;
    margin: auto;
    margin-top: 30px;
}
.advantage-three-cont{
}
.advan-swiper{
    overflow: hidden;
    position: relative;
    padding: 50px 0;
}
.advan-swiper-cont{
    background-color: #F6F7F7;
    padding: 50px 25px;
    transition: .3s ease-in;
}
.advan-swiper-cont:hover{
    background-color: #2A62AE;
}
.advan-swiper-cont:hover div{
    background-color: #fff;
}
.advan-swiper-cont:hover i{
    color: #2A62AE;
}
.advan-swiper-cont:hover h2{
    color: #fff;
}
.advan-swiper-cont:hover p{
    color: #fff;
}
.advan-swiper-cont div{
    width: 90px;
    height: 90px;
    background-color: #2A62AE;
    border-radius: 50%;
    position: relative;
    margin: auto;
}
.advan-swiper-cont i{
    font-size: 40px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.advan-swiper-cont h2{
    font-size: 18px;
    color: #555555;
    text-align: center;
    font-weight: normal;
    margin-top: 15px;
}
.advan-swiper-cont p{
    width: 80%;
    font-size: 14px;
    line-height: 26px;
    color: #979797;
    text-align: center;
    margin-top: 10px;
    margin: auto;
}
.advan-page .swiper-pagination-bullet{
    width: 12px;
    height: 12px;
    background: #979797;
}
.advan-page .swiper-pagination-bullet-active{
    width: 100px;
    border-radius: 25px;
    background: #2A62AE;
}
.advantage-four{
    padding: 60px 0;
    background-color: #F6F7F7;
}
.advantage-four-top h2{
    font-size: 24px;
    color: #555555;
    text-align: center;
    font-weight: normal;
}
.advantage-four-top h3{
    font-size: 24px;
    color: #E4E4E5;
    text-align: center;
    margin-top: 10px;
}
.advantage-four-top p{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    text-align: center;
    margin: auto;
    margin-top: 30px;
}
.advantage-four-all{
    margin: 40px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.advantage-four-cont{
    width: 18%;
    padding: 30px 40px;
    background-color: #fff;
    box-sizing: border-box;
    transition: .3s ease-in;
}
.advantage-four-cont:hover{
    background-color: #2A62AE;
}
.advantage-four-cont:hover i{
    color: #fff;
}
.advantage-four-cont:hover h2{
    color: #fff;
}
.advantage-four-cont:hover h2::after{
    background-color: #fff;
}
.advantage-four-cont:hover p{
    color: #fff;
}
.advantage-four-cont i{
    font-size: 40px;
    color: #2962AC;
    display: block;
    margin: auto;
    text-align: center;
}
.advantage-four-cont h2{
    font-size: 18px;
    color: #555555;
    text-align: center;
    margin-top: 30px;
    position: relative;
    padding-bottom: 10px;
    font-weight: normal;
}
.advantage-four-cont h2::after{
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    background-color: #2962AC;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,0);
}
.advantage-four-cont p{
    font-size: 14px;
    line-height: 26px;
    color: #979797;
    margin-top: 10px;
    text-align: center;
}
.advantage-five{
    padding: 60px 0;
}
.advantage-five-top h2{
    font-size: 24px;
    color: #555555;
    text-align: center;
    font-weight: normal;
}
.advantage-five-top h3{
    font-size: 24px;
    color: #E4E4E5;
    text-align: center;
    margin-top: 10px;
}
.advantage-five-top p{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    text-align: center;
    margin: auto;
    margin-top: 30px;
}
.advantage-five-all{
    margin: 40px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.advantage-five-cont{
    width: 23%;
    padding: 40px 30px;
    box-sizing: border-box;
    border-radius: 10px;
    box-shadow: 0 0 5px 0 #adadad;
}
.advantage-five-cont i{
    font-size: 40px;
    color: #333333;
    display: block;
    margin: auto;
    text-align: center;
}
.advantage-five-cont h2{
    font-size: 18px;
    color: #333333;
    text-align: center;
    margin-top: 10px;
    font-weight: normal;
}
.advantage-five-cont img{
    width: 100%;
    display: block;
    margin: 15px auto;
}
.advantage-five-cont p{
    font-size: 14px;
    line-height: 26px;
    color: #989898;
    margin-top: 10px;
    text-align: center;
}
.abouts{}
.abouts-one{
    padding: 60px 0;
}
.abouts-one-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.abouts-one-left{
    width: 50%;
}
.abouts-one-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.abouts-one-left h3{
    font-size: 24px;
    color: #E4E4E5;
    margin-top: 10px;
}
.abouts-one-left span{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    display: block;
    margin: 30px 0;
}
.abouts-one-left p{
    font-size: 14px;
    line-height: 28px;
    color: #989898;
    text-indent: 2em;
}
.abouts-one-right{
    width: 45%;
}
.abouts-one-right:hover img{
    transform: scale(1.1);
}
.abouts-one-right-img{
    overflow: hidden;
}
.abouts-one-right img{
    width: 100%;
    display: block;
    transition: .3s ease-in;
}
.abouts-one-right video{
    width: 100%;
    display: block;
}
.abouts-two{
    background-color: #F6F7F7;
    padding: 60px 0;
}
.abouts-two-top{}
.abouts-two-top h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.abouts-two-top h3{
    font-size: 24px;
    color: #E4E4E5;
    margin-top: 10px;
}
.abouts-two-top p{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    margin-top: 30px;
}
.abouts-two-all{
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.abouts-two-cont{}
.abouts-two-cont:hover img{
    transform: rotateY(180deg);
}
.abouts-two-cont img{
    width: 105px;
    height: 105px;
    display: block;
    transition: .3s ease-in;
}
.abouts-two-cont h2{
    font-size: 18px;
    color: #333333;
    margin-top: 20px;
    font-weight: normal;
}
.abouts-two-cont p{
    font-size: 14px;
    line-height: 24px;
    color: #666666;
    margin-top: 20px;
}
.abouts-three{
    padding: 60px 0;
}
.abouts-three-top{}
.abouts-three-top h2{
    font-size: 24px;
    color: #555555;
    text-align: center;
    font-weight: normal;
}
.abouts-three-top h3{
    font-size: 24px;
    color: #E4E4E5;
    text-align: center;
    margin-top: 10px;
}
.abouts-three-top p{
    width: 25px;
    height: 4px;
    background-color: #E4E4E5;
    margin: auto;
    margin-top: 30px;
}
.abouts-three-all{
    margin-top: 40px;
    /* background: url(../img/youshi-bj.png) no-repeat center; */
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.abouts-three-cont{
    width: 20%;
    padding: 60px;
    box-sizing: border-box;
    position: relative;
}
.abouts-three-cont:nth-child(1){
    border: 1px solid #C8C9C9;
    border-top-left-radius: 150px;
    border-top-right-radius: 150px;
    border-bottom: 1px solid transparent;
}
.abouts-three-cont:nth-child(1)::after{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    background-color: #ffffff;
    position: absolute;
    right: -1px;
    bottom: 0;
}
.abouts-three-cont:nth-child(2){
    border: 1px solid #C8C9C9;
    border-bottom-left-radius: 150px;
    border-bottom-right-radius: 150px;
    border-top: 1px solid transparent;
}
.abouts-three-cont:nth-child(2)::before{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    top: 0;
    left: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(2)::after{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    top: 0;
    right: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(3){
    border: 1px solid #C8C9C9;
    border-top-left-radius: 150px;
    border-top-right-radius: 150px;
    border-bottom: 1px solid transparent;
}
.abouts-three-cont:nth-child(3)::before{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    bottom: 0;
    left: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(3)::after{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    bottom: 0;
    right: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(4){
    border: 1px solid #C8C9C9;
    border-bottom-left-radius: 150px;
    border-bottom-right-radius: 150px;
    border-top: 1px solid transparent;
}
.abouts-three-cont:nth-child(4)::before{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    top: 0;
    left: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(4)::after{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    top: 0;
    right: -1px;
    background-color: #fff;
}
.abouts-three-cont:nth-child(5){
    border: 1px solid #C8C9C9;
    border-top-left-radius: 150px;
    border-top-right-radius: 150px;
    border-bottom: 1px solid transparent;
}
.abouts-three-cont:nth-child(5)::before{
    content: "";
    display: block;
    width: 1px;
    height: 50%;
    position: absolute;
    bottom: 0;
    left: -1px;
    background-color: #fff;
}
.abouts-three-cont i{
    font-size: 40px;
    color: #2962AC;
    display: block;
    margin: auto;
    text-align: center;
}
.abouts-three-cont h2{
    font-size: 18px;
    color: #333333;
    text-align: center;
    font-weight: normal;
    margin-top: 30px;
}
.abouts-three-cont p{
    font-size: 14px;
    line-height: 26px;
    color: #989898;
    text-align: center;
    margin-top: 20px;
}
.contact{
    padding: 60px 0;
}
.contact-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.contact-left{
    width: 50%;
}
.lianxi{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 20px;
}
.lianxi-left{
    width: 50%;
}
.lianxi-left h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.lianxi-left h3{
    font-size: 14px;
    color: #555555;
    font-weight: normal;
}
.lianxi-left p{
    width: 14px;
    height: 1px;
    background-color: #555555;
    margin: 30px 0;
}
.lianxi-left span{
    display: block;
    font-size: 16px;
    line-height: 32px;
    color: #999999;
}
[lang="en"] .en-adress{
    font-size: 13px;
    line-height: 24px;
}
.lianxi-right{
    width: 50%;
}
.lianxi-right h2{
    font-size: 24px;
    color: #555555;
    font-weight: normal;
}
.lianxi-right h3{
    font-size: 14px;
    color: #555555;
    font-weight: normal;
}
.lianxi-right p{
    width: 14px;
    height: 1px;
    background-color: #555555;
    margin: 30px 0;
}
.lianxi-right span{
    display: block;
    font-size: 16px;
    line-height: 32px;
    color: #999999;
}
.contact-share{
    margin-top: 30px;
}
.contact-share a{
    display: block;
    float: left;
    margin-right: 20px;
}
.contact-share a i{
    font-size: 30px;
    color: #2962AC;
}
.contact-right{
    width: 50%;
    padding: 20px;
    box-sizing: border-box;
    box-shadow: 0 0 5px 0 #eee;
}
.contact-right form{}
.contact-right form legend{
    font-size: 24px;
    color: #555555;
    margin-bottom: 30px;
}
.contact-right form .form-group{
    margin-bottom: 20px;
    position: relative;
}
.contact-right form .form-group input{
    width: 100%;
    padding: 15px 30px;
    border: 1px solid #E5E5E6;
    outline: none;
    box-sizing: border-box;
}
.name::before{
    content: "";
    display: block;
    width: 14px !important;
    height: 16px;
    background: url(../img/con-1.png) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 15px;
    left: 10px;
}
.iphone::before{
    content: "";
    display: block;
    width: 14px !important;
    height: 16px;
    background: url(../img/con-2.png) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 15px;
    left: 10px;
}
.email::before{
    content: "";
    display: block;
    width: 14px !important;
    height: 16px;
    background: url(../img/con-3.png) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 15px;
    left: 10px;
}
.textarea::before{
    content: "";
    display: block;
    width: 14px !important;
    height: 16px;
    background: url(../img/con-4.png) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 15px;
    left: 10px;
}
.contact-right form .form-group input::placeholder{
    font-size: 14px;
    color: #C9CACA;
}
.contact-right form .form-group textarea{
    width: 100%;
    padding: 15px 30px;
    border: 1px solid #E5E5E6;
    outline: none;
    box-sizing: border-box;
}
.contact-right form .form-group textarea::placeholder{
    font-size: 14px;
    color: #C9CACA;
}
.contact-right form .btn{
    font-size: 14px;
    color: #fff;
    background-color: #2962AC;
    padding: 15px 50px;
    margin-top: 30px;
    display: block;
    outline: none;
    border: none;
    box-sizing: border-box;
}
.contact-right form .btn i{
    margin-left: 10px;
}
.qa{
    padding: 60px 0;
}
.qa-all{}
.qa-cont{
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    box-shadow: 0 0 5px 0 #d1d1d1;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}
.qa-cont>span{
    display: block;
    font-size: 24px;
    color: #2962AC;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1;
}
.qa-cont::after{
    content: "";
    display: block;
    width: 120px;
    height: 120px;
    background-image: linear-gradient(#2962AC,#187FC400);
    border-radius: 50%;
    position: absolute;
    top: -60px;
    right: -60px;
}
.qa-cont h2{
    font-size: 18px;
    color: #555555;
    font-weight: normal;
}
.qa-cont h2 span{
    color: #2962AC;
    font-weight: bold;
}
.qa-cont p{
    font-size: 14px;
    line-height: 22px;
    color: #999999;
    margin-top: 10px;
}
.qa-qb{
    text-align: center;
}
.qa-qb a{
    font-size: 16px;
    color: #666666;
    padding-bottom: 5px;
    border-bottom: 2px solid #666666;
}
.fuwu{}
.fuwu-one{
    padding: 60px 0;
}
.fuwu-one-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.fuwu-one-cont{
    width: 48%;
    position: relative;
}
.fuwu-one-cont img{
    width: 100%;
    display: block;
}
.fuwu-one-p{
    width: calc(100% - 80px);
    position: absolute;
    top: 40px;
    left: 40px;
    box-sizing: border-box;
}
.fuwu-one-p h2{
    font-size: 18px;
    color: #fff;
    font-weight: normal;
}
.fuwu-one-p p{
    font-size: 14px;
    color: #fff;
    margin-top: 20px;
}
.fuwu-two{
    padding: 60px 0;
    background-color: #2962AC;
    position: relative;
}
.fuwu-two::after{
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 25%;
    border-bottom: 170px solid #fff;
    border-left: 85px solid transparent;
}
.fuwu-two h2{
    font-size: 24px;
    color: #fff;
    text-align: center;
    font-weight: normal;
}
.fuwu-two h3{
    font-size: 24px;
    color: #fff;
    text-align: center;
    margin-top: 10px;
}
.fuwu-two p{
    width: 25px;
    height: 4px;
    background-color: #fff;
    text-align: center;
    margin: auto;
    margin-top: 30px;
}
.fuwu-three{
    padding: 60px 0;
}
.fuwu-three-all{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.fuwu-three-left{
    width: 48%;
}
.fuwu-three-left img{
    width: 100%;
    display: block;
}
.fuwu-three-right{
    width: 48%;
}
.fuwu-three-right .fuwu-three-p{
    margin-bottom: 30px;
}
.fuwu-three-p h2{
    font-size: 18px;
    color: #555555;
    font-weight: normal;
    margin-bottom: 20px;
}
.fuwu-three-p p{
    font-size: 14px;
    line-height: 22px;
    color: #999999;
}
[lang="en"] .abouts-two-cont{
    width: 23%;
}
[lang="en"] .abouts-three-cont{
    padding: 40px 20px;
}
[lang="en"] .advantage-five-cont{
    padding: 40px 20px;
}
[lang="en"] .advan-swiper-cont p{
    width: 90%;
    min-height: 130px;
}
[lang="en"] .advantage-four-cont{
    width: 19%;
    padding: 30px 15px;
}
[lang="en"] .foot-top li p{
    font-size: 14px;
}
[lang="en"] .pro-detail-p p{
    width: 100%;
}
[lang="en"] .pro-yc li{
    width: 100%;
}
@media (min-width:1600px) and (max-width:2200px){
    .advantage-one{
        padding-left: calc(15% - 50px);
    }
}
@media (min-width:1200px) and (max-width:1600px){
    /* 4.19 */
    .banner{
        height: 100%;
    }
    .shang{
        height: 650px;
    }
    .shang .swiper .swiper-slide>img{
        height: 100% !important;
    }
    .banner-xia{
        position: relative;
        transform: unset;
        left: 0;
    }


    .container,.head-container,.banner-xia{
        width: 90%;
    }
    .head-cont ul{
        width: 55%;
    }
    .shang .swiper .swiper-slide>img{
        height: 100vh;
        object-fit: cover;
    }
    .da .banner-p{
        top: 30%;
        left: 5%;
    }
    .da-page{
        right: 5%;
    }
    .banner-p h2{
        font-size: 60px;
    }
    .banner-p>p{
        margin: 20px 0;
    }
    .ban-share{
        margin-top: 20px;
    }
    .ban-share p{
        margin: 0;
        margin-right: 30px;
    }
    .pro-swiper .pro-cont{
        left: 5%;
    }
    .pro-page{
        right: 5%;
        bottom: 30% !important;
    }
    .abouts-one-all{
        align-items: center;
    }
    .advantage-one{
        padding-left: 5%;
        align-items: center;
    }
    .fuwu-two::after{
        width: 22%;
    }
    .play{
        right: 5%;
    }
    .foot-top li p{
        font-size: 14px;
    }
    .abouts-three-cont{
        padding: 40px;
    }
    .advantage-five-cont{
        padding: 40px 20px;
    }
    .advantage-one-left{
        width: 35%;
    }
    .advantage-one-left h3{
        margin-top: 20px;
    }
    .advantage-one-right{
        width: 60%;
    }
    .advantage-four-cont{
        padding: 30px 20px;
    }
}
.head-iphone{
    display: none;
}
.earth-left-top .earth-left-bottom{
    display: none;
}
.iphone-map{
    display: none;
}
.advantage-iphone{
    display: none;
}
.iphone-play{
    display: none;
}
@media screen and (max-width:1199px) {
    /* 4.19 */
    .shang .swiper .swiper-slide>img{
        height: 100% !important;
    }
    .banner-xia{
        position: relative;
        transform: unset;
        left: 0;
    }
    .xia .swiper .swiper-slide img{
        height: 80px !important;
    }


    .container,.head-container{
        width: 95%;
    }
    .banner-xia{
        width: 100%;
    }
    .header ,.head-container{
        display: none;
    }
    .banner{
        height: unset;
        padding-top: 70px;
    }
    .banner .swiper-slide>img{
        width: 100%;
        height: 106vh !important;
        object-fit: cover;
    }
    .head-iphone{
        display: block;
        width: 100%;
        background-color: #fff;
        position: fixed;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 999;
    }
    .head-iphone-all{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        padding: 10px 0;
        position: relative;
    }
    .head-iphone-all .lang i{
        position: unset;
        font-size: 18px;
    }
    .lang form{
        position: absolute;
        width: 95%;
        top: 75px;
        left: 0;
        box-sizing: border-box;
    }
    .lang form .form-group{
        margin-top: 0;
    }
    .video-play-all{
        width: 95%;
    }
    .tan-close{
        top: -60px;
        right: -5px;
    }
    .head-iphone-all a{
        height: 50px;
        text-align: center;
    }
    .head-iphone-all a img{
        height: 50px;
        display: block;
    }
    .da .banner-p{
        left: 5%;
        top: 10%;
    }
    .da-page{
        display: none;
    }
    .banner-p h2{
        width: 95%;
        font-size: 24px;
    }
    .banner-p p{
        width: 95%;
        font-size: 14px;
        line-height: 28px;
        margin: 20px 0;
    }
    .ban-share{
        margin-top: 20px;
    }
    .ban-share p{
        width:50% !important;
        margin: 10px 0;
    }
    .play{
        right: unset;
        left: 5%;
    }
    .xia{
        width: 150px !important;
    }
    .about{
        padding: 20px 0;
    }
    .about-left{
        width: 100%;
        margin-top: 10px;
    }
    .about-left p{
        font-size: 14px;
        margin-top: 10px;
    }
    .about-left span{
        margin-top: 15px;
    }
    .about-left span a{
        padding: 10px 40px;
    }
    .about-right{
        width: 100%;
    }
    .product{
        padding: 20px 0;
    }
    .product-left{
        width: 100%;
    }
    .product-right{
        width: 100%;
        display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    }
    .pro-shang-left{
        width: 100%;
    }
    .pro-shang-left img{
        width: 70%;
    }
    .pro-shang-right{
        width: 100%;
        padding: 10px;
    }
    .product-right .pro-xia{
        width: 100%;
    }
    .product-right .pro-shang{
        width: 100%;
    }
    .product-right .pro-xia{
        width: 100%;
    }
    .pro-zy{
        display: none;
    }
    .jishu{
        padding: 30px 0;
    }
    .youshi-left{
        width: 100%;
        writing-mode: unset;
    }
    .youshi-right{
        width: 100%;
    }
    .youshi-right-cont{
        justify-content: center;
    }
    .youshi-right-cont li{
        width: 32%;
        margin-top: 30px;
    }
    .youshi-right-cont li:nth-child(3){
        border-right: none;
    }
    .earth{
        padding: 30px 0;
    }
    .earth-left{
        width: 100%;
    }
    .earth-right{
        width: 100%;
        margin-top: 20px;
    }
    .earth-left-top{
        position: relative;
    }
    .earth-left .earth-left-bottom{
        display: none;
    }
    .earth-left-top .earth-left-bottom{
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        margin-top: 0;
    }
    .earth-left-bottom p{
        width: unset;
        margin-top: 0;
        background-color: unset;
    }
    .iphone-map{
        width: 100%;
        display: block;
    }
    .pc-map,.map-icon{
        display: none;
    }
    .news{
        padding: 30px 0;
    }
    .news-p{
        width: 48%;
    }
    .news-p:last-child{
        display: none;
    }
    .news-p span{
        margin-top: 10px;
        padding: 0 10px;
    }
    .news-p h2{
        font-size: 16px;
        line-height: 28px;
        padding: 0 10px;
    }
    .news-p p{
        font-size: 12px;
        padding: 0 10px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .foot-top{
        padding-top: 75px;
        padding-bottom: 20px;
    }
    .foot-top li{
        width: 100%;
        margin-bottom: 20px;
    }
    .foot-top li p{
        width: 85%;
        font-size: 14px;
    }
    .foot-di{
        display: none;
    }
    .foot-bottom{
        margin: 0;
        padding: 20px 0;
    }
    .foot-bottom-left{
        display: none;
    }
    .foot-bottom-right i{
        margin-left: 0;
        margin-right: 10px;
    }
    .foot-shang{
        display: none;
    }
    .pro-banner{
        padding-top: 70px;
    }
    .pro-swiper .swiper-slide img{
        height: 200px;
        object-fit: cover;
    }
    .pro-page{
        display: none;
    }
    .pro-swiper .pro-cont{
        left: 5%;
        top: 15%;
    }
    .pro-swiper .pro-cont h2{
        font-size: 40px;
    }
    .abouts-one{
        padding: 30px 0;
    }
    .abouts-one-left{
        width: 100%;
        margin-top: 20px;
    }
    .abouts-one-left span{
        margin: 15px 0;
    }
    .abouts-one-right{
        width: 100%;
        margin-top: 10px;
    }
    .abouts-two{
        padding: 30px 0;
    }
    .abouts-two-cont{
        width: 50%;
        margin-bottom: 20px;
    }
    .abouts-three{
        padding: 30px 0;
    }
    .abouts-three-cont{
        width: 100%;
        padding: 40px 10px;
        border: 1px solid #eee !important;
        border-radius: 0 !important;
    }
    .abouts-three-cont:nth-child(2)::after,
    .abouts-three-cont:nth-child(3)::before,
    .abouts-three-cont:nth-child(4)::after,
    .abouts-three-cont:nth-child(5)::before{
        display: none;
    }
    .advantage-five{
        padding: 30px 0;
    }
    .advantage-five-all{
        margin: 20px 0;
    }
    .advantage-five-cont{
        width: 98%;
        padding: 10px;
        margin: 2px;
    }
    .advantage-five-all{
        display: none;
    }
    .advantage-iphone{
        display: block;
        margin-top: 20px;
    }
    .advan-iphone-swiper{
        overflow: hidden;
        position: relative;
        padding-bottom: 50px;
    }
    .advantage-five-cont p{
        min-height: 210px;
    }
    .pro{
        padding: 30px 0;
    }
    .pro-cool{
        width: 100%;
        padding: 10px;
    }
    .pro-cool .pro-left{
        width: 100%;
    }
    .pro-cool .pro-right{
        width: 100%;
        margin-top: 20px;
    }
    .pro-left .pro-p p{
        width: 44%;
        float: left;
    }
    .pro-detail{
        padding-top: 70px;
    }
    .pro-detail-top{
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .pro-detail-top-left{
        width: 100%;
    }
    .pro-detail-top-right{
        width: 100%;
        margin-top: 20px;
    }
    .pro-detail-top-right h2{
        font-size: 24px;
    }
    .pro-detail-top-right .pro-detail-p{
        margin: 20px 0;
    }
    .pro-detail-bottom ul li{
        width: 49%;
        padding: 10px 0;
        margin-bottom: 10px;
    }
    .pro-detail-bottom-all{
        margin: 30px 0;
    }
    .pro-bottom-left{
        width: 100%;
    }
    .pro-bottom-left img{
        width: 100%;
    }
    .pro-bottom-right{
        width: 100%;
    }
    .advantage{
        padding: 30px 0;
    }
    .advantage-one{
        width: 95%;
        padding-left: 2.5%;
        padding-right: 2.5%;
        flex-direction: column-reverse;
    }
    .advantage-one-left{
        width: 100%;
        margin-top: 20px;
    }
    .advantage-one-left h3{
        margin-top: 20px;
    }
    .advantage-one-right{
        width: 100%;
    }
    .advantage-two{
        padding: 30px 0;
        margin-top: 30px;
    }
    .advantage-two-zhong{
        margin-top: 30px;
    }
    .advan-two-left{
        width: 100%;
    }
    .advan-two-zhong{
        width: 100%;
        margin-top: 20px;
    }
    .advan-two-right{
        width: 100%;
        margin-top: 20px;
    }
    .advantage-two-cont{
        width: 45%;
        margin-bottom: 20px;
    }
    .advantage-three{
        padding: 30px 0;
    }
    .advan-swiper-cont{
        padding: 10px;
    }
    .advan-swiper-cont p{
        width: 100%;
        min-height: 105px;
    }
    .advantage-four{
        padding: 30px 0;
    }
    .advantage-four-cont{
        width: 48%;
        padding: 10px;
        margin-bottom: 20px;
    }
    .media{
        padding: 30px 0;
    }
    .media-cont{
        width: 47%;
        margin-bottom: 20px;
    }
    .media-cont .media-cont-p{
        padding: 10px;
    }
    .media-detail{
        padding: 30px 0;
        padding-top: 70px;
    }
    .media-detail-top{
        padding-top: 20px;
    }
    .media-detail-cont{
        padding: 10px 0;
    }
    .contact{
        padding: 30px 0;
    }
    .contact-left{
        width: 100%;
    }
    .contact-right{
        width: 100%;
        margin-top: 20px;
        padding: 10px;
    }
    .lianxi-left{
        width: 100%;
    }
    .lianxi-left p,.lianxi-right p{
        margin: 10px 0;
    }
    .lianxi-right{
        width: 100%;
        margin-top: 20px;
    }
    .fuwu-one{
        padding: 30px 0;
    }
    .fuwu-one-cont{
        width: 100%;
        margin-bottom: 20px;
    }
    .fuwu-two::after{
        display: none;
    }
    .fuwu-two{
        padding: 30px 0;
    }
    .fuwu-three{
        padding: 30px 0;
    }
    .fuwu-three-left{
        width: 100%;
    }
    .fuwu-three-right{
        width: 100%;
        margin-top: 20px;
    }
    .fuwu-three-right .fuwu-three-p{
        margin-bottom: 20px;
    }
    .qa{
        padding: 30px 0;
    }
    .alist{
        position: relative;
    }
    .alist .iphone-xl{
        width: 50px;
        height: 50px;
        text-align: center;
        position: absolute;
        right: 30%;
        top: 0px;
        z-index: 99999;
        display: inline-block;
    }
    .alist i{
        line-height: 50px;
        color: #fff;
        font-size: 30px;
        transition: .3s ease-in;
    }
    .alist .m-xiala{
        display: none;
    }
    .alist .show{
        display: block;
    }
    .xuan i{
        display: block;
        transform: rotate(180deg);
    }
    .iphone-play{
        display: block;
        position: unset;
        margin-top: 30px;
        float: right;
        margin-right: 30px;
    }
    .iphone-play img{
        width: 100%;
    }
    .da .swiper-slide>.play{
        display: none;
    }
    .banner-xia::after{
        display: none;
    }
    .about-all{
        flex-direction: column-reverse;
    }
    .abouts-one-all{
        flex-direction: column-reverse;
    }
    .js-content li{
        margin: auto;
    }
    .js-content h2{
        text-align: center;
        margin: 20px 0;
    }
    .js-content p{
        text-align: center;
    }
    .abouts-two-cont img{
        margin: auto;
    }
    .abouts-two-cont h2{
        text-align: center;
    }
    .abouts-two-cont p{
        text-align: center;
    }
    .abouts-three-all{
        display: none;
    }
    .advantage-four-all{
        display: none;
    }
    .advan-ys-swiper{
        overflow: hidden;
        position: relative;
    }
    .pro-right img{
        width: 60%;
    }
    .pro-left .pro-p{
        margin: 10px 0;
    }
    .pro-detail-p p{
        width: 100%;
    }
    .pro-yc li{
        width: 100%;
        margin-bottom: 10px;
    }
    .pro-yc li a{
        padding: 10px;
    }
    .pro-yc li span{
        width: 80%;
    overflow: hidden;
    height: 25px;
    }
    .advan-swiper{
        padding-bottom: 80px;
    }
    .iphone-lang{
        text-align: center;
    }
    .iphone-lang a{
        width: unset;
        display: inline-block;
        margin-left: 0;
    }
    .iphone-lang a:last-child{
        margin-left: 5%;
    }
    .footer{
        margin-top: 30px;
    }
    .mobile-p{
        height: auto !important;
        display: block;
        font-size: 14px;
        line-height: 28px !important;
        color: #fff;
        width: 80% !important;
        margin: auto;
        margin-top: 30px;
        text-indent: 2em;
        margin-left: 10% !important;
    }
    .mobile-p span{
    }
}