@charset "utf-8";
/* =====================================================================
 * stemcell.css — 주요시술 · 무릎줄기세포주사 서브페이지
 *  신경성형술과 동일 구조 · 콘텐츠 폭 1364 · 상단소개(이미지+텍스트+3미니스텝)
 *  / 증상체크(풀블리드 배경) / 진행 4스텝 카드 / FAQ 아코디언(배타 open)
 * ===================================================================== */
/* 이 페이지 한정 컨테이너 상단 여백(다른 페이지 영향 없음 — 본 CSS는 /stemcell에서만 로드) */
body #wrapper.ive #container_wr { padding-top: 100px; }

.neuro-page { font-family: var(--ive-font-family); color: #111; max-width: 1364px; margin-inline: auto; }

/* ============ 1 · 상단 소개 ============ */
.neuro-intro { display: flex; flex-direction: column; gap: 60px; }
.neuro-intro__top { display: flex; gap: 80px; align-items: center; }
.neuro-intro__photo { flex: 0 0 580px; width: 580px; height: 468px; border-radius: 20px; overflow: hidden; background: #d9d9d9; }
.neuro-intro__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.neuro-intro__lead { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 30px; }
.neuro-intro__title { margin: 0; }
.neuro-intro__eng { display: block; font-size: 17px; font-weight: 400; line-height: 1.06; color: #2d4557; }
.neuro-intro__ko { display: block; margin-top: 16px; font-size: 45px; font-weight: 700; line-height: 1.3; letter-spacing: -0.84px; color: #111; }
.neuro-intro__desc { }
.neuro-intro__sub { margin: 0; font-size: 24px; font-weight: 600; line-height: 1.5; letter-spacing: -0.36px; color: #111; word-break: keep-all; }
.neuro-intro__body { margin: 27px 0 0; font-size: 18px; font-weight: 400; line-height: 1.5; letter-spacing: -0.36px; color: #111; word-break: keep-all; }

.neuro-intro__steps { display: flex; gap: 24px; padding: 40px 0; border-top: 1px solid #ccc; }
.neuro-mini { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 30px; }
.neuro-mini__num { width: 60px; height: 60px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid #ccc; border-radius: 17px; font-size: 20px; font-weight: 300; line-height: 1.3; letter-spacing: -0.4px; color: #2d4557; }
.neuro-mini__txt { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.neuro-mini__t { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: -0.36px; color: #2d4557; word-break: keep-all; }
.neuro-mini__d { margin: 0; font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.36px; color: #333; word-break: keep-all; }

/* ============ 2 · 증상 체크(풀블리드 밝은 배경 이미지) ============ */
.neuro-check { margin-top: 160px; width: 100vw; margin-left: calc(50% - 50vw); padding: 140px 20px; background: url("../img/ive/stemcell/check-bg.png") center center / cover no-repeat; }
.neuro-check__inner { max-width: 1364px; margin-inline: auto; display: flex; flex-direction: column; align-items: center; gap: 40px; }
.neuro-check__title { margin: 0; text-align: center; }
.neuro-check__eyebrow { display: block; font-size: 18px; font-weight: 600; line-height: 1.3; color: #2d4557; }
.neuro-check__main { display: block; margin-top: 16px; font-size: 35px; font-weight: 600; line-height: 1.3; letter-spacing: -0.84px; color: #111; word-break: keep-all; }
.neuro-check__list { list-style: none; margin: 0; padding: 0; width: 684px; max-width: 100%; display: flex; flex-direction: column; gap: 12px; }
.neuro-check__item { display: flex; align-items: center; gap: 16px; padding: 12px 20px 12px 25px; background: rgba(255, 255, 255, 0.1); border: 2px solid #fff; border-radius: 50px; }
.neuro-check__ico { flex: 0 0 auto; display: block; width: 30px; height: 30px; }
.neuro-check__txt { font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.36px; color: #111; word-break: keep-all; }
.neuro-check__note { margin: 0; text-align: center; font-size: 16px; font-weight: 400; line-height: 1.5; letter-spacing: -0.32px; color: #333; word-break: keep-all; }

/* ============ 3 · 진행 4스텝 카드 ============ */
.neuro-steps { margin-top: 180px; display: flex; flex-direction: column; align-items: center; gap: 40px; }
.neuro-steps__title { margin: 0; text-align: center; font-size: 35px; font-weight: 600; line-height: 1.3; letter-spacing: -0.7px; color: #111; word-break: keep-all; }
.neuro-steps__row { display: flex; align-items: flex-start; gap: 33px; width: 100%; }
.neuro-card { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; }
.neuro-card__photo { height: 242px; border-radius: 15px; overflow: hidden; background: #d9d9d9; }
.neuro-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.neuro-card__txt { padding: 30px 0; display: flex; flex-direction: column; gap: 12px; }
.neuro-card__step { margin: 0; font-size: 25px; font-weight: 200; line-height: 1.3; letter-spacing: -0.5px; color: #2d4557; }
.neuro-card__t { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.3; letter-spacing: -0.4px; color: #111; }
.neuro-card__d { margin: 0; font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.36px; color: #333; word-break: keep-all; }

/* ============ 4 · FAQ 아코디언(배타 open · 닫힘 #f5f5f5 / 열림 #2d4557) ============ */
.neuro-faq { margin-top: 180px; display: flex; flex-direction: column; align-items: center; gap: 40px; }
.neuro-faq__title { margin: 0; text-align: center; font-size: 35px; font-weight: 600; line-height: 1.3; letter-spacing: -0.7px; color: #111; }
.neuro-faq__list { width: 100%; }
.neuro-faq__item { margin-bottom: 14px; }
.neuro-faq__item:last-child { margin-bottom: 0; }
.neuro-faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 20px 40px; background: #f5f5f5; color: #222; border: 0; border-radius: 10px; cursor: pointer; text-align: left; font-family: inherit; transition: background-color .3s var(--ive-ease, ease), color .3s var(--ive-ease, ease); }
.neuro-faq__item.is-open .neuro-faq__q { background: #2d4557; color: #fff; }
.neuro-faq__qtext { flex: 1 1 0; min-width: 0; font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -0.4px; }
.neuro-faq__arrow { flex: 0 0 auto; width: 24px; height: 12px; display: flex; align-items: center; justify-content: center; }
.neuro-faq__arrow::before { content: ""; display: block; width: 7.7px; height: 14px; background-color: #333; -webkit-mask: url("../img/ive/stemcell/arrow.svg") center / contain no-repeat; mask: url("../img/ive/stemcell/arrow.svg") center / contain no-repeat; transform: rotate(-90deg); transition: transform .3s var(--ive-ease, ease), background-color .3s var(--ive-ease, ease); }
.neuro-faq__item.is-open .neuro-faq__arrow::before { background-color: #fff; transform: rotate(90deg); }
.neuro-faq__a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.neuro-faq__a-inner { display: flex; align-items: flex-start; gap: 16px; padding: 30px 40px; border-bottom: 1px solid #2d4557; }
.neuro-faq__a-mark { flex: 0 0 auto; font-size: 18px; font-weight: 500; line-height: 1.3; color: #888; }
.neuro-faq__a-text { font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.36px; color: #333; word-break: keep-all; }

/* ============ 반응형 (프로젝트 breakpoint 1024 / 768) ============ */
@media (max-width: 1024px) {
    body #wrapper.ive #container_wr { padding-top: 60px; }
    .neuro-intro__top { gap: 40px; }
    .neuro-intro__photo { flex-basis: 42%; width: 42%; height: auto; aspect-ratio: 580 / 468; }
    .neuro-intro__ko { font-size: 36px; }
    .neuro-intro__sub { font-size: 21px; }
    .neuro-intro__body { font-size: 16px; }
    .neuro-intro__body br, .neuro-intro__sub br { display: none; }
    .neuro-mini__d br { display: none; }
    .neuro-check { margin-top: 120px; padding: 100px 20px; }
    .neuro-check__main { font-size: 28px; }
    .neuro-steps { margin-top: 130px; }
    .neuro-steps__title, .neuro-faq__title { font-size: 28px; }
    .neuro-steps__row { flex-wrap: wrap; gap: 24px; }
    .neuro-card { flex: 1 1 calc(50% - 12px); }
    .neuro-card__d br { display: none; }
    .neuro-faq { margin-top: 130px; }
    .neuro-faq__q { padding: 18px 24px; }
    .neuro-faq__qtext { font-size: 18px; }
    .neuro-faq__a-inner { padding: 24px; }
}
@media (max-width: 768px) {
    body #wrapper.ive #container_wr { padding-top: 30px; }
    .neuro-intro { gap: 40px; }
    .neuro-intro__top { flex-direction: column; align-items: stretch; gap: 24px; }
    .neuro-intro__photo { flex-basis: auto; width: 100%; }
    .neuro-intro__ko { font-size: 28px; margin-top: 12px; }
    .neuro-intro__sub { font-size: 18px; }
    .neuro-intro__body { font-size: 15px; margin-top: 20px; }
    .neuro-intro__steps { flex-direction: column; gap: 30px; padding: 30px 0; }
    .neuro-mini { flex-direction: row; gap: 18px; align-items: center; text-align: left; }
    .neuro-mini__txt { align-items: flex-start; text-align: left; }
    .neuro-mini__num { width: 50px; height: 50px; font-size: 18px; border-radius: 14px; }
    .neuro-check { margin-top: 90px; padding: 60px 18px; }
    .neuro-check__eyebrow { font-size: 15px; }
    .neuro-check__main { font-size: 21px; margin-top: 12px; }
    .neuro-check__main br { display: none; }
    .neuro-check__item { padding: 12px 16px; gap: 12px; }
    .neuro-check__txt { font-size: 15px; }
    .neuro-steps { margin-top: 90px; gap: 28px; }
    .neuro-steps__title, .neuro-faq__title { font-size: 22px; }
    .neuro-steps__row { flex-direction: column; gap: 24px; }
    .neuro-card { flex: none; width: 100%; flex-direction: row; gap: 18px; align-items: center; }
    .neuro-card__photo { flex: 0 0 44%; height: auto; aspect-ratio: 316 / 242; }
    .neuro-card__txt { flex: 1 1 0; min-width: 0; padding: 0; }
    .neuro-card__step { font-size: 20px; }
    .neuro-card__t { font-size: 18px; }
    .neuro-card__d { font-size: 15px; }
    .neuro-card__d br { display: none; }
    .neuro-faq { margin-top: 70px; gap: 28px; }
    .neuro-faq__q { padding: 16px 18px; }
    .neuro-faq__qtext { font-size: 16px; }
    .neuro-faq__a-inner { padding: 20px 18px; gap: 10px; }
    .neuro-faq__a-mark, .neuro-faq__a-text { font-size: 15px; }
    .neuro-faq__a-text br { display: none; }
}