/*=====================================================================*/
/* NOKID Lab 記事ページ（single-blog.php）                            */
/* style.css（共通: トークン・タブバー・カード・.tg。見出しは common.css の .nk-SecHead）の上に載せる。  */
/* 本文（.lab-Body）は旧ブログCSSを読み込まないため、ここで全ブロックを定義する。 */
/* 色は黒(#0f0f0f)・背景(#F7F7F7)・白のみ。グレー文字なし（罫線 #CFCFCF のみ可）。 */
/*=====================================================================*/

/*-------------------------------------------------------------------*/
/* layout / head                                                      */
/*-------------------------------------------------------------------*/
.lab-Article .art{
  max-width: 860px;
  margin: 0 auto;
  padding: 40px 28px 0;
}
.lab-Article .art > .nk-Breadcrumb{ margin: 0; }
.lab-Article .art > .tags{ margin-top: 20px; }
.lab-Article .tags > li{ display: block; }
.lab-Article .tg-d{
  background: #0f0f0f;
  color: #fff;
}
.lab-Article .tags > li.tg-d{
  display: block;
  border-color: #0f0f0f;
}
.lab-Article a.tg{
  display: block;
  transition: background-color .2s, color .2s;
}
.lab-Article a.tg:hover{
  background: #0f0f0f;
  color: #fff;
}
.lab-Article .ttl-h1{
  margin: 16px 0 0;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .04em;
}
.lab-Article .by{
  margin: 18px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 24px;
  font-size: 13px;
  padding: 14px 0;
  border-top: 1px solid #CFCFCF;
  border-bottom: 1px solid #CFCFCF;
}
.lab-Article .by dt{ font-weight: 700; display: inline; }
.lab-Article .by dd{ display: inline; margin: 0 0 0 8px; }
.lab-Article .by time{ font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif; font-weight: 500; font-size: 14px; line-height: 1.2; letter-spacing: .04em; }
.lab-Article .by a{ text-decoration: underline; text-underline-offset: 3px; }
.lab-Article .eye{
  margin-top: 28px;
  aspect-ratio: 16 / 9;
  background: #E9E9E9;
  overflow: hidden;
  border-radius: var(--nk-r-m);
}
.lab-Article .eye img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 要点 */
.lab-Article .sum{
  margin-top: 32px;
  background: #fff;
  border: 2px solid #0f0f0f;
  padding: 24px 28px;
}
.lab-Article .sum h2{
  font-size: 17px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}
.lab-Article .chip{
  display: inline-block;
  background: #0f0f0f;
  color: #fff;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: .1em;
  padding: 4px 10px 5px;
}
.lab-Article .sum ol{
  margin: 12px 0 0;
  padding: 0 0 0 1.4em;
  list-style: decimal;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
}
.lab-Article .sum li + li{ margin-top: 8px; }
.lab-Article .sum p.up{ margin: 14px 0 0; font-size: 13px; font-weight: 500; }

/*-------------------------------------------------------------------*/
/* 目次（Easy Table of Contents）をモックの .toc の形に                */
/* プラグインの CSS（screen.min.css とインライン）に勝つため #id + !important を使う */
/*-------------------------------------------------------------------*/
.lab-Page .lab-Body #ez-toc-container{
  display: block !important;
  width: 100% !important;
  margin: 32px 0 0 !important;
  padding: 14px 0 0 !important;
  background: none !important;
  border: 0 !important;
  border-top: 2px solid #0f0f0f !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #0f0f0f !important;
  position: static !important;
}
.lab-Page .lab-Body #ez-toc-container .ez-toc-title-container{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
.lab-Page .lab-Body #ez-toc-container p.ez-toc-title{
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.8 !important;
  color: #0f0f0f !important;
  letter-spacing: .04em;
}
/* 開閉ボタンとアイコンは使わない */
.lab-Page .lab-Body #ez-toc-container .ez-toc-title-toggle,
.lab-Page .lab-Body #ez-toc-container .ez-toc-toggle,
.lab-Page .lab-Body #ez-toc-container .ez-toc-js-icon-con,
.lab-Page .lab-Body #ez-toc-container .ez_toc_custom_title_icon,
.lab-Page .lab-Body #ez-toc-container .ez_toc_custom_toc_icon,
.lab-Page .lab-Body #ez-toc-container .ez-toc-box-title,
.lab-Page .lab-Body #ez-toc-container svg{
  display: none !important;
}
.lab-Page .lab-Body #ez-toc-container nav{ display: block !important; }
.lab-Page .lab-Body #ez-toc-container ul,
.lab-Page .lab-Body #ez-toc-container ul.ez-toc-list{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  counter-reset: lab-toc;
}
.lab-Page .lab-Body #ez-toc-container nav > ul{ margin-top: 8px !important; }
.lab-Page .lab-Body #ez-toc-container li{
  position: relative;
  margin: 0 !important;
  padding: 0 0 0 2.4em !important;
  counter-increment: lab-toc;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 2.1 !important;
  list-style: none !important;
}
.lab-Page .lab-Body #ez-toc-container li li{
  font-size: 14px !important;
  font-weight: 400 !important;
}
.lab-Page .lab-Body #ez-toc-container li::before{
  content: counters(lab-toc, ".") ".";
  position: absolute;
  left: 0;
  top: 0;
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 500;
  letter-spacing: .04em;
}
/* プラグイン側の番号（a::before）は止める */
.lab-Page .lab-Body #ez-toc-container li a::before,
.lab-Page .lab-Body #ez-toc-container li a.ez-toc-link::before{
  content: none !important;
  display: none !important;
}
.lab-Page .lab-Body #ez-toc-container li a,
.lab-Page .lab-Body #ez-toc-container li a.ez-toc-link,
.lab-Page .lab-Body #ez-toc-container ul.ez-toc-list a{
  display: inline !important;
  color: #0f0f0f !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-decoration: none !important;
  background: linear-gradient(#0f0f0f, #0f0f0f) left bottom / 0 1px no-repeat;
  transition: background-size .45s cubic-bezier(.7,0,.2,1);
}
.lab-Page .lab-Body #ez-toc-container li a:hover,
.lab-Page .lab-Body #ez-toc-container li a:focus-visible{
  background-size: 100% 1px;
  color: #0f0f0f !important;
}

/* 本文の見出し・段落・リスト・画像・引用・表・区切り線は prose.css（page.php と共通）。ここは LAB 記事の外枠 */
.lab-Page .lab-Body{ margin-top: 40px; }

/* ギャラリー（列数 3 が既定。画像が少ない行は伸ばす） */
.lab-Page .lab-Body .wp-block-gallery{ margin: 28px 0 0; }
.lab-Page .lab-Body .wp-block-gallery.has-nested-images,
.lab-Page .lab-Body .blocks-gallery-grid{
  --lab-cols: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lab-Page .lab-Body .wp-block-gallery.has-nested-images{ margin-top: 28px; }
.lab-Page .lab-Body .wp-block-gallery:not(.has-nested-images){ display: block; }
.lab-Page .lab-Body .wp-block-gallery:not(.has-nested-images) .blocks-gallery-grid{ margin-top: 0; }
.lab-Page .lab-Body .wp-block-gallery.columns-1{ --lab-cols: 1; }
.lab-Page .lab-Body .wp-block-gallery.columns-2{ --lab-cols: 2; }
.lab-Page .lab-Body .wp-block-gallery.columns-4{ --lab-cols: 4; }
.lab-Page .lab-Body .wp-block-gallery.columns-1 .blocks-gallery-grid,
.lab-Page .lab-Body .wp-block-gallery.columns-1.has-nested-images{ --lab-cols: 1; }
.lab-Page .lab-Body .wp-block-gallery.columns-2 .blocks-gallery-grid,
.lab-Page .lab-Body .wp-block-gallery.columns-2.has-nested-images{ --lab-cols: 2; }
.lab-Page .lab-Body .wp-block-gallery.columns-4 .blocks-gallery-grid,
.lab-Page .lab-Body .wp-block-gallery.columns-4.has-nested-images{ --lab-cols: 4; }
.lab-Page .lab-Body .wp-block-gallery figure,
.lab-Page .lab-Body .blocks-gallery-item{
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
  max-width: none;
  width: auto !important;
  flex: 1 1 calc(100% / var(--lab-cols, 3) - 12px) !important;
}
.lab-Page .lab-Body .wp-block-gallery img{ width: 100%; border-radius: var(--nk-r-m); }
/* 画像に文字が焼き込まれているものが多いので、切り抜かず元の比率で並べる */
.lab-Page .lab-Body .wp-block-gallery img{ height: auto !important; object-fit: contain; }

/* 埋め込み（YouTube などの iframe は 16:9 で幅いっぱい） */
.lab-Page .lab-Body .wp-block-embed{ margin: 28px 0 0; }
.lab-Page .lab-Body .wp-block-embed__wrapper{ position: relative; max-width: 100%; }
.lab-Page .lab-Body .wp-has-aspect-ratio .wp-block-embed__wrapper::before{ content: none !important; display: none !important; }
.lab-Page .lab-Body .wp-has-aspect-ratio .wp-block-embed__wrapper{ aspect-ratio: 16 / 9; }
.lab-Page .lab-Body .wp-embed-aspect-16-9 .wp-block-embed__wrapper{ aspect-ratio: 16 / 9; }
.lab-Page .lab-Body .wp-embed-aspect-4-3 .wp-block-embed__wrapper{ aspect-ratio: 4 / 3; }
.lab-Page .lab-Body .wp-embed-aspect-1-1 .wp-block-embed__wrapper{ aspect-ratio: 1 / 1; }
.lab-Page .lab-Body .wp-embed-aspect-21-9 .wp-block-embed__wrapper{ aspect-ratio: 21 / 9; }
.lab-Page .lab-Body .wp-embed-aspect-9-16 .wp-block-embed__wrapper{ aspect-ratio: 9 / 16; max-width: 360px; margin: 0 auto; }
.lab-Page .lab-Body .wp-has-aspect-ratio iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.lab-Page .lab-Body iframe{ max-width: 100%; border: 0; }
.lab-Page .lab-Body iframe[src*="youtube"],
.lab-Page .lab-Body iframe[src*="youtu.be"],
.lab-Page .lab-Body iframe[src*="vimeo"]{
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.lab-Page .lab-Body .wp-has-aspect-ratio iframe[src*="youtube"],
.lab-Page .lab-Body .wp-has-aspect-ratio iframe[src*="vimeo"]{ aspect-ratio: auto; height: 100%; }
/* X / Instagram / TikTok は中央に・最大幅つき */
.lab-Page .lab-Body :is(.wp-block-embed-twitter, .wp-block-embed-x, .wp-block-embed-instagram, .wp-block-embed-tiktok, .is-provider-twitter, .is-provider-x, .is-provider-instagram, .is-provider-tiktok) .wp-block-embed__wrapper{
  display: flex;
  justify-content: center;
  max-width: 550px;
  margin: 0 auto;
  aspect-ratio: auto;
  overflow-wrap: anywhere;
}
.lab-Page .lab-Body .wp-block-embed-tiktok .wp-block-embed__wrapper{ max-width: 605px; }
.lab-Page .lab-Body :is(.wp-block-embed-twitter, .wp-block-embed-x, .wp-block-embed-instagram, .wp-block-embed-tiktok) figcaption{ text-align: center; }
.lab-Page .lab-Body :is(.twitter-tweet, .instagram-media, .tiktok-embed){
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.lab-Page .lab-Body .wp-block-embed.is-type-rich:not(.wp-has-aspect-ratio) iframe{ position: static; }
/* X の投稿。widgets.js が読み込めたときは投稿の表示に置き換わる。読み込めない／投稿を取得できないときは、このリンクカードのまま読める */
.lab-Page .lab-Body .nk-XPost{
  width: 100%;
  margin: 0 !important;
  padding: 0;
  border: 0;
}
.lab-Page .lab-Body .nk-XPost a{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: #fff;
  border: 1px solid #CFCFCF;
  color: #0f0f0f !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: .04em;
  text-decoration: none !important;
  overflow-wrap: anywhere;
  transition: border-color .25s;
}
.lab-Page .lab-Body .nk-XPost a::before{
  content: "X";
  flex: none;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  background: #0f0f0f;
  color: #fff;
  font-family: 'Jost', sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}
.lab-Page .lab-Body .nk-XPost a::after{
  content: "›";
  margin-left: auto;
  font-family: 'Jost', sans-serif;
  font-size: 20px;
  line-height: 1;
}
.lab-Page .lab-Body .nk-XPost a:hover{ border-color: #0f0f0f; }
@media screen and (max-width:767px){
  .lab-Page .lab-Body .nk-XPost a{ padding: 14px 16px; font-size: 14px; }
}

/* 動画 */
.lab-Page .lab-Body .wp-block-video{ margin: 28px 0 0; }
.lab-Page .lab-Body video{ display: block; width: 100%; height: auto; border-radius: var(--nk-r-m); }

.lab-Page .lab-Body .wp-block-details + hr,
.lab-Page .lab-Body .wp-block-details + .wp-block-separator,
.lab-Page .lab-Body .wp-block-details + .wp-block-spacer{ display: none; }
.lab-Page .lab-Body hr:has(+ .wp-block-details),
.lab-Page .lab-Body hr:has(+ .blogcard),
.lab-Page .lab-Body .blogcard + hr{ margin: 28px 0 20px; }

/* 段組み・グループ */
.lab-Page .lab-Body .wp-block-columns{
  display: flex;
  gap: 24px;
  margin: 28px 0 0;
}
.lab-Page .lab-Body .wp-block-column{
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
}
.lab-Page .lab-Body .wp-block-column[style*="flex-basis"]{ flex-grow: 0; flex-shrink: 1; }
.lab-Page .lab-Body .wp-block-column > *:first-child{ margin-top: 0; }
.lab-Page .lab-Body .wp-block-group{ margin-top: 0; }
.lab-Page .lab-Body .wp-block-group > h2:first-child{ margin-top: 56px; }

/* ボタン（黒 + ">>"、ホバーで反転） */
.lab-Page .lab-Body .wp-block-buttons{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 28px 0 0;
}
.lab-Page .lab-Body .wp-block-button{ margin: 0; max-width: 100%; }
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-sizing: border-box;
  min-height: 48px;
  max-width: 100%;
  padding: 8px 20px 8px 22px;
  border: 2px solid #0f0f0f !important;
  border-radius: 0 !important;
  background: #0f0f0f !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .04em;
  text-align: center;
  text-decoration: none !important;
  transition: background-color .2s, color .2s;
}
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link strong,
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link span{ color: inherit !important; }
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link::after{
  content: "";
  flex: none;
  width: 24px;
  height: 13px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 34'%3E%3Cpath d='M14 6l11 11-11 11M31 6l11 11-11 11' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 34'%3E%3Cpath d='M14 6l11 11-11 11M31 6l11 11-11 11' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link:hover,
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link:focus-visible{
  background: #fff !important;
  color: #0f0f0f !important;
}
.lab-Page .lab-Body .wp-block-buttons .wp-block-button__link:hover::after{ transform: translateX(4px); }
.lab-Page .lab-Body .wp-block-button.has-custom-width{ width: auto; }
.lab-Page .lab-Body .wp-block-button__width-50{ width: calc(50% - 6px); }
.lab-Page .lab-Body .wp-block-button__width-50 .wp-block-button__link{ width: 100%; }
.lab-Page .lab-Body .wp-block-button__width-25{ width: calc(25% - 9px); }
.lab-Page .lab-Body .wp-block-button__width-75{ width: calc(75% - 3px); }
.lab-Page .lab-Body .wp-block-button__width-100{ width: 100%; }
.lab-Page .lab-Body .wp-block-button__width-100 .wp-block-button__link,
.lab-Page .lab-Body .wp-block-button__width-75 .wp-block-button__link,
.lab-Page .lab-Body .wp-block-button__width-25 .wp-block-button__link{ width: 100%; }

/* 折りたたみ（〇〇のための記事リンク集） */
.lab-Page .lab-Body .wp-block-details{
  margin: 12px 0 0;
  background: #fff;
  border: 1px solid #CFCFCF;
}
.lab-Page .lab-Body .wp-block-details + .wp-block-details{ margin-top: -1px; }
.lab-Page .lab-Body .wp-block-details > summary{
  position: relative;
  display: block;
  padding: 14px 52px 14px 16px;
  color: #0f0f0f;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  list-style: none;
  cursor: pointer;
}
.lab-Page .lab-Body .wp-block-details > summary::-webkit-details-marker{ display: none; }
.lab-Page .lab-Body .wp-block-details > summary::marker{ content: ""; }
.lab-Page .lab-Body .wp-block-details > summary::after{
  content: "";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -7px;
  border-right: 2px solid #0f0f0f;
  border-bottom: 2px solid #0f0f0f;
  transform: rotate(45deg);
  transition: transform .3s cubic-bezier(.2,.7,.2,1), margin-top .3s;
}
.lab-Page .lab-Body .wp-block-details[open] > summary::after{
  margin-top: -3px;
  transform: rotate(-135deg);
}
.lab-Page .lab-Body .wp-block-details > summary:hover{ background: #F7F7F7; }
.lab-Page .lab-Body .lab-det{
  padding: 12px 16px 16px;
  border-top: 1px solid #CFCFCF;
  column-count: 2;
  column-gap: 32px;
  font-size: 14px;
  line-height: 1.9;
}
.lab-Page .lab-Body .lab-det > *:first-child{ margin-top: 0; }
.lab-Page .lab-Body .lab-det p{
  margin: 0 0 6px;
  orphans: 1;
  widows: 1;
}
.lab-Page .lab-Body .lab-det hr,
.lab-Page .lab-Body .lab-det .wp-block-separator,
.lab-Page .lab-Body .lab-det .wp-block-spacer{ display: none; }
.lab-Page .lab-Body .lab-det .wp-block-buttons{ column-span: all; }

/* 吹き出し（オリジナルブロック my-plugin/balloon-block） */
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block{
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 4px 16px;
  align-items: start;
  margin: 24px 0 0;
}
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block.is-style-right{ grid-template-columns: minmax(0, 1fr) 56px; }
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block .image-column{
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  background: #E9E9E9;
}
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block .image-column img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0;
}
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block.is-style-right .image-column{ grid-column: 2; grid-row: 1; }
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block.is-style-right .content-column{ grid-column: 1; grid-row: 1; }
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block .name{
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
}
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block .text{
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #CFCFCF;
}
.lab-Page .lab-Body .wp-block-my-plugin-balloon-block .text > *:first-child{ margin-top: 0; }

/*-------------------------------------------------------------------*/
/* 内部記事カード（[sc_blogcard]）                                    */
/*-------------------------------------------------------------------*/
.lab-Page .lab-Body .blogcard{ margin: 28px 0 0; }
.lab-Page .lab-Body .blogcard a{
  position: relative;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 20px 64px 20px 20px;
  background: #fff;
  border: 1px solid #CFCFCF;
  text-decoration: none;
  line-height: 1.8;
  transition: border-color .25s;
}
.lab-Page .lab-Body .blogcard a:hover{ border-color: #0f0f0f; }
.lab-Page .lab-Body .blogcard--plain a{
  display: inline;
  padding: 0;
  background: none;
  border: 0;
  text-decoration: underline;
}
.lab-Page .lab-Body .blogcard--plain{ margin: 16px 0 0; }
.lab-Page .blogcard_thumbnail{
  display: block;
  aspect-ratio: 16 / 9;
  border-radius: var(--nk-r-m);
  overflow: hidden;
  background: #E9E9E9;
}
.lab-Page .blogcard_thumbnail img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0;
  transition: transform 1.4s cubic-bezier(.16,.84,.3,1);
}
.lab-Page .blogcard a:hover .blogcard_thumbnail img{ transform: scale(1.035); }
.lab-Page .blogcard_content{ display: block; min-width: 0; }
.lab-Page .blogcard_label{
  display: block;
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: .2em;
}
.lab-Page .blogcard_label i{
  margin-left: 10px;
  font-style: normal;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .08em;
}
.lab-Page .blogcard_title{
  display: block;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .04em;
}
.lab-Page .blogcard_title span{
  background: linear-gradient(#0f0f0f, #0f0f0f) left bottom / 0 1px no-repeat;
  transition: background-size .45s cubic-bezier(.7,0,.2,1);
}
.lab-Page .blogcard a:hover .blogcard_title span{ background-size: 100% 1px; }
.lab-Page .blogcard_excerpt{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.8;
  font-weight: 400;
}
.lab-Page .blogcard_meta{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.lab-Page .blogcard_meta .tg{
  padding: 5px 7px 6px;
  font-size: 11px;
}
.lab-Page .blogcard_meta time{
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: .04em;
}
.lab-Page .blogcard_arrow{
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.lab-Page .blogcard_arrow svg{ display: block; }
.lab-Page .blogcard a:hover .blogcard_arrow{ transform: translate(4px, -50%); }

/* 共通CSSの .nk-Phr は inline-block。行数で切る要素（line-clamp）の中では inline に戻す */
.lab-Page .blogcard_title .nk-Phr,
.lab-Page .blogcard_excerpt .nk-Phr,
.lab-Page .lab-Card .ttl .nk-Phr{ display: inline; }

/*-------------------------------------------------------------------*/
/* 関連資料 / 引用表記 / 執筆・監修                                   */
/*-------------------------------------------------------------------*/
.lab-Article .docs{
  margin-top: 56px;
  background: #fff;
  border: 2px solid #0f0f0f;
  padding: 24px 28px 4px;
}
.lab-Article .docs-hd{
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}
.lab-Article .docs-hd .lb{
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .2em;
}
.lab-Article .docs h2{ font-size: 18px; font-weight: 700; }
.lab-Article .docs ul{ margin: 16px 0 0; }
.lab-Article .docs li{
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 20px 0;
  border-top: 1px solid #CFCFCF;
}
.lab-Article .docs .dth{
  display: block;
  aspect-ratio: 16 / 9;
  border-radius: var(--nk-r-m);
  overflow: hidden;
  background: #E9E9E9;
}
.lab-Article .docs .dth img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1.4s cubic-bezier(.16,.84,.3,1);
}
.lab-Article .docs li:hover .dth img{ transform: scale(1.035); }
.lab-Article .docs .tg{ display: inline-block; background: #fff; }
.lab-Article .docs .dtt{
  margin: 10px 0 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}
.lab-Article .docs .acts{
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
/* 見た目は common.css の .nk-Btn（M・primary） */
.lab-Article .docs .dbtn .chev-btn{
  display: block;
  width: 24px;
  height: 13px;
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.lab-Article .docs .dbtn:hover .chev-btn{ transform: translateX(4px); }
.lab-Article .docs .dlink{
  font-weight: 700;
  font-size: 13px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* SNS シェア（本文末・引用表記の前）。黒・2px線・角丸なし。アイコンは 44px の正方形ボタン */
.lab-Article .share{
  margin-top: 32px;
  display: flex;
  align-items: center;
  gap: 8px 16px;
  flex-wrap: wrap;
  padding: 16px 0;
  border-top: 1px solid #CFCFCF;
}
.lab-Article .share-lb{
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1;
  margin: 0;
}
.lab-Article .share-tx{ margin: 0; font-size: 13px; font-weight: 500; }
.lab-Article .share ul{ display: flex; gap: 8px; margin: 0 0 0 auto; padding: 0; list-style: none; }
.lab-Article .share li{ margin: 0; padding: 0; list-style: none; }
.lab-Article .share-btn{
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #0f0f0f;
  border-radius: 0;
  background: #fff;
  color: #0f0f0f;
  text-decoration: none;
  transition: background-color .2s, color .2s;
}
.lab-Article .share-btn:hover{ background: #0f0f0f; color: #fff; }
.lab-Article .share-btn:focus-visible{ outline: 2px solid #0f0f0f; outline-offset: 3px; }

.lab-Article .cite{
  margin-top: 32px;
  background: #fff;
  border: 2px solid #0f0f0f;
  padding: 20px 24px;
}
.lab-Article .cite h2{ font-size: 16px; font-weight: 700; }
.lab-Article .cite pre{
  margin: 12px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.9;
  background: #F7F7F7;
  border: 1px solid #CFCFCF;
  padding: 12px 14px;
}
/* 見た目は common.css の .nk-Btn（M・outline）。コピー済みの表示だけ反転 */
.lab-Article .cite button{
  margin-top: 12px;
}
.lab-Article .cite button.done{ background: #0f0f0f; color: #fff; }

.lab-Article .who-wrap{
  margin-top: 32px;
  border-top: 1px solid #CFCFCF;
  border-bottom: 1px solid #CFCFCF;
}
.lab-Article .who{
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  padding: 20px 0;
}
.lab-Article .who + .who{ border-top: 1px solid #CFCFCF; }
.lab-Article .who i,
.lab-Article .who .who-img{
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
}
.lab-Article .who i{
  background: #0f0f0f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
}
.lab-Article .who .who-img{ display: block; background: #E9E9E9; }
.lab-Article .who .who-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lab-Article .who-name{ display: block; font-size: 16px; font-weight: 700; line-height: 1.6; }
.lab-Article .who-desc{ margin: 4px 0 0; font-size: 15px; font-weight: 500; line-height: 1.9; }
.lab-Article .who-links{ margin: 6px 0 0; font-size: 13px; font-weight: 500; }
.lab-Article .who-links a,
.lab-Article .who-policy a{ text-decoration: underline; text-underline-offset: 3px; }
.lab-Article .who-policy{
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  padding: 14px 0 16px;
  border-top: 1px solid #CFCFCF;
  font-size: 13px;
}

/*-------------------------------------------------------------------*/
/* RELATED                                                            */
/*-------------------------------------------------------------------*/
.lab-Article .rel{ margin: 96px var(--px) 0; }

/*-------------------------------------------------------------------*/
/* 固定の資料バナー（cf_blog_fixedbnr）                               */
/*-------------------------------------------------------------------*/
.lab-Page .lab-Bnr{
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 40;
  width: 300px;
  background: #fff;
  border: 2px solid #0f0f0f;
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
  visibility: hidden;
  transition: opacity .4s ease, transform .4s cubic-bezier(.2,.7,.2,1), visibility 0s linear .4s;
}
.lab-Page .lab-Bnr[hidden]{ display: none; }
.lab-Page .lab-Bnr.is-on{
  opacity: 1;
  transform: none;
  pointer-events: auto;
  visibility: visible;
  transition: opacity .4s ease, transform .4s cubic-bezier(.2,.7,.2,1), visibility 0s;
}
.lab-Page .lab-Bnr .bnr-link{
  position: relative;
  display: block;
  padding: 16px 52px 16px 18px;
}
.lab-Page .lab-Bnr .bnr-lb{
  display: block;
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .2em;
  line-height: 1.5;
}
.lab-Page .lab-Bnr .bnr-tt{
  display: block;
  margin-top: 2px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}
.lab-Page .lab-Bnr .bnr-sub{
  display: block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.7;
}
.lab-Page .lab-Bnr .bnr-chev{
  position: absolute;
  right: 16px;
  bottom: 18px;
  width: 24px;
  height: 13px;
  margin: 0;
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.lab-Page .lab-Bnr .bnr-link:hover .bnr-chev{ transform: translateX(4px); }
.lab-Page .lab-Bnr .bnr-close{
  position: absolute;
  top: 0;
  right: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  padding: 0;
}
.lab-Page .lab-Bnr .bnr-close:hover{ background: #0f0f0f; color: #fff; }

/* scroll reveal は common.css の nk-reveal に統一（対象セレクタもそちらに集約） */

/*-------------------------------------------------------------------*/
/* tablet (≤ 1024)                                                    */
/*-------------------------------------------------------------------*/
@media screen and (max-width: 1024px){
  .lab-Article .art{ padding-left: 24px; padding-right: 24px; }
}

/*-------------------------------------------------------------------*/
/* SP (≤ 767)                                                         */
/*-------------------------------------------------------------------*/
@media screen and (max-width: 767px){
  .lab-Article .art{ padding: 24px 16px 0; }
  .lab-Article .art > .tags{ margin-top: 14px; }
  .lab-Article .ttl-h1{ font-size: 24px; margin-top: 12px; }
  .lab-Article .by{ grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lab-Article .by time{ font-size: 12px; }
  .lab-Article .eye{ margin-top: 20px; border-radius: var(--nk-r-m); }
  .lab-Article .sum{ margin-top: 24px; padding: 18px 16px; }
  .lab-Article .sum ol{ font-size: 15px; }
  .lab-Article .who-desc,
  .lab-Article .cite pre{ font-size: 15px; }

  .lab-Page .lab-Body{ margin-top: 32px; }
  .lab-Page .lab-Body #ez-toc-container li{ font-size: 14px !important; }
  .lab-Page .lab-Body #ez-toc-container li li{ font-size: 13px !important; }
  .lab-Page .lab-Body .wp-block-columns{ flex-direction: column; align-items: stretch !important; gap: 16px; }
  .lab-Page .lab-Body .wp-block-column,
  .lab-Page .lab-Body .wp-block-column[style*="flex-basis"]{ flex: 0 0 auto !important; width: 100%; }
  .lab-Page .lab-Body .wp-block-gallery.has-nested-images,
  .lab-Page .lab-Body .blocks-gallery-grid{ gap: 8px; --lab-cols: 2; }
  .lab-Page .lab-Body .wp-block-gallery.columns-1.has-nested-images,
  .lab-Page .lab-Body .wp-block-gallery.columns-1 .blocks-gallery-grid{ --lab-cols: 1; }
  .lab-Page .lab-Body .wp-block-gallery figure,
  .lab-Page .lab-Body .blocks-gallery-item{ flex-basis: calc(100% / var(--lab-cols, 2) - 8px) !important; }
  .lab-Page .lab-Body .wp-block-buttons{ flex-direction: column; align-items: stretch; }
  .lab-Page .lab-Body .wp-block-button,
  .lab-Page .lab-Body .wp-block-button.has-custom-width{ width: 100%; }
  .lab-Page .lab-Body .wp-block-buttons .wp-block-button__link{ width: 100%; }
  .lab-Page .lab-Body .lab-det{ column-count: 1; padding: 10px 14px 14px; }
  .lab-Page .lab-Body .wp-block-details > summary{ padding: 12px 44px 12px 14px; font-size: 14px; }
  .lab-Page .lab-Body .wp-block-details > summary::after{ right: 18px; }
  .lab-Page .lab-Body .wp-block-my-plugin-balloon-block{ grid-template-columns: 44px minmax(0, 1fr); gap: 4px 12px; }
  .lab-Page .lab-Body .wp-block-my-plugin-balloon-block.is-style-right{ grid-template-columns: minmax(0, 1fr) 44px; }
  .lab-Page .lab-Body .wp-block-my-plugin-balloon-block .image-column{ width: 44px; height: 44px; }

  /* ブログカード: コンパクト（モック SP） */
  .lab-Page .lab-Body .blogcard a{
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 14px;
    padding: 14px 40px 14px 14px;
  }
  .lab-Page .blogcard_label i{ display: none; }
  .lab-Page .blogcard_title{
    margin-top: 4px;
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .lab-Page .blogcard_excerpt,
  .lab-Page .blogcard_meta .tg{ display: none; }
  .lab-Page .blogcard_meta{ margin-top: 6px; }
  .lab-Page .blogcard_meta time{ font-size: 12px; }
  .lab-Page .blogcard_arrow{ right: 14px; }
  .lab-Page .blogcard_arrow svg{ width: 22px; height: 12px; }

  .lab-Article .docs{ padding: 20px 16px 4px; margin-top: 44px; }
  .lab-Article .docs li{ grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .lab-Article .cite{ padding: 16px; }
  .lab-Article .who{ grid-template-columns: 56px minmax(0, 1fr); gap: 12px; }
  .lab-Article .who i,
  .lab-Article .who .who-img{ width: 56px; height: 56px; font-size: 16px; }
  .lab-Article .rel{ margin-top: 72px; }

  .lab-Page .lab-Bnr{
    right: 12px;
    left: 12px;
    bottom: 12px;
    width: auto;
  }
  .lab-Page .lab-Bnr .bnr-link{ padding: 12px 48px 12px 14px; }
  .lab-Page .lab-Bnr .bnr-sub{ display: none; }
}

/*-------------------------------------------------------------------*/
/* モーション低減                                                     */
/*-------------------------------------------------------------------*/
@media (prefers-reduced-motion: reduce){
  .lab-Page .lab-Bnr{ transform: none; }
  .lab-Page .lab-Body .wp-block-details > summary::after{ transition: none; }
}

/* 目次リンクなどで見出しへ飛んだとき、固定のヘッダー＋タブ帯に隠れないようにする（common.css の --nk-hd-h、lab/style.css の --lab-bar-h） */
.lab-Page .lab-Body :is(h2, h3, h4, h5, h6){ scroll-margin-top: calc(var(--lab-stick) + 20px); }
/* 目次（Easy Table of Contents）のリンク先の id は、見出しの中の空の span.ez-toc-section に付く。
   見出し側の scroll-margin-top は効かない（飛び先が見出しではなく span のため）ので、span にも同じ値を付ける。 */
.lab-Page .lab-Body .ez-toc-section{ scroll-margin-top: calc(var(--lab-stick) + 20px); }