/* ============================================================
   SP版：セクションごとの作り込み（900px以下）
   sp.css の土台の上に、節ごとの見せ方を載せる。
   ============================================================ */

@media (max-width: 900px) {

/* ---- 赤ベタコピー ------------------------------------------ */
.sec--copy { background: var(--red); padding-block: var(--s6); }
.sec--copy .a {
  color: #fff; font-size: var(--sp-lead); line-height: 2.1;
  text-align: center; font-weight: 700;
}
.sec--copy .sp-p + .sp-p { margin-top: var(--s3); }

/* ---- OUR BUSINESS（VISION / MISSION / VALUE） --------------- */
.sec--business { padding-block: var(--s6) 0; }
.sec--business .u { margin-top: var(--s6); }
.sec--business .u--head { margin-top: 0; }
/* 透かしロゴは薄い装飾。SPでは主張させずラベルの上に小さく置く */
.sec--business .b.op30 {
  width: 8rem; aspect-ratio: 1; opacity: .28;
  margin-bottom: calc(var(--s3) * -1);
}
.sec--business .b.op30 > img { object-fit: contain; }
.sec--business .ol svg { fill: #fff; height: 2rem; }
.sec--business .a.w8 { color: var(--ink-3); }

/* VALUE の3語。PCの重ね表現はSPで成立しないので、明朝＋角ゴを1行に並べる */
.sec--business .u--value { display: flex; flex-wrap: wrap; align-items: baseline; }
.sec--business .u--value .fill.value-plate { display: none; }
.sec--business .u--value .a.mincho,
.sec--business .u--value .a.w7.gray {
  display: inline-block; width: auto; padding-inline: 0; margin-top: 0;
}
.sec--business .u--value .a.mincho {
  font-family: var(--mincho); font-weight: 800;
  font-size: 3.6rem; line-height: 1.25; color: var(--red);
  margin-inline-start: var(--sp-pad);
}
.sec--business .u--value .a.w7.gray {
  font-size: 2.4rem; line-height: 1.25; color: var(--ink-3); font-weight: 700;
}
/* 語ごとに改行させる（明朝の前で行を折る） */
.sec--business .u--value > [data-o="5"],
.sec--business .u--value > [data-o="8"],
.sec--business .u--value > [data-o="11"] { margin-top: var(--s3); }
.sec--business .u--value > [data-o="5"]::before,
.sec--business .u--value > [data-o="8"]::before,
.sec--business .u--value > [data-o="11"]::before {
  content: ""; display: block; width: 100vw; height: 0;
}
.sec--business .u--value > [data-o="13"],
.sec--business .u--value > [data-o="14"] { width: 100%; margin-top: var(--s4); }

/* ---- MERIT --------------------------------------------------- */
.sec--merit { background: var(--red); padding-block: var(--s6); }
.sec--merit .a.dl { color: var(--base); }
.sec--merit .a.r.disp { color: var(--base); }
.sec--merit .u--merit { margin-top: var(--s6); }
.sec--merit .u--merit .a.disp.dl { color: #fff; font-size: 5.6rem; }
.sec--merit .u--merit .fill { display: none; }
.sec--merit .a.w8.red {
  display: block; background: #fff; color: var(--red);
  font-size: 1.9rem; font-weight: 800; line-height: 1.5;
  padding: 1rem 1.6rem; margin-inline: var(--sp-pad);
  border-radius: .4rem; text-align: center;
}
.sec--merit .a.w5 { color: #fff; }
.sec--merit .u--merit .b { margin-top: var(--s4); aspect-ratio: 16 / 10; }

/* ---- ONE DAY SCHEDULE ---------------------------------------
   PCの中央スパインは狭い画面で成立しない。左レール型にする */
.sec--oneday .a.dl { color: var(--red); }
.sec--oneday .u--head .a.disp.dl { color: var(--ink); }
.sec--oneday .u--lead { order: 1; margin-top: var(--s4); }
.sec--oneday .u--lead .a { color: var(--ink-3); }

.sec--oneday .u--step {
  position: relative; margin-top: var(--s4);
  padding-inline: 0; padding-left: 5.2rem;
}
.sec--oneday .u--step::before {           /* レールの縦線 */
  content: ""; position: absolute; left: 2.6rem; top: 0;
  bottom: calc(var(--s4) * -1); width: .2rem; background: rgba(0,0,0,.16);
}
.sec--oneday .u--step:last-of-type::before { bottom: auto; height: 2.4rem; }
.sec--oneday .u--step::after {            /* レール上の点 */
  content: ""; position: absolute; left: 2rem; top: 1.4rem;
  width: 1.4rem; height: 1.4rem; border-radius: 50%;
  background: var(--red); border: .3rem solid var(--base);
}
.sec--oneday .u--step > * { padding-inline: 0; margin-top: var(--s2); }
.sec--oneday .u--step .a.c.white {        /* 時刻 */
  order: 1; align-self: start; margin-top: 0;
  display: inline-block; width: auto;
  background: var(--red); color: #fff;
  font-size: var(--sp-caption); font-weight: 700; letter-spacing: .12em;
  padding: .5rem 1.2rem; border-radius: 1.4rem;
}
.sec--oneday .u--step .a.c.w6.white {     /* 見出し */
  order: 2; color: var(--ink); font-size: 1.9rem; font-weight: 700; line-height: 1.5;
}
.sec--oneday .u--step .a.c.w3.white {     /* 説明 */
  order: 3; color: var(--ink-3); font-size: 1.4rem; line-height: 1.9;
}
.sec--oneday .u--step .b {
  order: 4; aspect-ratio: 16 / 10; border-radius: .6rem;
  width: calc(100% + var(--sp-pad)); margin-right: calc(var(--sp-pad) * -1);
}

/* ---- MEMBER --------------------------------------------------
   全幅の縦写真 → 氏名を写真の下端に重ねる（PC版の重ね言語を継承） */
.sec--member { background: var(--red); padding-block: var(--s6) 0; }
.sec--member .a.dl { color: var(--base); }
.sec--member .a.r.disp { color: var(--base); }
.sec--member .u--member { margin-top: var(--s6); }
.sec--member .u--member .fill { display: none; }
.sec--member .u--member .b { order: 1; aspect-ratio: 3 / 4; }
.sec--member .u--member .a.disp.gray {
  order: 2; color: var(--pale); font-size: 4.4rem; line-height: 1;
  margin-top: -2.8rem; position: relative;
}
.sec--member .u--member .a.w5.pale { order: 3; color: var(--pale); margin-top: var(--s3); }
.sec--member .u--member:last-of-type { padding-bottom: var(--s6); }

/* ---- MESSAGE -------------------------------------------------- */
.sec--message .a.dl { color: var(--red); }
.sec--message .u--message { margin-top: var(--s5); }
.sec--message .u--message .b { order: 1; aspect-ratio: 3 / 4; }
.sec--message .u--message h3.a.w7.red {
  order: 2; color: var(--red); font-size: var(--sp-statement);
  line-height: 1.5; margin-top: var(--s4);
}
.sec--message .u--message .a.w5 { order: 3; }

/* ---- 会社概要 -------------------------------------------------- */
.sec--company .a.dl { color: var(--red); }
.corp { position: static; width: auto; margin-top: var(--s5); }
.corp dl { display: block; margin: 0; }
.corp dt {
  display: block; width: auto; background: var(--red); color: #fff;
  font-size: var(--sp-caption); font-weight: 700; line-height: 1.6;
  letter-spacing: .08em; padding: .6rem 1.2rem;
  border-radius: .3rem; margin-top: var(--s3);
}
.corp dd {
  display: block; width: auto; background: none; color: var(--ink-3);
  font-size: 1.4rem; line-height: 1.9; padding: var(--s1) .2rem 0; margin: 0;
}

/* ---- FLOW ------------------------------------------------------ */
.sec--flow .a.dl { color: var(--red); }
.flow { position: static; display: grid; gap: var(--s3); margin-top: var(--s5); padding: 0; }
.flow li {
  position: static; width: auto; transform: none; translate: none;
  display: grid; grid-template-columns: 6.4rem 1fr;
  align-items: center; gap: var(--s2); text-align: left;
}
.flow__circle { width: 6.4rem; height: 6.4rem; margin: 0; }
.flow__circle img { width: 3.6rem; }
.flow__step  { margin: 0; font-size: var(--sp-caption); color: var(--gray-label); line-height: 1.4; }
.flow__label { margin: .2rem 0 0; font-size: 2rem; line-height: 1.3; }

/* ---- Q&A -------------------------------------------------------- */
.sec--qa .a.dl { color: var(--red); }
.qa { position: static; width: auto; margin-top: var(--s5); }
.qa details { margin-bottom: var(--s2); }
.qa summary {
  height: auto; min-height: 5.6rem; padding: 1.4rem 1.6rem;
  font-size: var(--sp-body); letter-spacing: .04em; line-height: 1.6;
}
.qa .qa__a {
  min-height: 0; padding: 1.6rem; font-size: 1.4rem;
  line-height: 1.9; letter-spacing: .04em;
}

/* ---- ENTRY ------------------------------------------------------ */
.sec--entry { text-align: center; }
.sec--entry .a.dl { color: var(--red); }
.sec--entry .a { text-align: center; }
.sec--entry .cta {
  position: static; display: flex; align-items: center; justify-content: center;
  gap: var(--s2); width: auto; height: auto; min-height: 6.4rem;
  margin: var(--s3) var(--sp-pad) 0; padding: 1.2rem 2rem; border-radius: 3.2rem;
}
.cta__logo  { position: static; width: 3.2rem; height: 3.2rem; flex: none; }
.cta__arrow { position: static; width: 1.6rem; height: 2.4rem; flex: none; }
.cta__txt {
  position: static; width: auto; text-align: left;
  font-size: var(--sp-body); line-height: 1.5; letter-spacing: .04em;
}

/* ---- フッター ---------------------------------------------------- */
.sec--footer { background: var(--pale); padding: var(--s5) 0 0; text-align: center; }
.sec--footer .foot, .sec--footer .foot__bar {
  position: static; width: auto; height: auto;
}
.sec--footer .b { width: 16rem; margin: 0 auto; aspect-ratio: auto; }
.sec--footer .b img { height: auto; object-fit: contain; }
.sec--footer .a { font-size: var(--sp-caption); text-align: center; }
.sec--footer nav { display: grid; margin-top: var(--s4); }
.sec--footer .ol.foot-link { display: block; padding: 1.3rem 0; }   /* タップ領域 */
.sec--footer .ol svg { height: 1.8rem; margin: 0 auto; display: block; }
.sec--footer .foot__bar { background: var(--red); margin-top: var(--s4); padding: 1.6rem 0; }

/* ---- 出現演出：SPは短く、種類を絞る ------------------------------ */
.js .sec [data-rv] { transition-duration: .6s; }
.js .sec [data-rv="wipe-up"] { transition-duration: .7s; }
.js .sec [data-rv="reveal"], .js .sec [data-rv="reveal"] > img { transition-duration: .8s; }
/* 拡大＋ボケの「一撃」はSPでは重いので、素直に出す */
.js .sec [data-rv="punch"] { filter: none; scale: 1; transition-duration: .6s; }
.js .sec [data-rv="punch"].is-in { filter: none; scale: 1; }

} /* @media */