/* 中村忠三郎商店 PCトップページ 見やすさ改善用CSS */
/* 既存CSSの一番下に追加してください。既存の商品データや表示件数は変更しません。 */

/* 1. 商品名：読みやすい文字サイズと行間 */
.seller__section .product-list__name,
.recommend__section .product-list__name {
  display: block;
  font-size: 14px !important;
  line-height: 1.75 !important;
  letter-spacing: .015em;
  color: #453c34;
  overflow-wrap: anywhere;
  margin-top: 10px;
}

/* 2. 商品価格：名前との区別を明確に */
.seller__section .product-list__prices,
.recommend__section .product-list__prices {
  margin-top: 9px;
  line-height: 1.6;
}
.seller__section .product-list__price,
.recommend__section .product-list__price {
  font-size: 14px;
  font-weight: 600;
}

/* 3. 商品カード：縦の余白を確保 */
.seller__section .product-list__unit,
.recommend__section .product-list__unit {
  box-sizing: border-box;
  padding-bottom: 26px;
}
.seller__section .product-list__image,
.recommend__section .product-list__image {
  max-width: 100%;
  height: auto;
}

/* 4. 見出し：FAQと調和する生成り色・深緑 */
.seller__section .section__title-h2,
.recommend__section .section__title-h2,
.special__section .section__title-h2 {
  background: #f4f0e8;
  color: #385c49;
  border-left: 4px solid #9cae9a;
  border-bottom: none;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.6;
  padding: 12px 16px;
  margin-bottom: 20px;
}

/* 5. 特集画像：枠内に収める */
.special__section .special__item {
  box-sizing: border-box;
  padding: 0 9px;
  margin-top: 18px;
}
.special__section .special__item img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

/* 6. リンク操作：マウスを重ねた時にわかりやすく */
.seller__section .product-list__link:hover,
.recommend__section .product-list__link:hover,
.special__section .special__item a:hover {
  opacity: .88;
}

/* スマホ幅でも崩れにくい保険（PC用テンプレートが縮小表示された場合） */
@media (max-width: 767px) {
  .seller__section .product-list__name,
  .recommend__section .product-list__name { font-size: 13px !important; }
  .seller__section .section__title-h2,
  .recommend__section .section__title-h2,
  .special__section .section__title-h2 { font-size: 16px; }
}




#wrap {
        width:100%;
        display:-webkit-flexbox;
        display:-moz-flexbox;
        display:-ms-flexbox;
        display:-o-flexbox;
        display:flexbox;
        display:flex;
        justify-content:space-between;
        flex-wrap:wrap;
        align-items:center;
}

th,td{
  border:solid 0px #aaaaaa;
  color: #543f32; /*文字色*/
  background-color: #fbfaf5; /*背景色*/
  text-align: center;
}

.special__section--inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
} 

.special__item {
width: 50%;
margin-top: 20px;
} 

.special__item--text {
margin-top: 10px;
text-align: center;
}

sub-list.group-list {
margin-top: 30px
}

/* ==============================================
   中村忠三郎商店 PC版トップページ
   商品名・価格・商品間の余白の微調整（追記用）
   既存CSSの一番下に追加してください。
   ============================================== */

/* 今週のランキング・新入荷／再入荷のみに適用 */
.seller__section .product-list__name,
.recommend__section .product-list__name {
  display: block;
  font-size: 14px;
  line-height: 1.7;
  font-weight: 500;
  overflow-wrap: anywhere;
  margin-top: 10px;
  margin-bottom: 7px;
}

/* 価格を商品名より少し目立たせる */
.seller__section .product-list__prices,
.recommend__section .product-list__prices {
  margin-top: 8px;
  line-height: 1.6;
}
.seller__section .product-list__price,
.recommend__section .product-list__price {
  font-size: 14px;
  font-weight: 700;
}

/* 商品カード同士の縦の間隔を少し広げる */
.seller__section .product-list__unit,
.recommend__section .product-list__unit {
  margin-bottom: 24px;
}

/* 商品説明がある場合は本文より控えめに */
.seller__section .product-list__expl,
.recommend__section .product-list__expl {
  font-size: 12px;
  line-height: 1.6;
}

/* PC版トップページ：ランキング・新入荷の価格位置を揃えるための追記CSS */
/* 既存のCSSの一番下に追加してください。 */

/* 商品名に共通の表示スペースを確保し、価格の開始位置を揃えます */
.seller__section .product-list__name,
.recommend__section .product-list__name {
  display: block;
  min-height: 6.6em; /* 14px前後の文字で約4行分。必要に応じて調整 */
  box-sizing: border-box;
}

/* 商品説明がある場合も価格との間隔を自然にします */
.seller__section .product-list__prices,
.recommend__section .product-list__prices {
  margin-top: 8px;
}

/* スマートフォン幅では固定の高さを解除します（PC版への追記でも安全に） */
@media screen and (max-width: 767px) {
  .seller__section .product-list__name,
  .recommend__section .product-list__name {
    min-height: 0;
  }
}