/* 
remedy.css
*/
*, ::before, ::after {
  box-sizing: border-box;
}

html {
  line-sizing: normal;
}

body {
  margin: 0;
}

[hidden] {
  display: none;
}

h1 {
  font-size: 2rem;
}

h2 {
  font-size: 1.5rem;
}

h3 {
  font-size: 1.17rem;
}

h4 {
  font-size: 1rem;
}

h5 {
  font-size: 0.83rem;
}

h6 {
  font-size: 0.67rem;
}

h1 {
  margin: 0.67em 0;
}

pre {
  white-space: pre-wrap;
}

hr {
  border-style: solid;
  border-width: 1px 0 0;
  color: inherit;
  height: 0;
  overflow: visible;
}

img, svg, video, canvas, audio, iframe, embed, object {
  display: block;
  vertical-align: middle;
  max-width: 100%;
}

audio:not([controls]) {
  display: none;
}

picture {
  display: contents;
}

source {
  display: none;
}

img, svg, video, canvas {
  height: auto;
}

audio {
  width: 100%;
}

img {
  border-style: none;
}

svg {
  overflow: hidden;
}

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

[type=checkbox], [type=radio] {
  box-sizing: border-box;
  padding: 0;
}

html, body, input, textarea {
  font-size: 16px;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  font-style: normal;
}

html {
  scroll-behavior: smooth;
}

:target {
  scroll-margin-top: 88px;
}

body {
  background: #ffffff;
  color: #444444;
  line-height: 1.6;
  overflow-wrap: break-word;
}

a {
  color: #444444;
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

p {
  margin: 0;
}

ul, li {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.for-tablet {
  display: none;
}
@media screen and (max-width: 1000px) {
  .for-tablet {
    display: block;
  }
}

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

.for-sp-narrow {
  display: none;
}
@media screen and (max-width: 480px) {
  .for-sp-narrow {
    display: block;
  }
}

.section__inner {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 4rem;
  padding-bottom: 4rem;
  padding-right: 2rem;
  padding-left: 2rem;
  transition: padding 0.3s ease;
}
@media screen and (max-width: 750px) {
  .section__inner {
    padding-top: 2rem;
    padding-bottom: 2rem;
    padding-right: 1rem;
    padding-left: 1rem;
  }
}
.cta__buttons {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.cta__button {
  width: 100%;
  max-width: calc(393px - 2rem);
}
@media screen and (max-width: 480px) {
  .cta__button {
    max-width: 100%;
  }
}
.cta__button a {
  display: block;
  width: 100%;
  background-color: #00ADA4;
  color: #ffffff;
  box-shadow: 0 4px 4px rgba(87, 126, 124, 0.3);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  padding: 1rem 0.625rem 1.125rem;
  border-radius: 9999px;
}
@media screen and (hover: hover) {
  .cta__button a {
    opacity: 1;
    transition: opacity 0.3s ease-in;
  }
}
@media screen and (hover: hover) {
  .cta__button a:hover {
    opacity: 0.7;
  }
}

.section-intro {
  background-color: #F8F6F5;
}

.intro__inner {
  width: 100%;
  max-width: 1440px;
  height: 0;
  padding-top: 860px;
  margin: 0 auto;
  position: relative;
  background: url(../img/heroimage-001.jpg) no-repeat 0 0;
  background-size: 100% auto;
}
@media screen and (max-width: 1440px) {
  .intro__inner {
    padding-top: 59.7222222222%;
  }
}
@media screen and (max-width: 750px) {
  .intro__inner {
    background-image: url(../img/heroimage-001-sp.jpg);
    padding-top: 198.4732824427%;
  }
}

.intro__title {
  display: none;
  position: absolute;
  top: 12%;
  left: 6%;
  z-index: 1;
  color: transparent;
  opacity: 0;
}

.intro__cta {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  margin-top: 48.8194444444%;
  margin-left: 36.1805555556%;
  width: 100%;
  max-width: 520px;
}
@media screen and (max-width: 1440px) {
  .intro__cta {
    max-width: 36.1111111111%;
  }
}
@media screen and (max-width: 750px) {
  .intro__cta {
    top: unset;
    bottom: 0;
    margin-top: 0;
    margin-left: 0;
    margin-bottom: 2rem;
    max-width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
  }
}
.intro__cta a {
  display: block;
  width: 100%;
  background-color: #00ADA4;
  color: #ffffff;
  box-shadow: 0 4px 4px rgba(87, 126, 124, 0.3);
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  padding: 1.875rem 5rem 2rem;
  border-radius: 9999px;
}
@media screen and (hover: hover) {
  .intro__cta a {
    opacity: 1;
    transition: opacity 0.3s ease-in;
  }
}
@media screen and (hover: hover) {
  .intro__cta a:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 1440px) {
  .intro__cta a {
    font-size: 2.7777777778vw;
    padding: 5.3571428571% 0.625rem 5.7142857143%;
  }
}
@media screen and (max-width: 750px) {
  .intro__cta a {
    font-size: 1.25rem;
    padding: 1rem 0.625rem 1.125rem;
  }
}

.section-about {
  background-color: #ffffff;
}
.section-about .section__inner {
  max-width: unset;
}
.about__content {
  display: flex;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  .about__content {
    flex-direction: column;
    gap: 1.5rem;
  }
}

.about__text-wrap {
  flex: 1;
  padding-right: 1rem;
  padding-left: 1rem;
  padding-top: 0.75rem;
}

.about__img-001 {
  width: 100%;
  max-width: 40%;
  border-radius: 2rem;
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .about__img-001 {
    max-width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
  }
}

.about__title {
  font-size: 1.875rem;
  font-family: "Zen Old Mincho", serif;
  font-weight: 900;
  font-style: normal;
  font-weight: 900;
  color: #6B5247;
  line-height: 1.5;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 480px) {
  .about__title {
    font-size: 1.625rem;
  }
}

.about__text-001 {
  margin-top: 1rem;
}
.about__text-001 p + p {
  margin-top: 0.5rem;
}

.section-needs {
  background-color: #ffffff;
}
@media screen and (max-width: 750px) {
  .section-needs .section__inner {
    padding-bottom: 3rem;
  }
}
.section-needs .section__title {
  font-size: 1.5rem;
  font-family: "Zen Old Mincho", serif;
  font-weight: 900;
  font-style: normal;
  font-weight: 700;
  color: #444444;
  text-align: center;
  letter-spacing: 0.08em;
  position: relative;
}
.section-needs .section__title span {
  display: inline-block;
  position: relative;
}
.section-needs .section__title span::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background-color: #F4E2DB;
  border-radius: 9999px;
}
.section-needs .section__title em {
  font-style: normal;
}
.section-needs .section__title em.large {
  font-size: 1.875rem;
}
.section-needs .section__content {
  margin-top: 26px;
}
@media screen and (max-width: 750px) {
  .section-needs .section__content {
    margin-top: 20px;
  }
}

.needs__img-001 {
  display: block;
  width: 100%;
  padding-bottom: 3.625rem;
}
.needs__img-001 img {
  display: block;
  width: 100%;
  max-width: 639px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.needs__text-001 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  color: #7C5F50;
  line-height: 1.3;
  letter-spacing: 0.04em;
  margin: 1.625rem 0 1.5625rem;
}
@media screen and (max-width: 480px) {
  .needs__text-001 {
    margin: 1.25rem 0 0.625rem;
  }
}
.needs__text-001 p {
  margin-bottom: 0.375rem;
  text-align: center;
}
.needs__text-001:before, .needs__text-001:after {
  content: "";
  display: block;
  width: 62px;
  height: 6px;
  background-color: #F4E2DB;
  border-radius: 9999px;
}
.needs__text-001:before {
  transform: rotate(60deg);
  transform-origin: 50% 50%;
}
.needs__text-001:after {
  transform: rotate(-60deg);
  transform-origin: 50% 50%;
}

.needs__text-002 p {
  font-size: 1.5rem;
  font-weight: 700;
  color: #5EC7C1;
  text-align: center;
  letter-spacing: 0.12em;
}
@media screen and (max-width: 480px) {
  .needs__text-002 p {
    font-size: 1.25rem;
  }
}
.needs__text-002 strong {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: #5EC7C1;
  letter-spacing: 0.12em;
  margin-top: 0.25rem;
}
@media screen and (max-width: 480px) {
  .needs__text-002 strong {
    font-size: 1.625rem;
  }
}
.needs__text-002 strong small {
  font-size: 1.5rem;
  font-weight: 700;
}

.section-features {
  background-color: #F8F6F5;
}
.section-features .section__title {
  font-size: 1.875rem;
  font-weight: 700;
  color: #786C67;
  text-align: center;
  position: relative;
  letter-spacing: 0.08em;
}
.section-features .section__title span {
  display: inline-block;
  position: relative;
}
.section-features .section__title span::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background-color: #5EC7C1;
  border-radius: 9999px;
}
.section-features .section__content {
  margin-top: 32px;
}
@media screen and (max-width: 750px) {
  .section-features .section__content {
    margin-top: 20px;
  }
}

.features__list {
  width: 100%;
  max-width: 650px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 2rem;
}
.features__list li {
  width: 100%;
  background: #ffffff;
  border-radius: 1rem;
  overfeatures: hidden;
  padding: 1rem 2rem;
}
@media screen and (max-width: 480px) {
  .features__list li {
    padding: 1rem;
  }
}
.features__list li + li {
  margin-top: 1rem;
}

.features__list-item {
  display: block;
}

.features__list-item-text-wrap {
  display: block;
}

.features__list-item-title {
  display: block;
  font-size: 1.25rem;
  color: #00ADA4;
  text-align: center;
  letter-spacing: 0.04em;
}

.features__list-item-text {
  display: block;
  font-size: 1rem;
  margin-top: 0.5rem;
}

.features__list-item-note {
  display: block;
  font-size: 0.75rem;
  color: #888888;
  margin-top: 0.5rem;
}

.features__list-item-img {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
}
.features__list-item-img img {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.section-flow {
  background-color: #ffffff;
}
.section-flow .section__title {
  font-size: 1.875rem;
  font-weight: 700;
  color: #786C67;
  text-align: center;
  position: relative;
  letter-spacing: 0.08em;
}
.section-flow .section__title span {
  display: inline-block;
  position: relative;
}
.section-flow .section__title span::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background-color: #5EC7C1;
  border-radius: 9999px;
}
.section-flow .section__content {
  margin-top: 26px;
}
@media screen and (max-width: 750px) {
  .section-flow .section__content {
    margin-top: 20px;
  }
}

.flow__list {
  width: 100%;
  max-width: 540px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 2rem;
}
.flow__list li {
  width: 100%;
  background: #F8F6F5;
  border-radius: 0.75rem;
  overflow: hidden;
  padding: 1rem 1rem 1rem 2rem;
}
@media screen and (max-width: 480px) {
  .flow__list li {
    padding: 1rem;
  }
}
.flow__list li + li {
  margin-top: 1rem;
}

.flow__list-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
@media screen and (max-width: 480px) {
  .flow__list-item {
    flex-direction: column;
  }
}

.flow__list-item-text-wrap {
  display: block;
  flex: 1;
}

.flow__list-item-title {
  display: block;
  font-size: 1.25rem;
  color: #00ADA4;
  line-height: 1.4;
}

.flow__list-item-text {
  display: block;
  font-size: 1rem;
  margin-top: 0.25rem;
}
.flow__list-item-text small {
  display: block;
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
@media screen and (max-width: 480px) {
  .flow__list-item-text br {
    display: none;
  }
}

.flow__list-item-img {
  display: block;
  width: 165px;
}
@media screen and (max-width: 480px) {
  .flow__list-item-img {
    width: 70%;
    margin: 0 auto;
  }
}

.footer {
  background-color: #E3E2E1;
  color: #888888;
  padding: 2rem;
}
@media screen and (max-width: 750px) {
  .footer {
    padding: 1rem;
  }
}

.footer__inner {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  text-align: left;
}

.footer__text-001 {
  font-size: 0.75rem;
  font-weight: 500;
}
.footer__text-001 p + p {
  margin-top: 0.5rem;
}