.main .lead .movie .note, .main .price .note {
  font-size: 0.13rem;
}
html.fontS .main .lead .movie .note, .main .lead .movie html.fontS .note, html.fontS .main .price .note, .main .price html.fontS .note {
  font-size: 0.1114285714rem;
}
html.fontL .main .lead .movie .note, .main .lead .movie html.fontL .note, html.fontL .main .price .note, .main .price html.fontL .note {
  font-size: 0.1485714286rem;
}

.main .feature .headline .dotlist > li, .main .faq .item-text {
  font-size: 0.16rem;
}
html.fontS .main .feature .headline .dotlist > li, .main .feature .headline html.fontS .dotlist > li, html.fontS .main .faq .item-text, .main .faq html.fontS .item-text {
  font-size: 0.1371428571rem;
}
html.fontL .main .feature .headline .dotlist > li, .main .feature .headline html.fontL .dotlist > li, html.fontL .main .faq .item-text, .main .faq html.fontL .item-text {
  font-size: 0.1828571429rem;
}

.main .lead .detail .list .item {
  font-size: 0.17rem;
}
html.fontS .main .lead .detail .list .item, .main .lead .detail .list html.fontS .item {
  font-size: 0.1457142857rem;
}
html.fontL .main .lead .detail .list .item, .main .lead .detail .list html.fontL .item {
  font-size: 0.1942857143rem;
}

.main .lead p, .main .lead .recommend .name, .main .lead .recommend .note, .main .feature .headline .text p, .main .feature .headline .image .balloon span, .main .package .items-package .item ul li, .main .package .items-course .item .text, .main .merit .item .text, .main .price .table .extax, .main .price .text--02, .main .price .text--03, .main .price .detail dt, .main .price .detail dd {
  font-size: 0.18rem;
}
html.fontS .main .lead p, .main .lead html.fontS p, html.fontS .main .lead .recommend .name, .main .lead .recommend html.fontS .name, html.fontS .main .lead .recommend .note, .main .lead .recommend html.fontS .note, html.fontS .main .feature .headline .text p, .main .feature .headline .text html.fontS p, html.fontS .main .feature .headline .image .balloon span, .main .feature .headline .image .balloon html.fontS span, html.fontS .main .package .items-package .item ul li, .main .package .items-package .item ul html.fontS li, html.fontS .main .package .items-course .item .text, .main .package .items-course .item html.fontS .text, html.fontS .main .merit .item .text, .main .merit .item html.fontS .text, html.fontS .main .price .table .extax, .main .price .table html.fontS .extax, html.fontS .main .price .text--02, .main .price html.fontS .text--02, html.fontS .main .price .text--03, .main .price html.fontS .text--03, html.fontS .main .price .detail dt, .main .price .detail html.fontS dt, html.fontS .main .price .detail dd, .main .price .detail html.fontS dd {
  font-size: 0.1542857143rem;
}
html.fontL .main .lead p, .main .lead html.fontL p, html.fontL .main .lead .recommend .name, .main .lead .recommend html.fontL .name, html.fontL .main .lead .recommend .note, .main .lead .recommend html.fontL .note, html.fontL .main .feature .headline .text p, .main .feature .headline .text html.fontL p, html.fontL .main .feature .headline .image .balloon span, .main .feature .headline .image .balloon html.fontL span, html.fontL .main .package .items-package .item ul li, .main .package .items-package .item ul html.fontL li, html.fontL .main .package .items-course .item .text, .main .package .items-course .item html.fontL .text, html.fontL .main .merit .item .text, .main .merit .item html.fontL .text, html.fontL .main .price .table .extax, .main .price .table html.fontL .extax, html.fontL .main .price .text--02, .main .price html.fontL .text--02, html.fontL .main .price .text--03, .main .price html.fontL .text--03, html.fontL .main .price .detail dt, .main .price .detail html.fontL dt, html.fontL .main .price .detail dd, .main .price .detail html.fontL dd {
  font-size: 0.2057142857rem;
}

.main .pageHeader .text .catch .small {
  font-size: 0.19rem;
}
html.fontS .main .pageHeader .text .catch .small, .main .pageHeader .text .catch html.fontS .small {
  font-size: 0.1628571429rem;
}
html.fontL .main .pageHeader .text .catch .small, .main .pageHeader .text .catch html.fontL .small {
  font-size: 0.2171428571rem;
}

.main .lead .explanation .text, .main .lead .recommend .list > li, .main .feature .link .btn,
.main .solution .link .btn,
.main .merit .link .btn, .main .feature .headline .list > li, .main .feature .headline .list > li .body .sttl .num, .main .feature .headline .movie span, .main .package .items-package .item .sttl, .main .merit .item .sttl, .main .price .ttl--02 span, .main .faq .item-ttl span, .main .faq .item-text span, .main .faq .item-ttl, .main .solution .lnav > li {
  font-size: 0.2rem;
}
html.fontS .main .lead .explanation .text, .main .lead .explanation html.fontS .text, html.fontS .main .lead .recommend .list > li, .main .lead .recommend html.fontS .list > li, html.fontS .main .feature .link .btn, .main .feature .link html.fontS .btn,
html.fontS .main .solution .link .btn,
.main .solution .link html.fontS .btn,
html.fontS .main .merit .link .btn,
.main .merit .link html.fontS .btn, html.fontS .main .feature .headline .list > li, .main .feature .headline html.fontS .list > li, html.fontS .main .feature .headline .list > li .body .sttl .num, .main .feature .headline .list > li .body .sttl html.fontS .num, html.fontS .main .feature .headline .movie span, .main .feature .headline .movie html.fontS span, html.fontS .main .package .items-package .item .sttl, .main .package .items-package .item html.fontS .sttl, html.fontS .main .merit .item .sttl, .main .merit .item html.fontS .sttl, html.fontS .main .price .ttl--02 span, .main .price .ttl--02 html.fontS span, html.fontS .main .faq .item-ttl span, .main .faq .item-ttl html.fontS span, html.fontS .main .faq .item-text span, .main .faq .item-text html.fontS span, html.fontS .main .faq .item-ttl, .main .faq html.fontS .item-ttl, html.fontS .main .solution .lnav > li, .main .solution html.fontS .lnav > li {
  font-size: 0.1714285714rem;
}
html.fontL .main .lead .explanation .text, .main .lead .explanation html.fontL .text, html.fontL .main .lead .recommend .list > li, .main .lead .recommend html.fontL .list > li, html.fontL .main .feature .link .btn, .main .feature .link html.fontL .btn,
html.fontL .main .solution .link .btn,
.main .solution .link html.fontL .btn,
html.fontL .main .merit .link .btn,
.main .merit .link html.fontL .btn, html.fontL .main .feature .headline .list > li, .main .feature .headline html.fontL .list > li, html.fontL .main .feature .headline .list > li .body .sttl .num, .main .feature .headline .list > li .body .sttl html.fontL .num, html.fontL .main .feature .headline .movie span, .main .feature .headline .movie html.fontL span, html.fontL .main .package .items-package .item .sttl, .main .package .items-package .item html.fontL .sttl, html.fontL .main .merit .item .sttl, .main .merit .item html.fontL .sttl, html.fontL .main .price .ttl--02 span, .main .price .ttl--02 html.fontL span, html.fontL .main .faq .item-ttl span, .main .faq .item-ttl html.fontL span, html.fontL .main .faq .item-text span, .main .faq .item-text html.fontL span, html.fontL .main .faq .item-ttl, .main .faq html.fontL .item-ttl, html.fontL .main .solution .lnav > li, .main .solution html.fontL .lnav > li {
  font-size: 0.2285714286rem;
}

.main .price .table .num, .main .price .text--01, .main .price .text--02 .num, .main .price .text--03 .num, .main .price .detail dt .num {
  font-size: 0.22rem;
}
html.fontS .main .price .table .num, .main .price .table html.fontS .num, html.fontS .main .price .text--01, .main .price html.fontS .text--01, html.fontS .main .price .text--02 .num, .main .price .text--02 html.fontS .num, html.fontS .main .price .text--03 .num, .main .price .text--03 html.fontS .num, html.fontS .main .price .detail dt .num, .main .price .detail dt html.fontS .num {
  font-size: 0.1885714286rem;
}
html.fontL .main .price .table .num, .main .price .table html.fontL .num, html.fontL .main .price .text--01, .main .price html.fontL .text--01, html.fontL .main .price .text--02 .num, .main .price .text--02 html.fontL .num, html.fontL .main .price .text--03 .num, .main .price .text--03 html.fontL .num, html.fontL .main .price .detail dt .num, .main .price .detail dt html.fontL .num {
  font-size: 0.2514285714rem;
}

.main .lead .recommend .list > li span, .main .lead .detail .text .line--02, .main .feature .headline .image .balloon, .main .feature .headline .list > li .body .sttl .summary, .main .feature .headline .list > li .body .name .xsmall, .main .package .ttl--02, .main .merit .ttl--02, .main .price .ttl--02, .main .price .text--04 {
  font-size: 0.24rem;
}
html.fontS .main .lead .recommend .list > li span, .main .lead .recommend .list > li html.fontS span, html.fontS .main .lead .detail .text .line--02, .main .lead .detail .text html.fontS .line--02, html.fontS .main .feature .headline .image .balloon, .main .feature .headline .image html.fontS .balloon, html.fontS .main .feature .headline .list > li .body .sttl .summary, .main .feature .headline .list > li .body .sttl html.fontS .summary, html.fontS .main .feature .headline .list > li .body .name .xsmall, .main .feature .headline .list > li .body .name html.fontS .xsmall, html.fontS .main .package .ttl--02, .main .package html.fontS .ttl--02, html.fontS .main .merit .ttl--02, .main .merit html.fontS .ttl--02, html.fontS .main .price .ttl--02, .main .price html.fontS .ttl--02, html.fontS .main .price .text--04, .main .price html.fontS .text--04 {
  font-size: 0.2057142857rem;
}
html.fontL .main .lead .recommend .list > li span, .main .lead .recommend .list > li html.fontL span, html.fontL .main .lead .detail .text .line--02, .main .lead .detail .text html.fontL .line--02, html.fontL .main .feature .headline .image .balloon, .main .feature .headline .image html.fontL .balloon, html.fontL .main .feature .headline .list > li .body .sttl .summary, .main .feature .headline .list > li .body .sttl html.fontL .summary, html.fontL .main .feature .headline .list > li .body .name .xsmall, .main .feature .headline .list > li .body .name html.fontL .xsmall, html.fontL .main .package .ttl--02, .main .package html.fontL .ttl--02, html.fontL .main .merit .ttl--02, .main .merit html.fontL .ttl--02, html.fontL .main .price .ttl--02, .main .price html.fontL .ttl--02, html.fontL .main .price .text--04, .main .price html.fontL .text--04 {
  font-size: 0.2742857143rem;
}

.main .package .ttl--01 span, .main .price .sttl--01, .main .price .sttl--01 .num {
  font-size: 0.28rem;
}
html.fontS .main .package .ttl--01 span, .main .package .ttl--01 html.fontS span, html.fontS .main .price .sttl--01, .main .price html.fontS .sttl--01, html.fontS .main .price .sttl--01 .num, .main .price .sttl--01 html.fontS .num {
  font-size: 0.24rem;
}
html.fontL .main .package .ttl--01 span, .main .package .ttl--01 html.fontL span, html.fontL .main .price .sttl--01, .main .price html.fontL .sttl--01, html.fontL .main .price .sttl--01 .num, .main .price .sttl--01 html.fontL .num {
  font-size: 0.32rem;
}

.main .lead .explanation .text strong, .main .price .text--02 .green, .main .price .text--03 .green .num, .main .price .detail dd .num {
  font-size: 0.3rem;
}
html.fontS .main .lead .explanation .text strong, .main .lead .explanation .text html.fontS strong, html.fontS .main .price .text--02 .green, .main .price .text--02 html.fontS .green, html.fontS .main .price .text--03 .green .num, .main .price .text--03 .green html.fontS .num, html.fontS .main .price .detail dd .num, .main .price .detail dd html.fontS .num {
  font-size: 0.2571428571rem;
}
html.fontL .main .lead .explanation .text strong, .main .lead .explanation .text html.fontL strong, html.fontL .main .price .text--02 .green, .main .price .text--02 html.fontL .green, html.fontL .main .price .text--03 .green .num, .main .price .text--03 .green html.fontL .num, html.fontL .main .price .detail dd .num, .main .price .detail dd html.fontL .num {
  font-size: 0.3428571429rem;
}

.main .feature .headline .list > li .body .name .small {
  font-size: 0.34rem;
}
html.fontS .main .feature .headline .list > li .body .name .small, .main .feature .headline .list > li .body .name html.fontS .small {
  font-size: 0.2742857143rem;
}
html.fontL .main .feature .headline .list > li .body .name .small, .main .feature .headline .list > li .body .name html.fontL .small {
  font-size: 0.3657142857rem;
}

.main .solution .ttl {
  font-size: 0.36rem;
}
html.fontS .main .solution .ttl, .main .solution html.fontS .ttl {
  font-size: 0.3085714286rem;
}
html.fontL .main .solution .ttl, .main .solution html.fontL .ttl {
  font-size: 0.4114285714rem;
}

.main .lead .catch {
  font-size: 0.38rem;
}
html.fontS .main .lead .catch, .main .lead html.fontS .catch {
  font-size: 0.3257142857rem;
}
html.fontL .main .lead .catch, .main .lead html.fontL .catch {
  font-size: 0.4342857143rem;
}

.main .feature .headline .text .catch .text, .main .feature .headline .list > li .body .name, .main .package .ttl--01, .main .merit .ttl--01, .main .price .ttl--01, .main .faq .ttl {
  font-size: 0.4rem;
}
html.fontS .main .feature .headline .text .catch .text, .main .feature .headline .text .catch html.fontS .text, html.fontS .main .feature .headline .list > li .body .name, .main .feature .headline .list > li .body html.fontS .name, html.fontS .main .package .ttl--01, .main .package html.fontS .ttl--01, html.fontS .main .merit .ttl--01, .main .merit html.fontS .ttl--01, html.fontS .main .price .ttl--01, .main .price html.fontS .ttl--01, html.fontS .main .faq .ttl, .main .faq html.fontS .ttl {
  font-size: 0.3428571429rem;
}
html.fontL .main .feature .headline .text .catch .text, .main .feature .headline .text .catch html.fontL .text, html.fontL .main .feature .headline .list > li .body .name, .main .feature .headline .list > li .body html.fontL .name, html.fontL .main .package .ttl--01, .main .package html.fontL .ttl--01, html.fontL .main .merit .ttl--01, .main .merit html.fontL .ttl--01, html.fontL .main .price .ttl--01, .main .price html.fontL .ttl--01, html.fontL .main .faq .ttl, .main .faq html.fontL .ttl {
  font-size: 0.4571428571rem;
}

.main .lead .catch strong, .main .lead .detail .text .line--01 {
  font-size: 0.44rem;
}
html.fontS .main .lead .catch strong, .main .lead .catch html.fontS strong, html.fontS .main .lead .detail .text .line--01, .main .lead .detail .text html.fontS .line--01 {
  font-size: 0.3771428571rem;
}
html.fontL .main .lead .catch strong, .main .lead .catch html.fontL strong, html.fontL .main .lead .detail .text .line--01, .main .lead .detail .text html.fontL .line--01 {
  font-size: 0.5028571429rem;
}

.main .feature .headline .list > li .body .name strong {
  font-size: 0.5rem;
}
html.fontS .main .feature .headline .list > li .body .name strong, .main .feature .headline .list > li .body .name html.fontS strong {
  font-size: 0.4285714286rem;
}
html.fontL .main .feature .headline .list > li .body .name strong, .main .feature .headline .list > li .body .name html.fontL strong {
  font-size: 0.5714285714rem;
}

.main .price .text--01 .num {
  font-size: 0.6rem;
}
html.fontS .main .price .text--01 .num, .main .price .text--01 html.fontS .num {
  font-size: 0.5142857143rem;
}
html.fontL .main .price .text--01 .num, .main .price .text--01 html.fontL .num {
  font-size: 0.6857142857rem;
}

.main .lead p::before, .main .lead .movie .note::before, .main .lead .recommend .name::before, .main .lead .detail .text .line::before, .main .feature .headline .text p::before, .main .lead p::after, .main .lead .movie .note::after, .main .lead .recommend .name::after, .main .lead .detail .text .line::after, .main .feature .headline .text p::after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}
.main .lead p::before, .main .lead .movie .note::before, .main .lead .recommend .name::before, .main .lead .detail .text .line::before, .main .feature .headline .text p::before {
  margin-bottom: calc((1em - 1lh) / 2);
}
.main .lead p::after, .main .lead .movie .note::after, .main .lead .recommend .name::after, .main .lead .detail .text .line::after, .main .feature .headline .text p::after {
  margin-top: calc((1em - 1lh) / 2);
}

.main .lead::before, .main .solution .inner::before {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  left: 0;
  font-family: "Poppins";
  font-size: 3.5rem;
  font-weight: 600;
  line-height: 0.6971428571;
  white-space: nowrap;
  -webkit-animation: ticker 40s infinite linear;
          animation: ticker 40s infinite linear;
}
@media screen and (max-width: 750px) {
  .main .lead::before, .main .solution .inner::before {
    font-size: 2.5rem;
    line-height: 0.712;
  }
}
@-webkit-keyframes ticker {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
@keyframes ticker {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}

@media screen and (hover: hover) and (pointer: fine) {
  .main .feature .link .btn--site,
.main .solution .link .btn--site,
.main .merit .link .btn--site {
    transition: opacity 0.3s;
  }
  @supports (filter: brightness(100%)) {
    .main .feature .link .btn--site,
.main .solution .link .btn--site,
.main .merit .link .btn--site {
      transition-property: filter;
    }
  }
  .main .feature .link .btn--site:hover,
.main .solution .link .btn--site:hover,
.main .merit .link .btn--site:hover {
    opacity: 0.8;
  }
  @supports (filter: brightness(100%)) {
    .main .feature .link .btn--site:hover,
.main .solution .link .btn--site:hover,
.main .merit .link .btn--site:hover {
      filter: brightness(110%);
      opacity: 1;
    }
  }
}

.main .pageHeader {
  background-image: url(../imgs/hero-bg.jpg);
}
@media screen and (max-width: 750px) {
  .main .pageHeader {
    background-image: none;
  }
}
.main .pageHeader .text .ttl .line--01 {
  background: linear-gradient(90deg, #60a332, #94bf37);
}
.main .pageHeader .text .ttl .line--02 {
  font-size: 0.5rem;
  letter-spacing: normal;
}
.main .pageHeader .text .catch strong {
  color: #60a432;
}
.main .pageHeader .text .catch .small {
  line-height: 1.8;
  display: inline-block;
}
@media screen and (max-width: 750px) {
  .main .pageHeader .text .catch .small {
    font-size: 0.24rem;
  }
}
.main .pageHeader .image::before {
  background: repeating-linear-gradient(#49af6f, #49af6f 0.06rem, transparent 0.06rem, transparent 0.16rem);
}
.main .pageHeader .image--02 {
  width: 2.7rem;
  bottom: -0.54rem;
  left: -1.7rem;
}
@media screen and (max-width: 750px) {
  .main .pageHeader .image--02 {
    width: 2.768rem;
    border: -0.4rem;
    left: -0.4rem;
  }
}
.main .pageHeader .deco::before {
  background-image: url(../../assets/imgs/deco06.png), url(../../assets/imgs/deco11.png), linear-gradient(90deg, transparent 3rem, #94bf37 3rem), linear-gradient(90deg, transparent 1rem, #94bf37 1rem, #94bf37 3rem, #49af6f 3rem);
}
@media screen and (max-width: 750px) {
  .main .pageHeader .deco::before {
    background-image: url(../../assets/imgs/deco06.png), url(../../assets/imgs/deco11.png), linear-gradient(90deg, transparent 1.8rem, #94bf37 1.8rem), linear-gradient(90deg, transparent 0.6rem, #94bf37 0.6rem, #94bf37 1.8rem, #49af6f 1.8rem);
  }
}
.main .pageHeader .circle--01 {
  background: #e4efe8;
}
.main .pageHeader .circle--02 {
  border-color: #6a9c2d;
}
.main .pageHeader .circle--03 {
  background-color: rgba(73, 175, 111, 0.2);
}
.main .pageHeader .circle--04 {
  background: #94bf37;
}
.main .pageHeader .circle--05 {
  background-color: rgba(69, 175, 111, 0.2);
}
.main .pageHeader .circle--06 {
  border-color: #6a9c2d;
}
.main .solutionPager .list::before {
  border-color: #71a630;
}
.main .lead {
  padding: 1.5rem 0 1.8rem;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .main .lead {
    padding: 1rem 0 2rem;
  }
}
.main .lead::before {
  content: "SKILL DRIVE SKILL DRIVE ";
  bottom: 3rem;
  color: #f7f7f7;
}
.main .lead .catch {
  font-weight: 800;
  line-height: 1;
  text-align: center;
}
.main .lead .catch strong {
  color: #60a332;
  font-weight: inherit;
}
.main .lead p {
  padding: 0.6rem 0 0;
  line-height: 2.2222222222;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .lead p {
    font-size: 0.28rem;
    text-align: left;
  }
}
.main .lead .movie {
  box-sizing: border-box;
  width: 9.6rem;
  margin: 0.7rem auto 0;
  position: relative;
  background-image: url(../imgs/bg_movie01.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  padding: 0.1rem;
  border-radius: 0.6rem;
}
@media screen and (max-width: 750px) {
  .main .lead .movie {
    width: auto;
  }
}
.main .lead .movie::before, .main .lead .movie::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  aspect-ratio: 1/1;
}
.main .lead .movie::before {
  width: 1.5rem;
  top: -0.7rem;
  left: -0.7rem;
  box-shadow: inset 0 0 0 0.18rem rgba(148, 191, 55, 0.15);
}
.main .lead .movie::after {
  width: 2.5rem;
  bottom: -1rem;
  right: -1.33rem;
  box-shadow: inset 0 0 0 0.2rem #71a630;
  opacity: 0.2;
}
@media screen and (max-width: 750px) {
  .main .lead .movie::after {
    content: none;
  }
}
.main .lead .movie iframe {
  display: block;
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 16/9.1;
  border-radius: 0.5rem;
  box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.15);
  overflow: hidden;
}
.main .lead .movie .note {
  padding: 0.2rem 0 0;
  font-weight: 500;
  text-align: right;
}
@media screen and (max-width: 750px) {
  .main .lead .movie .note {
    font-size: 0.2rem;
  }
}
.main .lead .explanation {
  margin-top: 1.5rem;
}
.main .lead .explanation .image {
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .lead .explanation .image {
    width: 72vw;
    margin: 0 auto;
  }
}
.main .lead .explanation .text {
  text-align: center;
  margin-top: 0.5rem;
  line-height: 1.5;
}
@media screen and (max-width: 750px) {
  .main .lead .explanation .text {
    font-size: 0.28rem;
  }
}
.main .lead .explanation .text strong {
  color: #60a332;
}
@media screen and (max-width: 750px) {
  .main .lead .explanation .text strong {
    font-size: 0.32rem;
  }
}
.main .lead .recommend {
  width: 10.7rem;
  margin: 0.5rem auto 0;
  padding: 0.6rem 0 0.5rem;
  position: relative;
  border-radius: 0.3rem;
  background-color: #FFFFFF;
  box-shadow: 0.1rem 0.1rem 0.5rem 0 rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 750px) {
  .main .lead .recommend {
    width: auto;
    padding: 0.6rem 0.4rem;
  }
}
.main .lead .recommend::before, .main .lead .recommend::after {
  content: "";
  display: block;
  position: absolute;
  border-radius: 50%;
  aspect-ratio: 1/1;
  z-index: -1;
}
.main .lead .recommend::before {
  width: 1.7rem;
  top: -2.4rem;
  left: -2.4rem;
  box-shadow: inset 0 0 0 0.18rem rgba(249, 192, 196, 0.15);
}
.main .lead .recommend::after {
  width: 1.5rem;
  bottom: -0.75rem;
  right: -1.5rem;
  box-shadow: inset 0 0 0 0.2rem #71a630;
  opacity: 0.2;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend::after {
    content: none;
  }
}
.main .lead .recommend .name {
  font-weight: 800;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .name {
    font-size: 0.3rem;
  }
}
.main .lead .recommend .list {
  display: flex;
  justify-content: center;
  gap: 0.3rem;
  margin-top: 0.4rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list {
    margin: 0.6rem 0 0;
    display: block;
  }
}
.main .lead .recommend .list::before {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../imgs/pattern02.png);
  width: 3.8rem;
  height: 0.45rem;
  bottom: 0;
  right: 1rem;
}
.main .lead .recommend .list > li {
  background: url(../imgs/check.png) 0 0/0.3rem auto no-repeat;
  font-weight: 600;
  line-height: 0.3rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li {
    font-size: 0.24rem;
    text-align: center;
  }
  .main .lead .recommend .list > li + li {
    margin: 0.5rem 0 0;
  }
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li:nth-child(odd) {
    width: auto;
  }
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li:nth-child(even) {
    width: auto;
  }
}
.main .lead .recommend .list > li span {
  display: inline-block;
  border-radius: 0.06rem;
  background: linear-gradient(-90deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
  color: #FFF;
  padding: 0.05rem 0.2rem 0.08rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li span {
    font-size: 0.32rem;
    padding: 0.075rem 0.2rem 0.1rem;
  }
}
.main .lead .recommend .list > li + * {
  position: relative;
}
.main .lead .recommend .list > li + *::before {
  content: "";
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../imgs/hang01.png);
  width: 0.15rem;
  height: 0.15rem;
  left: -0.225rem;
  transform: translate(0, -50%);
  top: 50%;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li + *::before {
    top: -0.35rem;
    left: 50%;
    transform: translate(-50%, 0);
  }
}
.main .lead .recommend .list > li + * span {
  margin-right: 0.1rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .list > li + * span {
    margin: 0 0 0.1rem;
  }
}
.main .lead .recommend .note {
  text-align: center;
  margin-top: 0.2rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .note {
    font-size: 0.2rem;
  }
}
.main .lead .recommend .image {
  position: absolute;
}
.main .lead .recommend .image--01 {
  width: 1.21rem;
  top: -0.6rem;
  left: 0.35rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .image--01 {
    width: 10vw;
  }
}
.main .lead .recommend .image--02 {
  width: 1.41rem;
  bottom: 0.2rem;
  right: 0.5rem;
}
@media screen and (max-width: 750px) {
  .main .lead .recommend .image--02 {
    right: 0;
    bottom: 0.1rem;
  }
}
.main .lead .detail {
  padding: 1.2rem 0 0;
}
@media screen and (max-width: 750px) {
  .main .lead .detail {
    padding: 1rem 0 0;
  }
}
.main .lead .detail .text {
  text-align: center;
}
.main .lead .detail .text .line {
  line-height: 1.5;
}
.main .lead .detail .text .line--01 {
  font-weight: 800;
}
.main .lead .detail .text .line--01 .small {
  font-size: 0.8181818182em;
}
.main .lead .detail .text .line--02 {
  padding: 0.4rem 0 0;
}
@media screen and (max-width: 750px) {
  .main .lead .detail .text .line--02 {
    font-size: 0.4rem;
  }
}
.main .lead .detail .list {
  width: 10.7rem;
  margin: 0.7rem auto 0;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-gap: 1.5rem 0.5rem;
}
@media screen and (max-width: 750px) {
  .main .lead .detail .list {
    display: block;
    width: auto;
    margin: 0.9rem 0 0;
  }
}
.main .lead .detail .list .item {
  flex-grow: 1;
  box-sizing: border-box;
  padding: 0.62rem 0.13rem 0.42rem;
  background: #e7f1e0;
  border-radius: 0.3rem;
  position: relative;
  line-height: 1.6470588235;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .lead .detail .list .item {
    width: auto;
    margin: 0.9rem 0 0;
    font-size: 0.28rem;
  }
}
.main .lead .detail .list .item::before, .main .lead .detail .list .item::after {
  content: "";
  display: block;
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
  border-radius: 0.3rem;
}
.main .lead .detail .list .item::before {
  width: calc(100% + 0.06rem);
  height: calc(100% + 0.06rem);
  background: linear-gradient(90deg, #60a332 0%, #94bf37);
  z-index: -2;
}
.main .lead .detail .list .item::after {
  width: 100%;
  height: 100%;
  background: #e7f1e0;
  z-index: -1;
}
.main .lead .detail .list .item:nth-child(1) {
  grid-row: 1/2;
  grid-column: 1/3;
}
.main .lead .detail .list .item:nth-child(2) {
  grid-row: 1/2;
  grid-column: 3/5;
  position: relative;
}
@media screen and (min-width: 751px) {
  .main .lead .detail .list .item:nth-child(2) {
    top: 0.5rem;
  }
}
.main .lead .detail .list .item:nth-child(3) {
  grid-row: 1/2;
  grid-column: 5/7;
}
.main .lead .detail .list .item:nth-child(4) {
  grid-row: 2/3;
  grid-column: 2/4;
}
.main .lead .detail .list .item:nth-child(5) {
  grid-row: 2/3;
  grid-column: 4/6;
}
.main .lead .detail .list .item .avatar {
  width: 0.7rem;
  position: absolute;
  top: -0.46rem;
  left: calc(50% - 0.35rem);
}
@media screen and (max-width: 750px) {
  .main .lead .detail .list .item .avatar {
    width: 1rem;
    top: -0.5rem;
    left: calc(50% - 0.5rem);
  }
}
.main .feature .link,
.main .solution .link,
.main .merit .link {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  margin: 0.8rem 0 0;
}
@media screen and (max-width: 750px) {
  .main .feature .link,
.main .solution .link,
.main .merit .link {
    display: block;
    width: 80%;
    margin: 0.6rem auto 0;
  }
}
.main .feature .link li,
.main .solution .link li,
.main .merit .link li {
  width: 4.3rem;
}
@media screen and (max-width: 750px) {
  .main .feature .link li,
.main .solution .link li,
.main .merit .link li {
    width: auto;
    margin: 0.4rem 0 0;
  }
}
.main .feature .link .btn,
.main .solution .link .btn,
.main .merit .link .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 1rem;
  padding: 0 0.1rem 0 0;
  position: relative;
  border-radius: 0.5rem;
  font-weight: 800;
  box-shadow: 0.09rem 0.12rem 0.3rem rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 750px) {
  .main .feature .link .btn,
.main .solution .link .btn,
.main .merit .link .btn {
    font-size: 0.28rem;
  }
}
.main .feature .link .btn::after,
.main .solution .link .btn::after,
.main .merit .link .btn::after {
  content: "";
  display: block;
  width: 0.6rem;
  aspect-ratio: 1/1;
  position: absolute;
  top: calc(50% - 0.3rem);
  border-radius: 50%;
  background-repeat: no-repeat;
}
.main .feature .link .btn--contact,
.main .solution .link .btn--contact,
.main .merit .link .btn--contact {
  background: linear-gradient(90deg, rgb(245, 118, 124) 1%, rgb(246, 142, 148) 100%, rgb(224, 231, 239) 100%);
  color: #FFF;
  box-shadow: inset 0 0 0 0.02rem #fff, 0.09rem 0.12rem 0.3rem rgba(0, 0, 0, 0.2);
  box-shadow: 0.1rem 0.1rem 0.3rem 0 rgba(0, 0, 0, 0.2);
  padding-right: 0.6rem;
}
@media screen and (hover: hover) and (pointer: fine) {
  .main .feature .link .btn--contact,
.main .solution .link .btn--contact,
.main .merit .link .btn--contact {
    transition: 0.4s;
    transition-property: background-color, color;
  }
  .main .feature .link .btn--contact:hover,
.main .solution .link .btn--contact:hover,
.main .merit .link .btn--contact:hover {
    background: #f68e94;
    color: #fff;
  }
}
.main .feature .link .btn--contact::after,
.main .solution .link .btn--contact::after,
.main .merit .link .btn--contact::after {
  right: 0.2rem;
  background-image: url(../../assets/imgs/arrow01_pi.svg);
  background-position: 50% 50%, 0 0;
  background-size: 0.14rem auto, cover;
  background-color: #FFF;
}
.main .feature .link .btn--site,
.main .solution .link .btn--site,
.main .merit .link .btn--site {
  background: url(../imgs/bg-btn.jpg) 0 0/cover no-repeat;
  background-color: #FFF;
  color: #60a332;
}
.main .feature .link .btn--site::after,
.main .solution .link .btn--site::after,
.main .merit .link .btn--site::after {
  right: 0.18rem;
  background-image: url(../../assets/imgs/arrow01_w.svg), linear-gradient(-90deg, rgb(148, 191, 55), rgb(96, 163, 50));
  background-position: 50% 50%, 0 0;
  background-size: 0.18rem auto, cover;
}
.main .feature .deco,
.main .solution .deco,
.main .merit .deco {
  width: calc(50% - 4.6rem);
  position: absolute;
}
@media screen and (max-width: 750px) {
  .main .feature .deco,
.main .solution .deco,
.main .merit .deco {
    width: 3rem;
    height: 2.4rem;
  }
}
.main .feature .deco::before,
.main .solution .deco::before,
.main .merit .deco::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
}
.main .feature .deco--01,
.main .solution .deco--01,
.main .merit .deco--01 {
  height: 4rem;
  top: 0;
  left: 0;
}
.main .feature .deco--01::before,
.main .solution .deco--01::before,
.main .merit .deco--01::before {
  background-image: url(../../assets/imgs/deco12_ra.png), url(../../assets/imgs/deco07_ra.png), linear-gradient(270deg, transparent 1rem, #49af6f 1rem, #49af6f 3rem, #94bf37 3rem), linear-gradient(270deg, transparent 4rem, #49af6f 4rem);
  background-position: 100% 0, calc(100% - 3rem) 2rem, 0 0, 0 2rem;
  background-size: auto 2rem, auto 2rem, 100% 2rem, 100% 2rem;
}
@media screen and (max-width: 750px) {
  .main .feature .deco--01::before,
.main .solution .deco--01::before,
.main .merit .deco--01::before {
    background-image: url(../../assets/imgs/deco12_ra.png), url(../../assets/imgs/deco07_ra.png), linear-gradient(270deg, transparent 1.2rem, #49af6f 1.2rem, #49af6f 2.4rem, #94bf37 2.4rem), linear-gradient(270deg, transparent 2.4rem, #49af6f 2.4rem);
    background-position: 1.2rem 0, 0 1.2rem, 0 0, 0 1.2rem;
    background-size: auto 1.2rem, auto 1.2rem, 100% 1.2rem, 100% 1.2rem;
  }
}
.main .feature .deco--02,
.main .solution .deco--02,
.main .merit .deco--02 {
  height: 6rem;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 750px) {
  .main .feature .deco--02,
.main .solution .deco--02,
.main .merit .deco--02 {
    height: 3.6rem;
  }
}
.main .feature .deco--02::before,
.main .solution .deco--02::before,
.main .merit .deco--02::before {
  background-image: url(../../assets/imgs/deco07.png), url(../../assets/imgs/deco11.png), url(../../assets/imgs/deco06.png), linear-gradient(90deg, transparent 4rem, #49af6f 4rem), linear-gradient(90deg, transparent 3rem, #49af6f 3rem, #49af6f 5rem, #99c734 5rem), linear-gradient(90deg, transparent 1rem, #f68e94 1rem, #f68e94 3rem, #99c734 3rem);
  background-position: 3rem 0, 2rem 2rem, 0 4rem, 0 0, 0 2rem, 0 4rem;
  background-size: auto 2rem, auto 2rem, auto 2rem, 100% 2rem, 100% 2rem, 100% 2rem;
}
@media screen and (max-width: 750px) {
  .main .feature .deco--02::before,
.main .solution .deco--02::before,
.main .merit .deco--02::before {
    background-image: url(../../assets/imgs/deco07.png), url(../../assets/imgs/deco11.png), url(../../assets/imgs/deco06.png), linear-gradient(90deg, transparent 2.4rem, #49af6f 2.4rem), linear-gradient(90deg, transparent 1.8rem, #49af6f 1.8rem), linear-gradient(90deg, transparent 0.6rem, #f68e94 0.6rem, #f68e94 1.8rem, #99c734 1.8rem);
    background-position: 1.8rem 0, 1.2rem 1.2rem, 0 2.4rem, 0 0, 0 1.2rem, 0 2.4rem;
    background-size: auto 1.2rem, auto 1.2rem, auto 1.2rem, 100% 1.2rem, 100% 1.2rem, 100% 1.2rem;
  }
}
.main .feature {
  overflow: hidden;
}
.main .feature .headline {
  padding: 1rem 0;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .main .feature .headline {
    padding: 0.6rem 0;
  }
}
.main .feature .headline .inner {
  padding: 1.4rem 0 2rem;
  background: linear-gradient(180deg, rgb(123, 181, 52) 1%, rgb(113, 166, 48) 100%, rgb(224, 231, 239) 100%);
  border-radius: 1.8rem;
  color: #fff;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .inner {
    padding: 1.2rem 0;
    border-radius: 1rem;
  }
}
.main .feature .headline .wrap {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 50% 50%;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .wrap {
    width: auto;
    display: block;
  }
}
.main .feature .headline .text {
  grid-row: 1/2;
  grid-column: 1/2;
}
@media screen and (min-width: 751px) {
  .main .feature .headline .text .ttl {
    margin-top: 1.5rem;
  }
}
.main .feature .headline .text .ttl .en {
  background-image: url(../../assets/imgs/blt02.png);
  color: #FFF;
}
.main .feature .headline .text .catch {
  margin: 0.3rem 0 0;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .text .catch {
    margin: 0.2rem 0 0;
  }
}
.main .feature .headline .text .catch .text {
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .text .catch .text {
    font-size: 0.44rem;
    white-space: normal;
  }
}
.main .feature .headline .text .catch .text strong {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: inherit;
}
.main .feature .headline .text .catch .text .line--02 {
  margin: 0.36rem 0 0;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .text .catch .text .line--02 {
    margin: 0.3rem 0 0;
    line-height: 1.5;
  }
}
.main .feature .headline .text p {
  padding: 0.5rem 0 0;
  line-height: 2.2222222222;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .text p {
    padding: 0.6rem 0 0;
    font-size: 0.28rem;
  }
}
.main .feature .headline .text p .en {
  font-family: "Poppins";
  font-size: 1.2222222222em;
  font-weight: 500;
  line-height: 0.8181818182;
}
.main .feature .headline .image .balloon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 2rem;
  height: 2rem;
  position: absolute;
  background: linear-gradient(45deg, rgb(204, 235, 168) 0%, rgb(113, 169, 48) 100%, rgb(224, 231, 239) 100%);
  border-radius: 50%;
  color: #fff;
  transform: scale(0);
  transition: transform 0.8s;
  text-align: center;
  line-height: 1.3;
}
.main .feature .headline .image .balloon span {
  display: block;
  margin-bottom: 0.1rem;
}
.main .feature .headline .image .balloon--01 {
  top: 1rem;
  left: 1.7rem;
  z-index: 2;
  transition-delay: 0.4s;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image .balloon--01 {
    left: 0.6rem;
  }
}
.main .feature .headline .image .balloon--02 {
  top: 0;
  left: 3.3rem;
  z-index: 1;
  transition-delay: 0.6s;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image .balloon--02 {
    left: calc(50% - 1rem);
  }
}
.main .feature .headline .image .balloon--03 {
  top: 1rem;
  right: 0.5rem;
  transition-delay: 0.8s;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image .balloon--03 {
    right: 0.6rem;
  }
}
.main .feature .headline .image--01 {
  grid-row: 1/2;
  grid-column: 2/3;
  padding: 1.8rem 0 0;
  position: relative;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image--01 {
    margin: 0.6rem auto 0;
  }
}
.main .feature .headline .image--01 img {
  position: relative;
  z-index: 3;
  display: block;
}
@media screen and (min-width: 751px) {
  .main .feature .headline .image--01 img {
    width: 6rem;
    margin: 0 0.2rem 0 auto;
  }
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image--01 img {
    width: 62vw;
    margin: 0 auto;
  }
}
.main .feature .headline .image--02 img {
  display: block;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image--02 {
    width: 62vw;
    margin: 0.3rem auto 0 auto;
  }
}
.main .feature .headline .image--03 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.3rem;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .image--03 {
    margin-top: 0.3rem;
  }
}
.main .feature .headline .image--03 span {
  height: 2.8rem;
  overflow: hidden;
  border-radius: 0.2rem;
}
.main .feature .headline .image.scrollIn .balloon {
  transform: scale(1);
}
.main .feature .headline .list {
  grid-row: 2/3;
  grid-column: 1/3;
  position: relative;
  margin: 0.75rem 0 0;
  z-index: 0;
}
.main .feature .headline .list::before, .main .feature .headline .list::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
}
.main .feature .headline .list::before {
  width: 2.4rem;
  height: 2.4rem;
  background-color: #49af6f;
  border-radius: 2.4rem;
  top: 12rem;
  left: -1.2rem;
}
.main .feature .headline .list::after {
  width: 3rem;
  height: 3rem;
  background-color: #94bf37;
  border-radius: 3rem;
  top: 3rem;
  right: -1.5rem;
}
.main .feature .headline .list > li {
  box-sizing: border-box;
  padding: 0.9rem;
  background: #fff;
  border-radius: 0.5rem;
  position: relative;
  color: #262626;
  box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.2);
  display: grid;
  grid-template-columns: auto 6.6rem;
  grid-gap: 0.5rem;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .list > li {
    margin: 1rem 0 0;
    padding: 1rem 0.4rem 0.4rem;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 0.2rem;
  }
}
.main .feature .headline .list > li + * {
  margin-top: 1rem;
}
.main .feature .headline .list > li .body .sttl {
  display: grid;
  grid-template-columns: 1.4rem auto;
  align-items: center;
  position: absolute;
  left: 0.5rem;
  top: -0.2rem;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .list > li .body .sttl {
    grid-template-columns: repeat(1, 1fr);
    transform: translate(-50%, 0);
    left: 50%;
    top: -0.4rem;
    width: 90%;
  }
}
.main .feature .headline .list > li .body .sttl .num,
.main .feature .headline .list > li .body .sttl .summary {
  height: 0.6rem;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.main .feature .headline .list > li .body .sttl .num {
  background-color: #006c48;
  color: #FFF;
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .list > li .body .sttl .num {
    font-size: 0.28rem;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    border-bottom-left-radius: 0;
  }
}
.main .feature .headline .list > li .body .sttl .summary {
  color: #60a332;
  background-color: #e7f1e0;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  padding: 0 0.4rem;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .list > li .body .sttl .summary {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
  }
}
.main .feature .headline .list > li .body .name {
  line-height: 1.4;
}
.main .feature .headline .list > li .body .name .green {
  color: #60a332;
}
.main .feature .headline .list > li .body .name strong {
  font-weight: 700;
  line-height: 1.2;
}
.main .feature .headline .dotlist {
  margin-top: 0.3rem;
}
.main .feature .headline .dotlist > li {
  position: relative;
  padding-left: 0.25rem;
  line-height: 1.7;
}
@media screen and (max-width: 750px) {
  .main .feature .headline .dotlist > li {
    font-size: 0.28rem;
  }
}
.main .feature .headline .dotlist > li::before {
  width: 0.16rem;
  height: 0.16rem;
  content: "";
  display: block;
  position: absolute;
  background-color: #60a332;
  border-radius: 0.6rem;
  top: 0.075rem;
  left: 0;
}
@media screen and (min-width: 751px) {
  .main .feature .headline .link {
    grid-column: 1/3;
  }
}
.main .feature .headline .movie {
  height: 3.24rem;
}
.main .feature .headline .movies {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.5rem;
  margin-top: 0.5rem;
}
@media screen and (min-width: 751px) {
  .main .feature .headline .movies {
    grid-column: 1/3;
  }
}
@media screen and (max-width: 750px) {
  .main .feature .headline .movies {
    grid-template-columns: repeat(1, 1fr);
    margin-top: 0.2rem;
    padding-bottom: 0.4rem;
  }
}
@media screen and (max-width: 750px) {
  .main .feature .headline .movie + * {
    margin-top: 0.2rem;
  }
}
.main .feature .headline .movie iframe {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0.2rem;
}
.main .feature .headline .movie span {
  display: block;
  text-align: center;
}
.main .package {
  overflow: hidden;
}
.main .package .ttl--01 {
  text-align: center;
  line-height: 1.8;
}
.main .package .ttl--01 span {
  display: block;
}
.main .package .ttl--02 {
  text-align: center;
  margin-top: 0.8rem;
}
@media screen and (max-width: 750px) {
  .main .package .ttl--02 {
    font-size: 0.36rem;
  }
}
.main .package .items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 0.3rem;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  .main .package .items {
    grid-template-columns: repeat(1, 1fr);
  }
}
.main .package .items-package {
  margin-top: 0.5rem;
  position: relative;
}
@media screen and (min-width: 751px) {
  .main .package .items-package {
    width: 10.8rem;
  }
}
.main .package .items-package::before, .main .package .items-package::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  aspect-ratio: 1/1;
}
.main .package .items-package::before {
  width: 1.5rem;
  top: 0;
  left: -2.5rem;
  box-shadow: inset 0 0 0 0.18rem rgba(113, 166, 48, 0.15);
}
.main .package .items-package::after {
  width: 1.7rem;
  bottom: -6.5rem;
  right: -2.5rem;
  box-shadow: inset 0 0 0 0.2rem #f9c0c4;
  opacity: 0.2;
}
@media screen and (max-width: 750px) {
  .main .package .items-package::after {
    content: none;
  }
}
.main .package .items-package .item {
  border-radius: 0.2rem;
  box-shadow: 0 0 0.4rem 0 rgba(0, 0, 0, 0.2);
}
.main .package .items-package .item .sttl {
  text-align: center;
  padding: 0.1rem;
  border-top-left-radius: 0.2rem;
  border-top-right-radius: 0.2rem;
  color: #FFF;
}
@media screen and (max-width: 750px) {
  .main .package .items-package .item .sttl {
    font-size: 0.36rem;
  }
}
.main .package .items-package .item:nth-child(1) .sttl {
  background: linear-gradient(90deg, rgb(0, 108, 72) 1%, rgb(43, 141, 108) 100%, rgb(224, 231, 239) 100%);
}
.main .package .items-package .item:nth-child(2) .sttl {
  background: linear-gradient(-90deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
}
.main .package .items-package .item:nth-child(3) .sttl {
  background: linear-gradient(90deg, rgb(245, 118, 124) 1%, rgb(246, 142, 148) 100%, rgb(224, 231, 239) 100%);
}
.main .package .items-package .item ul {
  padding: 0.4rem 0;
}
.main .package .items-package .item ul li {
  text-align: center;
  width: 100%;
}
@media screen and (max-width: 750px) {
  .main .package .items-package .item ul li {
    font-size: 0.28rem;
  }
}
@media screen and (min-width: 751px) {
  .main .package .items-package .item:nth-child(1) ul {
    margin-top: 0.3rem;
  }
}
.main .package .items-course {
  margin-top: 0.3rem;
}
.main .package .items-course .item {
  border-radius: 0.5rem;
  background-color: #e7f1e0;
  padding: 0.2rem 0.2rem 0.3rem;
  display: grid;
  grid-template-columns: 1.2rem auto;
  grid-gap: 0;
}
.main .package .items-course .item .icon {
  border-radius: 50%;
  background: linear-gradient(-90deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
  width: 1.2rem;
  height: 1.2rem;
  color: #FFF;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  line-height: 1.3;
  text-align: center;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 750px) {
  .main .package .items-course .item .icon {
    font-size: 0.2rem;
  }
}
.main .package .items-course .item .image {
  padding-top: 0.4rem;
}
.main .package .items-course .item:nth-child(3) .image {
  margin-left: -0.3rem;
}
.main .package .items-course .item .text {
  text-align: center;
  line-height: 1.6;
  margin-top: 0.3rem;
  grid-row: 2/3;
  grid-column: 1/3;
}
@media screen and (max-width: 750px) {
  .main .package .items-course .item .text {
    font-size: 0.28rem;
  }
}
.main .package .items-course .item .text span {
  color: #60a332;
}
.main .merit {
  margin-top: 1.3rem;
  position: relative;
  overflow: hidden;
  padding-bottom: 0.5rem;
}
@media screen and (max-width: 750px) {
  .main .merit {
    padding-bottom: 0.5rem;
  }
}
.main .merit::before, .main .merit::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
}
.main .merit::before {
  width: 1.6rem;
  height: 1.6rem;
  background-color: #94bf37;
  border-radius: 2.4rem;
  top: -2.3rem;
  left: -0.8rem;
}
.main .merit::after {
  width: 2.4rem;
  height: 2.4rem;
  background-color: #94bf37;
  border-radius: 3rem;
  top: 3.4rem;
  right: -1.2rem;
}
.main .merit .ttl--01 {
  text-align: center;
  line-height: 1.8;
}
.main .merit .ttl--02 {
  text-align: center;
  margin-top: 0.8rem;
  line-height: 1.66;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .merit .ttl--02 {
    font-size: 0.36rem;
  }
}
.main .merit .item {
  border-radius: 0.28rem;
  position: relative;
  background-color: #FFF;
  padding: 0.5rem;
}
.main .merit .items {
  display: grid;
  grid-template-columns: 4.4rem 4.4rem;
  gap: 0.3rem;
  justify-content: center;
  margin-top: 0.5rem;
  position: relative;
}
@media screen and (max-width: 750px) {
  .main .merit .items {
    grid-template-columns: repeat(1, 1fr);
  }
}
.main .merit .items::before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  aspect-ratio: 1/1;
  width: 1.5rem;
  top: 1rem;
  left: 0.5rem;
  box-shadow: inset 0 0 0 0.18rem rgba(113, 166, 48, 0.15);
}
.main .merit .item::before {
  background: linear-gradient(180deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  width: calc(100% + 0.06rem);
  height: calc(100% + 0.06rem);
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
  border-radius: 0.3rem;
  z-index: -1;
}
.main .merit .item .inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  height: 100%;
  align-content: center;
}
.main .merit .item .inner::before {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../../assets/imgs/check01.png);
  width: 0.38rem;
  height: 0.34rem;
  transform: translate(0, -50%);
  left: 0.2rem;
  top: 50%;
}
.main .merit .item .sttl {
  line-height: 1.6;
  margin-left: 0.2rem;
  font-weight: bold;
}
@media screen and (max-width: 750px) {
  .main .merit .item .sttl {
    font-size: 0.32rem;
    margin-left: 0.3rem;
  }
}
.main .merit .item .text {
  margin-top: 0.1rem;
  margin-left: 0.2rem;
  line-height: 1.6;
  font-weight: 500;
}
@media screen and (max-width: 750px) {
  .main .merit .item .text {
    font-size: 0.28rem;
    margin-left: 0.3rem;
  }
}
.main .merit .item-rows {
  display: grid;
  grid-template-columns: 3.15rem 3.7rem 4.05rem;
  gap: 0.3rem;
  justify-content: center;
  position: relative;
}
@media screen and (min-width: 751px) {
  .main .merit .item-rows {
    grid-row: 2/3;
    grid-column: 1/3;
  }
}
@media screen and (max-width: 750px) {
  .main .merit .item-rows {
    grid-template-columns: repeat(1, 1fr);
  }
}
.main .merit .item-rows::after {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../imgs/img15.png);
  width: 2.5rem;
  height: 1.5rem;
  right: -1rem;
  top: -1.5rem;
}
@media screen and (max-width: 750px) {
  .main .merit .item-rows::after {
    right: -0.2rem;
    width: 2rem;
    background-position: center bottom;
  }
}
.main .merit .link {
  margin-top: 0.5rem;
}
.main .merit .link .btn--site {
  color: #FFF;
  background: linear-gradient(-125deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
}
.main .merit .link .btn--site::after {
  background-image: url(../../assets/imgs/arrow01_g.svg);
  background-color: #FFF;
}
.main .price {
  margin-top: 1.3rem;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .main .price {
    margin-top: 1rem;
  }
}
.main .price::before, .main .price::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
}
.main .price::before {
  width: 2.4rem;
  height: 2.4rem;
  background-color: #49af6f;
  border-radius: 2.4rem;
  top: 4.35em;
  left: -1.2rem;
}
.main .price::after {
  width: 1.6rem;
  height: 1.6rem;
  background-color: #f9c0c4;
  border-radius: 3rem;
  bottom: -1.8rem;
  right: -0.8rem;
}
.main .price .table {
  border-radius: 0.2rem;
  background-color: rgb(255, 255, 255);
  box-shadow: 0 0 0.4rem 0 rgba(0, 0, 0, 0.15);
  padding: 0.3rem;
  margin: 0.5rem auto 0 auto;
  position: relative;
}
@media screen and (min-width: 751px) {
  .main .price .table {
    width: 7.4rem;
  }
}
.main .price .table::before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  aspect-ratio: 1/1;
  width: 1.5rem;
  top: -0.7rem;
  right: -0.7rem;
  box-shadow: inset 0 0 0 0.18rem rgba(249, 192, 196, 0.15);
}
.main .price .ttl--01 {
  text-align: center;
  line-height: 1.8;
}
.main .price .ttl--02 {
  text-align: center;
  border-radius: 0.05rem;
  background: linear-gradient(-90deg, rgb(148, 191, 55) 1%, rgb(96, 163, 50) 100%, rgb(224, 231, 239) 100%);
  color: #FFF;
  padding: 0.1rem;
  line-height: 1.6;
}
@media screen and (max-width: 750px) {
  .main .price .ttl--02 {
    font-size: 0.32rem;
  }
}
@media screen and (max-width: 750px) {
  .main .price .ttl--02 span {
    font-size: 0.28rem;
  }
}
.main .price .sttl--01 {
  margin-top: 0.3rem;
  text-align: center;
  color: #71a630;
}
.main .price .sttl--01 .num {
  font-family: "Poppins";
  font-weight: 600;
}
.main .price .text--01 {
  color: #71a630;
  text-align: center;
}
.main .price .text--01 .num {
  font-family: "Poppins";
  font-weight: 600;
  line-height: 1.2;
}
.main .price .text--02 {
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .price .text--02 {
    font-size: 0.25rem;
  }
}
.main .price .text--02 .num {
  font-family: "Poppins";
  font-weight: 600;
  line-height: 1.2;
}
@media screen and (max-width: 750px) {
  .main .price .text--02 .num {
    font-size: 0.28rem;
  }
}
.main .price .text--02 .green {
  color: #71a630;
}
.main .price .text--03 {
  letter-spacing: 0.05em;
}
@media screen and (max-width: 750px) {
  .main .price .text--03 {
    font-size: 0.25rem;
  }
}
.main .price .text--03 .num {
  font-family: "Poppins";
  font-weight: 600;
  line-height: 1.2;
}
@media screen and (max-width: 750px) {
  .main .price .text--03 .num {
    font-size: 0.28rem;
  }
}
.main .price .text--03 .green {
  color: #71a630;
}
@media screen and (max-width: 750px) {
  .main .price .text--04 {
    font-size: 0.28rem;
  }
}
.main .price .text--04 .border {
  border-bottom: 2px solid #71a630;
}
.main .price .text--04 .asterisk {
  font-size: 75%;
  position: relative;
  top: -0.1rem;
}
.main .price .detail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  margin-top: 0.2rem;
  padding-top: 0.2rem;
}
.main .price .detail::before {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  width: 3.8rem;
  height: 1px;
  transform: translate(-50%, 0);
  left: 50%;
  top: 0;
  background-color: #e5e5e5;
}
@media screen and (max-width: 750px) {
  .main .price .detail dt {
    font-size: 0.25rem;
  }
}
.main .price .detail dt .num {
  font-family: "Poppins";
  font-weight: 600;
  line-height: 1.2;
}
@media screen and (max-width: 750px) {
  .main .price .detail dt .num {
    font-size: 0.36rem;
  }
}
.main .price .detail dd {
  color: #71a630;
}
@media screen and (max-width: 750px) {
  .main .price .detail dd {
    font-size: 0.25rem;
  }
}
.main .price .detail dd .num {
  font-family: "Poppins";
  font-weight: 600;
  line-height: 1.2;
}
@media screen and (max-width: 750px) {
  .main .price .detail dd .num {
    font-size: 0.36rem;
  }
}
.main .price .catch {
  text-align: center;
  margin-top: 0.5rem;
}
.main .price .note {
  margin-top: 0.2rem;
}
@media screen and (max-width: 750px) {
  .main .price .note {
    font-size: 0.2rem;
  }
}
.main .faq {
  margin-top: 1.5rem;
  position: relative;
  overflow: hidden;
  padding-bottom: 1rem;
}
@media screen and (max-width: 750px) {
  .main .faq {
    padding-bottom: 0.5rem;
    margin-top: 1rem;
  }
}
.main .faq::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  width: 2.4rem;
  height: 2.4rem;
  background-color: #94bf37;
  border-radius: 3rem;
  bottom: 0.5rem;
  right: -1.2rem;
}
.main .faq .ttl {
  text-align: center;
  line-height: 1.8;
  padding-top: 0.3rem;
}
.main .faq .item {
  box-shadow: 0 0 0.4rem 0 rgba(0, 0, 0, 0.08);
  border-radius: 0.2rem;
}
.main .faq .items {
  position: relative;
  margin-top: 0.5rem;
}
@media screen and (min-width: 751px) {
  .main .faq .items {
    width: 10rem;
    margin: 0.5rem auto 0 auto;
  }
}
.main .faq .items::before, .main .faq .items::after {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
}
.main .faq .items::before {
  width: 1.5rem;
  top: 2rem;
  left: -3.5rem;
  box-shadow: inset 0 0 0 0.18rem rgba(113, 166, 48, 0.15);
  z-index: -1;
  border-radius: 50%;
  aspect-ratio: 1/1;
}
.main .faq .items::after {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../imgs/img16.png);
  width: 1.34rem;
  height: 1.23rem;
  left: 0.5rem;
  top: -1.23rem;
}
.main .faq .item + * {
  margin-top: 0.2rem;
}
.main .faq .item-ttl, .main .faq .item-text {
  position: relative;
}
.main .faq .item-ttl span, .main .faq .item-text span {
  color: #FFF;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 0.4rem;
  position: absolute;
  left: 0.4rem;
  top: 0.3rem;
  line-height: 0.6;
  font-family: "Poppins";
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.main .faq .item-ttl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  background-color: #FFF;
  line-height: 1.5;
  cursor: pointer;
  font-weight: bold;
  min-height: 1rem;
  border-radius: 0.2rem;
  padding: 0.2rem 1rem;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  .main .faq .item-ttl {
    font-size: 0.28rem;
  }
}
.main .faq .item-ttl:first-child {
  margin-top: 0;
}
.main .faq .item-ttl:before, .main .faq .item-ttl:after {
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  position: absolute;
  background-color: #60a332;
  transition: all 0.3s ease-out;
}
.main .faq .item-ttl:before {
  width: 0.24rem;
  height: 4px;
  right: 0.4rem;
}
.main .faq .item-ttl:after {
  width: 4px;
  height: 0.24rem;
  right: 0.5rem;
}
@media screen and (max-width: 750px) {
  .main .faq .item-ttl:after {
    right: 6.25vw;
  }
}
.main .faq .item-ttl span {
  background-color: #60a332;
  transition: all 0.5s 0s ease;
}
.main .faq .item.active {
  transition: background-color 0.5s 0s ease, color 0.5s 0s ease;
  background-color: #e7f1e0;
}
.main .faq .item.active .item-ttl {
  background-color: transparent;
}
.main .faq .item.active .item-ttl:after {
  transform: rotate(90deg);
}
.main .faq .item-text {
  display: none;
  padding: 0.1rem 1rem 0.2rem 1rem;
  line-height: 1.8;
}
@media screen and (max-width: 750px) {
  .main .faq .item-text {
    font-size: 0.25rem;
  }
}
.main .faq .item-text span {
  background-color: #FFF;
  top: 0.1rem;
  color: #60a332;
}
.main .faq .item.active .item-text {
  display: block;
}
.main .faq .dotlist {
  margin-top: 0.2rem;
}
.main .faq .dotlist > li {
  position: relative;
  padding-left: 0.2rem;
  line-height: 1.6;
}
.main .faq .dotlist > li::before {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  width: 0.12rem;
  height: 0.12rem;
  background-color: #000;
  border-radius: 0.12rem;
  left: 0;
  top: 0.075rem;
}
@media screen and (max-width: 750px) {
  .main .faq .dotlist > li::before {
    top: 0.125rem;
  }
}
.main .faq .dotlist + * {
  margin-top: 0.2rem;
}
.main .solution {
  margin: 1.4rem 0 -1rem;
  padding: 1rem 0;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .main .solution {
    padding: 0.6rem 0;
    margin: 0 0 -0.6rem;
  }
}
.main .solution .inner {
  padding: 0 0 1.8rem;
  background: #eb8a11;
  border-radius: 1.8rem;
  color: #fff;
  background: linear-gradient(180deg, rgb(123, 181, 52) 1%, rgb(113, 166, 48) 100%, rgb(224, 231, 239) 100%);
}
@media screen and (max-width: 750px) {
  .main .solution .inner {
    padding: 0 0 1rem;
    border-radius: 1rem;
  }
}
.main .solution .inner::before {
  content: "FREE TRIAL FREE TRIAL ";
  top: 4.1rem;
  color: rgba(255, 240, 221, 0.08);
}
.main .solution .ttl {
  padding: 1.26rem 0 0;
  position: relative;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .main .solution .ttl {
    padding: 1.2rem 0 0;
  }
}
.main .solution .ttl.scrollIn .balloon {
  transform: scale(1);
}
.main .solution .image {
  width: 7.2rem;
  margin: 1rem auto 0 auto;
}
.main .solution .lnav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 0.8rem;
  gap: 0.4rem;
}
@media screen and (max-width: 750px) {
  .main .solution .lnav {
    display: block;
  }
}
@media screen and (max-width: 750px) {
  .main .solution .lnav > li {
    text-align: center;
    font-size: 0.28rem;
  }
}
.main .solution .lnav > li a {
  position: relative;
}
.main .solution .lnav > li a.ext {
  padding-right: 0.25rem;
}
@media screen and (max-width: 750px) {
  .main .solution .lnav > li a.ext {
    padding-right: 0.35rem;
  }
}
.main .solution .lnav > li a.ext::after {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(../../assets/imgs/ico-ext_w.png);
  width: 0.18rem;
  aspect-ratio: 18/14;
  transform: translate(0, -45%);
  top: 50%;
  right: 0;
}
@media screen and (max-width: 750px) {
  .main .solution .lnav > li a.ext::after {
    width: 0.24rem;
    height: 0.22rem;
  }
}
.main .solution .lnav > li a.pdf {
  padding-right: 0.25rem;
}
@media screen and (max-width: 750px) {
  .main .solution .lnav > li a.pdf {
    padding-right: 0.35rem;
  }
}
.main .solution .lnav > li a.pdf::after {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  background: url(../../assets/imgs/ico-pdf.png) center/contain no-repeat;
  width: 0.15rem;
  aspect-ratio: 2.3/3;
  transform: translate(0, -40%);
  top: 50%;
  right: 0;
}
@media screen and (max-width: 750px) {
  .main .solution .lnav > li a.pdf::after {
    width: 0.2rem;
  }
}/*# sourceMappingURL=unique.css.map */