/*.index-navbox{position: absolute; left: 0; top: 0; right: 0; z-index: 999999;}*/
.banner .swiper-slide{height: 757px;background-color: #244f7d; background-repeat: no-repeat;background-position: center center; background-size: cover;}
.banner .swiper-pagination{font-size: 0;line-height: 0; bottom: 25px;}
.banner .swiper-pagination-bullet{opacity: 1;position: relative;width: 8px;height: 8px;margin: 0 10px !important;background: #fff;vertical-align: top; outline: none;}
.banner .swiper-pagination-bullet::after{content: '';position: absolute;left: -6px;top: -6px;width: 18px;height: 18px; border: 1px solid #fff;background: #fff;border-radius: 100%;overflow: hidden;}
.banner .swiper-pagination-bullet-active::after{background: none;}
.banner  .swiper-button-prev,
.banner .swiper-button-next{width: 32px;height: 48px;margin-top: -24px; outline: none;opacity: 0;transition: all ease-in-out .5s;}
.banner .swiper-button-prev{left:10%;background: url("../images/banner_prev.png");transform: translateX(30px);}
.banner .swiper-button-next{right:10%;background: url("../images/banner_next.png");transform: translateX(-30px);}
.banner:hover .swiper-button-prev,
.banner:hover .swiper-button-next{transform: translateX(0);opacity: 0.6;}
.banner .swiper-button-prev:hover,
.banner .swiper-button-next:hover{opacity: 1;}

.ihd{margin: 0 0 2.5% 0;text-align: center;}
.ihd h2{font-size: 24px;font-weight: normal;line-height:2em;}
.about{padding: 2.5% 0 3%;}
.about dl{padding: 0 2%;}
.about dt{float:left;width:53%;}
.about dt img{display: block;width: 100%;height: auto;}
.about dd{float: right;width: 43%;margin: 0 2% 0 0; font-size: 18px; line-height: 44px;}
.about .info{margin: 0 0 3% 0;}
.about .btn a{display: block;width: 120px;height: 40px;text-align: center;line-height: 40px;font-size: 12px;color: #fff;background: #373b43; transition: all ease .5s;}
.about .btn a:hover{color: #fff;background-color: #e83828;transform: translateY(-3px);box-shadow: -5px 5px 15px rgba(0,0,0,0.3);}

.pro,
.solution,
.news{padding:0 0 3% 0;}
.pro .bd{position: relative; width: 80%;margin: 0 auto;}
.pro .swiper-button-next{right: -60px; width: 25px; height: 48px;background:#373b43 url("../images/next.png");}
.pro .swiper-button-prev{left: -60px; width: 25px; height: 48px;background:#373b43 url("../images/prev.png")}
.pro .swiper-button-next:hover,
.pro .swiper-button-prev:hover{background-color: #e83828;}
.pro li{text-align: center;}
.pro li .pic{position: relative; width: 100%; padding-top: 100%; overflow: hidden;}
.pro li .pic .img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-position: center center; background-size: cover; transition: all ease .5s;}
.pro li a:hover .pic .img{transform: scale(1.1);}
.pro li .pic img{display: block;}
.pro li p{display: inline-block; padding: 10px 0 5px 0; font-size: 12px;line-height: 1.6em; color: #888;text-align: center; transition: all ease .3s;border-bottom: 1px solid #fff;}
.pro li a:hover p{color: #000; border-bottom: 1px solid #000;}

.solution .s{width: 100%;}
.solution .s a{display: block;position: relative;overflow: hidden;}
.solution .s .pic{width: 100%; padding: 51% 0 0 0;background-repeat: no-repeat;background-position: center center;background-size: cover;}
.solution .s .pic::after{content: '';position: absolute;left: 50%;top: 50%;margin: -45px 0 0 -45px; font-size: 0;line-height: 0;width: 90px;height: 90px;background: url(../images/play.png); transition: all ease .5s;}
.solution .s a:hover .pic::after{opacity: 0.5;animation:rotate360  2s linear 0s infinite;}
@keyframes rotate360 {
    0%{
        transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
    }
    100%{
        transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
    }
}


.solution .s .info{position: absolute;left: 0; right: 0; bottom: 0px; padding:20px; background: rgba(6,79,130,.8);}
.solution .s .title{position: relative;margin-bottom: 0.5em;padding-bottom: 0.3em;color: #45b4ff; font-size: 24px; font-weight: bold; line-height: 1.6em;}
.solution .s .title::after{position: absolute;content: '';left: 0;bottom: 0;width: 2em;height: 2px;background: #8db604;}
.solution .s .info p{color: #fff;font-size: 16px;line-height: 1.6em;}
.solution .s2{}

.news{}
.news .bd{position: relative;margin: 0 auto 0 1%;}
.news .swiper-button-next{right: -60px; width: 25px; height: 48px;background:#373b43 url("../images/next.png");}
.news .swiper-button-prev{left: -60px; width: 25px; height: 48px;background:#373b43 url("../images/prev.png")}
.news .swiper-button-next:hover,
.news .swiper-button-prev:hover{background-color: #e83828;}
.news .swiper-pagination{position: static; left: auto;bottom: auto;font-size: 0; padding: 20px 0 0 0;}
.news .swiper-pagination span{margin:0 3px;border: 1px solid #ccc;background:none; outline: none; opacity: 1;}
.news .swiper-pagination span.swiper-pagination-bullet-active{background: #535353; border-color: #535353;}

.news ul{margin: 0 -12px;}
.news li{float: left;position: relative; width: 25%;padding: 0 12px;font-size: 14px; line-height: 22px; text-align: center;background: #f9f9f9;}
.news .swiper-container-horizontal li{padding: 0;}
.news li a{display: block;overflow: hidden;}
.news li .pic{position: relative; width: 100%; padding-top: 50%; overflow: hidden;}
.news li .pic .img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-position: center center; background-size: cover; transition: all ease .5s;}
.news li a:hover .pic .img{ transform: scale(1.1);}

.news li img{display: block;}
.news li .title{height: 22px; overflow: hidden; margin: 5% 0; color: #2d363f;}
.news li .info{height: 22px; overflow: hidden;margin: 0 3% 5%; color: #888;}
.news li::after{position: absolute;left: 0; bottom: 0; font-size: 0; line-height: 0; content: '';width: 100%;height: 1px;display: block;background: #0e3365;}
.news li:nth-child(2n)::after{background:#e73828;}


@media (max-width: 1024px) {
    .index-navbox{position: relative;}
    .banner .swiper-slide{height: 200px;}

    .banner .swiper-pagination{bottom: 10px;}
    .banner .swiper-pagination-bullet{opacity: 0.5;width: 8px;height: 8px;margin: 0 5px !important;}
    .banner .swiper-pagination-bullet::after{display: none;}
    .banner .swiper-pagination-bullet-active{opacity: 1;}


    .banner .swiper-button-prev{left: 5%;}
    .banner .swiper-button-next{right: 5%;}

    .about dt{float: none; width: 100%; padding: 10px;margin-bottom:3%;-webkit-box-shadow: none; box-shadow: none;}
    .about dd{float: none;width: 100%; padding: 0 20px; font-size: 12px;line-height: 1.8em;}
    .about .btn a{width: 100%;}
    .pro .bd{width: 100%;padding: 0 20px;}
    .pro .swiper-button-next{right: 10px;}
    .pro .swiper-button-prev{left: 10px;}

    .news{width: 100%; overflow: hidden;}
    .news .bd{padding: 0 20px;}
    .news .swiper-button-next{right: 0px; display: none;}
    .news .swiper-button-prev{left: 0px; display: none;}

    .solution .s1{margin-bottom: 10px;}
    .solution .s1,
    .solution .s2{float: none;width: 100%;}
    .solution .s1 img,
    .solution .s2 img{display: block;}

    .news .bd{padding: 0 20px;}
    .news ul{margin: 0 -5px;}
    .news li{padding: 0 5px;margin: 0 0 10px 0; width: 50%; font-size: 12px;line-height: 20px;}
    .news li .title{margin: 3%;height: 40px; overflow: hidden; text-align: left;}
    .news li .info{margin-left: 3%; margin-right: 3%;text-align: left;}

}