body{overflow:hidden}
/* -----------------------------one--------------------------------- */
.one-bg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.one-bg img{display: block;width: 100%;height: 100%;}

.one-words{position: absolute;z-index: 2;width: 88%;left: 6%;top: 50%;text-align: center;}
.one-words h4{font-size: 46px;color: #fff;font-weight: bold;}


.active .one-words{animation: oneDown 1s ease-in-out;}


/* banner */
.banner-section{z-index:2;background:#fff;height:100vh;opacity:1 !important}
.section{opacity:0;animation:toChange 1s ease both 1s}
@keyframes toChange{
    0%{opacity: 0;}
    100% {opacity: 1;}
}



.banner-container{width: 100%;position: relative;height: 100%;}
.banner{width: 100%;height: 100%;}
.banner .swiper-container{width: 100%;height: 100%;}

.banner-picwords{width: 100%;height: 100%;}
.banner-pic{width: 100%;height: 100%;overflow: hidden;}
.banner-pic img{width: 100%;height: 100vh;object-fit: cover;position:relative;z-index:4}

.banner-words{position: absolute;width: 100%;left: 0;top: 50%;transform: translate(0,-50%);z-index: 6;text-align: center;}
.banner-words h4{font-size: 46px;color: #fff;font-weight: bold;}

.swiper-slide-active .banner-words h4{animation: oneDown 1.5s ease-in-out 100ms;}

.banner .swiper-pagination{bottom: 44px;}
.banner .swiper-pagination-bullet {width: 6px;height: 6px;display: inline-block;border-radius: 100%;background: #fff;opacity: 0.8;vertical-align: middle;position: relative;}
.banner .swiper-pagination-bullet:after{content: "";width: 20px;height: 20px;position: absolute;left: 50%;top: 50%;background: transparent;border: 2px solid #fff;border-radius: 100%;margin-top: -10px;margin-left: -10px;opacity: 0;}
.banner .swiper-pagination-bullet-active {width: 6px;height: 6px;opacity: 1;position: relative;}
.banner .swiper-pagination-bullet-active:after {opacity: 0.6;}
.banner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 16px;}












@keyframes oneDown{
    0%   {
        opacity: 0;
        -webkit-transform: scale(0.5, 0.5);
        transform: scale(0.5, 0.5);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

.one-next{width: 100%;text-align: center;position: absolute;left: 0;bottom: 12px;}
.one-next i{
    cursor: pointer;display: inline-block;width: 50px;height: 50px;
    background: url('../images/index/onpage.png') no-repeat center center / 20px auto;animation: oneDownArr 1s ease-in-out infinite;
}
@keyframes oneDownArr{
    0%   {
        opacity: 0;transform: translateY(-6px);
    }
    100% {
        opacity: .5;transform: translateY(0);
    }
}


/* -------------------------------two---------------------------------- */
.two-bg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.two-bg img{display: block;width: 100%;height: 100%;}

.logoimg{display: block;margin-top: 25px;}
.logoimgH{display: none;margin-top: 25px;}
.Header-changeColor .logoimgH{display: block;}
.Header-changeColor .logoimg{display: none;}
.Header-changeColor .Hnav .Hname{color: #777;transition: all .6s ease-in-out;}
.Header-changeColor .Hnav .Hname i{background-color: #777;transition: all .6s ease-in-out;}
.Header-changeColor .Hsrch-menu{background: url('../images/public/icon-Hsrch.png') no-repeat center center;}


.pub-title{position: absolute;top: 14%;left: 16%;}
.pub-title h6{font-size: 160px;color: #fff;opacity: .1;position: absolute;text-transform: uppercase;left: -100px;}
.pub-title h4{
    font-weight: bold;font-size: 36px;color: #333;margin-top: 60px;
    opacity: 0;
    transition: all 1s;
    margin-left: -100px;
}
.pub-title h4 span{color: #07459b;}
.pub-title p{
    font-size: 18px;color: #777;margin-top: 10px;
    opacity: 0;
    transition: all 1s;
    margin-left: 100px;
}
.pub-title i{
    width: 34px;height: 3px;display: block;background-color: #07459b;margin-top: 30px;
    opacity: 0;
    transition: all 1s;
}


.active .pub-title h4{
    margin-left: 0;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .pub-title i{
    opacity: 1;
    transition-delay: 1s;
}
.active .pub-title p{
    margin-left: 0;
    opacity: 1;
    transition-delay: 0.7s;
}

.two-wordsbox{
    position: absolute;
    width: 66%;
    left: 17%;
    bottom: 20%;
}
.two-words{
    width: 100%;
}
.two-words ul{
    margin-left: -2%;
}
.two-words ul li{
    width: 23%;margin-left: 2%;
    height: 320px;
    border: 1px solid #004098;text-align: center;
    position: relative;float: left;background-color: transparent;
}
.two-words ul li:hover{
    margin-top: -20px;
    background-color: #004098;
}
.two-words-size{
    position: absolute;
    width: 80%;
    left: 10%;
    top: 50%;
    transform: translate(0,-50%);
}
.two-words ul li i{display: block;margin: 0 auto;background-repeat: no-repeat;transition: all .6s;}
.two-words ul li h4{font-size: 18px;color: #4677ba;margin-top: 18px;transition: all .6s;}
.two-words ul li p{
    font-size: 14px;color: #4677ba;line-height: 24px;margin-top: 14px;
    height: 0;overflow: hidden;transition: all .6s;text-align: left;
    /* display: -webkit-box;text-overflow: ellipsis;
    -webkit-line-clamp: 2;-webkit-box-orient: vertical; */
}
.two-words ul li:hover p{height: 140px;}
.two-words ul li:nth-child(1) i{background-image: url('../images/index/two_icon1H.png');width: 69px;height: 69px;}
.two-words ul li:nth-child(2) i{background-image: url('../images/index/two_icon2H.png');width: 90px;height: 69px;}
.two-words ul li:nth-child(3) i{background-image: url('../images/index/two_icon3H.png');width: 67px;height: 68px;}
.two-words ul li:nth-child(4) i{background-image: url('../images/index/two_icon4H.png');width: 68px;height: 68px;}

.two-words ul li:nth-child(1):hover i{background-image: url('../images/index/two_icon1.png');}
.two-words ul li:nth-child(2):hover i{background-image: url('../images/index/two_icon2.png');}
.two-words ul li:nth-child(3):hover i{background-image: url('../images/index/two_icon3.png');}
.two-words ul li:nth-child(4):hover i{background-image: url('../images/index/two_icon4.png');}

.two-words ul li:hover h4{color: #fff;}
.two-words ul li:hover p{color: #fff;}


.two-words ul li:nth-child(1),
.two-words ul li:nth-child(2){
    transform: translateX(-200px);
    opacity: 0;
    transition: all 1s;
}
.two-words ul li:nth-child(3),
.two-words ul li:nth-child(4){
    transform: translateX(200px);
    opacity: 0;
    transition: all 1s;
}

.active .two-words ul li:nth-child(1),
.active .two-words ul li:nth-child(2),
.active .two-words ul li:nth-child(3),
.active .two-words ul li:nth-child(4){
    transform: translateX(0);
    opacity: 1;
}


/* -------------------------------three---------------------------------- */
.three-qq{
    position: absolute;
    right: 0;
    width: 400px;
    height: 400px;
    border-radius: 100%;
    background-color: #f9fafc;
    right: -200px;
    top: 60%;
    opacity: 0;
    transition: all 1s;
}
.three-title h6{color: #e7e7e7;}
.active .three-qq{
    top: 20%;
    opacity: 1;
    transition-delay: 0.7s;
}

.three-words{
    position: absolute;
    width: 76%;
    left: 12%;
    bottom: 6%;
    height: 500px;
    background-color: transparent;
}

.three-words-pic{
    width: 451px;height: 453px;margin-left: 20px;position: relative;
    opacity: 1;
    transition: all 1s;
    transform: translateY(0px);
}
.swiper-slide-active .three-words-pic{
    transform: translateY(0px);
    opacity: 1;
    transition-delay: .8s;
}


.three-words-qq{width: 100%;height: 100%;animation-iteration-count: infinite;animation: bigQuanF 20s linear infinite;}
@keyframes bigQuanF {
    0% {transform: rotate(0);}
    100% {transform: rotate(360deg);}
}

.three-words-man{
    position: absolute;
    width: 326px;height: 326px;
    left: 50%;top: 50%;
    margin-top: -163px;
    margin-left: -163px;
}


.three-fonts{
    position: absolute;top: 0;text-align: right;width: 440px;
    right: 20px;
}

.three-fonts h4{font-size: 36px;color: #004098;}
.three-fonts p{
    font-size: 16px;color: #777;margin-top: 16px;line-height: 26px;height: 78px;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;text-align: left;
}
.three-fonts a{display: inline-block;font-size: 14px;color: #8ba4c6;margin-top: 24px;}
.three-fonts a:hover{color: #004098;}

.three-navbar{
    position: absolute;
    bottom: 14%;
    right: 12%;
    width: 860px;
    z-index: 9;
}
.three-line{
    width: 80%;
    height: 1px;
    position: absolute;
    z-index: 1;
    background-color: #dee5f0;
    left: 10%;
    top: 32px;
}

.three-navbar ul li{
    width: 20%;float: left;text-align: center;cursor: pointer;
}
.three-navbar ul li h6{
    width: 64px;z-index: 8;height: 64px;margin: 0 auto;
    background-color: #dee5f0;border-radius: 100%;text-align: center;position: relative;
}

.three-navbar ul li.on h6:after{
    content: "";
    display: block;
    border-radius: 50%;
    opacity: 0;
    position: absolute;
    width: 128px;
    height: 128px;
    top: -32px;
    left: -32px;
    background-color: rgba(38,93,168,0.7);
    animation: ripple 3s ease-out 1.2s infinite;
    -webkit-animation: ripple 3s ease-out 1.2s infinite;
    z-index: -1;
}
.three-navbar ul li.on h6:before{
    content: "";
    display: block;
    border-radius: 50%;
    opacity: 0;
    position: absolute;
    width: 128px;
    height: 128px;
    top: -32px;
    left: -32px;
    background-color: rgba(38,93,168,0.54);
    animation: ripple 3s ease-out .6s infinite;
    -webkit-animation: ripple 3s ease-out .6s infinite;
    z-index: -1;
}
@-webkit-keyframes ripple{0%{opacity:0;-webkit-transform:scale(.1)}5%{opacity:1}to{opacity:0;-webkit-transform:scale(1)}}
@keyframes ripple{0%{opacity:0;-webkit-transform:scale(.1);transform:scale(.1)}5%{opacity:1}to{opacity:0;-webkit-transform:scale(1);transform:scale(1)}}

.three-navbar ul li:hover p{color: #004098;}

.three-navbar ul li h6 i{display: inline-block;background-repeat: no-repeat;position: relative;z-index: 11;}
.three-navbar ul li p{font-size: 15px;color: #555;margin-top: 30px;}


.three-navbar ul li:nth-child(1) h6 i{background-image: url('../images/index/three_ic1.png');width: 35px;height: 29px;margin-top: 17.5px;}
.three-navbar ul li:nth-child(2) h6 i{background-image: url('../images/index/three_ic2.png');width: 28px;height: 31px;margin-top: 16.5px;}
.three-navbar ul li:nth-child(3) h6 i{background-image: url('../images/index/three_ic3.png');width: 49px;height: 18px;margin-top: 23px;}
.three-navbar ul li:nth-child(4) h6 i{background-image: url('../images/index/three_ic4.png');width: 30px;height: 31px;margin-top: 16.5px;}
.three-navbar ul li:nth-child(5) h6 i{background-image: url('../images/index/three_ic7.png');width: 29px;height: 33px;margin-top: 15.5px;}
.three-navbar ul li:nth-child(6) h6 i{background-image: url('../images/index/three_ic6.png');width: 32px;height: 32px;margin-top: 16px;}
.three-navbar ul li:nth-child(7) h6 i{background-image: url('../images/index/three_ic7.png');width: 32px;height: 32px;margin-top: 16px;}

.three-navbar ul li.on h6{background-color: #004098;}

.three-navbar ul li:nth-child(1).on h6 i{background-image: url('../images/index/three_ic1H.png');}
.three-navbar ul li:nth-child(2).on h6 i{background-image: url('../images/index/three_ic2H.png');}
.three-navbar ul li:nth-child(3).on h6 i{background-image: url('../images/index/three_ic3H.png');}
.three-navbar ul li:nth-child(4).on h6 i{background-image: url('../images/index/three_ic4H.png');}
.three-navbar ul li:nth-child(5).on h6 i{background-image: url('../images/index/three_ic7H.png');}
.three-navbar ul li:nth-child(6).on h6 i{background-image: url('../images/index/three_ic6H.png');}
.three-navbar ul li:nth-child(7).on h6 i{background-image: url('../images/index/three_ic7H.png');}

#fp-nav ul li a span, .fp-slidesNav ul li a span{background: #004098;}



/* -------------------------------four---------------------------------- */
.four-title h6{color: #bbc8e6;}
.four-bg{position: relative;width: 100%;height: 100%;background-color: #e9edf5;}
.four-newsbox{
    position: absolute;
    width: 68%;
    left: 16%;
    bottom: 10%;
}
.four-news{width: 100%;overflow: hidden;position: relative;padding: 0 40px;}

.news-picwords-size{
    width: 100%;overflow: hidden;
    opacity: 0;
    transition: all 1s;
    transform: translateY(200px);
}
.active .news-picwords-size{
    opacity: 1;
    transition: all 1s;
    transform: translateY(0);
}


.news-picwords-pic{width: 100%;height: 268px;overflow: hidden;}
.news-picwords-pic img{width: 100%;height: 100%;object-fit: cover;transition: all .6s;}
.news-picwords-size:hover .news-picwords-pic img{transform: scale(1.06);}
.news-picwords-words{width: 100%;overflow: hidden;padding: 30px 0;}
.news-picwords-words h4{font-size: 20px;color: #484c52;font-weight: bold;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.news-picwords-words h4:hover{color: #004098;}
.news-picwords-words p{font-size: 13px;color: #777;line-height: 24px;height: 48px;margin-top: 10px;overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news-picwords-words h6{font-size: 13px;color: #555;font-weight: bold;margin-top: 40px;}
.news-picwords-words h6:hover{color: #004098;}

.four-LR>div{
    position: absolute;
    width: 40px;
    height: 43px;
    cursor: pointer;
    z-index: 9;
    top: 50%;
}
.four-LR>div i{display: inline-block;width: 11px;height: 23px;background-repeat: no-repeat;margin-top: 10px;}
.four-newsL i{background-image: url('../images/index/four_L.png');}
.four-newsR i{background-image: url('../images/index/four_R.png');}

.four-newsL{left: 0;text-align: left;}
.four-newsR{right: 0;text-align: right;}


/* -------------------------------five---------------------------------- */
.five-img{width: 100%;position: relative;height: 71%;background-color: #191c21;}
.five-img img{width: 100%;height: 100%;}

.Footer-wrapper{position: relative;width: 100%;height: 29%;}



/* -------------------------PC端--------------------------- */

@media all and (max-width:1600px) {
    .one-words h4{font-size: 40px;}
    .banner-words h4{font-size: 40px;}
    .pub-title h6{font-size: 100px;}
    .two-wordsbox {
        bottom: 10%;
    }
    .pub-title h4{font-size: 32px;margin-top: 44px;}
    .three-navbar{width: 800px;}
    .news-picwords-pic{height: 200px;}
}

@media all and (max-width:1460px) {
    .pub-title h6{font-size: 100px;}
    .three-fonts h4{font-size: 32px;}
    .three-words {
        bottom: 8%;
        height: 400px;
    }
    .news-picwords-pic{height: 180px;}
    .news-picwords-words h4{font-size: 18px;}
    .four-newsbox {
        bottom: 6%;
    }
    .four-newsbox {
        position: absolute;
        width: 68%;
        left: 16%;
        bottom: 6%;
    }
    .three-words-qq{width: 90%;height: 90%;margin-left: 5%;margin-top: 5%;}
    .three-navbar{width: 600px;}
    .three-navbar ul li p{font-size: 14px;}

}

@media all and (max-width:1380px) {}

@media all and (max-width:1300px) {
    .one-words h4{font-size: 32px;}
    .banner-words h4{font-size: 32px;}
    .three-words-qq {
        width: 80%;
        height: 80%;
        margin-left: 10%;
        margin-top: 10%;
    }
}

@media all and (max-width:1280px) {}

@media all and (max-width:1200px) {
    .three-words-qq{display: none;}
    .three-words {
        width: 88%;
        left: 6%;
    }
    .three-navbar {
        width: 460px;
    }
    .news-picwords-pic{height: 140px;}
}


/* ------------------------手机端-------------------------- */

@media all and (max-width:1024px) {
    .logoimg{margin-top: 0;display: inline-block;}
    .one-bg img{object-fit: cover;}
    .one-words h4 {
        font-size: 20px;
    }
    .banner-words h4{font-size: 20px;}
    .pub-title h6{display: none;}
    .pub-title h4 {
        font-size: 24px;
        margin-top: 24px;
    }
    .pub-title p{font-size: 16px;margin-top: 2px;}
    .pub-title i{margin-top: 10px;}
    .pub-title {
        top: 10%;
        left: 4%;
    }
    .two-wordsbox {
        width: 93%;
        left: 4%;
        bottom: 10%;
    }
    .two-words ul{margin-left: 0%;}
    .two-words ul li{width: 50%;margin-left: 0%;height: 160px;}
    .two-words ul li h4 {
        font-size: 16px;
        margin-top: 14px;
    }
    .two-words ul li:nth-child(2n+1){
        border-right: none;
    }
    .two-words ul li:nth-child(1){border-bottom: none;}
    .two-words ul li:nth-child(2){border-bottom: none;}
    .two-words ul li p{display: none;}
    .two-words ul li:hover{
        margin-top: 0;
        background-color: #004098;
    }
    .four-newsbox {
        width: 93%;
        left: 4%;
        bottom: 10%;
    }
    .three-words{
        width: 93%;left: 4%;
        height: auto;
        bottom: 10%;
    }

    .three-words-qq{display: none;}
    .three-words-man {
        width: 80px;
        height: 80px;
        margin-top: -100px;
        margin-left: 0;
        left: 0;
    }
    .three-line{display: none;}
    .three-fonts h4 {
        font-size: 24px;
    }
    .three-fonts{width: 300px;right: 4%;top: 32%;}
    .three-navbar {
        bottom: 6%;
        right: 3%;
        width: 94%;
    }
    .three-navbar ul li {
        width: 33.3333333333%;
    }
    .three-navbar ul li h6{display: none;}
    .three-navbar ul li p{
        margin: 0 auto;margin-top: 12px;width: 96%;height: 40px;line-height: 40px;text-align: center;border: 1px solid #004098;
        font-size: 12px;color: #004098;
    }
    .three-navbar ul li.on p{
        background-color: #004098;color: #fff;
    }
    
    .four-news{padding: 0 20px;}
    .news-picwords-pic{height: 160px;}
    .news-picwords-words {padding: 18px 0;}
    .news-picwords-words h4 {
        font-size: 16px;
    }
    .news-picwords-words p{margin-top: 6px;}
    .news-picwords-words h6 {margin-top: 6px;}
    .four-newsbox {bottom: 18%;}
    .five-img{height: 24%;padding-top: 8%;}
    .Footer-wrapper{height: 68%;}
    .four-newsbox {
        bottom: 10%;
    }

    .three-words-man{opacity: 0;}
    #fp-nav{display: none;}
}
@media all and (max-width:720px) {
    .news-picwords-pic{height:190px;}
    .pub-title {
        top: 12%;
    }
    .two-wordsbox {
        bottom: 12%;
    }
}