@font-face {
  font-family: "League_Gothic";
  src: url(../font/LeagueGothic-Regular.ttf) format("truetype");
}

:root {
  --pale-gold: #f6f1cc;
  --pale-yellow: #fff79d;
  --vivid-yellow: #ffff00;
  --layout-width-inner: 1000px;
  --red: #f30000;
}

body {
  background-repeat: no-repeat;
  background-position: top;
  background-size: contain;

  @media (max-width: 768px) {
    background-image: url(../img/bg_touch.jpg);
  }

  @media (min-width: 769px) {
    background-image: url(../img/bg_pc.jpg);
  }
}

.takayama {
  background-color: transparent;
  overflow-x: inherit;
}

.text-red {
  color: var(--red) !important;
}

.bg-pale-gold {
  background-color: var(--pale-gold);
}

.bg-pale-yellow {
  background-color: var(--pale-yellow);
}

.bg-vivid-yellow {
  background-color: var(--vivid-yellow);
}

.border-pale-gold {
  border: 3px solid var(--vivid-pink) !important;
}

.border-pale-gold {
  border: 3px solid var(--pale-gold) !important;
}

.border-vivid-yellow {
  border: 3px solid var(--vivid-yellow) !important;
}


a img, button.rounded-pill {
  transform: scale(1);
  transform-origin: center center;
  transition: 0.1s;
}
@media (hover: hover) {
  a:hover img, button.rounded-pill:hover {
    transform: scale(1.05);
    transform-origin: center center;
    z-index: 1;
  }
}

.takayama .gap-lg-2 {
  gap: 1.5rem !important
}

.lni::before {
  vertical-align: -2px;
}

.underline {
  background: linear-gradient(transparent 60%, yellow 60%);
}

.price {
  font-family: "League_Gothic";

  @media (max-width: 765px) {
    font-size: 4rem !important;
  }
}

#shopList li {
  scroll-margin-top: 100px;
}

.splide__slide {
  padding-bottom: 1rem;
}

/* スライド共通のスタイル */
.splide__slide .splide__slide__inner {
  transform: scale(0.8);
  transform-origin: center center;
  transition: 0.1s;
  /* ゆっくり小さくさせる */
  pointer-events: none;
}

/* アクティブなスライドのスタイル */
.splide__slide.is-active .splide__slide__inner {
  opacity: 1;
  transform: scale(1);
  transform-origin: center center;
  z-index: 1;
  /* 中央のスライドを一番上にする */
  pointer-events: inherit;
  box-shadow: 0 0.5rem 1rem rgba(51, 51, 51, 0.15) !important;
}

#tentou::before,
#takuhai::before {
  display: block;
  content: " ";
  margin-top: -200px;
  height: 200px;

  @media (min-width: 992px) {
    margin-top: -76px;
    height: 75px;
    visibility: hidden;
  }
}