|
|
@@ -0,0 +1,2197 @@
|
|
|
+<template>
|
|
|
+ <div id="material_child1">
|
|
|
+ <!-- 页面标题 -->
|
|
|
+ <div class="material_title">
|
|
|
+ <div class="d-flex">
|
|
|
+ <img src="@/assets/materialImg/title.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 返回按钮 -->
|
|
|
+ <img src="@/assets/materialImg/returnHistory.png" alt="" class="material_btn">
|
|
|
+
|
|
|
+ <!-- 图片 -->
|
|
|
+ <img src="@/assets/materialImg/stove.png" alt="" class="stoveImg">
|
|
|
+ <img src="@/assets/materialImg/quip.png" alt="" class="quipImg">
|
|
|
+ <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>
|
|
|
+ <div class="label label_p3">900A/B/C</div>
|
|
|
+ <div class="label label_p19">FROM 390-P-</div>
|
|
|
+ <div class="label label_p5">过热超高压蒸汽</div>
|
|
|
+ <div class="label label_p6">TO 320-C-210</div>
|
|
|
+ <div class="label label_p7">裂解气</div>
|
|
|
+ <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_p15">310-K-110</div>
|
|
|
+ <div class="label label_p16">310-E-109E</div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="label label_p17">FROM 320-E-275</div>
|
|
|
+ <div class="label label_p18">稀释蒸汽</div>
|
|
|
+
|
|
|
+ <!-- 特殊文字 -->
|
|
|
+ <div class="label2 label2_p1">310-V-110</div>
|
|
|
+
|
|
|
+ <div class="label2 label2_p2">裂解炉</div>
|
|
|
+ <!-- 标题文字 -->
|
|
|
+ <div class="title_label title_p1">X-112</div>
|
|
|
+ <div class="title_label title_p2">X-911</div>
|
|
|
+ <div class="title_label title_p3">X-911</div>
|
|
|
+ <div class="title_label title_p4">X-211</div>
|
|
|
+ <div class="title_label title_p5">X-211</div>
|
|
|
+ <div class="title_label title_p7">310-Z-110</div>
|
|
|
+ <div class="title_label title_p8">X-212</div>
|
|
|
+ <!-- 流程线及动效 -->
|
|
|
+ <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"> -->
|
|
|
+ </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"> -->
|
|
|
+ </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"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_4">
|
|
|
+ <img src="@/assets/materialImg/arrow50.png" style="width:691px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan4"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_5">
|
|
|
+ <img src="@/assets/materialImg/arrow5.png" style="width:626px;height:34px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan5"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="line l_6">
|
|
|
+ <img src="@/assets/materialImg/arrow6.png" style="width:140px;height:254px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan6"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_7">
|
|
|
+ <img src="@/assets/materialImg/arrow52.png" style="width:65px;height:316px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan7"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_8">
|
|
|
+ <img src="@/assets/materialImg/arrow51.png" style="width:669px;height:34px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan8"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_12">
|
|
|
+ <img src="@/assets/materialImg/arrow12.png" style="width:217px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan12"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_9">
|
|
|
+ <img src="@/assets/materialImg/arrow9.png" style="width:307px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan9"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_10">
|
|
|
+ <img src="@/assets/materialImg/arrow53.png" style="width:331px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan10"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_13">
|
|
|
+ <img src="@/assets/materialImg/arrow13.png" style="width:20px;height:26px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan13"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_11">
|
|
|
+ <img src="@/assets/materialImg/arrow54.png" style="width:848px;height:26px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan11"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="line l_15">
|
|
|
+ <img src="@/assets/materialImg/arrow15.png" style="width:20px;height:589px">
|
|
|
+ <!-- <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/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan16"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_17">
|
|
|
+ <img src="@/assets/materialImg/arrow17.png" style="width:20px;height:191px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan17"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_18">
|
|
|
+ <img src="@/assets/materialImg/arrow18.png" style="width:20px;height:125px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan18"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_19">
|
|
|
+ <img src="@/assets/materialImg/arrow19.png" style="width:295px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan19"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_20">
|
|
|
+ <img src="@/assets/materialImg/arrow20.png" style="width:260px;height:12px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan20"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_21">
|
|
|
+ <img src="@/assets/materialImg/arrow21.png" style="width:20px;height:131px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan21"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_22">
|
|
|
+ <img src="@/assets/materialImg/arrow22.png" style="width:299px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan22"> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <div class="line l_23">
|
|
|
+ <img src="@/assets/materialImg/arrow23.png" style="width:182px;height:26px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan23"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_24">
|
|
|
+ <img src="@/assets/materialImg/arrow24.png" style="width:90px;height:12px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan24"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_25">
|
|
|
+ <img src="@/assets/materialImg/arrow25.png" style="width:215px;height:2px">
|
|
|
+ <!-- <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/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/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan27"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_28">
|
|
|
+ <img src="@/assets/materialImg/arrow28.png" style="width:20px;height:64px">
|
|
|
+ <!-- <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/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/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"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_39">
|
|
|
+ <img src="@/assets/materialImg/arrow39.png" style="width:710px;height:20px">
|
|
|
+ <!-- <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/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan40"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_41">
|
|
|
+ <img src="@/assets/materialImg/arrow41.png" style="width:191px;height:20px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan41"> -->
|
|
|
+ </div>
|
|
|
+ <div class="line l_42">
|
|
|
+ <img src="@/assets/materialImg/arrow42.png" style="width:121px;height:20px">
|
|
|
+ <!-- <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/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/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/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/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_48">
|
|
|
+ <img src="@/assets/materialImg/arrow28.png" style="width:20px;height:64px">
|
|
|
+ <!-- <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan48"> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "material_child1",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+#material_child1 {
|
|
|
+ width: 1270px;
|
|
|
+ height: 750px;
|
|
|
+
|
|
|
+ .material_title {
|
|
|
+ position: absolute;
|
|
|
+ top: 31px;
|
|
|
+ left: 50%
|
|
|
+ }
|
|
|
+
|
|
|
+ .material_btn {
|
|
|
+ position: absolute;
|
|
|
+ width: 158px;
|
|
|
+ height: 53px;
|
|
|
+ top: 69px;
|
|
|
+ left: 54px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .stoveImg {
|
|
|
+ position: absolute;
|
|
|
+ width: 312px;
|
|
|
+ height: 770px;
|
|
|
+ top: 136px;
|
|
|
+ left: 1058px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .quipImg {
|
|
|
+ position: absolute;
|
|
|
+ top: 389px;
|
|
|
+ left: 701px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .MImg1 {
|
|
|
+ position: absolute;
|
|
|
+ top: 582px;
|
|
|
+ left: 437px;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .MImg3 {
|
|
|
+ position: absolute;
|
|
|
+ top: 699px;
|
|
|
+ left: 458px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nodeImg1 {
|
|
|
+ position: absolute;
|
|
|
+ top: 620px;
|
|
|
+ left: 603px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nodeImg2 {
|
|
|
+ position: absolute;
|
|
|
+ top: 925px;
|
|
|
+ left: 602px;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 文字样式
|
|
|
+ .label {
|
|
|
+ position: absolute;
|
|
|
+ font-family: 'Source Han Sans CN';
|
|
|
+ font-style: normal;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 27px;
|
|
|
+ color: #002063;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p1 {
|
|
|
+ top: 267px;
|
|
|
+ left: 485px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p2 {
|
|
|
+ top: 358px;
|
|
|
+ left: 284px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p3 {
|
|
|
+ top: 293px;
|
|
|
+ left: 180px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p19 {
|
|
|
+ top: 265px;
|
|
|
+ left: 170px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p4 {
|
|
|
+ top: 449px;
|
|
|
+ left: 315px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p5 {
|
|
|
+ top: 486px;
|
|
|
+ left: 310px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p6 {
|
|
|
+ top: 607px;
|
|
|
+ left: 314px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p7 {
|
|
|
+ top: 644px;
|
|
|
+ left: 337px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p8 {
|
|
|
+ top: 791px;
|
|
|
+ left: 307px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p9 {
|
|
|
+ top: 828px;
|
|
|
+ left: 335px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p12 {
|
|
|
+ top: 670px;
|
|
|
+ left: 880px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p13 {
|
|
|
+ top: 1000px;
|
|
|
+ left: 898px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p14 {
|
|
|
+ top: 1021px;
|
|
|
+ left: 898px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p15 {
|
|
|
+ top: 156px;
|
|
|
+ left: 1245px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p16 {
|
|
|
+ left: 1374px;
|
|
|
+ top: 602px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p17 {
|
|
|
+ left: 1549px;
|
|
|
+ top: 161px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label_p18 {
|
|
|
+ left: 1576px;
|
|
|
+ top: 205px;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .label2 {
|
|
|
+ position: absolute;
|
|
|
+ font-family: 'Source Han Sans CN';
|
|
|
+ font-style: normal;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 27px;
|
|
|
+ color: #002063;
|
|
|
+ background: rgba(255, 255, 255, 0.5);
|
|
|
+ border: 1px solid #3E5A94;
|
|
|
+ border-radius: 5px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ padding: 4px 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label2_p1 {
|
|
|
+ top: 389px;
|
|
|
+ left: 574px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label2_p2 {
|
|
|
+ top: 591px;
|
|
|
+ left: 1171px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_label {
|
|
|
+ position: absolute;
|
|
|
+ font-family: 'Source Han Sans CN';
|
|
|
+ font-style: normal;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 22px;
|
|
|
+ line-height: 33px;
|
|
|
+ text-align: right;
|
|
|
+ color: #002063;
|
|
|
+ text-shadow: 0px 4px 4px rgba(127, 130, 136, 0.5);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p1 {
|
|
|
+ width: 99px;
|
|
|
+ height: 48px;
|
|
|
+ padding-right: 16px;
|
|
|
+ top: 275px;
|
|
|
+ left: 361px;
|
|
|
+ background: url('../../../assets/materialImg/title_b1.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p2 {
|
|
|
+ width: 99px;
|
|
|
+ height: 48px;
|
|
|
+ padding-right: 16px;
|
|
|
+ top: 325px;
|
|
|
+ left: 176px;
|
|
|
+ background: url('../../../assets/materialImg/title_b1.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p3 {
|
|
|
+ width: 99px;
|
|
|
+ height: 48px;
|
|
|
+ padding-left: 16px;
|
|
|
+ top: 455px;
|
|
|
+ left: 197px;
|
|
|
+ background: url('../../../assets/materialImg/title_b3.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p4 {
|
|
|
+ width: 99px;
|
|
|
+ height: 48px;
|
|
|
+ padding-left: 16px;
|
|
|
+ top: 620px;
|
|
|
+ left: 207px;
|
|
|
+ background: url('../../../assets/materialImg/title_b3.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p5 {
|
|
|
+ width: 99px;
|
|
|
+ height: 48px;
|
|
|
+ padding-right: 16px;
|
|
|
+ top: 800px;
|
|
|
+ left: 210px;
|
|
|
+ background: url('../../../assets/materialImg/title_b1.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p7 {
|
|
|
+ top: 572px;
|
|
|
+ left: 574px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_p8 {
|
|
|
+ width: 93px;
|
|
|
+ height: 40px;
|
|
|
+ padding-left: 16px;
|
|
|
+ top: 174px;
|
|
|
+ left: 1697px;
|
|
|
+ background: url('../../../assets/materialImg/title_b3.png') no-repeat 30%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .line {
|
|
|
+ position: absolute;
|
|
|
+
|
|
|
+ &.l_1 {
|
|
|
+ left: 601px;
|
|
|
+ top: 139px;
|
|
|
+
|
|
|
+ .aniMovelan1 {
|
|
|
+ -webkit-animation-name: aniMovelan1;
|
|
|
+ animation-name: aniMovelan1;
|
|
|
+ -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 aniMovelan1 {
|
|
|
+ 0% {
|
|
|
+ left: 0;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ left: 740px;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_2 {
|
|
|
+ left: 592px;
|
|
|
+ top: 143px;
|
|
|
+
|
|
|
+ .aniMovelan2 {
|
|
|
+ -webkit-animation-name: aniMovelan2;
|
|
|
+ animation-name: aniMovelan2;
|
|
|
+ -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 aniMovelan2 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_3 {
|
|
|
+ left: 1294px;
|
|
|
+ top: 145px;
|
|
|
+
|
|
|
+ .aniMovelan3 {
|
|
|
+ -webkit-animation-name: aniMovelan3;
|
|
|
+ animation-name: aniMovelan3;
|
|
|
+ -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 aniMovelan3 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_4 {
|
|
|
+ left: 450px;
|
|
|
+ top: 290px;
|
|
|
+
|
|
|
+ .aniMovelan4 {
|
|
|
+ -webkit-animation-name: aniMovelan4;
|
|
|
+ animation-name: aniMovelan4;
|
|
|
+ -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 aniMovelan4 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_5 {
|
|
|
+ left: 1077px;
|
|
|
+ top: 178px;
|
|
|
+
|
|
|
+ .aniMovelan5 {
|
|
|
+ -webkit-animation-name: aniMovelan5;
|
|
|
+ animation-name: aniMovelan5;
|
|
|
+ -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 aniMovelan5 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ &.l_6 {
|
|
|
+ left: 1290px;
|
|
|
+ top: 191px;
|
|
|
+
|
|
|
+ .aniMovelan6 {
|
|
|
+ -webkit-animation-name: aniMovelan6;
|
|
|
+ animation-name: aniMovelan6;
|
|
|
+ -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 aniMovelan6 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_7 {
|
|
|
+ left: 1077px;
|
|
|
+ top: 192px;
|
|
|
+
|
|
|
+ .aniMovelan7 {
|
|
|
+ -webkit-animation-name: aniMovelan7;
|
|
|
+ animation-name: aniMovelan7;
|
|
|
+ -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 aniMovelan7 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ &.l_8 {
|
|
|
+ left: 267px;
|
|
|
+ top: 334px;
|
|
|
+
|
|
|
+ .aniMovelan8 {
|
|
|
+ -webkit-animation-name: aniMovelan8;
|
|
|
+ animation-name: aniMovelan8;
|
|
|
+ -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 aniMovelan8 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_12 {
|
|
|
+ left: 925px;
|
|
|
+ top: 341px;
|
|
|
+
|
|
|
+ .aniMovelan12 {
|
|
|
+ -webkit-animation-name: aniMovelan12;
|
|
|
+ animation-name: aniMovelan12;
|
|
|
+ -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 aniMovelan12 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.l_9 {
|
|
|
+ left: 837px;
|
|
|
+ top: 398px;
|
|
|
+
|
|
|
+ .aniMovelan9 {
|
|
|
+ -webkit-animation-name: aniMovelan9;
|
|
|
+ animation-name: aniMovelan9;
|
|
|
+ -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 aniMovelan9 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ &.l_10 {
|
|
|
+ left: 811px;
|
|
|
+ top: 367px;
|
|
|
+
|
|
|
+ .aniMovelan10 {
|
|
|
+ -webkit-animation-name: aniMovelan10;
|
|
|
+ animation-name: aniMovelan10;
|
|
|
+ -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 aniMovelan10 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_13 {
|
|
|
+ left: 804px;
|
|
|
+ top: 371px;
|
|
|
+
|
|
|
+ .aniMovelan13 {
|
|
|
+ -webkit-animation-name: aniMovelan13;
|
|
|
+ animation-name: aniMovelan13;
|
|
|
+ -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 aniMovelan13 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ &.l_11 {
|
|
|
+ left: 292px;
|
|
|
+ top: 464px;
|
|
|
+
|
|
|
+ .aniMovelan11 {
|
|
|
+ -webkit-animation-name: aniMovelan11;
|
|
|
+ animation-name: aniMovelan11;
|
|
|
+ -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 aniMovelan11 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.l_15 {
|
|
|
+ left: 728px;
|
|
|
+ top: 419px;
|
|
|
+
|
|
|
+ .aniMovelan15 {
|
|
|
+ -webkit-animation-name: aniMovelan15;
|
|
|
+ animation-name: aniMovelan15;
|
|
|
+ -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 aniMovelan15 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_16 {
|
|
|
+ left: 750px;
|
|
|
+ top: 420px;
|
|
|
+
|
|
|
+ .aniMovelan16 {
|
|
|
+ -webkit-animation-name: aniMovelan16;
|
|
|
+ animation-name: aniMovelan16;
|
|
|
+ -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 aniMovelan16 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_17 {
|
|
|
+ left: 773px;
|
|
|
+ top: 420px;
|
|
|
+
|
|
|
+ .aniMovelan17 {
|
|
|
+ -webkit-animation-name: aniMovelan17;
|
|
|
+ animation-name: aniMovelan17;
|
|
|
+ -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 aniMovelan17 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_18 {
|
|
|
+ left: 796px;
|
|
|
+ top: 419px;
|
|
|
+
|
|
|
+ .aniMovelan18 {
|
|
|
+ -webkit-animation-name: aniMovelan18;
|
|
|
+ animation-name: aniMovelan18;
|
|
|
+ -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 aniMovelan18 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_19 {
|
|
|
+ left: 825px;
|
|
|
+ top: 513px;
|
|
|
+
|
|
|
+ .aniMovelan19 {
|
|
|
+ -webkit-animation-name: aniMovelan19;
|
|
|
+ animation-name: aniMovelan19;
|
|
|
+ -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 aniMovelan19 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_20 {
|
|
|
+ left: 806px;
|
|
|
+ top: 530px;
|
|
|
+
|
|
|
+ .aniMovelan20 {
|
|
|
+ -webkit-animation-name: aniMovelan20;
|
|
|
+ animation-name: aniMovelan20;
|
|
|
+ -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 aniMovelan20 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_21 {
|
|
|
+ left: 821px;
|
|
|
+ top: 518px;
|
|
|
+
|
|
|
+ .aniMovelan21 {
|
|
|
+ -webkit-animation-name: aniMovelan21;
|
|
|
+ animation-name: aniMovelan21;
|
|
|
+ -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 aniMovelan21 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_22 {
|
|
|
+ left: 778px;
|
|
|
+ top: 595px;
|
|
|
+
|
|
|
+ .aniMovelan22 {
|
|
|
+ -webkit-animation-name: aniMovelan22;
|
|
|
+ animation-name: aniMovelan22;
|
|
|
+ -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 aniMovelan22 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_23 {
|
|
|
+ left: 648px;
|
|
|
+ top: 630px;
|
|
|
+
|
|
|
+ .aniMovelan23 {
|
|
|
+ -webkit-animation-name: aniMovelan23;
|
|
|
+ animation-name: aniMovelan23;
|
|
|
+ -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 aniMovelan23 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ &.l_24 {
|
|
|
+ left: 518px;
|
|
|
+ top: 636px;
|
|
|
+
|
|
|
+ .aniMovelan24 {
|
|
|
+ -webkit-animation-name: aniMovelan24;
|
|
|
+ animation-name: aniMovelan24;
|
|
|
+ -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 aniMovelan24 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_25 {
|
|
|
+ left: 303px;
|
|
|
+ top: 630px;
|
|
|
+
|
|
|
+ .aniMovelan25 {
|
|
|
+ -webkit-animation-name: aniMovelan25;
|
|
|
+ animation-name: aniMovelan25;
|
|
|
+ -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 aniMovelan25 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_26 {
|
|
|
+ left: 508px;
|
|
|
+ top: 639px;
|
|
|
+
|
|
|
+ .aniMovelan26 {
|
|
|
+ -webkit-animation-name: aniMovelan26;
|
|
|
+ animation-name: aniMovelan26;
|
|
|
+ -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 aniMovelan26 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_27 {
|
|
|
+ left: 514px;
|
|
|
+ top: 712px;
|
|
|
+
|
|
|
+ .aniMovelan27 {
|
|
|
+ -webkit-animation-name: aniMovelan27;
|
|
|
+ animation-name: aniMovelan27;
|
|
|
+ -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 aniMovelan27 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_28 {
|
|
|
+ left: 1074px;
|
|
|
+ top: 712px;
|
|
|
+
|
|
|
+ .aniMovelan28 {
|
|
|
+ -webkit-animation-name: aniMovelan28;
|
|
|
+ animation-name: aniMovelan28;
|
|
|
+ -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 aniMovelan28 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_29 {
|
|
|
+ left: 617px;
|
|
|
+ top: 661px;
|
|
|
+
|
|
|
+ .aniMovelan29 {
|
|
|
+ -webkit-animation-name: aniMovelan29;
|
|
|
+ animation-name: aniMovelan29;
|
|
|
+ -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 aniMovelan29 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_30 {
|
|
|
+ left: 512px;
|
|
|
+ top: 733px;
|
|
|
+
|
|
|
+ .aniMovelan30 {
|
|
|
+ -webkit-animation-name: aniMovelan30;
|
|
|
+ animation-name: aniMovelan30;
|
|
|
+ -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 aniMovelan30 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_31 {
|
|
|
+ left: 305px;
|
|
|
+ top: 816px;
|
|
|
+
|
|
|
+ .aniMovelan31 {
|
|
|
+ -webkit-animation-name: aniMovelan31;
|
|
|
+ animation-name: aniMovelan31;
|
|
|
+ -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 aniMovelan31 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.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;
|
|
|
+
|
|
|
+ .aniMovelan38 {
|
|
|
+ -webkit-animation-name: aniMovelan38;
|
|
|
+ animation-name: aniMovelan38;
|
|
|
+ -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 aniMovelan38 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_39 {
|
|
|
+ left: 822px;
|
|
|
+ top: 1044px;
|
|
|
+
|
|
|
+ .aniMovelan39 {
|
|
|
+ -webkit-animation-name: aniMovelan39;
|
|
|
+ animation-name: aniMovelan39;
|
|
|
+ -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 aniMovelan39 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_40 {
|
|
|
+ left: 1518px;
|
|
|
+ top: 556px;
|
|
|
+
|
|
|
+ .aniMovelan40 {
|
|
|
+ -webkit-animation-name: aniMovelan40;
|
|
|
+ animation-name: aniMovelan40;
|
|
|
+ -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 aniMovelan40 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_41 {
|
|
|
+ left: 1337px;
|
|
|
+ top: 554px;
|
|
|
+
|
|
|
+ .aniMovelan41 {
|
|
|
+ -webkit-animation-name: aniMovelan41;
|
|
|
+ animation-name: aniMovelan41;
|
|
|
+ -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 aniMovelan41 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_42 {
|
|
|
+ left: 1360px;
|
|
|
+ top: 584px;
|
|
|
+
|
|
|
+
|
|
|
+ .aniMovelan42 {
|
|
|
+ -webkit-animation-name: aniMovelan42;
|
|
|
+ animation-name: aniMovelan42;
|
|
|
+ -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 aniMovelan42 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_43 {
|
|
|
+ left: 1469px;
|
|
|
+ top: 583px;
|
|
|
+
|
|
|
+ .aniMovelan43 {
|
|
|
+ -webkit-animation-name: aniMovelan43;
|
|
|
+ animation-name: aniMovelan43;
|
|
|
+ -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 aniMovelan43 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_44 {
|
|
|
+ left: 734px;
|
|
|
+ top: 992px;
|
|
|
+
|
|
|
+ .aniMovelan44 {
|
|
|
+ -webkit-animation-name: aniMovelan44;
|
|
|
+ animation-name: aniMovelan44;
|
|
|
+ -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 aniMovelan44 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_45 {
|
|
|
+ left: 754px;
|
|
|
+ top: 969px;
|
|
|
+
|
|
|
+ .aniMovelan45 {
|
|
|
+ -webkit-animation-name: aniMovelan45;
|
|
|
+ animation-name: aniMovelan45;
|
|
|
+ -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 aniMovelan45 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_46 {
|
|
|
+ left: 1436px;
|
|
|
+ top: 641px;
|
|
|
+
|
|
|
+ .aniMovelan46 {
|
|
|
+ -webkit-animation-name: aniMovelan46;
|
|
|
+ animation-name: aniMovelan46;
|
|
|
+ -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 aniMovelan46 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_47 {
|
|
|
+ left: 1364px;
|
|
|
+ top: 636px;
|
|
|
+
|
|
|
+ .aniMovelan47 {
|
|
|
+ -webkit-animation-name: aniMovelan47;
|
|
|
+ animation-name: aniMovelan47;
|
|
|
+ -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 aniMovelan47 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ &.l_48 {
|
|
|
+ left: 1276px;
|
|
|
+ top: 733px;
|
|
|
+
|
|
|
+ .aniMovelan48 {
|
|
|
+ -webkit-animation-name: aniMovelan48;
|
|
|
+ animation-name: aniMovelan48;
|
|
|
+ -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 aniMovelan48 {
|
|
|
+ 0% {
|
|
|
+ top: 154px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
km林芳旭
