/* ---------------------------------------------------------
   [E] loose バリアント（必要な箇所だけ広めにする）
   - SNSリンクだけ単体で見せる時に“余白が気持ちいい”見え方にする
   使い方:
   - <div class="social-links-compact slc slc--loose"> ... </div>
--------------------------------------------------------- */
.acc-tight .social-links-compact.slc.slc--loose{
  --row-gap: clamp(6px, 0.7vw, 12px);  /* (1) 行間を広げる */
  --slc-line-height: 1.2;              /* (2) 行送りをゆったり */
  --social-top-pad: 8px;               /* (3) 上下余白を厚め */
  --social-bottom-pad: 10px;
}

/* ==========================================================
   PAGE: Our Locations
========================================================== */

/* ==================================================
   タブレットだけ強制2列化
   対象：.force-tb-2col を含むカラム
===================================================== */

@media (min-width:600px) and (max-width:959px){

  /* ① columns本体をflexに戻す */
  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-columns{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }

  /* ② innerを通常状態に */
  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-columns__inner{
    display: contents !important;
  }

  /* ③ 子カラムを50%固定 */
  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-column{
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }

	/*↓↓↓左のテキストブロックの隣にあるパディングを無くして位置を中心にする↓↓↓*/
	
   /* カラム内paddingを削除 */
  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-column{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* columnsの左右マージンもリセット */
  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-columns{
    --swl-clmn-mrgn--x: 0 !important;
  }
	
	/*↓↓↓左右のブロックの間にgapを入れて間隔を開ける↓↓↓*/
	  .force-tb-2col 
  .swell-block-accordion__body 
  .swell-block-columns{

    gap: clamp(16px, 3vw, 32px) !important;

  }
	
}



/* =====================================================
   location-directory-scope
   Our Locations タブレット・PC表示専用レイアウト制御
===================================================== */
@media (min-width:600px){
.location-directory-scope .wp-block-group__inner-container{
display:flex;
flex-direction:column;
}
.location-directory-scope 
.swell-block-accordion__body
.swell-block-columns{
    margin-bottom: 35px !important;
}
	
.location-directory-scope
.wp-block-details:last-of-type
.swell-block-columns:last-of-type{
  margin-bottom: 30px !important;
}

}


/* =====================================================
   location-directory-scope
   Our Locations スマホ表示専用レイアウト制御
===================================================== */

@media (max-width:599px){

  /* ---------------------------------
     ① 各センター内部の縦リズムを整理
  --------------------------------- */

  .location-directory-scope 
  .swell-block-columns 
  .swell-block-column > *{
    margin-bottom: 5px !important;	/* センター名title下のマージン制御 */
  }

  .location-directory-scope 
  .swell-block-columns 
  .swell-block-column > *:last-child{
/*     margin-bottom: 0 !important; */
  }

  /* 段落間をタイトに */
  .location-directory-scope 
  .swell-block-columns 
  p + p{
    margin-top: 6px !important;
  }

  /* ---------------------------------
     ② テキストと画像の距離を自然に
  --------------------------------- */
/* テキスト直下の隙間調整の値 */

	/* defaultはgapなし */
	.location-directory-scope
	.swell-block-accordion__body
	.swell-block-columns__inner{
		gap:16px !important;
		row-gap: 0 !important;
	}
	
	/* アコーディオンが開いている時だけ有効 */
	.location-directory-scope
	.swell-block-accordion__item.is-opened
	.swell-block-accordion__body
	.swell-block-columns__inner{
		row-gap: 12px !important;	/* アイコン群と画像との隙間 */
	}
	
  /* ---------------------------------
     ③ SPの時のセンター塊同士の間隔
  --------------------------------- */

   .location-directory-scope 
  .swell-block-columns{
    margin-bottom: 30px !important;
  }
	
	/* フロリダセンターの下だけ別で余白を与える */
	.location-florida 
.swell-block-column:last-child > figure{
  margin-bottom: 30px !important;
}
	
}


/* =====================================================
   地域（州）アコーディオン調整
===================================================== */

/* ===============================
   地域アコーディオン（タイトル）
================================ */

.location-directory-scope 
.swell-block-accordion__title{
  padding: 12px 8px !important; /* 少し広め */
  align-items: center !important;
  line-height: 1.3 !important;
}


/* ===============================
   地域アコーディオン body 余白削減
================================ */

 /* 閉じている時は余白ゼロ */
 .location-directory-scope 
 .swell-block-accordion__body{
   padding-top: 0 !important;
   padding-bottom: 0 !important;
 }

 /* 開いている時だけ余白を入れる */
 .location-directory-scope 
 .swell-block-accordion__item.is-opened
 .swell-block-accordion__body{
   padding-top: 5px !important;
   padding-bottom: 5px !important;
 }

 /* アニメーションと同期 */
 .location-directory-scope 
 .swell-block-accordion__body{
   transition:
     max-height .38s cubic-bezier(.22,1,.36,1),
     opacity .28s ease,
     padding .28s ease;
 }



/* ===============================
   国リスト間隔をコンパクトに
================================ */

.location-directory-scope 
.wp-block-details{
  margin: 0px 0 !important;
  padding: 0 !important;
}


/* 国名summaryの高さ整理 */
.location-directory-scope 
.wp-block-details summary{
  padding: 6px 8px !important;
  display: flex !important;
  align-items: center !important;
  line-height: 1.4 !important;
}



/* =====================================================
		   アコーディオン開閉モーション
===================================================== */

.location-directory-scope 
.swell-block-accordion__body{
  height: auto !important;
  overflow: hidden;
  opacity: 1;
  transition:
    max-height .38s cubic-bezier(.22,1,.36,1),
    opacity .28s ease;
}

/* 閉じた状態 */
.location-directory-scope 
.swell-block-accordion__item:not(.is-opened)
.swell-block-accordion__body{
  max-height: 0;
  opacity: 0;
}

/* 開いた状態 */
.location-directory-scope 
.swell-block-accordion__item.is-opened
.swell-block-accordion__body{
  max-height: 5000px;
  opacity: 1;
}


/* ================================================================= */

/* ============================
   アコーディオン内部をタイトに（acc-tight）
   ============================ */

/* アコーディオン本体と次ブロックの間も過剰に空けない */
.acc-tight { margin-bottom: 0 !important; }
.acc-tight + * { margin-top: clamp(15px, 1vw, 19px) !important; }

/* 本体：中身コンテナ（SWELLは data-swl-acc="body"）の上下パディングを控えめに */
.acc-tight .swell-block-accordion__body,
.acc-tight [data-swl-acc="body"] {
  padding-top: clamp(6px, 0.8vw, 12px) !important;
  padding-bottom: clamp(6px, 0.8vw, 12px) !important;
}

/* 先頭/末尾での余白ダブりを防止 */
.acc-tight [data-swl-acc="body"] > *:last-child  { margin-bottom: 0 !important; }

/* アコーディオン内部の縦リズム（隣接要素の基本間隔） */
.acc-tight [data-swl-acc="body"] > * + * {
  margin-top: clamp(4px, 0.8vw, 7px) !important;
}

/* 段落 ↔ h3 の間隔をさらにタイトに（ご要望ポイント） */
.acc-tight [data-swl-acc="body"] p + h3,
.acc-tight [data-swl-acc="body"] h3 + p {
  margin-top: clamp(6px, 0.8vw, 12px) !important;
}

/* センター名titleの段落のデフォルト下余白を少し抑える（内部のみ） */
.acc-tight [data-swl-acc="body"] p { margin-bottom: 5px !important; }

/* SWELLのセクションタイトル（下線つき等）を使っている場合 */
.acc-tight [data-swl-acc="body"] .c-secTitle { 
  margin-bottom: clamp(6px, 0.8vw, 12px) !important;
}
.acc-tight [data-swl-acc="body"] .c-secTitle__line { 
  margin-top: 6px !important;
}

/* 区切り線/スペーサーが入っているケースも圧縮 */
.acc-tight [data-swl-acc="body"] hr.wp-block-separator {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}
.acc-tight [data-swl-acc="body"] .wp-block-spacer {
  height: 8px !important; /* スペーサーが原因の“謎の空き”対策 */
}


/* Our Locationsの国とセンター紹介とアクセスのレイアウト */
/* ▼ アコーディオン（acc-tight 内）に埋め込まれた social-links をタイトに */
.acc-tight .social-links-compact {
  --row-gap: clamp(6px, 0.7vw, 12px);  /* ← 行間の基本値。好みで調整OK */
  line-height: 1.2;
  margin: 0 !important;
  padding: 0 !important;
}

/* 余計な改行を無効化（<br>が空行を作るのを止める） */
.acc-tight .social-links-compact br { display: none !important; }

/* p がデフォルトで持つ下マージンを0に */
.acc-tight .social-links-compact p { margin: 0 !important; }

/* アンカーを横並び・中央揃え・行間は --row-gap で管理 */
.acc-tight .social-links-compact a,
.acc-tight .social-links-compact p > a {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;                     /* アイコンとテキストの間隔 */
  margin: 0 !important;         /* inline style を打ち消し */
  padding: 0 !important;
  white-space: nowrap;
  text-decoration: none !important;
}

/* 行間（上下の余白）を統一。p の有無に左右されないよう包括的に指定 */
.acc-tight .social-links-compact > * + *,
.acc-tight .social-links-compact a + a,
.acc-tight .social-links-compact a + p,
.acc-tight .social-links-compact p + a,
.acc-tight .social-links-compact p + p {
  margin-top: var(--row-gap) !important;
}

/* アイコンサイズ（必要なら調整） */
.acc-tight .social-links-compact svg {
  width: 20px; height: 20px; flex: 0 0 auto;
}


/* === social-links の上下だけ内側余白を足す（acc-tight 内のみ） === */
/* 好みの値に変えてOK：例）上 8px／下 10px */
.acc-tight .social-links-compact {
  --social-top-pad: 8px;
  --social-bottom-pad: 10px;
  padding-top: var(--social-top-pad) !important;
  padding-bottom: var(--social-bottom-pad) !important;
}

/* 余計な空行を作る可能性のある空の <p> を無効化（保険） */
.acc-tight .social-links-compact p:empty {
  display: none !important;
}


/* ✅ social-links-compact を確実に縦並びにする（acc-tight 内のみ） */
.acc-tight .social-links-compact{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
/*   gap: var(--row-gap) !important; */
}

/* ✅ 各リンクは1行を占有させる（横並び事故を防止） */
.acc-tight .social-links-compact a,
.acc-tight .social-links-compact p > a{
  display: inline-flex !important; /* アイコンと文字は横並び */
  margin-top: 0 !important;        /* 既存の margin-top ルールと二重にならないように */
}

/* ✅ 既存の「a + a の margin-top」で行間が二重になるのを防止 */
.acc-tight .social-links-compact > * + *,
.acc-tight .social-links-compact a + a,
.acc-tight .social-links-compact a + p,
.acc-tight .social-links-compact p + a,
.acc-tight .social-links-compact p + p{
  margin-top: 0 !important;
}


/* アコーディオン単体：下線のみ（横線だけ） */
.acc-under{
  --acc-bd: 1px;
  --acc-bd-color: #766e64; /* 好きな色に変更 */
}

/* SWELLアコーディオンの “外側details” のみに下線を描く */
.acc-under.swell-block-accordion > details.swell-block-accordion__item{
  border: 0 !important;
  border-bottom: var(--acc-bd) solid var(--acc-bd-color) !important;
  margin: 0 !important;
  box-shadow: none !important;

  /* 縦線が出る可能性を潰す（保険） */
  border-left: 0 !important;
  border-right: 0 !important;
}

/* さらに保険：タイトル側に余計な線がある場合も消す（横線は外側detailsで管理） */
.acc-under.swell-block-accordion .swell-block-accordion__title{
  border: 0 !important;
  box-shadow: none !important;
}

/* アコーディオン内の “詳細ブロック(details)” には線を出さない（今回の悩み対策） */
.acc-under details.wp-block-details{
  border: 0 !important;
  box-shadow: none !important;
}

/* ================================================================= */


/* =========================================
   detailsのタイトルと中身の左端を揃える（アコーディオン内の詳細ブロックのタイトル）
========================================= */

/* 共通余白変数（ここを変えるだけで全体調整できる） */
:root{
  --details-side-gap: clamp(8px, 1vw, 16px);
}

/* summary */
.location-directory-scope 
.wp-block-details > summary{
  padding-left: 0 !important;
  padding-right: var(--details-side-gap) !important;
  box-sizing: border-box;
}

/* 矢印をコンテンツ右端に寄せる */
.post_content details.wp-block-details > summary::before{
  right: 0 !important;
}



/* =========================================
   （詳細ブロックの）detailsタイトル〜（詳細ブロック内の）コンテンツ間の隙間統一
========================================= */

.location-directory-scope 
.wp-block-details > summary{
  margin-bottom: 0 !important; /* ←原因①を殺す */
}

/* details直下の最初の要素の余白をリセット */
.location-directory-scope 
.wp-block-details > *:not(summary):first-child{
  margin-top: 0 !important; /* ←原因②を殺す */
}

/* columnsの縦余白を消す */
.location-directory-scope 
.wp-block-details 
.swell-block-columns{
  margin-top: 0 !important;
}

/* ================================================================= */


/* =========================
   Location テスト用サイズ固定
========================= */
/* インラインstyle（各ブロックのTtボタンのやつ）を潰す
 * 完全無効化 */
.location-title span{
  font-size: unset !important;
}

/* 地域（Asiaなど） */
.location-region .swell-block-accordion__label{
  font-size: 24px !important;
}


/* 国（Franceなど） */
.location-directory-scope .location-country {
  font-size: 21px !important;
  font-weight: 700;
}

/* センター名（Shumei Franceなど） */

/* 再定義  ↑のunsetとセット */
.location-directory-scope .location-title{
	font-size: 18px !important;
}
.location-directory-scope .location-title,
.location-directory-scope .location-title *{
  font-size: 18px !important;
}

/* 住所 */
.location-directory-scope .location-address {
  font-size: 17px !important;
}


/* ============================
 * キャレットのUIサイズ設定 
===============================*/
/* アコーディオンのサイズ固定 */
.location-directory-scope 
.location-region 
.swell-block-accordion__icon {
  font-size: 16px !important;
}
/* 詳細ブロックのサイズ固定 */
.location-directory-scope 
details.wp-block-details > summary::before {
  width: 16px !important;
  height: 16px !important;
}

/* ================================================================= */


/* ================================================================= */

/* ====================================================
 * Gutenberg（ブロックの設定）でしたline-height設定を潰して
 * CSSで行間の設定をする
 ==================================================== */




/* 自分の設計で上書き */
/*  .location-region{
  line-height: 1.3!important; 上部の州の設定で済
} */

.location-country{
  line-height: 1.1;
}

.location-directory-scope .location-title{
  line-height: 1.1;
}



/* ↓↓なぜかブラジルだけ適用される↓↓*/
.location-directory-scope p.contact-lines.location-address{
  line-height: 1.5 !important;
}

/* ===== SNS ===== */
.location-directory-scope .social-links-compact{
  line-height: 1.5 !important;
}

/* =========================================================
   social-links-compact (slc) — 行間バリアント
   目的:
   - デフォルトは「tight（詰め）」：住所/電話などの本文テキストと並べても目立たない
   - 必要な箇所だけ「loose（広め）」：SNSリンク単体表示で見栄え良く
   使い分け:
   - <div class="social-links-compact slc">            ← tight（デフォルト）
   - <div class="social-links-compact slc slc--loose"> ← loose
========================================================= */


/* ---------------------------------------------------------
   [A] slc の共通スタイル（デフォルト = tight）
   ※ここを触ると基本の見た目が変わります
	2026-04-01 1.5にしてlocation-xxクラスと統一させてしまった
--------------------------------------------------------- */
.acc-tight .social-links-compact.slc{

  /* (3) ブロック上下の余白（social-links 全体の上下の“外観の厚み”）
     - テキストと並べるときは薄めが自然 */
  --social-top-pad: 2px;               /* ←デフォルトtight */
  --social-bottom-pad: 2px;            /* ←デフォルトtight */
  
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  
  
  /* (1) 行間（縦方向の間隔）
     - row と row の間隔に使います
     - 値を小さく → 行間が詰まる / 大きく → 行間が広がる */
/*   --row-gap: clamp(2px, 0.35vw, 6px); */ /* ←デフォルトtight */

  /* (2) 行送り（リンク行そのものの詰まり具合）
     - 値を小さく → 文字の上下が詰まる（本文と馴染みやすい）
     - 値を大きく → ゆったり */
/*   --slc-line-height: 1.3;    */          /* ←デフォルトtight */


  /* ここから実適用 */
/*   line-height: var(--slc-line-height); */

}

/* ----------------------------------------------
 * Americaのグループ化によって生まれる余白を潰す
   ---------------------------------------------- */
.location-directory-scope 
.wp-block-details{
  --wp--style--block-gap: 0 !important;
}

/* ---------------------------------------------------------
   [B] wpautop / ブロック整形対策（再発防止の保険）
   目的:
   - Gutenberg / アコーディオン内で <br> や <p> が混入しても崩れないように
   注意:
   - あなたの運用（コメントを row 内に置く）を守れているなら、
     これらは“ほぼ効かない”＝安全な保険になります
--------------------------------------------------------- */

/* 改行タグが勝手に増えても見た目に影響させない */
.acc-tight .social-links-compact.slc br{
  display: none !important;
}

/* slc直下に <p> が混入した場合に“1行扱い”で隙間が増えるのを防止
   例: <p><!-- Email --></p> のようなコメント入り p も確実に無効化 */
.acc-tight .social-links-compact.slc > p{
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* ---------------------------------------------------------
   [C] 行間の付け方（重要）
   - row + row の時だけ margin-top を入れる
   - 余計な要素が挟まっても行間が二重化しづらい
--------------------------------------------------------- */
.acc-tight .social-links-compact.slc .slc__row + .slc__row{
  margin-top: var(--row-gap) !important;
}


/* ---------------------------------------------------------
   [D] 1行（リンク）の見た目
   - テキスト + アイコンは横並び
--------------------------------------------------------- */
.acc-tight .social-links-compact.slc .slc__link{
  display: inline-flex !important;
  align-items: center;
  gap: 10px;                /* (4) テキストとアイコンの距離 */
  white-space: nowrap;
  text-decoration: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.acc-tight .social-links-compact.slc .slc__icon{
  width: 20px;              /* (5) アイコンサイズ（他SNSと統一） */
  height: 20px;
  flex: 0 0 auto;
}


/* アコーディオン内の段落ブロックに付与した「contact-lines」を指定した段落だけ下余白を0にする */
.acc-tight [data-swl-acc="body"] p.contact-lines{
  margin-bottom: 0 !important;
}
/* 旧の row+row は無効化 */
.acc-tight .social-links-compact.slc .slc__row + .slc__row{
  margin-top: 0 !important;
}


/* ==========================================================
   ACCORDION / UTILITY
========================================================== */

.acc-tight{margin-bottom:0 !important;}
.acc-tight + *{margin-top: clamp(15px,1vw,19px) !important;}