/* 밸류체인 마인드맵(.vcm). 모든 규칙을 .vcm 아래로 한정해 기존 사이트 CSS와 섞이지 않게 한다. */
.vcm{--green:#19804d;--darkgreen:#225d3d;--mint:#eaf2de;--line:#e4e1d8;--k:1;color:#17231c;font-family:inherit;box-sizing:border-box}
.vcm *,.vcm *::before,.vcm *::after{box-sizing:border-box}
.vcm-tabs{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;margin:0 0 14px}
.vcm .vcm-tabs button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 14px;font:inherit;font-size:14px;font-weight:700;color:#3f4b44;cursor:pointer;white-space:nowrap;min-width:0;box-shadow:none}
.vcm .vcm-tabs button:hover{background:#f0f6ea}
.vcm .vcm-tabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.vcm button:focus-visible,.vcm a:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.vcm-fit{position:relative;width:100%;overflow:hidden}
.vcm-map{position:relative;transform-origin:0 0}
.vcm-in{position:absolute;left:0;top:0;width:2400px;height:2000px}
.vcm-wires{position:absolute;left:0;top:0;pointer-events:none;overflow:visible;z-index:0}
.vcm-wires path{fill:none;stroke-linecap:round}
.vcm-stage{display:contents}.vcm-break{display:none}.vcm-lb{flex:0 0 100%;height:0;margin:0;padding:0;display:block}
.vcm-center,.vcm-node,.vcm-zone{position:absolute;z-index:1}
.vcm-center{transform:translate(-50%,-50%);background:#fff;border:3px solid #bcd0e8;border-radius:999px;padding:22px 46px;font-size:44px;font-weight:850;letter-spacing:-.04em;line-height:1.2;box-shadow:0 6px 22px #4f8fe826;white-space:nowrap}
.vcm-node{transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--c) 13%,#fff);border:3px solid var(--c);border-radius:999px;padding:14px 30px;font-size:28px;font-weight:850;letter-spacing:-.04em;line-height:1.2;white-space:nowrap;box-shadow:0 4px 14px color-mix(in srgb,var(--c) 28%,transparent)}
.vcm-node b{font-size:13px;letter-spacing:1px;color:var(--c)}
.vcm-zone{display:flex;gap:20px}
.vcm-zone.L,.vcm-zone.R{flex-direction:column}
.vcm-zone.T,.vcm-zone.B{flex-direction:row;align-items:flex-start;gap:44px}
.vcm-group{display:flex;flex-direction:column;gap:9px;min-width:0}
.vcm-tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:color-mix(in srgb,var(--c) 15%,#fff);border-radius:999px;padding:5px 15px 5px 11px;font-size:calc(18px*var(--k));font-weight:800;letter-spacing:-.02em;line-height:1.3;white-space:nowrap}
.vcm-tag small{font-weight:500;font-size:11px;color:#85887e}
.vcm-tag.dr{flex-direction:row-reverse;align-self:flex-end;padding:5px 11px 5px 15px}
.vcm-zone.L .vcm-group{align-items:flex-end}
.vcm-dot{width:10px;height:10px;border-radius:50%;background:var(--c);flex:none;display:inline-block}
.vcm-logos{display:flex;flex-wrap:wrap;gap:14px 12px;padding-left:30px;align-items:flex-end}
.vcm-zone.L .vcm-logos{justify-content:flex-end;padding:0 30px 0 0}
.vcm-item{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;text-decoration:none;color:inherit;min-width:60px;padding:2px 3px 0;border-radius:12px}
.vcm-logo{display:block;object-fit:contain;max-width:none;border:0;background:none;box-shadow:none;border-radius:0;transition:transform .15s}.vcm-logo.tile{border-radius:12px}
.vcm-tk{font-size:calc(13px*var(--k) + 1.5px);font-weight:800;color:#33443a;letter-spacing:.2px;line-height:1.2}
.vcm-item:hover .vcm-logo{transform:scale(1.08)}
.vcm-item.me{outline:2.5px solid var(--green);outline-offset:3px;background:#f3faf5}.vcm-item.me .vcm-tk{color:var(--green)}
.vcm-miss{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:12px;background:var(--mint);color:var(--darkgreen);font-size:12px;font-weight:800}
.vcm-group.bare{flex-direction:row;gap:60px;align-items:flex-start}
.vcm-bi{display:flex;flex-direction:column;align-items:center;gap:12px}
/* 카드형(칸이 좁을 때): 선 없이 단계별 카드로 쌓는다 */
.vcm.cards .vcm-fit{overflow:visible;height:auto!important}
.vcm.cards .vcm-map{width:auto!important;height:auto!important;transform:none!important}
.vcm.cards .vcm-in{position:static;width:auto;height:auto;transform:none!important;display:block;column-count:var(--cols,2);column-gap:14px}
.vcm.cards .vcm-wires{display:none}
.vcm.cards .vcm-center,.vcm.cards .vcm-node,.vcm.cards .vcm-zone{position:static;transform:none;left:auto;top:auto;width:auto!important;max-width:none!important}
.vcm.cards .vcm-center{display:block;column-span:all;width:fit-content!important;margin:0 auto 16px;font-size:30px;padding:14px 34px}.vcm.cards .vcm-break{display:none}
.vcm.cards .vcm-stage{break-inside:avoid;margin:0 0 14px;width:100%;display:flex;flex-direction:column;gap:10px;background:#fff;border:2px solid color-mix(in srgb,var(--c) 45%,#fff);border-radius:20px;padding:12px 12px 14px;min-width:0}
.vcm.cards .vcm-node{align-self:flex-start;font-size:20px;padding:9px 20px;box-shadow:none}
.vcm.cards .vcm-zone,.vcm.cards .vcm-zone.L,.vcm.cards .vcm-zone.R,.vcm.cards .vcm-zone.T,.vcm.cards .vcm-zone.B{display:flex;flex-direction:column;gap:14px}
.vcm.cards .vcm-zone.L .vcm-group{align-items:flex-start}
.vcm.cards .vcm-tag,.vcm.cards .vcm-tag.dr{flex-direction:row;align-self:flex-start;padding:4px 14px 4px 10px;font-size:15px}
.vcm.cards .vcm-logos,.vcm.cards .vcm-zone.L .vcm-logos{justify-content:flex-start;padding:0;gap:12px 6px}
.vcm.cards .vcm-item{min-width:64px}.vcm.cards .vcm-tk{font-size:12.5px}
.vcm.cards .vcm-group.bare{flex-wrap:wrap;gap:12px 8px}.vcm.cards .vcm-bi .vcm-dot{display:none}
.vcm.cards .vcm-tabs{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:6px}
.vcm.cards .vcm-lb{display:none}

/* 헤더의 "자세히 +" 버튼과 팝업(한 탭 한눈에 보기) */
.vcm>.heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.vcm .vcm-more{border:1px solid var(--line);background:transparent;border-radius:8px;padding:6px 12px;font:inherit;font-size:13px;font-weight:600;color:inherit;cursor:pointer;white-space:nowrap}.vcm .vcm-more:hover{background:var(--mint)}
.vcm-pop{flex:1;min-height:0;display:flex;flex-direction:column;padding:10px 14px 12px}
.vcm-pop .vcm-tabs{flex:none;margin-bottom:8px}
.vcm-pop .vcm-fit{flex:1;min-height:0}
.vcm-pop.cards .vcm-fit{overflow:auto}
/* 모바일 본문(자세히+ 팝업 제외): 대분류 탭을 4열 격자로 작게, 지도가 남은 칸을 채우게 */
@media(max-width:760px){
 body>main .vcm .vcm-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 0 6px}
 body>main .vcm .vcm-tabs button{padding:5px 1px;font-size:10.5px;letter-spacing:-.5px;border-radius:7px;min-width:0!important;overflow:hidden;text-overflow:clip}
}
