/* ============================================================
   OMAI HEADER V2 — 体重米導線強化ヘッダー用CSS（完全版）
   PC：ナビに「体重米を選ぶ」を追加しホバーで2階層メニュー表示
   SP：既存ハンバーガーは維持し、下部固定ナビを追加
   ブレイクポイントは既存ルールに合わせ 768px/769px を使用
   ============================================================ */

:root{
  --om2-gold:#C7973A;
  --om2-gold-dark:#9C6B1E;
  --om2-gold-light:#DDBA7A;
  --om2-cream:#FBEFD8;
  --om2-text:#1a1a1a;
  --om2-muted:#7a7a7a;
}

/* ---------- PC：既存グローバルナビの「体重米を選ぶ」項目 ---------- */
/* 対象liに .om-nav-taijyuumai クラスを付与して使う */
@media (min-width:769px){
  .om-nav-taijyuumai > a{
    color:var(--om2-gold-dark) !important;
    font-weight:600;
    position:relative;
  }
  .om-nav-taijyuumai > a::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:-4px;
    height:2px;
    background:var(--om2-gold);
  }
  .om-nav-taijyuumai{
    position:relative;
  }

  /* ★修正箇所：実際のサブメニューは .sub-menu というクラス名だった */
  .om-nav-taijyuumai .sub-menu{
    display:none;
    position:absolute;
    top:100%; left:0;
    min-width:240px;
    background:#fff;
    border:1px solid #eee;
    border-top:2px solid var(--om2-gold);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    z-index:200;
    padding:6px 0;
    margin:0;
    list-style:none;
  }
  .om-nav-taijyuumai:hover .sub-menu{
    display:block;
  }
  .om-nav-taijyuumai .sub-menu a{
    display:block;
    padding:12px 18px;
    font-size:13px;
    color:var(--om2-text) !important;
    white-space:nowrap;
    font-weight:400;
  }
  .om-nav-taijyuumai .sub-menu a:hover{
    background:#FAF6EC;
    color:var(--om2-gold-dark) !important;
  }
}

/* ---------- SP：下部固定ナビ ---------- */
@media (max-width:768px){
  body{
    padding-bottom:56px; /* 下部ナビ分の余白 */
  }
  .om-bottomnav{
    position:fixed;
    left:0; right:0; bottom:0;
    z-index:999;
    display:flex;
    background:#fff;
    border-top:1px solid #E6D9B8;
  }
  .om-bottomnav__item{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:6px 0 5px;
    text-decoration:none;
    color:var(--om2-muted);
    font-size:10px;
    line-height:1.3;
  }
  .om-bottomnav__item svg{
    width:20px; height:20px;
    margin-bottom:2px;
    fill:none;
    stroke:var(--om2-muted);
    stroke-width:1.8;
  }
  .om-bottomnav__item--taijyuumai{
    background:var(--om2-gold-dark);
    color:var(--om2-cream);
  }
  .om-bottomnav__item--taijyuumai svg{
    stroke:var(--om2-cream);
  }
  .om-bottomnav__item--menu{
    background:none;
    border:none;
    cursor:pointer;
  }
}
@media (min-width:769px){
  .om-bottomnav{ display:none; }
}

/* ============================================================
   OMAI HEADER V2 追加分
   ハンバーガー内の「体重米」サブメニューをアコーディオンではなく
   常時展開（開閉トグルなし）にする
   ★要調整：セレクタはThe Thorの実際のクラス名に書き換える
   （検証ツールで、体重米の親li／子ul／開閉矢印ボタンの
    それぞれのクラス名を確認してから差し替える）
   ============================================================ */

@media (max-width:768px){

  /* 子メニュー（サブメニュー）を常に表示させる */
  【体重米の親liのクラス】 .sub-menu{
    display:block !important;
    max-height:none !important;
    overflow:visible !important;
  }

  /* 開閉用の矢印ボタンを非表示にする */
  【体重米の親liのクラス】 .sub-menu-toggle,
  【体重米の親liのクラス】 .menu-toggle-icon{
    display:none !important;
  }

  /* 子メニューの見た目調整（インデント・境界線） */
  【体重米の親liのクラス】 .sub-menu a{
    padding-left:32px;
    font-size:13px;
    color:var(--om2-muted);
    border-top:1px solid #F0EAD8;
  }

  /* 親メニュー「体重米を選ぶ」自体を目立たせる */
  【体重米の親liのクラス】 > a{
    color:var(--om2-gold-dark) !important;
    font-weight:600;
  }
}

/* ============================================================
   OMAI HEADER V2 追加分 — ロゴサイズ調整
   ロゴ画像自体（logo.png）は変更しない。表示サイズだけ変更する
   ★要調整：【ロゴ画像のセレクタ】は検証ツールで確認して書き換える
   （The Thorは通常 .site-logo img か #logo img あたり）
   ============================================================ */

@media (min-width:769px){
  【ロゴ画像のセレクタ】{
    height:48px;
    width:auto;
    max-width:none;
  }
}

@media (max-width:768px){
  【ロゴ画像のセレクタ】{
    height:32px;
    width:auto;
    max-width:none;
  }
}
/* ★追加：ドロップダウン内のliに、通常ナビの区切り線スタイルが
   引き継がれてしまうのをリセットする */
@media (min-width:769px){
  .om-nav-taijyuumai .sub-menu li{
    border-left:none !important;
    width:auto !important;
    text-align:left !important;
  }
}
/* ============================================================
   OMAI HEADER V2 追加分 — ロゴとナビを1行に統合（PCのみ）
   ============================================================ */
@media (min-width:769px){
  .container-header{
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
  }
  .container-header .siteTitle{
    flex:0 0 auto;
    margin-right:32px;
  }
  .container-header nav.komeyaNavi{
    flex:1 1 auto;
    width:auto;
  }
  .container-header .komeya__inner{
    width:100%;
  }
  .container-header .komeyaNavi__list{
    justify-content:flex-end;
  }
  .container-header .searchBtn,
  .container-header .menuBtn{
    flex:0 0 auto;
    margin-left:20px;
  }
}