@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){
  /*必要ならばここにコードを書く*/
}


/*============================================================
  AI副業ラボ ブランドUI 2026-07-05（紺×青／CTAオレンジ）
============================================================*/
:root{
  --brand-navy:#0d2340;
  --brand-navy2:#16345a;
  --brand-blue:#2f6fb0;
  --brand-blue-d:#21507f;
  --brand-blue-l:#eef4fb;
  --brand-cta:#e8720c;
}
/* --- グローバルナビ（紺ベース） --- */
#navi{ background:var(--brand-navy); border:none; }
#navi .navi-in > ul > li > a,
#navi .navi-in ul li a{ color:#e8f0fa; font-weight:600; }
#navi .navi-in > ul > li > a:hover,
#navi .navi-in ul li a:hover{ background:var(--brand-navy2); color:#fff; }
#navi .navi-in .sub-menu{ background:var(--brand-navy2); }
#navi .navi-in .sub-menu li a{ color:#e8f0fa; }
#navi .navi-in .sub-menu li a:hover{ background:var(--brand-navy); }
/* --- 見出し --- */
.entry-content h2{
  background:var(--brand-blue-l);
  border-left:6px solid var(--brand-blue);
  border-bottom:none;
  color:var(--brand-navy);
  border-radius:0 4px 4px 0;
  padding:.55em .8em;
}
.entry-content h3{
  border-left:5px solid var(--brand-blue);
  border-bottom:1px solid #e3e9f0;
  color:var(--brand-navy2);
  padding:.2em .6em;
}
/* --- 本文リンク（青） --- */
.entry-content a{ color:var(--brand-blue); }
.entry-content a:hover{ color:var(--brand-blue-d); }
/* --- カテゴリラベル（紺ピル） --- */
.cat-label, .cat-labels .cat-label, a.cat-label{
  background:var(--brand-navy) !important;
  color:#fff !important;
  border:1px solid var(--brand-navy) !important;
}
/* --- カード hover 質感 --- */
.entry-card-wrap, .a-wrap, .blogcard, .cta-card{
  transition:box-shadow .2s ease, transform .2s ease;
}
.entry-card-wrap:hover, .a-wrap:hover, .blogcard:hover{
  box-shadow:0 8px 24px rgba(13,35,64,.13);
  transform:translateY(-3px);
}
/* --- サイドバー見出し（青下線） --- */
.sidebar h3, .widget-sidebar-label{
  border-bottom:2px solid var(--brand-blue);
  color:var(--brand-navy);
}
/* ====== トップLP（front-top-page）の整理 ====== */
.front-top-page .entry-title,
.front-top-page .date-tags,
.front-top-page .post-date,
.front-top-page time.post-date,
.front-top-page .sns-share,
.front-top-page .sns-share-message,
.front-top-page .sns-follow,
.front-top-page .toc{ display:none !important; }


/*============================================================
  AI副業ラボ 可読性パス 2026-07-05
============================================================*/
/* 本文の行間・段落余白 */
.entry-content{ line-height:1.9; }
.entry-content p{ margin:0 0 1.4em; }
.entry-content ul, .entry-content ol{ margin:1em 0 1.5em; line-height:1.85; }
.entry-content li{ margin-bottom:.45em; }
/* 見出し前の余白でセクション分離 */
.entry-content h2{ margin-top:2.4em; }
.entry-content h3{ margin-top:1.8em; }
.entry-content h2:first-child, .entry-content > p:first-child{ margin-top:.2em; }
/* 本文リンクは下線で識別 */
.entry-content p a, .entry-content li a{ text-decoration:underline; text-underline-offset:2px; }
/* 内部リンクボックス内リンクは下線オフで見やすく */
.entry-content div[style*="f5f8fc"] a, .entry-content div[data-relbox] a{ text-decoration:none; }
/* 表はモバイルで横スクロール */
@media screen and (max-width:834px){
  .entry-content table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .entry-content{ font-size:16.5px; line-height:1.85; }
  .article h2, .entry-content h2{ font-size:1.2em; }
  #navi .navi-in ul li a{ padding:.9em .4em; }
}
/* フッター紺 */
.footer, #footer{ background:var(--brand-navy); }
.footer, .footer a, #footer, #footer a{ color:#cfe0f0; }

/* LPカード：常時の影＋角丸で立体感（可視性UP） */
.front-top-page .entry-content a[style*="e5e7eb"],
.front-top-page .entry-content div[style*="e5e7eb"]{
  box-shadow:0 3px 16px rgba(13,35,64,.08);
  border-radius:12px;
  transition:box-shadow .2s ease, transform .2s ease;
}
.front-top-page .entry-content a[style*="e5e7eb"]:hover{
  box-shadow:0 10px 28px rgba(13,35,64,.16);
  transform:translateY(-3px);
}

/* LPの空カード（重複アンカー）を非表示＝空ボックス除去 */
.front-top-page .entry-content a[style*="e5e7eb"]:empty{ display:none !important; }


/* ====== AI副業ラボ ブランドUI パス3（サイト価値向上）2026-07-14 ====== */

/* --- ヘッダー：紺グラデのブランドヘッダー（ナビと一体化） --- */
#header-container{background:linear-gradient(135deg,#0d2340 0%,#1c3f63 100%);border-bottom:none}
#header .site-name-text,#header a.site-name{color:#fff;font-weight:700;letter-spacing:.08em}
#header a.site-name:hover .site-name-text{opacity:.85}
#header .tagline{color:#b9cbe0;font-size:12px;letter-spacing:.04em}
#navi{border-top:1px solid rgba(255,255,255,.14)}

/* --- サイドバー：検索ボックスをブランド化 --- */
.sidebar .wp-block-search__input{border:1px solid #c9d6e4;border-radius:8px 0 0 8px;padding:9px 12px;font-size:16px;background:#fff}
.sidebar .wp-block-search__input:focus{outline:none;border-color:#2f6fb0}
.sidebar .wp-block-search__button{background:#1c3f63;color:#fff;border:none;border-radius:0 8px 8px 0;margin-left:0;padding:9px 16px;cursor:pointer;transition:background .2s}
.sidebar .wp-block-search__button:hover{background:#2f6fb0}
.sidebar .wp-block-search__label{font-size:13px;color:#5a6b7e;font-weight:700}

/* --- サイドバー：見出し付きウィジェットをカード化（紺バー見出し） --- */
.sidebar .widget_block:has(h2.wp-block-heading){background:#fff;border:1px solid #e3eaf2;border-radius:10px;overflow:hidden;padding:0}
.sidebar .widget_block h2.wp-block-heading{background:#0d2340;color:#fff;font-size:14px;font-weight:700;letter-spacing:.06em;padding:11px 14px;margin:0;border-radius:0;border:none}
.sidebar ul.wp-block-latest-posts,.sidebar ul.wp-block-categories{margin:0;padding:6px 14px 10px;list-style:none}
.sidebar ul.wp-block-latest-posts>li{padding:10px 0;margin:0;border-bottom:1px dashed #d9e3ee}
.sidebar ul.wp-block-latest-posts>li:last-child{border-bottom:none}
.sidebar ul.wp-block-latest-posts>li>a{color:#2c3e50;font-size:14px;line-height:1.65;display:block;text-decoration:none}
.sidebar ul.wp-block-latest-posts>li>a:hover{color:#2f6fb0}
.sidebar ul.wp-block-categories li{margin:0;border-bottom:1px dashed #d9e3ee}
.sidebar ul.wp-block-categories li:last-child{border-bottom:none}
.sidebar ul.wp-block-categories li a{display:block;padding:10px 0 10px 16px;position:relative;color:#2c3e50;font-size:14px;text-decoration:none}
.sidebar ul.wp-block-categories li a:before{content:"▶";position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:9px;color:#2f6fb0}
.sidebar ul.wp-block-categories li a:hover{color:#2f6fb0}

/* --- 目次：ブランドカード化 --- */
.toc.border-element{display:block;max-width:680px;margin:1.8em auto;border:1px solid #dfe8f1;border-radius:10px;background:#f7fafd;padding:2px 22px 14px;box-shadow:0 2px 8px rgba(13,35,64,.05)}
.toc .toc-title{color:#0d2340;font-weight:700;font-size:16px;letter-spacing:.06em;padding:12px 0 9px;border-bottom:2px solid #2f6fb0;margin:0 0 10px}
.toc .toc-content{font-size:14.5px}

/* --- シェアボタン：ブランドトーンに統一 --- */
.sns-share a.share-button{background:#fff !important;border:1px solid #dfe8f1 !important;border-radius:8px;color:#5a6b7e !important;transition:all .2s}
.sns-share a.share-button .social-icon,.sns-share a.share-button .button-caption{color:#5a6b7e !important}
.sns-share a.share-button:hover{background:#eef4fa !important;border-color:#bcd0e4 !important}
.sns-share a.share-button:hover .social-icon,.sns-share a.share-button:hover .button-caption{color:#1c3f63 !important}

/* --- 一覧（アーカイブ/検索結果）：記事カード化 --- */
.list .entry-card-wrap.a-wrap{background:#fff;border:1px solid #e3eaf2;border-radius:12px;padding:14px 16px;margin-bottom:18px}
.list .entry-card-wrap.a-wrap:hover{border-color:#cfdcea}
.entry-card-thumb img{border-radius:8px}
.archive-title{font-size:20px;background:#eef4fa;border-left:5px solid #2f6fb0;padding:8px 14px;border-radius:4px;color:#0d2340}

/* --- 関連記事・コメント見出しをh2様式に統一 --- */
h2.related-entry-heading,.comment-title{background:#eef4fa;border-left:5px solid #2f6fb0;padding:8px 14px;border-radius:4px;font-size:18px;color:#0d2340}

/* --- 前後記事ナビ --- */
.pager-post-navi a{border:1px solid #e3eaf2;border-radius:10px;transition:background .2s}
.pager-post-navi a:hover{background:#f2f7fc}

/* --- トップへ戻るボタン --- */
.go-to-top-button{background:rgba(13,35,64,.85) !important;color:#fff !important;border-radius:50% !important}
.go-to-top-button:hover{background:#2f6fb0 !important}

/* --- モバイル微調整 --- */
@media (max-width:834px){
  #header .site-name-text{font-size:22px}
  .toc.border-element{padding:2px 14px 12px}
  .list .entry-card-wrap.a-wrap{padding:12px}
}