/* ブレンドローテーション：Instagramリール横スワイプ */
.aboutBlockRotation .rotationReels{
    margin: 24px auto 0px;
    max-width: 920px;
    width: 100%;
}

.aboutBlockRotation .rotationReelsTrack{
    display: flex;
    margin: 0px auto;
    padding: 6px 0px 12px 0px;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.aboutBlockRotation .rotationReelItem{
    flex: 0 0 calc((100% - 16px) / 2);
    min-width: 0px;
    scroll-snap-align: center;
    overflow: hidden;
    border-radius: 12px;
    background-color: #ffffff;
}

.aboutBlockRotation .rotationReelItem .instagram-media{
    margin: 0px auto!important;
    width: 100%!important;
    min-width: 326px!important;
    max-width: 540px!important;
}

.aboutBlockRotation .rotationReelsControls{
    display: flex;
    margin: 12px auto 0px;
    gap: 16px;
    align-items: center;
    justify-content: center;
}

.aboutBlockRotation .rotationReelsControls button{
    width: 38px;
    height: 38px;
    border: solid 1px #d9d9d9;
    border-radius: 50%;
    color: #333333;
    background-color: #ffffff;
    cursor: pointer;
    font-size: 22px;
}

.aboutBlockRotation .rotationReelsStatus{
    min-width: 42px;
    text-align: center;
    font-size: 13px;
    color: #555555;
}

.aboutBlockRotation .rotationReelsHint{
    margin: 8px auto 0px;
    text-align: center;
    font-size: 12px;
    color: #777777;
}

@media (max-width: 1100px){
    .aboutBlockRotation .rotationReelItem{
        flex-basis: min(380px, 82%);
    }
}

@media (max-width: 767px){
    .aboutBlockRotation .rotationReels{
        margin-top: 22px;
    }

    .aboutBlockRotation .rotationReelsTrack{
        gap: 10px;
    }

    .aboutBlockRotation .rotationReelItem{
        flex-basis: 100%;
    }
}