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

/*
 * 巨乳おすすめ動画レビュー — Cocoon カスタムCSS v2
 * カラーテーマ: ピンク系（熟女サイトの赤と差別化）
 * ベースカラー: #e91e8c (ホットピンク)
 * アクセントカラー: #ff69b4 (ライトピンク)
 * 更新: 2026-06-03 Issue #247
 */

/* ===== Google Fonts ===== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@400;700&display=swap');

/* ===== トップバー ===== */
#site-topbar {
  background: linear-gradient(90deg, #e91e8c 0%, #c2185b 100%);
  padding: 6px 0;
  width: 100%;
  position: relative;
  z-index: 200;
}

#site-topbar-in {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px 0 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.topbar-text {
  color: #ffffff;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.topbar-date {
  color: #fce4ec;
  font-size: 11px;
}

/* ===== ベース ===== */
body,
#wrapper {
  background: #ffffff;
  color: #1a1a1a;
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 14px;
}

/* ===== ヘッダー + ナビ ===== */
#header-container,
.header-container {
  background: #ffffff !important;
  border-bottom: 3px solid #e91e8c !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

#header-container-in,
.header-container-in {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  grid-template-rows: 64px !important;
  align-items: center !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  position: static !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#header,
.header {
  grid-column: 1 !important;
  position: static !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  height: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: fit-content !important;
  display: flex !important;
  align-items: center !important;
}

#header-in,
.header-in {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 0 !important;
  min-height: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: fit-content !important;
}

.logo.logo-header {
  order: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* サイトタイトル: Noto Serif JP */
#header .site-name-text,
#header-in .site-name-text,
h1.logo-header .site-name-text,
.logo-header .site-name-text {
  font-family: 'Noto Serif JP', serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  letter-spacing: 0.02em !important;
  line-height: 1.1 !important;
}

#header .site-name-text-link,
#header .site-name-text-link:link,
#header .site-name-text-link:visited,
#header .site-name-text-link:hover,
#header .site-name-text-link:active {
  color: #1a1a1a !important;
  text-decoration: none !important;
}

/* 「巨乳」ピンク字スパン */
#header .title-accent-pink {
  color: #e91e8c !important;
}

.tagline {
  order: 2 !important;
  color: #9ca3af !important;
  font-size: 10px !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-top: 4px !important;
}

/* ===== ナビゲーション ===== */
#navi {
  grid-column: 2 !important;
  position: static !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  align-self: center !important;
  overflow: visible !important;
}

#navi-in {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: auto !important;
  max-width: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

#navi ul.menu-pc {
  display: flex !important;
  flex-direction: row !important;
  list-style: none !important;
  gap: 4px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#navi ul.menu-mobile,
#navi .navi-menu-button {
  display: none !important;
}

#navi .menu-pc > li {
  width: auto !important;
  min-width: 0 !important;
}

#navi .menu-pc > li > a {
  color: #4b5563 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 8px 14px !important;
  border-radius: 4px !important;
  display: block !important;
  transition: color 0.2s, background 0.2s !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  width: auto !important;
}

#navi .menu-pc > li > a:hover,
#navi .menu-pc > li.current-menu-item > a {
  color: #e91e8c !important;
  background: #fce4ec !important;
}

#navi .caption-wrap,
#navi .item-label {
  display: inline !important;
  width: auto !important;
  padding: 0 !important;
}

/* ===== リンク全般 ===== */
a {
  color: #e91e8c;
  text-decoration: none;
  transition: color 0.2s;
}

a:hover {
  color: #c2185b;
}

/* ===== 見出し ===== */
.entry-title,
.entry-card-title,
.article-title {
  font-family: 'Noto Serif JP', serif !important;
}

h2 {
  border-left: 4px solid #e91e8c !important;
  padding-left: 12px !important;
  color: #1a1a1a;
  font-weight: 700;
  margin-top: 1.8em;
  margin-bottom: 0.8em;
  background: none !important;
}

h3 {
  border-left: 4px solid #e91e8c !important;
  padding-left: 10px !important;
  color: #1a1a1a;
  font-weight: 700;
  margin-top: 1.5em;
  margin-bottom: 0.6em;
  background: none !important;
}

/* ===== 記事カード（グリッド強化）===== */
.entry-card-wrap,
.a-wrap {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.entry-card-wrap:hover,
.a-wrap:hover {
  border-color: #e91e8c !important;
  box-shadow: 0 6px 20px rgba(233, 30, 140, 0.12) !important;
  transform: translateY(-2px);
  text-decoration: none;
}

/* サムネイル: アスペクト比固定で映えレイアウト */
.entry-card-thumb,
.a-wrap .entry-card-thumb {
  background: #f3f4f6;
  overflow: hidden;
  position: relative;
  aspect-ratio: 16 / 9;
}

.entry-card-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s ease;
}

.entry-card-wrap:hover .entry-card-thumb img,
.a-wrap:hover .entry-card-thumb img {
  transform: scale(1.06);
}

.entry-card-content {
  padding: 14px 16px !important;
  background: #ffffff !important;
}

.entry-card-title {
  color: #1a1a1a !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  margin-bottom: 6px;
  font-family: 'Noto Serif JP', serif !important;
}

.entry-card-wrap:hover .entry-card-title,
.a-wrap:hover .entry-card-title {
  color: #e91e8c !important;
}

.entry-card-snippet {
  color: #6b7280;
  font-size: 12px;
  line-height: 1.6;
}

/* カテゴリーラベル */
.cat-label,
.entry-card-content .cat-label {
  background: #e91e8c !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 700;
  padding: 2px 8px !important;
  border-radius: 3px !important;
  border: none !important;
}

.cat-label-0 { background: #e91e8c !important; }
.cat-label-1 { background: #f06292 !important; }
.cat-label-2 { background: #9ca3af !important; }

/* ===== サイドバー ===== */
#sidebar {
  background: transparent;
}

.widget {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 16px !important;
  margin-bottom: 24px !important;
  box-shadow: none !important;
}

.widget:first-child {
  border-top: 3px solid #e91e8c !important;
}

.widget-title {
  color: #1a1a1a !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: none !important;
}

.widget a {
  color: #374151;
  font-size: 12px;
  line-height: 1.5;
}

.widget a:hover {
  color: #e91e8c;
}

/* ===== フッター ===== */
#footer,
.footer-in {
  background: #1a1a1a !important;
  color: #9ca3af !important;
  border-top: none !important;
}

#footer a,
.footer-in a {
  color: #6b7280 !important;
  font-size: 12px;
}

#footer a:hover,
.footer-in a:hover {
  color: #e91e8c !important;
}

#footer .copyright,
.footer-in .copyright {
  color: #4b5563 !important;
  font-size: 11px;
}

/* ===== FANZAボタン（CTA強化）===== */
.fanza-cta-btn,
.entry-content a[href*="dmm.co.jp"],
.entry-content a[href*="fanza.com"] {
  display: inline-block !important;
  background: linear-gradient(135deg, #e91e8c, #c2185b) !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  padding: 16px 48px !important;
  border-radius: 6px !important;
  border: none !important;
  letter-spacing: 0.08em !important;
  transition: transform 0.15s, box-shadow 0.15s !important;
  text-decoration: none !important;
  box-shadow: 0 4px 16px rgba(233, 30, 140, 0.35) !important;
}

.fanza-cta-btn:hover,
.entry-content a[href*="dmm.co.jp"]:hover,
.entry-content a[href*="fanza.com"]:hover {
  transform: scale(1.04) !important;
  box-shadow: 0 6px 24px rgba(233, 30, 140, 0.5) !important;
  color: #ffffff !important;
}

/* 旧スタイルボタンも上書き */
.btn,
.more-link,
.btn-wrap a,
.wp-block-button__link {
  background: linear-gradient(135deg, #e91e8c, #c2185b) !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 10px 24px !important;
  border-radius: 4px !important;
  border: none !important;
  letter-spacing: 0.05em;
  transition: background 0.2s, transform 0.15s !important;
  text-decoration: none !important;
}

.btn:hover,
.more-link:hover,
.btn-wrap a:hover,
.wp-block-button__link:hover {
  background: #c2185b !important;
  color: #ffffff !important;
  transform: scale(1.02);
}

/* ===== パンくずリスト ===== */
.breadcrumb,
#breadcrumb {
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  font-size: 12px;
  color: #6b7280;
  padding: 8px 0 !important;
}

.breadcrumb a,
#breadcrumb a {
  color: #9ca3af !important;
}

.breadcrumb a:hover,
#breadcrumb a:hover {
  color: #e91e8c !important;
}

/* ===== タグ ===== */
.tag-cloud a,
.post-tags a {
  background: #f9fafb;
  color: #6b7280;
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  transition: all 0.2s;
}

.tag-cloud a:hover,
.post-tags a:hover {
  background: #fce4ec;
  color: #e91e8c;
  border-color: #f8bbd0;
}

/* ===== ページネーション ===== */
.pagination .current,
.page-numbers.current {
  background: #e91e8c !important;
  color: #ffffff !important;
  border-color: #e91e8c !important;
  border-radius: 4px;
}

.pagination a,
.page-numbers a {
  color: #1a1a1a;
  border-color: #e5e7eb;
  border-radius: 4px;
}

.pagination a:hover,
.page-numbers a:hover {
  background: #fce4ec !important;
  color: #e91e8c !important;
  border-color: #e91e8c !important;
}

/* ===== 記事下部: ジャンルタグ（functions.php版）===== */
.kyonyu-genre-tags span {
  display: inline-block;
  background: #fce4ec;
  color: #c2185b;
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 12px;
  margin-right: 6px;
  margin-bottom: 6px;
  border: 1px solid #f8bbd0;
}

/* ===== 免責事項ブロック ===== */
#kyonyu-disclaimer {
  background: #2a1a1a;
  border-top: 2px solid #e91e8c;
  padding: 16px 24px;
  text-align: center;
}

#kyonyu-disclaimer p {
  margin: 0 0 6px;
}

#kyonyu-disclaimer .disclaimer-age {
  color: #ff69b4;
  font-size: 13px;
  font-weight: 700;
}

#kyonyu-disclaimer .disclaimer-text {
  color: #9ca3af;
  font-size: 11px;
  line-height: 1.7;
}

/* ===== レスポンシブ ===== */
@media (max-width: 768px) {
  .site-name-text {
    font-size: 18px !important;
  }

  .entry-card-title {
    font-size: 13px !important;
  }

  h2 {
    font-size: 16px !important;
  }

  h3 {
    font-size: 14px !important;
  }

  .btn,
  .more-link {
    width: 100%;
    display: block;
    text-align: center;
  }

  .fanza-cta-btn,
  .entry-content a[href*="dmm.co.jp"],
  .entry-content a[href*="fanza.com"] {
    padding: 14px 24px !important;
    font-size: 15px !important;
    width: 100% !important;
    display: block !important;
    text-align: center !important;
  }
}

/* Issue #297: カテゴリーウィジェット 2列グリッド・レイアウト崩れ修正 */
/* Issue #298: ▶とカテゴリー名の改行問題修正（word-break:break-all廃止→nowrap+ellipsis） */
.wp-block-categories-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  padding: 0 !important;
  list-style: none !important;
}
.wp-block-categories-list li {
  margin: 0 !important;
  min-width: 0 !important; /* グリッドアイテムのオーバーフロー防止 */
}
/* 奇数個最後のアイテムが半列にならないよう2列分に伸ばす */
.wp-block-categories-list li:last-child:nth-child(odd) {
  grid-column: 1 / -1 !important;
}
.wp-block-categories-list li a {
  display: block !important;
  padding: 4px 8px !important;
  font-size: 0.85em !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 4px !important;
  text-align: center !important;
  white-space: nowrap !important;   /* ▶とテキストが同一行になるよう折り返し禁止 */
  overflow: hidden !important;
  text-overflow: ellipsis !important; /* 長いカテゴリー名は「...」で省略 */
  line-height: 1.4 !important;
}
.wp-block-categories-list li a span.list-item-caption {
  display: inline !important; /* ▶との同行表示のためblock→inlineに変更 */
}

/* サイドバー人気記事: 2行で省略 */
.popular-entry-card-link,
.widget-entry-card-link {
  font-size: 12px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.5 !important;
}

/* Issue #296: 人気記事ウィジェット文字サイズ */
.widget-entry-card { font-size: 13px !important; }