@media screen and (max-width:767px) { /*SP*/

    @keyframes ripple {
        0% { scale: 1; }
        80% { scale: 1.6; opacity: 0; }
        100% { scale: 1.6; opacity: 0; }
    }

    #ACM .ACM_circle_01::before{
        position: absolute;
        top: 0;
        left: 0;
        /* width: 40px; */
        width: 10.67vw;
        /* height: 40px; */
        height: 10.67vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #0064B6;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    #ACM .ACM_circle_02::before{
        position: absolute;
        top: 0;
        left: 0;
        /* width: 40px; */
        width: 10.67vw;
        /* height: 40px; */
        height: 10.67vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #008C4F;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    /* reel counter */
    #ACM .ACM_reel{
        display: flex;
        justify-content: center;
        align-items: baseline;
    }

    #ACM .ACM_reel_digit{
        /* height: 101px; */
        height: 26.93vw;
        overflow: hidden;
        position: relative;
    }

    #ACM .ACM_reel_digit::before,
    #ACM .ACM_reel_digit::after{
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        /* height: 20px; */
        height: 5.33vw;
        z-index: 1;
        pointer-events: none;
    }

    #ACM .ACM_reel_digit::before{
        top: 0;
        background: linear-gradient(to bottom, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_digit::after{
        bottom: 0;
        background: linear-gradient(to top, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_strip{
        transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1);
    }

    #ACM .ACM_reel_strip span{
        display: block;
        /* height: 88px; */
        height: 23.47vw;
        /* line-height: 88px; */
        line-height: 23.47vw;
        /* font-size: 88px; */
        font-size: 23.47vw;
        font-weight: 200;
        margin: 0;
    }

    #ACM .ACM_reel_comma{
        /* line-height: 88px; */
        line-height: 23.47vw;
        /* margin-left: -9px; */
        margin-left: -2.4vw;
        opacity: 0;
        transition: opacity 0.4s ease;
    }

    #ACM .ACM_reel_comma.is-visible{
        opacity: 1;
    }

    #ACM .ACM_circle_03::before{
        position: absolute;
        top: 0;
        left: 0;
        /* width: 40px; */
        width: 10.67vw;
        /* height: 40px; */
        height: 10.67vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #DC000C;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

}

@media screen and (min-width:768px) and ( max-width:1300px) { /*TB*/

    @keyframes ripple {
        0% { scale: 1; }
        80% { scale: 1.6; opacity: 0; }
        100% { scale: 1.6; opacity: 0; }
    }

    #ACM .ACM_circle_01::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 9.23vw;
        height: 9.23vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #0064B6;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    #ACM .ACM_circle_02::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 9.23vw;
        height: 9.23vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #008C4F;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    /* reel counter */
    #ACM .ACM_reel{
        display: flex;
        justify-content: center;
        align-items: baseline;
    }

    #ACM .ACM_reel_digit{
        height: 12.31vw;
        overflow: hidden;
        position: relative;
    }

    #ACM .ACM_reel_digit::before,
    #ACM .ACM_reel_digit::after{
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        height: 2.31vw;
        z-index: 1;
        pointer-events: none;
    }

    #ACM .ACM_reel_digit::before{
        top: 0;
        background: linear-gradient(to bottom, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_digit::after{
        bottom: 0;
        background: linear-gradient(to top, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_strip{
        transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1);
    }

    #ACM .ACM_reel_strip span{
        display: block;
        height: 10.77vw;
        line-height: 10.77vw;
        font-size: 10.77vw;
        font-weight: 200;
        margin: 0;
    }

    #ACM .ACM_reel_comma{
        line-height: 10.77vw;
        margin-left: -1.15vw;
        opacity: 0;
        transition: opacity 0.4s ease;
    }

    #ACM .ACM_reel_comma.is-visible{
        opacity: 1;
    }

    #ACM .ACM_circle_03::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 9.23vw;
        height: 9.23vw;
        border-radius: 100%;
        content: '';
        display: block;
        background: #DC000C;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

}

@media screen and (min-width:1301px), print{

    @keyframes ripple {
        0% { scale: 1; }
        80% { scale: 1.6; opacity: 0; }
        100% { scale: 1.6; opacity: 0; }
    }

    #ACM .ACM_circle_01::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 120px;
        height: 120px;
        border-radius: 100%;
        content: '';
        display: block;
        background: #0064B6;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    #ACM .ACM_circle_02::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 120px;
        height: 120px;
        border-radius: 100%;
        content: '';
        display: block;
        background: #008C4F;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

    /* reel counter */
    #ACM .ACM_reel{
        display: flex;
        justify-content: center;
        align-items: baseline;
    }

    #ACM .ACM_reel_digit{
        height: 160px;
        overflow: hidden;
        position: relative;
    }

    #ACM .ACM_reel_digit::before,
    #ACM .ACM_reel_digit::after{
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        height: 30px;
        z-index: 1;
        pointer-events: none;
    }

    #ACM .ACM_reel_digit::before{
        top: 0;
        background: linear-gradient(to bottom, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_digit::after{
        bottom: 0;
        background: linear-gradient(to top, #F9F9F5, transparent);
    }

    #ACM .ACM_reel_strip{
        transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1);
    }

    #ACM .ACM_reel_strip span{
        display: block;
        height: 140px;
        line-height: 140px;
        font-size: 140px;
        font-weight: 200;
        margin: 0;
    }

    #ACM .ACM_reel_comma{
        line-height: 140px;
        margin-left: -15px;
        opacity: 0;
        transition: opacity 0.4s ease;
    }

    #ACM .ACM_reel_comma.is-visible{
        opacity: 1;
    }

    #ACM .ACM_circle_03::before{
        position: absolute;
        top: 0;
        left: 0;
        width: 120px;
        height: 120px;
        border-radius: 100%;
        content: '';
        display: block;
        background: #DC000C;
        z-index: -1;
        animation: ripple 2s cubic-bezier(.39, .575, .565, 1) infinite;
        will-change: scale, opacity;
    }

}