.gf-ad__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}

.gf-ad__figure img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.gf-ad__kvs dt {
  font-weight: 600;
  margin-bottom: 4px;
}
.gf-ad__kvs dd {
  margin-bottom: 16px;
}

.gf-ad__comment {
  margin-top: 40px;
  padding: 20px;
  background: #f9fafb;
  border-radius: 8px;
}
.gf-ad__comment-title {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 10px;
}
/* ▼ このエリアについてのコメント内 縦線削除 */
.gf-ad__comment .hs-richtext blockquote,
.gf-ad__comment blockquote,
.gf-ad__comment .hs-richtext p {
  border-left: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
.gf-ad__comment .hs-richtext,
.gf-ad__comment .hs-richtext * {
  border: none !important;
  background: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
/* ▼ コメントブロック内の左縦線(装飾)を完全に無効化 */
.area-contents .area-content .gf-ad__comment h1,
.area-contents .area-content .gf-ad__comment h2,
.area-contents .area-content .gf-ad__comment h3,
.area-contents .area-content .gf-ad__comment h4,
.area-contents .area-content .gf-ad__comment h5,
.area-contents .area-content .gf-ad__comment .gf-ad__comment-title {
  border-left: none !important;
  background-image: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* 擬似要素で入っている装飾（棒やグラデ）を殺す */
.area-contents .area-content .gf-ad__comment h1::before,
.area-contents .area-content .gf-ad__comment h2::before,
.area-contents .area-content .gf-ad__comment h3::before,
.area-contents .area-content .gf-ad__comment h4::before,
.area-contents .area-content .gf-ad__comment h5::before,
.area-contents .area-content .gf-ad__comment .gf-ad__comment-title::before {
  content: none !important;
  display: none !important;
}

/* リッチテキスト由来の blockquote の左線も念のため無効化 */
.area-contents .area-content .gf-ad__comment .hs-richtext blockquote,
.area-contents .area-content .gf-ad__comment blockquote {
  border-left: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
/* 好きな高さに調整：7項目の時にちょうど良い値にしてね */
:root { --gf-ad-figure-h: 420px; }

/* 2カラムを同じ高さにする */
.gf-ad__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: stretch; /* ←左右を同じ高さに伸ばす */
}

/* 左：画像を固定高に。contain=トリミングなし / cover=トリミングあり */
.gf-ad__figure{ height: var(--gf-ad-figure-h); }
.gf-ad__figure img{
  width: 100%;
  height: 100%;
  object-fit: contain; /* ロゴ等なら contain。写真なら cover に変更 */
}

/* 右：最低でも画像の高さ分は確保 */
.gf-ad__kvs{
  min-height: var(--gf-ad-figure-h);
  display: block;
}

/* （任意）行間を少し詰めると7項目でちょうど良くなりやすい */
.gf-ad__kvs dt{ font-weight: 600; margin-bottom: 4px; line-height: 1.3; }
.gf-ad__kvs dd{ margin-bottom: 6px; line-height: 1.6; }
/* =========================================================
   ▼ PC用の行スタイルをここで定義
   ========================================================= */
.area-contents .gf-ad__row {
  /* この padding の数値で行間を調整してください */
  padding-top: 6px　!important;
  padding-bottom: 6px　!important;

  /* （参考）もし線が不要なら border-bottom: none; を追加 */
  /* border-bottom: 1px solid #eee; */ 
}
/* =========================================================
   ▼ 詳細ブロック（画像＋項目＋コメント） モバイル最適化パッチ
   ========================================================= */

/* 1) タブ直下に出る “うっすら2本線” を除去
   ─ 原因：sr-only の H3/H4 にグローバル装飾(::before)が効いている */
.area-contents .area-content .sr-only,
.area-contents .area-content h3.sr-only,
.area-contents .area-content h4.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,1px,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
.area-contents .area-content .sr-only::before,
.area-contents .area-content .sr-only::after,
.area-contents .area-content h3.sr-only::before,
.area-contents .area-content h3.sr-only::after,
.area-contents .area-content h4.sr-only::before,
.area-contents .area-content h4.sr-only::after{
  content:none !important; display:none !important;
}

/* 2) モバイル：縦1カラム＆余白最適化 */
@media (max-width: 959px){
  .area-contents .gf-ad__grid{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .area-contents .gf-ad__figure{
    height: 300px !important;
    padding: 20px !important;
  }
  .area-contents .gf-ad__kvs{
    min-height: auto !important;
    padding: 18px !important;
  }

  /* ＜・（丸ドット）が左に寄り過ぎ → 少し内側へ */
  .area-contents .gf-ad__row{
    grid-template-columns: 7.5em 1fr !important; /* ラベル列やや狭め */
    gap: 12px !important;
    padding: 6px 0 !important;
    padding-left: 8px !important;               /* 全体を少し内側へ */
  }
  .area-contents .gf-ad__row dt{ font-size: 13px !important; }
  .area-contents .gf-ad__row dd{ font-size: 15px !important; line-height: 1.6 !important; }

  /* ドット位置を内側へ（-16px → -10px） */
  .area-contents .gf-ad__row dt::before{
    left: -10px !important;
  }

  /* コメント見出しを大きく */
  .gf-ad__comment{
    margin-top: 24px !important;
    padding: 16px 18px !important;
  }
  .gf-ad__comment-title{
    font-size: 1.25rem !important;   /* ここでサイズUP */
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }
}

/* 3) 念のため：コメントエリアに他の装飾が混ざらないよう再ロック */
.gf-ad__comment,
.gf-ad__comment *{
  background-image:none !important;
  box-shadow:none !important;
}
@media (max-width: 959px){
  .gf-ad__comment-body{ font-size: 1rem; line-height: 1.9; }
}
/* =========================================================
   ▼ コメント見出しサイズ修正（PC・SP両対応）
   ========================================================= */
.gf-ad__comment-title{
  font-size: 1.4rem !important;  /* ←以前より大きめに */
  font-weight: 800 !important;
  line-height: 1.4 !important;
  margin-bottom: 12px !important;
  color: #1a1a1a !important;     /* 濃いめで見出し感を出す */
  letter-spacing: 0.02em !important;
}

/* コメント本文も読みやすく調整 */
.gf-ad__comment-body{
  font-size: 1.05rem !important;
  line-height: 1.9 !important;
  color: #333 !important;
}

/* =========================================================
   ▼ モバイル時にさらに見やすく（文字・余白）
   ========================================================= */
@media (max-width: 959px){
  .gf-ad__comment{
    margin-top: 28px !important;
    padding: 18px 20px !important;
  }
  .gf-ad__comment-title{
    font-size: 1.35rem !important; /* ←モバイルも大きく */
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
  }
  .gf-ad__comment-body{
    font-size: 1.05rem !important;
    line-height: 1.9 !important;
  }
}