/* assets/css/component.css */

/* -----------------------------------------------------------
* お問い合わせフォーム
* ----------------------------------------------------------- */
.c-contact {
  display: flex;
  flex-direction: column;
}
.c-contact > li {
  display: flex;
  justify-content: start;
  align-items: start;
  gap: 2.0rem;
  padding: 2.0rem 0;
  border-bottom: 1px solid var(--color-gray-3);
}
.c-contact__title {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  color: var(--color-base-2);
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  width: 160px;
}

.c-contact .wpcf7-form-control-wrap {
  flex: 1;
  width: 100%;
}

.c-contact .wpcf7-form-control-wrap select,
.c-contact .wpcf7-form-control-wrap input,
.c-contact .wpcf7-form-control-wrap textarea {
  width: 100%;
  background-color: var(--color-base-5);
  font-size: 1.8rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  padding: 0.2rem 1.0rem;
}
.c-contact .wpcf7-form-control-wrap textarea {
  resize: vertical;
  max-height: 600px;
}
.c-contact .wpcf7-form-control-wrap select::placeholder,
.c-contact .wpcf7-form-control-wrap input::placeholder,
.c-contact .wpcf7-form-control-wrap textarea::placeholder {
  color: var(--color-gray-3);
}
.c-contact__submit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.0rem;
  padding-top: 2.0rem;
}
.c-contact__submit > input {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 340px;
  width: 100%;
  height: 60px;
  padding: 0 2em;
  border-radius: 999px;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid var(--color-white);
  color: var(--color-white);
  background: linear-gradient(0deg, var(--color-btn-base-1), var(--color-btn-base-2));
  box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  z-index: 1;
}

.c-contact__submit > input::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, var(--color-btn-base-1), var(--color-btn-base-1));
  z-index: -1;
  opacity: 0;
  transition: opacity 0.4s ease;
}
.c-contact__submit > input:hover::before {
  opacity: 1;
}

.wpcf7 form .wpcf7-response-output {
  text-align: center;
  font-size: 1.8rem;
  border: none;
  background-color: var(--color-base-5);
}

.c-hissu {
  color: var(--color-white);
  font-size: 1.2rem;
  padding: 0.2rem 0.6rem;
  border-radius: 12px;
  background-color: var(--color-accent-1);
}

@media (max-width: 767px) {
  .c-contact > li {
    flex-direction: column;
    gap: 1.0rem;
  }
  .c-contact__title {
    width: 100%;
  }
}



/* -----------------------------------------------------------
* Wordpressブロック
* ----------------------------------------------------------- */
.wp-block-image {
  width: 100%;
  height: 100%;
}
.wp-block-image img {
  height: 100%;
  max-height: 450px;
  object-fit: cover;
}
.wp-block-list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  padding: 3.2rem 5.0rem;
  border-radius: 2.0rem;
  background-color: var(--color-gray-4);
  list-style: disc;
}

.wp-block-list li {
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 160%;
}
.wp-block-list li::marker {
  color: var(--color-accent-1);
  font-size: 1.6em;
}

h2.wp-block-heading {
  color: var(--color-gray-1);
  font-size: clamp(2.0rem, 0.59vw + 1.54rem, 2.4rem);
  letter-spacing: 0.05em;
  line-height: 160%;
  padding-top: 1.0rem;
  padding-inline: 4.0rem;
  padding-bottom: 1.0rem;
  border-left: 1.0rem solid var(--color-base-2);
  background-color: var(--color-base-4);
}
h3.wp-block-heading {
  color: var(--color-base-2);
  font-size: 2.4rem;
  font-weight: 600;
  letter-spacing: 0.05em;
}

/* .wp-block-media-text {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
} */
.wp-block-media-text>.wp-block-media-text__content {
  align-self: flex-start;
}

/* -----------------------------------------------------------
* 投稿アーカイブ
* ----------------------------------------------------------- */
.c-card-post {
  width: 100%;
  max-width: 260px;
}
.c-card-post__img {
  width: 100%;
  height: 100%;
  max-height: 146px;
}
.c-card-post__img img {
  max-height: 146px;
}

.c-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
  padding: 1.6rem 0;
}
.c-pagination .page-numbers {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-base-2);
  letter-spacing: 0.05em;
  line-height: 140%;
  width: 40px;
  height: 40px;
  border: 1px solid var(--color-base-2);
  border-radius: 50%;
}
.c-pagination .page-numbers.current {
  color: var(--color-white);
  background-color: var(--color-base-2);
}

/* -----------------------------------------------------------
* 投稿ページ　コンテント
* ----------------------------------------------------------- */
.c-single-content {
  display: flex;
  flex-direction: column;
  gap: 4.0rem;
}
.c-single-content p {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 160%;
}

/* -----------------------------------------------------------
* サイドバー
* ----------------------------------------------------------- */
.c-sidebar-post {
  padding: 2.0rem 0;
  border-bottom: 1px solid var(--color-gray-3);
}

/* -----------------------------------------------------------
* パンクズリスト
* ----------------------------------------------------------- */
.c-breadcrumb a,
.c-breadcrumb span {
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.05em;
}

/* -----------------------------------------------------------
* 境界線
* ----------------------------------------------------------- */
.c-line {
  width: 100%;
  height: 1px;
}

.u-v-cut-bottom {
  clip-path: polygon(0 0,
      100% 0,
      100% calc(100% - 6rem),
      50% 100%,
      0 calc(100% - 6rem));
  /* 切り取られる分、下の余白を少し多めに確保するのがコツです */
  padding-bottom: 12.0rem;
}

/* -----------------------------------------------------------
* カード
* ----------------------------------------------------------- */
.c-card-voice {
  max-width: 300px;
  width: 100%;
  height: 100%;
  border-radius: 2.0rem;
  overflow: hidden;
}
.c-card-voice__face {
  width: 180px;
  height: 180px;
  border-radius: 999px;
  overflow: hidden;
}
.c-card-voice__info-1 {
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-base-2);
}
.c-card-voice__info-2 {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-base-2);
}
.c-card-voice__lead {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}




.c-card-human {
  max-width: 300px;
  width: 100%;
  height: 100%;
  padding: 2.4rem;
  border-radius: 2.0rem;
  overflow: hidden;
}

.c-card-human.--fix {
  position: relative;
  padding-top: 5.0rem;
  border: 2px solid var(--color-accent-1);
  overflow: visible;
}

.c-card-human.--fix::before {
  content: "";
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  width: 45px;
  height: 45px;
  border-radius: 999px;
  background: no-repeat center / contain url('../img/common/ico-check-circle.svg');
}

.c-card-human__lead {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}

.c-card-human__info-1 {
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-base-2);
}

.c-card-human__info-2 {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-base-2);
}

.c-card-human__face {
  width: 180px;
  height: 180px;
  border-radius: 999px;
  overflow: hidden;
}

.c-card-human__ico {
  width: 100px;
  height: 120px;
  object-fit: contain;
}

@media (max-width: 767px) {}



.c-card-price-top {
  position: relative;
  text-align: center;
  max-width: 560px;
  width: 100%;
  height: 100%;
  border-radius: 2.0rem;
  overflow: hidden;
  box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.1);
}

.c-card-price-top__ico {
  position: absolute;
  right: 2.0rem;
  bottom: 2.0rem;
  width: 108px;
  height: 108px;
  object-fit: contain;
}

.c-card-price-top__label {
  position: relative;
  color: var(--color-white);
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 140%;
  padding: 2.0rem;
  background-color: var(--color-btn-base-1);
}

.c-card-price-top__label-num {
  position: absolute;
  top: 50%;
  left: 2.0rem;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  object-fit: contain;
}

.c-card-price-top__label-num.--l2 {
  left: 0;
  width: auto;
  height: 60px;
}

.c-card-price-top__label-num.--l2.--reverse {
  left: auto;
  right: 0;
}

.c-card-price-top__lead {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}


.c-card-price-top__title {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 180%;
}

.c-card-price-top__price {
  display: flex;
  justify-content: center;
  align-items: end;
  color: var(--color-base-2);
  font-size: clamp(3.6rem, 1.78vw + 2.23rem, 4.8rem);
  font-weight: 700;
  font-family: var(--font-accent);
}

.c-card-price-top__price-title {
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 180%;
}

.c-card-price-top__img {
  max-height: 272px;
  border-radius: 2.0rem;
}

@media (max-width: 767px) {
  .c-card-price-top__label-num {
    width: 40px;
    height: 40px;
  }

  .c-card-price-top__ico {
    width: 40px;
    height: 40px;
  }
}


.c-card-price {
  text-align: center;
  width: 100%;
  height: 100%;
  border-radius: 2.0rem;
  overflow: hidden;
}

.c-card-price__label {
  color: var(--color-base-2);
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.c-card-price__line {
  display: inline-block;
  width: 4.0rem;
  height: 2px;
  margin-inline: auto;
  background-color: var(--color-base-2);
}

.c-card-price__title {
  color: var(--color-accent-1);
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 140%;
}

.c-card-price__price {
  display: flex;
  justify-content: center;
  align-items: end;
  color: var(--color-base-2);
  font-size: clamp(3.6rem, 1.78vw + 2.23rem, 4.8rem);
  font-weight: 700;
  font-family: var(--font-accent);
  letter-spacing: 0.05em;
}

.c-card-price__lead {
  text-align: left;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}

.c-card-price__check {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 2.8rem;
  max-width: 800px;
  width: 100%;
  padding: 2.0rem 2.8rem;
  border-radius: 2.0rem;
  margin-inline: auto;
  background-color: var(--color-gray-4);
}

.c-card-price__check-lbl {}

.c-card-price__check-list {
  flex: 1;
  gap: 2.0rem !important;
  padding-left: 2.8rem;
  border-left: 1px solid var(--color-gray-3);
}

@media (max-width: 767px) {
  .c-card-price__check {
    flex-direction: column;
    align-items: center;

    /* display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 2.8rem;
    max-width: 800px;
    width: 100%;
    padding: 2.0rem 2.8rem;
    border-radius: 2.0rem;
    margin-inline: auto;
    background-color: var(--color-gray-4); */
  }

  .c-card-price__check-list {
    padding-left: 0;
    border-left: 0;
  }
}




.c-card-price-l2 {
  text-align: center;
  width: 100%;
  height: 100%;
  border: 2px solid var(--color-btn-base-1);
  border-radius: 2.0rem;
  overflow: hidden;
}

.c-card-price-l2__label {
  color: var(--color-white);
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 140%;
  padding: 2.0rem;
  background-color: var(--color-btn-base-1);
}

.c-card-price-l2__title {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 180%;
}

.c-card-price-l2__price {
  display: flex;
  justify-content: center;
  align-items: end;
  color: var(--color-base-2);
  font-size: clamp(3.6rem, 1.78vw + 2.23rem, 4.8rem);
  font-weight: 700;
  font-family: var(--font-accent);
}

.c-card-price-l2__price-title {
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 180%;
}

.c-card-price-l2__img {
  max-height: 272px;
  border-radius: 2.0rem;
}




.c-card-stone {
  max-width: 294px;
  width: 100%;
  overflow: hidden;
}

.c-card-stone.--l2 {
  display: flex;
  flex-direction: column;
  gap: 2.0rem;
  max-width: 320px;
  width: 100%;
  padding: 2.8rem 4.0rem;
  border: 1px solid var(--color-base-3);
  border-radius: 2.0rem;
  overflow: hidden;
}

.c-card-stone__label {
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 160%;
  padding: 0.5rem 2.4rem;
  border: 1px solid var(--color-accent-1);
  border-radius: 999px;
  margin-inline: auto;
}

.c-card-stone.--l2 .c-card-stone__label {
  font-size: 2.0rem;
  border: none;
}

.c-card-stone__img {
  border-radius: 2.0rem;
  max-height: 200px;
}

.c-card-stone__lead {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}



.c-card-info {
  text-align: center;
  width: 100%;
  height: 100%;
  border-radius: 2.0rem;
  overflow: hidden;
}

.c-card-info__label {
  /* color: var(--color-base-2); */
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.c-card-info__line {
  display: inline-block;
  width: 4.0rem;
  height: 2px;
  margin-inline: auto;
  background-color: var(--color-base-2);
}

.c-card-info__title {
  color: var(--color-accent-1);
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 140%;
}

.c-card-info__price {
  display: flex;
  justify-content: center;
  align-items: end;
  color: var(--color-base-2);
  font-size: clamp(3.6rem, 1.78vw + 2.23rem, 4.8rem);
  font-weight: 700;
  font-family: var(--font-accent);
  letter-spacing: 0.05em;
}

.c-card-info__lead {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 180%;
}



/* -----------------------------------------------------------
* リスト
* ----------------------------------------------------------- */
.c-list {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}





/* -----------------------------------------------------------
* ボード
* ----------------------------------------------------------- */
.c-board {
  padding: 3.2rem 5.0rem;
  border-radius: 2.0rem;
}

.c-board__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.8rem 8.0rem;
  place-items: baseline;
}

.c-board__list.--col-1 {
  grid-template-columns: repeat(1, 1fr);
}

.c-board__list.--col-2 {
  grid-template-columns: repeat(2, 1fr);
}


@media (max-width: 767px) {
  .c-board {
    padding: 2.8rem 3.6rem;
    border-radius: 2.0rem;
  }

  .c-board__list {
    grid-template-columns: repeat(1, 1fr);
    gap: 2.8rem;
  }

  .c-board__list.--col-2 {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* -----------------------------------------------------------
* ラベル
* ----------------------------------------------------------- */
.c-lbl-round {
  padding: 0.8rem 2.0rem;
  border-radius: 999px;
  border: 1px solid;
}

.c-lbl-round.--base-2 {
  border-color: var(--color-base-2);
}

.c-lbl-round.--accent-1 {
  border-color: var(--color-accent-1);
}

.c-lbl-slash {
  position: relative;
}

.c-lbl-slash::before,
.c-lbl-slash::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 3px;
  height: 2.0em;
  background-color: var(--color-base-2);
}

.c-lbl-slash::before {
  left: -1.0em;
  transform: translateY(-50%) rotate(-30deg);
}

.c-lbl-slash::after {
  right: -1.0em;
  transform: translateY(-50%) rotate(30deg);
}


.c-lbl-dot {
  position: relative;
  display: flex;
  justify-content: left;
  align-items: start;
  gap: 1.0rem;
}

.c-lbl-dot.--align-center {
  align-items: center;
}

.c-lbl-dot__dot {
  position: relative;
  display: inline;
  width: 1.0em;
  height: 1lh;
}

.c-lbl-dot__dot::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 999px;
  background-color: var(--color-accent-1);
}

.c-lbl-dot.--black .c-lbl-dot__dot::before {
  background-color: var(--color-black);
}

.c-lbl-dot.--sss .c-lbl-dot__dot::before {
  width: 0.2rem;
  height: 0.2rem;
}

.c-lbl-dot__text {
  flex: 1;
}

.c-lbl-ico {
  position: relative;
  padding-left: 3.6rem;
}

.c-lbl-ico.--pl-100 {
  padding-left: 10.0rem;
}

.c-lbl-ico::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 2.4rem;
  height: 2.4rem;
  transform: translateY(-50%);
}

.c-lbl-ico.--top {
  position: relative;
  padding-top: 3.6rem;
  padding-left: 0;
}

.c-lbl-ico.--top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 2.4rem;
  height: 2.4rem;
  transform: translateX(-50%);
}

.c-lbl-ico.--bottom {
  position: relative;
  padding-top: auto;
  padding-left: 0;
  padding-bottom: 4.0rem;
}

.c-lbl-ico.--bottom::before {
  content: "";
  position: absolute;
  top: auto;
  left: 50%;
  bottom: 0rem;
  width: 2.4rem;
  height: 2.4rem;
  transform: translateX(-50%);
}

.c-lbl-ico.--left-top {
  position: relative;
  padding-left: 3.6rem;
}

.c-lbl-ico.--left-top::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 2.4rem;
  height: 2.4rem;
  transform: translateY(-50%);
}

.c-lbl-ico.--ico-leaf::before {
  width: 188px;
  height: 34px;
  background: no-repeat center / contain url('../img/common/ico-leaf.svg');
}

.c-lbl-ico.--ico-family::before {
  width: 84px;
  height: 60px;
  background: no-repeat center / contain url('../img/common/ico-family.svg');
}

.c-lbl-ico.--ico-question::before {
  background: no-repeat center / contain url('../img/common/ico-question.svg');
}

.c-lbl-ico.--ico-telephone::before {
  background: no-repeat center / contain url('../img/common/ico-telephone.svg');
}

.c-lbl-ico.--ico-note::before {
  background: no-repeat center / contain url('../img/common/ico-note.svg');
}

.c-lbl-ico.--ico-shield::before {
  background: no-repeat center / contain url('../img/common/ico-shield.svg');
}

.c-lbl-ico.--ico-file::before {
  background: no-repeat center / contain url('../img/common/ico-file.svg');
}

.c-lbl-ico.--ico-check::before {
  background: no-repeat center / contain url('../img/common/ico-check.svg');
}

.c-lbl-ico.--ico-pc::before {
  background: no-repeat center / contain url('../img/common/ico-pc.svg');
}

.c-lbl-ico.--ico-yen::before {
  background: no-repeat center / contain url('../img/common/ico-yen.svg');
}

.c-lbl-ico.--ico-haka::before {
  top: auto;
  bottom: 0;
  transform: none;
  left: -5.4rem;
  width: 7.4rem;
  height: 7.4rem;
  background: no-repeat center / contain url('../img/common/ico-haka.svg');
}

@media (max-width: 767px) {
  .c-lbl-ico.--left-top {
    padding-top: 3.6rem;
    padding-left: 0;
  }

  .c-lbl-ico.--left-top::before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  .c-lbl-ico.--left-top.--ico-haka::before {
    top: -2.6rem;
    left: 50%;
    transform: translateX(-50%);
    width: 4.8rem;
    height: 5.2rem;
  }
}

.c-lbl-sec {
  color: var(--color-gray-1);
  font-size: clamp(2.0rem, 0.59vw + 1.54rem, 2.4rem);
  letter-spacing: 0.05em;
  line-height: 160%;
  padding-top: 1.0rem;
  padding-inline: 4.0rem;
  padding-bottom: 1.0rem;
  border-left: 1.0rem solid var(--color-base-2);
  background-color: var(--color-base-4);
}

.c-lbl-title {
  position: relative;
}

.c-lbl-title__center {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.c-lbl-title__img {
  width: 80%;
  margin-inline: auto;
}

@media (max-width: 767px) {
  .c-lbl-sec {
    padding-inline: 2.4rem;
  }

  .c-lbl-title__img {
    width: 60%;
  }
}

/* -----------------------------------------------------------
* リンク
* ----------------------------------------------------------- */
.u-link {
  opacity: 1;
  transition: opacity 0.4s ease;
}

.u-link:hover {
  opacity: 0.7;
}

.c-link-arrow {
  display: inline-block;
  position: relative;
  padding-right: 2em;
  line-height: 100%;
}

.c-link-arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1em;
  height: 100%;
  line-height: 100%;
  background: no-repeat center / contain url('../img/ico-arrow.svg');
}

.c-link-arrow:hover {
  display: inline-block;
  position: relative;
  padding-right: 2em;
  line-height: 100%;
}

/* -----------------------------------------------------------
* 吹き出し
* ----------------------------------------------------------- */
.c-fuki {
  display: inline-block;
  position: relative;
  padding: 0.8rem 2.8rem;
  border-radius: 999px;
}

.c-fuki::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.7rem;
  width: 1.4rem;
  height: 1.4rem;
  transform: translateX(-50%) rotate(45deg);
  background-color: inherit;
}

/* -----------------------------------------------------------
* アンダーライン
* ----------------------------------------------------------- */

/* アンダーライン（アクセント色など、複数用意すると便利です） */
.c-under-line {
  position: relative;

  background-image: linear-gradient(transparent 75%, var(--color-base-4) 75%);
  background-repeat: no-repeat;

  /* 2. 改行してもインライン要素として背景を維持 */
  display: inline;

  /* 3. 改行時の端の処理を「複製(clone)」に設定し、各行で均一に表示 */
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;

  /* 4. 文字との隙間を微調整 */
  /* padding: 0.2em 0; */

  z-index: -1;
}

/* 別の色パターン（例：アクセントオレンジなど） */
.c-under-line.--color-accent-2 {
  background-image: linear-gradient(transparent 75%, var(--color-accent-2) 75%);
}

/* -----------------------------------------------------------
* ボタン
* ----------------------------------------------------------- */
.c-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 340px;
  width: 100%;
  height: 60px;
  padding: 0 2em;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  border: none;
  box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  z-index: 1;
}

.c-btn--small {
  max-width: auto;
  width: auto;
  min-width: auto;
  height: 46px;
  padding: 0 1.6rem;
}

.c-btn--border {
  border: 2px solid var(--color-white);
}

.c-btn--border__primary {
  border: 2px solid var(--color-base-2);
}

.c-btn--primary {
  color: var(--color-white);
  background: linear-gradient(0deg, var(--color-btn-base-1), var(--color-btn-base-2));
}

.c-btn--accent {
  color: var(--color-white);
  background: linear-gradient(0deg, var(--color-btn-accent-1), var(--color-btn-accent-2));
}

.c-btn--white {
  color: var(--color-base-2);
  background: linear-gradient(0deg, var(--color-white), var(--color-white));
}

.c-btn--primary::before,
.c-btn--accent::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, var(--color-btn-accent-1), var(--color-btn-accent-1));
  z-index: -1;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.c-btn--primary::before {
  background: linear-gradient(0deg, var(--color-btn-base-1), var(--color-btn-base-1));
}

.c-btn--accent::before {
  background: linear-gradient(0deg, var(--color-btn-accent-1), var(--color-btn-accent-1));
}

.c-btn--primary:hover::before,
.c-btn--accent:hover::before {
  opacity: 1;
}

/* -----------------------------------------------------------
* メニューレイアウト
* ----------------------------------------------------------- */
.l-menu__normal,
.l-menu__normal .menu-item-has-children,
.l-menu__normal .sub-menu {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.l-menu__normal .menu-item-has-children {
  position: relative;
}

.l-menu__normal a,
.l-menu__normal span {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  opacity: 1;
  transition: opacity 0.4s ease;
}

.l-menu__normal a:hover {
  opacity: 0.7;
}

.l-menu__normal .sub-menu a {
  position: relative;
  padding-left: 1.5em;
}

.l-menu__normal .sub-menu a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 1.6rem;
  height: 1px;
  background-color: var(--color-white);
}




.l-menu__sp,
.l-menu__sp .menu-item-has-children,
.l-menu__sp .sub-menu {
  display: flex;
  flex-direction: column;
  gap: 1.85rem;
  width: 100%;
}

.l-menu__sp>li {
  padding-bottom: 1.85rem;
  border-bottom: 1px solid var(--color-gray-3);
}

.l-menu__sp .menu-item-has-children {
  position: relative;
}

.l-menu__sp a,
.l-menu__sp span {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  opacity: 1;
  transition: opacity 0.4s ease;
}

.l-menu__sp a:hover {
  opacity: 0.7;
}

.l-menu__sp .sub-menu a {
  position: relative;
  padding-left: 1.5em;
}

.l-menu__sp .sub-menu a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 1.6rem;
  height: 1px;
  background-color: var(--color-white);
}

/* @media (max-width: 767px) {
  .l-menu__sp {
    width: 100%;
  }
} */

/* トグルボタン（右端固定） */
.c-menu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  width: 1.5rem;
  height: 1.5rem;
  background: transparent;
  border: none;
  cursor: pointer;
  /* position: relative; */
  flex-shrink: 0;
  /* ボタンが潰れないように */
}

/* 共通：プラス・マイナスの棒 */
.c-menu-toggle::before,
.c-menu-toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.5rem;
  height: 1.5px;
  background-color: var(--color-white);
  transform: translate(-50%, -50%);
  transition: transform 0.3s ease, opacity 0.3s ease;
}

/* 縦棒（プラスにするための棒） */
.c-menu-toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* --- 開いた状態（.is-open）のスタイル --- */
.menu-item.is-open>.c-menu-toggle::after {
  opacity: 0;
}

/* -----------------------------------------------------------
* 画像レイアウト
* ----------------------------------------------------------- */
.c-merit-01 {
  width: 306px;
  margin-inline: 0 auto;
}

.c-merit-02 {
  width: 176px;
  margin-inline: auto 0;
}

.c-merit-03 {
  width: 139px;
  margin-inline: 0 auto;
}

.c-merit-04 {
  width: 260px;
  margin-inline: auto 0;
}

.c-merit-line-01 {
  position: absolute;
  top: 200px;
  left: 50%;
  transform: translateX(-50%);
  width: 353px;
  height: 73px;
  background: no-repeat center / contain url('../img/common/line-01.svg');
}

.c-merit-line-02 {
  position: absolute;
  top: 498px;
  left: 59%;
  transform: translateX(-50%);
  width: 320px;
  height: 158px;
  background: no-repeat center / contain url('../img/common/line-02.svg');
}

.c-merit-line-03 {
  position: absolute;
  top: 780px;
  left: 55%;
  transform: translateX(-50%);
  width: 594px;
  height: 123px;
  background: no-repeat center / contain url('../img/common/line-03.svg');
}

@media (max-width: 1023px) {
  .c-merit-01 {
    width: 194px;
    margin-inline: auto 0;
  }

  .c-merit-02 {
    width: 152px;
    margin-inline: 0 auto;
  }

  .c-merit-03 {
    width: 139px;
    margin-inline: auto 0;
  }

  .c-merit-04 {
    width: 221px;
    margin-inline: 0 auto;
  }

  .c-merit-line-01 {
    top: 150px;
    left: 42%;
    transform: translateX(-50%);
    width: 172px;
    height: 176px;
    background: no-repeat center / contain url('../img/common/line-01-sp.svg');
  }

  .c-merit-line-02 {
    position: absolute;
    top: 486px;
    left: 53%;
    transform: translateX(-50%);
    width: 158px;
    height: 304px;
    background: no-repeat center / contain url('../img/common/line-02-sp.svg');
  }

  .c-merit-line-03 {
    position: absolute;
    top: 930px;
    left: 40%;
    transform: translateX(-50%);
    width: 140px;
    height: 198px;
    background: no-repeat center / contain url('../img/common/line-03-sp.svg');
  }
}