/* 導入事例スライダー用スタイル */
.slider-container {
    width: 100%;
    margin: 0 auto;
    padding: 20px 0;
    position: relative;
}

/* 各行のスライダー */
.slider-row-1, .slider-row-2, .slider-row-3 {
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    width: 100%;
}

/* スライダートラック */
.slider-track {
    display: flex;
    position: relative;
    will-change: transform;
}

/* スライドアニメーション - ループ用に調整 */
@keyframes slide {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%); /* コンテンツの半分だけ移動させる */
    }
}

/* 標準速度 */
.slider-row-1 {
    animation-duration: 30s;
    animation-play-state: running;
}

/* 遅い速度 */
.slider-row-2 {
    animation-duration: 45s;
    animation-direction: reverse; /* 逆方向に動かす */
    animation-play-state: running;
}

/* 速い速度 */
.slider-row-3 {
    animation-duration: 20s;
    animation-play-state: running;
}

/* スライドアイテム */
.slide {
    flex: 0 0 auto;
    margin-right: 20px;
    opacity: 1;
    transition: opacity 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slide img {
    height: auto;
    max-width: 150px;
    display: block;
    margin: 0 auto;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .slide img {
        max-width: 120px;
    }
}
