/* ========== 出張コート設営・機材レンタル・コーチ派遣 ========== */

/* 実績：最初はサムネイルだけを置き、押されたらプレーヤーに切り替える
   （YouTube のプレーヤーは読み込みが重いため、ページを開いた時点では読み込まない） */
.yt{position:relative;display:block;width:100%;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:#000;padding:0;border:0;cursor:pointer}
.yt img{width:100%;height:100%;object-fit:cover}
.yt-play{position:absolute;inset:0;margin:auto;width:68px;height:48px;border-radius:12px;background:rgba(20,20,20,.75);display:grid;place-items:center;transition:background .2s}
.yt-play::before{content:"";margin-left:4px;border-style:solid;border-width:10px 0 10px 17px;border-color:transparent transparent transparent #fff}
@media (hover:hover){.yt:hover .yt-play{background:#FF0000}}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-meta{display:grid;gap:2px;margin-top:8px}
.yt-meta time{font-family:var(--font-num);font-size:12px;font-weight:600;color:var(--c-grey)}
.yt-meta .ttl{font-size:14px;font-weight:700;line-height:1.5;color:var(--c-navy);text-decoration:underline;text-underline-offset:3px}

/* ページ末尾の相談ボタン */
.pg-end{padding:40px 16px;background:var(--c-ivory)}

@media (min-width:961px){
  .pg-hero .btns{grid-template-columns:minmax(0,320px);justify-content:center}
  .pg-end{padding:40px calc((100% - 320px)/2) 64px}
}