/* peraauto 記事の中の部品（ボックス・リスト・吹き出し・表など）。公開ページと管理画面のエディタで共通 */
.review-body h4 { font: 800 16px/1.5 var(--mincho); margin: 24px 0 8px; }
.review-body em { font-style: italic; } .review-body u { text-decoration-color: var(--shu); text-underline-offset: 3px; }
.review-body a { color: var(--shu); text-underline-offset: 3px; }
.review-body img { max-width: 100%; height: auto; display: block; margin: 16px auto; }
.review-body hr { border: 0; border-top: 1.5px solid var(--line); margin: 30px 0; }
.review-body blockquote { margin: 20px 0; padding: 14px 18px 14px 44px; position: relative; background: var(--paper-2); border-left: 4px solid var(--line); color: var(--ink-2); }
.review-body blockquote::before { content: "“"; position: absolute; left: 12px; top: -4px; font: 46px/1 var(--latin); color: var(--shu); }
.review-body blockquote p:last-child { margin-bottom: 0; }
/* マーカー・文字サイズ */
.pa-mk-y { background: linear-gradient(transparent 58%, #ffe45c 58%); } .pa-mk-r { background: linear-gradient(transparent 58%, #ffb3b3 58%); } .pa-mk-b { background: linear-gradient(transparent 58%, #a9d8ff 58%); }
.pa-fs-s { font-size: .85em; } .pa-fs-l { font-size: 1.25em; font-weight: 700; } .pa-fs-xl { font-size: 1.6em; font-weight: 800; line-height: 1.4; }
/* ボックス */
.pa-box { position: relative; margin: 22px 0; padding: 16px 18px 16px 52px; border: 1.5px solid; border-radius: 4px; }
.pa-box p:last-child { margin-bottom: 0; }
.pa-box::before { position: absolute; left: 16px; top: 15px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: #fff; font: 700 13px/1 var(--gothic); }
.pa-box-info { border-color: #4a90c2; background: #eef6fc; color: #1d3b52; } .pa-box-info::before { content: "i"; background: #4a90c2; }
.pa-box-success { border-color: #3f9a5c; background: #eef8f1; color: #1e4a2c; } .pa-box-success::before { content: "✓"; background: #3f9a5c; }
.pa-box-warning { border-color: #d39b1c; background: #fff8e6; color: #5a4209; } .pa-box-warning::before { content: "!"; background: #d39b1c; }
.pa-box-point { border-color: var(--shu); background: color-mix(in srgb, var(--shu) 8%, var(--paper)); } .pa-box-point::before { content: "★"; background: var(--shu); }
/* メリット・デメリット */
.pa-merit { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 22px 0; }
.pa-merit > div { border: 1.5px solid; padding: 12px 16px; } .pa-merit ul { margin: 0; padding-left: 20px; background: none !important; border: 0 !important; }
.pa-merit-good { border-color: #3f9a5c; } .pa-merit-bad { border-color: #c0504d; }
.pa-merit-h { margin: 0 0 8px !important; font-weight: 800; } .pa-merit-good .pa-merit-h { color: #3f9a5c; } .pa-merit-bad .pa-merit-h { color: #c0504d; }
@media (max-width: 600px) { .pa-merit { grid-template-columns: 1fr; } }
/* 吹き出し */
.pa-bubble { position: relative; margin: 22px 0 22px 64px; padding: 12px 16px; background: var(--paper-2); border-radius: 10px; }
.pa-bubble::before { content: ""; position: absolute; left: -10px; top: 16px; border: 6px solid transparent; border-right: 10px solid var(--paper-2); border-left: 0; }
.pa-bubble-name { position: absolute; left: -64px; top: 0; width: 52px; height: 52px; margin: 0 !important; display: grid; place-items: center; border-radius: 50%; background: var(--shu); color: var(--on-shu, #fff); font: 700 12px/1.2 var(--gothic); text-align: center; overflow: hidden; }
.pa-bubble p:last-child { margin-bottom: 0; }
/* Q&A */
.pa-faq { margin: 20px 0; border: 1.5px solid var(--line); }
.pa-faq p { margin: 0 !important; padding: 12px 16px 12px 50px; position: relative; }
.pa-faq p::before { position: absolute; left: 14px; top: 10px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font: 800 14px/1 var(--latin); color: #fff; }
.pa-q { font-weight: 800; background: var(--paper-2); } .pa-q::before { content: "Q"; background: var(--shu); } .pa-a::before { content: "A"; background: var(--ink-2); }
/* 飾り付きリスト */
.review-body ul[class^="pa-list"], .review-body ol.pa-list-num { list-style: none; padding: 16px 20px; background: var(--paper-2); border: 1px solid var(--line); }
.review-body [class^="pa-list"] li { position: relative; padding-left: 1.7em; margin: 6px 0; }
.review-body [class^="pa-list"] li::before { position: absolute; left: 0; top: 0; color: var(--shu); font-weight: 900; }
.pa-list-arrow li::before { content: "→"; } .pa-list-check li::before { content: "✓"; } .pa-list-star li::before { content: "★"; }
.review-body ol.pa-list-num { counter-reset: pan; } .pa-list-num li { counter-increment: pan; }
.pa-list-num li::before { content: counter(pan); width: 1.35em; height: 1.35em; display: grid; place-items: center; border-radius: 50%; background: var(--shu); color: var(--on-shu, #fff) !important; font: 700 12px/1 var(--gothic) !important; top: .25em !important; }
/* 表・画像・ボタン */
.pa-table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 14px; }
.pa-table th, .pa-table td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; }
.pa-table th { background: var(--paper-2); width: 30%; font-weight: 700; }
.pa-figure { margin: 20px 0; } .pa-figure img { margin: 0 auto; } .pa-figure figcaption { font-size: 12px; color: var(--mute); text-align: center; margin-top: 6px; }
.pa-btn-wrap { text-align: center; margin: 24px 0; }
.pa-btn { display: inline-block; min-width: 260px; padding: 15px 30px; background: var(--shu); color: var(--on-shu, #fff) !important; text-decoration: none !important; font: 800 16px var(--mincho); letter-spacing: .06em; box-shadow: 0 4px 0 var(--shu-deep, #000); transition: transform .15s, box-shadow .15s; }
.pa-btn:hover { transform: translateY(2px); box-shadow: 0 2px 0 var(--shu-deep, #000); }

/* 赤い強調（決めの一言） */
.pa-red { color: #e0102e; font-weight: 800; }