@charset "utf-8";
/* CSS Document */

.yt-lite{position:relative;display:block;max-width:900px;margin:1rem auto;background:#000;cursor:pointer}
  /* 16:9 アスペクト比。aspect-ratio対応ブラウザで軽量に */
  .yt-lite{aspect-ratio:16/9}
  /* 古いブラウザへのフォールバック */
  .yt-lite::before{content:"";display:block;padding-top:56.25%}
  .yt-lite > img,.yt-lite > button{position:absolute;inset:0}
  .yt-lite > img{width:100%;height:100%;object-fit:cover}
  .yt-lite > button{
    margin:auto;width:68px;height:48px;border:0;border-radius:12px;background:rgba(0,0,0,.6);
    display:flex;align-items:center;justify-content:center;transition:transform .15s ease
  }
  .yt-lite > button::before{
    content:"";display:block;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #fff;
    margin-left:4px
  }
  .yt-lite:hover > button{transform:scale(1.06)}
  .yt-lite[data-loaded="1"]::before{padding-top:0} /* iframeに置換後、フォールバック無効化 */