/* s-video-001: 動画セクション */

.s-video-001 {
  padding-top: var(--wp--preset--spacing--3-xl);
  padding-bottom: var(--wp--preset--spacing--3-xl);
  background-color: var(--wp--preset--color--white);

  .c-heading-001 {
    margin-bottom: var(--wp--preset--spacing--xl);
  }

  /* セクション見出しのオーバーライド */
  .c-heading-001 .c-heading-001__en {
    color: var(--wp--preset--color--secondary);
    font-family: var(--wp--preset--font-family--noto-serif);
    font-style: italic;
    font-size: var(--wp--preset--font-size--2-xl);
    letter-spacing: var(--wp--custom--letter-spacing--normal);
    text-transform: none;
  }

  .s-video-001__description {
    text-align: center;
    color: var(--wp--preset--color--gray-dark);
    font-size: var(--wp--preset--font-size--sm);
    margin-bottom: var(--wp--preset--spacing--xl);
  }

  .s-video-001__player-wrap {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* レスポンシブ */
@media (max-width: 781px) {
  .s-video-001 {
    padding-top: var(--wp--preset--spacing--2-xl);
    padding-bottom: var(--wp--preset--spacing--2-xl);
  }
}

/* ══════════════════════════════════════════════════
   背景
   ══════════════════════════════════════════════════ */

/** @element root  @group 背景  @label グレー  @order 1 */
.s-video-001--bg-gray {
  background-color: var(--wp--preset--color--gray-lightest);
}

/** @element root  @group 背景  @label ダーク  @order 2 */
.s-video-001--bg-dark {
  background-color: var(--wp--preset--color--gray-darkest);
  color: var(--wp--preset--color--white);
}
.s-video-001--bg-dark .s-video-001__description {
  color: var(--wp--preset--color--gray-lighter);
}

/* ══════════════════════════════════════════════════
   動画幅
   ══════════════════════════════════════════════════ */

/** @element root  @group 動画幅  @label 狭め  @order 1 */
.s-video-001--narrow .s-video-001__player-wrap {
  max-width: 640px;
}

/** @element root  @group 動画幅  @label 全幅  @order 2 */
.s-video-001--wide .s-video-001__player-wrap {
  max-width: none;
}