@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.9
*/

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

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

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

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

/* ===== AVLINE design 2026-10-08 (BEGIN) ===== */
/* 仕様: F:\REALINEAI\avrealine\av_P1デザイン仕様書_20261008.md（色を変える時は :root と仕様書の表を合わせる） */
/* 世界観「暗転したシアターとスクリーンの光」: 土台ネイビー・光るシアン・上端のカラーバー */
:root{--av-navy:#0D1F3C;--av-navy2:#173561;--av-navy3:#22477A;--av-text:#1B2430;--av-muted:#4A5868;--av-cyan:#0A6A80;--av-cyan-d:#08525F;--av-glow:#5CD6E8;--av-glow-l:#E3F6F9;--av-bg:#F3F6F9;--av-line:#D5DEE8;--av-foot:#C7D3E2;--av-radius:12px}
body{color:var(--av-text)}
a{color:var(--av-cyan)}
a:hover{color:var(--av-cyan-d)}
/* ヘッダー：上端のカラーバー・ロゴ・タグライン・ナビ */
#header-container::before{content:"";display:block;height:5px;background:linear-gradient(90deg,#E5484D 0 16.66%,#F5B83D 16.66% 33.33%,#3CB878 33.33% 50%,#5CD6E8 50% 66.66%,#3A8DDE 66.66% 83.33%,#8E6BD8 83.33% 100%)}
.logo-header img{height:56px;width:auto;max-height:none}
.tagline{color:var(--av-foot);font-size:12px;letter-spacing:.06em}
#navi .navi-in>ul>li>a{font-weight:700;letter-spacing:.03em}
#navi .navi-in>ul>li>a:hover,#navi .navi-in>ul>li>a:focus-visible{background:var(--av-navy);color:#fff;box-shadow:inset 0 -3px 0 var(--av-glow)}
/* 全ページ上部の検索ボックス */
.widget-content-top .wp-block-search__input,.widget-content-top .search-edit{border:2px solid var(--av-muted);border-radius:999px;background:#fff;padding-left:18px}
/* トップ（固定ページ本文の .av-top を CSS だけで上書き。本文は変更しない） */
body .av-top{color:var(--av-text)}
body .av-top a:not(.av-top-card){color:var(--av-cyan)}
body .av-top .av-top-hero{position:relative;background:var(--av-navy) url(https://av.realine.me/wp-content/uploads/2026/10/av-hero.jpg) right top/auto 250px no-repeat;border:0;border-radius:16px;color:var(--av-foot);box-shadow:0 12px 30px rgba(13,31,60,.25);padding:32px 42% 28px 32px}
body .av-top .av-top-hero::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;border-radius:16px 16px 0 0;background:linear-gradient(90deg,#E5484D 0 16.66%,#F5B83D 16.66% 33.33%,#3CB878 33.33% 50%,#5CD6E8 50% 66.66%,#3A8DDE 66.66% 83.33%,#8E6BD8 83.33% 100%)}
body .av-top .av-top-hero h1{color:#fff;font-size:1.6rem;text-wrap:balance;font-weight:800;letter-spacing:.02em}
body .av-top .av-top-hero .av-top-lead{color:var(--av-foot)}
/* ヒーロー内のカード2枚は、暗い面の外（下の段）に横いっぱいで並べる */
body .av-top .av-top-hero .av-top-grid{margin-right:-72%}
body .av-top .av-top-section,body .av-top .av-top-criteria,body .av-top .av-top-faq,body .av-top .av-top-search{border-color:var(--av-line);box-shadow:0 4px 16px rgba(13,31,60,.06)}
body .av-top h2{position:relative;background:none!important;border:0!important;border-radius:0!important;color:var(--av-navy)!important;font-size:1.3rem;font-weight:800;padding:.2em 0 .45em 0!important;margin-bottom:.6em;box-shadow:inset 0 -2px 0 var(--av-line)}
body .av-top h2::after{content:"";position:absolute;left:0;bottom:0;width:72px;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--av-cyan),var(--av-glow))}
body .av-top h2::before{display:none}
body .av-top .av-top-card:hover{border-color:var(--av-glow)}
/* トップのカード：タイトルにも半透明の暗い下地を敷く（明るい写真の上でも 4.5:1 を保つ。実測は tools\pp\card_contrast.js） */
body .av-top a.av-top-card .av-top-card-title{align-self:flex-start;padding:3px 10px;border-radius:10px;background:linear-gradient(90deg,rgba(7,18,30,.72) 0%,rgba(7,18,30,.5) 100%)}
body .av-top .av-top-button,body .av-top .av-top-search-button{background:var(--av-cyan)!important;color:#fff!important;border-color:var(--av-cyan)!important}
body .av-top .av-top-button:hover,body .av-top .av-top-search-button:hover{background:var(--av-cyan-d)!important}
/* 記事一覧：格子に固定し、自動広告の挿入枠で並びが崩れないようにする（広告の数・位置は変えない。dense は使わない） */
.list.ect-vertical-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.list.ect-vertical-card>.entry-card-wrap{width:auto;max-width:none;margin:0}
.list.ect-vertical-card>.google-auto-placed,.list.ect-vertical-card>ins.adsbygoogle{grid-column:1/-1;width:100%}
.list.ect-vertical-card>.google-auto-placed:has(ins[data-ad-status="unfilled"]),.list.ect-vertical-card>ins.adsbygoogle[data-ad-status="unfilled"]{display:none!important}
.archive-title{text-align:left;color:var(--av-navy)}
/* 記事カード */
.entry-card-wrap{background:#fff;border:1px solid var(--av-line);border-radius:var(--av-radius);overflow:hidden;box-shadow:0 1px 3px rgba(13,31,60,.06);transition:transform .15s,box-shadow .15s,border-color .15s}
.entry-card-wrap:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(13,31,60,.14);border-color:var(--av-glow)}
.entry-card-title{font-weight:700;color:var(--av-text);line-height:1.5}
.entry-card-snippet,.entry-card-meta,.post-date{color:var(--av-muted)}
.cat-label{background:var(--av-glow-l)!important;color:var(--av-navy)!important;border:0!important;border-radius:999px;font-weight:700;padding:2px 10px}
/* 記事・固定ページの見出し・目次（本文の直下の子だけ。カテゴリ案内などの箱の中は変えない） */
.article h1.entry-title{text-align:left;color:var(--av-navy);line-height:1.5}
.article .entry-content>h2{position:relative;background:var(--av-navy)!important;color:#fff!important;border:0!important;border-radius:10px;padding:.7em 1em .7em 1.2em;font-size:1.28em;overflow:hidden}
.article .entry-content>h2::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,#E5484D,#F5B83D,#3CB878,#5CD6E8,#3A8DDE,#8E6BD8)}
.article .entry-content>h3{background:none!important;color:var(--av-navy)!important;border:0!important;border-left:5px solid var(--av-cyan)!important;border-bottom:1px solid var(--av-line)!important;padding:.35em .6em}
.article .entry-content>h4{background:none!important;border:0!important;color:var(--av-navy);padding:.1em .1em .1em .9em;box-shadow:inset 3px 0 0 var(--av-glow)}
.entry-content>.toc{background:#fff;border:1px solid var(--av-line);border-top:5px solid var(--av-navy);border-radius:var(--av-radius)}
.entry-content>.toc .toc-title{color:var(--av-navy);font-weight:800}
.pr-label{border-color:var(--av-muted)!important;color:var(--av-muted)!important;background:#fff}
/* 関連記事・ページ送りの見出し */
.related-entry-heading,.comment-title{color:var(--av-navy)}
/* フッター：暗い地にロゴ（白文字のロゴなのでそのまま読める） */
.footer a{color:var(--av-foot)}
.footer a:hover,.navi-footer-in a:hover{color:var(--av-glow)}
.logo-footer img{height:48px;width:auto}
/* アクセシビリティの是正（表示のみ。Lighthouse の指摘: パンくず 2.84:1・参考価格 3.31:1・著者欄の文 3.51:1・検索ボタンの高さ） */
.breadcrumb-caption,.breadcrumb a,.breadcrumb .sp{color:var(--av-muted)}
.aap-price-block .aap-price-list{color:#5f5f5f}
.aap-author-profile p[style*="#3b82f6"]{color:#1d4ed8!important}
.search-box .search-submit,.search-edit+button,#content-top-in .search-box button{min-width:44px;min-height:32px}
/* フォーカスの見える化（明るい面はシアン、暗い面は光るシアン） */
a:focus-visible,.entry-card-wrap:focus-visible{outline:3px solid var(--av-cyan);outline-offset:2px}
#header a:focus-visible,#navi a:focus-visible,.footer a:focus-visible,body .av-top .av-top-hero a:focus-visible{outline-color:var(--av-glow)}
@media (prefers-reduced-motion:reduce){.entry-card-wrap{transition:none}.entry-card-wrap:hover{transform:none}}
/* レスポンシブ */
@media screen and (max-width:834px){
 .list.ect-vertical-card{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body .av-top .av-top-hero{padding:calc(35% + 16px) 18px 22px;background:var(--av-navy) url(https://av.realine.me/wp-content/uploads/2026/10/av-hero-sp.jpg) center top/100% auto no-repeat}
 body .av-top .av-top-hero .av-top-grid{margin-right:0}
 body .av-top .av-top-hero h1{font-size:1.45rem}
 .logo-header img{height:44px}
 /* スマホのヘッダーメニューは1列の横スクロールにする（並べ方を変えるのは .menu-mobile だけ。表示・非表示はテーマに任せる） */
 #navi .navi-in>ul.menu-mobile{display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
 #navi .navi-in>ul.menu-mobile>li{flex:0 0 auto;width:auto}
 #navi .navi-in>ul.menu-mobile>li>a{padding:0 14px;white-space:nowrap;font-size:13px}
}
@media screen and (max-width:480px){.list.ect-vertical-card{grid-template-columns:minmax(0,1fr)}}
/* ===== AVLINE design (END) ===== */