@charset "UTF-8";

/*-------------------------------------------------------------------------

トップページ

-------------------------------------------------------------------------*/

/* ファーストビュー */

.fv-section {
  position: relative;
}
.fv-section-item {
  background: url(../img/fv_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center left -7rem;
  padding: 4rem 2rem;
}

.fv-catchcopy {
  display: block;
  font-size: 1.8rem;
  letter-spacing: 0.15em;
  text-align: center;
  margin-bottom: 1rem;
}

.fv-products-img-wrap {
  margin-bottom: 2rem;
  text-align: center;
}

.fv-products-img {
  width: 29.5rem;
  height: auto;
  border-radius: 5rem;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}

.fv-products-title-en {
  display: block;
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--color-bold-text);
  text-align: center;
}

.fv-products-title-ja {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-align: center;
  margin-bottom: 2rem;
}

.fv-products-title-ja span {
  font-size: 1.8rem;
}

.fv-button-list {
  display: flex;
  justify-content: center;
  gap: 1.6rem;
  margin-bottom: 2.6rem;
}

.fv-button-item {
  width: 100%;
  max-width: 16rem;
}

/* 矢印ボタン */
.fv-section .splide__arrows {
  width: 29.5rem;
  /* padding: 0 20px; */
  margin-inline: auto;
  position: absolute;
  top: 34rem;
  left: 0;
  right: 0;
  transform: translateY(-50%);
}

.fv-section .splide__arrow {
  width: 4rem;
  height: 4rem;
}

/* リード文 */

.lp-first-section {
  background: url(../img/subpage_title_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 4rem 0;
}

.lp-first-text {
  font-size: 1.8rem;
  color: var(--color-bold-text-white);
  text-align: center;
}

/*-------------------------------------------------------------------------

水素温浴器（研究用）

-------------------------------------------------------------------------*/

#hydrogen-bath {
  scroll-margin-top: 8rem;
}

/* 背景固定画像 */

.fixbg-section {
  position: relative;
  width: 100%;
  height: 19rem;
}

.fixbg-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  clip-path: inset(0);
}

.fixbg-bg-onyokuki {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/fixbg01.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

@media (min-width: 1024px) {
  .fixbg-bg-onyokuki {
    background-position: calc((100vw - 600px) / 6) center;
  }
}

/* POINTセクション */

.point01 {
  position: relative;
  overflow: hidden;
}

/* 青いぼかし装飾の位置を指定 */
.point01 .blue-blur {
  display: inline-block;
  position: absolute;
}

.point01 .blue-blur img {
  width: 40rem;
  height: 40rem;
}

.point01 .blue-blur.onyokuki:nth-of-type(1),
.point01 .blue-blur.seiseiki:nth-of-type(1),
.point01 .blue-blur.insuiki:nth-of-type(1) {
  top: -15rem;
  right: -15rem;
}

.point01 .blue-blur.onyokuki:nth-of-type(2) {
  bottom: 8rem;
  left: -15rem;
}

.point01 .blue-blur.seiseiki:nth-of-type(2) {
  bottom: 23rem;
  left: -15rem;
}

.point01-inner {
  padding: 6rem 5%;
}

.point-title-number {
  font-size: 2rem;
  color: var(--color-complementary);
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 3fr;
  gap: 1rem;
  margin-bottom: 1rem;
}

.point-title-number::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 0.1rem;
  background-color: var(--color-border);
}

.point-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  margin-bottom: 2rem;
}

.point01-img01 {
  margin-bottom: 2rem;
}

.point01-img02 {
  margin: 6rem 0 2rem;
  position: relative; /* 青いぼかし装飾が画像の下に配置されるように */
}

.point01-img03 {
  position: relative; /* 青いぼかし装飾が画像の下に配置されるように */
  margin-top: 8rem;
}

.point-section.hydrogen-gas-generator .point02-text{
  margin-bottom: 5rem;
}

.point02 {
  position: relative;
  overflow: hidden;
}

/* 青いぼかし装飾の位置を指定 */
.point02 .blue-blur {
  display: inline-block;
  position: absolute;
}

.point02 .blue-blur img {
  width: 40rem;
  height: 40rem;
}

.point02 .blue-blur.onyokuki:nth-of-type(1),
.point02 .blue-blur.seiseiki:nth-of-type(1),
.point02 .blue-blur.insuiki:nth-of-type(1) {
  top: -15rem;
  right: -15rem;
}

.point02 .blue-blur.insuiki:nth-of-type(2) {
  bottom: 8rem;
  right: -8rem;
}

.point02-inner {
  padding: 6rem 5%;
}

.point02-img01 {
  margin-bottom: 2rem;
}

.point02-img02 {
  position: relative; /* 青いぼかし装飾が画像の下に配置されるように */
}

/* 誰でも簡単！水素温浴器の使い方 */

.howto-onyokuki-section {
  background: url(../img/howto_onyokuki_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: var(--color-complementary);
  background-blend-mode: multiply;
  padding: 6rem 5%;
}

.howto-onyokuki-title {
  font-size: 2.4rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.5;
  color: var(--color-bold-text-white);
  text-align: center;
  margin-bottom: 3rem;
}

.howto-onyokuki-list {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}

.howto-onyokuki-item {
  background-color: var(--color-bold-text-white);
  border-radius: 2rem;
  padding: 3rem 2rem;
}

.howto-onyokuki-item-number {
  font-size: 2rem;
  font-weight: 500;
  color: var(--color-bold-text-white);
  text-align: center;
  width: 100%;
  max-width: 13rem;
  background: var(--gradient-button);
  border-radius: 3rem;
  margin: 0 auto 1rem;
}

.howto-onyokuki-item-title {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 1.6rem;
}

.howto-onyokuki-item-text {
  padding-top: 0.8rem;
  border-top: 1px solid var(--color-border);
  margin-bottom: 1.6rem;
}

/* 水素風呂を行うのはどちらがお得？ */

.which-suisoburo-before-content {
  background: url(../img/hikaku_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.which-suisoburo-title-wrap {
  display: flex;
  justify-content: center;
  background: url(../img/hikaku_title_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 4rem 5%;
  position: relative;
  /* パーセンテージでV字の深さを指定 */
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% 85%,
    /* 右下（85%の位置） */ 50% 100%,
    /* V字の頂点（100%） */ 0% 85% /* 左下（85%の位置） */
  );
}

.which-suisoburo-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text-white);
  text-align: center;
}

.which-suisoburo-before-content-inner {
  padding: 3rem 5% 6rem;
}

.which-suisoburo-title-sub {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 2rem;
}

.which-suisoburo-img-list {
  display: flex;
  justify-content: center;
  gap: 2.6rem;
  margin-bottom: 2.4rem;
}

.which-suisoburo-img-item {
  border-radius: 100%;
}

.which-suisoburo-img-item:first-child {
  border: 4px solid var(--color-main);
}

.which-suisoburo-img-item:last-child {
  border: 4px solid var(--color-border);
}

.which-suisoburo-img-item img {
  width: 12.5rem;
  height: 12.5rem;
  object-fit: cover;
}

.which-suisoburo-table-img {
  text-align: center;
  margin-bottom: 1rem;
}

.which-suisoburo-table-text {
  font-size: 1.4rem;
  line-height: 1.7;
}

.which-suisoburo-after-content {
  background: url(../img/hikaku_bg02.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 6rem 5%;
}

.which-suisoburo-after-content-text {
  text-align: center;
  margin-bottom: 5rem;
}

.which-suisoburo-after-content-wrap {
  text-align: center;
  margin-top: 4rem;
}

.which-suisoburo-after-content-wrap img {
  width: 13.2rem;
  height: auto;
}

/* 多くのメディアが注目する水素 */

.media-attention-title-bg {
  background: url(../img/media_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 4rem 0 0;
  width: 100%;
  height: 40rem;
  margin-bottom: 2rem;
}

.media-attention-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
}

.media-attention-text-wrap {
  padding: 0 5%;
  margin-bottom: 7rem;
}

.media-attention-img-wrap {
  position: relative;
}

.img-above-message-wrap {
  position: absolute;
  top: 3rem;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.img-above-message {
  display: inline-block;
  width: fit-content;
  padding: 0 0.8rem;
  color: var(--color-bold-text-white);
  background: var(--gradient-button);
}

/* よくある質問 */

.faq-section {
  padding: 6rem 5%;
}

.faq-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 4rem;
}

/* アコーディオンの開閉実装とデフォルトの三角マークを非表示 */
.faq-category-name,
.faq-question-name {
  display: block;
  cursor: pointer;
}

.faq-category-name::-webkit-details-marker,
.faq-question-name::-webkit-details-marker {
  display: none;
}

.faq-category-inner,
.faq-question-answer {
  overflow: hidden;
}

.faq-category-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.faq-category-name {
  width: 100%;
  background-color: var(--color-main);
  padding: 1rem 2rem;
  font-size: 1.8rem;
  font-weight: 500;
  color: var(--color-bold-text-white);
  position: relative;
  display: flex;
  align-items: center;
}

/* プラスマーク/マイナスマーク */
.faq-category-name::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.8rem;
  height: 0.2rem;
  background-color: var(--color-bold-text-white);
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
}

.faq-category-name::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 2rem;
  width: 1.8rem;
  height: 0.2rem;
  background-color: var(--color-bold-text-white);
  transform: translateY(-50%) rotate(90deg);
  transition: transform 0.3s ease;
}

/* アコーディオンが開いた時（マイナスマーク） */
.faq-category[open] .faq-category-name::before {
  transform: translateY(-50%) rotate(0deg);
}

/* 閉じる開始時に即座にプラスに戻す（open属性があってもclosingクラスを優先） */
.faq-category[open] .faq-category-name.closing::before,
.faq-category-name.closing::before {
  transform: translateY(-50%) rotate(90deg);
}

.faq-question-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}

.faq-category[open] .faq-question-wrap {
  margin-bottom: 4rem;
}

.faq-category[open] .faq-question-wrap > .faq-question:first-child {
  margin-top: 1.6rem;
}

.faq-question-name {
  font-size: 1.6rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--color-border);
  display: flex;
  gap: 1rem;
  cursor: pointer;
}

.faq-question-name p {
  width: 85%;
}

.faq-question-name::before {
  content: "Q";
  font-size: 1.6rem;
  font-weight: 500;
  display: inline-block;
}

.faq-question-name span {
  display: flex;
  justify-content: end;
  align-items: center;
  flex: 1;
}

.faq-question-name span img {
  width: 1.5rem;
  height: auto;
  transform: rotate(180deg);
  transition: transform 0.3s ease;
}

/* アコーディオンが開いた時（矢印が上向きになる） */
.faq-question[open] .faq-question-name span img {
  transform: rotate(0deg);
}

/* 閉じる開始時に即座に下向きに戻す（open属性があってもclosingクラスを優先） */
.faq-question[open] .faq-question-name.closing span img,
.faq-question-name.closing span img {
  transform: rotate(180deg);
}

.faq-question-answer {
  font-size: 1.6rem;
  padding-top: 1.2rem;
  display: flex;
  gap: 1rem;
}

.faq-question-answer p {
  margin-bottom: 2rem;
}

.faq-question-answer::before {
  content: "A";
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-main);
  display: inline-block;
}

/*-------------------------------------------------------------------------

水素ガス生成器（研究用）

-------------------------------------------------------------------------*/

#hydrogen-gas-generator {
  scroll-margin-top: 8rem;
}

/* 背景固定画像 */

.fixbg-bg-seiseiki {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/fixbg02.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

/* 水素生成はPEM式電解法 */

.pem-section {
  background: url(../img/pem_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 6rem 5%;
}

.pem-subtitle {
  display: block;
  font-size: 1.6rem;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 1rem;
}

.pem-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 2rem;
}

.pem-text {
  margin-bottom: 1rem;
}

.pem-text-note {
  display: block;
  font-size: 1.4rem;
  margin-bottom: 3rem;
}

.pem-img-wrap img {
  border-radius: 2rem;
}

/*-------------------------------------------------------------------------

水素飲水器（研究用）

-------------------------------------------------------------------------*/

#hydrogen-water-apparatus {
  scroll-margin-top: 8rem;
}

/* 背景固定画像 */

.fixbg-bg-insuiki {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/fixbg03.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

/* 水素水をもっとたくさん。そんな声にお応えして */

.insuiki-suisomore-title-wrap {
  display: flex;
  justify-content: center;
  background: url(../img/insuiki_title_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: var(--color-complementary);
  background-blend-mode: multiply;
  padding: 7rem 5%;
  position: relative;
  /* パーセンテージでV字の深さを指定 */
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% 85%,
    /* 右下（85%の位置） */ 50% 100%,
    /* V字の頂点（100%） */ 0% 85% /* 左下（85%の位置） */
  );
}

.insuiki-suisomore-title {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: var(--color-bold-text-white);
  text-align: center;
}

.insuiki-suisomore-content {
  background-color: var(--color-bg);
}

.insuiki-suisomore-content-inner {
  padding: 0 5% 6rem;
}

.insuiki-suisomore-img {
  margin-top: -3rem;
}

.insuiki-suisomore-title-sub {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 2rem;
}

.insuiki-suisomore-text {
  text-align: center;
  margin-bottom: 5rem;
}

.insuiki-img-wrap {
  position: relative;
}

.img-above-message-wrap.insuiki {
  top: 16.4rem;
  right: 0;
}

.img-above-message.insuiki {
  background: var(--color-bold-text-white);
  color: var(--color-main-text);
}

@media (min-width: 1024px) {
  .fixbg-bg-onyokuki {
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: calc(
        (100vw - clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px)) *
          4 / 6 + clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px) /
          2 - 25vw
      )
      center;
  }

  .fixbg-bg-seiseiki {
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: calc(
        (100vw - clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px)) *
          4 / 6 + clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px) /
          2 - 25vw
      )
      center;
  }

  .fixbg-bg-insuiki {
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: calc(
        (100vw - clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px)) *
          4 / 6 + clamp(375px, calc(375px + (100vw - 1024px) * 65 / 600), 440px) /
          2 - 25vw
      )
      center;
  }
}

@media (min-width: 1624px) {
  .fixbg-bg-onyokuki,
  .fixbg-bg-seiseiki,
  .fixbg-bg-insuiki {
    background-position: calc(
        (100vw - calc(375px + (100vw - 1024px) * 65 / 600)) * 4 / 6 +
          calc(375px + (100vw - 1024px) * 65 / 600) / 2 - 25vw
      )
      center;
  }
}

/*-------------------------------------------------------------------------

ご契約内容の詳細

-------------------------------------------------------------------------*/

/* 契約について */
.subpage-container {
  padding: 6rem 5% 8rem;
}

.contract-section {
  padding: 6rem 5% 8rem;
}

.contract-title {
  margin-bottom: 3rem;
}

.contract-item {
  font-size: 1.6rem;
  text-indent: -1em;
  padding-left: 1em;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
}

.contract-item:not(:last-child) {
  margin-bottom: 2rem;
}

/* お支払いについて */

.payment-section {
  padding: 0 5% 8rem;
}

.payment-title {
  margin-bottom: 2rem;
}

.payment-text {
  font-size: 1.6rem;
  margin-bottom: 2rem;
}

.payment-price {
  background-color: var(--color-pc-bg);
  padding: 2rem 2.8rem;
}

.payment-price-text {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text);
}

.payment-pay-list {
  margin-bottom: 3rem;
}

.payment-pay-item:not(:last-child) {
  margin-bottom: 3rem;
}

.payment-pay-title {
  margin-bottom: 2rem;
}

.payment-pay-text {
  font-size: 1.6rem;
  text-indent: -1em;
  padding-left: 1em;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 2rem;
}

.payment-pay-text.credit:last-child,
.payment-pay-text.bank:last-child {
  margin-bottom: 0;
}

.payment-price {
  padding: 4rem 2rem;
}

.payment-price-title {
  font-weight: 500;
  color: var(--color-bold-text);
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 2rem;
}

.payment-price-item:not(:last-child) {
  margin-bottom: 2rem;
}

.payment-price-item-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text);
  margin-bottom: 0.6rem;
}

.payment-price-detail {
  display: flex;
  justify-content: space-between;
  gap: 0.3rem;
}

.payment-price-detail-item {
  width: 50%;
  display: flex;
  flex-direction: column;
}

.payment-price-detail-name {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-bold-text-white);
  background-color: var(--color-main);
  text-align: center;
}

.payment-price-detail-name.monthly {
  background-color: var(--color-complementary);
}

.payment-price-detail-value {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text);
  text-align: center;
  background-color: var(--color-bold-text-white);
  padding: 1rem 0;
}

.payment-price-detail-value span {
  font-size: 1.2rem;
}

/* ご登録時にご用意するもの */
.register-section {
  padding: 0 5% 8rem;
}

.register-title {
  margin-bottom: 3rem;
}

.register-text {
  font-size: 1.6rem;
  text-indent: -1em;
  padding-left: 1em;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 2rem;
}

.register-idcard {
  background-color: var(--color-pc-bg);
  padding: 2.4rem 2rem;
  margin-bottom: 5rem;
}

.register-idcard-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text-white);
  background-color: var(--color-complementary);
  text-align: center;
  margin-bottom: 0.8rem;
}

.register-idcard-text {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-bold-text);
}

.register-pay-list {
  margin-bottom: 1rem;
}

.register-pay-item:not(:last-child) {
  margin-bottom: 3rem;
}

.register-pay-title {
  margin-bottom: 2rem;
}

.register-pay-text {
  font-size: 1.6rem;
  text-indent: -1em;
  padding-left: 1em;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 2rem;
}

.register-pay-text.credit:last-child,
.register-pay-text.bank:last-child {
  margin-bottom: 0;
}

.register-bank-note {
  font-size: 1.4rem;
}

/* お申込手順 */

.apply-section {
  padding: 0 5% 8rem;
}

.apply-title {
  margin-bottom: 3rem;
}

.apply-list {
  margin-bottom: 3rem;
}

.apply-item:not(:last-child) {
  margin-bottom: 1.6rem;
}

.apply-item-title {
  margin-bottom: 2rem;
}

.apply-item-text {
  font-size: 1.6rem;
}

.upload-button {
  background-color: var(--color-bg);
  border-radius: 7rem;
  border: 1px solid var(--color-main);
  transition-duration: 0.4s;
}

.upload-button-link {
  display: inline-block;
  padding: 2.3rem 0;
  color: var(--color-bold-text);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}

.upload-button-link::before {
  content: "";
  display: inline-block;
  background: url(../img/upload_icon.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 3rem;
  height: 2.4rem;
}

@media (hover: hover) {
  .upload-button:hover {
    transform: translateY(-5px);
  }
}

/* 本人確認書類のアップ手順 */

#upload-step {
  scroll-margin-top: 8rem;
}

.upload-section {
  padding: 8rem 5%;
}

.upload-title {
  margin-bottom: 3rem;
}

.upload-text {
  font-size: 1.6rem;
  margin-bottom: 5rem;
}

.upload-item:not(:last-child) {
  margin-bottom: 8rem;
}

.upload-item-title {
  margin-bottom: 2rem;
}

.upload-item-text.type {
  font-size: 1.6rem;
  margin-bottom: 2rem;
}

.upload-item-img.type {
  margin-bottom: 2rem;
}

.upload-note.type {
  background-color: var(--color-pc-bg);
  padding: 2.4rem;
}

.upload-note-title.type {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text-white);
  text-align: center;
  background-color: var(--color-complementary);
  margin-bottom: 10px;
}

.upload-note-text.type {
  font-size: 1.4rem;
}

.upload-note-text.type:not(:last-child) {
  margin-bottom: 0.8rem;
}

.upload-item-text.photo {
  font-size: 1.6rem;
  margin-bottom: 3rem;
}

.upload-note.photo {
  background-color: var(--color-pc-bg);
  padding: 2.4rem 2rem;
  margin-bottom: 2rem;
}

.upload-note-title.photo {
  font-size: 1.6rem;
  color: var(--color-bold-text-white);
  text-align: center;
  background-color: var(--color-complementary);
  margin-bottom: 0.8rem;
}

.upload-note-text.photo {
  font-size: 1.4rem;
  text-indent: -1em;
  padding-left: 1em;
}

.upload-note-img-text.photo {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-bold-text);
}

/* 提出方法 */
.submit-section {
  padding: 0 5% 8rem;
}

.submit-title {
  margin-bottom: 2rem;
}

.submit-text {
  font-size: 1.6rem;
  margin-bottom: 2rem;
}

.submit-img {
  margin-bottom: 4rem;
}

.submit-item:not(:last-child) {
  margin-bottom: 5rem;
}

.submit-item-title {
  margin-bottom: 3rem;
}

/*-------------------------------------------------------------------------

プライバシーポリシー

-------------------------------------------------------------------------*/

.privacy-policy-section {
  padding: 6rem 5% 8rem;
}

.privacy-policy-text {
  font-size: 1.6rem;
  margin-bottom: 5rem;
}

.personal-info-title {
  font-size: 2rem;
  font-weight: 500;
  color: var(--color-bold-text);
  text-align: center;
  margin-bottom: 2.4rem;
}

.personal-info-item-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-bold-text);
  padding-bottom: 0.8rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 0.8rem;
}

.personal-info-item-text {
  font-size: 1.6rem;
}

.personal-info-item-text:not(:last-child) {
  margin-bottom: 3rem;
}

/*-------------------------------------------------------------------------

会社概要

-------------------------------------------------------------------------*/

.company-section {
  padding: 6rem 5%;
}

.company-item {
  display: flex;
  align-items: flex-start;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
}

.company-item:not(:last-child) {
  margin-bottom: 2rem;
}

.company-item-title {
  width: 40%;
  font-size: 1.6rem;
}

.company-item-text {
  width: 60%;
  font-size: 1.6rem;
}