@charset "utf-8";
/*
 * Skin for VideoJS
 * http://videojs.com
 *
 */

.playerArea{
  position: relative;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 3rem;
}

/* 再生ボタンを完全にリセット＆再構築 */
.video-js .vjs-big-play-button {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  /* border: 3px solid #fff !important; */
  background-color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0 !important; /* フォントサイズを0に */
  line-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  z-index: 10 !important;
  text-indent: -9999px !important; /* テキストを画面外に */
  overflow: hidden !important;
}
/* すべての子要素を強制非表示 */
.video-js .vjs-big-play-button > * {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
}

/* 疑似要素も念のためリセット */
.video-js .vjs-big-play-button *:before,
.video-js .vjs-big-play-button *:after {
  display: none !important;
  content: none !important;
}

/* 新しい再生アイコンのみ表示 */
.video-js .vjs-big-play-button::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-40%, -50%) !important;
  width: 0 !important;
  height: 0 !important;
  border-left: 20px solid #000 !important; /* 白 → 黒に変更 */
  border-top: 12px solid transparent !important;
  border-bottom: 12px solid transparent !important;
  border-right: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
}