﻿@charset "utf-8";
#content { padding: 0px;}
body .wrap{margin: 0 auto;background:#ffffff;}
.productSpecial-SOP{ overflow: hidden}
#content.special-content { padding: 0px; background:#ffffff}
#header{top:0px; left: 0px;}

.special-row > .siteWidth,.solutionSafety-07 > .siteWidth{padding: 0 3%;}

/*  头部 */
.special-header {height: 360px;background:url(../img/banner.jpg) 50% 0px no-repeat #212f8e;background-size: cover;position: relative;z-index: 1;margin: 0 auto;overflow: hidden;padding-top:50px;}
.special-header .siteWidth {position: relative;z-index: 5;width: 100%;max-width: 100%;box-sizing:border-box;padding-top: 90px;}
.special-header .special-header-title_cn{text-align:center;font-size: 32px;font-weight:bold;color:#fff;line-height: 2;text-shadow:0 0px 18px rgba(0,0,0,0.16);margin-bottom: 10px;}
.special-header .special-header-slogan{margin:0 auto;font-size: 15px;line-height: 40px;color:#fff;text-align:center;text-shadow:0px 0px 18px rgba(0,0,0,0.16);}
.special-header .special-header-slogan b{background:#034C9F;display:inline-block;padding: 0 10px;line-height: 36px;color:#FFDD00;border-radius:22px;margin:0 5px;clear: both;}
/* rowBox */
.rowBox{padding: 5% 0px;}
.rowBox .rHd{margin-bottom: 5%;display: flex;justify-content: center;}
.rowBox .rHd h3{font-size: 23px;font-weight:bold;color:#333;line-height: 1.6;display:flex;align-items:center;justify-content:center;/* background:url(../img/rowtibg.png) no-repeat 20px bottom / auto 30%; */}
.rowBox .rHd h3 span{padding: 0 10px;text-align: center;}
.rowBox .rHd h3::before,
.rowBox .rHd h3::after{content:"";display:block;width: 26px;height: 20px;background:url(../img/rowtiarr.png) 0 center / 100% auto no-repeat;}
.rowBox .rHd h3::after{transform: rotateY(180deg)}

/* intro */
.special-row .intro{font-size: 14px;line-height:2;text-align:justify}   
.special-row .intro p{text-indent:2em; margin-top:1em;}
.special-row .intro p:first-child{margin: 0;}

/* indTabBox */
.indTabBox .tHd{margin-bottom:36px;}
.indTabBox .tHd ul{display:block; margin:0 auto; width:500px; display:flex; height:52px; background:#fff; border-radius:26px; }
.indTabBox .tHd ul li{width:250px; text-align:center; font-size:18px; line-height:52px; height:52px; font-weight:bold; color:#555555; cursor:pointer;  }
.indTabBox .tHd ul li a{color:#555555}
.indTabBox .tHd ul li.on{color:#fff; background:linear-gradient(to bottom, #0070FF, #6AB9FF); border-radius:26px;}

/* specialRow_01 */
#specialRow_01{position:relative;background: url(../img/bg-01.jpg) no-repeat center / 100% 100%;}
#specialRow_01 .siteWidth{position:relative; z-index:1; display:flex; align-items:center}
#specialRow_01 .siteWidth > .pic{width:544px; height:auto; flex-shrink:0; margin-left:20px;}
#specialRow_01 .siteWidth > .pic img{width:100%;}
#specialRow_01 .rowBox .rHd h3{justify-content:flex-start}
#specialRow_01 .rBd {padding: 3%;background: linear-gradient(65.34deg, rgba(255, 255, 255, 0.11) 27.71%, rgba(241, 247, 255, 0.68) 81.26%);border: 1px solid #ffffff99;border-radius:10px;}
#specialRow_01 .rBd .intro {margin-bottom: 5%;}
#specialRow_01 .rBd ul {display:flex;flex-wrap:wrap;gap: 10px;flex-direction: column;}
#specialRow_01 .rBd ul li {line-height: 21px;border-radius:5px;padding: 10px 0;border: 1px solid #D5E1F5;background: linear-gradient(180deg, rgba(255, 255, 255, 0.38) 0%, rgba(241, 247, 255, 0.17) 122.58%);font-size: 14px;}
#specialRow_01 .rBd ul li i {float:left;width: 40px;height: 40px;margin: -15px 10px 0 9px;background: linear-gradient(288.08deg, #56A2FF -25.25%, #006EF3 111.98%);text-align:center;font-family:'Source Han Serif CN','Cambria';font-size: 20px;line-height: 40px;color:#fff;font-weight:700;border-radius: 5px;}

.rowTips {background: url(../img/tipsbg.jpg) no-repeat center / auto 100%;height: 110px;border-radius:5px;font-size: 18px;line-height: 2;display:flex;text-align: center;justify-content: center;padding-top: 20px;color: #fff;}
.rowTips h3 { font-weight:bold; }

/* specialRow_02 */
#specialRow_02{position:relative}
#specialRow_02 .siteWidth{position:relative;z-index:1;padding-top: 5%;}
#specialRow_02 .rBd {margin-bottom: 5%;}
#specialRow_02 .rBd .intro {background: linear-gradient(88.96deg, rgba(248, 251, 255, 0.51) 15.31%, rgba(244, 249, 255, 0.08) 54.73%, rgba(241, 247, 255, 0.61) 94.91%);padding: 3%;border:1px solid #E5ECFF;border-radius:10px;}
#specialRow_02 .rBd .intro p { margin:0;}
#specialRow_02 .rowBox{padding: 6% 0 0;margin-bottom: -5%;}
.customMadeBox {border:1px solid #E5ECFF;padding: 3%;border-radius:5px;overflow: hidden;}
.customMadeBox h3 {position:relative;display:inline-block;padding:0 20px;height:36px;line-height:36px;margin-bottom:15px;font-size: 18px;line-height:36px;font-weight:bold;background: linear-gradient(90deg, #036BE9 0%, #56A2FF 100%);color:#fff;border-radius:5px;}
.customMadeBox h3:after { content:""; position:absolute; bottom:-5px; left:5px; height:5px; width:100%;background:linear-gradient(90deg, rgba(225, 239, 255, 0.68) 47.76%, rgba(234, 244, 255, 0) 100%); border-radius:0 0 0 10px;}
.customMadeBox ul {display:flex;gap:5px;flex-direction: column;}
.customMadeBox li {/* display:flex; */gap:10px;line-height: 2;font-size: 14px;}
.customMadeBox li:before {content:"";min-width: 14px;height:14px;display: block;background:url(../img/liteico.png) no-repeat;margin-top: 8px;float: left;margin-right: 8px;}
.customMade {display:flex;flex-direction: column;}
.customMade .customMadeBox {margin-bottom: 3%;}

/* specialRow_03 */
#specialRow_03{}
#specialRow_03 .intensificationList{margin-top: 5%;display:flex;justify-content:center;position: relative;z-index: 1;flex-direction: column;gap: 10px;}
#specialRow_03 .intensificationList li{box-sizing:border-box;flex-shrink:0;flex-grow:0;padding: 5% 10%;background:url(../img/intensificationlibg.jpg) no-repeat center / cover;border-radius:20px;overflow:hidden;position:relative;top:0;transition:0.5s;}
#specialRow_03 .intensificationList li { box-shadow:0 15px 0 #ffffff18}
#specialRow_03 .intensificationList li .title{text-align:center;font-size: 18px;font-weight:bold;margin-bottom:2%;}
#specialRow_03 .intensificationList li .intro{color:#666666; margin-bottom:3%; text-indent:2em;}
#specialRow_03 .intensificationList li .pic{margin:0 auto;text-align: center;}
#specialRow_03 .intensificationList li .pic img{width:100%; height:auto;}
#specialRow_03 .intensificationList li:hover{top:-10px;box-shadow:0 0px 10px rgba(73,155,255,0.3);}
#specialRow_03 .rBd>.intro {background: url(../img/intensificationbg.png) no-repeat center bottom;background-size: auto 270px;border-radius: 10px;font-size: 14px;color: #fff;padding: 90px 6% 20px;margin-top: -60px;}

/* specialRow_04 */
#specialRow_04{position:relative;background: linear-gradient(180deg, #F6FBFF 0%, #ECF5FF 100%);background-size:cover;}
#specialRow_04 .solution-ITAI .sRow-intro {margin-bottom: 5%;font-size: 14px;padding: 0 3%;}
#specialRow_04 .solution-ITAI .list{position:relative;/* padding-bottom: 35px; */}
#specialRow_04 .solution-ITAI .list li{position:relative; z-index:1}
#specialRow_04 .solution-ITAI .list li .pic{
    height:auto;
    margin-bottom:5px;
    -webkit-box-reflect: below 0px linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0));
    box-reflect: below 0px linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0));
}
#specialRow_04 .solution-ITAI .list li .pic img{width:100%; height:auto;}
#specialRow_04 .solution-ITAI .list li .title{color:#333333;line-height: 24px;font-weight:normal}
#specialRow_04 .solution-ITAI .list li .title span{display:inline-block; position:relative;}
#specialRow_04 .solution-ITAI .tips{color:#7A7A7A}
#specialRow_04 .solution-ITAI .tips::before{content:"*"; color:#C7000B}
#specialRow_04 .solution-ITAI .tips a{color:#5A5A5A}
#specialRow_04 .solution-ITAI .tips a:hover{color:#007AFF}
#specialRow_04 .solution-ITAI .sRow-bg::after { display:none} 

#specialRow_05 .rowBox {display:flex;gap: 20px;justify-content: space-between;flex-direction: column;}
#specialRow_05 .rBd>div{display:flex;justify-content: space-between;flex-direction: column;gap: 20px;}
#specialRow_05 .rBd>div .sRow-pic {background:none;height: auto;margin: 0;text-align: center;}
#specialRow_05 .rBd>div .sRow-pic img {max-width:100%}
#specialRow_05 .rBd>div .sRow-intro{margin:0;text-align:left;width: auto;font-size: 14px;color: #333;}
#specialRow_05 .rBd>div .sRow-intro p{text-indent:2em; margin-top:1em}
#specialRow_05 .rBd>div .sRow-intro p:first-child{margin-top:0;}
#specialRow_05 .rBd>div .sRow-link {text-align:center;}
#specialRow_05 .rBd>div .sRow-link a {height:40px;line-height:40px;display:inline-block;border: 1px solid #B6CDE9;padding:0 12px; border-radius:50px;background:#fff;font-size: 14px; white-space:nowrap;}
#specialRow_05 .rBd>div .sRow-link a:hover { background:#56A2FF; color:#fff; border-color:#56A2FF}
#specialRow_05 .rowBox .rowItem { flex:1;}
#specialRow_05 .rowBox .rowItem:nth-child(2) .rHd h3 span {}
#specialRow_05 .rowBox .rowItem .rBd {padding: 3%;border: 1px solid #E9EEFF;background: linear-gradient(0deg, rgba(112, 132, 224, 0.05) 0%, rgba(255, 255, 255, 0.64) 50%, #FFFFFF 100%);border-radius: 10px;}

/* specialRow_06 */
#specialRow_06{background: url(../img/bg-03.png) center top no-repeat;background-size: auto 400px;}
#specialRow_06 .rowBox .rHd h3 {color:#fff;}
#specialRow_06 .rowBox .rHd h3::before, #specialRow_06 .rowBox .rHd h3::after { filter:brightness(200)}
#specialRow_06 .row-intro{padding: 0 3%;font-size: 14px;line-height:2;text-indent:2em;margin-bottom: 5%;text-align:justify;color:#fff;}
#specialRow_06 .customMadeBox { background:#fff;}
.more-link {text-align:center;margin-top: 5%;margin-bottom: 5%;}
.more-link a {height: 40px;line-height: 40px;display:inline-block;border: 1px solid #B6CDE9;padding: 0 15px;border-radius:50px;font-size: 14px;background:#fff;}
.more-link a:hover { background:#56A2FF; color:#fff; border-color:#56A2FF}
#specialRow_06 .rightArea .customMadeBox {}
#specialRow_06 .customMade {
    margin-bottom: -5%;
}

/* specialRow_07 */
#specialRow_07 {background: linear-gradient(180deg, #ECF5FF 55.84%, #FEFFFF 104.35%);}
#specialRow_07 .rHd {margin-bottom: 5%;}
#specialRow_07 .row-intro{padding: 0 3%;font-size: 14px;text-indent: 2em;line-height:2;margin-bottom: 20px;text-align: justify;}
#specialRow_07 .solution-institution .sRow-con .con-intro {/* margin-bottom: 5%; */text-align: justify;margin-top:0px;text-indent: 2em;}
#specialRow_07 .solution-institution .sRow-con .bg::after{ display:none;}
#specialRow_07 .solution-institution .pics .li1 { order:1}
#specialRow_07 .rowBox { padding-bottom:0px;}
#specialRow_07 .solution-institution .pics li .title {bottom: 20px;}

/* specialRow_08 */
#specialRow_08{background:#F6FBFF;padding-top: 5%;padding-bottom: 5%;}
#specialRow_08 .solution-testingTools { background: url(../img/solution-testingtools-bg.png) center 0 / auto 300px no-repeat; border-radius: 10px 10px 0 0; overflow:hidden; }
#specialRow_08 .solution-testingTools .sRow-title {margin:0;padding: 5% 5% 0;color:#fff;font-size: 16px;}
#specialRow_08 .solution-testingTools .sRow-con{background: none;position:relative;}
#specialRow_08 .solution-testingTools .sRow-con::before{content:"";display:block;position:absolute;left:0px;right:0px;top:0px;height:235px;border-radius:20px; display:none}
#specialRow_08 .solution-testingTools .sRow-con .con-intro,
#specialRow_08 .solution-testingTools .sRow-con .list{position:relative;z-index:5;background: none;font-size: 14px;margin: 0 0 3%;}

/* specialRow_09 */
#specialRow_09 .solution-attackTesting{background-image:url(../img/solution-attackTesting-bg.jpg)}

/* specialRow_10 */
#specialRow_10{padding: 5% 0;}
#specialRow_10 .solution-securityLevel .sRow-card{background-color:#F0F3FF;}
#specialRow_10 .solution-securityLevel .sRow-card::before{background: linear-gradient(82.07deg, #036BE9 2.04%, #56A2FF 96.67%);}
#specialRow_10 .solution-securityLevel .sRow-card .sRow-card_right{color:#076EEA}


.row-bg-01{position:relative; z-index:0;}
.row-bg-01::after{content:""; position:absolute; left:0px; right:0px; bottom:0px; top:300px; background:url(../img/bg-05.jpg) 50% 100% no-repeat #f0f7ff; background-size:100% auto; z-index:0}
/* specialRow_11 */
#specialRow_11{position:relative;z-index:1}
#specialRow_11 .siteWidth{position:relative; z-index:2;}
#specialRow_11 .solution-defenseSystem .sRow-intro {
    font-size: 14px;
    text-indent: 2em;
    text-align: justify;
}
#specialRow_11 .solution-defenseSystem .sRow-card{width:auto;margin-bottom: 3%;}
#specialRow_11 .solution-defenseSystem .sRow-card::before{transform:none;border-radius:0;bottom:auto;height:650px;background:url(../img/bg-04.jpg) 50% 50% no-repeat;background-size:cover;}
#specialRow_11 .solution-defenseSystem .sRow-card::after{display:none;}
#specialRow_11 .solution-defenseSystem .list li{top:0; transition:0.5s; }
#specialRow_11 .solution-defenseSystem .list li:hover{top:-5px; box-shadow: 0 10px 5px rgba(0, 0, 0, 0.2);}
#specialRow_11 .solution-defenseSystem .list li:hover .icon{animation: tada 1s ease 1;}
#specialRow_11 .solution-defenseSystem .list li:hover::after{display:none}
#specialRow_11 .solution-defenseSystem .list li:hover .title,
#specialRow_11 .solution-defenseSystem .list li a:hover{color:#333}
#specialRow_11 .solution-defenseSystem .list .icon { }
#specialRow_11 .solution-defenseSystem .list li.li1 .icon {background: url(../img/icon-02.png) center center no-repeat;}
#specialRow_11 .solution-defenseSystem .list li.li2 .icon {background: url(../img/icon-04.png) center center no-repeat;}
#specialRow_11 .solution-defenseSystem .list li.li3 .icon {background: url(../img/icon-03.png) center center no-repeat;}
#specialRow_11 .solution-defenseSystem .list li.li4 .icon {background: url(../img/icon-05.png) center center no-repeat;}
#specialRow_11 .solution-defenseSystem .sRow-more{display:none}
#specialRow_11 .solution-defenseSystem .sRow-card-tips {font-size:14px;text-align: justify;text-indent: 2em;}
#specialRow_11 .solution-safetyProtection .sRow-title{color:#fff; }
#specialRow_11 .solution-safetyProtection .protectionList li{background-image:url(../img/icon-06.png);}
#specialRow_11 .row-more{text-align:center;}
#specialRow_11 .row-more a{display:inline-block; line-height:40px; font-size:14px; border:1px solid #B6CDE9; padding:0 15px; border-radius:26px;; transition:0.5s; background:#fff;}
#specialRow_11 .row-more a:hover{background-color:#56A2FF; border-color:#56A2FF; color:#fff}


#specialRow_12{position:relative; z-index:1}
#specialRow_12 .rowBox { padding-bottom:0;}
.solution-safetyProtection .protectionList { gap:10px 20px}
.caseList{display:flex; flex-wrap:wrap; justify-content:center;   }
.caseList li{margin: 0 5px 15px;padding: 10px 20px;font-size: 14px;border:1px solid #DDE9F8;background:#fff;border-radius:10px;background: linear-gradient(180deg, #FEFEFF 0%, #F0F7FF 100%);cursor:pointer;position:relative;top:0;transition:0.3s;line-height:42px;text-align: center;}
.caseList li img{margin:0; }
.caseList li:hover{ background:#0F75EF; color:#fff;}
.caseList li.li1{width: 75%;}
/* specialRow_13 */
#specialRow_13{position:relative;background: url(../img/bg-06.jpg) 50% 50% / auto 100% no-repeat;background-size:cover;padding: 30px 0 30px;}
#specialRow_13 .row-icon{width: 78px;height: 112px;margin: 0 auto 3%;background: url(../img/icon-15.png) no-repeat center / 100%;}
#specialRow_13 .row-title2{font-size: 20px;font-weight:bold;text-align:center;color:#fff;margin-bottom:14px;line-height:1.4;}
#specialRow_13 .row-title3{font-size: 16px;text-align:center;color:rgba(255,255,255,0.8);line-height:1.4;margin-bottom: 5%;}
#specialRow_13 .provinceList{display:flex;justify-content: center;flex-wrap: wrap;gap: 10px;}
#specialRow_13 .provinceList li{height:36px;line-height:36px;width: 30%;background:rgba(255,255,255,1);text-align:center;font-size: 14px;color:#3C6AB4;border-radius:18px;cursor:pointer;transition:0.3s}
#specialRow_13 .provinceList li:hover{background:rgba(255,255,255,0.8);}

#jcyy{}
.rowBox>.hd{margin-bottom: 5%;display: flex;justify-content: center;}
.rowBox>.hd h3{font-size: 23px;font-weight:bold;color:#333;line-height: 1.6;display:flex;align-items:center;justify-content:center;/* background:url(../img/rowtibg.png) no-repeat 20px bottom / auto 30%; */}
.rowBox>.hd h3 span{padding: 0 10px;text-align: center;}
.rowBox>.hd h3::before,
.rowBox>.hd h3::after{content:"";display:block;width: 26px;height: 20px;background:url(../img/rowtiarr.png) 0 center / 100% auto no-repeat;}
.rowBox>.hd h3::after{transform: rotateY(180deg)}

/* 相关技术支撑功能模块 */
.lxss {background: #ecf5ff;}
.lxss a,.lxss a.sq { background-color:#0A5FB5}
.lxss a:hover { background-color: #176cd3;}
/* 长者版 */
.logo-box { position: absolute; top: 30px; z-index: 2; display: none; height: 50px; align-items: center; justify-content: space-between;}
.logo-box .logo { display: block; width: 300px; height: auto;}
.logo-box .logo img { height: 100%; width: auto; max-height:50px;}
.logo-box .links { height: 36px; min-width: 0; flex: 1 0 0%;}
.logo-box .links a { height: 36px; background-color:rgba(59,108,228,0.4); border-radius: 18px; line-height: 36px; text-align: center; color: #ffffff; font-size: 16px; float: left; padding: 0 1.5em; box-shadow: 0 4px 4px rgb(0 0 0 / 25%); margin-left: 10px; box-sizing: content-box;}
.special-header .links a:hover { background-color:rgba(59,108,228,1);}
.body_webFree #header{}
.body_webFree .pageBanner { display: none;}
.body_webFree .logo-box { zoom: 1.4; display: flex;}
.body_webFree .logo-box .links { position: relative; right: -54px;}
.body_webFree .special-header{height:auto;}
.body_webFree .special-header .siteWidth{height: 548px;/* padding-top:220px; */}
.body_webFree .special-header .special-header-title_cn{ text-align:center; font-size:72px; height:96px; line-height:96px; text-shadow:0 2px 6px rgba(0,0,0,0.25); margin-bottom:20px;}
.body_webFree .special-header .special-header-slogan{width: 1200px;margin:0 auto;font-size:28px;line-height: 3;text-align:center;}
.body_webFree .special-header .special-header-slogan b { padding:10px 20px; border-radius:30px}
.body_webFree .solution-ITAI .list li {width:18%;}
.body_webFree .intensificationList li .pic img {max-width: 60%;}
/* 漂浮 */
@keyframes float {
    0%,
    100% {
        transform: translateY(0);
        animation-timing-function: ease-in-out;
    }
    50% {
        transform: translateY(-0.6rem);
        animation-timing-function: ease-in-out;
    }
}

/* 旋转 */
@keyframes circle{
    0%{transform: rotate(0)}
    100%{transform: rotate(360deg)}
}
@keyframes circle-reverse{
    0%{transform: rotate(0)}
    100%{transform: rotate(-360deg)}
}
@keyframes svg-circle{
    0%{stroke-dashoffset: 100%;}
    100%{stroke-dashoffset: 0%;}
}