/* QA-95: タイトルアイコン — スマホのみ正円（style.css の width:60px + img 100% で卵形になるのを上書き） */

@media screen and (max-width: 640px) {
  .l-main-head .p-head_icon {
    box-sizing: border-box;
    width: 70px;
    height: 70px;
    padding: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .l-main-head .p-head_icon img {
    width: 46px;
    height: 46px;
    max-width: none;
    object-fit: contain;
    object-position: center;
  }

  .l-main-head .p-head-name {
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* QA-96: 相談を予約する — ボタン縦横を従来の60%、文言を縮小（PC/SP） */

.consul a.consul-btn,
.consul .consul-btn {
  box-sizing: border-box;
  width: 56.4%;
  height: 48px;
}

.consul .consul-reserve {
  font-size: 15px;
  line-height: 1.3;
  padding: 6px 12px;
}

@media screen and (max-width: 640px) {
  .consul a.consul-btn,
  .consul .consul-btn {
    width: 70%;
    height: 50px;
    min-height: 40px;
  }

  .consul .consul-reserve {
    font-size: 18px;
  }
}

/* QA-101: 医師経歴 — 年と同じ行から説明開始、折り返しは説明文の左位置に揃える */

.p-doctor__body-item .p-voice-single_info-blk_data-descriptions .p-career-line,
.p-examples-doctor .p-voice-single_info-blk_data-descriptions .p-career-line {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin: 0 0 0.35em;
  line-height: 1.75;
}

.p-doctor__body-item .p-voice-single_info-blk_data-descriptions .p-career-line:last-child,
.p-examples-doctor .p-voice-single_info-blk_data-descriptions .p-career-line:last-child {
  margin-bottom: 0;
}

.p-doctor__body-item .p-voice-single_info-blk_data-descriptions .p-career-line__year,
.p-examples-doctor .p-voice-single_info-blk_data-descriptions .p-career-line__year {
  flex-shrink: 0;
}

.p-doctor__body-item .p-voice-single_info-blk_data-descriptions .p-career-line__text,
.p-examples-doctor .p-voice-single_info-blk_data-descriptions .p-career-line__text {
  flex: 1;
  min-width: 0;
  background-color: transparent;
  border-radius: 0;
  padding: 0;
  margin-right: 0;
  font-size: inherit;
  line-height: inherit;
}

/* QA-97: スマホ — 丸・アイコン、帯は左だけ少し伸ばす（文字位置は padding で維持）。PC 変更なし */

@media screen and (max-width: 640px) {
  .p-section__detail--area .p-subhead_img {
    position: relative;
    z-index: 2;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    margin-left: -6px;
  }

  .p-section__detail--area .p-subhead_img img {
    width: 40px;
    height: 40px;
  }

  /* style.css: margin-left -14px / padding 左右 20px → 左に 8px 伸ばし、padding-left +8px で文字位置固定 */
  .p-section__detail--area .p-subhead__area {
    margin-left: -22px;
    padding-left: 28px;
  }
}

/* QA-98: 各部の余白（画像の有無・並びでブレないように） */

.l-section {
  padding-top: 40px;
}

.l-section > .l-section__text,
.l-section > .l-section__supplement,
.l-section .l-section__detail.p-section__detail {
  padding-top: 20px;
}

.l-section__detail:nth-child(n + 2) {
  padding-top: 20px;
}

.l-section.p-section > article + article {
  margin-top: 20px;
}

.l-section__detail.p-section__detail {
  gap: 20px;
}

.l-section__supplement {
  margin-top: 0;
}

@media screen and (max-width: 640px) {
  /*
   * 画像位置: HTMLが「画像→テキスト」なら reverse でテキストを上に（1-1 など）。
   * 「テキスト→画像」なら column のまま（1-2 など）。nth-child 奇偶では揃えない。
   */
  .l-section__detail.p-section__detail:has(> .p-section__detail--img:first-child) {
    flex-direction: column-reverse;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
  }

  .l-section__detail.p-section__detail:has(> .p-section__detail--area:first-child) {
    flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
  }

  .l-section__detail.p-section__detail .p-section__detail--img {
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .l-section__detail.p-section__detail .p-section__detail--area {
    width: 100%;
  }

  .l-section__detail .p-section__detail--area__content,
  .l-section__detail .p-section__detail--area__content-text {
    padding-top: 20px;
  }

  .l-section > .l-section__text.p-notes-with-img {
    margin-bottom: 0;
  }
}

/* 3-2 は小見出しが無く、本文ラッパーの padding-top が見出し直下に乗る */
#sectionOftenParent + .js-accordion_cnt > .p-section__detail--area__content-text {
  padding-top: 0;
}

/* QA-99: 子育てコラム紹介 — カード＋「記事を読む」でリンクと分かるように */
#sectionColumn .p-column__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid #f3c2d4;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  color: #333;
  text-decoration: none;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

#sectionColumn .p-column__card:hover,
#sectionColumn .p-column__card:focus-visible {
  box-shadow: 0 4px 14px rgba(247, 119, 149, 0.28);
  transform: translateY(-1px);
  color: #333;
  text-decoration: none;
}

#sectionColumn .p-column__card .p-column__thumb {
  flex-shrink: 0;
  height: auto;
  background: #f8f8f8;
}

#sectionColumn .p-column__card .p-column__thumb img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  display: block;
}

#sectionColumn .p-column__card .p-column__title {
  flex: 1 1 auto;
  margin: 0;
  padding: 10px 12px 0;
}

#sectionColumn .p-column__card::after {
  content: "記事を読む";
  display: block;
  margin: 12px 12px 14px;
  padding: 9px 12px;
  text-align: center;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.3;
  color: #fff;
  background-color: #ff5cb0;
  border-radius: 6px;
}

@media screen and (max-width: 640px) {
  #sectionColumn .p-column__card .p-column__thumb img {
    height: 180px;
  }
}

/* QA-102: 相談科一覧タイトル下の装飾線・タイトルと線の間 */
.p-topBody .p-subject .p-departments_title {
  padding-bottom: 15px;
}

.p-topBody .p-subject_section-head:empty::before,
.p-topBody .p-subject_section-head:empty::after {
  height: 6px;
  align-self: center;
}

/* QA-100: 医師見出し — 帯の上下余白、上の空きを他見出しに合わせる */
.p-cd-cta {
  padding-bottom: 0;
}

#sectionDoctors {
  margin-top: 40px;
}

#sectionDoctors .l-doctor__area {
  padding-top: 0;
}

@media screen and (max-width: 640px) {
  #sectionDoctors .p-doctor__head--text {
    height: auto;
    padding-top: 3px;
    padding-bottom: 2px;
  }
}

#sectionDoctors .p-doctor__head-icon {
  width: 80px;
  height: 80px;
}
#sectionDoctors .p-doctor__head-icon img {
  width: 50px;
  height: 50px;
}