/* BRIDGE本番模試：共通土台 moshi-base.css のテーマ上書き。
   テーマ色は記事アイキャッチ（burizzi-ulebutesuto.png）の実測から。
   占有率1位はサーモンピンク #E88586（38.3%）だが、赤系はエラー色 #e04e4e と衝突するうえ
   白文字が2.6:1しか出ないため、同じアイキャッチ内の下部帯のティール #037B7D（8.8%）を採用。
   #037B7D は白文字で5.15:1＝14pxの小ボタンでもAAを満たす。 */
.bridge-moshi {
  --m-deep: #037B7D;
  --m-deep-d: #025C5E;
  --m-deep-l: #E1F1F1;
  --m-blue: #037B7D;
  --m-blue-d: #025C5E;
  --m-mist: #F1F8F8;
  --m-shade: #A9D5D5;
  --m-shadow-rgb: 2, 92, 94;
  --m-orange: #E58B12;
  --m-orange-d: #9A5700;
}

#bridge-honban-moshi,
#bridge-practice { scroll-margin-top: 88px; }

.bridge-ad-anchor {
  display: block;
  width: 0;
  height: 0;
}

/* 検査名を端末モックの下へ潜らせない。 */
.bridge-moshi .moshi-gate-kicker {
  max-width: 100%;
  white-space: normal;
}

@container (max-width: 345px) {
  .bridge-moshi .moshi-gate-kicker { font-size: 10px; }
  .bridge-moshi .moshi-intro-title { font-size: 17px; }
}

/* 図表問題は横に長くなるため、狭い画面では表だけ横スクロールさせる。 */
.bridge-moshi .moshi-q-text table {
  max-width: 100%;
}
/* 330pxで見出しセルが「店/舗」のように1文字ずつ折れるのを防ぐ（横スクロールで逃がす）。 */
.bridge-moshi .moshi-q-text th,
.bridge-moshi .moshi-rb-review-q th {
  white-space: nowrap;
}
.bridge-moshi .moshi-q-text,
.bridge-moshi .moshi-rb-review-q {
  overflow-x: auto;
}

/* ===== BRIDGE記事の konowaka 枠 [bridge_konowaka] ===== */
.bridge-ad {
  container-type: inline-size;
  color: #333;
  font-family: inherit;
}
.bridge-ad .bridge-ad-phones-link { display: block; }
.bridge-ad .bridge-ad-konowaka-phones {
  display: block;
  width: min(100%, 480px);
  height: auto;
  margin: 2px auto 12px;
  filter: drop-shadow(0 8px 10px rgba(2, 92, 94, .2));
}
.bridge-ad .bridge-ad-btn {
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin: 12px auto;
  padding: 15px 20px;
  border-radius: 10px;
  color: #fff !important;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
  text-decoration: none !important;
  box-shadow: 0 4px 0 #c75b00, 0 8px 16px rgba(2, 92, 94, .2);
  transition: transform .12s, box-shadow .12s, opacity .12s;
}
.bridge-ad .bridge-ad-btn:hover { color: #fff !important; opacity: .94; transform: translateY(-1px); }
.bridge-ad .bridge-ad-btn:active { box-shadow: 0 1px 0 #c75b00; transform: translateY(3px); }
.bridge-ad .bridge-ad-btn .fa { margin-right: 6px; }
.bridge-ad .bridge-ad-btn--light { background: #ff9902; }
.bridge-ad .bridge-ad-btn--main { background: #27a69a; box-shadow: 0 4px 0 #1c8a80, 0 8px 16px rgba(2, 92, 94, .14); }
.bridge-ad .bridge-ad-btn--main:active { box-shadow: 0 1px 0 #1c8a80; }
.bridge-ad .bridge-ad-btn-sub { display: block; margin-top: 3px; font-size: 12px; font-weight: 600; opacity: .95; }

/* ===== 手置き広告 [ad_bridge]（2026-09-01）＝ box32 内のベネフィット/実績/注記。e3-moshi.css の e3-ad 同名クラスと同値 ===== */
.bridge-ad .bridge-ad-benefits {
  list-style: none;
  margin: 8px 0 12px;
  padding: 0;
  text-align: left;
}
.bridge-ad .bridge-ad-benefits li {
  position: relative;
  margin: 0;
  padding: 5px 0 5px 22px;
  font-size: 15px;
  line-height: 1.55;
  color: #252525;
}
.bridge-ad .bridge-ad-benefits li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.78em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #252525;
}
.bridge-ad .bridge-ad-proof {
  margin: 4px 0 2px;
  text-align: center;
  font-weight: 700;
  font-size: 15px;
  color: #808080;
}
.bridge-ad .bridge-ad-proof + .bridge-ad-btn { margin-top: 2px; }
.bridge-ad .bridge-ad-note {
  display: block;
  margin-top: 8px;
  text-align: center;
  font-size: 12px;
  color: #ff0000;
}
