maru_design2 2.2.0 → 2.4.0

package/dist/index.js

@@ -85,13 +85,14 @@ function styleInject(css, ref) {
 var css_248z$d = "* {\n  /* HTML5 display-role reset for older browsers */\n}\n* html,\n* body,\n* div,\n* span,\n* applet,\n* object,\n* iframe,\n* h1,\n* h2,\n* h3,\n* h4,\n* h5,\n* h6,\n* p,\n* blockquote,\n* pre,\n* a,\n* abbr,\n* acronym,\n* address,\n* big,\n* cite,\n* code,\n* del,\n* dfn,\n* em,\n* img,\n* ins,\n* kbd,\n* q,\n* s,\n* samp,\n* small,\n* strike,\n* strong,\n* sub,\n* sup,\n* tt,\n* var,\n* b,\n* u,\n* i,\n* center,\n* dl,\n* dt,\n* dd,\n* ol,\n* ul,\n* li,\n* fieldset,\n* form,\n* label,\n* legend,\n* table,\n* caption,\n* tbody,\n* tfoot,\n* thead,\n* tr,\n* th,\n* td,\n* article,\n* aside,\n* canvas,\n* details,\n* embed,\n* figure,\n* figcaption,\n* footer,\n* header,\n* hgroup,\n* menu,\n* nav,\n* output,\n* ruby,\n* section,\n* summary,\n* time,\n* mark,\n* audio,\n* video {\n  padding: 0;\n  border: 0;\n  margin: 0;\n  font: inherit;\n  font-size: 100%;\n  vertical-align: baseline;\n}\n* article,\n* aside,\n* details,\n* figcaption,\n* figure,\n* footer,\n* header,\n* hgroup,\n* menu,\n* nav,\n* section {\n  display: block;\n}\n* ol,\n* ul {\n  list-style: none;\n}\n* blockquote,\n* q {\n  quotes: none;\n}\n* blockquote::before,\n* blockquote::after,\n* q::before,\n* q::after {\n  content: \"\";\n  content: none;\n}\n* table {\n  border-collapse: collapse;\n  border-spacing: 0;\n}\n* html {\n  box-sizing: border-box;\n}\n* *,\n* *::before,\n* *::after {\n  box-sizing: inherit;\n}";
 styleInject(css_248z$d);
 
-var css_248z$c = ":root {\n  --primary: var(--p);\n  --primary-50-per: var(--p-50-per);\n  --primary-50: var(--p-50);\n  --primary-20-per: var(--p-20-per);\n  --primary-20: var(--p-20);\n  --primary-10-per: var(--p-10-per);\n  --primary-10: var(--p-10);\n}\n\n[data-theme=blue] {\n  --p: #308acc;\n  --p-50-per: #308acc80;\n  --p-50: #97c4e5;\n  --p-20-per: #308acc33;\n  --p-20: #d6e8f5;\n  --p-10-per: #308acc1a;\n  --p-10: #eaf3fa;\n}\n\n[data-theme=green] {\n  --p: #096412;\n  --p-50-per: #09641280;\n  --p-50: #84b188;\n  --p-20-per: #09641233;\n  --p-20: #cee0d0;\n  --p-10-per: #0964121a;\n  --p-10: #e6ede6;\n}";
+var css_248z$c = "@font-face {\n  font-family: \"Pretendard\";\n  src: url(\"../../assets/fonts/PretendardVariable.woff2\") format(\"woff2-variations\");\n}\n:root {\n  --primary: var(--p);\n  --primary-50-per: var(--p-50-per);\n  --primary-50: var(--p-50);\n  --primary-20-per: var(--p-20-per);\n  --primary-20: var(--p-20);\n  --primary-10-per: var(--p-10-per);\n  --primary-10: var(--p-10);\n}\n\n[data-theme=blue] {\n  --p: #308acc;\n  --p-50-per: #308acc80;\n  --p-50: #97c4e5;\n  --p-20-per: #308acc33;\n  --p-20: #d6e8f5;\n  --p-10-per: #308acc1a;\n  --p-10: #eaf3fa;\n}\n\n[data-theme=green] {\n  --p: #096412;\n  --p-50-per: #09641280;\n  --p-50: #84b188;\n  --p-20-per: #09641233;\n  --p-20: #cee0d0;\n  --p-10-per: #0964121a;\n  --p-10: #e6ede6;\n}";
 styleInject(css_248z$c);
 
 function StyleProvider(_a) {
   var children = _a.children,
     theme = _a.theme;
   return jsx("div", __assign({
+    id: "style-root",
     "data-theme": theme
   }, {
     children: children
@@ -221,7 +222,7 @@ var useColor = function useColor(color) {
 /* eslint-disable quotes */
 /* eslint-disable quote-props */
 var iconmap = {
-  "K": {
+  "KThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -232,7 +233,7 @@ var iconmap = {
     }],
     "circles": []
   },
-  "T": {
+  "TThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -243,7 +244,7 @@ var iconmap = {
     }],
     "circles": []
   },
-  "V": {
+  "VThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -293,20 +294,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "AlertTriangle": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M11.9998 9.00023V13.0002M11.9998 17.0002H12.0098M10.6151 3.89195L2.39019 18.0986C1.93398 18.8866 1.70588 19.2806 1.73959 19.6039C1.769 19.886 1.91677 20.1423 2.14613 20.309C2.40908 20.5002 2.86435 20.5002 3.77487 20.5002H20.2246C21.1352 20.5002 21.5904 20.5002 21.8534 20.309C22.0827 20.1423 22.2305 19.886 22.2599 19.6039C22.2936 19.2806 22.0655 18.8866 21.6093 18.0986L13.3844 3.89195C12.9299 3.10679 12.7026 2.71421 12.4061 2.58235C12.1474 2.46734 11.8521 2.46734 11.5935 2.58235C11.2969 2.71421 11.0696 3.10679 10.6151 3.89195Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "ArrowRightThin": {
     "width": "18",
     "height": "18",
@@ -433,20 +420,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Calendar": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M21 10H3M16 2V6M8 2V6M7.8 22H16.2C17.8802 22 18.7202 22 19.362 21.673C19.9265 21.3854 20.3854 20.9265 20.673 20.362C21 19.7202 21 18.8802 21 17.2V8.8C21 7.11984 21 6.27976 20.673 5.63803C20.3854 5.07354 19.9265 4.6146 19.362 4.32698C18.7202 4 17.8802 4 16.2 4H7.8C6.11984 4 5.27976 4 4.63803 4.32698C4.07354 4.6146 3.6146 5.07354 3.32698 5.63803C3 6.27976 3 7.11984 3 8.8V17.2C3 18.8802 3 19.7202 3.32698 20.362C3.6146 20.9265 4.07354 21.3854 4.63803 21.673C5.27976 22 6.11984 22 7.8 22Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "CheckboxIndeterminateThin": {
     "width": "18",
     "height": "18",
@@ -460,19 +433,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "CheckboxIndeterminate": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M2.43597 4.18404C2 5.03969 2 6.15979 2 8.4V15.6C2 17.8402 2 18.9603 2.43597 19.816C2.81947 20.5686 3.43139 21.1805 4.18404 21.564C5.03969 22 6.15979 22 8.4 22H15.6C17.8402 22 18.9603 22 19.816 21.564C20.5686 21.1805 21.1805 20.5686 21.564 19.816C22 18.9603 22 17.8402 22 15.6V8.4C22 6.15979 22 5.03969 21.564 4.18404C21.1805 3.43139 20.5686 2.81947 19.816 2.43597C18.9603 2 17.8402 2 15.6 2H8.4C6.15979 2 5.03969 2 4.18404 2.43597C3.43139 2.81947 2.81947 3.43139 2.43597 4.18404ZM7 11C6.44772 11 6 11.4477 6 12C6 12.5523 6.44772 13 7 13H17C17.5523 13 18 12.5523 18 12C18 11.4477 17.5523 11 17 11H7Z",
-      "fill": "#8C8C8C",
-      "fillRule": "evenodd",
-      "clipRule": "evenodd"
-    }],
-    "circles": []
-  },
   "CheckboxOffThin": {
     "width": "18",
     "height": "18",
@@ -484,17 +444,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "CheckboxOff": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M16.8722 2C18.6553 2 19.3018 2.18565 19.9537 2.53427C20.6055 2.88288 21.1171 3.39446 21.4657 4.04631C21.8143 4.69816 22 5.34473 22 7.12777V16.8722C22 18.6553 21.8143 19.3018 21.4657 19.9537C21.1171 20.6055 20.6055 21.1171 19.9537 21.4657C19.3018 21.8143 18.6553 22 16.8722 22H7.12777C5.34473 22 4.69816 21.8143 4.04631 21.4657C3.39446 21.1171 2.88288 20.6055 2.53427 19.9537C2.18565 19.3018 2 18.6553 2 16.8722V7.12777C2 5.34473 2.18565 4.69816 2.53427 4.04631C2.88288 3.39446 3.39446 2.88288 4.04631 2.53427C4.69816 2.18565 5.34473 2 7.12777 2H16.8722ZM17.4361 4H6.56389C5.67237 4 5.34908 4.09283 5.02315 4.26713C4.69723 4.44144 4.44144 4.69723 4.26713 5.02315C4.09283 5.34908 4 5.67237 4 6.56389V17.4361C4 18.3276 4.09283 18.6509 4.26713 18.9768C4.44144 19.3028 4.69723 19.5586 5.02315 19.7329C5.34908 19.9072 5.67237 20 6.56389 20H17.4361C18.3276 20 18.6509 19.9072 18.9768 19.7329C19.3028 19.5586 19.5586 19.3028 19.7329 18.9768C19.9072 18.6509 20 18.3276 20 17.4361V6.56389C20 5.67237 19.9072 5.34908 19.7329 5.02315C19.5586 4.69723 19.3028 4.44144 18.9768 4.26713C18.6509 4.09283 18.3276 4 17.4361 4Z",
-      "fill": "#8C8C8C"
-    }],
-    "circles": []
-  },
   "CheckboxOnThin": {
     "width": "18",
     "height": "18",
@@ -508,19 +457,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "CheckboxOn": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M2.43597 4.18404C2 5.03969 2 6.15979 2 8.4V15.6C2 17.8402 2 18.9603 2.43597 19.816C2.81947 20.5686 3.43139 21.1805 4.18404 21.564C5.03969 22 6.15979 22 8.4 22H15.6C17.8402 22 18.9603 22 19.816 21.564C20.5686 21.1805 21.1805 20.5686 21.564 19.816C22 18.9603 22 17.8402 22 15.6V8.4C22 6.15979 22 5.03969 21.564 4.18404C21.1805 3.43139 20.5686 2.81947 19.816 2.43597C18.9603 2 17.8402 2 15.6 2H8.4C6.15979 2 5.03969 2 4.18404 2.43597C3.43139 2.81947 2.81947 3.43139 2.43597 4.18404ZM18.2071 9.20711C18.5976 8.81658 18.5976 8.18342 18.2071 7.79289C17.8166 7.40237 17.1834 7.40237 16.7929 7.79289L10 14.5858L7.20711 11.7929C6.81658 11.4024 6.18342 11.4024 5.79289 11.7929C5.40237 12.1834 5.40237 12.8166 5.79289 13.2071L9.29289 16.7071C9.68342 17.0976 10.3166 17.0976 10.7071 16.7071L18.2071 9.20711Z",
-      "fill": "#8C8C8C",
-      "fillRule": "evenodd",
-      "clipRule": "evenodd"
-    }],
-    "circles": []
-  },
   "ChevronDownThin": {
     "width": "18",
     "height": "18",
@@ -633,20 +569,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "ChevronSelectorVerticalThin": {
-    "width": "18",
-    "height": "18",
-    "viewBox": "0 0 18 18",
-    "fill": "none",
-    "paths": [{
-      "d": "M5.25 11.25L9 15L12.75 11.25M5.25 6.75L9 3L12.75 6.75",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "1.5",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "ChevronSelectorVertical": {
     "width": "24",
     "height": "24",
@@ -801,20 +723,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Copy03": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M8 8V5.2C8 4.0799 8 3.51984 8.21799 3.09202C8.40973 2.71569 8.71569 2.40973 9.09202 2.21799C9.51984 2 10.0799 2 11.2 2H18.8C19.9201 2 20.4802 2 20.908 2.21799C21.2843 2.40973 21.5903 2.71569 21.782 3.09202C22 3.51984 22 4.0799 22 5.2V12.8C22 13.9201 22 14.4802 21.782 14.908C21.5903 15.2843 21.2843 15.5903 20.908 15.782C20.4802 16 19.9201 16 18.8 16H16M5.2 22H12.8C13.9201 22 14.4802 22 14.908 21.782C15.2843 21.5903 15.5903 21.2843 15.782 20.908C16 20.4802 16 19.9201 16 18.8V11.2C16 10.0799 16 9.51984 15.782 9.09202C15.5903 8.71569 15.2843 8.40973 14.908 8.21799C14.4802 8 13.9201 8 12.8 8H5.2C4.0799 8 3.51984 8 3.09202 8.21799C2.71569 8.40973 2.40973 8.71569 2.21799 9.09202C2 9.51984 2 10.0799 2 11.2V18.8C2 19.9201 2 20.4802 2.21799 20.908C2.40973 21.2843 2.71569 21.5903 3.09202 21.782C3.51984 22 4.07989 22 5.2 22Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "CornerDownRightThin": {
     "width": "18",
     "height": "18",
@@ -843,7 +751,7 @@ var iconmap = {
     }],
     "circles": []
   },
-  "CornerUpLeft": {
+  "CornerUpLeftThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -851,13 +759,13 @@ var iconmap = {
     "paths": [{
       "d": "M6.75 10.5L3 6.75M3 6.75L6.75 3M3 6.75H7.8C10.3202 6.75 11.5804 6.75 12.543 7.24047C13.3897 7.6719 14.0781 8.36031 14.5095 9.20704C15 10.1696 15 11.4298 15 13.95V15",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
     "circles": []
   },
-  "CornerUpRight": {
+  "CornerUpRightThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -865,7 +773,7 @@ var iconmap = {
     "paths": [{
       "d": "M3 15V13.95C3 11.4298 3 10.1696 3.49047 9.20704C3.9219 8.36031 4.61031 7.6719 5.45704 7.24047C6.41965 6.75 7.67976 6.75 10.2 6.75H15M15 6.75L11.25 10.5M15 6.75L11.25 3",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -885,21 +793,21 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Cursor04": {
+  "Cursor04Thin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
     "fill": "none",
     "paths": [{
-      "d": "M3.3052 2.56028C2.96151 2.45919 2.78966 2.40865 2.67266 2.45227C2.5707 2.49028 2.49028 2.5707 2.45227 2.67266C2.40865 2.78966 2.45919 2.96151 2.56028 3.3052L5.7147 14.0302C5.80864 14.3496 5.85561 14.5093 5.9504 14.5834C6.03312 14.6481 6.13917 14.6752 6.24277 14.658C6.36149 14.6383 6.47919 14.5206 6.71459 14.2852L8.9999 11.9999L12.3256 15.3256C12.4741 15.4741 12.5484 15.5484 12.634 15.5762C12.7093 15.6007 12.7905 15.6007 12.8658 15.5762C12.9514 15.5484 13.0257 15.4741 13.1742 15.3256L15.3256 13.1742C15.4741 13.0257 15.5484 12.9514 15.5762 12.8658C15.6007 12.7905 15.6007 12.7093 15.5762 12.634C15.5484 12.5484 15.4741 12.4741 15.3256 12.3256L11.9999 8.9999L14.2852 6.71459C14.5206 6.47919 14.6383 6.36149 14.658 6.24277C14.6752 6.13917 14.6481 6.03312 14.5834 5.9504C14.5093 5.85561 14.3496 5.80864 14.0302 5.7147L3.3052 2.56028Z",
+      "d": "M3.30532 2.56028C2.96163 2.45919 2.78979 2.40865 2.67278 2.45227C2.57082 2.49028 2.4904 2.5707 2.45239 2.67266C2.40877 2.78966 2.45932 2.96151 2.5604 3.3052L5.71483 14.0302C5.80876 14.3496 5.85573 14.5093 5.95052 14.5834C6.03324 14.6481 6.13929 14.6752 6.24289 14.658C6.36161 14.6383 6.47931 14.5206 6.71471 14.2852L9.00002 11.9999L12.3258 15.3256C12.4743 15.4741 12.5485 15.5484 12.6341 15.5762C12.7095 15.6007 12.7906 15.6007 12.8659 15.5762C12.9515 15.5484 13.0258 15.4741 13.1743 15.3256L15.3258 13.1742C15.4743 13.0257 15.5485 12.9514 15.5763 12.8658C15.6008 12.7905 15.6008 12.7093 15.5763 12.634C15.5485 12.5484 15.4743 12.4741 15.3258 12.3256L12 8.9999L14.2853 6.71459C14.5207 6.47919 14.6384 6.36149 14.6581 6.24277C14.6753 6.13917 14.6483 6.03312 14.5836 5.9504C14.5094 5.85561 14.3497 5.80864 14.0304 5.7147L3.30532 2.56028Z",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
     "circles": []
   },
-  "CursorBox": {
+  "CursorBoxThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -907,7 +815,7 @@ var iconmap = {
     "paths": [{
       "d": "M15.75 7.125V5.85C15.75 4.58988 15.75 3.95982 15.5048 3.47852C15.2891 3.05516 14.9448 2.71095 14.5215 2.49524C14.0402 2.25 13.4101 2.25 12.15 2.25H5.85C4.58988 2.25 3.95982 2.25 3.47852 2.49524C3.05516 2.71095 2.71095 3.05516 2.49524 3.47852C2.25 3.95982 2.25 4.58988 2.25 5.85V12.15C2.25 13.4101 2.25 14.0402 2.49524 14.5215C2.71095 14.9448 3.05516 15.289 3.47852 15.5048C3.95982 15.75 4.58988 15.75 5.85 15.75H7.125M13.0397 13.2835L11.7659 15.649C11.5577 16.0356 11.4536 16.2289 11.3268 16.2794C11.2166 16.3232 11.0922 16.3123 10.9913 16.2501C10.8751 16.1784 10.8061 15.97 10.6681 15.5531L8.6253 9.38348C8.50442 9.01841 8.44398 8.83588 8.48744 8.71432C8.52526 8.60853 8.60853 8.52526 8.71432 8.48744C8.83588 8.44399 9.01841 8.50442 9.38348 8.6253L15.5531 10.6681C15.97 10.8061 16.1784 10.8751 16.2501 10.9913C16.3123 11.0922 16.3232 11.2166 16.2794 11.3268C16.2289 11.4536 16.0356 11.5577 15.6489 11.7659L13.2835 13.0397C13.2246 13.0714 13.1951 13.0872 13.1693 13.1076C13.1464 13.1257 13.1257 13.1464 13.1076 13.1693C13.0872 13.1951 13.0714 13.2246 13.0397 13.2835Z",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -1203,32 +1111,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "DotsVertical": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }, {
-      "d": "M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }, {
-      "d": "M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "DownThin": {
     "width": "18",
     "height": "18",
@@ -1254,20 +1136,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Download01": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M21 15V16.2C21 17.8802 21 18.7202 20.673 19.362C20.3854 19.9265 19.9265 20.3854 19.362 20.673C18.7202 21 17.8802 21 16.2 21H7.8C6.11984 21 5.27976 21 4.63803 20.673C4.07354 20.3854 3.6146 19.9265 3.32698 19.362C3 18.7202 3 17.8802 3 16.2V15M17 10L12 15M12 15L7 10M12 15V3",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "Downstream": {
     "width": "24",
     "height": "24",
@@ -1302,29 +1170,15 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Edit03": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M12 20.0002H21M3 20.0002H4.67454C5.16372 20.0002 5.40832 20.0002 5.63849 19.945C5.84256 19.896 6.03765 19.8152 6.2166 19.7055C6.41843 19.5818 6.59138 19.4089 6.93729 19.063L19.5 6.50023C20.3285 5.6718 20.3285 4.32865 19.5 3.50023C18.6716 2.6718 17.3285 2.6718 16.5 3.50023L3.93726 16.063C3.59136 16.4089 3.4184 16.5818 3.29472 16.7837C3.18506 16.9626 3.10425 17.1577 3.05526 17.3618C3 17.5919 3 17.8365 3 18.3257V20.0002Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
-  "Expand": {
+  "ExpandThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
     "fill": "none",
     "paths": [{
-      "d": "M12 6L15.75 2.25M15.75 2.25H12M15.75 2.25V6M6 6L2.25 2.25M2.25 2.25L2.25 6M2.25 2.25L6 2.25M6 12L2.25 15.75M2.25 15.75H6M2.25 15.75L2.25 12M12 12L15.75 15.75M15.75 15.75V12M15.75 15.75H12",
+      "d": "M11.7292 6.39583L15.0625 3.0625M15.0625 3.0625H11.7292M15.0625 3.0625V6.39583M6.39583 6.39583L3.0625 3.0625M3.0625 3.0625L3.0625 6.39583M3.0625 3.0625L6.39583 3.0625M6.39583 11.7292L3.0625 15.0625M3.0625 15.0625H6.39583M3.0625 15.0625L3.0625 11.7292M11.7292 11.7292L15.0625 15.0625M15.0625 15.0625V11.7292M15.0625 15.0625H11.7292",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -1563,12 +1417,12 @@ var iconmap = {
     "circles": []
   },
   "FileX02": {
-    "width": "32",
+    "width": "33",
     "height": "32",
-    "viewBox": "0 0 32 32",
+    "viewBox": "0 0 33 32",
     "fill": "none",
     "paths": [{
-      "d": "M18.6667 14.6667H10.6667M13.3334 20.0001H10.6667M21.3334 9.33341H10.6667M26.6667 16.0001V9.06675C26.6667 6.82654 26.6667 5.70643 26.2307 4.85079C25.8472 4.09814 25.2353 3.48622 24.4827 3.10272C23.627 2.66675 22.5069 2.66675 20.2667 2.66675H11.7334C9.49316 2.66675 8.37306 2.66675 7.51741 3.10272C6.76476 3.48622 6.15284 4.09814 5.76935 4.85079C5.33337 5.70643 5.33337 6.82654 5.33337 9.06675V22.9334C5.33337 25.1736 5.33337 26.2937 5.76935 27.1494C6.15284 27.902 6.76476 28.5139 7.51741 28.8974C8.37306 29.3334 9.49316 29.3334 11.7334 29.3334H16M21.3334 21.3334L28 28.0001M28 21.3334L21.3334 28.0001",
+      "d": "M19.1668 14.6665H11.1668M13.8335 19.9998H11.1668M21.8335 9.33317H11.1668M27.1668 15.9998V9.0665C27.1668 6.82629 27.1668 5.70619 26.7309 4.85054C26.3474 4.09789 25.7354 3.48597 24.9828 3.10248C24.1271 2.6665 23.007 2.6665 20.7668 2.6665H12.2335C9.99329 2.6665 8.87318 2.6665 8.01753 3.10248C7.26489 3.48597 6.65296 4.09789 6.26947 4.85054C5.8335 5.70619 5.8335 6.82629 5.8335 9.0665V22.9332C5.8335 25.1734 5.8335 26.2935 6.26947 27.1491C6.65296 27.9018 7.26489 28.5137 8.01753 28.8972C8.87318 29.3332 9.99329 29.3332 12.2335 29.3332H16.5002M21.8335 21.3332L28.5002 27.9998M28.5002 21.3332L21.8335 27.9998",
       "stroke": "#BDBDBD",
       "strokeWidth": "2",
       "strokeLinecap": "round",
@@ -1590,20 +1444,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "FilterLines": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M6 12H18M3 6H21M9 18H15",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "FolderUploadThin": {
     "width": "18",
     "height": "18",
@@ -1703,23 +1543,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Information": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M12.75 16.5V10.5H9.75V12H11.25V16.5H9V18H15V16.5H12.75Z",
-      "fill": "#8C8C8C"
-    }, {
-      "d": "M12 6C11.7775 6 11.56 6.06598 11.375 6.1896C11.19 6.31322 11.0458 6.48892 10.9606 6.69449C10.8755 6.90005 10.8532 7.12625 10.8966 7.34448C10.94 7.56271 11.0472 7.76317 11.2045 7.9205C11.3618 8.07783 11.5623 8.18498 11.7805 8.22839C11.9988 8.2718 12.225 8.24952 12.4305 8.16437C12.6361 8.07922 12.8118 7.93503 12.9354 7.75002C13.059 7.56502 13.125 7.34751 13.125 7.125C13.125 6.82664 13.0065 6.54049 12.7955 6.32951C12.5845 6.11853 12.2984 6 12 6Z",
-      "fill": "#8C8C8C"
-    }, {
-      "d": "M12 22.5C9.9233 22.5 7.89323 21.8842 6.16652 20.7304C4.4398 19.5767 3.09399 17.9368 2.29927 16.0182C1.50455 14.0996 1.29661 11.9884 1.70176 9.95156C2.1069 7.91476 3.10693 6.04383 4.57538 4.57538C6.04383 3.10693 7.91476 2.1069 9.95156 1.70176C11.9884 1.29661 14.0996 1.50455 16.0182 2.29927C17.9368 3.09399 19.5767 4.4398 20.7304 6.16652C21.8842 7.89323 22.5 9.9233 22.5 12C22.5 14.7848 21.3938 17.4555 19.4246 19.4246C17.4555 21.3938 14.7848 22.5 12 22.5ZM12 3C10.22 3 8.47992 3.52785 6.99987 4.51678C5.51983 5.50571 4.36628 6.91132 3.68509 8.55585C3.0039 10.2004 2.82567 12.01 3.17294 13.7558C3.5202 15.5016 4.37737 17.1053 5.63604 18.364C6.89472 19.6226 8.49836 20.4798 10.2442 20.8271C11.99 21.1743 13.7996 20.9961 15.4442 20.3149C17.0887 19.6337 18.4943 18.4802 19.4832 17.0001C20.4722 15.5201 21 13.78 21 12C21 9.61306 20.0518 7.32387 18.364 5.63604C16.6761 3.94822 14.387 3 12 3Z",
-      "fill": "#8C8C8C"
-    }],
-    "circles": []
-  },
   "LineChartDown01": {
     "width": "24",
     "height": "24",
@@ -1762,6 +1585,20 @@ var iconmap = {
     }],
     "circles": []
   },
+  "Lock01Thin": {
+    "width": "16",
+    "height": "16",
+    "viewBox": "0 0 16 16",
+    "fill": "none",
+    "paths": [{
+      "d": "M11.3333 6.66667V5.33333C11.3333 3.49238 9.84094 2 7.99999 2C6.15904 2 4.66666 3.49238 4.66666 5.33333V6.66667M7.99999 9.66667V11M5.86666 14H10.1333C11.2534 14 11.8135 14 12.2413 13.782C12.6176 13.5903 12.9236 13.2843 13.1153 12.908C13.3333 12.4802 13.3333 11.9201 13.3333 10.8V9.86667C13.3333 8.74656 13.3333 8.18651 13.1153 7.75869C12.9236 7.38236 12.6176 7.0764 12.2413 6.88465C11.8135 6.66667 11.2534 6.66667 10.1333 6.66667H5.86666C4.74655 6.66667 4.1865 6.66667 3.75868 6.88465C3.38235 7.0764 3.07639 7.38236 2.88464 7.75869C2.66666 8.18651 2.66666 8.74656 2.66666 9.86667V10.8C2.66666 11.9201 2.66666 12.4802 2.88464 12.908C3.07639 13.2843 3.38235 13.5903 3.75868 13.782C4.1865 14 4.74655 14 5.86666 14Z",
+      "stroke": "#8C8C8C",
+      "strokeWidth": "1.5",
+      "strokeLinecap": "round",
+      "strokeLinejoin": "round"
+    }],
+    "circles": []
+  },
   "LogOut01Thin": {
     "width": "18",
     "height": "18",
@@ -1860,6 +1697,20 @@ var iconmap = {
     }],
     "circles": []
   },
+  "MessageThin": {
+    "width": "18",
+    "height": "18",
+    "viewBox": "0 0 18 18",
+    "fill": "none",
+    "paths": [{
+      "d": "M5.25 6.375H9M5.25 9H11.25M5.25 13.5V15.2516C5.25 15.6513 5.25 15.8511 5.33192 15.9537C5.40317 16.043 5.5112 16.0949 5.6254 16.0948C5.75672 16.0946 5.91275 15.9698 6.22482 15.7201L8.01391 14.2889C8.37939 13.9965 8.56213 13.8503 8.76561 13.7463C8.94615 13.6541 9.13832 13.5867 9.33691 13.5459C9.56075 13.5 9.79477 13.5 10.2628 13.5H12.15C13.4101 13.5 14.0402 13.5 14.5215 13.2548C14.9448 13.039 15.289 12.6948 15.5048 12.2715C15.75 11.7902 15.75 11.1601 15.75 9.9V5.85C15.75 4.58988 15.75 3.95982 15.5048 3.47852C15.289 3.05516 14.9448 2.71095 14.5215 2.49524C14.0402 2.25 13.4101 2.25 12.15 2.25H5.85C4.58988 2.25 3.95982 2.25 3.47852 2.49524C3.05516 2.71095 2.71095 3.05516 2.49524 3.47852C2.25 3.95982 2.25 4.58988 2.25 5.85V10.5C2.25 11.1975 2.25 11.5462 2.32667 11.8323C2.53472 12.6088 3.1412 13.2153 3.91766 13.4233C4.20378 13.5 4.55252 13.5 5.25 13.5Z",
+      "stroke": "#8C8C8C",
+      "strokeWidth": "1.5",
+      "strokeLinecap": "round",
+      "strokeLinejoin": "round"
+    }],
+    "circles": []
+  },
   "MessageXSquare": {
     "width": "24",
     "height": "24",
@@ -1888,20 +1739,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Message": {
-    "width": "18",
-    "height": "18",
-    "viewBox": "0 0 18 18",
-    "fill": "none",
-    "paths": [{
-      "d": "M5.25 6.375H9M5.25 9H11.25M5.25 13.5V15.2516C5.25 15.6513 5.25 15.8511 5.33192 15.9537C5.40317 16.043 5.5112 16.0949 5.6254 16.0948C5.75672 16.0946 5.91275 15.9698 6.22482 15.7201L8.01391 14.2889C8.37939 13.9965 8.56213 13.8503 8.76561 13.7463C8.94615 13.6541 9.13832 13.5867 9.33691 13.5459C9.56075 13.5 9.79477 13.5 10.2628 13.5H12.15C13.4101 13.5 14.0402 13.5 14.5215 13.2548C14.9448 13.039 15.289 12.6948 15.5048 12.2715C15.75 11.7902 15.75 11.1601 15.75 9.9V5.85C15.75 4.58988 15.75 3.95982 15.5048 3.47852C15.289 3.05516 14.9448 2.71095 14.5215 2.49524C14.0402 2.25 13.4101 2.25 12.15 2.25H5.85C4.58988 2.25 3.95982 2.25 3.47852 2.49524C3.05516 2.71095 2.71095 3.05516 2.49524 3.47852C2.25 3.95982 2.25 4.58988 2.25 5.85V10.5C2.25 11.1975 2.25 11.5462 2.32667 11.8323C2.53472 12.6088 3.1412 13.2153 3.91766 13.4233C4.20378 13.5 4.55252 13.5 5.25 13.5Z",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "MoveThin": {
     "width": "18",
     "height": "18",
@@ -1916,20 +1753,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Move": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M15 3H16.2C17.8802 3 18.7202 3 19.362 3.32698C19.9265 3.6146 20.3854 4.07354 20.673 4.63803C21 5.27976 21 6.11985 21 7.8V16.2C21 17.8802 21 18.7202 20.673 19.362C20.3854 19.9265 19.9265 20.3854 19.362 20.673C18.7202 21 17.8802 21 16.2 21H15M10 7L15 12M15 12L10 17M15 12L3 12",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "Network03": {
     "width": "24",
     "height": "24",
@@ -2184,7 +2007,7 @@ var iconmap = {
     }],
     "circles": []
   },
-  "ReverseLeft": {
+  "ReverseLeftThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -2192,7 +2015,7 @@ var iconmap = {
     "paths": [{
       "d": "M3 5.25H10.5C12.9853 5.25 15 7.26472 15 9.75C15 12.2353 12.9853 14.25 10.5 14.25H3M3 5.25L6 2.25M3 5.25L6 8.25",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -2260,20 +2083,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Share03": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M21 9.00001L21 3.00001M21 3.00001H15M21 3.00001L12 12M10 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H16.2C17.8802 21 18.7202 21 19.362 20.673C19.9265 20.3854 20.3854 19.9265 20.673 19.362C21 18.7202 21 17.8802 21 16.2V14",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "SortOutlineThin": {
     "width": "18",
     "height": "18",
@@ -2297,29 +2106,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "SortOutline": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M16.6 18.3984C16.1029 18.3984 15.7 17.9955 15.7 17.4984L15.7 9.05279L13.6364 11.1164C13.2849 11.4679 12.715 11.4679 12.3636 11.1164C12.0121 10.7649 12.0121 10.1951 12.3636 9.8436L15.8929 6.31431C16.2834 5.92379 16.9166 5.92378 17.3071 6.31432L20.8364 9.84361C21.1878 10.1951 21.1878 10.7649 20.8364 11.1164C20.4849 11.4679 19.915 11.4679 19.5636 11.1164L17.5 9.0528L17.5 17.4984C17.5 17.9955 17.0971 18.3984 16.6 18.3984Z",
-      "fill": "#8C8C8C",
-      "fillRule": "evenodd",
-      "clipRule": "evenodd"
-    }, {
-      "d": "M6.59998 17.1184L6.59997 6.9C6.59997 6.40294 7.00291 6 7.49997 6C7.99703 6 8.39997 6.40294 8.39997 6.9L8.39999 17.1184C8.39999 17.6155 7.99704 18.0184 7.49999 18.0184C7.00293 18.0184 6.59999 17.6155 6.59998 17.1184Z",
-      "fill": "#8C8C8C",
-      "fillRule": "evenodd",
-      "clipRule": "evenodd"
-    }, {
-      "d": "M11.7364 13.282C12.0879 13.6335 12.0879 14.2034 11.7364 14.5548L8.20709 18.0841C7.81657 18.4746 7.1834 18.4746 6.79288 18.0841L3.2636 14.5548C2.91213 14.2033 2.91213 13.6335 3.2636 13.282C3.61508 12.9305 4.18493 12.9306 4.5364 13.282L7.49999 16.2456L10.4636 13.282C10.8151 12.9306 11.3849 12.9306 11.7364 13.282Z",
-      "fill": "#8C8C8C",
-      "fillRule": "evenodd",
-      "clipRule": "evenodd"
-    }],
-    "circles": []
-  },
   "StateThin": {
     "width": "18",
     "height": "18",
@@ -2412,15 +2198,15 @@ var iconmap = {
     }],
     "circles": []
   },
-  "SwitchHorizontal02": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
+  "TransformThin": {
+    "width": "18",
+    "height": "18",
+    "viewBox": "0 0 18 18",
     "fill": "none",
     "paths": [{
-      "d": "M4 17H20M20 17L16 13M20 17L16 21M20 7H4M4 7L8 3M4 7L8 11",
+      "d": "M14.25 5.25V12.75M3.75 5.25V12.75M12.75 3.75L5.25 3.75M12.75 14.25H5.25M3.45 5.25H4.05C4.47004 5.25 4.68006 5.25 4.84049 5.16825C4.98161 5.09635 5.09635 4.98161 5.16825 4.84049C5.25 4.68006 5.25 4.47004 5.25 4.05V3.45C5.25 3.02996 5.25 2.81994 5.16825 2.65951C5.09635 2.51839 4.98161 2.40365 4.84049 2.33175C4.68006 2.25 4.47004 2.25 4.05 2.25H3.45C3.02996 2.25 2.81994 2.25 2.65951 2.33175C2.51839 2.40365 2.40365 2.51839 2.33175 2.65951C2.25 2.81994 2.25 3.02996 2.25 3.45V4.05C2.25 4.47004 2.25 4.68006 2.33175 4.84049C2.40365 4.98161 2.51839 5.09635 2.65951 5.16825C2.81994 5.25 3.02996 5.25 3.45 5.25ZM3.45 15.75H4.05C4.47004 15.75 4.68006 15.75 4.84049 15.6683C4.98161 15.5963 5.09635 15.4816 5.16825 15.3405C5.25 15.1801 5.25 14.97 5.25 14.55V13.95C5.25 13.53 5.25 13.3199 5.16825 13.1595C5.09635 13.0184 4.98161 12.9037 4.84049 12.8317C4.68006 12.75 4.47004 12.75 4.05 12.75H3.45C3.02996 12.75 2.81994 12.75 2.65951 12.8317C2.51839 12.9037 2.40365 13.0184 2.33175 13.1595C2.25 13.3199 2.25 13.53 2.25 13.95V14.55C2.25 14.97 2.25 15.1801 2.33175 15.3405C2.40365 15.4816 2.51839 15.5963 2.65951 15.6683C2.81994 15.75 3.02996 15.75 3.45 15.75ZM13.95 5.25H14.55C14.97 5.25 15.1801 5.25 15.3405 5.16825C15.4816 5.09635 15.5963 4.98161 15.6683 4.84049C15.75 4.68006 15.75 4.47004 15.75 4.05V3.45C15.75 3.02996 15.75 2.81994 15.6683 2.65951C15.5963 2.51839 15.4816 2.40365 15.3405 2.33175C15.1801 2.25 14.97 2.25 14.55 2.25H13.95C13.53 2.25 13.3199 2.25 13.1595 2.33175C13.0184 2.40365 12.9037 2.51839 12.8317 2.65951C12.75 2.81994 12.75 3.02996 12.75 3.45V4.05C12.75 4.47004 12.75 4.68006 12.8317 4.84049C12.9037 4.98161 13.0184 5.09635 13.1595 5.16825C13.3199 5.25 13.53 5.25 13.95 5.25ZM13.95 15.75H14.55C14.97 15.75 15.1801 15.75 15.3405 15.6683C15.4816 15.5963 15.5963 15.4816 15.6683 15.3405C15.75 15.1801 15.75 14.97 15.75 14.55V13.95C15.75 13.53 15.75 13.3199 15.6683 13.1595C15.5963 13.0184 15.4816 12.9037 15.3405 12.8317C15.1801 12.75 14.97 12.75 14.55 12.75H13.95C13.53 12.75 13.3199 12.75 13.1595 12.8317C13.0184 12.9037 12.9037 13.0184 12.8317 13.1595C12.75 13.3199 12.75 13.53 12.75 13.95V14.55C12.75 14.97 12.75 15.1801 12.8317 15.3405C12.9037 15.4816 13.0184 15.5963 13.1595 15.6683C13.3199 15.75 13.53 15.75 13.95 15.75Z",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -2493,20 +2279,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "Upload01": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M21 15V16.2C21 17.8802 21 18.7202 20.673 19.362C20.3854 19.9265 19.9265 20.3854 19.362 20.673C18.7202 21 17.8802 21 16.2 21H7.8C6.11984 21 5.27976 21 4.63803 20.673C4.07354 20.3854 3.6146 19.9265 3.32698 19.362C3 18.7202 3 17.8802 3 16.2V15M17 8L12 3M12 3L7 8M12 3V15",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "UserCircleThin": {
     "width": "18",
     "height": "18",
@@ -2591,20 +2363,6 @@ var iconmap = {
     }],
     "circles": []
   },
-  "XLargeThin": {
-    "width": "18",
-    "height": "18",
-    "viewBox": "0 0 18 18",
-    "fill": "none",
-    "paths": [{
-      "d": "M13.5 4.5L4.5 13.5M4.5 4.5L13.5 13.5",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "1.5",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
   "XLarge": {
     "width": "24",
     "height": "24",
@@ -2633,21 +2391,7 @@ var iconmap = {
     }],
     "circles": []
   },
-  "XSmall": {
-    "width": "24",
-    "height": "24",
-    "viewBox": "0 0 24 24",
-    "fill": "none",
-    "paths": [{
-      "d": "M17 7L7 17M7 7L17 17",
-      "stroke": "#8C8C8C",
-      "strokeWidth": "2",
-      "strokeLinecap": "round",
-      "strokeLinejoin": "round"
-    }],
-    "circles": []
-  },
-  "ZoomIn": {
+  "ZoomInThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -2655,13 +2399,13 @@ var iconmap = {
     "paths": [{
       "d": "M15.75 15.75L12.4875 12.4875M8.25 6V10.5M6 8.25H10.5M14.25 8.25C14.25 11.5637 11.5637 14.25 8.25 14.25C4.93629 14.25 2.25 11.5637 2.25 8.25C2.25 4.93629 4.93629 2.25 8.25 2.25C11.5637 2.25 14.25 4.93629 14.25 8.25Z",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
     "circles": []
   },
-  "ZoomOut": {
+  "ZoomOutThin": {
     "width": "18",
     "height": "18",
     "viewBox": "0 0 18 18",
@@ -2669,7 +2413,7 @@ var iconmap = {
     "paths": [{
       "d": "M15.75 15.75L12.4875 12.4875M6 8.25H10.5M14.25 8.25C14.25 11.5637 11.5637 14.25 8.25 14.25C4.93629 14.25 2.25 11.5637 2.25 8.25C2.25 4.93629 4.93629 2.25 8.25 2.25C11.5637 2.25 14.25 4.93629 14.25 8.25Z",
       "stroke": "#8C8C8C",
-      "strokeWidth": "2",
+      "strokeWidth": "1.5",
       "strokeLinecap": "round",
       "strokeLinejoin": "round"
     }],
@@ -2677,13 +2421,12 @@ var iconmap = {
   }
 };
 var ICONS = {
-  "K": "K",
-  "T": "T",
-  "V": "V",
+  "KThin": "KThin",
+  "TThin": "TThin",
+  "VThin": "VThin",
   "AddLineThin": "AddLineThin",
   "AlertCircleThin": "AlertCircleThin",
   "AlertTriangleThin": "AlertTriangleThin",
-  "AlertTriangle": "AlertTriangle",
   "ArrowRightThin": "ArrowRightThin",
   "ArrowRight": "ArrowRight",
   "Atom01Thin": "Atom01Thin",
@@ -2693,13 +2436,9 @@ var ICONS = {
   "BookOpen02": "BookOpen02",
   "CalendarDate": "CalendarDate",
   "CalendarThin": "CalendarThin",
-  "Calendar": "Calendar",
   "CheckboxIndeterminateThin": "CheckboxIndeterminateThin",
-  "CheckboxIndeterminate": "CheckboxIndeterminate",
   "CheckboxOffThin": "CheckboxOffThin",
-  "CheckboxOff": "CheckboxOff",
   "CheckboxOnThin": "CheckboxOnThin",
-  "CheckboxOn": "CheckboxOn",
   "ChevronDownThin": "ChevronDownThin",
   "ChevronDown": "ChevronDown",
   "ChevronLeftDoubleThin": "ChevronLeftDoubleThin",
@@ -2708,7 +2447,6 @@ var ICONS = {
   "ChevronRightDoubleThin": "ChevronRightDoubleThin",
   "ChevronRightThin": "ChevronRightThin",
   "ChevronRight": "ChevronRight",
-  "ChevronSelectorVerticalThin": "ChevronSelectorVerticalThin",
   "ChevronSelectorVertical": "ChevronSelectorVertical",
   "ChevronUpThin": "ChevronUpThin",
   "ChevronUp": "ChevronUp",
@@ -2720,14 +2458,13 @@ var ICONS = {
   "Clipboard": "Clipboard",
   "CodeSnippet02": "CodeSnippet02",
   "Copy03Thin": "Copy03Thin",
-  "Copy03": "Copy03",
   "CornerDownRightThin": "CornerDownRightThin",
   "CornerDownRight": "CornerDownRight",
-  "CornerUpLeft": "CornerUpLeft",
-  "CornerUpRight": "CornerUpRight",
+  "CornerUpLeftThin": "CornerUpLeftThin",
+  "CornerUpRightThin": "CornerUpRightThin",
   "CurrencyDollar": "CurrencyDollar",
-  "Cursor04": "Cursor04",
-  "CursorBox": "CursorBox",
+  "Cursor04Thin": "Cursor04Thin",
+  "CursorBoxThin": "CursorBoxThin",
   "Database01Thin": "Database01Thin",
   "Database01": "Database01",
   "Database02Thin": "Database02Thin",
@@ -2741,14 +2478,11 @@ var ICONS = {
   "DotsGridThin": "DotsGridThin",
   "DotsGrid": "DotsGrid",
   "DotsVerticalThin": "DotsVerticalThin",
-  "DotsVertical": "DotsVertical",
   "DownThin": "DownThin",
   "Download01Thin": "Download01Thin",
-  "Download01": "Download01",
   "Downstream": "Downstream",
   "Edit03Thin": "Edit03Thin",
-  "Edit03": "Edit03",
-  "Expand": "Expand",
+  "ExpandThin": "ExpandThin",
   "FiEyeOffThin": "FiEyeOffThin",
   "FiEyeThin": "FiEyeThin",
   "File02Thin": "File02Thin",
@@ -2767,17 +2501,16 @@ var ICONS = {
   "FileX02Thin": "FileX02Thin",
   "FileX02": "FileX02",
   "FilterLinesThin": "FilterLinesThin",
-  "FilterLines": "FilterLines",
   "FolderUploadThin": "FolderUploadThin",
   "FolderUpload": "FolderUpload",
   "Globe01Thin": "Globe01Thin",
   "GraduationHat01Thin": "GraduationHat01Thin",
   "GraduationHat01": "GraduationHat01",
   "InformationThin": "InformationThin",
-  "Information": "Information",
   "LineChartDown01": "LineChartDown01",
   "Loading02Thin": "Loading02Thin",
   "Loading02": "Loading02",
+  "Lock01Thin": "Lock01Thin",
   "LogOut01Thin": "LogOut01Thin",
   "MessageCheckSquare": "MessageCheckSquare",
   "MessageCheckThin": "MessageCheckThin",
@@ -2785,11 +2518,10 @@ var ICONS = {
   "MessageNotificationThin": "MessageNotificationThin",
   "MessageTextSquare02": "MessageTextSquare02",
   "MessageTextThin": "MessageTextThin",
+  "MessageThin": "MessageThin",
   "MessageXSquare": "MessageXSquare",
   "MessageXThin": "MessageXThin",
-  "Message": "Message",
   "MoveThin": "MoveThin",
-  "Move": "Move",
   "Network03": "Network03",
   "Network04": "Network04",
   "PauseThin": "PauseThin",
@@ -2806,39 +2538,34 @@ var ICONS = {
   "RefreshCcw02": "RefreshCcw02",
   "RefreshCw01Thin": "RefreshCw01Thin",
   "RefreshCw02Thin": "RefreshCw02Thin",
-  "ReverseLeft": "ReverseLeft",
+  "ReverseLeftThin": "ReverseLeftThin",
   "SearchMdThin": "SearchMdThin",
   "SearchMd": "SearchMd",
   "Settings02Thin": "Settings02Thin",
   "Share03Thin": "Share03Thin",
-  "Share03": "Share03",
   "SortOutlineThin": "SortOutlineThin",
-  "SortOutline": "SortOutline",
   "StateThin": "StateThin",
   "StopCircleThin": "StopCircleThin",
   "StopCircle": "StopCircle",
   "SubtractLineThin": "SubtractLineThin",
   "SuccessThin": "SuccessThin",
   "SwitchHorizontal02Thin": "SwitchHorizontal02Thin",
-  "SwitchHorizontal02": "SwitchHorizontal02",
+  "TransformThin": "TransformThin",
   "Trash01Thin": "Trash01Thin",
   "Trash01": "Trash01",
   "Type01": "Type01",
   "UpThin": "UpThin",
   "Upload01Thin": "Upload01Thin",
-  "Upload01": "Upload01",
   "UserCircleThin": "UserCircleThin",
   "UserPlusThin": "UserPlusThin",
   "Users01Thin": "Users01Thin",
   "Users01": "Users01",
   "XCircleThin": "XCircleThin",
   "XCircle": "XCircle",
-  "XLargeThin": "XLargeThin",
   "XLarge": "XLarge",
   "XSmallThin": "XSmallThin",
-  "XSmall": "XSmall",
-  "ZoomIn": "ZoomIn",
-  "ZoomOut": "ZoomOut"
+  "ZoomInThin": "ZoomInThin",
+  "ZoomOutThin": "ZoomOutThin"
 };
 
 function Icon(_a) {
@@ -2884,7 +2611,7 @@ function Icon(_a) {
   }));
 }
 
-var css_248z$b = ".size-small {\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 12px;\n  letter-spacing: -0.48px;\n  font-weight: 600;\n}\n\n.size-normal {\n  padding: 8px 10px;\n  border-radius: 8px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 600;\n}\n\n.size-large {\n  padding: 4px 12px;\n  border-radius: 8px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 600;\n}\n\n.maru-button {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n  border: 0;\n  cursor: pointer;\n  gap: 8px;\n}\n.maru-button:focus-within {\n  outline: none;\n}\n.maru-button:disabled {\n  cursor: default;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.maru-button-primary-default {\n  background-color: var(--p);\n  color: white;\n}\n.maru-button-primary-default:hover {\n  box-shadow: 0 0 6px var(--p);\n}\n.maru-button-primary-default:focus-visible, .maru-button-primary-default:active {\n  box-shadow: none;\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-primary-default-light {\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-primary-default-light:hover {\n  box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-default-light:focus-visible, .maru-button-primary-default-light:active {\n  box-shadow: none;\n  background-color: var(--p);\n  color: white;\n}\n.maru-button-primary-outline {\n  background-color: white;\n  color: var(--p);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n  box-shadow: 0 0 6px var(--p-20);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n  box-shadow: none;\n  background-color: var(--p-20);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n  box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n  box-shadow: none;\n  background-color: var(--p-10);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-text {\n  background-color: white;\n  color: var(--p);\n}\n.maru-button-primary-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-primary-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-primary-color-on-focus:focus-visible, .maru-button-primary-color-on-focus:active {\n  background-color: var(--p-10);\n  color: var(--p);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-secondary-default {\n  background-color: #8c8c8c;\n  color: white;\n  background-color: #e4e4e4;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n  box-shadow: 0 0 6px #8c8c8c;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n  box-shadow: none;\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n  box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n  box-shadow: none;\n  background-color: #8c8c8c;\n  color: white;\n}\n.maru-button-secondary-default-light {\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default-light:hover {\n  box-shadow: 0 0 6px;\n}\n.maru-button-secondary-default-light:focus-visible, .maru-button-secondary-default-light:active {\n  box-shadow: none;\n  background-color: #8c8c8c;\n  color: white;\n}\n.maru-button-secondary-outline {\n  background-color: white;\n  color: #8c8c8c;\n  box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-outline:hover {\n  box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-outline:focus-visible, .maru-button-secondary-outline:active {\n  box-shadow: none;\n  background-color: #e4e4e4;\n  box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-text {\n  background-color: white;\n  color: #8c8c8c;\n}\n.maru-button-secondary-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-secondary-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-secondary-color-on-focus:focus-visible, .maru-button-secondary-color-on-focus:active {\n  background-color: #e4e4e4;\n  color: #5c5c5c;\n  box-shadow: 0 0 0 1px #5c5c5c inset;\n}\n.maru-button-positive-default {\n  background-color: #58c5a6;\n  color: white;\n}\n.maru-button-positive-default:hover {\n  box-shadow: 0 0 6px #58c5a6;\n}\n.maru-button-positive-default:focus-visible, .maru-button-positive-default:active {\n  box-shadow: none;\n  background-color: #eef9f6;\n  color: #58c5a6;\n}\n.maru-button-positive-default-light {\n  background-color: #eef9f6;\n  color: #58c5a6;\n}\n.maru-button-positive-default-light:hover {\n  box-shadow: 0 0 6px rgba(88, 196, 166, 0.5019607843);\n}\n.maru-button-positive-default-light:focus-visible, .maru-button-positive-default-light:active {\n  box-shadow: none;\n  background-color: #58c5a6;\n  color: white;\n}\n.maru-button-positive-outline {\n  background-color: white;\n  color: #58c5a6;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-positive-outline:hover {\n  box-shadow: 0 0 6px #def3ed;\n}\n.maru-button-positive-outline:focus-visible, .maru-button-positive-outline:active {\n  box-shadow: none;\n  background-color: #def3ed;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-positive-text {\n  background-color: white;\n  color: #58c5a6;\n}\n.maru-button-positive-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-positive-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-positive-color-on-focus:focus-visible, .maru-button-positive-color-on-focus:active {\n  background-color: #eef9f6;\n  color: #58c5a6;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-warning-default {\n  background-color: #ffb020;\n  color: white;\n}\n.maru-button-warning-default:hover {\n  box-shadow: 0 0 6px #ffb020;\n}\n.maru-button-warning-default:focus-visible, .maru-button-warning-default:active {\n  box-shadow: none;\n  background-color: #ffefd2;\n  color: #ffb020;\n}\n.maru-button-warning-default-light {\n  background-color: #fff7e9;\n  color: #ffb020;\n}\n.maru-button-warning-default-light:hover {\n  box-shadow: 0 0 6px rgba(255, 177, 32, 0.5019607843);\n}\n.maru-button-warning-default-light:focus-visible, .maru-button-warning-default-light:active {\n  box-shadow: none;\n  background-color: #ffb020;\n  color: white;\n}\n.maru-button-warning-outline {\n  background-color: white;\n  color: #ffb020;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-outline:hover {\n  box-shadow: 0 0 6px #ffefd2;\n}\n.maru-button-warning-outline:focus-visible, .maru-button-warning-outline:active {\n  box-shadow: none;\n  background-color: #ffefd2;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-text {\n  background-color: white;\n  color: #ffb020;\n}\n.maru-button-warning-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-warning-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-warning-color-on-focus:focus-visible, .maru-button-warning-color-on-focus:active {\n  background-color: #ffefd2;\n  color: #ffb020;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-danger-default {\n  background-color: #e53e3e;\n  color: white;\n}\n.maru-button-danger-default:hover {\n  box-shadow: 0 0 6px #e53e3e;\n}\n.maru-button-danger-default:focus-visible, .maru-button-danger-default:active {\n  box-shadow: none;\n  background-color: #fcecec;\n  color: #e53e3e;\n}\n.maru-button-danger-default-light {\n  background-color: #fcecec;\n  color: #e53e3e;\n}\n.maru-button-danger-default-light:hover {\n  box-shadow: 0 0 6px rgba(229, 62, 62, 0.5019607843);\n}\n.maru-button-danger-default-light:focus-visible, .maru-button-danger-default-light:active {\n  box-shadow: none;\n  background-color: #e53e3e;\n  color: white;\n}\n.maru-button-danger-outline {\n  background-color: white;\n  color: #e53e3e;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-outline:hover {\n  box-shadow: 0 0 6px #fad8d8;\n}\n.maru-button-danger-outline:focus-visible, .maru-button-danger-outline:active {\n  box-shadow: none;\n  background-color: #fad8d8;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-text {\n  background-color: white;\n  color: #e53e3e;\n}\n.maru-button-danger-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-danger-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-danger-color-on-focus:focus-visible, .maru-button-danger-color-on-focus:active {\n  background-color: #fcecec;\n  color: #e53e3e;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-success-default {\n  background-color: #308acc;\n  color: white;\n}\n.maru-button-success-default:hover {\n  box-shadow: 0 0 6px #308acc;\n}\n.maru-button-success-default:focus-visible, .maru-button-success-default:active {\n  box-shadow: none;\n  background-color: #eaf3fa;\n  color: #308acc;\n}\n.maru-button-success-default-light {\n  background-color: #eaf3fa;\n  color: #308acc;\n}\n.maru-button-success-default-light:hover {\n  box-shadow: 0 0 6px rgba(48, 138, 204, 0.5019607843);\n}\n.maru-button-success-default-light:focus-visible, .maru-button-success-default-light:active {\n  box-shadow: none;\n  background-color: #308acc;\n  color: white;\n}\n.maru-button-success-outline {\n  background-color: white;\n  color: #308acc;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-outline:hover {\n  box-shadow: 0 0 6px #d6e8f5;\n}\n.maru-button-success-outline:focus-visible, .maru-button-success-outline:active {\n  box-shadow: none;\n  background-color: #d6e8f5;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-text {\n  background-color: white;\n  color: #308acc;\n}\n.maru-button-success-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-success-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-success-color-on-focus:focus-visible, .maru-button-success-color-on-focus:active {\n  background-color: #eaf3fa;\n  color: #308acc;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n\n.maru-button-with-start-icon.size-normal,\n.maru-button-with-end-icon.size-normal {\n  padding: 8px 14px;\n}\n.maru-button-with-start-icon.size-small,\n.maru-button-with-end-icon.size-small {\n  padding: 6px 12px;\n}\n.maru-button-with-start-icon.maru-button-primary-text:hover, .maru-button-with-start-icon.maru-button-primary-text:focus-visible, .maru-button-with-start-icon.maru-button-primary-text:active,\n.maru-button-with-end-icon.maru-button-primary-text:hover,\n.maru-button-with-end-icon.maru-button-primary-text:focus-visible,\n.maru-button-with-end-icon.maru-button-primary-text:active {\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-with-start-icon.maru-button-secondary-default-light:hover, .maru-button-with-start-icon.maru-button-secondary-default-light:focus-visible, .maru-button-with-start-icon.maru-button-secondary-default-light:active,\n.maru-button-with-end-icon.maru-button-secondary-default-light:hover,\n.maru-button-with-end-icon.maru-button-secondary-default-light:focus-visible,\n.maru-button-with-end-icon.maru-button-secondary-default-light:active {\n  box-shadow: none;\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n\n.maru-button-only-icon {\n  padding: 0;\n  justify-content: center;\n  background-color: transparent;\n}\n.maru-button-only-icon:hover, .maru-button-only-icon:focus-visible, .maru-button-only-icon:active {\n  box-shadow: none;\n  background-color: transparent;\n}";
+var css_248z$b = ".size-small {\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 12px;\n  letter-spacing: -0.48px;\n  font-weight: 600;\n}\n\n.size-normal {\n  padding: 8px 10px;\n  border-radius: 8px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 600;\n}\n\n.size-large {\n  padding: 4px 12px;\n  border-radius: 8px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 600;\n}\n\n.maru-button {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n  border: 0;\n  cursor: pointer;\n  gap: 8px;\n}\n.maru-button:focus-within {\n  outline: none;\n}\n.maru-button:disabled {\n  cursor: default;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.maru-button-primary-default {\n  background-color: var(--p);\n  color: white;\n}\n.maru-button-primary-default:hover {\n  box-shadow: 0 0 6px var(--p);\n}\n.maru-button-primary-default:focus-visible, .maru-button-primary-default:active {\n  box-shadow: none;\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-primary-default-light {\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-primary-default-light:hover {\n  box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-default-light:focus-visible, .maru-button-primary-default-light:active {\n  box-shadow: none;\n  background-color: var(--p);\n  color: white;\n}\n.maru-button-primary-outline {\n  background-color: white;\n  color: var(--p);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n  box-shadow: 0 0 6px var(--p-20);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n  box-shadow: none;\n  background-color: var(--p-20);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n  box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n  box-shadow: none;\n  background-color: var(--p-10);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-text {\n  background-color: transparent;\n  color: var(--p);\n}\n.maru-button-primary-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-primary-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-primary-color-on-focus:focus-visible, .maru-button-primary-color-on-focus:active {\n  background-color: var(--p-10);\n  color: var(--p);\n  box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-secondary-default {\n  background-color: #8c8c8c;\n  color: white;\n  background-color: #e4e4e4;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n  box-shadow: 0 0 6px #8c8c8c;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n  box-shadow: none;\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n  box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n  box-shadow: none;\n  background-color: #8c8c8c;\n  color: white;\n}\n.maru-button-secondary-default-light {\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n.maru-button-secondary-default-light:hover {\n  box-shadow: 0 0 6px;\n}\n.maru-button-secondary-default-light:focus-visible, .maru-button-secondary-default-light:active {\n  box-shadow: none;\n  background-color: #8c8c8c;\n  color: white;\n}\n.maru-button-secondary-outline {\n  background-color: white;\n  color: #8c8c8c;\n  box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-outline:hover {\n  box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-outline:focus-visible, .maru-button-secondary-outline:active {\n  box-shadow: none;\n  background-color: #e4e4e4;\n  box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-text {\n  background-color: transparent;\n  color: #8c8c8c;\n}\n.maru-button-secondary-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-secondary-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-secondary-color-on-focus:focus-visible, .maru-button-secondary-color-on-focus:active {\n  background-color: #e4e4e4;\n  color: #5c5c5c;\n  box-shadow: 0 0 0 1px #5c5c5c inset;\n}\n.maru-button-positive-default {\n  background-color: #58c5a6;\n  color: white;\n}\n.maru-button-positive-default:hover {\n  box-shadow: 0 0 6px #58c5a6;\n}\n.maru-button-positive-default:focus-visible, .maru-button-positive-default:active {\n  box-shadow: none;\n  background-color: #eef9f6;\n  color: #58c5a6;\n}\n.maru-button-positive-default-light {\n  background-color: #eef9f6;\n  color: #58c5a6;\n}\n.maru-button-positive-default-light:hover {\n  box-shadow: 0 0 6px rgba(88, 196, 166, 0.5019607843);\n}\n.maru-button-positive-default-light:focus-visible, .maru-button-positive-default-light:active {\n  box-shadow: none;\n  background-color: #58c5a6;\n  color: white;\n}\n.maru-button-positive-outline {\n  background-color: white;\n  color: #58c5a6;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-positive-outline:hover {\n  box-shadow: 0 0 6px #def3ed;\n}\n.maru-button-positive-outline:focus-visible, .maru-button-positive-outline:active {\n  box-shadow: none;\n  background-color: #def3ed;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-positive-text {\n  background-color: transparent;\n  color: #58c5a6;\n}\n.maru-button-positive-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-positive-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-positive-color-on-focus:focus-visible, .maru-button-positive-color-on-focus:active {\n  background-color: #eef9f6;\n  color: #58c5a6;\n  box-shadow: 0 0 0 1px #58c5a6 inset;\n}\n.maru-button-warning-default {\n  background-color: #ffb020;\n  color: white;\n}\n.maru-button-warning-default:hover {\n  box-shadow: 0 0 6px #ffb020;\n}\n.maru-button-warning-default:focus-visible, .maru-button-warning-default:active {\n  box-shadow: none;\n  background-color: #ffefd2;\n  color: #ffb020;\n}\n.maru-button-warning-default-light {\n  background-color: #fff7e9;\n  color: #ffb020;\n}\n.maru-button-warning-default-light:hover {\n  box-shadow: 0 0 6px rgba(255, 177, 32, 0.5019607843);\n}\n.maru-button-warning-default-light:focus-visible, .maru-button-warning-default-light:active {\n  box-shadow: none;\n  background-color: #ffb020;\n  color: white;\n}\n.maru-button-warning-outline {\n  background-color: white;\n  color: #ffb020;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-outline:hover {\n  box-shadow: 0 0 6px #ffefd2;\n}\n.maru-button-warning-outline:focus-visible, .maru-button-warning-outline:active {\n  box-shadow: none;\n  background-color: #ffefd2;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-text {\n  background-color: transparent;\n  color: #ffb020;\n}\n.maru-button-warning-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-warning-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-warning-color-on-focus:focus-visible, .maru-button-warning-color-on-focus:active {\n  background-color: #ffefd2;\n  color: #ffb020;\n  box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-danger-default {\n  background-color: #e53e3e;\n  color: white;\n}\n.maru-button-danger-default:hover {\n  box-shadow: 0 0 6px #e53e3e;\n}\n.maru-button-danger-default:focus-visible, .maru-button-danger-default:active {\n  box-shadow: none;\n  background-color: #fcecec;\n  color: #e53e3e;\n}\n.maru-button-danger-default-light {\n  background-color: #fcecec;\n  color: #e53e3e;\n}\n.maru-button-danger-default-light:hover {\n  box-shadow: 0 0 6px rgba(229, 62, 62, 0.5019607843);\n}\n.maru-button-danger-default-light:focus-visible, .maru-button-danger-default-light:active {\n  box-shadow: none;\n  background-color: #e53e3e;\n  color: white;\n}\n.maru-button-danger-outline {\n  background-color: white;\n  color: #e53e3e;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-outline:hover {\n  box-shadow: 0 0 6px #fad8d8;\n}\n.maru-button-danger-outline:focus-visible, .maru-button-danger-outline:active {\n  box-shadow: none;\n  background-color: #fad8d8;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-text {\n  background-color: transparent;\n  color: #e53e3e;\n}\n.maru-button-danger-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-danger-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-danger-color-on-focus:focus-visible, .maru-button-danger-color-on-focus:active {\n  background-color: #fcecec;\n  color: #e53e3e;\n  box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-success-default {\n  background-color: #308acc;\n  color: white;\n}\n.maru-button-success-default:hover {\n  box-shadow: 0 0 6px #308acc;\n}\n.maru-button-success-default:focus-visible, .maru-button-success-default:active {\n  box-shadow: none;\n  background-color: #eaf3fa;\n  color: #308acc;\n}\n.maru-button-success-default-light {\n  background-color: #eaf3fa;\n  color: #308acc;\n}\n.maru-button-success-default-light:hover {\n  box-shadow: 0 0 6px rgba(48, 138, 204, 0.5019607843);\n}\n.maru-button-success-default-light:focus-visible, .maru-button-success-default-light:active {\n  box-shadow: none;\n  background-color: #308acc;\n  color: white;\n}\n.maru-button-success-outline {\n  background-color: white;\n  color: #308acc;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-outline:hover {\n  box-shadow: 0 0 6px #d6e8f5;\n}\n.maru-button-success-outline:focus-visible, .maru-button-success-outline:active {\n  box-shadow: none;\n  background-color: #d6e8f5;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-text {\n  background-color: transparent;\n  color: #308acc;\n}\n.maru-button-success-color-on-focus {\n  background-color: white;\n  color: #bdbdbd;\n  box-shadow: 0 0 0 1px #bdbdbd inset;\n  padding: 5px 8px !important;\n  gap: 4px;\n}\n.maru-button-success-color-on-focus:hover {\n  box-shadow: 0px 0px 6px 0px #e4e4e4;\n}\n.maru-button-success-color-on-focus:focus-visible, .maru-button-success-color-on-focus:active {\n  background-color: #eaf3fa;\n  color: #308acc;\n  box-shadow: 0 0 0 1px #308acc inset;\n}\n\n.maru-button-with-start-icon.size-normal,\n.maru-button-with-end-icon.size-normal {\n  padding: 8px 14px;\n}\n.maru-button-with-start-icon.size-small,\n.maru-button-with-end-icon.size-small {\n  padding: 6px 12px;\n}\n.maru-button-with-start-icon.maru-button-primary-text:hover, .maru-button-with-start-icon.maru-button-primary-text:focus-visible, .maru-button-with-start-icon.maru-button-primary-text:active,\n.maru-button-with-end-icon.maru-button-primary-text:hover,\n.maru-button-with-end-icon.maru-button-primary-text:focus-visible,\n.maru-button-with-end-icon.maru-button-primary-text:active {\n  background-color: var(--p-10);\n  color: var(--p);\n}\n.maru-button-with-start-icon.maru-button-secondary-default-light:hover, .maru-button-with-start-icon.maru-button-secondary-default-light:focus-visible, .maru-button-with-start-icon.maru-button-secondary-default-light:active,\n.maru-button-with-end-icon.maru-button-secondary-default-light:hover,\n.maru-button-with-end-icon.maru-button-secondary-default-light:focus-visible,\n.maru-button-with-end-icon.maru-button-secondary-default-light:active {\n  box-shadow: none;\n  background-color: #fafafa;\n  color: #8c8c8c;\n}\n\n.maru-button-only-icon {\n  padding: 0;\n  justify-content: center;\n  background-color: transparent;\n}\n.maru-button-only-icon:hover, .maru-button-only-icon:focus-visible, .maru-button-only-icon:active {\n  box-shadow: none;\n  background-color: transparent;\n}";
 styleInject(css_248z$b);
 
 var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
@@ -3048,7 +2775,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_a, ref) {
         checked: checked == null ? undefined : !!checked,
         className: "maru-checkbox"
       }, props)), jsx(Icon, {
-        name: checked ? 'CheckboxOn' : 'CheckboxOff',
+        name: checked ? 'CheckboxOnThin' : 'CheckboxOffThin',
         size: size,
         color: props.disabled ? '#BDBDBD' : keyColor
       })]
@@ -3075,7 +2802,7 @@ var css_248z$9 = ".maru-chip {\n  display: flex;\n  justify-content: center;\n
 styleInject(css_248z$9);
 
 function Chip(_a) {
-  var content = _a.content,
+  var children = _a.children,
     className = _a.className,
     _b = _a.color,
     color = _b === void 0 ? 'primary' : _b,
@@ -3090,9 +2817,9 @@ function Chip(_a) {
       name: ICONS.StateThin,
       size: 16,
       color: color
-    }), jsx("span", {
-      children: content.toLocaleString('en')
-    })]
+    }), typeof children === 'number' ? jsx("span", {
+      children: children.toLocaleString('en')
+    }) : children]
   }));
 }
 
@@ -3100,15 +2827,15 @@ var css_248z$8 = ".maru-input-wrapper.disabled input {\n  opacity: 0.5;\n  point
 styleInject(css_248z$8);
 
 var Input = /*#__PURE__*/forwardRef(function (_a, inputRef) {
-  var onClear = _a.onClear,
-    errorMessage = _a.errorMessage,
+  var errorMessage = _a.errorMessage,
     label = _a.label,
     _b = _a.type,
     type = _b === void 0 ? 'text' : _b,
+    onClear = _a.onClear,
     wrapperRef = _a.wrapperRef,
     startNode = _a.startNode,
     endNode = _a.endNode,
-    props = __rest(_a, ["onClear", "errorMessage", "label", "type", "wrapperRef", "startNode", "endNode"]);
+    props = __rest(_a, ["errorMessage", "label", "type", "onClear", "wrapperRef", "startNode", "endNode"]);
   var _c = useState(true),
     pwdVision = _c[0],
     setPwdVision = _c[1];
@@ -3162,7 +2889,7 @@ var Input = /*#__PURE__*/forwardRef(function (_a, inputRef) {
       combineRef.current.value = '';
       combineRef.current.focus();
     }
-    onClear();
+    onClear === null || onClear === void 0 ? void 0 : onClear();
   };
   return jsxs("div", __assign({
     ref: wrapperRef,
@@ -3239,6 +2966,7 @@ Input.defaultProps = {
   errorMessage: undefined,
   label: undefined,
   type: 'text',
+  onClear: undefined,
   wrapperRef: undefined,
   startNode: undefined,
   endNode: undefined
@@ -5036,12 +4764,13 @@ var createPopper = /*#__PURE__*/popperGenerator({
   defaultModifiers: defaultModifiers
 }); // eslint-disable-next-line import/no-unused-modules
 
-var CreatePortal = function CreatePortal(_a) {
+function CreatePortal(_a) {
   var parent = _a.parent,
     children = _a.children;
-  var container = useRef(parent);
-  return /*#__PURE__*/ReactDOM.createPortal(children, container.current);
-};
+  var parentElement = parent && useRef(parent);
+  var styleRootElement = document.getElementById('style-root');
+  return (parentElement || styleRootElement) && /*#__PURE__*/ReactDOM.createPortal(children, parentElement ? parentElement.current : styleRootElement);
+}
 
 var css_248z$7 = ".maru-popover-background {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 1611;\n}\n\n.maru-popover {\n  border-radius: 8px;\n  background-color: white;\n  outline: none;\n  box-shadow: 0px 0px 6px #e4e4e4;\n}";
 styleInject(css_248z$7);
@@ -5050,14 +4779,12 @@ function Popover(_a) {
   var anchorEl = _a.anchorEl,
     children = _a.children,
     open = _a.open,
-    _b = _a.backdrop,
-    backdrop = _b === void 0 ? true : _b,
     className = _a.className,
-    _c = _a.direction,
-    direction = _c === void 0 ? 'right' : _c,
+    _b = _a.direction,
+    direction = _b === void 0 ? 'right' : _b,
     onClose = _a.onClose,
-    _d = _a.portal,
-    portal = _d === void 0 ? false : _d;
+    _c = _a.portal,
+    portal = _c === void 0 ? false : _c;
   var popoverRef = useRef(null);
   useEffect(function () {
     if (anchorEl && popoverRef.current && open) {
@@ -5099,12 +4826,10 @@ function Popover(_a) {
     }
   }, [open]);
   var handleBackgroundClick = function handleBackgroundClick() {
-    if (backdrop) {
-      onClose();
-    }
+    onClose();
   };
   var handleKeyUp = function handleKeyUp(e) {
-    if (backdrop && e.key === 'Escape') {
+    if (e.key === 'Escape') {
       onClose();
     }
   };
@@ -5131,11 +4856,9 @@ function Popover(_a) {
       children: children
     }))
   })) : null;
-  return portal ? jsx(CreatePortal, __assign({
-    parent: document.body
-  }, {
+  return portal ? jsx(CreatePortal, {
     children: PopoverBody
-  })) : PopoverBody;
+  }) : PopoverBody;
 }
 
 var css_248z$6 = ".maru-radio-wrapper-8px {\n  display: flex;\n  gap: 8px;\n}\n\n.maru-radio-wrapper-4px {\n  display: flex;\n  gap: 4px;\n}\n\n.maru-radio {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  border: 2px solid #5c5c5c;\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n}\n.maru-radio:hover::before, .maru-radio:checked::before {\n  content: \"\";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background-color: #5c5c5c;\n}\n\n.maru-radio-label {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n  color: #5c5c5c;\n  cursor: pointer;\n}\n\n.maru-radio:disabled,\n.label-disabled {\n  cursor: default;\n  opacity: 0.5;\n}";
@@ -5346,11 +5069,9 @@ function Tooltip(_a) {
       return setOpen(false);
     }
   }, {
-    children: [children, portal ? jsx(CreatePortal, __assign({
-      parent: document.body
-    }, {
+    children: [children, portal ? jsx(CreatePortal, {
       children: Tootip
-    })) : Tootip]
+    }) : Tootip]
   }));
 }
 
@@ -5949,7 +5670,7 @@ function Dropdown(_a) {
   }));
 }
 
-var css_248z$2 = ".maru-modal-wrapper {\n  width: 100vw;\n  height: 100vh;\n  position: fixed;\n  top: 0;\n  left: 0;\n  background-color: rgba(92, 92, 92, 0.5019607843);\n  z-index: 6006;\n  display: block;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n}\n.maru-modal-wrapper .maru-modal {\n  background-color: white;\n  padding: 40px;\n  border-radius: 20px;\n  box-shadow: 0px 5px 20px 5px #8c8c8c;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xs {\n  width: 300px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-s {\n  width: 400px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-m {\n  width: 550px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-m .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-l {\n  width: 860px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-l .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xl {\n  width: 1160px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xl .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  flex-direction: row;\n  margin-bottom: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header > h1 {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 16px;\n  letter-spacing: -0.64px;\n  font-weight: 700;\n  color: #5c5c5c;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  flex-direction: row;\n  margin-top: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer button {\n  margin: 0 0 0 8px;\n}";
+var css_248z$2 = ".maru-modal-wrapper {\n  width: 100vw;\n  height: 100vh;\n  position: fixed;\n  top: 0;\n  left: 0;\n  background-color: rgba(92, 92, 92, 0.5019607843);\n  z-index: 6006;\n  display: block;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n}\n.maru-modal-wrapper .maru-modal {\n  background-color: white;\n  padding: 40px;\n  border-radius: 20px;\n  box-shadow: 0px 5px 20px 5px #8c8c8c;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xs {\n  width: 300px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-s {\n  width: 400px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-m {\n  width: 550px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-m .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-l {\n  width: 860px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-l .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xl {\n  width: 1160px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xl .maru-modal-header {\n  padding-bottom: 8px;\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  flex-direction: row;\n  margin-bottom: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header > h1 {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 16px;\n  letter-spacing: -0.64px;\n  font-weight: 700;\n  color: #5c5c5c;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-body {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  flex-direction: row;\n  margin-top: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer button {\n  margin: 0 0 0 8px;\n}";
 styleInject(css_248z$2);
 
 function Modal(_a) {
@@ -6002,9 +5723,7 @@ function Modal(_a) {
     var _a;
     (_a = okButton === null || okButton === void 0 ? void 0 : okButton.onClick) === null || _a === void 0 ? void 0 : _a.call(okButton);
   };
-  return jsx(CreatePortal, __assign({
-    parent: document.body
-  }, {
+  return jsx(CreatePortal, {
     children: open && jsx("div", __assign({
       ref: wrapperRef,
       className: "maru-modal-wrapper",
@@ -6049,24 +5768,18 @@ function Modal(_a) {
             disabled: cancelButton.disabled
           }, {
             children: cancelButton.content
-          })), okButton &&
-          // FIXME: 이게 맞아..?
-          jsx(StyleProvider, __assign({
-            theme: "blue"
+          })), okButton && jsx(Button, __assign({
+            color: okButton.color || 'primary',
+            onClick: handleOkButtonClick,
+            onKeyDown: handleFooterKeyDown,
+            disabled: okButton.disabled
           }, {
-            children: jsx(Button, __assign({
-              color: okButton.color || 'primary',
-              onClick: handleOkButtonClick,
-              onKeyDown: handleFooterKeyDown,
-              disabled: okButton.disabled
-            }, {
-              children: okButton.content
-            }))
+            children: okButton.content
           }))]
         }))]
       }))
     }))
-  }));
+  });
 }
 
 var css_248z$1 = ".maru-pagination-wrapper .maru-pagination {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n}\n.maru-pagination-wrapper .maru-pagination button {\n  cursor: pointer;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 12px;\n  letter-spacing: -0.48px;\n  font-weight: 500;\n  color: #8c8c8c;\n  padding: unset;\n  margin: unset;\n  background-color: unset;\n  border: unset;\n  min-width: 30px;\n  min-height: 30px;\n  border-radius: 6px;\n}\n.maru-pagination-wrapper .maru-pagination button > span {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n}\n.maru-pagination-wrapper .maru-pagination button:hover {\n  background-color: #e4e4e4;\n  font-weight: 700;\n}\n.maru-pagination-wrapper .maru-pagination button:disabled {\n  cursor: default;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-default-wrapper {\n  display: flex;\n  justify-content: space-evenly;\n  align-items: center;\n  flex-direction: row;\n  flex: 1;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-default-wrapper .maru-pagination-page-button {\n  line-height: 140%;\n  padding: 6px 12px;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-default-wrapper .maru-pagination-page-button.selected {\n  font-weight: 700;\n  color: white;\n  background-color: #bdbdbd;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-input-wrapper .maru-pagination-input {\n  border: 1px solid #e4e4e4;\n  border-radius: 6px;\n  padding: 2px 20px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 12px;\n  letter-spacing: -0.48px;\n  font-weight: 700;\n  margin: 0 8px;\n  color: #5c5c5c;\n  text-align: center;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-input-wrapper .maru-pagination-input::-webkit-outer-spin-button, .maru-pagination-wrapper .maru-pagination .maru-pagination-input-wrapper .maru-pagination-input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-input-wrapper .maru-pagination-input:disabled {\n  pointer-events: none;\n  border: none;\n  background-color: transparent;\n  width: auto;\n  margin-right: 0;\n  padding: 0;\n}\n.maru-pagination-wrapper .maru-pagination .maru-pagination-input-wrapper > span {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 12px;\n  letter-spacing: -0.48px;\n  font-weight: 500;\n  color: #8c8c8c;\n}";
@@ -6300,13 +6013,15 @@ function CheckboxTd(_a) {
   };
   return (
     // eslint-disable-next-line jsx-a11y/control-has-associated-label
-    jsx("td", {
+    jsx("td", __assign({
+      className: "checkbox-td"
+    }, {
       children: jsx(Checkbox, {
         checked: checked,
         onChange: handleCheck,
         color: "#5C5C5C"
       })
-    })
+    }))
   );
 }
 
@@ -6387,10 +6102,10 @@ function TBody(_a) {
     // expandingIdKey,
     // expandingRowIdKey,
     // expandingFormat,
-    // onRowClick,
-    // onRowMouseOver,
-    // onRowMouseLeave,
-    // focusedRowInfo,
+    onRowClick = _a.onRowClick,
+    selectedRow = _a.selectedRow,
+    onRowMouseOver = _a.onRowMouseOver,
+    onRowMouseLeave = _a.onRowMouseLeave,
     noData = _a.noData,
     loading = _a.loading;
   var _b = useState([]);
@@ -6419,21 +6134,27 @@ function TBody(_a) {
       onCheck === null || onCheck === void 0 ? void 0 : onCheck(__spreadArray([], newCheckedArray, true));
     }
   };
-  // const handleRowClick = (rowId: string) => () => {
-  //   if (hasRowEvent) {
-  //     onRowClick?.(rowId);
-  //   }
-  // };
-  // const handleRowEnter = (rowId: string) => () => {
-  //   if (hasRowEvent) {
-  //     onRowMouseOver?.(rowId);
-  //   }
-  // };
-  // const handleRowLeave = (rowId: string) => () => {
-  //   if (hasRowEvent) {
-  //     onRowMouseLeave?.(rowId);
-  //   }
-  // };
+  var handleRowClick = function handleRowClick(rowId) {
+    return function () {
+      // if (hasRowEvent) {
+      onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(rowId);
+      // }
+    };
+  };
+  var handleRowEnter = function handleRowEnter(rowId) {
+    return function () {
+      // if (hasRowEvent) {
+      onRowMouseOver === null || onRowMouseOver === void 0 ? void 0 : onRowMouseOver(rowId);
+      // }
+    };
+  };
+  var handleRowLeave = function handleRowLeave(rowId) {
+    return function () {
+      // if (hasRowEvent) {
+      onRowMouseLeave === null || onRowMouseLeave === void 0 ? void 0 : onRowMouseLeave(rowId);
+      // }
+    };
+  };
   // const handleExpandClick = (rowId: string) => () => {
   //   let newExpand = [...expand];
   //   if (newExpand.includes(rowId)) {
@@ -6453,11 +6174,14 @@ function TBody(_a) {
     }) : data.map(function (row) {
       return jsx(React.Fragment, {
         children: jsxs("tr", __assign({
-          // onClick={handleRowClick(row[rowIdKey])}
-          // onMouseEnter={handleRowEnter(row[rowIdKey])}
-          // onMouseLeave={handleRowLeave(row[rowIdKey])}
+          onClick: handleRowClick(row[rowIdKey]),
+          onMouseEnter: handleRowEnter(row[rowIdKey]),
+          onMouseLeave: handleRowLeave(row[rowIdKey]),
           // aria-hidden={hasRowEvent}
-          className: classNames()
+          className: classNames({
+            'clickable-row': onRowClick,
+            'selected-row': selectedRow && (selectedRow === null || selectedRow === void 0 ? void 0 : selectedRow.rowId) === row[rowIdKey]
+          }, selectedRow && (selectedRow === null || selectedRow === void 0 ? void 0 : selectedRow.className))
         }, {
           children: [checkedIds != null && jsx(CheckboxTd, {
             rowId: row[rowIdKey],
@@ -6499,13 +6223,15 @@ function THead(_a) {
     children: jsxs("tr", {
       children: [hasCheckbox &&
       // eslint-disable-next-line jsx-a11y/control-has-associated-label
-      jsx("th", {
+      jsx("th", __assign({
+        className: "checkbox-td"
+      }, {
         children: jsx(Checkbox, {
           checked: allCheckbox,
           onChange: handleChange,
           color: "#5C5C5C"
         })
-      }), formats === null || formats === void 0 ? void 0 : formats.map(function (format) {
+      })), formats === null || formats === void 0 ? void 0 : formats.map(function (format) {
         if (format.isHide) {
           return null;
         }
@@ -6516,7 +6242,7 @@ function THead(_a) {
             onClick: onSortClick(format.columnIdKey, format.sortable),
             variant: "text",
             endIcon: {
-              name: ICONS.SortOutline,
+              name: ICONS.SortOutlineThin,
               size: 18,
               color: (currentSort === null || currentSort === void 0 ? void 0 : currentSort.columnName) === format.columnIdKey ? 'primary' : '#8c8c8c'
             },
@@ -6569,7 +6295,7 @@ function Colgroup(_a) {
   });
 }
 
-var css_248z = ".maru-table-wrapper {\n  width: 100%;\n  background-color: white;\n  box-shadow: 0px 0px 6px #e4e4e4;\n  border-radius: 15px;\n}\n.maru-table-wrapper .maru-table-header-wrapper,\n.maru-table-wrapper .maru-table-body-wrapper {\n  width: 100%;\n}\n.maru-table-wrapper tr {\n  height: 54px;\n}\n.maru-table-wrapper th,\n.maru-table-wrapper td {\n  text-align: start;\n  vertical-align: middle;\n  padding: 16.5px 15px;\n  word-break: break-word;\n}\n.maru-table-wrapper .maru-table-header tr {\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-table-wrapper .maru-table-header tr th {\n  color: #5c5c5c;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 700;\n}\n.maru-table-wrapper .maru-table-header .maru-table-header-sortable {\n  padding: unset;\n  margin: unset;\n  color: #5c5c5c;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 700;\n}\n.maru-table-wrapper .maru-table-body-scroll-wrapper {\n  overflow-y: auto;\n}\n.maru-table-wrapper .maru-table-body-scroll-wrapper .maru-table-scroll {\n  overflow-y: auto;\n}\n.maru-table-wrapper .maru-table-body tr:not(:last-of-type) {\n  border-bottom: 1px solid #fafafa;\n}\n.maru-table-wrapper .maru-table-body tr:hover,\n.maru-table-wrapper .maru-table-body .row-clickable:hover {\n  background-color: var(--p-10) !important;\n}\n.maru-table-wrapper .maru-table-body td {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n}\n.maru-table-wrapper .maru-table-body tr:last-of-type td:first-of-type {\n  border-bottom-left-radius: 15px;\n}\n.maru-table-wrapper .maru-table-body tr:last-of-type td:last-of-type {\n  border-bottom-right-radius: 15px;\n}\n.maru-table-wrapper .maru-table-body .row-clickable {\n  cursor: pointer;\n}\n.maru-table-wrapper .maru-table-body .expanding {\n  border-bottom: unset !important;\n}\n.maru-table-wrapper .maru-checkbox {\n  border-color: #bdbdbd;\n}\n.maru-table-wrapper .maru-table-body-kebab-wrapper {\n  text-align: center;\n}\n.maru-table-wrapper .maru-table-body-kebab {\n  margin: unset;\n  padding: unset;\n  height: auto;\n}\n.maru-table-wrapper .maru-table-body-empty-tr > td {\n  width: 100%;\n  vertical-align: middle;\n  text-align: center;\n  padding: 61px 0;\n}\n.maru-table-wrapper .maru-table-body-empty-tr > td p {\n  margin-top: 10px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n  color: #bdbdbd;\n}\n.maru-table-wrapper .maru-table-body-expandable-button {\n  width: 24px;\n  height: 24px;\n  padding: 0.2rem;\n}\n.maru-table-wrapper .maru-table-body-expanding-row {\n  border: unset !important;\n}\n.maru-table-wrapper .maru-table-body-expanding-row.empty-last-expanding-row {\n  border-bottom: 1px solid #bdbdbd !important;\n  height: 12px !important;\n}";
+var css_248z = ".maru-table-wrapper {\n  width: 100%;\n  background-color: white;\n  box-shadow: 0px 0px 6px #e4e4e4;\n  border-radius: 15px;\n}\n.maru-table-wrapper .maru-table-header-wrapper,\n.maru-table-wrapper .maru-table-body-wrapper {\n  width: 100%;\n}\n.maru-table-wrapper tr {\n  height: 54px;\n}\n.maru-table-wrapper th,\n.maru-table-wrapper td {\n  text-align: start;\n  vertical-align: middle;\n  padding: 16.5px 15px;\n  word-break: break-word;\n  color: #5c5c5c;\n}\n.maru-table-wrapper th:first-of-type,\n.maru-table-wrapper td:first-of-type {\n  padding: 16.5px 25px;\n}\n.maru-table-wrapper .checkbox-td {\n  padding: 18px 15px 18px 25px !important;\n}\n.maru-table-wrapper .maru-table-header tr {\n  border-bottom: 1px solid #e4e4e4;\n}\n.maru-table-wrapper .maru-table-header tr th {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 700;\n}\n.maru-table-wrapper .maru-table-header .maru-table-header-sortable {\n  padding: unset;\n  margin: unset;\n  color: #5c5c5c;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 700;\n}\n.maru-table-wrapper .maru-table-body-scroll-wrapper {\n  overflow-y: auto;\n}\n.maru-table-wrapper .maru-table-body-scroll-wrapper .maru-table-scroll {\n  overflow-y: auto;\n}\n.maru-table-wrapper .maru-table-body tr:not(:last-of-type) {\n  border-bottom: 1px solid #fafafa;\n}\n.maru-table-wrapper .maru-table-body tr:hover,\n.maru-table-wrapper .maru-table-body .clickable-row:hover,\n.maru-table-wrapper .maru-table-body .selected-row {\n  background-color: var(--p-10);\n}\n.maru-table-wrapper .maru-table-body td {\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n}\n.maru-table-wrapper .maru-table-body tr:last-of-type td:first-of-type {\n  border-bottom-left-radius: 15px;\n}\n.maru-table-wrapper .maru-table-body tr:last-of-type td:last-of-type {\n  border-bottom-right-radius: 15px;\n}\n.maru-table-wrapper .maru-table-body .clickable-row {\n  cursor: pointer;\n}\n.maru-table-wrapper .maru-table-body .expanding {\n  border-bottom: unset !important;\n}\n.maru-table-wrapper .maru-checkbox {\n  border-color: #bdbdbd;\n}\n.maru-table-wrapper .maru-table-body-kebab-wrapper {\n  text-align: center;\n}\n.maru-table-wrapper .maru-table-body-kebab {\n  margin: unset;\n  padding: unset;\n  height: auto;\n}\n.maru-table-wrapper .maru-table-body-empty-tr > td {\n  width: 100%;\n  vertical-align: middle;\n  text-align: center;\n  padding: 61px 0;\n}\n.maru-table-wrapper .maru-table-body-empty-tr > td p {\n  margin-top: 10px;\n  font-family: Pretendard;\n  font-style: normal;\n  line-height: 150%;\n  font-size: 14px;\n  letter-spacing: -0.56px;\n  font-weight: 500;\n  color: #bdbdbd;\n}\n.maru-table-wrapper .maru-table-body-empty-tr:hover {\n  background-color: inherit !important;\n}\n.maru-table-wrapper .maru-table-body-expandable-button {\n  width: 24px;\n  height: 24px;\n  padding: 0.2rem;\n}\n.maru-table-wrapper .maru-table-body-expanding-row {\n  border: unset !important;\n}\n.maru-table-wrapper .maru-table-body-expanding-row.empty-last-expanding-row {\n  border-bottom: 1px solid #bdbdbd !important;\n  height: 12px !important;\n}";
 styleInject(css_248z);
 
 // eslint-disable-next-line import/prefer-default-export
@@ -6588,12 +6314,12 @@ function Table(_a) {
     // expandingFormat,
     // onTableMouseEnter,
     // onTableMouseLeave,
-    // onRowClick,
-    // onRowMouseOver,
-    // onRowMouseLeave,
+    onRowClick = _a.onRowClick,
+    selectedRow = _a.selectedRow,
+    onRowMouseOver = _a.onRowMouseOver,
+    onRowMouseLeave = _a.onRowMouseLeave,
     className = _a.className,
     id = _a.id,
-    // focusedRowInfo,
     tableMaxHeight = _a.tableMaxHeight,
     noData = _a.noData,
     loading = _a.loading;
@@ -6744,10 +6470,10 @@ function Table(_a) {
           // expandingIdKey={expandingIdKey}
           // expandingRowIdKey={expandingRowIdKey}
           // expandingFormat={expandingFormat}
-          // onRowClick={onRowClick}
-          // onRowMouseOver={onRowMouseOver}
-          // onRowMouseLeave={onRowMouseLeave}
-          // focusedRowInfo={focusedRowInfo}
+          onRowClick: onRowClick,
+          onRowMouseOver: onRowMouseOver,
+          onRowMouseLeave: onRowMouseLeave,
+          selectedRow: selectedRow,
           noData: noData,
           loading: loading
         })]