
.index_banner {
    width:100vw;
    position: relative;
}
.index_banner img {
    width:100%;
    height:100vh;
}

.index_banner .swiper-pagination-bullets {
    bottom:5%;
}
.index_banner .swiper-pagination-bullet {
    width:16px;
    height:16px;
}
.index_banner .swiper-button-prev {
    left:5%
}
.index_banner .swiper-button-next {
    right:5%
}
.index_banner .scroll_down{
    position: absolute;
    left:5%;
    bottom:5%;
    z-index: 9;
    animation: scroll_down 1s infinite linear;
}
@keyframes scroll_down {
    from {
        bottom: 40px;
        opacity: 0;
    }

    to {
        bottom: 20px;
        opacity: 1;
    }
}






.home-tit{text-align: center; padding: 50px 0;}

.home-tit .en{
    display: block;
    color: transparent;
    -webkit-text-stroke-color: #c3c3c3;
    -webkit-text-stroke-width: 1px;
    font-size: 40px;
    font-weight: bold;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    opacity: .5;
}
.home-tit .cn{color: #003894; font-size: 42px; position: relative;z-index: 2; top: -22px; font-weight:bold}
.home-tit p{font-size: 16px; color: #666; margin: 0;font-weight: normal;}







.index_about{padding:87px 0 89px;background: url(../images/index_about.jpg) no-repeat center bottom;}
.about_box{display: flex;}
.about_box .a_left{width:50%;padding-top:43px; position: relative;z-index:200;}
.about_box .a_left h2{margin-bottom: 28px;}
.about_box .a_left h2 span{display: inline-block; height:56px; line-height: 56px; font-size: 45px; color:#333333;padding-right:37px;font-weight: bold;}
.about_box .a_left h2 em{display: block; height:73px; line-height: 73px;font-size: 55px;color:#003894; font-weight: bold;font-style:normal}
.about_box .a_left strong{display: block; line-height: 33px; font-weight: normal;font-size: 20px; color:#333333; margin-bottom: 37px;}
.about_box .a_right{width:50%;padding-left: 5%;}
.about_box .a_right .gui-con,.gui .a_right .a_con .con{height:100%;}
.about_box .a_right span{display: block; width:100%;height:100%; line-height: 0; overflow: hidden;}
.about_box .a_right span img{width: 100%;height:100%; transition: 1s;}
.about_box .a_right span:hover img{
    transform: scale(1.1);
}
@media screen and (max-width:1400px){
    .gui {
        transform: scale(0.8);
    }
}



.pro_box {
    margin: 50px auto;
}
.pro_box .pro_left{
    width:20%;
    float:left;
}

.pro_box .pro_right{
    width:78%;
    margin-left: 2%;
    float:right;
}

.pro_box .pro_sort ul li{
    position:relative;
    background: #f4f4f4;
    margin: 5px;
}

.pro_box .pro_sort ul li:after{
    content:"";
    position:absolute;
    width:0;
    top:0;
    left:0;
    height:100%;
    background:-webkit-linear-gradient(left,#003894,#fff);
    background:-moz-linear-gradient(left,#003894,#fff);
    background:-o-linear-gradient(left,#003894,#fff);
    background:linear-gradient(to right,#003894,#fff);
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
}

.pro_box .pro_sort ul li.active:after,
.pro_box .pro_sort ul li:hover:after{
    width:100%;

}

.pro_box .pro_sort ul li.active .pro_sbox,
.pro_box .pro_sort ul li:hover .pro_sbox{
    color:#fff;
}


.pro_box .pro_sort ul li .pro_sbox{
    position:relative;
    z-index:2;
    height:3.2vw;
    padding:0 40px 0 20px;
    color:#333;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    -webkit-align-items:center;
    align-items:center;
}

.pro_box .pro_sort ul li .pro_sbox span{
    font-size:1vw;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
}

.pro_box .pro_right dl {
    float: left;
    width: 32%;
    margin-right: 2%;
    margin-bottom: 24px;
    background: #f1f1f1;
}

.pro_box .pro_right dl:nth-child(3n) {
    margin-right: 0;
}

.pro_box .pro_right dt {
    width: 100%;
    line-height: 0;
    overflow: hidden;
}

.pro_box .pro_right dt img {
    width: 100%;
    border: 1px solid #eee;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
}

.pro_box .pro_right dt img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.pro_box .pro_right dd {
    height: 6vw;
    width: 90%;
    margin: 0 auto;
    position: relative;
}

.pro_box .pro_right dd b {
    display: block;
    font-size: 1vw;
    color: #2C2C2C;
    font-weight: normal;
    padding: 10px 0;
}

.pro_box .pro_right dd span {
    display: block;
    font-size: 0.8vw;
    color: #8B8B8B;
    overflow: hidden;
    width: 100%;
    height: 3vw;
    line-height: 1.5vw;
}

.pro_box .pro_right dl:hover {
    box-shadow: 0 3px 27px 2px rgba(0,0,0,0.05), 0 0 27px rgba(0,0,0,0.05);
}

.pro_box .pro_right dl:hover dd b a {
    color: #003894;
}

.pro_right .prolist li:nth-child(4n+1) {
    clear:left
}
.cpzx_nr ul {
    overflow: hidden;
}

.cpzx_nr li {
    float: left;
    width:24%;
    margin: 0 1% 30px 0;
}
.cpzx_nr li:nth-child(4n) {
    margin: 0 0 30px 0;
}
.cpzx_box {
    width:100%;
    border: 1px solid #6969694f;
    box-shadow: 2px 2px 10px #909090;
}

.cpzx_tp {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.cpzx_tp img {
    width: 100%;
}


.cpzx_box p {
    transition: All 0.4s ease-in-out;
    font-size: 14px;
    color: #fff;
    line-height: 66px;
    border-bottom: 1px solid #646464;
    padding: 0 30px;
    background: #003894;
}
.cpzx_box:hover p {
    background: #f74f24;
    border-bottom: 1px solid #f74f24;
}
.qh2 a:hover p span {
    display: none;
}

.qh2 a:hover p {
    text-align: center;
    color: #fff;
    background: #003894;
    border-bottom: 1px solid #003894;
}

.cptpxq a:hover p span {
    display: none;
}

.cptpxq a:hover p {
    text-align: center;
    color: #fff;
    background: #003894;
    border-bottom: 1px solid #003894;
}







.index_ys{height:775px;background:url(../images/ys/bg.jpg) no-repeat center top;padding-top:80px; box-sizing: border-box; overflow: hidden;}
.index_ys h2{text-align: center; margin-bottom: 64px;}
.index_ys h2 span{display: inline-block; height:70px; line-height: 70px;font-size: 50px; color:#FFF;padding:0 21px;position: relative; font-weight: normal;}
.index_ys h2 em{display: block; height:44px; line-height: 44px;font-size: 24px; color:#e0e0e0;font-weight: normal;}
.index_ys .ys_box{position: relative;padding-top:31px; box-sizing: border-box;}
.index_ys .ys_box ul {width:100%;display: flex;justify-content:space-between;}
.index_ys .ys_box ul li{width:50%; height: 250px;}
.index_ys .ys_box ul li:nth-child(odd){padding-right: 20%;}
.index_ys .ys_box ul li:nth-child(even){padding-left: 20%;}
.index_ys .ys_box ul li i{display: inline-block; width:74px; height:84px;overflow: hidden;}
.index_ys .ys_box ul li i img{width:100%; transition: .5s;}
.index_ys .ys_box ul li .des{display: inline-block;width: calc(100% - 90px);padding-left: 15px;}
.index_ys .ys_box ul li .des span{display: block; height:45px;font-size: 28px; color:#ffffff;font-weight: bold;}
.index_ys .ys_box ul li .des p{height:33PX;line-height: 33px;font-size: 16px; color:rgba(255,255,255,0.66); font-weight: normal;}
.index_ys .ys_box ul li:hover i img{margin-top:-84px;}
.index_ys .ys_box .ys_center{width:30vw;height:30vw;position: absolute; left:50%; top:50%;transform: translate(-50%,-50%);display: flex;align-items: center;justify-content: center;}
.index_ys .ys_box .ys_center img{width:100%;}
.index_ys .ys_box .ys_center .q1 {position: absolute;width:90%;height:90%;left:5%;top:5%;animation: rotate_1 16000ms linear infinite;}
.index_ys .ys_box .ys_center .q2 {position: absolute;width:80%;height:80%;left:10%;top:10%;animation: rotate_2 16000ms linear infinite;}
@keyframes rotate_1 {
    from {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}
@keyframes rotate_2 {
    from {
        transform: rotate(0);
    }
    to {
        transform: rotate(-360deg);
    }
}

@media  screen and (max-width: 1200px){
    .index_ys .ys_box ul li .des span {
        font-size: 24px;
    }
}



.index_news{position: relative;margin-bottom: 50px;}
.index_news .news_item{width:23.5%;margin-right: 2%;float:left;background-color: #fff;padding:0;transition: all .3s;border:1px solid rgba(38,61,145,0.06);}
.index_news .news_item:last-child {margin-right: 0;}
.index_news .news_item .img{width: 100%;overflow: hidden;transition: all .3s;display:flex;justify-content:center;align-items:center; position:relative;padding-bottom:59.52%;}
.index_news .news_item .img img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%); display: block;width: calc(100% - 20px);height: calc(100% - 20px);transition: all .3s;}
.index_news .news_item:hover .img img{width:100%;height:100%;}
.index_news .news_item .wz{position: relative;padding:20px 20px 30px 20px;}
.index_news .news_item .wz::before{content: '';width: 100%;height: 1px;background-color: #ededed;position: absolute;top:0;left:0;transition: all .3s;}
.index_news .news_item .wz::after{content: '';width: 0;height: 1px;background-color: #003894;position: absolute;top:0;left:0;transition: all .3s;}
.index_news .news_item .wz .time{font-size: 16px;color: #003894;margin-bottom: 10px;}
.index_news .news_item .wz h3{font-size: 20px;line-height: 28px;overflow: hidden; color: #000;margin-bottom: 15px;transition: all .3s;white-space: nowrap;text-overflow: ellipsis;}
.index_news .news_item .wz p{font-size: 14px;line-height: 22px;height: 66px; overflow: hidden;color: #595353;margin-bottom: 30px;transition: all .3s;}
.index_news .news_item:hover{box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);}
.index_news .news_item:hover .wz{background:#003894}
.index_news .news_item:hover .wz::before{opacity:0;}
.index_news .news_item:hover .wz h3{color: #ffffff;}
.index_news .news_item:hover .wz .time,.index_news .news_item:hover .wz p{color:#FFFFFF;}
