@charset "utf-8";
/* ----------------------------------------------------------------------------
 * 調査までの流れ（/investigation-flow/）
 * テンプレート「MILAE 静的デザイン」が、このページでだけ読み込む。
 * 冒頭の要約・問い合わせの導線などは調査種別のページと同じ部品（p-inv-*）を使う。
 * 流れの一覧はトップと同じ部品（style.css の p-home-flow-list）。
 * -------------------------------------------------------------------------- */
@import url("section-investigation.css");

/* 各ステップの詳しい説明 */
.p-flow-step {
  background: #FFF;
  border-radius: 24px;
  box-shadow: 10px 10px 30px rgba(197, 213, 183, .3);
  padding: 36px 40px;
  scroll-margin-top: 90px;
}
.p-flow-step + .p-flow-step {
  margin-top: 28px;
}
.p-flow-step__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.p-flow-step__num {
  font-family: var(--font-en);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  color: #FFF;
  background: var(--inv-green);
  border-radius: 30px;
  padding: 6px 14px;
  white-space: nowrap;
}
.p-flow-step__ttl {
  font-size: 24px;
  font-weight: bold;
}
.p-flow-step__body {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
.p-flow-step__img img {
  width: 100%;
  border-radius: 16px;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.p-flow-step__text > * + * {
  margin-top: 1em;
}
.p-flow-step__text p {
  font-size: 16px;
  line-height: 1.9;
}
.p-flow-step__text strong {
  color: var(--inv-green-dark);
}
.p-flow-step__text a {
  color: var(--inv-green-dark);
  text-decoration: underline;
}
.p-flow-step__list {
  background: var(--inv-bg);
  border-radius: 12px;
  padding: 14px 18px 14px 2.4em;
  font-size: 15px;
  line-height: 1.8;
}
.p-flow-step__list,
.p-flow-step__list li {
  list-style: disc outside;
}
.p-flow-step__quote {
  border-left: 4px solid var(--inv-green);
  background: var(--inv-bg);
  padding: 14px 18px;
  font-size: 15px;
  line-height: 1.8;
}
.p-flow-step__quote cite {
  display: block;
  margin-top: 6px;
  font-size: 13px;
  font-style: normal;
  color: var(--inv-sub);
}
@media screen and (max-width: 767px) {
  .p-flow-step { padding: 22px 18px; border-radius: 18px; }
  .p-flow-step__head { gap: 10px; margin-bottom: 14px; }
  .p-flow-step__ttl { font-size: 19px; }
  .p-flow-step__body { grid-template-columns: 1fr; gap: 16px; }
  .p-flow-step__text p { font-size: 15px; }
}

/* 流れの一覧（トップの部品）の各項目から、詳しい説明へ飛ぶリンク */
.p-flow-overview .p-home-flow-list__item {
  padding-top: 1.6rem;
  padding-bottom: 1.6rem;
}
.p-flow-overview .p-home-flow-list__img img {
  width: 90px;
}
.p-flow-overview a.p-flow-overview__more,
.p-flow-overview a.p-flow-overview__more:link,
.p-flow-overview a.p-flow-overview__more:visited {
  display: inline-block;
  margin-top: .6em;
  font-size: 14px;
  color: var(--inv-green-dark);
  text-decoration: underline;
}
.p-flow-overview .p-home-flow-list__img img.-round {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
}