/* ============================================================
   un_fv_wrap
   ============================================================ */


.un_fv_wrap {
  position: relative;
  z-index: 0;
  isolation: isolate;
  overflow: hidden;
}

.un_content_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}

.un_allLoader_pWrap {
  top: -20% !important;
  left: 62% !important;
}

.un_showcase {
  position: sticky;
  /* position: relative; */
  top: 0;
  height: 100vh;
  overflow: hidden;
  z-index: 0;
}

.un_showcase_btn {
  cursor: pointer;
  display: inline-block;
  left: 50%;
  position: absolute;
  top: 192.6%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

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

.un_message {
  position: relative;
  z-index: 2;
  /* margin-top: -20vh;  */
  /* margin-top: -100vh; */
}

@media screen and (max-width: 767px) {
  .un_allLoader_pWrap {
    top: -210% !important;
    left: 50% !important;
  }

  .un_message_txt img {
    width: 86vw;
  }
}

/* ============================================================
   un_about_info
   ============================================================ */

.un_about_info {
  padding: calc(200 / var(--base) * 100vw) calc(270 / var(--base) * 100vw);
  position: relative;
  z-index: 4;
  background-color: #fff;
}

.un_about_info_ttl {
  margin-bottom: calc(60 / var(--base) * 100vw);
}

.un_about_info_ttl img {
  width: calc(300 / var(--base) * 100vw);
  height: auto;
  display: block;
}

.un_about_info_table {
  width: 100%;
  border-collapse: collapse;
}

.un_about_info_table tr {
  border-bottom: 1px solid #d0d0d0;
}

.un_about_info_table tr:first-child {
  border-top: 1px solid #d0d0d0;
}

.un_about_info_table th,
.un_about_info_table td {
  padding: calc(28 / var(--base) * 100vw) calc(10 / var(--base) * 100vw);
  font-size: calc(16 / var(--base) * 100vw);
  color: #4a4a4a;
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
}

.un_about_info_table th {
  width: calc(170 / var(--base) * 100vw);
  font-weight: 400;
  white-space: nowrap;
}

/* SP */
@media screen and (max-width: 767px) {
  .un_about_info {
    padding: calc(80 / var(--base-sp) * 100vw) calc(24 / var(--base-sp) * 100vw);
  }

  .un_about_info_ttl {
    margin-bottom: calc(40 / var(--base-sp) * 100vw);
  }

  .un_about_info_ttl img {
    width: calc(200 / var(--base-sp) * 100vw);
  }

  .un_about_info_table th,
  .un_about_info_table td {
    padding: calc(18 / var(--base-sp) * 100vw) calc(5 / var(--base-sp) * 100vw);
    font-size: clamp(0px, calc(13 / var(--base-sp) * 100vw), 14px);
  }

  .un_about_info_table th {
    width: calc(75 / var(--base-sp) * 100vw);
  }

  .un_message_txt img {
    width: calc(322 / var(--base-sp) * 100vw) !important;
  }
}

/* ============================================================
   動画再生ボタン
   ============================================================ */

.un_popup {
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1005;
}

.un_popup_core {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.un_popup_core iframe,
.un_popup_core video {
  aspect-ratio: 16 / 9;
  height: auto;
  width: 100%;
}

.un_popup_bg {
  background-color: rgba(0, 0, 0, 0.75);
  cursor: pointer;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}




/* 通常時：wrapper_bgは非表示（動画が見えている状態） */
#wrapper_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.6s ease;
}

.un_showcase_mebiusu {
    opacity: 0;
     transition: opacity 0.6s ease;
}

/* メッセージ表示中：動画を消してwrapper_bgを見せる */
body.is-message-active #wrapper_bg,
body.is-message-active .un_showcase_mebiusu {
    opacity: 1;
}

body.is-message-active .un_showcase_mebiusu {
    transition: opacity 0.8s ease 0.3s; /* 0.3秒待ってからフェード開始 */
}

body.is-message-active .un_content_bg {
    opacity: 0;
    transition: opacity 0.6s ease;
}

/* ↓ is-message-activeが外れた瞬間（消える時）だけ速くする */
body:not(.is-message-active) .un_showcase_mebiusu {
    transition: opacity 0.2s ease;
}

/* 動画自体にも通常時のtransitionを入れておく */
.un_content_bg {
    transition: opacity 0.6s ease;
}