@charset "UTF-8";

/* ★★このcssはscssをコンパイルしたcssです。cssを記述する場合は、こちらに記述せず、merge.cssに記述してください。★★ */
/* ==============================================
CSS information

 file name  : add.css
 style info : style.scssに追加するスタイル

=============================================== */
/*=================================================
 * ローディングアニメーション
 * ================================================ */
/* サービスイメージ
 ------------------------------------ */
 .img_loader {
   width: 100%;
   height: auto;
   max-width: 350px;
   margin: 0 auto;
 }
 .img_loader img {
   width: 100%;
   height: 100%;
 }


/* ローディング アニメーション
 ------------------------------------ */
/* アニメーション CSS
 --------------- */
.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}

.loader {
  color: #B7B7B7;
  font-size: 5px;
  margin: 10px auto;
  position: relative;
  /* text-indent: -9999em; */
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}

.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.loader:after {
  left: 3.5em;
}

@-webkit-keyframes load7 {

  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

@keyframes load7 {

  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

/* ポップアップ CSS
 --------------- */
.popup_overlay.popup_loader {
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10002;
  width: 100%;
  height: 100%;
  /* background: rgba(0, 0, 0, 0.7); */
  background: #FFF;
  // opacity: 0;
  // transition: opacity 0.5s, transform 0s 0.5s;
  // transform: scale(0);
}

.popup_overlay.popup_loader .popup_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
}

.popup_overlay.popup_loader .popup_content {
  position: relative;
  align-self: center;
  width: 90%;
  max-width: 800px;
  padding: 10px 30px 60px;
  box-sizing: border-box;
  line-height: 1.4em;
  transition: 0.5s;
}

/*=================================================
 * 最大括り
 * ================================================ */
/* ------------------------------------
/* 大括り
------------------------------------ */
/* 中括り
------------------------------------ */
/* 小括り
--------------- */
/* 最小括り */
