@charset "UTF-8";
/* CSS Document */
/* =========================
   spec.htm（ご提案できる三味線）専用
   ========================= */

/* ページ全体の余白バランス */
.store-page .spec {
  margin-top: 8px;
}

/* タイトル周りを締める */
.store-page .spec-header .page-title {
  margin-bottom: 8px;
}
.store-page .spec-header .page-lead {
  margin-top: 0;
  max-width: 70ch; /* 読みやすい行長 */
}

/* 各ブロックを“カード”にして視認性UP */
.store-page .spec-block {
  margin: 18px 0;
  padding: 14px 14px 10px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 14px;
  background: #fffdfa;
}

/* セクションタイトルの余白調整（広がりすぎ防止） */
.store-page .spec-block .section-title {
  margin: 0 0 10px;
  padding-bottom: 8px;
}

/* リストを“情報設計”として整える */
.store-page .instrument-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.store-page .instrument-list li {
  padding: 10px 0;
  border-bottom: 1px solid rgba(0,0,0,.08);
  line-height: 1.85;
}
.store-page .instrument-list li:last-child {
  border-bottom: none;
}

/* リンクの見せ方：本文の邪魔をしない */
.store-page .instrument-list a {
  text-decoration: none;
  font-weight: 600;
}
.store-page .instrument-list a:hover {
  text-decoration: underline;
}

/* “—” の見た目を整える（改行されても汚くなりにくい） */
.store-page .instrument-list .sep {
  margin: 0 .35em;
  opacity: .6;
}

/* 章タイトルが続くと重いので、軽くする（任意） */
.store-page .spec-block:nth-of-type(1) { background: #fffdf6; }
.store-page .spec-block:nth-of-type(2) { background: #fffaf5; }
.store-page .spec-block:nth-of-type(3) { background: #fdfaf6; }
.store-page .spec-block:nth-of-type(4) { background: #fffdf8; }
.store-page .spec-block:nth-of-type(5) { background: #fffaf7; }

/* スマホ：カードの余白を少し詰める */
@media (max-width: 768px){
  .store-page .spec-block{
    padding: 12px 12px 8px;
    border-radius: 12px;
  }
  .store-page .instrument-list li{
    padding: 9px 0;
  }
}

/* =========================
   Sansuien Typeface Override
   渋め・工芸・活字寄り
   ========================= */

.store-page,
.archive-page,
#main,
#wrapper {
  font-family:
    "Hiragino Mincho ProN",
    "Yu Mincho",
    "游明朝",
    "MS PMincho",
    serif;
}

/* 見出しはさらに重厚に */
.store-page h1,
.store-page h2,
.store-page h3,
.store-page .page-title,
.store-page .section-title {
  font-family:
    "Hiragino Mincho ProN",
    "Yu Mincho",
    "游明朝",
    "MS PMincho",
    serif;
  letter-spacing: .03em;
}

/* 本文は角ゴ寄りに戻す（丸ゴ禁止） */
.store-page p,
.store-page li,
.store-page .archive-note,
.store-page .page-lead {
  font-family:
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    "游ゴシック",
    "Meiryo",
    sans-serif;
}

/* =========================
   Sansuien Color System
   渋め・和紙・古木
   ========================= */

/* ページ背景（和紙） */
.store-page,
.archive-page,
body {
  background-color: #f2efe9; /* 和紙色 */
}

/* メイン枠（少し濃い和紙） */
.store-page #wrapper,
.archive-page #wrapper {
  background-color: #f8f6f2;
  border: 1px solid #e0dbd2;
}

/* 見出し */
.store-page .page-title,
.store-page .section-title,
.archive-page .page-title,
.archive-page .section-title {
  color: #3f2e23; /* 墨寄りの茶 */
  border-color: #b9a58a;
}

/* 本文 */
.store-page,
.store-page p,
.store-page li {
  color: #3a3028;
}

/* 薄い補足テキスト */
.store-page .note,
.store-page .page-lead-small,
.store-page .archive-meta {
  color: #6e6358;
}

/* カード背景 */
.store-page .feature-card,
.store-page .archive-item,
.store-page .consult-card,
.store-page .voice-box {
  background-color: #f5f1ea;
  border-color: #d7cdbc;
}

/* 罫線 */
.store-page hr,
.store-page .section-title,
.store-page .faq-item {
  border-color: #cdbda7;
}

/* リンク（渋い藍） */
.store-page a {
  color: #355c7d;
}
.store-page a:hover {
  color: #1f3f5a;
}

.store-page #wrapper {
  background-color: #f3efe7;
}

/* =========================
   Spec Block – 渋い工房台帳
   ========================= */

.spec-block {
  background-color: #ede7dc;   /* 明るすぎない和紙 */
  border: 1px solid #c8b8a0;   /* 古木の縁 */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
}

.spec-block h2,
.spec-block h3 {
  color: #3a2a1f;
}

.spec-block p,
.spec-block li {
  color: #3d342c;
}

.spec-block {
  background-color: #e6dfd3;
  border-color: #b9a98e;
}

.spec-header p{
  margin-top: 10px;
  max-width: 70ch;
}

.spec-block{
  margin-top: 16px;
  padding: 16px 18px;
}

.instrument-list{
  margin: 10px 0 0;
  padding-left: 1.1rem;
}

.instrument-list li{
  margin: 6px 0;
}

.sep{
  margin: 0 6px;
  opacity: .7;
}