/* コラム記事の本文パーツ（図解・囲み・更新日）。scripts/column_build.py が出力するクラスに対応 */

/* 公開日と更新日 */
.header_post .post_dates { display: flex; gap: 1.2em; align-items: baseline; }
.header_post .post_dates .modified { font-size: 1.3rem; color: #5c5c5c; }
.header_post .post_dates .modified::before { content: "更新"; margin-right: .4em; }

/* 図解：PC用とスマホ用の SVG を幅で切り替える */
.article_body .ac_fig { margin: 50px 0; }
.article_body .ac_fig svg { display: block; width: 100%; height: auto; margin: 0; overflow: visible; }
.article_body .ac_fig .ac_fig_sp { display: none; }
.article_body .ac_fig figcaption { margin-top: 20px; font-size: 1.4rem; line-height: 1.7; color: #5c5c5c; }
.article_body .ac_fig figcaption b { margin-right: .6em; font-family: "Roboto", sans-serif; font-weight: 500; color: #0077a8; }
@media screen and (max-width: 786px) {
  .article_body .ac_fig { margin: 36px 0; }
  .article_body .ac_fig .ac_fig_pc { display: none; }
  .article_body .ac_fig .ac_fig_sp { display: block; }
  .article_body .ac_fig figcaption { font-size: 1.3rem; }
}

/* 囲み：要点・支援の現場から・お問い合わせ・参考にした情報 */
.article_body .ac_box { margin: 40px 0; }
.article_body .ac_box p { margin-bottom: 0; }
.article_body .ac_box p + p { margin-top: 1em; }
.article_body .ac_box_ttl { font-weight: bold; color: #222; }
.article_body .ac_box ul { margin: 0; }
.article_body .ac_box ul li { font-size: inherit; }

.article_body .ac_summary { padding: 28px 32px; background: #f4f4f4; }
.article_body .ac_summary .ac_box_ttl { margin-bottom: .6em; }
.article_body .ac_summary ul li::before { width: 6px; height: 6px; top: 1.05em; left: -14px; background: #00a7ea; }
.article_body .ac_summary ul li { line-height: 1.8; padding: .25em 0; font-size: 1.6rem; }

.article_body .ac_note { position: relative; padding: 4px 0 4px 32px; }
.article_body .ac_note::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: #00a7ea; }
.article_body .ac_note::after { content: ""; position: absolute; left: -6px; top: 2px; width: 1px; height: 24px; background: #00a7ea; transform: rotate(-15deg); }
.article_body .ac_note .ac_box_ttl { margin-bottom: .5em; font-size: 1.4rem; color: #0077a8; }
.article_body .ac_note p { line-height: 2; }

.article_body .ac_cta { margin-top: 60px; padding: 32px; border: 1px solid #00a7ea; }
.article_body .ac_cta .ac_cta_btn { margin-top: 1.2em; }
.article_body .ac_cta .ac_cta_btn a { display: inline-flex; align-items: center; gap: .8em; font-weight: bold; color: #222; text-decoration: none; border-bottom: 1px solid #222; padding-bottom: 2px; transition: color .2s, border-color .2s; }
.article_body .ac_cta .ac_cta_btn a::after { content: "→"; font-weight: 400; transition: transform .2s; }
.article_body .ac_cta .ac_cta_btn a:hover { color: #00a7ea; border-color: #00a7ea; }
.article_body .ac_cta .ac_cta_btn a:hover::after { transform: translateX(4px); }

.article_body .ac_sources { margin-top: 40px; font-size: 1.3rem; color: #5c5c5c; }
.article_body .ac_sources .ac_box_ttl { margin-bottom: .4em; font-size: 1.3rem; }
.article_body .ac_sources ul li { font-size: 1.3rem; line-height: 1.7; padding: .15em 0; }
.article_body .ac_sources ul li::before { width: 4px; height: 4px; top: .95em; left: -12px; background: #999; }
.article_body .ac_sources a { color: inherit; word-break: break-all; }

/* 本文の箇条書き：段落と同じ大きさにし、行頭の点を1行目にそろえる */
.article_body ul li, .article_body ol li { font-size: 1.6rem; line-height: 2; }
.article_body ul li::before { top: calc(.2em + 1em - 4px); }

/* 本文中のリンクと表 */
.article_body p a, .article_body li a { color: #0077a8; text-decoration: underline; text-underline-offset: 3px; }
.article_body .wp-block-table th { font-size: 1.5rem; }
.article_body .wp-block-table td { font-size: 1.5rem; line-height: 1.8; }
@media screen and (max-width: 786px) {
  .article_body .ac_summary, .article_body .ac_cta { padding: 22px 20px; }
  .article_body .ac_note { padding-left: 24px; }
}