@charset "UTF-8";
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
small,
button,
time,
figure {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

li,
dd {
  list-style-type: none;
}

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

img {
  border: none;
  vertical-align: bottom;
}

a {
  cursor: pointer;
  text-decoration: none;
}

/*----------------------------------
    clamp関数
-----------------------------------*/
/*----------------------------------
    fz-rem関数
-----------------------------------*/
/*----------------------------------
　　    pxをremに変換する関数
-----------------------------------*/
/*----------------------------------
　　    フォントサイズをレスポンシブにするmixin (pxをremに変換)
-----------------------------------*/
/*----------------------------------
使い方
@include responsive-font-size(16px, 24px, 375px, 1366px);
-----------------------------------*/
@-webkit-keyframes heartbeat {
  0%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
}
@keyframes heartbeat {
  0%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 3px;
  font-size: 16px;
}

body {
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; /* Safari */
  color: #333;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.56;
}

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

a {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease; /* 透過度の変化にアニメーションを適用 */
  color: inherit;
}
a:hover {
  opacity: 0.8; /* ホバー時の透過度を設定 */
}

@media (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
  }
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

.l-inner {
  padding-inline: 15px;
  max-width: 486px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .l-inner {
    max-width: 1366px;
    padding-inline: clamp(30px, 30px + (173) * (100vw - 768px) / (1366 - 768), 203px);
  }
}

.l-inner-2 {
  padding-inline: 38px;
  max-width: 486px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .l-inner-2 {
    max-width: 1366px;
    padding-inline: clamp(30px, 30px + (173) * (100vw - 768px) / (1366 - 768), 203px);
  }
}

.l-header {
  z-index: 997;
  position: fixed;
  right: 0;
}
@media screen and (min-width: 768px) {
  .l-header {
    right: auto;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.16);
            box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }
}

.l-header__inner {
  position: relative;
  padding-inline: 15px;
  padding-block: 16px 11px;
  width: 59px;
  height: 55px;
  border-radius: 0 0 0 15px;
  background: rgba(255, 255, 255, 0.5);
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .l-header__inner {
    padding-inline: 30px 21px;
    width: 100%;
    max-width: 1500px;
    margin-inline: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.l-header__nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 23px;
}

.l-header__button {
  width: 220px;
  display: block;
}

.l-drawer-icon {
  position: relative;
  width: 28px;
  height: 22px;
  cursor: pointer;
  z-index: 106;
}
.l-drawer-icon.is-checked .c-drawer-icon__bar1 {
  width: 28px;
  top: 16px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  z-index: 999;
  background: #1c415e;
}
.l-drawer-icon.is-checked .c-drawer-icon__bar2 {
  display: none;
}
.l-drawer-icon.is-checked .c-drawer-icon__bar3 {
  top: 16px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  z-index: 999;
}

.c-drawer-icon__bar1 {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 28px;
  height: 2px;
  border-radius: 1.5px;
  background: #1c415e;
  -webkit-transition: top 0.3s linear, -webkit-transform 0.3s linear;
  transition: top 0.3s linear, -webkit-transform 0.3s linear;
  transition: transform 0.3s linear, top 0.3s linear;
  transition: transform 0.3s linear, top 0.3s linear, -webkit-transform 0.3s linear;
}

.c-drawer-icon__bar2 {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 0%;
  width: 28px;
  height: 2px;
  border-radius: 1.5px;
  background: #1c415e;
}

.c-drawer-icon__bar3 {
  position: absolute;
  bottom: 0%;
  left: 0%;
  width: 28px;
  height: 1.6px;
  border-radius: 1.5px;
  background: #1c415e;
  -webkit-transition: top 0.3s linear, -webkit-transform 0.3s linear;
  transition: top 0.3s linear, -webkit-transform 0.3s linear;
  transition: transform 0.3s linear, top 0.3s linear;
  transition: transform 0.3s linear, top 0.3s linear, -webkit-transform 0.3s linear;
}

/*----------------------------------
    drawer
-----------------------------------*/
#js-drawer-content {
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: translateX(100%);
          transform: translateX(100%); /* 初期状態を右側に設定 */
}

.l-drawer-content {
  position: fixed;
  top: 0;
  right: 0;
  width: 100dvw;
  height: 100dvh;
  z-index: 105;
  background: url(../img/drawer_bg_sp.webp) no-repeat center center/cover;
  overflow-y: auto;
  padding-bottom: 38px;
}
@media screen and (min-width: 768px) {
  .l-drawer-content {
    width: 100%;
    height: 100vh;
    background: url(../img/drawer_bg_pc.webp) no-repeat center center/cover;
  }
}

.l-drawer__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-inline: 30px;
  margin-inline: auto;
  max-width: 400px;
}
@media screen and (min-width: 768px) {
  .l-drawer__inner {
    max-width: 1500px;
    padding-inline: 40px;
  }
}

.l-drawer__title {
  padding-top: 31px;
  padding-bottom: 5px;
  margin-inline: 9px;
  padding-inline: 9px;
  border-bottom: 1px solid #3794cd;
}
@media screen and (min-width: 768px) {
  .l-drawer__title {
    padding-top: 43px;
    margin-inline: 0;
    padding-inline: 9px;
  }
}
.l-drawer__title p {
  font-size: 1rem;
  font-family: "Roboto", sans-serif;
  line-height: 1.13;
  color: #3794cd;
}

.l-drawer__nav {
  padding-top: 38px;
  padding-inline: 35px;
}
@media screen and (min-width: 768px) {
  .l-drawer__nav {
    padding-top: 59px;
    margin-inline: auto;
  }
}

.l-drawer__nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 22.3px;
}
@media screen and (min-width: 768px) {
  .l-drawer__nav-list {
    gap: 36.5px;
    margin-inline: auto;
  }
}

.l-drawer__menu-ja {
  line-height: 1.56;
  letter-spacing: -0.5px;
  color: #1c415e;
  font-weight: 600;
}
.l-drawer__menu-ja span {
  color: #c5e0f2;
  font-size: 0.625rem;
}
@media screen and (min-width: 768px) {
  .l-drawer__menu-ja {
    text-align: left;
  }
}

.l-drawer__btn-wrapper {
  padding-top: 26px;
}

.l-drawer-btn-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 25px;
}
@media screen and (min-width: 768px) {
  .l-drawer-btn-wrapper {
    display: none;
  }
}

.l-drawer__btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .l-drawer__btn {
    display: none;
  }
}

.l-drawer-btn__icon {
  width: 313px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.l-footer {
  background-color: #132a3e; /* フッターの背景色 */
  color: #fff; /* テキストの色 */
  padding-block: 13px 20px;
}
@media screen and (min-width: 768px) {
  .l-footer {
    padding-block: 10px 12px;
  }
}

.l-footer__inner {
  padding-inline: 15px;
  max-width: 486px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .l-footer__inner {
    padding-inline: 33px;
    max-width: 1366px;
    margin-inline: auto;
  }
}

.l-footer__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; /* 垂直方向の中央に配置 */
  position: relative;
  gap: 15px;
}
@media screen and (min-width: 768px) {
  .l-footer__content {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.l-footer__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 21px;
}
@media screen and (min-width: 768px) {
  .l-footer__links {
    gap: 27px;
  }
}
.l-footer__links a {
  font-size: 0.6875rem;
  line-height: 1.55;
  text-decoration: underline;
  text-underline-offset: 0px;
  text-decoration-thickness: 1px;
  color: #fff;
}

.l-footer__copyright {
  text-align: center;
}
.l-footer__copyright small {
  font-size: 0.6875rem; /* コピーライトのフォントサイズ */
  line-height: 1.55;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .l-footer__copyright small {
    padding-top: 0;
  }
}

.c-btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.c-button {
  border: solid 1px #fff;
  display: block;
  font-size: 1.125rem;
  width: clamp(345px, 345px + (205) * (100vw - 375px) / (1366 - 375), 550px);
  height: clamp(40px, 40px + (35) * (100vw - 375px) / (1366 - 375), 75px);
  display: grid;
  place-items: center;
  text-align: center;
}
/*----------------------------------
      <div class="p-mv-btn c-btn">
            <a class="c-button" href="#">会員登録する（無料）</a>
          </div>
-----------------------------------*/
.c-scroll-to-top {
  position: fixed;
  z-index: 100;
  bottom: 20px;
  right: 20px;
  background-color: transparent;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  opacity: 0;
  visibility: hidden;
}
.c-scroll-to-top__text {
  font-size: 12px;
  margin-bottom: 5px;
  color: #333;
  opacity: 0.7;
}
.c-scroll-to-top__icon {
  opacity: 0.7;
  width: 50px;
  height: 50px;
  background-color: rgba(128, 128, 128, 0.7);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.c-scroll-to-top__icon::after {
  content: "";
  width: 35px;
  height: 35px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='19' x2='12' y2='5'%3E%3C/line%3E%3Cpolyline points='5 12 12 5 19 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.c-scroll-to-top.visible {
  opacity: 1;
  visibility: visible;
}
.c-scroll-to-top:hover .c-scroll-to-top__icon {
  background-color: rgba(128, 128, 128, 0.9);
}

.p-mv {
  background: url(../img/mv_bg_sp.webp) no-repeat center center/cover;
  position: relative;
  padding-bottom: clamp(272px, 272px + (128) * (100vw - 375px) / (768 - 375), 400px);
}
@media screen and (min-width: 768px) {
  .p-mv {
    background: url(../img/mv_bg_pc.webp) no-repeat center center/cover;
    padding-bottom: clamp(30px, 30px + (46) * (100vw - 768px) / (1366 - 768), 76px);
  }
}

.p-mv__title {
  width: 358px;
  width: clamp(358px, 358px + (117) * (100vw - 375px) / (768 - 375), 475px);
  padding-top: 17px;
  position: relative;
  z-index: 3;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-mv__title {
    padding-top: 79px;
    width: clamp(400px, 400px + (320) * (100vw - 768px) / (1366 - 768), 720px);
  }
}

.p-mv__people {
  position: absolute;
  bottom: clamp(0px, 0px + (60) * (100vw - 375px) / (768 - 375), 60px);
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
          transform: translate(-50%, 0%);
  width: 100%;
  max-width: 475px;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-mv__people {
    bottom: 0;
    max-width: 1366px;
  }
}

.p-mv__bottom {
  position: absolute;
  width: 100%;
  bottom: -1.5px;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
          transform: translate(-50%, 0%);
  z-index: 2;
}

/*----------------------------------
    CTA
-----------------------------------*/
.p-cta {
  position: relative;
  z-index: 3;
  background: #c5e0f2;
  padding-bottom: 33px;
}
@media screen and (min-width: 768px) {
  .p-cta {
    padding-bottom: 50px;
  }
}

.p-cta__boxes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
}
@media screen and (min-width: 768px) {
  .p-cta__boxes {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: clamp(20px, 20px + (20) * (100vw - 768px) / (1366 - 768), 40px);
  }
}

.p-cta__box {
  border-radius: 20px;
  border: solid 3px #2271a7;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-cta__box {
    padding-inline: 20px;
  }
}

.p-cta__box-1 {
  padding-top: 17px;
  padding-inline: 7px;
  padding-bottom: 7px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-1 {
    padding-top: 25px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.p-cta__box-text-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: left;
      -ms-flex-align: left;
          align-items: left;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.p-cta__box-1-text {
  text-align: left;
}
.p-cta__box-1-text p {
  font-size: 1.125rem;
  line-height: 1.45;
  color: #2271a7;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-cta__box-1-text p {
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
  }
}

.p-cta__box-1-text-number {
  font-family: "Roboto", sans-serif;
  font-size: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-cta__box-1-text-number {
    font-size: clamp(1.875rem, 1.0723244147rem + 1.6722408027vw, 2.5rem);
  }
}

.p-cta-text-style-strong {
  font-size: 1.375rem;
}
@media screen and (min-width: 768px) {
  .p-cta-text-style-strong {
    font-size: clamp(1.375rem, 0.7328595318rem + 1.3377926421vw, 1.875rem);
  }
}

.p-cta-text-style-strong-2 {
  font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-cta-text-style-strong-2 {
    font-size: clamp(1.875rem, 1.3933946488rem + 1.0033444816vw, 2.25rem);
  }
}

.p-cta__box-1-img {
  margin-top: -34px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-1-img {
    margin-top: -48px;
  }
}

.p-cta__box-2 {
  padding-top: 5px;
  padding-inline: 7px;
  padding-bottom: 7px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-2 {
    padding-inline: 15px;
  }
}

@media screen and (min-width: 768px) {
  .p-cta__box-2-text {
    padding-inline: 7px;
  }
}
.p-cta__box-2-text p {
  font-size: 0.875rem;
  line-height: 1.45;
  color: #2271a7;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-cta__box-2-text p {
    font-size: clamp(0.875rem, 0.5539297659rem + 0.6688963211vw, 1.125rem);
  }
}

.p-cta__box-2-img {
  padding-top: 5px;
  max-width: 400px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-2-img {
    padding-top: 9px;
    max-width: 430px;
  }
}

.p-cta__box-2-text-wrap {
  padding-top: 13px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-2-text-wrap {
    padding-top: 19px;
  }
}

.p-cta__box-2-text-sub {
  font-size: 0.75rem;
  line-height: 1.5;
  padding-left: 10px;
  max-width: 450px;
}
@media screen and (min-width: 768px) {
  .p-cta__box-2-text-sub {
    max-width: 100%;
  }
}

.p-cta__btn {
  display: block;
  margin-top: 20px;
  max-width: 400px;
  margin-inline: auto;
  -webkit-animation: 1.5s linear backwards infinite heartbeat;
          animation: 1.5s linear backwards infinite heartbeat;
}
@media screen and (min-width: 768px) {
  .p-cta__btn {
    margin-top: 42px;
    max-width: 490px;
    width: clamp(400px, 400px + (90) * (100vw - 768px) / (1366 - 768), 490px);
  }
}

/*----------------------------------
    About
-----------------------------------*/
.p-about {
  padding-block: 50px 0px;
  background-color: #dfdfdf;
}
@media screen and (min-width: 768px) {
  .p-about {
    padding-block: 59px 0px;
  }
}

.p-about__title-wrap {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
}

.p-about__title-img {
  width: 52px;
  position: absolute;
  top: -33px;
  right: 15px;
}
@media screen and (min-width: 768px) {
  .p-about__title-img {
    top: 50%;
    right: -82px;
    translate: 0 -50%;
    width: clamp(52px, 52px + (27) * (100vw - 768px) / (1366 - 768), 79px);
  }
}

.p-about__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-inline: 15px;
  text-align: center;
}

.p-about__title-1 {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-about__title-1 {
    font-size: clamp(1.125rem, 0.1617892977rem + 2.0066889632vw, 1.875rem);
    line-height: 1.6;
  }
}

.p-about__title-2 {
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.5;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-about__title-2 {
    font-size: clamp(1.375rem, 0.2512541806rem + 2.3411371237vw, 2.25rem);
    line-height: 1.6;
  }
}

.p-about__boxes-inner {
  padding-top: 20px;
  max-width: 510px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-about__boxes-inner {
    padding-top: 25px;
    max-width: 1366px;
    padding-inline: clamp(30px, 30px + (173) * (100vw - 768px) / (1366 - 768), 203px);
  }
}

.p-about__boxes {
  background: #eee;
  padding-inline: 15px;
  padding-block: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  border-radius: 10px;
}
@media screen and (min-width: 768px) {
  .p-about__boxes {
    padding-block: 40px;
    padding-inline: clamp(20px, 20px + (20) * (100vw - 768px) / (1366 - 768), 40px);
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
    row-gap: 17px;
  }
}

.p-about__box {
  position: relative;
  background: #fff;
  padding-inline: 15px;
  padding-block: 16px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 10px;
  width: 100%;
  max-width: 400px;
  min-height: 85px;
}
@media screen and (min-width: 768px) {
  .p-about__box {
    padding-inline: 20px;
    max-width: 100%;
    width: calc(50% - 10px);
  }
}

.p-about__box-img {
  position: absolute;
  left: 15px;
  top: 50%;
  translate: 0 -50%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 32px;
}
@media screen and (min-width: 768px) {
  .p-about__box-img {
    left: 20px;
  }
}

.p-about__box-text {
  padding-left: 45px;
  text-align: center;
  font-weight: 600;
  font-size: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-about__box-text {
    padding-left: 50px;
  }
}

.p-about__people {
  margin-inline: auto;
  margin-top: -5px;
  width: 311px;
}
@media screen and (min-width: 768px) {
  .p-about__people {
    width: clamp(450px, 450px + (150) * (100vw - 768px) / (1366 - 768), 600px);
  }
}

/*----------------------------------
    Service
-----------------------------------*/
.p-service {
  background-color: #e5f0f9;
  background-image: url(../img/servise-mask-sp.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  position: relative;
  padding-top: 38px;
}
@media screen and (min-width: 768px) {
  .p-service {
    padding-top: clamp(38px, 38px + (39) * (100vw - 375px) / (1366 - 375), 77px);
    background-image: url(../img/servise-mask-pc.webp);
    background-size: cover;
    padding-bottom: 100px;
  }
}
.p-service::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  translate: -50% 0;
  width: 100%;
  height: 38px;
  background-color: #dfdfdf;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 0%, 50% 100%, 0 0%);
          clip-path: polygon(0 0, 100% 0, 100% 0%, 50% 100%, 0 0%);
}
@media screen and (min-width: 768px) {
  .p-service::before {
    height: clamp(38px, 38px + (25) * (100vw - 768px) / (1366 - 768), 63px);
  }
}

.p-service__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  padding-top: 36px;
}

.p-service__title-1 {
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-service__title-1 {
    font-size: clamp(1.125rem, 0.1617892977rem + 2.0066889632vw, 1.875rem);
    line-height: 1.6;
  }
}

.p-service__title-2 {
  display: inline-block;
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.29;
  color: #2271a7;
}
@media screen and (min-width: 768px) {
  .p-service__title-2 {
    font-size: clamp(1.75rem, 0.5459866221rem + 2.508361204vw, 2.6875rem);
  }
}

.p-service__contents-inner {
  position: relative;
  margin-top: 131px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-service__contents-inner {
    max-width: 1366px;
    padding-inline: clamp(30px, 30px + (173) * (100vw - 768px) / (1366 - 768), 203px);
    margin-top: clamp(170px, 170px + (82) * (100vw - 768px) / (1366 - 768), 252px);
  }
}

.p-service__contents {
  position: relative;
  background: #92c6e7;
  border-radius: 10px 10px 0 0;
  padding-inline: 15px;
  padding-block: 36px 21px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-service__contents {
    padding-inline: clamp(20px, 20px + (20) * (100vw - 768px) / (1366 - 768), 40px);
    border-radius: 10px;
    padding-block: 36px 37px;
  }
}

.p-service__contents-wrap {
  max-width: 510px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-service__contents-wrap {
    max-width: 100%;
  }
}

.p-service__img {
  margin-inline: auto;
  position: absolute;
  top: 8px;
  left: 50%;
  translate: -50% -100%;
  width: 313px;
}
@media screen and (min-width: 768px) {
  .p-service__img {
    top: 15px;
    width: clamp(400px, 400px + (198) * (100vw - 768px) / (1366 - 768), 598px);
  }
}

.p-service__contents-title {
  text-align: center;
}
.p-service__contents-title h3 {
  text-shadow: #fff 2px 0, #fff -2px 0, #fff 0 -2px, #fff 0 2px, #fff 2px 2px, #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px, #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px, #fff -2px -1px;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
  color: #1b4d71;
}
@media screen and (min-width: 768px) {
  .p-service__contents-title h3 {
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
    line-height: 1.58;
  }
}

.p-service__contents-items-1 {
  padding-top: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
}
@media screen and (min-width: 768px) {
  .p-service__contents-items-1 {
    padding-top: 26px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
    row-gap: 20px;
  }
}

.p-service__contents-item {
  text-align: center;
  background-color: #fff;
  padding-block: 14px 13px;
  padding-inline: 1.9px;
  border-radius: 10px;
}
@media screen and (min-width: 768px) {
  .p-service__contents-item {
    width: calc(50% - 10px);
  }
}
.p-service__contents-item p {
  color: #1c415e;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-service__contents-item p {
    font-size: clamp(0.875rem, 0.5539297659rem + 0.6688963211vw, 1.125rem);
  }
}

.p-service__contents-items-2-title {
  margin-top: 44px;
  padding-block: 6px 5px;
  background: #2271a7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .p-service__contents-items-2-title {
    margin-top: 42px;
  }
}
.p-service__contents-items-2-title h3 {
  color: #fff;
  font-weight: 600;
}

.p-service__contents-items-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -webkit-column-gap: 9px;
     -moz-column-gap: 9px;
          column-gap: 9px;
  row-gap: 8px;
  padding-top: 15px;
}
@media screen and (min-width: 768px) {
  .p-service__contents-items-2 {
    padding-top: 20px;
    grid-template-columns: repeat(4, 1fr);
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
    row-gap: 20px;
  }
}

.p-service__contents-item-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  background: #f2f8fd;
  border-radius: 10px;
  min-width: 168px;
  min-height: 87px;
}
@media screen and (min-width: 768px) {
  .p-service__contents-item-2 {
    min-height: 108px;
    min-width: 0;
  }
}

.p-service__contents-item-2-number {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 20px;
  height: 20px;
  background-color: #3794cd;
  color: #fff;
  font-size: 0.75rem;
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
@media screen and (min-width: 768px) {
  .p-service__contents-item-2-number {
    width: 24px;
    height: 24px;
  }
}
.p-service__contents-item-2-number::before {
  content: attr(data-number);
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.p-service__contents-item-2-text {
  text-align: center;
}
.p-service__contents-item-2-text p {
  font-weight: 600;
  line-height: 1.5;
  color: #2271a7;
}

.p-service__contents-text {
  padding-top: 23px;
}
@media screen and (min-width: 768px) {
  .p-service__contents-text {
    padding-top: 43px;
  }
}
.p-service__contents-text p {
  font-weight: 600;
}

.p-service__contents-item-2-text-fz14 {
  font-size: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-service__contents-item-2-text-fz14 {
    font-size: clamp(0.875rem, 0.7144648829rem + 0.3344481605vw, 1rem);
  }
}

.p-service__contents-item-2-text-fz16 {
  font-size: 1rem;
}

/*----------------------------------
    Feature
-----------------------------------*/
.p-feature {
  background-color: #2271a7;
  background-image: url(../img/feature_bg-sp.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  position: relative;
  padding-block: 35px 38px;
}
@media screen and (min-width: 768px) {
  .p-feature {
    padding-block: 108px 100px;
    background-image: url(../img/feature_bg-pc.webp);
    background-size: cover;
  }
}

.p-feature__title {
  text-align: center;
  padding-inline: 15px;
}
.p-feature__title h2 {
  font-size: 1.375rem;
  line-height: 1.5;
  color: #fff;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-feature__title h2 {
    font-size: clamp(1.375rem, 0.2512541806rem + 2.3411371237vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-feature__boxes {
  padding-top: 47px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 48px;
}
@media screen and (min-width: 768px) {
  .p-feature__boxes {
    padding-top: 71px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    -webkit-column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
       -moz-column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
            column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
    row-gap: 20px;
  }
}

.p-feature__box {
  position: relative;
  background-color: #fff;
  border-radius: 10px;
  padding-inline: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 20px;
  padding-block: 40px 20px;
  min-height: 475px;
}
@media screen and (min-width: 768px) {
  .p-feature__box {
    width: calc((100% - 30px) / 3);
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    min-height: clamp(470px, 470px + (36) * (100vw - 768px) / (1366 - 768), 506px);
    padding-inline: clamp(12px, 12px + (8) * (100vw - 768px) / (1366 - 768), 20px);
    padding-block: 40px 40px;
  }
}
@media screen and (min-width: 950px) {
  .p-feature__box {
    min-height: clamp(456px, 456px + (50) * (100vw - 950px) / (1366 - 950), 506px);
  }
}

.p-feature__box.has-buttons {
  -webkit-padding-after: 44px;
          padding-block-end: 44px;
}
@media screen and (min-width: 768px) {
  .p-feature__box.has-buttons {
    -webkit-padding-after: 40px;
            padding-block-end: 40px;
  }
}

.p-feature__box-number {
  position: absolute;
  top: 0px;
  left: 50%;
  translate: -50% -50%;
  width: 54px;
  height: 54px;
  background-color: #92c6e7;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.875rem;
  font-weight: 600;
  border-radius: 50%;
}

.p-feature__box-title {
  text-align: center;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .p-feature__box-title {
    height: 56px;
  }
}
.p-feature__box-title h3 {
  font-size: 1.125rem;
  color: #1d5b87;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-feature__box-title h3 {
    font-size: clamp(0.9375rem, 0.6966973244rem + 0.5016722408vw, 1.125rem);
  }
}

.p-feature__box-body-text-wrap {
  max-height: 176px;
  overflow: hidden;
  -webkit-transition: max-height 0.3s ease;
  transition: max-height 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-feature__box-body-text-wrap {
    max-height: 176px;
  }
}

@media screen and (min-width: 768px) {
  .p-feature__box-body-text {
    font-size: clamp(0.875rem, 0.875rem + 0vw, 0.875rem);
  }
}
@media screen and (min-width: 950px) {
  .p-feature__box-body-text {
    font-size: clamp(1rem, 1rem + 0vw, 1rem);
  }
}

.p-feature__text {
  padding-top: 40px;
  padding-inline: 25px;
  text-align: center;
}
.p-feature__text p {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.6;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-feature__text p {
    font-size: clamp(1.25rem, 0.4473244147rem + 1.6722408027vw, 1.875rem);
    line-height: 1.5;
  }
}

/*----------------------------------
    button
-----------------------------------*/
.p-feature__box-buttons {
  padding: 0px 4px 8px;
  position: absolute;
  bottom: 0;
  right: 0;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-feature__box-readmore {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  padding: 5px 10px;
  font-size: 0.75rem;
  line-height: 1;
  height: 18px;
  -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
}

.p-feature__box-button-text {
  display: inline-block;
  vertical-align: middle;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.p-feature__box-button-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 5px;
  background-image: url(../img/read-2.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}

.p-feature__box-readmore[aria-expanded=true] .p-feature__box-button-icon {
  -webkit-transform: rotate(180deg) translateY(0%);
          transform: rotate(180deg) translateY(0%);
}

.p-feature__box-readmore[aria-expanded=true] .p-feature__box-button-text {
  opacity: 0;
}

/*----------------------------------
    /button
-----------------------------------*/
/*----------------------------------
    Difference
-----------------------------------*/
.p-difference {
  background-color: #c5e0f2;
  background-image: url(../img/feature_bg-sp.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  position: relative;
  padding-block: 35px 42px;
}
@media screen and (min-width: 768px) {
  .p-difference {
    padding-block: 108px 66px;
    background-image: url(../img/feature_bg-pc.webp);
    background-size: cover;
  }
}

.p-difference__title {
  text-align: center;
  padding-inline: 15px;
}
.p-difference__title h2 {
  font-size: 1.375rem;
  line-height: 1.5;
  color: #1c415e;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-difference__title h2 {
    font-size: clamp(1.375rem, 0.2512541806rem + 2.3411371237vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-difference__boxes {
  padding-top: 47px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 48px;
}
@media screen and (min-width: 768px) {
  .p-difference__boxes {
    padding-top: 71px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    -webkit-column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
       -moz-column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
            column-gap: clamp(15px, 15px + (15) * (100vw - 768px) / (1366 - 768), 30px);
    row-gap: 20px;
  }
}

.p-difference__box {
  position: relative;
  background-color: #fff;
  border-radius: 10px;
  padding-inline: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 20px;
  padding-block: 40px 20px;
  min-height: 475px;
}
@media screen and (min-width: 768px) {
  .p-difference__box {
    width: calc((100% - 30px) / 3);
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    min-height: clamp(400px, 400px + (76) * (100vw - 768px) / (1366 - 768), 476px);
    padding-inline: clamp(12px, 12px + (8) * (100vw - 768px) / (1366 - 768), 20px);
    padding-block: 40px 40px;
  }
}

.p-difference__box.has-buttons {
  -webkit-padding-after: 44px;
          padding-block-end: 44px;
}
@media screen and (min-width: 768px) {
  .p-difference__box.has-buttons {
    -webkit-padding-after: 40px;
            padding-block-end: 40px;
  }
}

.p-difference__box-number {
  position: absolute;
  top: 0px;
  left: 50%;
  translate: -50% -50%;
  width: 54px;
  height: 54px;
  background-color: #92c6e7;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.875rem;
  font-weight: 600;
  border-radius: 50%;
}

.p-difference__box-title {
  text-align: center;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .p-difference__box-title {
    height: 56px;
  }
}
.p-difference__box-title h3 {
  font-size: 1.125rem;
  color: #1d5b87;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-difference__box-title h3 {
    font-size: clamp(0.9375rem, 0.6966973244rem + 0.5016722408vw, 1.125rem);
  }
}

.p-difference__box-body-text-wrap {
  max-height: 176px;
  overflow: hidden;
  -webkit-transition: max-height 0.3s ease;
  transition: max-height 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-difference__box-body-text-wrap {
    max-height: 176px;
  }
}

@media screen and (min-width: 768px) {
  .p-difference__box-body-text {
    font-size: clamp(0.875rem, 0.875rem + 0vw, 0.875rem);
  }
}
@media screen and (min-width: 950px) {
  .p-difference__box-body-text {
    font-size: clamp(1rem, 1rem + 0vw, 1rem);
  }
}

.p-feature__text {
  padding-top: 40px;
  padding-inline: 25px;
  text-align: center;
}
.p-feature__text p {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.6;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-feature__text p {
    font-size: clamp(1.25rem, 0.4473244147rem + 1.6722408027vw, 1.875rem);
    line-height: 1.5;
  }
}

/*----------------------------------
    button
-----------------------------------*/
.p-difference__box-buttons {
  padding: 0px 4px 8px;
  position: absolute;
  bottom: 0;
  right: 0;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-difference__box-readmore {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  padding: 5px 10px;
  font-size: 0.75rem;
  line-height: 1;
  height: 18px;
  -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
}

.p-difference__box-button-text {
  display: inline-block;
  vertical-align: middle;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.p-difference__box-button-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 5px;
  background-image: url(../img/read-2.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}

.p-difference__box-readmore[aria-expanded=true] .p-difference__box-button-icon {
  -webkit-transform: rotate(180deg) translateY(0%);
          transform: rotate(180deg) translateY(0%);
}

.p-difference__box-readmore[aria-expanded=true] .p-difference__box-button-text {
  opacity: 0;
}

/*----------------------------------
    /button
-----------------------------------*/
/*----------------------------------
    difference swiper
-----------------------------------*/
.p-difference__swiper-wrap {
  margin-top: 23px;
  cursor: -webkit-grab;
  cursor: grab;
}
.p-difference__swiper-wrap:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
@media screen and (min-width: 768px) {
  .p-difference__swiper-wrap {
    margin-top: 38px;
  }
}

.swiper-container {
  position: relative;
}

.p-difference__swiper {
  position: relative;
}
.p-difference__swiper .swiper-slide {
  width: 736px !important;
}

.p-difference__swiper-img {
  width: 736px;
}
.p-difference__swiper-img img {
  width: 736px;
}

.swiper {
  position: relative;
}

.swiper-wrapper {
  position: relative;
}

.p-difference__swiper-text {
  margin-top: -5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
}
.p-difference__swiper-text p {
  font-size: 0.875rem;
  line-height: 1.5;
}

.p-difference__swiper-text-arrow {
  width: 17px;
  margin-top: -8px;
}

/*----------------------------------
    realization
-----------------------------------*/
.p-realization {
  background-color: #e5f0f9;
  background-image: url(../img/servise-mask-sp.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  position: relative;
  padding-top: 38px;
}
@media screen and (min-width: 768px) {
  .p-realization {
    padding-top: clamp(38px, 38px + (39) * (100vw - 375px) / (1366 - 375), 77px);
    background-image: url(../img/servise-mask-pc.webp);
    background-size: cover;
    padding-bottom: 100px;
  }
}

.p-realization__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  padding-top: 23px;
}
@media screen and (min-width: 768px) {
  .p-realization__title {
    padding-top: 20px;
  }
}

.p-realization__title-1 {
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 600;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-realization__title-1 {
    font-size: clamp(1.125rem, 0.1617892977rem + 2.0066889632vw, 1.875rem);
    line-height: 1.6;
  }
}

.p-realization__title-2 {
  padding-top: 4px;
  display: inline-block;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.58;
  color: #2271a7;
}
@media screen and (min-width: 768px) {
  .p-realization__title-2 {
    font-size: clamp(1.5rem, 0.5367892977rem + 2.0066889632vw, 2.25rem);
  }
}

.p-realization__contents-inner {
  position: relative;
  margin-top: 134px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-inner {
    max-width: 1366px;
    padding-inline: clamp(30px, 30px + (173) * (100vw - 768px) / (1366 - 768), 203px);
    margin-top: clamp(170px, 170px + (59) * (100vw - 768px) / (1366 - 768), 229px);
  }
}

.p-realization__img {
  margin-inline: auto;
  position: absolute;
  z-index: 0;
  top: 10px;
  left: 50%;
  translate: -50% -100%;
  width: 375px;
}
@media screen and (min-width: 768px) {
  .p-realization__img {
    top: 88px;
    width: clamp(680px, 680px + (218) * (100vw - 768px) / (1366 - 768), 898px);
  }
}

.p-realization__contents-title {
  border-radius: 10px 10px 0 0;
  background: #2271a7;
  padding-block: 19px 18px;
  margin-inline: auto;
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-title {
    border-radius: 10px 10px 0 0;
    width: 90%;
    padding-block: 19px 4px;
  }
  .p-realization__contents-title::before, .p-realization__contents-title::after {
    content: "";
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    background-color: #2271a7;
    z-index: -1;
  }
  .p-realization__contents-title::before {
    left: -5%;
    translate: 50% 0px;
    border-radius: 10px 0 0 0;
    -webkit-transform: skew(-21deg);
            transform: skew(-21deg);
  }
  .p-realization__contents-title::after {
    right: -5%;
    translate: -50% 0px;
    border-radius: 0 10px 0 0;
    -webkit-transform: skew(21deg);
            transform: skew(21deg);
  }
}
.p-realization__contents-title h3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-title h3 {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    white-space: nowrap;
  }
}

.p-realization__contents-title-1 {
  font-size: 1.5rem;
  line-height: 1.2;
  color: #fff;
  font-weight: 600;
  text-shadow: 2px 2px 1px #132a3e, -2px 2px 1px #132a3e, 2px -2px 1px #132a3e, -2px -2px 1px #132a3e, 2px 0px 1px #132a3e, 0px 2px 1px #132a3e, -2px 0px 1px #132a3e, 0px -2px 1px #132a3e; /* 文字の影 */
}
@media screen and (min-width: 768px) {
  .p-realization__contents-title-1 {
    font-size: clamp(1.5rem, 0.2157190635rem + 2.6755852843vw, 2.5rem);
    line-height: 1.6;
  }
}

.p-realization__contents-title-2 {
  font-size: 1.875rem;
  line-height: 1.2;
  color: #fc0;
  font-weight: 600;
  text-shadow: 2px 2px 1px #132a3e, -2px 2px 1px #132a3e, 2px -2px 1px #132a3e, -2px -2px 1px #132a3e, 2px 0px 1px #132a3e, 0px 2px 1px #132a3e, -2px 0px 1px #132a3e, 0px -2px 1px #132a3e; /* 文字の影 */
}
@media screen and (min-width: 768px) {
  .p-realization__contents-title-2 {
    font-size: clamp(1.5rem, 0.2157190635rem + 2.6755852843vw, 2.5rem);
  }
}

.p-realization__contents {
  position: relative;
  background: #fff;
  padding-inline: 15px;
  padding-block: 18px 32px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-realization__contents {
    padding-inline: clamp(20px, 20px + (20) * (100vw - 768px) / (1366 - 768), 40px);
    border-radius: 10px;
    padding-block: 47px 37px;
    padding-inline: clamp(15px, 15px + (45) * (100vw - 768px) / (1366 - 768), 60px);
    border: 3px solid #2271a7;
  }
}

.p-realization__contents-wrap {
  max-width: 440px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-wrap {
    max-width: 100%;
  }
}

.p-realization__contents-text {
  text-align: center;
  background-color: #e5f0f9;
}
.p-realization__contents-text p {
  font-size: 1.125rem;
  line-height: 2.11;
  color: #2271a7;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-text p {
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
    line-height: 1.58;
  }
}

.p-realization__contents-items {
  padding-top: 12px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-items {
    padding-top: 50px;
    grid-template-columns: repeat(2, 1fr);
    -webkit-column-gap: clamp(20px, 20px + (17) * (100vw - 768px) / (1366 - 768), 37px);
       -moz-column-gap: clamp(20px, 20px + (17) * (100vw - 768px) / (1366 - 768), 37px);
            column-gap: clamp(20px, 20px + (17) * (100vw - 768px) / (1366 - 768), 37px);
    row-gap: clamp(26px, 26px + (12) * (100vw - 768px) / (1366 - 768), 38px);
  }
}

.p-realization__contents-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-realization__contents-item-title {
  width: 100%;
  padding-top: 10px;
  font-size: 1.125rem;
  color: #1d5b87;
  position: relative;
  text-align: center;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-item-title {
    padding-top: 18px;
  }
}
.p-realization__contents-item-title p {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1d5b87;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-item-title p {
    font-size: clamp(1rem, 0.6789297659rem + 0.6688963211vw, 1.25rem);
  }
}
.p-realization__contents-item-title::before, .p-realization__contents-item-title::after {
  content: "";
  position: absolute;
  top: 60%;
  background-color: #3794cd;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  z-index: -1;
}
.p-realization__contents-item-title::before {
  width: 16px;
  height: 16px;
  left: 84px;
  background-color: #f2f8fd;
  z-index: -1;
}
.p-realization__contents-item-title::after {
  width: 24px;
  height: 24px;
  left: 67px;
  background-color: #e5f0f9;
  z-index: -2;
}

.p-realization__contents-item-text {
  padding-top: 8px;
}
@media screen and (min-width: 768px) {
  .p-realization__contents-item-text {
    padding-top: 15px;
    font-size: clamp(0.875rem, 0.7144648829rem + 0.3344481605vw, 1rem);
  }
}

/*----------------------------------
    reason
-----------------------------------*/
.p-reason {
  background-color: #f2f8fd;
  padding-block: 40px;
}
@media screen and (min-width: 768px) {
  .p-reason {
    padding-block: 60px 100px;
  }
}

.p-reason__title h2 {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-reason__title h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 7px;
  }
}

.p-reason__title-1 {
  font-size: 1.375rem;
  line-height: 1.73;
  font-weight: 600;
  color: #1d5b87;
}
@media screen and (min-width: 768px) {
  .p-reason__title-1 {
    font-size: clamp(1.375rem, 1.2144648829rem + 0.3344481605vw, 1.5rem);
    line-height: 1.58;
    color: #1c415e;
  }
}

.p-reason__title-2 {
  font-size: 1.375rem;
  line-height: 1.73;
  font-weight: 600;
  color: #1d5b87;
}
@media screen and (min-width: 768px) {
  .p-reason__title-2 {
    font-size: clamp(1.625rem, 0.8223244147rem + 1.6722408027vw, 2.25rem);
    line-height: 1.33;
    color: #2271a7;
  }
}

.p-reason__title-3 {
  font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-reason__title-3 {
    font-size: clamp(1.625rem, 0.8223244147rem + 1.6722408027vw, 2.25rem);
    line-height: 1.33;
    color: #2271a7;
  }
}

.p-reason__boxes {
  padding-top: 31px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 17px;
}
@media screen and (min-width: 768px) {
  .p-reason__boxes {
    padding-top: 40px;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: clamp(15px, 15px + (7) * (100vw - 768px) / (1366 - 768), 22px);
  }
}

.p-reason__box {
  position: relative;
  padding-inline: 15px;
  padding-block: 15px 17px;
  border-radius: 10px;
  -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  background-color: #fff;
  display: grid;
  grid-template-columns: 67px auto 1fr;
  grid-template-rows: 63px auto 1fr;
  grid-template-areas: "nom title title" "img img img" "text text text";
  z-index: 1;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-reason__box {
    padding-inline: clamp(15px, 15px + (5) * (100vw - 768px) / (1366 - 768), 20px) clamp(28px, 28px + (6) * (100vw - 768px) / (1366 - 768), 34px);
    padding-block: 17px 23px;
    grid-template-columns: clamp(50px, 50px + (18) * (100vw - 768px) / (1366 - 768), 68px) auto 1fr;
    grid-template-rows: 51px auto 1fr;
    grid-template-areas: "nom img title" "nom img text";
    -webkit-column-gap: clamp(12px, 12px + (24) * (100vw - 768px) / (1366 - 768), 36px);
       -moz-column-gap: clamp(12px, 12px + (24) * (100vw - 768px) / (1366 - 768), 36px);
            column-gap: clamp(12px, 12px + (24) * (100vw - 768px) / (1366 - 768), 36px);
  }
}
.p-reason__box::before, .p-reason__box::after {
  content: "";
  position: absolute;
  background-color: #3794cd;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
}
.p-reason__box::before {
  width: 110px;
  height: 110px;
  top: 110px;
  left: -31px;
  background-color: #f2f8fd;
  z-index: -1;
}
.p-reason__box::after {
  width: 138px;
  height: 138px;
  top: 40px;
  left: -42px;
  background-color: #e5f0f9;
  z-index: -2;
}

.p-reason__box-title-nom {
  grid-area: nom;
  align-self: center;
  font-family: "Roboto", sans-serif;
  font-size: clamp(3rem, 3rem + 0vw, 3rem);
  line-height: 0.56;
  font-weight: 600;
  width: 40px;
  color: #92c6e7;
}
@media screen and (min-width: 768px) {
  .p-reason__box-title-nom {
    border-right: 1px solid #57a8d9;
    font-size: clamp(1.875rem, 0.4301839465rem + 3.0100334448vw, 3rem);
    width: 100%;
    height: 100%;
    padding-top: 16px;
  }
}

.p-reason__box-title {
  grid-area: title;
  align-self: center;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-reason__box-title {
    padding-top: 4px;
    -ms-flex-item-align: start;
        align-self: start;
  }
}
.p-reason__box-title h3 {
  font-size: clamp(1.125rem, 1.125rem + 0vw, 1.125rem);
  line-height: 1.56;
  font-weight: 600;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-reason__box-title h3 {
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
    line-height: 1.58;
    text-align: left;
    padding-left: 8px;
  }
}

.p-reason__box-img {
  grid-area: img;
  padding-top: 13px;
  width: 219px;
  justify-self: center;
}
@media screen and (min-width: 768px) {
  .p-reason__box-img {
    border-top: none;
    padding-top: 0;
    margin-top: 10px;
    width: clamp(160px, 160px + (81) * (100vw - 768px) / (1366 - 768), 241px);
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
}

.p-reason__box-text {
  grid-area: text;
  padding-top: 15px;
}
@media screen and (min-width: 768px) {
  .p-reason__box-text {
    padding-top: 0px;
  }
}
@media screen and (min-width: 768px) {
  .p-reason__box-text p {
    font-size: clamp(0.75rem, 0.4289297659rem + 0.6688963211vw, 1rem);
    line-height: 1.56;
    padding-left: 8px;
  }
}

/*----------------------------------
    point
-----------------------------------*/
.p-point {
  background-color: #2271a7;
  background-image: url(../img/point_bg-sp.webp);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  position: relative;
  padding-block: 35px 38px;
}
@media screen and (min-width: 768px) {
  .p-point {
    padding-block: 108px 100px;
    background-image: url(../img/point_bg-pc.webp);
    background-size: cover;
  }
}

.p-point__title {
  text-align: center;
  padding-inline: 15px;
}
.p-point__title h2 {
  font-size: 1.375rem;
  line-height: 1.73;
  color: #fff;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-point__title h2 {
    font-size: clamp(1.375rem, 0.2512541806rem + 2.3411371237vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-point__title-accent {
  font-size: 1.5rem;
  line-height: 1.73;
  color: #fff;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-point__title-accent {
    font-size: clamp(1.375rem, 0.2512541806rem + 2.3411371237vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-point__boxes {
  padding-top: 38px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 42px;
}
@media screen and (min-width: 768px) {
  .p-point__boxes {
    padding-top: 69px;
    grid-template-columns: 1fr 1fr 1fr;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-column-gap: clamp(15px, 15px + (20) * (100vw - 768px) / (1366 - 768), 35px);
       -moz-column-gap: clamp(15px, 15px + (20) * (100vw - 768px) / (1366 - 768), 35px);
            column-gap: clamp(15px, 15px + (20) * (100vw - 768px) / (1366 - 768), 35px);
  }
}

.p-point__box {
  position: relative;
  background-color: #fff;
  border-radius: 10px;
  padding-inline: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
  padding-block: 50px 18px;
}
@media screen and (min-width: 768px) {
  .p-point__box {
    grid-template-rows: subgrid;
    grid-row: span 3;
    gap: 0;
    padding-inline: clamp(12px, 12px + (8) * (100vw - 768px) / (1366 - 768), 20px);
    padding-block: clamp(30px, 30px + (23) * (100vw - 768px) / (1366 - 768), 53px) 17px;
  }
}

.p-point__box-number {
  position: absolute;
  top: 0px;
  left: 50%;
  translate: -50% -50%;
  width: 54px;
  height: 54px;
  background-color: #92c6e7;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.875rem;
  font-weight: 600;
  border-radius: 50%;
}

.p-point__box-title {
  text-align: center;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .p-point__box-title {
    height: 56px;
  }
}
.p-point__box-title h3 {
  font-size: 1.5rem;
  color: #1d5b87;
  font-weight: 600;
  line-height: 1.58;
}
@media screen and (min-width: 768px) {
  .p-point__box-title h3 {
    font-size: clamp(0.9375rem, 0.2150919732rem + 1.5050167224vw, 1.5rem);
  }
}

.p-point__box-img {
  width: 182px;
}
@media screen and (min-width: 768px) {
  .p-point__box-img {
    width: clamp(160px, 160px + (100) * (100vw - 768px) / (1366 - 768), 260px);
    margin-top: clamp(17px, 17px + (10) * (100vw - 768px) / (1366 - 768), 27px);
  }
}

.p-point__box-img-2 {
  margin-top: 10px;
}
@media screen and (min-width: 768px) {
  .p-point__box-img-2 {
    margin-top: clamp(17px, 17px + (10) * (100vw - 768px) / (1366 - 768), 27px);
  }
}

@media screen and (min-width: 768px) {
  .p-point__box-body-text-wrap {
    margin-top: 19px;
  }
}

.p-point__box-body-text-wrap-2 {
  margin-top: 10px;
}
@media screen and (min-width: 768px) {
  .p-point__box-body-text-wrap-2 {
    margin-top: 19px;
  }
}

@media screen and (min-width: 768px) {
  .p-point__box-body-text {
    font-size: clamp(0.875rem, 0.875rem + 0vw, 0.875rem);
  }
}
@media screen and (min-width: 950px) {
  .p-point__box-body-text {
    font-size: clamp(1rem, 1rem + 0vw, 1rem);
  }
}

.p-point__text {
  padding-top: 40px;
  padding-inline: 25px;
  text-align: center;
}
.p-point__text p {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.6;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-point__text p {
    font-size: clamp(1.25rem, 0.4473244147rem + 1.6722408027vw, 1.875rem);
    line-height: 1.5;
  }
}

/*----------------------------------
    example
-----------------------------------*/
.p-example {
  padding-block: 37px 47px;
}
@media screen and (min-width: 768px) {
  .p-example {
    padding-block: 106px 104px;
  }
}

.p-example__title h2 {
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.58;
  font-weight: 600;
  color: #1c415e;
}
@media screen and (min-width: 768px) {
  .p-example__title h2 {
    font-size: clamp(1.5rem, 0.5367892977rem + 2.0066889632vw, 2.25rem);
  }
}

.p-example__contents {
  padding-top: 30px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10.6px;
}
@media screen and (min-width: 768px) {
  .p-example__contents {
    grid-template-columns: repeat(4, 1fr);
    -webkit-column-gap: clamp(10.6px, 10.6px + (0) * (100vw - 768px) / (1366 - 768), 10.6px);
       -moz-column-gap: clamp(10.6px, 10.6px + (0) * (100vw - 768px) / (1366 - 768), 10.6px);
            column-gap: clamp(10.6px, 10.6px + (0) * (100vw - 768px) / (1366 - 768), 10.6px);
    row-gap: 9.6px;
  }
}

.p-example__contents-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #999;
  padding-block: 10px 15px;
  padding-inline: 10px;
}
@media screen and (min-width: 768px) {
  .p-example__contents-item {
    padding-block: 10px 12px;
  }
}

.p-example__contents-item-img-wrap {
  position: relative;
}

.p-example__contents-item-img {
  position: relative;
}
.p-example__contents-item-img::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(19, 42, 62, 0.6)), to(rgba(19, 42, 62, 0.6)));
  background: linear-gradient(rgba(19, 42, 62, 0.6), rgba(19, 42, 62, 0.6));
  z-index: 1;
}

.p-example__contents-item-img-text {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  z-index: 2;
}
.p-example__contents-item-img-text p {
  font-family: "Roboto", sans-serif;
  font-size: 1.125rem;
  line-height: 1;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}

.p-example__contents-item-title {
  z-index: 3;
  border-radius: 2px;
  background-color: #1d5b87;
  width: 88%;
  min-height: 21px;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-example__contents-item-title {
    width: 92%;
  }
}
.p-example__contents-item-title p {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-example__contents-item-title-1 {
  translate: 0 -50%;
}

@media screen and (min-width: 768px) {
  .p-example__contents-item-text-1 {
    margin-top: 5px;
  }
}

.p-example__contents-item-money {
  font-family: "Akshar", sans-serif;
  font-size: 1.4375rem;
  line-height: 0.93;
}

.p-example__contents-item-money-unit {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
}

.p-example__contents-item-title-2 {
  margin-top: 13px;
}

.p-example__contents-item-text-2 {
  margin-top: 8px;
}

.p-example__contents-item-time {
  font-family: "Akshar", sans-serif;
  font-size: 1.3125rem;
  line-height: 1;
  letter-spacing: 0.05em;
}

.p-example__contents-item-time-unit {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
}

/*----------------------------------
    voice
-----------------------------------*/
.p-voice {
  background-color: #92c6e7;
  background-image: url(../img/voice-bg-sp.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  position: relative;
  padding-block: 36px 40px;
}
@media screen and (min-width: 768px) {
  .p-voice {
    background-image: url(../img/servise-mask-pc.webp);
    background-size: cover;
    padding-block: 106px 100px;
  }
}

.p-voice__title {
  text-align: center;
}
.p-voice__title h2 {
  font-size: 1.5rem;
  line-height: 1.58;
  color: #1d5b87;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-voice__title h2 {
    font-size: clamp(2.25rem, 2.25rem + 0vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-voice__contents {
  padding-top: 30px;
}
@media screen and (min-width: 768px) {
  .p-voice__contents {
    padding-top: 55px;
  }
}

.p-voice__boxes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 35.2px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
  .p-voice__boxes {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    row-gap: 38px;
    -webkit-column-gap: 40px;
       -moz-column-gap: 40px;
            column-gap: 40px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 calc(50% - 40px);
            flex: 1 1 calc(50% - 40px);
  }
}

.p-voice__box {
  border-radius: 5px;
  background-color: #fff;
  position: relative;
  padding-bottom: 47px;
}
@media screen and (min-width: 768px) {
  .p-voice__box {
    width: calc(50% - 20px);
    padding-bottom: 49px;
  }
}

.p-voice__box-head {
  background-color: #1d5b87;
  border-radius: 5px 5px 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 19px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-inline: 12px 20px;
  min-height: 67px;
}
@media screen and (min-width: 768px) {
  .p-voice__box-head {
    gap: clamp(10px, 10px + (7) * (100vw - 950px) / (1366 - 950), 17px);
    padding-inline: 22px 19px;
    min-height: 78px;
  }
}

.p-voice__box-img-wrap {
  position: relative;
  width: 80px;
}
@media screen and (min-width: 768px) {
  .p-voice__box-img-wrap {
    width: clamp(80px, 80px + (12) * (100vw - 768px) / (1366 - 768), 92px);
  }
}

.p-voice__box-img {
  position: absolute;
  border-radius: 50%;
  top: -7px;
  left: 0;
  width: 80px;
  -webkit-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .p-voice__box-img {
    top: -10px;
    width: clamp(80px, 80px + (12) * (100vw - 768px) / (1366 - 768), 92px);
  }
}

.p-voice__box-title {
  margin-top: 4px;
}
@media screen and (min-width: 950px) {
  .p-voice__box-title {
    margin-top: 0px;
  }
}
.p-voice__box-title h3 {
  min-width: 53px;
  min-height: 17px;
  font-size: 0.75rem;
  line-height: 1.5;
  font-weight: 600;
  background-color: #1c415e;
  color: #fff;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-inline: 10px;
}
@media screen and (min-width: 768px) {
  .p-voice__box-title h3 {
    font-size: clamp(0.75rem, 0.5894648829rem + 0.3344481605vw, 0.875rem);
    padding-inline: 15px 13px;
  }
}
.p-voice__box-title p {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.56;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-voice__box-title p {
    font-size: clamp(0.875rem, 0.3933946488rem + 1.0033444816vw, 1.25rem);
    line-height: 1.6;
  }
}

.p-voice__box-body {
  padding-block: 19px 0;
  padding-inline: 20px;
}
@media screen and (min-width: 768px) {
  .p-voice__box-body {
    padding-block: 23px 0px;
    padding-inline: 30px;
  }
}

.p-voice__box-body-text-wrap {
  -webkit-transition: max-height 0.5s ease-in-out;
  transition: max-height 0.5s ease-in-out;
  overflow: hidden;
}
.p-voice__box-body-text {
  cursor: pointer;
  overflow: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

/*----------------------------------
  button
-----------------------------------*/
.p-voice__box-buttons {
  padding: 0px 4px 0px;
  position: absolute;
  bottom: 16px;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .p-voice__box-buttons {
    bottom: 17px;
    padding: 0px 12px 0px;
  }
}

.p-voice__box-readmore {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  padding: 0px 10px;
  font-size: 0.75rem;
  line-height: 1;
  height: 18px;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s ease;
  visibility: hidden;
  opacity: 0;
}

.p-voice__box-button-text {
  display: inline-block;
  vertical-align: middle;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.p-voice__box-button-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 5px;
  background-image: url(../img/read-2.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}

.p-voice__box-readmore[aria-expanded=true] .p-voice__box-button-icon {
  -webkit-transform: rotate(180deg) translateY(0%);
          transform: rotate(180deg) translateY(0%);
}

.p-voice__box-readmore[aria-expanded=true] .p-voice__box-button-text {
  opacity: 0;
}

/*----------------------------------
    explanation
-----------------------------------*/
.p-explanation {
  padding-bottom: 37px;
  background-color: #2271a7;
}
@media screen and (min-width: 768px) {
  .p-explanation {
    padding-bottom: 89px;
    background-image: url(../img/explanation-bg.webp);
    background-repeat: no-repeat;
    background-size: 443px;
    background-position: right top;
  }
}

.p-explanation__inner {
  max-width: 486px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-explanation__inner {
    padding-inline: 48px clamp(40px, 40px + (163) * (100vw - 768px) / (1366 - 768), 203px);
    max-width: 1366px;
  }
}

.p-explanation__contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 28px;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: clamp(28px, 28px + (16) * (100vw - 768px) / (1366 - 768), 44px);
  }
}

.p-explanation__contents-title-wrap {
  padding-top: 37px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-inline: 15px;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-title-wrap {
    padding-inline: 0;
    padding-top: clamp(57px, 57px + (40) * (100vw - 768px) / (1366 - 768), 97px);
  }
}

.p-explanation__contents-title h2 {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.58;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-title h2 {
    font-size: clamp(1.625rem, 0.8223244147rem + 1.6722408027vw, 2.25rem);
  }
}

.p-explanation__contents-text {
  padding-top: 24px;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-text {
    padding-top: 36px;
  }
}
.p-explanation__contents-text p {
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.5;
  color: #fff;
  text-shadow: 2px 2px 1px #132a3e, -2px 2px 1px #132a3e, 2px -2px 1px #132a3e, -2px -2px 1px #132a3e, 2px 0px 1px #132a3e, 0px 2px 1px #132a3e, -2px 0px 1px #132a3e, 0px -2px 1px #132a3e; /* 文字の影 */
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-text p {
    font-size: clamp(0.875rem, 0.0723244147rem + 1.6722408027vw, 1.5rem);
  }
}
.p-explanation__contents-text p .u-dotted-text::before,
.p-explanation__contents-text p .u-dotted-text-explanation::before {
  text-shadow: none;
}
.p-explanation__contents-text p .u-text-under-yellow--explanation {
  position: relative;
  text-decoration: none;
  z-index: 1;
}
.p-explanation__contents-text p .u-text-under-yellow--explanation::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 5px;
  background-color: #fc0;
  z-index: -1;
}

.p-explanation__contents-explanation {
  padding-top: 31px;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-explanation {
    padding-top: 35px;
  }
}
.p-explanation__contents-explanation p {
  color: #fff;
}
@media screen and (min-width: 768px) {
  .p-explanation__contents-explanation p {
    font-size: clamp(0.875rem, 0.7144648829rem + 0.3344481605vw, 1rem);
  }
}

.p-explanation__img-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (min-width: 768px) {
  .p-explanation__img-wrap {
    padding-top: 0;
    width: 42%;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
}

.p-explanation__img-1 {
  width: 331px;
  -ms-flex-item-align: start;
      align-self: flex-start;
}
@media screen and (min-width: 768px) {
  .p-explanation__img-1 {
    width: clamp(260px, 260px + (158) * (100vw - 768px) / (1366 - 768), 418px);
  }
}

.p-explanation__img-2 {
  padding-top: 20px;
  width: 242px;
  -ms-flex-item-align: end;
      align-self: flex-end;
}
@media screen and (min-width: 768px) {
  .p-explanation__img-2 {
    padding-top: 40px;
    width: clamp(240px, 240px + (66) * (100vw - 768px) / (1366 - 768), 306px);
  }
}

.p-explanation__swiper-wrap {
  padding-top: 21px;
}

/*----------------------------------
difference swiper
-----------------------------------*/
.p-explanation__swiper-wrap {
  padding-top: 3px;
  cursor: -webkit-grab;
  cursor: grab;
}
.p-explanation__swiper-wrap:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
@media screen and (min-width: 768px) {
  .p-explanation__swiper-wrap {
    padding-top: 21px;
  }
}

.swiper-container {
  position: relative;
}

.p-explanation__swiper {
  position: relative;
}
.p-explanation__swiper .swiper-slide {
  width: 736px !important;
}

.p-difference__swiper-img {
  width: 736px;
}
.p-difference__swiper-img img {
  width: 736px;
}

.swiper {
  position: relative;
}

.swiper-wrapper {
  position: relative;
}

.p-explanation__swiper-text {
  margin-top: -5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  color: #fff;
}
.p-explanation__swiper-text p {
  font-size: 0.875rem;
  line-height: 1.5;
}

.p-explanation__swiper-text-arrow {
  width: 17px;
  margin-top: -8px;
}

/*----------------------------------
    member
-----------------------------------*/
.p-member {
  padding-block: 40px;
  background-color: #f2f8fd;
}
@media screen and (min-width: 768px) {
  .p-member {
    padding-block: 100px 75px;
  }
}

.p-member__title {
  margin-inline: auto;
  text-align: center;
}
.p-member__title h2 {
  font-size: 1.375rem;
  line-height: 1.5;
  color: #1d5b87;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-member__title h2 {
    font-size: clamp(1.5rem, 0.5367892977rem + 2.0066889632vw, 2.25rem);
    line-height: 1.33;
  }
}

.p-member__boxes {
  padding-top: 86px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 65.4px;
}
@media screen and (min-width: 768px) {
  .p-member__boxes {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-column-gap: 40px;
       -moz-column-gap: 40px;
            column-gap: 40px;
    row-gap: 66px;
  }
}

.p-member__box {
  border-radius: 5px;
  background-color: #fff;
  padding-block: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-inline: 20px;
}
@media screen and (min-width: 768px) {
  .p-member__box {
    padding-inline: clamp(20px, 20px + (20) * (100vw - 768px) / (1366 - 768), 40px);
    padding-block: 20px 40px;
    width: calc(50% - 20px);
  }
}

.p-member__box-img {
  margin-top: -71px;
  width: 165px;
}

.p-member__box-title {
  padding-top: 19px;
}

.p-member__box-title-text {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
  color: #1d5b87;
  text-align: center;
}

.p-member__box-title-name-wrap {
  padding-top: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 5px;
}
@media screen and (min-width: 768px) {
  .p-member__box-title-name-wrap {
    padding-top: 14px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 0px;
  }
}

.p-member__box-title-name {
  font-size: 1.5rem;
  line-height: 1.58;
  font-weight: 600;
  color: #1d5b87;
}
@media screen and (min-width: 768px) {
  .p-member__box-title-name {
    line-height: 1;
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
  }
}

.p-member__box-title-sub {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
  color: #1d5b87;
}
@media screen and (min-width: 768px) {
  .p-member__box-title-sub {
    -ms-flex-item-align: end;
        align-self: flex-end;
    line-height: 1;
    font-size: clamp(0.75rem, 0.5894648829rem + 0.3344481605vw, 0.875rem);
  }
}

.p-member__box-text {
  padding-top: 18px;
}
@media screen and (min-width: 768px) {
  .p-member__box-text {
    padding-top: 22px;
  }
}
.p-member__box-text p + p {
  padding-top: 25px;
}

.p-member__box-industry-wrap {
  margin-top: 16px;
  border-top: 1px solid #1b4d71;
  display: block;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-member__box-industry-wrap {
    margin-top: 18px;
  }
}

.p-member__box-industry-title {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #1b4d71;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-item-align: start;
      align-self: flex-start;
  min-width: 83px;
  min-height: 23px;
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
  color: #fff;
}

.p-member__box-industry-text {
  padding-top: 18px;
}
/*----------------------------------
    cta-2
-----------------------------------*/
.p-cta-2 {
  padding-block: 40px 40px;
  background: url(../img/cta-2-bg-sp.webp) no-repeat center center/cover;
  position: relative;
  z-index: 0;
}
@media screen and (min-width: 768px) {
  .p-cta-2 {
    padding-block: 75px 51px;
    background: url(../img/cta-2-bg-pc.webp) no-repeat center center/cover;
  }
}

.p-cta-2-title {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-cta-2-title {
    text-align: left;
    padding-left: clamp(20px, 20px + (31) * (100vw - 768px) / (1366 - 768), 51px);
  }
}
.p-cta-2-title p {
  font-size: 1.125rem;
  line-height: 1.56;
  color: #fff;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-cta-2-title p {
    font-size: clamp(1.125rem, 0.6433946488rem + 1.0033444816vw, 1.5rem);
  }
}

.p-cta-2__btn {
  margin-top: 99px;
  width: 345px;
  display: block;
  position: relative;
  z-index: 2;
  margin-inline: auto;
  -webkit-animation: 1.5s linear backwards infinite heartbeat;
          animation: 1.5s linear backwards infinite heartbeat;
}
@media screen and (min-width: 768px) {
  .p-cta-2__btn {
    margin-top: 31px;
    margin-inline: -17px 0;
    width: clamp(345px, 345px + (254) * (100vw - 768px) / (1366 - 768), 599px);
  }
}

.p-cta-2__contents {
  margin-top: 71px;
  padding-block: 18px 0px;
  position: relative;
  background-color: #57a8d9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 5px;
}
@media screen and (min-width: 768px) {
  .p-cta-2__contents {
    margin-top: 41px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    padding-inline: 27px 10px;
    padding-block: 8px 0px;
    gap: 0px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.p-cta-2-people {
  position: absolute;
  top: 28px;
  left: 50%;
  translate: -50% -100%;
  width: 345px;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .p-cta-2-people {
    left: auto;
    right: 0;
    top: 48px;
    translate: 0 -100%;
    width: clamp(345px, 345px + (120) * (100vw - 768px) / (1366 - 768), 465px);
  }
}

.p-cta-2__contents-text {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-cta-2__contents-text {
    text-align: left;
  }
}
.p-cta-2__contents-text p {
  font-size: 1.125rem;
  line-height: 1.56;
  font-weight: 600;
  color: #132a3e;
  text-shadow: #fff 2px 0, #fff -2px 0, #fff 0 -2px, #fff 0 2px, #fff 2px 2px, #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px, #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px, #fff -2px -1px;
}
@media screen and (min-width: 768px) {
  .p-cta-2__contents-text p {
    font-size: clamp(1.0625rem, 0.5006270903rem + 1.1705685619vw, 1.5rem);
  }
}

.p-cta-2__contents-img {
  width: 330px;
}
@media screen and (min-width: 768px) {
  .p-cta-2__contents-img {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: 57.3131094258%;
  }
}

/*----------------------------------
    flow
-----------------------------------*/
.p-flow {
  padding-block: 40px;
  background-color: #f2f8fd;
}
@media screen and (min-width: 768px) {
  .p-flow {
    padding-block: 100px 103px;
  }
}

.p-flow__title {
  margin-inline: auto;
  text-align: center;
}
.p-flow__title h2 {
  font-size: 1.375rem;
  line-height: 1.5;
  color: #2271a7;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-flow__title h2 {
    font-size: clamp(1.5rem, 0.5367892977rem + 2.0066889632vw, 2.25rem);
    line-height: 1.33;
    padding-top: 50px;
  }
}

@media screen and (min-width: 768px) {
  .p-flow__contents {
    background-color: #fff;
    padding-bottom: 40px;
  }
}

.p-flow__boxes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 37px;
  padding-top: 39px;
}
@media screen and (min-width: 768px) {
  .p-flow__boxes {
    padding-top: 38px;
    padding-inline: clamp(20px, 20px + (64) * (100vw - 768px) / (1366 - 768), 84px);
    gap: 0px;
  }
}

.p-flow__box {
  background-color: #fff;
  position: relative;
  padding-inline: 15px;
  padding-block: 20px;
}
@media screen and (min-width: 768px) {
  .p-flow__box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    padding-inline: 0px;
    padding-block: 0px;
  }
}
.p-flow__box::after {
  content: "";
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  bottom: -28px;
}
@media screen and (min-width: 768px) {
  .p-flow__box::after {
    display: none;
  }
}

.p-flow__box1::after {
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-top: 15px solid #57a8d9;
}

.p-flow__box2::after {
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-top: 15px solid #3794cd;
}

.p-flow__box3::after {
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-top: 15px solid #2271a7;
}

.p-flow__box-left {
  position: absolute;
  left: 22px;
  top: 15px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-left {
    left: 0;
    top: 0;
    width: 61px;
    height: auto;
    min-height: 100%;
    position: relative;
  }
}
@media screen and (min-width: 768px) {
  .p-flow__box-left::after {
    content: "";
    position: absolute;
    top: 61px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 6px;
    height: calc(98% - 61px);
    background-image: radial-gradient(circle, #57a8d9 30%, transparent 30%);
    background-size: 6px 12px;
    background-repeat: repeat-y;
    background-position: center;
  }
}
@media screen and (min-width: 768px) {
  .p-flow__box-left::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
  }
}

.p-flow__box-left-1::after {
  background-image: radial-gradient(circle, #57a8d9 30%, transparent 30%);
}
.p-flow__box-left-1::before {
  border-top: 19px solid #57a8d9;
}

.p-flow__box-left-2::after {
  background-image: radial-gradient(circle, #3794cd 30%, transparent 30%);
}
.p-flow__box-left-2::before {
  border-top: 19px solid #3794cd;
}

.p-flow__box-left-3::after {
  background-image: radial-gradient(circle, #2271a7 30%, transparent 30%);
}
.p-flow__box-left-3::before {
  border-top: 19px solid #2271a7;
}

.p-flow__box-left-4::after {
  background-image: radial-gradient(circle, #2271a7 30%, transparent 30%);
  display: none;
}
.p-flow__box-left-4::before {
  border-top: 19px solid #2271a7;
  display: none;
}

.p-flow__box-number-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  width: 61px;
  height: 61px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .p-flow__box-number-wrap {
    gap: 4px;
    z-index: 3;
    position: relative;
  }
}

.p-flow__box-number-wrap1 {
  background-color: #57a8d9;
}

.p-flow__box-number-wrap2 {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-number-wrap2 {
    background-color: #3794cd;
  }
}

.p-flow__box-number-wrap3 {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-number-wrap3 {
    background-color: #2271a7;
  }
}

.p-flow__box-number-wrap4 {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-number-wrap4 {
    background-color: #2271a7;
  }
}

.p-flow__box-number-text span {
  font-size: 0.75rem;
  font-weight: 600;
  font-family: "Roboto", sans-serif;
  font-style: italic;
  line-height: 0.7;
}
.p-flow__box-number span {
  font-size: 1.9375rem;
  font-weight: 600;
  font-style: italic;
  font-family: "Roboto", sans-serif;
  line-height: 0.5;
}
@media screen and (min-width: 768px) {
  .p-flow__box-number span {
    z-index: 5;
  }
}

.p-flow__box-contents-btn {
  display: grid;
  grid-template-columns: auto;
  grid-template-areas: "title" "text" "btn" "img";
}
@media screen and (min-width: 768px) {
  .p-flow__box-contents-btn {
    padding-bottom: 26px;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto auto;
    grid-template-areas: "title img" "text img" "btn img";
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
  }
}

.p-flow__box-contents {
  display: grid;
  grid-template-columns: auto;
  grid-template-areas: "title" "text" "img";
}
@media screen and (min-width: 768px) {
  .p-flow__box-contents {
    padding-bottom: 28px;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas: "title img" "text img";
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
  }
}

.p-flow__box-title {
  grid-area: title;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-left: 77px;
  gap: 10px;
  min-height: 52px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding-left: 10px;
    position: relative;
    padding-top: clamp(8px, 8px + (0) * (100vw - 768px) / (1366 - 768), 8px);
    padding-bottom: clamp(8px, 8px + (0) * (100vw - 768px) / (1366 - 768), 8px);
    min-height: 0px;
  }
  .p-flow__box-title::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -34px;
    width: calc(100% + 25px + 34px);
    height: 5px;
    z-index: 0;
  }
}
.p-flow__box-title-1::before {
  background-color: #57a8d9;
}
.p-flow__box-title-2::before {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title-2::before {
    background-color: #3794cd;
  }
}
.p-flow__box-title-3 {
  padding-left: 70px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title-3 {
    padding-left: 20px;
  }
}
.p-flow__box-title-3::before {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title-3::before {
    background-color: #2271a7;
  }
}
.p-flow__box-title-4 {
  padding-left: 70px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title-4 {
    padding-left: 20px;
  }
}
.p-flow__box-title-4::before {
  background-color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title-4::before {
    background-color: #1d5b87;
  }
}
.p-flow__box-title h3 {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.45;
}
@media screen and (min-width: 768px) {
  .p-flow__box-title h3 {
    font-size: clamp(0.875rem, 0.5539297659rem + 0.6688963211vw, 1.125rem);
    line-height: 1;
  }
}

.p-flow__box-title-sub {
  border-radius: 5px;
  border: solid 2px #f56100;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.5;
  color: #f56100;
  min-width: 39px;
  height: 22px;
  white-space: nowrap;
}

.p-flow__box-text {
  grid-area: text;
  padding-top: 12px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-text {
    padding-top: 24px;
    padding-left: 10px;
    padding-right: 15px;
  }
}
.p-flow__box-text p {
  font-size: clamp(1rem, 1rem + 0vw, 1rem);
  line-height: 1.56;
}
@media screen and (min-width: 768px) {
  .p-flow__box-text p {
    font-size: clamp(0.75rem, 0.4289297659rem + 0.6688963211vw, 1rem);
    line-height: 1.56;
  }
}

.p-flow__box-img-wrap {
  grid-area: img;
  margin-top: 5px;
  justify-self: center;
  border-radius: 10px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-flow__box-img-wrap {
    margin-top: 0;
    width: clamp(260px, 260px + (62) * (100vw - 768px) / (1366 - 768), 322px);
    height: clamp(186px, 186px + (42) * (100vw - 768px) / (1366 - 768), 228px);
    border-radius: 20px;
  }
}

@media screen and (min-width: 768px) {
  .p-flow__box-img-wrap-1 {
    border: solid 6px #57a8d9;
  }
}

@media screen and (min-width: 768px) {
  .p-flow__box-img-wrap-2 {
    border: solid 6px #3794cd;
  }
}

@media screen and (min-width: 768px) {
  .p-flow__box-img-wrap-3 {
    border: solid 6px #2271a7;
  }
}

@media screen and (min-width: 768px) {
  .p-flow__box-img-wrap-4 {
    border: solid 6px #1d5b87;
  }
}

.p-flow__box-img {
  width: 250px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-flow__box-img {
    width: 100%;
  }
}

.p-flow__box-btn-wrap {
  grid-area: btn;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 6px;
}
@media screen and (min-width: 768px) {
  .p-flow__box-btn-wrap {
    padding-top: 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

.p-flow__box-btn {
  -webkit-animation: 1.5s linear backwards infinite heartbeat;
          animation: 1.5s linear backwards infinite heartbeat;
}

@media screen and (min-width: 768px) {
  .p-flow__box-btn-img {
    width: clamp(250px, 250px + (49) * (100vw - 768px) / (1366 - 768), 299px);
  }
}

.p-flow__box-button-nom-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-flow__box-button-nom-img {
  width: 20px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-transform: rotate(8deg);
          transform: rotate(8deg);
}
@media screen and (min-width: 768px) {
  .p-flow__box-button-nom-img {
    width: clamp(16px, 16px + (4) * (100vw - 768px) / (1366 - 768), 20px);
  }
}

.p-flow__box-button-nom-text {
  margin-left: -3px;
  font-size: 1.375rem;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-flow__box-button-nom-text {
    font-size: clamp(0.875rem, 0.5539297659rem + 0.6688963211vw, 1.125rem);
    line-height: 1.5;
  }
}

/*----------------------------------
    faq
-----------------------------------*/
.p-faq {
  padding-block: 40px;
  background-color: #f2f8fd;
}
@media screen and (min-width: 768px) {
  .p-faq {
    padding-block: 51px 75px;
  }
}

.p-faq__title {
  margin-inline: auto;
  text-align: center;
}
.p-faq__title h2 {
  font-size: 1.125rem;
  line-height: 1.56;
  color: #2271a7;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .p-faq__title h2 {
    font-size: clamp(1.5rem, 0.5367892977rem + 2.0066889632vw, 2.25rem);
    line-height: 1.33;
    padding-top: 50px;
  }
}

/* ================================
   faq-CSS
=============================== */
.p-faq {
  padding-block: 40px 50px;
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .p-faq {
    padding-block: 50px 89px;
  }
}

.faq__inner {
  width: min(880px, 100%);
  padding-inline: 20px;
  margin-inline: auto;
}

summary {
  display: block;
  border-left: 4px solid #2271a7;
}
summary::-webkit-details-marker {
  display: none;
}

.faq__items {
  padding-top: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 13px;
}
@media screen and (min-width: 768px) {
  .faq__items {
    padding-top: 45px;
    gap: 11px;
  }
}

.faq__item {
  font-weight: 600;
  line-height: 1.56;
}

.faq__question {
  padding-block: 18px 17px;
  padding-inline: 17px 15px;
  position: relative;
  -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .faq__question {
    padding-inline: 21px 21px;
    padding-block: 18px 14px;
  }
}
.faq__question::before, .faq__question::after {
  content: "";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  background: #999;
}
.faq__question::before {
  right: 15px;
  width: 10px;
  height: 1px;
}
@media screen and (min-width: 768px) {
  .faq__question::before {
    right: 27px;
  }
}
.faq__question::after {
  right: 19px;
  width: 1px;
  height: 10px;
  -webkit-transition: rotate 0.2s ease;
  transition: rotate 0.2s ease;
}
@media screen and (min-width: 768px) {
  .faq__question::after {
    right: 31px;
  }
}
@media (any-hover: hover) {
  .faq__question:hover {
    cursor: pointer;
  }
}

details[open] .faq__question::after {
  rotate: 90deg;
}

.faq__question-text {
  list-style: none;
  position: relative;
  padding-inline: 32px 32px;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .faq__question-text {
    padding-inline: 37px 37px;
  }
}
.faq__question-text::before {
  content: "Q";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  left: 0;
  font-size: 1.5rem;
  line-height: 24px;
  color: #57a8d9;
}

.faq__answer {
  padding-block: 10px 20px;
  padding-inline: 21px 15px;
  background-color: #f6f6f6;
  border-radius: 0 0 10px 10px;
  -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}
@media screen and (min-width: 768px) {
  .faq__answer {
    padding-block: 16px 20px;
    padding-inline: 21px 21px;
  }
}

.faq__answer-text {
  list-style: none;
  position: relative;
  padding-inline: 32px 20px;
}
@media screen and (min-width: 768px) {
  .faq__answer-text {
    padding-inline: 37px 37px;
  }
}
.faq__answer-text::before {
  content: "A";
  position: absolute;
  top: 6px;
  left: 0;
  font-size: 24px;
  line-height: 24px;
  color: #57a8d9;
}
@media screen and (min-width: 768px) {
  .faq__answer-text::before {
    top: 1px;
  }
}

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

@media screen and (min-width: 768px) {
  .u-hidden-pc {
    display: none;
  }
}

.u-hidden-sp {
  display: none;
}
@media screen and (min-width: 768px) {
  .u-hidden-sp {
    display: block;
  }
}

.u-fz-14 {
  font-size: 0.875rem;
}

.u-fz-36 {
  font-size: 2.25rem;
}

.u-color-white {
  color: #fff;
}

.u-color-accent {
  color: #004c7a;
}

.u-color-main-600 {
  color: #1d5b87;
}

.u-color-orange {
  color: #f56100;
}

.u-color-yellow {
  color: #fc0;
}

.u-bg-white {
  background-color: #fff;
}

.u-dib {
  display: inline-block;
}

.u-dib {
  display: inline-block;
}

.u-text-under-yellow {
  text-decoration: underline;
  text-decoration-color: #fc0;
  text-decoration-thickness: 5px;
  text-underline-offset: 0.2em;
}

.u-text-under-yellow--service {
  text-decoration: underline;
  text-decoration-color: #fc0;
  text-decoration-thickness: 5px;
  text-underline-offset: 0em;
}
@media screen and (min-width: 768px) {
  .u-text-under-yellow--service {
    text-underline-offset: 0em;
    text-decoration-thickness: 8px;
  }
}

.u-text-under-yellow--explanation {
  text-decoration: underline;
  text-decoration-color: #fc0;
  text-decoration-thickness: 5px;
  text-underline-offset: 0em;
}
@media screen and (min-width: 768px) {
  .u-text-under-yellow--explanation {
    text-underline-offset: 0.2em;
    text-decoration-thickness: 8px;
  }
}

.u-text-under-yellow--reason {
  text-decoration: underline;
  text-decoration-color: #fc0;
  text-decoration-thickness: 5px;
  text-underline-offset: -0.1em;
}

.u-text-under-yellow--realization {
  text-decoration: underline;
  text-decoration-color: #fc0;
  text-decoration-thickness: 5px;
  text-underline-offset: 0em;
}
@media screen and (min-width: 768px) {
  .u-text-under-yellow--realization {
    text-underline-offset: -0.1em;
    text-decoration-thickness: 8px;
  }
}

.u-text-under-50 {
  text-decoration: underline;
  text-decoration-color: #e5f0f9;
  text-decoration-thickness: 5px;
  text-underline-offset: 0.2em;
}

.u-dotted-text {
  position: relative;
}
.u-dotted-text::before {
  content: "・";
  position: absolute;
  top: -1em;
  left: 0;
  right: 0;
  color: #fc0;
  font-size: 1em;
}
@media screen and (min-width: 768px) {
  .u-dotted-text::before {
    top: -0.8em;
  }
}

.u-dotted-text-point {
  position: relative;
}
.u-dotted-text-point::before {
  content: "・";
  position: absolute;
  top: -1em;
  left: 0;
  right: 0;
  color: #fc0;
  font-size: 1em;
}
@media screen and (min-width: 768px) {
  .u-dotted-text-point::before {
    top: -0.6em;
  }
}

.u-dotted-text-explanation {
  position: relative;
}
.u-dotted-text-explanation::before {
  content: "・";
  position: absolute;
  top: -1em;
  left: 0;
  right: 0;
  color: #fc0;
  font-size: 1em;
}
@media screen and (min-width: 768px) {
  .u-dotted-text-explanation::before {
    top: -1em;
  }
}

.u-text-bold {
  font-weight: 600;
}