/* HONE スマホ用メニュー（ハンバーガー）。全ページ共通 */
.mbtn{display:inline-block;flex:none;margin-left:14px;width:46px;height:46px;border:0;border-radius:12px;background:var(--ink,#22344f);color:#fff;cursor:pointer;padding:0;position:relative}
.mbtn i{position:absolute;left:13px;right:13px;height:2px;border-radius:2px;background:#fff;transition:transform .3s,opacity .2s,top .3s}
.mbtn i:nth-child(1){top:16px}.mbtn i:nth-child(2){top:22px}.mbtn i:nth-child(3){top:28px}
/* ヘッダー：ロゴ（左）／ナビ・相談ボタン／ハンバーガー（右）。スマホはナビと相談ボタンをやめてハンバーガーだけ */
.hd .nav{margin-left:auto}
@media (max-width:860px){
  .hd .nav .pill{display:none}
  .mbtn{margin-left:0}
}
.mmenu{position:fixed;inset:10px;z-index:60;display:flex;flex-direction:column;background:var(--ink,#22344f);color:#fff;border-radius:22px;padding:14px 18px 22px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .3s,transform .3s,visibility 0s .3s;overflow:auto}
.mmenu.open{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s}
.mm-top{display:flex;align-items:center;justify-content:space-between;min-height:58px}
.mm-top .logo{font-family:var(--en,"Public Sans",sans-serif);font-weight:700;font-size:26px;letter-spacing:.02em;color:#fff}
.mm-top .logo small{display:block;font-family:var(--jp,sans-serif);font-weight:500;font-size:10px;letter-spacing:.12em;color:#c9d2dc;margin-top:2px}
.mm-close{width:46px;height:46px;border:0;border-radius:12px;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;position:relative;padding:0}
.mm-close i{position:absolute;left:13px;right:13px;top:22px;height:2px;border-radius:2px;background:#fff}
.mm-close i:nth-child(1){transform:rotate(45deg)}.mm-close i:nth-child(2){transform:rotate(-45deg)}
.mm-list{list-style:none;margin:clamp(24px,6vh,56px) 0 0;padding:0}
.mm-list li{border-bottom:1px solid rgba(255,255,255,.16)}
.mm-list li:first-child{border-top:1px solid rgba(255,255,255,.16)}
.mm-list a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:20px 4px;color:#fff}
.mm-list .mm-jp{font-size:21px;font-weight:700;letter-spacing:.08em}
.mm-list .mm-en{font-family:var(--en,"Public Sans",sans-serif);font-size:13px;color:#aab6c6;letter-spacing:.06em}
.mm-bottom{margin-top:auto;padding-top:28px}
.mm-cta{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:var(--ink,#22344f);border-radius:99px;padding:16px 20px;font-weight:700;font-size:15px;letter-spacing:.06em}
.mm-cta::after{content:"→";font-family:var(--en,"Public Sans",sans-serif)}
.mm-note{margin:14px 0 0;text-align:center;font-size:12px;color:#aab6c6;letter-spacing:.06em}
body.mm-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){ .mmenu,.mmenu.open,.mbtn i{transition:none} }
/* パソコン：右上に、ふわっと浮かぶカードとして開く */
@media (min-width:861px){
  .mmenu{inset:6px calc(clamp(16px,4vw,56px) - 18px) auto auto;width:min(460px,calc(100vw - 28px));max-height:calc(100vh - 28px);min-height:560px;border-radius:22px;box-shadow:0 20px 60px rgba(34,52,79,.28)}
}
.mm-back{position:fixed;inset:0;z-index:55;background:rgba(34,52,79,.28);opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s}
.mm-back.open{opacity:1;visibility:visible;transition:opacity .3s}
@media (max-width:860px){ .mm-back{display:none} }

/* スマホの下帯：ボタンをやめて、帯ぜんたいを押せるようにする */
@media (max-width:700px){
  .sticky{padding:0 0 env(safe-area-inset-bottom);justify-content:center;min-height:58px}
  .sticky span{display:none}
  .sticky .pill{position:static;width:100%;justify-content:center;background:transparent;color:#fff;border-radius:0;padding:18px 20px;font-size:16px;font-weight:700;letter-spacing:.08em}
  .sticky .pill::before{content:"";position:absolute;inset:0}
}


/* ロゴは、いつも左上に固定で出す（帯なし）。上のメニュー（ナビ）が見えなくなったら、右上にハンバーガーだけ出る */
.hd .logo{visibility:hidden}   /* 固定のロゴと重なるので、元のロゴは場所だけ残して見えなくする */
.fix-logo{position:fixed;top:22px;left:clamp(16px,4vw,56px);z-index:30;font-family:var(--en,"Public Sans",sans-serif);font-weight:700;font-size:26px;line-height:1.2;letter-spacing:.02em;color:#fff;mix-blend-mode:difference}
.fix-logo small{display:block;font-family:var(--jp,sans-serif);font-weight:500;font-size:10px;letter-spacing:.12em;margin-top:2px;opacity:.75}
.mini-hd{position:fixed;top:12px;right:clamp(16px,4vw,56px);z-index:30;opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .3s}
.mini-hd.show{opacity:1;transform:none}
.mini-hd .mbtn{margin-left:0;box-shadow:0 0 0 2px rgba(246,241,231,.95)}
@media (prefers-reduced-motion:reduce){ .mini-hd{transition:none} }