/* ============================================================
   nico-erodougazo-theme.css  (2026-07-13)
   サイト2「人妻・熟女 動画ナビ」(hitozuma-douga.com) 用
   参照デザイン: erodougazo.com（昔ながらのAVアフィリ風）
   狙い: 白背景 × オレンジ/赤アクセント × サンセリフ × 小サムネ密集グリッド
         ランク/NEWバッジ・作品情報テーブル・見出しの▶＋☆詳細
   Cocoon の追記CSSに丸ごと貼り付けて使う（旧 mature.css と差し替え）
   ============================================================ */

:root{
  --e-bg:#f4f4f4;        /* ページ背景（薄グレー） */
  --e-paper:#ffffff;     /* カード/本文の紙面 */
  --e-line:#e0e0e0;      /* 罫線 */
  --e-text:#222222;      /* 本文 */
  --e-sub:#777777;       /* 補足テキスト */
  --e-orange:#ff6a00;    /* メインアクセント（見出し・タブ・NEW） */
  --e-orange-d:#e85d00;
  --e-red:#e2231a;       /* ランク・警告・CTA */
  --e-pink:#fff0f3;      /* 警告バー背景 */
  --e-link:#1a6fd6;      /* ジャンル等のテキストリンク（青） */
  --e-head:#2b2b2b;
}

/* ---- 全体（Cocoonの暗色前提を白基調へ上書き） ---- */
body,#container,#wrap,.wrap,#main,#content,.main,.content-in{
  background:var(--e-bg)!important; color:var(--e-text)!important;
}
body{
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo","Noto Sans JP",sans-serif!important;
  letter-spacing:0; line-height:1.6;
}
a{ color:var(--e-link)!important; }
#content,.content-in,.main{ background:transparent!important; }
/* Cocoonの黄スキンがリンク/アクセントに滲むのを抑止（本文・見出し・強調の色を確定） */
.entry-content a,.article a,.post-content a,.widget a,#sidebar a{ color:var(--e-link)!important; }
.go-to-top-button,.go-to-top,.rank-num,.keyword,.entry-content strong{ color:inherit; }
::selection{ background:var(--e-orange); color:#fff; }

/* ---- ヘッダー：白地・細ライン。ロゴはカラフルに ---- */
#header,.header-container,.header-container-in,#header-container{
  background:#ffffff!important;
  border-bottom:3px solid var(--e-orange)!important;
  box-shadow:0 1px 4px rgba(0,0,0,.12);
}
.site-name-text,#site-title a,.site-name a{
  color:var(--e-orange)!important; font-weight:900!important;
  letter-spacing:.02em; font-family:inherit!important;
  text-shadow:1px 1px 0 #ffd28a, 2px 2px 0 rgba(226,35,26,.25);
}
.site-description,#site-description{
  color:var(--e-sub)!important; letter-spacing:0; font-size:12px; font-weight:400;
}

/* ---- グローバルナビ：白タブ＋オレンジのアクティブ ---- */
#navi,.navi-in,#navi .navi-in>ul{
  background:#fafafa!important; border-top:1px solid var(--e-line)!important;
  border-bottom:1px solid var(--e-line)!important;
}
#navi ul li a{
  color:#333!important; font-weight:700; letter-spacing:0;
  border-right:1px solid var(--e-line);
}
#navi ul li a:hover,#navi ul li.current-menu-item>a{
  background:var(--e-orange)!important; color:#fff!important;
}
#navi ul li a::before{ content:none!important; }
#navi ul ul{ background:#fff!important; border:1px solid var(--e-line); }
#navi ul ul li a{ color:#333!important; }

/* ---- 年齢確認バー（記事上や告知ウィジェット向け・薄ピンク赤字） ---- */
.age-warning,.r18-notice,.appeal,.info-box,.blank-box.bb-warning{
  background:var(--e-pink)!important; border:1px solid #f3b9c1!important;
  color:var(--e-red)!important; font-weight:700; border-radius:3px; padding:8px 12px;
}

/* ---- 見出し：▶付きオレンジ帯＋下線（トップの「☆人気ランキング」風） ---- */
.article h2,.entry-content h2,.widget-title,.sidebar h3,.widget h3{
  color:var(--e-head)!important; background:#fff!important;
  border:none!important; border-bottom:3px solid var(--e-orange)!important;
  border-left:none!important; padding:.35em .2em .3em .9em!important;
  font-weight:800!important; letter-spacing:.02em; position:relative; border-radius:0!important;
}
.article h2::before,.entry-content h2::before,.widget-title::before,.sidebar h3::before,.widget h3::before{
  content:"\25B6"; color:var(--e-orange); font-size:.8em;
  position:absolute; left:.15em; top:50%; transform:translateY(-45%);
}
.article h3,.entry-content h3{
  color:var(--e-head)!important; border-left:5px solid var(--e-orange)!important;
  border-bottom:1px dotted var(--e-line)!important; background:#fff!important;
  padding:.3em .6em!important; font-weight:700;
}

/* ---- 記事カード：小さめサムネの密集グリッド。白カード・細枠 ---- */
.entry-card,.a-wrap,.widget-entry-cards .a-wrap,.card,.entry-card-wrap{
  background:var(--e-paper)!important; border:1px solid var(--e-line)!important;
  border-radius:2px!important; box-shadow:none!important; overflow:hidden;
  transition:border-color .15s, box-shadow .15s;
}
.entry-card:hover,.a-wrap:hover{
  border-color:var(--e-orange)!important; box-shadow:0 2px 10px rgba(255,106,0,.22)!important;
  transform:none!important;
}
.card-thumb,.entry-card-thumb,.entry-card-thumb-image,.card-thumb-image{
  background:#20222a!important; position:relative; overflow:hidden;
}
.card-thumb-image,.entry-card-thumb-image,.entry-card-thumb img{
  width:100%!important; height:auto; aspect-ratio:16/10; object-fit:cover; display:block;
}
/* サムネ中央に半透明の再生ボタン（erodougazo風）。ホバーでオレンジ点灯 */
.entry-card-thumb::after,.card-thumb::after{
  content:""; position:absolute; left:50%; top:50%; width:34px; height:34px;
  transform:translate(-50%,-50%); border-radius:50%; border:2px solid rgba(255,255,255,.65);
  background:rgba(0,0,0,.35) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='14' viewBox='0 0 12 14'%3E%3Cpath d='M1 1l10 6-10 6z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center;
  transition:background-color .15s,border-color .15s; pointer-events:none; z-index:2;
}
.entry-card:hover .entry-card-thumb::after,.a-wrap:hover .card-thumb::after{
  border-color:var(--e-orange); background-color:var(--e-orange);
}
/* サムネ左上に「NEW」バッジ（Cocoonの新着ラベル/自前spanを流用） */
.entry-card-thumb .new-mark,.cat-label.new,.new-badge{
  background:var(--e-red)!important; color:#fff!important; font-weight:800;
  font-size:11px; padding:1px 7px; border-radius:2px; letter-spacing:.03em;
}

/* ---- カードタイトル：小さめ・2行省略・黒字→hoverでオレンジ ---- */
.entry-card-title,.card-title{
  color:var(--e-text)!important; font-size:.86rem!important; font-weight:600!important;
  line-height:1.45!important; letter-spacing:0; padding:7px 8px;
  display:-webkit-box!important; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden!important; max-height:calc(1.45em * 2 + 14px); /* 2行で確実に切る（枠外はみ出し防止） */
}
.entry-card-title a,.card-title a{ color:var(--e-text)!important; }
.entry-card:hover .entry-card-title,.a-wrap:hover .entry-card-title{ color:var(--e-orange)!important; }
.entry-card-snippet{ display:none; } /* erodougazo風にスニペットは省いて密度を上げる */

/* ---- カテゴリ／タグ：青リンク調のチップ（ジャンル一覧風） ---- */
.entry-card-categorys a,.cat-label,.category a,.tag a,.post-tag a,.entry-tags a{
  background:#eef4fb!important; color:var(--e-link)!important;
  border:1px solid #cfe0f2!important; border-radius:3px;
  font-size:11px!important; padding:1px 7px!important; text-decoration:none;
}
.entry-card-categorys a:hover,.tag a:hover{ background:var(--e-link)!important; color:#fff!important; }
.entry-card-meta,.card-meta,.post-meta,.date-tags{ color:var(--e-sub)!important; font-size:11px; }

/* ---- パンくず ---- */
#breadcrumb,.breadcrumb,.breadcrumbs{
  background:#fff!important; border:1px solid var(--e-line)!important;
  color:var(--e-sub)!important; font-size:12px; padding:6px 10px;
}
#breadcrumb a,.breadcrumb a{ color:var(--e-link)!important; }

/* ---- 単一記事 ---- */
.article,.entry-content,.post-content{ background:var(--e-paper)!important; color:var(--e-text)!important; }
.entry-title,.article h1{
  color:#111!important; line-height:1.45; font-weight:800;
  border-left:6px solid var(--e-red); padding-left:.5em; background:#fff!important;
}
.article a{ color:var(--e-link); }
.post-date,.date,.entry-card-meta .date{ color:var(--e-sub)!important; }

/* ---- 作品情報テーブル（品番/メーカー/ジャンル 等）---- */
table,.dboi-table,.item-table{
  border-collapse:collapse; width:100%; background:#fff!important; border:1px solid var(--e-line)!important;
}
th,td,.dboi-table td,.dboi-table th{ border:1px solid var(--e-line)!important; color:var(--e-text)!important; padding:6px 10px; }
th,.dboi-table th{
  background:#f3f3f3!important; color:#333!important; font-weight:700; width:26%; white-space:nowrap;
}
tr:nth-child(even) td{ background:#fafafa!important; }

/* ---- CTA/ボタン：赤〜オレンジの「無料動画」ボタン ---- */
.btn-shine,.wp-block-button__link,a.btn,.dboi-btn,.go-btn,.sample-btn,
.entry-content .btn,.btn-red,.btn-orange{
  background:linear-gradient(180deg,#ff7a1a,#e2231a)!important; color:#fff!important;
  font-weight:800!important; border:none!important; border-radius:4px!important;
  box-shadow:0 2px 0 #b81a12!important; letter-spacing:.03em; text-shadow:0 1px 1px rgba(0,0,0,.25);
}
.btn-shine:hover,.wp-block-button__link:hover,.btn-red:hover,.btn-orange:hover{
  filter:brightness(1.05); box-shadow:0 1px 0 #b81a12!important; transform:translateY(1px);
}

/* ---- 関連作品（nico-related）---- */
.nico-related{ background:#fff!important; border:1px solid var(--e-line)!important; }
.nico-related h2{ color:var(--e-head)!important; background:#fff!important; border-bottom:3px solid var(--e-orange)!important; border-left:none!important; }
.nico-related a{ color:var(--e-link)!important; }

/* ---- ページャ ---- */
.pagination .page-numbers,.page-numbers{
  background:#fff!important; color:var(--e-text)!important; border:1px solid var(--e-line)!important; border-radius:3px;
}
.pagination .current,.page-numbers.current{ background:var(--e-orange)!important; color:#fff!important; border-color:var(--e-orange)!important; }

/* ---- サイドバー／ウィジェット ---- */
.widget,#sidebar .widget{ background:#fff!important; border:1px solid var(--e-line)!important; border-radius:3px; }
#sidebar a,.widget a{ color:var(--e-link)!important; }

/* ---- ランキング用の順位バッジ（自前 .rank-badge を付けた場合に効く）---- */
.rank-badge{
  position:absolute; left:0; top:0; z-index:3;
  background:var(--e-red); color:#fff; font-weight:900; font-size:12px;
  padding:2px 8px; border-radius:0 0 4px 0; box-shadow:0 1px 3px rgba(0,0,0,.3);
}
.rank-badge.r1{ background:#e2231a; } .rank-badge.r2{ background:#ff6a00; }
.rank-badge.r3{ background:#f0a500; } .rank-badge.r4,.rank-badge.r5{ background:#888; }

/* ---- フッター ---- */
#footer,.footer-in,#footer-in{
  background:#fff!important; color:var(--e-sub)!important; border-top:3px solid var(--e-orange)!important;
}
#footer a{ color:var(--e-sub)!important; }

/* ---- スマホ最適化：2カラムの小サムネ密集 ---- */
@media screen and (max-width:834px){
  .entry-card-title,.card-title{ -webkit-line-clamp:2; font-size:.82rem!important; }
  th,.dboi-table th{ width:34%; }
}
