diff --git a/src/App.vue b/src/App.vue
index bb6e4a7..83f5991 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -19,8 +19,8 @@ export default {
     window.addEventListener('beforeunload', () => {
       util.local.set(Setting.storeKey, this.$store.state);
     });
-
-    function IsPC() {
+    // 判断当前处于什么终端 true为PC端，false为手机端
+    function IsPCModel() {
       var userAgentInfo = navigator.userAgent;
       var Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod'];
       var flagPc = true;
@@ -32,8 +32,15 @@ export default {
       }
       return flagPc;
     }
-    var flagZt = IsPC();
+    var flagZt = IsPCModel();
     this.$store.commit('updateModelType', flagZt)
+    window.onresize = () => {
+      if(document.body.clientWidth <= 1200) {
+        this.$store.commit('updateModelType', false)
+      }else {
+        this.$store.commit('updateModelType', true)
+      }
+    }
   }
 };
 </script>
diff --git a/src/components/menuTree/index.vue b/src/components/menuTree/index.vue
index 0ebde1c..650880d 100644
--- a/src/components/menuTree/index.vue
+++ b/src/components/menuTree/index.vue
@@ -32,4 +32,18 @@ export default {
 </script>
 <style lang="scss" scoped>
   
+@media (min-width: 280px) and (max-width: 750px) {
+  .menu-child{
+    /deep/ .el-menu-item {
+      height: 40px;line-height: 40px;
+    }
+  }
+  .el-submenu{
+    /deep/ .el-submenu__title{
+      height: 40px;
+      line-height: 40px;
+      font-size: 1rem;
+    }
+  }
+}
 </style>
diff --git a/src/layouts/header/index.vue b/src/layouts/header/index.vue
index 992663c..36ca414 100644
--- a/src/layouts/header/index.vue
+++ b/src/layouts/header/index.vue
@@ -3,16 +3,36 @@
     <a class="logo" @click="toIndex">
       <img :src="require('@/assets/images/' + (isSfel ? 'logo2' : isHome ? 'logo' : 'logo-black') + '.png')" alt="">
     </a>
-    <navbar ref="nav" :isHome.sync="isHome"></navbar>
-    <div class="tools">
-      <img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch">
-      <img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang">
-      <div v-if="showSearch" class="search-wrap" @click.stop="stop">
-        <input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title">
-        <img class="search-icon" src="@/assets/images/search.png" alt="" @click="handleSearch">
-        <i class="el-icon-close close-icon" @click="showSearch = false"></i>
+    <!-- pc端 -->
+    <template v-if="$store.getters.getModelType">
+      <navbar ref="nav" :isHome.sync="isHome"></navbar>
+      <div class="tools">
+        <img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch">
+        <img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang">
+        <div v-if="showSearch" class="search-wrap" @click.stop="stop">
+          <input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title">
+          <img class="search-icon" src="@/assets/images/search.png" alt="" @click="handleSearch">
+          <i class="el-icon-close close-icon" @click="showSearch = false"></i>
+        </div>
       </div>
-    </div>
+    </template>
+    <!-- 手机端 -->
+    <template v-else>
+      <i class="rightBox" :class="modelType ? 'el-icon-s-fold': 'el-icon-s-unfold' " @click="updateModelType"></i>
+      <div class="contentBox" v-show="modelType">
+        <navbar ref="nav" :isHome.sync="isHome" :updateModelType="updateType"></navbar>
+        <div class="modelBox">
+          <div class="searchBox"><img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch"></div>
+          <div class="languageBox"><img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang"></div>
+          <div v-if="showSearch" class="search-wrap" @click.stop="stop">
+            <input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title">
+            <img class="search-icon" src="@/assets/images/search.png" alt="" @click="handleSearch">
+            <i class="el-icon-close close-icon" @click="showSearch = false"></i>
+          </div>
+        </div>
+      </div>
+      
+    </template>
   </div>
 </template>
 <script>
@@ -24,7 +44,8 @@ export default {
       isHome: this.$route.path === '/home' || this.$route.path === '/sfel',
       showSearch: false,
       title: '',
-      searchTimer: null
+      searchTimer: null,
+      modelType: false
     };
   },
   components: {
@@ -84,10 +105,18 @@ export default {
     // 全局搜索
     handleSearch() {
       this.setKeyword(this.title)
+      this.modelType = !this.modelType
       if (this.title) {
         this.showSearch = false
         this.$router.push(`/column/result`)
       }
+    },
+    // 更改右侧盒子样式
+    updateModelType() {
+      this.modelType =  !this.modelType
+    },
+    updateType(type) {
+      this.modelType = type
     }
   }
 };
@@ -100,7 +129,7 @@ $height: 90px;
   top: 0;
   left: 0;
   width: 100%;
-  min-width: $min-width;
+  // min-width: $min-width;
   height: $height;
   box-sizing: content-box;
   &:not(.channel) {
@@ -111,7 +140,7 @@ $height: 90px;
     position: absolute;
     top: 0;
     left: 5%;
-    font-size: 20px;
+    font-size: 1.428rem;
     color: #333330;
     line-height: $height;
     cursor: pointer;
@@ -144,7 +173,7 @@ $height: 90px;
     width: 300px;
     height: 40px;
     padding: 0 40px 0 15px;
-    font-size: 16px;
+    font-size: 1.14rem;
     color: #333;
     line-height: 46px;
     border: 0;
@@ -158,10 +187,43 @@ $height: 90px;
     border-right: 1px solid #ccc;
   }
   .close-icon {
-    font-size: 28px;
+    font-size: 2rem;
     cursor: pointer;
   }
 }
+.menu-child {
+  /deep/ .el-submenu__title{
+    font-size: 1rem;
+  }
+}
+.rightBox{
+  font-size: 3.57rem;
+  position: absolute;
+  right: 10px;
+  top: 20px;
+}
+.contentBox{
+  width: 100%;
+  position: absolute;
+  top: 90px;
+  left: 0;
+  background-color: white;
+  z-index: 9999;
+  max-height: 30rem;
+  overflow-y: scroll;
+}
+.searchBox, .languageBox{
+  padding-left: 20px;
+  height: 56px;
+  line-height: 56px;
+}
+.modelBox{
+  position: relative;
+  padding-bottom: 20px;
+  .search-wrap{
+    top: 0;
+  }
+}
 @media (max-width: 1660px) {
   .header {
     .logo {
@@ -175,4 +237,24 @@ $height: 90px;
     }
   }
 }
+
+@media (min-width: 280px) and (max-width: 750px) {
+  .contentBox{
+    .searchBox, .languageBox{
+      padding-left: 20px;
+      height: 40px;
+      line-height: 40px;
+    }
+  }
+  .search-wrap {
+    right: 10px;
+    top: 0;
+    width: 70%;
+    input {
+      width: 15rem;
+      padding: 0 .5rem 0 .1rem;
+    }
+  }
+}
+
 </style>
diff --git a/src/layouts/navbar/index.vue b/src/layouts/navbar/index.vue
index b1edb6d..eb2172c 100644
--- a/src/layouts/navbar/index.vue
+++ b/src/layouts/navbar/index.vue
@@ -1,13 +1,6 @@
 <template>
   <div>
-    <el-menu :class="['nav', {home: isHome}]" ref="elMenu" 
-    :mode="$store.getters.getModelType ? 'horizontal' : 'vertical' " 
-    :key="menuRefresh" 
-    mode="horizontal" 
-    :background-color="bgColor" 
-    :text-color="textColor" 
-    :active-text-color="activeTextColor"
-     @open="jump" @select="jump" :default-active="String(active)">
+    <el-menu :class="['nav', {home: isHome}]" ref="elMenu" :key="menuRefresh" :mode="$store.getters.getModelType ? 'horizontal' : 'vertical' " :background-color="bgColor" :text-color="textColor" :active-text-color="activeTextColor" @open="jump" @select="jump" :default-active="String(active)">
       <menuTree :menuList="menus"/>
     </el-menu>
   </div>
@@ -18,7 +11,7 @@ import menuTree from '@/components/menuTree'
 import mixins from '@/mixins/article'
 import { mapState, mapMutations } from 'vuex'
 export default {
-  props: ['isHome'],
+  props: ['isHome','updateModelType'],
   mixins: [mixins],
   data() {
     return {
@@ -108,8 +101,12 @@ export default {
     },
     // 跳转
     jump(id) {
+      
       this.getPath(this.menus ,id || this.menus[0].id)
       this.columnTo(this.toItem)
+      // if(!this.$store.getters.getModelType) {
+      //   this.updateModelType(false)
+      // }
       this.$parent.showSearch = false
     }
   }
@@ -129,7 +126,7 @@ $height: 90px;
     height: $height;
     line-height: $height;
     span {
-      font-size: 14px;
+      font-size: 1rem;
       font-weight: 600;
     }
     &:hover {
@@ -182,4 +179,5 @@ $height: 90px;
     }
   }
 }
+
 </style>
\ No newline at end of file
diff --git a/src/pages/about/index.vue b/src/pages/about/index.vue
index 640abe9..24fe8e1 100644
--- a/src/pages/about/index.vue
+++ b/src/pages/about/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap" v-if="modules.length>=1">
-    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
+    <el-carousel height="30rem" :interval="6000" :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div :class="['banner-item', {'cursor-pointer': isLink(item.link.linkName)}]" @click="openLink(item)">
@@ -13,7 +13,7 @@
     
     <div class="block history gray">
       <div :class="['inner', {'cursor-pointer': isLink(modules[1].form.link.linkName)}]" @click="openLink(modules[1].form)">
-        <h2 class="wow fadeInLeft" style="margin-left: 57px">{{ modules[1].form.title }}</h2>
+        <h2 class="wow fadeInLeft" style="margin-left: 3.56rem">{{ modules[1].form.title }}</h2>
         <div class="texts wow fadeInDown" data-wow-delay="0.5s">
           <div class="left">
             <h2>{{ modules[1].form.subTitle }}</h2>
@@ -193,7 +193,7 @@ export default {
 @import "../../styles/page/page.scss";
 .history {
   h2 {
-    font-size: 30px;
+    font-size: 2.14rem;
     color: #333;
   }
   .texts {
@@ -218,7 +218,7 @@ export default {
     background: #D7D7D7;
   }
   .des {
-    font-size: 22px;
+    font-size: 1.57rem;
     color: #181818;
     line-height: 31px;
     -webkit-line-clamp: 6;
@@ -259,11 +259,11 @@ export default {
   }
   h6 {
     margin-bottom: 10px;
-    font-size: 40px;
+    font-size: 2.85rem;
     font-family: toppan;
   }
   .des {
-    font-size: 18px;
+    font-size: 1.28rem;
   }
 }
 .plan {
@@ -293,11 +293,11 @@ export default {
     }
   }
   h6 {
-    font-size: 36px;
+    font-size: 2.57rem;
   }
   .des {
     margin: 20px 0;
-    font-size: 20px;
+    font-size: 1.428rem;
   }
 }
 .people {
@@ -323,14 +323,14 @@ export default {
   }
   h6 {
     margin: 20px 0;
-    font-size: 40px;
+    font-size: 2.85rem;
   }
   .sub {
-    font-size: 20px;
+    font-size: 1.428rem;
     color: #020202;
   }
   .des {
-    font-size: 18px;
+    font-size: 1.28rem;
     color: #020202;
     line-height: 30px;
   }
@@ -368,12 +368,12 @@ export default {
   }
   h6 {
     margin: 35px 0 5px;
-    font-size: 24px;
+    font-size: 1.71rem;
     color: #272727;
     transition: .3s;
   }
   .des {
-    font-size: 16px;
+    font-size: 1.14rem;
     color: #757575;
     transition: .3s;
   }
@@ -399,13 +399,13 @@ export default {
   }
   h6 {
     margin-bottom: 30px;
-    font-size: 30px;
+    font-size: 2.14rem;
     color: #333;
     transition: .3s;
     @include mul-ellipsis(3);
   }
   .des {
-    font-size: 20px;
+    font-size: 1.42rem;
     color: #333;
     line-height: 34px;
   transition: .3s;
@@ -426,14 +426,14 @@ export default {
   }
   .num {
     margin-bottom: 10px;
-    font-size: 60px;
+    font-size: 4.28rem;
     font-weight: 800;
     font-family: toppan;
     color: #035CE1;
     line-height: 49px;
   }
   .text {
-    font-size: 24px;
+    font-size: 1.71rem;
   }
 }
 @media (max-width: 1590px) {
@@ -448,12 +448,20 @@ export default {
 }
 
 @media (max-width: 1200px) {
+  .card li {
+    padding:3.5rem 1rem;
+  }
+  .history{
+    .texts{
+      padding: 3.14rem 1.5rem;
+    }
+  }
  .texts {
   flex-direction: column;
   .left{
     width: 100%;
     h2{
-      font-size: 20px;
+      font-size: 1.42rem;
     }
     
   }
@@ -531,10 +539,10 @@ export default {
         .left{
           width: 100%;
           h6 {
-            font-size: 20px;
+            font-size: 1.42rem;
           }
           .des{
-             font-size: 15px;
+             font-size: 1.07rem;
           }
         }
         .pic {
@@ -551,6 +559,7 @@ export default {
     .texts {
       .bg {
         height: 350px;
+        margin-top: 1rem;
       }
     }
     .card {
diff --git a/src/pages/article/index.vue b/src/pages/article/index.vue
index 5b8803c..6c5f081 100644
--- a/src/pages/article/index.vue
+++ b/src/pages/article/index.vue
@@ -176,6 +176,9 @@ export default {
 @import "./editor.css";
 .content {
   width: 1400px;
+  /deep/ .el-breadcrumb {
+    font-size: 1rem;
+  }
 }
 .banner {
   height: 280px;
@@ -192,12 +195,12 @@ export default {
     width: 66%;
   }
   h2 {
-    font-size: 36px;
+    font-size: 2.57rem;
     color: #1C1C1C;
   }
   .meta {
     margin: 20px 0;
-    font-size: 14px;
+    font-size: 1rem;
     color: #9B9B9B;
   }
   .brief {
@@ -241,6 +244,9 @@ export default {
   }
   .right {
     width: 20%;
+    /deep/ .el-tree-node__label{
+      font-size: 1rem;
+    }
   }
   .column {
     width: 100%;
@@ -290,7 +296,7 @@ export default {
         position: fixed;
         right: 10px;
         top: 160px;
-        z-index: 99;;
+        z-index: 9;;
         width: 180px;
       }
     }
diff --git a/src/pages/column/index.vue b/src/pages/column/index.vue
index 05c2f44..7ff3fb4 100644
--- a/src/pages/column/index.vue
+++ b/src/pages/column/index.vue
@@ -475,6 +475,7 @@ export default {
 }
 .l-title {
   font-weight: 600;
+  font-size: 1.28rem;
 }
 
 .banner {
@@ -490,14 +491,14 @@ export default {
   }
 
   .text {
-    font-size: 48px;
+    font-size: 3.42rem;
     font-weight: 600;
     @include ellipsis;
   }
 
   .sub {
     margin-top: 10px;
-    font-size: 28px;
+    font-size: 2rem;
   }
 }
 
@@ -532,7 +533,7 @@ export default {
       padding: 0 15px;
       margin-right: 10px;
       line-height: 36px;
-      font-size: 14px;
+      font-size: 1rem;
       color: #333;
       background: #f7f7f7;
       cursor: pointer;
@@ -558,7 +559,7 @@ export default {
     }
 
     .label {
-      font-size: 16px;
+      font-size: 1.14rem;
       color: #333;
       white-space: nowrap;
     }
@@ -579,7 +580,7 @@ export default {
         width: 100%;
         height: 48px;
         padding: 0 15px;
-        font-size: 14px;
+        font-size: 1rem;
         color: #333;
         background: #f7f7f7;
         border: 0;
@@ -633,7 +634,7 @@ export default {
       height: 48px;
       padding-left: 40px;
       margin-bottom: 1px;
-      font-size: 18px;
+      font-size: 1.28rem;
       color: #666;
       background-color: #fff;
       border-top: 1px solid #f8f9f9;
@@ -654,7 +655,7 @@ export default {
     }
 
     .el-tree-node__label {
-      font-size: 18px;
+      font-size: 1.28rem;
       color: #666;
       line-height: 22px;
     }
@@ -709,13 +710,13 @@ export default {
 
     .type {
       margin-bottom: 15px;
-      font-size: 18px;
+      font-size: 1.28rem;
       color: #333;
     }
 
     h6 {
       margin-bottom: 15px;
-      font-size: 24px;
+      font-size: 1.71rem;
       color: #000;
       line-height: 38px;
       @include mul-ellipsis(2);
@@ -724,7 +725,7 @@ export default {
     .meta {
       display: flex;
       align-items: center;
-      font-size: 14px;
+      font-size: 1rem;
       font-family: PingFangSC-Medium;
       color: #333;
     }
@@ -776,7 +777,7 @@ export default {
 
     .text {
       margin-bottom: 5px;
-      font-size: 14px;
+      font-size: 1rem;
       cursor: pointer;
       @include ellipsis;
 
@@ -786,7 +787,7 @@ export default {
     }
 
     .date {
-      font-size: 12px;
+      font-size: .85rem;
       color: #999;
     }
   }
diff --git a/src/pages/home/index.vue b/src/pages/home/index.vue
index 7b0b641..6ba8530 100644
--- a/src/pages/home/index.vue
+++ b/src/pages/home/index.vue
@@ -207,11 +207,11 @@ export default {
   }
   h6 {
     margin-bottom: 25px;
-    font-size: 24px;
+    font-size: 1.71rem;
     color: #333;
   }
   .des {
-    font-size: 18px;
+    font-size: 1.28rem;
     color: #222;
     line-height: 30px;
   }
@@ -248,18 +248,23 @@ export default {
     margin-left: 20px;
   }
   h6 {
-    font-size: 18px;
+    font-size: 1.28rem;
     color: #0648A8;
     @include ellipsis;
   }
   .des {
     margin: 14px 0;
-    font-size: 16px;
+    font-size: 1.14rem;
     color: #333;
     line-height: 22px;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    text-overflow: ellipsis;
+    overflow: hidden;
   }
   .meta {
-    font-size: 16px;
+    font-size: 1.14rem;
     color: #999;
   }
 }
@@ -292,11 +297,11 @@ export default {
     transition: .3s;
   }
   h6 {
-    font-size: 40px;
+    font-size: 2.75rem;
   }
   .des {
     margin: 20px 0 10px;
-    font-size: 18px;
+    font-size: 1.28rem;
     color: #020202;
     line-height: 30px;
   }
@@ -326,13 +331,13 @@ export default {
   .num {
     margin-bottom: 10px;
     font-family: toppan;
-    font-size: 60px;
+    font-size: 4.28rem;
     font-weight: 800;
     color: #035CE1;
     line-height: 49px;
   }
   .text {
-    font-size: 24px;
+    font-size: 1.71rem;
   }
 }
 .about {
@@ -352,14 +357,14 @@ export default {
     }
   }
   .text {
-    font-size: 30px;
+    font-size: 2.14rem;
     color: #fff;
   }
   .des {
     display: block;
     padding: 38px 60px;
     margin-top: 84px;
-    font-size: 30px;
+    font-size: 2rem;
     color: #fff;
     line-height: 42px;
     text-align: center;
diff --git a/src/pages/overviewLocation/index.vue b/src/pages/overviewLocation/index.vue
index d465642..9fea22b 100644
--- a/src/pages/overviewLocation/index.vue
+++ b/src/pages/overviewLocation/index.vue
@@ -86,6 +86,9 @@ export default {
   width: 1000px;
   padding: 77px 0;
   margin: 0 auto;
+  span {
+    font-size: 1.35rem;
+  }
 }
 .video {
   width: 100%;
@@ -109,6 +112,9 @@ export default {
   }
   .tab-content{
     width: 90%;
+    span {
+      font-size: 1.35rem;
+    }
   }
  
 }
diff --git a/src/pages/overviewTrailer/index.vue b/src/pages/overviewTrailer/index.vue
index baeea9a..3c9d081 100644
--- a/src/pages/overviewTrailer/index.vue
+++ b/src/pages/overviewTrailer/index.vue
@@ -92,6 +92,9 @@ export default {
   width: 1000px;
   padding: 77px 0;
   margin: 0 auto;
+  span {
+    font-size: 1.35rem;
+  }
 }
 .video {
   width: 100%;
diff --git a/src/pages/sfel/index.vue b/src/pages/sfel/index.vue
index fc44710..991a5b9 100644
--- a/src/pages/sfel/index.vue
+++ b/src/pages/sfel/index.vue
@@ -1022,7 +1022,7 @@ export default {
   }
 }
 .tools {
-  z-index: 10;
+  z-index: 9;
   position: fixed;
   top: 200px;
   left: 0;
diff --git a/src/pages/talent/index.vue b/src/pages/talent/index.vue
index 677320f..8e866b1 100644
--- a/src/pages/talent/index.vue
+++ b/src/pages/talent/index.vue
@@ -251,4 +251,40 @@ export default {
     line-height: 30px;
   }
 }
+@media (min-width: 280px) and (max-width: 750px) {
+  .single-banner{
+    .texts {
+      left: 200px;
+      .banner-title{
+        font-size: 2.2rem;
+      }
+    }
+   
+  }
+  .block {
+    padding: 30px 0;
+    .inner{
+      .item {
+        flex-direction: column;
+        padding: 1.5rem;
+      }
+      .texts{
+        width: 100%;
+        padding: 1.5rem;
+      }
+    }
+  }
+  .style {
+    /deep/ .el-carousel__container{
+      height: 27rem !important;
+    }
+    .wow { 
+      margin-bottom: 2rem;
+      
+    }
+    .item{
+      height: 25rem;
+    }
+  }
+}
 </style>
\ No newline at end of file
diff --git a/src/setting.js b/src/setting.js
index bce469f..ec9d41d 100644
--- a/src/setting.js
+++ b/src/setting.js
@@ -4,7 +4,8 @@
 const isDev = process.env.NODE_ENV === 'development' // 开发环境
 let host = `${location.origin}/`
 if (isDev) {
-  host = 'http://192.168.31.151:10000/'
+  host = 'http://192.168.31.51:10000/'
+  // host = 'http://192.168.31.136:10000/'
 }
 
 const Setting = {