/*

Theme Name: BLOG
Author: KEI
Description: Blog theme
Version: 1.0

*/
@charset "UTF-8"; /* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Montserrat');

body, html {
    background-color: #fff;
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    font-family: 
        Lato,
        "Montserrat",
        "Noto Sans JP",
        "Yu Gothic Medium",
        "YuGothic",
        "Hiragino Sans",
        "Hiragino Kaku Gothic ProN",
        "Meiryo",
        "MS PGothic",
        sans-serif;
}

/* =========================================
   OGT Header (match your reference)
   - No outer background
   - No extra icon next to JP flag
   - Search UI matches screenshot
========================================= */

*{ box-sizing:border-box; }
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }
button,input{ font:inherit; }

body{
  margin:0;
  background:#fff; /* ←背景は白 */
  color:#111;
}

/* whole header width like NYT */
.ogtHeader{
  background:#fff;
}

.ogtHeader__inner{
  max-width: 1380px;
  margin: 0 auto;
  padding: 0 18px;
}

/* ===== Top strip ===== */
.ogtTopStrip{
  display:grid;
  grid-template-columns: auto auto 1fr auto;
  align-items:start;
  gap: 16px;
  padding: 10px 0 8px;
  border-bottom: 1px solid #e8e8e8; /* スクショの薄い線 */
}

/* Search */
.ogtSearch{
  display:flex;
  align-items:center;
  gap: 8px;
}

.ogtSearch__icon{
  width: 34px;
  height: 34px;
  border: 1px solid #cfcfcf;
  background:#fff;
  border-radius: 2px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.ogtSearch__svg{
  width:18px;
  height:18px;
  fill:#6c7a89; /* うっすい青グレー */
}

.ogtSearch__input{
  width: 260px;              /* スクショの長さ感 */
  height: 34px;
  border: 1px solid #cfcfcf;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 14px;
  outline:none;
}

.ogtSearch__go {
    height: 34px;
    padding: 0 14px;
    border: 0;
    border-radius: 2px;
    background: #8fa5bb;
    color: #ffffff;
    font-weight: bold;
    cursor: pointer;
    font-size: 10px;
}

/* Meta (date + paper) */
.ogtMeta{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.25;
  padding-top: 2px;
}

.ogtMeta__date{
  font-weight: 800;
}

.ogtMeta__paper{
  margin-top: 0px;
  font-weight: 800;
}

/* ticker centered-ish */
.ogtTicker{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top: 12px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.10em;
  color:#111;
  opacity: .75;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}

/* right tools */
.ogtRight{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding-top: 2px;
}

.ogtFlagJP{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 36px;
  height: 36px;
  border: 1px solid #dedede;
  border-radius: 2px;
  background:#fff;
}

/* ===== Logo ===== */
.ogtLogoRow{
  display:flex;
  justify-content:center;
  align-items:center;
  padding: 16px 0 10px;
}

.ogtLogoRow__img{
  height: 72px;     /* ←スクショの大きさに寄せ */
  width:auto;
  display:block;
}

/* ===== Nav ===== */
.ogtNav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 18px;
  padding: 10px 0 10px;
  border-top: 1px solid #ededed;
}

.ogtNav__item{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  color:#111;
  white-space:nowrap;
  padding: 2px 2px;
}

.ogtNav__chev{
  margin-left: 5px;
  font-size: 11px;
  opacity: .65;
}

/* ===== Double rule under nav ===== */
.ogtRules{
  padding: 0 0 8px;
}

.ogtRules__thin {
    height: 1px;
    background: #e1e3e1;
    opacity: .9;
}

.ogtRules__thick{
  margin-top: 3px;
  height: 2px;
  background:#5a4a40; /* 濃い茶系 */
  opacity:.9;
}

/* ===== responsive minimal ===== */
@media (max-width: 980px){
  .ogtTopStrip{
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 10px;
  }
  .ogtTicker{ display:none; } /* モバイルは消す（NYTっぽい） */
  .ogtSearch__input{ width: 180px; }
      .ogtLogoRow__img {
        height: auto;
        width: 100%;
    }
  .ogtNav{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    justify-content:flex-start;
  }
  .ogtNav::-webkit-scrollbar{ height:0; }
}

/* ===== Mega menu (works with <details>) ===== */

.ogtNav{
  position: relative;
}

.ogtNavMega{
  position: relative;
}

.ogtNavMega__tab{
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  color:#111;
  padding: 2px 2px;
}

.ogtNavMega__backdrop{
  display:none;
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.18);
  z-index: 90;
}
.ogtNavMega__backdrop.is-on{ display:block; }

.ogtNavMega__panel{
  display:none;
  position: fixed;
  left:0;
  right:0;
  top: 160px; /* ←ヘッダーの高さに合わせて後で微調整可 */
  background:#fff;
  z-index: 95;
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

.ogtNavMega[open] .ogtNavMega__panel{
  display:block;
}

.ogtNavMega__inner{
  max-width: 1380px;
  margin: 0 auto;
  padding: 16px 18px 20px;
}

.ogtNavMega__bar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-bottom: 10px;
  border-bottom: 1px solid #ededed;
  margin-bottom: 12px;
}

.ogtNavMega__title{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 900;
  font-size: 16px;
}

.ogtNavMega__close{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid #dedede;
  background:#fff;
  cursor:pointer;
  font-size: 18px;
  line-height: 1;
}

.ogtNavMega__cols{
  display:grid;
  grid-template-columns: 1.25fr 1fr 1fr 0.9fr;
  gap: 26px;
}

.ogtNavMega__label{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color:#666;
  font-weight: 800;
  margin-bottom: 8px;
}

.ogtNavMega__col a{
  display:block;
  padding: 7px 0;
  font-size: 15px;
  font-weight: 650;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

body.ogtMegaOpen{ overflow:hidden; }



/* =====================================================
   HOME LEAD AREA (Wrapper)
===================================================== */
.ogtHomeLead{
  background:#fff;
}

.ogtHomeLead__inner{
  max-width:1380px;
  margin:0 auto;
  padding:0 18px;
  display:grid;
  grid-template-columns: 1fr 360px; /* Left + Right (right will be built later) */
  gap:26px;
}

.ogtHomeLead__left,
.ogtHomeLead__right{
  min-width:0;
}

/* =====================================================
   LEFT TOP MODULE (NYT-like: 2 stories + image)
   - No extra top border here (manage separators outside if needed)
   - Image: no blank (cover)
   - Divider: thicker, between story1 and story2
===================================================== */
.ogtLeadA {
    display: grid;
    grid-template-columns: 1.05fr 1.55fr;
    gap: 24px;
    padding-top: 18px;
    border-top: 0;
    background: #fff;
    border-bottom: 1px solid #d0d0d0;
    margin-bottom: 30px;
    padding-bottom: 30px;
}

.ogtLeadA__texts{
  min-width:0;
}

/* 右の枠は比率で高さを決める（縦長防止） */
.ogtLeadA__media{
  border:1px solid #d9d9d9;
  overflow:hidden;
  background:#fff;

  aspect-ratio: 16 / 10;   /* ← NYTっぽい横長（好みで 4/3 でもOK） */
}

/* 画像は枠にフィットさせる */
.ogtLeadA__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}


/* =====================================================
   Stories (shared)
===================================================== */
.ogtLeadStory{
  display:block;
  text-decoration:none;
  color:#111;
}

.ogtLeadStory:hover .ogtLeadStory__title{
  text-decoration:underline;
}

/* Kicker */
.ogtLeadStory__kicker{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  color:#d12b1f;
  margin:0 0 10px;
}

/* Title */
.ogtLeadStory__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight:700;
  line-height:1.05;
  margin:0;
}

/* Primary / Secondary sizing */
.ogtLeadStory--primary .ogtLeadStory__title{
  font-size:21px;
}

.ogtLeadStory--secondary .ogtLeadStory__title{
  font-size:16px;
}

/* Dek */
.ogtLeadStory__dek {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 16px;
    line-height: 1.2;
    color: #444;
    margin: 14px 0 0;
}

/* Divider (between story 1 and story 2) */
.ogtLeadA__divider{
  height:1px;
  background:#d0d0d0;
  margin:18px 0 22px;
}

/* =====================================================
   Responsive
===================================================== */
@media (max-width:1060px){
  .ogtHomeLead__inner{
    grid-template-columns:1fr;
  }
  .ogtHomeLead__right{
    display:none;
  }
}

@media (max-width:980px){
  .ogtLeadA{
    grid-template-columns:1fr;
  }
  .ogtLeadA__img{
    aspect-ratio:16 / 9;
  }
  .ogtLeadStory--primary .ogtLeadStory__title{
    font-size:34px;
  }
  .ogtLeadStory--secondary .ogtLeadStory__title{
    font-size:28px;
  }
  .ogtLeadStory__dek{
    font-size:17px;
  }
}

/* =====================================================
   Lead Left: Block B (2 text + big image + tag rail)
===================================================== */

.ogtLeadB{
  background:#fff;
  padding-top: 18px;
}

.ogtLeadB__grid{
  display:grid;
  grid-template-columns: 1.05fr 1.55fr; /* ← Aと完全一致 */
  gap: 22px;
  align-items:start;
}

/* Left stack */
.ogtLeadB__stack{
  min-width:0;
}

.ogtLeadBCard{
  display:block;
  text-decoration:none;
  color:#111;
}

.ogtLeadBCard:hover .ogtLeadBCard__title{
  text-decoration:underline;
}

.ogtLeadBCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight:700;
  font-size: 22px;
  line-height: 1.15;
  margin: 0;
}

.ogtLeadBCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 14px;
  line-height: 1.45;
  color:#444;
  margin: 8px 0 0;
}

.ogtLeadBCard__meta{
  margin-top: 10px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color:#6b6b6b;
}

/* Divider between the two left stories */
.ogtLeadB__divider{
  height: 2px;
  background:#d0d0d0;
  margin: 16px 0 18px;
}

/* Right media */
.ogtLeadB__media{
  display:block;
  border: 2px solid #1b1b1b; /* 画像の外枠（スクショ寄せ） */
  overflow:hidden;
  background:#fff;
}

.ogtLeadB__img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio: 16 / 9; /* 横長固定（縦に伸びない） */
  object-fit: cover;
}

/* Bottom area */
.ogtLeadB__bottom{
  margin-top: 18px;
}

.ogtLeadB__rule{
  height: 3px;          /* 太めの線 */
  background:#5f5248;   /* NYTっぽい茶〜グレー */
  margin-bottom: 12px;
}

/* Tag rail (horizontal) */
.ogtLeadBTags{
  display:flex;
  gap: 18px;
  overflow-x:auto;
  padding: 0 2px 10px;
  margin: 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.ogtLeadBTags::-webkit-scrollbar{ display:none; }

.ogtLeadBTags__item{
  white-space: nowrap;
  text-decoration:none;
  color:#3b3b3b;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
}

.ogtLeadBTags__item:hover{
  text-decoration:underline;
}

.ogtLeadBTags__item--active{
  color:#111;
  font-weight: 800;
}

/* Responsive */
@media (max-width: 980px){
  .ogtLeadB__grid{
    grid-template-columns: 1fr;
  }
  .ogtLeadB__media{
    border-width: 1px;
  }
}

/* =====================================================
   Block C (List + Graphic) + (Watch & Read grid)
===================================================== */

.ogtBlockC{
  background:#fff;
  padding-top: 18px;
}

/* ----- Top row ----- */
.ogtBlockC__top{
  display:grid;
  grid-template-columns: 340px 1fr;  /* 左リスト / 右図版 */
  gap: 22px;
  align-items:start;
}

.ogtBlockCList{
  border-right: 2px solid #e6e6e6;  /* 左と右の境界線 */
  padding-right: 18px;
}

.ogtBlockCList__item{
  display:block;
  text-decoration:none;
  color:#111;
  padding: 0 0 10px;
}

.ogtBlockCList__item:hover .ogtBlockCList__title{
  text-decoration: underline;
}

.ogtBlockCList__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}

.ogtBlockCList__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 13px;
  line-height: 1.45;
  color:#444;
  margin: 8px 0 0;
}

.ogtBlockCList__meta{
  margin-top: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color:#6b6b6b;
}

.ogtBlockCList__rule{
  height: 2px;
  background:#d0d0d0;
  margin: 14px 0 14px;
}

/* Right graphic frame */
.ogtBlockCGraphic{
  display:block;
  border: 2px solid #e6e6e6;
  background:#fff;
  overflow:hidden;
}

.ogtBlockCGraphic__img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio: 16 / 9; /* 横長 */
  object-fit: cover;
}

/* Section separator */
.ogtBlockC__hr{
  height: 1px;
  background:#e6e6e6;
  margin: 20px 0 18px;
}

/* ----- Bottom: Watch & Read ----- */
.ogtBlockC__sectionTitle{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  font-weight: 700;
  color:#222;
  margin: 0 0 12px;
}

.ogtBlockCGrid{
  display:grid;
  grid-template-columns: 1fr 1fr; /* 2列 */
  gap: 18px 22px;
}

/* Card */
.ogtBlockCCard{
  border-top: 1px solid #e6e6e6; /* NYTっぽい薄い区切り */
  padding-top: 14px;
}

.ogtBlockCCard__link{
  display:grid;
  grid-template-columns: 1fr 160px; /* 左テキスト / 右画像 */
  gap: 14px;
  align-items:start;
  text-decoration:none;
  color:#111;
}

.ogtBlockCCard__link:hover .ogtBlockCCard__title{
  text-decoration: underline;
}

.ogtBlockCCard__kicker{
  grid-column: 1 / -1;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  color:#6b6b6b;
  margin-bottom: 6px;
}

.ogtBlockCCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.22;
  margin: 0;
}

.ogtBlockCCard__meta{
  margin-top: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color:#6b6b6b;
}

.ogtBlockCCard__media{
  border: 1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;
}

.ogtBlockCCard__img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* Responsive */
@media (max-width: 980px){
  .ogtBlockC__top{
    grid-template-columns: 1fr;
  }
  .ogtBlockCList{
    border-right: 0;
    padding-right: 0;
  }
  .ogtBlockCGrid{
    grid-template-columns: 1fr;
  }
  .ogtBlockCCard__link{
    grid-template-columns: 1fr 140px;
  }
}

/* =========================================
   GLOBAL RULE COLOR UNIFICATION
   line color -> #e6e6e6
========================================= */

/* Header */
.ogtTopStrip{
  border-bottom: 1px solid #e6e6e6;
}

.ogtNav{
  border-top: 1px solid #e6e6e6;
}

.ogtRules__thin,
.ogtRules__thick{
  background: #e6e6e6;
}

/* Lead A */
.ogtLeadA{
  border-bottom: 1px solid #e6e6e6;
}

.ogtLeadA__divider{
  background: #e6e6e6;
}

.ogtLeadA__media{
  border-color: #e6e6e6;
}

/* Lead B */
.ogtLeadB__divider{
  background: #e6e6e6;
}

.ogtLeadB__rule{
  background: #e6e6e6;
}

.ogtLeadB__media{
  border-color: #e6e6e6;
}

/* Block C */
.ogtBlockCList{
  border-right: 1px solid #e6e6e6;
}

.ogtBlockCList__rule{
  background: #e6e6e6;
}

.ogtBlockCGraphic{
  border-color: #e6e6e6;
}

.ogtBlockC__hr{
  background: #e6e6e6;
}

.ogtBlockCCard{
  border-top: 1px solid #e6e6e6;
}

.ogtBlockCCard__media{
  border-color: #e6e6e6;
}

/* =========================
   In Case You Missed It
   width fix (match upper blocks)
========================= */

.ogtMissed{
  background:#fff;
}

/* ★ 横幅を他ブロックと完全一致させる */
.ogtMissed__inner{
  max-width:1380px;
  margin:0 auto;
  padding: 0; /* ← ここが重要：左右paddingを消す */
}

/* タイトルだけ内側余白を持たせる */
.ogtMissed__label{
  padding: 0 18px;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 22px;
  font-weight: 700;
  color:#222;
  margin: 18px 0 14px;
}

/* グリッドはフル幅 */
.ogtMissed__grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 14px;
}

/* カード */
.ogtMissedCard{
  padding: 0 18px;
}

/* 縦区切り線 */
.ogtMissedCard--mid,
.ogtMissedCard--right{
  border-left: 1px solid #e6e6e6;
}

/* media */
.ogtMissedCard__media{
  border: 1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;
  aspect-ratio: 4 / 3;
}

.ogtMissedCard__img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

/* title */
.ogtMissedCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 700;
  margin: 10px 0 6px;
}

/* meta */
.ogtMissedCard__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  letter-spacing: .06em;
  font-weight: 700;
  color:#6b6b6b;
}

/* responsive */
@media (max-width: 980px){
  .ogtMissed__grid{
    grid-template-columns: 1fr;
  }

  .ogtMissedCard{
    padding: 14px 18px;
  }

  .ogtMissedCard--mid,
  .ogtMissedCard--right{
    border-left: 0;
    border-top: 1px solid #e6e6e6;
  }
}

/* =====================================================
   Right column: NYT-like feature block (1-photo version)
   - line color unified: #e6e6e6
===================================================== */

.ogtRightLead{
  background:#fff;
}

/* top thick rule (match your global line color) */
.ogtRightLead__topRule{
  height:2px;
  background:#e6e6e6; /* ←統一 */
  margin: 0 0 16px;
}

/* big feature */
.ogtRightLead__feature{
  display:block;
  color:#111;
  text-decoration:none;
}

.ogtRightLead__feature:hover .ogtRightLead__title{
  text-decoration:underline;
}

.ogtRightLead__figure{
  margin:0;
}

.ogtRightLead__img{
  display:block;
  width:100%;
  height:auto;
  /* “写真が積み重なってる風”はやらない。1枚でOK */
  border:1px solid #e6e6e6;
}

.ogtRightLead__credit{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size:11px;
  color:#6b6b6b;
  text-align:right;
  margin-top:6px;
}

/* title & dek */
.ogtRightLead__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 28px;
  line-height: 1.08;
  margin: 14px 0 10px;
  color:#111;
}

.ogtRightLead__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 15px;
  line-height: 1.5;
  color:#444;
  margin: 0;
}

/* middle thin rule */
.ogtRightLead__midRule{
  height:1px;
  background:#e6e6e6;
  margin: 16px 0 14px;
}

/* two-up cards */
.ogtRightLead__twoUp{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.ogtRightLeadCard{
  display:block;
  padding-right: 12px;
  color:#111;
  text-decoration:none;
}

.ogtRightLeadCard--right{
  padding-left: 12px;
  padding-right: 0;
  border-left:1px solid #e6e6e6; /* 真ん中の仕切り */
}

.ogtRightLeadCard:hover .ogtRightLeadCard__title{
  text-decoration:underline;
}

.ogtRightLeadCard__media{
  border:1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;
  aspect-ratio: 4 / 3;
}

.ogtRightLeadCard__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.ogtRightLeadCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight:700;
  font-size: 16px;
  line-height: 1.22;
  margin: 10px 0 6px;
}

.ogtRightLeadCard__kicker{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  color:#6b6b6b;
}

/* bottom thick-ish rule */
.ogtRightLead__bottomRule{
  height:2px;
  background:#e6e6e6;
  margin-top: 16px;
}

/* responsive */
@media (max-width: 980px){
  .ogtRightLead__twoUp{
    grid-template-columns: 1fr;
  }
  .ogtRightLeadCard{
    padding-right: 0;
    padding-left: 0;
  }
  .ogtRightLeadCard--right{
    border-left: 0;
    border-top: 1px solid #e6e6e6;
    padding-top: 14px;
    margin-top: 14px;
  }
}

/* =====================================================
   Right column: Most Shared list
   - left: title + min read
   - right: thumbnail
   - rules unified: #e6e6e6
===================================================== */

.ogtMostShared{
  background:#fff;
  margin-top: 18px;
}

.ogtMostShared__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 16px;
  margin: 0 0 10px;
  color:#111;
}

.ogtMostShared__list{
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid #e6e6e6;
}

.ogtMostShared__item{
  border-bottom: 1px solid #e6e6e6;
}

.ogtMostSharedCard{
  display:grid;
  grid-template-columns: 1fr 86px; /* 右サムネ幅 */
  gap: 14px;
  align-items:start;
  padding: 14px 0;
  text-decoration:none;
  color:#111;
}

.ogtMostSharedCard:hover .ogtMostSharedCard__headline{
  text-decoration: underline;
}

.ogtMostSharedCard__headline{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.15;
  margin: 0 0 6px;
}

.ogtMostSharedCard__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  color:#6b6b6b;
}

.ogtMostSharedCard__thumb{
  border: 1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;
  aspect-ratio: 1 / 1; /* スクショの正方形サムネ感 */
}

.ogtMostSharedCard__img{
  display:block;
  width:100%;
  height:100%;
  object-fit: cover;
}

/* tighter on small screens */
@media (max-width: 980px){
  .ogtMostSharedCard{
    grid-template-columns: 1fr 78px;
  }
  .ogtMostSharedCard__headline{
    font-size: 17px;
  }
}

/* =====================================================
   Wide Block A (switch to "single column" area)
   Layout: left list + center big image + right list
   Rules unified: #e6e6e6
===================================================== */

.ogtWideA{
  background:#fff;
}

.ogtWideA__inner{
  max-width:1380px;
  margin: 0 auto;
  padding: 0 18px;

  display:grid;
  grid-template-columns: 320px 1fr 320px;
  gap: 22px;
  align-items:start;

  /* 上下の余白は他ブロックに合わせて調整 */
  padding-top: 18px;
  padding-bottom: 8px;
}

/* columns */
.ogtWideA__col{
  min-width:0;
}

/* vertical divider (center/right split) */
.ogtWideA__col--right{
  border-left: 1px solid #e6e6e6;
  padding-left: 18px;
}

/* hero image */
.ogtWideA__hero{
  display:block;
  min-width:0;
}

.ogtWideA__heroImg{
  display:block;
  width:100%;
  height:360px;

  /* 縦に伸びないように“横長固定” */
  aspect-ratio: 16 / 9;
  object-fit: cover;

  border: 1px solid #e6e6e6;
  background:#fff;
}

/* item */
.ogtWideAItem{
  display:block;
  color:#111;
  text-decoration:none;
}

.ogtWideAItem:hover .ogtWideAItem__title{
  text-decoration: underline;
}

.ogtWideAItem__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.15;
  margin: 0;
}

.ogtWideAItem__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 13px;
  line-height: 1.5;
  color:#444;
  margin: 8px 0 0;
}

/* Right side is tighter (like screenshot) */
.ogtWideAItem--tight .ogtWideAItem__title{
  font-size: 16px;
  line-height: 1.2;
}
.ogtWideAItem--tight .ogtWideAItem__dek{
  display:none;
}

/* rules */
.ogtWideA__rule{
  height: 1px;
  background: #e6e6e6;
  margin: 14px 0;
}

/* responsive */
@media (max-width: 1100px){
  .ogtWideA__inner{
    grid-template-columns: 300px 1fr 300px;
  }
}

@media (max-width: 980px){
  /* mobile: stack */
  .ogtWideA__inner{
    grid-template-columns: 1fr;
  }
  .ogtWideA__col--right{
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid #e6e6e6;
    padding-top: 14px;
  }
  .ogtWideA__heroImg{
    aspect-ratio: 16 / 10;
  }
}

/* =========================================
   Section Rule (above NEWS)
========================================= */
.ogtSectionRule{
  border:0;
  height:1px;
  background:#e6e6e6;
  margin: 24px 0 18px;
}

/* =========================================
   NEWS Block
========================================= */
.ogtNews{
  background:#fff;
}

.ogtNews__inner{
  max-width:1380px;
  margin:0 auto;
  padding:0 18px;
}

.ogtNews__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 14px;
}

/* Row */
.ogtNewsRow{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 22px;
  margin-bottom: 26px;
}

/* Column */
.ogtNewsCol{
  min-width:0;
}

.ogtNewsCol__label{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 8px;
}

.ogtNewsCol__img{
  width:100%;
  display:block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border:1px solid #e6e6e6;
  margin-bottom: 8px;
}

/* List */
.ogtNewsCol__list{
  list-style:none;
  padding:0;
  margin:0;
}

.ogtNewsCol__list li{
  margin-bottom: 8px;
}

.ogtNewsCol__list a{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 14px;
  line-height: 1.35;
  color:#111;
  text-decoration:none;
}

.ogtNewsCol__list a:hover{
  text-decoration: underline;
}

/* =========================================
   Responsive
========================================= */
@media (max-width: 1100px){
  .ogtNewsRow{
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 780px){
  .ogtNewsRow{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px){
  .ogtNewsRow{
    grid-template-columns: 1fr;
  }
}

/* =========================================
   OGT FOOTER (NYT-like)
   Lines: #e6e6e6 unified
========================================= */

.ogtFooter{
  background:#fff;
  color:#111;
}

.ogtFooter__inner{
  max-width:1380px;
  margin:0 auto;
  padding: 0 18px 16px;
}

.ogtFooter__topRule{
  height:1px;
  background:#e6e6e6;
  margin: 24px 0 10px;
}

.ogtFooter__brandRow{
  padding: 6px 0 14px;
}

.ogtFooter__brandLink{
  text-decoration:none;
  color:#111;
}

.ogtFooter__brand{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: .01em;
}

/* Columns */
.ogtFooter__cols{
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 26px;
  padding: 8px 0 18px;
}

.ogtFooterCol{
  min-width:0;
}

.ogtFooterCol__title{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  margin: 0 0 10px;
  color:#111;
}

.ogtFooterCol__list{
  list-style:none;
  padding:0;
  margin:0;
}

.ogtFooterCol__list li{
  margin: 0 0 7px;
}

.ogtFooterCol__list a{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.35;
  color:#111;
  text-decoration:none;
}

.ogtFooterCol__list a:hover{
  text-decoration: underline;
}

/* Right Account column look */
.ogtFooterCol--account{
  border-left:1px solid #e6e6e6;
  padding-left: 18px;
}

.ogtFooterCol__list--strong a{
  font-weight: normal;
}

.ogtFooterCol__miniRule{
  height:1px;
  background:#e6e6e6;
  margin: 12px 0 12px;
}

.ogtFooterCol__list--mini a{
  font-size: 12px;
  color:#333;
}

/* Bottom */
.ogtFooter__bottomRule{
  height:1px;
  background:#e6e6e6;
  margin: 10px 0 10px;
}

.ogtFooterBottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 8px 0 0;
  color:#333;
}

.ogtFooterBottom__left{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  white-space: nowrap;
}

.ogtFooterBottom__links{
  display:flex;
  flex-wrap:wrap;
  gap: 10px 14px;
  justify-content:flex-end;
}

.ogtFooterBottom__links a{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  color:#333;
  text-decoration:none;
}

.ogtFooterBottom__links a:hover{
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 1020px){
  .ogtFooter__cols{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ogtFooterCol--account{
    border-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 560px){
  .ogtFooter__cols{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .ogtFooterBottom{
    flex-direction:column;
    align-items:flex-start;
  }
  .ogtFooterBottom__links{
    justify-content:flex-start;
  }
}

/* =========================================
   Mobile fix: Header Top Strip only
   (Search + Date + Flag)
========================================= */

@media (max-width: 560px){

  /* 1) 上段をエリアで固定して崩れを止める */
  .ogtTopStrip{
    grid-template-columns: 1fr auto; /* 左(検索) / 右(日付+国旗) */
    grid-template-areas:
      "search meta"
      "ticker ticker";
    align-items: start;
    gap: 10px 12px;
    padding: 10px 0 8px;
  }

  .ogtSearch{ grid-area: search; }
  .ogtMeta{ grid-area: meta; }
  .ogtTicker{ grid-area: ticker; display:block; }

  /* 2) 検索を「必ず1行で収める」 */
  .ogtSearch{
    width: 100%;
    min-width: 0;
    gap: 8px;
  }

  .ogtSearch__icon{
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
  }

  .ogtSearch__input{
    width: 100%;
    min-width: 0;        /* ←これ重要（縮められない問題を潰す） */
    flex: 1 1 auto;
  }

  .ogtSearch__go{
    flex: 0 0 auto;
    min-width: 44px;     /* 押せる最低幅 */
    padding: 0 10px;
  }

  /* 3) 日付ブロックを右に固定して、行数も詰める */
  .ogtMeta{
    justify-self: end;
    text-align: left;
    font-size: 12px;
    line-height: 1.15;
    padding-top: 0;
    white-space: nowrap; /* “Sunday, January...” の改行暴発を抑える */
  }

  .ogtMeta__paper{
    margin-top: 6px;
  }

  /* 4) 国旗を「日付ブロックの下」に確実に置く（変な位置に落ちない） */
    .ogtRight {
        justify-self: end;
        padding-top: 6px;
        margin-top: 10%;
        margin-bottom: 5%;
    }
  /* もし .ogtRight が .ogtTopStrip の子でない構造なら、
     ↓この2行は不要。今の作りだと子なので効くはず。 */
  .ogtTopStrip .ogtRight{ grid-area: meta; }
  .ogtTopStrip .ogtRight .ogtFlagJP{ margin-top: 6px; }

  .ogtFlagJP{
    width: 34px;
    height: 34px;
  }

  /* 5) ticker はスマホで詰める（邪魔なら display:none にしてOK） */
  .ogtTicker{
    padding-top: 2px;
    font-size: 11px;
    letter-spacing: .08em;
    opacity: .7;
  }
}


@media (max-width: 560px){

    .ogtLogoRow {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 3% 8%;
    }
	
}

/* =========================
   SINGLE: sticky header that hides on scroll down, shows on scroll up
========================= */
.ogtSHeader{
  position: fixed;
  top: 0;
  left: 0; right: 0;
  background: #fff;
  z-index: 999;
  transform: translateY(0);
  transition: transform .22s ease;
  border-bottom: 1px solid #e6e6e6;
}

.ogtSHeader.is-hidden{
  transform: translateY(-110%);
}

.ogtSHeader__inner{
  max-width: 1180px;
  margin: 0 auto;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 10px;
  align-items: center;
}

.ogtSHeader__iconBtn{
  width: 34px;
  height: 34px;
  border: 1px solid #e6e6e6;
  background: #fff;
  border-radius: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ogtSHeader__burgerLines{
  width: 16px;
  height: 2px;
  background: #111;
  position: relative;
  display: block;
}
.ogtSHeader__burgerLines::before,
.ogtSHeader__burgerLines::after{
  content:"";
  position:absolute;
  left:0;
  width: 16px;
  height: 2px;
  background:#111;
}
.ogtSHeader__burgerLines::before{ top:-5px; }
.ogtSHeader__burgerLines::after{ top: 5px; }

.ogtSHeader__search{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.ogtSHeader__searchIcon{
  border-color:#e6e6e6;
}
.ogtSHeader__svg{
  width: 18px;
  height: 18px;
  color: #5b6772;
}

.ogtSHeader__searchInput{
  height: 34px;
  width: min(520px, 100%);
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 14px;
  outline: none;
}

.ogtSHeader__go{
  height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 2px;
  background: #8fa5bb;
  color: #111;
  font-weight: 800;
  cursor: pointer;
}

.ogtSHeader__logo{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
}
.ogtSHeader__logo img{
  height: 28px; /* mobile-first */
  width: auto;
  display:block;
}

.ogtSHeader__right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}

.ogtSHeader__flag{
  width: 34px;
  height: 34px;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

/* 日本国旗（画像を拾う必要なし：CSSだけで再現） */
.ogtSHeader__jpFlag{
  width: 18px;
  height: 12px;
  background:#fff;
  border: 1px solid #dcdcdc;
  position: relative;
  display:block;
}
.ogtSHeader__jpFlag::after{
  content:"";
  position:absolute;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background:#bc002d;
  left:50%; top:50%;
  transform: translate(-50%, -50%);
}

.ogtSHeader__rule{
  height: 1px;
  background:#e6e6e6;
}

/* =========================
   Drawer (NYT-like left panel)
========================= */
.ogtSDrawerOverlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.28);
  z-index: 998;
}

.ogtSDrawer{
  position: fixed;
  top: 0; bottom: 0;
  left: 0;
  width: min(340px, 88vw);
  background: #fff;
  z-index: 999;
  transform: translateX(-105%);
  transition: transform .22s ease;
  border-right: 1px solid #e6e6e6;
}

body.ogt-menu-open .ogtSDrawer{
  transform: translateX(0);
}
body.ogt-menu-open .ogtSDrawerOverlay{
  display:block;
}

.ogtSDrawer__top{
  display:flex;
  align-items:center;
  padding: 12px 12px;
}

.ogtSDrawer__close{
  width: 40px;
  height: 40px;
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.ogtSDrawer__nav{
  padding: 8px 0 18px;
}

.ogtSDrawer__item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 18px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 18px;
  font-weight: 650;
  color:#111;
  text-decoration:none;
  border-top: 1px solid #fff;
}
.ogtSDrawer__item:hover{
  background:#fafafa;
}

.ogtSDrawer__item--home{
  font-weight: 800;
}

.ogtSDrawer__chev{
  opacity: .55;
  font-size: 22px;
  transform: translateY(-1px);
}

.ogtSDrawer__miniMark{
  opacity:.7;
  font-size: 18px;
}

/* =====================================================
   SINGLE PAGE (single.php) BASE
===================================================== */
.ogtSMain{
  padding-top: 62px; /* fixed header height */
  background:#fff;
}

.ogtSArticleWrap{
  max-width: 860px;
  margin: 0 auto;
  padding: 24px 18px 60px;
}

.ogtSArticle__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.12;
  margin: 10px 0 14px;
}

.ogtSArticle__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  color:#444;
  margin-bottom: 16px;
}

.ogtSArticle__hero img{
  width:100%;
  height:auto;
  display:block;
}

.ogtSArticle__content{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 19px;
  line-height: 1.7;
  color:#111;
}


/* =====================================================
   FIXED HEADER (single)
   - 1段でコンパクト
   - 中央ロゴ（常に同じ行）
===================================================== */
.ogtSHeader{
  position: fixed;
  top: 0; left: 0; right: 0;
  background:#fff;
  z-index: 10000;
  transform: translateY(0);
  transition: transform .22s ease;
  border-bottom: 1px solid #e6e6e6;
}

body.ogtHeaderHidden .ogtSHeader{
  transform: translateY(-110%);
}

/* 1行固定：左(バーガー+検索) / 中央ロゴ / 右(国旗) */
.ogtSHeader__inner{
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 14px;
  height: 56px;

  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
}

/* left cluster */
.ogtSHeader__burger{ justify-self: start; }

.ogtSHeader__search{
  justify-self: start;
  display:flex;
  align-items:center;
  gap: 8px;
  min-width: 0;
}

/* center logo */
.ogtSHeader__logo{
  justify-self: center;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height: 0;
}
.ogtSHeader__logo img{
  height: 26px;
  width: auto;
  display:block;
}

/* right */
.ogtSHeader__right{
  justify-self: end;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

/* buttons */
.ogtSHeader__iconBtn{
  width: 36px;
  height: 36px;
  border: 1px solid #e6e6e6;
  background:#fff;
  border-radius: 2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

/* burger lines */
.ogtSHeader__burgerLines{
  width: 16px;
  height: 2px;
  background:#111;
  position: relative;
  display:block;
}
.ogtSHeader__burgerLines::before,
.ogtSHeader__burgerLines::after{
  content:"";
  position:absolute;
  left:0;
  width: 16px;
  height: 2px;
  background:#111;
}
.ogtSHeader__burgerLines::before{ top:-5px; }
.ogtSHeader__burgerLines::after{  top: 5px; }

/* search */
.ogtSHeader__svg{ width:18px; height:18px; }

.ogtSHeader__searchInput{
  height: 36px;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 14px;
  outline: none;

  width: min(420px, 34vw);
  max-width: 420px;
  min-width: 110px;
}

.ogtSHeader__go{
  height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: 2px;
  background: #8fa5bb;
  color:#111;
  font-weight: 800;
  cursor:pointer;
}

/* flag */
.ogtSHeader__flag{
  width: 38px;
  height: 38px;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ogtSHeader__jpFlag{
  width: 18px;
  height: 12px;
  background:#fff;
  border: 1px solid #dcdcdc;
  position: relative;
  display:block;
}
.ogtSHeader__jpFlag::after{
  content:"";
  position:absolute;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background:#bc002d;
  left:50%; top:50%;
  transform: translate(-50%, -50%);
}

/* モバイルだけ input を短く（1行維持） */
@media (max-width: 560px){
  .ogtSHeader__inner{ height: 54px; }
  .ogtSHeader__searchInput{
    width: min(180px, 36vw);
    max-width: 180px;
    min-width: 90px;
  }
  .ogtSHeader__go{ padding: 0 10px; }
  .ogtSHeader__logo img{ height: 24px; }
}

/* main padding（あなたの既存と合わせてOK） */
.ogtSMain{
  padding-top: 70px; /* 56px + 余白 */
}
@media (max-width: 560px){
  .ogtSMain{ padding-top: 64px; }
}


/* =====================================================
   DRAWER OVERLAY
===================================================== */
.ogtSDrawerOverlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 9998;
}
.ogtSDrawerOverlay[hidden]{
  display:none;
}

body.ogtDrawerOpen{
  overflow:hidden;
}

/* =====================================================
   DRAWER (NYT-like: FULLSCREEN, 2-level)
   - always fills viewport (no right black area)
===================================================== */
.ogtSDrawer{
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background:#fff;
  z-index: 9999;
  overflow: hidden;
  display:flex;
  flex-direction: column;
}

/* top bar with close */
.ogtSDrawer__top{
  height: 60px;
  display:flex;
  align-items:center;
  padding: 0 18px;
  border-bottom: 1px solid #e6e6e6;
}

.ogtSDrawer__close{
  font-size: 28px;
  line-height: 1;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0;
}

/* two panes */
.ogtSDrawer__paneWrap{
  flex: 1;
  display:grid;
  grid-template-columns: 320px 1fr;
  min-height: 0; /* allow inner scroll */
}

/* pane base */
.ogtSDrawer__pane{
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* left pane */
.ogtSDrawer__pane--left{
  border-right:1px solid #e6e6e6;
  padding: 14px 0;
}

.ogtSDrawer__nav{
  padding: 0 0;
}

.ogtSDrawer__item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 18px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 20px;
  font-weight: 800;
  color:#111;
  text-decoration:none;
}

.ogtSDrawer__item:hover{
  background:#f6f6f6;
}

.ogtSDrawer__chev{
  opacity:.55;
  font-size: 22px;
}

/* button version (if you use <button>) */
.ogtSDrawer__itemBtn{
  width:100%;
  border:0;
  background:transparent;
  text-align:left;
  cursor:pointer;
  padding: 14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 20px;
  font-weight: 800;
}
.ogtSDrawer__itemBtn:hover{ background:#f6f6f6; }
.ogtSDrawer__itemBtn.is-active{
  background:#f2f2f2;
  font-weight: 900;
}

/* right pane panels */
.ogtSDrawer__panel{
  display:none;
  padding: 18px 22px 26px;
}
.ogtSDrawer__panel.is-active{
  display:block;
}

/* panel header */
.ogtSDrawer__panelHead{
  padding-bottom: 16px;
  border-bottom: 1px solid #e6e6e6;
  margin-bottom: 18px;
}
.ogtSDrawer__panelTitle{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 900;
  font-size: 40px;
  margin: 0;
}

/* 3 columns inside right pane */
.ogtSDrawer__panelGrid3{
  display:grid;
  grid-template-columns: 1fr 1fr 1.2fr;
  gap: 28px;
}

.ogtSDrawer__colLabel{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: .10em;
  color:#777;
  font-weight: 800;
  margin: 0 0 10px;
}

.ogtSDrawer__col a{
  display:block;
  padding: 10px 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 650;
  color:#111;
  text-decoration:none;
}
.ogtSDrawer__col a:hover{
  text-decoration: underline;
}

/* newsletters */
.ogtSDrawer__nlItem{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 10px 0;
}
.ogtSDrawer__nlIcon{
  width: 26px;
  height: 26px;
  border-radius: 4px;
  background:#f3d84e;
  flex: 0 0 auto;
}
.ogtSDrawer__nlIcon--evening{ background:#c75d7b; }
.ogtSDrawer__nlTitle{ font-weight: 900; }
.ogtSDrawer__nlDesc{
  color:#444;
  font-size: 14px;
  line-height: 1.35;
  margin-top: 4px;
}
.ogtSDrawer__nlMore{
  display:inline-block;
  margin-top: 12px;
  font-size: 14px;
  color:#444;
  text-decoration:none;
}
.ogtSDrawer__nlMore:hover{ text-decoration:underline; }

/* =====================================================
   MOBILE: NYT-like (second level slides in)
   - left list stays
   - right panel overlays and slides
===================================================== */
@media (max-width: 768px){
  .ogtSDrawer__paneWrap{
    grid-template-columns: 1fr; /* only left visible */
    position: relative;
  }

  .ogtSDrawer__pane--left{
    border-right: 0;
  }

  /* right panel becomes overlay screen */
  .ogtSDrawer__pane--right{
    position: absolute;
    inset: 0;
    background:#fff;
    transform: translateX(100%);
    transition: transform .22s ease;
    border-left: 1px solid #e6e6e6;
  }

  .ogtSDrawer__pane--right.is-active{
    transform: translateX(0);
  }

  .ogtSDrawer__panelTitle{
    font-size: 34px;
  }

  .ogtSDrawer__panelGrid3{
    grid-template-columns: 1fr; /* 3カラムは無理なので縦 */
    gap: 18px;
  }
}

/* extra small */
@media (max-width: 420px){
  .ogtSDrawer__item,
  .ogtSDrawer__itemBtn{
    font-size: 18px;
    padding: 12px 16px;
  }
  .ogtSDrawer__panel{
    padding: 16px 16px 22px;
  }
}

/* 右ペイン見出し行：タイトル左、×右 */
.ogtSDrawer__panelHeadRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.ogtSDrawer__x{
  width:44px;
  height:44px;
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:28px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#111;
}

.ogtSDrawer__x:hover{ opacity:.7; }

/* ===== Right pane header (U.S. + ×) ===== */
.ogtSDrawer__panelHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  border-bottom: 1px solid #e6e6e6;
  margin-bottom: 16px;
}

/* U.S. title */
.ogtSDrawer__panelTitle{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 900;
  font-size: 36px;
  line-height: 1;
  margin: 0;
}

/* × button (right side) */
.ogtSDrawer__panelClose{
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 4px 6px;
  color: #000;
}

.ogtSDrawer__panelClose:hover{
  opacity: 0.6;
}


/* =====================================================
   OGT SINGLE HEADER (NYT-like: logo centered)
   - ロゴを absolute で中央固定
   - 左：burger + search
   - 右：JP flag
===================================================== */

.ogtSHeader{
  position: fixed;
  top: 0;
  left: 0; right: 0;
  background:#fff;
  z-index: 10000;
  border-bottom: 1px solid #e6e6e6;
  transform: translateY(0);
  transition: transform .22s ease;
}

.ogtSHeader.is-hidden{
  transform: translateY(-110%);
}

/* ここが肝：relative + flex */
.ogtSHeader__inner{
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* LEFT: burger + search を左に固める */
.ogtSHeader__burger{
  flex: 0 0 auto;
}

.ogtSHeader__search{
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  gap: 8px;
  min-width: 0;
}

/* 入力は伸びる。ロゴ中央の邪魔をしないよう最大幅を制限 */
.ogtSHeader__searchInput{
  height: 34px;
  width: 100%;
  max-width: 180px;
  min-width: 0;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 14px;
  outline: none;
}

.ogtSHeader__go{
  height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 2px;
  background: #8fa5bb;
  color:#111;
  font-weight: 800;
  cursor:pointer;
}

/* RIGHT: flag */
.ogtSHeader__right{
  flex: 0 0 auto;
  display:flex;
  justify-content:flex-end;
  margin-left: auto; /* 右端へ */
}

.ogtSHeader__flag{
  width: 54px;
  height: 54px;
  border: 0px solid #e6e6e6;
  border-radius: 2px;
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

/* ロゴ：中央に固定（absolute） */
.ogtSHeader__logo{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  z-index: 2;
}

.ogtSHeader__logo img{
  height: 34px;
  width: auto;
  display:block;
}

/* ボタン類（既存の見た目を維持） */
.ogtSHeader__iconBtn{
  width: 34px;
  height: 34px;
  border: 1px solid #e6e6e6;
  background:#fff;
  border-radius: 2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

.ogtSHeader__burgerLines{
  width: 18px;
  height: 2px;
  background:#111;
  position: relative;
  display:block;
}
.ogtSHeader__burgerLines::before,
.ogtSHeader__burgerLines::after{
  content:"";
  position:absolute;
  left:0;
  width: 18px;
  height: 2px;
  background:#111;
}
.ogtSHeader__burgerLines::before{ top:-6px; }
.ogtSHeader__burgerLines::after{  top: 6px; }

.ogtSHeader__svg{
  width:18px;
  height:18px;
  color:#5b6772;
}

/* 日本国旗 */
.ogtSHeader__jpFlag{
  width: 38px;
  height: 30px;
  background:#fff;
  border: 1px solid #dcdcdc;
  position: relative;
  display:block;
}
.ogtSHeader__jpFlag::after{
  content:"";
  position:absolute;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background:#bc002d;
  left:50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* 固定ヘッダー分の余白（あなたのページに合わせて） */
.ogtSMain{ padding-top: 62px; }

/* --- 小さめ画面：検索欄を短く、ロゴも少し縮める（崩れ防止） --- */
@media (max-width: 700px){
  .ogtSHeader__inner{ padding: 10px 14px; }
  .ogtSHeader__logo img{ height: 28px; }
  .ogtSHeader__searchInput{ max-width: 320px; }
}

@media (max-width: 520px){
  .ogtSHeader__searchInput{ max-width: 220px; }
  .ogtSHeader__go{ padding: 0 10px; }
}

/* =====================================================
   SINGLE TYPOGRAPHY (H2/H3/H4) — OGT
   scope: .ogtSingle__content only
===================================================== */

.ogtSingle__content{
  --ogt-rule: #e6e6e6;
  --ogt-ink: #111;
  --ogt-sub: #444;
}

/* 本文中の見出し共通：余白のルール */
.ogtSingle__content h2,
.ogtSingle__content h3,
.ogtSingle__content h4{
  color: var(--ogt-ink);
  font-feature-settings: "liga" 1, "kern" 1;
  letter-spacing: .01em;
  scroll-margin-top: 96px; /* 固定ヘッダーにアンカーが隠れない */
}

/* H2：セクション見出し（太め + 上に薄い罫線） */
.ogtSingle__content h2{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: clamp(24px, 2.2vw, 30px);
  line-height: 1.15;

  margin: 42px 0 14px;
  padding-top: 16px;
  border-top: 1px solid var(--ogt-rule);
}

/* H3：小見出し（少し小さく、余白短め） */
.ogtSingle__content h3{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: clamp(19px, 1.6vw, 22px);
  line-height: 1.25;

  margin: 22px 0 10px;
}

/* H4：補助見出し（サンセリフでNYTっぽく） */
.ogtSingle__content h4{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 850;
  font-size: 14px;
  line-height: 1.25;
  letter-spacing: .08em;
  text-transform: uppercase;

  margin: 18px 0 8px;
  color: #333;
}

/* 見出し直後の段落：上の余白を少し詰める */
.ogtSingle__content h2 + p,
.ogtSingle__content h3 + p,
.ogtSingle__content h4 + p{
  margin-top: 8px;
}

/* 本文の段落を少し整える（見出しとのバランス） */
.ogtSingle__content p{
  margin: 0 0 18px;
}

/* リンク：上品に */
.ogtSingle__content a{
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.ogtSingle__content a:hover{
  opacity: .75;
}

/* リストも整える */
.ogtSingle__content ul,
.ogtSingle__content ol{
  padding-left: 1.2em;
  margin: 0 0 18px;
}
.ogtSingle__content li{
  margin: 0 0 8px;
}

/* 引用 */
.ogtSingle__content blockquote{
  margin: 22px 0;
  padding: 12px 16px;
  border-left: 3px solid var(--ogt-rule);
  color: var(--ogt-sub);
}

.ogtSingle__content strong {
  font-weight: 700;
  color: #111;
  background: linear-gradient( #ff212100 65%, rgba(255, 42, 42, 0.26) 65% );
  padding: 0 2px;
}

/* =====================================================
   SINGLE: mini-answer / mini-takeaway
   scope: .ogtSingle__content only
===================================================== */

/* 共通ボックス */
.ogtSingle__content .mini-answer,
.ogtSingle__content .mini-takeaway{
  border: 1px solid #e6e6e6;
  background: #fbfbfb;
  padding: 14px 16px;
  margin: 18px 0 22px;
  border-radius: 6px;
}

/* 中の段落/リストの余白を整える */
.ogtSingle__content .mini-answer > :first-child,
.ogtSingle__content .mini-takeaway > :first-child{
  margin-top: 0;
}
.ogtSingle__content .mini-answer > :last-child,
.ogtSingle__content .mini-takeaway > :last-child{
  margin-bottom: 0;
}
.ogtSingle__content .mini-answer p,
.ogtSingle__content .mini-takeaway p{
  margin: 0 0 10px;
}
.ogtSingle__content .mini-answer ul,
.ogtSingle__content .mini-takeaway ul,
.ogtSingle__content .mini-answer ol,
.ogtSingle__content .mini-takeaway ol{
  margin: 0 0 10px;
  padding-left: 1.2em;
}
.ogtSingle__content .mini-answer li,
.ogtSingle__content .mini-takeaway li{
  margin: 0 0 6px;
}

/* ラベル（擬似要素で出す） */
.ogtSingle__content .mini-answer::before,
.ogtSingle__content .mini-takeaway::before{
  display: inline-block;
  margin-bottom: 10px;
  padding: 4px 10px;

  border: 1px solid #e6e6e6;
  border-radius: 999px;
  background: #fff;

  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: #111;
}

/* 個別ラベル文言 */
.ogtSingle__content .mini-answer::before{
  content: "MINI ANSWER";
}
.ogtSingle__content .mini-takeaway::before{
  content: "MINI TAKEAWAY";
}

/* mini-answer：少し強め（答えっぽく） */
.ogtSingle__content .mini-answer{
  border-left: 4px solid #111;
}

/* mini-takeaway：少し柔らかめ（要点っぽく） */
.ogtSingle__content .mini-takeaway{
  border-left: 4px solid #8fa5bb; /* headerのGOボタン系に寄せる */
}

/* モバイル：左右余白を気持ち増やす */
@media (max-width: 560px){
  .ogtSingle__content .mini-answer,
  .ogtSingle__content .mini-takeaway{
    padding: 14px 14px;
    border-radius: 8px;
  }
}

.breadcrumbs {
    font-size: 12px;
}

@media (max-width: 560px){

    .breadcrumbs {
        font-size: .7em;
        line-height: 1.2em;
        margin: 0%;
    }
}
　
/* =========================
   Category Grid (like screenshot #1)
   Scope: .ogtCatGrid only
========================= */

.ogtCatGrid {
  background: #fff;
  color: #111;
}

.ogtCatGrid__inner{
  max-width: 1380px;
  margin: 0 auto;
  padding: 18px 18px 24px;
  display: grid;
  grid-template-columns: 1.05fr 1.55fr; /* left big + right grid */
  gap: 28px;
  align-items: start;
}

/* --- reset inside component (theme CSSの影響を遮断) --- */
.ogtCatGrid a{
  color: inherit !important;
  text-decoration: none !important;
}
.ogtCatGrid a:hover{
  text-decoration: none !important; /* themeの underline を無効化 */
}
.ogtCatGrid h2,
.ogtCatGrid h3{
  margin: 0 !important;  /* themeの見出し余白を無効化 */
  padding: 0 !important;
}

/* shared image */
.ogtCatGrid__img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* =========================
   LEFT: Lead
========================= */
.ogtCatGrid__leadLink{
  display: block;
}

.ogtCatGrid__leadMedia{
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #f3f3f3;
  overflow: hidden;
}

.ogtCatGrid__leadTitle{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 900;
  font-size: clamp(28px, 2.2vw, 44px);
  line-height: 1.05;
  letter-spacing: -0.01em;
  margin-top: 14px !important;
}

/* =========================
   RIGHT: Rail (3 cols x 2 rows)
========================= */
.ogtCatGrid__rail{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px 22px;
  align-items: start;
}

.ogtCatGrid__cardLink{
  display: block;
}

.ogtCatGrid__cardMedia{
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #f3f3f3;
  overflow: hidden;
}

.ogtCatGrid__cardTitle{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 900;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: -0.005em;
  margin-top: 10px !important;
}

/* hover: 軽い反応だけ */
.ogtCatGrid__leadLink:hover .ogtCatGrid__leadTitle,
.ogtCatGrid__cardLink:hover .ogtCatGrid__cardTitle{
  opacity: .85;
}

/* =========================
   Responsive
========================= */
@media (max-width: 1100px){
  .ogtCatGrid__inner{
    grid-template-columns: 1fr;
  }
  .ogtCatGrid__rail{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 780px){
  .ogtCatGrid__rail{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px){
  .ogtCatGrid__rail{
    grid-template-columns: 1fr;
  }
	
.category{
	width: 100% !important;
	margin: 0 auto;
}
	
	
}

.category{
	width: 1250px;
	margin: 0 auto;
}

/* =====================================================
   ogtCatBiz : MOBILE – hierarchy fix
   Goal:
   - Lead(注目)は大きく縦で見せる
   - 下段は“横型の小カード”にして差を出す
===================================================== */

/* まずスマホで余白を整える */
@media (max-width: 860px){
  .ogtCatBiz__inner{
    padding: 16px 12px 44px;
  }

  /* ===== Lead（注目記事）は“ヒーロー扱い” ===== */
  .ogtCatBizLead{
    margin-bottom: 18px;
  }

  .ogtCatBizLead__grid{
    grid-template-columns: 1fr; /* 縦積み */
    gap: 12px;
  }

  /* 注目記事は“画像でかめ＋タイトルでかめ” */
  .ogtCatBizLead__imgFrame{
    border: 1px solid #e6e6e6;
  }
  .ogtCatBizLead__img{
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }

  .ogtCatBizLead__title{
    font-size: 32px;      /* ここが差のコア */
    line-height: 1.06;
    margin: 0 0 10px;
    letter-spacing: -0.01em;
  }

  .ogtCatBizLead__dek{
    font-size: 16px;
    line-height: 1.6;
    margin: 0 0 12px;
  }

  /* 右カラム用カードはスマホでは“普通カード扱い”で薄くする */
  .ogtCatBizRightCard{
    padding-bottom: 14px;
    border-bottom: 1px solid #e6e6e6;
  }
  .ogtCatBizRightCard__title{
    font-size: 18px;
    line-height: 1.18;
    margin: 10px 0 8px;
  }
  .ogtCatBizRightCard__dek{
    display: none; /* 注目との差を出す（右カラムは説明消す） */
  }

  /* ===== 下段一覧：縦カードをやめて“横型カード”へ ===== */
  .ogtCatBizGrid{
    padding-top: 16px;
  }

  /* 1列にして、各カードを横並びにする（これで注目が際立つ） */
  .ogtCatBizGrid__grid{
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ogtCatBizCard{
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 12px;

    /* 横型カード */
    display: grid;
    grid-template-columns: 40% 1fr; /* サムネ | テキスト */
    gap: 12px;
    align-items: start;
  }

  .ogtCatBizCard__media{
    border: 1px solid #e6e6e6;
  }

  .ogtCatBizCard__img{
    aspect-ratio: 4 / 3;   /* 小カード感 */
    object-fit: cover;
  }

  .ogtCatBizCard__title{
    font-size: 17px;       /* 注目より確実に小さく */
    line-height: 1.22;
    margin: 2px 0 6px;
  }

  /* 下段は説明文を消して“ニュース一覧っぽく” */
  .ogtCatBizCard__dek{
    display: none;
  }

  .ogtCatBizCard__meta{
    font-size: 12px;
  }

  /* promo/ad も横型に巻き込まない */
  .ogtCatBizCard--promo,
  .ogtCatBizCard--ad{
    display: block;
  }
}

/* さらに小さいスマホ：注目をもっと強く、下段はさらにコンパクト */
@media (max-width: 520px){
  .ogtCatBizLead__title{
    font-size: 28px;
  }

  .ogtCatBizCard{
    grid-template-columns: 36% 1fr;
    gap: 10px;
  }
  .ogtCatBizCard__title{
    font-size: 16px;
  }
}

/* =========================================
   ogtCatBiz (Category Layout)
   - PC: Left text / Center hero image / Right featured card
   - Mobile: Lead is hero, below is compact list
   Scope: .ogtCatBiz only
========================================= */

.ogtCatBiz{
  background:#fff;
  color:#111;
}

/* テーマ側の固定幅が噛んでも壊れない保険 */
.category{
  width: 97% !important;
  max-width: 100% !important;
	margin-top: 10px;
}

/* =========================
   Inner
========================= */
.ogtCatBiz__inner{
  width: 100%;
  max-width: 1380px;
  margin: 0 auto;
  padding: 28px 18px 60px;

  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.45;
}

.ogtCatBiz *{ box-sizing: border-box; }

.ogtCatBiz a{
  color: inherit !important;
  text-decoration: none !important;
}
.ogtCatBiz a:hover{
  text-decoration: underline !important;
}

/* 見出しのテーマ余白を遮断 */
.ogtCatBiz h1,
.ogtCatBiz h2,
.ogtCatBiz h3,
.ogtCatBiz p{
  margin: 0;
}

.ogtCatBiz img{
  max-width: 100%;
  height: auto;
  display:block;
}

/* =========================
   Shared media (超重要)
   - 画像が切れる/縦に伸びる事故を止める
========================= */
.ogtCatBizMedia{
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow: hidden;
}
.ogtCatBizMedia__img{
  width: 100%;
  height: 100%;
  display:block;
  object-fit: cover;
  object-position: center;
}

/* =========================
   Top Lead (3 columns)
========================= */
.ogtCatBizLead{
  margin-bottom: 26px;
}

.ogtCatBizLead__grid{
  display: grid;
  grid-template-columns: 1fr 1.6fr 1fr;
  gap: 26px;
  align-items: stretch; /* ✅ 高さ揃える */
  min-width: 0;
}

/* ---------- Left text ---------- */
.ogtCatBizLead__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 44px;
  line-height: 1.03;
  letter-spacing: -0.012em;
  margin: 0 0 14px;
}
.ogtCatBizLead__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 18px;
  line-height: 1.6;
  color:#2b2b2b;
  margin: 0 0 16px;
}
.ogtCatBizLead__meta{
  font-size: 13px;
  color:#6b6b6b;
}
.ogtCatBizLead__sep{
  margin: 0 8px;
  opacity:.65;
}

/* ---------- Center hero image ---------- */
.ogtCatBizLead__imgFrame{
  /* 共有クラスに寄せたいけど既存を尊重して直書き */
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow: hidden;

  /* ✅ 高さが暴れないように比率固定 */
  aspect-ratio: 16 / 9;
}
.ogtCatBizLead__img{
  width: 100%;
  height: 100%;
  display:block;
  object-fit: cover;
  object-position: center;
}

/* ---------- Right featured card ----------
   ✅ ここが今回の肝：
   - 右のカード全体の高さを「中央のヒーロー」と揃える
   - 画像だけが縦に伸びて切れるのを防ぐ
*/
.ogtCatBizRightCard{
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 18px;

  /* ✅ 中央と高さを合わせる：右カラムを縦グリッドで配分 */
  display: grid;
  grid-template-rows: 62% auto; /* 画像:テキストの比率（調整可） */
  gap: 12px;

  /* ✅ 右カラム自身が伸びる */
  min-height: 0;
}

.ogtCatBizRightCard__media{
  border: 1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;

  /* ✅ 親の row(62%) を“ちゃんと使う” */
  min-height: 0;
}
.ogtCatBizRightCard__img{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;
  object-position: center;
}

/* 右カードのテキスト */
.ogtCatBizRightCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 24px;
  line-height: 1.12;
  margin: 0 0 8px;
}
.ogtCatBizRightCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 10px;
}
.ogtCatBizRightCard__meta{
  font-size: 13px;
  color:#6b6b6b;
}

/* =========================
   Grid section (below)
========================= */
.ogtCatBizGrid{
  border-top: 1px solid #e6e6e6;
  padding-top: 22px;
}
.ogtCatBizGrid__grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
  min-width: 0;
}

/* card */
.ogtCatBizCard{
  min-width: 0;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 18px;
}
.ogtCatBizCard__media{
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow:hidden;

  /* ✅ ここで“変な縦伸び”が出ないよう固定 */
  aspect-ratio: 16 / 9;
}
.ogtCatBizCard__img{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;
  object-position: center;
}
.ogtCatBizCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 22px;
  line-height: 1.14;
  margin: 12px 0 8px;
}
.ogtCatBizCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 15px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 10px;
}
.ogtCatBizCard__meta{
  font-size: 12px;
  color:#6b6b6b;
}

/* promo/ad */
.ogtCatBizCard--promo,
.ogtCatBizCard--ad{
  border-bottom: 0;
  padding-bottom: 0;
}
.ogtCatBizPromo{
  border-top: 1px solid #e6e6e6;
  padding-top: 14px;
}
.ogtCatBizPromo__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 20px;
  margin: 0 0 10px;
}
.ogtCatBizPromo__text{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 15px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 12px;
}
.ogtCatBizPromo__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 40px;
  padding: 0 14px;
  border: 1px solid #111;
  border-radius: 3px;
  font-weight: 800;
  text-decoration:none !important;
}
.ogtCatBizPromo__btn:hover{ opacity:.78; }

.ogtCatBizAd{
  border-top: 1px solid #e6e6e6;
  padding-top: 14px;
}
.ogtCatBizAd__label{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  color:#666;
  text-align:right;
  margin-bottom: 10px;
}
.ogtCatBizAd__box{
  width:100%;
  aspect-ratio: 16 / 9;
  border: 1px solid #e6e6e6;
  background:#f7f7f7;
}
.ogtCatBizAd__title{
  font-weight: 800;
  margin-top: 10px;
}
.ogtCatBizAd__text{
  color:#444;
  margin-top: 6px;
  font-size: 14px;
}

/* =========================
   Responsive
========================= */
@media (max-width: 1180px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr 1.4fr 1fr;
  }
  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* タブレット：3カラムは縦積みにする（崩れ防止） */
@media (max-width: 900px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .ogtCatBizLead__title{
    font-size: 36px;
  }

  /* 右カード：縦積みになったら普通カードへ（高さ問題を封じる） */
  .ogtCatBizRightCard{
    grid-template-rows: auto;
  }
  .ogtCatBizRightCard__media{
    aspect-ratio: 16 / 9;
  }
  .ogtCatBizRightCard__img{
    height: 100%;
  }

  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ✅ Mobile: 注目を強く、下段を横型カードに */
@media (max-width: 560px){
  .ogtCatBiz__inner{
    padding: 14px 12px 40px;
  }

  /* Lead（注目） */
  .ogtCatBizLead{ margin-bottom: 16px; }

  .ogtCatBizLead__title{
    font-size: 30px;
    line-height: 1.06;
    margin: 0 0 10px;
  }
  .ogtCatBizLead__dek{
    font-size: 15px;
    margin: 0 0 12px;
  }

  /* ヒーロー画像は少し縦寄せ */
  .ogtCatBizLead__imgFrame{
    aspect-ratio: 16 / 10;
  }

  /* 右カードは説明消してニュース感 */
  .ogtCatBizRightCard__dek{ display:none; }
  .ogtCatBizRightCard__title{
    font-size: 18px;
    line-height: 1.18;
  }

  /* 下段一覧：1列＋横型カード */
  .ogtCatBizGrid{
    padding-top: 14px;
  }
  .ogtCatBizGrid__grid{
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ogtCatBizCard{
    display: grid;
    grid-template-columns: 38% 1fr;
    gap: 12px;
    align-items: start;
    padding-bottom: 12px;
  }

  .ogtCatBizCard__media{
    aspect-ratio: 4 / 3;
  }

  .ogtCatBizCard__title{
    font-size: 16px;
    line-height: 1.22;
    margin: 2px 0 6px;
  }

  .ogtCatBizCard__dek{ display:none; }
  .ogtCatBizCard__meta{ font-size: 12px; }

  /* promo/adは横型カードに巻き込まない */
  .ogtCatBizCard--promo,
  .ogtCatBizCard--ad{
    display:block;
  }
}

@media (max-width: 420px){
  .ogtCatBizLead__title{ font-size: 28px; }
  .ogtCatBizCard{
    grid-template-columns: 36% 1fr;
    gap: 10px;
  }
}

/* =========================================
   ogtCatBiz (Category Layout)
   - PC: Left text / Center hero image / Right featured card + below grid
   - Mobile: Always image -> title -> meta (NO confusion)
   Scope: .ogtCatBiz only
========================================= */

.ogtCatBiz{
  background:#fff;
  color:#111;
}

.ogtCatBiz__inner{
  width: 100%;
  max-width: 1380px;
  margin: 0 auto;
  padding: 28px 18px 60px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.45;
}

.ogtCatBiz *{ box-sizing: border-box; }

.ogtCatBiz a{
  color: inherit !important;
  text-decoration: none !important;
}
.ogtCatBiz a:hover{
  text-decoration: underline !important;
}

.ogtCatBiz h1,
.ogtCatBiz h2,
.ogtCatBiz h3,
.ogtCatBiz p{
  margin: 0;
}

.ogtCatBiz img{
  max-width: 100%;
  height: auto;
  display:block;
}

/* ============ Shared media ============ */
.ogtCatBizLead__imgFrame,
.ogtCatBizRightCard__media,
.ogtCatBizCard__media{
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow: hidden;
}

.ogtCatBizLead__img,
.ogtCatBizRightCard__img,
.ogtCatBizCard__img{
  width: 100%;
  height: 100%;
  display:block;
  object-fit: cover;
  object-position: center;
}

/* =========================
   Top Lead (3 columns)
========================= */
.ogtCatBizLead{
  margin-bottom: 26px;
}

.ogtCatBizLead__grid{
  display: grid;
  grid-template-columns: 1fr 1.6fr 1fr;
  gap: 26px;
  align-items: stretch;
  min-width: 0;
}

/* left text */
.ogtCatBizLead__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 44px;
  line-height: 1.03;
  letter-spacing: -0.012em;
  margin: 0 0 14px;
}
.ogtCatBizLead__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 18px;
  line-height: 1.6;
  color:#2b2b2b;
  margin: 0 0 16px;
}
.ogtCatBizLead__meta{
  font-size: 13px;
  color:#6b6b6b;
}
.ogtCatBizLead__sep{
  margin: 0 8px;
  opacity:.65;
}

/* center big image */
.ogtCatBizLead__imgFrame{
  aspect-ratio: 16 / 9;
}
.ogtCatBizLead__img{
  width: 100%;
  height: 100%;
}

/* right card (PCでは中央と高さ揃え) */
.ogtCatBizRightCard{
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 18px;

  display: grid;
  grid-template-rows: 62% auto;
  gap: 12px;
  min-height: 0;
}

.ogtCatBizRightCard__media{
  min-height: 0;
}
.ogtCatBizRightCard__img{
  width:100%;
  height:100%;
}

.ogtCatBizRightCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 24px;
  line-height: 1.12;
  margin: 0 0 8px;
}
.ogtCatBizRightCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 10px;
}
.ogtCatBizRightCard__meta{
  font-size: 13px;
  color:#6b6b6b;
}

/* =========================
   Grid section (below)
========================= */
.ogtCatBizGrid{
  border-top: 1px solid #e6e6e6;
  padding-top: 22px;
}
.ogtCatBizGrid__grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
  min-width: 0;
}

.ogtCatBizCard{
  min-width: 0;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 18px;
}

.ogtCatBizCard__media{
  aspect-ratio: 16 / 9;
}
.ogtCatBizCard__img{
  width:100%;
  height:100%;
}

.ogtCatBizCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 800;
  font-size: 22px;
  line-height: 1.14;
  margin: 12px 0 8px;
}
.ogtCatBizCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 15px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 10px;
}
.ogtCatBizCard__meta{
  font-size: 12px;
  color:#6b6b6b;
}

/* promo/ad */
.ogtCatBizCard--promo,
.ogtCatBizCard--ad{
  border-bottom: 0;
  padding-bottom: 0;
}

/* =========================
   Responsive (PC -> Tablet)
========================= */
@media (max-width: 1180px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr 1.4fr 1fr;
  }
  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .ogtCatBizLead__title{
    font-size: 36px;
  }

  /* 右カードは縦積み時は普通カード化 */
  .ogtCatBizRightCard{
    grid-template-rows: auto;
  }
  .ogtCatBizRightCard__media{
    aspect-ratio: 16 / 9;
  }
  .ogtCatBizRightCard__img{
    height: 100%;
  }

  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* =========================================
   ogtCatBiz (FULL CSS)
   Goal:
   - PC: 3-column lead (left text / center big image / right card)
   - Below: grid list
   - Mobile: Lead is big vertical card
             Others are horizontal cards (thumb left)
   Notes:
   - Hard reset inside .ogtCatBiz to avoid theme conflicts
========================================= */

.ogtCatBiz{
  background:#fff;
  color:#111;
}

/* ---- hard reset (scope) ---- */
.ogtCatBiz,
.ogtCatBiz *{
  box-sizing: border-box;
}

.ogtCatBiz img{
  max-width: 100%;
  height: auto;
  display: block;
}

.ogtCatBiz a{
  color: inherit;
  text-decoration: none;
}
.ogtCatBiz a:hover{
  text-decoration: underline;
}

/* テーマ側の見出し余白を潰す */
.ogtCatBiz h2,
.ogtCatBiz h3,
.ogtCatBiz p{
  margin: 0;
}

/* ---- container ---- */
.ogtCatBiz__inner{
  max-width: 1380px;
  margin: 0 auto;
  padding: 28px 18px 60px;
  width: 100%;
}

/* =========================================
   TOP LEAD (PC)
========================================= */
.ogtCatBizLead{
  margin-bottom: 26px;
}

.ogtCatBizLead__grid{
  display: grid;
  grid-template-columns: 1fr 1.6fr 1fr; /* left / center / right */
  gap: 26px;
  align-items: start;
  width: 100%;
  min-width: 0;
}

/* left text */
.ogtCatBizLead__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.05;
  margin: 0 0 14px;
}

.ogtCatBizLead__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 18px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 18px;
}

.ogtCatBizLead__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color:#5b5b5b;
}
.ogtCatBizLead__sep{
  margin: 0 8px;
  opacity:.6;
}

/* center big image */
.ogtCatBizLead__imgFrame{
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow: hidden;
}

.ogtCatBizLead__img{
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* right card */
.ogtCatBizRightCard{
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 40px;
}
.ogtCatBizRightCard__media{
  display:block;
  border: 1px solid #e6e6e6;
  overflow:hidden;
  background:#fff;
}
.ogtCatBizRightCard__img{
  width:100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.ogtCatBizRightCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.15;
  margin: 14px 0 10px;
}
.ogtCatBizRightCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 14px;
}
.ogtCatBizRightCard__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color:#5b5b5b;
}

/* =========================================
   BELOW GRID (PC)
========================================= */
.ogtCatBizGrid{
  border-top: 1px solid #e6e6e6;
  padding-top: 22px;
}

.ogtCatBizGrid__grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
  width: 100%;
  min-width: 0;
}

/* card (default = vertical) */
.ogtCatBizCard{
  min-width: 0;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 18px;
}

.ogtCatBizCard__media{
  display:block;
  border: 1px solid #e6e6e6;
  background:#fff;
  overflow:hidden;
}

.ogtCatBizCard__img{
  width:100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.ogtCatBizCard__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.12;
  margin: 14px 0 10px;
}

.ogtCatBizCard__dek{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.55;
  color:#2b2b2b;
  margin: 0 0 14px;
}

.ogtCatBizCard__meta{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color:#5b5b5b;
}

/* promo/ad */
.ogtCatBizCard--promo,
.ogtCatBizCard--ad{
  border-bottom: 0;
}

.ogtCatBizPromo{
  border-top: 1px solid #e6e6e6;
  padding-top: 14px;
}
.ogtCatBizPromo__title{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 22px;
  margin: 0 0 10px;
}
.ogtCatBizPromo__text{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.5;
  color:#2b2b2b;
  margin: 0 0 14px;
}
.ogtCatBizPromo__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 40px;
  padding: 0 14px;
  border: 1px solid #111;
  border-radius: 3px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 800;
  text-decoration:none;
}
.ogtCatBizPromo__btn:hover{ opacity:.75; }

.ogtCatBizAd{
  border-top: 1px solid #e6e6e6;
  padding-top: 14px;
}
.ogtCatBizAd__label{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  color:#666;
  text-align:right;
  margin-bottom: 10px;
}
.ogtCatBizAd__box{
  width:100%;
  aspect-ratio: 16 / 9;
  border: 1px solid #e6e6e6;
  background:#f7f7f7;
}
.ogtCatBizAd__title{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 800;
  margin-top: 12px;
}
.ogtCatBizAd__text{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color:#444;
  margin-top: 6px;
  font-size: 14px;
}

/* =========================================
   Responsive (tablet)
========================================= */
@media (max-width: 1180px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr 1.4fr 1fr;
  }
  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 860px){
  .ogtCatBizLead__grid{
    grid-template-columns: 1fr;
  }
  .ogtCatBizLead__title{
    font-size: 34px;
  }
  .ogtCatBizGrid__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* =========================================
   MOBILE (<=560px)
   ✅ Fix: order inconsistency + hierarchy
   - Lead: image -> title -> meta
   - List: horizontal thumb-left cards
========================================= */
@media (max-width: 560px){

  .ogtCatBiz__inner{
    padding: 14px 12px 40px;
  }

  /* --- Lead: BIG vertical --- */
  .ogtCatBizLead{ margin-bottom: 14px; }

  .ogtCatBizLead__grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  /* 画像→タイトル→メタで統一（リード側は縦） */
  .ogtCatBizLead__imgFrame{
    border: 1px solid #e6e6e6;
    overflow: hidden;
    background:#fff;
  }
  .ogtCatBizLead__img{
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }

  .ogtCatBizLead__title{
    font-size: 22px;
    line-height: 1.18;
    margin: 10px 0 6px;
    letter-spacing: -0.01em;
  }

  .ogtCatBizLead__dek{ display:none; }

  .ogtCatBizLead__meta{
    font-size: 12px;
    color:#6b6b6b;
  }

  /* 右カラムカードが出てきても「普通扱い」へ寄せる */
  .ogtCatBizRightCard{
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 12px;
  }
  .ogtCatBizRightCard__media{
    border: 1px solid #e6e6e6;
  }
  .ogtCatBizRightCard__img{
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }
  .ogtCatBizRightCard__title{
    font-size: 18px;
    line-height: 1.2;
    margin: 10px 0 6px;
  }
  .ogtCatBizRightCard__dek{ display:none; }
  .ogtCatBizRightCard__meta{
    font-size: 12px;
    color:#6b6b6b;
  }

  /* --- List: horizontal cards --- */
  .ogtCatBizGrid{
    padding-top: 10px;
    border-top: 0;
  }

  .ogtCatBizGrid__grid{
    grid-template-columns: 1fr;
    gap: 0; /* 区切り線で見せる */
  }

  /* ✅ 重要：記事の中の a を“gridコンテナ”にする（これで順番が絶対ブレない） */
  .ogtCatBizCard{
    border-bottom: 1px solid #eaeaea;
    padding: 12px 0;
  }

  /* テーマに左右されないよう、カード内の最初のリンクを強制レイアウト */
  .ogtCatBizCard > a,
  .ogtCatBizCard a.ogtCatBiz__link{
    display: grid;
    grid-template-columns: 92px 1fr; /* thumb | text */
    gap: 12px;
    align-items: start;
    width: 100%;
    min-width: 0;
    text-decoration: none;
  }

  /* thumb */
  .ogtCatBizCard__media{
    border: 0;
    overflow: hidden;
    background:#f3f3f3;
    width: 92px;
    height: 92px;          /* ← aspect-ratioじゃなく固定にして確実化 */
  }
  .ogtCatBizCard__img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* text area */
  .ogtCatBizCard__title{
    font-size: 16px;
    line-height: 1.25;
    margin: 2px 0 6px;
    font-weight: 800;
  }
  .ogtCatBizCard__dek{ display:none; }
  .ogtCatBizCard__meta{
    font-size: 12px;
    color:#6b6b6b;
  }

  /* ✅ 順番ブレ対策（HTML順がバラバラでも強制） */
  .ogtCatBizCard__media{ order: 0; }
  .ogtCatBizCard__title{ order: 1; }
  .ogtCatBizCard__meta{ order: 2; }
  .ogtCatBizCard__dek{ order: 3; }

  /* promo/ad は横カード化しない */
  .ogtCatBizCard--promo > a,
  .ogtCatBizCard--ad > a{
    display: block;
  }
	
.ogtCatBizLead__right {
    border-top: 2px solid #dddd;
    margin-top: 20px;
    padding-top: 30px;
}
	
.ogtCatBizLead__left{
    border-top: 2px solid #dddd;
    margin-top: 20px;
    padding-top: 30px;
}
	
.category {
    width: 96% !important;
    max-width: 100% !important;
}
	
}

/* extra small */
@media (max-width: 420px){
  .ogtCatBizLead__title{
    font-size: 20px;
  }
  .ogtCatBizCard > a,
  .ogtCatBizCard a.ogtCatBiz__link{
    grid-template-columns: 84px 1fr;
    gap: 10px;
  }
  .ogtCatBizCard__media{
    width: 84px;
    height: 84px;
  }
}

/* Full width section */
  .ogtHeroSplit{
    width: 100%;
    background: var(--ogt-bg);
  }

  /* Inner: keeps max width but section itself is 100% */
.ogtHeroSplit__inner {
    width: min(1200px, 100%);
    margin: 0 auto;
    padding: 18px 16px;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 24px;
    align-items: center;
    border-bottom: 1px solid #ddd;
    margin-top: 0px;
    margin-bottom: 30px;
    padding-bottom: 50px;
}

  /* Media card */
  .ogtHeroSplit__media{
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--ogt-line);
    background: #f3f4f6;
    /* ensures consistent height on desktop */
    aspect-ratio: 16 / 9;
  }

  .ogtHeroSplit__img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* Content */
  .ogtHeroSplit__content{
    color: var(--ogt-text);
    line-height: 1.75;
  }

  .ogtHeroSplit__title{
    margin: 0 0 12px;
    font-size: clamp(22px, 2.1vw, 34px);
    letter-spacing: -0.02em;
    font-weight: 800;
	  line-height: 1.3em;
  }

.ogtHeroSplit__text {
    margin: 0;
    font-size: 15px;
    color: var(--ogt-sub);
    line-height: 1.3em;
}

  /* ===== Mobile ===== */
  @media (max-width: 820px){
    .ogtHeroSplit__inner{
      grid-template-columns: 1fr;
      gap: 16px;
      padding: 14px 14px 18px;
    }

    .ogtHeroSplit__media{
      aspect-ratio: 4 / 3;
      border-radius: 16px;
    }

    .ogtHeroSplit__title{
      font-size: 22px;
    }

    .ogtHeroSplit__text{
      font-size: 14px;
    }
  }

.ogtBtnPrimary {
    display: block;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: 18px 24px;
    background-color: #16a34a;
    color: #ffffff;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none;
    border-radius: 999px;
    border: none;
    box-shadow: none;
    transition: background-color 0.18s ease;
    margin-top: 40px;
}

/* Hover */
.ogtBtnPrimary:hover{
  background-color: #22c55e; /* 少し薄く */
}

/* Active（押したとき） */
.ogtBtnPrimary:active{
  background-color: #15803d;
}

/* Mobile 微調整 */
@media (max-width: 640px){
  .ogtBtnPrimary{
    font-size: 16px;
    padding: 16px 20px;
  }
}

.notpage {
    margin: 30px auto;
    width: 92%;
}

.page404{
	margin-top: 20px;
}

.ogtPostAuthorMeta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 16px 0 24px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

.ogtPostAuthorMeta__avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.ogtPostAuthorMeta__text {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}

.ogtPostAuthorMeta__date {
  font-size: 13px;
  color: #666;
}

.ogtPostAuthorMeta__author a {
  font-size: 14px;
  font-weight: 600;
  color: #111;
  text-decoration: none;
}

.ogtPostAuthorMeta__author a:hover {
  text-decoration: underline;
}

/* Tag wrapper */
.ogtPostTags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin: 12px 0 20px;
}

/* Tag item */
.ogtPostTag {
  font-size: 13px;
  line-height: 1;
  padding: 6px 10px;
  border: 1px solid #ddd;
  border-radius: 999px;
  color: #111;
  text-decoration: none;
  background: #fff;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

/* Hover */
.ogtPostTag:hover {
  background: #f2f2f2;
	text-decoration: none !important;
}



/* Mobile optimization */
@media (max-width: 768px) {
  .ogtPostTags {
    gap: 6px 8px;
    margin: 10px 0 16px;
  }

  .ogtPostTag {
    font-size: 12px;
    padding: 5px 9px;
  }
}

/* ===== Shared idea: desktop stays same ===== */
/* Example: ogtLeadB__grid / ogtLeadA / ogtBlockC__top are "2-col" wrappers */

/* ---------- Lead B ---------- */
.ogtLeadB__grid{
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap:24px;
  align-items:start;
  grid-template-areas: "texts media";
}
.ogtLeadB__stack{ grid-area:texts; }
.ogtLeadB__media{ grid-area:media; }

/* Mobile: image first, then texts */
@media (max-width: 768px){
  .ogtLeadB__grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "texts";
    gap:14px;
  }
}

/* ---------- Lead A ---------- */
.ogtLeadA{
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap:24px;
  align-items:start;
  grid-template-areas: "texts media";
}
.ogtLeadA__texts{ grid-area:texts; }
.ogtLeadA__media{ grid-area:media; }

@media (max-width: 768px){
  .ogtLeadA{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "texts";
    gap:14px;
  }
}

/* ---------- Block C (Row 1) ---------- */
.ogtBlockC__top{
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap:24px;
  align-items:start;
  grid-template-areas: "list graphic";
}
.ogtBlockCList{ grid-area:list; }
.ogtBlockCGraphic{ grid-area:graphic; }

@media (max-width: 768px){
  .ogtBlockC__top{
    grid-template-columns:1fr;
    grid-template-areas:
      "graphic"
      "list";
    gap:14px;
  }
}

/* ===== Row 1 layout ===== */
.ogtBlockC__top{
  display:grid;
  grid-template-columns: 1fr 1fr; /* PC: left list, right image */
  gap: 24px;
  align-items:start;
}

/* keep normal order on PC */
.ogtBlockCList{ order: 1; }
.ogtBlockCGraphic{ order: 2; }

.ogtBlockCGraphic__img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}

/* ===== Mobile: image on top, list below ===== */
@media (max-width: 768px){
  .ogtBlockC__top{
    grid-template-columns: 1fr;  /* stack */
    gap: 16px;
  }

  /* swap order only on mobile */
  .ogtBlockCGraphic{ order: 1; }
  .ogtBlockCList{ order: 2; }
}

/* ===== Wide A (PC: Left | Hero | Right) ===== */
.ogtWideA__inner{
  display:grid;
  grid-template-columns: minmax(280px, 1fr) minmax(360px, 2fr) minmax(220px, 0.9fr);
  gap: 24px;
  align-items:start;
}

/* PC order (as-is) */
.ogtWideA__col--left{ order: 1; }
.ogtWideA__hero{ order: 2; }
.ogtWideA__col--right{ order: 3; }

/* Hero image */
.ogtWideA__heroImg{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}

/* Rules */
.ogtWideA__rule{
  height:1px;
  background: rgba(0,0,0,.12);
  margin: 18px 0;
}

/* Titles/deks (minimal; adjust to your theme) */
.ogtWideAItem{ display:block; text-decoration:none; color:inherit; }
.ogtWideAItem__title{ margin:0 0 8px; }
.ogtWideAItem__dek{ margin:0; opacity:.9; line-height:1.5; }
.ogtWideAItem--tight .ogtWideAItem__dek{ display:none; }

/* ===== Mobile: Hero (top) -> Left -> Right ===== */
@media (max-width: 768px){
  .ogtWideA__inner{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .ogtWideA__hero{ order: 1; }
  .ogtWideA__col--left{ order: 2; }
  .ogtWideA__col--right{ order: 3; }

  .ogtWideA__rule{ margin: 14px 0; }
}

/* ===== Simple single-image click gallery ===== */
.ogtGallery{
  width: 100%;
  max-width: 980px;
  margin: 18px auto 26px;
}

.ogtGallery__hit{
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  display: block;
  position: relative;
  cursor: pointer;
}

.ogtGallery__img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
  background: #f2f2f2;
}

.ogtGallery__hint{
  position: absolute;
left: 50px;
  bottom: 10px;
  font-size: 12px;
  letter-spacing: .06em;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  color: #111;
}

/* bottom bar */
.ogtGallery__bar{
  margin-top: -45px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ogtGallery__count{
  font-size: 12px;
  letter-spacing: .08em;
  color: #444;
}

.ogtGallery__controls{
  display: flex;
  gap: 8px;
}

.ogtGallery__btn{
  border: 1px solid rgba(0,0,0,.15);
  background: #fff;
  height: 34px;
  min-width: 40px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.ogtGallery__btn:hover{
  background: rgba(0,0,0,.04);
}

.ogtGallery-box{
	display: none;
}

.ogtShopSNS{
  display:flex;
  justify-content:center;
  gap:14px;
  margin-top:24px;
}

.ogtShopSNS__item{
  width:52px;
  height:52px;
  border-radius:999px;
  border:1px solid #e5e5e5;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .2s ease,border-color .2s ease;
}

.ogtShopSNS__item:hover{
  background:#f4f4f4;
  border-color:#ccc;
}

.ogtShopSNS__svg{
  width:22px;
  height:22px;
  fill:#333;
  display:block;
}

@media (max-width:640px){
  .ogtShopSNS{gap:12px;}
  .ogtShopSNS__item{width:46px;height:46px;}
  .ogtShopSNS__svg{width:20px;height:20px;}
}


.ogtShopSNS br{
	display: none;
}

.single-map {
  width: 100%;
  overflow: hidden;
  margin: 40px auto 60px auto;
}

.single-map-left {
    float: left;
    width: 50%;
}

.single-map-left iframe {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
}

.single-map-right {
    float: right;
    width: 46%;
    margin-top: 5px;
}

.single-map-right-name {
    margin: 0;
    font-size: 21px !important;
    margin-bottom: 0 !important;
    font-weight: bold;
}

.single-map-right-ul-1 {
  margin: 0 !important;
  overflow: hidden;
  padding-left: 0 !important;
}

.single-map-right-ul-2 {
    margin: 0;
}

.single-map-right-ul-3 {
    font-size: 16px;
}

.single-map-right-ul-4 {
    margin: 0;
}

.single-map-right-p-1 {
    margin: 20px 0 10px !important;
    font-size: 16px !important;
}

.single-map-right-p-2 {
    margin: 20px 0 20px !important;
    border-bottom: 1px solid #000;
    display: inline-block;
    font-weight: bold;
}

.single-map-right-ul-1 li {
    float: none;
    margin-bottom: 10px;
    line-height: 1.4em;
    font-size: 14px;
}


.single-map-right-name-1{
	color: #6f6f6f;
	margin-bottom: 20px !important;
	font-size: 13px !important;
}

.single-map-right-ul-1 a {
    text-decoration: none;
    background: none;
    padding: 5px 10px;
    display: inline-block;
    border-radius: 3px;
    border: 1px solid #828282;
    font-size: 0.6em;
}

.single-map-right-ul-2 span {
    padding: 6px 10px;
    margin-right: 5px;
    border-radius: 20px;
    color: #fff;
    font-size: 13px;
    position: relative;
    top: -2px;
    font-weight: bold;
    margin-left: 5px;
}

.single-map-right-ul-3 span {
    margin: 0;
    display: block;
    font-size: 11px;
    margin-top: 10px;
}


.button012{
	margin: 20px 0;
}

.button012 a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 240px;
    padding: 20px 25px 20px 50px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 600;
    background: #eee;
    border-radius: 50px;
    z-index: 0;
    overflow: hidden;
    text-decoration: none;
}
.button012 a:hover:after {
    width: 100%;
    z-index: -1;
}

.button014 {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 40px 0 25px 0;
}

.button014 a {
  width: 90%;
  max-width: 600px;
  padding: 25px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;

  background: #16a34a;        /* 邨ｱ荳�繧ｰ繝ｪ繝ｼ繝ｳ */
  color: #fff !important;
  font-size: 17px;
  font-weight: 700;
  border-radius: 999px;
  text-decoration: none;
  transition: 0.25s ease;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/* 繧｢繧､繧ｳ繝ｳ驛ｨ蛻�ｼ�ontAwesome蟇ｾ蠢懶ｼ� */
.button014 a .icon {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 18px;
}

/* 繝帙ヰ繝ｼ��C縺ｮ縺ｿ�� */
@media (min-width: 900px) {
  .button014 a:hover {
    background: #149043;      /* 蟆代＠縺 縺第ｿ�＞繧ｰ繝ｪ繝ｼ繝ｳ */
    transform: translateY(1px);
    box-shadow: 0 3px 12px rgba(0,0,0,0.12);
  }
	
.button014 a .icon {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.85em;
}
	
}


/* Make controls subtle on desktop hover, but visible on touch */
@media (hover:hover){
  .ogtGallery__controls{ opacity: .0; transition: opacity .2s ease; }
  .ogtGallery:hover .ogtGallery__controls{ opacity: 1; }
  .ogtGallery__hint{ opacity: .0; transition: opacity .2s ease; }
  .ogtGallery:hover .ogtGallery__hint{ opacity: 1; }
}

/* Focus style (keyboard accessibility) */
.ogtGallery__hit:focus-visible,
.ogtGallery__btn:focus-visible{
  outline: 2px solid #111;
  outline-offset: 3px;
}

/* ===== Reference Card (fixed) ===== */
.ogtRefCard,
.ogtRefCard *{
  box-sizing:border-box;
}

.ogtRefCard{
  margin:40px 0;
}

.ogtRefCard br{
	display: none;
}

.ogtRefCard p{
  display:none !important;
}

.ogtRefCard__link{
  position:relative;
  display:block;
  width:100%;
  max-width:100%;
  border:2px solid #e7e7e7;
  border-radius:34px;
  background:#fff;
  padding:32px 22px 22px 22px;
  text-decoration:none !important;
  color:#111 !important;
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

/* kill theme underline/link color */
.ogtRefCard__link,
.ogtRefCard__link:hover,
.ogtRefCard__link:visited,
.ogtRefCard__link:active{
  text-decoration:none !important;
  color:#111 !important;
}

.ogtRefCard__link:hover{
  border-color:#d5d5d5;
  background:#fafafa;
  transform: translateY(-1px);
}

.ogtRefCard__link:focus-visible{
  outline:3px solid #111;
  outline-offset:4px;
}

/* badge */
.ogtRefCard__badge{
  position:absolute;
  top:-16px;
  left:26px;
  background:#111;
  color:#fff;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  padding:8px 16px;
  border-radius:999px;
}

/* layout */
.ogtRefCard__inner{
  display:flex;
  gap:22px;
  align-items:center;
  max-width:100%;
}

/* thumb */
.ogtRefCard__thumb{
  width:112px;
  height:112px;
  flex:0 0 112px;
  border-radius:22px;
  overflow:hidden;
  background:#f1f1f1;
}

.ogtRefCard__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* IMPORTANT: allow text to shrink inside flex */
.ogtRefCard__body{
  min-width:0;
  flex:1;
}

/* title: wrap safely (no overflow) */
.ogtRefCard__title{
  margin:0;
  font-size:24px;
  line-height:1.18;
  font-weight:800;
  letter-spacing:-0.01em;

  /* safe wrapping */
  overflow-wrap:anywhere;
  word-break:break-word;

  /* clamp */
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* meta */
.ogtRefCard__meta{
  margin-top:10px;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#666;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.ogtRefCard__dot{ opacity:.6; }

/* chevron: MUST NOT affect layout */
.ogtRefCard__chev{
  position:absolute !important;
  right:18px;
  top:50%;
  transform: translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid #e5e5e5;
  display:flex !important;
  align-items:center;
  justify-content:center;
  font-size:26px;
  color:#111;
  background:#fff;
  z-index:2;
  pointer-events:none; /* prevents weird click layout issues */
}

/* ===== Mobile ===== */
@media (max-width: 640px){
  .ogtRefCard__link{
    padding:18px;
    border-radius:28px;
  }

  .ogtRefCard__badge{
    left:18px;
  }

  .ogtRefCard__inner{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }

  .ogtRefCard__thumb{
    width:100%;
    height:auto;
    flex:none;
    aspect-ratio:16/9;
    border-radius:18px;
  }

  .ogtRefCard__title{
    font-size:22px;
    -webkit-line-clamp:3;
  }

  .ogtRefCard__chev{
    display:none !important;
  }
}

/* ===== NAV FIX (strong override) ===== */
.ogtHeader .ogtNav.ogtNav--simple{
  display:block !important;
  padding: 12px 0 10px !important;
}

.ogtHeader .ogtNav.ogtNav--simple .ogtNavList{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:14px !important;

  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.ogtHeader .ogtNav.ogtNav--simple .ogtNavList__item{
  margin:0 !important;
  padding:0 !important;
}

.ogtHeader .ogtNav.ogtNav--simple .ogtNavList__link{
  display:inline-block !important;
  padding:8px 12px !important;
  border-radius:999px !important;

  text-decoration:none !important;
  color:inherit !important;

  border:1px solid transparent !important;
  transition: .15s ease !important;
}

.ogtHeader .ogtNav.ogtNav--simple .ogtNavList__link:hover{
  border-color: rgba(0,0,0,.15) !important;
  background: rgba(0,0,0,.03) !important;
}

/* ===== Mobile: horizontal scroll option (optional) ===== */
@media (max-width: 560px){
  .ogtHeader .ogtNav.ogtNav--simple .ogtNavList{
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    justify-content:flex-start !important;
    padding: 0 12px !important;
  }
  .ogtHeader .ogtNav.ogtNav--simple .ogtNavList__link{
    white-space:nowrap !important;
  }
}

.ogtNavList__item span {
  font-size: 8px;
  position: relative;
  top: -2px;
  margin-right: 5px;
}

/* =====================================================
   OGT SINGLE HEADER — Mobile Fix (override)
   - mobile: 3 columns (left / logo / right)
   - hide big search input, keep icon only
===================================================== */

/* まずスマホだけ上書き */
@media (max-width: 560px){

  /* 高さを安定させる */
  .ogtSHeader__inner{
    padding: 10px 12px;
    gap: 10px;
  }

  /* ✅ 重要：ロゴをabsolute解除して「中央カラム」に戻す */
  .ogtSHeader__logo{
    position: static;
    left: auto;
    top: auto;
    transform: none;
    z-index: auto;
    padding: 0;
    order: 2;

    /* 中央固定 */
    margin: 0 auto;
    min-width: 0;
  }

  .ogtSHeader__logo img{
    height: 26px;
  }

  /* 左：バーガー + 検索アイコンだけ */
  .ogtSHeader__burger{ order: 1; }

  .ogtSHeader__search{
    order: 1;
    flex: 0 0 auto;
    gap: 8px;
    min-width: auto;
  }

  /* ✅ スマホは検索入力を隠す（崩れ原因の本丸） */
  .ogtSHeader__searchInput{
    display: none;
  }

  /* ✅ GOボタンも不要なら非表示（検索アイコンで十分） */
  .ogtSHeader__go{
    display: none;
  }

  /* 右：国旗 */
  .ogtSHeader__right{
    order: 3;
    margin-left: 0;
  }

  .ogtSHeader__flag{
    width: 36px;
    height: 36px;
    border-radius: 8px;
  }

  .ogtSHeader__iconBtn{
    width: 34px;
    height: 34px;
    border-radius: 10px;
  }

  /* 固定ヘッダー分の余白も少し縮める */
  .ogtSMain{ padding-top: 56px; }
}


/* =====================================================
   Optional: ultra small phones
===================================================== */
@media (max-width: 390px){
  .ogtSHeader__inner{ padding: 9px 10px; }
  .ogtSHeader__logo img{ height: 24px; }
  .ogtSHeader__iconBtn{ width: 32px; height: 32px; }
  .ogtSHeader__flag{ width: 34px; height: 34px; }
  .ogtSMain{ padding-top: 54px; }
}

/* =====================================================
   FIX: logo overlap (mid-width)
   - turn off absolute logo earlier (<= 980px)
   - use 3-column layout so nothing overlaps
===================================================== */

@media (max-width: 980px){

  /* 3カラム化（左 / ロゴ / 右） */
  .ogtSHeader__inner{
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
  }

  /* ロゴ：absolute解除して中央へ */
  .ogtSHeader__logo{
    position: static;
    transform: none;
    padding: 0;
    justify-self: center;
    z-index: auto;
  }

  /* 左：検索は左寄せ＆伸びすぎない */
  .ogtSHeader__search{
    justify-self: start;
    max-width: 420px;
    min-width: 0;
  }
  .ogtSHeader__searchInput{
    max-width: 220px; /* ここで被りを止める */
    width: 100%;
  }

  /* 右：国旗は右寄せ */
  .ogtSHeader__right{
    justify-self: end;
    margin-left: 0;
  }
}

/* =====================================================
   MOBILE FIX: 2-row header (no overlap guaranteed)
===================================================== */

@media (max-width: 760px){

  /* 既存の absolute ロゴ中央固定を無効化して、2段グリッドへ */
  .ogtSHeader__inner{
    display: grid !important;
    grid-template-columns: 44px 1fr 44px;
    grid-template-areas:
      "burger logo right"
      "search search search";
    align-items: center;
    gap: 8px 10px;
    padding: 10px 12px 10px !important;
  }

  .ogtSHeader__burger{ grid-area: burger; }
  .ogtSHeader__logo{
    grid-area: logo;
    position: static !important;
    transform: none !important;
    justify-self: center;
    padding: 0 10px; /* ロゴ左右の余白 */
  }

  .ogtSHeader__right{
    grid-area: right;
    justify-self: end;
    margin-left: 0 !important;
  }

  /* 検索は2段目で100% */
  .ogtSHeader__search{
    grid-area: search;
    width: 100%;
    max-width: none !important;
    justify-self: stretch;
    margin-top: 2px;
  }

  .ogtSHeader__searchInput{
    max-width: none !important;
    width: 100% !important;
    height: 36px;
    font-size: 14px;
  }

  /* 検索ボタンは幅を固定して崩れ防止 */
  .ogtSHeader__go{
    height: 36px;
    padding: 0 12px;
    white-space: nowrap;
  }

  /* 国旗ボタンを少し小さめに */
  .ogtSHeader__flag{
    width: 40px;
    height: 40px;
  }

  /* ロゴ画像も小さめに */
  .ogtSHeader__logo img{
    height: 26px !important;
  }

  /* 固定ヘッダーの高さが増えるので余白も増やす */
  .ogtSMain{ padding-top: 104px !important; }
}

/* さらに小さい端末 */
@media (max-width: 420px){
  .ogtSHeader__inner{ padding: 10px 10px !important; }
  .ogtSHeader__logo{ padding: 0 6px; }
  .ogtSHeader__go{ padding: 0 10px; }
}

/* =====================================================
   OGT SINGLE HEADER - Mobile Fix (2-row layout)
   - Row1: burger / centered logo / JP flag
   - Row2: full-width search
   - Fix overlap + full hide on scroll
===================================================== */

/* header height variables */
:root{
  --ogtSHeaderH: 62px;     /* desktop header height */
  --ogtSHeaderH-m: 108px;  /* mobile header total height (2 rows) */
}

/* base header */
.ogtSHeader{
  position: fixed;
  top: 0; left: 0; right: 0;
  background:#fff;
  z-index: 10000;
  border-bottom: 1px solid #e6e6e6;
  transform: translateY(0);
  transition: transform .22s ease;
}

/* ✅ make sure it hides 100% */
.ogtSHeader.is-hidden{
  transform: translateY(calc(var(--ogtSHeaderH) * -1));
}

/* desktop padding */
.ogtSMain{ padding-top: var(--ogtSHeaderH); }

/* inner */
.ogtSHeader__inner{
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding: 10px 18px;
  display:flex;
  align-items:center;
  gap: 12px;
}

/* LEFT */
.ogtSHeader__burger{ flex: 0 0 auto; }

/* SEARCH (desktop) */
.ogtSHeader__search{
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  gap: 8px;
  min-width: 0;
}
.ogtSHeader__searchInput{
  height: 34px;
  width: 100%;
  max-width: 180px;
  min-width: 0;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 14px;
  outline: none;
}
.ogtSHeader__go{
  height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 2px;
  background: #8fa5bb;
  color:#111;
  font-weight: 800;
  cursor:pointer;
}

/* RIGHT */
.ogtSHeader__right{
  flex: 0 0 auto;
  display:flex;
  justify-content:flex-end;
  margin-left: auto;
}
.ogtSHeader__flag{
  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 2px;
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

/* LOGO (desktop: absolute center) */
.ogtSHeader__logo{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0 10px; /* ✅ logo左右に少し余白 */
  z-index: 2;
}
.ogtSHeader__logo img{
  height: 34px;
  width: auto;
  display:block;
}

/* icon buttons */
.ogtSHeader__iconBtn{
  width: 34px;
  height: 34px;
  border: 1px solid #e6e6e6;
  background:#fff;
  border-radius: 8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}
.ogtSHeader__burgerLines{
  width: 18px;
  height: 2px;
  background:#111;
  position: relative;
  display:block;
}
.ogtSHeader__burgerLines::before,
.ogtSHeader__burgerLines::after{
  content:"";
  position:absolute;
  left:0;
  width: 18px;
  height: 2px;
  background:#111;
}
.ogtSHeader__burgerLines::before{ top:-6px; }
.ogtSHeader__burgerLines::after{ top: 6px; }

.ogtSHeader__svg{ width:18px; height:18px; color:#5b6772; }

/* JP flag */
.ogtSHeader__jpFlag{
  width: 38px;
  height: 30px;
  background:#fff;
  border: 1px solid #dcdcdc;
  position: relative;
  display:block;
}
.ogtSHeader__jpFlag::after{
  content:"";
  position:absolute;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background:#bc002d;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
}

/* =====================================================
   ✅ MOBILE: switch to 2-row header
   - prevent overlap completely
===================================================== */
@media (max-width: 720px){

  /* total header height becomes 2 rows */
  .ogtSMain{ padding-top: var(--ogtSHeaderH-m); }

  /* hide amount must match mobile total height */
  .ogtSHeader.is-hidden{
    transform: translateY(calc(var(--ogtSHeaderH-m) * -1));
  }

  /* make inner wrap to two rows */
  .ogtSHeader__inner{
    padding: 10px 12px;
    display:flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
  }

  /* Row 1 layout */
  .ogtSHeader__burger{ order: 1; }
  .ogtSHeader__right{ order: 3; margin-left: 0; }

  /* ✅ logo should NOT be absolute on mobile (this fixes overlap) */
  .ogtSHeader__logo{
    order: 2;
    position: static;
    left: auto; top: auto;
    transform: none;
    margin: 0 auto;       /* center */
    padding: 0 12px;      /* ✅ logo左右余白 */
  }
  .ogtSHeader__logo img{
    height: 30px;
  }

  /* Row 2: search full width */
  .ogtSHeader__search{
    order: 4;
    width: 100%;
    flex: 0 0 100%;
    margin: 0;
    gap: 8px;
  }

  .ogtSHeader__searchInput{
    max-width: none;
    width: 100%;
    height: 36px;
    border-radius: 10px;
  }

  /* search button (icon) */
  .ogtSHeader__go{
    height: 36px;
    padding: 0 10px;
    border-radius: 10px;
    flex: 0 0 auto;
  }

  .ogtSHeader__iconBtn{
    width: 36px;
    height: 36px;
    border-radius: 10px;
  }

  .ogtSHeader__flag{
    width: 44px;
    height: 44px;
  }
}

/* even smaller */
@media (max-width: 420px){
  .ogtSHeader__logo img{ height: 28px; }
  .ogtSHeader__inner{ padding: 10px 10px; }
}


.ogtNewsCol__img{
  width: 100%;
  aspect-ratio: 4 / 3;   /* 比率固定 */
  height: auto;
  object-fit: cover;
  display: block;
}

/* =========================
   Latest List (with category & tags)
========================= */
.ogtLatestList {
    margin: 22px 0;
    border-top: 3px solid #e6e6e6;
    padding-top: 20px;
}

.ogtLatestList__label{
  font-weight:800;
  font-size:14px;
  letter-spacing:.08em;
  margin-bottom:20px;
}

.ogtLatestList__list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.ogtLatestItem{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;

  padding:16px 18px;
  border:1px solid #e6e6e6;
  border-radius:18px;
  background:#fff;
  text-decoration:none;
  color:inherit;
}

.ogtLatestItem:hover{
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  transform:translateY(-1px);
}

.ogtLatestItem__main{
  min-width:0;
}

/* カテゴリ（軽く目立たせる） */
.ogtLatestItem__cat{
  font-size:12px;
  font-weight:800;
  letter-spacing:.12em;
  color:#111;
  margin-bottom:6px;
}

/* タイトル */
.ogtLatestItem__title{
  margin:0;
  font-size:18px;
  line-height:1.25;
  font-weight:900;
}

/* メタ行 */
.ogtLatestItem__meta{
  margin-top:10px;
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

/* 読了時間 */
.ogtLatestItem__time{
  font-size:12px;
  letter-spacing:.18em;
  font-weight:800;
  color:#9aa0a6;
  text-transform:uppercase;
}

/* タグ（目立たせない） */
.ogtLatestItem__tags{
  display:flex;
  gap:8px;
  font-size:11px;
  color:#b0b5bb;
}

.ogtLatestItem__tags span{
  white-space:nowrap;
}

/* 右矢印 */
.ogtLatestItem__chev{
  font-size:28px;
  opacity:.7;
}

/* Mobile */
@media (max-width:560px){
  .ogtLatestItem{
    padding:14px;
    border-radius:16px;
  }
  .ogtLatestItem__title{
    font-size:16px;
  }
}


/* =========================
   OGX Latest Rail (Unique)
========================= */

.ogx-latestRail {
  width: 100%;
  max-width: 1360px;
  margin: 0 auto;
  padding: 8px 0 18px;
  margin-top: 30px;
}

/* 見出し行 */
.ogx-latestRail__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.ogx-latestRail__title{
  margin:0;
  font-size: 18px;
  font-weight: 800;
  color:#111;
}

.ogx-latestRail__more{
  appearance:none;
  border:1px solid #d9d9dd;
  background:#fff;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor:pointer;
}

/* レール本体 */
.ogx-latestRail__wrap{
  position: relative;
}

/* “一部非表示”の肝：overflow hidden */
.ogx-latestRail__viewport{
  overflow: hidden;
  border-radius: 14px;
  outline: none;
}

/* トラック：横並び */
.ogx-latestRail__track{
  display: flex;
  gap: 26px;
  align-items: stretch;
  padding: 8px 8px 18px;
  margin: 10px 0;
  scroll-behavior: smooth;

  overflow-x: auto;           /* 実際のスクロールはここ */
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;      /* Firefox */
}
.ogx-latestRail__track::-webkit-scrollbar{ display:none; }

/* カード */
.ogx-latestCard{
  flex: 0 0 320px;            /* 見切れを作りやすい固定幅 */
  background:#fff;
  border-radius: 14px;
  box-shadow: 0 12px 26px rgba(0,0,0,.10);
  overflow: hidden;
}

/* サムネ */
.ogx-latestCard__thumb{
  position: relative;
  background:#f2f2f2;
}
.ogx-latestCard__img {
  width: 100% !important;
  height: 210px !important;
  object-fit: cover;
  display: block !important;
  margin: 0 !important;
}

/* 本文 */
.ogx-latestCard__body{
  padding: 14px 16px 16px;
}

.ogx-latestCard__headline{
  margin: 25px 0 0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
  color:#111;
}

/* 日付/タグ：ボタン型（リンク不要） */
.ogx-latestChip{
  appearance: none;
  border: 1px solid #e5e5ea;
  background: #f6f6f8;
  color: #111;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
}

.ogx-latestChip--date{
  border-color: #ff3b30;
  color: #ff3b30;
  background: #fff;
}

/* 右側トグル */
.ogx-latestCard__row{
  display:flex;
  justify-content:flex-end;
  margin-top: 20px;
}

.ogx-latestCard__toggle{
  appearance:none;
  border: 1px solid #d9d9dd;
  background:#fff;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  gap: 8px;
}

.ogx-latestCard__chev{
  display:inline-block;
  transition: transform .18s ease;
}
.ogx-latestCard__toggle[aria-expanded="true"] .ogx-latestCard__chev{
  transform: rotate(90deg);
}

/* 隠しタグ */
.ogx-latestCard__hidden{
  margin-top: 12px;
}
.ogx-latestCard__tags{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid #eeeef2;
}

/* =========================
   Hoverで矢印表示（PREDGEっぽい）
   - 重要：wrap hover / wrap focus-within / viewport focus-within で出す
   - z-index を上げる（フェードより前）
========================= */
.ogx-latestRail__arrow{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 72px;
  height: 72px;
  border-radius: 999px;
  border: none;
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 34px rgba(0,0,0,.18);
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;

  z-index: 20;              /* ← フェードより上 */
  opacity: 0;               /* 初期は隠す */
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease;
}

.ogx-latestRail__arrowIcon{
  font-size: 34px;
  line-height: 1;
  color:#111;
}

.ogx-latestRail__arrow--right{ right: -6px; }
.ogx-latestRail__arrow--left{ left: -6px; }

/* ✅表示トリガ（ここが修正ポイント） */
.ogx-latestRail__wrap:hover .ogx-latestRail__arrow,
.ogx-latestRail__wrap:focus-within .ogx-latestRail__arrow,
.ogx-latestRail__viewport:focus-within ~ .ogx-latestRail__arrow{
  opacity: 1;
  pointer-events: auto;
}

/* hover時の微移動（見た目だけ） */
.ogx-latestRail__wrap:hover .ogx-latestRail__arrow--right,
.ogx-latestRail__wrap:focus-within .ogx-latestRail__arrow--right{
  transform: translateY(-50%) translateX(-2px);
}
.ogx-latestRail__wrap:hover .ogx-latestRail__arrow--left,
.ogx-latestRail__wrap:focus-within .ogx-latestRail__arrow--left{
  transform: translateY(-50%) translateX(2px);
}

/* =========================
   見切れ感を出すフェード
   - クリックを邪魔しない
   - z-indexは矢印より下
========================= */
.ogx-latestRail__fade{
  position:absolute;
  top: 0;
  bottom: 0;
  width: 90px;
  pointer-events:none;
  opacity: .95;
  z-index: 5;
}
.ogx-latestRail__fade--right{
  right: 0;
  background: linear-gradient(to right, rgba(255,255,255,0), rgba(245,245,245,1));
}
.ogx-latestRail__fade--left{
  left: 0;
  background: linear-gradient(to left, rgba(255,255,255,0), rgba(245,245,245,1));
  opacity: 0; /* 初期は左フェード薄め（必要なら1に） */
}

/* =========================
   Mobile
   - タッチ環境は hover が効かないので、
     「ホバーできない端末では矢印を常時表示」に寄せる
========================= */
@media (max-width: 768px){
  .ogx-latestRail{
    padding: 6px 0 14px;
  }

  .ogx-latestRail__track{
    gap: 16px;
    padding: 6px 6px 14px;
  }

  .ogx-latestCard{
    flex-basis: 270px;
  }

  .ogx-latestCard__img{
    height: 170px;
  }

  .ogx-latestRail__fade{
    width: 60px;
  }
}

/* ✅hoverできない端末（スマホ/タブレット）は矢印を表示する */
@media (hover: none){
  .ogx-latestRail__arrow{
    opacity: 1;
    pointer-events: auto;
  }
}

.ogtGallery__hint1{
	left: 10px !important;
}

/* =========================
   Split Layout (Left feature + Right list)
   - Desktop: 2 columns
   - Mobile: stacked
========================= */

.ogtSplit{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 14px;
  color: #111;
}

.ogtSplit__grid{
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 26px;
  align-items: start;
}

/* ===== LEFT FEATURE ===== */
.ogtSplitFeature{
  display: grid;
  grid-template-rows: auto auto;
  gap: 12px;
}

.ogtSplitFeature__media{
  display: block;
  text-decoration: none;
}

/* 画像枠（実画像に差し替えるなら background ではなく img にしてOK） */
.ogtSplitFeature__img{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 4px;
  background: linear-gradient(135deg, #dcdcdc, #cfcfcf);
  border: 1px solid #e5e5e5;
}

.ogtSplitFeature__body{
  display: grid;
  gap: 10px;
}

.ogtSplitFeature__title{
  margin: 0;
  font-size: 34px;
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: .02em;
}

.ogtSplitFeature__title a{
  color: inherit;
  text-decoration: none;
}

.ogtSplitFeature__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.ogtSplitChip{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: #bdbdbd;
  display: inline-block;
}

.ogtSplitFeature__dek{
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  letter-spacing: .02em;
  color: #222;
}

/* ===== RIGHT LIST ===== */
.ogtSplitList{
  border-left: 0;
}

.ogtSplitRow{
  border-bottom: 1px solid #e6e6e6;
  padding: 18px 0;
}

.ogtSplitRow:first-child{
  padding-top: 0;
}

.ogtSplitRow__link{
  display: block;
  text-decoration: none;
  color: inherit;
}

.ogtSplitRow__title{
  margin: 0 0 6px;
  font-size: 30px;
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: .02em;
}

.ogtSplitRow__dek{
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  color: #222;
}

/* hover */
.ogtSplitRow__link:hover .ogtSplitRow__title,
.ogtSplitFeature__title a:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* =========================
   Mobile
========================= */
@media (max-width: 820px){
  .ogtSplit__grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ogtSplitFeature__title,
  .ogtSplitRow__title{
    font-size: 26px;
  }

  .ogtSplitFeature__dek,
  .ogtSplitRow__dek{
    font-size: 16px;
  }

  .ogtSplitChip{
    width: 34px;
    height: 34px;
  }

  .ogtSplitRow{
    padding: 14px 0;
  }
}

@media (max-width: 420px){
  .ogtSplitFeature__title,
  .ogtSplitRow__title{
    font-size: 22px;
  }
}

/* =========================
   ogtSplit：見出しの下線を完全に無効化
========================= */

/* タイトル自体 */
.ogtSplit h1,
.ogtSplit h2,
.ogtSplit h3,
.ogtSplit h4{
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* タイトル内リンク */
.ogtSplit h1 a,
.ogtSplit h2 a,
.ogtSplit h3 a,
.ogtSplit h4 a{
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* hover時も完全に消す */
.ogtSplit a:hover{
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* =========================
   No-JS Tabs (Radio)
========================= */
.ogNoJsTabs{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 14px;
  color:#111;
}

/* hide radios but keep accessible */
.ogNoJsTabs__radio{
  position:absolute;
  left:-9999px;
}

/* tabs */
.ogNoJsTabs__tabs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  border-bottom:1px solid #e6e6e6;
  padding-bottom:10px;
  margin-bottom:14px;
}

.ogNoJsTabs__tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 20px 162px;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    background: #f7f7f7;
    font-weight: 800;
    font-size: 16px;
    cursor: pointer;
    user-select: none;
    line-height: 1;
    transition: background .15s ease, transform .15s ease, border-color .15s ease;
}

.ogNoJsTabs__tab:hover{
  background:#efefef;
}

/* panels default hidden */
.ogNoJsTabs__panel{
  display:none;
}

/* show active panel */
#ogNoJsTab-news:checked  ~ .ogNoJsTabs__panels #ogNoJsPanel-news{ display:block; }
#ogNoJsTab-strain:checked~ .ogNoJsTabs__panels #ogNoJsPanel-strain{ display:block; }
#ogNoJsTab-review:checked~ .ogNoJsTabs__panels #ogNoJsPanel-review{ display:block; }

/* active tab style */
#ogNoJsTab-news:checked  ~ .ogNoJsTabs__tabs label[for="ogNoJsTab-news"],
#ogNoJsTab-strain:checked~ .ogNoJsTabs__tabs label[for="ogNoJsTab-strain"],
#ogNoJsTab-review:checked~ .ogNoJsTabs__tabs label[for="ogNoJsTab-review"]{
  background:#111;
  color:#fff;
  border-color:#111;
}

/* keyboard focus */
.ogNoJsTabs__tab:focus{
  outline:2px solid #111;
  outline-offset:2px;
}

/* =========================
   Your existing grid styles (minimum)
   ※もし既に別で持ってるならここは不要
========================= */
.ogTabGrid__top{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:16px;
  align-items:start;
  margin-bottom:16px;
}

.ogTabGrid__listItem{
  display:block;
  color:inherit;
  text-decoration:none;
  padding:10px 0;
}

.ogTabGrid__listTitle{
  margin:0 0 6px;
  font-size:18px;
  font-weight:900;
  line-height:1.1;
}

.ogTabGrid__listDek{
  margin:0;
  color:#444;
  font-size:14px;
  line-height:1.5;
}

.ogTabGrid__rule{
  height:1px;
  background:#e6e6e6;
}

.ogTabGrid__hero{
  display:block;
  text-decoration:none;
}

.ogTabGrid__heroBox{
  width:100%;
  aspect-ratio: 16/10;
  border:1px solid #e6e6e6;
  border-radius:10px;
  background: linear-gradient(135deg,#ddd,#cfcfcf);
}

.ogTabGrid__grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:14px;
}

.ogTabGrid__card{
  display:block;
  color:inherit;
  text-decoration:none;
  border-radius:14px;
  padding:12px;
  background:#fff;
}

.ogTabGrid__thumb{
  width:100%;
  aspect-ratio: 16/10;
  border-radius:10px;
  background: linear-gradient(135deg,#ddd,#cfcfcf);
  margin-bottom:10px;
}

.ogTabGrid__cardTitle{
  margin:0 0 6px;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
}

.ogTabGrid__cardDek{
  margin:0;
  color:#444;
  font-size:13px;
  line-height:1.5;
}

/* =========================
   Mobile
========================= */
@media (max-width: 900px){
  .ogTabGrid__top{
    grid-template-columns: 1fr;
  }
  .ogTabGrid__grid{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px){
  .ogNoJsTabs__tabs{
    gap:8px;
  }
  .ogNoJsTabs__tab{
    padding:9px 12px;
    font-size:13px;
  }
  .ogTabGrid__grid{
    grid-template-columns: 1fr;
  }
}

/* =========================
   CSS Tabs (NO JS) - TAB UI like screenshot
========================= */

.ogCssTabs{
  max-width: 1180px;
  margin: 0 auto;
  padding: 20px 14px;
}

/* ----- Tabs row (rail) ----- */
.ogCssTabs__tabs{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-bottom: 4px solid #bdbdbd; /* レール */
  background: #d9d9d9;            /* 余白部分の下地 */
}

/* hide radio */
.ogCssTabs__tabs input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* tab (label) */
.ogCssTabs__tabs label{
  display: flex;
  align-items: center;
  justify-content: center;

  height: 66px;                 /* でかいタブ感 */
  background: #d9d9d9;          /* 非アクティブ */
  color: #5a5a5a;
  font-weight: 800;
  font-size: 22px;
  letter-spacing: .02em;

  border-right: 1px solid rgba(0,0,0,.08);
  cursor: pointer;
  user-select: none;

  /* “ボタン感”を消す */
  border-radius: 0;
  box-shadow: none;
  transition: background .15s ease, color .15s ease;
}

.ogCssTabs__tabs label:last-of-type{
  border-right: 0;
}

/* active tab */
#tab-news:checked  + label,
#tab-strain:checked + label,
#tab-review:checked + label{
  background: #7a7a7a;   /* アクティブ濃いグレー */
  color: #fff;
}

/* ----- Panels ----- */
.ogCssTabs__panels{
  padding-top: 26px;
}

.ogCssTabs__panel{
  display: none;
}

#tab-news:checked ~ .ogCssTabs__panels .panel-news{ display:block; }
#tab-strain:checked ~ .ogCssTabs__panels .panel-strain{ display:block; }
#tab-review:checked ~ .ogCssTabs__panels .panel-review{ display:block; }

/* panel sample typography (任意) */
.ogCssTabs__panel h3{
  margin: 0 0 10px;
  font-size: 28px;
  font-weight: 900;
}
.ogCssTabs__panel p{
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
}

/* =========================
   Responsive
========================= */
@media (max-width: 800px){
  .ogCssTabs__tabs label{
    height: 54px;
    font-size: 18px;
  }
}

@media (max-width: 520px){
  .ogCssTabs{
    padding: 16px 12px;
  }
  .ogCssTabs__tabs label{
    height: 48px;
    font-size: 16px;
    font-weight: 800;
  }
}

/* =========================
   OG Tab Grid (Panel)
   - Desktop: left list + right hero
   - Mobile: hero on top, list under
========================= */

.ogTabGrid__top{
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 22px;
  align-items:start;
  margin-top: 14px;
}

.ogTabGrid__list{
  display:flex;
  flex-direction:column;
  gap: 16px;
  min-width: 0;
}

.ogTabGrid__listItem{
  display:block;
  color: inherit;
  text-decoration:none;
}

.ogTabGrid__listTitle{
  margin:0 0 8px;
  font-size: 24px;
  line-height:1.08;
  font-weight: 900;
  letter-spacing: .01em;
}

.ogTabGrid__listDek {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    color: #444;
}

.ogTabGrid__rule{
  height:1px;
  background:#e6e6e6;
  width:100%;
}

.ogTabGrid__hero{
  display:block;
  color:inherit;
  text-decoration:none;
  min-width:0;
}

.ogTabGrid__heroBox{
  width:100%;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow:hidden;
  background:#e7e7e7;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
}

.ogTabGrid__heroBox img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Grid (3rd post and after) */
.ogTabGrid__grid{
  margin-top: 26px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 22px;
}

.ogTabGrid__card{
  display:block;
  text-decoration:none;
  color:inherit;
  min-width:0;
}

.ogTabGrid__thumb{
  width:100%;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow:hidden;
  background:#e7e7e7;
  margin-bottom: 10px;
}

.ogTabGrid__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.ogTabGrid__cardTitle{
  margin:0 0 8px;
  font-size: 18px;
  line-height:1.25;
  font-weight: 800;
  letter-spacing:.01em;
}

.ogTabGrid__cardDek{
  margin:0;
  font-size: 14px;
  line-height:1.6;
  color:#555;
}

/* Hover */
.ogTabGrid__listItem:hover .ogTabGrid__listTitle,
.ogTabGrid__card:hover .ogTabGrid__cardTitle{
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .ogTabGrid__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .ogTabGrid__listTitle{ font-size: 28px; }
  .ogTabGrid__listDek{ font-size: 16px; }
}

@media (max-width: 760px){
  /* mobile: hero on top */
  .ogTabGrid__top{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .ogTabGrid__hero{ order: -1; }
  .ogTabGrid__listTitle{ font-size: 24px; }
  .ogTabGrid__listDek{ font-size: 15px; }
  .ogTabGrid__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
}

@media (max-width: 420px){
  .ogTabGrid__grid{ grid-template-columns: 1fr; }
}

.ogTabGrid__hero img{
	width: 100%;
	height: auto;
}

/* =========================
  SNS Circle Buttons
  - clean, like your screenshot
========================= */

.ogSnsDock{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 2px;
}

.ogSnsBtn{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 2px solid #e5e5e5;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  line-height: 0;
  -webkit-tap-highlight-color: transparent;
}

.ogSnsIco{
  width: 22px;
  height: 22px;
  fill: currentColor;
}

/* hover / focus */
.ogSnsBtn:hover{
  border-color: #cfcfcf;
  transform: translateY(-1px);
}

.ogSnsBtn:focus-visible{
  outline: 3px solid rgba(0,0,0,.22);
  outline-offset: 3px;
}

/* active press */
.ogSnsBtn:active{
  transform: translateY(0);
}

/* ============ mobile tweaks ============ */
@media (max-width: 560px){
  .ogSnsDock{
    gap: 10px;
  }
  .ogSnsBtn{
    width: 42px;
    height: 42px;
  }
  .ogSnsIco{
    width: 20px;
    height: 20px;
  }
}

/* ===== optional: make it stick at top (if you want) =====
   add class="ogSnsDock ogSnsDock--fixed" to nav
*/
.ogSnsDock--fixed{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #efefef;
  padding: 10px 14px;
}


/* =========================
  Strain Specs – OGT clean style
========================= */

.ogStrainSpecs{
  max-width: 1180px;
  margin: 0 auto;
  padding: 22px 14px;
  color: #111;
}

.ogStrainSpecs__inner{
  border: 2px solid #e7e7e7;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}

/* ===== Desktop header ===== */
.ogStrainSpecs__head{
  display: grid;
  grid-template-columns: 1.2fr .9fr 2.2fr 1.2fr;
  background: #fafafa;
  border-bottom: 2px solid #e7e7e7;
}

.ogStrainSpecs__hCell{
  padding: 18px 18px;
  font-weight: 800;
  letter-spacing: .02em;
  font-size: 14px;
  text-transform: none;
  border-right: 2px solid #e7e7e7;
}

.ogStrainSpecs__hCell:last-child{ border-right: 0; }

/* ===== Rows ===== */
.ogStrainSpecs__row{
  display: grid;
  grid-template-columns: 1.2fr .9fr 2.2fr 1.2fr;
  border-bottom: 2px solid #ededed;
}

.ogStrainSpecs__row:last-child{ border-bottom: 0; }

.ogStrainSpecs__cell{
  padding: 18px 18px;
  border-right: 2px solid #ededed;
  display: flex;
  align-items: center;
  min-height: 150px;
}

.ogStrainSpecs__cell:last-child{ border-right: 0; }

/* Name */
.ogStrainSpecs__name{
  margin: 0;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .01em;
  line-height: 1.15;
}

/* Ratio */
.ogStrainSpecs__ratio{
  width: 100%;
  text-align: center;
  display: grid;
  gap: 6px;
}

.ogStrainSpecs__pct{
  font-weight: 900;
  font-size: 22px;
  line-height: 1.1;
}

.ogStrainSpecs__mix{
  font-weight: 800;
  color: #666;
  font-size: 14px;
}

/* Description */
.ogStrainSpecs__desc{
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: #1b1b1b;
}

/* Chips */
.ogStrainSpecs__chips{
  width: 100%;
  display: grid;
  gap: 10px;
  justify-items: center;
}

.ogStrainSpecs__chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid #bdbdbd;
  background: #bdbdbd;
  color: #fff;
  font-weight: 900;
  letter-spacing: .02em;
  font-size: 13px;
  min-width: 140px;
  text-align: center;
}

/* =========================
  Mobile (stacked cards)
========================= */
@media (max-width: 860px){
  .ogStrainSpecs__head{
    display: none;
  }

  .ogStrainSpecs__row{
    grid-template-columns: 1fr;
    padding: 0;
  }

  .ogStrainSpecs__cell{
    border-right: 0;
    min-height: auto;
    align-items: flex-start;
    padding: 14px 14px;
    border-bottom: 1px solid #ededed;
  }

  .ogStrainSpecs__row .ogStrainSpecs__cell:last-child{
    border-bottom: 0;
  }

  /* show labels on mobile */
  .ogStrainSpecs__cell::before{
    content: attr(data-label);
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    color: #777;
    margin-bottom: 8px;
    text-transform: uppercase;
  }

  .ogStrainSpecs__name{
    font-size: 20px;
  }

  .ogStrainSpecs__ratio{
    text-align: left;
    justify-items: start;
  }

  .ogStrainSpecs__pct{
    font-size: 20px;
  }

  .ogStrainSpecs__desc{
    font-size: 14px;
    line-height: 1.75;
  }

  .ogStrainSpecs__chips{
    justify-items: start;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ogStrainSpecs__chip{
    min-width: 0;
    width: 100%;
    padding: 10px 10px;
    font-size: 12px;
  }
}

@media (max-width: 420px){
  .ogStrainSpecs__chips{
    grid-template-columns: 1fr;
  }
}

.google-review-btn{
  margin-top: 16px;
}

.google-review-btn a {
    display: inline-block;
    padding: 15px 60px;
    font-size: 14px;
    font-weight: 500;
    color: #111;
    text-decoration: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
}

.google-review-btn a:hover{
  background: #f5f5f5;
}

/* スマホ */
@media (max-width: 640px){
  .google-review-btn a{
    width: 100%;
    text-align: center;
    padding: 12px 16px;
  }
}

.google-review-btn{
  margin-top: 16px;
}

.google-review-btn__link{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 10px 16px;
  font-size: 14px;
  font-weight: 500;
  color: #111;
  text-decoration: none;

  border: 1px solid #ccc;
  border-radius: 4px;
  background: #fff;
}

.google-review-btn__icon{
  display: inline-flex;
  line-height: 0;
}

.google-review-btn__link:hover{
  background: #f5f5f5;
}

.google-review-btn__text {
    position: relative;
    top: -3px;
}

/* mobile */
@media (max-width: 640px){
  .google-review-btn__link{
    width: 100%;
    justify-content: center;
    padding: 12px 16px;
  }
}

/* =========================
   Place Table
========================= */
.ogtPlaceTable{
  margin: 32px 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ogtPlaceTable__inner{
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
}

/* Row */
.ogtPlaceTable__row{
  display: grid;
  grid-template-columns: 2fr 1fr 1.2fr 1.2fr;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-top: 1px solid #e5e5e5;
}

.ogtPlaceTable__row:first-child{
  border-top: none;
}

/* Header */
.ogtPlaceTable__row--head{
  background: #f6f6f6;
  font-size: 13px;
  font-weight: 600;
  color: #555;
}

/* Cells */
.ogtPlaceTable__name{
  font-weight: 600;
}

.ogtPlaceTable__area{
  font-size: 14px;
  color: #444;
}

.ogtPlaceTable__action{
  display: flex;
}

/* Button */
.ogtPlaceBtn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  color: #111;

  border: 1px solid #ccc;
  border-radius: 20px;
  background: #fff;
  white-space: nowrap;
}

.ogtPlaceBtn:hover{
  background: #f2f2f2;
}

.ogtPlaceBtn--map{
  border-color: #bbb;
}

/* =========================
   Mobile (Card style)
========================= */
@media (max-width: 640px){
  .ogtPlaceTable__row{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ogtPlaceTable__row--head{
    display: none;
  }

  .ogtPlaceTable__row{
    padding: 16px;
  }

  .ogtPlaceTable__name{
    font-size: 16px;
  }

  .ogtPlaceTable__area{
    font-size: 13px;
    color: #666;
  }

  .ogtPlaceTable__action{
    gap: 8px;
  }
}











@media (max-width: 560px){
	
	.ogtHeader__inner{
		width: 100%;
		max-width: 100%;
	}
	
	.ogtHomeLead__inner{
		width: 100%;
		max-width: 100%;
	}
	
    .single-map {
        width: 100%;
        overflow: hidden;
        margin: 3% auto;
    }

    .single-map-left {
        float: none;
        width: 100%;
    }

    .single-map-right {
        float: none;
        width: 100%;
        margin-top: 2%;
    }

    .single-map-right-name {
        margin: 0;
        font-size: 1.1em !important;
        margin-bottom: 10px !important;
        font-weight: bold;
    }

    .single-map-right-ul-1 {
        margin: 0;
        overflow: hidden;
    }

    .single-map-right-ul-2 {
        margin: 0;
    }

    .single-map-right-ul-3 {
        font-size: .8em !important;
        line-height: 1.3em;
    }

    .single-map-right-ul-4 {
        margin: 0;
    }

    .single-map-right-p-1 {
        margin: 20px 0 10px !important;
        font-size: .9em !important;
    }

    .single-map-right-p-2 {
        margin: 20px 0 20px !important;
        border-bottom: 1px solid #000;
        display: inline-block;
        font-weight: bold;
    }

    .single-map-right-ul-1 li {
        float: left;
        margin-right: 3%;
    }

    .single-map-right-ul-1 a {
        text-decoration: none;
    }

    .single-map-right-ul-2 span {
        padding: 6px 10px;
        margin-right: 5px;
        border-radius: 20px;
        color: #fff;
        font-size: 13px;
        position: relative;
        top: -2px;
        font-weight: bold;
        margin-left: 5px;
    }

    .single-map-right-ul-3 span {
        margin: 0;
        display: block;
        font-size: 11px;
        margin-top: 10px;
    }

.ogtSArticle__title {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 1.12;
    margin: 10px 0 14px;
}	
	
.ogtNewsCol__img {
    width: 30%;
    aspect-ratio: 4 / 3;
    height: auto;
    object-fit: cover;
    display: block;
    float: left;
}
	
.ogtNewsCol__list {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 65%;
    float: right;
    position: relative;
    top: -5px;
}
	

}