/* トップページ専用CSS。index.html の head でだけ読み込む。Figma: 01_PC_TOP / 01_SP_TOP */
@layer pages {
  /* ---------- FV（Figma: FV） ---------- */
  .p-top-fv {
    position: relative;
    padding-top: var(--wp--preset--spacing--40);
    padding-bottom: var(--wp--preset--spacing--40);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    background: var(--wp--preset--gradient--fv);
  }

  /* 葉型写真 6 枚（Figma: Frame 1373）が右から左へ流れ続ける（注記の参考 nh-ss.co.jp/recruit: 約 48px/s、ホバーで止めない）。
     2 組を並べて 1 組ぶん動かすと継ぎ目なくループする。1 組 = 6 × (300 + 20) = 1920px → 40s */
  /* 写真の帯は画面いっぱいに流す（2026-10-29 本人指示）。コピーと Scroll down はカンバス（1400px）の中に収め、それより広い画面では中央に置く */
  .p-top-fv__images {
    display: flex;
    padding-bottom: 10px; /* 右下にずらした影（::before）が切れないぶん（PC 15px） */
    margin-bottom: -10px;
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
  }

  .p-top-fv__set {
    display: flex;
    flex-shrink: 0;
    gap: var(--wp--preset--spacing--20);
    padding-right: var(--wp--preset--spacing--20);
    isolation: isolate;
  }

  /* transform で書く（translate / rotate の個別プロパティは古い iOS で動かないことがある） */
  @keyframes p-top-fv-marquee {
    to {
      transform: translateX(-100%);
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .p-top-fv__set {
      animation: p-top-fv-marquee 40s linear infinite;
    }
  }

  .p-top-fv__image {
    position: relative;
    flex-shrink: 0;
    width: 300px;
    aspect-ratio: 1;
    border-radius: var(--wp--preset--radius--large) var(--wp--preset--radius--blob);
  }

    .p-top-fv__image img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      border-radius: inherit;
    }

    /* 右下にずらした薄いグラデーションの影（Figma: Frame 11、opacity 20%） */
    .p-top-fv__image::before {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: -1;
      content: "";
      background: var(--wp--preset--gradient--vertical);
      border-radius: inherit;
      opacity: 0.2;
      translate: 10px 10px;
    }

  .p-top-fv__body {
    position: relative;
    width: min(100%, var(--wp--preset--layout--canvas-max));
    margin-left: auto;
    margin-right: auto;
    margin-top: var(--wp--preset--spacing--30);
  }

  /* トップでは h1 はロゴで使うため、キャッチコピーは h2 */
  .p-top-fv__copy {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--10);
    align-items: flex-start;
    margin: 0;
  }

  .p-top-fv__copy-line {
    display: block;
    padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
    font-size: var(--wp--preset--font-size--hero);
    font-weight: 700;
    line-height: var(--wp--preset--line-height--normal);
    letter-spacing: var(--wp--preset--letter-spacing--x-wide);
    white-space: nowrap;
    background-color: var(--wp--preset--color--white);
    border-radius: var(--wp--preset--radius--medium) var(--wp--preset--radius--x-large);
  }

    .p-top-fv__copy-line em {
      font-style: normal;
      color: var(--wp--preset--color--primary);
    }

  @media (prefers-reduced-motion: no-preference) {
    .is-js .p-top-fv__copy-line {
      --chars-start: calc(0.4s + var(--line) * 0.2s);

      opacity: 0;
      transition: opacity 0.6s ease-out calc(var(--line) * 0.2s);
    }

    .is-js .p-top-fv__copy.is-inview .p-top-fv__copy-line {
      opacity: 1;
    }

    .p-top-fv__copy-line:nth-child(1) {
      --line: 0;
    }

    .p-top-fv__copy-line:nth-child(2) {
      --line: 1;
    }

    .p-top-fv__lead {
      --reveal-delay: 1.2s;
    }
  }

  .p-top-fv__lead {
    margin: var(--wp--preset--spacing--20) 0 0 var(--wp--preset--spacing--15);
    font-size: var(--wp--preset--font-size--medium);
    font-weight: 500;
    line-height: 2;
    letter-spacing: var(--wp--preset--letter-spacing--wide);
  }

  /* Scroll down の丸いバッジ。文字だけ反時計回りに回り続け（Figma 注記）、矢印は止まっている。追尾はしない */
  .p-top-fv__scroll {
    position: absolute;
    right: max(var(--wp--preset--spacing--15), calc((100% - var(--wp--preset--layout--canvas-max)) / 2));
    bottom: 0;
    width: 65px;
    height: 65px;
    color: var(--wp--preset--color--primary);
  }

    .p-top-fv__scroll img,.p-top-fv__scroll svg {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      display: block;
      width: 100%;
      height: 100%;
    }

  @keyframes p-top-spin {
    to {
      transform: rotate(-360deg);
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .p-top-fv__scroll-text {
      animation: p-top-spin 20s linear infinite;
    }
  }

  /* 矢印は SP 用（Group 103 の 8×10）と PC 用（190 基準）を切り替える */
  .p-top-fv__scroll-arrow--pc {
    display: none;
  }

  @media (min-width: 768px) {
    .p-top-fv__scroll-arrow--sp {
      display: none;
    }

    .p-top-fv__scroll-arrow--pc {
      display: block;
    }
  }

  /* ---------- Message ---------- */
  .p-top-message {
    position: relative;
    padding-top: var(--wp--preset--spacing--55);
    padding-bottom: var(--wp--preset--spacing--60);
    background-color: var(--wp--preset--color--background-soft);

    /* 下半分の緑の帯 */
  }
    .p-top-message::after {
      position: absolute;
      top: auto;
      right: 0;
      bottom: 0;
      left: 0;
      height: 300px;
      content: "";
      background-color: var(--wp--preset--color--primary);
    }

  .p-top-message__card {
    position: relative;
    z-index: 1;
    max-width: var(--wp--preset--layout--card-max);
    padding: var(--wp--preset--spacing--45) var(--wp--preset--spacing--30)
      var(--wp--preset--spacing--40);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: var(--wp--preset--color--white);
    border-radius: var(--wp--preset--radius--large);
    box-shadow: var(--wp--preset--shadow--card);
  }

  .p-top-message__lead {
    margin: var(--wp--preset--spacing--35) 0 0;
    font-size: var(--wp--preset--font-size--large);
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: var(--wp--preset--letter-spacing--x-wide);
  }

  .p-top-message__text {
    margin: var(--wp--preset--spacing--20) 0 0;
    font-size: var(--wp--preset--font-size--body);
    font-weight: 500;
    line-height: var(--wp--preset--line-height--body);
    text-align: left;
    letter-spacing: var(--wp--preset--letter-spacing--wide);
  }

  /* ---------- Mitsuba Farming ---------- */
  .p-top-mitsuba {
    position: relative;
    isolation: isolate; /* 飾り（z-index: -1）を背景のすぐ上・内容の下に置く（2026-10-30 本人指示） */
    padding-top: var(--wp--preset--spacing--20);
    padding-bottom: var(--wp--preset--spacing--section);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    color: var(--wp--preset--color--white);
    background-color: var(--wp--preset--color--primary);
  }

  .p-top-mitsuba__intro {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--60);
    margin-top: var(--wp--preset--spacing--45);
  }

  /* 葉型の写真。右下に白い同じ形をずらして置く */
  .p-top-mitsuba__image {
    position: relative;
    flex-shrink: 0;
    width: min(100%, 360px);
    margin-left: auto;
    margin-right: auto; /* 縦積みのときは写真を中央に（2026-10-30 本人指示）。二段組（--pc-wide）で戻す */
    aspect-ratio: 1;
    border-radius: var(--wp--preset--radius--large) var(--wp--preset--radius--blob);
    isolation: isolate;
  }

    .p-top-mitsuba__image img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      border-radius: inherit;
    }

    .p-top-mitsuba__image::before {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: -1;
      content: "";
      background-color: var(--wp--preset--color--white);
      border-radius: inherit;
      translate: 10px 10px;
    }

  .p-top-mitsuba__lead {
    margin: 0;
    font-size: var(--wp--preset--font-size--x-large);
    font-weight: 900;
    line-height: 1.8;
    text-align: center;
    letter-spacing: var(--wp--preset--letter-spacing--x-wide);
  }

  .p-top-mitsuba__text {
    margin: var(--wp--preset--spacing--15) 0 0;
    font-size: var(--wp--preset--font-size--body);
    line-height: 2;
  }

  .p-top-mitsuba__features {
    margin-top: var(--wp--preset--spacing--80);
  }

  .p-top-mitsuba__button {
    margin: var(--wp--preset--spacing--80) 0 0;
    text-align: center;
  }

  /* 背景の葉型の飾り（Figma: Rectangle 151〜155）。角丸は辺の 1/30 と 1/4 */
  .p-top-mitsuba__deco {
    position: absolute;
    z-index: -1; /* 画面幅によって文字や写真と重なるので、必ず下に */
    pointer-events: none;
    background-color: var(--wp--preset--color--white);
    border-radius: 3.3333% 25%;
  }

  .p-top-mitsuba__deco--1 {
    top: 106px;
    right: -21px;
    width: 92px;
    height: 92px;
    opacity: 0.2;
  }

  .p-top-mitsuba__deco--2 {
    bottom: 841px;
    left: -25px;
    width: 100px;
    height: 100px;
    background-color: var(--wp--preset--color--accent);
    opacity: 0.5;
  }

  /* SP の飾り 2（Figma: Rectangle 155、x -25 y 1700）は 2 枚目の丸写真の左下に重なる。区画の高さは文章量で変わるので、
     区画基準の span ではなく 2 枚目のカード基準で描く（丸写真 300px の下端から 37px 上、カードの左端から 40px 外） */
  @media (max-width: 767.98px) {
    .p-top-mitsuba__deco--2 {
      display: none;
    }

    .p-top-mitsuba__features > .c-feature:nth-child(2) {
      position: relative;
      isolation: isolate;
    }

      .p-top-mitsuba__features > .c-feature:nth-child(2)::after {
        position: absolute;
        top: 263px;
        left: -40px;
        z-index: -1; /* 丸写真の下に */
        width: 100px;
        height: 100px;
        pointer-events: none;
        content: "";
        background-color: var(--wp--preset--color--accent);
        border-radius: 3.3333% 25%;
        opacity: 0.5;
      }
  }

  .p-top-mitsuba__deco--3 {
    right: -17px;
    bottom: -27px;
    width: 94px;
    height: 94px;
    opacity: 0.15;
  }

  .p-top-mitsuba__deco--4 {
    top: 853px;
    right: 16px;
    width: 70px;
    height: 70px;
    background-color: var(--wp--preset--color--accent);
    opacity: 0.5;
  }

  /* ---------- Online Store ---------- */
  .p-top-store {
    position: relative;
    padding-top: var(--wp--preset--spacing--60);
    padding-bottom: var(--wp--preset--spacing--60);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    color: var(--wp--preset--color--white);
    text-align: center;

    /* 写真を少し暗くしてぼかす（Figma: Rectangle 169） */
  }
    .p-top-store::before {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 1;
      content: "";
      background-color: var(--wp--preset--color--overlay);
      -webkit-backdrop-filter: blur(3px);
              backdrop-filter: blur(3px);
    }

  .p-top-store__bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: bottom;
       object-position: bottom;
  }

  .p-top-store__inner {
    position: relative;
    z-index: 2;
  }

  .p-top-store__lead {
    margin: var(--wp--preset--spacing--35) 0 0;
    font-size: var(--wp--preset--font-size--store-lead);
    font-weight: 700;
    line-height: var(--wp--preset--line-height--loose);
    letter-spacing: var(--wp--preset--letter-spacing--wide);
    text-shadow: var(--wp--preset--shadow--text);
  }

  .p-top-store__buttons {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
    align-items: center;
    margin-top: var(--wp--preset--spacing--40);
  }

  /* ---------- Sustainability ---------- */
  .p-top-sustainability {
    position: relative;
    isolation: isolate; /* 飾りを内容の下に */
    padding-top: var(--wp--preset--spacing--section);
    padding-bottom: var(--wp--preset--spacing--section);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    background-color: var(--wp--preset--color--background);
  }

  .p-top-sustainability__intro {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--60);
    margin-top: var(--wp--preset--spacing--45);
  }

  /* 葉型の写真。右下にグラデーションの同じ形をずらして置く */
  .p-top-sustainability__image {
    position: relative;
    flex-shrink: 0;
    width: min(100%, 360px);
    margin-left: auto;
    margin-right: auto; /* 縦積みのときは写真を中央に。二段組（--pc-wide）で戻す */
    aspect-ratio: 1;
    border-radius: var(--wp--preset--radius--large) var(--wp--preset--radius--blob);
    isolation: isolate;
  }

    .p-top-sustainability__image img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      border-radius: inherit;
    }

    .p-top-sustainability__image::before {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: -1;
      content: "";
      background: var(--wp--preset--gradient--primary);
      border-radius: inherit;
      translate: 10px 10px;
    }

  .p-top-sustainability__lead {
    margin: 0;
    font-size: var(--wp--preset--font-size--x-large);
    font-weight: 700;
    line-height: 1.8;
    color: var(--wp--preset--color--primary);
    text-align: center;
    letter-spacing: var(--wp--preset--letter-spacing--x-wide);
  }

  .p-top-sustainability__text {
    margin: var(--wp--preset--spacing--40) 0 0;
    font-size: var(--wp--preset--font-size--body);
    line-height: 2;
  }

  .p-top-sustainability__features {
    margin-top: var(--wp--preset--spacing--80);
  }

  .p-top-sustainability__button {
    margin: var(--wp--preset--spacing--80) 0 0;
    text-align: center;
  }

  .p-top-sustainability__deco {
    position: absolute;
    z-index: -1;
    pointer-events: none;
    background: var(--wp--preset--gradient--primary);
    border-radius: 3.3333% 25%;
  }

  .p-top-sustainability__deco--1 {
    top: 179px;
    right: 0;
    width: 68px;
    height: 68px;
    opacity: 0.2;
  }

  .p-top-sustainability__deco--2 {
    bottom: -136px;
    left: -43px;
    width: 194px;
    height: 194px;
    opacity: 0.05;
  }

  /* ---------- Company ---------- */
  .p-top-company {
    padding-top: var(--wp--preset--spacing--section);
    padding-bottom: var(--wp--preset--spacing--section);
    background-color: var(--wp--preset--color--background-soft);
  }

  .p-top-company__intro {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--50);
    margin-top: var(--wp--preset--spacing--45);
  }

  .p-top-company__image {
    width: 100%;
    aspect-ratio: 370 / 246;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: bottom;
       object-position: bottom;
    border-radius: var(--wp--preset--radius--medium); /* SP は 10px（Figma: Rectangle 34） */
  }

  .p-top-company__info {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--50);
    align-items: center;
  }

  /* wp: 会社情報の表。ACF かテーマの固定値 */
  .p-top-company__table {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
    width: 100%;
    margin: 0;
  }

  .p-top-company__row {
    display: flex;
    gap: var(--wp--preset--spacing--40);
    align-items: flex-start;
    padding-bottom: var(--wp--preset--spacing--20);
    border-bottom: 1px solid var(--wp--preset--color--border-dark);
  }

  .p-top-company__label {
    flex-shrink: 0;
    width: 70px;
    margin: 0;
    font-size: var(--wp--preset--font-size--label);
    font-weight: 500;
    line-height: 1.875;
    color: var(--wp--preset--color--primary);
  }

  .p-top-company__value {
    margin: 0;
    font-size: var(--wp--preset--font-size--nav);
    line-height: var(--wp--preset--line-height--body);
  }

    .p-top-company__value a {
      -webkit-text-decoration: none;
      text-decoration: none;
    }

    .p-top-company__value a[target="_blank"] {
      color: var(--wp--preset--color--primary);
      -webkit-text-decoration: underline;
      text-decoration: underline;
      text-underline-offset: 0.15em;
    }

  /* FAX は SP で改行、それ以外は TEL の横に空けて並べる */
  .p-top-company__fax {
    display: block;
  }

  /* 採用バナー（Figma: Frame 1107） */
  .p-top-company__recruit {
    position: relative;
    isolation: isolate; /* 飾りを内容の下に */
    display: flex;
    flex-direction: column;
    padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--15)
      var(--wp--preset--spacing--30);
    margin-top: var(--wp--preset--spacing--80);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    color: var(--wp--preset--color--white);
    text-align: center;
    background-color: var(--wp--preset--color--primary);
    border-radius: var(--wp--preset--radius--medium);
  }

  .p-top-company__recruit-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .p-top-company__recruit-lead {
    margin: var(--wp--preset--spacing--25) 0 0;
    font-size: var(--wp--preset--font-size--card-sub);
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: var(--wp--preset--letter-spacing--wide);
  }

  /* SP は 写真 → ボタン の順（Figma）。DOM は PC の並び（本文・ボタン・写真） */
  .p-top-company__recruit-image {
    position: relative;
    z-index: 1;
    order: 1;
    width: 100%;
    aspect-ratio: 340 / 195;
    margin-top: var(--wp--preset--spacing--20);
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: var(--wp--preset--radius--large);
  }

  .p-top-company__recruit-button {
    position: relative;
    z-index: 1;
    order: 2;
    margin: var(--wp--preset--spacing--20) var(--wp--preset--spacing--5) 0 0;
    text-align: right;
  }

  .p-top-company__recruit-deco {
    position: absolute;
    z-index: -1;
    pointer-events: none;
    background-color: var(--wp--preset--color--white);
    border-radius: 3.3333% 25%;
    opacity: 0.2;
  }

  .p-top-company__recruit-deco--1 {
    top: 186px;
    left: -23px;
    width: 126px;
    height: 126px;
  }

  .p-top-company__recruit-deco--2 {
    top: 80px;
    left: 430px;
    width: 48px;
    height: 48px;
  }

  /* ---------- Farm Visit ---------- */
  .p-top-farm {
    position: relative;
    padding-top: var(--wp--preset--spacing--section);
    padding-bottom: var(--wp--preset--spacing--section);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
    color: var(--wp--preset--color--white);
    text-align: center;
    background-color: var(--wp--preset--color--primary);
  }

  /* SP は幅いっぱい、PC は 1000px 角丸 */
  .p-top-farm__main {
    position: relative;
    margin-left: calc(var(--wp--preset--layout--container-gutter) * -1);
    margin-right: calc(var(--wp--preset--layout--container-gutter) * -1);
    margin-top: var(--wp--preset--spacing--35);
  }

  .p-top-farm__main-image {
    display: block;
    width: 100%;
    aspect-ratio: 400 / 300;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: inherit;
  }

  /* 手書きの「Come and See」（Figma: 3f45e982… 1、-13.14° 回転） */
  .p-top-farm__hand {
    position: absolute;
    top: 224px;
    left: 6px;
    width: 238px;
    pointer-events: none;
    rotate: -13.14deg;
  }

  .p-top-farm__lead {
    margin: var(--wp--preset--spacing--40) 0 0;
    font-size: min(var(--wp--preset--font-size--x-large), 5.6vw); /* 375px（iPhone SE）でも 1 行に収まる大きさ */
    font-weight: 900;
    line-height: 1.8;
    letter-spacing: var(--wp--preset--letter-spacing--x-wide);
    white-space: nowrap; /* SP で「。」だけ折れるのを防ぐ（Figma は 1 行） */
  }

  .p-top-farm__text {
    margin: var(--wp--preset--spacing--15) 0 0;
    font-size: var(--wp--preset--font-size--medium);
    font-weight: 500;
    line-height: var(--wp--preset--line-height--body);
    text-align: left;
  }

  .p-top-farm__button {
    margin: var(--wp--preset--spacing--35) 0 0;
  }

  /* 4 枚の写真。SP は右にずらして両端が切れる */
  /* 写真 6 枚（Figma: Frame 11）が右から左へ流れ続ける。FV と同じ仕組み（2 組を並べて 1 組ぶん動かす）。
     1 組 = 6 × (200 + 20) = 1320px → 約 48px/s で 27.5s（PC は 6 × (350 + 30) = 2280px → 47.5s） */
  /* 流れる写真は FV と同じく画面いっぱい（2026-10-29 本人指示） */
  .p-top-farm__photos {
    display: flex;
    margin-top: var(--wp--preset--spacing--60);
    overflow: hidden; /* clip が無い iOS 15 以前の予備 */
    overflow: clip;
  }

  .p-top-farm__set {
    display: flex;
    flex-shrink: 0;
    gap: var(--wp--preset--spacing--20);
    padding-right: var(--wp--preset--spacing--20);
  }

  @media (prefers-reduced-motion: no-preference) {
    .p-top-farm__set {
      animation: p-top-fv-marquee 27.5s linear infinite;
    }
  }

  .p-top-farm__photo {
    flex-shrink: 0;
    width: 200px;
    aspect-ratio: 1;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: var(--wp--preset--radius--large) var(--wp--preset--radius--blob-small);
  }

  /* ---------- News ---------- */
  .p-top-news {
    padding-top: var(--wp--preset--spacing--section);
    padding-bottom: var(--wp--preset--spacing--section); /* 2026-10-31 本人指示でオンラインストアの前へ移動。CTA の前ではなくなったので上下対称に */
  }

  .p-top-news__inner {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--55);
  }

  .p-top-news__heading {
    display: flex;
    justify-content: center;
  }

  /* wp: WP_Query('post') のループ */
  .p-top-news__list {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--25);
  }

  .p-top-news__more {
    margin: var(--wp--preset--spacing--20) 0 0;
    text-align: right;
  }

  /* ========== PC ========== */
  @media (min-width: 768px) {
    .p-top-fv {
      padding-top: var(--wp--preset--spacing--40);
      padding-bottom: var(--wp--preset--spacing--75);
    }

    .p-top-fv__images {
      padding-bottom: 15px;
      margin-bottom: -15px;
    }

    .p-top-fv__set {
      gap: var(--wp--preset--spacing--60);
      padding-right: var(--wp--preset--spacing--60);
    }

    @media (prefers-reduced-motion: no-preference) {
      .p-top-fv__set {
        animation-duration: 80s;
      }
    }

    .p-top-fv__image {
      width: 600px;
    }

      .p-top-fv__image::before {
        translate: 15px 15px;
      }

    /* 写真に 180px 重ねる（Figma: 写真の下端 640、コピーの上端 461） */
    .p-top-fv__body {
      padding-left: var(--wp--preset--layout--container-gutter);
      margin-top: calc(var(--wp--preset--spacing--120) * -1.5);
    }

    .p-top-fv__copy {
      gap: var(--wp--preset--spacing--15);
    }

    .p-top-fv__copy-line {
      padding: var(--wp--preset--spacing--15) var(--wp--preset--spacing--35);
    }

    .p-top-fv__lead {
      margin: var(--wp--preset--spacing--40) 0 0 var(--wp--preset--spacing--40);
      line-height: var(--wp--preset--line-height--loose);
    }

    .p-top-fv__scroll {
      right: max(0px, calc((100% - var(--wp--preset--layout--canvas-max)) / 2));
      bottom: var(--wp--preset--spacing--80);
      width: 120px;
      height: 120px;
    }

    .p-top-message {
      padding-top: 0;
      padding-bottom: var(--wp--preset--spacing--80);
    }

      .p-top-message::after {
        height: 296px;
      }

    .p-top-message__card {
      padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--30)
        var(--wp--preset--spacing--50);
    }

    .p-top-message__lead {
      margin-top: var(--wp--preset--spacing--50);
      line-height: 1.8;
    }

    .p-top-message__text {
      line-height: var(--wp--preset--line-height--x-loose);
      text-align: center;
    }

    .p-top-mitsuba {
      padding-top: var(--wp--preset--spacing--80);
    }

    .p-top-mitsuba__image {
      width: 600px;
    }

      .p-top-mitsuba__image::before {
        translate: 15px 15px;
      }

    .p-top-mitsuba__text {
      margin-top: var(--wp--preset--spacing--25);
      line-height: var(--wp--preset--line-height--loose);
    }

    .p-top-mitsuba__features {
      margin-top: var(--wp--preset--spacing--140);
    }

    .p-top-mitsuba__button {
      margin-top: var(--wp--preset--spacing--100);
    }

    .p-top-mitsuba__deco--1 {
      top: 86px;
      right: 0;
      width: 234px;
      height: 234px;
    }

    .p-top-mitsuba__deco--2 {
      top: 766px;
      bottom: auto;
      left: calc(50% + 35px);
      width: 144px;
      height: 144px;
    }

    .p-top-mitsuba__deco--3 {
      right: auto;
      bottom: -257px;
      left: -52px;
      width: 454px;
      height: 454px;
    }

    .p-top-mitsuba__deco--4 {
      top: auto;
      right: 22px;
      bottom: 65px;
      width: 122px;
      height: 122px;
    }

    .p-top-store {
      padding-top: var(--wp--preset--spacing--100);
      padding-bottom: var(--wp--preset--spacing--100);
    }

    .p-top-store__bg {
      -o-object-position: center;
         object-position: center;
    }

    .p-top-store__lead {
      margin-top: var(--wp--preset--spacing--50);
      line-height: 2;
    }

    .p-top-store__buttons {
      flex-flow: row wrap;
      gap: var(--wp--preset--spacing--60);
      justify-content: center;
      margin-top: var(--wp--preset--spacing--20);
    }

    .p-top-sustainability__image {
      width: 600px;
    }

      .p-top-sustainability__image::before {
        translate: 15px 15px;
      }

    .p-top-sustainability__text {
      margin-top: var(--wp--preset--spacing--60);
      line-height: var(--wp--preset--line-height--loose);
    }

    .p-top-sustainability__features {
      margin-top: var(--wp--preset--spacing--140);
    }

    .p-top-sustainability__button {
      margin-top: var(--wp--preset--spacing--100);
    }

    .p-top-sustainability__deco--1 {
      top: 150px;
      right: -2px;
      width: 234px;
      height: 234px;
    }

    .p-top-sustainability__deco--2 {
      bottom: -67px;
      left: 57px;
    }

    .p-top-company__info {
      gap: var(--wp--preset--spacing--60);
    }

    .p-top-company__fax {
      display: inline;
      margin-left: var(--wp--preset--spacing--30);
    }

    .p-top-company__table {
      gap: var(--wp--preset--spacing--25);
    }

    .p-top-company__row {
      padding-bottom: var(--wp--preset--spacing--25);
    }

    .p-top-company__value {
      font-size: var(--wp--preset--font-size--label);
      line-height: 1.875;
    }

    .p-top-company__recruit-lead {
      margin-top: var(--wp--preset--spacing--25); /* Figma: 見出しの下 35px（行ボックスの余白 10px を引く） */
    }

    .p-top-company__recruit-deco--1 {
      top: 208px;
      left: -52px;
      width: 184px;
      height: 184px;
    }

    .p-top-farm__main {
      width: min(100%, var(--wp--preset--layout--content-max));
      margin-left: auto;
      margin-right: auto;
      margin-top: var(--wp--preset--spacing--50);
      border-radius: var(--wp--preset--radius--large);
    }

    .p-top-farm__main-image {
      aspect-ratio: 1000 / 450;
    }

    .p-top-farm__hand {
      top: -7px;
      left: 0;
      width: 487px;
    }

    .p-top-farm__lead {
      margin-top: var(--wp--preset--spacing--60);
      line-height: var(--wp--preset--line-height--heading);
    }

    .p-top-farm__text {
      line-height: var(--wp--preset--line-height--loose);
      text-align: center;
    }

    .p-top-farm__photos {
      margin-top: var(--wp--preset--spacing--120);
    }

    .p-top-farm__set {
      gap: var(--wp--preset--spacing--30);
      padding-right: var(--wp--preset--spacing--30);
    }

    @media (prefers-reduced-motion: no-preference) {
      .p-top-farm__set {
        animation-duration: 47.5s;
      }
    }

    .p-top-farm__photo {
      width: 350px;
    }

    .p-top-news {
      padding-top: var(--wp--preset--spacing--section);
      padding-bottom: var(--wp--preset--spacing--section);
    }

    .p-top-news__list {
      gap: var(--wp--preset--spacing--30);
    }

    .p-top-news__more {
      margin-top: var(--wp--preset--spacing--30);
    }
  }

  /* ========== 1200px 以上（2 カラムの区画。768〜1199 は SP と同じ縦積み） ========== */
  @media (min-width: 1200px) {
    .p-top-fv__scroll {
      width: 190px;
      height: 190px;
    }

    .p-top-mitsuba__image {
      width: min(600px, 48%);
      margin-left: 0;
      margin-right: 0;
    }

    .p-top-mitsuba__body {
      flex: 1;
      min-width: 0;
    }

    .p-top-mitsuba__intro {
      flex-direction: row;
      gap: var(--wp--preset--spacing--80);
      align-items: center;
      margin-top: var(--wp--preset--spacing--70);
    }

    .p-top-mitsuba__lead {
      line-height: var(--wp--preset--line-height--heading);
      text-align: left;
    }

    .p-top-sustainability__image {
      width: min(600px, 48%);
      margin-left: 0;
      margin-right: 0;
    }

    .p-top-sustainability__body {
      flex: 1;
      min-width: 0;
    }

    .p-top-sustainability__intro {
      flex-direction: row;
      gap: var(--wp--preset--spacing--60);
      align-items: center;
      margin-top: var(--wp--preset--spacing--80);
    }

    .p-top-sustainability__lead {
      line-height: var(--wp--preset--line-height--heading);
      text-align: left;
    }

    .p-top-company__intro {
      display: grid;
      grid-template-columns: 610px minmax(0, 1fr);
      grid-gap: var(--wp--preset--spacing--80);
      gap: var(--wp--preset--spacing--80);
      align-items: center;
      margin-top: var(--wp--preset--spacing--60);
    }

    .p-top-company__image {
      aspect-ratio: 610 / 406;
      border-radius: var(--wp--preset--radius--large);
    }

    /* 左列（本文・ボタン）を上下中央に置くため、上下に 1fr の空き行を挟む */
    .p-top-company__recruit {
      display: grid;
      grid-template-rows: 1fr auto auto 1fr;
      grid-template-columns: minmax(0, 1fr) 490px;
      align-items: center;
      width: min(100%, var(--wp--preset--layout--content-max));
      height: 300px;
      padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--10)
        var(--wp--preset--spacing--10) 0;
      margin: var(--wp--preset--spacing--120) auto 0;
      border-radius: var(--wp--preset--radius--large);
    }

    .p-top-company__recruit-body {
      grid-row: 2;
      grid-column: 1;
    }

    .p-top-company__recruit-image {
      grid-row: 1 / 5;
      grid-column: 2;
      height: 280px;
      aspect-ratio: auto;
      margin-top: 0;
    }

    .p-top-company__recruit-button {
      grid-row: 3;
      grid-column: 1;
      margin: var(--wp--preset--spacing--20) 0 0; /* Figma: 文の下 35px（行ボックスの余白 15px を引く） */
      text-align: center;
    }

    .p-top-news__inner {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 700px;
      grid-gap: 0;
      gap: 0;
      align-items: start;
    }

    .p-top-news__heading {
      justify-content: flex-start;
    }

    .p-top-farm__hand {
      left: -156px;
    }
  }
}