/* common */
:root{
  --clr_plan-free: #ff8c70;
  --clr_plan-standard: #00D7CC;
  --clr_plan-professional: #b28c00;
  --clr_plan-cart: #9e9e9e;

  --font-body_xl: clamp(22px, 2.5vw, 24px);
  --font-body_l: clamp(20px, 2vw, 22px);
  --font-body_m: clamp(16px, 1.5vw, 18px);
  --font-body_s: clamp(14px, 1.2vw, 16px);
  --font-body_xs: clamp(10px, 1.2vw, 12px);
  --font-body_notice: 12px;

  --line-height-body: 1.8;
  --line-height-heading: 1.4;
}
.for_pc{
  display: block;
}
.for_sp{
  display: none;
}
@media screen and (max-width: 1024px) {
  .for_pc{
    display: none;
  }
  .for_sp{
    display: block;
  }
}
body {
  margin: 0;
  padding: 0;
  font-family: 'Noto Sans JP', sans-serif;
  color: #333;
  font-size: var(--font-body_s);
  line-height: var(--line-height-body);
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    body {
        width: 390px;
        margin: 0 auto;
    }
}
@media screen and (max-width: 767px) {
    body {
        width: 100%;
        margin: 0;
    }
}
@media screen and (min-width: 1025px) {
    body {
        max-width: 100%;
        margin: 0 auto;
    }
}
h6 { font-size: clamp(14px, 1.2vw, 16px); }
h5 { font-size: clamp(16px, 1.5vw, 18px); }
h4 { font-size: clamp(20px, 2vw, 24px); }
h3 { font-size: clamp(22px, 2.5vw, 28px); }
h2 { font-size: clamp(24px, 3vw, 38px); }
h1 { font-size: clamp(44px, 4vw, 48px); }
h1,h2,h3,h4,h5,h6 {
  line-height: var(--line-height-heading);
  font-weight: bold;
  color: var(--clr_navy);
}
[id] {
  scroll-margin-top: 80px;
}
main{
  overflow: hidden;
}
.mv-inner,
.section-inner,
.cta-inner{
  max-width: 1100px;
  margin: 0 auto;
}
.mv-inner,
.section-inner:not(.--case .section-inner):not(.--support .section-inner),
.cta-inner{
  width: calc(100% - 40px);
}
.section-wrapper{
  padding: 96px 0 0;
}
.section-wrapper.--solution,
.section-wrapper.--cost,
.section-wrapper.--support{
  padding: 96px 0;
}
.cta-wrapper{
  padding: 40px 0;
  margin-top: 96px;
}
.section-wrapper + .cta-wrapper {
  margin: 0;
}
.section-wrapper.--achievement,
.section-wrapper.--solution,
.nav-wrapper.active{
  background-color: #fff8e8;
}
main > .cta-wrapper{
  position: relative;
background: linear-gradient(135deg, #ffe259 0%, #ffa751 100%);
}
/* セクション見出し */
.section-heading {
  text-align: center;
  margin-bottom: 30px;
}
.section-wrapper.--achievement .section-heading {
  text-align: center;
  margin-bottom: 8px;
}
.section-wrapper.--issues .section-heading {
  text-align: center;
  margin-bottom: 30px;
}
.section-wrapper.--solution .section-heading {
  font-size: var(--font-body_xl);
}
.section-heading .--style_sub {
  font-size: 50%;
  display: block;
  font-weight: 500;
}
.section-heading .--style_strong {
  font-weight: bold;
}
.section-heading .--style_accent_clr {
  color: #f99a00;
  font-size: 55%;
}
.--issues .--style_accent{
  color: #01A5FF;
  font-size:130%;  
}
.--achievement .--style_accent{
  color: #FD3067;
  font-size:130%;  
}
/* 見出し下の導入文 */
.section-inner.--intro{
  width: calc(100% - 40px);
  margin: 0 auto 24px;
}
@media screen and (min-width: 768px) {
  .section-inner.--intro{
    text-align: center;
  }
}
/* カードアイテム内タイトルなど */
.item-ttl .--style_sub {
  font-size: 65%;
  display: block;
}
.item-ttl {
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .item-ttl .--style_small{
    font-size:90%;
    display: block;
  }
.section-wrapper {
    padding: 64px 0 0;
  }
  .section-wrapper.--solution,
  .section-wrapper.--cost,
  .section-wrapper.--support{
    padding: 64px 0;
  }  
  .cta-wrapper{
    padding: 40px 0;
  }
  .section-heading {
    margin-bottom: 24px;
  }   
}
section .item-desc {
  text-align: left;
}
@media screen and (min-width: 1024px) {
.--trial .item-desc,
.--payment .item-desc{
  text-align: center;
}
}
.--trial .item-desc{
  font-weight: bold;
}
/* CTAボタン */
.mv-wrapper .ems_form_trial {
  margin-top: 32px;
}
.ems_form_trial {
  display: flex;
  gap: 10px;
}
.ems_form_trial:not(.mv-wrapper .ems_form_trial){
  justify-content: center;
}
.trial_box span {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.trial_box a {
  padding: 8px 24px;
  border-radius: 9999px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}
.trial_title1,
.trial_title2 {
  font-size: 12px;
  margin-top: 0.2rem;
}
span.trial_title1,
span.trial_title2 {
    position: absolute;
    display: inline-block;
    background: #ffffff;
    color:#01a5ff;
    padding: 4px 16px;
    z-index: 10;
    border: solid 2px #01a5ff;
    border-radius: 9999px;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px;
    font-weight: bold;
    white-space: nowrap;
    line-height: 1;
  }
span.trial_title2 {
    border: solid 2px #FD3067;
    color: #FD3067;
}
.trial_box{
  text-align:center;
}
.trial_box > span {
  position: relative;
}
.entry_input_area2 { /* トップ */
    display: block;
}
.entry_input_area2 a.submit{ /* トップ */
  border-radius:100px;
  margin-bottom:10px;
}
.entry_input_area2 a.submit:hover,
.entry_input_area2 a.submit:focus {
  text-decoration: none;
  opacity: 1;
}
.submit,
a.submit,
input.submit {
  display: inline-block;
  /* margin: 0 4px; */
  padding: 10px 18px;
  padding: 14px 30px;
  white-space: nowrap;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  color: #fff;
  background: #FD3067;
  background-clip: padding-box;
  border: 2px solid rgba(255, 255, 255, 0.5);
  cursor: pointer;
-webkit-transition: all 0.15s;
transition: all 0.15s;
  -webkit-animation: submit 3s ease-out 0s infinite normal;
  animation: submit 3s ease-out 0s infinite normal;
}
@-webkit-keyframes submit {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    /*66% {box-shadow: 0px 0px 0px rgba(31, 218, 251, 0.35);}*/
    /*100% {box-shadow: 0px 0px 20px 20px rgba(31, 218, 251, 0.00);}*/
    66% {box-shadow: 0px 0px 0px rgba(253, 48, 103, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(253, 48, 103, 0.0);}
}
@keyframes submit {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    /*66% {box-shadow: 0px 0px 0px rgba(31, 218, 251, 0.35);}*/
    /*100% {box-shadow: 0px 0px 20px 20px rgba(31, 218, 251, 0.00);}*/
    66% {box-shadow: 0px 0px 0px rgba(253, 48, 103, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(253, 48, 103, 0.0);}
}

@-webkit-keyframes submit2 {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    66% {box-shadow: 0px 0px 0px rgba(0, 122, 255, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(0, 122, 255, 0.0);}
}

@keyframes submit2 {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    66% {box-shadow: 0px 0px 0px rgba(0, 122, 255, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(0, 122, 255, 0.0);}
}
.ems_btn_mail_entry{
  margin: 0;
  padding: 15px 40px;
  text-align-last: justify;
  /*letter-spacing: 0.3em;*/
  outline: none;
  border-radius: 100px;
}

.entry_input_area2 .submit,
.entry_input_area2 a.submit,
.entry_input_area2 input.submit{
  border: 2px solid rgba(255, 0, 0, 0.5);
  padding: 13px 30px 10px;
}

.entry_input_area2 .submit2,
.entry_input_area2 a.submit2,
.entry_input_area2 input.submit2{
  border: 2px solid rgba(255, 255, 255, 0.5);
}

.submit2,
a.submit2,
input.submit2 {
  background: #01a5ff;
  animation: submit2 3s ease-out 0s infinite normal;
}
.entry_input_area2 .ems_btn_mail_entry{
  text-align-last:auto;
  width: 18%;
  min-width:240px;
  text-align: center;
}

.submit:focus,
.submit:hover,
a.submit:focus,
a.submit:hover,
input.submit:focus,
input.submit:hover {
  box-shadow: 0px 1px 6px #fff,1px 1px 26px #fff inset;
  /*color: #1FDAFB;*/
  color: #FD3067;
  /*border: 2px solid #1FDAFB;*/
  border: 2px solid #FD3067;  background: #fff;
  opacity: 0.85;

  -webkit-animation: submit_hover 1s ease-out 0s 1 normal;
  animation: submit_hover 1s ease-out 0s 1 normal;
}

.submit2:focus,
.submit2:hover,
a.submit2:focus,
a.submit2:hover,
input.submit2:focus,
input.submit2:hover {
  color: #01a5ff;
  border: 2px solid #01a5ff;  
  background: #fff;
  -webkit-animation: submit_hover2 1s ease-out 0s 1 normal;
  animation: submit_hover2 1s ease-out 0s 1 normal;
}
.entry_input_area2 .submit2:hover + .trial_title1 {
  color: #fff;
  background: #01a5ff;
}
.entry_input_area2 .submit:hover + .trial_title2 {
  color: #fff;
  background: #FD3067;
}

@-webkit-keyframes submit_hover {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    /*50% {box-shadow: 0px 0px 0px rgba(31, 218, 251, 0.6);}*/
    /*100% {box-shadow: 0px 0px 20px 20px rgba(31, 218, 251, 0.00);}*/
    50% {box-shadow: 0px 0px 0px rgba(253, 48, 103, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(253, 48, 103, 0.0);}
}
@keyframes submit_hover {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    /*50% {box-shadow: 0px 0px 0px rgba(31, 218, 251, 0.6);}*/
    /*100% {box-shadow: 0px 0px 20px 20px rgba(31, 218, 251, 0.00);}*/
    50% {box-shadow: 0px 0px 0px rgba(253, 48, 103, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(253, 48, 103, 0.0);}
}

@-webkit-keyframes submit_hover2 {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    50% {box-shadow: 0px 0px 0px rgba(0, 122, 255, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(0, 122, 255, 0.0);}
}
@keyframes submit_hover2 {
    0% {box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.00);}
    50% {box-shadow: 0px 0px 0px rgba(0, 122, 255, 0.6);}
    100% {box-shadow: 0px 0px 20px 20px rgba(0, 122, 255, 0.0);}
}

section .submit {
  border: 2px solid #fff;
  border: 2px solid rgba(255, 255, 255, 0.95);
}
@-webkit-keyframes submit_btn {
 from {
    -webkit-transform: translate(0px,0px);
 }
 to {
    -webkit-transform: translate(2px,2px);
 }
}
@keyframes submit_btn {
 from {
    transform: translate(0px,0px);
 }
 to {
    transform: translate(2px,2px);
 }
}
.ems_form_trial .submit2:hover + .trial_title1 {
  color: #fff;
  background: #01a5ff;
}
.ems_form_trial .submit:hover + .trial_title2 {
  color: #fff;
  background: #FD3067;
}
/* CTAセクション */
.cta-inner{
  align-items: center;
  background: #fff;
  padding: 56px 56px;
  border-radius: 2em;
  box-shadow: 0 0px 10px -3px #ad6700;
  width: 90%;  
}
.cta-inner .trial_box{
  flex: 1;
  max-width: 320px;
}
.cta-inner .trial_box a{
    width: 100%;
    text-align-last: unset;
}
main > .cta-wrapper .submit{
  padding: 20px 0 18px;
  font-size: 20px;
}
main > .cta-wrapper [class*="trial_title"]{
  padding: 6px 24px;
    font-size: 14px;  
}
main .trial_box:has(.trial_title2){
  position: relative;
}
main .trial_box:has(.trial_title2)::after {
  content: '※60日間無料';
  position: absolute;
  bottom: -1.8em;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .nav-wrapper  .trial_box:has(.trial_title2){
    position: relative;
  }
  .nav-wrapper  .trial_box:has(.trial_title2)::after {
    content: '※60日間無料';
    position: absolute;
    bottom: -1.8em;
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    font-weight: bold;
  }
  .cta-inner{
    padding: 24px 24px 56px 24px;
  }
}
/* ヘッダー */
.header-wrapper {
  background: #fff;
  border-bottom: 1px solid #eee;
  position: sticky;
  top: 0;
  z-index: 1000;
}
.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(8px + 6px) 0 8px 0;
  width: calc(100% - 50px);
  max-width: 1440px;
  margin: 0 auto;
  gap: 16px;
}
.header-logo{
  line-height: 0;
}
.header-logo img{
 max-width: 200px;
}
.nav-wrapper {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.nav-wrapper ul {
  display: flex;
  gap: 1rem;
  list-style: none;
}
.nav-wrapper li a {
  text-decoration: none;
  font-weight: bold;
  color: #333;
  font-size: var(--font-body_s);  
  white-space: nowrap;    
}
@media screen and (max-width: 768px) {
  .header-inner{
    padding: 8px 0;
  }
}
/* ハンバーガーメニュー */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 24px;
  height: 20px;
  background: none;
  border: none;
  cursor: pointer;
}
.nav-toggle span {
  display: block;
  height: 2px;
  background: #333;
  border-radius: 2px;
  width: 100%;
}
@media (max-width: 1024px) {
  .nav-wrapper {
    position: fixed;
    top: 0;
    right: -100%;
    height: 100%;
    width: 100%;
    background: #fff;
    flex-direction: column;
    padding: 2rem 1rem;
    transition: right 0.3s ease;
    max-width: 360px;
    width: 80%;
    box-shadow: -1px 0px 7px -3px #9a9a9a;
  }
  .nav-wrapper.active {
    right: 25%;
  }
  .nav-wrapper ul {
    flex-direction: column;
    gap: 1em;
    width: 100%;
    margin-top: 24px;
  }
  .nav-wrapper ul li a{
    padding: 14px 8px;
    border-bottom: 1px solid #F4E7CB;
    display: block;
  }
  .ems_form_trial {
    flex-direction: column;
    margin-top: 1.5rem;
    gap: 28px;
  }
  .nav-toggle {
    display: flex;
  }
  .nav-toggle.active span:nth-child(1) {
    transform: rotate(45deg) translate(4px, 4px);
  }
  .nav-toggle.active span:nth-child(2) {
    opacity: 0;
  }
  .nav-toggle.active span:nth-child(3) {
    transform: rotate(-45deg) translate(8px, -8px);
  }
  main > .cta-wrapper .submit{
    padding: 18px 30px 14px 30px;
    font-size: var(--font-body_m);
  }  
}
@media screen and (max-width: 768px) {
  .nav-wrapper {
    max-width: unset;
  }  
  .nav-wrapper.active {
    right: 0;
  }
}
/* メインビジュアル */
.mv-wrapper {
  padding: 3rem 0;
}
.mv-inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  z-index: 1;
  max-width: 1340px;
  width: calc(100% - 56px);
}
.mv-inner::before {
  content: '';
  position: absolute;
  top: -24px;
  right: 80px;
  background: url(../img/icon_dounyukensu.png) no-repeat;
  background-size: contain;
  height: 100%;
  width: 100%;
  max-width: 200px;
}
.mv-container.--of_left {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media screen and (min-width: 1024px) {
  .mv-container.--of_left {
    padding-left: 100px;
  }
}
.mv-wrapper .tag-item-wrap {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  font-weight: bold;
  align-items: center;
}
.mv-wrapper .tag-item-wrap span {
  font-size: var(--font-body_s);
}
.mv-wrapper .tag-item-wrap .--style_tag {
  font-size: clamp(12px, 1.5vw, 18px);
  background: #f8a300;
  border-radius: 9999px;
  padding: 8px 12px;
  color: #fff;
  font-weight: bold;
  line-height: 1;
  display: inline-block;
}
.mv-txt-wrap {
  line-height: 1.3;
  font-weight: bold;
  font-feature-settings: "palt" 1;  
  font-size: clamp(32px, 4vw, 50px); 
}
.mv-txt-wrap .highlight {
  color: #009FFF;
}
.mv-subtxt-wrap {
  font-size:var(--font-body_s);
  font-weight: 500;
}
.mv-container.--of_right img {
  max-width: 650px;
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 1024px){
.mv-wrapper {
    padding: 56px 0 48px;
}
}
.mv-container.--of_left .submit {
  font-size: 16px;
  padding: 18px 40px;
}
@media (max-width: 1024px) {
.mv-wrapper {
    padding: 80px 0 48px;
}  
  .mv-inner {
    flex-direction: column;
    text-align: center;
  }
  .mv-inner::before {
    top: -68px;
    right: -8px;
    width: 32%;
  }
  .mv-container.--of_left {
      align-items: flex-start;
      text-align: left;
      gap: 16px;
  }
  .tag-item-wrap {
    justify-content: center;
    gap: 4px;
  }
  .ems_form_trial{
    width: 100%;
  }
  .mv-container.--of_left .submit,
  .nav-wrapper .submit {
    padding: 18px 40px;
    width: 100%;
    text-align-last: unset;
  }  
}
/* 実績 */
.section-wrapper.--achievement{
  padding: 24px 0;
}
.slider_parent {
  position: relative;
  overflow: hidden;
  max-width: 1920px;
  margin: 0 auto;
}
.slider_parent .slider {
  display: flex;
}
.text_scroll {
  animation: scroll 40s linear infinite;
}
.text_scroll_reverse {
  animation: scroll 40s linear infinite;
  animation-direction: reverse !important; 
}
.logos {
  flex-shrink: 0;
}
.slider_parent ul li {
  margin-left: 10px;
  margin-right: 10px;
}
.slider_parent ul li {
  display: inline-block;
}
.slider_parent ul {
  padding: 0;
  margin: 0;
  display: flex;
}
.slider_parent ul li > a img {
  transition: 0.4s;
}
.slider_parent ul li > a img {
  max-width: 100% !important;
}
.section-wrapper.--achievement .section-heading{
  width: fit-content;
  position: relative;
  margin: 0 auto 8px;
}
.section-wrapper.--achievement .section-heading::before,
.section-wrapper.--achievement .section-heading::after {
    width: 3px;
    height: 40px;
    background-color: #333;
    content: '';
    display: inline-block;
bottom: -5px;
    position: relative;    
}
.section-wrapper.--achievement .section-heading::before {
    transform: rotate(-35deg);
    margin-right: 30px;
}
.section-wrapper.--achievement .section-heading::after {
    transform: rotate(35deg);
    margin-left: 30px;
}
@keyframes scroll {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@media only screen and (max-width: 991px) {
  .slider_parent ul li {
    margin-left: 5px;
    margin-right: 5px;
  }
  .text_scroll {
    animation: scroll 30s linear infinite;
  }
}
@media screen and (max-width: 1024px) {
  .section-wrapper.--achievement .section-heading::before, .section-wrapper.--achievement .section-heading::after{
    height: 32px;
  }
}
/* お悩みありませんか？ */
.section-wrapper.--issues{
  background: #f3fbff;
}
.section-inner.--issues_list{
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-weight: bold;
}
.--issues_list .item-wrap{
  position: relative;
  background: #fff;
  border: 2px solid #9bc3ea;
  border-radius: 12px;
  padding: 20px 0;
  font-size:clamp(16px, calc(100vw / 1280 * 20), 20px);
  line-height: 1.6;
  text-align: center;
}
.--issues_list .item-wrap::before,
.--issues_list .item-wrap::after {
  content: '';
  position: absolute;
  background: #9bc3ea;
  border-radius: 9999px;
}
.--issues_list .item-wrap::before{
  width: 14px;
  height: 14px;
}
.--issues_list .item-wrap::after {
  width: 8px;
  height: 8px;
}
@media screen and (min-width: 1024px){
.--issues_list .--of_left .item-wrap::before {
  bottom: -7px;
  right: 30px;
  transform: unset;
}
.--issues_list .--of_left .item-wrap::after {
  bottom: calc(-7px - 4px - 2px);
  right: 22px;
  transform: unset;
}
.--issues_list .--of_center .item-wrap::before {
  bottom: -7px;
  left: 50%;
  transform: translateX(-50%);
}
.--issues_list .--of_center .item-wrap::after {
  bottom: calc(-7px - 4px - 8px);
  left: 50%;
  transform: translateX(-50%);
}
.--issues_list .--of_right .item-wrap::before {
  bottom: -7px;
  left: 30px;
  transform: unset;
}
.--issues_list .--of_right .item-wrap::after {
  bottom: calc(-7px - 4px - 2px);
  left: 22px;
  transform: unset;
}
}
.--issues_list .section-container{
  display: flex;
  flex-direction: column;
  gap: 30px;  
}
@media screen and (min-width: 1024px){
.--issues_list .section-container{
  width: calc((100% - 30px*1)/2);
}
.--issues_list .item-wrap {
  width: calc(100% - 72px);
}
.--issues_list .--of_left .item-wrap:nth-of-type(odd) {
  margin-left: auto;
}
.--issues_list .--of_right .item-wrap:nth-of-type(even) {
  margin-left: auto;
}
}
.section-inner.--issues_img{
  text-align: center;
}
@media screen and (min-width: 1024px) {
  .section-inner.--issues_img{
  padding-top: 32px;
}
}
.section-inner.--issues_img img {
  width: min(320px, 70%);
  aspect-ratio: 640 / 400;
}
@media screen and (max-width: 1024px){
  .section-inner.--issues_list{
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
  }
  .--issues_list .item-wrap{
    padding: 12px 0;
  }
.--issues_list .section-container {
    gap: 8px;
}  
  .--issues_list .item-wrap:nth-of-type(odd){
    width: 80%;
    margin-right: auto;
  }
  .--issues_list .item-wrap:nth-of-type(even){
    width: 80%;
    margin-left: auto;
  }
  .--issues_list [class*="--of_"] .item-wrap:nth-of-type(odd):before {
    bottom: 4px;
    right: -7px;
    transform: unset;
  }
 .--issues_list [class*="--of_"] .item-wrap:nth-of-type(odd)::after {
    right: -16px;
    bottom: -2px;
  }  
  .--issues_list [class*="--of_"] .item-wrap:nth-of-type(even):before {
    bottom: 4px;
    left: -7px;
    transform: unset;
  }
 .--issues_list [class*="--of_"] .item-wrap:nth-of-type(even)::after {
  left: -16px;
    bottom: -2px;
  }  
}
/* 解決 */
.section-wrapper.--solution{
  position: relative;
  z-index: 0;
  padding-top: calc(100px + 4rem);

}
.section-wrapper.--solution::before{
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100px;
    z-index: -1;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    background: #f3fbff;
}
.--style_layout_wrap.--style_bubble {
  position: relative;
  /* background-color: #F4AB33; */
  background-color: #01a5ff;
  color: #fff;
  border-radius: 9999px;
  padding: 12px 24px;
  font-size: 20px;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto;
  line-height: 1;
  margin-bottom: 16px;
}
.--style_layout_wrap.--style_bubble::before {
  position: absolute;
  bottom: -10px;
  left: 32%;
  transform: translateX(-50%);
  width: 30px;
  height: 15px;
  background-color: #01a5ff;
  clip-path: polygon(0 0, 80% 0, 100% 100%);
  content: '';
}
.section-inner.--kinou-list {
  display: flex;
  gap: 25px;
  justify-content: center;
  margin-top: 2rem;
  flex-wrap: wrap;
}
.--kinou-list .section-container {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  z-index: 1;
  padding: 0 20px 30px;
}
@media screen and (min-width: 1024px){
  .--kinou-list .section-container{
  width: calc((100% - 25px*2)/3);
  }
}
.--kinou-list .section-container::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 80%;
  background: #fff;
  z-index: -1;
  border-radius: 10px;
  box-shadow: 0 0px 10px -3px #adc0ce;
}
.--kinou-list .section-container > img{
    width: min(310px, 100%);
    aspect-ratio: 310 / 180;
}
@media screen and (max-width: 1024px){
.section-wrapper.--solution::before {
    height: 80px;
  }
  .--solution .section-heading img{
    max-width: 300px;
}
.section-wrapper.--solution {
    position: relative;
    z-index: 0;
    padding-top: calc(100px + 1rem);
}
}
/* 選ばれる理由 */
.section-inner.--reason_list{
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}
.--reason_list .section-container{
  text-align: center;
  background: #fffdf5;
  border-radius: 10px;
  padding: 20px 30px;
  /* box-shadow: 0 0px 10px -3px #808080; */
  box-shadow: 0 0px 10px -3px #d9b98a;
display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;  
}
@media screen and (min-width: 1024px){
  .--reason_list .section-container{
  width: calc((100% - 25px*2)/3);    
  }
}
.--reason_list .section-container > img{
  width: min(120px, 100%);
  aspect-ratio: 240 / 240;
}
/* 特徴 */
.--cost .section-inner > *:not(:last-child):not(.section-container.--cost_list){
  margin-bottom: 56px;
}
.--cost .section-container > *:not(:last-child){
  margin-bottom: 16px;
}
.section-container.--cost_list {
    overflow-x: auto;
}
table {
  border-collapse: collapse;
  width: 100%;
  min-width: 1100px;
  background: #fff;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05);
  table-layout: fixed;
  margin-top: 32px;
}
th, td {
    border: 1px solid #e0e0e0;
    padding: 12px;
    text-align: center;
}
th {
    background: #f5f5f5;
    font-size: 14px;
}
td{
  font-weight: bold;
}
td .--style_small{
  font-size: 10px;
  display: block;
  font-weight: normal;
}
table th:first-child, table td:first-child {
  width: 140px;
  padding: 16px 0;
}
table th:not(:first-child):not(.plan-header),
table td:not(:first-child) {
  width: calc((100% - 140px) / 4);
  border-radius: 12px 12px 0 0;
  padding: 8px 0;    
  border-bottom: 1px solid #e0e0e0;
}
table th:not(:first-child),
table td:not(:first-child) {
  border-radius: 12px 12px 0 0;
}
table td:nth-child(2),
table th:nth-child(2) {
  border-right: none;
}
table td:nth-child(4),
table th:nth-child(4) {
  border-left: none;
}
.standard-col {
  padding-left: 12px;
  padding-right: 12px;
}
.plan-header {
  color: #fff;
  font-size: var(--font-body_xl);
  font-weight: bold;
  line-height: 1.2;
  padding: 8px 0 0;    
  border: none;
}
.plan-header.standard{
  position: relative;
  z-index: 0;
}
.plan-header.standard::before {
  content: '';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 30px;
  background: var(--clr_plan-standard);
  z-index: -1;
  border-radius: 14px 14px 0 0;
}
.--style_none{
  background: unset;
  border: unset;
}
.plan-header .--style_small{
  font-size: var(--font-body_xs);
  display: block;
}
.plan-header-sub {
  margin-top: 8px;
  font-size: var(--font-body_xs);
  background: #fff;
  font-weight: normal;
  padding: 8px 2px;
  min-height: 5.4em;
  align-content: center;
}
.free { background: var(--clr_plan-free); }
.standard { background: var(--clr_plan-standard); }
.professional { background: var(--clr_plan-professional); }
.cart { background: var(--clr_plan-cart); }

.free .plan-header-sub {
  color: var(--clr_plan-free);
  border: 1px solid var(--clr_plan-free);
  border-right: none;
}
.standard .plan-header-sub {
  color: var(--clr_plan-standard);
  border: 1px solid var(--clr_plan-standard);
}
.professional .plan-header-sub {
  color: var(--clr_plan-professional);
  border: 1px solid var(--clr_plan-professional);
  border-left: none;
}
.cart .plan-header-sub {
  color: var(--clr_plan-cart);
  border: 1px solid var(--clr_plan-cart);
}
tr td:nth-child(2) .highlight { color: var(--clr_plan-free); }
tr td:nth-child(3) .highlight { color: var(--clr_plan-standard); }
tr td:nth-child(4) .highlight { color: var(--clr_plan-professional); }
tr td:nth-child(5) .highlight { color: var(--clr_plan-cart); }
th .highlight{
  color: #009FFF;
}
.--cost_list table td:nth-child(3) {
    border-left: 1px solid var(--clr_plan-standard);
    border-right: 1px solid var(--clr_plan-standard);
}
.--style_bdr:not(:root){
  border-bottom: 1px solid var(--clr_plan-standard);
}
table sup{
  color: #333;
  font-weight: normal;
}
table .--style_recomend {
    font-size: var(--font-body_xs);
    font-weight: normal;
    display: block;
    border: 1px solid #FD3067;
    width: fit-content;
    margin: 0 auto;
    padding: 4px 8px;
    line-height: 1;
    border-radius: 4px;
    color: #FD3067;
}
.--style_ribon {
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
}
.--style_ribon img{
  width: min(268px, 100%);
  aspect-ratio: 268 / 52;
}
.section-container.--notice{
  font-size: var(--font-body_notice);
}
.section-container.--notice .item__txt {
  padding-left: 1.5em;
  text-indent: -1.5em;
  margin-bottom: 2px;
}
.section-container.--notice .item__txt:not(:last-of-type) {
  margin-bottom: 2px;
}
.section-container.--trial{
  text-align: center;
  position: relative;
  margin-bottom: 48px;
}
.section-container.--trial .item_hd{
  width: max-content;
  margin: 0 auto;
}
.section-container.--trial >*{
  width: fit-content;
  margin: 0 auto;
}
.section-container.--trial >*:not(:last-child){
  margin-bottom: 16px;
}
.section-container.--trial .item-ttl{
  font-weight: 900;
  font-size: clamp(22px, 2.5vw, 28px);
line-height: var(--line-height-heading);  
}
.section-container.--trial .item-notice-wrap{
  list-style: none;
  text-align: left;
  font-size: var(--font-body_notice);
}
.section-container.--trial .item_hd {
  background: #00D7CC;
  color: #fff;
  padding: 8px 24px;
  border-radius: 9999px;
  font-weight: bold;
  position: absolute;
  top: calc(-4px - 1em);
  left: 50%;
  transform: translateX(-50%);
}
.--trial .item-desc{
  line-height: 1.8;
  font-size: var(--font-body_m);
}
.--trial [class*="item-"] .--style_small{
  display: block;
  font-weight:500;
  font-size: 60%;
}
.--trial .item-ttl .--style_small{
  margin-bottom: 6px;
}
.--trial [class*="item-"] .--style_accent{
  color: #FD3067;
}
.--trial [class*="item-"] .--style_marker {
    background: linear-gradient(transparent 60%, #fd30673d 60%);
}
.section-container.--payment{
  text-align: center;
  background: #fff8e8;
  position: relative;
  padding: 24px;
}
.more-link.--style_payment{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  background-color: #F4AB33;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  border-radius: 40px;
  text-decoration: none;
  transition: background-color 0.3s;
  font-weight: bold;
  line-height: 1.2;
}
.more-link.--style_payment:hover {
    background-color: #F4AB33;
}
.more-link.--style_payment .arrow{
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: #fff;
    margin-left: 12px;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 1024px) {
  .more-link.--style_payment{
    text-align: left;
    padding: 14px 32px;
  }
  .--trial .item-desc{
  line-height: 1.6;
  }
}
/* 導入事例 */
.section-wrapper.--case {
  background-color: #fff;
  padding: 3rem 1rem;
  text-align: center;
}
.--case .card-list-wrap{
  display: flex;
  gap: 16px;
}
.--case .item-tag-wrap {
  font-size: 16px;
  margin-bottom: 2rem;
}
.--case .card-item-wrap {
  background: #fff;
  border-radius: 12px;
  padding: 24px 24px 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.--case .card-item-wrap-left {
  display: flex;
}
.--case .card-item-wrap-left img {
  max-width: 100%;
}
.card-item-wrap-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  text-align: left;
}
.--case .item-hd-wrap{
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 16px;
  text-align: left;
}
.--case .item-name{
  font-size:var(--font-body_xs);
}
.--case .item-tag{
  font-weight: bold;
  width: fit-content;
  background: #f4ab33;
  color: #ffffff;
  border-radius: 9999px;
  padding: 0.5em 1em;
  line-height: 1;
}
.--case .item-ttl {
  font-size: 18px;
  font-weight: bold;
  color: #F4AB33;
}
@media screen and (max-width: 1024px) {
.--case .card-item-wrap{
    padding: 16px;
    flex-direction: column;
}
.--case .card-list-wrap {
    flex-direction: column;
}
}

/* お客様の声 */
.section-inner.--voice_list{
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.--voice_list .section-container{
  background: #fff;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 1024px) {
  .--voice_list .section-container{
    width: calc((100% - 20px)/2);
}
}
.--voice_list .item-img-wrap .img-wrap {
  height: auto;
  border-radius: 6px;
}
.--voice_list .item-img-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 16px;
}
.--voice_list .item-desc-wrap > *:not(:last-child){
  margin-bottom: 4px;
}
.--voice_list .item-desc-wrap .item-name {
  font-size: 18px;
  font-weight: bold;
}
.--voice_list .item-desc-wrap .item-genre {
  font-size: 14px;
}
@media screen and (max-width: 1024px) {
.--voice_list .item-img-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
}
/* よくある質問 */
.section-wrapper.--faq{
  position: relative;
}
.--faq .section-inner{
  position: relative;
}
.qa-item {
  margin-bottom: 16px;
  overflow: hidden;
}
.qa-question {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 16px 24px 16px 16px;
  background: #fff;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  list-style: none;
  background: #fff7e5;  
}
.qa-question::-webkit-details-marker {
  display: none;
}
/* .qa-item[open] .qa-question{
} */
.qa-marker {
  font-weight: 900;
  display: grid;
  place-items: center;
  line-height: 1;
  font-size: var(--font-body_m);
}
.qa-question .qa-marker{
  color: #3da5ff;
}
.qa-answer .qa-marker {
  color: #ff3d7b;
}
.qa-text {
  line-height: 1.5;
}
.qa-arrow {
  width: 7px;
  height: 7px;
  border-right: 3px solid ;
  border-bottom: 3px solid ;
  transform: rotate(45deg);
  transition: transform 0.3s;
  flex-shrink: 0;
}
.qa-item{
  border: 1px solid #feeaa9;
}
.qa-item[open] .qa-arrow {
  transform: rotate(225deg);
}
.qa-answer {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  padding: 32px 24px 32px 16px;
}
.qa-answer-text {
  margin: 0;
  color: #333;
  line-height: 1.6;
}
@media screen and (max-width: 1024px) {
  .--faq .section-inner::before {
  top: calc(-250px /2.3);
}
}
/* サポート */
.section-wrapper.--support {
  padding: 3rem 1rem;
  background: #fff;
  text-align: center;
}

.section-inner.--support_list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: center;
  margin-top: 2rem;
}
.--support_list .section-container {
  display: flex;
  background: #fff;
  border: 3px solid #F4AB33;
  text-decoration: none;
  color: #333;
  width: 100%;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  padding: 16px;
  gap: 8px;
}
@media screen and (min-width: 1024px) {
.--support_list .section-container {
    max-width: calc((100% - 40px)/2);
}
}
/* .--support_list .section-container:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
} */
.--support_list .item-img-wrap {
  flex: 0 0 141px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.--support_list .item-img-wrap > img{
    width: min(180px, 100%);
    aspect-ratio: 280 / 200;
}
.--support_list .item-desc-wrap {
  flex: 1;
  text-align: left;
}
.--support_list .item-desc-wrap .item-ttl {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
  text-decoration: underline;
  color: #01A5FF;
}
.--support_list .item-desc-wrap .item-desc {
  font-size: 14px;
  line-height: 1.6;
}
@media screen and (max-width: 1024px) {
.--support_list .section-container {
    flex-direction: column;
}
.--support_list .item-desc-wrap .item-ttl {
  text-align: center;
}
}
/* フッター */
.footer {
  background: #fff;
  padding: 2rem 1rem;
  text-align: center;
}

.footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

.footer-logo img {
  height: 50px;
}

.footer-nav {
  flex: 1;
  text-align: right;
}

.footer-nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 30px;
  list-style: none;
}

.footer-nav ul li a {
  color: #333;
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s;
}

.footer-nav ul li a:hover {
  color: #F4AB33;
}

.footer-copyright {
  border-top: 1px solid #ccc;
  padding-top: 24px;
  font-size: 14px;
  color: #666;
  width: 100%;
  text-align: center;
  margin-top: 1rem;
}
@media screen and (max-width: 1024px) {
  .footer-inner{
    flex-direction: column;
    justify-content: center;
  }
  .footer-nav{
    margin: 32px auto;
    text-align: left;
  }
  .footer-nav ul li{
    width: calc((100% - 16px * 1) / 2);
  }
  .footer-nav ul {
    justify-content: flex-start;
    gap: 16px;}
}