.partner-logo-list-section {
    .partner-logo-list-section-title {
        text-align: center;
    }

    .frame {
		position: relative;
		overflow: hidden;
	}

    .track {
        width: max-content;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.72rem;
        padding-right: 0.72rem;
        animation-play-state: paused; 
        will-change: transform;
        white-space: nowrap;
    
        @media screen and (max-width: 768px)  {
            gap: 0.4rem;
            padding-right: 0.4rem;
        }

        &.is-animating {
            animation: track-animation 20s linear infinite;
            will-change: transform;
            animation-play-state: running;
        }
    }

    .partner-logo-list-section-row {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 0.16rem;

        @media screen and (max-width: 1024px)  {
            gap: 0.16rem;
            justify-content: center;
        }

        .track-item {
            @media screen and (max-width: 768px)  {
                width: 100%;
            }
        }
    }

    .track-item {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        width: 2.4rem;
        height: 1.04rem;
        border-radius: 0.16rem;
        padding: 0.16rem;
        background-color: var(--color-11);
    }

    .track-item-image {
        position: absolute;
        left: 0.16rem;
        top: 0.16rem;
        width: calc(100% - 0.32rem);
        height: calc(100% - 0.32rem);
        object-fit: contain;
        object-position: center;
    }
}

@keyframes track-animation {
	0% {
		transform: translate3d(0%, 0, 0);
	}
	100% {
		transform: translate3d(-33.33%, 0, 0);
	}
}
