@charset "UTF-8";

/* ==========================================================================
   page.css — p-* ページ／セクション固有スタイル
   ※ id はアンカーリンク専用。レイアウトには使わない（.p-* クラスで指定）
   ========================================================================== */

/* ==========================================================================
   TOP: Hero
   ========================================================================== */

.p-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  background: #E3FAFF;
}

.p-hero__frame {
  position: absolute;
  inset: clamp(80px,10vh,96px) clamp(28px,5vw,96px) clamp(40px,6vh,84px);
  border-radius: clamp(24px,3vw,44px);
  overflow: hidden;
  background: var(--ink-900);
}

.p-hero__split {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--ink-900);
}

.p-hero__half {
  position: relative;
  overflow: hidden;
}

.p-hero__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-hero__title {
  position: absolute;
  left: 10%;
  bottom: 15%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(12px,2vw,20px);
}

.p-hero__title h1 {
  margin: 0;
  display: contents;
}

.p-hero__line {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  white-space: nowrap;
  border-radius: 4px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  display: inline-block;
  /* 左→右ワイプ */
  clip-path: inset(0 100% 0 0);
  animation: pHeroWipe 1.1s var(--ease-out) forwards;
}

.p-hero__line--1 {
  color: var(--neutral-000);
  font-size: 64px;
  background: color-mix(in srgb, var(--accent) 80%, transparent);
  padding: 8px 8px 12px;
}

.p-hero__line--2 {
  color: var(--accent);
  font-size: clamp(26px,5.8vw,48px);
  background: color-mix(in srgb, var(--neutral-000) 80%, transparent);
  padding: 8px;
  margin-left: clamp(131px,27.5vw,235px);
  animation-delay: .5s;
}

@keyframes pHeroWipe {
  from {
    clip-path: inset(0 100% 0 0);
  }

  to {
    clip-path: inset(0 0 0 0);
  }
}

/* hero エントランス */

@media (prefers-reduced-motion: no-preference) {
  .p-hero__title > * {
    animation: pRise .9s var(--ease-out) both;
  }
}

@keyframes pRise {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 600px) {
  .p-hero__frame {
    inset: 9vh clamp(25px,5vw,96px) clamp(40px,9vh,84px);
  }
  .p-hero__split {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
  }

  /* 字間を持たせるのは TOP ファーストビューのタイトルのみ。 */
  .p-hero__line {
    letter-spacing: var(--ls-normal);
  }

  .p-hero__line--1 {
    font-size: clamp(28px,8.2vw,50px);
    margin-left: 0;
  }

  .p-hero__line--2 {
    font-size: clamp(21px,6.15vw,38px);
    margin-left: 25%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-hero__line {
    clip-path: none;
    animation: none;
  }
}

/* ==========================================================================
   TOP: Commitment（Our Policy）
   ========================================================================== */

.p-commitment {
  position: relative;
  z-index: 2;
  background: var(--neutral-000);
  overflow: hidden;
  padding-bottom: clamp(120px,15vw,200px);
  border-radius: clamp(36px,4.5vw,64px);
  margin-bottom: calc(-1 * clamp(40px,5vw,72px));
}

.p-commitment__ghost {
  position: absolute;
  right: 0;
  top: 160px;
  font-size: clamp(72px,12vw,200px);
  color: #E3FAFF;
}

.p-commitment__intro {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px,3vw,32px);
  align-items: start;
  padding-top: clamp(96px,13vw,168px);
}

.p-commitment__h2 {
  font-size: clamp(34px,7vw,70px);
  line-height: var(--lh-tight);
  margin: 20px 0 0;
  word-break: keep-all;
}

.p-commitment__lead {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  margin: 0;
  padding-bottom: 8px;
}

.p-commitment__btnrow {
  margin-top: clamp(40px,6vw,80px);
}

.p-commitment__bodywrap {
  padding-top: 6vw;
  padding-bottom: 4vw;
}

.p-commitment__body {
  position: relative;
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: clamp(32px,5vw,72px);
  align-items: stretch;
}

.p-commitment__photo {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-commitment__index {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.p-commitment__divider {
  height: 3px;
  margin: 4px 0;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='11'%20height='3'%3E%3Ccircle%20cx='1.5'%20cy='1.5'%20r='1.5'%20fill='%23ED1C24'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: left center;
}

.p-commitment__point {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  padding: 32px 0;
}

.p-commitment__point:last-child {
  padding-bottom: 0;
}

.p-commitment__point-n {
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: 34px;
  line-height: var(--lh-tight);
  color: var(--brand);
}

.p-commitment__point-t {
  font-size: var(--fs-h3);
  margin: 0 0 10px;
}

.p-commitment__point-d {
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  margin: 0;
}

/* HACCP */

.p-haccp {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: clamp(32px,4vw,64px);
  align-items: center;
  background: var(--surface-cool);
  border-radius: var(--radius-md);
  padding: clamp(32px,4vw,56px);
}

.p-haccp-wrap {
  margin-top: clamp(40px,6vw,80px);
}

.p-haccp__h3 {
  font-size: clamp(24px,2.8vw,36px);
  margin: 0;
  line-height: var(--lh-heading);
}

.p-haccp__txt {
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  margin: 20px 0 0;
}

.p-haccp__fig {
  position: relative;
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.p-haccp__fig video {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 900px) {
  .p-commitment__intro,
  .p-commitment__body,
  .p-haccp {
    grid-template-columns: 1fr;
  }

  .p-commitment__photo {
    margin-top: 0;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  .p-haccp {
    gap: 20px;
    padding: clamp(24px,5vw,32px);
  }

  .p-haccp h3 {
    text-align: center;
  }
}

@media (max-width: 600px) {
  .p-commitment {
    border-radius: 20px;
  }

  .p-commitment__ghost {
    top: 96px;
    font-size: clamp(44px,14vw,72px);
  }
}

/* ==========================================================================
   TOP: Products（商品・加工サービス）
   ========================================================================== */

.p-separator {
  position: sticky;
  top: 0;
  z-index: 0;
  height: min(1000px, 90vh);
  background-image: url("../img/home-separator.webp");
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

.p-separator__inner {
  position: absolute;
  inset: 0;
  background-image: url("../img/home-separator.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: brightness(1.18) saturate(1.05);
}

/* SP：高さを狭めて（cover のズームを緩め）作業する人がより見えるように */
@media (max-width: 600px) {
  .p-separator {
    height: min(390px, 37vh);
  }
}

.p-products {
  position: relative;
  z-index: 3;
  background: var(--surface-cool);
  overflow: hidden;
  border-radius: clamp(36px,4.5vw,64px) clamp(36px,4.5vw,64px) 0 0;
  margin-top: calc(-1 * clamp(36px,4.5vw,64px));
  margin-bottom: 80px;
  padding-bottom: 100px;
}

.p-products__ghost {
  position: absolute;
  right: 0;
  top: clamp(80px,10vw,140px);
  font-size: clamp(72px,12vw,200px);
  color: var(--neutral-000);
}

.p-products__intro {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px,3vw,32px);
  align-items: start;
  padding-top: clamp(96px,13vw,160px);
  padding-bottom: 22px;
}

.p-products__h2 {
  font-size: 72px;
  line-height: var(--lh-tight);
  margin: 20px 0 0;
}

.p-products__lead {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  margin: 0;
  padding-bottom: 10px;
}

.p-products__body {
  padding-top: 40px;
  padding-bottom: clamp(80px,10vw,120px);
}

.p-products__btnrow {
  display: flex;
  justify-content: center;
  margin-top: clamp(56px,7vw,88px);
}

.p-catlabel-row {
  margin: 0 0 40px;
}

.p-catlabel-row--mt {
  margin-top: 64px;
}

/* 特集（大） */

.p-feat {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 0;
  align-items: center;
  margin-bottom: clamp(56px,7vw,96px);
}

.p-feat__media {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-feat__panel {
  position: relative;
  z-index: 2;
  background: var(--surface-card);
  border-radius: var(--radius-md);
  padding: clamp(40px,4vw,56px) clamp(30px,3.4vw,48px);
  margin-left: clamp(-64px,-4vw,-32px);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.p-feat__h3 {
  font-size: clamp(26px,2.8vw,34px);
  margin: 0;
}

.p-feat__txt {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  margin: 0;
}

/* ペア（2列） */

.p-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px,3vw,44px);
}

.p-pair__h3 {
  font-size: 24px;
  margin: 0;
}

.p-pair__txt {
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  margin: 0;
}

.p-pair--mb {
  margin-bottom: clamp(64px,8vw,112px);
}

.p-pair__item {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.p-pair__media {
  position: relative;
  aspect-ratio: 16 / 10;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-prod-media__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 900px) {
  .p-feat {
    grid-template-columns: 1fr;
    row-gap: 20px;
  }

  .p-feat__panel {
    margin-left: 0;
    background: transparent;
    padding: 0;
  }
}

@media (max-width: 620px) {
  .p-pair {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .p-products {
    border-radius: 20px 20px 0 0;
  }

  .p-products__ghost {
    top: 96px;
    font-size: clamp(44px,14vw,72px);
  }

  .p-products__intro {
    padding-bottom: 0;
  }

  .p-products__body {
    padding-top: 16px;
  }

  .p-catlabel-row .c-catlabel__jp {
    font-size: 20px;
  }
}

/* ==========================================================================
   TOP: Equipment（主な設備）
   ========================================================================== */

.p-equipment {
  position: relative;
  z-index: 4;
  background: var(--surface-card);
  overflow: visible;
  padding: clamp(120px,15vw,200px) 0;
  border-radius: clamp(36px,4.5vw,64px) clamp(36px,4.5vw,64px) 0 0;
  margin-top: -160px;
}

.p-equipment__layout {
  display: grid;
  grid-template-columns: 0.74fr 1.26fr;
  gap: clamp(40px,5vw,80px);
  align-items: start;
}

.p-equipment__rail {
  position: sticky;
  top: clamp(90px,12vh,120px);
  align-self: start;
  text-align: left;
  padding-left: clamp(8px,2vw,32px);
}

.p-equipment__head {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 14px;
}

.p-equipment__head h2 {
  writing-mode: vertical-rl;
  line-height: var(--lh-tight);
  margin: 0;
}

.p-equipment__head .en {
  writing-mode: vertical-rl;
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  color: var(--brand);
}

.p-equipment__txt {
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  margin: 28px 0 0;
  max-width: 38ch;
}

.p-equipment__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px,3.4vw,56px);
}

.p-equipment__btn-pc {
  margin-top: 32px;
}

.p-equipment__btn-sp {
  display: none;
}

.c-eqcell {
  position: relative;
  margin: 0;
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1.5px solid var(--border-hairline);
  display: flex;
  flex-direction: column;
}

.c-eqcell__media {
  position: relative;
  padding: clamp(16px,1.6vw,22px) clamp(16px,1.6vw,22px) 0;
}

.c-eqcell__frame {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: clamp(12px,1.2vw,16px);
  background: var(--neutral-300);
}

.c-eqcell__frame img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.c-eqcell__body {
  padding: clamp(18px,1.8vw,24px) clamp(16px,1.6vw,22px);
  text-align: center;
}

.c-eqcell__title {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 19px;
  color: var(--text-heading);
  margin: 0 0 8px;
  line-height: var(--lh-heading);
}

.c-eqcell__sub {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-caption);
  color: var(--text-muted);
}

.u-br-eq {
  display: inline;
}

@media (max-width: 900px) {
  .p-equipment__layout {
    grid-template-columns: 1fr;
  }

  .p-equipment__rail {
    position: static;
  }

  .p-equipment__head {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 6px;
  }

  .p-equipment__head h2,
  .p-equipment__head .en {
    writing-mode: horizontal-tb;
  }

  .p-equipment__btn-pc {
    display: none;
  }

  .p-equipment__btn-sp {
    display: block;
    margin:0 auto;
  }

  .u-br-eq {
    display: none;
  }
}

@media (max-width: 620px) {
  .p-equipment__grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   TOP: Recruit（採用）
   ========================================================================== */

.p-recruit {
  position: relative;
  z-index: 5;
  background: var(--neutral-000);
  overflow: hidden;
  padding-bottom: clamp(120px,15vw,200px);
}

.p-recruit__block {
  position: relative;
  background: var(--brand-hover);
  border-radius: clamp(28px,3.5vw,44px);
  overflow: hidden;
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  align-items: stretch;
  /* 高さはテキスト列の内容で決まり、縦マーキー列は grid stretch で同じ高さに揃う */
}

.p-recruit__photos {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 0;
  overflow: hidden;
  height: 100%;
  min-height: 0;
}

.p-recruit__text {
  position: relative;
  padding: clamp(40px,5vw,72px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.p-recruit__emblem {
  position: absolute;
  right: clamp(28px,4vw,64px);
  bottom: clamp(28px,4vw,56px);
  width: clamp(96px,11vw,150px);
  height: auto;
  opacity: 0.32;
  user-select: none;
  pointer-events: none;
}

.p-recruit__eyebrow {
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  color: rgba(255,255,255,0.85);
  margin-bottom: 20px;
}

.p-recruit__h2 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(38px,5vw,48px);
  line-height: var(--lh-heading);
  color: var(--neutral-000);
  margin: 0 0 28px;
}

.p-recruit__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.92);
  margin: 0;
  max-width: 32em;
}

.p-recruit__btnrow {
  margin-top: 36px;
}

/* 縦マーキー */

.p-vwrap {
  position: relative;
  overflow: hidden;
  height: 100%;
  min-height: 0;
}

.p-vcol {
  /* 絶対配置で列の高さを押し広げない → ブロック高さはテキストで決まり、
     マーキーは .p-vwrap の overflow:hidden でその高さにクリップされる */
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  will-change: transform;
}

.p-vcol--up {
  animation: pVUp 36s linear infinite;
}

.p-vcol--down {
  animation: pVDown 36s linear infinite;
}

.p-vcol__cell {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: rgba(255,255,255,0.12);
}

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

@keyframes pVUp {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-50%);
  }
}

@keyframes pVDown {
  from {
    transform: translateY(-50%);
  }

  to {
    transform: translateY(0);
  }
}

/* モバイル横マーキー */

/* .p-marquee（後方で display:flex）に打ち勝つよう詳細度を上げてPCで確実に隠す */
.p-recruit .p-recruit__hstrip {
  display: none;
  overflow: hidden;
  padding: 0 0 clamp(24px,4vw,40px);
}

.p-marquee-track {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  width: max-content;
  animation: pMarquee 40s linear infinite;
}

.p-recruit__hstrip .p-marquee-track {
  height: clamp(180px,30vh,240px);
  padding: 0 clamp(20px,4vw,40px);
}

.p-recruit__hcell {
  position: relative;
  flex: 0 0 auto;
  width: clamp(140px,42vw,200px);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: rgba(255,255,255,0.12);
}

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

/* 高さの6枚リズム（PHP側の配列指定を置き換え） */

.p-recruit__hcell:nth-child(6n+1) {
  height: 100%;
}

.p-recruit__hcell:nth-child(6n+2) {
  height: 78%;
}

.p-recruit__hcell:nth-child(6n+3) {
  height: 92%;
}

.p-recruit__hcell:nth-child(6n+4) {
  height: 72%;
}

.p-recruit__hcell:nth-child(6n+5) {
  height: 86%;
}

.p-recruit__hcell:nth-child(6n+6) {
  height: 82%;
}

.p-marquee:hover .p-marquee-track {
  animation-play-state: paused;
}

@keyframes pMarquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (max-width: 900px) {
  .p-recruit__block {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
  }

  .p-recruit__photos {
    display: none;
  }

  .p-recruit__text {
    order: 1;
      padding: 10vw;
  }

  /* PC で隠す .p-recruit .p-recruit__hstrip と同詳細度・後方で上書き */
  .p-recruit .p-recruit__hstrip {
    display: block;
    order: 2;
  }

  .p-recruit__emblem {
    position: absolute;
    right: 1.25vw;
    bottom: 0.5vw;
    width: clamp(96px,11vw,150px);
    height: auto;
    opacity: 0.32;
    user-select: none;
    pointer-events: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-vcol--up,
  .p-vcol--down,
  .p-marquee-track {
    animation: none;
  }
}

/* ==========================================================================
   TOP: Contact（お問い合わせ）
   ========================================================================== */

.p-contact {
  position: relative;
  z-index: 6;
  overflow: hidden;
  background: #E3FAFF;
  border-radius: clamp(36px,4.5vw,64px) clamp(36px,4.5vw,64px) 0 0;
  margin-top: calc(-1 * clamp(36px,4.5vw,64px));
  padding-top: clamp(80px,10vw,130px);
  padding-bottom: clamp(40px,5vw,65px);
}

.p-contact__card {
  position: relative;
  overflow: hidden;
  margin-left: clamp(20px,6vw,120px);
  background: var(--accent-hover);
  border-radius: clamp(32px,4vw,56px) 0 0 clamp(32px,4vw,56px);
  padding: 5vw 10vw;
}

.p-contact__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-contact__scrim {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--accent-hover) 88%, transparent);
}

.p-contact__ghost {
  position: absolute;
  left: 10%;
  top: 32%;
  transform: translateY(-50%);
  font-size: 100px;
  color: rgba(255,255,255,0.10);
}

.p-contact__grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px,5vw,72px);
  align-items: center;
}

.p-contact__h2 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(32px,4.4vw,50px);
  color: #fff;
  margin: 18px 0 26px;
  line-height: var(--lh-heading);
}

.p-contact__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.94);
  margin: 0;
  max-width: 72ch;
}

.p-contact__side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  min-width: min(340px, 42vw);
}

.p-contact__telwrap {
  text-align: center;
}

.p-contact__tel {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: clamp(32px,3.6vw,48px);
  color: #fff;
}

.p-contact__tel svg {
  display: block;
  width: 0.62em;
  height: 0.62em;
}

.p-contact__hours {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-caption);
  color: rgba(255,255,255,0.82);
  margin-top: 10px;
}

@media (max-width: 760px) {
  .p-contact__grid {
    grid-template-columns: 1fr;
  }

  .p-contact__tel svg {
    width: 1em;
    height: 1em;
  }

  .p-contact__side {
    align-items: stretch;
  }

  .p-contact__side > div:last-child {
    text-align: left;
  }
  .p-contact__card {
    padding: 10vw;
  }
}

@media (max-width: 600px) {
  .p-contact__ghost {
    top: 10%;
    transform: none;
    font-size: clamp(44px,14vw,72px);
  }
}

/* ==========================================================================
   下層: concept（マルカツ水産の強み）
   ========================================================================== */

/* Our Policy: 写真左（ブリード）＋テキスト右 */

.p-policy {
  padding-left: 0;
  overflow: hidden;
}

.p-policy__grid {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  align-items: center;
  gap: 0;
}

.p-policy__photo {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  aspect-ratio: 16/11;
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
  overflow: hidden;
}

.p-policy__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-policy__text {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  z-index: 2;
  padding-left: clamp(20px,2.5vw,40px);
  padding-right: max(24px, calc(50vw - 510px));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.p-policy__h2 {
  font-weight: var(--fw-black);
  font-size: clamp(28px,4vw,48px);
  margin: 16px 0 clamp(24px,3vw,32px) clamp(-140px,-10vw,-70px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  text-align: left;
}

.p-policy__h2 > span {
  display: inline-block;
  color: #fff;
  background: color-mix(in srgb, var(--accent) 80%, transparent);
  border-radius: 6px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  white-space: nowrap;
  padding: 6px 16px 10px;
}

.p-policy__h2 > span:last-child {
  margin-left: 40px;
}

.p-policy__lead {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-900);
  margin: 0;
  text-align: left;
}

@media (max-width: 860px) {
  .p-policy {
    padding-left: 0;
    padding-right: 0;
  }

  .p-policy__grid {
    grid-template-columns: 1fr;
    gap: clamp(20px,5vw,32px);
    max-width: 90%;
    margin: 0 auto;
  }

  .p-policy__text {
    grid-column: 1;
    grid-row: 2;
    padding-left: 0;
    padding-right: 0;
  }

  .p-policy__h2 {
  margin-left: 0;
  fontsize: clamp(24px,4vw,36px);
}

  .p-policy__text h2 > span {
    white-space: nowrap;
  }

  /* .p-policy__h2 > span:last-child の margin-left:40px を打ち消す */
  .p-policy__h2 > span:last-child {
    margin-left: 0;
  }
  .p-policy__photo {
    grid-column: 1;
    grid-row: 1;
    aspect-ratio: 4/3;
    border-radius: var(--radius-lg);
  }
}

/* 強みカードのグリッド */

.p-pts {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: clamp(18px,2.2vw,28px);
  align-items: stretch;
  margin-top: clamp(36px,4.5vw,56px);
}

/* 強みカード（狭い3カラム）：サービス見出しパーツを流用しつつ、カード幅に合わせて整える */
.p-pts .p-svccard__head {
  align-items: baseline;
}

.p-pts .p-svccard__head h3 {
  white-space: normal;
  font-size: clamp(18px,2vw,22px);
}


@media (max-width: 900px) {
  .p-pts {
    grid-template-columns: 1fr 1fr;
  }
  .p-pts .p-svccard__head h3 {
    font-size: 1.5em;
  }

}

@media (max-width: 560px) {
  .p-pts {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   下層: facility（設備紹介）
   ========================================================================== */

/* カテゴリごとのアクセント色（--eqcolor 経由で配下に配布） */

.p-eqgroup--proc {
  --eqcolor: var(--brand);
}

.p-eqgroup--cold {
  --eqcolor: var(--accent);
}

.p-eqgroup--insp {
  --eqcolor: var(--ink-500);
}

.p-eqgroup .c-catlabel {
  background: var(--eqcolor, var(--brand));
}

/* グループ間の余白。行間 clamp(40px,5vw,64px) より一段広くして区切りを示す */
.p-eqgroup {
  margin-top: clamp(36px,5vw,52px);
  margin-bottom: clamp(56px,7vw,88px);
}
.p-eqrow {
  display: grid;
  grid-template-columns: 1.02fr 1fr;
  gap: clamp(28px,4vw,60px);
  align-items: center;
}

.p-eqrow + .p-eqrow {
  margin-top: clamp(40px,5vw,64px);
}

.p-eqrow__img {
  position: relative;
  aspect-ratio: 4/3;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-eqrow__img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-eqrow.is-rev .p-eqrow__img {
  order: 2;
}

.p-eqrow__role {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: 18px;
  color: var(--eqcolor, var(--brand));
}

.p-eqrow h3 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(22px,2.6vw,30px);
  color: var(--text-heading);
  margin: 8px 0 14px;
  line-height: var(--lh-heading);
}

.p-eqrow__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}

.p-eqcheck {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 28px;
}

.p-eqcheck li {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  line-height: var(--lh-heading);
  color: var(--text-heading);
}

.p-eqcheck svg {
  flex-shrink: 0;
  margin-top: 1px;
  color: var(--eqcolor, var(--brand));
}

.p-eq-note {
  font-size: var(--fs-note);
  color: var(--text-muted);
  margin-top: clamp(32px,4vw,48px);
}

.p-facility-cta {
  padding-top: 7vw;
  padding-bottom: 12vw;
}

.p-eqrow dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 18px;
  margin: 22px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--border-hairline);
}

.p-eqrow dt {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  color: var(--text-muted);
}

.p-eqrow dd {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-caption);
  color: var(--text-body);
  margin: 0;
}

@media (max-width: 820px) {
  .p-eqrow {
    grid-template-columns: 1fr;
    gap: 5vw;
  }

  .p-eqrow.is-rev .p-eqrow__img {
    order: 0;
  }

  .p-eqrow + .p-eqrow {
    margin-top: clamp(72px,18vw,112px);
  }

  .p-eqcheck {
    grid-template-columns: 1fr;
  }

  .p-eqgroup .c-catlabel__jp {
    font-size: 20px;
  }

  .p-eqgroup:first-of-type {
    margin-top: clamp(28px,6vw,40px);
  }
  .p-eqrow h3 {
    font-size: 24px;
  }
  .p-eqcheck li {
    font-size: 18px;
  }
  .p-facility-cta {
    padding-top: 20vw;
    padding-bottom: 30vw;
  }
}

.p-center-cta {
  text-align: center;
}

.p-center-cta h2 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(26px,3.6vw,42px);
  color: var(--text-heading);
  margin: 16px 0 18px;
}

.p-center-cta__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 auto 30px;
}

.p-center-cta__note {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-note);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: clamp(28px,3.4vw,40px) 0 0;
}

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

.u-br-hbr {
  display: none;
}

@media (max-width: 820px) {
  .u-br-hbr {
    display: inline;
  }
}

/* ==========================================================================
   下層: company（会社概要）
   ========================================================================== */

.p-msg-block {
  padding-top: clamp(52px,8vw,140px);
}

.p-msg-grid {
  display: grid;
  grid-template-columns: 6fr 4fr;
  gap: clamp(32px,5vw,64px);
  align-items: center;
}

.p-msg-photo {
  position: relative;
  aspect-ratio: 3/4;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-msg__p {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 22px 0 0;
  text-align: left;
}
.p-msg__p:first-of-type {
  margin-top: 2vw;
}
.p-msg__p + .p-msg__p {
  margin-top: 18px;
}

.p-msg__memo {
  color: var(--blue-500);
}

.p-msg__sign {
  font-weight: var(--fw-bold);
  font-size: var(--fs-md);
  color: var(--text-heading);
  margin-top: 26px;
}

.p-msg__sign-name {
  font-size: 20px;
}

@media (max-width: 760px) {
  .p-msg-grid {
    grid-template-columns: 1fr;
    gap: clamp(22px,5vw,32px);
  }
  .p-msg__p:first-of-type {
    margin-top: 8vw;
  }

  .p-msg-photo {
    aspect-ratio: 16/10;
  }

  .p-msg-grid > div:first-child {
    order: 1;
    text-align: center;
  }

  .p-msg-grid > div:last-child {
    order: 2;
  }
}

.p-profile-band {
  position: relative;
  width: 100%;
  margin: clamp(28px,4vw,44px) 0 0;
  aspect-ratio: 16/5;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-profile-band img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 760px) {
  .p-profile-band {
    aspect-ratio: 16/8;
  }
}

.p-info {
  width: 100%;
  border-collapse: collapse;
  margin-top: clamp(28px,4vw,44px);
}

.p-info th,
.p-info td {
  font-family: var(--font-jp);
  text-align: left;
  padding: 20px 8px;
  border-bottom: 1px solid var(--border-hairline);
  vertical-align: top;
}

.p-info th {
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: var(--text-heading);
  width: 220px;
}

.p-info td {
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  color: var(--text-body);
  line-height: var(--lh-body);
}

.p-info tr:first-child th,
.p-info tr:first-child td {
  border-top: none;
}

@media (max-width: 760px) {
  .p-info th {
    width: 120px;
  }
}

@media (max-width: 520px) {
  .p-info tr,
  .p-info th,
  .p-info td {
    display: block;
  }

  .p-info th {
    border-bottom: none;
    padding-bottom: 0;
  }

  .p-info td {
    padding-top: 6px;
  }
}

/* 沿革タイムライン（縦並び） */

.p-hist {
  --hist-col: clamp(64px,8vw,104px);
  --hist-gap: clamp(20px,3vw,36px);
  position: relative;
  margin-top: clamp(28px,4vw,44px);
  display: flex;
  flex-direction: column;
}

.p-hist__row {
  position: relative;
  display: grid;
  grid-template-columns: var(--hist-col) 1fr;
  column-gap: var(--hist-gap);
  padding-bottom: clamp(26px,3.6vw,44px);
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1.05s ease-out, transform 1.05s ease-out;
}

.p-hist__row:last-child {
  padding-bottom: 0;
}

.p-hist__row::after {
  content: '';
  position: absolute;
  left: calc(var(--hist-col) + var(--hist-gap) / 2 - 1px);
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--border-hairline);
  z-index: 0;
}

.p-hist__row:last-child::after {
  bottom: auto;
  height: 14px;
}

.p-hist__row::before {
  content: '';
  position: absolute;
  left: calc(var(--hist-col) + var(--hist-gap) / 2 - 6px);
  top: 8px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--brand);
  z-index: 1;
}

.p-hist.is-in .p-hist__row {
  opacity: 1;
  transform: none;
}

/* 行の表示時差 */

.p-hist__row:nth-child(1) {
  transition-delay: 0s;
}

.p-hist__row:nth-child(2) {
  transition-delay: .09s;
}

.p-hist__row:nth-child(3) {
  transition-delay: .18s;
}

.p-hist__row:nth-child(4) {
  transition-delay: .27s;
}

.p-hist__row:nth-child(5) {
  transition-delay: .36s;
}

.p-hist__row:nth-child(6) {
  transition-delay: .45s;
}

.p-hist__row:nth-child(7) {
  transition-delay: .54s;
}

.p-hist__row:nth-child(8) {
  transition-delay: .63s;
}

.p-hist__row:nth-child(9) {
  transition-delay: .72s;
}

.p-hist__row:nth-child(10) {
  transition-delay: .81s;
}

.p-hist__row:nth-child(n+11) {
  transition-delay: .9s;
}

.p-hist__fig {
  margin: 14px 0 0;
}

.p-hist__imgframe {
  position: relative;
  width: 100%;
  max-width: clamp(240px,32vw,380px);
  aspect-ratio: 3/2;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-hist__imgframe img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-hist__y {
  display: block;
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-body);
  color: var(--brand);
  line-height: 1.6;
}

.p-hist__t {
  display: block;
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
}

@media (prefers-reduced-motion: reduce) {
  .p-hist__row {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

@media (max-width: 760px) {
  .p-hist {
    --hist-col: 56px;
    --hist-gap: 16px;
  }

  .p-hist__imgframe {
    max-width: none;
  }
}

/* アクセス */

.p-access-block {
  padding-bottom: clamp(110px,13vw,180px);
}

.p-access {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px,4vw,56px);
  align-items: stretch;
  margin-top: clamp(28px,4vw,44px);
}

.p-access__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
}

.p-access__logo {
  height: clamp(28px,3vw,38px);
  width: auto;
  display: block;
}

.p-access__addr {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin-top: 10px;
}

.p-access__meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: var(--fs-sm);
  color: var(--text-body);
  line-height: var(--lh-body);
}

.p-access__note {
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-muted);
  padding-top: 14px;
  border-top: 1px solid var(--border-hairline);
}

.p-map {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-200);
  min-height: 300px;
  border: 1.5px solid var(--border-hairline);
}

.p-map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 760px) {
  .p-access {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   下層: contact（お問い合わせフォーム）
   ========================================================================== */

.p-contact-form {
  background: var(--neutral-000);
  padding-bottom: clamp(64px,10vw,128px);
}

.p-contact-form__inner {
  max-width: 680px;
  margin: 0 auto;
}

.p-contact-form__lead {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 0 clamp(28px,4vw,44px);
}

.p-contact-form__placeholder {
  background: var(--surface-inset);
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-md);
  padding: clamp(28px,4vw,44px);
  text-align: center;
  color: var(--text-muted);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
}

/* フォームの送信ボタンをサイト共通の .c-btn に合わせる。
   Snow Monkey Forms のボタンは JS で描画され、円形アイコンを持てないため
   ::after で .c-btn__ico 相当の丸を作っている。
   data-action = confirm / complete が主ボタン、back が戻るボタン。 */

.smf-action {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.smf-action .smf-button-control + .smf-button-control {
  margin-left: 0;
}

.smf-action .smf-button-control__control {
  --btn-c: var(--brand);
  --btn-on: #fff;
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 10px 10px 10px 26px;
  border-radius: 999px;
  border: 1.5px solid var(--btn-c);
  color: var(--btn-c);
  background: #fff;
  background-image: none;
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-body);
  line-height: var(--lh-tight);
  cursor: pointer;
  transition: background .22s var(--ease-out), color .22s var(--ease-out);
}

.smf-action .smf-button-control__control::after {
  content: '\2192';
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--btn-c);
  color: var(--btn-on);
  display: grid;
  place-items: center;
  font-size: var(--fs-md);
  flex-shrink: 0;
  transition: background .22s var(--ease-out), color .22s var(--ease-out);
}

.smf-action .smf-button-control__control:hover {
  background: var(--btn-c);
  color: var(--btn-on);
}

.smf-action .smf-button-control__control:hover::after {
  background: var(--btn-on);
  color: var(--btn-c);
}

.smf-action .smf-button-control__control:active {
  transform: scale(.98);
}

/* 戻るボタンは控えめな配色で、矢印を左向きに */

.smf-action .smf-button-control__control[data-action="back"] {
  --btn-c: var(--text-muted);
  padding: 10px 26px 10px 10px;
}

.smf-action .smf-button-control__control[data-action="back"]::after {
  content: '\2190';
  order: -1;
}

/* 送信中スピナーはプラグイン側で絶対配置。矢印と重なるため flex の流れに戻し、
   待機中は場所を取らないよう非表示にする。 */

.smf-action .smf-button-control__control .smf-sending {
  position: static;
  transform: none;
}

.smf-action .smf-button-control__control .smf-sending[aria-hidden="true"] {
  display: none;
}

.smf-action .smf-button-control__control[disabled] {
  opacity: .55;
  cursor: default;
}

/* ==========================================================================
   下層: privacy（プライバシーポリシー）
   ========================================================================== */

.p-privacy-block {
  padding-bottom: clamp(40px,6vw,72px);
}

.p-privacy {
  max-width: 820px;
  /* 文字色は --ink-700 に統一。例外は番号とリンクの赤、改定日の注記のグレーのみ */
  color: var(--ink-700);
  /* 見出しの番号（01, 02 …）用カウンター。項目を増減しても自動で振り直す */
  counter-reset: item;
}

.p-privacy__intro {
  margin: 0 0 8px;
}

.p-privacy p.p-privacy__contact {
  margin: 0;
}

/* 本文の下に添える注記（改定日・社名など） */

.p-privacy .p-privacy__date {
  margin-top: 20px;
}

.p-privacy .p-privacy__date,
.p-privacy .p-privacy__date p {
  font-size: var(--fs-note);
  color: var(--text-muted);
}

.p-privacy .p-privacy__date p:last-child {
  margin-bottom: 0;
}

.p-privacy > section {
  padding: clamp(28px,3.4vw,40px) 0;
  border-bottom: 1px solid var(--border-hairline);
}

.p-privacy > section:last-child {
  border-bottom: none;
}

.p-privacy h2 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 24px;
  color: var(--ink-700);
  margin: 0 0 16px;
  display: flex;
  align-items: baseline;
  gap: 14px;
}

/* 見出し番号は CSS カウンターで自動採番（項目が増えても減っても連番が揃う） */

.p-privacy > section > h2 {
  counter-increment: item;
}

.p-privacy > section > h2::before {
  content: counter(item, decimal-leading-zero);
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: 24px;
  color: var(--brand);
  flex-shrink: 0;
}

.p-privacy p {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-700);
  margin: 0 0 14px;
}

.p-privacy p:last-child {
  margin-bottom: 0;
}

/* リッチエディターの箇条書き（ul）。クラスなしでも同じ ○ が付く */

.p-privacy ul {
  margin: 6px 0 14px;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.p-privacy li {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-700);
}

.p-privacy ul > li {
  padding-left: 22px;
  position: relative;
}

.p-privacy ul > li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 12px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-700);
}

/* リッチエディターの番号付きリスト（ol）。見出しの番号とは別立て */

.p-privacy ol {
  margin: 6px 0 14px;
  padding-left: 1.4em;
  list-style: decimal;
}

.p-privacy ol > li + li {
  margin-top: 10px;
}

.p-privacy ol > li::marker {
  color: var(--ink-700);
  font-weight: var(--fw-bold);
}

/* 入れ子のリスト */

.p-privacy li > ul,
.p-privacy li > ol {
  margin: 10px 0 0;
}

.p-privacy strong,
.p-privacy b {
  font-weight: var(--fw-bold);
  color: var(--ink-700);
}

/* 共同利用の項目リスト（クラスなしの dl でも同じ見た目にする） */

.p-privacy dl {
  margin: 6px 0 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.p-privacy dl dt {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-700);
  padding-left: 22px;
  position: relative;
}

.p-privacy dl dt::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 12px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-700);
}

.p-privacy dl dd {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-700);
  margin: 2px 0 0;
  padding-left: 22px;
}

/* 本文中のテキストリンク（電話番号リンクは c-tel-link 側の指定を使う） */

.p-privacy a:not(.c-tel-link):not([href^="tel:"]) {
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ==========================================================================
   下層: recruit（採用情報）
   ========================================================================== */

.p-recmsg-block {
  padding-top: 0;
  padding-bottom: 0;
  background: #FFF0F3;
  position: relative;
  overflow: visible;
}

.p-recmsg-wrap {
  position: relative;
  z-index: 1;
}

.p-recmsg {
  text-align: center;
  max-width: none;
  margin: 0 auto;
}

.p-recmsg__h2 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(28px,4vw,46px);
  line-height: var(--lh-heading);
  color: var(--red-500);
  margin: 18px 0 24px;
}

.p-recmsg__lead {
  font-size: clamp(34px,4vw,46px);
}

.p-recmsg__p {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 auto;
}

.p-recmark {
  position: absolute;
  right: 0;
  top: -2.5px;
  transform: translateY(-50%);
  height: auto;
  width: 28vw;
  opacity: .7;
  filter: brightness(0) invert(1);
  user-select: none;
  pointer-events: none;
}

/* マーキー */

.p-recslide {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-top: clamp(40px,6vw,72px);
  overflow: hidden;
  padding: clamp(30px,4vw,56px) 0 clamp(130px,16vw,220px);
}

.p-recslide__track {
  display: flex;
  gap: clamp(12px,1.4vw,20px);
  width: max-content;
  animation: pSlideL 46s linear infinite;
  align-items: flex-start;
}

.p-recslide__track img {
  height: clamp(150px,20vw,260px);
  width: clamp(220px,28vw,380px);
  object-fit: cover;
  display: block;
  flex: 0 0 auto;
  border-radius: clamp(14px,1.4vw,22px);
}

.p-recslide__track img:nth-child(4n+1) {
  transform: translateY(clamp(-26px,-3vw,-44px));
}

.p-recslide__track img:nth-child(4n+2) {
  transform: translateY(clamp(22px,2.6vw,40px));
}

.p-recslide__track img:nth-child(4n+3) {
  transform: translateY(clamp(-12px,-1.4vw,-20px));
}

.p-recslide__track img:nth-child(4n+4) {
  transform: translateY(clamp(34px,4vw,60px));
}

@keyframes pSlideL {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-recslide__track {
    animation: none;
  }
}

/* 業務内容（sticky サイド） */

.p-role-block {
  overflow: visible;
}

.p-role {
  display: grid;
  grid-template-columns: 0.86fr 1.14fr;
  gap: clamp(32px,5vw,80px);
  align-items: start;
}

.p-role__h2 {
  margin: 14px 0 0;
}

.p-role__side {
  position: sticky;
  top: clamp(96px,12vh,130px);
  align-self: start;
}

.p-role__intro {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 22px 0 0;
}

.p-role__list {
  display: flex;
  flex-direction: column;
}

.p-role__item {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: clamp(20px,2.4vw,36px);
  align-items: center;
  padding: clamp(32px,4vw,56px) 0;
  border-top: 1.5px solid var(--border-hairline);
}

.p-role__item:first-child {
  padding-top: 0;
  border-top: none;
}

.p-role__item:last-child {
  padding-bottom: 0;
}

.p-role__photo {
  aspect-ratio: 3/2;
  overflow: hidden;
  border-radius: clamp(16px,1.6vw,24px);
  background: var(--neutral-300);
}

.p-role__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-role__t {
  display: flex;
  align-items: center;
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(18px,1.5vw,22px);
  color: var(--text-heading);
  margin: 0 0 12px;
}

.p-role__t .dot {
  display: inline-block;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  margin-right: 13px;
  flex: 0 0 auto;
  background: var(--brand);
}

.p-role__d {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}

@media (max-width: 860px) {
  .p-role {
    grid-template-columns: 1fr;
    gap: clamp(28px,5vw,40px);
  }

  .p-role__side {
    position: static;
  }

  .p-role__item {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .p-recmark {
    top: -32px;
    width: 40vw;
  }
  .p-role__t {
    font-size: 24px;
  }
}

/* 安心して働ける理由 */

.p-reasons-block {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-bottom-left-radius: clamp(36px,4.5vw,64px);
  border-bottom-right-radius: clamp(36px,4.5vw,64px);
}

.p-duties {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
  gap: clamp(20px,2.4vw,32px);
  margin-top: clamp(28px,4vw,44px);
}

.p-duty {
  background: #fff;
  border-radius: clamp(16px,1.6vw,24px);
  padding: clamp(22px,2.4vw,30px);
}

.p-duty__img {
  width: 100%;
  aspect-ratio: 16/10;
  overflow: hidden;
  border-radius: clamp(12px,1.2vw,18px);
  background: var(--neutral-300);
  margin-bottom: clamp(16px,1.8vw,22px);
}

.p-duty__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-duty__img--video {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.p-duty__img--video video {
  display: block;
  object-fit: contain;
}

.p-duty__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 12px;
}

.p-duty__n {
  font-family: var(--font-en-ghost);
  font-weight: 800;
  font-size: clamp(18px,1.6vw,22px);
  color: var(--brand);
  line-height: var(--lh-tight);
  flex: 0 0 auto;
}

.p-duty__t {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(17px,1.4vw,20px);
  color: var(--text-heading);
  margin: 0;
}

.p-duty__d {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}

/* フルブリード写真帯 */

.p-recband {
  position: relative;
  z-index: 0;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-top: clamp(-64px,-4.5vw,-36px);
  height: clamp(260px,40vw,560px);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-recband img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 募集要項 */

.p-req-note {
  font-size: var(--fs-note);
  color: var(--text-muted);
  margin-top: 24px;
}

.p-reqpanel {
  background: #fff;
  border-radius: 16px;
  margin-top: clamp(28px,4vw,44px);
  padding: clamp(10px,2vw,26px) clamp(24px,4vw,56px) clamp(20px,3vw,36px);
}

/* 募集職種リスト */

.p-req__jobs {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 値のテキストに続けて箇条書きを出す場合の余白 */

.p-req td > .p-req__jobs:not(:first-child) {
  margin-top: 10px;
}

.p-req__jobs li {
  position: relative;
  padding-left: 20px;
}

.p-req__jobs li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(var(--lh-body) * 0.5em - 3px);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--brand);
}

/* セル内の補足注釈（※一例です など） */

.p-req__note {
  display: block;
  margin-top: 6px;
  font-size: var(--fs-note);
  color: var(--text-muted);
}

/* ハローワークへの外部リンク */

.p-req-hw-lead {
  margin-top: clamp(28px,3.6vw,40px);
  text-align: center;
  line-height: var(--lh-body);
}

.p-req-hw {
  display: flex;
  justify-content: center;
  margin-top: clamp(28px,3.6vw,40px);
}

.p-req-hw-lead + .p-req-hw {
  margin-top: clamp(16px,2vw,22px);
}

.p-req-hw .c-btn__ico svg {
  display: block;
}

.p-req {
  width: 100%;
  border-collapse: collapse;
  margin-top: clamp(24px,3vw,32px);
}

.p-req th,
.p-req td {
  font-family: var(--font-jp);
  text-align: left;
  padding: 20px 8px;
  border-bottom: 1px solid var(--border-hairline);
  vertical-align: top;
}

.p-req th {
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: var(--text-heading);
  width: 200px;
}

.p-req td {
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  color: var(--text-body);
  line-height: var(--lh-body);
}

.p-req tr:first-child th,
.p-req tr:first-child td {
  border-top: none;
}

.p-req tr:last-child th,
.p-req tr:last-child td {
  border-bottom: none;
}

@media (max-width: 820px) {
  .p-req th {
    width: 120px;
    white-space: nowrap;
  }
  .p-duty__n {
    font-size: 24px;
  }
.p-duty__t {
    font-size: 24px;
  }
}

@media (max-width: 520px) {
  .p-req tr,
  .p-req th,
  .p-req td {
    display: block;
  }

  .p-req th {
    border-bottom: none;
    padding-bottom: 0;
  }

  .p-req td {
    padding-top: 6px;
  }
}

/* エントリー */

.p-entry-block {
  background: #FFF;
  padding-top: clamp(96px,12vw,160px);
  padding-bottom: clamp(96px,12vw,160px);
}

.p-entry__btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}

.p-entry__tel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: clamp(28px,2.8vw,32px);
  color: var(--brand);
}

.p-entry__tel svg {
  width: 0.9em;
  height: 0.9em;
}

@media (max-width: 760px) {
  .p-entry__tel svg {
    width: 1.2em;
    height: 1.2em;
  }
}

/* ==========================================================================
   下層: news 一覧（archive）
   ========================================================================== */

.p-news-empty {
  font-weight: var(--fw-medium);
  color: var(--text-muted);
  padding: 40px 0;
}

.p-news-row {
  display: grid;
  grid-template-columns: 118px 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 26px 8px;
  border-bottom: 1px solid var(--border-hairline);
  transition: background .2s var(--ease-out);
}

.p-news-row:first-child {
  border-top: 1px solid var(--border-hairline);
}

.p-news-row:hover {
  background: var(--neutral-050);
}

.p-news-row:hover .p-news-ttl {
  color: var(--brand);
}

.p-news-row:hover .p-news-arw {
  color: var(--brand);
  transform: translateX(3px);
}

.p-news-date {
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-md);
  color: var(--text-muted);
}

.p-news-ttl {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-heading);
  transition: color .2s var(--ease-out);
}

.p-news-arw {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  /* セクション背景が白のため、丸は薄いグレーで面を出す。 */
  background: var(--neutral-050);
  border: 1px solid var(--border-hairline);
  color: var(--text-muted);
  display: grid;
  place-items: center;
  font-size: var(--fs-sm);
  flex-shrink: 0;
  transition: background .2s var(--ease-out), color .2s var(--ease-out), transform .2s var(--ease-out);
}

@media (max-width: 640px) {
  .p-news-row {
    grid-template-columns: 1fr auto;
    gap: 6px 16px;
    padding: 20px 4px;
  }

  .p-news-date {
    grid-column: 1;
  }

  .p-news-ttl {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .p-news-arw {
    display: none;
  }
}

.p-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: clamp(36px,5vw,56px);
}

.p-pager .page-numbers {
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-md);
  min-width: 42px;
  height: 42px;
  padding: 0 6px;
  border-radius: 50%;
  /* セクション背景が白のため、ボタンは薄いグレー＋ヘアラインで面を出す。 */
  border: 1px solid var(--border-hairline);
  background: var(--neutral-050);
  color: var(--text-body);
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background .2s var(--ease-out), color .2s var(--ease-out);
  text-decoration: none;
}

.p-pager a.page-numbers:hover {
  color: var(--brand);
  border-color: var(--border-strong);
}

.p-pager .page-numbers.current {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  cursor: default;
}

/* 進めない側の矢印（先頭ページの ← / 末尾ページの →）。 */

.p-pager .page-numbers.is-disabled {
  color: var(--border-strong);
  background: transparent;
  cursor: default;
}

/* ==========================================================================
   下層: news 記事（single）
   ========================================================================== */

.p-article-block {
  background: var(--neutral-000);
  /* 次の .p-contact が margin-top で最大64px分せり上がるため、その分を見込んで確保する。 */
  padding-bottom: clamp(96px,12vw,160px);
}

.p-article {
  max-width: 820px;
}

.p-article__meta {
  margin-top: 14px;
}

.p-article__date {
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

.p-article__back {
  margin-top: clamp(36px,5vw,56px);
  padding-top: 28px;
  border-top: 1px solid var(--border-hairline);
  display: flex;
  justify-content: flex-start;
}

.p-article h1.at {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(24px,3.4vw,38px);
  line-height: var(--lh-heading);
  color: var(--text-heading);
  margin: 18px 0 0;
}

.p-article__hero {
  margin: clamp(28px,4vw,44px) 0;
  aspect-ratio: 16/8;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
  position: relative;
}

.p-article__hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-body p {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 0 22px;
}

.p-body h3 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 19px;
  color: var(--text-heading);
  margin: 36px 0 14px;
  line-height: var(--lh-heading);
}

.p-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 22px;
}

.p-body th,
.p-body td {
  font-family: var(--font-jp);
  font-size: var(--fs-sm);
  text-align: left;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border-hairline);
}

.p-body th {
  font-weight: var(--fw-bold);
  color: var(--text-heading);
  width: 38%;
  background: var(--neutral-050);
}

.p-body td {
  font-weight: var(--fw-medium);
  color: var(--text-body);
}

.p-body img {
  border-radius: var(--radius-sm);
  margin: 8px 0 22px;
}

/* ==========================================================================
   下層: service（事業・サービス）
   ========================================================================== */

.p-svcstack {
  display: flex;
  flex-direction: column;
  gap: 56px;
  margin-top: clamp(36px,5vw,52px);
}

.p-svcgroup {
  display: flex;
  flex-direction: column;
}

.p-svcgroup__stack {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.p-svcnum {
  flex-shrink: 0;
  font-family: var(--font-en-ghost);
  font-weight: var(--fw-bold);
  font-size: 27px;
  line-height: var(--lh-tight);
  color: var(--brand);
}

.p-svcnum--blue {
  color: var(--blue-500);
}

/* サービスカード */

.p-svccard {
  display: grid;
  grid-template-columns: minmax(230px,0.7fr) 1fr;
  gap: clamp(28px,4vw,60px);
  align-items: center;
  background: #fff;
  border-radius: clamp(20px,2.4vw,28px);
  padding: clamp(24px,3vw,44px);
}

.p-svccard__img {
  position: relative;
  aspect-ratio: 4/3;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
}

.p-svccard__img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-svccard__head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}

.p-svccard__head h3 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 2em;
  color: var(--text-heading);
  margin: 0;
  white-space: nowrap;
}

.p-svccard__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 0 18px;
}

@media (max-width: 760px) {
  .p-svccard {
    grid-template-columns: 1fr;
  }

  .p-svccard__img {
    max-width: 380px;
  }
}

@media (max-width: 600px) {
  .p-svccard__head h3 {
    white-space: normal;
    font-size: 24px;
  }
}

/* svcblock（対応内容） */

.p-svcblock {
  margin-top: 22px;
}

.p-svcblock--flush {
  margin-top: 0;
}

.p-svcblock__label {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: var(--brand);
  margin: 0 0 12px;
}

.p-svcblock__label--blue {
  color: var(--blue-500);
}

.p-svcblock__info {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 11px 24px;
  margin: 0;
}

.p-svcblock__info dt {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  color: var(--text-heading);
  white-space: nowrap;
}

.p-svcblock__info dd {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}

/* amaebi カード + methods */

.p-acard {
  background: var(--neutral-000);
  border-radius: clamp(20px,2.4vw,28px);
  padding: clamp(24px,3vw,44px);
  position: relative;
}

.p-acard__top {
  display: grid;
  grid-template-columns: minmax(240px,0.72fr) 1fr;
  gap: clamp(28px,4vw,60px);
  align-items: center;
}

.p-acard__more {
  margin-top: clamp(28px,3.4vw,40px);
  padding-top: clamp(28px,3.4vw,40px);
  border-top: 1.5px solid var(--border-hairline);
}

.p-acard__mtitle {
  font-weight: var(--fw-bold);
  font-size: var(--fs-md);
  color: var(--text-heading);
  margin: 0 0 clamp(18px,2vw,24px);
  text-align: center;
}

.p-acard__methods {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: clamp(24px,4vw,48px);
}

@media (max-width: 760px) {
  .p-acard__top {
    grid-template-columns: 1fr;
  }

  .p-acard__methods {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 600px) {
  .p-acard__top {
    grid-template-columns: 1fr;
  }

  .p-acard__methods {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

.p-method__img {
  position: relative;
  aspect-ratio: 16/10;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-300);
  margin-bottom: 16px;
}

.p-method__img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-method h4 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 20px;
  color: var(--text-heading);
  margin: 8px 0 10px;
  display: flex;
  align-items: center;
}

.p-method p {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0 0 16px;
}

.p-methodtitle {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 20px;
  color: var(--text-heading);
  display: flex;
  align-items: center;
}

.p-methodtitle--flow {
  margin: clamp(56px,7vw,88px) 0 0;
}

.p-methodtitle--uc {
  margin: clamp(40px,5vw,60px) 0 0;
}

/* OEM セクション */


.p-oem-lead {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 18px 0 0;
}

.p-oem-note {
  font-size: var(--fs-note);
  color: var(--text-muted);
  margin-top: 22px;
  text-align: center;
}

/* 用途マーキー */

.p-usecase {
  padding: clamp(64px,8vw,104px) 0;
  background: var(--accent-hover);
  overflow: hidden;
}

.p-usecase--light {
  background: transparent;
  padding: 0;
  overflow: hidden;
  margin-top: clamp(28px,3.6vw,44px);
}

.p-marquee {
  position: relative;
  display: flex;
  overflow: hidden;
}

.p-usecase:not(.p-usecase--light) .p-marquee {
  -webkit-mask-image: linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image: linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}

.p-marquee__row {
  display: flex;
  flex-shrink: 0;
  gap: clamp(16px,1.6vw,22px);
  padding-right: clamp(16px,1.6vw,22px);
  animation: pMarqueeUC 34s linear infinite;
}

.p-usecase:hover .p-marquee__row {
  animation-play-state: paused;
}

@keyframes pMarqueeUC {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-marquee__row {
    animation: none;
  }
}

.p-uc {
  flex-shrink: 0;
  width: clamp(200px,20vw,248px);
  background: #fff;
  border-radius: var(--radius-md);
  padding: clamp(28px,2.6vw,34px) clamp(24px,2.4vw,30px);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

.p-usecase--light .p-uc {
  border: 1.5px solid var(--border-hairline);
}

.p-uc__ico {
  height: 104px;
  display: grid;
  place-items: center;
}

.p-uc__ico img {
  height: 104px;
  width: auto;
  display: block;
}

.p-uc h4 {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: 18px;
  color: var(--text-heading);
  margin: 0;
}

.p-uc p {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-caption);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: 0;
}

/* ご相談の流れ（縦書きチップ） */

.p-flow {
  display: flex;
  align-items: stretch;
  gap: clamp(6px,1vw,14px);
  flex-wrap: nowrap;
  margin-top: clamp(20px,3vw,28px);
}

.p-flow__n.is-muted {
  background: var(--overlay-40);
}

.p-flow__t.is-muted {
  color: var(--overlay-40);
}

/* 表示アニメの時差（--d はチップ/矢印の並び順から算出） */

.p-flow .p-flow__chip:nth-of-type(1) {
  --d: 0s;
}

.p-flow .p-flow__chip:nth-of-type(2) {
  --d: .11s;
}

.p-flow .p-flow__chip:nth-of-type(3) {
  --d: .22s;
}

.p-flow .p-flow__chip:nth-of-type(4) {
  --d: .33s;
}

.p-flow .p-flow__chip:nth-of-type(5) {
  --d: .44s;
}

.p-flow .p-flow__chip:nth-of-type(6) {
  --d: .55s;
}

.p-flow .p-flow__arw:nth-of-type(1) {
  --d: .055s;
}

.p-flow .p-flow__arw:nth-of-type(2) {
  --d: .165s;
}

.p-flow .p-flow__arw:nth-of-type(3) {
  --d: .275s;
}

.p-flow .p-flow__arw:nth-of-type(4) {
  --d: .385s;
}

.p-flow .p-flow__arw:nth-of-type(5) {
  --d: .495s;
}

.p-flow__chip {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #F4F7FB;
  border-radius: 22px;
  padding: clamp(20px,2.2vw,28px) clamp(10px,1.2vw,16px) clamp(22px,2.6vw,32px);
  min-height: clamp(170px,20vw,220px);
}

.p-flow__n {
  width: clamp(38px,3.4vw,46px);
  height: clamp(38px,3.4vw,46px);
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-family: var(--font-en-ghost);
  font-weight: 800;
  font-size: 16px;
  display: grid;
  place-items: center;
  margin-bottom: clamp(18px,2.2vw,30px);
  flex-shrink: 0;
}

.p-flow__t {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: clamp(16px,1.4vw,17px);
  color: var(--text-heading);
  line-height: var(--lh-heading);
  max-height: 100%;
}

.p-flow__arw {
  color: var(--accent);
  font-size: clamp(16px,1.8vw,22px);
  flex-shrink: 0;
  line-height: var(--lh-tight);
  align-self: center;
}

@media (prefers-reduced-motion: no-preference) {
  .p-flow[data-mk-flow] .p-flow__chip,
  .p-flow[data-mk-flow] .p-flow__arw {
    opacity: 0;
    transform: translateX(-30px);
  }

  .p-flow[data-mk-flow].is-in .p-flow__chip,
  .p-flow[data-mk-flow].is-in .p-flow__arw {
    opacity: 1;
    transform: none;
    transition: opacity .5s ease-out var(--d,0s), transform .5s ease-out var(--d,0s);
  }
}

@media (max-width: 768px) {
  .p-oem-block {
    padding-bottom: 32vw;
  }
  .p-flow {
    flex-direction: column;
  }

  .p-flow__chip {
    flex: none;
    width: 100%;
    min-height: 0;
    flex-direction: row;
    justify-content: flex-start;
    gap: 16px;
    padding: 16px 22px;
  }

  .p-flow__n {
    margin-bottom: 0;
  }

  .p-flow__t {
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    font-size: 18px;
  }

  /* SP は縦並びのため横スライド演出を無効化（no-preference 側の指定を上書き） */
  .p-flow[data-mk-flow] .p-flow__arw,
  .p-flow[data-mk-flow].is-in .p-flow__arw {
    transform: none;
  }

  .p-flow__arw {
    align-self: center;
    font-size: 0;
    line-height: 0;
  }

  .p-flow__arw::before {
    content: "\25BC";
    font-size: 20px;
    line-height: var(--lh-tight);
  }
}

/* ==========================================================================
   下層: sample（商品サンプル）
   ========================================================================== */

.p-specstack {
  display: flex;
  flex-direction: column;
  gap: clamp(64px,8vw,104px);
  margin-top: clamp(40px,5vw,64px);
}

/* グループ（有頭 / 無頭）ごとのアクセント色を配下に配布 */

.p-specgroup {
  --speccolor: var(--brand);
}

.p-specgroup--blue {
  --speccolor: var(--accent);
}

/* 実寸比較写真 ＋ 見出し・リード（設備紹介の .p-eqrow と同じ 2 カラム・4:3 フレーム）。
   有頭・無頭で元画像の縦横比が違うため、フレームは 4:3 に固定して枠サイズを揃え、
   えびの全長が切れないよう contain で収める（余白は白＝スキャン地色と同色）。 */

.p-speccard {
  display: grid;
  grid-template-columns: 1.02fr 1fr;
  gap: clamp(28px,4vw,60px);
  align-items: center;
}

.p-speccard__fig {
  margin: 0;
  aspect-ratio: 4/3;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--neutral-000);
}

.p-speccard__fig img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-speccard__lead {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}

/* サイズ表 */

.p-spec-hint {
  display: none;
  font-size: var(--fs-note);
  color: var(--text-muted);
  margin: 0 0 8px;
}

.p-spec-scroll {
  margin-top: clamp(28px,4vw,44px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-md);
  background: var(--neutral-000);
}

.p-spec-scroll:focus-visible {
  outline: 2px solid var(--speccolor);
  outline-offset: 2px;
}

.p-spec {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-family: var(--font-jp);
}

.p-spec th,
.p-spec td {
  padding: 16px 18px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid var(--border-hairline);
  line-height: var(--lh-heading);
}

.p-spec thead th {
  font-weight: var(--fw-black);
  font-size: var(--fs-sm);
  color: #fff;
  background: var(--speccolor);
  border-bottom: none;
  white-space: nowrap;
}

.p-spec thead th:first-child {
  background: color-mix(in srgb, var(--speccolor) 82%, #2A2622);
}

.p-spec tbody th {
  font-weight: var(--fw-bold);
  font-size: var(--fs-sm);
  color: var(--text-heading);
  background: var(--surface-inset);
  text-align: left;
  white-space: nowrap;
}

.p-spec tbody td {
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  color: var(--text-body);
  white-space: nowrap;
}

.p-spec tbody tr:last-child th,
.p-spec tbody tr:last-child td {
  border-bottom: none;
}

/* 規格基準（注記）。リードの下＝写真の横に並ぶ */

.p-specnote {
  margin-top: clamp(20px,2.5vw,28px);
  padding-top: clamp(16px,2vw,22px);
  border-top: 1px solid var(--border-strong);
}

.p-specnote__label {
  font-family: var(--font-jp);
  font-weight: var(--fw-bold);
  font-size: var(--fs-caption);
  color: var(--speccolor);
  margin: 0 0 10px;
}

.p-specnote__list {
  margin: 0;
  padding-left: 1.4em;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.p-specnote__list li {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-note);
  line-height: var(--lh-body);
  color: var(--text-body);
}

/* むき型仕様のご説明 */

.p-peelspec {
  margin-top: clamp(64px,8vw,104px);
  padding-top: clamp(40px,5vw,64px);
  border-top: 1px solid var(--border-strong);
}

.p-peelspec__title {
  display: flex;
  align-items: center;
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(22px,2.6vw,30px);
  color: var(--text-heading);
  line-height: var(--lh-heading);
}

.p-peelspec__body {
  margin-top: clamp(20px,2.5vw,28px);
  padding: clamp(20px,2.6vw,32px);
  background: var(--neutral-000);
  border-radius: var(--radius-md);
}

.p-peelspec__fig {
  margin: 0;
  max-width: 720px;
  margin-inline: auto;
}

.p-peelspec__fig img {
  width: 100%;
  height: auto;
}

.p-peelspec__note {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-note);
  color: var(--text-muted);
  text-align: center;
  margin: 16px 0 0;
}

/* 資料ダウンロード */

.p-dlcard {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: clamp(28px,4vw,56px);
  align-items: center;
  margin-top: clamp(40px,5vw,64px);
  padding: clamp(28px,3.6vw,48px);
  background: var(--surface-cool);
  border-radius: var(--radius-lg);
}

.p-dlcard__cover {
  margin: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--neutral-000);
  box-shadow: var(--shadow-md);
}

.p-dlcard__cover img {
  width: 100%;
  height: auto;
}

.p-dlcard__badge {
  margin-bottom: 16px;
}

.p-dlcard__title {
  font-family: var(--font-jp);
  font-weight: var(--fw-black);
  font-size: clamp(22px,2.6vw,30px);
  color: var(--text-heading);
  margin: 0;
}

.p-dlcard__meta {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-note);
  color: var(--text-muted);
  margin: 10px 0 0;
}

.p-dlcard__btn {
  margin-top: clamp(22px,2.8vw,30px);
}

.p-dlcard__btn .c-btn__ico svg {
  display: block;
}

.p-dl-note {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-note);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: clamp(28px,3.4vw,40px) 0 0;
}

@media (max-width: 900px) {
  .p-dlcard {
    grid-template-columns: 160px 1fr;
  }
}

/* 1 カラム化と見出しサイズは設備紹介（.p-eqrow）の SP 指定に揃える。 */

@media (max-width: 820px) {
  .p-speccard {
    grid-template-columns: 1fr;
    gap: 5vw;
  }

  .p-peelspec__title {
    font-size: 24px;
  }
}

@media (max-width: 640px) {
  .p-spec-hint {
    display: block;
  }

  .p-spec {
    min-width: 620px;
  }

  .p-spec th,
  .p-spec td {
    padding: 14px 14px;
    font-size: 15px;
  }

  .p-specnote {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .p-dlcard {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .p-dlcard__cover {
    max-width: 190px;
  }

  .p-dlcard__body {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}

/* 商品サンプル（規格・資料DL）への導線 */

.p-svc-sample {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(18px,2.2vw,26px);
  margin-top: clamp(56px,7vw,88px);
  padding-top: clamp(40px,5vw,64px);
  border-top: 1px solid var(--border-strong);
}

.p-svc-sample__text {
  font-family: var(--font-jp);
  font-weight: var(--fw-medium);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text-body);
  margin: 0;
}
