/*
Theme Name: Lightning Child
Template: lightning
Version: 1.0
*/

/* =========================================
   Sail Partners カスタムフッター 全面上書き
   ========================================= */

/* ① Lightningのフッター全体をネイビー化＆余計な余白をリセット */
.site-footer {
  background-color: #193a6a !important;
  color: #ffffff !important;
  padding-top: 32px !important;
  padding-bottom: 24px !important;
  font-size: 14px;
  line-height: 1.6;
}

/* "HOME / サービス案内 ..." のナビ（.footer-nav）を消す */
.site-footer .footer-nav {
  display: none !important;
}

/* Lightningの .container / .row / .col-* の制約よりも
   私たちのスタイルが勝つように調整する */
.site-footer .site-footer-content {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;

  /* 既存の row / col のflexレイアウトを一旦無効化して
     自分たちのレイアウトを適用する */
  display: block !important;
}

.site-footer .site-footer-content .row {
  display: block !important;
  margin: 0 !important;
}

.site-footer .site-footer-content .col-lg-4,
.site-footer .site-footer-content .col-md-6,
.site-footer .site-footer-content .col-lg-12,
.site-footer .site-footer-content .col-md-12,
.site-footer .site-footer-content .col-sm-12 {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 0 24px !important;
  float: none !important;
}

/* ② カスタムフッター本体（sp-footer）のスタイル */

.sp-scope.sp-footer {
  --sp-footer-bg: #193a6a;
  --sp-footer-text: #ffffff;
  --sp-footer-text-muted: rgba(255,255,255,.7);
  --sp-footer-border: rgba(255,255,255,.15);
  --sp-footer-btn-bg: #ffffff;
  --sp-footer-btn-text: #193a6a;
  color: var(--sp-footer-text) !important;
  background-color: transparent !important; /* 親で塗ってるので透明でOK */
  display: block;
}

/* ラップ */
.sp-footer-wrap {
  background: transparent !important;
  color: var(--sp-footer-text) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 14px;
  line-height: 1.6;
}

/* 内側の3カラム領域 */
.sp-footer-inner {
  display: grid !important;
  gap: 24px !important;
  grid-template-columns: 1fr !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

@media (min-width: 768px){
  .sp-footer-inner {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}

/* 各カラム */
.sp-footer-col {
  color: var(--sp-footer-text) !important;
  font-size: 13px;
  line-height: 1.7;
}

/* 会社名 */
.sp-footer-name {
  font-size: clamp(16px,2vw,18px);
  font-weight: 700;
  color: var(--sp-footer-text) !important;
  margin-bottom: 8px;
  line-height: 1.4;
}

/* 説明文 */
.sp-footer-desc {
  margin: 0 0 16px;
  color: var(--sp-footer-text-muted) !important;
  font-size: 13px;
  line-height: 1.7;
}

/* 見出し */
.sp-footer-heading {
  font-size: 14px;
  font-weight: 600;
  color: var(--sp-footer-text) !important;
  margin-bottom: 12px;
  line-height: 1.4;
}

/* ナビ */
.sp-footer-nav {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sp-footer-nav li {
  margin-bottom: 8px;
}
.sp-footer-nav a {
  color: var(--sp-footer-text-muted) !important;
  text-decoration: none;
  font-size: 13px;
  line-height: 1.5;
  transition: color .15s ease;
}
.sp-footer-nav a:hover {
  color: var(--sp-footer-text) !important;
}

/* ボタン */
.sp-footer-btn {
  display: inline-block;
  background: var(--sp-footer-btn-bg) !important;
  color: var(--sp-footer-btn-text) !important;
  font-weight: 600;
  font-size: 13px;
  line-height: 1.4;
  text-decoration: none;
  border-radius: 8px;
  padding: 10px 14px;
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
  transition: all .15s ease;
}
.sp-footer-btn:hover {
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
  transform: translateY(-1px);
  background: #fff !important;
  color: var(--sp-footer-btn-text) !important;
}

/* コピーライト行（下段） */
.sp-footer-bottom {
  margin-top: 24px !important;
  border-top: 1px solid var(--sp-footer-border) !important;
  padding-top: 16px !important;
  color: var(--sp-footer-text-muted) !important;
  font-size: 12px !important;
  text-align: center !important;
}
.sp-footer-copy {
  display: block;
  line-height: 1.4;
  color: var(--sp-footer-text-muted) !important;
}

/* ③ Lightningのデフォルトコピーライトなど
   （もし下に別のCopyrightが残るならこれで消す） */
.site-footer .footerBottom,
.site-footer .copySection,
.site-footer .site-footer-copyright {
  display: none !important;
}

/* ===== Sail Partners footer ===== */
.sp-scope.sp-footer {
  --sp-footer-bg: #193a6a;
  --sp-footer-text: #ffffff;
  --sp-footer-text-muted: rgba(255,255,255,.7);
  --sp-footer-border: rgba(255,255,255,.15);
  --sp-footer-btn-bg: #ffffff;
  --sp-footer-btn-text: #193a6a;

  background-color: var(--sp-footer-bg);
  color: var(--sp-footer-text);
  padding-top: clamp(32px, 4vw, 48px);
  padding-bottom: clamp(24px, 3vw, 32px);
  font-size: 14px;
  line-height: 1.6;
}

.sp-footer-wrap {
  background: transparent;
  color: var(--sp-footer-text);
}

.sp-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 16px;

  display: grid;
  gap: 24px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px){
  .sp-footer-inner {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.sp-footer-col {
  color: var(--sp-footer-text);
  font-size: 13px;
  line-height: 1.7;
}

.sp-footer-name {
  font-size: clamp(16px,2vw,18px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--sp-footer-text);
  margin-bottom: 8px;
}

.sp-footer-desc {
  margin: 0 0 16px;
  color: var(--sp-footer-text-muted);
  font-size: 13px;
  line-height: 1.7;
}

.sp-footer-heading {
  font-size: 14px;
  font-weight: 600;
  color: var(--sp-footer-text);
  margin-bottom: 12px;
  line-height: 1.4;
}

.sp-footer-nav {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sp-footer-nav li {
  margin-bottom: 8px;
}
.sp-footer-nav a {
  color: var(--sp-footer-text-muted);
  text-decoration: none;
  font-size: 13px;
  line-height: 1.5;
  transition: color .15s ease;
}
.sp-footer-nav a:hover {
  color: var(--sp-footer-text);
}

.sp-footer-btn {
  display: inline-block;
  background: var(--sp-footer-btn-bg);
  color: var(--sp-footer-btn-text);
  font-weight: 600;
  font-size: 13px;
  line-height: 1.4;
  text-decoration: none;
  border-radius: 8px;
  padding: 10px 14px;
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
  transition: all .15s ease;
}
.sp-footer-btn:hover {
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
  transform: translateY(-1px);
  background: #fff;
  color: var(--sp-footer-btn-text);
}

.sp-footer-bottom {
  margin-top: clamp(24px,3vw,32px);
  border-top: 1px solid var(--sp-footer-border);
  padding-top: 16px;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  color: var(--sp-footer-text-muted);
  font-size: 12px;
  text-align: center;
}
.sp-footer-copy {
  display: block;
  line-height: 1.4;
  color: var(--sp-footer-text-muted);
}


/* ===== Sail Partners お問い合わせフォーム ===== */

.contact-form-block {
  background-color: #eef5fa !important;
  padding: 40px 24px !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  color: #333 !important;
  max-width: 920px !important;
  padding: 32px 32px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

.contact-form-block .form-row {
  margin-bottom: 24px !important;
}

.contact-form-block .label-text {
  font-weight: 600 !important;
  display: inline-block !important;
  margin-bottom: 6px !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
  color: #333 !important;
  position: relative !important;
  padding-left: 44px !important;
}

.contact-form-block .required .label-text::before,
.contact-form-block .optional .label-text::before {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
  color: #fff !important;
  font-weight: 600 !important;
  content: "必須";
  background-color: #c94f6a;
}

.contact-form-block .optional .label-text::before {
  content: "任意" !important;
  background-color: #999999 !important;
}

.contact-form-block .form-input,
.contact-form-block .form-textarea,
.contact-form-block select {
  width: 100% !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  background-color: #fff !important;
  padding: 10px !important;
  font-size: 15px !important;
  box-sizing: border-box !important;
}

.contact-form-block .form-textarea {
  min-height: 140px !important;
}

.contact-form-block .privacy {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.contact-form-block .privacy a {
  color: #3d5570 !important;
  text-decoration: underline !important;
}

.contact-form-block .privacy a:hover {
  text-decoration: none !important;
}

/* 送信ボタン（信頼・誠実トーン） */
.contact-form-block .form-submit,
.contact-form-block input[type="submit"] {
  background-color: #0d5697 !important; /* 濃い青：信頼 */
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 12px 36px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: 0.3s ease !important;
  display: inline-block !important;
}

.contact-form-block .form-submit:hover,
.contact-form-block input[type="submit"]:hover {
  background-color: #2060b5 !important; /* 少し明るく変化：行動を促す */
}

/* フォーム全体をリード文と同じ左右余白に揃える */
.entry-body > .wpcf7 {
  padding-left: 3%;   /* ← 左右バランス用。必要に応じて数値を変える */
  padding-right: 3%;
  box-sizing: border-box;
}

/* 水色カード自体はその中で100%幅で表示 */
.entry-body > .wpcf7 .contact-form-block {
  background-color: #eef5fa;
  border-radius: 10px;
  padding: 32px;
  width: 100%;
  box-sizing: border-box;
}

/* お問い合わせページの本文エリアの内側幅をそろえるレイアウトコンテナを定義 */
.entry-body .content-inner-align {
  max-width: 980px;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

@media screen and (max-width: 767px) {
  .entry-body .content-inner-align {
    max-width: 100% !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }

  .entry-body .content-inner-align .contact-form-block {
    padding: 24px !important;
    border-radius: 8px !important;
  }

  .entry-body .content-inner-align .contact-lead {
    font-size: 1rem !important;   /* 少し小さく揃える（16px相当） */
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
  }
}

/* PC表示時：リード文とフォームの左のスタート位置をそろえる */
@media screen and (min-width: 768px) {
  .entry-body .content-inner-align .contact-lead {
    padding-left: 32px;   /* フォームカードの内側と合わせる */
    padding-right: 32px;
    box-sizing: border-box;
    max-width: 100%;
  }
}

/* 同意チェックの行まわり */
.wpcf7-form .form-row.privacy {
  margin-top: 24px;
  margin-bottom: 16px;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  text-align: left;
}

/* チェックボックスとテキスト横並びを安定させる */
.wpcf7-form .form-row.privacy label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  flex-wrap: wrap;
  cursor: pointer;
  font-weight: 400;
}

/* defaultのCF7のacceptanceは label内に input+text って出るのでそこに効く */
.wpcf7-form .form-row.privacy input[type="checkbox"] {
  margin-top: 2px;           /* 文字と縦位置を揃える微調整 */
  transform: scale(1.2);     /* 気持ち大きめでタップしやすく */
}

/* リンクの見た目 */
.wpcf7-form .form-row.privacy a {
  color: #0d5697;
  text-decoration: underline;
  font-weight: 500;
}

/* 送信ボタンの見栄えとセンター揃え */
.wpcf7-form .form-row.submit {
  text-align: center;
}

.wpcf7-form .form-row.submit .form-submit,
.wpcf7-form .form-row.submit input[type="submit"] {
  background-color: #1d4d89 !important; /* ブランド系の青で統一するならここ */
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 14px 32px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  min-width: 240px !important;
  cursor: pointer !important;
  display: inline-block !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.08);
  line-height: 1.4;
}

.wpcf7-form .form-row.submit input[type="submit"]:hover {
  background-color: #2b5fa8 !important;
}



/* 送信ボタン行そのもの */
.wpcf7-form .form-row.submit {
  margin-top: 24px;
  margin-bottom: 0;
}

/* インナーをフォーム内レイアウト幅に合わせつつ、中央揃えのflexにする */
.wpcf7-form .form-row.submit .submit-inner {
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;

  display: flex;
  justify-content: center;   /* 横方向センター */
  align-items: center;       /* 縦位置も揃える */
  flex-wrap: nowrap;
}

/* p（ボタンを包んでるやつ）も余計な幅を持たせない */
.wpcf7-form .form-row.submit .submit-inner p {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;                  /* ボタンとスピナーの間の余白 */
}

/* ボタン本体 */
.wpcf7-form .form-row.submit .submit-inner input[type="submit"] {
  display: inline-block;
  min-width: 240px;
  background-color: #1d4d89 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 14px 32px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.4;
  box-shadow: 0 2px 4px rgba(0,0,0,0.08);
  cursor: pointer;
  transition: 0.3s ease;
  text-align: center;
}

/* ホバー時 */
.wpcf7-form .form-row.submit .submit-inner input[type="submit"]:hover {
  background-color: #2b5fa8 !important;
}

/* スマホのときは左右paddingを16pxに */
@media screen and (max-width: 767px) {
  .wpcf7-form .form-row.submit .submit-inner {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* Contact Form 7 のスピナー完全非表示 */
.wpcf7-spinner {
  display: none !important;
}

/* 白いカードのサイズはそのままで、ロゴ画像だけ60%に縮小 */
.sp-intro .sp-visual-card {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.sp-intro .sp-visual-card .sp-visual-img {
  width: 60% !important;
  height: auto !important;
  display: block !important;
}

/* =========================
   スマホ時の要素順調整
   ========================= */
@media (max-width: 767px) {
  /* グリッドを縦並びに */
  .sp-grid {
    display: flex !important;
    flex-direction: column !important;
  }

  /* 幅100%に */
  .sp-grid .sp-col,
  .sp-grid .sp-col.sp-visual {
    width: 100% !important;
  }

  /* 1. 見出しを最初に */
  .sp-grid .sp-col h2 {
    order: 1 !important;
  }

  /* 2. ロゴ（右カラム）を見出しのすぐ下に */
  .sp-grid .sp-col.sp-visual {
    order: 2 !important;
    display: flex !important;
    justify-content: center !important;
    margin: 24px 0 16px !important; /* 見出しとの間を少し空ける */
  }

  /* 3. 説明テキスト */
  .sp-grid .sp-col p {
    order: 3 !important;
    margin-bottom: 24px !important;
  }

  /* 4. 「大手監査法人出身」バナー */
  .sp-grid .sp-feature {
    order: 4 !important;
    margin: 0 auto 16px !important;
    text-align: center !important;
  }

  /* 5. 「事務所案内を見る」ボタン */
  .sp-grid .sp-col .sp-btn {
    order: 5 !important;
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 280px !important;
    margin: 0 auto 32px !important;
  }
}
/* ===== ロゴを見出しのすぐ下に配置 ===== */
@media (max-width: 767px) {
  /* ロゴカラムを見出しの直後に */
  .sp-grid .sp-col.sp-visual {
    order: 2 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    margin: 16px 0 24px !important; /* 上下余白で見出しとの距離を調整 */
  }

  /* 見出しを1番目に */
  .sp-grid .sp-col h2 {
    order: 1 !important;
    margin-bottom: 8px !important;
  }

  /* 残り（説明文・バナー・ボタン）の順番も再調整 */
  .sp-grid .sp-col p {
    order: 3 !important;
    margin-bottom: 20px !important;
  }

  .sp-grid .sp-feature {
    order: 4 !important;
    margin: 0 auto 12px !important;
    text-align: center !important;
  }

  .sp-grid .sp-col .sp-btn {
    order: 5 !important;
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 280px !important;
    margin: 0 auto 32px !important;
  }
}



/* サービスページだけ、横余白をなくす */
#services,
#services .section-inner,
#services .vk_posts,
#services .vk_posts-inner {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* サービスページの余白をゼロに */
#services .service-block { 
  padding: 0 !important; 
}

/* 親側に左右パディングがある場合の保険 */
#services .services-wrap,
#services .section-inner,
#services .vk_posts,
#services .vk_posts-inner {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (max-width: 767px) {
  /* 見出しは左寄せのまま */
  #services .service-text {
    text-align: left !important;
  }

  /* ボタンだけセンター揃え */
  #services .service-text .btn {
    display: block !important;
    margin: 16px auto 0 !important; /* 上に少し余白 */
    text-align: center !important;
  }
}

/* --- TOPお知らせ：スマホ時は「日付＋カテゴリ」を1行、「タイトル」は次行 --- */
@media (max-width: 767px) {
  #home-news .news__link{
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    grid-template-areas:
      "date cats"
      "title title" !important;
    column-gap: 8px;
    row-gap: 4px;
    align-items: center;
  }

  /* エリア割り当て */
  #home-news .news__date        { grid-area: date !important; }
  #home-news .news__content     { display: contents !important; } /* ←中身を親グリッドに参加 */
  #home-news .news__cats        { grid-area: cats !important; justify-self: start; display: inline-flex; gap: 6px; }
  #home-news .news__title-text  { grid-area: title !important; }
}
/* --- 枠線は普段は透明、ホバーで出す --- */
#home-news .news__item + .news__item { border-top: none; } /* 仕切り線は不要なら消す */

#home-news .news__link{
  /* 既存のカード設定は活かしつつ、枠線色だけ透明にしておく */
  border-color: rgba(214,230,246,0);        /* 透明 */
  background: #ffffff;
  transition:
    box-shadow .20s ease,
    transform  .08s ease,
    border-color .20s ease,
    background-color .20s ease;
}

#home-news .news__link:hover,
#home-news .news__link:focus-visible{
  border-color: #d6e6f6;                    /* ホバーで枠線を出す */
  box-shadow: 0 6px 20px rgba(25,70,120,.14);
  background: #f9fcff;                      /* ほんのり明るく（好みで） */
}

/* タップ端末の“押下”も少しだけ表情を付ける（任意） */
#home-news .news__link:active{
  transform: translateY(-1px) scale(.997);
}

/* アニメ苦手設定の人には動きを抑える */
@media (prefers-reduced-motion: reduce){
  #home-news .news__link{
    transition: none;
  }
}
/* お知らせ：アイテム間のセパレーター */
#home-news .news__list .news__item + .news__item {
  border-top: 1px solid #e7edf4;   /* 薄いグレー青 */
}
#home-news .news__list .news__item {
  padding-top: 14px;
  padding-bottom: 14px;
}
/* --- お知らせカード：通常時は枠線なし・ホバーでだけ枠線出現 --- */

/* お知らせカード：レイアウトが動かないホバー */
#home-news ul.news__list a.news__link{
  display: block;                   /* 念のため */
  box-sizing: border-box;           /* 枠線分でサイズが変わらない */
  border: 1px solid transparent !important; /* ←最初から透明の枠を持たせる */
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  border-radius: 12px;              /* テーマに合わせて固定（任意） */
  transition:
    border-color .20s ease,
    background-color .20s ease,
    box-shadow .20s ease;           /* 位置が変わらないプロパティだけ */
}

/* マウスのある端末だけホバー演出 */
@media (hover: hover) and (pointer: fine) {
  #home-news ul.news__list a.news__link:hover,
  #home-news ul.news__list a.news__link:focus-visible{
    border-color: #d6e6f6 !important;  /* ←色だけ変えるので幅は不変 */
    background: #f9fcff !important;
    box-shadow: 0 6px 20px rgba(25,70,120,.14) !important;
  }
}

/* タッチ端末は常時フラット */
@media (hover: none), (pointer: coarse) {
  #home-news ul.news__list a.news__link{
    border-color: transparent !important;
    background: #fff !important;
    box-shadow: none !important;
  }
}



/* トップ「お知らせ」見出しの“下線”のみを無効化（上の青ラインは触らない） */
#home-news h2.news__title{
  border-bottom: none !important;
}
#home-news h2.news__title::after{
  content: none !important;
  display: none !important;
}

/* スマホ時のみ構成を縦並びにして順番を調整 */
@media screen and (max-width: 767px) {
  .service-block {
    display: flex;
    flex-direction: column;
  }

  /* 通常は service-text → service-image → などの順だけど、
     スマホでは service-image を2番目にしたい */
  .service-text {
    order: 1;
  }

  .service-image {
    order: 2;
    margin: 16px 0; /* リード文と主なサービス内容の間の余白 */
  }

  .service-block .service-text + .service-image + .service-text {
    order: 3;
  }
}
/* ========== SPのハンバーガーメニュー調整 ========== */
@media (max-width: 768px) {

  /* ドロワー本体の内側余白（上/下を少し空ける） */
  .menu-drawer,
  .vk-mobile-nav,
  .global-nav--mobile {
    padding: 8px 0 !important;
  }

  /* 各メニュー行：大きめ文字・広めパディング・区切り線 */
  .menu-drawer .menu > li > a,
  .vk-mobile-nav .menu > li > a,
  .global-nav--mobile .menu > li > a,
  .drawer--overlay .menu > li > a {
    display: block !important;
    padding: 18px 20px !important;
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
    letter-spacing: .02em;
    border-bottom: 1px solid #e5e7eb !important;
  }

  /* 最後の行は線ナシ */
  .menu-drawer .menu > li:last-child > a,
  .vk-mobile-nav .menu > li:last-child > a,
  .global-nav--mobile .menu > li:last-child > a,
  .drawer--overlay .menu > li:last-child > a {
    border-bottom: none !important;
  }

  /* メニュー先頭（HOME）がアイコンに被らないよう余白 */
  .vk-mobile-nav .menu,
  #vk-mobile-nav .menu {
    margin-top: 50px !important;
  }

  /* 触ったときのフィードバック（薄いグレー） */
  .menu-drawer .menu > li > a:hover,
  .menu-drawer .menu > li > a:active,
  .vk-mobile-nav .menu > li > a:hover,
  .vk-mobile-nav .menu > li > a:active,
  .global-nav--mobile .menu > li > a:hover,
  .global-nav--mobile .menu > li > a:active,
  .drawer--overlay .menu > li > a:hover,
  .drawer--overlay .menu > li > a:active {
    background: #f9fafb !important;
  }
} /* ← 768px メディア閉じ */