@media all and (min-width: 737px) {
    #main .shirasuBlog .info li .pho {
        width: 309px;
        height: 203px;
        overflow: hidden;
    }

    .pho:hover{
        opacity:.6;
    }

    .mainImg{
        width: 100%;
        min-width: 737px;
        height: 560px;
        position: relative;
        overflow: hidden;
    }
    .mainImg span{
        position: absolute;
    }
    .mainImg span.img2{
        background: url(../img/index/main_img02.jpg) no-repeat;
        background-size: cover;
        background-position: 50% 50%;
    }

    .mainImg span.img3{
        background: url(../img/index/main_img03.jpg) no-repeat;
        background-size: cover;
        background-position: 50% 50%;
    }
}

@media all and (min-width: 0) and (max-width: 736px)  {

    .mainImg{
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .mainImg:before{
        content:"";
        display: block;
        padding-top: 100%;
    }

    .mainImg img{
        position: absolute;
        top: 0;
    }
}