/* @charaset "UTF-8"; */

/* Author: FUMIHIKO OKAMURA / Seiren Graphico
/* my design css animation parts library */
/* Author: FUMIHIKO OKAMURA / Seiren Graphico
Author URI: https://seiren-graphico.hutarino.com/studio/
Description: Description
Version: 1.0.0  */

/*--------------------------------------------------------------
>>> my css animations style:
----------------------------------------------------------------*/

/*--------------------------------------------------------------
/* ページ ロードで css animation (セレクタが表示されるタイミングで発火)  */
/*-------------------------------------------------------------- */

/* 映画のタイトルのようなタイトル縮小 */
#scale-ttl {
  display: block;
  animation-iteration-count: 1;
  animation: scale-ttl 3s;
}

@keyframes scale-ttl {
  0% {
    transform: scale(3);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 0.8;
  }
}

/*--------------------------------------------------------------
/* クリックで css animation with jQuery ( event 発火の調整は myfunctions.js を 参照 ) */
/*-------------------------------------------------------------- */

/*--------------------------------------------------------------
/* fade in 系 スクロールで css animation with jQuery 
/*-------------------------------------------------------------- */

.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn .is-show {
  opacity: 1;
}

.fadeUp {
  transform: translate(0, 30px);
  -webkit-transform: translate(0, 30px);
  opacity: 0;
  transition: all 2s;
}

.fadeUp-show {
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  opacity: 1;
}