/*---------------------------------
  waveCanvas
---------------------------------*/
.wave{
position:relative;
height:100px;/*何も表示されない場合は各波の親要素に高さを持たせましょう。*/
background:rgba(255, 255, 255, .8);/*背景を塗りつぶして重ねた波を表現したい場合は、波を描画する親要素に波と同じ背景色を設定しましょう。*/
}
.wave2{
position:relative;
height:100px;/*何も表示されない場合は各波の親要素に高さを持たせましょう。*/
background:rgba(255, 255, 255, .8);/*背景を塗りつぶして重ねた波を表現したい場合は、波を描画する親要素に波と同じ背景色を設定しましょう。*/
}
canvas{
position: absolute;
bottom: 0;
left:0;
width: 100%;
}

@media screen and (max-width: 768px){
    .wave{
        top: -5px;
        margin: 0 0 -5px;
    }
}