.case-content-div img{
    margin-top: 0;
}
.mask{
    cursor: pointer;
    display: table-cell;
    vertical-align:middle;
    background-color: rgba(0,0,0,0.5);
    color: white;
    width: 100%;
    height: 100%;
    margin-left: 6px;
    text-align: center;
    opacity: 0;
    pointer-events: none;
}

.mask:hover{
    opacity: 1;
}

.maskp{
    position: absolute;
    top: 0;
    display: table;
    width: 383px;
    height: 350px;
    margin-left: 5px;
}

.case{
    position: relative;
    cursor: pointer;
    float: left;
    width: 389px;
    height: 350px;
    margin-bottom: 5px;
}


.case:hover .mask{
    animation: fade-in forwards;/*动画名称*/
    animation-duration: 1s;/*动画持续时间*/
    -webkit-animation:fade-in 1s forwards;/*针对webkit内核*/
    -moz-animation: fade-in 1s forwards;	/* Firefox */
    -o-animation: fade-in 1s forwards;
}

@keyframes fade-in {
    from {opacity: 0;height: 0;}/*初始状态 透明度为0*/
    to {opacity: 1;height: 100%;}/*结束状态 透明度为1*/
}
@-webkit-keyframes fade-in {/*针对webkit内核*/
    from {opacity: 0;height: 0;}/*初始状态 透明度为0*/
    to {opacity: 1;height: 100%;}/*结束状态 透明度为1*/
}

.index-solution-btn{
    margin-top: 20px;
    margin-left: 0;
}
.case-content-div{
    height: auto;
}

.index-middle-div{
    padding-bottom: 50px;
}