/* CSS Document */
@charset "utf-8";
.container{position: relative;}
.banner{position: relative;}
#bannerSwiper{width: 100%;/*height: calc(80vh - 95px);*/ margin: 0 auto;position: relative;/*left: 50%;margin-left: -50%;*/z-index: 3;}
#bannerSwiper .swiper-button-prev,#bannerSwiper .swiper-button-next{position: absolute;top: 50%;margin-top: -33px;display: block;width: 66px;height: 66px;display: block;z-index: 999;opacity: 1 !important;}
#bannerSwiper .swiper-button-prev{left: 5%;background: url(pic_39.png) no-repeat center;z-index: 999;top:50%;width: 67px;height: 67px;margin-top: -33px;}
#bannerSwiper .swiper-button-next{right: 5%;background: url(pic_40.png) no-repeat center;z-index: 999;top:50%;width: 67px;height: 67px;margin-top: -33px;}
#bannerSwiper .swiper-pagination .swiper-pagination-bullet{width: 14px; height: 14px; background: #fff;}
#bannerSwiper .swiper-slide .vvs{position: relative; height: 100%; background: #333333;}
#bannerSwiper .swiper-slide .vvs video{width: 100%;}
#bannerSwiper .swiper-slide .pcBox,
#bannerSwiper .swiper-slide .sjBox{position: relative; height: 100%;}
#bannerSwiper .swiper-slide img{height: 100%;}
#bannerSwiper .swiper-slide .textBox{position: relative; /*top: 50%; left: 50%;*/ width: 100%; /*transform: translate(-50%,-50%);*/text-align: center;font-size: 52px; font-weight: bold; color: #ffffff;}
@keyframes icon{0%{opacity: 0.8;transform: translate(-50%,0);}50%{opacity: 1;transform: translate(-50%,35px);}100%{opacity: 0.8;transform: translate(-50%,0);}}
.banner .ban-move{position: absolute; left: 50%;bottom: 20%; transform: translateX(-50%); z-index: 10; cursor: pointer; animation: icon 1.5s linear infinite;}
.banner .ban-move:hover{animation-play-state:paused;-webkit-animation-play-state:paused;}
.m-use > .hd .tit{position: relative;padding-bottom: 14px;font-size: 34px;font-weight: bold;color: #525252;text-align: center;}
.m-use > .hd .tit::before{position: absolute;left: 50%;bottom: 0;content: '\20';width: 67px;height: 3px;transform: translateX(-50%);background: #d5161d;}
.more a{display: block; width: 224px; height: 53px; margin: 0 auto; border: 1px solid #424242; line-height: 53px; text-align: center; font-size: 16px; color: #737272; transition: all 0.4s;}
.more a span{display: inline-block; width: 24px; height: 6px; margin-left: 30px; vertical-align: middle; background: url(pic_42.png) no-repeat center center; transition: all 0.4s;}
.more a:hover{color: #ffffff; background-color: #ca0e2a; border-color: #ca0e2a;}
.more a:hover span{background-image: url(pic_42bb.png);}
@keyframes cir-scale{0%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}60%{opacity: 0.9; transform: translate(-50%,-50%) scale(1);}100%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}}
@keyframes cir-scale1{0%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}60%{opacity: 0.9; transform: translate(-50%,-50%) scale(1);}100%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}}
@keyframes cir-scale2{0%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}60%{opacity: 0.6; transform: translate(-50%,-50%) scale(1);}100%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}}
@keyframes cir-scale3{0%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}60%{opacity: 0.3; transform: translate(-50%,-50%) scale(1);}100%{opacity: 0; transform: translate(-50%,-50%) scale(0.4);}}
.sj-banner{display: none;}

@media screen and (max-width: 1200px) {
    #bannerSwiper{height: 576px;}
    #bannerSwiper .swiper-slide .vvs video{width: auto; height: 100%;}
    #bannerSwiper .swiper-slide .textBox{font-size: 32px;}
}

@media screen and (max-width: 700px) {
    .banner{display: none;}
    #bannerSwiper{height: calc(100vh - 50px);}
    .sj-banner{display: block;}
    .m-use > .hd .tit{padding-bottom: 8px; font-size: 24px;}
}

.netSecurity .s1 .bd .item{position: relative;float: left;width: 20%; overflow: hidden;}
.netSecurity .s1 .bd .item::before{position: absolute; content: ""; display: block; width: calc(100% - 40px); height: calc(100% - 40px); box-sizing: border-box; border: 1px solid #ffffff; top: 20px; left: 20px; z-index: 1; opacity: 0.6; transition: all 0.5s;}
.netSecurity .s1 .bd .item::after{position: absolute;content: '\20';width: 100%;height: 100%;top: 0;left: 0;background: url(pic_88.png) repeat-x left top;background-size: contain;opacity: 0;transition: all 0.5s;}
.netSecurity .s1 .bd .item .picBox{position: relative; overflow: hidden;}
.netSecurity .s1 .bd .item .picBox::before{position: absolute; width: 100%; height: 100%; content: '\20'; left: 0; top: 0; background: rgba(0, 0, 0, .1); transition: all 0.3s;z-index: 1; opacity: 1;}
.netSecurity .s1 .bd .item .picBox img{width: 100%;transition: all 0.5s;}
.netSecurity .s1 .bd .item .textBox{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 4;height: 113px;transition: all 0.5s;}
.netSecurity .s1 .bd .item-ico{position: relative;text-align: center;}
.netSecurity .s1 .bd .cir{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);border-radius: 50%;border: 1px solid rgba(255,255,255,.8);opacity: 0;animation: cir-scale 2s linear infinite;}
.netSecurity .s1 .bd .cir-1{width: 76px;height: 76px;animation: cir-scale1 2s linear infinite;}
.netSecurity .s1 .bd .cir-2{width: 114px;height: 114px;animation: cir-scale2 2s linear infinite;}
.netSecurity .s1 .bd .cir-3{width: 177px;height: 177px;animation: cir-scale3 2s linear infinite;}
.netSecurity .s1 .bd .item-tit{position: relative;padding-bottom: 10px;margin-top: 32px;font-size: 22px;color: #ffffff;text-align: center;}
.netSecurity .s1 .bd .item-tit::before{position: absolute;left: 50%;bottom: 0;content: '\20';width: 39px;height: 2px;transform: translateX(-50%);background: #ffffff;opacity: 0;transition: all 0.5s;}
.netSecurity .s1 .bd .item-main{width: 16vw;margin-top: 30px;visibility: hidden;opacity: 0;transition: all 0.5s;}
.netSecurity .s1 .bd .item-main li{position: relative;float: left;width: 50%;margin-bottom: 8px;padding: 0 12px;line-height: 30px;font-size: 16px;color: #ffffff;box-sizing: border-box;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.netSecurity .s1 .bd .item-main li a::before{position: absolute;left: -12px;top: 50%;content: '\20';width: 4px;height: 4px;transform: translateY(-50%);border-radius: 50%;background: #ffffff;}
.netSecurity .s1 .bd .item-main li a{position: relative;color: #ffffff;}
.netSecurity .s1 .bd .item-main li img{width: 20px;margin-right: 12px;vertical-align: middle;}
.netSecurity .s1 .bd .item:hover::after{opacity: 1;}
.netSecurity .s1 .bd .item:hover .picBox::before{opacity: 0;}
.netSecurity .s1 .bd .item:hover .picBox img{transform: scale(1.1);}
.netSecurity .s1 .bd .item:hover .textBox{height: 80%;}
.netSecurity .s1 .bd .item:hover .item-tit::before{opacity: 1;}
.netSecurity .s1 .bd .item:hover .item-main{visibility: visible;opacity: 1;}

@media screen and (max-width: 1500px) {
    .netSecurity .s1 .bd .item-main li{font-size: 14px; line-height: 1.5;}
}

@media screen and (max-width: 1350px) {
    .netSecurity .s1 .bd .item-tit{margin-top: 20px;}
    .netSecurity .s1 .bd .item-main{margin-top: 20px;}
}

@media screen and (max-width: 1200px) {
    .netSecurity .s1 .bd .item{width: 50%; margin-bottom: 20px;}
    .netSecurity .s1 .bd .item:hover .textBox{height: 80%;}
    .netSecurity .s1 .bd .item-main{width: 280px;}
}

@media screen and (max-width: 700px) {
    .netSecurity .s1 .bd .item{float: unset; width: 94%; margin: 0 auto; margin-bottom: 20px;}
    .netSecurity .s1 .bd .item-tit{margin-top: 20px; font-size: 20px;}
    .netSecurity .s1 .bd .item-main{width: 294px; margin-top: 35px;}
    .netSecurity .s1 .bd .item-main li{line-height: 26px;font-size: 16px;}
    .netSecurity .s1 .bd .item-main li::before{left: -7px;}
}

.section1{padding: 66px 0 72px 0;}
.section1 .m-use > .hd{margin-bottom: 73px;}
.section1 .more{margin-top: 48px;}
@media screen and (max-width: 700px) {
    .section1{padding: 40px 0;}
    .section1 .m-use > .hd{margin-bottom: 40px;}
}

.section2{padding: 77px 0 54px 0; background: url(pic_44.jpg) no-repeat center center; background-size: cover; background-attachment: fixed;}
.section2 .m-use > .hd{margin-bottom: 48px;}
.section2 .m-use > .hd .tip{margin-top: 24px; font-size: 18px; color: #454545; text-align: center;}
.section2 .slideBox .hd{margin-bottom: 38px; text-align: center;}
.section2 .slideBox .hd ul{display: inline-block;}
.section2 .slideBox .hd li{position: relative; float: left; padding: 0 33px; font-size: 1rem; color: #3c3c3c; line-height: 42px; transition: all 0.3s; -webkit-text-size-adjust: 100%;}
.section2 .slideBox .hd li.on,
.section2 .slideBox .hd li:hover{background: #ca0e2a; color: #ffffff; cursor: pointer;}
.section2 .slideBox .hd li.on::before{content: ""; width: 0px; height: 0px; border-left: 9px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #ca0e2a; position: absolute; top: 99%; left: 50%; transform: translateX(-50%);}
.section2 .slideBox .bd{padding: 54px 54px 44px 54px; background: #ffffff; box-shadow: 0 0 28px rgba(0, 0, 0, .12);}
.section2 .slideBox .item{height: 317px;}
.section2 .slideBox .item .swiper-container{height: 100%;}
.section2 .slideBox .item .swiper-slide{height: auto;}
.section2 .slideBox .item .swiper-slide a{display: inline-block; width: 170px; height: 59px; margin-right: 5%; margin-bottom: 3%;}
.section2 .slideBox .item .swiper-slide .picBox{overflow: hidden;}
.section2 .slideBox .item .swiper-slide img{width: 100%; transition: all 0.4s;}
.section2 .slideBox .swiper-container .swiper-scrollbar{width: 5px; background: #c5c5c5;}
.section2 .slideBox .swiper-container .swiper-scrollbar-drag{width: 5px;  background: #ca0e2a; border-radius: 10px;}
.section2 .slideBox .swiper-container .swiper-slide a:hover img{transform: scale(1.1);}
.section2 .more{margin-top: 54px;}

@media screen and (max-width: 1600px) {
    .section2 .slideBox .item .swiper-slide a{margin-right: 3%;}
}

@media screen and (max-width: 700px) {
    .section2{padding: 40px 0;}
    .section2 .m-use > .hd .tip{margin-top: 18px; font-size: 16px;}
    .section2 .slideBox .hd{margin-bottom: 12px;overflow-x: auto;}
    .section2 .slideBox .hd li{width: 33.3%; padding: 0; margin-bottom: 8px;}
    .section2 .slideBox .bd{padding: 34px 7px;}
    .section2 .slideBox .item .swiper-slide a{margin-right: 0;}
    .section2 .more{margin-top: 40px;}
    .section2 .slideBox .hd ul{display: block;width: 1000px;overflow-x: auto;}
    .section2 .slideBox .hd::-webkit-scrollbar{display: none;}
    .section2 .slideBox .hd ul li{width: 10.33%;}
}

.section3{padding: 0 0 62px 0;}
.section3 .m-use > .hd{margin-bottom: 68px;}
.section3 .s3-swiper{padding: 0 0 44px 0;}
.section3 .s3-swiper .picBox{overflow: hidden;}
.section3 .s3-swiper .picBox img{width: 100%; transition: all 0.4s;}
.section3 .s3-swiper .textBox{padding: 40px 35px 54px 26px; background: #f2f3f5; transition: all 0.4s;}
.section3 .s3-swiper .textBox .tit{margin-bottom: 6px; font-size: 18px; color: #3f3f3f; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.section3 .s3-swiper .textBox .tip{font-size: 16px; color: #3f3f3f; opacity: 0.68; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.section3 .s3-swiper a:hover img{transform: scale(1.1);}
.section3 .s3-swiper a:hover .textBox{background: #ca0e2a;}
.section3 .s3-swiper a:hover .tit,
.section3 .s3-swiper a:hover .tip{color: #ffffff;}
.section3 .s3-swiper .swiper-pagination-bullet{width: 9px; height: 9px; opacity: 1; background: #bcbcbc; transition: all 0.4s;}
.section3 .s3-swiper .swiper-pagination-bullet-active{width: 30px; border-radius: 20px; background: #ca0e2a;}
.section3 .s3-swiper > .swiper-pagination-bullets{bottom: 0;}
.section3 .more{margin-top: 35px;}
@media screen and (max-width: 700px) {
    .section3{padding: 0 0 40px 0;}
    .section3 .m-use > .hd{margin-bottom: 40px;}
    .section3 .s3-swiper .textBox{padding: 34px;}
}

.section4{padding: 62px 0 0 0;}
.section4 .m-use > .hd{margin-bottom: 39px;}
.section4 .bd .a1{float: left; width: 50%; height: 588px; padding: 122px 100px 68px 156px; background: url(pic_49.jpg) no-repeat center center; background-size: cover; background: #ebecf0; box-sizing: border-box;}
.section4 .bd .a1 .b{margin-bottom: 16px; font-size: 26px; color: #ca0e2a;}
.section4 .bd .a1 .c{margin-bottom: 42px; font-size: 16px; color: #2c2c2c; line-height: 30px; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical;}
.section4 .bd .a1 .d ul{display: flex; justify-content: flex-start;}
.section4 .bd .a1 .d li{margin-right: 15%;}
.section4 .bd .a1 .d li:last-child{margin-right: 0;}
.section4 .bd .a1 .d .top{display: inline-block; position: relative;}
.section4 .bd .a1 .d li p{display: inline-block; margin-right: 12px; font-family: Arial; font-size: 60px; font-weight: bold; color: #ca0e2a; line-height: 1;}
.section4 .bd .a1 .d li .top > i{font-size: 16px; color: #222222; vertical-align: text-bottom;}
.section4 .bd .a1 .d li s{position: absolute; right: 0; top: 0;}
.section4 .bd .a1 .d .bot{margin-top: 6px; font-size: 18px; color: #222222;}
.section4 .bd .a1 .more{margin-top: 60px;}
.section4 .bd .a1 .more a{margin: 0;}
.section4 .bd .a2{float: right; width: 50%; height: 588px; background: url(pic_50.jpg) no-repeat center center; background-size: cover; box-sizing: border-box;}
.map{width: 80%; height: 80%; margin: 0 auto; margin-top: 5%;} .map .chart{width: 100%; height: 100%;} .map .geo{width: 100%; height: 100%;}

@media screen and (max-width: 1400px) {
    .section4 .bd .a1{padding: 122px 80px 68px 90px;}
    .section4 .bd .a1 .d li p{margin-right: 5px;}
}

@media screen and (max-width: 1200px) {
    .section4 .bd .a1{height: 520px; padding: 34px;}
    .section4 .bd .a2{height: 520px;}
}

@media screen and (max-width: 700px) {
    .section4{padding: 40px 0 0 0;}
    .section4 .bd .a1{width: 100%; height: auto; padding: 30px;}
    .section4 .bd .a1 .b{font-size: 20px;}
    .section4 .bd .a1 .d li p{font-size: 40px;}
    .section4 .bd .a1 .d .bot{font-size: 16px;}
    .section4 .bd .a1 .more a{margin: 0 auto;}
    .section4 .bd .a2{width: 100%; height: 420px;}
    .map{width: 96%; height: 94%;}
}

.section5{padding: 62px 0 88px 0; background: #f7f8fa;}
.section5 .m-use > .hd{margin-bottom: 62px;}
.section5 .bd{position: relative;}
.section5 .s5-swiper .picBox{overflow: hidden;}
.section5 .s5-swiper .picBox img{width: 100%; transition: all 0.4s;}
.section5 .s5-swiper a:hover img{transform: scale(1.1);}
.section5 .s5-prev,
.section5 .s5-next{width: 37px; height: 37px; margin-top: -18px;}
.section5 .s5-prev{background: url(pic_47.png) no-repeat center center; background-size: cover; left: -5%;}
.section5 .s5-next{background: url(pic_48.png) no-repeat center center; background-size: cover; right: -5%;}
@media screen and (max-width: 700px) {
    .section5{padding: 40px 0 10px;}
    .section5 .m-use > .hd{margin-bottom: 40px;}
    .section5 .s5-swiper {padding-bottom: 40px;}
    .section5 .s5-prev, .section5 .s5-next{ top: 0; bottom: 0;margin: auto 0;}
    .section5 .s5-prev{left: 5%;}
    .section5 .s5-next{left: unset;right: 5%;}
    .section5 .swiper-pagination-bullet-active {background: #cd1632;}
}