.place-detail-video {
  width: 100%;
  padding-top: 48px;
}

.place-detail-video__frame {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  background: var(--semantic-bg);
}

.place-detail-video__media {
  position: relative;
  width: min(100%, 450px);
  max-height: 600px;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: var(--radius-sm);
}

.place-detail-video__thumbnail {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.place-detail-video__sound {
  position: absolute;
  top: var(--spacing-sm);
  right: var(--spacing-sm);
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: var(--radius-full);
  background: transparent;
  cursor: pointer;
}

.place-detail-video__sound img {
  width: 30px;
}

.place-detail-video__sound:focus-visible {
  outline: var(--stroke-2) solid var(--semantic-white);
  outline-offset: var(--stroke-2);
}
