@charset "utf-8";



.dock-video-wrap { background: rgb(247, 246, 243); padding: 0px; margin: 0px -48px; font-family: Helvetica, Arial, sans-serif; }



.dock-video-inner { max-width: 860px; margin: 0px auto; padding: 0px 24px; }



.dock-video-player { position: relative; border-radius: 20px; overflow: hidden; background: rgb(17, 17, 17); aspect-ratio: 16 / 9; border: 3px solid rgb(229, 213, 183); cursor: pointer; }



.dock-video-player video { width: 100%; height: 100%; object-fit: cover; display: block; }



.dock-video-overlay { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.2); transition: opacity 0.25s; cursor: pointer; z-index: 10; }



.dock-video-play-btn { width: 72px; height: 72px; border-radius: 50%; background: rgb(255, 255, 255); display: flex; align-items: center; justify-content: center; pointer-events: none; }



.dock-video-dur { position: absolute; bottom: 16px; right: 20px; font-size: 12px; font-weight: 600; color: rgba(255, 255, 255, 0.55); letter-spacing: 0.06em; font-family: Helvetica, Arial, sans-serif; pointer-events: none; line-height: 1.5; }



.dock-video-label { position: absolute; bottom: 16px; left: 20px; font-size: 11px; font-weight: 400; color: rgba(255, 255, 255, 0.35); text-transform: uppercase; letter-spacing: 0.1em; font-family: Helvetica, Arial, sans-serif; pointer-events: none; line-height: 1.5; }



@media (max-width: 720px) {

  .dock-video-wrap { margin: 0px -24px; padding: 0px; }

  .dock-video-inner { padding: 0px 16px; }

  .dock-video-player { border-radius: 14px; border-width: 2px; }

}