@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.1
*/

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

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

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

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


/************************************
** ここから下は 2026-11-11 にAIが追加したデザイン（gyagyagya）
** 元に戻すときは、この見出しから下を消せばよい
************************************/
:root {
  --gy-purple: #2d0845;
  --gy-purple-2: #4a1a6b;
  --gy-navy: #1a2a4e;
  --gy-gold: #ffd700;
  --gy-gold-dark: #b8860b;
  --gy-bg: #f4f2f8;
  --gy-text: #222;
}

/* 全体の背景 */
body.body { background-color: var(--gy-bg); }

/* ヘッダー：サムネイルと同じ紫→紺のグラデーション */
body .header-container,
body .header {
  background: linear-gradient(135deg, #0a0a2e 0%, var(--gy-purple) 55%, var(--gy-navy) 100%);
}
body .header .site-name-text,
body .header .site-name-text-link,
body .header .site-name-text-link:hover { color: #fff; }
body .header .tagline { color: rgba(255, 255, 255, 0.8); }

/* グローバルメニュー */
body #navi,
body .navi,
body .navi-in > ul,
body .navi-in > ul > li { background-color: var(--gy-navy); }
body .navi-in a,
body .navi-in > ul > li > a { color: #fff; }
body .navi-in > ul > li > a:hover {
  background-color: rgba(255, 215, 0, 0.12);
  color: var(--gy-gold);
  box-shadow: inset 0 -3px 0 var(--gy-gold);
}
body .navi-in > ul .sub-menu,
body .navi-in > ul .sub-menu li { background-color: var(--gy-purple); }

/* 記事一覧のカード */
body .entry-card-wrap,
body .related-entry-card-wrap {
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(45, 8, 69, 0.08);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
body .entry-card-wrap:hover,
body .related-entry-card-wrap:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(45, 8, 69, 0.16);
  background-color: #fff;
}
body .entry-card-title,
body .related-entry-card-title { color: var(--gy-purple); }
body .cat-label {
  background-color: var(--gy-purple);
  color: var(--gy-gold);
  border: 1px solid var(--gy-gold);
  border-radius: 3px;
}

/* 記事のタイトル */
body .article .entry-title { color: var(--gy-purple); }

/* 本文の見出し */
body .article h2 {
  background: linear-gradient(135deg, var(--gy-purple) 0%, var(--gy-navy) 100%);
  color: #fff;
  border: none;
  border-left: 6px solid var(--gy-gold);
  border-radius: 6px;
  padding: 0.7em 0.9em;
}
body .article h3 {
  background: none;
  color: var(--gy-purple);
  border: none;
  border-left: 5px solid var(--gy-purple);
  border-bottom: 2px solid #e3dcec;
  padding: 0.4em 0.7em;
}
body .article h4 {
  border: none;
  border-bottom: 2px dotted var(--gy-gold-dark);
  padding: 0.3em 0.2em;
}

/* 本文のリンク */
body .entry-content a { color: #3b2a9b; }
body .entry-content a:hover { color: var(--gy-gold-dark); }

/* 表：見出しの行がない表も読みやすく */
body .entry-content table th { background-color: #efe9f6; color: var(--gy-purple); }
body .entry-content table tr:nth-child(even) td { background-color: #faf8fc; }

/* サイドバーの見出し */
body .sidebar h3,
body .widget-sidebar-title {
  background: none;
  color: var(--gy-purple);
  border: none;
  border-bottom: 3px solid var(--gy-purple);
  box-shadow: 0 3px 0 var(--gy-gold);
  padding: 0.4em 0.2em;
}

/* フッター */
body .footer { background-color: var(--gy-navy); }
body .footer,
body .footer a,
body .footer .copyright,
body .navi-footer-in a { color: rgba(255, 255, 255, 0.85); }

/* ページの先頭へ戻るボタン */
body .go-to-top-button {
  background-color: var(--gy-purple);
  color: var(--gy-gold);
}

/* スマホ */
@media screen and (max-width: 480px) {
  body .article h2 { font-size: 20px; }
  body .entry-card-wrap { border-radius: 8px; }
}