.c-photo-marquee {
    overflow: hidden;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    /* 写真1枚の大きさ。正方形なのでこの1つで縦横とも決まる */
    --marquee-size: 400px;
}

.c-photo-marquee__track {
    /* マウスを重ねても止めない（依頼主の指示） */
    display: flex;
    width: max-content;
    /* 写真と写真の間は隙間なし（依頼主の指示）。隙間があると -50% のループ位置もずれる */
    gap: 0;
    animation: c-photo-marquee-scroll 60s linear infinite;
}

.c-photo-marquee__track li {
    flex: 0 0 auto;
    width: var(--marquee-size);
}

.c-photo-marquee__track img {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

@keyframes c-photo-marquee-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@media (max-width: 699px) {
    .c-photo-marquee {
        --marquee-size: 180px;
    }
}