@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Jost:ital@0;1&family=M+PLUS+Rounded+1c:wght@300;400;500&family=Noto+Serif+JP:wght@200..900&family=Zen+Kaku+Gothic+New:wght@300;400;500&display=swap");

/*================================================================
# VARIABLES（フォント・色・余白・フォントサイズ・レイアウト）
================================================================*/
:root {
  /*--------------------------------------------
  ## FONTS
  --------------------------------------------*/
  --font-ja-mincho-default: "Noto Serif JP", serif;
  --font-ja-gothic: "Zen Kaku Gothic New", sans-serif;
  --font-en-gothic: "M PLUS Rounded 1c", sans-serif;
  --font-en-accent: "Jost", sans-serif;

  /*--------------------------------------------
  ## FONT SIZES（レスポンシブフォント）
  --------------------------------------------*/

  /* ============================================
    scale-font = 1 → 基本
    0.95 = 小さめ、1.05 = 大きめ

    ※ “抽象名で迷わないように”
       → コメントに最小px / 最大px を明記
  ============================================ */
  --scale-font: 1.1;

  /* XS：12〜13px（注釈・補足） */
  --fs-xs-13: calc(clamp(12px, 1vw, 13px) * var(--scale-font));

  /* SM：14〜16px（本文） */
  --fs-sm-16: calc(clamp(14px, 1.3vw, 16px) * var(--scale-font));

  /* MD：16〜20px（リード文） */
  --fs-md-20: calc(clamp(16px, 1.6vw, 20px) * var(--scale-font));

  /* LG：20〜25px（小見出し） */
  --fs-lg-25: calc(clamp(20px, 2.2vw, 25px) * var(--scale-font));

  /* XL：25〜31px（中見出し） */
  --fs-xl-31: calc(clamp(25px, 3vw, 31px) * var(--scale-font));

  /* 2XL：31〜39px（大見出し） */
  --fs-2xl-39: calc(clamp(31px, 4vw, 39px) * var(--scale-font));

  /* 3XL：39〜49px（セクションタイトル） */
  --fs-3xl-49: calc(clamp(39px, 5vw, 49px) * var(--scale-font));

  /* HERO：49〜61px（ファーストビュー） */
  --fs-hero-61: calc(clamp(49px, 7vw, 61px) * var(--scale-font));

  /*--------------------------------------------
  ## COLORS
  --------------------------------------------*/
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray: #dddddd;
  --color-light-gray: #ebe9e8;
  --color-pale-gray: #dadada;
  --color-soft-blue: #b3c4e7;
  --color-bright-blue: #0089ff;
  --color-steel-blue: #3d558b;
  --color-navy-blue: #193575;
  --color-dark-blue: #0c1d41;
  --color-pink-beige: #fbebe2;
  --color-cream-pink: #f6d3bf;
  --color-cream-orange: #fef3ef;
  --color-orange: #f2855c;
  --color-red-accent: #ea3323;

  /*--------------------------------------------
  ## LAYOUT（共通の横幅定義）
  --------------------------------------------*/
  --container: min(100%, 1180px);
  --container-wide: min(100%, 1400px);
  --container-full: min(100%, 1535px);

  /*--------------------------------------------
  ## SPACING（余白）
  --------------------------------------------*/

  /* ============================================
    scale-space = 1 → 基本（Figma通り / 標準余白）
    0.9 = 余白を少し詰める、1.1 = 少し広げる
    デザイナーが直感的につけた余白の“揺れ”は、
    最も近い階段値（24→32→40→48など）に吸収する。

    clamp で SP〜PC まで自然に可変
  ============================================ */

  --scale-space: 1.1;

  /* 極小〜小 */
  --space-4: calc(clamp(2px, 0.3vw, 4px) * var(--scale-space));
  --space-8: calc(clamp(4px, 0.6vw, 8px) * var(--scale-space));
  --space-12: calc(clamp(6px, 1vw, 12px) * var(--scale-space));
  --space-16: calc(clamp(8px, 1.2vw, 16px) * var(--scale-space));

  /* 小〜中 */
  --space-24: calc(clamp(12px, 1.8vw, 24px) * var(--scale-space));
  --space-32: calc(clamp(16px, 2.4vw, 32px) * var(--scale-space));
  --space-40: calc(clamp(20px, 3vw, 40px) * var(--scale-space));

  /* 中〜大 */
  --space-48: calc(clamp(24px, 3.8vw, 48px) * var(--scale-space));
  --space-64: calc(clamp(32px, 4.8vw, 64px) * var(--scale-space));

  /* セクション間（大余白） */
  --space-80: calc(clamp(40px, 6vw, 80px) * var(--scale-space));
  --space-120: calc(clamp(60px, 9vw, 120px) * var(--scale-space));
  --space-160: calc(clamp(80px, 12vw, 160px) * var(--scale-space));
}

/*================================================================
# BASE（基本設定）
================================================================*/
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-ja-mincho-default);
  font-size: var(--fs-sm-16);
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--color-black);
  position: relative;
  background: var(--color-navy-blue);
  color: var(--color-white);
}

body.theme-pink-beige {
  background: var(--color-pink-beige);
  color: var(--color-black);
}

a:hover,
a:active {
  opacity: 0.5;
}

/*================================================================
# VISIBILITY（表示切替）
================================================================*/
@media (min-width: 1254px) {
  .is_tab,
  .is_sp,
  .is_tab-sp {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1253px) {
  .is_pc,
  .is_sp {
    display: none;
  }
}

@media (max-width: 767px) {
  .is_pc,
  .is_tab,
  .is_pc-tab {
    display: none;
  }
}

/*================================================================
# LAYOUT（ヘッダー・フッター・共通レイアウト）
================================================================*/

/*--------------------------------------------
  ## HEADER（ヘッダー）
--------------------------------------------*/
.header {
  padding: var(--space-64) 0;
}

.header__inner {
  display: flex;
}

.header__logo {
  padding-top: var(--space-16);
  order: 1;
  padding-left: clamp(2.5rem, calc(-9.733009708737864rem + 25.485436893203882vw), 9.0625rem);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__logo {
    padding-left: 0;
    padding-top: var(--space-64);
    width: 100%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
}

.header__logo-row {
  display: flex;
  gap: var(--space-24);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__logo-row {
    height: 155px;
  }
}

.header__logo-main {
  font-size: var(--fs-2xl-39);
  letter-spacing: 0.18em;
  font-weight: 500;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-align: start;
  display: inline-block;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__logo-main {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
}

.header__logo-sub {
  font-size: var(--fs-xs-13);
  letter-spacing: 0.14em;
  line-height: 1.5;
  margin-top: 50px;
}

.header__logo-sub br {
  display: none;
}
/* * ：〜809px ----- */
@media (max-width: 809px) {
  .header__logo-sub span {
    display: none;
  }

  .header__logo-sub br {
    display: block;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__logo-sub {
    position: absolute;
    left: 50%;
    transform: translateX(55%);
  }
}

.header__logo-en {
  font-size: var(--fs-sm-16);
  font-family: var(--font-en-accent);
  color: var(--color-bright-blue);
  letter-spacing: 0.25em;
  line-height: 1.7;
  padding-top: var(--space-32);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__logo-en {
    padding-top: 33px;
    line-height: 1.5;
    text-align: center;
  }
}

/*--------------------------------------------
  ## HEADER-NAV（ヘッダーナビ）
--------------------------------------------*/
.header__nav {
  order: 2;
  flex-grow: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__nav {
    display: none;
  }
}

.header__nav-list {
  display: flex;
  flex-direction: row-reverse;
  gap: var(--space-48);
  margin-right: 160px;
}

.header__nav-list a {
  display: block;
  font-size: var(--fs-sm-16);
  letter-spacing: 0.1em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-align: start;
  display: inline-block;
}

.header__nav-list a:hover {
  opacity: 0.7;
}

.header__nav-list.open {
  right: 0;
}

/*--------------------------------------------
  ## GLOBAL-NAV（グローバルナビ）
--------------------------------------------*/
.global-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 40%;
  min-width: 375px;
  height: 100vh;
  background-color: var(--color-navy-blue);
  padding: 70px 4rem;
  overflow-y: auto;
  transform: translateX(-100%);
  z-index: 6;
}

.global-nav.open {
  transform: translateX(0);
}

.global-nav__list {
  display: flex;
  flex-direction: column;
  gap: clamp( 35px, calc( 33.07692307692308px + 0.5128205128205128vw ), 40px );
}

.is-shubidai-page .global-nav__list a {
  color: var(--color-white);
}

.global-nav__list-logo {
  width: 170px;
  margin-top: 50px;
}

/*--------------------------------------------
  ## HAMBURGER（ハンバーガーボタン）
--------------------------------------------*/
.header__hamburger {
  width: 69.7px;
  height: 69.7px;
  position: fixed;
  top: var(--space-64);
  right: 30px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--color-white);
  border: 1.5px solid #b7deff;
  border-radius: 50%;
  padding: 15px;
  margin: 0 var(--space-32) 0 var(--space-48);
  cursor: pointer;
  transition: all 0.3s ease;
  order: 3;
  z-index: 10;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__hamburger {
    width: 53.6px;
    height: 53.6px;
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 11px;
    margin: 0;
  }
}

.header__hamburger span,
.header__hamburger span::after,
.header__hamburger span::before {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 1.5px;
  background-color: var(--color-bright-blue);
  transition: all 0.4s;
}

.header__hamburger span {
  width: 22.5px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__hamburger span {
    width: 17px;
  }
}

.header__hamburger span::before {
  top: -8px;
  width: 37.6px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__hamburger span::before {
    width: 29px;
  }
}

.header__hamburger span::after {
  bottom: -8px;
  width: 37.6px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .header__hamburger span::after {
    width: 29px;
  }
}

.header__hamburger.open span {
  background-color: transparent;
}

.header__hamburger.open span::before {
  top: 0;
  transform: rotate(45deg);
  background-color: var(--color-bright-blue);
}

.header__hamburger.open span::after {
  bottom: 0;
  transform: rotate(-45deg);
  background-color: var(--color-bright-blue);
}

/*--------------------------------------------
  ## OVERLAY（オーバーレイ）
--------------------------------------------*/
.header__overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 4;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.header__overlay.open {
  opacity: 1;
  visibility: visible;
}


/*--------------------------------------------
  ## TRANSLATION（GTranslate対応）
--------------------------------------------*/
.translation {
  padding: 0 var(--space-32);
}

/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .translation {
    display: none;
  }
}

.translation__inner {
  display: flex;
  justify-content: flex-end;
}

/* GTranslate wrapper */
.translation .gtranslate_wrapper {
  display: flex;
  gap: var(--space-24);
}

/* 共通リンク */
.translation .gtranslate_wrapper a {
  display: inline-block;
  font-size: var(--fs-sm-16);
  letter-spacing: 0.08em;
  padding-left: 35px;
  position: relative;
  color: var(--color-white);
  text-decoration: none;
}

.is-shubidai-page .translation .gtranslate_wrapper a {
  color: var(--color-black);
}

/* 区切り線（ENGLISH側） */
.translation .gtranslate_wrapper a[data-gt-lang="en"] {
  padding-right: 20px;
  border-right: 1px solid var(--color-white);
}

.is-shubidai-page .translation .gtranslate_wrapper a[data-gt-lang="en"] {
  border-right: 1px solid var(--color-black);
}



/* GTranslate標準の国旗を非表示 */
.translation .gtranslate_wrapper a img {
  display: none;
}

/* 国旗アイコン */
.translation .gtranslate_wrapper a::before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

/* 日本語 */
.translation .gtranslate_wrapper a[data-gt-lang="ja"]::before {
  background: url(../img/common/icon_jp.webp) no-repeat center / contain;
}

/* 英語 */
.translation .gtranslate_wrapper a[data-gt-lang="en"]::before {
  background: url(../img/common/icon_usa.webp) no-repeat center / contain;
}


/*--------------------------------------------
  ## MAIN（メイン領域）
--------------------------------------------*/
.main {
  width: 100%;
  margin-inline: auto;
}

/*--------------------------------------------
  ## SECTION（共通セクション）
--------------------------------------------*/
.l-section {
  padding-block: var(--space-80);
}
.l-section__inner {
  width: var(--container);
  margin-inline: auto;
}

/*--------------------------------------------
  ## CONTAINER（横幅指定）
--------------------------------------------*/
.l-inner {
  width: var(--container);
  margin-inline: auto;
}
.l-wide {
  width: var(--container-wide);
  margin-inline: auto;
}
.l-full {
  width: var(--container-full);
  margin-inline: auto;
}

/*--------------------------------------------
  ## GRID（汎用グリッド）
--------------------------------------------*/
.l-grid {
  display: grid;
  gap: var(--space-32);
}
.l-two-column {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-40);
}

/*--------------------------------------------
  ## SIDEBAR（メイン + サイドバー）
--------------------------------------------*/
.l-sidebar-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: var(--space-40);
}

/*--------------------------------------------
  ## FOOTER（フッター）
--------------------------------------------*/
.footer {
  padding: var(--space-120) 0;
  background: url(../img/common/bg_footer.webp) no-repeat center center / cover;
  width: 100%;
  color: var(--color-white);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .footer {
    background: url(../img/common/bg_footer-sp.webp) no-repeat center center / cover;
  }
}

.footer__inner {
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
}

/* ナビゲーション */
.footer__nav {
  display: flex;
  align-items: flex-start;
  gap: var(--space-80);
}

/* --------- SP：767px以下 ---------- */
@media (max-width: 767px) {
  .footer__nav {
    flex-direction: column;
  }
}

.footer__nav-title {
  font-size: var(--fs-xs-16);
  font-family: var(--font-en-accent);
  color: var(--color-bright-blue);
  letter-spacing: 0.28em;
  line-height: 1.7;
}

.footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem var(--space-64);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .footer__nav-list {
    justify-content: center;
    gap: 0.5rem var(--space-32);
  }
}

.footer__nav-list a {
  display: inline-block;
  font-size: var(--fs-sm-16);
  letter-spacing: 0.08em;
  line-height: 2.3;
  white-space: nowrap;
}

/* ロゴ */
.footer__logo {
  display: block;
  margin-top: 177px;
  text-align: center;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .footer__logo {
    margin-top: 82px;
  }
}

.footer__logo-name {
  font-size: var(--fs-2xl-39);
  letter-spacing: 0.14em;
}

.footer__logo-description {
  font-size: var(--fs-xs-13);
  letter-spacing: 0.14em;
  margin-top: 10px;
}

/* 住所 */
.footer__address {
  font-family: var(--font-en-gothic);
  font-size: var(--fs-xs-13);
  margin-top: var(--space-40);
  text-align: center;
}

.footer__postcode {
  letter-spacing: 0.26em;
}

.footer__street {
  display: block;
  letter-spacing: 0.26em;
  line-height: 1.3;
  margin-top: 10px;
}

/* footer コピーライト
==================================*/
.copyright {
  font-size: clamp(10px, calc(9.538461538461538px + 0.1282051282051282vw), 12px);
  text-align: center;
  padding-top: 50px;
  padding-bottom: 15px;
}

.footer__copyright {
}

/*================================================================
# COMPONENTS（ボタン・UIパーツ）
================================================================*/
/*--------------------------------------------
  ## BTN（ボタン）
--------------------------------------------*/
.btn {
  width: 284px;
  font-size: var(--fs-sm-16);
  font-family: var(--font-ja-gothic);
  padding: 25px 44px;
  display: inline-block;
  border-radius: 50px;
  border: 2px solid var(--color-pale-gray);
  background: var(--color-white);
  color: var(--color-black);
  min-width: 150px;
  transition: background-color 0.3s, color 0.3s;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .btn {
    padding: 24px 34px;
  }
}

.btn::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  transform: translateY(-50%);
  width: 47px;
  height: 47px;
  background-color: var(--color-navy-blue);
  border-radius: 50%;
  background-image: url(../img/ui/arrow_white.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 8px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .btn::before {
    width: 30px;
    height: 30px;
    right: 20px;
  }
}

.btn:hover {
  background-color: var(--color-gray);
  opacity: 0.7;
}

.btn--type2 {
  background: #111;
  color: #fff;
}
.btn--type2:hover {
  background: #fff;
  color: #111;
}

/*--------------------------------------------
  ## PAGE TITLE（h1：共通ページタイトル）
--------------------------------------------*/
.page-headline {
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
}

.page-title {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-lg-25);
  letter-spacing: 0.3em;
  font-weight: 500;
}

.page-title__sub {
  font-size: var(--fs-xs-13);
  letter-spacing: 0.24em;
  font-weight: 500;
  margin-top: var(--space-24);
}

/*--------------------------------------------
  ## SECTION TITLE（h2~：共通セクションタイトル）
--------------------------------------------*/
.section__headline {
  width: min(100% - 4rem, var(--container-full));
  margin-inline: auto;
}

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

.section-title {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.2em;
  position: relative;
}

.section-title__sub {
  font-size: var(--fs-xs-13);
  letter-spacing: 0.24em;
  font-weight: 500;
  margin-top: 12px;
}

.section-title__number {
  display: block;
  font-family: var(--font-en-gothic);
  font-size: var(--fs-xs-13);
  font-weight: 500;
  display: inline-block;
  letter-spacing: 0.2em;
  position: relative;
}

.section-title__number span {
  font-size: var(--fs-sm-16);
}

.section-title__number::before {
  position: absolute;
  content: "";
}

.section-title__number--center {
  padding-top: 10px;
  margin-bottom: var(--space-16);
}

.section-title__number--center::before {
  background-color: var(--color-white);
  width: 80%;
  height: 1px;
  top: 0;
  left: 0;
}

.section-title__number--right {
  padding-right: 10px;
}

.section-title__number--right::before {
  background-color: var(--color-white);
  width: 1px;
  height: 100%;
  top: 50%;
  left: auto;
  right: 0;
  transform: translateY(-50%);
}

.section-title__number--center {
  padding-top: 10px;
  margin-bottom: var(--space-16);
  text-align: center;
}

/*--------------------------------------------
  ## PAGE INNER（共通ページインナー）
--------------------------------------------*/
.page-inner {
  padding: clamp(38px, calc(-5.443037974683541px + 11.139240506329113vw), 126px) 0 clamp(165px, calc(152.65822784810126px + 3.1645569620253164vw), 190px);
}

/*--------------------------------------------
  ## CONTACT-CTA HEAD（見出し共通）
--------------------------------------------*/
.contact-cta__head {
  display: flex;
  align-items: flex-start;
  gap: clamp(37px, calc(12.766990291262136px + 3.1553398058252426vw), 50px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__head {
    justify-content: center;
  }
}

.contact-cta__headline {
  position: relative;
  padding-left: 1.5em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__headline {
    text-align: center;
    padding-top: 46px;
    padding-left: 0;
  }
}

.contact-cta__headline::before {
  content: "";
  position: absolute;
  background: url(../img/common/icon_mail.webp) no-repeat center center / contain;
  top: 4px;
  left: 0;
  width: 24.6px;
  height: 24.6px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__headline::before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 30px;
  }
}

.contact-cta__labels {
  display: flex;
  gap: var(--space-16);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__labels {
    display: none;
  }
}

.contact-cta__label {
  min-width: clamp(115px, calc(108.53448275862068px + 1.7241379310344827vw), 135px);
  font-size: var(--fs-xs-13);
  font-family: var(--font-ja-gothic);
  text-align: center;
  padding: var(--space-8) var(--space-24);
  background-color: var(--color-white);
  color: var(--color-navy-blue);
  border-radius: 16.5px 16.5px 16.5px 0;
  border: 1px solid var(--color-navy-blue);
  white-space: nowrap;
}

/*--------------------------------------------
  ## CONTACT-CTA BTN（ボタン共通）
--------------------------------------------*/
.contact-cta__button,
.contact-cta__item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;
  font-size: var(--fs-sm-16);
  font-family: var(--font-ja-gothic);
  font-weight: 500;
  padding: calc(20px - 2px) clamp(20px, calc(1.5257731958762868px + 2.405498281786942vw), 34px);
  border-radius: 50px;
  border: 2px solid var(--color-pale-gray);
  background: var(--color-white);
  color: var(--color-navy-blue);
  max-width: 100%;
  min-width: 150px;
  flex-grow: 0;
  height: 80px;
  transition: background-color 0.3s, color 0.3s;
  position: relative;
}
/* * ：〜959px ----- */
@media (max-width: 959px) {
  .contact-cta__button,
  .contact-cta__item {
    font-size: 13px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__button,
  .contact-cta__item {
    font-size: clamp(14px, calc(12.230958230958231px + 0.4914004914004914vw), 16px);
    padding: calc(16px - 2px) calc(30px - 2px);
    width: min(100%, 280px);
    height: 65px;
    margin-inline: auto;
  }
}

.contact-cta__button span,
.contact-cta__item span {
  display: block;
  font-family: var(--font-en-accent);
  font-weight: 600;
  color: var(--color-bright-blue);
  font-size: var(--fs-xs-13);
  letter-spacing: 0.2em;
  line-height: 1.2;
  padding-bottom: 5px;
}

.contact-cta__button::before {
  content: "";
  position: absolute;
  background: url(../img/ui/arrow02_blue.svg) no-repeat center / contain;
  width: 8px;
  height: 10px;
  top: 50%;
  right: clamp(10px, calc(-8.474226804123713px + 2.405498281786942vw), 24px);
  transform: translateY(-50%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__button::before {
    right: 17px;
  }
}

.contact-cta__button:hover {
  background-color: #e1f1ff;
}

.contact-cta__button.phone-number,
.contact-cta__item.fax-number {
  display: block;
  font-family: var(--font-en-gothic);
}

.contact-cta__item.fax-number {
  background-color: var(--color-white);
  cursor: default;
  pointer-events: none;
}

.contact-cta__item:hover {
  background-color: var(--color-navy-blue);
  color: var(--color-white);
}

.contact-cta__button.mail {
  position: relative;
  text-align: center;
}

.contact-cta__button.mail::after {
  position: absolute;
  content: "";
  background: url(../img/common/icon_mail02-blue.svg) no-repeat center / contain;
  width: 15px;
  height: 13px;
  top: 50%;
  left: clamp(10px, calc(-16.39175257731959px + 3.436426116838488vw), 30px);
  transform: translateY(-50%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__button.mail::after {
    left: 39px;
  }
}

/*--------------------------------------------
  ## SECTION-NAV（セクションナビ）
--------------------------------------------*/
.section-nav {
  margin-top: var(--space-80);
  padding: var(--space-40);
}

.section-nav__list {
  width: min(100% - 2rem, 940px);
  margin-inline: auto;
  display: flex;
  gap: var(--space-40);
}
/* * ：〜810px ----- */
@media (max-width: 810px) {
  .section-nav__list {
    flex-direction: column;
    gap: var(--space-24);
  }
}

.section-nav__item {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-xs-13);
  letter-spacing: 0.2em;
  line-height: 1.5;
  padding-left: var(--space-32);
  position: relative;

  &::before {
    position: absolute;
    content: "▼";
    color: var(--color-bright-blue);
    width: 8px;
    height: 9px;
    top: 0;
    left: 0;
    border-radius: 1px;
  }
}

/*--------------------------------------------
  ## SECTION-STORES-LISTS（セクション店舗一覧）
--------------------------------------------*/
.section-stores__lists {
  font-family: var(--font-ja-gothic);
  padding: var(--space-120) 1.5rem 0;
}

.section-stores__inner {
  width: min(100%, 1012px);
  margin-inline: auto;
  color: var(--color-black);
  border: 1px solid #828282;
  background-color: var(--color-white);
}

.section-stores__title {
  font-size: var(--fs-md-20);
  font-weight: 500;
  letter-spacing: 0.2em;
  text-align: center;
  padding: var(--space-24) var(--space-64);
  border-bottom: 1px solid #828282;
}

.section-stores__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-64);
  padding: var(--space-64) var(--space-64);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .section-stores__list {
    grid-template-columns: 1fr;
    padding: 40px 30px;
  }
}

.section-stores__item dt {
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.2em;
  padding-left: 1.5em;
  padding-bottom: 8px;
  border-bottom: 3px dotted #828282;
  position: relative;
}

.section-stores__item dt::before {
  position: absolute;
  content: "▶︎";
  left: 0;
  color: #ea3323;
}

.section-stores__item dd {
  display: inline-flex;
  align-items: center;
  margin-top: var(--space-16);
  font-size: var(--fs-xs-13);
  letter-spacing: 0.2em;
}

.section-stores__item dd::after {
  content: "|";
  margin-left: 10px;
  color: #828282;
}

.section-stores__item dd:last-child::after {
  content: "";
}

.is-shubidai-page .section-stores__lists {
  background-color: var(--color-light-gray);
  padding-bottom: var(--space-120);
}
/*--------------------------------------------  
  ## scroll hint
--------------------------------------------*/
.scroll-hint-icon-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.scroll-hint-icon.scroll-hint-icon-white {
  width: 150px;
  padding: 40px 10px 30px;
}

.scroll-hint-icon::before {
  width: 50px;
  height: 50px;
}

.scroll-hint-icon-white::after {
  top: 20px;
}

.scroll-hint-text {
  font-size: 12px;
  font-weight: 500;
}


/*--------------------------------------------
  ## FLOATING BANNER（GTranslate対応・確定版）
--------------------------------------------*/
.floating__link {
  display: flex;
  flex-direction: column;
  gap: 5px;
  position: fixed;
  right: 0;
  bottom: 85px;
  z-index: 6;
}

/* 共通 */
.floating__link-contact,
.floating__link-language {
  width: 75px;
  display: flex;
  justify-content: center;
  align-items: center;
  writing-mode: vertical-rl;
  letter-spacing: 0.08em;
  background-color: var(--color-white);
  color: var(--color-navy-blue);
  border: 1px solid var(--color-gray);
  position: relative;
}

/* SP */
@media (max-width: 767px) {
  .floating__link-contact,
  .floating__link-language {
    width: 48px;
  }
}

/*----------------------------------
  CONTACT
----------------------------------*/
.floating__link-contact {
  padding: 17px 17px 55px;
  font-size: 15px;
  text-decoration: none;
}

.floating__link-contact::before {
  content: "";
  position: absolute;
  width: 25px;
  height: 25px;
  bottom: 21px;
  left: 50%;
  transform: translateX(-50%);
  background: url(../img/ui/icon-mail.svg) no-repeat center / contain;
}

/*--------------------------------------------
  ## FLOATING BANNER - LANGUAGE（FLAG ONLY）
--------------------------------------------*/
.floating__link-language {
  width: 75px;
  padding: 16px 10px 38px;
  writing-mode: vertical-rl;
  background-color: var(--color-white);
  border: 1px solid var(--color-gray);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .floating__link-language {
    width: 48px;
    padding: 14px 8px 32px;
  }
}

/* 矢印 */
.floating__link-language::before {
  content: "LANG";
  position: absolute;
  writing-mode: horizontal-tb;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.05em;
  pointer-events: none;
}


/* GTranslate wrapper */
.floating__link-language .gtranslate_wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  writing-mode: horizontal-tb; /* 国旗は通常向き */
}

/* テキストは非表示 */
.floating__link-language .gtranslate_wrapper span {
  display: none;
}

/* 国旗リンク */
.floating__link-language .gtranslate_wrapper a {
  display: block;
  line-height: 1;
  opacity: 0.6;
}

/* 国旗サイズ */
.floating__link-language .gtranslate_wrapper img {
  width: 26px;
  height: auto;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .floating__link-language .gtranslate_wrapper img {
    width: 20px;
  }
}

/* 日本国旗にボーダー */
.floating__link-language a[data-gt-lang="ja"] img {
  border: 1px solid rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
}

/* 現在言語 */
.floating__link-language .gtranslate_wrapper a.gt-current-lang {
  opacity: 1;
}


/*--------------------------------------------
  ## Animation（アニメーション系）
--------------------------------------------*/

/* Fade-in */
.js-fade {
  opacity: 0;
  filter: blur(10px);
  transform: translate(var(--fade-x), var(--fade-y));
  transition: opacity 1s, filter 1s, transform 1s;
}

/* Fade-in後（スクロールで追加） */
.js-scroll-in {
  opacity: 1;
  filter: blur(0);
  transform: translate(0, 0);
}

/* 表示方向（下→上にフェード） */
.js-fade.up {
  --fade-x: 0px;
  --fade-y: 50px;
}

/* 他方向も指定可能 */
.js-fade.left {
  --fade-x: -50px;
  --fade-y: 0px;
}
.js-fade.right {
  --fade-x: 50px;
  --fade-y: 0px;
}

/*--------------------------------------------  
  NEWS（ハイライト）
--------------------------------------------*/
/* ニュースリストは重ねる */
.js-ticker {
  position: relative;
}

/* すべて重ねて、初期非表示 */
.js-ticker li {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* 表示中要素 */
.js-ticker li.active {
  opacity: 1;
  transform: translateY(0);
}

/* 前の要素（フェードアウト） */
.js-ticker li.inactive {
  opacity: 0;
  transform: translateY(-10px);
}

/*--------------------------------------------  
  SECTION-NAV用 ホバーアニメーション
--------------------------------------------*/
.c-txt {
  color: #ff701e;
  display: inline-block;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.06em;
}

.c-txt.line.center::before {
  transform-origin: center top;
}

/*--------------------------------------------  
  FISH
--------------------------------------------*/
.js-fadein-bounce.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  will-change: opacity, transform;
}

/* 画像とボタンのタイミングずらし */
.business__fish-img img {
  transition-delay: 0s;
}
.business__fish-btn {
  transition-delay: 0.25s;
}
/*--------------------------------------------  
  scroll hint
--------------------------------------------*/
.scroll-hint-icon-white {
  width: 150px;
}

.scroll-hint-icon {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 40px 10px 30px;
}

.scroll-hint-icon::before {
  width: 50px;
  height: 50px;
}

.scroll-hint-icon-white::after {
  top: 20px;
}

.scroll-hint-text {
  font-size: 12px;
  font-weight: 500;
}
/*================================================================
# PAGES：TOP（tp-）
================================================================*/
/*--------------------------------------------  
    FIRST VIEW（tp-fv）
--------------------------------------------*/
.tp-firstview-video {
  width: min(100%, var(--container-wide));
  margin-inline: auto;
  aspect-ratio: 1400 / 796;
  overflow: hidden;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-firstview-video {
    aspect-ratio: 389 / 270;
  }
}

.tp-firstview-video__media {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
}

/*--------------------------------------------
    NEWS-HIGHLIGHT（tp-news-highlight）
--------------------------------------------*/
.tp-news-highlight {
  padding-top: var(--space-24);
  padding-bottom: 87px;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news-highlight {
    padding-bottom: 0;
  }
}

.tp-news-highlight__inner {
  display: flex;
  width: var(--container-wide);
  margin-inline: auto;
}

.tp-news-highlight__title {
  width: 190px;
  height: 60px;
  font-size: var(--fs-sm-16);
  font-weight: 500;
  color: var(--color-navy-blue);
  padding: 0 22px;
  line-height: 2.5;
  letter-spacing: 0.14em;
  background-color: var(--color-white);
  text-align: center;
  flex-shrink: 1;
  display: grid;
  place-items: center;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news-highlight__title {
    display: none;
  }
}

.tp-news-highlight__list {
  flex-grow: 1;
}

.tp-news-highlight__items {
  position: relative;
  height: 60px;
  overflow: hidden;
}

.tp-news-highlight__items::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-white);
  z-index: 1;
  opacity: 0.2;
  pointer-events: none;
}

.tp-news-highlight__item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: translateY(100%);
  transition: all 1s ease;
  pointer-events: none;
}

.tp-news-highlight__item.active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto; 
}

.tp-news-highlight__item.inactive {
  opacity: 1;
  transform: translateY(0);
  pointer-events: none; 
}

.tp-news-highlight__link {
  box-sizing: border-box;
  display: grid;
  place-content: center start;
  grid-auto-flow: column;
  align-items: center;
  height: 100%;
  color: #fff;
  padding: 0 var(--space-24);
  gap: var(--space-16);
}

.tp-news-highlight__date {
  font-size: var(--fs-xs-13);
  font-family: var(--font-en-gothic);
  letter-spacing: 0.07em;
  padding-top: 3px;
}

.tp-news-highlight__text {
  width: 100%;
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  letter-spacing: 0.05em;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* scroll_down pcのみ表示 */
.scroll {
  position: absolute;
  top: -50px;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;

  @media (max-width: 767px) {
    display: none;
  }
}

.scroll__inner {
  position: relative;
}

.scroll__text {
  color: var(--color-white);
  font-size: 11px;
  font-family: var(--font-ja-gothic);
  text-align: center;
  letter-spacing: 0.5em;
  margin-top: 20px;
}
.scroll__border {
  position: relative;
  top: 0;
  width: 100%;
  height: 190px;
  overflow: hidden;
}
.scroll__border::before {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 40px;
  top: 0;
  left: 0;
  right: 0;
  background: var(--color-white);
  -webkit-animation: scrollbar 2.3s ease-in-out infinite;
  animation: scrollbar 2.3s ease-in-out infinite;
  margin: auto;
}
@-webkit-keyframes scrollbar {
  0% {
    height: 0;
    top: 0;
  }
  30% {
    height: 100%;
  }
  100% {
    top: 100%;
  }
}
@keyframes scrollbar {
  0% {
    height: 0;
    top: 0;
  }
  30% {
    height: 100%;
  }
  100% {
    top: 100%;
  }
}

/*--------------------------------------------
    KEYVISUAL（tp-keyvisual）
--------------------------------------------*/
.tp-keyvisual {
  width: var(--container-wide);
  padding-top: var(--space-120);
  margin-inline: auto;
}

.tp-keyvisual__inner {
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
}

.tp-keyvisual__head {
  display: flex;
  justify-content: center;
}

.tp-keyvisual__title {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 2.18;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}

.tp-keyvisual__text {
  font-size: var(--fs-sm-16);
  line-height: 2;
  letter-spacing: 0.1em;
  max-width: min(438px - 2rem, 100%);
  margin-inline: auto;
  padding-top: var(--space-120);
}

/* KEYVISUAL-スライダー */
.tp-keyvisual__slider {
  width: min(100%, 3694px);
  margin-top: clamp(60px, calc(18.0379746835443px + 10.759493670886076vw), 145px);
}

.tp-keyvisual__slider .swiper-wrapper {
  display: flex;
  gap: var(--space-24);
  transition-timing-function: linear;
}

.tp-keyvisual__slider .swiper-slide {
  flex-shrink: 0; /* Swiperがスライドを縮めないように */
  width: 350px; /* 固定幅指定で slidesPerView: 'auto' に対応 */
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-keyvisual__slider .swiper-slide {
    width: 280px;
  }
}

.tp-keyvisual__slider .swiper-slide img {
  width: 100%; /* 親のswiper-slideにフィットさせる */
  height: auto; /* アスペクト比維持 */
  display: block; /* 不要な隙間を防止 */
}

/*--------------------------------------------
    NEWS SECTION（tp-news）
--------------------------------------------*/
.tp-news {
  padding: var(--space-120) 0;
}

.tp-news__inner {
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
  position: relative;
}

/* 見出し */
.tp-news .section__headline {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: var(--space-24);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news .section__headline {
    flex-direction: column;
  }
}

.tp-news .section-title__number {
  margin-left: -7px;
}

.tp-news .section-title {
  margin-top: -5px;
}

.tp-news .section-title__sub {
  display: block;
  font-size: 13px;
}

.tp-news__list {
  margin-top: var(--space-80);
}

.tp-news__items {
  display: flex;
  gap: clamp(25px, calc(10.781249999999998px + 3.6458333333333335vw), 60px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news__items {
    flex-direction: column;
  }
}

.tp-news__item {
  width: 33.33%;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news__item {
    width: 100%;
  }
}

.tp-news__link {
  display: block;
  width: 100%;
}
.tp-news__link:hover .tp-news__text::before {
  right: 0;
}

.tp-news__tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-12);
}

.tp-news__date {
  font-size: var(--fs-xs-13);
  font-family: var(--font-en-gothic);
  letter-spacing: 0.05em;
}

.tp-news__tag {
  font-size: 12px;
  color: #99aca8;
}

.tp-news__text {
  font-size: var(--fs-sm-16);
  font-family: var(--font-ja-gothic);
  letter-spacing: 0.05em;
  line-height: 1.4;
  margin-top: var(--space-12);
  padding-right: 10%;
  padding-bottom: var(--space-24);
  border-bottom: 1px solid var(--color-white);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;

  &::before {
    content: "";
    position: absolute;
    top: calc(50% - 28px / 2);
    right: 17px;
    transform: translateY(-50%);
    width: 17px;
    height: 10px;
    background: url(../img/ui/arrow_white.svg) no-repeat center center / contain;
    transition: right 0.3s ease;
  }
}

.tp-news__text::before {
  content: "";
  position: absolute;
  top: calc(50% - 28px / 2);
  right: 17px;
  transform: translateY(-50%);
  width: 17px;
  height: 10px;
  background: url(../img/ui/arrow_white.svg) no-repeat center center / contain;
  transition: right 0.3s ease;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news__text::before {
    right: 8px;
    top: calc(50% - 25px / 2);
  }
}

.tp-news__btn {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-news__btn {
    position: relative;
    margin: 50px auto 0;
    display: flex;
  }
}

/*--------------------------------------------
    ABOUT SECTION（tp-about）
--------------------------------------------*/
.tp-about {
  background-color: var(--color-light-gray);
  color: var(--color-black);
}

.tp-about__inner {
  width: var(--container-wide);
  margin-inline: auto;
  padding-top: var(--space-120);
  display: flex;
  flex-direction: column;
  position: relative;
}

.tp-about__lead {
  width: min(100% - 4rem, 1000px);
  margin-inline: auto;
  color: var(--color-black);
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__lead {
    flex-direction: column;
  }
}

.tp-about__lead-title {
  font-size: var(--fs-lg-25);
  line-height: 2.15;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
}

.tp-about__lead-body {
  margin-top: var(--space-48);
}

.tp-about .section-title__number {
  display: block;
  margin-left: -7px;
}

.tp-about__text {
  width: min(100%, 413px);
  margin-top: var(--space-32);
  font-size: var(--fs-xs-16);
  line-height: 2;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__text {
    width: min(100% - 4rem);
    margin-inline: auto;
  }
}

.tp-about__contents {
  position: relative;
  height: clamp(780px, calc(497.632333767927px + 36.76662320730117vw), 1062px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__contents {
    height: 767px;
  }
}

.tp-about__headline {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(71%, -1000%);
  z-index: 5;
}
/* * ：〜1100px ----- */
@media (max-width: 1100px) {
  .tp-about__headline {
    transform: translate(33%, -999%);
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__headline {
    position: static;
    top: 92px;
    left: 34px;
    transform: translate(0, 0);
  }
}

.tp-about .section-title {
  color: var(--color-navy-blue);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about .section-title {
    font-family: var(--font-ja-gothic);
    font-weight: 500;
    width: min(100% - 4rem);
    margin-inline: auto;
    margin-top: 53px;
  }
}

.tp-about__image {
  position: absolute;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__image {
    position: relative;
  }
}

.tp-about__image--01 {
  width: clamp(470px, calc(146.5788787483703px + 42.11212516297262vw), 793px);
  top: 66px;
  left: 50%;
  transform: translateX(-72.6%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__image--01 {
    position: static;
    transform: translateX(0);
    width: 93%;
    margin-inline: auto;
    margin-top: 35px;
  }
}

.tp-about__image--02 {
  width: clamp(290px, calc(119.77835723598434px + 22.164276401564535vw), 460px);
  left: 0;
  top: 65%;
  transform: translateY(-26%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__image--02 {
    width: clamp(297px, calc(198.72413793103448px + 25.198938992042443vw), 392px);
    top: 98px;
  }
}

.tp-about__image--03 {
  width: clamp(185px, calc(39.8109517601043px + 18.904823989569753vw), 330px);
  top: 195px;
  right: 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__image--03 {
    position: static;
    width: clamp(207px, calc(108.72413793103448px + 25.198938992042443vw), 302px);
    margin-top: 97px;
    margin-left: auto;
  }
}

.tp-about__image--04 {
  width: clamp(310px, calc(99.72620599739244px + 27.379400260756192vw), 520px);
  bottom: 50%;
  right: 50%;
  transform: translate(116%, 200%);

  @media (max-width: 767px) {
    width: clamp(248px, calc(149.72413793103448px + 25.198938992042443vw), 343px);
    right: 0px;
    transform: translate(6%, 19%);
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-about__image--04 {
    width: clamp(248px, calc(149.72413793103448px + 25.198938992042443vw), 343px);
    right: 0px;
    transform: translate(6%, 19%);
  }
}

.tp-about {
  width: 100%;
  position: relative;
}

.tp-about-visual-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.tp-about-mainvisual img {
  display: block;
  width: 100%;
  height: auto;
}

/*--------------------------------------------
    COMPANY-CTA（TOPページ:tp-company-cta）
--------------------------------------------*/
.tp-company-cta {
  padding-top: clamp(100px, calc(-213.1650485436893px + 40.77669902912621vw), 268px);
  padding-bottom: 112px;
  text-align: center;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta {
    padding-top: 120px;
    padding-bottom: 83px;
  }
}

.tp-company-cta__inner {
  width: min(100% - 1rem, 1480px);
  margin-inline: auto;
}

.tp-company-cta .section-title {
  font-family: var(--font-ja-mincho-default);
  font-size: var(--fs-xl-31);
  letter-spacing: 0.18em;
  margin-top: var(--space-48);
}

.tp-company-cta .section-title__sub {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  letter-spacing: 0.32em;
  margin-top: var(--space-24);
}

.tp-company-cta__slider {
  margin-top: 70px;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__slider {
    display: block;
    aspect-ratio: 365 / 432;
    margin-top: 49px;
  }
}

.tp-company-cta__slider .swiper {
  margin-left: 0;
  margin-right: 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__slider .swiper {
    margin-left: auto;
    margin-right: auto;
  }
}

/* 大きい画像（メインスライダー） */
.tp-company-cta__slider-main {
  width: min(100%, 1480px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__slider-main {
    width: min(100%, 666px);
  }
}

.tp-company-cta__slider-main .swiper-slide {
  position: relative;
}

.tp-company-cta__slider-main .swiper-slide picture img {
  transition: transform 8s ease;
  transform: scale(1.1); /* 全スライド拡大状態 */
}

.tp-company-cta__slider-main .swiper-slide.swiper-slide-active picture img {
  transform: scale(1); /* アクティブスライドだけ等倍に縮小 */
}

/* 中央のボタン */
.tp-company-cta__btn {
  width: 366px;
  height: 366px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
}
/* * ：〜959px ----- */
@media (max-width: 959px) {
  .tp-company-cta__btn {
    width: 315px;
    height: 315px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__btn {
    width: 248px;
    height: 248px;
  }
}

.tp-company-cta__btn:hover {
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.3);
}

/* 円の動き */
.tp-company-cta__circle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.tp-company-cta__progress {
  fill: none;
  stroke: var(--color-white);
  stroke-width: 0.3;
  stroke-dasharray: 313.5;
  stroke-dashoffset: 313.5;
  transform: rotate(-90deg);
  transform-origin: center;
  transition: stroke-dashoffset 3s ease;
}

.tp-company-cta__btn-num {
  display: inline-block;
  font-size: var(--fs-xs-13);
  letter-spacing: 0.08em;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--color-white);
}

.tp-company-cta__btn-title {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.3em;
  margin-top: 16px;
}

.tp-company-cta__btn-click {
  width: 83px;
  margin-inline: auto;
  margin-top: 28px;
  font-size: var(--fs-xs-13);
  padding: 5px;
  text-align: center;
  border: 1px solid var(--color-white);
  border-radius: 50px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__btn-click {
    width: 70px;
    margin-top: 24px;
  }
}

.tp-company-cta__btn-click:hover {
  background-color: var(--color-white);
  color: var(--color-black);
}

/*  サムネイル（小さな画像） */
.tp-company-cta__slider-thumb {
  width: min(100%, 533px);
  position: absolute;
  bottom: 26px;
  left: 39px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__slider-thumb {
    width: min(100%, 666px);
    position: relative;
    bottom: -15px;
    left: 0;
  }
}

.tp-company-cta__slider-thumb .swiper-wrapper {
  display: flex;
  flex-direction: row;
  gap: clamp(0px, calc(-8.515283842794759px + 2.1834061135371177vw), 25px);
}
/* * ：〜959px ----- */
@media (max-width: 959px) {
  .tp-company-cta__slider-thumb .swiper-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
  }
}

.tp-company-cta__slider-thumb .swiper-slide {
  flex-shrink: 0;
  width: 160px;
  height: auto;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-company-cta__slider-thumb .swiper-slide {
    width: 32.2%;
  }
}

.tp-company-cta__slider-thumb .swiper-slide::before {
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: background-color 0.5s;
}

.tp-company-cta__slider-thumb .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}

.tp-company-cta__slider-thumb .swiper-slide-thumb-active::before {
  background-color: transparent;
}

/*--------------------------------------------
    SHUBIDAI-CTA（TOPページ:tp-shubidai-cta
--------------------------------------------*/
.tp-shubidai-cta {
  width: var(--container-wide);
  margin-inline: auto;
  padding-top: 96px;
  padding-bottom: clamp(150px, calc(-135.20388349514565px + 37.13592233009709vw), 303px);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta {
    padding-top: 234px;
    padding-bottom: 324px;
    margin-bottom: 0;
  }
}

.tp-shubidai-cta__inner {
  max-width: 1300px;
  margin-left: auto;
}

.tp-shubidai-cta__content {
  width: min(100% - 4rem, 985px);
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__content {
    flex-direction: column;
    gap: 100px;
  }
}

.tp-shubidai-cta__headline {
  width: 23%;
  display: flex;
  gap: 49px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__headline {
    gap: 31px;
  }
}

.tp-shubidai-cta .section-title {
  font-family: var(--font-ja-mincho-default);
  font-size: var(--fs-3xl-49);
  letter-spacing: 0.18em;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
}

.tp-shubidai-cta .section-title__sub {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-xs-16);
  font-weight: 400;
  letter-spacing: 0.32em;
  margin-top: 19px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta .section-title__sub {
    margin-top: 35px;
  }
}

.tp-shubidai-cta__body {
  width: 49%;
  margin-top: 225px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__body {
    width: 100%;
    margin-top: 151px;
  }
}

.tp-shubidai-cta__copy {
  font-size: var(--fs-xl-31);
  letter-spacing: 0.16em;
  margin: 30px 0 40px;
}

.tp-shubidai-cta__number {
  margin-left: -10px;
}

.tp-shubidai-cta__text {
  font-size: var(--fs-sm-16);
  margin-top: 30px;
  letter-spacing: 0.1em;
  line-height: 2;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__text {
    letter-spacing: 0.12em;
    margin-top: 18px;
  }
}

.tp-shubidai-cta__btn {
  display: block;
  margin-top: 55px;
  width: min(100%, 402px);
  padding: calc(32px - 2px) calc(52px - 2px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__btn {
    width: min(100%, 237px);
    margin-inline: auto;
    margin-top: 31px;
    padding: calc(21px - 2px) calc(36px - 2px);
  }
}

.tp-shubidai-cta__image--01 {
  width: min(44%, 410px);
  position: absolute;
  top: 0;
  right: 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__image--01 {
    width: min(100%, 284px);
  }
}

.tp-shubidai-cta__image--02 {
  width: clamp(210px, calc(147.69230769230768px + 16.615384615384617vw), 372px);
  position: absolute;
  bottom: 48%;
  bottom: -20px;
  left: clamp(20px, calc(-234.66318537859007px + 33.15926892950392vw), 274px);
  z-index: 1;
}
/* * ：〜1160px ----- */
@media (max-width: 1160px) {
  .tp-shubidai-cta__image--02 {
    left: 35px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__image--02 {
    top: 410px;
    bottom: auto;
    left: auto;
    right: clamp(0px, calc(-20.343980343980345px + 5.651105651105651vw), 23px);
    transform: translateY(-0.3%);
  }
}

.tp-shubidai-cta__image--03 {
  width: clamp(300px, calc(189.85658409387224px + 14.341590612777052vw), 410px);
  position: absolute;
  bottom: clamp(-88px, calc(-175.09278350515464px + 11.34020618556701vw), -22px);
  right: 4rem;
  z-index: 1;

  @media (max-width: 767px) {
    left: 50%;
    transform: translateX(-50%);
    bottom: 53px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-shubidai-cta__image--03 {
    left: 50%;
    transform: translateX(-50%);
    bottom: 53px;
  }
}

/*--------------------------------------------
    CONTACT-CTA（TOPページ:tp-contact-cta）
--------------------------------------------*/
.tp-contact-cta {
  background-color: var(--color-navy-blue);
  color: var(--color-navy-blue);
}

.tp-contact-cta-content {
  padding-top: var(--space-120);
  margin-bottom: calc(-1 * var(--space-160));
}

.tp-contact-cta-inner {
  width: min(100% - 3rem, 1098px);
  margin-inline: auto;
  padding: var(--space-80) var(--space-64) var(--space-80);
  background-color: var(--color-white);
  border-top: 1px solid var(--color-navy-blue);
  border-left: 1px solid var(--color-navy-blue);
  border-right: 1px solid var(--color-navy-blue);
  position: relative;
  z-index: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-contact-cta-inner {
    padding: var(--space-80) var(--space-32);
    border-bottom: 1px solid var(--color-navy-blue);
  }
}

.tp-contact-cta .section-title {
  padding-left: 0.5em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-contact-cta .section-title {
    padding-left: 0;
  }
}

.tp-contact-cta .section-title__sub {
  padding-left: 1em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-contact-cta .section-title__sub {
    padding-left: 0;
  }
}

.tp-contact-cta__body {
  width: 100%;
  margin-top: 47px;
}

.tp-contact-cta__text {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  text-align: left;
  margin-left: var(--space-16);
  margin-top: 1em;
  letter-spacing: 0.12em;
  line-height: 2;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-contact-cta__text {
    order: 1;
    margin: 0 auto var(--space-40) auto;
  }
}

.tp-contact-cta__text span {
  color: var(--color-bright-blue);
  font-weight: inherit;
}

.tp-contact-cta__contact {
  display: flex;
  gap: 12px;
  margin-top: var(--space-40);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-contact-cta__contact {
    flex-direction: column;
  }
}
.tp-contact-cta .contact-cta__button,
.tp-contact-cta .contact-cta__item {
  width: min(100%, 315px);
}

.contact-cta__img02 {
  width: min(100% - 3rem, 1098px);
  margin-inline: auto;
  border-left: 1px solid var(--color-navy-blue);
  border-right: 1px solid var(--color-navy-blue);
  border-bottom: 1px solid var(--color-navy-blue);
  position: relative;
  z-index: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact-cta__img02 {
    display: none;
  }
}

/*--------------------------------------------
    ACCESS（TOPページ:tp-access）
--------------------------------------------*/
.tp-access {
  padding: clamp(190px, calc(5.257731958762889px + 24.054982817869416vw), 330px) 0 var(--space-160);
  background-color: var(--color-light-gray);
  color: var(--color-black);
  text-align: center;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-access {
    padding-top: 180px;
    padding-bottom: 85px;
  }
}

.tp-access__inner {
  width: var(--container);
  margin-inline: auto;
}

.tp-access .section-title {
  margin-top: var(--space-24);
}

.tp-access__map {
  width: min(100% - 4rem, 1170px);
  margin-inline: auto;
  margin-top: var(--space-48);
  overflow: hidden;
  padding-bottom: 56.25%;
  padding-bottom: calc(510 / 1170 * 100%);
  position: relative;

  @media (max-width: 767px) {
    padding-bottom: calc(220 / 323 * 100%);
  }
}

.tp-access__map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.tp-access__info {
  margin-top: var(--space-64);
}

.tp-access__company-name {
  font-size: var(--fs-md-20);
  font-family: var(--font-ja-gothic);
  letter-spacing: 0.26em;
}

.tp-access__address {
  font-size: var(--fs-sm-16);
  letter-spacing: 0.26em;
  margin-top: var(--space-40);
  line-height: 1.8;
}

.tp-access__postcode {
  font-family: var(--font-en-gothic);
}

.tp-access__street {
  font-family: var(--font-ja-gothic);
  margin-top: 11px;
  line-height: 1.4;
}

.tp-access__contact {
  margin-top: 56px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-access__contact {
    flex-direction: column;
    gap: 15px;
    margin-top: 40px;
  }
}

.tp-access__tel,
.tp-access__fax {
  width: 303px;
  font-size: var(--fs-sm-16);
  font-family: var(--font-en-gothic);
  background: var(--color-white);
  color: var(--main-color01);
  min-width: 150px;
  border-radius: 50px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-access__tel,
  .tp-access__fax {
    letter-spacing: 0.22em;
  }
}

.tp-access__tel span,
.tp-access__fax span {
  color: var(--color-bright-blue);
  padding-right: 0.5em;
}

.tp-access__tel a {
  display: flex;
  color: var(--color-navy-blue);
  padding: 27px 46px;
  border-radius: 50px;
  transition: background-color 0.3s, color 0.3s;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-access__tel a {
    padding: 27px;
  }
}

.tp-access__tel a:hover {
  background-color: #e1f1ff;
  opacity: 1;
}

.tp-access__fax {
  padding: 27px 46px;
  color: var(--color-navy-blue);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .tp-access__fax {
    padding: 27px;
  }
}

/*================================================================
# PAGES：SUB（sb-）
================================================================*/
/*--------------------------------------------
  ## PAGE FIRST VIEW（下層ページFV）
--------------------------------------------*/
.sb-fv {
  background-color: var(--color-white);
}

/*--------------------------------------------
  ## CONTACT-CTA（下層ページ：sb_contact-cta）
--------------------------------------------*/
.sb-contact-cta {
  background-color: var(--color-white);
  color: var(--color-navy-blue);
  padding-top: var(--space-80);
}

.sb-contact-cta-inner {
  width: min(100% - 3rem, 1098px);
  margin-inline: auto;
  padding: var(--space-64) var(--space-64) var(--space-48);
  background-color: var(--color-white);
  border: 1px solid var(--color-navy-blue);
  position: relative;
  z-index: 0;
  bottom: -30px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta-inner {
    padding: var(--space-80) var(--space-32) clamp(255px, calc(231.0841836734694px + 6.377551020408164vw), 280px);
    bottom: 0;
  }
}

.sb-contact-cta-inner::before {
  position: absolute;
  content: "";
  background: var(--color-navy-blue);
  width: 100%;
  height: clamp(12.5px, calc(9.453125px + 0.78125vw), 20px);
  top: 0;
  left: 0;
  z-index: -1;
}

.sb-contact-cta-inner::after {
  position: absolute;
  content: "";
  background: url(../img/common/sb_contact-cta_img.webp) no-repeat center/ contain;
  width: clamp(315px, calc(297.5431034482759px + 4.655172413793104vw), 369px);
  aspect-ratio: 369 / 508;
  bottom: 0;
  right: -40px;
  z-index: -1;
}
/* * ：〜1180px ----- */
@media (max-width: 1180px) {
  .sb-contact-cta-inner::after {
    right: -15px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta-inner::after {
    background: url(../img/common/sb_contact-cta_img-sp.webp) no-repeat center/ contain;
    top: auto;
    bottom: clamp(-101px, calc(-95.26020408163265px + -1.530612244897959vw), -107px);
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
}

.sb-contact-cta .section-title {
  padding-left: 0.5em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta .section-title {
    padding-left: 0;
  }
}

.sb-contact-cta .section-title__sub {
  padding-left: 1em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta .section-title__sub {
    padding-left: 0;
  }
}

.sb-contact-cta__body {
  width: 100%;
  margin-top: 47px;
}

.sb-contact-cta__contact {
  display: flex;
  gap: 12px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta__contact {
    flex-direction: column;
  }
}

.sb-contact-cta__col {
  width: min(100%, 315px);
  display: flex;
  flex-direction: column;
  gap: 15px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta__col {
    display: contents;
    margin-inline: auto;
  }
}

.sb-contact-cta__text {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  text-align: left;
  margin-left: var(--space-16);
  margin-top: 1em;
  letter-spacing: 0.12em;
  line-height: 1.44;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .sb-contact-cta__text {
    order: 1;
    margin: 0 auto var(--space-40) auto;
    text-align: center;
  }
}

.sb-contact-cta__text span {
  color: var(--color-bright-blue);
  font-weight: inherit;
}

/*================================================================
# PAGES：COMPANY（会社概要：company__）
================================================================*/

/* ---------------------------------------------------------------
   KEY-VISUAL
--------------------------------------------------------------- */
.company__keyvisual {
  padding: var(--space-120) 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual {
    padding-top: 125px;
  }
}

.company__keyvisual-inner {
  display: flex;
  flex-direction: column;
}

.company__keyvisual-img {
  order: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-img {
    order: 2;
    margin-top: var(--space-48);
    padding: 0 1rem;
  }
}

.company__keyvisual-body {
  display: flex;
  align-items: flex-start;
  gap: var(--space-64);
  order: 2;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-body {
    flex-direction: column;
    justify-content: center;
    order: 1;
  }
}

.company__keyvisual-headline {
  width: clamp(167px, calc(127.05208333333333px + 5.208333333333334vw), 207px);
  display: flex;
  gap: var(--space-24);
  position: relative;
  margin-top: calc(-1 * var(--space-24));
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-headline {
    width: 100%;
    margin-top: 0;
    justify-content: center;
  }
}

.company__keyvisual-title {
  font-size: var(--fs-3xl-49);
  letter-spacing: 0.18em;
  font-weight: 500;
  writing-mode: vertical-rl;
  padding-left: var(--space-32);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-title {
    padding-left: 0;
  }
}

.company__keyvisual-title__sub {
  font-family: var(--font-en-accent);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.32em;
  line-height: 1.7;
  writing-mode: rl;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-title__sub {
    color: var(--color-bright-blue);
    right: auto;
    left: 50%;
    transform: translateX(calc(50% + 15px));
  }
}

.company__keyvisual-text {
  width: min(66%, 756px);
  margin-left: auto;
  margin-top: var(--space-80);
  padding: 0 2rem;
  font-size: var(--fs-sm-16);
  letter-spacing: 0.1em;
  line-height: 2;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__keyvisual-text {
    width: 100%;
    margin-top: 0;
  }
}

/* ---------------------------------------------------------------
   GREETING
--------------------------------------------------------------- */
.company__greeting {
  width: min(100% - 4rem, 1170px);
  margin: clamp(65px, calc(12.177215189873415px + 13.544303797468354vw), 172px) auto clamp(88px, calc(-15.177215189873422px + 26.455696202531648vw), 297px);
  position: relative;
}

.company__greeting::after {
  content: "";
  position: absolute;
  background: var(--color-white);
  width: 80%;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__greeting::after {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    top: 90px;
    height: 92%;
  }
}

.company__greeting-contents {
  display: flex;
  align-items: flex-start;
  gap: var(--space-40);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__greeting-contents {
    flex-direction: column;
  }
}

.company__greeting-head {
  width: min(100%, 442px);
  margin-top: 6px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__greeting-head {
    text-align: center;
    margin-inline: auto;
  }
}

.company__greeting .section-title__number::before {
  background-color: var(--color-white);
}

.company__greeting-img {
  margin-top: var(--space-64);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__greeting-img {
    margin-top: 80px;
  }
}

.company__greeting-body {
  width: min(100%, 640px);
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  gap: var(--space-80);
  padding: var(--space-80) 1.5rem var(--space-80) 0;
  margin-inline: auto;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__greeting-body {
    padding: 0 0 var(--space-120) 0;
  }
}

.company__greeting-copy {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.7;
}

.company__greeting-text {
  font-size: var(--fs-sm-16);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.9;
  position: relative;
}

.company__greeting-text::before {
  position: absolute;
  content: "";
  background: var(--color-navy-blue);
  width: 40px;
  height: 1px;
  top: clamp(-30px, calc(-10.026041666666664px + -2.604166666666667vw), -50px);
  left: 0;
}

.company__greeting-sign {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-md-20);
  font-weight: 500;
  letter-spacing: 0.15em;
  text-align: right;
}

.company__greeting-sign span {
  display: inline-block;
  font-size: var(--fs-sm-16);
  font-weight: 500;
  padding-right: var(--space-32);
}

/* ---------------------------------------------------------------
   OVERVIEW
--------------------------------------------------------------- */
.company__overview {
  position: relative;
  padding: var(--space-120) 0;
  margin-bottom: var(--space-120);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__overview {
    margin-bottom: 0;
  }
}

.company__overview::before {
  position: absolute;
  content: "";
  background-color: #f0f0f0;
  width: 96%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}

.company__overview-inner {
  width: min(100% - 4rem, 1170px);
  margin-inline: auto;
}

.company__overview .section__headline {
  color: var(--color-navy-blue);
}

.company__overview .section-title__number::before {
  background-color: var(--color-navy-blue);
}

.company__overview-list {
  width: min(100%, 76vw);
  max-width: none;
  margin-left: auto;
  margin-top: var(--space-80);
  display: grid;
  grid-template-columns: 1fr;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__overview-list {
    width: 100%;
    margin-top: var(--space-80);
  }
}

.company__overview-item {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  padding-bottom: var(--space-40);
  border-bottom: 1px solid var(--color-navy-blue);
  display: flex;
  align-items: flex-start;
  gap: var(--space-80);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__overview-item {
    gap: var(--space-16);
  }
}

.company__overview-item + .company__overview-item {
  margin-top: var(--space-40);
}

.company__overview-item dt,
.company__overview-item dd {
  color: var(--color-black);
  font-weight: 500;
  line-height: 2em;
}

.company__overview-item dt {
  width: 210px;
  padding-left: 1.5em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .company__overview-item dt {
    padding-left: 0;
  }
}

.company__overview-item dd {
  flex-grow: 1;
  margin: 0;
}

@media (max-width: 767px) {
  .company__overview-list {
    grid-template-columns: 1fr;
  }

  .company__overview-item dt {
    width: 100px;
  }
}

/* SB-CONTACT-CTA */
.company .sb-contact-cta {
  background-color: #193575;
  margin-bottom: -200px;
}

/*================================================================
# PAGES：BUSINESS（事業内容：business__）
================================================================*/
.business .section-inner {
  padding-bottom: 0;
}

/* SB-CONTACT-CTA */
.business .sb-contact-cta {
  padding-bottom: var(--space-160);
}

/* ---------------------------------------------------------------
   SECTION-NAV
--------------------------------------------------------------- */
.business .section-nav {
  background-color: var(--color-steel-blue);
}
/* ---------------------------------------------------------------
   01：FEATURE（環境と特徴）
--------------------------------------------------------------- */
.business__feature {
  margin-top: var(--space-160);
}

.business__feature-body {
  background: url(../img/business/bg_business-feature.webp) no-repeat top center / cover;
  padding: clamp(290px, calc(260.9051724137931px + 7.758620689655173vw), 380px) 0 var(--space-160);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-body {
    background: url(../img/business/bg_business-feature-sp.webp) no-repeat top center / cover;
    margin-top: 40px;
  }
}

.business__feature-card-list {
  width: min(100% - 2rem, 1010px);
  margin-inline: auto;
  display: flex;
  background-color: var(--color-white);
  border-radius: 15px;
  padding: var(--space-48) var(--space-64);
  gap: var(--space-80);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-card-list {
    flex-direction: column;
    padding: var(--space-48) 2rem;
    gap: 60px;
  }
}

.business__feature-card-list::before {
  position: absolute;
  content: "";
  background: var(--color-navy-blue);
  width: 1px;
  height: 87%;
  top: var(--space50);
  left: 50%;
  transform: translateX(-50%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-card-list::before {
    position: static;
  }
}

.business__feature-card-list::after {
  position: absolute;
  content: "";
  background: url(../img/business/icon_business-feature.webp) no-repeat center/ contain;
  width: clamp(232px, calc(211.6875px + 5.208333333333334vw), 282px);
  height: clamp(232px, calc(211.6875px + 5.208333333333334vw), 282px);
  top: -200px;
  right: -5%;
}
/* * ：〜1180px ----- */
@media (max-width: 1180px) {
  .business__feature-card-list::after {
    right: -1%;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-card-list::after {
    top: -175px;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
}

.business__feature-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  flex: 1;
  color: var(--color-navy-blue);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-card {
    padding-bottom: 30px;
    border-bottom: 1px solid var(--color-navy-blue);
  }
}

.business__feature-card:last-child {
  /* * SP：〜767px ----- */
  @media (max-width: 767px) {
    margin-bottom: 30px;
  }
}

.business__feature-card-title {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.7;
  padding-top: var(--space-48);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__feature-card-title {
    padding-top: 0;
  }
}

.business__feature-card-text {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 2;
}

.business__feature-card-img {
  margin-top: auto;
}

/* ---------------------------------------------------------------
   02：FISH（生産している魚）
--------------------------------------------------------------- */
.business__fish {
  padding: var(--space-120) 0;
  overflow: hidden;
}

/* 見出し */
.business__fish-head {
  width: var(--container-wide);
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-40) var(--space-40) var(--space-40) 0;
  border: 1px solid var(--color-white);
  border-left: none;
  position: relative;
}
/* * ：〜1630px ----- */
@media (max-width: 1630px) {
  .business__fish-head {
    width: 95%;
    margin: 0 auto 0 0;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-head {
    width: 90%;
    flex-direction: column;
    padding: var(--space-80) var(--space-40);
    margin-right: 2rem;
    border-right: 1px solid var(--color-white);
  }
}

.business__fish .section__headline {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-grow: 1;
  padding-left: clamp(20px, calc(-160.23468057366364px + 23.46805736636245vw), 200px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish .section__headline {
    min-width: 100%;
    padding-left: 0;
  }
}

.business__fish-lead {
  font-family: var(--font-ja-gothic);
  font-size: clamp(13px, calc(12.030172413793103px + 0.25862068965517243vw), 16px);
  line-height: 2;
  width: min(42%, 590px);
  padding-left: var(--space-32);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-lead {
    margin-top: var(--space-80);
    width: 100%;
    padding-left: 0;
  }
}

.business__fish-lead::before {
  position: absolute;
  content: "";
  background: var(--color-white);
  width: 1px;
  height: 120%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-lead::before {
    width: 94px;
    height: 1px;
    top: -20px;
    left: 0;
    transform: translateY(0);
  }
}

/* 魚リスト */
.business__fish-lists {
  width: min(100% - 4rem, 1222px);
  margin: clamp(100px, calc(88.15189873417722px + 3.0379746835443036vw), 124px) auto clamp(188px, calc(147.51898734177215px + 10.379746835443038vw), 270px);
  margin: var(--space-120) auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-120);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-lists {
    width: 100%;
    gap: 120px;
  }
}

.business__fish-item {
  display: flex;
  align-items: center;
  padding-right: clamp(1rem, calc(-4.278350515463917rem + 10.996563573883162vw), 5rem);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-item {
    flex-direction: column;
    padding-right: 0;
  }
}

/* マダイ イメージ */
.business__fish-img--madai {
  width: min(44.5%, 386px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-img--madai {
    width: min(90%, 386px);
  }
}

/* シマアジ イメージ */
.business__fish-img--shimaaji {
  width: min(60%, 591px);
  margin-left: -65px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-img--shimaaji {
    width: 473px;
    margin: 0;
  }
}

/* カンパチ イメージ */
.business__fish-img--kanpachi {
  width: min(40%, 418px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-img--kanpachi {
    width: min(90%, 418px);
  }
}

/* 秀美鯛とはボタン */
.business__fish-btn a {
  display: block;
  font-size: 17px;
  width: min(100%, 325px);
  margin-inline: auto;
  margin-top: -65px;
  border: 2px solid var(--color-orange);
  background: var(--color-cream-orange);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-btn {
    order: 4;
  }

  .business__fish-btn a {
    margin-top: 0;
    padding: calc(26px - 2px) calc(36px - 2px);
  }
}

.business__fish-btn a::before {
  background-color: var(--color-orange);
}

.business__fish-body {
  font-family: var(--font-ja-gothic);
  width: 63%;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-body {
    width: 100%;
    margin-top: 42px;
    display: flex;
    flex-direction: column;
  }
}

.business__fish-desc {
  font-size: 15.5px;
  letter-spacing: 0.1em;
  line-height: 1.7;
  margin-top: 30px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-desc {
    margin-bottom: 30px;
    order: 3;
  }
}

/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-name {
    width: 90%;
    margin-inline: auto;
    order: 1;
  }
}

.business__fish-data {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  padding-left: 2.5em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-data {
    order: 2;
  }
}

.business__fish-desc--madai,
.business__fish-data--madai {
  padding-left: clamp(30px, calc(16.804123711340203px + 1.718213058419244vw), 40px);
}

.business__fish-desc--shimaaji,
.business__fish-data--shimaaji {
  padding-left: clamp(20px, calc(6.804123711340205px + 1.718213058419244vw), 30px);
}

.business__fish-desc--kanpachi,
.business__fish-data--kanpachi {
  padding-left: clamp(40px, calc(13.60824742268041px + 3.436426116838488vw), 60px);
}

/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__fish-desc--madai,
  .business__fish-data--madai,
  .business__fish-desc--shimaaji,
  .business__fish-data--shimaaji,
  .business__fish-desc--kanpachi,
  .business__fish-data--kanpachi {
    width: 90%;
    margin-inline: auto;
    padding-left: 0;
  }
}

.business__fish-data-row {
  display: flex;
  align-items: center;
  gap: var(--space-16);
}

.business__fish-data-term {
  font-family: var(--font-ja-gothic);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-navy-blue);
  background-color: var(--color-white);
  padding: 0.5em 2em;
  border-radius: 50px;
}

.business__fish-data-desc {
  font-family: var(--font-en-gothic);
  font-size: 16px;
  letter-spacing: 0.1em;
}

/* ---------------------------------------------------------------
   03：STORES（取り扱い店舗一覧）
--------------------------------------------------------------- */
.business__stores {
  background-color: var(--color-light-gray);
  padding: var(--space-120) 1.5rem var(--space-160);
}

.business__stores .section__headline {
  text-align: center;
  color: var(--color-navy-blue);
}

.business__stores .section-title__number--center::before {
  background-color: var(--color-navy-blue);
}

/* ---------------------------------------------------------------
   04：Q&A（よくある質問）
--------------------------------------------------------------- */
.business__faq {
  background-color: var(--color-white);
  padding: clamp(66px, calc(28.481012658227847px + 9.620253164556962vw), 142px) 0 clamp(98px, calc(71.83544303797468px + 6.70886075949367vw), 151px);
  padding: var(--space-160) 0;
}

.business__faq .section__headline {
  text-align: center;
  color: var(--color-navy-blue);
}

.business__faq .section-title__number--center::before {
  background-color: var(--color-navy-blue);
}

.business__faq-inner {
  width: min(100% - 4rem, 825px);
  margin-inline: auto;
  padding-top: var(--space-80);
}

.business__faq-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-32);
}

.faqAccordion__item {
  font-family: var(--font-ja-gothic);
  background-color: #d2e1f8;
  border-radius: 10px;
  padding: 0 var(--space-24);
  overflow: hidden;
}

.faqAccordion__header {
  font-size: var(--fs-md-20);
  font-weight: 500;
  color: var(--color-navy-blue);
  letter-spacing: 0.15em;
  padding: 2rem 3.5rem 2rem 3.8rem;
  line-height: 1.3;
  cursor: pointer;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .faqAccordion__header {
    padding: 1.5rem 2.5rem 1.5rem 3.5rem;
  }
}

.faqAccordion__header::before {
  content: "";
  position: absolute;
  background: url(../img/business/icon_faq-Q.svg) no-repeat center / contain;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: clamp(35px, calc(32px + 0.7vw), 42px);
  height: clamp(35px, calc(32px + 0.7vw), 42px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .faqAccordion__header::before {
    left: 7px;
  }
}

.faqAccordion__header::after {
  content: "+";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-lg-25);
  font-weight: 600;
  color: var(--color-navy-blue);
  transition: transform 0.3s, content 0.3s;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .faqAccordion__header::after {
    right: 0.5rem;
  }
}

.faqAccordion__header.is-active::after {
  content: "×";
  transform: translateY(-50%) rotate(90deg);
}

.faqAccordion__content {
  background-color: var(--color-white);
  border-radius: 15px;
  overflow: hidden;
  margin-bottom: 0;
}

.faqAccordion__header.is-active + .faqAccordion__content {
  margin-bottom: 2rem;
}

.faqAccordion__contentInner {
  color: var(--color-navy-blue);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.5;
  padding: var(--space-32) var(--space-32) var(--space-32) 3.2rem;
  position: relative;

  @media (max-width: 767px) {
    padding: 3rem 1.2rem 1.5rem;
  }
}

.faqAccordion__contentInner::before {
  content: "";
  position: absolute;
  background: url(../img/business/icon_faq-A.svg) no-repeat center / contain;
  width: clamp(18px, calc(15.5625px + 0.625vw), 24px);
  height: clamp(12px, calc(9.5625px + 0.625vw), 18px);
  left: 0.9rem;
  top: clamp( 26px, calc( 7.525773195876287px + 2.405498281786942vw ), 40px );
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .faqAccordion__contentInner::before {
    top: 1.5rem;
    left: 1.2rem;
  }
}

.faqAccordion__item:has(.faqAccordion__header.is-active) {
  background-color: #dbe9fb;
}

/* ---------------------------------------------------------------
   05：FLOW（購入の流れ）
--------------------------------------------------------------- */
.business__flow {
  background-color: var(--color-white);
  padding: var(--space-120) 0;
  border-top: 1px solid var(--color-navy-blue);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__flow {
    padding-bottom: 0;
  }
}

.business__flow .section__headline {
  text-align: center;
  color: var(--color-navy-blue);
}

.business__flow .section-title__number--center::before {
  background-color: var(--color-navy-blue);
}

.business__flow-inner {
  width: min(100%, 1340px);
  margin-inline: auto;
}

.business__flow-steps {
  width: min(100% - 4rem, 1400px);
  margin-inline: auto;
  padding-top: var(--space-64);
  display: flex;
  flex-wrap: nowrap;
  list-style: none;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__flow-steps {
    flex-direction: column;
    width: 55%;
    margin-inline: auto;
    padding: 65px 0;
  }
}

.business__flow-item + .business__flow-item {
  margin-left: -27px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .business__flow-item + .business__flow-item {
    margin-left: 0;
    margin-top: -60px;
  }
}
/* * ：〜500px ----- */
@media (max-width: 767px) {
  .business__flow-item + .business__flow-item {
    margin-top: -30px;
  }
}

/*================================================================
# PAGES：SHUBIDAI（事業内容：shubidai__）
================================================================*/
.shubidai .page-inner {
}

/* ページタイトル */
.shubidai .page-title {
  color: var(--color-red-accent);
}

/* ---------------------------------------------------------------
   SECTION-NAV
--------------------------------------------------------------- */
.shubidai .section-nav {
  background-color: var(--color-cream-pink);
}

/* ---------------------------------------------------------------
   HERO
--------------------------------------------------------------- */
.shubidai__hero {
  width: var(--container-wide);
  margin-inline: auto;
  padding: var(--space-120) 0;
  position: relative;
}

/* HERO-TOP */
.shubidai__hero-top {
  display: flex;
  gap: var(--space-120);
}
/* * ：〜959px ----- */
@media (max-width: 959px) {
  .shubidai__hero-top {
    align-items: center;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-top {
    flex-direction: column;
  }
}

.shubidai__hero-img {
  width: min(51%, 690px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-img {
    width: 75%;
    order: 2;
  }
}

.shubidai__hero-content {
  display: flex;
  flex-direction: column;
  width: min(56%, 765px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-content {
    width: 100%;
    order: 1;
  }
}

.shubidai__hero-headline {
  writing-mode: vertical-rl;
  margin-right: clamp(54px, calc(-170.3298969072165px + 29.20962199312715vw), 224px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-headline {
    margin: 0 auto;
  }
}

.shubidai__hero-title {
  display: inline-block;
  font-size: var(--fs-2xl-39);
  font-weight: 500;
  letter-spacing: 0.18em;
  color: var(--color-red-accent);
}

.shubidai__hero-title span {
  color: var(--color-black);
}

.shubidai__hero__copy {
  font-size: clamp(24px, calc(21.307692307692307px + 0.717948717948718vw), 31px);
  line-height: 1.4;
  margin-top: clamp(100px, calc(80.76923076923077px + 5.128205128205128vw), 150px);
  letter-spacing: 0.16em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero__copy {
    padding: 0 2rem;
    line-height: 1.6;
  }
}

.shubidai__hero-text {
  font-size: var(--fs-sm-16);
  letter-spacing: 0.1em;
  line-height: 2;
  margin-right: clamp(54px, calc(-170.3298969072165px + 29.20962199312715vw), 224px);
  margin-top: 40px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-text {
    width: 100%;
    padding: 0 2rem;
  }
}

/* HERO-MIDDLE */
.shubidai__hero-middle {
  position: relative;
}

.shubidai__hero-image--sub01 {
  width: clamp(311px, calc(126.25773195876289px + 24.054982817869416vw), 451px);
  margin-left: auto;
  margin-top: -105px;
  margin: 0 2rem 0 auto;
}
/* * ：〜1400px ----- */
@media (max-width: 1400px) {
  .shubidai__hero-image--sub01 {
    margin-top: 40px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-image--sub01 {
    width: 90%;
    margin-inline: auto;
  }
}

.shubidai__hero-image--sub02 {
  width: clamp(443px, calc(297.8453608247423px + 18.900343642611684vw), 553px);
  margin-left: clamp(40px, calc(-39.175257731958766px + 10.309278350515463vw), 100px);
}
/* * ：〜1400px ----- */
@media (max-width: 1400px) {
  .shubidai__hero-image--sub02 {
    margin-top: 85px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-image--sub02 {
    width: clamp(218px, calc(-14.758620689655174px + 59.6816976127321vw), 443px);
  }
}

/* HERO-BOTTOM */
.shubidai__hero-bottom {
  display: flex;
  flex-direction: column;
}

.shubidai__hero-bottom-column {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  gap: var(--space-64);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-bottom-column {
    display: contents;
  }
}

.shubidai__hero-bottom-column .shubidai__hero-text {
  width: min(40%, 423px);
  margin-right: 0;
  padding-bottom: 2em;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-bottom-column .shubidai__hero-text {
    width: 100%;
    margin-top: 40px;
    order: 3;
  }
}

.shubidai__hero-image--sub03 {
  width: clamp(375px, calc(58.29896907216494px + 41.23711340206185vw), 615px);
  margin-top: -161px;
  margin-right: 2rem;
}
/* * ：〜1250px ----- */
@media (max-width: 1250px) {
  .shubidai__hero-image--sub03 {
    margin-top: 80px;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-image--sub03 {
    width: clamp(263px, calc(147.13793103448276px + 29.708222811671085vw), 375px);
    margin: 60px 2rem 0 auto;
    order: 1;
  }
}

.shubidai__hero-image--sub04 {
  width: 300px;
  margin-right: 355px;
  margin-left: auto;
  margin-top: 112px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__hero-image--sub04 {
    width: clamp(231px, calc(159.6206896551724px + 18.30238726790451vw), 300px);
    margin: 40px auto 0 2.5rem;
    order: 2;
  }
}

/* ---------------------------------------------------------------
   FEATURES
--------------------------------------------------------------- */
.shubidai__features {
  width: min(100% - 4rem, 1250px);
  margin-inline: auto;
  padding: var(--space-80) 0;
  position: relative;
}

/* 見出し */
.shubidai__features .section__headline {
  color: var(--color-red-accent);
}

.shubidai__features .section-title__number--center::before {
  background-color: var(--color-red-accent);
}

.shubidai__features-content {
  font-family: var(--font-ja-gothic);
  color: var(--color-dark-blue);
  padding: 70px 0;
}

.shubidai__features-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-48);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__features-list {
    display: flex;
    flex-direction: column;
    gap: 92px;
  }
}

.shubidai__features-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-64);
}

.shubidai__features-img {
  width: 100%;
  aspect-ratio: 374 / 467;
  display: flex;
  align-items: center;
  justify-content: center;
}

.shubidai__features-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shubidai__features-subtitle {
  font-size: var(--fs-xl-31);
  letter-spacing: 0.3em;
  text-align: center;
  position: relative;
}

.shubidai__features-subtitle::before {
  position: absolute;
  content: "";
  background: var(--color-navy-blue);
  width: 40px;
  height: 1.5px;
  bottom: -24px;
  left: 50%;
  transform: translateX(-55%);
}

.shubidai__features-subtitle,
.shubidai__features-text {
  font-weight: 500;
  color: var(--color-navy-blue);
}

.shubidai__features-text {
  font-size: 16px;
  letter-spacing: 0.08em;
  line-height: 2;
  padding: 0 1.5rem;
}

/* ---------------------------------------------------------------
   PRODUCTION
--------------------------------------------------------------- */
.shubidai__production {
  background-color: var(--color-soft-blue);
  padding: var(--space-160) 0;
  color: var(--color-white);
}

.shubidai__production .section__headline {
  width: 100%;
}

.shubidai__production-inner {
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(0px, calc(-40.05215123859192px + 5.215123859191656vw), 40px);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__production-inner {
    display: block;
  }
}

/* フローイメージ */
.shubidai__production-flow {
  flex: 0 0 auto;
  width: 100%;
  max-width: 300px;
  min-width: 240px;
  padding-right: 2rem;
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__production-flow {
    position: static;
    height: auto;
    max-width: 100%;
    min-width: 100%;
    padding-right: 0;
    margin-bottom: 2rem;
  }
}

.shubidai__production-headline {
  /* * SP：〜767px ----- */
  @media (max-width: 767px) {
    margin-bottom: 2rem;
  }
}

.shubidai__production-flow-visual {
  margin-top: var(--space-80);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__production-flow-visual {
    display: none;
  }
}

.shubidai__production-flow-visual img {
  width: auto;
  height: 775px;
  transition: opacity 0.6s ease;
}

.shubidai__production-body {
  background-color: var(--color-white);
  padding: var(--space-80) var(--space-48);
  font-family: var(--font-ja-gothic);
  flex: 1 1 auto;
  min-width: 0;
  max-width: 723px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__production-body {
    max-width: 100%;
    width: 100%;
    padding: var(--space-48) var(--space-32);
  }
}

.shubidai__production-step + .shubidai__production-step {
  margin-top: var(--space-120);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__production-step + .shubidai__production-step {
    margin-top: 70px;
  }
}

.shubidai__production-step-label {
  /* margin-top: clamp( 15px, calc( 6.484716157205241px + 2.1834061135371177vw ), 40px ); */
  margin-top: var(--space-40);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--color-navy-blue);
  display: flex;
  align-items: center;
  gap: 15px;
}

.shubidai__production-step-number {
  display: inline-block;
  font-size: var(--fs-sm-16);
  color: var(--color-white);
  letter-spacing: 0.12em;
  letter-spacing: 0.1em;
  width: 2em;
  height: 2em;
  line-height: 2em;
  text-align: center;
  background-color: var(--color-navy-blue);
  border-radius: 50%;
}

.shubidai__production-step-title {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  letter-spacing: 0.2em;
  color: var(--color-navy-blue);
}

.shubidai__production-text {
  margin-top: clamp(15px, calc(9.890829694323145px + 1.3100436681222707vw), 30px);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: var(--color-navy-blue);
}

.shubidai__production-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* ---------------------------------------------------------------
   USER-VOICE
--------------------------------------------------------------- */
.shubidai__user-voice {
  background-color: var(--color-navy-blue);
  overflow-y: hidden;
  color: var(--color-white);
}

.shubidai__user-voice-wrap {
  font-family: var(--font-ja-gothic);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: var(--container-full);
  margin-inline: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
}

.shubidai__user-voice-slider {
  display: flex;
}

.shubidai__user-voice-contents {
  display: flex;
  gap: clamp(40px, calc(-0.05215123859191806px + 5.215123859191656vw), 80px);
  flex: 0 0 100%;
  max-width: 1535px;
  scroll-snap-align: start;
}
/* * ：〜1534px ----- */
@media (max-width: 1534px) {
  .shubidai__user-voice-contents {
    flex: 0 0 100vw;
    max-width: 100vw;
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-contents {
    flex-direction: column;
    padding: 65px 0 100px;
  }
}

.shubidai__user-voice-img {
  width: min(50%, 767px);
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-img {
    width: 100%;
    height: auto;
    order: 2;
  }
}
.shubidai__user-voice-img::before {
  position: absolute;
  content: "";
  background: url(../img/shubidai/shubidai_uservoice-text.webp) no-repeat center / contain;
  width: min(100%, 744px);
  aspect-ratio: 744 / 116;
  bottom: 0;
  left: 0;
}

.shubidai__user-voice-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shubidai__user-voice-body {
  font-family: var(--font-ja-gothic);
  width: min(50%, 628px);
  padding: var(--space-80) 2rem var(--space-80) 0;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-body {
    display: contents;
  }
}

.shubidai__user-voice .section__headline {
  width: 100%;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice .section__headline {
    margin: 0 2rem;
    order: 1;
  }
}

.shubidai__user-voice-number {
  color: var(--color-soft-blue);
}

.shubidai__user-voice-number::before {
  background-color: var(--color-soft-blue);
}

.shubidai__user-voice-title {
  color: var(--color-soft-blue);
}

.shubidai__user-voice-lead {
  font-size: var(--fs-md-20);
  line-height: 1.6;
  color: var(--color-white);
  font-feature-settings: "palt";
  margin-top: var(--space-64);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-lead {
    margin: 0 2rem;
    order: 3;
  }
}

.shubidai__user-voice-text {
  font-size: var(--fs-sm-16);
  letter-spacing: 0.1em;
  line-height: 2;
  color: var(--color-white);
  margin-top: var(--space-32);
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-text {
    margin: 0 2rem;
    order: 5;
  }
}

.shubidai__user-voice-text + .shubidai__user-voice-text {
  margin-top: 24px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-text + .shubidai__user-voice-text {
    margin-top: -10px;
  }
}

.shubidai__user-voice-text.long {
  line-height: 1.6;
}

.shubidai__user-voice-name {
  font-size: var(--fs-md-20);
  letter-spacing: 0.1em;
  line-height: 1.6;
  color: var(--color-white);
  margin-top: var(--space-32);
  padding-top: var(--space-24);
  border-top: 2px dotted var(--color-white);
  text-align: right;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .shubidai__user-voice-name {
    margin: 0 2rem;
    order: 4;
  }
}

/* ---------------------------------------------------------------
   SECTION-STORES
--------------------------------------------------------------- */
.shubidai__stores {
  background-color: var(--color-light-gray);
  padding-bottom: var(--space-120);
}

/* ---------------------------------------------------------------
   SB-CONTACT-CTA
--------------------------------------------------------------- */
.shubidai .sb-contact-cta {
  background-color: var(--color-light-gray);
  margin-bottom: -200px;
}

/*================================================================
# PAGES：NEWS-ARCHIVE（お知らせ一覧：news-archive__）
================================================================*/
.news-archive {
  background-color: var(--color-light-gray);
}

/* 見出し */
.news-archive .page-headline {
  color: var(--color-navy-blue);
}

.news-archive__contents {
  padding-top: var(--space-80);
  display: flex;
  flex-direction: column;
  gap: var(--space-120);
}

/* ニュースラベル */
.news-archive__labels {
  width: min(100% - 1rem, 950px);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-16);
}
/* *----SP：767px以下----  */
@media (max-width: 767px) {
  .news-archive__labels {
    justify-content: center;
    gap: clamp(7px, calc(3.5384615384615383px + 0.9230769230769231vw), 16px);
  }
}

.news-archive__label {
  min-width: clamp(115px, calc(108.53448275862068px + 1.7241379310344827vw), 135px);
  font-size: var(--fs-xs-13);
  font-family: var(--font-ja-gothic);
  font-weight: 500;
  text-align: center;
  padding: var(--space-8) var(--space-24);
  color: var(--color-navy-blue);
  border-radius: 16.5px 16.5px 16.5px 0;
  border: 1px solid var(--color-navy-blue);
  white-space: nowrap;
}

@media (max-width: 767px) {
  .news-archive__label {
    padding: var(--space-12);
  }
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
}

.news-archive__label.active {
  background-color: var(--color-white);
  border: 1px solid var(--color-white);
}

/* ニュースリスト */
.news-archive__lists {
  width: min(100% - 4rem, 959px);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  color: var(--color-black);
}

.news-archive__list + .news-archive__list {
  padding-top: var(--space-40);
}

.news-archive__list a {
  display: flex;
  gap: var(--space-24);
  padding: 0 var(--space-24) var(--space-40) var(--space-12);
  border-bottom: 1px solid #828282;
  position: relative;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .news-archive__list a {
    flex-direction: column;
  }
}

.news-archive__list a::before {
  content: "";
  position: absolute;
  top: calc(50% - 28px / 2);
  right: 17px;
  transform: translateY(-50%);
  width: 17px;
  height: 10px;
  background: url(../img/ui/arrow_blue.svg) no-repeat center center / contain;
  transition: right 0.3s ease;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .news-archive__list a::before {
    right: 8px;
  }
}

.news-archive__list a:hover::before {
  right: 0;
}

.news-archive__tags {
  display: flex;
  align-items: center;
  gap: 1em;
  width: 190px;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .news-archive__tags {
    width: 100%;
  }
}

.news-archive__date {
  font-family: var(--font-en-gothic);
  font-size: var(--fs-xs-13);
  font-weight: 500;
  letter-spacing: 0.07em;
}

.news-archive__tag {
  font-size: 11px;
  font-weight: 500;
  color: var(--color-bright-blue);
}

.news-archive__text {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.05em;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ページネーション（Ajax用） */
/* 全体レイアウト */
#news-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-16);
}

/* 前後ボタン */
#news-pagination .page-prev,
#news-pagination .page-next {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 600;
  color: var(--color-navy-blue);
  border: 1px solid var(--color-navy-blue);
  background: transparent;
  border-radius: 4px;
  cursor: pointer;
  transition: 0.2s ease;
}

#news-pagination .page-prev:disabled,
#news-pagination .page-next:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* 数字の部分 */
#news-page-numbers {
  display: flex;
  align-items: center;
  gap: var(--space-16);
}

/* 数字ボタン */
#news-page-numbers button {
  width: 24px;
  height: 29px;
  display: grid;
  place-items: center;
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 600;
  color: var(--color-navy-blue);
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  transition: 0.2s ease;
}

/* ホバー */
#news-page-numbers button:hover {
  background-color: var(--color-white);
  color: var(--color-black);
  border-color: var(--color-white);
}

/* 選択中 */
#news-page-numbers button.active {
  background-color: var(--color-white);
  color: var(--color-black);
  border-color: var(--color-white);
}


/*================================================================
# PAGES：NEWS-SINGLE（お知らせ個別：news-single__）
================================================================*/
.news-single {
  background-color: var(--color-gray);
}

/* 見出し */
.news-single .page-headline {
  color: var(--color-navy-blue);
}

.news-single__contents {
  width: min(100% - 4rem, 950px);
  margin-inline: auto;
  padding-top: var(--space-64);
  display: flex;
  flex-direction: column;
  gap: var(--space-120);
}

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

/* 記事タイトル */
.article__headline {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-bottom: var(--space-16);
  border-bottom: 1px solid var(--color-black);
}

.article__tag {
  display: inline-block;
  font-size: 10px;
  color: var(--color-bright-blue);
  padding: 0.5em 2em;
  border: 1px solid var(--color-bright-blue);
}

.article__date {
  font-family: var(--font-en-gothic);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.07em;
  margin-top: var(--space-16);
}

.article__title {
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-md-20);
  font-weight: 500;
  letter-spacing: 0.05em;
  margin-top: 1em;
}

/* 記事内容 */
.article__body {
  margin-top: var(--space-64);
}

.article__img {
  width: min(85%, 470px);
  margin: var(--space-64) auto;
}

.article__text {
  width: min(100%, 623px);
  margin-inline: auto;
  font-family: var(--font-ja-gothic);
  font-size: var(--fs-sm-16);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 2;
}

.article__btn {
  display: block;
  margin: clamp(70px, calc(5.822784810126592px + 16.455696202531644vw), 200px) auto 0;
}

/*================================================================
# PAGES：CONTACT（お問い合わせ：contact__）
================================================================*/
.contact {
  background-color: var(--color-light-gray);
}

/* 見出し */
.contact .page-headline {
  color: var(--color-navy-blue);
}

/*----------------------------------------------------------------
  FORM：レイアウト
----------------------------------------------------------------*/
.contact_form {
  margin-top: clamp(85px, calc(20.822784810126592px + 16.455696202531644vw), 215px);
  font-family: var(--font-ja-gothic);
  color: var(--color-black);
  text-align: center;
  width: min(100% - 4rem, var(--container));
  margin-inline: auto;
}

.contact_field {
  display: flex;
  flex-direction: column;
  gap: var(--space-32);
}

.contact_field + .contact_field {
  margin-top: var(--space-48);
}

.form-field {
  display: flex;
  gap: var(--space-32);
}

@media (max-width: 767px) {
  .form-field {
    flex-direction: column;
    gap: 10px;
  }

  .contact_field:first-of-type .form-field {
    gap: var(--space-40);
  }

  .contact_field + .contact_field {
    margin-top: var(--space-80);
  }
}

.form-field_head {
  width: clamp(248px, calc(210.95176010430248px + 4.823989569752282vw), 285px);
  display: flex;
  align-items: center;
  gap: var(--space-12);
  flex-shrink: 0;
}

@media (max-width: 767px) {
  .form-field_head {
    justify-content: flex-start;
  }
}

.form-field_label {
  font-size: var(--fs-sm-16);
}

.form-field_label span {
  font-size: 12px;
  display: inline-block;
  margin-left: -5px;
}

.form-field_tag img {
  display: block;
  width: clamp(60px, calc(56.75px + 0.8333333333333334vw), 68px);
  height: auto;
}

.form-field_body {
  flex-grow: 1;
}

/*----------------------------------------------------------------
  INPUT（テキスト系）
----------------------------------------------------------------*/
.form-text {
  font-size: var(--fs-sm-16);
  letter-spacing: 0.02em;
  width: 100%;
  border: 2px solid var(--color-white);
  background: var(--color-white);
  padding: 20px 19px 20px;
  transition: border-color 0.3s;
}

.form-text:hover,
.form-text:focus {
  border-color: var(--color-bright-blue);
  outline: none;
}

/*----------------------------------------------------------------
  CF7 RADIO（完全対応）
----------------------------------------------------------------*/
.form-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}

@media (max-width: 767px) {
  .form-radio-group {
    gap: 12px;
  }
}

/* CF7 ラジオを横並びにする */
/* ラジオボタンの親（CF7 の本体）を flex に */
.wpcf7-form-control.wpcf7-radio.form-radio_input {
  display: flex;
  flex-wrap: wrap;
  gap: 25px; /* お好みで調整 */
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .wpcf7-form-control.wpcf7-radio.form-radio_input {
    gap: 12px;
  }
}

/* ラジオの <input> を隠す */
.form-radio-group .wpcf7-list-item input[type="radio"] {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

/* ラベル部分 */
.form-radio-group .wpcf7-list-item-label {
  position: relative;
  padding-left: 24px;
  cursor: pointer;
  font-size: var(--fs-sm-16);
  display: inline-block;
}

/* チェック前ボタン */
.form-radio-group .wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 1px solid var(--color-black);
  border-radius: 50%;
  background: #fff;
  transition: all 0.3s ease;
}

/* チェック後ボタン */
.form-radio-group .wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label::before {
  background-color: var(--color-bright-blue);
  box-shadow: inset 0 0 0 2.5px #fff;
  border-color: var(--color-bright-blue);
}

/* hover 効果 */
.wpcf7-list-item-label:hover::before {
  border-color: var(--color-bright-blue);
}

/*----------------------------------------------------------------
  SELECT
----------------------------------------------------------------*/
.form-select {
  appearance: none;
  width: 100%;
  border-radius: 5px;
  border: 2px solid var(--color-white);
  background: var(--color-white);
  padding: calc(15px - 2px) calc(46px - 2px) calc(14px - 3px) calc(16px - 2px);
  background: url(../img/select-arrow.webp) no-repeat center right 14px / 13.217px 10.182px;
  transition: border-color 0.3s;
}

.form-select:hover,
.form-select:focus {
  border-color: var(--color-bright-blue);
  outline: none;
}

/*----------------------------------------------------------------
  TEXTAREA
----------------------------------------------------------------*/
.form-textarea {
  border-radius: 5px;
  border: 2px solid var(--color-white);
  background: var(--color-white);
  width: 100%;
  height: 180px;
  padding: calc(16px - 3px);
  transition: border-color 0.3s;
}

.form-textarea:hover,
.form-textarea:focus {
  border-color: var(--color-bright-blue);
  outline: none;
}

.form-text::placeholder,
.form-textarea::placeholder {
  color: #b2b2b2;
  opacity: 1;
}

/*================================================================
  最終アクションボックス（確認チェック + 送信ボタン）
================================================================*/

/* ボックス全体の余白 */
.action-box {
  margin-top: var(--space-48);
  text-align: center;
}

/*--------------------------------------
  チェックボックス（CF7 acceptance）
--------------------------------------*/

/* デフォルトのチェックボックスを隠す */
.action-box .form_check input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

/* チェックボックスのラベル */
.action-box .form_check {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fs-sm-16);
  margin-top: 6px;
  cursor: pointer;
  position: relative;
}

/* カスタムチェック枠 */
.action-box .form_check::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: 1px solid var(--color-black);
  background: #fff;
  display: inline-block;
  transition: all 0.3s ease;
}

/* チェック時のマーク */
.action-box .form_check input[type="checkbox"]:checked + span::before {
  content: "";
}

.action-box .form_check input[type="checkbox"]:checked ~ .form_check::before {
  background: var(--color-bright-blue);
  border-color: var(--color-bright-blue);
  box-shadow: inset 0 0 0 3px #fff;
}

.action-box .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: var(--space-16);
}

.action-box .wpcf7-list-item-label {
  line-height: 1.4;
}

/*--------------------------------------
  送信ボタン
--------------------------------------*/

.contact_btn {
  width: min(90%, 402px);
  margin-top: var(--space-64);
  position: relative;
  display: inline-block;
}

.contact_btn::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  transform: translateY(-50%);
  width: 47px;
  height: 47px;
  background-color: var(--color-navy-blue);
  border-radius: 50%;
  background-image: url(../img/ui/arrow_white.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 8px;
  pointer-events: none;
  z-index: 1;
}
/* * SP：〜767px ----- */
@media (max-width: 767px) {
  .contact_btn::before {
    width: 30px;
    height: 30px;
    right: 20px;
  }
}

.form-btn {
  width: 100%;
  font-size: var(--fs-sm-16);
  font-family: var(--font-ja-gothic);
  letter-spacing: 0.12em;
  padding: 24px 44px;
  border-radius: 50px;
  border: 2px solid var(--color-pale-gray);
  background: #fff;
  color: #000;
  transition: background-color 0.3s, color 0.3s;
  text-align: left;
  position: relative;
}

/* 矢印丸背景 */
.contact_btn::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  transform: translateY(-50%);
  width: 47px;
  height: 47px;
  border-radius: 50%;
  background: var(--color-navy-blue) url(../img/ui/arrow_white.svg) no-repeat center/14px 8px;
  pointer-events: none;
}

@media (max-width: 767px) {
  .contact_btn::before {
    width: 30px;
    height: 30px;
    right: 20px;
  }
}

.wpcf7-spinner {
  display: none !important;
}

/*================================================================
  ACCEPTANCE（確認チェック）
================================================================*/

/* wrapper の最上位 */
.wpcf7-form-control-wrap.acceptance {
  display: block;
  margin-bottom: var(--space-40);
}

/* デフォルト input を消す */
.wpcf7-form-control-wrap.acceptance input[type="checkbox"] {
  opacity: 0;
  position: absolute;
}

/* テキスト部分 */
.wpcf7-form-control-wrap.acceptance .wpcf7-list-item-label {
  font-size: var(--fs-sm-16);
  padding-left: 28px;
  cursor: pointer;
  position: relative;
  display: inline-block;
  line-height: 1.6;
}

/* チェック枠（before） */
.wpcf7-form-control-wrap.acceptance .wpcf7-list-item-label::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 1px solid #111;
  border-radius: 3px;
  background: #fff;
  position: absolute;
  left: 0;
  top: 0.2em;
  transition: all 0.3s ease;
}

/* チェック時（after） */
.wpcf7-form-control-wrap.acceptance input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
  background: var(--color-bright-blue);
  border-color: var(--color-bright-blue);
  box-shadow: inset 0 0 0 3px #fff; /* 白リング */
}

/*----------------------------------------------------------------
  配置
----------------------------------------------------------------*/
.wpcf7-form-control-wrap.acceptance .wpcf7-list-item {
  display: flex;
  align-items: center;
}

.wpcf7-not-valid-tip {
  text-align-last: left;
  padding-top: 0.3em;
  margin-left: 0.5em;
}

/*----------------------------------------------------------------
  THANKSページ
----------------------------------------------------------------*/
.contact__thanks {
  padding: 80px 0;
  color: var(--color-navy-blue);
  font-family: var(--font-ja-gothic);
  margin-bottom: clamp(-165px, calc(-155.3846153846154px + -2.564102564102564vw), -190px);
}

.contact__thanks-inner {
  width: min(100% - 4rem, 1050px);
  margin-inline: auto;
}

.contact__thanks-title {
  font-size: var(--fs-lg-25);
  font-weight: 500;
  line-height: 1.2;
}

.contact__thanks-text {
  margin-top: var(--space-48);
  font-size: var(--fs-sm-16);
  line-height: 1.4;
}

.contact__thanks-btn {
  display: inline-block;
  background-color: var(--color-navy-blue);
  padding: var(--space-24);
  border-radius: 20px;
  margin-top: var(--space-80);
}

.contact__thanks-btn a {
  color: var(--color-white);
}

/* honeypot */
.wpcf7-form-control-wrap[data-name="honeypot-field"] {
  display: none !important;
}

/*================================================================
# UTILITIES（汎用クラス）
================================================================*/
/* .text-center, .flex, .mt-40 など */

/* テキスト折り返しなし */
.u-nowrap {
  white-space: nowrap;
}

/*================================================================
 UTILITIES：Hover underline (center grow)
================================================================*/
.u-hover-underline-center {
  position: relative;
  display: inline-block;
  padding-bottom: clamp(10px, calc(8.846153846153847px + 0.3076923076923077vw), 13px);
  text-decoration: none;
}

/* 下線（初期：中心で幅0） */
.u-hover-underline-center::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 1px;
  background-color: currentColor;
  transform: translateX(-50%);
  transition: width 0.3s ease;
}

/* hover時：中央から両サイドに伸びる */
.u-hover-underline-center:hover::before {
  width: 100%;
}

/*================================================================
 UTILITIES：h1タイトル非表示
================================================================*/
.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}