@scglab/admin-ui 0.1.1 → 0.1.3

package/dist/styles/index.css

@@ -1,8 +1,1889 @@
 @charset "UTF-8";
 @import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
+.flex {
+  display: flex;
+}
+
+.grid {
+  display: grid;
+}
+
+.grid-cols-1 {
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.grid-cols-2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.grid-cols-3 {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.grid-cols-4 {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}
+
+.flex-row {
+  flex-direction: row;
+}
+
+.flex-col {
+  flex-direction: column;
+}
+
+.flex-wrap {
+  flex-wrap: wrap;
+}
+
+.justify-start {
+  justify-content: flex-start;
+}
+
+.justify-center {
+  justify-content: center;
+}
+
+.justify-end {
+  justify-content: flex-end;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.justify-around {
+  justify-content: space-around;
+}
+
+.justify-evenly {
+  justify-content: space-evenly;
+}
+
+.items-baseline {
+  align-items: baseline;
+}
+
+.items-start {
+  align-items: flex-start;
+}
+
+.items-center {
+  align-items: center;
+}
+
+.items-end {
+  align-items: flex-end;
+}
+
+.items-stretch {
+  align-items: stretch;
+}
+
+.content-start {
+  align-content: flex-start;
+}
+
+.content-center {
+  align-content: center;
+}
+
+.content-end {
+  align-content: flex-end;
+}
+
+.content-between {
+  align-content: space-between;
+}
+
+.content-around {
+  align-content: space-around;
+}
+
+.w-full {
+  width: 100%;
+}
+
+.h-full {
+  height: 100%;
+}
+
+.even > * {
+  flex: 1;
+}
+
+.leading-none {
+  line-height: 1;
+}
+
+.leading-tight {
+  line-height: 1.25;
+}
+
+.leading-normal {
+  line-height: 1.5;
+}
+
+.leading-relaxed {
+  line-height: 1.75;
+}
+
+.leading-\[36px\] {
+  line-height: 2.5714285714rem;
+}
+
+.leading-36 {
+  line-height: 2.5714285714rem;
+}
+
+.gap-0 {
+  gap: 0;
+}
+
+.gap-1 {
+  gap: 0.0714285714rem;
+}
+
+.gap-2 {
+  gap: 0.1428571429rem;
+}
+
+.space-x-0 > * + * {
+  margin-left: 0;
+}
+
+.space-x-1 > * + * {
+  margin-left: 0.0714285714rem;
+}
+
+.space-x-2 > * + * {
+  margin-left: 0.1428571429rem;
+}
+
+.space-x-4 > * + * {
+  margin-left: 0.2857142857rem;
+}
+
+.space-x-8 > * + * {
+  margin-left: 0.5714285714rem;
+}
+
+.space-y-0 > * + * {
+  margin-top: 0;
+}
+
+.space-y-1 > * + * {
+  margin-top: 0.0714285714rem;
+}
+
+.space-y-2 > * + * {
+  margin-top: 0.1428571429rem;
+}
+
+.space-y-4 > * + * {
+  margin-top: 0.2857142857rem;
+}
+
+.space-y-8 > * + * {
+  margin-top: 0.5714285714rem;
+}
+
+.gap-4 {
+  gap: 0.2857142857rem;
+}
+
+.gap-6 {
+  gap: 0.4285714286rem;
+}
+
+.gap-8 {
+  gap: 0.5714285714rem;
+}
+
+.gap-10 {
+  gap: 0.7142857143rem;
+}
+
+.gap-12 {
+  gap: 0.8571428571rem;
+}
+
+.gap-14 {
+  gap: 1rem;
+}
+
+.gap-16 {
+  gap: 1.1428571429rem;
+}
+
+.gap-20 {
+  gap: 1.4285714286rem;
+}
+
+.gap-24 {
+  gap: 1.7142857143rem;
+}
+
+.gap-32 {
+  gap: 2.2857142857rem;
+}
+
+.p-0 {
+  padding: 0;
+}
+
+.p-4 {
+  padding: 0.2857142857rem;
+}
+
+.p-6 {
+  padding: 0.4285714286rem;
+}
+
+.p-8 {
+  padding: 0.5714285714rem;
+}
+
+.p-12 {
+  padding: 0.8571428571rem;
+}
+
+.p-16 {
+  padding: 1.1428571429rem;
+}
+
+.p-20 {
+  padding: 1.4285714286rem;
+}
+
+.p-24 {
+  padding: 1.7142857143rem;
+}
+
+.px-0 {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.px-1 {
+  padding-left: 0.0714285714rem;
+  padding-right: 0.0714285714rem;
+}
+
+.px-4 {
+  padding-left: 0.2857142857rem;
+  padding-right: 0.2857142857rem;
+}
+
+.px-6 {
+  padding-left: 0.4285714286rem;
+  padding-right: 0.4285714286rem;
+}
+
+.px-8 {
+  padding-left: 0.5714285714rem;
+  padding-right: 0.5714285714rem;
+}
+
+.px-10 {
+  padding-left: 0.7142857143rem;
+  padding-right: 0.7142857143rem;
+}
+
+.px-12 {
+  padding-left: 0.8571428571rem;
+  padding-right: 0.8571428571rem;
+}
+
+.px-16 {
+  padding-left: 1.1428571429rem;
+  padding-right: 1.1428571429rem;
+}
+
+.px-20 {
+  padding-left: 1.4285714286rem;
+  padding-right: 1.4285714286rem;
+}
+
+.px-24 {
+  padding-left: 1.7142857143rem;
+  padding-right: 1.7142857143rem;
+}
+
+.px-28 {
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+
+.py-0 {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.py-1 {
+  padding-top: 0.0714285714rem;
+  padding-bottom: 0.0714285714rem;
+}
+
+.py-2 {
+  padding-top: 0.1428571429rem;
+  padding-bottom: 0.1428571429rem;
+}
+
+.py-4 {
+  padding-top: 0.2857142857rem;
+  padding-bottom: 0.2857142857rem;
+}
+
+.py-6 {
+  padding-top: 0.4285714286rem;
+  padding-bottom: 0.4285714286rem;
+}
+
+.py-7 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.py-8 {
+  padding-top: 0.5714285714rem;
+  padding-bottom: 0.5714285714rem;
+}
+
+.py-12 {
+  padding-top: 0.8571428571rem;
+  padding-bottom: 0.8571428571rem;
+}
+
+.py-13 {
+  padding-top: 0.9285714286rem;
+  padding-bottom: 0.9285714286rem;
+}
+
+.py-16 {
+  padding-top: 1.1428571429rem;
+  padding-bottom: 1.1428571429rem;
+}
+
+.pt-4 {
+  padding-top: 0.2857142857rem;
+}
+
+.pt-5 {
+  padding-top: 0.3571428571rem;
+}
+
+.pt-7 {
+  padding-top: 0.5rem;
+}
+
+.pt-8 {
+  padding-top: 0.5714285714rem;
+}
+
+.pt-12 {
+  padding-top: 0.8571428571rem;
+}
+
+.pt-16 {
+  padding-top: 1.1428571429rem;
+}
+
+.pr-40 {
+  padding-right: 2.8571428571rem;
+}
+
+.pb-4 {
+  padding-bottom: 0.2857142857rem;
+}
+
+.pb-8 {
+  padding-bottom: 0.5714285714rem;
+}
+
+.pb-12 {
+  padding-bottom: 0.8571428571rem;
+}
+
+.pb-16 {
+  padding-bottom: 1.1428571429rem;
+}
+
+.pl-2 {
+  padding-left: 0.1428571429rem;
+}
+
+.pl-4 {
+  padding-left: 0.2857142857rem;
+}
+
+.pl-8 {
+  padding-left: 0.5714285714rem;
+}
+
+.pl-12 {
+  padding-left: 0.8571428571rem;
+}
+
+.pl-16 {
+  padding-left: 1.1428571429rem;
+}
+
+.pr-4 {
+  padding-right: 0.2857142857rem;
+}
+
+.pr-8 {
+  padding-right: 0.5714285714rem;
+}
+
+.pr-12 {
+  padding-right: 0.8571428571rem;
+}
+
+.pr-16 {
+  padding-right: 1.1428571429rem;
+}
+
+.pr-40 {
+  padding-right: 2.8571428571rem;
+}
+
+.m-0 {
+  margin: 0;
+}
+
+.m-4 {
+  margin: 0.2857142857rem;
+}
+
+.m-8 {
+  margin: 0.5714285714rem;
+}
+
+.m-12 {
+  margin: 0.8571428571rem;
+}
+
+.m-16 {
+  margin: 1.1428571429rem;
+}
+
+.mx-0 {
+  margin-left: 0;
+  margin-right: 0;
+}
+
+.mx-4 {
+  margin-left: 0.2857142857rem;
+  margin-right: 0.2857142857rem;
+}
+
+.mx-8 {
+  margin-left: 0.5714285714rem;
+  margin-right: 0.5714285714rem;
+}
+
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.my-0 {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.my-4 {
+  margin-top: 0.2857142857rem;
+  margin-bottom: 0.2857142857rem;
+}
+
+.my-8 {
+  margin-top: 0.5714285714rem;
+  margin-bottom: 0.5714285714rem;
+}
+
+.my-10 {
+  margin-top: 0.7142857143rem;
+  margin-bottom: 0.7142857143rem;
+}
+
+.my-12 {
+  margin-top: 0.8571428571rem;
+  margin-bottom: 0.8571428571rem;
+}
+
+.my-16 {
+  margin-top: 1.1428571429rem;
+  margin-bottom: 1.1428571429rem;
+}
+
+.mt-3 {
+  margin-top: 0.2142857143rem;
+}
+
+.mt-4 {
+  margin-top: 0.2857142857rem;
+}
+
+.mt-5 {
+  margin-top: 0.3571428571rem;
+}
+
+.mt-7 {
+  margin-top: 0.5rem;
+}
+
+.mt-8 {
+  margin-top: 0.5714285714rem;
+}
+
+.mt-9 {
+  margin-top: 0.6428571429rem;
+}
+
+.mt-12 {
+  margin-top: 0.8571428571rem;
+}
+
+.mt-16 {
+  margin-top: 1.1428571429rem;
+}
+
+.mt-24 {
+  margin-top: 1.7142857143rem;
+}
+
+.mb-4 {
+  margin-bottom: 0.2857142857rem;
+}
+
+.mb-6 {
+  margin-bottom: 0.4285714286rem;
+}
+
+.mb-8 {
+  margin-bottom: 0.5714285714rem;
+}
+
+.mb-12 {
+  margin-bottom: 0.8571428571rem;
+}
+
+.mb-16 {
+  margin-bottom: 1.1428571429rem;
+}
+
+.mb-20 {
+  margin-bottom: 1.4285714286rem;
+}
+
+.mb-24 {
+  margin-bottom: 1.7142857143rem;
+}
+
+.ml-3 {
+  margin-left: 0.2142857143rem;
+}
+
+.ml-4 {
+  margin-left: 0.2857142857rem;
+}
+
+.ml-5 {
+  margin-left: 0.3571428571rem;
+}
+
+.ml-8 {
+  margin-left: 0.5714285714rem;
+}
+
+.ml-20 {
+  margin-left: 1.4285714286rem;
+}
+
+.ml-auto {
+  margin-left: auto;
+}
+
+.-ml-1 {
+  margin-left: -0.0714285714rem;
+}
+
+.mr-2 {
+  margin-right: 0.1428571429rem;
+}
+
+.mr-4 {
+  margin-right: 0.2857142857rem;
+}
+
+.mr-8 {
+  margin-right: 0.5714285714rem;
+}
+
+.mr-auto {
+  margin-right: auto;
+}
+
+.w-auto {
+  width: auto;
+}
+
+.w-fit {
+  width: fit-content;
+}
+
+.w-3 {
+  width: 0.2142857143rem;
+}
+
+.w-6 {
+  width: 0.4285714286rem;
+}
+
+.w-10 {
+  width: 0.7142857143rem;
+}
+
+.w-12 {
+  width: 0.8571428571rem;
+}
+
+.w-14 {
+  width: 1rem;
+}
+
+.w-16 {
+  width: 1.1428571429rem;
+}
+
+.w-18 {
+  width: 1.2857142857rem;
+}
+
+.w-20 {
+  width: 1.4285714286rem;
+}
+
+.w-24 {
+  width: 1.7142857143rem;
+}
+
+.w-32 {
+  width: 2.2857142857rem;
+}
+
+.w-40 {
+  width: 2.8571428571rem;
+}
+
+.w-44 {
+  width: 3.1428571429rem;
+}
+
+.w-48 {
+  width: 3.4285714286rem;
+}
+
+.w-56 {
+  width: 4rem;
+}
+
+.w-64 {
+  width: 4.5714285714rem;
+}
+
+.w-80 {
+  width: 5.7142857143rem;
+}
+
+.w-96 {
+  width: 6.8571428571rem;
+}
+
+.w-\[100px\] {
+  width: 100px;
+}
+
+.w-\[200px\] {
+  width: 200px;
+}
+
+.h-auto {
+  height: auto;
+}
+
+.h-3 {
+  height: 0.2142857143rem;
+}
+
+.h-5 {
+  height: 0.3571428571rem;
+}
+
+.h-6 {
+  height: 0.4285714286rem;
+}
+
+.h-10 {
+  height: 0.7142857143rem;
+}
+
+.h-14 {
+  height: 1rem;
+}
+
+.h-16 {
+  height: 1.1428571429rem;
+}
+
+.h-18 {
+  height: 1.2857142857rem;
+}
+
+.h-20 {
+  height: 1.4285714286rem;
+}
+
+.h-24 {
+  height: 1.7142857143rem;
+}
+
+.h-28 {
+  height: 2rem;
+}
+
+.h-32 {
+  height: 2.2857142857rem;
+}
+
+.h-36 {
+  height: 2.5714285714rem;
+}
+
+.h-40 {
+  height: 2.8571428571rem;
+}
+
+.h-44 {
+  height: 3.1428571429rem;
+}
+
+.h-48 {
+  height: 3.4285714286rem;
+}
+
+.h-56 {
+  height: 4rem;
+}
+
+.h-64 {
+  height: 4.5714285714rem;
+}
+
+.h-\[calc\(100\%-6px\)\] {
+  height: calc(100% - 6px);
+}
+
+.min-h-0 {
+  min-height: 0;
+}
+
+.min-h-20 {
+  min-height: 1.4285714286rem;
+}
+
+.min-h-36 {
+  min-height: 2.5714285714rem;
+}
+
+.min-h-48 {
+  min-height: 3.4285714286rem;
+}
+
+.min-h-screen {
+  min-height: 100vh;
+}
+
+.min-w-0 {
+  min-width: 0;
+}
+
+.min-w-full {
+  min-width: 100%;
+}
+
+.min-w-\[140px\] {
+  min-width: 140px;
+}
+
+.max-h-36 {
+  max-height: 2.5714285714rem;
+}
+
+.max-h-48 {
+  max-height: 3.4285714286rem;
+}
+
+.max-h-64 {
+  max-height: 4.5714285714rem;
+}
+
+.max-h-200 {
+  max-height: 14.2857142857rem;
+}
+
+.max-h-screen {
+  max-height: 100vh;
+}
+
+.border {
+  border-width: 1px;
+  border-style: solid;
+}
+
+.border-0 {
+  border-width: 0;
+}
+
+.border-2 {
+  border-width: 2px;
+  border-style: solid;
+}
+
+.border-t {
+  border-top-width: 1px;
+  border-top-style: solid;
+}
+
+.border-b {
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
+.border-b-2 {
+  border-bottom-width: 2px;
+  border-bottom-style: solid;
+}
+
+.border-b-0 {
+  border-bottom-width: 0;
+}
+
+.border-l {
+  border-left-width: 1px;
+  border-left-style: solid;
+}
+
+.border-r {
+  border-right-width: 1px;
+  border-right-style: solid;
+}
+
+.border-transparent {
+  border-color: transparent;
+}
+
+.border-white {
+  border-color: var(--color-white);
+}
+
+.border-black {
+  border-color: var(--color-black);
+}
+
+.border-gray {
+  border-color: var(--color-gray);
+}
+
+.border-gray1 {
+  border-color: var(--color-gray1);
+}
+
+.border-gray2 {
+  border-color: var(--color-gray2);
+}
+
+.border-gray3 {
+  border-color: var(--color-gray3);
+}
+
+.border-line {
+  border-color: var(--color-line);
+}
+
+.border-stroke {
+  border-color: var(--color-stroke);
+}
+
+.border-primary {
+  border-color: var(--color-primary);
+}
+
+.border-primary3Border {
+  border-color: var(--color-primary3Border);
+}
+
+.border-red {
+  border-color: var(--color-red);
+}
+
+.border-green {
+  border-color: var(--color-green);
+}
+
+.border-blue {
+  border-color: var(--color-blue);
+}
+
+.border-orange {
+  border-color: var(--color-orange);
+}
+
+.rounded-none {
+  border-radius: 0;
+}
+
+.rounded-sm {
+  border-radius: 0.1428571429rem;
+}
+
+.rounded {
+  border-radius: 0.2857142857rem;
+}
+
+.rounded-md {
+  border-radius: 0.4285714286rem;
+}
+
+.rounded-lg {
+  border-radius: 0.5714285714rem;
+}
+
+.rounded-xl {
+  border-radius: 0.8571428571rem;
+}
+
+.rounded-2xl {
+  border-radius: 1.1428571429rem;
+}
+
+.rounded-full {
+  border-radius: 9999px;
+}
+
+.rounded-r-none {
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+
+.rounded-l-none {
+  border-top-left-radius: 0 !important;
+  border-bottom-left-radius: 0 !important;
+}
+
+.bg-transparent {
+  background-color: transparent;
+}
+
+.bg-white {
+  background-color: var(--color-white);
+}
+
+.bg-black {
+  background-color: var(--color-black);
+}
+
+.bg-primary {
+  background-color: var(--color-primary);
+}
+
+.bg-primary10 {
+  background-color: var(--color-primary10);
+}
+
+.bg-primary5 {
+  background-color: var(--color-primary5);
+}
+
+.bg-primary3 {
+  background-color: var(--color-primary3);
+}
+
+.bg-red10 {
+  background-color: var(--color-red10);
+}
+
+.bg-green10 {
+  background-color: var(--color-green10);
+}
+
+.bg-warning10 {
+  background-color: var(--color-warning10);
+}
+
+.bg-secondary {
+  background-color: var(--color-secondary);
+}
+
+.bg-secondaryText {
+  background-color: var(--color-secondaryText);
+}
+
+.bg-stroke {
+  background-color: var(--color-stroke);
+}
+
+.bg-line {
+  background-color: var(--color-line);
+}
+
+.bg-gray1 {
+  background-color: var(--color-gray1);
+}
+
+.bg-gray2 {
+  background-color: var(--color-gray2);
+}
+
+.bg-gray3 {
+  background-color: var(--color-gray3);
+}
+
+.bg-gray4 {
+  background-color: var(--color-gray4);
+}
+
+.bg-gray5 {
+  background-color: var(--color-gray5);
+}
+
+.bg-dark2 {
+  background-color: var(--color-dark2);
+}
+
+.bg-dark3 {
+  background-color: var(--color-dark3);
+}
+
+.bg-dark4 {
+  background-color: var(--color-dark4);
+}
+
+.bg-dark5 {
+  background-color: var(--color-dark5);
+}
+
+.bg-dark6 {
+  background-color: var(--color-dark6);
+}
+
+.bg-dark7 {
+  background-color: var(--color-dark7);
+}
+
+.bg-dark8 {
+  background-color: var(--color-dark8);
+}
+
+.bg-red {
+  background-color: var(--color-red);
+}
+
+.bg-red5 {
+  background-color: var(--color-red5);
+}
+
+.bg-redLight {
+  background-color: var(--color-redLight);
+}
+
+.bg-green {
+  background-color: var(--color-green);
+}
+
+.bg-greenLight {
+  background-color: var(--color-greenLight);
+}
+
+.bg-blue {
+  background-color: var(--color-blue);
+}
+
+.bg-blueLight {
+  background-color: var(--color-blueLight);
+}
+
+.bg-orange {
+  background-color: var(--color-orange);
+}
+
+.bg-orangeLight {
+  background-color: var(--color-orangeLight);
+}
+
+.bg-textLight {
+  background-color: var(--color-textLight);
+}
+
+.bg-warning {
+  background-color: var(--color-warning);
+}
+
+.bg-warningLight {
+  background-color: var(--color-warningLight);
+}
+
+.bg-primaryLight {
+  background-color: var(--color-primaryLight);
+}
+
+.bg-secondaryLight {
+  background-color: var(--color-secondaryLight);
+}
+
+.text-transparent {
+  color: transparent;
+}
+
+.text-current {
+  color: currentColor;
+}
+
+.text-white {
+  color: var(--color-white);
+}
+
+.text-black {
+  color: var(--color-black);
+}
+
+.text-gray {
+  color: var(--color-gray);
+}
+
+.text-primary {
+  color: var(--color-primary);
+}
+
+.text-primaryText {
+  color: var(--color-primaryText);
+}
+
+.text-text {
+  color: var(--color-text);
+}
+
+.text-stroke {
+  color: var(--color-stroke);
+}
+
+.text-line {
+  color: var(--color-line);
+}
+
+.text-secondary {
+  color: var(--color-secondary);
+}
+
+.text-secondaryText {
+  color: var(--color-secondaryText);
+}
+
+.text-red {
+  color: var(--color-red);
+}
+
+.text-green {
+  color: var(--color-green);
+}
+
+.text-blue {
+  color: var(--color-blue);
+}
+
+.text-orange {
+  color: var(--color-orange);
+}
+
+.text-warning {
+  color: var(--color-warning);
+}
+
+.text-dark2 {
+  color: var(--color-dark2);
+}
+
+.text-dark3 {
+  color: var(--color-dark3);
+}
+
+.text-dark4 {
+  color: var(--color-dark4);
+}
+
+.text-dark5 {
+  color: var(--color-dark5);
+}
+
+.text-dark6 {
+  color: var(--color-dark6);
+}
+
+.text-dark7 {
+  color: var(--color-dark7);
+}
+
+.text-dark8 {
+  color: var(--color-dark8);
+}
+
+.text-sm {
+  font-size: 0.8571428571rem;
+}
+
+.text-body10 {
+  font-size: 0.7142857143rem;
+}
+
+.text-body12 {
+  font-size: 0.8571428571rem;
+}
+
+.text-body14 {
+  font-size: 1rem;
+}
+
+.text-subtitle14 {
+  font-size: 1rem;
+  font-weight: 600;
+}
+
+.text-body16 {
+  font-size: 1.1428571429rem;
+}
+
+.text-subtitle16 {
+  font-size: 1.1428571429rem;
+  font-weight: 600;
+}
+
+.text-body18 {
+  font-size: 1.2857142857rem;
+}
+
+.text-h1 {
+  font-size: 2.2857142857rem;
+}
+
+.text-h2 {
+  font-size: 2rem;
+}
+
+.text-h3 {
+  font-size: 1.7142857143rem;
+}
+
+.text-h4 {
+  font-size: 1.4285714286rem;
+}
+
+.text-h5 {
+  font-size: 1.2857142857rem;
+}
+
+.text-h6 {
+  font-size: 1.1428571429rem;
+}
+
+.font-thin {
+  font-weight: 100;
+}
+
+.font-light {
+  font-weight: 300;
+}
+
+.font-normal {
+  font-weight: 400;
+}
+
+.font-medium {
+  font-weight: 500;
+}
+
+.font-semibold {
+  font-weight: 600;
+}
+
+.font-bold {
+  font-weight: 700;
+}
+
+.font-extrabold {
+  font-weight: 800;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.shadow-none {
+  box-shadow: none;
+}
+
+.shadow-sm {
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+}
+
+.shadow {
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+}
+
+.shadow-md {
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+}
+
+.shadow-lg {
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+}
+
+.shadow-xl {
+  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+}
+
+.border-collapse {
+  border-collapse: collapse;
+}
+
+.last\:border-b-0:last-child {
+  border-bottom-width: 0;
+}
+
+.opacity-0 {
+  opacity: 0;
+}
+
+.opacity-25 {
+  opacity: 0.25;
+}
+
+.opacity-50 {
+  opacity: 0.5;
+}
+
+.opacity-75 {
+  opacity: 0.75;
+}
+
+.opacity-80 {
+  opacity: 0.8;
+}
+
+.opacity-100 {
+  opacity: 1;
+}
+
+.overflow-hidden {
+  overflow: hidden;
+}
+
+.overflow-auto {
+  overflow: auto;
+}
+
+.overflow-scroll {
+  overflow: scroll;
+}
+
+.overflow-x-auto {
+  overflow-x: auto;
+}
+
+.overflow-y-auto {
+  overflow-y: auto;
+}
+
+.resize-none {
+  resize: none;
+}
+
+.resize {
+  resize: both;
+}
+
+.resize-x {
+  resize: horizontal;
+}
+
+.resize-y {
+  resize: vertical;
+}
+
+.resize-vertical {
+  resize: vertical;
+}
+
+.relative {
+  position: relative;
+}
+
+.absolute {
+  position: absolute;
+}
+
+.fixed {
+  position: fixed;
+}
+
+.inset-y-0 {
+  top: 0;
+  bottom: 0;
+}
+
+.right-0 {
+  right: 0;
+}
+
+.sticky {
+  position: sticky;
+}
+
+.z-0 {
+  z-index: 0;
+}
+
+.z-10 {
+  z-index: 10;
+}
+
+.z-20 {
+  z-index: 20;
+}
+
+.z-30 {
+  z-index: 30;
+}
+
+.z-40 {
+  z-index: 40;
+}
+
+.z-50 {
+  z-index: 50;
+}
+
+.hidden {
+  display: none;
+}
+
+.block {
+  display: block;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.inline {
+  display: inline;
+}
+
+.inline-flex {
+  display: inline-flex;
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
+
+.touch-none {
+  touch-action: none;
+}
+
+.touch-auto {
+  touch-action: auto;
+}
+
+.pointer-events-none {
+  pointer-events: none;
+}
+
+.pointer-events-auto {
+  pointer-events: auto;
+}
+
+.select-none {
+  user-select: none;
+}
+
+.select-text {
+  user-select: text;
+}
+
+.select-all {
+  user-select: all;
+}
+
+.select-auto {
+  user-select: auto;
+}
+
+.whitespace-normal {
+  white-space: normal;
+}
+
+.whitespace-nowrap {
+  white-space: nowrap;
+}
+
+.whitespace-pre {
+  white-space: pre;
+}
+
+.whitespace-pre-wrap {
+  white-space: pre-wrap;
+}
+
+.translate-x-2 {
+  transform: translateX(0.1428571429rem);
+}
+
+.translate-x-4 {
+  transform: translateX(0.2857142857rem);
+}
+
+.translate-x-8 {
+  transform: translateX(0.5714285714rem);
+}
+
+.translate-x-22 {
+  transform: translateX(1.5714285714rem);
+}
+
+.rotate-0 {
+  transform: rotate(0deg);
+}
+
+.rotate-45 {
+  transform: rotate(45deg);
+}
+
+.rotate-90 {
+  transform: rotate(90deg);
+}
+
+.rotate-180 {
+  transform: rotate(180deg);
+}
+
+.rotate-270 {
+  transform: rotate(270deg);
+}
+
+.-rotate-90 {
+  transform: rotate(-90deg);
+}
+
+.-rotate-180 {
+  transform: rotate(-180deg);
+}
+
+.transition-colors {
+  transition-property: color, background-color, border-color;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.transition-transform {
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.transition-all {
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.duration-100 {
+  transition-duration: 100ms;
+}
+
+.duration-200 {
+  transition-duration: 200ms;
+}
+
+.duration-300 {
+  transition-duration: 300ms;
+}
+
+.ease-in-out {
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+.animate-spin {
+  animation: spin 1s linear infinite;
+}
+
+.focus\:outline-none:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
+.focus\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset, 0 0 0 0) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset, 0 0 0 calc(2px + 0)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0, 0, 0, 0));
+}
+
+.focus\:ring-primary:focus {
+  --tw-ring-color: var(--color-primary);
+}
+
+.focus\:ring-offset-2:focus {
+  --tw-ring-offset-width: 2px;
+}
+
+.hover\:opacity-80:hover {
+  opacity: 0.8;
+}
+
+.hover\:bg-blue-600:hover {
+  background-color: #2563eb;
+}
+
+.hover\:bg-gray3:hover {
+  background-color: var(--color-gray3);
+}
+
+.hover\:bg-warningLight:hover {
+  background-color: var(--color-warningLight);
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.cursor-not-allowed {
+  cursor: not-allowed;
+}
+
+.no-spinner::-webkit-outer-spin-button,
+.no-spinner::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+.no-spinner[type=number] {
+  -moz-appearance: textfield;
+}
+
+.top-\[3px\] {
+  top: 3px;
+}
+
+.flex-auto {
+  flex: 1 1 auto;
+}
+
+.flex-1 {
+  flex: 1 1 0%;
+}
+
+.flex-none {
+  flex: none;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
+.flex-shrink {
+  flex-shrink: 1;
+}
+
+.flex-grow-0 {
+  flex-grow: 0;
+}
+
+.flex-grow {
+  flex-grow: 1;
+}
+
+.rounded-warn {
+  border-radius: 0.2857142857rem;
+}
+
+.rounded-tl-warnOut {
+  border-top-left-radius: 0.2857142857rem;
+}
+
+.rounded-bl-warnOut {
+  border-bottom-left-radius: 0.2857142857rem;
+}
+
+.before\:content-\[\'\'\]::before {
+  content: "";
+}
+
+.before\:absolute::before {
+  position: absolute;
+}
+
+.before\:left-0::before {
+  left: 0;
+}
+
+.before\:top-0::before {
+  top: 0;
+}
+
+.before\:bottom-0::before {
+  bottom: 0;
+}
+
+.before\:w-\[50px\]::before {
+  width: 50px;
+}
+
+.before\:bg-text::before {
+  background-color: var(--color-text);
+}
+
+.before\:bg-warning::before {
+  background-color: var(--color-warning);
+}
+
+.before\:rounded-tl-warnOut::before {
+  border-top-left-radius: 0.2857142857rem;
+}
+
+.before\:rounded-bl-warnOut::before {
+  border-bottom-left-radius: 0.2857142857rem;
+}
+
+.vertical-middle {
+  vertical-align: middle;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
 html {
   font-size: 14px;
   height: 100%;
+  -webkit-text-size-adjust: 100%;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+  line-height: 1.5;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+ul, ol {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+  background-color: transparent;
+}
+
+button {
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: none;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  cursor: pointer;
+  color: inherit;
+}
+
+input,
+select,
+textarea {
+  margin: 0;
+  padding: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  border: none;
+  background: none;
+  color: inherit;
+}
+
+img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  border: 0;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+p, blockquote, pre, address, hr, dl, dd, figure {
+  margin: 0;
+  padding: 0;
+}
+
+fieldset {
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+
+legend {
+  padding: 0;
 }
 
 :root {
@@ -14,10 +1895,12 @@ html {
   --color-primary5: #F5F9FF;
   --color-primary3: #F9FBFF;
   --color-primary3Border: rgba(48, 131, 255, 0.3019607843);
+  --color-primaryLight: #EAF3FF;
   --color-primaryText: #111928;
   --color-text: #637381;
   --color-textLight: #F3F4F6;
   --color-secondary: #18FF82;
+  --color-secondaryLight: #E8FFF3;
   --color-secondaryText: #8899A8;
   --color-stroke: #DFE4EA;
   --color-line: #E7ECF3;