body{
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  max-width: 600px;
  margin: 0 auto;
  position: relative;
}

video{
  width: auto;
  height: 100vh;
}

img{
  width: 100%;
}

.tac {
  text-align: center;
}

svg{
  width: 100%;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.container {
  width: 88%;
  margin: 0 auto;
}

.fsz_xs {
  font-size: min(2.667vw, 12px);
}

.fsz_s {
  font-size: min(3.2vw, 14px);
}

.fsz_m {
  font-size: min(3.733vw, 28px);
}

.fsz_l {
  font-size: min(4.8vw, 24px);
  font-weight: bold;
}

.fsz_xl {
  font-size: min(7.2vw, 54px);
  font-weight: bold;
}

.fixed__bg{
  width: 100vw;
  height: 100vh;
  display: block;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -2;
  max-width: 600px;
  margin: 0 auto;
}

.button{
  position: absolute;
  text-align: center;
  width: 100%;
  top: 30%;
  transform: translate(-50%, -50%);
  animation: heartbeat 1.5s infinite;
}

/* install_btn縺ｮ繧｢繝九Γ繝ｼ繧ｷ繝ｧ繝ｳ險ｭ螳� */
@keyframes heartbeat {
  0%, 20%, 100% {
      transform: scale(0.95);
  }
  10% {
      transform: scale(1);
  }
  30%, 50%, 80% {
      transform: scale(0.95);
  }
  40% {
      transform: scale(1);
  }
  60% {
      transform: scale(1);
  }
  70% {
      transform: scale(1);
  }
}


.start__button img{
  width: 90%;
}

.button__text{
font-size: 30px;
font-weight: bold;
color: #fff;
margin-top: 5%;
font-size: 14px;
}

.rec{
  position: absolute;
  top: 5%;
  right: 5%;
  font-size: 12px;
  font-weight: bold;
  color: #e85050d1;
  padding:2% 3%;
  border-radius: 10px;
}

.brackets__top-left,
.brackets__bottom-left,
.brackets__top-right,
.brackets__bottom-right{
  position: absolute;
  content: '';
  width: 30px;
  height: 30px;
  display: block;
  border: 2px solid #e85050d1;
}

.brackets__top-left{
  left: 2%;
  top: 2%;
  border-bottom: none;
  border-right: none;
}

.brackets__top-right{
  right: 2%;
  top: 2%;
  border-bottom: none;
  border-left: none;
}

.brackets__bottom-left{
  left: 2%;
  bottom: 7%;
  border-top: none;
  border-right: none;
}

.brackets__bottom-right{
  right: 2%;
  bottom: 7%;
  border-top: none;
  border-left: none;
}




/* bottom__text */
.bottom__text{
  position: absolute;
  bottom: 0;
  padding: 3% 0 0;
  text-shadow: 1px 1px 4px #808080;
}

.box-icon{
  margin-right: 3%;
}

.box-right{
  color: #fff;
}

.box-title {
  margin-bottom: min(1.6vw, 12px);
}

.box-detail {
  width: 94%;
  margin: min(2.667vw, 0px) auto 0;
}

.box-tag {
  margin: min(2.667vw, 10px) 0 min(5.2vw,40px);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  text-shadow: none;
}

.box-tag p {
  color: #fff;
  background-image: linear-gradient(-225deg, #92afff 0%, #B19FFF 48%, #ECA1FE 100%);
  border-radius: min(1.334vw, 10px);
  padding: min(1.067vw, 8px) min(2.133vw, 16px);
  margin-right: 1%;
  margin-top: min(1.6vw, 12px);
}

#pickup,
.reserve-box:last-of-type,
.install_block{
  padding-bottom: min(2.667vw, 20px);
  border-bottom: 2px solid #eaeaea;
  margin-bottom: 0;
}

.info-box {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: min(2.133vw, 16px);
  border-bottom: 1px solid #eaeaea;
  position: relative;
  margin: min(2.667vw, 20px) 0;
  cursor: pointer;
  font-weight: 500;
}

.info-box:after {
  content: "";
  position: absolute;
  right: 0;
  /* background-image: url(../img/icon/arrow.png); */
  width: min(4vw, 30px);
  height: min(4vw, 30px);
  background-repeat: no-repeat;
  background-size: contain;
}

.info-box:first-of-type {
  margin-top: min(6.667vw, 50px);
}

.info-tag {
  background: #fd3838;
  color: #fff;
  padding: min(1.2vw, 12px) min(1.6vw, 12px);
  border-radius: min(2vw, 15px);
  margin-right: 2%;
}

.box-icon img {
  width: min(10.667vw, 80px);
  height: min(10.667vw, 80px);
  border-radius: 50%;
  margin-right: 3%;
}

.follow {
  display: inline-block;
  background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
  color: #fff;
  line-height: 1;
  border-radius: min(1.334vw, 10px);
  padding: min(1.067vw, 8px);
  margin: 0 min(1.067vw, 8px) 0 min(1.6vw, 12px);
}


/* footer */
.footer{
  text-align: center;
  font-size: 12px;
  color: #fff;
  z-index: 10;
  padding: 3% 0 3%;
  background: #0000006a;
}