no message

src/assets/css/home.css

@@ -188,9 +188,11 @@ ul,li{
     padding: 0 0 0 20px;
   }
   .swipercomTvR2Bj{
+    width: 100%;
     top: 0;
+    right: 0;
     bottom: 0;
-    opacity: 1;
+    opacity: .7;
   }
   .swipercomSubEnLenR2{
     font-size: 1.5rem;
@@ -198,6 +200,7 @@ ul,li{
   }
   .swipercomTvR2{
     top: 0;
+    right: 0;
     bottom: 0;
     opacity: 1;
   }
@@ -264,12 +267,16 @@ ul,li{
   }
   .swipercomTvR2Bj{
     top: 100%;
+    left: 0;
     bottom: 0;
+    right: 0;
     opacity: 0;
   }
   .swipercomTvR2{
     top: 100%;
     bottom: 0;
+    left: 0;
+    right: 0;
     opacity: 0;
   }
   .indexRoll1Hd{
@@ -277,6 +284,21 @@ ul,li{
   }
 }
 @media (min-width: 992px) {
+  .swipercomTvR2Bj{
+    top: 100%;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    opacity: 0;
+  }
+  .swipercomTvR2{
+    top: 100%;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    opacity: 0;
+
+  }
   .swipercomR2{
     padding: 0;
   }

src/components/home/indexRoll2.vue

@@ -387,26 +387,16 @@
 }
 .swipercomTvR2Bj{
   background: linear-gradient(0deg,#000,transparent);
-  top: 100%;
-  left: 0;
-  bottom: 0;
-  right: 0;
   z-index: 333;
   opacity: .7;
   border-radius: 10px;
   z-index: 1;
-  opacity: 0;
   transition: all .3s;
 }
 .swipercomTvR2{
-  top: 100%;
-  bottom: 0;
-  left: 0;
-  right: 0;
   color: #fff;
   z-index: 2;
   padding: 0 20px 40px 20px;
-  opacity: 0;
   transition: all .3s;
 }
 .swipercomTitleLR2{