/* real story*/
.realstory{
    background-color : #f7f7f7;
    display : flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding : 50px 0 100px;
}

.realstory-title{
    margin-bottom : 50px;
}

.realstory-title img{
    width : auto;
}

.realstory-photo{
    width : 60%;
}

.realstory-photo ul{
    display : flex;
    justify-content: center;
    flex-wrap : wrap;
}

.realstory-photo li{
    width : 25%;   
}

.realstory-photo li a{
    overflow:hidden;
    display : inline-block;
    width : 100%;
    height : 100%;
    vertical-align: bottom;
}

.realstory-photo li a img{
    transition : all 0.3s linear;
}

.realstory-photo li:not(.view) a:hover img{
    transform : scale(1.2);
}

.realstory-photo li.view{
    width : 50%;
}

.realstory-photo-mo{
    display : none;
}

@media screen and (max-width : 800px){
    .realstory-photo{
        display : none;
    }

    .realstory-photo-mo{
        display : block;
        width : 90%;
        margin : 0 auto;
    }

    .realstory-photo-mo ul{
        display : flex;
        flex-wrap : wrap;
    }

    .realstory-photo-mo li:not(.view){
        width : calc( 99.9%/3);
    }

}