/* =========================
   【01】ヘッダー本体
   ========================= */
header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(8px);
  box-shadow:
    0 2px 8px rgba(0,0,0,0.06),
    0 6px 20px rgba(0,0,0,0.10);
}

/* =========================
   【02】ヘッダー余白（左ロゴ位置）
   ========================= */
header .wp-block-group {
  padding: 5px 30px 5px 1px !important;
}

header .wp-block-row {
  padding: 0 !important;
}

/* =========================
   【03】ナビ基本設定
   ========================= */
header .wp-block-navigation {
  margin-left: auto;
}

header .wp-block-navigation-item {
  margin-left: 18px;
}

header .wp-block-navigation a {
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* =========================
   【04】常に三本線にする（一旦停止）
   ========================= */
/*
header .wp-block-navigation__container {
  display: none !important;
}

header .wp-block-navigation__responsive-container-open {
  display: block !important;
}
*/


/* =========================
   【06】ハンバーガー高さ
   ========================= */
@media (min-width: 768px) {
  header .wp-block-navigation__responsive-container-open {
    transform: translateY(9px) !important;
  }
}

@media (max-width: 767px) {
  header .wp-block-navigation__responsive-container-open {
    transform: translateY(0px) !important;
  }
}

/* =========================
   【07】トップ画像土台
   ========================= */
.wp-block-cover {
  position: relative;
}

.wp-block-cover .wp-block-cover__inner-container {
  position: relative !important;
  min-height: 100% !important;
}

/* =========================
   【08】Scroll位置
   ========================= */
.wp-block-cover .wp-block-cover__inner-container > p.scroll-down-link {
  position: absolute !important;
  left: 50% !important;
  bottom: -30vh !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 22px !important;
  letter-spacing: 0.2em !important;
  text-align: center !important;
  z-index: 50 !important;
  animation: scrollFade 2s ease-in-out infinite;
}

/* =========================
   【09】Scroll線
   ========================= */
.wp-block-cover .wp-block-cover__inner-container > p.scroll-down-link::after {
  content: "";
  display: block;
  width: 1.5px;
  height: 80px;
  margin: 10px auto 0;
  background: rgba(255,255,255,0.9);
  animation: scrollLine 2s linear infinite;
}

/* =========================
   【10】線アニメーション
   ========================= */
@keyframes scrollLine {
  0% { transform: translateY(-20px); opacity: 0; }
  30% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(30px); opacity: 0; }
}

/* =========================
   【11】Scrollフェード
   ========================= */
@keyframes scrollFade {
  0% { opacity: 0.3; }
  50% { opacity: 1; }
  100% { opacity: 0.3; }
}

/* =========================
   【12】スムーススクロール
   ========================= */
html {
  scroll-behavior: smooth;
}

/* =========================
   【13】スマホロゴ
   ========================= */
@media (max-width: 767px) {
  header .wp-block-site-title {
    font-size: 10px !important;
    line-height: 1.2 !important;
  }
}

/* =========================
   【14】スマホメニュー修正版（完全版）
   ========================= */
@media (max-width: 781px) {

/* -------------------------
   【14-1】メニュー全体（画面いっぱい）
   ------------------------- */
.wp-block-navigation__responsive-container.is-menu-open {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  background: rgba(255,255,255,0.68) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  z-index: 99999 !important;
  padding: 93px 20px 24px 20px !important;
  margin: 0 !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

  /* -------------------------
     【14-2】中のラッパー解除（高さ制限を外す）
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
    display: block !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* -------------------------
     【14-3】メニュー全体の並び（縦＋右寄せ）
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* -------------------------
     【14-4】各メニュー項目の箱
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item {
    width: 100% !important;
    margin: 0 !important;
    text-align: right !important;
  }

/* -------------------------
   【14-5】文字サイズ＆見た目
   ------------------------- */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content {
  display: block !important;
  width: 100% !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
  text-align: right !important;
  color: #111111 !important;
  padding-right: 28px !important;
  box-sizing: border-box !important;
}
	
  /* -------------------------
     【14-6】閉じるボタン
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close {
    color: #111111 !important;
  }
}


/* =========================
   【15】ハンバーガー位置（微調整）
   ========================= */
@media (max-width: 767px) {

  header .wp-block-navigation__responsive-container-open {
    margin-right: -50px !important;  /* ←ここ変更 */
    padding-right: 0 !important;
    transform: translateY(0) !important;
  }
}

/* =========================
   【16】スマホメニュー閉じ込め解除
   ========================= */
@media (max-width: 781px) {

  /* -------------------------
     【16-1】ヘッダー本体のはみ出しを許可
     ------------------------- */
  header {
    overflow: visible !important;
  }

  /* -------------------------
     【16-2】ヘッダー内グループのはみ出しを許可
     ------------------------- */
  header .wp-block-group,
  header .wp-block-row,
  header .wp-block-navigation {
    overflow: visible !important;
    position: static !important;
  }

  /* -------------------------
     【16-3】開いたメニューをヘッダーの外へ固定
     ------------------------- */
  header .wp-block-navigation__responsive-container.is-menu-open {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: none !important;
  }

  /* -------------------------
     【16-4】中身の高さ制限を完全解除
     ------------------------- */
  header .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
    height: auto !important;
    min-height: 100% !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* -------------------------
     【16-5】iPhone系の表示崩れ予防
     ------------------------- */
  html,
  body {
    height: auto !important;
    overflow-x: hidden !important;
  }
}

/* =========================
   【17】HOMEの枠を完全に消す
   ========================= */
@media (max-width: 781px) {

  /* -------------------------
     【17-1】リンク自体の枠・背景を消す
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:link,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:visited,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:hover,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:focus,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:active {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
  }

  /* -------------------------
     【17-2】今いるページの枠・背景を消す
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .current-menu-item > a,
  .wp-block-navigation__responsive-container.is-menu-open
  .current_page_item > a,
  .wp-block-navigation__responsive-container.is-menu-open
  .current-page-ancestor > a {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
  }

  /* -------------------------
     【17-3】項目の箱側に入る線も消す
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.is-menu-open
  li {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }
}

/* =========================
   【18】メニュー位置を下にずらす
   ========================= */
@media (max-width: 781px) {

  /* -------------------------
     【18-1】メニュー全体を下げる
     ------------------------- */
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
    margin-top: 60px !important;
  }

}

/* =========================
   【21】NEWSセクション整え
   ========================= */

/* -------------------------
   【21-1】NEWS全体
   ------------------------- */
.news {
  padding: 100px 40px !important;
  background: #f3f3f1 !important;
}

/* -------------------------
   【21-2】NEWS見出し
   ------------------------- */
.news h2 {
  font-size: 56px !important;
  font-weight: 300 !important;
  letter-spacing: 0.08em !important;
  text-align: center !important;
  margin-bottom: 20px !important;
  color: #2f241f !important;
}

/* -------------------------
   【21-3】NEWS説明文
   ------------------------- */
.news h5,
.news p {
  text-align: center !important;
  color: #4a3a33 !important;
  letter-spacing: 0.08em !important;
}

/* -------------------------
   【21-4】カード全体の並び
   ------------------------- */
.news .wp-block-columns {
  gap: 32px !important;
  margin-top: 60px !important;
}

/* -------------------------
   【21-5】1枚ずつカード化
   ------------------------- */
.news .wp-block-column {
  background: rgba(255,255,255,0.72) !important;
  padding: 28px 24px 30px !important;
  border-radius: 0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05) !important;
  backdrop-filter: blur(4px) !important;
  min-height: 320px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

/* -------------------------
   【21-6】日付
   ------------------------- */
.news .wp-block-column > p:first-of-type {
  font-size: 14px !important;
  color: #6d625c !important;
  margin-bottom: 12px !important;
  letter-spacing: 0.08em !important;
}

/* -------------------------
   【21-7】タイトル
   ------------------------- */
.news .wp-block-column h6,
.news .wp-block-column h5,
.news .wp-block-column h4,
.news .wp-block-column h3 {
  font-size: 24px !important;
  line-height: 1.5 !important;
  color: #2f241f !important;
  margin-bottom: 18px !important;
}

/* -------------------------
   【21-8】本文
   ------------------------- */
.news .wp-block-column p {
  text-align: left !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  color: #4c433e !important;
}

/* -------------------------
   【21-9】続きを読むボタン
   ------------------------- */
.news .wp-block-button {
  margin-top: auto !important;
}

.news .wp-block-button__link {
  background: #6a5a4f !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
}

/* -------------------------
   【21-10】スマホ調整
   ------------------------- */
@media (max-width: 767px) {
  .news {
    padding: 70px 20px !important;
  }

  .news h2 {
    font-size: 38px !important;
  }

  .news .wp-block-columns {
    gap: 20px !important;
    margin-top: 36px !important;
  }

  .news .wp-block-column {
    min-height: auto !important;
    padding: 22px 18px 24px !important;
  }
}

/* 【14-8】ポップアップ文字サイズ */
.spu-content {
  font-size: 16px !important;
  line-height: 1.8 !important;
}

/* タイトル */
.spu-content h2,
.spu-content h3 {
  font-size: 22px !important;
  margin-bottom: 20px !important;
}

/* スマホ用 */
@media (max-width: 767px) {
  .spu-content {
    font-size: 14px !important;
  }

  .spu-content h2,
  .spu-content h3 {
    font-size: 18px !important;
  }
}



/* =========================
   【24】NEWSカード左寄せ＋順番用調整
   ========================= */

/* -------------------------
   【24-1】3つのカードの間に隙間
   ------------------------- */
.news .wp-block-columns {
  gap: 28px !important;
  align-items: stretch !important;
}

/* -------------------------
   【24-2】各カードを四角で整える
   ------------------------- */
.news .wp-block-columns > .wp-block-column {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
  border: 1px solid rgba(60, 45, 38, 0.18) !important;
  padding: 24px 24px 28px !important;
  min-height: 360px !important;
  box-sizing: border-box !important;
  background: rgba(255,255,255,0.72) !important;
}

/* -------------------------
   【24-3】日付
   ------------------------- */
.news .wp-block-columns > .wp-block-column > p:first-child {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #6d625c !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 10px !important;
  text-align: left !important;
  width: 100% !important;
}

/* -------------------------
   【24-4】タイトル
   ------------------------- */
.news .wp-block-columns > .wp-block-column h3,
.news .wp-block-columns > .wp-block-column h4,
.news .wp-block-columns > .wp-block-column h5,
.news .wp-block-columns > .wp-block-column h6,
.news .wp-block-columns > .wp-block-column > p:nth-child(2) {
  font-size: 24px !important;
  line-height: 1.5 !important;
  color: #2f241f !important;
  margin-bottom: 18px !important;
  text-align: left !important;
  width: 100% !important;
}

/* -------------------------
   【24-5】画像
   ------------------------- */
.news .wp-block-columns > .wp-block-column img {
  display: block !important;
  width: 100% !important;
  height: 190px !important;
  object-fit: cover !important;
  margin-bottom: 20px !important;
}

/* -------------------------
   【24-6】ボタン
   ------------------------- */
.news .wp-block-columns > .wp-block-column .wp-block-button {
  margin-top: auto !important;
  width: 100% !important;
}

.news .wp-block-columns > .wp-block-column .wp-block-button__link {
  display: inline-block !important;
  background: #6a5a4f !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
}

/* -------------------------
   【24-7】スマホ調整
   ------------------------- */
@media (max-width: 767px) {
  .news .wp-block-columns {
    gap: 18px !important;
  }

  .news .wp-block-columns > .wp-block-column {
    min-height: auto !important;
    padding: 18px 18px 22px !important;
  }

  .news .wp-block-columns > .wp-block-column img {
    height: 160px !important;
  }
}

/* =========================
   【25】NEWSカード最終調整
   ========================= */

/* -------------------------
   【25-1】3枚の並び
   ------------------------- */
.news > .wp-block-columns {
  display: flex !important;
  gap: 32px !important;
  align-items: stretch !important;
}

/* -------------------------
   【25-2】各カード
   ------------------------- */
.news > .wp-block-columns > .wp-block-column {
  width: calc((100% - 64px) / 3) !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
  border: 1px solid rgba(60, 45, 38, 0.18) !important;
  background: rgba(255,255,255,0.72) !important;
  padding: 24px 24px 28px !important;
  box-sizing: border-box !important;
  min-height: 360px !important;
}

/* -------------------------
   【25-3】日付
   ------------------------- */
.news > .wp-block-columns > .wp-block-column > p:first-child {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #6d625c !important;
  letter-spacing: 0.06em !important;
  margin: 0 0 10px 0 !important;
  text-align: left !important;
  width: 100% !important;
}

/* -------------------------
   【25-4】タイトル
   ------------------------- */
.news > .wp-block-columns > .wp-block-column > p:nth-child(2),
.news > .wp-block-columns > .wp-block-column h3,
.news > .wp-block-columns > .wp-block-column h4,
.news > .wp-block-columns > .wp-block-column h5,
.news > .wp-block-columns > .wp-block-column h6 {
  font-size: 24px !important;
  line-height: 1.5 !important;
  color: #2f241f !important;
  margin: 0 0 18px 0 !important;
  text-align: left !important;
  width: 100% !important;
}

/* -------------------------
   【25-5】画像
   ------------------------- */
.news > .wp-block-columns > .wp-block-column img {
  display: block !important;
  width: 100% !important;
  height: 190px !important;
  object-fit: cover !important;
  margin: 0 0 20px 0 !important;
}

/* -------------------------
   【25-6】ボタン
   ------------------------- */
.news > .wp-block-columns > .wp-block-column .wp-block-button {
  margin-top: auto !important;
  width: 100% !important;
}

.news > .wp-block-columns > .wp-block-column .wp-block-button__link {
  display: inline-block !important;
  background: #6a5a4f !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
}

/* -------------------------
   【25-7】スマホ
   ------------------------- */
@media (max-width: 767px) {
  .news > .wp-block-columns {
    gap: 18px !important;
    flex-direction: column !important;
  }

  .news > .wp-block-columns > .wp-block-column {
    width: 100% !important;
    min-height: auto !important;
    padding: 18px 18px 22px !important;
  }

  .news > .wp-block-columns > .wp-block-column img {
    height: 160px !important;
  }
}

/* =========================
   【26】CONCEPT2 9つの文章をボックス化
   ========================= */

/* -------------------------
   【26-1】9つのボックス共通
   ------------------------- */
.concept-box {
  border: 1px solid #ddd !important;
  padding: 24px !important;
  background: #ffffff !important;
  height: 100% !important;
  box-sizing: border-box !important;
  transition: all 0.3s ease !important;
}

/* -------------------------
   【26-2】ホバーで少し浮かせる
   ------------------------- */
.concept-box:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08) !important;
}

/* -------------------------
   【26-3】タイトル行
   ------------------------- */
.concept-box p:first-child {
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  line-height: 1.7 !important;
  color: #222222 !important;
}

/* -------------------------
   【26-4】本文行
   ------------------------- */
.concept-box p:last-child {
  font-size: 13px !important;
  line-height: 1.8 !important;
  color: #555555 !important;
  margin: 0 !important;
}

/* -------------------------
   【26-5】3列の間隔を少し広げる
   ------------------------- */
#concept2 .wp-block-columns {
  gap: 30px !important;
}

/* -------------------------
   【26-6】スマホ
   ------------------------- */
@media (max-width: 767px) {
  .concept-box {
    padding: 18px !important;
  }

  .concept-box p:first-child {
    font-size: 16px !important;
  }

  .concept-box p:last-child {
    font-size: 13px !important;
    line-height: 1.75 !important;
  }

  #concept2 .wp-block-columns {
    gap: 18px !important;
  }
}

/* =========================
   【27】CONCEPT2 上質な雰囲気づくり
   ========================= */

/* -------------------------
   【27-1】全体を少し柔らかく
   ------------------------- */
#concept2 {
  background: #f7f7f5 !important;
  padding: 80px 0 !important;
}

/* -------------------------
   【27-2】ボックスを少しだけ上質に
   ------------------------- */
.concept-box {
  border: 1px solid rgba(0,0,0,0.08) !important;
  background: rgba(255,255,255,0.9) !important;
  backdrop-filter: blur(2px);
}

/* -------------------------
   【27-3】番号タイトルを美しく
   ------------------------- */
.concept-box p:first-child {
  font-size: 14px !important;
  letter-spacing: 0.05em !important;
}

/* -------------------------
   【27-4】本文を少し余白多めに
   ------------------------- */
.concept-box p:last-child {
  margin-top: 12px !important;
}

/* -------------------------
   【27-5】ホバーをもう少し静かに
   ------------------------- */
.concept-box:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06) !important;
}

/* -------------------------
   【27-6】全体の文字を少しだけ細く
   ------------------------- */
#concept2 {
  font-weight: 400 !important;
  letter-spacing: 0.02em;
}

/* =========================
   【28】スマホの余白調整（CONCEPT2）
   ========================= */

/* -------------------------
   【28-1】カラム間の縦余白
   ------------------------- */
@media (max-width: 767px) {
  #concept2 .wp-block-column {
    margin-bottom: 20px !important;
  }
}

/* -------------------------
   【28-2】ボックス同士の余白
   ------------------------- */
@media (max-width: 767px) {
  .concept-box {
    margin-bottom: 20px !important;
  }
}

/* -------------------------
   【28-3】最後の余白消す（美しく）
   ------------------------- */
@media (max-width: 767px) {
  .concept-box:last-child {
    margin-bottom: 0 !important;
  }
}

/* =========================
   【29】CONCEPT2 スマホ余白の最終調整
   ========================= */

/* -------------------------
   【29-1】スマホの各ボックス間
   ------------------------- */
@media (max-width: 767px) {
  .concept-box {
    margin-bottom: 14px !important;
    padding: 18px 18px 16px !important;
  }
}

/* -------------------------
   【29-2】スマホのタイトル余白
   ------------------------- */
@media (max-width: 767px) {
  .concept-box p:first-child {
    margin: 0 0 8px 0 !important;
    line-height: 1.6 !important;
  }
}

/* -------------------------
   【29-3】スマホの本文余白
   ------------------------- */
@media (max-width: 767px) {
  .concept-box p:last-child {
    margin: 0 !important;
    line-height: 1.75 !important;
  }
}

/* -------------------------
   【29-4】スマホで段落の余白を完全にリセット
   ------------------------- */
@media (max-width: 767px) {
  .concept-box p {
    margin-top: 0 !important;
  }
}

/* -------------------------
   【29-5】スマホで列の余白を消す
   ------------------------- */
@media (max-width: 767px) {
  #concept2 .wp-block-column {
    margin-bottom: 0 !important;
  }
}

/* -------------------------
   【29-6】スマホで最後のボックスだけ余白なし
   ------------------------- */
@media (max-width: 767px) {
  .concept-box:last-child {
    margin-bottom: 0 !important;
  }
}

/* =========================
   【33】スマホのトップロゴ画像だけ小さくする
   ========================= */
@media (max-width: 767px) {

  /* -------------------------
     【33-1】トップ画像内のロゴ画像
     ------------------------- */
  .wp-block-cover:first-of-type .wp-block-image img {
    width: 200px !important;
    height: auto !important;
  }

}

/* =========================
   【36】CONCEPT1 キャッチコピー（スマホ）
   ========================= */
@media (max-width: 767px) {

  /* -------------------------
     【36-1】CONCEPT1内の見出し
     ------------------------- */
  .wp-block-cover h2 {
    font-size: 16px !important;   /* ←まずはこれ */
    line-height: 1.4 !important;
    letter-spacing: 0.05em !important;
  }

}

/* =========================
   【37】トップ画像の固定表示を端末ごとに安定化
   ========================= */

/* -------------------------
   【37-1】PCでは背景固定
   ------------------------- */
@media (min-width: 1025px) {
  .wp-block-cover {
    background-attachment: fixed !important;
  }
}

/* -------------------------
   【37-2】iPad・スマホでは固定を外して表示を安定化
   ------------------------- */
@media (max-width: 1024px) {
  .wp-block-cover {
    background-attachment: scroll !important;
    background-position: center center !important;
    background-size: cover !important;
  }
}

/* -------------------------
   【45】フッター上品カード
   ------------------------- */
footer .wp-block-columns > .wp-block-column {
  border: 1px solid rgba(255,255,255,0.4);
  padding: 40px 30px;
  margin: 20px;
  background: rgba(255,255,255,0.05);
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

/* =========================
   【46】フッター右側の整理
   ========================= */

/* -------------------------
   【46-1】右側カードの中の3列を整列
   ------------------------- */
footer .wp-block-columns .wp-block-columns {
  gap: 48px !important;
  align-items: flex-start !important;
}

/* -------------------------
   【46-2】Privacy列をまるごと消す
   （真ん中の列）
   ------------------------- */
footer .wp-block-columns .wp-block-columns > .wp-block-column:nth-child(2) {
  display: none !important;
}

/* -------------------------
   【46-3】About と Social の2列幅を整える
   ------------------------- */
footer .wp-block-columns .wp-block-columns > .wp-block-column:nth-child(1),
footer .wp-block-columns .wp-block-columns > .wp-block-column:nth-child(3) {
  flex: 1 1 0 !important;
  max-width: none !important;
}

/* -------------------------
   【46-4】見出しの余白
   ------------------------- */
footer h2 {
  margin-bottom: 18px !important;
}

/* -------------------------
   【46-5】リンク行の余白
   ------------------------- */
footer .wp-block-navigation-item,
footer .wp-block-pages-list__item,
footer li {
  margin-bottom: 10px !important;
}

/* -------------------------
   【46-6】右側カードの文字を少し整える
   ------------------------- */
footer a {
  text-decoration: none !important;
  letter-spacing: 0.03em !important;
}

/* =========================
   【48】フッターInstagram調整
   ========================= */

/* -------------------------
   【48-1】Instagram全体を少し静かに
   ------------------------- */
.footer-instagram {
  opacity: 0.9 !important;
  transition: opacity 0.3s ease !important;
}

/* -------------------------
   【48-2】ホバーで少しだけはっきり
   ------------------------- */
.footer-instagram:hover {
  opacity: 1 !important;
}

/* -------------------------
   【48-3】画像の主張を少し抑える
   ------------------------- */
.footer-instagram img {
  filter: saturate(0.92) brightness(0.98) !important;
  transition: all 0.3s ease !important;
}

/* -------------------------
   【48-4】ホバー時だけ少し戻す
   ------------------------- */
.footer-instagram:hover img {
  filter: saturate(1) brightness(1) !important;
}

/* =========================
   【50】InstagramをPC・スマホともに3列固定
   ========================= */

/* -------------------------
   【50-1】Instagram一覧を3列グリッド化
   ------------------------- */
.footer-instagram ul,
.footer-instagram .wp-block-latest-instagram-posts__list,
.footer-instagram .instagram-pics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* -------------------------
   【50-2】各アイテムの余白を消す
   ------------------------- */
.footer-instagram li,
.footer-instagram .wp-block-latest-instagram-posts__item,
.footer-instagram .instagram-pic {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* -------------------------
   【50-3】画像を正方形でそろえる
   ------------------------- */
.footer-instagram img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  height: auto !important;
}

/* -------------------------
   【50-4】ブロック全体の幅を整える
   ------------------------- */
.footer-instagram {
  width: 100% !important;
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* -------------------------
   【50-5】スマホでも同じ3列を維持
   ------------------------- */
@media (max-width: 767px) {
  .footer-instagram ul,
  .footer-instagram .wp-block-latest-instagram-posts__list,
  .footer-instagram .instagram-pics {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
  }

  .footer-instagram {
    max-width: 320px !important;
  }
}

/* =========================
   【51】フッターInstagram見た目調整
   ========================= */

/* -------------------------
   【51-1】Instagramカード全体
   ------------------------- */
.footer-instagram {
  padding: 8px 0 0 0 !important;
}

/* -------------------------
   【51-2】見出し
   ------------------------- */
.footer-instagram h2,
.footer-instagram h3,
.footer-instagram p:first-child {
  font-size: 14px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #444 !important;
  margin: 0 0 18px 0 !important;
}

/* -------------------------
   【51-3】Instagram一覧の位置
   ------------------------- */
.footer-instagram ul,
.footer-instagram .wp-block-latest-instagram-posts__list {
  margin-top: 8px !important;
}

/* -------------------------
   【51-4】画像の空気感
   ------------------------- */
.footer-instagram img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  transition: opacity 0.3s ease !important, transform 0.3s ease !important;
}

/* -------------------------
   【51-5】ホバー
   ------------------------- */
.footer-instagram a:hover img {
  opacity: 0.88 !important;
  transform: scale(1.01) !important;
}

/* -------------------------
   【51-6】右カードの中の余白を整える
   ------------------------- */
.footer-instagram {
  max-width: 340px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* =========================
   【52】フッターInstagramの空白を減らして自動調整
   ========================= */

/* -------------------------
   【52-1】右カード全体を中身サイズ寄りに
   ------------------------- */
.footer-instagram {
  width: 100% !important;
  max-width: 360px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* -------------------------
   【52-2】見出しまわりの余白を詰める
   ------------------------- */
.footer-instagram h2,
.footer-instagram h3,
.footer-instagram p:first-child {
  margin: 0 0 6px 0 !important;
}

.footer-instagram p {
  margin: 0 0 10px 0 !important;
}

/* -------------------------
   【52-3】Instagram一覧の余白を減らす
   ------------------------- */
.footer-instagram ul,
.footer-instagram .wp-block-latest-instagram-posts__list,
.footer-instagram .instagram-pics {
  margin: 0 !important;
  padding: 0 !important;
}

/* -------------------------
   【52-4】画像グリッドをぴったり3列
   ------------------------- */
.footer-instagram ul,
.footer-instagram .wp-block-latest-instagram-posts__list,
.footer-instagram .instagram-pics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4px !important;
}

/* -------------------------
   【52-5】画像を正方形で揃える
   ------------------------- */
.footer-instagram li,
.footer-instagram .wp-block-latest-instagram-posts__item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.footer-instagram img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  height: auto !important;
}

/* -------------------------
   【52-6】PCでは少しだけ大きめ
   ------------------------- */
@media (min-width: 1025px) {
  .footer-instagram {
    max-width: 380px !important;
  }
}

/* -------------------------
   【52-7】タブレット
   ------------------------- */
@media (max-width: 1024px) {
  .footer-instagram {
    max-width: 320px !important;
  }
}

/* -------------------------
   【52-8】スマホ
   ------------------------- */
@media (max-width: 767px) {
  .footer-instagram {
    max-width: 280px !important;
  }

  .footer-instagram ul,
  .footer-instagram .wp-block-latest-instagram-posts__list,
  .footer-instagram .instagram-pics {
    gap: 3px !important;
  }
}

/* -------------------------
   【52-9】右カードの内側余白を少し減らす
   ------------------------- */
.footer-links-box {
  padding: 28px 24px !important;
}

/* =========================
   【53】フッターInstagramを左上基準に整える
   ========================= */

/* -------------------------
   【53-1】右カードの内側余白を少し詰める
   ------------------------- */
.footer-links-box {
  padding: 24px 24px 20px !important;
}

/* -------------------------
   【53-2】Instagramブロックを中央寄せしない
   ------------------------- */
.footer-instagram {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* -------------------------
   【53-3】見出しまわりを左上に揃える
   ------------------------- */
.footer-instagram h2,
.footer-instagram h3,
.footer-instagram p:first-child,
.footer-instagram p {
  text-align: left !important;
  margin-left: 0 !important;
}

/* -------------------------
   【53-4】Instagram一覧を左上から配置
   ------------------------- */
.footer-instagram ul,
.footer-instagram .wp-block-latest-instagram-posts__list,
.footer-instagram .instagram-pics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4px !important;
  width: 100% !important;
  max-width: 320px !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
}

/* -------------------------
   【53-5】画像を正方形で揃える
   ------------------------- */
.footer-instagram li,
.footer-instagram .wp-block-latest-instagram-posts__item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.footer-instagram img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  height: auto !important;
}

/* -------------------------
   【53-6】PCで少しだけ大きく
   ------------------------- */
@media (min-width: 1025px) {
  .footer-instagram ul,
  .footer-instagram .wp-block-latest-instagram-posts__list,
  .footer-instagram .instagram-pics {
    max-width: 340px !important;
  }
}

/* -------------------------
   【53-7】スマホ
   ------------------------- */
@media (max-width: 767px) {
  .footer-links-box {
    padding: 18px 18px 16px !important;
  }

  .footer-instagram ul,
  .footer-instagram .wp-block-latest-instagram-posts__list,
  .footer-instagram .instagram-pics {
    max-width: 100% !important;
    gap: 3px !important;
  }
}

/* =========================
   【60】CONCEPT2 読みやすさ改善
   ========================= */

/* -------------------------
   【60-1】タイトルを強調
   ------------------------- */
.concept-box p:first-child {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
  margin-bottom: 12px !important;
  letter-spacing: 0.06em !important;
}

/* -------------------------
   【60-2】本文を少し軽く
   ------------------------- */
.concept-box p:last-child {
  font-size: 13px !important;
  line-height: 1.9 !important;
  color: #666666 !important;
}

/* -------------------------
   【60-3】ボックス余白を少し広げる
   ------------------------- */
.concept-box {
  padding: 28px !important;
}