@charset "utf-8";

.banner_box{padding: 0px;position: relative;z-index: 3;overflow: hidden;}
.banner{ overflow: hidden; }
.banner:after{content: "";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);z-index: 1;height: 23vh;}
.banner .a{ display: block; position: relative; z-index: 1; overflow: hidden; }
.banner .imgBox{ overflow: hidden; width: 100%; transform: scale(1);}
.banner .imgBox .img{ padding-bottom: 100vh; transition: 0s; transform: scale(1) !important; }
.banner .imgBox .img video{ opacity: .9;}
.banner.on ul li.swiper-slide-active .a .imgBox, .banner.on ul li.swiper-slide-duplicate-active .a .imgBox, .banner.on ul li.swiper-slide-prev .a .imgBox{ animation: sca 6s linear 0s normal both;}
@keyframes sca {
    0% {
        transform: scale(1.06);
    }
    100% {
        transform: scale(1);
    }
}


.banner .bottom{position: absolute;right: 0;left: 0;bottom: .45rem;z-index: 2;}
.banner .dots{ justify-content: flex-end; align-items: center;}
.banner .dots span{width: .48rem;height: .48rem;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 0 0 .15rem !important;position: relative;z-index: 1}
.banner .dots span:before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../images/dots1.png) center no-repeat;background-size: cover; transition: .5s;}
.banner .dots span:after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../images/dots1s.png) center no-repeat;background-size: cover;opacity: 0;transition: .5s;}

.banner .dots span.active:before{ opacity: 0}
.banner .dots span.active:after{ opacity: 1}

.pad1{ padding: .36rem 0; overflow: hidden;}

.index1 .left{ width: 8.62rem;}
.index1 .right{ width: calc(100% - 8.62rem - .4rem); background: #f5fbff; position: relative;}
.index1 .right::after{ content: ""; position: absolute; left: .16rem; right: .16rem; background: #0074cf; height: .03rem; bottom: 0;}
.index1 .right .box{ padding: .12rem;}
.index1 .right .box p{ font-size: .18rem; color: #333; line-height: 2; font-weight: 600;}
.index1 .right .box .con{ padding: .12rem 0 .18rem;}

.ls1 .a {display: block;position: relative;}
.ls1 .imgBox::after {content: "";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(82, 121, 243, 0) 100%);height: 28%;}
.ls1 .imgBox .img {padding-bottom: 55.22%;}
.ls1 h4 {flex: 1;color: #fff !important;}
.ls1 .bottom {position: absolute;right: 0;bottom: 0;left: 0;padding: 0 .25rem;z-index: 10;align-items: center;background: rgba(0,0,0,.3);height: .4rem;}
.ls1 .dots {margin: 0 0 0 .15rem;}
.ls1 .dots span {width: .13rem;height: .13rem;background: #fff;border-radius: 50vw;transition: .5s;opacity: 1;margin: 0 .03rem; position: relative}
.ls1 .dots span:before{ content: ""; width: .36rem; height: .36rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url(../images/dots1.png) center no-repeat; background-size: cover; transition: .5s; opacity: 0;}
.ls1 .dots span.active {background: transparent; margin: 0 .2rem}
.ls1 .dots span.active:before{ opacity: 1;}

.tit1{ background: url(../images/tit1_b.jpg) center no-repeat; background-size: cover; height: .97rem; position: relative; padding: 0 .25rem; align-items: center; text-align: center;}
.tit1:before{content: "";position: absolute;border-left: transparent .125rem solid;border-right: transparent .125rem solid;border-top: #006ecd .09rem solid;top: 100%;left: 50%;transform: translateX(-50%)}
.tit1 h3{font-size: .36rem;color: #fff;letter-spacing: .14rem;width: 100%;padding: 0 0 0 .14rem;}

.ls2 li{ margin-bottom: .09rem;}
.ls2 .a{ height: .6rem; background: #ef1a5b; align-items: center; padding: 0 .4rem;}
.ls2 .ico{ width: .43rem; margin: 0 .3rem 0 0;}
.ls2 .ico img{ width: 100%}
.ls2 h4{ flex: 1; overflow: hidden; font-size: .24rem; color: #fff; font-weight: bold; transition: .5s;}

.ls2 li:nth-child(2) .a{ background: #0fb2c1;}
.ls2 li:nth-child(3) .a{ background: #006ecd;}

.tit2{ align-items: center; border-bottom: #006dc5 .03rem solid; margin-bottom: .1rem}
.tit2 h3{background: url(../images/tit2_b.jpg) center no-repeat;background-size: cover;height: .35rem;position: relative;padding: 0 .2rem;text-align: center;font-size: .2rem;color: #fff;font-weight: bold;line-height: .4rem;border-radius: .15rem .15rem 0 0;font-family: "Microsoft YaHei";}
.more1{ align-items: center; font-size: .14rem; color: #979696; transition: .5s}
.more1 img{ width: .21rem; margin: 0 .06rem 0 0}

.index2{ padding-top: 0 !important;} 
.index2 .box{ width: calc(50% - .22rem);}

.ls3 .a{height: .48rem;border-bottom: #d2d2d2 1px dashed;align-items: center;position: relative;padding: 0 0 0 .26rem;}
.ls3 .a::before{content: "";width: .07rem;height: .07rem;border-radius: 50%;border: #07148b 1px solid;position: absolute;top: 50%;left: .08rem;margin: -.045rem 0 0;}
.ls3 h4{ flex: 1;}
.ls3 h6{ margin: 0 0 0 .2rem; width: auto;}

.index3{ padding-top: 0 !important; padding-left: .1rem; padding-right: .1rem; margin: 0 -.1rem;}

.ls4{ margin: 0 -.1rem -.1rem;}
.ls4 li{ width: 25%; padding: 0 .1rem; margin-bottom: .1rem;}
.ls4 .imgBox .img{ padding-bottom: 68.38%;}
.ls4 .txt{ height: .45rem; background: #fff; display: flex; align-items: center; text-align: center; padding: 0 .15rem; transition: .5s;}
.ls4 h4{ font-weight: bold;}

.index4{ padding-top: 0 !important;}
.index4 .bd{border: #d8d8d8 1px solid;border-top: none;padding: .3rem 0;}

.ls5{margin: 0 -4px;padding: 0 3vw;background: #f2f2f2;}
.ls5 li{padding: 0 4px;width: 25%;height: .46rem;display: flex;align-items: center;font-size: .18rem;color: #333333;font-weight: bold;font-family: "Microsoft YaHei"; flex: 1;overflow: hidden}
.ls5 li:nth-child(1){flex: 3;}

.ls5 li:nth-child(2){
  flex: 1;
}
.ls5 li:nth-child(3){flex:4;}

.ls6 li{ margin: 0 -4px; height: .44rem; display: flex; align-items: center; padding: 0 3vw;}
.ls6 .li{padding: 0 4px;font-size: .16rem;color: #333333;flex: 1;overflow: hidden; transition: .5s; cursor: pointer;}
.ls6 .li:nth-child(1){flex: 3;}
 .ls6 .li:nth-child(2){
   flex: 1;
}
.ls6 .li:nth-child(3){
  color: #e03d3d;
  padding-right:15px;
  flex: 4;
  white-space: nowrap;
  /* 2. 隐藏超出容器的内容 */
  overflow: hidden;
  /* 3. 用省略号代替超出的文本 */
  text-overflow: ellipsis;
  /* 4. 必须设置宽度（可选固定值/百分比），否则容器会随文本宽度自适应，省略号不生效 */
   /;
  }

.index5{ padding-top: 0 !important;}
.index5 .left{ width: 6.02rem;}
.index5 .right{ width: calc(100% - 6.02rem - .16rem);}

.ls7 .a{ display: block; position: relative;}
.ls7 .imgBox .img{ padding-bottom: 62.9%;}
.ls7 .ico{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 1;font-size: .6rem;color: #fff;font-family: 'lib';opacity: .5;}
.ls7 .txt{position: absolute;right: 0;bottom: .8rem;left: 0;padding: 0 .16rem 0;}
.ls7 h4{ font-size: .16rem; color: #fff !important; font-weight: bold; padding: .06rem 0; position: relative;}
.ls7 h4::before{content: "";position: absolute; bottom: 0; left: 0; width: .44rem;height: .03rem;background: #fff; }

.ls8{ margin: 0 -.08rem -.16rem;}
.ls8 li{ width: 50%; padding: 0 .08rem; margin-bottom: .16rem;}
.ls8 .imgBox .img{ padding-bottom: 61.07%;}

.index6{ padding-top: 0 !important;}

.ls9{ margin: 0 -.78125vw;}
.ls9 li{ width: 16.66%; padding: 0 .78125vw; margin-top: .1rem;}
.ls9 .a{ display: flex; height: .48rem; border: #d0d0d0 1px solid; align-items: center; position: relative; padding: 0rem; transition: .5s;}
.ls9 h4{text-align: center;font-size: .16rem !important;line-height: 1.25;font-weight: bold;}

@media(min-width: 1024px){
    .ls4 .a:hover .txt{ box-shadow: -0.052px 0.999px .08rem 0.81px rgba(105, 105, 105, 0.4); }
    .ls6 li:hover .li:nth-child(1){ color: #006bc5;}

    .ls9 .a:hover{ background: #006bc5; border: #fff 1px solid;}
    .ls9 .a:hover h4{ color: #fff;}
}
@media(max-width: 800px){
}
@media(max-width: 769px){
    

    .index1 .left{ width: 100%}
    .index1 .right{width: 100%;padding: .3rem 0 0;}
    .ls1 .dots span{ width: .08rem; height: .08rem;}
    .ls1 .dots span:before{ width: .24rem; height: .24rem;}
    .ls1 .dots span.active{ margin: 0 .15rem;}

    .tit1{ height: .7rem;}
    .tit1 h3{font-size: .26rem;letter-spacing: .06rem;padding: 0 0 0 .06rem;}

    .ls2 .a{ height: .5rem}
    .ls2 .ico{ width: .26rem; }
    .ls2 h4{ font-size: .2rem}

    .index2 .box{ width: 100%}
    .index2 .box:last-child{ margin: .3rem 0 0}

    .ls4{ margin: 0 -7px 0 -.1rem}
    .ls4 li{ width: 50%; padding: 0 7px}

    .index4 .content{ overflow: hidden; overflow-x: scroll;}
    .ls5{ min-width: 7.68rem;}
    .index4 .bd{ min-width: 7.68rem;}

    .ls6 li{  height: .36rem;}
    .ls6 .li{ font-size: .14rem; white-space: nowrap; }

    .index5 .left{ width: 100%}
    .index5 .right{ width: 100%; margin: .4rem 0 0;}
    .ls9 li{ width: 50%;}
    .tit2 h3{ line-height: .36rem;}

    .ls7 .txt{ padding: .15rem;}
} 
@media(max-width: 560px){
}