/* =========================================
   フローティングバナーのスタイル
   ========================================= */
.ai-chat {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
    width: 140px;
    height: 140px;

  transition:
    width 0.4s cubic-bezier(0.25, 1, 0.5, 1),
    height 0.4s cubic-bezier(0.25, 1, 0.5, 1);

}
.ai-chat__img01 {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    opacity: 0.8;
}
.ai-chat__rotate {
  display: inline-block; /* 回転が綺麗に見えるようにインラインブロックなどに設定 */
  /* アニメーションの設定 */
  animation: spin 30s linear infinite;
  position: relative;
  z-index: 10;

}

@media (max-width: 480px) {
.ai-chat {
  position: fixed;
  bottom: 85px;
  right: 15px;
  z-index: 9999;
    width: 90px;
    height: 90px;

  transition:
    width 0.4s cubic-bezier(0.25, 1, 0.5, 1),
    height 0.4s cubic-bezier(0.25, 1, 0.5, 1);

}
.ai-chat__img01 {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 64px;
    opacity: 0.8;
}

}

/* アニメーションの動きを定義 */
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}