/* TOP Hero only. Ratios measured against the supplied 1672px reference. */
.bftop-page>section.bfhero{width:100%;max-width:none;margin:0;padding:0;background:#edf7fd;color:#1d3563}
.bfhero,.bfhero *{box-sizing:border-box}.bfhero-stage{position:relative;width:100%;min-height:0;aspect-ratio:1672/754;overflow:hidden;isolation:isolate}
.bfhero .bfhero-background{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%;z-index:-1}
.bfhero-panel{position:absolute;left:52.2%;top:5.8%;width:42%;padding:2.1% 2.6% 3.8%;border-radius:6px;background:rgba(255,255,255,.94)}
.bfhero h1{font-family:"Noto Sans JP","Noto Sans CJK JP",sans-serif;font-weight:700;font-size:clamp(28px,3.65vw,74px);line-height:1.3;letter-spacing:.015em;color:#1154a7;margin:0 0 1.1vw;overflow-wrap:anywhere}
.bfhero-lead{font-size:clamp(13px,1.24vw,25px);line-height:1.6;letter-spacing:.065em;margin:0!important}
.bfhero-benefits{display:flex;list-style:none;padding:0;margin:1.7vw 0 0;gap:0}.bfhero-benefits li{display:flex;align-items:center;gap:.8vw;flex:1;font-size:clamp(10px,.97vw,20px);line-height:1.7;padding:0 1vw;border-left:1px solid #dce5ef}.bfhero-benefits li:first-child{border:0;padding-left:0}.bfhero-benefits li:last-child{padding-right:0}.bfhero-icon{display:grid;place-items:center;flex-shrink:0;width:3.5vw;height:3.5vw;border-radius:50%;background:#eef6ff}.bfhero-icon svg{width:70%;height:70%;fill:none;stroke:#0754bb;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.bfhero-note{position:absolute;pointer-events:none;color:#1755ab}.bfhero-note-left{left:7.6%;top:7.7%;width:17%}.bfhero-note-learn{right:2.1%;top:5.5%;width:11%}.bfhero-note-create{right:1.2%;top:56%;width:10.5%}.bfhero-ink{display:block;position:relative;overflow:hidden;width:100%;aspect-ratio:640/340}.bfhero .bfhero-ink img{position:absolute;width:240%;max-width:none;height:auto;left:-70.3%;top:0}.bfhero .bfhero-ink-2 img{top:-100%}.bfhero .bfhero-ink-3 img{top:-200%}
.bfhero-english{display:block;text-align:center;font:italic 1.65vw/1.45 cursive;color:#7eaaec;transform:rotate(-12deg);margin-top:.2vw}
.bfhero-photos{position:absolute;left:55.4%;top:60%;width:35%;display:flex;gap:1.7vw}.bfhero-photos figure{width:50%;margin:0!important;padding:.45vw;background:white;border-radius:5px;transform:rotate(-7deg)}.bfhero-photos figure+figure{transform:rotate(6deg)}.bfhero .bfhero-photos img{display:block;width:100%;height:auto;aspect-ratio:1.35;object-fit:cover;border-radius:3px}
.bfhero-wave{position:absolute;bottom:-1px;left:0;width:100%;height:11%;fill:#edf7fd}
@media(min-width:2000px){.bfhero-stage{max-width:2200px;margin:auto}.bfhero h1{font-size:74px}}
@media(max-width:900px) and (min-width:701px){.bfhero-panel{left:49%;width:48%;padding:2.3%}.bfhero h1{font-size:3.7vw}.bfhero-benefits li{padding:0 .65vw;gap:.5vw}.bfhero-note-learn{top:1%;right:1%;width:10%}.bfhero-lead{font-size:12px}.bfhero-photos{top:62%;z-index:1}.bfhero-note-create{z-index:2}}
@media(max-width:1000px){.bfhero-stage{aspect-ratio:auto;padding:290px 18px 64px;min-height:760px}.bfhero .bfhero-background{height:360px;object-position:29% center;object-fit:cover}.bfhero-panel{position:relative;left:auto;top:auto;width:100%;padding:28px 20px 25px;border-radius:8px;background:rgba(255,255,255,.97)}.bfhero h1{font-size:clamp(24px,5.4vw,37px);line-height:1.5;margin:0 0 15px;letter-spacing:0}.bfhero-lead{font-size:14px;line-height:1.9;letter-spacing:0}.bfhero-benefits{margin:22px 0 0;gap:10px;flex-direction:column}.bfhero-benefits li{border:0;padding:0;font-size:14px;gap:12px}.bfhero-benefits br{display:none}.bfhero-icon{width:38px;height:38px}.bfhero-note-left{left:4%;top:25px;width:38%;max-width:170px}.bfhero-english{font-size:17px}.bfhero-note-learn{top:227px;right:4%;width:120px}.bfhero-photos{position:relative;left:auto;top:auto;width:85%;margin:24px auto 0;gap:14px}.bfhero-photos figure{padding:5px}.bfhero-note-create{top:auto;bottom:54px;right:1%;width:100px}.bfhero-wave{height:30px}}
/* Verified typography and sprite bounds. */
.bfhero h1{font-size:clamp(28px,3.25vw,70px)}
.bfhero-benefits li{padding-inline:.7vw;gap:.65vw;font-size:clamp(10px,.91vw,19px)}
.bfhero-benefits li>span:last-child{white-space:nowrap}.bfhero-icon{width:3.25vw;height:3.25vw}
.bfhero-ink-2{aspect-ratio:640/310}.bfhero .bfhero-ink-2 img{top:-109.6774%}
.bfhero-ink-3{aspect-ratio:640/354}.bfhero .bfhero-ink-3 img{top:-189.2655%}
@media(max-width:1000px){.bfhero h1{font-size:clamp(24px,5.4vw,37px)}.bfhero-note-left{left:auto;right:4%;top:25px;width:34%}.bfhero-english{font-size:14px}.bfhero-icon{width:38px;height:38px}.bfhero-benefits li{font-size:14px;padding:0;gap:12px}.bfhero-note-learn{top:227px}.bfhero-note-create{bottom:36px}}

@media(min-width:1001px){.bfhero-photos{top:62%;z-index:1}.bfhero-note-create{z-index:2}}

/* hero.3: balance the text panel after removing the three benefit items. */
.bfhero-panel{padding:2.6%}
@media(min-width:1001px){.bfhero-photos{top:55%}.bfhero-note-create{top:51%}}
@media(max-width:1000px){.bfhero-panel{padding:28px 20px}.bfhero-stage{min-height:0;padding-bottom:48px}}