:root {
  --base-vw-sp: 2.666vw;
  --base-vw-tab: 1.3vw;
  --base-vw-pc: 10px;
  --color-white: #fff;
  --color-black: #000;
  --color-black-200: #231815;
  --color-gray: #BFBFBF;
  --color-gray-400: #EFF0EC;
  --color-gray-500: #D7D6D6;
  --color-green-100: #F4F5F4;
  --color-green-200: #EEEFEB;
  --color-green-300: #E7E8E0;
  --color-green: #14291D;
  --color-yellow: #D4C68B;
  --color-yellow-500: #CAB96F;
  --color-red: #E40220;
  --color-red-400: #AD181E;
  --color-green-tp: rgba(20, 41, 29, 0.05);
  --color-blue: #005BAB;

  --size-10: 1rem;
  --size-15: 1.5rem;
  --size-20: 2rem;
  --size-25: 2.5rem;
  --size-30: 3rem;
  --size-50: 5rem;

  --space-3xs: 0.5rem;
  --space-2xs: 1rem;
  --space-xs: 1.5rem;
  --space-sm: 2rem;
  --space-md: 2.5rem;
  --space-lg: 3rem;
  --space-xl: 3.5rem;
  --space-2xl: 4rem;
  --space-3xl: 5rem;
  --space-4xl: 7.5rem;
  --space-5xl: 10rem;

  --text-shadow-white: 0.1rem 0.1rem 0rem rgba(255, 255, 255, 0.5);
  --text-shadow-green: 0 0 0.9rem rgba(20, 41, 90, 0.5);
  --text-shadow-green-dark: 0 0 0.6rem rgba(20, 41, 29, 0.5);
  --shadow: 0.3rem 0.3rem 0.6rem rgba(0, 0, 0, 0.15);

  --font-size-xs: 1rem;
  --font-size-sm: 1.1rem;
  --font-size-md: 1.2rem;
  --font-size-lg: 1.4rem;
  --font-size-xl: 1.6rem;
  --font-size-2xl: 1.8rem;
  --font-size-3xl: 2.1rem;
  --font-size-4xl: 2.4rem;
  --font-size-5xl: 2.8rem;

  --line-height-reset: 1;
  --line-height-snug: 1.3;
  --line-height-body: 1.5;
  --line-height-relaxed: 1.7;
  --line-height-loose: 2;
  --line-height-extra-loose: 2.4;

  --letter-spacing-reset: 0;
  --letter-spacing-sm: 0.02em;
  --letter-spacing-md: 0.05em;
  --letter-spacing-lg: 0.1em;
  --letter-spacing-catch-sm: 0.2em;
  --letter-spacing-catch-md: 0.3em;
  --letter-spacing-catch-lg: 0.4em;
  --letter-spacing-catch-xl: 0.6em;

  --layer-bg-back: 10;
  --layer-bg: 15;
  --layer-bg-mask: 20;
  --layer-content: 30;
  --layer-overlay-light: 50;
  --layer-overlay-heavy: 60;
  --layer-cta: 100;
  --layer-header: 300;
  --layer-modal: 1000;
  --layer-toast: 9999;

  --max-width-size: 80rem;
  --content-side: 3rem;
  --layout-max-width: calc(var(--max-width-size) + var(--content-side) * 2);
  --layout-max-width-header: calc(96rem + 4rem);

  --cta-area-height: 7rem;
  --header-height: 7.3rem;
  --button-height-md: 4.6rem;
  --header-text-color: #fff;
  --header-text-color-scrolled: #000;

  --content-screen-height: calc(100vh - var(--header-height));
  --width-logo: 25rem;

  /* --o-t-bottom: 31vw;
  --f-t-bottom: 11vw;
  --s-n-bottom: 7vw;
  --o-o-bottom: 22vw;
  --t-f-bottom: 22vw;
  --n-s-bottom: 40vw; */

  --section-space-v: 7.5rem;

}

@media screen and (min-width:768px) {
  :root {
    --content-side: 5rem;
    --font-size-md: 1.8rem;
    --font-size-lg: 2.1rem;
    --font-size-xl: 2.4rem;
    --font-size-2xl: 2.7rem;
    --font-size-3xl: 3.2rem;
    --font-size-4xl: 3.6rem;

    --section-space-v: 10rem;

    /* --space-xxx ：各変数を1.5倍 */
    --space-3xs: 0.75rem;
    --space-2xs: 1.5rem;
    --space-xs: 2.25rem;
    --space-sm: 3rem;
    --space-md: 3.75rem;
    --space-lg: 4.5rem;
    --space-xl: 5.25rem;
    --space-2xl: 6rem;
    --space-3xl: 7.5rem;
    --space-4xl: 11.25rem;
    --space-5xl: 15rem;
  }

}



@media screen and (min-width: 1024px) {
  :root {
    --section-space-v: 15rem;
  }

}

/* ==========================================================================
    normalize
  ========================================================================== */
img,
svg {
  width: 100%;
  height: auto;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
figure,
p {
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
}

/* ==========================================================================
   base
  ========================================================================== */

html {
  font-size: var(--base-vw-sp);
}

@media screen and (min-width: 768px) {
  html {
    font-size: var(--base-vw-tab);
  }
}

@media screen and (min-width: 1024px) {
  html {
    font-size: var(--base-vw-pc);
  }
}



body {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-loose);
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* フォントプラス：MpW7Sf7DYgc%3D*/
  font-family: 'FP-HiraKakuProN-W3', sans-serif;
  font-weight: 300;
  font-style: normal;

  overflow-anchor: none;
}

section {

  padding-top: var(--section-space-v);
  padding-bottom: var(--section-space-v);
}



h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  font-family: hiragino-kaku-gothic-pron, sans-serif;
  font-weight: 600;
  font-style: normal;
  letter-spacing: var(--letter-spacing-lg);
}

h2,
.h2 {
  font-size: var(--font-size-lg);
}



h3,
.h3 {
  font-size: var(--font-size-xl);
}

h1,
h2,
h3,
h4,
h5,
p,
span,
li,
dt,
dd {
  letter-spacing: var(--letter-spacing-reset);
}

/* -------------------------------------------------------------------------
fonts
------------------------------------------------------------------------- */
.u-font-en {
  /* フォントプラス：MpW7Sf7DYgc%3D*/
  font-family: 'Augereau-Regular', serif !important;
  font-weight: 400;

}

.u-font-mincho {
  /* フォントプラス：MpW7Sf7DYgc%3D*/
  font-family: 'TsukuAOldMinPr6-D', serif !important;
  font-weight: 600;

  /* font-family: yu-mincho-pr6n, sans-serif;
  font-weight: 400;
  font-style: normal; */
}

.u-font-ja-500 {
  font-family: 'FP-HiraKakuProN-W5', sans-serif !important;
  font-weight: 500;
}

.u-font-ja-600 {
  /* フォントプラス：MpW7Sf7DYgc%3D*/
  font-family: 'FP-HiraKakuProN-W6', sans-serif !important;
  font-weight: 600;
}

.u-font-ja-300 {
  /* フォントプラス：MpW7Sf7DYgc%3D*/
  font-family: 'FP-HiraKakuProN-W3', sans-serif !important;
  font-weight: 300;
}


/* -------------------------------------------------------------------------
layout
------------------------------------------------------------------------- */

.l-stack {
  --stack-gap: 3rem;
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap);
  width: 100%;
}

@media screen and (min-width: 768px) {
  .l-stack {
    --stack-gap: 5rem;
  }
}

.l-stack>* {
  margin-top: 0;
  margin-bottom: 0;
}

.l-stack--lg {
  --stack-gap: 10rem;
}

.l-stack--sm {
  --stack-gap: 2rem;
}

@media screen and (min-width: 768px) {
  .l-stack--sm {
    --stack-gap: 3.5rem;
  }

}

.l-container {
  --content-padding: var(--content-side);
  --content-max-width: var(--layout-max-width);
  padding-inline: var(--content-padding);
  width: 100%;
  max-width: var(--content-max-width);
  margin-left: auto;
  margin-right: auto;
}

.l-container--narrow {
  --layout-max-width: calc(68rem + var(--content-side) * 2);
}

/* 画面幅いっぱい */
.l-container--full {
  padding-inline: 0;
  max-width: none;
}

/* 画面幅いっぱい（モバイルのみ） */
.l-container--sp-full {
  padding-inline: 0;
}

@media screen and (min-width:768px) {
  .l-container--sp-full {
    padding-inline: var(--content-padding);
  }
}

/* -------------------------------------------------------------------------
sticky（peel）の大枠
------------------------------------------------------------------------- */

.l-peel-wrap {
  /* margin-top: calc(var(--cta-area-height) * -1); */
  position: relative;
  z-index: 30;
}

/* -------------------------------------------------------------------------
l-peel (めくりレイアウト)
------------------------------------------------------------------------- */
.l-peel {
  position: relative;
  height: auto;
  background-color: var(--color-white);
}

.l-peel::after {
  content: "";
  display: block;
  height: 100vh;
  pointer-events: none;
}

.l-peel--first::after {
  display: none;
}

.l-peel--first .l-peel__item {
  padding-top: 0;
}

.l-peel--first .l-peel__item>section {
  min-height: 100vh;
}

.l-peel--first .l-peel__item>* {
  /* 仮 */
  min-height: 100vh;
}

.l-peel--last {
  position: sticky;
  bottom: 0;
  z-index: 1;
}

.l-peel--last>.l-peer__item {
  position: relative;
}

.l-peel--next-layer {
  margin-top: -100vh;
}



.l-peel--z8 {
  z-index: 8;
}

.l-peel--z7 {
  z-index: 7;
}

.l-peel--z6 {
  z-index: 6;
}

.l-peel--z5 {
  z-index: 5;
}

.l-peel--z4 {
  z-index: 4;
}

.l-peel--z3 {
  z-index: 3;
}

.l-peel--z2 {
  z-index: 2;
}

.l-peel--z1 {
  z-index: 1;
}

.l-peel__item {
  position: sticky;
  top: 0;
  width: 100%;
  min-height: 100vh;
  padding-top: var(--header-height);
  overflow: hidden;
}

.l-peel__item--no-pd-top {
  padding-top: 0;
}

.l-peel__item>section {
  min-height: var(--content-screen-height);
}

/* ページ内リンク（アンカー）位置調整 */
.u-anchor-wrap {
  position: relative;
}

.u-anchor-target {
  --adjust-scroll-amount: 0;
  --_adjusted-position-top: calc(var(--adjust-scroll-amount) + 100vh);

  position: absolute;
  top: 100vh;
  left: 0;
  width: 0;
  height: 0;
  visibility: hidden;
  pointer-events: none;
  /* 【座標相殺ルール】
       構造イメージ:
         .l-peel--next-layer  ← margin-top: -100vh（ブラウザ座標が 100vh 上にずれる）
           .u-anchor-wrap     ← position: relative（アンカー基点）
             .u-anchor-target ← top: 100vh で意図的に 100vh 下へずらす
                                → 結果、見た目の上辺と一致する
  
       理由: 親要素（.l-peel--next-layer）に「margin-top: -100vh」がかかっているため、
             ブラウザが認識する絶対座標が 100vh 分、上にずれています。
             それを相殺して正しい着地位置にするため、
             あらかじめ 100vh 分「下」に配置しています。
    */

  /* 調整時：位置を可視化 */
  /* width: 100%;
  height: 1px;
  background-color: red;
  z-index: 9999;
  visibility: visible; */
}

/* u-anchor-targetを可視化して、基準幅で目視で合わせる*/
#tg-concept {
  --adjust-scroll-amount: 7rem;
  top: var(--_adjusted-position-top);
}

#tg-contact {
  /* u-anchor-targetを可視化して、基準幅で目視で合わせる */
  --adjust-scroll-amount: 223.5rem;
  top: var(--_adjusted-position-top);
}

@media screen and (min-width: 768px) {
  #tg-contact {
    --adjust-scroll-amount: 303rem;
  }
}

@media screen and (min-width: 1024px) {
  #tg-contact {
    --adjust-scroll-amount: 177.5rem;
  }
}

/* -------------------------------------------------------------------------
 COMPONENT
------------------------------------------------------------------------- */
/* button */
.c-cta-button {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 0;
}

.c-cta-button__content {
  width: 100%;
  text-align: center;
  line-height: var(--line-height-reset);
}

@media screen and (min-width: 1024px) {
  .c-cta-button__content {
    padding: 1.5rem;
  }
}

.c-cta-button__main-text {
  display: block;
  font-size: 2rem;
  line-height: var(--line-height-reset);
  margin-bottom: 0.35em;
}

@media screen and (min-width: 1024px) {
  .c-cta-button__main-text {
    text-align: left;
  }
}

.c-cta-button__sub-text {
  display: block;
  font-size: 1.2rem;
  line-height: var(--line-height-reset);
  text-align: center;
}

@media screen and (min-width: 1024px) {
  .c-cta-button__sub-text {
    text-align: left;
  }
}

.c-button-check {
  position: relative;
  display: block;
  padding: var(--size-10);
  z-index: 1;
}

.c-button-check__text {
  position: relative;
  display: block;
  width: fit-content;
  padding: 0.5em 1em;
  font-size: 1rem;
  line-height: var(--line-height-reset);
  background-color: var(--color-white);
  border-radius: 1em;
}

@media screen and (min-width: 768px) and (max-width:1023px) {
  .c-button-check__text {
    font-size: 1.5rem;
    margin-inline: auto;
  }

}

.c-button-check__text::before {
  content: "▶︎";
  display: inline-block;
  margin-right: 0.4em;
}

/* テキスト装飾 */
.c-text-outline {
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-size: var(--font-size-xl);
  line-height: var(--line-height-reset);
}

.c-text-outline::before {
  content: "";
  display: block;
  width: 0.35em;
  height: .75em;
  background-color: currentColor;
}

.c-text-outline__text-en {
  transform: translateY(0.1em);
}

.c-inline-notes {
  font-size: 10px;
  line-height: var(--line-height-snug);
}

.c-inline-notes__item {

  display: inline-block;
}

.c-inline-notes__item::before {
  content: "※";
}

.c-button {
  margin-inline: auto;
}

.c-button__button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em;
  width: 100%;
  min-height: var(--button-height-md);
  margin-inline: auto;
  background-color: var(--color-red-400);
  color: var(--color-white);
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.15);
  border-radius: 0.5rem;
}

.c-button__text {
  font-size: var(--font-size-xl);
  line-height: var(--line-height-snug);
  letter-spacing: var(--letter-spacing-reset);
  text-align: center;
}

.c-button__text-sub {
  display: block;
  font-size: 0.67em;
}

.c-button--lg .c-button__button {
  max-width: 31.5rem;
}

.c-button--lg .c-button__button {
  padding: 1.5rem;
  border: solid 1px var(--color-white);
}

.c-button--lg .c-button__text {
  /* font-size: var(--font-size-3xl); */
  font-size: 2.1rem;
}

.c-fade-overlay {
  position: relative;
  /* サイズ */
  --fade-height-top: 38%;
  --fade-height-bottom: 38%;

  /* 色 */
  --fade-color-top: #ffffff;
  --fade-color-bottom: #ffffff;

  /* 開始地点 */
  --fade-start-top: 0%;
  --fade-start-bottom: 0%;

  overflow: hidden;
}

.c-fade-overlay::before,
.c-fade-overlay::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  pointer-events: none;
}

.c-fade-overlay::before {
  top: -2px;
  background: linear-gradient(to bottom, var(--fade-color-top) var(--fade-start-top), transparent);
  height: var(--fade-height-top);
  z-index: 1;
}

.c-fade-overlay::after {
  bottom: -2px;
  background: linear-gradient(to top, var(--fade-color-bottom) var(--fade-start-bottom), transparent);
  height: var(--fade-height-bottom);
}

.c-figure {
  position: relative;
}

.c-figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 1em;
  font-size: 10px;
  line-height: var(--line-height-reset);
}

.c-figcaption::before {
  content: "※";
}

.c-figcaption--right {
  text-align: right;
}

.c-list-caution {}

.c-list-caution__item {
  position: relative;
  padding-left: 1em;
  font-size: 10px;
  line-height: var(--line-height-snug);
}

.c-list-caution__item+.c-list-caution__item {
  margin-top: 0.5em;
}

.c-list-caution__item::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}


/* -------------------------------------------------------------------------
  loadiong
  ------------------------------------------------------------------------- */
/* .p-loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: var(--layer-toast);

  display: flex;
  justify-content: center;
  align-items: center;

  opacity: 1;
  visibility: visible;
  transition: opacity 2s ease, visibility 2s ease;
}

.p-loading.is-off {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.p-loading__content {


  position: absolute;
  left: 50%;
  bottom: 50vh;
  transform: translate(-50%, 0%);
  transform-origin: bottom;
  width: 30vh;
  margin-bottom: 3.5vh;
}

.p-loading__logo {

}

.p-loading__bar-area {
  width: 3.6rem;
  height: 10rem;
}

.p-loading__logo img {
  width: 100%;
  filter: drop-shadow(0 0 0.6rem rgba(255, 255, 255, 1));
} */


/* ===================================================
 * Fireflower Animation
 * =================================================== */
/* .fireflower {
  position: absolute;
  bottom: calc(var(--o-t-bottom) + var(--cta-area-height));
  left: 0;
  right: 0;
  width: 3.6rem;
  margin: auto;
  height: calc(50vh - calc(var(--o-t-bottom) + var(--cta-area-height)));
}

.fireflower.f_line {
  bottom: calc(var(--o-t-bottom) + 1.8rem + var(--cta-area-height));
  height: calc(50vh - 1.8rem - calc(var(--o-t-bottom) + var(--cta-area-height)));
}

@media screen and (min-aspect-ratio: 9/16) {
  .fireflower {
    bottom: calc(var(--n-s-bottom) + var(--cta-area-height));
    height: calc(50vh - calc(var(--n-s-bottom) + var(--cta-area-height)));
  }

  .fireflower.f_line {
    bottom: calc(var(--n-s-bottom) + 1.8rem + var(--cta-area-height));
    height: calc(50vh - 1.8rem - calc(var(--n-s-bottom) + var(--cta-area-height)));
  }
}

@media screen and (min-aspect-ratio: 3/4) {
  .fireflower {
    bottom: calc(var(--t-f-bottom) + var(--cta-area-height));
    height: calc(50vh - calc(var(--t-f-bottom) + var(--cta-area-height)));
  }

  .fireflower.f_line {
    bottom: calc(var(--t-f-bottom) + 1.2rem + var(--cta-area-height));
    height: calc(50vh - 1.2rem - calc(var(--t-f-bottom) + var(--cta-area-height)));
  }
}

@media screen and (min-aspect-ratio: 1/1) {
  .fireflower {
    bottom: calc(var(--o-o-bottom) + var(--cta-area-height));
    height: calc(50vh - calc(var(--o-o-bottom) + var(--cta-area-height)));
  }

  .fireflower.f_line {
    bottom: calc(var(--o-o-bottom) + 1.8rem + var(--cta-area-height));
    height: calc(50vh - 1.8rem - calc(var(--o-o-bottom) + var(--cta-area-height)));
  }
}

@media screen and (min-aspect-ratio: 4/3) {
  .fireflower {
    bottom: calc(var(--f-t-bottom) + var(--cta-area-height));
    height: calc(50vh - calc(var(--f-t-bottom) + var(--cta-area-height)));
  }

  .fireflower.f_line {
    bottom: calc(var(--f-t-bottom) + 1.6rem + var(--cta-area-height));
    height: calc(50vh - 1.6rem - calc(var(--f-t-bottom) + var(--cta-area-height)));
  }
}

@media screen and (min-aspect-ratio: 16/9) {
  .fireflower {
    bottom: calc(var(--s-n-bottom) + var(--cta-area-height));
    height: calc(50vh - calc(var(--s-n-bottom) + var(--cta-area-height)));
  }

  .fireflower.f_line {
    bottom: calc(var(--s-n-bottom) + 1.8rem + var(--cta-area-height));
    height: calc(50vh - 1.8rem - calc(var(--s-n-bottom) + var(--cta-area-height)));
  }
}




#fireflower line {
  stroke-width: 1px;
}

.fireflower line {
  stroke: currentColor;
  filter: drop-shadow(0 0 0.3rem rgba(255, 255, 255, 1));
} */

/* -------------------------------------
 * フェーズ1: 落ちるしずく（移動）
 * ------------------------------------- */
/* #line-vertical {
}

.animation-start #line-vertical {
  animation: drop-fall 3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes drop-fall {
  0% {
    transform: translateY(-20px);
    opacity: 1;
  }

  35% {
    transform: translateY(73.5px);
    opacity: 1;
  }

  36%,
  100% {
    transform: translateY(73.5px);
  }
} */

/* -------------------------------------
 * フェーズ2: 花火の広がり（拡大）
 * ------------------------------------- */
/* #sparks {
  transform-origin: 19px 93.467px;
  transform: scale(0);
}

.animation-start #sparks {
  animation: firework-explode 3s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@keyframes firework-explode {

  0%,
  34% {
    transform: scale(0);
  }

  35% {
    transform: scale(0.2);
  }

  60% {
    transform: scale(1);
  }

  80%,
  100% {
    transform: scale(1.1);
  }
} */

/* -------------------------------------------------------------------------
  l-header
  ------------------------------------------------------------------------- */
.l-header {
  --header-logo-color: var(--color-white);
  --header-border-color: var(--color-white);

  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--header-height);
  z-index: var(--layer-header);
  background-color: var(--color-white);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.l-header.is-scrolled {
  opacity: 1;
  visibility: visible;
}

.l-header__inner {
  max-width: 120rem;
  margin-left: auto;
  margin-right: auto;

  display: flex;
  justify-content: space-between;
  height: 100%;
}

@media screen and (min-width: 1024px) {
  .l-header__inner {
    padding-inline: 0;
  }
}

.l-header__logo {
  flex: 0 1 16.7rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  padding: 0 1.5rem;
  color: var(--header-logo-color);
  transition: color 0.3s ease-out;
}

@media screen and (min-width: 768px) {
  .l-header__logo {
    padding: 0 2rem;
  }
}

@media screen and (min-width:1280px) {
  .l-header__logo {
    padding-left: 0;
  }
}


/* -------------------------------------------------------------------------
    header nav
    ------------------------------------------------------------------------- */
.l-header__nav {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100vh;
  padding-top: var(--header-height);
  background-color: var(--color-white);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.15s var(--linear) visibility 0s linear 0.15s;
}

/* SPメニュー展開時のアクティブ状態 */
.l-header__nav.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transition:
    opacity var(--duration-nav-base) var(--ease-out),
    visibility 0s linear 0s;
}

/* ナビゲーション内部レイアウト */
/* navコンテンツラッパー */
.l-header-nav {
  height: 100%;
  padding: 5rem 0;
}

.l-header-nav__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;

  max-width: var(--max-width-size);
  margin-inline: auto;
}

/* コンテンツエリア（スクロール領域） */
.l-header-nav__content {
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.menu-wrapper>li>a {
  display: block;
  padding: 1.5rem 3rem;
}


/* -------------------------------------------------------------------------
    header hamburger 
    ------------------------------------------------------------------------- */
.l-header__hamburger {
  --line-width: 2rem;
  --line-space: 0.8rem;
  --line-thickness: 0.2rem;

  /*  変形（×印）時に中央へ移動させる距離 */
  --move-distance: calc((var(--line-space) + var(--line-thickness)) / 2);

  width: var(--header-height);
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--line-space);

  cursor: pointer;
  background: transparent;
  border: none;
  padding: 0;
}

.l-header__hamburger::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 1px;
  background-color: var(--header-border-color);
}

.l-header__hamburger.is-active::before {
  display: none;
}


.l-header__hamburger-line {
  display: block;
  width: var(--line-width);
  height: var(--line-thickness);
  background-color: var(--header-border-color);
  transition: transform 0.3s ease, opacity 0.25s ease;
}

.l-header__hamburger.is-active .l-header__hamburger-line:nth-child(1) {
  transform: translateY(var(--move-distance)) rotate(45deg);
}

.l-header__hamburger.is-active .l-header__hamburger-line:nth-child(2) {
  transform: translateY(calc(var(--move-distance) * -1)) rotate(-45deg);
}

.l-header:has(.l-header__nav.is-active) .l-header__hamburger-line {
  background-color: var(--color-black) !important;
}

/* トップ動画開始時 */
body:has(.mov-start) .l-header__hamburger-line {
  background-color: var(--color-white);
}

/* トップ動画がフェイドを始めた時 */
body:has(.mov-showoff-strat) .l-header__hamburger-line {
  background-color: var(--color-black);
}

/* スクロールした時 */
.l-header.is-scrolled .l-header__hamburger-line {
  background-color: var(--color-black) !important;
}

/* -------------------------------------------------------------------------
  l-main
  ------------------------------------------------------------------------- */
.l-main {
  position: relative;
  z-index: 2;
}

/* -------------------------------------------------------------------------
  l-footer
  ------------------------------------------------------------------------- */

.l-footer {
  position: relative;
  padding-top: 10rem;
  padding-bottom: 10rem;
  background-color: var(--color-white);
  margin-bottom: var(--cta-area-height);
}

@media screen and (min-width: 1024px) {
  .l-footer {
    padding-top: 20rem;
    padding-bottom: 20rem;
  }
}

.l-footer__logo {
  max-width: 13rem;
  margin: 0 auto;
}

.l-footer {
  min-height: var(--content-screen-height);
  display: flex;
  align-items: center;
  position: sticky;
  bottom: 0;
  z-index: 1;
}

.l-footer__logo {
  max-width: 20rem;
}

/* -------------------------------------------------------------------------
    cta
  ------------------------------------------------------------------------- */
.l-floating-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: var(--cta-area-height);
  z-index: var(--layer-cta);
  overflow: hidden;
  background: #fff;

}



@media screen and (min-width: 1024px) {
  .l-floating-cta {
    bottom: 3rem;
    left: auto;
    right: 0;
    width: 30.5rem;
  }
}

@supports (background: -webkit-named-image(i)) {
  @media screen and (max-width:767px) {
    .l-floating-cta {
      border-bottom: solid 1px #fff;
    }
  }
}

body.-fixed .l-floating-cta {
  z-index: 1;
}



.l-floating-cta__inner {
  width: 100%;
  height: 100%;
}

.l-floating-cta__button {
  width: 100%;
  height: 100%;
}

/* -------------------------------------------------------------------------
    p-top
  ------------------------------------------------------------------------- */
.p-top {
  padding: 10rem 0 0;
}



.p-top__inner {
  /* max-width: var(--layout-max-width); */
  margin-left: auto;
  margin-right: auto;
}

.p-top__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}


@media screen and (min-width:768px) {
  .p-top__content {
    gap: 4rem;
  }
}

@media screen and (min-width:1024px) {
  .p-top__content {
    gap: 2.5rem;
  }
}

.p-top__title {
  padding-inline: var(--content-side);
}

.p-top__title-inner {
  display: block;
  margin-inline: auto;
}

@media screen and (min-width:768px) {
  .p-top__title-inner {
    width: 62%;
  }
}

@media screen and (min-width:1024px) {
  .p-top__title-inner {
    max-width: 31.5rem;
  }
}

.p-top__title-cdl {
  display: block;
}

.p-top__title-cmr {
  display: block;
  width: 70%;
  margin-top: 8%;
  margin-inline: auto;
}

@media screen and (min-width: 768px) {
  .p-top__title-cmr {
    margin-top: 9%;

  }
}

@media screen and (min-width: 1024px) {
  .p-top__facade .c-figcaption--right {
    padding-right: 5%;
  }
}

@media screen and (min-width:1280px) {
  .p-top {
    padding-top: 12.5vh;
  }

  .p-top__content {
    gap: 3.125vh;
    overflow: hidden;
  }

  .p-top__facade {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    width: 168vh;
    /* max-width: 106vw; */
    max-width: none;
  }


  .p-top__title-inner {
    width: 39.3vh;
    max-width: none;
  }
}

@media screen and (min-width:1920px) {
  .p-top {
    padding-top: 9.2vh;
  }

  .p-top__content {
    gap: 9vh;
  }

  .p-top__facade {

    width: 177.7vh;
    /* max-width: 100vw; */
  }


  .p-top__title-inner {
    width: 29vh;
    /* max-width: 16.4vw; */

  }
}

/* -------------------------------------------------------------------------
    p-news
  ------------------------------------------------------------------------- */
.p-news {
  overflow: hidden;
}

@media screen and (min-width: 768px) {

  .p-news .l-container {
    max-width: 48.8rem;
    padding-inline: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-news {
    padding-top: 12rem;
  }
}

.p-news__body {
  display: flex;
  flex-direction: column;
  gap: 7rem;
}

/* 
@media screen and (min-width: 768px) {
  .p-news__body {
    gap: 7.5rem;
  }

} */

.p-news__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.p-news__title {}

@media screen and (min-width: 768px) {
  .p-news__title {
    width: 47rem;
    margin-inline: auto;
  }
}


.p-news__title-cnt {
  position: relative;
  display: block;
  padding-top: 15%;
  margin-top: -15%;
}

.p-news__title-cnt::before {
  content: "";
  position: absolute;
  top: 0;
  left: 3.5%;
  display: block;
  width: 33%;
  height: 100%;
  background-image: url(../../images/toyohira-comorinoki/debut.png);
  background-position: top left 10%;
  background-size: contain;
  background-repeat: no-repeat;
}

.p-news__title-img {
  display: block;
  width: 68%;
  margin-inline: auto;
}

.p-news__lead {
  font-size: 1.3rem;
}

@media screen and (min-width: 768px) {
  .p-news__lead {
    font-size: var(--font-size-md);
  }
}

.p-news__content {
  margin-inline: -0.5rem;
}

@media screen and (min-width: 768px) {
  .p-news__content {
    margin-inline: 0;
  }
}

.p-news__event {}

/*  期間限定イベント開催中*/
.c-band-limit {
  display: flex;
  align-items: center;
  gap: var(--space-3xs);
  padding: var(--space-2xs) var(--space-xs);
  background-color: var(--color-red-400);

}

.c-band-limit__title {
  flex-shrink: 0;
  font-size: var(--font-size-xl);
  letter-spacing: 0;
  line-height: var(--line-height-snug);
}

.c-band-limit__tag {
  width: 10rem;
}

@media screen and (min-width: 768px) {
  .c-band-limit__tag {
    width: 15rem;
  }

}

.c-band-limit__tag img {
  display: block;
}

/* スタンプラリー開催*/
.c-campaign {}

.c-campaign__limit {
  margin-bottom: var(--space-xs);
}

.c-campaign__title {
  margin-bottom: var(--space-xs);
}

.c-campaign__subtitle {
  display: block;
  font-size: var(--font-size-md);
  line-height: var(--line-height-reset);
  margin-bottom: 0.9em;
  letter-spacing: var(--letter-spacing-md);
}

.c-campaign__title-img {
  display: block;
}

.c-campaign__figure {
  margin-bottom: var(--space-xs);
}

.c-campaign__lead {
  font-size: var(--font-size-md);
  line-height: var(--line-height-relaxed);
}


.p-event-box {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-sm);
}

.p-event-box__header {}

.p-event-box__title {}



.p-event-box__lead {
  font-size: var(--font-size-md);
  line-height: var(--line-height-relaxed);

}

.p-event-box__notes {
  margin-top: var(--space-3xs);
}



/* -------------------------------------------------------------------------
     p-concept
  ------------------------------------------------------------------------- */
.l-peel__item>.p-concept {}

.p-concept {
  --copy-side-space: 1.5rem;
  --copy-width: 1.8rem;
  --_right-pd: calc(var(--copy-side-space) * 2 + var(--copy-width));
  position: relative;
  min-height: 0;
  padding-bottom: 0;
}

@media screen and (min-width: 768px) {
  .p-concept {
    /* --copy-side-space: 1.5rem; */
    --copy-width: 2.7rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-concept {
    --copy-side-space: 2.5rem;

  }
}

@media screen and (min-width: 768px) {
  .p-concept .l-container {
    --content-padding: 10rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-concept .l-container {
    --content-padding: var(--content-side);
  }
}


.p-concept__header {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding-top: 50%;
  padding-right: var(--_right-pd);
  padding-bottom: 66.5%;

  z-index: 1;
}

@media screen and (min-width: 768px) {
  .p-concept__header {
    padding-top: 41%;
    padding-bottom: 70%;
  }

}

@media screen and (min-width: 1024px) {
  .p-concept__header {
    padding-top: 23.4rem;
    padding-bottom: 50vw;
  }

}

.p-concept__copy {
  position: absolute;
  top: 0;
  right: 0;
  padding-inline: var(--copy-side-space);
}

.p-concept__copy-img {
  display: block;
  width: var(--copy-width);
}

.p-concept__title {
  display: block;
  width: 17em;
  margin-bottom: var(--space-2xs);
}

.p-concept__title-img {
  display: block;
}

.p-concept__lead {
  font-size: var(--font-size-2xl);
  letter-spacing: var(--letter-spacing-lg);
}

.p-concept__text-lg {
  letter-spacing: var(--letter-spacing-lg);
}

.p-concept__text-md {
  font-size: var(--font-size-md);
  letter-spacing: var(--letter-spacing-lg);
}

.p-concept__bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

.p-concept__bg.c-fade-overlay::after {
  display: none;
}

.p-concept__bg-img {}

/* -------------------------------------------------------------------------
  p-detail
------------------------------------------------------------------------- */
.p-detail {
  --deco-line-width: 5rem;
  --deco-line-height: 200%;
  --side-space: 16%;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .p-detail {
    --deco-line-width: 13rem;
    --deco-line-height: 100%;
    --side-space: 13%;
  }
}

@media screen and (min-width: 1024px) {

  .p-detail {
    --deco-line-width: 18rem;
    --side-space: 12%;
  }
}

.p-detail.c-fade-overlay {
  --fade-height-bottom: 100%;
  --fade-color-bottom: #D9D9D9;
}

.p-detail.c-fade-overlay::before {
  display: none;
}

.p-detail.c-fade-overlay>.l-container {
  position: relative;
  z-index: 1;
}

.p-detail__wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.p-detail__sub {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

@media screen and (min-width:768px) {
  .p-detail__sub {
    flex-direction: row;
  }
}

.p-detail__sub .p-detail__img {
  display: block;
  border: solid 0.15rem var(--color-black-200);
  margin-top: -1px;
}

@media screen and (min-width:768px) {
  .p-detail__sub .p-detail__figure {
    width: 37.1rem;
  }
}

@media screen and (min-width:768px) {
  .p-detail__sub .p-detail__body {
    flex: 1 1 0%;
  }
}


.p-detail__sub--top .p-detail__body {
  padding-left: var(--side-space);
}

@media screen and (min-width:768px) {
  .p-detail__sub--top .p-detail__body {
    padding-left: 0;
  }
}

@media screen and (min-width:768px) {
  .p-detail__sub--top .p-detail__figure {
    display: flex;
    flex-direction: column-reverse;

  }
}

@media screen and (min-width: 768px) {
  .p-detail__sub--top .p-detail__figcap {
    clip-path: polygon(0 0, 100% 0, calc(100% - 0.7em) 0, 100% 100%, 0 100%);
  }
}

.p-detail__figure {
  position: relative;
}

.p-detail__deco-line {
  position: absolute;
  bottom: 62%;
  left: var(--side-space);
  width: 1px;
  height: var(--deco-line-height);
  background: var(--color-black-200);
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .p-detail__deco-line {
    bottom: 66%;
  }
}

@media screen and (min-width: 768px) {
  .p-detail__deco-line::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: var(--deco-line-width);
    height: 0.1rem;
    background: var(--color-black-200);
  }
}


.p-detail__deco-line-2 {
  position: absolute;
  top: 25%;
  right: var(--side-space);
  width: 1px;
  height: var(--deco-line-height);
  background: var(--color-black-200);
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .p-detail__deco-line-2 {
    top: 28%;
  }
}

.p-detail__deco-line-2::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: var(--deco-line-width);
  height: 0.1rem;
  background: var(--color-black-200);
}

.p-detail__figcap {
  display: block;
  width: fit-content;
  font-size: 1.4rem;
  padding: 0.7em;
  padding-right: 1.4em;
  background-color: var(--color-black-200);
  clip-path: polygon(0 0, 100% 0, 100% 0, calc(100% - 0.7em) 100%, 0 100%);
}

.p-detail__figcap-text {
  display: block;
  /* font-size: var(--font-size-2xl); */
  font-size: 1.8rem;

  color: var(--color-white);
  line-height: var(--line-height-reset);
  letter-spacing: var(--letter-spacing-lg);
  border-bottom: solid 0.2rem var(--color-red-400);
}

.p-detail__img {
  display: block;
}

.p-detail__body {}

@media screen and (min-width: 768px) {
  .p-detail__body {
    padding-top: 3.2rem;
  }
}

.p-detail__title {
  margin-bottom: 1em;
  /* font-size: var(--font-size-lg); */
  font-size: 1.4rem;
  letter-spacing: var(--letter-spacing-lg);
}

@media screen and (min-width: 768px) {
  .p-detail__title {
    margin-bottom: 0.4em;
  }
}

.p-detail__text {
  /* font-size: var(--font-size-md); */
  font-size: 1.2rem;
}

.p-detail__main {}

@media screen and (min-width: 1024px) {

  .p-detail__main.u-breakout-full {
    margin-inline: -6rem;
  }
}

@media screen and (min-width: 1024px) {

  .p-detail__main .c-figcaption {
    padding-left: 5.5%;
  }
}

.p-detail__sub--bottom {
  flex-direction: column-reverse;
  gap: var(--space-xs);
}

@media screen and (min-width: 768px) {
  .p-detail__sub--bottom {
    flex-direction: row-reverse;
  }

}

.p-detail__sub--bottom .p-detail__body {
  padding-right: var(--side-space);
}

@media screen and (min-width: 768px) {
  .p-detail__sub--bottom .p-detail__body {
    padding-right: 0;
  }
}

.p-detail__sub {}

.p-detail__sub--bottom .p-detail__figure {
  display: flex;
  flex-direction: column-reverse;
}

.p-detail__sub--bottom .p-detail__figcap {
  margin-left: auto;
  margin-right: 0;
  padding: 0.7em;
  padding-left: 1.4em;
  clip-path: polygon(0.7em 0, 100% 0, 100% 100%, 0 100%);
}

.p-detail__button {
  margin-top: var(--space-3xl);
  position: relative;
  z-index: 1;
}

/* -------------------------------------------------------------------------
  p-fp
------------------------------------------------------------------------- */
.p-fp {}

.p-fp__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
}

@media screen and (min-width: 768px) {
  .p-fp__body {
    gap: 5rem;
  }
}

/* ----------------------------------
  p-fp-summary
---------------------------------- */
.p-fp-summary {
  display: flex;
  flex-direction: column;
  /* gap: var(--space-lg); */
  gap: 3rem;
}

.p-fp-summary__content {}

.p-fp-summary__title {
  width: fit-content;
  margin-bottom: 1.1em;
  /* font-size: var(--font-size-2xl); */
  font-size: 1.8rem;
  letter-spacing: var(--letter-spacing-lg);
  line-height: 1;
  padding: 0.3em 0.7em;
  border: solid 0.1rem currentColor;
}

.p-fp-summary__spec {
  margin-bottom: var(--space-xs);
}

@media screen and (min-width: 768px) {
  .p-fp-summary__spec {
    display: flex;
    gap: 1.5em;
    margin-bottom: 1.3rem;
  }
}

.p-fp-summary__spec-item {
  display: flex;
}

.p-fp-summary__spec-term {
  flex-shrink: 0;
  /* font-size: var(--font-size-lg); */
  font-size: 1.4rem;
  letter-spacing: var(--letter-spacing-lg);
}

.p-fp-summary__spec-term::after {
  content: "/";
}

.p-fp-summary__spec-desc {
  /* font-size: var(--font-size-lg); */
  font-size: 1.4rem;
  letter-spacing: var(--letter-spacing-lg);
}

.p-fp-summary__notes {}

.p-fp-summary__notes .c-inline-notes__item {
  display: inline;
}

.p-fp-summary__media {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

@media screen and (min-width: 768px) {
  .p-fp-summary__media {

    flex-direction: row;
    gap: 4rem;

  }
}

.p-fp-summary__figure {
  position: relative;
}

.p-fp-summary__figure--2f {
  margin-top: 2rem;
}

@media screen and (min-width: 768px) {
  .p-fp-summary__figure--2f {
    margin-top: 0;
  }
}

.p-fp-summary__figure--2f .p-fp-summary__caption {
  position: absolute;
  top: 0;
  left: 0;
}

@media screen and (min-width: 768px) {
  .p-fp-summary__figure--2f .p-fp-summary__caption {
    position: relative;


  }
}

.p-fp-summary__caption {
  /* font-size: var(--font-size-xl); */
  font-size: 1.6rem;
  line-height: var(--line-height-reset);
  letter-spacing: var(--letter-spacing-lg);
  margin-bottom: 0.9em;
}

.p-fp-summary__img {}

/* -------------------------------------------------------------------------
  p-fp-deetail
------------------------------------------------------------------------- */

.p-fp-detail {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

@media screen and (min-width: 768px) {
  .p-fp-detail {
    padding-inline: 5rem;
    margin-top: 5rem;
  }
}

@media screen and (min-width: 768px) {

  .p-fp-detail {
    padding-inline: 8rem;
  }
}

.p-fp-detail__title {
  width: fit-content;
  /* font-size: var(--font-size-xl); */
  font-size: 1.6rem;
  letter-spacing: var(--letter-spacing-catch-md);
  border-bottom: solid 0.2rem var(--color-red-400);
}

.p-fp-detail__item {}

.p-fp-detail__figure {
  margin-bottom: var(--space-2xs);
}

.p-fp-detail__img {}

.p-fp-detail__subtitle {
  display: flex;
  align-items: center;
  gap: 0.3em;
  margin-bottom: 0.4em;

  /* font-size: var(--font-size-xl); */
  font-size: 1.6rem;
}

.p-fp-detail__subtitle-num {
  display: block;
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  /* font-size: var(--font-size-md); */
  font-size: 1.2rem;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-red-400);
  border-radius: 50%;
  overflow: hidden;
}

.p-fp-detail__subtitle-text {
  line-height: var(--line-height-reset);
}


.p-fp-detail__text {
  /* font-size: var(--font-size-md); */
  font-size: 1.2rem;
}

/* -------------------------------------------------------------------------
  p-fp-si
------------------------------------------------------------------------- */
.p-fp-si {
  position: relative;
  padding: 6rem 2rem 2rem;
  border: solid 0.1rem var(--color-black);
}

@media screen and (min-width:768px) {
  .p-fp-si {
    margin-top: 5rem;
    margin-inline: 5rem;
    padding: 7.5rem 4rem 4rem;
  }
}

@media screen and (min-width:1024px) {
  .p-fp-si {
    margin-inline: 0;
    padding: 7.5rem 5rem 5rem;
  }
}

.p-fp-si::before {
  --icon-width: 10rem;
  content: "";
  position: absolute;
  top: -1.5rem;
  left: -1.5rem;
  display: block;
  width: var(--icon-width);
  height: var(--icon-width);
  pointer-events: none;
  background-image: url(../../images/toyohira-comorinoki/new-in-hokkado.png);
  background-size: contain;
  background-position: top left;
  background-repeat: no-repeat;
}

@media screen and (min-width: 1024px) {
  .p-fp-si::before {
    --icon-width: 15rem;
    top: -2.5rem;
    left: -2.5rem;
  }
}

.p-fp-si__body {
  display: flex;
  flex-direction: column;
  /* gap: var(--space-4xl); */
  gap: 7.5rem;
}

.p-fp-si__about {}

.p-fp-si__title {
  /* margin-bottom: var(--space-lg); */
  /* margin-bottom: 3rem; */
  margin-bottom: 0;
}

.p-fp-si__title-img-wrap {
  display: block;
  padding-inline: 1rem;
}

@media screen and (min-width: 768px) {
  .p-fp-si__title-img-wrap {
    width: 38rem;
    margin-inline: auto;
    padding-inline: 0;
  }
}


.p-fp-si__title-img {
  display: block;
  margin-bottom: 13%;
}

.p-fp-si__title-text {
  display: block;
  font-size: 1.3rem;
  margin-bottom: 1em;
}

@media screen and (min-width: 768px) {
  .p-fp-si__title-text {
    font-size: 2.4rem;
  }
}

.p-fp-si__text {
  margin-bottom: 1.1em;
  font-size: var(--font-size-md);
}

@media screen and (min-width: 768px) {
  .p-fp-si__text {
    font-size: 1.6rem;
  }
}

.p-fp-si__caution-list {}

.p-fp-si__dj {}

.p-fp-si__dj-title {
  /* margin-bottom: var(--space-sm); */

  margin-bottom: 1.5rem;
}

.p-fp-si__dj-title-main {
  display: block;
  font-size: var(--font-size-3xl);
  line-height: var(--line-height-reset);
  margin-bottom: 1em;
}

@media screen and (min-width: 768px) {
  .p-fp-si__dj-title-main {
    margin-bottom: 1.8rem;
  }
}

.p-fp-si__dj-title-sub {
  display: block;
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
}


.p-fp-si__dj-text {
  font-size: var(--font-size-md);
  margin-bottom: var(--space-lg);
}

@media screen and (min-width: 768px) {
  .p-fp-si__dj-text {
    font-size: 1.6rem;

  }
}

.p-fp-si__figure {}

.p-fp-detail__figure-title {
  display: block;
  margin-bottom: var(--space-sm);
  padding: 0.7em;
  font-size: var(--font-size-lg);
  line-height: var(--line-height-reset);
  color: var(--color-white);
  background-color: var(--color-red);
}

@media screen and (min-width: 768px) {

  .p-fp-detail__figure-title {
    width: fit-content;
    margin-inline: auto;
  }
}

.p-fp-si__img {
  display: block;
  margin-bottom: var(--space-xs);
}

.p-fp-detail__figure-note {
  font-size: 10px;
  line-height: var(--line-height-reset);
  text-align: right;
}

.p-fp-detail__figure-note::before {
  content: "※";
}

/* -------------------------------------------------------------------------
  p-venue
  ------------------------------------------------------------------------- */
.p-venue {
  padding-bottom: 0;
}

.p-venue__content {}

@media screen and (min-width: 768px) {
  .p-venue__content {
    padding-inline: 5rem;

  }
}

.p-venue__title {
  margin-bottom: var(--space-lg);
}

.p-venue__title-img {}

.p-venue__lead {}

.p-venue__info {
  font-size: 1.4rem;
  margin-bottom: var(--space-lg);
}

@media screen and (min-width: 768px) {
  .p-venue__info {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1em;
  }
}

.p-venue__address {}

@media screen and (min-width: 768px) {
  .p-venue__address {
    display: flex;
    gap: 1em;
    width: 100%;
  }
}

.p-venue__day-off {}

@media screen and (min-width: 768px) {
  .p-venue__day-off {
    display: flex;
    gap: 1em;
    width: 100%;
  }
}

.p-venue__day-off span {
  display: block;
}

.p-venue__day-off span::before {
  content: "※";
}

.p-venue__figure {}

.p-venue__picture {}

.p-venue__img {}

.p-map {
  margin-top: 7.5rem;
  display: block;
  height: 156vw;
  /* 消す */
  background-color: #e0e0e0;
}

@media screen and (min-width: 768px) {
  .p-map {
    height: 75vw;
  }
}

@media screen and (min-width: 1280px) {
  .p-map {
    height: 76.8rem;
  }
}

/* -------------------------------------------------------------------------
  p-contact
  ------------------------------------------------------------------------- */
.p-sec-contact {
  padding: 0;
}

/* -------------------------------------------------------------------------
  p-stamp
  ------------------------------------------------------------------------- */
/* p-stamp  */
.p-stamp {
  padding: var(--section-space-v) 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

@media screen and (max-width:767px) {
  .p-stamp {
    background-image: url(../../images/frontier-village-tonden/p-stamp-bg.jpg);
  }
}

@media screen and (min-width:768px) and (max-width:1023px) {
  .p-stamp {
    background-image: url(../../images/frontier-village-tonden/p-stamp-bg_tab.jpg);
  }
}

@media screen and (min-width:1024px) and (max-width: 1919px) {
  .p-stamp {
    background-image: url(../../images/frontier-village-tonden/p-stamp-bg_pc.jpg);
  }
}

@media screen and (min-width:1920px) {
  .p-stamp {
    background-image: url(../../images/frontier-village-tonden/p-stamp-bg_pc.jpg);
  }
}

.p-stamp__header {
  margin-bottom: 3.5rem;
}

@media screen and (min-width: 768px) {
  .p-stamp__header {
    width: 47rem;
    margin-inline: auto;
    margin-bottom: 4.5rem;
  }
}


.p-stamp .c-band-limit {
  margin-bottom: 3.5rem;
}

.p-stamp .c-campaign__title {
  margin-bottom: var(--space-sm);
}

.p-stamp .c-campaign__subtitle {
  font-size: var(--font-size-lg);
}

.p-stamp .c-campaign__limit {
  margin-bottom: var(--space-sm);
}

.p-stamp .c-campaign__figure {
  margin-bottom: var(--space-xl);
}

.p-stamp__body {}

@media screen and (min-width: 768px) {
  .p-stamp__body {
    width: 47rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp__body {
    width: 100%;
  }
}

.p-stamp-content {
  --padding-size: 3rem;
  padding: var(--padding-size);
  border-radius: 3rem;
  line-height: var(--line-height-body);
  background-color: var(--color-white);
  box-shadow: 0.2rem 0.2rem 0.8rem rgba(0, 0, 0, 0.33);
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .p-stamp-content {
    --padding-size: 4.5rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content {
    --padding-size: 3rem;
  }
}

.p-stamp-content__inner {}

.p-stamp-content__list {
  margin-bottom: 3rem;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__list {
    position: relative;
    display: flex;
    margin-bottom: 0;
  }
}

.p-stamp-content__item {}


.p-stamp-content__item::after {
  content: "";
  display: block;
  width: 100%;
  height: 1.2rem;
  margin: 3rem 0;
  background-image: url(../../images/frontier-village-tonden/separate-arrow.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__item::after {
    height: 1.7rem;
    margin: 4.5rem 0;
    background-image: url(../../images/frontier-village-tonden/separate-arrow_tab.png);
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item::after {
    display: none;
  }
}

.p-stamp-content__item:last-child::after {
  display: none;
}

.p-stamp-content__item-title {
  position: relative;
  display: block;
  padding: 0.8em;
  margin-bottom: 1.5em;
  font-size: var(--font-size-md);
  line-height: var(--line-height-reset);
  text-align: center;
  border-radius: 1.6em;
  background-color: var(--color-yellow);
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item-title {
    font-size: 1.2rem;
  }
}

.p-stamp-content__item-title::before {
  content: "";
  position: absolute;
  top: -25%;
  left: -9.5%;
  display: block;
  height: 100%;
  width: 19%;
  background-size: contain;
  background-position: top left;
  background-repeat: no-repeat;
  z-index: 1;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item-title::before {
    width: 50px;
    top: -32%;
    left: -10%;
  }
}

.p-stamp-content__item--first .p-stamp-content__item-title::before {
  background-image: url(../../images/frontier-village-tonden/icon_stamp-first.png);
}

.p-stamp-content__item--second .p-stamp-content__item-title::before {
  background-image: url(../../images/frontier-village-tonden/icon_stamp-second.png);
}

.p-stamp-content__brand-icon {
  font-size: 1.2rem;
  margin-bottom: 0.7em;
}


.p-stamp-content__brand-icon img {
  display: block;
  width: 8.2em;
  margin-inline: auto;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__brand-icon img {
    width: 12.5em;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__brand-icon img {
    width: 8.2em;
  }
}

.p-stamp-content__item-figure {
  margin-bottom: 2rem;
}


.p-stamp-content__item-figure figcaption {
  position: relative;
  margin-bottom: 1.4rem;
  padding: 1em;
  font-size: 1.1rem;
  text-align: center;
  background-color: #E2E5DE;

}

@media screen and (min-width: 768px) {
  .p-stamp-content__item-figure figcaption {
    font-size: 1.6rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item-figure figcaption {
    display: flex;
    align-items: center;

    font-size: 1.1rem;
    margin-bottom: 0;
    margin-left: 1.7rem;
    /* padding: 2.5rem 2rem; */
    padding: 1em;
    text-align: left;

  }
}

.p-stamp-content__item-figure figcaption::after {
  content: "";
  position: absolute;
  bottom: -1.6rem;
  right: 22%;
  display: block;
  width: 1.2rem;
  height: 1.6rem;
  background-color: #E2E5DE;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item-figure figcaption::after {
    top: 50%;
    right: 100%;
    bottom: auto;
    transform: translateY(-50%);
    width: 1.2rem;
    height: 0.8rem;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
  }

}

.p-stamp-content__item-text {
  margin-bottom: 0.5em;
  font-size: var(--font-size-2xl);
  text-align: center;
  letter-spacing: 0;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item-text {
    font-size: 1.8rem;
  }
}

.p-stamp-content__item-text small {
  font-size: 0.7em;
}

.p-stamp-content__info {
  margin-bottom: 1em;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__info {
    margin-bottom: 1rem;
  }
}

.p-stamp-content__info-row {
  display: flex;
  align-items: baseline;
  gap: 0.9rem;
}

.p-stamp-content__info-term {
  flex-shrink: 0;
  width: 3.8em;
  padding: 0.25em 0.8em;
  font-size: var(--font-size-md);
  line-height: var(--line-height-reset);
  text-align: center;
  border: solid 1px currentColor;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__info-term {
    font-size: 1.2rem;
  }
}

.p-stamp-content__info-desc {
  font-size: 1.5rem;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__info-desc {
    font-size: 2.2rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__info-desc {
    font-size: 1.5rem;
  }
}

.p-stamp-content__item-note {
  font-size: 1rem;
  padding-left: 1em;
  text-indent: -1em;
}

.p-stamp-content__item-note::before {
  content: "※";
}

.p-stamp-content__info-desc-subblock {
  display: block;
  margin-bottom: 0.5em;
  font-size: var(--font-size-md);
  line-height: var(--line-height-reset);
  font-feature-settings: "palt";
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__info-desc-subblock {
    font-size: 1.2rem;
  }
}

.p-stamp-content__info-desc-block {
  display: block;
  font-size: 1.5rem;
  line-height: var(--line-height-reset);
}

@media screen and (min-width: 768px) {
  .p-stamp-content__info-desc-block {
    font-size: 2.2rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__info-desc-block {
    font-size: 1.5rem;
  }

}

.p-stamp-content__address {}

.p-stamp-content__address-row {
  display: flex;
  align-items: baseline;
}

.p-stamp-content__address-term {
  font-size: var(--font-size-md);
  width: 3.2em;
  flex-shrink: 0;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__address-term {
    font-size: 1.2rem;
  }
}

.p-stamp-content__address-term::after {
  content: "：";
}

.p-stamp-content__address-desc {
  font-size: var(--font-size-md);
  letter-spacing: 0;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__address-desc {
    font-size: 1.2rem;
  }
}

.p-stamp-content__btn {
  margin-top: 2rem;
  width: 100%;
  padding: 1em 0.5em;
  font-size: var(--font-size-md);
  line-height: var(--line-height-reset);
  text-align: center;
  border: solid 1px currentColor;
  box-shadow: 0.3rem 0.3rem 0.6rem rgba(0, 0, 0, 0.15);
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__btn {
    font-size: 1.2rem;
    margin-top: 0;
    transition: opacity 0.3s ease;
  }

  .p-stamp-content__btn:hover {
    opacity: 0.7;
  }
}

.js-dialog-open {}

.p-stamp-content__dialog {}

.js-dialog {}

.p-stamp-content__dialog-close {}

.js-dialog-close {}

.p-stamp-content__band-text {
  font-size: var(--font-size-md);
  background-color: var(--color-yellow);
  text-align: center;
  padding: 2rem;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__band-text {
    padding: 3rem 2rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__band-text {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72.5%;
    margin-inline: auto;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    font-size: 1.4rem;
    line-height: var(--line-height-relaxed);
  }
}

.p-stamp-content__footer {
  position: relative;
  padding-top: 3rem;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__footer {
    margin-top: 3rem;
    padding-right: 20rem;
  }
}

.p-stamp-content__footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% + var(--padding-size) * 2);
  height: calc(100% + var(--padding-size));
  margin-left: calc(var(--padding-size) * -1);
  margin-right: calc(var(--padding-size) * -1);
  background-color: #EEE9D2;
}



.p-stamp-content__footer-inner {
  position: relative;
  margin-inline: -1rem;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__footer-inner {
    padding: 0 2rem;
    display: flex;
    gap: 1.5rem;
    align-items: center;
  }
}

.p-stamp-content__announce {
  padding: 0.6em;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  line-height: var(--line-height-reset);
  text-align: center;
  border: solid 1px currentColor;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__announce {
    font-size: 2.1rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__announce {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 9.5em;
    height: 3em;
    margin: 0;
    font-size: 1.5rem;
  }

}

.p-stamp-content__notes {
  line-height: 1.5;
}

.c-inline-notes {}

.c-inline-notes__item {
  letter-spacing: 0.01em;
}

/* １つ目 */
.p-stamp-content__item--first {
  position: relative;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--first {
    width: 40%;
    flex-shrink: 0;
    padding-right: 4.5rem;
    margin-right: 3rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--first::after {
    position: absolute;
    top: 0;
    left: 100%;
    transform: translateX(-100%);

    display: block;
    width: 1.15rem;
    height: 100%;
    margin: 0;
    background-image: url(../../images/frontier-village-tonden/saparate-arrow_pc.png);
  }
}



/* ２つ目 */
@media screen and (min-width: 1024px) {

  /* PCレイアウト */
  .p-stamp-content__item--second {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }

  .p-stamp-content__item--second .p-stamp-content__item-title,
  .p-stamp-content__item--second .p-stamp-content__item-text,
  .p-stamp-content__item--second .p-stamp-content__item-note,
  .p-stamp-content__item--second .p-stamp-content__pc-flex {
    width: 100%;
  }

  .p-stamp-content__item--second .p-stamp-content__brand-icon {
    width: fit-content;
    flex-shrink: 0;
    margin-right: 0.5em;
  }

  .p-stamp-content__item--second .p-stamp-content__brand-icon+.p-stamp-content__item-text {
    width: fit-content;
  }
}

.p-stamp-content__item--second .p-stamp-content__item-figure {
  margin-bottom: 1rem;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--second .p-stamp-content__item-figure {
    display: flex;
    align-items: stretch;
    flex-direction: row-reverse;
    width: 100%;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--second .p-stamp-content__item-figure img {
    display: block;
    width: 61.5%;
    height: auto;
    object-fit: contain;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--second .p-stamp-content__item-title::before {
    left: 14.5%;
  }
}

.p-stamp-content__item--second .p-stamp-content__item-note {
  margin-bottom: 2rem;
}



/* 最後 */
@media screen and (min-width: 1024px) {
  .p-stamp-content__item--last {
    position: absolute;
    top: 100%;
    right: 0;
    bottom: auto;
    transform: translateY(-19%);
    width: 20rem;
    z-index: 1;

  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__pc-flex {
    display: flex;
  }

  .p-stamp-content__pc-flex-start {
    width: 100%;
    flex-shrink: 0;
  }


}

.p-stamp-content__date dt,
.p-stamp-content__date dd {
  font-size: var(--font-size-sm);
}

@media screen and (min-width: 768px) and (max-width:1023px) {

  .p-stamp-content__date dt,
  .p-stamp-content__date dd {
    font-size: calc(var(--font-size-sm) * 1.5);
  }
}

.p-stamp-content__date {
  display: flex;
  flex-direction: column;
  gap: 0.4em;
  margin-top: 1em;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__date {
    margin-top: 1rem;
  }
}

.p-stamp-content__date>div {
  display: flex;
}

.p-stamp-content__date dt {
  min-width: 4em;
  flex-shrink: 0;
  margin-right: 1em;

}


.p-stamp-content__date dd small {
  display: inline-block;
  width: 100%;
  margin-left: 0;
  font-size: 1rem;
}

@media screen and (min-width: 768px) {
  .p-stamp-content__date dd small {
    width: auto;
    margin-left: 1em;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__date dd small {
    display: block;
    margin-left: 0;
  }

}

@media screen and (min-width: 1024px) {

  .u-mb-0-pc {
    margin-bottom: 0;
  }
}

.p-stamp__dialog {
  padding: 0;
  border: none;
  background: transparent;
  width: calc(100% - 6rem);
  max-width: 860px;
  max-height: 90vh;

  transition: display 0.2s allow-discrete, overlay 0.2s allow-discrete, opacity 0.2s ease;
  opacity: 0;
  /* 閉じている時は透明 */
}

.p-stamp__dialog[open] {
  opacity: 1;
}

@starting-style {

  /*@starting-styel→safari確認*/
  .p-stamp__dialog[open] {
    opacity: 0;
  }
}

/* dialogが開いている時の背景（黒い半透明） */
.p-stamp__dialog::backdrop {
  background-color: transparent;
  transition: display 0.2s allow-discrete, overlay 0.2s allow-discrete, background-color 0.2s ease;
}

/* 開いている時の状態 */
.p-stamp__dialog[open]::backdrop {
  background-color: rgba(0, 0, 0, 0.8);
}

/* 開き始めの初期状態 */
@starting-style {
  .p-stamp__dialog[open]::backdrop {
    background-color: transparent;
  }
}

/* モーダルの中身の白枠 */
.p-stamp__dialog-inner {
  position: relative;
  background: var(--color-white);
  padding: 5rem 3rem;
  padding-bottom: 3rem;
}

@media screen and (min-width: 768px) {
  .p-stamp__dialog-inner {
    padding: 10rem 6rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp__dialog-inner {
    padding: 6rem;
  }
}

.p-stamp__dialog-content {
  padding-top: 0.6rem;
}

@media screen and (min-width: 768px) {
  .p-stamp__dialog-content {
    padding-top: 3.4rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp__dialog-content {
    padding-top: 0;
    margin-top: -0.6rem;
  }
}

@media screen and (min-width: 768px) {
  .p-stamp__dialog-content {
    display: flex;
    --gap: 3rem;
    gap: var(--gap);
  }
}

.p-stamp__dialog-content figure:last-child {
  margin-bottom: 0;
}


/* 閉じるボタン */
.p-stamp__dialog-close {
  position: sticky;
  top: 0;
  display: block;
  width: 4.4rem;
  height: 4.4rem;
  margin-left: auto;
  margin-top: -5rem;
  margin-right: -3rem;

  background: none;
  border: none;
  line-height: 1;
  cursor: pointer;
  color: #333;

  background-color: rgba(255, 255, 255, 0.8);
}

@media screen and (min-width: 768px) {
  .p-stamp__dialog-close {
    width: 6.6rem;
    height: 6.6rem;

    margin-top: -10rem;
    margin-right: -6rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-stamp__dialog-close {
    margin-top: -6rem;
    margin-right: -6rem;
    transition: opacity 0.3s ease;
  }

  .p-stamp__dialog-close:hover {
    opacity: 0.7;
  }
}

.p-stamp__dialog-close-line {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 45%;
  height: 1px;
  background-color: #000;
}

.p-stamp__dialog-close-line:nth-of-type(1) {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.p-stamp__dialog-close-line:nth-of-type(2) {
  transform: translate(-50%, -50%) rotate(45deg);
}

/* モーダルコンテンツ */
.p-toyohira {
  display: flex;
  flex-direction: column;
  gap: 3rem;

  max-width: 46rem;
  margin-inline: auto;
}

.p-toyohira__header {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.p-toyohira__title {}

.p-toyohira__title>img {
  display: block;
  width: 100%;
  margin-inline: auto;
}

@media screen and (min-width: 768px) {
  .p-toyohira__title>img {
    width: 13em;

  }
}

.p-toyohira__lead {
  font-size: 1.6rem;
  line-height: var(--line-height-loose);
}

@media screen and (min-width: 768px) {

  .p-toyohira__body.u-breakout-1-5 {
    margin-left: auto;
    margin-right: auto;
  }
}

.p-toyohira__interior {
  --gap: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

@media screen and (min-width: 768px) {
  .p-toyohira__interior {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .p-toyohira__interior figure {
    width: 100%;
  }

  .p-toyohira__interior figure:nth-of-type(2),
  .p-toyohira__interior figure:nth-of-type(3) {
    width: calc((100% - var(--gap)) * 0.5);
  }
}

.p-toyohira__interior img {
  display: block;
  aspect-ratio: 10 / 7;
  object-fit: cover;
}

.p-toyohira__facade {
  margin-top: 5rem;
}

.p-toyohira__caution {
  margin-top: 5rem;
  font-size: 1rem;
}

@media screen and (min-width: 768px) {

  .p-toyohira__caution {
    margin-top: 6rem;
  }
}

.p-toyohira__caution::before {
  content: "※";
}

.p-stamp-content__btn {
  font-size: var(--font-size-sm);
}

.p-stamp-content__info-desc-block {
  line-height: var(--line-height-body);
}

.p-toyohira__facade {
  margin-top: 1.5rem;
}

@media screen and (min-width: 1024px) {
  .p-stamp-content__item--first::before {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    transform: translateX(-100%);
    display: block;
    width: 1.15rem;
    height: 100%;
    border-left: solid 1px #000;

    --gap-half: 15px;

    /* 変数 var(--gap-half) を使って計算 */
    -webkit-mask-image: linear-gradient(to bottom,
        black 0%,
        black calc(50% - var(--gap-half)),
        transparent calc(50% - var(--gap-half)),
        transparent calc(50% + var(--gap-half)),
        black calc(50% + var(--gap-half)),
        black 100%);
    mask-image: linear-gradient(to bottom,
        black 0%,
        black calc(50% - var(--gap-half)),
        transparent calc(50% - var(--gap-half)),
        transparent calc(50% + var(--gap-half)),
        black calc(50% + var(--gap-half)),
        black 100%);
  }
}





/* -------------------------------------------------------------------------
  p-form-container
  ------------------------------------------------------------------------- */
.p-form-container {
  --content-padding: var(--content-side);
  --content-max-width: var(--layout-max-width);

  padding: var(--section-space-v) 0;
  /* bodyに適用した、W6やW3などのwebフォント使用時に、ブラウザ側でフォントウェイト調整をかけさせないようにする指定を、土屋本体サイトフォームでは使わない */
  font-synthesis: weight style;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  background-color: #f4f1ed;
}

@media screen and (min-width: 768px) {
  .p-form-container {
    --content-padding: 10rem;
  }
}

@media screen and (min-width: 1024px) {
  .p-form-container {
    --content-padding: var(--content-side);
  }
}

.p-form-container #reservation {
  font-size: 1.3rem;
}

@media screen and (min-width: 768px) {
  .p-form-container #reservation {
    font-size: 1.35rem
  }
}

@media screen and (min-width: 1024px) {
  .p-form-container #reservation {
    font-size: 1.6rem;
  }
}

.p-form-container .-inner,
.p-form-container .-inner-large {
  padding-inline: var(--content-padding);
  width: 100%;
  max-width: var(--content-max-width);
  margin-left: auto;
  margin-right: auto;
}


@media screen and (min-width: 1024px) {
  .p-form-container .-article-tit+.-article-inner {
    margin-top: 40px;
  }
}

.p-form-container .-tit-row-item.-body-small {
  font-family: "IBM Plex Sans JP", "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Helvetica Neue", "Helvetica", "Hiragino Sans", sans-serif;
  font-weight: 600;
}

.p-form-container .picker__year,
.p-form-container .picker__month,
.p-form-container .picker__day,
.p-form-container .picker__day--highlighted,
.p-form-container .picker--focused .picker__day--highlighted {
  font-size: 1.2rem;
}

@media screen and (min-width: 1024px) {

  .p-form-container .picker__year,
  .p-form-container .picker__month,
  .p-form-container .picker__day,
  .p-form-container .picker__day--highlighted,
  .p-form-container .picker--focused .picker__day--highlighted {
    font-size: 1.6rem;
  }
}

@media screen and (min-width: 768px) {

  .p-form-container .-tit-large {
    font-size: 3.6rem;
  }
}

.p-form-container .-btn-ol {
  width: 100%;
}

.p-form-container .-modal-sptab {
  z-index: var(--layer-toast);
}

.p-sec-contact .p-form-container form .wpcf7-response-output {
  margin-inline: var(--content-padding);
  max-width: 80rem;
}

@media screen and (min-width: 1024px) {
  .p-sec-contact .p-form-container form .wpcf7-response-output {
    margin-inline: auto;
  }
}

.p-form-container .wpcf7cf_multistep[data-current_step="2"] .wpcf7cf_prev-container {
  left: auto;
}

.p-form-container .wpcf7cf_prev-container {
  position: relative;
  left: auto;
}

@media screen and (min-width: 768px) {

  .p-form-container .wpcf7cf_prev {
    position: relative;
    left: auto;
    margin-inline: auto;
    top: auto;
    margin-top: 3rem;
  }
}

.p-form-container .-tit-medium {
  font-size: 1.8rem;
}

@media screen and (min-width:768px) {
  .p-form-container .-tit-medium {
    font-size: 2.4rem;
  }
}

/* ここから 問題ないならstyle-form.cssに移植する（土屋本体のstyle.cssからコピペした記述）*/
.-link-underline {
  text-decoration: underline;
}

.-form-required {
  margin-left: 10px;
}

.-link-red {
  color: #dc0017;
}

.-btn-ol {
  display: inline-block;
  color: #ffffff;
  line-height: 1.2;
  text-align: center;
  background-color: #45413e;
  border: 1px solid #45413e;
  border-radius: 100px;
  padding-top: 18px;
  padding-right: 22px;
  padding-bottom: 18px;
  padding-left: 22px;
  min-width: 300px;
}

.-btn-ol.-yellow {
  color: #ffffff;
  background-color: #d6b374;
  border: 1px solid #d6b374;
}

.-btn-ol.-min-auto {
  min-width: auto;
}

/* ここまで 問題ないならstyle-form.cssに移植する */

/* -------------------------------------------------------------------------
  Utilities
  ------------------------------------------------------------------------- */
.u-bg-komorebi {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

@media screen and (max-width:767px) {
  .u-bg-komorebi {
    background-image: url(../../images/toyohira-comorinoki/bg-komorebi_spv2.jpg);
  }
}

@media screen and (min-width:768px) and (max-width:1023px) {
  .u-bg-komorebi {
    background-image: url(../../images/toyohira-comorinoki/bg-komorebi_tabv2.jpg);
  }
}

@media screen and (min-width:1024px) and (max-width: 1919px) {
  .u-bg-komorebi {
    background-image: url(../../images/toyohira-comorinoki/bg-komorebi_pcv2.jpg);
  }
}

@media screen and (min-width:1920px) {
  .u-bg-komorebi {
    background-image: url(../../images/toyohira-comorinoki/bg-komorebi_pc-lgv2.jpg);
  }
}

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

.u-bg-green {
  background-color: var(--color-green);
}

.u-bg-green-300 {
  background-color: var(--color-green-300);
}

.u-bg-green-light-200 {
  background-color: var(--color-green-200);
}

.u-bg-green-light-100 {
  background-color: var(--color-green-100);
}

.u-bg-red {
  background-color: var(--color-red);
}

.u-bg-white {
  background-color: var(--color-white);
}

.u-bg-white-tp-8 {
  background-color: rgba(255, 255, 255, 0.8);
}

.u-bg-white-tp-9 {
  background-color: rgba(255, 255, 255, 0.9);
}

.u-bg-black {
  background-color: var(--color-black-200);
}

.u-bg-gray-400 {
  background-color: var(--color-gray-400);
}

.u-bg-gray-500 {
  background-color: var(--color-gray-500);
}

.u-color-on-dark {
  color: var(--color-white);
}

.u-color-black {
  color: var(--color-black);
}

.u-box-shadow {
  box-shadow: var(--shadow);
}

.u-text-shadow-black {
  text-shadow: var(--shadow);
}

.u-text-center {
  text-align: center;
}

.u-text-palt {
  font-feature-settings: "palt";
}

@media screen and (min-width: 768px) {
  .u-text-center-tab {
    text-align: center;
  }
}

@media screen and (min-width: 1024px) {
  .u-text-center-pc {
    text-align: center;
  }
}

.u-lh-reset {
  line-height: var(--line-height-reset);
}

.u-lh-snug {
  line-height: var(--line-height-snug);
}

.u-lh-body {
  line-height: var(--line-height-body);
}

.u-lh-loose {
  line-height: var(--line-height-loose);
}

.u-lh-extra-loose {
  line-height: var(--line-height-extra-loose);
}

.u-ib {
  display: inline-block;
}

.u-breakout-full {
  margin-inline: calc(var(--content-side) * -1);
}

.u-breakout-1 {
  margin-right: -1rem;
  margin-left: -1rem;
}

.u-breakout-1-5 {
  margin-right: -1.5rem;
  margin-left: -1.5rem;
}

.u-breakout-2 {
  margin-right: -2rem;
  margin-left: -2rem;
}

@media screen and (min-width: 768px) {
  .u-breakout-2 {
    margin-right: -2.5rem;
    margin-left: -2.5rem;
  }
}


.u-translate-en-font {
  display: block;
  transform: translateY(0.1em);
}

.u-font-halt {
  font-feature-settings: "halt";
}



/* ==========================================================================
    リキャプチャ
  ========================================================================== */
.grecaptcha-badge {
  visibility: hidden;
}

.recaptcha-message {
  display: none;
  background-color: #fff;
  position: relative;
}

.recaptcha-message.opentext {
  display: block;
}

.recaptcha-message>small {
  display: block;
  padding: 0 10px 5px;
  font-size: 10px;
}


.pc768,
.pc1024,
.pc1024-ib {
  display: none;
}

@media screen and (min-width: 768px) {
  .sp768 {
    display: none;
  }

  .pc768 {
    display: block;
  }
}

@media screen and (min-width: 1024px) {
  .pc1024 {
    display: block;
  }

  .pc1024-ib {
    display: inline-block;
  }

  .sp1024 {
    display: none;
  }
}