@charset "UTF-8";

/* ===================== SP (max-width: 768px) =====================
   デザイン基準幅: 394px
   フォントサイズ等は min(vw, px) ではなく 394px基準のvwで指定する
==================================================================== */
@media (max-width: 768px) {

  :root {
    --container: 100%;
    --section-padding: 10vw; /* 48px / 394px */
  }

  section {
    padding-block: var(--section-padding);
  }

  /* ===================== PC / SP SWITCH ===================== */
    .pc {
      display: none;
    }
    .sp {
      display: block;
    }
    .c-eyebrow {
    font-size: 6.8vw;
    font-weight: 700;
    margin-bottom: 3vw;
    line-height: 1;
  }
  .c-title {
    font-size: 9.3vw;
    letter-spacing: 0.02em;
    margin-bottom: 4vw;
    font-weight: 700;
    width: 90%;
    margin-inline: auto;
    line-height: 1.2;
  }
  .c-lead {
    font-size: 4.8vw;
    margin-bottom: 2.9167vw;
    width: 90%;
    margin-inline: auto;
  }
}
/* ===================== HEADER (SP) ===================== */
@media (max-width: 768px) {
  .header__nav {
    display: none;
  }
  .header__inner {
    height: 14vw; /* 56px */
  }
  .header__logo {
    height: 55%;
    margin-left: 5%;
  }
  .header__icons {
    display: flex;
    height: 80%;
    gap: 4vw;
    margin-left: 15vw;
  }
  .header__icon--insta {
    display: none;
  }
  .header__icon--tel {
    order: -1;
  }
  .header__hamburger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.5228vw;
    aspect-ratio: 1.1 / 1;
    height: 100%;
    background: var(--yellow);
    flex-shrink: 0;
  }
  .header__hamburger span {
    display: block;
    width: 40%;
    height: 2px;
    background: var(--black);
  }
  .header__drawer-input {
    display: none;
  }
  .header__drawer-nav {
    position: fixed;
    inset: 0;
    z-index: 99;
    background: #1a1a1a;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8.1218vw; /* 32px */
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }
  #drawer_input:checked ~ .header__drawer-nav {
    opacity: 1;
    pointer-events: auto;
  }
  .header__drawer-nav .nav_item-btn {
    color: var(--white);
    font-size: 4.5685vw; /* 18px */
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .header__drawer-close {
    position: absolute;
    top: 5.5838vw;
    right: 5.5838vw;
    width: 6.0914vw;
    height: 6.0914vw;
  }
  .header__drawer-close::before,
  .header__drawer-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 2px;
    background: var(--white);
  }
  .header__drawer-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .header__drawer-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
}

/* ===================== HERO (SP) ===================== */
@media (max-width: 768px) {
  .hero__inner {
    position: relative;
    flex-direction: column;
    width: var(--container);
    margin-inline: auto;
    padding-block: 4vw 12vw;
    height: auto;
  }
  .hero__content {
    width: 100%;
    padding: 0;
    order: 0;
    align-items: center;
  }
  .hero__title {
    order: 1;
    margin-bottom: 3vw;
    z-index: 2;
    text-align: center;
  }
  .hero__title-mark {
    padding-right: 3vw;
    padding-left: 1.5vw;
    margin-right: -3vw;
    margin-left: -1.5vw;
    background-position: 0 100%;
    background-size: 0% 33%;
    animation-name: hero-title-mark-sp;
  }
  .hero__title-mark--1 img {
    width: 52vw;
    height: auto;
    margin-inline: auto;
  }
  .hero__title-mark--2 img {
    width: 76vw;
    height: auto;
    margin-inline: auto;
  }
  .hero__title-mark--1 {
    animation-delay: 0.3s;
  }
  .hero__title-mark--2 {
    animation-delay: 0.6s;
  }
  @keyframes hero-title-mark-sp {
    to {
      background-size: 100% 33%;
    }
  }
  .hero__image.sp {
    position: relative;
    order: 2;
    width: 100%;
    margin-bottom: 6vw;
    border-radius: 50% / 13vw;
    overflow: unset;
  }
  .hero__image.sp video {
    border-radius: inherit;
  }
  .hero__image video {
    aspect-ratio: 1 / 1.2;
  }
  .hero__badge.sp {
    position: absolute;
    top: -2vw;
    right: 5.5vw;
    z-index: 2;
    writing-mode: vertical-rl;
    font-size: 5.6vw;
    padding: 1vw 0.5vw;
    line-height: 1.4;
    letter-spacing: 0.1vw;
    margin-bottom: 0;
    background: none;
    clip-path: none;
    color: var(--black);
    -webkit-text-stroke: 1vw var(--white);
    paint-order: stroke fill;
    font-weight: 700;
    opacity: 0;
    animation: hero-badge-in 0.5s ease-out 0.6s forwards;
    animation-play-state: paused;
  }
  body.is-loaded .hero__badge.sp {
    animation-play-state: running;
  }
  @keyframes hero-badge-in {
    from {
      opacity: 0;
      transform: translateY(6vw);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .hero__badge.sp .upright {
    text-combine-upright: all;
    display: inline-block;
    transform: translateX(-0.4vw);
  }
  .hero__text.sp {
    position: absolute;
    left: 0;
    top: 70%;
    z-index: 2;
    order: unset;
    font-size: 4vw;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2.5vw;
  }
  .hero__text.sp span {
    display: inline-block;
    background: rgba(0, 0, 0, 0.8);
    color: var(--white);
    padding: 1vw 2vw 1vw 7vw;
    line-height: 1;
    opacity: 0;
    transform: translateX(-8vw);
    animation: hero-text-in 0.5s ease-out forwards;
    animation-play-state: paused;
  }
  body.is-loaded .hero__text.sp span {
    animation-play-state: running;
  }
  .hero__text.sp span:nth-child(1) {
    animation-delay: 0.9s;
  }
  .hero__text.sp span:nth-child(2) {
    animation-delay: 1.1s;
  }
  .hero__text.sp span:nth-child(3) {
    animation-delay: 1.3s;
  }
  @keyframes hero-text-in {
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  .hero__buttons {
    order: 4;
    flex-direction: row;
    gap: 3vw;
    margin-bottom: 6.0914vw;
  }
  .hero__btn {
    justify-content: center;
    border-radius: 1.5228vw;
    font-size: 4.3vw; /* 12px */
    padding: 3.0457vw 4vw;
    gap: 2vw;
  }
  .hero__btn-icon {
    width: 5.5vw;
  }
  .hero__stats {
    order: 5;
    margin-bottom: 6.0914vw;
    width: stretch;
    justify-content: center;
  }
  .hero__stats-num {
    font-size: 13.5vw; /* 32px */
    white-space: nowrap;
  }
  .hero__stats-num small {
    font-size: 7.8vw; /* 18px */
  }
  .hero__stats-label {
    font-size: 3.4vw; /* 10px */
  }
  .hero__notes {
    order: 6;
    font-size: 4vw; /* 11px */
    line-height: 1.6;
    width: 80%;
  }
}

/* ===================== PROBLEM (SP) ===================== */
@media (max-width: 768px) {
  .problem__inner {
    width: var(--container);
  }
  .problem__grid {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
    justify-content: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    margin-top: 8.1218vw;
    gap: 5vw;
    scrollbar-width: none;
    padding-left: 5%;
    padding-right: 5%;
  }
  .problem__grid::-webkit-scrollbar {
    display: none;
  }
  .problem__card {
    width: 90vw; /* 354px */
    scroll-snap-align: center;
    border-radius: 3.0457vw;
    padding: 5%;
    aspect-ratio: 1 / 1;
  }
  .problem__icon {
    width: 55%;
    height: 55%;
    margin-bottom: 5%;
    margin-top: auto;
  }
  .problem__heading {
    font-size: 6.1vw; /* 18px */
    margin-bottom: 0;
    margin-top: 0;
  }
  .problem__text {
    font-size: 4.4vw;
    margin-top: 5%;
  }
  .problem__progress {
    width: 90%;
    height: 5vw;
    background: var(--white);
    border: 2px solid var(--jade);
    border-radius: 5vw;
    margin-top: 6.0914vw;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    padding: 0.5vw;
  }
  .problem__progress-bar {
    display: block;
    height: 100%;
    background: var(--jade);
    border-radius: 2vw;
    transition: width 0.1s linear, margin-left 0.1s linear;
  }
}

/* ===================== WHY (SP) ===================== */
@media (max-width: 768px) {
  .why .c-title strong {
    font-size: 9.1371vw; /* 36px */
    display: block;
  }
  .why__inner {
    width: var(--container);
    margin-inline: auto;
  }
  .why__list {
    margin-top: 8.1218vw;
    gap: 6.0914vw;
  }
  .why__item {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .why__item--teal {
    display: flex;
    flex-direction: column-reverse;
  }
  .why__media img {
    aspect-ratio: 339 / 220;
  }
  .why__body {
    padding-block: 8.1218vw;
  }
  .why__bg-num {
    font-size: 22.8426vw; /* 90px */
  }
  .why__content {
    width: 90%;
  }
  .why__heading {
    font-size: 6.0914vw; /* 24px */
    margin-bottom: 4.0609vw;
  }
  .why__text {
    font-size: 3.5533vw; /* 14px */
    line-height: 1.7;
    margin-bottom: 6.0914vw;
  }
  .why__note {
    font-size: 3.5533vw; /* 14px */
    padding: 4.0609vw 3.0457vw;
  }
}

/* ===================== PRICE (SP) ===================== */
@media (max-width: 768px) {
  .price {
    padding-top: 0;
  }
  .price__inner {
    width: var(--container);
  }
  .price__tabs {
    width: 90%;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 8.1218vw;
    padding: 1.0152vw;
    border-radius: 6.0914vw;
  }
  .price__tab-indicator {
    top: 1.0152vw;
    left: 1.0152vw;
    width: calc((100% - 2.0305vw) / 3);
    height: calc(100% - 2.0305vw);
    border-radius: 5vw;
  }
  .price__tab {
    gap: 1vw;
    padding: 2.0305vw 1vw;
    font-size: 3.55vw; /* 11px */
  }
  .price__tab-icon {
    width: 4.5685vw;
    height: 4.5685vw;
  }
  .price__grid {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 4.0609vw;
    scrollbar-width: none;
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 5vw;
    margin-top: -5vw;
  }
  .price__grid::-webkit-scrollbar {
    display: none;
  }
  .price__card {
    width: 100%;
    flex-shrink: 0;
    scroll-snap-align: center;
    border-radius: 3.0457vw;
    padding: 8.1218vw 5.0761vw 4.0609vw;
    border-width: 2px;
  }
  .price__card--popular {
    border-width: 4px;
  }
  .price__badge {
    font-size: 5.3vw; /* 14px */
    padding: 1.5228vw 4.5685vw;
    border-radius: 1.5228vw;
  }
  .price__plan {
    font-size: 6.85vw; /* 14px */
    margin-bottom: 3.0457vw;
  }
  .price__amount {
    font-size: 11vw; /* 30px */
    margin-bottom: 4.0609vw;
  }
  .price__amount span {
    font-size: 5.6vw; /* 14px */
  }
  .price__desc {
    font-size: 4.8vw; /* 12px */
    margin-bottom: 6.0914vw;
  }
  .price__features li {
    font-size: 4.8vw; /* 12px */
    gap: 2.0305vw;
  }
  .price__features li::before {
    width: 4.8vw;
    height: 4.8vw;
  }
  .price__attention {
    font-size: 4.15vw; /* 12px */
    padding-top: 4.0609vw;
  }
  .price__more {
    margin-top: 8.1218vw;
  }
  .price__more .c-btn--teal {
    padding: 3.0457vw 6.0914vw;
    font-size: 3.5533vw; /* 14px */
  }
  .price__progress {
    width: 90%;
    height: 5vw;
    background: var(--white);
    border: 2px solid var(--jade);
    border-radius: 5vw;
    margin-top: 6.0914vw;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    padding: 0.5vw;
  }
  .price__progress-bar {
    display: block;
    height: 100%;
    background: var(--jade);
    border-radius: 2vw;
    transition: width 0.1s linear, margin-left 0.1s linear;
  }
}

/* ===================== SERVICE (SP) ===================== */
@media (max-width: 768px) {
  .service__inner {
    width: var(--container);
  }
  .service__grid.pc {
    display: none;
  }
  .service__grid.sp {
    margin-top: 8.1218vw;
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-left: 5%;
    padding-right: 5%;
    gap: 10%
  }
  .service__grid.sp::-webkit-scrollbar {
    display: none;
  }
  .service__page {
    flex: 0 0 100%;
    width: 100%;
    scroll-snap-align: center;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
    gap: 4.0609vw;
  }
  .service__card {
    border-radius: 2.0305vw;
    border-width: 2px;
    padding: 0 5%;
  }
  .service__card img {
    width: 20vw;
    height: 20vw;
    margin-bottom: 0;
  }
  .service__name {
    font-size: 4.3vw; /* 14px */
  }
  .service__sub {
    font-size: 3.5vw; /* 10px */
    min-height: calc(2.5381vw * 1.3 * 2);
    white-space: nowrap;
  }
  .service__nav.sp {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3.5vw;
    margin-top: 6.0914vw;
  }
  .service__arrow {
    width: 6vw;
    height: 6vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .service__arrow img {
    width: 100%;
    height: 100%;
  }
  .service__arrow--left img {
    transform: scaleX(-1);
  }
  .service__dot {
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--jade);
  }
  .service__dot.is-active {
    background: var(--jade);
  }
}

/* ===================== INSTAGRAM (SP) ===================== */
@media (max-width: 768px) {
  .instagram {
    background: var(--white);
    padding: 0;
    overflow: visible;
  }
  .instagram__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: auto;
  }
  .instagram__image {
    position: static;
    height: auto;
    width: 60%;
    margin-bottom: -15%;
  }
  .instagram__body {
    width: 100%;
    background: var(--yellow);
    padding: 10vw 0;
  }
  .instagram__heading {
    font-size: 7.5vw; /* 18px */
    margin-bottom: 3.0457vw;
    flex-direction: column;
    align-items: center;
    line-height: 1.5;
  }
  .instagram__heading-line {
    display: flex;
    align-items: center;
    gap: 5vw;
  }
  .instagram__heading-icon {
    width: 10vw;
    height: 10vw;
  }
  .instagram__text {
    font-size: 5.8vw; /* 12px */
    margin-bottom: 4.0609vw;
    text-align: left;
    width: 90%;
    margin-inline: auto;
  }
  .instagram__btn {
    font-size: 5.9vw; /* 14px */
    padding: 2.0305vw 6.0914vw;
    border-radius: 6.0914vw;
  }
    /* Instagram feed grid */
  .instagram__feed {
    margin-top: 10%;
    width: 98%;
    margin-bottom: 10%;
    margin-inline: auto;
  }
  #instagram-feed {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1vw;
  }
}

/* ===================== HOW (SP) ===================== */
@media (max-width: 768px) {
  .how__inner {
    width: var(--container);
  }
  .how__inner > .c-lead {
    width: 90%;
    margin-inline: auto;
    text-align: left;
  }
  .how__timeline {
    margin-top: 8.1218vw;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 10%;
    border: none;
    padding-top: 7.6142vw;
    margin-top: calc(8.1218vw - 7.6142vw);
    padding-inline: 0;
    scrollbar-width: none;
    padding-left: 5%;
    padding-right: 5%;
  }
  .how__timeline::-webkit-scrollbar {
    display: none;
  }
  .how__step {
    grid-template-columns: 1fr;
    text-align: center;
    width: 100%;
    flex-shrink: 0;
    scroll-snap-align: center;
    border: 4px solid var(--yellow);
    border-radius: 1vw;
    padding: 10.1523vw 6.0914vw 6.0914vw;
    gap: 4.0609vw;
  }
  .how__step:not(:last-child)::after {
    display: none;
  }
  .how__num {
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    width: 17vw;
    height: 17vw;
    font-size: 7.15vw; /* 16px */
  }
  .how__num small {
    font-size: 4.1vw; /* 10px */
  }
  .how__icon {
    width: 30%;
    height: auto;
    margin-inline: auto;
  }
  .how__body {
    align-items: center;
    text-align: center;
  }
  .how__heading {
    font-size: 6.8vw; /* 18px */
    margin-bottom: 3.0457vw;
    line-height: 1.4;
  }
  .how__text {
    font-size: 5.3vw; /* 12px */
    margin-bottom: 3.0457vw;
    text-align: left;
  }
  .how__tag {
    margin-inline: auto;
    font-size: 4.25vw; /* 10px */
    line-height: 1;
    padding: 1vw 3vw;
    border-radius: 5vw;
    margin-left: 0;
  }
  .how__progress {
    width: 90%;
    height: 5vw;
    background: var(--gray-bg);
    border: 2px solid var(--gray-text);
    border-radius: 5vw;
    margin-top: 6.0914vw;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    padding: 0.5vw;
  }
  .how__progress-bar {
    display: block;
    height: 100%;
    background: var(--gray-text);
    border-radius: 2vw;
    transition: width 0.1s linear, margin-left 0.1s linear;
  }
}

/* ===================== STRENGTHS (SP) ===================== */
@media (max-width: 768px) {
.strengths .c-title strong {
  font-size: 12.6vw; /* 36px */
  display: block;
}
.strengths__list {
  margin-top: 9vw;
  gap: 8.1218vw;
}
.strengths__item,
.strengths__item--reverse {
  grid-template-columns: 1fr;
  gap: 3.5vw;
}
.strengths__item .strengths__media {
  order: -1;
}
.strengths__body {
  width: 97%;
  margin-inline: auto;
}
.strengths__title {
  gap: 3.0457vw;
  margin-bottom: 3.0457vw;
}
.strengths__num {
  width: 20%;
}
.strengths__heading {
  font-size: 6.85vw; /* 18px */
  margin-top: 1vw;
}
.strengths__text {
  font-size: 5.337vw; /* 12px */
  width: 92%;
  margin-inline: auto;
}
}

/* ===================== AREA (SP) ===================== */
@media (max-width: 768px) {
.area {
  position: relative;
  z-index: 1;
  margin-bottom: -12.1827vw;
  border-radius: 0 0 10vw 10vw;
  overflow: hidden;
}
.area__bg {
  z-index: 0;
  border-radius: inherit;
  overflow: hidden;
}
.area__inner {
  position: relative;
  z-index: 1;
  width: var(--container);
}
.area__inner > .c-lead {
  width: 90%;
  margin-inline: auto;
  text-align: left;
  font-size: 5.33vw;
}
.area__grid.pc {
  display: none;
}
.area__grid.sp {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  margin-top: 8.1218vw;
  gap: 4.0609vw;
  scrollbar-width: none;
  padding-left: 5%;
  padding-right: 5%;
}
.area__grid.sp::-webkit-scrollbar {
  display: none;
}
.area__page {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  scroll-snap-align: center;
  width: 100%;
  gap: 4.0609vw;
}
.area__card {
  width: 100%;
  padding: 7vw 4vw;
  height: 60vw;
}
.area__heading {
  font-size: 7.87vw;
  margin-bottom: 3.0457vw;
}
.area__text {
  font-size: 4.82vw;
  padding-inline: 0;
}
.area__tag {
  font-size: 3.47vw; /* 12px */
  padding: 2.0305vw 4.0609vw;
  border-radius: 1vw;
  white-space: normal;
  text-align: center;
}
.area__progress {
  width: 90%;
  height: 5vw;
  background: var(--gray-bg);
  border: 2px solid var(--gray-text);
  border-radius: 5vw;
  margin-top: 6.0914vw;
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
  padding: 0.5vw;
}
.area__progress-bar {
  display: block;
  height: 100%;
  background: var(--gray-text);
  border-radius: 2vw;
  transition: width 0.1s linear, margin-left 0.1s linear;
}
}

/* ===================== VOICE (SP) ===================== */
@media (max-width: 768px) {
.voice {
  padding-top: 22vw;
  padding-bottom: 22vw;
}
.voice__icon {
  width: 17%;
}
.voice__grid {
  grid-template-columns: 1fr;
  gap: 6.0914vw;
  margin-top: 8.1218vw;
  width: var(--container);
  margin-inline: auto;
}
.voice__card {
  border-radius: 0.5vw;
  padding: 8.1218vw 6.0914vw;
  width: 90%;
  margin-inline: auto;
}
.voice__tag {
  font-size: 3.55vw; /* 12px */
  padding: 1vw 3vw;
  margin-bottom: 3vw;
}
.voice__stars {
  font-size: 7vw; /* 18px */
  line-height: 1;
  margin-bottom: 4vw;
}
.voice__text {
  font-size: 5vw; /* 14px */
  margin-bottom: 6.0914vw;
}
.voice__author {
  gap: 3vw;
}
.voice__author img {
  width: 10.1523vw;
  height: 10.1523vw;
}
.voice__author-name {
  font-size: 4.3vw; /* 12px */
}
.voice__author-sub {
  font-size: 3.8vw; /* 10px */
}
}

/* ===================== LINE BANNER (SP) ===================== */
@media (max-width: 768px) {
.line {
  position: relative;
  z-index: 1;
  background: var(--white);
  margin-top: -12.1827vw;
  border-radius: 10vw 10vw 0 0;
  overflow: hidden;
}
.line__inner {
  width: var(--container);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.line__icon.sp {
  width: 35%;
  margin-bottom: -1px;
  position: relative;
  z-index: 1;
  margin-left: auto;
  margin-right: auto;
}
.line__icon.pc {
  display: none;
}
.line__banner {
  width: 90%;
  flex-direction: column;
  align-items: flex-start;
  gap: 4.0609vw;
  padding: 8vw 5.5vw;
  border-radius: 3.0457vw;
}
.line__heading {
  font-size: 7.6vw; /* 22px */
  white-space: normal;
}
.line__text {
  font-size: 4.56vw; /* 12px */
}
.line__btn {
  font-size: 5.5vw; /* 14px */
  padding: 3vw 6vw;
  align-self: center;
  border-radius: 9vw;
}
}

/* ===================== QUESTION / FAQ (SP) ===================== */
@media (max-width: 768px) {
.question__inner {
  width: var(--container);
}
.question__list {
  margin-top: 8.1218vw;
}
.question__q {
  gap: 4.0609vw;
  padding: 5vw 5vw;
  font-size: 5vw;
}
.question__icon {
  width: 3.0457vw;
  height: 3.0457vw;
}
.question__a {
  padding: 0 4.0609vw 0 11.1675vw;
  font-size: 4.56vw;
}
.question__item.is-open .question__a {
  padding: 4.0609vw 4.0609vw 4.0609vw 11.1675vw;
}
}

/* ===================== SPECIALIST (SP) ===================== */
@media (max-width: 768px) {
.specialist {
  background: var(--white);
}
.specialist__inner {
  width: var(--container);
}
.specialist__inner > .c-title {
  font-size: 7.86vw; /* 32px */
  margin-bottom: 3vw;
  width: 90%;
}
.specialist__inner > .c-lead {
  text-align: left;
  width: 90%;
  margin-inline: auto;
  font-size: 4vw;
}
.specialist__tabs {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 8.1218vw;
  background: var(--gray-bg);
  padding: 3vw 0;
  margin-inline: auto;
}
.specialist__tabs-grid {
  display: grid;
  grid-template-columns: repeat(2, auto);
  column-gap: 1vw;
  row-gap: 2vw;
}
.specialist__tab {
  gap: 1.5228vw;
  padding: 2vw 2.75vw;
  border-radius: 6.0914vw;
  font-size: 3.3vw;
  line-height: 1;
}
.specialist__tab-icon {
  width: 3.5533vw;
  height: 3.5533vw;
}
.specialist__grid.pc {
  display: none;
}
.specialist__grid.sp {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3vw;
  background: var(--gray-bg);
}
.specialist__card {
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  width: 100%;
  margin-inline: auto;
}
.specialist__grid.sp .specialist__category {
  position: absolute;
  display: inline-block;
  background: var(--jade);
  color: var(--white);
  font-size: 2.8vw;
  padding: 0.5vw 3vw;
  width: fit-content;
  top: 0;
  right: 0;
  left: unset;
}
.specialist__top {
  display: flex;
  align-items: flex-start;
  gap: 1vw;
  padding: 4vw 4.5vw 0;
}
.specialist__top .specialist__photo {
  width: 40%;
  flex-shrink: 0;
  align-self: center;
}
.specialist__summary {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.specialist__catch-text {
  font-size: 4.5vw;
  font-weight: 400;
  color: var(--jade);
  line-height: 1.4;
  margin-top: 5vw;
  margin-bottom: 2vw;
  text-align: center;
}
.specialist__body {
  padding: 0 6.0914vw 0;
}
.specialist__card.is-open .specialist__body {
  padding: 4.0609vw 6.0914vw 8.1218vw
}
.specialist__name {
  font-size: 5vw;
  font-weight: 600;
}
.specialist__role {
  font-size: 3vw;
  white-space: normal;
  font-weight: 500;
  line-height: 1.3;
  margin-bottom: 3vw;
}
.specialist__years {
  font-size: 2.8vw;
  font-weight: 400;
}
.specialist__badge {
  font-size: 3vw;
  padding: 1vw 5.0761vw;
  border-radius: 4vw;
}
.specialist__top .specialist__name,
.specialist__top .specialist__role,
.specialist__top .specialist__years,
.specialist__top .specialist__badge {
  text-align: left;
}
.specialist__interview {
  font-size: 5vw; /* 24px */
  margin-bottom: 4vw;
}
.specialist__text {
  font-size: 3.5vw; /* 12px */
  font-weight: 500;
}
.specialist__q {
  font-size: 4.3vw; /* 14px */
  padding-top: 4vw;
  margin-bottom: 4vw;
  font-weight: 700;
}
.specialist__tags {
  gap: 2vw;
}
.specialist__tags li {
  font-size: 3.5vw; /* 10px */
  padding: 1vw 3vw;
  border-radius: 4vw;
}
}

/* ===================== SNS (SP) ===================== */
@media (max-width: 768px) {
.sns {
  border-radius: 0 0 4.0609vw 4.0609vw;
}
.sns__inner {
  grid-template-columns: 1fr;
  gap: 6.0914vw;
  width: var(--container);
}
.sns__banner {
  padding: 6.0914vw 6.0914vw;
  border-radius: 3.0457vw;
  border-width: 4px;
  width: 90%;
  margin-inline: auto;
}
.sns__top {
  width: unset;
}
.sns__icon {
  width: 16%;
}
.sns__heading {
  font-size: 5vw;
  white-space: nowrap;
}
.sns__text {
  font-size: 2.5vw;
}
.sns__btn {
  font-size: 3.55vw;
  padding: 2vw 7vw;
  border-radius: 10vw;
}
}

/* ===================== CONTACT (SP) ===================== */
@media (max-width: 768px) {
.contact__inner {
  display: flex;
  flex-direction: column;
}
.contact__inner > .c-eyebrow {
  order: 0;
}
.contact__title {
  order: 1;
  font-size: 12.35vw;
  margin-bottom: 3vw;
}
.contact__text {
  order: 3;
  font-size: 4.82vw;
  margin-bottom: 6.0914vw;
  margin-inline: auto;
  width: 80%;
  text-align: left;
}
.contact__image {
  order: 2;
  position: static;
  width: 30%;
  margin: 0 auto 6.0914vw;
}
.contact__btn {
  order: 4;
  width: var(--container);
  justify-content: center;
  gap: 3vw;
  font-size: 6.4vw;
  padding: 4vw 5vw;
  border-radius: 2vw;
  margin-bottom: 6.0914vw;
  width: 90%;
  margin-inline: auto;
}
.contact__btn-icon {
  width: 6vw;
  height: 6vw;
}
.contact__tel-row {
  order: 5;
  flex-direction: column;
  gap: 0;
}
.contact__tel-label {
  font-size: 7.35vw;
}
.contact__tel {
  font-size: 10.4vw;
}
}

/* ===================== FOOTER (SP) ===================== */
@media (max-width: 768px) {
.footer {
  padding-block: 8vw 4vw;
  border-radius: 10vw 10vw 0 0;
}
.footer__inner {
  width: var(--container);
  margin-inline: auto;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0;
}
.footer__logo {
  width: 17.7665vw;
  margin-bottom: 3vw;
}
.footer__text {
  display: none;
}
.footer__nav {
  display: none;
}
.footer__copyright {
  font-size: 5.3vw;
  margin-top: 0;
}

.page-top {
  bottom: 7vw;
  right: 4vw;
  width: 17.5vw;
}

}