@charset "utf-8";

body {
  background: #e8f4f9;
}

.page-smeta {
  background: #e8f4f9;
}
.page-smeta .login {
  position: absolute;
  top: 13px;
  right: calc(-50vw + 50% + 100px);
  width: 296px;
  text-align: center;
}
@media (max-width: 1000px) {
  .page-smeta .login {
    top: 80px;
    right: 40px;
  }
}
@media (max-width: 767px) {
  .page-smeta .login {
    right: 24px;
    position: static;
    width: 100%;
    margin: 20px auto;
  }
}
@media (max-width: 374px) {
  .page-smeta .login {
    width: calc(100vw - 48px);
  }
}

.smeta_intro {
  position: relative;
}
.smeta_intro .logo {
  margin-top: 24px;
  line-height: 0;
}
.smeta_intro .title {
  margin-top: 80px;
  font-size: 3.6rem;
  line-height: 1.6;
}
.smeta_intro .lead,
.smeta_intro > .c-button.-smeta {
  margin-top: 32px;
  margin-top: 10px;
}
@media (min-width: 768px) {
  .smeta_intro .visual {
    overflow: hidden;
    position: absolute;
    top: calc(50% - 194px);
    left: 50%;
    right: calc(50% - 50vw);
  }
  .smeta_intro .visual img {
    width: 820px;
    max-width: none;
  }
  .-ai .smeta_intro .visual img {
    width: 852px;
  }
  .hasScrollbar .smeta_intro .visual {
    right: calc(50% - 50vw + var(--scroll-bar-width) / 2);
  }
}
@media (min-width: 1200px) {
  .smeta_intro .lead {
    max-width: calc(50% - 48px);
  }
}
@media (max-width: 1199px) and (min-width: 768px) {
  .smeta_intro .title {
    margin-top: calc(80vw / 12);
  }
  .smeta_intro .lead,
  .smeta_intro > .c-button {
    margin-top: calc(32vw / 12);
  }
  .smeta_intro .lead {
    max-width: calc(50% - 48vw / 12);
  }
  .smeta_intro .visual {
    top: calc(50% - 194vw / 12);
  }
  .smeta_intro .visual img {
    width: calc(820vw / 12);
  }
  .-ai .smeta_intro .visual img {
    width: calc(852vw / 12);
  }
}
@media (max-width: 1000px) {
  .smeta_intro .title {
    font-size: 3rem;
  }
}
@media (max-width: 767px) {
  .smeta_intro {
    display: flex;
    flex-direction: column;
  }
  .page-smeta.-cloud .smeta_intro .logo {
    max-width: calc(350vw * 0.7 / 3.75);
  }
  .page-smeta.-ai .smeta_intro .logo {
    max-width: calc(423vw * 0.7 / 3.75);
  }
  .smeta_intro .title {
    margin-top: 40px;
  }
  .smeta_intro .lead,
  .smeta_intro .visual {
    margin-top: calc(16vw / 3.75);
  }
  .smeta_intro .c-button {
    order: 1;
    width: 100%;
    margin: calc(24vw / 3.75) auto 0;
  }
}
@media (max-width: 480px) {
  .smeta_intro .title {
    font-size: 2.4rem;
  }
}
/* inview */
.smeta_intro.js-inview .l {
  display: inline-block;
  position: relative;
  transform-origin: left center;
}
.smeta_intro.js-inview .l::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform-origin: right center;
  background: #fff;
}
.smeta_intro.js-inview:not(.is-inview) .l,
.smeta_intro.js-inview.is-inview .l::after {
  transform: scaleX(0);
}
.smeta_intro.js-inview:not(.is-inview) .lead,
.smeta_intro.js-inview:not(.is-inview) .visual,
.smeta_intro.js-inview:not(.is-inview) .c-button {
  opacity: 0;
  transform: translateY(24px);
}
.smeta_intro.js-inview:not(.is-inview) .visual {
  transform: scale(0.9);
}
.smeta_intro.js-inview:not(.is-inview) .c-button {
  transform: scale(0.2);
}
.smeta_intro.is-anim .l,
.smeta_intro.is-anim .l::after {
  transition: transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.smeta_intro.is-anim .lead,
.smeta_intro.is-anim .visual,
.smeta_intro.is-anim .c-button {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.smeta_intro.is-anim .c-button {
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}
.smeta_intro.is-anim .title .l {
  transition-delay: 0.1s;
}
.smeta_intro.is-anim .title .l2 {
  transition-delay: 0.2s;
}
.smeta_intro.is-anim .lead {
  transition-delay: 0.3s;
}
.smeta_intro.is-anim .logo .l::after {
  transition-delay: 0.5s;
}
.smeta_intro.is-anim .title .l::after {
  transition-delay: 0.6s;
}
.smeta_intro.is-anim .title .l2::after {
  transition-delay: 0.7s;
}
@media (min-width: 768px) {
  .smeta_intro.is-anim .c-button {
    transition-delay: 0.4s;
  }
  .smeta_intro.is-anim .visual {
    transition-delay: 0.5s;
  }
}
@media (max-width: 767px) {
  .smeta_intro.is-anim .visual {
    transition-delay: 0.4s;
  }
  .smeta_intro.is-anim .c-button {
    transition-delay: 0.5s;
  }
}

.smeta_section {
  padding-top: 120px;
}
.smeta_title {
  font-size: 3.6rem;
  line-height: 1.6;
  text-align: center;
}
@media (max-width: 1000px) {
  .smeta_title {
    font-size: 3rem;
  }
}
@media (max-width: 480px) {
  .smeta_title {
    font-size: 2.4rem;
  }
}
/* inview */
.smeta_title .l {
  display: inline-block;
  position: relative;
  transform-origin: left center;
}
.smeta_title .l::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform-origin: right center;
  background: #fff;
}
.smeta_title.js-inview:not(.is-inview) .l,
.smeta_title.js-inview.is-inview .l::after {
  transform: scaleX(0);
}
.smeta_title.is-anim .l,
.smeta_title.is-anim .l::after {
  transition: transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.feature_title.is-anim .l::after {
  transition-timing-function: cubic-bezier(0.7, 0, 0.1, 1);
}
.smeta_title.is-anim .l {
  transition-delay: 0.1s;
}
.smeta_title.is-anim .l::after {
  transition-delay: 0.6s;
}

/* :::::: MOVIE :::::: */
.c-movie {
  position: relative;
  max-width: 800px;
  margin: 120px auto 0;
}
.c-movie .wrap {
  height: 0;
  padding-bottom: 56.25%;
}
.c-movie .wrap > *,
.c-movie .poster,
.c-movie .poster::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.c-movie .wrap > *,
.c-movie .poster img {
  object-fit: cover;
}
.c-movie .poster {
  cursor: pointer;
  transition: opacity 0.3s;
}
.c-movie.is-playing .poster {
  opacity: 0;
}
.c-movie .poster::before {
  content: "";
  background: rgba(31, 44, 92, 0.1);
}
.c-movie .poster img {
  width: 100%;
  height: 100%;
}
.c-movie .play {
  pointer-events: none;
  z-index: 1;
  position: absolute;
  top: calc(50% - 20px);
  left: calc(50% - 20px);
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 40px;
  color: transparent;
  background: rgba(255, 255, 255, 0.9);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.c-movie .play::after {
  content: "";
  position: absolute;
  top: calc(50% - 8px);
  left: calc(50% - 6px);
  width: 15px;
  height: 16px;
  background:
    linear-gradient(to bottom left, transparent 48%, #1a8ec7 52%) top left /
      100% 50% no-repeat,
    linear-gradient(to top left, transparent 48%, #1a8ec7 52%) bottom left /
      100% 50% no-repeat;
}
.c-movie .movie_title {
  position: absolute;
  top: 0;
  left: 100%;
  width: 92px;
  height: auto;
  margin: 0;
}
@media (hover: hover) {
  .c-movie .play {
    transition: transform 0.4s cubic-bezier(0.2, 1, 0.7, 1);
  }
  .c-movie .poster::before {
    transition: background 0.4s;
  }
  .c-movie:hover .play {
    transform: scale(1.2);
  }
  .c-movie:hover .poster::before {
    background: rgba(31, 44, 92, 0.2);
  }
}
@media (max-width: 1000px) {
  .c-movie .movie_title {
    width: calc(92vw / 12);
  }
}
@media (max-width: 767px) {
  .c-movie .movie_title {
    left: 0;
    width: 48px;
    transform-origin: 0 0;
    transform: rotate(-90deg);
  }
}
/* inview */
.c-movie.js-inview {
  z-index: 0;
}
.c-movie.js-inview .poster {
  overflow: hidden;
}
.c-movie.js-inview .poster::after {
  content: "";
  position: absolute;
  top: 0;
  left: -17%;
  width: 134%;
  height: 100%;
  background: #dce0f2;
}
.c-movie.js-inview .movie_title {
  z-index: -1;
}
.c-movie.js-inview:not(.is-inview) .wrap,
.c-movie.js-inview:not(.is-inview) .poster img,
.c-movie.js-inview:not(.is-inview) .poster button,
.c-movie.js-inview:not(.is-inview) .poster::before,
.c-movie.js-inview:not(.is-inview) .movie_title {
  opacity: 0;
}
.c-movie.js-inview:not(.is-inview) .poster button {
  transform: scale(0.2);
}
.c-movie.js-inview:not(.is-inview) .poster::after {
  transform: skewX(-30deg) translateX(-100%);
}
.c-movie.is-anim .wrap,
.c-movie.is-anim .poster img,
.c-movie.is-anim .poster::before {
  transition: opacity 0.4s 0.4s;
}
.c-movie.is-anim .poster img {
  transition-duration: 0s;
}
.c-movie.is-anim .poster button,
.c-movie.is-anim .movie_title {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.c-movie.is-anim .poster button {
  transition-delay: 0.6s;
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}
.c-movie.is-anim .movie_title {
  transition-delay: 0.7s;
}
.c-movie.is-anim .poster::after {
  animation: slice 1s cubic-bezier(0.2, 1, 0.7, 1) both;
}
@media (min-width: 768px) {
  .c-movie.js-inview:not(.is-inview) .movie_title {
    transform: translateX(-100%);
  }
}
@media (max-width: 767px) {
  .c-movie.js-inview:not(.is-inview) .movie_title {
    transform: rotate(-90deg) translateX(-100%);
  }
}

/* :::::: 特長 :::::: */
.feature_list {
  margin-top: 56px;
}
.feature_list a {
  display: flex;
  align-items: center;
  width: 100%;
  border-radius: 5px;
  background: #fff;
}
.feature_list li p {
  line-height: 1.6;
}
@media (min-width: 768px) {
  .feature_list {
    display: flex;
    justify-content: space-between;
    text-align: center;
  }
  .feature_list li {
    flex-basis: calc(33.333% - 26px);
  }
  .feature_list a {
    flex-direction: column;
    justify-content: center;
    height: 300px;
  }
  .feature_list li p {
    margin-top: 24px;
  }
}
@media (max-width: 1199px) and (min-width: 768px) {
  .feature_list {
    font-size: calc(16vw / 12);
  }
  .feature_list li {
    flex-basis: calc(33.333% - 26vw / 12);
  }
  .feature_list a {
    height: calc(300vw / 12);
  }
  .feature_list li figure {
    width: calc(130vw / 12);
  }
}
@media (max-width: 767px) {
  .feature_list {
    margin-top: 24px;
  }
  .feature_list li:nth-child(n + 2) {
    margin-top: calc(8vw / 3.75);
  }
  .feature_list a {
    padding: calc(16vw / 3.75) calc(24vw / 3.75);
  }
  .feature_list figure {
    flex-basis: calc(40vw / 3.75);
  }
  .feature_list li p {
    margin-left: calc(24vw / 3.75);
  }
}
/* inview */
.feature_list.js-inview:not(.is-inview) li {
  opacity: 0;
  transform: scale(0.8);
}
.feature_list.is-anim li {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}
.feature_list.is-anim li:nth-child(2) {
  transition-delay: 0.1s;
}
.feature_list.is-anim li:nth-child(3) {
  transition-delay: 0.2s;
}

/**
 * smeta-cloud 22.8.25
 * ---------------------------------------- */
.page-smeta.-cloud {
  background: transparent;
}
.page-smeta.-cloud .smeta_intro {
  padding-bottom: 60px;
}
.page-smeta.-cloud .smeta_title {
  margin-bottom: 20px;
}

.topic_feature {
  text-align: center;
  margin-bottom: 20px;
  display: inline-block;
  border-radius: 3px;
  font-size: 1.4rem;
  font-weight: bold;
  letter-spacing: 0.15rem;
}
.topic_feature .underline {
  padding-bottom: 4px;
  border-bottom: 2px solid #f37d58;
}
.topic_feature_link .c-button {
  font-size: 1.5rem;
  max-width: 300px;
  margin: auto;
  height: 44px;
  margin-top: 20px;
  margin-bottom: 20px;
}
.sec_feaure_nav {
  text-align: center;
  position: relative;
  background: #ffffff;
  padding-top: 60px;
  padding-bottom: 60px;
}
.page-smeta.-cloud .sec_feaure_nav::before {
  content: "";
  z-index: -1;
  position: absolute;
  top: 0px;
  right: calc(50% - 50vw);
  left: calc(50% - 50vw);
  bottom: 0;
  background: #ffffff;
}

.feaure_nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 20px;
}
.feaure_nav li {
  width: calc(100% / 6);
  box-sizing: border-box;
  border-right: 1px solid #ccc;
  padding: 10px 10px 0;
  margin-bottom: 30px;
  font-size: 1.3rem;
  line-height: 1.5;
}
.feaure_nav li:first-child,
.feaure_nav li:nth-child(7) {
  border-left: 1px solid #ccc;
}
.feaure_nav li .num {
  font-weight: bold;
  line-height: 1;
  color: #a6becb;
  font-size: 2.4em;
  font-family: "Helvetica Neue", helvetica, sans-serif;
}
.feaure_nav li .sub-title {
  font-weight: bold;
  font-size: 1.6rem;
  margin: 5px auto;
}
.feaure_nav li a {
  display: block;
  position: relative;
  height: 100%;
  box-sizing: border-box;
  padding-bottom: 50px;
}
.feaure_nav li a:after {
  content: "";
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url(../img/ic_arrow_forward.svg) center / cover no-repeat;
  background-size: 100% auto;
  transition: 0.3s;
}
.feaure_nav li a:hover:after {
  content: "";
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url(../img/ic_arrow_forward.svg) center / cover no-repeat;
  background-size: 100% auto;
  transition: 0.3s;
}

.page-smeta.-cloud .sec_feaure_content {
  position: relative;
  padding-bottom: 60px;
}
.page-smeta.-cloud .sec_feaure_content::before {
  content: "";
  z-index: -1;
  position: absolute;
  top: 0px;
  right: calc(50% - 50vw);
  left: calc(50% - 50vw);
  bottom: 0;
  background: #ffffff;
}
.page-smeta.-cloud .feature_item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 80px;
  flex-direction: row-reverse;
}
.page-smeta.-cloud .feature_item:last-child {
  margin-bottom: 0;
}
.page-smeta.-cloud .feature_item:nth-child(odd) {
  flex-direction: row;
}
.page-smeta.-cloud .feature_item .item_content {
  width: calc(50% - 40px);
}
.page-smeta.-cloud .feature_item .item_content .num {
  font-weight: bold;
  line-height: 1;
  color: #1a8ec7;
  font-size: 60px;
  font-family: "Helvetica Neue", helvetica, sans-serif;
}
.page-smeta.-cloud .feature_item .item_content .item_title {
  font-size: 24px;
  font-weight: bold;
  color: #1f2c5d;
  line-height: 1.4;
  margin-bottom: 10px;
}
.page-smeta.-cloud .feature_item .item_content .caption {
  font-size: 13px;
}

/* inview */
.page-smeta.-cloud .feature_item .item_content .num {
  display: inline-block;
  overflow: hidden;
}
.page-smeta.-cloud .feature_item .item_content .num .l {
  display: inline-block;
}
.page-smeta.-cloud .feature_item .item_content .item_title .l {
  display: inline-block;
  position: relative;
  transform-origin: left center;
}
.page-smeta.-cloud .feature_item .item_content .item_title .l::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform-origin: right center;
  background: #e8f4f9;
}
.page-smeta.-cloud
  .feature_item
  .item_content
  .js-inview:not(.is-inview)
  .num
  .l {
  transform: translateY(100%);
}

.page-smeta.-cloud
  .feature_item
  .item_content
  .js-inview:not(.is-inview)
  .item_title
  .l,
.page-smeta.-cloud
  .feature_item
  .item_content
  .js-inview.is-inview
  .item_title
  .l::after {
  transform: scaleX(0);
}
.item_titlebox.is-anim .l,
.item_titlebox.is-anim .item_title .l::after {
  transition: transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.item_titlebox.is-anim .l::after {
  transition-timing-function: cubic-bezier(0.7, 0, 0.1, 1);
}
.item_titlebox.is-anim .item_title .l {
  transition-delay: 0.1s;
}
.item_titlebox.is-anim .item_title .l::after {
  transition-delay: 0.6s;
}

@media (min-width: 1200px) {
  .sec_feaure_nav,
  .sec_feaure_content {
    margin-right: -80px;
    margin-left: -80px;
  }
}
@media (max-width: 1199px) and (min-width: 768px) {
  .feaure_nav li {
    width: calc(100% / 4);
  }
  .feaure_nav li:nth-child(5),
  .feaure_nav li:nth-child(9) {
    border-left: 1px solid #ccc;
  }
  .feaure_nav li:nth-child(7) {
    border-left: none;
  }
}
@media (max-width: 767px) {
  .feaure_nav li {
    width: 100%;
    margin: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid #ccc;
  }
  .feaure_nav li:first-child {
    border-top: 1px solid #ccc;
  }
  .feaure_nav li:first-child,
  .feaure_nav li:nth-child(7) {
    border-left: none;
  }
  .feaure_nav li a {
    padding-bottom: 10px;
  }
  .feaure_nav li a:after {
    display: none;
  }
  .feaure_nav li a br {
    display: none;
  }
  .page-smeta.-cloud .feature_item {
    margin-bottom: 30px;
  }
  .page-smeta.-cloud .feature_item .item_content {
    width: 100%;
    margin-bottom: 30px;
  }
}

/* * * * * * * * * * * * * * * * * * * */

.feature_section {
  z-index: 0;
  position: relative;
  padding-top: 80px;
}
.feature_section.p-feature1,
.feature_section.p-ai-feature1 {
  margin-top: 120px;
}
.feature_section::before {
  content: "";
  z-index: -1;
  position: absolute;
  top: 0;
  right: calc(50% - 50vw);
  bottom: 0;
  left: calc(50% - 50vw);
  background: #fff;
}
.hasScrollbar .feature_section::before {
  right: calc(50% - 50vw + var(--scroll-bar-width) / 2);
  left: calc(50% - 50vw + var(--scroll-bar-width) / 2);
}
@media (min-width: 768px) {
  .feature_section {
    margin-right: calc(-80vw / 12);
    margin-left: calc(-80vw / 12);
  }
}
@media (min-width: 1200px) {
  .feature_section {
    margin-right: -80px;
    margin-left: -80px;
  }
}

.feature_title {
  font-size: 2.4rem;
  line-height: 1.6;
  text-align: center;
}
.feature_title .num {
  color: #1a8ec7;
  font-size: 2.5em;
  line-height: 1.2;
  font-family: "Helvetica Neue", helvetica, sans-serif;
}
.feature_title .main {
  display: block;
}
@media (max-width: 1000px) {
  .feature_title {
    font-size: 2rem;
  }
}
@media (max-width: 480px) {
  .feature_title {
    font-size: 1.6rem;
  }
}
/* inview */
.feature_title .num {
  display: inline-block;
  overflow: hidden;
}
.feature_title .num .l {
  display: inline-block;
}
.feature_title .main .l {
  display: inline-block;
  position: relative;
  transform-origin: left center;
}
.feature_title .main .l::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform-origin: right center;
  background: #e8f4f9;
}
.feature_title.js-inview:not(.is-inview) .num .l {
  transform: translateY(100%);
}
.feature_title.js-inview:not(.is-inview) .main .l,
.feature_title.js-inview.is-inview .main .l::after {
  transform: scaleX(0);
}
.feature_title.is-anim .l,
.feature_title.is-anim .main .l::after {
  transition: transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.feature_title.is-anim .l::after {
  transition-timing-function: cubic-bezier(0.7, 0, 0.1, 1);
}
.feature_title.is-anim .main .l {
  transition-delay: 0.1s;
}
.feature_title.is-anim .main .l::after {
  transition-delay: 0.6s;
}

/* tabs */
.smeta_tabs {
  display: flex;
  justify-content: center;
  margin-top: 56px;
}
.smeta_tabs li:nth-child(n + 2) {
  margin-left: 24px;
}
.smeta_tabs button {
  cursor: pointer;
  border-radius: 80px;
  color: #070e29;
  font-weight: 700;
  background: #e8f4f9;
}
@media (min-width: 768px) {
  .smeta_tabs button {
    width: 204px;
    height: 36px;
  }
}
@media (max-width: 767px) {
  .smeta_tabs {
    margin-top: calc(24vw / 3.75);
  }
  .smeta_tabs li:nth-child(n + 2) {
    margin-left: calc(8vw / 3.75);
  }
  .smeta_tabs button {
    padding: 8px calc(16vw / 3.75);
    line-height: 1.2;
  }
}
@media (max-width: 480px) {
  .smeta_tabs button {
    font-size: calc(12vw / 3.75);
  }
}
/* inview */
.smeta_tabs.js-inview:not(.is-inview) li {
  opacity: 0;
  transform: scale(0.8);
}
.smeta_tabs.is-anim li {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}
.smeta_tabs.is-anim li:nth-child(1) {
  transition-delay: 0.1s;
}
.smeta_tabs.is-anim li:nth-child(2) {
  transition-delay: 0.2s;
}
.smeta_tabs.is-anim li:nth-child(3) {
  transition-delay: 0.3s;
}

/* panel */
.smeta_panel {
  padding: 40px 32px;
  border-radius: 5px;
  background: #fff;
}
@media (max-width: 480px) {
  .smeta_panel {
    padding: calc(24vw / 3.75);
  }
}

/* column box */
@media (min-width: 768px) {
  .smeta_column {
    display: flex;
    justify-content: space-between;
  }
  .smeta_column > * {
    flex-basis: calc(50% - 20px);
  }
}

.smeta_box {
  position: relative;
  margin-top: 56px;
  padding: 40px 64px;
  border-radius: 5px;
  background: #e8f4f9;
}
.smeta_box .smeta_column {
  align-items: center;
}
.smeta_box .box_title {
  font-size: 2.4rem;
  line-height: 1.4;
}
.smeta_box .box_title small {
  font-size: 1.2rem;
  font-weight: 400;
}
.smeta_box .box_title.-check {
  position: relative;
  padding-left: 48px;
}
.smeta_box .box_title.-check::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: calc(0.65em - 20px);
  left: 0;
  width: 40px;
  height: 40px;
  margin-right: 8px;
  vertical-align: middle;
  background: url(../img/check.svg) center / cover no-repeat;
}
.smeta_box p {
  margin-top: 24px;
}
.smeta_box p:first-child {
  margin-top: 0;
}
.smeta_tabs + .smeta_box {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .smeta_box .box_title small {
    margin-left: 1em;
  }
}
@media (max-width: 1199px) {
  .smeta_box {
    padding: 40px calc(64vw / 12);
  }
}
@media (max-width: 1000px) {
  .smeta_box .box_title {
    font-size: 2rem;
  }
}
@media (max-width: 767px) {
  .smeta_box {
    margin-top: calc(24vw / 3.75);
    padding: calc(24vw / 3.75);
  }
  .smeta_tabs + .smeta_box {
    margin-top: 16px;
  }
  .smeta_box .box_title small {
    display: inline-block;
  }
  .smeta_box .box_title.-check::before {
    top: calc(0.7em - 20px);
  }
  .smeta_box p {
    margin-top: 1em;
  }
}
@media (max-width: 480px) {
  .smeta_box .box_title {
    font-size: 1.6rem;
  }
  .smeta_box .box_title small {
    font-size: 1rem;
  }
}
/* inview */
.smeta_box.js-inview:not(.is-inview) {
  opacity: 0;
  transform: translateY(24px);
}
.smeta_box.is-anim {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.smeta_box + .smeta_box.is-anim {
  transition-delay: 0.1s;
}

.js-tabToggles [data-tab].is-active {
  color: #fff;
  background: #1f2c5c;
}
.js-tabContents [data-tab]:not(.is-active) {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  padding: inherit;
  opacity: 0;
  transform: translateY(24px);
}
.js-tabToggles [data-tab].is-anim {
  transition:
    color 0.4s,
    background 0.4s;
}
.js-tabContents [data-tab].is-anim {
  transition:
    opacity 0.4s,
    transform 0.4s cubic-bezier(0.2, 1, 0.7, 1);
}

/* :::::: ご利用料金 :::::: */
.c-usagefee {
  margin-top: 56px;
}
.c-usagefee dl {
  position: relative;
  text-align: center;
}
.c-usagefee dt {
  padding: 0.6em;
  border-radius: 5px 5px 0 0;
  color: #fff;
  font-size: 2.4rem;
  font-weight: 700;
}
.c-usagefee .-basis dt {
  background: #1a8ec7;
}
.c-usagefee .-plice dt {
  background: #1f2c5c;
}
.c-usagefee dd {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 230px;
  border-radius: 0 0 5px 5px;
  line-height: 1.3;
  background: #fff;
}
.c-usagefee .-basis dd {
  color: #1a8ec7;
}
.c-usagefee .-plice dd {
  color: #1f2c5c;
}

.c-usagefee dd .num {
  font-family: roboto, sans-serif;
}
.c-usagefee dd .main,
.c-usagefee dd .sub {
  font-weight: 700;
}
.c-usagefee dd .main strong {
  font-size: 7.2rem;
}
.c-usagefee .-plice dd .main strong {
  font-size: 5.6rem;
}
.c-usagefee dd .sub strong {
  font-size: 3.2rem;
}
.c-usagefee dd small {
  font-size: 1.6rem;
}
.c-usagefee .note {
  margin-top: 32px;
  font-size: 1.2rem;
  line-height: 1.6;
}
.c-usagefee .note + .note {
  margin-top: 16px;
}
@media (min-width: 768px) {
  .c-usagefee {
    display: flex;
    justify-content: space-between;
    margin-right: calc(-80vw / 12);
    margin-left: calc(-80vw / 12);
  }
}
@media (min-width: 768px) and (max-width: 1000px) {
  .c-usagefee dd .main strong {
    font-size: 7.2vw;
  }
  .c-usagefee .-plice dd .main strong {
    font-size: 5.6vw;
  }
  .c-usagefee dd .sub strong {
    font-size: 3.2vw;
  }
  .c-usagefee dd small {
    font-size: 1.6vw;
  }
}
@media (min-width: 1200px) {
  .c-usagefee {
    margin-right: -80px;
    margin-left: -80px;
  }
}
@media (max-width: 767px) {
  .c-usagefee {
    margin-top: calc(24vw / 3.75);
  }
  .c-usagefee dt {
    font-size: 2rem;
  }
  .c-usagefee dd {
    height: auto;
    padding: 24px 0;
  }
  .c-usagefee .note {
    margin-top: 1em;
  }
  .c-usagefee .note + .note {
    margin-top: 0.5em;
  }
}
@media (max-width: 480px) {
  .c-usagefee dd .main strong {
    font-size: calc(60vw / 3.75);
  }
  .c-usagefee .-plice dd .main strong {
    font-size: calc(48vw / 3.75);
  }
  .c-usagefee dd .sub strong {
    font-size: calc(20vw / 3.75);
  }
  .c-usagefee dd small {
    font-size: 1.2rem;
  }
  .c-usagefee .note {
    font-size: 1rem;
  }
}
/* inview */
.usagefee_box.js-inview:not(.is-inview) dl,
.usagefee_box.-plice.js-inview:not(.is-inview) dl::before,
.usagefee_box.js-inview:not(.is-inview) .note {
  opacity: 0;
  transform: scale(0.8);
}
.usagefee_box.js-inview:not(.is-inview) .note {
  transform: translateY(24px);
}
.usagefee_box.is-anim dl,
.usagefee_box.-plice.is-anim dl::before,
.usagefee_box.is-anim .note {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}
.usagefee_box.is-anim dl,
.usagefee_box.-plice.is-anim dl::before {
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}
.usagefee_box.-plice.is-anim dl {
  transition-delay: 0.1s;
}
.usagefee_box.-plice.is-anim dl::before {
  transition-delay: 0.4s;
}
.usagefee_box.is-anim .note {
  transition-delay: 0.3s;
}
.usagefee_box.is-anim .note + .note {
  transition-delay: 0.4s;
}

/**
 * smetaクラウド
 * ---------------------------------------- */
.p-feature3,
.p-cloud3,
.p-ai2 {
  padding-bottom: 120px;
}
.p-feature1 .smeta_column .text dl {
  margin-top: 2em;
  font-size: 1.2rem;
}
.p-feature1 .smeta_column .text dt {
  font-weight: 700;
}
.p-cloud3_figure {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.p-cloud3_figure li {
  flex-basis: calc(50% - 10px);
  padding: 12px 8px;
  border-radius: 5px;
  color: #fff;
  line-height: 1.2;
  text-align: center;
  background: #1f2c5c;
}
.p-cloud3_figure li:nth-child(n + 3) {
  margin-top: 10px;
}
.p-cloud3 .c-usagefee .-plice dl::before {
  content: "";
  position: absolute;
  width: 50px;
  height: 50px;
  background: url(../img/plus.svg) center / cover no-repeat;
}
@media (min-width: 768px) {
  .p-feature1 .smeta_column .text,
  .p-feature3 .smeta_column .text {
    flex-basis: calc(50% - 40px);
  }
  .p-feature1 .smeta_column .image,
  .p-feature3 .smeta_column .image {
    flex-basis: 50%;
  }
  .p-cloud3 .c-usagefee .usagefee_box {
    flex-basis: calc(50% - 80vw / 12);
  }
  .p-cloud3 .c-usagefee .-plice dl::before {
    top: calc(50% - 25px);
    right: calc(100% + 80vw / 12 - 25px);
  }
}
@media (min-width: 1200px) {
  .p-cloud3 .c-usagefee .usagefee_box {
    flex-basis: calc(50% - 80px);
  }
  .p-cloud3 .c-usagefee .-plice dl::before {
    right: calc(100% + 80px - 25px);
  }
}
@media (max-width: 767px) {
  .p-feature1 .smeta_column .image,
  .p-feature3 .smeta_column .image {
    margin-top: 16px;
  }
  .p-cloud3_figure li {
    flex-basis: calc(50% - 4vw / 3.75);
  }
  .p-cloud3_figure li:nth-child(n + 3) {
    margin-top: calc(8vw / 3.75);
  }
  .p-cloud3 .c-usagefee .-plice dl {
    margin-top: 64px;
  }
  .p-cloud3 .c-usagefee .-plice dl::before {
    top: -46px;
    right: calc(50% - 13px);
    width: 25px;
    height: 25px;
  }
}
@media (max-width: 480px) {
  .p-feature1 .smeta_column .text dl {
    font-size: 1rem;
  }
  .p-cloud3_figure {
    font-size: calc(12vw / 3.75);
  }
}

/* :::::: smetaクラウドのサービス範囲 :::::: */
.p-cloud2 .figure {
  margin-top: 56px;
  border-radius: 5px;
  background: #fff;
}
/* inview */
.p-cloud2 .figure.js-inview:not(.is-inview) {
  opacity: 0;
  transform: translateY(24px);
}
.p-cloud2 .figure.is-anim {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
}

.p-cloud2 .figure .default {
  border-radius: 5px;
  background: #e8f4f9;
}
.p-cloud2 .figure .subject {
  margin-bottom: 0.6em;
  line-height: 1.4;
  font-weight: 700;
}
.p-cloud2 .figure .group,
.p-cloud2 .figure .service,
.p-cloud2 .figure .note {
  color: #1f2c5c;
}
.p-cloud2 .figure .group dt,
.p-cloud2 .figure .group dd,
.p-cloud2 .figure .service .s {
  padding: 0.5em;
  border-radius: 5px;
  line-height: 1.2;
  white-space: nowrap;
  text-align: center;
}
.p-cloud2 .figure .group dt {
  position: relative;
  color: #fff;
  background: #1f2c5c;
}
.p-cloud2 .figure .group.-flow dt {
  border-radius: 5px 0 0 5px;
}
.p-cloud2 .figure .group.-flow dt::after {
  content: "";
  position: absolute;
  top: 0;
  left: calc(100% - 1px);
  background: url(../img/flow_h.svg) center / cover no-repeat;
}
.p-cloud2 .figure .group dd {
  background: #fff;
}
.p-cloud2 .figure .service .s {
  color: #fff;
  background: #1a8ec7;
}
.p-cloud2 .figure .note {
  line-height: 1.4;
}
.p-cloud2 .figure .ann {
  color: #f37d58;
  font-weight: 700;
}
@media (min-width: 768px) {
  .p-cloud2 .figure .subject {
    font-size: calc(24vw / 12);
  }
  .p-cloud2 .figure .group,
  .p-cloud2 .figure .service,
  .p-cloud2 .figure .note {
    font-size: calc(12vw / 12);
  }
  .p-cloud2 .figure {
    margin-right: calc(-80vw / 12);
    margin-left: calc(-80vw / 12);
    padding: calc(130vw / 12) calc(24vw / 12) calc(40vw / 12);
  }
  .p-cloud2 .figure .default {
    display: grid;
    grid-template: repeat(4, auto) / 1fr 3fr;
    position: relative;
    width: 86%;
    padding: 24px calc(24vw / 12);
  }
  .p-cloud2 .figure .subject {
    grid-area: 1 / 1 / 2 / 3;
  }
  .p-cloud2 .figure .block.b1 {
    grid-area: 2 / 1 / 5 / 2;
  }
  .p-cloud2 .figure .block.b2 {
    grid-area: 2 / 2 / 3 / 3;
  }
  .p-cloud2 .figure .block.b3 {
    grid-area: 3 / 2 / 4 / 3;
  }
  .p-cloud2 .figure .block.b4 {
    grid-area: 4 / 2 / 5 / 3;
  }
  .p-cloud2 .figure .b1 {
    margin-right: calc(12vw / 12);
  }
  .p-cloud2 .figure .b2 {
    display: flex;
    justify-content: space-between;
    margin-left: calc(12vw / 12);
  }
  .p-cloud2 .figure .b3,
  .p-cloud2 .figure .b4 {
    margin-left: calc(12vw / 12);
  }
  .p-cloud2 .figure .b3,
  .p-cloud2 .figure .b4 {
    margin-top: 24px;
  }
  .p-cloud2 .figure .group {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .p-cloud2 .figure .b1 .group:nth-child(n + 2) {
    margin-top: 24px;
  }
  .p-cloud2 .figure .b2 .group {
    flex-basis: calc(33.333% - 16vw / 12);
  }
  .p-cloud2 .figure .group dt {
    flex-basis: 100%;
    margin-bottom: 4px;
  }
  .p-cloud2 .figure .group.-flow dt {
    border-radius: 5px 0 0 5px;
  }
  .p-cloud2 .figure .group.-flow dt::after {
    bottom: 0;
    width: calc(16vw / 12);
  }
  .p-cloud2 .figure .group dd {
    flex-basis: calc(50% - 4vw / 12);
    margin-top: 4px;
  }
  .p-cloud2 .figure .b3 .group dd,
  .p-cloud2 .figure .b4 .group dd {
    flex-basis: calc(25% - 6vw / 12);
  }
  .p-cloud2 .figure .service {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
  .p-cloud2 .figure .service .sv::after {
    content: "";
    position: absolute;
    left: calc(50% - 6px);
    width: 12px;
    height: 60px;
    background: url(../img/range_v.svg) center / cover no-repeat;
  }
  .p-cloud2 .figure .service .sv.s1::after,
  .p-cloud2 .figure .service .sv.s2::after,
  .p-cloud2 .figure .service .sv.s3::after {
    top: calc(100% + 8px);
  }
  .p-cloud2 .figure .service .sv.s4::after,
  .p-cloud2 .figure .service .sv.s5::after {
    top: calc(100% + 8px);
    left: calc(-24vw / 12);
    width: calc(40vw / 12);
    height: 12px;
    background-image: url(../img/range_h.svg);
  }
  .p-cloud2 .figure .service .sv.s6::after {
    bottom: calc(100% + 8px);
    width: 12px;
    height: 32px;
  }
  .p-cloud2 .figure .service .s {
    display: inline-block;
    min-width: calc(140vw / 12);
  }
  .p-cloud2 .figure .service .set,
  .p-cloud2 .figure .service > .s {
    position: absolute;
  }
  .p-cloud2 .figure .service .set ul {
    display: flex;
    flex-direction: column;
  }
  .p-cloud2 .figure .service .set .s:nth-child(n + 2) {
    margin-top: 4px;
  }
  .p-cloud2 .figure .service .s1 {
    bottom: calc(100% + 24px);
    left: 31%;
  }
  .p-cloud2 .figure .service .s2 {
    bottom: calc(100% + 24px);
    left: 55%;
  }
  .p-cloud2 .figure .service .s3 {
    bottom: calc(100% + 24px);
    left: 79%;
  }
  .p-cloud2 .figure .service .s4 {
    top: 13%;
    left: calc(100% + 8vw / 12);
  }
  .p-cloud2 .figure .service .s5 {
    top: 53%;
    left: calc(100% + 8vw / 12);
  }
  .p-cloud2 .figure .service .s6 {
    top: calc(100% + 24px);
    right: calc(24vw / 12);
  }
  .p-cloud2 .figure .note {
    margin-top: 1em;
  }
}
@media (min-width: 1200px) {
  .p-cloud2 .figure .subject {
    font-size: 2.4rem;
  }
  .p-cloud2 .figure .group,
  .p-cloud2 .figure .service,
  .p-cloud2 .figure .note {
    font-size: 1.2rem;
  }
  .p-cloud2 .figure {
    margin-right: -80px;
    margin-left: -80px;
  }
  .p-cloud2 .figure {
    padding: 130px 24px 40px;
  }
  .p-cloud2 .figure .default {
    padding: 24px;
  }
  .p-cloud2 .figure .b1 {
    margin-right: 12px;
  }
  .p-cloud2 .figure .b2 {
    margin-left: 12px;
  }
  .p-cloud2 .figure .b3,
  .p-cloud2 .figure .b4 {
    margin-left: 12px;
  }
  .p-cloud2 .figure .b1 .group:nth-child(n + 2) {
    margin-top: 24px;
  }
  .p-cloud2 .figure .b2 .group {
    flex-basis: calc(33.333% - 48px / 3);
  }
  .p-cloud2 .figure .b2 .group:nth-child(n + 2) {
    margin-left: 24px;
  }
  .p-cloud2 .figure .group.-flow dt::after {
    width: 16px;
  }
  .p-cloud2 .figure .b3 .group dd,
  .p-cloud2 .figure .b4 .group dd {
    flex-basis: calc(25% - 24px / 4);
  }
  .p-cloud2 .figure .service .sv.s4::after,
  .p-cloud2 .figure .service .sv.s5::after {
    left: -24px;
    width: 40px;
  }
  .p-cloud2 .figure .service .s {
    min-width: 140px;
  }
  .p-cloud2 .figure .service .s4 {
    left: calc(100% + 8px);
  }
  .p-cloud2 .figure .service .s5 {
    left: calc(100% + 8px);
  }
  .p-cloud2 .figure .service .s6 {
    right: 24px;
  }
}
@media (max-width: 767px) {
  .p-cloud2 .figure {
    margin-top: 24px;
    padding: calc(8vw / 3.75) calc(8vw / 3.75) 16px;
  }
  .p-cloud2 .figure .default {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    margin-bottom: calc(152vw / 3.75 + 32px);
    padding: 16px calc(16vw / 3.75) 32px;
  }
  .p-cloud2 .figure .subject,
  .p-cloud2 .figure .block.b1 {
    flex-basis: 100%;
  }
  .p-cloud2 .figure .block.b1 {
    margin-bottom: 24px;
  }
  .p-cloud2 .figure .block.b3,
  .p-cloud2 .figure .block.b4 {
    margin-left: calc(8vw / 3.75);
  }
  .p-cloud2 .figure .subject {
    font-size: calc(24vw / 3.75);
  }
  .p-cloud2 .figure .group,
  .p-cloud2 .figure .service,
  .p-cloud2 .figure .note {
    font-size: calc(12vw / 3.75);
  }
  .p-cloud2 .figure .b1 .group {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .p-cloud2 .figure .b1 .group:nth-child(n + 2) {
    margin-top: 24px;
  }
  .p-cloud2 .figure .b2 .group dt,
  .p-cloud2 .figure .b3 .group dt,
  .p-cloud2 .figure .b3 .group dd,
  .p-cloud2 .figure .b4 .group dt,
  .p-cloud2 .figure .b4 .group dd {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-feature-settings: "pkna";
  }
  .p-cloud2 .figure .b1 .group dt {
    flex-basis: 100%;
    margin-bottom: calc(4vw / 3.75);
  }
  .p-cloud2 .figure .b1 .group dd {
    flex-basis: calc(50% - 4vw / 3.75);
    margin-top: calc(4vw / 3.75);
  }
  .p-cloud2 .figure .group.-flow dt {
    border-radius: 5px 5px 0 0;
  }
  .p-cloud2 .figure .group.-flow dt::after {
    top: calc(100% - 1px);
    right: 0;
    left: 0;
    height: 16px;
    background-image: url(../img/flow_v.svg);
  }
  .p-cloud2 .figure .block:not(.b1) .group {
    position: relative;
  }
  .p-cloud2 .figure .block:not(.b1) .group dt {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }
  .p-cloud2 .figure .block:not(.b1) .group dd {
    margin-left: calc(2.4em + 4vw / 3.75);
  }
  .p-cloud2 .figure .block:not(.b1) .group dd:nth-of-type(n + 2) {
    margin-top: calc(4vw / 3.75);
  }
  .p-cloud2 .figure .b2 .group:nth-of-type(n + 2) {
    margin-top: 24px;
  }
  .p-cloud2 .figure .b3 .group,
  .p-cloud2 .figure .b4 .group {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
  }
  .p-cloud2 .figure .b3 .group dd,
  .p-cloud2 .figure .b4 .group dd {
    flex-grow: 1;
  }
  .p-cloud2 .figure .service {
    position: absolute;
    top: calc(100% + 24px);
    left: 0;
  }
  .p-cloud2 .figure .service::after {
    content: "";
    display: block;
    clear: both;
  }
  .p-cloud2 .figure .service .s {
    float: left;
    width: calc(50% - 2vw / 3.75);
    margin-top: calc(4vw / 3.75);
  }
  .p-cloud2 .figure .service .s.even {
    float: right;
  }
  .p-cloud2 .figure .service .s1 .s {
    margin-top: 0;
  }
  .p-cloud2 .figure .service::before {
    content: "";
    position: absolute;
    bottom: calc(100% + 8px);
    left: calc(50% - 6px);
    width: 12px;
    height: 40px;
    background-image: url(../img/range_v.svg);
  }
}

/**
 * smeta入居審査AI
 * ---------------------------------------- */
.p-ai1 {
  padding-top: 0;
}
.p-ai2 .usagefee_box .main {
  font-size: 4.6rem;
}
.p-ai2 .usagefee_box.-basis .main {
  font-size: 3.6rem;
}
.p-ai2 .usagefee_box .sub {
  font-size: 2.4rem;
}
@media (min-width: 768px) {
  .p-ai1 .smeta_box,
  .p-ai2 .smeta_box {
  }
  .p-ai1 .p-feature2 .smeta_box {
    display: flex;
    justify-content: space-between;
  }
  .p-ai1 .p-feature2 .smeta_panel {
    flex-basis: calc(33.333% - 24px);
  }
  .p-ai1 .p-feature2 .box_title {
    text-align: center;
  }
  .p-ai2 .usagefee_box .sub {
    margin-top: 0.5em;
  }
  .p-ai2 .c-usagefee .usagefee_box {
    flex-basis: calc(50% - 40px);
  }
}
@media (min-width: 768px) and (max-width: 1000px) {
  .p-ai2 .usagefee_box .main {
    font-size: 4.6vw;
  }
  .p-ai2 .usagefee_box.-basis .main {
    font-size: 3.6vw;
  }
  .p-ai2 .usagefee_box .sub {
    font-size: 2.4vw;
  }
}
@media (max-width: 767px) {
  .p-ai1 .p-feature2 .smeta_panel:nth-child(n + 2) {
    margin-top: calc(8vw / 3.75);
  }
  .p-ai2 .usagefee_box .main {
    font-size: 3.2rem;
  }
  .p-ai2 .usagefee_box.-basis .main {
    font-size: 2.4rem;
  }
  .p-ai2 .usagefee_box .sub {
    font-size: 2rem;
  }
  .p-ai2 .c-usagefee .usagefee_box.-plice {
    margin-top: 24px;
  }
}
@media (max-width: 374px) {
  .p-ai2 .usagefee_box .main {
    font-size: calc(32vw / 3.75);
  }
  .p-ai2 .usagefee_box.-basis .main {
    font-size: calc(24vw / 3.75);
  }
  .p-ai2 .usagefee_box .sub {
    font-size: calc(20vw / 3.75);
  }
}

/* :::::: 最大63%の工数削減 :::::: */
.p-ai1 .p-feature3 .figure {
  z-index: 0;
  position: relative;
  margin-top: 56px;
}
.p-ai1 .p-feature3 .graph {
  line-height: 1.4;
  font-weight: 700;
  white-space: nowrap;
}
.p-ai1 .p-feature3 .graph .item {
  display: flex;
  align-items: center;
  position: relative;
}
.p-ai1 .p-feature3 .graph .item {
  justify-content: center;
  text-align: center;
}
.p-ai1 .p-feature3 .after dt small {
  color: #f37d58;
}
.p-ai1 .p-feature3 .graph .bln {
  position: absolute;
  padding: 0.5em;
  border-radius: 5px;
  color: #fff;
  background: #1a8ec7;
}
.p-ai1 .p-feature3 .graph .bln::after {
  content: "";
  position: absolute;
  top: calc(100% - 1px);
  left: calc(50% - 4px);
  border-width: 8px 4px 0;
  border-style: solid;
  border-color: transparent;
  border-top-color: #1a8ec7;
}
.p-ai1 .p-feature3 .graph .i1,
.p-ai1 .p-feature3 .graph .i4 {
  background: #dce1f2;
}
.p-ai1 .p-feature3 .graph .i2,
.p-ai1 .p-feature3 .graph .i5 {
  background: #f5f7ff;
}
.p-ai1 .p-feature3 .graph .i3,
.p-ai1 .p-feature3 .graph .i6 {
  background: #fff;
}
.p-ai1 .p-feature3 .graph .group {
  position: relative;
  flex-grow: 10;
}
.p-ai1 .p-feature3 .graph .group::after {
  content: "";
  z-index: 1;
  position: absolute;
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  border: 4px dashed #f37d58;
}
.p-ai1 .p-feature3 .graph .i7 {
  flex-basis: 8px;
  background: #1a8ec7;
}
.p-ai1 .p-feature3 .graph .i7::before,
.p-ai1 .p-feature3 .graph .i7::after {
  content: "";
  position: absolute;
  z-index: -1;
}
@media (min-width: 768px) {
  .p-ai1 .p-feature3 .graph,
  .p-ai1 .p-feature3 .group {
    display: flex;
    height: calc(80vw / 12);
  }
  .p-ai1 .p-feature3 .after {
    width: calc(38.125% + 12rem);
    margin-top: calc(120vw / 12);
  }
  .p-ai1 .p-feature3 .graph .i1 {
    flex-grow: 2;
  }
  .p-ai1 .p-feature3 .graph .i2 {
    flex-grow: 6;
  }
  .p-ai1 .p-feature3 .graph .i3 {
    flex-grow: 1;
  }
  .p-ai1 .p-feature3 .graph .i4 {
    flex-grow: 3;
  }
  .p-ai1 .p-feature3 .graph .i5 {
    flex-grow: 3;
  }
  .p-ai1 .p-feature3 .graph .i6 {
    flex-grow: 1;
  }
  .p-ai1 .p-feature3 .graph dt {
    display: flex;
    align-items: center;
    position: relative;
  }
  .p-ai1 .p-feature3 .graph dt {
    flex-basis: calc(120vw / 12);
    font-size: calc(20vw / 12);
  }
  .p-ai1 .p-feature3 .graph .item {
    font-size: calc(15vw / 12);
  }
  .p-ai1 .p-feature3 .graph small {
    position: absolute;
    bottom: -2em;
    left: 0;
    width: 100%;
    font-size: calc(15vw / 12);
  }
  .p-ai1 .p-feature3 .graph .bln {
    bottom: calc(100% + 8px);
  }
  .p-ai1 .p-feature3 .graph .i7 {
    flex-basis: calc(8vw / 12);
  }
  .p-ai1 .p-feature3 .graph .i7::before,
  .p-ai1 .p-feature3 .graph .i7::after {
    bottom: 100%;
    border-left: 4px dashed #fff;
    transform-origin: center bottom;
  }
  .p-ai1 .p-feature3 .graph .i7::before {
    left: 0;
    height: calc(120vw / 12);
  }
  .p-ai1 .p-feature3 .graph .i7::after {
    right: 0;
    height: calc(530vw / 12);
    transform: rotate(76.7deg);
  }
}
@media (min-width: 1000px) {
  .p-ai1 .p-feature3 .graph .i7::after {
    transform: rotate(77deg);
  }
}
@media (min-width: 1200px) {
  .p-ai1 .p-feature3 .after {
    width: calc(38.125% + 12rem);
    margin-top: 120px;
  }
  .p-ai1 .p-feature3 .graph dt {
    flex-basis: 12rem;
    font-size: 2rem;
  }
  .p-ai1 .p-feature3 .graph .item {
    font-size: 1.5rem;
  }
  .p-ai1 .p-feature3 .graph small {
    font-size: 1.5rem;
  }
  .p-ai1 .p-feature3 .graph .i7 {
    flex-basis: 8px;
  }
  .p-ai1 .p-feature3 .graph .i7::before {
    height: 120px;
  }
  .p-ai1 .p-feature3 .graph .i7::after {
    height: 530px;
  }
}
@media (max-width: 767px) {
  .p-ai1 .p-feature3 .figure {
    margin-top: 24px;
    padding-right: calc(32vw / 3.75);
    padding-left: calc(8vw / 3.75);
  }
  .p-ai1 .p-feature3 .figure::after {
    content: "";
    display: block;
    clear: both;
  }
  .p-ai1 .p-feature3 .graph,
  .p-ai1 .p-feature3 .group {
    display: flex;
    flex-direction: column;
    width: calc(80vw / 3.75);
  }
  .p-ai1 .p-feature3 .before {
    float: left;
  }
  .p-ai1 .p-feature3 .after {
    float: right;
  }
  .p-ai1 .p-feature3 .graph .i1 {
    flex-basis: calc(80vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i2 {
    flex-basis: calc(240vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i3 {
    flex-basis: calc(40vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i4 {
    flex-basis: calc(120vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i5 {
    flex-basis: calc(120vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i6 {
    flex-basis: calc(40vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i7 {
    flex-basis: calc(4vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph dt {
    height: 4em;
    font-size: calc(18vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .item {
    font-size: calc(14vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph small {
    display: block;
    font-size: calc(14vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .item small {
    position: absolute;
    bottom: 100%;
    left: calc(100% + 0.4em);
    transform-origin: left bottom;
    transform: rotate(90deg);
  }
  .p-ai1 .p-feature3 .graph .i2 small,
  .p-ai1 .p-feature3 .graph .i4 small,
  .p-ai1 .p-feature3 .graph .i5 small {
    bottom: 50%;
  }
  .p-ai1 .p-feature3 .graph .i7 small {
    bottom: 1.3em;
  }
  .p-ai1 .p-feature3 .graph .bln {
    right: 100%;
    transform: rotate(-90deg) translateY(calc(100% + 8vw / 3.75));
  }
  .p-ai1 .p-feature3 .graph .i7::before,
  .p-ai1 .p-feature3 .graph .i7::after {
    right: 100%;
    border-top: 4px dashed #fff;
    transform-origin: right center;
  }
  .p-ai1 .p-feature3 .graph .i7::before {
    top: 0;
    width: calc(88vw / 3.75);
  }
  .p-ai1 .p-feature3 .graph .i7::after {
    bottom: 0;
    width: calc(410vw / 3.75);
    transform: rotate(-77.6deg);
  }
}

/**
 * 最新の家賃保証業務DX事例集
 * ---------------------------------------- */
.l-floatpanel {
  z-index: 4;
  position: fixed;
  right: 40px;
  bottom: 40px;
  width: 200px;
  padding: 24px;
  border-radius: 5px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  text-align: center;
  background: #fff;
}
.l-floatpanel p {
  font-size: 1.4rem;
  line-height: 1.6;
  font-weight: 700;
}
.l-floatpanel .c-button {
  height: 35px;
  margin-top: 8px;
  font-size: 1.4rem;
}
.l-floatpanel .c-button .bg {
  border: 1px solid #1a8ec7;
  background: #1a8ec7;
}
@media (hover: hover) {
  .l-floatpanel .c-button .bg::after {
    background: #fff;
  }
  .l-floatpanel .c-button.is-hov {
    color: #1a8ec7;
  }
}
@media (max-width: 767px) {
  .l-floatpanel {
    right: 24px;
    bottom: 24px;
    right: 17px;
    bottom: 120px;
  }
}
.l-floatpanel:not(.is-active) {
  opacity: 0;
  transform: scale(0.8);
}
.l-floatpanel.is-anim {
  transition:
    opacity 0.6s,
    transform 0.6s cubic-bezier(0.2, 1, 0.7, 1);
  transition-timing-function: cubic-bezier(0.2, 1.5, 0.4, 1);
}

/**
 * よくあるご質問
 * ---------------------------------------- */
.p-aside::before,
.l-panels::before {
  content: "";
  position: absolute;
  top: 0;
  right: calc(50% - 50vw);
  bottom: 0;
  left: calc(50% - 50vw);
  background: #fff;
}
.hasScrollbar .p-aside::before,
.hasScrollbar .l-panels::before {
  right: calc(50% - 50vw + var(--scroll-bar-width) / 2);
  left: calc(50% - 50vw + var(--scroll-bar-width) / 2);
}
.p-aside {
  position: relative;
  padding-top: 120px;
}
.p-aside .c-button {
  height: 80px;
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  line-height: 1.4;
  text-align: center;
}
.l-panels {
  position: relative;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 120px;
  padding-bottom: 180px;
}
@media (min-width: 481px) {
  .p-aside {
    display: flex;
    justify-content: space-between;
    gap: 16px;
  }
  .p-aside.lined {
    padding-top: 24px;
  }
  .p-aside .c-button {
    flex-basis: calc(50% - 8px);
    max-width: 480px;
  }
  .p-aside .c-button.triple {
    flex-basis: calc(100% / 3 - 8px);
    width: 100%;
    max-width: 480px;
    font-size: 1.6rem;
  }
}
@media (min-width: 481px) and (max-width: 767px) {
  .p-aside .c-button .arr {
    display: none;
  }
}
@media (min-width: 768px) {
  .p-aside .c-button {
    flex-basis: calc(50% - 24px);
  }
  .p-aside .c-button.triple {
    flex-basis: calc(100% / 2 - 10px);
    box-sizing: border-box;
    padding: 0 45px;
    text-align: center;
    line-height: 1.4;
  }
}
@media (max-width: 480px) {
  .p-aside .c-button {
    height: calc(64vw / 3.75);
    font-size: calc(18vw / 3.75);
  }
  .p-aside .c-button + .c-button {
    margin-top: 24px;
  }
}

/**
 * smeta入居審査AI リッチ化
 * ---------------------------------------- */

.smeta_ai_box {
  padding-top:;
}
.smeta_ai_01_list {
  display: flex;
  justify-content: space-between;
  padding: 20px;
  background: #fff;
  flex-wrap: wrap;
}
.smeta_ai_01_list li {
  width: calc(100% / 3);
  box-sizing: border-box;
  text-align: center;
  padding: 0 10px;
}
.smeta_ai_01_list li p {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 1.5;
  margin: 10px 0;
}
.smeta_ai_01_list li img {
  width: 120px;
  height: auto;
}
.p-ai-feature3 .smeta_box {
  padding-bottom: 80px;
}
@media (max-width: 480px) {
  .smeta_ai_01_list {
    margin: 40px 0 0;
  }
  .smeta_ai_01_list li {
    width: 100%;
  }
}
