.xb-oss-promos {
  width: min(1060px, calc(100% - 36px));
  margin: 22px auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  position: relative;
  z-index: 2;
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
}

.xb-oss-promo {
  min-height: 152px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid #cfe7e4;
  border-radius: 18px;
  color: #15343b;
  text-decoration: none;
  background-color: #f7fffd;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 42%, rgba(255,255,255,.34) 72%, rgba(255,255,255,.04) 100%),
    var(--xb-promo-image);
  background-position: center;
  background-size: cover;
  box-shadow: 0 12px 30px rgba(28, 91, 96, .11);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.xb-oss-promo:hover,
.xb-oss-promo:focus-visible {
  color: #15343b;
  text-decoration: none;
  transform: translateY(-2px);
  border-color: #59c8ba;
  box-shadow: 0 17px 36px rgba(28, 91, 96, .17);
}

.xb-oss-promo--catalog { --xb-promo-image: url('/images/kurage-oss-catalog-banner.jpg'); }
.xb-oss-promo--customize {
  --xb-promo-image: url('/images/kurage-vibe-oss-banner.jpg');
  border-color: #eadfc3;
}

.xb-oss-promo__copy { width: 69%; padding: 18px 0 18px 21px; }
.xb-oss-promo__kicker {
  display: block;
  margin-bottom: 6px;
  color: #087e79;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}
.xb-oss-promo strong {
  display: block;
  margin-bottom: 5px;
  color: #12323b;
  font-size: 18px;
  line-height: 1.42;
}
.xb-oss-promo__desc {
  display: block;
  color: #526a70;
  font-size: 11px;
  line-height: 1.55;
}
.xb-oss-promo__cta {
  display: inline-block;
  margin-top: 7px;
  color: #087e79;
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 720px) {
  .xb-oss-promos {
    width: min(100% - 28px, 620px);
    grid-template-columns: 1fr;
    margin: 14px auto;
    gap: 10px;
  }
  .xb-oss-promo { min-height: 132px; }
  .xb-oss-promo__copy { width: 72%; padding: 14px 0 14px 15px; }
  .xb-oss-promo strong { font-size: 16px; }
}

@media print {
  .xb-oss-promos { display: none !important; }
}

/* ===== Kurage関連サービスへの実リンク =====
   JS注入のバナー(.xb-oss-promos)は検索エンジンがリンクとして辿らないため、
   HTMLの実アンカーを別に置く。exbridge.jp から kurage / kappstore へ
   評価と流入の両方を渡すのが目的。 */
.xb-kurage-links{max-width:1120px;margin:34px auto;padding:20px 22px;border:1px solid #cfe5e3;border-radius:14px;background:linear-gradient(135deg,#e8faf6,#fff8e5);box-sizing:border-box}
.xb-kurage-links h2{margin:0 0 6px;font-size:19px;line-height:1.4;color:#12323b}
.xb-kurage-links > p{margin:0 0 14px;font-size:14px;line-height:1.8;color:#526a70}
.xb-kurage-links ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.xb-kurage-links li{background:#fff;border:1px solid #cfe5e3;border-radius:10px;padding:13px 15px}
.xb-kurage-links li a{display:block;font-weight:700;font-size:15px;color:#075f5d;text-decoration:underline;text-underline-offset:3px;margin-bottom:4px}
.xb-kurage-links li span{display:block;font-size:13px;line-height:1.7;color:#526a70}
@media(max-width:640px){.xb-kurage-links ul{grid-template-columns:1fr}}