.why9{position:relative;overflow:hidden;background:linear-gradient(180deg,#f6f9ff 0%,#fdfeff 100%);padding:64px 0 52px}
.w9-mark{position:absolute;right:-3%;top:-4%;width:min(34vw,460px);opacity:.07;pointer-events:none}
.why9 .wrap{max-width:1320px;position:relative}
.w9-head{padding-bottom:6px}
.w9-stage{position:relative;container-type:inline-size;aspect-ratio:1448/700;margin-top:-1cqw}
.w9-path{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.w9c{position:absolute;z-index:1;background:#fff;border-radius:2.1cqw;box-shadow:0 2cqw 4.6cqw rgba(21,70,160,.1),0 .2cqw .6cqw rgba(21,70,160,.06);padding:1.9cqw 1.7cqw 1.8cqw}
.w9c h3{font-size:max(15px,1.42cqw);line-height:1.22;letter-spacing:-0.015em;margin-bottom:.8cqw;margin-top:.2cqw}
.w9c p{font-size:max(12.5px,1.12cqw);line-height:1.45;color:var(--muted)}
.w9n{position:absolute;left:1.5cqw;top:-1.2cqw;width:2.5cqw;height:2.5cqw;min-width:30px;min-height:30px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;font-size:max(13px,1.15cqw);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 .35cqw #fff,0 .6cqw 1.4cqw rgba(21,112,239,.35)}
.w9-ico{position:absolute;filter:drop-shadow(0 1.2cqw 1.6cqw rgba(21,70,160,.14))}
.w9-ill{width:100%;height:auto;display:block}
.w9c1{left:3.8cqw;top:11.6cqw;width:19.7cqw}
.w9c1 .w9-ico{left:5.9cqw;top:-8.3cqw;width:10.9cqw}
.w9c1 h3{margin-top:1.4cqw}
.w9c2{left:25.3cqw;top:28.7cqw;width:19.9cqw}
.w9c2 .w9-ico{left:6.4cqw;top:-8.6cqw;width:10.4cqw}
.w9c3{left:44.4cqw;top:8.4cqw;width:19.6cqw}
.w9c3 .w9-ico{left:4.3cqw;top:-7.5cqw;width:12.6cqw}
.w9c4{left:59.7cqw;top:29.3cqw;width:21.3cqw}
.w9c4 .w9-ico{left:5cqw;top:-7.3cqw;width:10.2cqw}
.w9c5{left:79.1cqw;top:14.5cqw;width:18cqw}
.w9c5 .w9-ico{left:4.8cqw;top:-7.2cqw;width:9.3cqw}
.w9c1 h3,.w9c2 h3,.w9c3 h3,.w9c4 h3,.w9c5 h3{margin-top:1.8cqw}
.w9c3 h3,.w9c5 h3{margin-top:1.6cqw}
.js .why9 .w9c{opacity:0;transform:translateY(24px) scale(.97)}
.js .why9.in .w9c{animation:w9Pop .8s cubic-bezier(.2,.9,.3,1.1) both}
.js .why9.in .w9c1{animation-delay:.1s}
.js .why9.in .w9c2{animation-delay:.9s}
.js .why9.in .w9c3{animation-delay:1.7s}
.js .why9.in .w9c4{animation-delay:2.5s}
.js .why9.in .w9c5{animation-delay:3.3s}
@keyframes w9Pop{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
.js .why9 .w9draw{stroke-dasharray:1;stroke-dashoffset:1}
.js .why9.in .w9draw{animation:w9Draw .9s cubic-bezier(.5,0,.3,1) forwards}
.js .why9.in mask:nth-of-type(1) .w9draw{animation-delay:.5s}
.js .why9.in mask:nth-of-type(2) .w9draw{animation-delay:2.1s}
.js .why9.in mask:nth-of-type(3) .w9draw{animation-delay:2.9s}
@keyframes w9Draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.js .why9 .w9dots circle{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(0)}
.js .why9.in .w9dots circle{animation:w9Dot .5s cubic-bezier(.2,1.4,.4,1) both}
.js .why9.in .w9dots circle:nth-child(1){animation-delay:.4s}
.js .why9.in .w9dots circle:nth-child(2){animation-delay:1.3s}
.js .why9.in .w9dots circle:nth-child(3){animation-delay:2.1s}
.js .why9.in .w9dots circle:nth-child(4){animation-delay:2.9s}
@keyframes w9Dot{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}
.w9-ico{animation:w9Float 6s ease-in-out infinite alternate}
.w9c2 .w9-ico{animation-delay:-1.5s}
.w9c3 .w9-ico{animation-delay:-3s}
.w9c4 .w9-ico{animation-delay:-4.5s}
@keyframes w9Float{from{translate:0 0}to{translate:0 -.7cqw}}
@media (min-width:981px) and (max-width:1180px){
  .w9c h3{font-size:max(13px,1.3cqw)}
  .w9c p{font-size:max(11.5px,1.02cqw);line-height:1.4}
  .w9c{padding:1.7cqw 1.4cqw 1.6cqw}
  .w9c4{width:19.2cqw}
  .w9c5{left:79.6cqw;width:17.8cqw}
  .w9-stage{aspect-ratio:1448/760}
}
@media (max-width:980px){
  .why9{padding:56px 0 48px}
  .w9-stage{aspect-ratio:auto;container-type:normal;display:grid;gap:22px;margin-top:26px;padding-left:22px}
  .w9-path{display:none}
  .w9-stage::before{content:"";position:absolute;left:5px;top:20px;bottom:20px;border-left:3px dashed #9dbcf2}
  .w9c{position:relative;left:auto !important;top:auto !important;width:auto !important;display:grid;grid-template-columns:1fr 92px;grid-template-areas:"t i" "p i";column-gap:14px;border-radius:22px;padding:18px 16px 16px 18px;box-shadow:0 14px 34px rgba(21,70,160,.1)}
  .w9c h3{grid-area:t;font-size:18px !important;margin:0 0 6px !important}
  .w9c h3 br{display:none}
  .w9c{min-width:0}
  .w9c p{grid-area:p;font-size:14px !important}
  .w9-ico{position:relative;grid-area:i;left:auto !important;top:auto !important;width:92px !important;align-self:center;animation:none;filter:none}
  .w9n{left:-36px;top:20px;width:30px;height:30px;font-size:14px;box-shadow:0 0 0 4px #f6f9ff}
}
@media (prefers-reduced-motion:reduce){
  .js .why9 .w9c{opacity:1;transform:none;animation:none}
  .js .why9 .w9draw{stroke-dashoffset:0;animation:none}
  .js .why9 .w9dots circle{opacity:1;transform:none;animation:none}
  .w9-ico{animation:none}
}