/* ======================================================
   test-jisedai カードレイアウト基盤 v3.6.0（修正版）
   - 強すぎる all: revert-layer を撤去
   - #jisedai-app 内だけを安全に整える
====================================================== */

/* ❌ 強すぎるリセットは使わない */
/*
#jisedai-app, 
#jisedai-app * {
    all: revert-layer;
}
*/

#jisedai-app {
  box-sizing: border-box;
}

#jisedai-app *,
#jisedai-app *::before,
#jisedai-app *::after {
  box-sizing: inherit;
}

#jisedai-app input,
#jisedai-app select,
#jisedai-app textarea,
#jisedai-app button {
  font: inherit;
}


/* =========================================================
   モバイル縦型で横にスワイプできてしまう（横スクロール）対策
   - iOS Safari等で off-canvas（100vw + translateX）要素があると、
     画面外の要素分だけ横幅が広く判定されることがあります。
========================================================= */
@supports(selector(html:has(#jisedai-app))) {
  html:has(#jisedai-app) { overflow-x: hidden; }
}
body.page-test-jisedai {
  overflow-x: hidden;
}
body.page-test-jisedai #jisedai-app {
  overflow-x: hidden;
  max-width: 100%;
}


/* ======================================================
   Backdrop（サマリー/設定）
   - Shadow DOM 内でも確実に制御できるよう、ここで基本スタイルを定義
   - 重要：設定パネルより必ず背面に置く（クリックを奪わない）
====================================================== */

#settingsBackdrop,
#summaryBackdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 99990; /* #estimateSettingsContainer(99999) より下 */
}

#settingsBackdrop.active,
#summaryBackdrop.active {
  opacity: 1;
  pointer-events: auto;
}

/* 設定パネル（右側スライド） */
#estimateSettingsContainer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: auto;
  height: 100vh;
  background: #f9fafb;
  /* right を動かすとレイアウト計算が重くなりやすいので transform に寄せる */
  transform: translateX(100%);
  transition: transform .45s cubic-bezier(.25,.8,.25,1);
  will-change: transform;
  contain: layout paint;
  z-index: 99999;
  overflow: hidden;
}
#estimateSettingsContainer.open { transform: translateX(0); }

/*
  上部ヘッダー（保存/リセット/閉じる）
  - JS側で .panel-header を自動生成
  - ここで見た目とレイヤー順を統一
*/
#estimateSettingsContainer .panel-header,
#settingsSummaryContainer .panel-header {
  position: sticky;
  top: 0;
  z-index: 100010;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
}

#estimateSettingsContainer .panel-header h2,
#settingsSummaryContainer .panel-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

#estimateSettingsContainer .panel-header .settings-header-actions,
#settingsSummaryContainer .panel-header .settings-header-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

#closeSummaryBtn {
  position: static;
  z-index: auto;
  font-size: 22px;
  background: transparent;
  border: none;
  width: 36px;
  height: 36px;
  line-height: 36px;
  border-radius: 10px;
  cursor: pointer;
  opacity: 0.9;
}

#closeSummaryBtn:hover {
  opacity: 1;
  background: rgba(0,0,0,0.06);
}

/*
  closeSettingsBtn は v3.7.6 から「パネルを閉じる」表記（テキストボタン）へ変更。
  旧来の 36px アイコン枠スタイルを当てると文字が欠けるため、ここでは最小限に留める。
*/
#closeSettingsBtn {
  position: static;
  z-index: auto;
  cursor: pointer;
  white-space: nowrap;
}

#estimateSettingsContainer h2 {
  margin: 0;
  padding: 0;
  font-size: 1.2rem;
  background: transparent;
  border: none;
}

#estimateSettingsContainer .panel-body {
  height: calc(100% - 60px);
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-auto-rows: 180px;
  gap: 16px;
  overflow-y: auto;
}

.settings-card {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .25s, box-shadow .25s;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.settings-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.card-content { margin-top: 12px; width: 100%; }

/* 展開カード */
.settings-card.expanded {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  height: 100vh !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-y: auto !important;
  background: #fff !important;
  z-index: 100002 !important;
  border-radius: 0 !important;
  box-shadow: -4px 0 20px rgba(0,0,0,0.15);
}

@media (min-width: 1025px) {
  .settings-card.expanded { width: 50vw !important; }
}

/* 旧UI無効化 */
/*
  以前は settings 内の fieldset/legend を全無効化していましたが、
  editor 側が fieldset を使うケースがありフォームが消える原因になります。
  → 「折りたたみカード」内だけ非表示にして、展開時は表示させます。
*/
#estimateSettingsContainer .settings-card:not(.expanded) fieldset,
#estimateSettingsContainer .settings-card:not(.expanded) legend,
#estimateSettingsContainer .settings-card:not(.expanded) details,
#estimateSettingsContainer .settings-card:not(.expanded) summary {
  display: none !important;
}

/* card-controller は fieldset を .card-content に移動するため、
   折りたたみ時にフォームが露出しないよう .card-content を明示的に隠す */
#estimateSettingsContainer .settings-card:not(.expanded) .card-content {
  display: none !important;
}
#estimateSettingsContainer .settings-card.expanded .card-content {
  display: block !important;
}

#estimateSettingsContainer .settings-card.expanded fieldset,
#estimateSettingsContainer .settings-card.expanded legend,
#estimateSettingsContainer .settings-card.expanded details,
#estimateSettingsContainer .settings-card.expanded summary {
  display: block !important;
}

/* フォーム干渉遮断（必要最小） */
#estimateSettingsContainer .settings-card.expanded input,
#estimateSettingsContainer .settings-card.expanded select,
#estimateSettingsContainer .settings-card.expanded textarea {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 4px 0 !important;
  padding: 6px 8px !important;
  font-size: 14px !important;
}

/* ======================================================
   固定フッター（5ボタン）
   - Shadow DOM 内でも必ず「position: fixed」で追従させる
   - 下部UIに本文が潜り込まないよう padding-bottom も確保
====================================================== */

/* コンテンツがフッターに隠れないよう余白を確保 */
#jisedai-app {
  padding-bottom: 140px;
}

#jisedai-app .fixed-footer {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 10000;

  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 -6px 18px rgba(0,0,0,0.10);
}

#jisedai-app .fixed-footer .button-row {
  display: flex;
  gap: 10px;
  align-items: center;
}

#jisedai-app .fixed-footer .top-row {
  margin-bottom: 10px;
}

/* 2ボタン + 3ボタン（モバイルでは均等幅） */
#jisedai-app .fixed-footer .button-row > button {
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
}

@media (min-width: 768px) {
  #jisedai-app .fixed-footer {
    padding: 12px 16px;
  }
  #jisedai-app .fixed-footer .button-row > button {
    flex: 0 0 auto;
    min-width: 160px;
  }
  #jisedai-app .fixed-footer .bottom-row {
    justify-content: center;
  }
}

/* =========================================================
   Fixed Footer: keep buttons visible / ordered (regression guard)
   - ensure Summary button is not accidentally hidden
========================================================= */
#jisedai-app .fixed-footer #toggleSummaryBtn{
  display: inline-flex !important;
}


/* ===== v3.7.1 New Method Unified: ヘッダー保存/リセット ===== */
#estimateSettingsContainer .panel-header{
  display:flex;
  align-items:center;
  gap:10px;
}
#estimateSettingsContainer .settings-header-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
}
#estimateSettingsContainer .settings-header-actions .btn{
  white-space:nowrap;
}

/* ========================================================================
   v3.7.3: パネル初期表示の安全ガード + 3カラム(レイアウト)フォールバック
   - UI用CSSが読み込めていない場合でも「設定/サマリー」が本文に露出しないようにする
   - DevTools を右ドックしても3カラムが崩れにくいよう、ブレークポイントを少し緩和
======================================================================== */

/* Backdrop: デフォルトは確実に非表示（JSでも display を制御） */
#settingsBackdrop,
#summaryBackdrop {
  display: none;
}
#settingsBackdrop.active,
#summaryBackdrop.active {
  display: block;
}

/* Summary panel (fallback) */
#settingsSummaryContainer {
  position: fixed;
  top: 0;
  right: -100vw;
  width: 70vw;
  max-width: 760px;
  height: 100vh;
  overflow: auto;
  background: #fff;
  z-index: 99995;
  transition: right 0.25s ease;
  display: none;
}
#settingsSummaryContainer.open {
  right: 0;
  display: block;
}

/* 3カラム: bodyクラスで適用（#jisedai-app が欠けても効く） */
body.page-test-jisedai .app-grid {
  display: grid;
  grid-template-columns: 1fr 1.35fr 1fr;
  gap: 18px;
  align-items: start;
}
/* 1100pxだとDevTools右ドック時に1カラムへ落ちやすいので、900pxに緩和 */
@media (max-width: 900px) {
  body.page-test-jisedai .app-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   v49 (2026-01-22): Footer buttons UX
   - PC(>=901px): 6 buttons in one horizontal row
     (download buttons on the left, summary/calc/settings on the right)
   - Mobile(<901px): keep the existing 2-row layout
   - Also center text vertically/horizontally (Summary button was off)
========================================================= */

/* Center text like other buttons (fix: Summary button alignment) */
#jisedai-app .fixed-footer .button-row > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* PC layout: 1 row */
@media (min-width: 901px) {
  #jisedai-app .fixed-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  /* Remove the vertical gap between rows on PC */
  #jisedai-app .fixed-footer .top-row {
    margin-bottom: 0 !important;
    flex: 1 1 auto;
    justify-content: flex-start;
  }

  #jisedai-app .fixed-footer .bottom-row {
    flex: 0 0 auto;
    justify-content: flex-end !important;
  }

  /* Prevent internal wrapping; keep buttons in a single line of groups */
  #jisedai-app .fixed-footer .button-row {
    flex-wrap: nowrap;
  }

  /* Allow download buttons to shrink to fit (avoid overflow on narrow desktop) */
  #jisedai-app .fixed-footer .top-row > button {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }

  /* Keep right-side buttons readable */
  #jisedai-app .fixed-footer .bottom-row > button {
    flex: 0 0 auto !important;
    min-width: 120px;
  }
}


/* =========================================================
   v51 (2026-01-22): Footer buttons equal width + no wrap on PC
   - PC(>=901px): 6 buttons all equal width
   - If text would wrap, do NOT wrap; shrink font size instead
   - Mobile(<901px): keep existing 2-row layout
========================================================= */
@media (min-width: 901px) {
  /* 3 buttons + 3 buttons -> each group takes half of the footer */
  #jisedai-app .fixed-footer .top-row,
  #jisedai-app .fixed-footer .bottom-row {
    flex: 1 1 0 !important;
  }

  /* All 6 buttons should be equal */
  #jisedai-app .fixed-footer .top-row > button,
  #jisedai-app .fixed-footer .bottom-row > button {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }

  /* Prevent wrapping; shrink font to fit */
  #jisedai-app .fixed-footer .button-row > button {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: clamp(11px, 1.15vw, 14px) !important;
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* =========================================================
   v52 (2026-01-23): fieldset 角丸（足場数量計算カード）
   - 既存 selector（body.page-test-jisedai .app-grid ...）が環境により一致せず、
     角丸が反映されないケースがありました。
   - fieldset 自体に「角丸のみ」を強制します（安全・最小変更）。
   - Shadow DOM / Light DOM どちらでも効くように、スコープを限定しすぎません。
========================================================= */

#jisedai-app fieldset,
fieldset {
  border-radius: 14px !important;
}

/* legend は見た目だけ軽く整える（角が欠ける環境の保険） */
#jisedai-app legend,
legend {
  padding-left: 6px;
  padding-right: 6px;
}

/* =========================================================
   v61 (2026-01-24): Footer button colors (balanced theme)
   - Too many saturated colors looked unbalanced.
   - Group by purpose:
     * Top row (downloads): Blue
     * Bottom row (actions): Slate
   - Keep strong contrast and clear hover/focus states.
========================================================= */

#jisedai-app .fixed-footer .button-row > button,
#jisedai-app .fixed-footer .button-row > a {
  border: 1px solid transparent !important;
  color: #ffffff !important;
  font-weight: 700;
}

/* Downloads (材料数 / 見積 / 請求) */
#jisedai-app .fixed-footer .top-row > button,
#jisedai-app .fixed-footer .top-row > a {
  background: #1d4ed8 !important;   /* blue-700 */
  border-color: #1d4ed8 !important;
}
#jisedai-app .fixed-footer .top-row > button:hover,
#jisedai-app .fixed-footer .top-row > a:hover {
  background: #1e40af !important;   /* blue-800 */
  border-color: #1e40af !important;
}
#jisedai-app .fixed-footer .top-row > button:active,
#jisedai-app .fixed-footer .top-row > a:active {
  background: #1e3a8a !important;   /* blue-900 */
  border-color: #1e3a8a !important;
}

/* Actions (サマリー / 計算 / 設定) */
#jisedai-app .fixed-footer .bottom-row > button,
#jisedai-app .fixed-footer .bottom-row > a {
  background: #334155 !important;   /* slate-700 */
  border-color: #334155 !important;
}
#jisedai-app .fixed-footer .bottom-row > button:hover,
#jisedai-app .fixed-footer .bottom-row > a:hover {
  background: #1f2937 !important;   /* slate-800 */
  border-color: #1f2937 !important;
}
#jisedai-app .fixed-footer .bottom-row > button:active,
#jisedai-app .fixed-footer .bottom-row > a:active {
  background: #0f172a !important;   /* slate-900 */
  border-color: #0f172a !important;
}

/* Focus ring (keyboard UX) */
#jisedai-app .fixed-footer .button-row > button:focus-visible,
#jisedai-app .fixed-footer .button-row > a:focus-visible {
  outline: 3px solid rgba(59,130,246,0.45) !important;
  outline-offset: 2px;
}

/* Disabled states */
#jisedai-app .fixed-footer .button-row > button:disabled,
#jisedai-app .fixed-footer .button-row > a[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
}

/* =========================================================
   v62 (2026-01-24): Footer buttons hover/tap scale
   - Mouse: hover -> slightly scale up
   - Touch panel: active (tap) -> slightly scale up
   - Keep layout stable (use transform) + bring hovered button above neighbors
   - Respect prefers-reduced-motion
========================================================= */

/* Allow scaled buttons to overflow naturally */
#jisedai-app .fixed-footer,
#jisedai-app .fixed-footer .button-row {
  overflow: visible;
}

#jisedai-app .fixed-footer .button-row > button,
#jisedai-app .fixed-footer .button-row > a {
  position: relative;
  transform: translateZ(0);
  transform-origin: center;
  will-change: transform;
  transition: transform .14s ease, box-shadow .14s ease;
}

/* Mouse hover (desktop) */
@media (hover: hover) and (pointer: fine) {
  #jisedai-app .fixed-footer .button-row > button:hover,
  #jisedai-app .fixed-footer .button-row > a:hover {
    transform: scale(1.05);
    z-index: 2;
    box-shadow: 0 10px 22px rgba(0,0,0,0.18);
  }
}

/* Touch / coarse pointer */
@media (hover: none), (pointer: coarse) {
  #jisedai-app .fixed-footer .button-row > button:active,
  #jisedai-app .fixed-footer .button-row > a:active {
    transform: scale(1.04);
    z-index: 2;
    box-shadow: 0 10px 22px rgba(0,0,0,0.18);
  }
}

/* Accessibility: reduce motion */
@media (prefers-reduced-motion: reduce) {
  #jisedai-app .fixed-footer .button-row > button,
  #jisedai-app .fixed-footer .button-row > a {
    transition: none !important;
  }
  #jisedai-app .fixed-footer .button-row > button:hover,
  #jisedai-app .fixed-footer .button-row > a:hover,
  #jisedai-app .fixed-footer .button-row > button:active,
  #jisedai-app .fixed-footer .button-row > a:active {
    transform: none !important;
    box-shadow: none !important;
  }
}

/* =========================================================
   v66 (2026-01-26): Settings panel - avoid header overlap in expanded cards
   - When a settings card is expanded (position: fixed), the panel header stays above it (higher z-index).
   - This can hide the top rows of the form/table. Add safe top padding inside expanded cards.
========================================================= */

#estimateSettingsContainer {
  --panelHeaderSafeSpace: 76px; /* 60px header + 16px gap */
}

#estimateSettingsContainer .settings-card.expanded {
  padding-top: var(--panelHeaderSafeSpace) !important;
  /* iOS safe-area (if supported) */
  padding-top: calc(var(--panelHeaderSafeSpace) + env(safe-area-inset-top)) !important;
  box-sizing: border-box !important;
}

/* ===============================
   v68: Mobile portrait full-width cards
   - Prevent horizontal swipe/overflow on main 3 cards
   - Ensure fieldset/table can shrink within viewport
   =============================== */
@media (max-width: 900px) {
  /* Force single-column grid (override any horizontal-scroll/flex styles) */
  body.page-test-jisedai #jisedai-app .app-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Grid items must be allowed to shrink */
  body.page-test-jisedai #jisedai-app .app-grid > * {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Cards themselves should never exceed viewport width */
  body.page-test-jisedai #jisedai-app .app-grid .card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  /* fieldset has a browser default "min-inline-size: min-content" which can cause overflow */
  body.page-test-jisedai #jisedai-app .app-grid fieldset {
    min-inline-size: 0 !important;
    max-width: 100% !important;
  }
  body.page-test-jisedai #jisedai-app .app-grid legend {
    max-width: 100% !important;
    white-space: normal !important;
  }

  /* Table-like content: force it to shrink & wrap instead of expanding viewport */
  body.page-test-jisedai #jisedai-app .app-grid table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed;
  }
  body.page-test-jisedai #jisedai-app .app-grid th,
  body.page-test-jisedai #jisedai-app .app-grid td {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* Existing wrapper sometimes enables horizontal scrolling; disable it on mobile */
  body.page-test-jisedai #jisedai-app .app-grid .results-table-wrapper {
    overflow-x: hidden !important;
  }
}

/* =========================
   v69: Mobile full-width guarantee (no body class dependency)
   - Fix: iPhone縦で「足場数量計算 / 計算結果 / 費用計算結果」の3カードが横スワイプになり、
          画面幅に収まらない問題の最終ガード。
   - 既存CSSやテーマ側の上書きに負けないよう、#jisedai-app を起点に !important で固定します。
   ========================= */
@media (max-width: 900px) {
  #jisedai-app .app-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-flow: row !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  #jisedai-app .app-grid > * {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #jisedai-app .app-grid .card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #jisedai-app .app-grid fieldset {
    min-inline-size: 0;
    min-width: 0;
    max-width: 100%;
  }
  #jisedai-app .app-grid table {
    width: 100%;
    table-layout: fixed;
  }
  #jisedai-app .app-grid th,
  #jisedai-app .app-grid td {
    word-break: break-word;
  }
  /* iOSで入力欄が横にはみ出すのを防ぐ */
  #jisedai-app input,
  #jisedai-app select,
  #jisedai-app textarea {
    max-width: 100%;
    box-sizing: border-box;
  }
}


/* -------------------------------------------------------------
   Scaffold card: stack items per line in specific fieldsets
   - 足場のタイプ選択
   - スパン数の入力
   - 壁つなぎ
   (prevents horizontal crowding / swipe)
------------------------------------------------------------- */
@supports selector(fieldset:has(#type)) {
  .fieldset-legacy:has(#type) .scaffold-inline-set,
  .fieldset-legacy:has(#spans1800) .scaffold-inline-set,
  .fieldset-legacy:has(#kabeTsunagiLength) .scaffold-inline-set {
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
  }

  .fieldset-legacy:has(#type) .scaffold-inline-set > *,
  .fieldset-legacy:has(#spans1800) .scaffold-inline-set > *,
  .fieldset-legacy:has(#kabeTsunagiLength) .scaffold-inline-set > * {
    width: 100%;
    max-width: 100%;
  }

  /* If each item is a <label> that wraps a control, keep it tidy */
  .fieldset-legacy:has(#type) .scaffold-inline-set > label,
  .fieldset-legacy:has(#spans1800) .scaffold-inline-set > label,
  .fieldset-legacy:has(#kabeTsunagiLength) .scaffold-inline-set > label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .fieldset-legacy:has(#type) .scaffold-inline-set select,
  .fieldset-legacy:has(#type) .scaffold-inline-set input,
  .fieldset-legacy:has(#spans1800) .scaffold-inline-set select,
  .fieldset-legacy:has(#spans1800) .scaffold-inline-set input,
  .fieldset-legacy:has(#kabeTsunagiLength) .scaffold-inline-set select,
  .fieldset-legacy:has(#kabeTsunagiLength) .scaffold-inline-set input {
    max-width: 100%;
  }
}

/* =========================================================
   [v71] 足場数量計算：指定項目を「項目ごとに改行」
   - 足場のタイプ選択：組み立て内容 / 足場幅 / 手摺仕様
   - スパン数の入力：1800/1500/1200/900/600
   - 壁つなぎ：長さ / 水平ピッチ / 垂直ピッチ
========================================================= */

#scaffoldForm #type,
#scaffoldForm #width,
#scaffoldForm #handrailSpec,
#scaffoldForm #spans1800,
#scaffoldForm #spans1500,
#scaffoldForm #spans1200,
#scaffoldForm #spans900,
#scaffoldForm #spans600,
#scaffoldForm #kabeTsunagiLength,
#scaffoldForm #kabeTsunagiPitch,
#scaffoldForm #kabeTsunagiVerticalPitch {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}