/* 浮動動畫 */
@keyframes floatUpDown {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-18px); } /* 上飄距離可調 */
  100% { transform: translateY(0); }
}

@media(max-width:768px){

        /* 浮動動畫 */
    @keyframes floatUpDown {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-2vw); } /* 上飄距離可調 */
    100% { transform: translateY(0); }
    }

}



/* 浮出 */
@keyframes floatIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.5);

  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);

  }
}

/* 套在任何元素上 */
.float-in {
  opacity: 0; /* 初始不可見 */
  animation: floatIn 600ms ease-in forwards;
  will-change: transform, opacity, filter;
}


/* 燈籠 */


@keyframes lanternEnter {
  from { opacity: 0; transform: translateY(-160px); }
  to   { opacity: 1; transform: translateX(0); }
}


/* 雲朵 */

@keyframes cloudEnterL {
  from { opacity: 0; transform: translateX(-160px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes cloudEnterR {
  from { opacity: 0; transform: translateX(160px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes cloudFloat {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(0, -10px); }
  100% { transform: translate(0, 0); }
}




@keyframes rotate {
  from { transform: rotate(0deg);}
  to   { transform: rotate(360deg);}
}
