/* business-list only. Figma 2028:11954 / instructions 614:2510. */
.business-list .business-stage{display:flex;flex-direction:column;gap:120px}
.business-list .business-stage>.business-thumbs{display:none}
.business-list .business-main-image>img,.business-list .business-main-image picture img,.business-list .business-thumb img{object-fit:cover}
.business-list .business-main-image .texture{inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:overlay}
.business-list .business-3 .business-main-image img,.business-list .thumb-3 img{object-position:left bottom}
.business-list .business-main-image{border-radius:16px}
.business-list .business-digit-window{display:block;flex:none;width:100%;height:1.8em;overflow:hidden;color:inherit}
.business-list .business-digit{display:block;height:100%;line-height:1.8;white-space:nowrap;color:inherit}
.business-list .business-number strong{display:flex;align-items:center;flex:none;width:1.4375em;line-height:1.8;letter-spacing:0;font-variant-numeric:tabular-nums}
.business-list .business-thumb:hover{opacity:.5}
.business-list .business-thumb.active:hover{opacity:1}
@media(min-width:1248px) and (min-height:600px){
  .business-list.is-enhanced{--business-image-height:min(667px,75svh);--business-sticky-top:calc((100svh - var(--business-image-height))/2);display:block;width:min(1200px,calc(100vw - 80px));margin-left:50%;transform:translateX(-50%);height:calc(var(--business-image-height) + 270svh)}
  .business-list.is-enhanced .business-stage{display:block;position:sticky;top:var(--business-sticky-top);height:var(--business-image-height)}
  .business-list.is-enhanced .business-row{position:absolute;inset:0;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:40px;padding:0 16px;visibility:hidden;pointer-events:none;scroll-margin-top:0}
  .business-list.is-enhanced .business-row.is-active,.business-list.is-enhanced .business-row.is-exiting{visibility:visible}
  .business-list.is-enhanced .business-row.is-active{pointer-events:auto;z-index:2}
  .business-list.is-enhanced .business-info{flex:none;width:456px;min-width:0;height:444px;padding:0;font-size:16px}
  .business-list.is-enhanced .business-number{font-size:16px}
  .business-list.is-enhanced .business-row.is-exiting .business-number{visibility:hidden}
  .business-list.is-enhanced .business-text{margin-top:80px}
  .business-list.is-enhanced .business-text h3{font-size:40px;line-height:1.4;white-space:nowrap}
  .business-list.is-enhanced .business-english{font-size:16px;line-height:1.4;margin-top:-4px}
  .business-list.is-enhanced .business-description{font-size:16px;line-height:1.8;margin-top:16px}
  .business-list.is-enhanced .business-text .more{margin-top:64px}
  .business-list.is-enhanced .business-images{width:calc(var(--business-image-height) * 500 / 667 + 90px);height:var(--business-image-height);display:block;flex:none;overflow:hidden}
  .business-list.is-enhanced .business-main-image{width:calc(var(--business-image-height) * 500 / 667);height:var(--business-image-height);aspect-ratio:500/667;transform-origin:center}
  .business-list.is-enhanced .business-thumbs{position:absolute;z-index:4;right:16px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:16px;width:54px;height:245px}
  .business-list.is-enhanced .business-thumb{border:2px solid transparent;border-radius:4px;box-sizing:border-box;flex:none;width:54px;height:71px;opacity:.5;transition:opacity .35s ease;transition-delay:0s}
  .business-list.is-enhanced .business-thumb.active{opacity:1;transition-delay:.2s}
  .business-list.is-enhanced .business-thumb:focus-visible{outline:2px solid white;outline-offset:6px}
}
/* Hide the separator and total only below the desktop list breakpoint. */
@media(max-width:1247px){
  .business-number>img,.business-number>span{display:none}
}
/* Use a readable vertical flow as soon as the PC columns no longer fit. */
@media(max-width:1247px),(max-height:599px){
  .business-list{display:block}
  .business-list .business-stage{display:flex;flex-direction:column;gap:80px}
  .business-list .business-row{position:static;display:flex;flex-direction:column;align-items:stretch;gap:24px}
  .business-list .business-info{order:2;padding:0;width:auto;height:auto}
  .business-list .business-images{order:1;width:100%;display:block}
  .business-list .business-main-image{width:100%;height:auto;aspect-ratio:175/131;border-radius:12px}
  .business-list .business-thumbs{display:none}
  .business-list .business-text{margin-top:24px}
  .business-list .business-text h3{font-size:32px;line-height:1.4;white-space:normal}
  .business-list .business-english{font-size:14px;line-height:1.2}
  .business-list .business-description{font-size:14px;line-height:1.8}
  .business-list .business-text .more{margin-top:40px}
  .business-list .business-1 .business-main-image>img:first-child{width:166.82%;height:148.57%;left:-33.7%;top:-14.5%}
  .business-list .business-2 .business-main-image>img{width:203.98%;height:273.07%;left:-37%;top:-90.41%}
}
@media(prefers-reduced-motion:reduce){
  .business-list .business-thumb,.business-list .business-thumbs::after{transition:none!important}
}

/* Figma 2028:11970: invariant outer frame, separately clipped 50 x 67 image. */
.business-list .business-thumb-image{display:block;position:relative;width:100%;height:100%;overflow:hidden;border-radius:2px}
.business-list .thumb-1 .business-thumb-image>img:first-child{position:absolute;width:260%;height:auto;left:-79.9%;top:-13.15%;max-width:none}
/* Retain the original thumbnail crop box independently of replacement photo ratio. */
.business-list .thumb-2 .business-thumb-image>img{position:absolute;width:174.45%;height:auto;aspect-ratio:2400/2407;left:-18.25%;top:-19.79%;max-width:none}
.business-list .thumb-3 .business-thumb-image>img{width:100%;height:100%;object-fit:cover;object-position:left bottom}
.business-list .thumb-1 .business-thumb-image>.business-thumb-texture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:overlay;opacity:.1;pointer-events:none}

/* Keep the active border separated from the original crop proportions. */
@media(min-width:1248px) and (min-height:600px){
  .business-list.is-enhanced .business-thumb{display:grid;place-items:center}
  .business-list.is-enhanced .business-thumb.active{padding:2px}
  .business-list.is-enhanced .business-thumb.active .business-thumb-image{height:auto;aspect-ratio:50 / 67}
  .business-list.is-enhanced .thumb-3 .business-thumb-image>img{position:absolute;inset:0}
}

/* One persistent active frame moves across the unchanged thumbnail slots. */
@media(min-width:1248px) and (min-height:600px){
  .business-list.is-enhanced .business-thumbs::after{
    content:"";position:absolute;left:0;top:0;width:54px;height:71px;
    box-sizing:border-box;border:2px solid var(--blue);border-radius:4px;
    z-index:1;pointer-events:none;
    transform:translateY(var(--business-indicator-y,0px));
    transition:transform 800ms cubic-bezier(0.16,1,0.3,1);
  }
}

/* One fixed number slot; row visibility and text/image animations cannot reveal old digits. */
.business-list .business-number-shared{display:none;pointer-events:none}
.business-list .business-number-shared .business-digit-window{position:relative}
.business-list .business-number-shared .business-digit{position:absolute;inset:0;width:100%;height:100%;color:inherit}
.business-list .business-number-shared .business-digit[hidden]{display:none}
@media(min-width:1248px) and (min-height:600px){
  .business-list.is-enhanced .business-row .business-number{visibility:hidden}
  .business-list.is-enhanced .business-stage>.business-number-shared{display:flex;position:absolute;z-index:3;visibility:visible}
}