/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ（統一クリーン版）
Template: cocoon-master
Version: 1.1.7
*/
@charset "UTF-8";

/* =========================================================
  0) 全体設計（ここ “1か所” を触るだけで全サムネが一斉変更）
========================================================= */
*,
*::before,
*::after{ box-sizing:border-box; }

:root{
  --tile-gap: 10px;

  /* ★ここだけ触れば、全サムネの比率が一挙に変わる */
  --ASC_THUMB_AR: 1.618 / 1;   /* 黄金比。気分で 16/9 や 4/3 に変えてOK */

  /* 角丸（枠/背景は使わないので角丸は“表示上の箱”として適用） */
  --ASC_THUMB_RADIUS: 6px;

  /* ★引き延ばしで統一（トリミングしない） */
  --ASC_THUMB_FIT: cover;       /* fill = 引き延ばし / cover = トリミング / contain = 余白 */

  /* マウスオン透過 */
  --ASC_HOVER_OPACITY: .78;

  /* タイトル（サムネ直下） */
  --ASC_TITLE_SIZE: 12px;
  --ASC_TITLE_WEIGHT: 500;
  --ASC_TITLE_LINES: 2;
  --ASC_TITLE_LH: 1.35;
  --ASC_TITLE_MT: 6px;
  --ASC_TITLE_COLOR: #414141;

  /* 本文リンク色 */
  --asc-link:   #000080;
  --asc-link-h: #ff66c4;
  --asc-link-v: #800080;

  /* FAQ配色 */
  --faq-q-badge:#67a8ff;
  --faq-a-text: #e63946;
  --faq-border: #dddddd;
  --faq-bg:     #ffffff;
  --faq-q-row:  #f7f9fc;

  /* ランキングバッジ */
  --rank-badge-size: 40px;

  /* サンプル動画ボタン（sample-frame） */
  --ASC_SAMPLE_GAP: 10px;          /* 画像とボタンの隙間 */
  --ASC_SAMPLE_BTN_R: 6px;         /* ボタン角丸 */
  --ASC_SAMPLE_BTN_BG: #ff2b2b;    /* ボタン背景（赤） */
  --ASC_SAMPLE_BTN_BG_H: #ff4a4a;  /* hover */
  --ASC_SAMPLE_BTN_TXT: #ffffff;   /* 文字色 */
  --ASC_SAMPLE_BTN_PY: 16px;       /* ボタン上下padding */
  --ASC_SAMPLE_BTN_PX: 18px;       /* ボタン左右padding */
  --ASC_SAMPLE_BTN_SHADOW: 0 14px 30px rgba(255, 43, 43, .35);
  --ASC_SAMPLE_BTN_SHADOW_H: 0 18px 40px rgba(255, 43, 43, .50);
}

/* =========================================================
  1) ヘッダー（CLS対策）
========================================================= */
.site-branding{ min-height:89px !important; }

.header-site-logo-image,
.site-logo-image,
.custom-logo{
  display:inline-block;
  max-height:89px !important;
  height:auto;
  width:auto;
}

.site-header,
.site-branding,
.header-site-logo-image{
  opacity:1 !important;
  transform:none !important;
  visibility:visible !important;
}

/* =========================================================
  2) 既存の軽い統一＆小物
========================================================= */
.cat-label{ display:none; }

.toggle-wrap,
.toggle-wrap .toggle-button,
.toggle-wrap .toggle-content{
  color:#000;
  background:#fff !important;
  border-color:#fff !important;
  box-shadow:none !important;
}
.toggle-wrap .toggle-checkbox:checked ~ .toggle-button,
.toggle-wrap .toggle-checkbox:checked ~ .toggle-content{
  color:#000 !important;
  background:#fff !important;
  border-color:#fff !important;
}
.toggle-wrap label.toggle-button{ color:#000 !important; }
.toggle-wrap label.toggle-button:hover,
.toggle-wrap label.toggle-button:focus{ color:#000 !important; }
.toggle-wrap label.toggle-button *{ color:inherit !important; }

/* =========================================================
  3) asc-grid（cols-2〜5 を確実にグリッド化）
========================================================= */
.asc-grid.cols-2,
.asc-grid.cols-3,
.asc-grid.cols-4,
.asc-grid.cols-5{
  display:grid !important;
  gap:var(--tile-gap) !important;
  margin:0 !important;
  padding:0 !important;
}
.asc-grid.cols-2{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
.asc-grid.cols-3{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
.asc-grid.cols-4{ grid-template-columns:repeat(4, minmax(0,1fr)) !important; }
.asc-grid.cols-5{ grid-template-columns:repeat(5, minmax(0,1fr)) !important; }

@media (max-width:960px){
  .asc-grid.cols-3,
  .asc-grid.cols-4,
  .asc-grid.cols-5{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

/* =========================================================
  4) アーカイブ/トップのカード群をグリッド寄せ（構造差にまとめて対応）
========================================================= */
.archive .entry-cards,
.archive .entries,
.archive .post-list,
.archive .archive-posts,
.home .entry-cards,
.home .entries,
.home .post-list,
.home .archive-posts{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:var(--tile-gap) !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
@media (max-width:960px){
  .archive .entry-cards,
  .archive .entries,
  .archive .post-list,
  .archive .archive-posts,
  .home .entry-cards,
  .home .entries,
  .home .post-list,
  .home .archive-posts{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

/* =========================================================
  5) サムネ統一（最重要）
  - 背景ボックス/背景色：使わない（透明）
  - 比率：--ASC_THUMB_AR で統一
  - 画像：引き延ばし（object-fit: fill）
========================================================= */
:where(
  .asc-card-link,         /* ショートコードカード（a） */
  .asc-related-thumb,     /* 関連（ul構造のthumb箱） */
  .asc-tax-thumb,         /* タクソ一覧のthumb箱 */
  .entry-card-thumb,      /* Cocoonカードのthumb箱 */
  #sidebar .asc-card-link,
  #sidebar .asc-related-thumb,
  #sidebar .asc-tax-thumb,
  #sidebar .entry-card-thumb
){
  position:relative !important;
  display:block !important;
  width:100% !important;
  aspect-ratio:var(--ASC_THUMB_AR) !important;

  /* 背景ボックス/背景色は削除（透明化） */
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;

  border-radius:var(--ASC_THUMB_RADIUS) !important;
  overflow:hidden !important;
  line-height:0 !important;
}

/* 画像：箱いっぱいに “引き延ばし” */
:where(
  .asc-card-link > img,
  .asc-related-thumb > img,
  .asc-tax-thumb img,
  .entry-card-thumb img,
  #sidebar .asc-card-link > img,
  #sidebar .asc-related-thumb > img,
  #sidebar .asc-tax-thumb img,
  #sidebar .entry-card-thumb img,
  .asc-card-link img.wp-post-image,
  .entry-card-thumb img.wp-post-image
){
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;

  object-fit:var(--ASC_THUMB_FIT) !important;
  object-position:center !important;

  display:block !important;
  background:transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;

  transition:opacity .18s ease;
}

/* =========================================================
  6) ホバー：画像リンクを透過
========================================================= */
:where(.asc-card-link):hover > img,
:where(.asc-card-link):focus-visible > img{
  opacity:var(--ASC_HOVER_OPACITY) !important;
}
:where(.asc-related-link):hover .asc-related-thumb > img,
:where(.asc-related-link):focus-visible .asc-related-thumb > img{
  opacity:var(--ASC_HOVER_OPACITY) !important;
}
:where(.asc-tax-link):hover .asc-tax-thumb img,
:where(.asc-tax-link):focus-visible .asc-tax-thumb img{
  opacity:var(--ASC_HOVER_OPACITY) !important;
}
:where(.entry-card, .entry-card-wrap):hover .entry-card-thumb img,
:where(.entry-card, .entry-card-wrap):focus-within .entry-card-thumb img{
  opacity:var(--ASC_HOVER_OPACITY) !important;
}

/* =========================================================
  7) タイトル（サムネ直下）を全て「2行＋… / 12px / 500」に統一
========================================================= */
:where(
  .asc-card-title,
  .asc-card-title a,
  .asc-related-title-text,
  .entry-card-title,
  .entry-card-title a,
  .entry-card-content .entry-title,
  .entry-card-content .entry-title a
){
  margin:var(--ASC_TITLE_MT) 0 0 !important;
  padding:0 !important;

  font-size:var(--ASC_TITLE_SIZE) !important;
  font-weight:var(--ASC_TITLE_WEIGHT) !important;
  line-height:var(--ASC_TITLE_LH) !important;
  color:var(--ASC_TITLE_COLOR) !important;

  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:var(--ASC_TITLE_LINES) !important;

  text-decoration:none !important;
  word-break:break-word;
}
:where(.asc-card, .entry-card, .entry-card-wrap){ min-width:0 !important; }

/* タイル下タイトルの「枠」を完全に消す */
:where(.asc-card-title){
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
}
:where(.asc-card-title)::before,
:where(.asc-card-title)::after{ content:none !important; }

/* =========================================================
  7.5) サムネ下のメタ（女優/レーベル）※taxonomy.phpで出した要素
  目的：リンク群が長くても崩れず、主張しすぎない
========================================================= */
.asc-meta-below-thumb{
  margin-top:6px;
  font-size:11px;
  line-height:1.35;
  color:#666;
  display:flex;
  flex-wrap:wrap;
  gap:6px 10px;
}
.asc-meta-below-thumb .asc-meta a{
  color:inherit !important;
  text-decoration:none !important;
}
.asc-meta-below-thumb .asc-meta a:hover,
.asc-meta-below-thumb .asc-meta a:focus-visible{
  color:var(--asc-link-h) !important;
}
.asc-meta-below-thumb .asc-meta--label{
  font-weight:600;
}
.asc-meta-below-thumb .asc-meta--actress{
  font-weight:500;
}

/* =========================================================
  8) 見出し装飾OFF（Cocoonの左線などを消す）
========================================================= */
.entry-content h2,
.entry-content h3{
  margin-left:0 !important;
  padding-left:0 !important;
  border-left:none !important;
  background:none !important;
  box-shadow:none !important;
  text-indent:0 !important;
}
.entry-content h2::before,
.entry-content h2::after,
.entry-content h3::before,
.entry-content h3::after{ content:none !important; }



/* 強調用 */
.bold-red{ color:#ff1493; }

/* =========================================================
  9) 本文リンク色（下線なし）
========================================================= */
.entry-content a:not(.wp-block-button__link):not(.btn):not(.button):not(.sc_button){
  color:var(--asc-link) !important;
  font-weight:200;
  text-decoration:none !important;
  transition:color .15s ease;
}
.entry-content a:hover:not(.wp-block-button__link):not(.btn):not(.button):not(.sc_button),
.entry-content a:focus-visible:not(.wp-block-button__link):not(.btn):not(.button):not(.sc_button){
  color:var(--asc-link-h) !important;
  text-decoration:none !important;
  outline:none;
}
.entry-content a:visited:not(.wp-block-button__link):not(.btn):not(.button):not(.sc_button){
  color:var(--asc-link-v) !important;
  text-decoration:none !important;
}

/* =========================================================
  10) ページャー（丸ボタン）
========================================================= */
.asc-pager{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:16px 0;
}
.asc-pager ul.page-numbers{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  list-style:none;
  margin:16px 0;
  padding:0;
}
.asc-pager ul.page-numbers li{ margin:0; list-style:none; }
.asc-pager a.page-numbers,
.asc-pager span.page-numbers{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid #ddd;
  background:#f5f5f5;
  color:#333;
  text-decoration:none;
  line-height:1;
}
.asc-pager a.page-numbers:hover{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}
.asc-pager .current{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}

/* WP標準のページネーション（.navigation.pagination）にも丸ボタン適用 */
.navigation.pagination{
  display:flex;
  justify-content:center;
  margin:16px 0;
}
.navigation.pagination .nav-links > ul.page-numbers{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  list-style:none;
  margin:16px 0;
  padding:0;
}
.navigation.pagination .nav-links > ul.page-numbers > li{
  margin:0;
  list-style:none;
}
.navigation.pagination a.page-numbers,
.navigation.pagination span.page-numbers{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid #ddd;
  background:#f5f5f5;
  color:#333;
  text-decoration:none;
  line-height:1;
}
.navigation.pagination a.page-numbers:hover{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}
.navigation.pagination .current{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}
.navigation.pagination a.next.page-numbers::before{
  content:"›";
  font-size:18px;
  line-height:1;
}
/* =========================================================
  10.1) asc_video_cards_and のページネーション（.asc-pagination）も丸ボタン＋横並びに統一
  ※ paginate_links(type="list") の <ul class="page-numbers"> 対応
========================================================= */
.asc-pagination{
  display:flex;
  justify-content:center;
  margin:16px 0;
}

.asc-pagination > ul.page-numbers{
  display:flex !important;
  justify-content:center;
  align-items:center;
  gap:10px;
  list-style:none !important;
  margin:16px 0 !important;
  padding:0 !important;
}

.asc-pagination > ul.page-numbers > li{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.asc-pagination a.page-numbers,
.asc-pagination span.page-numbers{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid #ddd;
  background:#f5f5f5;
  color:#333;
  text-decoration:none;
  line-height:1;
}

.asc-pagination a.page-numbers:hover{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}

.asc-pagination .current{
  background:#ff1493;
  border-color:#ff1493;
  color:#fff;
}
/* =========================================================
  10.2) 前へ / 次へ（prev/next）だけ中央寄せ＋文字小さめ
========================================================= */
.asc-pagination a.page-numbers.prev,
.asc-pagination a.page-numbers.next{
  /* 丸の中で2行になるので“縦積み中央”にする */
  flex-direction: column;
  justify-content: center;
  text-align: center;

  /* 少し小さく、行間も詰めて中央に寄せる */
  font-size: 12px;
  line-height: 1.05;
  padding: 0;           /* 余計なズレ防止 */
}

/* もし「«」「»」だけ行がズレる場合の保険（少しだけ詰める） */
.asc-pagination a.page-numbers.prev,
.asc-pagination a.page-numbers.next{
  gap: 0;
}
.asc-pagination a.page-numbers.prev,
.asc-pagination a.page-numbers.next{
  width: 44px;
  height: 44px;
}

/* =========================================================
  11) FAQ（details版）
========================================================= */
.entry-content .faq{
  display:grid;
  gap:12px;
  margin:16px 0 24px;
  font-size:14px;
  line-height:1.7;
}
.entry-content .faq details{
  display:block !important;
  border:1px solid var(--faq-border);
  border-radius:0;
  background:var(--faq-bg);
  overflow:hidden;
  transition:border-color .2s, box-shadow .2s;
}
.entry-content .faq details[open]{
  border-color:rgba(103,168,255,.6);
  box-shadow:0 1px 10px rgba(0,0,0,.05);
}
.entry-content .faq details > summary{
  display:block !important;
  list-style:none;
  margin:0;
  padding:12px 44px 12px 46px;
  font-weight:700;
  line-height:1.5;
  position:relative;
  background:var(--faq-q-row);
  border-bottom:1px solid var(--faq-border);
  user-select:none;
  cursor:pointer;
  border-radius:0;
}
.entry-content .faq details > summary::-webkit-details-marker{ display:none; }
.entry-content .faq details > summary::marker{ content:""; }
.entry-content .faq details > summary::before{
  content:"Q";
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:999px;
  background:var(--faq-q-badge);
  color:#fff;
  font-weight:800;
  font-size:12px;
}
.entry-content .faq details > summary::after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  margin-top:-5px;
  width:10px;
  height:10px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  opacity:.75;
  transition:transform .2s, opacity .2s;
}
.entry-content .faq details[open] > summary::after{
  transform:rotate(-135deg);
  opacity:1;
}
.entry-content .faq details > div{
  display:block !important;
  width:100% !important;
  float:none !important;
  clear:both !important;
  box-sizing:border-box;
  padding:12px 16px 16px;
  border-top:1px solid var(--faq-border);
  line-height:1.8;
}
.entry-content .faq details > div > :first-child{ position:relative; }
.entry-content .faq details > div > :first-child::before{
  content:"A";
  display:inline-block;
  margin-right:.5em;
  font-weight:700;
  color:var(--faq-a-text);
  vertical-align:baseline;
}
.entry-content .faq details > div p{ margin:0 0 .8em; }
.entry-content .faq details > div > :last-child{ margin-bottom:0; }
.entry-content .faq details > summary:focus-visible{
  outline:2px solid var(--faq-q-badge);
  outline-offset:2px;
  border-radius:0;
}
@media (max-width:767px){
  .entry-content .faq{ gap:10px; margin:12px 0 20px; }
  .entry-content .faq details > summary{ padding:12px 40px 12px 44px; }
  .entry-content .faq details > summary::before{ width:20px; height:20px; font-size:11px; }
}

/* =========================================================
  12) ランキングバッジ（円形固定）
========================================================= */
.entry-content :where(.asc-related-thumb, .asc-card-link, .asc-tax-thumb) .asc-rank-badge,
.entry-content .asc-grid .asc-rank-badge{
  position:absolute;
  left:6px;
  top:6px;
  z-index:2;

  width:var(--rank-badge-size);
  height:var(--rank-badge-size);
  padding:0 !important;
  border-radius:50% !important;

  display:grid;
  place-items:center;

  color:#fff !important;
  font-weight:700 !important;
  font-size:calc(var(--rank-badge-size) * 0.55) !important;
  line-height:1;
  font-variant-numeric: tabular-nums;
}

/* =========================================================
  13) フッター：リンク装飾OFF
========================================================= */
.footer a,
.footer .menu a,
.footer-widgets a,
.footer-in a,
.footer-bottom a{
  text-decoration:none !important;
  border-bottom:none !important;
  box-shadow:none !important;
  background:transparent !important;
  transition:color .15s ease-in-out, background .15s ease-in-out;
}
.footer .menu li:hover,
.footer .menu .menu-item:hover,
.footer .menu-item:hover,
.footer .menu li:hover > a,
.navi-footer li:hover,
.navi-footer li:hover > a{ background:transparent !important; }
.footer a:hover,
.footer .menu a:hover,
.footer-widgets a:hover,
.footer-in a:hover,
.footer-bottom a:hover,
.footer a:focus,
.footer .menu a:focus,
.footer-widgets a:focus,
.footer-in a:focus,
.footer-bottom a:focus,
.navi-footer a:hover,
.navi-footer a:focus{
  color:#ff1493 !important;
  background:transparent !important;
}

/* =========================================================
  14) 目次ちょい整形
========================================================= */
ul.mokuji{
  text-align:center;
  margin:20px 0;
  padding-left:0;
  list-style:none;
}
li.mokuji{ display:inline; }

/* =========================================================
  sample-frame（aタグ）を「画像 + 下にボタン」に組み替える
========================================================= */
a.sample-frame{
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto auto !important;
  row-gap: var(--ASC_SAMPLE_GAP) !important;

  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;

  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
}
a.sample-frame > img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 0 !important;
}
a.sample-frame .sample-play{
  display: none !important;
}
a.sample-frame .sample-overlay{
  position: static !important;
  inset: auto !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  padding: var(--ASC_SAMPLE_BTN_PY) var(--ASC_SAMPLE_BTN_PX) !important;

  background: var(--ASC_SAMPLE_BTN_BG) !important;
  border-radius: var(--ASC_SAMPLE_BTN_R) !important;
  box-shadow: var(--ASC_SAMPLE_BTN_SHADOW) !important;

  pointer-events: auto !important;
}
a.sample-frame .sample-label{
  color: var(--ASC_SAMPLE_BTN_TXT) !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  letter-spacing: .02em;
  text-shadow: none !important;
  white-space: nowrap;
}
a.sample-frame:visited .sample-overlay,
a.sample-frame:visited .sample-label{
  color: var(--ASC_SAMPLE_BTN_TXT) !important;
}
@media (hover:hover){
  a.sample-frame:hover > img{
    opacity: .92;
  }
  a.sample-frame:hover .sample-overlay{
    background: var(--ASC_SAMPLE_BTN_BG_H) !important;
    box-shadow: var(--ASC_SAMPLE_BTN_SHADOW_H) !important;
    transform: translateY(-1px);
  }
}
a.sample-frame:focus-visible .sample-overlay{
  outline: 3px solid rgba(255, 43, 43, .35) !important;
  outline-offset: 3px !important;
}

/* =========================================================
  .col_4（影響範囲を entry-content に限定：干渉防止）
  ※このブロックを使っていないなら、将来的に削除してOK
========================================================= */
.entry-content .col_4{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  width:100%;
  box-sizing:border-box;
}
.entry-content .col_4 > div{
  flex:0 0 calc((100% - (16px * 3)) / 4);
  min-width:0;
}
.entry-content .col_4 img{
  width:100%;
  height:auto;

  /* 全体方針に合わせる（引き延ばし統一） */
  aspect-ratio:var(--ASC_THUMB_AR);
  object-fit:var(--ASC_THUMB_FIT);

  border-radius:var(--ASC_THUMB_RADIUS);
  display:block;
}
@media (max-width: 768px){
  .entry-content .col_4{ gap:10px; }
  .entry-content .col_4 > div{
    flex:0 0 calc((100% - 10px) / 2);
  }
}

/* =========================================================
   メーカー一覧ボタン（ul.asc-btns）最終調整版
========================================================= */

/* ANDページ：ボタン列の下余白を詰める（アーカイブに寄せる） */
.entry-content ul.asc-btns{
  margin: 0 0 0px !important; /* ←ここが肝。上0 / 下12px */
}


.entry-content ul.asc-btns li{
  margin:0 !important;
  padding:0 !important;
  list-style-type:none !important;
  width:calc((100% - 10px) / 2) !important;
}
@media (min-width: 1024px){
  .entry-content ul.asc-btns li{
    width:calc((100% - (10px * 3)) / 4) !important;
  }
}
.entry-content ul.asc-btns li a.asc-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  height:50px !important;
  padding:5px 10px !important;
  box-sizing:border-box !important;
  text-decoration:none !important;
  font-weight:bold !important;
  font-size:14px !important;

  background-color:#ffffff !important;
  border:2px solid #d4af37 !important;
  color:#000000 !important;
  border-radius:6px !important;

  transition: background-color 0.2s ease, color 0.2s ease !important;
}
.entry-content ul.asc-btns li a.asc-btn:hover{
  background-color:#f8f8f8 !important;
  color:#ff66c4 !important;
  border-color:#d4af37 !important;
  opacity:1 !important;
}
.entry-content ul.asc-btns li a.asc-btn:visited{
  color:#000000 !important;
}
.entry-content ul.asc-btns li a.asc-btn:hover:visited{
  color:#ff66c4 !important;
}

/* スマホで横並び2列（Cocoonの既存カラムCSSに干渉されない自前版） */
@media (max-width: 767px){
  .asc-links-2col{
    display:flex !important;
    gap:12px;
    align-items:flex-start;
  }
  .asc-links-2col .asc-links-col{
    width:50% !important;
    margin:0 !important;
    padding-left:1.2em;
    box-sizing:border-box;
  }
  .asc-links-2col li{
    margin:0 0 .35em 0;
  }
}
  table.kcup-list {
    width: 100%;
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 14px;
    margin: 1em 0;
  }

  table.kcup-list caption {
    caption-side: top;
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 0.5em;
    text-align: left;
  }

  table.kcup-list th,
  table.kcup-list td {
    border: 1px solid #ddd;
    padding: 8px 10px;
    vertical-align: top;
  }

  table.kcup-list th {
    text-align: left;
    background-color: #f7f7f7;
  }

  table.kcup-list tbody tr:nth-child(odd) {
    background-color: #fff4f7; /* 極薄パステルピンク */
  }

  table.kcup-list tbody tr:nth-child(even) {
    background-color: #f4fbff; /* 極薄パステルブルー */
  }
  table.profile-table {
    width: 100%;
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 14px;
    margin: 1em 0;
  }

  table.profile-table caption {
    caption-side: top;
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 0.5em;
    text-align: left;
  }

  table.profile-table th,
  table.profile-table td {
    border: 1px solid #ddd;
    padding: 8px 10px;
    vertical-align: top;
  }

  table.profile-table th {
    text-align: left;
    background-color: #f7f7f7;
    width: 30%;
  }

  table.profile-table tbody tr:nth-child(odd) {
    background-color: #fff4f7; /* 極薄パステルピンク */
  }

  table.profile-table tbody tr:nth-child(even) {
    background-color: #f4fbff; /* 極薄パステルブルー */
  }
.three-cols{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px;
}
.three-cols > *{ min-width:0; }
.three-cols :is(img,a,button,.btn){
  width:100%;
  display:block;
}
/* 通常 */
.entry-content a.actress,
.entry-content a.actress:link{
  color: #00f !important;
  font-weight: 700 !important;
}

/* 訪問済み */
.entry-content a.actress:visited{
  color: #deb887 !important;
}

/* ホバー */
.entry-content a.actress:hover{
  color: #f00 !important;
}

/* 押下中 */
.entry-content a.actress:active{
  color: #708090 !important;
  opacity: .7;
}




/* === ASC Term Detail Links: グリッドに巻き込まれても全幅にする === */
.asc-tdlm{
  /* グリッド/フレックス内でも「全幅」扱いにする */
  width: 100%;
  box-sizing: border-box;
  clear: both;

  /* Grid 対策（4列の1マスに押し込まれるのを防ぐ） */
  grid-column: 1 / -1;

  /* Flex 対策（横並びに混ざるのを防ぐ） */
  flex: 0 0 100%;

  /* 見栄え */
  margin: 24px 0;
  padding: 18px 16px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.03);
}

/* 中身を読みやすく */
.asc-tdlm__title{
  font-weight: 700;
  font-size: 16px;
  margin: 0 0 10px;
}

.asc-tdlm__excerpt{
  font-size: 15px;
  line-height: 1.85;
  margin: 0 0 14px;
}

/* ボタンを中央寄せで整える */
.asc-tdlm__cta{
  text-align: center;
  margin-top: 10px;
}

.asc-tdlm__btn{
  display: inline-block;
  max-width: 100%;
}

/* もし親側の「カード用スタイル」が当たる場合の保険 */
.asc-tdlm img,
.asc-tdlm figure{
  max-width: 100%;
  height: auto;
}
/* === ASC Term Detail Links: ボタン色を #fbbc04 に === */
.asc-tdlm__btn{
  background: #fbbc04 !important;
  border-color: #fbbc04 !important;
  color: #111 !important; /* 黒寄りで読みやすく */
  text-decoration: none !important;
}

/* hover */
.asc-tdlm__btn:hover{
  filter: brightness(0.95);
  color: #111 !important;
}
/* === CTAの最後の「＞」だけ整える === */
.asc-tdlm__btn{
  position: relative;
  padding-right: 2.2em; /* 右側に余白を作る（＞の居場所） */
}

.asc-tdlm__btn::after{
  content: "›";               /* 見た目が整う記号（＞より自然） */
  position: absolute;
  right: 0.9em;
  top: 50%;
  transform: translateY(-52%); /* 少しだけ下げる */
  font-size: 0.95em;          /* 少し小さく */
  font-weight: 700;
  line-height: 1;
  opacity: 0.9;
}
/* CTAボタン：文字色を白に */
.asc-tdlm__btn{
  color: #fff !important;
}

/* hover/active/focus でも白固定 */
.asc-tdlm__btn:hover,
.asc-tdlm__btn:focus,
.asc-tdlm__btn:active{
  color: #fff !important;
}

/* ::after の矢印を使っている場合は矢印も白に */
.asc-tdlm__btn::after{
  color: #fff;
}


/* =========================================================
   asc-btns を強制的に「PC 4列 / SP 2列」に固定（最終上書き）
========================================================= */

.entry-content ul.asc-btns{
  display:flex !important;
  flex-wrap:wrap !important;
  list-style:none !important;
  padding:0 !important;
  margin:0 0 10px !important; /* 下余白だけ */
  gap:10px !important;
}

.entry-content ul.asc-btns > li{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  width:calc((100% - (10px * 3)) / 4) !important; /* PC 4列 */
}

.entry-content ul.asc-btns > li > a.asc-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:50px !important;
  padding:5px 10px !important;
  box-sizing:border-box !important;
  text-decoration:none !important;

  font-weight:bold !important;
  font-size:14px !important;

  background-color:#ffffff !important;
  border:2px solid #d4af37 !important;
  color:#000000 !important;
  border-radius:6px !important;
}

/* SPは2列に戻す */
@media (max-width: 767px){
  .entry-content ul.asc-btns > li{
    width:calc((100% - 10px) / 2) !important;
  }
}
/* li同士の間隔（外側の余白）は広め */
ul.lec > li,
ol.lec > li{
  margin: 0 0 16px 0 !important;   /* ← liとliの間 */
  padding: 0 !important;           /* ← li内の上下余白はゼロ */
  line-height: 1.45 !important;    /* ← 文字（行間）を詰める：1.35〜1.55で調整 */
}

/* 最後だけ余白なし */
ul.lec > li:last-child,
ol.lec > li:last-child{
  margin-bottom: 0 !important;
}
ul.lec > li,
ol.lec > li{
  font-size: 0.9em !important; /* 少しだけ小さく：0.92〜0.97で調整 */
}
*, *:before, *:after {
  box-sizing: border-box;
}

.col_2{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;              /* ← 余白を詰める（左右/上下共通） */
}

.col_2 > *{
  width: calc(50% - 4px); /* ← gap(8px) の半分を引く */
  margin: 0;              /* ← 旧marginは使わない */
}

.col_2 > * > *{
  background: #ff0000;
  height: 48px;           /* ← 120px→スリムに（好みで80〜96px） */
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 960px) {
  .col_2{
    gap: 10px;            /* ← モバイルは少しだけ余白残す例 */
  }
  .col_2 > *{
    width: 100%;
  }
}