新增动画效果

Static/mdui-v1.0.1/css/ui.css

@@ -7,30 +7,30 @@
 }
 
 .slideshow-image {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 0;
-  transition: opacity 1s ease-in-out;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    transition: opacity 1s ease-in-out;
 }
 
 .slideshow-image.active {
-  opacity: 1;
+    opacity: 1;
 }
 
 .slideshow-image.last-active {
-  opacity: 0;
+    opacity: 0;
 }
 
-.ui-center{
+.ui-center {
     border-radius: 15px;
-    border:solid 2px rgba(128, 128, 128, 0.664);
+    border: solid 2px rgba(128, 128, 128, 0.664);
     /* offset-x | offset-y | blur-radius | color */
 }
 
-.box-Text{
+.box-Text {
     margin-top: 15px;
 }
 
@@ -60,10 +60,12 @@
     animation: run 60s linear infinite;
     animation-direction: alternate;
 }
-.font-ui{
+
+.font-ui {
     font-weight: 700;
     font-style: italic;
 }
+
 .home-bodg {
     position: fixed;
     z-index: -999;
@@ -92,6 +94,7 @@
     }
 
 }
+
 .mdui-typo-headlineg {
     margin: 0 0 0.3em 0;
     font-weight: 400;
@@ -141,7 +144,7 @@ body {
 .div-height {
     height: 50px;
     background-color: rgba(99, 162, 255, 0.664);
-    backdrop-filter: blur(5px); 
+    backdrop-filter: blur(5px);
 }
 
 .pc-introduction {
@@ -164,13 +167,13 @@ body {
 
 .y-row {
 
-        display: flex;
-        width: auto;
-        justify-content: space-between;
-        flex-wrap: nowrap;
-        overflow: scroll;
-        overflow-x: auto;
-        height: 150px;
+    display: flex;
+    width: auto;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    overflow: scroll;
+    overflow-x: auto;
+    height: 150px;
 
 }
 
@@ -195,10 +198,56 @@ body {
 }
 
 .zhe {
-     backdrop-filter: blur(5px); 
+    backdrop-filter: blur(5px);
 }
 
-.mdui-toolbarm,.mdui-toolbarb{
-    backdrop-filter: blur(5px); 
+.mdui-toolbarm,
+.mdui-toolbarb {
+    backdrop-filter: blur(5px);
 }
 
+.mdui-grid-tile {
+    border-radius: 15px;
+    float: left;
+    width: 25em;
+    margin-left: 15px;
+    position: relative;
+}
+.mdui-grid-tile a img{
+    aspect-ratio: 16/9;
+}
+
+@media (min-width: 1381px){
+    .c-inner {
+        margin: 0 auto;
+        max-width: 1408px;
+        padding: 0 64px;
+      }
+}
+@media (max-width: 1380px){
+    .c-inner {
+        display: none;
+      }
+}
+@media (max-width: 837px) {
+    .mdui-hidden-lok-down {
+      display: none !important;
+    }
+}
+@media (min-width: 836px) {
+    .mdui-hidden-xm-pe {
+      display: none !important;
+    }
+}
+.banner {
+    max-width: 1000px;
+    margin-bottom: 15px;
+    box-sizing: border-box;
+    margin-right: auto;
+    margin-left: auto;
+    padding-right: 8px;
+    padding-left: 8px;
+}
+
+
+