@charset "UTF-8";
/* 공진단 전용 — 공통은 ../../../common/css/common.css · sub.css (사진 단계 · 서류 이미지 · 가격 카드 · 비대면 안내 박스 = sub.css 9 · 11 · 17)
   섹션별로 다른 값은 새 클래스 대신 변수만 덮어씀 */

/* 원내 제조 과정 : 사진 단계 4칸 (공통 .pstep 는 5칸 기준) · 아래 안내(가운데) */
/* 10-13 : 회색 · 흰색만 번갈아 쓰던 것을 이 섹션만 배경 이미지로 (한지 · 식물 그림자) */
.make{background:#F6F4EF url(../../../../images/pages/treatment/tonic/gongjindan/make-bg.jpg) center top/cover no-repeat}
@media (min-width:1000px){
  .make .pstep{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.make .notice{margin-top:32px;text-align:center}

/* 원료 확인 : 왼쪽 설명 · 오른쪽 서류 3장 (세로 가운데) */
.quality .split{align-items:center}
/* 10-13 : 딥그린 배경 — 흰 서류가 떠 보이도록. 카드는 흰색이라 글자색은 되돌림 */
.quality .certs figure{border-color:transparent}
.quality .certs figcaption{color:var(--ink);text-align:center}
.quality .certs figcaption small{color:var(--muted)}
/* 10-13 : 공통 .certs 는 3/4 칸에 object-fit:cover 라 서류 아래가 잘렸음.
          서류는 잘리면 안 되므로 원본 비율(2:3)에 맞추고 contain 으로 전체를 보여줌 */
.quality .certs img{aspect-ratio:2/3;object-fit:contain;background:#fff}
@media (max-width:690px){
  .quality .certs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}   /* 공통은 690 이하 1열 → 서류가 너무 커져 3열 유지 */
  .quality .certs figure{padding:8px 8px 10px}
  .quality .certs figcaption{font-size:12.5px}
  .quality .certs figcaption small{font-size:11.5px}
}

/* 공진단 종류 : 카드 아래 비급여 안내 (가운데) */
/* 10-13 : 카드를 보약 클리닉 형식으로 바꾸면서 배경도 같은 크림 그라데이션으로 (회색은 금색 카드와 안 어울림) */
.types{background:linear-gradient(180deg,#FDFAF4 0%,#FDFAF4 30%,#F4ECDF 100%)}
.types .notice{margin-top:32px;text-align:center}

/* 10-13 : 종류 카드를 보약 클리닉 「처방 안내」와 같은 형식으로 — 한자 워터마크 · 금색 윗선 · 번호 붙인 베이지 항목
   price-card 는 경옥고 등도 쓰므로 이 섹션에서만 덮어씀 */
.types .price-card{position:relative;overflow:hidden;isolation:isolate;padding:44px 36px 34px;border-color:#E9E2D6;border-radius:18px;box-shadow:0 18px 40px rgba(120,95,50,.06);text-align:left;transition:translate .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease)}
html.js-anim .types .price-card.rv{transition:opacity 1.1s var(--ease),transform 1.1s var(--ease),translate .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease)}
.types .price-card::before{content:"";position:absolute;left:36px;right:36px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--gold)}
.types .price-card .hj{position:absolute;z-index:-1;right:-6px;top:-18px;font-family:var(--kserif);font-size:190px;line-height:1;color:var(--gold);opacity:.08;transition:opacity .6s var(--ease),transform .8s var(--ease)}
.types .price-card h3{margin-top:14px;font-family:var(--kserif);font-size:32px;font-weight:500;letter-spacing:-.03em}
.types .price-card > p{font-size:15.5px}
.types .price-card ul{margin-top:28px;border-top:0;display:grid;gap:10px}
.types .price-card li{display:flex;align-items:center;gap:14px;padding:15px 18px;border:0;border-radius:12px;background:#F8F4ED}
.types .price-card li > i{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid #D9C7A2;font-family:var(--lat);font-style:normal;font-size:11.5px;font-weight:500;letter-spacing:0;color:var(--gold)}
.types .price-card:hover{translate:0 -6px;border-color:#D9C7A2;box-shadow:0 26px 50px rgba(120,95,50,.12)}
.types .price-card:hover .hj{opacity:.14;transform:scale(1.05)}
@media (max-width:999px){
  .types .price-card{padding:30px 22px 22px}
  .types .price-card::before{left:22px;right:22px}
  .types .price-card .hj{font-size:140px}
  .types .price-card h3{font-size:26px}
  .types .price-card li{padding:13px 14px}
}

/* FAQ 설명 안 「보약 클리닉 FAQ」 링크 */
.faq-sec .sec-lead a{color:var(--ink);text-decoration:underline;text-underline-offset:4px}

/* 복용 · 보관 · 선물 안내 : 카드 3장 아래 안내 (가운데) */
.care .notice{margin-top:32px}
/* 10-13 : 설명 길이가 달라 태그가 제각각 높이에 서고 카드마다 아래 여백이 들쭉날쭉이라, 태그를 바닥에 붙임 */
.care .card{display:flex;flex-direction:column}
.care .card .tags{margin-top:auto;padding-top:18px}

/* 10-16 : 복용 안내 일러스트 — 이 섹션은 3칸이라 카드가 넓어 첩약(4칸)보다 그림이 커 보임.
   그림만 같은 크기로 줄이고 둘레는 일러스트 배경색으로 이어 붙임 */
@media (min-width:1000px){
  #care .card--photo .ph{background:#FBF8F2;display:grid;place-items:center;padding:18px 0}
  #care .card--photo .ph img{width:73.5%;height:auto}
}

/* ===== 엘리멘터 max-width · margin · flex 보정 (tools/sync_theme.py 자동 생성 · 직접 고치지 말 것) ===== */
.elementor.elementor.elementor.elementor .make .notice{margin-top:32px}
.elementor.elementor.elementor.elementor .quality .split{align-items:center}
.elementor.elementor.elementor.elementor .types .notice{margin-top:32px}
.elementor.elementor.elementor.elementor .types .price-card h3{margin-top:14px}
.elementor.elementor.elementor.elementor .types .price-card ul{margin-top:28px}
.elementor.elementor.elementor.elementor .types .price-card li{align-items:center}
.elementor.elementor.elementor.elementor .types .price-card li > i{flex:none}
.elementor.elementor.elementor.elementor .care .notice{margin-top:32px}
.elementor.elementor.elementor.elementor .care .card{flex-direction:column}
.elementor.elementor.elementor.elementor .care .card .tags{margin-top:auto}

/* 엘리멘터 배경 보정 (자동 생성 · 배경 그림만 되살림) */
.elementor.elementor.elementor.elementor.elementor charset "UTF-8";
 

 
 
.make{background-image:url(../../../../images/pages/treatment/tonic/gongjindan/make-bg.jpg) !important}
.elementor.elementor.elementor.elementor.elementor .types{background-image:linear-gradient(180deg,#FDFAF4 0%,#FDFAF4 30%,#F4ECDF 100%) !important}
