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

/* ========== rawmiss customizations ========== */

/* SNSシェアボタン上下、SNSフォローボタンを非表示 */
.sns-share, .sns-follow { display: none !important; }

/* 自動目次を非表示 */
#toc { display: none !important; }

/* 記事内のサンプル画像ギャラリー */
.sample-gallery { margin: 1em 0 2em; }
.sample-gallery img {
  display: block;
  width: 100%;
  max-width: 720px;
  height: auto;
  margin: 0 auto 8px;
  border-radius: 4px;
}
.sample-gallery a { display: block; }

/* 「全て見る」CTA ピンクボタン */
.read-more-btn {
  text-align: center;
  margin: 2em 0 2.5em;
}
.read-more-btn a {
  display: inline-block;
  background: #ff4d8d;
  color: #fff !important;
  padding: 16px 48px;
  border-radius: 999px;
  font-weight: bold;
  font-size: 18px;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(255,77,141,0.35);
  transition: transform 0.15s, box-shadow 0.15s;
}
.read-more-btn a:hover {
  transform: translateY(-1px);
  background: #ff367f;
  box-shadow: 0 6px 18px rgba(255,77,141,0.5);
  color: #fff !important;
}

/* パッケージ画像 */
.package-image { text-align: center; margin: 1em 0; }
.package-image img { max-width: 480px; width: 100%; height: auto; border-radius: 6px; }

/* 作品情報テーブル */
table.product-info { width: 100%; max-width: 720px; margin: 1em auto; }
table.product-info th { width: 30%; text-align: left; }
table.product-info th, table.product-info td { padding: 8px 12px; border-bottom: 1px solid #eee; }

/* ジャンルタグ */
.genre-tag {
  display: inline-block;
  background: #f5f5f5;
  color: #555;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 13px;
  margin: 2px 4px 2px 0;
}

/* 投稿者情報の完全非表示 */
.author-info,
.post-author,
.author-link,
.author-name,
.byline,
.vcard.author,
.entry-author { display: none !important; }
/* 編集リンク(管理者ログイン時のみ表示される鉛筆) */
.entry-edit a, .post-edit-link, .edit-link { display: none !important; }

/* ジャンルタグ(a要素になった) */
a.genre-tag {
  display: inline-block;
  background: #f5f5f5;
  color: #555 !important;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 13px;
  margin: 3px 4px 3px 0;
  text-decoration: none !important;
  border: 1px solid transparent;
  transition: background 0.15s, border-color 0.15s;
}
a.genre-tag:hover {
  background: #fff;
  border-color: #ff4d8d;
  color: #ff4d8d !important;
}

/* 作者などインラインタグ */
a.inline-tag {
  color: #c93b6f;
  text-decoration: none;
  border-bottom: 1px dashed #c93b6f;
}
a.inline-tag:hover {
  color: #ff4d8d;
  border-bottom-color: #ff4d8d;
}

/* ヘッダー圧縮 — テキスト周りの最小限の余白だけ残す */
.header { padding: 8px 0 !important; }
#header-in.header-in { padding: 0 !important; margin: 0 auto !important; }
.tagline {
  font-size: 12px !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 2px 0 !important;
  text-align: center;
}
.logo-header,
h1.logo.logo-header.logo-text {
  font-size: 24px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  padding: 2px 0 !important;
  text-align: center;
}
.logo-header .site-name-text { line-height: 1.2 !important; }
.logo-header a { padding: 0 !important; }

/* スマホ用 さらにコンパクト */
@media screen and (max-width: 768px) {
  .header { padding: 6px 0 !important; }
  .tagline { font-size: 11px !important; }
  .logo-header,
  h1.logo.logo-header.logo-text { font-size: 20px !important; }
}

/* ============ 作者・ジャンル 一覧ページ ============ */
.kana-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 1em 0 2em;
  padding: 12px;
  background: #fafafa;
  border-radius: 8px;
  position: sticky;
  top: 0;
  z-index: 10;
}
.kana-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none !important;
  color: #333 !important;
  transition: all 0.15s;
}
.kana-tab:hover { border-color: #ff4d8d; color: #ff4d8d !important; }
.kana-tab .cnt {
  font-size: 11px;
  font-weight: normal;
  color: #999;
  background: #f0f0f0;
  padding: 1px 6px;
  border-radius: 999px;
}
.kana-tab.is-empty {
  color: #ccc !important;
  background: #f8f8f8;
  cursor: default;
}

.kana-section { margin: 2em 0; scroll-margin-top: 80px; }
.kana-heading {
  border-left: 4px solid #ff4d8d;
  padding-left: 12px;
  margin: 1em 0 0.6em;
  font-size: 22px;
}
.kana-heading small { color: #999; font-size: 13px; font-weight: normal; margin-left: 8px; }

.kana-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 4px 12px;
}
.kana-list li {
  padding: 6px 0;
  border-bottom: 1px dotted #eee;
  font-size: 14px;
}
.kana-list li a {
  color: #333 !important;
  text-decoration: none !important;
  display: block;
}
.kana-list li a:hover { color: #ff4d8d !important; }
.kana-list .no-link { color: #999; }

@media (max-width: 600px) {
  .kana-list { grid-template-columns: repeat(2, 1fr); }
  .kana-tabs { font-size: 13px; }
  .kana-tab { padding: 4px 8px; font-size: 12px; }
}

/* ===== 検索ボタン(ヘッダー右) + モーダル ===== */
#header { position: relative !important; }

#rms-search-btn {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  color: #333;
  z-index: 100;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
#rms-search-btn:hover { background: rgba(0,0,0,0.06); }
#rms-search-btn .rms-icon { display: block; }

@media (max-width: 600px) {
  #rms-search-btn { width: 36px; height: 36px; font-size: 18px; right: 8px; }
}

.rms-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 16px;
}
.rms-modal.is-open { display: flex; }
.rms-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(2px);
}
.rms-modal-panel {
  position: relative;
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: 14px;
  padding: 22px 22px 26px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.25);
  max-height: 92vh;
  overflow-y: auto;
}
.rms-modal-x {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  font-size: 26px;
  line-height: 1;
  color: #999;
  cursor: pointer;
  border-radius: 50%;
}
.rms-modal-x:hover { background: #f5f5f5; color: #333; }

.rms-modal-h {
  color: #ff4d8d;
  font-size: 22px;
  font-weight: bold;
  margin: 0 0 10px;
  padding: 0;
  border: none !important;
}
.rms-modal-h:nth-of-type(2) { margin-top: 24px; }

.rms-search-form {
  display: flex;
  gap: 6px;
  margin: 0 0 4px;
}
.rms-search-form input[type=search] {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #f6f6f7;
  font-size: 16px;
  outline: none;
  -webkit-appearance: none;
}
.rms-search-form input[type=search]:focus {
  border-color: #ff4d8d;
  background: #fff;
}
.rms-search-form button {
  width: 48px;
  background: #ff4d8d;
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 18px;
}
.rms-search-form button:hover { background: #ff367f; }

.rms-tag-nav {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.rms-tag-nav li {
  border-bottom: 1px solid #f0f0f0;
}
.rms-tag-nav li:last-child { border-bottom: none; }
.rms-tag-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 8px;
  color: #333 !important;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none !important;
}
.rms-tag-nav a:hover { color: #ff4d8d !important; background: #fff7fa; }
.rms-arrow {
  color: #ff4d8d;
  font-size: 12px;
  display: inline-block;
}

/* ===== 検索ボタン: ロゴ内インライン配置(上書き) ===== */
.logo-header,
h1.logo.logo-header.logo-text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
  width: auto !important;
}
#header-in.header-in {
  text-align: center;
}
#rms-search-btn {
  position: static !important;
  transform: none !important;
  width: 32px !important;
  height: 32px !important;
  font-size: 18px !important;
  color: #888 !important;
  background: transparent !important;
  flex-shrink: 0;
}
#rms-search-btn:hover {
  color: #ff4d8d !important;
  background: rgba(255,77,141,0.08) !important;
}
@media (max-width: 600px) {
  #rms-search-btn { width: 28px !important; height: 28px !important; font-size: 16px !important; }
}

/* ===== 検索ボタン: ヘッダー右端 + サイト名はセンター(最終上書き) ===== */
#header-in.header-in {
  position: relative;
  text-align: center;
}
.logo-header,
h1.logo.logo-header.logo-text {
  display: block !important;
  width: auto !important;
  text-align: center;
  gap: 0 !important;
}

#rms-search-btn {
  position: absolute !important;
  top: 50% !important;
  right: 14px !important;
  transform: translateY(-50%) !important;
  width: 36px !important;
  height: 36px !important;
}
@media (max-width: 600px) {
  #rms-search-btn { right: 8px !important; width: 32px !important; height: 32px !important; font-size: 16px !important; }
}

/* ============================================================
   == momon-ga inspired dark theme (rollback: remove this block)
   ============================================================ */

/* --- Base --- */
body, html {
  background: #32373c !important;
  color: #e8e8e8;
}

#body, #container, #main, #content,
.l-main, .l-content, .l-container,
.body, .main, .content {
  background: transparent !important;
  color: #e8e8e8;
}

/* --- Header --- */
#header, .header {
  background: #1c1f23 !important;
  border-bottom: 1px solid #2a2d31 !important;
}
.tagline { color: #999 !important; }
.logo-header .site-name-text,
.logo-header a { color: #f0f0f0 !important; }
#rms-search-btn { color: #aaa !important; }
#rms-search-btn:hover { color: #ff4d8d !important; background: rgba(255,77,141,0.12) !important; }

/* --- Footer --- */
#footer, .footer {
  background: #1c1f23 !important;
  color: #888 !important;
  border-top: 1px solid #2a2d31 !important;
}
#footer a, .footer a { color: #ccc !important; }

/* --- Listing grid (manga-cover style) --- */
.list.ect-entry-card {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 20px 14px !important;
  padding: 8px 0 !important;
}
.list.ect-entry-card .entry-card-wrap {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  box-shadow: none !important;
  transition: transform 0.2s ease;
}
.list.ect-entry-card .entry-card-wrap:hover {
  transform: translateY(-3px);
}

/* Thumbnail = portrait manga cover */
.list.ect-entry-card .entry-card-thumb,
.list.ect-entry-card .card-thumb {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  background: #1a1c1f !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  display: block !important;
}
.list.ect-entry-card .entry-card-thumb-image,
.list.ect-entry-card .card-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s ease;
  display: block;
}
.list.ect-entry-card .entry-card-wrap:hover .entry-card-thumb-image {
  transform: scale(1.05);
}

/* Category label overlay */
.list.ect-entry-card .cat-label {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  background: rgba(255, 77, 141, 0.92) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: bold !important;
  padding: 3px 8px !important;
  border-radius: 3px !important;
  z-index: 2 !important;
}

/* Title below thumbnail */
.list.ect-entry-card .entry-card-content {
  padding: 8px 2px !important;
  background: transparent !important;
}
.list.ect-entry-card .entry-card-title {
  color: #e8e8e8 !important;
  font-size: 13px !important;
  font-weight: normal !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-decoration: none !important;
}
.list.ect-entry-card .entry-card-wrap:hover .entry-card-title {
  color: #ff8db0 !important;
}

/* Hide snippet/meta (manga-browsing focus) */
.list.ect-entry-card .entry-card-snippet,
.list.ect-entry-card .entry-card-meta,
.list.ect-entry-card .entry-card-info,
.list.ect-entry-card .post-date,
.list.ect-entry-card .entry-card-categorys {
  display: none !important;
}

@media (max-width: 480px) {
  .list.ect-entry-card {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px 10px !important;
  }
  .list.ect-entry-card .entry-card-title { font-size: 12px !important; }
}

/* --- Sidebar --- */
.sidebar { background: transparent !important; }
.widget, .sidebar-widget {
  background: #3d4147 !important;
  color: #e8e8e8 !important;
  border-radius: 6px;
  padding: 12px !important;
  margin-bottom: 16px !important;
}
.widget-title, .sidebar-widget .widget-title {
  color: #fff !important;
  border-bottom: 2px solid #ff4d8d !important;
  padding-bottom: 8px;
}
.widget a { color: #ccc !important; }
.widget a:hover { color: #ff8db0 !important; }

/* Search modal: keep light theme inside (already styled) */

/* --- Single post (individual article page) --- */
.article, .article-content,
.entry-content { color: #e8e8e8 !important; }
.entry-title, .article h1, .article h2, .article h3,
.article h4, h2.entry-card-title {
  color: #fff !important;
  border-color: #ff4d8d !important;
}
.article h2 {
  background: transparent !important;
  border-left: 4px solid #ff4d8d !important;
  padding-left: 12px !important;
}
.article p, .article li { color: #d8d8d8 !important; }
.article a:not(.read-more-btn a):not(.genre-tag):not(.inline-tag) {
  color: #ff8db0 !important;
}
table.product-info { color: #d8d8d8 !important; }
table.product-info th { color: #fff !important; }
table.product-info th, table.product-info td {
  border-bottom-color: #4a4f55 !important;
}

a.genre-tag {
  background: #3d4147 !important;
  color: #ccc !important;
  border-color: transparent !important;
}
a.genre-tag:hover {
  background: #4a4f55 !important;
  border-color: #ff4d8d !important;
  color: #ff8db0 !important;
}
a.inline-tag {
  color: #ff8db0 !important;
  border-bottom-color: #ff8db0 !important;
}

/* --- Authors/Genres pages --- */
.kana-tabs {
  background: #1c1f23 !important;
  border-radius: 8px;
}
.kana-tab {
  background: #3d4147 !important;
  border-color: #4a4f55 !important;
  color: #e8e8e8 !important;
}
.kana-tab:hover { border-color: #ff4d8d !important; color: #ff4d8d !important; }
.kana-tab .cnt { background: #1c1f23 !important; color: #aaa !important; }
.kana-tab.is-empty { color: #555 !important; background: #2a2d31 !important; }
.kana-heading { color: #fff !important; }
.kana-heading small { color: #888 !important; }
.kana-list li { border-bottom-color: #3d4147 !important; }
.kana-list li a { color: #e8e8e8 !important; }
.kana-list li a:hover { color: #ff8db0 !important; }

/* --- Pagination --- */
.pagination a, .pagination span,
.pagination-next a, .pagination-prev a {
  background: #3d4147 !important;
  color: #e8e8e8 !important;
  border-color: #4a4f55 !important;
}
.pagination .current,
.pagination a:hover { background: #ff4d8d !important; color: #fff !important; }

/* --- Breadcrumb --- */
#breadcrumb, .breadcrumb {
  background: transparent !important;
  color: #999 !important;
}
#breadcrumb a, .breadcrumb a { color: #ccc !important; }

/* --- Title fixes (full width, larger, height-locked) --- */
.list.ect-entry-card .entry-card-content {
  padding: 8px 0 0 !important;
  margin: 0 !important;
  width: 100% !important;
  background: transparent !important;
}
.list.ect-entry-card .entry-card-title {
  color: #e8e8e8 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  /* 必ず2行分の高さを確保(短いタイトルでも下のカードと揃う) */
  height: calc(15px * 1.4 * 2) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  word-break: break-word !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
}
/* Cocoonがh2に付ける装飾(::before/::after)を消す */
.list.ect-entry-card .entry-card-title::before,
.list.ect-entry-card .entry-card-title::after {
  display: none !important;
  content: none !important;
}
/* 小画面でも統一感を保つ */
@media (max-width: 480px) {
  .list.ect-entry-card .entry-card-title {
    font-size: 13px !important;
    height: calc(13px * 1.4 * 2) !important;
  }
}

/* --- Product info table: dark theme fix --- */
.entry-content table.product-info,
table.product-info {
  background: transparent !important;
  border-collapse: collapse !important;
  width: 100%;
  max-width: 720px;
  margin: 1em auto;
}
.entry-content table.product-info th,
table.product-info th {
  background: #2a2d31 !important;
  color: #fff !important;
  font-weight: 600 !important;
  text-align: left;
  width: 30%;
  padding: 10px 14px !important;
  border: 1px solid #3d4147 !important;
}
.entry-content table.product-info td,
table.product-info td {
  background: #3d4147 !important;
  color: #e8e8e8 !important;
  padding: 10px 14px !important;
  border: 1px solid #3d4147 !important;
}
/* 作者リンクをテーブル内で見やすく */
.entry-content table.product-info a,
table.product-info a {
  color: #ff8db0 !important;
}
.entry-content table.product-info a:hover,
table.product-info a:hover {
  color: #ff4d8d !important;
}

/* --- 1-column layout (sidebar hidden everywhere) --- */
#sidebar, .sidebar, .l-sidebar, #sidebar-scroll { display: none !important; }
#main, .main, .l-main {
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  float: none !important;
}
#main-content, .main-content { width: 100% !important; }
#wrap, #inner-wrap, .l-container, .l-wrap {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}
/* Cocoon flex/grid container reset for 1-col */
.body.sidebar-right #main,
.body.sidebar-left #main { width: 100% !important; margin: 0 auto !important; }

/* Listing grid: allow more columns on wide PC */
@media (min-width: 1024px) {
  .list.ect-entry-card {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  }
}
@media (min-width: 1280px) {
  .list.ect-entry-card {
    grid-template-columns: repeat(6, 1fr) !important;
  }
}

/* --- Single post eyecatch: center align --- */
.eye-catch-wrap,
.eye-catch {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}
.eye-catch-image,
.eye-catch img {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 560px !important;
  width: auto !important;
  height: auto !important;
  max-height: 80vh;
  border-radius: 6px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}

/* --- 固定ページ: アイキャッチ・日付を非表示 --- */
body.page .eye-catch-wrap,
body.page .eye-catch,
body.page .eye-catch-image,
body.page figure.eye-catch {
  display: none !important;
}
body.page .post-date,
body.page .entry-date,
body.page .date-tags,
body.page .article-header .entry-meta,
body.page .article-header .meta-info,
body.page .article-header time,
body.page .entry-meta,
body.page .meta-info,
body.page time.published,
body.page time.updated {
  display: none !important;
}

/* --- 検索ボタン: アイコンフォント + ピンク色 (上書き) --- */
#rms-search-btn {
  color: #ff4d8d !important;
  background: transparent !important;
}
#rms-search-btn:hover {
  color: #ff367f !important;
  background: rgba(255, 77, 141, 0.15) !important;
}
#rms-search-btn .rms-icon,
#rms-search-btn .fa-search {
  font-size: 20px !important;
  line-height: 1 !important;
}
@media (max-width: 600px) {
  #rms-search-btn .rms-icon,
  #rms-search-btn .fa-search {
    font-size: 16px !important;
  }
}

/* --- Mobile: 画像と記事の幅オーバーフロー対策 --- */

/* 全画像を強制的にレスポンシブに */
.entry-content img,
.article img,
.eye-catch-image,
.eye-catch img,
.package-image img,
.sample-gallery img {
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box;
}

/* デスクトップ時のみアイキャッチを560px上限に */
@media (min-width: 768px) {
  .eye-catch-image,
  .eye-catch img {
    max-width: 560px !important;
  }
}

/* 記事コンテナはみ出し防止 */
.article, .article-content, .entry-content,
.l-main, #main {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* テーブルもはみ出さないように */
.entry-content table, .article table {
  max-width: 100% !important;
  display: block;
  overflow-x: auto;
}

/* ロング英数字の折り返し */
.entry-content, .article {
  overflow-wrap: anywhere;
}

/* セーフティネット: body全体で横スクロール禁止 */
body {
  overflow-x: hidden !important;
}

/* --- 関連記事カードを一覧グリッドと統一 --- */
#related-entries.related-entries {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  gap: 18px 12px !important;
  padding: 8px 0 !important;
}
#related-entries .related-entry-card-wrap {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  box-shadow: none !important;
  transition: transform 0.2s ease;
}
#related-entries .related-entry-card-wrap:hover {
  transform: translateY(-3px);
}

#related-entries .related-entry-card-thumb {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  background: #1a1c1f !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  display: block !important;
}
#related-entries .related-entry-card-thumb-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s ease;
  display: block;
}
#related-entries .related-entry-card-wrap:hover .related-entry-card-thumb-image {
  transform: scale(1.05);
}

#related-entries .related-entry-card-thumb .cat-label {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  background: rgba(255, 77, 141, 0.92) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: bold !important;
  padding: 3px 8px !important;
  border-radius: 3px !important;
  z-index: 2 !important;
}

#related-entries .related-entry-card-content {
  padding: 8px 0 0 !important;
  margin: 0 !important;
  width: 100% !important;
  background: transparent !important;
}
#related-entries .related-entry-card-title {
  color: #e8e8e8 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: calc(14px * 1.4 * 2) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  background: none !important;
  border: none !important;
  text-decoration: none !important;
}
#related-entries .related-entry-card-title::before,
#related-entries .related-entry-card-title::after {
  display: none !important;
  content: none !important;
}
#related-entries .related-entry-card-wrap:hover .related-entry-card-title {
  color: #ff8db0 !important;
}
#related-entries .related-entry-card-snippet,
#related-entries .related-entry-card-meta,
#related-entries .related-entry-card-info {
  display: none !important;
}

@media (max-width: 480px) {
  #related-entries.related-entries {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px 10px !important;
  }
  #related-entries .related-entry-card-title {
    font-size: 13px !important;
    height: calc(13px * 1.4 * 2) !important;
  }
}

/* --- 関連記事カラム: トップと同じレスポンシブに統一 (上書き) --- */
#related-entries.related-entries {
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 20px 14px !important;
}
@media (min-width: 1024px) {
  #related-entries.related-entries {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  }
}
@media (max-width: 480px) {
  #related-entries.related-entries {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px 10px !important;
  }
}

/* --- 関連記事: グリッドは .related-list に適用(上書き修正) --- */
#related-entries.related-entries {
  display: block !important;
}
#related-entries .related-entry-heading {
  display: block !important;
  width: 100%;
}
#related-entries .related-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 20px 14px !important;
  padding: 8px 0 !important;
}
@media (min-width: 1024px) {
  #related-entries .related-list {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  }
}
@media (max-width: 480px) {
  #related-entries .related-list {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px 10px !important;
  }
}

/* --- ジャンル/作者一覧の件数バッジ --- */
.kana-list .kana-count {
  color: #888;
  font-size: 12px;
  margin-left: 3px;
  font-weight: normal;
}
.kana-list li a:hover .kana-count {
  color: #ff8db0;
}

/* ====== 感想スレッド (2ちゃん風レビュー) ====== */
.thread-review {
  background: #2a2d31 !important;
  border-radius: 6px;
  padding: 16px 18px 20px;
  margin: 2em 0;
  border: 1px solid #1a1c1f;
}
.thread-review h2 {
  color: #ff8db0 !important;
  border-left: 4px solid #ff4d8d !important;
  padding-left: 12px !important;
  font-size: 18px !important;
  margin: 0 0 4px !important;
  background: none !important;
}
.thread-disclaimer {
  color: #888;
  font-size: 11px;
  margin: 0 0 14px;
}
.thread-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: 'MS PGothic', 'Hiragino Kaku Gothic ProN', sans-serif;
}
.thread-item {
  background: #1e2126;
  border-radius: 3px;
  padding: 10px 12px;
  margin: 0 0 8px !important;
  border-left: 2px solid #3d4147;
}
.thread-meta {
  font-size: 12px;
  color: #888;
  margin-bottom: 4px;
  line-height: 1.4;
}
.thread-num {
  color: #ff8db0;
  font-weight: bold;
  margin-right: 4px;
}
.thread-name {
  color: #6cb9ff;
  font-weight: bold;
}
.thread-date {
  color: #aaa;
  margin-left: 4px;
}
.thread-body {
  color: #e8e8e8;
  font-size: 14px;
  line-height: 1.7;
  word-wrap: break-word;
}
.thread-anchor {
  color: #6cb9ff !important;
  text-decoration: none !important;
  border-bottom: 1px dashed transparent;
}
.thread-anchor:hover {
  border-bottom-color: #6cb9ff;
  color: #8cd0ff !important;
}
@media (max-width: 480px) {
  .thread-review { padding: 12px; }
  .thread-body { font-size: 13px; }
}