/* =========================================================
   NOMADIT 商品リンクカード
   もしもアフィリエイト「かんたんリンク」restyle CSS
   ---------------------------------------------------------
   使い方：WordPress 管理画面 →「外観」→「カスタマイズ」
          →「追加CSS」に、この内容をまるごと貼り付けて公開。
   ※ かんたんリンクのコード（HTML）は変更しません。
   ※ 既存記事のかんたんリンクも、すべて自動でこの見た目になります。
   ========================================================= */

/* カード本体 */
.easyLink-box{
  display:flex !important;
  align-items:center;
  gap:22px;
  max-width:100% !important;
  width:auto !important;
  margin:30px 0 !important;
  padding:22px !important;
  box-sizing:border-box;
  background:#fff !important;
  border:1px solid #E7EAEE !important;
  border-radius:16px !important;
  box-shadow:0 10px 30px -22px rgba(25,35,47,.45) !important;
  font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif !important;
}

/* 商品画像 */
.easyLink-img{
  width:150px !important;
  height:150px !important;
  flex:0 0 150px !important;
  margin:0 !important;
  border-radius:12px;
  overflow:hidden;
  background:#F4F5F7;
  position:relative;
}
.easyLink-img-box{ margin:0 !important; height:100% !important; }
.easyLink-img-pht{
  object-fit:contain !important;
  width:100% !important;
  height:100% !important;
  padding:8px;
  box-sizing:border-box;
}
.easyLink-arrow-left, .easyLink-arrow-right{ opacity:.5; }
.easyLink-arrow-left:hover, .easyLink-arrow-right:hover{ opacity:1; }

/* テキスト情報 */
.easyLink-info{ flex:1 1 auto !important; min-width:0; margin:0 !important; padding:0 !important; }
.easyLink-info-maker{ font-size:12px !important; color:#9099A6 !important; font-weight:500 !important; margin:0 0 4px !important; }
.easyLink-info-name{ margin:0 0 6px !important; }
.easyLink-info-name a{
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1.55 !important;
  color:#19232F !important;
  text-decoration:none !important;
}
.easyLink-info-name a:hover{ color:#E0852A !important; }
.easyLink-info-model{ font-size:11px !important; color:#AEB6C0 !important; margin:0 0 14px !important; }
/* 型番（A3063 等）を消したい場合は、↑の行を次に置き換え：
   .easyLink-info-model{ display:none !important; } */

/* ストアボタン */
.easyLink-info-btn{ display:flex !important; flex-wrap:wrap; gap:10px !important; margin:0 !important; }
.easyLink-info-btn img{ display:none !important; } /* ボタン横の小さなロゴ画像を非表示にしてスッキリ */
.easyLink-info-btn a{
  flex:1 1 0 !important;
  min-width:118px;
  text-align:center;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:11px 14px !important;
  border-radius:9px !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:#fff !important;
  text-decoration:none !important;
  box-sizing:border-box;
  line-height:1.2;
  transition:transform .12s ease, filter .12s ease;
}
.easyLink-info-btn a:hover{ transform:translateY(-1px); filter:brightness(1.06); }

/* ボタン色（各ストアのイメージカラー） */
.easyLink-info-btn-amazon{ background:#FF9900 !important; }
.easyLink-info-btn-rakuten{ background:#BF0000 !important; }
.easyLink-info-btn-yahoo{   background:#FF0033 !important; }

/* スマホ表示：画像を上・ボタンを縦並びに */
@media (max-width:560px){
  .easyLink-box{ flex-direction:column !important; align-items:stretch; padding:18px !important; }
  .easyLink-img{ width:100% !important; flex-basis:auto !important; height:190px !important; }
  .easyLink-info-btn a{ flex-basis:100% !important; }
}