html,body{ overflow:hidden;} 
 html.has-scroll-smooth {
     overflow: hidden;
     position: fixed;
     left: 0;
     right: 0;
     top: 0;
     bottom: 0;
 }
 
 html.has-scroll-dragging,
 html.has-scroll-dragging * {
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
 }
 
 .has-scroll-smooth body {
     overflow: hidden;
 }
 
 .c-scrollbar {
     position: absolute;
     right: 0;
     top: 0;
     width: 11px;
     height: 100vh;
     transform-origin: center right;
     transition: transform 0.3s, opacity 0.3s;
     opacity: 0;
     z-index: 100;
 }
 
 .c-scrollbar:hover {
     transform: scaleX(1.45);
 }
 
 .c-scrollbar:hover,
 .has-scroll-dragging .c-scrollbar,
 .has-scroll-scrolling .c-scrollbar {
     opacity: 1;
 }
 /* .c-scrollbar_thumb {
     position: absolute;
     top: 0;
     right: 0;
     background-color: #b21b21;
     width: 7px;
     margin: 2px;
     cursor: -webkit-grab;
     cursor: grab;
 } */
 
 .has-scroll-dragging .c-scrollbar_thumb {
     cursor: -webkit-grabbing;
     cursor: grabbing;
 }
 /*  
 ::-webkit-scrollbar {
     width: 8px;
     height: 10px;
 }
 
 ::-webkit-scrollbar-track {
     border-radius: 0;
 }
 
 ::-webkit-scrollbar-thumb {
     -webkit-box-shadow: inset 0 0 6px #00c7a1;
     background-color: #00c7a1;
 }
 
 ::-webkit-scrollbar-thumb:hover {
     border-radius: 5px;
     -webkit-box-shadow: inset 0 0 6px #7ccfc0;
     background-color: #7ccfc0;
 } */
 
 body {
     width: 100%;
 }
 
 .banner-cicle{ position:absolute;width: 5px;height: 5px;background: #fff;border-radius: 50%;}
 .banner-cicle:after, .banner-cicle:before {
    content: "";
    width: 5px;
    height: 5px;
    background: rgba(215,12,37,0.3);
    border-radius: 50%;
    position: absolute;
    animation: scale11 2s infinite;
    left: 0;
    top: 0;
}
.banner-cicle:before{animation: scale22 2s infinite;}
@keyframes scale11{0%{ transform: scale(1); opacity:.9}100%{ transform: scale(3); opacity: 1;}}
@keyframes scale22{0%{ transform: scale(1); opacity:.9}100%{ transform: scale(6); opacity: 1;}}
 .cicle01{ top:55%; left:21%;}
 .cicle02{ bottom:20%; left:30%;} 
  .cicle03{ top:46%; left:45%;} 
   .cicle04{ top:35%; left:55%;}
   .cicle05{ top:52%; left:70%;}
   #banner{ height:100vh; width:100%; overflow:hidden; padding-top:80px;}
 #banner .swiper-container {
     width: 100%;
     height: 100%;
  
 }
 
 #banner-video{position: absolute; width:100%; height:100%;object-fit: cover; z-index:9999}
 #banner .swiper-slide {
 
     overflow: hidden; background:#000;
 }
 
 #banner .swiper-pagination {
     text-align: left;
     padding: 0 4%;
     bottom: 90px;
 }
 
 #banner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
     margin: 0 0;
 }
 
 #banner .swiper-pagination-bullet {
     width: 33px;
     height: 55px;
     text-align: center;
     line-height: 55px;
     font-size: 18px;
     color: #d70c25;
     opacity: 1;
     outline: none;
     border-radius: 0;
     background: none;
 }
 
 #banner .swiper-pagination-bullet-active {
     color: #fff;
     background: url(../images/banner-icon.png)no-repeat;
 }
 
 .swiper-slide-active .img-box{-webkit-animation-name:scaleDraw;/*关键帧名称*/
            -webkit-animation-timing-function:ease-in-out;
	/*动画的速度曲线*/
            -webkit-animation-iteration-count:1;
	/*动画播放的次数*/
            -webkit-animation-duration:10s;
			-webkit-animation-fill-mode:forwards}
			
	@keyframes scaleDraw {
	/*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
            0% {
	-webkit-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
	/*开始为原始大小*/
}

100% {
	-webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}
}

 .title {
      
     z-index: 10;
     position: absolute;
     bottom: 20%;
     left: 4%; opacity:0; transition-duration:.5s;
 }
 .swiper-slide-active .title{ opacity:1;}
 .title h3 {
     font-weight: 700;
     font-size: 0.36rem;
     letter-spacing: -1px;
     color:#fff;
 }
 .banner-wb{ position:absolute; right:-100%; top:50%; max-height:100%; transform:translateY(-50%); height:100%; transition-duration:1s;}
 .banner-wb img{ height:100%;}
 .swiper-slide-active .banner-wb{ right:0;}
 .img-box {
     width: 100%;
     height: 100%;
     position: absolute;
     transition-duration: 1s;
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.5, 0, 0, 1);
     overflow: hidden;
 }
 .banner-img {
    width: 100%;
    height: 100%;
    position: relative;
    background-size: cover !important;
    clip-path: circle(0%);
    transition: 1.2s all ease-in-out;
    animation: bgBoxAn 5s linear infinite;
    z-index: 2;
}



.close_bannerVideo {
    position: absolute;
    bottom: 2%;
    left: calc(50% - 50px);
    width: 100px;
    text-align: center;
    z-index: 9999; cursor:pointer
}
.close_Line {
    width: 2px;
    height: 30px;
    display: inline-block;
    overflow: hidden;
}
.close_Line i {
    width: 2px;
    height: 30px;
    background-color: #d0111b;
    display: inline-block;
    animation: close_Line 2.8s linear 0s infinite;
}
.close_bannerVideo .close_txt {
    width: 100%;
    height: 16px;
    line-height: 16px;
    position: relative;
}
.close_bannerVideo p {
    overflow: hidden;
    display: inline-block;
    width: 100%;
    height: 16px;
    line-height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    animation: text_t 1s linear 0s 1 forwards;
}
.close_bannerVideo p span {
    font-size: 12px;
    color: #d0111b;
    line-height: 16px;
    display: inline-block;
    height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    animation: text_b 1s linear 0s 1 forwards;
}

@keyframes close_Line
        {
            0%   {transform:translateY(-100%)}
            25%   {transform:translateY(0%)}
        75%   {transform:translateY(0%)}
        100%  {transform: translateY(100%)}}








/* .banner-video {
    width: 100%;
    height: 100%;
    position: relative;
    background-size: cover !important;
    clip-path: circle(0%);
    transition: 1.2s all ease-in-out;
    z-index: 2;
} */

@keyframes bgBoxAn {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}
 .img-box img {
     width: 100%;
     height: 100%;
     /* object-fit: cover; */
 
     transition-timing-function: cubic-bezier(0.5, 0, 0, 1);
     transition-property: transform;
 }
 
 .button-prev,
 .button-next {
     transition: 0.5s;
     outline: none;
     position: absolute;
     width: 140px;
     z-index: 10;
     top: 65vh;
     transform: translateY(-34px);
     cursor: pointer;
 }
 
 .button-prev {
     left: 4vw;
 }
 
 .button-next {
     right: 4vw;
 }
 
 .button.disabled {
     opacity: 0.2;
     cursor: default;
 }
 
 #arrow-svg-home {
     transform: translateY(353px);
 }
 
 .button-next #arrow-svg-home {
     transform: translateY(353px) rotateY(180deg);
     transform-origin: 80px 0px 0px;
 }
 
 #banner .slogan {
     width: 4.73rem;
     height: 8.42rem;
     position: absolute;
     right: 0;
     z-index: 99;
     top: 5%;
 }
 
 svg {
     transition: 0.5s;
 }
 
 .cls-1 {
     transition: 0.5s;
     opacity: 0.4;
     transform-origin: -20px 40px;
     opacity: 1;
 }
 
 .cls-4 {
     transition: 0.5s;
     stroke-width: 2px;
     stroke: #fff;
     fill: none;
     stroke-dasharray: 1;
     stroke-dashoffset: 1;
     opacity: 0.4;
     transform-origin: 0px 0px 0px;
 }
 
 #arrow-trg {
     transition: 0.5s;
     fill: #fff;
     transform: rotateY(180deg) translate(-53px, 39px);
 }
 
 #line {
     transition: 0.5s;
     stroke: #fff;
     transform: translate(50px, 42px);
 }
 
 
 
 @keyframes fadeIniup {
     0% {
         opacity: 0;
         transform: translateY(60px);
     }
     100% {
         opacity: 1;
         transform: translateY(0);
     }
 }
 
 .he_fadeup1 {
     -webkit-animation: fadeIniup 1s ease both;
     animation: fadeIniup 1s ease both;
     -ms-animation: fadeInUp 1s ease both;
     animation-delay: 0.3s;
 }
 
 .index {
     width: 100%;
 }
 
 .index .f1 {
     width: 100%;
     position: relative;
     overflow: visible !important;
     z-index: 9999;
     pointer-events: none;
 }
 
 .index .f1 .video {
     width: 100%;
     height: 100vh;
     position: relative;
 }
 
 .index .f1 .video .f2Text {
     width: 100%;
     position: absolute;
     z-index: 10;
     color: white;
     top: 50%;
     opacity: 0;
 }
 
 .index .f1 .video .f2Text .tit {
     text-align: center;
     font-size: 2vw;
 }
 
 .index .f1 .video video {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     object-fit: cover !important;
 }
 
 .index .f2 {
     width: 100%;
     position: absolute;
     padding: 0.3rem 5vw 0 5vw;
     z-index: 9;
 }
 
 .index .f2 .imgBox {
     width: 100%;
     display: flex;
     justify-content: space-between;
 }
 
 .index .f2 .imgBox .left {
     width: 21vw;
 }
 
 .index .f2 .imgBox .left .imgBox {
     width: 21vw;
     height: 19vw;
     overflow: hidden;
     margin-bottom: 1vw;
 }
 
 .index .f2 .imgBox .left .imgBox .img {
     width: 21vw;
     height: 19vw;
     background-size: cover !important;
     cursor: pointer;
     overflow: hidden;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .left .imgBox .img .text {
     text-align: center;
     position: relative;
     padding-top: 16vw;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .left .imgBox .img .text .name {
     font-size: 1.5vw;
     color: #ffffff;
 }
 
 .index .f2 .imgBox .left .imgBox .img .text .more {
     display: block;
     width: 120px;
     height: 40px;
     background-color: #d70c25;
     border-radius: 3px;
     color: white;
     font-size: 14px;
     line-height: 40px;
     text-align: center;
     margin: 1vw auto 0 auto;
     opacity: 0;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .left .imgBox .img::before {
     content: '';
     width: 21vw;
     height: 19vw;
     position: absolute;
     background-size: cover !important;
 }
 
 .index .f2 .imgBox .left .imgBox:hover .img {
     transform: scale(1.1);
 }
 
 .index .f2 .imgBox .left .imgBox:hover .img .text {
     padding-top: 7vw;
 }
 
 .index .f2 .imgBox .left .imgBox:hover .img .text .more {
     opacity: 1;
 }
 
 .index .f2 .imgBox .middle {
     width: 51vw;
     height: 40vw;
     margin: 0 1vw;
     background: transparent;
 }
 
 .index .f2 .imgBox .right {
     width: 21vw;
 }
 
 .index .f2 .imgBox .right .imgBox {
     width: 21vw;
     height: 19vw;
     overflow: hidden;
     margin-bottom: 1vw;
 }
 
 .index .f2 .imgBox .right .imgBox .img {
     width: 21vw;
     height: 19vw;
     background-size: cover !important;
     cursor: pointer;
     overflow: hidden;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBox .img .text {
     text-align: center;
     position: relative;
     padding-top: 16vw;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBox .img .text .name {
     font-size: 1.5vw;
     color: #ffffff;
 }
 
 .index .f2 .imgBox .right .imgBox .img .text .more {
     display: block;
     width: 120px;
     height: 40px;
     background-color: #d70c25;
     border-radius: 3px;
     color: white;
     font-size: 14px;
     line-height: 40px;
     text-align: center;
     margin: 1vw auto 0 auto;
     opacity: 0;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBox .img::before {
     content: '';
     width: 21vw;
     height: 13vw;
     position: absolute;
     background-size: cover !important;
 }
 
 .index .f2 .imgBox .right .imgBox:hover .img {
     transform: scale(1.1);
 }
 
 .index .f2 .imgBox .right .imgBox:hover .img .text {
     padding-top: 7vw;
 }
 
 .index .f2 .imgBox .right .imgBox:hover .img .text .more {
     opacity: 1;
 }
 
 .index .f2 .imgBox .right .imgBoxs {
     display: flex;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2 {
     width: 10vw;
     height: 13vw;
     overflow: hidden;
     /*margin-bottom: 1vw;*/
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2 .img {
     width: 10vw;
     height: 13vw;
     background-size: cover !important;
     cursor: pointer;
     overflow: hidden;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2 .img .text {
     text-align: center;
     position: relative;
     padding-top: 9vw;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2 .img .text .name {
     font-size: 1.5vw;
     color: #ffffff;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2 .img .text .more {
     display: block;
     width: 1.2rem;
     height: 0.4rem;
     background-color: #00c8a2;
     border-radius: 3px;
     color: white;
     font-size: 0.14rem;
     line-height: 0.4rem;
     text-align: center;
     margin: 1vw auto 0 auto;
     opacity: 0;
     transition: 0.5s all;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2:nth-child(1) {
     margin-right: 1vw;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2:hover .img {
     transform: scale(1.1);
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2:hover .img .text {
     padding-top: 5.5vw;
 }
 
 .index .f2 .imgBox .right .imgBoxs .imgBox2:hover .img .text .more {
     opacity: 1;
 }
 
 .index .f3 {
     width: 100%;
     display: inline-block;
     text-align: center;
     position: relative;
     margin: 3vw auto;
 }
 
 .f3L .textBox {
     transform: translateY(-3vw);
     transition: 2s all;
     position: relative;
     opacity: 0;
 }
 
 .f3L .active {
     transform: translateX(0);
     opacity: 1;
 }
 
 .f3A {
     width: 100%;
     position: relative;
     z-index: 5;
     overflow: hidden; top:-30px;
 }
 
 .f3A .imgBox {
     width: 100%;
     background-size: cover !important;
     transition: 2s all;
     padding: 1rem 5vw 1.3rem;  
 }
 
 .new-ti {
     position: relative;
 }
 
 .new-ti h1 {
     font-size: 0.5rem;
     font-family: "SourceHanSansCN-bold";
 }
 
 .new-ti .an {
     width: 2.58rem;
     font-size: 0.2rem;
     color: #fff;
     border-radius: 0.5rem;
     background: #d70c25;
     overflow: hidden;
     position: relative;
     cursor: pointer;
     text-align: center;
     border: 1px solid #d70c25;
     position: absolute;
     right: 0;
     top: 10px;
 }
 
 
 .new-ti .an span {
    position: relative;
     z-index: 2;
     transition-duration: 1s;
     margin: 0 auto;
     line-height: 0.57rem;
     height: 0.57rem;
     display: flex;justify-content: center;align-items: center; transition-duration:.5s;
 }
  .new-ti .an span img{ transition-duration:.5s; margin-left:0.1rem;}
 .new-ti .an:hover img{ margin-left:0.25rem;}
 .new-ti .an:hover{-moz-box-shadow:0px 0px 9px #BABABA; -webkit-box-shadow:0px 0px 9px #BABABA; box-shadow:0px 0px 9px #BABABA;} 
  
 /* .new-ti a {
     position: absolute;
     right: 0;
     top: 10px;
     background: #d70c25;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 20px;
     width: 258px;
     text-align: center;
     line-height: 57px;
     color: #fff;
     border-radius: 30px;
 }
 
 .new-ti a img {
     margin-left: 15px;
     transition-duration: .5s;
 }
 
 .new-ti a:hover {
     -moz-box-shadow: 0px 0px 15px #BFBFBF;
     -webkit-box-shadow: 0px 0px 15px #BFBFBF;
     box-shadow: 0px 0px 15px #BFBFBF;
 }
 
 .new-ti a:hover img {
     margin-left: 10px;
 } */
 
 .new-box {
     position: relative;
     -moz-box-shadow: 0px 0px 5px #BFBFBF;
     -webkit-box-shadow: 0px 0px 5px #BFBFBF;
     box-shadow: 0px 0px 5px #BFBFBF;
     border-radius: 30px;
     overflow: hidden;
 }
 
 .ibox-news {
     padding-top: 150px;
     position: relative;
 }
 
 .ibox-news .swiper-slide {
     padding: 5px;
 }
 
 .new-box dt {
     overflow: hidden;
     position: relative;
     transition-duration: .5s; height:3.2rem;
 }
 
 .new-box dt p {
     font-size: 0.28rem;
     color: #fff;
     position: absolute;
     bottom: 0;
     padding: 30px;
     font-family: "SourceHanSansCN-bold";
     font-weight: bold;
 }
 
 .new-box dt img {
     width: 100%;
     display: block;
     transition-duration: .5s;
     border-radius: 30px; height:100%;
 }
 
 .new-box dd {
     background: #fff;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     transition-duration: .5s;
 }
 
 .new-box dd div {
     padding: 0 0.4rem;
 }
 
 .new-box dd div h1 {
     font-size: 0.32rem;
     font-family: "SourceHanSansCN-bold";
 }
 
 .new-box dd div span {
     font-size: 0.24rem;
     color: #d70c25;
     padding: 0.29rem 0;
     display: block;
 }
 
 .new-box dd div p {
     font-size: 0.19rem;
     color: #666;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     line-clamp: 2;
     -webkit-box-orient: vertical;
 }
 
 .new-box:hover dd {
     opacity: 0;
 }
 
 .ibox-news .swiper-button-prev:after,
 .ibox-news .swiper-button-next:after,
 .ibox-news .swiper-rtl .swiper-button-next:after {
     display: none;
 }
 
 .ibox-news .swiper-button-next,
 .ibox-news .swiper-button-prev {
     width: 0.53rem;
     height: 0.53rem;
     background: url(../images/pre.png) no-repeat center #fff;
     border-radius: 50%;
     -moz-box-shadow: 0px 0px 5px #BFBFBF;
     -webkit-box-shadow: 0px 0px 5px #BFBFBF;
     box-shadow: 0px 0px 5px #BFBFBF;
     top: 0.27rem;
     margin-top: 0;
     outline: none;
 }
 
 .ibox-news .swiper-button-next {
     transform: rotate(180deg);
     right: auto;
     left: 0.9rem;
 }
 
 .ibox-news .swiper-button-next:hover,
 .ibox-news .swiper-button-prev:hover {
     background: url(../images/pre1.png) no-repeat center #d70c25;
 }
 
 .ibox-news .swiper-container {
     transform: translateX(300px);
     transition: 1.5s all;
     position: relative;
     opacity: 0;
 }
 
 .ibox-news .swiper-container.active {
     transform: translateX(0);
     opacity: 1
 }
 
 .f3B {
     width: 100%;
     position: relative;
     z-index: 6;
     overflow: hidden;
 }
 
 .f3B .imgBox {
     width: 100%;
     transition: 2s all;
     background: url(../images/xt.png) no-repeat bottom center #fff;
     padding: 0 5vw 2rem 10vw;
 }
 
 .img-le {
     width: 47%;
     transform: translateX(100px);
     transition: 1.5s all;
     opacity: 0;
 }
 
 .cx-le {
     padding-top: 1rem;
     transform: translateX(-1rem);
     transition: 1.5s all;
     opacity: 0;
 }
 
 .cx-le h1 {
     font-size: 0.5rem;
     font-family: "SourceHanSansCN-bold";
 }
 
 .cx-le p {
     font-size: 0.3rem;
     padding: 0.4rem 0 1.4rem 0;
 }
 
 .cx-le .an {
     width: 2.58rem;
     font-size: 0.2rem;
     color: #fff;
     border-radius: 0.5rem;
     background: #d70c25;
     overflow: hidden;
     position: relative;
     cursor: pointer;
     text-align: center;
     border: 1px solid #d70c25;
 }
 
 .cx-le .an span {
     position: relative;
     z-index: 2;
     transition-duration: 1s;
     margin: 0 auto;
     line-height: 0.57rem;
     height: 0.57rem;
     display: flex;justify-content: center;align-items: center; transition-duration:.5s;
 }
  .cx-le .an span img{ transition-duration:.5s; margin-left:0.1rem;}
 .cx-le .an:hover img{ margin-left:0.25rem;}
 .cx-le .an:hover{-moz-box-shadow:0px 0px 9px #BABABA; -webkit-box-shadow:0px 0px 9px #BABABA; box-shadow:0px 0px 9px #BABABA;}
/* .cx-le .an:hover span {
     color: #333;
     background: url(../images/jt1.png) no-repeat right center;
 }*/
 
/* .cx-le .an:after {
     width: 0;
     height: 0;
     border-radius: 100%;
     background: #fff;
     position: absolute;
     left: -0.6rem;
     bottom: -0.6rem;
     content: "";
     transition-duration: 1s;
     z-index: 1;
 }*/
 
 .cx-le .an:hover {
     border: 1px solid #d70c25;
 }
 
 /*.cx-le .an:hover:after {
     width: 4rem;
     height: 4rem;
 }*/
 
 .cx-le.active,
 .img-le.active {
     opacity: 1;
     transform: translateX(0)
 }
 
 .cx-le a img {
     margin-left: 0.15rem;
     transition-duration: .5s;
 }
 
 .cx-le a:hover {
     -moz-box-shadow: 0px 0px 15px #BFBFBF;
     -webkit-box-shadow: 0px 0px 15px #BFBFBF;
     box-shadow: 0px 0px 15px #BFBFBF;
 }
 
 .cx-le a:hover img {
     margin-left: 0.1rem;
 }
 
 .index .f3C {
     width: 100%;
/*     height: 74vh;*/
     position: relative;
 /*    margin-top: -74vh;*/
     z-index: 7;
 }
 
 .index .f3C .imgBox {
     width: 100%;
     transition: 2s all;
     background: url(../images/bg1.png) no-repeat bottom left #fff;
     height: 74vh;
     padding: 0 6vw;
     position: relative;
 }
 
 .index .f3C .cx-le p {
     padding: 0.4rem 0 1rem 0;
 }
 
 .index .f3C .cx-le {
     position: absolute;
     top: 20%;
     right: 0;
     opacity: 1;
     transform: translateX(0%);
 }
 
 .index .f3C .cx-le.active {
     transform: translateX(-122px);
     opacity: 1;
 }
 
 .index .f3D {
     width: 100%;
     position: relative;
     background: url(../images/bg2.png) no-repeat center;
     padding: 0.6rem 0;
     transition: 2s all;
      
     transition: 1.5s all;
     opacity: 1;
 }
 
 .index .f3D.active {
     opacity: 1;
  
 }
 
 .index .f3D h1 {
     text-align: center;
     color: #fff;
     font-size: 0.48rem;
     font-family: "SourceHanSansCN-bold";
     margin-bottom: 0.2rem;  
 }
 
 .index .f3D h1.active {
     opacity: 1;
     
 }
 
 .index .f3D ul {
     display: flex;
     justify-content: center;
     align-items: center;
 }
 
 .index .f3D ul li {
     text-align: center;
     line-height: 0.7rem;
     border: 1px solid #fff;
     border-radius: 0.5rem;
     margin: 0 1%;
     padding: 0 0.3rem; transition-duration:.5s;
 }
 .index .f3D ul li:hover{-moz-box-shadow:0px 0px 9px #BABABA; -webkit-box-shadow:0px 0px 9px #BABABA; box-shadow:0px 0px 9px #BABABA;}
 .index .f3D ul li a {
     display: block;
     color: #fff;
     font-size: 0.24rem;
 }
 /* 2023-8-14 */
 

 
 
 
 @media screen and (max-width: 1440px) {}
 
 @media screen and (max-width: 1366px) {
     .subNav ul li {
         width: calc(100% / 7);
         margin-left: 0vw;
         margin-right: 0vw;
     }
 }
  @media screen and (max-width: 1280px) {
     .subNav ul li {
         width: auto;
     }
	 .socail .yy{ font-size:0.26rem}
 }
 @media screen and (max-width:1400px) {
     .nav ul li ul li a {
         padding: 0.5vw 0;
         font-size: 14px;
     }
     .nav ul li ul {
         padding: 10px 0px;
     }
     .subNav ul li a {
         font-size: 14px;
     }
     .subNav ul li a:first-child {
         font-size: 16px;
     }
 }
 
 @media (max-width: 1660px) {
     .index .f3 {
         margin-top: -10vw;
     }
     .index .f3 .item .icon {
         width: 4.5vw;
     }
 }
 
 @media (max-width: 1580px) {
     .nav {
         width: calc(100% - 500px);
     }
	 #banner .swiper-pagination{ bottom:20px;}
 }
 
 @media (max-width: 1280px) {
	 #banner .swiper-pagination{ bottom:20px;}
 
	 .ibox-news{ padding-top:100px;}
	 .f3B .imgBox,.index .f3C .imgBox{ background-size:contain;}
	 .f3A{ top:0; padding-top:70px;}
	 }
	 
 
 
  @media (max-width: 760px) {
	#test,.banner-img,.right-nav{ display:none !important;}  
	  
	  
	  }