.play-film{overflow:hidden;padding:clamp(82px,9vw,136px) 0 clamp(72px,8vw,118px);background:#f1f0eb}.play-film-head{display:grid;grid-template-columns:1fr minmax(280px,.65fr);gap:clamp(40px,8vw,120px);align-items:end;margin-bottom:54px}.play-film-head small{color:var(--blue);font-family:var(--font-en);font-size:9px;font-weight:700;letter-spacing:.22em}.play-film-head h2{margin:8px 0 0;font-family:var(--font-min);font-size:clamp(45px,7vw,92px);font-weight:600;line-height:1.1;letter-spacing:.04em}.play-film-head p{margin:0;font-size:14px}.play-film-stage{position:relative;height:clamp(500px,64vw,780px);overflow:hidden;background-color:#f6f4ee;background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);background-size:8vw 8vw;isolation:isolate;touch-action:pan-y;cursor:ew-resize}.play-film-stage.is-dragging{cursor:grabbing}.play-film-back{position:absolute;z-index:0;top:50%;right:0;left:0;transform:translateY(-50%);color:#d9d6cc;text-align:center;font-family:var(--font-en);font-size:clamp(190px,39vw,610px);font-weight:700;line-height:.7;letter-spacing:-.1em;pointer-events:none}.play-film-lane{position:absolute;left:-16vw;width:132vw;transform:rotate(-7deg);transform-origin:center}.play-film-lane--1{top:15%}.play-film-lane--2{top:55%;z-index:3}.play-film-track{display:flex;width:max-content;gap:14px;will-change:transform}.play-film-card{position:relative;flex:0 0 310px;height:184px;overflow:hidden;color:#fff;background:#78909c;box-shadow:0 18px 45px rgba(0,24,36,.2);transition:transform .35s,filter .35s,box-shadow .35s}.play-film-lane--1 .play-film-card{filter:saturate(.8) brightness(.88)}.play-film-card:hover,.play-film-card:focus-visible{z-index:5;transform:scale(1.1) rotate(1deg);filter:saturate(1.08) brightness(1);box-shadow:0 28px 65px rgba(0,24,36,.3);outline:2px solid var(--blue);outline-offset:3px}.play-film-card img{height:100%;object-fit:cover}.play-film-card::after{position:absolute;inset:0;background:linear-gradient(180deg,transparent 54%,rgba(0,0,0,.68));content:""}.play-film-meta{position:absolute;z-index:2;right:12px;bottom:10px;left:12px;display:flex;align-items:end;justify-content:space-between;text-shadow:0 1px 7px #000}.play-film-meta small{font-family:var(--font-en);font-size:7px;font-weight:700;letter-spacing:.15em}.play-film-meta strong{font-family:var(--font-min);font-size:18px;font-weight:600;letter-spacing:.08em}.play-film-front{position:absolute;z-index:8;top:50%;right:-2vw;left:-2vw;transform:translateY(-50%);color:transparent;-webkit-text-stroke:1.5px rgba(0,0,0,.78);text-align:center;white-space:nowrap;font-family:var(--font-en);font-size:clamp(85px,16vw,265px);font-weight:700;line-height:.8;letter-spacing:-.065em;mix-blend-mode:multiply;pointer-events:none}.play-film-ui{position:absolute;z-index:12;right:clamp(18px,4vw,56px);bottom:24px;display:flex;align-items:center;gap:16px}.play-film-status{font-family:var(--font-en);font-size:8px;font-weight:700;letter-spacing:.16em}.play-film-pause{padding:9px 13px;border:1px solid var(--ink);background:rgba(255,255,255,.7);font-family:var(--font-en);font-size:8px;font-weight:700;letter-spacing:.13em;cursor:pointer}.play-film-pause[aria-pressed="true"]{color:#fff;background:var(--deep)}
@media(max-width:800px){.play-film-head{grid-template-columns:1fr;gap:25px}.play-film-stage{height:640px}.play-film-lane{left:-45vw;width:190vw}.play-film-card{flex-basis:250px;height:150px}.play-film-back{font-size:56vw}.play-film-front{font-size:25vw}}
@media(max-width:640px){.play-film{padding:72px 0}.play-film-head{margin-bottom:35px}.play-film-head h2 br{display:none}.play-film-stage{height:570px}.play-film-lane{left:-70vw;width:240vw}.play-film-lane--1{top:18%}.play-film-lane--2{top:56%}.play-film-card{flex-basis:220px;height:136px}.play-film-front{font-size:25vw}.play-film-ui{right:14px;bottom:15px}}
@media(prefers-reduced-motion:reduce){.play-film-card{transition:none}}