/** Shopify CDN: Minification failed

Line 793:0 Unexpected "}"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:t-banner (INDEX:45) */
.t-banner__box { position: relative; display: grid; place-items: center; min-height: 360px; padding: 64px 24px; color: #fff; }
.t-banner__media { position: absolute; inset: 0; }
.t-banner__media img, .t-banner__media .t-placeholder { width: 100%; height: 100%; object-fit: cover; }
.t-banner__media::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,var(--t-banner-overlay)); }
.t-banner__body { position: relative; z-index: 1; }
.t-banner .t-heading__lead, .t-banner .t-heading__en { color: inherit; }
.t-banner .t-button--fill { background: #fff; color: #222; border-color: #fff; }
.t-banner .t-button--outline { color: #fff; border-color: #fff; }
/* END_SECTION:t-banner */

/* START_SECTION:t-cards (INDEX:46) */
.t-cards__item { display: grid; }
.t-cards__link { display: grid; gap: inherit; transition: opacity .2s; }
.t-cards__link:hover { opacity: .75; }
.t-cards__item, .t-cards__link { gap: 20px; align-content: start; }
.t-cards--line .t-cards__item { padding: 32px; border: 1px solid var(--t-line); border-radius: var(--t-radius-card); }
.t-cards--fill .t-cards__item { padding: 32px; background: var(--t-surface); border-radius: var(--t-radius-card); }
.t-cards__body { display: grid; gap: 12px; }
.t-cards__label { font-family: var(--t-font-en); font-size: var(--t-small); letter-spacing: .1em; color: var(--t-accent); }
.t-cards__title { font-size: var(--t-h3); }
.t-cards__text { color: var(--t-sub); font-size: 15px; }
@media (max-width: 1079px) { .t-cards--line .t-cards__item, .t-cards--fill .t-cards__item { padding: 24px; } }
/* END_SECTION:t-cards */

/* START_SECTION:t-faq (INDEX:47) */
.t-faq__list { border-top: 1px solid var(--t-line); }
.t-faq__item { border-bottom: 1px solid var(--t-line); }
.t-faq__q { display: grid; grid-template-columns: auto 1fr 20px; gap: 16px; align-items: center; padding: 24px 0; cursor: pointer; list-style: none; font-weight: 500; }
.t-faq__q::-webkit-details-marker { display: none; }
.t-faq__q svg { width: 20px; height: 20px; transition: transform .25s; }
.t-faq__item[open] .t-faq__q svg { transform: rotate(45deg); }
.t-faq__a { display: grid; grid-template-columns: auto 1fr; gap: 16px; padding: 0 36px 28px 0; color: var(--t-sub); }
.t-faq__mark { font-family: var(--t-font-en); font-size: 18px; color: var(--t-accent); line-height: 1.5; }
/* END_SECTION:t-faq */

/* START_SECTION:t-featured-products (INDEX:48) */
.t-featured .t-grid { row-gap: calc(var(--t-gap) * 1.6); }
/* END_SECTION:t-featured-products */

/* START_SECTION:t-footer (INDEX:49) */
.t-footer__cols { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 40px; }
.t-footer__logo { display: inline-block; margin-bottom: 20px; font-family: var(--t-font-heading); font-size: 20px; }
.t-footer__title { margin-bottom: 16px; font-weight: 700; }
.t-footer__links { display: grid; gap: 10px; font-size: var(--t-small); }
.t-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 56px; padding-top: 24px; border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent); font-size: 12px; }
.t-footer__policies { display: flex; flex-wrap: wrap; gap: 20px; }
@media (max-width: 1079px) { .t-footer__cols { grid-template-columns: 1fr; gap: 32px; } }
/* END_SECTION:t-footer */

/* START_SECTION:t-header (INDEX:50) */
.t-header { position: relative; z-index: 20; border-bottom: 1px solid var(--t-line); }
.t-header--sticky { position: sticky; top: 0; }
.t-header__inner { display: flex; align-items: center; gap: 40px; min-height: var(--t-header-h); }
.t-header__logo img { height: auto; max-width: 100%; }
.t-header__shop { font-family: var(--t-font-heading); font-size: 20px; font-weight: var(--t-heading-weight); }
.t-header__nav { margin-left: auto; }
.t-header__menu { display: flex; gap: 32px; font-size: 15px; }
.t-header__menu a[aria-current] { color: var(--t-accent); }
.t-header__icons { display: flex; align-items: center; gap: 18px; margin-left: 8px; }
.t-header__icon { position: relative; display: inline-flex; width: 24px; height: 24px; }
.t-header__icon svg { width: 100%; height: 100%; }
.t-header__count { position: absolute; top: -6px; right: -8px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--t-primary); color: var(--t-primary-text); font-size: 10px; line-height: 16px; text-align: center; }
.t-header__burger { position: relative; width: 28px; height: 28px; padding: 0; border: 0; background: none; cursor: pointer; }
.t-header__burger span, .t-header__burger::before, .t-header__burger::after { content: ""; position: absolute; left: 3px; right: 3px; height: 1.5px; background: currentColor; transition: transform .25s, opacity .25s; }
.t-header__burger::before { top: 7px; } .t-header__burger span { top: 13px; } .t-header__burger::after { top: 19px; }
.t-header__burger[aria-expanded="true"]::before { transform: translateY(6px) rotate(45deg); }
.t-header__burger[aria-expanded="true"] span { opacity: 0; }
.t-header__burger[aria-expanded="true"]::after { transform: translateY(-6px) rotate(-45deg); }
.t-header__drawer { position: fixed; inset: var(--t-header-h) 0 0; padding: 24px var(--t-margin); background: var(--t-bg); overflow-y: auto; transform: translateX(100%); transition: transform .3s; }
.t-header__drawer[data-open] { transform: none; }
.t-header__drawer li a { display: block; padding: 16px 0; border-bottom: 1px solid var(--t-line); }
.t-header__child a { padding-left: 1em; font-size: var(--t-small); }
.t-lock { overflow: hidden; }
@media (max-width: 1079px) { .t-header__inner { gap: 16px; } .t-header__icons { margin-left: auto; gap: 14px; } }
/* END_SECTION:t-header */

/* START_SECTION:t-hero (INDEX:51) */
.t-hero { position: relative; display: grid; min-height: var(--t-hero-h); color: #fff; overflow: hidden; }
.t-hero__media { position: absolute; inset: 0; }
.t-hero__media picture, .t-hero__media img, .t-hero__media .t-placeholder { width: 100%; height: 100%; object-fit: cover; }
.t-hero__media::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,var(--t-hero-overlay)); }
.t-hero__content { position: relative; z-index: 1; display: flex; padding-block: 64px; }
.t-hero--left-bottom .t-hero__content { align-items: flex-end; }
.t-hero--left-center .t-hero__content { align-items: center; }
.t-hero--center .t-hero__content { align-items: center; justify-content: center; text-align: center; }
.t-hero--right-bottom .t-hero__content { align-items: flex-end; justify-content: flex-end; text-align: right; }
.t-hero__text { display: grid; gap: 20px; max-width: 720px; }
.t-hero__en { font-family: var(--t-font-en); font-size: var(--t-en); letter-spacing: .14em; }
.t-hero__title { font-size: var(--t-h1); line-height: 1.35; }
@media (max-width: 1079px) { .t-hero { min-height: var(--t-hero-h-sp); } .t-hero__content { padding-block: 40px; } }
/* END_SECTION:t-hero */

/* START_SECTION:t-hhf-company (INDEX:52) */
/* 前のセクションに重ねる（楕円の上の部分を、前の帯の写真の下にもぐらせる） */
.t-hhf-company { margin-top: calc(var(--overlap) * -1); }
.t-hhf-company__panel { position: relative; isolation: isolate; container-type: inline-size; padding: 340px 0 89px; overflow: hidden; }
.t-hhf-company__panel::before,
.t-hhf-company__panel::after { content: ""; position: absolute; z-index: -2; left: 0; right: 0; }
.t-hhf-company__panel::before { top: 0; height: 491px; border-radius: 50%; background: var(--t-surface); }
.t-hhf-company__panel::after { top: 245.5px; bottom: 0; background: linear-gradient(var(--t-surface) 1181.5px, var(--t-bg) 1795.5px); }
/* 山は左端からはみ出す絵なので、画面幅の割合で伸ばす（wide-screen.md。1440 は Figma どおり） */
.t-hhf-company__mountain { position: absolute; z-index: -1; top: 1158px; left: calc(-103 / 1440 * 100cqw); width: calc(1445 / 1440 * 100cqw); height: auto; aspect-ratio: 1445 / 532; max-width: none; }
.t-hhf-company__inner { display: grid; grid-template-columns: 535px 540px; justify-content: space-between; align-items: start; max-width: 1240px; margin: 0 auto; }
.t-hhf-company__col { display: flex; flex-direction: column; align-items: stretch; }
.t-hhf-company__col .t-hhf-label { line-height: 29px; }
.t-section .t-hhf-company__heading { margin-top: 26px; font-size: 48px; line-height: 61.2px; font-weight: 700; letter-spacing: 0; color: var(--t-dark); }
.t-hhf-company__table { margin: 0; font-size: 20px; line-height: 1.5; font-weight: 500; letter-spacing: 2.2px; color: var(--t-dark); }
.t-hhf-company__table--info { margin-top: 52px; }
.t-hhf-company__col--right { padding-top: 59px; }
.t-hhf-company__photo { width: 540px; height: 434px; }
.t-hhf-company__photo img { object-position: 65% 50%; }
.t-hhf-company__table--history { width: 535px; margin-top: 124px; }
/* 表：行の下に赤い点線（直径 3px・11.09px おき） */
.t-hhf-company__row { display: grid; grid-template-columns: 149px minmax(0, 1fr); align-items: start; padding: 24px 0 23px 30px; background: radial-gradient(circle, var(--t-line) 1.5px, transparent 1.6px) 0 100% / 11.09px 3px repeat-x; }
.t-hhf-company__table .t-hhf-company__row:first-child { background-image: radial-gradient(circle, var(--t-line) 1.5px, transparent 1.6px), radial-gradient(circle, var(--t-line) 1.5px, transparent 1.6px); background-position: 0 0, 0 100%; background-size: 11.09px 3px; background-repeat: repeat-x; }
.t-hhf-company__row dt, .t-hhf-company__row dd { margin: 0; }
.t-hhf-company__row dd { line-height: 34px; margin-top: -2px; }
.t-hhf-company__map { position: relative; max-width: 1240px; height: 600px; margin: 148px auto 0; border-radius: 20px; overflow: hidden; background: color-mix(in srgb, var(--t-sub) 22%, var(--t-bg)); }
.t-hhf-company__map iframe { display: block; width: 100%; height: 100%; border: 0; }
.t-hhf-company__mapholder { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 34px; font-weight: 700; color: var(--t-text); }
@media (max-width: 1440px) {
  .t-hhf-company__inner, .t-hhf-company__map { margin-inline: 100px; }
}
@media (max-width: 1079px) {
  .t-hhf-company__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 60px; }
  .t-hhf-company__photo, .t-hhf-company__table--history { width: 100%; }
  .t-hhf-company__photo { height: auto; aspect-ratio: 540/434; }
}
@media (max-width: 1079px) {
  .t-hhf-company { margin-top: calc(var(--overlap) * -.4); }
  .t-hhf-company__panel { padding: 110px 0 40px; }
  .t-hhf-company__panel::before { height: 160px; }
  .t-hhf-company__panel::after { top: 80px; background: linear-gradient(var(--t-surface) 70%, var(--t-bg) 100%); }
  .t-hhf-company__mountain { top: auto; bottom: 280px; left: -20px; width: 120%; height: auto; }
  .t-hhf-company__inner { grid-template-columns: minmax(0, 1fr); row-gap: 40px; margin-inline: 20px; }
  .t-section .t-hhf-company__heading { margin-top: 8px; font-size: 28px; line-height: 1.4; }
  .t-hhf-company__table--info { margin-top: 24px; }
  .t-hhf-company__col--right { padding-top: 0; }
  .t-hhf-company__table--history { margin-top: 32px; }
  .t-hhf-company__table { font-size: 15px; letter-spacing: 1px; }
  .t-hhf-company__row { grid-template-columns: 96px minmax(0, 1fr); padding: 16px 0 15px 8px; }
  .t-hhf-company__row dd { line-height: 1.6; margin-top: 0; }
  .t-hhf-company__map { height: 320px; margin: 48px 20px 0; }
  .t-hhf-company__mapholder { font-size: 22px; }
}
/* END_SECTION:t-hhf-company */

/* START_SECTION:t-hhf-contact-form (INDEX:53) */
.t-hhf-contact-form__inner { padding: 173px 100px 168px; display: flex; flex-direction: column; align-items: center; gap: 64.5px; }
.t-hhf-contact-form__intro { font-weight: 500; font-size: 24px; line-height: 1.5; text-align: center; }
.t-hhf-contact-form__card { padding: 138px 113px 110px; }
.t-hhf-contact-form__form { max-width: 850px; margin-inline: auto; }
.t-hhf-contact-form__fields { display: flex; flex-direction: column; gap: 80px; }
.t-hhf-contact-form__field { display: flex; flex-direction: column; gap: 16px; }
.t-hhf-contact-form__label { display: flex; align-items: flex-start; gap: 9px; font-weight: 700; font-size: 20px; line-height: 20px; color: var(--t-dark); }
.t-hhf-contact-form__req {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 40px; height: 20px; margin-top: 2px; border-radius: 10px;
  background: var(--t-line); color: var(--t-bg);
  font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 1.32px; padding-left: 1.32px;
}
.t-hhf-contact-form__input {
  display: block; width: 100%; height: 80px; padding: 0 24px;
  background: var(--t-bg); border: 1px solid var(--t-dark); border-radius: 10px;
  font-size: 18px; line-height: 1.6; color: var(--t-text);
  -webkit-appearance: none; appearance: none;
}
.t-hhf-contact-form__input--body { height: 274px; padding: 20px 24px; resize: vertical; }
.t-hhf-contact-form__input:focus-visible { outline: 2px solid var(--t-accent); outline-offset: 2px; }
/* 同意の行（見本 sp-design/html/contact.css の ct-agree：入力欄の下 48・高さ 30・□22・18px 太字、送信ボタンまでの 141 は変えない）。
   押せる広さ 44 にするため行を 44 にし、上 41・下 56 で行の中心を見本と同じ位置に置く */
.t-hhf-contact-form__agree { position: relative; display: flex; align-items: center; gap: 12px; min-height: 44px; margin-top: 41px; }
/* 親から指すのは base.css の input[type="checkbox"] { width: auto; margin-right }（後から読まれる）より強くするため */
.t-hhf-contact-form__agree > .t-hhf-contact-form__agree-box { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--t-primary); cursor: pointer; }
.t-hhf-contact-form__agree-label { display: flex; align-items: center; font-size: 18px; font-weight: 700; line-height: 1.362; color: var(--t-dark); cursor: pointer; }
.t-hhf-contact-form__agree-label a { position: relative; z-index: 1; text-decoration: underline; text-underline-offset: 3px; }
.t-hhf-contact-form__agree-label .t-hhf-contact-form__req { margin: 0 0 0 9px; }
/* □ の周り 44×44 も押せるように（label の ::before を □ に重ねる。リンクは上に出す） */
.t-hhf-contact-form__agree-label::before { content: ""; position: absolute; top: 50%; left: -11px; width: 44px; height: 44px; transform: translateY(-50%); }
.t-hhf-contact-form__agree + .t-hhf-contact-form__submit { margin-top: 56px; }
.t-hhf-contact-form__submit { display: flex; justify-content: center; margin-top: 141px; }
.t-hhf-btn.t-hhf-contact-form__btn { min-width: 347px; padding-left: 54px; padding-right: 26px; gap: 66px; }
.t-hhf-contact-form__notice { margin-bottom: 48px; padding: 20px 24px; border-radius: 10px; font-size: 18px; line-height: 1.7; }
.t-hhf-contact-form__notice--success { background: var(--t-surface); }
.t-hhf-contact-form__notice--error { background: var(--t-surface-2); color: var(--t-line); }
.t-hhf-contact-form__notice--error ul { margin-top: 8px; padding-left: 1.2em; list-style: disc; }
@media (max-width: 1079px) {
  .t-hhf-contact-form__inner { padding: 64px 16px 80px; gap: 32px; }
  .t-hhf-contact-form__intro { font-size: 16px; }
  .t-hhf-contact-form__card { padding: 40px 20px; }
  .t-hhf-contact-form__fields { gap: 32px; }
  .t-hhf-contact-form__field { gap: 10px; }
  .t-hhf-contact-form__label { font-size: 16px; }
  .t-hhf-contact-form__input { height: 56px; font-size: 16px; padding: 0 16px; }
  .t-hhf-contact-form__input--body { height: 200px; padding: 12px 16px; }
  .t-hhf-contact-form__submit { margin-top: 48px; }
  .t-hhf-btn.t-hhf-contact-form__btn { min-width: 0; width: 100%; max-width: 320px; }
}
/* END_SECTION:t-hhf-contact-form */

/* START_SECTION:t-hhf-cows-cards (INDEX:54) */
/* 背景：上が白 → 701px で薄いピンク（Figma のグラデーション）。下は楕円（縦の半径 245.5）で丸く終わる */
.t-section.t-hhf-cows-cards--grad { background: linear-gradient(to bottom, var(--t-bg) -105px, var(--t-surface-2) 701px, var(--t-surface-2) 100%); }
.t-section.t-hhf-cows-cards {
  border-radius: 0 0 50% 50% / 0 0 245.5px 245.5px;
}
.t-hhf-cows-cards__list { display: flex; flex-direction: column; gap: 87px; width: 1240px; max-width: calc(100% - 40px); margin: 0 auto; }
.t-hhf-cows-cards__card {
  display: flex; align-items: flex-start; gap: 99px; min-height: var(--card-h);
  padding: 88px 70px; border-radius: 20px;
  /* Figma は白 60%（figma/effects/effects.md）。後ろのピンクのグラデーションが透ける */
  background: color-mix(in srgb, var(--t-bg) var(--card-a, 100%), transparent);
}
.t-hhf-cows-cards__card--right { flex-direction: row-reverse; justify-content: flex-end; gap: 98px; padding-left: 70.5px; }
.t-hhf-cows-cards__photo { flex: none; width: 505px; height: 634px; }
.t-hhf-cows-cards__body { display: flex; flex-direction: column; width: 496px; padding-top: 20px; }
.t-hhf-cows-cards__line { display: block; width: 496px; height: 12px; background: var(--t-accent); }
.t-hhf-cows-cards__line--line { background: var(--t-line); }
.t-hhf-cows-cards__heading { margin-top: 23px; font-size: 48px; line-height: 78px; font-weight: 700; letter-spacing: -0.07em; }
.t-hhf-cows-cards__card--left .t-hhf-cows-cards__heading { padding-left: 7px; }
.t-hhf-cows-cards__text { margin-top: 54px; width: 488px; font-size: 20px; line-height: 41px; font-weight: 500; text-align: left; }
.t-hhf-cows-cards__card--left .t-hhf-cows-cards__text { margin-left: 8px; }
.t-hhf-cows-cards__text p + p { margin-top: 41px; }
@media (max-width: 1079px) {
  .t-section.t-hhf-cows-cards { border-radius: 0 0 50% 50% / 0 0 80px 80px; }
  .t-hhf-cows-cards__list { gap: 32px; }
  .t-hhf-cows-cards__card, .t-hhf-cows-cards__card--right { flex-direction: column; gap: 24px; min-height: 0; padding: 24px 20px 32px; }
  .t-hhf-cows-cards__photo { width: 100%; height: auto; aspect-ratio: 505 / 634; }
  .t-hhf-cows-cards__body, .t-hhf-cows-cards__line, .t-hhf-cows-cards__text { width: 100%; }
  .t-hhf-cows-cards__body { padding-top: 0; }
  .t-hhf-cows-cards__line { height: 8px; }
  .t-hhf-cows-cards__heading { margin-top: 16px; font-size: 26px; line-height: 1.5; padding-left: 0 !important; }
  .t-hhf-cows-cards__text { margin: 20px 0 0 !important; font-size: 15px; line-height: 2; }
  .t-hhf-cows-cards__text p + p { margin-top: 1em; }
}
/* END_SECTION:t-hhf-cows-cards */

/* START_SECTION:t-hhf-cows-environment (INDEX:55) */
.t-hhf-cows-env__main { width: 1239px; height: 683px; max-width: calc(100% - 40px); margin: 0 auto; }
.t-hhf-cows-env__row { display: flex; gap: 115px; width: 1240px; max-width: calc(100% - 40px); margin: 117px auto 0; }
.t-hhf-cows-env__title { display: flex; flex-direction: column; gap: 58px; width: 534px; padding-top: 7px; flex: none; }
.t-hhf-cows-env__heading { font-size: 48px; line-height: 78px; font-weight: 700; letter-spacing: -0.07em; }
.t-hhf-cows-env__text { width: 488px; font-size: 20px; line-height: 41px; font-weight: 500; text-align: left; }
.t-hhf-cows-env__text p + p { margin-top: 41px; }
/* 重なる写真3枚（Figma の位置どおり。1440 幅の箱の中） */
/* 画面の幅いっぱいの箱。位置・大きさは 1440 幅の Figma の値を箱の幅の割合（cqw）にし、広い画面では配置と縦横比のまま大きくなる（1440 は Figma どおり） */
.t-hhf-cows-env__photos { position: relative; container-type: inline-size; width: 100%; aspect-ratio: 1440 / 1062; margin: 101px auto 0; }
.t-hhf-cows-env__photo { position: absolute; }
.t-hhf-cows-env__photo--a { left: 0; top: 0; width: calc(458 / 1440 * 100cqw); height: calc(538 / 1440 * 100cqw); border-radius: 0 20px 20px 0; }
.t-hhf-cows-env__photo--b { left: calc(576 / 1440 * 100cqw); top: calc(138 / 1440 * 100cqw); width: calc(761 / 1440 * 100cqw); height: calc(684 / 1440 * 100cqw); }
.t-hhf-cows-env__photo--c { left: calc(184 / 1440 * 100cqw); top: calc(662 / 1440 * 100cqw); width: calc(453 / 1440 * 100cqw); height: calc(400 / 1440 * 100cqw); }
@media (max-width: 1079px) {
  .t-hhf-cows-env__main { height: auto; aspect-ratio: 1239 / 683; }
  .t-hhf-cows-env__row { flex-direction: column; gap: 24px; margin-top: 40px; }
  .t-hhf-cows-env__title { width: 100%; gap: 20px; padding-top: 0; }
  .t-hhf-cows-env__title .t-hhf-bars { --w: 100%; --t: 8px; gap: 5px; }
  .t-hhf-cows-env__heading { font-size: 26px; line-height: 1.5; }
  .t-hhf-cows-env__text { width: 100%; font-size: 15px; line-height: 2; }
  .t-hhf-cows-env__text p + p { margin-top: 1em; }
  .t-hhf-cows-env__photos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; height: auto; aspect-ratio: auto; container-type: normal; margin-top: 40px; padding: 0 20px; }
  .t-hhf-cows-env__photo { position: static; width: auto; height: auto; }
  .t-hhf-cows-env__photo--a { aspect-ratio: 458 / 538; border-radius: 20px; }
  .t-hhf-cows-env__photo--b { grid-column: 1 / -1; grid-row: 1; aspect-ratio: 761 / 684; }
  .t-hhf-cows-env__photo--c { aspect-ratio: 458 / 538; }
}
/* END_SECTION:t-hhf-cows-environment */

/* START_SECTION:t-hhf-cows-flow (INDEX:56) */
/* 上の楕円＋その下の面のグラデーション（クリーム → 薄いピンク → 白）。
   楕円は画面の幅で、上に110はみ出して高さ720（ラフの 1440×491 だと見出しが縁に詰まって見えた。10/30）。面は楕円の中ほど（250）から */
.t-section.t-hhf-cows-flow { position: relative; isolation: isolate; }
.t-hhf-cows-flow::before {
  content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: -110px; height: 720px;
  border-radius: 50%; background: var(--t-surface);
}
.t-section.t-hhf-cows-flow--grad {
  background: linear-gradient(to bottom, transparent 250px, var(--t-surface) 250px, var(--t-surface) 772px, var(--t-surface-2) 2267px, var(--t-bg) 4089px);
}
.t-hhf-cows-flow__heading {
  margin-top: 168px; text-align: center; font-size: 48px; line-height: 78px; font-weight: 700; letter-spacing: -0.07em;
}
.t-hhf-cows-flow__steps { position: relative; width: 1239px; max-width: calc(100% - 40px); margin: 84px auto 0; padding-bottom: 62px; }

/* 赤い点線（Figma の Vector 26:705・26:706。工程の初期の位置に合わせてある） */
.t-hhf-cows-flow__dots { position: absolute; z-index: 0; }
.t-hhf-cows-flow__dotline {
  fill: none; stroke: var(--t-line); stroke-width: 11.8035; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 0.3 44.26;
}
/* 点の出し方：マスクの太い線を、スクロールで進んだ分（--p＝0〜1）だけ線の始まりから伸ばす。JS が動かないときは全部見える */
.t-hhf-cows-flow__reveal { fill: none; stroke: #fff; stroke-width: 60; }
.t-hhf-cows-flow.is-draw .t-hhf-cows-flow__reveal {
  stroke-dasharray: 1 2; stroke-dashoffset: calc(1 - var(--p, 0)); transition: stroke-dashoffset .5s ease-out;
}
.t-hhf-cows-flow.is-draw [data-reverse] .t-hhf-cows-flow__reveal { stroke-dashoffset: calc(var(--p, 0) - 1); }
.t-hhf-cows-flow.is-draw .is-done .t-hhf-cows-flow__reveal { stroke-dasharray: none; }   /* 出し切ったら端の点まで確実に見せる */
.t-hhf-cows-flow__dots--1 { left: 147.8px; top: 404.3px; width: 905.281px; height: 1629.66px; transform: rotate(1.95deg); }
.t-hhf-cows-flow__dots--2 { left: 87.1px; top: 2006.4px; width: 904.663px; height: 1326.81px; transform: rotate(2.42deg); }

/* 工程1つ：円と写真の横並び。円が写真に少し重なる（円が上） */
.t-hhf-cows-flow__step { position: relative; z-index: 1; display: flex; align-items: flex-start; margin-top: var(--space); padding-left: var(--indent); }
.t-hhf-cows-flow__step--right { flex-direction: row-reverse; justify-content: flex-end; }
.t-hhf-cows-flow__circle {
  position: relative; z-index: 1; flex: none; width: 376px; height: 376px; margin-top: var(--circle-y);
  border-radius: 50%; background: var(--t-bg);
}
.t-hhf-cows-flow__step--large .t-hhf-cows-flow__circle { width: 596px; height: 596px; }
.t-hhf-cows-flow__photo { flex: none; width: var(--photo-w); height: var(--photo-h); margin-top: var(--photo-y); }
.t-hhf-cows-flow__step--left .t-hhf-cows-flow__photo { margin-left: calc(var(--overlap) * -1); }
.t-hhf-cows-flow__step--right .t-hhf-cows-flow__circle { margin-left: calc(var(--overlap) * -1); }
.t-hhf-cows-flow__badge {
  position: absolute; left: -39px; top: 26px; width: 140.433px; height: 100.67px; background: var(--t-accent);
  -webkit-mask: var(--badge) no-repeat center / 100% 100%; mask: var(--badge) no-repeat center / 100% 100%;
}
.t-hhf-cows-flow__num {
  position: absolute; left: 5px; top: 59px; font-family: var(--t-font-label); font-weight: 600; font-size: 36px; line-height: 1.2; color: var(--t-bg);
}
.t-hhf-cows-flow__body { position: absolute; left: 102px; top: 81px; display: flex; flex-direction: column; gap: 33px; }
.t-hhf-cows-flow__step--large .t-hhf-cows-flow__badge { left: 11px; }
.t-hhf-cows-flow__step--large .t-hhf-cows-flow__num { left: 55px; }
.t-hhf-cows-flow__step--large .t-hhf-cows-flow__body { left: 116px; top: 136px; }
.t-hhf-cows-flow__title { font-size: 48px; line-height: 55.2px; font-weight: 700; white-space: nowrap; }
.t-hhf-cows-flow__text { width: var(--text-w); font-size: 20px; line-height: 41px; font-weight: 500; text-align: left; }

/* スマホだけの本文（円の中で改行する所を決めた文）。出し分けはスマホ用 CSS（t-hhf-sp-cows.css） */
.t-hhf-cows-flow__text--sp { display: none; }

@media (max-width: 1079px) {
  .t-hhf-cows-flow::before { height: 160px; top: 0; }
  .t-section.t-hhf-cows-flow--grad {
    background: linear-gradient(to bottom, transparent 80px, var(--t-surface) 80px, var(--t-surface) 400px, var(--t-surface-2) 1200px, var(--t-bg) 100%);
  }
  .t-hhf-cows-flow__heading { margin-top: 70px; font-size: 26px; line-height: 1.5; }
  .t-hhf-cows-flow__steps { margin-top: 32px; padding-bottom: 0; display: flex; flex-direction: column; gap: 40px; }
  .t-hhf-cows-flow__dots { display: none; }
  .t-hhf-cows-flow__step, .t-hhf-cows-flow__step--right { flex-direction: column; margin: 0; padding: 0; }
  .t-hhf-cows-flow__circle, .t-hhf-cows-flow__step--large .t-hhf-cows-flow__circle {
    width: 100%; height: auto; margin: 0; padding: 28px 20px 24px 20px; border-radius: 20px;
  }
  .t-hhf-cows-flow__step--right .t-hhf-cows-flow__circle { margin: 0; }
  .t-hhf-cows-flow__badge, .t-hhf-cows-flow__step--large .t-hhf-cows-flow__badge { left: -6px; top: -22px; width: 84px; height: 60px; }
  .t-hhf-cows-flow__num, .t-hhf-cows-flow__step--large .t-hhf-cows-flow__num { left: 20px; top: -4px; font-size: 22px; }
  .t-hhf-cows-flow__body, .t-hhf-cows-flow__step--large .t-hhf-cows-flow__body { position: static; gap: 12px; padding-top: 24px; }
  .t-hhf-cows-flow__title { font-size: 24px; line-height: 1.4; white-space: normal; }
  .t-hhf-cows-flow__text { width: 100%; font-size: 15px; line-height: 2; }
  .t-hhf-cows-flow__text br { display: none; }
  .t-hhf-cows-flow__photo { width: 100%; height: auto; aspect-ratio: 4 / 3; margin: 12px 0 0 !important; }
}
/* END_SECTION:t-hhf-cows-flow */

/* START_SECTION:t-hhf-footer (INDEX:57) */
.t-hhf-footer { margin-top: 89px; background: var(--t-surface); border-radius: 50px 50px 0 0; color: var(--t-dark); }
.t-hhf-footer__inner { max-width: 1240px; margin: 0 auto; padding: 99px 0 61px; }
.t-hhf-footer__top { display: flex; gap: clamp(40px, calc(100vw - 911px), 252px); padding: 0 70px; }
.t-hhf-footer__brand { width: 257px; flex: none; }
.t-hhf-footer__logo { display: block; width: 234px; }
.t-hhf-footer__logo img { display: block; width: 100%; height: auto; }
.t-hhf-footer__address { margin-top: 27px; font-weight: 700; font-size: 16px; line-height: 23.8px; }
.t-hhf-footer__address p { margin: 0; }
.t-hhf-footer__side { flex: 1; padding-top: 22px; }
.t-hhf-footer__nav { display: flex; gap: 74px; }
.t-hhf-footer__nav ul { display: grid; gap: 20px; margin: 0; padding: 0; list-style: none; }
.t-hhf-footer__nav li { line-height: 27px; }
.t-hhf-footer__nav a { font-weight: 700; font-size: 20px; color: inherit; text-decoration: none; }
.t-hhf-footer__actions { display: flex; align-items: center; gap: 85px; margin: 52px 0 0 29px; }
.t-hhf-footer__sns { display: flex; align-items: center; gap: 30px; }
.t-hhf-footer__sns a { display: inline-flex; }
.t-hhf-footer__bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 172px; padding: 35px 70px 0; border-top: 1px solid var(--t-dark); }
.t-hhf-footer__legal { display: flex; gap: 38px; margin: 0; padding: 0; list-style: none; }
.t-hhf-footer__legal a { font-size: 14px; color: inherit; text-decoration: none; }
.t-hhf-footer__copy { margin: 0 0 0 auto; font-size: 16px; }
@media (max-width: 1079px) {
  .t-hhf-footer { margin-top: 48px; border-radius: 28px 28px 0 0; }
  .t-hhf-footer__inner { padding: 56px var(--t-margin) 32px; }
  .t-hhf-footer__top { flex-direction: column; gap: 40px; padding: 0; }
  .t-hhf-footer__nav { gap: 32px; } .t-hhf-footer__nav a { font-size: 16px; }
  .t-hhf-footer__actions { flex-wrap: wrap; gap: 24px; margin: 32px 0 0; }
  .t-hhf-footer__bottom { flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 48px; padding: 24px 0 0; }
  .t-hhf-footer__legal { flex-wrap: wrap; gap: 16px; }
  .t-hhf-footer__copy { margin: 0; }
}
/* END_SECTION:t-hhf-footer */

/* START_SECTION:t-hhf-header (INDEX:58) */
.t-hhf-header { position: relative; z-index: 30; display: flex; align-items: flex-start; height: 139px; background: var(--t-bg); }
.t-hhf-header--overlay { position: absolute; top: 0; left: 0; right: 0; background: transparent; }
.t-hhf-header__logo { display: block; width: 396px; flex: none; }
.t-hhf-header__logo img { display: block; width: 100%; height: auto; }
.t-hhf-header__shop { display: block; padding: 40px 26px; font-weight: 700; font-size: 24px; }
/* 店名は Online Shop のボタンから 43px 左（Figma 共通/ヘッダー/PC：店名の右端 1004・ボタンの左端 1047）。右の固定ボタンに合わせて右から置くので、画面の幅が変わっても間が詰まらない
   436px ＝ 右の余白 34 ＋ メニューの丸 70 ＋ 間 20 ＋ Online Shop 269 ＋ 店名との間 43 */
.t-hhf-header__name { position: absolute; right: 436px; top: 41px; width: 258px; }
.t-hhf-header__shopbtn { min-width: 269px; justify-content: space-between; }
/* ロゴとぶつかる幅（〜1130px）では店名を出さない（ロゴの中にも店名がある） */
@media (max-width: 1079px) { .t-hhf-header__name { display: none; } }
.t-hhf-header__name img { display: block; width: 100%; height: auto; }
.t-hhf-header__actions { position: fixed; top: 34px; right: 34px; z-index: 50; display: flex; gap: 20px; }
/* 右の Online Shop とメニューの丸はスクロールしても残る（figma/motion/motion.md「固定」） */
.t-hhf-header__shopbtn { display: inline-flex; align-items: center; gap: 16px; height: 70px; padding: 0 26px 0 26px; border-radius: 45px; background: var(--t-primary); color: var(--t-primary-text); font-family: var(--t-font-en); font-weight: 500; font-size: 16px; letter-spacing: .15em; text-decoration: none; }
.t-hhf-header__arrow { display: inline-flex; align-items: center; justify-content: center; width: 31px; height: 30px; border-radius: 50%; background: var(--t-primary-text); color: var(--t-primary); }
.t-hhf-header__menubtn { position: relative; width: 70px; height: 70px; padding: 0; border: 0; border-radius: 50%; background: var(--t-primary); cursor: pointer; }
.t-hhf-header__menubtn span, .t-hhf-header__menubtn::before, .t-hhf-header__menubtn::after { content: ""; position: absolute; left: 18px; right: 18px; height: 3px; background: var(--t-primary-text); transition: transform .25s, opacity .25s; }
.t-hhf-header__menubtn::before { top: 25px; } .t-hhf-header__menubtn span { top: 34px; } .t-hhf-header__menubtn::after { top: 43px; }
.t-hhf-header__menubtn[aria-expanded="true"]::before { transform: translateY(9px) rotate(45deg); }
.t-hhf-header__menubtn[aria-expanded="true"] span { opacity: 0; }
.t-hhf-header__menubtn[aria-expanded="true"]::after { transform: translateY(-9px) rotate(-45deg); }
/* 全画面メニュー（figma/frames/menu-pc.png・1440×950。左に写真の板、右に2列の項目。開く時 0.3s ease-out でふわっと） */
.t-lock { overflow: hidden; }
.t-hhf-menu { position: fixed; inset: 0; z-index: 60; display: flex; background: var(--t-bg); overflow-y: auto; opacity: 0; visibility: hidden; transition: opacity .45s ease-out, visibility 0s linear .45s; }
.t-hhf-menu[data-open] { opacity: 1; visibility: visible; transition: opacity .6s cubic-bezier(.22, 1, .36, 1), visibility 0s; }
/* ふわっと：写真は少し左から、項目は少し下から、順に浮かぶ（閉じるときは一緒に消える） */
.t-hhf-menu__photo, .t-hhf-menu__col > li, .t-hhf-menu__shop, .t-hhf-menu__sns { opacity: 0; transition: opacity .3s ease-out, transform .3s ease-out; }
.t-hhf-menu__photo { transform: translateX(-24px); }
.t-hhf-menu__col > li, .t-hhf-menu__shop, .t-hhf-menu__sns { transform: translateY(14px); }
.t-hhf-menu[data-open] .t-hhf-menu__photo, .t-hhf-menu[data-open] .t-hhf-menu__col > li, .t-hhf-menu[data-open] .t-hhf-menu__shop, .t-hhf-menu[data-open] .t-hhf-menu__sns { opacity: 1; transform: none; transition: opacity .8s cubic-bezier(.22, 1, .36, 1) var(--t-hhf-d, .1s), transform .9s cubic-bezier(.22, 1, .36, 1) var(--t-hhf-d, .1s); }
.t-hhf-menu__col > li:nth-child(1) { --t-hhf-d: .15s; } .t-hhf-menu__col > li:nth-child(2) { --t-hhf-d: .21s; }
.t-hhf-menu__col > li:nth-child(3) { --t-hhf-d: .27s; } .t-hhf-menu__col > li:nth-child(4) { --t-hhf-d: .33s; }
.t-hhf-menu__col > li:nth-child(n+5) { --t-hhf-d: .39s; }
.t-hhf-menu__col--2 > li:nth-child(1) { --t-hhf-d: .24s; } .t-hhf-menu__col--2 > li:nth-child(2) { --t-hhf-d: .30s; }
.t-hhf-menu__col--2 > li:nth-child(3) { --t-hhf-d: .36s; } .t-hhf-menu__col--2 > li:nth-child(n+4) { --t-hhf-d: .42s; }
.t-hhf-menu__shop, .t-hhf-menu__sns { --t-hhf-d: .48s; }
.t-hhf-menu__photo { position: relative; flex: none; width: calc(671 / 1440 * 100%); min-height: 100%; overflow: hidden; border-radius: 0 20px 20px 0; background: var(--t-dark); }
.t-hhf-menu__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 69% 50%; }
.t-hhf-menu__catch { position: absolute; top: 33px; left: 51px; display: flex; flex-direction: row-reverse; gap: 29px; margin: 0; }
.t-hhf-menu__catch span { writing-mode: vertical-rl; font-family: var(--t-font-catch); font-weight: 600; font-size: 48px; line-height: 48px; letter-spacing: 8px; color: var(--t-dark); }
.t-hhf-menu__logo { position: absolute; left: 57px; bottom: 68px; width: 200px; }
.t-hhf-menu__logo img { display: block; width: 100%; height: auto; }
/* 項目のまとまりは右の白い面の上下左右の中央（画面が広くても狭くても真ん中。列の間は Figma の 74px を上限に縮む） */
.t-hhf-menu__body { position: relative; flex: 1; min-width: 0; padding: 110px 55px 80px; display: grid; grid-template-columns: max-content max-content; column-gap: clamp(40px, 5.2vw, 74px); justify-content: center; align-content: center; }
.t-hhf-menu__nav { display: contents; }
.t-hhf-menu__col { display: flex; flex-direction: column; gap: 34px; margin: 0; padding: 0; list-style: none; }
.t-hhf-menu__col--2 { gap: 33px; }
.t-hhf-menu__col a { display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: var(--t-dark); white-space: nowrap; }
.t-hhf-menu__col--2 a { gap: 5px; }
.t-hhf-menu__label { font-family: var(--t-font-label), var(--t-font-body); font-weight: 600; font-size: 10px; line-height: 1.2; color: var(--t-sub); }
.t-hhf-menu__title { font-family: var(--t-font-body); font-weight: 700; font-size: 20px; line-height: 1.36; }
.t-hhf-menu__shop { grid-column: 1; grid-row: 2; justify-self: start; margin-top: 79px; white-space: nowrap; }
.t-hhf-menu__sns { grid-column: 2; grid-row: 2; display: flex; align-items: flex-end; gap: 40px; margin-top: 92px; align-self: start; }
.t-hhf-menu__sns a { display: block; }
.t-hhf-menu__sns svg { display: block; }
.t-hhf-menu__close { position: absolute; top: 54px; right: 55px; padding: 0; border: 0; background: none; color: var(--t-primary); cursor: pointer; }
.t-hhf-menu__close svg { display: block; }
@media (hover: hover) {
  .t-hhf-menu__col a:hover .t-hhf-menu__title { color: var(--t-primary); }
}
@media (prefers-reduced-motion: reduce) { .t-hhf-menu, .t-hhf-menu[data-open], .t-hhf-menu__photo, .t-hhf-menu__col > li, .t-hhf-menu__shop, .t-hhf-menu__sns { transition: none !important; transform: none !important; } }
@media (max-width: 1079px) {
  .t-hhf-header { height: 72px; }
  .t-hhf-header__logo { width: 180px; }
  .t-hhf-header__actions { top: 12px; right: 12px; gap: 8px; }
  .t-hhf-header__shopbtn { height: 48px; min-width: 0; padding: 0 14px; gap: 8px; }
  .t-hhf-header__shoplabel, .t-hhf-header__arrow { display: none; }
  .t-hhf-header__menubtn { width: 48px; height: 48px; }
  .t-hhf-header__menubtn span, .t-hhf-header__menubtn::before, .t-hhf-header__menubtn::after { left: 12px; right: 12px; height: 2px; }
  .t-hhf-header__menubtn::before { top: 17px; } .t-hhf-header__menubtn span { top: 23px; } .t-hhf-header__menubtn::after { top: 29px; }
  .t-hhf-header__menubtn[aria-expanded="true"]::before { transform: translateY(6px) rotate(45deg); }
  .t-hhf-header__menubtn[aria-expanded="true"]::after { transform: translateY(-6px) rotate(-45deg); }
  /* スマホのメニュー：Figma に無いので Claude が決めた（写真の板は外し、1列に並べる） */
  .t-hhf-menu__photo { display: none; }
  .t-hhf-menu__body { padding: 96px 24px 48px; grid-template-columns: 1fr; row-gap: 26px; }
  .t-hhf-menu__col, .t-hhf-menu__col--2 { gap: 26px; }
  .t-hhf-menu__shop { grid-row: auto; margin-top: 14px; }
  .t-hhf-menu__sns { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .t-hhf-menu__close { top: 28px; right: 24px; }
}
/* END_SECTION:t-hhf-header */

/* START_SECTION:t-hhf-heading-bars (INDEX:59) */
.t-section.t-hhf-heading-bars-section { padding-top: calc(81px + var(--t-pt)); padding-bottom: calc(86px + var(--t-pb)); }
@media (max-width: 1079px) {
  .t-section.t-hhf-heading-bars-section { padding-top: calc(40px + var(--t-pt)); padding-bottom: calc(40px + var(--t-pb)); }
}
/* END_SECTION:t-hhf-heading-bars */

/* START_SECTION:t-hhf-kodawari-story (INDEX:60) */
/* 白い円は丸ごと見せる飾り。1440 の舞台を画面の中央に置き、切るのは画面の端だけ（舞台の端では切らない）。
   - 1440 より広い：舞台の外にも円が出て、まるい形がそのまま見える。端で切れる写真は画面の端まで伸ばす
   - 1280〜1440：大きさはそのまま（Figma の 1px）、狭くなるほど画面の端で円が少しずつ切れていく
   - 1280 より狭い：1280 の見え方を保って全体（文字も）を同じ比で縮める（文が円からはみ出さない）
   --u：Figma の 1px。--bleed：1440 より広いとき、舞台の端から画面の端までの幅 */
.t-hhf-kodawari-story { --u: min(1px, calc(100vw / 1280)); --bleed: max(0px, calc((100vw - 1440px) / 2)); }
/* クリームの面：上は楕円（.t-hhf-arch）、下はピンク寄りのクリーム→白（Figma Rectangle 55 のグラデーションを面の高さに直した位置） */
.t-hhf-kodawari-story__bg {
  background: linear-gradient(180deg, var(--t-surface) 24.9%, var(--t-surface-2) 82.2%, var(--t-bg) 98.1%);
  padding-top: calc(78 * var(--u));
  padding-bottom: calc(218 * var(--u));
}
.t-hhf-kodawari-story__bg { overflow-x: clip; }
.t-hhf-kodawari-story__inner { position: relative; width: calc(1440 * var(--u)); margin-left: calc((100% - 1440 * var(--u)) / 2); }

.t-hhf-kodawari-story__story { position: relative; margin-top: calc(var(--space) * var(--u)); }
.t-hhf-kodawari-story__row { display: flex; align-items: flex-start; }
.t-hhf-kodawari-story__photo { flex: none; width: calc(var(--w) * var(--u)); height: calc(var(--h) * var(--u)); }
.t-hhf-kodawari-story__photo--bleed-r { width: calc(var(--w) * var(--u) + var(--bleed)); border-radius: 20px 0 0 20px; }
.t-hhf-kodawari-story__photo--bleed-l { width: calc(var(--w) * var(--u) + var(--bleed)); margin-left: calc(-1 * var(--bleed)); border-radius: 0 20px 20px 0; }
/* 白い円（Figma の Ellipse 29〜32）。楕円の面（.t-hhf-arch の z-index:-1）より下に敷く。
   Figma では半透明の白（塗りの不透明度 70%、循環だけ 80%。figma/effects/effects.md）。後ろのクリームや写真が透けて見える */
.t-hhf-kodawari-story__circle { position: absolute; z-index: -2; border-radius: 50%; background: color-mix(in srgb, var(--t-bg) var(--circle, 100%), transparent); }

/* 見出し（縦の短い2本線 11×54 ＋ 48px）と本文（20px・行の高さ 41px） */
.t-hhf-kodawari-story__copy { position: relative; }
.t-hhf-kodawari-story__head { display: flex; align-items: flex-start; gap: calc(23 * var(--u)); }
.t-hhf-kodawari-story__bars { --h: calc(54 * var(--u)); --t: calc(11 * var(--u)); --g: calc(10 * var(--u)); }
.t-hhf-kodawari-story__title { font-family: var(--t-font-body); font-weight: 700; font-size: calc(48 * var(--u)); line-height: 1.15; letter-spacing: 0; }
.t-hhf-kodawari-story__text { width: calc(418 * var(--u)); margin-top: calc(59 * var(--u)); font-weight: 500; font-size: calc(20 * var(--u)); line-height: 2.05; text-align: left; }
.t-hhf-kodawari-story__text p + p { margin-top: 2.05em; }

/* 型1 photo_text（飼育）。白い円は上端が楕円の面にかかるので、楕円より上（z-index:-1・DOM が後）に置いて丸ごと見せる（Figma 26:581 は楕円 26:580 の上） */
.t-hhf-kodawari-story__story--photo_text .t-hhf-kodawari-story__circle { z-index: -1; left: calc(681 * var(--u)); top: calc(-128 * var(--u)); width: calc(762 * var(--u)); aspect-ratio: 1; }
.t-hhf-kodawari-story__story--photo_text .t-hhf-kodawari-story__row--1 { gap: calc(140 * var(--u)); padding-left: calc(100 * var(--u)); }
.t-hhf-kodawari-story__story--photo_text .t-hhf-kodawari-story__copy { padding-top: calc(75 * var(--u)); }
.t-hhf-kodawari-story__story--photo_text .t-hhf-kodawari-story__row--2 { gap: calc(188 * var(--u)); padding-left: calc(296 * var(--u)); margin-top: calc(64 * var(--u)); }
.t-hhf-kodawari-story__story--photo_text .t-hhf-kodawari-story__p2 { margin-top: calc(88 * var(--u)); }

/* 型2 circle_left_wide（飼料） */
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__lead { position: relative; min-height: calc(762 * var(--u)); padding: calc(208 * var(--u)) 0 0 calc(170 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__circle { left: calc(-20 * var(--u)); top: 0; width: calc(762 * var(--u)); aspect-ratio: 1; }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__p1 { position: absolute; left: calc(713 * var(--u)); top: calc(65 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__row--2 { gap: calc(208 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__p3 { margin-top: calc(116 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__row--3 { gap: calc(190 * var(--u)); padding-left: calc(167 * var(--u)); margin-top: calc(44 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_wide .t-hhf-kodawari-story__p4 { margin-top: calc(108 * var(--u)); }

/* 型3 circle_right（流通） */
.t-hhf-kodawari-story__story--circle_right .t-hhf-kodawari-story__row--1 { padding-left: calc(100 * var(--u)); }
.t-hhf-kodawari-story__story--circle_right .t-hhf-kodawari-story__p1 { margin-top: calc(-33 * var(--u)); }
.t-hhf-kodawari-story__story--circle_right .t-hhf-kodawari-story__card { position: relative; flex: none; width: calc(762 * var(--u)); min-height: calc(762 * var(--u)); margin-left: calc(-60 * var(--u)); padding: calc(142 * var(--u)) 0 0 calc(180 * var(--u)); }
.t-hhf-kodawari-story__story--circle_right .t-hhf-kodawari-story__circle { inset: 0; }

/* 型4 circle_left_tall（循環）。白い円が写真の上に重なるので、写真はさらに下（z-index:-3） */
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__lead { position: relative; min-height: calc(902 * var(--u)); padding: calc(172 * var(--u)) 0 0 calc(173 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__circle { left: calc(-45 * var(--u)); top: 0; width: calc(818 * var(--u)); aspect-ratio: 1; }
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__p1 { position: absolute; z-index: -3; left: calc(591 * var(--u)); top: calc(200 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__row--2 { gap: calc(189 * var(--u)); padding-left: calc(60 * var(--u)); margin-top: calc(103 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__p3 { margin-top: calc(131 * var(--u)); }
.t-hhf-kodawari-story__story--circle_left_tall .t-hhf-kodawari-story__row--3 { padding-left: calc(308 * var(--u)); margin-top: calc(77 * var(--u)); }

/* スマホ（Figma に無いので最小限）：文を先に、写真は幅いっぱいで縦に積む。白い円は出さない */
@media (max-width: 1079px) {
  .t-hhf-kodawari-story__bg { padding: 48px 0 80px; }
  .t-hhf-kodawari-story__inner { width: auto; margin-left: 0; }
  .t-hhf-kodawari-story__story { display: flex; flex-direction: column; gap: 20px; padding-inline: 20px; margin-top: 0; }
  .t-hhf-kodawari-story__story + .t-hhf-kodawari-story__story { margin-top: 64px; }
  .t-hhf-kodawari-story .t-hhf-kodawari-story__row,
  .t-hhf-kodawari-story .t-hhf-kodawari-story__lead,
  .t-hhf-kodawari-story .t-hhf-kodawari-story__card { display: flex; flex-direction: column; gap: 20px; width: auto; min-height: 0; padding: 0; margin: 0; }
  .t-hhf-kodawari-story .t-hhf-kodawari-story__circle { display: none; }
  .t-hhf-kodawari-story .t-hhf-kodawari-story__copy,
  .t-hhf-kodawari-story .t-hhf-kodawari-story__card { order: -1; padding: 0; }
  .t-hhf-kodawari-story .t-hhf-kodawari-story__photo { position: static; width: 100%; height: auto; aspect-ratio: var(--w) / var(--h); margin: 0; border-radius: 12px; }
  .t-hhf-kodawari-story__head { gap: 14px; }
  .t-hhf-kodawari-story__bars { --h: 36px; --t: 7px; --g: 6px; }
  .t-hhf-kodawari-story__title { font-size: 30px; line-height: 36px; }
  .t-hhf-kodawari-story__text { width: auto; margin-top: 20px; font-size: 16px; line-height: 1.9; }
  .t-hhf-kodawari-story__text p + p { margin-top: 1.9em; }
}
/* END_SECTION:t-hhf-kodawari-story */

/* START_SECTION:t-hhf-page-hero (INDEX:61) */
.t-hhf-page-hero__photo { height: var(--photo-h); overflow: hidden; }
.t-hhf-page-hero__photo img, .t-hhf-page-hero__photo .t-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: var(--photo-pos, center); }
.t-hhf-page-hero__title { display: flex; gap: 51px; padding-left: 100px; }
.t-hhf-page-hero__title .t-hhf-bars { --h: var(--bar-h); --t: 12.375px; }
.t-hhf-page-hero__text { display: flex; flex-direction: column; gap: var(--text-gap, 26px); padding-top: 118px; }
.t-hhf-page-hero__eyebrow--en { font-family: var(--t-font-label); font-weight: 600; font-size: 24px; line-height: 1.2; color: var(--t-accent); }
.t-hhf-page-hero__eyebrow--ja { font-weight: 700; font-size: 24px; line-height: 1.4; color: var(--t-dark); }
.t-hhf-page-hero__heading { font-size: var(--title-size); line-height: var(--title-lh); font-weight: 700; }
@media (max-width: 1079px) {
  .t-hhf-page-hero__photo { height: min(var(--photo-h), 60vw); }
  .t-hhf-page-hero__title { gap: 20px; padding-left: 20px; padding-right: 20px; }
  .t-hhf-page-hero__title .t-hhf-bars { --h: calc(var(--bar-h) * .5); --t: 6px; --g: 4px; }
  .t-hhf-page-hero__text { gap: 10px; padding-top: 40px; }
  .t-hhf-page-hero__eyebrow--en, .t-hhf-page-hero__eyebrow--ja { font-size: 16px; }
  .t-hhf-page-hero__heading { font-size: calc(var(--title-size) * .55); }
}
/* END_SECTION:t-hhf-page-hero */

/* START_SECTION:t-hhf-recruit-table (INDEX:62) */
.t-hhf-recruit-table__inner { padding: 112px 100px 168px; display: flex; flex-direction: column; align-items: center; gap: 44px; }
.t-hhf-recruit-table__head { display: flex; flex-direction: column; align-items: center; gap: 26px; text-align: center; }
.t-hhf-recruit-table__heading { font-weight: 700; font-size: 48px; line-height: 61.2px; color: var(--t-dark); letter-spacing: 0; }
.t-hhf-recruit-table__card { padding: 103px 117px 109px; }
.t-hhf-recruit-table__table { max-width: 842px; margin-inline: auto; }
/* 行の上の線：0〜229px が黒 3px（端丸）、229px〜右端が 1px。表の最後の線は __table の ::after（細い線）と ::before（太い線） */
.t-hhf-recruit-table__table { position: relative; }
.t-hhf-recruit-table__row, .t-hhf-recruit-table__table::after {
  background: linear-gradient(var(--t-dark), var(--t-dark)) 229px 0 / calc(100% - 229px) 1px no-repeat;
}
.t-hhf-recruit-table__row { position: relative; }
.t-hhf-recruit-table__row::before, .t-hhf-recruit-table__table::before {
  content: ""; position: absolute; left: 0; width: 229px; height: 3px; border-radius: 1.5px; background: var(--t-dark);
}
.t-hhf-recruit-table__row::before { top: 0; }
.t-hhf-recruit-table__table::before { bottom: 0; }
.t-hhf-recruit-table__table::after { content: ""; display: block; height: 3px; }
.t-hhf-recruit-table__row {
  display: grid; grid-template-columns: 225px 1fr; align-items: start;
  padding: 24px 0 21px 47px;
  font-weight: 500; font-size: 20px; line-height: 1.5; letter-spacing: 2.2px; color: var(--t-dark);
}
.t-hhf-recruit-table__desc { line-height: 34px; margin-top: -2px; }
.t-hhf-recruit-table__action { max-width: 842px; margin: 85px auto 0; display: flex; justify-content: flex-end; }
.t-hhf-recruit-table__notice { max-width: 842px; margin: 0 auto; text-align: center; font-weight: 500; font-size: 20px; line-height: 34px; letter-spacing: 2.2px; color: var(--t-dark); }
.t-hhf-recruit-table__action--notice { margin-top: 56px; justify-content: center; }
.t-hhf-btn.t-hhf-recruit-table__btn { min-width: 287px; padding-left: 76px; padding-right: 26px; gap: 76px; }
/* お知らせを出している間（Figma スマホ版 157:13・11/3。PC もスマホに合わせる）：見出し・白い箱・縁は無しで、クリームの面に文とボタンだけ。
   文は面の楕円の中心（上から 218px）の少し下から。表に戻す（チェックを外す）と元の白い箱に戻る */
.t-hhf-recruit-table--notice .t-hhf-recruit-table__inner { padding-top: 218px; gap: 0; }
.t-hhf-recruit-table--notice .t-hhf-card.t-hhf-recruit-table__card { background: transparent; border: 0; border-radius: 0; padding: 46px 0; }
.t-hhf-recruit-table--notice .t-hhf-recruit-table__action--notice { margin-top: 40px; }
/* 面は楕円の中心から下の端までで白へ薄まる（Figma 157:14：上から 23% まで面の色、下の端で白）。下で急に白へ切れないように */
.t-hhf-recruit-table--notice.t-hhf-panel::after { background: linear-gradient(to bottom, var(--panel, var(--t-surface-2)) 23%, var(--t-bg) 100%); }
@media (max-width: 1079px) {
  .t-hhf-recruit-table__inner { padding: 56px 16px 80px; gap: 28px; }
  .t-hhf-recruit-table__head { gap: 10px; }
  .t-hhf-recruit-table__heading { font-size: 28px; line-height: 1.4; }
  .t-hhf-recruit-table__card { padding: 32px 16px; }
  .t-hhf-recruit-table__row, .t-hhf-recruit-table__table::after { background-position: 96px 0; background-size: calc(100% - 96px) 1px; }
  .t-hhf-recruit-table__row::before, .t-hhf-recruit-table__table::before { width: 96px; }
  .t-hhf-recruit-table__row { grid-template-columns: 1fr; gap: 6px; padding: 16px 0 14px; font-size: 15px; letter-spacing: 1px; }
  .t-hhf-recruit-table__term { font-weight: 700; }
  .t-hhf-recruit-table__desc { line-height: 1.7; margin-top: 0; }
  .t-hhf-recruit-table__action { margin-top: 40px; justify-content: center; }
  .t-hhf-recruit-table__notice { font-size: 15px; line-height: 1.7; letter-spacing: 1px; }
  .t-hhf-recruit-table__action--notice { margin-top: 32px; }
  .t-hhf-btn.t-hhf-recruit-table__btn { min-width: 0; width: 100%; max-width: 300px; padding-left: 32px; gap: 20px; }
}
/* END_SECTION:t-hhf-recruit-table */

/* START_SECTION:t-hhf-top-gallery (INDEX:63) */
/* 楕円（1440×491）の面＋その中心から下はクリーム → 下に行くほど白 */
.t-hhf-top-gallery__panel { position: relative; isolation: isolate; padding: 167px 0 176px; }
.t-hhf-top-gallery__panel::before,
.t-hhf-top-gallery__panel::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; }
.t-hhf-top-gallery__panel::before { top: 0; height: 491px; border-radius: 50%; background: var(--t-surface); }
.t-hhf-top-gallery__panel::after { top: 245.5px; bottom: 0; background: linear-gradient(var(--t-surface) 243px, var(--t-bg) 864px); }
.t-hhf-top-gallery__viewer { display: block; margin-top: 70px; }
.t-hhf-top-gallery__stage { display: flex; align-items: center; justify-content: center; gap: 102px; }
.t-hhf-top-gallery__main { position: relative; width: 814px; height: 611px; flex: none; }
/* 写真は全部重ねておき、前の写真の上に次の写真をふわっと重ねる（下の写真は消さないので白い間が出ない） */
/* 出ていく写真は、次の写真が出きるまで不透明のまま下に残す */
.t-hhf-top-gallery__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 0s linear .8s, visibility 0s linear .8s; }
.t-hhf-top-gallery__slide.is-active { z-index: 1; opacity: 1; visibility: visible; transition: opacity .8s ease, visibility 0s; }
.t-hhf-top-gallery__slide img, .t-hhf-top-gallery__slide .t-placeholder { width: 100%; height: 100%; object-fit: cover; }
.t-hhf-top-gallery__slide[data-index="0"] img { object-position: 22% 53%; }
.t-hhf-top-gallery__arrow { flex: none; display: inline-flex; padding: 0; border: 0; background: none; color: var(--t-line); cursor: pointer; transition: opacity .3s ease-out; }
@media (hover: hover) { .t-hhf-top-gallery__arrow:hover { opacity: .6; } }
.t-hhf-top-gallery__thumbs { display: flex; flex-wrap: wrap; justify-content: center; gap: 26px; width: 814px; margin: 70px auto 0; }
.t-hhf-top-gallery__thumb { display: block; width: 79px; height: 79px; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: none; cursor: pointer; }
.t-hhf-top-gallery__thumb img, .t-hhf-top-gallery__thumb .t-placeholder { width: 100%; height: 100%; object-fit: cover; }
.t-hhf-top-gallery__thumb:focus-visible { outline: 3px solid var(--t-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .t-hhf-top-gallery__arrow, .t-hhf-top-gallery__slide, .t-hhf-top-gallery__slide.is-active { transition: none; } }
@media (max-width: 1079px) {
  .t-hhf-top-gallery__stage { gap: 24px; padding-inline: 20px; }
  .t-hhf-top-gallery__main { width: auto; flex: 1; max-width: 814px; height: auto; aspect-ratio: 814/611; }
}
@media (max-width: 1079px) {
  .t-hhf-top-gallery__panel { padding: 70px 0 80px; }
  .t-hhf-top-gallery__panel::before { height: 160px; }
  .t-hhf-top-gallery__panel::after { top: 80px; background: linear-gradient(var(--t-surface) 60%, var(--t-bg) 100%); }
  .t-hhf-top-gallery__viewer { margin-top: 32px; }
  .t-hhf-top-gallery__stage { gap: 10px; padding-inline: 10px; }
  .t-hhf-top-gallery__arrow svg { width: 18px; height: 26px; }
  .t-hhf-top-gallery__thumbs { width: auto; gap: 10px; margin: 24px 20px 0; }
  .t-hhf-top-gallery__thumb { width: 56px; height: 56px; border-radius: 8px; }
}
/* END_SECTION:t-hhf-top-gallery */

/* START_SECTION:t-hhf-top-hero (INDEX:64) */
.t-hhf-top-hero { position: relative; overflow: hidden; }
.t-hhf-top-hero__photo { height: var(--hero-h); }
.t-hhf-top-hero__photo img, .t-hhf-top-hero__photo .t-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: 45% 20%; }
.t-hhf-top-hero__catch {
  position: absolute; top: var(--catch-top); left: 50%; transform: translateX(-50%);
  writing-mode: vertical-rl; text-orientation: upright; white-space: nowrap; /* PC・SP とも1行なので、どの幅でも折り返さない */
  font-family: var(--t-font-catch); font-weight: 600; font-size: 48px; line-height: 56px; letter-spacing: 5.28px;
  color: var(--t-dark);
}
.t-section .t-hhf-top-hero__catch { font-family: var(--t-font-catch); font-weight: 600; color: var(--t-dark); }
@media (max-width: 1079px) {
  .t-hhf-top-hero__photo { height: min(var(--hero-h), 130vw); }
  .t-hhf-top-hero__catch { top: 90px; font-size: 32px; line-height: 40px; letter-spacing: 3px; }
}
/* END_SECTION:t-hhf-top-hero */

/* START_SECTION:t-hhf-top-instagram (INDEX:65) */
.t-section.t-hhf-top-instagram { padding-top: calc(133px + var(--t-pt)); padding-bottom: calc(395px + var(--t-pb)); }
.t-hhf-top-instagram__head { display: flex; flex-direction: column; align-items: center; gap: 26px; }
.t-hhf-top-instagram__head .t-hhf-label { line-height: 29px; }
.t-hhf-top-instagram__titlerow { display: grid; grid-template-columns: 110px minmax(0, 1fr) 110px; align-items: center; width: 680px; max-width: calc(100% - 40px); }
.t-hhf-top-instagram__titlerow .t-hhf-bars { --w: 110px; }
.t-section .t-hhf-top-instagram__heading { font-size: 48px; line-height: 61.2px; font-weight: 700; letter-spacing: 0; text-align: center; white-space: nowrap; }
.t-hhf-top-instagram__card {
  position: relative; max-width: 1240px; margin: 86px auto 0; padding: 122px 130px 95px;
  border-radius: 50px; background: var(--t-surface-2);
}
.t-hhf-top-instagram__grid { display: grid; grid-template-columns: repeat(3, 300px); gap: 40px; justify-content: center; }
.t-hhf-top-instagram__photo { width: 300px; height: 300px; }
.t-hhf-top-instagram__photo a { display: block; width: 100%; height: 100%; }
.t-hhf-top-instagram__photo img { object-position: 19% 4%; }
/* アプリの写真の並びは、手で入れる写真の格子と同じ幅（300×3＋間40×2）に収める */
.t-hhf-top-instagram__app { max-width: 980px; margin-inline: auto; }
/* Instafeed（Mintt Studio）の横スクロールの形（instafeed-shoppable）を、手で入れる写真と同じ 3列・正方形・角丸20px・9枚の格子に組み替える。
   アプリの設定（縦横比・カードの幅・件数）に関係なくこの見た目になるので、お客様のアカウントにつなぎ替えても崩れない。
   アプリの CSS は #insta-feed つき・!important があるので、こちらは .t-hhf-top-instagram__app を前に付けて勝つ */
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable { overflow: visible; }
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__nav { display: none !important; }
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__track {
  display: grid; grid-template-columns: repeat(3, minmax(0, 300px)); gap: 40px; justify-content: center;
  overflow: visible; padding: 0; mask-image: none; -webkit-mask-image: none; scroll-snap-type: none; touch-action: auto; user-select: auto;
}
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__track > li:not(.instafeed-shoppable__status):nth-child(n+10) { display: none; }
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__card { flex: none; width: auto; }
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__frame {
  aspect-ratio: 1 / 1 !important; border: 0; border-radius: 20px; background: var(--t-surface); box-shadow: none; transform: none; transition: opacity .3s ease-out;
}
.t-hhf-top-instagram__app #insta-feed .instafeed-shoppable .instafeed-shoppable__post-image { object-fit: cover !important; object-position: center !important; transform: none !important; transition: none !important; }
@media (hover: hover) {
  .t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__card:hover .instafeed-shoppable__frame { opacity: .7; transform: none; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) { .t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__frame { transition: none; } }
.t-hhf-top-instagram__foot { display: flex; justify-content: center; margin-top: 122px; }
.t-hhf-top-instagram__follow {
  position: absolute; left: 862px; bottom: 112px; width: 167px; height: 78px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--t-font-label); font-weight: 600; font-size: 32px; line-height: 1; color: var(--t-dark);
  white-space: nowrap; transform: rotate(-14.58deg);
}
.t-hhf-top-instagram__cow { position: absolute; left: 834px; bottom: -167px; width: 390px; height: 332px; display: flex; align-items: center; justify-content: center; pointer-events: none; }
/* Follow US と牛は面の下の端に合わせる（写真の数で面の高さが変わってもずれない） */
.t-hhf-top-instagram__cow img { width: 330px; height: auto; max-width: none; transform: rotate(19.23deg); }
@media (max-width: 1440px) { .t-hhf-top-instagram__card { margin-inline: 100px; } }
@media (max-width: 1079px) {
  .t-hhf-top-instagram__card { padding-inline: 40px; }
  .t-hhf-top-instagram__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
  .t-hhf-top-instagram__photo { width: auto; height: auto; aspect-ratio: 1/1; }
  .t-hhf-top-instagram__follow { left: auto; right: 210px; }
  .t-hhf-top-instagram__cow { left: auto; right: 16px; }
}
@media (max-width: 1079px) {
  .t-section.t-hhf-top-instagram { padding-top: calc(60px + var(--t-pt)); padding-bottom: calc(160px + var(--t-pb)); }
  .t-hhf-top-instagram__head { gap: 12px; }
  .t-hhf-top-instagram__titlerow { grid-template-columns: 50px minmax(0, 1fr) 50px; column-gap: 12px; }
  .t-hhf-top-instagram__titlerow .t-hhf-bars { --w: 50px; --t: 6px; --g: 4px; }
.t-section .t-hhf-top-instagram__heading { font-size: 26px; line-height: 1.5; }
  .t-hhf-top-instagram__card { margin: 40px 20px 0; padding: 24px 16px 100px; border-radius: 24px; }
  .t-hhf-top-instagram__grid { gap: 8px; }
  .t-hhf-photo.t-hhf-top-instagram__photo { border-radius: 10px; }
  .t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__track { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .t-hhf-top-instagram__app #insta-feed .instafeed-shoppable__frame { border-radius: 10px; }
  .t-hhf-top-instagram__foot { margin-top: 32px; }
  .t-hhf-top-instagram__follow { right: 110px; bottom: 30px; width: auto; height: auto; font-size: 18px; }
  .t-hhf-top-instagram__cow { right: 0; bottom: -80px; width: 140px; height: 120px; }
  .t-hhf-top-instagram__cow img { width: 120px; }
}
/* END_SECTION:t-hhf-top-instagram */

/* START_SECTION:t-hhf-top-intro (INDEX:66) */
.t-hhf-top-intro { overflow: hidden; }
.t-hhf-top-intro__top { position: relative; z-index: 1; container-type: inline-size; }
.t-hhf-top-intro__inner { max-width: 1440px; margin: 0 auto; padding: 142px 0 0 435px; }
.t-hhf-top-intro__text { width: 570px; display: flex; flex-direction: column; gap: 76px; }
.t-section .t-hhf-top-intro__heading { font-size: 64px; line-height: 108.8px; font-weight: 700; letter-spacing: 0; color: var(--t-accent); white-space: nowrap; }
.t-hhf-top-intro__body { font-size: 24px; line-height: 57px; font-weight: 700; letter-spacing: 2.64px; text-align: left; }
.t-hhf-top-intro__body p + p { margin-top: 57px; }
.t-hhf-photo.t-hhf-top-intro__photo { position: absolute; }
/* 3列（左の写真・文字・右の写真）の組みを、広い画面でも Figma の比率のまま画面の幅に合わせて広げる（coding/HTML制作/wide-screen.md W7。1440 は Figma どおり）。
   写真は位置・大きさ・縦横比ごと画面幅の割合（縦の位置は 1440 より広い画面で文字の高さの割合） */
.t-hhf-top-intro__photo--1 { left: calc(1116 / 1440 * 100cqw); top: calc(196 / 1440 * 100cqw); width: calc(270 / 1440 * 100cqw); height: calc(386 / 1440 * 100cqw); }
.t-hhf-top-intro__photo--2 { left: calc(-66 / 1440 * 100cqw); top: calc(694 / 1440 * 100cqw); width: calc(381 / 1440 * 100cqw); height: calc(258 / 1440 * 100cqw); }
.t-hhf-top-intro__photo--3 { left: calc(1166 / 1440 * 100cqw); top: calc(906 / 1440 * 100cqw); width: calc(312 / 1440 * 100cqw); height: calc(233 / 1440 * 100cqw); }
@media (min-width: 1440px) {
  /* 1440 より広い画面：3列（左の写真・文字・右の写真）を同じ伸び方にそろえる＝増えた幅の半分だけ大きくする（--k。文字は大きくしない）。
     文字の列は Figma の列の中心のまま広がる。写真は縦横比のまま、左右の2枚は画面の端に付けたまま、牛は Figma の中心の位置（画面幅の割合）に置く。
     写真の縦の位置は文字の高さ（列が広がると短くなる）に対する Figma の割合 */
  .t-hhf-top-intro__inner { --k: calc((1440px + 100cqw) / 2880); --w: calc(570 * var(--k)); position: relative; max-width: none;
    padding: 142px 0 0 calc(720 / 1440 * 100cqw - var(--w) / 2); }
  .t-hhf-top-intro__text { width: var(--w); }
  .t-hhf-top-intro__photo--1 { width: calc(270 * var(--k)); height: calc(386 * var(--k)); left: calc(1251 / 1440 * 100cqw - 135 * var(--k)); top: calc(196 / 1171 * 100%); }
  .t-hhf-top-intro__photo--2 { width: calc(381 * var(--k)); height: calc(258 * var(--k)); left: calc(-66 * var(--k)); top: calc(694 / 1171 * 100%); }
  .t-hhf-top-intro__photo--3 { width: calc(312 * var(--k)); height: calc(233 * var(--k)); left: calc(100cqw - 274 * var(--k)); top: calc(906 / 1171 * 100%); }
}
}
.t-hhf-top-intro__photo--1 img { object-position: 45% 80%; }
.t-hhf-top-intro__photo--3 img { object-position: 100% 50%; }

/* クリームの面：上 163px は白（楕円の中心まで）、そこから白い楕円（1440×491、面の上端から -83）の下半分でえぐれ、下に行くほど白へ */
.t-hhf-top-intro__panel {
  position: relative; isolation: isolate; margin-top: -116px;
  display: flex; flex-direction: column; gap: 166px; padding: 389px 0 166px;
  background: linear-gradient(var(--t-bg) 163px, var(--t-surface) 163px, var(--t-surface) 1894px, var(--t-bg) 2649px);
}
.t-hhf-top-intro__panel::before {
  content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: -83px; height: 491px;
  border-radius: 50%; background: var(--t-bg);
}
.t-hhf-top-intro__feature { display: grid; align-items: start; width: 100%; max-width: 1440px; margin: 0 auto; padding-left: 100px; }
.t-hhf-top-intro__feature--image_left { grid-template-columns: 612px 493px; column-gap: 140px; }
.t-hhf-top-intro__feature--image_right { grid-template-columns: 488px 488px; column-gap: 264px; }
.t-hhf-top-intro__feature--image_right .t-hhf-top-intro__fphoto { grid-column: 2; grid-row: 1; }
.t-hhf-top-intro__feature--image_right .t-hhf-top-intro__ftext { grid-column: 1; grid-row: 1 / span 2; }
.t-hhf-top-intro__fphoto { height: 894px; }
.t-hhf-top-intro__feature--image_right .t-hhf-top-intro__fphoto { height: 500px; }
.t-hhf-top-intro__feature--image_left .t-hhf-top-intro__fphoto img { object-position: 60% 37%; }
.t-hhf-top-intro__feature--image_right .t-hhf-top-intro__fphoto img { object-position: 15% 50%; }
.t-hhf-top-intro__fphoto2 { grid-column: 2; grid-row: 2; width: 455px; height: 353px; margin: 43px 0 0 -124px; }
.t-hhf-top-intro__fphoto2 img { object-position: 24% 88%; }
.t-hhf-top-intro__ftext { display: flex; flex-direction: column; align-items: flex-start; padding-top: 62px; }
.t-hhf-top-intro__ftext .t-hhf-bars { --w: 488px; }
.t-hhf-top-intro__fhead { display: flex; flex-direction: column; gap: 15px; margin-top: 54px; }
.t-hhf-top-intro__eyebrow { font-size: 24px; line-height: 33px; font-weight: 700; color: var(--t-dark); }
.t-section .t-hhf-top-intro__fheading { font-size: 48px; line-height: 78px; font-weight: 700; letter-spacing: -3.36px; white-space: nowrap; }
.t-hhf-top-intro__ftextbody { width: 488px; min-height: 123px; margin-top: 54px; font-size: 20px; line-height: 41px; font-weight: 500; text-align: left; }
.t-hhf-top-intro__ftextbody p + p { margin-top: 41px; }
.t-hhf-top-intro__btn { margin-top: 43px; }

/* 動画の枠：800×450（16:9）を中央、下のこだわりとの間 171px（並びの間 166＋5）。10/29 高橋さん「中央に・もう少し小さく」（Figma は 1040×586）。
   動画の分だけ面が高くなるので、クリーム → 白に変わる所も下げ、上の余白を下と同じ 171px に（面を持ち上げる。Figma は -116px）。
   動画は Figma どおり白い楕円（面の上から 408px で終わる）の下の端に 19px かぶせる（面の上から 389px。10/30 担当の指示で、かぶせない形から戻した） */
.t-hhf-top-intro__video { width: min(800px, 100%); aspect-ratio: 16 / 9; margin: 0 auto 5px; flex: none; background: #d9d9d9; } /* 動画が入るまでの灰色（Figma の仮の枠と同じ） */
.t-hhf-top-intro__video > .t-placeholder { background: transparent; }
.t-hhf-top-intro__panel--video {
  margin-top: -116px; padding-top: 389px; /* 面の位置は Figma どおり（本文の終わりから楕円の下の端まで 292px）。動画は楕円の下の端に 19px かぶる */
  background: linear-gradient(var(--t-bg) 163px, var(--t-surface) 163px, var(--t-surface) 2603px, var(--t-bg) 3293px);
}

/* 動画の枠を出さないとき（本番の動画が届くまで・11/3 担当）：こだわりの写真が白い楕円（面の上から 408px で終わる）にかぶらないよう、
   楕円の下の端から 80px あけて下げる（389 → 488）。クリームから白に変わる所も同じだけ下げる。動画の枠を出すと元の形に戻る */
@media (min-width: 1080px) {
  .t-hhf-top-intro__panel:not(.t-hhf-top-intro__panel--video) {
    padding-top: 488px;
    background: linear-gradient(var(--t-bg) 163px, var(--t-surface) 163px, var(--t-surface) 1993px, var(--t-bg) 2748px);
  }
}

@media (max-width: 1079px) {
  .t-hhf-top-intro__inner { padding: 60px 20px 0; display: flex; flex-direction: column; gap: 24px; }
  .t-hhf-top-intro__text { width: auto; gap: 32px; }
  .t-section .t-hhf-top-intro__heading { font-size: 32px; line-height: 1.6; white-space: normal; }
  .t-hhf-top-intro__body { font-size: 16px; line-height: 2.2; letter-spacing: .08em; }
  .t-hhf-top-intro__body p + p { margin-top: 1.6em; }
  .t-hhf-photo.t-hhf-top-intro__photo { position: static; width: 100%; height: auto; aspect-ratio: 3/2; }
  .t-hhf-top-intro__photo--1 { width: 60%; aspect-ratio: 270/386; align-self: flex-end; }
  .t-hhf-top-intro__panel { margin-top: 40px; gap: 80px; padding: 140px 0 80px; background: linear-gradient(var(--t-bg) 40px, var(--t-surface) 40px, var(--t-surface) 85%, var(--t-bg) 100%); }
  .t-hhf-top-intro__panel::before { top: -40px; height: 160px; }
  /* 動画の枠は幅の 80% を中央。上の余白を下（80px）と同じに（10/29 高橋さん）。白い楕円（面の上から 120px で終わる）にはかぶせず 20px 空ける */
  .t-hhf-top-intro__video { width: 80%; margin: 0 auto; }
  .t-hhf-top-intro__panel--video { margin-top: -60px; padding-top: 140px; background: linear-gradient(var(--t-bg) 40px, var(--t-surface) 40px, var(--t-surface) 85%, var(--t-bg) 100%); }
  .t-hhf-top-intro__feature, .t-hhf-top-intro__feature--image_left, .t-hhf-top-intro__feature--image_right {
    display: flex; flex-direction: column; gap: 24px; padding: 0 20px;
  }
  .t-hhf-top-intro__fphoto, .t-hhf-top-intro__feature--image_right .t-hhf-top-intro__fphoto { width: 100%; height: auto; aspect-ratio: 4/3; }
  .t-hhf-top-intro__fphoto2 { width: 80%; height: auto; aspect-ratio: 455/353; margin: 0 0 0 auto; }
  .t-hhf-top-intro__ftext { padding-top: 0; }
  .t-hhf-top-intro__ftext .t-hhf-bars { --w: 100%; --t: 8px; --g: 6px; }
  .t-hhf-top-intro__fhead { margin-top: 24px; gap: 8px; }
  .t-hhf-top-intro__eyebrow { font-size: 16px; line-height: 1.4; }
  .t-section .t-hhf-top-intro__fheading { font-size: 28px; line-height: 1.5; letter-spacing: -.04em; white-space: normal; }
  .t-hhf-top-intro__ftextbody { width: auto; min-height: 0; margin-top: 20px; font-size: 16px; line-height: 2; }
  .t-hhf-top-intro__btn { margin-top: 28px; }
}
/* END_SECTION:t-hhf-top-intro */

/* START_SECTION:t-hhf-top-products (INDEX:67) */
.t-section.t-hhf-top-products { padding-top: calc(85px + var(--t-pt)); padding-bottom: calc(84px + var(--t-pb)); }
.t-hhf-top-products__grid { display: grid; grid-template-columns: repeat(3, 350px); justify-content: space-between; row-gap: 101px; max-width: 1240px; margin: 0 auto; }
.t-hhf-top-products__item { display: flex; flex-direction: column; align-items: flex-start; }
.t-hhf-top-products__photo { width: 350px; height: 300px; }
.t-section .t-hhf-top-products__name { margin-top: 33px; font-size: 20px; line-height: 30px; font-weight: 700; letter-spacing: 0; }
.t-hhf-top-products__text { margin-top: 18px; min-height: 109px; font-size: 16px; line-height: 27.2px; font-weight: 500; text-align: left; }
.t-hhf-top-products__btn { margin-top: 25px; }
@media (max-width: 1440px) { .t-hhf-top-products__grid { margin-inline: 100px; } }
@media (max-width: 1079px) {
  .t-hhf-top-products__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 40px; }
  .t-hhf-top-products__photo { width: 100%; height: auto; aspect-ratio: 350/300; }
}
@media (max-width: 1079px) {
  .t-section.t-hhf-top-products { padding-top: calc(40px + var(--t-pt)); padding-bottom: calc(40px + var(--t-pb)); }
  .t-hhf-top-products__grid { grid-template-columns: minmax(0, 1fr); row-gap: 56px; margin-inline: 20px; }
  .t-section .t-hhf-top-products__name { margin-top: 20px; font-size: 18px; }
  .t-hhf-top-products__text { margin-top: 10px; min-height: 0; font-size: 15px; }
  .t-hhf-top-products__btn { margin-top: 20px; }
}
/* END_SECTION:t-hhf-top-products */

/* START_SECTION:t-hhf-top-recruit (INDEX:68) */
/* 背景は透明に（次の会社概要の楕円が写真の左右に見えるように）。写真は楕円より上 */
.t-section.t-hhf-top-recruit { background: transparent; }
.t-hhf-top-recruit__card { position: relative; z-index: 2; max-width: 1240px; height: 473px; margin: 0 auto; }
.t-hhf-top-recruit__card > img { position: absolute; inset: 0; object-position: 50% 65%; }
.t-hhf-top-recruit__body { position: absolute; inset: 0; display: flex; align-items: flex-start; padding: 65px 72px 0 70px; }
.t-hhf-top-recruit__body .t-hhf-bars { --h: 328px; }
.t-hhf-top-recruit__text { display: flex; flex-direction: column; gap: 26px; margin: 12px 0 0 47px; }
.t-hhf-top-recruit__eyebrow { font-family: var(--t-font-label); font-weight: 600; font-size: 24px; line-height: 29px; color: var(--t-dark); }
.t-section .t-hhf-top-recruit__heading { font-size: 48px; line-height: 61.2px; font-weight: 700; letter-spacing: 0; color: var(--t-dark); }
.t-hhf-top-recruit__btn { margin: 59px 0 0 auto; }
@media (max-width: 1440px) { .t-hhf-top-recruit__card { margin-inline: 100px; } }
@media (max-width: 1079px) {
  .t-hhf-top-recruit__card { height: auto; aspect-ratio: 4/3; margin-inline: 20px; }
  .t-hhf-top-recruit__body { flex-wrap: wrap; padding: 24px 20px; }
  .t-hhf-top-recruit__body .t-hhf-bars { --h: 120px; --t: 6px; --g: 4px; }
.t-hhf-top-recruit__text { gap: 8px; margin: 0 0 0 16px; }
  .t-hhf-top-recruit__eyebrow { font-size: 16px; line-height: 1.3; }
  .t-section .t-hhf-top-recruit__heading { font-size: 28px; line-height: 1.4; }
  .t-hhf-top-recruit__btn { margin: auto 0 0 auto; }
}
/* END_SECTION:t-hhf-top-recruit */

/* START_SECTION:t-hhf-wide-photo (INDEX:69) */
.t-section.t-hhf-wide-photo { padding-top: calc(115px + var(--t-pt)); padding-bottom: calc(81px + var(--t-pb)); }
.t-hhf-wide-photo__photo { max-width: 1240px; height: var(--photo-h); margin: 0 auto; }
.t-hhf-wide-photo__photo img { object-position: 50% 76%; }
@media (max-width: 1440px) { .t-hhf-wide-photo__photo { margin-inline: 100px; } }
@media (max-width: 1079px) {
  .t-section.t-hhf-wide-photo { padding-top: calc(40px + var(--t-pt)); padding-bottom: calc(40px + var(--t-pb)); }
  .t-hhf-wide-photo__photo { height: auto; aspect-ratio: 1240/555; margin-inline: 20px; }
}
/* END_SECTION:t-hhf-wide-photo */

/* START_SECTION:t-image-text (INDEX:70) */
.t-imgtext__inner { display: grid; grid-template-columns: var(--t-img-w) 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.t-imgtext--right .t-imgtext__media { order: 2; }
.t-imgtext__body .t-heading { margin-bottom: 28px; }
@media (max-width: 1079px) { .t-imgtext__inner { grid-template-columns: 1fr; gap: 32px; } .t-imgtext--right .t-imgtext__media { order: 0; } }
/* END_SECTION:t-image-text */

/* START_SECTION:t-main-collection (INDEX:71) */
.t-collection__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 32px; }
.t-collection__sort select { margin-left: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--t-line); background: var(--t-bg); }
.t-collection .t-grid { row-gap: calc(var(--t-gap) * 1.6); }
.t-pager { display: flex; justify-content: center; gap: 8px; margin-top: 64px; }
.t-pager a, .t-pager span { display: grid; place-items: center; min-width: 40px; height: 40px; border: 1px solid var(--t-line); }
.t-pager [aria-current] { background: var(--t-primary); color: var(--t-primary-text); border-color: var(--t-primary); }
/* END_SECTION:t-main-collection */

/* START_SECTION:t-main-product (INDEX:72) */
.t-product__inner { display: grid; grid-template-columns: 55% 1fr; gap: clamp(32px, 5vw, 80px); align-items: start; }
.t-product__gallery { display: grid; gap: 12px; }
.t-product__info { position: sticky; top: calc(var(--t-header-h) + 24px); display: grid; gap: 28px; }
.t-product__title { font-size: var(--t-h2); }
.t-product__info .t-price__now { font-size: 22px; }
.t-product__form { display: grid; gap: 16px; }
.t-product__variants, .t-product__qty input { width: 100%; height: 48px; padding: 0 14px; border: 1px solid var(--t-line); border-radius: var(--t-radius-button); background: var(--t-bg); }
.t-product__variants.t-visually-hidden { height: 1px; padding: 0; border: 0; }
.t-product__qty { display: grid; gap: 6px; max-width: 140px; }
.t-product__add { width: 100%; }
.t-product__acc { border-top: 1px solid var(--t-line); border-bottom: 1px solid var(--t-line); }
.t-product__acc summary { display: flex; justify-content: space-between; align-items: center; padding: 18px 0; cursor: pointer; list-style: none; }
.t-product__acc summary::-webkit-details-marker { display: none; }
.t-product__acc svg { width: 18px; height: 18px; transition: transform .25s; }
.t-product__acc[open] svg { transform: rotate(45deg); }
.t-product__acc .t-rte { padding-bottom: 20px; }
@media (max-width: 1079px) {
  .t-product__inner { grid-template-columns: 1fr; }
  .t-product__gallery { grid-auto-flow: column; grid-auto-columns: 88%; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(var(--t-margin) * -1); padding-inline: var(--t-margin); }
  .t-product__media { scroll-snap-align: start; }
  .t-product__info { position: static; }
}
/* END_SECTION:t-main-product */

/* START_SECTION:t-news (INDEX:73) */
.t-news--list .t-news__list { border-top: 1px solid var(--t-line); }
.t-news--list .t-news__item { border-bottom: 1px solid var(--t-line); }
.t-news--list .t-news__link { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 22px 0; }
.t-news--cards .t-news__link { display: grid; gap: 12px; }
.t-news__date { font-family: var(--t-font-en); color: var(--t-sub); font-size: var(--t-small); }
.t-news__link:hover .t-news__title { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1079px) { .t-news--list .t-news__link { grid-template-columns: 1fr; gap: 6px; } }
/* END_SECTION:t-news */

/* START_SECTION:t-rich-text (INDEX:74) */
.t-richtext__body--center { text-align: center; }
/* END_SECTION:t-rich-text */

/* CSS from snippet stylesheet tags */
/* START_SNIPPET:t-hhf-heading-bars (INDEX:120) */
.t-hhf-heading-bars { display: grid; grid-template-columns: 33px minmax(0, 1fr) 33px; align-items: center; width: 664px; max-width: calc(100% - 40px); margin: 0 auto; }
.t-hhf-heading-bars .t-hhf-bars { --h: var(--bar-h); }
.t-hhf-heading-bars__text { display: flex; flex-direction: column; align-items: center; gap: 15px; text-align: center; }
.t-hhf-heading-bars--en .t-hhf-heading-bars__text { gap: 26px; }
.t-hhf-heading-bars__eyebrow { font-size: 24px; line-height: 33px; font-weight: 700; color: var(--t-dark); }
.t-hhf-heading-bars--en .t-hhf-heading-bars__eyebrow { line-height: 29px; font-weight: 600; color: var(--t-accent); }
.t-section .t-hhf-heading-bars__heading { font-size: 48px; line-height: 78px; font-weight: 700; letter-spacing: -3.36px; white-space: nowrap; }
.t-section .t-hhf-heading-bars--plain .t-hhf-heading-bars__heading { line-height: 61.2px; letter-spacing: 0; }
@media (max-width: 1079px) {
  .t-hhf-heading-bars { grid-template-columns: 17px minmax(0, 1fr) 17px; column-gap: 12px; }
  .t-hhf-heading-bars .t-hhf-bars { --h: calc(var(--bar-h) * .55); --t: 6px; --g: 4px; }
  .t-hhf-heading-bars__eyebrow { font-size: 15px; line-height: 1.4; }
  .t-hhf-heading-bars__text, .t-hhf-heading-bars--en .t-hhf-heading-bars__text { gap: 8px; }
  .t-section .t-hhf-heading-bars__heading, .t-section .t-hhf-heading-bars--plain .t-hhf-heading-bars__heading { font-size: 26px; line-height: 1.5; letter-spacing: -.03em; white-space: normal; }
}
/* END_SNIPPET:t-hhf-heading-bars */