@charset "UTF-8";
/*
Theme Name: service-9
*/
/* service-9
------------------------------------------------------------------------*/
/*FV周り*/
.service-9 .page-header .inner::after {
  content: '';
  position: absolute;
  right: 0;
  top: 462px;
  display: block;
  width: 287px;
  height: auto;
  aspect-ratio: 287 / 210;
  background: url(../img/service-9/key.png) center / contain no-repeat;
  transform: translateY(-50%);
}

@media screen and (min-width: 751px) and (max-width: 1200px) {
  .service-9 .page-header .inner::after {
    width: 20vw;
  }
}
@media screen and (min-width: 751px) and (max-width: 1000px) {
  .service-9 .page-header .inner::after {
    width: 25vw;
  }
}
@media screen and (max-width: 750px) {
  .service-9 .page-header .inner::after {
    position: static;
    width: 51vw;
    margin: 6vw auto 0;
    transform: unset;
  }
}
/*WHAT'S LLMO*/
section.chat_base_contents {
  margin-top: 10rem;
}
.chat_base_contents p.bigen_white {
  font-family: "Outfit", sans-serif;
  font-weight: 500;
  color: #fff;
  font-size: 15rem;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
}
.chat_base_contents h2 {
  font-size: 4.2rem;
  text-align: center;
  line-height: 1.428;
  margin-top: -6rem;
}
.chat_base_contents h2 span.color {
  color: #e74921;
}
.chat_base_contents p.intro {
  font-size: 2rem;
  line-height: 2;
  text-align: center;
  margin-top: 2.4rem;
  margin-bottom: 7.4rem;
}
.chat_base_contents p.intro span.highlight {
  background: #fbe851;
  padding: 0.2rem 0rem 0.2rem 1.2rem;
}
@media screen and (min-width: 751px) and (max-width: 1000px) {
  .chat_base_contents p.bigen_white {
    font-size: 13rem;
  }
}
@media screen and (max-width: 750px) {
  .chat_base_contents p.bigen_white {
    font-size: min(90px, 19.6vw);
    line-height: 0.9 !important;
  }
  .chat_base_contents h2 {
    font-size: 24px;
    margin-top: -12rem;
  }
  section.chat_base_contents {
    margin-top: 32vw;
  }
  .chat_base_contents p.intro {
    line-height: 2;
    margin-top: 2.4rem;
    margin-bottom: 6rem;
    font-size: 14px;
    text-align: left;
    letter-spacing: -.4px;
  }
  .chat_base_contents p.intro span.highlight {
    padding: 0.1em;
  }
}
/*create future*/
.service-9 .leftrightflex-with-yellow-box p.bigen_white {
  text-align: center;
  font-size: 15rem;
}
@media screen and (max-width: 1500px) {
  .service-9 .leftrightflex-with-yellow-box p.bigen_white {
    font-size: 13rem;
  }
}
@media screen and (min-width: 751px) {
  .common.service-9 .leftrightflex-with-yellow-box {
    padding-top: 6.5rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .ttl-02 {
    padding-top: 0;
  }
  .common.service-9 .leftrightflex-with-yellow-box .ttl-02 h2 {
    font-size: 5.6rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .copy {
    margin-top: 3rem;
    margin-bottom: 1.5rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .cont-box-01.pc {
    margin: initial;
    width: 80%;
  }
  .common.service-9 .leftrightflex-with-yellow-box .read p {
    line-height: 2;
    letter-spacing: 0.035em;
  }
  .common.service-9 .leftrightflex-with-yellow-box .inner {
    gap: 0;
    margin-top: -2rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .inner .img {
    max-width: inherit;
    width: 52%;
    margin-top: -8rem;
    margin-right: 1rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .copy {
    width: inherit;
  }
  .common.service-9 .leftrightflex-with-yellow-box .read {
    width: inherit;
    width: 88%;
  }
}
@media screen and (max-width: 750px) {
  .common.service-9 .leftrightflex-with-yellow-box span.sp {
    font-size: 22.6vw;
  }
  .common.service-9 .leftrightflex-with-yellow-box .ttl-02 {
    padding-top: 0;
  }
  .common.service-9 .leftrightflex-with-yellow-box .copy {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
  .common.service-9 .leftrightflex-with-yellow-box .inner .img {
    width: 76%;
    left: 50%;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  .common.service-9 .leftrightflex-with-yellow-box .read p {
    padding-top: 2.5rem;
    letter-spacing: 0.03em;
  }
  .common.service-9 .leftrightflex-with-yellow-box {
    padding: 0;
    margin-top: 14px;
  }
	.common.service-9 .leftrightflex-with-yellow-box .ttl-02 h2 {
    margin-top: -5rem;
}
}
@media screen and (min-width: 751px) and (max-width: 1000px) {
  .common.service-9 .leftrightflex-with-yellow-box .ttl-02 h2 {
    font-size: 5em;
  }
  .common.service-9 .leftrightflex-with-yellow-box .cont-box-01.pc {
    width: 83%;
  }
}
/*EFFECT*/
.effect h4.lined-heading::before, .effect h4.lined-heading::after {
  width: 300px;
}
@media screen and (min-width: 751px) and (max-width: 1200px) {
  .effect h4.lined-heading::before, .effect h4.lined-heading::after {
    width: 240px;
  }
}
@media screen and (min-width: 751px) and (max-width: 1000px) {
  .effect h4.lined-heading::before, .effect h4.lined-heading::after {
    width: 180px;
  }
}
@media screen and (min-width: 751px) and (max-width: 900px) {
  .effect h4.lined-heading::before, .effect h4.lined-heading::after {
    width: 140px;
  }
}

.effect .normal_three_flex_inner h4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/*SERVICE*/
.service-9 .service_detail_inner ul::after {
  display: none;
}
.service-9 .service_detail .service_detail_inner ul::before {
  content: "";
  background: url(../img/service-2/service_detail_bg01.png) center center / contain no-repeat;
  width: 41.4rem;
  height: 39rem;
  position: absolute;
  top: -10.5rem;
  right: -18.4rem;
  z-index: -1;
  bottom: inherit;
}
/*VOICE*/
@media screen and (min-width: 751px) {
  .service-9 .voice-box {
    margin-top: 10.5rem;
  }
  .service-9 .voice-box .ttl-01 {
    text-align: center;
    margin-bottom: 4.5rem;
  }
  .voice_fuki p {
    text-align: center;
  }
}
@media screen and (max-width: 750px) {
  .service-9 .voice-box {
    margin-top: 44px;
  }
  .service-9 .voice_fuki p {
    text-align: center;
  }
}
/*SERVICE*/
@media screen and (min-width: 751px) {
  section.service_detail.service_detail_llmo {
    margin-top: 9.5rem;
  }
  section.service_detail.service_detail_llmo .service_detail_inner {
    margin-top: 9.8rem;
  }
}
.service-9 .service_detail .service_detail_inner ul::before {
  content: "";
  background: url(../img/service-9/service_detail_bg01.png) center center / contain no-repeat;
  width: 37.4rem;
  height: 34rem;
  position: absolute;
  top: -21.5rem;
  right: -20.4rem;
  z-index: -1;
  bottom: inherit;
}
@media screen and (max-width: 750px) {
  .service-9 .service_detail {
    padding-top: 12vw;
    padding-bottom: 12vw;
  }
  .service-9 .service_detail_inner {
    margin-top: 0px;
  }
  .service-9 .service_detail_llmo .ttl-01 {
    margin-bottom: 4vw;
  }
  .service-9 .service_detail .service_detail_inner ul::before {
    width: 27.4rem;
    height: 24rem;
    top: -12.5rem;
    right: -17.4rem;
  }
}
/*PLAN*/
.service-9 .plan-box .table-wrap::after {
  display: none;
}
.service-9 .plan-box .table-wrap::before {
  content: "";
  background: url(../img/service-9/reason_bg01.png) center center / contain no-repeat;
  width: 27.6rem;
  height: 27.1rem;
  position: absolute;
  top: -28rem;
  left: -22rem;
  z-index: -1;
}
.service-9 .reason-box.plan-box .ttl-01::before {
  display: none;
}
@media screen and (min-width: 751px) {
  .service-9 .reason-box.plan-box {
    padding: 11.3rem 0;
    margin-bottom: 6rem;
  }
  .service-9 .plan-box .plan-table {
    margin-top: 11rem;
  }
  .service-9 .plan-box .plan-table::before {
    top: -8rem;
    height: calc(100% + 19rem);
  }
  .service-9 .reason-box.plan-box .ttl-01 {
    padding-bottom: 1rem;
  }
  .service-9 .plan-box .reason-illust {
    top: -16.8rem;
  }
  .service-9 .plan-box .plan-table tbody th, .service-9 .plan-table tbody td {
    height: 80px;
  }
  .service-9 .plan-box .plan-table tbody tr:nth-of-type(even) th, .service-9 .plan-table tbody tr:nth-of-type(even) td {
    height: 80px;
  }
  .service-9 .plan-box .plan-table tbody th .plan-list-name {
    line-height: 1.5;
  }
}
@media screen and (max-width: 750px) {
  .service-9 .plan-box.reason-box .swipe-wrap {
    margin-top: -3rem;
  }
  .service-9 .plan-box.reason-box .table-wrap table th, .service-9 .reason-box .table-wrap table td {
    min-width: 188px;
  }
  .service-9 .plan-box .plan-table thead tr:first-of-type th:nth-of-type(2) {
    padding-top: inherit;
  }
  .service-9 .reason-box.plan-box .plan-table thead th.no-01 strong {
    font-size: 18px;
    transform: none;
  }
  .service-9 .plan-box.reason-box th.totalsupport {
    min-width: 218px !important;
  }
  .service-9 th.planname {
    height: 60px;
  }
  .plan-table .batumaru img.maru {
    width: 20px !important;
  }
  .plan-box .plan-table tbody tr:nth-of-type(even) th, .plan-box .plan-table tbody tr:nth-of-type(even) td {
    height: auto;
    padding: 17px 15px !important;
  }
  .plan-table .batumaru img.batu {
    width: 17px !important;
  }
  .service-9 .plan-box .plan-table tbody th, .service-9 .plan-table tbody td {
    height: 70px;
  }
  .service-9 .reason-box.plan-box {
    padding-top: 0 !important;
  }
  .service-9 .plan-box .attention_right {
    font-size: 11px;
    margin-top: 2px;
  }
  .service-9 .reason-box.plan-box {
    margin-bottom: 8rem;
  }
}
/*FLOW*/
@media screen and (min-width: 751px) {
  .service-9 .flow-box {
    padding: 10.2rem 0 0;
  }
  .service-9 .flow-box .flow-wrap .flow-slider::before {
    content: "";
    background: url(../img/service-9/flow_bg01.png) center center / cover no-repeat;
    width: 41.6rem;
    height: 39.1rem;
    position: absolute;
    top: -10.8rem;
    left: -20rem;
    z-index: -2;
  }
  .service-9 .flow-box .flow-wrap .flow-slider::after {
    content: "";
    background: url(../img/service-9/flow_bg02.png) center center / contain no-repeat;
    width: 26.5rem;
    height: 21.5rem;
    position: absolute;
    bottom: -7.2rem;
    right: -12.8rem;
    z-index: -1;
  }
  /*FAQ*/
  .service-9 .faq-box {
    padding: 9.5rem 0 12.4rem;
  }
}
@media screen and (max-width: 750px) {
  .effect h4.lined-heading::before, .effect h4.lined-heading::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 28px;
    height: 2px;
    background: #e74921;
    right: 0%;
    margin-right: 0px;
  }
}