@import url(./common/_variable.css);

/* Meals */
/* ============================================ */

#supplier {
  padding: 5.2vw 0 0;
}

.area__supplier {
  padding: 5.2vw 10.416vw;
  background-image: url(../images/common/bg_dark.jpg);
  @media (width < 896px) {
    padding: 40px 20px;
  }
}

.hd_supplier {
  font-size: clamp(2.0rem,1.666vw,3.2rem);
  line-height: 1.4em;
  text-align: center;
}

.txt_supplier {
  text-align: center;
  line-height: 2.5em;
  letter-spacing: 0.1em;
  padding: 2vw 0 0;
  @media (width < 480px) {
    padding: 20px 0 0;
  }
}

.area__supplier--column {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 4.166vw;
  padding: 4.166vw 0 0;
  @media (width < 480px) {
    grid-template-columns: repeat(1,1fr);
    gap: 30px;
  }
}

.hd_material {
  font-size: clamp(1.8rem,1.458vw,2.8rem);
  line-height: 1.2em;
  padding: 0.8vw 0;
  border-bottom: var(--point_c) dotted 1px;
  @media (width < 896px) {
    padding: 10px 0;
  }
}

.txt_material {
  padding: 0.8vw 0 0;
  text-align: justify;
  line-height: 2em;
  font-size: 1.4rem;
  @media (width < 896px) {
    padding: 10px 0 0;
  }
}

.hd_meals {
  font-size: clamp(1.8rem,1.458vw,2.8rem);
  line-height: 1.2em;
  padding: 0 0 0.8vw;
  border-bottom: var(--point_c) dotted 1px;
  @media (width < 896px) {
    padding: 0 0 10px;
  }
}

.txt_meals {
  padding: 0.8vw 0 0;
  font-size: 1.4rem;
  line-height: 2em;
  word-break: keep-all;
  @media (width < 896px) {
    padding: 10px 0 0;
  }
}

#dining {
  padding: 0 0 5.208vw 0;
  @media (width < 480px) {
    padding:0 0 40px 0;
  }
}

.area__dining {
  background-image: url(../images/common/bg_dark.jpg);
  padding: 5.208vw 20px;
}

.area__dining--column {
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 32%;
  gap: 3.125vw;
  @media (width < 480px) {
    grid-template-columns: 1fr;
  }
}

.txt_dining {
  .txt_material {
    word-break: keep-all;
    text-align: left;
    @media (width < 896px) {
      word-break: break-all;
    }
  }
}

.img_dining {
}