/* 長い記事（take-blog-claude の SWELL 形式）を EmDash で同じ役目の見た目にする（2026-10-20）
   色はサイト共通（style.css の :root）を使う：--ink --plum --rose --line --muted --bg --chip --ok */

/* ---------- 記事の枠・パンくず・目次 ---------- */
.crumbs{font-size:13px;color:var(--muted);margin:8px 0 18px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{color:var(--plum);text-decoration:none}.crumbs a:hover{text-decoration:underline}
.article{max-width:760px;margin:0 auto}
.article h1{font-size:clamp(22px,4.6vw,30px);line-height:1.45;margin:.2em 0 .5em;color:var(--ink)}
.article-meta{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12.5px;color:var(--muted);margin:0 0 10px}
.pr-line{font-size:12.5px;color:var(--muted);background:var(--chip);border-radius:8px;padding:8px 12px;margin:0 0 18px}
.toc{border:1px solid var(--line);background:#fff;border-radius:12px;padding:14px 18px 10px;margin:18px 0 28px}
.toc__title{font-weight:700;color:var(--plum);margin:0 0 6px}
.toc ol{margin:0;padding-left:1.4em}.toc li{margin:.35em 0;font-size:14.5px}
.toc a{color:var(--ink);text-decoration:none}.toc a:hover{color:var(--rose);text-decoration:underline}
.related{margin:36px 0 10px;border-top:1px solid var(--line);padding-top:18px}
.related h2{font-size:18px;margin:0 0 10px;border:0;padding:0;background:none;color:var(--ink)}
.related ul{margin:0;padding-left:1.2em}.related li{margin:.45em 0}
.back-top{margin:28px 0}.back-top .button{display:inline-block;color:#fff;padding:12px 20px;border-radius:8px}
.guide-group{margin:28px 0}.muted-note{color:var(--muted);font-size:14px;margin:-4px 0 12px}

/* ---------- 本文 ---------- */
.post_content{font-size:16px;line-height:1.95;color:var(--ink);word-break:normal;overflow-wrap:anywhere}
.post_content p{margin:0 0 1.1em}
.post_content a{color:var(--plum)}
.post_content h2{font-size:clamp(19px,3.8vw,23px);line-height:1.5;margin:2.6em 0 1em;padding:14px 16px;background:var(--plum);color:#fff;border-radius:8px;scroll-margin-top:16px}
.post_content h3{font-size:clamp(17px,3.3vw,19px);line-height:1.55;margin:2.2em 0 .9em;padding:4px 0 8px 14px;border-left:5px solid var(--rose);border-bottom:1px solid var(--line);scroll-margin-top:16px}
.post_content h4{font-size:16.5px;margin:1.8em 0 .6em;color:var(--plum)}
.post_content ul,.post_content ol{margin:0 0 1.2em;padding-left:1.5em}
.post_content li{margin:.35em 0}
.post_content strong{font-weight:700}
.post_content .has-text-align-center{text-align:center}
.post_content .wp-block-spacer{display:block}
.post_content .u-mb-0{margin-bottom:0}
.post_content .swl-fz.u-fz-s{font-size:.88em}
.post_content .has-x-small-font-size{font-size:.82em}
.post_content .has-swl-deep-01-color{color:var(--plum)}

/* マーカー（3段階のうち、このサイトはオレンジ＝ピンク寄りの1色） */
.swl-marker{background:linear-gradient(transparent 62%,#ffd6e6 62%);padding:0 .1em}
.mark_yellow{background:linear-gradient(transparent 62%,#fff1a8 62%)}
.mark_blue{background:linear-gradient(transparent 62%,#d6ebff 62%)}

/* 番号つきリスト（丸数字） */
.post_content .is-style-num_circle{list-style:none;counter-reset:num;padding-left:0}
.post_content .is-style-num_circle>li{position:relative;padding-left:2.1em;counter-increment:num}
.post_content .is-style-num_circle>li::before{content:counter(num);position:absolute;left:0;top:.25em;width:1.55em;height:1.55em;border-radius:50%;background:var(--rose);color:#fff;font-size:.8em;line-height:1.55em;text-align:center;font-weight:700}

/* 引用 */
.post_content .wp-block-quote{margin:1.4em 0;padding:14px 18px;background:#fff;border-left:4px solid var(--line);color:var(--muted);font-size:15px}
.post_content .wp-block-quote p:last-child{margin-bottom:0}
.post_content .wp-block-quote cite{display:block;margin-top:.4em;font-size:12.5px;font-style:normal}

/* ---------- ボックス（結論・ポイント・良い点・注意・枠） ---------- */
.cap_box{margin:1.6em 0;border:2px solid var(--plum);border-radius:10px;overflow:hidden;background:#fff}
.cap_box_ttl{background:var(--plum);color:#fff;padding:8px 14px;font-size:15px;line-height:1.5}
.cap_box_content{padding:14px 18px 4px}
.cap_box_content>*:last-child{margin-bottom:12px}
.cap_box.is-style-outer{border-color:var(--rose)}.cap_box.is-style-outer .cap_box_ttl{background:var(--rose)}
.wp-block-group.has-border{margin:1.6em 0;padding:16px 18px 6px;border:1.5px dashed var(--line);border-radius:10px;background:#fff}
.wp-block-group[class*="is-style-big_icon_"]{position:relative;margin:1.6em 0;padding:16px 18px 6px 58px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.wp-block-group[class*="is-style-big_icon_"]::before{position:absolute;left:14px;top:16px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:15px}
.is-style-big_icon_point::before{content:"!";background:var(--rose)}
.is-style-big_icon_good::before{content:"✓";background:var(--ok)}
.is-style-big_icon_bad::before{content:"!";background:#c0392b}
.is-style-big_icon_good{border-color:#cfe6dc!important;background:#f5fbf8!important}
.is-style-big_icon_bad{border-color:#f1cfcb!important;background:#fdf6f5!important}
.is-style-balloon_box2{display:inline-block;margin:1.2em auto .6em;padding:6px 16px;border-radius:999px;background:var(--chip);color:var(--plum)}

/* ---------- 表 ---------- */
.post_content .wp-block-table{margin:1.4em 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.post_content .wp-block-table table{width:100%;border-collapse:collapse;background:#fff;font-size:14.5px;line-height:1.6;min-width:100%}
.post_content .wp-block-table thead td{background:#f6e9f0;font-weight:700}
.post_content .wp-block-table th,.post_content .wp-block-table td{border:1px solid var(--line);padding:9px 10px;vertical-align:middle}
.post_content .wp-block-table tbody th{background:#fbf5f8;text-align:left;font-weight:700;min-width:6.5em}
.post_content .wp-block-table figcaption,.post_content .wp-element-caption{font-size:12.5px;color:var(--muted);margin-top:6px;text-align:left}
@media(max-width:600px){.post_content .wp-block-table table{min-width:600px}}
.swl-cell-bg{display:none}

/* ---------- ボタン ---------- */
.swell-block-button{text-align:center;margin:1.4em 0}
.swell-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:min(100%,340px);padding:15px 26px;border-radius:999px;background:var(--rose);color:#fff!important;font-weight:700;text-decoration:none;box-shadow:0 4px 0 #8f3460;transition:transform .1s}
.swell-block-button__link:hover{transform:translateY(2px);box-shadow:0 2px 0 #8f3460}
.swell-block-button__link svg{width:18px;height:18px;fill:currentColor}

/* ---------- 吹き出し（読者の気持ち） ---------- */
.c-balloon{display:flex;gap:12px;align-items:flex-start;margin:1.4em 0}
.c-balloon__icon{flex:0 0 52px;height:52px;border-radius:50%;background:var(--chip) center/60% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237b3b63'%3E%3Ccircle cx='12' cy='8' r='4.2'/%3E%3Cpath d='M3.5 21c.8-4.4 4.2-7 8.5-7s7.7 2.6 8.5 7z'/%3E%3C/svg%3E");border:1px solid var(--line)}
.c-balloon__body{position:relative;flex:1;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;font-size:15px}
.c-balloon__body::before{content:"";position:absolute;left:-7px;top:18px;width:12px;height:12px;background:#fff;border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.c-balloon__body p{margin:0}

/* ---------- よくある質問 ---------- */
.swell-block-faq{margin:1.4em 0}
.swell-block-faq__item{border:1px solid var(--line);border-radius:10px;background:#fff;margin:0 0 12px;overflow:hidden}
.post_content .faq_q{margin:0;padding:12px 16px 12px 48px;border:0;font-size:16px;position:relative;background:#fbf5f8}
.post_content .faq_q::before{content:"Q";position:absolute;left:14px;top:11px;width:24px;height:24px;border-radius:50%;background:var(--plum);color:#fff;font-size:13px;display:grid;place-items:center}
.faq_a{padding:12px 16px 2px 48px;position:relative}
.faq_a::before{content:"A";position:absolute;left:14px;top:12px;width:24px;height:24px;border-radius:50%;background:var(--rose);color:#fff;font-size:13px;display:grid;place-items:center}

/* ---------- 手順 ---------- */
.swell-block-step{margin:1.2em 0}
.swell-block-step__item{position:relative;padding:0 0 18px 52px;border-left:2px solid var(--line);margin-left:18px}
.swell-block-step__item:last-child{border-left-color:transparent}
.swell-block-step__number{position:absolute;left:-19px;top:0;width:36px;height:36px;border-radius:50%;background:var(--rose);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:700;counter-increment:step}
.swell-block-step{counter-reset:step}
.swell-block-step__number .__label{display:none}
.swell-block-step__number::after{content:counter(step);font-size:15px}
.swell-block-step__title{font-size:16.5px;margin:4px 0 6px;color:var(--plum)}
.swell-block-step__body p{margin:0 0 .6em}

/* ---------- アコーディオン ---------- */
.swell-block-accordion{margin:1.2em 0}
.swell-block-accordion__item{border:1px solid var(--line);border-radius:10px;background:#fff;margin-bottom:10px}
.swell-block-accordion__title{cursor:pointer;padding:12px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
.swell-block-accordion__title::-webkit-details-marker{display:none}
.swell-block-accordion__title::after{content:"＋";color:var(--rose)}
.swell-block-accordion__item[open] .swell-block-accordion__title::after{content:"－"}
.swell-block-accordion__icon{display:none}
.swell-block-accordion__body{padding:0 16px 6px}

/* ---------- トップページ ---------- */
.home{max-width:860px}
.quick{margin:10px 0 26px;padding:16px;border:2px solid var(--plum);border-radius:12px;background:#fff}
.quick__title{font-weight:700;color:var(--plum);margin:0 0 10px}
.quick .compare-table{font-size:14px}
.quick .cta{white-space:nowrap}
.section-title{font-size:clamp(19px,3.8vw,23px);margin:2.4em 0 1em;padding:14px 16px;background:var(--plum);color:#fff;border-radius:8px}
.guide-group h3{font-size:17px;margin:1.6em 0 .6em;color:var(--plum)}

/* スマホで表の幅に引っぱられて記事が画面からはみ出さないように（2026-10-20） */
.article,.post_content,.toc,.quick,.clinic-cards{min-width:0;max-width:100%}
.home{max-width:min(860px,100%)}
.post_content .wp-block-table,.quick .table-scroll{max-width:100%;overflow-x:auto}
.post_content img,.post_content iframe{max-width:100%;height:auto}
html,body{overflow-x:hidden}
/* 表の横スクロールは列が多い表だけ（2列の表は画面の幅で折り返す） */
@media(max-width:600px){
 .post_content .wp-block-table table{min-width:0}
 .post_content .wp-block-table table:has(tr>:nth-child(3)){min-width:520px}
 .post_content .wp-block-table table:has(tr>:nth-child(4)){min-width:640px}
}
/* ヘッダーのメニューは折り返さず、はみ出す分は横に送る */
.site-header nav{display:flex;gap:18px;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.site-header nav::-webkit-scrollbar{display:none}
/* 目次（2026-10-21）：サイト全体の nav{display:flex} で横並びになるのを止める。本文の中（リード文の最後）に置いても同じ見た目にする */
.toc{display:block}
.post_content .toc .toc__title{margin:0 0 6px}
.post_content .toc ol{margin:0;padding-left:1.4em}
.post_content .toc a{color:var(--ink);text-decoration:none}
.post_content .toc a:hover{color:var(--rose);text-decoration:underline}
