/* v09: the character ensemble supplies the motion; readable text retains v08 typography. */
.s9{--s9-ease:cubic-bezier(.2,.75,.25,1)}.s9 [data-enter]{--arrival:0ms}.s9.s9-motion-enabled [data-enter]:not(.s9-arrived){opacity:0;transform:translateY(26px)}.s9.s9-motion-enabled [data-enter].s9-entering{animation:s9-enter .7s var(--s9-ease) var(--arrival) both}.s9 .s9-friends{padding:40px 0 52px;background:#c9e5d3;position:relative}.s9-friends-head{display:flex;align-items:end;justify-content:space-between;gap:36px}.s9-friends-head h2{font-size:34px;letter-spacing:-.035em;line-height:1.5}.s9-friends-head p{font-size:16px;line-height:1.9}.s9 .s9-friends-head .s8-kicker{font-size:13px;margin-bottom:9px}.s9-cast-stage{position:relative;margin:30px 0 0}.s9-ribbon{position:absolute;left:0;right:0;top:54px;overflow:hidden;pointer-events:none;transform:rotate(-3deg);opacity:.35}.s9-ribbon span{display:block;white-space:nowrap;font:700 clamp(45px,6vw,88px)/1.3 Outfit,sans-serif;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1px #72957b;transform:translateX(var(--ribbon-x,-50px));will-change:transform}.s9-cast{position:relative;list-style:none;margin:0;padding:42px 0 26px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;align-items:end}.s9-cast-item{min-width:0}.s9-friend{position:relative;width:100%;display:block;padding:0;border:0;background:transparent;color:#174b35;text-align:center;isolation:isolate}.s9-friend-portrait{display:block;height:200px;position:relative}.s9-friend-ground{position:absolute;left:12%;right:12%;bottom:10px;height:56px;border-radius:50%;background:var(--friend-color);box-shadow:0 5px 0 #174b3512;transform:rotate(-8deg);transition:transform .25s}.s9-doll-wrap{position:absolute;inset:0;display:grid;place-items:center;transform:translate3d(var(--mouse-x,0px),var(--mouse-y,0px),0);transition:transform .24s ease-out}.s9 .s9-friend .s9-doll{max-width:none;width:124%;height:auto;transform-origin:50% 82%;pointer-events:none;filter:drop-shadow(0 9px 6px #174b3519)}.s9-friend[data-character="sakura"] .s9-doll{width:130%}.s9-friend[data-character="whale"] .s9-doll{width:145%}.s9-friend-name{display:block;position:relative;margin-top:8px;font-size:14px;line-height:1.6;font-weight:500;white-space:nowrap}.s9-friend-tap{display:block;font:500 10px/1.7 Outfit,sans-serif;letter-spacing:.12em;margin-top:6px;opacity:.7}.s9-motion-enabled .s9-friend:hover .s9-friend-ground,.s9-motion-enabled .s9-friend:focus-visible .s9-friend-ground{transform:rotate(4deg) scale(1.1)}.s9-friend-speech,.s9-service-speech{position:absolute;z-index:6;font-size:14px;font-weight:500;line-height:1.6;background:#fffefa;color:#174b35;border:1px solid #b2c6b3;border-radius:18px;padding:13px 17px;box-shadow:0 4px 0 #174b350d;pointer-events:none}.s9-friend-speech{width:180px;bottom:calc(100% - 4px);left:50%;transform:translateX(-50%)}.s9-friend-speech:after,.s9-service-speech:after{content:"";position:absolute;left:50%;bottom:-7px;width:12px;height:12px;background:#fffefa;border-right:1px solid #b2c6b3;border-bottom:1px solid #b2c6b3;transform:rotate(45deg)}.s9-friends-foot{display:flex;justify-content:flex-end;align-items:center;gap:24px}.s9-friends-foot .s8-text-link{font-size:14px}.s9-swipe-hint{display:none;font-size:13px}.s9 .s9-service-stage{width:100%;padding:0;border:0;display:block;text-align:center;isolation:isolate;cursor:pointer;overflow:hidden}.s9-service-stage .s9-doll-wrap{inset:-25px 0 -22px;z-index:1}.s9 .s9-service-stage .s9-doll{width:290px;max-width:none;height:auto;filter:drop-shadow(0 10px 6px #174b351c);transform-origin:50% 82%;pointer-events:none}.s9-stage-orbit{position:absolute;inset:16px 24px;border:1px solid #174b3533;border-radius:50%;transform:rotate(-14deg)}.s9-stage-hello{position:absolute;right:16px;bottom:12px;z-index:3;font:500 10px/1.3 Outfit,sans-serif;letter-spacing:.09em;padding:7px 8px;background:#fffefa99;border-radius:10px}.s9-stage-hello b{font-size:16px;margin-left:5px}.s9-service-speech{left:50%;top:12px;transform:translateX(-50%);width:max-content;max-width:90%}.s9-company-friend{width:115px;height:105px;position:relative;display:block;margin-bottom:-8px;flex:none}.s9-company-friend img{position:absolute;width:135px;max-width:none;top:-20px;left:-8px}.s9-work-more{position:relative;min-height:100px;padding-top:10px}.s9-work-whale{position:absolute;left:calc(50% - 355px);top:-55px;width:200px;height:155px;pointer-events:none}.s9-work-whale img{width:220px;max-width:none}.s9-contact-friend{position:absolute;bottom:-92px;left:-18px;width:230px;height:254px;pointer-events:none}.s9-contact-friend img{position:absolute;top:0;left:-15px;width:280px;max-width:none;transform-origin:50% 85%}.s9-about-friend{animation-name:none}.s9.s9-motion-enabled .s9-about-friend.s9-in-view img{animation:s9-sakura-wave 5s ease-in-out infinite;transform-origin:55% 88%}.s9.s9-motion-enabled [data-idle="sway"].s9-in-view .s9-doll{animation:s9-sway 5s ease-in-out var(--phase,-1s) infinite}.s9.s9-motion-enabled [data-idle="robot"].s9-in-view .s9-doll{animation:s9-robot 4.8s ease-in-out var(--phase,-.4s) infinite}.s9.s9-motion-enabled [data-idle="hop"].s9-in-view .s9-doll{animation:s9-hop 4.2s ease-in-out var(--phase,-1.5s) infinite}.s9.s9-motion-enabled [data-idle="swim"].s9-in-view .s9-doll{animation:s9-swim 5.8s ease-in-out var(--phase,-2s) infinite}.s9.s9-motion-enabled [data-idle].s9-react .s9-doll{animation:s9-hello .85s ease-in-out both}.s9.s9-motion-enabled [data-idle="swim"].s9-react .s9-doll{animation:s9-whale-hello 1s ease-in-out both}.s9.s9-stopped .s9-doll-wrap,.s9.s9-stopped .s9-friend-ground{transition:none!important}.s9.s9-stopped .s9-doll,.s9.s9-stopped .s9-about-friend img{animation-play-state:paused!important}.s9-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.s9 .s9-motion-control{position:fixed;right:24px;bottom:22px;z-index:60;display:flex;align-items:center;gap:9px;min-height:44px;border:1px solid #a9c1aa;border-radius:30px;background:#fffefaf2;backdrop-filter:blur(8px);color:#174b35;padding:10px 18px;font-size:13px;font-weight:500;box-shadow:0 4px 20px #174b3512}.s9-motion-control>span{font:500 16px/1 Outfit,sans-serif}.s9-footer-pad{padding-bottom:62px}
@keyframes s9-enter{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes s9-sway{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(3deg) translateY(-7px)}}
@keyframes s9-robot{0%,45%,100%{transform:translateY(0) rotate(-2deg)}55%{transform:translateY(-10px) rotate(3deg)}65%{transform:translateY(0) rotate(0)}75%{transform:translateY(-6px) rotate(-2deg)}85%{transform:translateY(0) rotate(-2deg)}}
@keyframes s9-hop{0%,45%,100%{transform:rotate(2deg) translateY(0)}55%{transform:rotate(-4deg) translateY(-12px)}65%{transform:rotate(1deg) translateY(0)}75%{transform:rotate(-2deg) translateY(-6px)}85%{transform:rotate(2deg) translateY(0)}}
@keyframes s9-swim{0%,100%{transform:translate(-8px,3px) rotate(-4deg)}50%{transform:translate(9px,-13px) rotate(4deg)}}
@keyframes s9-sakura-wave{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(1deg) translateY(-8px)}}
@keyframes s9-hello{0%,100%{transform:translateY(0) rotate(0)}20%{transform:translateY(2px) scale(1.02,.98)}42%{transform:translateY(-22px) rotate(-8deg)}62%{transform:translateY(-15px) rotate(8deg)}80%{transform:translateY(0) rotate(-2deg)}}
@keyframes s9-whale-hello{0%,100%{transform:translate(0,0) rotate(0)}40%{transform:translate(-15px,-28px) rotate(-13deg)}70%{transform:translate(12px,-8px) rotate(8deg)}}
@media(max-width:1100px){.s9-friends-head{align-items:start;flex-direction:column;gap:16px}.s9-friends-head h2{font-size:32px}.s9-cast-frame{width:100%;padding-inline:40px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#79a084 transparent}.s9-cast{display:flex;gap:10px;width:max-content;padding-top:76px}.s9-cast-item{width:155px;scroll-snap-align:center}.s9-friend-portrait{height:200px}.s9-ribbon{top:83px}.s9-friends-foot{justify-content:space-between;padding-top:16px}.s9-swipe-hint{display:block}.s9-service-stage .s9-doll-wrap{inset:-12px 0 -20px}.s9 .s9-service-stage .s9-doll{width:260px}.s9-contact-friend{left:-30px;width:170px}.s9-contact-friend img{width:235px;top:28px}.s9-work-whale{left:calc(50% - 320px);width:170px;top:-35px}.s9-work-whale img{width:190px}}
@media(max-width:800px){.s9-friends{padding-top:32px}.s9-friends-head h2{font-size:30px}.s9-friends-head p{font-size:16px}.s9-cast-frame{padding-inline:32px}.s9-company-friend{display:none}.s9-work-whale{left:calc(50% - 290px);width:145px;top:-25px}.s9-work-whale img{width:160px}.s9-contact-friend{left:-55px;width:155px;height:220px}.s9-contact-friend img{width:210px}}
@media(max-width:560px){.s9 .s9-friends{padding:26px 0 38px}.s9-friends-head{gap:14px}.s9-friends-head h2{font-size:27px;line-height:1.5}.s9-friends-head p{font-size:15px}.s9-cast-stage{margin-top:8px}.s9-cast-frame{padding-inline:20px}.s9-cast{padding-top:73px;padding-bottom:16px;gap:16px}.s9-cast-item{width:154px}.s9-friend-portrait{height:194px}.s9-friend-speech{width:160px;font-size:13px;padding:11px 12px}.s9-friend-name{font-size:14px}.s9-friends-foot{align-items:start;flex-direction:column;gap:12px;padding-top:16px}.s9-friends-foot .s8-text-link{font-size:14px}.s9-ribbon{top:100px}.s9-ribbon span{font-size:58px}.s9 .s9-service-stage .s9-doll{width:280px}.s9-service-stage .s9-doll-wrap{inset:-18px 0 -18px}.s9-work-whale{position:relative;display:block;left:auto;top:auto;width:130px;height:110px;margin:0 auto 10px}.s9-work-whale img{position:absolute;width:175px;left:-20px;top:-38px}.s9-work-more{padding-top:0}.s9-contact-friend{bottom:-145px;left:0;width:132px;height:137px}.s9-contact-friend img{width:175px;left:-24px;top:-12px}.s9 .s8-contact-cat>span{display:none}.s9 .s9-motion-control{right:12px;bottom:12px;font-size:12px;padding:9px 13px;min-height:42px}.s9 .s8-footer{padding-bottom:74px}}
@media(prefers-reduced-motion:reduce){.s9 [data-enter]{opacity:1!important;transform:none!important;animation:none!important}.s9 .s9-doll,.s9 .s9-about-friend img{animation:none!important}.s9 .s9-doll-wrap,.s9 .s9-ribbon span{transform:none!important}.s9 *{transition:none!important}}