/* EMMU 商品カード v1.5.0（v1.9.0 の新デザインはファイル末尾）
   画像は 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;
}

/* ---- 商品情報が24時間より古いときの代替リンク ---- */
.emmu-fallback-link{
  margin:20px 0 !important;
  padding:12px 16px !important;
  background:#FAFAFA !important;
  border:1px solid #E0E0E0 !important;
  border-radius:8px;
  font-size:15px !important;
  line-height:1.7 !important;
}
.emmu-fallback-link a{
  font-weight:700 !important;
  color:#B12704 !important;
  text-decoration:none !important;
}
.emmu-fallback-link a:hover{text-decoration:underline !important}
.emmu-fallback-note{
  display:block;
  font-size:11px !important;
  color:#888 !important;
  font-weight:400 !important;
  margin-top:4px;
}

/* =====================================================================
   v1.9.0 商品カード（.emmu-card）と、画像・価格を出せないときの横長カード（.emmu-fallback-card）
   上の .product-card / .emmu-fallback-link のルールは、記事に手貼りされた旧カードと
   ページキャッシュに残った旧HTMLのために残してある。
   テーマCSSに負けないよう、上と同じく見た目に効くプロパティには !important を付ける。
   ===================================================================== */

/* ---- 共通のボタン（オレンジ地に黒文字。白文字より読みやすい） ---- */
.emmu-card a.emmu-az-btn,
.emmu-fallback-card a.emmu-az-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
  box-sizing:border-box !important;
  min-height:50px;
  padding:0 24px !important;
  background:#FFA41C !important;
  color:#0F1111 !important;
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1.3 !important;
  letter-spacing:.02em;
  text-decoration:none !important;
  border:0 !important;
  border-bottom:3px solid #E08A00 !important;
  border-radius:10px;
  box-shadow:none !important;
  transition:background-color .15s ease, transform .15s ease;
}
.emmu-card a.emmu-az-btn:hover,
.emmu-fallback-card a.emmu-az-btn:hover{background:#FA8900 !important;color:#0F1111 !important;text-decoration:none !important;transform:translateY(-1px)}
.emmu-card a.emmu-az-btn:active,
.emmu-fallback-card a.emmu-az-btn:active{transform:translateY(1px)}
.emmu-card a.emmu-az-btn:visited,
.emmu-fallback-card a.emmu-az-btn:visited{color:#0F1111 !important}
.emmu-card a.emmu-az-btn:focus-visible,
.emmu-fallback-card a.emmu-az-btn:focus-visible{outline:3px solid #0F1111;outline-offset:2px}
.emmu-card a.emmu-az-btn svg,
.emmu-fallback-card a.emmu-az-btn svg{width:18px;height:18px;flex:0 0 auto;transition:transform .15s ease}
.emmu-card a.emmu-az-btn:hover svg,
.emmu-fallback-card a.emmu-az-btn:hover svg{transform:translateX(3px)}

/* ---- 共通の文字まわり ---- */
.emmu-card p,
.emmu-fallback-card p{margin:0 !important;padding:0 !important;background:none !important;border:0 !important}
.emmu-card .ec-maker,
.emmu-fallback-card .efc-maker{font-size:13px !important;font-weight:400 !important;color:#666 !important;line-height:1.4 !important;letter-spacing:.02em}
.emmu-card .ec-name a,
.emmu-fallback-card .efc-name a{color:#222 !important;text-decoration:none !important;border:0 !important;background:none !important}
.emmu-card .ec-name a:hover,
.emmu-fallback-card .efc-name a:hover{color:#C45500 !important;text-decoration:underline !important}
.emmu-card a.ec-official,
.emmu-fallback-card a.efc-official{
  display:inline-block !important;
  margin:6px 0 0 !important;
  padding:0 !important;
  font-size:12.5px !important;
  font-weight:700 !important;
  line-height:1.5 !important;
  color:#1F7A4D !important;
  text-decoration:none !important;
  background:none !important;
  border:0 !important;
}
.emmu-card a.ec-official:hover,
.emmu-fallback-card a.efc-official:hover{text-decoration:underline !important;color:#1F7A4D !important}
.emmu-card a.ec-official:visited,
.emmu-fallback-card a.efc-official:visited{color:#1F7A4D !important}
.emmu-card .ec-note,
.emmu-fallback-card .efc-note{font-size:11px !important;font-weight:400 !important;color:#888 !important;line-height:1.7 !important}

/* ---- 画像・価格があるときのカード ---- */
.emmu-card,
.emmu-card *,
.emmu-fallback-card,
.emmu-fallback-card *{box-sizing:border-box}
.emmu-card{
  display:flex !important;
  gap:22px;
  align-items:center;
  margin:28px 0 !important;
  padding:20px 22px !important;
  background:#FFF !important;
  border:1px solid #E3E6E8 !important;
  border-radius:12px;
  box-shadow:0 1px 3px rgba(15,17,17,.06) !important;
}
.emmu-card a.ec-media{
  flex:0 0 200px;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:200px;
  height:200px;
  padding:0 !important;
  background:#FFF !important;
  border:0 !important;
  overflow:hidden;
  text-decoration:none !important;
}
.emmu-card a.ec-media img{
  max-width:100% !important;
  max-height:100% !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  border-radius:0;
  box-shadow:none !important;
  display:block;
  transition:transform .2s ease;
}
.emmu-card a.ec-media:hover img{transform:scale(1.04)}
.emmu-card .ec-body{flex:1 1 auto;min-width:0}
.emmu-card .ec-name{font-size:21px !important;font-weight:700 !important;line-height:1.45 !important;margin:2px 0 0 !important}
.emmu-card .ec-price-block{margin:14px 0 0 !important}
.emmu-card .ec-price{
  font-size:28px !important;
  font-weight:800 !important;
  color:#B12704 !important;
  line-height:1.2 !important;
  font-variant-numeric:tabular-nums;
}
.emmu-card .ec-asof{font-size:11px !important;color:#888 !important;line-height:1.6 !important;margin:3px 0 0 !important}
.emmu-card .ec-cta{margin:16px 0 0 !important;line-height:1 !important}
.emmu-card a.emmu-az-btn{width:100%;max-width:340px}
.emmu-card .ec-note{margin:10px 0 0 !important}

/* ---- 画像・価格を出せないときの横長カード ---- */
.emmu-fallback-card{margin:24px 0 !important;padding:0 !important;background:none !important;border:0 !important}
.emmu-fallback-card .efc-row{
  display:flex !important;
  align-items:center;
  gap:14px;
  padding:14px 16px !important;
  background:#FFF !important;
  border:1px solid #E3E6E8 !important;
  border-radius:12px;
  box-shadow:0 1px 3px rgba(15,17,17,.06) !important;
}
.emmu-fallback-card .efc-icon{
  flex:0 0 44px;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  background:#F1F6DA !important;
  color:#4A5A00 !important;
}
.emmu-fallback-card .efc-icon svg{width:22px;height:22px}
.emmu-fallback-card .efc-body{flex:1 1 auto;min-width:0}
.emmu-fallback-card .efc-name{font-size:17px !important;font-weight:700 !important;line-height:1.45 !important;margin:1px 0 0 !important}
.emmu-fallback-card a.efc-official{margin:4px 0 0 !important}
.emmu-fallback-card a.emmu-az-btn{flex:0 0 auto;min-height:46px;padding:0 18px 0 20px !important;font-size:15px !important;border-radius:999px;white-space:nowrap}
.emmu-fallback-card .efc-note{margin:6px 0 0 4px !important}

@media(max-width:600px){
  .emmu-card{flex-direction:column;align-items:stretch;gap:14px;padding:16px !important}
  .emmu-card a.ec-media{align-self:center;flex:0 0 auto;width:min(220px, 66vw);height:min(220px, 66vw)}
  .emmu-card .ec-name{font-size:19px !important}
  .emmu-card .ec-price{font-size:26px !important}
  .emmu-card a.emmu-az-btn{display:flex !important;max-width:none}

  .emmu-fallback-card .efc-row{flex-wrap:wrap;padding:14px !important}
  .emmu-fallback-card .efc-body{flex:1 1 0}
  .emmu-fallback-card .efc-name{font-size:16px !important}
  .emmu-fallback-card a.emmu-az-btn{display:flex !important;flex:1 1 100%;min-height:50px;font-size:16px !important;border-radius:10px}
}

@media(prefers-reduced-motion:reduce){
  .emmu-card a.emmu-az-btn, .emmu-fallback-card a.emmu-az-btn,
  .emmu-card a.emmu-az-btn svg, .emmu-fallback-card a.emmu-az-btn svg,
  .emmu-card a.ec-media img{transition:none !important;transform:none !important}
}