/*=====================================================================*/
/* 記事・固定ページ共通の本文スタイル（prose.css）                      */
/* LAB 記事の本文（.lab-Page .lab-Body）と、汎用固定ページの本文（.pg-Body）で共有する。 */
/* 見出し h2=下に2pxの罫 / h3=ひし形アイコン / h4=帯、リスト、リンク、画像、引用、表、区切り線。 */
/* 本文の外枠（余白・幅・ボタン・ブロック系）は各ページの CSS（lab/article.css・page/style.css）。 */
/* 文字組みは docs/typography.md「記事内 h2/h3/h4」「本文 L」。                          */
/*=====================================================================*/

/*-------------------------------------------------------------------*/
/* 本文 .lab-Body                                                     */
/*-------------------------------------------------------------------*/
.lab-Page .lab-Body,
.pg-Body{
  /* 本文の文字組み: Zen Kaku Gothic New は 400 だと細く x-height も小さいので 500 / 17px にする */
  font-size: 17px;
  font-weight: 500;
  line-height: 2;
  letter-spacing: .04em;
  overflow-wrap: anywhere;
}
.lab-Page .lab-Body > *:first-child,
.pg-Body > *:first-child{ margin-top: 0; }

/* 見出し: 本番（旧テーマ）の記事見出しを踏襲する。
 * h2 = 下に2pxの罫 / h3 = ひし形アイコン（黒＋緑の角） / h4 = 薄い灰色の帯 / h5・h6 = 太字のみ */
.lab-Page .lab-Body h2,
.pg-Body h2,
.lab-Page .lab-Body h3,
.pg-Body h3,
.lab-Page .lab-Body h4,
.pg-Body h4,
.lab-Page .lab-Body h5,
.pg-Body h5,
.lab-Page .lab-Body h6,
.pg-Body h6{
  font-weight: 700;
  letter-spacing: .03em;
  scroll-margin-top: 96px;
  color: #0f0f0f;
}
.lab-Page .lab-Body h2,
.pg-Body h2{
  margin: 72px 0 0;
  padding-bottom: 18px;
  border-bottom: 2px solid #0f0f0f;
  font-size: 26px !important;
  line-height: 1.6;
}
.lab-Page .lab-Body h3,
.pg-Body h3{
  margin: 56px 0 0;
  padding-left: 26px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2219%22%20fill%3D%22none%22%20viewBox%3D%220%200%2018%2019%22%3E%3Cmask%20id%3D%22a%22%20width%3D%2218%22%20height%3D%2219%22%20x%3D%220%22%20y%3D%220%22%20maskUnits%3D%22userSpaceOnUse%22%20style%3D%22mask-type%3Aalpha%22%3E%3Cpath%20fill%3D%22%230f0f0f%22%20d%3D%22m0%209.537%209-9%209%209-9%209-9-9Z%22%2F%3E%3C%2Fmask%3E%3Cg%20mask%3D%22url(%23a)%22%3E%3Cpath%20fill%3D%22%230f0f0f%22%20d%3D%22m0%209.537%209-9%209%209-9%209-9-9Z%22%2F%3E%3Cpath%20fill%3D%22%233CAB8F%22%20d%3D%22m13.869%205.396%204.154%204.154-9.027%209.028-4.155-4.154z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 0 8px / 18px auto no-repeat;
  font-size: 20px !important;
  line-height: 1.6;
}
.lab-Page .lab-Body h4,
.pg-Body h4{
  margin: 40px 0 0;
  padding: 10px 20px;
  background: #E9E9E9;
  font-size: 18px !important;
  line-height: 1.6;
}
.lab-Page .lab-Body h5,
.pg-Body h5,
.lab-Page .lab-Body h6,
.pg-Body h6{
  margin: 28px 0 0;
  font-size: 16px !important;
  line-height: 1.7;
}
.lab-Page .lab-Body h3.has-text-align-center,
.pg-Body h3.has-text-align-center{
  padding-left: 0;
  background: none;
}
.lab-Page .lab-Body h2 + h3,
.pg-Body h2 + h3,
.lab-Page .lab-Body h3 + h4,
.pg-Body h3 + h4{ margin-top: 24px; }

/* 段落・インライン */
.lab-Page .lab-Body p,
.pg-Body p{ margin: 1.75em 0 0; }
.lab-Page .lab-Body strong,
.pg-Body strong,
.lab-Page .lab-Body b,
.pg-Body b{ font-weight: 700; }
/* 本文リンクは青（#1F4FD1、背景 #F7F7F7 とのコントラスト約6:1）。ボタン化されたブロックは除く */
.lab-Page .lab-Body a:not(.wp-block-button__link):not(.blogcard a),
.pg-Body a:not(.wp-block-button__link):not(.blogcard a){
  color: #1F4FD1;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.lab-Page .lab-Body a:not(.wp-block-button__link):hover,
.pg-Body a:not(.wp-block-button__link):hover{
  text-decoration-thickness: 2px;
}
.lab-Page .lab-Body mark,
.pg-Body mark{ background: transparent !important; }
.lab-Page .lab-Body .has-small-font-size,
.pg-Body .has-small-font-size,
.lab-Page .lab-Body small,
.pg-Body small{ font-size: 13px !important; font-weight: 500; line-height: 1.9; }
.lab-Page .lab-Body p.has-medium-font-size,
.pg-Body p.has-medium-font-size{ font-size: 18px !important; }
.lab-Page .lab-Body .has-text-align-center,
.pg-Body .has-text-align-center{ text-align: center; }
.lab-Page .lab-Body .has-text-align-left,
.pg-Body .has-text-align-left{ text-align: left; }
.lab-Page .lab-Body .has-text-align-right,
.pg-Body .has-text-align-right{ text-align: right; }

/* 文字色: グレー等の指定はすべて黒に。白文字(.has-white-color)と黒背景上は残す */
.lab-Page .lab-Body :is(.has-text-color, .has-inline-color, .has-link-color):not(.has-white-color),
.pg-Body :is(.has-text-color, .has-inline-color, .has-link-color):not(.has-white-color){
  color: #0f0f0f !important;
}
.lab-Page .lab-Body [style*="color:#"]:not([style*="background"]):not(.wp-block-button__link),
.pg-Body [style*="color:#"]:not([style*="background"]):not(.wp-block-button__link),
.lab-Page .lab-Body [style*="color: #"]:not([style*="background"]):not(.wp-block-button__link),
.pg-Body [style*="color: #"]:not([style*="background"]):not(.wp-block-button__link){
  color: #0f0f0f !important;
}
.lab-Page .lab-Body .has-black-background-color:not(.wp-block-button__link),
.pg-Body .has-black-background-color:not(.wp-block-button__link){
  background-color: #0f0f0f !important;
  color: #fff !important;
}
.lab-Page .lab-Body .has-black-background-color:not(.wp-block-button__link) a,
.pg-Body .has-black-background-color:not(.wp-block-button__link) a,
.lab-Page .lab-Body .has-black-background-color:not(.wp-block-button__link) :is(.has-text-color, .has-inline-color),
.pg-Body .has-black-background-color:not(.wp-block-button__link) :is(.has-text-color, .has-inline-color){
  color: #fff !important;
}
/* 背景つきの段落・リスト（旧: 白/薄グレーの囲み）は白い囲みに */
.lab-Page .lab-Body :is(p, ul, ol, div).has-background:not(.has-black-background-color):not(.wp-block-button__link):not(.wp-block-button),
.pg-Body :is(p, ul, ol, div).has-background:not(.has-black-background-color):not(.wp-block-button__link):not(.wp-block-button){
  background-color: #fff !important;
  border: 1px solid #CFCFCF;
  padding: 14px 18px;
}
.lab-Page .lab-Body :is(ul, ol).has-background:not(.has-black-background-color),
.pg-Body :is(ul, ol).has-background:not(.has-black-background-color){ padding-left: 2.4em; }

/* リスト */
.lab-Page .lab-Body ul,
.pg-Body ul,
.lab-Page .lab-Body ol,
.pg-Body ol{
  margin: 16px 0 0;
  padding: 0 0 0 1.5em;
}
.lab-Page .lab-Body ul,
.pg-Body ul{ list-style: disc; }
.lab-Page .lab-Body ol,
.pg-Body ol{ list-style: decimal; }
.lab-Page .lab-Body li,
.pg-Body li{ margin: 6px 0 0; padding: 0; }
.lab-Page .lab-Body li:first-child,
.pg-Body li:first-child{ margin-top: 0; }
.lab-Page .lab-Body li > ul,
.pg-Body li > ul,
.lab-Page .lab-Body li > ol,
.pg-Body li > ol{ margin-top: 6px; }
.lab-Page .lab-Body ul ul,
.pg-Body ul ul{ list-style: circle; }

/* 画像・キャプション */
.lab-Page .lab-Body figure,
.pg-Body figure{ margin: 28px 0 0; }
.lab-Page .lab-Body img,
.pg-Body img{
  max-width: 100%;
  height: auto;
}
.lab-Page .lab-Body .wp-block-image img,
.pg-Body .wp-block-image img,
.lab-Page .lab-Body figure > img,
.pg-Body figure > img,
.lab-Page .lab-Body figure > a > img,
.pg-Body figure > a > img{
  display: block;
  border-radius: var(--nk-r-m);
}
.lab-Page .lab-Body .wp-block-image.aligncenter,
.pg-Body .wp-block-image.aligncenter,
.lab-Page .lab-Body figure.aligncenter,
.pg-Body figure.aligncenter,
.lab-Page .lab-Body .aligncenter,
.pg-Body .aligncenter{
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.lab-Page .lab-Body .aligncenter img,
.pg-Body .aligncenter img{ margin-left: auto; margin-right: auto; }
.lab-Page .lab-Body .alignleft,
.pg-Body .alignleft,
.lab-Page .lab-Body .alignright,
.pg-Body .alignright{ float: none; margin-left: 0; margin-right: 0; }
.lab-Page .lab-Body figcaption,
.pg-Body figcaption,
.lab-Page .lab-Body .wp-element-caption,
.pg-Body .wp-element-caption{
  margin: 8px 0 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.8;
  color: #0f0f0f;
  text-align: left;
}
.lab-Page .lab-Body .wp-block-image figcaption,
.pg-Body .wp-block-image figcaption{ text-align: left; }

/* 引用 */
.lab-Page .lab-Body blockquote,
.pg-Body blockquote,
.lab-Page .lab-Body .wp-block-quote,
.pg-Body .wp-block-quote{
  margin: 28px 0 0;
  padding: 4px 0 4px 20px;
  border: 0;
  border-left: 4px solid #0f0f0f;
  background: none;
}
.lab-Page .lab-Body blockquote p:first-child,
.pg-Body blockquote p:first-child{ margin-top: 0; }
.lab-Page .lab-Body blockquote cite,
.pg-Body blockquote cite,
.lab-Page .lab-Body .wp-block-quote cite,
.pg-Body .wp-block-quote cite{
  display: block;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 500;
  font-style: normal;
  line-height: 1.8;
  color: #0f0f0f;
}
.lab-Page .lab-Body pre,
.pg-Body pre,
.lab-Page .lab-Body .wp-block-preformatted,
.pg-Body .wp-block-preformatted{
  margin: 20px 0 0;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid #CFCFCF;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.9;
  white-space: pre-wrap;
  overflow-x: auto;
}

/* 表（モックの .tbl） */
.lab-Page .lab-Body .wp-block-table,
.pg-Body .wp-block-table{
  margin: 20px 0 0;
  overflow-x: auto;
}
.lab-Page .lab-Body table,
.pg-Body table{
  width: 100%;
  margin-top: 20px;
  border-collapse: collapse;
  table-layout: auto !important;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.8;
  background: #fff;
}
.lab-Page .lab-Body .wp-block-table table,
.pg-Body .wp-block-table table{ margin-top: 0; }
.lab-Page .lab-Body th,
.pg-Body th,
.lab-Page .lab-Body td,
.pg-Body td{
  border: 1px solid #CFCFCF;
  padding: 10px 14px;
  text-align: left;
  vertical-align: top;
  min-width: 5em;
}
.lab-Page .lab-Body th,
.pg-Body th{
  font-weight: 700;
  background: #F7F7F7;
}
.lab-Page .lab-Body td[style*="background"],
.pg-Body td[style*="background"],
.lab-Page .lab-Body th[style*="background"],
.pg-Body th[style*="background"]{ background: #fff !important; }
.lab-Page .lab-Body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) td,
.pg-Body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) td{ background: #F7F7F7; }
.lab-Page .lab-Body .wp-block-table.is-style-stripes,
.pg-Body .wp-block-table.is-style-stripes{ border: 0; }
.lab-Page .lab-Body table caption,
.pg-Body table caption,
.lab-Page .lab-Body .wp-block-table figcaption,
.pg-Body .wp-block-table figcaption{
  caption-side: bottom;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 500;
  color: #0f0f0f;
  text-align: left;
}

/* 区切り線・スペーサー（旧デザインの大きな余白は頭打ち） */
.lab-Page .lab-Body hr,
.pg-Body hr,
.lab-Page .lab-Body .wp-block-separator,
.pg-Body .wp-block-separator{
  width: 100% !important;
  max-width: none;
  height: 0;
  margin: 32px 0;
  border: 0;
  border-top: 1px solid #CFCFCF;
  background: none;
  opacity: 1;
  color: #CFCFCF;
}
.lab-Page .lab-Body .wp-block-spacer,
.pg-Body .wp-block-spacer{
  max-height: 16px;
  margin: 0;
}
/* 区切り線の前後のスペーサーは二重の余白になるので消す */
.lab-Page .lab-Body .wp-block-spacer:has(+ hr),
.pg-Body .wp-block-spacer:has(+ hr),
.lab-Page .lab-Body .wp-block-spacer:has(+ .wp-block-separator),
.pg-Body .wp-block-spacer:has(+ .wp-block-separator),
.lab-Page .lab-Body hr + .wp-block-spacer,
.pg-Body hr + .wp-block-spacer,
.lab-Page .lab-Body .wp-block-separator + .wp-block-spacer,
.pg-Body .wp-block-separator + .wp-block-spacer{ display: none; }


/*-------------------------------------------------------------------*/
/* SP（767px 以下）                                                   */
/*-------------------------------------------------------------------*/
@media screen and (max-width: 767px){
  .lab-Page .lab-Body,
  .pg-Body{ font-size: 16px; line-height: 1.9; }
  .lab-Page .lab-Body h2,
  .pg-Body h2{ margin-top: 56px; font-size: 21px !important; }
  .lab-Page .lab-Body h3,
  .pg-Body h3{ margin-top: 44px; font-size: 18px !important; background-position: 0 6px; }
  .lab-Page .lab-Body h4,
  .pg-Body h4{ margin-top: 32px; font-size: 17px !important; }
  .lab-Page .lab-Body h2,
  .lab-Page .lab-Body h3,
  .lab-Page .lab-Body h4,
  .lab-Page .lab-Body h5,
  .lab-Page .lab-Body h6,
  .pg-Body h2,
  .pg-Body h3,
  .pg-Body h4,
  .pg-Body h5,
  .pg-Body h6{ scroll-margin-top: 76px; }
  .lab-Page .lab-Body table,
  .pg-Body table{ font-size: 16px; line-height: 1.7; }
  .lab-Page .lab-Body th,
  .lab-Page .lab-Body td,
  .pg-Body th,
  .pg-Body td{ padding: 8px 10px; min-width: 6em; }
  .lab-Page .lab-Body hr,
  .lab-Page .lab-Body .wp-block-separator,
  .pg-Body hr,
  .pg-Body .wp-block-separator{ margin: 28px 0; }
}