@charset "utf-8";
/* ------------------------------------------------------
	アニメーション用CSS
------------------------------------------------------ */

.sa {
	opacity: 0;
	transition: all 1.5s ease;
}

.sa.show {
	opacity: 1;
	transform: none;
}

.sa--lr {
	transform: translate(-70px, 0);
}

.sa--rl {
	transform: translate(70px, 0);
}

.sa--up {
	transform: translate(0, 70px);
}

.sa--down {
	transform: translate(0, -70px);
}

.sa--scaleUp {
	transform: scale(.5);
}

.sa--scaleDown {
	transform: scale(1.5);
}

.sa--rotateL {
	transform: rotate(180deg);
}

.sa--rotateR {
	transform: rotate(-180deg);
}

.sa--blur { filter: blur(10px); }
.sa--blur.show {filter: blur(0);  }

.delay300 { transition-delay: .3s;}
.delay500 { transition-delay: .5s;}
.delay800{ transition-delay: .8s;}
.delay1000{ transition-delay: 1s;}
.delay1100{ transition-delay: 1.1s;}
.delay1400{ transition-delay: 1.4s;}
.delay2500{ transition-delay: 2.5s;}
.delay3000{ transition-delay: 3s;}
.delay3500{ transition-delay: 3.5s;}
.delay4000{ transition-delay: 4s;}
.delay4500{ transition-delay: 4.5s;}
.delay5000{ transition-delay: 5s;}

@media screen and (max-width: 600px) {
	.sa {
		transition: all .8s ease;
	}

.delay500,
.delay1000,
.delay1500,
.delay2000,
.delay2500,
.delay3000,
.delay3500,
.delay4000,
.delay4500,
.delay5000{ transition-delay: 0s;}
}
