@charset "utf-8";

.banner_box{ padding: 0px; position: relative; z-index: 3;}
.banner{ overflow: hidden; }
.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: 31%;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 7s linear 0s normal both;}
@keyframes sca {
    0% {
        transform: scale(1.06);
    }
    100% {
        transform: scale(1);
    }
}
.banner .dots{ position: absolute; bottom: .3rem; left: 0; right: 0; text-align: center;}
.banner .dots span{position: relative;z-index: 1;width: .67rem;height: .16rem;background: none;border-radius: 0;opacity: 1; margin: 0 .1rem !important}
.banner .dots span::before{content: "";position: absolute;background: url(../images/dots11.png) center no-repeat;top: 0;right: 0;bottom: 0;left: 0;opacity: 0;transition: .5s;background-size: 100%;}
.banner .dots span::after{content: "";position: absolute; background: #fff; height: 2px; left: 0; right: 0; bottom: .02rem; transition: .5s}

.banner .dots span.active::before{ opacity: 1;}
.banner .dots span.active::after{ opacity: 0;}

.pad1{padding: .7rem 0;overflow: hidden;}

.indexab{ background: #f2f2f2;background-size: cover; padding-bottom: .3rem; position: relative; z-index: 1;}
.indexab::before{content: "";position: absolute;top: 0;right: 0;bottom: -1px;left: 0;    /* background: url(../images/indexcd_b1.png) center bottom no-repeat; */background-size: 100% auto;z-index: -1;pointer-events: none;}

.tit1{ align-items: center; justify-content: space-between; position: relative; z-index: 1; margin-bottom: .35rem;}
.tit1::before{content: "";position: absolute;background: url(../images/tit.png) center no-repeat;width: 1.98rem;height: .47rem;background-size: cover;top: 0;z-index: -1;}
.tit1 .ll{padding: .1rem 0;}
.tit1 h3{ font-size: .36rem; color: #232323;}
.tit1 h6{font-size: .14rem;color: #e67a18;margin: .05rem 0 0;}
.more1{position: relative;font-size: .16rem;color: #e67a18;transition: .5s;padding: 0.055rem 0;}
.more1::before{content: "";position: absolute;background: url(../images/more1.png) center no-repeat;width: 1.69rem;height: .02rem;background-size: 100% 100%;bottom: 0;right: 0;}

.tit1c{justify-content: center;}
.tit1c .ll{text-align: center;}
.tit1c .more1{position: absolute;right: 0;top: 50%;transform: translateY(-50%);}

.list1 .a{ align-items: center;}
.list1 .imgBox{ width: 50%;}
.list1 .imgBox .img{ padding-bottom: 62.5%;}
.list1 .txt{ width: calc(50% - .7rem);}
.list1 h4{ font-size: .28rem; line-height: .38rem; max-height: calc(.38rem*2)\0;}
.list1 p{ font-size: .18rem; color: #666666; line-height: .3rem; max-height: calc(.3rem*5)\0;}
.h6s1{align-items: center;color: #e67a18;margin: .25rem 0 .2rem;}
.h6s1 .i1{width: .64rem;margin: -.14rem 0 0;}
.h6s1 .line{flex: 1;overflow: hidden;background: #e67a18;height: 1px;margin: 0 0 0 -.1rem;}
.h6s1 .i2{ width: .14rem; margin: 0 .05rem 0 .1rem;}

.more2{ align-items: center;  }
.more2 .a{ display: inline-block; position: relative; z-index: 1; font-size: .14rem; color: #046787; transition: .5s;}
.more2 .a:before{content: "";position: absolute;background: url(../images/more2.png) center no-repeat;width: .27rem;height: .3rem;left: -.15rem;top: 50%;transform: translateY(-50%); background-size: 100% 100% !important;}

.list1 .more2{justify-content: flex-end;margin: .5rem 0;}

.list2W{ position: relative;}
.arrow1{ justify-content: center; align-items: center; position: absolute; top: -.7rem; right: 0; width: calc(50% - .7rem);}
.arrow1 .arrow{display: flex;justify-content: center;align-items: center;width: .54rem;height: .54rem;border: transparent 1px dashed;position: relative;z-index: 1;transition: .5s;font-family: 'lib';font-size: .26rem;color: #999; border-radius: 50vw;}
.arrow1 .arrow:after{content: "";position: absolute;top: .05rem;right: .05rem;bottom: .05rem;left: .05rem;background: #e67a18;border-radius: 50vw;transform: scale(0);transition: .5s;z-index: -1;}
.arrow1 .dots{ bottom: auto; margin: 0 .1rem}
.arrow1 .dots span{width: auto;height: auto;background: none;opacity: 1;font-size: .16rem;color: #bbbbbb;margin: 0 .12rem;transition: .5s; position: relative}
.arrow1 .dots span:before{ content: ""; position: absolute; width: .1rem; height: 1px; background: #d2d2d2; left: calc(100% + .04rem); top: 50%; margin: -1px 0 0; transition: .5s}
.arrow1 .dots span.active{ margin: 0 .5rem 0 .12rem; color:#046787}
.arrow1 .dots span.active:before{ width: .45rem; background: #046787}

.list2{margin: .56rem 0 0;}
.list2 li{width: 33.33%;padding: 0;}
.list2 .a{ align-items: center; background: #fff; padding: .18rem; position: relative; z-index: 1}
.list2 .a:before{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: #046787; z-index: -1; height: 0; transition: .5s}
.list2 .imgBox{ width: 1.86rem; margin: 0 .18rem 0 0;}
.list2 .imgBox .img{padding-bottom: 77.41%;}
.list2 .txt{ flex: 1; overflow: hidden;}
.list2 .h6{font-size: .15rem;color: #046787;position: relative;z-index: 1;font-family: 'lib';padding: 0 0 0 .2rem; transition: .5s}
.list2 .h6:before{font-size: .17rem;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}
.list2 p{ margin: .1rem 0}

.indexb{padding-top: 0 !important;}

.list3{ margin: .56rem -.23rem 0;}
.list3 li{ width: 33.33%; padding: 0 .23rem; margin-bottom: .3rem;}
.list3 .a{ background: #fff; height: 1.3rem; align-items: center; padding: 0 .22rem; position: relative; z-index: 1}
.list3 .a:before{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: #046787; z-index: -1; height: 0; transition: .5s}
.list3 .time{ width: .9rem; border: #e67a18 1px solid; margin: 0 .22rem 0 0; text-align: center; background: #fff;}
.list3 .time h3{background: #e67a18;font-size: .36rem;color: #fff;font-style: italic;line-height: .55rem;font-weight: 500;}
.list3 .time h6{ font-size: .16rem; color: #e67a18; line-height: .28rem}
.list3 .txt{ flex: 1; overflow: hidden;}
.list3 h4{line-height: .28rem;max-height: calc(.28rem* 2) \0;min-height: .56rem;}
.list3 li .a:hover h4{color:#fff;}
.indexcd{ background: #f9f9f9;background-size: cover; position: relative; z-index: 1;}
.indexcd::before{content: "";position: absolute;top: 0;right: 0;bottom: -1px;left: 0;/* background: url(../images/indexef_b.png) center bottom no-repeat; */background-size: 100% auto;z-index: -1;pointer-events: none;}

.indexc .content{ width: calc(50% - .36rem);}

.indexc .tit1 h3{ color: #000;}
.indexc .more1{ color: #e67a18;}
.indexc .more1::before{ background: url(../images/more1.png) center no-repeat; background-size: 100% 100%;}

.list4{ margin: 0 -.12rem -.24rem; }
.list4 li{ width: 50%; padding: 0 .12rem; margin-bottom: .24rem;}
.list4 .a{height: 2.1rem;background: #fff;display: flex;align-items: center;padding: 0 .26rem;position: relative;z-index: 1;transition: .5s;overflow: hidden;}
.list4 .a::before{content: "";width: 1.45rem;height: 1.45rem;position: absolute;background-size: 100% 100%;z-index: -1;transition: .5s;right: -.02rem;bottom: -.16rem;}
.list4 .a::after{content: "";width: 100%;height: 100%;position: absolute;background: url(../images/list4_b.png) center bottom no-repeat;background-size: 100% auto;z-index: -1;left: 0;transition: .5s;bottom: -1px;}
.list4 .txt{ width: 100%;}
.list4 .h6{font-size: .15rem;color: #999999;position: relative;z-index: 1;font-family: 'lib';padding: 0 0 0 .2rem; transition: .5s}
.list4 .h6:before{font-size: .17rem;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}
.list4 p{ margin: .1rem 0 .15rem}

.list5Box{ height: 4.45rem}
.list5 .a{ align-items: center; background: #fff; padding: .14rem .24rem; position: relative; z-index: 1}
.list5 .a:before{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: #046787; z-index: -1; height: 0; transition: .5s}
.list5 .imgBox{ width: 1.68rem; margin: 0 .18rem 0 0;}
.list5 .imgBox .img{padding-bottom: 68.45%;}
.list5 .txt{ flex: 1; overflow: hidden;}
.list5 .h6{font-size: .15rem;color: #999;position: relative;z-index: 1;font-family: 'lib';padding: 0 0 0 .2rem;transition: .5s}
.list5 .h6:before{font-size: .17rem;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}
.list5 .flex-right{ justify-content: flex-start}
.list5 p{margin: .06rem 0 .1rem;}

.indexd{padding-top: 0 !important;padding-bottom: 1.5rem;}
.indexd .left, .indexd .right{ width: calc(50% - .36rem);}

.list6 .a{ display: block; position: relative; z-index: 1;}
.list6 .imgBox .img{ padding-bottom: 61.33%; padding-bottom: 4.68rem;}
.list6 .imgBox:after{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(../images/list6.png) center 101% no-repeat; background-size: 100% auto;}
.list6 .txt{ position: absolute; right: 0; bottom: 0; left: 0; display: flex; flex-wrap: wrap; align-items: center; padding: .2rem .2rem;}
.list6 h4{ flex: 1; overflow: hidden; color: #fff;}
.list6Box .dots span{width: .09rem;height: .09rem;background: rgba(255,255,255,.22);opacity: 1;margin: 0 0 0 .1rem;transition: .5s;}
.list6Box .dots span.active{ background: #fff}

.list7 .a{align-items: center;background: #046787;padding: .35rem;position: relative;z-index: 1}
.list7 .a:before{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: #046787; z-index: -1; height: 0; transition: .5s}
.list7 .a::after{content: "";width: 100%;height: 100%;position: absolute;background: url(../images/list7_b.png) center bottom no-repeat;background-size: 100% auto;z-index: -1;left: 0;transition: .5s;bottom: 0;}
.list7 .imgBox{width: 2.18rem;margin: 0 .24rem 0 0;}
.list7 .imgBox .img{padding-bottom: 68.45%;}
.list7 .txt{ flex: 1; overflow: hidden;}
.list7 .h6{font-size: .15rem;color: rgba(255,255,255, .55);position: relative;z-index: 1;font-family: 'lib';padding: 0 0 0 .2rem;transition: .5s}
.list7 .h6:before{font-size: .17rem;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}
.list7 .flex-right{ justify-content: flex-start}
.list7 h4{color: #fff !important;}
.list7 p{margin: .1rem 0 .2rem;color: rgba(255,255,255, .55);}

.list8Box{background: #fff;padding: .15rem .4rem;margin: .05rem 0 0;}
.list8{ overflow: hidden; overflow-y: scroll; height: calc(.7rem*3); margin-right: -.24rem; padding-right: .24rem}
.list8::-webkit-scrollbar{width:.03rem;height:0}
.list8::-webkit-scrollbar-track{background:#f7f7f7;border-radius: 50vw}
.list8::-webkit-scrollbar-thumb{background:#046787;border-radius: 50vw}
.list8 li{ border-bottom: #f7f7f7 1px solid;}
.list8 .a{ height: .7rem; align-items: center;}
.list8 h4{ flex: 1; }
.list8 .h6{font-size: .15rem;color: #999999;margin: 0 0 0 .2rem;}

.indexef{ background: #f2f2f2;background-size: cover;}
.indexef .tit1 h3{ color: #000;}
.indexef .more1{ color: #e67a18;}
.indexef .more1::before{ background: url(../images/more1.png) center no-repeat; background-size: 100% 100%;}
.indexef .tit1::before{ background: url(../images/tit1.png) center no-repeat;background-size: cover;}

.list9W{ position: relative; z-index: 1;}
.list9W::before{ content: ""; position: absolute; width: 100vw; left: 50%; transform: translateX(-50%); top: .85rem; height: 1px;}
.list9 .a{ padding: 0 .28rem .45rem; display: block; transition: .5s;}
.list9 .time{ height: .86rem; align-items: flex-end; position: relative; padding: 0 0 .14rem;}
.list9 .time h3{font-size: .35rem;color: #000;line-height: 1;font-weight: 500; transition: .5s;}
.list9 .time::before{ content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #e5e5e5; transition: .5s;}
.list9 .time h6{font-size: .15rem;color: rgba(0,0,0,.5);position: relative;padding: 0 0 0 .25rem; transition: .5s;}
.list9 .time h6:before{ content: ""; position: absolute; width: 1px; height: .26rem; background: rgba(0,0,0,.5); left: .12rem; top: 50%; transform: translateY(-50%) rotate(20deg); transition: .5s;}
.list9 h4{margin: .24rem 0 .2rem;color: #000;min-height: .6rem;}
.list9 p{font-size: .14rem;color: rgba(0,0,0,.5);line-height: .25rem;max-height: calc(.25rem* 4) \0; margin-bottom: .35rem;}
.list9 i{ display: flex; align-items: center; justify-content: center; width: .41rem; height: .41rem; border: rgba(255,255,255,1) 1px solid; border-radius: 50vw; font-size: .26rem; color: #fff; font-family: 'lib'; transition: .5s;background: #317383}

.arrow2{display: flex;align-items: center;justify-content: center;width: .41rem;height: .43rem;border: rgba(255,255,255,1) 1px solid;border-radius: 50vw;font-size: .26rem;color: #fff;font-family: 'lib';transition: .5s;position: absolute;top: .65rem;cursor: pointer;background: #317383;z-index: 2;}
.arrow2.prev{ left: -.7rem}
.arrow2.next{ right: -.7rem}

.indexf{ padding-top: 0 !important;}
.list10 .a{ display: block; position: relative; z-index: 1;}
.list10 .txt{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center;}
.list10 .txt img{ width: .68rem;}

.list10s1{ width: 34.8125%;}
.list10s2{ width: 20.25%;}
.list10s3{ width: 44.125%;}

.list10s1 .imgBox .img{ padding-bottom: 84.02%;}

.list10s2 .imgBox .img{ padding-bottom: 70.98%;}
.list10s2 li:nth-child(1){ margin-bottom: 2.5%;}

.list10s3 .imgBox .img{ padding-bottom: 66.28%;}

.indexg{ background: #f9f9f9;}
.list11W{ position: relative; z-index: 1;}
.list11W::before{content: "";position: absolute;width: 100vw;left: 50%;transform: translateX(-50%);top: 1.77rem;height: 1px;border-bottom: #77acbd 1px dashed;}
.list11 li{text-align: center;display: flex;justify-content: center;}
.list11 .a{display: block;position: relative;padding: 0 .34rem;background: #f9f9f9;}
.list11 .a:before{content: "";position: absolute;background: #046787;border-radius: 50%;width: .07rem;height: .07rem;left: 0;top: .5rem;}
.list11 .a:after{content: "";position: absolute;background: #046787;border-radius: 50%;width: .07rem;height: .07rem;right: 0;top: .5rem;}
.list11 .ico{background: url(../images/list11_b.png) center no-repeat;background-size: cover;display: flex;align-items: center;justify-content: center;width: 1.05rem;height: 1.05rem;margin: 0 auto;}
.list11 .ico img{ max-width: .45rem; max-width: .45rem;}
.list11 h4{ font-size: .18rem; color: #363636; transition: .5s; margin: .1rem 0 0}

.arrow3{display: flex;align-items: center;justify-content: center;width: .41rem;height: .43rem;border: rgba(255,255,255,1) 1px solid;border-radius: 50vw;font-size: .26rem;color: #fff;font-family: 'lib';transition: .5s;position: absolute;top: 1.57rem;cursor: pointer;background: #e67a18;z-index: 2;}
.arrow3.prev{ left: -.7rem}
.arrow3.next{right: -.7rem;}

.indexh{padding-top: 0 !important;background-size: cover;padding-bottom: 1.38rem;}
.list12 .imgBox .img{ padding-bottom: 120%;}

.arrow4{display: flex;align-items: center;justify-content: center;width: .43rem;height: .95rem;background: rgba(0,0,0,.23);border-radius: .05rem;font-size: .26rem;color: #fff;font-family: 'lib';transition: .5s;position: absolute;top: 50%;cursor: pointer;z-index: 10;transform: translateY(-50%);}
.arrow4.prev{ left: .2rem}
.arrow4.next{ right: .2rem}

.miaodian{ position: relative;}
#miaodian2, #miaodian4, #miaodian5,#miaodian5s, #miaodian7, #miaodian8{ top: -1rem;}
 
@media(min-width: 1024px){
    .arrow1 .arrow:hover{ color: #fff}
    .arrow1 .arrow:hover{ border: #e67a18 1px dashed;}
    .arrow1 .arrow:hover:after{ transform: scale(1)}

    .more2 .a:hover{ color: #e67a18;}
    .more2 .a:hover:before{ background: url(../images/more2_on.png) center no-repeat;}
    .list2 .a:hover:before{ height: 100%}
    .list2 .a:hover .h4s2{ color: #E67A18}
    .list2 .a:hover *{ color: #fff}
    .list2 .a:hover p{ opacity: .5;}

    .list3 .a:hover:before{ height: 100%;}

    .more1:hover{ letter-spacing: 1px;}

    .list4 .a:hover{ background: #046787}
    .list4 .a:hover h4{ color: #fff;}
    .list4 .a:hover p, .list4 .a:hover .h6{ color: rgba(255,255,255,.5);}

    .list5 .a:hover:before{ height: 100%;}
    .list5 .a:hover *{ color: #fff;}
    .list5 .a:hover p, .list5 .a:hover .h6{ opacity: .5;}

    .list9 .a:hover{ background: #fff;}
    .list9 .a:hover .time h3{ color: #046787;}
    .list9 .a:hover .time h6{ color: #999999;}
    .list9 .a:hover .time h6::before{ background: #999999; opacity: .5;}
    .list9 .a:hover h4{ color: #046787;}
    .list9 .a:hover p{ color: #7e7e7e;}
    .list9 .a:hover i{ border: #e67a18 2px solid; background: #e67a18;}

    .arrow2:hover{ border: #e67a18 2px solid; background: #e67a18;}

    .arrow3:hover{ background: #046787;}

    .list12Box .arrow4:hover{ background: #046787;}
}
@media(max-width: 1024px){
    .banner .imgBox .img{padding-bottom: 31%;}

    .list1 .imgBox{ width: 100%;}
    .list1 .txt{width: 100%;padding: .4rem 0 0;}

    .list2 li{ width: 100%; margin-bottom: .2rem}

    .list3 li{ width: 50%}

    .indexc .content{ width: 100%; margin-bottom: .3rem}
    .indexc .content:last-child{ margin-bottom: 0}

    .indexd .left, .indexd .right{ width: 100%}
    .indexd .right{margin: .3rem 0 0;}

    .list10 .txt img{ width: .36rem}

    .list6 .imgBox .img { padding-bottom: 61.33%;}

    .arrow2{top: .36rem;width: .36rem;height: .36rem;}
    .arrow2.prev{left: auto;right: .75rem;}
    .arrow2.next{right: .25rem;}

    .arrow3.prev{ left: 0;}
    .arrow3.next{ right: 0;}

    .list9 .a{ background: #fff;}
    .list9 .a .time h3{ color: #046787;}
    .list9 .a .time h6{ color: #999999;}
    .list9 .a .time h6::before{ background: #999999; opacity: .5;}
    .list9 .a h4{ color: #046787;}
    .list9 .a p{ color: #7e7e7e;}
    .list9 .a i{ border: #e67a18 2px solid; background: #e67a18;}

    .arrow1{ width: 100%; top: -.2rem;}
}
@media(max-width: 800px){
    .banner .dots{ bottom: .2rem}
    .banner .dots span{width: .33rem;height: .08rem;margin: 0 .05rem !important;}

    .pad1{ padding: .4rem 0}

    .tit1 h3{ font-size: .24rem;}
    .more1::before{ width: 1rem; height: 1.5px;}

    .tit1{margin-bottom: .15rem;}
    .tit1::before{ width: 1rem; height: .26rem;}
    .list1 .more2{ margin: .3rem 0;}
    .list3{ margin: 0 -.23rem 0;}
    .list3 .time{ width: .72rem;}
    .list3 .time h6{ font-size: .14rem;}
    .list3 .time h3{ line-height: .45rem; font-size: .3rem;}

    .list7 .a{ padding: .2rem}
    .list7 .imgBox{ width: 1.9rem}

    .list3 .a{ height: 1.1rem;}

    .arrow4{width: .24rem;height: .45rem;font-size: .2rem;}
    .list9 p{ margin-bottom: .2rem;}
    .list9 .a{padding: 0 .28rem .25rem;}
} 
@media(max-width: 640px){
    .list3 li{ width: 100%; margin-bottom: .2rem}

    .list4 li{width: 100%;margin-bottom: .2rem;}

    .list7 p{ overflow: hidden;text-overflow: ellipsis;white-space: nowrap; margin: .1rem 0}

    .list8Box{ padding: .1rem .2rem}

    .list10s1{width: 62.25%;}
    .list10s2{width: 36.25%;}
    .list10s3{width: 100%;margin: 1.5% 0 0;}

    .list11 .ico{width: .8rem;height: .8rem;}
    .list11 .ico img{ max-width: .3rem; max-width: .3rem;}
    .list11W::before{top: 1.28rem;}
    .list11 .a{ padding: 0 .25rem}
    .list11W{padding: 0 .4rem;}
    .list11 .a:before, .list11 .a:after{ top: .38rem}

    .arrow3{top: 1.1rem;}

    .list5 .a, .list2 .a, .list3 .a{ padding: .15rem;}

    .arrow4.prev{ left: .1rem;}
    .arrow4.next{ right: .1rem;}
} 