@charset "UTF-8";

/* ========== 07 FAQ（よくあるご質問）section ==========
   Figma SP node 4324:1050 (352 x 1263 / 内側コンテンツ350px)
   基準幅440px（1rem=10px）。Figma値×440/390 → rem。 */

.vc {
  width: 100%;
  background-color: #fff;
}

.vc-inner {
  display: flex;
  flex-direction: column;
  gap: 3.385rem;
  align-items: center;
  width: 39.5rem;
  margin: 0 auto;
}

/* ---------- heading ---------- */
.vc-heading {
  display: flex;
  flex-direction: column;
  gap: 1.128rem;
  align-items: center;
  height: 10.83rem;
  text-align: center;
}

.vc-heading-en {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-size: 4.513rem;
  line-height: 1.2;
  color: rgba(24, 55, 104, 0.12);
  text-transform: uppercase;
}

.vc-heading-ja {
  font-family: "Shippori Mincho", serif;
  font-weight: 700;
  font-size: 3.61rem;
  line-height: 1.2;
  letter-spacing: -0.1444rem;
  color: #183768;
}

.vc-ja-tight {
  letter-spacing: -0.1805rem;
}

.vc-ja-mid {
  letter-spacing: -0.1083rem;
}

/* ---------- FAQ list ---------- */
.vc-list {
  display: flex;
  flex-direction: column;
  gap: 2.256rem;
  width: 100%;
}

.vc-item {
  display: flex;
  flex-direction: column;
  gap: 1.467rem;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1.692rem 2.031rem;
  background-color: #fff;
  border: 0.1rem solid #ddd;
}

.vc-q {
  display: flex;
  gap: 1.128rem;
  align-items: center;
  width: 100%;
}

.vc-q-mark,
.vc-a-mark {
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 2.482rem;
  text-align: center;
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-size: 2.933rem;
  line-height: 1.4;
  letter-spacing: 0.029rem;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

.vc-q-mark {
  height: 2.482rem;
  color: #9b2338;
}

.vc-q-text {
  flex: 1;
  min-width: 0.1rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  font-size: 1.805rem;
  line-height: 1.4;
  color: #183768;
}

.vc-divider {
  width: 100%;
  height: 0.1rem;
}

.vc-a {
  display: flex;
  gap: 1.128rem;
  align-items: flex-start;
  width: 100%;
}

.vc-a-mark {
  height: 2.933rem;
  color: #183768;
}

.vc-a-text {
  flex: 1;
  min-width: 0.1rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 1.805rem;
  line-height: 1.6;
  color: #183768;
}
