@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Herr+Von+Muellerhoff&display=swap");
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap");
.mt-0 {
  margin-top: 0rem;
}
@media screen and (max-width: 767px) {
  .mt-0 {
    margin-top: calc( 0rem * .7);
  }
}

.mb-0 {
  margin-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .mb-0 {
    margin-bottom: calc( 0rem * .7);
  }
}

.ml-0 {
  margin-left: 0rem;
}
@media screen and (max-width: 767px) {
  .ml-0 {
    margin-left: calc( 0rem * .7);
  }
}

.mr-0 {
  margin-right: 0rem;
}
@media screen and (max-width: 767px) {
  .mr-0 {
    margin-right: calc( 0rem * .7);
  }
}

.mx-0 {
  margin-left: 0rem;
  margin-right: 0rem;
}
@media screen and (max-width: 767px) {
  .mx-0 {
    margin-left: calc( 0rem * .7);
    margin-right: calc( 0rem * .7);
  }
}

.my-0 {
  margin-top: 0rem;
  margin-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .my-0 {
    margin-top: calc( 0rem * .7);
    margin-bottom: calc( 0rem * .7);
  }
}

.pt-0 {
  padding-top: 0rem;
}
@media screen and (max-width: 767px) {
  .pt-0 {
    padding-top: calc( 0rem * .7);
  }
}

.pb-0 {
  padding-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .pb-0 {
    padding-bottom: calc( 0rem * .7);
  }
}

.pl-0 {
  padding-left: 0rem;
}
@media screen and (max-width: 767px) {
  .pl-0 {
    padding-left: calc( 0rem * .7);
  }
}

.pr-0 {
  padding-right: 0rem;
}
@media screen and (max-width: 767px) {
  .pr-0 {
    padding-right: calc( 0rem * .7);
  }
}

.px-0 {
  padding-left: 0rem;
  padding-right: 0rem;
}
@media screen and (max-width: 767px) {
  .px-0 {
    padding-left: calc( 0rem * .7);
    padding-right: calc( 0rem * .7);
  }
}

.py-0 {
  padding-top: 0rem;
  padding-bottom: 0rem;
}
@media screen and (max-width: 767px) {
  .py-0 {
    padding-top: calc( 0rem * .7);
    padding-bottom: calc( 0rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-0 {
    margin-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-0 {
    margin-bottom: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-0 {
    margin-bottom: 0rem !important;
    margin-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-0 {
    padding-top: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-0 {
    padding-bottom: 0rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-0 {
    padding-bottom: 0rem !important;
    padding-top: 0rem !important;
  }
}

.mt-1 {
  margin-top: 1rem;
}
@media screen and (max-width: 767px) {
  .mt-1 {
    margin-top: calc( 1rem * .7);
  }
}

.mb-1 {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .mb-1 {
    margin-bottom: calc( 1rem * .7);
  }
}

.ml-1 {
  margin-left: 1rem;
}
@media screen and (max-width: 767px) {
  .ml-1 {
    margin-left: calc( 1rem * .7);
  }
}

.mr-1 {
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .mr-1 {
    margin-right: calc( 1rem * .7);
  }
}

.mx-1 {
  margin-left: 1rem;
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .mx-1 {
    margin-left: calc( 1rem * .7);
    margin-right: calc( 1rem * .7);
  }
}

.my-1 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .my-1 {
    margin-top: calc( 1rem * .7);
    margin-bottom: calc( 1rem * .7);
  }
}

.pt-1 {
  padding-top: 1rem;
}
@media screen and (max-width: 767px) {
  .pt-1 {
    padding-top: calc( 1rem * .7);
  }
}

.pb-1 {
  padding-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .pb-1 {
    padding-bottom: calc( 1rem * .7);
  }
}

.pl-1 {
  padding-left: 1rem;
}
@media screen and (max-width: 767px) {
  .pl-1 {
    padding-left: calc( 1rem * .7);
  }
}

.pr-1 {
  padding-right: 1rem;
}
@media screen and (max-width: 767px) {
  .pr-1 {
    padding-right: calc( 1rem * .7);
  }
}

.px-1 {
  padding-left: 1rem;
  padding-right: 1rem;
}
@media screen and (max-width: 767px) {
  .px-1 {
    padding-left: calc( 1rem * .7);
    padding-right: calc( 1rem * .7);
  }
}

.py-1 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .py-1 {
    padding-top: calc( 1rem * .7);
    padding-bottom: calc( 1rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-1 {
    margin-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-1 {
    margin-bottom: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-1 {
    margin-bottom: 1rem !important;
    margin-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-1 {
    padding-top: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-1 {
    padding-bottom: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-1 {
    padding-bottom: 1rem !important;
    padding-top: 1rem !important;
  }
}

.mt-2 {
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .mt-2 {
    margin-top: calc( 2rem * .7);
  }
}

.mb-2 {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .mb-2 {
    margin-bottom: calc( 2rem * .7);
  }
}

.ml-2 {
  margin-left: 2rem;
}
@media screen and (max-width: 767px) {
  .ml-2 {
    margin-left: calc( 2rem * .7);
  }
}

.mr-2 {
  margin-right: 2rem;
}
@media screen and (max-width: 767px) {
  .mr-2 {
    margin-right: calc( 2rem * .7);
  }
}

.mx-2 {
  margin-left: 2rem;
  margin-right: 2rem;
}
@media screen and (max-width: 767px) {
  .mx-2 {
    margin-left: calc( 2rem * .7);
    margin-right: calc( 2rem * .7);
  }
}

.my-2 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .my-2 {
    margin-top: calc( 2rem * .7);
    margin-bottom: calc( 2rem * .7);
  }
}

.pt-2 {
  padding-top: 2rem;
}
@media screen and (max-width: 767px) {
  .pt-2 {
    padding-top: calc( 2rem * .7);
  }
}

.pb-2 {
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .pb-2 {
    padding-bottom: calc( 2rem * .7);
  }
}

.pl-2 {
  padding-left: 2rem;
}
@media screen and (max-width: 767px) {
  .pl-2 {
    padding-left: calc( 2rem * .7);
  }
}

.pr-2 {
  padding-right: 2rem;
}
@media screen and (max-width: 767px) {
  .pr-2 {
    padding-right: calc( 2rem * .7);
  }
}

.px-2 {
  padding-left: 2rem;
  padding-right: 2rem;
}
@media screen and (max-width: 767px) {
  .px-2 {
    padding-left: calc( 2rem * .7);
    padding-right: calc( 2rem * .7);
  }
}

.py-2 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .py-2 {
    padding-top: calc( 2rem * .7);
    padding-bottom: calc( 2rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-2 {
    margin-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-2 {
    margin-bottom: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-2 {
    margin-bottom: 2rem !important;
    margin-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-2 {
    padding-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-2 {
    padding-bottom: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-2 {
    padding-bottom: 2rem !important;
    padding-top: 2rem !important;
  }
}

.mt-3 {
  margin-top: 3rem;
}
@media screen and (max-width: 767px) {
  .mt-3 {
    margin-top: calc( 3rem * .7);
  }
}

.mb-3 {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .mb-3 {
    margin-bottom: calc( 3rem * .7);
  }
}

.ml-3 {
  margin-left: 3rem;
}
@media screen and (max-width: 767px) {
  .ml-3 {
    margin-left: calc( 3rem * .7);
  }
}

.mr-3 {
  margin-right: 3rem;
}
@media screen and (max-width: 767px) {
  .mr-3 {
    margin-right: calc( 3rem * .7);
  }
}

.mx-3 {
  margin-left: 3rem;
  margin-right: 3rem;
}
@media screen and (max-width: 767px) {
  .mx-3 {
    margin-left: calc( 3rem * .7);
    margin-right: calc( 3rem * .7);
  }
}

.my-3 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .my-3 {
    margin-top: calc( 3rem * .7);
    margin-bottom: calc( 3rem * .7);
  }
}

.pt-3 {
  padding-top: 3rem;
}
@media screen and (max-width: 767px) {
  .pt-3 {
    padding-top: calc( 3rem * .7);
  }
}

.pb-3 {
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .pb-3 {
    padding-bottom: calc( 3rem * .7);
  }
}

.pl-3 {
  padding-left: 3rem;
}
@media screen and (max-width: 767px) {
  .pl-3 {
    padding-left: calc( 3rem * .7);
  }
}

.pr-3 {
  padding-right: 3rem;
}
@media screen and (max-width: 767px) {
  .pr-3 {
    padding-right: calc( 3rem * .7);
  }
}

.px-3 {
  padding-left: 3rem;
  padding-right: 3rem;
}
@media screen and (max-width: 767px) {
  .px-3 {
    padding-left: calc( 3rem * .7);
    padding-right: calc( 3rem * .7);
  }
}

.py-3 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .py-3 {
    padding-top: calc( 3rem * .7);
    padding-bottom: calc( 3rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-3 {
    margin-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-3 {
    margin-bottom: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-3 {
    margin-bottom: 3rem !important;
    margin-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-3 {
    padding-top: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-3 {
    padding-bottom: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-3 {
    padding-bottom: 3rem !important;
    padding-top: 3rem !important;
  }
}

.mt-4 {
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  .mt-4 {
    margin-top: calc( 4rem * .7);
  }
}

.mb-4 {
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .mb-4 {
    margin-bottom: calc( 4rem * .7);
  }
}

.ml-4 {
  margin-left: 4rem;
}
@media screen and (max-width: 767px) {
  .ml-4 {
    margin-left: calc( 4rem * .7);
  }
}

.mr-4 {
  margin-right: 4rem;
}
@media screen and (max-width: 767px) {
  .mr-4 {
    margin-right: calc( 4rem * .7);
  }
}

.mx-4 {
  margin-left: 4rem;
  margin-right: 4rem;
}
@media screen and (max-width: 767px) {
  .mx-4 {
    margin-left: calc( 4rem * .7);
    margin-right: calc( 4rem * .7);
  }
}

.my-4 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .my-4 {
    margin-top: calc( 4rem * .7);
    margin-bottom: calc( 4rem * .7);
  }
}

.pt-4 {
  padding-top: 4rem;
}
@media screen and (max-width: 767px) {
  .pt-4 {
    padding-top: calc( 4rem * .7);
  }
}

.pb-4 {
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .pb-4 {
    padding-bottom: calc( 4rem * .7);
  }
}

.pl-4 {
  padding-left: 4rem;
}
@media screen and (max-width: 767px) {
  .pl-4 {
    padding-left: calc( 4rem * .7);
  }
}

.pr-4 {
  padding-right: 4rem;
}
@media screen and (max-width: 767px) {
  .pr-4 {
    padding-right: calc( 4rem * .7);
  }
}

.px-4 {
  padding-left: 4rem;
  padding-right: 4rem;
}
@media screen and (max-width: 767px) {
  .px-4 {
    padding-left: calc( 4rem * .7);
    padding-right: calc( 4rem * .7);
  }
}

.py-4 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .py-4 {
    padding-top: calc( 4rem * .7);
    padding-bottom: calc( 4rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-4 {
    margin-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-4 {
    margin-bottom: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-4 {
    margin-bottom: 4rem !important;
    margin-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-4 {
    padding-top: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-4 {
    padding-bottom: 4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-4 {
    padding-bottom: 4rem !important;
    padding-top: 4rem !important;
  }
}

.mt-5 {
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .mt-5 {
    margin-top: calc( 5rem * .7);
  }
}

.mb-5 {
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .mb-5 {
    margin-bottom: calc( 5rem * .7);
  }
}

.ml-5 {
  margin-left: 5rem;
}
@media screen and (max-width: 767px) {
  .ml-5 {
    margin-left: calc( 5rem * .7);
  }
}

.mr-5 {
  margin-right: 5rem;
}
@media screen and (max-width: 767px) {
  .mr-5 {
    margin-right: calc( 5rem * .7);
  }
}

.mx-5 {
  margin-left: 5rem;
  margin-right: 5rem;
}
@media screen and (max-width: 767px) {
  .mx-5 {
    margin-left: calc( 5rem * .7);
    margin-right: calc( 5rem * .7);
  }
}

.my-5 {
  margin-top: 5rem;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .my-5 {
    margin-top: calc( 5rem * .7);
    margin-bottom: calc( 5rem * .7);
  }
}

.pt-5 {
  padding-top: 5rem;
}
@media screen and (max-width: 767px) {
  .pt-5 {
    padding-top: calc( 5rem * .7);
  }
}

.pb-5 {
  padding-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .pb-5 {
    padding-bottom: calc( 5rem * .7);
  }
}

.pl-5 {
  padding-left: 5rem;
}
@media screen and (max-width: 767px) {
  .pl-5 {
    padding-left: calc( 5rem * .7);
  }
}

.pr-5 {
  padding-right: 5rem;
}
@media screen and (max-width: 767px) {
  .pr-5 {
    padding-right: calc( 5rem * .7);
  }
}

.px-5 {
  padding-left: 5rem;
  padding-right: 5rem;
}
@media screen and (max-width: 767px) {
  .px-5 {
    padding-left: calc( 5rem * .7);
    padding-right: calc( 5rem * .7);
  }
}

.py-5 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .py-5 {
    padding-top: calc( 5rem * .7);
    padding-bottom: calc( 5rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-5 {
    margin-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-5 {
    margin-bottom: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-5 {
    margin-bottom: 5rem !important;
    margin-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-5 {
    padding-top: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-5 {
    padding-bottom: 5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-5 {
    padding-bottom: 5rem !important;
    padding-top: 5rem !important;
  }
}

.mt-6 {
  margin-top: 6rem;
}
@media screen and (max-width: 767px) {
  .mt-6 {
    margin-top: calc( 6rem * .7);
  }
}

.mb-6 {
  margin-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .mb-6 {
    margin-bottom: calc( 6rem * .7);
  }
}

.ml-6 {
  margin-left: 6rem;
}
@media screen and (max-width: 767px) {
  .ml-6 {
    margin-left: calc( 6rem * .7);
  }
}

.mr-6 {
  margin-right: 6rem;
}
@media screen and (max-width: 767px) {
  .mr-6 {
    margin-right: calc( 6rem * .7);
  }
}

.mx-6 {
  margin-left: 6rem;
  margin-right: 6rem;
}
@media screen and (max-width: 767px) {
  .mx-6 {
    margin-left: calc( 6rem * .7);
    margin-right: calc( 6rem * .7);
  }
}

.my-6 {
  margin-top: 6rem;
  margin-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .my-6 {
    margin-top: calc( 6rem * .7);
    margin-bottom: calc( 6rem * .7);
  }
}

.pt-6 {
  padding-top: 6rem;
}
@media screen and (max-width: 767px) {
  .pt-6 {
    padding-top: calc( 6rem * .7);
  }
}

.pb-6 {
  padding-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .pb-6 {
    padding-bottom: calc( 6rem * .7);
  }
}

.pl-6 {
  padding-left: 6rem;
}
@media screen and (max-width: 767px) {
  .pl-6 {
    padding-left: calc( 6rem * .7);
  }
}

.pr-6 {
  padding-right: 6rem;
}
@media screen and (max-width: 767px) {
  .pr-6 {
    padding-right: calc( 6rem * .7);
  }
}

.px-6 {
  padding-left: 6rem;
  padding-right: 6rem;
}
@media screen and (max-width: 767px) {
  .px-6 {
    padding-left: calc( 6rem * .7);
    padding-right: calc( 6rem * .7);
  }
}

.py-6 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .py-6 {
    padding-top: calc( 6rem * .7);
    padding-bottom: calc( 6rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-6 {
    margin-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-6 {
    margin-bottom: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-6 {
    margin-bottom: 6rem !important;
    margin-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-6 {
    padding-top: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-6 {
    padding-bottom: 6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-6 {
    padding-bottom: 6rem !important;
    padding-top: 6rem !important;
  }
}

.mt-7 {
  margin-top: 7rem;
}
@media screen and (max-width: 767px) {
  .mt-7 {
    margin-top: calc( 7rem * .7);
  }
}

.mb-7 {
  margin-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .mb-7 {
    margin-bottom: calc( 7rem * .7);
  }
}

.ml-7 {
  margin-left: 7rem;
}
@media screen and (max-width: 767px) {
  .ml-7 {
    margin-left: calc( 7rem * .7);
  }
}

.mr-7 {
  margin-right: 7rem;
}
@media screen and (max-width: 767px) {
  .mr-7 {
    margin-right: calc( 7rem * .7);
  }
}

.mx-7 {
  margin-left: 7rem;
  margin-right: 7rem;
}
@media screen and (max-width: 767px) {
  .mx-7 {
    margin-left: calc( 7rem * .7);
    margin-right: calc( 7rem * .7);
  }
}

.my-7 {
  margin-top: 7rem;
  margin-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .my-7 {
    margin-top: calc( 7rem * .7);
    margin-bottom: calc( 7rem * .7);
  }
}

.pt-7 {
  padding-top: 7rem;
}
@media screen and (max-width: 767px) {
  .pt-7 {
    padding-top: calc( 7rem * .7);
  }
}

.pb-7 {
  padding-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .pb-7 {
    padding-bottom: calc( 7rem * .7);
  }
}

.pl-7 {
  padding-left: 7rem;
}
@media screen and (max-width: 767px) {
  .pl-7 {
    padding-left: calc( 7rem * .7);
  }
}

.pr-7 {
  padding-right: 7rem;
}
@media screen and (max-width: 767px) {
  .pr-7 {
    padding-right: calc( 7rem * .7);
  }
}

.px-7 {
  padding-left: 7rem;
  padding-right: 7rem;
}
@media screen and (max-width: 767px) {
  .px-7 {
    padding-left: calc( 7rem * .7);
    padding-right: calc( 7rem * .7);
  }
}

.py-7 {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .py-7 {
    padding-top: calc( 7rem * .7);
    padding-bottom: calc( 7rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-7 {
    margin-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-7 {
    margin-bottom: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-7 {
    margin-bottom: 7rem !important;
    margin-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-7 {
    padding-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-7 {
    padding-bottom: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-7 {
    padding-bottom: 7rem !important;
    padding-top: 7rem !important;
  }
}

.mt-8 {
  margin-top: 8rem;
}
@media screen and (max-width: 767px) {
  .mt-8 {
    margin-top: calc( 8rem * .7);
  }
}

.mb-8 {
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .mb-8 {
    margin-bottom: calc( 8rem * .7);
  }
}

.ml-8 {
  margin-left: 8rem;
}
@media screen and (max-width: 767px) {
  .ml-8 {
    margin-left: calc( 8rem * .7);
  }
}

.mr-8 {
  margin-right: 8rem;
}
@media screen and (max-width: 767px) {
  .mr-8 {
    margin-right: calc( 8rem * .7);
  }
}

.mx-8 {
  margin-left: 8rem;
  margin-right: 8rem;
}
@media screen and (max-width: 767px) {
  .mx-8 {
    margin-left: calc( 8rem * .7);
    margin-right: calc( 8rem * .7);
  }
}

.my-8 {
  margin-top: 8rem;
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .my-8 {
    margin-top: calc( 8rem * .7);
    margin-bottom: calc( 8rem * .7);
  }
}

.pt-8 {
  padding-top: 8rem;
}
@media screen and (max-width: 767px) {
  .pt-8 {
    padding-top: calc( 8rem * .7);
  }
}

.pb-8 {
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .pb-8 {
    padding-bottom: calc( 8rem * .7);
  }
}

.pl-8 {
  padding-left: 8rem;
}
@media screen and (max-width: 767px) {
  .pl-8 {
    padding-left: calc( 8rem * .7);
  }
}

.pr-8 {
  padding-right: 8rem;
}
@media screen and (max-width: 767px) {
  .pr-8 {
    padding-right: calc( 8rem * .7);
  }
}

.px-8 {
  padding-left: 8rem;
  padding-right: 8rem;
}
@media screen and (max-width: 767px) {
  .px-8 {
    padding-left: calc( 8rem * .7);
    padding-right: calc( 8rem * .7);
  }
}

.py-8 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .py-8 {
    padding-top: calc( 8rem * .7);
    padding-bottom: calc( 8rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-8 {
    margin-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-8 {
    margin-bottom: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-8 {
    margin-bottom: 8rem !important;
    margin-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-8 {
    padding-top: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-8 {
    padding-bottom: 8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-8 {
    padding-bottom: 8rem !important;
    padding-top: 8rem !important;
  }
}

.mt-9 {
  margin-top: 9rem;
}
@media screen and (max-width: 767px) {
  .mt-9 {
    margin-top: calc( 9rem * .7);
  }
}

.mb-9 {
  margin-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .mb-9 {
    margin-bottom: calc( 9rem * .7);
  }
}

.ml-9 {
  margin-left: 9rem;
}
@media screen and (max-width: 767px) {
  .ml-9 {
    margin-left: calc( 9rem * .7);
  }
}

.mr-9 {
  margin-right: 9rem;
}
@media screen and (max-width: 767px) {
  .mr-9 {
    margin-right: calc( 9rem * .7);
  }
}

.mx-9 {
  margin-left: 9rem;
  margin-right: 9rem;
}
@media screen and (max-width: 767px) {
  .mx-9 {
    margin-left: calc( 9rem * .7);
    margin-right: calc( 9rem * .7);
  }
}

.my-9 {
  margin-top: 9rem;
  margin-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .my-9 {
    margin-top: calc( 9rem * .7);
    margin-bottom: calc( 9rem * .7);
  }
}

.pt-9 {
  padding-top: 9rem;
}
@media screen and (max-width: 767px) {
  .pt-9 {
    padding-top: calc( 9rem * .7);
  }
}

.pb-9 {
  padding-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .pb-9 {
    padding-bottom: calc( 9rem * .7);
  }
}

.pl-9 {
  padding-left: 9rem;
}
@media screen and (max-width: 767px) {
  .pl-9 {
    padding-left: calc( 9rem * .7);
  }
}

.pr-9 {
  padding-right: 9rem;
}
@media screen and (max-width: 767px) {
  .pr-9 {
    padding-right: calc( 9rem * .7);
  }
}

.px-9 {
  padding-left: 9rem;
  padding-right: 9rem;
}
@media screen and (max-width: 767px) {
  .px-9 {
    padding-left: calc( 9rem * .7);
    padding-right: calc( 9rem * .7);
  }
}

.py-9 {
  padding-top: 9rem;
  padding-bottom: 9rem;
}
@media screen and (max-width: 767px) {
  .py-9 {
    padding-top: calc( 9rem * .7);
    padding-bottom: calc( 9rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-9 {
    margin-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-9 {
    margin-bottom: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-9 {
    margin-bottom: 9rem !important;
    margin-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-9 {
    padding-top: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-9 {
    padding-bottom: 9rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-9 {
    padding-bottom: 9rem !important;
    padding-top: 9rem !important;
  }
}

.mt-10 {
  margin-top: 10rem;
}
@media screen and (max-width: 767px) {
  .mt-10 {
    margin-top: calc( 10rem * .7);
  }
}

.mb-10 {
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .mb-10 {
    margin-bottom: calc( 10rem * .7);
  }
}

.ml-10 {
  margin-left: 10rem;
}
@media screen and (max-width: 767px) {
  .ml-10 {
    margin-left: calc( 10rem * .7);
  }
}

.mr-10 {
  margin-right: 10rem;
}
@media screen and (max-width: 767px) {
  .mr-10 {
    margin-right: calc( 10rem * .7);
  }
}

.mx-10 {
  margin-left: 10rem;
  margin-right: 10rem;
}
@media screen and (max-width: 767px) {
  .mx-10 {
    margin-left: calc( 10rem * .7);
    margin-right: calc( 10rem * .7);
  }
}

.my-10 {
  margin-top: 10rem;
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .my-10 {
    margin-top: calc( 10rem * .7);
    margin-bottom: calc( 10rem * .7);
  }
}

.pt-10 {
  padding-top: 10rem;
}
@media screen and (max-width: 767px) {
  .pt-10 {
    padding-top: calc( 10rem * .7);
  }
}

.pb-10 {
  padding-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .pb-10 {
    padding-bottom: calc( 10rem * .7);
  }
}

.pl-10 {
  padding-left: 10rem;
}
@media screen and (max-width: 767px) {
  .pl-10 {
    padding-left: calc( 10rem * .7);
  }
}

.pr-10 {
  padding-right: 10rem;
}
@media screen and (max-width: 767px) {
  .pr-10 {
    padding-right: calc( 10rem * .7);
  }
}

.px-10 {
  padding-left: 10rem;
  padding-right: 10rem;
}
@media screen and (max-width: 767px) {
  .px-10 {
    padding-left: calc( 10rem * .7);
    padding-right: calc( 10rem * .7);
  }
}

.py-10 {
  padding-top: 10rem;
  padding-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .py-10 {
    padding-top: calc( 10rem * .7);
    padding-bottom: calc( 10rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-10 {
    margin-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-10 {
    margin-bottom: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-10 {
    margin-bottom: 10rem !important;
    margin-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-10 {
    padding-top: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-10 {
    padding-bottom: 10rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-10 {
    padding-bottom: 10rem !important;
    padding-top: 10rem !important;
  }
}

.mt-11 {
  margin-top: 11rem;
}
@media screen and (max-width: 767px) {
  .mt-11 {
    margin-top: calc( 11rem * .7);
  }
}

.mb-11 {
  margin-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .mb-11 {
    margin-bottom: calc( 11rem * .7);
  }
}

.ml-11 {
  margin-left: 11rem;
}
@media screen and (max-width: 767px) {
  .ml-11 {
    margin-left: calc( 11rem * .7);
  }
}

.mr-11 {
  margin-right: 11rem;
}
@media screen and (max-width: 767px) {
  .mr-11 {
    margin-right: calc( 11rem * .7);
  }
}

.mx-11 {
  margin-left: 11rem;
  margin-right: 11rem;
}
@media screen and (max-width: 767px) {
  .mx-11 {
    margin-left: calc( 11rem * .7);
    margin-right: calc( 11rem * .7);
  }
}

.my-11 {
  margin-top: 11rem;
  margin-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .my-11 {
    margin-top: calc( 11rem * .7);
    margin-bottom: calc( 11rem * .7);
  }
}

.pt-11 {
  padding-top: 11rem;
}
@media screen and (max-width: 767px) {
  .pt-11 {
    padding-top: calc( 11rem * .7);
  }
}

.pb-11 {
  padding-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .pb-11 {
    padding-bottom: calc( 11rem * .7);
  }
}

.pl-11 {
  padding-left: 11rem;
}
@media screen and (max-width: 767px) {
  .pl-11 {
    padding-left: calc( 11rem * .7);
  }
}

.pr-11 {
  padding-right: 11rem;
}
@media screen and (max-width: 767px) {
  .pr-11 {
    padding-right: calc( 11rem * .7);
  }
}

.px-11 {
  padding-left: 11rem;
  padding-right: 11rem;
}
@media screen and (max-width: 767px) {
  .px-11 {
    padding-left: calc( 11rem * .7);
    padding-right: calc( 11rem * .7);
  }
}

.py-11 {
  padding-top: 11rem;
  padding-bottom: 11rem;
}
@media screen and (max-width: 767px) {
  .py-11 {
    padding-top: calc( 11rem * .7);
    padding-bottom: calc( 11rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-11 {
    margin-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-11 {
    margin-bottom: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-11 {
    margin-bottom: 11rem !important;
    margin-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-11 {
    padding-top: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-11 {
    padding-bottom: 11rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-11 {
    padding-bottom: 11rem !important;
    padding-top: 11rem !important;
  }
}

.mt-12 {
  margin-top: 12rem;
}
@media screen and (max-width: 767px) {
  .mt-12 {
    margin-top: calc( 12rem * .7);
  }
}

.mb-12 {
  margin-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .mb-12 {
    margin-bottom: calc( 12rem * .7);
  }
}

.ml-12 {
  margin-left: 12rem;
}
@media screen and (max-width: 767px) {
  .ml-12 {
    margin-left: calc( 12rem * .7);
  }
}

.mr-12 {
  margin-right: 12rem;
}
@media screen and (max-width: 767px) {
  .mr-12 {
    margin-right: calc( 12rem * .7);
  }
}

.mx-12 {
  margin-left: 12rem;
  margin-right: 12rem;
}
@media screen and (max-width: 767px) {
  .mx-12 {
    margin-left: calc( 12rem * .7);
    margin-right: calc( 12rem * .7);
  }
}

.my-12 {
  margin-top: 12rem;
  margin-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .my-12 {
    margin-top: calc( 12rem * .7);
    margin-bottom: calc( 12rem * .7);
  }
}

.pt-12 {
  padding-top: 12rem;
}
@media screen and (max-width: 767px) {
  .pt-12 {
    padding-top: calc( 12rem * .7);
  }
}

.pb-12 {
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .pb-12 {
    padding-bottom: calc( 12rem * .7);
  }
}

.pl-12 {
  padding-left: 12rem;
}
@media screen and (max-width: 767px) {
  .pl-12 {
    padding-left: calc( 12rem * .7);
  }
}

.pr-12 {
  padding-right: 12rem;
}
@media screen and (max-width: 767px) {
  .pr-12 {
    padding-right: calc( 12rem * .7);
  }
}

.px-12 {
  padding-left: 12rem;
  padding-right: 12rem;
}
@media screen and (max-width: 767px) {
  .px-12 {
    padding-left: calc( 12rem * .7);
    padding-right: calc( 12rem * .7);
  }
}

.py-12 {
  padding-top: 12rem;
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .py-12 {
    padding-top: calc( 12rem * .7);
    padding-bottom: calc( 12rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-12 {
    margin-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-12 {
    margin-bottom: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-12 {
    margin-bottom: 12rem !important;
    margin-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-12 {
    padding-top: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-12 {
    padding-bottom: 12rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-12 {
    padding-bottom: 12rem !important;
    padding-top: 12rem !important;
  }
}

.mt-13 {
  margin-top: 13rem;
}
@media screen and (max-width: 767px) {
  .mt-13 {
    margin-top: calc( 13rem * .7);
  }
}

.mb-13 {
  margin-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .mb-13 {
    margin-bottom: calc( 13rem * .7);
  }
}

.ml-13 {
  margin-left: 13rem;
}
@media screen and (max-width: 767px) {
  .ml-13 {
    margin-left: calc( 13rem * .7);
  }
}

.mr-13 {
  margin-right: 13rem;
}
@media screen and (max-width: 767px) {
  .mr-13 {
    margin-right: calc( 13rem * .7);
  }
}

.mx-13 {
  margin-left: 13rem;
  margin-right: 13rem;
}
@media screen and (max-width: 767px) {
  .mx-13 {
    margin-left: calc( 13rem * .7);
    margin-right: calc( 13rem * .7);
  }
}

.my-13 {
  margin-top: 13rem;
  margin-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .my-13 {
    margin-top: calc( 13rem * .7);
    margin-bottom: calc( 13rem * .7);
  }
}

.pt-13 {
  padding-top: 13rem;
}
@media screen and (max-width: 767px) {
  .pt-13 {
    padding-top: calc( 13rem * .7);
  }
}

.pb-13 {
  padding-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .pb-13 {
    padding-bottom: calc( 13rem * .7);
  }
}

.pl-13 {
  padding-left: 13rem;
}
@media screen and (max-width: 767px) {
  .pl-13 {
    padding-left: calc( 13rem * .7);
  }
}

.pr-13 {
  padding-right: 13rem;
}
@media screen and (max-width: 767px) {
  .pr-13 {
    padding-right: calc( 13rem * .7);
  }
}

.px-13 {
  padding-left: 13rem;
  padding-right: 13rem;
}
@media screen and (max-width: 767px) {
  .px-13 {
    padding-left: calc( 13rem * .7);
    padding-right: calc( 13rem * .7);
  }
}

.py-13 {
  padding-top: 13rem;
  padding-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .py-13 {
    padding-top: calc( 13rem * .7);
    padding-bottom: calc( 13rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-13 {
    margin-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-13 {
    margin-bottom: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-13 {
    margin-bottom: 13rem !important;
    margin-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-13 {
    padding-top: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-13 {
    padding-bottom: 13rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-13 {
    padding-bottom: 13rem !important;
    padding-top: 13rem !important;
  }
}

.mt-14 {
  margin-top: 14rem;
}
@media screen and (max-width: 767px) {
  .mt-14 {
    margin-top: calc( 14rem * .7);
  }
}

.mb-14 {
  margin-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .mb-14 {
    margin-bottom: calc( 14rem * .7);
  }
}

.ml-14 {
  margin-left: 14rem;
}
@media screen and (max-width: 767px) {
  .ml-14 {
    margin-left: calc( 14rem * .7);
  }
}

.mr-14 {
  margin-right: 14rem;
}
@media screen and (max-width: 767px) {
  .mr-14 {
    margin-right: calc( 14rem * .7);
  }
}

.mx-14 {
  margin-left: 14rem;
  margin-right: 14rem;
}
@media screen and (max-width: 767px) {
  .mx-14 {
    margin-left: calc( 14rem * .7);
    margin-right: calc( 14rem * .7);
  }
}

.my-14 {
  margin-top: 14rem;
  margin-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .my-14 {
    margin-top: calc( 14rem * .7);
    margin-bottom: calc( 14rem * .7);
  }
}

.pt-14 {
  padding-top: 14rem;
}
@media screen and (max-width: 767px) {
  .pt-14 {
    padding-top: calc( 14rem * .7);
  }
}

.pb-14 {
  padding-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .pb-14 {
    padding-bottom: calc( 14rem * .7);
  }
}

.pl-14 {
  padding-left: 14rem;
}
@media screen and (max-width: 767px) {
  .pl-14 {
    padding-left: calc( 14rem * .7);
  }
}

.pr-14 {
  padding-right: 14rem;
}
@media screen and (max-width: 767px) {
  .pr-14 {
    padding-right: calc( 14rem * .7);
  }
}

.px-14 {
  padding-left: 14rem;
  padding-right: 14rem;
}
@media screen and (max-width: 767px) {
  .px-14 {
    padding-left: calc( 14rem * .7);
    padding-right: calc( 14rem * .7);
  }
}

.py-14 {
  padding-top: 14rem;
  padding-bottom: 14rem;
}
@media screen and (max-width: 767px) {
  .py-14 {
    padding-top: calc( 14rem * .7);
    padding-bottom: calc( 14rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-14 {
    margin-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-14 {
    margin-bottom: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-14 {
    margin-bottom: 14rem !important;
    margin-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-14 {
    padding-top: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-14 {
    padding-bottom: 14rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-14 {
    padding-bottom: 14rem !important;
    padding-top: 14rem !important;
  }
}

.mt-15 {
  margin-top: 15rem;
}
@media screen and (max-width: 767px) {
  .mt-15 {
    margin-top: calc( 15rem * .7);
  }
}

.mb-15 {
  margin-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .mb-15 {
    margin-bottom: calc( 15rem * .7);
  }
}

.ml-15 {
  margin-left: 15rem;
}
@media screen and (max-width: 767px) {
  .ml-15 {
    margin-left: calc( 15rem * .7);
  }
}

.mr-15 {
  margin-right: 15rem;
}
@media screen and (max-width: 767px) {
  .mr-15 {
    margin-right: calc( 15rem * .7);
  }
}

.mx-15 {
  margin-left: 15rem;
  margin-right: 15rem;
}
@media screen and (max-width: 767px) {
  .mx-15 {
    margin-left: calc( 15rem * .7);
    margin-right: calc( 15rem * .7);
  }
}

.my-15 {
  margin-top: 15rem;
  margin-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .my-15 {
    margin-top: calc( 15rem * .7);
    margin-bottom: calc( 15rem * .7);
  }
}

.pt-15 {
  padding-top: 15rem;
}
@media screen and (max-width: 767px) {
  .pt-15 {
    padding-top: calc( 15rem * .7);
  }
}

.pb-15 {
  padding-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .pb-15 {
    padding-bottom: calc( 15rem * .7);
  }
}

.pl-15 {
  padding-left: 15rem;
}
@media screen and (max-width: 767px) {
  .pl-15 {
    padding-left: calc( 15rem * .7);
  }
}

.pr-15 {
  padding-right: 15rem;
}
@media screen and (max-width: 767px) {
  .pr-15 {
    padding-right: calc( 15rem * .7);
  }
}

.px-15 {
  padding-left: 15rem;
  padding-right: 15rem;
}
@media screen and (max-width: 767px) {
  .px-15 {
    padding-left: calc( 15rem * .7);
    padding-right: calc( 15rem * .7);
  }
}

.py-15 {
  padding-top: 15rem;
  padding-bottom: 15rem;
}
@media screen and (max-width: 767px) {
  .py-15 {
    padding-top: calc( 15rem * .7);
    padding-bottom: calc( 15rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-15 {
    margin-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-15 {
    margin-bottom: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-15 {
    margin-bottom: 15rem !important;
    margin-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-15 {
    padding-top: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-15 {
    padding-bottom: 15rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-15 {
    padding-bottom: 15rem !important;
    padding-top: 15rem !important;
  }
}

.mt-16 {
  margin-top: 16rem;
}
@media screen and (max-width: 767px) {
  .mt-16 {
    margin-top: calc( 16rem * .7);
  }
}

.mb-16 {
  margin-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .mb-16 {
    margin-bottom: calc( 16rem * .7);
  }
}

.ml-16 {
  margin-left: 16rem;
}
@media screen and (max-width: 767px) {
  .ml-16 {
    margin-left: calc( 16rem * .7);
  }
}

.mr-16 {
  margin-right: 16rem;
}
@media screen and (max-width: 767px) {
  .mr-16 {
    margin-right: calc( 16rem * .7);
  }
}

.mx-16 {
  margin-left: 16rem;
  margin-right: 16rem;
}
@media screen and (max-width: 767px) {
  .mx-16 {
    margin-left: calc( 16rem * .7);
    margin-right: calc( 16rem * .7);
  }
}

.my-16 {
  margin-top: 16rem;
  margin-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .my-16 {
    margin-top: calc( 16rem * .7);
    margin-bottom: calc( 16rem * .7);
  }
}

.pt-16 {
  padding-top: 16rem;
}
@media screen and (max-width: 767px) {
  .pt-16 {
    padding-top: calc( 16rem * .7);
  }
}

.pb-16 {
  padding-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .pb-16 {
    padding-bottom: calc( 16rem * .7);
  }
}

.pl-16 {
  padding-left: 16rem;
}
@media screen and (max-width: 767px) {
  .pl-16 {
    padding-left: calc( 16rem * .7);
  }
}

.pr-16 {
  padding-right: 16rem;
}
@media screen and (max-width: 767px) {
  .pr-16 {
    padding-right: calc( 16rem * .7);
  }
}

.px-16 {
  padding-left: 16rem;
  padding-right: 16rem;
}
@media screen and (max-width: 767px) {
  .px-16 {
    padding-left: calc( 16rem * .7);
    padding-right: calc( 16rem * .7);
  }
}

.py-16 {
  padding-top: 16rem;
  padding-bottom: 16rem;
}
@media screen and (max-width: 767px) {
  .py-16 {
    padding-top: calc( 16rem * .7);
    padding-bottom: calc( 16rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-16 {
    margin-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-16 {
    margin-bottom: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-16 {
    margin-bottom: 16rem !important;
    margin-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-16 {
    padding-top: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-16 {
    padding-bottom: 16rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-16 {
    padding-bottom: 16rem !important;
    padding-top: 16rem !important;
  }
}

.mt-17 {
  margin-top: 17rem;
}
@media screen and (max-width: 767px) {
  .mt-17 {
    margin-top: calc( 17rem * .7);
  }
}

.mb-17 {
  margin-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .mb-17 {
    margin-bottom: calc( 17rem * .7);
  }
}

.ml-17 {
  margin-left: 17rem;
}
@media screen and (max-width: 767px) {
  .ml-17 {
    margin-left: calc( 17rem * .7);
  }
}

.mr-17 {
  margin-right: 17rem;
}
@media screen and (max-width: 767px) {
  .mr-17 {
    margin-right: calc( 17rem * .7);
  }
}

.mx-17 {
  margin-left: 17rem;
  margin-right: 17rem;
}
@media screen and (max-width: 767px) {
  .mx-17 {
    margin-left: calc( 17rem * .7);
    margin-right: calc( 17rem * .7);
  }
}

.my-17 {
  margin-top: 17rem;
  margin-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .my-17 {
    margin-top: calc( 17rem * .7);
    margin-bottom: calc( 17rem * .7);
  }
}

.pt-17 {
  padding-top: 17rem;
}
@media screen and (max-width: 767px) {
  .pt-17 {
    padding-top: calc( 17rem * .7);
  }
}

.pb-17 {
  padding-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .pb-17 {
    padding-bottom: calc( 17rem * .7);
  }
}

.pl-17 {
  padding-left: 17rem;
}
@media screen and (max-width: 767px) {
  .pl-17 {
    padding-left: calc( 17rem * .7);
  }
}

.pr-17 {
  padding-right: 17rem;
}
@media screen and (max-width: 767px) {
  .pr-17 {
    padding-right: calc( 17rem * .7);
  }
}

.px-17 {
  padding-left: 17rem;
  padding-right: 17rem;
}
@media screen and (max-width: 767px) {
  .px-17 {
    padding-left: calc( 17rem * .7);
    padding-right: calc( 17rem * .7);
  }
}

.py-17 {
  padding-top: 17rem;
  padding-bottom: 17rem;
}
@media screen and (max-width: 767px) {
  .py-17 {
    padding-top: calc( 17rem * .7);
    padding-bottom: calc( 17rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-17 {
    margin-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-17 {
    margin-bottom: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-17 {
    margin-bottom: 17rem !important;
    margin-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-17 {
    padding-top: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-17 {
    padding-bottom: 17rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-17 {
    padding-bottom: 17rem !important;
    padding-top: 17rem !important;
  }
}

.mt-18 {
  margin-top: 18rem;
}
@media screen and (max-width: 767px) {
  .mt-18 {
    margin-top: calc( 18rem * .7);
  }
}

.mb-18 {
  margin-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .mb-18 {
    margin-bottom: calc( 18rem * .7);
  }
}

.ml-18 {
  margin-left: 18rem;
}
@media screen and (max-width: 767px) {
  .ml-18 {
    margin-left: calc( 18rem * .7);
  }
}

.mr-18 {
  margin-right: 18rem;
}
@media screen and (max-width: 767px) {
  .mr-18 {
    margin-right: calc( 18rem * .7);
  }
}

.mx-18 {
  margin-left: 18rem;
  margin-right: 18rem;
}
@media screen and (max-width: 767px) {
  .mx-18 {
    margin-left: calc( 18rem * .7);
    margin-right: calc( 18rem * .7);
  }
}

.my-18 {
  margin-top: 18rem;
  margin-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .my-18 {
    margin-top: calc( 18rem * .7);
    margin-bottom: calc( 18rem * .7);
  }
}

.pt-18 {
  padding-top: 18rem;
}
@media screen and (max-width: 767px) {
  .pt-18 {
    padding-top: calc( 18rem * .7);
  }
}

.pb-18 {
  padding-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .pb-18 {
    padding-bottom: calc( 18rem * .7);
  }
}

.pl-18 {
  padding-left: 18rem;
}
@media screen and (max-width: 767px) {
  .pl-18 {
    padding-left: calc( 18rem * .7);
  }
}

.pr-18 {
  padding-right: 18rem;
}
@media screen and (max-width: 767px) {
  .pr-18 {
    padding-right: calc( 18rem * .7);
  }
}

.px-18 {
  padding-left: 18rem;
  padding-right: 18rem;
}
@media screen and (max-width: 767px) {
  .px-18 {
    padding-left: calc( 18rem * .7);
    padding-right: calc( 18rem * .7);
  }
}

.py-18 {
  padding-top: 18rem;
  padding-bottom: 18rem;
}
@media screen and (max-width: 767px) {
  .py-18 {
    padding-top: calc( 18rem * .7);
    padding-bottom: calc( 18rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-18 {
    margin-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-18 {
    margin-bottom: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-18 {
    margin-bottom: 18rem !important;
    margin-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-18 {
    padding-top: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-18 {
    padding-bottom: 18rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-18 {
    padding-bottom: 18rem !important;
    padding-top: 18rem !important;
  }
}

.mt-19 {
  margin-top: 19rem;
}
@media screen and (max-width: 767px) {
  .mt-19 {
    margin-top: calc( 19rem * .7);
  }
}

.mb-19 {
  margin-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .mb-19 {
    margin-bottom: calc( 19rem * .7);
  }
}

.ml-19 {
  margin-left: 19rem;
}
@media screen and (max-width: 767px) {
  .ml-19 {
    margin-left: calc( 19rem * .7);
  }
}

.mr-19 {
  margin-right: 19rem;
}
@media screen and (max-width: 767px) {
  .mr-19 {
    margin-right: calc( 19rem * .7);
  }
}

.mx-19 {
  margin-left: 19rem;
  margin-right: 19rem;
}
@media screen and (max-width: 767px) {
  .mx-19 {
    margin-left: calc( 19rem * .7);
    margin-right: calc( 19rem * .7);
  }
}

.my-19 {
  margin-top: 19rem;
  margin-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .my-19 {
    margin-top: calc( 19rem * .7);
    margin-bottom: calc( 19rem * .7);
  }
}

.pt-19 {
  padding-top: 19rem;
}
@media screen and (max-width: 767px) {
  .pt-19 {
    padding-top: calc( 19rem * .7);
  }
}

.pb-19 {
  padding-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .pb-19 {
    padding-bottom: calc( 19rem * .7);
  }
}

.pl-19 {
  padding-left: 19rem;
}
@media screen and (max-width: 767px) {
  .pl-19 {
    padding-left: calc( 19rem * .7);
  }
}

.pr-19 {
  padding-right: 19rem;
}
@media screen and (max-width: 767px) {
  .pr-19 {
    padding-right: calc( 19rem * .7);
  }
}

.px-19 {
  padding-left: 19rem;
  padding-right: 19rem;
}
@media screen and (max-width: 767px) {
  .px-19 {
    padding-left: calc( 19rem * .7);
    padding-right: calc( 19rem * .7);
  }
}

.py-19 {
  padding-top: 19rem;
  padding-bottom: 19rem;
}
@media screen and (max-width: 767px) {
  .py-19 {
    padding-top: calc( 19rem * .7);
    padding-bottom: calc( 19rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-19 {
    margin-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-19 {
    margin-bottom: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-19 {
    margin-bottom: 19rem !important;
    margin-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-19 {
    padding-top: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-19 {
    padding-bottom: 19rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-19 {
    padding-bottom: 19rem !important;
    padding-top: 19rem !important;
  }
}

.mt-20 {
  margin-top: 20rem;
}
@media screen and (max-width: 767px) {
  .mt-20 {
    margin-top: calc( 20rem * .7);
  }
}

.mb-20 {
  margin-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .mb-20 {
    margin-bottom: calc( 20rem * .7);
  }
}

.ml-20 {
  margin-left: 20rem;
}
@media screen and (max-width: 767px) {
  .ml-20 {
    margin-left: calc( 20rem * .7);
  }
}

.mr-20 {
  margin-right: 20rem;
}
@media screen and (max-width: 767px) {
  .mr-20 {
    margin-right: calc( 20rem * .7);
  }
}

.mx-20 {
  margin-left: 20rem;
  margin-right: 20rem;
}
@media screen and (max-width: 767px) {
  .mx-20 {
    margin-left: calc( 20rem * .7);
    margin-right: calc( 20rem * .7);
  }
}

.my-20 {
  margin-top: 20rem;
  margin-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .my-20 {
    margin-top: calc( 20rem * .7);
    margin-bottom: calc( 20rem * .7);
  }
}

.pt-20 {
  padding-top: 20rem;
}
@media screen and (max-width: 767px) {
  .pt-20 {
    padding-top: calc( 20rem * .7);
  }
}

.pb-20 {
  padding-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .pb-20 {
    padding-bottom: calc( 20rem * .7);
  }
}

.pl-20 {
  padding-left: 20rem;
}
@media screen and (max-width: 767px) {
  .pl-20 {
    padding-left: calc( 20rem * .7);
  }
}

.pr-20 {
  padding-right: 20rem;
}
@media screen and (max-width: 767px) {
  .pr-20 {
    padding-right: calc( 20rem * .7);
  }
}

.px-20 {
  padding-left: 20rem;
  padding-right: 20rem;
}
@media screen and (max-width: 767px) {
  .px-20 {
    padding-left: calc( 20rem * .7);
    padding-right: calc( 20rem * .7);
  }
}

.py-20 {
  padding-top: 20rem;
  padding-bottom: 20rem;
}
@media screen and (max-width: 767px) {
  .py-20 {
    padding-top: calc( 20rem * .7);
    padding-bottom: calc( 20rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-20 {
    margin-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-20 {
    margin-bottom: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-20 {
    margin-bottom: 20rem !important;
    margin-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-20 {
    padding-top: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-20 {
    padding-bottom: 20rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-20 {
    padding-bottom: 20rem !important;
    padding-top: 20rem !important;
  }
}

.mt-21 {
  margin-top: 21rem;
}
@media screen and (max-width: 767px) {
  .mt-21 {
    margin-top: calc( 21rem * .7);
  }
}

.mb-21 {
  margin-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .mb-21 {
    margin-bottom: calc( 21rem * .7);
  }
}

.ml-21 {
  margin-left: 21rem;
}
@media screen and (max-width: 767px) {
  .ml-21 {
    margin-left: calc( 21rem * .7);
  }
}

.mr-21 {
  margin-right: 21rem;
}
@media screen and (max-width: 767px) {
  .mr-21 {
    margin-right: calc( 21rem * .7);
  }
}

.mx-21 {
  margin-left: 21rem;
  margin-right: 21rem;
}
@media screen and (max-width: 767px) {
  .mx-21 {
    margin-left: calc( 21rem * .7);
    margin-right: calc( 21rem * .7);
  }
}

.my-21 {
  margin-top: 21rem;
  margin-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .my-21 {
    margin-top: calc( 21rem * .7);
    margin-bottom: calc( 21rem * .7);
  }
}

.pt-21 {
  padding-top: 21rem;
}
@media screen and (max-width: 767px) {
  .pt-21 {
    padding-top: calc( 21rem * .7);
  }
}

.pb-21 {
  padding-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .pb-21 {
    padding-bottom: calc( 21rem * .7);
  }
}

.pl-21 {
  padding-left: 21rem;
}
@media screen and (max-width: 767px) {
  .pl-21 {
    padding-left: calc( 21rem * .7);
  }
}

.pr-21 {
  padding-right: 21rem;
}
@media screen and (max-width: 767px) {
  .pr-21 {
    padding-right: calc( 21rem * .7);
  }
}

.px-21 {
  padding-left: 21rem;
  padding-right: 21rem;
}
@media screen and (max-width: 767px) {
  .px-21 {
    padding-left: calc( 21rem * .7);
    padding-right: calc( 21rem * .7);
  }
}

.py-21 {
  padding-top: 21rem;
  padding-bottom: 21rem;
}
@media screen and (max-width: 767px) {
  .py-21 {
    padding-top: calc( 21rem * .7);
    padding-bottom: calc( 21rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-21 {
    margin-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-21 {
    margin-bottom: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-21 {
    margin-bottom: 21rem !important;
    margin-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-21 {
    padding-top: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-21 {
    padding-bottom: 21rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-21 {
    padding-bottom: 21rem !important;
    padding-top: 21rem !important;
  }
}

.mt-22 {
  margin-top: 22rem;
}
@media screen and (max-width: 767px) {
  .mt-22 {
    margin-top: calc( 22rem * .7);
  }
}

.mb-22 {
  margin-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .mb-22 {
    margin-bottom: calc( 22rem * .7);
  }
}

.ml-22 {
  margin-left: 22rem;
}
@media screen and (max-width: 767px) {
  .ml-22 {
    margin-left: calc( 22rem * .7);
  }
}

.mr-22 {
  margin-right: 22rem;
}
@media screen and (max-width: 767px) {
  .mr-22 {
    margin-right: calc( 22rem * .7);
  }
}

.mx-22 {
  margin-left: 22rem;
  margin-right: 22rem;
}
@media screen and (max-width: 767px) {
  .mx-22 {
    margin-left: calc( 22rem * .7);
    margin-right: calc( 22rem * .7);
  }
}

.my-22 {
  margin-top: 22rem;
  margin-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .my-22 {
    margin-top: calc( 22rem * .7);
    margin-bottom: calc( 22rem * .7);
  }
}

.pt-22 {
  padding-top: 22rem;
}
@media screen and (max-width: 767px) {
  .pt-22 {
    padding-top: calc( 22rem * .7);
  }
}

.pb-22 {
  padding-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .pb-22 {
    padding-bottom: calc( 22rem * .7);
  }
}

.pl-22 {
  padding-left: 22rem;
}
@media screen and (max-width: 767px) {
  .pl-22 {
    padding-left: calc( 22rem * .7);
  }
}

.pr-22 {
  padding-right: 22rem;
}
@media screen and (max-width: 767px) {
  .pr-22 {
    padding-right: calc( 22rem * .7);
  }
}

.px-22 {
  padding-left: 22rem;
  padding-right: 22rem;
}
@media screen and (max-width: 767px) {
  .px-22 {
    padding-left: calc( 22rem * .7);
    padding-right: calc( 22rem * .7);
  }
}

.py-22 {
  padding-top: 22rem;
  padding-bottom: 22rem;
}
@media screen and (max-width: 767px) {
  .py-22 {
    padding-top: calc( 22rem * .7);
    padding-bottom: calc( 22rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-22 {
    margin-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-22 {
    margin-bottom: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-22 {
    margin-bottom: 22rem !important;
    margin-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-22 {
    padding-top: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-22 {
    padding-bottom: 22rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-22 {
    padding-bottom: 22rem !important;
    padding-top: 22rem !important;
  }
}

.mt-23 {
  margin-top: 23rem;
}
@media screen and (max-width: 767px) {
  .mt-23 {
    margin-top: calc( 23rem * .7);
  }
}

.mb-23 {
  margin-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .mb-23 {
    margin-bottom: calc( 23rem * .7);
  }
}

.ml-23 {
  margin-left: 23rem;
}
@media screen and (max-width: 767px) {
  .ml-23 {
    margin-left: calc( 23rem * .7);
  }
}

.mr-23 {
  margin-right: 23rem;
}
@media screen and (max-width: 767px) {
  .mr-23 {
    margin-right: calc( 23rem * .7);
  }
}

.mx-23 {
  margin-left: 23rem;
  margin-right: 23rem;
}
@media screen and (max-width: 767px) {
  .mx-23 {
    margin-left: calc( 23rem * .7);
    margin-right: calc( 23rem * .7);
  }
}

.my-23 {
  margin-top: 23rem;
  margin-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .my-23 {
    margin-top: calc( 23rem * .7);
    margin-bottom: calc( 23rem * .7);
  }
}

.pt-23 {
  padding-top: 23rem;
}
@media screen and (max-width: 767px) {
  .pt-23 {
    padding-top: calc( 23rem * .7);
  }
}

.pb-23 {
  padding-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .pb-23 {
    padding-bottom: calc( 23rem * .7);
  }
}

.pl-23 {
  padding-left: 23rem;
}
@media screen and (max-width: 767px) {
  .pl-23 {
    padding-left: calc( 23rem * .7);
  }
}

.pr-23 {
  padding-right: 23rem;
}
@media screen and (max-width: 767px) {
  .pr-23 {
    padding-right: calc( 23rem * .7);
  }
}

.px-23 {
  padding-left: 23rem;
  padding-right: 23rem;
}
@media screen and (max-width: 767px) {
  .px-23 {
    padding-left: calc( 23rem * .7);
    padding-right: calc( 23rem * .7);
  }
}

.py-23 {
  padding-top: 23rem;
  padding-bottom: 23rem;
}
@media screen and (max-width: 767px) {
  .py-23 {
    padding-top: calc( 23rem * .7);
    padding-bottom: calc( 23rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-23 {
    margin-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-23 {
    margin-bottom: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-23 {
    margin-bottom: 23rem !important;
    margin-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-23 {
    padding-top: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-23 {
    padding-bottom: 23rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-23 {
    padding-bottom: 23rem !important;
    padding-top: 23rem !important;
  }
}

.mt-24 {
  margin-top: 24rem;
}
@media screen and (max-width: 767px) {
  .mt-24 {
    margin-top: calc( 24rem * .7);
  }
}

.mb-24 {
  margin-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .mb-24 {
    margin-bottom: calc( 24rem * .7);
  }
}

.ml-24 {
  margin-left: 24rem;
}
@media screen and (max-width: 767px) {
  .ml-24 {
    margin-left: calc( 24rem * .7);
  }
}

.mr-24 {
  margin-right: 24rem;
}
@media screen and (max-width: 767px) {
  .mr-24 {
    margin-right: calc( 24rem * .7);
  }
}

.mx-24 {
  margin-left: 24rem;
  margin-right: 24rem;
}
@media screen and (max-width: 767px) {
  .mx-24 {
    margin-left: calc( 24rem * .7);
    margin-right: calc( 24rem * .7);
  }
}

.my-24 {
  margin-top: 24rem;
  margin-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .my-24 {
    margin-top: calc( 24rem * .7);
    margin-bottom: calc( 24rem * .7);
  }
}

.pt-24 {
  padding-top: 24rem;
}
@media screen and (max-width: 767px) {
  .pt-24 {
    padding-top: calc( 24rem * .7);
  }
}

.pb-24 {
  padding-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .pb-24 {
    padding-bottom: calc( 24rem * .7);
  }
}

.pl-24 {
  padding-left: 24rem;
}
@media screen and (max-width: 767px) {
  .pl-24 {
    padding-left: calc( 24rem * .7);
  }
}

.pr-24 {
  padding-right: 24rem;
}
@media screen and (max-width: 767px) {
  .pr-24 {
    padding-right: calc( 24rem * .7);
  }
}

.px-24 {
  padding-left: 24rem;
  padding-right: 24rem;
}
@media screen and (max-width: 767px) {
  .px-24 {
    padding-left: calc( 24rem * .7);
    padding-right: calc( 24rem * .7);
  }
}

.py-24 {
  padding-top: 24rem;
  padding-bottom: 24rem;
}
@media screen and (max-width: 767px) {
  .py-24 {
    padding-top: calc( 24rem * .7);
    padding-bottom: calc( 24rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-24 {
    margin-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-24 {
    margin-bottom: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-24 {
    margin-bottom: 24rem !important;
    margin-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-24 {
    padding-top: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-24 {
    padding-bottom: 24rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-24 {
    padding-bottom: 24rem !important;
    padding-top: 24rem !important;
  }
}

.mt-25 {
  margin-top: 25rem;
}
@media screen and (max-width: 767px) {
  .mt-25 {
    margin-top: calc( 25rem * .7);
  }
}

.mb-25 {
  margin-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .mb-25 {
    margin-bottom: calc( 25rem * .7);
  }
}

.ml-25 {
  margin-left: 25rem;
}
@media screen and (max-width: 767px) {
  .ml-25 {
    margin-left: calc( 25rem * .7);
  }
}

.mr-25 {
  margin-right: 25rem;
}
@media screen and (max-width: 767px) {
  .mr-25 {
    margin-right: calc( 25rem * .7);
  }
}

.mx-25 {
  margin-left: 25rem;
  margin-right: 25rem;
}
@media screen and (max-width: 767px) {
  .mx-25 {
    margin-left: calc( 25rem * .7);
    margin-right: calc( 25rem * .7);
  }
}

.my-25 {
  margin-top: 25rem;
  margin-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .my-25 {
    margin-top: calc( 25rem * .7);
    margin-bottom: calc( 25rem * .7);
  }
}

.pt-25 {
  padding-top: 25rem;
}
@media screen and (max-width: 767px) {
  .pt-25 {
    padding-top: calc( 25rem * .7);
  }
}

.pb-25 {
  padding-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .pb-25 {
    padding-bottom: calc( 25rem * .7);
  }
}

.pl-25 {
  padding-left: 25rem;
}
@media screen and (max-width: 767px) {
  .pl-25 {
    padding-left: calc( 25rem * .7);
  }
}

.pr-25 {
  padding-right: 25rem;
}
@media screen and (max-width: 767px) {
  .pr-25 {
    padding-right: calc( 25rem * .7);
  }
}

.px-25 {
  padding-left: 25rem;
  padding-right: 25rem;
}
@media screen and (max-width: 767px) {
  .px-25 {
    padding-left: calc( 25rem * .7);
    padding-right: calc( 25rem * .7);
  }
}

.py-25 {
  padding-top: 25rem;
  padding-bottom: 25rem;
}
@media screen and (max-width: 767px) {
  .py-25 {
    padding-top: calc( 25rem * .7);
    padding-bottom: calc( 25rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-25 {
    margin-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-25 {
    margin-bottom: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-25 {
    margin-bottom: 25rem !important;
    margin-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-25 {
    padding-top: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-25 {
    padding-bottom: 25rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-25 {
    padding-bottom: 25rem !important;
    padding-top: 25rem !important;
  }
}

.mt-26 {
  margin-top: 26rem;
}
@media screen and (max-width: 767px) {
  .mt-26 {
    margin-top: calc( 26rem * .7);
  }
}

.mb-26 {
  margin-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .mb-26 {
    margin-bottom: calc( 26rem * .7);
  }
}

.ml-26 {
  margin-left: 26rem;
}
@media screen and (max-width: 767px) {
  .ml-26 {
    margin-left: calc( 26rem * .7);
  }
}

.mr-26 {
  margin-right: 26rem;
}
@media screen and (max-width: 767px) {
  .mr-26 {
    margin-right: calc( 26rem * .7);
  }
}

.mx-26 {
  margin-left: 26rem;
  margin-right: 26rem;
}
@media screen and (max-width: 767px) {
  .mx-26 {
    margin-left: calc( 26rem * .7);
    margin-right: calc( 26rem * .7);
  }
}

.my-26 {
  margin-top: 26rem;
  margin-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .my-26 {
    margin-top: calc( 26rem * .7);
    margin-bottom: calc( 26rem * .7);
  }
}

.pt-26 {
  padding-top: 26rem;
}
@media screen and (max-width: 767px) {
  .pt-26 {
    padding-top: calc( 26rem * .7);
  }
}

.pb-26 {
  padding-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .pb-26 {
    padding-bottom: calc( 26rem * .7);
  }
}

.pl-26 {
  padding-left: 26rem;
}
@media screen and (max-width: 767px) {
  .pl-26 {
    padding-left: calc( 26rem * .7);
  }
}

.pr-26 {
  padding-right: 26rem;
}
@media screen and (max-width: 767px) {
  .pr-26 {
    padding-right: calc( 26rem * .7);
  }
}

.px-26 {
  padding-left: 26rem;
  padding-right: 26rem;
}
@media screen and (max-width: 767px) {
  .px-26 {
    padding-left: calc( 26rem * .7);
    padding-right: calc( 26rem * .7);
  }
}

.py-26 {
  padding-top: 26rem;
  padding-bottom: 26rem;
}
@media screen and (max-width: 767px) {
  .py-26 {
    padding-top: calc( 26rem * .7);
    padding-bottom: calc( 26rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-26 {
    margin-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-26 {
    margin-bottom: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-26 {
    margin-bottom: 26rem !important;
    margin-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-26 {
    padding-top: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-26 {
    padding-bottom: 26rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-26 {
    padding-bottom: 26rem !important;
    padding-top: 26rem !important;
  }
}

.mt-27 {
  margin-top: 27rem;
}
@media screen and (max-width: 767px) {
  .mt-27 {
    margin-top: calc( 27rem * .7);
  }
}

.mb-27 {
  margin-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .mb-27 {
    margin-bottom: calc( 27rem * .7);
  }
}

.ml-27 {
  margin-left: 27rem;
}
@media screen and (max-width: 767px) {
  .ml-27 {
    margin-left: calc( 27rem * .7);
  }
}

.mr-27 {
  margin-right: 27rem;
}
@media screen and (max-width: 767px) {
  .mr-27 {
    margin-right: calc( 27rem * .7);
  }
}

.mx-27 {
  margin-left: 27rem;
  margin-right: 27rem;
}
@media screen and (max-width: 767px) {
  .mx-27 {
    margin-left: calc( 27rem * .7);
    margin-right: calc( 27rem * .7);
  }
}

.my-27 {
  margin-top: 27rem;
  margin-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .my-27 {
    margin-top: calc( 27rem * .7);
    margin-bottom: calc( 27rem * .7);
  }
}

.pt-27 {
  padding-top: 27rem;
}
@media screen and (max-width: 767px) {
  .pt-27 {
    padding-top: calc( 27rem * .7);
  }
}

.pb-27 {
  padding-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .pb-27 {
    padding-bottom: calc( 27rem * .7);
  }
}

.pl-27 {
  padding-left: 27rem;
}
@media screen and (max-width: 767px) {
  .pl-27 {
    padding-left: calc( 27rem * .7);
  }
}

.pr-27 {
  padding-right: 27rem;
}
@media screen and (max-width: 767px) {
  .pr-27 {
    padding-right: calc( 27rem * .7);
  }
}

.px-27 {
  padding-left: 27rem;
  padding-right: 27rem;
}
@media screen and (max-width: 767px) {
  .px-27 {
    padding-left: calc( 27rem * .7);
    padding-right: calc( 27rem * .7);
  }
}

.py-27 {
  padding-top: 27rem;
  padding-bottom: 27rem;
}
@media screen and (max-width: 767px) {
  .py-27 {
    padding-top: calc( 27rem * .7);
    padding-bottom: calc( 27rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-27 {
    margin-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-27 {
    margin-bottom: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-27 {
    margin-bottom: 27rem !important;
    margin-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-27 {
    padding-top: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-27 {
    padding-bottom: 27rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-27 {
    padding-bottom: 27rem !important;
    padding-top: 27rem !important;
  }
}

.mt-28 {
  margin-top: 28rem;
}
@media screen and (max-width: 767px) {
  .mt-28 {
    margin-top: calc( 28rem * .7);
  }
}

.mb-28 {
  margin-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .mb-28 {
    margin-bottom: calc( 28rem * .7);
  }
}

.ml-28 {
  margin-left: 28rem;
}
@media screen and (max-width: 767px) {
  .ml-28 {
    margin-left: calc( 28rem * .7);
  }
}

.mr-28 {
  margin-right: 28rem;
}
@media screen and (max-width: 767px) {
  .mr-28 {
    margin-right: calc( 28rem * .7);
  }
}

.mx-28 {
  margin-left: 28rem;
  margin-right: 28rem;
}
@media screen and (max-width: 767px) {
  .mx-28 {
    margin-left: calc( 28rem * .7);
    margin-right: calc( 28rem * .7);
  }
}

.my-28 {
  margin-top: 28rem;
  margin-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .my-28 {
    margin-top: calc( 28rem * .7);
    margin-bottom: calc( 28rem * .7);
  }
}

.pt-28 {
  padding-top: 28rem;
}
@media screen and (max-width: 767px) {
  .pt-28 {
    padding-top: calc( 28rem * .7);
  }
}

.pb-28 {
  padding-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .pb-28 {
    padding-bottom: calc( 28rem * .7);
  }
}

.pl-28 {
  padding-left: 28rem;
}
@media screen and (max-width: 767px) {
  .pl-28 {
    padding-left: calc( 28rem * .7);
  }
}

.pr-28 {
  padding-right: 28rem;
}
@media screen and (max-width: 767px) {
  .pr-28 {
    padding-right: calc( 28rem * .7);
  }
}

.px-28 {
  padding-left: 28rem;
  padding-right: 28rem;
}
@media screen and (max-width: 767px) {
  .px-28 {
    padding-left: calc( 28rem * .7);
    padding-right: calc( 28rem * .7);
  }
}

.py-28 {
  padding-top: 28rem;
  padding-bottom: 28rem;
}
@media screen and (max-width: 767px) {
  .py-28 {
    padding-top: calc( 28rem * .7);
    padding-bottom: calc( 28rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-28 {
    margin-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-28 {
    margin-bottom: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-28 {
    margin-bottom: 28rem !important;
    margin-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-28 {
    padding-top: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-28 {
    padding-bottom: 28rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-28 {
    padding-bottom: 28rem !important;
    padding-top: 28rem !important;
  }
}

.mt-29 {
  margin-top: 29rem;
}
@media screen and (max-width: 767px) {
  .mt-29 {
    margin-top: calc( 29rem * .7);
  }
}

.mb-29 {
  margin-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .mb-29 {
    margin-bottom: calc( 29rem * .7);
  }
}

.ml-29 {
  margin-left: 29rem;
}
@media screen and (max-width: 767px) {
  .ml-29 {
    margin-left: calc( 29rem * .7);
  }
}

.mr-29 {
  margin-right: 29rem;
}
@media screen and (max-width: 767px) {
  .mr-29 {
    margin-right: calc( 29rem * .7);
  }
}

.mx-29 {
  margin-left: 29rem;
  margin-right: 29rem;
}
@media screen and (max-width: 767px) {
  .mx-29 {
    margin-left: calc( 29rem * .7);
    margin-right: calc( 29rem * .7);
  }
}

.my-29 {
  margin-top: 29rem;
  margin-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .my-29 {
    margin-top: calc( 29rem * .7);
    margin-bottom: calc( 29rem * .7);
  }
}

.pt-29 {
  padding-top: 29rem;
}
@media screen and (max-width: 767px) {
  .pt-29 {
    padding-top: calc( 29rem * .7);
  }
}

.pb-29 {
  padding-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .pb-29 {
    padding-bottom: calc( 29rem * .7);
  }
}

.pl-29 {
  padding-left: 29rem;
}
@media screen and (max-width: 767px) {
  .pl-29 {
    padding-left: calc( 29rem * .7);
  }
}

.pr-29 {
  padding-right: 29rem;
}
@media screen and (max-width: 767px) {
  .pr-29 {
    padding-right: calc( 29rem * .7);
  }
}

.px-29 {
  padding-left: 29rem;
  padding-right: 29rem;
}
@media screen and (max-width: 767px) {
  .px-29 {
    padding-left: calc( 29rem * .7);
    padding-right: calc( 29rem * .7);
  }
}

.py-29 {
  padding-top: 29rem;
  padding-bottom: 29rem;
}
@media screen and (max-width: 767px) {
  .py-29 {
    padding-top: calc( 29rem * .7);
    padding-bottom: calc( 29rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-29 {
    margin-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-29 {
    margin-bottom: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-29 {
    margin-bottom: 29rem !important;
    margin-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-29 {
    padding-top: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-29 {
    padding-bottom: 29rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-29 {
    padding-bottom: 29rem !important;
    padding-top: 29rem !important;
  }
}

.mt-30 {
  margin-top: 30rem;
}
@media screen and (max-width: 767px) {
  .mt-30 {
    margin-top: calc( 30rem * .7);
  }
}

.mb-30 {
  margin-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .mb-30 {
    margin-bottom: calc( 30rem * .7);
  }
}

.ml-30 {
  margin-left: 30rem;
}
@media screen and (max-width: 767px) {
  .ml-30 {
    margin-left: calc( 30rem * .7);
  }
}

.mr-30 {
  margin-right: 30rem;
}
@media screen and (max-width: 767px) {
  .mr-30 {
    margin-right: calc( 30rem * .7);
  }
}

.mx-30 {
  margin-left: 30rem;
  margin-right: 30rem;
}
@media screen and (max-width: 767px) {
  .mx-30 {
    margin-left: calc( 30rem * .7);
    margin-right: calc( 30rem * .7);
  }
}

.my-30 {
  margin-top: 30rem;
  margin-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .my-30 {
    margin-top: calc( 30rem * .7);
    margin-bottom: calc( 30rem * .7);
  }
}

.pt-30 {
  padding-top: 30rem;
}
@media screen and (max-width: 767px) {
  .pt-30 {
    padding-top: calc( 30rem * .7);
  }
}

.pb-30 {
  padding-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .pb-30 {
    padding-bottom: calc( 30rem * .7);
  }
}

.pl-30 {
  padding-left: 30rem;
}
@media screen and (max-width: 767px) {
  .pl-30 {
    padding-left: calc( 30rem * .7);
  }
}

.pr-30 {
  padding-right: 30rem;
}
@media screen and (max-width: 767px) {
  .pr-30 {
    padding-right: calc( 30rem * .7);
  }
}

.px-30 {
  padding-left: 30rem;
  padding-right: 30rem;
}
@media screen and (max-width: 767px) {
  .px-30 {
    padding-left: calc( 30rem * .7);
    padding-right: calc( 30rem * .7);
  }
}

.py-30 {
  padding-top: 30rem;
  padding-bottom: 30rem;
}
@media screen and (max-width: 767px) {
  .py-30 {
    padding-top: calc( 30rem * .7);
    padding-bottom: calc( 30rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-30 {
    margin-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-30 {
    margin-bottom: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-30 {
    margin-bottom: 30rem !important;
    margin-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-30 {
    padding-top: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-30 {
    padding-bottom: 30rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-30 {
    padding-bottom: 30rem !important;
    padding-top: 30rem !important;
  }
}

.mt-31 {
  margin-top: 31rem;
}
@media screen and (max-width: 767px) {
  .mt-31 {
    margin-top: calc( 31rem * .7);
  }
}

.mb-31 {
  margin-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .mb-31 {
    margin-bottom: calc( 31rem * .7);
  }
}

.ml-31 {
  margin-left: 31rem;
}
@media screen and (max-width: 767px) {
  .ml-31 {
    margin-left: calc( 31rem * .7);
  }
}

.mr-31 {
  margin-right: 31rem;
}
@media screen and (max-width: 767px) {
  .mr-31 {
    margin-right: calc( 31rem * .7);
  }
}

.mx-31 {
  margin-left: 31rem;
  margin-right: 31rem;
}
@media screen and (max-width: 767px) {
  .mx-31 {
    margin-left: calc( 31rem * .7);
    margin-right: calc( 31rem * .7);
  }
}

.my-31 {
  margin-top: 31rem;
  margin-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .my-31 {
    margin-top: calc( 31rem * .7);
    margin-bottom: calc( 31rem * .7);
  }
}

.pt-31 {
  padding-top: 31rem;
}
@media screen and (max-width: 767px) {
  .pt-31 {
    padding-top: calc( 31rem * .7);
  }
}

.pb-31 {
  padding-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .pb-31 {
    padding-bottom: calc( 31rem * .7);
  }
}

.pl-31 {
  padding-left: 31rem;
}
@media screen and (max-width: 767px) {
  .pl-31 {
    padding-left: calc( 31rem * .7);
  }
}

.pr-31 {
  padding-right: 31rem;
}
@media screen and (max-width: 767px) {
  .pr-31 {
    padding-right: calc( 31rem * .7);
  }
}

.px-31 {
  padding-left: 31rem;
  padding-right: 31rem;
}
@media screen and (max-width: 767px) {
  .px-31 {
    padding-left: calc( 31rem * .7);
    padding-right: calc( 31rem * .7);
  }
}

.py-31 {
  padding-top: 31rem;
  padding-bottom: 31rem;
}
@media screen and (max-width: 767px) {
  .py-31 {
    padding-top: calc( 31rem * .7);
    padding-bottom: calc( 31rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-31 {
    margin-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-31 {
    margin-bottom: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-31 {
    margin-bottom: 31rem !important;
    margin-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-31 {
    padding-top: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-31 {
    padding-bottom: 31rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-31 {
    padding-bottom: 31rem !important;
    padding-top: 31rem !important;
  }
}

.mt-32 {
  margin-top: 32rem;
}
@media screen and (max-width: 767px) {
  .mt-32 {
    margin-top: calc( 32rem * .7);
  }
}

.mb-32 {
  margin-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .mb-32 {
    margin-bottom: calc( 32rem * .7);
  }
}

.ml-32 {
  margin-left: 32rem;
}
@media screen and (max-width: 767px) {
  .ml-32 {
    margin-left: calc( 32rem * .7);
  }
}

.mr-32 {
  margin-right: 32rem;
}
@media screen and (max-width: 767px) {
  .mr-32 {
    margin-right: calc( 32rem * .7);
  }
}

.mx-32 {
  margin-left: 32rem;
  margin-right: 32rem;
}
@media screen and (max-width: 767px) {
  .mx-32 {
    margin-left: calc( 32rem * .7);
    margin-right: calc( 32rem * .7);
  }
}

.my-32 {
  margin-top: 32rem;
  margin-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .my-32 {
    margin-top: calc( 32rem * .7);
    margin-bottom: calc( 32rem * .7);
  }
}

.pt-32 {
  padding-top: 32rem;
}
@media screen and (max-width: 767px) {
  .pt-32 {
    padding-top: calc( 32rem * .7);
  }
}

.pb-32 {
  padding-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .pb-32 {
    padding-bottom: calc( 32rem * .7);
  }
}

.pl-32 {
  padding-left: 32rem;
}
@media screen and (max-width: 767px) {
  .pl-32 {
    padding-left: calc( 32rem * .7);
  }
}

.pr-32 {
  padding-right: 32rem;
}
@media screen and (max-width: 767px) {
  .pr-32 {
    padding-right: calc( 32rem * .7);
  }
}

.px-32 {
  padding-left: 32rem;
  padding-right: 32rem;
}
@media screen and (max-width: 767px) {
  .px-32 {
    padding-left: calc( 32rem * .7);
    padding-right: calc( 32rem * .7);
  }
}

.py-32 {
  padding-top: 32rem;
  padding-bottom: 32rem;
}
@media screen and (max-width: 767px) {
  .py-32 {
    padding-top: calc( 32rem * .7);
    padding-bottom: calc( 32rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-32 {
    margin-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-32 {
    margin-bottom: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-32 {
    margin-bottom: 32rem !important;
    margin-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-32 {
    padding-top: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-32 {
    padding-bottom: 32rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-32 {
    padding-bottom: 32rem !important;
    padding-top: 32rem !important;
  }
}

.mt-33 {
  margin-top: 33rem;
}
@media screen and (max-width: 767px) {
  .mt-33 {
    margin-top: calc( 33rem * .7);
  }
}

.mb-33 {
  margin-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .mb-33 {
    margin-bottom: calc( 33rem * .7);
  }
}

.ml-33 {
  margin-left: 33rem;
}
@media screen and (max-width: 767px) {
  .ml-33 {
    margin-left: calc( 33rem * .7);
  }
}

.mr-33 {
  margin-right: 33rem;
}
@media screen and (max-width: 767px) {
  .mr-33 {
    margin-right: calc( 33rem * .7);
  }
}

.mx-33 {
  margin-left: 33rem;
  margin-right: 33rem;
}
@media screen and (max-width: 767px) {
  .mx-33 {
    margin-left: calc( 33rem * .7);
    margin-right: calc( 33rem * .7);
  }
}

.my-33 {
  margin-top: 33rem;
  margin-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .my-33 {
    margin-top: calc( 33rem * .7);
    margin-bottom: calc( 33rem * .7);
  }
}

.pt-33 {
  padding-top: 33rem;
}
@media screen and (max-width: 767px) {
  .pt-33 {
    padding-top: calc( 33rem * .7);
  }
}

.pb-33 {
  padding-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .pb-33 {
    padding-bottom: calc( 33rem * .7);
  }
}

.pl-33 {
  padding-left: 33rem;
}
@media screen and (max-width: 767px) {
  .pl-33 {
    padding-left: calc( 33rem * .7);
  }
}

.pr-33 {
  padding-right: 33rem;
}
@media screen and (max-width: 767px) {
  .pr-33 {
    padding-right: calc( 33rem * .7);
  }
}

.px-33 {
  padding-left: 33rem;
  padding-right: 33rem;
}
@media screen and (max-width: 767px) {
  .px-33 {
    padding-left: calc( 33rem * .7);
    padding-right: calc( 33rem * .7);
  }
}

.py-33 {
  padding-top: 33rem;
  padding-bottom: 33rem;
}
@media screen and (max-width: 767px) {
  .py-33 {
    padding-top: calc( 33rem * .7);
    padding-bottom: calc( 33rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-33 {
    margin-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-33 {
    margin-bottom: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-33 {
    margin-bottom: 33rem !important;
    margin-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-33 {
    padding-top: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-33 {
    padding-bottom: 33rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-33 {
    padding-bottom: 33rem !important;
    padding-top: 33rem !important;
  }
}

.mt-34 {
  margin-top: 34rem;
}
@media screen and (max-width: 767px) {
  .mt-34 {
    margin-top: calc( 34rem * .7);
  }
}

.mb-34 {
  margin-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .mb-34 {
    margin-bottom: calc( 34rem * .7);
  }
}

.ml-34 {
  margin-left: 34rem;
}
@media screen and (max-width: 767px) {
  .ml-34 {
    margin-left: calc( 34rem * .7);
  }
}

.mr-34 {
  margin-right: 34rem;
}
@media screen and (max-width: 767px) {
  .mr-34 {
    margin-right: calc( 34rem * .7);
  }
}

.mx-34 {
  margin-left: 34rem;
  margin-right: 34rem;
}
@media screen and (max-width: 767px) {
  .mx-34 {
    margin-left: calc( 34rem * .7);
    margin-right: calc( 34rem * .7);
  }
}

.my-34 {
  margin-top: 34rem;
  margin-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .my-34 {
    margin-top: calc( 34rem * .7);
    margin-bottom: calc( 34rem * .7);
  }
}

.pt-34 {
  padding-top: 34rem;
}
@media screen and (max-width: 767px) {
  .pt-34 {
    padding-top: calc( 34rem * .7);
  }
}

.pb-34 {
  padding-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .pb-34 {
    padding-bottom: calc( 34rem * .7);
  }
}

.pl-34 {
  padding-left: 34rem;
}
@media screen and (max-width: 767px) {
  .pl-34 {
    padding-left: calc( 34rem * .7);
  }
}

.pr-34 {
  padding-right: 34rem;
}
@media screen and (max-width: 767px) {
  .pr-34 {
    padding-right: calc( 34rem * .7);
  }
}

.px-34 {
  padding-left: 34rem;
  padding-right: 34rem;
}
@media screen and (max-width: 767px) {
  .px-34 {
    padding-left: calc( 34rem * .7);
    padding-right: calc( 34rem * .7);
  }
}

.py-34 {
  padding-top: 34rem;
  padding-bottom: 34rem;
}
@media screen and (max-width: 767px) {
  .py-34 {
    padding-top: calc( 34rem * .7);
    padding-bottom: calc( 34rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-34 {
    margin-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-34 {
    margin-bottom: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-34 {
    margin-bottom: 34rem !important;
    margin-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-34 {
    padding-top: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-34 {
    padding-bottom: 34rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-34 {
    padding-bottom: 34rem !important;
    padding-top: 34rem !important;
  }
}

.mt-35 {
  margin-top: 35rem;
}
@media screen and (max-width: 767px) {
  .mt-35 {
    margin-top: calc( 35rem * .7);
  }
}

.mb-35 {
  margin-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .mb-35 {
    margin-bottom: calc( 35rem * .7);
  }
}

.ml-35 {
  margin-left: 35rem;
}
@media screen and (max-width: 767px) {
  .ml-35 {
    margin-left: calc( 35rem * .7);
  }
}

.mr-35 {
  margin-right: 35rem;
}
@media screen and (max-width: 767px) {
  .mr-35 {
    margin-right: calc( 35rem * .7);
  }
}

.mx-35 {
  margin-left: 35rem;
  margin-right: 35rem;
}
@media screen and (max-width: 767px) {
  .mx-35 {
    margin-left: calc( 35rem * .7);
    margin-right: calc( 35rem * .7);
  }
}

.my-35 {
  margin-top: 35rem;
  margin-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .my-35 {
    margin-top: calc( 35rem * .7);
    margin-bottom: calc( 35rem * .7);
  }
}

.pt-35 {
  padding-top: 35rem;
}
@media screen and (max-width: 767px) {
  .pt-35 {
    padding-top: calc( 35rem * .7);
  }
}

.pb-35 {
  padding-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .pb-35 {
    padding-bottom: calc( 35rem * .7);
  }
}

.pl-35 {
  padding-left: 35rem;
}
@media screen and (max-width: 767px) {
  .pl-35 {
    padding-left: calc( 35rem * .7);
  }
}

.pr-35 {
  padding-right: 35rem;
}
@media screen and (max-width: 767px) {
  .pr-35 {
    padding-right: calc( 35rem * .7);
  }
}

.px-35 {
  padding-left: 35rem;
  padding-right: 35rem;
}
@media screen and (max-width: 767px) {
  .px-35 {
    padding-left: calc( 35rem * .7);
    padding-right: calc( 35rem * .7);
  }
}

.py-35 {
  padding-top: 35rem;
  padding-bottom: 35rem;
}
@media screen and (max-width: 767px) {
  .py-35 {
    padding-top: calc( 35rem * .7);
    padding-bottom: calc( 35rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-35 {
    margin-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-35 {
    margin-bottom: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-35 {
    margin-bottom: 35rem !important;
    margin-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-35 {
    padding-top: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-35 {
    padding-bottom: 35rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-35 {
    padding-bottom: 35rem !important;
    padding-top: 35rem !important;
  }
}

.mt-36 {
  margin-top: 36rem;
}
@media screen and (max-width: 767px) {
  .mt-36 {
    margin-top: calc( 36rem * .7);
  }
}

.mb-36 {
  margin-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .mb-36 {
    margin-bottom: calc( 36rem * .7);
  }
}

.ml-36 {
  margin-left: 36rem;
}
@media screen and (max-width: 767px) {
  .ml-36 {
    margin-left: calc( 36rem * .7);
  }
}

.mr-36 {
  margin-right: 36rem;
}
@media screen and (max-width: 767px) {
  .mr-36 {
    margin-right: calc( 36rem * .7);
  }
}

.mx-36 {
  margin-left: 36rem;
  margin-right: 36rem;
}
@media screen and (max-width: 767px) {
  .mx-36 {
    margin-left: calc( 36rem * .7);
    margin-right: calc( 36rem * .7);
  }
}

.my-36 {
  margin-top: 36rem;
  margin-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .my-36 {
    margin-top: calc( 36rem * .7);
    margin-bottom: calc( 36rem * .7);
  }
}

.pt-36 {
  padding-top: 36rem;
}
@media screen and (max-width: 767px) {
  .pt-36 {
    padding-top: calc( 36rem * .7);
  }
}

.pb-36 {
  padding-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .pb-36 {
    padding-bottom: calc( 36rem * .7);
  }
}

.pl-36 {
  padding-left: 36rem;
}
@media screen and (max-width: 767px) {
  .pl-36 {
    padding-left: calc( 36rem * .7);
  }
}

.pr-36 {
  padding-right: 36rem;
}
@media screen and (max-width: 767px) {
  .pr-36 {
    padding-right: calc( 36rem * .7);
  }
}

.px-36 {
  padding-left: 36rem;
  padding-right: 36rem;
}
@media screen and (max-width: 767px) {
  .px-36 {
    padding-left: calc( 36rem * .7);
    padding-right: calc( 36rem * .7);
  }
}

.py-36 {
  padding-top: 36rem;
  padding-bottom: 36rem;
}
@media screen and (max-width: 767px) {
  .py-36 {
    padding-top: calc( 36rem * .7);
    padding-bottom: calc( 36rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-36 {
    margin-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-36 {
    margin-bottom: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-36 {
    margin-bottom: 36rem !important;
    margin-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-36 {
    padding-top: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-36 {
    padding-bottom: 36rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-36 {
    padding-bottom: 36rem !important;
    padding-top: 36rem !important;
  }
}

.mt-37 {
  margin-top: 37rem;
}
@media screen and (max-width: 767px) {
  .mt-37 {
    margin-top: calc( 37rem * .7);
  }
}

.mb-37 {
  margin-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .mb-37 {
    margin-bottom: calc( 37rem * .7);
  }
}

.ml-37 {
  margin-left: 37rem;
}
@media screen and (max-width: 767px) {
  .ml-37 {
    margin-left: calc( 37rem * .7);
  }
}

.mr-37 {
  margin-right: 37rem;
}
@media screen and (max-width: 767px) {
  .mr-37 {
    margin-right: calc( 37rem * .7);
  }
}

.mx-37 {
  margin-left: 37rem;
  margin-right: 37rem;
}
@media screen and (max-width: 767px) {
  .mx-37 {
    margin-left: calc( 37rem * .7);
    margin-right: calc( 37rem * .7);
  }
}

.my-37 {
  margin-top: 37rem;
  margin-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .my-37 {
    margin-top: calc( 37rem * .7);
    margin-bottom: calc( 37rem * .7);
  }
}

.pt-37 {
  padding-top: 37rem;
}
@media screen and (max-width: 767px) {
  .pt-37 {
    padding-top: calc( 37rem * .7);
  }
}

.pb-37 {
  padding-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .pb-37 {
    padding-bottom: calc( 37rem * .7);
  }
}

.pl-37 {
  padding-left: 37rem;
}
@media screen and (max-width: 767px) {
  .pl-37 {
    padding-left: calc( 37rem * .7);
  }
}

.pr-37 {
  padding-right: 37rem;
}
@media screen and (max-width: 767px) {
  .pr-37 {
    padding-right: calc( 37rem * .7);
  }
}

.px-37 {
  padding-left: 37rem;
  padding-right: 37rem;
}
@media screen and (max-width: 767px) {
  .px-37 {
    padding-left: calc( 37rem * .7);
    padding-right: calc( 37rem * .7);
  }
}

.py-37 {
  padding-top: 37rem;
  padding-bottom: 37rem;
}
@media screen and (max-width: 767px) {
  .py-37 {
    padding-top: calc( 37rem * .7);
    padding-bottom: calc( 37rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-37 {
    margin-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-37 {
    margin-bottom: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-37 {
    margin-bottom: 37rem !important;
    margin-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-37 {
    padding-top: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-37 {
    padding-bottom: 37rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-37 {
    padding-bottom: 37rem !important;
    padding-top: 37rem !important;
  }
}

.mt-38 {
  margin-top: 38rem;
}
@media screen and (max-width: 767px) {
  .mt-38 {
    margin-top: calc( 38rem * .7);
  }
}

.mb-38 {
  margin-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .mb-38 {
    margin-bottom: calc( 38rem * .7);
  }
}

.ml-38 {
  margin-left: 38rem;
}
@media screen and (max-width: 767px) {
  .ml-38 {
    margin-left: calc( 38rem * .7);
  }
}

.mr-38 {
  margin-right: 38rem;
}
@media screen and (max-width: 767px) {
  .mr-38 {
    margin-right: calc( 38rem * .7);
  }
}

.mx-38 {
  margin-left: 38rem;
  margin-right: 38rem;
}
@media screen and (max-width: 767px) {
  .mx-38 {
    margin-left: calc( 38rem * .7);
    margin-right: calc( 38rem * .7);
  }
}

.my-38 {
  margin-top: 38rem;
  margin-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .my-38 {
    margin-top: calc( 38rem * .7);
    margin-bottom: calc( 38rem * .7);
  }
}

.pt-38 {
  padding-top: 38rem;
}
@media screen and (max-width: 767px) {
  .pt-38 {
    padding-top: calc( 38rem * .7);
  }
}

.pb-38 {
  padding-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .pb-38 {
    padding-bottom: calc( 38rem * .7);
  }
}

.pl-38 {
  padding-left: 38rem;
}
@media screen and (max-width: 767px) {
  .pl-38 {
    padding-left: calc( 38rem * .7);
  }
}

.pr-38 {
  padding-right: 38rem;
}
@media screen and (max-width: 767px) {
  .pr-38 {
    padding-right: calc( 38rem * .7);
  }
}

.px-38 {
  padding-left: 38rem;
  padding-right: 38rem;
}
@media screen and (max-width: 767px) {
  .px-38 {
    padding-left: calc( 38rem * .7);
    padding-right: calc( 38rem * .7);
  }
}

.py-38 {
  padding-top: 38rem;
  padding-bottom: 38rem;
}
@media screen and (max-width: 767px) {
  .py-38 {
    padding-top: calc( 38rem * .7);
    padding-bottom: calc( 38rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-38 {
    margin-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-38 {
    margin-bottom: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-38 {
    margin-bottom: 38rem !important;
    margin-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-38 {
    padding-top: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-38 {
    padding-bottom: 38rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-38 {
    padding-bottom: 38rem !important;
    padding-top: 38rem !important;
  }
}

.mt-39 {
  margin-top: 39rem;
}
@media screen and (max-width: 767px) {
  .mt-39 {
    margin-top: calc( 39rem * .7);
  }
}

.mb-39 {
  margin-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .mb-39 {
    margin-bottom: calc( 39rem * .7);
  }
}

.ml-39 {
  margin-left: 39rem;
}
@media screen and (max-width: 767px) {
  .ml-39 {
    margin-left: calc( 39rem * .7);
  }
}

.mr-39 {
  margin-right: 39rem;
}
@media screen and (max-width: 767px) {
  .mr-39 {
    margin-right: calc( 39rem * .7);
  }
}

.mx-39 {
  margin-left: 39rem;
  margin-right: 39rem;
}
@media screen and (max-width: 767px) {
  .mx-39 {
    margin-left: calc( 39rem * .7);
    margin-right: calc( 39rem * .7);
  }
}

.my-39 {
  margin-top: 39rem;
  margin-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .my-39 {
    margin-top: calc( 39rem * .7);
    margin-bottom: calc( 39rem * .7);
  }
}

.pt-39 {
  padding-top: 39rem;
}
@media screen and (max-width: 767px) {
  .pt-39 {
    padding-top: calc( 39rem * .7);
  }
}

.pb-39 {
  padding-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .pb-39 {
    padding-bottom: calc( 39rem * .7);
  }
}

.pl-39 {
  padding-left: 39rem;
}
@media screen and (max-width: 767px) {
  .pl-39 {
    padding-left: calc( 39rem * .7);
  }
}

.pr-39 {
  padding-right: 39rem;
}
@media screen and (max-width: 767px) {
  .pr-39 {
    padding-right: calc( 39rem * .7);
  }
}

.px-39 {
  padding-left: 39rem;
  padding-right: 39rem;
}
@media screen and (max-width: 767px) {
  .px-39 {
    padding-left: calc( 39rem * .7);
    padding-right: calc( 39rem * .7);
  }
}

.py-39 {
  padding-top: 39rem;
  padding-bottom: 39rem;
}
@media screen and (max-width: 767px) {
  .py-39 {
    padding-top: calc( 39rem * .7);
    padding-bottom: calc( 39rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-39 {
    margin-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-39 {
    margin-bottom: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-39 {
    margin-bottom: 39rem !important;
    margin-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-39 {
    padding-top: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-39 {
    padding-bottom: 39rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-39 {
    padding-bottom: 39rem !important;
    padding-top: 39rem !important;
  }
}

.mt-40 {
  margin-top: 40rem;
}
@media screen and (max-width: 767px) {
  .mt-40 {
    margin-top: calc( 40rem * .7);
  }
}

.mb-40 {
  margin-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .mb-40 {
    margin-bottom: calc( 40rem * .7);
  }
}

.ml-40 {
  margin-left: 40rem;
}
@media screen and (max-width: 767px) {
  .ml-40 {
    margin-left: calc( 40rem * .7);
  }
}

.mr-40 {
  margin-right: 40rem;
}
@media screen and (max-width: 767px) {
  .mr-40 {
    margin-right: calc( 40rem * .7);
  }
}

.mx-40 {
  margin-left: 40rem;
  margin-right: 40rem;
}
@media screen and (max-width: 767px) {
  .mx-40 {
    margin-left: calc( 40rem * .7);
    margin-right: calc( 40rem * .7);
  }
}

.my-40 {
  margin-top: 40rem;
  margin-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .my-40 {
    margin-top: calc( 40rem * .7);
    margin-bottom: calc( 40rem * .7);
  }
}

.pt-40 {
  padding-top: 40rem;
}
@media screen and (max-width: 767px) {
  .pt-40 {
    padding-top: calc( 40rem * .7);
  }
}

.pb-40 {
  padding-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .pb-40 {
    padding-bottom: calc( 40rem * .7);
  }
}

.pl-40 {
  padding-left: 40rem;
}
@media screen and (max-width: 767px) {
  .pl-40 {
    padding-left: calc( 40rem * .7);
  }
}

.pr-40 {
  padding-right: 40rem;
}
@media screen and (max-width: 767px) {
  .pr-40 {
    padding-right: calc( 40rem * .7);
  }
}

.px-40 {
  padding-left: 40rem;
  padding-right: 40rem;
}
@media screen and (max-width: 767px) {
  .px-40 {
    padding-left: calc( 40rem * .7);
    padding-right: calc( 40rem * .7);
  }
}

.py-40 {
  padding-top: 40rem;
  padding-bottom: 40rem;
}
@media screen and (max-width: 767px) {
  .py-40 {
    padding-top: calc( 40rem * .7);
    padding-bottom: calc( 40rem * .7);
  }
}

@media screen and (max-width: 767px) {
  .sp-mt-40 {
    margin-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-mb-40 {
    margin-bottom: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-my-40 {
    margin-bottom: 40rem !important;
    margin-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pt-40 {
    padding-top: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-pb-40 {
    padding-bottom: 40rem !important;
  }
}

@media screen and (max-width: 767px) {
  .sp-py-40 {
    padding-bottom: 40rem !important;
    padding-top: 40rem !important;
  }
}

.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp {
    display: inline-block;
  }
}

.pc {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }
}

* {
  margin: 0px;
  padding: 0px;
  border: 0px;
}

img {
  width: 100%;
  height: auto;
  vertical-align: baseline;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  letter-spacing: 0.05em;
  position: relative;
  z-index: 0;
}

/* 520px以上 共通項目 */
#main {
  position: relative;
}
#main .to-staylist {
  position: absolute;
  width: 135px;
  max-width: 16%;
  height: 15px;
  right: 5%;
  top: -2%;
  z-index: 85;
}

#header {
  position: relative;
  z-index: 0;
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
  justify-content: center;
  align-content: center;
  align-items: center;
  /*.navbar-links{
    width:50%;
    ul{
      position: absolute;
      top:22px;
      left:12%;
      li{
        list-style-type: none;
        float: left;
        padding: 0px 15px;
        border-right: 1px solid #000;
        a{
        text-decoration: none;
        color: #000;
        font-size:0.8rem;
        }
        &:nth-last-child(1){
          border-right: none;
        }
      }
    }
  }*/
  /*.noren{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: -10rem;
    z-index: 1;
    position: relative;
    figure{
      width: 60%;
      max-width: 300px;
    }
  }*/
}
#header .headerWrapper {
  width: 100%;
}
#header .headerWrapper h1 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  z-index: 2;
  width: 60%;
  max-width: 300px;
}
#header .headerWrapper h1 figure {
  width: 100%;
}
#header .headerWrapper h1 figure img {
  width: 100%;
}
#header .mv {
  height: 100%;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
}
#header .mv-text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
#header .mv-text-inner {
  width: 90%;
  max-width: 1400px;
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #header .mv-text-inner {
    padding-bottom: 4rem;
  }
}
#header .mv-text-inner p {
  color: #fff;
  font-size: 3rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  #header .mv-text-inner p {
    font-size: 2rem;
  }
}
#header .mv figure {
  height: 100%;
  width: 100%;
  display: block;
}
#header .mv figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#header .mv .swiper {
  width: 100%;
  min-height: 600px;
  height: 95vh;
}
@media screen and (max-width: 767px) {
  #header .mv .swiper {
    height: 95vh;
    min-height: 95vh;
    /* フォールバック */
    min-height: 95svh;
    /* “小さい方” = UIが出てる状態でもはみ出しにくい */
    min-height: 95dvh;
    /* “動的” = UIの出入りに追従（対応ブラウザで） */
  }
}
#header .mv .swiper .swiper-wrapper {
  width: 100%;
  height: 100%;
}
#header .mv .swiper .swiper-wrapper .slide-block {
  width: 100%;
  height: 100%;
}
#header .mv .swiper .swiper-wrapper .slide-block figure {
  width: 100%;
  height: 100%;
}
#header .mv .swiper .swiper-wrapper .slide-block figure img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
#header .mv .swiper .swiper-wrapper .slide-block > div {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
#header .headerWrapper .only-sp {
  display: none;
}
#header .headerWrapper .logo {
  margin-bottom: 10%;
  width: 39vw;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  #header .headerWrapper .logo {
    width: 70%;
    margin-bottom: 40%;
  }
}
#header .headerWrapper ul li {
  list-style-type: none;
}
#header .headerWrapper ul li.button {
  position: absolute;
  top: 2rem;
  right: 2rem;
  width: auto;
}
#header .headerWrapper ul li.button a {
  display: block;
  background-color: #a01f24;
  color: #FFF;
  font-size: 1.1rem;
  border-radius: 10rem;
  padding: 0.8em 2rem;
  text-decoration: none;
  box-shadow: 0 0 34px rgba(0, 0, 0, 0.2);
}
#header .headerWrapper ul li.button a i {
  padding-left: 1rem;
}
#header .navbar-links {
  display: none;
}

.image-photo {
  height: 480px;
  background-image: url(../../images/step-back-top.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.block.message {
  position: relative;
}
@media screen and (max-width: 767px) {
  .block.message {
    margin: 3rem 0;
  }
}
.block.message::before {
  display: block;
  background-image: url(../../images/sakuraBg.png);
  background-size: 120%;
  background-repeat: no-repeat;
  background-position: center 1% top -5%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.block.message p {
  line-height: 2;
  text-align: center;
  font-size: 1.6rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  .block.message p {
    font-size: 1.2rem;
  }
}
.block.message .wrapper {
  position: relative;
  text-align: center;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  z-index: 50;
  z-index: 55;
}
.block.message .wrapper .headline .impact {
  position: relative;
  display: inline-block;
  margin-bottom: 25px;
}
.block.message .wrapper .headline .impact span {
  color: #216ab7;
  font-size: 1.5rem;
  font-weight: bold;
  padding-right: 2px;
}
.block.message .wrapper .headline .impact::before {
  display: inline-block;
  background-image: url(../../images/impact-before.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: bottom;
  width: 15px;
  height: 35px;
  position: absolute;
  top: 50%;
  left: -2rem;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 50;
}
.block.message .wrapper .headline .impact::after {
  display: inline-block;
  background-image: url(../../images/impact-after.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: bottom;
  width: 15px;
  height: 35px;
  position: absolute;
  top: 50%;
  right: -2rem;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 50;
}
.block.message .wrapper .headline .title {
  line-height: 1.6em;
  font-size: 1.8rem;
  font-weight: normal;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 767px) {
  .block.message .wrapper .headline .title {
    font-size: 1.6rem;
  }
}
.block.message .wrapper .headline .text {
  font-size: 1rem;
  line-height: 2em;
  margin-bottom: 55px;
}
.block.message .wrapper .tokuten {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 3rem;
  font-size: 1.9rem;
}
@media screen and (max-width: 767px) {
  .block.message .wrapper .tokuten {
    font-size: 1.05rem;
  }
}
.block.message .wrapper .tokuten-main {
  font-size: 1.8em;
  line-height: 1;
}
.block.message .wrapper .tokuten-main b {
  font-weight: normal;
  font-size: 1.4em;
  color: #f470a4;
}
.block.message .wrapper .tokuten-sub {
  font-size: 1em;
  display: inline-block;
  padding: 0.3em 2em;
  background: rgba(255, 255, 255, 0.3);
  border-top: 1px solid rgba(0, 0, 0, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}
.block.message .wrapper .tokuten .term {
  font-size: 16px;
  line-height: 1.5;
}
.block.message .wrapper .button {
  position: relative;
}
.block.message .wrapper .button.stay-list {
  display: inline-block;
  background-color: #f470a4;
  border-radius: 100vh;
}
.block.message .wrapper .button.stay-list i {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.block.message .wrapper .button.stay-list a {
  display: block;
  color: #FFF;
  padding: 10px 85px;
  text-decoration: none;
}
.block.recommend {
  position: relative;
}
.block.recommend .wrapper {
  position: relative;
  text-align: center;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  z-index: 50;
}
.block.recommend .wrapper .headline .text {
  text-align: center;
  padding: 10px 15px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 1.4rem;
  margin-bottom: 35px;
  font-weight: bold;
}
.block.recommend .wrapper .box-wrap {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
}
.block.recommend .wrapper .box-wrap .box {
  margin-bottom: 75px;
  background: rgba(255, 255, 255, 0.7);
}
.block.recommend .wrapper .box-wrap .box .inner {
  position: relative;
  text-align: left;
  line-height: 2em;
  padding: 4rem 2rem;
  background-size: 100%;
  z-index: 10;
}
.block.recommend .wrapper .box-wrap .box .inner .title {
  /*text-decoration: underline;

  text-decoration-thickness: 0.5em; 
  text-decoration-color: rgba(255, 255, 76, 0.7); 
  text-underline-offset: -0.2em; 
  text-decoration-skip-ink: none; 
  */
  margin-bottom: 15px;
  font-size: 1.4rem;
  font-weight: bold;
}
.block.recommend .wrapper .box-wrap .box .inner .text {
  text-align: left;
  font-size: 0.8rem;
  line-height: 2em;
}
.block.recommend .wrapper .box-wrap .box .inner .text span {
  color: #216ab7;
  font-weight: bold;
}
.block.recommend .wrapper .box-wrap .box .inner.one::before {
  display: block;
  background-image: url(../../images/recommend-title-top-001.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 75px;
  position: absolute;
  left: 0px;
  top: -35px;
  z-index: 15;
}
.block.recommend .wrapper .box-wrap .box .inner.one .step-list::before {
  display: block;
  background-image: url(../../images/step-illust-001.png);
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 100%;
  height: 195px;
  position: absolute;
  top: 50%;
  right: -190px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 45;
}
.block.recommend .wrapper .box-wrap .box .inner.two::before {
  display: block;
  background-image: url(../../images/recommend-title-top-002.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 55px;
  position: absolute;
  left: 0px;
  top: -35px;
  z-index: 15;
}
.block.recommend .wrapper .box-wrap .box .inner.two .step-list::before {
  display: block;
  background-image: url(../../images/step-illust-002.png);
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 100%;
  height: 170px;
  position: absolute;
  top: 50%;
  right: -190px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 45;
}
.block.recommend .wrapper .box-wrap .box .inner.three::before {
  display: block;
  background-image: url(../../images/recommend-title-top-003.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 55px;
  position: absolute;
  left: 0px;
  top: -35px;
  z-index: 15;
}
.block.recommend .wrapper .box-wrap .box .inner.three .step-list::before {
  display: block;
  background-image: url(../../images/step-illust-003.png);
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 100%;
  height: 170px;
  position: absolute;
  top: 50%;
  right: -190px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 45;
}
.block.recommend .wrapper .box-wrap .box .inner::after {
  display: block;
  background-image: url(../../images/recommend-title-bottom.png);
  background-size: 100%;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 100%;
  height: 55px;
  position: absolute;
  left: 0px;
  bottom: -35px;
  z-index: 15;
}
.block.recommend .wrapper .button {
  position: relative;
}
.block.recommend .wrapper .button.stay-list {
  display: inline-block;
  background-color: #a01f24;
  border-radius: 100vh;
}
.block.recommend .wrapper .button.stay-list i {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.block.recommend .wrapper .button.stay-list a {
  display: block;
  color: #FFF;
  padding: 10px 85px;
  text-decoration: none;
}
.block.recommend::before {
  display: block;
  background-image: url(../../images/recomment-back-top.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top;
  width: 100%;
  height: 650px;
  position: absolute;
  left: 0px;
  top: -130px;
  z-index: 45;
}
.block.recommend::after {
  display: block;
  background-image: url(../../images/step-illust-bottom-001.png);
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 21%;
  height: 115px;
  position: absolute;
  left: 15%;
  bottom: -85px;
  z-index: 25;
}
.block.step {
  position: relative;
  background-color: #e6f4fe;
}
.block.step .wrapper {
  position: relative;
  text-align: center;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 35px;
  padding-bottom: 185px;
  z-index: 50;
}
.block.step .wrapper .headline .title {
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin-bottom: 55px;
  font-size: 1.4rem;
}
.block.step .wrapper .headline .type {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 255, 76, 0.7);
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
  margin-bottom: 65px;
  font-size: 1.4rem;
  font-weight: bold;
}
.block.step .wrapper .step-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  margin-bottom: 55px;
}
.block.step .wrapper .step-wrap .box {
  position: relative;
  flex-basis: calc(50% - 0px);
  padding: 10px;
  box-sizing: border-box;
  margin-bottom: 20px;
}
.block.step .wrapper .step-wrap .box .inner {
  position: relative;
  text-align: left;
  line-height: 2em;
  /*background-image: url(../../images/step-title-middle-001.png);
  background-position: center;
  background-repeat: repeat-y;*/
  padding: 55px 40% 55px 5%;
  background-size: 100%;
  z-index: 10;
}
.block.step .wrapper .step-wrap .box .inner.one::before {
  display: block;
  background-image: url(../../images/step-title-top-001.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 35px;
  position: absolute;
  left: 0px;
  top: -25px;
}
.block.step .wrapper .step-wrap .box .inner.one .step-list {
  position: relative;
  z-index: 30;
}
.block.step .wrapper .step-wrap .box .inner.one .step-list span {
  color: #216ab7;
  font-weight: bold;
}
.block.step .wrapper .step-wrap .box .inner.one .step-list::before {
  display: block;
  background-image: url(../../images/step-illust-004.png);
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 185px;
  position: absolute;
  top: 50%;
  right: -190px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 45;
}
.block.step .wrapper .step-wrap .box .inner.two::before {
  display: block;
  background-image: url(../../images/step-title-top-002.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 35px;
  position: absolute;
  left: 0px;
  top: -25px;
}
.block.step .wrapper .step-wrap .box .inner.two .step-list {
  position: relative;
  z-index: 30;
}
.block.step .wrapper .step-wrap .box .inner.two .step-list span {
  color: #216ab7;
  font-weight: bold;
}
.block.step .wrapper .step-wrap .box .inner.two .step-list::before {
  display: block;
  background-image: url(../../images/step-illust-005.png);
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  width: 100%;
  height: 185px;
  position: absolute;
  top: 50%;
  right: -190px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 45;
}
.block.step .wrapper .step-wrap .box .inner::after {
  display: block;
  background-image: url(../../images/step-title-bottom-001.png);
  background-size: 100%;
  background-position: bottom;
  background-repeat: no-repeat;
  width: 100%;
  height: 35px;
  position: absolute;
  left: 0px;
  bottom: -25px;
}
.block.step .wrapper .step-wrap .box .inner .step-list span {
  color: #216ab7;
  font-weight: bold;
}
.block.step .wrapper .step-wrap::after {
  display: block;
  background-image: url(../../images/step-arrow.png);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 15px;
  height: 25px;
  position: absolute;
  top: 47%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 10;
}
.block.step .wrapper .button {
  position: relative;
}
.block.step .wrapper .button.stay-list {
  display: inline-block;
  background-color: #a01f24;
  border-radius: 100vh;
}
.block.step .wrapper .button.stay-list i {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.block.step .wrapper .button.stay-list a {
  display: block;
  color: #FFF;
  padding: 10px 85px;
  text-decoration: none;
}
.block.step::before {
  display: block;
  background-image: url(../../images/step-back-illust-001.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top;
  width: 100%;
  height: 850px;
  position: absolute;
  left: 0px;
  top: -80px;
  z-index: 0;
}
.block.step::after {
  display: block;
  background-image: url(../../images/step-back-bottom.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top;
  width: 100%;
  height: 200px;
  position: absolute;
  right: 0px;
  left: 0px;
  bottom: 0px;
  z-index: 0;
}
.block.about {
  position: relative;
  padding-bottom: 10px;
}
.block.about .wrapper {
  position: relative;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  z-index: 50;
}
.block.about .wrapper .headline {
  text-align: center;
}
.block.about .wrapper .headline .type {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 255, 76, 0.7);
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
  margin-bottom: 35px;
  font-size: 1.6rem;
  font-weight: bold;
}
.block.about .wrapper .headline .text {
  margin-bottom: 55px;
  width: 45%;
  margin-left: auto;
  margin-right: auto;
  line-height: 2em;
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .block.about .wrapper .headline .text {
    width: 90%;
  }
}
.block.about .wrapper .box-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 3%;
  width: 90%;
  margin: 0 auto;
  /*display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;*/
  margin-bottom: 55px;
}
@media screen and (max-width: 767px) {
  .block.about .wrapper .box-wrap {
    grid-template-columns: 1fr;
  }
}
.block.about .wrapper .box-wrap .box {
  box-sizing: border-box;
}
.block.about .wrapper .box-wrap .box:nth-of-type(even) {
  margin-top: 2rem;
}
.block.about .wrapper .box-wrap .box .inner {
  overflow: hidden;
  text-align: center;
}
.block.about .wrapper .box-wrap .box .inner figure img {
  aspect-ratio: 0.8;
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .block.about .wrapper .box-wrap .box .inner figure img {
    aspect-ratio: 1.4;
  }
}
.block.about .wrapper .box-wrap .box .inner .title {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  margin-top: 10px;
  /* 蛍光ペン風 */
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 1.2em;
  font-size: 1.4rem;
  /*
  text-decoration: underline;
  text-decoration-thickness: 0.5em; 
  text-decoration-color: rgba(255, 255, 76, 0.7); 
  text-underline-offset: -0.2em; 
  text-decoration-skip-ink: none; 
  */
}
.block.about .wrapper .box-wrap .box .inner .text {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  font-size: 1rem;
  height: auto;
  line-height: 1.6;
}
.block.stay-list {
  position: relative;
  z-index: 2;
  /*
  &::before,&::after{
    content: '';
    display: block;
    position: absolute;
    z-index: -1;
    width: 30%;
    aspect-ratio: 453 / 211;
    @include mq(){
      width: 38%;
    }
  }*/
}
.block.stay-list::before {
  content: "";
  display: block;
  background-image: linear-gradient(-20deg, #e9defa 0%, #fbfcdb 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: -1;
}
.block.stay-list .stay-list-areatitle {
  font-size: 2em;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.block.stay-list .wrapper {
  position: relative;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  z-index: 50;
  width: 90%;
}
.block.stay-list .wrapper .box-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 1rem;
}
@media screen and (max-width: 767px) {
  .block.stay-list .wrapper .box-wrap {
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
  }
}
.block.stay-list .wrapper .box-wrap .box {
  box-sizing: border-box;
}
.block.stay-list .wrapper .box-wrap .box.cvShirarahama .logo img {
  width: 50%;
}
.block.stay-list .wrapper .box-wrap .box.cvShirahama .logo img {
  width: 50%;
}
.block.stay-list .wrapper .box-wrap .box.ce1 .logo img {
  width: 60%;
}
.block.stay-list .wrapper .box-wrap .box.ce2 .logo img {
  width: 60%;
}
.block.stay-list .wrapper .box-wrap .box.bessou .logo img {
  width: 60%;
}
.block.stay-list .wrapper .box-wrap .box.akariya .logo img {
  width: 45%;
}
.block.stay-list .wrapper .box-wrap .box .box-info {
  padding: 0.8rem 0.8rem 1.2rem;
}
.block.stay-list .wrapper .box-wrap .box .thumb img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 1.1;
}
.block.stay-list .wrapper .box-wrap .box .inner {
  background-color: #FFF;
  height: 100%;
  border-radius: 10px;
  box-shadow: 0 0 34px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  text-align: center;
}
.block.stay-list .wrapper .box-wrap .box .inner .title {
  font-size: 1.1rem;
  font-weight: normal !important;
  margin: 0.5em 0 1em;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .block.stay-list .wrapper .box-wrap .box .inner .title {
    font-size: 0.9rem;
  }
}
.block.stay-list .wrapper .box-wrap .box .inner .text {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  overflow: hidden;
  font-size: 0.9rem;
  margin-bottom: 2em;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .block.stay-list .wrapper .box-wrap .box .inner .text {
    font-size: 0.8rem;
    width: 100%;
  }
}
.block.stay-list .wrapper .box-wrap .box .inner .campaign {
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  padding: 10px;
  background-color: #faeff3;
  color: #e46393;
  font-weight: bold;
  font-size: 0.9rem;
}
.block.stay-list .wrapper .box-wrap .box .inner .campaign-sub {
  margin-top: 0.5em;
  display: inline-block;
  font-size: 0.8em;
  padding: 0.3em 0.5em;
  background: #fff;
}
.block.stay-list .wrapper .box-wrap .box .inner .button {
  position: relative;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  .block.stay-list .wrapper .box-wrap .box .inner .button {
    width: 96%;
  }
}
.block.stay-list .wrapper .box-wrap .box .inner .button.reserve {
  background-color: #3774af;
  border-radius: 100vh;
  font-size: 0.9rem;
}
@media screen and (max-width: 767px) {
  .block.stay-list .wrapper .box-wrap .box .inner .button.reserve {
    font-size: 0.7rem;
  }
}
.block.stay-list .wrapper .box-wrap .box .inner .button.reserve i {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.block.stay-list .wrapper .box-wrap .box .inner .button.reserve a {
  display: block;
  color: #FFF;
  padding: 5px 0;
  text-decoration: none;
}
.block.stay-list .wrapper .attention {
  margin-top: 5rem;
}
.block.stay-list .wrapper .attention ul {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.block.stay-list .wrapper .attention ul li {
  list-style-type: none;
  line-height: 1.5em;
  font-size: 0.9rem;
  text-align: left;
  white-space: wrap;
}

.block.stay-list .wrapper .box-wrap .box .inner {
  position: relative;
}

.pet {
  position: absolute;
  left: 0.5em;
  top: 0.7em;
  background: #2f3c75;
  line-height: 1;
  font-size: 12px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #fff;
  border-radius: 10rem;
  padding: 0.5em 0.8em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .pet {
    font-size: 10px;
  }
}
.pet img {
  width: 1.2em;
  margin-right: 0.4em;
}

.icon-onsen {
  position: absolute;
  display: inline-block;
  right: 0.5rem;
  top: 0.5rem;
  width: 3rem;
  height: 3rem;
  border-radius: 10rem;
  background-color: #ffff89;
  background-image: url(../../images/onsen.svg);
  background-position: center center;
  background-size: 70%;
  background-repeat: no-repeat;
}

.wrapper {
  padding: 5rem 0;
}
@media screen and (max-width: 767px) {
  .wrapper {
    padding: 1rem 0;
  }
}

h2.title {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 2.4rem;
}
@media screen and (max-width: 767px) {
  h2.title {
    font-size: 1.6rem;
    margin: 0.5em 0;
  }
}
h2.title b {
  color: #a01f24;
  font-weight: normal;
}

.area-bnr {
  font-size: 1.2rem;
  padding: 2em 0;
  background: #fff;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}
.area-bnr .title {
  text-align: center;
  font-size: 1.2em;
  margin-bottom: 0.7em;
  font-weight: normal;
}
.area-bnr .bnr-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.area-bnr .bnr-list .bnr a {
  text-decoration: none;
  color: #333;
  padding: 0 1em;
  display: inline-block;
  font-size: 0.9em;
}
.area-bnr .bnr-list .bnr:not(:last-of-type) a {
  border-right: 1px solid rgba(0, 0, 0, 0.2);
}

.scTxt {
  width: 100%;
  overflow: hidden;
}
.scTxt p {
  white-space: nowrap;
  font-size: 10vw;
  letter-spacing: 0.15em;
  color: #2e12ae;
  line-height: 1;
  mix-blend-mode: overlay;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-style: normal;
  animation: flowing 60s linear infinite;
}
@media screen and (max-width: 767px) {
  .scTxt p {
    font-size: 15vw;
  }
}
.scTxt p:nth-of-type(2) {
  animation-direction: reverse;
}
.scTxt p span {
  font-size: 0.7em;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
#sakura-canvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  /* クリック操作を邪魔しない */
  z-index: 1;
  /* 必要に応じて調整 */
}

/* 動きを減らす設定の人には停止 */
@media (prefers-reduced-motion: reduce) {
  #sakura-canvas {
    display: none;
  }
}
/* 春っぽい、淡いピンク系の“邪魔しない”背景 */
/* うっすら質感（任意：邪魔なら消してOK） */
body::before {
  position: fixed;
  /* 画面に対して固定で、スクロールしても破綻しにくい */
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}

body::before {
  opacity: 0.4;
}

body::before {
  background-image: radial-gradient(#fbc0d7 2px, transparent 2px), radial-gradient(#fbc0d7 2px, #ffffff 2px);
  background-size: 40px 40px;
  background-position: 0 0, 20px 20px;
}

@media screen and (max-width: 767px) {
  .intro {
    margin-bottom: 5rem;
  }
}
.intro .wrapper {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  width: 96%;
}
.intro-block-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
@media screen and (max-width: 767px) {
  .intro-block-container {
    grid-template-columns: 1fr;
  }
}
.intro-block--text {
  margin-top: 1rem;
}
.intro-block--text--head {
  font-size: 1.4rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 0.7em;
}
@media screen and (max-width: 767px) {
  .intro-block--text--head {
    font-size: 1.2rem;
  }
}
.intro-block--text--lead {
  font-size: 1rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  text-align: justify;
}

.cal .wrapper {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  width: 96%;
}
.cal .wrapper .cal-title {
  text-align: center;
  font-size: 1.6rem;
  color: #df8c5c;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .cal .wrapper .cal-title {
    font-size: 1.3rem;
  }
}
.cal .wrapper .caption {
  font-size: 0.8rem;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}

/* Floating calendar button */
.rl-cal-fab {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 9999;
  border: 0;
  border-radius: 9999px;
  background: #bc581f;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  place-items: center;
  display: flex;
  gap: 5px;
  padding: 10px 15px;
}
@media screen and (max-width: 767px) {
  .rl-cal-fab {
    aspect-ratio: 1;
  }
}

.rl-cal-fab img {
  width: 1.6rem;
  object-fit: contain;
  display: block;
}
@media screen and (max-width: 767px) {
  .rl-cal-fab img {
    width: 1.6rem;
  }
}

.rl-cal-fab span {
  font-size: 12px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .rl-cal-fab span {
    font-size: 10px;
    display: none;
  }
}

.rl-cal-fab:hover {
  transform: translateY(-1px);
}

.rl-cal-fab:active {
  transform: translateY(0);
}

.rl-cal-fab:focus-visible {
  outline: 3px solid rgba(0, 0, 0, 0.35);
  outline-offset: 3px;
}

/* Modal base */
.rl-cal-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
}

.rl-cal-modal.is-open {
  display: block;
}

.rl-cal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}

.rl-cal-dialog {
  position: relative;
  width: min(92vw, 960px);
  max-height: 88vh;
  margin: 6vh auto 0;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  overflow: auto;
  padding: 14px;
}

.rl-cal-close {
  position: sticky;
  top: 10px;
  margin-left: auto;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.06);
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
}

.rl-cal-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}

/* prevent body scroll when open */
body.rl-modal-open {
  overflow: hidden;
}

/* デフォルト：PC表示 */
.rl-cal-img-sp {
  display: none;
}

.rl-cal-img-pc img,
.rl-cal-img-sp img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}

/* 768px以下はSP画像表示 */
@media (max-width: 768px) {
  .rl-cal-img-pc {
    display: none;
  }

  .rl-cal-img-sp {
    display: block;
  }
}
.rl-cal-image-wrap .caption {
  font-size: 12px;
}

/*# sourceMappingURL=style-lp.css.map */