@charset "UTF-8";
/*----------   Media Queries(max750px)   ----------*/
/*----------   lineHeight   ----------*/
/*---------   calc   ----------*/
/*----------   calc width maxwidth   ----------*/
/*----------   Futura   ----------*/
/*----------   Yu Gothic   ----------*/
@import url("https://use.typekit.net/tmm6uol.css");
.main-area .main-inner {
  margin: auto !important;
  width: 140rem;
}

@media (max-width: 750px) {
  .main-area .main-inner {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.allinoneInner img:hover {
  opacity: .6;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.on img:hover {
  opacity: .6;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.on > a,
.on::before,
.on::after {
  -webkit-animation: animation 1s ease-out forwards;
          animation: animation 1s ease-out forwards;
}

@-webkit-keyframes animation {
  0% {
    -webkit-transform: translateY(12rem);
            transform: translateY(12rem);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-transition: all 1s;
    transition: all 1s;
    opacity: 1;
  }
}

@keyframes animation {
  0% {
    -webkit-transform: translateY(12rem);
            transform: translateY(12rem);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-transition: all 1s;
    transition: all 1s;
    opacity: 1;
  }
}

.action02 > a,
.action02::before,
.action02::after {
  opacity: 0;
}

.action > a,
.action::before,
.action::after {
  opacity: 0;
}

.bottun {
  margin: 4.6rem auto 9.5rem;
}

@media (max-width: 750px) {
  .bottun {
    margin: calc(235 * (100vw/750)) auto calc(140 * (100vw/750));
  }
}

.bottun a {
  margin: 0 auto;
}

.sec__wrap01,
.sec__wrap03 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .sec__wrap01,
  .sec__wrap03 {
    display: block;
    margin: auto;
  }
}

.txtBox__txt {
  font-size: 1.4rem;
  line-height: 2.14286;
  letter-spacing: 0.12em;
  text-align: center;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .txtBox__txt {
    font-size: calc(22 * (100vw/750));
    line-height: 2;
    letter-spacing: 0.09em;
  }
}

.txtBox__ttl {
  font-family: futura-pt, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 2.4rem;
  line-height: 1;
  letter-spacing: 0.015em;
  border-bottom: solid 1px #000;
  text-align: center;
  margin: 0 auto 2.1rem;
  width: 22.8rem;
  padding-bottom: .7rem;
}

@media (max-width: 750px) {
  .txtBox__ttl {
    font-size: calc(32 * (100vw/750));
    line-height: 0.9;
    margin-top: calc(10 * (100vw/750));
    margin-bottom: calc(30 * (100vw/750));
    width: calc(310 * (100vw/750));
    max-width: 310px;
  }
}

.credit li {
  cursor: pointer;
}

.credit {
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.08em;
  margin-top: 1.2rem;
}

@media (max-width: 750px) {
  .credit {
    font-size: calc(17 * (100vw/750));
    line-height: 1.6;
    letter-spacing: 0.008em;
    margin-top: calc(16 * (100vw/750));
  }
}

.sec__ttl::after {
  position: absolute;
  content: "";
  border-bottom: solid 1.9px #000;
  width: 100vw;
}

@media (max-width: 750px) {
  .sec__ttl::after {
    border-bottom: solid 1px #000;
  }
}

.sec__ttl {
  font-family: futura-pt, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 6rem;
  line-height: 1;
  letter-spacing: 0.015em;
  margin-top: 14rem;
  margin-bottom: 7rem;
}

@media (max-width: 750px) {
  .sec__ttl {
    font-size: calc(72 * (100vw/750));
    margin-bottom: 0;
  }
}

.top__mv {
  width: 100rem;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .top__mv {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.top__lead {
  font-size: 1.4rem;
  line-height: 2.48;
  letter-spacing: 0.17em;
  text-align: center;
  margin: 5.1rem auto 0;
}

@media (max-width: 750px) {
  .top__lead {
    font-size: calc(22 * (100vw/750));
    line-height: 2;
    margin-top: calc(58 * (100vw/750));
  }
}

.sec01 .wrapic01,
.sec03 .wrapic02 {
  width: 40rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec01 .wrapic01,
  .sec03 .wrapic02 {
    width: calc(600 * (100vw/750));
    max-width: 600px;
  }
}

.sec01 .wrapic02,
.sec03 .wrapic01 {
  width: 40rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec01 .wrapic02,
  .sec03 .wrapic01 {
    width: calc(480 * (100vw/750));
    max-width: 480px;
  }
}

.sec01 .wrapic03,
.sec02 .wrapic02,
.sec03 .wrapic04 {
  width: 30rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec01 .wrapic03,
  .sec02 .wrapic02,
  .sec03 .wrapic04 {
    width: calc(400 * (100vw/750));
    max-width: 400px;
  }
}

.sec01 .wrapic04,
.sec02 .wrapic01,
.sec02 .wrapic04,
.sec03 .wrapic05 {
  width: 48rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec01 .wrapic04,
  .sec02 .wrapic01,
  .sec02 .wrapic04,
  .sec03 .wrapic05 {
    width: calc(600 * (100vw/750));
    max-width: 600px;
  }
}

.sec01 .wrapic05,
.sec02 .wrapic03,
.sec03 .wrapic06 {
  width: 36rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec01 .wrapic05,
  .sec02 .wrapic03,
  .sec03 .wrapic06 {
    width: calc(480 * (100vw/750));
    max-width: 480px;
  }
}

.sec03 .wrapic03 {
  width: 33rem;
  height: auto;
}

@media (max-width: 750px) {
  .sec03 .wrapic03 {
    width: calc(470 * (100vw/750));
    max-width: 470px;
  }
}

.sec {
  position: relative;
}

.bottun {
  width: 46rem;
  height: auto;
}

@media (max-width: 750px) {
  .bottun {
    width: calc(460 * (100vw/750));
    max-width: 460px;
  }
}

/*----------   IE   ----------*/
/*----------   Firefox   ----------*/
/*----------   Gloogle Chrome   ----------*/
/*----------   Safari   ----------*/
/*----------   Media Queries(max750px)   ----------*/
/*----------   lineHeight   ----------*/
/*---------   calc   ----------*/
/*----------   calc width maxwidth   ----------*/
/*----------   Futura   ----------*/
/*----------   Yu Gothic   ----------*/
.imgPos, .bg::before, .bg::after, .sec01__wrap01 .wrapic-1::before, .sec01__wrap01 .wrapic-2::before, .sec01__wrap02__wrapic::before, .sec01__wrap03 .wrapic-1::before, .sec01__wrap03 .wrapic-2::before, .sec02__wrap01__wrapic::before, .sec02__wrap01__wrapic::after, .sec02__wrap02__wrapic::before, .sec02__wrap03 .wrapic-1::before, .sec02__wrap03 .wrapic-2::after, .sec03__wrap01 .wrapic-2::before, .sec03__wrap01 .wrapic-1::before, .sec03__wrap02 .wrapic-1::before, .sec03__wrap02 .wrapic-1::after, .sec03__wrap02 .wrapic-2::before, .sec03__wrap03 .wrapic-1::before, .sec03__wrap03 .wrapic-2::before {
  position: absolute;
  content: "";
  background-repeat: no-repeat;
  z-index: -1;
}

.bg::before {
  border-left: solid 2px #808080;
  width: 0.2rem;
  height: 2.2rem;
  top: -2rem;
  right: 53.2rem;
}

@media (max-width: 750px) {
  .bg::before {
    border-left: solid 1px #808080;
    width: calc(1 * (100vw/750));
    max-width: 1px;
    height: calc(33 * (100vw/750));
    top: calc(-32 * (100vw/750));
    right: calc(449 * (100vw/750));
  }
}

.bg::after {
  border-left: solid 2px #808080;
  width: 0.2rem;
  height: 2.2rem;
  top: 24rem;
  right: 53.2rem;
}

@media (max-width: 750px) {
  .bg::after {
    border-left: solid 1px #808080;
    width: calc(1 * (100vw/750));
    max-width: 1px;
    height: calc(33 * (100vw/750));
    top: calc(337 * (100vw/750));
    right: calc(449 * (100vw/750));
  }
}

.sec01__wrap01,
.sec03__wrap01 {
  width: 81rem;
}

@media (max-width: 750px) {
  .sec01__wrap01,
  .sec03__wrap01 {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.sec01__wrap03,
.sec03__wrap03 {
  width: 90rem;
}

@media (max-width: 750px) {
  .sec01__wrap03,
  .sec03__wrap03 {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.sec01 .sec__ttl {
  margin-left: 19rem;
}

@media (max-width: 750px) {
  .sec01 .sec__ttl {
    margin: calc(142 * (100vw/750)) 0 0 calc(51 * (100vw/750));
  }
}

.sec01 .sec__ttl::after {
  top: 4.9rem;
  left: 19.5rem;
}

@media (max-width: 750px) {
  .sec01 .sec__ttl::after {
    top: calc(60 * (100vw/750));
    left: calc(56 * (100vw/750));
  }
}

.sec01__wrap01 {
  margin-bottom: 7.6rem;
}

@media (max-width: 750px) {
  .sec01__wrap01 {
    margin-top: calc(67 * (100vw/750));
    margin-bottom: calc(92 * (100vw/750));
  }
}

.sec01__wrap01 .wrapic-1 {
  position: relative;
}

@media (max-width: 750px) {
  .sec01__wrap01 .wrapic-1 .wrapic01 {
    margin-left: auto;
    margin-right: 0;
  }
}

.sec01__wrap01 .wrapic-1::before {
  background-image: url(../img/sec01_wrapic01.svg);
  width: 4rem;
  height: 21rem;
  top: -.2rem;
  right: 40.1rem;
}

@media (max-width: 750px) {
  .sec01__wrap01 .wrapic-1::before {
    width: calc(47 * (100vw/750));
    max-width: 47px;
    height: calc(282 * (100vw/750));
    top: 0;
    right: calc(608 * (100vw/750));
  }
}

.sec01__wrap01 .wrapic-2 {
  position: relative;
}

@media (max-width: 750px) {
  .sec01__wrap01 .wrapic-2 {
    margin: calc(80 * (100vw/750)) 0 0 calc(51 * (100vw/750));
  }
}

.sec01__wrap01 .wrapic-2::before {
  background-image: url(../img/sec01_wrapic02.svg);
  width: 2.6rem;
  height: 8.5rem;
  top: 45.5rem;
  left: 41.4rem;
}

@media (max-width: 750px) {
  .sec01__wrap01 .wrapic-2::before {
    width: calc(42 * (100vw/750));
    max-width: 42px;
    height: calc(115 * (100vw/750));
    top: calc(6 * (100vw/750));
    left: calc(500 * (100vw/750));
  }
}

.sec01__wrap02 {
  margin-bottom: 20.5rem;
}

@media (max-width: 750px) {
  .sec01__wrap02 {
    margin-bottom: calc(285 * (100vw/750));
  }
}

.sec01__wrap02__wrapic {
  position: relative;
}

.sec01__wrap02__wrapic::before {
  border: solid 2px #9b95b3;
  width: 42.8rem;
  height: 31.8rem;
  top: 4.4rem;
  right: 38.4rem;
}

@media (max-width: 750px) {
  .sec01__wrap02__wrapic::before {
    border: solid 1px #9b95b3;
    width: calc(502 * (100vw/750));
    max-width: 502px;
    height: calc(445 * (100vw/750));
    top: calc(49 * (100vw/750));
    right: calc(124 * (100vw/750));
  }
}

.sec01 .wrapic03 {
  margin: 7.4rem auto 4.3rem;
}

@media (max-width: 750px) {
  .sec01 .wrapic03 {
    margin: calc(88 * (100vw/750)) auto calc(49 * (100vw/750));
  }
}

@media (max-width: 750px) {
  .sec01__wrap03 .wrapic04 {
    margin-left: calc(78 * (100vw/750));
  }
}

.sec01__wrap03 .wrapic-1 {
  position: relative;
}

@media (max-width: 750px) {
  .sec01__wrap03 .wrapic-1 .wrapic01 {
    margin-left: auto;
    margin-right: 0;
  }
}

.sec01__wrap03 .wrapic-1::before {
  background-image: url(../img/sec01_wrapic03.svg);
  width: 8.9rem;
  height: 2.7rem;
  top: -3.9rem;
  right: 0.2rem;
}

@media (max-width: 750px) {
  .sec01__wrap03 .wrapic-1::before {
    width: calc(119 * (100vw/750));
    max-width: 119px;
    height: calc(38 * (100vw/750));
    top: calc(-51 * (100vw/750));
    left: calc(553 * (100vw/750));
  }
}

.sec01__wrap03 .wrapic-2 {
  margin-top: 26.6rem;
  position: relative;
}

@media (max-width: 750px) {
  .sec01__wrap03 .wrapic-2 {
    margin-top: calc(80 * (100vw/750));
    margin-left: calc(272 * (100vw/750));
  }
}

.sec01__wrap03 .wrapic-2::before {
  background-image: url(../img/sec01_wrapic04.svg);
  width: 2.7rem;
  height: 8.9rem;
  top: 40.6rem;
  left: -4.1rem;
}

@media (max-width: 750px) {
  .sec01__wrap03 .wrapic-2::before {
    width: calc(40 * (100vw/750));
    max-width: 40px;
    height: calc(111 * (100vw/750));
    top: calc(2 * (100vw/750));
    left: calc(-56 * (100vw/750));
  }
}

.sec01__wrap03__txt {
  margin-top: 7.2rem;
}

@media (max-width: 750px) {
  .sec01__wrap03__txt {
    margin-top: calc(78 * (100vw/750));
  }
}

.sec02__ttl {
  margin-left: 65rem;
}

@media (max-width: 750px) {
  .sec02__ttl {
    margin-top: calc(224 * (100vw/750));
    margin-left: calc(270 * (100vw/750));
  }
}

.sec02 .sec__ttl::after {
  top: 4.9rem;
  right: 19.5rem;
}

@media (max-width: 750px) {
  .sec02 .sec__ttl::after {
    top: calc(60 * (100vw/750));
    right: calc(53 * (100vw/750));
  }
}

.sec02__wrap01 {
  display: block;
}

.sec02__wrap01__wrap01::before, .sec02__wrap01__wrap01::after {
  position: relative;
}

.sec02__wrap01__wrapic::before {
  background-image: url(../img/sec02_wrapic01.svg);
  width: 3.6rem;
  height: 8.4rem;
  top: 13.4rem;
  right: 84.6rem;
}

@media (max-width: 750px) {
  .sec02__wrap01__wrapic::before {
    background-image: url(../img/sec02_wrapic01-sp.svg);
    width: calc(42 * (100vw/750));
    max-width: 42px;
    height: calc(113 * (100vw/750));
    top: calc(142 * (100vw/750));
    left: calc(615 * (100vw/750));
  }
}

.sec02__wrap01__wrapic::after {
  background-image: url(../img/sec02_wrapic02.svg);
  width: calc(27 * (100vw/750));
  max-width: 27px;
  height: 8.7rem;
  top: 69.6rem;
  left: 85.4rem;
}

@media (max-width: 750px) {
  .sec02__wrap01__wrapic::after {
    width: calc(35 * (100vw/750));
    max-width: 35px;
    height: calc(114 * (100vw/750));
    top: calc(839 * (100vw/750));
    left: calc(620 * (100vw/750));
  }
}

.sec02__wrap01__wrapic {
  margin: 0 auto 7rem;
  width: 48rem;
}

@media (max-width: 750px) {
  .sec02__wrap01__wrapic {
    margin-top: calc(70 * (100vw/750));
    margin-bottom: calc(82.5 * (100vw/750));
  }
}

@media (max-width: 750px) {
  .sec02__wrap01__wrapic .credit {
    margin-left: calc(52 * (100vw/750));
  }
}

.sec02__wrap02 {
  margin: 7.2rem auto 16rem;
  position: relative;
  width: 30rem;
}

@media (max-width: 750px) {
  .sec02__wrap02 {
    margin-top: calc(86 * (100vw/750));
    margin-bottom: 0;
  }
}

.sec02__wrap02 .wrapic02 {
  margin-bottom: 4.2rem;
}

@media (max-width: 750px) {
  .sec02__wrap02 .wrapic02 {
    margin: 0 auto;
    margin-bottom: calc(50 * (100vw/750));
  }
}

.sec02__wrap02__wrapic::before {
  border: solid 2px #afabbe;
  width: 42.8rem;
  height: 31.8rem;
  top: 4.3rem;
  right: -6.6rem;
}

@media (max-width: 750px) {
  .sec02__wrap02__wrapic::before {
    border: solid 1px #afabbe;
    width: calc(502 * (100vw/750));
    max-width: 502px;
    height: calc(445 * (100vw/750));
    top: calc(49 * (100vw/750));
    right: calc(49 * (100vw/750));
  }
}

.sec02__wrap03 {
  width: 90rem;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

@media (max-width: 750px) {
  .sec02__wrap03 {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.sec02__wrap03 .wrapic-1 {
  margin-top: 18.6rem;
  margin-bottom: 7rem;
  position: relative;
}

@media (max-width: 750px) {
  .sec02__wrap03 .wrapic-1 {
    margin: calc(285 * (100vw/750)) 0 calc(77 * (100vw/750)) calc(75 * (100vw/750));
  }
}

.sec02__wrap03 .wrapic-1::before {
  background-image: url(../img/sec02_wrapic04.svg);
  width: 8.8rem;
  height: 9rem;
  top: -4.2rem;
  right: 38.7rem;
}

@media (max-width: 750px) {
  .sec02__wrap03 .wrapic-1::before {
    width: calc(119 * (100vw/750));
    max-width: 119px;
    height: calc(38 * (100vw/750));
    top: calc(-54 * (100vw/750));
    left: calc(7 * (100vw/750));
  }
}

.sec02__wrap03 .wrapic-2 {
  position: relative;
}

@media (max-width: 750px) {
  .sec02__wrap03 .wrapic-2 {
    margin-bottom: calc(80 * (100vw/750));
  }
}

.sec02__wrap03 .wrapic-2::after {
  background-image: url(../img/sec02_wrapic03.svg);
  width: 3.6rem;
  height: 7.8rem;
  top: 0.4rem;
  left: 36.6rem;
}

@media (max-width: 750px) {
  .sec02__wrap03 .wrapic-2::after {
    width: calc(43 * (100vw/750));
    max-width: 43px;
    height: calc(130 * (100vw/750));
    top: calc(3 * (100vw/750));
    left: calc(491 * (100vw/750));
  }
}

@media (max-width: 750px) {
  .sec02__wrap03 .credit {
    margin-left: calc(52 * (100vw/750));
  }
}

.sec03 .sec__ttl {
  margin: 16.1rem 0 0 19.1rem;
}

@media (max-width: 750px) {
  .sec03 .sec__ttl {
    margin: calc(229 * (100vw/750)) 0 0 calc(50 * (100vw/750));
  }
}

.sec03 .sec__ttl::after {
  top: 5rem;
  left: 19.5rem;
}

@media (max-width: 750px) {
  .sec03 .sec__ttl::after {
    top: calc(60 * (100vw/750));
    left: calc(56 * (100vw/750));
  }
}

.sec03__wrap01 {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  margin-top: 7rem;
  height: 81.7rem;
}

@media (max-width: 750px) {
  .sec03__wrap01 {
    height: auto;
    margin-top: 0;
  }
}

.sec03__wrap01 .wrapic-2 {
  position: relative;
}

@media (max-width: 750px) {
  .sec03__wrap01 .wrapic-2 {
    margin-top: calc(78.8 * (100vw/750));
    margin-left: calc(52 * (100vw/750));
    margin-bottom: calc(80 * (100vw/750));
  }
}

.sec03__wrap01 .wrapic-1 {
  position: relative;
}

@media (max-width: 750px) {
  .sec03__wrap01 .wrapic-1 {
    margin-top: calc(67.8 * (100vw/750));
    margin-left: calc(154 * (100vw/750));
  }
}

.sec03__wrap01 .wrapic-2::before {
  background-image: url(../img/sec03_wrapic01.svg);
  width: 3.4rem;
  height: 7.3rem;
  top: 0.2rem;
  right: 40.7rem;
}

@media (max-width: 750px) {
  .sec03__wrap01 .wrapic-2::before {
    background-image: url(../img/sec03_wrapic02.svg);
    width: calc(42 * (100vw/750));
    max-width: 42px;
    height: calc(115 * (100vw/750));
    top: calc(7 * (100vw/750));
    left: calc(498 * (100vw/750));
  }
}

.sec03__wrap01 .wrapic-1::before {
  background-image: url(../img/sec03_wrapic02.svg);
  width: 3.4rem;
  height: 8.5rem;
  top: 45.6rem;
  left: 41.5rem;
}

@media (max-width: 750px) {
  .sec03__wrap01 .wrapic-1::before {
    background-image: url(../img/sec03_wrapic01.svg);
    width: calc(38 * (100vw/750));
    max-width: 38px;
    height: calc(99 * (100vw/750));
    top: 0;
    left: calc(-59 * (100vw/750));
  }
}

.sec03__wrap02 .wrapic-1 {
  position: relative;
  margin: 2.1rem 0 0 63.7rem;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-1 {
    margin: calc(118 * (100vw/750)) 0 0 calc(259 * (100vw/750));
  }
}

.sec03__wrap02 .wrapic-1 .credit {
  margin-top: 3.7rem;
  margin-left: 2.7rem;
}

.sec03__wrap02 .wrapic-1 .credit li {
  font-size: 0.9rem;
  margin-top: 1.8rem;
  letter-spacing: 0.09em;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-1 .credit {
    font-size: calc(10 * (100vw/750));
    margin: calc(44 * (100vw/750)) 0 0 calc(41 * (100vw/750));
  }
}

.sec03__wrap02 .wrapic-1::before {
  border: solid 2px #808080;
  width: 27.8rem;
  height: 27.8rem;
  top: -2rem;
  right: 25.4rem;
  border-left-color: transparent;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-1::before {
    border: solid 1px #808080;
    width: calc(404 * (100vw/750));
    max-width: 404px;
    height: calc(402 * (100vw/750));
    top: calc(-32 * (100vw/750));
    right: calc(48 * (100vw/750));
    border-left-color: transparent;
  }
}

.sec03__wrap02 .wrapic-1::after {
  background-image: url(../img/sec03_wrapic03.svg);
  width: 2.5rem;
  height: 21.9rem;
  top: 1rem;
  right: 52.9rem;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-1::after {
    width: calc(47 * (100vw/750));
    max-width: 47px;
    height: calc(308 * (100vw/750));
    top: calc(12 * (100vw/750));
    right: calc(432 * (100vw/750));
  }
}

.sec03__wrap02 .wrapic-2 .wrapic04 {
  position: relative;
  margin: 7.9rem auto 5.2rem;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-2 .wrapic04 {
    margin-top: calc(92 * (100vw/750));
    margin-bottom: calc(50 * (100vw/750));
  }
}

.sec03__wrap02 .wrapic-2::before {
  border: solid 2px #808080;
  width: 42.8rem;
  height: 31.8rem;
  top: 137.8rem;
  right: 38.4rem;
}

@media (max-width: 750px) {
  .sec03__wrap02 .wrapic-2::before {
    border: solid 1px #808080;
    width: calc(502 * (100vw/750));
    max-width: 502px;
    height: calc(445 * (100vw/750));
    top: calc(2655.5 * (100vw/750));
    right: calc(124 * (100vw/750));
  }
}

.sec03__wrap03 {
  margin-top: 20.6rem;
  height: 96rem;
}

@media (max-width: 750px) {
  .sec03__wrap03 {
    margin-top: calc(290 * (100vw/750));
    height: auto;
  }
}

.sec03__wrap03 .wrapic-1 {
  position: relative;
}

@media (max-width: 750px) {
  .sec03__wrap03 .wrapic-1 {
    margin-left: calc(76 * (100vw/750));
    margin-bottom: calc(90 * (100vw/750));
  }
}

.sec03__wrap03 .wrapic-1::before {
  background-image: url(../img/sec03_wrapic04.svg);
  width: 8.8rem;
  height: 2.8rem;
  top: -3.9rem;
  right: 0.4rem;
}

@media (max-width: 750px) {
  .sec03__wrap03 .wrapic-1::before {
    width: calc(124 * (100vw/750));
    max-width: 124px;
    height: calc(33 * (100vw/750));
    top: calc(-53 * (100vw/750));
    right: calc(71 * (100vw/750));
  }
}

.sec03__wrap03 .wrapic-2 {
  position: relative;
  margin-top: 26.4rem;
}

@media (max-width: 750px) {
  .sec03__wrap03 .wrapic-2 {
    margin-top: calc(89 * (100vw/750));
    margin-left: calc(221 * (100vw/750));
  }
}

.sec03__wrap03 .wrapic-2::before {
  background-image: url(../img/sec03_wrapic05.svg);
  width: 3.4rem;
  height: 8rem;
  top: 40.6rem;
  left: -3.9rem;
}

@media (max-width: 750px) {
  .sec03__wrap03 .wrapic-2::before {
    width: calc(42 * (100vw/750));
    max-width: 42px;
    height: calc(115 * (100vw/750));
    top: calc(1 * (100vw/750));
    left: calc(-52 * (100vw/750));
  }
}

/*----------   Media Queries(max750px)   ----------*/
/*----------   lineHeight   ----------*/
/*---------   calc   ----------*/
/*----------   calc width maxwidth   ----------*/
/*----------   Futura   ----------*/
/*----------   Yu Gothic   ----------*/
/* ------   Media Queries(751px ~ 1399px)   ------- */
@media only screen and (min-width: 751px) and (max-width: 1399px) {
  .main-inner {
    margin: 0 !important;
  }
  html {
    font-size: calc(10*(100vw/1400));
  }
}

/*----------   setUp   ----------*/
* {
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.allinone {
  width: 140rem;
  height: auto;
  background-position: center -39.4px;
  background-repeat: no-repeat;
  z-index: -5;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .allinone {
    width: calc(750 * (100vw/750));
    max-width: 750px;
    background-position: center -109px;
    z-index: -10;
    margin: calc(22 * (100vw/750)) 0 0 -3.5%;
  }
}

.allinoneInner {
  width: 120rem;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .allinoneInner {
    width: calc(750 * (100vw/750));
    max-width: 750px;
  }
}

.allinoneInner img {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  width: 100%;
  height: auto;
}

@media (max-width: 750px) {
  .allinoneInner img {
    opacity: 1;
  }
}

@media (max-width: 750px) {
  .allinone {
    overflow-x: hidden;
  }
}

html {
  overflow-x: hidden;
}

* {
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  font-weight: 100;
}

.spOnry {
  display: none;
}

@media (max-width: 750px) {
  .spOnry {
    display: block;
  }
}

.pcOnry {
  display: block;
}

@media (max-width: 750px) {
  .pcOnry {
    display: none;
  }
}

.sec a {
  display: block;
}

/*------------------------------------------------------
              ブラウザーごとのcssレイアウト調整
------------------------------------------------------*/
/* Edge(Chromium) */
_:lang(x)::-ms-,
.main-area .main-inner {
  width: 146rem;
}

/*----------   IE   ----------*/
@media all and (-ms-high-contrast: none) {
  .sec02__wrap03 .wrapic-1::before {
    top: -6.96rem;
  }
}

/*----------   Firefox   ----------*/
@-moz-document url-prefix() {
  .top__lead {
    line-height: 2.4;
  }
  .sec03__wrap02 .wrapic-1 .credit li {
    margin-top: 4rem;
    letter-spacing: 0.18em;
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  _::-webkit-full-page-media,
  _:future,
  :root .sec03__wrap02 .credit a {
    letter-spacing: 0.18em;
  }
}

@media (max-width: 750px) {
  /* Edge(EdgeHTML) & & Chrome & Safari & Firefox */
  _:lang(x)::-webkit-,
  .sec02__wrap02__wrapic::before {
    right: calc(31 * (100vw/750));
  }
}

@media screen and (max-width: 750px) and (-webkit-min-device-pixel-ratio: 0) {
  ::-webkit-full-page-media,
  _:future,
  :root .sec02__wrap02 {
    margin: calc(86 * (100vw/750)) auto 0;
    width: calc(750 * (100vw/750));
  }
  ::-webkit-full-page-media,
  _:future,
  :root .sec02__wrap02__wrapic::before {
    right: calc(124 * (100vw/750));
  }
  _::-webkit-full-page-media,
  _:future,
  :root .credit {
    margin-top: calc(14*(100vw/750));
  }
  _::-webkit-full-page-media,
  _:future,
  :root .sec03__wrap02 .credit a {
    font-size: calc(17 * (100vw/750));
    letter-spacing: 0.018em;
  }
  _::-webkit-full-page-media,
  _:future,
  :root .sec03__wrap02 .credit li {
    margin-top: calc(54 * (100vw/750));
  }
}

@media (max-width: 750px) {
  @-moz-document url-prefix() {
    .allinone {
      margin: calc(-190 * (100vw/750)) 0 0 -0.4%;
    }
    .sec03 .sec__ttl::after,
    .sec02 .sec__ttl::after,
    .sec01 .sec__ttl::after {
      top: calc(60 * (100vw/750));
    }
    .txtBox__ttl {
      margin-bottom: calc(25 * (100vw/750));
    }
    .top__lead {
      line-height: 2;
    }
    .credit {
      line-height: 2;
      letter-spacing: 0.06em;
    }
    .sec01__wrap01 {
      margin-bottom: calc(98 * (100vw/750));
    }
    .sec01__wrap03__txt {
      margin-top: calc(74 * (100vw/750));
    }
    .sec01__wrap03__wrapic {
      padding-top: calc(2*(100vw/750));
      margin-bottom: calc(79*(100vw/750));
    }
    .sec02__wrap03 .wrapic-2 {
      margin-top: calc(81*(100vw/750));
    }
    .sec03 {
      margin-top: calc(234*(100vw/750));
    }
    .sec02__wrap03 .credit {
      margin-bottom: calc(83 * (100vw/750));
    }
    .sec03__wrap02 .wrapic-1 .credit li {
      margin-top: calc(50 * (100vw/750));
      letter-spacing: 0.018em;
    }
    .sec03__wrap02 .wrapic-2 .wrapic04 {
      margin-bottom: calc(48 * (100vw/750));
    }
  }
  /*----------   IE   ----------*/
}

@media all and (max-width: 750px) and (-ms-high-contrast: none) {
  .allinone {
    margin: calc(-122 * (100vw/750)) 0 0 0;
  }
  .sec03 .sec__ttl::after,
  .sec02 .sec__ttl::after,
  .sec01 .sec__ttl::after {
    top: calc(60 * (100vw/750));
  }
  .sec02__wrap02__wrapic::before {
    right: calc(25 * (100vw/750));
  }
  .sec02__wrap03 .wrapic-1::before {
    top: -5rem;
  }
  .bg::after {
    top: calc(340 * (100vw/750));
    right: calc(452 * (100vw/750));
  }
  .bg::before {
    top: calc(-32 * (100vw/750));
    right: calc(452 * (100vw/750));
  }
}

@media screen and (max-width: 750px) and (-webkit-min-device-pixel-ratio: 0) {
  .sec02__wrap02__wrapic::before {
    right: calc(49 * (100vw/750));
  }
}
/*# sourceMappingURL=style.css.map */