@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@500&family=Noto+Sans+JP:wght@100..900&display=swap");
.p-top-line {
  width: 3580px;
  height: 2152px;
  background: url(../img/visual-line.jpg) center top no-repeat;
  background-size: cover;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
}
.sp .p-top-line {
  width: 100%;
  height: 1006px;
  background: url(../img/visual-line-sp.png) center -100px no-repeat;
  background-size: cover;
}

.p-top-rainbow {
  width: 3220px;
  height: 4751px;
  background: url(../img/rainbow.png) center top no-repeat;
  background-size: cover;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  z-index: 2;
}
.sp .p-top-rainbow {
  width: 100%;
  height: 4720px;
  background: url(../img/rainbow-sp.svg) right 0 no-repeat;
  background-size: 100% 4720px;
}

.p-visual {
  position: relative;
  height: 1372px;
}
.sp .p-visual {
  height: auto;
}
.p-visual__pics {
  position: relative;
  width: 1789px;
  margin: 0 auto;
}
@media (max-width: 1768px) {
  .p-visual__pics {
    width: 100%;
  }
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__pics {
    width: 100%;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__pics {
    width: 100%;
  }
}
.p-visual__pic img {
  border-radius: 100%;
  box-shadow: 5px 5px 0 #55baea;
}
.p-visual__pic--1 {
  width: 530px;
  position: absolute;
  left: 26%;
  top: -227px;
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__pic--1 {
    left: 16%;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__pic--1 {
    left: -10%;
  }
}
.sp .p-visual__pic--1 {
  width: 135px;
  left: 6px;
  top: 75px;
}
.p-visual__pic--2 {
  transition: 0.3s ease;
  width: 489px;
  position: absolute;
  right: 30px;
  top: 138px;
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__pic--2 {
    right: 30px;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__pic--2 {
    right: -10%;
  }
}
@media (max-width: 800px) {
  .pc .p-visual__pic--2 {
    right: -20vw;
  }
}
@media (max-width: 720px) {
  .pc .p-visual__pic--2 {
    right: -40vw;
  }
}
.sp .p-visual__pic--2 {
  width: 240px;
  left: auto;
  right: -58px;
  top: -50px;
}
.p-visual__pic--3 {
  width: 591px;
  position: absolute;
  left: -27px;
  top: 781px;
}
@media (max-width: 800px) {
  .pc .p-visual__pic--3 {
    left: -100px;
  }
}
.sp .p-visual__pic--3 {
  width: 198px;
  top: 580px;
  left: 15px;
}
.p-visual__pic--4 {
  width: 329px;
  position: absolute;
  left: 722px;
  top: 791px;
  z-index: 3;
}
@media (max-width: 800px) {
  .pc .p-visual__pic--4 {
    left: 528px;
  }
}
.sp .p-visual__pic--4 {
  width: 125px;
  top: 554px;
  left: auto;
  right: 11px;
  z-index: 3;
}
.p-visual__content {
  position: relative;
  min-height: 100vh;
  padding-top: 382px;
  width: 1789px;
  margin: 0 auto;
}
@media (max-width: 1768px) {
  .p-visual__content {
    width: 100%;
  }
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__content {
    width: 100%;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__content {
    width: 100%;
  }
}
.sp .p-visual__content {
  padding-top: 256px;
  padding-left: 0;
  min-height: 810px;
}
.p-visual__title {
  max-width: 984px;
  margin: 0;
  margin-left: 185px;
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__title {
    margin-left: 50px;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__title {
    margin-left: 50px;
    margin-right: 50px;
  }
}
.sp .p-visual__title {
  margin: 0 auto;
  width: 100%;
  height: 0;
  background: url(../img/visual-title-sp.svg) center top no-repeat;
  background-size: contain;
  padding-top: 55.45%;
}
.sp .p-visual__title img {
  display: none;
}
.p-visual__lead {
  max-width: 984px;
  font-size: 2.65rem;
  line-height: 1.8113207547em;
  margin: 0;
  margin-left: 185px;
  padding-left: 20px;
  letter-spacing: 0;
}
@media (max-width: 1600px) and (min-width: 1200px) {
  .pc .p-visual__lead {
    margin-left: 50px;
  }
}
@media (max-width: 1199px) {
  .pc .p-visual__lead {
    margin-left: 50px;
    margin-right: 50px;
  }
}
.sp .p-visual__lead {
  font-size: 1.6rem;
  line-height: 1.75em;
  margin: 0 30px;
  font-weight: bold;
}

.p-intro {
  position: relative;
  z-index: 3;
}
@media (max-width: 767px) {
  .p-intro {
    z-index: 3;
    background: rgba(255, 255, 255, 0.6);
    padding-bottom: 27px;
  }
}
.p-intro__content {
  max-width: 807px;
}
.p-intro__note {
  font-size: 1.8rem;
  line-height: 1.7777777778em;
}
.p-intro .c-link {
  margin-top: 50px;
}
@media (max-width: 767px) {
  .p-intro .c-link {
    margin-top: 22px;
  }
}

.p-spe {
  position: relative;
  margin-top: 132px;
  z-index: 3;
}
@media (max-width: 767px) {
  .p-spe {
    margin-top: 64px;
  }
}
.p-spe__bg {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  background: url(../img/spe-bg.jpg) 0 0 no-repeat;
  background-size: cover;
  height: 100%;
  width: 100vw;
  border-top-right-radius: 200px;
  overflow: hidden;
}
@media (min-width: 1200px) {
  .pc .p-spe__bg {
    right: 5vw;
  }
}
@media (max-width: 1200px) {
  .pc .p-spe__bg {
    right: 0;
  }
}
@media (max-width: 767px) {
  .p-spe__bg {
    background: url(../img/spe-bg.jpg) 0 0 no-repeat;
    background-size: 100% 100%;
    height: 100%;
    border-top-right-radius: 80px;
  }
}
.p-spe__line {
  display: block;
  position: absolute;
  right: 0px;
  top: 0;
  background: url(../img/spe-line.png) 0 0 no-repeat;
  background-size: contain;
  width: 991px;
  height: 915px;
}
@media (max-width: 1200px) and (min-width: 900px) {
  .pc .p-spe__line {
    top: auto;
    bottom: 0;
    background: url(../img/spe-line-alt.png) 0 0 no-repeat;
    background-size: cover;
    width: 55%;
    height: 100%;
  }
}
@media (max-width: 899px) {
  .pc .p-spe__line {
    top: auto;
    bottom: 0;
    background: url(../img/spe-line-alt.png) 0 0 no-repeat;
    background-size: cover;
    width: 100%;
    height: 934px;
  }
}
@media (max-width: 767px) {
  .p-spe__line {
    top: auto;
    bottom: 0;
    background: url(../img/spe-line-sp.png) 0 0 no-repeat;
    background-size: cover;
    width: 100%;
    height: 1016px;
  }
}
.p-spe__grid {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 70px;
  padding-top: 67px;
  padding-bottom: 55px;
}
@media (min-width: 768px) and (max-width: 900px) {
  .p-spe__grid {
    display: block;
  }
}
@media (max-width: 767px) {
  .p-spe__grid {
    display: block;
    padding-top: 42px;
    padding-bottom: 75px;
  }
}
.p-spe__note {
  color: white;
  position: relative;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.6666666667em;
  margin-bottom: 35px;
}
.p-spe__note:last-child {
  margin-bottom: 0;
}
.p-spe__content {
  max-width: 428px;
  flex: 0 0 428px;
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 900px) {
  .p-spe__content {
    max-width: 50%;
    flex: 0 0 50%;
  }
}
@media (min-width: 768px) and (max-width: 900px) {
  .p-spe__content {
    max-width: 100%;
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  .p-spe__content {
    max-width: 100%;
  }
}
.p-spe__content .c-title-2 {
  margin-top: 0;
  text-shadow: 0 8px 8px #0f84bc;
}
.p-spe__content .c-title-2 .u-en {
  height: auto;
  margin-bottom: 20px;
}
.p-spe__content .c-link {
  margin-top: 30px;
}
@media (max-width: 767px) {
  .p-spe__content .c-link {
    margin-top: 0;
  }
}
.p-spe__feats {
  position: relative;
  flex: 1;
  max-width: 695px;
  margin-left: -29px;
  margin-right: -29px;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 768px) and (min-width: 1201px) {
  .p-spe__feats {
    padding-right: 50px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 900px) {
  .p-spe__feats {
    max-width: 50%;
    flex: 0 0 50%;
  }
}
@media (max-width: 767px) {
  .p-spe__feats {
    padding-top: 34px;
  }
}
@media (max-width: 767px) {
  .p-spe__feats img {
    width: 100%;
  }
}

.p-str {
  position: relative;
}
.p-str__bg {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  border-bottom-left-radius: 200px;
  background: linear-gradient(to right, rgb(204, 239, 255) 0%, rgb(234, 248, 255) 100%);
}
@media (min-width: 768px) and (min-width: 1200px) {
  .p-str__bg {
    left: 5vw;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .p-str__bg {
    left: 0;
  }
}
@media (max-width: 767px) {
  .p-str__bg {
    border-bottom-left-radius: 80px;
  }
}
.p-str .c-title-2 {
  z-index: 3;
}
.p-str__grid {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 37px;
  padding-bottom: 125px;
  position: relative;
  z-index: 3;
}
@media (min-width: 768px) and (max-width: 900px) {
  .p-str__grid {
    display: block;
  }
}
@media (max-width: 767px) {
  .p-str__grid {
    display: block;
    padding-bottom: 95px;
  }
}
.p-str__content {
  flex: 0 0 545px;
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 900px) {
  .p-str__content {
    max-width: 50%;
    flex: 0 0 50%;
  }
}
.p-str__diagram {
  flex: 1;
  min-width: 0;
  position: relative;
  z-index: 3;
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 900px) {
  .p-str__diagram {
    max-width: 50%;
    flex: 0 0 50%;
  }
}
@media (min-width: 768px) and (max-width: 900px) {
  .p-str__diagram {
    max-width: 615px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 58px;
  }
}
@media (max-width: 767px) {
  .p-str__diagram {
    margin-top: 32px;
  }
}
.p-str__diagram img {
  width: 100%;
}
.p-str__feats {
  margin-top: 45px;
}
.p-str__feat {
  background: #fff;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px;
  padding-left: 0;
  position: relative;
  z-index: 3;
  margin-bottom: 17px;
}
@media (max-width: 767px) {
  .p-str__feat {
    display: block;
    padding: 18px 22px;
    margin-bottom: 16px;
  }
}
.p-str__title {
  font-weight: bold;
  text-align: center;
  color: #2892c4;
  font-size: 2.8rem;
  flex: 0 0 161px;
  margin: 0;
}
@media (max-width: 767px) {
  .p-str__title {
    font-size: 2.4rem;
    margin-bottom: 12px;
  }
}
.p-str__note {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5555555556em;
  margin: 0;
}
@media (max-width: 767px) {
  .p-str__note {
    font-size: 1.6rem;
    line-height: 1.75em;
  }
}

.p-top-pro {
  position: relative;
  z-index: 3;
  padding-top: 60px;
  padding-bottom: 166px;
}
@media (max-width: 767px) {
  .p-top-pro {
    padding-bottom: 85px;
  }
}
.p-top-pro__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 767px) {
  .p-top-pro__header {
    display: block;
  }
}
.p-top-pro__grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 33px;
  margin-top: 15px;
}
@media (max-width: 767px) {
  .p-top-pro__grid {
    display: block;
  }
}
.p-top-pro__pic {
  flex: 1;
  min-width: 0;
  border-radius: 10px;
}
@media (max-width: 767px) {
  .p-top-pro__pic {
    height: 221px;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.p-top-pro__btns {
  flex: 0 0 375px;
}
@media (max-width: 767px) {
  .p-top-pro__btns {
    padding-left: 30px;
    padding-right: 30px;
    margin-top: 18px;
  }
  .p-top-pro__btns .c-btn {
    margin-top: 11px;
    margin-bottom: 11px;
  }
}
.p-top-pro .c-banner {
  margin-top: 135px;
}
@media (max-width: 767px) {
  .p-top-pro .c-banner {
    margin-top: 85px;
  }
}
@media (max-width: 767px) {
  .p-top-pro .c-link {
    float: right;
  }
}
@media (max-width: 767px) {
  .p-top-pro .c-title-2 {
    margin-bottom: 18px;
  }
}

.p-top-news {
  position: relative;
  padding-top: 110px;
  padding-bottom: 100px;
}
@media (max-width: 767px) {
  .p-top-news {
    padding-top: 65px;
    padding-bottom: 94px;
  }
}
.p-top-news__bg {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  background: url(../img/news-bg.jpg) 0 0 no-repeat;
  background-size: cover;
  height: 100%;
  width: 100vw;
  border-top-right-radius: 200px;
  overflow: hidden;
}
@media (min-width: 768px) and (min-width: 1200px) {
  .p-top-news__bg {
    right: 5vw;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .p-top-news__bg {
    right: 0;
  }
}
@media (max-width: 767px) {
  .p-top-news__bg {
    border-top-right-radius: 50px;
    background: url(../img/news-bg-sp.jpg) 0 0 no-repeat;
    background-size: cover;
  }
}
.p-top-news__title {
  text-align: center;
  font-size: 4rem;
  margin-top: 0;
  margin-bottom: 55px;
}
@media (max-width: 767px) {
  .p-top-news__title {
    font-size: 3.2rem;
  }
}
/*# sourceMappingURL=style-front.css.map */