@charset "utf-8";
/* CSS Document */
/*banner*/
#ins_banner { position: relative; z-index: 0;}
#ins_banner .swiper-slide { position: relative; z-index: 0;}
#ins_banner .con { width: 100%; margin: 0;}
#ins_banner .pic { position: relative; z-index: 0; padding-top: 597px;}
#ins_banner .pic2 { padding-top: 860px;}
#ins_banner .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
#ins_banner .txtb { position: absolute; z-index: 2; left: 5.2%; top: 6.7vw; color: #fff;
bottom: 6.7vw; 
right: 0; right: 5.2%;
display: flex; justify-content: center; align-items: center;}
#ins_banner .txtb .txt { width: 51%; margin: 0 auto 0 0; text-align: left;
}
#ins_banner .txtb .txt2 { margin-top: 2em;}
#ins_banner .txtb .txt .name {letter-spacing: 0.1em; font-weight: bold; line-height: 1.2; }
#ins_banner .txtb .txt .name2 {font-weight: lighter;  text-transform: uppercase;
 margin-bottom: 0.6em; font-weight: 100; line-height: 1.2;}
#ins_banner .txtb .txt .intro {font-weight: lighter;  font-weight: 100;  
max-width: 28em; margin: 0.6em auto 0 0; line-height: 1.2;
 max-height:2.4em;
overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:2; 
}
#ins_banner .txtb .txt .intro2 {font-weight: lighter;  font-weight: 100;  
 margin: 0.6em auto 0 0; line-height: 1.2;

}
#ins_banner .txtb .txt .intro2 ul { margin-top: -0.9em; width: 25em;
	display: flex; flex-wrap:wrap ; justify-content: flex-start; align-items: stretch;}
#ins_banner .txtb .txt .intro2 li { margin-top: 0.7em; width: 11em; margin-right: 1.2em;
background-color: #69b9fb;
border: 1px solid #b0d7fb;
line-height: 2.3em;
-moz-border-bottom-left-radius:0.4em; 
-webkit-border-bottom-left-radius:0.4em; 
border-bottom-left-radius:0.4em;
-moz-border-bottom-right-radius:1em; 
-webkit-border-bottom-right-radius:1em; 
border-bottom-right-radius:1em;}
#ins_banner .txtb .txt .intro2 li div { padding: 0 0.5em 0 1.2em;}
#ins_banner .txtb .txt {
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
transform: translate(0,0);
-ms-transform: translate(0,0);
-webkit-transform: translate(0,0);
}

#ins_banner .btnNext,#ins_banner .btnPrev {
	cursor: pointer; display: inline-block;
	position: absolute; right: 5.2%; top: 50%; z-index: 10;
	width: 2.8em; height: 2.8em; margin-top: -1.4em;
	border: 1px solid #fff;
	background:#fff  url(../images/arr_gray.png) center center no-repeat;
	background-size: 26.6% auto;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
} 
#ins_banner .btnPrev { left: 5.2%; right: auto;
transform: rotate(180deg);
-ms-transform: rotate(180deg); 
-webkit-transform: rotate(180deg); 
}

#ins_banner .btnNext:hover,
#ins_banner .btnPrev:hover {
	border: 1px solid #fff;	
}
#ins_banner .btnPrev::before,
#ins_banner .btnNext::before{
	content: ""; display: block;position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background:  url(../images/arr_gray.png) center center no-repeat;
	background-size: 26.6% auto;
}
#ins_banner .btnPrev:hover::before,
#ins_banner .btnNext:hover::before {
	background-image:  url(../images/arr_white.png);
}
#ins_banner .btnNext::after,
#ins_banner .btnPrev::after{
	content: ""; display: block; position: absolute; z-index: -1;
	top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#068d39+0,058d7d+100 */
	background: linear-gradient(to right,  rgba(6,141,57,1) 0%,rgba(5,141,125,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
}
#ins_banner .btnNext:hover::after,
#ins_banner .btnPrev:hover::after{ 
	filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}
#ins_banner  .swiper-button-disabled,
#ins_banner  .swiper-button-disabled:hover{ 
filter:alpha(opacity=50);-moz-opacity:0.5; opacity:0.5;}
#ins_banner .swiper-button-disabled:hover::before,
#ins_banner .swiper-button-disabled:hover::before {
	background-image:  url(../images/arr_gray.png);
}
#ins_banner .swiper-button-disabled:hover::after,
#ins_banner .swiper-button-disabled:hover::after{ 
	filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}

 @media only screen and (max-width:1920px) {
#ins_banner .pic { padding-top:31.1%;}
#ins_banner .pic2 { padding-top: 45%;}
}
 @media only screen and (max-width:828px) { 
#ins_banner .con { width: 100%; margin: 0;}
#ins_banner .pic { position: relative; z-index: 0; padding-top: 60%;}
#ins_banner .pic2 { position: relative; z-index: 0; padding-top: 70%;}
#ins_banner .txtb { left: 2em; right: 2em;}
#ins_banner .txtb .txt { width: 100%;}
#ins_banner .txtb .txt .name { font-size: 4.8vw;}
#ins_banner .txtb .txt .intro { font-size: 2vw;}
#ins_banner .txtb .txt .btn { font-size: 2vw; margin-top: 1.8em;}

#ins_banner .txtb .txt .intro2 ul { font-size: 0.7em;}
#ins_banner .txtb .txt .intro2 li div { padding:0 0.5em;}
#ins_banner .txtb .txt .intro2 li { width: 10em; margin-right: 0.5em;}
}


.newIBox { padding-top: 3.5em;  padding-bottom: 5em;}
.newList li { margin-top: 1.75em;
 display: flex; justify-content: space-between; align-items: center;
 border: 1px solid #e1e4f3; background-color: #fefeff;
 padding: 2.3% 3.5% 2.3% 3.3%;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 }
.newList .txtb { flex: 1; margin-right: 6.6%; text-align: left;}
.newList .txtb .name { color: #1a1d3c;overflow: hidden;
text-overflow:ellipsis; height: 1.5em;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:1; }
.newList .txtb .name a {color: #1a1d3c;}
.newList .txtb .name a:hover {color: #0099ff;}
.newList .txtb .intro { margin-top: 1em; color: #646b97; line-height: 1.9em;
height: 5.7em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }
.newList .txtb .about { margin-top: 1.4em;  display: flex; justify-content: space-between; align-items: center;}
.newList .txtb .date { position: relative; z-index: 0;
color: #a7acbd; padding-left: 1em;}
.newList .txtb .date::before { content: ""; display: block;
width: 0.3em; height: 0.3em; background-color: #0099ff;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
position: absolute; left: 0; top: 50%; margin-top: -0.19em;
}
.newList .picb { width: 27.4%;}
.newList .picb .pic { display: block; cursor: pointer; padding-top: 64.2%; position: relative; z-index: 0;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
overflow: hidden;}
.newList .picb .pic img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover;}
 

.topGobackW {width:86.1%; margin: 3.7em auto 0; text-align: left;}
.topGoback { color: #797b89; display: inline-block; padding-left: 1.3em;
background: url(../images/arrow_5.png) 0 center no-repeat;}

.newDeBox { padding:0 0 5em;	width:72.5%; margin: 0 auto;}
.newDeBox h1 { font-weight: normal; margin: 0 8%; line-height: 1.2em; color: #1a1d3c;}
.newDeBox .about { padding: 1.7em 0 1.8em; border-bottom: 1px solid #d4d6e2; color: #9ca0ba;}
.newDeBox .about span { display: inline-block;}
.newDeBox .about span.line { margin: 0 0.4em;}
.newDeBox .content { margin-top: 2.5em; overflow: hidden; line-height: 1.9;
 text-align: left;color: #797b89;}
 .newDeBox h6 { margin: 0; padding: 0; color: #333; font-size: 1.12em; font-weight: normal;}
.newDeBox img { max-width: 100%; height: auto;}
.newDeBox .btnW { margin-top: 3em;}
.newDeBox .btnReturn { background-color: #0099ff; padding: 0.1em 3.6em 0 4.3em;
 line-height: 3em; 
display: inline-block; color: #fff; font-weight: lighter;
-moz-border-radius:1.6em; -webkit-border-radius:1.6em; border-radius:1.6em;}
.newDeBox .btnReturn::before { position: relative; top: -0.1em; content: ""; 
width: 2.5em; height: 2.5em;
display: inline-block; vertical-align: middle; margin-right: 0.4em;
background: url(../images/arrow_6.png) no-repeat center center / 100% auto;}

@media only screen and (max-width:1500px) {
	.newDeBox { width: 80%;}
}
@media only screen and (max-width:1400px) {
	.newDeBox { width: 90%;}
}
@media only screen and (max-width:1200px) {
	.newDeBox { width: 90%;}
}
@media only screen and (max-width:828px) {
	.newDeBox { width: auto;}
}


.caseList li { margin-top: 2.1em;
 display: flex; justify-content: space-between; align-items: flex-start;text-align: left;
 border: 1px solid #e1e4f3; background-color: #fff;
 padding: 3.3% 5.6% 2.6% 4.3%;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 }

.caseList .picb { width: 14.1em;}
.caseList .picb .pic { display: block; cursor: pointer; 
height: 9.78em; display: block;  width: 14.1em; margin-bottom: 1.4em;
display: flex; justify-content: center; align-items: center;
 position: relative; z-index: 0;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
overflow: hidden; border: 1px solid #dcebfe;}
.caseList .picb .pic img { max-width: 66.3%; max-height: 36%;
width: auto; height: auto;}
 
.caseList .txtb { flex: 1; margin-left: 5.3%; }
.caseList .txtb .name { color: #1a1d3c;overflow: hidden;
text-overflow:ellipsis; height: 1.5em;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:1; }
.caseList .txtb .name a {color: #1a1d3c;}
.caseList .txtb .name a:hover {color: #0099ff;}
.caseList .txtb .intro {  color: #646b97; 
}
.caseList .txtb .intro dl { padding: 1.3em 0; border-bottom: 1px solid #dcebfe;
 display: flex; justify-content: flex-start; align-items: flex-start;}
.caseList .txtb .intro dl dt { color: #333; font-size: 1.12em;}
.caseList .txtb .intro dl dd { flex: 1; line-height: 1.8em; height:3.6em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:2; color: #646b97;}
.caseList .txtb .intro dl:last-child { border-bottom: 0;}

@media only screen and (max-width:828px) { 
}


/*解决方案 痛点*/
.painBox {  padding: 3.5em 0 4.8em;}
.painBox .tit { color: #1a1d3c;}
.painBox .tit2 { color: #646b97; margin-top: 0.2em;}

.painBox .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 10.8%; text-align: left; position: relative; z-index: 0;}
.painBox .item .num { position: absolute; left: 10.8%; top: 10.8%;
color: #0099ff; font-weight: lighter;}
.painBox .item .pic {margin: 0 0 0 auto; display: block; width: 7em; height: 5.5em;

display: flex; justify-content: center; align-items: center;}
.painBox .item .pic img{ margin: 0 auto; display: block; width: auto; height:auto;
max-width: 100%; max-height: 100%;
object-fit: contain;}
.painBox .item .name { position: relative; z-index: 0; margin-top: 1.3em; color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.painBox .item::before { position: absolute;  content: ""; display: block;
top: 10.1em; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.painBox .item .intro {margin-top:1.1em; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }

@media only screen and (max-width:828px) { 
	.painBox { padding: 3em 0;}
}

.swiper-pain-w { position: relative; z-index: 0;}
.swiper-pain-w { margin-top: 2.5em;}
.swiper-pain-w .btnNext,.swiper-pain-w .btnPrev { position: absolute; top: 50%; 
margin-top: -1.5em;border: 1px solid #f2f3fa;
transition: all 0.5s;
-webkit-transition:all 0.5s;} 
.swiper-pain-w .btnNext::before,.swiper-pain-w .btnPrev::before {
	background-image: url(../images/arrow_2.png);
}

.swiper-pain-w .btnNext { right: -4.8em; left: auto;}
.swiper-pain-w .btnPrev {left: -4.8em; right: auto;}
.swiper-pain-w .btnNext:hover,.swiper-pain-w .btnPrev:hover {
	background-color: #646b97;}
.swiper-pain-w .btnNext:hover::before,.swiper-pain-w .btnPrev:hover::before {
	background-image: url(../images/arrow.png);
}

/*解决方案 解决方案*/
.solutBox {  padding: 3.5em 0 4.8em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.solutBox .tit { color: #1a1d3c;}
.solutBox .tit2 { color: #646b97; margin-top: 0.2em;}
.solutBox .list {}
.solutBox .list ul{ display: flex; flex-wrap: wrap; justify-content: space-between; 
align-items: stretch;}
.solutBox .list li { margin-top: 1.8%; width: 49.1%;}
.solutBox .list .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 5.8% 5% 5.3% 7%; text-align: left; position: relative; z-index: 0;
 display: flex; justify-content: space-between; align-items: flex-start;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f9fbff+100 */
 background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(249,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.solutBox .list .item .num { 
color: #0099ff; font-weight: lighter;}
.solutBox .list .item .pic { margin-top: 0.4em;}
.solutBox .list .item .pic img{ margin: 0 0 0 auto; display: block; width: 6.25em; height: 6.25em;
object-fit: contain;}
.solutBox .list .item .txtb { flex: 1; margin: 0 3.8%;}
.solutBox .list .item .name { position: relative; z-index: 0;  color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.solutBox .list .item::before { position: absolute;  content: ""; display: block;
top: 1.15em; margin-top: 5.8%; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.solutBox .list .item .intro {margin-top:0.7em; color: #7f84a7; line-height: 1.5;
height: 7.5em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:5; }

@media only screen and (max-width:828px) { 
	.solutBox .list ul { display: block;}
	.solutBox .list li { width: 100%;}
}


/*解决方案 架构*/
.archBox { margin: 0 auto 0; padding: 0 0 3.5em;}
.archBox .pic { margin-top: 1.5em;}
.archBox .pic img { width:auto; margin: 0 auto; display: block; max-width: 100%; height: auto;}

/*产品中心 cdp*/
.cdpBox { margin: 0 auto 0; padding: 4.8em 0 3.5em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.cdpBox .pic { margin-top: 3em;}
.cdpBox .pic img { width:auto; margin: 0 auto; display: block; max-width: 100%; height: auto;}
/*完善*/

.perfBox {  padding:3em 0 1em;}
.perfBox .list { margin-top: 1.7em;}
.perfBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.perfBox .list li { margin-top: 0.5%; margin-right: 0.5%; width: 19.6%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.perfBox .list li:nth-child(5n) { margin-right: 0;}
.perfBox .item { border: 1px solid #e1e4f3; flex: 1;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 15.1% 15.1% 9%; text-align: left; position: relative; z-index: 0;}
.perfBox .item .num { position: absolute; right: 12%; top: 8%;
color: #0099ff; font-weight: lighter;}
.perfBox .item .pic img{ margin: 0 auto 0 0; display: block; width: 3.3em; height: 3.3em;
object-fit: contain;}
.perfBox .item .name { position: relative; z-index: 0; margin-top: 1.4em;
 color: #333; }
.perfBox .item .name::after {  content: ""; display: block; margin: 0.6em auto 0 0;
 height: 1px; width: 2.3em;
background-color: #0099ff;}
.perfBox .item .name2 {margin:1.3em auto 0 0; 
 color: #4c496a;  line-height: 1.5; }
.perfBox .item .intro {margin:0 auto 0 0; 
 color: #4c496a;  line-height: 1.5; }
 .perfBox .item .intro img { vertical-align: middle; position: relative; top: -0.1em;
 width: 1.5em; height:1.5em; object-fit: contain;}
 .perfBox .item .intro dl { margin-top: 0.9em; display: flex; justify-content: flex-start; align-items: flex-start;}
  .perfBox .item .intro dl dt {}
   .perfBox .item .intro dl dd{ flex: 1; margin-left: 0.3em;}
 .perfBox .item .btnGray { display: block; text-align: center; padding: 0 3em; margin-top: 1.2em;}

@media only screen and (max-width:828px) { 
	.perfBox {  padding:3em 0;}
	.perfBox .list li { margin-top: 0.5em; margin-right:0; width: 100%;}
	.perfBox .list li:nth-child(3n) { margin-right: 0;}
	.perfBox .list li:nth-child(2n) { margin-right: 0;}
}


/*解决方案 应用场景*/
.sceneBoxW { background: url(../images/scene_bg.jpg) center 0 no-repeat;
background-size:100% auto ;}
.sceneBox {  padding: 3.5em 0 4.8em;}
.sceneBox .tit { color: #1a1d3c;}
.sceneBox .tit2 { color: #646b97; margin-top: 0.2em;}

.sceneBox .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 text-align: left;}
.sceneBox .item .num { position: absolute; left: 10.8%; top: 10.8%;
color: #0099ff; font-weight: lighter;}
.sceneBox .item .pic { position: relative; z-index: 0; padding-top: 64.6%;}
.sceneBox .item .pic img{position: absolute; left: 0; top: 0;
width: 100%; height: 100%;
object-fit: cover;}
.sceneBox .item .name { position: relative; z-index: 0; 
 color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.sceneBox .item .txtb { position: relative; z-index: 0; padding: 8.6% 8.6% 8.9%;}
.sceneBox .item .txtb::before { position: absolute;  content: ""; display: block;
top: 0.2em; left:0; margin-top: 8.6%;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.sceneBox .item .intro {margin-top:1em; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }


.swiper-scene-w { position: relative; z-index: 0;}
.swiper-scene-w { margin-top: 1.3em;}
.swiper-scene-w .btnNext,.swiper-scene-w .btnPrev { position: absolute; top: 50%; 
margin-top: -1.5em;border: 1px solid #f2f3fa;
transition: all 0.5s;
-webkit-transition:all 0.5s;} 
.swiper-scene-w .btnNext::before,.swiper-scene-w .btnPrev::before {
	background-image: url(../images/arrow_2.png);
}

.swiper-scene-w .btnNext { right: -4.8em; left: auto;}
.swiper-scene-w .btnPrev {left: -4.8em; right: auto;}
.swiper-scene-w .btnNext:hover,.swiper-scene-w .btnPrev:hover {
	background-color: #646b97;}
.swiper-scene-w .btnNext:hover::before,.swiper-scene-w .btnPrev:hover::before {
	background-image: url(../images/arrow.png);
}

.sceneBoxW .partBox {background: transparent;}

.partBox2 {background: transparent; padding: 5em 0 7.2em;}

.stanBox { padding: 4.4em 0 7.6em;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.stanBox .tab { background-color: #fff;}
.stanBox .conC .txtb .name2 { font-weight: normal;}
@media only screen and (max-width:828px) {
	.stanBox { padding: 3em 0 3em;}
	.partBox2 { padding: 3em 0 3em;}
}

/*应用场景*/
.aSceneBox { padding: 4.6em 0 1em;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.aSceneBox .list { margin-top: 2em;}
.aSceneBox .list ul { display: flex; flex-wrap: wrap; 
justify-content: center; justify-content: flex-start;}
.aSceneBox .list li { width: 14.66%; margin: 0 1% 2.5%;}
.aSceneBox .list .picb { margin: 0 auto; width: 75.7%; border: 1px solid #d2e5ff;
overflow: hidden;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,f6fbff+100 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 1%,rgba(246,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.aSceneBox .list .pic { position: relative; z-index: 0; padding-top: 100%;}
.aSceneBox .list .pic img{position: absolute; left: 22%; top: 22%;
width: 56%; height: 56%;
object-fit: contain;}
.aSceneBox .list .name { margin-top: 17.6%; position: relative; z-index: 0; 
 color: #71789f; 
font-weight: lighter; }
.aSceneBox  .btnW { margin-top: 1em;}
.aSceneBox  .btnW .btnGray { margin:  0 1.2em; padding: 0 3em;}
@media only screen and (max-width:828px) {
	.aSceneBox .list li { width: 31.3%; margin: 0 1% 1.5em;}
	.aSceneBox .list .name { margin-top: 1em;}
	.aSceneBox  .btnW .btnGray { margin:  0 0.9em; padding: 0 2.3em;}
}


/*产品 行业痛点*/
.inPainBox { padding: 4.6em 0 1em;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.inPainBox .list { margin-top: 0.5em;}
.inPainBox .list ul { display: flex; flex-wrap: wrap; 
justify-content: center; justify-content: flex-start;}
.inPainBox .list li { width: 19%; margin: 1.25% 1.25% 0 0;
display: flex; justify-content: flex-start; align-items: stretch;
flex-direction: column;}
.inPainBox .list li:nth-child(5n) { margin-right: 0;}
.inPainBox .list li .num { position: absolute; left: 15%; font-weight: lighter; top: 2.4em; color: #0099ff;}
.inPainBox .list li .item { position: relative; z-index: 0;
 flex: 1; background-color: #fff;
border: 1px solid #e1e4f3; padding: 2.6em 0;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
}
.inPainBox .list .picb { margin: 0 auto; width: 47.4%; max-width: 130px; border: 1px solid #d2e5ff;
overflow: hidden;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,f6fbff+100 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 1%,rgba(246,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.inPainBox .list .pic { position: relative; z-index: 0; padding-top: 100%;}
.inPainBox .list .pic img{position: absolute; left: 25.5%; top: 25.5%;
width: 49%; height: 49%;
object-fit: contain;}
.inPainBox .list .name { margin: 0.9em 1em 0;  color: #333; }
.inPainBox .list .intro { margin: 1.2em 1em 0; 
 color: #71789f; font-weight: lighter; }
.inPainBox  .btnW { margin-top: 1em;}
.inPainBox  .btnW .btnGray { margin:  0 1.2em; padding: 0 3em;}
@media only screen and (max-width:828px) {
	.inPainBox .list .picb { max-width: 80px;}
	.inPainBox .list li { width: 48.8%; margin: 1.2% 1.2% 0 0;}
	.inPainBox .list li:nth-child(5) { width: 100%; margin: 1.2% 0 0 0;}
}


/*产品中心 更多功能*/
.funcBox .list { margin-top: 1.2em;}
.funcBox .list ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.funcBox .list li { margin: 0.224% 0.224% 1% 1%; width: 15.48%; color: #646b97;
display: flex; justify-content: flex-start; align-items: stretch; flex-direction: column;
}
.funcBox .list li:nth-child(6n) { margin-right: 0;}
.funcBox .list .lib  { flex: 1; border: 1px solid #e1e4f3;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f6fbff+100 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(246,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 padding: 27% 5% 14%; }
.funcBox .list .pic { }
.funcBox .list .pic img{ margin: 0 auto; display: block; width: 3.3em; height: 3.3em; object-fit: contain;}
.funcBox .list .name { margin-top: 25%;}

.funcWhBox { padding: 5.5em 0 6.4em;}
.funcWhBox .iTit .name { background: none;}
.funcWhBox .list { margin-top: 2.1em;}

@media only screen and (max-width:828px) {
	.funcWhBox { padding: 3em 0 3em;}
	.funcBox .list li { margin: 1.1% 1.1% 0 0; width: 32.6%;}
	.funcBox .list li:nth-child(3n) { margin-right: 0;}
}



/*产品中心详情 */
.proDeBox { padding: 3.6em 0 0.3em;}
.proDeBox .conP {margin-top: 1.5em;
color: #1a1d3c; 
display: flex; justify-content: space-between; align-items:center;
padding: 3.3em 0 3.3em 0;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eaf4fe+0,ffffff+100,ffffff+101 */
 background: linear-gradient(to bottom,  rgba(234,244,254,1) 0%,rgba(255,255,255,1) 100%,rgba(255,255,255,1) 101%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
overflow: hidden; border: 1px solid #e1e4f3;}
.proDeBox.grayBg .conP { background: #f9fbff;}

.proDeBox .conP .txtb { margin-left: 4.4%; width: 55%; text-align: left;}
 .proDeBox .conP .txtb .name { color: #1a1d3c;}
 .proDeBox .conP .txtb ul {}
 .proDeBox .conP .txtb li { padding: 1em 0; border-bottom: 1px solid #d2e8fe;}
  .proDeBox .conP .txtb li:last-child { border-bottom: 0;}
 .proDeBox .conP .txtb .name { color: #1a1d3c; }
  .proDeBox .conP .txtb .intro1 { margin-top: 0.8em; color: #40465e; line-height: 1.75em;}
 .proDeBox .conP .txtb .intro { margin-top: 0.2em; color: #40465e; line-height: 1.75em;}
  .proDeBox .conP .txtb .intro2 {margin-top: 0.2em;  color: #666666; line-height: 1.75em;}
    .proDeBox .conP .txtb .intro3 {margin-top: 1.2em;  color: #666666; line-height: 1.75em;}
  .proDeBox .conP .txtb .btnW { display: flex; justify-content: flex-start; 
  align-items: center;}
  .proDeBox .conP .txtb .btnW .btnGray { text-align: center; width: 10em; margin-top: 0.7em; 
  padding-left: 0; padding-right: 0; margin-right: 2.25em;}
  .proDeBox .conP .txtb .btnW2 { display: flex; justify-content: flex-start;
  align-items: center; margin-top: 2.6em;}
  .proDeBox .conP .txtb .btnW2 .btnGray {text-align: center; width: 10em; margin-top: 0.7em; 
  padding-left: 0; padding-right: 0; margin-right: 2.25em;}
 .proDeBox .conP .picb { width: 31.5%; margin-right: 3%;}
 .proDeBox .conP .picb .pic { padding-top: 72%; position: relative; z-index: 0;}
 .proDeBox .conP .picb .pic img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: contain;}

@media only screen and (max-width:828px) {
	.proDeBox { padding-bottom: 0;}
	.proDeBox .conP {display: block;  padding-top: 0.8em; padding-bottom: 0;}
	.proDeBox .conP .txtb { margin-left:auto; width:auto; padding:0 2em 2em; }
	.proDeBox .conP .picb { width: 100%;}
}

/*关于我们*/
.compBox { padding: 4.7em 0 5.4em;
display: flex; justify-content: space-between; align-items: center;}
.compBox .txtb { width: 47%; text-align: left;}
.compBox .txtb .name {color: #1a1d3c;}
.compBox .txtb .name span { padding-right: 0.6em;
background:  url(../images/dot.png) right 0 no-repeat;}
.compBox .txtb .name2 { margin-top: 0.1em; font-weight: lighter; color: #646b97;}
.compBox .txtb .intro { margin-top: 0.1em; line-height: 1.68em; color: #666;}
.compBox .txtb .intro p { padding: 0.75em 0; }

.compBox .picb { width: 48.4%; overflow: hidden;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;}
.compBox .picb .pic { position: relative; z-index: 0;
padding-top: 79%;}
.compBox .picb .pic img { position: absolute; left: 0; top: 0;
width: 100%; height: 100%; object-fit: cover;}
.compBox .videoBox .btnPlay{ position: absolute; z-index: 2; 
left: 50%; top: 50%; margin-top: -2.4em; margin-left: -2.4em;  width: 4.8em;
padding-top: 4.8em;}
@media only screen and (max-width:828px) { 
	.compBox { display: block; padding: 2.5em 0 ;}
	.compBox .txtb { width: 100%}
	.compBox .picb { width: 100%; margin-top: 2em;}
}

.dataList { position: absolute; left: 0; z-index: 10; bottom: 0; right: 0;
background-color: rgba(33,140,235,0.8); color: #fff;}
.dataList ul { display: flex; justify-content: space-around; align-items: center;
padding: 1.3em 4.5% 1.7em;}
.dataList li { line-height: 1.4;}
.dataList li .t_1 { font-size: 1.12em;}
.dataList li .t_1 span{ font-size: 2.7em;}
.dataList .line { height: 5.2em; width: 1px;
background-color: rgba(255,255,255,0.3);}


/*关于我们 荣誉资质*/
.qualBox {  padding: 3.5em 0 7.8em;}
.qualBox .iTit .name { color: #1a1d3c; text-align: left;}
.qualBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}

.qualBox .item { border: 1px solid #e1e4f3; background-color: #f9fbff;
 padding: 11% 13% 6.5% 13%; text-align: center; position: relative; z-index: 0;}
.qualBox .item .pic { width: 100%; padding-top: 100%; position: relative; z-index: 0;}
.qualBox .item .pic img{ position: absolute; left: 0; top: 0;
 margin: 0 auto; display: block; width: 100%; height: 100%;
object-fit: contain;}
.qualBox .item .name { position: relative; z-index: 0;
 margin-top: 2em; color: #1a1d3c; height: 3em; overflow: hidden;
font-weight: lighter; }

@media only screen and (max-width:828px) { 
	.qualBox { padding: 3em 0;}
}

.swiper-qual-w { position: relative; z-index: 0;}
.swiper-qual-w { margin-top: 2.5em;}
.swiper-qual-w .btnNext,.swiper-qual-w .btnPrev { position: absolute; top: 50%; 
margin-top: -1.5em;border: 1px solid #f2f3fa;
transition: all 0.5s;
-webkit-transition:all 0.5s;} 
.swiper-qual-w .btnNext::before,.swiper-qual-w .btnPrev::before {
	background-image: url(../images/arrow_2.png);
}

.swiper-qual-w .btnNext { right: -4.8em; left: auto;}
.swiper-qual-w .btnPrev {left: -4.8em; right: auto;}
.swiper-qual-w .btnNext:hover,.swiper-qual-w .btnPrev:hover {
	background-color: #646b97;}
.swiper-qual-w .btnNext:hover::before,.swiper-qual-w .btnPrev:hover::before {
	background-image: url(../images/arrow.png);
}

/*关于我们 大事记*/
.eventBoxBg {background: url(../images/event_bg.jpg) center 0 no-repeat;
background-size:100% auto ;}
.eventBox {  padding: 3.5em 0 7.8em; max-width: 1920px; margin: 0 auto;
}
.eventBox .iTit .name { color: #1a1d3c; text-align: left;}
.eventBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}
.eventBox .item { border: 1px solid #e1e4f3;
 padding: 8% 10.8% 9%; text-align: left; position: relative; z-index: 0;
 background-color: #fff;}
.eventBox .item .year { line-height: 1.1; color: #1a1d3c; font-weight: lighter;}
.eventBox .item .year span { font-size: 3em; font-weight: normal;}
.eventBox .item .pic img{ margin: 0 0 0 auto; display: block; width: 7em; height: 5.5em;
object-fit: contain;}
.eventBox .item .name { margin-top: 0.9em;
 color: #0099ff; height: 1.5em; overflow: hidden;}
.eventBox .item::before { position: absolute;  content: ""; display: block;
top: 1.2em; left:0; margin-top: 8%;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.eventBox .item .intro {margin-top:0.7em; color: #7f84a7; line-height: 1.5;
height: 6em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:4; }

@media only screen and (max-width:828px) { 
	.eventBox { padding: 3em 0;}
}

.swiper-event-w { position: relative; z-index: 0;}
.swiper-event-w { margin-top: 4em;}
.swiper-event { padding-left: 4.1%;}
.swiper-event-w .swiper-slide { cursor: pointer;}

.swiper-year-w { margin-top: 4em;
background: url(../images/rule.png) 0 0 repeat-x;
background-size: auto 1em; text-align: center;}
.swiper-year-w .line { margin: 0.63em auto 0; width: 5.87em; height: 0.37em;}
.swiper-year-w .year { margin-top: 0.9em; font-size: 1.5em;}
.swiper-year-w .swiper-slide { cursor: pointer;}
.swiper-year-w .swiper-slide-cur .year { font-weight: bold; color: #0099ff;}
.swiper-year-w .swiper-slide-cur .line {background-color: #0099ff; }


/*关于我们 企业文化*/
.cultBox {  padding: 3.5em 0 4.8em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.cultBox .iTit .name { color: #1a1d3c; text-align: left;}
.cultBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}
.cultBox .conC {display: flex; justify-content: space-between; align-items: stretch;}

.cultBox .list { margin-top: 2.2em; width: 50%;}
.cultBox .list ul{ height: 100%; }
.cultBox .list li {height: 100%;
 display: flex; flex-direction: column; justify-content: space-between; align-items: stretch;}
.cultBox .list .item {flex: 1; 
border: 1px solid #e1e4f3; padding: 6% 0 3.5%;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 text-align: left; position: relative; z-index: 0;
 display: flex; justify-content: space-between; align-items: center;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,eff7ff+100 */
 background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(239,247,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 }
.cultBox .list .item .picb { width: 50.4%;}
.cultBox .list .item .pic { width: 100%;}
.cultBox .list .item .pic img{ display: block; width: 100%; height: auto;}
.cultBox .list .item .txtb { width: 38%; margin-left: 8.7%;}
.cultBox .list .item .name { color: #1a1d3c; 
height: 1.5em; overflow: hidden;}
.cultBox .list .item .intro {margin-top:1.4em; color: #666; line-height: 1.8;
height: 12.6em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:7; }

@media only screen and (max-width:450px) { 
	.cultBox .list .item { display: block; padding-top: 2.3em;}
	.cultBox .list .item .picb { width: auto; margin-left: 30%;}
	.cultBox .list .item .txtb { width: 80%; margin-left: auto; margin-right: auto;}
}

.cultBox .list2 { margin-top: 2.2em;  width: 48.3%;}
.cultBox .list2 ul{ display: flex; flex-wrap: wrap; justify-content: space-between; 
align-items: stretch;}
.cultBox .list2 li { margin-top: 0.8%; width: 49.6%;}
.cultBox .list2 li:nth-child(1),
.cultBox .list2 li:nth-child(2) { margin-top: 0;}
.cultBox .list2 .item { position: relative; z-index: 0; border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
text-align: left; position: relative; z-index: 0;
  padding: 1.6em 10% 1.6em 10%; 
  background-color: #fff;
  -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em; 
}
.cultBox .list2 .item .pic { position: absolute; top: 0; right: 0;
 margin-right: 12.2%; margin-top: 12.2%;}
.cultBox .list2 .item .pic img{ margin: 0 0 0 auto; 
display: block; width: 4em; height: 4em;
object-fit: contain;}
.cultBox .list2 .item .txtb {  margin: 0 3.8%; height: 10em;
  display: flex; flex-direction: column;
   justify-content: center; align-items: flex-start;}
.cultBox .list2 .item .name { position: relative; z-index: 0;
  color: #1a1d3c; height: 1.2em; line-height: 1.2em; overflow: hidden;margin-right: 4.4em; }
.cultBox .list2 .item .intro {margin-top:0.5em; color: #666; line-height: 1.75;
 margin-right: 5.5em; }
.cultBox .list2 .item .intro2 { color: #666; line-height: 1.75; 
 margin-right: -4%;}

@media only screen and (max-width:828px) { 
	.swiper-event-w { margin-top: 2em;}
	.swiper-year-w { margin-top: 2em;}
	.cultBox .conC { display: block;}
	.cultBox .list { width: 100%;}
	.cultBox .list2 { width: 100%;}
	.cultBox .list2 ul{ display: block;}
	.cultBox .list2 li { margin-top: 0.7em; width: 100%;}
	.cultBox .list2 li:nth-child(1), .cultBox .list2 li:nth-child(2) {
		margin-top: 0.7em;
	}
}

/*关于我们  联系我们*/
.contBox {  padding: 4.5em 0 4.8em;}
.contBox .iTit .name { color: #1a1d3c; text-align: left;}
.contBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}
.contBox .list {}
.contBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.contBox .list li { margin-top: 2.2%; margin-right: 2.75%; width: 31.5%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.contBox .list li:nth-child(3n) { margin-right: 0;}
.contBox .list .item { border: 1px solid #e1e4f3; flex: 1;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 11% 8.8% 14% 8.8%; text-align: left; position: relative; z-index: 0;
}
.contBox .list .item .pic { position: relative; z-index: 0; margin:0 0 0 auto; width: 43.2%;
padding-top: 32.4%;}
.contBox .list .item .pic img{ position: absolute; display: block; width: 100%; height: 100%;
left: 0; top: 0;
object-fit: contain;}
.contBox .list .item .txtb {position: relative; z-index: 0; }
.contBox .list .item .name {  margin-top: 0.2em;
 color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.contBox .list .item .txtb::before { position: absolute;  content: ""; display: block;
top: 0.2em; margin-top: 0; left:-11%;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.contBox .list .item .intro { margin-top: 1.4em; color: #7f84a7; line-height: 1;
font-weight: lighter;
 }
.contBox .list .item .intro dl { margin-top: 0.9em;
	display: flex; justify-content: flex-start; align-items: flex-start;
}
.contBox .list .item .intro dt {}
.contBox .list .item .intro dd { flex: 1; margin-left: 0.1em;}

@media only screen and (max-width:828px) { 
	.contBox  {  padding: 3em 0 3em;}
	.contBox .list ul { display: block;}
	.contBox .list li { width: 100%;}
}

/*关于我们  加入我们*/
.joinBox {  padding: 4.5em 0 4.8em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.joinBox .iTit .name { color: #1a1d3c; text-align: left;}
.joinBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}

.joinBox .list { padding-top: 0.6em;}
.joinBox .list dl { margin-top: 0.9em; border: 1px solid #e1e4f3;
 background-color: #fff; color: #333;
transition: all 0.5s;
-webkit-transition:all 0.5s;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
overflow: hidden;}
.joinBox .list dl.show {color: #fff;}
.joinBox .list dl dt {cursor: pointer; 
padding: 1.1em 2em 1.1em 2.2em; text-align: left; font-weight: lighter;
 display: flex; justify-content: space-between; align-items: center; line-height: 1.6;
transition: padding 0.5s;
-webkit-transition:padding 0.5s;}

.joinBox .list dl dt .name { flex: 1; margin-right: 2%;}
.joinBox .list dl dt .posi {width: 16%; margin-right: 2%;}
.joinBox .list dl dt .area {width: 14.4%; margin-right: 2%;}
.joinBox .list dl dt .date { width: 12.4%; margin-right: 2%;}

.joinBox .list dl dt .arrow { position: relative;
	cursor: pointer; display: inline-block;
	width: 2.8em; height: 2.8em; margin:0 0.4em;
	border: 1px solid #e2e5f3; background-color: #fff;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
} 
.joinBox .list dl.show dt .arrow {transform: rotate(180deg);
-ms-transform: rotate(180deg); /* IE 9 */
-webkit-transform: rotate(180deg); /* Safari and Chrome */}
.joinBox .list dl dt .arrow:hover {
	border: 1px solid #8bd0ff; background-color: transparent;
}
.joinBox .list dl dt .arrow:before{
	content: ""; display: block;position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background:  url(../images/arrow_4.png) center center no-repeat;
	background-size: 31% auto;
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari and Chrome */
}

.joinBox .list dl.show dt { background-color: #0099ff;  }

.joinBox .list dl dd { display: none;color: #666;font-weight: lighter;
padding: 0 4% 2.6em; line-height: 1.9; text-align: left; }
.joinBox .list dl dd .tits { position: relative; z-index: 0;
 margin-top: 2em; color: #333; font-weight: normal;}
.joinBox .list dl dd .tits::before {position: absolute;  content: ""; display: block;
top: 0.7em; margin-top: 0; left:-1.5em;
 height: 1px; width: 1em;
background-color: #0099ff;}

.joinBox .list dl dd .deli { margin-top: 1.9em; font-weight: normal;}
.joinBox .list dl dd .deli span { color: #0099ff;font-weight: bold;}

@media only screen and (max-width:828px) { 
	.joinBox  {  padding: 3em 0 3em;}
	.joinBox .list dl dt  { position: relative; z-index: 0; flex-wrap: wrap; padding: 1.1em 1em 1.1em 1em;}
	.joinBox .list dl dt .arrow { position: absolute; top: 1em; right: 1em; width: 2.2em; height: 2.2em;}
	.joinBox .list dl dt .name { margin-bottom: 0.7em; flex: initial; width: 100%; margin-right: 0; }
	.joinBox .list dl dt .posi {width: 31.2%; margin-right: 2%;}
	.joinBox .list dl dt .area {width: 31.2%; margin-right: 2%;}
	.joinBox .list dl dt .date { width: 31.2%; margin-right: 2%;}
}

.advBox {  padding: 4.5em 0 4.8em;}
.advBox .iTit .name { color: #1a1d3c; text-align: center;}
.advBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}

.advBox .list {}
.advBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.advBox .list li { margin-top: 2.2%; margin-right: 2.75%; width: 31.5%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.advBox .list li:nth-child(3n) { margin-right: 0;}
.advBox .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 10.8%; text-align: left; position: relative; z-index: 0;}
.advBox .item .num { position: absolute; left: 10.8%; top: 10.8%;
color: #0099ff; font-weight: lighter;}
.advBox .item .pic img{ margin: 0 0 0 auto; display: block; width: 7em; height: 5.5em;
object-fit: contain;}
.advBox .item .name { position: relative; z-index: 0; margin-top: 1.3em; color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.advBox .item::before { position: absolute;  content: ""; display: block;
top: 10.1em; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.advBox .item .intro {margin:1.1em auto 0 0; border-top-width: 6.5%;; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }

@media only screen and (max-width:828px) { 
	.advBox {  padding:3em 0;}
	.advBox .list li { margin-top: 0.5em; margin-right:0; width: 100%;}
	.advBox .list li:nth-child(3n) { margin-right: 0;}
	.advBox .list li:nth-child(2n) { margin-right: 0;}
}

/*产品 平台优势*/

.plAdvBox {  padding: 4.2em 0 1em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.plAdvBox .iTit .name { color: #1a1d3c; text-align: center;}
.plAdvBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: center;}

.plAdvBox .list { margin-top: 0.5em;}
.plAdvBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.plAdvBox .list li { margin-top: 2.2%; margin-right: 2.75%; width: 31.5%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.plAdvBox .list li:nth-child(3n) { margin-right: 0;}
.plAdvBox .item { border: 1px solid #e1e4f3;background-color: #fff;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 9.4% 9.4% 5%; text-align: left; position: relative; z-index: 0;}
.plAdvBox .item .num { position: absolute; left: 10.8%; top: 11.8%;
color: #0099ff; font-weight: lighter;}
.plAdvBox .item .pic img{ margin: 0 0 0 auto; display: block; width: 5.62em; height: 5.62em;
object-fit: contain;}
.plAdvBox .item .name { position: relative; z-index: 0; color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.plAdvBox .item .intro {margin:0.7em auto 0 0; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }

@media only screen and (max-width:828px) { 
	.plAdvBox {  padding:3em 0;}
	.plAdvBox .list li { margin-top: 0.5em; margin-right:0; width: 100%;}
	.plAdvBox .list li:nth-child(3n) { margin-right: 0;}
	.plAdvBox .list li:nth-child(2n) { margin-right: 0;}
}

.deployBox {  padding: 4.5em 0 4.8em;}
.deployBox .iTit .name { color: #1a1d3c; text-align: center;}
.deployBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}
.deployBox .iTit .introC { color: #7f84a7; margin-top: 0.2em;text-align: center;}

.deployBox .list {}
.deployBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.deployBox .list li { margin-top: 1.8%; margin-right:1.8%; width: 49.1%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.deployBox .list li:nth-child(2n) { margin-right: 0;}
.deployBox .list .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 0 0 0 7%; text-align: left; position: relative; z-index: 0;
 display: flex; justify-content: space-between; align-items: flex-start;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f9fbff+100 */
 background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(249,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.deployBox .list .item .num { margin: 6.6% 0;
color: #0099ff; font-weight: lighter;}
.deployBox .list .item .picb { width: 41%;}
.deployBox .list .item .pic { position: relative;z-index: 0; padding-top: 89.5%;}
.deployBox .list .item .pic img{ position: absolute; left: 0; top: 0;
display: block; width:100%; height: 100%;
object-fit: contain;}
.deployBox .list .item .txtb { flex: 1; margin: 6.6% 4.2%;}
.deployBox .list .item .name { margin-top: 1.6em; position: relative; z-index: 0;  color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.deployBox .list .item::before { position: absolute;  content: ""; display: block;
top: 1.15em; margin-top: 5.8%; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.deployBox .list .item .intro {margin-top:0.9em; color: #7f84a7; line-height: 1.9;
height: 3.8em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:2; }


.gadvBox .list .item .picb { width: 21.7%; margin: 8.4% 10% 8.4% 0;}
.gadvBox .list .item .pic { padding-top: 100%;}

.zjAdBox .list .item { padding-bottom: 3%;}
.zjAdBox .list .item .picb { width: 25.4%;  margin: 5.6% 7.7% 5.6% 0;}
.zjAdBox .list .item .pic { padding-top: 100%;}

.dxAdBox .list .item { padding-bottom: 3%;}
.dxAdBox .list .item .picb { width: 26.3%;  margin:8% 10% 4% 0;}
.dxAdBox .list .item .pic { padding-top: 100%;}

@media only screen and (max-width:828px) { 
	.deployBox {  padding: 3em 0;}
	.deployBox .list ul { display: block;}
	.deployBox .list li { width: 100%;}
}


.applBox {  padding: 4.5em 0 1em;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,ffffff+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.applBox .iTit .name { color: #1a1d3c; text-align: center;}
.applBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}

.applBox .list { margin-top: 3em;}
.applBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.applBox .list li { margin-right:1.8%; width: 24%; margin-right: 0.55%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.applBox .list li:nth-child(1) { width: 50%;margin-right: 1.45%;}
.applBox .list li:nth-child(3) { margin-right: 0;}
.applBox .list .item { flex: 1; border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 13% 14% 11% 16%; text-align: left; position: relative; z-index: 0;background-color: #fff;
 display: flex; justify-content: space-between; align-items: flex-start;
 }
.applBox .list li:nth-child(1) .item { 
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ddf0fe+0,ffffff+100 */
	background: linear-gradient(to bottom,  rgba(221,240,254,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    padding: 6% 7% 5% 8%;
}
.applBox .list .item .num { margin: 0;
color: #0099ff; font-weight: lighter;}
.applBox .list .item .picb { width: 53.6%;}
.applBox .list .item .pic { position: relative;z-index: 0; padding-top: 62.8%;}
.applBox .list .item .pic img{ position: absolute; left: 0; top: 0;
display: block; width:100%; height: 100%;
object-fit: contain;}
.applBox .list .item .txtb { flex: 1;  height: 100%;
display: flex;flex-direction: column; justify-content: space-between; align-items: flex-start;}
.applBox .list .item .name { margin-top: 0.6em; line-height: 1.1em;
  color: #1a1d3c;}
.applBox .list .item .intro {margin-top:1.5em; color: #7f84a7; line-height: 1.6;
 }
.applBox .list .item .btnArrow { position: relative;
	cursor: pointer; display: inline-block;
	width: 2.8em; height: 2.8em; margin:1.5em 0 0;
	border: 1px solid #e2e5f3; background-color: #fff;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
} 
.applBox .list .item .btnArrow:before{
	content: ""; display: block;position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background:  url(../images/arrow_4.png) center center no-repeat;
	background-size: 27% auto;
}

@media only screen and (max-width:828px) { 
	.applBox .list { margin-top: 1.5em;}
	.applBox .list ul { flex-wrap: wrap;}
	.applBox .list li { margin-top: 1%; width: 49.5%; margin-right: 1%;
	display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
	.applBox .list li:nth-child(1) { width: 100%;margin-right: 0;}
	.applBox .list li:nth-child(3) { margin-right: 0;}
}

/*产品示例*/
.examBox { margin: 0 auto 0; padding: 4.3em 0 3.5em;
}
.examBox .tit { color: #1a1d3c;}
.examBox .tit2 { color: #646b97; margin-top: 0.2em;}

.examBox .examCon {margin-top: 4em; border: 1px solid #dcebfe; background-color: #fff;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em; 
display: flex; justify-content: space-between; align-items: stretch;
}
.examBox .tab { border-right: 1px solid #dcebfe; background-color: #f9fbff;}
.examBox .tab ul { height: 100%; display: flex; flex-direction: column;
 justify-content: space-around; align-items: stretch;
 font-weight: lighter;}
.examBox .tab ul li { cursor: pointer;
 flex: 1; padding: 1em 1.3em; border-bottom:1px solid #dcebfe;
 display: flex; justify-content: center; align-items: center;}
.examBox .tab ul li:last-child { border-bottom: 0;}
.examBox .tab ul li.cur { font-weight: bold; background-color: #0099ff; color: #fff;}
.examBox .conDZ {flex: 1;}
.examBox .conD { display: none;}
.examBox .conD:first-child {display: block;}




.examBox .conCS { display: flex; justify-content: space-between; align-items:stretch;
 color: #1a1d3c; 
 }
 .examBox .conCS .txtb { margin-left: 6.5%; padding:  0;
 width: 40%; text-align: left;
 display: flex; flex-direction: column;
  justify-content: space-between; align-items: flex-start;}
  .examBox .conCS .txtb .txtT { padding-top: 27%;}
 .examBox .conCS .txtb .btnW { padding-bottom: 10%;}
 .examBox .conCS .txtb .btnGray { margin: 1em 2.3em 0 0; padding: 0 3em;}
 .examBox .conCS .txtb .name { color: #1a1d3c;}
 .examBox .conCS .txtb ul {display: flex; flex-wrap: wrap; justify-content: space-between;
 align-items: flex-start;}
 .examBox .conCS .txtb li { width: 44.6%;}
 .examBox .conCS .txtb .name {color: #1a1d3c; }
 .examBox .conCS .txtb .intro { margin-top: 1.2em; font-weight: lighter; color: #666; line-height: 1.55em;}
 .examBox .conCS .picb { width: 46.7%; margin: -3.6% 0; }
 .examBox .conCS .picb .pic { padding-top: 105%; position: relative; z-index: 0;}
 .examBox .conCS .picb .pic img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: contain;}

@media only screen and (max-width:828px) {
	.examBox .examCon {display: block; margin-top: 2em;
	}
	.examBox .conC {display: block; }
	 .examBox .conC .txtb { margin-left:auto; width:auto; padding: 2em; }
	  .examBox .conC .picb { width: 100%;}
	  .examBox .conCS .txtb .txtT { padding-top: 2em;}
	   .examBox .conCS .txtb .btnGray { margin: 1.5em 1em 0 0; padding: 0 2em;}
}
@media only screen and (max-width:828px) {
	.examBox .conCS {display: block; }
	 .examBox .conCS .txtb { margin-left:auto; width:auto; padding:0 2em 2em; }
	  .examBox .conCS .picb { width: 80%; margin: 0 auto;}
	   .examBox .conCS .txtb li { width: 100%;}
	   .examBox .conCS .txtb .btnW { padding-bottom: 0;}
	   
	   .examBox .tab {
	       border-bottom: 1px solid #dcebfe;
	       border-right: 0;
	   }
}

/*技术支持 产品资料*/
.proDataBox {  padding: 4.5em 0 4.8em;}
.proDataBox .iTit .name { color: #1a1d3c; text-align: center;}
.proDataBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: left;}

.proDataBox .list {}
.proDataBox .list ul{ }
.proDataBox .list li { margin-top:0.95em;}

.proDataBox .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
text-align: left; position: relative; z-index: 0; padding: 1.2em 3% 1.2em 3.7%; 
 display: flex;  justify-content: center; align-items: center; overflow: hidden;
transition: all 0.5s;
-webkit-transition:all 0.5s;}
.proDataBox .item::before { position: absolute;  content: ""; display: block;
 top: 1.5em; left:0;
  height: 1px; width: 1.4em;
 background-color: #0099ff;}

.proDataBox .list .date { font-weight: lighter;}
.proDataBox .list .date .dd { color: #0099ff; line-height: 1.1; font-size: 2.5em;}
.proDataBox .list .date .yymm { color: #999;}

.proDataBox .list .txtb { margin: 0 3.2%; flex: 1;font-weight: lighter; }

.proDataBox .item .name {  color: #1a1d3c; height: 1.5em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:1;}
.proDataBox .item .name a { color: #1a1d3c;}
.proDataBox .item .name a:hover { color: #0099ff;}

.proDataBox .item .intro {margin:0.2em auto 0 0; 
color: #7f84a7; line-height: 1.5;
height: 1.5em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:1; }
.proDataBox .item .btnDown { color: #a7aac1; display: inline-block; cursor: pointer;}
.proDataBox .item .btnDown::after { content: ""; 
	cursor: pointer; display: inline-block; vertical-align: middle;
	width: 2.8em; height: 2.8em; margin-left: 0.8em;
	border: 1px solid #e1e4f3;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
	background: url(../images/arrow_3.png) center center no-repeat;
	background-size:27% auto ;
	transform: rotate(90deg);
	-ms-transform: rotate(90deg); /* IE 9 */
	-webkit-transform: rotate(90deg); /* Safari and Chrome */
} 
.proDataBox .item .btnDown:hover::after{
	border: 1px solid #8bd0ff; background-color: transparent;
}
.proDataBox .item .btnDown span{ vertical-align: middle;}

.proDataBox .list li:hover .item { background-color: #0099ff; color: #fff;}
.proDataBox .list li:hover .item::before { 
 background-color: #fff;}
 .proDataBox .list li:hover .date .dd { color: #fff; line-height: 1.1; font-size: 2.5em;}
 .proDataBox .list li:hover .date .yymm { color: #fff;}
 .proDataBox .list li:hover .item .name {  color: #fff;}
 .proDataBox .list li:hover .item .name a { color: #fff;}
 .proDataBox .list li:hover .item .name a:hover { color: #fff;}
  .proDataBox .list li:hover .item .intro { color: #fff;}
.proDataBox .list li:hover .item .btnDown { color: #fff;}
.proDataBox .item .btnDown::after { background-color: #fff;}


/*落地页*/

.loadBox1 { margin-top: -7.3em; position: relative; z-index: 10; 
border: 1px solid #e1e4f3; background-color: #fff; padding: 2.3em 0;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
-moz-box-shadow: 0 0.1em 0.2em rgba(0, 0, 0, .1);
-webkit-box-shadow: 0 0.1em 0.2em rgba(0, 0, 0, .1);
box-shadow: 0 0.1em 0.2em rgba(0, 0, 0, .1);}
.loadBox1 ul { display: flex; flex-wrap: wrap;
justify-content: space-around; align-items: flex-start;}
.loadBox1 li { width: 19%; margin: 0 3%;}
.loadBox1 .pic {}
.loadBox1 .pic img{ margin: 0 auto; display: block; width: 4.44em; height: 5em;
object-fit: contain;}
.loadBox1 .name { margin-top: 0.5em; font-size: 1.12em; color: #1a1d3c;}
.loadBox1 .intro {margin-top: 0.4em; color: #7b7d89; line-height: 1.56;}

@media only screen and (max-width:828px) {
	.loadBox1 { margin-top: -1em;  padding-top: 1em;}
	.loadBox1 li { width: 40%; margin-top: 2em;}
}

/*问题*/
.quBox {  padding: 3.3em 0 1.8em;}
.quBox .iTit .name { background-image: none;}
.quBox .tit { color: #1a1d3c;}
.quBox .tit2 { color: #646b97; margin-top: 0.2em;}
.quBox .list {}
.quBox .list ul{ display: flex; flex-wrap: wrap; justify-content: space-between; 
align-items: stretch;}
.quBox .list li { margin-top: 3%; width: 49.1%;}
.quBox .list .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 1.3em 9% 1.3em 9%; text-align: left; position: relative; z-index: 0;
 display: flex; justify-content: space-between; align-items: center;}
.quBox .list .item .pic img{ margin: 0 0 0 auto; display: block;
 width: 4.1em; height: 4.8em;
object-fit: contain;}
.quBox .list .item .txtb { flex: 1; margin-left: 8%; margin-top: 0.5em;}
.quBox .list .name { position: absolute; z-index: 0;  
right: 1.1em; top: -1.4em; width: 15.4em;
color: #fff; height: 2.85em; line-height: 2.85em; overflow: hidden;text-align: left;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4bb3ff+0,1691fe+100 */
 background: linear-gradient(to bottom,  rgba(75,179,255,1) 0%,rgba(22,145,254,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
-moz-border-radius:1.3em; -webkit-border-radius:1.3em; border-radius:1.3em;
-moz-border-bottom-left-radius:0.4em;
 -webkit-border-bottom-left-radius:0.4em; 
 border-bottom-left-radius:0.4em;
-moz-border-top-right-radius:0.4em;
 -webkit-border-top-right-radius:0.4em; 
 border-top-right-radius:0.4em;
}
.quBox .list .name div { padding:0 2.4em;}
.quBox .list .item .intro {color: #333; line-height: 1.5;
height: 3em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:2; }
.quBox .list .item .intro span { color: #ff6600;}

.quBox .list li:nth-child(2n) .item { flex-direction: row-reverse;}
.quBox .list li:nth-child(2n) .name {right: auto; left: 1.1em; }
.quBox .list li:nth-child(2n) .item .txtb { margin-left:0;  margin-right: 8%;}

@media only screen and (max-width:828px) { 
	.quBox .list ul { display: block;}
	.quBox .list li { width: 100%; margin-top: 2.5em;}
}



.whBox {  padding:1.8em 0 4.8em;}
.whBox .iTit .name { background-image: none; color: #1a1d3c; text-align: center;}
.whBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: center;}

.whBox .list {}
.whBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.whBox .list li { margin-top: 2.2%; margin-right: 2.75%; width: 31.5%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.whBox .list li:nth-child(3n) { margin-right: 0;}
.whBox .item { border: 1px solid #e1e4f3;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding:16.2% 10.8%; text-align: left; position: relative; z-index: 0;}
.whBox .item .num { position: absolute; left: 10.8%; top: 16.2%;
color: #0099ff; font-weight: lighter;}
.whBox .item .pic img{ margin: 0 10% 0 auto; display: block; width: 6.8em; height: 6em;
object-fit: contain;}
.whBox .item .name { position: relative; z-index: 0; margin-top: 1.3em; color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.whBox .item::before { position: absolute;  content: ""; display: block;
top: 10.1em; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.whBox .item .intro {margin:1.1em auto 0 0; border-top-width: 6.5%;; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }
.whBox .item .intro2 {margin:1.1em auto 0 0; 
 color: #7f84a7; line-height: 2;
 overflow: hidden;font-weight: lighter;
 display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;
}
.whBox .item .intro2 .s2 { width: 41%;}

@media only screen and (max-width:828px) { 
	.whBox {  padding:3em 0;}
	.whBox .list li { margin-top: 0.5em; margin-right:0; width: 100%;}
	.whBox .item { 
	 padding:5% 10.8%;}
	.whBox .list li:nth-child(3n) { margin-right: 0;}
	.whBox .list li:nth-child(2n) { margin-right: 0;}
}

.ysBox {  padding:4.7em 0 5.3em;
background: url(../images/ys_bg.jpg) center center no-repeat;
background-size:cover;}
.ysBox .iTit .name { background: none; color: #1a1d3c; text-align: center;}
.ysBox .iTit .intro { color: #646b97; margin-top: 0.2em;text-align: center;}
.deployBox .iTit .introC { color: #7f84a7; margin-top: 0.2em;text-align: center;}

.ysBox .list {}
.ysBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.ysBox .list li { margin-top: 1.8%; margin-right:1.8%; width: 49.1%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.ysBox .list li:nth-child(2n) { margin-right: 0;}
.ysBox .list .item { border: 1px solid #e1e4f3; flex:1;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding: 0 0 0 7%; text-align: left; position: relative; z-index: 0;
 display: flex; justify-content: space-between; align-items: flex-start;
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f9fbff+100 */
 background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(249,251,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.ysBox .list .item .num { margin: 6.6% 0;
color: #0099ff; font-weight: lighter;}
.ysBox .list .item .picb { width: 41%;
width: 17%; margin: 8.4% 10% 8.4% 0;}
.ysBox .list .item .pic { margin-top: 15%; position: relative;z-index: 0; padding-top: 80.3%;}
.ysBox .list .item .pic img{ position: absolute; left: 0; top: 0;
display: block; width:100%; height: 100%;
object-fit: contain;}
.ysBox .list .item .txtb { flex: 1; margin: 6.6% 4.2%;}
.ysBox .list .item .name { margin-top: 0em; position: relative; z-index: 0;  color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.ysBox .list .item::before { position: absolute;  content: ""; display: block;
top: 1.15em; margin-top: 5.8%; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.ysBox .list .item .intro {margin-top:0.9em; color: #7f84a7; line-height: 1.9; min-height: 5.7em;}
.ysBox .list .item .intro dl { display: flex; justify-content: flex-start;
align-items: flex-start;}
.ysBox .list .item .intro dt { font-weight: bold; color: #0066cc;}
.ysBox .list .item .intro dd { flex: 1;}
.ysBox .list .item .intro2 { display: flex; flex-wrap: wrap;min-height:auto;
 justify-content: flex-start; align-items: flex-start;}
.ysBox .list .item .intro2 dl{ width: 50%;}

@media only screen and (max-width:828px) { 
	.ysBox {  padding:3em 0;}
	.ysBox .list ul{ display: block}
	.ysBox .list li { margin-top: 1em; margin-right:0; width: 100%;}
}

.whyBox {  padding:4em 0 0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5f2fe+0,e5f2fe+100&1+1,0+100 */
background: linear-gradient(to bottom,  rgba(229,242,254,1) 0%,rgba(229,242,254,1) 1%,rgba(229,242,254,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.whyBox .iTit .name { background-image: none; color: #1a1d3c; text-align: center;}
.whyBox .iTit .intro { color: #646b97; margin-top: 0.4em;text-align: center;}

.whyBox .list {}
.whyBox .list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; 
align-items: stretch;}
.whyBox .list li { margin-top: 2.2%; margin-right: 1.33%; width: 24%;
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.whyBox .list li:nth-child(4n) { margin-right: 0;}
.whyBox .item { border: 1px solid #e1e4f3; background-color: #fff; flex: 1;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
 padding:18% 11.6% 14%; text-align: left; position: relative; z-index: 0;}
.whyBox .item .num { position: absolute; left: 10.8%; top: 16.2%;
color: #0099ff; font-weight: lighter;}
.whyBox .item .pic img{ margin: 0 7% 0 auto; display: block; width: 6.8em; height: 6em;
object-fit: contain;}
.whyBox .item .name { position: relative; z-index: 0; margin-top: 1.3em; color: #1a1d3c; height: 1.5em; overflow: hidden;
font-weight: lighter; }
.whyBox .item::before { position: absolute;  content: ""; display: block;
top: 10.1em; left:0;
 height: 1px; width: 1.4em;
background-color: #0099ff;}
.whyBox .item .intro {margin:1.1em auto 0 0; border-top-width: 6.5%;; color: #7b7d89; line-height: 1.9;
height: 5.7em; overflow: hidden;font-weight: lighter;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:3; }
.whyBox .item .intro2 {margin:1.1em auto 0 0; 
 color: #7f84a7; line-height: 2;
 overflow: hidden;font-weight: lighter;
 display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;
}
.whyBox .item .intro2 .s2 { width: 41%;}

@media only screen and (max-width:828px) { 
	.whyBox {  padding:3em 0;}
	.whyBox .list li { margin-top: 0.5em; margin-right:0; width: 49%; margin-right: 2%;}
	.whyBox .item { 
	 padding:5% 11.6% 5%;}
	.whyBox .list li:nth-child(3n) { margin-right: 2%;}
	.whyBox .list li:nth-child(2n) { margin-right: 0;}
}

@media only screen and (max-width:480px) { 
	.whyBox .list li {  width: 100%; }
	.whyBox .list li:nth-child(3n) { margin-right: 0;}
	.whyBox .list li:nth-child(2n) { margin-right: 0;}
}