.wave-container {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    z-index: -1;
    }

.wave {
    position: absolute;
    bottom: 0;
    width: 200%;
    height: 100%;
}

.wave1 {
    opacity: 0.45; /* 透過強め */
    animation: waveMove1 5s linear infinite; /* 激しく速い */
}

.wave2 {
  opacity: 0.25; /* 奥の波はさらに薄く */
  animation: waveMove2 8s linear infinite; /* 遅めで奥行き */
}

@keyframes waveMove1 {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

@keyframes waveMove2 {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}