/* サイト共通の追加修正はここに書く（全ページで最後に読み込まれる） */

/* ヘッダーの横幅（2026-09-07）
   元は1368pxで、1920pxの画面だと左右に276pxずつ余白ができて窮屈に見えた。
   メインビジュアルが全幅なので、ヘッダーも広げて釣り合いを取る。
   全幅にするとロゴが画面の角に張り付くため、1680pxで止めている。
   本文（1180px）とフッター（1180px）はそのまま。フッターは背景色で分かれているので不揃いは目立たない。 */
.menuBox{ max-width:1680px }

/* 画像の縦横比（2026-09-07 修正）
   TOPページのCSSだけ img の height:auto が抜けていて、HTMLの height="126" がそのまま効き、
   フッターのロゴが縦に2.5倍伸びていた（表示比2.063／本来5.159）。元の静的HTMLからあった不具合。
   ここで全ページに効かせて、同じことが起きないようにする。
   写真カードなどの object-fit:cover を使う画像は影響を受けない。 */
img{ height:auto }

/* ===== スマホ表示の調整（2026-09-07 user指示） ===== */

/* 郵便番号のうしろで改行する。パソコンでは1行のまま */
.spBr{ display:none }

@media (max-width:768px){
  /* 郵便番号で改行 */
  .spBr{ display:inline }

  /* フッターのリンク一覧とプライバシーポリシーは出さない。
     同じ内容はハンバーガーメニューにあるため（プライバシーポリシーもメニューに追加済み） */
  footer .box > div:not(.ftInfo){ display:none }

  /* ハンバーガーボタンを画面に固定して、どこまでスクロールしても押せるようにする。
     ヘッダー内の元の位置とほぼ同じ場所に置くので、最初の見え方は変わらない。
     スマホメニュー（z-index:200）より下、下部の固定バー（150）より上に重ねる */
  .hbg{
    position:fixed; top:12px; right:18px; z-index:180;
    box-shadow:0 6px 18px rgba(60,40,20,.28);
  }
  /* ボタンが固定になって空いた分、ヘッダーの右側に余白を残す（ロゴと重ならないように） */
  .menuBox{ padding-right:82px }
}

/* ===== Instagram連携（Smash Balloon）の見た目を今のデザインに合わせる（2026-09-07） =====
   接続が済むと、TOPの「日々の活動」がプラグインの出力に切り替わる（front-page.php の flx_insta_ready()）。
   プラグイン標準の枠・余白・ヘッダー・もっと見るボタンは消して、既存の5枚グリッドと同じ形にする。 */
/* 外枠は5列グリッドをやめる。プラグインは中身をまとめた「1つの塊」で出すので、
   グリッドのままだと1列ぶん（横1/5）に潰れて極端に小さくなる。 */
.insta .grid.instaFeed{ display:block !important; margin-top:8px }
.instaFeed #sb_instagram{
  padding:0 !important; margin:0 !important; width:100% !important; max-width:none !important;
}
.instaFeed .sb_instagram_header,
.instaFeed #sbi_load{ display:none !important; padding:0 !important; margin:0 !important; }
/* 並びはこちらで作る。プラグインの列数設定（4列など）や inline の gap より優先させる。
   グリッドではなく flex + 中央寄せにしてあるのは、投稿が5枚に満たないときに
   左に寄って空きが目立つのを避けるため（1枚でも中央にくる）。 */
.instaFeed #sbi_images{
  display:flex !important; flex-wrap:wrap; justify-content:center;
  gap:18px !important; padding:0 !important; width:100% !important;
}
.instaFeed .sbi_item{
  flex:0 0 calc((100% - 72px) / 5);   /* 18px の隙間4つぶんを引いて5等分 */
  width:auto !important; padding:0 !important; margin:0 !important;
  overflow:hidden; border-radius:10px; aspect-ratio:1/1;
}
/* デザインは5枚。プラグイン側の取得件数が多くても6枚目以降は出さない */
.instaFeed .sbi_item:nth-child(n+6){ display:none !important }
/* 2枚目・4枚目だけ、今のデザインと同じ有機的な形に */
.instaFeed .sbi_item:nth-child(2n){ border-radius:46% 54% 48% 52% / 52% 46% 54% 48% }
.instaFeed .sbi_photo_wrap, .instaFeed .sbi_photo{ width:100%; height:100%; display:block }
.instaFeed .sbi_photo img{ width:100%; height:100%; object-fit:cover; display:block }
@media (max-width:768px){
  .instaFeed .sbi_item{ flex:0 0 calc((100% - 18px) / 2) }   /* 2列 */
  .instaFeed .sbi_item:nth-child(n+5){ display:none !important }
}
