@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/*20260313 h2見出しのデザインを変更*/
.entry-content h2,
.entry-content h2::before,
.entry-content h2::after {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: none !important;
}

.entry-content h2 {
  font-size: clamp(1.25rem, 4vw, 1.625rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.3;
  color: #333333 !important;
  margin: 2.5rem 0 0.75rem;
  padding: 0 0 0.5rem;
  display: block;
  -webkit-text-fill-color: #333333;
  border-bottom: 3px solid !important;
  border-image: linear-gradient(90deg, #0071e3, #34aadc) 1 !important;
}

/*20260315 h3見出しのデザインを変更*/
.entry-content h3,
.entry-content h3::before,
.entry-content h3::after {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: none !important;
}

.entry-content h3 {
  font-size: clamp(1.1rem, 3vw, 1.3rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
  color: #333333 !important;

  margin: 1.8rem 0 0.6rem;
  padding-left: 0.9rem;

  border-left: 4px solid #c7c7cc !important;
}

/*20260321 目次のデザインを変更*/
/* ===== 目次ボックス（中央配置＋上品な箱感） ===== */
body .entry-content .toc {
  max-width: 640px;
  margin: 32px auto;
  padding: 16px 18px;

  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04) !important;
}

/* ===== 内側の不要な線・装飾を全削除 ===== */
body .entry-content .toc *,
body .entry-content .toc-list,
body .entry-content .toc-list li,
body .entry-content .toc-content {
  border: none !important;
  box-shadow: none !important;
}

/* ===== タイトル（黒帯完全除去） ===== */
body .entry-content .toc-title {
  background: none !important;
  color: #6b7280 !important;
  padding: 0 !important;

  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;

  margin-bottom: 12px !important;

  display: flex !important;
  justify-content: space-between;
  align-items: center;
}

/* Apple風ラベル */
body .entry-content .toc-title::before {
  content: "CONTENTS";
  font-size: 10px;
  color: #9ca3af;
  margin-right: 8px;
}

/* ===== アコーディオンアイコン ===== */
body .entry-content .toc-title::after {
  content: "[開く]";
  font-size: 13px;
  color: #9ca3af;
  transition: transform 0.2s ease;
}

/* 開閉状態 */
body .entry-content .toc.open .toc-title::after {
  content: "−";
}

/* ===== リスト ===== */
body .entry-content .toc-list {
  padding-left: 0 !important;
  margin: 0 !important;
}

/* ===== 各項目 ===== */
body .entry-content .toc-list li {
  list-style: none !important;
  margin: 0 !important;
}

/* ミニマル区切り線 */
body .entry-content .toc-list li + li {
  border-top: 1px solid #eef2f7 !important;
}

/* ===== リンク ===== */
body .entry-content .toc-list a {
  display: block !important;
  padding: 10px 8px !important;

  text-decoration: none !important;
  color: #111827 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;

  border-radius: 8px;
  transition: all 0.15s ease;
}

/* ホバー（静かな強調） */
body .entry-content .toc-list a:hover {
  background: #f3f4f6 !important;
  transform: translateX(2px);
}

/* クリック時 */
body .entry-content .toc-list a:active {
  background: #e5e7eb !important;
}

/* ===== スマホ最適化 ===== */
@media screen and (max-width: 768px) {
  body .entry-content .toc {
    max-width: 100%;
    margin: 24px 0;
    padding: 14px;
  }

  body .entry-content .toc-list a {
    font-size: 13px !important;
    padding: 10px 4px !important;
  }
}