/* ===== 商品紹介（SP） ===== */
.n1-products {
  width: 92vw;
  margin: clamp(40px, 8vw, 64px) auto 20px;
  text-align: center;
}

.n1-products__ttl {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(21px, 5vw, 27px);
  color: #222;
  margin-bottom: 12px;
}

.n1-products__lead {
  font-size: 14px;
  color: #6B6B6B;
  line-height: 1.7;
  margin-bottom: 28px;
}

/* 横スクロールレール */
.n1-products__rail {
  display: flex;
  gap: 2px;                  /* ← カード間の最終隙間 */
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0 2px;
}
.n1-products__rail::-webkit-scrollbar { display: none; }
.n1-products__rail figure { margin: 0; }

/* ===== 2.5枚見せ設定 ===== */
.n1-products .n1-item {
  flex: 0 0 38%;             /* ← 約2.5枚見せ（38〜40%で微調整） */
  min-width: 38%;
  scroll-snap-align: start;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 3px 14px rgba(0,0,0,.05);
  overflow: hidden;
  transition: transform .25s ease;
}
.n1-products .n1-item:hover { transform: translateY(-2px); }

/* ===== 画像を小さめに ===== */
.n1-products .n1-item img {
  width: 100%;
  height: 135px;             /* ← 小さめ。調整範囲:130〜150px */
  object-fit: cover;
  margin: 0 0 8px 0;
}

/* キャプション部分 */
.n1-products .n1-item figcaption {
  font-size: 13px;
  line-height: 1.5;
  padding-bottom: 12px;
}
.n1-products .n1-item small {
  display: block;
  font-size: 11px;
  color: #6B6B6B;
}
/* ===== CTAコンテナ ===== */
.n1-cta{
  margin-top:44px;
  display:flex; justify-content:center; gap:14px; flex-wrap:wrap;
}

/* 共通ボタン */
.n1-btn{
  --btnPadY:14px; --btnPadX:24px;
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  padding:var(--btnPadY) var(--btnPadX);
  border-radius:999px;
  font-weight:700; font-size:15px; letter-spacing:.02em;
  text-decoration:none; border:1px solid transparent;
  transition:transform .12s ease, box-shadow .12s ease, background .25s ease, color .25s ease, border-color .25s ease;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);    /* Apple-liteの薄影 */
  will-change: transform;
}
.n1-btn:active{ transform:scale(.985) }

/* 主CTA：黒→ホバーで白反転＋赤アクセント */
.n1-btn--primary{
  background:#1f1f1f; color:#fff;
}
.n1-btn--primary:hover{
  background:#fff; color:#c93c3c; border-color:#c93c3c;
  box-shadow:0 6px 22px rgba(201,60,60,.15);
}

/* 副CTA：薄い枠＋柔らかい白。hoverで黒反転 */
.n1-btn--secondary{
  background:#fff; color:#2b2b2b; border-color:rgba(0,0,0,.22);
}
.n1-btn--secondary:hover{
  background:#2b2b2b; color:#fff; border-color:#2b2b2b;
}

/* 電話番号を2行にしない（自動改行防止） */
.n1-tel{ white-space:nowrap }

/* スマホ最適化：幅100%、文字や行高ゆったり */
@media (max-width: 768px){
  .n1-cta{ gap:10px; padding:0 4vw }
  .n1-btn{ width:100%; font-size:16px; --btnPadY:16px; --btnPadX:20px; }
}