/* 出典: 旧WP page-fx-cfd-apply.php インラインスタイル */
/* レスポンシブ: このブロックは 1023.98px 以下でのみ当てる(PC 用マークアップと同居するため) */
@media (max-width:1023.98px){
/* ===== MOBILE overrides — page-fxcfd ===== */
.page-fxcfd{--side-pad:16px}
.fx-hero{height:280px;margin-top:0}
.fx-hero-content{gap:10px;padding:0 24px}
.fx-hero-title{font-size:20px;line-height:31px;letter-spacing:.3px}
.fx-hero-sub{font-size:14px;line-height:1.4}

/* 5-step PROCESS → vertical timeline (circle left, text right, connector line) */
.fxl-process{padding:80px 0}
.fxl-process::before{display:none}
.fxl-process-inner{position:relative;flex-direction:column;align-items:stretch;gap:0;padding:0 26px;max-width:none}
.fxl-process-inner::before{content:"";position:absolute;top:-40px;bottom:-40px;left:56px;width:2px;background:url('/wp-content/themes/taian-bridge-rwd/assets/images/pages/fxstep-line-v.webp') center/100% 100% no-repeat;z-index:0}
.fxl-step{display:grid;grid-template-columns:63px 1fr;column-gap:16px;align-items:center;width:100%;max-width:none;text-align:left;padding:12px 0;position:relative;z-index:1}
.fxl-circle{grid-row:1 / 4;grid-column:1;align-self:center;width:63px;height:63px}
.fxl-circle img,.fxl-circle svg{width:30px!important;height:30px!important}
.fxl-step-no{grid-column:2;grid-row:1;margin-top:0;font-size:10px}
.fxl-step-title{grid-column:2;grid-row:2;margin-top:2px;font-size:14px;line-height:18px}
.fxl-step-desc{grid-column:2;grid-row:3;margin-top:6px;font-size:10px;line-height:15px}

/* 4 STAT CARDS → 2×2 */
.fxl-stats{padding:8px 0 50px}
.fxl-stats-inner{flex-wrap:wrap;justify-content:center;gap:14px;padding:0 16px}
.fxl-stat-card{width:calc(50% - 7px);max-width:200px;height:128px}
.fxl-stat-label{left:18px;top:18px}
.fxl-stat-label span{font-size:14px}
.fxl-stat-num{left:35px!important;right:0!important;top:65px!important;bottom:36px!important;justify-content:center!important;font-family:"Pretendard JP",Pretendard,sans-serif!important;font-size:50px!important;font-weight:700!important}
.fxl-stat-num.fxl-stat-num-sm{font-size:43px!important;letter-spacing:-1px!important}
.fxl-stat-num.fxl-stat-num-sm .taian-flip{gap:1px!important}
.fxl-stat-num span{font-size:17px}
.fxl-stat-num.fxl-stat-num-sm{font-size:34px;top:64px}
.fxl-stat-num.fxl-stat-num-sm span{font-size:15px}

/* SUB TEXT */
.fxl-subtext{padding:0 24px 36px}
.fxl-subtext p{font-size:14px;line-height:22px}

/* CTA → stacked */
.fxl-cta{padding:0 16px 40px}
.fxl-cta-card{height:auto;flex-direction:column;align-items:flex-start;gap:16px;padding:26px 22px}
.fxl-cta-text h3{font-size:18px;line-height:24px}
.fxl-cta-text p{font-size:13px;line-height:20px;margin-top:8px}
.fxl-cta-btn{width:100%;height:52px;font-size:17px}

/* LIST table → compact (no / title / status) */
.fxl-list{height:auto;padding:0 16px 70px}
/* 日付は内容幅、氏名+お申込みは残り幅で左寄せ(旧 1fr auto 62px は日付が伸びて氏名が右端に寄っていた — 10/6 指示) */
.fxl-row{grid-template-columns:auto 1fr 62px;column-gap:10px;height:auto;min-height:46px;padding:9px 0}
.fxl-row-title{text-align:left;justify-self:start}
.fxl-row-cat,.fxl-row-author,.fxl-row-no{display:none}
.fxl-row-date{font-size:11px;color:#9b9b9b;white-space:nowrap}
.fxl-row-title{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fxl-row-badge{width:60px;height:24px;font-size:11px}
.fxl-pagination{margin-top:18px}

/* NOTICE */
.fxl-notice{padding:0 0 50px}
.fxl-notice-inner{padding:0 24px}
.fxl-notice-title{font-size:18px}
.fxl-notice-list li{font-size:13px;line-height:24px}

/* detail modal */
.fxl-detail{grid-template-columns:90px 1fr;font-size:13px}
}

/* レスポンシブ: このブロックは 1023.98px 以下でのみ当てる(PC 用マークアップと同居するため) */
@media (max-width:1023.98px){
/* 連携完了 (total) 用に 50% 縮小 */
.fxl-stat-num.fxl-stat-num-sm{font-size:55px;top:100px}
.fxl-stat-num.fxl-stat-num-sm span{font-size:21px}
}

/* レスポンシブ: このブロックは 1023.98px 以下でのみ当てる(PC 用マークアップと同居するため) */
@media (max-width:1023.98px){
/* 導入テキスト(装飾なし・本文のみ)。このページの --side-pad は 440px なので継承させない。 */
  .ai-intro{background:#F8F9FB;padding:50px 0 0}
  .ai-intro-inner{max-width:860px;margin:0 auto;padding:0 24px;text-align:center}
  .ai-intro-inner p{margin:0 0 22px;font-size:13.5px;font-weight:400;line-height:1.95;color:#1A1A1A;letter-spacing:.1px}
  .ai-intro-inner p:last-child{margin-bottom:0}
  .ai-intro-inner strong{font-weight:700}
  .ai-intro-inner a{color:#0047AB;text-decoration:underline;text-underline-offset:3px}
  .ai-worry{font-size:16px!important;font-weight:600!important;color:#00064B!important;margin-bottom:12px!important}
  .ai-lead{margin:0 0 26px;font-size:18px;font-weight:700;line-height:1.8;color:#00064B;letter-spacing:-.2px}
  .ai-closing{font-size:15px;font-weight:700!important;color:#00064B!important}
  /* 直後の5ステップは上余白が広いので詰める。style/script が間に入るため + ではなく ~ を使う。
     ::before の飾り線は padding-top と同じ値に合わせること。 */
  .ai-intro ~ .fxl-process{padding-top:64px}
  .ai-intro ~ .fxl-process::before{top:64px}
}
@media (max-width:1023.98px){
    .ai-intro{padding:26px 0 0}
    .ai-intro-inner{padding:0 20px}
    .ai-intro-inner p{margin-bottom:17px;font-size:12px;line-height:1.9}
    .ai-closing{font-size:13px}
    .ai-worry{font-size:13.5px!important;margin-bottom:10px!important}
    .ai-lead{margin-bottom:19px;font-size:15px;line-height:1.7}
    .ai-intro ~ .fxl-process{padding-top:40px}
  }

/* レスポンシブ: この PC 用ブロックは 1024px 以上でのみ当てる(モバイル用マークアップと同居するため) */
@media (min-width:1024px){
/* 連携完了 (total) 用に 50% 縮小 */
.fxl-stat-num.fxl-stat-num-sm{font-size:55px;top:100px}
.fxl-stat-num.fxl-stat-num-sm span{font-size:21px}
}

/* レスポンシブ: この PC 用ブロックは 1024px 以上でのみ当てる(モバイル用マークアップと同居するため) */
@media (min-width:1024px){
/* 導入テキスト(装飾なし・本文のみ)。このページの --side-pad は 440px なので継承させない。 */
  .ai-intro{background:#F8F9FB;padding:50px 0 0}
  .ai-intro-inner{max-width:860px;margin:0 auto;padding:0 24px;text-align:center}
  .ai-intro-inner p{margin:0 0 22px;font-size:13.5px;font-weight:400;line-height:1.95;color:#1A1A1A;letter-spacing:.1px}
  .ai-intro-inner p:last-child{margin-bottom:0}
  .ai-intro-inner strong{font-weight:700}
  .ai-intro-inner a{color:#0047AB;text-decoration:underline;text-underline-offset:3px}
  .ai-worry{font-size:16px!important;font-weight:600!important;color:#00064B!important;margin-bottom:12px!important}
  .ai-lead{margin:0 0 26px;font-size:18px;font-weight:700;line-height:1.8;color:#00064B;letter-spacing:-.2px}
  .ai-closing{font-size:15px;font-weight:700!important;color:#00064B!important}
  /* 直後の5ステップは上余白が広いので詰める。style/script が間に入るため + ではなく ~ を使う。
     ::before の飾り線は padding-top と同じ値に合わせること。 */
  .ai-intro ~ .fxl-process{padding-top:64px}
  .ai-intro ~ .fxl-process::before{top:64px}
}
@media (min-width:1024px) and (max-width:900px){
    .ai-intro{padding:26px 0 0}
    .ai-intro-inner{padding:0 20px}
    .ai-intro-inner p{margin-bottom:17px;font-size:12px;line-height:1.9}
    .ai-closing{font-size:13px}
    .ai-worry{font-size:13.5px!important;margin-bottom:10px!important}
    .ai-lead{margin-bottom:19px;font-size:15px;line-height:1.7}
    .ai-intro ~ .fxl-process{padding-top:40px}
  }
