@charset "utf-8";

@keyframes fedein1 {
	0% {
		opacity: 0;
	}
	30% {
		opacity: 0;
	}
	99% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes popup {
	0% {
		transform: translateY(-20px);
		opacity: 0;
	}
	60% {
		transform: translateY(3px);
		opacity: 1;
	}
	99% {
		transform: translateY(0px);
		opacity: 1;
	}
	100% {
		transform: translateY(0px);
		opacity: 1;
	}
}
@keyframes ups {
	0% {
		transform: translateY(20px);
		opacity: 0;
	}
	99% {
		transform: translateY(0px);
		opacity: 1;
	}
	100% {
		transform: translateY(0px);
		opacity: 1;
	}
}
@keyframes downs {
  0%   { transform: scale(0.8, 1.4) translate(0%, -100%); opacity:0; }
  10%  { transform: scale(0.8, 1.4) translate(0%, -15%); opacity:0; }
  20%  { transform: scale(1.4, 0.6) translate(0%, 30%); opacity:1; }
  30%  { transform: scale(0.9, 1.1) translate(0%, -10%); opacity:1; }
  40%  { transform: scale(0.95, 1.2) translate(0%, -30%); opacity:1; }
  50%  { transform: scale(0.95, 1.2) translate(0%, -10%); opacity:1; }
  60%  { transform: scale(1.1, 0.9) translate(0%, 5%); opacity:1; }
  70%  { transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1; }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1; }
}
@keyframes bounce {
	0% {
		transform: scaleX(0.6) scaleY(0.6) translateY(70%);
		opacity: 0;
	}
	50% {
		transform: scaleX(1) scaleY(1) translateY(-40%);
		opacity: 1;
	}
	60% {
		transform: scaleX(1.05) scaleY(0.95) translateY(-45.0%);
		opacity: 1;
	}
	70% {
		transform: scaleX(0.95) scaleY(1.05) translateY(-20%) rotate(-5deg);
		opacity: 1;
	}
	92% {
		transform: scaleX(1) scaleY(0.9) translateY(-10%) rotate(5deg);
		opacity: 1;
	}
	100% {
		transform: scaleX(1) scaleY(1) translateY(-12.5%);
		opacity: 1;
	}
}
@keyframes bound-loop {
  71% {
    transform: scale(0.98, 0.9) translate(0, 5px);
  }
  76% {
    transform: scale(1.02, 1.0) translate(0, 16px);
  }
  82% {transform: scale(0.98, 1.05) translate(0, -8px);
  }
  89% {
    transform: scale(1.0, 0.9) translate(0, 5px);
  }
  66%,100% {
    transform: scale(1.0, 1.0) translate(0, 0);
  }
}
@keyframes imgeffect {
	0% {
		left: 0%;
		right: 100%;
	}
	50% {
		left: 0%;
		right: 0%;
	}
	100% {
		left: 100%;
		right: 0%;
	}
}
@keyframes imgopacity {
	0% {
		opacity: 0;
	}
	90% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes imgeffect02 {
	0% {
		top: 0%;
		bottom: 100%;
	}
	50% {
		top: 0%;
		bottom: 0%;
	}
	100% {
		top: 100%;
		bottom: 0%;
	}
}
@media screen {

	.popup {
		opacity: 0;
		transform: translateY(-20px)
	}
	.once.popup {
		animation: popup 1.4s forwards;
	}
	.ups {
		opacity: 0;
		transform: translateY(-20px);
	}
	.downs>* {
		opacity:0;
		transform: scale(0.8, 1.4) translate(0%, -100%);
		transform-origin: bottom center;
	}
	.once.downs>* {
		animation: downs 0.6s forwards;
	}
	.once.ups {
		animation: ups 1.8s forwards;
	}
	.once.popups {
		animation: none;
		opacity: 1;
		transform: translateY(0);
	}
	.popups>* {
		opacity: 0;
		transform: translateY(-20px);
	}
	.once.popups>* {
		animation: popup 1.4s forwards;
	}
	.feder,
	.feder_row {
		opacity: 0;
	}
	.once.feder {
		animation: fedein1 1.2s forwards;
	}
	.once.feder_row {
		animation: fedein1 2.0s ease-out forwards;
	}
	.feders>* {
		opacity: 0;
	}
	.once.feders>* {
		animation: fedein1 1.8s forwards;
	}	
	.bounce {
		transform: scaleX(0.6) scaleY(0.6) translateY(70%);
		opacity: 0;
	}
	.bounce.once {
		animation: bounce 0.5s 0.50s forwards;
	}
	.bound-loop{
		animation: bound-loop 3s ease-in-out infinite;
	}
	.once.delay_set>*:nth-child(2),
	.once.delay_1,
	.once.delay_1 > *,
	.animationDelay_1 {
		animation-delay: 0.2s;
	}
	.once.delay_set>*:nth-child(3),
	.once.delay_2,
	.once.delay_2 > *,
	.animationDelay_4 {
		animation-delay: 0.4s;
	}
	.once.delay_set>*:nth-child(4),
	.once.delay_3,
	.once.delay_3 > *,
	.animationDelay_3 {
		animation-delay: 0.6s;
	}
	.once.delay_set>*:nth-child(5),
	.once.delay_4,
	.once.delay_4 > *,
	.animationDelay_4 {
		animation-delay: 0.8s;
	}
	.once.delay_set>*:nth-child(6),
	.once.delay_5,
	.once.delay_5 > *,
	.animationDelay_5 {
		animation-delay: 1.0s;
	}
	.once.delay_set>*:nth-child(7),
	.once.delay_6,
	.once.delay_6 > *,
	.animationDelay_6 {
		animation-delay: 1.2s;
	}
	.once.delay_set>*:nth-child(8),
	.once.delay_7,
	.once.delay_7 > *,
	.animationDelay_7 {
		animation-delay: 1.4s;
	}
	.once.delay_set>*:nth-child(9),
	.once.delay_8,
	.once.delay_8 > *,
	.animationDelay_8 {
		animation-delay: 1.6s;
	}
	.once.delay_set>*:nth-child(10),
	.once.delay_9,
	.once.delay_9 > *,
	.animationDelay_9 {
		animation-delay: 1.8s;
	}
	.once.delay_set>*:nth-child(11),
	.once.delay_10,
	.once.delay_10 > *,
	.animationDelay_10 {
		animation-delay: 2.0s;
	}
	.vertical_open,
	.holizon_open,
	.bg_flash,
	.bg_blackout {
		position: relative;
		overflow: hidden;
	}
	.vertical_open:before,
	.vertical_open:after,
	.holizon_open:before,
	.holizon_open:after,
	.bg_blackout:before {
		content: "";
		width: 100%;
		height: 100%;
		z-index: 8;
		background: #fff;
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		transition: height .2s;
	}
	.vertical_open:after {
		top: auto;
		bottom: 0;
	}
	.vertical_open.once:before,
	.vertical_open.once:after {
		height: 0;
	}
	.holizon_open:before,
	.holizon_open:after {
		bottom: 0;
		right: 0;
		left: auto;
		transition: width .4s .2s ease-out;
	}
	.holizon_open:after {
		left: 0;
		right: auto;
	}
	.holizon_open.once:before,
	.holizon_open.once:after {
		width: 0;
	}
	.slide_in,
	.slide_down {
		position: relative;
	}
	.slide_in > *,
	.slide_down > * {
		opacity: 0;
	}
	.slide_in.once > *,
	.slide_down.once > * {
		animation-duration: 0s;
		animation-delay: 0.6s;
		animation-iteration-count: 1;
		animation-fill-mode: forwards;
	}
	.slide_in::before,
	.slide_down::before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0%;
		right: 100%;
		z-index: 100;
		height: 100%;
		background-color: #f63e3e;
	}
	.slide_down::before{
		top: 0;
		bottom: 100%;
		left: 0;
		right: 0;
		height: auto;
		width: 100%;
	}
	.slide_in.once::before,
	.slide_down.once::before {
		animation-duration: 1.2s;
		animation-timing-function: cubic-bezier(0.78, 0.07, 0, 1);
		animation-iteration-count: 1;
		animation-fill-mode: forwards;
	}
	.slide_in.once > *,
	.slide_down.once > * {
		animation-name: imgopacity;
	}
	.slide_in.once:before {
		animation-name: imgeffect;
	}
	.slide_down.once:before {
		animation-name: imgeffect02;
	}
}