
/**********カルーセル用**********/
/*フェードイン*/
.crs-fade-in {
    animation-name: crs-fade-in;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
}

@keyframes crs-fade-in {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

/*拡大*/
.crs-expand {
    animation-name: crs-expand;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
}

@keyframes crs-expand {
	0% {
        -ms-transform:scale(0.5,0.5);
        -webkit-transform:scale(0.5,0.5);
        transform:scale(0.5,0.5);
		opacity:0;
	}
	100% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
}

/*上から移動*/
.crs-move-from-above {
    animation-name: crs-move-from-above;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
    
}

@keyframes crs-move-from-above {
    0% {
        -ms-transform:translateY(-60px);
        -webkit-transform:translateY(-60px);
        transform:translateY(-60px);
        opacity:0;
    }
    100% {
        -ms-transform:translateY(0px);
        -webkit-transform:translateY(0px);
        transform:translateY(0px);
        opacity:1;
    }
}

/*下から移動*/
.crs-move-from-bottom {
    animation-name: crs-move-from-bottom;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
    
}

@keyframes crs-move-from-bottom {
    0% {
        -ms-transform:translateY(60px);
        -webkit-transform:translateY(60px);
        transform:translateY(60px);
        opacity:0;
    }
    100% {
        -ms-transform:translateY(0px);
        -webkit-transform:translateY(0px);
        transform:translateY(0px);
        opacity:1;
    }
}

/*左から移動*/
.crs-move-from-left {
    animation-name: crs-move-from-left;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
    
}

@keyframes crs-move-from-left {
    0% {
        -ms-transform:translateX(-30px);
        -webkit-transform:translateX(-30px);
        transform:translateX(-30px);
        opacity:0;
    }
    100% {
        -ms-transform:translateX(0px);
        -webkit-transform:translateX(0px);
        transform:translateX(0px);
        opacity:1;
    }
}

/*右から移動*/
.crs-move-from-right {
    animation-name: crs-move-from-right;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
    
}

@keyframes crs-move-from-right {
    0% {
        -ms-transform:translateX(30px);
        -webkit-transform:translateX(30px);
        transform:translateX(30px);
        opacity:0;
    }
    100% {
        -ms-transform:translateX(0px);
        -webkit-transform:translateX(0px);
        transform:translateX(0px);
        opacity:1;
    }
}

/*挿入ワイプ*/
.crs-wipe-in {
    animation-name: crs-wipe-in;
    animation-delay: ;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
}

@keyframes crs-wipe-in {
	0% {
        -ms-transform:scale(3,3);
        -webkit-transform:scale(3,3);
        transform:scale(3,3);
		opacity:0;
	}
	100% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
}

/*ズームイン*/
.crs-zoom-in {
    animation-name: crs-zoom-in;
    animation-delay: ;
    animation-duration: 15s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

@keyframes crs-zoom-in {
	0% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
	100% {
        -ms-transform:scale(1.2,1.2);
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
		opacity:1;
	}
}

/*ズームイアウト*/
.crs-zoom-out {
    animation-name: crs-zoom-out;
    animation-delay: ;
    animation-duration: 15s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

@keyframes crs-zoom-out {
	0% {
        -ms-transform:scale(1.2,1.2);
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
		opacity:1;
	}
	100% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
}


/**********共通**********/
/*ズームイン*/
.zoom-in {
    animation-name: zoom-in;
    animation-duration: 15s;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

@keyframes zoom-in {
	0% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
	100% {
        -ms-transform:scale(1.2,1.2);
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
		opacity:1;
	}
}

/*ズームイアウト*/
.zoom-out {
    animation-name: zoom-out;
    animation-duration: 15s;
    animation-direction: normal;
    animation-play-state: running;
    animation-timing-function: ease;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

@keyframes zoom-out {
	0% {
        -ms-transform:scale(1.2,1.2);
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
		opacity:1;
	}
	100% {
        -ms-transform:scale(1,1);
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
		opacity:1;
	}
}