diff --git a/src/assets/css/common.scss b/src/assets/css/common.scss
index ff7aaaf..5f7b322 100644
--- a/src/assets/css/common.scss
+++ b/src/assets/css/common.scss
@@ -102,29 +102,4 @@ $font-secondary-color: #9E9E9E;
     width: 23px;
     height: 23px;
   }
-}
-
-.loading-mask {
-  position: absolute;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  z-index: 100;
-  background-color: rgba(200, 200, 200, 0.2);
-}
-
-.fit-fullscreen {
-  position: relative;
-  width: 100%;
-  height: 100vh;
-}
-
-.fit-center {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
 }
\ No newline at end of file
diff --git a/src/assets/css/fit-center.scss b/src/assets/css/fit-center.scss
new file mode 100644
index 0000000..fd07971
--- /dev/null
+++ b/src/assets/css/fit-center.scss
@@ -0,0 +1,7 @@
+.fit-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+}
\ No newline at end of file
diff --git a/src/assets/css/fit-fullscreen.scss b/src/assets/css/fit-fullscreen.scss
new file mode 100644
index 0000000..83d0ff6
--- /dev/null
+++ b/src/assets/css/fit-fullscreen.scss
@@ -0,0 +1,5 @@
+.fit-fullscreen {
+  position: relative;
+  width: 100%;
+  height: 100vh;
+}
\ No newline at end of file
diff --git a/src/assets/css/loading-mask.scss b/src/assets/css/loading-mask.scss
new file mode 100644
index 0000000..ad20dde
--- /dev/null
+++ b/src/assets/css/loading-mask.scss
@@ -0,0 +1,10 @@
+.loading-mask {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+  background-color: rgba(200, 200, 200, 0.2);
+}
\ No newline at end of file
diff --git a/src/components/FitCenter.tsx b/src/components/FitCenter.tsx
index 3cd08bd..ede8b2e 100644
--- a/src/components/FitCenter.tsx
+++ b/src/components/FitCenter.tsx
@@ -1,4 +1,5 @@
 import React from 'react'
+import '@/assets/css/fit-center.scss'
 
 const FitCenter: React.FC<PropsWithChildren> = (props: PropsWithChildren) => {
     return (
diff --git a/src/components/FitFullScreen.tsx b/src/components/FitFullScreen.tsx
index f4e0402..e356c2c 100644
--- a/src/components/FitFullScreen.tsx
+++ b/src/components/FitFullScreen.tsx
@@ -1,3 +1,5 @@
+import '@/assets/css/fit-fullscreen.scss'
+
 interface FitFullscreenProps extends PropsWithChildren {
     zIndex?: number
     backgroundColor?: string
diff --git a/src/components/LoadingMask.tsx b/src/components/LoadingMask.tsx
index cde12a5..2a28c57 100644
--- a/src/components/LoadingMask.tsx
+++ b/src/components/LoadingMask.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 import Icon from '@ant-design/icons'
 import FitFullScreen from '@/components/FitFullScreen.tsx'
 import { COLOR_FONT_MAIN } from '@/constants/Common.constants.ts'
+import '@/assets/css/loading-mask.scss'
 
 const LoadingMask: React.FC = () => {
     const loadingIcon = (