@charset "UTF-8";

/* -----------------------------------------------
* ふわっとあがる
------------------------------------------------ */


  .flex{
    display:flex;
    flex-wrap: wrap;
  }
  

  /*==================================================
  スタート時は要素自体を透過0にするためのopacity:0;
  ===================================*/
  
  .box{
    opacity: 0;
  }
  
  /*==================================================
  ふわっ
  ===================================*/
  
  .fadeUp {
  animation-name:fadeUpAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
  opacity: 0;
  }
  
  @keyframes fadeUpAnime{
    from {
      opacity: 0;
    transform: translateY(120px);
    }
  
    to {
      opacity: 1;
    transform: translateY(0);
    }
  }

  /*==================================================
ボンッ
===================================*/

/* 拡大 */
.zoomIn{
    animation-name:zoomInAnime;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
  }
  
  @keyframes zoomInAnime{
    from {
    transform: scale(0.45);
    }
  
    to {
        transform: scale(1);
    }
  }