@charset "UTF-8";

:root {
  --yel: #fff502;
  --beg1: #FDF1E5;
  --beg2: #f8f7f1;
  --beg3: #fdebc8;
  --pnk: #EA6392;
  --grn: #58BE4A;
  --blu: #23A8D9;
  --org: rgb(237, 108, 0);
  --wh: #FFFFFF;
  --bk: #333;
  --num: "Barlow", sans-serif;
}

/*=============== base ===========*/

html {
  font-size: 2.666vw;
}

body {
  background: var(--wh);
  color: var(--bk);
  font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "Droid Sans", sans-serif;
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1;
}

a {
  color: inherit;
  display: block;
  transition: all 0.3s ease;
}

a:hover {
  opacity: 0.7;
}

.pc-only {
  display: none;
}

.sp-only {
  display: block;
}

.container {
  margin: 0 4%;
}

img {
  height: auto;
  max-width: 100%;
}

em {
  font-style: normal;
}

main {
  overflow: hidden;
}

/*  ----------------------------------------------------------

fade

----------------------------------------------------------  */

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadeInUp {
  animation: fadeInUp 0.6s ease;
  animation-fill-mode: both;
}

.fade {
  opacity: 0;
}

/*=============== footer ===========*/

.footer {
  background: var(--beg2);
  margin: -5rem 0 0;
  padding: 9rem 0 7rem;
  position: relative;
}

.footer_logo {
  margin: 0 auto 6rem;
  width: 31.5rem;
}

.footer_link {
  font-size: 1.8rem;
  font-weight: 400;
  letter-spacing: 0;
  text-align: center;
  background: var(--blu);
  overflow: hidden;
  position: relative;
  z-index: 1;
  align-items: center;
  border: 3px solid #fff;
  border-radius: 10rem;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 6px;
  color: #fff;
display: flex;
  justify-content: center;
  max-width: 320px;
  min-height: 70px;
  margin: 0 auto;
  margin-bottom: 6rem;
}

.footer_link::before {
  content: "";
  background-image: url(../img/mail_icon.png);
  width: 32px;
  height: 23px;
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  background-color: transparent;
}

.footer_link::after {
  background: #fff;
  content: "";
  height: 3px;
  position: absolute;
  right: 0;
  top: 50%;
  width: 2rem;
}






.footer_copyright {
  background: var(--bk);
  color: #fff;
  display: block;
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 3rem;
  line-height: 3rem;
  text-align: center;
}

.pagetop {
  background: var(--bk);
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  color: #fff;
  font-size: 1.5rem;
  height: 5.7rem;
  letter-spacing: 0.1em;
  margin: 0 auto -0.5rem;
  padding-top: 0.5rem;
  text-align: center;
  width: 11rem;
}

.pagetop span {
  display: block;
  margin: 0 auto 1rem;
  width: 1.3rem;
}

/*=============== header ===========*/

.header {
  background: #fff;
  height: 5rem;
  position: relative;
  width: 100%;
  z-index: 20;
}

.header_container {
  align-items: center;
  display: flex;
  height: 100%;
}

.header_logo {
  height: auto;
  margin-left: 1.5rem;
  width: 15.3rem;
}

.header_btn {
  display: none;
}

.header_btn .com-btn {
  font-size: 1.8rem;
  height: 6rem;
  width: 45rem;
}


/*=============== gnav ===========*/

.gnav {
  background: #fff;
  height: 100vh;
  overflow-y: scroll;
  padding: 6.5rem 1.5rem 10rem 3rem;
  position: fixed;
  right: 0;
  top: 0;
  transform: translateX(100%);
  transition: all 0.35s ease-in-out;
  width: 30.9rem;
  z-index: 100;
}

.gnav.active {
  display: block;
  transform: translateX(0);
}

.gnav_list {
  margin-bottom: 2rem;
}

.gnav_item {
  background-image: linear-gradient(to right, var(--org) 2px, transparent 2px);
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 9px 2px;
  font-size: 1.5rem;
  font-weight: 500;
  padding: 1.5rem 0;
}

/*=============== navbtn ===========*/

.navbtn {
  align-items: center;
  aspect-ratio: 1/1;
  background: var(--org);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  position: fixed;
  right: 1.5rem;
  top: 1.5rem;
  width: 5rem;
  z-index: 999;
}

.navbtn_line {
  background-color: #fff;
  border-radius: 10rem;
  display: block;
  height: 2px;
  position: relative;
  transition: all 0.5s;
  width: 1.8rem;
}

.navbtn_line::after,
.navbtn_line::before {
  background-color: #fff;
  border-radius: 10rem;
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  transition: all 0.5s;
  width: 1.8rem;
}

.navbtn_line:before {
  top: -0.8rem;
}

.navbtn_line:after {
  top: 0.8rem;
}

.navbtn[aria-expanded=true] .navbtn_line:before {
  top: 0;
  transform: translate(0.9rem, 0) rotate(45deg);
  transform-origin: right center;
  width: 50%;
}

.navbtn[aria-expanded=true] .navbtn_line:after {
  top: 0;
  transform: translate(0.9rem, 0) rotate(-45deg);
  transform-origin: right center;
  width: 50%;
}

/*=============== gnav_link ===========*/

.gnav_link {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;

}

/* .gnav_link li:first-of-type {
  margin-bottom: 2rem;
  width: 100%;
} */

/* .gnav_link li:not(:first-of-type) {
  width: 48.5%;
} */
 .gnav_link li{
  width: 48.5%;
}
.gnav_link li:last-of-type {
  margin-top: 1rem;
  width: 100%;
  position: relative;
}
.gnav_link li:last-of-type ::before{
  content: "";
  background-image: url(../img/mail_icon.png);
  width: 29px;
  height: 21px;
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  background-color: transparent;
}


.gnav_link .com-btn {
  height: 5rem;
  width: 27rem;
}

.gnav_link .com-btn:after {
  height: 2px;
  width: 2.3rem;
}

.gnav_link .com-btn p {
  font-size: 1rem;
  letter-spacing: 0.05em;
  line-height: 1.42;
  text-align: center;
  margin-left: 18px;
}
/*.gnav_link .com-btn p {
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  line-height: 1.42;
  text-align: center;
  margin-left: 18px;
}*/
.gnav_icn {
  aspect-ratio: 132 / 70;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--wh);
  border-radius: 0.8rem;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 3px 6px;
  color: #fff;
  display: flex;
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  line-height: 1.2;
  position: relative;
  text-align: center;

}

.gnav_icn-grn {
  background: var(--grn);
}

.gnav_icn-pnk {
  background: var(--pnk);
}

.gnav_icn::after {
  background: url(../img/icn-tri.png) no-repeat center center/contain;
  bottom: 0.5rem;
  content: "";
  display: block;
  height: 1rem;
  position: absolute;
  right: 0.5rem;
  width: 1rem;
}

/*=============== com-btn ===========*/

.com-btn {
  align-items: center;
  border: 3px solid #fff;
  border-radius: 10rem;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 6px;
  color: #fff;
  display: flex;
  justify-content: center;
}

.com-btn.slide {
  background: var(--org);
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.com-btn span {
  color: var(--yel) !important;
}

.com-btn::after {
  background: #fff;
  content: "";
  height: 3px;
  position: absolute;
  right: 0;
  top: 50%;
  width: 2rem;
}

.com-btn.slide::before {
  background-color: #fff;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: 0.3s cubic-bezier(0.45, 0, 0.55, 1);
  width: 100%;
  z-index: -1;
}

/* .com-btn:hover {
  border-color: var(--blu);
  color: var(--blu);
  opacity: 1;
}

.com-btn:hover span {
  color: var(--org) !important;
}

.com-btn:hover::after {
  background: var(--blu);
}

.com-btn:hover::before {
  transform: scale(1, 1);
} */

.cta_txt1 {
  align-items: center;
  display: flex;
  font-size: 1.5rem;
  gap: 0.7rem;
  justify-content: center;
  letter-spacing: 0.05em;
  line-height: 1.4;
  /* margin-bottom: 1rem; */
  position: relative;
  text-align: center;
  text-shadow: 0px 0px 3px #fff;
  position: relative;
  bottom: -20px;
}

.cta_txt1::before {
  aspect-ratio: 66/81;
  background: url(../img/cta-deco-l_sp.png) no-repeat center center/contain;
  content: "";
  width: 3rem;
}

.cta_txt1::after {
  aspect-ratio: 66/81;
  background: url(../img/cta-deco-r_sp.png) no-repeat center center/contain;
  content: "";
  width: 3rem;
}

.cta .com-btn {
  font-size: 2.0rem;
  height: 6rem;
  letter-spacing: 0.05em;
  margin: 0 auto;
  max-width: 50rem;
  width: 100%;
}

.cta .com-btn::after {
  height: 2px;
  width: 2.6rem;
}

.cta_banner {
  align-items: flex-end;
  display: flex;
  justify-content: space-between;
  margin: 0.6rem 0 4rem;
}

.cta_banner li {
  width: 50%;
}

.cta_present {
  align-items: center;
  background: var(--wh);
  border-radius: 1rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 1rem 1.8rem;
  position: relative;
}

.cta_balloon {
  aspect-ratio: 300/47;
  margin: -2rem auto 0.7rem;
  width: 30rem;
}

.cta_body {
  width: 64%;
}

.cta_txt3 {
  background: linear-gradient(transparent 40%, var(--yel) 40%);
  display: inline;
  font-size: 1.2rem;
  letter-spacing: 0;
  line-height: 1.67;
  margin-bottom: 1rem;
}

.cta_txt4 {
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  line-height: 1.47;
}

.cta_img2 {
  width: 33%;
}

.tblscroll {
  margin-top: 2rem;
  overflow-x: scroll;
  white-space: nowrap;
}

.tbl {
  background: var(--wh);
  border-bottom: 1px solid var(--bk);
  border-collapse: separate;
  border-radius: 10px;
  border-spacing: 0;
  font-size: 1.5rem;
  width: 100%;
}

.tbl th,
.tbl td {
  border-left: 1px solid var(--bk);
  border-top: 1px solid var(--bk);
  line-height: 1.2;
  text-align: center;
  vertical-align: middle;
}

.tbl thead th:first-of-type {
  border: none;
}

.tbl thead th:nth-of-type(2) {
  border-top-left-radius: 10px;
}

.tbl tbody th {
  background: #E9E7DF;
}

.tbl tbody tr:first-of-type th {
  border-top-left-radius: 10px;
}

.tbl tbody tr:last-of-type th {
  border-bottom-left-radius: 10px;
}

.tbl tbody tr:last-of-type td:last-of-type {
  border-bottom-right-radius: 10px;
}

.tbl--service {
  font-weight: 500;
  margin: 0 1.5rem 2rem;
  min-width: 70rem;
  width: 100%;
}

.tbl--service tbody th {
  font-weight: 500;
  line-height: 1.4;
  padding: 0.8rem 0;
  width: 18rem;
}

.tbl--service thead th:nth-of-type(2),
.tbl--service thead th:nth-of-type(3),
.tbl--service thead th:nth-of-type(4) {
  background: var(--beg2);
  font-weight: 500;
  width: 10rem;
}

.tbl--service thead th:last-of-type {
  background: var(--org);
  border: 1px solid var(--org);
  border-top-right-radius: 10px;
  color: #fff;
  height: 5.8rem;
  width: 17.7rem;
}

.tbl--service tbody tr td:last-of-type {
  border-left: 5px solid var(--org);
  border-right: 5px solid var(--org);
  color: var(--org);
  font-size: 1.9rem;
  font-weight: 700;
}

.tbl--service tbody tr td:last-of-type.en {
  font-size: 2.2rem;
}

.tbl--service tbody tr:last-of-type td:last-of-type {
  border-bottom: 5px solid var(--org);
  border-bottom-right-radius: 10px;
}

.tbl--service td.en {
  font-size: 2.2rem;
}

.tbl--service td.bts {
  font-size: 2.8rem;
}

.tbl--details {
  border-right: 1px solid var(--bk);
  margin: 0 1rem 1.5rem;
  min-width: 53rem;
  width: 100%;
}

.tbl--details thead th:not(:first-of-type) {
  font-size: 1.8rem;
  height: 7.4rem;
  width: 20rem;
}

.tbl--details thead th:nth-of-type(2) {
  background: var(--org);
  color: #fff;
}

.tbl--details thead th:nth-of-type(3) {
  background: var(--beg1);
  border-top-right-radius: 1rem;
  color: var(--org);
}

.tbl--details tbody th {
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  padding: 1.2rem 0;
  width: 8rem;
}

.tbl--details td {
  font-size: 1.7rem;
}

.tbl--details td.sm {
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  padding: 1.2rem 0;
  white-space: nowrap;
}

/*=============== head ===========*/

.head {
  position: relative;
}

.head_inner {
  position: relative;
  z-index: 5;
}

.head_sub {
  background: url(../img/head-line_sp.png) no-repeat center bottom/100% 0.8rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.44;
  margin: 0 auto;
  margin-bottom: 1.2rem;
  max-width: 50rem;
  padding-bottom: 1.5rem;
  text-align: center;
  width: 34.5rem;
}

.head--merit .head_sub {
  width: 31.5rem;
}

.head_ttl {
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  line-height: 1.44;
  text-align: center;
  white-space: nowrap;
}

.head_ttl span {
  color: var(--blu);
}

.head_ttl em {
  font-size: 2.5rem;
  letter-spacing: 0.08em;
}

.head_deco {
  text-align: center;
}

.head_deco span {
  display: inline-block;
  height: 0.5rem;
  width: 0.5rem;
}

.head_deco span:nth-of-type(even) {
  background-color: var(--blu);
  margin: 0 1.4rem;
}

.head_deco span:nth-of-type(odd) {
  background-color: var(--org);
}

.head::before {
  bottom: -30%;
  font-size: 7rem;
  left: 0;
  letter-spacing: -0.05em;
  position: absolute;
  text-align: center;
  white-space: nowrap;
  width: 100%;
  z-index: 0;
}

.head--problem::before {
  color: rgba(255, 255, 255, 0.2);
  content: "PROBLEMS";
  height: 100%;
}

.head--about::before {
  bottom: 0;
  color: rgba(248, 247, 241, 0.5);
  content: "ABOUT US";
}

.head--feature::before {
  color: rgba(248, 247, 241, 0.5);
  content: "FEATURES";
  height: 100%;
}

.head--service::before {
  color: rgba(248, 247, 241, 0.5);
  content: "SERVICE";
  height: 100%;
}

.head--voice::before {
  color: rgba(233, 231, 223, 0.3);
  content: "VOICES";
  height: 100%;
}

.head--foryou::before {
  color: rgba(248, 247, 241, 0.5);
  content: "FOR YOU";
  height: 100%;
}

.head--flow::before {
  bottom: 0;
  color: rgba(248, 247, 241, 0.5);
  content: "FLOW";
}

.head--faq::before {
  bottom: 0;
  color: rgba(233, 231, 223, 0.3);
  content: "FAQ";
}

.head--merit::before {
  bottom: 0;
  color: rgba(237, 108, 0, 0.05);
  content: "MERITS";
}

.head--details::before {
  bottom: 0;
  color: rgba(248, 247, 241, 0.5);
  content: "DETAILS";
}

.slider {
  margin: 0 auto;
  width: 33rem;
}

.slider_item {
  aspect-ratio: 315/515;
  background: var(--wh);
  background: url(../img/slider-bg_sp.png) no-repeat center/contain;
  margin: 0 auto;
  padding: 2.5rem 2.5rem 2rem;
  position: relative;
  width: 33rem;
}

.slider_head {
  margin-bottom: 2rem;
  padding-left: 9rem;
  position: relative;
}

.slider_img {
  bottom: -0.5rem;
  left: 0rem;
  position: absolute;
  width: 6.9rem;
}

.slider_job {
  background: var(--org);
  border-radius: 10rem;
  color: var(--wh);
  font-size: 1.4rem;
  margin-bottom: 1rem;
  padding: 0.2rem 0;
  text-align: center;
  width: 14.7rem;
}

.slider_name {
  font-size: 1.4rem;
  margin-bottom: 1rem;
}

.slider_ttl {
  align-items: center;
  background: #FFDBBE;
  border-radius: 0.7rem;
  display: flex;
  font-size: 1.8rem;
  height: 6.5rem;
  letter-spacing: 0;
  line-height: 1.33;
  margin-bottom: 1rem;
  padding-left: 1rem;
}

.slider_body {
  height: 31rem;
  overflow-y: auto;
  padding: 2rem 0 0;
  scrollbar-color: #f8f7f1 auto;
}

.slider_body::-webkit-scrollbar-thumb {
  background-color: #f8f7f1;
}

.slider_txt {
  font-size: 1.7rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.65;
  margin-bottom: 1.5em;
}

.slider_txt span {
  color: var(--org);
  font-weight: 500;
}

.slider .slick-slide {
  aspect-ratio: 315/520;
  overflow: hidden;
  width: 33rem;
}

.slider_arrow {
  display: block;
  height: auto;
  position: absolute;
  top: 45%;
  width: 3.8rem;
}

.slider_prev {
  left: -1rem;
  z-index: 1;
}

.slider_next {
  right: -1rem;
  z-index: 1;
}

.slider .slick-dots {
  bottom: 0;
}

.slider .slick-dots li {
  height: 12px;
  margin: 0 10px;
  width: 12px;
}

.slider .slick-dots li button:before {
  background: #E9E7DF;
  border: 1px solid #E9E7DF;
  border-radius: 50%;
  bottom: 0;
  content: "";
  height: 12px;
  left: 0;
  margin: auto;
  opacity: 1;
  right: 0;
  top: 0;
  width: 12px;
}

.slider .slick-dots li.slick-active button:before {
  background: var(--org);
  border: 1px solid var(--org);
  height: 12px;
  width: 12px;
}

/*=============== accordion ===========*/

.acc {
  margin-top: 5rem;
}

.acc_item {
  background: var(--wh);
  border-radius: 0.5rem;
  margin-bottom: 1.2rem;
}

.acc_btn {
  align-items: center;
  border-radius: 0.5rem;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding: 2rem 1.5rem;
  position: relative;
  transition: 0.3s;
}

.acc_btn::after {
  background: url(../img/icn-acc.png) no-repeat center center/contain;
  content: "";
  height: 1.1rem;
  transition: 0.3s;
  width: 1.2rem;
}

.acc_btn.open::after {
  transform: rotate(180deg);
}

.acc_inner1 {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: left;
}

.acc_inner2 {
  align-items: flex-start;
  background-image: linear-gradient(to right, var(--org) 2px, transparent 2px);
  background-repeat: repeat-x;
  background-size: 9px 2px;
  display: flex;
  gap: 2rem;
  justify-content: left;
  padding-top: 2rem;
}

.acc_inner2-center {
  align-items: center;
}

.acc_icn {
  height: auto;
  width: 2.5rem;
}

.acc_text1 {
  font-size: 1.8rem;
  letter-spacing: 0.05em;
  line-height: 1.44;
}

.acc_text2 {
  flex: 1;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.47;
}

.acc_text2 span {
  color: var(--org);
  font-weight: 500;
}

.acc_text2 strong {
  font-size: 1.4rem;
  font-weight: 400;
}

.acc_text2 .com-btn {
  height: 4.3rem;
  width: 30rem;
}

.acc_content {
  display: none;
  padding: 1rem 1.5rem 1.8rem;
}
.acc_text2 .com-btn{
  position: relative;
  min-height: 55px;
  margin-top: 20px;
}

.acc_text2 .com-btn::before {
  content: "";
  background-image: url(../img/mail_icon.png);
  width: 22px;
  height: 16px;
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  background-color: transparent;
}


/*=============== fixedbtn ===========*/

.fixedbtn-pc {
  display: none;
}

.fixedbtn-pc_item {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  color: var(--wh);
  height: 14rem;
  padding: 1rem;
  width: 14.3rem;
}

.fixedbtn-pc_item:nth-of-type(1) {
  background-image: url(../img/icn-doc.png);
  font-size: 1.8rem;
  letter-spacing: 0.05em;
  line-height: 1.28;
}

.fixedbtn-pc_item:nth-of-type(2) {
  background-image: url(../img/icn-video.png);
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  line-height: 1.25;
}

.fixedbtn-pc_item a {
  align-items: flex-end;
  display: block;
  display: flex;
  height: 100%;
  justify-content: center;
  text-align: center;
  width: 100%;
}

.fixedbtn-pc_item:hover {
  filter: opacity(0.7);
}

.fixedbtn-sp {
  background: var(--wh);
  bottom: 0;
  display: none;
  left: 0;
  position: fixed;
  transition: all 0.3s ease-in-out;
  width: 100%;
  z-index: 50;
}

.fixedbtn-sp_wrap {
  display: flex;
  justify-content: space-between;
}

.fixedbtn-sp_item {
  color: var(--wh);
  font-size: 1.6rem;
  height: 6.6rem;
  letter-spacing: 0.03em;
  line-height: 1.5;
  padding: 1rem 0;
  position: relative;
  text-align: center;
}

.fixedbtn-sp_item span {
  color: var(--yel);
}

.fixedbtn-sp_item::after {
  background: url(../img/icn-tri.png) no-repeat center center/contain;
  bottom: 0.4rem;
  content: "";
  display: block;
  height: 0.8rem;
  position: absolute;
  right: 0.7rem;
  width: 0.8rem;
}

.fixedbtn-sp_item:nth-of-type(1) {
  background: var(--grn);
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}


/* .fixedbtn-sp_item:nth-of-type(1)::before {
  content: "";
  background-image: url(../img/mail_icon.png);
  width: 26px;
  height: 18px;
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;

  background-color: transparent;
}
 */

.fixedbtn-sp_item:nth-of-type(2) {
  background: var(--pnk);
  width: 50%;
}


/*=============== first view ===========*/

.fv {
  background: url(../img/fv-bg-l_sp.jpg) no-repeat center top/100% auto;
  margin-top: -5rem;
  padding: 5rem 0 3rem;
  position: relative;
}

.fv::after {
  background-color: rgba(248, 247, 241, 0.65);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}

.fv .container {
  position: relative;
  z-index: 1;
}

.fv_txt01 {
  align-items: center;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #fff 9%, #fff 51%, #fff 91%, rgba(255, 255, 255, 0) 100%);
  display: flex;
  font-size: 1.5rem;
  font-weight: 500;
  height: 2.5rem;
  justify-content: center;
  letter-spacing: 0;
  margin: 1.5rem auto 1rem;
  width: 32rem;
}

.fv_txt01 span {
  color: var(--blu);
  font-weight: 700;
}

.fv_txt02 {
  background: url(../img/underline_sp.png) no-repeat center bottom/100% auto;
  font-size: 1.0rem;
  letter-spacing: 0;
  margin: 0 auto;
  margin-bottom: 0.8rem;
  padding: 0 0.5rem 1.5rem 0.5rem;
  width: -moz-max-content;
  width: max-content;
}

.fv_txt02 em {
  font-size: 2rem;
}

.fv_ttl {
  font-size: 1.5rem;
  letter-spacing: 0;
  text-align: center;
}

.fv_ttl span {
  background: var(--blu);
  border-radius: 0.5rem;
  color: var(--wh);
  font-size: 1.5rem;
  padding: 0.5rem;
}

.fv_ttl span em {
  font-size: 1.5rem;
  letter-spacing: normal;
}

.fv_ttl span ruby rt {
  color: var(--yel);
}

.fv_ttl img {
  display: block;
  margin: 1.5rem auto 0 auto;
  max-width: 50rem;
  width: 97%;
}

.fv_list {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  margin: -1rem 0 0.8rem;
}

.fv_item {
  width: 31.6%;
}

.fv_bg {
  aspect-ratio: 109/107;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
  padding: 2rem 0;
  width: 100%;
}

.fv_bg--01 {
  background-image: url(../img/fv-point-01_sp.png);
}

.fv_bg--02 {
  background-image: url(../img/fv-point-02_sp.png);
}

.fv_bg--03 {
  background-image: url(../img/fv-point-03_sp.png);
}

.fv_catch {
  display: block;
  font-size: 1.4rem;
  letter-spacing: 0;
  line-height: 1.43;
  position: relative;
  text-align: center;
}

.fv_catch-mark::after {
  color: var(--bk);
  content: "※2";
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  position: absolute;
  top: 0;
}

.fv_inner {
  align-items: flex-end;
  display: flex;
  gap: 0.4rem;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.fv_inner--center {
  margin-top: 0.3rem;
}

.fv_circle {
  align-items: center;
  aspect-ratio: 1/1;
  background: var(--org);
  border-radius: 10rem;
  color: #fff;
  display: flex;
  font-size: 1rem;
  justify-content: center;
  line-height: 1.1;
  width: 3rem;
}

.fv_em {
  color: var(--org);
}

.fv_em--01 {
  font-family: var(--num);
  font-size: 2.1rem;
  font-weight: 900;
  position: relative;
}

.fv_em--01 span {
  font-size: 3.9rem;
}

.fv_em--01::after {
  color: var(--bk);
  content: "※1";
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  position: absolute;
  right: -0.5rem;
  top: 0;
}

.fv_em--02 {
  font-size: 1.8rem;
  font-weight: 900;
  letter-spacing: 0.05em;
}

.fv_em--02 span {
  font-family: var(--num);
  font-size: 3.9rem;
  font-weight: 700;
}

.fv_em--03 {
  font-size: 2.5rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.fv_notes {
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.5;
  text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, -1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
  white-space: nowrap;
}

/*=============== problem ===========*/

.problem {
  background: #EAE7DF;
  padding: 5.5rem 0 0;
}

.problem_img {
  height: auto;
  margin: 2.2rem auto 0;
  width: 21.6rem;
}

.problem_body {
  background: var(--wh);
  border-radius: 1.5rem;
  padding: 1.6rem 1rem 1.8rem 2.2rem;
}

.problem_item {
  background: url(../img/icn-check.png) no-repeat left top 0.6rem/2rem auto;
  font-size: 1.7rem;
  letter-spacing: 0.08em;
  line-height: 1.47;
  margin-bottom: 0.5rem;
  padding: 0.2rem 0 0.2rem 3rem;
}

.problem_item span {
  color: var(--blu);
}

.problem_item:last-of-type {
  margin-bottom: 0;
}

.problem_arrow {
  margin: 1.5rem auto 0;
  width: 3rem;
}

.problem_txt {
  font-size: 1.7rem;
  margin-bottom: 10rem;
  text-align: center;
}

.problem_txt .wrap {
  align-items: center;
  display: flex;
  gap: 0.1em;
  justify-content: center;
}

.problem_txt .img {
  width: 20.4rem;
}

.problem_txt em {
  background: linear-gradient(transparent 60%, var(--yel) 60%);
  color: var(--org);
  font-size: 2.2rem;
}

/*=============== about ===========*/

.about {
  background: url(../img/problem-bg_l_sp.png) no-repeat center top/100% 14rem;
  overflow: hidden;
  padding-top: 0.5rem;
}

.about_wrap {
  margin: 2.5rem 10% 0 calc(50% - 50vw);
}

.about_body {
  background: var(--beg2);
  border-bottom-left-radius: 1.5rem;
  margin: -5rem calc(50% - 50vw) 0 0;
  padding: 6.5rem calc(4% + 1.5rem) 4rem 1.5rem;
}

.about_txt {
  color: #000;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.76;
}

.about_txt span {
  color: var(--org);
  font-weight: 700;
}

.about_txt .sp-margin {
  display: block;
  margin-bottom: 3rem;
}

/*=============== feature ===========*/

.feature {
  background: url(../img/feature-bg.png) no-repeat center bottom/100% 20rem;
  padding: 6.5rem 0 5rem;
}

.feature_list {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem 0;
  justify-content: space-between;
  margin-top: 2rem;
}

.feature_item {
  width: 49%;
}

.feature_topics {
  background: var(--beg2);
  padding-bottom: 5rem;
}

.topic {
  margin-bottom: 5rem;
  position: relative;
}

.topic:nth-of-type(odd) {
  padding-top: 5rem;
}

.topic_wrap {
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: auto auto auto;
}

.topic_head {
  grid-column: 1/2;
  grid-row: 1/2;
}

.topic_body {
  grid-column: 1/2;
  grid-row: 3/4;
}

.topic_img {
  grid-column: 1/2;
  grid-row: 2/3;
  margin-bottom: 2rem;
}

.topic_head {
  align-items: flex-start;
  display: flex;
  gap: 1.5rem;
  justify-content: left;
  margin-bottom: 1rem;
}

.topic:nth-of-type(even) .topic_head {
  flex-direction: row-reverse;
  padding: 0;
}

.topic_no {
  width: 5.5rem;
}

.topic_no:before {
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  height: 3.5rem;
  position: absolute;
  width: 14rem;
}

.topic:nth-of-type(odd) .topic_no::before {
  background-image: url(../img/feature-deco-pnk.png);
  background-position: right center;
  left: 0;
  top: 0;
}

.topic:nth-of-type(even) .topic_no::before {
  background-image: url(../img/feature-deco-grn.png);
  background-position: left center;
  right: 0;
  top: 1.8rem;
}

.topic_ttl {
  flex: 1;
  margin-top: -0.8rem;
}

.topic_ttl span:first-of-type {
  display: inline-block;
  font-size: 1.8rem;
  line-height: 1.44;
}

.topic_ttl span:last-of-type {
  color: var(--org);
  font-size: 2.3rem;
  line-height: 1.44;
}

.topic:nth-of-type(even) .topic_ttl span:last-of-type {
  color: var(--blu);
}

.topic_txt {
  font-size: 1.8rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.67;
  margin-bottom: 3rem;
  padding: 0 1.5rem;
}

.topic_txt:last-of-type {
  margin-bottom: 0;
}

.topic_txt span {
  color: var(--org);
  font-weight: 700;
}

.topic:nth-of-type(even) .topic_txt span {
  color: var(--blu);
}

.topic_bg {
  background: var(--wh);
  border-radius: 3rem;
  margin: 0 calc(50% - 50vw);
  padding: 7rem 4% 5rem;
}

.topic_inner {
  margin-top: 3rem;
}

.topic_videottl {
  background: var(--wh);
  border-radius: 10rem;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1.24;
  margin: 0 auto 1.6rem;
  padding: 0.5rem 0;
  text-align: center;
  width: 27.5rem;
}

.topic_inner--gry .topic_videottl {
  border: 3px solid #e8e7dc;
}

.topic_inner--blu .topic_videottl {
  border: 3px solid #eaf4f7;
}

.topic_video {
  aspect-ratio: 16/9;
  display: block;
  height: auto;
  margin: 0 auto;
  width: 100%;
}

/*=============== service ===========*/

.service {
  background-image: url(../img/service-deco1_sp.png), url(../img/service-deco2_sp.png);
  background-position: right top, left 1rem bottom 10rem;
  background-repeat: no-repeat, no-repeat;
  background-size: 16.6rem auto, 20.4rem auto;
  padding: 4.8rem 0 15rem;
  position: relative;
}

.service_arrow {
  height: auto;
  margin: 0 auto 2rem;
  width: 4.3rem;
}

.service_inner {
  align-items: center;
  aspect-ratio: 320/158;
  background: url(../img/service-bg_sp.png) no-repeat center top/100% auto;
  display: flex;
  justify-content: center;
  margin: 0 auto;
  position: relative;
  width: 33rem;
}

.service_txt1 {
  color: #000;
  font-size: 1.7rem;
  line-height: 1.5;
  text-align: center;
}

.service_txt1 span {
  display: block;
  font-size: 2.2rem;
}

.service_txt2 {
  background: linear-gradient(transparent 60%, var(--yel) 60%);
  color: #000;
  font-size: 2.1rem;
  margin: 0 -2rem 0 auto;
  width: -moz-max-content;
  width: max-content;
}

.service_txt2 span {
  color: var(--org);
  font-size: 4rem;
  letter-spacing: normal;
}

.service_txt2 small {
  font-size: 1.7rem;
}

.service_txt3 {
  color: #000;
  font-size: 1.3rem;
  font-weight: 400;
  margin-top: 3rem;
  text-align: center;
}

.service_img {
  bottom: -1.5rem;
  left: 1rem;
  position: absolute;
  width: 8.3rem;
}

.service_body.pc-only {
  padding-right: 5rem;
  text-align: center;
  width: -moz-max-content;
  width: max-content;
}

.service_box {
  bottom: 0.5rem;
  left: 50%;
  position: absolute;
  transform: translate(-50%, 50%);
}

div:has(.service_box) {
  width: 100%;
}

/*=============== cta-2 ===========*/

.cta-2 {
  background: var(--beg1);
  padding: 15rem 0 5rem;
}

/*=============== voice ===========*/

.voice {
  background: var(--beg2);
  padding: 5rem 0 3rem;
}

.voice_sliderarea {
  margin-top: 1.5rem;
}

/*=============== foryou ===========*/

.foryou {
  padding: 5rem 0 0;
}

.foryou_list {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 1.8rem 0;
  justify-content: space-between;
  margin-top: 5rem;
}

.foryou_item {
  aspect-ratio: 169/155;
  background: var(--beg2);
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  padding: 2rem 0;
  width: 49%;
}

.foryou_icn {
  height: auto;
  margin: 0 auto 1rem;
  width: 2.6rem;
}

.foryou_icn--lg {
  margin-bottom: 1.6rem;
}

.foryou_icn--sm {
  margin-bottom: 0.8rem;
}

.foryou_desc {
  font-size: 1.5rem;
  letter-spacing: 0;
  line-height: 1.4;
  text-align: center;
}

.foryou_desc span {
  color: var(--blu);
  font-size: 1.8rem;
  letter-spacing: 0;
}

.foryou_txt {
  font-size: 1.8rem;
  text-align: center;
}

.foryou_txt em {
  background: linear-gradient(transparent 60%, var(--yel) 60%);
  color: var(--org);
  font-size: 3rem;
}

.foryou_wrap {
  align-items: center;
  display: flex;
  gap: 0.5em;
  justify-content: center;
  margin-top: 1rem;
}

.foryou_wrap span:first-of-type {
  display: block;
  width: 28.9rem;
}

.foryou_wrap span:last-of-type {
  font-size: 1.8rem;
}

.foryou_kaiketu {
  margin-top: 3rem;
}

.foryou_img {
  height: auto;
  position: absolute;
  right: 1.4rem;
  top: 8rem;
  width: 8.7rem;
  z-index: -1;
}

/*=============== cta-3 ===========*/

.cta-3 {
  background: url("../img/cta3_l-bg_sp.png") no-repeat center 8rem;
  padding-bottom: 5rem;
  position: relative;
}

.cta-3 .container {
  margin-top: 11rem;
}

.cta-3 .cta_txt1 {
  bottom: 10px;
}


/*=============== flow ===========*/

.flow {
  padding: 5rem 0 2rem;
}

.flow_list {
  margin-top: 3rem;
}

.flow_item {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 3.3rem;
}

.flow_img {
  width: 11.5rem;
}

.flow_item:last-of-type .flow_img {
  padding-bottom: 2.5rem;
}

.flow_body {
  flex: 1;
}

.flow_item:not(:first-of-type) .flow_body {
  position: relative;
}

.flow_item:not(:first-of-type) .flow_body::before {
  background-image: linear-gradient(to right, #333 2px, transparent 2px);
  background-position: left top;
  background-repeat: repeat-x;
  background-size: 6px 2px;
  content: "";
  height: 2rem;
  left: -0.5rem;
  position: absolute;
  top: -1.9rem;
  width: 23rem;
}

.flow_ttl {
  color: var(--org);
  font-size: 1.9rem;
  margin-bottom: 1rem;
}

.flow_txt {
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.47;
}

.flow .com-btn {
  font-size: 1.5rem;
  height: 4.2rem;
  margin-top: 0.5rem;
  width: 21.6rem;
}

.flow .com-btn:after {
  width: 1.3rem;
}

/*=============== faq ===========*/

.faq {
  background: var(--beg2);
  padding: 5rem 0 8rem;
}

/*=============== franchise ===========*/

.fc {
  background: url(../img/franchise-bg_sp.png) no-repeat center top/100% 100%;
  margin-top: -5rem;
  padding: 7rem 0;
  position: relative;
  z-index: 5;
}

.fc_txt1 {
  font-size: 2rem;
  margin-bottom: 1rem;
  text-align: center;
}

.fc_balloon {
  background: var(--org);
  border-radius: 10rem;
  color: var(--wh);
  font-size: 2rem;
  line-height: 1.35;
  margin: 0 auto 4.5rem;
  padding: 1.8rem 0;
  position: relative;
  text-align: center;
  width: 100%;
}

.fc_balloon em {
  color: var(--yel);
}

.fc_balloon span {
  display: none;
}

.fc_balloon::after {
  background: url(../img/franchise-tri.png) no-repeat center center/contain;
  bottom: -2rem;
  content: "";
  display: block;
  height: 2.8rem;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
  width: 3.7rem;
}

.fc .head_ttl--fc {
  position: relative;
}

.fc .head_ttl--fc::before {
  background: url(../img/franchise-icn.png) no-repeat center center/contain;
  bottom: 3.8rem;
  content: "";
  display: block;
  height: 9.2rem;
  position: absolute;
  right: 0;
  width: 9.2rem;
}

.fc_txt2 {
  color: #000;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 2;
  margin: 2rem 0 0.5rem;
  text-align: center;
}

.fc_txt2 span {
  background: var(--yel);
  color: var(--org);
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.58;
}

.fc_img {
  margin: 0 0 5rem auto;
  width: 33rem;
}

/*=============== merit ===========*/

.merit {
  background: url(../img/merit-bg_sp.png) no-repeat center top/100% auto;
  margin-bottom: 7rem;
  padding: 5rem 0;
  position: relative;
}

.merit .head_sub {
  line-height: normal;
  margin-bottom: 0.5rem;
}

.merit .head_ttl span {
  font-size: 3.5rem;
}

.merit_list {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 2rem;
}

.merit_img {
  height: auto;
  margin: 0 auto;
  width: 15.2rem;
}

.merit_item {
  margin-bottom: 1.2rem;
}

.merit_item:first-of-type {
  width: 100%;
}

.merit_item:not(:first-of-type) {
  width: 50%;
}

/*=============== details ===========*/

.details_txt {
  color: #000;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.65;
  margin: 2rem 0 3.5rem;
  text-align: center;
}

.details_btn {
  border: 3px solid var(--org);
  border-radius: 10rem;
  color: var(--org);
  display: block;
  font-size: 1.8rem;
  height: 7.5rem;
  letter-spacing: 0.05em;
  line-height: 1.22;
  margin: 1.5rem auto 0;
  padding: 1.2rem 0;
  position: relative;
  text-align: center;
  width: 31.5rem;
}

.details_btn::after {
  background: var(--org);
  content: "";
  height: 3px;
  position: absolute;
  right: 0;
  top: 50%;
  width: 2.3rem;
}

@media only screen and (min-width: 540px) {
  /* Wider than sm-size */
}

@media only screen and (min-width: 768px) {
  /* Wider than md-size */

  html {
    font-size: 0.833vw;
  }

  body {
    font-size: 1.9rem;
  }

  .pc-only {
    display: block;
  }

  .sp-only {
    display: none;
  }

  .footer {
    padding: 15rem 0 0;
  }

  .footer_logo {
    height: auto;
    width: 44.8rem;
  }

  .footer_link {
    font-size: 2.2rem;
    margin: 0 auto 3rem;
  }

  .footer_copyright {
    font-size: 1.5rem;
  }

  .pagetop {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    bottom: 2.5rem;
    font-size: 1.7rem;
    height: 7.4rem;
    padding-top: 1rem;
    position: absolute;
    right: 12rem;
    width: 19.3rem;
  }

  .pagetop span {
    width: 1.6rem;
  }

  .header {
    height: 8rem;
    position: fixed;
  }

  .header_container {
    justify-content: space-between;
    margin: 0 auto;
  }

  .header_logo {
    margin-left: 10%;
    width: 30rem;
  }

  .header_btn {
    display: block;
    margin-right: 21rem;
  }

  .gnav {
    padding: 16rem 7.5rem 10rem;
    width: 50rem;
  }

  .gnav_list {
    margin-bottom: 3.4rem;
  }

  .gnav_item {
    font-size: 1.8rem;
    font-size: 1.8rem;
    padding: 2.5rem 0;
  }

  .navbtn {
    right: 5rem;
    top: 4rem;
    width: 10rem;
  }

  .navbtn_line {
    height: 3px;
    width: 3rem;
  }

  .navbtn_line::after,
  .navbtn_line::before {
    height: 3px;
    width: 3rem;
  }

  .navbtn_line:before {
    top: -1.4rem;
  }

  .navbtn_line:after {
    top: 1.4rem;
  }

  .navbtn[aria-expanded=true] .navbtn_line:before {
    transform: translate(1.5rem, 0) rotate(45deg);
  }

  .navbtn[aria-expanded=true] .navbtn_line:after {
    transform: translate(1.5rem, 0) rotate(-45deg);
  }

  .gnav_link .com-btn {
    height: 7rem;
    width: 35.9rem;
  }

  .gnav_link .com-btn:after {
    height: 3px;
    width: 3rem;
  }

  .gnav_link .com-btn p {
    font-size: 1.5rem;
    line-height: 1.44;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  }

  .gnav_icn {
    aspect-ratio: 170/100;
    border-radius: 1.3rem;
    border-width: 3px;
    font-size: 2rem;
    line-height: 1.2;
    /* width: 16.8rem; */
    /* height: 10rem; */
  }

  .gnav_icn::after {
    bottom: 1rem;
    height: 1.3rem;
    right: 1rem;
    width: 1.3rem;
  }

  .cta_txt1 {
    font-size: 2.5rem;
    gap: 0;
    letter-spacing: 0.05em;
    position: relative;
    bottom: -0px;
  }

  .cta_txt1::before {
    background: url(../img/cta-deco-l.png) no-repeat center center/contain;
    margin-left: 0;
    width: 3.3rem;
  }

  .cta_txt1::after {
    background: url(../img/cta-deco-r.png) no-repeat center center/contain;
    margin-right: 0;
    width: 3.3rem;
  }

  .cta .com-btn {
    font-size: 1.9rem;
    height: 10rem;
    margin: 0 auto 2rem;
    max-width: initial;
    width: 70rem;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  }
.container .fade .com-btn.slide {
    font-size:3.0rem;
}
.container #js-fv .com-btn.slide {
    font-size:3.0rem;
}

  .cta .com-btn::after {
    height: 3px;
    width: 4.2rem;
  }

  .cta_banner {
    margin: 0 0 6.4rem;
  }

  .cta_present {
    border-radius: 2rem;
    padding: 0 3.5rem 0 25rem;
  }

  .cta_balloon {
    aspect-ratio: 1/1;
    flex-direction: column-reverse;
    left: 3rem;
    margin: 0;
    position: absolute;
    width: 23rem;
  }

  .cta_body {
    flex: 1;
    margin-left: 3rem;
    text-align: center;
  }

  .cta_txt3 {
    font-size: 1.7rem;
    margin: 0 auto 2rem;
    width: -moz-max-content;
    width: max-content;
  }

  .cta_txt4 {
    font-size: 3rem;
    letter-spacing: 0.05em;
    line-height: 1.33;
    padding-left: 0;
    text-align: center;
  }

  .cta_img2 {
    margin-top: -2rem;
    width: 26rem;
  }

  .tblscroll {
    overflow: hidden;
  }

  .tbl {
    font-size: 1.9rem;
    margin: 0;
    min-width: initial;
  }

  .tbl--service {
    min-width: none;
  }

  .tbl--service tbody th {
    line-height: 1.42;
    padding: 1.5rem 0;
    width: 23rem;
  }

  .tbl--service thead th:nth-of-type(2),
  .tbl--service thead th:nth-of-type(3),
  .tbl--service thead th:nth-of-type(4) {
    width: 17rem;
  }

  .tbl--service thead th:last-of-type {
    height: 9rem;
    width: 22rem;
  }

  .tbl--service tbody tr td:last-of-type {
    font-size: 2.2rem;
  }

  .tbl--service tbody tr td:last-of-type.en {
    font-size: 3rem;
  }

  .tbl--service td.en {
    font-size: 3rem;
  }

  .tbl--service td.bts {
    font-size: 3.8rem;
  }

  .tbl--details thead th:not(:first-of-type) {
    font-size: 2.4rem;
    padding: 1.7rem 0;
    width: 42.7rem;
  }

  .tbl--details tbody th {
    font-size: 1.8rem;
    padding: 2rem 0;
    width: 16.9rem;
  }

  .tbl--details tbody th.sm {
    font-size: 1.5rem;
  }

  .tbl--details td {
    font-size: 2rem;
  }

  .tbl--details td.sm {
    padding: 3rem 0;
  }

  .head--merit .head_sub {
    width: 63rem;
  }

  .head_sub {
    background: url(../img/head_line.png) no-repeat center bottom/auto 2rem;
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 1.8rem;
    max-width: none;
    padding: 0 2rem 3.6rem 2rem;
    width: 63rem;
  }

  .head--problem .head_sub,
  .head--feature .head_sub {
    white-space: nowrap;
    width: -moz-max-content;
    width: max-content;
  }

  .head--problem .head_sub span {
    display: inline;
  }

  .head_ttl {
    font-size: 5rem;
    letter-spacing: 0.1em;
    line-height: 1;
    margin-bottom: 3.4rem;
  }

  .head_ttl em {
    font-size: 5.2rem;
  }

  .head_deco span {
    height: 1.4rem;
    width: 1.4rem;
  }

  .head_deco span:nth-of-type(even) {
    margin: 0 4.5rem;
  }

  .head::before {
    bottom: 0;
    font-size: 20rem;
    letter-spacing: 0;
  }

  .slider {
    width: 100%;
  }

  .slider_item {
    aspect-ratio: 850/733;
    background: url(../img/slider-bg.png) no-repeat center bottom/contain;
    margin-bottom: 10rem;
    padding: 6rem 5rem 0;
    position: relative;
    width: 87rem;
  }

  .slider_head {
    padding-left: 15rem;
  }

  .slider_img {
    bottom: -1rem;
    height: auto;
    left: 0rem;
    width: 11.5rem;
  }

  .slider_job {
    font-size: 1.8rem;
    padding: 0.5rem 0;
    width: 19.4rem;
  }

  .slider_name {
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 2rem;
  }

  .slider_ttl {
    border-radius: 1rem;
    display: block;
    font-size: 2.2rem;
    line-height: 6.5rem;
    margin-bottom: 2rem;
    padding: 0 1em;
  }

  .slider_body {
    height: auto;
    overflow: auto;
    padding: 0;
  }

  .slider_txt {
    font-size: 1.8rem;
    line-height: 1.56;
  }

  .slider .slick-slide {
    aspect-ratio: initial;
    /*拡大や透過のアニメーションを0.5秒で行う*/
    opacity: 1;
    transform: scale(0.8);
    /*左右の画像のサイズを80%に*/
    transition: all 0.5s;
    width: 87rem;
    /*透過50%*/
  }

  .slider .slick-slide.slick-center {
    opacity: 1;
    padding-top: 2rem;
    transform: scale(1);
  }

  .slider_arrow {
    top: 32%;
    width: 8rem;
  }

  .slider_prev {
    left: calc(50vw - 52rem);
  }

  .slider_next {
    right: calc(50vw - 52rem);
  }

  .slider .slick-dots {
    bottom: 7rem;
  }

  .acc_item {
    border-radius: 1rem;
    margin-bottom: 2.2rem;
  }

  .acc_btn {
    border-radius: 1rem;
    padding: 1.8rem 4rem;
  }

  .acc_btn::after {
    height: 2.2rem;
    margin-right: 1.2rem;
    width: 2.5rem;
  }

  .acc_inner1 {
    gap: 2rem;
  }

  .acc_icn {
    width: 5rem;
  }

  .acc_text1 {
    font-size: 2.2rem;
    letter-spacing: 0.08em;
    letter-spacing: 0.08em;
  }

  .acc_text2 {
    font-size: 1.9rem;
    line-height: 1.58;
  }

  .acc_text2 strong {
    font-size: 1.6rem;
  }

  .acc_text2 .com-btn {
    height: 5.4rem;
    margin-top: 1rem;
    width: 37.8rem;
    font-size: 1.5rem;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  }

  .acc_content {
    padding: 0rem 4rem 3rem;
  }

  .fixedbtn-pc {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 30;
  }

  .fixedbtn-sp {
    display: none;
  }

  .fv {
    background: url(../img/fv-bg-l.jpg) no-repeat center top/100% auto;
    margin-top: 0;
    padding: 11.5rem 0 5rem;
  }

  .fv_txt01 {
    font-size: 3rem;
    height: 5.2rem;
    margin: 0 auto 2rem;
    width: 67rem;
  }

  .fv_txt02 {
    background: url(../img/underline.png) no-repeat center bottom/100% auto;
    font-size: 3.0rem;
    margin-bottom: 3rem;
    padding: 0 2rem 4rem 2rem;
  }

  .fv_txt02 em {
    font-size: 3.0rem;
  }

  .fv_ttl {
    font-size: 3.5rem;
    margin-bottom: 0.5rem;
  }

  .fv_ttl span {
    border-radius: 1.6rem;
    font-size: 3.5rem;
    margin-right: 0.2em;
    padding: 1rem 2.8rem 0.5rem 3.5rem;
  }

  .fv_ttl span em {
    font-size: 3.5rem;
  }

  .fv_ttl img {
    margin: -8rem 0 0 5rem;
    max-width: initial;
  }

  .fv_list {
    margin: 0 0 3rem;
  }

  .fv_item {
    width: 32.6%;
  }

  .fv_bg {
    aspect-ratio: 672/441;
    padding: 3rem 0;
  }

  .fv_bg--01 {
    background-image: url(../img/fv-point-01_pc.png);
  }

  .fv_bg--02 {
    background-image: url(../img/fv-point-02_pc.png);
  }

  .fv_bg--03 {
    background-image: url(../img/fv-point-03_pc.png);
  }

  .fv_catch {
    font-size: 2.5rem;
    letter-spacing: 0.08em;
    line-height: 1.4;
  }

  .fv_catch span {
    font-size: 2.7rem;
  }

  .fv_catch-mark::after {
    font-size: 1.5rem;
  }

  .fv_inner {
    gap: 1rem;
    margin-bottom: 0;
    margin-top: -1rem;
  }

  .fv_inner--center {
    margin-top: 0.5rem;
  }

  .fv_circle {
    font-size: 2.3rem;
    letter-spacing: 0.0707692308em;
    line-height: 1.13;
    width: 7.7rem;
  }

  .fv_em--01 {
    font-size: 6rem;
    letter-spacing: 0.08em;
  }

  .fv_em--01 span {
    font-size: 10rem;
  }

  .fv_em--01::after {
    font-size: 1.5rem;
    right: -2rem;
    top: 2rem;
  }

  .fv_em--02 {
    font-size: 5rem;
    letter-spacing: 0.08em;
  }

  .fv_em--02 span {
    font-size: 10rem;
  }

  .fv_em--03 {
    font-size: 6.5rem;
  }

  .fv_notes {
    font-size: 1.5rem;
    line-height: 1.4;
    text-shadow: none;
  }

  .problem {
    padding: 12.5rem 0 1rem;
  }

  .problem_img {
    margin: 5rem auto 0;
    width: 41rem;
  }

  .problem_body {
    border-radius: 2rem;
    display: flex;
    gap: 8rem;
    padding: 4rem 8rem 4.5rem;
  }

  .problem_item {
    background-size: 3.5rem auto;
    font-size: 1.9rem;
    margin-bottom: 1.2rem;
    padding: 1rem 0 1rem 5.5rem;
  }

  .problem_arrow {
    margin: -1rem auto 0;
    width: 7.2rem;
  }

  .problem_txt {
    align-items: center;
    display: flex;
    font-size: 3rem;
    justify-content: center;
    letter-spacing: 0.08em;
    margin-bottom: 23rem;
  }

  .problem_txt .img {
    width: 51rem;
  }

  .problem_txt em {
    font-size: 5rem;
  }

  .problem_txt .inner {
    padding-bottom: 0.5em;
  }

  .about {
    background: url(../img/problem-bg_l.png) no-repeat center top/100% 24rem;
    margin-top: -0.5rem;
    padding-top: 1rem;
  }

  .about_wrap {
    margin: 4.5rem 0 0 calc(50% - 50vw);
  }

  .about_img {
    height: 29.3rem;
    width: 47.7vw;
  }

  .about_img img {
    -o-object-fit: cover;
    -o-object-position: left 20% center;
    height: 29.3rem;
    object-fit: cover;
    object-position: left 20% center;
    width: 100%;
  }

  .about_body {
    border-bottom-left-radius: 3rem;
    margin: -22rem calc(50% - 50vw) 0 auto;
    padding: 4rem 0 4.5rem;
    width: calc(51.2rem + 50vw);
  }

  .about_txt {
    font-size: 1.9rem;
    font-weight: 400;
    line-height: 1.84;
    margin-left: 51.2rem;
  }

  .about_txt .sp-margin {
    display: none;
  }

  .feature {
    padding: 12rem 0 7.5rem;
  }

  .feature_list {
    gap: 3.8rem 0;
    margin-top: 6.5rem;
  }

  .feature_item {
    width: 32.2%;
  }

  .feature_topics {
    margin-top: -3rem;
    padding-bottom: 9rem;
    padding-top: 2.5rem;
  }

  .topic:nth-of-type(odd) {
    margin-bottom: 8rem;
  }

  .topic:nth-of-type(even) {
    margin-bottom: 4rem;
  }

  .topic_wrap {
    gap: 2.5rem 3%;
    grid-template-rows: auto auto;
  }

  .topic:nth-of-type(odd) .topic_wrap {
    grid-template-columns: 58.6% 37.9%;
  }

  .topic:nth-of-type(even) .topic_wrap {
    grid-template-columns: 37.9% 58.6%;
  }

  /* .topic:nth-of-type(5) .topic_wrap {
    grid-template-columns: 65% 31%;
  } */

  .topic_head {
    grid-row: 1/2;
  }

  .topic:nth-of-type(odd) .topic_head {
    grid-column: 1/2;
  }

  .topic:nth-of-type(even) .topic_head {
    grid-column: 2/3;
  }

  .topic_body {
    grid-row: 2/3;
  }

  .topic:nth-of-type(odd) .topic_body {
    grid-column: 1/2;
  }

  .topic:nth-of-type(even) .topic_body {
    grid-column: 2/3;
  }

  .topic_img {
    grid-row: 1/3;
  }

  .topic:nth-of-type(odd) .topic_img {
    grid-column: 2/3;
  }

  .topic:nth-of-type(even) .topic_img {
    grid-column: 1/2;
  }

  .topic_head {
    gap: 3.5rem;
  }

  .topic_no {
    width: 10rem;
  }

  .topic:nth-of-type(odd) .topic_no::before {
    height: 7rem;
    top: 5rem;
    width: calc(50% - 56rem);
  }

  .topic:nth-of-type(even) .topic_no::before {
    height: 7rem;
    top: 7rem;
    width: calc(50% - 56rem);
  }

  .topic_ttl span:first-of-type {
    font-size: 2.5rem;
    line-height: 1.5;
  }

  .topic_ttl span:last-of-type {
    font-size: 3.5rem;
    line-height: 1.46;
  }

  .topic_txt {
    font-size: 1.9rem;
    line-height: 1.84;
    margin-bottom: 0;
    padding: 0;
  }

  .topic_txt span {
    font-size: 1.9rem;
    line-height: 1.84;
  }

  .topic_bg {
    border-radius: 3rem;
    margin: 0 -14rem;
    padding: 7rem 14rem;
  }

  .topic:nth-of-type(4) .topic_bg {
    padding-bottom: 5rem;
  }

  .topic_inner {
    border-radius: 3rem;
    margin-top: 7.5rem;
    padding-bottom: 3rem;
  }

  .topic_inner--gry {
    background-color: #e8e7dc;
  }

  .topic_inner--blu {
    background-color: #eaf4f7;
  }

  .topic_videottl {
    font-size: 2.2rem;
    line-height: 1;
    margin: 0 auto;
    padding: 1rem 0;
    transform: translateY(-50%);
    width: 25em;
  }

  .topic_inner--gry .topic_videottl {
    border-width: 5px;
  }

  .topic_inner--blu .topic_videottl {
    border-width: 5px;
  }

  .topic_video {
    width: 54rem;
  }

  .service {
    background-image: url(../img/service-deco1.png), url(../img/service-deco2.png);
    background-position: right 10% top 50%, left 15% bottom;
    background-repeat: no-repeat, no-repeat;
    background-size: 52rem auto, 44rem auto;
    padding: 14rem 0 16rem;
  }

  .service_tblscroll {
    margin-top: 5rem;
  }

  .service_arrow {
    margin: 0 auto;
    position: relative;
    width: 7.2rem;
    z-index: 5;
  }

  .service_inner {
    aspect-ratio: 792/194;
    background: url(../img/service-bg.png) no-repeat center top/100% auto;
    justify-content: right;
    margin: -1rem auto 0;
    width: 79rem;
    z-index: 0;
  }

  .service_txt1 {
    font-size: 2.5rem;
    margin-bottom: 0.6rem;
  }

  .service_txt2 {
    font-size: 2.5rem;
    margin-bottom: 1.4rem;
  }

  .service_txt2 span {
    font-size: 4.5rem;
  }

  .service_txt2 small {
    font-size: 2rem;
  }

  .service_txt3 {
    font-size: 1.6rem;
  }

  .service_img {
    bottom: -1rem;
    left: 2.5rem;
    width: 23rem;
  }

  .cta-2 {
    padding: 18rem 0 13rem;
  }

  .voice {
    padding: 11rem 0 0.3rem;
  }

  .voice_sliderarea {
    margin-top: 4rem;
  }

  .foryou {
    padding: 14rem 0 0;
  }

  .foryou_item {
    aspect-ratio: 330/262;
    padding: 2.4rem 0;
    width: 32.2%;
  }

  .foryou_icn {
    margin: 0 auto 2.5rem;
    width: 5.4rem;
  }

  .foryou_icn--lg {
    margin-bottom: 3.5rem;
  }

  .foryou_icn--sm {
    margin-bottom: 1.5rem;
  }

  .foryou_desc {
    font-size: 2rem;
  }

  .foryou_desc span {
    font-size: 3rem;
    letter-spacing: 0.04em;
  }

  .foryou_txt {
    font-size: 3rem;
  }

  .foryou_txt em {
    font-size: 5rem;
  }

  .foryou_wrap {
    margin-top: 1.5rem;
  }

  .foryou_wrap span:first-of-type {
    width: 47rem;
  }

  .foryou_wrap span:last-of-type {
    font-size: 3rem;
  }

  .foryou_kaiketu {
    margin-top: 0.5rem;
  }

  .foryou_img {
    right: calc(50% - 57rem);
    top: 1rem;
    width: 22.5rem;
  }

  .cta-3 {
    background: url("../img/cta3_l-bg.png") no-repeat center 8.5rem;
    padding: 2rem 0 10.5rem;
    background-size: 100%;
  }

  .cta-3 .container {
    margin-top: 20rem;
  }

  .cta-3 .com-btn {
    margin-bottom: 4rem;
    font-size: 1.9rem;
  }

  .flow {
    padding: 11rem 0 9rem;
  }

  .flow_list {
    align-items: stretch;
    display: flex;
    justify-content: space-between;
    margin-top: 8rem;
  }

  .flow_item {
    display: block;
  }

  .flow_img {
    width: 33.4rem;
  }

  .flow_item:last-of-type .flow_img {
    padding-bottom: 0;
    width: 30.7rem;
  }

  .flow_body {
    margin-top: 3.2rem;
  }

  .flow_item:not(:first-of-type) .flow_body {
    margin-top: 4rem;
  }

  .flow_item:not(:first-of-type) .flow_body::before {
    background-image: linear-gradient(to bottom, #333 2px, transparent 2px);
    background-position: left 0px;
    background-repeat: repeat-y;
    background-size: 2px 6px;
    bottom: -2.5rem;
    height: 19rem;
    left: -2.8rem;
    width: 2px;
  }

  .flow_txt {
    font-size: 1.8rem;
    line-height: 1.94;
    text-align: center;
  }

  .flow .com-btn {
    font-size: 1.5rem;
    height: 6rem;
    margin-top: 1.5rem;
    width: 30.6rem;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    line-height: normal;
  }

  .flow .com-btn:after {
    width: 1.8rem;
  }

  .faq {
    padding: 16.5rem 0;
  }

  .fc {
    background: url(../img/franchise-bg.png) no-repeat center top/100% 100%;
    margin-top: -8rem;
    padding: 16rem 0 10rem;
  }

  .fc_balloon {
    font-size: 3rem;
    letter-spacing: 0.08em;
    line-height: 1.5;
    margin: 0 auto 8rem;
    padding: 2.7rem 0;
    width: 95rem;
  }

  .fc_balloon span {
    display: inline;
  }

  .fc_balloon::after {
    bottom: -2.8rem;
    height: 4.9rem;
    width: 4.5rem;
  }

  .fc .head_ttl--fc::before {
    bottom: 1.4rem;
    height: 16.6rem;
    right: 3rem;
    width: 16.6rem;
  }

  .fc_txt2 {
    font-size: 1.9rem;
    line-height: 1.58;
    margin: 4.5rem 0;
  }

  .fc_txt2 span {
    display: inline-block;
    font-size: 2.2rem;
    line-height: 1.36;
    margin-top: 0.3rem;
  }

  .fc_img {
    margin: 0 auto 9rem;
    width: 80rem;
  }

  .merit {
    background: url(../img/merit-bg.png) no-repeat center top/100% auto;
    margin: 0 -8.8rem 13rem;
    padding: 10rem 4rem 8rem;
  }

  .merit .head_ttl span {
    font-size: 7rem;
  }

  .merit_list {
    margin-top: 5rem;
  }

  .merit_img {
    width: 26.3rem;
  }

  .merit_item:nth-of-type(1) {
    order: 1;
    width: 33%;
  }

  .merit_item:nth-of-type(2) {
    order: 4;
    width: 49%;
  }

  .merit_item:nth-of-type(2) .merit_img {
    margin-right: 10%;
  }

  .merit_item:nth-of-type(3) {
    order: 2;
    width: 33%;
  }

  .merit_item:nth-of-type(4) {
    order: 5;
    width: 49%;
  }

  .merit_item:nth-of-type(4) .merit_img {
    margin-left: 10%;
  }

  .merit_item:nth-of-type(5) {
    order: 3;
    width: 33%;
  }

  .details_txt {
    font-size: 1.9rem;
    line-height: 1.58;
    margin: 5rem 0 3rem;
  }

  .details_btn {
    font-size: 2.5rem;
    height: 7.5rem;
    padding: 1.8rem 0;
    margin: 5rem auto 0;
    /* padding: 0; */
    width: 70rem;
  }

  .details_btn::after {
    width: 5rem;
  }
}

@media only screen and (min-width: 992px) {
  /* Wider than lg-size */

  .container {
    margin: 0 auto;
    max-width: 107rem;
    padding: 0 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  /* Wider than xl-size */

  html {
    font-size: 52.6%;
  }
}

@media only screen and (min-width: 1400px) {
  /* Wider than xxl-size */
}

/* 全体を囲むボックス */
.lpoket_dl_box {
    text-align: center;
    margin: 30px 0;
}

/* アプリダウンロードのテキスト */
.lpoket_dl_box .dl_text {
    color: #ff8c00 !important;
    font-weight: bold !important;
    font-size: clamp(20px, 5vw, 28px) !important;
    text-align: center !important;
    margin: 40px 0 20px !important;
    display: block !important;
}

/* 画像コンテナ共通（横並びにする） */
.lpoket_container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    width: 100% !important;
    margin: 0 auto !important;
}
	

/* 画像（リンク）の基本設定 */
.lpoket_container a {
    display: inline-block;
    transition: opacity 0.3s ease;
}

.lpoket_container a:hover {
    opacity: 0.8; /* マウスを乗せると少し透明に */
}

/* ★修正のポイント：画像サイズの統一★ */
.lpoket_container img {
    width: auto !important;   /* 幅を固定しない */
    height: 48px !important; /* スマホでのストアボタンの標準的な高さに合わせる */
    object-fit: contain !important;
}

/* ★WEB版（PC版）ボタンの個別調整★ */
.lpoket_container--sub img {
    height: 48px !important; /* ストアボタンより数ピクセル高くすると見栄えが揃います */
    width: auto !important;  /* width: 250px は削除するか auto にします */
}

/* モバイル（縦並び）設定 */
@media screen and (max-width: 768px) {
    .lpoket_container {
        flex-direction: column !important;
        gap: 12px !important;
    }
    .lpoket_container--sub {
        margin-top: 20px !important;
    }
}

/* PC用の設定（769px以上） */
@media screen and (min-width: 769px) {
    .lpoket_container img {
        height: 60px !important; /* PCでは少し大きく */
    }
    .lpoket_container--sub img {
        height: 70px !important; /* PCでのWEB版ボタンの高さ */
    }
}

/* 次のセクションとの余白 */
.head--about {
    margin-top: clamp(60px, 10vw, 100px) !important;
}