@charset "utf-8";
@font-face {
  font-family: 'MiSans Latin Normal';
  src:  url('../fonts/MiSansLatin-Normal.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

#headerChannel,.special-header{padding-top: 50px;}

/*大标题*/
.rowTi {text-align:center;margin-bottom: 5%;padding: 3%;height: 20px;line-height: 20px;}
.rowTi h2 {font-size: 24px;font-weight:bold;color:#333;opacity:0;transform:translateY(100px);transition:all 1s;}
.rowTi h2.animated { opacity:1;  transform:translateY(0)}


/* 产品发展历程 */
#course{
    position: relative;
    background-size: cover;
    padding: .37rem 0 .27rem;
    margin-bottom: 1rem;
}

#course .text-box{padding: 5%;background-color: #F9F9F9;margin-bottom: 30px;border-radius: 5% 0;}
#course .text-box p{font-weight: 400;font-size: 14px;line-height: 28px;color: #666;text-indent: 2em;text-align: justify;}

.course_box{background: url(../img/historybg_s.jpg) center top no-repeat #fff;}
.course_ul{width: 1px;height: auto;padding: 30px 0;margin: auto;position: relative;/* background-color: #C4C4C4; */}
.course_ul li{position: relative;width: 188px;margin-top: 11px;}
.course_ul li .icon{position: absolute;height: 9px;width: 30px;}
.course_ul li .icon i{position: absolute;display: block;width: 9px;height: 9px;background-color: #517BB6;border-radius: 50%;display: none;}
.course_ul li .icon em{position: absolute;display: block;width: 12px;height: 1px;border-bottom: #517BB6 1px dashed;}
.course_ul li .msg-box .time{font-weight: 700;font-size: 1rem;line-height: 23px;color: #fff;/* margin-bottom: 10px; */font-family:"MiSans Latin Normal";}
.course_ul li .msg-box .text{font-weight: 400;font-size: 12px;line-height: 1.8;color: #fff;text-align: justify;word-break: break-all;opacity: .8;}
.course_ul li .msg-box .text_right{text-align: right;}
.course_ul li .msg-box .text_left{text-align: justify;}
.course_ul .course_left .icon{right: 2px;top: 7px;}
.course_ul .course_left .icon i{right: 0;}
.course_ul .course_left .icon em{top: 4px;left: -2px;}
.course_ul .course_left .msg-box{text-align: right;padding-right: 39px;}
.course_ul .course_left{left: -176px;width: 188px;}
.course_ul .course_right .icon{left: 2px;top: 7px;}
.course_ul .course_right .icon i{left: 0;}
.course_ul .course_right .icon em{top: 4px;left: 18px;}
.course_ul .course_right .msg-box{text-align: left;padding-left: 39px;margin-top: -39px;}
.course_ul .course_right{left: -10px;}
.course_ul .course_left .msg-box .text { text-align:right}

.course_ul.future {height: 58px;padding: 146px 0;}
.course_ul.future .course_right .icon {top:6px;}
.course_ul.future li .msg-box .text { font-size:16px; font-weight:bold; color:#546785;}
.course_ul.future li .msg-box .time{ display:none; }
.course_ul.future li .icon em{border-bottom: #c3c3c3 1px dashed;opacity: 1;}
.course_ul.life {padding: 30px 0 60px;height: 1152px;}

.course_ul.prelife {padding: 50px 0 50px;height: 1180px;}
.course_ul.prelife li {margin-top: 10px;}
.course_ul.prelife li .msg-box .text { color:#546785;}
.course_ul.prelife li .msg-box .time{ color:#0E49A8;}
.course_ul.prelife li .icon em{border-bottom: #c3c3c3 1px dashed;opacity: 1;}

/* 相关技术支撑功能模块 */
#technicalSupport {padding: 5% 3%;/* overflow: hidden; */background:#F8F9FF;}
#technicalSupport .row{padding-left: 0; padding-right: 0;}
.techSupportList {}
.techSupportList:after { content:"";display:block; clear:both;}
.techSupportList ul { display: flex; flex-flow: wrap; justify-content: space-between;}
.techSupportList li {float:left;width: 48%;line-height:55px;margin-bottom:3%;}
.techSupportList li a { background:#fff url(../img/linkico.png) no-repeat 95%; display:block; border-radius:10px; text-align:center; font-size:16px; box-shadow: 0 0 10px #ddd;}
.techSupportList li a:hover { background:#0062D9 url(../img/linkico.png) no-repeat 95%;color:#fff;}


.wfLink{padding: 5% 0 0;text-align: center;clear: both;}
.wfLink a{height: 50px;border-radius: 30px;display: inline-block;width:90%;line-height:50px;font-size: 18px;color: #0062D9;font-weight: 700;box-shadow:0 0 15px #78acea; border:#0062D9 solid 1px}

/* 平台 */
.platformList li {display: flex;justify-content: center;align-items: center;gap: 15px;flex-direction: column;}
.platformList .pic span {display: block;width: 400px;height: 650px;animation: float 4s infinite;}
.platformList .pic img{max-width:100%;animation: float 4s infinite;text-align: center;}
.platformList .con {flex: 1 0 100%;/* order: 1; */}
.platformList .intro { font-size: 14px; line-height: 2; text-align: justify; text-indent: 2em; }
.platformList .more { margin-top: 15px; font-size: 0; line-height: 1; text-align: center; }
.platformList .more a { position: relative; z-index: 1; display: inline-block; vertical-align: top; line-height: 20px; padding: 8px 15px; color: #021FA4; font-size: 13px; perspective: 800px;  }
.platformList .more a::before { position: absolute; z-index: -1; content: ''; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #021FA4; border-radius: 500px; transition: all ease 0.6s; }

.platformList .li2 .pic img { }
.platformList .li3 .pic img { margin: 20px;border: #fff solid 20px;box-shadow: #ccc 0 0 20px; width:76%;border-radius: 10px;}

/* --------------------------------- rowBox --------------------------------- */
.rowBox > .hd { position: relative; text-align: center; font-size: 0; line-height: 1; margin-bottom: 15px; }
.rowBox > .hd h3 { position: relative; font-size: 23px; font-weight: bold; line-height: 30px; color: #004EC0; }
.rowBox > .hd h3 span { position: relative; z-index: 1; }

/* 基础应用 */
.atlasBox .hd {margin-right: 20px; width: 100%; background: #2165D0;  background: linear-gradient(to bottom, #20AEFB, #1667F0); border-radius: 5px;display: flex;flex-direction: column;justify-content: center;height: 120px;}
.atlasBox .hd a {display: block; overflow: hidden;height: 120px;display: flex;flex-direction: column;justify-content: center; transition: all 0.5s;background: #2165D0;background: linear-gradient(to bottom, #20AEFB, #1667F0);border-radius: 5px;background: url(../img/linkico.png) no-repeat 95% 20%;}
.atlasBox .hd a:hover{filter:brightness(120%)}
.atlasBox .hd a:after { content: ""; position: absolute; width: 100px; height: 100%; top: 0; left: -100%; overflow: hidden; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, 0) 100%); transform: skewX(-30deg); }
.atlasBox .hd a:hover:after { left: 150%; transition: left 1s ease 0s; }


.atlasBox .hd i {display:block;height:60px;background :url(../../products/img/atlasico1.png) no-repeat center;width: 100%;}
.atlasBox .hd h4 {font-size: 16px;font-weight:bold;color:#fff;padding:0 20px;text-align:center;}
.atlasBox dl {background:#E8F1F5;overflow:hidden;padding:10px;border-radius:5px;margin-bottom: 10px;}
.atlasBox .dl3 { margin:0;}
.atlasBox dt {height: 24px;width: auto;padding: 10px;background:#2165D0;border-radius:5px;display:flex;flex-direction: column;justify-content: center;color:#fff;font-size: 15px;font-weight:bold;line-height:18px;text-align:center;}
.atlasBox dd {overflow:hidden;position:relative;margin: 1% 0 -1%;}
.atlasBox ul {position:relative;display:flex;flex-wrap: wrap;justify-content: flex-start;margin-right: -2%;min-height: 76px;align-content: center;}
.atlasBox ul li {height:36px;line-height:36px;margin: 1% 2% 1% 0;background:#fff;border-radius:5px;text-align:center;width: 48%;margin-right: 2%;font-size: 14px;color: #333;overflow:hidden;}
.atlasBox .dl1 dt {}
.atlasBox ul li a {display:block;background:url(../../products/img/linkico.png) no-repeat 95%;padding:0 8%;height: 100%;}
.atlasBox ul li a:hover { background-color:#2165D0; color:#fff;}



/* 产品咨询 */
.lxss{padding: 5% 3%;background: #fff;}
.lxss .row{padding-left: 0; padding-right: 0; text-align: center;clear: both;overflow: hidden;display: flex;justify-content: space-between;}
.lxss .row::after{display:none;}
.lxss a{width: 48%;height: 50px;border-radius: 30px;display: inline-block;text-align: center;line-height: 50px;font-size: 16px;color: #fff;font-weight: 700;background: url(../img/lx-icon.png) no-repeat #0062D9 30px 50% / 16%;text-indent: 30px;}
.lxss a.sq{background: url(../img/tymk-icon.png) 25px 50% no-repeat #0062D9;background-size: 12%;text-indent: 30px;}
.lxss a:hover{text-decoration:underline;}
 

/* 解决方案 - 已通过权威机构安全检测 */
.solution-institution{background: url(../img/secure.png) 50% 0px no-repeat;background-size:100% auto;}
.solution-institution .sRow-title{text-align:center; font-size:20px; font-weight:bold; line-height:38px; margin-bottom:20px;}
.solution-institution .pics{display:flex; margin:0 auto 5px; justify-content:space-between;}
.solution-institution .pics li{width:50%; height:auto; position:relative; z-index:5; }
.solution-institution .pics li .title{font-size:12px;line-height:1.3;text-align:center;color:#fff;position:absolute;bottom: 12px;left:0px;right:0px;}
.solution-institution .pics li .title b{display:block; font-weight:bold;}
.solution-institution .sRow-con .con-intro{font-size:14px; text-align:center; padding:0 10px; }
.solution-institution .sRow-con{position:relative; padding-bottom:20px; }
.solution-institution .sRow-con .bg{ position:absolute; z-index:0; height:200px; bottom:0px; left:-5px; right:-5px;}
.solution-institution .sRow-con .bg::after{content:""; display:block; position:absolute; left:0px; top:0px; right:0; bottom:0px; background:linear-gradient(to bottom, #E4FBEE, #6DBB8C); opacity:0.4;  border-radius:5px;}

/* 解决方案 - 专业安全检测工具 */
.solution-testingTools .sRow-title{text-align:center; font-size:16px; font-weight:bold; line-height:2; height:auto; margin-bottom:20px;}
.solution-testingTools .sRow-con{ }
.solution-testingTools .sRow-con .con-intro{font-size:16px; text-align:center; color:#fff; background:url(../img/solution-testingtools-bg.png) 50% 0 no-repeat; padding:10px; background-size:auto 100%; margin-bottom:20px; border-radius:15px;}
.solution-testingTools .list{display:grid; grid-template-columns:repeat(2,1fr);grid-gap:15px;}
.solution-testingTools .list li{width:100%; height:230px; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 0 10px rgba(0,0,0,0.15); margin:0px; padding-top:15px; box-sizing:border-box;}
.solution-testingTools .list li .icon{width:120px; height:120px; margin:0 auto 20px; background:url(../img/solution-icon-01.png) center center no-repeat;}
.solution-testingTools .list li .title{line-height:28px; text-align:center; padding:0 10px; font-size:16px; color:#666666}
.solution-testingTools .list li.li2 .icon{background-image:url(../img/solution-icon-02.png)}
.solution-testingTools .list li.li3 .icon{background-image:url(../img/solution-icon-03.png)}
.solution-testingTools .list li.li4 .icon{background-image:url(../img/solution-icon-04.png)}
@media (max-width: 380px) {
  .solution-testingTools .list li .title{font-size:14px;}
}

/* 解决方案 - 安全检测和定向渗透攻击测试 */
.solution-attackTesting{height: 200px;background:url(../img/solution-attackTesting-bg.jpg) center center no-repeat;background-size:cover;position:relative;}
.solution-attackTesting .bg-round{width:700px;height:700px;box-sizing:border-box;border:1px solid #ffffff;border-radius:50%;position: absolute;bottom: -338px;left:calc(50% - 350px);z-index:auto;padding-top:70px;transform: scale(0.32);}
.solution-attackTesting .bg-round::before{content:""; display:block; width:766px; height:766px; box-sizing:border-box; border:1px solid #ffffff; border-radius:50%; position: absolute; opacity:0.3; left:-33px; top:-33px; z-index:0}
.solution-attackTesting .bg-round::after{content:""; display:block; width:836px; height:836px; box-sizing:border-box; border:1px solid #ffffff; border-radius:50%; position: absolute; opacity:0.3; left:-68px; top:-68px; z-index:0;}
.solution-attackTesting .bg-round .icon{width:80px; height:80px; background:url(../img/solution-icon-05.png) center center no-repeat; margin:0 auto 18px; }
.solution-attackTesting .bg-round .txt-en{font-size:36px; color:#fff; text-align:center; font-weight:bold; margin-bottom:8px; line-height:42px;}
.solution-attackTesting .bg-round .txt-cn_1{font-size:24px; color:#fff; text-align:center; line-height:42px; margin-bottom:8px; }
.solution-attackTesting .bg-round .txt-cn_2{font-size:36px; color:#fff; text-align:center; line-height:42px; font-weight:bold; }
.solution-attackTesting .list{width:700px;height:700px;box-sizing:border-box;position: absolute;bottom: -338px;left:calc(50% - 350px);z-index:auto;transform: scale(0.32);}
.solution-attackTesting .list li{position:absolute; z-index:1; color:#fff; font-size:22px; line-height:48px; height:48px; text-align:right; padding-right:30px; white-space: nowrap;}
.solution-attackTesting .list li::after{content:""; width:10px; height:10px; background:#fff; border-radius:50%; position:absolute; top:calc(50% - 5px); right:0px; }
.solution-attackTesting .list li.li1{right: 727px;top:310px;}
.solution-attackTesting .list li.li2{right: 711px;top:218px;}
.solution-attackTesting .list li.li3{right: 644px;top:88px;}
.solution-attackTesting .list li.li4{right: 500px;top:-23px; padding-right:40px;}
.solution-attackTesting .list li.li5{padding:0 0 40px 0;width:400px;text-align:center;right:calc(50% - 200px);top: -115px;}
.solution-attackTesting .list li.li5::after{bottom:0px; top:auto; right:calc(50% - 5px)}
.solution-attackTesting .list li.li6{left: 500px;top:-23px; padding-left:40px; padding-right:0px; text-align:left;}
.solution-attackTesting .list li.li6::after{right:auto; left:0px;}
.solution-attackTesting .list li.li7{left: 644px;top:88px; padding-left:30px; padding-right:0px; text-align:left;}
.solution-attackTesting .list li.li7::after{right:auto; left:0px;}
.solution-attackTesting .list li.li8{left: 711px;top:218px; padding-left:30px; padding-right:0px; text-align:left;}
.solution-attackTesting .list li.li8::after{right:auto; left:0px;}
.solution-attackTesting .list li.li9{left: 727px;top:310px; padding-left:30px; padding-right:0px; text-align:left;}
.solution-attackTesting .list li.li9::after{right:auto; left:0px;}

/* 解决方案 - 三级等保 */
.solution-securityLevel .sRow-intro{font-size:16px; line-height:2; color:#666666; text-align:center; margin-bottom:15px;}
.solution-securityLevel .sRow-card{height:140px;background:#F1FAF7;border-radius:20px;overflow:hidden;position:relative;box-sizing:border-box;display:flex;padding-left: 10px; padding-right: 10px;align-items:center;justify-content:space-around}
.solution-securityLevel .sRow-card::before{content:"";display:block;position:absolute;z-index:0;left:-50px;top:0px; bottom:0; right:45%;background: linear-gradient(30deg, #6CB75A 50px, #0FAB77); border-radius:0 0 40px 0; transform:skewX(-20deg)}
.solution-securityLevel .sRow-card .icon{width:30px;height: 37px;position:relative;z-index:1;background:url(../img/solution-icon-06.png) 0 0 no-repeat;background-size:100% auto;}
.solution-securityLevel .sRow-card .sRow-card_left,
.solution-securityLevel .sRow-card .sRow-card_right{height:auto;line-height:20px;font-size:12px;position:relative;z-index:1;color:#006342;text-align:left;width: 130px;}
.solution-securityLevel .sRow-card .sRow-card_left{color:#fff; }
.solution-securityLevel .sRow-card .sRow-card_t2{font-size:14px; line-height:2; font-weight:bold;}
@media (max-width: 380px) {
    .solution-securityLevel .sRow-card{margin-left:-10px; margin-right:-10px;}
    .solution-securityLevel .sRow-card::before{right:48%}
}
/* 解决方案 - 安全防护措施 */
.solution-safetyProtection .sRow-title{text-align:center; font-size:20px; font-weight:bold; line-height:2; height:auto; margin-bottom:15px;}
.solution-safetyProtection .protectionList{padding:20px 20px; background:#fff; border-radius:10px; box-shadow:0 5px 20px rgba(95,134,98,0.2); display:grid; grid-template-columns:repeat(2,1fr); grid-gap:20px 10px; margin-bottom:30px; }
.solution-safetyProtection .protectionList li{height:auto;line-height:2;padding-left: 20px;background: url(../img/solution-icon-07.png) 0px 6px no-repeat;font-size:14px;background-size:15px auto;}

/* 解决方案 - 多重防御体系 */
.solution-defenseSystem .sRow-title{font-size:20px; text-align:center; font-weight:bold; line-height:2; margin-bottom:10px;}
.solution-defenseSystem .sRow-intro{font-size:16px; line-height:2; color:#666; text-align:center; margin-bottom:15px; padding:0 10px;}
.solution-defenseSystem .sRow-card{padding:25px; width:90%; margin:0 auto 20px; position:relative; box-sizing: border-box;}
.solution-defenseSystem .sRow-card::before{content:""; display:block; position:absolute; left:0px; top:0px; right:0px; bottom:0px; background: linear-gradient(30deg, #4ba155, #0b9a6a); border-radius:20px; z-index:0;box-reflect: below;}
.solution-defenseSystem .sRow-card::after{content:""; display:block; position:absolute; left:0; bottom:-102px; right:0px; height:100px; background:linear-gradient(to bottom, rgba(173,173,173,0.2), rgba(255,255,255,0));  border-radius:20px;}
.solution-defenseSystem .sRow-card-tit{position:relative; z-index:1; font-size:20px; font-weight:bold; text-align:center; color:#fff; margin-bottom:15px;}
.solution-defenseSystem .list{display:flex; width:100%; margin:0 auto 10px;; position:relative; z-index:1; justify-content:space-between; flex-wrap:wrap;}
.solution-defenseSystem .list li{width:48%; height:130px; background:#fff; box-sizing:border-box; padding-top:15px; border-radius:12px; position:relative; border:1px solid #fff; overflow:hidden; cursor:pointer; margin-bottom:4%;}
.solution-defenseSystem .list li a{color:#333;}
.solution-defenseSystem .list li::after{content:""; display:block; position:absolute; left:0px; top:0px; right:0px; bottom:0px; z-index:0; background:linear-gradient(45deg, #6CB75A, #0FAB77); opacity:0; transition:0.5s;}
.solution-defenseSystem .list li .icon{width:60px; height:60px; margin:0 auto 8px; position:relative; z-index:1; transition:0.5s; }
.solution-defenseSystem .list li .title{font-size:16px; color:#333; text-align:center; line-height:32px; position:relative; z-index:1; transition:0.5s;}
.solution-defenseSystem .list li:hover .title,
.solution-defenseSystem .list li a:hover{color:#fff;}
.solution-defenseSystem .list li:hover::after{opacity:1}
.solution-defenseSystem .list li.li1 .icon{background:url(../img/solution-icon-09.png) center center no-repeat; }
.solution-defenseSystem .list li.li2 .icon{background:url(../img/solution-icon-10.png) center center no-repeat; }
.solution-defenseSystem .list li.li3 .icon{background:url(../img/solution-icon-11.png) center center no-repeat; }
.solution-defenseSystem .list li.li4 .icon{background:url(../img/solution-icon-12.png) center center no-repeat; }
.solution-defenseSystem .list li.li1:hover .icon{background:url(../img/solution-icon-09-on.png) center center no-repeat; }
.solution-defenseSystem .list li.li2:hover .icon{background:url(../img/solution-icon-10-on.png) center center no-repeat; }
.solution-defenseSystem .list li.li3:hover .icon{background:url(../img/solution-icon-11-on.png) center center no-repeat; }
.solution-defenseSystem .list li.li4:hover .icon{background:url(../img/solution-icon-12-on.png) center center no-repeat; }
.solution-defenseSystem .sRow-card-tips{font-size:16px; line-height:32px; position:relative; z-index:1; text-align:center; color:#fff;}
.solution-defenseSystem .sRow-more{width:350px; height:56px; line-height:56px; margin:0 auto; position:relative; z-index:2; text-align:center;  }
.solution-defenseSystem .sRow-more a{font-size:16px; font-weight:bold; color:#006342;}

/* 解决方案 - 信创适配 */
.solution-ITAI .sRow-intro{font-size:16px; line-height:2; text-indent:2em; margin-bottom:30px; text-align:justify;}
.solution-ITAI .sRow-bg{position:relative; padding-bottom:30px;}
.solution-ITAI .sRow-bg::after{content:""; position:absolute; bottom:0px; left:-15px; right:-15px; top:0px; background:linear-gradient(to bottom, #6CB75A, #0FAB77); display:block; z-index:0 }
.solution-ITAI .list{display:flex; justify-content:space-between;  flex-wrap:wrap; position:relative; padding-top:25px;}
.solution-ITAI .list li{width:48%; position:relative; z-index:1; margin-bottom:5%}
.solution-ITAI .list .pic{width:100%; height:auto; margin-bottom:10px; -webkit-box-reflect: below 0px linear-gradient(to bottom,rgba(0,0,0,0) 270px,rgba(0,0,0,0.05));
box-reflect: below 0px linear-gradient(to bottom,rgba(0,0,0,0) 270px,rgba(0,0,0,0.05));}
.solution-ITAI .list .pic img{width:100%; height:auto;}
.solution-ITAI .list .title{font-size:14px; font-weight:bold; text-align:center; color:#fff;}
.solution-ITAI .tips{text-align:center; font-size:16px; color:#fff; position:relative; z-index:1}
.solution-ITAI .tips a{color:#fff; text-decoration:underline;}

/* 解决方案 - 移动适配 */
.solution-mobileDevices .sRow-intro{font-size:16px; line-height:2; text-align:left; margin:0 auto 20px; color:#666666; text-indent:2em }
.solution-mobileDevices .sRow-pic{text-align:center; padding:0px;  border-radius:10px 60px 10px 60px; margin-bottom:30px; background:#FBFBFB; }
.solution-mobileDevices .sRow-pic-img{width:80%; height:280px; margin:0 auto; background:#FBFBFB url(../img/pic-mobiledevices.jpg) center center no-repeat; background-size: contain;}

/* 解决方案 - 全媒体发布平台、新媒体监测平台、统一身份认证平台 */
.solution-platforms .sBox .sHd{height:32px;line-height:32px;padding:20px 0px 10px;border-bottom:1px solid #dddddd;margin-bottom:20px;}
.solution-platforms .sBox .sHd h3{height:32px;text-align:center;font-size:24px;font-weight:bold;position:relative;}
.solution-platforms .sBox .sHd h3::after{content:""; display:block; width:48px; height:4px; background:#368C4F; position:absolute; bottom:-11px; left:calc(50% - 28px);}
.row{}
.solution-platforms .sBox .sBd{padding:0 15px;}
.solution-platforms .platforms-flex{ margin:0 auto; display:flex; padding-bottom:50px; flex-wrap:wrap; justify-content:center;}
.solution-platforms .platforms-flex li{margin-bottom:30px;}
.solution-platforms .platforms-flex .pic{width:60vw;height:60vw; max-width:300px; max-height:300px; flex-shrink:0;order:2;text-align:center;background-size:100% auto;background-position:center center;background-repeat:no-repeat;}
.solution-platforms .platforms-flex .con{width:100%; order:1; margin-bottom:15px;}
.solution-platforms .platforms-flex .con .intro{ text-indent:2em; text-align:justify; font-size:16px; margin-bottom:20px;}
.solution-platforms .platforms-flex .con .more{width:auto; height:46px; line-height:46px; text-align:center; overflow:hidden; background:#F1FAF7; border-radius:23px; position:relative; display:block;}
.solution-platforms .platforms-flex .con .more::after{content:""; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(to right, #6CB75A, #0FAB77); z-index:0; opacity:0; transition:0.5s; }
.solution-platforms .platforms-flex .con .more a{display:block;height:46px;font-size: 14px;font-weight:bold;color:#006342;position:relative;z-index:1;}
.solution-platforms .platforms-flex .con .more:hover::after{opacity:1; color:#fff}
.solution-platforms .platforms-flex .con .more:hover a,
.solution-platforms .platforms-flex .con .more a:hover{color:#fff;}
.solution-platforms #sBox_release .platforms-flex .pic{background-image:url(../img/solution-pic-1.png);}
.solution-platforms #sBox_monitor .platforms-flex .con{order:2}
.solution-platforms #sBox_monitor .platforms-flex .pic{background-image:url(../img/solution-pic-2.png);}
.solution-platforms #sBox_sso .platforms-flex .pic{background-image:url(../img/solution-pic-3.png);}


/* ----------------------------------- 安全性 ---------------------------------- */
.solutionSafety-01 {background: url(../img/bg-safety-05.png) no-repeat center bottom;background-size: contain;overflow: hidden;padding: 0 0 10px;}
.solutionSafety-01 > .title { text-align: center; font-size: 18px; line-height: 28px; font-weight: bold; }
.solutionSafety-01 > .intro { margin: 0 6%; font-size: 14px; line-height: 1.8; text-align: center; }
.solutionSafety-01 .list { margin-top: 15px; }
.solutionSafety-01 .list li { position: relative; top: 0; width: 90%; padding-bottom: 56.8%; margin: 2% auto; background: url(../img/bg-safety-06.png) no-repeat center top; background-size: contain; }
.solutionSafety-01 .list li .intro { position: absolute; left: 0; bottom: 15%; width: 100%; font-size: 14px; color: #fff; text-align: center; line-height: 20px; }

.solutionSafety-01 .list li.li2 { background-image: url(../img/bg-safety-07.png); }


.solutionSafety-02 { position: relative; margin: 30px 0 0; }
.solutionSafety-02 > .title { text-align: center; font-size: 20px; line-height: 28px; font-weight: bold; }
.solutionSafety-02 > .intro { font-size: 15px; line-height: 22px; text-align: center; color: #fff; padding: 20px 40px 60px; margin: 20px 0 -50px; background: #021FA4 url(../img/bg-safety-08.png) repeat-x left center; background-size: auto 100%; border-radius: 500px; }
.solutionSafety-02 .list { margin: 10px 15px 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.solutionSafety-02 .list li { position: relative; top: 0; flex: 1 0 140px; box-sizing: border-box; padding: 15px 20px; background: #fff; border-radius: 10px; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); }
.solutionSafety-02 .list .pic { width: 60px; height: 60px; margin: 0 auto; background: url(../img/icons-safety-02.png) no-repeat 0 0; background-size: auto 100%; }
.solutionSafety-02 .list .title { margin-top: 10px; font-size: 14px; height: 40px; line-height: 20px; color: #555; text-align: center; overflow: hidden; }

.solutionSafety-02 .list .li2 .pic { background-position: -60px 0; }
.solutionSafety-02 .list .li3 .pic { background-position: -120px 0; }
.solutionSafety-02 .list .li4 .pic { background-position: -180px 0; }

.solutionSafety-03 { margin: 20px -10px 0; background: url(../img/bg-safety-09.jpg) no-repeat center center; background-size: cover; overflow: hidden; }
.solutionSafety-03 .row { overflow: hidden; }
.solutionSafety-03 .list { position: absolute; z-index: 2; left: 0; top: 0; right: 0; width: 100%; height: 100%; }
.solutionSafety-03 .list li { position: absolute; display: flex; align-items: flex-start; column-gap: 5px; line-height: 1.3; font-size: 12px; color: #fff; }
.solutionSafety-03 .list li::before { flex-shrink: 0; content: ''; margin-top: 5px; width: 6px; height: 6px; background: #fff; border-radius: 50%; }

.solutionSafety-03 .list li.li1::before,
.solutionSafety-03 .list li.li2::before,
.solutionSafety-03 .list li.li3::before,
.solutionSafety-03 .list li.li4::before,
.solutionSafety-03 .list li.li5::before { order: 1; }

.solutionSafety-03 .list li.li1 { right: 50%; top: 80%; margin-right: 37%; }
.solutionSafety-03 .list li.li2 { right: 50%; top: 63%; margin-right: 35.5%; }
.solutionSafety-03 .list li.li3 { right: 50%; top: 46%; margin-right: 29.5%; }
.solutionSafety-03 .list li.li4 { right: 50%; top: 29%; margin-right: 16.5%; }
.solutionSafety-03 .list li.li5 { flex-direction: column; align-items: center; width: 100%; left: 0; right: 0; margin: auto; top: 10.5%; }
.solutionSafety-03 .list li.li6 { left: 50%; top: 29%; margin-left: 16.5%; }
.solutionSafety-03 .list li.li7 { left: 50%; top: 46%; margin-left: 29.5%; }
.solutionSafety-03 .list li.li8 { left: 50%; top: 63%; margin-left: 35.5%; }
.solutionSafety-03 .list li.li9 { left: 50%; top: 80%; margin-left: 37%; }

.solutionSafety-03 .roundCon { position: relative; z-index: 1; margin: 20% auto -25%; width: 70vw; height: 70vw; box-sizing: border-box; text-align: center; color: #fff; line-height: 1.6; background: rgba(16, 36, 92, 0.3); border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 50%; }
@media (min-width:500px) {
    .solutionSafety-03 .roundCon { width: 350px; height: 350px; }
}
.solutionSafety-03 .roundCon::before,
.solutionSafety-03 .roundCon::after,
.solutionSafety-03 .roundCon .round { position: absolute; z-index: -1; left: 0; top: 0; right: 0; bottom: 0; content: ''; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; margin: -5%; }
.solutionSafety-03 .roundCon::before { margin: -10%; border-color: rgba(255, 255, 255, 0.2); }
.solutionSafety-03 .roundCon::after { margin: -15%; border-color: rgba(255, 255, 255, 0.1); }
.solutionSafety-03 .roundCon .icon { width: 40px; height: 40px; margin: 10% auto 0; background: url(../img/icon-safety-01.png) no-repeat center center; background-size: contain; }
.solutionSafety-03 .roundCon .title-01 { margin-top: 10px; font-size: 16px; font-weight: bold; }
.solutionSafety-03 .roundCon .title-02 { font-size: 14px; }
.solutionSafety-03 .roundCon .title-03 { font-size: 17px; font-weight: bold; }

.solutionSafety-04 { margin-top: 20px; }
.solutionSafety-04 .row > .intro{ text-align: center; line-height: 1.8; font-size: 16px; color: #666; }
.solutionSafety-04 .list{ margin-top: 15px; display: flex; flex-wrap: wrap; background: #F0F3FA; border-radius: 20px; overflow: hidden; }
.solutionSafety-04 .list li { position: relative; z-index: 1; flex: 1 0 100%; padding: 20px 25px; height: auto; display: flex; gap: 10px; justify-content: center; align-items: center; color: #021FA4; box-sizing: border-box; }
.solutionSafety-04 .list .icon { width: 50px; height: 50px; background: url(../img/icon-safety-02.png) no-repeat center center; background-size: contain; }
.solutionSafety-04 .list .intro { font-size: 16px; line-height: 1.6; }
.solutionSafety-04 .list .title { font-size: 20px; line-height: 1.6; font-weight: bold; }

.solutionSafety-04 .list .li1 { color: #fff; }
.solutionSafety-04 .list .li1::before { position: absolute; top: -20%; left: 0; bottom: 0; right: 0; content: ''; z-index: -1; background: linear-gradient(82.07deg, #2F4EDC 0.45%, #0320A6 95.08%); border-radius: 0 0 0 15px; transform: skewY(3deg); }

.solutionSafety-05 { position: relative; z-index: 1; margin: 20px -10px 0; padding-top: 25px; height: auto; background: #F0F3FA; box-sizing: border-box; }
.solutionSafety-05 > .row .title { font-size: 20px; text-align: center; line-height: 26px; font-weight: bold; color: #333; }
.solutionSafety-05 .list { margin: 15px 10px -60px; display: flex; flex-wrap: wrap; row-gap: 15px; background: #fff; border-radius: 10px; padding: 15px; padding-right: 0; }
.solutionSafety-05 .list li { position: relative; width: 50%; font-size: 15px; line-height: 22px; padding: 0 15px 0 20px; box-sizing: border-box; }
.solutionSafety-05 .list li::before { position: absolute; left: 0; top: 4px; width: 12px; height: 12px; content: ''; background: url(../img/icon-safety-03.png) no-repeat center center; background-size: contain; }

.solutionSafety-06 { margin: 0 -10px; padding-bottom: 15px; background: url(../img/bg-safety-10.jpg) no-repeat center center; background-size: cover; overflow: hidden; }
.solutionSafety-06 .row { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-top: 80px; }
.solutionSafety-06 .pic { width: 90%; height: 0; padding-bottom: 72%; background: url(../img/bg-safety-11.png) no-repeat center center; background-size: contain; }
.solutionSafety-06 .con { flex: 1 0 100%; padding: 0 15px; box-sizing: border-box; }
.solutionSafety-06 .title { overflow: hidden; line-height: 1.3; color: #fff; font-size: 22px; font-weight: bold; }
.solutionSafety-06 .title::before { float: left; content: ''; margin-right: 15px; width: 60px; height: 60px; background: url(../img/icon-safety-04.png) no-repeat center center; background-size: contain; }
.solutionSafety-06 .title p:nth-of-type(1) { margin-top: 3px; font-size: 20px; font-weight: normal; }
.solutionSafety-06 .intro { margin-top: 15px; font-size: 18px; line-height: 26px; font-weight: bold; color: #fff; text-align: center; }
.solutionSafety-06 .list { margin-top: 15px; display: flex; flex-wrap: wrap; }
.solutionSafety-06 .list li { flex: 0 0 29.3333%; margin: 2%; font-size: 16px; line-height: 30px; border: 1px solid #fff; white-space: nowrap; padding: 0 20px; box-sizing: border-box; border-radius: 500px; font-size: 14px; color: #fff; text-align: center; transition: all ease 0.6s; }

.solutionSafety-07 { margin-top: 20px; }
.solutionSafety-07 .row > .title { font-size: 20px; font-weight: bold; line-height: 32px; text-align: center; color: #333;padding-bottom: 20px; }
.solutionSafety-07 .row > .intro { margin-top: 10px; font-size: 14px; color: #666;  line-height: 2; text-indent: 2em;}
.solutionSafety-07 .rowCon { position: relative; z-index: 1; margin: 25px 10px 0; padding: 20px; }
.solutionSafety-07 .rowCon::before { position: absolute; z-index: -1; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(82.07deg, #2948D5 0.45%, #0320A6 95.08%); transform: skewX(-3deg); border-radius: 10px; }
.solutionSafety-07 .rowCon > .title { line-height: 30px; font-size: 20px; color: #fff; font-weight: bold; text-align: center; margin-bottom: 15px;}
.solutionSafety-07 .rowCon .intro { margin-top: 10px; font-size: 14px; line-height: 2; text-align: center; color: #fff; }
.solutionSafety-07 .rowCon .list { margin-top: 15px; display: flex; flex-wrap: wrap; justify-content: center; }
.solutionSafety-07 .rowCon .list li { position: relative; top: 0; width: 46%; margin: 2%; background: #fff; border-radius: 8px; padding: 20px 0 10px; box-sizing: border-box; transition: all ease 0.6s; }
.solutionSafety-07 .rowCon .list .icon { width: 40px; height: 40px; margin: 0 auto; background: url(../img/icons-safety-07.png) no-repeat 0 0; background-size: auto 100%; }
.solutionSafety-07 .rowCon .list .title { margin-top: 10px; line-height: 26px; text-align: center; color: #333; font-size: 14px; }

.solutionSafety-07 .rowCon .list .li2 .icon { background-position: -40px 0; }
.solutionSafety-07 .rowCon .list .li3 .icon { background-position: -80px 0; }
.solutionSafety-07 .rowCon .list .li4 .icon { background-position: -120px 0; }

.solutionSafety-07 .more { text-align: center; margin-top: 20px;  margin-bottom: 10px;font-size: 0; line-height: 1; }
.solutionSafety-07 .more a { position: relative; z-index: 1; display: inline-block; vertical-align: top; line-height: 38px; padding: 0 20px; color: #021FA4; font-size: 14px; perspective: 800px; }
.solutionSafety-07 .more a::before { position: absolute; z-index: -1; content: ''; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #021FA4; border-radius: 500px; transition: all ease 0.6s; }