2 files changed, 39 insertions, 31 deletions
diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.html b/usecaseui-portal/src/app/services/services-list/services-list.component.html
index 35504ae0..969898a3 100644
--- a/usecaseui-portal/src/app/services/services-list/services-list.component.html
+++ b/usecaseui-portal/src/app/services/services-list/services-list.component.html
@@ -106,8 +106,8 @@
                         <span>{{item.InProgress}}</span>
                         <span> {{"i18nTextDefine_InProgress" | translate}} </span>
                     </p>
-                <p class="service-description"> {{item.detailName | translate}} </p>
             </div>
+            <p class="service-description"> {{item.detailName | translate}} </p>
         </li>
     </ul>
     <div class="list" id="services-list" [ngClass]="{'listdisplay':listDisplay == true}">
diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.less b/usecaseui-portal/src/app/services/services-list/services-list.component.less
index e4a2c6b3..7f23ac8b 100644
--- a/usecaseui-portal/src/app/services/services-list/services-list.component.less
+++ b/usecaseui-portal/src/app/services/services-list/services-list.component.less
@@ -179,40 +179,48 @@ hr {
     font-family:ArialMT;
     color:#3C4F8C;
 }
-.top-list .top-list-text{
-    position: absolute;
-    text-align: right;
-    height: 40px;
-    line-height: 20px;
-    right: 50px;
-    color: #fff;
-    p{
-        font-size: 14px;
-        width: 250px;
-        margin: 15px 0 0 0;
-        height: 13px;
-        clear: both;
-        span{
-            display: inline-block;
-            font-weight: 500;
-            text-align: right;
-            float: right;
-        }
-        span:nth-child(1){
-            font-size: 18px;
-            width: 40px;
-            min-width: 40px;
+.top-list {
+    .top-list-text {
+        position: absolute;
+        text-align: right;
+        height: 40px;
+        line-height: 20px;
+        right: 50px;
+        color: #fff;
+        p {
+            font-size: 14px;
+            width: 250px;
+            margin: 15px 0 0 0;
+            height: 13px;
+            clear: both;
+            span {
+                display: inline-block;
+                font-weight: 500;
+                text-align: right;
+                float: right;
+            }
+            span:nth-child(1) {
+                font-size: 18px;
+                width: 40px;
+                min-width: 40px;
+            }
+            span:nth-child(2) {
+                width: 85px;
+                font-size: 16px;
+            }
         }
-        span:nth-child(2){
-            width: 85px;
-            font-size: 16px;
+        p:nth-child(1) {
+            margin-top: 25px;
         }
     }
-    p:nth-child(1){
-        margin-top: 25px;
-    }
     .service-description{
-        color: rgba(255,255,255,0.7);
+        font-size: 14px;
+        width: 250px;
+        height: 13px;
+        position: absolute;
+        bottom: 30px;
+        left: 50px;
+        color: #3C4F8C;
     }
 }
 .list {