@charset "UTF-8";
/**
 * 例）画面幅が768、font-sizeの最小値を1.4rem、画面幅が768の時に16px、最大値を1.8remにしたい場合。
 * font-size: clamp-vw(14, 16, 18, 768);
 * // 出力結果
 * font-size: clamp(1.4rem, 2.0833333333vw, 1.8rem);
 */
/**
 * 例）2列ずつ、要素同士の間は0.6rem表示したい場合
 * width: list-width(3, 0.6rem)
 * // 出力結果
 * width: calc(50% - 0.3rem)
 */
.o-visual::after {
  aspect-ratio: 467.1533 / 94.9976;
  object-fit: cover;
  background: #fff;
  mask: url("../images/ngt/gastronomy/visual-title.svg?1") no-repeat center center/contain;
  -webkit-mask: url("../images/ngt/gastronomy/visual-title.svg?1") no-repeat center center/contain;
  width: 64.10256%;
}
.o-visual::after > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-visual::after {
    width: 34.34951%;
  }
}

.o-nav__list {
  justify-content: flex-start;
}
@media (min-width: 992px) {
  .o-nav__list {
    justify-content: center;
  }
}
.o-nav__list-item {
  width: calc(100% - 0rem);
}
@media (min-width: 768px) {
  .o-nav__list-item {
    width: calc(33.33333% - 1.33333rem);
  }
}
@media (min-width: 992px) {
  .o-nav__list-item {
    width: calc(25% - 1.5rem);
  }
}

.o-hero {
  position: relative;
  margin-bottom: -7rem;
}
.o-hero__image {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}
.o-hero__image > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-hero__image {
    aspect-ratio: 1360 / 500;
    object-fit: cover;
  }
  .o-hero__image > img {
    object-fit: cover;
  }
}
.o-hero__title {
  font-family: "kozuka-gothic-pr6n", sans-serif;
  display: inline;
  padding: clamp(1rem, 1.10294vw, 1.5rem) clamp(1.46667rem, 1.61765vw, 2.2rem) clamp(1.33333rem, 1.47059vw, 2rem) clamp(1.46667rem, 1.61765vw, 2.2rem);
  margin: 0;
  font-size: clamp(2.025rem, 1.98529vw, 2.7rem);
  line-height: clamp(5.712rem, 5.6vw, 7.616rem);
  color: #fff;
  background: rgba(0, 107, 152, 0.8);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.o-hero__title--wrap {
  position: absolute;
  top: clamp(2.66667rem, 2.94118vw, 4rem);
}
@media (min-width: 768px) {
  .o-hero__title--wrap {
    left: clamp(7.8rem, 8.60294vw, 11.7rem);
  }
}
.o-hero__box {
  padding: clamp(3.2rem, 3.52941vw, 4.8rem);
  background: rgba(255, 255, 255, 0.9);
  transform: translateY(-7rem);
}
.o-section .o-hero__box {
  background: #fff;
}
.o-hero__box__title {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  font-size: clamp(2.1rem, 2.05882vw, 2.8rem);
}
.o-hero__box__description {
  margin: 0;
}

.o-section__title {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  font-size: clamp(2.475rem, 2.42647vw, 3.3rem);
  font-weight: 600;
}
.o-section__list {
  display: flex;
  gap: 4rem;
}
.o-section__list-item {
  position: relative;
  width: calc(50% - 2rem);
}
.o-section__list-item[data-label]::before {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  aspect-ratio: 160 / 50;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: clamp(10.66667rem, 11.76471vw, 16rem);
  content: attr(data-label);
  font-size: clamp(1.5rem, 1.47059vw, 2rem);
  color: #fff;
  background: #d92d1b;
}
.o-section__list-item[data-label]::before > img {
  object-fit: cover;
}
.o-section__list-item__image {
  aspect-ratio: 480 / 340;
  object-fit: cover;
  width: 100%;
}
.o-section__list-item__image > img {
  object-fit: cover;
}
.o-section__list-item__title {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  font-size: clamp(1.5rem, 1.47059vw, 2rem);
  font-weight: 600;
  margin: 0;
}
.o-section__list-item__title small {
  margin-left: clamp(1.6rem, 1.76471vw, 2.4rem);
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
  color: #191914;
}
.o-section__list-item__description {
  margin: 0;
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
  font-weight: 500;
}
.o-section__list hr {
  border-color: #191914;
}
.o-section__list--overlap {
  flex-direction: column;
  gap: clamp(4rem, 4.41176vw, 6rem);
}
.o-section__list--overlap .o-section__list-item {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  justify-content: flex-end;
  width: 100%;
}
@media (min-width: 768px) {
  .o-section__list--overlap .o-section__list-item:nth-child(even) {
    flex-direction: row-reverse;
  }
  .o-section__list--overlap .o-section__list-item:nth-child(even) .o-section__list-item__box {
    right: 0;
    left: unset;
  }
}
.o-section__list--overlap .o-section__list-item__image {
  aspect-ratio: 3 / 2;
  object-fit: cover;
  width: 100%;
}
.o-section__list--overlap .o-section__list-item__image > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-section__list--overlap .o-section__list-item__image {
    aspect-ratio: 2 / 1;
    object-fit: cover;
    width: 72%;
  }
  .o-section__list--overlap .o-section__list-item__image > img {
    object-fit: cover;
  }
}
.o-section__list--overlap .o-section__list-item__box {
  position: relative;
  width: 100%;
  padding: clamp(3.06667rem, 3.38235vw, 4.6rem) clamp(2.53333rem, 2.79412vw, 3.8rem);
  background: rgba(255, 255, 255, 0.8);
}
@media (min-width: 768px) {
  .o-section__list--overlap .o-section__list-item__box {
    position: absolute;
    top: 50%;
    left: 0;
    width: 53%;
    transform: translateY(-50%);
  }
}
.o-section__list--overlap .o-section__list-item__box::before {
  aspect-ratio: 106 / 97;
  object-fit: cover;
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(7.06667rem, 7.79412vw, 10.6rem);
  content: attr(data-content);
  background: var(--color);
  font-size: clamp(4.35rem, 4.26471vw, 5.8rem);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.8);
  transform: translate(-1.5rem, -1.5rem);
}
.o-section__list--overlap .o-section__list-item__box::before > img {
  object-fit: cover;
}
.o-section__list--overlap .o-section__list-item__title {
  padding-left: 3rem;
  font-size: clamp(1.8rem, 1.76471vw, 2.4rem);
}
@media (min-width: 768px) {
  .o-section__list--overlap .o-section__list-item__title {
    padding-left: 0;
  }
}
.o-section__list--overlap .o-section__list-item__title.underline {
  padding-left: 0;
  display: inline-block;
  padding-bottom: clamp(0.73333rem, 0.80882vw, 1.1rem);
  border-bottom: 0.1rem solid #d92d1b;
}
.o-section__list--thumbnail {
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 3rem;
}
@media (min-width: 992px) {
  .o-section__list--thumbnail {
    justify-content: center;
  }
}
.o-section__list--thumbnail .o-section__list-item {
  width: calc(100% - 0rem);
}
@media (min-width: 768px) {
  .o-section__list--thumbnail .o-section__list-item {
    width: calc(33.33333% - 2rem);
  }
}
@media (min-width: 992px) {
  .o-section__list--thumbnail .o-section__list-item {
    width: calc(25% - 2.25rem);
  }
}
.o-section__list--thumbnail .o-section__list-item__image {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  width: 100%;
}
.o-section__list--thumbnail .o-section__list-item__image > img {
  object-fit: cover;
}
.o-section__list--thumbnail .o-section__list-item__anchor {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  position: relative;
  padding: clamp(0.53333rem, 0.58824vw, 0.8rem) clamp(2.13333rem, 2.35294vw, 3.2rem) clamp(0.53333rem, 0.58824vw, 0.8rem) clamp(0.53333rem, 0.58824vw, 0.8rem);
  font-size: clamp(1.2rem, 1.17647vw, 1.6rem);
  font-weight: 600;
  border: 0.1rem solid #191914;
  border-radius: 0.3rem;
}
.o-section__list--thumbnail .o-section__list-item__anchor::after {
  background: #191914;
  mask: url("../images/business/icon-arrow-right.svg?1") no-repeat center center/contain;
  -webkit-mask: url("../images/business/icon-arrow-right.svg?1") no-repeat center center/contain;
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: clamp(1.06667rem, 1.17647vw, 1.6rem);
  height: clamp(1.06667rem, 1.17647vw, 1.6rem);
  content: '';
  transform: translate(-100%, -50%);
}
.o-section__list--thumbnail .o-section__list-item__title {
  padding: clamp(0.8rem, 0.88235vw, 1.2rem) 0;
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
  font-weight: 600;
  text-align: center;
  color: var(--area-text-color);
  background: var(--area-bg-color);
  border: 1px solid var(--area-border-color);
  border-radius: 0.3rem;
}
.o-section__list--thumbnail .o-section__list-item__description {
  font-size: clamp(1.2rem, 1.17647vw, 1.6rem);
  font-weight: 500;
}
.o-section__list--card {
  flex-direction: column;
  gap: clamp(3.33333rem, 3.67647vw, 5rem);
}
.o-section__list--card .o-section__list-item {
  display: flex;
  flex-direction: column;
  gap: clamp(2.66667rem, 2.94118vw, 4rem);
  width: 100%;
}
@media (min-width: 768px) {
  .o-section__list--card .o-section__list-item {
    flex-direction: row;
  }
}
.o-section__list--card .o-section__list-item + .o-section__list-item {
  padding-top: clamp(3.33333rem, 3.67647vw, 5rem);
  border-top: 0.1rem solid #191914;
}
.o-section__list--card .o-section__list-item__image {
  aspect-ratio: 400 / 290;
  object-fit: cover;
  width: 100%;
}
.o-section__list--card .o-section__list-item__image > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-section__list--card .o-section__list-item__image {
    max-width: clamp(26.66667rem, 29.41176vw, 40rem);
  }
}
.o-section__list--card .o-section__list-item__title {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding-bottom: clamp(0.53333rem, 0.58824vw, 0.8rem);
  font-size: clamp(1.575rem, 1.54412vw, 2.1rem);
  border-bottom: 0.1rem solid #d92d1b;
}
@media (min-width: 768px) {
  .o-section__list--card .o-section__list-item__title {
    flex: unset;
  }
}
.o-section__list--card .o-section__list-item__title--wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.o-section__list--card .o-section__list-item__title small {
  margin: 0 0 1rem 0;
  font-size: clamp(1.05rem, 1.02941vw, 1.4rem);
}
.o-section__list--card .o-section__list-item__description {
  font-size: clamp(1.05rem, 1.02941vw, 1.4rem);
}
.o-section__list--card .o-section__list-item__box {
  padding: clamp(1.06667rem, 1.17647vw, 1.6rem) clamp(2.4rem, 2.64706vw, 3.6rem);
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
  background: #fff;
}
.o-section__list--card .o-section__list-item__anchor {
  padding: 1rem 4rem 1rem 1rem;
}
.o-section__box {
  display: flex;
  flex-direction: column;
  gap: clamp(2.2rem, 2.42647vw, 3.3rem);
  padding: clamp(2.4rem, 2.64706vw, 3.6rem);
  background: rgba(255, 255, 255, 0.8);
}
@media (min-width: 768px) {
  .o-section__box {
    flex-direction: row;
  }
}
.o-section__box__image {
  aspect-ratio: 276.5991 / 188;
  object-fit: cover;
  width: 100%;
}
.o-section__box__image > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-section__box__image {
    max-width: clamp(18.43994rem, 20.33817vw, 27.65991rem);
  }
}
.o-section__box__title {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  margin: 0;
  padding-bottom: clamp(1.33333rem, 1.47059vw, 2rem);
  font-size: clamp(1.8rem, 1.76471vw, 2.4rem);
  border-bottom: 0.1rem solid #191914;
}
.o-section__box__description {
  margin: 0;
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
}
.o-section__inner {
  padding: clamp(2.4rem, 2.64706vw, 3.6rem);
  background: #fff;
}
.o-section__hero {
  position: relative;
  text-align: center;
}
.o-section__hero::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  background: rgba(25, 25, 20, 0.7);
}
.o-section__hero__image {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}
.o-section__hero__image > img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .o-section__hero__image {
    aspect-ratio: 1000 / 296;
    object-fit: cover;
  }
  .o-section__hero__image > img {
    object-fit: cover;
  }
}
.o-section__hero__box {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1rem;
  transform: translate(-50%, -50%);
}
.o-section__hero__title {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  margin: 0;
  font-size: clamp(1.8rem, 1.76471vw, 2.4rem);
  font-weight: 600;
  color: #fff;
}
.o-section__hero__title-sub {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  margin: 0;
  font-size: clamp(1.5rem, 1.47059vw, 2rem);
  font-weight: 600;
  color: #fff;
}
.o-section__hero__description {
  margin: 0;
  font-size: clamp(1.125rem, 1.10294vw, 1.5rem);
  font-weight: 500;
  color: #fff;
}

/*# sourceMappingURL=gastronomy.css.map */
