@charset "utf-8";

/* about */
.about {
  padding-top: clamp(5.750rem, 3.958rem + 3.733vw, 8.438rem);
}
.about__inner {
  padding-inline: clamp(0.625rem, -7.625rem + 17.19vw, 13rem);
}
.about__container {
  display: flex;
  flex-direction: column;
}
.about__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1.250rem, -2.333rem + 7.465vw, 6.625rem);
  margin-top: clamp(1.250rem, -0.417rem + 3.472vw, 3.750rem);
}
.about__left,
.about__right {
  flex: 1;
  width: 50%;
  min-width: 0;
}
.about__img {
  width: 100%;
  aspect-ratio: 646 / 315;
  object-fit: cover;
  border-radius: clamp(0.313rem, -0.313rem + 1.302vw, 1.250rem);
}
.about__title {
  font-size: clamp(1.125rem, 0.625rem + 1.042vw, 1.875rem);
  font-weight: 500;
  line-height: 32px;
  color: #000;
}
.about__text {
  margin-top: clamp(1.250rem, 0.458rem + 1.649vw, 2.438rem);
  font-size: clamp(0.875rem, 0.792rem + 0.174vw, 1.000rem);
  font-weight: 400;
  line-height: clamp(1.500rem, 1.250rem + 0.521vw, 1.875rem);
  color: #000;
  overflow-wrap: anywhere;
}

/* consultation */
.consultation {
  padding-top: clamp(4.563rem, -3.080rem + 11.942vw, 11.250rem);
  padding-bottom: clamp(6.25rem, 5rem + 2.6vw, 8.125rem);
}
.consultation__inner {
  padding-right: clamp(1.250rem, -17.893rem + 29.911vw, 18.000rem);
  padding-left: clamp(1.250rem, -17.893rem + 29.911vw, 18.000rem);
}
.consultation__container {
  display: flex;
  flex-direction: column;
}
.consultation__title {
  font-size: clamp(1.750rem, 0.321rem + 2.232vw, 3.000rem);
  font-weight: 500;
  line-height: clamp(2.500rem, 0.357rem + 3.348vw, 4.375rem);
  color: #0f3666;
  text-align: center;
}
.consultation__content {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: clamp(1.875rem, 1.732rem + 0.223vw, 2.000rem);
  margin-top: clamp(2.938rem, 0.366rem + 4.018vw, 5.188rem);
}
.consultation__box {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  padding-top: clamp(2.063rem, 0.205rem + 2.902vw, 3.688rem);
  padding-right: clamp(0.625rem, -2.089rem + 4.24vw, 3rem);
  padding-bottom: clamp(1.188rem, -0.098rem + 2.009vw, 2.313rem);
  padding-left: clamp(0.625rem, -2.089rem + 4.24vw, 3rem);
  background-color: #fae0c5;
  border-radius: clamp(0.625rem, -0.089rem + 1.116vw, 1.250rem);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
}
.consultation-box__title {
  position: absolute;
  top: clamp(-1.313rem, -0.777rem - 0.446vw, -1.063rem);
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(9.625rem, 6.339rem + 5.134vw, 12.500rem);
  height: clamp(1.875rem, 0.446rem + 2.232vw, 3.125rem);
  background-color: #0f3666;
  border-radius: 25px;
  font-size: clamp(0.875rem, 0.161rem + 1.116vw, 1.500rem);
  font-weight: 500;
  line-height: 1;
  color: #fff;
  white-space: nowrap;
  transform: translateX(-50%);
}
.consultation__items {
  display: flex;
  flex-direction: column;
}
.consultation__item {
  display: flex;
  align-items: center;
  gap: clamp(0.313rem, 0.170rem + 0.223vw, 0.438rem);
}
.consultation-item__icon {
  flex-shrink: 0;
  width: clamp(0.375rem, 0.304rem + 0.112vw, 0.438rem);
  height: clamp(0.375rem, 0.304rem + 0.112vw, 0.438rem);
  background-color: #ff880a;
  border-radius: 50%;
}
.consultation-item__text {
  font-size: clamp(0.875rem, 0.732rem + 0.223vw, 1.000rem);
  font-weight: 500;
  line-height: clamp(2.000rem, 1.429rem + 0.893vw, 2.500rem);
  color: #000;
}
.consultation-item__text br {
  display: none;
}

/* support */
.support {
  position: relative;
  z-index: 1;
  overflow-x: clip;
  padding-top: clamp(3.500rem, 1.625rem + 3.906vw, 6.312rem);
}
.support::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 0;
  width: auto;
  height: 100%;
  min-width: 100%;
  aspect-ratio: 1 / 1;
  background-image: url("https://heartfull-smile.jp/system_panel/uploads/images/a-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  transform: translateX(-50%);
  pointer-events: none;
}
.support__inner {
  position: relative;
  z-index: 1;
  padding-right: clamp(1.250rem, -12.500rem + 28.646vw, 21.875rem);
  padding-left: clamp(1.250rem, -12.500rem + 28.646vw, 21.875rem);
}
.support__container {
  display: flex;
  flex-direction: column;
}
.support__text {
  margin-top: clamp(1.250rem, 0.417rem + 1.736vw, 2.500rem);
  font-size: clamp(0.875rem, 0.625rem + 0.521vw, 1.250rem);
  font-weight: 500;
  line-height: clamp(1.500rem, 1.167rem + 0.694vw, 2.000rem);
  color: #000;
  text-align: center;
}
.support__items {
  display: flex;
  flex-direction: column;
  row-gap: clamp(1.562rem, 3.646rem - 1.736vw, 2.812rem);
  margin-top: clamp(3.750rem, 2.917rem + 1.736vw, 5.000rem);
}
.support__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1.250rem, -0.208rem + 3.038vw, 3.438rem);
}
.support__item:nth-child(even) {
  flex-direction: row-reverse;
}
.support-item__left {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}
.support-item__top {
  display: flex;
  align-items: center;
  gap: clamp(1.000rem, 0.417rem + 1.215vw, 1.875rem);
}
.support-item__number {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: clamp(2.812rem, 1.438rem + 2.865vw, 4.875rem);
  height: clamp(2.812rem, 1.438rem + 2.865vw, 4.875rem);
  background-color: #0f3666;
  border-radius: 50%;
  font-family: "Poppins", sans-serif;
  font-size: clamp(1.500rem, 1.167rem + 0.694vw, 2.000rem);
  font-weight: 500;
  line-height: 1;
  color: #fff;
}
.support-item__title {
  font-size: clamp(1.312rem, 0.854rem + 0.955vw, 2.000rem);
  font-weight: 500;
  line-height: clamp(1.875rem, 1.208rem + 1.389vw, 2.875rem);
  color: #0f3666;
}
.support-item__text {
  margin-top: clamp(1.250rem, 2.396rem - 0.955vw, 1.938rem);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #000;
}
.support-item__right {
  flex-shrink: 0;
}
.support-item__img {
  width: 100%;
  object-fit: contain;
}
.support-item__img--1 {
  width: clamp(19.375rem, 11.458rem + 16.49vw, 31.25rem);
  aspect-ratio: 510 / 279;
}
.support-item__img--2 {
  width: clamp(12.812rem, 6.646rem + 12.847vw, 22.062rem);
  aspect-ratio: 353 / 338;
}
.support-item__img--3 {
  width: clamp(11.938rem, 7.521rem + 9.201vw, 18.562rem);
  aspect-ratio: 297 / 393;
}

@media (max-width: 767px) {
  .about__content {
    flex-direction: column;
    align-items: stretch;
  }
  .about__left,
  .about__right {
    width: 100%;
  }
  .consultation__content {
    flex-direction: column;
        max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
  .consultation__title {
    font-size: 24px;
  }
  .support__container {
        max-width: 500px;
    margin-inline: auto;
  }
  .support__text br {
    display: none;
  }
  .support__item,
  .support__item:nth-child(even) {
    flex-direction: column;
    align-items: stretch;
  }
  .support-item__right {
    width: 100%;
    margin-top: 30px;
  }
  .support-item__img {
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 389px) {
  .about__inner,
  .consultation__inner,
  .support__inner {
    padding-right: 16px;
    padding-left: 16px;
  }
  .consultation__title {
    font-size: 22px;
  }
  .consultation-item__text {
    font-size: clamp(0.75rem, 0.17rem + 2.9vw, 0.875rem);
  }
  .support-item__number {
        width: 40px;
    height: 40px;
    font-size: 20px;
  }
}

