/* TOP画の背景で流れる動画（herovideo.js） */
.hv-layer{position:absolute;inset:0;z-index:0;overflow:hidden;opacity:0;transition:opacity .9s ease;pointer-events:none;background:#000}
.hv-on .hv-layer{opacity:1}
.hv-layer iframe{position:absolute;top:50%;left:50%;border:0;transform:translate(-50%,-50%);
  width:max(var(--w,100vw),calc(var(--h,100vh) * 16 / 9));height:max(var(--h,100vh),calc(var(--w,100vw) * 9 / 16))}
.hv-hint{display:inline-flex;align-items:center;gap:12px;margin-top:26px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.45);color:#fff;border-radius:999px;padding:7px 20px 7px 7px;cursor:pointer;font:inherit;font-size:13px;letter-spacing:.04em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .2s}
.hv-hint:hover,.hv-hint[aria-pressed=true]{background:rgba(255,255,255,.26)}
.hv-hint i{width:32px;height:32px;border-radius:50%;background:#fff;display:grid;place-items:center;font-style:normal;font-size:11px;color:var(--hv-c,#e5556f);padding-left:2px;flex:none}
.hv-hint[aria-pressed=true] i{padding-left:0}
.hv-hint[aria-pressed=true] i:before{content:"❚❚";font-size:9px}
.hv-hint[aria-pressed=true] i b{display:none}
.hv-links{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.hv-yt{color:#fff;font-size:12px;text-decoration:underline;opacity:.85;margin-top:26px}
.hv-yt:hover{opacity:1}
/* 再生中は写真の上の暗いかぶせを少し弱めて、動画を見やすくする */
.hv-on:after{opacity:.55;transition:opacity .9s}
@media (max-width:640px){.hv-hint{font-size:12px;padding-right:14px}.hv-yt{margin-top:0}.hv-links{gap:10px}}
