@charset "UTF-8";

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

トップページ

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

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

.fv-section {
  position: relative;
}

.fv-section-item.hydrogen-bath {
  background-image: url(../img/fv_onyokuki_bg.webp);
}

.fv-section-item.hydrogen-gas-generator {
  background-image: url(../img/fv_seiseiki_bg.webp);
}

.fv-section-item {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center ;
  padding: 4rem 5%;
}

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

.fv-products-title-en.hydrogen-bath {
  color: var(--color-hydrogen-bath);
}

.fv-products-title-en.hydrogen-gas-generator {
  color: var(--color-hydrogen-gas-generator);
}

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

.fv-catchcopy {
  position: absolute;
  top: 12.6rem;
  right: 3.6rem;
}

.fv-catchcopy-list {
  display: flex;
  flex-direction: row-reverse;
  gap: 1.6rem;
  width: 100%;
  margin-left: auto;
}

.fv-catchcopy-item {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-size: 1.6rem;
  color: var(--color-bold-text);
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1;
}

.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 {
  position: absolute;
  top: 36.2rem;
  right: 2rem;
}

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

/* リード文 */

.lp-first-section {
  background: url(../img/leaf_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;
}

/* なぜ医療機関用なのか */
.why-section{
  position: relative;
  background: url(../img/why_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 17rem 0 29rem;
}

.why-title{
  font-size: 2.8rem;
  color: var(--color-main);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-align: center;
  padding: 1rem 0;
  background: linear-gradient(
  to right,
  rgba(255, 255, 255, 0) 0%,
  rgba(255, 255, 255, 0.8) 13%,
  rgba(255, 255, 255, 0.8) 84%,
  rgba(255, 255, 255, 0) 100%
);
box-shadow: 0px -4px 4px 1px rgba(0, 0, 0, 0.02), 0px 4px 4px 1px rgba(0, 0, 0, 0.02);
margin-bottom: 2rem;
}

.why-text{
  text-align: center;
  margin-bottom: 3.6rem;
}

.why-text span {
  color: var(--color-main);
  font-weight: 500;
}

.why-last-text-list{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
}

.why-last-text-item{
  line-height: 1;
  color: var(--color-bold-text-white);
  width: fit-content;
  padding: 0.6rem 1rem 0.7rem;
  background-color: var(--color-sub);
}

.why-products-img-wrap{
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%);
  width: 30rem;
  height: auto;
}

/* 医療機関用が選ばれる理由 */
.reason-section{
  background: url(../img/reason_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 6rem 5% 8rem;
}

.reason-list{
  margin-bottom: 1rem;
}

.reason-item{
  background-color: var(--color-bold-text-white);
  border-radius: 0.8rem;
  padding: 3rem 2rem 0;
  box-shadow: 0px 4px 10px 0 rgba(0, 0, 0, 0.1);
}

.reason-item:not(:last-child){
  margin-bottom: 4rem;
}

.reason-item.number-01{
  padding-bottom: 7rem;
}

.reason-item.number-02{
  padding-bottom: 2rem;
}

.reason-icon{
  width: 20rem;
  height: 20rem;
  background-color: var(--color-sub);
  border-radius: 100%;
  margin: 0 auto 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.reason-icon img{
  display: inline-block;
  width: 10rem;
  height: auto;
}

.reason-item-title-wrap{
  display: flex;
  align-items: center;
  justify-content: left;
  gap: 1.4rem;
  position: relative;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 1rem;
}

.reason-item-title-wrap span{
  font-size: 3.6rem;
  font-weight: 700;
  color: var(--color-main);
  line-height: 1.1;
  letter-spacing: 0;
}

.reason-item-title{
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--color-main);
}

.reason-item-title-wrap::after{
  position: absolute;
  content: "";
  border-bottom: solid 1px var(--color-main);
  left: 0;
  bottom: -1px;
  width: 4rem;
  display: block;
}

.reason-item-text span{
  font-weight: 500;
  color: var(--color-main);
}

.standard-caption{
  font-size: 1.2rem;
  line-height: 1.2;
}

/* 医療機関用はこんな方におすすめです */

.recommend-section{
  background: url(../img/recommend_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 6rem 0;
}

.recommend-list-warp{
  margin-bottom: 6rem;
}

.recommend-item{
  background: linear-gradient(
  to right,
  rgba(255, 255, 255, 0) 0%,
  rgba(255, 255, 255, 1) 50%,
  rgba(255, 255, 255, 0) 100%
);
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.4rem 0 0.4rem 3rem;
}

.recommend-item::before{
  content: "";
  display: inline-block;
  width: 2.4rem;
  height: 2.4rem;
  background-image: url(../img/icon_checkmark.webp);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.recommend-item:not(:last-child){
  margin-bottom: 0.8rem;
}

.recommend-linkbutton-list{
  padding: 0 3rem;
}

.recommend-linkbutton-item{
  display: flex;
}

.recommend-linkbutton-item:nth-child(2n){
  justify-content: right;
}

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

.recommend-linkbutton{
  position: relative;
  display: inline-block;
  border-radius: 50%;
  transition-duration: 0.4s;
  box-shadow: 0px 0px 10px 0 rgba(0, 0, 0, 0.1);
}

@media (hover: hover) {
  .recommend-linkbutton:hover {
    transform: translateY(-1rem);
  }
}

.recommend-linkbutton-img{
  width: 26rem;
  height: 26rem;
  border-radius: 50%;
  overflow: hidden;
}

.recommend-linkbutton-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.recommend-linkbutton-label{
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.recommend-linkbutton-text{
  color: var(--color-bold-text-white);
  font-weight: 500;
  line-height: 1.5;
  word-break: keep-all;
  white-space: pre-line;
}

.recommend-linkbutton-text.hydrogen-bath{
  text-shadow: 0px 0px 10px rgba(100, 149, 237, 1);
}

.recommend-linkbutton-text.hydrogen-gas-generator{
  text-shadow: 0px 0px 10px rgba(99, 179, 101, 1);
}

.recommend-linkbutton-arrow{
  display: inline-block;
  line-height: 0;
}

.recommend-linkbutton-arrow img{
  display: block;
  width: 2rem;
  height: auto;
  rotate: 180deg;
  filter: brightness(0) invert(1);
}

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

医療機関用水素温浴器

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

#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-hydrogen-bath {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/fixbg_onyokuki.webp);
  background-size: 87.5rem auto;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

/* 従来の水素温浴器に比べて３台分の水素パワー */
.lead-hydrogen-bath-section {
  position: relative;
  background: url(../img/lead_onyokuki_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 44rem;
}

.lead-title-mask-area.hydrogen-bath {
  position: relative;
}

/* 高濃度の水素を、みんなで気軽にシェア。 */
.lead-hydrogen-gas-generator-section {
  position: relative;
  background: url(../img/lead_seiseiki_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.lead-title-mask-area.hydrogen-gas-generator {
  position: relative;
  margin-bottom: 38rem;
}

.lead-title{
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2.4rem;
  line-height: 1.4;
  color: var(--color-bold-text-white);
  text-align: center;
  word-break: keep-all;
  white-space: pre-line;
}

.lead-hydrogen-gas-generator-content{
  padding: 0 2rem 6rem;
}

.lead-hydrogen-gas-generator-text-wrap{
  text-align: center;
  margin-bottom: 3rem;
}

.lead-hydrogen-gas-generator-text:not(:last-child){
  margin-bottom: 0.8rem;
}

.lead-hydrogen-gas-generator-text span{
  font-weight: 500;
  color: var(--color-main);
}

.lead-hydrogen-gas-generator-spec-list{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.lead-hydrogen-gas-generator-spec-item{
  background-color: var(--color-bg);
  border-radius: 0.8rem;
  border: 1px solid var(--color-sub);
}

.lead-hydrogen-gas-generator-spec-item.spec-item-hydrogen{
  padding: 2.5rem 2.6rem 2.5rem 2.5rem;
}

.lead-hydrogen-gas-generator-spec-item.spec-item-people{
  padding: 3.3rem 2.1rem 4.9rem 2.2rem;
}

.lead-hydrogen-gas-generator-spec-icon-wrap{
  text-align: center;
}

.lead-hydrogen-gas-generator-spec-icon-wrap.icon-hydrogen-wrap{
  margin-bottom: 1rem;
}
.lead-hydrogen-gas-generator-spec-icon-wrap.icon-people-wrap{
  margin-bottom: 2rem;
}

.icon-hydrogen{
  width: 5.3rem;
  height: auto;
}

.icon-people{
  width: 6.7rem;
  height: auto;
}

.lead-hydrogen-gas-generator-spec-label{
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 500;
  text-align: center;
}

.lead-hydrogen-gas-generator-spec-label span{
  font-size: 3.2rem;
  line-height: 1;
  color: var(--color-main);
}

/* featureセクション */

.feature-section{
  padding: 6rem 5% 8rem;
  background-color: var(--color-bg02);
}

.feature-item{
  margin-bottom: 6rem;
}

.feature-title-number {
  font-size: 2rem;
  color: var(--color-main);
  letter-spacing: 0.1em;
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 3fr;
  gap: 1.6rem;
  margin-bottom: 0.4rem;
}

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

.feature-item-title{
  font-size: 2.4rem;
  font-weight: 500;
  margin-bottom: 1rem;
}

.feature-item-img{
  border-radius: 0.8rem;
  overflow: hidden;
  margin-bottom: 0.8rem;
}

.feature-item-text span{
  color: var(--color-main);
  font-weight: 500;
}

/* 契約者の声 */
.voice-section{
  padding: 6rem 0 8rem;
  background-color: var(--color-sub);
}

.voice-title{
  color: var(--color-bold-text-white);
}

.voice-item{
  position: relative;
}

.voice-item::after{
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), transparent);
  filter: blur(4px);
  pointer-events: none;
}

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

.voice-item-img-wrap{
  position: relative;
}

.voice-hydrogen-icon{
  position: absolute;
  top: -3rem;
  left: 2rem;
  background: url(../img/icon_voice_hydrogen.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 10rem;
  height: 11.7rem;
}

.voice-age-caption{
  color: var(--color-bold-text-white);
  text-align: center;
  margin-top: 5.5rem;
}

.voice-comment-caption{
  position: absolute;
  bottom: 1rem;
  left: 2rem;
}

.voice-comment-caption-text{
  font-size: 2rem;
  color: var(--color-bold-text-white);
  font-weight: 500;
  line-height: 1;
  width: fit-content;
  background-color: var(--color-sub);
  padding: 0.4rem;
}

.voice-comment-caption-text:not(:last-child){
  margin-bottom: 0.8rem;
}

.voice-text-wrap{
  background-color: var(--color-bold-text-white);
  padding: 1.6rem 2rem 4rem;
}

/* よくある質問 */

.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-sub);
  border-radius: 0.8rem;
  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-hydrogen-gas-generator {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url(../img/fixbg_seiseiki.webp);
  background-size: 87.5rem auto;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

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

ご契約内容の詳細

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

/* 契約について */

.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-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 {
  background-color: var(--color-bg);
  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;
  text-align: center;
}

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

.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-sub);
}

.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-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-sub);
  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-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-sub);
  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-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-sub);
  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;
}