html,body{margin:0;background:#fff}

.hroE{
  --acc:#635bff; --ink:#0a2540; --body:#374151; --sub:#4b5563; --line:#e6e9ee;
  font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  position:relative;isolation:isolate;overflow:hidden;padding:clamp(80px,11vw,160px) 24px;
  display:grid;align-items:center;min-height:clamp(460px,60vw,660px);
}
.hroE__bg{
  position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(200deg,#1b3a5c 0%,#0a2540 55%,#08182a 100%),
    radial-gradient(90% 70% at 78% 18%, #2f6f9f 0%, transparent 60%);
  background-blend-mode:screen;
}
.hroE__bg::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(115deg, rgba(255,255,255,.035) 0 2px, transparent 2px 9px);
}
.hroE__in{max-width:1040px;margin:0 auto;width:100%;color:#fff}
.hroE__tag{
  margin:0 0 22px;display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.1em;
  padding:7px 14px;border-radius:99px;background:rgba(255,255,255,.13);backdrop-filter:blur(4px);
}
.hroE__title{margin:0;font-size:clamp(30px,5.4vw,58px);line-height:1.28;font-weight:800;letter-spacing:-.02em}
.hroE__lead{margin:24px 0 0;max-width:520px;font-size:15px;line-height:2;color:rgba(255,255,255,.84)}
.hroE__btns{margin:36px 0 0;display:flex;gap:12px;flex-wrap:wrap}
.hroE__btn{
  display:inline-flex;align-items:center;height:54px;padding:0 30px;border-radius:6px;background:#fff;color:#0a2540;
  font-size:15px;font-weight:800;text-decoration:none;transition:transform .14s;
}
.hroE__btn:hover{transform:translateY(-2px)}
.hroE__btn--line{background:transparent;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
@media (max-width:560px){ .hroE__btns{flex-direction:column} .hroE__btn{justify-content:center} }