@thecb/components 12.0.0-beta.0 → 12.0.0-beta.2

package/src/components/atoms/icons/KioskImage.js

@@ -2,378 +2,263 @@ import React from "react";
 
 const KioskImage = () => (
   <svg
-    width={191}
-    height={96}
-    viewBox="0 0 191 96"
+    width="184"
+    height="170"
+    viewBox="0 0 184 170"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M12.4433 28.1096C12.4164 28.11 12.3894 28.1102 12.3624 28.1102C9.63896 28.1102 7.43115 25.9085 7.43115 23.1926C7.43115 20.4766 9.63896 18.2749 12.3624 18.2749C13.4748 18.2749 14.5012 18.6422 15.3263 19.2619C16.1831 16.4509 18.8028 14.4053 21.9017 14.4053C25.4863 14.4053 28.4299 17.1426 28.7452 20.6355C29.4629 20.0662 30.3716 19.726 31.3599 19.726C33.6816 19.726 35.5636 21.6029 35.5636 23.9181C35.5636 26.2334 33.6816 28.1102 31.3599 28.1102C31.3058 28.1102 31.2519 28.1092 31.1983 28.1072V28.1105H12.4433V28.1096Z"
-      fill="#3B5BDB"
-      fillOpacity={0.3}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.077 59.7212C17.0639 59.7214 17.0507 59.7215 17.0375 59.7215C15.7078 59.7215 14.6299 58.6466 14.6299 57.3205C14.6299 55.9945 15.7078 54.9196 17.0375 54.9196C17.5806 54.9196 18.0817 55.0989 18.4845 55.4014C18.9029 54.029 20.1819 53.0303 21.6949 53.0303C23.4451 53.0303 24.8824 54.3669 25.0362 56.0724C25.3866 55.7944 25.8302 55.6283 26.3128 55.6283C27.4463 55.6283 28.3652 56.5447 28.3652 57.6751C28.3652 58.8054 27.4463 59.7218 26.3128 59.7218C26.2864 59.7218 26.26 59.7213 26.2339 59.7203V59.7217H17.077V59.7212Z"
-      fill="#3B5BDB"
-      fillOpacity={0.3}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M51.8554 45.6714C51.8755 45.6718 51.8958 45.6719 51.916 45.6719C53.9561 45.6719 55.6099 43.9769 55.6099 41.886C55.6099 39.7952 53.9561 38.1002 51.916 38.1002C51.0827 38.1002 50.3139 38.383 49.6959 38.86C49.0541 36.6959 47.0917 35.1211 44.7705 35.1211C42.0852 35.1211 39.8802 37.2286 39.6442 39.9179C39.1066 39.4796 38.4259 39.2177 37.6855 39.2177C35.9465 39.2177 34.5367 40.6626 34.5367 42.445C34.5367 44.2274 35.9465 45.6723 37.6855 45.6723C37.7261 45.6723 37.7665 45.6715 37.8066 45.67V45.6721H51.8554V45.6714Z"
-      fill="#3B5BDB"
-      fillOpacity={0.3}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M150.742 16.4655C150.66 16.4725 150.577 16.476 150.493 16.476C148.894 16.476 147.597 15.183 147.597 13.588C147.597 11.993 148.894 10.7 150.493 10.7C150.688 10.7 150.878 10.7192 151.062 10.7558C151.584 8.82245 153.354 7.39941 155.457 7.39941C157.417 7.39941 159.087 8.63418 159.728 10.366C159.937 10.263 160.173 10.2052 160.422 10.2052C161.008 10.2052 161.518 10.5242 161.789 10.9973C162.175 10.807 162.61 10.7 163.07 10.7C164.669 10.7 165.966 11.993 165.966 13.588C165.966 15.183 164.669 16.476 163.07 16.476C163.042 16.476 163.015 16.4756 162.987 16.4748V16.476H150.742V16.4655Z"
-      fill="#3B5BDB"
-      fillOpacity={0.3}
-    />
-    <path
-      d="M115.317 86.6337C115.317 88.8967 104.441 90.7313 91.0246 90.7313C77.6081 90.7313 66.7319 88.8967 66.7319 86.6337C66.7319 84.3707 77.6081 82.5361 91.0246 82.5361C104.441 82.5361 115.317 84.3707 115.317 86.6337Z"
-      fill="#3B5BDB"
-      fillOpacity={0.3}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M67.656 5.85669C66.0341 5.85669 64.3904 5.64884 64.3904 8.59922V75.4381C64.3904 78.3885 65.9995 78.4389 67.6214 78.4389H115.307C116.929 78.4389 118.244 78.3885 118.244 75.4381L118.209 8.85746C118.209 5.90708 116.271 5.85669 114.649 5.85669H67.656Z"
-      fill="white"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M118.209 8.85746C118.209 5.90708 116.271 5.85669 114.649 5.85669H67.656C67.5556 5.85669 67.455 5.85589 67.3548 5.85509C65.8368 5.84305 64.3904 5.83158 64.3904 8.59922V75.4381C64.3904 78.3885 65.9995 78.4389 67.6214 78.4389H115.307C116.929 78.4389 118.244 78.3885 118.244 75.4381L118.209 8.85746ZM115.903 75.4381L115.868 8.85746C115.868 8.55226 115.836 8.36846 115.811 8.27076C115.764 8.25927 115.696 8.24597 115.602 8.23432C115.354 8.20357 115.063 8.19815 114.649 8.19815H67.656C67.5462 8.19815 67.4378 8.19729 67.3401 8.19651L67.3335 8.19646C67.2309 8.19565 67.1397 8.19495 67.051 8.19498C66.9336 8.19503 66.8349 8.19644 66.7493 8.19961C66.7392 8.30204 66.7318 8.43357 66.7318 8.59922V75.4381C66.7318 75.7386 66.7553 75.9409 66.7793 76.0687C66.9759 76.092 67.2256 76.0974 67.6214 76.0974H115.307C115.552 76.0974 115.729 76.0952 115.866 76.0889C115.886 75.9395 115.903 75.7279 115.903 75.4381Z"
-      fill="#292A33"
-    />
-    <path
-      d="M70.8725 12.8778C70.8727 12.5547 71.1347 12.293 71.4578 12.293H105.366C105.689 12.293 105.951 12.555 105.951 12.8783V63.8052C105.951 64.1285 105.689 64.3905 105.366 64.3905H71.4152C71.0917 64.3905 70.8296 64.1282 70.8298 63.8047L70.8725 12.8778Z"
-      fill="#EBEFFB"
-    />
-    <rect
-      x={162.573}
-      y={70.0283}
-      width={12.5769}
-      height={2.64072}
-      rx={1.32036}
-      fill="#292A33"
-    />
-    <path
-      d="M117.073 70.2441H157.463C158.11 70.2441 158.634 70.7683 158.634 71.4149V71.4149C158.634 72.0614 158.11 72.5856 157.463 72.5856H117.073V70.2441Z"
-      fill="#292A33"
-    />
-    <path
-      d="M28.6829 71.4149C28.6829 70.7683 29.207 70.2441 29.8536 70.2441H66.1463V72.5856H29.8536C29.207 72.5856 28.6829 72.0614 28.6829 71.4149V71.4149Z"
-      fill="#292A33"
-    />
-    <rect
-      x={17.4429}
-      y={70.0283}
-      width={8.10877}
-      height={2.64072}
-      rx={1.32036}
-      fill="#292A33"
-    />
-    <rect
-      x={93.0732}
-      y={70.2441}
-      width={8.10877}
-      height={2.64072}
-      rx={1.32036}
-      fill="#292A33"
-    />
-    <rect
-      x={112.689}
-      y={56.1953}
-      width={8.10877}
-      height={2.64072}
-      rx={1.32036}
-      transform="rotate(90 112.689 56.1953)"
-      fill="#292A33"
-    />
-    <rect
-      x={104.781}
-      y={70.2441}
-      width={8.10877}
-      height={2.64072}
-      rx={1.32036}
-      fill="#292A33"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M96.4624 31.5838C95.8425 31.5838 95.2796 32.0356 95.1249 32.7055C95.0174 33.1711 94.5519 33.4615 94.0853 33.3542C93.6187 33.2469 93.3276 32.7825 93.4352 32.3169C93.7555 30.9299 94.9667 29.8535 96.4624 29.8535C97.9582 29.8535 99.1694 30.9299 99.4897 32.3169C99.5972 32.7825 99.3062 33.2469 98.8396 33.3542C98.3729 33.4615 97.9075 33.1711 97.8 32.7055C97.6452 32.0356 97.0824 31.5838 96.4624 31.5838Z"
-      fill="#3B5BDB"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M80.3179 31.5838C79.6979 31.5838 79.1351 32.0356 78.9804 32.7055C78.8728 33.1711 78.4074 33.4615 77.9408 33.3542C77.4742 33.2469 77.1831 32.7825 77.2907 32.3169C77.611 30.9299 78.8221 29.8535 80.3179 29.8535C81.8137 29.8535 83.0248 30.9299 83.3452 32.3169C83.4527 32.7825 83.1616 33.2469 82.695 33.3542C82.2284 33.4615 81.763 33.1711 81.6554 32.7055C81.5007 32.0356 80.9379 31.5838 80.3179 31.5838Z"
-      fill="#3B5BDB"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M82.8702 42.6553C83.349 42.6553 83.7372 43.0426 83.7372 43.5204C83.7372 44.2447 84.3256 44.8319 85.0514 44.8319H91.7293C92.4551 44.8319 93.0435 44.2447 93.0435 43.5204C93.0435 43.0426 93.4317 42.6553 93.9105 42.6553C94.3894 42.6553 94.7775 43.0426 94.7775 43.5204C94.7775 45.2003 93.4128 46.5622 91.7293 46.5622H85.0514C83.3679 46.5622 82.0032 45.2003 82.0032 43.5204C82.0032 43.0426 82.3914 42.6553 82.8702 42.6553Z"
-      fill="#3B5BDB"
-    />
-    <g filter="url(#filter0_d_4997_39198)">
+    <g id="Illustration - Kiosk">
       <path
-        d="M118.244 20.1895H151.308C153.794 20.1895 155.809 22.2045 155.809 24.6903V24.9302C155.809 27.416 153.794 29.4311 151.308 29.4311H118.244V20.1895Z"
+        d="M0 4C0 1.79086 1.79086 0 4 0H184V170H4C1.79086 170 0 168.209 0 166V4Z"
+        fill="#D9DAF9"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M15.8395 66.0752C15.8139 66.0756 15.7883 66.0758 15.7626 66.0758C13.1713 66.0758 11.0706 63.981 11.0706 61.3968C11.0706 58.8126 13.1713 56.7178 15.7626 56.7178C16.821 56.7178 17.7976 57.0673 18.5826 57.6568C19.3979 54.9822 21.8905 53.0359 24.839 53.0359C28.2497 53.0359 31.0504 55.6404 31.3504 58.9638C32.0333 58.4221 32.8979 58.0985 33.8382 58.0985C36.0472 58.0985 37.838 59.8843 37.838 62.0871C37.838 64.29 36.0472 66.0758 33.8382 66.0758C33.7868 66.0758 33.7355 66.0749 33.6845 66.0729V66.0761H15.8395V66.0752Z"
+        fill="#A99DD2"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M20.2482 96.1525C20.2357 96.1527 20.2232 96.1528 20.2107 96.1528C18.9455 96.1528 17.9199 95.13 17.9199 93.8684C17.9199 92.6067 18.9455 91.5839 20.2107 91.5839C20.7274 91.5839 21.2042 91.7545 21.5875 92.0424C21.9855 90.7365 23.2025 89.7863 24.6421 89.7863C26.3074 89.7863 27.6748 91.058 27.8212 92.6807C28.1546 92.4163 28.5767 92.2582 29.0359 92.2582C30.1144 92.2582 30.9887 93.1301 30.9887 94.2057C30.9887 95.2812 30.1144 96.1531 29.0359 96.1531C29.0107 96.1531 28.9857 96.1526 28.9608 96.1517V96.153H20.2482V96.1525Z"
+        fill="#A99DD2"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M53.3391 82.7851C53.3583 82.7854 53.3775 82.7856 53.3968 82.7856C55.3379 82.7856 56.9114 81.1728 56.9114 79.1834C56.9114 77.194 55.3379 75.5812 53.3968 75.5812C52.604 75.5812 51.8724 75.8503 51.2844 76.3042C50.6737 74.2451 48.8066 72.7467 46.598 72.7467C44.043 72.7467 41.945 74.752 41.7205 77.3107C41.2089 76.8937 40.5613 76.6445 39.8568 76.6445C38.2021 76.6445 36.8608 78.0193 36.8608 79.7152C36.8608 81.4111 38.2021 82.786 39.8568 82.786C39.8954 82.786 39.9338 82.7852 39.972 82.7837V82.7858H53.3391V82.7851Z"
+        fill="#A99DD2"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.427 54.9962C147.349 55.0028 147.27 55.0062 147.191 55.0062C145.669 55.0062 144.435 53.7759 144.435 52.2583C144.435 50.7407 145.669 49.5104 147.191 49.5104C147.376 49.5104 147.557 49.5287 147.732 49.5635C148.228 47.724 149.913 46.37 151.914 46.37C153.778 46.37 155.367 47.5448 155.977 49.1926C156.176 49.0946 156.401 49.0396 156.638 49.0396C157.195 49.0396 157.681 49.3431 157.938 49.7933C158.306 49.6122 158.719 49.5104 159.157 49.5104C160.679 49.5104 161.913 50.7407 161.913 52.2583C161.913 53.7759 160.679 55.0062 159.157 55.0062C159.131 55.0062 159.105 55.0058 159.079 55.0051V55.0062H147.427V54.9962Z"
+        fill="#A99DD2"
+      />
+      <path
+        d="M113.722 121.759C113.722 123.913 103.373 125.658 90.6076 125.658C77.8422 125.658 67.4937 123.913 67.4937 121.759C67.4937 119.606 77.8422 117.861 90.6076 117.861C103.373 117.861 113.722 119.606 113.722 121.759Z"
+        fill="#A99DD2"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M68.373 44.9017C66.8298 44.9017 65.2658 44.7039 65.2658 47.5112V111.107C65.2658 113.914 66.7969 113.962 68.3401 113.962H113.712C115.255 113.962 116.506 113.914 116.506 111.107L116.473 47.7569C116.473 44.9496 114.629 44.9017 113.086 44.9017H68.373Z"
         fill="white"
       />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M116.473 47.7569C116.473 44.9496 114.629 44.9017 113.086 44.9017H68.373C68.2775 44.9017 68.1818 44.9009 68.0864 44.9002C66.6421 44.8887 65.2658 44.8778 65.2658 47.5112V111.107C65.2658 113.914 66.7969 113.962 68.3401 113.962H113.712C115.255 113.962 116.506 113.914 116.506 111.107L116.473 47.7569ZM114.278 111.107L114.246 47.7569C114.246 47.4665 114.216 47.2916 114.192 47.1986C114.147 47.1877 114.082 47.1751 113.992 47.164C113.756 47.1347 113.48 47.1295 113.086 47.1295H68.373C68.2686 47.1295 68.1654 47.1287 68.0724 47.128L68.0662 47.1279C67.9685 47.1272 67.8818 47.1265 67.7973 47.1265C67.6857 47.1266 67.5918 47.1279 67.5103 47.1309C67.5007 47.2284 67.4937 47.3535 67.4937 47.5112V111.107C67.4937 111.393 67.516 111.585 67.5388 111.707C67.7259 111.729 67.9635 111.734 68.3401 111.734H113.712C113.945 111.734 114.113 111.732 114.243 111.726C114.263 111.584 114.278 111.383 114.278 111.107Z"
+        fill="#292A33"
+      />
+      <path
+        d="M71.4335 51.5818C71.4337 51.2743 71.683 51.0253 71.9904 51.0253H104.253C104.561 51.0253 104.81 51.2746 104.81 51.5822V100.038C104.81 100.346 104.561 100.595 104.253 100.595H71.9498C71.6421 100.595 71.3926 100.345 71.3929 100.037L71.4335 51.5818Z"
+        fill="#D9DAF9"
+      />
+      <rect
+        x="158.685"
+        y="105.959"
+        width="11.9666"
+        height="2.51258"
+        rx="1.25629"
+        fill="#292A33"
+      />
+      <path
+        d="M115.392 106.164H153.823C154.438 106.164 154.937 106.663 154.937 107.278C154.937 107.894 154.438 108.392 153.823 108.392H115.392V106.164Z"
+        fill="#292A33"
+      />
+      <path
+        d="M31.2912 107.278C31.2912 106.663 31.7899 106.164 32.4051 106.164H66.9367V108.392H32.4051C31.7899 108.392 31.2912 107.894 31.2912 107.278Z"
+        fill="#292A33"
+      />
       <rect
-        x={144.722}
-        y={23.8203}
-        width={7.44683}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="20.5965"
+        y="105.959"
+        width="7.71443"
+        height="2.5123"
+        rx="1.25615"
+        fill="#292A33"
       />
       <rect
-        x={137.606}
-        y={23.8203}
-        width={4.4681}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="92.557"
+        y="106.164"
+        width="7.71443"
+        height="2.5123"
+        rx="1.25615"
+        fill="#292A33"
       />
       <rect
-        x={124.367}
-        y={23.8203}
-        width={10.5911}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="111.221"
+        y="92.7974"
+        width="7.71443"
+        height="2.5123"
+        rx="1.25615"
+        transform="rotate(90 111.221 92.7974)"
+        fill="#292A33"
+      />
+      <rect
+        x="103.696"
+        y="106.164"
+        width="7.71443"
+        height="2.5123"
+        rx="1.25615"
+        fill="#292A33"
       />
       <path
-        d="M118.244 23.8203H120.729C121.276 23.8203 121.719 24.2637 121.719 24.8106V24.8106C121.719 25.3575 121.276 25.8009 120.729 25.8009H118.244V23.8203Z"
-        fill="#959CA8"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M95.7816 69.3803C95.1918 69.3803 94.6563 69.8101 94.5091 70.4474C94.4068 70.8904 93.964 71.1667 93.5201 71.0646C93.0762 70.9625 92.7993 70.5206 92.9016 70.0777C93.2063 68.7581 94.3586 67.7341 95.7816 67.7341C97.2046 67.7341 98.3569 68.7581 98.6616 70.0777C98.764 70.5206 98.487 70.9625 98.0431 71.0646C97.5992 71.1667 97.1564 70.8904 97.0541 70.4474C96.9069 69.8101 96.3714 69.3803 95.7816 69.3803Z"
+        fill="#404064"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M80.4203 69.3803C79.8305 69.3803 79.2951 69.8101 79.1479 70.4474C79.0455 70.8904 78.6027 71.1667 78.1588 71.0646C77.7149 70.9625 77.438 70.5206 77.5403 70.0777C77.8451 68.7581 78.9973 67.7341 80.4203 67.7341C81.8434 67.7341 82.9956 68.7581 83.3004 70.0777C83.4027 70.5206 83.1258 70.9625 82.6818 71.0646C82.2379 71.1667 81.7951 70.8904 81.6928 70.4474C81.5456 69.8101 81.0102 69.3803 80.4203 69.3803Z"
+        fill="#404064"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M82.8492 79.9152C83.3048 79.9152 83.6741 80.2837 83.6741 80.7383C83.6741 81.4275 84.234 81.9861 84.9246 81.9861H91.2784C91.969 81.9861 92.5289 81.4275 92.5289 80.7383C92.5289 80.2837 92.8982 79.9152 93.3538 79.9152C93.8094 79.9152 94.1788 80.2837 94.1788 80.7383C94.1788 82.3367 92.8802 83.6325 91.2784 83.6325H84.9246C83.3228 83.6325 82.0242 82.3367 82.0242 80.7383C82.0242 80.2837 82.3936 79.9152 82.8492 79.9152Z"
+        fill="#404064"
+      />
+      <path
+        d="M116.506 58.5392H151.249C151.801 58.5392 152.249 58.9869 152.249 59.5392V66.3323C152.249 66.8846 151.801 67.3324 151.249 67.3324H116.506V58.5392Z"
+        fill="#8F8CF0"
       />
-    </g>
-    <g filter="url(#filter1_d_4997_39198)">
       <rect
-        x={125.836}
-        y={28.1113}
-        width={53.2862}
-        height={9.2416}
-        rx={4.5008}
-        fill="white"
+        x="141.699"
+        y="61.9937"
+        width="7.08469"
+        height="1.88422"
+        rx="0.942111"
+        fill="#FEFEFE"
+      />
+      <rect
+        x="134.929"
+        y="61.9937"
+        width="4.25081"
+        height="1.88422"
+        rx="0.942111"
+        fill="#FEFEFE"
       />
       <rect
-        x={164.229}
-        y={31.7422}
-        width={11.253}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="122.332"
+        y="61.9937"
+        width="10.0771"
+        height="1.88444"
+        rx="0.942218"
+        fill="#FEFEFE"
+      />
+      <path
+        d="M116.506 61.9937H118.87C119.391 61.9937 119.813 62.4154 119.813 62.9358C119.813 63.4561 119.391 63.8779 118.87 63.8779H116.506V61.9937Z"
+        fill="#FEFEFE"
       />
       <rect
-        x={147.68}
-        y={31.7422}
-        width={13.9008}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="123.73"
+        y="66.0762"
+        width="50.7006"
+        height="8.79317"
+        rx="1.5"
+        fill="#B4B3F4"
       />
       <rect
-        x={140.233}
-        y={31.7422}
-        width={4.79907}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="160.259"
+        y="69.5306"
+        width="10.707"
+        height="1.88444"
+        rx="0.942218"
+        fill="#FEFEFE"
       />
       <rect
-        x={129.477}
-        y={31.7422}
-        width={8.10877}
-        height={1.98054}
-        rx={0.990269}
-        fill="#959CA8"
+        x="144.514"
+        y="69.5306"
+        width="13.2262"
+        height="1.88444"
+        rx="0.942218"
+        fill="#FEFEFE"
       />
-    </g>
-    <path
-      d="M118.244 57.6594V60.7877L126.495 65.2624C127.195 65.6421 128.062 65.5138 128.622 64.9478L139.261 54.1865H135.62L127.589 62.5156C127.446 62.6637 127.22 62.6953 127.042 62.5919L118.244 57.6594Z"
-      fill="#3B5BDB"
-    />
-    <path
-      d="M131.708 52.8663C131.708 52.137 132.3 51.5459 133.031 51.5459H143.954C144.685 51.5459 145.277 52.137 145.277 52.8663V52.8663C145.277 53.5955 144.685 54.1866 143.954 54.1866H133.031C132.3 54.1866 131.708 53.5955 131.708 52.8663V52.8663Z"
-      fill="#3B5BDB"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M83.3283 63.4473C84.1249 63.5441 84.692 64.267 84.595 65.0618C84.5327 65.5717 84.5006 66.0914 84.5006 66.6193C84.5006 68.5554 84.9326 70.3868 85.7044 72.0265C86.0456 72.7512 85.7333 73.6147 85.007 73.9551C84.2807 74.2955 83.4154 73.984 83.0742 73.2592C82.1247 71.2419 81.5947 68.9903 81.5947 66.6193C81.5947 65.974 81.634 65.3372 81.7104 64.7112C81.8074 63.9164 82.5318 63.3505 83.3283 63.4473Z"
-      fill="#3B5BDB"
-    />
-    <path
-      d="M64.683 55.0245V58.244L63.1895 58.9406C69.4503 61.6998 83.3787 67.841 83.3787 67.841V70.8672L60.092 60.5667C58.8353 60.0108 58.7888 58.1134 60.0167 57.4871L64.683 55.0245Z"
-      fill="#3B5BDB"
-    />
-    <g filter="url(#filter2_d_4997_39198)">
       <rect
-        x={128.195}
-        y={30.5869}
-        width={18.5343}
-        height={18.4832}
-        rx={8.439}
-        fill="#3B5BDB"
+        x="137.428"
+        y="69.5306"
+        width="4.56569"
+        height="1.88422"
+        rx="0.942111"
+        fill="#FEFEFE"
+      />
+      <rect
+        x="127.194"
+        y="69.5306"
+        width="7.71443"
+        height="1.88422"
+        rx="0.942111"
+        fill="#FEFEFE"
       />
-    </g>
-    <path
-      d="M138.41 45.0735V44.0862C139.872 43.8932 140.787 43.0549 140.787 41.8526C140.787 40.6557 140.19 39.7843 138.75 39.4369L137.474 39.1225C136.614 38.8964 136.362 38.6647 136.362 38.2015C136.362 37.6223 136.899 37.2252 137.77 37.2252C138.613 37.2252 138.93 37.6554 139.029 38.3614L140.644 38.3338C140.661 37.1922 139.823 36.2435 138.443 36.0009V34.9033H137.058V35.9953C135.645 36.2104 134.637 37.0874 134.648 38.389C134.665 39.6134 135.442 40.3248 136.652 40.573L137.95 40.8543C138.722 41.0308 139.089 41.2735 139.089 41.8636C139.089 42.4317 138.525 42.8563 137.737 42.8563C136.861 42.8563 136.247 42.4703 136.078 41.7423L134.413 41.7753C134.561 43.1707 135.53 43.9208 137.03 44.0918V45.0735H138.41Z"
-      fill="white"
-    />
-    <mask
-      id="mask0_4997_39198"
-      style={{
-        maskType: "luminance"
-      }}
-      maskUnits="userSpaceOnUse"
-      x={134}
-      y={34}
-      width={7}
-      height={12}
-    >
       <path
-        d="M138.41 45.0735V44.0862C139.872 43.8932 140.787 43.0549 140.787 41.8526C140.787 40.6557 140.19 39.7843 138.75 39.4369L137.474 39.1225C136.614 38.8964 136.362 38.6647 136.362 38.2015C136.362 37.6223 136.899 37.2252 137.77 37.2252C138.613 37.2252 138.93 37.6554 139.029 38.3614L140.644 38.3338C140.661 37.1922 139.823 36.2435 138.443 36.0009V34.9033H137.058V35.9953C135.645 36.2104 134.637 37.0874 134.648 38.389C134.665 39.6134 135.442 40.3248 136.652 40.573L137.95 40.8543C138.722 41.0308 139.089 41.2735 139.089 41.8636C139.089 42.4317 138.525 42.8563 137.737 42.8563C136.861 42.8563 136.247 42.4703 136.078 41.7423L134.413 41.7753C134.561 43.1707 135.53 43.9208 137.03 44.0918V45.0735H138.41Z"
-        fill="white"
+        d="M116.506 94.1898V97.1663L124.357 101.424C125.023 101.785 125.848 101.663 126.38 101.125L136.503 90.8855H133.039L125.398 98.8104C125.262 98.9514 125.047 98.9814 124.878 98.883L116.506 94.1898Z"
+        fill="#6145F7"
+      />
+      <path
+        d="M129.316 89.6295C129.316 88.9356 129.88 88.3732 130.575 88.3732H140.969C141.664 88.3732 142.228 88.9356 142.228 89.6295C142.228 90.3233 141.664 90.8858 140.969 90.8858H130.575C129.88 90.8858 129.316 90.3233 129.316 89.6295Z"
+        fill="#6145F7"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M83.2849 99.6975C84.0428 99.7896 84.5824 100.477 84.4901 101.234C84.4309 101.719 84.4003 102.213 84.4003 102.716C84.4003 104.558 84.8114 106.3 85.5457 107.86C85.8703 108.55 85.5732 109.372 84.8821 109.695C84.1911 110.019 83.3677 109.723 83.0431 109.033C82.1397 107.114 81.6354 104.972 81.6354 102.716C81.6354 102.102 81.6728 101.496 81.7455 100.9C81.8378 100.144 82.527 99.6054 83.2849 99.6975Z"
+        fill="#6145F7"
+      />
+      <path
+        d="M65.5443 91.6835V94.7467L64.1232 95.4096C70.0803 98.0349 83.3328 103.878 83.3328 103.878V106.757L61.1761 96.9568C59.9803 96.4279 59.9361 94.6225 61.1044 94.0266L65.5443 91.6835Z"
+        fill="#6145F7"
       />
-    </mask>
-    <g mask="url(#mask0_4997_39198)">
       <rect
-        x={129.951}
-        y={32.2012}
-        width={15.2974}
-        height={15.2552}
+        x="125.975"
+        y="68.4315"
+        width="17.635"
+        height="17.5863"
+        rx="8.439"
+        fill="#6145F7"
+      />
+      <path
+        d="M135.726 72.5382V73.5822C137.038 73.8131 137.835 74.7158 137.819 75.8019L136.283 75.8282C136.189 75.1567 135.886 74.7472 135.084 74.7472C134.256 74.7473 133.745 75.1252 133.745 75.6759C133.745 76.1167 133.985 76.3377 134.803 76.5529L136.017 76.8517C137.387 77.1823 137.955 78.0118 137.955 79.1505C137.955 80.2943 137.085 81.0918 135.694 81.2755V82.215H134.381V81.2804C132.953 81.1177 132.031 80.4039 131.891 79.0763L133.475 79.045C133.636 79.7376 134.219 80.1055 135.053 80.1056C135.803 80.1056 136.34 79.7008 136.34 79.1603C136.34 78.5992 135.991 78.3682 135.257 78.2003L134.021 77.9327C132.87 77.6966 132.13 77.0196 132.114 75.8546C132.104 74.6162 133.063 73.7819 134.407 73.5773V72.5382H135.726Z"
         fill="white"
       />
-    </g>
-    <path
-      d="M73.1709 76.0977H108.878V86.0489C108.878 86.6955 108.354 87.2196 107.707 87.2196H74.3416C73.6951 87.2196 73.1709 86.6955 73.1709 86.0489V76.0977Z"
-      fill="white"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M106.537 78.4391H75.5124V84.8781H106.537V78.4391ZM73.1709 76.0977V86.0489C73.1709 86.6955 73.6951 87.2196 74.3416 87.2196H107.707C108.354 87.2196 108.878 86.6955 108.878 86.0489V76.0977H73.1709Z"
-      fill="#292A33"
-    />
-    <defs>
-      <filter
-        id="filter0_d_4997_39198"
-        x={107.093}
-        y={9.03814}
-        width={59.8678}
-        height={31.5438}
-        filterUnits="userSpaceOnUse"
-        colorInterpolationFilters="sRGB"
-      >
-        <feFlood floodOpacity={0} result="BackgroundImageFix" />
-        <feColorMatrix
-          in="SourceAlpha"
-          type="matrix"
-          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-          result="hardAlpha"
-        />
-        <feOffset />
-        <feGaussianBlur stdDeviation={5.57566} />
-        <feComposite in2="hardAlpha" operator="out" />
-        <feColorMatrix
-          type="matrix"
-          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"
-        />
-        <feBlend
-          mode="normal"
-          in2="BackgroundImageFix"
-          result="effect1_dropShadow_4997_39198"
-        />
-        <feBlend
-          mode="normal"
-          in="SourceGraphic"
-          in2="effect1_dropShadow_4997_39198"
-          result="shape"
-        />
-      </filter>
-      <filter
-        id="filter1_d_4997_39198"
-        x={114.685}
-        y={16.96}
-        width={75.5888}
-        height={31.5438}
-        filterUnits="userSpaceOnUse"
-        colorInterpolationFilters="sRGB"
-      >
-        <feFlood floodOpacity={0} result="BackgroundImageFix" />
-        <feColorMatrix
-          in="SourceAlpha"
-          type="matrix"
-          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-          result="hardAlpha"
-        />
-        <feOffset />
-        <feGaussianBlur stdDeviation={5.57566} />
-        <feComposite in2="hardAlpha" operator="out" />
-        <feColorMatrix
-          type="matrix"
-          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"
-        />
-        <feBlend
-          mode="normal"
-          in2="BackgroundImageFix"
-          result="effect1_dropShadow_4997_39198"
-        />
-        <feBlend
-          mode="normal"
-          in="SourceGraphic"
-          in2="effect1_dropShadow_4997_39198"
-          result="shape"
-        />
-      </filter>
-      <filter
-        id="filter2_d_4997_39198"
-        x={113.195}
-        y={15.5869}
-        width={48.5344}
-        height={48.4834}
-        filterUnits="userSpaceOnUse"
-        colorInterpolationFilters="sRGB"
+      <mask
+        id="mask0_9348_204"
+        maskUnits="userSpaceOnUse"
+        x="131"
+        y="72"
+        width="7"
+        height="11"
       >
-        <feFlood floodOpacity={0} result="BackgroundImageFix" />
-        <feColorMatrix
-          in="SourceAlpha"
-          type="matrix"
-          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-          result="hardAlpha"
+        <path
+          d="M135.726 72.5382V73.5822C137.038 73.8131 137.835 74.7158 137.819 75.8019L136.283 75.8282C136.189 75.1567 135.886 74.7472 135.084 74.7472C134.256 74.7473 133.745 75.1252 133.745 75.6759C133.745 76.1167 133.985 76.3377 134.803 76.5529L136.017 76.8517C137.387 77.1823 137.955 78.0118 137.955 79.1505C137.955 80.2943 137.085 81.0918 135.694 81.2755V82.215H134.381V81.2804C132.953 81.1177 132.031 80.4039 131.891 79.0763L133.475 79.045C133.636 79.7376 134.219 80.1055 135.053 80.1056C135.803 80.1056 136.34 79.7008 136.34 79.1603C136.34 78.5992 135.991 78.3682 135.257 78.2003L134.021 77.9327C132.87 77.6966 132.13 77.0196 132.114 75.8546C132.104 74.6162 133.063 73.7819 134.407 73.5773V72.5382H135.726Z"
+          fill="white"
         />
-        <feOffset />
-        <feGaussianBlur stdDeviation={7.5} />
-        <feComposite in2="hardAlpha" operator="out" />
-        <feColorMatrix
-          type="matrix"
-          values="0 0 0 0 0.0823529 0 0 0 0 0.454902 0 0 0 0 0.615686 0 0 0 0.2 0"
+      </mask>
+      <g mask="url(#mask0_9348_204)">
+        <rect
+          x="127.645"
+          y="69.9679"
+          width="14.5552"
+          height="14.515"
+          fill="white"
         />
-        <feBlend
-          mode="normal"
-          in2="BackgroundImageFix"
-          result="effect1_dropShadow_4997_39198"
-        />
-        <feBlend
-          mode="normal"
-          in="SourceGraphic"
-          in2="effect1_dropShadow_4997_39198"
-          result="shape"
-        />
-      </filter>
-    </defs>
+      </g>
+      <path
+        d="M73.6203 111.734H107.595V121.202C107.595 121.818 107.096 122.316 106.481 122.316H74.7342C74.119 122.316 73.6203 121.818 73.6203 121.202V111.734Z"
+        fill="white"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.367 113.962H75.8481V120.089H105.367V113.962ZM73.6203 111.734V121.202C73.6203 121.818 74.119 122.316 74.7342 122.316H106.481C107.096 122.316 107.595 121.818 107.595 121.202V111.734H73.6203Z"
+        fill="#292A33"
+      />
+    </g>
   </svg>
 );
 

package/src/components/atoms/icons/MasterCardLargeIcon.js

@@ -0,0 +1,35 @@
+import React from "react";
+
+const MasterCardLargeIcon = () => {
+  return (
+    <svg
+      width="36"
+      height="24"
+      viewBox="0 0 36 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      role="img"
+      aria-label="Mastercard"
+    >
+      <rect width="36" height="24" rx="1.5" fill="#F6F6F9" />
+      <path
+        d="M21.7104 5.06982H14.2698V18.4409H21.7104V5.06982Z"
+        fill="#FF5F00"
+      />
+      <path
+        d="M14.7422 11.7553C14.7410 10.4676 14.9329 9.19649 15.5955 8.03822C16.2583 6.87993 17.1270 5.86487 18.0001 5.06984C16.7357 4.08381 15.2291 3.47061 13.6426 3.30033C12.0561 3.13007 10.4538 3.40956 9.01863 4.10691C7.58351 4.80426 6.37353 5.89133 5.52701 7.24383C4.6805 8.59635 4.23156 10.1597 4.23156 11.7553C4.23156 13.3509 4.6805 14.9143 5.52701 16.2668C6.37353 17.6193 7.58351 18.7064 9.01863 19.4037C10.4538 20.1011 12.0561 20.3806 13.6426 20.2103C15.2291 20.0400 16.7357 19.4268 18.0001 18.4408C17.1272 17.6457 16.2583 16.6307 15.5955 15.4724C14.9329 14.3141 14.7410 13.043 14.7422 11.7553Z"
+        fill="#EB001B"
+      />
+      <path
+        d="M31.7483 11.7553C31.7483 13.3509 31.2994 14.9143 30.4529 16.2668C29.6064 17.6193 28.3965 18.7064 26.9614 19.4037C25.5263 20.1011 23.924 20.3805 22.3376 20.2103C20.751 20.04 19.2446 19.4268 17.9801 18.4408C18.8522 17.6450 19.5204 16.6298 19.9831 15.4716C20.4456 14.3136 20.7379 13.0428 20.7379 11.7553C20.7379 10.4678 20.4456 9.19709 19.9831 8.03899C19.5204 6.88091 18.8522 5.86566 17.9801 5.06984C19.2446 4.08381 20.751 3.47061 22.3376 3.30033C23.924 3.13006 25.5263 3.40958 26.9614 4.10694C28.3965 4.80429 29.6064 5.89136 30.4529 7.24386C31.2994 8.59638 31.7483 10.1598 31.7483 11.7553Z"
+        fill="#F79E1B"
+      />
+      <path
+        d="M30.9371 17.0246V16.7508H31.0475V16.6952H30.7664V16.7508H30.8768V17.0246H30.9371ZM31.4828 17.0246V16.6946H31.3967L31.2977 16.9215L31.1984 16.6946H31.1121V17.0246H31.173V16.7757L31.266 16.9904H31.329L31.422 16.7751V17.0246H31.4828Z"
+        fill="#F79E1B"
+      />
+    </svg>
+  );
+};
+
+export default MasterCardLargeIcon;