.knb-app-cta { display: none; box-sizing: border-box; margin: 24px 0; padding: 20px; border: 1px solid #d9e2ec; border-radius: 14px; background: #f7fbff; color: #1f2937; text-align: left; }
html[data-knb-device="iphone"] .knb-app-cta,
html[data-knb-device="ipad"] .knb-app-cta,
html[data-knb-device="pc"] .knb-app-cta { display: block; }
.knb-app-cta__header { display: flex; gap: 14px; align-items: center; margin-bottom: 12px; }
.knb-app-cta__icon { flex: 0 0 56px; width: 56px; height: 56px; border-radius: 12px; }
.knb-app-cta__label { display: block; margin-bottom: 4px; font-size: 12px; color: #2457a6; font-weight: 700; }
.knb-app-cta .knb-app-cta__title { margin: 0; padding: 0; background: none; border: 0; font-size: 18px; font-weight: 700; line-height: 1.5; }
.knb-app-cta .knb-app-cta__body { margin: 0 0 16px; font-size: 15px; line-height: 1.8; }
.knb-app-cta .knb-app-cta__button { display: inline-block; box-sizing: border-box; padding: 12px 18px; min-height: 44px; border-radius: 8px; background: #2457a6; color: #fff; font-size: 15px; font-weight: 700; text-decoration: none; line-height: 1.4; }
.knb-app-cta__button:hover { background: #19427e; color: #fff; }
.knb-app-cta a:focus-visible, .knb-app-hub-link a:focus-visible { outline: 3px solid #1f2937; outline-offset: 4px; }
.knb-app-cta__desktop { display: none; }
html[data-knb-device="pc"] .knb-app-cta__desktop { display: flex; align-items: center; gap: 16px; margin-top: 16px; }
.knb-app-cta__qr { display: block; flex: 0 0 140px; }
.knb-app-cta__qr img { display: block; width: 140px; height: 140px; }
.knb-app-cta__caption { margin: 0; font-size: 14px; line-height: 1.7; }
.knb-app-hub-link { margin: 20px 0; padding: 12px 16px; border-left: 3px solid #2457a6; background: #f7fbff; font-size: 15px; }
.knb-app-label { display: inline-block; margin: 4px 0 4px 6px; padding: 2px 7px; border-radius: 4px; background: #e6f0ff; color: #2457a6; font-size: 11px; font-weight: 700; white-space: nowrap; vertical-align: middle; }
/* Put the hub introduction in the first view, before its decorative cover. */
.knb-genba-hub .eye-catch { display: none; }
@media (max-width: 600px) {
  .knb-app-cta { padding: 16px; }
  .knb-app-cta .knb-app-cta__title { font-size: 17px; }
  .knb-app-cta .knb-app-cta__button { width: 100%; text-align: center; }
}