/* =========================================================
   商品情報ページ専用CSS（item_info.css）
   対象ページ：item_info.html
========================================================= */

/* ----------------------------------------
   01. 商品カード全体をクリック可能にする
---------------------------------------- */
.rw-product-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* ----------------------------------------
   02. 商品カードのホバー効果
---------------------------------------- */
.rw-product-card-link:hover .rw-product-card {
  box-shadow: 0 3px 8px rgba(0,0,0,0.15);
  transform: translateY(-2px);
  transition: all 0.2s ease;
}

/* ----------------------------------------
   03. 商品カードの配置（背景＋余白調整）
---------------------------------------- */
.rw-product-grid {
  background: #f4f8f6; /* ほんのり淡いグリーン系（背景と差別化） */
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05); /* うっすら影で浮かせる */
  margin-bottom: 30px; /* 既存の余白は維持 */
}


/* ----------------------------------------
   04. 見出しの余白調整（商品情報ページ専用）
---------------------------------------- */
.article-block h2 {
  margin-bottom: 20px;
}