/* ==========================================================
   PAGE: Home（rc3）
   rc3-fixed-gap（リッチカラム 3列→SPで1列）
   画像はカラム幅にフィット、ボタンは中央&内容幅
   タブレットでも列間ギャップを優先保持
========================================================== */

/* 1) 親インナーをGrid化。各セルで中央寄せ */
.rc3-fixed-gap .swell-block-columns__inner {
  display: grid !important; /* SWELLのflexを上書き */
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 2.4vw, 32px);
  justify-items: center; /* セル内で水平方向に中央 */
  align-items: start;    /* 上揃え */
}

@media (max-width: 640px) {
  .rc3-fixed-gap .swell-block-columns__inner {
    grid-template-columns: 1fr; /* スマホは1列 */
    gap: 16px;
  }
}

/* 2) カラム（＋内側ラッパ）をカード化して中央寄せ */
.rc3-fixed-gap .swell-block-column,
.rc3-fixed-gap .swell-block-column__inner {
  display: flex;
  flex-direction: column;
  align-items: center; /* 画像もボタンも中央寄せ */
  text-align: center;
  width: 100%;
}

/* 3) 画像サイズ：カラム幅にフィット + 最大幅で見栄え調整 */
.rc3-fixed-gap .wp-block-image {
  width: 100%;
  max-width: clamp(240px, 28vw, 420px); /* 必要に応じて調整 */
  margin: 0 auto;
}
.rc3-fixed-gap .wp-block-image img {
  display: block;
  width: 100% !important;   /* サムネ幅や属性値を上書き */
  height: auto !important;
}

/* 4) 画像とボタンの間隔 */
.rc3-fixed-gap .swell-block-column > * + * {
  margin-top: clamp(10px, 1.2vw, 16px);
}

/* === rc3-fixed-gap：ボタンをテキスト幅に（横に伸ばさない）=== */

/* ===============================
   rc3-fixed-gap：カラム制御のみ
=============================== */

.rc3-fixed-gap .wp-block-buttons{
  width: 100%;
  display: flex;
  justify-content: center !important;
  gap: 12px;
  flex-wrap: wrap;   /* ← 将来2行以上対応 */
}

.rc3-fixed-gap .wp-block-buttons > .wp-block-button{
  flex: 0 0 auto !important;
  width: auto !important;
}


/* =========================================
   rc3-fixed-gap：SWELL既定の columns 余白（--swl-clmn-mrgn--x）を無効化
   ※インライン style を上書きするため !important 必須
   ========================================= */
.swell-block-columns.rc3-fixed-gap{
  --swl-clmn-mrgn--x: 0px !important;
  --swl-clmn-pddng--x: 0px !important; /* 環境によって効く */
}

/* 念のため、外枠・内枠の左右余白も強制リセット */
.swell-block-columns.rc3-fixed-gap{
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

.rc3-fixed-gap .swell-block-columns__inner{
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

/* rc3-fixed-gap：SWELLの擬似余白（変数）だけを無効化 */
.post_content .swell-block-columns.rc3-fixed-gap{
  --swl-clmn-mrgn--x: 0px !important;
  --swl-clmn-pddng--x: 0px !important;
}