/* article-v5.css  2026-09-06 デザイン部（是正台帳 L-063 ④-A）
   記事のシンプル構成（v5）。single.php が v4 記事だけに .mz-a5-* を出す。旧形式の記事には 1 行も効かない。
   並び: ジャケット(▶) → 一言 → 価格＋購入ボタン → チップ → サンプル画像 → 短い説明 → もっと見る(畳み) → 作品情報 → 購入ボタン2 → 関連 */
.sect-work-detail--v5 .work-ttl-h1{margin:14px 0 8px;font-size:18px;line-height:1.45}
.mz-a5-top{margin:0 0 10px}
.mz-a5-hero{position:relative;overflow:hidden;border-radius:8px;background:#000;aspect-ratio:16/9}
.mz-a5-jacket{display:block;width:100%;height:100%}
.mz-a5-jacket img{display:block;width:100%;height:100%;object-fit:contain;background:#000}
.mz-a5-player.mz-sp-inline{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border-radius:0;background:transparent}
.mz-a5-player .mz-sp-inline-poster{background:transparent}
.mz-a5-nosample{margin:6px 0 0;color:#8a7d88;font-size:12px;line-height:1.6}
.mz-a5-official{margin:8px 0 0}
.mz-a5-official .tsuba-sample-head{margin:0 0 6px;color:#444;font-size:13px}
.mz-a5-lead{margin:10px 0 8px;color:#2a2230;font-size:15px;font-weight:700;line-height:1.55}
.mz-a5-cta{margin:0 0 12px}
.mz-a5-price{margin:0 0 6px;color:#444;font-size:13px;line-height:1.5}
.mz-a5-price b{color:#e4007f;font-size:15px}
.mz-a5-btn{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:56px;padding:12px 16px;border-radius:8px;background:#e4007f;color:#fff!important;font-size:16px;font-weight:700;line-height:1.35;text-align:center;text-decoration:none!important;box-shadow:0 2px 0 #b3005f}
.mz-a5-btn:after{content:"→";margin-left:8px}
.mz-a5-btn:hover{background:#c3006c}
.sect-work-detail--v5 .work-meta-row{margin:0 0 6px}
.work-content--v5 .work-meta-row a.work-shop-badge{color:#fff!important;text-decoration:none!important}
.work-content--v5 .work-meta-row a.work-performer-badge,.work-content--v5 .work-tag-row a{text-decoration:none!important}
.sect-work-detail--v5 .work-tag-row{margin:0 0 12px}
.mz-a5-gal{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;margin:0 -16px 12px;padding:0 16px 6px}
.mz-a5-gal-item{flex:0 0 42vw;max-width:220px;overflow:hidden;border-radius:6px;background:#f0e9ed;scroll-snap-align:start}
.mz-a5-gal-item img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.mz-a5-desc{margin:0 0 12px;color:#333;font-size:15px;line-height:1.8}
.mz-a5-more{margin:0 0 14px;border:1px solid #eadfe4;border-radius:8px;background:#fff}
.mz-a5-more>summary{position:relative;padding:12px 40px 12px 14px;color:#e4007f;font-size:14px;font-weight:700;cursor:pointer;list-style:none}
.mz-a5-more>summary::-webkit-details-marker{display:none}
.mz-a5-more>summary:after{content:"＋";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:18px;line-height:1}
.mz-a5-more[open]>summary:after{content:"−"}
.mz-a5-more-body{padding:0 14px 14px;color:#333;font-size:15px;line-height:1.8}
.mz-a5-more-body h2{font-size:16px!important}
.mz-a5-more-body figure{display:none}
.mz-a5-dl{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:6px 10px;margin:0 0 14px;padding:12px 14px;border-radius:8px;background:#faf6f8;font-size:13px;line-height:1.6}
.mz-a5-dl dt{margin:0;color:#8a7d88}
.mz-a5-dl dd{margin:0;color:#333;word-break:break-all}
.mz-a5-dl dd a{color:#e4007f;text-decoration:underline}
.mz-a5-tail{margin:6px 0 0}
.mz-a5-tail .tsuba-v4-h2{margin-top:18px}
.mz-a5-hidden{display:none!important}
.sect-work-detail--v5 .work-side-list,.sect-work-detail--v5 .work-side-more{display:none}
@media (min-width:1024px){
  .sect-work-detail--v5 .work-ttl-h1{font-size:22px}
  .mz-a5-top{display:grid;grid-template-columns:60% minmax(0,1fr);gap:20px;align-items:start;margin:0 0 16px}
  .mz-a5-first{padding-top:4px}
  .mz-a5-lead{margin:0 0 10px;font-size:16px}
  .mz-a5-gal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow:visible;margin:0 0 16px;padding:0}
  .mz-a5-gal-item{flex:none;max-width:none}
  .mz-a5-desc{font-size:16px}
  .mz-a5-dl{grid-template-columns:7em minmax(0,1fr);font-size:14px}
}
/* ---- SP 第3弾（2026-09-06 デザイン部、docs/sp_parity_20260906.md A1〜A10）: 購入ブロック・作品情報の表・オススメカード統一・拡大・h1 色・パンくず ---- */
.sect-work-detail--v5 .work-ttl-h1{color:#e4007f;font-size:20px;line-height:1.45}                         /* A6 */
.mz-a5-crumb{display:none;margin:0 -16px 8px}                                                              /* A7（SP だけ表示） */
.mz-a5-buy-head{display:flex;align-items:baseline;gap:8px;margin:0 0 6px;padding:6px 10px;background:#444;color:#fff;font-size:14px;font-weight:700} /* A2 黒帯「購入する」 */
.mz-a5-buy-head small{font-size:11px;font-weight:400;opacity:.8}
.mz-a5-btn{min-height:50px;border-radius:0;box-shadow:none}                                                /* A2 角ボタン 50px・影統一 */
.mz-a5-hero{border-radius:0}.mz-a5-gal-item{border-radius:0}.mz-a5-more{border-radius:0}                    /* 角丸を 0 に統一 */
.mz-a5-gal{scroll-padding-left:16px}                                                                       /* A8 */
.mz-a5-gal-item.mz-go-zoom{position:relative}
.mz-a5-gal-item.mz-go-zoom:after{content:"";position:absolute;right:6px;bottom:6px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.55) url(https://tsuba-mania.com/wp-content/themes/rediver-child/mz-assets/search-white.svg) no-repeat center/12px 12px}
/* A3 作品情報: dt はフル幅の灰帯（#ededed 30px 中央太字）、ジャンルはピル、ショップはロゴ枠 */
.mz-a5-info{display:block;margin:0 0 14px;padding:0;border:0;border-radius:0;background:transparent}
.mz-a5-info dt{display:block;margin:0;padding:0 10px;background:#ededed;color:#444;font-size:13px;font-weight:700;line-height:30px;text-align:center}
.mz-a5-info dd{display:block;margin:0;padding:10px 10px 12px;color:#333;font-size:14px;line-height:1.7}
.mz-a5-info dd .c-btn-round{margin:0 6px 6px 0}
.mz-a5-info dd .c-btn-round .btn-inner{padding:6px 12px;border:1px solid #e4007f;border-radius:20px;background:#fff}
.mz-a5-info dd .c-btn-round .tx-btn{color:#e4007f;font-size:12px;font-weight:700;margin:0}
.mz-a5-info .mz-a5-shopbox{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #ddd;border-radius:22px;background:#fff}
.mz-a5-info .mz-a5-shopbox img{flex:0 0 80px;width:80px;height:auto;border-radius:6px}
.mz-a5-info .mz-a5-shopbox .mz-a5-shoptxt{min-width:0;font-size:13px;line-height:1.5}
.mz-a5-info .mz-a5-shopbox .mz-a5-shoptxt a{color:#e4007f;font-weight:700;text-decoration:none}
.mz-a5-info .mz-a5-shopbox .mz-a5-shoptxt small{display:block;color:#666;font-size:11px}
.mz-a5-info .mz-a5-datebtn{display:inline-block;padding:6px 14px;border:1px solid #444;color:#444;font-size:13px;text-decoration:none}
/* A4/A10 オススメ作品: 一覧と同じ .c-list-works-item（2 列・16:9・左上ロゴ・▶）とピンク見出し */
.mz-a5-tail .c-ttl-page{padding:18px 0 10px}
.mz-a5-tail .c-ttl-page .ttl-page{margin:0;color:#e4007f;font-size:18px;font-weight:700;text-align:center}
.mz-a5-tail .c-ttl-page .ttl-page-sub{margin:2px 0 0;color:#e4007f;font-size:11px;text-align:center}
.mz-a5-reco,.work-content ul.mz-a5-reco{display:flex!important;flex-wrap:wrap;margin:0 -16px!important;padding:0!important;list-style:none;width:auto!important}   /* .work-content ul の !important（margin 0・padding-left 1.4em）より強く */
.work-content ul.mz-a5-reco li.c-list-works-item{margin:0!important;padding:0!important}
.mz-a5-reco .c-list-works-item{position:relative;float:none!important;width:50%!important;box-sizing:border-box;margin:0!important;padding:0!important;border-bottom:1px solid #eee}
.mz-a5-reco .c-list-works-item:nth-child(odd){border-right:1px solid #eee}
.mz-a5-reco .bx-works-detail{display:block;padding:0 0 8%!important;text-decoration:none}   /* 画像を列幅いっぱいに（短辺 ≥100px でロゴ画像が載せられる。D-21） */
.mz-a5-reco .works-detail-img{display:block;width:100%!important;max-width:none!important;aspect-ratio:16/9!important;height:auto!important;object-fit:cover!important;object-position:center top!important;margin:0 0 6%!important;border-radius:0!important}
.mz-a5-reco .works-detail-title{margin:0;padding:0 8%;color:#e4007f;font-size:13px;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.mz-a5-reco .bx-works-maker{position:absolute;top:0;left:0;width:34%;min-width:64px;max-width:110px;box-shadow:1px 1px 1px 0 rgba(0,0,0,.2)}
.mz-a5-reco .works-maker-img{display:block;width:100%}
.mz-a5-reco-btn{margin:12px 0 0}
@media (max-width:1023px){
  .mz-a5-crumb{display:block}
}
@media (min-width:1024px){
  .mz-a5-reco .c-list-works-item,.work-content ul.mz-a5-reco li.c-list-works-item{width:33.333%!important}   /* PC の本文列は約 700px。3 列で画像 233×131（短辺 ≥100px、D-21） */
  .mz-a5-reco .c-list-works-item:nth-child(odd){border-right:0}
  .mz-a5-reco .c-list-works-item{border-right:1px solid #eee}
  .mz-a5-reco .c-list-works-item:nth-child(3n){border-right:0}
}
/* ---- 09-06 監査部 第5回: ロゴが無いカードの店名ピル（.bx-works-maker.mz-txt）、旧形式の暫定（v4fb）の余白 ---- */
.mz-a5-reco .bx-works-maker.mz-txt{width:auto!important;min-width:0;max-width:60%;padding:3px 7px;border-radius:0 0 6px 0;background:rgba(255,255,255,.92);color:#e4007f;font:700 10px/1.3 "Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;box-shadow:1px 1px 2px 0 rgba(0,0,0,.25)}
.work-content--v4fb{margin:0 0 14px}
.sect-work-detail--v4fb .work-meta-row{margin:0 0 10px}

/* ==== 2026-09-11 デザイン部: オススメ作品の題名が2行目の途中で切れる（SP/PC とも全カード）====
   原因: 記事本文の .work-content p{line-height:1.9!important}（mousou-common.css 1718行）が
         .mz-a5-reco .works-detail-title{line-height:1.5}（上）に勝ち、13px×1.9=24.7px の行を
         .c-list-works-item .works-detail-title{max-height:3em}（mousou-common.css 1201行）の 39px で切っていた（1.58行）。
   直し: 行の高さを 1.5 に固定（!important・詳細度 0,3,0 で .work-content p の !important 0,1,1 に勝つ）、
         枠の高さ＝行の高さ×2（3em）で固定して行のカードをそろえ、3行目以降は「…」で省く。 */
.work-content .mz-a5-reco .works-detail-title,
.mz-a5-reco .works-detail-title{line-height:1.5!important;height:3em;max-height:3em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
