@charset "UTF-8";

/* ===================================================
   SP用 スクロール追従スティッキーCTA（下部固定）
   - モバイル優先（PCでは非表示）
   - iOS safe-area 対応
   - 画面下に固定し、本文が隠れないよう余白を確保
=================================================== */

:root{
  --sp-sticky-cta-height: 92px;
}

/* PC/タブレットは非表示（必要ならブレークポイント調整） */
.sp-sticky-cta{
  display: none;
}

@media screen and (max-width: 768px){
  /* 固定バーのぶん、ページ末尾が隠れないように下余白を確保 */
  body.home,
  body.front-page{
    padding-bottom: calc(var(--sp-sticky-cta-height) + env(safe-area-inset-bottom, 0px));
  }

  .sp-sticky-cta{
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(255,255,255,0.94);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-top: 1px solid rgba(199, 206, 216, 0.7);
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
  }

  .sp-sticky-cta__inner{
    max-width: 520px;
    margin: 0 auto;
    display: block;
    align-items: center;
  }

  /* .kv2_btn に寄せつつ、固定バー内に収まるよう微調整 */
  .sp-sticky-cta__btn{
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    height: 64px;
  }

  .sp-sticky-cta__btn:hover{
    opacity: 0.9;
  }

  .sp-sticky-cta__btn .kv2_btn_content{
    left: 10px;
  }

  .sp-sticky-cta__btn .kv2_btn_main{
    font-size: 15px;
    line-height: 22px;
  }

  .sp-sticky-cta__btn .kv2_btn_sub{
    font-size: 12px;
  }

  /* 既存の「to top」ボタンと重なる場合の最低限の逃げ */
  #toTopBtn{
    bottom: calc(var(--sp-sticky-cta-height) + 12px + env(safe-area-inset-bottom, 0px));
  }
}

