/*
Theme Name: AFFINGER Child
Template: affinger
Description: AFFINGER6 対応
Version: 20241128-1
*/

/* =========================
   GajeNext 共通フォント＆サイズ設定
   ========================= */
:root {
  /* 書体（フォントファミリー） */
  --gajenext-font: "Noto Sans JP", -apple-system, BlinkMacSystemFont,
                   "Segoe UI", "Hiragino Sans", "Yu Gothic",
                   "メイリオ", sans-serif;

  /* 基本の文字サイズ（本文ベース） */
  --gajenext-fz-base: 16px;       /* ← 全体を少し大きく/小さくしたい時はここだけ変更 */

  /* 記事本文内の見出しサイズ（目安） */
  --gajenext-fz-h2: 1.6rem;       /* h2 見出し */
  --gajenext-fz-h3: 1.3rem;       /* h3 見出し */

  /* 太さ（font-weight） */
  --gajenext-fw-base: 400;        /* 通常の本文用 */
  --gajenext-fw-heading: 600;     /* 見出しやタイトル用（少し太め） */
}

/* ===== Global Navi（PC）グラデーション ===== */
#navi {
  background: linear-gradient(to right, #eefaff, #51c8ff);
}
#navi ul li a {
  background-color: transparent;
  color: #0b3756;
}

/* ホバー＆現在のページ */
#navi ul li a:hover,
#navi ul li.current-menu-item > a,
#navi ul li.current_page_item > a {
  background-color: rgba(255, 255, 255, 0.35);
  color: #00395f;
}

/* ==============================
   記事本文内の見出しサイズ（h2 / h3）
   ============================== */

/* 記事本文の h2 */
.entry-content h2 {
  font-size: var(--gajenext-fz-h2);
  font-weight: var(--gajenext-fw-heading);
  margin-top: 2.4em;   /* セクションの頭にゆとり */
  margin-bottom: 0.8em;/* 見出しと本文の間 */
}

/* 記事本文の h3 */
.entry-content h3 {
  font-size: var(--gajenext-fz-h3);
  font-weight: var(--gajenext-fw-heading);
  margin-top: 2.0em;   /* h2 より少し控えめ */
  margin-bottom: 0.6em;
}

/* ==============================
    見出し（H1〜H6）
    ============================== */

/* 記事本文の見出しフォントをPC・スマホ共通でNoto Sans JPに統一 */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.entry-content h1 span,
.entry-content h2 span,
.entry-content h3 span,
.entry-content h4 span,
.entry-content h5 span,
.entry-content h6 span,
.entry-content h1 a,
.entry-content h2 a,
.entry-content h3 a,
.entry-content h4 a,
.entry-content h5 a,
.entry-content h6 a,
.entry-content .wp-block-heading,
.entry-content .wp-block-heading span,
.entry-content .wp-block-heading a {
  font-family: var(--gajenext-font) !important;
  font-weight: var(--gajenext-fw-heading) !important;
  letter-spacing: 0.04em;
}


/* ==============================
   GajeNext ヘッダーメニュー用フォント
   ============================== */
#navi a,
#navi span,
#s-navi a,
#s-navi span,
header .menu a,
header nav a {
  font-family: var(--gajenext-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;   /* スペース少し広めでナビっぽく */
}

/* 新着カードなどの記事タイトルを少し太めに */
#content .entry-title,
#content .post-title,
#content .st-card-title {
  font-weight: var(--gajenext-fw-heading) !important;
  letter-spacing: 0.04em;
}

/* ==============================
   GajeNext 本文・カード・スマホメニュー用フォント統一
============================== */

/* ==============================
   新着カードや本文まわりのフォント（テキスト系のみ）
   ============================== */

#content,
#content p,
#content li,
#content dt,
#content dd,
#content th,
#content td,
#content a,
#content strong,
#content em,
#content .entry-title,
#content .entry-title a,
#content .post-card-title,
#content .post-card-title a,
#content .st-cardbox,
#content .st-post,
#content .st-post p,
#content .st-post li,
#content .st-post a,
#content .st-post span,
#content .st-post strong,
#content .st-post em {
  font-family: var(--gajenext-font) !important;
}

/* スマホのスライドメニュー（ハンバーガーを開いた中身）のフォント */
/*
#s-navi,
#s-navi *,
#s-navi-overlay,
#s-navi-overlay * {
  font-family: var(--gajenext-font) !important;
}
*/

/* ==============================
   GajeNext 全体フォント最優先ルール（最後に書く）
   ============================== */

body {
  font-family: var(--gajenext-font);
  font-size: var(--gajenext-fz-base) !important;  /* ← ベースサイズを変数化 */
  font-weight: var(--gajenext-fw-base);           /* ← 本文の太さを変数化 */
  line-height: 1.9;
  letter-spacing: 0.02em;
}

/* ==============================
   GajeNext：記事スライドショー用フォント
   （Tedy2 EX / AFFINGER6 EX）
   ============================== */

/* ヘッダーの丸いスライドショー全体 */
.st-circle-slider,
.st-circle-slider .st-slide-item,
.st-circle-slider .st-slide-item * {
  font-family: var(--gajenext-font) !important;
}

/* スライドのタイトル部分（h3 / h5リンク） */
.st-circle-slider .st-slide-item h3 a,
.st-circle-slider .st-slide-item h5 a {
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* スライドの抜粋テキスト */
.st-circle-slider .st-slide-item p {
  font-size: 13px !important;
  line-height: 1.6 !important;
}

/* ==============================
   ヘッダー記事スライド：タイトル用フォント
   ============================== */

.post-slide-title,
.post-slide-title a {
  font-family: var(--gajenext-font) !important;
  font-size: 16px !important;   /* ← 大きすぎたら 15px / 小さければ 18px に調整 */
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}

/* ================================
   AFFINGERアイコン（stsvg）用フォントを明示
   ================================ */
.st-fa[class^="st-svg-"],
.st-fa[class*=" st-svg-"] {
  font-family: "stsvg" !important;
  font-style: normal;
  font-weight: normal;
}

.st-fa[class^="st-svg-"]::before,
.st-fa[class*=" st-svg-"]::before,
.st-fa[class^="st-svg-"]::after,
.st-fa[class*=" st-svg-"]::after {
  font-family: "stsvg" !important;
}
/* ==============================
   全デバイス共通：ヘッダーのロゴ＆キャッチコピーを常に表示
   ============================== */
body #header-l .sitename,
body #header-l .sitename a,
body #header-l .sitename img,
body #header-l .descr,
body #header-l p.descr {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}

/* =======================================
   GajeNext：スマホ記事ページのヘッダーロゴ強制表示（投稿ページ限定）
   ======================================= */
@media screen and (max-width: 767px) {

  /* 親コンテナが消されているケースへの保険 */
  body.single #headbox,
  body.single #headbox #header-l,
  body.single #headbox #header-l #st-text-logo {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
  }

  /* ロゴ画像・サイト名・キャッチコピー本体 */
  body.single #headbox #header-l .sitename,
  body.single #headbox #header-l .logo,
  body.single #headbox #header-l .descr,
  body.single #headbox #header-l p.descr {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    margin-top: 0;
  }
}

/* ==============================
   GajeNext：トップページ新着記事ブロックのフォント統一
   （body.home 限定）
   ============================== */

/* 「新着記事」ラベル */
body.home .n-entry-t .n-entry {
  font-family: var(--gajenext-font);
  font-weight: 700;
  letter-spacing: 0.08em;
  font-size: 0.95rem;
}

/* 新着カードのタイトル */
body.home .post-card .post-card-title,
body.home .post-card .post-card-title a {
  font-family: var(--gajenext-font);
  font-weight: var(--gajenext-fw-heading);
  font-size: 1rem;             /* 必要なら 0.95rem / 1.05rem などに微調整可 */
  letter-spacing: 0.04em;
}

/* 新着カードの抜粋テキスト */
body.home .post-card .post-card-excerpt,
body.home .post-card .post-card-excerpt p {
  font-family: var(--gajenext-font);
  font-size: 0.9rem;
  line-height: 1.8;
}
/* ==============================
   GajeNext：フッターロゴ＆キャッチコピー整列
   ============================== */

/* ロゴ＋テキスト全体を中央寄せ */
#st-footer-logo {
  text-align: center;
  margin: 1.5rem auto 1rem;
  font-family: var(--gajenext-font);
}

/* ロゴ画像を中央に */
#st-footer-logo #st-icon-logo img.footer-icon-size {
  display: block;
  margin: 0 auto 0.5rem;
  height: auto;
}

/* テキスト部分も中央寄せ */
#st-footer-logo #st-text-logo {
  text-align: center;
}

/* サイト名（ガジェネクスト / GajeNext） */
#st-footer-logo .footerlogo {
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  margin-bottom: 0.3rem;
}

/* キャッチコピー（リンク含めて） */
#st-footer-logo .footer-description,
#st-footer-logo .footer-description a {
  display: inline-block;
  font-size: 0.85rem;
  line-height: 1.6;
  text-decoration: none;
}

/* ホバー時だけ軽く下線を付ける（任意） */
#st-footer-logo .footer-description a:hover {
  text-decoration: underline;
}

/* ==============================
   GajeNext：フッターのNEWとの間に余白（PCのみ）
   ============================== */
@media screen and (min-width: 960px) {
  /* 右側のNEWブロックを少しだけ内側に寄せる */
  .footer-wbox .footer-r {
    padding-left: 20px;  /* 足りなければ 24px, 32px に増やしてOK */
  }
}

/* ==============================
   GajeNext：スマホ見出しフォント統一
   ============================== */
@media screen and (max-width: 767px) {
  body h1,
  body h2,
  body h3,
  body h4,
  body h5,
  body h6 {
    font-family: var(--gajenext-font), system-ui, -apple-system,
                 BlinkMacSystemFont, "Segoe UI", "Hiragino Sans",
                 "Yu Gothic", "メイリオ", sans-serif !important;
    font-weight: var(--gajenext-fw-heading) !important;
    letter-spacing: 0.04em;
  }
}

/* ==============================
   GajeNext：フッターキャッチコピーの幅調整
   ============================== */

/* ロゴ全体は中央寄せ（念のため維持） */
#footer .footer-l #st-text-logo {
  text-align: center;
}

/* キャッチコピーの箱にだけ幅を持たせて中央に配置 */
#footer .footer-l #st-text-logo .footer-description {
  max-width: 230px;  /* 220px → 230px に少し広げる */
  margin: 0 auto;
}

/* キャッチコピー文字のサイズと行間を調整 */
#footer .footer-l #st-text-logo .footer-description a {
  display: inline;
  font-size: 10px;   /* 少し小さくして改行位置を調整 */
  line-height: 1.8;
}



/* ==============================
   TOP：NEWお知らせバーを背景透過＆枠なしにする
   ============================== */

/* NEWバー全体のボックス感を消す */
#topnews-box .rss-bar {
  background: transparent !important; /* テーマ側の背景色を打ち消す */
  border: none !important;            /* 枠線を消す */
  box-shadow: none !important;        /* 影がついていた場合も消す */
}

/* ラベル部分（NEWテキスト）のボックス感も消す */
#topnews-box .rss-bar .news-ca {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0;
  padding-right: 0;
}

/* ==============================
   PC用：フッターのメニューリンク文字サイズ
   （スマホには影響させない）
   ============================== */
@media screen and (min-width: 960px) {
  #footer .footermenubox .footermenust a {
    font-size: 14px;
  }
}

/**********************************************
 * 本文まわりの共通調整（フォントサイズ・行間はカスタマイザー側で設定）
 **********************************************/

/* PC用（タブレット～PC幅）の見出し余白 */
@media (min-width: 769px) {

  /* h2：章見出し */
  .entry-content h2 {
    margin-top: 2.6em;
    margin-bottom: 1.4em;
  }

  /* h3：小見出し */
  .entry-content h3 {
    margin-top: 2.0em;
    margin-bottom: 1.0em;
  }
}

/* スマホ用の見出し余白 */
@media (max-width: 768px) {

  /* h2：少しコンパクトに */
  .entry-content h2 {
    margin-top: 1.8em;
    margin-bottom: 0.8em;
  }

  /* h3：h2より気持ち軽めに */
  .entry-content h3 {
    margin-top: 1.6em;
    margin-bottom: 0.7em;
  }

  /* h4：さらに控えめ */
  .entry-content h4 {
    margin-top: 1.4em;
    margin-bottom: 0.6em;
  }
}

/**********************************************
 * 特定の段落だけ余白なしにしたいとき用
 **********************************************/
.entry-content p.no-margin-bottom {
  margin-bottom: 0;
}

/* PCワイド時：本文エリアを中央寄せ */
@media (min-width: 1060px) {
  .entry-content {
    margin-left: auto;
    margin-right: auto;
  }
}

/* 本番用：段落と箇条書きの字間だけ少し広げる */
.entry-content p,
.entry-content li {
  letter-spacing: 0.04em !important;
}

/* リスト項目の中にある p の上下余白をなくす
   → <li><p>〜</p></li> でも二重の行間にならないようにする */
.entry-content li > p {
  margin-top: 0;
  margin-bottom: 0;
}

/* リスト内に紛れ込んだ <br> を強制的に非表示にする
   → ● と文字の間に「謎の1行」が空くのを防ぐ */
.entry-content li br {
  display: none !important;
}

/**********************************************
 * 箇条書き（リスト）の行間・ブロック間調整
 **********************************************/

/* 各項目どうしの間隔（番号リスト・黒丸リスト共通：PC基準） */
.entry-content ol li,
.entry-content ul li {
  margin-bottom: 0.9em !important;  /* 0.8〜1.0emあたりで微調整OK */
}

/* リストブロック全体の下に余白 */
.entry-content ol,
.entry-content ul {
  margin-bottom: 1.4em !important;
}

/* スマホ時の箇条書きの行間を少しだけ詰める */
@media (max-width: 768px) {
  .entry-content ul li,
  .entry-content ol li {
    margin-bottom: 0.4em;   /* 好みで 0.3〜0.6em の間で調整OK */
  }
}

/* スマホ時：見出し2〜4の上下パディングを少しだけ控えめに */
@media screen and (max-width: 599px) {

  /* 見出し2（濃い紺のバー） */
  h2.wp-block-heading {
    padding-top: 0.45em !important;
    padding-bottom: 0.45em !important;
  }

  /* 見出し3（オレンジバー＋グラデ） */
  h3.wp-block-heading {
    padding-top: 0.4em !important;
    padding-bottom: 0.4em !important;
  }

  /* 見出し4（右端折り返しの水色） */
  h4.wp-block-heading {
    padding-top: 0.4em !important;
    padding-bottom: 0.4em !important;
  }

  /* AFFINGER独自の .st-h2 帯を使っている見出し用の微調整 */
  .entry-content .st-h2 {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
  }
}