@charset "UTF-8";

/************************************************************
*  iziModalのカスタマイズ用
*************************************************************/


/* ページ読み込み時にフェード
--------------------------------------------------------------------------------------- */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* 展開アニメーション
--------------------------------------------------------------------------------------- */
@-webkit-keyframes qaOpen {
  0% {
    -webkit-transform: translateY(-10px);
    opacity: 0;
    transform: translateY(-10px);
    /* 上から表示 */
  }
  100% {
    -webkit-transform: none;
    opacity: 1;
    transform: none;
  }
}
@keyframes qaOpen {
  0% {
    -webkit-transform: translateY(-10px);
    opacity: 0;
    transform: translateY(-10px);
    /* 上から表示 */
  }
  100% {
    -webkit-transform: none;
    opacity: 1;
    transform: none;
  }
}
/* Animation 複数回使うなら/global */
@-webkit-keyframes fadeBottomAnime {
  0% {
    -webkit-transform: translateY(10px);
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(0);
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeBottomAnime {
  0% {
    -webkit-transform: translateY(10px);
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(0);
    opacity: 1;
    transform: translateY(0);
  }
}
/************************************************************
*  Global
*  汎用的な関数や変数を格納する
*************************************************************/
.iziModal {
  width: min(100% - 12rem, 750px);
}

/* .iziModal-navigate {
  z-index: 999 !important;
} */
.iziModal-navigate .iziModal-navigate-prev, .iziModal-navigate .iziModal-navigate-next {
  background-size: 70px !important;
  opacity: 1;
  top: 50%;
}
.iziModal-navigate .iziModal-navigate-prev {
  -webkit-transform: translateY(-50%);
  left: -20px;
  margin-left: 0 !important;
  transform: translateY(-50%);
  /* background-image: url(../../images/common/arrow-prev.svg); */
}
.iziModal-navigate .iziModal-navigate-next {
  -webkit-transform: translateY(-50%);
  margin-right: 0 !important;
  right: -20px;
  transform: translateY(-50%);
  /* background-image: url(../../images/common/arrow-next.svg); */
}

.iziModal-overlay {
  background-color: rgba(0, 0, 0, 0.8) !important;
}

.iziModal-close-btn {
  -webkit-transform: translateX(-50%);
  background-color: #B71C2C;
  border-radius: 50%;
  bottom: -70px;
  color: #FFFFFF;
  font-size: 30px;
  height: 50px;
  left: 50%;
  line-height: 50px;
  position: fixed;
  text-align: center;
  transform: translateX(-50%);
  transition: all 0.3s ease;
  width: 50px;
}
.iziModal-close-btn:hover {
  opacity: 0.6;
}

@media screen and (max-width: 1300px) {
  body {
    margin: 0;
  }
}

@media screen and (max-width: 1100px) {
  body {
    margin: 0;
  }
}

@media screen and (max-width: 1023px) {
  body {
    margin: 0;
  }
}

@media screen and (max-width: 767px) {
  body {
    margin: 0;
  }
}