.view-eighth{/*! overflow:hidden; */ width:300px; height: 154px; float: left; margin: 24px 0; padding: 0px;}
.view-eighth .mask {
   background-color: rgba(36, 83, 153, 1); border-radius: 10px;
   top: 0px; left:-30px;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-out 0.5s;
   -moz-transition: all 0.3s ease-out 0.5s;
   -o-transition: all 0.3s ease-out 0.5s;
   -ms-transition: all 0.3s ease-out 0.5s;
   transition: all 0.3s ease-out 0.5s;
   width:0px; height: 0px; overflow: hidden;
   position: absolute; cursor:pointer;
   z-index: 10;
}
.view-eighth h1 {
   color: #fff;
   font-size: 20px; text-align: center; width: 358px; height: 61px; line-height: 61px;}

.view-eighth h1 img {
   margin:15px 7px 15px 0px;}
   
.view-eighth ul {
   background:#fff; border-radius: 10px; margin:0 10px 10px 10px; width:318px; padding:10px; float: left;
}
.view-eighth ul li {
   float: left; width: 50%;
}
.view-eighth a.link {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out 0.3s;
   -moz-transition: all 0.2s ease-in-out 0.3s;
   -o-transition: all 0.2s ease-in-out 0.3s;
   -ms-transition: all 0.2s ease-in-out 0.3s;
   transition: all 0.2s ease-in-out 0.3s;
   width:100px; height: 25px; background: #e70033; color: #fff; line-height: 25px; text-align: center;
   margin:125px 75px 0px 75px;
}
.view-eighth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   top: 0px; left:-30px;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   -webkit-animation: bounceY 0.9s linear;
   -moz-animation: bounceY 0.9s linear;
   -ms-animation: bounceY 0.9s linear;
   animation: bounceY 0.9s linear; width:358px; height: 302px; 
}
.view-eighth:hover h1 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.4s;
   -moz-transition-delay: 0.4s;
   -o-transition-delay: 0.4s;
   -ms-transition-delay: 0.4s;
   transition-delay: 0.4s;
}
.view-eighth:hover p {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.view-eighth:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}


.pro_info{position: relative; margin-top: -175px; color:#fff; font-size: 16px; text-align: center;}
.index_pro{background: #fff; height:208px; }
.pro_info01{color:#fff; font-size: 14px; text-align: center; background: #8695a0 url(../images/index_pr_bg1.png) no-repeat; height: 42px; line-height: 42px; margin:0px;}
.pro_info02{color:#fff; font-size: 14px; text-align: center; background: #8695a0 url(../images/index_pr_bg.png) no-repeat right; height: 42px; line-height: 42px; margin:0px;}