html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q,
blockquote {
  quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: '';
  content: none;
}

a img {
  border: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

* {
  box-sizing: border-box;
  -webkit-appearance: none;
}

:root {
  --black: #1a222c;
  --ff: 'Noto Sans JP', sans-serif;
}

html {
  scroll-padding-top: 84px;
}

body {
  font-optical-sizing: auto;
  color: var(--black);
  font-family: var(--ff);
  font-weight: 400;
  line-height: 2;
  font-size: 16px;
  padding-top: 84px;
}

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

a {
  text-decoration: none;
  color: var(--black);
}

.w1288 {
  max-width: 1288px;
  margin-left: auto;
  margin-right: auto;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.ttl01 {
  text-align: center;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 30px;
}
.ttl01:has(+ .lead) {
  margin-bottom: 16px;
}
.ttl01 span {
  display: block;
}
.ttl01 .en {
  color: #048cf2;
  margin-bottom: 18px;
  font-family: 'Outfit', sans-serif;
  letter-spacing: 0.05em;
}
.ttl01 .ja {
  font-size: 32px;
}
.ttl01 + .lead {
  text-align: center;
  font-size: 24px;
  color: #757a80;
  font-weight: 500;
}

#header {
  line-height: 1;
  background: #fff;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}
#header .w1288 {
  display: flex;
  justify-content: space-between;
  height: 84px;
  align-items: center;
}
#header .logo a:hover {
  opacity: 0.8;
}
#header .buttons {
  display: flex;
  gap: 0 24px;
}
#header .buttons a {
  height: 51px;
  text-align: center;
  font-weight: bold;
  border-radius: 8px;
  display: block;
  padding-top: 10px;
}
#header .buttons a span {
  font-size: 14px;
  display: block;
}
#header .buttons a span:first-child {
  font-size: 10px;
  margin-bottom: 5px;
}
#header .buttons .demo_btn {
  width: 138px;
  border: solid 1px #048cf2;
  color: #048cf2;
}
#header .buttons .demo_btn:hover {
  background: #eff8ff;
}
#header .buttons .download_btn {
  width: 160px;
  color: #fff;
  background: linear-gradient(to right bottom, #f9a23b, #f9844d);
}
#header .buttons .download_btn:hover {
  background: linear-gradient(to right bottom, #f9814d, #f65c5e);
}

#footer {
  padding: 65px 0 176px;
  background: url(../img/footer.svg) repeat-x left bottom/1400px auto;
}
#footer .w1288 {
  display: flex;
  justify-content: space-between;
}
#footer .left_column .f_logo {
  line-height: 1;
  margin-bottom: 16px;
}
#footer .left_column .f_logo a:hover {
  opacity: 0.8;
}
#footer .left_column .f_logo_text {
  font-weight: bold;
  color: #757a80;
  line-height: 1;
}
#footer .right_column {
  line-height: 1;
}
#footer .right_column ul {
  display: flex;
  justify-content: flex-end;
  font-size: 14px;
  margin-bottom: 24px;
}
#footer .right_column ul li:not(:last-child):after {
  content: '|';
  color: #b9bcbf;
  display: inline-block;
  margin: 0 16px;
}
#footer .right_column ul a:hover {
  text-decoration: underline;
  color: #048cf2;
}
#footer .right_column ul a[target='_blank'] {
  padding-right: 18px;
  background: url(../img/blank.svg) no-repeat center right/12px auto;
}
#footer .right_column ul a[target='_blank']:hover {
  background-image: url(../img/blank_blue.svg);
}
#footer .right_column small {
  display: block;
  max-width: fit-content;
  margin-left: auto;
  font-size: 14px;
  font-family: 'Outfit', sans-serif;
}

@media screen and (min-width: 768px) and (max-width: 1300px) {
  html {
    scroll-padding-top: calc(84 / 1340 * 100vw);
  }
  body {
    font-size: calc(16 / 1340 * 100vw);
    padding-top: calc(84 / 1340 * 100vw);
  }
  .w1288 {
    max-width: calc(1280 / 1340 * 100vw);
  }
  .ttl01 {
    margin-bottom: calc(30 / 1340 * 100vw);
  }
  .ttl01:has(+ .lead) {
    margin-bottom: calc(16 / 1340 * 100vw);
  }
  .ttl01 .en {
    margin-bottom: calc(18 / 1340 * 100vw);
  }
  .ttl01 .ja {
    font-size: calc(32 / 1340 * 100vw);
  }
  .ttl01 + .lead {
    font-size: calc(24 / 1340 * 100vw);
  }
  #header .w1288 {
    height: calc(84 / 1340 * 100vw);
  }
  #header .logo img {
    max-width: calc(220 / 1340 * 100vw);
  }
  #header .buttons {
    gap: 0 calc(24 / 1340 * 100vw);
  }
  #header .buttons a {
    height: calc(51 / 1340 * 100vw);
    border-radius: calc(8 / 1340 * 100vw);
    padding-top: calc(10 / 1340 * 100vw);
  }
  #header .buttons a span {
    font-size: calc(14 / 1340 * 100vw);
  }
  #header .buttons a span:first-child {
    font-size: calc(10 / 1340 * 100vw);
    margin-bottom: calc(5 / 1340 * 100vw);
  }
  #header .buttons .demo_btn {
    width: calc(138 / 1340 * 100vw);
    border: solid calc(1 / 1340 * 100vw) #048cf2;
    color: #048cf2;
  }
  #header .buttons .demo_btn:hover {
    background: #eff8ff;
  }
  #header .buttons .download_btn {
    width: calc(160 / 1340 * 100vw);
  }
  #footer {
    padding: calc(65 / 1340 * 100vw) 0 calc(176 / 1340 * 100vw);
    background: url(../img/footer.svg) repeat-x left
      bottom/calc(1400 / 1340 * 100vw) auto;
  }
  #footer .left_column .f_logo {
    margin-bottom: calc(16 / 1340 * 100vw);
  }
  #footer .left_column .f_logo img {
    max-width: calc(220 / 1340 * 100vw);
  }
  #footer .right_column ul {
    font-size: calc(14 / 1340 * 100vw);
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #footer .right_column ul li:not(:last-child):after {
    margin: 0 calc(16 / 1340 * 100vw);
  }
  #footer .right_column ul a[target='_blank'] {
    padding-right: calc(18 / 1340 * 100vw);
    background: url(../img/blank.svg) no-repeat center
      right/calc(12 / 1340 * 100vw) auto;
  }
  #footer .right_column small {
    font-size: calc(14 / 1340 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .sp_block {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: calc(57 / 375 * 100vw);
  }
  body {
    font-size: calc(16 / 375 * 100vw);
    padding-top: calc(57 / 375 * 100vw);
  }
  .w1288 {
    max-width: 100%;
    padding-left: calc(16 / 375 * 100vw);
    padding-right: calc(16 / 375 * 100vw);
  }
  .ttl01 {
    margin-bottom: calc(16 / 375 * 100vw);
  }
  .ttl01 .en {
    font-size: calc(16 / 375 * 100vw);
    margin-bottom: calc(12 / 375 * 100vw);
  }
  .ttl01 .ja {
    font-size: calc(24 / 375 * 100vw);
  }
  .ttl01 + .lead {
    font-size: calc(16 / 375 * 100vw);
    line-height: 1.5;
  }
  #header .w1288 {
    height: calc(57 / 375 * 100vw);
  }
  #header .logo img {
    max-width: 100%;
    width: calc(138 / 375 * 100vw);
  }
  #header nav {
    display: none;
  }
  #footer {
    padding-bottom: calc(130 / 375 * 100vw);
    background-size: auto calc(64 / 375 * 100vw);
  }
  #footer .w1288 {
    display: block;
  }
  #footer .w1288 .left_column {
    text-align: center;
    margin-bottom: calc(78 / 375 * 100vw);
  }
  #footer .w1288 .left_column .f_logo {
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #footer .w1288 .left_column .f_logo img {
    width: calc(220 / 375 * 100vw);
  }
  #footer .w1288 .left_column .f_logo_text {
    font-size: calc(16 / 375 * 100vw);
  }
  #footer .w1288 .right_column ul {
    display: grid;
    justify-content: center;
    text-align: center;
    gap: calc(24 / 375 * 100vw) 0;
    margin-bottom: calc(45 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
  #footer .w1288 .right_column ul li:after {
    content: none;
  }
  #footer .w1288 .right_column a[target='_blank'] {
    padding-right: calc(18 / 375 * 100vw);
    background: url(../img/blank.svg) no-repeat center
      right/calc(12 / 375 * 100vw) auto;
  }
  #footer .w1288 .right_column a[target='_blank']:hover {
    background-image: url(../img/blank_blue.svg);
  }
  #footer .w1288 .right_column small {
    margin-right: auto;
    font-size: calc(14 / 375 * 100vw);
  }
}
#mv {
  position: relative;
  background: url(../img/mv_bg.svg) no-repeat right top/809px auto,
    linear-gradient(
      135deg,
      rgb(30, 200, 194) 0%,
      rgb(4, 140, 242) 50%,
      rgb(4, 140, 242) 100%
    );
  height: 646px;
  overflow: hidden;
}
#mv:after {
  position: absolute;
  content: '';
  display: block;
  height: auto;
  width: 770px;
  aspect-ratio: 3204/1948;
  background: url(../img/mv_img.png) no-repeat left top/100% auto;
  top: 77px;
  left: calc(50% + 16px);
}
#mv .mv_ttl {
  padding-top: 105px;
  margin-bottom: 25px;
}
#mv h3 {
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  line-height: 1.4583333333;
  margin-bottom: 40px;
}
#mv .buttons {
  display: flex;
  gap: 0 24px;
  line-height: 1;
}
#mv .buttons a {
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 22px;
  border-radius: 8px;
  padding-top: 18px;
}
#mv .buttons a span {
  display: block;
}
#mv .buttons a span:first-child {
  font-size: 14px;
  margin-bottom: 8px;
}
#mv .download_btn {
  width: 260px;
  height: 84px;
  background: #fff;
  color: #048cf2;
}
#mv .download_btn:hover {
  background: #0078de;
  color: #fff;
}
#mv .demo_btn {
  width: 206px;
  height: 84px;
  color: #fff;
  border: solid 2px #fff;
}
#mv .demo_btn:hover {
  background: #fff;
  color: #048cf2;
}

#issues {
  padding: 65px 0;
}
#issues .ttl01 {
  margin: 0 auto 65px;
  max-width: fit-content;
  position: relative;
}
#issues .ttl01:before,
#issues .ttl01:after {
  position: absolute;
  content: '';
  display: block;
  width: 4px;
  height: 64px;
  bottom: -10px;
}
#issues .ttl01:before {
  background: #048cf2;
  transform: rotate(-30deg);
  left: -35px;
}
#issues .ttl01:after {
  background: #1fc8c2;
  transform: rotate(-150deg);
  right: -35px;
}
#issues .grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 32px;
  line-height: 1;
}
#issues .grid > div {
  border-radius: 8px;
  padding: 42px 32px 32px;
}
#issues .grid .blue {
  background: #eff8ff;
}
#issues .grid .blue h3 {
  color: #048cf2;
}
#issues .grid .blue ul li {
  background: #fff url(../img/check_blue.svg) no-repeat 10px center/16px auto;
}
#issues .grid .blue ul:before {
  width: 130px;
  height: auto;
  aspect-ratio: 130/118;
  background: url(../img/issues_l.svg) no-repeat left top/100% auto;
  right: 5px;
  top: -118px;
}
#issues .grid .green {
  background: #e9faf9;
}
#issues .grid .green h3 {
  color: #1fc8c2;
}
#issues .grid .green ul li {
  background: #fff url(../img/check_green.svg) no-repeat 10px center/16px auto;
}
#issues .grid .green ul:before {
  width: 120px;
  height: auto;
  aspect-ratio: 120/118;
  background: url(../img/issues_r.svg) no-repeat left top/100% auto;
  right: 21px;
  top: -118px;
}
#issues .grid h3 {
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 16px;
}
#issues .grid ul {
  display: grid;
  gap: 8px 0;
  position: relative;
}
#issues .grid ul:before {
  position: absolute;
  content: '';
  display: block;
}
#issues .grid ul li {
  background: #fff;
  border-radius: 4px;
  font-size: 18px;
  font-weight: bold;
  box-shadow: 0 2px 2px rgba(26, 34, 44, 0.05);
  padding: 11px 0 13px 34px;
  letter-spacing: 0.05em;
}

#solutions {
  background: #f5f5f5;
  padding: 64px 0 80px;
}
#solutions .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  line-height: 1;
  margin-top: 30px;
  gap: 0 32px;
}
#solutions .grid > div {
  margin-bottom: 42px;
}
#solutions .grid > div:before {
  display: block;
  content: '';
  width: 100%;
  height: 240px;
  background: #fff;
  border: solid 1px #e3e3e3;
  border-radius: 8px;
  margin-bottom: 16px;
}
#solutions .grid > div:nth-child(1):before {
  background: #fff url(../img/solutions01.svg) no-repeat 106px center/218px auto;
}
#solutions .grid > div:nth-child(2):before {
  background: #fff url(../img/solutions02.svg) no-repeat center 23px/182px auto;
}
#solutions .grid > div:nth-child(3):before {
  background: #fff url(../img/solutions03.svg) no-repeat center 36px/260px auto;
}
#solutions .grid p {
  text-align: center;
  font-weight: bold;
  font-size: 24px;
  padding-bottom: 44px;
  background: url(../img/arrow01.svg) no-repeat center bottom/22px auto;
}
#solutions .grid p span {
  display: inline-block;
  border-bottom: solid 5px #fa8f47;
  padding-bottom: 5px;
}
#solutions .bottom_text {
  position: relative;
  font-weight: bold;
  font-size: 32px;
  color: #048cf2;
  background: #fff;
  height: 110px;
  display: flex;
  align-items: center;
  padding-left: 236px;
  max-width: 1132px;
  margin: 0 auto;
  border-radius: 55px;
  border: solid 4px #048cf2;
}
#solutions .bottom_text:before {
  position: absolute;
  bottom: -4px;
  left: 97px;
  content: '';
  display: block;
  width: 116px;
  height: auto;
  aspect-ratio: 116/135;
  background: url(../img/solutions04.svg) no-repeat left top/100% auto;
}

#framework {
  padding: 64px 0 230px;
  background: url(../img/bg_framework01.svg) no-repeat left top/656px auto,
    url(../img/bg_framework02.svg) no-repeat center bottom/640px auto,
    url(../img/bg_framework03.svg) no-repeat center bottom 250px/640px auto,
    #eff8ff;
}
#framework .ttl01 {
  margin-bottom: 68px;
}
#framework .w_step {
  position: relative;
  width: 1160px;
  height: 945px;
  margin-left: auto;
  margin-right: auto;
}
#framework .step {
  position: absolute;
  background: #fff;
  line-height: 1;
  border-radius: 16px;
  border: solid 3px #000;
  font-weight: bold;
  box-shadow: 0 4px 8px rgba(26, 34, 44, 0.16);
}
#framework .step .label {
  position: absolute;
  font-family: 'Outfit', sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90px;
  height: 52px;
  border-radius: 50px;
  top: -26px;
  left: -20px;
  background: #000;
  color: #fff;
  box-shadow: 0 4px 8px rgba(26, 34, 44, 0.16);
}
#framework .step h3 {
  font-size: 24px;
  margin-bottom: 10px;
}
#framework .step h3 + p {
  line-height: 1.5;
}
#framework .step01 {
  border-color: #7e7cf9;
  width: 470px;
  height: 152px;
  left: 50%;
  transform: translate(-50%, 0);
  top: 0;
  padding-top: 45px;
  padding-left: 32px;
  background: #fff url(../img/step01.svg) no-repeat right 32px top 30px/110px
    auto;
}
#framework .step01 h3 {
  color: #7e7cf9;
}
#framework .step01 .label {
  background: #7e7cf9;
}
#framework .step01:after {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: -48px;
  content: '';
  display: block;
  width: 22px;
  height: 28px;
  background: url(../img/arrow02.svg) no-repeat left top/100% auto;
}
#framework .step02 {
  border-color: #048cf2;
  width: 541px;
  height: 152px;
  left: 50%;
  transform: translate(-50%, 0);
  top: 222px;
  padding-top: 45px;
  padding-left: 32px;
  background: #fff url(../img/step02.svg) no-repeat right 32px center/118px auto;
}
#framework .step02 h3 {
  color: #048cf2;
}
#framework .step02 .label {
  background: #048cf2;
}
#framework .step03,
#framework .step04 {
  padding-top: 128px;
  width: 352px;
  height: 251px;
  text-align: center;
  bottom: 212px;
}
#framework .step03 {
  border-color: #fa8f47;
  right: 0;
  background: #fff url(../img/step03.svg) no-repeat center 28px/115px auto;
}
#framework .step03 h3 {
  color: #fa8f47;
}
#framework .step03 .label {
  background: #fa8f47;
}
#framework .step04 {
  border-color: #1fc8c2;
  left: 0;
  background: #fff url(../img/step04.svg) no-repeat center 28px/180px auto;
}
#framework .step04 h3 {
  color: #1fc8c2;
}
#framework .step04 .label {
  background: #1fc8c2;
}
#framework .cycle {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  top: 423px;
  width: 360px;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
  text-align: center;
  line-height: 1;
  font-weight: bold;
  font-size: 24px;
  color: #048cf2;
  padding-top: 240px;
  box-shadow: 0 0 16px rgba(26, 34, 44, 0.08);
  background: #fff url(../img/cycle_logo.svg) no-repeat center 95px/140px auto;
}
#framework .bottom_text {
  position: absolute;
  width: 950px;
  height: 110px;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
  background: #048cf2;
  color: #fff;
  font-weight: bold;
  font-size: 32px;
  border-radius: 60px;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
#framework .bottom_text span {
  display: inline-block;
  padding-left: 55px;
  background: url(../img/ic_up.svg) no-repeat left center/40px auto;
}

.w_cta_btn {
  padding: 64px 0 32px;
  background: #fff;
}
.w_cta_btn a {
  position: relative;
  color: #fff;
  font-weight: bold;
  border-radius: 16px;
  display: block;
  width: 630px;
  height: 168px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 0 4px 8px rgba(26, 34, 44, 0.16);
  background: url(../img/cta_img.png) no-repeat 4px 11px/224px auto,
    linear-gradient(45deg, #f9a23b, #f9844d);
}
.w_cta_btn a:hover {
  background: url(../img/cta_img.png) no-repeat 4px 11px/224px auto,
    linear-gradient(45deg, #f9814d, #f65c5e);
}
.w_cta_btn a:hover .text03 {
  color: #f65e5e;
}
.w_cta_btn a span {
  position: absolute;
}
.w_cta_btn a .text01 {
  top: 43px;
  left: 295px;
}
.w_cta_btn a .text01:after,
.w_cta_btn a .text01:before {
  position: absolute;
  content: '';
  display: block;
  width: 2px;
  height: 24px;
  background: #fff;
  bottom: 3px;
}
.w_cta_btn a .text01:before {
  transform: rotate(-30deg);
  left: -18px;
}
.w_cta_btn a .text01:after {
  transform: rotate(30deg);
  right: -18px;
}
.w_cta_btn a .text02 {
  left: 240px;
  top: 64px;
  font-size: 32px;
}
.w_cta_btn a .text03 {
  display: block;
  color: #fa8f47;
  font-size: 24px;
  width: 92px;
  height: 51px;
  background: #fff;
  border-radius: 8px;
  text-align: center;
  line-height: 51px;
  padding-left: 12px;
  right: 32px;
  top: 70px;
}

#function {
  padding: 32px 0 64px;
}
#function .ttl01 + p {
  text-align: center;
  margin-bottom: 48px;
}
#function .function {
  min-height: 480px;
  display: flex;
  align-items: center;
  padding-right: 660px;
  margin-bottom: 64px;
}
#function .function:last-child {
  margin-bottom: 0;
}
#function .function.reverse {
  padding-right: 0;
  padding-left: 660px;
}
#function .function .label {
  max-width: fit-content;
  line-height: 1;
  font-weight: bold;
  background: #f8f8f8;
  border-radius: 8px;
  padding: 8px 16px 10px;
  margin-bottom: 10px;
}
#function .function h3 {
  display: flex;
  align-items: center;
  font-weight: bold;
  gap: 0 16px;
  margin-bottom: 25px;
}
#function .function h3 .num {
  font-family: 'Outfit', sans-serif;
  font-size: 32px;
  background: #000;
  color: #fff;
  width: 74px;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.025em;
}
#function .function h3 .ttl {
  font-size: 32px;
}
#function .function h4 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
  line-height: 1.4444444444;
}
#function .function01 {
  background: url(../img/function01.png) no-repeat right center/628px auto;
}
#function .function01 .label {
  background: #f2f2fe;
  color: #7e7cf9;
}
#function .function01 h3 .num {
  background: #7e7cf9;
}
#function .function01 h4 {
  color: #7e7cf9;
}
#function .function02 {
  background: url(../img/function02.png) no-repeat left center/628px auto;
}
#function .function02 .label {
  background: #eff8ff;
  color: #048cf2;
}
#function .function02 h3 .num {
  background: #048cf2;
}
#function .function02 h4 {
  color: #048cf2;
}
#function .function03 {
  background: url(../img/function03.png) no-repeat right center/628px auto;
}
#function .function03 .label {
  background: #fef4ed;
  color: #fa8f47;
}
#function .function03 h3 .num {
  background: #fa8f47;
}
#function .function03 h4 {
  color: #fa8f47;
}
#function .function04 {
  background: url(../img/function04.png) no-repeat left center/628px auto;
}
#function .function04 .label {
  background: #e9fbf9;
  color: #1fc8c2;
}
#function .function04 h3 .num {
  background: #1fc8c2;
}
#function .function04 h4 {
  color: #1fc8c2;
}

#function_list {
  background: #048cf2;
  padding: 64px 0 80px;
}
#function_list h2 {
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 45px;
}
#function_list ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
#function_list ul li {
  overflow: hidden;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(26, 34, 44, 0.3);
  text-align: center;
  padding-top: 212px;
}
#function_list ul li:nth-child(1) {
  background: #fff url(../img/fl01.svg) no-repeat center 32px/180px auto;
}
#function_list ul li:nth-child(2) {
  background: #fff url(../img/fl02.svg) no-repeat center 32px/180px auto;
}
#function_list ul li:nth-child(3) {
  background: #fff url(../img/fl03.svg) no-repeat center 32px/180px auto;
}
#function_list ul li:nth-child(4) {
  background: #fff url(../img/fl04.svg) no-repeat center 32px/180px auto;
}
#function_list ul li:nth-child(5) {
  background: #fff url(../img/fl05.svg) no-repeat center 32px/180px auto;
}
#function_list ul li:nth-child(6) {
  background: #fff url(../img/fl06.svg) no-repeat center 32px/180px auto;
}
#function_list ul div {
  background: #f5f5f5;
  padding: 16px 24px 32px;
}
#function_list ul h3 {
  font-weight: bold;
  font-size: 18px;
  line-height: 1;
  margin-bottom: 16px;
}
#function_list ul p {
  font-size: 14px;
  line-height: 1.5714285714;
}

#feature {
  padding: 32px 0 64px;
}
#feature .ttl01 {
  margin-bottom: 24px;
}
#feature .ttl01 + p {
  text-align: center;
  margin-bottom: 36px;
}
#feature .feature {
  height: 352px;
  display: flex;
  align-items: center;
  border-radius: 16px;
  background: #eff8ff;
  padding-left: 64px;
  margin-bottom: 32px;
}
#feature .feature:last-child {
  margin-bottom: 0;
}
#feature .feature > div {
  max-width: 720px;
}
#feature .feature h3 {
  line-height: 1;
  display: flex;
  gap: 24px;
  align-items: center;
  font-weight: bold;
  margin-bottom: 20px;
}
#feature .feature h3 .label {
  width: 83px;
  height: 56px;
  text-align: center;
  line-height: 56px;
  background: #048cf2;
  color: #fff;
  display: block;
  border-radius: 50px;
}
#feature .feature h3 .ttl {
  font-weight: bold;
  font-size: 24px;
  color: #048cf2;
}
#feature .feature p {
  line-height: 1.5;
}
#feature .feature01 {
  background: #eff8ff url(../img/feature01-2.png) no-repeat right 64px
    center/393px auto;
}
#feature .feature02 {
  background: #eff8ff url(../img/feature02-2.png) no-repeat right 64px
    center/393px auto;
}
#feature .feature03 {
  background: #eff8ff url(../img/feature03-2.png) no-repeat right 64px
    center/393px auto;
}

.cta {
  background: url(../img/bg_cta2.png) no-repeat center left calc(50% + 375px) /
      591px auto,
    url(../img/bg_cta.jpg) no-repeat center/cover;
}
.cta .w1288 {
  height: 498px;
  display: flex;
  align-items: center;
}
.cta .w1288 > div {
  width: 628px;
}
.cta h2,
.cta h3,
.cta p {
  color: #fff;
  line-height: 1;
  text-align: center;
}
.cta h2 {
  font-weight: 500;
  font-size: 24px;
  margin-bottom: 15px;
}
.cta h3 {
  font-weight: bold;
  font-size: 40px;
  margin-bottom: 26px;
}
.cta h3 span {
  font-family: 'Outfit', sans-serif;
}
.cta p {
  font-weight: bold;
  font-size: 20px;
}
.cta .buttons {
  display: flex;
  gap: 0 24px;
  line-height: 1;
  max-width: fit-content;
  margin: 0 auto 32px;
}
.cta .buttons a {
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 22px;
  border-radius: 8px;
  padding-top: 18px;
}
.cta .buttons a span {
  display: block;
}
.cta .buttons a span:first-child {
  font-size: 14px;
  margin-bottom: 8px;
}
.cta .download_btn {
  width: 260px;
  height: 84px;
  background: #fff;
  color: #048cf2;
}
.cta .download_btn:hover {
  background: #0078de;
  color: #fff;
}
.cta .demo_btn {
  width: 206px;
  height: 84px;
  color: #fff;
  border: solid 2px #fff;
}
.cta .demo_btn:hover {
  background: #fff;
  color: #048cf2;
}

#flow {
  padding: 64px 0;
}
#flow .ttl01 {
  margin-bottom: 24px;
}
#flow .ttl01 + p {
  margin-bottom: 32px;
  line-height: 1.4;
  text-align: center;
}
#flow ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0 32px;
}
#flow ul li {
  position: relative;
  border-radius: 8px;
  box-shadow: 0 0 16px rgba(26, 34, 44, 0.08);
  min-height: 417px;
  text-align: center;
  padding: 256px 32px 32px;
}
#flow ul li:nth-child(1) {
  background: url(../img/flow01.svg) no-repeat center 32px/200px auto;
}
#flow ul li:nth-child(2) {
  background: url(../img/flow02.svg) no-repeat center 32px/200px auto;
}
#flow ul li:nth-child(3) {
  background: url(../img/flow03.svg) no-repeat center 32px/200px auto;
}
#flow ul li:nth-child(4) {
  background: url(../img/flow04.svg) no-repeat center 32px/200px auto;
}
#flow ul .num {
  font-family: 'Outfit', sans-serif;
  height: auto;
  width: 57px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  font-weight: bold;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  position: absolute;
  top: 16px;
  left: 16px;
  background: #1a222c;
  letter-spacing: 0.05em;
}
#flow ul h3 {
  line-height: 1;
  font-weight: bold;
  text-align: center;
  margin-bottom: 14px;
  font-size: 18px;
}
#flow ul .text {
  font-size: 14px;
  color: #757a80;
  line-height: 1.5714285714;
}

#price {
  padding: 64px 0 80px;
  background: #eff8ff url(../img/bg_price.svg) no-repeat right bottom/656px auto;
}
#price .ttl01 {
  margin-bottom: 24px;
}
#price .ttl01 + p {
  margin-bottom: 48px;
  line-height: 1.4;
  text-align: center;
}
#price ul {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32px;
  font-weight: bold;
  line-height: 1;
  gap: 32px;
  margin-bottom: 24px;
}
#price ul li:first-child,
#price ul li:last-child {
  width: 256px;
  height: 110px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
}
#price ul li:first-child {
  background: #048cf2;
  color: #fff;
}
#price ul li:last-child {
  background: #fff;
  border: solid 4px #048cf2;
  color: #048cf2;
}
#price .bottom_text {
  text-align: center;
  font-weight: 500;
}

#faq {
  padding: 64px 0;
}
#faq .ttl01 {
  margin-bottom: 35px;
}
#faq .qa {
  border: solid 1px #eaecef;
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 24px;
}
#faq .qa:last-child {
  margin-bottom: 0;
}
#faq .qa .ic_q,
#faq .qa .ic_a {
  position: absolute;
  font-family: 'Outfit', sans-serif;
  font-size: 20px;
  font-weight: bold;
  left: 32px;
  width: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 50%;
  height: auto;
}
#faq .qa .ic_q {
  color: #fff;
  background: #1a222c;
  top: 50%;
  transform: translate(0, -50%);
}
#faq .qa .ic_a {
  top: 32px;
  background: #f5f5f5;
}
#faq .qa .q {
  background: #f5f5f5 url(../img/plus.svg) no-repeat center right 42px/20px auto;
  position: relative;
  cursor: pointer;
  padding: 32px 100px 32px 88px;
  line-height: 1.4;
}
#faq .qa .q:hover {
  background: #eeeeef url(../img/plus.svg) no-repeat center right 42px/20px auto;
}
#faq .qa .q.open {
  background-image: url(../img/minus.svg);
}
#faq .qa .q.open + .a {
  display: block;
}
#faq .qa .q:before,
#faq .qa .q:after {
  content: '';
  display: block;
}
#faq .qa .q p {
  font-weight: bold;
  font-size: 18px;
}
#faq .qa .a {
  display: none;
  position: relative;
  border-top: solid 1px #eaecef;
}
#faq .qa .a p,
#faq .qa .a div {
  line-height: 1.875;
  padding: 32px 32px 32px 88px;
}

#download_form {
  padding: 64px 0;
  background: linear-gradient(
    135deg,
    rgb(31, 201, 193) 0%,
    rgb(4, 140, 242) 80%,
    rgb(4, 140, 242) 100%
  );
}
#download_form .bg {
  background: #fff;
  border-radius: 16px;
  padding: 64px;
  display: flex;
  justify-content: space-between;
}
#download_form .bg > div {
  width: 548px;
}
#download_form .left_column h2,
#download_form .left_column h3 {
  line-height: 1;
}
#download_form .left_column h2 {
  text-align: center;
  font-weight: 500;
  font-size: 24px;
  margin-bottom: 15px;
}
#download_form .left_column h3 {
  font-weight: bold;
  color: #048cf2;
  font-size: 40px;
  text-align: center;
  margin-bottom: 30px;
}
#download_form .left_column h3:after {
  content: '';
  display: block;
  width: 100%;
  aspect-ratio: 548/373;
  height: auto;
  background: url(../img/form_img.jpg) no-repeat left top/100% auto;
  margin-top: 30px;
  box-shadow: 0 8px 16px rgba(26, 34, 44, 0.16);
}
#download_form .left_column h3 span {
  font-family: 'Outfit', sans-serif;
}
#download_form .left_column .box {
  background: #f8f8f8;
  border-radius: 8px;
  margin-bottom: 24px;
  padding: 28px 24px 32px;
}
#download_form .left_column .box h4 {
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  border-bottom: solid 1px #ccc;
  padding-bottom: 16px;
}
#download_form .left_column .blue {
  background: #eff8ff;
}
.page-demo #download_form .left_column .blue {
  margin-top: -60px;
}
#download_form .left_column .blue h4 {
  border-bottom-color: #b5dcfb;
  margin-bottom: 22px;
}
#download_form .left_column .blue ul {
  line-height: 1;
  display: grid;
  gap: 30px 0;
  counter-reset: number 0;
}
#download_form .left_column .blue ul li {
  position: relative;
  padding-left: 40px;
}
#download_form .left_column .blue ul li:before {
  position: absolute;
  counter-increment: number 1;
  content: counter(number);
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  font-family: 'Outfit', sans-serif;
  font-weight: bold;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #048cf2;
  width: 32px;
  aspect-ratio: 1/1;
  height: auto;
}
#download_form .left_column .green {
  background: #e9faf9;
}
#download_form .left_column .green h4 {
  margin-bottom: 22px;
  border-bottom-color: #bceeed;
}
#download_form .left_column .green ul {
  line-height: 1;
  display: grid;
  gap: 24px 0;
}
#download_form .left_column .green ul li {
  padding-left: 32px;
  background: url(../img/check_green.svg) no-repeat left center/16px auto;
  padding-bottom: 1px;
}

form .form_input {
  display: grid;
  gap: 30px 0;
}
form .form_input label {
  display: block;
  font-weight: bold;
  margin-bottom: 9px;
  line-height: 1;
}
form .form_input label span {
  display: inline-block;
  font-size: 12px;
  width: 36px;
  height: 22px;
  text-align: center;
  line-height: 22px;
  background: #f44369;
  color: #fff;
  border-radius: 4px;
  margin-left: 8px;
}
form .form_input input[type='text'],
form .form_input input[type='tel'],
form .form_input input[type='email'],
form .form_input select,
form .form_input textarea {
  display: block;
  width: 100%;
  font-family: inherit;
  font-size: inherit;
  border: solid 1px #c9c9c9;
  border-radius: 8px;
  line-height: 1.6;
  padding: 7px 16px 8px;
}
form .form_input input[type='text'].error,
form .form_input input[type='tel'].error,
form .form_input input[type='email'].error,
form .form_input select.error,
form .form_input textarea.error {
  border-color: #f44369;
}
#checkbox.error {
  border-color: #f44369;
}
form .form_input input[type='text']::placeholder,
form .form_input input[type='tel']::placeholder,
form .form_input input[type='email']::placeholder,
form .form_input select::placeholder,
form .form_input textarea::placeholder {
  color: #b9bcbf;
}
form .form_input input[type='text']:focus,
form .form_input input[type='tel']:focus,
form .form_input input[type='email']:focus,
form .form_input select:focus,
form .form_input textarea:focus {
  border-color: #fff;
  outline: solid 2px #048cf2;
}
form .form_input select {
  background: url(../img/select_arrow.svg) no-repeat center right 16px/14px auto;
}
form .form_input textarea {
  resize: vertical;
  height: 92px;
}
form .form_input .error_text {
  color: #f44369;
  font-weight: 600;
  font-size: 12px;
  border-radius: 4px;
  background: #feecf0;
  margin-top: 8px;
  padding: 4px 16px 5px;
}
.error_text {
  color: #f44369;
  font-weight: 600;
  font-size: 12px;
  border-radius: 4px;
  background: #feecf0;
  margin-top: 8px;
  padding: 4px 16px 5px;
}
form .is_privacy {
  font-size: 14px;
  display: flex;
  align-items: center;
  margin-top: 28px;
  /* margin-bottom: 26px; */
}
.c_button {
  margin-top: 26px;
}
form .is_privacy input[type='checkbox'] {
  display: none;
}
form .is_privacy input[type='checkbox']:checked + label {
  border-color: #048cf2;
  background: url(../img/input_check.svg) no-repeat center/115%;
}
form .is_privacy input[type='checkbox']:disabled + label {
  border-color: #e3e3e3;
  background: #f5f5f5;
}
form .is_privacy input[type='checkbox']:checked:disabled + label {
  border-color: #b9bcbf;
  background: url(../img/input_check_disabled.svg) no-repeat center/115%;
}
form .is_privacy label {
  width: 18px;
  height: 18px;
  border-radius: 3px;
  border: solid 2px #b9bcbf;
  display: inline-block;
  margin-right: 8px;
}
form .is_privacy label:hover {
  background: #f5f5f5;
}
form .is_privacy a {
  text-decoration: underline;
  background: url(../img/blank.svg) no-repeat center right/12px auto;
  padding-right: 18px;
  margin-right: 8px;
}
form .is_privacy a:hover {
  color: #048cf2;
  background-image: url(../img/blank_blue.svg);
}
form button {
  font-weight: bold;
  border: none;
  font-family: inherit;
  width: 100%;
  cursor: pointer;
  font-size: 20px;
  color: #fff;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 78px;
  background: linear-gradient(
    318deg,
    rgb(250, 143, 71) 0%,
    rgb(250, 143, 71) 60%,
    rgb(249, 178, 49) 100%
  );
}
form button:hover {
  background: linear-gradient(45deg, #f9814d, #f65c5e);
}

@media screen and (min-width: 768px) and (max-width: 1300px) {
  #mv {
    background: url(../img/mv_bg.svg) no-repeat right
        top/calc(700 / 1340 * 100vw) auto,
      linear-gradient(
        135deg,
        rgb(30, 200, 194) 0%,
        rgb(4, 140, 242) 50%,
        rgb(4, 140, 242) 100%
      );
    height: calc(646 / 1340 * 100vw);
  }
  #mv:after {
    width: calc(802 / 1340 * 100vw);
    aspect-ratio: 802/488;
    top: calc(77 / 1340 * 100vw);
    left: 46%;
  }
  #mv .mv_ttl {
    padding-top: calc(105 / 1340 * 100vw);
    margin-bottom: calc(25 / 1340 * 100vw);
  }
  #mv .mv_ttl img {
    max-width: calc(486 / 1340 * 100vw);
  }
  #mv h3 {
    font-size: calc(24 / 1340 * 100vw);
    margin-bottom: calc(40 / 1340 * 100vw);
  }
  #mv .buttons {
    gap: 0 calc(24 / 1340 * 100vw);
  }
  #mv .buttons a {
    font-size: calc(22 / 1340 * 100vw);
    border-radius: calc(8 / 1340 * 100vw);
    padding-top: calc(18 / 1340 * 100vw);
  }
  #mv .buttons a span:first-child {
    font-size: calc(14 / 1340 * 100vw);
    margin-bottom: calc(8 / 1340 * 100vw);
  }
  #mv .download_btn {
    width: calc(260 / 1340 * 100vw);
    height: calc(84 / 1340 * 100vw);
  }
  #mv .demo_btn {
    width: calc(206 / 1340 * 100vw);
    height: calc(84 / 1340 * 100vw);
    border: solid calc(2 / 1340 * 100vw) #fff;
  }
  #mv .demo_btn:hover {
    background: #fff;
    color: #048cf2;
  }
  #issues {
    padding: calc(65 / 1340 * 100vw) 0;
  }
  #issues .ttl01 {
    margin: 0 auto calc(65 / 1340 * 100vw);
  }
  #issues .ttl01:before,
  #issues .ttl01:after {
    position: absolute;
    width: calc(4 / 1340 * 100vw);
    height: calc(64 / 1340 * 100vw);
    bottom: calc(-10 / 1340 * 100vw);
  }
  #issues .ttl01:before {
    left: calc(-35 / 1340 * 100vw);
  }
  #issues .ttl01:after {
    right: calc(-35 / 1340 * 100vw);
  }
  #issues .grid {
    gap: 0 calc(32 / 1340 * 100vw);
  }
  #issues .grid > div {
    border-radius: calc(8 / 1340 * 100vw);
    padding: calc(42 / 1340 * 100vw) calc(32 / 1340 * 100vw)
      calc(32 / 1340 * 100vw);
  }
  #issues .grid .blue ul li {
    background: #fff url(../img/check_blue.svg) no-repeat
      calc(10 / 1340 * 100vw) center/calc(16 / 1340 * 100vw) auto;
  }
  #issues .grid .blue ul:before {
    width: calc(130 / 1340 * 100vw);
    right: calc(5 / 1340 * 100vw);
    top: calc(-118 / 1340 * 100vw);
  }
  #issues .grid .green ul li {
    background: #fff url(../img/check_green.svg) no-repeat
      calc(10 / 1340 * 100vw) center/calc(16 / 1340 * 100vw) auto;
  }
  #issues .grid .green ul:before {
    width: calc(120 / 1340 * 100vw);
    right: calc(21 / 1340 * 100vw);
    top: calc(-118 / 1340 * 100vw);
  }
  #issues .grid h3 {
    font-size: calc(24 / 1340 * 100vw);
    margin-bottom: calc(16 / 1340 * 100vw);
  }
  #issues .grid ul {
    gap: calc(8 / 1340 * 100vw) 0;
  }
  #issues .grid ul li {
    border-radius: calc(4 / 1340 * 100vw);
    font-size: calc(18 / 1340 * 100vw);
    box-shadow: 0 calc(2 / 1340 * 100vw) calc(2 / 1340 * 100vw)
      rgba(26, 34, 44, 0.05);
    padding: calc(11 / 1340 * 100vw) 0 calc(13 / 1340 * 100vw)
      calc(34 / 1340 * 100vw);
  }
  #solutions {
    padding: calc(64 / 1340 * 100vw) 0 calc(80 / 1340 * 100vw);
  }
  #solutions .grid {
    margin-top: calc(30 / 1340 * 100vw);
    gap: 0 calc(32 / 1340 * 100vw);
  }
  #solutions .grid > div {
    margin-bottom: calc(42 / 1340 * 100vw);
  }
  #solutions .grid > div:before {
    height: calc(240 / 1340 * 100vw);
    border: solid calc(1 / 1340 * 100vw) #e3e3e3;
    border-radius: calc(8 / 1340 * 100vw);
    margin-bottom: calc(16 / 1340 * 100vw);
  }
  #solutions .grid > div:nth-child(1):before {
    background: #fff url(../img/solutions01.svg) no-repeat
      calc(106 / 1340 * 100vw) center/calc(218 / 1340 * 100vw) auto;
  }
  #solutions .grid > div:nth-child(2):before {
    background: #fff url(../img/solutions02.svg) no-repeat center
      calc(23 / 1340 * 100vw) / calc(182 / 1340 * 100vw) auto;
  }
  #solutions .grid > div:nth-child(3):before {
    background: #fff url(../img/solutions03.svg) no-repeat center
      calc(36 / 1340 * 100vw) / calc(260 / 1340 * 100vw) auto;
  }
  #solutions .grid p {
    font-size: calc(24 / 1340 * 100vw);
    padding-bottom: calc(44 / 1340 * 100vw);
    background: url(../img/arrow01.svg) no-repeat center
      bottom/calc(22 / 1340 * 100vw) auto;
  }
  #solutions .grid p span {
    border-bottom: solid calc(5 / 1340 * 100vw) #fa8f47;
    padding-bottom: calc(5 / 1340 * 100vw);
  }
  #solutions .bottom_text {
    font-size: calc(32 / 1340 * 100vw);
    background: #fff;
    height: calc(110 / 1340 * 100vw);
    padding-left: calc(236 / 1340 * 100vw);
    max-width: calc(1132 / 1340 * 100vw);
    border-radius: calc(55 / 1340 * 100vw);
    border: solid calc(4 / 1340 * 100vw) #048cf2;
  }
  #solutions .bottom_text:before {
    bottom: calc(-4 / 1340 * 100vw);
    left: calc(97 / 1340 * 100vw);
    width: calc(116 / 1340 * 100vw);
    background: url(../img/solutions04.svg) no-repeat left top/100% auto;
  }
  #framework {
    padding: calc(64 / 1340 * 100vw) 0 calc(230 / 1340 * 100vw);
    background: url(../img/bg_framework01.svg) no-repeat left
        top/calc(656 / 1340 * 100vw) auto,
      url(../img/bg_framework02.svg) no-repeat center
        bottom/calc(640 / 1340 * 100vw) auto,
      url(../img/bg_framework03.svg) no-repeat center bottom
        calc(250 / 1340 * 100vw) / calc(640 / 1340 * 100vw) auto,
      #eff8ff;
  }
  #framework .ttl01 {
    margin-bottom: calc(68 / 1340 * 100vw);
  }
  #framework .w_step {
    width: calc(1160 / 1340 * 100vw);
    height: calc(945 / 1340 * 100vw);
  }
  #framework .step {
    border-radius: calc(16 / 1340 * 100vw);
    border: solid calc(3 / 1340 * 100vw) #000;
    box-shadow: 0 calc(4 / 1340 * 100vw) calc(8 / 1340 * 100vw)
      rgba(26, 34, 44, 0.16);
  }
  #framework .step .label {
    width: calc(90 / 1340 * 100vw);
    height: calc(52 / 1340 * 100vw);
    border-radius: calc(50 / 1340 * 100vw);
    top: calc(-26 / 1340 * 100vw);
    left: calc(-20 / 1340 * 100vw);
    box-shadow: 0 calc(4 / 1340 * 100vw) calc(8 / 1340 * 100vw)
      rgba(26, 34, 44, 0.16);
  }
  #framework .step h3 {
    font-size: calc(24 / 1340 * 100vw);
    margin-bottom: calc(10 / 1340 * 100vw);
  }
  #framework .step01 {
    width: calc(470 / 1340 * 100vw);
    height: calc(152 / 1340 * 100vw);
    padding-top: calc(45 / 1340 * 100vw);
    padding-left: calc(32 / 1340 * 100vw);
    background: #fff url(../img/step01.svg) no-repeat right
      calc(32 / 1340 * 100vw) top calc(30 / 1340 * 100vw) /
      calc(110 / 1340 * 100vw) auto;
    border-color: #7e7cf9;
  }
  #framework .step01 h3 {
    color: #7e7cf9;
  }
  #framework .step01 .label {
    background: #7e7cf9;
  }
  #framework .step01:after {
    bottom: calc(-48 / 1340 * 100vw);
    width: calc(22 / 1340 * 100vw);
    height: calc(28 / 1340 * 100vw);
  }
  #framework .step02 {
    border-color: #048cf2;
    width: calc(541 / 1340 * 100vw);
    height: calc(152 / 1340 * 100vw);
    top: calc(222 / 1340 * 100vw);
    padding-top: calc(45 / 1340 * 100vw);
    padding-left: calc(32 / 1340 * 100vw);
    background: #fff url(../img/step02.svg) no-repeat right
      calc(32 / 1340 * 100vw) center/calc(118 / 1340 * 100vw) auto;
  }
  #framework .step02 h3 {
    color: #048cf2;
  }
  #framework .step02 .label {
    background: #048cf2;
  }
  #framework .step03,
  #framework .step04 {
    padding-top: calc(128 / 1340 * 100vw);
    width: calc(352 / 1340 * 100vw);
    height: calc(251 / 1340 * 100vw);
    bottom: calc(212 / 1340 * 100vw);
  }
  #framework .step03 {
    border-color: #fa8f47;
    background: #fff url(../img/step03.svg) no-repeat center
      calc(28 / 1340 * 100vw) / calc(115 / 1340 * 100vw) auto;
  }
  #framework .step03 h3 {
    color: #fa8f47;
  }
  #framework .step03 .label {
    background: #fa8f47;
  }
  #framework .step04 {
    border-color: #1fc8c2;
    left: 0;
    background: #fff url(../img/step04.svg) no-repeat center
      calc(28 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #framework .step04 h3 {
    color: #1fc8c2;
  }
  #framework .step04 .label {
    background: #1fc8c2;
  }
  #framework .cycle {
    top: calc(423 / 1340 * 100vw);
    width: calc(360 / 1340 * 100vw);
    font-size: calc(24 / 1340 * 100vw);
    color: #048cf2;
    padding-top: calc(240 / 1340 * 100vw);
    box-shadow: 0 0 calc(16 / 1340 * 100vw) rgba(26, 34, 44, 0.08);
    background: #fff url(../img/cycle_logo.svg) no-repeat center
      calc(95 / 1340 * 100vw) / calc(140 / 1340 * 100vw) auto;
  }
  #framework .bottom_text {
    width: calc(950 / 1340 * 100vw);
    height: calc(110 / 1340 * 100vw);
    box-shadow: calc(5 / 1340 * 100vw) calc(5 / 1340 * 100vw)
      calc(10 / 1340 * 100vw) rgba(0, 0, 0, 0.1);
    font-size: calc(32 / 1340 * 100vw);
    border-radius: calc(60 / 1340 * 100vw);
  }
  #framework .bottom_text span {
    padding-left: calc(55 / 1340 * 100vw);
    background: url(../img/ic_up.svg) no-repeat left
      center/calc(40 / 1340 * 100vw) auto;
  }
  .w_cta_btn {
    padding: calc(64 / 1340 * 100vw) 0 calc(32 / 1340 * 100vw);
  }
  .w_cta_btn a {
    border-radius: calc(16 / 1340 * 100vw);
    width: calc(630 / 1340 * 100vw);
    height: calc(168 / 1340 * 100vw);
    box-shadow: 0 calc(4 / 1340 * 100vw) calc(8 / 1340 * 100vw)
      rgba(26, 34, 44, 0.16);
    background: url(../img/cta_img.png) no-repeat calc(4 / 1340 * 100vw)
        calc(11 / 1340 * 100vw) / calc(224 / 1340 * 100vw) auto,
      linear-gradient(45deg, #f9a23b, #f9844d);
  }
  .w_cta_btn a:hover {
    background: url(../img/cta_img.png) no-repeat calc(4 / 1340 * 100vw)
        calc(11 / 1340 * 100vw) / calc(224 / 1340 * 100vw) auto,
      linear-gradient(45deg, #f9814d, #f65c5e);
  }
  .w_cta_btn a:hover .text03 {
    color: #f65e5e;
  }
  .w_cta_btn a .text01 {
    top: calc(43 / 1340 * 100vw);
    left: calc(295 / 1340 * 100vw);
  }
  .w_cta_btn a .text01:after,
  .w_cta_btn a .text01:before {
    width: calc(2 / 1340 * 100vw);
    height: calc(24 / 1340 * 100vw);
    bottom: calc(3 / 1340 * 100vw);
  }
  .w_cta_btn a .text01:before {
    transform: rotate(-30deg);
    left: calc(-18 / 1340 * 100vw);
  }
  .w_cta_btn a .text01:after {
    transform: rotate(30deg);
    right: calc(-18 / 1340 * 100vw);
  }
  .w_cta_btn a .text02 {
    left: calc(240 / 1340 * 100vw);
    top: calc(64 / 1340 * 100vw);
    font-size: calc(32 / 1340 * 100vw);
  }
  .w_cta_btn a .text03 {
    font-size: calc(24 / 1340 * 100vw);
    width: calc(92 / 1340 * 100vw);
    height: calc(51 / 1340 * 100vw);
    border-radius: calc(8 / 1340 * 100vw);
    line-height: calc(51 / 1340 * 100vw);
    padding-left: calc(12 / 1340 * 100vw);
    right: calc(32 / 1340 * 100vw);
    top: calc(70 / 1340 * 100vw);
  }
  #function {
    padding: calc(32 / 1340 * 100vw) 0 calc(64 / 1340 * 100vw);
  }
  #function .ttl01 + p {
    margin-bottom: calc(48 / 1340 * 100vw);
  }
  #function .function {
    min-height: calc(480 / 1340 * 100vw);
    padding-right: calc(660 / 1340 * 100vw);
    margin-bottom: calc(64 / 1340 * 100vw);
  }
  #function .function.reverse {
    padding-left: calc(660 / 1340 * 100vw);
  }
  #function .function .label {
    border-radius: calc(8 / 1340 * 100vw);
    padding: calc(8 / 1340 * 100vw) calc(16 / 1340 * 100vw)
      calc(10 / 1340 * 100vw);
    margin-bottom: calc(10 / 1340 * 100vw);
  }
  #function .function h3 {
    gap: 0 calc(16 / 1340 * 100vw);
    margin-bottom: calc(25 / 1340 * 100vw);
  }
  #function .function h3 .num {
    font-size: calc(32 / 1340 * 100vw);
    width: calc(74 / 1340 * 100vw);
  }
  #function .function h3 .ttl {
    font-size: calc(32 / 1340 * 100vw);
  }
  #function .function h4 {
    font-size: calc(18 / 1340 * 100vw);
    margin-bottom: calc(10 / 1340 * 100vw);
    line-height: 1.4444444444;
  }
  #function .function01 {
    background: url(../img/function01.png) no-repeat right
      center/calc(628 / 1340 * 100vw) auto;
  }
  #function .function01 .label {
    background: #f2f2fe;
    color: #7e7cf9;
  }
  #function .function01 h3 .num {
    background: #7e7cf9;
  }
  #function .function01 h4 {
    color: #7e7cf9;
  }
  #function .function02 {
    background: url(../img/function02.png) no-repeat left
      center/calc(628 / 1340 * 100vw) auto;
  }
  #function .function02 .label {
    background: #eff8ff;
    color: #048cf2;
  }
  #function .function02 h3 .num {
    background: #048cf2;
  }
  #function .function02 h4 {
    color: #048cf2;
  }
  #function .function03 {
    background: url(../img/function03.png) no-repeat right
      center/calc(628 / 1340 * 100vw) auto;
  }
  #function .function03 .label {
    background: #fef4ed;
    color: #fa8f47;
  }
  #function .function03 h3 .num {
    background: #fa8f47;
  }
  #function .function03 h4 {
    color: #fa8f47;
  }
  #function .function04 {
    background: url(../img/function04.png) no-repeat left
      center/calc(628 / 1340 * 100vw) auto;
  }
  #function .function04 .label {
    background: #e9fbf9;
    color: #1fc8c2;
  }
  #function .function04 h3 .num {
    background: #1fc8c2;
  }
  #function .function04 h4 {
    color: #1fc8c2;
  }
  #function_list {
    padding: calc(64 / 1340 * 100vw) 0 calc(80 / 1340 * 100vw);
  }
  #function_list h2 {
    font-size: calc(32 / 1340 * 100vw);
    margin-bottom: calc(45 / 1340 * 100vw);
  }
  #function_list ul {
    gap: calc(32 / 1340 * 100vw);
  }
  #function_list ul li {
    overflow: hidden;
    background: #fff;
    border-radius: calc(8 / 1340 * 100vw);
    box-shadow: 0 calc(4 / 1340 * 100vw) calc(8 / 1340 * 100vw)
      rgba(26, 34, 44, 0.3);
    text-align: center;
    padding-top: calc(212 / 1340 * 100vw);
  }
  #function_list ul li:nth-child(1) {
    background: #fff url(../img/fl01.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul li:nth-child(2) {
    background: #fff url(../img/fl02.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul li:nth-child(3) {
    background: #fff url(../img/fl03.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul li:nth-child(4) {
    background: #fff url(../img/fl04.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul li:nth-child(5) {
    background: #fff url(../img/fl05.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul li:nth-child(6) {
    background: #fff url(../img/fl06.svg) no-repeat center
      calc(32 / 1340 * 100vw) / calc(180 / 1340 * 100vw) auto;
  }
  #function_list ul div {
    padding: calc(16 / 1340 * 100vw) calc(24 / 1340 * 100vw)
      calc(32 / 1340 * 100vw);
  }
  #function_list ul h3 {
    font-size: calc(18 / 1340 * 100vw);
    margin-bottom: calc(16 / 1340 * 100vw);
  }
  #function_list ul p {
    font-size: calc(14 / 1340 * 100vw);
  }
  #feature {
    padding: calc(32 / 1340 * 100vw) 0 calc(64 / 1340 * 100vw);
  }
  #feature .ttl01 {
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #feature .ttl01 + p {
    margin-bottom: calc(36 / 1340 * 100vw);
  }
  #feature .feature {
    height: calc(352 / 1340 * 100vw);
    border-radius: calc(16 / 1340 * 100vw);
    padding-left: calc(64 / 1340 * 100vw);
    margin-bottom: calc(32 / 1340 * 100vw);
  }
  #feature .feature > div {
    max-width: calc(720 / 1340 * 100vw);
  }
  #feature .feature h3 {
    gap: calc(24 / 1340 * 100vw);
    margin-bottom: calc(20 / 1340 * 100vw);
  }
  #feature .feature h3 .label {
    width: calc(83 / 1340 * 100vw);
    height: calc(56 / 1340 * 100vw);
    line-height: calc(56 / 1340 * 100vw);
    border-radius: calc(50 / 1340 * 100vw);
  }
  #feature .feature h3 .ttl {
    font-weight: bold;
    font-size: calc(24 / 1340 * 100vw);
    color: #048cf2;
  }
  #feature .feature p {
    line-height: 1.5;
  }
  #feature .feature01 {
    background: #eff8ff url(../img/feature01-2.png) no-repeat right
      calc(64 / 1340 * 100vw) center/calc(393 / 1340 * 100vw) auto;
  }
  #feature .feature02 {
    background: #eff8ff url(../img/feature02-2.png) no-repeat right
      calc(64 / 1340 * 100vw) center/calc(393 / 1340 * 100vw) auto;
  }
  #feature .feature03 {
    background: #eff8ff url(../img/feature03-2.png) no-repeat right
      calc(64 / 1340 * 100vw) center/calc(393 / 1340 * 100vw) auto;
  }
  .cta {
    background: url(../img/bg_cta2.png) no-repeat center right 5% /
        calc(591 / 1340 * 100vw) auto,
      url(../img/bg_cta.jpg) no-repeat center/cover;
  }
  .cta .w1288 {
    height: calc(498 / 1340 * 100vw);
  }
  .cta .w1288 > div {
    width: calc(628 / 1340 * 100vw);
  }
  .cta h2 {
    font-size: calc(24 / 1340 * 100vw);
    margin-bottom: calc(15 / 1340 * 100vw);
  }
  .cta h3 {
    font-size: calc(40 / 1340 * 100vw);
    margin-bottom: calc(26 / 1340 * 100vw);
  }
  .cta p {
    font-size: calc(20 / 1340 * 100vw);
  }
  .cta .buttons {
    gap: 0 calc(24 / 1340 * 100vw);
    margin: 0 auto calc(32 / 1340 * 100vw);
  }
  .cta .buttons a {
    font-size: calc(22 / 1340 * 100vw);
    border-radius: calc(8 / 1340 * 100vw);
    padding-top: calc(18 / 1340 * 100vw);
  }
  .cta .buttons a span:first-child {
    font-size: calc(14 / 1340 * 100vw);
    margin-bottom: calc(8 / 1340 * 100vw);
  }
  .cta .download_btn {
    width: calc(260 / 1340 * 100vw);
    height: calc(84 / 1340 * 100vw);
  }
  .cta .demo_btn {
    width: calc(206 / 1340 * 100vw);
    height: calc(84 / 1340 * 100vw);
    border: solid calc(2 / 1340 * 100vw) #fff;
  }
  #flow {
    padding: calc(64 / 1340 * 100vw) 0;
  }
  #flow .ttl01 {
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #flow .ttl01 + p {
    margin-bottom: calc(32 / 1340 * 100vw);
  }
  #flow ul {
    grid-template-columns: repeat(4, 1fr);
    gap: 0 calc(32 / 1340 * 100vw);
  }
  #flow ul li {
    border-radius: calc(8 / 1340 * 100vw);
    box-shadow: 0 0 calc(16 / 1340 * 100vw) rgba(26, 34, 44, 0.08);
    min-height: calc(417 / 1340 * 100vw);
    padding: calc(256 / 1340 * 100vw) calc(32 / 1340 * 100vw)
      calc(32 / 1340 * 100vw);
  }
  #flow ul li:nth-child(1) {
    background: url(../img/flow01.svg) no-repeat center calc(32 / 1340 * 100vw) /
      calc(200 / 1340 * 100vw) auto;
  }
  #flow ul li:nth-child(2) {
    background: url(../img/flow02.svg) no-repeat center calc(32 / 1340 * 100vw) /
      calc(200 / 1340 * 100vw) auto;
  }
  #flow ul li:nth-child(3) {
    background: url(../img/flow03.svg) no-repeat center calc(32 / 1340 * 100vw) /
      calc(200 / 1340 * 100vw) auto;
  }
  #flow ul li:nth-child(4) {
    background: url(../img/flow04.svg) no-repeat center calc(32 / 1340 * 100vw) /
      calc(200 / 1340 * 100vw) auto;
  }
  #flow ul .num {
    width: calc(57 / 1340 * 100vw);
    font-size: calc(18 / 1340 * 100vw);
    top: calc(16 / 1340 * 100vw);
    left: calc(16 / 1340 * 100vw);
  }
  #flow ul h3 {
    margin-bottom: calc(14 / 1340 * 100vw);
    font-size: calc(18 / 1340 * 100vw);
  }
  #flow ul .text {
    font-size: calc(14 / 1340 * 100vw);
  }
  #price {
    padding: calc(64 / 1340 * 100vw) 0 calc(80 / 1340 * 100vw);
    background: #eff8ff url(../img/bg_price.svg) no-repeat right
      bottom/calc(656 / 1340 * 100vw) auto;
  }
  #price .ttl01 {
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #price .ttl01 + p {
    margin-bottom: calc(48 / 1340 * 100vw);
  }
  #price ul {
    font-size: calc(32 / 1340 * 100vw);
    gap: calc(32 / 1340 * 100vw);
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #price ul li:first-child,
  #price ul li:last-child {
    width: calc(256 / 1340 * 100vw);
    height: calc(110 / 1340 * 100vw);
    border-radius: calc(16 / 1340 * 100vw);
  }
  #price ul li:first-child {
    background: #048cf2;
    color: #fff;
  }
  #price ul li:last-child {
    background: #fff;
    border: solid calc(4 / 1340 * 100vw) #048cf2;
    color: #048cf2;
  }
  #faq {
    padding: calc(64 / 1340 * 100vw) 0;
  }
  #faq .ttl01 {
    margin-bottom: calc(35 / 1340 * 100vw);
  }
  #faq .qa {
    border: solid calc(1 / 1340 * 100vw) #eaecef;
    border-radius: calc(8 / 1340 * 100vw);
    margin-bottom: calc(24 / 1340 * 100vw);
  }
  #faq .qa:last-child {
    margin-bottom: 0;
  }
  #faq .qa .ic_q,
  #faq .qa .ic_a {
    font-size: calc(20 / 1340 * 100vw);
    left: calc(32 / 1340 * 100vw);
    width: calc(40 / 1340 * 100vw);
  }
  #faq .qa .ic_a {
    top: calc(32 / 1340 * 100vw);
    background: #f5f5f5;
  }
  #faq .qa .q {
    background: #f5f5f5 url(../img/plus.svg) no-repeat center right
      calc(42 / 1340 * 100vw) / calc(20 / 1340 * 100vw) auto;
    padding: calc(32 / 1340 * 100vw) calc(100 / 1340 * 100vw)
      calc(32 / 1340 * 100vw) calc(88 / 1340 * 100vw);
  }
  #faq .qa .q:hover {
    background: #eeeeef url(../img/plus.svg) no-repeat center right
      calc(42 / 1340 * 100vw) / calc(20 / 1340 * 100vw) auto;
  }
  #faq .qa .q.open {
    background: #f5f5f5 url(../img/minus.svg) no-repeat center right
      calc(42 / 1340 * 100vw) / calc(20 / 1340 * 100vw) auto;
  }
  #faq .qa .q.open + .a {
    display: block;
  }
  #faq .qa .q p,
  #faq .qa .q div {
    font-size: calc(18 / 1340 * 100vw);
  }
  #faq .qa .a {
    border-top: solid calc(1 / 1340 * 100vw) #eaecef;
  }
  #faq .qa .a p,
  #faq .qa .a div {
    padding: calc(32 / 1340 * 100vw) calc(32 / 1340 * 100vw)
      calc(32 / 1340 * 100vw) calc(88 / 1340 * 100vw);
  }
  #download_form {
    padding: calc(64 / 1340 * 100vw) 0;
    background: linear-gradient(
      135deg,
      rgb(31, 201, 193) 0%,
      rgb(4, 140, 242) 80%,
      rgb(4, 140, 242) 100%
    );
  }
  #download_form .bg {
    border-radius: calc(16 / 1340 * 100vw);
    padding: calc(64 / 1340 * 100vw) calc(40 / 1340 * 100vw);
  }
  #download_form .bg > div {
    width: calc(548 / 1340 * 100vw);
  }
  #download_form .left_column h2 {
    font-size: calc(24 / 1340 * 100vw);
    margin-bottom: calc(15 / 1340 * 100vw);
  }
  #download_form .left_column h3 {
    font-size: calc(40 / 1340 * 100vw);
    margin-bottom: calc(30 / 1340 * 100vw);
  }
  #download_form .left_column h3:after {
    margin-top: calc(30 / 1340 * 100vw);
    box-shadow: 0 calc(8 / 1340 * 100vw) calc(16 / 1340 * 100vw)
      rgba(26, 34, 44, 0.16);
  }
  #download_form .left_column .box {
    border-radius: calc(8 / 1340 * 100vw);
    margin-bottom: calc(24 / 1340 * 100vw);
    padding: calc(28 / 1340 * 100vw) calc(24 / 1340 * 100vw)
      calc(32 / 1340 * 100vw);
  }
  #download_form .left_column .box h4 {
    font-size: calc(20 / 1340 * 100vw);
    border-bottom: solid calc(1 / 1340 * 100vw) #ccc;
    padding-bottom: calc(16 / 1340 * 100vw);
  }
  #download_form .left_column .blue h4 {
    border-bottom-color: #b5dcfb;
    margin-bottom: calc(22 / 1340 * 100vw);
  }
  #download_form .left_column .blue ul {
    gap: calc(30 / 1340 * 100vw) 0;
  }
  #download_form .left_column .blue ul li {
    padding-left: calc(40 / 1340 * 100vw);
  }
  #download_form .left_column .blue ul li:before {
    width: calc(32 / 1340 * 100vw);
  }
  #download_form .left_column .green {
    background: #e9faf9;
  }
  #download_form .left_column .green h4 {
    margin-bottom: calc(22 / 1340 * 100vw);
    border-bottom-color: #bceeed;
  }
  #download_form .left_column .green ul {
    gap: calc(24 / 1340 * 100vw) 0;
  }
  #download_form .left_column .green ul li {
    padding-left: calc(32 / 1340 * 100vw);
    background: url(../img/check_green.svg) no-repeat left
      center/calc(16 / 1340 * 100vw) auto;
    padding-bottom: calc(1 / 1340 * 100vw);
  }
  form .form_input {
    gap: calc(30 / 1340 * 100vw) 0;
  }
  form .form_input label {
    margin-bottom: calc(9 / 1340 * 100vw);
  }
  form .form_input label span {
    font-size: calc(12 / 1340 * 100vw);
    width: calc(36 / 1340 * 100vw);
    height: calc(22 / 1340 * 100vw);
    line-height: calc(22 / 1340 * 100vw);
    border-radius: calc(4 / 1340 * 100vw);
    margin-left: calc(8 / 1340 * 100vw);
  }
  form .form_input input[type='text'],
  form .form_input input[type='tel'],
  form .form_input input[type='email'],
  form .form_input select,
  form .form_input textarea {
    border: solid calc(1 / 1340 * 100vw) #c9c9c9;
    border-radius: calc(8 / 1340 * 100vw);
    padding: calc(7 / 1340 * 100vw) calc(16 / 1340 * 100vw)
      calc(8 / 1340 * 100vw);
  }
  form .form_input input[type='text'].error,
  form .form_input input[type='tel'].error,
  form .form_input input[type='email'].error,
  form .form_input select.error,
  form .form_input textarea.error {
    border-color: #f44369;
  }
  #checkbox.error {
    border-color: #f44369;
  }
  form .form_input input[type='text']::placeholder,
  form .form_input input[type='tel']::placeholder,
  form .form_input input[type='email']::placeholder,
  form .form_input select::placeholder,
  form .form_input textarea::placeholder {
    color: #b9bcbf;
  }
  form .form_input input[type='text']:focus,
  form .form_input input[type='tel']:focus,
  form .form_input input[type='email']:focus,
  form .form_input select:focus,
  form .form_input textarea:focus {
    outline: solid calc(2 / 1340 * 100vw) #048cf2;
  }
  form .form_input select {
    background: url(../img/select_arrow.svg) no-repeat center right
      calc(16 / 1340 * 100vw) / calc(14 / 1340 * 100vw) auto;
  }
  form .form_input textarea {
    height: calc(92 / 1340 * 100vw);
  }
  form .form_input .error_text {
    font-size: calc(12 / 1340 * 100vw);
    border-radius: calc(4 / 1340 * 100vw);
    margin-top: calc(8 / 1340 * 100vw);
    padding: calc(4 / 1340 * 100vw) calc(16 / 1340 * 100vw)
      calc(5 / 1340 * 100vw);
  }
  .error_text {
    font-size: calc(12 / 1340 * 100vw);
    border-radius: calc(4 / 1340 * 100vw);
    margin-top: calc(8 / 1340 * 100vw);
    padding: calc(4 / 1340 * 100vw) calc(16 / 1340 * 100vw)
      calc(5 / 1340 * 100vw);
  }
  form .is_privacy {
    font-size: calc(14 / 1340 * 100vw);
    margin-top: calc(28 / 1340 * 100vw);
    /* margin-bottom: calc(26 / 1340 * 100vw); */
  }
  form .is_privacy input[type='checkbox'] {
    display: none;
  }
  form .is_privacy input[type='checkbox']:checked + label {
    border-color: #048cf2;
    background: url(../img/input_check.svg) no-repeat center/115%;
  }
  form .is_privacy input[type='checkbox']:disabled + label {
    border-color: #e3e3e3;
    background: #f5f5f5;
  }
  form .is_privacy input[type='checkbox']:checked:disabled + label {
    border-color: #b9bcbf;
    background: url(../img/input_check_disabled.svg) no-repeat center/115%;
  }
  form .is_privacy label {
    width: calc(18 / 1340 * 100vw);
    height: calc(18 / 1340 * 100vw);
    border-radius: calc(3 / 1340 * 100vw);
    border: solid calc(2 / 1340 * 100vw) #b9bcbf;
    margin-right: calc(8 / 1340 * 100vw);
  }
  form .is_privacy a {
    background: url(../img/blank.svg) no-repeat center
      right/calc(12 / 1340 * 100vw) auto;
    padding-right: calc(18 / 1340 * 100vw);
    margin-right: calc(8 / 1340 * 100vw);
  }
  form .is_privacy a:hover {
    background-image: url(../img/blank_blue.svg);
  }
  form button {
    font-size: calc(20 / 1340 * 100vw);
    border-radius: calc(8 / 1340 * 100vw);
    height: calc(78 / 1340 * 100vw);
    background: linear-gradient(
      318deg,
      rgb(250, 143, 71) 0%,
      rgb(250, 143, 71) 60%,
      rgb(249, 178, 49) 100%
    );
  }
  form button:hover {
    background: linear-gradient(45deg, #f9814d, #f65c5e);
  }
}
@media screen and (max-width: 767px) {
  #mv {
    background: url(../img/mv_bg.svg) no-repeat right calc(-119 / 375 * 100vw)
        top calc(-56 / 375 * 100vw) / calc(419 / 375 * 100vw) auto,
      linear-gradient(
        170deg,
        rgb(30, 200, 194) 0%,
        rgb(4, 140, 242) 50%,
        rgb(4, 140, 242) 100%
      );
    height: auto;
    padding-bottom: calc(66 / 375 * 100vw);
  }
  #mv:after {
    content: none;
  }
  #mv .mv_ttl {
    padding-top: calc(66 / 375 * 100vw);
    text-align: center;
    margin-bottom: calc(24 / 375 * 100vw);
  }
  #mv .mv_ttl img {
    width: calc(300 / 375 * 100vw);
  }
  #mv h3 {
    font-size: calc(14 / 375 * 100vw);
    text-align: center;
    line-height: 1.4285714286;
    margin-bottom: calc(28 / 375 * 100vw);
  }
  #mv h3:after {
    content: '';
    display: block;
    width: 100%;
    height: auto;
    background: url(../img/mv_bg_sp.png) no-repeat left top/100% auto;
    aspect-ratio: 750/480;
    margin-top: calc(25 / 375 * 100vw);
  }
  #mv .buttons {
    display: grid;
    gap: calc(16 / 375 * 100vw) 0;
  }
  #mv .buttons a {
    width: 100%;
  }
  #mv .buttons .download_btn {
    height: calc(75 / 375 * 100vw);
    padding-top: calc(18 / 375 * 100vw);
  }
  #mv .buttons .download_btn span {
    font-size: calc(20 / 375 * 100vw);
  }
  #mv .buttons .download_btn span:first-child {
    font-size: calc(12 / 375 * 100vw);
  }
  #mv .buttons .demo_btn {
    height: calc(50 / 375 * 100vw);
    padding-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 calc(10 / 375 * 100vw);
  }
  #mv .buttons .demo_btn span {
    display: inline-block;
    font-size: calc(18 / 375 * 100vw);
  }
  #mv .buttons .demo_btn span:first-child {
    font-size: calc(12 / 375 * 100vw);
    margin-bottom: 0;
  }
  #issues {
    padding: calc(32 / 375 * 100vw) 0;
  }
  #issues .ttl01 {
    margin-bottom: calc(40 / 375 * 100vw);
  }
  #issues .ttl01:before,
  #issues .ttl01:after {
    width: calc(4 / 375 * 100vw);
    height: calc(48 / 375 * 100vw);
  }
  #issues .ttl01:before {
    left: calc(-24 / 375 * 100vw);
  }
  #issues .ttl01:after {
    right: calc(-24 / 375 * 100vw);
  }
  #issues .ttl01 .ja {
    font-size: calc(16 / 375 * 100vw);
  }
  #issues .grid {
    grid-template-columns: 1fr;
    gap: calc(36 / 375 * 100vw) 0;
  }
  #issues .grid > div {
    padding: calc(22 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(16 / 375 * 100vw);
  }
  #issues .grid .blue h3 {
    color: #048cf2;
  }
  #issues .grid .blue ul li {
    background: #fff url(../img/check_blue.svg) no-repeat calc(10 / 375 * 100vw)
      calc(13 / 375 * 100vw) / calc(16 / 375 * 100vw) auto;
  }
  #issues .grid .blue ul:before {
    width: calc(85 / 375 * 100vw);
    right: 0;
    top: calc(-78 / 375 * 100vw);
  }
  #issues .grid .green {
    background: #e9faf9;
  }
  #issues .grid .green h3 {
    color: #1fc8c2;
  }
  #issues .grid .green ul li {
    background: #fff url(../img/check_green.svg) no-repeat
      calc(10 / 375 * 100vw) calc(13 / 375 * 100vw) / calc(16 / 375 * 100vw)
      auto;
  }
  #issues .grid .green ul:before {
    width: calc(80 / 375 * 100vw);
    background: url(../img/issues_r.svg) no-repeat left top/100% auto;
    right: calc(18 / 375 * 100vw);
    top: calc(-78 / 375 * 100vw);
  }
  #issues .grid h3 {
    font-size: calc(18 / 375 * 100vw);
    margin-bottom: calc(18 / 375 * 100vw);
  }
  #issues .grid ul {
    display: grid;
    gap: calc(8 / 375 * 100vw) 0;
    position: relative;
  }
  #issues .grid ul:before {
    position: absolute;
    content: '';
    display: block;
  }
  #issues .grid ul li {
    font-size: calc(14 / 375 * 100vw);
    padding: calc(11 / 375 * 100vw) 0 calc(13 / 375 * 100vw)
      calc(34 / 375 * 100vw);
    line-height: 1.4;
  }
  #solutions {
    padding: calc(32 / 375 * 100vw) 0;
  }
  #solutions .ttl01 .ja {
    font-size: calc(20 / 375 * 100vw);
    line-height: 1.45;
  }
  #solutions .grid {
    grid-template-columns: 1fr;
    margin-top: calc(30 / 375 * 100vw);
    gap: 0 calc(32 / 375 * 100vw);
  }
  #solutions .grid > div {
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #solutions .grid > div:before {
    height: calc(240 / 375 * 100vw);
    background: #fff;
    border: solid calc(1 / 375 * 100vw) #e3e3e3;
    border-radius: calc(8 / 375 * 100vw);
    margin-bottom: calc(18 / 375 * 100vw);
  }
  #solutions .grid > div:nth-child(1):before {
    background: #fff url(../img/solutions01.svg) no-repeat
      center/calc(182 / 375 * 100vw) auto;
  }
  #solutions .grid > div:nth-child(2):before {
    background: #fff url(../img/solutions02.svg) no-repeat
      center/calc(144 / 375 * 100vw) auto;
  }
  #solutions .grid > div:nth-child(3):before {
    background: #fff url(../img/solutions03.svg) no-repeat
      center/calc(200 / 375 * 100vw) auto;
  }
  #solutions .grid > div:last-child {
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #solutions .grid > div:last-child p {
    padding-bottom: calc(44 / 375 * 100vw);
    background: url(../img/arrow01.svg) no-repeat center
      bottom/calc(22 / 375 * 100vw) auto;
  }
  #solutions .grid p {
    font-size: calc(18 / 375 * 100vw);
    background: none;
    padding-bottom: 0;
  }
  #solutions .grid p span {
    display: inline-block;
    border-bottom: solid calc(5 / 375 * 100vw) #fa8f47;
    padding-bottom: calc(5 / 375 * 100vw);
  }
  #solutions .bottom_text {
    font-size: calc(16 / 375 * 100vw);
    height: calc(96 / 375 * 100vw);
    display: flex;
    align-items: center;
    padding-left: calc(94 / 375 * 100vw);
    padding-right: calc(16 / 375 * 100vw);
    border-radius: calc(16 / 375 * 100vw);
    border: solid calc(4 / 375 * 100vw) #048cf2;
    line-height: 1.5;
  }
  #solutions .bottom_text:before {
    bottom: calc(-5 / 375 * 100vw);
    left: calc(16 / 375 * 100vw);
    width: calc(64 / 375 * 100vw);
  }
  #framework {
    padding: calc(68 / 375 * 100vw) 0 calc(130 / 375 * 100vw);
    background: url(../img/bg_framework01.svg) no-repeat left
        calc(-50 / 375 * 100vw) top calc(-12 / 375 * 100vw) /
        calc(340 / 375 * 100vw) auto,
      url(../img/bg_framework02.svg) no-repeat center
        bottom/calc(343 / 375 * 100vw) auto,
      #eff8ff;
  }
  #framework .ttl01 {
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #framework .ttl01 .ja {
    font-size: calc(24 / 375 * 100vw);
  }
  #framework .w_step {
    position: relative;
    width: 100%;
    height: auto;
  }
  #framework .step {
    position: relative;
    background: #fff;
    line-height: 1;
    border-radius: calc(16 / 375 * 100vw);
    border: solid calc(3 / 375 * 100vw) #000;
    font-weight: bold;
    box-shadow: 0 calc(4 / 375 * 100vw) calc(8 / 375 * 100vw)
      rgba(26, 34, 44, 0.16);
    margin-bottom: calc(78 / 375 * 100vw);
  }
  #framework .step:after {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: calc(-48 / 375 * 100vw);
    content: '';
    display: block;
    width: calc(22 / 375 * 100vw);
    height: calc(28 / 375 * 100vw);
    background: url(../img/arrow02.svg) no-repeat left top/100% auto;
  }
  #framework .step .label {
    font-size: calc(14 / 375 * 100vw);
    width: calc(83 / 375 * 100vw);
    height: calc(34 / 375 * 100vw);
    border-radius: calc(50 / 375 * 100vw);
    top: calc(-17 / 375 * 100vw);
    left: calc(10 / 375 * 100vw);
  }
  #framework .step h3 {
    font-size: calc(18 / 375 * 100vw);
    margin-bottom: calc(10 / 375 * 100vw);
    text-align: center;
  }
  #framework .step h3 + p {
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.4285714286;
    text-align: center;
  }
  #framework .step01 {
    border-color: #7e7cf9;
    width: 100%;
    height: calc(190 / 375 * 100vw);
    left: revert;
    transform: revert;
    top: revert;
    padding: calc(116 / 375 * 100vw) 0 0;
    background: #fff url(../img/step01.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(110 / 375 * 100vw) auto;
    margin-bottom: calc(60 / 375 * 100vw);
  }
  #framework .step01 h3 {
    color: #7e7cf9;
  }
  #framework .step01 .label {
    background: #7e7cf9;
  }
  #framework .step01:after {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: calc(-48 / 375 * 100vw);
    content: '';
    display: block;
    width: calc(22 / 375 * 100vw);
    height: calc(28 / 375 * 100vw);
    background: url(../img/arrow02.svg) no-repeat left top/100% auto;
  }
  #framework .step02 {
    border-color: #048cf2;
    width: 100%;
    height: calc(190 / 375 * 100vw);
    left: revert;
    transform: revert;
    top: revert;
    padding: calc(116 / 375 * 100vw) 0 0;
    background: #fff url(../img/step02.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(118 / 375 * 100vw) auto;
  }
  #framework .step02 h3 {
    color: #048cf2;
  }
  #framework .step02 .label {
    background: #048cf2;
  }
  #framework .step03,
  #framework .step04 {
    padding-top: calc(115 / 375 * 100vw);
    width: 100%;
    height: calc(210 / 375 * 100vw);
    text-align: center;
    bottom: revert;
  }
  #framework .step03 {
    border-color: #fa8f47;
    right: 0;
    background: #fff url(../img/step03.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(115 / 375 * 100vw) auto;
  }
  #framework .step03 h3 {
    color: #fa8f47;
  }
  #framework .step03 .label {
    background: #fa8f47;
  }
  #framework .step04 {
    border-color: #1fc8c2;
    left: 0;
    background: #fff url(../img/step04.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(180 / 375 * 100vw) auto;
  }
  #framework .step04 h3 {
    color: #1fc8c2;
  }
  #framework .step04 .label {
    background: #1fc8c2;
  }
  #framework .cycle {
    position: static;
    left: revert;
    transform: revert;
    top: revert;
    width: auto;
    height: auto;
    aspect-ratio: revert;
    border-radius: 0;
    text-align: center;
    line-height: 1;
    font-weight: bold;
    font-size: calc(20 / 375 * 100vw);
    color: #048cf2;
    padding-top: 0;
    box-shadow: none;
    background: none;
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #framework .bottom_text {
    position: static;
    width: 100%;
    height: calc(96 / 375 * 100vw);
    box-shadow: calc(5 / 375 * 100vw) calc(5 / 375 * 100vw)
      calc(10 / 375 * 100vw) rgba(0, 0, 0, 0.1);
    background: #048cf2;
    color: #fff;
    font-weight: bold;
    font-size: calc(16 / 375 * 100vw);
    border-radius: calc(60 / 375 * 100vw);
    left: revert;
    transform: revert;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    padding-right: calc(25 / 375 * 100vw);
  }
  #framework .bottom_text span {
    display: inline-block;
    padding-left: calc(45 / 375 * 100vw);
    background: url(../img/ic_up.svg) no-repeat left
      center/calc(22 / 375 * 100vw) auto;
  }
  .w_cta_btn {
    padding: calc(32 / 375 * 100vw) 0 calc(32 / 375 * 100vw);
    background: #fff;
  }
  .w_cta_btn a {
    border-radius: calc(8 / 375 * 100vw);
    width: calc(343 / 375 * 100vw);
    height: calc(100 / 375 * 100vw);
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 calc(4 / 375 * 100vw) calc(8 / 375 * 100vw)
      rgba(26, 34, 44, 0.16);
    background: url(../img/cta_img.png) no-repeat calc(10 / 375 * 100vw)
        calc(6 / 375 * 100vw) / calc(130 / 375 * 100vw) auto,
      linear-gradient(45deg, #f9a23b, #f9844d);
  }
  .w_cta_btn a:hover {
    background: url(../img/cta_img.png) no-repeat calc(10 / 375 * 100vw)
        calc(6 / 375 * 100vw) / calc(130 / 375 * 100vw) auto,
      linear-gradient(45deg, #f9814d, #f65c5e);
  }
  .w_cta_btn a:hover .text03 {
    color: #f65e5e;
  }
  .w_cta_btn a span {
    position: absolute;
  }
  .w_cta_btn a .text01 {
    font-size: calc(13 / 375 * 100vw);
    top: calc(23 / 375 * 100vw);
    left: revert;
    right: calc(43 / 375 * 100vw);
  }
  .w_cta_btn a .text01:after,
  .w_cta_btn a .text01:before {
    position: absolute;
    content: '';
    display: block;
    width: calc(2 / 375 * 100vw);
    height: calc(16 / 375 * 100vw);
    background: #fff;
    bottom: calc(5 / 375 * 100vw);
  }
  .w_cta_btn a .text01:before {
    transform: rotate(-18deg);
    left: calc(-9 / 375 * 100vw);
  }
  .w_cta_btn a .text01:after {
    transform: rotate(18deg);
    right: calc(-9 / 375 * 100vw);
  }
  .w_cta_btn a .text02 {
    left: revert;
    right: calc(30 / 375 * 100vw);
    top: calc(40 / 375 * 100vw);
    font-size: calc(20 / 375 * 100vw);
  }
  .w_cta_btn a .text03 {
    display: none;
  }
  #function {
    padding: 0 0 calc(32 / 375 * 100vw);
  }
  #function .ttl01 + p {
    text-align: center;
    margin-bottom: calc(48 / 375 * 100vw);
    font-size: calc(16 / 375 * 100vw);
    line-height: 1.5;
  }
  #function .function {
    background: none;
    min-height: auto;
    display: block;
    padding-right: 0;
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #function .function:last-child {
    margin-bottom: 0;
  }
  #function .function.reverse {
    padding-right: 0;
    padding-left: 0;
  }
  #function .function .label {
    max-width: fit-content;
    border-radius: calc(8 / 375 * 100vw);
    padding: calc(8 / 375 * 100vw) calc(16 / 375 * 100vw) calc(10 / 375 * 100vw);
    margin: 0 auto calc(12 / 375 * 100vw);
    font-size: calc(12 / 375 * 100vw);
  }
  #function .function h3 {
    display: flex;
    align-items: center;
    font-weight: bold;
    gap: 0 calc(16 / 375 * 100vw);
    justify-content: center;
    margin-bottom: calc(15 / 375 * 100vw);
  }
  #function .function h3 .num {
    font-size: calc(20 / 375 * 100vw);
    width: calc(43 / 375 * 100vw);
  }
  #function .function h3 .ttl {
    font-size: calc(24 / 375 * 100vw);
  }
  #function .function h4 {
    font-size: calc(16 / 375 * 100vw);
    font-weight: bold;
    margin-bottom: calc(10 / 375 * 100vw);
    line-height: 1.4444444444;
    padding-top: calc(280 / 375 * 100vw);
    text-align: center;
  }
  #function .function .text {
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.7142857143;
  }
  #function .function01 h4 {
    background: url(../img/function01.png) no-repeat center top/100% auto;
  }
  #function .function02 h4 {
    background: url(../img/function02.png) no-repeat center top/100% auto;
  }
  #function .function03 h4 {
    background: url(../img/function03.png) no-repeat center top/100% auto;
  }
  #function .function04 h4 {
    background: url(../img/function04.png) no-repeat center top/100% auto;
  }
  #function_list {
    padding: calc(32 / 375 * 100vw) 0 calc(32 / 375 * 100vw);
  }
  #function_list h2 {
    font-size: calc(20 / 375 * 100vw);
    margin-bottom: calc(24 / 375 * 100vw);
    line-height: 1.45;
  }
  #function_list ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: calc(16 / 375 * 100vw);
  }
  #function_list ul li {
    overflow: hidden;
    background: #fff;
    border-radius: calc(8 / 375 * 100vw);
    box-shadow: 0 calc(4 / 375 * 100vw) calc(8 / 375 * 100vw)
      rgba(26, 34, 44, 0.3);
    text-align: center;
    padding-top: calc(136 / 375 * 100vw);
  }
  #function_list ul li:nth-child(1) {
    background: #fff url(../img/fl01.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul li:nth-child(2) {
    background: #fff url(../img/fl02.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul li:nth-child(3) {
    background: #fff url(../img/fl03.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul li:nth-child(4) {
    background: #fff url(../img/fl04.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul li:nth-child(5) {
    background: #fff url(../img/fl05.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul li:nth-child(6) {
    background: #fff url(../img/fl06.svg) no-repeat center
      calc(16 / 375 * 100vw) / calc(120 / 375 * 100vw) auto;
  }
  #function_list ul div {
    background: #f5f5f5;
    padding: calc(16 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(24 / 375 * 100vw);
    position: relative;
  }
  #function_list ul div:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    display: block;
    width: 100%;
    height: 120%;
    background: #f5f5f5;
  }
  #function_list ul h3 {
    position: relative;
    z-index: 2;
    font-weight: bold;
    font-size: calc(14 / 375 * 100vw);
    line-height: 1;
    margin-bottom: calc(10 / 375 * 100vw);
  }
  #function_list ul p {
    position: relative;
    z-index: 2;
    text-align: left;
    font-size: calc(12 / 375 * 100vw);
    line-height: 1.5833333333;
  }
  #feature {
    padding: 0 0 calc(32 / 375 * 100vw);
  }
  #feature .ttl01 {
    margin-bottom: calc(18 / 375 * 100vw);
  }
  #feature .ttl01 + p {
    text-align: center;
    margin-bottom: calc(36 / 375 * 100vw);
    font-size: calc(16 / 375 * 100vw);
    line-height: 1.5;
  }
  #feature .feature {
    position: relative;
    height: auto;
    display: block;
    border-radius: calc(16 / 375 * 100vw);
    padding: calc(242 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(32 / 375 * 100vw);
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #feature .feature:last-child {
    margin-bottom: 0;
  }
  #feature .feature > div {
    max-width: 100%;
  }
  #feature .feature h3 {
    line-height: 1;
    display: block;
    font-weight: bold;
    margin-bottom: calc(16 / 375 * 100vw);
    text-align: center;
  }
  #feature .feature h3 .label {
    position: absolute;
    top: calc(24 / 375 * 100vw);
    left: calc(16 / 375 * 100vw);
    width: calc(77 / 375 * 100vw);
    height: calc(52 / 375 * 100vw);
    text-align: center;
    line-height: calc(52 / 375 * 100vw);
    background: #048cf2;
    font-size: calc(14 / 375 * 100vw);
    border-radius: calc(50 / 375 * 100vw);
  }
  #feature .feature h3 .ttl {
    font-size: calc(18 / 375 * 100vw);
    line-height: 1.4444444444;
  }
  #feature .feature p {
    line-height: 1.5;
    font-size: calc(16 / 375 * 100vw);
  }
  #feature .feature01 {
    background: #eff8ff url(../img/feature01-sp.png) no-repeat center
      calc(-30 / 375 * 100vw) / calc(310 / 375 * 100vw) auto;
  }
  #feature .feature02 {
    background: #eff8ff url(../img/feature02-sp.png) no-repeat center
      calc(-30 / 375 * 100vw) / calc(310 / 375 * 100vw) auto;
  }
  #feature .feature03 {
    background: #eff8ff url(../img/feature03-sp.png) no-repeat center
      calc(-30 / 375 * 100vw) / calc(310 / 375 * 100vw) auto;
  }
  .cta {
    background: url(../img/bg_cta2.png) no-repeat center calc(105 / 375 * 100vw) /
        calc(370 / 375 * 100vw) auto,
      url(../img/bg_cta_sp.jpg) no-repeat center/cover;
    padding: calc(32 / 375 * 100vw) 0;
  }
  .cta .w1288 {
    height: auto;
    display: block;
  }
  .cta .w1288 > div {
    width: 100%;
  }
  .cta h2,
  .cta h3,
  .cta p {
    color: #fff;
    line-height: 1;
    text-align: center;
  }
  .cta h2 {
    font-weight: 500;
    font-size: calc(16 / 375 * 100vw);
    margin-bottom: calc(12 / 375 * 100vw);
  }
  .cta h3 {
    font-weight: bold;
    font-size: calc(24 / 375 * 100vw);
    margin-bottom: calc(290 / 375 * 100vw);
  }
  .cta h3 span {
    font-family: 'Outfit', sans-serif;
  }
  .cta p {
    font-weight: bold;
    font-size: calc(16 / 375 * 100vw);
    line-height: 1.5;
  }
  .cta .buttons {
    display: grid;
    gap: calc(16 / 375 * 100vw) 0;
    max-width: 100%;
  }
  .cta .buttons a {
    width: 100%;
  }
  .cta .buttons .download_btn {
    height: calc(75 / 375 * 100vw);
    padding-top: calc(18 / 375 * 100vw);
  }
  .cta .buttons .download_btn span {
    font-size: calc(20 / 375 * 100vw);
  }
  .cta .buttons .download_btn span:first-child {
    font-size: calc(12 / 375 * 100vw);
  }
  .cta .buttons .demo_btn {
    height: calc(50 / 375 * 100vw);
    padding-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 calc(10 / 375 * 100vw);
  }
  .cta .buttons .demo_btn span {
    display: inline-block;
    font-size: calc(18 / 375 * 100vw);
  }
  .cta .buttons .demo_btn span:first-child {
    font-size: calc(12 / 375 * 100vw);
    margin-bottom: 0;
  }
  #flow {
    padding: calc(32 / 375 * 100vw) 0;
  }
  #flow .ttl01 {
    margin-bottom: calc(24 / 375 * 100vw);
  }
  #flow .ttl01 + p {
    font-size: calc(16 / 375 * 100vw);
    margin-bottom: calc(32 / 375 * 100vw);
    line-height: 1.5;
  }
  #flow ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: calc(16 / 375 * 100vw) 0;
  }
  #flow ul li {
    position: relative;
    border-radius: calc(8 / 375 * 100vw);
    box-shadow: 0 0 calc(8 / 375 * 100vw) rgba(26, 34, 44, 0.08);
    text-align: left;
    padding: calc(25 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(16 / 375 * 100vw) calc(132 / 375 * 100vw);
    min-height: calc(145 / 375 * 100vw);
  }
  #flow ul li:nth-child(1) {
    background: url(../img/flow01.svg) no-repeat calc(16 / 375 * 100vw)
      calc(25 / 375 * 100vw) / calc(100 / 375 * 100vw) auto;
  }
  #flow ul li:nth-child(2) {
    background: url(../img/flow02.svg) no-repeat calc(16 / 375 * 100vw)
      calc(25 / 375 * 100vw) / calc(100 / 375 * 100vw) auto;
  }
  #flow ul li:nth-child(3) {
    background: url(../img/flow03.svg) no-repeat calc(16 / 375 * 100vw)
      calc(25 / 375 * 100vw) / calc(100 / 375 * 100vw) auto;
  }
  #flow ul li:nth-child(4) {
    background: url(../img/flow04.svg) no-repeat calc(16 / 375 * 100vw)
      calc(25 / 375 * 100vw) / calc(100 / 375 * 100vw) auto;
  }
  #flow ul .num {
    width: calc(36 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
    top: calc(16 / 375 * 100vw);
    left: calc(16 / 375 * 100vw);
    background: #1a222c;
  }
  #flow ul h3 {
    font-size: calc(14 / 375 * 100vw);
    line-height: 1;
    font-weight: bold;
    text-align: left;
    margin-bottom: calc(14 / 375 * 100vw);
  }
  #flow ul .text {
    font-size: calc(12 / 375 * 100vw);
    color: #757a80;
    line-height: 1.5833333333;
  }
  #price {
    padding: calc(32 / 375 * 100vw) 0 calc(32 / 375 * 100vw);
    background: #eff8ff;
  }
  #price .ttl01 {
    margin-bottom: calc(24 / 375 * 100vw);
  }
  #price .ttl01 + p {
    font-size: calc(16 / 375 * 100vw);
    line-height: 1.5;
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #price ul {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: calc(20 / 375 * 100vw);
    font-weight: bold;
    line-height: 1;
    gap: calc(8 / 375 * 100vw);
    margin-bottom: calc(24 / 375 * 100vw);
  }
  #price ul li:first-child,
  #price ul li:last-child {
    width: calc(144 / 375 * 100vw);
    height: calc(77 / 375 * 100vw);
    border-radius: calc(16 / 375 * 100vw);
  }
  #price ul li:first-child {
    background: #048cf2;
    color: #fff;
  }
  #price ul li:nth-child(2) {
    font-size: calc(18 / 375 * 100vw);
  }
  #price ul li:last-child {
    border: solid calc(2 / 375 * 100vw) #048cf2;
  }
  #price .bottom_text {
    font-size: calc(12 / 375 * 100vw);
    line-height: 1.4166666667;
  }
  #faq {
    padding: calc(32 / 375 * 100vw) 0;
  }
  #faq .ttl01 {
    margin-bottom: calc(24 / 375 * 100vw);
  }
  #faq .qa {
    border: solid calc(1 / 375 * 100vw) #eaecef;
    overflow: hidden;
    border-radius: calc(8 / 375 * 100vw);
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #faq .qa:last-child {
    margin-bottom: 0;
  }
  #faq .qa .ic_q,
  #faq .qa .ic_a {
    font-size: calc(16 / 375 * 100vw);
    left: calc(32 / 375 * 100vw);
    width: calc(32 / 375 * 100vw);
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 50%;
    height: auto;
  }
  #faq .qa .ic_q {
    top: calc(16 / 375 * 100vw);
    transform: revert;
    left: calc(16 / 375 * 100vw);
  }
  #faq .qa .ic_a {
    top: calc(16 / 375 * 100vw);
    left: calc(16 / 375 * 100vw);
    background: #f5f5f5;
  }
  #faq .qa .q {
    background: #f5f5f5 url(../img/plus.svg) no-repeat center right
      calc(24 / 375 * 100vw) / calc(16 / 375 * 100vw) auto;
    position: relative;
    cursor: pointer;
    padding: calc(16 / 375 * 100vw) calc(56 / 375 * 100vw)
      calc(14 / 375 * 100vw) calc(56 / 375 * 100vw);
    line-height: 1.4285714286;
    min-height: calc(64 / 375 * 100vw);
    display: flex;
    align-items: center;
  }
  #faq .qa .q:hover {
    background: #eeeeef url(../img/plus.svg) no-repeat center right
      calc(24 / 375 * 100vw) / calc(16 / 375 * 100vw) auto;
  }
  #faq .qa .q.open {
    background: #f5f5f5 url(../img/minus.svg) no-repeat center right
      calc(24 / 375 * 100vw) / calc(16 / 375 * 100vw) auto;
  }
  #faq .qa .q.open + .a {
    display: block;
  }
  #faq .qa .q:before,
  #faq .qa .q:after {
    content: '';
    display: block;
  }
  #faq .qa .q p {
    font-weight: bold;
    font-size: calc(14 / 375 * 100vw);
  }
  #faq .qa .a {
    display: none;
    position: relative;
    border-top: solid calc(1 / 375 * 100vw) #eaecef;
  }
  #faq .qa .a p,
  #faq .qa .a div {
    line-height: 1.7142857143;
    padding: calc(16 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(16 / 375 * 100vw) calc(56 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
  #download_form {
    padding: calc(32 / 375 * 100vw) 0;
    background: linear-gradient(
      135deg,
      rgb(31, 201, 193) 0%,
      rgb(4, 140, 242) 80%,
      rgb(4, 140, 242) 100%
    );
  }
  #download_form .bg {
    background: #fff;
    border-radius: calc(8 / 375 * 100vw);
    padding: calc(32 / 375 * 100vw) calc(16 / 375 * 100vw);
    display: grid;
    gap: calc(32 / 375 * 100vw) 0;
  }
  #download_form .bg > div {
    width: 100%;
  }
  #download_form .left_column h2,
  #download_form .left_column h3 {
    line-height: 1;
  }
  #download_form .left_column h2 {
    font-size: calc(16 / 375 * 100vw);
    margin-bottom: calc(12 / 375 * 100vw);
  }
  #download_form .left_column h3 {
    font-size: calc(24 / 375 * 100vw);
    margin-bottom: calc(32 / 375 * 100vw);
  }
  #download_form .left_column h3:after {
    margin-top: calc(22 / 375 * 100vw);
    box-shadow: 0 calc(8 / 375 * 100vw) calc(16 / 375 * 100vw)
      rgba(26, 34, 44, 0.16);
  }
  #download_form .left_column h3 span {
    font-family: 'Outfit', sans-serif;
  }
  #download_form .left_column .box {
    border-radius: calc(8 / 375 * 100vw);
    margin-bottom: calc(24 / 375 * 100vw);
    padding: calc(20 / 375 * 100vw) calc(16 / 375 * 100vw)
      calc(16 / 375 * 100vw);
  }
  #download_form .left_column .box h4 {
    font-size: calc(16 / 375 * 100vw);
    padding-bottom: calc(10 / 375 * 100vw);
  }
  #download_form .left_column .blue h4 {
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #download_form .left_column .blue ul {
    line-height: 1;
    display: grid;
    gap: calc(18 / 375 * 100vw) 0;
    counter-reset: number 0;
  }
  #download_form .left_column .blue ul li {
    position: relative;
    padding-left: calc(32 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.4285714286;
  }
  #download_form .left_column .blue ul li:before {
    top: calc(-1 / 375 * 100vw);
    transform: revert;
    width: calc(24 / 375 * 100vw);
    font-size: calc(12 / 375 * 100vw);
  }
  #download_form .left_column .green {
    background: #e9faf9;
    margin-bottom: 0;
  }
  #download_form .left_column .green h4 {
    margin-bottom: calc(16 / 375 * 100vw);
  }
  #download_form .left_column .green ul {
    line-height: 1;
    display: grid;
    gap: calc(16 / 375 * 100vw) 0;
  }
  #download_form .left_column .green ul li {
    padding-left: calc(32 / 375 * 100vw);
    background: url(../img/check_green.svg) no-repeat calc(2 / 375 * 100vw)
      calc(3 / 375 * 100vw) / calc(16 / 375 * 100vw) auto;
    padding-bottom: calc(1 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.4285714286;
  }
  form .form_input {
    gap: calc(24 / 375 * 100vw) 0;
  }
  form .form_input label {
    margin-bottom: calc(9 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
  form .form_input label span {
    font-size: calc(12 / 375 * 100vw);
    width: calc(36 / 375 * 100vw);
    height: calc(22 / 375 * 100vw);
    line-height: calc(22 / 375 * 100vw);
    border-radius: calc(4 / 375 * 100vw);
    margin-left: calc(8 / 375 * 100vw);
  }
  form .form_input input[type='text'],
  form .form_input input[type='tel'],
  form .form_input input[type='email'],
  form .form_input select,
  form .form_input textarea {
    color: inherit;
    font-size: calc(16 / 375 * 100vw);
    border: solid calc(1 / 375 * 100vw) #c9c9c9;
    border-radius: calc(4 / 375 * 100vw);
    line-height: 1.6;
    padding: calc(7 / 375 * 100vw) calc(16 / 375 * 100vw) calc(8 / 375 * 100vw);
  }
  form .form_input input[type='text'].error,
  form .form_input input[type='tel'].error,
  form .form_input input[type='email'].error,
  form .form_input input[type='checkbox'].error,
  form .form_input select.error,
  form .form_input textarea.error {
    border-color: #f44369;
  }
  #checkbox.error {
    border-color: #f44369;
  }
  form .form_input input[type='text']::placeholder,
  form .form_input input[type='tel']::placeholder,
  form .form_input input[type='email']::placeholder,
  form .form_input select::placeholder,
  form .form_input textarea::placeholder {
    color: #b9bcbf;
  }
  form .form_input input[type='text']:focus,
  form .form_input input[type='tel']:focus,
  form .form_input input[type='email']:focus,
  form .form_input select:focus,
  form .form_input textarea:focus {
    border-color: #fff;
    outline: solid calc(2 / 375 * 100vw) #048cf2;
  }
  form .form_input select {
    background: url(../img/select_arrow.svg) no-repeat center right
      calc(16 / 375 * 100vw) / calc(14 / 375 * 100vw) auto;
    color: var(--black);
  }
  form .form_input textarea {
    resize: vertical;
    height: calc(130 / 375 * 100vw);
  }
  form .form_input .error_text {
    color: #f44369;
    font-weight: 600;
    font-size: calc(12 / 375 * 100vw);
    border-radius: calc(4 / 375 * 100vw);
    background: #feecf0;
    margin-top: calc(8 / 375 * 100vw);
    padding: calc(8 / 375 * 100vw) calc(16 / 375 * 100vw) calc(6 / 375 * 100vw);
    line-height: 1.4;
  }
  form .is_privacy {
    font-size: calc(14 / 375 * 100vw);
    display: flex;
    align-items: center;
    margin-top: calc(24 / 375 * 100vw);
    /* margin-bottom: calc(24 / 375 * 100vw); */
  }
  form .is_privacy input[type='checkbox'] {
    display: none;
  }
  form .is_privacy input[type='checkbox']:checked + label {
    border-color: #048cf2;
    background: url(../img/input_check.svg) no-repeat center/115%;
  }
  form .is_privacy input[type='checkbox']:disabled + label {
    border-color: #e3e3e3;
    background: #f5f5f5;
  }
  form .is_privacy input[type='checkbox']:checked:disabled + label {
    border-color: #b9bcbf;
    background: url(../img/input_check_disabled.svg) no-repeat center/115%;
  }
  form .is_privacy label {
    width: calc(18 / 375 * 100vw);
    height: calc(18 / 375 * 100vw);
    border-radius: calc(3 / 375 * 100vw);
    border: solid calc(2 / 375 * 100vw) #b9bcbf;
    display: inline-block;
    margin-right: calc(8 / 375 * 100vw);
  }
  form .is_privacy label:hover {
    background: #f5f5f5;
  }
  form .is_privacy a {
    text-decoration: underline;
    background: url(../img/blank.svg) no-repeat center
      right/calc(12 / 375 * 100vw) auto;
    padding-right: calc(18 / 375 * 100vw);
    margin-right: calc(8 / 375 * 100vw);
  }
  form .is_privacy a:hover {
    color: #048cf2;
    background-image: url(../img/blank_blue.svg);
  }
  form button {
    font-size: calc(20 / 375 * 100vw);
    border-radius: calc(8 / 375 * 100vw);
    height: calc(78 / 375 * 100vw);
    background: linear-gradient(
      318deg,
      rgb(250, 143, 71) 0%,
      rgb(250, 143, 71) 60%,
      rgb(249, 178, 49) 100%
    );
  }
  form button:hover {
    background: linear-gradient(45deg, #f9814d, #f65c5e);
  }
}

/*# sourceMappingURL=style.css.map */

/* 追加CSS */

.c_download_form {
  background: #f5f5f5 !important;
  padding: 0 !important;
}

.c_box,
.c_form_input {
  background: #fff !important;
}

.c_form,
.c_bg {
  background: #fff !important;
}

.c_form {
  padding: 64px;
}
@media screen and (max-width: 767px) {
  .c_form {
    padding: 16px 16px 32px 16px;
  }
}

.c_is_privacy {
  padding: 0 64px;
}

.demo-text {
  display: block;
  font-size: 14px;
  color: #1a222c;
  font-weight: 400;
  margin-top: 32px;
  line-height: 1.8;
  font-family: 'Noto Sans JP', sans-serif !important;
}
@media screen and (max-width: 767px) {
  .demo-text {
    margin-top: 16px;
    line-height: 1.6;
  }
}

@media screen and (max-width: 767px) {
  #download_form .left_column ul .download-point:before {
    top: calc(2 / 375 * 100vw) !important;
  }
}

.demo-text-sub {
  display: block;
  font-size: 12px;
  color: #1a222c;
  font-weight: 400;
  margin-top: 26px;
  line-height: 1.8;
  font-family: 'Noto Sans JP', sans-serif !important;
}
@media screen and (max-width: 767px) {
  .demo-text-sub {
    font-size: 10px;
  }
}

#download_form .c_left_column h3:after {
  content: '';
  display: block;
  width: 100%;
  aspect-ratio: 548/373;
  height: auto;
  background: url(../userpolicy/img/img02.png) no-repeat left top/100% auto !important;
  margin-top: 30px;
  box-shadow: initial !important;
}

.demo-point {
  color: #048cf2;
  font-weight: 700;
  font-size: 16px !important;
}

.demo-point span {
  display: block;
  font-size: 14px;
  color: #1a222c;
  font-weight: 400;
  margin-top: 16px;
  line-height: 1.6;
}

#download_form .left_column .blue ul .demo-point:before {
  position: absolute;
  counter-increment: number 1;
  content: counter(number);
  left: 0;
  top: 13%;
  transform: translate(0, -50%);
  font-family: 'Outfit', sans-serif;
  font-weight: bold;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #048cf2;
  width: 32px;
  aspect-ratio: 1/1;
  height: auto;
}
@media screen and (max-width: 767px) {
  #download_form .left_column .blue ul .demo-point:before {
    top: 9%;
    width: 24px;
  }
}

#download_form .left_column .demo-line {
  border-bottom-color: #b9bcbf !important;
  margin-bottom: 22px;
}

@media screen and (max-width: 767px) {
  .sp-none {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .c_w1288 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* FAQ リストスタイリング */
#faq .qa .a ul {
  margin-top: 16px;
  padding-left: 20px;
}

#faq .qa .a ul li {
  position: relative;
  margin-top: 8px;
}

#faq .qa .a ul li:before {
  content: '•';
  position: absolute;
  left: -16px;
  color: currentColor;
  font-weight: bold;
}

/* レスポンシブ対応 */
@media screen and (min-width: 768px) and (max-width: 1300px) {
  #faq .qa .a ul {
    margin-top: calc(16 / 1340 * 100vw);
    padding-left: calc(20 / 1340 * 100vw);
  }

  #faq .qa .a ul li {
    margin-top: calc(8 / 1340 * 100vw);
  }

  #faq .qa .a ul li:before {
    left: calc(-16 / 1340 * 100vw);
  }
}

@media screen and (max-width: 767px) {
  #faq .qa .a ul {
    margin-top: calc(16 / 375 * 100vw);
    padding-left: calc(20 / 375 * 100vw);
  }

  #faq .qa .a ul li {
    margin-top: calc(8 / 375 * 100vw);
  }

  #faq .qa .a ul li:before {
    left: calc(-16 / 375 * 100vw);
  }
}

/* スマホ用追従ボタン */
.fixed_cta_sp {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  padding: 10px 16px;
  transform: translateY(100%);
  transition: transform 0.3s ease-in-out;
}

@media (max-width: 768px) {
  .fixed_cta_sp {
    display: block;
  }
}

.fixed_cta_sp.show {
  transform: translateY(0);
}

.fixed_buttons {
  display: flex;
  gap: 12px;
}

.fixed_buttons a {
  flex: 1;
  display: block;
  text-align: center;
  font-weight: bold;
  border-radius: 8px;
  text-decoration: none;
  height: 60px;
  padding: 12px 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.fixed_buttons a span {
  font-size: 16px;
  display: block;
  line-height: 1.2;
}

.fixed_buttons a span:first-child {
  font-size: 12px;
  margin-bottom: 4px;
  font-weight: 400;
}

.fixed_buttons .demo_btn {
  border: solid 1px #048cf2;
  color: #048cf2;
}

.fixed_buttons .demo_btn:hover {
  background: #eff8ff;
}

.fixed_buttons .download_btn {
  color: #fff;
  background: linear-gradient(
    318deg,
    rgb(250, 143, 71) 0%,
    rgb(250, 143, 71) 60%,
    rgb(249, 178, 49) 100%
  );
}

.fixed_buttons .download_btn:hover {
  background: linear-gradient(45deg, #f9814d, #f65c5e);
}

/* メインコンテンツの下部余白調整（スマホ時） */
@media (max-width: 768px) {
  body {
    padding-bottom: 100px; /* 追従ボタンの高さ分の余白を確保 */
  }
}