/* common */
.fixed-quick-menu {
  display: none;
}
.header-wrap {
  background: #fff;
}
footer {
  position: initial !important;
}
.pc {
  display: block !important;
}
.m {
  display: none !important;
}
#container {
  width: 100%;
  overflow: hidden;
}
.header {
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 30px;
}
.header img {
  width: 100%;
  display: block;
}

#txt-wrap {
  width: 100%;
  position: absolute;
  top: 8%;
  left: 0;
  padding-left: 10%;
  color: #fff;
}
#txt-wrap > .tit-wrap {
  margin-bottom: 2.8em;
}
#txt-wrap > .tit-wrap > .sub-tit {
  font-size: 0.8em;
  margin-bottom: 1.2em;
}
#txt-wrap > .tit-wrap > .sub-tit > br {
  display: none;
}
#txt-wrap > .tit-wrap > .main-tit {
  font-size: 1.8em;
}
#txt-wrap > h2 {
  font-size: 1.2em;
  font-weight: 600;
  margin-bottom: 2.8em;
}
#txt-wrap > h2 > br {
  display: none;
}
#txt-wrap ~ p {
  position: absolute;
  width: 100%;
  top: 27%;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.8em;
  color: #fff;
  text-align: center;
  line-height: 1.5em;
}

#container .num {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: 2em;
  padding: 50px 0 80px;
}
#container .num > p {
  margin-bottom: 1.4em;
}
#container .num > a {
  padding: 20px 40px;
  border-radius: 40px;
  box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.2);
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradient 5s ease infinite;
  color: #fff;
  text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
section1 img {
  width: 100%;
  display: block;
}
section2 img {
  width: 100%;
  display: block;
}
.footer {
  position: relative;
  display: block;
}
.footer img {
  width: 100%;
}

#download {
  position: absolute;
  width: 30%;
  top: -10%;
  right: 13%;
}

/* responsive */
@media all and (max-width: 1400px) {
  .header {
    font-size: 25px;
  }
}
@media all and (max-width: 1020px) {
  .header {
    font-size: 18px;
  }

  #container .num {
    font-size: 1.3em;
    padding: 20px 0 50px;
  }
  #container .num > a {
    padding: 10px 20px;
  }
}
@media all and (max-width: 650px) {
  .pc {
    display: none !important;
  }
  .m {
    display: block !important;
  }

  .header {
    font-size: 10px;
  }
  #txt-wrap ~ p {
    width: 50%;
    word-break: keep-all;
  }
  #txt-wrap ~ p {
    display: none;
  }

  #container .num {
    font-size: 0.9em;
    padding: 20px 0 50px;
  }
  #container .num > a {
    padding: 10px 15px;
  }
}
@media all and (max-width: 500px) {
  .header img {
    padding-top: 8%;
  }
  #txt-wrap > .tit-wrap {
    margin-bottom: 1.8em;
  }
  #txt-wrap > .tit-wrap > .main-tit {
    font-size: 1.2em;
  }
  #txt-wrap > .tit-wrap > .sub-tit {
    font-size: 0.4em;
  }
}
@media all and (max-width: 360px) {
  .header {
    font-size: 6px;
  }
}
