@charset "utf-8";
/* ============================================================
   renewal.css — 新規取扱品目 追加スタイル（既存 base.css は非改変）
   ============================================================ */

/* 7項目に増えた PC メニューの横幅調整（元の 16.66% → 14.28%） */
.menu ul li { width: 14.28%; }
@media (max-width: 766px){
  .menu ul li { width: 16.66%; }
}

/* ---- NEW LINEUP セクション ---- */
.newlineup{
  padding:60px 0 50px;
  background:#ffffff;
  border-top:3px solid #565656;
}
.newlineup h2 span{
  background:url(../img/common/bg_h2.png) no-repeat center top;
}
.newlineup .lead{
  text-align:center;
  color:#565656;
  font-size:15px;
  line-height:2.1;
  max-width:760px;
  margin:0 auto 36px;
}
.nb-grid{
  display:flex;
  flex-wrap:wrap;
  gap:26px;
  justify-content:center;
}
.nb-card{
  width:300px;
  background:#ffffff;
  border:1px solid #e2e2e2;
  box-shadow:0 6px 22px rgba(0,0,0,0.06);
  display:flex;
  flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.nb-card:hover{
  transform:translateY(-6px);
  box-shadow:0 14px 32px rgba(0,0,0,0.12);
}
.nb-card .nb-thumb{ display:block; line-height:0; }
.nb-card .nb-thumb img{ width:100%; height:auto; display:block; }
.nb-card .nb-body{ padding:22px 24px 26px; display:flex; flex-direction:column; flex:1; }
.nb-card h3{
  font-size:20px;
  font-weight:700;
  color:#1f1f1f;
  margin:0 0 6px;
  line-height:1.5;
  text-align:center;
}
.nb-card .nb-en{
  font-family:'Roboto Condensed',sans-serif;
  font-size:11px;
  letter-spacing:3px;
  color:#9a9a9a;
  text-align:center;
  display:block;
  margin-bottom:14px;
}
.nb-card p{
  font-size:13px;
  line-height:1.95;
  color:#444;
  margin:0 0 20px;
  flex:1;
}
.nb-card .nb-link{
  align-self:center;
  text-decoration:none;
}
.nb-card .nb-link .btn{
  padding:9px 26px;
  font-size:13px;
  border-radius:0;
}
.nb-tag{
  display:inline-block;
  font-family:'Roboto Condensed',sans-serif;
  font-size:11px;
  letter-spacing:2px;
  background:#9b2d2d;
  color:#fff;
  padding:3px 12px;
  border-radius:20px;
  margin:0 0 18px;
}
.newlineup .center{ text-align:center; }
@media (max-width:766px){
  .nb-card{ width:100%; max-width:360px; }
  .newlineup{ padding:36px 0 30px; }
}

/* ---- 詳細ページ ---- */
.nb-detail{ padding:0 0 10px; }
.nb-detail .nb-hero{
  margin:0 0 30px;
  border:3px solid #565656;
  line-height:0;
  background:#f8f4ee;
}
.nb-detail .nb-hero img{ width:100%; height:auto; display:block; }
.nb-detail .nb-lead{
  font-size:16px;
  line-height:2.1;
  color:#333;
  margin:0 0 30px;
}
.nb-detail h3{ margin-top:10px; }
.nb-detail .nb-points{
  list-style:none;
  padding:0;
  margin:24px 0 30px;
}
.nb-detail .nb-points li{
  background:#f8f9f5;
  border-left:4px solid #565656;
  padding:16px 20px;
  margin:0 0 12px;
  line-height:1.9;
  font-size:14px;
}
.nb-detail .nb-points li b{ color:#1f1f1f; }
.nb-detail .nb-back{ text-align:center; margin:34px 0 0; }
.nb-detail .nb-other{
  margin:40px 0 0;
  border-top:1px dotted #565656;
  padding-top:26px;
}
.nb-detail .nb-other h4{ font-size:18px; color:#565656; margin:0 0 16px; }
.nb-detail .nb-other ul{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:12px; }
.nb-detail .nb-other ul li a{
  display:inline-block;
  text-decoration:none;
  border:1px solid #ccc;
  padding:8px 18px;
  font-size:13px;
  color:#1f1f1f;
}
.nb-detail .nb-other ul li a:hover{ background:#565656; color:#fff; }

/* 飯豊町アクセント */
.nb-tag.indigo{ background:#2c4a7c; }
.nb-tag.pork{ background:#b85c5c; }
