.hosting-visual{position:relative;isolation:isolate;display:block;width:100%;aspect-ratio:3/2;margin:0;overflow:hidden;border:1px solid #E8EAEB;border-radius:20px;background:#F7F7F7}
.hosting-visual>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.hosting-visual>figcaption{position:absolute;left:12px;bottom:10px;padding:4px 7px;background:#FFFFFFE8;border:1px solid #181A1B0D;border-radius:4px;color:#58605B;font-size:8px;line-height:1.5;letter-spacing:.1px}
.service-visual--web-hosting{display:block;background:#F5F5F5}
.service-visual--web-hosting:after{display:none}
.service-visual--web-hosting>.hosting-visual{width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0}
.service-visual--web-hosting .hosting-visual>img{object-fit:contain;transition:transform .4s ease}
.service-visual--web-hosting .hosting-visual>figcaption{display:none}
.hosting-hero-grid>.hosting-visual{border:0;box-shadow:none}
.hero-hosting-product{position:absolute;z-index:2;right:4%;top:25%;width:49%;pointer-events:none}
.hero-hosting-product>.hosting-visual{border-color:#FFFFFF24;box-shadow:0 24px 70px #00000024}
@media(max-width:1100px){.hero-hosting-product{top:35%;right:3%;width:45%}}
@media(max-width:760px){.hero-hosting-product{top:auto;bottom:10%;right:5%;width:58%}.hosting-visual{border-radius:14px}}

@media(min-width:1101px){.hosting-hero-grid{grid-template-columns:.95fr 1.1fr;gap:44px}}