/* @group アニメーション */
 /* 画像のスタイル */
     .zoom-in {
       width: 100%;
       //max-width: 500px;
       height: auto;
       animation: zoomIn 0.5s ease-out forwards; /* ズームインのアニメーション */
     }
 
     /* ズームインのアニメーション定義 */
     @keyframes zoomIn {
       0% {
         transform: scale(0.01); /* 初期状態は通常サイズ */
       }
       100% {
         transform: scale(1.0); /* 1.2倍にズームイン */
       }
     }
     
     .zoom-img {
            width: 300px; /* 初期サイズ */
            opacity: 0; /* 最初は透明 */
            transform: scale(0.5); /* 最初は小さい */
            animation: fade-zoom 2s ease-in-out 1s forwards;
        }

        @keyframes fade-zoom {
            from {
                opacity: 0;
                transform: scale(0.5);
            }
            to {
                opacity: 1;
                transform: scale(1);
            }
        }
     
     
 /* @end */