/* 間取り gallery（にじエロ型）。数値は nijifan-net-design-probe-20260904.md の実測。色の帯・フッターは間取りの一部なのでここに持つ。9/4 夜 */
.yms-layout-gallery { --gwidth: 1232px; --gred: #C50025; }
.yms-layout-gallery .yms-gwrap, .yms-layout-gallery .yms-shell { max-width: calc(var(--gwidth) + 48px); margin: 0 auto; padding: 0 24px 48px; }
.yms-layout-gallery .yms-gwrap--narrow { max-width: 1116px; }

/* 帯: 高さ60（SP54）・#0A0A0A。名前・メニュー14px/700・検索 */
.yms-topbar { background: #0A0A0A; color: #fff; }
.yms-topbar__in { max-width: calc(var(--gwidth) + 48px); margin: 0 auto; padding: 0 24px; min-height: 60px; display: flex; align-items: center; gap: 22px; }
.yms-topbar__name { color: #fff; text-decoration: none; font-size: 18px; font-weight: 900; letter-spacing: .02em; white-space: nowrap; }
/* ロゴ（9/5 Codex納品 banners-<skin>/logo-header.svg）: PC 130×40・SP 104×32。参考サイトの帯60pxに40pxの白抜き */
.yms-topbar__name.yms-brand--logo { display: inline-flex; align-items: center; }
.yms-topbar__name img { display: block; width: 130px; height: 40px; }
.yms-gfoot__name img { display: block; width: 156px; height: 48px; }
.yms-topbar__nav { display: flex; gap: 2px; flex: 1; flex-wrap: wrap; }   /* overflow-x を付けると overflow-y も auto になり、開閉パネル（絶対配置）が帯の箱で切り落とされる（9/5 レビューで実測） */
.yms-topbar__nav a, .yms-topbar__nav .yms-topbar__dd > label { color: #fff; text-decoration: none; font-size: 14px; font-weight: 700; padding: 0 12px; min-height: 44px; display: inline-flex; align-items: center; white-space: nowrap; }
.yms-topbar__nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.yms-topbar__search { display: flex; margin-left: auto; }
.yms-topbar__search input { width: 150px; min-height: 40px; border: 1px solid #333; background: #1c1c1c; color: #fff; padding: 0 10px; border-radius: 2px 0 0 2px; font-size: 13px; }
.yms-topbar__search button { min-width: 44px; min-height: 40px; border: 1px solid #333; border-left: 0; background: #1c1c1c; color: #fff; font-size: 18px; border-radius: 0 2px 2px 0; cursor: pointer; }
@media (max-width: 767px) { .yms-topbar__in { min-height: 54px; gap: 10px; padding: 0 12px; } .yms-topbar__search input { width: 84px; } .yms-topbar__name { font-size: 16px; } .yms-topbar__name img { width: 104px; height: 32px; } }

/* 節の見出し: 英字11px 字間広め #999 → 和名 17px/700 #111。左に3pxの黒線 */
.yms-ghead { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 28px 0 14px; padding-left: 12px; border-left: 3px solid #111; }
.yms-ghead__en { display: block; font-size: 11px; letter-spacing: .14em; color: #999; font-weight: 600; font-family: Poppins, Roboto, system-ui, sans-serif; }
.yms-ghead h2 { margin: 2px 0 0; font-size: 17px; font-weight: 700; color: #111; }
.yms-gmain > .yms-ghead h2 { font-size: 20px; }
.yms-ghead__more { font-size: 11.5px; font-weight: 700; color: #555; text-decoration: none; }

/* 表紙の帯: 5列（画像は売場の原画の比のまま）。題 11px/600 #333 */
.yms-gstrip { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 900px) { .yms-gstrip { grid-template-columns: repeat(5, 1fr); gap: 10px; } }
.yms-gstrip .yms-card { border: 0; background: transparent; box-shadow: none; }
.yms-gstrip .yms-card__cover { border-radius: 2px; overflow: hidden; background: #F0F0F0; }
.yms-gstrip .yms-card__body { padding: 6px 0 0; }
.yms-gstrip .yms-card__title { font-size: 11px; font-weight: 600; color: #333; -webkit-line-clamp: 1; line-height: 1.6; }
.yms-gstrip .yms-card__meta { margin-top: 2px; }
.yms-gstrip .yms-card__meta > span:first-child, .yms-gstrip .yms-card__meta > time { display: none; }
.yms-gstrip .yms-card__price { font-size: 12px; }

/* 3列: 280｜24｜624｜24｜280 */
.yms-gcols { display: flex; flex-direction: column; gap: 28px; }
@media (min-width: 1100px) {
  .yms-gcols { display: grid; grid-template-columns: 280px minmax(0, 1fr) 280px; gap: 24px; align-items: start; }
  .yms-gcols--archive { grid-template-columns: minmax(0, 1fr) 317px; }
  .yms-gcols--noleft { grid-template-columns: minmax(0, 1fr) 300px; }   /* 左の脇が空（新しい面でタグがまだ無い等）の時は2列 */
}
@media (max-width: 1099px) { .yms-gside--l { order: 3; } .yms-gmain { order: 1; } .yms-gside--r { order: 2; } }
.yms-gside__sec + .yms-gside__sec { margin-top: 6px; }

/* 中央の記事カード: 題 22px/700 #222、区分 13px/600 #222、日付 12px #999、札 12px #555 on #ECECEC */
.yms-gpost { margin: 0 0 32px; }
.yms-gpost__cover { position: relative; display: block; border-radius: 2px; overflow: hidden; background: #F0F0F0; color: inherit; text-decoration: none; }
.yms-gpost__cover .yms-card__cover { width: 100%; }
.yms-gbadge { position: absolute; top: 12px; left: 12px; background: var(--gred); color: #fff; font-size: 13px; font-weight: 800; letter-spacing: .04em; padding: 6px 7px; line-height: 1; border-radius: 4px; }
.yms-gpost__meta { display: flex; justify-content: space-between; align-items: center; margin: 12px 0 6px; font-size: 12px; color: #999; }
.yms-gpost__cat { font-size: 13px; font-weight: 600; color: #222; }
.yms-gpost__cat::before { content: "▣ "; color: #999; font-size: 11px; }
.yms-gpost__title { margin: 0 0 10px; font-size: 22px; line-height: 1.4; font-weight: 700; color: #222; }
.yms-gpost__title a { color: inherit; text-decoration: none; }
.yms-gcols--archive .yms-gpost__title { font-size: 18px; }
.yms-gtags { display: flex; flex-wrap: wrap; gap: 6px; }
.yms-gtag { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 6px 11px; background: #ECECEC; color: #555; text-decoration: none; font-size: 12px; font-weight: 400; line-height: 1; border-radius: 4px; }
/* 脇のタグ: 11px #333・白・枠 #E0E0E0・角4。件数 10px→11px #999（D-185 の刻み） */
.yms-gside .yms-gtag { background: #fff; border: 1px solid #E0E0E0; color: #333; font-size: 11px; padding: 5px 10px; min-height: 28px; }
.yms-gtag--n span { color: #999; font-size: 11px; font-variant-numeric: tabular-nums; }
.yms-gside .yms-gtags { gap: 6px; }

/* 右の脇の行・ボタン（280×41・11.5px/700・#111・角2） */
.yms-grows { display: flex; flex-direction: column; }
.yms-grow { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid #EEE; color: inherit; text-decoration: none; }
.yms-grow .yms-card__cover { flex: 0 0 96px; width: 96px; border-radius: 2px; overflow: hidden; background: #F0F0F0; }
.yms-grow__t { font-size: 13px; font-weight: 600; line-height: 1.5; color: #222; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yms-grow__t time { display: block; font-size: 11px; color: #999; font-weight: 400; margin-top: 2px; }
.yms-gbtn { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 14px; background: #111; color: #fff; text-decoration: none; font-size: 11.5px; font-weight: 700; border-radius: 2px; letter-spacing: .02em; }
.yms-gbtn--red { background: var(--gred); }
.yms-gside .yms-sale { grid-template-columns: 1fr; }
.yms-gside .widget__title, .yms-gside .yms-rankhead h2 { font-size: 17px; font-weight: 700; color: #111; padding-left: 12px; border-left: 3px solid #111; }

/* 記事の看板: 500px（SP380）・表紙を背景に暗く重ねる・パンくず45px・題32px白 */
.yms-ghero { position: relative; min-height: 500px; background: #111; color: #fff; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
.yms-ghero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.45) blur(1px); transform: scale(1.03); }
.yms-ghero__in { position: relative; max-width: calc(var(--gwidth) + 48px); width: 100%; margin: 0 auto; padding: 0 24px; display: flex; flex-direction: column; justify-content: space-between; min-height: 500px; }
.yms-gcrumb { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-height: 45px; font-size: 12px; color: rgba(255,255,255,.8); }
.yms-gcrumb a { color: inherit; text-decoration: none; }
.yms-gcrumb__cur { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.yms-gcrumb--dark { color: #777; min-height: 36px; }
.yms-gcrumb--dark .yms-gcrumb__cur { color: #222; }
.yms-ghero__title { padding: 0 0 28px; }
.yms-gchip--cat { display: inline-block; background: #1A1A1A; color: #fff; font-size: 12px; font-weight: 700; padding: 7px 10px; line-height: 1; border-radius: 2px; text-decoration: none; margin-bottom: 12px; }
.yms-ghero .entry-title { margin: 0 0 8px; font-size: 28px; line-height: 1.35; font-weight: 700; color: #fff; max-width: 800px; text-wrap: balance; }
.yms-ghero__date { margin: 0; font-size: 12px; color: rgba(255,255,255,.75); }
@media (max-width: 767px) { .yms-ghero, .yms-ghero__in { min-height: 380px; } .yms-ghero .entry-title { font-size: 22px; } }
.yms-layout-gallery .yms-gcols--article { margin-top: 28px; }
.yms-layout-gallery .yms-single--gallery .entry-content { max-width: none; }
.yms-layout-gallery .yms-single--gallery .entry-content > h2 { font-size: 24px; font-weight: 800; color: #16161A; }
.yms-layout-gallery .yms-single--gallery .entry-content img { border-radius: 2px; }

/* 一覧の題: 32px/700 #222 ＋ 件数 */
.yms-garchive-head { display: flex; align-items: baseline; gap: 14px; margin: 4px 0 22px; }
.yms-garchive-head h1 { margin: 0; font-size: 28px; font-weight: 700; color: #222; }
.yms-garchive-head__n { font-size: 13px; color: #999; }
.yms-layout-gallery .pagination, .yms-layout-gallery .nav-links { display: flex; gap: 6px; flex-wrap: wrap; margin: 12px 0 0; }
.yms-layout-gallery .nav-links .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border: 1px solid #E0E0E0; border-radius: 4px; color: #333; text-decoration: none; font-size: 13px; font-weight: 700; }
.yms-layout-gallery .nav-links .page-numbers.current { background: #111; color: #fff; border-color: #111; }

/* 割引の札を赤に（訴求色は #C50025 の1系統） */
.yms-layout-gallery .yms-price-off, .yms-layout-gallery .yms-sale-tile__pill { background: var(--gred); color: #fff; border-radius: 3px; font-weight: 800; }
.yms-layout-gallery .yms-price-now { color: var(--gred); font-weight: 800; }

/* 再生の印（サンプル動画のある作品だけ） */
.yms-card--movie .yms-card__cover::after { content: ""; position: absolute; left: 12px; bottom: 12px; width: 36px; height: 36px; border-radius: 50%; background: rgba(0,0,0,.58) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 1.5v9l7.5-4.5z' fill='%23fff'/%3E%3C/svg%3E") center / 14px 14px no-repeat; pointer-events: none; }

/* 黒いフッター: #101013・中身1120・小見出し 11px/600 #E8E8EC 字間広め・下の帯70 */
.yms-gfoot { background: #101013; color: #d6d6d6; margin-top: 48px; }
.yms-gfoot__in { max-width: 1120px; margin: 0 auto; padding: 48px 24px 32px; display: grid; gap: 28px; }
@media (min-width: 900px) { .yms-gfoot__in { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.5fr) minmax(0, 1fr); gap: 48px; } }
.yms-gfoot__name { color: #fff; font-size: 22px; font-weight: 900; text-decoration: none; }
.yms-gfoot__brand p { margin: 14px 0 0; font-size: 12px; color: #9a9a9a; line-height: 1.8; }
.yms-gfoot__col h2 { margin: 0 0 14px; font-size: 11px; letter-spacing: .16em; color: #E8E8EC; font-weight: 600; padding-bottom: 8px; border-bottom: 1px solid #2a2a2e; font-family: Poppins, Roboto, system-ui, sans-serif; }
.yms-gfoot__in > * { min-width: 0; }   /* 9/4 実測: SPでフッターの格子が中身の幅に引かれて417pxへはみ出した */
.yms-gfoot__posts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.yms-gfoot__post > span { min-width: 0; }
.yms-gfoot__post { display: flex; gap: 10px; color: #e6e6e6; text-decoration: none; }
.yms-gfoot__post .yms-card__cover { flex: 0 0 72px; width: 72px; border-radius: 2px; overflow: hidden; }
.yms-gfoot__post b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; line-height: 1.45; }
.yms-gfoot__post small { display: block; margin-top: 4px; font-size: 11px; color: #8a8a8a; letter-spacing: .04em; }
.yms-gfoot__tags { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.yms-gfoot__tags a { color: #cfcfcf; text-decoration: none; font-size: 13px; min-height: 32px; display: inline-flex; align-items: center; }
.yms-layout-gallery .yms-foot { background: #0B0B0D; color: #8a8a8a; margin: 0; padding: 22px 24px; min-height: 70px; max-width: none; width: 100%; box-sizing: border-box; }
.yms-layout-gallery .yms-foot > * { max-width: 1120px; margin-left: auto; margin-right: auto; }
.yms-layout-gallery .yms-foot a { color: #cfcfcf; font-size: 12px; }
.yms-layout-gallery .yms-foot__note { color: #7d7d7d; }

/* SPのメニュー: 三本線（checkbox＋CSS・JSなし）。PCは常に横並び */
.yms-topbar__burger { display: none; }
@media (max-width: 767px) {
  .yms-topbar__burger { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; cursor: pointer; order: -1; }
  .yms-topbar__burger span { display: block; width: 20px; height: 2px; background: #fff; box-shadow: 0 -6px 0 #fff, 0 6px 0 #fff; }
  .yms-topbar { position: relative; }
  .yms-topbar__nav { display: none; position: absolute; left: 0; right: 0; top: 54px; z-index: 30; flex-direction: column; gap: 0; background: #0A0A0A; border-top: 1px solid #222; padding: 6px 0 10px; }
  .yms-topbar__toggle:checked ~ .yms-topbar__nav { display: flex; }
  .yms-topbar__nav a, .yms-topbar__nav .yms-topbar__dd > label { min-height: 45px; padding: 0 20px; font-size: 14px; }
}

/* ランキング（右の脇）: 錠剤の切替は radio+CSS */
.yms-grank__tabs { display: flex; gap: 6px; background: #F7F7F7; padding: 4px; border-radius: 12px; margin: 0 0 10px; }
.yms-grank__tabs input { position: absolute; opacity: 0; pointer-events: none; }
.yms-grank__tabs label { flex: 1; text-align: center; font-size: 12.5px; font-weight: 500; color: #9A9A9A; min-height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 10px; cursor: pointer; }
.yms-grank__list { list-style: none; margin: 0; padding: 0; display: none; }
.yms-grank__tabs:has(#yms-grank-day:checked) ~ .yms-grank__list--day, .yms-grank__tabs:has(#yms-grank-week:checked) ~ .yms-grank__list--week,
.yms-grank__tabs:has(#yms-grank-month:checked) ~ .yms-grank__list--month, .yms-grank__tabs:has(#yms-grank-all:checked) ~ .yms-grank__list--all { display: block; }
.yms-grank__tabs:has(#yms-grank-day:checked) label[for="yms-grank-day"], .yms-grank__tabs:has(#yms-grank-week:checked) label[for="yms-grank-week"],
.yms-grank__tabs:has(#yms-grank-month:checked) label[for="yms-grank-month"], .yms-grank__tabs:has(#yms-grank-all:checked) label[for="yms-grank-all"] { background: #1A1A1A; color: #fff; }
.yms-grank__row a { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid #EEE; color: inherit; text-decoration: none; }
.yms-grank__pos { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; background: #222; }
.yms-grank__pos--1 { background: #C9A227; } .yms-grank__pos--2 { background: #8C8C8C; } .yms-grank__pos--3 { background: #A0653A; }
.yms-grank__thumb { flex: 0 0 60px; width: 60px; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 2px; background: #F0F0F0; }
.yms-grank__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yms-grank__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 1.45; color: #222; }
.yms-grank .yms-rank__source { font-size: 11px; color: #999; margin: 8px 0 0; }

/* ランキングのページ: 題30px、切替130×36、順位の札「N位」41×22 角3 */
.yms-layout-gallery .yms-rankhead h1 { font-size: 30px; font-weight: 400; color: #111; }
.yms-layout-gallery .yms-rank__badge { font-size: 12px; font-weight: 700; color: #fff; background: #222; border-radius: 3px; padding: 3px 8px; }
.yms-layout-gallery .yms-rank__badge--1 { background: #C9A227; } .yms-layout-gallery .yms-rank__badge--2 { background: #8C8C8C; } .yms-layout-gallery .yms-rank__badge--3 { background: #A0653A; }
.yms-layout-gallery .yms-rankcard__title { font-size: 17px; font-weight: 700; color: #222; }

/* 上の帯をランキング板で作る時（5列・順位の丸・題1行・値段） */
.yms-gstrip--rank { display: block; }
.yms-gstrip--rank .yms-homerank__board { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 900px) { .yms-gstrip--rank .yms-homerank__board { grid-template-columns: repeat(5, 1fr); gap: 10px; } }
.yms-gstrip--rank .yms-homerank__cell { margin: 0; }
.yms-gstrip--rank .yms-homerank__link { display: block; color: inherit; text-decoration: none; }
.yms-gstrip--rank .yms-homerank__cover { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 2px; background: #F0F0F0; }
.yms-gstrip--rank .yms-homerank__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yms-gstrip--rank .yms-homerank__badge { position: absolute; top: 8px; left: 8px; width: 24px; height: 24px; border-radius: 50%; background: #222; color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.yms-gstrip--rank .yms-homerank__cell:nth-child(1) .yms-homerank__badge { background: #C9A227; }
.yms-gstrip--rank .yms-homerank__cell:nth-child(2) .yms-homerank__badge { background: #8C8C8C; }
.yms-gstrip--rank .yms-homerank__cell:nth-child(3) .yms-homerank__badge { background: #A0653A; }
.yms-gstrip--rank .yms-homerank__name { display: block; margin-top: 6px; font-size: 11px; font-weight: 600; color: #333; line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yms-gstrip--rank .yms-rank__source { font-size: 11px; color: #999; margin: 8px 0 0; }

/* 左の脇: カテゴリー・サークルの行（名前＋件数の丸 11px #999 on #F5F5F5 角10） */
.yms-gcats { display: flex; flex-direction: column; }
.yms-gcat { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 0 2px; border-bottom: 1px solid #EEE; color: #222; text-decoration: none; font-size: 13px; font-weight: 600; }
.yms-gcat b { font-size: 11px; font-weight: 400; color: #999; background: #F5F5F5; border-radius: 10px; padding: 2px 8px; font-variant-numeric: tabular-nums; }

/* 帯: カテゴリの開閉（hover/focus-within・JSなし）と虫眼鏡の検索 */
.yms-topbar__dd { position: relative; display: inline-flex; }
.yms-topbar__ddmenu { display: none; position: absolute; top: 100%; left: 0; min-width: 200px; background: #111; border: 1px solid #2a2a2a; padding: 6px 0; z-index: 40; flex-direction: column; }
.yms-topbar__dd:hover .yms-topbar__ddmenu, .yms-topbar__dd:focus-within .yms-topbar__ddmenu, .yms-topbar__ddtoggle:checked ~ .yms-topbar__ddmenu { display: flex; }
.yms-topbar__dd > label { cursor: pointer; }
/* 見た目だけ隠す（hidden だとキーボードで届かない: 9/5 レビュー4回目）。Tab で入り Space で開く。ランキングの錠剤と同じ定石 */
.yms-topbar__ddtoggle { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.yms-topbar__ddtoggle:focus-visible + label { outline: 2px solid #fff; outline-offset: -4px; }
.yms-topbar__ddmenu a { display: flex; justify-content: space-between; gap: 12px; min-height: 40px; padding: 0 14px; font-size: 13px; }
.yms-topbar__ddmenu a b { font-weight: 400; color: #9a9a9a; }
.yms-topbar__sicon { margin-left: auto; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; cursor: pointer; }
.yms-topbar__search { display: none; margin-left: 0; }
.yms-topbar__stoggle:checked ~ .yms-topbar__search { display: flex; }
.yms-topbar__stoggle:checked ~ .yms-topbar__sicon { color: #9a9a9a; }
.yms-topbar__search input { width: 220px; }
@media (max-width: 767px) {
  .yms-topbar__search { position: absolute; left: 0; right: 0; top: 54px; padding: 8px 12px; background: #0A0A0A; border-top: 1px solid #222; z-index: 31; }
  .yms-topbar__search input { flex: 1; width: auto; }
  .yms-topbar__ddmenu { position: static; border: 0; padding-left: 12px; }
  .yms-topbar__nav .yms-topbar__dd { flex-direction: column; align-items: stretch; }
}
/* タグ一覧・サークル一覧のページ */
.yms-gtags--big .yms-gtag { font-size: 13px; min-height: 36px; padding: 0 12px; background: #fff; border: 1px solid #E0E0E0; color: #333; }
.yms-gcols--two { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 900px) { .yms-gcols--two { grid-template-columns: 1fr 1fr; gap: 40px; } }

/* 記事: 看板の下のおすすめ6枚（198×159・5:4） */
.yms-greco { border-bottom: 1px solid #EEE; }
.yms-greco__in { max-width: calc(var(--gwidth) + 48px); margin: 0 auto; padding: 12px 24px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
@media (min-width: 900px) { .yms-greco__in { grid-template-columns: repeat(6, 1fr); } }
.yms-greco__item { position: relative; display: block; color: #fff; text-decoration: none; border-radius: 2px; overflow: hidden; background: #F0F0F0; }
.yms-greco__item .yms-card__cover { aspect-ratio: 5 / 4; }
.yms-greco__item .yms-card__cover img { width: 100%; height: 100%; object-fit: cover; }
.yms-greco__t { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 8px 6px; font-size: 12px; font-weight: 700; line-height: 1.4; background: linear-gradient(transparent, rgba(0,0,0,.75)); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* 記事: 買うボタンは赤の大ボタン（274×49・角8・15.2px/800） */
.yms-layout-gallery .entry-content .wp-block-button__link { min-height: 49px; border-radius: 8px !important; font-size: 15px; font-weight: 800; max-width: 420px; margin-left: auto; margin-right: auto; }
/* 記事: 関連する同人作品 */
.yms-grels { margin: 36px 0 0; }
.yms-grels__h { margin: 0 0 14px; font-size: 24px; font-weight: 800; color: #16161A; display: flex; align-items: baseline; gap: 12px; }
.yms-grels__h small { font-size: 12px; font-weight: 600; color: #999; }
.yms-grels__grid { display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 900px) { .yms-grels__grid { grid-template-columns: repeat(2, 1fr); } }
/* 9/5 深瀬「段々にならないように」: カードは縦の flex。題は2行固定、札は1行だけ、ボタンは下端（margin-top:auto）。
   表紙は 4:3 の箱に収める（縦長の表紙で高さが変わらない） */
.yms-grel { border: 1px solid #EEE; border-radius: 6px; padding: 12px; background: #fff; display: flex; flex-direction: column; }
.yms-grel__cover { display: block; border-radius: 4px; overflow: hidden; background: #F0F0F0; aspect-ratio: 4 / 3; }
.yms-grel__cover img { width: 100%; height: 100%; object-fit: contain; display: block; }
.yms-grel__title { margin: 10px 0 8px; font-size: 16px; font-weight: 700; line-height: 1.45; color: #111; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: calc(1.45em * 2); }
.yms-grel__title a { color: inherit; text-decoration: none; }
.yms-grel .yms-gtags { display: flex; flex-wrap: nowrap; overflow: hidden; gap: 6px; max-height: 26px; }
.yms-grel .yms-gtag { font-size: 11px; min-height: 24px; padding: 4px 8px; background: #FAF9FB; border: 1px solid #E7E7EC; color: #6E6E78; border-radius: 999px; white-space: nowrap; flex: 0 0 auto; }
.yms-grel__foot { display: flex; align-items: center; margin-top: auto; padding-top: 10px; }
.yms-grel__btn { margin: 0; flex: 1; min-height: 48px; font-size: 15px; font-weight: 800; border-radius: 8px; }
/* 記事: 関連タグの錠剤（件数つき） */
.yms-gpills { margin: 28px 0 0; }
.yms-gpills h2 { margin: 0 0 10px; font-size: 14px; font-weight: 800; color: #222; }
.yms-gpills > div { display: flex; flex-wrap: wrap; gap: 8px; }
.yms-gpill { display: inline-flex; align-items: center; gap: 8px; min-height: 35px; padding: 0 14px; border-radius: 999px; border: 1px solid #DCDCDC; background: #fff; color: #333; font-size: 12.5px; font-weight: 600; text-decoration: none; }
.yms-gpill b { font-size: 11px; font-weight: 700; color: #777; background: #F0F0F0; border-radius: 999px; padding: 2px 7px; }
.yms-gpill:first-child { background: #111; color: #fff; border-color: #111; }
.yms-gpill:first-child b { background: rgba(255,255,255,.22); color: #fff; }
/* SPの関連作品は2列の小カード（1列だと節が3画面を超える: D-184 実測 2533px） */
@media (max-width: 899px) {
  .yms-grels__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .yms-grel { padding: 8px; }
  .yms-grel__title { font-size: 13px; margin: 8px 0 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .yms-grel .yms-gtags { display: none; }
  .yms-grel__foot { flex-direction: column; align-items: stretch; gap: 6px; }
  .yms-grel__btn { max-width: none; min-height: 44px; font-size: 13px; }
}

/* 数字送り */
.yms-gpager { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 24px; }
.yms-gpager__a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border: 1px solid #E0E0E0; border-radius: 4px; color: #333; text-decoration: none; font-size: 13px; font-weight: 700; }
.yms-gpager__a.is-current { background: #111; color: #fff; border-color: #111; }
.yms-gpager__dots { display: inline-flex; align-items: center; padding: 0 4px; color: #999; }
.yms-gside--r .yms-gside__sec { margin-top: 18px; }

/* ランキングのページ: 錠剤（130×36）。期間のプルダウンは畳む（錠剤が代わり）。ジャンルは残す */
.yms-grank__tabs--page { display: flex; flex-wrap: wrap; gap: 8px; background: transparent; padding: 0; margin: 6px 0 14px; }
.yms-gpilltab { display: inline-flex; align-items: center; justify-content: center; min-width: 130px; min-height: 36px; padding: 0 16px; border-radius: 10px; background: #F7F7F7; color: #9A9A9A; font-size: 12.5px; font-weight: 500; text-decoration: none; }
.yms-gpilltab.is-active { background: #1A1A1A; color: #fff; }
.yms-layout-gallery .yms-rankfilter label:has(select[name="win"]) { display: none; }

/* ランキングページの札は「N位」 */
.yms-layout-gallery .yms-rankcard .yms-rank__badge::after { content: "位"; font-size: 10px; margin-left: 1px; }
