@charset "utf-8";
/* CSS Document */
/*动画*/
.mask p,.fangan-link,.fangan-line,.fangan-icon,.mask{transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;}
/*不透明*/
.hunhe-bg:hover  p,.hunhe-bg:hover .fangan-link{filter:alpha(opacity=100);-moz-opacity:1;-khtml-opacity: 1;opacity: 1;}
.hunhe-bg2:hover  p,.hunhe-bg2:hover .fangan-link{filter:alpha(opacity=100);-moz-opacity:1;-khtml-opacity: 1;opacity: 1;}
.hunhe-bg3:hover  p,.hunhe-bg3:hover .fangan-link{filter:alpha(opacity=100);-moz-opacity:1;-khtml-opacity: 1;opacity: 1;}
.hunhe-bg4:hover  p,.hunhe-bg4:hover .fangan-link{filter:alpha(opacity=100);-moz-opacity:1;-khtml-opacity: 1;opacity: 1;}
/*透明*/
.mask p{filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity: 0;opacity: 0;}

/*首页解决方案*/
.fangan-bg{background:#333}
.in-proudct li{width:300px;height:420px;float:left}
.hunhe-bg{background:url(../img/af_1.png) no-repeat}
.hunhe-bg2{background:url(../img/af_2.png) no-repeat}
.hunhe-bg3{background:url(../img/af_3.png) no-repeat}
.hunhe-bg4{background:url(../img/af_4.png) no-repeat}
.fangan-icon{margin:140px auto 25px auto;width:56px;height:51px}
.in-proudctimg1{background:url(../images/hunheicon.png) no-repeat}/*混合云灰*/
.in-proudctimg2{background:url(../images/jinrongicon.png) no-repeat}/*金融云灰*/
.in-proudctimg3{background:url(../images/jiaoyuicon.png) no-repeat}/*教育灰*/
.in-proudctimg4{background:url(../images/tongyongicon.png) no-repeat}/*通用灰*/
.hunhe-bg:hover .fangan-icon,.hunhe-bg2:hover .fangan-icon,.hunhe-bg3:hover .fangan-icon,.hunhe-bg4:hover .fangan-icon{margin-top:80px; font-size:14px;}
.hunhe-bg:hover .fangan-line,.hunhe-bg2:hover .fangan-line,.hunhe-bg3:hover .fangan-line,.hunhe-bg4:hover .fangan-line{margin-bottom: 20px;}
.fangan-line{background:#fff;width:44px;height:1px;margin-left:auto;margin-right:auto;margin-bottom:15px}
.fangan-link{display: block;margin:60px auto 0 auto;width:130px;height:38px;line-height:38px; border:1px solid #fff;color:#fff;font-size:16px;filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity: 0;opacity: 0;}
.hunhe-bg:hover .fangan-link,.hunhe-bg2:hover .fangan-link,.hunhe-bg3:hover .fangan-link,.hunhe-bg4:hover .fangan-link{display: block;margin:0 auto;height: 44px;line-height: 44px;}
.fangan-link:hover{background: #fff;color:#108EC3;}
.in-proudct li .h5-txt{font-size:20px;text-align:center;height:28px;line-height:28px;margin-top:20px;color:#fff;font-weight:bold}
.mask p{width:78%;margin:20px auto 30px auto;overflow:hidden;font-size:14px;color:#fff;text-align:center}
.view{overflow: hidden;position: relative;text-align:center;}
.view .mask,.view .content{position:absolute;overflow:hidden;top:0;left:0;width:300px;height:657px}



.mask .bg{position:absolute;left:0;right:0;top:0;bottom:0;background:#161a1d;opacity:0.6;filter: alpha(opacity=60);transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1)}
.mask .content{position:absolute;left:0;right:0;top:100px;bottom:0;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1)}
.mask:hover .content {padding-top:-100px}
.view-first:hover .mask .bg {background:#029fe1;opacity:.68}
.view .mask,.view .content{position:absolute;overflow:hidden;top:0;left:0;width:300px;height:657px}