@keyframes key1{
  0% {transform: translateY(0px);}
  30% {transform: translateY(0px) scale(1.2,0.8);}
  35% {transform: scale(1,1);}
  50% {transform: translateY(-12px);}
  65% {transform: scale(1,1);}
  70% {transform: translateY(0px) scale(1.2,0.8);}
  100% {transform: translateY(0px);}
}

@keyframes key2{
  0% {transform: translateY(0px);}
  30% {transform: translateY(-12px);}
  100% {transform: translateY(0px);}
}

@keyframes sk-scaleout {
	0% {transform: scale(0);}
	100% {
  	transform: scale(1.0);
    opacity: 0;
  }
}
 



@keyframes menu-top {
	0% {
		-webkit-transform: translateY(0px) rotate(45deg);
		transform: translateY(0px) rotate(45deg);
	}

	50% {
		-webkit-transform: translateY(0px) rotate(0deg);
		transform: translateY(0px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}

}
@keyframes menu-top-open {
	0% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	50% {
		-webkit-transform: translateY(0px) rotate(0deg);
		transform: translateY(0px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(0px) rotate(45deg);
		transform: translateY(0px) rotate(45deg);
	}

}
@keyframes menu-btm {
	0% {
		-webkit-transform: translateY(0px) rotate(-45deg);
		transform: translateY(0px) rotate(-45deg);
	}

	50% {
		-webkit-transform: translateY(0px) rotate(0deg);
		transform: translateY(0px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(3px);
		transform: translateY(3px);
	}

}
@keyframes menu-btm-open {
	0% {
		-webkit-transform: translateY(3px);
		transform: translateY(3px);
	}

	50% {
		-webkit-transform: translateY(0px) rotate(0deg);
		transform: translateY(0px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(0px) rotate(-45deg);
		transform: translateY(0px) rotate(-45deg);
	}
}



/* ローディングアニメーション */

@keyframes breeding-rhombus-spinner-animation-child-1 {
  50% {
    transform: translate(-325%, -325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-2 {
  50% {
    transform: translate(0, -325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-3 {
  50% {
    transform: translate(325%, -325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-4 {
  50% {
    transform: translate(325%, 0);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-5 {
  50% {
    transform: translate(325%, 325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-6 {
  50% {
    transform: translate(0, 325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-7 {
  50% {
    transform: translate(-325%, 325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-8 {
  50% {
    transform: translate(-325%, 0);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-big {
  50% {
    transform: scale(0.5);
  }
}