/* -------------------------------------------------------------------------
       DESIGN SYSTEM & VARIABLES (既存トップ・商品詳細・マイページからの完全継承)
    ------------------------------------------------------------------------- */

    /* 基本リセット */

            textarea {
      resize: vertical;
      min-height: 180px;
    }

    /* -------------------------------------------------------------------------
       【共通デザイン：グローバルナビゲーション】
    ------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
       パンくずリスト
    ------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
       疑似画面遷移用ラッパー (各画面ブロックの定義)
    ------------------------------------------------------------------------- */
    .contact-flow-section {
      display: none; /* 初期状態は非表示（JSで動的切替） */
      opacity: 0;
      transform: translateY(20px);
      transition: opacity 0.5s ease, transform 0.5s ease;
    }
    .contact-flow-section.is-active {
      display: block;
      opacity: 1;
      transform: translateY(0);
    }
    .flow-content-container {
      max-width: 900px;
      margin: 0 auto;
      padding: 4rem 2rem 8rem 2rem;
    }
    .flow-title {
      font-family: var(--font-display);
      font-size: 2rem;
      font-weight: 500;
      color: var(--text-dark);
      text-align: center;
      margin-bottom: 2rem;
      position: relative;
    }
        .flow-subtitle-en {
      font-family: var(--font-en);
      font-size: 0.85rem;
      color: var(--color-sub);
      text-transform: uppercase;
      letter-spacing: 0.25em;
      text-align: center;
      display: block;
      margin-bottom: 3.5rem;
    }
    .flow-lead-text {
      text-align: center;
      font-size: 0.95rem;
      color: var(--text-muted);
      line-height: 1.8;
      margin-bottom: 4rem;
    }

    /* -------------------------------------------------------------------------
       【画面1：お問い合わせ入力画面】
    ------------------------------------------------------------------------- */
    .custom-checkbox-row {
      display: flex;
      align-items: flex-start;
      gap: 0.8rem;
      cursor: pointer;
      font-size: 0.88rem;
      font-weight: 500;
      line-height: 1.6;
    }
    .custom-checkbox-row input {
      width: 18px;
      height: 18px;
      accent-color: var(--color-main);
      margin-top: 0.2rem;
    }

    /* ボタンシステム */
    .btn-row {
      display: flex;
      justify-content: space-between;
      gap: 1.5rem;
      margin-top: 3rem;
    }
    .btn-primary-action {
      height: 55px;
      padding: 0 4rem;
      background-color: var(--color-accent);
      color: var(--text-dark);
      font-family: var(--font-display);
      font-size: 0.95rem;
      font-weight: 600;
      letter-spacing: 0.1em;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.4s;
    }
        .btn-secondary-action {
      height: 55px;
      padding: 0 3.5rem;
      border: 1px solid var(--text-dark);
      font-family: var(--font-display);
      font-size: 0.95rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.4s;
      background-color: transparent;
    }

    /* -------------------------------------------------------------------------
       【画面2：お問い合わせ内容確認画面】
    ------------------------------------------------------------------------- */
        .data-confirm-table th, .data-confirm-table td {
      padding: 1.2rem 1.5rem;
      font-size: 0.92rem;
      border-bottom: 1px solid rgba(138, 106, 74, 0.1);
      text-align: left;
      vertical-align: top;
    }
        .data-confirm-table td {
      width: 70%;
      color: var(--text-dark);
      white-space: pre-wrap; /* 改行の保持 */
    }

    /* -------------------------------------------------------------------------
       【画面3：お問い合わせ送信完了画面】
    ------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
       【共通デザイン：フッター】
    ------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
       ローディングスピナー（送信中の演出）
    ------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
       RESPONSIVE DESIGN (タブレット・スマートフォン完全対応)
    ------------------------------------------------------------------------- */
    @media (max-width: 1024px) {
    }
    @media (max-width: 768px) {
      .form-row-grid-2 { grid-template-columns: 1fr; gap: 1rem; }
      .form-block-fieldset { padding: 2.5rem 1.5rem; }
      .btn-row { flex-direction: column; gap: 1rem; }
      .btn-primary-action, .btn-secondary-action { width: 100%; }
      .completion-wrapper { padding: 3rem 1.5rem; }
    }