section {
  position: relative;
  margin-top: -1px;
}

body {
  width: 100%;
}
@media all and (min-width: 768px) {
  body {
    width: 100vw;
  }
}

.section-1 .imgBox {
  position: absolute;
  top: 18.5%;
  left: 18.65%;
  font-weight: 300;
  letter-spacing: 0.025em;
  color: #fff;
  background-color: #000;
  font-size: 40px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-1 .imgBox {
    font-size: 2.7777777778vw;
  }
}
@media (max-width: 767px) {
  .section-1 .imgBox {
    font-size: 3.90625vw;
  }
}
.section-1 .imgBox {
  width: 902px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-1 .imgBox {
    width: 62.6388888889vw;
  }
}
@media (max-width: 767px) {
  .section-1 .imgBox {
    width: 89.5833333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-1 .imgBox {
    top: 13.7%;
    left: 4.9%;
  }
}
.section-1 .imgBox .txt {
  position: absolute;
  top: 79.3%;
  text-shadow: -1px -1px 4px rgba(86, 55, 19, 0.81);
}
.section-1 .imgBox .txt-1 {
  left: 9.6%;
}
.section-1 .imgBox .txt-2 {
  left: 41.1%;
}
.section-1 .imgBox .txt-3 {
  left: 73.5%;
}
.section-1 .title {
  position: absolute;
  top: 64.2%;
  left: 0;
  width: 100%;
  font-weight: 300;
  color: #47280d;
  text-align: center;
  letter-spacing: 0.04em;
  line-height: 1.4;
  font-size: 64px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-1 .title {
    font-size: 4.4444444444vw;
  }
}
@media (max-width: 767px) {
  .section-1 .title {
    font-size: 6.5104166667vw;
  }
}
@media all and (max-width: 767px) {
  .section-1 .title {
    top: 63%;
    line-height: 1.5;
  }
}

.section-2 .title {
  position: absolute;
  top: 20.6%;
  left: 68.5%;
  font-weight: 300;
  letter-spacing: 0.08em;
  font-size: 40px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-2 .title {
    font-size: 2.7777777778vw;
  }
}
@media (max-width: 767px) {
  .section-2 .title {
    font-size: 5.2083333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-2 .title {
    top: 5.45%;
    left: 37%;
  }
}
.section-2 .s-title {
  position: absolute;
  top: 38.7%;
  left: 49.2%;
  letter-spacing: 0.06em;
  color: #7b6340;
  font-size: 28px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-2 .s-title {
    font-size: 1.9444444444vw;
  }
}
@media (max-width: 767px) {
  .section-2 .s-title {
    font-size: 4.1666666667vw;
  }
}
@media all and (max-width: 767px) {
  .section-2 .s-title {
    top: 45.1%;
    left: 6.6%;
    letter-spacing: 0.05em;
  }
}
.section-2 .s-title sup {
  position: relative;
  top: -0.15em;
  letter-spacing: 0;
  font-size: 14px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-2 .s-title sup {
    font-size: 0.9722222222vw;
  }
}
@media (max-width: 767px) {
  .section-2 .s-title sup {
    font-size: 1.8229166667vw;
  }
}
.section-2 .s-title sup {
  vertical-align: super;
}
.section-2 .title2 {
  top: 69.2%;
  left: 21.35%;
}
@media all and (max-width: 767px) {
  .section-2 .title2 {
    top: 59.3%;
    left: 30.1%;
  }
}
.section-2 .txt {
  position: absolute;
  top: 85.5%;
  font-weight: 300;
  letter-spacing: 0.05em;
  color: #47280d;
  font-size: 28px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-2 .txt {
    font-size: 1.9444444444vw;
  }
}
@media (max-width: 767px) {
  .section-2 .txt {
    font-size: 3.6458333333vw;
  }
}
.section-2 .txt sup {
  position: relative;
  top: -0.2em;
  letter-spacing: 0;
  font-size: 12px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-2 .txt sup {
    font-size: 0.8333333333vw;
  }
}
@media (max-width: 767px) {
  .section-2 .txt sup {
    font-size: 1.5625vw;
  }
}
.section-2 .txt sup {
  vertical-align: super;
}
.section-2 .txt-1 {
  left: 10.9%;
}
@media all and (max-width: 767px) {
  .section-2 .txt-1 {
    top: 69.3%;
    left: 16.2%;
  }
}
.section-2 .txt-2 {
  left: 27%;
}
@media all and (max-width: 767px) {
  .section-2 .txt-2 {
    top: 77.6%;
    left: 16.2%;
  }
}
.section-2 .txt-3 {
  left: 43.25%;
}
@media all and (max-width: 767px) {
  .section-2 .txt-3 {
    top: 85.9%;
    left: 16.2%;
  }
}

.section-3 .title {
  position: absolute;
  top: 45.7%;
  left: 55%;
  font-weight: 300;
  letter-spacing: 0.05em;
  font-size: 40px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-3 .title {
    font-size: 2.7777777778vw;
  }
}
@media (max-width: 767px) {
  .section-3 .title {
    font-size: 5.2083333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-3 .title {
    top: 12.7%;
    left: 15.4%;
  }
}
.section-3 .txt-1 {
  position: absolute;
  top: 3.3%;
  left: 23.5%;
  font-style: italic;
  letter-spacing: 0.05em;
  color: #7c6340;
  font-size: 28px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-3 .txt-1 {
    font-size: 1.9444444444vw;
  }
}
@media (max-width: 767px) {
  .section-3 .txt-1 {
    font-size: 3.6458333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-3 .txt-1 {
    top: 19.7%;
    left: 33.4%;
  }
}
.section-3 .txt-2 {
  position: absolute;
  top: 37%;
  left: 39%;
  font-weight: 300;
  letter-spacing: 0.01em;
  color: #7c6340;
  font-size: 28px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-3 .txt-2 {
    font-size: 1.9444444444vw;
  }
}
@media (max-width: 767px) {
  .section-3 .txt-2 {
    font-size: 3.6458333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-3 .txt-2 {
    top: 38.7%;
    left: 73.6%;
  }
}
.section-3 .txt-2 sup {
  position: relative;
  top: -0.2em;
  letter-spacing: 0;
  font-size: 12px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-3 .txt-2 sup {
    font-size: 0.8333333333vw;
  }
}
@media (max-width: 767px) {
  .section-3 .txt-2 sup {
    font-size: 1.5625vw;
  }
}
.section-3 .txt-2 sup {
  vertical-align: super;
}

.section-4 .title {
  position: absolute;
  top: 25.8%;
  left: 10.2%;
  font-weight: 300;
  letter-spacing: 0.05em;
  font-size: 40px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .title {
    font-size: 2.7777777778vw;
  }
}
@media (max-width: 767px) {
  .section-4 .title {
    font-size: 5.2083333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-4 .title {
    top: 10.1%;
    left: 11.1%;
  }
}
.section-4 .title sup {
  position: relative;
  top: -0.6em;
  letter-spacing: 0;
  font-size: 14px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .title sup {
    font-size: 0.9722222222vw;
  }
}
@media (max-width: 767px) {
  .section-4 .title sup {
    font-size: 1.8229166667vw;
  }
}
.section-4 .title sup {
  vertical-align: super;
}
.section-4 .items {
  position: absolute;
  top: 47.9%;
  left: 7.3%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  color: #7c6340;
  text-align: center;
  width: 690px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .items {
    width: 47.9166666667vw;
  }
}
@media (max-width: 767px) {
  .section-4 .items {
    width: 77.34375vw;
  }
}
@media all and (max-width: 767px) {
  .section-4 .items {
    top: 90.8%;
    left: 11.6%;
  }
}
.section-4 .items .s-title {
  letter-spacing: 0.016em;
  font-size: 36px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .items .s-title {
    font-size: 2.5vw;
  }
}
@media (max-width: 767px) {
  .section-4 .items .s-title {
    font-size: 4.1666666667vw;
  }
}
.section-4 .items .s-title span {
  display: inline-block;
  font-style: italic;
  letter-spacing: 0.05em;
  margin-left: 5px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .items .s-title span {
    margin-left: 0.3472222222vw;
  }
}
@media (max-width: 767px) {
  .section-4 .items .s-title span {
    margin-left: 0.6510416667vw;
  }
}
.section-4 .items .s-title span {
  font-size: 22px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .items .s-title span {
    font-size: 1.5277777778vw;
  }
}
@media (max-width: 767px) {
  .section-4 .items .s-title span {
    font-size: 2.6041666667vw;
  }
}
.section-4 .items .s-info {
  letter-spacing: 0.05em;
  font-size: 24px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-4 .items .s-info {
    font-size: 1.6666666667vw;
  }
}
@media (max-width: 767px) {
  .section-4 .items .s-info {
    font-size: 2.6041666667vw;
  }
}

.section-5 .title {
  position: absolute;
  top: 7.3%;
  left: 37.1%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 300;
  color: #47280d;
  letter-spacing: 0.036em;
  font-size: 40px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .title {
    font-size: 2.7777777778vw;
  }
}
@media (max-width: 767px) {
  .section-5 .title {
    font-size: 5.2083333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-5 .title {
    top: 3.7%;
    left: 25.1%;
  }
}
.section-5 .title img {
  width: 27px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .title img {
    width: 1.875vw;
  }
}
@media (max-width: 767px) {
  .section-5 .title img {
    width: 3.515625vw;
  }
}
.section-5 .title img {
  margin-right: 10px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .title img {
    margin-right: 0.6944444444vw;
  }
}
@media (max-width: 767px) {
  .section-5 .title img {
    margin-right: 0.78125vw;
  }
}
.section-5 .title sup {
  position: relative;
  top: -0.8em;
  letter-spacing: 0;
  font-size: 14px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .title sup {
    font-size: 0.9722222222vw;
  }
}
@media (max-width: 767px) {
  .section-5 .title sup {
    font-size: 1.8229166667vw;
  }
}
.section-5 .title sup {
  vertical-align: super;
}
.section-5 .txt {
  position: absolute;
  top: 26.5%;
  font-weight: 300;
  letter-spacing: 0.01em;
  color: #47280d;
}
@media all and (max-width: 767px) {
  .section-5 .txt {
    top: 28.4%;
  }
}
.section-5 .txt .step {
  letter-spacing: 0.01em;
  font-size: 56px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .txt .step {
    font-size: 3.8888888889vw;
  }
}
@media (max-width: 767px) {
  .section-5 .txt .step {
    font-size: 5.2083333333vw;
  }
}
.section-5 .txt .step {
  margin-bottom: 20px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .txt .step {
    margin-bottom: 1.3888888889vw;
  }
}
@media (max-width: 767px) {
  .section-5 .txt .step {
    margin-bottom: 1.3020833333vw;
  }
}
.section-5 .txt .img {
  width: 168px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .txt .img {
    width: 11.6666666667vw;
  }
}
@media (max-width: 767px) {
  .section-5 .txt .img {
    width: 17.1875vw;
  }
}
.section-5 .txt .img span {
  display: inline-block;
}
.section-5 .txt-1 {
  left: 24.8%;
}
@media all and (max-width: 767px) {
  .section-5 .txt-1 {
    left: 15.75%;
  }
}
.section-5 .txt-2 {
  left: 44.4%;
}
@media all and (max-width: 767px) {
  .section-5 .txt-2 {
    left: 41%;
  }
}
.section-5 .txt-3 {
  left: 64%;
}
@media all and (max-width: 767px) {
  .section-5 .txt-3 {
    left: 66.5%;
  }
}
.section-5 .txt-3 .img {
  width: 248px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-5 .txt-3 .img {
    width: 17.2222222222vw;
  }
}
@media (max-width: 767px) {
  .section-5 .txt-3 .img {
    width: 24.7395833333vw;
  }
}

.section-6 .title {
  position: absolute;
  top: 10.1%;
  left: 0;
  width: 100%;
  font-weight: 300;
  text-align: center;
  letter-spacing: 0.05em;
  font-size: 64px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-6 .title {
    font-size: 4.4444444444vw;
  }
}
@media (max-width: 767px) {
  .section-6 .title {
    font-size: 8.3333333333vw;
  }
}
@media all and (max-width: 767px) {
  .section-6 .title {
    top: 6.5%;
  }
}
.section-6 .txt {
  position: absolute;
  font-weight: 300;
  letter-spacing: 0.05em;
  font-size: 28px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-6 .txt {
    font-size: 1.9444444444vw;
  }
}
@media (max-width: 767px) {
  .section-6 .txt {
    font-size: 3.6458333333vw;
  }
}
.section-6 .txt-1 {
  top: 19.3%;
  left: 67%;
}
@media all and (max-width: 767px) {
  .section-6 .txt-1 {
    top: 13.2%;
    left: 56.2%;
  }
}
.section-6 .txt-2 {
  top: 36.5%;
  left: 24.3%;
}
@media all and (max-width: 767px) {
  .section-6 .txt-2 {
    top: 40.7%;
    left: 31.2%;
  }
}
.section-6 .txt-3 {
  top: 59.8%;
  left: 66.6%;
}
@media all and (max-width: 767px) {
  .section-6 .txt-3 {
    top: 68.5%;
    left: 55.5%;
  }
}
.section-6 .txt sup {
  position: relative;
  top: -0.2em;
  letter-spacing: 0;
  font-size: 13px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-6 .txt sup {
    font-size: 0.9027777778vw;
  }
}
@media (max-width: 767px) {
  .section-6 .txt sup {
    font-size: 1.6927083333vw;
  }
}
.section-6 .txt sup {
  vertical-align: super;
}

.section-7 {
  margin-bottom: 2em;
}
@media all and (max-width: 767px) {
  .section-7 {
    margin-bottom: 8.2%;
  }
}
.section-7 .content h2 {
  position: absolute;
  top: 32.8%;
  left: 14.2%;
  letter-spacing: 0.01em;
  font-weight: 500;
  font-size: 50px;
}
@media all and (max-width: 1440px) {
  .section-7 .content h2 {
    font-size: 3.4722222222vw;
  }
}
@media all and (max-width: 767px) {
  .section-7 .content h2 {
    top: 6%;
    left: 0;
    width: 100%;
    text-align: center;
    letter-spacing: 0.035em;
    font-size: 7.6271186441vw;
  }
}
.section-7 .content h2 sup {
  position: relative;
  top: -1em;
  letter-spacing: 0;
  font-size: 12px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-7 .content h2 sup {
    font-size: 0.8333333333vw;
  }
}
@media (max-width: 767px) {
  .section-7 .content h2 sup {
    font-size: 2.2135416667vw;
  }
}
.section-7 .content h2 sup {
  vertical-align: super;
}
.section-7 .content p {
  position: absolute;
  top: 46.4%;
  left: 9.1%;
  font-weight: 200;
  letter-spacing: 0.015em;
  font-size: 37px;
}
@media all and (max-width: 1440px) {
  .section-7 .content p {
    font-size: 2.5694444444vw;
  }
}
@media all and (max-width: 767px) {
  .section-7 .content p {
    top: 13.75%;
    left: 0;
    width: 100%;
    text-align: center;
    letter-spacing: 0.04em;
    font-size: 5.2411994785vw;
  }
}
.section-7 .sup {
  position: absolute;
  top: 75.7%;
  left: 37.6%;
  letter-spacing: 0;
  font-size: 9px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .section-7 .sup {
    font-size: 0.625vw;
  }
}
@media (max-width: 767px) {
  .section-7 .sup {
    font-size: 1.5625vw;
  }
}
.section-7 .sup {
  vertical-align: super;
}
@media all and (max-width: 767px) {
  .section-7 .sup {
    top: 27.7%;
    left: 67.1%;
  }
}

.section-8 {
  padding: 0 40px;
}
@media all and (max-width: 767px) {
  .section-8 {
    padding: 0 20px;
  }
}
.section-8 .intro_txt {
  font-size: 15px;
  font-weight: 300;
  text-align: justify;
  line-height: 1.75;
  padding-bottom: 2.4em;
  letter-spacing: 0.0406rem;
}
@media all and (min-width: 768px) and (max-width: 1439px) {
  .section-8 .intro_txt {
    font-size: 12px;
  }
}
@media all and (max-width: 767px) {
  .section-8 .intro_txt {
    padding-bottom: 10%;
    line-height: 1.62;
    font-size: 3.1290743155vw;
  }
}
.section-8 .intro_txt i {
  display: none;
}
@media all and (max-width: 767px) {
  .section-8 .intro_txt i {
    display: inline-block;
  }
}

.footer {
  padding: 4.35em 0;
}