@charset "UTF-8";

.special-list-note {
  list-style-type: disc;
  -webkit-padding-start: 1.625em;
  padding-inline-start: 1.625em;
  padding-left: 1.25em;
  color: #244661;
  text-align: left;
  font-size: 1.6rem;
}

.special-list-note li {
  padding-left: .375em;
}

.special-list-note li::marker {
  content: "※";
  color: inherit;
}

.font-novantique-serif {
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
  font-weight: 300;
}

.font-noto-serif-jp {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.bg-\[\#d2e0f4\] {
  background-color: #d2e0f4;
}

.bg-\[\#f4eee5\] {
  background-color: #f4eee5;
}

.text-\[\#980d0d\] {
  color: #980d0d;
}

body {
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  padding-top: 0;
  overflow-x: hidden;
  cursor: default;
}

html {
  min-width: 320px;
  overflow-x: hidden;
}

#christmas .page-christmas {
  font-size: 1.6rem;
  color: #301209;
  background-color: #f1ebdf;
}

#christmas .page-christmas .kv {
  position: relative;
  margin-bottom: 30px;
  background-color: #f1ebdf;
}

#christmas .page-christmas .kv img {
  width: 100%;
}

#christmas .page-christmas .kv .kv__img {
  padding-bottom: 100px;
}

#christmas .page-christmas .kv .kv__text {
  position: absolute;
  bottom: 0;
  width: 100%;
  display: grid;
  gap: 50px;
  text-align: center;
}

#christmas .page-christmas .kv .kv__text > .w {
  width: 100%;
}

#christmas .page-christmas .kv .kv__text h1 {
  font-size: 8rem;
  font-weight: bold;
  color: #fff;
}

#christmas .page-christmas .kv .kv__text .text-bg {
  background-image: url(../images/title-bg.png);
  background-size: cover;
  background-position: center;
  display: grid;
  gap: 50px;
}

#christmas .page-christmas .kv .kv__text p {
  font-size: 2.4rem;
}

#christmas .page-christmas .kv .kv__text img.date {
  width: 632px;
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
}

#christmas .page-christmas main {
  background-color: #ffeecd;
}

#christmas .page-christmas main .nav {
  background-color: #c5a55e;
}

#christmas .page-christmas main .nav nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  max-width: 1060px;
  margin: 0 auto;
}

#christmas .page-christmas main .nav nav a {
  color: #fff;
  width: calc( 25% - 20px);
}

#christmas .page-christmas main .nav nav a:hover {
  opacity: 1;
}

#christmas .page-christmas main #illumination figure {
  position: relative;
  padding-bottom: 140px;
}

#christmas .page-christmas main #illumination figure img {
  border-radius: 20px;
}

#christmas .page-christmas main #illumination figure figcaption {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 20px;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background-color: #f6e0bb;
  border-radius: 20px;
}

#christmas .page-christmas main #illumination .detail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1em;
}

#christmas .page-christmas main #illumination .detail + .detail {
  margin-top: 5px;
}

#christmas .page-christmas main #illumination .detail dt {
  width: 70px;
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
  background-color: #c5a55e;
}

#christmas .page-christmas main #illumination .btn_box {
  display: flex;
  align-items: center;
}

#christmas .page-christmas main #illumination .btn_box .box_btn {
  width: 90%;
}

#christmas .page-christmas main #special-event .ttl {
  text-align: center;
}

#christmas .page-christmas main #special-event .special-event-main {
  margin-top: 25px;
  display: grid;
  gap: 30px;
}

#christmas .page-christmas main #special-event .special-event-main figure {
  max-width: var(--special-event-img-width, -webkit-fit-content);
  max-width: var(--special-event-img-width, -moz-fit-content);
  max-width: var(--special-event-img-width, fit-content);
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
}

#christmas .page-christmas main #special-event .special-event-main figure img {
  border-radius: 20px;
}

#christmas .page-christmas main #special-event .special-event-main figure figcaption {
  margin-top: 10px;
  padding: 50px;
  display: flex;
  justify-content: space-between;
}

#christmas .page-christmas main #special-event .special-event-main figure figcaption .txt > * + * {
  margin-top: 5px;
}

#christmas .page-christmas main #special-event .special-event-main figure figcaption .detail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  --dtSize: 70px;
}

#christmas .page-christmas main #special-event .special-event-main figure figcaption .detail dt {
  width: var(--dtSize);
}

#christmas .page-christmas main #special-event .special-event-main figure figcaption .detail dd {
  width: calc( 100% - var(--dtSize));
}

#christmas .page-christmas main #menu .ttl {
  text-align: center;
  margin-bottom: 40px;
}

#christmas .page-christmas main #menu .card__list + .card__list {
  margin-top: 52px;
}

#christmas .page-christmas main #menu .card__list--col2 {
  gap: 30px;
}

#christmas .page-christmas main #menu .card__list--col2 .card {
  margin: 0;
}

#christmas .page-christmas main #menu .card__list--col3 {
  justify-content: center;
  gap: 25px 29px;
}

#christmas .page-christmas main #menu .card__list--col3 .card {
  margin: 0;
}

#christmas .page-christmas main #menu .card {
  padding: 0 25px 25px;
  font-size: 1.6rem;
  letter-spacing: 0.04em;
}

#christmas .page-christmas main #menu .card .shop {
  display: flex;
  justify-content: center;
  align-items: center;
}

#christmas .page-christmas main #menu .card .shop span {
  color: #fff;
  font-size: 1.3rem;
  background-color: #c5a55e;
  text-align: center;
  padding: 2px 20px;
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
}

#christmas .page-christmas main #menu .card .card--head {
  margin-bottom: 20px;
}

#christmas .page-christmas main #menu .card h3 {
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
  font-size: 2.2rem;
  line-height: 1.25;
  text-align: center;
  margin: 23px auto 17px;
  width: 100%;
}

#christmas .page-christmas main #menu .card h3 span {
  display: block;
  font-size: 2rem;
}

#christmas .page-christmas main #menu .card .price {
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.25;
}

#christmas .page-christmas main #menu .card .price b {
  font-size: 2rem;
}

#christmas .page-christmas main #menu .card .img {
  margin-bottom: 15px;
}

#christmas .page-christmas main #menu .card .detail {
  display: grid;
  gap: 5px;
}

#christmas .page-christmas main #menu .btn_box {
  margin-top: 45px;
}

#christmas .page-christmas main #product .ttl {
  text-align: center;
  margin-bottom: 40px;
}

#christmas .page-christmas main #product .product-list {
  margin-top: 27px;
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
  max-width: 1000px;
  display: grid;
  gap: 52px;
}

#christmas .page-christmas main #product .product-card {
  display: flex;
  flex-wrap: wrap;
  --imgWidth: 580px;
}

#christmas .page-christmas main #product .product-card:nth-child(2n) {
  flex-direction: row-reverse;
}

#christmas .page-christmas main #product .product-card .img {
  width: var(--imgWidth);
  padding: 20px;
  background-color: #fff;
}

#christmas .page-christmas main #product .product-card .txt {
  width: calc( 100% - var(--imgWidth));
  display: flex;
  flex-direction: column;
}

#christmas .page-christmas main #product .product-card .txt-inner {
  padding: 47px 50px 30px;
  margin-top: auto;
  margin-bottom: 35px;
  background-color: #ede1ca;
}

#christmas .page-christmas main #product .product-card .txt h3 {
  text-align: center;
  font-size: 2.4rem;
  padding-bottom: 1px;
  border-bottom: solid 1px #c8a765;
  font-weight: 700;
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
}

#christmas .page-christmas main #product .product-card .txt .price {
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.25;
  margin: 15px auto;
}

#christmas .page-christmas main #product .product-card .txt .price b {
  font-size: 2rem;
}

#christmas .page-christmas main #product .shop-info {
  margin-top: 53px;
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
  max-width: 1080px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  padding: 33px;
  background-color: #fff;
}

#christmas .page-christmas main #product .shop-info .ph {
  border-radius: 50%;
  overflow: hidden;
}

#christmas .page-christmas main #product .shop-info .txt h3 {
  font-size: 2.6rem;
  font-weight: bold;
  margin-bottom: 23px;
}

#christmas .page-christmas main #product .shop-info .txt h3 small {
  display: block;
  font-size: 1.6rem;
  color: #b50029;
}

#christmas .page-christmas main #product .shop-info .txt .box_btn {
  margin-top: 20px;
}

#christmas .page-christmas main #product .item-01 {
  position: relative;
}

#christmas .page-christmas main #product .item-01::before {
  content: '';
  background-image: url(../images/product/item-01.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 73px;
  aspect-ratio: 109/92;
  position: absolute;
}

#christmas .page-christmas main #product .item-02 {
  position: relative;
}

#christmas .page-christmas main #product .item-02::before {
  content: '';
  background-image: url(../images/product/item-02.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 179px;
  aspect-ratio: 214/128;
  position: absolute;
}

#christmas .page-christmas main #product .item-03 {
  position: relative;
}

#christmas .page-christmas main #product .item-03::before {
  content: '';
  background-image: url(../images/product/item-03.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 145px;
  aspect-ratio: 145/112;
  position: absolute;
}

#christmas .page-christmas main #experience .ttl {
  text-align: center;
  margin-bottom: 45px;
}

#christmas .page-christmas main #experience .product-list {
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
  max-width: 1150px;
  display: grid;
  gap: 52px;
}

#christmas .page-christmas main #experience .product-card {
  display: flex;
  flex-wrap: wrap;
  --imgWidth: 680px;
}

#christmas .page-christmas main #experience .product-card .img {
  width: var(--imgWidth);
  padding: 20px;
  background-color: #fff;
}

#christmas .page-christmas main #experience .product-card .txt {
  width: calc( 100% - var(--imgWidth));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#christmas .page-christmas main #experience .product-card .txt-inner {
  padding: 47px 51px 32px;
}

#christmas .page-christmas main #experience .product-card .txt h3 {
  text-align: center;
  font-size: 2.4rem;
  line-height: 1.5;
  font-weight: 700;
  font-family: "novantique-serif", "Noto Serif JP", sans-serif;
  font-style: normal;
  margin-bottom: 50px;
}

#christmas .page-christmas main #experience .product-card .txt p {
  text-align: center;
}

#christmas .page-christmas main #experience .product-card .txt .box_btn {
  margin-top: 55px;
}

#christmas .page-christmas main #experience .shop {
  background-color: #fff;
  margin-top: 57px;
}

#christmas .page-christmas main #experience .shop-ph {
  text-align: center;
}

#christmas .page-christmas main #experience .shop-txt {
  letter-spacing: 0.04em;
}

#christmas .page-christmas main #experience .shop-txt h3 {
  font-size: 2.6rem;
  line-height: 1.34615;
  margin-bottom: 13px;
}

#christmas .page-christmas main #experience .shop-txt p {
  font-size: 1.6rem;
  line-height: 1.5625;
}

#christmas .page-christmas main #experience .shop-txt .box_btn {
  margin-top: 32px;
}

#christmas .page-christmas main #experience .item-01 {
  position: relative;
}

#christmas .page-christmas main #experience .item-01::before {
  content: '';
  background-image: url(../images/exp/item01.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 92px;
  aspect-ratio: 100/90;
  position: absolute;
  top: -91px;
  right: -46px;
}

#christmas .page-christmas main #event .ttl {
  text-align: center;
  margin-bottom: 45px;
}

#christmas .page-christmas main #event .card__list + .card__list {
  margin-top: 52px;
}

#christmas .page-christmas main #event .card__list--col2 {
  gap: 30px;
}

#christmas .page-christmas main #event .card__list--col2 .card {
  width: calc( (100% / 2) - 30px);
  margin: 0;
}

#christmas .page-christmas main #event .card__list--col3 {
  justify-content: center;
  gap: 25px 29px;
}

#christmas .page-christmas main #event .card__list--col3 .card {
  margin: 0;
}

#christmas .page-christmas main #event .card {
  padding: 25px;
  display: grid;
  gap: 15px;
  font-size: 1.6rem;
  letter-spacing: 0.04em;
}

#christmas .page-christmas main #event .card .img {
  margin-bottom: 5px;
  border: solid 1px #c5a55e;
}

#christmas .page-christmas main #event .card h3 {
  font-family: "Novantique Serif";
  font-size: 2.2rem;
  line-height: 1.25;
  text-align: center;
  margin: 8px auto 2px;
  width: 100%;
}

#christmas .page-christmas main #event .card .box_btn {
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
  margin-top: 30px;
}

#christmas .page-christmas .btn_a {
  --h: 56px;
  --fs: 16px;
  --radius: 9999px;
  --icon: calc(var(--h) * 0.45);
  --icon-gap: 12px;
  --pad-x: 16px;
  --icon-right: 14px;
  --arrow-w: calc(var(--icon) * 0.38);
  --arrow-h: calc(var(--icon) * 0.50);
  --reserve: calc(var(--pad-x) + var(--icon) + var(--icon-gap) + var(--icon-right));
  --balance: 0px;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: var(--h);
  font-size: var(--fs);
  font-weight: 700;
  line-height: 1;
  letter-spacing: .02em;
  white-space: nowrap;
  text-decoration: none;
  padding: 0 calc(var(--reserve) + var(--balance)) 0 calc(var(--reserve) - var(--balance));
  border-radius: var(--radius);
  -webkit-tap-highlight-color: transparent;
  transition: background-color .2s ease, color .2s ease, box-shadow .2s ease, -webkit-filter .15s ease;
  transition: filter .15s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;
  transition: filter .15s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease, -webkit-filter .15s ease;
}

#christmas .page-christmas .btn_a:focus-visible {
  outline: 2px solid #000;
  outline-offset: 2px;
}

#christmas .page-christmas .btn_a::after {
  content: "";
  position: absolute;
  right: var(--icon-right);
  top: 50%;
  width: var(--icon);
  height: var(--icon);
  border-radius: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background: #111;
  z-index: 0;
}

#christmas .page-christmas .btn_a::before {
  content: "";
  position: absolute;
  right: calc(var(--icon-right) + (var(--icon) / 2) - (var(--arrow-w) / 2));
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: calc(var(--arrow-h) / 2) solid transparent;
  border-bottom: calc(var(--arrow-h) / 2) solid transparent;
  border-left: var(--arrow-w) solid #fff;
  z-index: 1;
}

#christmas .page-christmas .btn_a[href="/eat/"],
#christmas .page-christmas .btn_a[href="/product/"] {
  --btn-max: 318px;
}

#christmas .page-christmas .btn_a:hover {
  opacity: 1 !important;
}

#christmas .page-christmas .btn_a--lg {
  --h: 56px;
  --fs: 16px;
}

#christmas .page-christmas .btn_a--sm {
  --h: 40px;
  --fs: 14px;
}

#christmas .page-christmas .box_btn.-txt-base {
  color: #301209 !important;
}

#christmas .page-christmas .box_btn.-bg-white {
  --color: #fff;
}

#christmas .page-christmas .box_btn.-bg-\[\#980d0d\] {
  --color: #980d0d;
}

#christmas .page-christmas .box_btn.-bg-\[\#00584a\] {
  --color: #00584a;
}

#christmas .page-christmas .box_btn.-hover\:border-\[\#c7a564\]:hover {
  border-color: #c7a564 !important;
}

#christmas .page-christmas .box_btn.-hover\:color-\[\#c7a564\]:hover {
  color: #c7a564 !important;
}

#christmas .page-christmas .box_btn.-arrow-base .btn-arrow {
  fill: #301209;
}

#christmas .page-christmas .box_btn.-hover\:-arrow-fill-color-\[\#c7a564\]:hover .btn-arrow {
  fill: #c7a564 !important;
}

#christmas .page-christmas .btn--top {
  text-align: center;
  padding-top: 95px;
  padding-bottom: 108px;
}

#christmas .page-christmas .btn--top img {
  border: solid 1px #000;
  border-radius: 50px;
  max-width: 400px;
}

#christmas .w {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  margin-inline: auto;
}

@media only screen and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }

  #christmas .page-christmas main .nav nav {
    flex-wrap: wrap;
    height: 60px;
    justify-content: center;
  }

  #christmas .page-christmas main #illumination {
    padding: 60px 0;
  }

  #christmas .page-christmas main #special-event {
    padding: 60px 0;
  }

  #christmas .page-christmas main #menu {
    padding: 60px 0;
  }

  #christmas .page-christmas main #menu .card__list--col2 .card {
    width: calc( (100% / 2) - 30px);
  }

  #christmas .page-christmas main #menu .card__list--col3 .card {
    width: calc( (100% / 3) - 25px);
  }

  #christmas .page-christmas main #product {
    padding: 60px 0;
  }

  #christmas .page-christmas main #product .item-01::before {
    top: -30px;
    right: 50px;
  }

  #christmas .page-christmas main #product .item-02::before {
    top: -88px;
    left: 0;
  }

  #christmas .page-christmas main #product .item-03::before {
    top: -89px;
    right: 20px;
  }

  #christmas .page-christmas main #experience {
    padding: 60px 0;
  }

  #christmas .page-christmas main #experience .shop {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 20px;
  }

  #christmas .page-christmas main #experience .shop-ph {
    padding-left: 10px;
    padding-right: 61px;
    border-right: solid 1px #877023;
  }

  #christmas .page-christmas main #experience .shop-ph img {
    width: 457px;
  }

  #christmas .page-christmas main #experience .shop-txt {
    padding-left: 46px;
  }

  #christmas .page-christmas main #event {
    padding: 60px 0;
  }
}

@media (min-width: 1024px) {
  #christmas .page-christmas .btn_a {
    --btn-max: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: var(--btn-max);
    margin-inline: auto;
    margin-top: 20px;
    --balance: 0px;
  }

  #christmas .page-christmas .btn_a--lg {
    --h: 60px;
    --fs: 18px;
    --icon-right: 16px;
  }

  #christmas .page-christmas .btn_a--sm {
    --h: 44px;
    --fs: 15px;
  }
}

@media only screen and (max-width: 767px) {
  .special-list-note {
    font-size: max(9px,2.4vw);
  }

  .sp-block {
    padding-left: max(15px,4vw);
    padding-right: max(15px,4vw);
    padding-inline: max(15px,4vw);
  }

  .pc-only {
    display: none !important;
  }

  #christmas .page-christmas {
    font-size: max(9px,2.4vw);
  }

  #christmas .page-christmas .kv {
    margin-bottom: 0;
  }

  #christmas .page-christmas .kv .kv__img {
    padding-bottom: 18.25293vw;
    background-color: #f1ebdf;
  }

  #christmas .page-christmas .kv .kv__text {
    aspect-ratio: 2.42718;
  }

  #christmas .page-christmas .kv .kv__text > .w {
    display: flex;
    flex-direction: column;
    justify-content: end;
  }

  #christmas .page-christmas .kv .kv__text h1 {
    font-size: max(18px,4.8vw);
  }

  #christmas .page-christmas .kv .kv__text .text-bg {
    padding-left: max(22.5px,6vw);
    padding-right: max(22.5px,6vw);
    padding-inline: max(22.5px,6vw);
    background-image: url(../images/title-bg-small.png);
    background-position: center bottom;
    gap: max(10px,2.66667vw);
    padding-bottom: max(20px,5.33333vw);
  }

  #christmas .page-christmas .kv .kv__text p {
    font-size: max(10px,2.66667vw);
  }

  #christmas .page-christmas main .nav nav {
    padding: max(7.5px,2vw) max(5px,1.33333vw);
    gap: max(5px,1.33333vw);
  }

  #christmas .page-christmas main #illumination {
    padding-top: max(30px,8vw);
    padding-bottom: max(30px,8vw);
  }

  #christmas .page-christmas main #illumination figure {
    padding-bottom: max(45px,12vw);
    font-size: max(11px,2.93333vw);
    line-height: 1.727;
  }

  #christmas .page-christmas main #illumination figure img {
    border-radius: 2.60756vw;
  }

  #christmas .page-christmas main #illumination figure figcaption {
    padding: 7.1708vw 4.56323vw;
    border-radius: max(10px,2.66667vw);
    display: block;
  }

  #christmas .page-christmas main #illumination figure figcaption div + div {
    margin-top: 5.21512vw;
  }

  #christmas .page-christmas main #illumination .detail + .detail {
    margin-top: 1.30378vw;
  }

  #christmas .page-christmas main #illumination .detail dt {
    width: 5em;
    font-size: 2.86832vw;
  }

  #christmas .page-christmas main #special-event {
    padding-top: max(30px,8vw);
    padding-bottom: max(30px,8vw);
  }

  #christmas .page-christmas main #special-event .special-event-main {
    margin-top: max(24px,6.4vw);
    gap: max(27.5px,7.33333vw);
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #special-event .special-event-main figure img {
    border-radius: 2.60756vw;
  }

  #christmas .page-christmas main #special-event .special-event-main figure figcaption {
    margin-top: max(15px,4vw);
    padding: max(5px,1.33333vw);
    display: block;
  }

  #christmas .page-christmas main #special-event .special-event-main figure figcaption .txt > * + * {
    margin-top: max(1px,0.26667vw);
  }

  #christmas .page-christmas main #special-event .special-event-main figure figcaption .detail {
    align-items: start;
    --dtSize: 4.5em;
  }

  #christmas .page-christmas main #special-event .special-event-main figure figcaption .btn_box {
    margin-top: max(27.5px,7.33333vw);
  }

  #christmas .page-christmas main #special-event .special-event-main figure figcaption .btn_box .box_btn {
    margin-left: auto;
    margin-right: auto;
    margin-inline: auto;
  }

  #christmas .page-christmas main #menu {
    padding-top: max(30px,8vw);
    padding-bottom: max(30px,8vw);
  }

  #christmas .page-christmas main #menu .ttl {
    margin-bottom: max(35px,9.33333vw);
  }

  #christmas .page-christmas main #menu .card__list--col2 {
    gap: max(30px,8vw);
  }

  #christmas .page-christmas main #menu .card__list--col3 {
    gap: max(30px,8vw);
  }

  #christmas .page-christmas main #menu .card {
    padding: 0 max(7.5px,2vw) max(22.5px,6vw);
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #menu .card .shop span {
    font-size: max(10px,2.66667vw);
  }

  #christmas .page-christmas main #menu .card .card--head {
    margin-bottom: max(15px,4vw);
  }

  #christmas .page-christmas main #menu .card h3 {
    font-size: max(18px,4.8vw);
    margin: max(14px,3.73333vw) auto max(10px,2.66667vw);
  }

  #christmas .page-christmas main #menu .card h3 span {
    font-size: max(15px,4vw);
  }

  #christmas .page-christmas main #menu .card .price {
    font-size: max(10px,2.66667vw);
  }

  #christmas .page-christmas main #menu .card .price b {
    font-size: max(15px,4vw);
  }

  #christmas .page-christmas main #menu .card .img {
    margin-bottom: max(12.5px,3.33333vw);
  }

  #christmas .page-christmas main #menu .card .detail {
    gap: max(15px,4vw);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
  }

  #christmas .page-christmas main #menu .card .detail .img {
    margin-bottom: 0;
  }

  #christmas .page-christmas main #menu .btn_box {
    margin-top: max(40px,10.66667vw);
  }

  #christmas .page-christmas main #product {
    padding-top: max(30px,8vw);
    padding-bottom: max(30px,8vw);
  }

  #christmas .page-christmas main #product .ttl {
    margin-bottom: max(17.5px,4.66667vw);
  }

  #christmas .page-christmas main #product .product-list {
    margin-top: 0;
    gap: max(53.5px,14.26667vw);
  }

  #christmas .page-christmas main #product .product-card .img {
    width: 100%;
    margin-left: max(15px,4vw);
    margin-right: max(15px,4vw);
    margin-inline: max(15px,4vw);
  }

  #christmas .page-christmas main #product .product-card .txt {
    width: 100%;
    display: block;
  }

  #christmas .page-christmas main #product .product-card .txt-inner {
    padding: max(17.5px,4.66667vw) max(45px,12vw) max(22.5px,6vw) max(32.5px,8.66667vw);
    margin-bottom: 0;
    margin-left: max(50px,13.33333vw);
  }

  #christmas .page-christmas main #product .product-card .txt h3 {
    font-size: max(18px,4.8vw);
  }

  #christmas .page-christmas main #product .product-card .txt .price {
    font-size: max(10px,2.66667vw);
  }

  #christmas .page-christmas main #product .product-card .txt .price b {
    font-size: max(15px,4vw);
  }

  #christmas .page-christmas main #product .product-card .txt p {
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #product .product-card:nth-child(2n) .txt-inner {
    padding: max(17.5px,4.66667vw) max(32.5px,8.66667vw) max(22.5px,6vw) max(45px,12vw);
    margin-right: max(50px,13.33333vw);
    margin-left: 0;
  }

  #christmas .page-christmas main #product .shop-info {
    margin-top: max(51.5px,13.73333vw);
    padding: max(22.5px,6vw) max(22.5px,6vw) max(40px,10.66667vw);
    gap: max(15px,4vw);
    flex-direction: column;
  }

  #christmas .page-christmas main #product .shop-info .txt {
    text-align: center;
  }

  #christmas .page-christmas main #product .shop-info .txt h3 {
    font-size: max(19.5px,5.2vw);
    margin-bottom: max(11.5px,3.06667vw);
  }

  #christmas .page-christmas main #product .shop-info .txt h3 small {
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #product .shop-info .txt .box_btn {
    margin-top: max(30px,8vw);
    margin-left: auto;
    margin-right: auto;
    margin-inline: auto;
  }

  #christmas .page-christmas main #product .item-01::before {
    width: max(54.5px,14.53333vw);
    bottom: -17%;
    right: 5%;
  }

  #christmas .page-christmas main #product .item-02::before {
    width: max(107px,28.53333vw);
    right: -7%;
    bottom: -17%;
  }

  #christmas .page-christmas main #product .item-03::before {
    width: max(72.5px,19.33333vw);
    left: -13%;
    bottom: -18%;
  }

  #christmas .page-christmas main #experience {
    padding-top: max(30px,8vw);
    padding-bottom: max(30px,8vw);
  }

  #christmas .page-christmas main #experience .ttl {
    margin-bottom: max(17.5px,4.66667vw);
  }

  #christmas .page-christmas main #experience .product-card .img {
    width: 100%;
    padding: max(7.5px,2vw);
  }

  #christmas .page-christmas main #experience .product-card .txt {
    width: 100%;
  }

  #christmas .page-christmas main #experience .product-card .txt-inner {
    padding: max(15px,4vw);
  }

  #christmas .page-christmas main #experience .product-card .txt h3 {
    font-size: max(21px,5.6vw);
    margin-bottom: max(20px,5.33333vw);
  }

  #christmas .page-christmas main #experience .product-card .txt p {
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #experience .product-card .txt .box_btn {
    margin-top: max(15px,4vw);
    margin-left: auto;
    margin-right: auto;
    margin-inline: auto;
  }

  #christmas .page-christmas main #experience .shop {
    padding-top: max(20px,5.33333vw);
    padding-bottom: max(34.5px,9.2vw);
    margin-top: max(45px,12vw);
  }

  #christmas .page-christmas main #experience .shop-txt {
    margin-top: max(16.5px,4.4vw);
    padding-left: max(6.5px,1.73333vw);
    padding-right: max(6.5px,1.73333vw);
    text-align: center;
  }

  #christmas .page-christmas main #experience .shop-txt h3 {
    font-size: max(20px,5.33333vw);
    text-align: center;
    line-height: 1.3125;
  }

  #christmas .page-christmas main #experience .shop-txt p {
    margin-top: max(20.5px,5.46667vw);
    font-size: max(12px,3.2vw);
    line-height: 1.66667;
  }

  #christmas .page-christmas main #experience .shop-txt .box_btn {
    margin-top: max(18px,4.8vw);
    margin-left: auto;
    margin-right: auto;
    margin-inline: auto;
  }

  #christmas .page-christmas main #experience .item-01::before {
    background-image: url(../images/exp/item02-small.png);
    width: max(375px,100vw);
    aspect-ratio: 750/222;
    top: -230%;
    right: calc( ( max(15px,4vw) * 2) * -1);
  }

  #christmas .page-christmas main #experience .item-02-sp {
    position: relative;
  }

  #christmas .page-christmas main #experience .item-02-sp::before {
    content: '';
    background-image: url(../images/exp/item01-small.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: max(49.5px,13.2vw);
    aspect-ratio: 99/108;
    position: absolute;
    top: -10%;
    right: -4.5%;
  }

  #christmas .page-christmas main #event {
    padding-top: max(30px,8vw);
    padding-bottom: max(56.5px,15.06667vw);
  }

  #christmas .page-christmas main #event .ttl {
    margin-bottom: max(45px,12vw);
  }

  #christmas .page-christmas main #event .card__list + .card__list {
    margin-top: max(20px,5.33333vw);
  }

  #christmas .page-christmas main #event .card__list--col2 {
    gap: max(15px,4vw);
  }

  #christmas .page-christmas main #event .card__list--col2 .card {
    width: 100%;
  }

  #christmas .page-christmas main #event .card__list--col3 {
    gap: max(9px,2.4vw);
    justify-content: left;
  }

  #christmas .page-christmas main #event .card__list--col3 .card {
    width: calc( (100% / 2) - max(9px,2.4vw));
    display: flex;
    flex-direction: column;
    padding-bottom: max(20px,5.33333vw);
    gap: max(5px,1.33333vw);
  }

  #christmas .page-christmas main #event .card__list--col3 .card h3 {
    font-size: max(14px,3.73333vw);
  }

  #christmas .page-christmas main #event .card__list--col3 .card p {
    font-size: max(10px,2.66667vw);
  }

  #christmas .page-christmas main #event .card__list--col3 .card .box_btn {
    margin-top: max(13.5px,3.6vw);
  }

  #christmas .page-christmas main #event .card {
    padding: max(7.5px,2vw) max(7.5px,2vw) max(27.5px,7.33333vw);
    gap: max(7.5px,2vw);
  }

  #christmas .page-christmas main #event .card h3 {
    margin: max(7.5px,2vw) auto;
    font-size: max(18px,4.8vw);
  }

  #christmas .page-christmas main #event .card p {
    font-size: max(12px,3.2vw);
  }

  #christmas .page-christmas main #event .card .box_btn {
    margin-top: max(20px,5.33333vw);
  }

  #christmas .page-christmas .btn_a[href="/eat/"],
  #christmas .page-christmas .btn_a[href="/product/"] {
    --btn-max: max(238.5px,63.6vw);
    max-width: var(--btn-max) !important;
    width: 100% !important;
  }

  #christmas .page-christmas .btn_a {
    width: max(201px,53.6vw) !important;
    max-width: 402px !important;
    height: max(48px,12.8vw);
    max-height: 96px;
    font-size: max(14px,3.73333vw);
  }

  #christmas .page-christmas .btn_a::before {
    --arrow-w: max(7.5px,2vw);
    --arrow-h: max(9px,2.4vw);
    right: 7%;
    right: max(14px,3.73333vw);
  }

  #christmas .page-christmas .btn_a::after {
    --icon: max(17.5px,4.66667vw);
  }

  #christmas .page-christmas .btn--top {
    padding: max(60px,16vw) 20px max(50px,13.33333vw);
  }

  #christmas .page-christmas .btn--top img {
    width: max(200px,53.33333vw);
    min-width: 250px;
  }
}

@media (max-width: 767px) {
  #christmas .page-christmas .btn_a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    max-width: 100%;
    margin-inline: auto;
    text-align: center;
    margin-top: 10px;
    --pad-x: 14px;
    --icon-right: max(10px,2.66667vw);
    --icon-gap: 10px;
    --balance: 2px;
  }

  #christmas .page-christmas .btn_a--lg {
    --h: 48px;
    --fs: 13px;
  }

  #christmas .page-christmas .btn_a--sm {
    --h: 38px;
    --fs: 14px;
  }
}

@media only screen and (max-width: 650px) {
  #christmas .page-christmas .btn_a::before {
    right: 5%;
    right: max(12.5px,3.33333vw);
  }
}

@media only screen and (max-width: 450px) {
  #christmas .page-christmas .btn_a::before {
    right: 5%;
    right: max(15px,4vw);
  }
}