@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}


/* ===== ザワ速 カスタムデザイン v1 (2026-06 / アニゲーまとめ風) ===== */
:root{
  --zw-accent:#5b3df5;   /* 主役: ビビッド紫青 */
  --zw-accent2:#ff2d70;  /* 差し色: ホットピンク */
  --zw-dark:#161a2e;     /* ヘッダー濃紺 */
  --zw-bg:#eceef3;       /* 背景ライトグレー */
}
body{ background:var(--zw-bg); }

/* ヘッダー：濃紺グラデ */
.header-container,#header,.header-container-in{
  background:linear-gradient(100deg,#161a2e 0%,#2a2350 55%,#3b2a6b 100%) !important;
}
.site-name-text,.site-name a,.logo-header a,#site-title a{
  color:#fff !important; font-weight:900 !important; letter-spacing:.02em;
  text-shadow:0 0 10px rgba(123,92,255,.55);
}
.tagline,.site-description{ color:#c7c9e6 !important; }

/* グローバルナビ */
#navi,.navi-in{ background:var(--zw-accent) !important; }
#navi .navi-in>ul>li>a{ color:#fff !important; font-weight:700; }
#navi .navi-in>ul>li>a:hover,#navi .navi-in>ul>li.current-menu-item>a{ background:rgba(255,255,255,.2) !important; }

/* リンク色 */
.entry-content a{ color:var(--zw-accent); }

/* 記事タイトル */
.entry-title,.article-title{ font-weight:900; line-height:1.35; }

/* 本文 h2：まとめ風（左バー＋淡色背景） */
.entry-content h2{
  position:relative; background:#f1edff; color:#1d1740;
  border:none; border-left:7px solid var(--zw-accent);
  border-radius:6px; padding:.6em .8em; font-weight:900; margin:1.8em 0 .9em;
}
/* 本文 h3：アクセント下線 */
.entry-content h3{
  border:none; border-bottom:3px solid var(--zw-accent2);
  color:#222; font-weight:800; padding:.2em .1em .35em; margin:1.4em 0 .7em;
}

/* インデックスのカード */
.entry-card-wrap,.related-entry-card-wrap{ transition:transform .15s ease,box-shadow .15s ease; }
.entry-card,.list .entry-card-wrap .entry-card{
  background:#fff; border:none; border-radius:12px;
  box-shadow:0 2px 10px rgba(20,26,46,.08); overflow:hidden;
}
.entry-card-wrap:hover{ transform:translateY(-4px); box-shadow:0 8px 22px rgba(91,61,245,.18); }
.entry-card-title,.card-title{ font-weight:800; line-height:1.4; color:#1a1a2e; }
.entry-card-wrap:hover .entry-card-title{ color:var(--zw-accent); }

/* カテゴリーラベル */
.cat-label{ background:var(--zw-accent2) !important; border:none !important; border-radius:4px !important; font-weight:700; }

/* ボタン */
.btn,.more-button{ background:var(--zw-accent); border:none; color:#fff; border-radius:8px; }

/* サイドバー見出し */
.widget .widget-title,.sidebar h3{
  background:var(--zw-dark); color:#fff; border-left:6px solid var(--zw-accent2);
  border-radius:4px; padding:.5em .7em;
}

@media screen and (max-width:480px){
  .entry-content h2{ font-size:1.1em; }
  .site-name-text,.site-name a{ font-size:1.25em !important; }
}
/* ===== /ザワ速 カスタムデザイン v1 ===== */

/* ===== ザワ速 デバイス別広告表示 2026-07-18 ===== */
@media screen and (min-width:835px){ .zw-sp-only{display:none !important;} }
@media screen and (max-width:834px){ .zw-pc-only{display:none !important;} }
/* ===== /ザワ速 デバイス別広告表示 ===== */

/* ===== ザワ速 モバイルヘッダー調整（ハンバーガー右スライド／親指サイズ／ヒーロー密着）2026-07-21 ===== */
@media screen and (max-width:834px){
  /* B-5. ヒーロー上のグレー余白を削除（Cocoonの body{margin-top:50px} 対策） */
  body:where(.mblt-header-mobile-buttons, .mblt-header-and-footer-mobile-buttons){
    margin-top:0 !important;
  }
  .header-container{ margin-top:0 !important; padding-top:0 !important; }

  /* B-6. ヒーロー(ザワ速)の上下パディングをコンパクト化 */
  #header-in, .header-in{
    padding: 2px 12px !important;
    min-height: auto !important;
  }
  .site-name{ margin:0 !important; padding:0 !important; }
  .site-name-text, .site-name a{
    font-size: 22px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 2px 0 !important;
  }
  .tagline, .site-description{
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }
  .logo-header{ margin:0 !important; padding:0 !important; }

  /* ハンバーガーを #header 内・右上に固定 */
  #header{ position:relative; }
  .mobile-header-menu-buttons{
    position:absolute !important; left:auto !important; right:4px !important;
    top:0 !important; bottom:0 !important; width:auto !important; height:100% !important;
    display:flex !important; align-items:center !important;
    background:transparent !important; box-shadow:none !important; border:none !important; z-index:10;
  }
  .mobile-header-menu-buttons .logo-menu-button,
  .mobile-header-menu-buttons .search-menu-button{ display:none !important; }
  .mobile-header-menu-buttons .menu-button,
  .mobile-header-menu-buttons .menu-icon,
  .mobile-header-menu-buttons .menu-caption{ color:#fff !important; }

  /* A-1. ハンバーガーボタンを親指サイズ（min 56x52）へ拡大 */
  .mobile-header-menu-buttons .menu-button{
    width:auto !important; min-width:56px !important; min-height:52px !important;
    padding: 0 !important;
  }
  .mobile-header-menu-buttons .menu-button label#navi-menu-open, /* 2026-07-21fix: labelのままだと全画面黒オーバーレイ #navi-menu-close にも当たりスマホが真っ黒になる */
  .mobile-header-menu-buttons .menu-button-in,
  .mobile-header-menu-buttons .menu-open{
    display:flex !important; flex-direction:column !important;
    align-items:center !important; justify-content:center !important;
    min-width:56px !important; min-height:52px !important;
    padding: 4px 10px !important; box-sizing:border-box !important;
    cursor:pointer !important;
  }
  .mobile-header-menu-buttons .menu-icon,
  .mobile-header-menu-buttons .menu-icon .fa,
  .mobile-header-menu-buttons .menu-icon .fa-bars{
    font-size: 26px !important;
    line-height: 1 !important;
  }
  .mobile-header-menu-buttons .menu-caption{
    font-size: 11px !important;
    margin-top: 2px !important;
    line-height: 1.1 !important;
  }

  /* A-2. ドロワーメニューを右からスライドイン（Cocoon既定は左） */
  .navi-menu-content{
    left: auto !important; right: 0 !important;
    -webkit-transform: translateX(105%) !important;
            transform: translateX(105%) !important;
  }
  #navi-menu-input:checked ~ #navi-menu-content{
    -webkit-transform: translateX(0) !important;
            transform: translateX(0) !important;
  }

  /* A-3. メニュー内の各項目を大きく（最低 48px タップ領域＋16px フォント） */
  .menu-drawer{ padding: 6px 0 40px !important; }
  .menu-drawer li{ border-bottom: 1px solid #f0edff; }
  .menu-drawer li:last-child{ border-bottom: none; }
  .menu-drawer li a{
    display:flex !important; align-items:center !important;
    min-height: 52px !important;
    padding: 14px 20px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: #1d1740 !important;
    text-decoration: none !important;
  }
  .menu-drawer .sub-menu{ padding-left: 0 !important; background:#faf8ff; }
  .menu-drawer .sub-menu li a{
    padding-left: 40px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #3b2a6b !important;
  }
}

/* A-4. ドロワー内サブメニュー（アンテナサイト等）をクリックで開閉。
   Cocoon の drawerCloser がメニュー全体を閉じるのを capture 段階で止める。
   実際の click 制御・zw-open トグル・メニュー閉時リセットは functions.php の JS 側。 */
.menu-drawer .menu-item-has-children > .sub-menu{ display:none; }
.menu-drawer .menu-item-has-children.zw-open > .sub-menu{ display:block; }
.menu-drawer .menu-item-has-children > a{ position:relative; padding-right:44px !important; }
.menu-drawer .menu-item-has-children > a::after{
  content:"＋"; position:absolute; right:18px; top:50%;
  transform: translateY(-50%);
  font-size:20px; font-weight:700; opacity:.7;
}
.menu-drawer .menu-item-has-children.zw-open > a::after{ content:"−"; }
/* ===== /ザワ速 モバイルヘッダー調整 ===== */