@charset "utf-8";

body{font-weight:400; min-width:1400px; }
body .wrap{margin: 0 auto;background:#ffffff;}
#header { }
.row,
.siteWidth{max-width:1400px;margin:0 auto;position: relative;}
.productSpecial-SEP{overflow:hidden;clear: both;}
.red { color:#f00}


/* 头部 */
.special-header{position:relative;z-index:1;/* max-width:1920px; */margin:0 auto;overflow:hidden;background: url(../img/banner.png) center top no-repeat;clear: both;background-size: 100% 100%;background-color: #F2F5FC;}
.special-header .siteWidth{height: 731px;position:relative;z-index:5;box-sizing:border-box;padding-top: 200px;}
.special-header .logo{position:absolute; left:0px; top:41px; height:90px;}
.special-header .logo img{height: 50px;width:auto;}
.special-header .links {height: 36px;position: absolute;top: 48px; right: 0;}
.special-header .links a { height:36px; border-radius: 18px;line-height: 36px; text-align: center; background-color:rgba(0,0,0,0.34); color: #fff;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(0,0,0,0.5); }
.special-header .special-header-title_en{text-align:center; font-size:48px; font-weight:bold; color:#fff; height:64px; line-height:64px; text-shadow:0 2px 2px rgba(0,0,0,0.25); }
.special-header .special-header-title_cn {text-align: left;font-size: 92px;font-weight:bold;color:#fff;line-height: 1.33;margin-bottom: 10px;}
.special-header .special-header-title_cn b { display:block; width:55%;}
.special-header .special-header-title_cn b i { font-weight:bold; color:#FCC80C}
.special-header .special-header-slogan{margin:0 auto;font-size:18px;line-height:36px;color:#fff;text-align: left;}
.special-header .special-header-icon {display:block;position:absolute;right: 10px;top: 230px;}

/* indTabBox */
.indTabBox .tHd{margin-bottom:36px;}
.indTabBox .tHd ul{display:block;margin:0 auto;width:500px;display:flex;height:52px;border-radius:26px;border: 1px solid #eee;}
.indTabBox .tHd ul li{width:250px; text-align:center; font-size:18px; line-height:52px; height:52px; font-weight:bold; color:#006342; cursor:pointer;  }
.indTabBox .tHd ul li a{color:#006342}
.indTabBox .tHd ul li.on{color:#fff; background:linear-gradient(to right, #6CB75A, #0FAB77); border-radius:26px;}

/* row-arrow-down */
.row-arrow-down{width:60px;height:60px;position:absolute;bottom: 80px;left:calc(50% - 30px);border:1px dashed #059B68;border-radius:50%;box-sizing:border-box;display: none;}
.row-arrow-down::before{content:""; display:block; width:2px; height:80px; background:#059B68; position:absolute; top:20px;; left:calc(50% - 1px);}
.row-arrow-down::after{content:""; display:block; width:0px; height:0px; border:5px solid transparent; border-top-color:#059B68; border-bottom:none; position:absolute; left:calc(50% - 5px); top:98px}

/* cBox */
.cBox .cHd{height:53px;padding: 0 0px 30px;margin-bottom: 50px;position:relative;text-align:center;}
.cBox .cHd:after { position:absolute; transition:all 1s; height:2px; width:0px; background:#4936D8; content:""; left:50%; bottom:-1px; margin-left:0px; }
.cBox .cHd h3 { height:53px; transition:all 1s;line-height:153px; color:transparent; padding-bottom:30px; text-align:center; font-size:40px; font-weight:bold; position:relative; display:inline-block; margin:0 -20px;}
.cBox .cHd h3::before,
.cBox .cHd h3::after{ transition:all 1s; position:absolute; left:50%; margin-left:-5px; bottom:-5px; content:"";display:block; width:10px; height:10px; background:#4936D8; border-radius:50% }
.cBox .cHd h3::after {  margin-left:-5px;}

.cBox .cHd.animated:after { width:90px; margin-left:-45px; }
.cBox .cHd.animated h3 { line-height:53px; color:#333 }
.cBox .cHd.animated h3::before,
.cBox .cHd.animated h3::after{ margin-left:-50px; }
.cBox .cHd.animated h3::after {  margin-left:40px;}

.cBox .siteWidth>.intro {font-size: 16px;line-height: 30px;text-indent: 2em;margin-bottom: 40px;padding: 15px 0;}
.cBox .siteWidth>.intro p { margin-block:15px;}
.cBox .siteWidth>.pic {float: right;margin-left: 40px;}

.cBox .shd { text-align:center; margin-bottom:30px;}
.cBox .shd h3 { font-size:24px; font-weight:bold; height:40px; line-height:40px; display:inline-block; position:relative;}
.cBox .shd label { color:#666; font-size:16px; clear:both; display:block;}
.cBox .shd h3:after,
.cBox .shd h3:before { position:absolute; left:-60px; top:45%; border-radius:10px; display:block; content:""; width:50px; height:5px; background: linear-gradient(90deg, rgba(255, 187, 94, 0) 0%, #FFBB5E 100%);}
.cBox .shd h3:after { right:-60px; left:auto; background: linear-gradient(270deg, rgba(255, 187, 94, 0) 0%, #FFBB5E 100%)}


.rowBox .hd h3{height:53px;padding: 0 0px 30px;margin-bottom: 50px;position:relative;text-align:center;}
.rowBox .hd h3:after { position:absolute; transition:all 1s; height:2px; width:0px; background:#4936D8; content:""; left:50%; bottom:-1px; margin-left:0px; }
.rowBox .hd h3 span{ height:53px; transition:all 1s;line-height:153px; color:transparent; padding-bottom:30px; text-align:center; font-size:40px; font-weight:bold; position:relative; display:inline-block; margin:0 -20px;}
.rowBox .hd h3 span::before,
.rowBox .hd h3 span::after{ transition:all 1s; position:absolute; left:50%; margin-left:-5px; bottom:-5px; content:"";display:block; width:10px; height:10px; background:#4936D8; border-radius:50% }
.rowBox .hd h3 span::after {  margin-left:-5px;}
.rowBox .hd h3.animated:after { width:90px; margin-left:-45px; }
.rowBox .hd h3.animated span { line-height:53px; color:#333 }
.rowBox .hd h3.animated span::before,
.rowBox .hd h3.animated span::after{ margin-left:-50px; }
.rowBox .hd h3.animated span::after {  margin-left:40px;}
.rowBox .hd .line { display:none; }

#cBox_01 {padding: 50px 0;background: #F2F5FC;/* height: 655px; *//* margin-bottom: 180px; */clear: both;}
#cBox_01 .tips {display:flex;background:url(../img/tipsbg.png) no-repeat;height:220px;text-align:center;color:#fff;font-size:32px;line-height:2.125;font-weight:bold;flex-direction: column;justify-content: center;margin-bottom: -45px;}

#cBox_02 {padding-top: 50px;}
#cBox_02 .pic {float:left;margin: 0 40px 0 0;}
#cBox_02 .siteWidth {display:flex;flex-direction: row;align-items: center;}

#cBox_03 {background: url(../img/row03bg.png) no-repeat center top;padding-top:389px;height:1704px}
#cBox_03 .cHd { margin-bottom:60px; }
#cBox_03 .cHd.animated h3 { color:#fff; }
#cBox_03 .cHd:after,
#cBox_03 .cHd h3:before,
#cBox_03 .cHd h3:after { background:#fff; }
.agvBox { columns:4; column-gap:20px; }
.agvBox dl { overflow:hidden; background:#fff; border-radius:5px; margin-bottom:20px; }
.agvBox dl dt {height:120px;display:flex;justify-content: center;align-items: center; background:linear-gradient(to bottom, #fff, #E9E5FF); font-size:24px; font-weight:bold; color:#4836D8;}
.agvBox dl dt h3 { font-weight:bold; padding:0 10%; line-height:1.33; text-align:center; position:relative; z-index:1;}
.agvBox dl dt i { position:absolute; font-family:Impact, Arial, NewsGoth BT; color:#AEA3FF; opacity:0.1; font-size:120px }
.agvBox dl dd {padding:30px 30px 50px;font-size:16px;line-height:2;text-indent:2em;text-align:justify;display:flex;flex-direction: column; gap:18px}

.agvBox .dl2 dd, .agvBox .dl6 dd, .agvBox .dl9 dd {  min-height:224px }
.agvBox .dl3 dd, .agvBox .dl7 dd, .agvBox .dl10 dd {  min-height:174px }
.agvBox .dl4 dd, .agvBox .dl11 dd {  min-height:446px }

#solutionSafety {margin-bottom:50px;padding-top: 50px;}
#solutionSafety .hd .intro {text-indent: 2em;font-size: 16px;padding: 0 0 20px 0;width: 75%;line-height: 2em;margin: 0 auto;}

/* cBox_1 - row-1 */
.solutionSafety-04 .list .li1::before { background: linear-gradient(82.07deg, #6B5BF2 0.45%, #4238D6 95.08%);  }
.solutionSafety-04 .list li { color: #483DDA; }

#solutionSafety .more a {color: #4238D6; }
#solutionSafety .more a::before { border: 1px solid #4238D6;}
#solutionSafety .more a:hover::before {  background: linear-gradient(90deg, #6B5BF2 0%, #4238D6 100%); }

.solutionSafety-05 .row { width:1200px;}
.solutionSafety-07 .rowCon::before {background: linear-gradient(73deg, #6B5BF2 0.45%, #4238D6 95.08%);}

#xcsp {padding-top: 50px;}
#xcsp .intro { margin-bottom:70px; font-size:16px; text-indent:2em}
#xcsp .more { text-align:center;}

.xcspList {position: relative;z-index: 1;display: flex;flex-wrap: wrap;justify-content: space-between;gap: 20px;margin-bottom: 50px;}
.xcspList li {position: relative;flex: 1;background: linear-gradient(180deg, #463CD9 0%, #DDDBFF 100%);border-radius:10px; width:258px;}
.xcspList .con { position:relative;margin: 1px;background:#fff;border-radius:10px;padding: 50px 10px 0;}
.xcspList .title { padding-bottom: 14px; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%); font-size: 16px; line-height: 46px; font-weight: bold; text-align: center; color: #333; }
.xcspList .pic {position: relative;overflow: hidden;width: 240px;height: auto;margin: 0 auto;line-height: 0;}
.xcspList .pic img { width: 100%;height: 330px;}
.xcspList .li3 .pic { padding:10px }
.xcspList .li3 .pic img { width:220px; height: 310px; }
.xcspList .con,
.xcspList .pic img { transition: all ease 0.6s; }
.xcspList li:hover { transform: translateY(-10px); }

.xcspList li .con:before { position:absolute; top:-74px;; left:50%; margin-left:-50px; content:""; display:block; width:100px; height:200px; background:url(../img/num1.png) no-repeat center;}
.xcspList .li2 .con:before { background-image:url(../img/num2.png);}
.xcspList .li3 .con:before { background-image:url(../img/num3.png);}
.xcspList .li4 .con:before { background-image:url(../img/num4.png);}
.xcspList .li5 .con:before { background-image:url(../img/num5.png);}

/* --------------------------------- 移动设备适配 --------------------------------- */
#mobile {background: #F2F5FC;padding-top: 50px;}
#mobile .rowBox .devicesPic { background: #fff; padding: 60px 30px; border-radius: 10px; }
.devicesPic {margin-bottom: 40px;text-align: center;}
.devicesPic span { display: inline-block; vertical-align: top; }
.devicesPic img { max-width: 100%; height: auto; }
.devicesIntro { margin-bottom: 30px; font-size: 16px; line-height: 30px; text-align: justify; color: #333; text-indent: 2em; padding:0 30px }
.mobileList {padding: 50px 0 65px;gap: 70px;display: flex;justify-content: center;}
.mobileList li { flex-basis: 599px; }
.mobileList .pic { position: relative; margin: 0 30px; }
.mobileList .pic img { display: block; width: 100%; height: auto; }
.mobileList li:hover .pic img { transform: translateY(-5px); }
.mobileList .title { margin-top: 25px; text-align: center; }
.mobileList .title span { position: relative; z-index: 1; display: inline-block; vertical-align: top; font-size: 16px; line-height: 45px; padding: 0 40px; background: linear-gradient(90deg, #6B5BF2 0%, #4238D6 100%) ; color: #fff; border-radius: 500px; overflow: hidden; }
.mobileList .title span::before { position: absolute; z-index: -1; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: #1a0fb2; border-radius: 500px; transform: scaleX(0); transform-origin: center center; visibility: hidden; opacity: 0; }

.mobileList .pic img,
.mobileList .title span,
.mobileList .title span::before {  transition: all ease 0.6s; }

.mobileList li:hover .title span { color: #fff; }
.mobileList li:hover .title span::before { transform: scaleX(1); visibility: visible; opacity: 1; }
#mobile .text_p { text-align: center;}

#webfutureIntro { padding:70px 0;}
#webfutureIntro .bd {display:flex;align-items: center; gap:60px}
#webfutureIntro .intro { text-indent:2em; line-height:2em; font-size:16px;}

.systemList{
    columns: 2;
    gap: 30px;
}
.systemList li{border-radius: 10px;position:relative;width:100%;min-height: 410px;box-sizing:border-box;padding: 110px 40px 90px;text-align:center;display: flex;flex-direction: row;background: #F2F5FC;flex-wrap: nowrap;margin-bottom: 20px;justify-content: space-between;}
.systemList li .li-t{ position:absolute; top:0; left:0; width:100%}
.systemList li .p-title{height:80px;line-height:80px;background: linear-gradient(180deg, #6657EF 0%, #453AD8 100%);color:#fff;font-size:24px;font-weight:bold;padding:0 10px;border-radius: 10px 10px 0 0;}
.systemList li .pic{float: left;margin-right: 20px;min-width: 200px;}
.systemList li .pic img{transition:0.5s; width:200px;}
.systemList li .p-intro{height:auto;line-height:32px;font-size:16px;color:#fff;overflow: hidden;transition:0.5s;display: none;}
.systemList li .intro{font-size:16px;color:#666666;line-height:2;text-align:left;overflow: hidden;}
.systemList li .intro p{text-indent:2em;margin-bottom: 1em;}

.systemList li .more{border: 1px solid #453AD8;width:360px;height:38px;line-height:38px;text-align:center;margin:0 auto;overflow:hidden;border-radius:26px;position: absolute;bottom: 40px;left: 50%;margin-left: -180px;}
.systemList li .more::after{content:""; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(to right, #6657EF, #453AD8); z-index:0; opacity:0; transition:0.5s; }
.systemList li .more a{display:block; height:38px; font-size:16px; color:#453AD8; position:relative; z-index:1;}
.systemList li .more:hover::after{opacity:1; color:#fff}
.systemList li .more:hover a,
.systemList li .more a:hover{color:#fff;}

.systemList li:hover {}
.systemList li:hover .pic img{transform:scale(1.1)}

.systemList .li4 {min-height: 530px;padding: 120px 40px 20px;}
.systemList .li5 {min-height: 528px;padding: 120px 40px 0px;}
.systemList .li4 .more,
.systemList .li5 .more {/* bottom:90px; */}

.rowTi { height:auto; margin:0; padding:0;}
.rowTi h2{height:53px;padding: 0 0px 30px;margin-bottom: 50px;position:relative;text-align:center;}
.rowTi h2:after { position:absolute; transition:all 1s; height:2px; width:0px; background:#4936D8; content:""; left:50%; bottom:-1px; margin-left:0px; }
.rowTi h2 span{ height:53px; transition:all 1s;line-height:153px; color:transparent; padding-bottom:30px; text-align:center; font-size:40px; font-weight:bold; position:relative; display:inline-block; margin:0 -20px;}
.rowTi h2 span::before,
.rowTi h2 span::after{ transition:all 1s; position:absolute; left:50%; margin-left:-5px; bottom:-5px; content:"";display:block; width:10px; height:10px; background:#4936D8; border-radius:50% }
.rowTi h2 span::after {  margin-left:-5px;}
.rowTi h2.animated:after { width:90px; margin-left:-45px; }
.rowTi h2.animated span { line-height:53px; color:#333 }
.rowTi h2.animated span::before,
.rowTi h2.animated span::after{ margin-left:-50px; }
.rowTi h2.animated span::after {  margin-left:40px;}

#technicalSupport { padding:30px 0 0; background:transparent;}
.techSupportList li a {box-shadow: none;background-color: #F8F9FA; }
.techSupportList li a:hover { background-color:#F2F5FC; color:#483DDA; font-weight:bold;}

.lxss a, .lxss a.sq { background-color:#483DDA }
.lxss a:hover, .lxss a.sq:hover { background-color:#1a0fb2 }

/*基础应用*/
#jcyy,#businessSystem {padding:50px 0 0}
#jcyy .atlasBox .hd{    background: linear-gradient(to bottom, #6B5BF2, #4238D6);} 
#jcyy .atlasBox dt{    background: linear-gradient(90deg, #6B5BF2 0%, #4238D6 100%);}
#jcyy .atlasBox ul li a:hover {   background-color: #6B5BF2;}