:root {
  --bc01: #5096e6;
  --bc02: #0c6c7d;
  --bc03: #a7caf2;
  --bc04: #dce6fb;
  --bc05: #5096e6;
  --bc06: #f0f7cb;
  --sl01: #f4f7fe;
  --sl02: var(--bc03);
  --sl03: var(--bc01);
}

@media only screen and (max-width: 750px) {
  .p-mv {
    background-image: url("../img/img-main_sp.jpg");
  }
}
@media print, screen and (min-width: 751px) {
  .p-mv {
    background: url("../img/img-main.jpg") no-repeat center center/cover;
  }
}
.p-mv::before {
  mix-blend-mode: unset;
  opacity: 0.8;
}

@media only screen and (max-width: 750px) {
  .p-solution .p-solution-body {
    background-image: url("../img/bg-solution_sp.png");
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-body {
    background-image: url("../img/bg-solution.png");
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button01 {
    left: 0;
    top: 0;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button01 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button01 .p-solution-button-head {
    padding-left: 0;
  }
}
.p-solution .p-solution-button01 .p-solution-button-num {
  background: #4161aa;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button02 {
    left: 0;
    top: 11.9270833333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button02 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button02 .p-solution-button-head {
    padding-left: 0;
  }
}
.p-solution .p-solution-button02 .p-solution-button-num {
  background: #6781bb;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button03 {
    left: 0;
    top: 23.8020833333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button03 .p-solution-button-head {
    padding-left: 6.6666666667vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button03 .p-solution-button-head {
    padding-left: 2.2395833333vw;
  }
}
.p-solution .p-solution-button03 .p-solution-button-num {
  background: #5096e6;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button04 {
    bottom: 0;
    right: 0;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button04 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button04 .p-solution-button-head {
    padding-left: 0;
  }
}
.p-solution .p-solution-button04 .p-solution-button-num {
  background: #a9a996;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button05 {
    right: 0;
    top: 0;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button05 .p-solution-button-head {
    padding-left: 6.6666666667vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button05 .p-solution-button-head {
    padding-left: 2.2395833333vw;
  }
}
.p-solution .p-solution-button05 .p-solution-button-num {
  background: #73abeb;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button06 {
    right: 0;
    top: 11.9270833333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button06 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button06 .p-solution-button-head {
    padding-left: 0;
  }
}
.p-solution .p-solution-button06 .p-solution-button-num {
  background: #96c0f0;
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button07 {
    right: 0;
    top: 23.8020833333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution .p-solution-button07 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button07 .p-solution-button-head {
    padding-left: 0;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution .p-solution-button07 .p-solution-button-name {
    place-content: center;
  }
}
.p-solution .p-solution-button07 .p-solution-button-num {
  background: #b9d5f5;
}
@media only screen and (max-width: 750px) {
  .p-solution #area-a {
    left: 36.6666666667vw;
    top: 33.0666666667vw;
    width: 7.7333333333vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-a {
    left: 20.8333333333vw;
    top: 18.75vw;
    width: 4.4270833333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution #area-b {
    left: 2.6666666667vw;
    top: 12.6666666667vw;
    width: 19.6vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-b {
    left: 1.5625vw;
    top: 7.2916666667vw;
    width: 11.1979166667vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution #area-c {
    left: 6vw;
    top: 0;
    width: 31.7333333333vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-c {
    left: 3.3854166667vw;
    top: 0;
    width: 18.0729166667vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution #area-d {
    left: 52.1333333333vw;
    top: 17.6vw;
    width: 13.4666666667vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-d {
    left: 29.6875vw;
    top: 9.8958333333vw;
    width: 7.7083333333vw;
  }
}
@media only screen and (max-width: 750px) {
  .p-solution #area-e {
    left: 65.3333333333vw;
    top: 43.8666666667vw;
    width: 11.2vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-e {
    right: 0.78125vw;
    top: 25.2604166667vw;
    width: 6.40625vw;
  }
}
.p-solution #area-f {
  left: 0;
  top: 0;
}
@media only screen and (max-width: 750px) {
  .p-solution #area-f {
    width: 77.7333333333vw;
  }
}
@media print, screen and (min-width: 751px) {
  .p-solution #area-f {
    width: 44.2708333333vw;
  }
}