https://www.mobileindex.com/home/_next/static/chunks/0w3421-vbz6hc.js

1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,13940,e=>{"use strict";var t=e.i(32380),l=e.i(84131),a=e.i(15288),r=e.i(71339),s=e.i(23191),i=e.i(46383),n=e.i(34906),o=e.i(32645);let c={src:e.i(63637).default,width:48,height:48,blurWidth:8,blurHeight:8,blurDataURL:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAArElEQVR42k2PQQrCQAxFA1IshZmmiLhScKF4BRcW2hu58SSuegUXXkDpPbzHdDnx/3FQFx9C8vLzIyIyK4qic849VDVAE+oRvZ4zYeG9f61U47ZWW0ML1OxxUUhjK7Ze7Vo1dq7UdoDYo6vQErLWqT3LxoZS7fABqCD5rp0A3OaN3QH9AZPkcPEI4AL7ofoCPDEyZJdC1ho3GOyh5S8kP0lv9jks8wS6pg8wewPhQUIuxSP9lAAAAABJRU5ErkJggg=="};var x=e.i(9754);x.SITE_URL,x.SITE_URL;let d=["모바일 앱 데이터와 카드 결제 데이터를","왜 같이 봐야할까요?"],f=["모바일 앱 데이터와 카드 결제","데이터를 왜 같이 봐야할까요?"],h="ex) 넷플릭스",m="넷플릭스",p="의 지난달 데이터입니다. 어떤 데이터를 보고 있느냐에 따라 같은 상황이 위기로도, 기회로도 읽힙니다.",b=[{tag:{strong:"모바일 앱 데이터",rest:"만 봤을 때"},titleLines:["이탈이 시작됐다!","해지 방어 캠페인을","돌리자!"],moTitleLines:["이탈이 시작됐다!","해지 방어 캠페인을 돌리자!"],body:[{text:"월간 앱 사용자 수 14.5% 감소. 이 데이터만 보면 "},{text:"“이탈이 시작됐다, 해지 방어 캠페인을 돌리자”",bold:!0},{text:"는 결론에 이릅니다."}],bars:[{label:"1월",height:131,tone:"light"},{label:"2월",height:76,tone:"dark"}],moBars:[{label:"1월",height:103,tone:"light"},{label:"2월",height:76,tone:"dark"}],caption:"[넷플릭스] 월간 앱 사용자 수",change:"-14.5%",emoji:"😨",position:"top-79"},{tag:{strong:"결제 데이터",rest:"만 봤을 때"},titleLines:["같은 기간 신용카드","월 결제 금액은 1.7%만 줄었네? 뭐지?"],moTitleLines:["같은 기간 신용카드 월 결제","금액은 1.7%만 줄었네? 뭐지?"],body:[{text:"신용카드 월간 결제 금액 1.7% 감소. 이 데이터만 보면 "},{text:"“매출은 멀쩡하다”에서 멈춥니다.",bold:!0},{text:" 왜 앱을 덜 켜는지 알 수 없습니다."}],bars:[{label:"1월",height:70,tone:"light"},{label:"2월",height:42,tone:"dark"}],moBars:[{label:"1월",height:76,tone:"light"},{label:"2월",height:47,tone:"dark"}],caption:"[넷플릭스] 카드 월간 결제금액",change:"-1.7%",emoji:"🤔",position:"top-153"}],y={tag:"두 데이터를 함께 봤을 때",titleLines:["해지가 아니라 인게이지먼트 저하였구나.","재방문을 되살려야겠다!"],bodyLines:["유저는 앱은 덜 사용했지만 결제 데이터를 봤을땐 구독은 끊지 않았습니다.","이건 해지가 아니라 ‘인게이지먼트 저하’로 볼 수 있습니다."],conclusion:{label:"결론",headline:"인게이지먼트 저하",body:"볼거리와 재방문 유도, 즉 사용 빈도를 되살리는 캠페인을 진행하세요.",bold:"하나의 데이터만 봤다면, 전혀 다른 의사결정이 나올 수 있습니다."},chart:{title:"앱 사용자 수 & 카드 결제 금액",subtitle:"같은 기간 감소폭, 공통 축 기준 ・ 앱 이용성 데이터 x 소비 인덱스"}};function u({emoji:e,className:l=""}){return(0,t.jsxs)("span",{className:`pointer-events-none absolute block h-87 w-89 ${l}`,"aria-hidden":"true",children:[(0,t.jsx)("span",{className:"rounded-circle text-h2 absolute top-0 left-9 flex h-80 w-80 items-center justify-center bg-white/80 leading-40 shadow-[0_10px_40px_rgba(0,0,0,0.2)]",children:e}),(0,t.jsx)("svg",{width:"29.5444",height:"15.9501",viewBox:"0 0 29.5444 15.9501",fill:"none",className:"absolute top-53 left-0 -rotate-[34deg]",children:(0,t.jsx)("path",{d:"M1.7628 11.3487C11.1041 8.91685 15.1438 3.21674 16.0444 0L29.5444 8.5C21.6935 16.3509 10.272 16.7986 1.4453 15.2162C-0.698292 14.8319 -0.344711 11.8974 1.7628 11.3487Z",fill:"white",fillOpacity:"0.8"})})]})}function j(){let e=(0,r.useRef)(null),[a,s]=(0,r.useState)(0);return(0,r.useEffect)(()=>{let t=e.current;if(!t)return;let l=[],a=new IntersectionObserver(([e])=>{e?.isIntersecting&&(a.disconnect(),s(1),l.push(setTimeout(()=>s(2),700)),l.push(setTimeout(()=>s(3),1200)),l.push(setTimeout(()=>s(4),1900)))},{threshold:.4});return a.observe(t),()=>{a.disconnect(),l.forEach(clearTimeout)}},[]),(0,t.jsxs)("div",{ref:e,className:"bg-background-inverse border-border-base flex flex-col gap-12 rounded-xl border p-32",children:[(0,t.jsxs)("div",{className:"flex flex-col items-start gap-12 md:flex-row md:items-center",children:[(0,t.jsxs)("span",{className:"bg-background-inverse border-border-base rounded-circle text-body-sm text-font-base flex shrink-0 items-center gap-8 border px-8 py-4 font-bold",children:[(0,t.jsx)(l.default,{src:c,alt:"",width:24,height:24,"aria-hidden":"true"}),h]}),(0,t.jsxs)("p",{className:"text-body-lg text-font-subtle flex-1",children:[(0,t.jsx)("strong",{className:"text-font-base font-semibold",children:m}),p]})]}),(0,t.jsx)("div",{className:"flex flex-col gap-20 xl:flex-row",children:b.map((e,l)=>

1(0,t.jsx)(g,{card:e,variant:0===l?"users":"payment",showChange:a>=(0===l?1:3),showEmoji:a>=(0===l?2:4)},e.caption))})]})}function g({card:e,variant:l,showChange:r,showEmoji:s}){return(0,t.jsxs)(a.default,{as:"div",tone:"base-variant",radius:"lg",className:"relative flex min-w-0 flex-1 basis-auto flex-col gap-20 p-32 md:h-390 xl:basis-0",children:[(0,t.jsxs)("span",{className:"rounded-circle text-body-lg text-font-inverse bg-font-base flex h-40 w-fit items-center justify-center px-20 font-medium",children:[e.tag.strong,e.tag.rest]}),(0,t.jsxs)("div",{className:"flex flex-1 flex-col gap-24 md:flex-row md:items-end",children:[(0,t.jsxs)("div",{className:"flex flex-col justify-center gap-16 md:min-w-200 md:flex-1 md:self-stretch",children:[(0,t.jsx)("p",{className:"text-body-3xl text-font-base font-bold",children:e.titleLines.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle break-keep md:max-w-200",children:e.body.map(e=>e.bold?(0,t.jsx)("strong",{className:"font-bold",children:e.text},e.text):(0,t.jsx)("span",{children:e.text},e.text))})]}),(0,t.jsxs)("div",{className:"relative flex flex-col justify-end gap-20 px-16 pt-16 md:w-260 md:self-stretch",children:[(0,t.jsx)("div",{className:"border-border-base flex h-131 items-end justify-center gap-16 overflow-hidden border-b",children:e.bars.map(e=>(0,t.jsx)("div",{className:`relative flex w-80 items-end justify-center rounded-t-sm pb-8 ${"dark"===e.tone?"bg-font-base":"bg-[#dbdbdb]"}`,style:{height:`${e.height}px`},children:(0,t.jsx)("span",{className:`text-body-md font-medium ${"dark"===e.tone?"text-font-inverse":"text-font-subtle"}`,children:e.label})},e.label))}),(0,t.jsx)("p",{className:"text-body-lg text-font-subtle text-center",children:e.caption}),"users"===l?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("span",{className:`text-body-3xl text-font-base absolute top-23 left-1/2 -translate-x-1/2 px-16 py-12 font-bold transition-opacity duration-500 ${r?"opacity-100":"opacity-0"}`,children:e.change}),(0,t.jsx)(v,{variant:"users",className:`absolute top-75 left-83 transition-all duration-700 ${r?"translate-y-0 opacity-100":"-translate-y-12 opacity-0"}`})]}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("span",{className:`text-body-2xl text-font-base absolute top-99 left-85 px-16 py-8 font-bold transition-opacity duration-500 ${r?"opacity-100":"opacity-0"}`,children:e.change}),(0,t.jsx)(v,{variant:"payment",className:`absolute top-142 left-82 transition-all duration-700 ${r?"translate-y-0 opacity-100":"-translate-y-12 opacity-0"}`})]})]})]}),(0,t.jsx)(u,{emoji:e.emoji,className:`${e.position??"top-79"} right-16 transition-all duration-500 ${s?"scale-100 opacity-100":"scale-90 opacity-0"}`})]})}function v({variant:e,className:l=""}){return"users"===e?(0,t.jsx)("svg",{width:"96.0125",height:"57.8587",viewBox:"0 0 96.0125 57.8587",fill:"none","aria-hidden":"true",className:l,children:(0,t.jsx)("path",{d:"M96.0125 57.8587L90.3847 47.776L84.4667 57.6912L96.0125 57.8587ZM0.512511 0.858681L0 1.71736L1.70536 2.73522L2.21787 1.87654L2.73038 1.01786L1.02502 0L0.512511 0.858681ZM5.62858 3.91225L5.11607 4.77093L8.52679 6.80665L9.0393 5.94797L9.55181 5.08929L6.14109 3.05357L5.62858 3.91225ZM12.45 7.98368L11.9375 8.84236L15.3482 10.8781L15.8607 10.0194L16.3732 9.16071L12.9625 7.125L12.45 7.98368ZM19.2714 12.0551L18.7589 12.9138L22.1696 14.9495L22.6822 14.0908L23.1947 13.2321L19.7839 11.1964L19.2714 12.0551ZM26.0929 16.1265L25.5804 16.9852L28.9911 19.0209L29.5036 18.1623L30.0161 17.3036L26.6054 15.2679L26.0929 16.1265ZM32.9143 20.198L32.4018 21.0566L35.8125 23.0924L36.325 22.2337L36.8375 21.375L33.4268 19.3393L32.9143 20.198ZM39.7357 24.2694L39.2232 25.1281L42.6339 27.1638L43.1464 26.3051L43.659 25.4464L40.2482 23.4107L39.7357 24.2694ZM46.5572 28.3408L46.0446 29.1995L49.4554 31.2352L49.9679 30.3765L50.4804 29.5179L47.0697 27.4821L46.5572 28.3408ZM53.3786 32.4123L52.8661 33.2709L56.2768 35.3067L56.7893 34.448L57.3018 33.5893L53.8911 31.5536L53.3786 32.4123ZM60.2 36.4837L59.6875 37.3424L63.0982 39.3781L63.6107 38.5194L64.1232 37.6607L60.7125 35.625L60.2 36.4837ZM67.0214 40.5551L66.5089 41.4138L69.9196 43.4495L70.4322 42.5908L70.9447 41.7321L67.534 39.6964L67.0214 40.5551ZM73.8429 44.6265L73.3304 45.4852L76.7411 47.5209L77.2536 46.6623L77.7661 45.8036L74.3554 43.7679L73.8429 44.6265ZM80.6643 48.698L80.1518 49.5566L83.5625 51.5924L84.075 50.7337L84.5875 49.875L81.1768 47.8393L80.6643 48.698ZM87.4857 52.7694L86.9732 53.6281L90.3839 55.6638L90.8964 54.8051L91.4089 53.9464L87.9982 51.9107L87.485

17 52.7694Z",fill:"currentColor",className:"text-font-base"})}):(0,t.jsx)("svg",{width:"92.7413",height:"27.1603",viewBox:"0 0 92.7413 27.1603",fill:"none","aria-hidden":"true",className:l,children:(0,t.jsx)("path",{d:"M92.7413 23.9705L84.43 15.9545L81.6436 27.1603L92.7413 23.9705ZM0.241301 0.97045L0 1.9409L1.92708 2.42007L2.16838 1.44962L2.40969 0.479167L0.482602 0L0.241301 0.97045ZM6.02255 2.40795L5.78125 3.3784L9.63542 4.33673L9.87672 3.36628L10.118 2.39583L6.26385 1.4375L6.02255 2.40795ZM13.7309 4.32462L13.4896 5.29507L17.3438 6.2534L17.5851 5.28295L17.8264 4.3125L13.9722 3.35417L13.7309 4.32462ZM21.4392 6.24128L21.1979 7.21173L25.0521 8.17007L25.2934 7.19962L25.5347 6.22917L21.6805 5.27083L21.4392 6.24128ZM29.1476 8.15795L28.9063 9.1284L32.7604 10.0867L33.0017 9.11628L33.243 8.14583L29.3889 7.1875L29.1476 8.15795ZM36.8559 10.0746L36.6146 11.0451L40.4687 12.0034L40.7101 11.033L40.9514 10.0625L37.0972 9.10417L36.8559 10.0746ZM44.5642 11.9913L44.3229 12.9617L48.1771 13.9201L48.4184 12.9496L48.6597 11.9792L44.8055 11.0208L44.5642 11.9913ZM52.2725 13.9079L52.0312 14.8784L55.8854 15.8367L56.1267 14.8663L56.368 13.8958L52.5138 12.9375L52.2725 13.9079ZM59.9809 15.8246L59.7396 16.7951L63.5937 17.7534L63.8351 16.783L64.0764 15.8125L60.2222 14.8542L59.9809 15.8246ZM67.6892 17.7413L67.4479 18.7117L71.3021 19.6701L71.5434 18.6996L71.7847 17.7292L67.9305 16.7708L67.6892 17.7413ZM75.3976 19.658L75.1563 20.6284L79.0104 21.5867L79.2517 20.6163L79.493 19.6458L75.6389 18.6875L75.3976 19.658ZM83.1059 21.5746L82.8646 22.5451L86.7188 23.5034L86.9601 22.533L87.2014 21.5625L83.3472 20.6042L83.1059 21.5746Z",fill:"currentColor",className:"text-font-base"})})}x.SITE_URL,x.SITE_URL;let L=1600;function N(){let{tag:e,titleLines:l,bodyLines:r,conclusion:s,chart:i}=y,{ref:c,inView:x,after:d}=(0,o.useInViewThen)(.5,L);return(0,t.jsx)(a.default,{as:"div",className:"p-32",children:(0,t.jsxs)(a.default,{as:"div",tone:"base-variant",radius:"lg",className:"flex flex-col gap-20 p-32",children:[(0,t.jsxs)("span",{className:"bg-primary rounded-circle text-body-lg text-font-inverse flex h-40 w-fit items-center gap-8 px-20 font-medium",children:[(0,t.jsx)(w,{}),e]}),(0,t.jsxs)("div",{className:"flex flex-col gap-24 lg:flex-row lg:items-center",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-24 lg:flex-1",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-16",children:[(0,t.jsx)("p",{className:"text-body-3xl text-font-base font-bold",children:l.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:r.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))})]}),(0,t.jsxs)("div",{className:`bg-primary/10 relative flex flex-col gap-4 roun

1ded-lg p-16 transition-all duration-700 ease-out ${d?"translate-y-0 opacity-100":"translate-y-12 opacity-0"}`,children:[(0,t.jsxs)("div",{className:"flex items-center gap-8",children:[(0,t.jsxs)("span",{className:"text-body-lg text-primary flex items-center gap-4 font-semibold",children:[(0,t.jsx)(n.default,{}),s.label]}),(0,t.jsx)("span",{className:"text-body-lg text-font-base font-semibold",children:s.headline})]}),(0,t.jsxs)("p",{className:"text-body-md text-font-base",children:[s.body,(0,t.jsx)("br",{}),(0,t.jsx)("strong",{className:"font-bold",children:s.bold})]})]})]}),(0,t.jsx)("div",{className:"lg:flex-1",children:(0,t.jsx)(k,{ref:c,title:i.title,subtitle:i.subtitle,animate:x})})]})]})})}function k({ref:e,title:l,subtitle:a,animate:r}){let s={transform:r?"translateY(37px) scaleY(1) translateY(-37px)":"translateY(37px) scaleY(0.02) translateY(-37px)",transition:"transform 1000ms ease-out"};return(0,t.jsxs)("div",{ref:e,className:"border-border-base overflow-hidden rounded-xl border",children:[(0,t.jsxs)("div",{className:"bg-background-inverse border-border-base flex flex-col gap-8 border-b px-24 py-16",children:[(0,t.jsx)("p",{className:"text-body-lg text-font-base leading-20 font-semibold",children:l}),(0,t.jsx)("p",{className:"text-body-sm text-font-subtle",children:a})]}),(0,t.jsxs)("div",{className:"bg-background-inverse flex flex-col gap-16 px-24 py-20",children:[(0,t.jsxs)("div",{className:"flex flex-wrap items-center gap-x-20 gap-y-8",children:[(0,t.jsxs)("span",{className:"text-body-sm flex items-center gap-8 whitespace-nowrap",children:[(0,t.jsx)("span",{className:"bg-primary rounded-circle h-2 w-10"}),(0,t.jsx)("span",{className:"text-font-base font-medium",children:"앱 사용자수"}),(0,t.jsx)("span",{className:"text-primary font-semibold",children:"-14.5%"})]}),(0,t.jsxs)("span",{className:"text-body-sm flex items-center gap-8 whitespace-nowrap",children:[(0,t.jsx)("span",{className:"border-font-tertiary w-10 border-t-2 border-dashed"}),(0,t.jsx)("span",{className:"text-font-base font-medium",children:"카드 결제금액"}),(0,t.jsx)("span",{className:"text-font-tertiary font-semibold",children:"-1.7%"})]})]}),(0,t.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,t.jsxs)("div",{className:"relative h-126",children:[(0,t.jsxs)("svg",{viewBox:"0 0 460 126",preserveAspectRatio:"none",fill:"none",className:"h-full w-full","aria-hidden":"true",children:[(0,t.jsx)("path",{d:"M0 0V126H460",stroke:"var(--color-border-base)",strokeWidth:"1"}),(0,t.jsx)("path",{d:"M35.6 37L420.6 47",stroke:"currentColor",strokeWidth:"2",strokeDasharray:"6 5",strokeLinecap:"round",className:"text-font-tertiary",style:s}),(0,t.jsx)("path",{d:"M35.6 37L418.9 93.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",className:"text-primary",style:s})]}),(0,t.jsx)("span",{className:`text-body-sm text-font-tertiary absolute top-6 left-[73%] flex items-center gap-4 roun

1ded-sm bg-black/5 p-8 font-semibold whitespace-nowrap transition-opacity duration-500 ${r?"opacity-100":"opacity-0"}`,style:{transitionDelay:"800ms"},children:"카드 결제 금액 -1.7%"}),(0,t.jsx)("span",{className:`text-body-sm text-primary bg-primary/10 absolute top-75 left-[41%] flex items-center gap-4 rounded-sm p-8 font-semibold whitespace-nowrap transition-opacity duration-500 ${r?"opacity-100":"opacity-0"}`,style:{transitionDelay:"800ms"},children:"앱 사용자수 -14.5%"})]}),(0,t.jsxs)("div",{className:"text-body-sm text-font-base flex items-center justify-between font-medium",children:[(0,t.jsx)("span",{children:"1월"}),(0,t.jsx)("span",{children:"2월"})]})]})]})]})}function w(){return(0,t.jsx)("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none","aria-hidden":"true",className:"shrink-0",children:(0,t.jsx)("path",{d:"M14.25 14.25H1.95C1.52996 14.25 1.31994 14.25 1.15951 14.1683C1.01839 14.0964 0.903654 13.9816 0.831749 13.8405C0.750004 13.6801 0.750004 13.47 0.750004 13.05V0.75M14.25 3.75L10.1743 7.82574C10.0258 7.97424 9.95151 8.0485 9.86589 8.07632C9.79057 8.10079 9.70944 8.10079 9.63412 8.07632C9.5485 8.0485 9.47425 7.97424 9.32574 7.82574L7.92427 6.42426C7.77576 6.27576 7.70151 6.2015 7.61589 6.17368C7.54057 6.14921 7.45944 6.14921 7.38412 6.17368C7.2985 6.2015 7.22425 6.27576 7.07574 6.42426L3.75 9.75M14.25 6.75V3.75H11.25",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}function A(){let[e,l]=(0,r.useState)(0);return(0,t.jsxs)("div",{className:"flex flex-col items-center gap-16 md:hidden",children:[(0,t.jsxs)("div",{onScroll:e=>l((0,s.snapIndex)(e.currentTarget,16)),className:"scrollbar-hide flex w-full snap-x snap-mandatory gap-16 overflow-x-auto",children:[b.map((e,l)=>(0,t.jsxs)(C,{children:[(0,t.jsxs)("div",{className:"flex flex-col gap-16",children:[(0,t.jsxs)("span",{className:"rounded-circle text-body-sm text-font-inverse bg-font-base w-fit px-12 py-8 font-medium",children:[e.tag.strong,e.tag.rest]}),(0,t.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,t.jsx)("p",{className:"text-body-xl text-font-base font-bold",children:(e.moTitleLines??e.titleLines).map(e=>(0,t.jsx)("span",{className:"block",children:e},e))}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:e.body.map(e=>e.bold?(0,t.jsx)("strong",{className:"font-bold",children:e.text},e.text):(0,t.jsx)("span",{children:e.text},e.text))})]})]}),(0,t.jsx)(S,{card:e,variant:0===l?"users":"payment"})]},e.caption)),(0,t.jsxs)(C,{children:[(0,t.jsxs)("div",{className:"flex flex-col gap-16",children:[(0,t.jsxs)("span",{className:"bg-primary rounded-circle text-body-sm text-font-inverse flex w-fit items-center gap-4 px-12 py-8 font-medium",children:[(0,t.jsx)(w,{}),y.tag]}),(0,t.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,t.jsx)("p",{className:"text-body-xl text-font-base font-bold",children:y.titleLines.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:y.bodyLines.join(" ")})]})]}),(0,t.jsxs)("div",{className:"bg-primary/10 flex flex-col gap-4 roun

1ded-lg p-16",children:[(0,t.jsxs)("div",{className:"flex items-center gap-8",children:[(0,t.jsxs)("span",{className:"text-body-lg text-primary flex items-center gap-4 font-semibold",children:[(0,t.jsx)(n.default,{}),y.conclusion.label]}),(0,t.jsx)("span",{className:"text-body-lg text-font-base font-semibold",children:y.conclusion.headline})]}),(0,t.jsxs)("p",{className:"text-body-md text-font-base",children:[y.conclusion.body,(0,t.jsx)("br",{}),(0,t.jsx)("strong",{className:"font-bold",children:y.conclusion.bold})]})]})]})]}),(0,t.jsx)(s.default,{count:3,active:e})]})}function C({children:e}){return(0,t.jsxs)("article",{className:"bg-background-inverse flex w-full shrink-0 snap-center flex-col gap-16 rounded-xl px-20 py-24 drop-shadow-[0_0_5px_rgba(0,0,0,0.1)]",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-12",children:[(0,t.jsxs)("span",{className:"bg-background-inverse border-border-base rounded-circle text-body-sm text-font-base flex w-fit shrink-0 items-center gap-8 border px-8 py-4 font-bold",children:[(0,t.jsx)(l.default,{src:c,alt:"",width:24,height:24,"aria-hidden":"true"}),h]}),(0,t.jsxs)("p",{className:"text-body-md text-font-subtle",children:[(0,t.jsx)("strong",{className:"text-font-base font-semibold",children:m}),p]})]}),(0,t.jsx)(a.default,{as:"div",tone:"base-variant",radius:"lg",className:"flex flex-1 flex-col justify-between gap-24 p-20",children:e})]})}function S({card:e,variant:l}){return(0,t.jsxs)("div",{className:`relative mx-auto flex w-full max-w-[246px] flex-col gap-8 ${"users"===l?"pt-62":"pt-51"}`,children:[(0,t.jsx)("div",{className:"border-border-base flex h-103 items-end justify-center gap-16 overflow-hidden border-b",children:(e.moBars??e.bars).map(e=>(0,t.jsx)("div",{className:`relative flex w-60 items-end justify-center rounded-t-sm pb-4 ${"dark"===e.tone?"bg-font-base":"bg-[#dbdbdb]"}`,style:{height:`${e.height}px`},children:(0,t.jsx)("span",{className:`text-body-md font-medium ${"dark"===e.tone?"text-font-inverse":"text-font-subtle"}`,children:e.label})},e.label))}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle text-center",children:e.caption}),"users"===l?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("span",{className:"text-body-xl text-font-base absolute top-0 left-124 -translate-x-1/2 font-bold",children:e.change}),(0,t.jsx)(v,{variant:"users",className:"absolute top-22 left-70"}),(0,t.jsx)(u,{emoji:e.emoji,className:"top-11 left-172 origin-top-left scale-66"})]}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("span",{className:"text-body-xl text-font-base absolute top-24 left-121 -translate-x-1/2 font-bold",children:e.change}),(0,t.jsx)(v,{variant:"users",className:"absolute top-50 left-73"}),(0,t.jsx)(u,{emoji:e.emoji,className:"top-0 left-172 origin-top-left scale-66"})]})]})}e.s(["default",0,function(){return(0,t.jsx)(i.default,{id:"datacomparison-section",label:"모바일 앱 데이터와 결제 데이터를 함께 보는 이유",className:"bg-background-base xl:py-padding-contents-120 py-48 md:py-80",children:(0,t.jsxs)("div",{className:"flex flex-col gap-24 xl:gap-32",children:[(0,t.jsxs)("div",{className:"flex flex-col items-center gap-16 xl:gap-20",children:[(0,t.jsx)("span",{className:"bg-background-primary border-primary/20 rounded-circle text-body-md text-primary border px-12 py-6 font-medium",children:"데이터를 함께 봐야하는 이유"}),(0,t.jsxs)("h2",{className:"text-body-3xl xl:text-h1 text-font-base text-center font-bold",children:[(0,t.jsx)("span",{className:"block xl:hidden",children:f.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))}),(0,t.jsx)("span",{className:"block max-xl:hidden",children:d.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))})]})]}),(0,t.jsxs)("div",{className:"flex flex-col gap-20 max-md:hidden",children:[(0,t.jsx)(j,{}),(0,t.jsx)(N,{})]}),(0,t.jsx)(A,{})]})})}],13940)},33210,e=>{"use strict";var t=e.i(32380),l=e.i(84131),a=e.i(71339),r=e.i(66306),s=e.i(23191),i=e.i(37918),n=e.i(34906),o=e.i(32645);function c({children:e}){return(0,t.jsx)("span",{className:"max-xl:bg-background-base-variant xl:bg-background-inverse block h-69 w-110 shrink-0 overflow-hidden rounded-sm xl:h-120 xl:w-190",children:(0,t.jsx)("svg",{viewBox:"0 0 920 580",className:"h-full w-full","aria-hidden":"true",children:e})})}let x={primary:void 0,secondary:{"--color-primary":"var(--color-secondary)","--color-font-primary":"var(--color-font-secondary)","--color-background-primary":"#ecf1ff"}};function d({header:e}){return(0,t.jsxs)("div",{className:"flex flex-col gap-24 xl:gap-32",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-16 xl:gap-20",children:[(0,t.jsx)("span",{className:"bg-background-primary border-primary/20 rounded-circle text-body-md text-font-primary w-fit border px-12 py-6 font-medium",children:e.tag}),(0,t.jsxs)("div",{className:"flex flex-col items-start justify-between gap-16 xl:flex-row xl:items-end",children:[(0,t.jsxs)("h2",{className:"text-body-3xl xl:text-h1 text-font-base flex-1 font-bold",children:[(0,t.jsx)("span",{className:"text-font-primary block",children:e.titleAccent}

1),e.titleLines.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))]}),(0,t.jsx)("p",{className:"text-body-lg text-font-subtle max-xl:hidden xl:w-560 xl:text-right",children:e.descriptionLines.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))})]})]}),(0,t.jsx)("div",{className:"grid grid-cols-2 gap-8 xl:grid-cols-4 xl:gap-16",children:e.stats.map((e,l)=>(0,t.jsxs)("div",{className:"border-border-base flex flex-col justify-center gap-4 rounded-lg border p-12 xl:px-16 xl:py-20",children:[(0,t.jsxs)("p",{className:"text-body-md text-font-subtle",children:[(0,t.jsx)("span",{className:"xl:hidden",children:e.moLabel??e.label}),(0,t.jsx)("span",{className:"max-xl:hidden",children:e.label})]}),(0,t.jsx)("p",{className:"text-body-xl xl:text-body-3xl text-font-base h-26 overflow-hidden font-semibold xl:h-36",children:(0,t.jsxs)("span",{className:"animate-roll-y flex flex-col",style:{animationDelay:`${200*l}ms`},children:[(0,t.jsx)("span",{className:"h-26 shrink-0 xl:h-36",children:e.value}),(0,t.jsx)("span",{className:"h-26 shrink-0 xl:h-36","aria-hidden":"true",children:e.value})]})})]},e.label))})]})}function f({rows:e}){let[l,r]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{let e=0,t=requestAnimationFrame(()=>{e=requestAnimationFrame(()=>r(!0))});return()=>{cancelAnimationFrame(t),cancelAnimationFrame(e)}},[]),(0,t.jsx)(t.Fragment,{children:e.map((e,a)=>(0,t.jsxs)("div",{className:"border-border-base flex h-38 items-center border-b transition-all duration-500 ease-out",style:{opacity:+!!l,transform:l?"translateY(0)":"translateY(12px)",transitionDelay:`${80*a}ms`},children:[(0,t.jsx)("span",{className:"text-body-sm xl:text-body-md text-font-base w-24 shrink-0 text-center font-medium xl:w-40",children:a+1}),(0,t.jsx)("span",{className:"text-body-sm xl:text-body-md text-font-base flex-1 px-8 font-medium xl:px-24",children:e.label}),(0,t.jsxs)("div",{className:"flex shrink-0 items-center gap-8 xl:pr-24",children:[(0,t.jsx)("span",{className:"text-body-sm xl:text-body-md text-font-base font-medium",children:e.value}),(0,t.jsx)("span",{className:"bg-background-primary text-body-sm text-primary flex h-20 w-55 items-center justify-center rounded-[6px] font-medium max-xl:hidden",children:e.percent})]})]},e.label))})}let h={1:"bg-primary",2:"bg-primary/80",3:"bg-primary/50",4:"bg-primary/20"};function m(){return(0,t.jsxs)("svg",{width:"11.0773",height:"11.2499",viewBox:"0 0 11.0773 11.2499",fill:"none","aria-hidden":"true",className:"text-primary shrink-0",children:[(0,t.jsx)("path",{d:"M5.89426 1.06685C6.13834 0.82277 6.13834 0.427136 5.89426 0.183058C5.65018 -0.0610195 5.25455 -0.0610194 5.01047 0.183058L0.305066 4.88846C-0.101689 5.29525 -0.101689 5.95466 0.305066 6.36144L5.01047 11.0668C5.25455 11.3109 5.65018 11.3109 5.89426 11.0668C6.13834 10.8228 6.13834 10.4271 5.89426 10.1831L1.33615 5.62495L5.89426 1.06685Z",fill:"currentColor"}),(0,t.jsx)("path",{d:"M10.8943 1.06685C11.1383 0.82277 11.1383 0.427136 10.8943 0.183059C10.6502 -0.0610192 10.2545 -0.0610191 10.0105 0.183059L5.30507 4.88846C4.89831 5.29525 4.89831 5.95466 5.30507 6.36145L10.0105 11.0668C10.2545 11.3109 10.6502 11.3109 10.8943 11.0668C11.1383 10.8228 11.1383 10.4271 10.8943 10.1831L6.33615 5.62495L10.8943 1.06685Z",fill:"currentColor"})]})}let p={"thumb-dau-mau":function(){let e=(0,a.useId)();return(0,t.jsxs)(c,{children:[(0,t.jsx)("defs",{children:(0,t.jsxs)("linearGradient",{id:`${e}-dau-pill`,x1:"0",y1:"0",x2:"1",y2:"0",children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-primary)"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-primary)",stopOpacity:"0.55"})]})}),[{rank:"1",label:"우리 앱",y:101,h:118,pillWidth:467,active:!0},{rank:"2",label:"A앱",y:252,h:96,pillWidth:402,active:!1},{rank:"3",label:"B앱",y:392,h:96,pillWidth:278,active:!1}].map(l=>{let a=l.y+l.h/2;return(0,t.jsxs)("g",{children:[(0,t.jsx)("circle",{cx:"124",cy:a,r:"52",fill:"var(--color-primary)",fillOpacity:l.active?1:.12}),(0,t.jsx)("text",{x:"124",y:a,textAnchor:"middle",dominantBaseline:"central",fontSize:"42",fontWeight:"700",fill:l.active?"var(--color-font-inverse)":"var(--color-primary)",fillOpacity:l.active?1:.55,children:l.rank}),(0,t.jsx)("rect",{x:"205",y:l.y,width:l.pillWidth,height:l.h,rx:l.h/2,fill:l.active?`url(#${e}-dau-pill)`:"var(--color-font-base)",fillOpacity:l.active?1:.05}),(0,t.jsx)("text",{x:"262",y:a,dominantBaseline:"central",fontSize:"40",fontWeight:"700",fill:l.active?"var(--color-font-inverse)":"var(--color-font-base)",children:l.label})]},l.rank)}),(0,t.jsx)("rect",{x:"686",y:"101",width:"196",height:"118",rx:"59",fill:"var(--color-background-inverse)",stroke:"var(--color-primary)",strokeOpacity:"0.2",strokeWidth:"4"}),(0,t.jsx)("text",{x:"784",y:"160",textAnchor:"middle",dominantBaseline:"central",fontSize:"36",fontWeight:"700",fill:"var(--color-primary)",children:"+248%"})]})}

1,"thumb-retention":function(){let e=(0,a.useId)(),l="M80 440 C150 438 200 400 250 350 C300 300 350 292 405 272 C480 246 560 216 625 178 C700 136 780 112 838 100";return(0,t.jsxs)(c,{children:[(0,t.jsx)("defs",{children:(0,t.jsxs)("linearGradient",{id:`${e}-retention-area`,x1:"0",y1:"0",x2:"0",y2:"1",children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-primary)",stopOpacity:"0.22"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-primary)",stopOpacity:"0"})]})}),(0,t.jsx)("path",{d:`${l} L838 468 L80 468 Z`,fill:`url(#${e}-retention-area)`}),(0,t.jsx)("path",{d:"M80 468 H838",stroke:"var(--color-border-base)",strokeWidth:"6",strokeDasharray:"14 14"}),(0,t.jsx)("path",{d:l,fill:"none",stroke:"var(--color-primary)",strokeWidth:"18",strokeLinecap:"round"}),[[405,272],[625,178]].map(([e,l])=>(0,t.jsx)("circle",{cx:e,cy:l,r:"18",fill:"var(--color-background-inverse)",stroke:"var(--color-primary)",strokeWidth:"10"},e)),(0,t.jsx)("circle",{cx:"838",cy:"100",r:"24",fill:"var(--color-primary)",stroke:"var(--color-background-inverse)",strokeWidth:"14"}),(0,t.jsx)("rect",{x:"72",y:"68",width:"223",height:"80",rx:"40",fill:"var(--color-background-inverse)",stroke:"var(--color-primary)",strokeOpacity:"0.2",strokeWidth:"4"}),(0,t.jsx)("text",{x:"183",y:"108",textAnchor:"middle",dominantBaseline:"central",fontSize:"44",fontWeight:"700",fill:"var(--color-primary)",children:"+38%"}),(0,t.jsx)("text",{x:"80",y:"530",fontSize:"32",fill:"var(--color-font-tertiary)",children:"신규 설치"}),(0,t.jsx)("text",{x:"838",y:"530",textAnchor:"end",fontSize:"32",fill:"var(--color-font-tertiary)",children:"신규 설치 후 8주"})]})},"thumb-loyalty":function(){let e="M80 118 L295 352 C420 380 620 398 838 406";return(0,t.jsxs)(c,{children:[(0,t.jsx)("path",{d:`${e} L838 468 L80 468 Z`,fill:"var(--color-primary)",fillOpacity:"0.1"}),(0,t.jsx)("path",{d:"M80 468 H838",stroke:"var(--color-border-base)",strokeWidth:"6",strokeDasharray:"14 14"}),(0,t.jsx)("path",{d:"M458 205 V381",stroke:"var(--color-border-base)",strokeWidth:"6"}),(0,t.jsx)("path",{d:e,fill:"none",stroke:"var(--color-primary)",strokeWidth:"18",strokeLinecap:"round",strokeOpacity:"0.85"}),(0,t.jsx)("rect",{x:"250",y:"105",width:"426",height:"100",rx:"50",fill:"var(--color-background-inverse)",stroke:"var(--color-primary)",strokeOpacity:"0.2",strokeWidth:"4"}),(0,t.jsx)("text",{x:"463",y:"155",textAnchor:"middle",dominantBaseline:"central",fontSize:"40",fontWeight:"700",fill:"var(--color-primary)",children:"4주 후 사용률 35%"}),(0,t.jsx)("circle",{cx:"458",cy:"381",r:"24",fill:"var(--color-primary)",stroke:"var(--color-background-inverse)",strokeWidth:"14"}),(0,t.jsx)("circle",{cx:"838",cy:"406",r:"22",fill:"var(--color-background-inverse)",stroke:"var(--color-primary)",strokeWidth:"12"}),(0,t.jsx)("text",{x:"80",y:"530",fontSize:"32",fill:"var(--color-font-tertiary)",children:"설치"}),(0,t.jsx)("text",{x:"838",y:"530",textAnchor:"end",fontSize:"32",fill:"var(--color-font-tertiary)",children:"설치 후 8주"})]})},"thumb-churn":function(){return(0,t.jsxs)(c,{children:[(0,t.jsx)("rect",{x:"65",y:"88",width:"257",height:"404",rx:"32",fill:"var(--color-primary)",fillOpacity:"0.12"}),(0,t.jsx)("text",{x:"95",y:"148",fontSize:"38",fontWeight:"700",fill:"var(--color-primary)",children:"유입"}),[{label:"A앱",opacity:1},{label:"B앱",opacity:.5},{label:"C앱",opacity:.25}].map((e,l)=>{let a=188+100*l;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:"88",y:a,width:"212",height:"84",rx:"24",fill:"var(--color-background-inverse)"}),(0,t.jsx)("circle",{cx:"124",cy:a+42,r:"15",fill:"var(--color-primary)",fillOpacity:e.opacity}),(0,t.jsx)("text",{x:"160",y:a+42,dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)}),(0,t.jsx)("path",{d:"M330 290 H382",stroke:"var(--color-primary)",strokeWidth:"12",strokeLinecap:"round"}),(0,t.jsx)("path",{d:"M382 272 L400 290 L382 308 Z",fill:"var(--color-primary)"}),(0,t.jsx)("path",{d:"M528 290 H578",stroke:"var(--color-font-base)",strokeOpacity:"0.3",strokeWidth:"12",strokeLinecap:"round"}),(0,t.jsx)("path",{d:"M578 272 L596 290 L578 308 Z",fill:"var(--color-font-base)",fillOpacity:"0.3"}),(0,t.jsx)("circle",{cx:"459",cy:"290",r:"65",fill:"var(--color-primary)"}),(0,t.jsx)("text",{x:"459",y:"290",textAnchor:"middle",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-inverse)",children:"내 앱"}),(0,t.jsx)("rect",{x:"597",y:"88",width:"258",height:"404",rx:"32",fill:"var(--color-font-base)",fillOpacity:"0.05"}),(0,t.jsx)("text",{x:"627",y:"148",fontSize:"38",fontWeight:"700",fill:"var(--color-font-subtle)",children:"이탈"}),[{label:"X앱",opacity:.75},{label:"Y앱",opacity:.4},{label:"Z앱",opacity:.15}].map((e,l)=>{let a=188+100*l;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:"620",y:a,width:"212",height:"84",rx:"24",fill:"var(--color-background-inverse)"}),(0,t.jsx)("circle",{cx:"656",cy:a+42,r:"15",fill:"var(--color-font-base)",fillOpacity:e.opacity}),(0,t.jsx)("text",{x:"692",y:a+42,dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)})]})}

1,"thumb-cross-use":function(){let e=(0,a.useId)();return(0,t.jsxs)(c,{children:[(0,t.jsxs)("defs",{children:[(0,t.jsxs)("radialGradient",{id:`${e}-venn-mine`,children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-primary)",stopOpacity:"0.6"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-primary)",stopOpacity:"0.28"})]}),(0,t.jsxs)("radialGradient",{id:`${e}-venn-rival`,children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-font-base)",stopOpacity:"0.14"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-font-base)",stopOpacity:"0.06"})]})]}),(0,t.jsx)("circle",{cx:"290",cy:"290",r:"200",fill:`url(#${e}-venn-mine)`}),(0,t.jsx)("circle",{cx:"650",cy:"290",r:"200",fill:`url(#${e}-venn-rival)`}),(0,t.jsx)("text",{x:"175",y:"290",textAnchor:"middle",dominantBaseline:"central",fontSize:"42",fontWeight:"700",fill:"var(--color-primary)",children:"우리앱"}),(0,t.jsx)("text",{x:"748",y:"290",textAnchor:"middle",dominantBaseline:"central",fontSize:"42",fontWeight:"700",fill:"var(--color-font-subtle)",children:"경쟁앱"}),(0,t.jsx)("rect",{x:"355",y:"232",width:"215",height:"116",rx:"58",fill:"var(--color-background-inverse)",fillOpacity:"0.92"}),(0,t.jsx)("text",{x:"462",y:"292",textAnchor:"middle",dominantBaseline:"central",fontSize:"62",fontWeight:"700",fill:"var(--color-font-base)",children:"34%"})]})},"thumb-persona":function(){let e=2*Math.PI*155;return(0,t.jsxs)(c,{children:[(0,t.jsxs)("g",{transform:"rotate(-90 287 290)",children:[(0,t.jsx)("circle",{cx:"287",cy:"290",r:155,fill:"none",stroke:"var(--color-font-base)",strokeOpacity:"0.08",strokeWidth:"55"}),(0,t.jsx)("circle",{cx:"287",cy:"290",r:155,fill:"none",stroke:"var(--color-primary)",strokeOpacity:"0.6",strokeWidth:"55",strokeLinecap:"round",strokeDasharray:`${.3*e} ${e}`})]}),(0,t.jsx)("text",{x:"287",y:"278",textAnchor:"middle",dominantBaseline:"central",fontSize:"66",fontWeight:"700",fill:"var(--color-font-base)",children:"30%"}),(0,t.jsx)("text",{x:"287",y:"335",textAnchor:"middle",dominantBaseline:"central",fontSize:"30",fill:"var(--color-font-tertiary)",children:"업종 점유율"}),(0,t.jsx)("text",{x:"530",y:"215",fontSize:"36",fontWeight:"700",fill:"var(--color-font-subtle)",children:"전월 대비 ▲2%p"}),(0,t.jsx)("rect",{x:"530",y:"285",width:"290",height:"82",rx:"41",fill:"var(--color-primary)",fillOpacity:"0.15"}),(0,t.jsx)("text",{x:"675",y:"326",textAnchor:"middle",dominantBaseline:"central",fontSize:"38",fontWeight:"700",fill:"var(--color-primary)",children:"업종 내 2위"})]})},"thumb-amount-surge":function(){let e=(0,a.useId)();return(0,t.jsxs)(c,{children:[(0,t.jsx)("defs",{children:(0,t.jsxs)("linearGradient",{id:`${e}-surge-bar`,x1:"0",y1:"0",x2:"0",y2:"1",children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-primary)",stopOpacity:"0.55"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-primary)"})]})}),[{x:75,dotOpacity:.18,label:"2025"},{x:275,dotOpacity:1,label:"2026"}].map(e=>(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:e.x,y:"52",width:"185",height:"80",rx:"24",fill:"var(--color-background-inverse)",stroke:"var(--color-border-base)",strokeWidth:"4"}),(0,t.jsx)("circle",{cx:e.x+40,cy:"92",r:"15",fill:1===e.dotOpacity?"var(--color-primary)":"var(--color-font-base)",fillOpacity:e.dotOpacity}),(0,t.jsx)("text",{x:e.x+73,y:"92",dominantBaseline:"central",fontSize:"38",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)),[{label:"1분기",trackX:82,barTop:260},{label:"2분기",trackX:293,barTop:292},{label:"3분기",trackX:500,barTop:393},{label:"4분기",trackX:708,barTop:337}

1].map(l=>(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:l.trackX,y:"170",width:"110",height:"290",rx:"55",fill:"var(--color-font-base)",fillOpacity:"0.08"}),(0,t.jsx)("path",{d:`M${l.trackX+40} 460 V${l.barTop+42} a42 42 0 0 1 83 0 V460 Z`,fill:`url(#${e}-surge-bar)`}),(0,t.jsx)("text",{x:l.trackX+55,y:"525",textAnchor:"middle",fontSize:"34",fill:"var(--color-font-tertiary)",children:l.label})]},l.label)),(0,t.jsx)("path",{d:"M82 464 H838",stroke:"var(--color-border-base)",strokeWidth:"8",strokeDasharray:"16 14"})]})},"thumb-category-trend":function(){return(0,t.jsx)(c,{children:[{x:90,y:60,w:240,h:455,opacity:.75,label:"기업A",value:"38%, 69억원"},{x:340,y:60,w:240,h:218,opacity:.5,label:"기업B",value:"18%, 24억원"},{x:590,y:60,w:240,h:218,opacity:.32,label:"기업C",value:"18%, 23억원"},{x:340,y:290,w:157,h:225,opacity:.16,label:"D"},{x:508,y:290,w:155,h:225,opacity:.13,label:"E"},{x:673,y:290,w:157,h:225,opacity:.13,label:"F"}].map(e=>{let l=e.x+e.w/2,a=e.y+e.h/2;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:e.x,y:e.y,width:e.w,height:e.h,rx:"20",fill:"var(--color-primary)",fillOpacity:e.opacity}),e.value?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("text",{x:l,y:a-20,textAnchor:"middle",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-inverse)",children:e.label}),(0,t.jsx)("text",{x:l,y:a+22,textAnchor:"middle",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-inverse)",children:e.value})]}):(0,t.jsx)("text",{x:l,y:a,textAnchor:"middle",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-inverse)",children:e.label})]},e.label)})})}

1,"thumb-unit-price":function(){let e=(0,a.useId)();return(0,t.jsxs)(c,{children:[(0,t.jsx)("defs",{children:(0,t.jsxs)("linearGradient",{id:`${e}-unit-bar`,x1:"0",y1:"0",x2:"0",y2:"1",children:[(0,t.jsx)("stop",{offset:"0",stopColor:"var(--color-primary)",stopOpacity:"0.55"}),(0,t.jsx)("stop",{offset:"1",stopColor:"var(--color-primary)"})]})}),[{x:72,label:"객단가"},{x:228,label:"건단가"}].map(e=>(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:e.x,y:"52",width:"145",height:"82",rx:"24",fill:"var(--color-background-inverse)",stroke:"var(--color-border-base)",strokeWidth:"4"}),(0,t.jsx)("text",{x:e.x+73,y:"93",textAnchor:"middle",dominantBaseline:"central",fontSize:"36",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)),[{label:"기업A",x:87,top:262},{label:"기업B",x:297,top:290},{label:"기업C",x:507,top:390},{label:"기업D",x:712,top:337}].map(l=>(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:l.x,y:"168",width:"100",height:"292",fill:"var(--color-font-base)",fillOpacity:"0.08"}),(0,t.jsx)("rect",{x:l.x,y:l.top,width:"100",height:460-l.top,fill:`url(#${e}-unit-bar)`}),(0,t.jsx)("text",{x:l.x+50,y:"525",textAnchor:"middle",fontSize:"34",fill:"var(--color-font-tertiary)",children:l.label})]},l.label)),(0,t.jsx)("path",{d:"M82 464 H838",stroke:"var(--color-border-base)",strokeWidth:"8",strokeDasharray:"16 14"})]})},"thumb-repurchase":function(){let e=[358,560,763];return(0,t.jsxs)(c,{children:[(0,t.jsx)("rect",{x:"75",y:"85",width:"770",height:"410",rx:"24",fill:"var(--color-background-base-variant)"}),(0,t.jsx)("text",{x:"98",y:"122",dominantBaseline:"central",fontSize:"32",fill:"var(--color-font-subtle)",children:"날짜"}),["month+1","month+2","month+3"].map((l,a)=>(0,t.jsx)("text",{x:e[a],y:"122",textAnchor:"middle",dominantBaseline:"central",fontSize:"32",fill:"var(--color-font-subtle)",children:l},l)),[{date:"2025.08",value:"81.26%",opacity:.55},{date:"2025.11",value:"80.12%",opacity:.5},{date:"2025.11",value:"79.12%",opacity:.35},{date:"2025.11",value:"78.26%",opacity:.15}].map((l,a)=>{let r=158+84*a;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:"235",y:r,width:"610",height:"84",fill:"var(--color-primary)",fillOpacity:l.opacity}),(0,t.jsx)("text",{x:"98",y:r+42,dominantBaseline:"central",fontSize:"32",fill:"var(--color-font-base)",children:l.date}),e.map(e=>(0,t.jsx)("text",{x:e,y:r+42,textAnchor:"middle",dominantBaseline:"central",fontSize:"32",fill:"var(--color-font-base)",children:l.value},e))]},`${l.date}-${l.value}`)})]})},"thumb-cross-purchase":function(){let e=[302,487,672],l=[.55,.25,.15];return(0,t.jsxs)(c,{children:[(0,t.jsx)("rect",{x:"302",y:"68",width:"548",height:"112",rx:"32",fill:"var(--color-font-base)",fillOpacity:"0.04"}),[{x:318,label:"A앱",opacity:.8},{x:494,label:"B앱",opacity:.4},{x:670,label:"C앱",opacity:.15}].map(e=>(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:e.x,y:"84",width:"160",height:"80",rx:"24",fill:"var(--color-background-inverse)"}),(0,t.jsx)("circle",{cx:e.x+34,cy:"124",r:"15",fill:"var(--color-font-base)",fillOpacity:e.opacity}),(0,t.jsx)("text",{x:e.x+68,y:"124",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)),(0,t.jsx)("rect",{x:"75",y:"188",width:"200",height:"320",rx:"32",fill:"var(--color-primary)",fillOpacity:"0.1"}),[{label:"A앱",opacity:1},{label:"B앱",opacity:.5},{label:"C앱",opacity:.25}].map((e,l)=>{let a=205+100*l;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:"90",y:a,width:"172",height:"83",rx:"24",fill:"var(--color-background-inverse)"}),(0,t.jsx)("circle",{cx:"133",cy:a+41,r:"15",fill:"var(--color-primary)",fillOpacity:e.opacity}),(0,t.jsx)("text",{x:"165",y:a+41,dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-base)",children:e.label})]},e.label)}),[["30.21%","12.6%","1.03%"],["32.56%","13.8%","0.91%"],["43.54%","6.45%","1.95%"]].map((a,r)=>a.map((a,s)=>{let i=205+100*r;return(0,t.jsxs)("g",{children:[(0,t.jsx)("rect",{x:e[s],y:i,width:"176",height:"83",rx:"20",fill:"var(--color-primary)",fillOpacity:l[s]}),(0,t.jsx)("text",{x:(e[s]??0)+88,y:i+41,textAnchor:"middle",dominantBaseline:"central",fontSize:"34",fontWeight:"700",fill:"var(--color-font-inverse)",children:a})]},`${r}-${s}`)}))]})}

1,"thumb-buyer-profile":function(){return(0,t.jsxs)(c,{children:[[{x:440,label:"싱글",opacity:1},{x:594,label:"신혼",opacity:.5},{x:748,label:"실버",opacity:.12}].map(e=>(0,t.jsxs)("g",{children:[(0,t.jsx)("circle",{cx:e.x,cy:"88",r:"15",fill:"var(--color-primary)",fillOpacity:e.opacity}),(0,t.jsx)("text",{x:e.x+30,y:"88",dominantBaseline:"central",fontSize:"34",fill:"var(--color-font-subtle)",children:e.label})]},e.label)),[{label:"기업A",labelY:170,barY:222,single:194,married:196},{label:"기업B",labelY:375,barY:428,single:89,married:335}].map(e=>(0,t.jsxs)("g",{children:[(0,t.jsx)("text",{x:78,y:e.labelY,dominantBaseline:"central",fontSize:"40",fontWeight:"700",fill:"var(--color-font-base)",children:e.label}),(0,t.jsx)("rect",{x:78,y:e.barY,width:767,height:"83",rx:"41",fill:"var(--color-primary)",fillOpacity:"0.12"}),(0,t.jsx)("path",{d:`M119 ${e.barY} h${e.single+e.married-41} v83 h-${e.single+e.married-41} a41 41 0 0 1 0 -83 Z`,fill:"var(--color-primary)",fillOpacity:"0.42"}),(0,t.jsx)("path",{d:`M119 ${e.barY} h${e.single-41} v83 h-${e.single-41} a41 41 0 0 1 0 -83 Z`,fill:"var(--color-primary)"})]},e.label))]})}};function b({metric:e}){let l=p[e.thumb];return(0,t.jsxs)("div",{className:"bg-background-inverse border-border-base flex items-center justify-between gap-16 rounded-lg border p-16",children:[(0,t.jsxs)("div",{className:"flex min-w-0 flex-1 flex-col gap-4",children:[(0,t.jsx)("p",{className:"text-body-lg text-font-base font-semibold",children:e.title}),(0,t.jsx)("p",{className:"text-body-sm text-font-subtle line-clamp-2",children:e.descriptionLines.join(" ")})]}),(0,t.jsx)(l,{})]})}function y({metric:e}){let l=p[e.thumb];return(0,t.jsxs)("div",{className:"bg-background-base-variant border-border-base flex flex-col items-start justify-between gap-16 overflow-hidden rounded-lg border p-20 xl:flex-row xl:items-center",children:[(0,t.jsxs)("div",{className:"flex flex-col gap-8 xl:w-260",children:[(0,t.jsx)("p",{className:"text-body-xl text-font-base leading-24 font-semibold",children:e.title}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:e.descriptionLines.map(e=>(0,t.jsx)("span",{className:"block",children:e},e))})]}),(0,t.jsx)(l,{})]})}e.s(["MetricGrid",0,function({title:e,metrics:l}){let r=[],i=[...l.left,...l.right];for(let e=0;e<i.length;e+=2)r.push(i.slice(e,e+2));let[n,o]=(0,a.useState)(0);return(0,t.jsxs)("div",{className:"max-xl:bg-background-base-variant xl:bg-background-inverse flex flex-col gap-16 max-xl:rounded-b-lg max-xl:px-20 max-xl:py-24 xl:gap-20 xl:px-32 xl:py-40",children:[(0,t.jsx)("h3",{className:"text-body-xl xl:text-body-2xl max-xl:border-border-base text-font-base font-semibold max-xl:border-b max-xl:pb-16",children:e}),(0,t.jsx)("div",{className:"flex flex-col gap-16 max-xl:hidden xl:flex-row",children:[l.left,l.right].map((e,l)=>(0,t.jsx)("div",{className:"flex flex-1 flex-col gap-16",children:e.map(e=>(0,t.jsx)(y,{metric:e},e.title))},l))}),(0,t.jsxs)("div",{className:"flex flex-col items-center gap-16 xl:hidden",children:[(0,t.jsx)("div",{onScroll:e=>o((0,s.snapIndex)(e.currentTarget,16)),className:"scrollbar-hide flex w-full snap-x snap-mandatory gap-16 overflow-x-auto",children:r.map((e,l)=>(0,t.jsx)("div",{className:"flex w-full shrink-0 snap-center flex-col gap-8",children:e.map(e=>(0,t.jsx)(b,{metric:e},e.title))},l))}),(0,t.jsx)(s.default,{count:r.length,active:n,activeClassName:"bg-primary"})]})]})},"ReportCard",0,function({children:e}){return(0,t.jsx)("div",{className:"flex flex-col xl:overflow-hidden xl:rounded-lg xl:shadow-[0_0_20px_rgba(0,0,0,0.1)]",children:e})},"ReportScreens",0,function({screens:e,images:r}){let[i,n]=(0,a.useState)(0),[o,c]=(0,a.useState)(0);return(0,a.useEffect)(()=>{let t=setInterval(()=>{n(t=>(t+1)%e.length)},5e3);return()=>clearInterval(t)},[e.length]),(0,t.jsxs)("div",{className:"max-xl:bg-background-base-variant xl:bg-background-inverse flex flex-col gap-16 max-xl:mt-20 max-xl:rounded-lg max-xl:px-20 max-xl:py-24 xl:gap-20 xl:rounded-xl xl:px-32 xl:py-40 xl:shadow-[0_0_20px_rgba(0,0,0,0.1)]",children:[(0,t.jsx)("h3",{className:"text-body-xl xl:text-body-2xl max-xl:border-border-base text-font-base font-semibold max-xl:border-b max-xl:pb-16",children:"실제 리포트 화면"}),(0,t.jsxs)("div",{className:"flex flex-col gap-20 max-xl:hidden",children:[(0,t.jsx)("div",{className:"bg-background-base-variant border-border-base flex h-300 items-end justify-center overflow-hidden rounded-xl border md:h-525",children:(0,t.jsx)(l.default,{src:r[i]??r[0],alt:e[i]?.title??"리포트 화면",className:"animate-fade-in border-border-base h-auto w-[89.4%] rounded-t-sm border border-b-0"},i)}),(0,t.jsx)("div",{className:"flex flex-col gap-16 md:flex-row md:gap-32",children:e.map((e,l)=>(0,t.jsxs)("div",{className:"flex flex-1 flex-col gap-24",children:[(0,t.jsx)("span",{className:"relative block h-3 overflow-hidden bg-[#e5e5e5]",children:l===i&&(0,t.jsx)("span",{className:"bg-primary absolute inset-0 origin-left",style:{animation:"progress-x 5000ms linear forwards"}},i)}),(0,t.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,t.jsx)("p",{className:"text-body-lg text-font-base font-semibold",children:e.title}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:e.description})]})]},e.title))})]}),(0,t.jsxs)("div",{className:"flex flex-col items-center gap-16 xl:hidden",children:[(0,t.jsx)("div",{onScroll:e=>c((0,s.snapIndex)(e.currentTarget,16)),className:"scrollbar-hide flex w-full snap-x snap-mandatory gap-16 overflow-x-auto",children:e.map((e,a)=>(0,t.jsxs)("div",{className:"flex w-full shrink-0 snap-center flex-col gap-16",children:[(0,t.jsx)("div",{className:"bg-background-inverse border-border-base flex h-200 items-end justify-center overflow-hidden rounded-lg border",children:(0,t.jsx)(l.default,{src:r[a]??r[0],alt:e.title,className:"border-border-base h-auto w-[90.7%] rounded-t-sm border border-b-0"})}),(0,t.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,t.jsx)("p",{className:"text-body-lg text-font-base font-semibold",children:e.title}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle",children:e.description})]})]},e.title))}),(0,t.jsx)(s.default,{count:e.length,active:o,activeClassName:"bg-primary"})]})]})},"ShareChartCard",0,function({chart:e}){let{ref:l,inView:s,after:i}=(0,o.useInViewThen)(.5,120*e.rows.length+1e3),[c,x]=(0,a.useState)(0),d=!!e.rowsByFilter||!!e.rankRowsByFilter,p=e.rowsByFilter?.[c]??e.rows,b=e.rankRowsByFilter?.[c],y=e.notesByFilter?.[c]??e.note,u=(0,t.jsx)("div",{className:"flex flex-wrap items-center gap-8",children:e.filters.map((e,l)=>{let a=`rounded-circle text-body-md flex h-36 items-center px-14 font-medium ${l===(d?c:0)?"bg-primary text-font-inverse":"bg-background-inverse border-border-base text-font-base border"}`;return d?(0,t.jsx)("button",{type:"button","aria-pressed":l===c,onClick:()=>x(l),className:`${a} cursor-pointer`,children:e},e):(0,t.jsx)("span",{className:a,children:e},e)})});return(0,t.jsxs)("div",{className:"bg-background-base-variant border-border-base flex flex-col gap-16 border-b max-xl:rounded-t-lg max-xl:px-20 max-xl:py-24 xl:gap-20 xl:px-32 xl:py-40",children:[(0,t.jsxs)("div",{className:"flex flex-col items-start justify-between gap-8 xl:flex-row xl:items-center",children:[(0,t.jsxs)("div",{className:"flex flex-wrap items-center gap-8",children:[(0,t.jsx)("p",{className:"text-body-xl xl:text-body-2xl text-font-base font-semibold",children:e.title}),(0,t.jsx)("p",{className:"text-body-md text-font-subtle max-xl:hidden",children:e.subt

1itle})]}),(0,t.jsx)("div",{className:"flex flex-wrap items-center gap-4 max-xl:hidden",children:e.apps.map(e=>(0,t.jsxs)("span",{className:"bg-background-inverse border-border-base rounded-circle text-body-sm text-font-base flex h-32 items-center gap-4 border px-8",children:[(0,t.jsx)("span",{className:"bg-background-base rounded-circle h-20 w-20 shrink-0"}),e]},e))})]}),(0,t.jsx)(r.default,{}),(0,t.jsx)("div",{className:"xl:hidden",children:u}),(0,t.jsxs)("div",{className:"bg-background-inverse border-border-base flex flex-col overflow-hidden rounded-lg border max-xl:gap-16 max-xl:px-16 max-xl:py-20",children:[(0,t.jsxs)("div",{className:"flex flex-wrap items-center gap-16 p-24 max-xl:hidden",children:[u,(0,t.jsxs)("span",{className:"animate-nudge-x text-body-md text-primary flex items-center gap-4",children:[(0,t.jsx)(m,{}),e.hint]})]}),(0,t.jsx)("div",{ref:l,className:"flex flex-col xl:px-24 xl:pb-24",children:b?(0,t.jsx)(f,{rows:b}):p.map((l,a)=>(0,t.jsxs)("div",{className:"flex items-center gap-8 py-4 transition-all duration-500 xl:gap-16 xl:py-8",style:{opacity:+!!s,transform:s?"translateY(0)":"translateY(8px)",transitionDelay:`${120*a}ms`},children:[(0,t.jsxs)("div",{className:"flex flex-1 items-center gap-8 xl:gap-16",children:[(0,t.jsx)("span",{className:"text-body-sm xl:text-body-md text-font-base w-44 shrink-0 font-medium xl:w-80",children:l.label}),(0,t.jsx)("span",{className:"bg-background-base rounded-circle relative block h-14 flex-1 xl:h-20",children:(0,t.jsx)("span",{className:`rounded-circle absolute top-0 left-0 h-full transition-[width] duration-1000 ease-out ${h[l.tone]} ${i&&1===l.tone?"animate-[bar-pulse_0.6s_ease-in-out_2]":""}`,style:{width:s?`${l.ratio}%`:"0%",transitionDelay:`${120*a+200}ms`}})})]}),(0,t.jsxs)("div",{className:"flex shrink-0 items-center gap-8",children:[(0,t.jsx)("span",{className:`text-body-sm xl:text-body-md text-font-base font-medium ${e.valueClassName??""}`,children:l.value}),(0,t.jsx)("span",{className:"bg-background-primary text-body-sm text-primary flex h-20 w-55 items-center justify-center rounded-[6px] font-medium max-xl:hidden",children:l.percent})]})]},a))}),(0,t.jsx)("div",{className:"xl:px-24",children:(0,t.jsxs)("p",{className:"text-body-sm xl:text-body-md text-font-subtle flex items-center gap-8 border-t border-black py-12 max-xl:pb-0 xl:py-24",children:[(0,t.jsx)(n.default,{}),(0,t.jsx)("span",{children:y.map(e=>e.bold?(0,t.jsx)("strong",{className:"text-primary font-bold",children:e.text},e.text):(0,t.jsx)("span",{children:e.text},e.text))})]})})]})]})},"default",0,function({id:e,label:l,header:a,children:r,paddingClassName:s="py-48 md:py-80 xl:pt-padding-contents-120 xl:pb-0"}){return(0,t.jsx)("section",{id:e,"aria-label":l,className:`${s} px-20 xl:px-32`,style:x[a.tone],children:(0,t.jsx)(i.default,{children:(0,t.jsxs)("div",{className:"flex flex-col gap-24 xl:gap-32",children:[(0,t.jsx)(d,{header:a}),(0,t.jsx)("div",{className:"xl:bg-background-base flex flex-col xl:gap-24 xl:rounded-lg xl:p-48",children:r})]})})})}],33210)}]);