/* EMMU 商品カード v1.1.7
   画像は max-width 260px / max-height 280px
   （APIの images.primary.large は正方形キャンバス＝白余白込みのため、
     手貼り時代の _AC_ トリミング画像より小さく見える。比率は保ったまま枠を拡大して補正）
   テーマCSS（.entry-content p / .entry-content a など＝詳細度0,0,1,1）に
   負けないよう、全ルールを .product-card 配下（0,0,2,0以上）に置き、
   視覚上重要なプロパティには !important を付与する。 */

.product-card{
  display:flex !important;
  gap:16px;
  align-items:flex-start;
  margin:26px 0 !important;
}
.product-card > a{flex:0 0 auto;text-decoration:none !important;border:0 !important;background:none !important}

.product-card img{
  max-width:260px !important;   /* ページ内の表示制約 */
  max-height:280px !important;  /* ページ内の表示制約 */
  width:auto !important;        /* 縦横比を保つために必須 */
  height:auto !important;       /* 同上 */
  border-radius:8px;
  display:block;
  margin:0 !important;
  box-shadow:none !important;
}

.product-card .amazon-link-box{
  flex:1 1 280px;
  background:#FAFAFA !important;
  border:1px solid #E0E0E0 !important;
  border-radius:8px;
  padding:16px !important;
  margin:0 !important;
}

.product-card .al-name{
  font-size:22px !important;   /* 価格と同じサイズに揃える */
  font-weight:700 !important;
  color:#444 !important;
  margin:0 0 8px !important;
  line-height:1.6 !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}

/* 価格ブロック */
.product-card .al-price-block{margin:0 0 14px !important;padding:0 !important;background:none !important;border:0 !important}
.product-card .al-price{
  font-size:22px !important;
  font-weight:800 !important;
  color:#B12704 !important;
  font-variant-numeric:tabular-nums;
  line-height:1.2 !important;
  margin:0 0 3px !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}
.product-card .al-asof{
  font-size:11px !important;
  font-weight:400 !important;
  color:#888 !important;
  line-height:1.6 !important;
  margin:0 !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}

.product-card .al-cta{margin:0 0 24px !important;padding:0 !important;background:none !important;border:0 !important;line-height:1 !important}
.product-card a.al-btn{
  display:inline-block !important;
  background:#FF9900 !important;
  color:#FFF !important;
  font-weight:700 !important;
  font-size:14px !important;
  line-height:1.4 !important;
  padding:11px 22px !important;
  border-radius:6px;
  border:0 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
.product-card a.al-btn:hover{background:#E88B00 !important;color:#FFF !important;text-decoration:none !important}
.product-card a.al-btn:visited{color:#FFF !important}
.product-card a.al-btn:focus-visible{outline:2px solid #B12704;outline-offset:2px}

.product-card .al-note{
  font-size:11px !important;
  font-weight:400 !important;
  color:#888 !important;
  line-height:1.7 !important;
  margin:8px 0 0 !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}

.product-card a.al-maker{
  font-size:12.5px !important;
  color:#1F7A4D !important;
  font-weight:700 !important;
  text-decoration:none !important;
  display:inline-block !important;
  margin:10px 0 0 !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}
.product-card a.al-maker:hover{text-decoration:underline !important;color:#1F7A4D !important}
.product-card a.al-maker:visited{color:#1F7A4D !important}

@media(max-width:600px){
  .product-card{flex-direction:column;gap:12px}
  .product-card > a{align-self:center}
  .product-card img{max-width:66vw !important;max-height:280px !important}
  .product-card .al-name{font-size:20px !important}
  .product-card .al-price{font-size:20px !important}
  .product-card a.al-btn{display:block !important;text-align:center !important}
}

/* ---- 比較表に差し込む最新価格（[emmu_price] / [emmu_price_note]） ----
   テーマの .entry-content td / p に負けないよう !important を付ける */
.emmu-price-cell{
  font-weight:700 !important;
  color:#B12704 !important;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.emmu-price-note{
  font-size:11px !important;
  font-weight:400 !important;
  color:#888 !important;
  line-height:1.7 !important;
  margin:6px 0 22px !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
}
