@charset "UTF-8"; 
@keyframes cf-carousel01 {
	0% {
        transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
	}
	100% {
        transform: translate3d(-100%,0,0);
        -webkit-transform: translate3d(-100%,0,0);

	}
}

@keyframes cf-carousel02 {
	0% {
        transform: translate3d(-100%,0,0);
        -webkit-transform: translate3d(-100%,0,0);
	}
	100% {
        transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
	}
}

.contentfooter-carousel {
	width: 100%;
	overflow: hidden;
    position: relative;
    z-index: 5;
}

.contentfooter-carousel__inner {
    width: 100vw;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    overflow: hidden;
}


.contentfooter-carousel__inner li,
.contentfooter-carousel__inner img {
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    overflow: hidden;
}

.bg01 .contentfooter-carousel__inner .fir {
    animation: cf-carousel01 30s linear -60s infinite;
    
}

.bg01 .contentfooter-carousel__inner .sec {
    animation: cf-carousel01 30s linear infinite;
}

.bg02 .contentfooter-carousel__inner .fir {
    display: block;
    animation: cf-carousel02 30s linear infinite;
}

.bg02 .contentfooter-carousel__inner .sec {
    display: block;
    animation: cf-carousel02 30s linear -60s infinite;
}

.bg03 .contentfooter-carousel__inner .fir {
    animation: cf-carousel01 30s linear -60s infinite;
}

.bg03 .contentfooter-carousel__inner .sec {
    animation: cf-carousel01 30s linear infinite;
}

.bg04 .contentfooter-carousel__inner .fir {
    display: block;
    animation: cf-carousel02 30s linear infinite;
}

.bg04 .contentfooter-carousel__inner .sec {
    display: block;
    animation: cf-carousel02 30s linear -60s infinite;
}


.contentfooter-carousel li {
    flex: 0 0 2020px;
    width: 1320px;
    overflow: hidden;
    line-height: 0;
    font-size: 0;
}

@media all and (min-width: 765px) {
    .contentfooter-carousel {
    }

    .contentfooter-carousel li {
        flex: 0 0 2640px;
        width: 2640px;
        overflow: hidden;
    }
    

    .contentfooter-carousel__inner {
        width: 100vw;
    }
    .bg04 {
        display: none;
    }
}