@charset "utf-8";
/* CSS Document */
*{margin:0px;padding:0px}
body{font-size:12px; font-family:"微软雅黑";color:#000; min-width:1250px}
img{border: 0;}
li{ list-style:none;}
.fl{float:left;}
.fr{float:right}
.cl{clear:both;}
a{ text-decoration: none; }
a:hover{ text-decoration:none; }
cite{ font-style:normal; float:right}
cite a{ color:#333}

/***************通用部分***************/
.page{ width:1200px; margin:0 auto}
.min_hover{ width:100%; height:40px; position:absolute; left:0; bottom:0; opacity:0.5; filter:alpha(opacity=50); background:#000;}
.min_text{width:calc(100% - 20px); height:40px; position:absolute; left:0; bottom:0; line-height:40px; text-align:center; font-size:16px; color:#fff;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all; padding:0 10px;}
.min_text a{ color:#fff}

.min_title img{ max-width:100%; height:auto; display:block; margin:0 auto}

/***************第一部分***************/
.header{ background:url(header.jpg) no-repeat center top; height:957px;}
.wrap{ background:url(bg1.jpg) no-repeat center top; padding-bottom:20px}
/***************第2部分***************/
.min_box1{ width:1220px}
.min_sub{ display:block; width:345px; height:285px; background:#fff; padding:20px; float:left; margin-right:20px; margin-bottom:20px; box-shadow:0 0 10px 10px rgb(0,0,0,0.1)}
.min_sub img{ width:100%; height:215px; display:block; margin-bottom:10px}
.min_sub p{ line-height:24px; font-size:18px; color:#000}

.min_pix{ display:block; float:left; position:relative; width:385px;margin-right:20px; margin-bottom:20px; box-shadow:0 0 10px 10px rgb(0,0,0,0.1)}
.min_pix img{ width:100%;  height:220px; display:block}
/***************第3部分***************/
#showcase1{position: absolute;top:0px;width: 1200px;height:520px; left:-0px}
#showcase1 .cloud9-item{ width:600px; border:5px #fff solid; border-radius:10px}
#showcase1 .cloud9-item.active  img{ width:600px; height:330px}
#showcase2 .cloud9-item{ width:310px;background: url(b.png) no-repeat center top; background-size:100% 100%;border-radius:2em; padding:15px}
#showcase2 .cloud9-item.active  img{ width:310px; height:690px}



#showcase2 {position: absolute;top:0px;width: 1200px;height:630px; left:0px}
.cloud9-item.active .h5-mask {display: none;}
.cloud9-item {position: relative;display: inline-block;opacity: 0.98;cursor:pointer;  }
.cloud9-item:after {position: absolute;left: 0;top: 0;width: 100%;height: 100%;content: ""}
.cloud9-item.active:after {display: none;}
.cloud9-item  img{width:100%}
.cloud9-item.active .h5-mask{background: transparent;}
.cloud9-item.active.show-code .h5-mask {display: block;background: #000;}
.cloud9-item.active.show-code .code {display: inline-block;}
.cloud9-item.active.show-code p {display: block}
.cloud9-item .img-h5bg {width: 100%;height: 100%;cursor:pointer;}
.cloud9-item.active .img-h5bg {transition: all .3s ease;}
.cloud9-item.active .img-h5bg:hover {transform: scale(1.5);}




/***************第4部分***************/




/***************第5部分***************/



/***************第6部分***************/