【无】公司网站-样式修改,首页，移动端 #4

@@ -4010,8 +4010,49 @@ blockquote:before {
         font-size: 14px;
     }
 }
+.tech-introCon-sm{
+    display: none;
+}
 @media only screen and (max-width: 768px){
-    .owl-carousel.owl-loaded.team-carousel-sm{
+    .tech-item{
+        max-width: 50%;
+    }
+    .tech-title-sm{
+        color:#e43730;
+        padding:10px 0;
+        font-size: 18px;
+        text-align: center;
+        font-weight: bold;
+    }
+    .tech-intro-sm{
+        font-size: 14px;
+        text-align: left;
+    }
+    .tech-item:last-child{
+        max-width: 100%;
+    }
+    .tech-item:last-child .tech-img-con,.tech-item:last-child .tech-introCon-sm{
+        width: 50%;
+    }
+    .tech-item:last-child .tech-img-con{
+        padding-right:15px;
+    }
+    .tech-item:last-child .tech-introCon-sm{
+        padding-left:15px;
+    }
+    .tech-item:last-child .service-icon{
+        flex-flow: row;
+    }
+    .tech-title-num,.tech-title,.service-icon .tooltip{
+        display: none;
+    }
+    .single-service-box{
+        box-shadow: none;
+    }
+    .tech-img{
+        background:#f9f9fb;
+    }
+    .owl-carousel.owl-loaded.team-carousel-sm,.tech-introCon-sm{
         display: block;
     }
     .owl-carousel.team-carousel-sm button.owl-dot{

@@ -39,19 +39,26 @@
         <div class="title-style">技术优势</div>
         <div class="title-intro pt-20">以AI激活运维数据智慧，助力客户数字化运维</div>
         <div class="row pt-30">
-            <div v-for="(item,index) in techData" :key="item" class="col-lg-3 col-md-6 col-lg-3-self">
+            <div v-for="(item,index) in techData" :key="item" class="col-lg-3 col-md-6 tech-item col-lg-3-self">
                 <div class="single-service-box style-three">
                     <div class="service-icon" data-toggle="tooltip" @mouseenter="tooltipHover(item.id)"
                          @mouseleave="tooltipLeave">
-                        <div>
-                            <img :src="'assets/img/technology/technology-'+item.id+'.png'" alt="Service Icon">
+                        <div class="tech-img-con">
+                            <div class="tech-img">
+                                <img :src="'assets/img/technology/technology-'+item.id+'.png'" alt="Service Icon">
+                            </div>
                         </div>
+
                         <div class="tech-title-num">{{index+1}}</div>
                         <div class="tech-title pt-30 pb-30">{{item.title}}</div>
                         <div :class="[ 'tooltip', 'tooltip-self','flex-column-center',{'opacity1':item.isHover,'opacity0':!item.isHover}]">
                             <div>{{item.title}}</div>
                             <div>{{item.tipIntro}}</div>
                         </div>
+                        <div class="tech-introCon-sm">
+                            <div class="tech-title-sm">{{item.title}}</div>
+                            <div class="tech-intro-sm">{{item.tipIntro}}</div>
+                        </div>
                     </div>
                 </div>
             </div>