/* === PCのみで、ヒーローのフローティング画像を左寄せ＋縦センター === */ @media (min-width:960px){ /* 親を基準化＆重なり順を固定（背景<フロート） */ #first-view{position:relative!important;overflow:hidden!important;isolation:isolate!important;} #first-view>.key-visual{position:relative!important;z-index:0!important;} /* 既存の中央寄せ（flex）を無効化して最前面へ */ #first-view>.key-label{ position:absolute!important;inset:0!important;z-index:10!important; display:block!important;justify-content:initial!important;align-items:initial!important;text-align:left!important; } /* 位置決め：左1/3・縦センター。インラインstyle対策も込み */ #first-view>.key-label>.key-content{ position:absolute!important;top:50%!important;left:clamp(24px,8vw,120px)!important; transform:translateY(-50%)!important;right:auto!important;bottom:auto!important;margin:0!important; width:min(46vw,640px)!important;max-width:92%!important; } #first-view>.key-label>.key-content[style]{ left:clamp(24px,8vw,120px)!important;top:50%!important;transform:translateY(-50%)!important; } /* 念のためのリセット */ #first-view>.key-label>.key-content img{display:block!important;width:100%!important;height:auto!important;} } /* 見出し（H2）— 明朝・ミニマル */ .sec-title{ font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN","游明朝",serif; font-weight:600; letter-spacing:.06em; line-height:1.25; font-size:clamp(20px,2.6vw,28px); color:#111; margin:0 0 .35em; position:relative; padding-bottom:.28em; } .sec-title::after{ content:""; position:absolute; left:0; bottom:0; width:56px; height:2px; /* 短い下線。長くしたければ幅を増やす */ background:#111; opacity:.9; } /* 説明テキスト（1～2行） */ .sec-lead{ margin:.2em 0 1.2em; color:#333; font-size:clamp(14px,1.6vw,16px); line-height:1.7; } /* もっと見る（右寄せ・控えめ） */ .sec-more{ display:inline-block; margin: -.6em 0 1.2em; font-size:14px; color:#555; text-decoration:none; } .sec-more:hover{ opacity:.75; }

/* フローティング本体（小型） */
#gh-delivery-banner{
  position: fixed; right: 24px; bottom: 80px;
  z-index: 99999; background: #5a8c78; color:#fff;
  border-radius: 10px; box-shadow: 0 5px 15px rgba(0,0,0,.1);
  max-width: 340px; font-size:.85rem; overflow: visible; /* ←ボタンを確実に見せる */
}

/* ×ボタン（確実表示・広い当たり判定） */
#gh-banner-close{
  position:absolute; top:6px; right:6px;
  width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  background: rgba(0,0,0,.18); border:none; border-radius: 999px;
  color:#fff; cursor:pointer; z-index: 2; /* ←他装飾より前面 */
  line-height:1; padding:0; appearance:none; -webkit-appearance:none;
}
#gh-banner-close:hover{ background: rgba(0,0,0,.28); }
#gh-banner-close svg{ width:16px; height:16px; display:block; }

/* 内側 */
#gh-delivery-banner .gh-delivery-inner{ padding:14px 18px 12px; line-height:1.5; }
#gh-delivery-banner .gh-lead{ margin:0 0 2px; font-size:13px; opacity:.9; }
#gh-delivery-banner .gh-date{ margin:0 0 4px; font-weight:600; letter-spacing:.02em; }
#gh-delivery-date{ font-size:32px; font-weight:700; display:inline-block; margin-right:4px; }
#gh-delivery-banner .gh-after{ font-size:14px; }
#gh-delivery-banner .gh-note{ margin:4px 0 0; font-size:11px; opacity:.9; }
#gh-delivery-banner .gh-link{ color:#fff; text-decoration:underline; }
#gh-delivery-banner .gh-link:hover{ opacity:.8; }

/* モバイル */
@media (max-width:768px){
  #gh-delivery-banner{ right:12px; bottom:60px; max-width:84vw; font-size:.8rem; }
  #gh-delivery-date{ font-size:28px; }
  #gh-banner-close{ top:4px; right:4px; width:26px; height:26px; }
}