body {
           margin: 0;
           padding: 0;
           font-family: 'Noto Sans JP', sans-serif;
           display: flex;
           justify-content: center;
           align-items: center;
           height: 100vh;
           background: linear-gradient(135deg, #6e8efb, #a777e3);
           color: #fff;
       }
       
       .welcome-container {
           text-align: center;
           animation: fadeIn 2s ease-in-out;
       }

       h1 {
           font-size: 3rem;
           margin-bottom: 1rem;
       }

       p {
           font-size: 1.2rem;
           margin-bottom: 2rem;
       }

       .button-container {
           display: flex;
           justify-content: center;
           gap: 1.5rem;
       }

       .button {
           background: #fff;
           color: #6e8efb;
           padding: 0.8rem 2rem;
           border: none;
           border-radius: 5px;
           font-size: 1rem;
           font-weight: bold;
           cursor: pointer;
           transition: transform 0.3s, background 0.3s;
       }

       .button:hover {
           background: #a777e3;
           color: #fff;
           transform: scale(1.1);
       }

       @keyframes fadeIn {
           from {
               opacity: 0;
               transform: scale(0.9);
           }
           to {
               opacity: 1;
               transform: scale(1);
           }
       }

       @keyframes bounce {
           0%, 20%, 50%, 80%, 100% {
               transform: translateY(0);
           }
           40% {
               transform: translateY(-15px);
           }
           60% {
               transform: translateY(-10px);
           }
       }

       .animation {
           animation: bounce 2s infinite;
       }