@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%; margin:10px auto 0; position:relative;}
.indexProgress ul { width:100%; position:absolute; z-index:10;}
.indexProgress ul li{ float:left; margin:0 2%; text-align:center; width:20%;}
.indexProgress ul li img { width:100%;}
.indexProgress ul li p { font-size:0.8em; 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:10px auto 0; padding:20px 0;}
.serviceIn h2 {padding:0 0 0 10px; box-sizing:border-box; font-size:1.2em; margin:0 auto;}
.serviceIn .siContent div { width:100%;  border:1px solid #ccc; float:left; background:#fff; padding:0 0 10px 0; margin:10px 0 0 0;}
.serviceIn .siContent div img { width:100%;}
.serviceIn h3 { font-size:1em; font-weight:normal; margin:15px 0; color:#1f63be; display:block; text-align:center;}
.siContent div p{ text-indent:1.2em; font-size:0.8em; line-height:1.6em; padding:0 5px; box-sizing:border-box;}

/*indexCase*/
.indexCase { width:100%; margin:0 auto 20px;}
.indexCase h2 {padding:0 0 0 10px; box-sizing:border-box;  font-size:1.2em; margin:10px auto 0; }
.caseShow { width:100%; height:100%; margin:10px 0 0 0;}
.caseShow ul { width:100%; height:100%; position:relative;}
.caseShow ul li{width:100%; height:100%; 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: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:1em;}

.caseRight {display:none; 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 { display:none;}