/* =========================================================
   モバイルファースト構成
   ベース(無条件) = SP(〜568px)
   min-width: 569px  = 〜960px相当
   min-width: 961px  = 〜1024px相当
   min-width: 1025px = 1025px以上
   ========================================================= */

/* 元コードで568px以下のブロック以外に対応する記述が存在しない
   プロパティのため、値を推測せず元のmax-widthスコープのまま維持する */
@media screen and (max-width: 568px) {
  #intro .intro_box .half_box .photo {
    margin-bottom: 20px;
  }
  #intro .intro_box .half_box .ttl {
    margin-bottom: 10px;
  }
}

#intro .intro_box .half_box .ttl {
  font-size: 21px;
}

#voice_content .ttl_section_top {
  margin-bottom: 24px;
}

.voice_card_list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.voice_card {
  padding: 24px 20px 28px;
  text-align: center;
}

.voice_card__icon {
  width: 100px;
  height: 100px;
  margin: 0 auto 16px;
  border-radius: 50%;
  overflow: hidden;
  background: #eaf5ff;
}

.voice_card__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.voice_card__ttl {
  color: var(--site-keycolor);
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 8px;
}

.voice_card__text p:not(.voice_card__name) {
  line-height: 1.85;
}

.voice_card__name {
  font-size: 13px;
  margin-top: 10px;
}

@media screen and (min-width: 569px) {
  #intro .intro_box .half_box .ttl {
    font-size: 23px;
  }

  .voice_card {
    display: flex;
    align-items: flex-start;
    text-align: left;
    padding: 30px 35px;
  }

  .voice_card__icon {
    flex: 0 0 100px;
    margin: 0 30px 0 0;
  }

  .voice_card__text {
    flex: 1;
  }

  .voice_card__ttl {
    font-size: 20px;
  }

  .voice_card__name {
    text-align: right;
  }
}

@media screen and (min-width: 961px) {
  #intro .intro_box .half_box .ttl {
    font-size: 28px;
  }

  .voice_card {
    padding: 40px 45px;
  }

  .voice_card__icon {
    flex-basis: 130px;
    width: 130px;
    height: 130px;
    margin-right: 40px;
  }

  .voice_card__ttl {
    font-size: 24px;
  }

  .voice_card__name {
    font-size: 14px;
  }
}

@media screen and (min-width: 1025px) {
  #intro .intro_box .half_box .ttl {
    font-size: 32px;
  }
}