/* ===========================
   Responsive (SP)
   =========================== */
@media (max-width: 768px) {

  /* 余白を全体的に縮小 */
  :root {
    --space-section: 4.8rem;
    --space-block: 2.4rem;
  }

  /* 見出しサイズ（全体的に一段階小さく） */
  .heading-1 { font-size: 2.0rem; line-height: 1.4; }
  .heading-2 { font-size: 1.8rem; line-height: 1.4; }
  .heading-3 { font-size: 1.6rem; line-height: 1.5; }

  /* テキスト */
.text-lg { font-size: 1.4rem; line-height: 1.6; }
.text-md { font-size: 1.2rem; line-height: 1.6; }
.text-sm { font-size: 1.0rem; line-height: 1.7; }

  /* Header */
  .header__inner {
    height: 74px;
  }

  /* Hero */
  .hero {
    padding-top: 20vh;        /* 画面上20%に配置 */
    padding-bottom: 10vh;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.9)) 30%, url(../img/case04.jpg) center / cover no-repeat;
  }

  .hero .container {
    width: 100%;              /* 全幅 */
    margin: 0 auto;           /* 中央 */
    padding: 0 20px;          /* 左右余白 */
    text-align: center;       /* 中央揃え */
  }

  .hero__title {
    margin-top: var(--space-block);
  }
  .hero__lead {
    font-size: var(--font-xs);
    line-height: 1.6;
  }

  /* Features（横並び → 縦並び） */
  .features__list {
    flex-direction: column;
    gap: var(--space-md);
  }

  /* problem（悩み） */
  .problem__item {
    font-size: var(--font-xs);
    line-height: 1.6;
    padding-left: 3.0rem;
  }
  .problem__item::before {
    width: 1.8rem;
    height: 1.8rem;
    top: 0.2rem;
  }

  /* Strength（横並び → 縦並び） */
  .strength__title {
    font-size: var(--font-lg);
  }
  .strength__list {
    flex-direction: column;
    gap: var(--space-md);
  }
  .strength__text {
    font-size: var(--font-sm);
  }

  /* Case（施工事例：2列 → 1列） */
  .case__title {
    font-size: var(--font-lg);
  }
  .case__title-sm {
    font-size: var(--font-md);
  }
  .case__item {
    flex: 1 1 100%;
  }
  .case__text {
    font-size: var(--font-sm);
  }
  .case__body {
    padding: var(--space-md);
  }
  .case__label {
    font-size: var(--font-xs);
}

/* Greeting section（横並び → 縦並び） */
.greeting__inner {
    flex-direction: column;
  }

  .greeting__img {
    max-width: 100%;
  }

  .greeting__content {
    padding-left: 0;
  }

  /* Flow（番号と本文の横並び → 縦並び） */
  .flow__num {
    width: 34px;
    height: 34px;
    font-size: 14px;
  }

  .flow__item::before {
    left: 17px; /* ← 丸34pxの中心 */
    top: 34px;
  }

  .flow__body {
    margin-left: 55px;
  }

  /* Voice（2列 → 1列） */
  .voice__item {
    flex: 1 1 100%;
  }

  /* Price（表の文字サイズ調整） */
  .price__table th,
  .price__table td {
    font-size: var(--font-xs);
    padding: 1rem;
  }

  /* FAQ（タップしやすいサイズに） */
  .faq__q {
    font-size: var(--font-xs);
  }

  .faq__a {
  font-size: var(--font-xs);
}

  /* CTA */
  .cta__title {
    font-size: 2.0rem;
  }

  /* Contact */
  .contact__row {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .contact__label {
    width: auto;
    padding-top: 0;
    font-size: var(--font-xs);
  }

  .contact__input, .contact__textarea, .contact__form select {
    font-size: var(--font-xs);
}

  /* Company（表 → 縦並び） */
 .company__table th,
  .company__table td {
    padding: var(--space-xs);
    display: block;
    width: 100%;
  }
  
  .company__table th {
    background: none;
    padding-bottom: 0.4rem;
    border-bottom: none;
    text-align: left;
    padding-bottom: var(--space-xs);
  }

  .company__table td {
    padding-top: 0;
    margin-bottom: var(--space-xs);
  }

  /* ===========================
   Company Map
   =========================== */
  .company__map iframe {
    height: 260px;
  }

  /* ===========================
   Floating Contact（SP固定フッターバー）
   =========================== */
  .floating-contact {
    display: flex;
  }

}