/* ================= サブヘッダー（全ページ共通部品）・ブログ ================= */
/* PC：3Dナビ帯の下半分にサブヘッダー色を敷く（トップと同じ構造）。色は --yy-sub-bg */
body.yy-has-subheader .yf-pc .nav3d-band { background: var(--yy-sub-bg, #EAF3E1); }
/* コンテンツ部の地は白（bodyの既定 #eceef0 を上書き） */
body.yy-has-subheader { background: #ffffff; }
.yy-subheader {
  background: var(--yy-sub-bg, #EAF3E1);
  text-align: center;
  padding: 58px 16px 0;
}
.yy-subtitle {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-weight: 700; font-size: 26px; letter-spacing: .14em;
  color: var(--yy-sub-title, #55A64B); margin: 0 0 38px;
}
.yy-catnav {
  display: flex; justify-content: center; align-items: flex-end; gap: 52px;
  padding-bottom: 24px;
}
.yy-subheader.news { padding-top: 66px; }
.yy-subheader.news .yy-subtitle { margin-bottom: 26px; }
.yy-subheader.news .yy-subtitle2 {
  font-family: 'Noto Sans JP', sans-serif; font-weight: 400;
  font-size: 19px; letter-spacing: .3em; color: #7c7c7c;
  margin: 0; padding-bottom: 62px;
}
.yy-subtitle2 {
  font-family: 'Zen Maru Gothic', sans-serif; font-weight: 700;
  font-size: 17px; letter-spacing: .12em; color: #8a8577;
  margin: -14px 0 0; padding-bottom: 44px;
}
/* 吹き出しPNG（top/assets/areaXX.png＝白バルーン＋尻尾込み）をそのまま使用 */
.yy-chip {
  display: block; line-height: 0;
  transition: transform .3s ease, opacity .3s ease;
}
.yy-chip img { height: 58px; width: auto; display: block; }
.yy-chip.off { opacity: .8; }
.yy-chip.on, .yy-chip.off:hover {
  opacity: 1;
  filter: drop-shadow(0 5px 7px rgba(60, 100, 40, .18));
  animation: yyChipFloat 3.2s ease-in-out infinite;
}
@keyframes yyChipFloat {
  0%, 100% { transform: scale(1.2) translateY(0); }
  50%      { transform: scale(1.2) translateY(-4px); }
}

/* ---- カテゴリの1行解説（サブナビ帯の直下） ---- */
.yy-cat-desc {
  margin: 0; text-align: center;
  font-family: 'Zen Maru Gothic', sans-serif; font-weight: 700;
  font-size: 18px; letter-spacing: .12em; line-height: 1.9;
  color: #54C3F1;
  padding: 62px 20px 0;
}
.yy-cat-desc + .yy-archive { padding-top: 52px; }

/* ---- アーカイブ ---- */
.yy-archive { max-width: 1180px; margin: 0 auto; padding: 64px 24px 48px; }
.yy-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 72px 80px; }
.yy-grid.cols4 { grid-template-columns: repeat(4, 1fr); gap: 28px 24px; }
.yy-card { display: block; text-decoration: none; color: #333; }
.yy-card-img {
  display: block; width: 100%; aspect-ratio: 1 / 0.92; object-fit: cover;
  box-sizing: border-box; border: 3px solid #54C3F1; border-radius: 22px; background: #eef5f9;
  transition: transform .25s ease;
}
.yy-card:hover .yy-card-img { transform: translateY(-3px); }
.yy-card-title {
  margin: 14px 2px 0; font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 15px; font-weight: 700; line-height: 1.55; color: #333;
}
.yy-more-wrap { text-align: center; margin: 52px 0 10px; }
.yy-more {
  display: inline-block; background: #fff; border: 1.5px solid #b9c6b3; border-radius: 999px;
  padding: 10px 34px; font-size: 14px; color: #556; cursor: pointer; text-decoration: none;
  font-family: inherit; transition: background .2s ease;
}
.yy-more:hover { background: #f2f7ef; }

/* ---- 記事ページ ---- */
.yy-article { max-width: 780px; margin: 0 auto; padding: 56px 20px 8px; }
.yy-hero img { display: block; width: 80%; margin: 0 auto 0 0; border-radius: 6px; }  /* 横幅80%・左揃え */
.yy-date { margin-top: 52px; font-size: 14px; color: #708465; letter-spacing: .18em; }
.yy-title {
  display: inline-block; margin: 16px 0 52px; padding: 0;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 28px; font-weight: 700; letter-spacing: .08em; color: #6E8B60; line-height: 1.55;
}
/* タイトル幅なりの太めアンダーライン（両端は丸く） */
.yy-title::after {
  content: ''; display: block; width: 100%; height: 6px; margin-top: 16px;
  border-radius: 3px; background: #7D9B6E;
}
.yy-content { font-family: 'Zen Maru Gothic', sans-serif; font-weight: 400; font-size: 16.5px; line-height: 2.05; color: #333; }
.yy-content p { margin: 0 0 1.6em; }
.yy-content img { max-width: 100%; height: auto; border-radius: 4px; }
.yy-content figure { margin: 0 0 1.6em; }
/* Gutenberg/クラシックの回り込み対応（テーマ側で未定義だと崩れる） */
.yy-content .alignleft  { float: left;  margin: 6px 28px 18px 0; max-width: 55%; }
.yy-content .alignright { float: right; margin: 6px 0 18px 28px; max-width: 55%; }
.yy-content .aligncenter { display: block; float: none; margin-left: auto; margin-right: auto; }
.yy-content::after { content: ''; display: block; clear: both; }  /* floatを記事内で完結させる */
@media (max-width: 700px) {
  .yy-content .alignleft, .yy-content .alignright { float: none; margin: 0 auto 18px; max-width: 100%; }
}
.yy-content figure figcaption { font-size: 12.5px; color: #888; margin-top: 6px; }
.yy-content h2, .yy-content h3 { color: #3c6b32; line-height: 1.6; margin: 2em 0 .8em; }
.yy-content a { color: #2e9fd4; }
.yy-related { max-width: 1120px; margin: 48px auto 40px; padding: 40px 20px 0; border-top: 1px solid #d9e4d3; }
.yy-related-title { font-size: 18px; font-weight: 700; color: #3c6b32; letter-spacing: .08em; margin: 0 0 26px; }

/* ---- SP ---- */
@media (max-width: 900px) {
  .yy-subtitle { font-size: 21px; margin-bottom: 26px; }
  /* SPナビ帯（2026-09-02 文一さん設計）：現在以外の吹き出し＝2列2段、現在の吹き出し＝最下段に単独・130%・浮遊＋影。
     タップ時の入れ替えアニメは frame/catnav.js（FLIP）→ 遷移 */
  .yy-catnav { flex-wrap: wrap; gap: 10px 14px; padding-bottom: 23px; align-items: center; }   /* 帯下端との間隔（拡大分のはみ出し込みで約8px・2026-09-02） */
  .yy-chip { padding: 4px 4px; display: flex; justify-content: center; box-sizing: border-box; }   /* border-box：paddingを幅に含めないと2列目が折り返す */
  .yy-chip img { height: 44px; }   /* 吹き出しPNGは文字焼き込み */
  .yy-chip.off { flex: 0 0 calc(50% - 10px); }                   /* 2列（gap14pxぶんを確実に引く） */
  .yy-chip.on  { flex: 0 0 100%; order: 99; margin: 22px 0 6px; position: relative; z-index: 2; }   /* 最下段に単独（上段との間隔は拡大分を見込む） */
  .yy-chip.on { animation-name: yyChipFloatSp; }
  .yy-chip.off:hover { animation: none; transform: none; filter: none; }   /* タッチ端末のhover残りを無効化 */
  .yy-catnav.swapping .yy-chip { animation: none !important; transition: transform .42s cubic-bezier(.22,.8,.3,1); will-change: transform; }
  .yy-catnav.swapping .yy-chip.on { filter: drop-shadow(0 5px 7px rgba(60, 100, 40, .18)); }
  .yy-grid, .yy-grid.cols4 { grid-template-columns: repeat(2, 1fr); gap: 30px 18px; }
  .yy-archive, .yy-article { padding-top: 34px; } 
  .yy-subheader { padding-top: 38px; }
  .yy-cat-desc { font-size: 15px; padding-top: 38px; letter-spacing: .08em; }
  .yy-cat-desc + .yy-archive { padding-top: 30px; }
  .yy-title { font-size: 21px; }
}

@keyframes yyChipFloatSp {
  0%, 100% { transform: scale(1.8) translateY(0); }   /* 現在の吹き出し＝180%（2026-09-02 130→150→180） */
  50%      { transform: scale(1.8) translateY(-4px); }
}

/* ---- 読み込み中の控えめローダー ---- */
.yy-more.loading { color: transparent; position: relative; pointer-events: none; }
.yy-more.loading::after {
  content: ''; position: absolute; inset: 0; margin: auto;
  width: 17px; height: 17px; border-radius: 50%;
  border: 2.5px solid #dfe8da; border-top-color: #7CC15E;
  animation: yySpin .8s linear infinite;
}
@keyframes yySpin { to { transform: rotate(360deg); } }

/* ヘッダーロゴ＝トップへのリンク（装飾なし） */
.site-header .logo a { display: block; line-height: 0; }