/* 원인별 8개 페이지가 공유하는 구성. 본문 크기는 공통 타이포 토큰을 따른다. */
.jik-sub--cause { --sub-tint:#f4eff0; --sub-accent-dark:#70994e; color:#5f5651; word-break:keep-all; overflow-wrap:break-word; }
.jik-sub--cause .jik-container { max-width:1284px; padding-inline:24px; }
.jik-sub--cause h3 { font-size:var(--jik-type-item); line-height:1.4; }
.jik-sub--cause h4 { font-size:var(--jik-type-subtitle); }
.jik-sub--cause img { display:block; }
.cause-intro { padding-top:64px; padding-bottom:48px; text-align:center; }
.cause-intro h1 { font-size:var(--jik-type-page-title); line-height:1.2; font-weight:900; color:#302a29; letter-spacing:-.06em; }
.cause-intro p { font-size:var(--jik-type-page-lead); margin-top:12px; color:#847e7a; }
.cause-banner { background:#504543; color:#fffce2; }
.cause-banner--1 { position:relative; isolation:isolate; background:none; min-height:461px; }
.cause-banner--1::before { content:''; position:absolute; z-index:-1; inset:32px 0 0; background:url('../img/page/cause/banner-1-strip.webp') top center/100% 100% no-repeat; }
.cause-banner.cause-banner--1 > div { display:flex; align-items:center; position:relative; width:1470px; max-width:100%; min-height:461px; padding:32px 0 0; }
.cause-banner.cause-banner--1 img { position:absolute; left:0; bottom:0; width:auto; height:461px; max-width:none; }
.cause-banner.cause-banner--1 > div > div { flex:1; padding:0 0 0 500px; }
.cause-banner.cause-banner--1 .cause-banner-lists { grid-template-columns:440px 1fr; gap:6px 24px; padding:20px 0 0; }
.cause-banner.cause-banner--1 ul { gap:6px; }
.cause-banner > div { display:grid; grid-template-columns:32% 1fr; align-items:center; gap:28px; }
.cause-banner img { width:100%; }
.cause-banner h2 { font-size:var(--jik-type-section-sub); line-height:1.45; }
.cause-banner h2 span { font-weight:400; }
.cause-banner-lists { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:8px 22px; padding:22px 0; color:#fff; }
.cause-banner ul { display:grid; gap:8px; margin:0; padding:0; }
.cause-banner li { position:relative; padding-left:18px; }
.cause-banner li::before { content:'•'; position:absolute; left:0; top:0; }
/* 구내염 배너: 원본의 어두운 띠와 인물은 글자 없는 배경, 문구는 HTML. */
.cause-banner--8 { background:#504543 url('../img/page/cause/stomatitis-banner-clean.webp') center top/cover no-repeat; }
.cause-banner.cause-banner--8 > .jik-container { display:flex; min-height:332px; align-items:center; padding-block:40px; }
.cause-banner--8 > .jik-container > div { width:100%; padding-left:490px; }
.cause-banner--8 .cause-banner-lists { padding-bottom:0; }
@media(max-width:1100px) {
 .cause-banner--8 { background-position:calc(50% + 130px) top; }
 .cause-banner--8 > .jik-container > div { padding-left:42%; }
}
@media(max-width:767px) {
 .cause-banner--8 { background-position:calc(50% + 335px) top; background-size:auto 258px; }
 .cause-banner.cause-banner--8 > .jik-container { display:block; min-height:0; padding:258px 0 0; }
 .cause-banner--8 > .jik-container > div { padding:24px 22px; }
}
.jik-sub--cause p { line-height:1.6; }
.cause-lead { text-align:center; font-weight:600; color:#70994e; font-size:var(--jik-type-emphasis); margin:20px 0 14px; }
.cause-lead span { display:block; font-weight:400; }
#cause-origin .cause-lead span:last-child,#cause-method .cause-lead span:last-child { font-weight:800; }
.cause-center { text-align:center; }
.cause-flow { display:flex; flex-wrap:wrap; justify-content:center; align-items:stretch; gap:20px; margin:44px 0 60px; }
.cause-flow li { flex:1 1 180px; max-width:350px; border:3px solid #789e55; border-radius:28px; padding:24px 18px; display:grid; align-content:center; text-align:center; line-height:1.7; }
.cause-flow li:last-child { background:#70994e; color:#fff; }
.cause-flow img { width:160px; height:120px; object-fit:contain; margin:0 auto 15px; border-radius:15px; }
/* 구내염 원인: 원본의 외부 요인 → 구강·심 기능 문제 → 입냄새 흐름. */
.jik-sub--stomatitis .cause-stomatitis-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:60px; max-width:1028px; margin:44px auto 60px; }
.jik-sub--stomatitis .cause-stomatitis-flow__circle { position:relative; aspect-ratio:1; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:20px; border:4px solid #789e55; border-radius:50%; text-align:center; }
.jik-sub--stomatitis .cause-stomatitis-flow__circle:not(:last-child)::after { content:''; position:absolute; left:calc(100% + 19px); top:50%; width:20px; height:20px; border-top:2px solid #554c47; border-right:2px solid #554c47; transform:translateY(-50%) rotate(45deg); }
.jik-sub--stomatitis .cause-stomatitis-flow h3 { margin:0 0 8px; color:#70994e; font-size:var(--jik-type-subtitle); font-weight:800; }
.jik-sub--stomatitis .cause-stomatitis-flow p { margin:0; font-size:var(--jik-type-body); line-height:1.6; }
.jik-sub--stomatitis .cause-stomatitis-flow__problems > div + div { width:100%; margin-top:14px; padding-top:14px; border-top:1px solid #789e55; }
.jik-sub--stomatitis .cause-stomatitis-flow__result { border:0; background:linear-gradient(#0c1a1799,#0c1a1799),url('../img/page/cause/stomatitis-step-detail-2.webp') right center/cover; color:#fff; }
.jik-sub--stomatitis .cause-stomatitis-flow__result h3 { margin:8px 0 0; color:#fff; font-family:var(--jik-font-serif); font-size:var(--jik-type-item); }
@media(max-width:767px) {
 .jik-sub--stomatitis .cause-stomatitis-flow { grid-template-columns:minmax(0,1fr); max-width:300px; gap:52px; margin:30px auto 50px; }
 .jik-sub--stomatitis .cause-stomatitis-flow__circle:not(:last-child)::after { left:50%; top:calc(100% + 16px); transform:translateX(-50%) rotate(135deg); }
}
.jik-sub--cause .jik-sub-prose { max-width:660px; margin:0 auto; }
.jik-sub--cause .jik-sub-heading h2 { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; }
.jik-sub--cause .jik-sub-heading h2::before,.jik-sub--cause .jik-sub-heading h2::after { content:''; height:1px; background:#ded9d6; }
#cause-research .jik-sub-heading h2 { display:block; }
.jik-sub.jik-sub--cause #cause-process .jik-sub-heading > span { color:#70994e; font-weight:800; }
.cause-origin-visual { display:grid; grid-template-columns:266px minmax(0,1fr) 266px; align-items:start; gap:54px; max-width:1120px; margin:42px auto 0; }
.cause-origin-visual > img,.cause-origin-visual > picture { width:100%; max-width:430px; margin-inline:auto; align-self:center; }
.cause-origin-visual > picture img { display:block; width:100%; height:auto; }
.cause-origin-card { border-radius:22px; overflow:hidden; background:#f1f0ee; text-align:center; }
.cause-origin-shot { position:relative; margin:0; }
.cause-origin-shot img { display:block; width:100%; height:auto; }
.cause-origin-shot figcaption { position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-weight:800; font-size:var(--jik-type-subtitle); }
.cause-origin-shot--plain { background:#6f6260; }
.cause-origin-shot--plain figcaption { position:static; padding:26px 12px; }
.cause-origin-shot--expanded figcaption { background:rgb(53 43 39 / 42%); }
.jik-sub--cause .cause-origin-habits { margin:0; padding:22px 16px 0; line-height:24px; }
.cause-origin-plus { display:grid; place-items:center; width:48px; height:48px; margin:7px auto; border-radius:50%; background:#5b5350; color:#fff; font-weight:700; line-height:1; }
.jik-sub--cause .cause-origin-chain { margin:0; padding:0 16px 12px; color:#70994e; font-weight:700; line-height:24px; }
.cause-origin-chain li+li::before { content:'\25BC'; display:block; font-size:7px; line-height:1; margin:2px 0; color:#70994e; }
.cause-origin-result { text-align:center; align-self:center; }
.cause-origin-result img { display:block; width:100%; height:auto; }
.cause-origin-result > div { border-radius:0 0 18px 18px; background:#302725; color:#fffce2; padding:18px 12px 22px; }
.cause-origin-result p { font-size:var(--jik-type-subtitle); }
.cause-origin-result strong { display:block; margin-top:6px; font-size:var(--jik-type-item); font-family:var(--jik-font-serif); font-weight:800; }
.cause-origin-result strong::before { content:'\201C '; }
.cause-origin-result strong::after { content:' \201D'; }
.cause-faq { display:grid; grid-template-columns:1fr 300px; gap:28px; align-items:end; padding:40px 42px 0; background:#f4eff0 url('../img/page/diet-exercise/paper-texture.webp'); }
.cause-faq > div { padding-bottom:40px; }
.cause-faq h2 { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:22px; color:#70994e; font:800 var(--jik-type-section)/1.2 Arial,sans-serif; margin-bottom:26px; }
.cause-faq h2::after { content:''; height:1px; background:#ded9d6; }
.cause-faq h3,.cause-faq > div p { display:grid; grid-template-columns:26px 1fr; align-items:start; gap:12px; }
.cause-faq h3 b,.cause-faq > div p b { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; color:#fff; font:700 14px/1 Arial,sans-serif; }
.cause-faq h3 b { background:#70994e; }
.cause-faq > div p b { background:#3f3431; }
.cause-faq h3 { color:#70994e; font-size:var(--jik-type-faq); font-weight:700; margin:26px 0 14px; }
.jik-sub--cause .cause-faq > div p { color:#5f5651; line-height:26px; }
.cause-faq img { width:100%; }
.cause-faq figure { position:relative; }
.cause-gallery { display:grid; grid-template-columns:repeat(5,1fr); }
.cause-gallery img { width:100%; aspect-ratio:257/190; object-fit:contain; }
.cause-symptoms { display:grid; grid-template-columns:1fr 60px 1fr 60px 1fr; gap:19px; align-items:center; max-width:964px; margin:46px auto 0; text-align:center; }
.cause-symptoms > div { display:grid; grid-template-rows:auto 1fr; align-self:stretch; border-radius:41px; overflow:hidden; background:#f1f0ee; }
.cause-symptoms h3 { background:#3f3431; color:#fff; padding:22px 10px; font-size:var(--jik-type-item); font-weight:800; }
.jik-sub--cause .cause-symptoms ul { display:grid; align-content:center; padding:28px 14px; line-height:24px; color:#554c47; font-weight:700; }
.cause-symptoms > span { position:relative; justify-self:center; align-self:center; height:56px; width:56px; }
.cause-symptoms .cause-plus::before,.cause-symptoms .cause-plus::after { content:''; position:absolute; left:50%; top:50%; background:#3f3431; transform:translate(-50%,-50%); }
.cause-symptoms .cause-plus::before { width:44px; height:2px; }
.cause-symptoms .cause-plus::after { width:2px; height:44px; }
.cause-symptoms .cause-arrow { background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 62'%3E%3Cpath d='M3 3 27 31 3 59' fill='none' stroke='%239a938f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/26px 54px no-repeat; }
.cause-symptoms blockquote { position:relative; margin:0; padding:52px 24px; align-self:stretch; display:grid; align-content:center; border-radius:41px; overflow:hidden; background:linear-gradient(rgba(28,48,16,.42),rgba(28,48,16,.42)),url('../img/page/cause/symptom-quote-bg.webp') center/cover no-repeat,#4e7230; color:#fff; font:600 var(--jik-type-subtitle)/1.4 var(--jik-font-serif); text-shadow:0 1px 2px rgba(0,0,0,.25); }
.cause-symptoms blockquote::before,.cause-symptoms blockquote::after { position:absolute; left:50%; transform:translateX(-50%); font:800 34px/1 Georgia,serif; opacity:.9; }
.cause-symptoms blockquote::before { content:'\201C'; top:18px; }
.cause-symptoms blockquote::after { content:'\201D'; bottom:8px; }
.cause-symptoms blockquote span { display:block; }
.cause-symptoms blockquote span:nth-last-child(-n+2) { color:#e9f5ca; font-size:var(--jik-type-item); font-weight:800; }
.cause-graph { position:relative; container-type:inline-size; margin-top:38px; aspect-ratio:2004/638; background:url('../img/page/cause/process-graph-bg.webp') 0 0/100% 100% no-repeat; }
.cause-graph svg { display:block; width:100%; height:100%; }
.cause-graph-label { position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); color:#3f3431; font-weight:800; font-size:clamp(7px,2cqw,25px); line-height:1; white-space:nowrap; }
.cause-steps,.cause-three,.cause-effects,.cause-pillars,.cause-reasons { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
/* 3단계 표 — 원본(2-x-2.jpg) 구조: 헤더 띠는 초록→청록→하늘 연속 그라데이션 하나에 띠 높이를 가르는 흰 꺾쇠(통합치료 범례와 같은 처리),
   본문 3칸은 세로 1px 구분선. 바깥은 어두운 2px 테두리(상·좌·우), 하단만 연회색. 헤더 높이 --cause-step-head 로 한 곳에서 관리 */
.cause-steps { --cause-step-head:120px; position:relative; margin:0; padding:0; border:2px solid #4b4542; border-bottom:1px solid #ddd5d2; background:linear-gradient(90deg,#6f9852,#4ba38a 51%,#17b3e6 79%) 0 0/100% var(--cause-step-head) no-repeat; }
.cause-graph + .cause-steps { border-top:0; } /* 그래프 SVG 테두리가 바로 위에 붙어 있으므로 겹선 방지 */
.cause-steps > li { position:relative; border:0; }
.cause-steps header { position:relative; display:grid; align-content:center; height:var(--cause-step-head); padding:10px 14px 10px 62px; text-align:center; color:#fff; background:transparent; word-break:keep-all; text-wrap:balance; }
.cause-steps header h3 { line-height:1.25; }
.cause-steps > li:first-child header { padding-left:20px; }
.cause-steps header p { margin:4px 0 0; font-size:var(--jik-type-body); line-height:1.5; }
.cause-steps > li + li header::before { content:''; position:absolute; left:0; top:0; width:56px; height:100%; background:#fff; clip-path:polygon(0 0,3px 0,100% 50%,3px 100%,0 100%,calc(100% - 3px) 50%); }
.cause-steps > li > div { padding:34px 28px 30px; }
.cause-steps > li + li > div { border-left:1px solid #ddd5d2; }
.cause-steps h4 { display:inline-block; margin-bottom:18px; padding:7px 16px 7px 12px; color:#fff; background:#759c51; font-size:18px; font-weight:700; letter-spacing:-.03em; }
.cause-steps h4::before { content:'\203A\00a0'; font-weight:400; } /* › */
.cause-steps > li:nth-child(2) h4 { background:#42b3a0; }
.cause-steps > li:nth-child(3) h4 { background:#15afd6; }
.cause-steps li li,.cause-composition li { line-height:1.8; }
/* 글머리표 내어쓰기 — 두 줄로 꺾이면 둘째 줄이 글자 시작선에 맞춰진다 (inline '• ' 는 둘째 줄이 점 아래로 밀림) */
.cause-steps li li,.cause-composition li { position:relative; padding-left:16px; }
.cause-steps li li::before,.cause-composition li::before { content:'•'; position:absolute; left:0; top:0; font-size:1.25em; line-height:1.44; }
.cause-step-details { padding:24px 40px; background:#f4eff0; }
.cause-step-details > li { display:grid; grid-template-columns:34% 1fr; align-items:center; gap:40px; padding:28px 0; max-width:1028px; margin-inline:auto; } /* 아래 .cause-composition(1028) 과 좌우 시작선 맞춤 — 배경 띠는 전체 폭 유지 */
.cause-step-details > li + li { border-top:1px solid #ddd5d2; }
.cause-step-details figure { position:relative; aspect-ratio:1.78; margin:0; }
/* 두 원(사진·캡션)은 정원 — 높이 100% 에 aspect-ratio:1 로 폭을 맞춘다. 60% 폭으로 잡으면 figure 비율(1.78)에 따라 타원이 된다 */
.cause-step-details figure img { position:absolute; right:0; top:0; height:100%; width:auto; aspect-ratio:1; object-fit:cover; border-radius:50%; max-width:none; }
.cause-step-details figcaption { position:absolute; z-index:1; left:10px; top:0; height:100%; width:auto; aspect-ratio:1; display:grid; align-content:center; text-align:center; border-radius:50%; background:#443a38; color:#fff; padding:14px; }
.cause-step-details figcaption h3 { font-size:var(--jik-type-subtitle); }
.cause-step-details figcaption p { font-size:var(--jik-type-note); }
.cause-step-details li:nth-child(2) h3 { color:#42b3a0; }.cause-step-details li:nth-child(3) h3 { color:#15afd6; }
.cause-step-details h3 { color:#91bd65; }
.cause-cycle { gap:24px; margin:35px 0 55px; text-align:center; }
.cause-cycle li { border:3px solid #80a75f; color:#70994e; border-radius:40px; padding:20px; font-size:var(--jik-type-subtitle); font-weight:700; }
/* 치료 구성 알약 3개 — 원본(2-x-3.jpg): 아래 사진 4장(1028px)과 같은 폭, 알약 사이에 얇은 › 꺾쇠, 완전 둥근 모서리, 굵은 초록 글씨, 괄호 보조어는 가늘게 */
#cause-composition .cause-cycle { display:flex; justify-content:space-between; align-items:stretch; max-width:1028px; margin:35px auto 55px; gap:0 64px; } /* 원본처럼 알약은 내용 폭, 남는 공간은 사이에 */
#cause-composition .cause-cycle li { position:relative; flex:0 1 auto; display:block; border-radius:999px; padding:20px 34px; font-size:var(--jik-type-item); color:#5f8a3a; line-height:1.3; letter-spacing:-.03em; white-space:nowrap; }
#cause-composition .cause-cycle li small { font-size:.72em; font-weight:400; }
#cause-composition .cause-cycle li + li::before { content:''; position:absolute; left:-44px; top:50%; width:22px; height:22px; border-right:2px solid #80a75f; border-top:2px solid #80a75f; transform:translateY(-50%) rotate(45deg); }
.cause-composition { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; max-width:1028px; margin-inline:auto; }
.cause-composition img { width:100%; aspect-ratio:257/182; object-fit:cover; }
@media(min-width:768px) { .jik-sub--stomatitis .cause-composition { gap:0; } }
.jik-sub--stomatitis .cause-composition > div { overflow:hidden; }
.jik-sub--stomatitis .cause-composition img { width:calc(100% + 2px); max-width:none; margin-left:-1px; aspect-ratio:257/180; }
.cause-composition h3 { margin:16px 0 10px; }
.cause-composition ul { padding-right:14px; }
/* 치료효과 카드 — 원본(2-x-4.jpg): 넉넉한 흰 카드, 왼쪽 큰 도넛(라벨 흰 글씨 크게), 오른쪽 검은 볼드 인용 2줄 + 회색 설명 + 이탤릭 출처 + 논문 썸네일.
   썸네일은 assets/img/page/cause/<n>-paper.webp 가 있으면 자동 표시 (jik_asset) */
.cause-research { background:#fff; padding:56px 60px; margin-bottom:0; display:grid; grid-template-columns:40% 1fr; align-items:center; gap:48px; }
#cause-research .jik-sub-heading > span b { font-weight:800; color:#3f3431; }
.cause-research-copy h3 { margin-bottom:28px; color:#2f2927; font-size:var(--jik-type-item); font-weight:800; line-height:1.55; letter-spacing:-.04em; }
.cause-research-body { display:grid; grid-template-columns:1fr auto; align-items:center; gap:32px; }
.cause-research-body p { font-size:19px; line-height:1.7; color:#6f6660; letter-spacing:-.03em; }
.cause-research cite,.cause-source { display:block; margin-top:18px; font-size:var(--jik-type-source); }
.cause-research cite { font:italic 400 15px/1.5 Georgia,'Times New Roman',var(--jik-font-serif); color:#5f5651; margin-top:22px; }
.cause-research-paper { width:156px; height:auto; border:1px solid #e3dedb; box-shadow:0 2px 8px #0001; }
.cause-research-visual ul { display:grid; gap:12px; color:#628b3d; font-weight:700; text-align:center; }
/* 도넛: 원본 비율 — 지름 ≈ 카드 폭의 1/4, 구멍 지름 = 도넛의 30%, 가운데 80% 는 굵은 초록, 라벨은 흰 볼드 (숫자 30px) */
.cause-pie { position:relative; width:360px; max-width:100%; aspect-ratio:1; margin:0 auto; border-radius:50%; background:conic-gradient(#b9d79a 0 20%,#6fa544 20% 70.4%,#8cbb63 70.4% 100%); }
.cause-pie strong { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:31%; aspect-ratio:1; border-radius:50%; background:#fff; display:grid; place-items:center; }
.cause-pie--80 { background:#fff url('../img/page/cause/research-donut-background.webp?v=2') center/100% 100% no-repeat; }
.cause-pie strong span { font:800 46px/1 Arial,sans-serif; letter-spacing:-.05em; color:#5f8f3a; }
.cause-pie-label { position:absolute; transform:translate(-50%,-50%); color:#fff; font-weight:700; font-size:16px; line-height:1.15; text-align:center; white-space:nowrap; text-shadow:0 1px 2px #0002; }
.cause-pie-label em { display:block; font:800 30px/1.05 Arial,sans-serif; font-style:normal; letter-spacing:-.04em; }
.cause-pie-label--1 { left:19%; top:50%; } /* 원본 실측: 왼쪽 라벨 중심 x 19%, 오른쪽 라벨 (80%, 69%) — 구멍(중앙 31%) 밖 */
.cause-pie-label--2 { left:75%; top:69%; }
.cause-bar-legend { display:flex; gap:22px; margin-bottom:35px; font-size:var(--jik-type-note); }
.cause-bar-legend span::before { content:''; display:inline-block; width:22px; height:6px; margin-right:6px; background:#443a38; }
.cause-bar-legend span:last-child::before { background:#79a748; }
.cause-bars { display:flex; gap:18px; }
.cause-bars figure { flex:1; min-width:0; text-align:center; }
.cause-bars figure > div { height:220px; display:flex; gap:7px; align-items:end; border-bottom:3px solid #443a38; }
.cause-bars figure span { position:relative; width:50%; height:var(--bar); background:#443a38; }
.cause-bars figure span:last-child { background:#79a748; }
.cause-bars small { position:absolute; bottom:100%; left:50%; transform:translateX(-50%); font-size:var(--jik-type-source); line-height:1.25; padding-bottom:5px; width:70px; }
.cause-bars figcaption { padding-top:12px; font-size:var(--jik-type-note); }
.cause-bars em { display:block; font-style:normal; color:#70994e; }
.cause-research-cycle li { padding:18px; border-radius:40px; background:#70994e; color:#fff; }
/* 치료효과 3컷 — 원본(2-x-4.jpg 하단): 위 카드와 같은 전체 폭, 사진 사이 10px, 사진 위 여백 없음. 큰 숫자는 제목 첫 줄 상단에 맞춰 정렬 */
.cause-effects { gap:0; max-width:none; margin:0; } /* 사진 3장 붙이고 위 카드에 바로 이어 붙임 — 사용자 지정 */
.cause-effects img { display:block; width:100%; aspect-ratio:358/250; object-fit:cover; }
.jik-sub--weakness .cause-effects { max-width:1062px; margin-inline:auto; } /* 354px 원본 3장을 확대 없이 표시 */
.jik-sub--weakness .cause-effects img { aspect-ratio:auto; }
.cause-effects li > div { display:flex; align-items:flex-start; gap:14px; padding:24px 14px 0 0; }
.cause-effects b { flex:none; color:#70994e; font:800 68px/.78 Arial,sans-serif; letter-spacing:-.04em; padding-right:2px; } /* line-height .78 → 숫자 상단이 제목 첫 줄 상단과 같은 높이 */
.cause-effects h3 { font-size:var(--jik-type-subtitle); line-height:1.35; margin:0 0 8px; }
.cause-effects li > div > div > p { line-height:1.6; }
.cause-caution { position:relative; background:#433737; padding:78px 0 70px; text-align:center; color:#fff; }
.cause-caution::before { content:''; position:absolute; left:0; right:0; top:0; height:5px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 5'%3E%3Crect width='16' height='5' fill='%23fff'/%3E%3Cpath d='M0 5 8 0 16 5Z' fill='%23433737'/%3E%3C/svg%3E") left top/16px 5px repeat-x; }
.cause-caution h2 { font-size:var(--jik-type-section-sub); margin-bottom:20px; }
.cause-caution p { color:#e0d8d4; }
/* 3·3·3 기둥 카드 — 원본(2-x-6.jpg 상단): 카드 사이 '+', 사진 위 어두운 오버레이, 흰 큰 3 + 단위, 얇은 흰 선, 명조 2줄(첫 줄 작게).
   아래는 초록 원 배지 3 + 굵은 제목, 초록 ▼, 회색 설명 3줄 가운데 */
.cause-pillars { gap:88px; text-align:center; }
.cause-pillars > div { position:relative; }
.cause-pillars > div + div .cause-pillar::before { content:'+'; position:absolute; left:-44px; top:50%; transform:translate(-50%,-50%); color:#4b4542; font:300 46px/1 Arial,sans-serif; }
.cause-pillar { position:relative; aspect-ratio:1; border-radius:50px; background-image:linear-gradient(#0005,#0005),url("../img/optimized/page/treatment-system/pillars-clean-v2.png.webp"); background-size:100% 100%,300% 100%; background-position:center,left; display:flex; flex-direction:column; justify-content:center; color:#fff; padding:25px; }
.cause-pillars > div:nth-child(2) .cause-pillar { background-position:center,center; }.cause-pillars > div:nth-child(3) .cause-pillar { background-position:center,right; }
.cause-pillar b { font:800 100px/1 Arial,sans-serif; padding-right:2px; }
.cause-pillar > span { font:700 26px/1.4 Arial,sans-serif; }
.cause-pillar p { border-top:1px solid #fff9; padding-top:14px; margin:14px 10px 0; font:400 30px/1.3 var(--jik-font-serif); letter-spacing:-.04em; word-break:keep-all; }
.cause-pillar p small { display:block; font-size:21px; margin-bottom:2px; }
.cause-pillars h3 { display:flex; justify-content:center; align-items:center; gap:8px; margin:26px 0 0; font-size:var(--jik-type-item); font-weight:800; color:#2f2927; }
.cause-pillars h3 .jik-sub-badge { width:32px; height:32px; margin:0; font-size:19px; background:#70994e; }
.cause-pillars h3::after { content:''; position:absolute; left:50%; transform:translateX(-50%); margin-top:64px; border:7px solid transparent; border-top:9px solid #70994e; border-bottom:0; }
.cause-pillars > div > p { margin:34px 0 0; font-size:var(--jik-type-body); line-height:1.7; color:#6f6660; }
.cause-system-details { margin-top:50px; }
/* 탭 — 원본: 비활성은 연회색 판에 회색 글씨, 활성은 흰 판 + 초록 3px 테두리(상·좌·우)로 아래 패널과 이어짐. 패널도 초록 3px */
/* 탭 — 패널은 top border 를 두지 않고, 가로 초록선은 비활성 탭의 border-bottom 이 그린다.
   활성 탭은 3면 초록 + 아래쪽만 흰색 → 패널과 흰 면이 그대로 이어진다 (겹침·음수마진 없음) */
.cause-tabs { display:flex; border-bottom:3px solid #70994e; }
.cause-tabs button { flex:1; border:3px solid transparent; padding:22px 12px; cursor:pointer; font:400 var(--jik-type-item)/1.4 var(--jik-font); color:#4b4542; background:#f3f1f1; letter-spacing:-.03em; transition:color .15s, background .15s; }
.cause-tabs button:hover { color:#3f3431; background:#ebe8e8; }
.cause-tabs button[aria-selected="true"] { background:#fff; color:#5f8f3a; font-weight:700; border-color:#70994e; border-bottom-color:#fff; margin-bottom:-3px; }
.cause-system-details.is-tabbed details { border:3px solid #70994e; border-top:0; }
.cause-system-details.is-tabbed summary { display:none; }
.cause-system-details [hidden] { display:none; }
.cause-system-details details { border:1px solid #70994e; }
.cause-system-details summary { cursor:pointer; background:#70994e; color:#fff; padding:20px; font-size:var(--jik-type-subtitle); font-weight:700; }
.cause-detail-body { padding:35px; }
.cause-detail-body h3 { margin-bottom:14px; }
.cause-detail-body .cause-three { gap:25px; margin-top:25px; }
.cause-green { color:#70994e; font-weight:700; }
/* 3단계 치료시스템 상세 — 원본 2-x-5-1.jpg: 좌 그래프+파우치 사진(644×342 크롭), 우 제목·부제 + 초록 원 배지 3개(1·2단계 한 줄, 3단계 다음 줄).
   그래프 안 글자(순기/제열/소취/입냄새 완전정복/1~3단계)는 이미지에 구워져 있어 HTML 은 alt 로만 */
.cause-stage { display:grid; grid-template-columns:minmax(0,36%) 1fr; gap:40px; align-items:center; padding:40px 40px 36px; } /* 이미지 36% — 사용자 지정 */
.cause-stage__art { margin:0; }
.cause-stage__art img { display:block; width:100%; height:auto; }
.cause-stage__copy h3 { margin:0 0 8px; font-size:32px; font-weight:800; line-height:1.25; letter-spacing:-.05em; color:#2f2927; }
.cause-stage__copy > p { font-size:16px; color:#6f6660; line-height:1.6; }
.cause-stage:not(.cause-stage--cycle) .cause-stage__copy > p,.cause-stage__copy > .cause-stage__kicker { font-weight:700; color:#5f5651; } /* 시스템 고딕은 500/600 이 없어 700 + 색을 한 톤 진하게 */
.cause-stage-list { display:grid; grid-template-columns:1fr 1fr; gap:18px 24px; margin:28px 0 0; padding:0; list-style:none; }
.cause-stage-list li { display:flex; align-items:center; gap:14px; }
.cause-stage-list li.is-wide { grid-column:1 / -1; }
.cause-stage-list b { flex:none; display:grid; place-content:center; width:70px; height:70px; border-radius:50%; background:#70994e; color:#fff; text-align:center; font-size:16px; font-weight:800; line-height:1.15; letter-spacing:-.04em; }
.cause-stage-list b span { display:block; font-size:17px; }
.cause-stage-list p { margin:0; font-size:16px; line-height:1.5; color:#6f6660; word-break:keep-all; }
.cause-stage-list strong { display:block; color:#5f8f3a; font-size:16px; font-weight:700; }
/* 3개월 맞춤치료 — 같은 좌 이미지 / 우 본문 구성. 이미지 파일(system-cycle-graph.webp)은 사용자가 넣는다; 없으면 figure 만 비고 본문은 그대로 */
.cause-stage__kicker { margin:0 0 4px; font-size:16px; color:#6f6660; }
.cause-stage--cycle .cause-green { margin:22px 0 6px; font-size:17px; color:#5f8f3a; font-weight:700; }
.cause-stage__body { font-size:16px; line-height:1.7; color:#6f6660; word-break:keep-all; }
.cause-stage--cycle .cause-stage__copy > p:not(.cause-stage__kicker):not(.cause-green):not(.cause-stage__body) { display:none; }
/* 3년 책임관리제 — 3단계·3개월 탭과 같은 좌 사진 / 우 본문 구성. 표는 '입냄새 재발 환자'가 3행을 묶는 rowgroup 헤더 */
/* 위·아래 가로선은 '입냄새 재발 환자' 칸까지 포함해 표 전체 폭으로, 행 사이 구분선은 오른쪽 두 열에만.
   rowgroup 칸은 오른쪽 세로선으로 분리 (원본과 동일) */
.cause-warranty-table { width:100%; border-collapse:collapse; margin-top:26px; color:#5f8f3a; border-top:1px solid #e6e2e0; border-bottom:1px solid #e6e2e0; }
.cause-warranty-table th[scope="rowgroup"] { width:22%; padding:12px 10px; border-right:1px solid #e6e2e0; font-size:var(--jik-type-subtitle); font-weight:800; line-height:1.4; text-align:center; }
.cause-warranty-table th[scope="row"] { width:24%; }
.cause-warranty-table th[scope="row"],.cause-warranty-table td { border-top:1px solid #e6e2e0; padding:2px 12px; font-size:16px; font-weight:400; line-height:2.6; text-align:center; }
.cause-stage--warranty .cause-source { margin-top:16px; color:#5f8f3a; font-size:16px; }
#cause-clinic { max-width:1284px; margin-inline:auto; }
#cause-clinic > .jik-container { max-width:1130px; }
#cause-clinic .jik-sub-heading h2 { display:block; }
#cause-clinic .jik-sub-heading h2::before,#cause-clinic .jik-sub-heading h2::after { content:none; }
#cause-clinic .jik-sub-heading h2 > span { display:block; font-weight:400; }
.cause-reasons { gap:8px; }
.cause-reasons li { min-width:0; background:#443a38; }
.cause-reasons img { display:block; width:100%; height:auto; aspect-ratio:536/467; }
.cause-reasons li > h3 { display:grid; grid-template-columns:56px 1fr; align-items:stretch; min-height:56px; margin:0; font-size:var(--jik-type-body); font-weight:400; line-height:1.4; color:#fff; }
.cause-reasons h3 > span { display:flex; align-items:center; justify-content:center; padding:8px; }
.cause-reasons h3 > span:first-child { padding-right:10px; background:#302927; font-size:var(--jik-type-item); font-weight:800; }

@media(max-width:1500px) {
 .cause-banner--1 { min-height:0; }
 .cause-banner--1::before { inset:24px 0 0; }
 .cause-banner.cause-banner--1 > div { width:auto; min-height:354px; padding:24px 0 0; }
 .cause-banner.cause-banner--1 img { left:16px; height:330px; }
 .cause-banner.cause-banner--1 > div > div { padding:20px 24px 26px 300px; }
 .cause-banner.cause-banner--1 .cause-banner-lists { grid-template-columns:1fr; }
}
@media(max-width:1100px) {
 .cause-origin-visual { grid-template-columns:200px minmax(0,1fr) 200px; gap:24px; }

 .cause-banner-lists { grid-template-columns:1fr; }
 .cause-symptoms { gap:8px; grid-template-columns:1fr 25px 1fr 25px 1fr; }
 .cause-symptoms blockquote { padding:25px 15px; }
 .cause-pillars { gap:56px; }
 .cause-pillars > div + div .cause-pillar::before { left:-28px; font-size:36px; }
 .cause-pillar p { font-size:24px; } .cause-pillar p small { font-size:17px; }
 .cause-pillar b { font-size:75px; }
}
@media(max-width:767px) {
 .jik-sub--cause .jik-container { padding-inline:22px; }
 .cause-intro { padding-top:var(--jik-page-mobile-top); padding-bottom:30px; }
 .cause-banner > div { grid-template-columns:1fr; padding:0; gap:0; }
 .cause-banner img { width:100%; max-width:420px; margin:auto; }
 .cause-banner > div > div { padding:24px 22px; }
 .cause-banner--1 { min-height:0; }
 .cause-banner--1::before { inset:0; background:url('../img/page/cause/banner-1-strip.webp') top center/auto 100% no-repeat; }
 .cause-banner.cause-banner--1 > div { display:grid; grid-template-columns:1fr; min-height:0; padding:0; }
 .cause-banner.cause-banner--1 img { display:none; }
 .cause-banner.cause-banner--1 > div > div { padding:40px 22px 44px; }
 .cause-banner h2 .cause-brand { display:block; font-weight:inherit; }
 .cause-banner h2 { font-size:var(--jik-type-item); }
 .cause-flow { gap:12px; margin:30px 0; }
 .cause-flow li { flex-basis:100%; max-width:none; padding:20px; }
 .cause-origin-visual { grid-template-columns:1fr; gap:22px; margin:30px auto; max-width:300px; }
 .cause-origin-result { max-width:265px; margin-inline:auto; }
 .cause-origin-visual > img,.cause-origin-visual > picture { max-width:300px; margin:auto; }
 .cause-faq { grid-template-columns:1fr; padding:24px; gap:0; }
 .cause-faq > div { padding-bottom:0; }
 .cause-faq figure { order:-1; width:220px; max-width:100%; justify-self:center; margin:0 0 18px; }
 .cause-faq h2 { margin-bottom:20px; }
 .cause-gallery { grid-template-columns:repeat(6,1fr); }
 .cause-gallery img:nth-child(-n+3) { grid-column:span 2; }
 .cause-gallery img:nth-child(n+4) { grid-column:span 3; }
 .cause-symptoms { grid-template-columns:1fr; gap:16px; margin-top:28px; }
 .cause-symptoms .cause-arrow { transform:rotate(90deg); }
 .cause-symptoms blockquote { padding:50px 30px; } /* 사용자 지정 */

 .cause-steps,.cause-three,.cause-effects,.cause-pillars,.cause-reasons { grid-template-columns:1fr; }
 /* 모바일 그래프: viewBox 2004 기준 r=60 은 폰에서 지름 20px 밖에 안 돼 라벨이 안 보인다 → CSS 로 r/stroke 키움(SVG2 presentation property), 라벨 폰트도 */
 .cause-graph circle[r="60"] { r:125px; stroke-width:9px; }
 /* 커진 원이 점선에 걸리지 않게 곡선에서 떨어뜨림 (cx/cy 도 CSS 로). HTML 라벨(--x/--y)도 같은 좌표로 */
 .cause-graph circle[cx="257"] { cx:230px; cy:430px; }
 .cause-graph circle[cx="878"] { cx:850px; cy:280px; }
 .cause-graph circle[cx="1663"] { cx:1680px; cy:280px; }
 .cause-graph g[fill]:not([fill="#fff"]) { display:none; } /* 원→점 꼬리 삼각형은 위치가 안 맞게 되므로 숨김 */
 .cause-graph-label { font-size:3.8cqw; }
 /* 템플릿의 inline style(--x/--y)이 이기므로 left/top 을 직접 덮어쓴다 */
 .cause-graph-label:nth-of-type(1) { left:11.48%; top:67.4%; }
 .cause-graph-label:nth-of-type(2) { left:42.41%; top:43.9%; }
 .cause-graph-label:nth-of-type(3) { left:83.83%; top:43.9%; }
 .cause-steps { background:none; border-width:0; }
 .cause-steps header { height:auto; min-height:0; padding:16px 20px; background:#759c51; }
 .cause-steps > li:nth-child(2) header { background:#42b3a0; }
 .cause-steps > li:nth-child(3) header { background:#15afd6; }
 .cause-steps > li + li header::before { display:none; }
 .cause-steps > li > div { padding:22px 18px 26px; }
 .cause-steps > li + li > div { border-left:0; }
 .cause-step-details { padding:10px 22px; }
 .cause-step-details > li { grid-template-columns:1fr; gap:20px; }
 .cause-step-details figure { width:100%; max-width:330px; margin:auto; }
 .cause-tabs { border-bottom-width:2px; }
 .cause-tabs button { padding:14px 6px; font-size:16px; border-width:2px; }
 .cause-tabs button[aria-selected="true"] { margin-bottom:-2px; }
 .cause-system-details.is-tabbed details { border-width:2px; border-top:0; }
 #cause-composition .cause-cycle { flex-direction:column; align-items:stretch; gap:34px 0; }
 #cause-composition .cause-cycle li { white-space:normal; word-break:keep-all; }
 #cause-composition .cause-cycle li { padding:16px 14px; }
 #cause-composition .cause-cycle li + li::before { left:50%; top:-30px; transform:translateX(-50%) rotate(135deg); width:16px; height:16px; }
 .cause-composition { grid-template-columns:1fr 1fr; gap:28px 12px; }
 .cause-composition h3 { font-size:var(--jik-type-subtitle); }
 .cause-composition ul { padding:0; }
 .cause-research { grid-template-columns:1fr; padding:28px 20px; gap:26px; margin-bottom:0; }
 .cause-research-body { grid-template-columns:1fr; }
 .cause-research-body p { font-size:16px; }
 .cause-research-paper { width:120px; margin:0 auto; }
 .cause-pie { width:270px; }
 .cause-pie-label { font-size:13px; }
 .cause-pie strong span { font-size:36px; }
 .cause-pie-label em { font-size:24px; }
 .cause-effects { gap:28px; }
 .jik-sub--weakness .cause-effects { max-width:354px; }
 .cause-effects b { font-size:52px; }
 .cause-caution { padding:40px 0; }
 .cause-pillars { gap:44px; max-width:350px; margin:auto; }
 .cause-pillars > div + div .cause-pillar::before { left:50%; top:-22px; transform:translate(-50%,-50%); font-size:34px; }
 .cause-detail-body { padding:22px; }
 .cause-stage { grid-template-columns:1fr; gap:24px; padding:22px 18px; }
 .cause-stage__copy h3 { font-size:var(--jik-type-item); }
 .cause-stage__art { max-width:420px; margin:0 auto; }
 .cause-stage-list { grid-template-columns:1fr; gap:18px; margin-top:24px; }
 .cause-stage-list b { width:64px; height:64px; font-size:14px; }
 .cause-stage-list b span { font-size:16px; }
 .cause-warranty-table th[scope="rowgroup"] { font-size:16px; padding:10px 4px; }
 .cause-warranty-table th[scope="row"],.cause-warranty-table td { padding:2px 5px; font-size:14px; line-height:2.4; }
 .cause-stage--warranty .cause-source { font-size:14px; }
 .cause-reasons { max-width:380px; margin:auto; }
}
@media(max-width:480px) {
 /* 치료 구성 4카드: 2열 → 1열. 사진은 폭 채우고 글머리 목록은 왼쪽 정렬 유지 */
 .cause-composition { grid-template-columns:1fr; gap:32px; max-width:360px; margin-inline:auto; }
 .cause-composition h3 { margin:14px 0 8px; }
}

.cause-diet-origin-title { font-weight:400; }
.cause-diet-origin-title strong { font-weight:800; }

.cause-diet-diagram { max-width:620px; margin:28px auto; }
.cause-diet-diagram > img { width:100%; height:auto; }
.cause-diet-diagram figcaption { padding-top:16px; font-size:var(--jik-type-body); line-height:1.85; }

.jik-sub--cause .jik-sub-prose.cause-process-wide { max-width:1000px; }

/* 다이어트 치료효과: 원본 순환 도해·논문 사진을 원래 비율로 보존. */
.cause-research--diet { max-width:1284px; margin-inline:auto; }
.cause-research--diet .cause-research { grid-template-columns:36% minmax(0,1fr); gap:48px; padding:40px 48px; }
.cause-diet-research-cycle { width:100%; max-width:367px; height:auto; margin:auto; }
.cause-research--diet .cause-research-paper { width:100px; border:0; box-shadow:none; }
.cause-research--diet .cause-research-body p { font-size:var(--jik-type-body); }
@media(max-width:767px) {
 .cause-research--diet .cause-research { grid-template-columns:1fr; gap:24px; padding:24px 18px; }
 .cause-research--diet .cause-research-body { gap:16px; }
}

.cause-caution--diet > .jik-container { max-width:800px; }

.cause-alcohol-diagram { max-width:1079px; margin:28px auto; }
.cause-alcohol-diagram > img { width:100%; height:auto; }
.cause-alcohol-diagram figcaption { padding-top:16px; font-size:var(--jik-type-body); line-height:1.85; }

/* 다이어트·음주·흡연: 글자 없는 배경과 실제 HTML 문구 분리. */
.cause-banner--3 { background:#504543 url('../img/page/cause/alcohol-banner-clean.webp') center top/auto 332px no-repeat; }
.cause-banner.cause-banner--2 > .jik-container,.cause-banner.cause-banner--3 > .jik-container,.cause-banner.cause-banner--4 > .jik-container,.cause-banner.cause-banner--5 > .jik-container,.cause-banner.cause-banner--6 > .jik-container,.cause-banner.cause-banner--7 > .jik-container { display:flex; min-height:332px; align-items:center; padding-block:40px; }
.cause-banner--2 > .jik-container > div,.cause-banner--3 > .jik-container > div,.cause-banner--4 > .jik-container > div,.cause-banner--5 > .jik-container > div,.cause-banner--6 > .jik-container > div,.cause-banner--7 > .jik-container > div { padding-left:490px; width:100%; }
.cause-banner--2 > .jik-container > div { padding-left:450px; }
.cause-banner--2 .cause-banner-lists,.cause-banner--3 .cause-banner-lists,.cause-banner--4 .cause-banner-lists,.cause-banner--5 .cause-banner-lists,.cause-banner--6 .cause-banner-lists,.cause-banner--7 .cause-banner-lists { padding-bottom:0; }
 .cause-banner--2 { background:url('../img/page/cause/diet-banner-clean.webp') center top/cover no-repeat; }
@media(max-width:1100px) {
 .cause-banner--2,.cause-banner--3,.cause-banner--4,.cause-banner--5,.cause-banner--6,.cause-banner--7 { background-position:calc(50% + 130px) top; }
 .cause-banner--2 > .jik-container > div,.cause-banner--3 > .jik-container > div,.cause-banner--4 > .jik-container > div,.cause-banner--5 > .jik-container > div,.cause-banner--6 > .jik-container > div,.cause-banner--7 > .jik-container > div { padding-left:42%; }
}
@media(max-width:767px) {
 .cause-banner--2 { background-image:url('../img/page/cause/diet-banner-mobile.webp'); }
 .cause-banner--3 { background-image:url('../img/page/cause/alcohol-banner-mobile.webp'); }
 .cause-banner--2,.cause-banner--3,.cause-banner--4,.cause-banner--5,.cause-banner--6,.cause-banner--7 { background-position:center top; background-size:cover; }
 .cause-banner.cause-banner--2 > .jik-container,.cause-banner.cause-banner--3 > .jik-container,.cause-banner.cause-banner--4 > .jik-container,.cause-banner.cause-banner--5 > .jik-container,.cause-banner.cause-banner--6 > .jik-container,.cause-banner.cause-banner--7 > .jik-container { padding:40px 22px; min-height:0; }
 .cause-banner--2 > .jik-container > div,.cause-banner--3 > .jik-container > div,.cause-banner--4 > .jik-container > div,.cause-banner--5 > .jik-container > div,.cause-banner--6 > .jik-container > div,.cause-banner--7 > .jik-container > div { padding-left:0; }
}

.jik-sub--cause .jik-sub-prose.cause-origin-wide { max-width:1200px; }

.cause-banner--4 { background:url('../img/page/cause/stress-banner-clean.webp') center top/cover no-repeat; }
.cause-banner--5 { background:url('../img/page/cause/rhinitis-banner-clean.webp') center top/cover no-repeat; }
.cause-banner--6 { background:url('../img/page/cause/women-banner-clean.webp') center top/cover no-repeat; }
.cause-women-diagram { max-width:814px; margin-bottom:65px; }
.cause-women-flow { --flow-gap:44px; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:var(--flow-gap); margin:42px 0; }
.cause-women-flow li { position:relative; aspect-ratio:1; display:grid; place-content:center; border:4px solid #789e55; border-radius:50%; padding:12px; color:#70994e; font-weight:700; font-size:var(--jik-type-subtitle); line-height:1.4; text-align:center; }
.cause-women-flow li:first-child { background:#70994e; color:#fff; }
.cause-women-flow li+li::before { content:''; position:absolute; left:calc(var(--flow-gap) / -2 - 4px); top:50%; width:18px; height:34px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 34'%3E%3Cpath d='M1 1 17 17 1 33' fill='none' stroke='%23789e55' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat; transform:translate(-50%,-50%); }
.cause-women-research { position:relative; container-type:inline-size; width:100%; aspect-ratio:500/330; background:url('../img/page/cause/women-research-bg.svg') center/contain no-repeat; }
.cause-women-research > div { position:absolute; left:11%; top:24%; width:34%; height:37%; display:grid; align-content:center; text-align:center; color:#79a748; font-size:3.8cqw; font-weight:700; line-height:1.3; }
.cause-women-research > div+div { left:56%; top:39%; color:#87b95b; }
.cause-women-research strong { font:800 11.5cqw/1.1 Arial,sans-serif; }
.cause-women-research small { font-size:4.5cqw; }
@media(min-width:768px) and (max-width:1100px) {
 .cause-women-flow { --flow-gap:24px; }
 .cause-women-flow li { padding:8px; font-size:var(--jik-type-body); }
 .cause-women-flow li+li::before { width:12px; height:24px; }
}
@media(max-width:767px) {
 .cause-banner--6 { background-image:url('../img/page/cause/women-banner-mobile.webp'); }
 .cause-women-flow { --flow-gap:48px; grid-template-columns:1fr; max-width:280px; margin:32px auto; }
 .cause-women-flow li+li::before { left:50%; top:calc(var(--flow-gap) / -2 - 4px); transform:translate(-50%,-50%) rotate(90deg); }
}
.jik-sub--rhinitis .cause-composition { grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; max-width:1284px; }
.jik-sub--rhinitis #cause-composition .cause-cycle { max-width:1284px; gap:0 44px; }
.jik-sub--rhinitis #cause-composition .cause-cycle li { white-space:normal; padding-inline:24px; }
.jik-sub--rhinitis .cause-caution .jik-container { max-width:1000px; }
.jik-sub--rhinitis .cause-research-paper,.jik-sub--women .cause-research-paper,.jik-sub--weakness .cause-research-paper,.jik-sub--stomatitis .cause-research-paper { width:99px; height:auto; border:0; box-shadow:none; }
/* 도형은 배경, 모든 문구는 실제 HTML. 원본 좌표에 맞춰 함께 축소한다. */
.cause-rhinitis-research { position:relative; container-type:inline-size; width:100%; max-width:463px; aspect-ratio:463/451; margin:auto; background:url('../img/page/cause/rhinitis-research-bg.svg') center/100% 100% no-repeat; }
.cause-rhinitis-ring { position:absolute; left:16.42%; top:13.75%; width:42.33%; height:43.46%; display:grid; place-items:center; }
.cause-rhinitis-ring strong { color:#79a748; text-align:center; font-size:4.75cqw; line-height:1.2; }
.cause-rhinitis-ring strong span { display:block; font:800 15.1cqw/1 Arial,sans-serif; }
.cause-rhinitis-ring small { font-size:6cqw; }
.cause-rhinitis-research ul { position:absolute; inset:0; margin:0; padding:0; list-style:none; }
.cause-rhinitis-research li { position:absolute; top:60.98%; left:24%; width:18.14%; height:18.63%; display:grid; place-items:center; color:#fff; font-size:3.45cqw; font-weight:400; line-height:1.3; text-align:center; padding:0 2%; }
.cause-rhinitis-research li:nth-child(2) { left:40.60%; }
.cause-rhinitis-research li:nth-child(3) { left:57.24%; }
.cause-rhinitis-research li:nth-child(4) { left:73.87%; }
.cause-rhinitis-research li:nth-child(n+5) { top:78.27%; }
.cause-rhinitis-research li:nth-child(5) { left:32.40%; }
.cause-rhinitis-research li:nth-child(6) { left:49.03%; }
.cause-rhinitis-research li:nth-child(7) { left:65.66%; }
@media(max-width:767px) {
 .cause-banner--5 { background-image:url('../img/page/cause/rhinitis-banner-mobile.webp'); }
 .jik-sub--rhinitis .cause-composition { grid-template-columns:1fr; max-width:360px; gap:32px; }
 .jik-sub--rhinitis #cause-composition .cause-cycle { gap:34px; }
}
.cause-stress-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:48px; margin:40px 0 60px; }
.cause-stress-flow li { position:relative; aspect-ratio:1; border:4px solid #789e55; border-radius:50%; display:grid; align-content:center; text-align:center; padding:16px 10px; }
.cause-stress-flow li + li::before { content:''; position:absolute; right:calc(100% + 18px); top:50%; width:27px; height:27px; border-top:2px solid #443a38; border-right:2px solid #443a38; transform:translateY(-50%) rotate(45deg); }
.cause-stress-flow li:nth-child(3)::before { content:'+'; border:0; width:40px; height:40px; right:calc(100% + 8px); transform:translateY(-50%); font:300 40px/1 Arial; color:#443a38; }
.cause-stress-flow h3 { color:#70994e; font-size:var(--jik-type-subtitle); font-weight:800; margin-bottom:8px; }
.cause-stress-flow p { font-size:var(--jik-type-body); }
.cause-stress-flow li:last-child { background:linear-gradient(#07152e99,#07152e99),url('../img/page/cause/stress-result-clean.webp') center/cover; border:0; color:#fff; }
.cause-stress-flow li:last-child h3 { color:#fff; font-size:var(--jik-type-body); }
.cause-stress-flow li:last-child p { font:800 30px/1.3 var(--jik-font-serif); }
.cause-stress-flow li:last-child p::before { content:"“ "; }
.cause-stress-flow li:last-child p::after { content:" ”"; }
@media(min-width:768px) and (max-width:1100px) { .cause-stress-flow { gap:28px; } .cause-stress-flow li { padding:12px 6px; } .cause-stress-flow li + li::before { width:15px; height:15px; right:calc(100% + 9px); } .cause-stress-flow li:nth-child(3)::before { width:24px; height:24px; font-size:24px; right:calc(100% + 3px); } }
@media(max-width:767px) {
 .cause-banner--4 { background-image:url('../img/page/cause/stress-banner-mobile.webp'); background-position:center top; }
 .cause-stress-flow { grid-template-columns:minmax(0,1fr); width:100%; max-width:300px; gap:56px; margin-inline:auto; }
 .cause-stress-flow li { width:100%; min-width:0; box-sizing:border-box; }
 .cause-stress-flow li + li::before { right:auto; left:50%; top:-32px; width:20px; height:20px; transform:translate(-50%,-50%) rotate(135deg); }
 .cause-stress-flow li:nth-child(3)::before { right:auto; width:32px; height:32px; font-size:32px; transform:translate(-50%,-50%); }
 .cause-stress-flow li:last-child::before { top:-28px; }
}

.cause-banner--7 { background:url('../img/page/cause/weakness-banner-clean.webp') center top/cover no-repeat; }
@media(max-width:767px) { .cause-banner--7 { background-image:url('../img/page/cause/weakness-banner-mobile.webp'); } }

/* 허약체질: 원문 HTML과 신장 배경 분리. 양쪽 원인이 가운데 결과를 향한다. */
.cause-weakness-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:60px; max-width:1080px; margin:44px auto 60px; }
.cause-weakness-flow > div { position:relative; aspect-ratio:1; border-radius:50%; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:24px 14px; }
.cause-weakness-flow__cause { border:4px solid #789e55; }
.cause-weakness-flow h3 { font-size:var(--jik-type-subtitle); font-weight:700; line-height:1.4; color:#70994e; margin:0 0 10px; }
.cause-weakness-flow__cause br { display:none; }
.cause-weakness-flow p { font-size:var(--jik-type-body); margin:0; }
.cause-weakness-flow__result { background:linear-gradient(#05122933,#05122933),url('../img/page/cause/weakness-kidney-bg.webp') center/cover; color:#fff; }
.cause-weakness-flow__result h3 { color:#fff; font-family:var(--jik-font-serif); font-size:var(--jik-type-section-sub); margin:6px 0 0; }
.cause-weakness-flow__result::before,.cause-weakness-flow__result::after { content:''; position:absolute; top:50%; width:23px; height:23px; border-top:2px solid #554c47; border-right:2px solid #554c47; }
.cause-weakness-flow__result::before { left:-42px; transform:translateY(-50%) rotate(45deg); }
.cause-weakness-flow__result::after { right:-42px; transform:translateY(-50%) rotate(-135deg); }
@media(max-width:1100px) {
 .cause-weakness-flow { grid-template-columns:1fr; gap:48px; max-width:310px; margin-inline:auto; }
 .cause-weakness-flow__result { order:3; }
 .cause-weakness-flow__cause:last-child { order:2; }
 .cause-weakness-flow__result::before { left:50%; top:-34px; transform:translateX(-50%) rotate(135deg); }
 .cause-weakness-flow__result::after { display:none; }
 .cause-weakness-flow__cause:first-child::after { content:'+'; position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%); color:#554c47; font-size:28px; line-height:28px; }
}
@media(max-width:400px) {
 .cause-weakness-flow > div { aspect-ratio:auto; min-height:300px; border-radius:50%; padding:26px 14px; }
 .cause-weakness-flow > .cause-weakness-flow__result { min-height:0; aspect-ratio:1; border-radius:50%; }
}

/* 2026-09-28 원인 도해: 글자 지운 원본 도해 + HTML 문구 (2_2·2_3·2_5·2_6). 글자 크기는 도해 폭 기준(cqw)으로 원본 비율 유지 */
.cause-origin-overlay { position:relative; container-type:inline-size; }
.cause-origin-overlay > img { display:block; width:100%; height:auto; }
.cause-origin-overlay__label { position:absolute; transform:translate(-50%,-50%); text-align:center; white-space:nowrap; line-height:1.45; letter-spacing:-.04em; }
.cause-origin-overlay__label.is-pill,.cause-origin-overlay__label.is-photo { color:#fff; font-weight:700; }
.cause-diet-diagram .is-pill { font-size:clamp(9px,2.9cqw,19px); }
.cause-origin-overlay__label.is-photo { font-size:clamp(9px,1.75cqw,20px); text-shadow:0 1px 3px #0008; }
.cause-origin-overlay__label.is-list { color:#444; font-size:clamp(8px,1.45cqw,16px); line-height:1.55; }
.cause-origin-overlay__label.is-list i { display:block; font-style:normal; color:#6f9a52; font-size:.7em; line-height:1.3; }
.cause-origin-overlay__label.is-list b,.cause-origin-overlay__label.is-green { color:#6f9a52; font-weight:700; }
.cause-origin-overlay__label.is-result { color:#fff; }
.cause-origin-overlay__label.is-result small,.cause-origin-overlay__label.is-ring small { display:block; font-size:clamp(8px,1.6cqw,17px); font-weight:300; }
.cause-origin-overlay__label.is-result strong { display:block; font-family:var(--jik-font-serif); font-size:clamp(14px,3.1cqw,36px); font-weight:800; }
.cause-diet-diagram .is-result small { font-size:clamp(8px,2.7cqw,17px); color:#ffd9c9; }
.cause-diet-diagram .is-result strong { font-size:clamp(14px,5.4cqw,36px); }
.cause-women-diagram .is-result small { font-size:clamp(8px,2.2cqw,17px); color:#ffd9c9; }
.cause-women-diagram .is-result strong { font-size:clamp(14px,4.3cqw,36px); }
.cause-origin-overlay__label.is-ring { color:#555; }
.cause-origin-overlay__label.is-ring small { font-size:clamp(8px,2cqw,16px); font-weight:500; color:#555; }
.cause-origin-overlay__label.is-ring strong { display:block; color:#6f9a52; font-size:clamp(20px,7.4cqw,60px); font-weight:900; line-height:1; }
.cause-origin-overlay__label.is-ring em { font-style:normal; font-size:.5em; }
@media (min-width:768px) { .cause-origin-overlay + figcaption { display:none; } }
@media (max-width:767px) { .cause-origin-overlay__label { display:none; } }
/* 간수치 막대: PC 수치 한 줄, 모바일은 막대 폭 안에서 두 줄로(옆 막대와 겹치지 않게) */
.cause-bars small { width:auto; white-space:nowrap; }
@media (max-width:767px) { .cause-bars small { width:100%; white-space:normal; font-size:10px; line-height:1.2; } .cause-bars figure > div { gap:4px; } }
.cause-origin-overlay__label.is-tight { line-height:1.2; }
.cause-origin-overlay__label.is-photo { letter-spacing:-.01em; word-spacing:.08em; }
/* 모바일 원인 도해: 다이어트·여성질환은 도해 위 문구를 그대로 보이고, 글이 작은 음주/흡연·비염 도해는 이미지 대신 글 목록 */
@media (max-width:767px) {
 .cause-diet-diagram .cause-origin-overlay__label,.cause-women-diagram .cause-origin-overlay__label { display:block; }
 .cause-diet-diagram figcaption,.cause-women-diagram figcaption { display:none; }
 .cause-alcohol-diagram:not(.cause-women-diagram) .cause-origin-overlay { display:none; }
}

/* 2026-09-29 원본 2-x-3 실측: 논문 패널과 주의사항 띠는 전체폭이 아니라 콘텐츠 폭(1284) 박스, 주의사항은 논문 패널 바로 아래 톱니로 이어짐 */
.jik-sub--cause #cause-research.jik-sub-section--tint { background:#fff; padding-bottom:0; }
.jik-sub--cause #cause-research > .jik-container { max-width:1284px; padding:70px 100px 64px; background:#f4f0f1; }
.jik-sub--cause .cause-caution { background:transparent; padding:0; }
.jik-sub--cause .cause-caution::before { display:none; }
.jik-sub--cause .cause-caution > .jik-container { position:relative; max-width:1284px; padding:64px 40px 58px; background:#433737; }
.jik-sub--cause .cause-caution > .jik-container::before { content:''; position:absolute; left:0; right:0; top:0; height:5px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 5'%3E%3Crect width='16' height='5' fill='%23f4f0f1'/%3E%3Cpath d='M0 5 8 0 16 5Z' fill='%23433737'/%3E%3C/svg%3E") left top/16px 5px repeat-x; }
.jik-sub--cause .cause-caution + #cause-system { padding-top:90px; }
@media (max-width:767px) {
 .jik-sub--cause #cause-research > .jik-container { padding:40px 16px 34px; }
 .jik-sub--cause .cause-caution > .jik-container { padding:40px 18px 36px; }
 .jik-sub--cause .cause-caution + #cause-system { padding-top:56px; }
}