
/*Brand-Process*/
.Services-line{ border-bottom:1px solid #8b8a8b;}
.Serv-Process{ float:left; width:100%; border-bottom:1px solid #8b8a8b; padding:76px 0 80px 0; overflow:hidden;}
.Serv-Process .Process-Info{ float:left; width:100%; line-height:0; margin:98px 0 68px 0;}
.Serv-Process .Process-Info .Info{ margin:0 -45px;}
.Serv-Process .content{ float:left; width:100%;}
.Serv-Process .content ul{ margin:0 -89px;}
.Serv-Process .content ul li{ float:left; width:33.3333%; padding:0 34px; margin-top:18px;}
.Serv-Process .content ul li .list{ float:left; width:100%; background:#dddfe0; border-radius:10px; padding:34px 47px 34px 24px;}
.Serv-Process .content ul li .list .title{ float:left; width:100%; color:#595757; font-size:18px; line-height:21px;}
.Serv-Process .content ul li .list .Info{ float:left; width:100%; color:#595757; font-size:16px; line-height:19px; margin-top:15px; min-height:76px;}

.Serv-Process .content ul li .list.active,
.Serv-Process .content ul li .list:hover{ box-shadow:5px 5px 5px rgba(0,0,0,0.15); background:#D42f36;}
.Serv-Process .content ul li .list.active .title,
.Serv-Process .content ul li .list:hover .title{ color:#fff;}
.Serv-Process .content ul li .list.active .Info, 
.Serv-Process .content ul li .list:hover .Info{ color:#fff;}

@media screen and (max-width:1366px ) {

.Serv-Process .Process-Info .Info{ margin:0;}
.Serv-Process .content ul{ margin:0 -15px;}
.Serv-Process .content ul li{ padding:0 15px;}

}

@media screen and (max-width:991px ) {

.Serv-Process{ padding:20px 0 20px 0;}
.Serv-Process .Process-Info{ margin:20px 0;}
.Serv-Process .content ul{ margin:0 -6px;}
.Serv-Process .content ul li{ padding:0 6px; margin-top:8px;}
.Serv-Process .content ul li .list{ padding:17px 12px;}
.Serv-Process .content ul li .list .title{ font-size:16px; line-height:20px;}
.Serv-Process .content ul li .list .Info{ font-size:14px; line-height:18px; margin-top:8px; min-height:90px;}


}
@media screen and (max-width:767px ) {

.Serv-Process .content ul li{ width:100%;}
.Serv-Process .content ul li .list .Info{ min-height:inherit;}


}

/*Serv-System*/
.Serv-System{ float:left; width:100%; border-bottom:1px solid #8b8a8b; padding:100px 0 80px 0; overflow:hidden;}
.Serv-System .System-Info{ float:left; width:100%; margin:45px 0 75px 0; position:relative;}
.Serv-System .System-Info .line_top{ float:left; width:1724px; height:158px; margin-left:-850px; position:absolute; left:50%; top:0; background:url(../images/Serv2.png) center top no-repeat; z-index:6;}
.Serv-System .System-Info .line_bottom{ float:left; width:1724px; height:158px; margin-left:-850px; position:absolute; left:50%; bottom:0; background:url(../images/Serv2_2.png) center bottom no-repeat; z-index:6;}
.Serv-System .System-Info .Info{ float:left; position:absolute; position:absolute; bottom:136px; color:#d32e36; font-size:0.26rem; line-height:0.26rem; margin-top:-25px; z-index:8;white-space:nowrap;}
.Serv-System .System-Info .Info.Info-left{ right:100%;}
.Serv-System .System-Info .Info.Info-right{ left:100%;}

.Serv-System .System-Info .Info-Middle{ float:left; width:100%; position:relative; z-index:8; padding:23px 55px 14px 55px;}
.Serv-System .Info-Middle li{ float:left; width:20%;}
.Serv-System .Info-Middle li .Info-title{ float:left; width:100%; position:relative; margin-top:26px;}
.Serv-System .Info-Middle li .Info-title .EN{ float:left; width:100%; text-align:center; color:#595757; font-size:24px; line-height:24px; position:absolute; left:50%; top:-26px;}
.Serv-System .Info-Middle li .Info-title .CN{ display:block; margin:0 auto; width:177px; height:177px; line-height:177px; font-size:45px; text-align:center; color:#fff; background:#a0a0a0; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;}
.Serv-System .Info-Middle li .Info-title .Arrow{ float:left; width:33px; height:36px; position:absolute; right:0; top:50%; margin:-18px -16px 0 0;line-height:0; background:url(../images/Serv2_1.png) center no-repeat; background-size:100% 100%;}

.Serv-System .Info-Middle li .Info-list{ float:left; width:100%; padding-left:36px; background:url(../images/Serv2_3.png) right top repeat-y; min-height:167px; margin-top:30px;}
.Serv-System .Info-Middle li .Info-list span{ float:left; width:100%; color:#595757; font-size:23px; line-height:31px; cursor:pointer;}
.Serv-System .Info-Middle li .Info-list span:hover{ color:#D42f36;}

.Serv-System .Info-Middle li.hover .Info-title .CN,
.Serv-System .Info-Middle li:hover .Info-title .CN{ background:#D42f36;}
.Serv-System .Info-Middle li.hover .Info-title .EN,
.Serv-System .Info-Middle li:hover .Info-title .EN{ color:#D42f36;}
.Serv-System .Info-Middle li.hover .Info-title .Arrow,
.Serv-System .Info-Middle li:hover .Info-title .Arrow{background:url(../images/Serv2_1_1.png) center no-repeat; background-size:100% 100%;}




.mainTitle-Serv{ float:left; width:100%; text-align:center; color:#595757; font-size:28px; line-height:36px; margin-bottom:40px;}
.Services-Info{ float:left; width:100%; padding:80px 0 0 0;}
.Services-Info .content{ float:left; width:100%; padding:36px 0 52px 0;}
.Services-Info .content .title{ float:left; width:100%; color:#595757; text-align:center; font-size:24px; line-height:32px; font-weight:bold; margin-top:40px;}
.Services-Info .content .Info{ float:left; width:100%; color:#595757; text-align:center; font-size:24px; line-height:32px;}

.Serv-System-top-0{ padding-top:52px;}

@media screen and (max-width:1600px ) {
.Serv-System .System-Info .Info.Info-left{ right:94.7%;}
.Serv-System .System-Info .Info.Info-right{ left:94.7%; margin-left:-12px;}

}

@media screen and (max-width:1400px ) {

.Serv-System .System-Info .Info{ bottom:129px;}
.Serv-System .System-Info .Info-Middle{  padding:23px 100px 14px 100px;}
.Serv-System .System-Info .Info.Info-left{ right:90%;}
.Serv-System .System-Info .Info.Info-right{ left:90%;}
.Serv-System .Info-Middle li .Info-title .CN{ width:144px; height:144px; line-height:144px; font-size:36px;}
.Serv-System .Info-Middle li .Info-list{ min-height:145px;}
.Serv-System .Info-Middle li .Info-list span{ font-size:18px; line-height:26px;}


}

@media screen and (max-width:1229px ) {

.Serv-System .System-Info .line_top{ background-size:80% auto;}
.Serv-System .System-Info .line_bottom{ background-size:80% auto;}

.Serv-System .System-Info .Info{ bottom:129px;}
.Serv-System .System-Info .Info-Middle{  padding:23px 100px 14px 100px;}
.Serv-System .Info-Middle li .Info-title .CN{ width:110px; height:110px; line-height:110px; font-size:24px;}
.Serv-System .Info-Middle li .Info-list{ min-height:145px; padding-left:30px; margin-top:20px;}
.Serv-System .Info-Middle li .Info-list span{ font-size:16px; line-height:24px;}

.Services-Info .content .title{ font-size:20px; line-height:28px;}
.Services-Info .content .Info{ font-size:20px; line-height:28px;}


}


@media screen and (max-width:991px ) {


.Serv-System{ padding:20px 0 20px 0;}
.Serv-System .System-Info{ margin:16px 0 20px 0;}
.Serv-System-top-0{ padding-top:20px;}

.mainTitle-Serv{ font-size:20px; line-height:28px; margin-bottom:20px;}
.Services-Info{ padding:20px 0 0 0;}
.Services-Info .content{ padding:10px 0 20px 0;}
.Services-Info .content .title{ font-size:16px; line-height:22px; margin-top:15px;}
.Services-Info .content .Info{ font-size:16px; line-height:22px;}

.Serv-System .System-Info .Info{ bottom:100px;}

.Serv-System .System-Info .Info-Middle{ padding:15px 70px 10px 70px;}
.Serv-System .System-Info .line_top{ background-size:60% auto;}
.Serv-System .System-Info .line_bottom{ background-size:60% auto;}
.Serv-System .Info-Middle li .Info-title{ margin-top:16px;}
.Serv-System .Info-Middle li .Info-title .EN{ font-size:16px; line-height:16px;top:-16px;}
.Serv-System .Info-Middle li .Info-title .CN{ width:88px; height:88px; line-height:88px; font-size:18px;}
.Serv-System .Info-Middle li .Info-title .Arrow{ width:16px; height:18px; margin:-9px -8px 0 0;}
.Serv-System .Info-Middle li .Info-list{ min-height:100px; padding-left:15px; margin-top:15px;}
.Serv-System .Info-Middle li .Info-list span{ font-size:12px; line-height:22px;}


}


@media screen and (max-width:767px ) {

.Serv-System .System-Info .line_top{ width:900px; margin-left:-450px;}
.Serv-System .System-Info .line_bottom{ width:900px; margin-left:-450px;}
.Serv-System .System-Info .Info{ bottom:0.52rem;}
.Serv-System .System-Info .Info-Middle{ padding:40px 0 10px 0;}
.Serv-System .System-Info .line_top{ background-size:60% auto;}
.Serv-System .System-Info .line_bottom{ background-size:60% auto;}
.Serv-System .Info-Middle li .Info-title .EN{ font-size:0.34rem; line-height:0.125rem;top:-0.225rem;}
.Serv-System .Info-Middle li .Info-title .CN{ width:1.4rem; height:1.4rem; line-height:1.4rem; font-size:0.38rem;}
.Serv-System .Info-Middle li .Info-title .Arrow{ width:0.18rem; height:0.2rem; margin:-0.1rem -0.09rem 0 0;}
.Serv-System .Info-Middle li .Info-list{ min-height:100px; padding:0 0.15rem; margin-top:15px;}
.Serv-System .Info-Middle li .Info-list span{ font-size:12px; line-height:22px; overflow:hidden;white-space: nowrap; text-overflow:ellipsis;}

.Serv-System .System-Info .Info{ position:absolute; bottom:auto; top:40px;font-size:16px; line-height:16px;}
.Serv-System .System-Info .Info.Info-left{ right:75%;}
.Serv-System .System-Info .Info.Info-right{ left:75%;}

.Services-Info .content .Info.Info-left{ text-align:left;}
.Services-Info .content .Info{ font-size:14px; line-height:22px;}
.Services-Info .content .title{ font-size:14px; line-height:22px;}

}



/*Services-list*/
.Services-list{ float:left; width:100%;}
.Services-list li{ float:left; width:100%; position:relative;}
.Services-list li.Serv-bg1{ background:#e9e9e9;}
.Services-list li.Serv-bg2{ background:url(../images/Serv4.jpg) center no-repeat; background-size:cover;}
.Services-list li.Serv-bg3{ background:url(../images/Serv3.jpg) center no-repeat; background-size:cover;}
.Services-list li .Info-left{ float:left; width:390px; margin:8.43% 0 9.47% 7.29%;}
.Services-list li .Info-left .title{ float:left; width:100%; color:#595757; font-size:43px; line-height:54px;}
.Services-list li .Info-left .Info{ float:left; width:100%; color:#595757; font-size:18px; line-height:28px; margin:9px 0 28px 0;}
.Services-list li .Info-left .Info-list{ float:left; width:100%;}
.Services-list li .Info-left .Info-list ul{ float:left; width:50%;}
.Services-list li .Info-left .Info-list ul li{ float:left; width:100%; color:#595757; font-size:20px; line-height:40px;}
.Services-list li .Info-img{ float:left; width:50%; line-height:0; position:absolute; right:0; top:0; height:100%;}
.Services-list li .Info-img img{ display:none;}

.Services-list li.Serv-bg2 .Info-left{ float:right; width:480px; margin:7.5% 12.9% 10.52% 0;}
.Services-list li.Serv-bg1 .Info-img{}
.Services-list li.Serv-bg2 .Info-img{ right:auto; left:0; width:51.56%; }
.Services-list li.Serv-bg3 .Info-img{ width:55.93%;}
.Services-list li.Serv-bg3 .Info-left{ margin:7.81% 0 10.83% 7.29%;} 

@media screen and (max-width:1480px ) {

.Services-list li.Serv-bg2 .Info-left{ margin:7.39% 7.29% 8.33% 0;}

}

@media screen and (max-width:1366px ) {

.Services-list li .Info-left{ width:298px;}
.Services-list li .Info-left .title{ font-size:33px; line-height:42px;}
.Services-list li .Info-left .Info{ font-size:14px; line-height:24px;}
.Services-list li .Info-left .Info-list ul li{ font-size:16px; line-height:36px;}
.Services-list li.Serv-bg2 .Info-left{ width:365px;}

}

@media screen and (max-width:1366px ) {

.Services-list li .Info-left{ width:298px;}
.Services-list li .Info-left .title{ font-size:33px; line-height:42px;}
.Services-list li .Info-left .Info{ font-size:14px; line-height:24px; margin:9px 0 14px 0;}
.Services-list li .Info-left .Info-list ul li{ font-size:16px; line-height:30px;}

.Services-list li.Serv-bg2 .Info-left{ width:365px;}

}


@media screen and (max-width:991px ) {


.Services-list li .Info-left{ width:100%; margin:0; padding:30px;}
.Services-list li .Info-left .title{ font-size:24px; line-height:34px;}
.Services-list li .Info-img{ width:100%; position:static;}
.Services-list li .Info-img img{ display:block;}

.Services-list li.Serv-bg2 .Info-left{ width:100%; margin:0;}
.Services-list li.Serv-bg3 .Info-left{ width:100%; margin:0;}
.Services-list li.Serv-bg2 .Info-img{ width:100%;}
.Services-list li.Serv-bg3 .Info-img{ width:100%;}

.Services-list li .Info-left .Info-list ul li{ font-size:14px; line-height:24px;}
.Services-list li .Info-left .Info{ margin:5px 0 7px 0; line-height:22px;}

}

@media screen and (max-width:767px ) {

.Services-list li .Info-left .title{ font-size:20px; line-height:30px;}
.Services-list li .Info-left{ padding:20px 15px;}

}






















