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

.hroB{
  --acc:#635bff; --ink:#0a2540; --body:#374151; --sub:#4b5563; --line:#e6e9ee;
  background:#fff;padding:clamp(56px,7vw,104px) 24px;
  font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
}
.hroB__in{
  max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(32px,5vw,72px);align-items:center;
}
.hroB__eyebrow{margin:0 0 18px;font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--acc)}
.hroB__title{margin:0;font-size:clamp(28px,4vw,46px);line-height:1.3;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.hroB__lead{margin:20px 0 0;font-size:15.5px;line-height:1.95;color:var(--body)}
.hroB__form{margin:30px 0 0;display:flex;gap:8px}
.hroB__input{
  flex:1;min-width:0;height:50px;padding:0 14px;border:0;border-radius:8px;font-size:14.5px;
  color:var(--body);background:#f6f9fc;box-shadow:inset 0 0 0 1px var(--line);outline:none;
}
.hroB__input:focus{box-shadow:inset 0 0 0 1px var(--acc),0 0 0 3px rgba(99,91,255,.16)}
.hroB__btn{
  height:50px;padding:0 22px;border:0;border-radius:8px;background:var(--acc);color:#fff;
  font-size:14.5px;font-weight:700;cursor:pointer;white-space:nowrap;
  box-shadow:0 4px 14px -4px rgba(99,91,255,.5);
}
.hroB__note{margin:14px 0 0;font-size:12.5px;color:var(--sub)}

.hroB__visual{
  position:relative;border-radius:16px;padding:clamp(24px,3vw,40px);
  background:linear-gradient(140deg,#eef0ff 0%,#f6f9fc 46%,#e8f6ff 100%);
}
.hroB__card{
  background:#fff;border-radius:12px;padding:20px;
  box-shadow:0 1px 2px rgba(10,37,64,.06),0 12px 32px -12px rgba(10,37,64,.28);
}
.hroB__cardHead{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--sub)}
.hroB__dot{width:7px;height:7px;border-radius:50%;background:var(--acc)}
.hroB__bars{margin:20px 0 0;display:flex;align-items:flex-end;gap:8px;height:118px}
.hroB__bars i{
  flex:1;height:var(--h);border-radius:4px 4px 2px 2px;
  background:linear-gradient(180deg,var(--acc),#a9a4ff);opacity:.9;
}
.hroB__bars i:last-child{opacity:1}
.hroB__stat{margin:18px 0 0;display:flex;align-items:baseline;gap:8px}
.hroB__stat b{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.hroB__stat span{font-size:12px;color:var(--sub)}
@media (max-width:820px){
  .hroB__in{grid-template-columns:1fr}
  .hroB__visual{order:2}
}
@media (max-width:520px){
  .hroB__form{flex-direction:column}
  .hroB__btn{width:100%}
}