/* ==========================================
 * 1. 背景エリア全体：斜めのツートンカラー固定（スライド演出なし）
 * 💡カラーパレット：ネイビー #142f40 × アイボリー #e7decd
 * ========================================== */
.twotone-back-area {
  position: relative !important;
  width: 100% !important;
  background: linear-gradient(
    105deg,
    #e7decd 0%,
    #e7decd 25%,
    #142f40 calc(25% + 1px),
    #142f40 75%,
    #e7decd calc(75% + 1px),
    #e7decd 100%
  ) !important;
  overflow: hidden !important;
}

/* ==========================================
 * 2. 中の各セクション：背景透過
 * ========================================== */
.twotone-back-area > section,
.twotone-back-area .test-container {
  background: transparent !important;
  position: relative !important;
  z-index: 2 !important;
  padding: 50px 0 !important;
}

/* ==========================================
 * 3. インラインスタイルを上書きする詳細度強化
 * ========================================== */

/* テキストボックス：半透明の黒座布団（0.75）にする */
.twotone-back-area .test-content-box[style] {
  background: rgba(17, 17, 17, 0.75) !important;
  backdrop-filter: blur(10px) !important;
  mix-blend-mode: normal !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
}

/* 文字色：強制的に白・薄グレーにする */
.twotone-back-area .test-content-box h2[style] {
  color: #ffffff !important;
  font-weight: bold !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
}

.twotone-back-area .test-content-box p[style] {
  color: #dddddd !important;
  font-weight: 500 !important;
}

/* 画像ボックス：インラインを上書きして絶妙な透過を維持 */
.twotone-back-area .test-image-box[style] {
  background: transparent !important;
  opacity: 0.88 !important;
}

.twotone-back-area .test-image-box img[style] {
  background: transparent !important;
  mix-blend-mode: multiply !important;
}

/* ==========================================
 * 4. VIEW MORE ボタンのホバーエフェクト
 * ========================================== */
.twotone-back-area .test-viewmore-btn[style] {
  color: #ffffff !important;
  border-color: #ffffff !important;
  background: transparent !important;
}

.twotone-back-area .test-viewmore-btn:hover {
  background: #ffffff !important;
  color: #111111 !important;
  opacity: 0.9 !important;
}