/* ===== cta ===== */
body{
    font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
    -webkit-font-smoothing:antialiased;
  }
img{max-width:none;display:block}
button{font:inherit;cursor:pointer;border:none;background:none}
/* ===== Section ===== */
.ctaband{
    position:relative;
    background:var(--blue);
    overflow:hidden;
  }
.cta-inner{
    position:relative;
    z-index:1;
    max-width:1020px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:20px;
    padding:0 24px;
  }
.cta-left{
    flex:1 1 0;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:16px;
    padding:48px 0;
  }
.cta-title{
    font-size:40px;
    font-weight:900;
    line-height:1.4;
    color:var(--white);
    text-align:center;
  }
/* CTA button + badge (shared with hero) */
/* ===== Phones ===== */
.cta-right{
    flex:1 1 0;
    min-width:0;
    position:relative;
    align-self:stretch;
    min-height:414px;
  }
.cta-phone{
    position:absolute;
    height:auto;
    filter:drop-shadow(0 20px 30px rgba(0,0,0,.18));
  }
/* 中央(前)のダッシュボード：上部(9:41)から見せ、下は見切れ */
.cta-phone.p1{
    width:205px;
    left:6%;
    top:90px;
  }
/* 右(奥)のドーナツ：ドーナツ〜下部を見せ、上は見切れ・少し高い位置 */
.cta-phone.p2{
    width:196px;
    right:2%;
    top:-124px;
  }
/* ===== Responsive ===== */
@media (max-width:900px){
.cta-title{font-size:30px}
.cta-right{min-height:320px}
.cta-phone.p1{width:172px;left:4%;top:48px}
.cta-phone.p2{width:164px;top:-140px}
}
@media (max-width:680px){
/* SP: タイトル → スマホ画像 → ボタン(最下部) の順に */
.cta-inner{
      flex-direction:column;
      gap:28px;
      align-items:center;
      text-align:center;
      padding:56px 24px;
    }
.cta-left{display:contents}
.cta-title{order:1;font-size:26px;text-align:center}
.cta-right{
      order:2;
      width:100%;
      flex:0 0 auto;
      align-self:auto;
      min-height:0;
      display:block;
      text-align:center;
    }
.cta-box{order:3;width:100%;max-width:340px}
/* SP: スマホは1台だけ中央に表示 */
.cta-phone.p2{display:none}
.cta-phone.p1{
      position:static;
      width:180px;
      height:auto;
      margin:0 auto;
      display:block;
      left:auto;right:auto;top:auto;bottom:auto;
    }
}
@media (max-width:420px){
.cta-title{font-size:23px}
.btn-primary{height:56px}
.btn-primary .btn-text{font-size:20px}
.cta-phone.p1{width:168px}
}
