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

/************************************
** Noctheca 配色B（紺×ローズ）
** 正本：このリポジトリの theme/cocoon-child/style.css
** 設計：docs/site-build-design.md §8（2026-09-27）
** WordPress のテーマファイルエディターへは、このファイルを丸ごと貼る
************************************/

:root {
  --nx-navy: #1B1F3B;        /* メイン：ヘッダー・H2・見出し文字（白文字 16.08） */
  --nx-navy-deep: #12152A;   /* 最上部の帯・フッター */
  --nx-rose: #FF5C8A;        /* アクセント：線・下線・紺地の上の文字（紺地 5.48）。白地の文字には使わない */
  --nx-rose-text: #C2185B;   /* 白地の上でローズの文字が必要なとき（白地 5.87） */
  --nx-pink-soft: #FCE8EF;   /* チップ・淡い面 */
  --nx-bg: #FBE6EE;          /* ページの外側（極薄ピンク。2026-10-10 運営者の決定） */
  --nx-surface: #FFF6F9;     /* 本文の面・カード（ほぼ白のピンク。2026-10-10） */
  --nx-text: #222222;
  --nx-muted: #555555;       /* 補足文字（白地 7.46） */
  --nx-link: #2B4C9B;        /* 本文リンク（白地 8.05） */
  --nx-border: #E3DDCF;
  --nx-border-strong: #D9D2C1;
  --nx-cta: #15803D;         /* CTA 緑（白文字 5.02） */
  --nx-cta-2: #0069d9;       /* 比較の2つ目 青（白文字 5.22） */
  --nx-on-dark: #E9E4D8;     /* 紺地の上の本文色 */
  --nx-on-dark-muted: #C9C3B4;
}

/* ---------- 全体 ---------- */
body,
body.public-page {   /* Cocoon の設定が body.public-page に背景色を出すので、同じ形で上書きする */
  background-color: var(--nx-bg) !important;
  color: var(--nx-text);
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", YuGothic, "Noto Sans JP", Meiryo, sans-serif;
}
a { color: var(--nx-link); }
a:hover { color: var(--nx-navy); }

/* ---------- 最上部の帯（Cocoon 設定 → 通知エリア） ---------- */
.notice-area {
  background-color: var(--nx-navy-deep);
  color: var(--nx-on-dark);
  font-size: 13px;
  letter-spacing: 0.04em;
}

/* ---------- ヘッダー ---------- */
.header-container,
.header-container .header,
#header {
  background-color: var(--nx-navy);
}
.site-name-text-link,
.site-name-text-link:hover {
  color: #FAF8F3;
}
.site-name-text {
  font-family: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  font-weight: 600;
  letter-spacing: 0.06em;
}
.tagline {
  color: var(--nx-on-dark-muted);
}

/* ---------- グローバルナビ ---------- */
#navi,
#navi .navi-in,
#navi .navi-in > ul {
  background-color: var(--nx-navy);
}
#navi {
  border-bottom: 3px solid var(--nx-rose);
}
#navi .navi-in a {
  color: #FAF8F3;
  font-weight: 600;
  font-size: 15px;
}
#navi .navi-in a:hover {
  background-color: rgba(255, 92, 138, 0.16);
  color: #FFFFFF;
}
#navi .navi-in > ul .sub-menu {
  background-color: var(--nx-navy);
}

/* ---------- 本文の面・サイドバー ---------- */
.main {
  background-color: var(--nx-surface);
  border: 1px solid #F3C6D6;
  border-radius: 12px;
}
.sidebar {
  background-color: transparent;
}
.sidebar .widget {
  background-color: var(--nx-surface);
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 20px;
}
.sidebar h2,
.sidebar h3 {
  background-color: transparent;
  color: var(--nx-navy);
  border-radius: 0;
  border-bottom: 3px solid var(--nx-rose);
  padding: 0 0 8px;
  margin: 0 0 12px;
  font-size: 17px;
  font-weight: 800;
}

/* ---------- 記事 ---------- */
.article {
  font-size: 17px;
  line-height: 1.9;
}
.entry-title,
.article h1 {
  color: var(--nx-navy);
  font-weight: 800;
  line-height: 1.5;
}
.article h2 {
  background-color: var(--nx-navy);
  color: #FFFFFF;
  border-radius: 8px;
  border-bottom: 3px solid var(--nx-rose);
  padding: 14px 22px;
  font-weight: 800;
  line-height: 1.5;
}
.article h3 {
  background-color: transparent;
  color: var(--nx-navy);
  border: 0;
  border-bottom: 3px solid var(--nx-rose);
  border-radius: 0;
  padding: 0 0 8px;
  font-weight: 800;
  line-height: 1.5;
}
.article h4 {
  background-color: transparent;
  color: var(--nx-navy);
  border: 0;
  border-left: 5px solid var(--nx-rose);
  padding: 2px 0 2px 12px;
  font-weight: 800;
}

/* 目次 */
.toc {
  border: 1px solid var(--nx-border-strong);
  border-radius: 10px;
  background-color: #FBFAF7;
}
.toc-title {
  color: var(--nx-navy);
  font-weight: 800;
}

/* 表（ブロックの表・テンプレートの表の両方） */
.article table th {
  background-color: var(--nx-navy);
  color: #FFFFFF;
}
.article table th,
.article table td {
  border-color: var(--nx-border-strong);
}

/* 記事一覧のカード・カテゴリラベル */
.entry-card-wrap {
  background-color: var(--nx-surface);
  border: 1px solid var(--nx-border);
  border-radius: 12px;
}
.cat-label {
  background-color: var(--nx-navy);
  color: #FFFFFF;
  border: 0;
  border-radius: 4px;
}

/* ---------- フッター ---------- */
.footer,
#footer {
  background-color: var(--nx-navy-deep);
  color: var(--nx-on-dark);
}
.footer a,
#footer a,
.navi-footer-in a {
  color: var(--nx-on-dark);
}
.footer .site-name-text {
  color: #FAF8F3;
}

/* ---------- トップへ戻る・スマホ用フッターメニュー ---------- */
.go-to-top-button,
.go-to-top-button:hover {
  background-color: var(--nx-navy);
  color: #FFFFFF;
}
.mobile-footer-menu-buttons {
  background-color: var(--nx-surface);
  border-top: 1px solid var(--nx-border-strong);
}
.mobile-footer-menu-buttons .menu-button,
.mobile-footer-menu-buttons .menu-button a {
  color: var(--nx-navy);
}

/************************************
** トップページ（固定ページ「トップ」。本文の正本は pages/home.html）
************************************/
/* フロントページでは、ページタイトル・日付・目次を出さない */
.home.page .entry-title,
.home.page .date-tags,
.home.page .toc {
  display: none;
}
.nx-top {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
/* ヒーロー */
.nx-hero {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 8px 0 32px;
  border-bottom: 1px solid #F3C6D6;
}
.nx-hero-title {
  margin: 0;
  font-size: 32px;
  font-weight: 800;
  color: var(--nx-navy);
  line-height: 1.45;
}
.nx-hero-lead {
  margin: 0;
  font-size: 16px;
  color: #3A3A3A;
}
.nx-search {
  display: flex;
  width: 100%;
  max-width: 640px;
  margin: 8px 0 0;
}
.nx-search input[type="search"] {
  flex-grow: 1;
  min-width: 0;
  height: 52px;
  border: 2px solid var(--nx-navy);
  border-right: 0;
  border-radius: 26px 0 0 26px;
  padding: 0 20px;
  font-size: 16px;
  font-family: inherit;
  background-color: #FFFFFF;
}
.nx-search button {
  width: 88px;
  height: 56px;
  border: 0;
  border-radius: 0 28px 28px 0;
  background-color: var(--nx-navy);
  color: #FFFFFF;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.nx-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--nx-muted);
}
.nx-chips a {
  background-color: var(--nx-pink-soft);
  color: var(--nx-navy);
  border-radius: 16px;
  padding: 6px 14px;
  text-decoration: none;
}
.nx-promises {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nx-promises li {
  font-size: 14px;
  color: var(--nx-navy);
  border: 1px solid var(--nx-border-strong);
  border-radius: 8px;
  padding: 8px 14px;
  background-color: #FBFAF7;
}
.nx-promises li::before {
  content: "✓ ";
  color: var(--nx-cta);
  font-weight: 800;
}
/* セクション見出し（本文用の紺帯 H2 を打ち消す） */
.article .nx-top h2.nx-sec-title {
  background-color: transparent;
  color: var(--nx-navy);
  border: 0;
  border-left: 6px solid var(--nx-rose);
  border-radius: 0;
  padding: 2px 0 2px 12px;
  margin: 0 0 16px;
  font-size: 22px;
  font-weight: 800;
}
.nx-sec-note {
  font-size: 13px;
  color: var(--nx-muted);
  margin: -8px 0 12px;
}
/* カードの並び */
.nx-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.nx-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background-color: #FFFFFF;
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  padding: 18px 18px 16px;
  text-decoration: none;
  color: var(--nx-text);
}
.nx-card:hover {
  border-color: var(--nx-rose);
  color: var(--nx-text);
}
.nx-card-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--nx-navy);
}
.nx-card-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--nx-muted);
}
.nx-card-more {
  font-size: 13px;
  font-weight: 700;
  color: var(--nx-link);
  margin-top: 4px;
}
/* 不安・疑問のリスト */
.nx-qs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.nx-q {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  background-color: #FFFFFF;
  border: 1px solid var(--nx-border);
  border-radius: 10px;
  padding: 12px 14px;
  text-decoration: none;
  color: var(--nx-text);
  font-weight: 700;
  font-size: 15px;
}
.nx-q::before {
  content: "Q";
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  background-color: var(--nx-pink-soft);
  color: var(--nx-navy);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nx-q:hover {
  border-color: var(--nx-rose);
  color: var(--nx-text);
}
/* 運営者と記事の作り方 */
.nx-about {
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  padding: 22px 24px;
  background-color: #FBFAF7;
}
.nx-about ul {
  margin: 8px 0 12px;
  padding-left: 20px;
  font-size: 15px;
}

/* ==== トップの改修（2026-10-09）ここから。正本：design/top-20261009/top-new.css ==== */
/************************************
** トップの改修案（2026-10-09）：子テーマ style.css の「トップページ」の節に追記する分
** 既存の .nx-* は変えず、新しい部品だけ足す。色は :root の変数だけを使う
************************************/

/* ヒーロー：小さな見出し（kicker）とコピーの組み替え */
.nx-hero-kicker {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--nx-rose-text);
}

/* セクション見出しの横の補足（「終了が近い順」など） */
.article .nx-top h2.nx-sec-title .nx-sec-sub {
  margin-left: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--nx-muted);
}
.nx-pr {
  display: inline-block;
  margin-right: 8px;
  padding: 1px 8px;
  border: 1px solid var(--nx-border-strong);
  border-radius: 4px;
  background-color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  color: var(--nx-navy);
}

/* ---------- 今日のセール（終了が近い順に3件） ---------- */
.nx-sale-row {
  --nx-asp-duga: #5B3FD9;
  --nx-asp-mgs: #B45309;
  --nx-asp-sokmil: #0F766E;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.nx-sale-card {
  --c: var(--nx-navy);
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px 12px 16px;
  border: 1px solid var(--nx-border);
  border-left: 6px solid var(--c);
  border-radius: 12px;
  background-color: #FFFFFF;
  text-decoration: none;
  color: var(--nx-text);
}
.nx-sale-card:hover {
  border-color: var(--c);
  color: var(--nx-text);
}
.nx-sale-duga { --c: var(--nx-asp-duga); }
.nx-sale-mgs { --c: var(--nx-asp-mgs); }
.nx-sale-sokmil { --c: var(--nx-asp-sokmil); }
.nx-sale-asp {
  font-size: 12px;
  font-weight: 800;
  color: var(--c);
}
.nx-sale-rate {
  display: flex;
  align-items: baseline;
  gap: 2px;
  font-size: 34px;
  line-height: 1.1;
  font-weight: 800;
  color: var(--nx-navy);
  font-variant-numeric: tabular-nums;
}
.nx-sale-rate small {
  font-size: 15px;
  font-weight: 800;
}
.nx-sale-title {
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
  color: var(--nx-navy);
}
.nx-sale-end {
  margin-top: 2px;
  font-size: 12px;
  color: var(--nx-muted);
}
.nx-more {
  display: inline-block;
  margin-top: 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--nx-link);
}

/* ---------- おすすめ女優（パッケージ画像つきのカード） ---------- */
.nx-pick-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}
.nx-pick {
  display: flex;
  flex-direction: column;
  background-color: #FFFFFF;
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  overflow: hidden;
}
.nx-pick:hover {
  border-color: var(--nx-rose);
}
.nx-pick-img {
  display: block;
  background-color: var(--nx-bg);
  line-height: 0;
}
/* 画像は切り抜かず、縦横比のまま縮小する（ASP の素材ルール） */
.nx-pick-img img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}
.nx-pick-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 8px;
  padding: 12px 12px 14px;
}
.nx-pick-name {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--nx-navy);
}
.nx-pick-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nx-pick-tags li {
  margin: 0;
  padding: 2px 8px;
  border-radius: 10px;
  background-color: var(--nx-pink-soft);
  font-size: 12px;
  font-weight: 700;
  color: var(--nx-navy);
}
.nx-pick-work {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--nx-muted);
}
/* 代表作のリンク（題名）は文字色のまま */
.nx-pick-work a {
  color: inherit;
  text-decoration: none;
}
.nx-pick-work a:hover {
  text-decoration: underline;
}
/* 女優名で各 ASP の検索結果へ（色は セール一覧と同じ ASP の色。白文字のコントラスト 5.0 以上） */
.nx-pick-asp {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: auto;
}
.nx-pick-asp-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--nx-navy);
}
.nx-pick-asp-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.nx-asp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 6px 2px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  color: #FFFFFF;
}
.nx-asp-btn:hover {
  filter: brightness(1.12);
  color: #FFFFFF;
}
.nx-asp-mgs { background-color: #B45309; }
.nx-asp-duga { background-color: #5B3FD9; }
.nx-asp-sokmil { background-color: #0F766E; }
.nx-pick-foot {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--nx-muted);
}

/* ---------- 棚の入口（ページができるまで「準備中」） ---------- */
.nx-card.is-soon {
  background-color: #FBFAF7;
  border-style: dashed;
  color: var(--nx-muted);
  cursor: default;
}
.nx-card.is-soon .nx-card-title {
  color: var(--nx-muted);
}
.nx-card.is-soon .nx-card-more {
  color: var(--nx-muted);
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 834px) {
  .nx-sale-row {
    grid-template-columns: 1fr;
  }
  /* 女優カードは横にスワイプ（幅の約 46%、次のカードが少し見える） */
  .nx-pick-row {
    display: flex;
    gap: 12px;
    margin: 0 -16px;
    padding: 0 16px 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .nx-pick {
    flex: 0 0 46%;
    scroll-snap-align: start;
  }
}
@media screen and (max-width: 480px) {
  /* 2人ぶんが見えて、次のカードが少しのぞく大きさ。ボタンは縦に並べる */
  .nx-pick {
    flex-basis: 44%;
  }
  .nx-pick-row {
    gap: 8px;
  }
  .nx-pick-body {
    gap: 6px;
    padding: 10px 8px;
  }
  .nx-pick-name {
    font-size: 16px;
  }
  .nx-pick-work {
    -webkit-line-clamp: 2;
  }
  .nx-pick .nx-pick-asp-row {
    grid-template-columns: 1fr;
  }
  .nx-pick .nx-asp-btn {
    min-height: 36px;
  }
}
/* 「横にスワイプ」の案内（スマホ・タブレットだけ） */
.nx-swipe-hint {
  display: none;
}
@media screen and (max-width: 834px) {
  .nx-swipe-hint {
    display: block;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--nx-rose-text);
  }
}

/* ---------- 回転レーン（セール中の女優作品。回転ずしのように流れる） ---------- */
.nx-lane {
  --nx-asp-duga: #5B3FD9;
  --nx-asp-mgs: #B45309;
  --nx-asp-sokmil: #0F766E;
  margin: 0 0 4px;
  border-radius: 14px;
  background-color: var(--nx-navy);
  border-bottom: 3px solid var(--nx-rose);
  overflow: hidden;
}
.nx-lane-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  padding: 10px 14px 4px;
  font-size: 15px;
  font-weight: 800;
  color: #FFFFFF;
}
.nx-lane-head .nx-pr {
  margin-right: 0;
  border-color: var(--nx-on-dark-muted);
  background-color: transparent;
  color: var(--nx-on-dark);
}
.nx-lane-sub {
  font-size: 12px;
  font-weight: 500;
  color: var(--nx-on-dark-muted);
}
.nx-lane-view {
  overflow: hidden;
  padding: 6px 0 12px;
}
.nx-lane-track {
  display: flex;
  gap: 12px;
  width: max-content;
  padding-left: 12px;
  animation: nx-lane-move var(--nx-lane-dur, 60s) linear infinite;
}
.nx-lane:hover .nx-lane-track,
.nx-lane:focus-within .nx-lane-track {
  animation-play-state: paused;
}
@keyframes nx-lane-move {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.nx-lane-item {
  --c: var(--nx-navy);
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  width: 124px;
  border-radius: 8px;
  background-color: #FFFFFF;
  overflow: hidden;
  text-decoration: none;
  color: var(--nx-text);
  border-bottom: 4px solid var(--c);
}
.nx-lane[hidden],
.nx-lane-item[hidden],
.nx-sale-card[hidden] { display: none !important; }
.nx-lane-item:hover { color: var(--nx-text); filter: brightness(1.05); }
.nx-lane-duga { --c: var(--nx-asp-duga); }
.nx-lane-mgs { --c: var(--nx-asp-mgs); }
.nx-lane-sokmil { --c: var(--nx-asp-sokmil); }
.nx-lane-img {
  display: block;
  height: 176px;
  background-color: var(--nx-bg);
  line-height: 0;
}
/* 画像は切り抜かない：縦横比のまま縮小して枠に収める */
.nx-lane-img img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
}
.nx-lane-rate {
  position: absolute;
  top: 6px;
  left: 0;
  padding: 2px 8px 2px 6px;
  border-radius: 0 6px 6px 0;
  background-color: #C2185B;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
  color: #FFFFFF;
}
.nx-lane-rate small { font-size: 10px; }
.nx-lane-pre { font-size: 10px; margin-right: 2px; }
.nx-lane-who {
  padding: 5px 8px 0;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--nx-navy);
}
.nx-lane-asp {
  padding: 0 8px 6px;
  font-size: 11px;
  font-weight: 700;
  color: var(--c);
}
@media (prefers-reduced-motion: reduce) {
  .nx-lane-track { animation: none; }
  .nx-lane-view { overflow-x: auto; }
}
@media screen and (max-width: 480px) {
  .nx-lane-item { width: 108px; }
  .nx-lane-img { height: 152px; }
}
/* ---------- レーンの操作（JS が動くとき：ドラッグ・スワイプ・左右ボタンで向きを変えられる） ---------- */
.nx-lane { position: relative; }
.nx-lane.is-js .nx-lane-track { animation: none; }
.nx-lane.is-js .nx-lane-view {
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  touch-action: pan-x pan-y;
}
.nx-lane.is-js .nx-lane-view::-webkit-scrollbar { display: none; }
.nx-lane.is-js .nx-lane-view.is-drag { cursor: grabbing; user-select: none; }
.nx-lane-btn {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 40px;
  height: 40px;
  margin-top: 4px;
  padding: 0 0 4px;
  border: 0;
  border-radius: 20px;
  background-color: rgba(18, 21, 42, 0.78);
  font-size: 26px;
  line-height: 40px;
  text-align: center;
  color: #FFFFFF;
  cursor: pointer;
}
.nx-lane-btn:hover { background-color: #C2185B; }
.nx-lane-prev { left: 6px; }
.nx-lane-next { right: 6px; }
@media screen and (max-width: 480px) {
  .nx-lane-btn { width: 36px; height: 36px; line-height: 36px; font-size: 22px; }
}
/* ---------- レーンの価格と期限 ---------- */
.nx-lane-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 6px;
  padding: 0 8px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--nx-muted);
}
.nx-lane-price s { color: #6B6B6B; }
.nx-lane-price b { font-size: 15px; font-weight: 800; color: #C2185B; }
.nx-lane-until {
  padding: 0 8px 7px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--nx-muted);
}
/* ==== トップの改修 ここまで ==== */

/* ヒーローの検索：「女優名で作品を探す」と「記事を探す」の2タブ（JS が動かないときは記事検索だけ） */
.nx-finder {
  width: 100%;
  max-width: 640px;
  margin: 8px 0 0;
}
.nx-finder .nx-search {
  margin-top: 0;
  max-width: none;
}
.nx-finder-tabs {
  display: none;
  gap: 6px;
  margin: 0 0 8px;
}
.nx-finder.is-js .nx-finder-tabs {
  display: flex;
}
.nx-finder-tab {
  min-height: 44px;
  padding: 0 14px;
  border: 2px solid var(--nx-navy);
  border-radius: 22px;
  background-color: #FFFFFF;
  color: var(--nx-navy);
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}
.nx-finder-tab.is-on {
  background-color: var(--nx-navy);
  color: #FFFFFF;
}
.nx-finder-out:empty {
  display: none;
}
.nx-finder-out {
  margin-top: 12px;
}
.nx-finder-note {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--nx-muted);
}
.nx-finder-row {
  margin-bottom: 10px;
}
.nx-finder-name {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--nx-navy);
}

/* 女優名で探した結果：サイト別の人気順の作品（DUGA。ソクミルは API キー取得後に追加） */
.nx-finder-works {
  margin-top: 16px;
  font-size: 13px;
  color: var(--nx-muted);
}
.nx-works-head {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 800;
  color: var(--nx-navy);
}
.nx-works-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.nx-work {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 6px;
  border: 1px solid var(--nx-border);
  border-radius: 10px;
  background-color: #FFFFFF;
  color: var(--nx-navy);
  text-decoration: none;
}
.nx-work:hover {
  border-color: var(--nx-rose);
}
.nx-work img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
}
.nx-work-title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}
.nx-work-price {
  font-size: 13px;
  font-weight: 800;
  color: var(--nx-rose-text);
}
.nx-works-sec {
  margin-bottom: 20px;
}
.nx-works-credit {
  display: inline-block;
  margin-top: 10px;
  line-height: 0;
}
@media screen and (min-width: 640px) {
  .nx-works-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* 名前の候補（入力の途中で、正式名と読みを出す） */
.nx-finder {
  position: relative;
}
.nx-suggest {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  background-color: #FFFFFF;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(27, 31, 59, 0.12);
}
.nx-suggest[hidden] {
  display: none;
}
.nx-suggest li {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--nx-border);
}
.nx-suggest li:first-child {
  border-top: 0;
}
.nx-suggest-btn {
  display: flex;
  align-items: baseline;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 8px 16px;
  border: 0;
  background: transparent;
  color: var(--nx-navy);
  font-family: inherit;
  font-size: 16px;
  text-align: left;
  cursor: pointer;
}
.nx-suggest-btn:hover {
  background-color: var(--nx-pink-soft);
}
.nx-suggest-ruby {
  font-size: 12px;
  color: var(--nx-muted);
}

/* AV女優一覧ページ（固定ページ actresses）。色は :root の変数だけを使う */
.nx-al-lead {
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 1.7;
  color: #3A3A3A;
}
.nx-al-rows {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
}
.nx-al-row {
  min-height: 40px;
  padding: 0 12px;
  border: 2px solid var(--nx-navy);
  border-radius: 20px;
  background-color: #FFFFFF;
  color: var(--nx-navy);
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}
.nx-al-row.is-on {
  background-color: var(--nx-navy);
  color: #FFFFFF;
}
.nx-al-count {
  margin: 0 0 8px;
  font-size: 13px;
  color: var(--nx-muted);
}
.nx-al-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.nx-al-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  background-color: #FFFFFF;
  color: var(--nx-navy);
  text-decoration: none;
}
.nx-al-card:hover {
  border-color: var(--nx-rose);
}
.nx-al-card img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
}
.nx-al-name {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.4;
}
.nx-al-ruby {
  font-size: 12px;
  color: var(--nx-muted);
}
.nx-al-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 16px 0;
}
.nx-al-pg {
  min-height: 44px;
  padding: 0 18px;
  border: 2px solid var(--nx-navy);
  border-radius: 22px;
  background-color: #FFFFFF;
  color: var(--nx-navy);
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}
.nx-al-pg:disabled {
  opacity: 0.35;
  cursor: default;
}
.nx-al-pginfo {
  font-size: 14px;
  font-weight: 700;
  color: var(--nx-navy);
}
.nx-al-note {
  margin: 12px 0 8px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--nx-muted);
}
@media screen and (min-width: 520px) {
  .nx-al-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media screen and (min-width: 900px) {
  .nx-al-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

/* AV女優一覧 v2：ジャケット＋各サイトのボタン */
.nx-al-card{padding:0;overflow:hidden;gap:0}
.nx-al-img{display:block}
.nx-al-img img{display:block;width:100%;height:auto;border-radius:0}
.nx-al-body{display:flex;flex-direction:column;gap:4px;padding:8px}
.nx-al-name{margin:0;font-size:15px;font-weight:800;line-height:1.4}
.nx-al-label{margin:0;font-size:12px;color:var(--nx-muted)}
.nx-al-body .nx-pick-asp-row{grid-template-columns:1fr;gap:4px}
.nx-al-body .nx-asp-btn{min-height:34px}

/* AV女優一覧 v3：余白とボタン位置をそろえる */
.nx-al .nx-al-body p{margin:0;padding:0;line-height:1.4}
.nx-al .nx-al-card{height:100%}
.nx-al .nx-al-body{flex:1;gap:2px}
.nx-al .nx-al-label{min-height:2.8em;font-size:11px}
.nx-al .nx-al-body .nx-pick-asp-row{margin-top:auto;padding-top:4px}

/* サイドバー：今日のセール（[noct_sidebar_sale]、2026-10-20） */
.nx-side-sale .nx-sale-row{grid-template-columns:1fr;gap:8px}
.nx-side-sale .nx-sale-card{padding:10px 12px}
.nx-side-sale .nx-sale-rate{font-size:26px}
.nx-side-sale .nx-sec-note{font-size:12px;line-height:1.6;margin:0 0 8px}
.nx-side-sale .nx-more{font-size:13px;line-height:1.5}
.nx-side-item{display:flex;flex-direction:column;gap:6px}
.nx-side-banner{display:block}
#sidebar #block-2{display:none}
.nx-side-banner img{display:block;width:100%;height:auto;border-radius:8px}

/* 年齢確認（Age Gate）：見出しの折り返しを防ぎ、ボタンを配色Bに合わせる */
.age-gate__heading-title {
  font-size: 26px;
  line-height: 1.3;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
button.age-gate__submit--yes,
button.age-gate__submit--yes:hover,
button.age-gate__submit--yes:focus {
  background-color: var(--nx-navy);
  border: 2px solid var(--nx-navy);
  color: #fff;
}
button.age-gate__submit--no,
button.age-gate__submit--no:hover,
button.age-gate__submit--no:focus {
  background-color: #fff;
  border: 2px solid var(--nx-navy);
  color: var(--nx-navy);
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  .main {
    border-radius: 0;
  }
}

/*834px以下*/
@media screen and (max-width: 834px){
  .nx-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .nx-qs {
    grid-template-columns: 1fr;
  }
  .nx-hero-title {
    font-size: 24px;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .notice-area {
    font-size: 11px;
    letter-spacing: 0;
  }
  .article {
    font-size: 16px;
    line-height: 1.85;
  }
  .article h2 {
    padding: 12px 16px;
  }
  .age-gate__heading-title {
    font-size: 21px;
  }
}


/************************************
** 内部リンクのカード [nlink]（2026-10-02。紺×ローズ。functions.php の noctheca_nlink_shortcode）
************************************/
.nc-nlink{display:flex;align-items:stretch;margin:1.5rem 0;border:2px solid #1B1F3B;border-radius:10px;overflow:hidden;background:#F3F5FA;color:#1B1F3B!important;text-decoration:none!important;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.nc-nlink:hover{background:#fff;box-shadow:0 4px 10px rgba(27,31,59,.18)}
.nc-nlink-thumb{flex:0 0 38%;max-width:240px;background:#1B1F3B}
.nc-nlink-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.nc-nlink-body{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.4rem;padding:.9rem 1rem}
.nc-nlink-label{align-self:flex-start;padding:.1rem .7rem;border-radius:999px;background:#FF5C8A;color:#1B1F3B;font-size:.75rem;font-weight:bold}
.nc-nlink-title{font-size:1rem;font-weight:bold;line-height:1.5}
@media (max-width:480px){.nc-nlink-thumb{flex-basis:34%}.nc-nlink-title{font-size:.9rem}}


/************************************
** セール・キャンペーン一覧（2026-10-06。本文は scripts/build_sale_page.py が作る。手順は docs/sale-page-runbook.md）
************************************/
.entry-content:has(.nxs) .toc { display: none; }
.nxs {
  --nxs-duga: #5B3FD9;      /* 白文字 6.9 */
  --nxs-mgs: #B45309;       /* 白文字 5.0 */
  --nxs-sokmil: #0F766E;    /* 白文字 5.5 */
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin: 8px 0 32px;
}
.nxs *, .nxs *::before, .nxs *::after { box-sizing: border-box; }
.nxs [hidden] { display: none !important; }

/* ヒーロー */
.nxs-hero {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  padding: 26px 22px 22px;
  color: var(--nx-on-dark);
  background:
    radial-gradient(110% 150% at 92% -25%, rgba(255, 92, 138, .38), rgba(255, 92, 138, 0) 58%),
    linear-gradient(160deg, #1B1F3B 0%, #12152A 100%);
}
.nxs-hero::after {
  content: "";
  position: absolute;
  right: 26px;
  top: 22px;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  box-shadow: inset -13px 6px 0 0 #FF5C8A;
  transform: rotate(-24deg);
  opacity: .95;
  pointer-events: none;
}
.nxs-pr {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 4px 12px 4px 4px;
  border: 1px solid rgba(233, 228, 216, .4);
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--nx-on-dark);
}
.nxs-pr span {
  padding: 2px 9px;
  border-radius: 999px;
  background: #FF5C8A;
  color: #1B1F3B;
  font-weight: 800;
  letter-spacing: .06em;
}
.nxs-lead {
  margin: 0 70px 18px 0;
  font-size: 15px;
  line-height: 1.8;
  color: var(--nx-on-dark);
}
.nxs-stats {
  display: grid;
  grid-template-columns: repeat(3, auto);
  justify-content: start;
  gap: 10px;
}
.nxs-stat {
  min-width: 96px;
  padding: 10px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(233, 228, 216, .22);
}
.nxs-stat b {
  display: block;
  font-size: 28px;
  line-height: 1.15;
  font-weight: 800;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
}
.nxs-stat-time b { font-size: 15px; line-height: 1.9; }
.nxs-stat span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--nx-on-dark-muted);
}

/* 絞り込み */
.nxs-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.nxs-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1.5px solid var(--nx-navy);
  border-radius: 999px;
  background: #FFFFFF;
  color: var(--nx-navy);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  cursor: pointer;
  transition: background-color .15s, color .15s;
}
.nxs-chip span {
  padding: 0 7px;
  border-radius: 999px;
  background: var(--nx-pink-soft);
  color: var(--nx-navy);
  font-size: 12px;
}
.nxs-chip:hover { background: var(--nx-pink-soft); }
.nxs-chip[aria-pressed="true"] { background: var(--nx-navy); color: #FFFFFF; }
.nxs-chip[aria-pressed="true"] span { background: rgba(255, 255, 255, .2); color: #FFFFFF; }
.nxs-chip:focus-visible, .nxs-cta:focus-visible, .nxs-site:focus-visible { outline: 3px solid #FF5C8A; outline-offset: 2px; }

/* カード */
.nxs-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.nxs-card {
  --c: var(--nx-navy);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 16px 16px 18px;
  border: 1px solid var(--nx-border);
  border-left: 6px solid var(--c);
  border-radius: 12px;
  background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(27, 31, 59, .06);
  transition: box-shadow .15s, transform .15s;
}
.nxs-card:hover { box-shadow: 0 8px 22px rgba(27, 31, 59, .14); transform: translateY(-2px); }
.nxs-duga { --c: var(--nxs-duga); }
.nxs-mgs { --c: var(--nxs-mgs); }
.nxs-sokmil { --c: var(--nxs-sokmil); }
.nxs-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nxs-asp {
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--c);
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
}
.nxs-tag {
  padding: 1px 9px;
  border-radius: 999px;
  background: var(--nx-pink-soft);
  color: var(--nx-navy);
  font-size: 12px;
}
.nxs-flag {
  display: none;
  margin-left: auto;
  padding: 2px 10px;
  border-radius: 999px;
  background: #FF5C8A;
  color: #1B1F3B;
  font-size: 12px;
  font-weight: 800;
}
.nxs-card.is-soon { border-color: #FF5C8A; border-left-color: var(--c); }
.nxs-card.is-soon .nxs-flag { display: inline-block; }
.nxs-rate { display: flex; align-items: baseline; gap: 2px; color: var(--nx-navy); }
.nxs-rate-pre { margin-right: 4px; font-size: 14px; font-weight: 700; }
.nxs-rate-num { font-size: 42px; line-height: 1; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.nxs-rate-unit { font-size: 18px; font-weight: 800; }
.nxs-rate-text { font-size: 24px; line-height: 1.3; font-weight: 800; }
.nxs-title { font-size: 16px; line-height: 1.5; font-weight: 800; color: var(--nx-navy); }
.nxs-desc { margin: 0; font-size: 13px; line-height: 1.7; color: #3A3A3A; flex-grow: 1; }
.nxs-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 2px 0 4px; padding: 8px 0 0; border-top: 1px dashed var(--nx-border-strong); }
.nxs-meta div { display: flex; align-items: baseline; gap: 6px; }
.nxs-meta dt { margin: 0; font-size: 12px; color: var(--nx-muted); }
.nxs-meta dd { margin: 0; font-size: 14px; font-weight: 700; color: var(--nx-navy); font-variant-numeric: tabular-nums; }
.nxs-card.is-soon .nxs-left { color: var(--nx-rose-text); }
.nxs-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 10px 16px;
  border-radius: 10px;
  background: var(--nx-cta);
  color: #FFFFFF;
  font-size: 15px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  transition: filter .15s;
}
.nxs-cta:hover { filter: brightness(1.1); color: #FFFFFF; }
/* キャンペーンのバナー（カードの上部。画像は加工せず、縦横比のまま幅に合わせて縮小） */
.nxs-card-banner { display: block; line-height: 0; border-radius: 8px; overflow: hidden; }
.nxs-card-banner img { display: block; width: 100%; height: auto; }
/* セール・キャンペーン一覧（固定ページ ID 175）はサイドバーなし・本文を全幅に（運営者の指示 2026-10-23） */
body.page-id-175 #sidebar, body.page-id-175 .sidebar { display: none; }
body.page-id-175 .main { width: 100%; max-width: 100%; }
.nxs-empty { margin: 0; padding: 20px; border-radius: 12px; background: #FFFFFF; border: 1px dashed var(--nx-border-strong); text-align: center; color: var(--nx-muted); }

/* 見方・公式サイト・ガイド */
.nxs-note, .nxs-sites {
  padding: 16px 18px;
  border: 1px solid var(--nx-border);
  border-radius: 12px;
  background: #FBFAF7;
}
.nxs-note-title { margin: 0 0 8px; padding-left: 10px; border-left: 5px solid var(--nx-rose); font-size: 16px; font-weight: 800; color: var(--nx-navy); }
.nxs-note ul { margin: 0; padding-left: 1.2em; font-size: 13px; line-height: 1.8; color: #3A3A3A; }
.nxs-sites-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.nxs-site {
  --c: var(--nx-navy);
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #FFFFFF;
  border: 1px solid var(--nx-border);
  border-top: 5px solid var(--c);
  text-decoration: none;
  color: var(--nx-navy);
}
.nxs-site.nxs-duga { --c: var(--nxs-duga); }
.nxs-site.nxs-mgs { --c: var(--nxs-mgs); }
.nxs-site.nxs-sokmil { --c: var(--nxs-sokmil); }
.nxs-site:hover { box-shadow: 0 6px 16px rgba(27, 31, 59, .14); color: var(--nx-navy); }
.nxs-site-name { font-size: 16px; font-weight: 800; }
.nxs-site-go { font-size: 12px; color: var(--nx-muted); }
.nxs-guides { list-style: none; padding-left: 0 !important; }
.nxs-guides li { margin: 4px 0; }
.nxs-guides a { font-weight: 700; }

@media (prefers-reduced-motion: reduce) {
  .nxs-card, .nxs-chip, .nxs-cta { transition: none; }
  .nxs-card:hover { transform: none; }
}
@media screen and (max-width: 640px) {
  .nxs-grid { grid-template-columns: 1fr; }
  .nxs-sites-row { grid-template-columns: 1fr; }
  .nxs-lead { margin-right: 0; }
  .nxs-hero::after { width: 40px; height: 40px; right: 16px; top: 16px; box-shadow: inset -9px 4px 0 0 #FF5C8A; }
  .nxs-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nxs-stat-time { grid-column: 1 / -1; }
  .nxs-rate-num { font-size: 38px; }
}

/* 公式バナーの行（2026-10-07。各サービスの広告素材を、加工せず縦横比を保って拡大・縮小だけ） */
.nxs-banners { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.nxs-banner {
  --c: var(--nx-navy);
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 8px 10px;
  border: 1px solid var(--nx-border);
  border-top: 5px solid var(--c);
  border-radius: 10px;
  background: #FFFFFF;
  text-decoration: none;
  color: var(--nx-navy);
  transition: box-shadow .15s, transform .15s;
}
.nxs-banner.nxs-duga { --c: var(--nxs-duga); }
.nxs-banner.nxs-mgs { --c: var(--nxs-mgs); }
.nxs-banner.nxs-sokmil { --c: var(--nxs-sokmil); }
.nxs-banner:hover { box-shadow: 0 6px 16px rgba(27, 31, 59, .14); transform: translateY(-2px); color: var(--nx-navy); }
.nxs-banner img { display: block; width: 100%; height: auto; border-radius: 4px; }
.nxs-banner-cap { padding: 0 2px; font-size: 12px; line-height: 1.5; font-weight: 700; }
.nxs-banner:focus-visible { outline: 3px solid #FF5C8A; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .nxs-banner { transition: none; }
  .nxs-banner:hover { transform: none; }
}
@media screen and (max-width: 640px) {
  .nxs-banners { grid-template-columns: 1fr; }
}
