.otop-wet{
    background:url(../images/wet_0008.png) top center no-repeat;
}
.otop-wet .top{

}	

.otop-wet .top img{
    max-width:100%;
    height:auto;

}	

.otop-wet  .mid{
    margin-top:30px;
}	
.otop-wet  .mid{
    margin-top:30px;
}			

.otop-wet  .mid .pic{
    display:inline-block;
    width:30%;
    height:auto;
    margin:5px;
    position:relative;
}	
.otop-wet  .mid .pic img{
    max-width:100%;
    height:auto;
    width: 100%;
    opacity: 1 !important;
}	
.otop-wet  .mid .pic .pic_bg2{
    display:none;
}
.otop-wet  .mid .pic:hover .title{
    display: block;
}
.otop-wet  .mid .title{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    padding: 0 20px;
    background-color:rgba(7, 41, 68, 0.7);
    font: 19px/25px 'anakotmai-medium', Arial, sans-serif;
    color:#fff;
    text-align:center;
    display: none;
}
.otop-wet  .mid .title img{
    width:auto;
}
.otop-wet  .mid .title span{
    display: table;
    height: 100%;
}
.otop-wet  .mid .title span a{
    display: table-cell;
    vertical-align: middle;
}

.otop-wet  .mid .title a{
    color:#fff;
}
.otop-wet  .mid .more-o{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    /* padding:20px; */
    background-color:rgba(7, 41, 68, 0.7);
    font: 50px/30px 'anakotmai-medium', Arial, sans-serif;
    color:#fff;
    text-align:center;
}


.otop-wet  .mid .more-o span{
    display: table;
    height: 100%;
    width: 100%;
}
.otop-wet  .mid .more-o span a{
    display: table-cell;
    vertical-align: middle;
}
.otop-wet  .mid .more-o a{
    color:#fff;
}

@media (min-width: 992px) and (max-width: 1199px) { 

}


@media (min-width: 768px) and (max-width: 991px) { 

}

@media (min-width: 320px) and (max-width: 768px) { 
    .otop-wet  .mid .pic{
        width:46%;
        height:auto;
        position:relative;
    }	
}