@charset "utf-8";
/* ===============================
port folio
================================== */
.article--portfolio{
    padding: 70px 5.3% 200px;
    border-bottom: #fdfdfd solid 3px;
}
.portfolio__list{
    display: flex;
    gap: 30px 17px;
    flex-wrap: wrap;
    justify-content: center;
}
.portfolio__item{
    width: 159px;
    height: 159px;
    outline: #fdfdfd solid 5px;
}
.portfolio__item:last-of-type img {
    object-fit: cover;
    width: 159px;
    height: 159px;
}
.fadeIn{
    transform: translate(0,50px);
    opacity: 0;
    transition: 0.8s;
}
.fadeIn.animated{
    transform: translate(0,0);
    opacity: 1;
}
.portfolio__movie{
    margin: 0 auto;
    width: 100%;
    height: 337px;
    margin-bottom: 50px;
}
/* tb */
@media screen and (min-width: 768px){
    .portfolio__item{
        width: 158px;
    }
}/* tb */

/* pc */
@media screen and (min-width: 961px){
    .portfolio__list{
        gap: 65px 124px;
    }
    .article--portfolio{
        padding: 70px 5.3% 300px;
    }
}/* pc */