/* ============================================================
   八頭司羊羹 橘屋：旧サイトのスキンに足した部分
   色はスキンの茶色（#8a7e56 / #7c714c）と生成り（#faf8f3）に合わせる
   ============================================================ */

/* ---- 読みもののカード一覧 ---------------------------------- */
.reading-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 20px 0 8px; }
.haik-article .reading-list { grid-template-columns: repeat(2, 1fr); }
.reading-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #ece7da;
  color: #333; text-decoration: none; transition: box-shadow .2s, transform .2s; }
.reading-card:hover, .reading-card:focus { color: #333; text-decoration: none;
  box-shadow: 0 6px 18px rgba(124,113,76,.15); transform: translateY(-2px); }
.reading-thumb { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #f3efe4; }
.reading-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.reading-body { display: flex; flex-direction: column; flex: 1; padding: 14px 16px 16px; }
.reading-label { font-size: 11px; letter-spacing: .2em; color: #8a7e56; margin-bottom: 6px; }
.reading-title { font-size: 16px; line-height: 1.6; font-weight: bold; color: #4a4330; margin-bottom: 8px; }
.reading-excerpt { font-size: 12.5px; line-height: 1.8; color: #777; flex: 1; }
.reading-more { margin-top: 10px; font-size: 12px; color: #7c714c; letter-spacing: .1em; text-align: right; }
.reading-all { text-align: right; margin: 6px 0 24px; }
.reading-all a { color: #7c714c; letter-spacing: .1em; border-bottom: 1px solid #c9bf9f; padding-bottom: 2px; }
.reading-all a:hover { text-decoration: none; opacity: .75; }
@media (max-width: 991px) { .reading-list { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 599px) {
  .reading-list, .haik-article .reading-list { grid-template-columns: 1fr; gap: 14px; }
  .reading-card { flex-direction: row; }
  .reading-thumb { flex: 0 0 38%; aspect-ratio: auto; }
  .reading-body { padding: 10px 12px; }
  .reading-title { font-size: 14.5px; margin-bottom: 4px; }
  .reading-excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12px; }
  .reading-more { display: none; }
}

/* ---- 記事ページ ------------------------------------------- */
.reading-article { max-width: 720px; margin: 0 auto 40px; }
.reading-head { text-align: center; margin: 10px 0 34px; padding-bottom: 26px; border-bottom: 1px solid #ece7da; }
.reading-head .reading-label { display: block; margin-bottom: 14px; }
.reading-head .reading-label a { color: #8a7e56; }
#body .reading-article h2.reading-h, .reading-article h2.reading-h { font-size: 24px; line-height: 1.6; color: #4a4330;
  border: none; background: none; padding: 0; margin: 0 0 16px; letter-spacing: .06em; text-align: center; }
.reading-lead { color: #777; font-size: 14px; line-height: 2; margin: 0; }
.reading-content { font-size: 15.5px; line-height: 2.1; color: #333; }
.reading-content p { margin: 0 0 1.4em; }
.reading-content h3 { font-size: 18px; color: #4a4330; margin: 2.4em 0 1em; padding: 0 0 0 12px;
  border: none; border-left: 3px solid #8a7e56; background: none; line-height: 1.6; }
.reading-content img { max-width: 100%; height: auto; border-radius: 2px; }
.reading-content ul { padding-left: 1.4em; margin-bottom: 1.4em; }
.reading-content a { color: #7c714c; text-decoration: underline; text-underline-offset: 3px; }
.reading-content small { color: #999; }

.reading-cta { margin: 48px 0 0; padding: 26px 22px; background: #faf8f3; border: 1px solid #ece7da; text-align: center; }
.reading-cta-title { font-size: 17px; font-weight: bold; color: #4a4330; letter-spacing: .1em; margin-bottom: 6px; }
.reading-cta p { margin-bottom: 8px; color: #666; font-size: 13px; }
.reading-cta-btns { margin-top: 14px !important; }
.reading-btn { display: inline-block; margin: 4px; padding: 10px 18px; border: 1px solid #8a7e56; color: #7c714c;
  background: #fff; letter-spacing: .08em; font-size: 13px; }
.reading-btn:hover, .reading-btn:focus { text-decoration: none; opacity: .8; color: #7c714c; }
.reading-btn.reading-btn-main { background: #8a7e56; color: #fff; }
.reading-cta a.reading-btn[href^="tel:"] { padding: 10px 18px; margin: 4px; }
.reading-more-h { font-size: 16px; color: #4a4330; letter-spacing: .15em; text-align: center; margin: 10px 0 0; }
@media (max-width: 599px) {
  #body .reading-article h2.reading-h, .reading-article h2.reading-h { font-size: 20px; }
  .reading-content { font-size: 15px; line-height: 2; }
  .reading-btn { display: block; margin: 8px 0; }
  .reading-cta a.reading-btn[href^="tel:"] { margin: 8px 0; }
}

/* ---- フッター --------------------------------------------- */
.site-footer { margin-top: 40px; padding: 30px 0 26px; background: #faf8f3; border-top: 1px solid #ece7da;
  text-align: center; color: #888; font-size: 12px; line-height: 1.9; }
.site-footer p { margin: 0 0 8px; }
.site-footer a { color: #7c714c; }
.site-footer-name { font-size: 14px; letter-spacing: .15em; }
.site-footer-name a { color: #4a4330; }
.site-footer-copy { margin-top: 12px !important; font-size: 10.5px; color: #aaa; letter-spacing: .05em; }
.sns-links a { display: inline-block; margin: 0 10px; padding: 2px 0; font-size: 12px; letter-spacing: .12em;
  color: #7c714c; border-bottom: 1px solid #d8d0b8; }
.sns-links a:hover { text-decoration: none; opacity: .7; }