@charset "utf-8";
.menu-hero-dog{
    background-image: url(../images/menu-hero-dog.jpg);
}

*, *:before, *:after {
    box-sizing: border-box;
}
.col_5{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.col_5 > *{
    width: calc( 20% - 20px );
    margin-right: 25px;
    margin-bottom: 25px;
}
.col_5 > *:nth-child(5n){
    margin-right: auto;
}
@media screen and (max-width: 960px) {
    .col_5 > *{
        width: calc( 25% - 9px );
        margin-right: 12px;
        margin-bottom: 12px;
    }
    .col_5 > *:nth-child(5n){
        margin-right: 12px;
    }
    .col_5 > *:nth-child(4n){
        margin-right: auto;
    }
}
@media screen and (max-width: 580px) {
    .col_5 > *{
        width: calc( 33.33333% - 8px ) ;
    }
    .col_5 > *:nth-child(5n){
        margin-right: 12px;
    }
    .col_5 > *:nth-child(4n){
        margin-right: 12px;
    }
    .col_5 > *:nth-child(3n){
        margin-right: auto;
    }
}

.fuwafuwa {
    animation: fuwafuwa 3s ease-in-out infinite alternate;
    background: url(../images/hone.jpg) no-repeat center center / 60px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 70px;
    height: 70px;
    margin-top: 15px;
    margin-left:90px;
  }
   
  @keyframes fuwafuwa {
    0% {
      transform:translate(0, 0) rotate(-7deg);
    }
    50% {
      transform:translate(0, -7px) rotate(0deg);
    }
    100% {
      transform:translate(0, 0) rotate(7deg);
    }
  }
  
  .fuwafuwa2 {
    animation: fuwafuwa2 3s ease-in-out infinite alternate;
    background: url(../images/hone2.jpg) no-repeat center center / 60px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 70px;
    height: 70px;
    margin-top: 15px;
    margin-left:190px;
  }
   
  @keyframes fuwafuwa2 {
    0% {
      transform:translate(0, 0) rotate(-7deg);
    }
    50% {
      transform:translate(0, -7px) rotate(0deg);
    }
    100% {
      transform:translate(0, 0) rotate(7deg);
    }
  }

  .fuwafuwa3 {
    animation: fuwafuwa3 3s ease-in-out infinite alternate;
    background: url(../images/hone3.jpg) no-repeat center center / 60px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 70px;
    height: 70px;
    margin-top: 15px;
    margin-left:200px;
  }
   
  @keyframes fuwafuwa3 {
    0% {
      transform:translate(0, 0) rotate(-7deg);
    }
    50% {
      transform:translate(0, -7px) rotate(0deg);
    }
    100% {
      transform:translate(0, 0) rotate(7deg);
    }
  }

  .fuwafuwa4 {
    animation: fuwafuwa4 3s ease-in-out infinite alternate;
    background: url(../images/hone4.jpg) no-repeat center center / 60px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 70px;
    height: 70px;
    margin-top: 15px;
    margin-left:200px;
  }
   
  @keyframes fuwafuwa4 {
    0% {
      transform:translate(0, 0) rotate(-7deg);
    }
    50% {
      transform:translate(0, -7px) rotate(0deg);
    }
    100% {
      transform:translate(0, 0) rotate(7deg);
    }
  }

  .fuwafuwa5 {
    animation: fuwafuwa5 3s ease-in-out infinite alternate;
    background: url(../images/hone5.jpg) no-repeat center center / 60px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 70px;
    height: 70px;
    margin-top: 15px;
    margin-left:200px;
  }
   
  @keyframes fuwafuwa5 {
    0% {
      transform:translate(0, 0) rotate(-7deg);
    }
    50% {
      transform:translate(0, -7px) rotate(0deg);
    }
    100% {
      transform:translate(0, 0) rotate(7deg);
    }
  }

  .text__bound {
    animation: key .3s ease infinite alternate;
    margin-left:150px;
  }
  @keyframes key {
    0% {transform: translateY(0px);}
    100% {transform: translateY(-10px);}
  }