工艺流程图2

ui/src/views/monitor/materialChild/materialChild1.vue

@@ -59,22 +59,22 @@
     <!-- 流程线及动效 -->
     <div class="line l_1">
       <img src="@/assets/materialImg/arrow1.png" style="width:745px;height:12px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan1"> -->
+      <img src="@/assets/materialImg/arrowRight.png" style="width:18px;height:20px" class="aniMovelan1">
     </div>
 
     <div class="line l_2">
       <img src="@/assets/materialImg/arrow2.png" style="width:20px;height:162px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan2"> -->
+      <img src="@/assets/materialImg/arrowTop.png" style="width:20px;height:18px" class="aniMovelan2">
     </div>
 
     <div class="line l_3">
       <img src="@/assets/materialImg/arrow3.png" style="width:56px;height:150px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan3"> -->
+      <img src="@/assets/materialImg/arrowBottom.png" style="width:18px;height:20px" class="aniMovelan3">
     </div>
 
     <div class="line l_4">
       <img src="@/assets/materialImg/arrow4.png" style="width:853px;height:20px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan4"> -->
+      <img src="@/assets/materialImg/arrowRight.png" style="width:18px;height:20px" class="aniMovelan4">
     </div>
 
     <div class="line l_5">
@@ -318,14 +318,16 @@ export default {
 
   .MImg1 {
     position: absolute;
-    top: 582px;
+    top: 585px;
     left: 437px;
+    z-index: 4;
   }
 
   .MImg2 {
     position: absolute;
-    top: 885px;
+    top: 888px;
     left: 437px;
+    z-index: 4;
   }
 
   .MImg3 {
@@ -577,8 +579,8 @@ export default {
       .aniMovelan1 {
         -webkit-animation-name: aniMovelan1;
         animation-name: aniMovelan1;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
+        -webkit-animation-duration: 5s;
+        animation-duration: 5s;
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both;
         animation-iteration-count: infinite;
@@ -587,9 +589,8 @@ export default {
         -webkit-animation-timing-function: linear;
         animation-timing-function: linear;
         position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
+        top: 2px;
+        left: 0px;
       }
 
       @keyframes aniMovelan1 {
@@ -599,10 +600,14 @@ export default {
         }
 
         100% {
-          left: 740px;
+          left: 738px;
           opacity: 1;
         }
       }
+
+
+
+
     }
 
 
@@ -613,8 +618,8 @@ export default {
       .aniMovelan2 {
         -webkit-animation-name: aniMovelan2;
         animation-name: aniMovelan2;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
+        -webkit-animation-duration: 3s;
+        animation-duration: 3s;
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both;
         animation-iteration-count: infinite;
@@ -624,13 +629,12 @@ export default {
         animation-timing-function: linear;
         position: absolute;
         top: 0;
-        left: -2px;
-        transform: rotate(90deg);
+        left: 0;
       }
 
       @keyframes aniMovelan2 {
         0% {
-          top: 154px;
+          top: 162px;
           opacity: 0;
         }
 
@@ -649,8 +653,8 @@ export default {
       .aniMovelan3 {
         -webkit-animation-name: aniMovelan3;
         animation-name: aniMovelan3;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
+        -webkit-animation-duration: 3s;
+        animation-duration: 3s;
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both;
         animation-iteration-count: infinite;
@@ -661,18 +665,33 @@ export default {
         position: absolute;
         top: 0;
         left: -2px;
-        transform: rotate(90deg);
       }
 
       @keyframes aniMovelan3 {
         0% {
-          top: 154px;
+          top: 0;
+          left: 42px;
           opacity: 0;
         }
 
+        70% {
+          top: 126px;
+          left: 42px;
+          opacity: .6;
+          transform: rotate(0deg);
+        }
+
+        75% {
+          top: 130px;
+          left: 40px;
+          opacity: .7;
+          transform: rotate(90deg);
+        }
+
         100% {
-          top: 0;
+          top: 130px;
           opacity: 1;
+          transform: rotate(90deg);
         }
       }
     }
@@ -685,8 +704,8 @@ export default {
       .aniMovelan4 {
         -webkit-animation-name: aniMovelan4;
         animation-name: aniMovelan4;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
+        -webkit-animation-duration: 5s;
+        animation-duration: 5s;
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both;
         animation-iteration-count: infinite;
@@ -697,17 +716,17 @@ export default {
         position: absolute;
         top: 0;
         left: -2px;
-        transform: rotate(90deg);
+        // transform: rotate(90deg);
       }
 
       @keyframes aniMovelan4 {
         0% {
-          top: 154px;
+          left: 0;
           opacity: 0;
         }
 
         100% {
-          top: 0;
+          left: 853px;
           opacity: 1;
         }
       }

ui/src/views/monitor/materialChild/materialChild2.vue

@@ -15,7 +15,6 @@
     <img src="@/assets/materialImg/MTop.png" alt="" class="MImg1">
     <img src="@/assets/materialImg/MLeft.png" alt="" class="MImg3">
     <img src="@/assets/materialImg/node.png" alt="" class="nodeImg1">
-    <img src="@/assets/materialImg/node.png" alt="" class="nodeImg2">
     <!-- 文字 -->
     <div class="label label_p1">裂解进料</div>
     <div class="label label_p2">高压锅炉给水</div>
@@ -27,13 +26,10 @@
     <div class="label label_p8">FROM 320-E-270</div>
     <div class="label label_p9">急冷油</div>
 
-    <div class="label label_p12">310-E-109A</div>
-    <div class="label label_p13">FROM SLE</div>
-    <div class="label label_p14">310-E-109F/G/H</div>
-
+    <div class="label label_p12">310-E-110A</div>
 
     <div class="label label_p15">310-K-110</div>
-    <div class="label label_p16">310-E-109E</div>
+    <div class="label label_p16">310-E-110D</div>
 
 
     <div class="label label_p17">FROM 320-E-275</div>
@@ -119,11 +115,11 @@
     </div>
 
     <div class="line l_15">
-      <img src="@/assets/materialImg/arrow15.png" style="width:20px;height:589px">
+      <img src="@/assets/materialImg/arrow57.png" style="width:20px;height:541px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan15"> -->
     </div>
     <div class="line l_16">
-      <img src="@/assets/materialImg/arrow16.png" style="width:20px;height:564px">
+      <img src="@/assets/materialImg/arrow56.png" style="width:20px;height:503px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan16"> -->
     </div>
     <div class="line l_17">
@@ -167,11 +163,15 @@
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan25"> -->
     </div>
     <div class="line l_26">
-      <img src="@/assets/materialImg/arrow26.png" style="width:20px;height:137px">
+      <img src="@/assets/materialImg/arrow59.png" style="width:20px;height:136px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan26"> -->
     </div>
     <div class="line l_27">
-      <img src="@/assets/materialImg/arrow27.png" style="width:710px;height:65px">
+      <img src="@/assets/materialImg/arrow60.png" style="width:614px;height:65px">
+      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan27"> -->
+    </div>
+    <div class="line l_35">
+      <img src="@/assets/materialImg/arrow61.png" style="width:253px;height:65px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan27"> -->
     </div>
     <div class="line l_28">
@@ -179,39 +179,15 @@
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan28"> -->
     </div>
     <div class="line l_29">
-      <img src="@/assets/materialImg/arrow29.png" style="width:20px;height:272px">
+      <img src="@/assets/materialImg/arrow62.png" style="width:20px;height:170px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan29"> -->
     </div>
-    <div class="line l_30">
-      <img src="@/assets/materialImg/arrow30.png" style="width:853px;height:65px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan30"> -->
-    </div>
+
     <div class="line l_31">
-      <img src="@/assets/materialImg/arrow31.png" style="width:321px;height:12px">
+      <img src="@/assets/materialImg/arrow58.png" style="width:325px;height:12px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan31"> -->
     </div>
-    <div class="line l_32">
-      <img src="@/assets/materialImg/arrow32.png" style="width:20px;height:165px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan32"> -->
-    </div>
-    <div class="line l_33">
-      <img src="@/assets/materialImg/arrow33.png" style="width:216px;height:2px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan33"> -->
-    </div>
-    <div class="line l_34">
-      <img src="@/assets/materialImg/arrow34.png" style="width:91px;height:12px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan34"> -->
-    </div>
-
-    <div class="line l_36">
-      <img src="@/assets/materialImg/arrow36.png" style="width:68px;height:20px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan36"> -->
-    </div>
 
-    <div class="line l_37">
-      <img src="@/assets/materialImg/arrow37.png" style="width:180px;height:26px">
-      <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan37"> -->
-    </div>
     <div class="line l_38">
       <img src="@/assets/materialImg/arrow55.png" style="width:20px;height:364px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan38"> -->
@@ -221,7 +197,7 @@
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan39"> -->
     </div>
     <div class="line l_40">
-      <img src="@/assets/materialImg/arrow40.png" style="width:20px;height:502px">
+      <img src="@/assets/materialImg/arrow68.png" style="width:20px;height:450px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan40"> -->
     </div>
     <div class="line l_41">
@@ -233,25 +209,25 @@
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan42"> -->
     </div>
     <div class="line l_43">
-      <img src="@/assets/materialImg/arrow43.png" style="width:20px;height:425px">
+      <img src="@/assets/materialImg/arrow67.png" style="width:20px;height:377px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan43"> -->
     </div>
     <div class="line l_44">
-      <img src="@/assets/materialImg/arrow44.png" style="width:748px;height:20px">
+      <img src="@/assets/materialImg/arrow66.png" style="width:748px;height:20px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan44"> -->
     </div>
     <div class="line l_45">
-      <img src="@/assets/materialImg/arrow45.png" style="width:698px;height:20px">
+      <img src="@/assets/materialImg/arrow63.png" style="width:698px;height:20px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan45"> -->
     </div>
     <div class="line l_46">
-      <img src="@/assets/materialImg/arrow46.png" style="width:20px;height:344px">
+      <img src="@/assets/materialImg/arrow64.png" style="width:20px;height:283px">
       <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan46"> -->
     </div>
-    <!-- <div class="line l_47">
-        <img src="@/assets/materialImg/arrow47.png" style="width:86px;height:20px">
-        <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan47">
-      </div> -->
+    <div class="line l_34">
+      <img src="@/assets/materialImg/arrow65.png" style="width:86px;height:20px">
+      <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan34">
+    </div>
 
     <div class="line l_48">
       <img src="@/assets/materialImg/arrow28.png" style="width:20px;height:64px">
@@ -307,8 +283,9 @@ export default {
 
   .MImg1 {
     position: absolute;
-    top: 582px;
+    top: 585px;
     left: 437px;
+    z-index: 4;
   }
 
 
@@ -324,11 +301,7 @@ export default {
     left: 603px;
   }
 
-  .nodeImg2 {
-    position: absolute;
-    top: 925px;
-    left: 602px;
-  }
+
 
 
   // 文字样式
@@ -383,12 +356,12 @@ export default {
   }
 
   .label_p8 {
-    top: 791px;
+    top: 787px;
     left: 307px;
   }
 
   .label_p9 {
-    top: 828px;
+    top: 834px;
     left: 335px;
   }
 
@@ -397,16 +370,6 @@ export default {
     left: 880px;
   }
 
-  .label_p13 {
-    top: 1000px;
-    left: 898px;
-  }
-
-  .label_p14 {
-    top: 1021px;
-    left: 898px;
-  }
-
   .label_p15 {
     top: 156px;
     left: 1245px;
@@ -512,8 +475,8 @@ export default {
     width: 99px;
     height: 48px;
     padding-right: 16px;
-    top: 800px;
-    left: 210px;
+    top: 801px;
+    left: 209px;
     background: url('../../../assets/materialImg/title_b1.png') no-repeat 30%;
   }
 
@@ -1403,7 +1366,7 @@ export default {
 
     &.l_26 {
       left: 508px;
-      top: 639px;
+      top: 644px;
 
       .aniMovelan26 {
         -webkit-animation-name: aniMovelan26;
@@ -1439,7 +1402,7 @@ export default {
 
     &.l_27 {
       left: 514px;
-      top: 712px;
+      top: 716px;
 
       .aniMovelan27 {
         -webkit-animation-name: aniMovelan27;
@@ -1473,13 +1436,13 @@ export default {
     }
 
 
-    &.l_28 {
-      left: 1074px;
-      top: 712px;
+    &.l_35 {
+      left: 1113px;
+      top: 716px;
 
-      .aniMovelan28 {
-        -webkit-animation-name: aniMovelan28;
-        animation-name: aniMovelan28;
+      .aniMovelan35 {
+        -webkit-animation-name: aniMovelan35;
+        animation-name: aniMovelan35;
         -webkit-animation-duration: 4s;
         animation-duration: 4s;
         -webkit-animation-fill-mode: both;
@@ -1495,7 +1458,7 @@ export default {
         transform: rotate(90deg);
       }
 
-      @keyframes aniMovelan28 {
+      @keyframes aniMovelan35 {
         0% {
           top: 154px;
           opacity: 0;
@@ -1509,13 +1472,13 @@ export default {
     }
 
 
-    &.l_29 {
-      left: 617px;
-      top: 661px;
+    &.l_28 {
+      left: 1062px;
+      top: 715px;
 
-      .aniMovelan29 {
-        -webkit-animation-name: aniMovelan29;
-        animation-name: aniMovelan29;
+      .aniMovelan28 {
+        -webkit-animation-name: aniMovelan28;
+        animation-name: aniMovelan28;
         -webkit-animation-duration: 4s;
         animation-duration: 4s;
         -webkit-animation-fill-mode: both;
@@ -1531,7 +1494,7 @@ export default {
         transform: rotate(90deg);
       }
 
-      @keyframes aniMovelan29 {
+      @keyframes aniMovelan28 {
         0% {
           top: 154px;
           opacity: 0;
@@ -1545,13 +1508,13 @@ export default {
     }
 
 
-    &.l_30 {
-      left: 512px;
-      top: 733px;
+    &.l_29 {
+      left: 617px;
+      top: 661px;
 
-      .aniMovelan30 {
-        -webkit-animation-name: aniMovelan30;
-        animation-name: aniMovelan30;
+      .aniMovelan29 {
+        -webkit-animation-name: aniMovelan29;
+        animation-name: aniMovelan29;
         -webkit-animation-duration: 4s;
         animation-duration: 4s;
         -webkit-animation-fill-mode: both;
@@ -1567,7 +1530,7 @@ export default {
         transform: rotate(90deg);
       }
 
-      @keyframes aniMovelan30 {
+      @keyframes aniMovelan29 {
         0% {
           top: 154px;
           opacity: 0;
@@ -1581,8 +1544,9 @@ export default {
     }
 
 
+
     &.l_31 {
-      left: 305px;
+      left: 303px;
       top: 816px;
 
       .aniMovelan31 {
@@ -1617,185 +1581,6 @@ export default {
     }
 
 
-    &.l_32 {
-      left: 507px;
-      top: 789px;
-
-      .aniMovelan32 {
-        -webkit-animation-name: aniMovelan32;
-        animation-name: aniMovelan32;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
-        -webkit-animation-fill-mode: both;
-        animation-fill-mode: both;
-        animation-iteration-count: infinite;
-        -webkit-animation-iteration-count: infinite;
-        font-style: inherit;
-        -webkit-animation-timing-function: linear;
-        animation-timing-function: linear;
-        position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
-      }
-
-      @keyframes aniMovelan32 {
-        0% {
-          top: 154px;
-          opacity: 0;
-        }
-
-        100% {
-          top: 0;
-          opacity: 1;
-        }
-      }
-    }
-
-
-    &.l_33 {
-      left: 301px;
-      top: 934px;
-
-      .aniMovelan33 {
-        -webkit-animation-name: aniMovelan33;
-        animation-name: aniMovelan33;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
-        -webkit-animation-fill-mode: both;
-        animation-fill-mode: both;
-        animation-iteration-count: infinite;
-        -webkit-animation-iteration-count: infinite;
-        font-style: inherit;
-        -webkit-animation-timing-function: linear;
-        animation-timing-function: linear;
-        position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
-      }
-
-      @keyframes aniMovelan33 {
-        0% {
-          top: 154px;
-          opacity: 0;
-        }
-
-        100% {
-          top: 0;
-          opacity: 1;
-        }
-      }
-    }
-
-
-    &.l_34 {
-      left: 516px;
-      top: 940px;
-
-      .aniMovelan34 {
-        -webkit-animation-name: aniMovelan34;
-        animation-name: aniMovelan34;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
-        -webkit-animation-fill-mode: both;
-        animation-fill-mode: both;
-        animation-iteration-count: infinite;
-        -webkit-animation-iteration-count: infinite;
-        font-style: inherit;
-        -webkit-animation-timing-function: linear;
-        animation-timing-function: linear;
-        position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
-      }
-
-      @keyframes aniMovelan34 {
-        0% {
-          top: 154px;
-          opacity: 0;
-        }
-
-        100% {
-          top: 0;
-          opacity: 1;
-        }
-      }
-    }
-
-    &.l_36 {
-      left: 822px;
-      top: 1012px;
-
-      .aniMovelan36 {
-        -webkit-animation-name: aniMovelan36;
-        animation-name: aniMovelan36;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
-        -webkit-animation-fill-mode: both;
-        animation-fill-mode: both;
-        animation-iteration-count: infinite;
-        -webkit-animation-iteration-count: infinite;
-        font-style: inherit;
-        -webkit-animation-timing-function: linear;
-        animation-timing-function: linear;
-        position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
-      }
-
-      @keyframes aniMovelan36 {
-        0% {
-          top: 154px;
-          opacity: 0;
-        }
-
-        100% {
-          top: 0;
-          opacity: 1;
-        }
-      }
-    }
-
-
-    &.l_37 {
-      left: 646px;
-      top: 934px;
-
-      .aniMovelan37 {
-        -webkit-animation-name: aniMovelan37;
-        animation-name: aniMovelan37;
-        -webkit-animation-duration: 4s;
-        animation-duration: 4s;
-        -webkit-animation-fill-mode: both;
-        animation-fill-mode: both;
-        animation-iteration-count: infinite;
-        -webkit-animation-iteration-count: infinite;
-        font-style: inherit;
-        -webkit-animation-timing-function: linear;
-        animation-timing-function: linear;
-        position: absolute;
-        top: 0;
-        left: -2px;
-        transform: rotate(90deg);
-      }
-
-      @keyframes aniMovelan37 {
-        0% {
-          top: 154px;
-          opacity: 0;
-        }
-
-        100% {
-          top: 0;
-          opacity: 1;
-        }
-      }
-    }
-
-
     &.l_38 {
       left: 821px;
       top: 642px;
@@ -1834,7 +1619,7 @@ export default {
 
     &.l_39 {
       left: 822px;
-      top: 1044px;
+      top: 991px;
 
       .aniMovelan39 {
         -webkit-animation-name: aniMovelan39;
@@ -1869,7 +1654,7 @@ export default {
 
 
     &.l_40 {
-      left: 1518px;
+      left: 1514px;
       top: 556px;
 
       .aniMovelan40 {
@@ -1979,7 +1764,7 @@ export default {
 
     &.l_43 {
       left: 1469px;
-      top: 583px;
+      top: 586px;
 
       .aniMovelan43 {
         -webkit-animation-name: aniMovelan43;
@@ -2015,7 +1800,7 @@ export default {
 
     &.l_44 {
       left: 734px;
-      top: 992px;
+      top: 946px;
 
       .aniMovelan44 {
         -webkit-animation-name: aniMovelan44;
@@ -2051,7 +1836,7 @@ export default {
 
     &.l_45 {
       left: 754px;
-      top: 969px;
+      top: 909px;
 
       .aniMovelan45 {
         -webkit-animation-name: aniMovelan45;
@@ -2121,6 +1906,42 @@ export default {
     }
 
 
+    &.l_34 {
+      left: 1365px;
+      top: 637px;
+
+      .aniMovelan34 {
+        -webkit-animation-name: aniMovelan34;
+        animation-name: aniMovelan34;
+        -webkit-animation-duration: 4s;
+        animation-duration: 4s;
+        -webkit-animation-fill-mode: both;
+        animation-fill-mode: both;
+        animation-iteration-count: infinite;
+        -webkit-animation-iteration-count: infinite;
+        font-style: inherit;
+        -webkit-animation-timing-function: linear;
+        animation-timing-function: linear;
+        position: absolute;
+        top: 0;
+        left: -2px;
+        transform: rotate(90deg);
+      }
+
+      @keyframes aniMovelan34 {
+        0% {
+          top: 154px;
+          opacity: 0;
+        }
+
+        100% {
+          top: 0;
+          opacity: 1;
+        }
+      }
+    }
+
+
     &.l_47 {
       left: 1364px;
       top: 636px;
@@ -2159,7 +1980,7 @@ export default {
 
     &.l_48 {
       left: 1276px;
-      top: 733px;
+      top: 716px;
 
       .aniMovelan48 {
         -webkit-animation-name: aniMovelan48;