/** @format */

@charset "utf-8";

/*========= モーダル表示のためのCSS ===============*/

/*動画表示のモーダルの余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper {
  padding: 0;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after,
.modaal-close:before {
  background: #fc4100;
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before {
  background: #fc4100;
}

.modaal-container {
  overflow: hidden;
  scrollbar-color: #000;
  scrollbar-width: none;
}

.modaal-container::-webkit-scrollbar {
  display: none;
  /*Google Chrome、Safari、Microsoft Edge対応のスクロールバー非表示コード*/
}

.modaal-iframe .modaal-content ::-webkit-scrollbar {
  display: none; /*Google Chrome、Safari、Microsoft Edge対応のスクロールバー非表示コード*/
}

.opmovie_box {
  width: 100%;
  max-height: 80vh;
  margin: 0 auto;
  aspect-ratio: 9 / 16;
  margin: 0 auto;
  scrollbar-width: none;
  padding: 0;
}

@media screen and (max-width: 750px) {
  .opmovie_box {
    width: 100%;
    max-height: 200vh;
    margin: 0 auto;
    aspect-ratio: 9 / 16;
    margin: 0 auto;
    scrollbar-width: none;
    padding: 0;
  }
}

/*========= レイアウトのためのCSS ===============*/