@charset "UTF-8";
/* ==========================================================================
   とうぎん教育ローン LP
   Figma: PC 1440px（SP は後日対応）
   ========================================================================== */

/* --------------------------------------------------
   0. Design tokens
   -------------------------------------------------- */
:root{
  --navy:      #094276;
  --blue:      #168fd3;
  --pink:      #e50056;
  --sub-blue:  #0d64b2;
  --cyan:      #55c1d9;
  --teal:      #4cbad2;
  --tel-blue:  #004ea2;
  --yellow:    #ffe400;
  --tel-yellow:#ffe659;
  --bg-blue:   #eaf9ff;
  --bg-row:    #eef4f9;
  --bg-mv:     #fceff4;
  --bg-amz:    #fffcf3;
  --bg-amz2:   #f5f2e9;
  --bg-cta:    #ffdfdf;
  --gray:      #e0e0e0;
  --gray-dark: #959595;
  --row-gray:  #f3f3f3;
  --tab-off:   #838383;
  --text:      #333333;
  --link:      #0066cc;
  --shadow:    0 4px 10px rgba(0,0,0,.25);
  --cta-h:     110px;
}

/* --------------------------------------------------
   1. Reset
   -------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,p,figure,dl,dd,ul,ol,table{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{vertical-align:bottom;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;letter-spacing:inherit}
a{color:inherit}
table{border-collapse:separate;border-spacing:0}
th,td{padding:0;font-weight:inherit;text-align:inherit}

/* フォーカス: マウス操作時はリングを出さず、キーボード操作時のみ表示する */
:focus{outline:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}

body{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  font-size:18px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:.1em;
  color:var(--text);
  background:#fff;
  padding-bottom:var(--cta-h);
  /* PC は 1440px 固定デザインのため、狭い画面ではページごと横スクロールさせる */
  min-width:1160px;
  overflow-wrap:anywhere;
  line-break:strict;
}

.u-br-sp{display:none}
/* SP 専用の装飾（SP 用 CSS で表示） */
.p-mv__sp-flower,.p-campaign__sp-flower{display:none}
/* SP 画像切替用の <picture> は箱を作らず、中の img を従来どおり配置する */
.p-mv__title picture,.p-campaign-intro__visual picture,.p-campaign__visual picture{display:contents}

/* --------------------------------------------------
   2. 共通コンポーネント
   -------------------------------------------------- */
/* ---- セクション見出し（青の下線付き） ---- */
.c-title{
  font-size:36px;font-weight:700;line-height:1.3;
  text-align:center;text-indent:.1em;color:var(--navy);
}
.c-title::after{content:"";display:block;width:50px;height:5px;margin:20px auto 0;background:var(--blue)}

/* ---- 角丸ピルボタン（ピンク） ---- */
.c-btn{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:360px;height:90px;
  padding-right:15px;   /* Figma: 矢印分だけラベル中心を左へ */
  border-radius:999px;
  background:var(--pink);
  box-shadow:var(--shadow);
  color:#fff;
  font-size:26px;font-weight:700;line-height:1.6;letter-spacing:0;
  text-align:center;text-decoration:none;
  transition:opacity .2s;
}
.c-btn:hover{opacity:.85}
.c-btn--2line{line-height:1.3}
.c-btn__arrow{position:absolute;top:50%;right:17px;margin-top:-8px;width:10px;height:16px}

/* ---- 白地・枠線のピルボタン ---- */
.c-btn-outline{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto;
  border:1px solid var(--navy);border-radius:999px;
  background:#fff;color:var(--navy);
  font-weight:700;text-decoration:none;
  transition:opacity .2s;
}
.c-btn-outline:hover{opacity:.7}

/* ---- リスト ---- */
.c-ul{padding-left:1.5em}
.c-ul > li{list-style:disc}
.c-ol{padding-left:1.5em}
.c-ol > li{list-style:decimal}
.c-ol .c-ul{padding-left:1.5em}
.c-note{font-size:14px;line-height:1.6}
.c-note--sep{margin-top:28.8px}   /* Figma: 空行 1 行分 */
.c-link{color:var(--link);text-decoration:underline}
.c-link:hover{text-decoration:none}

/* --------------------------------------------------
   3. header
   -------------------------------------------------- */
.l-header{height:80px;background:#fff}
.l-header__inner{display:flex;justify-content:space-between;width:1100px;height:100%;margin:0 auto}
.l-header__logo{display:block;width:190px;height:33px;margin-top:23px}
.l-header__logo img{width:100%;height:100%}
.l-header__tel{display:block;align-self:flex-start;width:209px;margin-top:11px;text-align:center;text-decoration:none;transition:opacity .2s}
.l-header__tel:hover{opacity:.7}
.l-header__tel-num{display:block;font-family:"Roboto",sans-serif;font-size:32px;font-weight:700;line-height:37.5px;letter-spacing:0}
.l-header__tel-time{display:block;font-size:12px;line-height:1.6;letter-spacing:.1em}

/* --------------------------------------------------
   4. MV
   -------------------------------------------------- */
.p-mv{position:relative;height:650px;overflow:hidden;background:var(--bg-mv)}
/* 花の装飾は 1440px デザインの座標を中央基準に換算（広い画面でも KV との距離を保つ） */
.p-mv__flower{position:absolute}
.p-mv__flower--l{left:calc(50% - 737px);top:2px;width:315px;height:645px}
.p-mv__flower--r{left:calc(50% + 324px);top:13px;width:475px;height:631px}
.p-mv__title{position:relative;padding-top:69px}
.p-mv__elements{display:block;width:818px;height:513px;margin:0 auto}

/* --------------------------------------------------
   5. キャンペーン告知
   -------------------------------------------------- */
.p-campaign-intro{position:relative;overflow:hidden;padding:70px 0;background:var(--bg-amz)}
.p-campaign-intro__flower{position:absolute}
.p-campaign-intro__flower--l{left:calc(50% - 620px);top:121px;width:276px;height:336px}
.p-campaign-intro__flower--r{left:calc(50% + 339px);top:125px;width:281px;height:332px}
.p-campaign-intro__banner{position:relative;display:block;width:614px;height:516px;margin:0 auto}
.p-campaign-intro__btn{
  width:370px;height:60px;margin-top:35px;padding-left:6px;gap:16px;
  font-size:20px;line-height:1.6;
}
.c-btn-outline__arrow{width:10px;height:16px}

/* --------------------------------------------------
   6. おすすめポイント
   -------------------------------------------------- */
.p-point{padding:100px 0}
.p-point__inner{width:1100px;margin:0 auto}
.p-point__illust{display:block;width:316px;height:128px;margin:0 auto 21px}
.p-point__list{
  margin-top:40px;
  display:grid;grid-template-columns:530px 530px;column-gap:40px;row-gap:40px;
}
.p-point__badge{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:110px;height:110px;margin:0 auto;
  border-radius:50%;background:var(--blue);
  color:#fff;font-weight:700;line-height:1.1;text-indent:.1em;
}
.p-point__badge-label{font-size:20px}
.p-point__badge-num{font-size:30px}
.p-point__head{
  margin-top:20px;
  font-size:30px;font-weight:700;line-height:1.3;
  text-align:center;text-indent:.1em;color:var(--navy);
}
.p-point__img{display:block;width:530px;height:290px;margin-top:30px;object-fit:cover;border-radius:10px}
.p-point__text{margin-top:20px}

/* --------------------------------------------------
   7. 水色背景（比較表 + お申込みについて）
   -------------------------------------------------- */
.p-blue{padding:100px 0;background:var(--bg-blue)}

/* ---- 教育ローンと一般的な奨学金の違い ---- */
.p-compare{width:910px;margin:0 auto}
.p-compare__table{width:910px;margin-top:40px;table-layout:fixed}
.p-compare__col{
  height:62px;
  font-size:30px;font-weight:700;line-height:1.3;
  text-align:center;text-indent:.1em;color:#fff;
}
.p-compare__col--loan{background:var(--blue);border-radius:10px 0 0 0}
.p-compare__col--sch{background:var(--gray-dark);border-radius:0 10px 0 0}
/* 行見出しの帯は 2 列をまたぐため、背景は左右の列色で塗り分ける */
.p-compare__head-row th{background:linear-gradient(90deg,#fff 50%,var(--row-gray) 50%)}
.p-compare__head-row:first-child th{padding-top:30px}
.p-compare__head-row span{
  display:flex;align-items:center;justify-content:center;
  height:41px;margin:0 30px 0 27px;
  background:var(--teal);
  font-size:22px;font-weight:700;line-height:1.6;text-indent:.1em;color:#fff;
}
.p-compare__row td{
  padding:20px 31px 30px 30px;
  vertical-align:top;
  font-size:20px;line-height:1.6;
}
.p-compare__row td:first-child{background:#fff}
.p-compare__row td:last-child{background:var(--row-gray)}
.p-compare__row:last-child td:first-child{border-radius:0 0 0 10px}
.p-compare__row:last-child td:last-child{border-radius:0 0 10px 0}

/* ---- お申込みについて（タブ） ---- */
.p-apply{width:1100px;margin:100px auto 0;scroll-margin-top:20px}
.p-apply__intro{margin-top:40px}
.p-apply__intro strong{font-weight:700;color:var(--pink)}

.p-apply__tabs{display:flex;justify-content:center;gap:20px;margin-top:60px}
.p-apply__tab{
  position:relative;z-index:1;
  width:330px;height:64px;
  display:flex;align-items:center;justify-content:center;
  border-radius:10px 10px 0 0;
  background:var(--gray);color:var(--tab-off);
  font-size:20px;font-weight:700;line-height:1.1;text-indent:.1em;text-align:center;
  transition:background .2s,color .2s;
}
/* アクティブタブだけパネルより上に置き、白背景でパネル上辺の枠線を隠す
   （Figma の「Rectangle 67」322x4 の白マスクと同じ見え方になる） */
.p-apply__tab.is-active{
  z-index:3;
  background:#fff;color:var(--navy);
  border:4px solid var(--blue);border-bottom:0;
}
.p-apply__tab:focus-visible{outline-color:var(--pink);outline-offset:2px}

.p-apply__panel{
  position:relative;z-index:2;
  margin-top:-4px;
  padding:46px 0;
  background:#fff;border:4px solid var(--blue);border-radius:10px;
}
.p-apply__panel[hidden]{display:none}
.p-apply__lead{font-size:22px;font-weight:700;text-align:center;text-indent:.1em;color:var(--navy)}
.p-apply__btns{display:flex;justify-content:center;margin-top:108px}

/* ---- STEP ---- */
.p-step{display:flex;justify-content:center;gap:20px;margin-top:56px}
.p-step__item{
  position:relative;
  flex:0 0 240px;width:240px;height:310px;
  padding-top:33px;
  border:3px solid var(--gray);border-radius:10px;
  text-align:center;
}
.p-step__badge{
  position:absolute;left:50%;top:-19px;transform:translateX(-50%);
  width:90px;height:32px;border-radius:5px;
  background:var(--cyan);color:#fff;
  font-size:20px;font-weight:700;line-height:32px;text-indent:.1em;
}
.p-step__icon{display:flex;align-items:center;justify-content:center;height:144px}
.p-step__icon img{width:auto;height:auto}
.p-step__label{margin-top:18px;padding:0 17px;font-size:18px;font-weight:700;line-height:1.6;text-indent:.1em;color:var(--navy)}
/* カード下の注記（絶対配置の基準はパディングボックスのため border 3px 分を戻す） */
.p-step__note{
  position:absolute;left:-3px;top:327px;width:240px;
  font-size:15px;line-height:1.6;text-align:left;
}

/* --------------------------------------------------
   8. 必要書類 / 商品概要（アコーディオン）
   -------------------------------------------------- */
.p-detail{width:1100px;margin:0 auto;padding:100px 0}
.p-acc + .p-acc{margin-top:100px}
.p-acc__toggle{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:100%;height:80px;
  background:var(--navy);
  border-radius:10px 10px 0 0;
}
.p-acc__toggle:focus-visible{outline-color:var(--pink);outline-offset:2px}
.p-acc__title{font-size:36px;font-weight:700;line-height:1.3;color:#fff;text-indent:.1em}
.p-acc__icon{
  position:absolute;right:20px;top:20px;
  width:40px;height:40px;border-radius:50%;background:#fff;
}
.p-acc__icon::before,
.p-acc__icon::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--navy);
  transform:translate(-50%,-50%);transition:transform .3s,opacity .3s;
}
.p-acc__icon::before{width:25px;height:3.5px}
.p-acc__icon::after{width:3.5px;height:25px}
.p-acc__toggle[aria-expanded="true"] .p-acc__icon::after{transform:translate(-50%,-50%) scaleY(0);opacity:0}

/* グリッド 0fr → 1fr で高さ自動追従（max-height の決め打ち不要） */
.p-acc__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.p-acc__body.is-open{grid-template-rows:1fr}
.p-acc__body-inner{overflow:hidden;min-height:0}
.p-acc__row{padding:20px 30px}
.p-acc__row:nth-child(even){background:var(--bg-row)}
.p-acc__row dt{font-size:20px;font-weight:700;line-height:1.6;color:var(--sub-blue)}
.p-acc__row dd{margin-top:20px}

.p-detail__date{margin-top:30px;font-size:16px;text-align:right}
.p-detail__pdf{
  width:270px;height:60px;margin-top:30px;padding-right:6px;
  border-width:1.35px;
  font-size:22px;line-height:1.6;
}
.c-btn-outline__icon{position:absolute;right:19px;top:50%;margin-top:-12px;width:19px;height:25px}

/* --------------------------------------------------
   9. キャンペーンの条件について
   -------------------------------------------------- */
.p-campaign{position:relative;overflow:hidden;padding:100px 0;background:var(--bg-amz2);scroll-margin-top:0}
.p-campaign__flower{position:absolute}
.p-campaign__flower--l{left:calc(50% - 620px);top:121px;width:276px;height:336px}
.p-campaign__flower--r{left:calc(50% + 339px);top:125px;width:281px;height:332px}
.p-campaign__inner{position:relative;width:1100px;margin:0 auto}
.p-campaign__banner{display:block;width:614px;height:398px;margin:0 auto}

.p-campaign__card{margin-top:50px}
.p-campaign__head{
  display:flex;align-items:center;justify-content:center;
  height:80px;border-radius:10px 10px 0 0;background:var(--navy);
  font-size:36px;font-weight:700;line-height:1.3;text-indent:.1em;color:#fff;
}
.p-campaign__body{padding:40px;border-radius:0 0 10px 10px;background:#fff}
.p-campaign__lead{text-align:center;text-indent:.1em}
.p-campaign__conds{margin-top:30px}
.p-campaign__conds > li + li{margin-top:40px}
.p-campaign__badge{
  display:block;width:120px;height:40px;margin:0 auto;
  border-radius:999px;background:var(--yellow);
  font-size:26px;font-weight:700;line-height:40px;text-align:center;text-indent:.1em;color:var(--navy);
}
.p-campaign__cond{margin-top:20px;font-size:22px;font-weight:700;line-height:1.6;text-align:center;text-indent:.1em;color:var(--navy)}

.p-campaign__subhead{margin-top:30px;font-size:20px;font-weight:700;line-height:1.6;color:var(--navy)}
.p-campaign__subhead--2{margin-top:40px}
.p-campaign__list{width:1090px;margin-top:20px}
.p-campaign__note{width:1090px;margin-top:40px;font-size:14px;line-height:1.6}

/* --------------------------------------------------
   10. お電話でのご相談
   -------------------------------------------------- */
.p-tel{padding:50px 0 68px;background:var(--navy);color:#fff;text-align:center}
.p-tel__title{font-size:34px;font-weight:700;line-height:1.3;text-indent:.1em}
.p-tel__name{margin-top:30px;font-size:20px;font-weight:700;text-indent:.1em}
.p-tel__btn{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:400px;height:70px;margin:10px auto 0;
  border-radius:999px;background:var(--tel-yellow);color:var(--tel-blue);
  text-decoration:none;
  transition:opacity .2s;
}
.p-tel__btn:hover{opacity:.85}
.p-tel__num{font-family:"Roboto",sans-serif;font-size:40px;font-weight:700;line-height:1;letter-spacing:.1em;text-indent:.1em}
.p-tel__arrow{position:absolute;right:20px;top:50%;margin-top:-10px;width:12px;height:20px}
.p-tel__time{margin-top:10px;font-size:16px;font-weight:700;text-indent:.1em}

/* --------------------------------------------------
   11. footer
   -------------------------------------------------- */
.l-footer{height:220px;padding-top:72px;text-align:center}
.l-footer__logo{display:block;width:190px;height:33px;margin:0 auto}
.l-footer__logo img{width:100%;height:100%}
.l-footer__copy{margin-top:20px;font-size:14px;line-height:1.6;text-indent:.1em}

/* --------------------------------------------------
   12. 下部固定CTA
   -------------------------------------------------- */
.p-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:100;
  height:var(--cta-h);
  background:var(--bg-cta);
}
.p-cta__inner{display:flex;justify-content:center;gap:20px;padding-top:20px}
.p-cta__btn{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:400px;height:70px;
  border-radius:999px;box-shadow:var(--shadow);
  color:#fff;font-size:26px;font-weight:700;line-height:1.6;letter-spacing:.1em;text-indent:.1em;
  text-decoration:none;
  transition:opacity .2s;
}
.p-cta__btn:hover{opacity:.85}
.p-cta__btn:focus-visible{outline-color:var(--yellow);outline-offset:2px}
.p-cta__btn--pink{background:var(--pink)}
.p-cta__btn--blue{background:var(--blue)}
.p-cta__arrow{position:absolute;top:50%;margin-top:-8px;width:10px;height:16px}
.p-cta__btn--pink .p-cta__arrow{right:30px}
.p-cta__btn--blue .p-cta__arrow{right:20px}

/* ==========================================================================
   SP  ( Figma SP_design 1020:669 / 390px 基準 / 1rem = 390px 幅のとき 10px )
   ========================================================================== */
@media screen and (max-width:767px){

/* 390px を 100vw とみなす vw スケーリング。500px 超では拡大を止める */
html{font-size:calc(100vw / 39)}

:root{--cta-h:8rem}

body{font-size:1.5rem;line-height:1.6;min-width:0;padding-bottom:var(--cta-h)}

.u-br-sp{display:inline}
.u-br-pc{display:none}

/* ---- 共通 ---- */
.c-title{font-size:2.8rem;line-height:1.6}
.c-title::after{width:5rem;height:.5rem;margin-top:1rem}

.c-btn{width:32rem;height:9rem;padding-right:1.4rem;font-size:2.2rem}
.c-btn--2line{font-size:2rem}
.c-btn__arrow{right:1.7rem;margin-top:-.8rem;width:1rem;height:1.6rem}

.c-ul,.c-ol,.c-ol .c-ul{padding-left:1.5em}
.c-note{font-size:1.2rem}
.c-note--sep{margin-top:2.4rem}

/* ---- header ---- */
.l-header{height:5.2rem}
/* 500px 超では本文カラム(35rem)が中央寄せになるため、ヘッダーもそれに揃える */
.l-header__inner{width:35rem}
.l-header__logo{width:14rem;height:2.4rem;margin-top:1.4rem}
.l-header__tel{width:15.1rem;margin:.7rem -1rem 0 0}
.l-header__tel-num{font-size:2rem;line-height:2.34rem}
.l-header__tel-time{font-size:.9rem}

/* ---- MV ---- */
.p-mv{height:77.5rem}
.p-mv__flower{display:none}
.p-mv__title{padding-top:3rem}
.p-mv__elements{width:35rem;height:71.5rem}
/* 花は 390px デザインの座標を中央基準に換算（500px 超で中央寄せになっても KV との位置関係を保つ） */
.p-mv__sp-flower{display:block;position:absolute;z-index:1}
.p-mv__sp-flower--1{left:calc(50% + 10.8rem);top:6.9rem;width:8.2rem;height:5.1rem}
.p-mv__sp-flower--2{left:calc(50% + 12.5rem);top:18.4rem;width:6.2rem;height:5.2rem}
.p-mv__sp-flower--3{left:calc(50% - 18.6rem);top:6.7rem;width:6rem;height:5.3rem}
.p-mv__sp-flower--4{left:calc(50% - 18rem);top:21.3rem;width:6.5rem;height:5.6rem}
.p-mv__sp-flower--5{left:calc(50% + 11.4rem);top:28.9rem;width:8.4rem;height:7.5rem}
.p-mv__sp-flower--6{left:calc(50% - 18.1rem);top:31.4rem;width:4.5rem;height:8rem}

/* ---- キャンペーン告知 ---- */
.p-campaign-intro{padding:.2rem 0 4rem;background:var(--bg-amz2)}
.p-campaign-intro__flower{display:none}
/* 花（.p-campaign__sp-flower）は下部キャンペーンと同じ配置のため、同じ枠の作りで共用する */
.p-campaign-intro__visual{position:relative;width:36rem;margin:0 auto;padding-top:3.8rem}
.p-campaign-intro__banner{width:36rem;height:35.3rem}
.p-campaign-intro__btn{width:29rem;height:5rem;margin-top:3rem;padding-left:.4rem;gap:1.4rem;font-size:1.6rem}
.c-btn-outline__arrow{width:1rem;height:1.6rem}

/* ---- おすすめポイント ---- */
.p-point{padding:6rem 0}
.p-point__inner{width:35rem}
.p-point__illust{width:31.6rem;height:12.8rem;margin-bottom:2rem}
.p-point__list{margin-top:3rem;grid-template-columns:35rem;column-gap:0;row-gap:4rem}
.p-point__badge{width:9rem;height:9rem}
.p-point__badge-label{font-size:1.6rem}
.p-point__badge-num{font-size:3.2rem}
.p-point__head{margin-top:1rem;font-size:2.4rem;line-height:1.6}
.p-point__img{width:35rem;height:19rem;margin-top:2rem}
.p-point__text{margin-top:2rem;font-size:1.6rem}

/* ---- 水色背景 ---- */
.p-blue{padding:6rem 0}
/* Figma SP ではこのセクションの下線・タブ枠は水色 */
.p-blue .c-title::after{background:var(--cyan)}

/* ---- 比較表（Figma SP で 350px 内に収める形に変更） ---- */
.p-compare{width:35rem}
.p-compare__table{width:35rem;margin-top:3rem}
.p-compare__col{height:6.2rem;font-size:1.8rem;line-height:1.2}
.p-compare__col--loan{border-radius:1rem 0 0 0}
.p-compare__col--sch{border-radius:0 1rem 0 0}
.p-compare__head-row:first-child th{padding-top:2rem}
.p-compare__head-row span{height:4.1rem;margin:0 1rem;font-size:1.8rem}
.p-compare__row td{padding:1rem 1rem 2rem;font-size:1.4rem;line-height:2.24rem}
.p-compare__row:last-child td{padding-bottom:3rem}
.p-compare__row:last-child td:first-child{border-radius:0 0 0 1rem}
.p-compare__row:last-child td:last-child{border-radius:0 0 1rem 0}

/* ---- お申込みについて（タブ） ---- */
.p-apply{width:35rem;margin-top:6rem;scroll-margin-top:2rem}
.p-apply__intro{margin-top:3rem;font-size:1.8rem;line-height:1.6}
.p-apply__tabs{justify-content:flex-start;gap:1rem;margin-top:4rem}
.p-apply__tab{
  width:17rem;height:7.5rem;
  border-radius:1rem 1rem 0 0;
  font-size:1.8rem;line-height:1.4;letter-spacing:0;text-indent:0;
}
.p-apply__tab.is-active{border-width:.3rem;border-color:var(--cyan)}   /* パネル(.3rem)と太さを統一 */
.p-apply__panel{
  margin-top:-.3rem;
  padding:3rem 0 3.7rem;
  border-width:.3rem;border-color:var(--cyan);border-radius:0 0 1rem 1rem;
}
.p-apply__lead{padding:0 1.2rem;font-size:1.8rem;line-height:1.6}
.p-apply__btns{margin-top:4rem}

/* ---- STEP（SP は横スクロール + scroll-hint。香川 LP と同じ作り） ---- */
/* 左端はパネル内の本文に揃え、右端はパネルの枠まで流す */
.p-step-scroll{
  margin:2rem 0 0 1.2rem;
  padding-top:1.6rem;        /* STEP バッジのはみ出し分 */
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.p-step{
  width:max-content;margin-top:0;
  justify-content:flex-start;gap:2rem;
  padding:0 1.2rem 5.8rem 0; /* 下はカード下の注記（絶対配置）の分 */
}
.p-step__item{flex:0 0 24rem;width:24rem;height:30rem;padding-top:3.3rem;border-width:.3rem;border-radius:1rem}
.p-step__badge{top:-1.9rem;width:9rem;height:3.2rem;border-radius:.5rem;font-size:2rem;line-height:3.2rem}
.p-step__icon{height:14.2rem}
/* アイコンは HTML の width 属性（Figma 原寸 px）を rem に換算して拡縮させる */
.p-step__icon img[width="76"]{width:7.6rem}
.p-step__icon img[width="111"]{width:11.1rem}
.p-step__icon img[width="175"]{width:17.5rem}
.p-step__label{margin-top:1rem;padding:0 .8rem;font-size:1.8rem}   /* 改行位置は HTML の u-br-sp で指定 */
.p-step__note{left:-.3rem;top:calc(100% + 1.3rem);width:24rem;font-size:1.5rem}   /* カード外枠の下 10px（基準がパディングボックスのため枠線分を足す） */

/* ---- scroll-hint ---- */
.scroll-hint-icon{width:14rem;left:calc(50% - 7rem);padding:2rem 1rem 1rem}
.scroll-hint-text{font-size:1.1rem;letter-spacing:0;white-space:nowrap}
.scroll-hint-icon-white{box-shadow:0 0 .4rem rgba(0,0,0,.12)}

/* ---- 必要書類 / 商品概要（アコーディオン） ---- */
.p-detail{width:35rem;padding:6rem 0}
.p-acc + .p-acc{margin-top:6rem}
/* 見出しは 2 つとも中央揃え（右のアイコン分を左右対称に空ける） */
.p-acc__toggle{
  justify-content:center;
  height:auto;min-height:8.5rem;padding:2rem 5.6rem;
  border-radius:1rem 1rem 0 0;
  text-align:center;
}
.p-acc__title{font-size:2.2rem;line-height:1.6;text-indent:0}   /* キャンペーン条件の見出しと揃える（Figma は 28px） */
.p-acc__icon{right:2rem;top:50%;width:3.2rem;height:3.2rem;margin-top:-1.6rem}
.p-acc__icon::before{width:2rem;height:.3rem}
.p-acc__icon::after{width:.3rem;height:2rem}
.p-acc__row{padding:2rem 1rem}
.p-acc__row dt{font-size:1.6rem}
.p-acc__row dd{margin-top:1rem;font-size:1.5rem}
.p-detail__date{margin-top:2rem;font-size:1.5rem}
.p-detail__pdf{width:20rem;height:4rem;margin-top:2rem;padding-right:1.4rem;border-width:.1rem;font-size:1.6rem}
.c-btn-outline__icon{right:1.3rem;margin-top:-.9rem;width:1.4rem;height:1.8rem}

/* ---- キャンペーンの条件について ---- */
.p-campaign{padding:6rem 0}
.p-campaign__flower{display:none}
.p-campaign__inner{width:35rem}
/* バナー上部に花が重なるため、花の分だけ上に余白を取った枠の中に置く */
.p-campaign__visual{position:relative;width:36rem;margin:0 -.5rem;padding-top:3.8rem}
.p-campaign__banner{width:36rem;height:27.5rem}
.p-campaign__sp-flower{display:block;position:absolute;z-index:1}
.p-campaign__sp-flower--2{left:29rem;top:0;width:8.6rem;height:8.1rem}
.p-campaign__sp-flower--3{left:1.6rem;top:.7rem;width:4.2rem;height:6.3rem}
.p-campaign__sp-flower--4{left:2rem;top:7.5rem;width:2.3rem;height:2.3rem}
.p-campaign__sp-flower--5{left:27.7rem;top:.4rem;width:2.3rem;height:2.3rem}
.p-campaign__sp-flower--6{left:14.7rem;top:1.8rem;width:2.3rem;height:2.3rem}
.p-campaign__sp-flower--7{left:7.2rem;top:.7rem;width:4.1rem;height:3.7rem}
.p-campaign__sp-flower--8{left:30.6rem;top:8rem;width:3.8rem;height:3.3rem}
.p-campaign__sp-flower--9{left:20.7rem;top:.6rem;width:3.1rem;height:2.1rem}
.p-campaign__card{margin-top:3rem}
.p-campaign__head{justify-content:flex-start;height:5rem;padding:0 2rem;border-radius:1rem 1rem 0 0;font-size:2.2rem;text-indent:0}
.p-campaign__body{padding:2rem;border-radius:0 0 1rem 1rem}
.p-campaign__lead{font-size:1.5rem;text-align:left;text-indent:0}
.p-campaign__conds{margin-top:2rem}
.p-campaign__conds > li + li{margin-top:2rem}
.p-campaign__badge{width:9rem;height:3.2rem;font-size:2rem;line-height:3.2rem}
.p-campaign__cond{margin-top:1rem;font-size:1.8rem;text-align:left;text-indent:0}
.p-campaign__subhead{margin-top:3rem;padding-left:1rem;font-size:1.8rem}
.p-campaign__subhead--2{margin-top:3rem}
.p-campaign__list{width:auto;margin-top:1rem;font-size:1.5rem}
.p-campaign__note{width:auto;margin-top:1rem;font-size:1.2rem}

/* ---- お電話でのご相談 ---- */
.p-tel{padding:5rem 2rem}
.p-tel__title{font-size:2.6rem;line-height:1.6}
.p-tel__name{margin-top:3rem;font-size:2rem}
.p-tel__btn{width:35rem;height:7rem;margin-top:1rem;background:var(--yellow)}   /* Figma SP は #ffe400 */
.p-tel__num{font-size:3.4rem}
.p-tel__arrow{right:2rem;margin-top:-1rem;width:1.2rem;height:2rem}
.p-tel__time{margin-top:1rem;font-size:1.6rem}

/* ---- footer ---- */
.l-footer{height:auto;padding:5rem 0}
.l-footer__logo{width:19rem;height:3.3rem}
.l-footer__copy{margin-top:5rem;padding:0 1rem;font-size:1.4rem}

/* ---- 下部固定CTA ---- */
.p-cta{height:var(--cta-h)}
.p-cta__inner{gap:1rem;padding-top:1.5rem}
.p-cta__btn{width:17rem;height:5rem;font-size:2.2rem;letter-spacing:0;text-indent:0}
.p-cta__btn--blue{width:19rem;font-size:1.6rem}
.p-cta__arrow{display:none}

}

/* 500px 超（横向きスマホ／小型タブレット）では拡大を停止 */
@media screen and (min-width:500px) and (max-width:767px){
  html{font-size:12.82px}
}