.performance-swiper {
    overflow: clip;
}

.is-PC {
    .performance-img-01 {
        position: relative;
        > img {
            height: 465px;
            width: 100%;
            object-fit: cover;
        }
    }
    .performance-img-02 {
        position: relative;
        margin-top: 100px;
        background-image: url('/art-college/dance/assets/img/lesson/pc/performance-bg.png');
        background-repeat: no-repeat;
        background-size: 100% 465px;
        height: 465px;
        width: 100%;
    }
    .performance-balloon-01 {
        position: absolute;
        top: -100px;
        left: 460px;
    }
    .performance-balloon-02 {
        position: absolute;
        top: -183px;
        right: 460px;
    }
    .performance-swiper-container-pc {
        display: flex;
        gap:0 20px;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 465px;
        overflow: hidden;
        > img {
            height: 385px;
            width: 684px;
        }
    }
    .performance-swiper {
        position: relative;
        height: 465px;
        width: 100%;
    }
    .prev-arrow {
        >img {
            position: absolute;
            top: 170px;
            left: -20px;
            min-width: 21px;
        }
    }
    .next-arrow {
        >img {
            position: absolute;
            top: 170px;
            right: -20px;
            min-width: 21px;
        }
    }
    .c-lesson__performance-01 {
        margin-top: 120px;
    }
    .c-lesson__performance-02 {
        margin-top: 155px;
    }       
}
.is-SP {
    .performance-img-01 {
        width: 100%;
        height: 206px;
        object-fit: cover;
    }
    .performance-img-02 {
        background-image: url('/art-college/dance/assets/img/lesson/sp/cheer_dance/performance_bg.png');
        width: 100%;
        height: 150px;
        margin-top: 92px;
        position: relative;
    }
    .performance-balloon-02 {
        position: absolute;
        top: -85px;
        right: 0;
    }
    .performance-swiper {
        width: 100%;
        height: 150px;
    }
    .prev-arrow {
        position: absolute;
        left: -16px;
        top: 44px;
        min-width: 17px;
    }
    .next-arrow {
        position: absolute;
        right: -16px;
        top: 44px;
        min-width: 17px;
    }
    .performance-swiper-container-sp {
        display: flex;
        width: 100%;
        height: 150px;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        gap:10px;
        > img {
            width: 221px;
            height: auto;
        }
    }
}