.header_logo:before{
  content:'';
  display: inline-block;
  width: 33px;
  height:33px;
  margin-right:8px;
  background-image: url(../image/logo.png);
  background-size:contain;
}

.mobile-logo:before{
  content:'';
  display: inline-block;
  width: 20px;
  height:20px;
  margin-right:2px;
  background-image: url(../image/logo.png);
  background-size:contain;
}

.footer_logo:before{
  content:'';
  display: inline-block;
  width: 26px;
  height:26px;
  margin-right:2px;
  background-image: url(../image/logo.png);
  background-size:contain;
}

/* .header{
  background-image: url(../image/nami.png);
  background-size:cover;
} */

.parallax > use {
  animation: wave 25s cubic-bezier(.55,.5,.45,.5) infinite;
}
.parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}
.parallax > use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}
.parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}
.parallax > use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}
@keyframes wave {
  0% {
    transform: translate3d(-90px,0,0);
  }
  100% { 
    transform: translate3d(85px,0,0);
  }
}
.header{
  position:relative;
  overflow: hidden;
}
.waves{
  position:absolute;
  top:0;
  z-index: -1;
  width:100%;
  height:30px;
  
}
body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
.section{
  flex:1;
}
.modal-button,.modal-background{
  cursor: pointer;
}