diff --git a/vue/src/layout/component/Main/index.vue b/vue/src/layout/component/Main/index.vue
index b933570..891b3b9 100644
--- a/vue/src/layout/component/Main/index.vue
+++ b/vue/src/layout/component/Main/index.vue
@@ -46,36 +46,4 @@ export default {
 }
 </script>
 
-<style lang="scss">
-@import "~@/asset/style/variables.scss";
-
-.app-main {
-    position: relative;
-    flex: 1;
-    overflow: hidden;
-    background-color: #f5f7f9;
-
-    .scroll-container {
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        overflow-y: overlay;
-        overflow-x: inherit;
-
-        .page-view {
-            margin: $page-view-margin;
-            flex: 1;
-        }
-    }
-
-    .back-to-top {
-        height: 100%;
-        width: 100%;
-        background-color: #f2f5f6;
-        box-shadow: 0 0 6px rgba(0, 0, 0, .12);
-        text-align: center;
-        line-height: 40px;
-        color: #1989fa;
-    }
-}
-</style>
+<style lang="scss" src="./style.scss"></style>
diff --git a/vue/src/layout/component/Main/style.scss b/vue/src/layout/component/Main/style.scss
new file mode 100644
index 0000000..ffa658b
--- /dev/null
+++ b/vue/src/layout/component/Main/style.scss
@@ -0,0 +1,31 @@
+@import "~@/asset/style/variables.scss";
+
+.app-main {
+    position: relative;
+    flex: 1;
+    overflow: hidden;
+    background-color: #f0f2f5;
+
+    .scroll-container {
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        overflow-y: overlay;
+        overflow-x: inherit;
+
+        .page-view {
+            margin: $page-view-margin;
+            flex: 1;
+        }
+    }
+
+    .back-to-top {
+        height: 100%;
+        width: 100%;
+        background-color: #f2f5f6;
+        box-shadow: 0 0 6px rgba(0, 0, 0, .12);
+        text-align: center;
+        line-height: 40px;
+        color: #1989fa;
+    }
+}
diff --git a/vue/src/view/app/common/DetailPage/index.vue b/vue/src/view/app/common/DetailPage/index.vue
index 7630908..60e4da4 100644
--- a/vue/src/view/app/common/DetailPage/index.vue
+++ b/vue/src/view/app/common/DetailPage/index.vue
@@ -91,4 +91,4 @@ export default {
 }
 </script>
 
-<style lang="scss" src="./index.scss"></style>
+<style lang="scss" src="./style.scss"></style>
diff --git a/vue/src/view/app/common/DetailPage/index.scss b/vue/src/view/app/common/DetailPage/style.scss
similarity index 100%
rename from vue/src/view/app/common/DetailPage/index.scss
rename to vue/src/view/app/common/DetailPage/style.scss
diff --git a/vue/src/view/app/common/ExceptionPage/index.vue b/vue/src/view/app/common/ExceptionPage/index.vue
index 343cfb4..7d66329 100644
--- a/vue/src/view/app/common/ExceptionPage/index.vue
+++ b/vue/src/view/app/common/ExceptionPage/index.vue
@@ -48,4 +48,4 @@ export default {
 }
 </script>
 
-<style lang="scss" src="./index.scss"></style>
+<style lang="scss" src="./style.scss"></style>
diff --git a/vue/src/view/app/common/ExceptionPage/index.scss b/vue/src/view/app/common/ExceptionPage/style.scss
similarity index 100%
rename from vue/src/view/app/common/ExceptionPage/index.scss
rename to vue/src/view/app/common/ExceptionPage/style.scss
diff --git a/vue/src/view/app/common/SkeletonPage/index.vue b/vue/src/view/app/common/SkeletonPage/index.vue
index 455bc83..0a1dd81 100644
--- a/vue/src/view/app/common/SkeletonPage/index.vue
+++ b/vue/src/view/app/common/SkeletonPage/index.vue
@@ -25,4 +25,4 @@ export default {
 }
 </script>
 
-<style lang="scss" src="./index.scss"></style>
+<style lang="scss" src="./style.scss"></style>
diff --git a/vue/src/view/app/common/SkeletonPage/index.scss b/vue/src/view/app/common/SkeletonPage/style.scss
similarity index 100%
rename from vue/src/view/app/common/SkeletonPage/index.scss
rename to vue/src/view/app/common/SkeletonPage/style.scss