@charset "utf-8";
 /************************************
  css animation
************************************/
@keyframes titline {
  0% {
    opacity:0;
    transform:scale(0, 1);
  }
  100% {
    opacity:1;
    transform:scale(1, 1);
  }
}
@keyframes titlinefade {
  0% {
    opacity:1;
    transform:scale(1, 1);
  }
  100% {
    opacity:0;
    transform:scale(0, 1);
  }
}
@keyframes lineup {
	0% {
		opacity:0;
		transform:translate(0, 1em);
	}
	100% {
		opacity:1;
		transform:translate(0,0);
	}
}
@keyframes lineupfade {
	0% {
		opacity:1;
		transform:translate(0, 0);
	}
	100% {
		opacity:0;
		transform:translate(0, -2rem);
	}
}
@keyframes linedwn {
	0% {
		opacity:0;
		transform:translate(0, -2rem);
	}
	100% {
		opacity:1;
		transform:translate(0, 0);
	}
	}
@keyframes linedwnfade {
	0% {
		opacity:1;
		transform:translate(0, 0);
	}
	100% {
		opacity:0;
		transform:translate(0, 2rem);
	}
}
@keyframes linelt {
	0% {
	opacity:0;
	transform:translate(2rem, 0);
	}
	100% {
	opacity:1;
	transform:translate(0, 0);
	}
}
@keyframes linert {
	0% {
	opacity:0;
	transform:translate(-2rem, 0);
	}
	100% {
	opacity:1;
	transform:translate(0, 0);
	}
}

@keyframes boundbox {
  0% {
    opacity:0;
    transform:scale(1.2);
  }
  60% {
    opacity:1;
    transform:scale(.9);
  }
  100% {
    opacity:1;
    transform:scale(1);
  }
}
@keyframes sbtitrdbrd {
  0% {
    opacity:0;
    transform:scale(1, 0);
  }
  100% {
    opacity:1;
    transform:scale(1, 1);
  }
}
@keyframes nmlfade {
  0% {
    opacity:1;
  }
  100% {
    opacity:0;
  }
}
@keyframes nmlfadeout {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@keyframes floatAnime {
  0% {
    transform: translateX(-50%) translateY(-50%);
  }
  50% {
    transform: translateX(-50%) translateY(calc(-50% - 12px)); /* 上に15px移動 */
  }
  100% {
    transform: translateX(-50%) translateY(-50%);
  }
}
@keyframes rotateAnime {
  0% {
    transform: rotate(0);
  }
  80% {
    transform: rotate(0);
  }
  85% {
    transform: rotate(5deg);
  }
  90% {
    transform: rotate(0);
  }
  95% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0);
  }
}
@keyframes revealUp {
  0% {
		opacity: 0;
    clip-path: inset(100% 0 0 0);
  }
  100% {
		opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}