@charset "UTF-8";

/* 予約配車システム『オンデマンドバス予報』（/mobility/demand/）
   2026-09-18 リニューアル版
   旧デザインは on-demand-busyohou-old.css を参照
================================================== */

:root {
  --mh--breakpoint--min: 375px;
  --mh--breakpoint--sm: 640px;
  --mh--breakpoint--md: 768px;
  --mh--breakpoint--lg: 1100px;
  --mh--breakpoint--xl: 1280px;
  --mh--breakpoint--x2l: 1450px;
}

body#demand {
  /* ページ固有のローカルトークン */
  --odb--color--leaf: rgb(231 246 227);
  --odb--color--leaf-deep: rgb(227 242 223);
  --odb--color--mint: rgb(214 250 246);
  --odb--color--mint-deep: rgb(196 243 237);
  --odb--color--alert-bg: rgb(255 231 231);
  --odb--color--alert-txt: rgb(234 83 82);
  --odb--card-radius: 8px;

  background: var(--mh--color--grayscale-100);
}

/* .l-sub-img-ondemand（MV / header.php）
================================================== */

/* 固定ヘッダーの高さ分を空けて、パンくず・見出しが重ならないようにする */
.l-sub-img-ondemand {
  overflow: clip;
  padding-top: var(--mh--header--height);
  position: relative;
  z-index: 0;
  background-color: rgb(220 242 251);
}

.l-sub-img-ondemand__bg {
  inset: 0;
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

/* SP：イラストが文字に重ならないよう、画像は比率を保ったまま下端に配置（上部は背景色でつなぐ） */
.l-sub-img-ondemand__bg img {
  display: block;
  width: 100%;
  height: auto;
  bottom: 0;
  left: 0;
  position: absolute;
}

.l-sub-img-ondemand__breadcrumb {
  position: relative;
  z-index: 2;
  padding-block: 15px;
  background-color: rgb(214 238 249 / 55%);
}

.l-sub-img-ondemand__inner {
  padding-top: 30px;
  /* 画像下部のイラスト（バス・人物）がボタンの下に見える高さを確保 */
  padding-bottom: 62vw;
  position: relative;
  z-index: 1;
}

.l-sub-img-ondemand__label {
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--primary-500);
}

.l-sub-img-ondemand__head {
  margin-top: 8px;
  font-size: var(--mh--font-size--x8l);
  line-height: var(--mh--line-height--xs);
  color: var(--mh--color--secondary-500);
}

.l-sub-img-ondemand__badge {
  display: inline-block;
  margin-top: 20px;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  background-color: var(--mh--color--grayscale-100);
  color: var(--mh--color--secondary-500);
}

.l-sub-img-ondemand__lead {
  margin-top: 20px;
  font-size: var(--mh--font-size--xl);
  line-height: var(--mh--line-height--smd);
  color: var(--mh--color--secondary-500);
}

.l-sub-img-ondemand__txt {
  margin-top: 15px;
  font-size: var(--mh--font-size--sm);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.l-sub-img-ondemand__btn-list {
  display: flex;
  margin-top: 30px;
  flex-direction: column;
  gap: 10px;
}

@media (width >= 768px ) {
  .l-sub-img-ondemand__bg picture,
  .l-sub-img-ondemand__bg img {
    width: 100%;
    display: block;
    height: 100%;
    position: static;
    object-fit: cover;
    object-position: center bottom;
  }
  .l-sub-img-ondemand__breadcrumb {
    padding-block: 20px;
    background-color: transparent;
  }
  .l-sub-img-ondemand__inner {
    padding-top: 60px;
    padding-bottom: 130px;
  }
  .l-sub-img-ondemand__content {
    width: min(48%, 740px);
  }
  .l-sub-img-ondemand__label {
    font-size: var(--mh--font-size--xl);
  }
  .l-sub-img-ondemand__head {
    margin-top: 12px;
    font-size: var(--mh--font-size--x11l);
  }
  .l-sub-img-ondemand__badge {
    margin-top: 28px;
    padding: 12px 28px;
    font-size: var(--mh--font-size--x2l);
  }
  .l-sub-img-ondemand__lead {
    margin-top: 28px;
    font-size: var(--mh--font-size--x2l);
  }
  .l-sub-img-ondemand__txt {
    margin-top: 20px;
    font-size: var(--mh--font-size--md);
  }
  .l-sub-img-ondemand__btn-list {
    flex-direction: row;
    margin-top: 40px;
    gap: 16px;
  }
  .l-sub-img-ondemand__btn-item {
    flex: 0 0 auto;
  }
  .l-sub-img-ondemand__btn-item .c-btn01__in {
    min-width: 320px;
  }
}

/* .on-demand-busyohou-index
================================================== */

.on-demand-busyohou-index {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--primary-500);
  background-image: url("../img/common/bg_pattern03_sp.jpg");
  background-repeat: repeat-y;
  background-position: top;
  background-size: 100%;
}

.on-demand-busyohou-index__inner {
  padding-top: 30px;
  padding-bottom: 30px;
}

@media (width >= 768px ) {
  .on-demand-busyohou-index {
    background-image: url("../img/common/bg_pattern03_pc.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  }
  .on-demand-busyohou-index__inner {
    padding-top: 78px;
    padding-bottom: 78px;
  }
}

/* 見出し共通（各セクションの En 見出し＋リード）
================================================== */

.on-demand-busyohou-concept__head-area,
.on-demand-busyohou-types__head-area,
.on-demand-busyohou-works__head-area,
.on-demand-busyohou-story__head-area,
.on-demand-busyohou-data__head-area,
.on-demand-busyohou-cycle__head-area,
.on-demand-busyohou-subsidy__head-area,
.on-demand-busyohou-features__head-area {
  margin-top: 20px;
}

/* 「Sustainability」は長く、SPで単語の途中で折り返すため画面幅に合わせて縮める */
@media (max-width: 767px) {
  .on-demand-busyohou-subsidy__head .c-head02__en {
    font-size: min(var(--mh--font-size--x13l), 9.2vw);
  }
}

.on-demand-busyohou-concept__lead,
.on-demand-busyohou-types__lead,
.on-demand-busyohou-works__lead,
.on-demand-busyohou-story__lead,
.on-demand-busyohou-data__lead,
.on-demand-busyohou-cycle__lead,
.on-demand-busyohou-subsidy__lead,
.on-demand-busyohou-features__lead,
.on-demand-busyohou-about__lead {
  font-size: var(--mh--font-size--x5l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-concept__txt,
.on-demand-busyohou-types__txt,
.on-demand-busyohou-works__txt,
.on-demand-busyohou-story__txt,
.on-demand-busyohou-data__txt,
.on-demand-busyohou-cycle__txt,
.on-demand-busyohou-subsidy__txt,
.on-demand-busyohou-features__txt,
.on-demand-busyohou-about__txt {
  margin-top: 20px;
  font-size: var(--mh--font-size--sm);
  font-weight: var(--mh--font-weight--medium);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-story__catch,
.on-demand-busyohou-subsidy__catch,
.on-demand-busyohou-features__catch {
  margin-top: 25px;
  font-size: var(--mh--font-size--x3l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-about__accent,
.on-demand-busyohou-concept__accent,
.on-demand-busyohou-types__accent,
.on-demand-busyohou-works__accent,
.on-demand-busyohou-story__accent,
.on-demand-busyohou-data__accent,
.on-demand-busyohou-cycle__accent,
.on-demand-busyohou-subsidy__accent,
.on-demand-busyohou-features__accent,
.on-demand-busyohou-flow__accent {
  color: var(--mh--color--primary-500);
}

@media (width >= 768px ) {
  /* パターンA：En 見出しの右にリード＋本文を並べる */
  .on-demand-busyohou-concept__head-area,
  .on-demand-busyohou-types__head-area,
  .on-demand-busyohou-works__head-area,
  .on-demand-busyohou-cycle__head-area {
    display: grid;
    margin-top: -100px;
    align-items: start;
    grid-template-columns: 1fr 1fr;
    column-gap: 60px;
  }
  /* パターンB：左列＝En 見出し＋リード、右列＝本文（En 見出しの天と揃える）。列幅はパターンAと共通 */
  .on-demand-busyohou-story__head-area,
  .on-demand-busyohou-data__head-area,
  .on-demand-busyohou-subsidy__head-area,
  .on-demand-busyohou-features__head-area {
    display: grid;
    margin-top: -100px;
    align-items: start;
    grid-template-columns: 1fr 1fr;
    column-gap: 60px;
  }
  .on-demand-busyohou-story__head-area > .on-demand-busyohou-story__lead,
  .on-demand-busyohou-data__head-area > .on-demand-busyohou-data__lead,
  .on-demand-busyohou-subsidy__head-area > .on-demand-busyohou-subsidy__lead,
  .on-demand-busyohou-features__head-area > .on-demand-busyohou-features__lead {
    margin-top: 150px;
    grid-column: 1;
    grid-row: 1;
  }
  .on-demand-busyohou-concept__lead,
  .on-demand-busyohou-types__lead,
  .on-demand-busyohou-works__lead,
  .on-demand-busyohou-story__lead,
  .on-demand-busyohou-data__lead,
  .on-demand-busyohou-cycle__lead,
  .on-demand-busyohou-subsidy__lead,
  .on-demand-busyohou-features__lead,
  .on-demand-busyohou-about__lead {
    font-size: var(--mh--font-size--x6l);
  }
  .on-demand-busyohou-concept__head-area > .on-demand-busyohou-concept__lead,
  .on-demand-busyohou-types__head-area > .on-demand-busyohou-types__lead,
  .on-demand-busyohou-works__head-area > .on-demand-busyohou-works__lead,
  .on-demand-busyohou-cycle__head-area > .on-demand-busyohou-cycle__lead {
    grid-column: 2;
    grid-row: 1;
  }
  .on-demand-busyohou-concept__txt,
  .on-demand-busyohou-types__txt,
  .on-demand-busyohou-works__txt,
  .on-demand-busyohou-story__txt,
  .on-demand-busyohou-data__txt,
  .on-demand-busyohou-cycle__txt,
  .on-demand-busyohou-subsidy__txt,
  .on-demand-busyohou-features__txt,
  .on-demand-busyohou-about__txt {
    margin-top: 24px;
    font-size: var(--mh--font-size--md);
  }
  .on-demand-busyohou-concept__head-area > .on-demand-busyohou-concept__txt,
  .on-demand-busyohou-types__head-area > .on-demand-busyohou-types__txt,
  .on-demand-busyohou-works__head-area > .on-demand-busyohou-works__txt,
  .on-demand-busyohou-cycle__head-area > .on-demand-busyohou-cycle__txt {
    grid-column: 2;
    grid-row: 2;
  }
  .on-demand-busyohou-subsidy__head-body,
  .on-demand-busyohou-story__body,
  .on-demand-busyohou-data__head-body,
  .on-demand-busyohou-features__head-body {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    gap: 24px;
  }
  .on-demand-busyohou-subsidy__head-area .on-demand-busyohou-subsidy__head-body > *,
  .on-demand-busyohou-story__head-area .on-demand-busyohou-story__body > *,
  .on-demand-busyohou-data__head-area .on-demand-busyohou-data__head-body > *,
  .on-demand-busyohou-features__head-area .on-demand-busyohou-features__head-body > * {
    margin-top: 0;
  }
  .on-demand-busyohou-story__catch,
  .on-demand-busyohou-subsidy__catch,
  .on-demand-busyohou-features__catch {
    font-size: var(--mh--font-size--x5l);
  }
}

/* .on-demand-busyohou-about
================================================== */

.on-demand-busyohou-about {
  overflow: clip;
  position: relative;
  z-index: 1;
  background-color: var(--odb--color--leaf);
}

.on-demand-busyohou-about__inner {
  padding-top: 40px;
  padding-bottom: 0;
  position: relative;
  z-index: 1;
}

.on-demand-busyohou-about__body {
  margin-top: 25px;
}

.on-demand-busyohou-about__problem-list {
  display: grid;
  margin-top: 50px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 15px;
}

.on-demand-busyohou-about__problem-item {
  padding: 20px 15px 24px;
  border-radius: var(--odb--card-radius);
  position: relative;
  box-shadow: 0 4px 20px rgb(51 51 51 / 8%);
  background-color: var(--mh--color--grayscale-100);
  text-align: center;
}

.on-demand-busyohou-about__problem-item::after {
  content: "";
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  width: 22px;
  height: 14px;
  position: absolute;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-about__problem-img {
  width: 90px;
  margin-inline: auto;
}

.on-demand-busyohou-about__problem-img img {
  width: 100%;
  height: auto;
}

.on-demand-busyohou-about__problem-head {
  margin-top: 10px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-about__problem-txt {
  margin-top: 10px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
  text-align: left;
}

.on-demand-busyohou-about__chip-list {
  display: flex;
  margin-top: 30px;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.on-demand-busyohou-about__chip {
  width: 100%;
  padding: 14px 20px;
  border-radius: var(--odb--card-radius);
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  background-color: var(--mh--color--primary-500);
  color: var(--mh--color--grayscale-100);
  text-align: center;
}

.on-demand-busyohou-about__conclusion {
  margin-top: -30px;
  padding: 55px var(--mh--contents--padding--side) 50px;
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 白い円弧。border-radius だと楕円になるため、正円の疑似要素で描く */
.on-demand-busyohou-about__conclusion::before {
  content: "";
  width: 170%;
  aspect-ratio: 1;
  border-radius: 50%;
  inset-block-start: 0;
  left: 50%;
  position: absolute;
  z-index: -1;
  transform: translateX(-50%);
  background-color: var(--mh--color--grayscale-100);
  pointer-events: none;
}

.on-demand-busyohou-about__conclusion-txt {
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
  text-align: center;
  /* 「車／両」のような語の途中で折り返さず、行の長さもそろえる */
  word-break: auto-phrase;
  text-wrap: balance;
}

/* 「それが、オンデマンドバス予報の出発点です。」：画面中央に来たらマーカーを引く（js/demand.js が is-marked を付ける） */
.on-demand-busyohou-about__marker {
  padding-inline: 0.1em;
  background-image: linear-gradient(transparent 60%, var(--odb--color--mint-deep) 60%);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 0% 100%;
  transition: background-size 1.2s cubic-bezier(0.25, 1, 0.5, 1);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.on-demand-busyohou-about__marker.is-marked {
  background-size: 100% 100%;
}

@media (width >= 768px ) {
  .on-demand-busyohou-about__inner {
    padding-top: 80px;
    padding-bottom: 0;
  }
  .on-demand-busyohou-about__body {
    display: grid;
    margin-top: -100px;
    align-items: start;
    grid-template-columns: 1fr 1fr;
    column-gap: 60px;
  }
  .on-demand-busyohou-about__body > .on-demand-busyohou-about__lead {
    grid-column: 2;
  }
  .on-demand-busyohou-about__body > .on-demand-busyohou-about__txt {
    grid-column: 2;
  }
  .on-demand-busyohou-about__problem-list {
    max-width: 1400px;
    margin: 100px auto 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 40px;
  }
  .on-demand-busyohou-about__problem-item {
    padding: 30px 25px 30px;
  }
  .on-demand-busyohou-about__problem-item::after {
    width: 30px;
    height: 18px;
    bottom: -18px;
  }
  .on-demand-busyohou-about__problem-img {
    width: 130px;
  }
  .on-demand-busyohou-about__problem-head {
    margin-top: 16px;
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-about__problem-txt {
    margin-top: 14px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-about__chip-list {
    flex-direction: row;
    justify-content: center;
    margin-top: 45px;
    gap: 20px;
  }
  .on-demand-busyohou-about__chip {
    width: auto;
    padding: 18px 30px;
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-about__conclusion {
    margin-top: -100px;
    padding: 130px 20px 90px;
    gap: 30px;
  }
  .on-demand-busyohou-about__conclusion-txt {
    font-size: var(--mh--font-size--x6l);
  }
}

/* .on-demand-busyohou-concept
================================================== */

.on-demand-busyohou-concept {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-concept__inner {
  padding-top: 40px;
  padding-bottom: 60px;
}

.on-demand-busyohou-concept__list {
  display: grid;
  margin-top: 30px;
  gap: 10px;
}

/* 1 項目 ＝ 画像セル＋文言セルのペア。hover はこの li 単位で効かせる */
.on-demand-busyohou-concept__item {
  display: grid;
  gap: 10px;
}

.on-demand-busyohou-concept__item-body {
  display: flex;
  padding: 20px 16px;
  border-radius: var(--odb--card-radius);
  flex-direction: column;
  justify-content: center;
  background-color: var(--mh--color--surface-600);
}

.on-demand-busyohou-concept__item-img {
  overflow: clip;
  padding: 16px;
  border-radius: var(--odb--card-radius);
  grid-row: 1;
  background-color: var(--odb--color--mint);
}

.on-demand-busyohou-concept__item-img img {
  width: 100%;
  height: 160px;
  object-fit: contain;
}

.on-demand-busyohou-concept__item-head {
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-concept__item-txt {
  margin-top: 12px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

/* 画像・文言のどちらにホバーしても両セルが紺色に変わり、画像が少し拡大する */
@media (hover: hover) and (pointer: fine) {
  .on-demand-busyohou-concept__item-body,
  .on-demand-busyohou-concept__item-img {
    transition: background-color var(--mh--duration) var(--mh--easing);
  }
  .on-demand-busyohou-concept__item-head,
  .on-demand-busyohou-concept__item-txt,
  .on-demand-busyohou-concept__accent {
    transition: color var(--mh--duration) var(--mh--easing);
  }
  .on-demand-busyohou-concept__item-img img {
    transition: transform var(--mh--duration-slow) var(--mh--easing);
  }
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__item-body,
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__item-img {
    background-color: var(--mh--color--primary-500);
  }
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__item-head,
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__item-txt {
    color: var(--mh--color--grayscale-100);
  }
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__accent {
    color: var(--odb--color--mint);
  }
  .on-demand-busyohou-concept__item:hover .on-demand-busyohou-concept__item-img img {
    transform: scale(1.06);
  }
}

.on-demand-busyohou-concept__item.is-summary {
  padding: 20px 16px;
  border-radius: var(--odb--card-radius);
  align-content: center;
  background-color: var(--mh--color--secondary-500);
  color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-concept__summary-head {
  font-size: var(--mh--font-size--x3l);
  line-height: var(--mh--line-height--sm);
}

.on-demand-busyohou-concept__summary-txt {
  margin-top: 14px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

@media (width >= 768px ) {
  .on-demand-busyohou-concept__inner {
    padding-top: 80px;
    padding-bottom: 140px;
  }
  .on-demand-busyohou-concept__list {
    margin-top: 80px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 275px;
  }
  .on-demand-busyohou-concept__item {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
  }
  /* 既定は文言が左、画像が右 */
  .on-demand-busyohou-concept__item-body {
    grid-column: 1;
    grid-row: 1;
  }
  .on-demand-busyohou-concept__item-img {
    grid-column: 2;
    grid-row: 1;
  }
  /* 画像を左、文言を右に入れ替える */
  .on-demand-busyohou-concept__item.is-reverse .on-demand-busyohou-concept__item-img {
    grid-column: 1;
  }
  .on-demand-busyohou-concept__item.is-reverse .on-demand-busyohou-concept__item-body {
    grid-column: 2;
    grid-row: 1;
  }
  .on-demand-busyohou-concept__item-body {
    padding: 30px;
  }
  .on-demand-busyohou-concept__item-img {
    padding: 20px;
  }
  .on-demand-busyohou-concept__item-img img {
    height: 100%;
  }
  .on-demand-busyohou-concept__item.is-summary {
    padding: 30px;
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .on-demand-busyohou-concept__item-head {
    font-size: var(--mh--font-size--x3l);
  }
  .on-demand-busyohou-concept__item-txt {
    margin-top: 16px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-concept__summary-head {
    font-size: var(--mh--font-size--x4l);
  }
  .on-demand-busyohou-concept__summary-txt {
    margin-top: 18px;
    font-size: var(--mh--font-size--xs);
  }
}

/* .on-demand-busyohou-types
================================================== */

.on-demand-busyohou-types {
  overflow: clip;
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-types__inner {
  padding-top: 40px;
  padding-bottom: 40px;
}

.on-demand-busyohou-types__list {
  display: grid;
  margin-top: 30px;
  gap: 26px;
}

.on-demand-busyohou-types__item {
  overflow: hidden;
  display: flex;
  border: 1px solid var(--mh--color--grayscale-500);
  border-radius: var(--odb--card-radius);
  flex-direction: column;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-types__item-img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 26 / 14;
  object-fit: cover;
}

.on-demand-busyohou-types__item-body {
  display: flex;
  padding: 20px;
  flex: 1;
  flex-direction: column;
}

.on-demand-busyohou-types__item-head {
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-types__item-sub {
  margin-top: 8px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-types__item-txt {
  margin: 16px 0;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-types__item-case {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid var(--mh--color--grayscale-500);
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-types__item-case-label {
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-types__conclusion,
.on-demand-busyohou-works__conclusion {
  margin-top: 50px;
  text-align: center;
  /* 語の途中で折り返さず、行の長さもそろえる */
  word-break: auto-phrase;
  text-wrap: balance;
}

.on-demand-busyohou-types__conclusion-head,
.on-demand-busyohou-works__conclusion-head {
  font-size: var(--mh--font-size--x4l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-types__conclusion-txt,
.on-demand-busyohou-works__conclusion-txt {
  margin-top: 14px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-types__band {
  margin-top: 20px;
  line-height: 0;
  text-align: center;
}

.on-demand-busyohou-types__band img {
  width: 1000px;
  max-width: none;
  height: auto;
}

@media (width >= 768px ) {
  .on-demand-busyohou-types__inner {
    padding-top: 80px;
    padding-bottom: 60px;
  }
  .on-demand-busyohou-types__list {
    margin-top: 90px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .on-demand-busyohou-types__item-body {
    padding: 30px;
  }
  .on-demand-busyohou-types__item-head {
    font-size: var(--mh--font-size--x3l);
  }
  .on-demand-busyohou-types__item-sub {
    margin-top: 10px;
    font-size: var(--mh--font-size--lg);
  }
  .on-demand-busyohou-types__item-txt {
    margin: 24px 0;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-types__item-case {
    margin-top: auto;
    padding-top: 24px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-types__conclusion,
  .on-demand-busyohou-works__conclusion {
    margin-top: 90px;
  }
  .on-demand-busyohou-types__conclusion-head,
  .on-demand-busyohou-works__conclusion-head {
    font-size: var(--mh--font-size--x5l);
  }
  .on-demand-busyohou-types__conclusion-txt,
  .on-demand-busyohou-works__conclusion-txt {
    margin-top: 20px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-types__band {
    margin-top: 10px;
  }
  .on-demand-busyohou-types__band img {
    width: 100%;
    min-width: 1280px;
  }
}

/* .on-demand-busyohou-features（c-features01 拡張）
================================================== */

.on-demand-busyohou-features {
  background-color: var(--odb--color--leaf);
}

.on-demand-busyohou-features__head-body {
  margin-top: 20px;
}

.on-demand-busyohou-features .c-features01__img {
  padding: 20px;
  border-radius: var(--odb--card-radius);
  background-color: var(--mh--color--grayscale-100);
}

@media (width >= 768px ) {
  /* 偶数番目は画像を左に置いて交互レイアウトにする */
  .on-demand-busyohou-features .c-features01__item:nth-child(even) {
    grid-template-areas: "img hg" "img txt";
  }
}

@media (width >= 768px ) {
  .on-demand-busyohou-features__head-body {
    margin-top: 0;
  }
}

/* .on-demand-busyohou-users（Features 内：利用イメージ）
   画面デザインは変更予定のため、手順説明ではなく「利用イメージ」として小さめに掲載
================================================== */

.on-demand-busyohou-users {
  margin-top: 50px;
  padding: 30px 20px;
  border-radius: var(--odb--card-radius);
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-users__en {
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--xs);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-users__title {
  margin-top: 15px;
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-users__accent {
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-users__txt {
  margin-top: 15px;
  font-size: var(--mh--font-size--sm);
  font-weight: var(--mh--font-weight--medium);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

/* SP：2列 × 2段 */
.on-demand-busyohou-users__list {
  display: grid;
  margin-top: 30px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 15px;
}

.on-demand-busyohou-users__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.on-demand-busyohou-users__img {
  display: flex;
  width: 100%;
  max-width: 140px;
  justify-content: center;
}

.on-demand-busyohou-users__img img {
  width: 100%;
  height: auto;
}

/* 01 はボタンが左右にはみ出す分だけ縦横比が低い（800×1207）。
   他の画像（800×1314）と高さをそろえるため、1314/1207 倍の幅で表示する */
.on-demand-busyohou-users__img.is-wide img {
  width: 108.9%;
  max-width: none;
}

.on-demand-busyohou-users__step {
  margin-top: 15px;
  font-size: var(--mh--font-size--xs);
  line-height: var(--mh--line-height--xs);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-users__caption {
  margin-top: 6px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
  /* SP の狭い列で文節の途中改行を避ける */
  word-break: auto-phrase;
}

.on-demand-busyohou-users__note {
  margin-top: 30px;
  font-size: var(--mh--font-size--x3s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-800);
}

@media (width >= 768px ) {
  .on-demand-busyohou-users {
    margin-top: 100px;
    padding: 64px 80px;
  }
  .on-demand-busyohou-users__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 80px;
    align-items: end;
  }
  .on-demand-busyohou-users__title {
    margin-top: 20px;
    font-size: var(--mh--font-size--x6l);
  }
  .on-demand-busyohou-users__txt {
    margin-top: 0;
    font-size: var(--mh--font-size--md);
  }
  /* PC：4ステップを横並び、間に矢印 */
  .on-demand-busyohou-users__list {
    margin-top: 48px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 40px;
  }
  .on-demand-busyohou-users__item {
    position: relative;
  }
  .on-demand-busyohou-users__item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 140px;
    right: -26px;
    border-block: 8px solid transparent;
    border-left: 12px solid var(--mh--color--primary-500);
  }
  .on-demand-busyohou-users__img {
    max-width: 180px;
  }
  .on-demand-busyohou-users__step {
    margin-top: 20px;
    font-size: var(--mh--font-size--md);
  }
  .on-demand-busyohou-users__caption {
    font-size: var(--mh--font-size--lg);
  }
  .on-demand-busyohou-users__note {
    margin-top: 48px;
    text-align: center;
  }
}

/* .on-demand-busyohou-works
================================================== */

.on-demand-busyohou-works {
  overflow: clip;
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-works__inner {
  padding-top: 40px;
  padding-bottom: 60px;
}

/* 代表事例：画像と本文を1枚の白カードにまとめる */
.on-demand-busyohou-works__main {
  overflow: clip;
  margin-top: 40px;
  padding: 20px;
  border: 1px solid var(--mh--color--grayscale-500);
  border-radius: 12px;
  position: relative;
  z-index: 1;
  box-shadow: 0 4px 30px rgb(0 0 0 / 25%);
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-works__main-img img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--odb--card-radius);
  aspect-ratio: 16 / 11;
  object-fit: cover;
}

.on-demand-busyohou-works__main-img + .on-demand-busyohou-works__main-body {
  margin-top: 20px;
}

.on-demand-busyohou-works__main-label {
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-works__main-head {
  margin-top: 6px;
  font-size: var(--mh--font-size--x3l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-works__tag-list {
  display: flex;
  margin-top: 14px;
  flex-wrap: wrap;
  gap: 8px;
}

.on-demand-busyohou-works__tag {
  display: inline-block;
  padding: 6px 12px;
  border-radius: var(--mh--border-radius--md);
  font-size: var(--mh--font-size--x3s);
  line-height: var(--mh--line-height--sm);
  background-color: var(--mh--color--secondary-200);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-works__tag.is-accent {
  background-color: var(--odb--color--alert-bg);
  color: var(--odb--color--alert-txt);
}

.on-demand-busyohou-works__detail-list {
  display: grid;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--mh--color--grayscale-500);
  gap: 24px;
}

.on-demand-busyohou-works__detail-num {
  font-size: var(--mh--font-size--xl);
  line-height: var(--mh--line-height--xs);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-works__detail-head {
  margin-top: 8px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-works__detail-txt {
  margin-top: 10px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-works__sub-head {
  margin-top: 50px;
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

/* 導入事例の締めくくりのボタン（中央寄せ） */
.on-demand-busyohou-works__conclusion-btn {
  max-width: 320px;
  margin-top: 30px;
  margin-inline: auto;
  text-align: left;
}

.on-demand-busyohou-works__sub-list {
  display: grid;
  margin-top: 20px;
  gap: 20px;
}

.on-demand-busyohou-works__sub-item {
  padding: 20px;
  border: 1px solid var(--mh--color--grayscale-500);
  border-radius: var(--odb--card-radius);
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-works__sub-item .on-demand-busyohou-works__tag {
  margin-bottom: 14px;
}

.on-demand-busyohou-works__sub-item-head {
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-works__sub-item-txt {
  margin-top: 12px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

@media (width >= 768px ) {
  .on-demand-busyohou-works__inner {
    padding-top: 80px;
    padding-bottom: 140px;
  }
  .on-demand-busyohou-works__main {
    margin-top: 90px;
    padding: 32px;
    border-radius: 20px;
  }
  .on-demand-busyohou-works__main-img img {
    aspect-ratio: 16 / 7;
  }
  .on-demand-busyohou-works__main-img + .on-demand-busyohou-works__main-body {
    margin-top: 32px;
  }
  .on-demand-busyohou-works__main-hgroup {
    display: flex;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--mh--color--grayscale-500);
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
  }
  .on-demand-busyohou-works__main-label {
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-works__main-head {
    margin-top: 10px;
    font-size: var(--mh--font-size--x5l);
    font-feature-settings: "halt" 1;
  }
  .on-demand-busyohou-works__tag-list {
    margin-top: 0;
    justify-content: flex-end;
    gap: 16px;
  }
  .on-demand-busyohou-works__tag {
    padding: 8px 16px;
    font-size: var(--mh--font-size--x2s);
  }
  .on-demand-busyohou-works__main .on-demand-busyohou-works__tag {
    padding: 4px 16px;
    border-radius: 4px;
    font-size: var(--mh--font-size--md);
    line-height: 1.8;
  }
  /* 4項目：タブレット〜中間幅は 2×2、広い画面で 4 列（縦線区切り） */
  /* 両端の余白を負マージンで相殺し、各列の本文幅をそろえる */
  .on-demand-busyohou-works__detail-list {
    margin-top: 0;
    margin-inline: -32px;
    padding-top: 32px;
    border-top: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 0;
  }
  .on-demand-busyohou-works__detail-item {
    padding-inline: 32px;
  }
  .on-demand-busyohou-works__detail-item:nth-child(even) {
    border-left: 1px solid var(--mh--color--grayscale-500);
  }
  .on-demand-busyohou-works__detail-num {
    font-size: var(--mh--font-size--x2l);
  }
  .on-demand-busyohou-works__detail-head {
    margin-top: 24px;
    font-size: var(--mh--font-size--x2l);
  }
  .on-demand-busyohou-works__detail-txt {
    margin-top: 24px;
    font-size: var(--mh--font-size--md);
    letter-spacing: 0.04em;
  }
  .on-demand-busyohou-works__sub-head {
    margin-top: 80px;
    font-size: var(--mh--font-size--x3l);
  }
  .on-demand-busyohou-works__sub-list {
    margin-top: 30px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
  }
  .on-demand-busyohou-works__sub-item {
    padding: 30px;
  }
  .on-demand-busyohou-works__sub-item-head {
    font-size: var(--mh--font-size--x3l);
  }
  .on-demand-busyohou-works__sub-item-txt {
    margin-top: 16px;
    font-size: var(--mh--font-size--xs);
  }
}

@media (width >= 1100px ) {
  /* 画像を左、本文を右に並べる */
  .on-demand-busyohou-works__main {
    display: flex;
    align-items: stretch;
    gap: 40px;
  }
  .on-demand-busyohou-works__main-img {
    position: relative;
    flex: 0 0 30.5%;
  }
  .on-demand-busyohou-works__main-img img {
    height: 100%;
    inset: 0;
    position: absolute;
    aspect-ratio: auto;
  }
  .on-demand-busyohou-works__main-body {
    min-width: 0;
    flex: 1 1 0;
  }
  .on-demand-busyohou-works__main-img + .on-demand-busyohou-works__main-body {
    margin-top: 0;
  }
}

@media (width >= 1450px ) {
  .on-demand-busyohou-works__detail-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .on-demand-busyohou-works__detail-item + .on-demand-busyohou-works__detail-item {
    border-left: 1px solid var(--mh--color--grayscale-500);
  }
}

/* .on-demand-busyohou-story
================================================== */

.on-demand-busyohou-story {
  overflow: clip;
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-story__inner {
  padding-top: 40px;
  padding-bottom: 210px;
  position: relative;
  z-index: 1;
}

.on-demand-busyohou-story__body {
  margin-top: 20px;
}

.on-demand-busyohou-story__visual {
  height: 200px;
  inset-inline: 0;
  bottom: 0;
  position: absolute;
  z-index: 2;
  line-height: 0;
  pointer-events: none;
}

/* 上端を白でぼかし、本文との境目をなじませる */
.on-demand-busyohou-story__visual::before {
  content: "";
  inset: 0;
  position: absolute;
  z-index: 1;
  background: linear-gradient(to bottom, rgb(255 255 255 / 100%) 0%, rgb(255 255 255 / 20%) 100%);
}

.on-demand-busyohou-story__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}

@media (width >= 768px ) {
  .on-demand-busyohou-story__inner {
    padding-top: 80px;
    padding-bottom: 560px;
  }
  .on-demand-busyohou-story__body {
    margin-top: 0;
  }
  .on-demand-busyohou-story__visual {
    height: 520px;
  }
}

/* .on-demand-busyohou-cta-mid
================================================== */

.on-demand-busyohou-cta-mid {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--primary-500);
  background-image: url("../img/common/bg_pattern03_sp.jpg");
  background-repeat: repeat-y;
  background-position: top;
  background-size: 100%;
  color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-cta-mid__inner {
  padding-top: 40px;
  padding-bottom: 40px;
}

.on-demand-busyohou-cta-mid__head {
  font-size: var(--mh--font-size--x4l);
  line-height: var(--mh--line-height--sm);
}

.on-demand-busyohou-cta-mid__txt {
  margin-top: 14px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-cta-mid__btn-list {
  display: flex;
  margin-top: 25px;
  flex-direction: column;
  gap: 12px;
}

@media (width >= 768px ) {
  .on-demand-busyohou-cta-mid {
    background-image: url("../img/common/bg_pattern03_pc.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  }
  .on-demand-busyohou-cta-mid__inner {
    display: flex;
    padding-top: 70px;
    padding-bottom: 70px;
    align-items: center;
    gap: 40px;
  }
  .on-demand-busyohou-cta-mid__body {
    flex: 1;
  }
  .on-demand-busyohou-cta-mid__head {
    font-size: var(--mh--font-size--x5l);
  }
  .on-demand-busyohou-cta-mid__txt {
    margin-top: 16px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cta-mid__btn-list {
    flex-direction: row;
    margin-top: 0;
    flex-shrink: 0;
    gap: 24px;
  }
  .on-demand-busyohou-cta-mid__btn-item {
    width: 510px;
  }
}

/* .on-demand-busyohou-data
================================================== */

.on-demand-busyohou-data {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-data__inner {
  padding-top: 40px;
  padding-bottom: 60px;
}

.on-demand-busyohou-data__head-body {
  margin-top: 20px;
}

.on-demand-busyohou-data__list {
  display: grid;
  margin-top: 30px;
  gap: 20px;
}

.on-demand-busyohou-data__item {
  display: flex;
  padding: 20px;
  border: 1px solid var(--mh--color--grayscale-500);
  border-radius: var(--odb--card-radius);
  align-items: flex-start;
  gap: 16px;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-data__item-ico {
  display: grid;
  width: 56px;
  height: 56px;
  border-radius: var(--mh--border-radius--md);
  flex-shrink: 0;
  place-content: center;
  background-color: var(--mh--color--secondary-200);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-data__item-ico img {
  width: 30px;
  height: 30px;
}

.on-demand-busyohou-data__item-head {
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-data__item-txt {
  margin-top: 8px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

@media (width >= 768px ) {
  .on-demand-busyohou-data__head-body {
    margin-top: 0;
  }
  .on-demand-busyohou-data__inner {
    padding-top: 80px;
    padding-bottom: 140px;
  }
  .on-demand-busyohou-data__list {
    margin-top: 80px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
  }
  .on-demand-busyohou-data__item {
    padding: 26px 30px;
    gap: 24px;
  }
  .on-demand-busyohou-data__item-ico {
    width: 72px;
    height: 72px;
  }
  .on-demand-busyohou-data__item-ico img {
    width: 36px;
    height: 36px;
  }
  .on-demand-busyohou-data__item-head {
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-data__item-txt {
    margin-top: 10px;
    font-size: var(--mh--font-size--xs);
  }
}

/* .c-flow01.is-4col（Flow）
================================================== */

.on-demand-busyohou-flow__head-body {
  margin-top: 20px;
}

.on-demand-busyohou-flow__lead {
  font-size: var(--mh--font-size--x5l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
  word-break: auto-phrase;
}

/* 強調部分（地域に合う運行の形）は途中で折り返さない */
.on-demand-busyohou-flow__lead .on-demand-busyohou-flow__accent {
  display: inline-block;
}

/* リード文の下と、本文の段落の間をあける */
.on-demand-busyohou-flow__head-body .c-flow01__txt {
  margin-top: 1em;
}

.on-demand-busyohou-flow .c-flow01__item-hgroup {
  padding-bottom: 0;
  border-bottom: 0;
  text-align: left;
}

.on-demand-busyohou-flow .c-flow01__item-num {
  font-size: var(--mh--font-size--xl);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-flow .c-flow01__item-head {
  margin-top: 12px;
  font-size: var(--mh--font-size--xl);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-flow .c-flow01__item-txt {
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-flow .c-flow01__item {
  box-shadow: none;
}

/* 共通の黄色矢印をテーマカラーに差し替える */
.on-demand-busyohou-flow .c-flow01__item:not(:last-child)::after {
  background: var(--mh--color--primary-500);
  -webkit-mask: url("../img/common/ico_flow-arw01.png") no-repeat center/contain;
  mask: url("../img/common/ico_flow-arw01.png") no-repeat center/contain;
}

.on-demand-busyohou-flow .c-flow01__item.is-cycle {
  background-color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-flow .c-flow01__item.is-cycle .c-flow01__item-num,
.on-demand-busyohou-flow .c-flow01__item.is-cycle .c-flow01__item-head,
.on-demand-busyohou-flow .c-flow01__item.is-cycle .c-flow01__item-txt {
  color: var(--mh--color--grayscale-100);
}

@media (width >= 768px ) {
  .on-demand-busyohou-flow__head-body {
    margin-top: 0;
    width: 860px;
  }
  .on-demand-busyohou-flow__lead {
    font-size: var(--mh--font-size--x6l);
  }
  .on-demand-busyohou-flow .c-flow01__head-area {
    margin-top: -100px;
  }
  .on-demand-busyohou-flow .c-flow01__txt {
    width: auto;
  }
  .c-flow01.is-4col .c-flow01__list {
    margin-top: 90px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 60px 78px;
  }
  .c-flow01.is-4col .c-flow01__item {
    padding: 26px 24px 30px;
  }
  .c-flow01.is-4col .c-flow01__item:not(:last-child)::after {
    top: 50%;
    right: -50px;
    left: auto;
    transform: translateY(-50%);
  }
  .c-flow01.is-4col .c-flow01__item:nth-child(3n)::after {
    display: block;
  }
  .c-flow01.is-4col .c-flow01__item:nth-child(4n)::after {
    display: none;
  }
  .on-demand-busyohou-flow .c-flow01__item-num {
    font-size: var(--mh--font-size--x2l);
  }
  .on-demand-busyohou-flow .c-flow01__item-head {
    min-height: calc(var(--mh--line-height--sm) * 2em);
    font-size: var(--mh--font-size--x2l);
  }
  .on-demand-busyohou-flow .c-flow01__item-txt {
    padding: 0;
    font-size: var(--mh--font-size--xs);
  }
}

/* .on-demand-busyohou-cycle
================================================== */

.on-demand-busyohou-cycle {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-cycle__inner {
  padding-top: 40px;
  padding-bottom: 60px;
}

.on-demand-busyohou-cycle__body {
  margin-top: 30px;
}

.on-demand-busyohou-cycle__diagram {
  width: min(100%, 340px);
  margin-inline: auto;
}

.on-demand-busyohou-cycle__diagram img {
  width: 100%;
  height: auto;
}

.on-demand-busyohou-cycle__detail {
  margin-top: 40px;
}

.on-demand-busyohou-cycle__step-list {
  display: grid;
  gap: 10px;
}

.on-demand-busyohou-cycle__step {
  padding: 16px 20px;
  border-radius: var(--mh--border-radius--md);
  background-color: var(--mh--color--surface-600);
}

.on-demand-busyohou-cycle__step-head {
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-cycle__step-txt {
  margin-top: 6px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-cycle__note {
  margin-top: 16px;
  padding: 20px;
  border-radius: var(--mh--border-radius--md);
  background-color: var(--mh--color--secondary-500);
  color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-cycle__note-head {
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
}

.on-demand-busyohou-cycle__note-txt {
  margin-top: 8px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-cycle__btn {
  margin-top: 20px;
}

@media (width >= 768px ) {
  .on-demand-busyohou-cycle__inner {
    padding-top: 80px;
    padding-bottom: 140px;
  }
  .on-demand-busyohou-cycle__body {
    display: grid;
    margin-top: 60px;
    align-items: start;
    grid-template-columns: 590px 1fr;
    gap: 60px;
  }
  .on-demand-busyohou-cycle__diagram {
    width: min(100%, 558px);
  }
  .on-demand-busyohou-cycle__detail {
    margin-top: 0;
  }
  .on-demand-busyohou-cycle__step {
    display: grid;
    padding: 22px 30px;
    align-items: baseline;
    grid-template-columns: 200px 1fr;
    gap: 20px;
  }
  .on-demand-busyohou-cycle__step-head {
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-cycle__step-txt {
    margin-top: 0;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cycle__note {
    margin-top: 22px;
    padding: 26px 30px;
  }
  .on-demand-busyohou-cycle__note-head {
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-cycle__note-txt {
    margin-top: 10px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cycle__btn {
    margin-top: 30px;
  }
  .on-demand-busyohou-cycle__btn .c-btn01__in {
    max-width: none;
    min-width: 380px;
    width: fit-content;
    min-height: 62px;
  }
}

/* .on-demand-busyohou-subsidy
================================================== */

.on-demand-busyohou-subsidy {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-subsidy__inner {
  padding-top: 40px;
  padding-bottom: 60px;
}

.on-demand-busyohou-subsidy__head-body {
  margin-top: 20px;
}

.on-demand-busyohou-subsidy__list {
  display: grid;
  margin-top: 30px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.on-demand-busyohou-subsidy__item {
  padding: 20px 16px;
  border-radius: var(--odb--card-radius);
  background-color: var(--odb--color--leaf-deep);
}

.on-demand-busyohou-subsidy__item-num {
  font-size: var(--mh--font-size--xl);
  line-height: var(--mh--line-height--xs);
  color: var(--mh--color--primary-500);
}

.on-demand-busyohou-subsidy__item-head {
  margin-top: 12px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--secondary-500);
}

.on-demand-busyohou-subsidy__item-txt {
  margin-top: 12px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.on-demand-busyohou-subsidy__btn {
  margin-top: 30px;
}

@media (width >= 768px ) {
  .on-demand-busyohou-subsidy__inner {
    padding-top: 80px;
    padding-bottom: 120px;
  }
  .on-demand-busyohou-subsidy__head-body {
    margin-top: 0;
  }
  .on-demand-busyohou-subsidy__list {
    margin-top: 90px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px;
  }
  .on-demand-busyohou-subsidy__item {
    padding: 30px;
  }
  .on-demand-busyohou-subsidy__item-num {
    font-size: var(--mh--font-size--x2l);
  }
  .on-demand-busyohou-subsidy__item-head {
    margin-top: 16px;
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-subsidy__item-txt {
    margin-top: 16px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-subsidy__btn {
    margin-top: 45px;
  }
  .on-demand-busyohou-subsidy__btn .c-btn01__in {
    max-width: none;
    min-width: 400px;
    width: fit-content;
    min-height: 62px;
  }
}

/* .on-demand-busyohou-cta
================================================== */

.on-demand-busyohou-cta {
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--secondary-500);
  color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-cta::before {
  position: absolute;
  z-index: -1;
  content: "";
  inset: 0;
  background-image: url("../img/maas/on-demand-busyohou/on-demand-busyohou-cta__inner.jpeg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0.2;
}

.on-demand-busyohou-cta__inner {
  padding-top: 50px;
  padding-bottom: 50px;
}

.on-demand-busyohou-cta__head {
  font-size: var(--mh--font-size--x5l);
  line-height: var(--mh--line-height--sm);
}

.on-demand-busyohou-cta__txt {
  margin-top: 16px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-cta__tag-list {
  display: grid;
  margin-top: 30px;
  padding: 12px;
  border-radius: 8px;
  background-color: rgb(18 40 53 / 50%);
}

.on-demand-busyohou-cta__tag {
  display: flex;
  padding: 8px;
  align-items: center;
  gap: 10px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--lg);
}

.on-demand-busyohou-cta__tag::before {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  content: "";
  background-color: currentcolor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%3Cpath%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M20%206%209%2017l-5-5%22%2F%3E%0A%3C%2Fsvg%3E%0A") no-repeat center/contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%3Cpath%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M20%206%209%2017l-5-5%22%2F%3E%0A%3C%2Fsvg%3E%0A") no-repeat center/contain;
}

.on-demand-busyohou-cta__note {
  margin-top: 30px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--mh--color--grayscale-200);
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-cta__catch {
  margin-top: 24px;
  font-size: var(--mh--font-size--x2s);
  line-height: var(--mh--line-height--md);
}

.on-demand-busyohou-cta__btn-list {
  display: flex;
  margin-top: 20px;
  flex-direction: column;
  gap: 12px;
}

@media (hover: hover) and (pointer: fine) {
  .on-demand-busyohou-cta__inner .c-btn01 .c-btn01__in:hover {
    color: var(--mh--color--grayscale-900);
    background-color: var(--mh--color--grayscale-100);
  }
  .on-demand-busyohou-cta__inner .c-btn01 .c-btn01__in:hover .c-btn01__ico {
    border-color: var(--mh--color--grayscale-500);
  }
}

@media (width >= 768px ) {
  .on-demand-busyohou-cta__inner {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .on-demand-busyohou-cta__head {
    font-size: var(--mh--font-size--x7l);
  }
  .on-demand-busyohou-cta__txt {
    margin-top: 20px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cta__tag-list {
    margin-top: 45px;
    padding: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .on-demand-busyohou-cta__tag {
    font-size: var(--mh--font-size--xl);
  }
  .on-demand-busyohou-cta__tag::before {
    width: 24px;
    height: 24px;
  }
  .on-demand-busyohou-cta__note {
    margin-top: 45px;
    padding-bottom: 30px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cta__catch {
    margin-top: 30px;
    font-size: var(--mh--font-size--xs);
  }
  .on-demand-busyohou-cta__btn-list {
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 24px;
    gap: 24px;
  }
  .on-demand-busyohou-cta__btn-item {
    flex: 0 0 auto;
  }
  .on-demand-busyohou-cta__btn-item .c-btn01__in {
    min-width: 340px;
    max-width: none;
    min-height: 62px;
  }
}

/* .on-demand-busyohou-bottom
================================================== */

.on-demand-busyohou-bottom {
  display: flow-root;
  background-color: #e7f6e3;
}

/* 導入実績（共通部品 c-projects01）の見出しをほかのセクションと同じ色に */
.on-demand-busyohou-bottom .c-projects01 .c-head02__label,
.on-demand-busyohou-bottom .c-projects01 .c-head02__en {
  color: var(--mh--color--secondary-500);
}

/* .on-demand-busyohou-project
================================================== */

.on-demand-busyohou-project {
  margin-top: 70px;
  overflow: hidden;
  position: relative;
  z-index: 1;
  background-color: var(--mh--color--grayscale-100);
}

.on-demand-busyohou-project__inner {
  padding-top: 40px;
  padding-bottom: 50px;
}

.on-demand-busyohou-project__head-area {
  margin-top: 20px;
}

.on-demand-busyohou-project__head-btn {
  margin-top: 20px;
}

.on-demand-busyohou-project__body {
  margin-top: 30px;
}

.on-demand-busyohou-project__tab-scroll {
  margin-bottom: 20px;
  margin-inline: calc(var(--mh--contents--padding--side) * -1);
  padding-inline: var(--mh--contents--padding--side);
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.on-demand-busyohou-project__tab-scroll::-webkit-scrollbar {
  display: none;
}

.on-demand-busyohou-project__tab-list {
  display: flex;
  width: max-content;
  flex-wrap: nowrap;
  gap: 8px;
}

.on-demand-busyohou-project__foot-btn {
  margin-top: 40px;
}

@media (width >= 768px ) {
  .on-demand-busyohou-project {
    margin: 140px 30px 0;
    border-radius: var(--mh--border-radius--md);
  }
  .on-demand-busyohou-project__inner {
    padding-top: 80px;
    padding-bottom: 160px;
  }
  .on-demand-busyohou-project__head-area {
    display: grid;
    margin-top: 0;
    align-items: end;
    grid-template-columns: 1fr 320px;
    gap: 40px;
  }
  .on-demand-busyohou-project__head-btn {
    margin-top: 0;
    grid-column: 2;
  }
  .on-demand-busyohou-project__body {
    margin-top: 60px;
  }
  .on-demand-busyohou-project__tab-scroll {
    margin-bottom: 25px;
    margin-inline: 0;
    padding-inline: 0;
    overflow-x: visible;
  }
  .on-demand-busyohou-project__tab-list {
    width: 100%;
  }
}


/* 製品ステータスラベル・注記（WEBSITE_COPY v0.4 / PRODUCT_STATUS 準拠）
================================================== */

.on-demand-busyohou-status {
  display: inline-block;
  margin-bottom: 10px;
  padding: 2px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  align-self: flex-start;
  font-size: var(--mh--font-size--x3s);
  line-height: var(--mh--line-height--md);
}

/* 現在対応（Released） */
.on-demand-busyohou-status.is-released {
  background-color: var(--mh--color--primary-500);
  color: var(--mh--color--grayscale-100);
}

/* 対応予定（Planned） */
.on-demand-busyohou-status.is-planned {
  border-color: rgb(217 119 6);
  background-color: rgb(255 247 237);
  color: rgb(194 65 12);
}

/* 今後の拡張（Data：GTFS 各仕様） */
.on-demand-busyohou-status.is-future {
  border-color: rgb(0 144 168 / 50%);
  background-color: rgb(0 144 168 / 8%);
  color: var(--mh--color--secondary-500);
}

/* 連携を見据えて（Data：バス予報との関係） */
.on-demand-busyohou-status.is-prospect {
  border: 1px dashed rgb(0 144 168 / 60%);
  background-color: var(--mh--color--grayscale-100);
  color: var(--mh--color--secondary-500);
}

/* 現在連携なし（Not Provided / TBD） */
.on-demand-busyohou-status.is-none {
  border-color: var(--mh--color--grayscale-500);
  background-color: var(--mh--color--grayscale-200);
  color: var(--mh--color--grayscale-800);
}

body#demand .on-demand-busyohou-note {
  display: block;
  margin-top: 8px;
  font-size: var(--mh--font-size--x3s);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-800);
}

@media (width >= 768px ) {
  .on-demand-busyohou-status {
    margin-bottom: 12px;
  }
}
