/*
Theme Name: SHOBI Co., Ltd. Child
Theme URI: https://shobi.co.jp
Description: Child theme for SHOBI Co., Ltd.（子テーマ）
Author: SHOBI Co., Ltd.
Author URI: https://shobi.co.jp
Template: shobi.co.jp
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shobi-child
*/
/*
 * このファイルは子テーマの識別に必要なヘッダー情報のみを含みます。
 * 実際の上書き・追加スタイルはここ、もしくは assets/css 以下に記述します。
 */
/* ==================================================
   Google ReCapthca非表示設定
================================================== */
.grecaptcha-badge {
  visibility: hidden;
}
.footer_recaptcha {
  font-size: 0.7em;
}
/* ==================================================
   記事の装飾設定
================================================== */
/* 見出し4：装飾用ダッシュ(親設定は維持)
.l-article__body h4 {
  position: relative;
  padding-left: 1.4em;
}*/
/*.l-article__body h4::before {
  content: "ー";
  position: absolute;
  left: 0;
  font-weight: 500;
}*/
/* 見出し5：新規*/
.l-article__body h5 {
  margin-top: 2.5em;
  margin-bottom: 1em;
  font-size: 1em;
  font-weight: 600;
  color: var(--color-text-sub);
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
}
/* 左に小さな区切り記号 
.l-article__body h5::before {
    content: "●";
    font-size: 0.6em;
    opacity: 0.8;
}*/
/*
----------------------------------------------------
引用符の設定（コーテーション追加）
----------------------------------------------------
*/
.l-article__body blockquote:not(:first-child) {
  margin-top: 1em;
}
.l-article__body blockquote {
  position: relative;
  margin-inline: 0;
  padding: 32px 24px 24px;
  border-radius: 12px;
  background: white; /*var(--color-bg-alt)*/
  border: 1px solid #ddd;
}
.l-article__body blockquote p {
  padding-left: 1rem;
  padding-right: 1rem;
}
/* 引用符（開始） */
.l-article__body blockquote::before {
  content: "“";
  position: absolute;
  top: 12px;
  left: 16px;
  font-size: 2rem;
  line-height: 1;
  color: var(--color-text-muted);
  opacity: 0.6;
}
/* 引用符（終了）※不要なら消してOK */
.l-article__body blockquote::after {
  content: "”";
  position: absolute;
  bottom: 12px;
  right: 16px;
  font-size: 2rem;
  line-height: 1;
  color: var(--color-text-muted);
  opacity: 0.6;
}
.l-article__body figure figcaption {
  font-size: 0.8em;
}
/*
----------------------------------------------------
引用以外のブロック装飾設定（プロフィールと同じ）
----------------------------------------------------
*/
.l-article .blockdeco {
  display: grid;
  gap: 8px;
  padding: 24px 20px;
  border-radius: 12px;
  background: var(--color-bg-alt);
}
/*
----------------------------------------------------
記事カードリンク（内部／外部）
----------------------------------------------------
*/
.c-postcard {
  display: flex;
  gap: 16px;
  padding: 16px;
  margin: 24px 0;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  background: #fff;
  color: inherit;
  text-decoration: none;
  transition: box-shadow .2s ease, transform .2s ease;
}
.c-postcard:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, .08);
  transform: translateY(-1px);
}
/* --------------------------------
画像
-------------------------------- */
.c-postcard__img {
  flex: 0 0 140px; /* 内部・外部 共通サイズ */
  max-width: 140px;
}
.c-postcard__img img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
  object-fit: cover;
}
/* --------------------------------
本文
-------------------------------- */
.c-postcard__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
/* タイトル（リンクに見せない） */
.c-postcard__title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  color: #2a2a2a;
  margin: 0;
}
/* メタディスクリプション */
.c-postcard__desc {
  font-size: 14px;
  line-height: 1.7;
  color: #555;
  margin: 0;
}
/* --------------------------------
外部リンク用ラベル
-------------------------------- */
.c-postcard__external {
  margin-top: 6px;
  font-size: 12px;
  color: #777;
}
/* --------------------------------
内部／外部の差分（将来拡張用）
-------------------------------- */
.c-postcard--internal {
  /* 現状は共通 */
}
.c-postcard--external {
  /* 現状は共通 */
}
/* --------------------------------
親テーマの a:hover を完全に打ち消す
-------------------------------- */
.l-article__body a.c-postcard, .l-article__body a.c-postcard:hover, .l-article__body a.c-postcard:focus, .l-article__body a.c-postcard:active {
  text-decoration: none !important;
  color: inherit;
}
.l-article__body a.c-postcard *, .l-article__body a.c-postcard:hover * {
  text-decoration: none !important;
  color: inherit;
}
/* --------------------------------
スマホ対応
-------------------------------- */
@media (max-width: 640px) {
  .c-postcard {
    flex-direction: column;
  }
  .c-postcard__img {
    max-width: 100%;
  }
}
/* ==================================================
目次（TOC）最終完全安定版
================================================== */
/* 目次ボックス */
.c-toc {
  max-width: 720px;
  margin: 40px auto;
  padding: 24px 32px;
  background: #f7f7f7;
  border-radius: 12px;
}
/* タイトル中央 */
.c-toc__title {
  text-align: center;
  font-weight: 600;
  margin-bottom: 20px;
}
/* UL / LI は構造のみ */
.c-toc ul, .c-toc li {
  list-style: none !important;
  margin: 0;
  padding: 0;
}
/* marker 完全無効 */
.c-toc li::marker {
  content: none !important;
}
/* ==================================================
リンク共通
================================================== */
.c-toc a {
  display: block;
  text-align: left;
  color: #000 !important;
  text-decoration: none;
}
.c-toc a:hover {
  color: #898989 !important;
  text-decoration: none !important;
  text-decoration-color: currentColor;
}
/* ==================================================
共通：記号レーン
================================================== */
.c-toc__lv2, .c-toc__lv3 {
  position: relative;
  line-height: 1.6;
}
/* ==================================================
見出し2 ▶
================================================== */
.c-toc__lv2 {
  position: relative;
  margin: 12px 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.6;
}
.c-toc__lv2::before {
  content: "▶";
  position: absolute;
  left: 0;
  top: 0.9em;
  font-size: 9px;
  line-height: 1;
}
.c-toc__lv2 > a {
  padding-left: 20px;
}
/* ==================================================
見出し3 ー（完全一致版）
================================================== */
.c-toc__lv3 {
  position: relative;
  margin: 6px 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}
.c-toc__lv3::before {
  content: "ー";
  position: absolute;
  left: 20px;
  top: 0.5em;
  font-size: 12px;
  line-height: 1;
  color: #898989 !important;
}
.c-toc__lv3 > a {
  padding-left: 40px;
  color: #5A5A5A !important;
}
/* 見出し4lv4以下は完全非表示 */
nav.c-toc ul.c-toc__list li.c-toc__lv4, nav.c-toc ul.c-toc__list li.c-toc__lv5, nav.c-toc ul.c-toc__list li.c-toc__lv6 {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
/* 念のため a も無効化 */
nav.c-toc ul.c-toc__list li.c-toc__lv4 > a, nav.c-toc ul.c-toc__list li.c-toc__lv5 > a, nav.c-toc ul.c-toc__list li.c-toc__lv6 > a {
  display: none !important;
  pointer-events: none !important;
}

/* ======================================================
   SHOBI Article Table Style
   完全最終安定版（幅ブレ防止）
====================================================== */

/* ======================================
   通常テーブル（3列まで）
====================================== */
.l-article__content table {
  border-collapse: collapse;
  width: 100% !important;
  table-layout: fixed; /* %幅を安定させる */
  margin: 2rem 0;
  font-size: 0.95rem;
  color: #333;
}

.l-article__content table td {
  width: auto !important; /* TinyMCEインラインwidth無効化 */
  padding: 0.75rem;
  border: 1px solid #ddd;
  vertical-align: middle;
  line-height: 1.6;
  background-color: transparent;
  white-space: normal;
  word-break: break-word;
}

/* 1列目30%固定 */
.l-article__content table td:first-child {
  width: 30% !important;
}

/* 見出し行 */
.l-article__content table tr:first-child td {
  background-color: #f7f7f7;
  font-weight: 600;
  text-align: center;
}

/* ======================================
   スクロールテーブル（4列以上）
====================================== */
.l-article__content .table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 2rem 0;
}

.l-article__content .table-scroll table {
  width: max-content !important;   /* ← 自然幅に戻す */
  min-width: 100%;                 /* でも画面よりは小さくしない */
  table-layout: auto !important;   /* ← autoに戻す */
}

/* インラインwidth無効化 */
.l-article__content .table-scroll table td {
  width: auto !important;
}

/* 1列目だけ固定 */
.l-article__content .table-scroll table td:first-child {
  min-width: 120px !important;
  white-space: normal;
  word-break: break-word;
}

/* 2列目以降は横スクロール前提 */
.l-article__content .table-scroll table td:not(:first-child) {
  white-space: nowrap;
}

/* ======================================
   モバイル微調整
====================================== */
@media (max-width: 767px) {
  .l-article__content table {
    font-size: 0.9rem;
  }
}

/* ==================================================
   記事内ボタン
   ================================================== */
.l-article__content a.article-button {
  display: block;
  width: fit-content;
  margin: 40px auto 5px;
  background: #000 !important;
  color: #fff !important;
  padding: 14px 32px !important;
  border-radius: 40px !important;
  font-weight: bold !important;
  transition:transform .25s cubic-bezier(.4, 0, .2, 1), box-shadow .25s cubic-bezier(.4, 0, .2, 1);
}
.l-article__content a.article-button:hover {
  transform: scale(.98);
  text-decoration: none !important;
}
.l-article__content a.article-button::after {
  content: "";
  display: inline-block;
  width: 9px;
  height: 15px;
  margin-left: 12px;
  background: url("https://www.shobi.co.jp/cms/wp-content/themes/shobi.co.jp/assets/images/icon/arrow-md-white.svg") center / contain no-repeat;
}

/* ==============================
   YouTube 強制フル幅（公開画面）
============================== */

.l-article iframe[width],
.l-article iframe[height] {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
}

/* ===============================
   CODE装飾
   =============================== */
.l-article pre code {
  display: block;
  white-space: pre;
  background: #1e1e1e;
  color: #f8f8f2;
  padding: 20px;
  border-radius: 6px;
  overflow-x: auto;
  font-family: Consolas, Monaco, monospace;
}