body.no-scroll{
  overflow: hidden;
}
.p-movie .u-archive__wrap {
  grid-template-columns: 1fr;
}
.p-movie .u-archive__wrap .u-movie__item {
  position: static;
  line-height: normal;
  overflow: auto;
}
.p-movie .u-archive__wrap .u-movie__item::after {
  content: none;
}
.p-movie .u-archive__wrap .u-movie__item video, .p-movie .u-archive__wrap .u-movie__item iframe {
  width: auto;
  max-width: 100%;
  height: 100vh;
}
.p-movie .u-archive__wrap .u-movie__item iframe {
  min-width: 44rem;
}

.u-movie__flex {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.u-movie__tag {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.u-movie__tag li {
  font-size: 1.8rem;
  padding: 0.2rem 1.5rem;
  background-color: var(--c-white);
  border-radius: 6rem;
  border: 1px solid var(--c-black);
  line-height: normal;
}
.u-movie__tag li.-green {
  background-color: var(--c-green);
  color: var(--c-white);
  border-color: var(--c-green);
}

.u-movie__storename {
  font-size: 2.8rem;
}

.u-movie__thumb {
  position: relative;
}
/* サムネイルがvideoタグの場合は再生ボタンを非表示 */
/* .u-movie__thumb:has(video)::after {
  display: none;
} */
.u-movie__thumb::after {
  content: "";
  display: block;
  width: 7.2rem;
  height: 7.2rem;
  background: url(../../images/common/icn-movieplay.png) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.u-movie__thumb img {
  width: 100%;
  height: 115.2rem;
  object-fit: cover;
}
.u-movie__thumb video {
  width: 100%;
  height: 115.2rem;
  object-fit: cover;
  pointer-events: none;
}

.u-movie__popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100vh;
}
.u-movie__popup.active {
  display: block;
}
.u-movie__popup .u-movie__flex {
  position: absolute;
  bottom: 8rem;
  left: 0;
  z-index: 6;
  padding: 0 3rem;
  width: 100%;
}
.u-movie__popup .u-movie__storename {
  color: var(--c-white);
  text-shadow: 1px 1px 2px black;
}

.u-popupmovie {
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.u-movie__popup--bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
}

.u-movie__popup--close {
  position: absolute;
  right: 3rem;
  top: 3rem;
  font-size: 6rem;
  color: var(--c-white);
  z-index: 999;
  cursor: pointer;
}

.u-movie__comment {
  width: 100%;
  font-size: 3rem;
  color: var(--c-white);
  text-shadow: 1px 1px 2px black;
}

.u-movie__storelink{
  position: absolute;
  top: -8rem;
  right: 3rem;
  z-index: 6;
  width: 6rem
}

/* モーダル内の動画表示を統一 */
.u-popupmovie video {
  width: 100%;
  height: 100vh;
  object-fit: contain;
  display: block;
}

/* 店舗詳細ページでのスライド式動画表示(サムネイルのみ) */
.p-shoppaid .u-movie__wrap,
.p-shopfree .u-movie__wrap {
  display: flex;
  gap: 2rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1rem;
}

.p-shoppaid .u-movie__item,
.p-shopfree .u-movie__item {
  flex: 0 0 auto;
  width: 45rem;
  scroll-snap-align: start;
  position: static;
  line-height: normal;
  overflow: visible;
}

/* サムネイルのみサイズ指定(モーダル内は除外) */
.p-shoppaid .u-movie__wrap .u-movie__thumb,
.p-shopfree .u-movie__wrap .u-movie__thumb {
  width: 45rem;
  height: 80rem;
  margin-bottom: 1.6rem;
}

.p-shoppaid .u-movie__wrap .u-movie__thumb img,
.p-shopfree .u-movie__wrap .u-movie__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-shoppaid .u-movie__wrap .u-movie__thumb video,
.p-shopfree .u-movie__wrap .u-movie__thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

/* モーダル内の要素は画面いっぱいに */
.p-shoppaid .u-movie__popup,
.p-shopfree .u-movie__popup {
  width: 100vw !important;
  height: 100vh !important;
}

.p-shoppaid .u-popupmovie video,
.p-shopfree .u-popupmovie video {
  width: 100vw !important;
  height: 100vh !important;
  object-fit: contain;
}

@media (max-width: 767px) {
  .p-movie .u-archive__wrap .u-movie__item video, .p-movie .u-archive__wrap .u-movie__item iframe {
    width: 100%;
    max-width: 100%;
    height: 100vh;
  }
  .p-movie .u-archive__wrap .u-movie__item iframe {
    min-width: initial;
  }

  .u-movie__tag li{
	font-size: 2.2rem;
    padding: 0.4rem 2rem 0.1rem;
  }

  /* .p-shoppaid .u-movie__item,
  .p-shopfree .u-movie__item {
    width: 80vw;
  }

  .p-shoppaid .u-movie__wrap .u-movie__thumb,
  .p-shopfree .u-movie__wrap .u-movie__thumb {
    width: 80vw;
    height: auto;
    margin-bottom: 1rem;
  } */
}

/* トップページでのスライド式動画表示(サムネイルのみ) */
.home .u-movie__wrap {
  display: flex;
  gap: 2rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1rem;
}

.home .u-movie__item {
  flex: 0 0 auto;
  width: 45rem;
  scroll-snap-align: start;
  position: static;
  line-height: normal;
  overflow: visible;
}

/* サムネイルのみサイズ指定(モーダル内は除外) */
.home .u-movie__wrap .u-movie__thumb {
  width: 45rem;
  height: 80rem;
  margin-bottom: 1rem;
}

.home .u-movie__wrap .u-movie__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home .u-movie__wrap .u-movie__thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

/* モーダル内の要素は画面いっぱいに */
.home .u-movie__popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 999;
}

.home .u-popupmovie video {
  width: 100vw;
  height: 100vh;
  object-fit: contain;
}

@media (max-width: 767px) {
  .home .u-movie__item, .p-shoppaid .u-movie__item, .p-shopfree .u-movie__item {
    width: 56vw;
  }

  .home .u-movie__wrap .u-movie__thumb, .p-shoppaid .u-movie__wrap .u-movie__thumb, .p-shopfree .u-movie__wrap .u-movie__thumb {
    width: 56vw;
    height: 100vw;
  }

  .u-movie__storelink{
    width: 8rem;
  }
}

