@charset "UTF-8";
/*----------------------------------
  _reset.scss
  @function reset.cssを定義
  @description
  ブラウザデフォルトのスタイルをリセットするためのファイルです。
  プロジェクト全体で共通して使うリセットスタイルを一元管理します。
-----------------------------------*/
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
small,
button,
time,
figure {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

li,
dd {
  list-style-type: none;
}

header,
footer,
nav,
section,
article,
main,
aside,
figure,
figcaption {
  display: block;
}

img {
  border: none;
  vertical-align: bottom;
}

/*----------------------------------
  _base.scss
  @function  基本設定を定義
  @description
  基本のスタイルを定義するファイルです。
-----------------------------------*/
/*----------------------------------
  _variables.scss
  @function 定数を定義
  @description
デザインの元データ（フォント・レイアウト値・ブレイクポイント・色など）
プロジェクト全体で共通して使う値（フォント、キャンバス幅、ブレイクポイント、色、z-indexなど）を一元管理するためのファイルです。
ここを変えると、全体のデザインをまとめて調整できます。
-----------------------------------*/
/*----------------------------------
  _base.scss
  @function  基本設定を定義
  @description
  基本のスタイルを定義するファイルです。
-----------------------------------*/
/*----------------------------------
  _mixin.scss
  @function メディアクエリを定義
  @description
-----------------------------------*/
:root {
  --scrollbar: 0;
}

html {
  /* 1440px以上は16px固定 */
  font-size: rm(16);
  /* PC縮小域：768px → 1440px（15px → 16px） */
}
@media screen and (min-width: px(768)) and (max-width: px(1439)) {
  html {
    font-size: clamp(rm(15), rm(15) + 1 * (100vw - px(768)) / (672), rm(16));
  }
}
html {
  /* SP域：〜767px（375pxで15px、12px未満にならない） */
}
@media screen and (max-width: px(767)) {
  html {
    font-size: clamp(rm(12), 15 / 375 * 100vw, rm(15));
  }
}

body {
  color: #4b3d33;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04em;
  background: url("../img/bg-base.webp") top left repeat;
  overflow-x: hidden;
}
@media (min-width: 768px) {
  body {
    line-height: 2;
  }
}

a {
  text-decoration: none;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  color: inherit;
}
@media (hover: hover) {
  a:hover {
    cursor: pointer;
  }
}

picture,
img,
a,
span {
  display: inline-block;
}

video,
img,
svg {
  width: 100%;
  height: 100%;
}

button {
  font: inherit;
  color: inherit;
  background: transparent;
  background: none;
  border: none;
}

input,
textarea,
select {
  font: inherit;
}

@media (min-width: px(768)) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}
/*----------------------------------
  _inner.scss
  @function インナーのスタイルを定義
  @description
  インナーの基本的なスタイルを定義するファイルです。
-----------------------------------*/
/*----------------------------------
  _function.scss
  @function 単位変換 & vw変換関数
  @description
  デザインカンプのpx指定を、実装で使いやすい rem・px・vw に変換するための関数群です。
値を毎回手計算せず、読みやすい形でSCSSに書けるようにしています。
-----------------------------------*/
.inner {
  margin-inline: auto;
  padding-inline: 1.5rem;
  max-width: 31.25rem;
}
@media (min-width: 768px) {
  .inner {
    width: 100%;
    padding-inline: 2.5rem;
    max-width: 70rem;
  }
}
@media (min-width: 768px) {
  .inner.inner-narrow {
    padding-inline: 5rem;
  }
}

/*----------------------------------
  _button.scss
  @function ボタンのスタイルを定義
  @description
  ボタンの基本的なスタイルを定義するファイルです。
  プロジェクト全体で共通して使うボタンのデザインを一元管理します。
  ここを変えると、全体のボタンデザインをまとめて調整できます。
-----------------------------------*/
.button {
  padding-block: 0.75rem;
}
.button svg {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
}
.button svg circle {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
}
.button svg path {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
}
.button:hover svg circle {
  fill: #4b3d33;
}
.button:hover svg path {
  fill: #ffffff;
}

.button__text {
  color: #4b3d33;
  font-size: 1rem;
  font-weight: 500;
  line-height: 2; /* 32px */
  letter-spacing: 0.05em;
}

.button.button-back {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
}
@media (min-width: 768px) {
  .button.button-back {
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem;
  }
}
.button.button-back .button-icon-arrow {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.button.button-forward {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
}
@media (min-width: 768px) {
  .button.button-forward {
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem;
  }
}

.button-icon-arrow {
  width: 2.125rem;
  height: 2.125rem;
  border: #4b3d33 solid 0.0625rem;
  border-radius: 50%;
}

/*----------------------------------
  _section.scss
  @function セクションを定義
  @description
  セクション共通事項をまとめたファイルです。
-----------------------------------*/
.top-section-title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
}

.top-section-title-ja {
  color: #4b3d33;
  font-family: "Zen Maru Gothic", sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.6; /* 38.4px */
  letter-spacing: 0.04em;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .top-section-title-ja {
    font-size: 1.75rem;
    letter-spacing: 0.04em;
  }
}

.top-section-title-en {
  color: #f4a75a;
  font-family: "Quicksand", sans-serif;
  font-size: 1rem;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.15em;
}
@media (min-width: 768px) {
  .top-section-title-en {
    font-size: 0.875rem;
    line-height: 1.6; /* 22.4px */
    letter-spacing: 0.25em;
  }
}

.page-section-title {
  text-align: center;
}

.page-section-title-ja {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6; /* 51.2px */
  letter-spacing: 0.05em;
  white-space: nowrap;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
@media (min-width: 768px) {
  .page-section-title-ja {
    font-size: 2.5rem;
    letter-spacing: 0.03em;
  }
}

.page-section-title-en {
  font-family: "Quicksand", sans-serif;
  color: #f4a75a;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.6; /* 28.8px */
  letter-spacing: 0.05em;
}

.page-news__title {
  display: grid;
  place-content: center;
  text-align: center;
  -webkit-padding-before: 8.625rem;
          padding-block-start: 8.625rem;
  -webkit-padding-after: 5rem;
          padding-block-end: 5rem;
}
@media (min-width: 768px) {
  .page-news__title {
    -webkit-padding-before: 11.25rem;
            padding-block-start: 11.25rem;
    -webkit-padding-after: 5.25rem;
            padding-block-end: 5.25rem;
  }
}

.page-news__title-jp {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  --ill-w: 3.625rem;
  --ill-h: 3.625rem;
  --gap: 0rem;
}
.page-news__title-jp::before, .page-news__title-jp::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--ill-w);
  height: var(--ill-h);
  aspect-ratio: var(--ill-w)/var(--ill-h);
  background: url("../img/news-title-ill.webp") center/contain no-repeat;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.page-news__title-jp::before {
  left: 0;
  right: unset;
  -webkit-transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
          transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
}
.page-news__title-jp::after {
  left: unset;
  right: 0;
  -webkit-transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
          transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
}
@media (min-width: 768px) {
  .page-news__title-jp {
    --ill-w: 4.9375rem;
    --ill-h: 4.9375rem;
    --gap: 0rem;
  }
}

/*----------------------------------
  _only.scss
  @function 表示制御を定義
  @description
  デバイスごとの表示制御をまとめたファイルです。
-----------------------------------*/
.sp-only {
  display: block;
}
@media (min-width: 768px) {
  .sp-only {
    display: none;
  }
}

.pc-only {
  display: none;
}
@media (min-width: 768px) {
  .pc-only {
    display: block;
  }
}

/*----------------------------------
  _animation.scss
  @function アニメーションを定義
  @description
アニメーションの設定をまとめたファイルです。
プロジェクト全体で共通して使うアニメーションを一元管理します。
ここを変えると、全体のアニメーションをまとめて調整できます。
-----------------------------------*/
.animation-fade,
.animation-stagger__item {
  opacity: 0;
  -webkit-transform: translateY(1.5rem);
          transform: translateY(1.5rem);
  will-change: transform, opacity;
}
.animation-fade.js-show,
.animation-stagger__item.js-show {
  -webkit-animation: floatUp 1.6s cubic-bezier(0.36, 0, 0, 1) forwards;
          animation: floatUp 1.6s cubic-bezier(0.36, 0, 0, 1) forwards;
}

@-webkit-keyframes floatUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(1.5rem);
            transform: translateY(1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes floatUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(1.5rem);
            transform: translateY(1.5rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
/* 上から下に流れるるアニメーション */
@-webkit-keyframes scroll-line-move {
  0% {
    clip-path: inset(0% 0% 100% 0%);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    clip-path: inset(0% 0% 0% 0%);
    opacity: 1;
  }
  100% {
    clip-path: inset(0% 0% 0% 0%);
    opacity: 0;
  }
}
@keyframes scroll-line-move {
  0% {
    clip-path: inset(0% 0% 100% 0%);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    clip-path: inset(0% 0% 0% 0%);
    opacity: 1;
  }
  100% {
    clip-path: inset(0% 0% 0% 0%);
    opacity: 0;
  }
}
/*----------------------------------
  _section.scss
  @function セクションを定義
  @description
  セクション共通事項をまとめたファイルです。
-----------------------------------*/
/*----------------------------------
  共通パーツ section
-----------------------------------*/
.top-section {
  padding-block: 5rem;
}
@media (min-width: 768px) {
  .top-section {
    -webkit-padding-before: 10rem;
            padding-block-start: 10rem;
    -webkit-padding-after: 12.5rem;
            padding-block-end: 12.5rem;
  }
}

.page-section {
  padding-block: 5rem;
}
@media (min-width: 768px) {
  .page-section {
    -webkit-padding-before: 10rem;
            padding-block-start: 10rem;
    -webkit-padding-after: 12.5rem;
            padding-block-end: 12.5rem;
  }
}

/*----------------------------------
  _breadcrumb.scss
  @function パンくずリストのスタイルを定義
  @description
  パンくずリストの基本的なスタイルを定義するファイルです。
-----------------------------------*/
.breadcrumb {
  padding-block: 1rem;
}
@media (min-width: 768px) {
  .breadcrumb {
    margin-block: 0.375rem;
    width: min(90rem, 100%);
    margin-inline: auto;
  }
}

@media (min-width: 768px) {
  .inner.inner__breadcrumb {
    padding-inline: 5rem;
    max-width: unset;
  }
}

.breadcrumb__contents {
  color: #4b3d33;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1; /* 12px */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-column-gap: 0.25rem;
     -moz-column-gap: 0.25rem;
          column-gap: 0.25rem;
}
@media (min-width: 768px) {
  .breadcrumb__contents {
    font-size: 0.875rem;
  }
}
.breadcrumb__contents svg {
  width: 1rem;
  height: 0.875rem;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -webkit-margin-before: 0.2em;
          margin-block-start: 0.2em;
}
@media (min-width: 768px) {
  .breadcrumb__contents svg {
    -webkit-margin-before: 0.3em;
            margin-block-start: 0.3em;
  }
  .breadcrumb__contents svg path {
    fill: #eb772b;
  }
}
.breadcrumb__contents span {
  line-height: 1.6;
  letter-spacing: 0.03em;
  white-space: nowrap;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.breadcrumb__contents span a:hover {
  opacity: 0.7;
}
.breadcrumb__contents .current-item {
  white-space: normal;
  line-break: strict;
  word-break: break-word;
}

.separator {
  display: block;
  background: url("../img/news-icon-separator.svg") center center no-repeat;
  width: 0.625rem;
  height: auto;
  aspect-ratio: 4/6.691;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  white-space: nowrap;
  -webkit-margin-before: 0.15em;
          margin-block-start: 0.15em;
}
@media (min-width: 768px) {
  .separator {
    -webkit-margin-before: 0.3em;
            margin-block-start: 0.3em;
  }
}

/*----------------------------------
  _header.scss
  @function headerを定義
  @description

-----------------------------------*/
/*----------------------------------
  _clamp.scss
  @function レスポンシブ対応値に変換する関数を定義
  @description
  最小、最大値はremで、推奨値では、rem＋vwの値が出力されます。

  Safariのバージョンによってclamp関数が動かないときは、
  * {
    min-height: 0vw;
  }
    を加える。
-----------------------------------*/
.example {
  font-size: clamp(1.5rem, 0.3636363636rem + 4.8484848485vw, 4rem);
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  min-height: 3.75rem;
  padding-block: 1rem;
  color: #4b3d33;
  background: transparent;
  z-index: 100;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.header.is-drawer-open {
  background: #ebe1b4;
  -webkit-padding-after: unset;
          padding-block-end: unset;
}
@media (min-width: 1024px) {
  .header {
    min-height: 5rem;
    padding-block: 2rem;
  }
}
.header .header__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin-inline: auto;
  -webkit-padding-start: 1.5rem;
          padding-inline-start: 1.5rem;
  -webkit-padding-end: 1.75rem;
          padding-inline-end: 1.75rem;
}
@media (min-width: 768px) {
  .header .header__inner {
    max-width: 90rem;
    -webkit-padding-start: clamp(1.5rem, -2.5rem + 8.3333333333vw, 5rem);
            padding-inline-start: clamp(1.5rem, -2.5rem + 8.3333333333vw, 5rem);
    -webkit-padding-end: clamp(1.875rem, -4.1964285714rem + 12.6488095238vw, 7.1875rem);
            padding-inline-end: clamp(1.875rem, -4.1964285714rem + 12.6488095238vw, 7.1875rem);
  }
}
.header .header__logo {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}
.header .header__logo .header__logo-img {
  width: clamp(8.25rem, 4.1946564885rem + 17.3027989822vw, 12.5rem);
  height: auto;
  aspect-ratio: 66/17;
}
.header .header__logo .header__logo-img img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
  overflow: visible;
}
@media (min-width: 768px) {
  .header .header__logo .header__logo-img {
    width: 13.4375rem;
    aspect-ratio: 43/11;
  }
}
@media (min-width: 768px) {
  .header .header__logo {
    -webkit-margin-before: -0.3125rem;
            margin-block-start: -0.3125rem;
  }
}
.header .header__logo:hover, .header .header__logo:focus-visible {
  cursor: pointer;
  opacity: 0.7;
}
.header .header__logo.is-drawer-open {
  -webkit-padding-after: 0.3125rem;
          padding-block-end: 0.3125rem;
  opacity: 0;
  -webkit-animation: animation-showIn 1s 0.5s ease forwards;
          animation: animation-showIn 1s 0.5s ease forwards;
}
@-webkit-keyframes animation-showIn {
  0% {
    opacity: 0;
  }
  10% {
    -webkit-box-align: end;
            align-items: end;
  }
  100% {
    opacity: 1;
    -webkit-box-align: end;
            align-items: end;
  }
}
@keyframes animation-showIn {
  0% {
    opacity: 0;
  }
  10% {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
  }
  100% {
    opacity: 1;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
  }
}
.header .header__nav {
  display: none;
}
@media (min-width: 1024px) {
  .header .header__nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}
.header .header__list {
  display: none;
}
.header .header__list li {
  display: none;
}
@media (min-width: 768px) {
  .header .header__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-column-gap: clamp(1rem, -0.4285714286rem + 2.9761904762vw, 2.25rem);
       -moz-column-gap: clamp(1rem, -0.4285714286rem + 2.9761904762vw, 2.25rem);
            column-gap: clamp(1rem, -0.4285714286rem + 2.9761904762vw, 2.25rem);
  }
  .header .header__list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}
.header .header__nav-item {
  display: none;
}
@media (min-width: 768px) {
  .header .header__nav-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}
.header .header__link {
  display: none;
}
@media (min-width: 768px) {
  .header .header__link {
    position: relative;
    display: inline-block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    row-gap: 0.25rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .header .header__link:hover, .header .header__link:focus-visible {
    cursor: pointer;
  }
  .header .header__link:hover .header__link-jp, .header .header__link:focus-visible .header__link-jp {
    opacity: 0.7;
  }
}
.header .header__logo-img,
.header .header__logo-img a,
.header .header__logo-img picture {
  display: block;
  line-height: 0;
}
@media (min-width: 768px) {
  .header .header__link-jp {
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.2223;
  }
}
@media (min-width: 768px) {
  .header .header__link-en {
    color: #f4a75a;
    font-family: "Quicksand", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5714;
    letter-spacing: 0.1em;
  }
}

/*----------------------------------
  _footer.scss
  @function footerを定義
  @description

-----------------------------------*/
.footer {
  -webkit-padding-before: 4.625rem;
          padding-block-start: 4.625rem;
  -webkit-padding-after: 0.625rem;
          padding-block-end: 0.625rem;
  position: relative;
  overflow: hidden;
}
@media (min-width: 768px) {
  .footer {
    -webkit-padding-before: 12rem;
            padding-block-start: 12rem;
    -webkit-padding-after: unset;
            padding-block-end: unset;
  }
}

.footer__decoration-orange {
  position: absolute;
  z-index: -1;
  left: calc(50vw - 6.5rem);
  bottom: -21.75rem;
  width: 33.5625rem;
  height: 34.75rem;
}
.footer__decoration-orange img {
  width: 100%;
  height: auto;
  aspect-ratio: 85/88;
}
@media (min-width: 768px) {
  .footer__decoration-orange {
    width: 55.6875rem;
    height: 55.3125rem;
    left: calc(50vw - 9.375rem);
    bottom: -29.125rem;
  }
  .footer__decoration-orange img {
    width: 100%;
    height: auto;
    aspect-ratio: 153/152;
  }
}

@media (min-width: 768px) {
  .footer__inner {
    margin-inline: auto;
    padding-inline: unset;
    max-width: unset;
    width: min(75rem, 90%);
  }
}

.footer__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 10rem;
}
@media (min-width: 768px) {
  .footer__wrap {
    row-gap: 2.375rem;
  }
}

.footer__logo img {
  width: 10rem;
  height: 2.5625rem;
  aspect-ratio: 160/41;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media (min-width: 768px) {
  .footer__logo img {
    width: 13.4375rem;
    height: 3.4375rem;
    aspect-ratio: 43/11;
  }
}
.footer__logo:hover, .footer__logo:focus-visible {
  cursor: pointer;
  opacity: 0.7;
}

.footer__content {
  text-align: right;
  width: 100%;
  position: relative;
}
.footer__content p {
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.8; /* 27px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .footer__content p {
    font-size: 1.0625rem;
    font-weight: 500;
    line-height: 2; /* 34px */
    letter-spacing: 0.04em;
  }
}
.footer__content::after {
  content: "";
  position: absolute;
  left: -10vw;
  bottom: 4.25rem;
  width: 10rem;
  height: 4.8125rem;
  aspect-ratio: 160/77;
  background-image: url("../img/footer-bird.webp");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
}
@media (min-width: 768px) {
  .footer__content::after {
    left: min(45rem, 50vw - 1.5625rem);
    bottom: clamp(3.5rem, 1.0555555556rem + 5.0925925926vw, 4.875rem);
    width: 13.75rem;
    height: 6.5625rem;
    aspect-ratio: 44/21;
  }
}

.footer__copyright {
  -webkit-padding-before: 0.625rem;
          padding-block-start: 0.625rem;
  letter-spacing: 0rem;
  text-align: right;
}
.footer__copyright small {
  color: #ffffff;
  font-family: "Quicksand", sans-serif;
  font-size: 0.8125rem;
  font-weight: 400;
}
@media (min-width: 768px) {
  .footer__copyright {
    -webkit-padding-before: 4.5rem;
            padding-block-start: 4.5rem;
    -webkit-padding-after: 0.25rem;
            padding-block-end: 0.25rem;
    letter-spacing: 0rem;
  }
}

/*----------------------------------
  _drawer.scss
  @function drawerを定義
  @description

-----------------------------------*/
.drawer__icon {
  position: relative;
  width: 2.75rem;
  min-height: 2.75rem;
  display: grid;
  place-items: center;
  overflow: visible;
  -webkit-margin-before: 0.625rem;
          margin-block-start: 0.625rem;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 130;
}
@media (min-width: 1024px) {
  .drawer__icon {
    display: none;
  }
}
.drawer__icon:hover {
  cursor: pointer;
}
.drawer__icon.is-drawer-open {
  padding-block: unset;
}
.drawer__icon.is-drawer-open .drawer__icon-bg {
  display: none;
}
.drawer__icon.is-drawer-open .drawer__icon-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.drawer__icon.is-drawer-open .drawer__icon-bar:nth-child(2) svg {
  -webkit-transform: rotate(45deg) translate(0.0625rem, -0.15625rem);
          transform: rotate(45deg) translate(0.0625rem, -0.15625rem);
  -webkit-margin-before: 0.25rem;
          margin-block-start: 0.25rem;
}
.drawer__icon.is-drawer-open .drawer__icon-bar:nth-child(3) svg {
  -webkit-transform: rotate(-45deg) translate(0.875rem, -0.6875rem);
          transform: rotate(-45deg) translate(0.875rem, -0.6875rem);
  -webkit-margin-before: 0.25rem;
          margin-block-start: 0.25rem;
}
.drawer__icon.is-drawer-open .drawer__icon-text {
  bottom: 0.125rem;
}

/* 2本線 + text を中央に並べる */
.drawer__icon-wrap {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-padding-before: 0.25rem;
          padding-block-start: 0.25rem;
  position: relative;
  z-index: 1;
}

.drawer__icon-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4.625rem;
  height: 4.625rem;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: -1;
  pointer-events: none;
}
.drawer__icon-bg img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.drawer__icon-text {
  position: absolute;
  bottom: 0.25rem;
  left: 54%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  color: #4b3d33;
  font-family: "Quicksand", sans-serif;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1;
}
@media (min-width: 1024px) {
  .drawer__icon-text {
    display: none;
  }
}

/*----------------------------------
  drawer icon（button）
-----------------------------------*/
.drawer__icon-bar {
  display: block;
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 36.878/5;
}
.drawer__icon-bar:nth-child(3) {
  -webkit-margin-before: 0.4375rem;
          margin-block-start: 0.4375rem;
}
.drawer__icon-bar svg {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: none;
          transform: none;
}

.drawer {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  z-index: 120;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #8c6a4b;
  padding-block: 6.625rem 8.75rem;
  overflow: auto;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media (min-width: 1024px) {
  .drawer {
    display: none;
  }
}
.drawer.is-drawer-open {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}

.drawer-content {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  z-index: 120;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100dvh - 3.75rem);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  background: #ebe1b4;
  top: 4.3125rem;
  -webkit-margin-before: 0;
          margin-block-start: 0;
  -webkit-padding-before: 5rem;
          padding-block-start: 5rem;
  -webkit-padding-after: 1.5rem;
          padding-block-end: 1.5rem;
  overflow: auto;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.drawer-content.is-drawer-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  -webkit-animation: drawer-open 0.5s ease forwards;
          animation: drawer-open 0.5s ease forwards;
}
@-webkit-keyframes drawer-open {
  0% {
    -webkit-transform: translateY(-62.5rem);
            transform: translateY(-62.5rem);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes drawer-open {
  0% {
    -webkit-transform: translateY(-62.5rem);
            transform: translateY(-62.5rem);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.drawer-content.is-drawer-open .drawer__link-jp,
.drawer-content.is-drawer-open .drawer__link-en,
.drawer-content.is-drawer-open .sns__icon-wrap,
.drawer-content.is-drawer-open .sns__text-wrap {
  overflow: hidden;
}
.drawer-content.is-drawer-open .drawer__link-jp span,
.drawer-content.is-drawer-open .drawer__link-jp img,
.drawer-content.is-drawer-open .drawer__link-en span,
.drawer-content.is-drawer-open .drawer__link-en img,
.drawer-content.is-drawer-open .sns__icon-wrap span,
.drawer-content.is-drawer-open .sns__icon-wrap img,
.drawer-content.is-drawer-open .sns__text-wrap span,
.drawer-content.is-drawer-open .sns__text-wrap img {
  display: inline-block;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation: slideUp 0.7s 0.5s ease forwards;
          animation: slideUp 0.7s 0.5s ease forwards;
  opacity: 0;
}
@media (min-width: 1024px) {
  .drawer-content {
    display: none;
  }
}

@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideUp {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
.drawer__body {
  -webkit-padding-start: clamp(1.5rem, -6.6106870229rem + 34.6055979644vw, 10rem);
          padding-inline-start: clamp(1.5rem, -6.6106870229rem + 34.6055979644vw, 10rem);
  -webkit-padding-end: clamp(0.25rem, -1.3409090909rem + 6.7878787879vw, 3.75rem);
          padding-inline-end: clamp(0.25rem, -1.3409090909rem + 6.7878787879vw, 3.75rem);
  position: relative;
}

.drawer__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 1.125rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.8);
  -webkit-padding-before: 2.5rem;
          padding-block-start: 2.5rem;
  -webkit-padding-after: 1rem;
          padding-block-end: 1rem;
  width: clamp(17rem, 8.7661787365rem + 35.1309707242vw, 31.25rem);
  position: relative;
}
.drawer__list::after {
  content: "";
  position: absolute;
  bottom: -1.375rem;
  right: -3.125rem;
  width: 7.875rem;
  height: 5.8125rem;
  aspect-ratio: 42/31;
  background-image: url("../img/menu-ill.webp");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
}
@media screen and (max-width: 374px) {
  .drawer__list {
    width: clamp(15rem, 3.1481481481rem + 59.2592592593vw, 17rem);
  }
}

.drawer__item {
  width: 100%;
}

.drawer__link {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 0rem;
  width: 100%;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.035rem;
  -webkit-padding-after: 1.46875rem;
          padding-block-end: 1.46875rem;
  overflow: hidden;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.drawer__link:hover, .drawer__link:focus-visible {
  opacity: 0.7;
}

.drawer__button {
  padding-block: 1.25rem;
  padding-inline: 2rem;
  width: 100%;
  text-align: center;
  border-radius: 0.125rem;
  color: #ffffff;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.2;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.drawer__button:hover, .drawer__button:focus-visible {
  opacity: 0.8;
}

.drawer__link-jp {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.22222;
  white-space: nowrap;
}

.drawer__link-en {
  color: #f4a75a;
  text-align: center;
  font-family: "Quicksand", sans-serif;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.57143;
  letter-spacing: 0.1em;
}

/* SNSブロックを右端に固定 */
.drawer-sns {
  position: absolute;
  right: 0rem;
  top: 0rem;
  z-index: 10;
}

.drawer-sns__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 3.75rem;
  -webkit-padding-end: clamp(1.5rem, 0.5458015267rem + 4.0712468193vw, 2.5rem);
          padding-inline-end: clamp(1.5rem, 0.5458015267rem + 4.0712468193vw, 2.5rem);
}

.sns__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 0.625rem;
  overflow: hidden;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.sns__icon-wrap {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  aspect-ratio: 1/1;
  display: grid;
  place-items: center;
}
.sns__icon-wrap img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
}

.sns__text-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; /* 横方向中央 */
}

/* テキストだけ90度回転 */
.sns__text {
  line-height: 1;
  white-space: nowrap;
  /* Safari対策 */
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
  text-orientation: mixed;
  letter-spacing: 0.05em;
  /* transformは削除 */
  font-family: "Quicksand", sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.05em;
}

/*----------------------------------
  body fixed（OPEN中スクロール禁止）
-----------------------------------*/
.body--drawer-fixed {
  position: fixed;
  inset: 0;
  overflow: hidden;
}

/*----------------------------------
  _main.scss
  @function mainを定義
  @description

-----------------------------------*/
.top-main {
  min-height: 100vh;
}

.top-sns {
  display: none;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-sns {
    position: fixed;
    display: inline-block;
    top: 30vh;
    left: 0;
    z-index: 99;
  }
}
@media (min-width: 1024px) {
  .top-sns {
    position: fixed;
    display: inline-block;
    top: min(40vh, 16.4375rem);
    left: 0;
    z-index: 99;
  }
}

.top-sns__wrap {
  -webkit-padding-start: clamp(1.5rem, -0.9615384615rem + 3.8461538462vw, 2.5rem);
          padding-inline-start: clamp(1.5rem, -0.9615384615rem + 3.8461538462vw, 2.5rem);
}

.drawer-sns__links.top-sns__links {
  -webkit-padding-end: unset;
          padding-inline-end: unset;
}

.top-sns__link {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.top-sns__link:hover {
  opacity: 0.7;
}

.sns__text.top-sns__text {
  -webkit-transform: unset;
          transform: unset;
}

.top-fv {
  position: relative;
  overflow: hidden;
  -webkit-padding-after: clamp(1.5rem, -0.0909090909rem + 6.7878787879vw, 5rem);
          padding-block-end: clamp(1.5rem, -0.0909090909rem + 6.7878787879vw, 5rem);
}
@media (min-width: 1024px) {
  .top-fv {
    -webkit-padding-after: unset;
            padding-block-end: unset;
  }
}

.top-fv__decoration-orange {
  position: absolute;
  z-index: -1;
  top: clamp(-220px, -70px - 150 * (100vw - 375px) / 524, -70px);
  left: calc(-130px - 0.42 * (100vw - 375px));
  width: clamp(25.625rem, 10.4174618321rem + 64.8854961832vw, 46.875rem);
  height: auto;
  aspect-ratio: 63/67;
}
.top-fv__decoration-orange img {
  width: 100%;
  height: 100%;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__decoration-orange {
    top: -13.75rem;
    left: -21.875rem;
    width: clamp(46.875rem, 1.1432926829rem + 81.3008130081vw, 53.125rem);
    aspect-ratio: 153/152;
  }
}
@media (min-width: 1024px) {
  .top-fv__decoration-orange {
    top: clamp(-8.75rem, -10.2884615385rem + 2.4038461538vw, -8.125rem);
    left: clamp(-24.375rem, -36.6826923077rem + 19.2307692308vw, -19.375rem);
    width: clamp(53.125rem, 42.2019230769rem + 17.0673076923vw, 57.5625rem);
    aspect-ratio: 153/152;
  }
}
@media (min-width: 1441px) {
  .top-fv__decoration-orange {
    top: calc(-7.5rem - clamp(0rem, -32.1939231457rem + 35.746201966vw, 25rem));
    left: clamp(-18.75rem, -24.3839365505rem + 6.2555853441vw, -14.375rem);
    width: clamp(57.5625rem, 14.9860366399rem + 47.2743521001vw, 90.625rem);
  }
}

.inner.top-fv__inner {
  position: relative;
  padding-inline: 0.625rem;
}
@media (min-width: 1024px) {
  .inner.top-fv__inner {
    padding-inline: unset;
    max-width: 75rem;
  }
}

.top-fv__wrap {
  max-width: clamp(22.1875rem, 11.2291269084rem + 46.7557251908vw, 37.5rem);
  margin-inline: auto;
  -webkit-padding-before: 5.25rem;
          padding-block-start: 5.25rem;
  display: grid;
  grid-template-columns: 1fr; /* 1列 */
  grid-template-areas: "head" "img" "lead";
}
@media screen and (max-width: 374px) {
  .top-fv__wrap {
    width: 95%;
  }
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__wrap {
    -webkit-padding-before: 5.25rem;
            padding-block-start: 5.25rem;
    grid-template-columns: 1fr 1fr; /* 2列（左・右） */
    grid-template-rows: auto auto;
    -ms-flex-line-pack: start;
        align-content: start;
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem; /* 横のすき間 */
    height: clamp(33.75rem, 1.737804878rem + 56.9105691057vw, 38.125rem);
    max-width: clamp(46.875rem, -12.5762195122rem + 105.6910569106vw, 55rem);
    margin-inline: auto;
    /* 左列に head と lead、右列に img */
    grid-template-areas: "head img" "lead img";
  }
}
@media (min-width: 1024px) {
  .top-fv__wrap {
    -webkit-padding-before: 6.5rem;
            padding-block-start: 6.5rem;
    grid-template-columns: 1fr 1fr; /* 2列（左・右） */
    grid-template-rows: auto auto;
    -ms-flex-line-pack: start;
        align-content: start;
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem; /* 横のすき間 */
    height: clamp(38.125rem, 16.5865384615rem + 33.6538461538vw, 46.875rem);
    max-width: clamp(55rem, 7.3076923077rem + 74.5192307692vw, 74.375rem);
    margin-inline: auto;
    /* 左列に head と lead、右列に img */
    grid-template-areas: "head img" "lead img";
  }
}

/* それぞれの“席”を名前で決める */
.top-fv__head {
  grid-area: head;
}

.top-fv__img-wrap {
  grid-area: img;
}

.top-fv__lead {
  grid-area: lead;
}

.top-fv__head {
  -webkit-margin-before: clamp(0rem, -1.7891221374rem + 7.6335877863vw, 2.5rem);
          margin-block-start: clamp(0rem, -1.7891221374rem + 7.6335877863vw, 2.5rem);
  font-size: clamp(2rem, 1.6421755725rem + 1.5267175573vw, 2.5rem);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.05em;
  display: inline-block;
  position: relative;
  z-index: 2;
  padding-inline: 0.875rem;
}
.top-fv__head span {
  display: block;
}
.top-fv__head span span {
  -webkit-margin-start: clamp(0.5rem, -2.4090909091rem + 14.5454545455vw, 1rem);
          margin-inline-start: clamp(0.5rem, -2.4090909091rem + 14.5454545455vw, 1rem);
}
.top-fv__head .top-fv__head-line2 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  white-space: nowrap;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
@media screen and (max-width: 374px) {
  .top-fv__head {
    font-size: clamp(1.875rem, 1.1342592593rem + 3.7037037037vw, 2rem);
  }
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__head {
    padding-inline: unset;
    font-size: clamp(2.375rem, -2.1981707317rem + 8.1300813008vw, 3rem);
    -webkit-margin-before: 2.5rem;
            margin-block-start: 2.5rem;
    min-height: 9.375rem;
  }
}
@media (min-width: 1024px) {
  .top-fv__head {
    padding-inline: unset;
    font-size: clamp(3.125rem, 0.9711538462rem + 3.3653846154vw, 4rem);
    font-weight: 500;
    line-height: 1.6; /* 102.4px */
    letter-spacing: 0.16rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-item-align: center;
        align-self: center;
    min-height: clamp(11.25rem, 2.0192307692rem + 14.4230769231vw, 15rem);
    -webkit-margin-before: clamp(3.125rem, -1.4903846154rem + 7.2115384615vw, 5rem);
            margin-block-start: clamp(3.125rem, -1.4903846154rem + 7.2115384615vw, 5rem);
  }
  .top-fv__head span span {
    -webkit-margin-start: clamp(1.25rem, -0.5961538462rem + 2.8846153846vw, 2rem);
            margin-inline-start: clamp(1.25rem, -0.5961538462rem + 2.8846153846vw, 2rem);
  }
}

.accent-orange {
  color: #eb772b;
  position: relative;
}
.accent-orange::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  background: url("../img/fv-head-bg-white.webp") center/contain no-repeat;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: clamp(10.0625rem, 9.2126669847rem + 3.6259541985vw, 11.25rem);
  height: auto;
  aspect-ratio: 161/53;
}
@media screen and (max-width: 374px) {
  .accent-orange::before {
    width: clamp(8.75rem, 0.9722222222rem + 38.8888888889vw, 10.0625rem);
    aspect-ratio: 313/102;
  }
}
@media (min-width: 900px) and (max-width: 1023px) {
  .accent-orange::before {
    width: clamp(11.25rem, -14.1532258065rem + 45.1612903226vw, 14.75rem);
    aspect-ratio: 313/102;
  }
}
@media (min-width: 1024px) {
  .accent-orange::before {
    width: clamp(14.75rem, 2.9038461538rem + 18.5096153846vw, 19.5625rem);
    aspect-ratio: 313/102;
  }
}

.top-fv__img-orange {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 1;
}

.top-fv__img-wrap {
  width: 100%;
  /* ★ここが重要：中身（.top-fv__img）を確実に中央へ */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  /* はみ出し/端末差の安全策（必要なら） */
  overflow: hidden;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__img-wrap {
    overflow: visible;
    -ms-flex-item-align: start;
        align-self: start;
    justify-self: start;
    margin-inline: unset;
    width: 100%;
    position: relative;
  }
}
@media (min-width: 1024px) {
  .top-fv__img-wrap {
    overflow: visible;
    -ms-flex-item-align: start;
        align-self: start;
    justify-self: start;
    margin-inline: unset;
    width: 100%;
    position: relative;
  }
}

.top-fv__img {
  max-width: 34.375rem;
  -webkit-margin-before: 2.5rem;
          margin-block-start: 2.5rem;
  aspect-ratio: 71/54;
}
.top-fv__img img,
.top-fv__img picture {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__img {
    position: absolute;
    z-index: -1;
    top: 0;
    left: clamp(-4.375rem, 9.3445121951rem + -24.3902439024vw, -6.25rem);
    width: clamp(30rem, -2.012195122rem + 56.9105691057vw, 34.375rem);
    max-width: unset;
    height: auto;
    aspect-ratio: 817/624;
    -webkit-margin-before: unset;
            margin-block-start: unset;
  }
}
@media (min-width: 1024px) {
  .top-fv__img {
    position: absolute;
    z-index: -1;
    top: 0;
    left: calc(clamp(7.5rem, 3.5rem + 6.25vw, 9.125rem) * -1);
    width: clamp(36.25rem, -0.2115384615rem + 56.9711538462vw, 51.0625rem);
    max-width: unset;
    height: auto;
    aspect-ratio: 817/624;
    -webkit-margin-before: unset;
            margin-block-start: unset;
  }
}

.top-fv__lead {
  font-size: clamp(1rem, 0.2727272727rem + 3.6363636364vw, 1.125rem);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04em;
  -webkit-margin-before: 1.375rem;
          margin-block-start: 1.375rem;
  padding-inline: 0.875rem;
  position: relative;
}
.top-fv__lead::after {
  content: "";
  position: absolute;
  bottom: -1.875rem;
  right: 2.5rem;
  width: clamp(7.9375rem, 6.4614742366rem + 6.2977099237vw, 10rem);
  height: auto;
  aspect-ratio: 127/52;
  background-image: url("../img/fv-bird-sp.webp");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-fv__lead {
    font-size: clamp(1.125rem, 0.2103658537rem + 1.6260162602vw, 1.25rem);
    font-weight: 500;
    line-height: 1.8;
    letter-spacing: 0.04em;
    -webkit-margin-before: unset;
            margin-block-start: unset;
    padding-inline: unset;
    -webkit-padding-after: clamp(5rem, -4.1463414634rem + 16.2601626016vw, 6.25rem);
            padding-block-end: clamp(5rem, -4.1463414634rem + 16.2601626016vw, 6.25rem);
  }
  .top-fv__lead::after {
    background-image: url("../img/fv-bird-pc.webp");
    bottom: 0rem;
    right: unset;
    left: 2.25rem;
    width: clamp(12.5rem, 3.3536585366rem + 16.2601626016vw, 13.75rem);
    height: auto;
    aspect-ratio: 278/133;
  }
}
@media (min-width: 1024px) {
  .top-fv__lead {
    font-size: clamp(1.25rem, 0.6346153846rem + 0.9615384615vw, 1.5rem);
    font-weight: 500;
    line-height: 2; /* 48px */
    letter-spacing: 0.04em;
    -webkit-margin-before: unset;
            margin-block-start: unset;
    padding-inline: unset;
    -webkit-padding-after: clamp(6.25rem, 0.0961538462rem + 9.6153846154vw, 8.75rem);
            padding-block-end: clamp(6.25rem, 0.0961538462rem + 9.6153846154vw, 8.75rem);
  }
  .top-fv__lead::after {
    background-image: url("../img/fv-bird-pc.webp");
    bottom: 0rem;
    right: unset;
    left: 2.25rem;
    width: clamp(13.75rem, 1.2884615385rem + 19.4711538462vw, 18.8125rem);
    height: auto;
    aspect-ratio: 278/133;
  }
}

.top-fv__scroll {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 1.03125rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (min-width: 768px) and (max-width: 899px) {
  .top-fv__scroll {
    -webkit-margin-before: 1.875rem;
            margin-block-start: 1.875rem;
  }
}

@media (min-width: 768px) {
  .top-fv__scroll-text {
    width: 4.25rem;
    height: 0.84375rem;
    aspect-ratio: 136/27;
  }
  .top-fv__scroll-text img {
    width: 100%;
    height: 100%;
    display: block;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
  }
}

@media (min-width: 768px) {
  .top-fv__scroll-line {
    position: relative;
    width: 0.1675625rem;
    height: 7.5rem;
    overflow: hidden;
  }
  .top-fv__scroll-line svg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: scroll-line-move 2.5s cubic-bezier(0.47, 0, 0.7, 1) infinite;
            animation: scroll-line-move 2.5s cubic-bezier(0.47, 0, 0.7, 1) infinite;
    will-change: transform, opacity;
  }
}

.top-concept {
  overflow-x: hidden;
  padding-block: unset;
}

.top-concept__decoration-top-bg {
  -webkit-padding-before: 3.125rem;
          padding-block-start: 3.125rem;
  position: relative;
  --ill-w: 6.75rem;
  --ill-h: 4.75rem;
  --gap: 6.25rem;
}
.top-concept__decoration-top-bg::before, .top-concept__decoration-top-bg::after {
  content: "";
  position: absolute;
  top: 62%;
  left: 50%;
  width: var(--ill-w);
  height: var(--ill-h);
  aspect-ratio: var(--ill-w)/var(--ill-h);
  background: url("../img/concept-title-ill-mori.webp") center/contain no-repeat;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.top-concept__decoration-top-bg::before {
  -webkit-transform: translate(-50%, -50%) translateX(calc(-1 * (var(--ill-w) + var(--gap)) / 2));
          transform: translate(-50%, -50%) translateX(calc(-1 * (var(--ill-w) + var(--gap)) / 2));
}
.top-concept__decoration-top-bg::after {
  -webkit-transform: translate(-50%, -50%) translateX(calc((var(--ill-w) + var(--gap)) / 2)) scaleX(-1);
          transform: translate(-50%, -50%) translateX(calc((var(--ill-w) + var(--gap)) / 2)) scaleX(-1);
}
@media (min-width: 768px) {
  .top-concept__decoration-top-bg {
    --ill-w: 11.9375rem;
    --ill-h: 8.4375rem;
    --gap: clamp(6.25rem, -23.75rem + 62.5vw, 32.5rem);
    -webkit-padding-before: 1.875rem;
            padding-block-start: 1.875rem;
  }
  .top-concept__decoration-top-bg::before, .top-concept__decoration-top-bg::after {
    top: 46%;
  }
}

.top-concept__area {
  background: url("../img/bg-beige2.webp") top left repeat;
  -webkit-padding-before: 2.625rem;
          padding-block-start: 2.625rem;
  -webkit-padding-after: 5rem;
          padding-block-end: 5rem;
  position: relative;
  z-index: 1;
}
@media (min-width: 768px) {
  .top-concept__area {
    -webkit-padding-before: 0rem;
            padding-block-start: 0rem;
    -webkit-padding-after: 14.6875rem;
            padding-block-end: 14.6875rem;
  }
}
.top-concept__area {
  --ill-w: 6.75rem;
  --ill-h: 4.75rem;
  --gap: 1.25rem;
}
.top-concept__area::before, .top-concept__area::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--ill-w);
  height: var(--ill-h);
  aspect-ratio: var(--ill-w)/var(--ill-h);
  background: url("../img/concept-title-ill-mori.webp") center/contain no-repeat;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.top-concept__area::before {
  left: 0;
  right: unset;
  -webkit-transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
          transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
}
.top-concept__area::after {
  left: unset;
  right: 0;
  -webkit-transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
          transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
}
@media (min-width: 768px) {
  .top-concept__area {
    --ill-w: 11.9375rem;
    --ill-h: 8.4375rem;
    --gap: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .top-concept__inner {
    padding-inline: unset;
    max-width: 75rem;
  }
}

@media (min-width: 768px) {
  .top-concept__wrap {
    max-width: 31.25rem;
    margin-inline: auto;
  }
}
@media (min-width: 1024px) {
  .top-concept__wrap {
    margin-inline: auto;
    max-width: clamp(50rem, -11.5384615385rem + 96.1538461538vw, 75rem);
  }
}

.top-concept__lead {
  text-align: center;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 2; /* 36px */
  letter-spacing: 0.04em;
  -webkit-margin-before: 1.5rem;
          margin-block-start: 1.5rem;
}
@media (min-width: 768px) {
  .top-concept__lead {
    font-size: 1.25rem;
    letter-spacing: 0.8px;
    -webkit-margin-before: 2rem;
            margin-block-start: 2rem;
  }
}

.top-concept__cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-margin-before: 4rem;
          margin-block-start: 4rem;
}
@media (min-width: 768px) {
  .top-concept__cards {
    row-gap: 5.625rem;
  }
}
@media (min-width: 1024px) {
  .top-concept__cards {
    -webkit-margin-before: 5rem;
            margin-block-start: 5rem;
    row-gap: unset;
  }
}

.top-concept__card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 0.625rem;
}
@media (min-width: 1024px) {
  .top-concept__card {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-column-gap: clamp(1.25rem, -1.8269230769rem + 4.8076923077vw, 2.5rem);
       -moz-column-gap: clamp(1.25rem, -1.8269230769rem + 4.8076923077vw, 2.5rem);
            column-gap: clamp(1.25rem, -1.8269230769rem + 4.8076923077vw, 2.5rem);
    row-gap: unset;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-01 {
    row-gap: 5rem;
  }
}
.top-concept__card.is-concept-01 .top-concept__card-img {
  position: relative;
  z-index: -1;
  width: 100%;
}
.top-concept__card.is-concept-01 .top-concept__card-img::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -1.25rem;
  left: calc(clamp(3.25rem, 0.983778626rem + 9.6692111959vw, 5.625rem) * -1);
  width: 12.3025625rem;
  height: auto;
  aspect-ratio: 196.841/207.82;
  -webkit-transform: rotate(-55.71deg);
          transform: rotate(-55.71deg);
  background: url("../img/concept-bg-orange-sp-1.webp") center/contain no-repeat;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-concept__card.is-concept-01 .top-concept__card-img::after {
    width: clamp(17.5rem, 8.3536585366rem + 16.2601626016vw, 18.75rem);
    aspect-ratio: 73/62;
    bottom: 0rem;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-01 .top-concept__card-img {
    width: clamp(28.125rem, -5.2596153846rem + 52.1634615385vw, 41.6875rem);
  }
  .top-concept__card.is-concept-01 .top-concept__card-img::after {
    bottom: calc(clamp(1.25rem, -11.0576923077rem + 19.2307692308vw, 6.25rem) * -1);
    left: calc(clamp(12.5rem, 7.1153846154rem + 8.4134615385vw, 14.6875rem) * -1);
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    width: clamp(25rem, -0.2307692308rem + 39.4230769231vw, 35.25rem);
    aspect-ratio: 73/62;
    background: url("../img/concept-bg-orange-pc-1.webp") center/contain no-repeat;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-01 .top-concept__card-content {
    width: clamp(12.5rem, -25.9615384615rem + 60.0961538462vw, 28.125rem);
  }
}
.top-concept__card.is-concept-01 .top-concept__card-head {
  color: #eb772b;
}
.top-concept__card.is-concept-01 .top-concept__card-text {
  position: relative;
}
.top-concept__card.is-concept-01 .top-concept__card-text::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: clamp(-5rem, -4.7018129771rem + -1.272264631vw, -5.3125rem);
  right: clamp(-0.625rem, 0.5677480916rem + -5.0890585242vw, -1.875rem);
  width: 6.25rem;
  height: auto;
  aspect-ratio: 20/19;
  background: url("../img/concept-bg-ill-books.webp") center/contain no-repeat;
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-01 .top-concept__card-text {
    min-height: 16.25rem;
  }
  .top-concept__card.is-concept-01 .top-concept__card-text::before {
    top: unset;
    bottom: -5.5rem;
    right: 0rem;
    width: 8.6875rem;
    aspect-ratio: 139/132;
  }
}
.top-concept__card.is-concept-02 {
  -webkit-margin-before: 6.75rem;
          margin-block-start: 6.75rem;
}
@media (min-width: 768px) {
  .top-concept__card.is-concept-02 {
    -webkit-margin-before: unset;
            margin-block-start: unset;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-02 {
    -webkit-margin-before: 8.125rem;
            margin-block-start: 8.125rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    row-gap: unset;
  }
}
.top-concept__card.is-concept-02 .top-concept__card-head {
  text-align: end;
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-02 .top-concept__card-head {
    text-align: start;
  }
}
.top-concept__card.is-concept-02 .top-concept__card-img {
  position: relative;
  width: 100%;
}
.top-concept__card.is-concept-02 .top-concept__card-img::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -8.4375rem;
  left: unset;
  right: 0.125rem;
  width: 10.75rem;
  height: auto;
  aspect-ratio: 169/113;
  background: url("../img/concept-bg-ill-bird-1.webp") center/contain no-repeat;
}
.top-concept__card.is-concept-02 .top-concept__card-img::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 0.375rem;
  left: calc(50vw - 0.3125rem);
  right: unset;
  width: 20.625rem;
  height: auto;
  aspect-ratio: 55/48;
  background: url("../img/concept-bg-orange-sp-2.webp") center/contain no-repeat;
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-02 .top-concept__card-img {
    margin-inline: unset;
    width: clamp(37.5rem, 14.4230769231rem + 36.0576923077vw, 46.875rem);
  }
  .top-concept__card.is-concept-02 .top-concept__card-img::before {
    top: -6.875rem;
    bottom: unset;
    left: -8.125rem;
    right: unset;
    width: 14.6875rem;
    height: auto;
    aspect-ratio: 232/155;
  }
  .top-concept__card.is-concept-02 .top-concept__card-img::after {
    left: unset;
    right: -8.875rem;
    bottom: -2.8125rem;
    width: clamp(20.625rem, -4.7596153846rem + 39.6634615385vw, 30.9375rem);
    height: auto;
    aspect-ratio: 495/432;
    background: url("../img/concept-bg-orange-pc-2.webp") center/contain no-repeat;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-02 .top-concept__card-content {
    width: clamp(28.125rem, 21.9711538462rem + 9.6153846154vw, 30.625rem);
  }
}
.top-concept__card.is-concept-02 .top-concept__card-head {
  color: #f08261;
}
.top-concept__card.is-concept-02 .top-concept__card-text {
  position: relative;
}
.top-concept__card.is-concept-02 .top-concept__card-text::before {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: calc(clamp(0rem, -0.715648855rem + 3.0534351145vw, 0.75rem) * -1);
  right: calc(clamp(0rem, -2.1701388889rem + 9.2592592593vw, 3.75rem) * -1);
  width: 7.25rem;
  height: auto;
  aspect-ratio: 116/47;
  background: url("../img/concept-bg-ill-grow.webp") center/contain no-repeat;
}
@media screen and (max-width: 374px) {
  .top-concept__card.is-concept-02 .top-concept__card-text::before {
    bottom: clamp(-0.625rem, -4.3287037037rem + 18.5185185185vw, 0rem);
    right: clamp(-1.25rem, -8.6574074074rem + 37.037037037vw, 0rem);
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-02 .top-concept__card-text::before {
    top: unset;
    bottom: clamp(-6.875rem, 0.8173076923rem + -12.0192307692vw, -10rem);
    left: -0.625rem;
    right: unset;
    width: 10.6875rem;
    aspect-ratio: 57/23;
  }
}
.top-concept__card.is-concept-03 {
  -webkit-margin-before: 5rem;
          margin-block-start: 5rem;
}
@media (min-width: 768px) {
  .top-concept__card.is-concept-03 {
    -webkit-margin-before: unset;
            margin-block-start: unset;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-03 {
    -webkit-margin-before: 7.9375rem;
            margin-block-start: 7.9375rem;
  }
}
.top-concept__card.is-concept-03 .top-concept__card-img {
  position: relative;
}
.top-concept__card.is-concept-03 .top-concept__card-img::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -3.625rem;
  right: -5rem;
  width: 15.696375rem;
  height: 16.571875rem;
  aspect-ratio: 233/246;
  background: url("../img/concept-bg-orange-sp-3.webp") center/contain no-repeat;
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-03 .top-concept__card-img {
    width: clamp(37.5rem, 27.1923076923rem + 16.1057692308vw, 41.6875rem);
  }
  .top-concept__card.is-concept-03 .top-concept__card-img::after {
    left: -16rem;
    right: unset;
    bottom: -7.5rem;
    width: clamp(30rem, 17.0769230769rem + 20.1923076923vw, 35.25rem);
    height: unset;
    -webkit-transform: unset;
            transform: unset;
    aspect-ratio: 73/62;
    background: url("../img/concept-bg-orange-pc-3.webp") center/contain no-repeat;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-03 .top-concept__card-content {
    width: clamp(27.5rem, 21.3461538462rem + 9.6153846154vw, 30rem);
    -webkit-padding-start: clamp(2.25rem, 0.7115384615rem + 2.4038461538vw, 2.875rem);
            padding-inline-start: clamp(2.25rem, 0.7115384615rem + 2.4038461538vw, 2.875rem);
  }
}
.top-concept__card.is-concept-03 .top-concept__card-text {
  position: relative;
}
.top-concept__card.is-concept-03 .top-concept__card-text::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: unset;
  bottom: 0;
  left: unset;
  right: -0.625rem;
  width: 5.0625rem;
  height: auto;
  -webkit-transform: rotate(-2.561deg);
          transform: rotate(-2.561deg);
  aspect-ratio: 81/58;
  background: url("../img/concept-bg-ill-bird-2.webp") center/contain no-repeat;
}
@media screen and (max-width: 374px) {
  .top-concept__card.is-concept-03 .top-concept__card-text::before {
    bottom: -3.125rem;
  }
}
@media (min-width: 1024px) {
  .top-concept__card.is-concept-03 .top-concept__card-text::before {
    top: unset;
    bottom: -2.875rem;
    right: 0rem;
    width: 5.0625rem;
    height: 3.625rem;
    -webkit-transform: rotate(-2.561deg);
            transform: rotate(-2.561deg);
    aspect-ratio: 81/58;
  }
}

.top-concept__card-img {
  max-width: 25rem;
}
.top-concept__card-img img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-concept__card-img {
    max-width: unset;
  }
}

.top-concept__card-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 1rem;
  width: 100%;
}
@media (min-width: 1024px) {
  .top-concept__card-content {
    min-width: 21.875rem;
  }
}

.top-concept__card-head {
  color: #f4a75a;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.6; /* 32px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .top-concept__card-head {
    font-size: clamp(1.25rem, 0.6346153846rem + 0.9615384615vw, 1.5rem);
  }
}

.top-concept__card-head--green {
  color: #468812;
}

.top-concept__card-text {
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.8; /* 27px */
  letter-spacing: 0.04em;
}
.top-concept__card-text span {
  display: block;
}
.top-concept__card-text span + span {
  -webkit-margin-before: 1.5rem;
          margin-block-start: 1.5rem;
}
@media (min-width: 768px) {
  .top-concept__card-text {
    font-size: clamp(0.9375rem, 0.7836538462rem + 0.2403846154vw, 1rem);
    font-weight: 500;
    line-height: 2; /* 32px */
    letter-spacing: 0.04em;
  }
}

.top-bg1__img {
  width: 100%;
  height: auto;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  aspect-ratio: 332/193;
  line-height: 0;
}
.top-bg1__img img,
.top-bg1__img picture {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-bg1__img {
    aspect-ratio: 1440/666;
  }
}

.top-features {
  position: relative;
  overflow: hidden;
  -webkit-padding-before: 5rem;
          padding-block-start: 5rem;
  -webkit-padding-after: 2.75rem;
          padding-block-end: 2.75rem;
}
@media (min-width: 768px) {
  .top-features {
    -webkit-padding-before: 10rem;
            padding-block-start: 10rem;
    -webkit-padding-after: 10.3125rem;
            padding-block-end: 10.3125rem;
  }
}

.top-features__inner {
  padding-inline: unset;
}

.top-features__decoration-orange {
  position: absolute;
  z-index: -1;
  top: -7.5rem;
  bottom: unset;
  left: calc(50vw + clamp(3.125rem, -7.6371173469rem + 45.9183673469vw, 14.375rem));
  right: unset;
  width: 20.0625rem;
  height: auto;
  aspect-ratio: 107/101;
}
.top-features__decoration-orange img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-features__decoration-orange {
    width: 57.25rem;
    aspect-ratio: 93/86;
    top: -19.0625rem;
    bottom: unset;
    left: calc(50vw + 15rem);
    right: unset;
  }
}
@media (min-width: 1441px) {
  .top-features__decoration-orange {
    left: calc(50vw + clamp(15rem, -5.9260500447rem + 23.2350312779vw, 31.25rem));
  }
}

.top-features__decoration-yellow {
  position: absolute;
  z-index: -1;
  top: unset;
  bottom: -3.125rem;
  left: -6.25rem;
  right: unset;
  width: 20.0625rem;
  height: auto;
  aspect-ratio: 107/101;
}
.top-features__decoration-yellow img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-features__decoration-yellow {
    width: 57.25rem;
    aspect-ratio: 93/86;
    top: unset;
    bottom: -27.5rem;
    left: -28.4375rem;
    right: unset;
  }
}
@media (min-width: 1441px) {
  .top-features__decoration-yellow {
    left: clamp(-28.4375rem, -40.8928571429rem + 13.8392857143vw, -18.75rem);
  }
}

.top-features__title-jp {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}
.top-features__title-jp::after {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(10rem, 8.8042091837rem + 5.1020408163vw, 11.25rem);
  width: 4.8125rem;
  height: auto;
  aspect-ratio: 77/64;
  background: url("../img/features-title-ill.webp") center/contain no-repeat;
  -webkit-transform: translateY(-50%) translateX(1rem);
          transform: translateY(-50%) translateX(1rem);
}
@media (min-width: 768px) {
  .top-features__title-jp::after {
    top: 1.125rem;
    left: 12.875rem;
    width: 10rem;
    aspect-ratio: 40/33;
  }
}

.top-features__lead {
  -webkit-margin-before: 2rem;
          margin-block-start: 2rem;
  text-align: center;
  font-size: 1rem;
  font-weight: 500;
  line-height: 2; /* 32px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .top-features__lead {
    -webkit-margin-before: 2.5rem;
            margin-block-start: 2.5rem;
    font-size: 1.25rem;
    font-style: normal;
  }
}

.top-features__card {
  width: 19.25rem;
  height: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 0.5rem;
  padding-block: 2rem;
  padding-inline: 1.5rem;
  flex-direction: column;
  border-radius: 1.5rem;
  background: #ffffff;
  -webkit-box-shadow: 0 0 0.75rem 0 rgba(0, 0, 0, 0.04);
          box-shadow: 0 0 0.75rem 0 rgba(0, 0, 0, 0.04);
}
@media (min-width: 768px) {
  .top-features__card {
    width: 20.625rem;
    padding-block: 2.5rem;
  }
}

.top-features__card-number-block {
  position: absolute;
  z-index: 1;
  top: 0.375rem;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 4.625rem;
  height: 4.625rem;
  aspect-ratio: 1/1;
  background: url("../img/features-number-1.webp") center/contain no-repeat;
  display: grid;
  place-items: center;
}
@media (min-width: 768px) {
  .top-features__card-number-block {
    width: 5rem;
    height: 5rem;
  }
}

.top-features__card-feature {
  display: block;
  color: #ffffff;
  font-family: "Quicksand", sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1;
  position: absolute;
  z-index: 1;
  top: calc(50% - 0.8125rem);
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media (min-width: 768px) {
  .top-features__card-feature {
    font-size: 0.625rem;
    top: calc(50% - 0.9375rem);
  }
}

.top-features__card-number {
  display: block;
  color: #ffffff;
  font-family: "Quicksand", sans-serif;
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.04em;
  -webkit-padding-before: 1.125rem;
          padding-block-start: 1.125rem;
}
@media (min-width: 768px) {
  .top-features__card-number {
    font-size: 2rem;
    -webkit-padding-before: 0.75rem;
            padding-block-start: 0.75rem;
  }
}

.top-features__card-img {
  width: 16rem;
  height: auto;
  aspect-ratio: 256/165;
  border-radius: 0.9125rem;
  overflow: hidden;
}
.top-features__card-img img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-features__card-img {
    border-radius: 1rem;
    width: 17.1875rem;
  }
}

.top-features__card-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 0.375rem;
}
@media (min-width: 1024px) {
  .top-features__card-content {
    padding-inline: 0.1875rem;
  }
}

.top-features__card-head {
  text-align: center;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.6; /* 27.2px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .top-features__card-head {
    font-size: 1.25rem;
  }
}

.top-features__card-text {
  color: #8c6a4b;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.6; /* 24px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .top-features__card-text {
    font-size: 0.9090625rem;
  }
}

.top-features__swiper-slide {
  -webkit-padding-before: 2.625rem;
          padding-block-start: 2.625rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: auto;
}
.top-features__swiper-slide.is-feature-01 .top-features__card-head {
  color: #eb772b;
}
.top-features__swiper-slide.is-feature-01 .top-features__card-number-block {
  background: url("../img/features-number-1.webp") center/contain no-repeat;
}
.top-features__swiper-slide.is-feature-02 .top-features__card-head {
  color: #f08261;
}
.top-features__swiper-slide.is-feature-02 .top-features__card-number-block {
  background: url("../img/features-number-2.webp") center/contain no-repeat;
}
.top-features__swiper-slide.is-feature-03 .top-features__card-head {
  color: #468812;
}
.top-features__swiper-slide.is-feature-03 .top-features__card-number-block {
  background: url("../img/features-number-3.webp") center/contain no-repeat;
}
.top-features__swiper-slide.is-feature-04 .top-features__card-head {
  color: #e57980;
}
.top-features__swiper-slide.is-feature-04 .top-features__card-number-block {
  background: url("../img/features-number-4.webp") center/contain no-repeat;
}
.top-features__swiper-slide.is-feature-05 .top-features__card-head {
  color: #e7ac18;
}
.top-features__swiper-slide.is-feature-05 .top-features__card-number-block {
  background: url("../img/features-number-5.webp") center/contain no-repeat;
}
.top-features__swiper-container,
.top-features__swiper,
.top-features__swiper-wrapper,
.top-features__swiper-slide {
  position: relative;
}

.top-features__swiper-container {
  max-width: 31.25rem;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .top-features__swiper-container {
    max-width: unset;
    width: clamp(31.25rem, -8.4642857143rem + 82.7380952381vw, 66rem);
  }
}

.top-features__swiper {
  padding-block: 1.5rem;
}
@media (min-width: 768px) {
  .top-features__swiper {
    -webkit-padding-before: clamp(2.25rem, 1.1388888889rem + 2.3148148148vw, 2.875rem);
            padding-block-start: clamp(2.25rem, 1.1388888889rem + 2.3148148148vw, 2.875rem);
    -webkit-padding-after: clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem);
            padding-block-end: clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem);
  }
}

.top-features__swiper-controls {
  display: grid;
  place-items: center;
}

.swiper-button-prev,
.swiper-button-next,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  top: unset;
  bottom: unset;
  left: unset;
  right: unset;
  margin: 0;
  padding: 0;
}

.swiper-button-prev::after,
.swiper-button-next::after {
  content: "";
}

.swiper-button-prev,
.swiper-button-next {
  width: 5rem;
  height: auto;
  aspect-ratio: 1/1;
  top: 50%;
}
.swiper-button-prev img,
.swiper-button-next img {
  width: 100%;
  height: 100%;
}
@media (min-width: 768px) {
  .swiper-button-prev,
  .swiper-button-next {
    width: 5.625rem;
    height: auto;
    top: 45%;
  }
}
.swiper-button-prev::after,
.swiper-button-next::after {
  display: none;
}

.swiper-button-prev {
  left: 0.125rem;
  background: url("../img/features-page-prev.webp") center/contain no-repeat;
}
@media screen and (max-width: 374px) {
  .swiper-button-prev {
    left: -0.5rem;
  }
}
@media (min-width: 768px) {
  .swiper-button-prev {
    left: -7.6875rem;
  }
}

.swiper-button-next {
  right: 0.125rem;
  background: url("../img/features-page-next.webp") center/contain no-repeat;
}
@media screen and (max-width: 374px) {
  .swiper-button-next {
    right: -0.5rem;
  }
}
@media (min-width: 768px) {
  .swiper-button-next {
    right: -7.6875rem;
  }
}

.top-news {
  background: url("../img/bg-beige1.webp") top left repeat;
  overflow-x: hidden;
}
@media (min-width: 768px) {
  .top-news {
    -webkit-padding-after: 10rem;
            padding-block-end: 10rem;
  }
}

.inner.top-news__inner {
  padding-inline: 1rem;
}

.top-news__title {
  display: grid;
  place-content: center;
  text-align: center;
  position: relative;
}
.top-news__title::after {
  content: "";
  position: absolute;
  top: -3.125rem;
  left: clamp(11.75rem, 11.034351145rem + 3.0534351145vw, 12.5rem);
  width: 7.75rem;
  height: auto;
  aspect-ratio: 124/83;
  background: url("../img/news-title-ill-bird.webp") center/contain no-repeat;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media (min-width: 768px) {
  .top-news__title::after {
    top: clamp(-3.125rem, -7.4583333333rem + 9.0277777778vw, -0.6875rem);
    left: clamp(18.75rem, 10.9722222222rem + 16.2037037037vw, 23.125rem);
    width: 13.75rem;
    height: auto;
    aspect-ratio: 220/147;
  }
}

.top-news__title-jp {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  --ill-w: 3.625rem;
  --ill-h: 3.625rem;
  --gap: 0rem;
}
.top-news__title-jp::before, .top-news__title-jp::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--ill-w);
  height: var(--ill-h);
  aspect-ratio: var(--ill-w)/var(--ill-h);
  background: url("../img/news-title-ill.webp") center/contain no-repeat;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.top-news__title-jp::before {
  left: 0;
  right: unset;
  -webkit-transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
          transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
}
.top-news__title-jp::after {
  left: unset;
  right: 0;
  -webkit-transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
          transform: translateY(-50%) translateX(calc(var(--ill-w) + var(--gap)));
}
@media (min-width: 768px) {
  .top-news__title-jp {
    --ill-w: 4.9375rem;
    --ill-h: 4.9375rem;
    --gap: 2.5rem;
  }
}

.top-news__lead {
  text-align: center;
  -webkit-margin-before: 1.875rem;
          margin-block-start: 1.875rem;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2; /* 32px */
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .top-news__lead {
    -webkit-margin-before: clamp(2.5rem, 1.9444444444rem + 1.1574074074vw, 2.8125rem);
            margin-block-start: clamp(2.5rem, 1.9444444444rem + 1.1574074074vw, 2.8125rem);
    font-size: 1.25rem;
    font-weight: 500;
  }
}

.top-news__wrap {
  -webkit-padding-before: 2.1875rem;
          padding-block-start: 2.1875rem;
  padding-inline: unset;
}
@media (min-width: 768px) {
  .top-news__wrap {
    padding-block: 2.25rem;
    padding-inline: clamp(1.875rem, -1.0138888889rem + 6.0185185185vw, 3.5rem);
  }
}

.top-news__cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 1.25rem;
}
@media (min-width: 768px) {
  .top-news__cards {
    row-gap: 2rem;
  }
}

.top-news__card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 0.875rem;
     -moz-column-gap: 0.875rem;
          column-gap: 0.875rem;
  -webkit-padding-after: 1.125rem;
          padding-block-end: 1.125rem;
  position: relative;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
.top-news__card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.09375rem;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #ffffff), color-stop(0.375rem, #ffffff), color-stop(0.375rem, transparent), color-stop(0.75rem, transparent));
  background-image: linear-gradient(to right, #ffffff 0, #ffffff 0.375rem, transparent 0.375rem, transparent 0.75rem);
  background-size: 0.75rem 0.0625rem;
  background-repeat: repeat-x;
}
@media (min-width: 768px) {
  .top-news__card {
    -webkit-padding-after: 2rem;
            padding-block-end: 2rem;
    -webkit-column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
       -moz-column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
            column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
  }
  .top-news__card::after {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #ffffff), color-stop(0.3125rem, #ffffff), color-stop(0.3125rem, transparent), color-stop(0.625rem, transparent));
    background-image: linear-gradient(to right, #ffffff 0, #ffffff 0.3125rem, transparent 0.3125rem, transparent 0.625rem);
  }
}
.top-news__card:hover {
  opacity: 0.7;
}

.top-news__card-images {
  margin-block: auto;
  width: 7.4375rem;
  height: auto;
  border-radius: 1rem;
  overflow: hidden;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  aspect-ratio: 119/68;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  max-width: 100%;
}
.top-news__card-images img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-news__card-images {
    aspect-ratio: 210/120;
    width: 13.125rem;
    height: auto;
  }
}

.top-news__card-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-column-gap: 0.5rem;
     -moz-column-gap: 0.5rem;
          column-gap: 0.5rem;
}
@media (min-width: 768px) {
  .top-news__card-block {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.top-news__card-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* これで次の行に折り返す */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
     -moz-column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
          column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
  row-gap: 0.375rem;
}

.top-news__card-date {
  color: #8c6a4b;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6; /* 22.4px */
  letter-spacing: 0.01em;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media (min-width: 768px) {
  .top-news__card-date {
    color: #8c6a4b;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6; /* 25.6px */
    letter-spacing: 0.05em;
  }
}

.top-news__card-category {
  padding-block: 0.25rem;
  padding-inline: 1.25rem;
  border-radius: 0.5rem;
  border: 0.0625rem solid #f08261;
  background: #ffffff;
  color: #f08261;
  font-size: 0.625rem;
  font-weight: 400;
  letter-spacing: 0.01em;
}
@media (min-width: 768px) {
  .top-news__card-category {
    padding-inline: 1.5rem;
    padding-block: unset;
  }
}

.top-news__card-head {
  color: #4b3d33;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.05em;
}
@media (min-width: 768px) {
  .top-news__card-head {
    font-size: 1.5rem;
    letter-spacing: 0.05em;
  }
}

.top-news__empty {
  text-align: center;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.05em;
}

.top-news__button {
  -webkit-margin-before: 2.5rem;
          margin-block-start: 2.5rem;
}
@media (min-width: 768px) {
  .top-news__button {
    -webkit-margin-before: 0.625rem;
            margin-block-start: 0.625rem;
  }
}
.top-news__button.button-forward {
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
  -webkit-margin-start: 1.375rem;
          margin-inline-start: 1.375rem;
}

.top-access {
  position: relative;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .top-access {
    -webkit-padding-before: 10.1875rem;
            padding-block-start: 10.1875rem;
  }
}

.top-access__decoration-orange {
  position: absolute;
  z-index: -1;
  top: -4.375rem;
  left: calc(50vw + clamp(3.125rem, -7.6371173469rem + 45.9183673469vw, 14.375rem));
  width: 16.5rem;
  height: 16.1875rem;
  aspect-ratio: 53/52;
}
.top-access__decoration-orange img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-access__decoration-orange {
    top: -16.875rem;
    left: calc(50vw + clamp(10.3125rem, -32.7468722073rem + 47.8105451296vw, 43.75rem));
    width: 59.3900625rem;
    height: 59.3900625rem;
    aspect-ratio: 1/1;
    -webkit-transform: rotate(-9.397deg);
            transform: rotate(-9.397deg);
  }
}

.top-access__decoration-yellow {
  display: none;
}
@media (min-width: 768px) {
  .top-access__decoration-yellow {
    display: block;
    position: absolute;
    z-index: -2;
    top: 15.625rem;
    left: calc(50vw + clamp(15.625rem, -31.0561885612rem + 51.8319928508vw, 51.875rem));
    width: 39.6875rem;
    height: 41.1875rem;
    aspect-ratio: 53/55;
  }
  .top-access__decoration-yellow img {
    width: 100%;
    height: 100%;
    display: block;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
  }
}

@media (min-width: 768px) {
  .inner.top-access__inner {
    padding-inline: unset;
    max-width: 70.75rem;
  }
}

.top-access__title-jp {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  --ill-w: 2.5rem;
  --ill-h: 2.5rem;
  --gap: 3.75rem;
}
.top-access__title-jp::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--ill-w);
  height: var(--ill-h);
  aspect-ratio: var(--ill-w)/var(--ill-h);
  -webkit-transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
          transform: translateY(-50%) translateX(calc(-1 * (var(--ill-w) + var(--gap))));
  background: url("../img/access-title-ill.webp") center/contain no-repeat;
}
@media (min-width: 768px) {
  .top-access__title-jp {
    --ill-w: 4.5rem;
    --ill-h: 4.5rem;
    --gap: 4.375rem;
  }
}

.top-access__wrap {
  width: min(31.25rem, 100%);
  -webkit-margin-before: 2.5rem;
          margin-block-start: 2.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .top-access__wrap {
    width: 100%;
    max-width: clamp(31.25rem, -18.75rem + 104.1666666667vw, 75rem);
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
    grid-template-areas: "head ." "content map";
  }
}

.top-access__head {
  text-align: center;
  font-size: 1.375rem;
  font-weight: 500;
  line-height: 1.6; /* 35.2px */
  letter-spacing: 0.04em;
  -webkit-padding-after: 0.4375rem;
          padding-block-end: 0.4375rem;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.top-access__head::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100%;
  height: 2px;
  background: url("../img/access-border.svg") center/contain repeat-x;
}
@media (min-width: 1024px) {
  .top-access__head {
    grid-area: head;
    font-size: 1.5rem;
    font-weight: 700;
    -webkit-padding-after: 0.25rem;
            padding-block-end: 0.25rem;
    display: inline-block;
  }
}

.top-access__line {
  display: block;
}
.top-access__line.top-access__line1 {
  text-indent: -1em;
}
@media (min-width: 1024px) {
  .top-access__line {
    display: inline;
  }
  .top-access__line.top-access__line1 {
    text-indent: unset;
  }
}

.top-access__content {
  -webkit-margin-before: 1.875rem;
          margin-block-start: 1.875rem;
}
@media (min-width: 768px) {
  .top-access__content {
    grid-area: content;
    -webkit-margin-before: 1rem;
            margin-block-start: 1rem;
  }
}
@media (min-width: 1024px) {
  .top-access__content {
    width: clamp(25rem, 5.9230769231rem + 29.8076923077vw, 32.75rem);
    -webkit-margin-before: 2.125rem;
            margin-block-start: 2.125rem;
  }
}

@media (min-width: 768px) {
  .top-access__info .top-access__item:nth-child(7) .top-access__desc .top-access__list {
    padding-inline: 0rem;
  }
}

.top-access__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 1.15625rem;
     -moz-column-gap: 1.15625rem;
          column-gap: 1.15625rem;
  -webkit-border-after: 0.0625rem solid #d8c8b1;
          border-block-end: 0.0625rem solid #d8c8b1;
  -webkit-padding-before: 0.9375rem;
          padding-block-start: 0.9375rem;
  -webkit-padding-after: 1.03125rem;
          padding-block-end: 1.03125rem;
}
.top-access__item:nth-of-type(1) {
  -webkit-padding-before: 0;
          padding-block-start: 0;
}
@media screen and (max-width: 374px) {
  .top-access__item {
    -webkit-column-gap: 1rem;
       -moz-column-gap: 1rem;
            column-gap: 1rem;
  }
}

.top-access__term {
  color: #eb772b;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.04em;
  min-width: 5rem;
}
@media (min-width: 768px) {
  .top-access__term {
    min-width: clamp(6.875rem, 0.7211538462rem + 9.6153846154vw, 9.375rem);
  }
}

.top-access__desc {
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.8; /* 27px */
  letter-spacing: 0.0375em;
}
@media (min-width: 768px) {
  .top-access__desc {
    font-size: 1rem;
    font-weight: 500;
    line-height: 2; /* 32px */
    letter-spacing: 0.04em;
  }
}

.top-access__list {
  -webkit-padding-start: 0.4em;
          padding-inline-start: 0.4em; /* インデントは維持 */
}
.top-access__list-item {
  position: relative;
}
.top-access__list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9em; /* 縦位置調整 */
  width: 0.25rem; /* 黒丸の幅（＝サイズ） */
  height: 0.25rem; /* 黒丸の高さ */
  background-color: #4b3d33; /* 黒色 */
  border-radius: 50%; /* 丸くする */
}

.top-access__map {
  width: 100%;
  height: min(12.5rem, 100%);
  aspect-ratio: 100/59;
  border-radius: 1.5rem;
  border: none;
  -webkit-box-shadow: 0 0 0 0.5rem #ffffff;
          box-shadow: 0 0 0 0.5rem #ffffff;
  overflow: hidden;
  -webkit-margin-before: 2.5rem;
          margin-block-start: 2.5rem;
}
.top-access__map iframe {
  width: 100%;
  height: 100%;
}
@media (min-width: 1024px) {
  .top-access__map {
    grid-area: map;
    -webkit-margin-before: 2.125rem;
            margin-block-start: 2.125rem;
    width: min(35.375rem, 100%);
    height: auto;
    margin-inline: 2.3125rem;
    aspect-ratio: 1/1;
  }
}

.top-qa {
  position: relative;
  overflow: hidden;
}
@media (min-width: 768px) {
  .top-qa {
    -webkit-padding-before: 1.875rem;
            padding-block-start: 1.875rem;
  }
}

.inner.top-qa__inner {
  padding-inline: 1rem;
}
@media (min-width: 768px) {
  .inner.top-qa__inner {
    padding-inline: unset;
  }
}

.top-qa__decoration-orange {
  position: absolute;
  z-index: -1;
  top: 21.5625rem;
  left: calc(clamp(17.5rem, 16.3042091837rem + 5.1020408163vw, 18.75rem) * -1);
  width: 31.0625rem;
  height: 31.8125rem;
  aspect-ratio: 83/85;
}
.top-qa__decoration-orange img {
  width: 100%;
  height: 100%;
}
@media (min-width: 768px) {
  .top-qa__decoration-orange {
    width: 70.75rem;
    height: 69.25rem;
    aspect-ratio: 47/46;
    top: 1.5625rem;
    left: clamp(-50rem, -75.2142857143rem + 52.5297619048vw, -27.9375rem);
  }
}

.top-qa__title-jp {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}
.top-qa__title-jp::after {
  content: "";
  position: absolute;
  top: 30%;
  left: 92%;
  width: 3.625rem;
  height: 3.9375rem;
  aspect-ratio: 58/63;
  background: url("../img/qa-title-ill.webp") center/contain no-repeat;
  -webkit-transform: translateY(-50%) translateX(1rem);
          transform: translateY(-50%) translateX(1rem);
}
@media (min-width: 768px) {
  .top-qa__title-jp::after {
    width: 4.5625rem;
    height: 4.9375rem;
    aspect-ratio: 73/79;
  }
}

.top-qa__wrap {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  row-gap: 1.25rem;
  -webkit-margin-before: 2.5rem;
          margin-block-start: 2.5rem;
}
@media (min-width: 900px) and (max-width: 1023px) {
  .top-qa__wrap {
    width: 85%;
  }
}
@media (min-width: 768px) {
  .top-qa__wrap {
    width: min(62.5rem, 90%);
    margin-inline: auto;
    -webkit-margin-before: 2.5rem;
            margin-block-start: 2.5rem;
    row-gap: 2rem;
  }
}

.top-qa__content:not(:first-child) {
  -webkit-margin-before: 1rem;
          margin-block-start: 1rem;
}
@media (min-width: 768px) {
  .top-qa__content:not(:first-child) {
    -webkit-margin-before: unset;
            margin-block-start: unset;
  }
}

details:hover {
  cursor: pointer;
}

summary {
  display: block;
}
summary::-webkit-details-marker {
  display: none;
}

.top-qa__question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background: #ffffff;
  border-radius: 0.625rem;
  -webkit-padding-before: 1rem;
          padding-block-start: 1rem;
  -webkit-padding-after: 1rem;
          padding-block-end: 1rem;
  -webkit-padding-start: 1.5rem;
          padding-inline-start: 1.5rem;
  -webkit-padding-end: 1.5rem;
          padding-inline-end: 1.5rem;
}
@media screen and (max-width: 374px) {
  .top-qa__question {
    -webkit-padding-start: 1.125rem;
            padding-inline-start: 1.125rem;
    -webkit-padding-end: 1.125rem;
            padding-inline-end: 1.125rem;
  }
}
@media (min-width: 768px) {
  .top-qa__question {
    -webkit-padding-before: 0.875rem;
            padding-block-start: 0.875rem;
    -webkit-padding-after: 1.125rem;
            padding-block-end: 1.125rem;
    -webkit-padding-start: 1.5rem;
            padding-inline-start: 1.5rem;
    -webkit-padding-end: 1.5rem;
            padding-inline-end: 1.5rem;
  }
}

.top-qa__question-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (min-width: 768px) {
  .top-qa__question-body {
    -webkit-column-gap: 1.5rem;
       -moz-column-gap: 1.5rem;
            column-gap: 1.5rem;
  }
}

.top-qa__question-q {
  width: 2.25rem;
  height: 2.25rem;
  aspect-ratio: 1/1;
  border-radius: 50%;
  color: #ffffff;
  background: #4b3d33;
  font-family: "Quicksand", sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.125;
  padding-block: 0.4375rem;
  padding-inline: 0.6875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.top-qa__question-text {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0em;
  -webkit-padding-end: unset;
          padding-inline-end: unset;
}
@media screen and (max-width: 374px) {
  .top-qa__question-text {
    -webkit-padding-end: 0.375rem;
            padding-inline-end: 0.375rem;
  }
}
@media (min-width: 768px) {
  .top-qa__question-text {
    -webkit-padding-end: unset;
            padding-inline-end: unset;
    font-size: 1.125rem;
  }
}

.top-qa__icon {
  position: relative;
  display: block;
  width: 1rem;
  height: auto;
  aspect-ratio: 1;
}
.top-qa__icon::before, .top-qa__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  right: 0;
  background: #4b3d33;
}
.top-qa__icon::before {
  width: 100%;
  height: 0.125rem;
}
.top-qa__icon::after {
  left: calc(50% - 0.0625rem);
  width: 0.125rem;
  height: 100%;
  -webkit-transition: rotate 0.3s ease;
  transition: rotate 0.3s ease;
}

.top-qa__answer {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 1.5rem;
     -moz-column-gap: 1.5rem;
          column-gap: 1.5rem;
  padding-inline: 1.625rem;
}
@media (min-width: 768px) {
  .top-qa__answer {
    -webkit-padding-start: 1.5rem;
            padding-inline-start: 1.5rem;
    -webkit-padding-end: 1.625rem;
            padding-inline-end: 1.625rem;
    -webkit-column-gap: 1.5rem;
       -moz-column-gap: 1.5rem;
            column-gap: 1.5rem;
  }
}

.top-qa__answer-a {
  width: 2.25rem;
  height: 2.25rem;
  aspect-ratio: 1/1;
  border-radius: 50%;
  color: #ffffff;
  background: #f4a75a;
  font-family: "Quicksand", sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.125;
  padding-block: 0.4375rem;
  padding-inline: 0.6875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-margin-before: 1rem;
          margin-block-start: 1rem;
}
@media (min-width: 768px) {
  .top-qa__answer-a {
    -webkit-margin-before: 1.375rem;
            margin-block-start: 1.375rem;
  }
}

.top-qa__answer-text {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8; /* 28.8px */
  letter-spacing: 0.04em;
  -webkit-margin-before: 1rem;
          margin-block-start: 1rem;
}
@media (min-width: 768px) {
  .top-qa__answer-text {
    -webkit-margin-before: 1.375rem;
            margin-block-start: 1.375rem;
  }
}

.js-details.is-opened .top-qa__icon::after {
  rotate: 90deg;
}

.top-bg2__img {
  width: 100%;
  height: auto;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  aspect-ratio: 5/3;
}
.top-bg2__img img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .top-bg2__img {
    aspect-ratio: 1440/550;
  }
}

/*----------------------------------
  _news.scss
  @function お知らせ一覧を定義
  @description
-----------------------------------*/
@media (min-width: 768px) {
  .page-news {
    -webkit-padding-after: 1.25rem;
            padding-block-end: 1.25rem;
  }
}
@media (min-width: 768px) {
  .page-news .breadcrumb {
    -webkit-margin-before: 1rem;
            margin-block-start: 1rem;
    -webkit-margin-after: unset;
            margin-block-end: unset;
  }
}

.page-news__inner {
  padding-inline: unset;
}

.page-news__wrap {
  width: 100%;
  max-width: 37.5rem;
  margin-inline: auto;
  border-radius: 2.5rem;
  background: #ffffff;
  padding-block: 4.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media (min-width: 768px) {
  .page-news__wrap {
    max-width: unset;
    width: min(62.5rem, 90%);
    border-radius: 5rem;
    -webkit-padding-before: 7rem;
            padding-block-start: 7rem;
    -webkit-padding-after: 7.5rem;
            padding-block-end: 7.5rem;
    padding-inline: clamp(5rem, 0.5555555556rem + 9.2592592593vw, 7.5rem);
  }
}

.page-news__contents {
  -webkit-margin-before: 2.375rem;
          margin-block-start: 2.375rem;
}
@media (min-width: 768px) {
  .page-news__contents {
    -webkit-margin-before: 4rem;
            margin-block-start: 4rem;
  }
}

.page-news__cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 1rem;
  padding-inline: clamp(0.84375rem, 0.2175572519rem + 2.6717557252vw, 1.5rem);
}
@media (min-width: 768px) {
  .page-news__cards {
    row-gap: 2rem;
    padding-inline: unset;
  }
}

.page-news__card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
  -webkit-padding-after: 1.1875rem;
          padding-block-end: 1.1875rem;
  position: relative;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
.page-news__card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.0625rem;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #777), color-stop(0.375rem, #777), color-stop(0.375rem, transparent), color-stop(0.75rem, transparent));
  background-image: linear-gradient(to right, #777 0, #777 0.375rem, transparent 0.375rem, transparent 0.75rem);
  background-size: 0.75rem 0.0625rem;
  background-repeat: repeat-x;
}
@media (min-width: 768px) {
  .page-news__card {
    -webkit-column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
       -moz-column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
            column-gap: clamp(1rem, -0.7142857143rem + 3.5714285714vw, 2.5rem);
    -webkit-padding-after: 2rem;
            padding-block-end: 2rem;
  }
  .page-news__card::after {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #777), color-stop(0.3125rem, #777), color-stop(0.3125rem, transparent), color-stop(0.625rem, transparent));
    background-image: linear-gradient(to right, #777 0, #777 0.3125rem, transparent 0.3125rem, transparent 0.625rem);
  }
}
.page-news__card:hover {
  opacity: 0.7;
}

.page-news__card-images {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  margin-block: auto;
  width: 7.4375rem;
  height: auto;
  border-radius: 1rem;
  overflow: hidden;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  aspect-ratio: 119/68;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  max-width: 100%;
}
.page-news__card-images img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .page-news__card-images {
    aspect-ratio: 210/120;
    width: 13.125rem;
    height: auto;
  }
}

.page-news__card-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  row-gap: 0.5rem;
}

.page-news__card-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* これで次の行に折り返す */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
     -moz-column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
          column-gap: clamp(0.375rem, -0.3522727273rem + 3.6363636364vw, 0.5rem);
  row-gap: 0.375rem;
}

.page-news__card-date {
  color: #8c6a4b;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6; /* 22.4px */
  letter-spacing: 0.05em;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media (min-width: 768px) {
  .page-news__card-date {
    color: #8c6a4b;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6; /* 25.6px */
    letter-spacing: 0.05em;
  }
}

.page-news__card-category {
  padding-inline: clamp(0.625rem, -3.0113636364rem + 18.1818181818vw, 1.25rem);
  border-radius: 0.5rem;
  border: 0.0625rem solid #f08261;
  background: #ffffff;
  color: #f08261;
  font-size: 0.625rem;
  font-weight: 400;
  letter-spacing: 0.01em;
}
@media (min-width: 768px) {
  .page-news__card-category {
    padding-inline: 1.5rem;
  }
}

.page-news__card-head {
  color: #4b3d33;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.6; /* 25.6px */
  letter-spacing: 0.05em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; /* 制限したい行数が3の場合 */
  overflow: hidden;
}
@media (min-width: 768px) {
  .page-news__card-head {
    font-size: 1.5rem;
    letter-spacing: 0.05em;
  }
}

/*----------------------------------
  _news-details.scss
  @function お知らせ個別記事を定義
  @description
-----------------------------------*/
.page-news-details__inner {
  padding-inline: unset;
}

.page-news-details__wrap {
  width: 100%;
  max-width: 37.5rem;
  margin-inline: auto;
  border-radius: 2.5rem;
  background: #ffffff;
  padding-block: 4.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media (min-width: 768px) {
  .page-news-details__wrap {
    max-width: unset;
    width: min(62.5rem, 90%);
    border-radius: 5rem;
    -webkit-padding-before: 7rem;
            padding-block-start: 7rem;
    -webkit-padding-after: clamp(5rem, 1.6666666667rem + 6.9444444444vw, 6.875rem);
            padding-block-end: clamp(5rem, 1.6666666667rem + 6.9444444444vw, 6.875rem);
    padding-inline: clamp(1.875rem, -4.7916666667rem + 13.8888888889vw, 5.625rem);
  }
}

.page-news-details__contents {
  padding-inline: clamp(1.03125rem, -1.5695950255rem + 11.0969387755vw, 3.75rem);
  -webkit-margin-before: 2.375rem;
          margin-block-start: 2.375rem;
}
@media (min-width: 768px) {
  .page-news-details__contents {
    -webkit-margin-before: 4rem;
            margin-block-start: 4rem;
    padding-inline: 30px;
  }
}

.page-news-details__head {
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1.6; /* 44.8px */
  letter-spacing: 0.04em;
  -webkit-padding-after: 1rem;
          padding-block-end: 1rem;
  position: relative;
}
.page-news-details__head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.0625rem;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #777), color-stop(0.375rem, #777), color-stop(0.375rem, transparent), color-stop(0.75rem, transparent));
  background-image: linear-gradient(to right, #777 0, #777 0.375rem, transparent 0.375rem, transparent 0.75rem);
  background-size: 0.75rem 0.0625rem;
  background-repeat: repeat-x;
}
@media (min-width: 768px) {
  .page-news-details__head {
    -webkit-padding-after: 0.5rem;
            padding-block-end: 0.5rem;
  }
}

.page-news-details__meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  row-gap: 0.625rem;
  padding-block: 1rem;
  -webkit-column-gap: 0.625rem;
     -moz-column-gap: 0.625rem;
          column-gap: 0.625rem;
}

.page-news-details__date {
  color: #8c6a4b;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6; /* 22.4px */
  letter-spacing: 0.05em;
}
@media (min-width: 768px) {
  .page-news-details__date {
    letter-spacing: 0.125em;
  }
}

.page-news-details__category {
  padding-inline: 1.25rem;
  color: #f08261;
  border-radius: 0.5rem;
  border: 0.0625rem solid #f08261;
  background: #ffffff;
  color: #f08261;
  text-align: center;
  font-size: 0.625rem;
  font-weight: 400;
  letter-spacing: 0.01em;
}
@media (min-width: 768px) {
  .page-news-details__category {
    padding-inline: 1.5rem;
  }
}

.page-news-details__images {
  aspect-ratio: 342/205;
  width: 100%;
  height: auto;
  border-radius: 1.5rem;
  overflow: hidden;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.page-news-details__images img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 768px) {
  .page-news-details__images {
    aspect-ratio: 760/410;
    width: min(47.5rem, 100%);
    height: auto;
  }
  .page-news-details__images img {
    -o-object-position: center -10%;
       object-position: center -10%;
  }
}

.page-news-details__textarea {
  color: #333;
  font-size: 1rem;
  font-weight: 500;
  line-height: 2; /* 32px */
  letter-spacing: 0.04em;
  -webkit-margin-before: 1rem;
          margin-block-start: 1rem;
}
@media (min-width: 768px) {
  .page-news-details__textarea {
    -webkit-margin-before: 2.5rem;
            margin-block-start: 2.5rem;
  }
}

.page-news-details__button {
  -webkit-margin-before: 4rem;
          margin-block-start: 4rem;
}
@media (min-width: 768px) {
  .page-news-details__button {
    -webkit-margin-before: clamp(4rem, 2.8888888889rem + 2.3148148148vw, 4.625rem);
            margin-block-start: clamp(4rem, 2.8888888889rem + 2.3148148148vw, 4.625rem);
  }
}

/*----------------------------------
  _news-links.scss
  @function お知らせのカテゴリーフィルターを定義
  @description
-----------------------------------*/
.page-news__links {
  padding-inline: 1.375rem;
}
@media (min-width: 768px) {
  .page-news__links {
    width: min(50rem, 100%);
  }
}

.page-news__filter-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* これで次の行に折り返す */
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  row-gap: 0.75rem;
  -webkit-column-gap: 0.5rem;
     -moz-column-gap: 0.5rem;
          column-gap: 0.5rem;
}
@media (min-width: 768px) {
  .page-news__filter-list {
    -webkit-column-gap: 1.5rem;
       -moz-column-gap: 1.5rem;
            column-gap: 1.5rem;
  }
}

.page-news__filter-link {
  /* liの幅は中身に合わせる */
  border-radius: 0.5rem;
  border: 0.0625rem solid #f08261;
  background: #ffffff;
  padding-inline: 1.25rem;
  color: #f08261;
  text-align: center;
  font-size: 0.625rem;
  font-weight: 400;
  letter-spacing: 0.4px;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
.page-news__filter-link:hover {
  opacity: 0.7;
}
.page-news__filter-link.is-active {
  background: #f08261;
  color: #ffffff;
}
@media (min-width: 768px) {
  .page-news__filter-link {
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.44px;
    padding-inline: 1.5rem;
  }
}

/*----------------------------------
  _page-404.scss
  @function 404ページのスタイルを定義
  @description

-----------------------------------*/
.page-404-section {
  -webkit-padding-after: 3.75rem;
          padding-block-end: 3.75rem;
}
@media (min-width: 768px) {
  .page-404-section {
    -webkit-padding-after: 5rem;
            padding-block-end: 5rem;
  }
}
.page-404-section .page-section-title .page-section-title-ja {
  margin-inline: auto;
  white-space: wrap;
}

.page-404__wrap {
  -webkit-margin-before: 2rem;
          margin-block-start: 2rem;
}
@media (min-width: 768px) {
  .page-404__wrap {
    -webkit-margin-before: 4rem;
            margin-block-start: 4rem;
  }
}

.page-404__contents {
  margin-inline: auto;
  position: relative;
  min-height: 12.5rem;
  max-width: 25rem;
}
.page-404__contents::after {
  content: "";
  position: absolute;
  bottom: -0.625rem;
  left: clamp(13.75rem, 4.1836734694rem + 40.8163265306vw, 23.75rem);
  width: 6.25rem;
  height: 5.9375rem;
  aspect-ratio: 20/19;
  background-image: url("../img/page-404-book.webp");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
}
@media (min-width: 768px) {
  .page-404__contents::after {
    width: 8.6875rem;
    height: 8.25rem;
    aspect-ratio: 139/132;
    left: clamp(27.5rem, 19.6428571429rem + 16.369047619vw, 34.375rem);
  }
}
@media (min-width: 768px) {
  .page-404__contents {
    max-width: 37.5rem;
  }
}

.page-404__button {
  -webkit-margin-before: 4rem;
          margin-block-start: 4rem;
}
@media (min-width: 768px) {
  .page-404__button {
    -webkit-margin-before: clamp(4rem, 2.2222222222rem + 3.7037037037vw, 5rem);
            margin-block-start: clamp(4rem, 2.2222222222rem + 3.7037037037vw, 5rem);
  }
}

/*----------------------------------
  _pagination.scss
  @function paginationを定義
  @description

-----------------------------------*/
.page-news__pagination {
  -webkit-margin-before: 4rem;
          margin-block-start: 4rem;
  text-align: center;
  color: #4b3d33;
  font-family: "Quicksand", sans-serif;
  font-size: 0.9375rem;
  font-weight: 500;
  width: 100%;
  padding-inline: 3rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-column-gap: 0.25rem;
     -moz-column-gap: 0.25rem;
          column-gap: 0.25rem;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
@media (min-width: 768px) {
  .page-news__pagination {
    -webkit-margin-before: 5rem;
            margin-block-start: 5rem;
  }
}
.page-news__pagination .page-numbers:not(.prev):not(.next) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2.375rem;
  height: 2.375rem;
  border-radius: 50%;
  font-size: 0.9375rem;
}
.page-news__pagination .page-numbers.current {
  background: #8c6a4b;
  color: #ffffff;
}
.page-news__pagination a {
  cursor: pointer;
}
.page-news__pagination a:hover {
  opacity: 0.7;
}
.page-news__pagination .page-numbers.prev {
  position: absolute;
  left: 0;
}
.page-news__pagination .page-numbers.next {
  position: absolute;
  right: 0;
}

/*----------------------------------
  to-topパーツ animation
-----------------------------------*/
.to-top {
  cursor: pointer;
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  width: 3.75rem;
  height: auto;
  aspect-ratio: 1/1;
  display: grid;
  place-items: center;
  z-index: 90;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease, scale 0.3s ease;
  transition: opacity 0.3s ease, scale 0.3s ease;
}
.to-top.js-show {
  opacity: 1;
  pointer-events: auto;
}
@media (min-width: 768px) {
  .to-top {
    width: 5rem;
    height: auto;
  }
  .to-top:hover {
    scale: 1.1;
  }
}