/*
Theme Name: Lightning Child
Theme URI: 
Template: lightning
Description: 薩摩川内市 女性のデジタル人材育成講座
Author: CoCoDigi
Tags: 
Version: 1.1.0
*/

/* ============================================
   Lightning フォント設定
   子テーマの style.css に追記、
   または「外観 → カスタマイズ → 追加CSS」に貼り付け
   ============================================ */

/* ---- Web Font 読み込み ---- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800;900&family=Klee+One:wght@400;600&display=swap');

/* ---- 全体のフォント ---- */
body,
input,
textarea,
select,
button {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 17px;                     /* ★ 本文 17px 絶対厳守 ★ */
  line-height: 1.9;
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* ---- 見出し共通 ---- */
h1, h2, h3, h4, h5, h6,
.entry-title,
.vk_heading,
.vk_heading_title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

/* ---- 見出しサイズ ---- */
h1,
.entry-title {
  font-size: 72px;                     /* ヒーロータイトル */
}

h2,
.vk_heading_title {
  font-size: 38px;                     /* セクション見出し */
}

h3 {
  font-size: 24px;                     /* カードタイトル */
  font-weight: 700;
}

h4 {
  font-size: 22px;                     /* 講師名など */
  font-weight: 700;
}

h5 {
  font-size: 18px;
  font-weight: 700;
}

h6 {
  font-size: 17px;
  font-weight: 700;
}

/* ---- ナビゲーション ---- */
.global-nav a,
.vk-mobile-nav a {
  font-size: 16px;
  font-weight: 500;
}

/* ---- ボタン ---- */
.btn,
.vk_button a,
.wp-block-button__link {
  font-size: 17px;
  font-weight: 700;
}

/* ---- キャッチコピー（手書き風） ---- */
.hero-catch,
.catch-hand {
  font-family: 'Klee One', serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

/* ---- 補足テキスト ---- */
small,
.text-muted,
.entry-meta,
.vk_post_meta,
figcaption,
.wp-block-latest-posts__post-date {
  font-size: 14px;
  font-weight: 400;
}

/* ---- FAQ ---- */
.faq-q,
.vk_faq_title {
  font-size: 18px;
  font-weight: 700;
}

.faq-a,
.vk_faq_content {
  font-size: 16px;
  line-height: 1.8;
}

/* ---- レスポンシブ ---- */

/* タブレット */
@media (max-width: 992px) {
  h1, .entry-title { font-size: 50px; }
  h2, .vk_heading_title { font-size: 32px; }
}

/* スマホ */
@media (max-width: 768px) {
  h1, .entry-title { font-size: 40px; }
  h2, .vk_heading_title { font-size: 28px; }
  h3 { font-size: 20px; }
  h4 { font-size: 18px; }

  body {
    font-size: 17px;                   /* ★ スマホでも17px ★ */
  }
}

/* 小さいスマホ */
@media (max-width: 480px) {
  h1, .entry-title { font-size: 34px; }
  h2, .vk_heading_title { font-size: 24px; }
}

/* ============================================
   セクション見出し装飾（ \\ タイトル // ）
   
   使い方：ブロックエディタで見出し（H2）を追加
   → 右パネル「高度な設定」→「追加CSSクラス」に
   sec-deco と入力
   ============================================ */

h2.sec-deco {
  display: block;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 28px;
  font-weight: 900;
  color: #3F2B67;
  margin-bottom: 50px;
  padding: 0;
  background: none;
  border: none;
  line-height: 1.4;
}

/* 左 \\ */
h2.sec-deco::before {
  content: '\\\\';
  font-size: 22px;
  color: #8A68D8;
  font-weight: 300;
  letter-spacing: -2px;
  margin-right: 12px;
  background: none;
  width: auto;
  height: auto;
  position: static;
  display: inline;
  border: none;
}

/* 右 // */
h2.sec-deco::after {
  content: '//';
  font-size: 22px;
  color: #8A68D8;
  font-weight: 300;
  letter-spacing: -2px;
  margin-left: 12px;
  background: none;
  width: auto;
  height: auto;
  position: static;
  display: inline;
  border: none;
}

/* ---- レスポンシブ ---- */
@media (max-width: 992px) {
  h2.sec-deco { font-size: 24px; }
}

@media (max-width: 768px) {
  h2.sec-deco {
    font-size: 22px;
    margin-bottom: 40px;
  }

  h2.sec-deco::before,
  h2.sec-deco::after {
    font-size: 18px;
    margin-right: 8px;
    margin-left: 8px;
  }
}

@media (max-width: 480px) {
  h2.sec-deco { font-size: 20px; }

  h2.sec-deco::before,
  h2.sec-deco::after { font-size: 16px; }
}

/* ============================================
   開催概要テーブル（ブロックエディタ用）
   追加CSSまたは子テーマ style.css に貼り付け
   
   使い方：テーブルブロックに追加CSSクラス
   → info-table と入力
   ============================================ */

/* ---- テーブル全体 ---- */
.info-table table {
  border-collapse: collapse;
  width: 100%;
  border: none;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* ---- 行の区切り線 ---- */
.info-table table tr {
  border-bottom: 1px solid #ECECEC;
}

.info-table table tr:last-child {
  border-bottom: none;
}

/* ---- 1列目（項目名）紫背景 ---- */
.info-table table td:first-child {
  background: #5A3E8B;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  padding: 16px 20px;
  width: 130px;
  vertical-align: top;
  white-space: nowrap;
  border: none;
}

/* ---- 2列目（内容） ---- */
.info-table table td:last-child {
  background: #fff;
  font-size: 17px;
  color: #4A4A4A;
  padding: 16px 20px;
  line-height: 1.8;
  border: none;
}

/* ---- スマホ（縦並び時） ---- */
@media (max-width: 599px) {
  .info-table table td:first-child {
    width: 100%;
    white-space: normal;
    padding: 12px 20px 6px;
    border-radius: 0;
  }

  .info-table table td:last-child {
    padding: 6px 20px 14px;
  }
}

/* ============================================
   お申し込みボタン
   
   使い方：ボタンブロックに追加CSSクラス
   → cta-btn と入力
   ============================================ */

/* ---- ボタン本体 ---- */
.cta-btn .wp-block-button__link,
.cta-btn a {
  background: linear-gradient(135deg, #F68A44, #EE7432) !important;
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  padding: 18px 48px !important;
  border-radius: 999px !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(246, 138, 68, 0.3);
  transition: all 0.2s ease;
  text-decoration: none;
}

.cta-btn .wp-block-button__link:hover,
.cta-btn a:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(246, 138, 68, 0.4);
  color: #fff !important;
  opacity: 0.95;
}

/* ---- ボタンを中央配置にする場合 ---- */
.cta-btn {
  text-align: center;
}

/* ============================================
   よくある質問ページ CSS（完全版）
   追加CSS または 子テーマ style.css に貼り付け
   ============================================ */

/* ============================================
   1. VK FAQ ブロック カラー変更
   ============================================ */

/* ---- Qマーク背景色（赤→オレンジ） ---- */
.is-style-vk_faq-bgfill-circle .vk_faq_title:before,
.is-style-vk_faq-bgfill-square .vk_faq_title:before,
.is-style-vk_faq-bgfill-rounded .vk_faq_title:before {
  background-color: #F68A44 !important;
  color: #fff !important;
}

/* ---- Qマーク枠線スタイルの場合 ---- */
.is-style-vk_faq-border-circle .vk_faq_title:before,
.is-style-vk_faq-border-square .vk_faq_title:before,
.is-style-vk_faq-border-rounded .vk_faq_title:before {
  color: #F68A44 !important;
  border-color: #F68A44 !important;
}

/* ---- 質問テキストの色 ---- */
.vk_faq_title,
.vk_faq_title p {
  color: #3F2B67 !important;
  font-weight: 700 !important;
}

/* ---- Aマーク背景色（赤→紫） ---- */
.is-style-vk_faq-bgfill-circle .vk_faq_content:before,
.is-style-vk_faq-bgfill-square .vk_faq_content:before,
.is-style-vk_faq-bgfill-rounded .vk_faq_content:before {
  background-color: #5A3E8B !important;
  color: #fff !important;
}

/* ---- Aマーク枠線スタイルの場合 ---- */
.is-style-vk_faq-border-circle .vk_faq_content:before,
.is-style-vk_faq-border-square .vk_faq_content:before,
.is-style-vk_faq-border-rounded .vk_faq_content:before {
  color: #5A3E8B !important;
  border-color: #5A3E8B !important;
}

/* ---- 回答テキストの色 ---- */
.vk_faq_content,
.vk_faq_content p {
  color: #4A4A4A !important;
}


/* ============================================
   2. ページ冒頭（タイトル＋リード文）
   ============================================ */
.fq-head{
  width:100%;
  margin:0 0 40px;
  text-align:center;
  font-family:'Noto Sans JP',sans-serif;
  color:#4A4A4A;
  font-size:17px;
  line-height:1.9;
  box-sizing:border-box;
}
.fq-head *{ box-sizing:border-box; }

.fq-head__title{
  display:block;
  width:100%;
  margin:0;
  font-size:28px;
  font-weight:800;
  color:#3F2B67;
  line-height:1.5;
  text-align:center !important;
}

.fq-head__sub{
  display:block;
  width:100%;
  margin:2px 0 22px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.16em;
  color:#777;
  text-align:center !important;
}

.fq-head__lead{
  margin:0;
  font-size:17px;
  text-align:center !important;
}
.fq-head__lead a{
  color:#5A3E8B;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.fq-head__lead a:hover{ color:#F68A44; }


/* ============================================
   3. グループ見出し（シンプル版・FAQと同じ幅）
   ============================================ */
.fq-group{
  width:100%;
  margin:48px 0 20px;
  padding:13px 22px;
  background:#F4EEFF;
  border-left:5px solid #5A3E8B;
  border-radius:0 12px 12px 0;
  font-family:'Noto Sans JP',sans-serif;
  font-size:20px;
  font-weight:800;
  color:#3F2B67;
  line-height:1.5;
  text-align:left !important;
  box-sizing:border-box;
}

/* 最初の見出しは上の余白を詰める */
.fq-head + .fq-group{ margin-top:8px; }


/* ============================================
   4. レスポンシブ
   ============================================ */
@media(max-width:640px){
  .fq-head{ margin-bottom:32px; }
  .fq-head__title{ font-size:24px; }
  .fq-head__lead{ font-size:16px; }
  .fq-head__lead br{ display:none; }

  .fq-group{
    font-size:18px;
    padding:12px 16px;
    margin:36px 0 16px;
  }
}

/* ============================================
   Contact Form 7 スタイル（令和8年度版）
   ※旧年度のフォーム用CSSと差し替えてください
   ============================================ */

/* ---- テーブル本体 ---- */
table.CF7_table{
  width:100%;
  margin:0 auto;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1px solid #ECECEC;
  border-radius:16px;
  overflow:hidden;
  font-family:'Noto Sans JP',sans-serif;
  font-size:17px;
  line-height:1.9;
  color:#4A4A4A;
}
.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{ display:table; }

table.CF7_table tr{ border:none; }
table.CF7_table tr + tr th,
table.CF7_table tr + tr td{ border-top:1px solid #ECECEC; }

.CF7_table th,
.CF7_table td{
  padding:18px 20px;
  vertical-align:top;
  text-align:left;
}
.CF7_table th{
  width:30%;
  background:#F4EEFF;
  color:#3F2B67;
  font-size:16px;
  font-weight:700;
}
.CF7_table td{
  background:#fff;
  font-size:16px;
}

/* ---- 必須／任意バッジ ---- */
.CF7_req,
.CF7_unreq{
  display:inline-block;
  font-size:12px;
  font-weight:700;
  line-height:1;
  padding:5px 10px;
  border-radius:999px;
  margin-right:10px;
  color:#fff;
  vertical-align:2px;
}
.CF7_req{ background:#F48DA6; }
.CF7_unreq{ background:#A9A4B5; }

/* ---- 入力欄 ---- */
.CF7_table input[type="text"],
.CF7_table input[type="email"],
.CF7_table input[type="tel"],
.CF7_table input[type="number"],
.CF7_table select,
.CF7_table textarea,
.CF7_survey input[type="text"],
.CF7_survey textarea,
.CF7_survey select{
  width:100%;
  padding:12px 14px;
  border:1.5px solid #DDD;
  border-radius:10px;
  font-family:'Noto Sans JP',sans-serif;
  font-size:16px;
  color:#4A4A4A;
  background:#fff;
  box-sizing:border-box;
  transition:border .15s, box-shadow .15s;
}
.CF7_table textarea,
.CF7_survey textarea{ min-height:150px; }

.CF7_table input:focus,
.CF7_table select:focus,
.CF7_table textarea:focus,
.CF7_survey input:focus,
.CF7_survey textarea:focus,
.CF7_survey select:focus{
  outline:none;
  border-color:#5A3E8B;
  box-shadow:0 0 0 3px rgba(90,62,139,.14);
}
.CF7_table ::placeholder{ color:#9A9A9A; }

/* 補足テキスト（<small class="hint"> で囲むと綺麗） */
.CF7_table .hint,
.CF7_survey .hint{
  display:block;
  margin-top:8px;
  color:#777;
  font-size:14px;
  line-height:1.75;
}

/* ---- アンケート・見出し ---- */
.CF7_survey h4{
  font-family:'Noto Sans JP',sans-serif;
  font-size:20px;
  font-weight:800;
  color:#3F2B67;
  margin:2.2rem 0 1rem;
  padding:12px 20px;
  background:#F4EEFF;
  border-left:5px solid #5A3E8B;
  border-radius:0 12px 12px 0;
}
.CF7_survey .question{
  margin:1.6rem 0 .6rem;
  font-size:17px;
  font-weight:700;
  color:#3F2B67;
  line-height:1.8;
}

/* ---- チェック／ラジオをカード化 ---- */
.CF7_survey label{
  display:block;
  position:relative;
  border:1.5px solid #ECECEC;
  border-radius:12px;
  padding:13px 16px;
  margin:.55rem 0;
  background:#fff;
  font-size:16px;
  cursor:pointer;
  transition:border .15s, box-shadow .15s, background .15s;
}
.CF7_survey label input{
  margin-right:10px;
  transform:translateY(1px);
  accent-color:#5A3E8B;
}
.CF7_survey label:hover{ border-color:#C9BDE4; }
.CF7_survey label:has(input:focus){
  border-color:#5A3E8B;
  box-shadow:0 0 0 3px rgba(90,62,139,.14);
}
.CF7_survey label:has(input:checked){
  border-color:#5A3E8B;
  background:#F8F4FF;
  box-shadow:0 0 0 3px rgba(90,62,139,.12);
}

/* 幅広のときは2列 */
@media (min-width:721px){
  .CF7_survey .wpcf7-checkbox,
  .CF7_survey .wpcf7-radio{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.6rem .8rem;
  }
}

/* ---- エラーメッセージ ---- */
.wpcf7-not-valid-tip{
  color:#D14A6E;
  font-size:14px;
  font-weight:700;
  margin-top:8px;
}
.wpcf7 form .wpcf7-response-output{
  border-radius:12px;
  border-width:2px;
  font-size:16px;
  padding:14px 18px;
}
.wpcf7 form.sent .wpcf7-response-output{
  border-color:#5BBE8D;
  background:#F3FCF7;
  color:#2F7B57;
}

/* ---- 同意・送信ボタン ---- */
.CF7_btn{
  text-align:center;
  margin:1.8rem 0 .8rem;
  font-size:16px;
}
.CF7_btn .wpcf7-acceptance input{
  margin-right:.5rem;
  accent-color:#5A3E8B;
}

.wpcf7 input.wpcf7-submit,
.CF7_btn .wpcf7-submit,
.CF7_btn .button{
  background:#F68A44;
  color:#fff;
  padding:16px 48px;
  border:none;
  border-radius:999px;
  font-family:'Noto Sans JP',sans-serif;
  font-size:17px;
  font-weight:700;
  margin:0 auto;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(246,138,68,.32);
  transition:background .2s ease, transform .15s ease, box-shadow .2s ease;
}
.wpcf7 input.wpcf7-submit:hover,
.CF7_btn .wpcf7-submit:hover{
  background:#EE7432;
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(246,138,68,.42);
}
.wpcf7 input.wpcf7-submit:active,
.CF7_btn .wpcf7-submit:active{ transform:translateY(0); }

.wpcf7-spinner{ width:0; margin:0; }

/* ---- スマホ：行を縦積み ---- */
@media (max-width:768px){
  table.CF7_table{
    width:100%;
    border-radius:14px;
    font-size:16px;
  }
  .CF7_table tr,
  .CF7_table td,
  .CF7_table th{
    display:block;
    width:100%;
    line-height:1.9;
  }
  .CF7_table th{
    background:#F4EEFF;
    border-left:4px solid #5A3E8B;
    padding:12px 16px;
  }
  .CF7_table td{ padding:14px 16px; }
  table.CF7_table tr + tr th{ border-top:1px solid #ECECEC; }
  table.CF7_table tr + tr td{ border-top:none; }

  .CF7_survey h4{ font-size:18px; padding:11px 16px; }
  .CF7_survey .question{ font-size:16px; }
  .wpcf7 input.wpcf7-submit,
  .CF7_btn .wpcf7-submit{
    width:100%;
    padding:16px 20px;
  }
}


/* ============================================
   申込フォーム：スキルチェックの注意書き
   ============================================ */
.skill-note{
  margin:0 0 1.4rem;
  padding:16px 20px;
  background:#F8F5FF;
  border:1.5px solid #D9CCF2;
  border-radius:14px;
}
.skill-note p{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:#4A4A4A;
}
.skill-note strong{ color:#5A3E8B; font-weight:800; }

@media(max-width:768px){
  .skill-note{ padding:14px 16px; }
  .skill-note p{ font-size:14px; }
}

.CF7_btn a{
  color:#5A3E8B;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.CF7_btn a:hover{ color:#F68A44; }



/* ===== ページヘッダー（全ページ共通） ===== */
.page-header{
  background-image:none !important;
  background-color:transparent !important;
  background:linear-gradient(120deg,#F4EEFF 0%,#FFF3F7 100%) !important;
  color:#3F2B67 !important;
  min-height:0 !important;
  padding:48px 0 !important;
  border-bottom:none !important;
}
/* 暗いオーバーレイがあれば消す */
.page-header::before,
.page-header::after{
  display:none !important;
  background:none !important;
}

.page-header-inner{
  position:relative;
  z-index:1;
}

/* タイトル */
.page-header-title{
  margin:0 !important;
  color:#3F2B67 !important;
  font-family:'Noto Sans JP',sans-serif !important;
  font-size:28px !important;
  font-weight:800 !important;
  line-height:1.5 !important;
  text-shadow:none !important;
}

/* サブテキスト（NEWS など） */
.page-header-subtext{
  margin:2px 0 0 !important;
  color:#777 !important;
  font-family:'Noto Sans JP',sans-serif !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.16em !important;
  text-shadow:none !important;
}

@media(max-width:640px){
  .page-header{ padding:36px 0 !important; }
  .page-header-title{ font-size:24px !important; }
}

/* ===== アーカイブページのタイトル ===== */
.archive-header-title{
  font-size:28px !important;
  font-weight:800 !important;
  color:#3F2B67 !important;
  line-height:1.5 !important;
  margin:0 0 8px !important;
}
@media(max-width:640px){
  .archive-header-title{ font-size:24px !important; }
}

/* ===== 投稿・固定ページのタイトル ===== */
.entry-title{
  font-size:30px !important;
  font-weight:800 !important;
  color:#3F2B67 !important;
  line-height:1.55 !important;
  letter-spacing:.01em !important;
  margin:0 0 14px !important;
}
/* タイトル内の絵文字サイズを揃える */
.entry-title img.emoji{
  width:1em !important;
  height:1em !important;
  vertical-align:-.15em !important;
}

@media(max-width:640px){
  .entry-title{ font-size:24px !important; }
}


/* ============================================================
   Lightning 汎用カスタムCSS テンプレート  v3
   （実運用CSS：かごしまみどりの基金 のハンバーガー実装を移植）
   ------------------------------------------------------------
   使い方：
   1) このCSSを「追加CSS」に貼り付け
   2) 先頭 :root の --brand / --brand-dark を会社の色に変更
      （基本この2色だけでOK）
   3) ハンバーガーの形は --lc-btn-radius で変更
      ・丸        … 50%（初期）
      ・角丸四角  … 14px
      ・四角      … 4px
   ============================================================ */

:root{
  --brand:            #5A3E8B;  /* ★メインカラー（会社ごとに変更） */
  --brand-dark:       #3F2B67;  /* ★ホバー等の濃い色 */
  --brand-accent:     #F68A44;  /* アクセント（任意） */
  --brand-accent-dark:#EE7432;

  /* ハンバーガー設定（必要なら調整） */
  --lc-btn-size:   52px;   /* ボタンの大きさ */
  --lc-btn-radius: 14px;    /* 50%=丸 / 14px=角丸 / 4px=四角 */
  --lc-bar-w:      24px;   /* 線の幅 */
  --lc-bar-h:      3px;    /* 線の太さ */
  --lc-bar-gap:    8px;    /* 中央線から上下線までの距離 */
}

/* ============================================================
   1. スマホ ハンバーガーボタン（VK Mobile Nav）
      三本線 → 開くと × に変化（menu-open クラス）
   ============================================================ */
@media screen and (max-width:992px){

  .vk-mobile-nav-menu-btn{
    width:var(--lc-btn-size) !important;
    height:var(--lc-btn-size) !important;
    background-color:var(--brand) !important;
    border-radius:var(--lc-btn-radius) !important;
    border:none !important;
    box-shadow:0 2px 8px rgba(0,0,0,.18) !important;
    color:transparent !important;
    font-size:0 !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    position:fixed !important;
    /* 真ん中の線を背景画像で描く */
    background-image:linear-gradient(#fff,#fff) !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:var(--lc-bar-w) var(--lc-bar-h) !important;
    transition:background-color .2s ease, transform .2s ease !important;
  }

  /* 上の線 */
  .vk-mobile-nav-menu-btn:before{
    content:"";
    display:block;
    width:var(--lc-bar-w);
    height:var(--lc-bar-h);
    background-color:#fff;
    border-radius:2px;
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%, calc(-50% - var(--lc-bar-gap)));
    text-indent:0;
    transition:transform .3s ease;
  }

  /* 下の線 */
  .vk-mobile-nav-menu-btn:after{
    content:"";
    display:block;
    width:var(--lc-bar-w);
    height:var(--lc-bar-h);
    background-color:#fff;
    border-radius:2px;
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%, calc(-50% + var(--lc-bar-gap)));
    text-indent:0;
    transition:transform .3s ease;
  }

  /* 開いているとき（menu-open）→ × に変化 */
  .vk-mobile-nav-menu-btn.menu-open{
    background-image:none !important;   /* 真ん中の線を消す */
  }
  .vk-mobile-nav-menu-btn.menu-open:before{
    transform:translate(-50%,-50%) rotate(45deg);
  }
  .vk-mobile-nav-menu-btn.menu-open:after{
    transform:translate(-50%,-50%) rotate(-45deg);
  }

  /* ホバー／タップ */
  .vk-mobile-nav-menu-btn:hover,
  .vk-mobile-nav-menu-btn:active{
    background-color:var(--brand-dark) !important;
    transform:scale(1.05);
  }
  .vk-mobile-nav-menu-btn{ -webkit-tap-highlight-color:transparent; }
}

/* ============================================================
   2. スマホ 展開メニューパネル
   ============================================================ */
.vk-mobile-nav nav ul li a{
  border-left:4px solid var(--brand);
  border-bottom:1px solid rgba(0,0,0,.06);
  transition:background-color .2s ease;
}
.vk-mobile-nav nav ul li a:hover{
  background-color:rgba(0,0,0,.04);
  color:var(--brand-dark);
}

/* ============================================================
   3. グローバルナビ（PC）現在地・ホバー
   ============================================================ */
.global-nav-list > li.current-menu-item > a,
.global-nav-list > li > a:hover{ color:var(--brand) !important; }
.global-nav-list > li.current-menu-item > a::after,
.global-nav-list > li > a:hover::after{ background-color:var(--brand) !important; }

/* ============================================================
   4. リンク色
   ============================================================ */
.entry-content a:not(.wp-block-button__link):not(.vk_button_link){
  color:var(--brand) !important;
  text-underline-offset:2px;
}
.entry-content a:not(.wp-block-button__link):not(.vk_button_link):hover{
  color:var(--brand-dark) !important;
}

/* ============================================================
   5. ボタン（VK Button / コアボタン）
   ============================================================ */
.vk_button_link,
.wp-block-button__link{
  border-radius:999px !important;
  font-weight:700 !important;
  transition:transform .15s ease, box-shadow .2s ease, background-color .2s ease !important;
}
.vk_button_link:hover,
.wp-block-button__link:hover{ transform:translateY(-1px) !important; }

.vk_button-color-primary .vk_button_link,
.is-style-fill .wp-block-button__link{
  background:var(--brand) !important;
  border-color:var(--brand) !important;
  color:#fff !important;
}
.vk_button-color-primary .vk_button_link:hover,
.is-style-fill .wp-block-button__link:hover{
  background:var(--brand-dark) !important;
  border-color:var(--brand-dark) !important;
}

/* ============================================================
   6. 見出し vk_heading の下線・アクセント
   ============================================================ */
.vk_heading_title-style-plain-underline .vk_heading_title{
  border-bottom-color:var(--brand) !important;
}
.vk_heading_title-style-arrow .vk_heading_title::before,
.vk_heading_title-style-double_border .vk_heading_title{
  border-color:var(--brand) !important;
}


/* ============================================================
   8. パンくずの現在地色
   ============================================================ */
.breadcrumb .active,
.breadcrumb-item.active{ color:var(--brand-dark) !important; }