@charset "utf-8";

.key-visual-robot {
	z-index: 0;
}

.key-visual-robot-hand-before {
	animation: robotHandLeft infinite 4s steps(1);
}

.key-visual-robot-hand-after {
	opacity: 0;
	animation: robotHandRight infinite 4s steps(1);
}

@keyframes robotHandLeft {
	0%, 25% { opacity: 1; }
	25%, 100% { opacity: 0; }
}

@keyframes robotHandRight {
	0%, 25% { opacity: 0; }
	25%, 100% { opacity: 1; }
}

.key-visual-robot-left-eye {
	opacity: 0;
	animation: robotFlash infinite 4s steps(1);
}

.key-visual-robot-right-eye {
	opacity: 0;
	animation: robotFlash infinite 4s 0.4s steps(1);
}

@keyframes robotFlash {
	0%, 35% { opacity: 0; }
	35%, 45% { opacity: 1; }
	45%, 55% { opacity: 0; }
	55%, 65% { opacity: 1; }
	65%, 100% { opacity: 0; }
}
