/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 17 2025 | 08:05:46 */
/* === hi-ko: 指定記事だけ適用 === */
body.is-topics-compare .ba-compare{
  position:relative;max-width:980px;margin:24px auto;
  aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#f2f2f2
}
body.is-topics-compare .ba-compare img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;pointer-events:none
}
body.is-topics-compare .ba-compare__after{clip-path:inset(0 0 0 50%)}
body.is-topics-compare .ba-compare__handle{
  position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);
  width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25)
}
body.is-topics-compare .ba-compare__knob{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.25);
  z-index:1;
  /* 「＋」を背景で描画（干渉に強い） */
  --ba-plus: rgba(0,0,0,.75);
  background:
    linear-gradient(var(--ba-plus), var(--ba-plus)) center/2px 18px no-repeat,
    linear-gradient(var(--ba-plus), var(--ba-plus)) center/18px 2px no-repeat,
    #fff;
}
body.is-topics-compare .ba-compare__label{
  position:absolute;z-index:3;top:10px;left:10px;padding:.35em .6em;border-radius:6px;
  font-size:12px;line-height:1;background:rgba(0,0,0,.55);color:#fff
}
body.is-topics-compare .ba-compare__label--after{left:auto;right:10px}
body.is-topics-compare .ba-compare input[type="range"]{position:absolute;inset:0;opacity:0}

@media (max-width:480px){
  body.is-topics-compare .ba-compare__knob{
    background:
      linear-gradient(var(--ba-plus), var(--ba-plus)) center/2px 20px no-repeat,
      linear-gradient(var(--ba-plus), var(--ba-plus)) center/20px 2px no-repeat,
      #fff;
  }
}