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

/************************************
** 子テーマ用のスタイルを書く
************************************/
a:hover {
  color: #c05a82;
}

/************************************
** 年齢ゲートカスタマイズ
************************************/

.age-gate-heading-title-logo,
.age-gate__heading-title--logo {
  margin-top: 1rem;
  max-width: 190px;
}

.age-gate-subheadline, .age-gate__subheadline {
    font-size: var(--ag-text-subheadline-size, 1.125rem);
}

.age-gate__buttons{
	margin-top: 0.75rem;
}

.age-gate__buttons .age-gate__submit{
	padding: .65rem 1.25rem; 
}

.age-gate__submit.age-gate__submit--yes{
	background-color: #d36c8c;
}



/*必要ならばここにコードを書く*/

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

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

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


/* ===== 夜索：BackGround ===== */

body{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 100vh;
}

/* ガラス化する対象 */
.main, .sidebar, .footer{
  position: relative;
  z-index: 1; /* body::before より上に */
  
  background: rgb(29 31 51 / 90%);  /* 黒文字が読める濃さ */
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
  
  border: 1px solid rgba(000,000,000,.55);
/*  border-radius: 16px;*/
  box-shadow: 0 18px 50px rgba(0,0,0,.20);
}

/* テキストは黒を基本に（テーマが色指定してても崩れにくい） */
/*
.main, .sidebar
.main *, .sidebar *{
  color: #eee;
}
*/


#header-container.header-container.fixed-header{
	padding: 8px 24px;
	background-color: rgba(0,0,0,0.50);
}

#header-in .tagline{
	color: #b1b1b1;
}

.logo-image{
	padding-bottom: 0;
}


/* ==========================
   夜索 アピールエリア
   ========================== */

.yasaku-appeal {
  position: relative;
  overflow: hidden;
	margin-top: 24px;
}

.yasaku-appeal #appeal-in {
	min-height: auto;
}

/* 背景画像 */
.yasaku-appeal__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.yasaku-appeal__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 黒の補助レイヤー（明るさ調整用） */
.yasaku-appeal::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.15); /* ←ここで暗さ調整 */
  z-index: 1;
}

/* 中身 */
.yasaku-appeal__inner {
  position: relative;
  z-index: 2;
  padding: 16px 20px;
  text-align: center;
}

/* テキスト画像 */
.yasaku-appeal__text {
	margin-left: auto;
	margin-right: auto;
}
.yasaku-appeal__text img {
  max-width: 640px;
  width: 100%;
  height: auto;
}



/* =========================================
   Cocoon：モバイルフッターメニュー（下部ボタン列）
   対象：ul.mobile-footer-menu-buttons.mobile-menu-buttons
   ========================================= */

/* 1) 下部メニュー全体の背景 */
ul.mobile-footer-menu-buttons.mobile-menu-buttons {
  background: #0d0d0d;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* 2) 各ボタンのリンク/ラベル（a と label が混在してるので両方） */
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-button-in {
  color: #eaeaea;
}

/* 3) アイコン色（FontAwesome） */
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-icon,
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-icon .fa {
  color: #eaeaea;
}

/* 4) キャプション（ホーム/検索/トップ/サイドバー） */
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-caption {
  color: #cfcfcf;
}

/* 5) ボタン間の区切り線（必要なら） */
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-button {
  border-left: 1px solid rgba(255, 255, 255, 0.10);
}
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-button:first-child {
  border-left: none;
}

/* 6) hover / active（タップしたときの反応） */
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-button-in:hover,
ul.mobile-footer-menu-buttons.mobile-menu-buttons .menu-button-in:active {
  background: rgba(255, 255, 255, 0.08);
}

/* 7) 「チェックで開く」系（検索/サイドバー）開いてる時のボタン強調
   ※ label#search-menu-open / label#sidebar-menu-open が対象 */
#search-menu-input:checked ~ #search-menu-open,
#sidebar-menu-input:checked ~ #sidebar-menu-open {
  background: rgba(255, 255, 255, 0.10);
}

/* =========================================
   検索パネル（#search-menu-content）側の見た目
   ========================================= */

/* 8) 検索パネル背景 */
#search-menu-content.search-menu-content {
  background: #0d0d0d;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* 9) 検索入力 */
#search-menu-content .search-edit {
  background: #141414;
  color: #eaeaea;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

/* 10) プレースホルダー文字 */
#search-menu-content .search-edit::placeholder {
  color: rgba(234, 234, 234, 0.55);
}

/* 11) 検索ボタン */
#search-menu-content .search-submit {
  background: #141414;
  color: #eaeaea;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

/* hover */
#search-menu-content .search-submit:hover {
  background: rgba(255, 255, 255, 0.10);
}

/* =========================================
   サイドバーパネル（#sidebar-menu-content）側
   ========================================= */

/* 12) サイドバー展開パネル背景 */
#sidebar-menu-content.sidebar-menu-content {
  background: #0d0d0d;
}

/* 13) 閉じるボタン（×） */
#sidebar-menu-content .menu-close-button,
#sidebar-menu-content .menu-close-button .fa {
  color: #eaeaea;
}



/* ===== 夜索：トップのタイル（Netflix風 / ストレス少） ===== */

.ys-wrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 18px 12px 40px;
}

/* ===== 夜索：一覧は基本2列（トリミングなし） ===== */

.ys-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* PC/タブレットは2列 */
  gap: 32px 24px;
  align-items: start; /* 高さがバラついても上揃えでストレス減 */
}

/* スマホ：1列（読みやすさ優先） */
@media (max-width: 830px){
  .ys-grid{
    grid-template-columns: 1fr;
    gap: 12px;
  }
	
	main.main{
		margin-left: 0.75rem;
		margin-right: 0.75rem;
		padding: 16px;
		box-sizing: border-box;
	}
}

/* 画像主導：トリミングしない */


/* カード */

.ys-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

/* ===== 夜索：サムネをトリミングしない（規約安全） ===== */

/* サムネ枠はそのまま */


/* 画像が基準 */
.ys-thumb img {  width: 100%;
  height: auto;
  display: block;
  object-fit: unset;
}
.ys-thumb--fallback{
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.06);
}

/* タイトル：2行で省略（文字ストレス最小） */
.ys-title{
  padding: 8px 0 16px;
  font-size: 16px;
  line-height: 1.35;
  color: inherit;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/*
.ys-special-actress .ys-title{
	margin: 8px 0 30px;
}
*/

.ys-snippet{
	font-size: 12px;
}

/* タグ（任意）：2つまで、ラベルUI */
.ys-tags{
  padding: 0 10px 10px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ys-tag{
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
}

/* ページャ */
.ys-pager{
  grid-column: 1 / -1;
  margin-top: 16px;
}
.ys-empty{
  opacity: .7;
}



/* works記事：差し込みUI */

.ys-night-mood__list{display: flex; column-gap:  2rem;
}

.ys-workhead{
  margin: 12px 0 18px;
}

.ys-workcode{
  opacity: .8;
  font-size: 13px;
  margin-bottom: 10px;
}

.ys-actions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (max-width: 600px){
  .ys-actions{ grid-template-columns: 1fr; }
}

.ys-btn{
  display: block;
  text-align: center;
  padding: 12px 10px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}

.ys-btn--pr{
  border-color: rgba(0,0,0,.22);
}


.ys-video{ margin-top: 28px; }
.ys-video__title{ font-size: 16px; margin: 0 0 10px; }



/* 1280x720（16:9）完全対応：切れ防止 */


/* aspect-ratio 非対応ブラウザ用の保険 */
@supports not (aspect-ratio: 16 / 9){
  .ys-video__wrap{
    padding-top: 56.25%;  /* 16:9 */
  }
}



/* 視聴はこちら（縦積み宣伝ブロック） */
.ys-watch{ margin-top: 28px; }
.ys-watch__title{ font-size: 16px; margin: 0 0 10px; }





.ys-watch__link{
  display: block;
  margin-top: 12px;
  padding: 12px 10px;
  text-align: center;
  font-weight: 800;
  border-radius: 14px;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
}

/* ブロック内動画 */






/* 作品情報テーブル（前に入れてるなら不要、未導入なら） */
.ys-infobox{ margin-top: 22px; }
.ys-infobox__title{ font-size: 16px; margin: 0 0 10px; }

.ys-info{
  width: 100%;
  border-collapse: collapse;
  background: transparent;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  overflow: hidden;
}
.ys-info th,.ys-info td{
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,0,0,1);
  font-size: 14px;
  vertical-align: top;
}
.ys-info th{
  width: 34%;
  opacity: .8;
  font-weight: 700;
  background: rgba(0,0,0,1);
}
.ys-info tr:last-child th,
.ys-info tr:last-child td{ border-bottom: none; }








/* コピーが確実に見えるように（Cocoon競合対策） */
.ys-watch__copy{  margin-top: 12px;
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  margin: 10px 0 14px;
  font-size: 14px;
  line-height: 1.6;
}

/* サムネと動画の余白を少し整える */
.ys-watch__video{  margin-top: 14px;
  margin: 12px 0 14px;
}
.ys-watch__thumb{ display:block; margin: 12px 0 14px; }
.ys-watch__thumb img{  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
}

/* ぷるんぷるんボタン：大きめ＋上下余白 */
.ys-watch__link--rich{  margin-top: 14px;
  display: block;
  margin: 18px 0 24px;
  padding: 20px 14px;
  text-align: center;
  font-weight: 900;
  font-size: 16px;
  border-radius: 18px;
  text-decoration: none;
  color: #111;
  background: linear-gradient(135deg, #ffe0ea 0%, #fff 55%, #ffe0ea 100%);
  border: 1px solid rgba(0,0,0,.12);
  box-shadow: 0 10px 22px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.85),
    inset 0 -10px 18px rgba(255,160,190,.18);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.ys-watch__link--rich:hover{  transform: translateY(-1px) scale(1.01);
  filter: brightness(1.02);
  box-shadow: 0 14px 30px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -10px 18px rgba(255,160,190,.22);
}

.ys-watch__link--rich:active{
  transform: translateY(0) scale(.99);
}


/* ===== DMM iframe 1280x720(16:9) 切れ防止：強制上書き ===== */

.ys-watch__video,
.ys-video__wrap{
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
}

.ys-video__wrap{  aspect-ratio: 16 / 9;
  position: relative !important;
  width: 100% !important;
  height: 0 !important;
  padding-top: 56.25% !important;
  background: #000 !important;
}

.ys-video__wrap iframe{  inset: 0;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border: 0 !important;
  display: block !important;
}

/* ===== DMMプレイヤー：下UI分をちょい足しして見切れ防止 ===== */
.ys-video__wrap--dmm{
  height: 0 !important;
  /* 16:9 + 操作バーぶん（画面サイズで可変） */
  padding-top: calc(56.25% + clamp(44px, 6vw, 70px)) !important;
  overflow: visible !important;
}

/* ===== DMM iframe：端末別に下UI分を最適化 ===== */

/* PC・大画面 */
@media (min-width: 1024px){
  .ys-video__wrap--dmm{
    padding-top: calc(56.25% + clamp(46px, 18vw, 168px)) !important;
  }
}

/* タブレット */
@media (min-width: 600px) and (max-width: 1023px){
  .ys-video__wrap--dmm{
    padding-top: calc(56.25% + clamp(56px, 10vw, 120px)) !important;
  }
}

/* スマホ */
@media (max-width: 599px){
  .ys-video__wrap--dmm{
    padding-top: calc(56.25% + clamp(64px, 14vw, 96px)) !important;
  }
}

.ys-video__wrap--dmm iframe{
  height: 100% !important;
}


/* ===== 夜索：サイドバー ===== */
.widget_recent_entries ul li a,
.widget_categories ul li a,
.widget_archive ul li a,
.widget_pages ul li a,
.widget_meta ul li a,
.widget_rss ul li a,
.widget_nav_menu ul li a,
.widget_block ul li a {
  padding: 0.25rem 0.5rem;
}

.widget_recent_entries ul li a:hover,
.widget_categories ul li a:hover,
.widget_archive ul li a:hover,
.widget_pages ul li a:hover,
.widget_meta ul li a:hover,
.widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover,
.widget_block ul li a:hover {
  background-color: #1e73bfa3;
}


/* サイドバー：最新worksを1行に収める */


.ys-sidebar-latest{
	border-top: 1px solid rgba(255,255,255,0.30);
}

.ys-sidebar-latest .ys-sidebar-item{
	border-bottom: 1px solid rgba(255,255,255,0.30);
}



/* クリックしやすくする（任意） */
.ys-sidebar-latest .ys-sidebar-item a{  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 12px 4px;
}

/* Cocoon サイドバー全体の文字サイズを調整 */
#sidebar,
.sidebar{
  font-size: 0.85rem; /* ← まずはこれがおすすめ */
}

/* サイドバー見出しを少し抑える */
#sidebar h2,
.sidebar h2{
  font-size: 1rem;
}

/* attribute タクソノミーだけタグアイコン非表示 */
.wp-block-tag-cloud a {
  padding: 8px 4px;
}

.wp-block-tag-cloud a[href*="/attribute/"] .fa-tag.tax-icon {
  display: none;
}

.wp-block-tag-cloud .fa.fa-tag.tax-icon {
	margin-right: 8px;
}

.ys-actress-cloud{
display:flex;
flex-wrap:wrap;
gap:8px;
}

.ys-actress-cloud a{
padding:6px 10px;
font-size:13px;
background:#000c2366;
border-radius:4px;
text-decoration:none;
}


/* ========================================
   夜索：ハマる？ハマらない？（Neon Liquid Glass / No Hover）
   ======================================== */

.ys-fit{
  margin: 48px 0 36px;
}

/* 横並び */
.ys-fit__cols{
  display: flex;
  gap: 28px;
}

/* 共通カード（ガラス） */
.ys-fit__col{
  flex: 1;
  position: relative;
  padding: 24px 26px;
  border-radius: 18px;
  overflow: hidden;

  /* 白ベタ無し：暗いガラス */
  background: rgba(10, 12, 24, 0.38);

  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);

  border: 1px solid rgba(255,255,255,0.14);

  /* 影は控えめ + 内側のガラス感 */
  box-shadow:
    0 18px 44px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.08);
}

/* hoverは無し（ボタンっぽさ排除） */
.ys-fit__col:hover{ transform: none; }

/* テキストは白で統一 */
.ys-fit,
.ys-fit *{
  color: rgba(255,255,255,0.92);
}

/* Cocoon h3 を強制的に素の見た目へ */
.ys-fit__col h3{
  border: none !important;
  background: none !important;
  margin: 0 0 14px;
  font-size: 17px;
  font-weight: 800;
  color: rgba(255,255,255,0.96) !important;
  letter-spacing: .02em;
	position: relative;      /* 擬似要素用 */
  padding:0 0 0 14px; 
}

/* ネオンの“にじみ”レイヤー（カード全体） */
.ys-fit__col::before{
  content: "";
  position: absolute;
  inset: -60px;
  opacity: .55;
  filter: blur(26px);
  pointer-events: none;
}

/* ネオンの“縁取り”ライン */
.ys-fit__col::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06);
}

/* 共通：左バー本体 */
.ys-fit__col h3::before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.65);
  box-shadow: 0 0 10px rgba(255,255,255,.25);
}



/* =========================
   OK（青ネオン）
   ========================= */

.ys-fit__col--ok{
  border: 1px solid rgba(80, 170, 255, 0.32);
  box-shadow:
    0 18px 44px rgba(0,0,0,.45),
    0 0 38px rgba(80,170,255,.22),
    inset 0 0 0 1px rgba(80,170,255,.14),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.ys-fit__col--ok::before{
  background:
    radial-gradient(circle at 18% 25%, rgba(80,170,255,.55), transparent 55%),
    radial-gradient(circle at 80% 75%, rgba(120,220,255,.30), transparent 60%);
}

.ys-fit__col--ok h3{
  text-shadow:
    0 0 14px rgba(80,170,255,.35);
}

/* OK：青バー */
.ys-fit__col--ok h3::before{
  background: rgba(120, 210, 255, .95);
  box-shadow:
    0 0 14px rgba(80,170,255,.70),
    0 0 28px rgba(80,170,255,.35);
}

/* =========================
   NG（赤ネオン）
   ========================= */

.ys-fit__col--ng{
  border: 1px solid rgba(255, 90, 130, 0.30);
  box-shadow:
    0 18px 44px rgba(0,0,0,.45),
    0 0 38px rgba(255,90,130,.20),
    inset 0 0 0 1px rgba(255,90,130,.13),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.ys-fit__col--ng::before{
  background:
    radial-gradient(circle at 18% 25%, rgba(255,90,130,.52), transparent 55%),
    radial-gradient(circle at 80% 75%, rgba(255,140,170,.28), transparent 60%);
}

.ys-fit__col--ng h3{
  text-shadow:
    0 0 14px rgba(255,90,130,.32);
}

/* NG：赤バー */
.ys-fit__col--ng h3::before{
  background: rgba(255, 140, 170, .95);
  box-shadow:
    0 0 14px rgba(255,90,130,.65),
    0 0 28px rgba(255,90,130,.32);
}

/* リスト（ネオンに合うドット） */
.ys-fit__col ul{
  list-style: none;
  padding-left: 0;
  margin: 10px 0 0;
}

.ys-fit__col li{
  position: relative;
  padding-left: 22px;
  margin-bottom: 10px;
  line-height: 1.75;
  font-weight: 500;
  color: rgba(255,255,255,0.88);
}

/* ドットはガラス＋発光 */
.ys-fit__col li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.85);
  box-shadow: 0 0 12px rgba(255,255,255,.35);
}

/* ドットの色味も対比（OK/NG） */
.ys-fit__col--ok li::before{
  background: rgba(170,230,255,.92);
  box-shadow: 0 0 14px rgba(80,170,255,.45);
}

.ys-fit__col--ng li::before{
  background: rgba(255,190,210,.92);
  box-shadow: 0 0 14px rgba(255,90,130,.40);
}

/* モバイル：縦積み */
@media (max-width: 768px){
  .ys-fit__cols{ flex-direction: column; }
}


.ys-thumb{  width: 100%;
  background: #f5f5f5;
  position: relative;
}





/* ------------------------------
  夜索：共通カード（関連記事用）
  .ys-card.ys-card--related
------------------------------ */

.ys-card .ys-thumb img{
  display:block;
  width:100%;
  height:auto;
}

/* related = 横長レイアウト */
.ys-card--related{
  display:flex;
  gap:14px;
  padding:14px;
  border-radius:12px;
  background:rgba(20, 22, 30, 0.65);
  border:1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(6px);
}

.ys-card--related:hover{
  border-color: rgba(74, 168, 255, 0.55);
}

/* 左：サムネ */
.ys-card--related .ys-thumb{
  position:relative;
  flex:0 0 160px;      /* Cocoonの標準 160x90 に寄せる */
  width:160px;
  border-radius:10px;
  overflow:hidden;
}

.ys-card--related .ys-thumb img{
  width:160px;
  height:90px;
  object-fit:cover;
}

/* PRバッジ（サムネ左上） */
.ys-card--related .ys-badge-pr{
  position:absolute;
  top:8px;
  left:8px;
  z-index:2;
  font-size:12px;
  line-height:1;
  padding:6px 8px;
  border-radius:8px;
  background:rgba(0,0,0,0.70);
  border:1px solid rgba(255,255,255,0.18);
  color:#fff;
}

/* 右：本文 */
.ys-card--related .ys-body{
  min-width:0;
  flex:1;
}

/* タイトル */
.ys-card--related .ys-title{
  font-size:15px;
  font-weight:700;
  line-height:1.45;
  color:#fff;
  margin:0 0 6px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* スニペット */
.ys-card--related .ys-snippet{
  font-size:13px;
  line-height:1.7;
  color:rgba(255,255,255,0.72);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* タグは関連記事では基本非表示の想定（出すならONにして） */
.ys-card--related .ys-tags{
  margin:0 0 6px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.ys-card--related .ys-tag{
  font-size:12px;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.10);
  color:rgba(255,255,255,0.85);
}

/* スマホ最適化 */
@media (max-width: 560px){
  .ys-card--related{
    padding:12px;
    gap:12px;
  }

  .ys-card--related .ys-thumb{
    flex:0 0 120px;
    width:120px;
  }

  .ys-card--related .ys-thumb img{
    width:120px;
    height:68px;
  }

  .ys-card--related .ys-title{
    -webkit-line-clamp:3;
  }
}


.ys-card{  border-radius: 8px;
  overflow: hidden;
  background: rgba(40, 26, 56, 0.55);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  transition: transform .12s ease, box-shadow .12s ease;
  display: block;
  text-decoration: none;
  color: inherit;
}

.ys-card__thumb{
position:relative;
}

.ys-badge-pr{  z-index: 3;
  line-height: 1;
  font-weight: 700;
  backdrop-filter: blur(6px);
  position: absolute;
  top: 6px;
  left: 6px;
 background:hwb(0deg 5.06% 94.94% / 30%);
  color: #fff;
  font-size: 12px;
  padding: 6px 16px;
  border-radius: 3px;
}

.ys-card__title{
font-size:15px;
line-height:1.4;
}



.ys-card__actress{
font-size:12px;
color:#666;
}

/* カード内の文章が長くても崩れないようにする */


/* frontだけ行数を増やしたい場合 */


.ys-card__body{
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* 抜粋が短いカードでも下が浮かないように（必要なら） */
.ys-card__snippet{  font-size: 13px;
  opacity: .8;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 1.6;
  max-height: calc(1.6em * 3);
  min-height: calc(1.6em * 3);
}
.ys-card--front .ys-card__snippet{  -webkit-line-clamp: 4;
  max-height: calc(1.6em * 4);
  min-height: calc(1.6em * 4);
}


/* ===============================
   夜索：関連記事カード 横レイアウト
   =============================== */

.related-list .ys-card--related{
  display:flex;
  align-items:center;
  gap:14px;

  padding:14px;
  border-radius:12px;
  background:rgba(20,22,30,.6);
  border:1px solid rgba(255,255,255,.08);
}

/* サムネ */
.related-list .ys-card--related .ys-thumb{
  flex:0 0 160px;
  width:160px;
}

.related-list .ys-card--related .ys-thumb img{
  width:160px;
  height:90px;
  object-fit:cover;
  border-radius:8px;
}

/* 本文 */
.related-list .ys-card--related .ys-body{
  flex:1;
  min-width:0;
}

/* タイトル */
.related-list .ys-card--related .ys-title{
  font-size:16px;
  font-weight:600;
  margin:0 0 8px 0;
  line-height:1.4;
  padding: 0;

  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* 説明（1行だけ） */
.related-list .ys-card--related .ys-snippet{
  font-size:12px;
  opacity:.8;
  line-height:1.6;

  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}


/* =========================================
   夜索：special詳細ページ
   ========================================= */

.ys-special-actress{
  margin: 0 0 56px;
}

.ys-special-actress:last-child{
  margin-bottom: 0;
}

/* 女優名（1列） */
.ys-special-actress-name{
  margin: 0 0 18px;
  font-size: 26px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: .02em;
}

/* 2カラム
   左：画像
   右：spec / catch / desc */
.ys-special-profile{
  display: grid;
  grid-template-columns: 333px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

/* 左カラム画像 */
.ys-special-image{
  width: 100%;
}

.ys-special-image img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}

/* 右カラム */
.ys-special-info{
  min-width: 0;
}

/* スペック */
.ys-special-specs{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.ys-special-specs span{
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1.4;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
}

/* キャッチコピー */
.ys-special-catch{
  margin: 0 0 14px;
  padding-left: 12px;
  font-size: 24px;
  line-height: 1.6;
  font-weight: 700;
  border-left: 3px solid rgba(255,255,255,.28);
}

/* 説明文 */
.ys-special-desc{
  font-size: 14px;
  line-height: 1.9;
  opacity: .96;
}

.ys-special-desc p{
  margin: 0 0 1em;
}

.ys-special-desc p:last-child{
  margin-bottom: 0;
}

/* 関連作品タイトル（1列） */
.ys-special-related-title{
  margin: 30px 0 14px;
  font-size: 20px;
  line-height: 1.4;
  font-weight: 700;
}

/* 関連作品グリッド */
.ys-related-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}

/* 関連作品カード内の余計な余白を少し整える */
.ys-related-grid .ys-card{
  height: 100%;
}

.ys-related-grid .ys-body{
  padding-top: 8px;
}

/* タブレット */
@media (max-width: 980px){
  .ys-special-profile{
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 20px;
  }

  .ys-related-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

/* スマホ */
@media (max-width: 680px){
  .ys-special-actress-name{
    font-size: 22px;
    margin-bottom: 14px;
  }

  .ys-special-profile{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .ys-special-image{
    max-width: 320px;
  }

  .ys-special-related-title{
    margin-top: 24px;
    font-size: 18px;
  }

  .ys-related-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
}


.under-entry-content .wp-block-heading{margin:16px 0 16px;}
.under-entry-content .wp-block-tag-cloud span {margin-left:0;}

.ys-content-box{margin-bottom: 4rem;}
