@charset "utf-8";
/* CSS Document */

/*indexBanner*/
.indexBanner { width:100%;}
.indexBanner ul { position:relative; width:100%;}
.indexBanner ul li { position:absolute; left:0; top:0; width:100%;}
.indexBanner ul li img { position:absolute;}

.fimg01 { z-index:0; top:0; left:0; width:100%; opacity:0;}
.fimg02 { z-index:1; left:50%; top:0%; width:26%; opacity:0;}

.simg01 { z-index:0; top:0; left:0;width:100%; opacity:0;}
.simg02 { z-index:1; top:0%; left:50%; width:24%; opacity:0;}
.simg03 { z-index:1; top:0%; left:55%; width:21%; opacity:0;}
.simg04 { z-index:1; bottom:10%; left:57%; width:20%; opacity:0;}

.timg01 { z-index:0; top:0; left:0; width:100%; opacity:0;}
.timg02 { z-index:1; top:0%; left:45%; width:26%; opacity:0;}

/*animate*/

.indexBanner ul .animate .fimg01 { transition-duration:2s; opacity:1; z-index:10;}
.indexBanner ul .animate .fimg02 { transition-duration:2s; opacity:1; transition-delay:400ms; top:13%;z-index:11;}

.indexBanner ul .animate .simg01 { transition-duration:2s; opacity:1;z-index:10;}
.indexBanner ul .animate .simg02 { transition-duration:2s; opacity:1; transition-delay:300ms; top:10%;z-index:11}
.indexBanner ul .animate .simg03 { transition-duration:2s; opacity:1; transition-delay:400ms; top:40%;z-index:11}
.indexBanner ul .animate .simg04 { transition-duration:2s; opacity:1; transition-delay:600ms; bottom:0;z-index:11}
.indexBanner ul .animate .timg01 { transition-duration:2s; opacity:1;z-index:10;}
.indexBanner ul .animate .timg02 { transition-duration:2s; opacity:1; transition-delay:400ms; top:20%;z-index:11}

/*indexProgress*/
.indexProgress { width:100%; height:220px; margin:30px auto 0; position:relative;}
.indexProgress ul { position:absolute; z-index:10; width:100%;}
.indexProgress ul li{ float:left; margin:0 2%; text-align:center; width:20%;}
.indexProgress ul li img { width:100%;}
.indexProgress ul li img:hover { transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); -webkit-transform:scale(1.2);}
.indexProgress ul li p { font-size:16px; color:#333;}
.dash { border-bottom:1px dashed #1f63be; position:absolute; top:36%; left:5%; width:80%;}

/*indexService*/
.indexService { width:100%; background:#deecff;}
.serviceIn { width:100%; margin:20px auto 0; padding:20px 0;}
.serviceIn h2 { width:380px; height:80px; background:url(../img/img11.png) no-repeat;padding:0 0 0 138px; box-sizing:border-box; line-height:70px; font-size:22px; margin:0 auto;}
.serviceIn .siContent div { width:30%; height:310px; box-shadow:5px 5px 5px #ccc; border-radius:20px; border:1px solid #ccc; float:left; background:#fff; padding:0 0 10px 0; margin:0 0 0 2%;}
.serviceIn .siContent div img { width:100%;}
.serviceIn h3 { font-size:18px; font-weight:normal; margin:15px 0; color:#1f63be; display:block; text-align:center;}
.siContent div p{ text-indent:28px; font-size:14px; line-height:24px; padding:0 5px; box-sizing:border-box;}
.serviceIn .siContent { margin:20px 0 0 0;}

/*indexCase*/
.indexCase { width:100%; margin:0 auto 20px;}
.indexCase h2 { width:380px; height:80px; background:url(../img/img11.png) no-repeat;padding:0 0 0 138px; box-sizing:border-box; line-height:70px; font-size:22px; margin:10px auto 0; }
.caseShow { width:60%;  float:left;}
.caseShow ul { width:100%;position:relative;}
.caseShow ul li{position:absolute;  left:0; top:0;}
.caseShow ul li img { width:100%;}
.caseShow ul .current{z-index:10; }
.caseShow ul li p { display:block; width:100%; height:50px; background:rgba(0,0,0,0.5); text-align:right; color:#fff; position:absolute; bottom:0; left:0; line-height:50px; padding:0 10px; box-sizing:border-box; font-size:18px;}

.caseRight { float:left; width:37%; margin:0 0 0 2%;}
.caseRight ul { width:100%;}
.caseRight ul li { position:relative;  width:47%; float:left; margin:0 2% 10px 0; overflow:hidden;}
.caseRight ul li img { width:100%;}
.caseRight ul li p {display:block; width:100%; height:30px; background:rgba(0,0,0,0.5); text-align:right; color:#fff; position:absolute; bottom:0; left:0; line-height:30px; padding:0 10px; box-sizing:border-box; font-size:14px; }
.caseRight ul .differ { margin:35px 0;}

/*indexProducut*/
.indexProducut { width:100%; background:#e1e1e1; padding:10px 0;}
.ProIn { width:100%; margin:10px auto;}
.ProIn h2 {width:380px; height:80px; background:url(../img/img11.png) no-repeat;padding:0 0 0 138px; box-sizing:border-box; line-height:70px; font-size:22px; margin:0 auto; }
.piLeft { float:left; margin:0 0 0 10px; display:none;}
.piRight { float:left; width:100%; overflow:hidden;}
.piRight img { margin:0 0 0 2%; width:45%; float:left;}
.pirBottom { margin:10px 0 0 0;}




