@charset 'utf-8';

section.work{
    max-width: 1350px;
}
section.work .item.initial{
    opacity: 1;
}
section.work .item{
    width: calc(100%/7);
    height: 109px;
    position: relative;
    transition: .2s;
    opacity: 0;
}
section.work .item.db{
    display: none;
}
section.work .item.op{
    opacity: 1;
}
section.work .item img{
    vertical-align: bottom;
    max-width: initial;
    transform-origin: center center;
    position: relative;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%; 
    width: calc(100% + 31px);
}
section.work .flex{
    display: flex;
    flex-wrap: wrap;
}
.img-blur{
    transition: .3s;
}
.anim-img{
    animation-duration: .5s;
    animation-delay: .1s;
}

@media screen and (max-width: 1350px){
    section.work{
        max-width: 1100px;
    }
    section.work .item img{
        width: calc(100% + 25px);
    }
    section.work .item{
        height: 88.5px;
    }
}

@media screen and (max-width: 768px){
    article{
        overflow-x: hidden;
    }
    section.work .item.db{
        display: block;
    }
    section.work .item.dn{
        display: none;
    }
    section.work .item{
        width: calc(100%/3);
        height: 17vw;
    }
    section.work .item img{
        width: calc(100% + 4.9vw);
    }
    section.work .flex{
        width: 89.7vw;
        margin: 0 auto;
    }
    section.work{
        margin: 80px auto;
    }
}