@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:1080px; height:220px; margin:30px auto 0; position:relative;}
.indexProgress ul { position:absolute; z-index:10;}
.indexProgress ul li{ float:left; margin:0 40px; text-align:center;}
.indexProgress ul li img { width:182px;}
.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:24px; color:#333;}
.dash { border-bottom:1px dashed #1f63be; position:absolute; top:40%; left:5%; width:900px;}

/*indexService*/
.indexService { width:100%; background:#deecff;}
.serviceIn { width:1080px; 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:30px; margin:0 auto;}
.serviceIn .siContent div { width:305px; height:386px; 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 50px;}
.serviceIn .siContent div img { width:305px;}
.serviceIn h3 { font-size:28px; font-weight:normal; margin:15px 0; color:#1f63be; display:block; text-align:center;}
.siContent div p{ text-indent:32px; font-size:16px; line-height:28px; padding:0 5px; box-sizing:border-box;}
.serviceIn .siContent { margin:20px 0 0 0;}

/*indexCase*/
.indexCase { width:1080px; 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:30px; margin:10px auto 0; }
.caseShow { width:600px; height:320px; float:left;}
.caseShow ul { width:600px; height:320px; position:relative;}
.caseShow ul li{position:absolute;  height:320px; left:0; top:0;}
.caseShow ul li img { width:600px;}
.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:22px;}

.caseRight { float:left; width:455px; margin:0 0 0 20px;}
.caseRight ul { width:455px;}
.caseRight ul li { position:relative; height:100px; width:200px; float:left; margin:0 10px 10px 0; overflow:hidden;}
.caseRight ul li img { width:200px;}
.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:16px; }
.caseRight ul .differ { margin:35px 0;}

/*indexProducut*/
.indexProducut { width:100%; background:#e1e1e1; padding:10px 0;}
.ProIn { width:1080px; 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:30px; margin:0 auto; }
.piLeft { float:left; margin:0 0 0 10px;}
.piLeft  img { width:340px;}
.piRight { float:left;}
.piRight .img001 { width:470px;}
.piRight .img002 { width:236px;}
.piRight img { margin:0 0 0 10px;}
.pirBottom { margin:10px 0 0 0;}
.pirBottom .img003 { width:360px;}
.pirBottom .img004 { width:348px;}

.youqing { width:1080px; margin:20px auto;}