/*========================================================================
   cuisine layout
========================================================================*/
#cuisine #mainVisual {
  background: url(../img/cuisine/mainimg.jpg) no-repeat center/cover;
}
#cuisine .slide_wrap {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

#lead {
  position: relative;
  margin-top: 40px;
  margin-bottom: 3em;
}
#lead::before {
  content: "";
  display: block;
  width: 100%;
  height: 40px;
  background: url(../img/bar_gara.png);
  position: absolute;
  top: -40px;
  z-index: 1;
}
#lead .layout {
  max-width: 1000px;
}
#lead .layout .txtArea {
  text-align: center;
}
#lead .layout .txtArea .txt {
  font-size: 1.12em;
}

#course {
  background: url(../img/bg02.png);
}
#course .lead {
  text-align: center;
}
#course .cont > *:not(:last-child) {
  margin-bottom: 1.3em;
}
#course .cont .imgArea {
  text-align: center;
}

.about {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.about .imgArea {
  margin-bottom: 1.3em;
}
.about .txtArea {
  text-align: initial;
}
@media screen and (min-width: 768px) {
  .about .imgArea {
    width: min(40%, 300px);
    margin-right: 4%;
  }
  .about .txtArea {
    width: 56%;
  }
}

#hamo .inner, #fugu .inner, #osusume .inner, #breakfast .inner {
  text-align: center;
}
#hamo .inner > *:not(:last-child), #fugu .inner > *:not(:last-child), #osusume .inner > *:not(:last-child), #breakfast .inner > *:not(:last-child) {
  margin-bottom: 1.3em;
}

#fugu, #breakfast {
  background: url(../img/bg02.png);
}

#osusume .img_lay {
  max-width: 750px;
  margin: 0 auto;
}
#osusume .img_lay > *:not(:last-child) {
  margin-bottom: 2%;
}
#osusume .img_lay .flex {
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}
#osusume .img_lay .flex .img {
  width: calc((100% / 2) - 1%);
}
@media screen and (min-width: 768px) {
  #osusume .img_lay {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
  #osusume .img_lay .img01 {
    width: min(66.6%, 750px);
    margin-bottom: 0;
  }
  #osusume .img_lay .flex {
    width: min(31.3%, 360px);
    margin-bottom: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  #osusume .img_lay .flex .img {
    width: 100%;
  }
}
