/* =========================================================
   Global Study 第1列ナビ（台湾セクション用オーバーレイ）
   既存：header(216px) + main(padding-left:216px)
   →    第1列 gs(216px) + 第2列 header(216px) + 第3列 main
   ========================================================= */

/* --- 台湾ヘッダー内の lang-switch（PCでは隠す） --- */
header .lang-switch-mobile {
  display: none;
}

/* --- パンくず非表示 (サイドバーで遷移できるので不要) --- */
.breadCrumb {
  display: none !important;
}

/* --- 台湾ヘッダーのロゴ背景に薄く国旗 --- */
header .navbar-module--logo--34db0 {
  background-image:
    linear-gradient(rgba(255,255,255,0.92), rgba(255,255,255,0.92)),
    url('https://flagcdn.com/w320/tw.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* --- 第1列：グローバルナビ --- */
.gs-global-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 184px;
  height: 100%;
  overflow-y: auto;
  z-index: 999;
  background: #fff;
  border-right: 1px solid #e0e0e0;
}
.gs-global-sidebar .gs-logo {
  padding: 32px 20px 20px;
  text-align: center;
}
.gs-global-sidebar .gs-logo a {
  display: block;
  font-weight: 700;
  color: #1a1a1a;
  text-decoration: none;
  line-height: 1.2;
  letter-spacing: -0.03em;
  font-size: 18px;
}
.gs-global-sidebar .gs-logo a span {
  display: block;
  font-weight: 500;
  color: #888;
  font-size: 11px;
  letter-spacing: 0.04em;
  margin-top: 4px;
}
.gs-global-sidebar .gs-contact {
  margin: 0 16px 8px;
}
.gs-global-sidebar .gs-contact a {
  display: block;
  text-align: center;
  background: #1a61c7;
  color: #fff;
  border-radius: 6px;
  padding: 11px 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
}
.gs-global-sidebar ul {
  list-style: none;
  margin: 0;
  padding: 0 20px;
}
.gs-global-sidebar .gs-cat {
  display: block;
  font-weight: 600;
  color: #1a61c7;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 12px;
  padding: 16px 0 6px;
}
.gs-global-sidebar li {
  padding: 4px 0;
}
.gs-global-sidebar li a {
  color: #555;
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
}
.gs-global-sidebar li a:hover {
  color: #1a1a1a;
}
/* 国旗アイコン付きリンク */
.gs-global-sidebar li a:has(.gs-flag) {
  display: flex;
  align-items: center;
  gap: 8px;
}
.gs-global-sidebar .gs-flag {
  width: 20px;
  height: auto;
  border-radius: 2px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.06);
}

/* --- 第2列：台湾ナビ（既存header）を右にずらす＋幅を縮める --- */
header {
  left: 184px !important;
  width: 184px !important;
}
.navbar-module--navBar--a0341 {
  width: 184px !important;
}

/* --- PC時（gs-global-sidebar表示時）: header内の無料相談ボタンを非表示
   gs-global-sidebar側に既にあるため重複防止
   ＋上部余白も詰める --- */
@media (min-width: 1281px) {
  header .navbar-module--linkContact--2b826 {
    display: none !important;
  }
  /* ナビ全体の上部余白を詰める */
  header .navbar-module--globalNav--36b29 {
    padding-top: 16px !important;
  }
  header .navbar-module--globalNav--36b29 > ul {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  header .navbar-module--globalNav--36b29 > ul > li:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  /* Global共通ページ（greeting/about/family等）の main 左マージン強制統一
     旧2列構造の216pxを上書き（specificity を上げてインライン<style>に勝つ） */
  body main,
  html body main {
    margin-left: 368px !important;
    margin-right: 0 !important;
    max-width: calc(100vw - 368px) !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* --- 第3列：本文をさらに右に（184 + 184 = 368px） --- */
main {
  padding-left: 368px !important;
}

/* --- フッターも2列分の余白をあける（潜り込み防止） --- */
footer {
  padding-left: 368px !important;
}

/* --- SP共通：tw-card-grid のカラムが多すぎる場合に強制1カラム化 --- */
@media (max-width: 768px) {
  .tw-card-grid {
    grid-template-columns: 1fr !important;
  }
  .tw-card {
    padding: 16px 18px !important;
  }

  /* SP用ハンバーガーメニューを上品に：青大型ボタン → 控えめな線アイコン */
  .navbar-module--navControl--62da4 {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 8px !important;
    width: 44px !important;
    height: 44px !important;
    position: absolute !important;
    right: 10px !important;
    top: 8px !important;
    transform: none !important;
    padding: 0 !important;
    z-index: 1000 !important;
  }
  .navbar-module--toggle--69c82 {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 8px !important;
  }
  .navbar-module--toggle--69c82:hover,
  .navbar-module--toggle--69c82:active {
    background: rgba(0, 0, 0, 0.04) !important;
  }
  .navbar-module--toggle--69c82 svg {
    stroke: #1a1a1a !important;
    width: 22px !important;
    height: 16px !important;
  }
  .navbar-module--toggle--69c82 svg line {
    stroke: #1a1a1a !important;
    stroke-width: 2 !important;
  }
}

/* SP/タブレット（1280px以下）：gs-global-sidebar は完全非表示 */
@media (max-width: 1280px) {
  .gs-global-sidebar {
    display: none !important;
  }

  /* ハンバーガーメニュー最上部に「← Global Study」リンクを表示 */
  .navbar-module--globalNav--36b29 .sp-global-back {
    display: block !important;
    padding: 14px 20px !important;
    background: #f6f7f9 !important;
    color: #1a61c7 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }
  .navbar-module--globalNav--36b29 .sp-global-back::before {
    content: "← ";
    font-weight: 700;
  }
}

/* PC（1281px+）では HTML 内の sp-global-back を非表示 */
@media (min-width: 1281px) {
  .sp-global-back {
    display: none !important;
  }
}

@media (max-width: 1280px) {
  header { left: 0 !important; }
  main { padding-left: 0 !important; }
  footer { padding-left: 0 !important; }

  /* gs-global-sidebar が隠れる帯域では、台湾ヘッダー内の lang-switch を表示 */
  header .lang-switch-mobile {
    display: flex !important;
  }

  /* SPメニューを右から滑らかにスライドイン（グローバルと統一） */
  .navbar-module--navBar--a0341 {
    left: auto !important;
    right: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(100%);
    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }
  .navbar-module--navBar--a0341.navbar-module--open--88684 {
    transform: translateX(0) !important;
  }
}
