部分样式修改优化

src/main/resources/static/css/base/base.pc.css

@@ -118,17 +118,17 @@ iframe{width:320px !important;height: 280px !important}
 .baseHeadCenter .wrap{height: 100px;box-sizing: border-box;padding: 10px 0;}
 .baseHeadCenter .logo{float:left;width:228px;height:76px;margin-right:75px;}
 .baseHeadCenter .searchBox{width:668px;float:left}
-.baseHeadCenter .search{width:100%;height:44px;line-height:44px;border:1px solid #FFE6DC;position:relative;border-radius: 22px;}
-.baseHeadCenter .search:before{content:'';position:absolute;left:104px;top:16px;height:12px;border-right:2px solid #C0C6D1}
-.baseHeadCenter .search .jqSelect{width:104px;height:44px;line-height:44px;border:none}
-.baseHeadCenter .search .jqSelect:before{right:16px}
+.baseHeadCenter .search{width:100%;height:44px;line-height:44px;border:1px solid #FF5B00;position:relative;border-radius: 22px;}
+.baseHeadCenter .search:before{content:'';position:absolute;left:90px;top:12px;height:20px;border-right:2px solid #e1e1e1}
+.baseHeadCenter .search .jqSelect{width:80px;height:44px;line-height:44px;border:none;text-align: center;}
+.baseHeadCenter .search .jqSelect:before{right:4px}
 .baseHeadCenter .search .jqSelect ul{z-index:999;}
-.baseHeadCenter .keyword{width:84%;height:44px;line-height:44px;text-indent:15px;position:absolute;right:0;top:0;border:none;outline:none;border-radius: 22px;}
+.baseHeadCenter .keyword{width:86%;height:44px;line-height:44px;text-indent:15px;position:absolute;right:0;top:0;border:none;outline:none;border-radius: 22px;}
 .baseHeadCenter .keyword:focus{outline:none;border:none}
 .baseHeadCenter .searchBtn{position:absolute;right: 0;top: 0;font-size:0;padding: 7px 12px;height: 30px;line-height: 30px;}
 .baseHeadCenter .searchBtn:before{width: 30px;height: 30px;background-position: 4px 4px;}
-.baseHeadCenter .hotKey{color:#FFB496;font-size:12px;line-height:28px}
-.baseHeadCenter .hotKey .word{padding:0 5px;font-style:normal;cursor:pointer;}
+.baseHeadCenter .hotKey{color:#50607A;font-size:12px;line-height:36px;box-sizing: border-box;padding-left: 24px;}
+.baseHeadCenter .hotKey .word{padding:0 8px;font-style:normal;cursor:pointer;}
 .baseHeadCenter .hotKey .word:hover{color:#FF5B00}
 /*优化供应商登录位置*/
 /*.baseHeadCenter .wechat_qrcode{width: 270px;height: 100%;float: left;margin-left: 33px; padding: 10px 0; box-sizing: border-box;}*/
@@ -230,7 +230,7 @@ iframe{width:320px !important;height: 280px !important}
 .baseHeadCenter.article .keyword{width:100%}
 
 /* 导航栏 */
-.baseTopNav{position:relative;height:44px;border-top:1px solid #FF5B00}
+.baseTopNav{position:relative;height:44px;border-top:1px solid #E1E1E1}
 .baseTopNav>.wrap{height:44px;box-sizing:border-box;position:relative;z-index:991;}
 .baseTopNav .home,.baseTopNav .classBtn,.baseTopNav .navBox{float:left}
 .baseTopNav .service{float:right}
@@ -392,7 +392,7 @@ iframe{width:320px !important;height: 280px !important}
 .pageWrap span{display:inline-block;height:40px;line-height:40px;margin:0 5px;color:#93979F}
 .pageWrap b{color:#2D3036;font-weight:normal}
 .pageWrap input{box-sizing:border-box;width:80px;height:40px;line-height:40px;font-size:16px;border:1px solid #EBECEF;outline:none;border-radius:2px;text-align:center}
-.crumbs{width:1184px;margin:0 auto;box-sizing:border-box;padding:12px 0;font-size:16px;color: #22272E;}
+.crumbs{width:1184px;margin:0 auto;box-sizing:border-box;padding:12px 0;font-size:16px;color: #999999;}
 /* 登录弹框 */
 .loginAlert{padding-top:5px;}
 .loginAlert span:first-child:after{content: '，';}

src/main/resources/static/css/base/center.css

@@ -1,47 +1,47 @@
-@charset "utf-8";
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    .navLayout {min-height: 900px;}
-    .crumbs{padding-left: 234px;}
-    .navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF}
-    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
-    .navLayout .navList .tab{display:block;color:#22272e;position:relative;cursor: pointer;}
-    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
-    .navLayout .navList .con{position:relative;}
-    .navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
-    .navLayout .navList .con:before{top:0}
-    .navLayout .navList .con:after{bottom:0}
-    .navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
-    .navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
-    .navLayout .navList.on .tab{color:#FF5B00}
-    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
-    .navLayout .right{float:right;width:968px}
-
-
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-.centerNav{width:100%;height:11vw;background:#FFF;position:relative;z-index:90;}
-.centerNav .centerBox{content:'';position:fixed;background-color:rgba(74,79,88,.7);width:100%;height:100%;display:none}
-.centerNav .wrap{position:absolute;top:0;left:0;width:100%;background:#FFF;padding-bottom:4vw;border-radius:0 0 3vw 3vw;font-size:3.4vw;z-index:9}
-.centerNav .wrap .centerList:first-child .tab{border-top:solid 1px #f0f2f4}
-.centerNav .centerList .tab{display:block;margin:0 auto;width:93.4vw;height:10.8vw;line-height:10.8vw;font-size:3.4vw;color:#22272e;position:relative}
-.centerNav .centerList .tab.home{border-bottom:solid 1px #f0f2f4;}
-.centerNav .centerList .tab.home:after{content:'\276F';font-weight:normal;position:absolute;top:0;font-size:3.6vw;color:#4A4F58;right:4vw;line-height:9.6vw}
-.centerNav .centerList .tab.home.on:after{transform:rotate(90deg)}
-.centerNav .centerList .tab:before{width:6.4vw;height:6.4vw;vertical-align:middle}
-.centerNav .centerList .tab.home:before{background-position:-50.5vw -53vw}
-.centerNav .centerList .tab.tr:before{background-position:-58.8vw -53vw}
-.centerNav .centerList .tab.ma:before{background-position:-67.1vw -53vw}
-.centerNav .centerList .tab.se:before{background-position:-41.7vw -53vw}
-.centerNav .centerList .tab.sh:before{background-position:-75.6vw -53vw}
-.centerNav .centerList .con a{display:inline-block;height:8.4vw;line-height:8.4vw;padding:0 3.5vw;border:1px solid #b8bfca;border-radius:2px;color:#627386;margin:0 0 2vw 4vw;}
-.centerNav .centerList .con a.on{color:#FF5B00;border-color:#FF5B00;}
-
-
-}
+@charset "utf-8";
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    .navLayout {min-height: 900px;}
+    .crumbs{padding-left: 234px;}
+    .navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF;border-radius: 8px;}
+    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
+    .navLayout .navList .tab{display:block;color:#22272e;position:relative;cursor: pointer;}
+    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
+    .navLayout .navList .con{position:relative;}
+    .navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
+    .navLayout .navList .con:before{top:0}
+    .navLayout .navList .con:after{bottom:0}
+    .navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
+    .navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
+    .navLayout .navList.on .tab{color:#FF5B00}
+    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
+    .navLayout .right{float:right;width:968px;border-radius: 8px;}
+
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+.centerNav{width:100%;height:11vw;background:#FFF;position:relative;z-index:90;}
+.centerNav .centerBox{content:'';position:fixed;background-color:rgba(74,79,88,.7);width:100%;height:100%;display:none}
+.centerNav .wrap{position:absolute;top:0;left:0;width:100%;background:#FFF;padding-bottom:4vw;border-radius:0 0 3vw 3vw;font-size:3.4vw;z-index:9}
+.centerNav .wrap .centerList:first-child .tab{border-top:solid 1px #f0f2f4}
+.centerNav .centerList .tab{display:block;margin:0 auto;width:93.4vw;height:10.8vw;line-height:10.8vw;font-size:3.4vw;color:#22272e;position:relative}
+.centerNav .centerList .tab.home{border-bottom:solid 1px #f0f2f4;}
+.centerNav .centerList .tab.home:after{content:'\276F';font-weight:normal;position:absolute;top:0;font-size:3.6vw;color:#4A4F58;right:4vw;line-height:9.6vw}
+.centerNav .centerList .tab.home.on:after{transform:rotate(90deg)}
+.centerNav .centerList .tab:before{width:6.4vw;height:6.4vw;vertical-align:middle}
+.centerNav .centerList .tab.home:before{background-position:-50.5vw -53vw}
+.centerNav .centerList .tab.tr:before{background-position:-58.8vw -53vw}
+.centerNav .centerList .tab.ma:before{background-position:-67.1vw -53vw}
+.centerNav .centerList .tab.se:before{background-position:-41.7vw -53vw}
+.centerNav .centerList .tab.sh:before{background-position:-75.6vw -53vw}
+.centerNav .centerList .con a{display:inline-block;height:8.4vw;line-height:8.4vw;padding:0 3.5vw;border:1px solid #b8bfca;border-radius:2px;color:#627386;margin:0 0 2vw 4vw;}
+.centerNav .centerList .con a.on{color:#FF5B00;border-color:#FF5B00;}
+
+
+}

src/main/resources/static/css/help/help.css

@@ -1,69 +1,69 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-.navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF}
-.navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
-.navLayout .navList .tab{display:block;color:#22272e;position:relative}
-.navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
-.navLayout .navList .con{position:relative;}
-.navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
-.navLayout .navList .con:before{top:0}
-.navLayout .navList .con:after{bottom:0}
-.navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
-.navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
-.navLayout .navList.on .tab{color:#FF5B00}
-.navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
-.navLayout .right{float:right;width:968px}
-.pageContent{background:#FFF;padding:16px}
-.pageContent form{
-    width: 498px;
-    margin: 0 auto;
-    padding: 50px 0;
-}
-/*.pageContent form button{
-    display: block;
-    margin: 0 auto;
-    width: 200px;
-    height: 50px;
-    line-height: 50px;
-    background-color: #FF5B00;
-    border-radius: 2px;
-    text-align: center;
-    font-size: 18px;
-    color: #FFF;
-}*/
-
-
-
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-.navLayout{background:#FFF;border-top:1px solid #F5F5F5;border-bottom:1px solid #F5F5F5;}
-.navLayout .crumbs{display:none;}
-.navLayout .left{width:29.3vw;border-right:1px solid #F5F5F5;line-height:11.8vw;white-space:nowrap;text-indent:3.3vw;font-size:3.4vw;}
-.navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5;font-size: 3.7vw;}
-.navLayout .navList .tab{display:block;color:#22272e;position:relative}
-.navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:1.4vw;top:1vw;transform:rotate(90deg);width:6.4vw;height:6.4vw;line-height:6.4vw;text-align:center;color:#bec2c9}
-.navLayout .navList .con a{display:block;color:#9aa5b5;}
-.navLayout .navList.on .tab:before{top:4vw;transform:rotate(270deg);color:#FF5B00}
-.navLayout .navList.on .tab{color:#FF5B00}
-.navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
-.navLayout .right{width:70.5vw}
-.pageContent{padding:3.3vw}
-
-.pageContent .formLine .diyBox {
-    width: 24vw;
-}
-
-
-
-
-
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+.navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF;border-radius: 8px;}
+.navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
+.navLayout .navList .tab{display:block;color:#22272e;position:relative}
+.navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
+.navLayout .navList .con{position:relative;}
+.navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
+.navLayout .navList .con:before{top:0}
+.navLayout .navList .con:after{bottom:0}
+.navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
+.navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
+.navLayout .navList.on .tab{color:#FF5B00}
+.navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
+.navLayout .right{float:right;width:968px;border-radius: 8px;overflow: hidden;}
+.pageContent{background:#FFF;padding:16px}
+.pageContent form{
+    width: 498px;
+    margin: 0 auto;
+    padding: 50px 0;
+}
+/*.pageContent form button{
+    display: block;
+    margin: 0 auto;
+    width: 200px;
+    height: 50px;
+    line-height: 50px;
+    background-color: #FF5B00;
+    border-radius: 2px;
+    text-align: center;
+    font-size: 18px;
+    color: #FFF;
+}*/
+
+
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+.navLayout{background:#FFF;border-top:1px solid #F5F5F5;border-bottom:1px solid #F5F5F5;}
+.navLayout .crumbs{display:none;}
+.navLayout .left{width:29.3vw;border-right:1px solid #F5F5F5;line-height:11.8vw;white-space:nowrap;text-indent:3.3vw;font-size:3.4vw;}
+.navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5;font-size: 3.7vw;}
+.navLayout .navList .tab{display:block;color:#22272e;position:relative}
+.navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:1.4vw;top:1vw;transform:rotate(90deg);width:6.4vw;height:6.4vw;line-height:6.4vw;text-align:center;color:#bec2c9}
+.navLayout .navList .con a{display:block;color:#9aa5b5;}
+.navLayout .navList.on .tab:before{top:4vw;transform:rotate(270deg);color:#FF5B00}
+.navLayout .navList.on .tab{color:#FF5B00}
+.navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
+.navLayout .right{width:70.5vw}
+.pageContent{padding:3.3vw}
+
+.pageContent .formLine .diyBox {
+    width: 24vw;
+}
+
+
+
+
+
+}
+

src/main/resources/static/css/index/index_new.pc.css

@@ -128,7 +128,7 @@ li{list-style:none;}
 .carousel-list .card-content .card-title .title-1 .title-2-item {
     width: 38px;
     height: 18px;
-    border-radius: 2px;
+    border-radius: 9px;
     border: 1px solid #B2B2B2;
     font-size: 12px;
     color: #B2B2B2;

src/main/resources/static/css/product/instruement.css

@@ -1,49 +1,49 @@
-@media screen and (min-width:768px) {
-    #container {width: 1184px;margin: 32px auto;overflow: hidden;}
-    .instrue-left {width: 900px;float: left;}
-    .normal-nav{margin-top: 10px}
-    .top-category{overflow: hidden;}
-    .instrue-right-content{width: 284px;min-height: 343px;float: right;margin-top: 10px;}
-    .instrue-right-ross{width:284px;height:343px;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 16px;}
-    .instrue-right-ross.none{display: none;}
-    .instrue-right-ross.show{display: block;}
-    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .instrue-left .top-category .normal-nav .nav-list:hover{color:#FF5B00;transform:translateY(-5px);box-shadow:0 8px 8px rgba(102,102,102,0.05), 0 10px 10px rgba(102,102,102,0.05), 0 12px 12px rgba(102,102,102,0.05);}
-    .instrue-left .top-category .normal-nav .nav-list {border:1px solid #fff;float: left;margin: 0 16px 16px 0;width: 132px;height: 88px;background: #fff;text-align: center;color: #4a4f58;font-size: 14px;cursor: pointer;transition: all 0.4s}
-    .instrue-left .top-category .normal-nav .nav-list a{padding: 0 10px;text-align: center;display: block;line-height: 22px;}
-    .instrue-left .top-category .normal-nav .nav-list.active {border: 1px solid #FF5B00;color: #FF5B00;}
-    .instrue-right {float: left;width: 252px;background: #fff;padding: 16px;margin-top: 0;min-height: 343px;overflow: auto;}
-    .instrue-right .wrap_tittle{padding-bottom: 10px;color: #4a4f58;font-size: 16px;font-weight: bold;border-bottom: 1px solid #f5f5f5;position: relative;}
-    .instrue-right .wrap_tittle .line{height: 2px;width: 16px;background: #FF5B00;display: block;position: absolute;bottom: 0}
-    .instrue-right .hot-search{padding:24px 0px 0px 0px;}
-    .instrue-right .hot-search .hot-list{display: inline-block;height: 32px;line-height: 32px;background: #f7f7f7;margin: 0 12px 12px 0;padding: 0 13px;color: #4a4f58;cursor: pointer;position: relative}
-    .instrue-right .hot-search .hot-list:hover{background:#fef6f3;color: #FF5B00 }
-    .item_icon{ width: 100%;height: 36px;padding: 12px 0 8px 0;}
-    .item_icon img{width: 36px;height: 36px;display: block;margin: 0 auto;}
-    .icon.hot:before{width: 25px;height: 20px;background-position: -120px -550px;position: absolute;top: -10px;right: -10px}
-    .brand{color: #9aa5b5;margin: 10px 8px;border: 1px solid #e3ebf7;display: inline-block;padding: 0 10px;border-radius: 2px}
-}
-
-
-@media screen and (max-width:768px) {
-    .instrue-right-content{width: 100%;padding:3.2vw;box-sizing: border-box;}
-    .instrue-right-ross{width:100%;height:26vw;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 3vw;}
-    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .instrue-right{width: 100%;background: #fff;position:relative;float: left;}
-    .instrue-right .wrap_tittle{padding: 0 3.2vw;color: #909090; font-size: 3.4vw;}
-    .instrue-right .hot-search{padding: 2.7vw;overflow: hidden;height: 7vw;background: #fff;border-radius: 0 0 1.6vw 1.6vw;}
-    .instrue-right .hot-search .hot-list{display: inline-block;background: #f7f7f7;color: #4a4f58;font-size: 3.2vw;padding: .7vw 2vw;margin: 0 2.4vw 3.1vw 0;position: relative;}
-    .instrue-left{margin-top: 3vw;}
-    .top-category{background: #fff;}
-    .top-category .nav-list{display: inline-block;width: 24%;height: 21vw;text-align: center;}
-    .item_icon{height: 8.8vw;padding: 2.7vw 0;width: 100%}
-    .item_icon img{width: 8.8vw;height: 8.8vw;display: block;margin: 0 auto}
-    .instrue-right .hot-search .right-box{position:absolute;right: 2.7vw;top:3vw;width:10%;text-align:center}
-    .close.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -42vw 0px;transition:none}ght .hot-search .left-box{width: 90%;float: left}
-    .bg{position: fixed;background: rgba(34,39,46, 0.3);left: 0;width: 100%;height: 100%;z-index: 1000;transition: 0.5s;}
-    .mIcon.hot:before{width: 5.3vw;height:4.5vw;background-position: -53.9vw -69.3vw;position: absolute;top: -2.7vw;right: -2.7vw;}
-    .open.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -51vw 0px;transition:none}
-    .noclick{pointer-events: none}
-}
+@media screen and (min-width:768px) {
+    #container {width: 1184px;margin: 32px auto;overflow: hidden;}
+    .instrue-left {width: 900px;float: left;}
+    .normal-nav{margin-top: 10px}
+    .top-category{overflow: hidden;}
+    .instrue-right-content{width: 284px;min-height: 343px;float: right;margin-top: 10px;}
+    .instrue-right-ross{width:284px;height:343px;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 16px;}
+    .instrue-right-ross.none{display: none;}
+    .instrue-right-ross.show{display: block;}
+    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .instrue-left .top-category .normal-nav .nav-list:hover{color:#FF5B00;transform:translateY(-5px);box-shadow:0 8px 8px rgba(102,102,102,0.05), 0 10px 10px rgba(102,102,102,0.05), 0 12px 12px rgba(102,102,102,0.05);}
+    .instrue-left .top-category .normal-nav .nav-list {border:1px solid #fff;float: left;margin: 0 16px 16px 0;width: 132px;height: 88px;border-radius: 8px; background: #fff;text-align: center;color: #4a4f58;font-size: 14px;cursor: pointer;transition: all 0.4s}
+    .instrue-left .top-category .normal-nav .nav-list a{padding: 0 10px;text-align: center;display: block;line-height: 22px;}
+    .instrue-left .top-category .normal-nav .nav-list.active {border: 1px solid #FF5B00;color: #FF5B00;}
+    .instrue-right {float: left;width: 252px;background: #fff;padding: 16px;margin-top: 0;min-height: 343px;overflow: auto;border-radius: 8px;}
+    .instrue-right .wrap_tittle{padding-bottom: 10px;color: #4a4f58;font-size: 16px;font-weight: bold;border-bottom: 1px solid #f5f5f5;position: relative;}
+    .instrue-right .wrap_tittle .line{height: 2px;width: 16px;background: #FF5B00;display: block;position: absolute;bottom: 0}
+    .instrue-right .hot-search{padding:24px 0px 0px 0px;}
+    .instrue-right .hot-search .hot-list{display: inline-block;height: 32px;border-radius: 16px;line-height: 32px;background: #f7f7f7;margin: 0 12px 12px 0;padding: 0 13px;color: #4a4f58;cursor: pointer;position: relative}
+    .instrue-right .hot-search .hot-list:hover{background:#fef6f3;color: #FF5B00 }
+    .item_icon{ width: 100%;height: 36px;padding: 12px 0 8px 0;}
+    .item_icon img{width: 36px;height: 36px;display: block;margin: 0 auto;}
+    .icon.hot:before{width: 25px;height: 20px;background-position: -120px -550px;position: absolute;top: -10px;right: -10px}
+    .brand{color: #9aa5b5;margin: 10px 8px;border: 1px solid #e3ebf7;display: inline-block;padding: 0 10px;border-radius: 2px}
+}
+
+
+@media screen and (max-width:768px) {
+    .instrue-right-content{width: 100%;padding:3.2vw;box-sizing: border-box;}
+    .instrue-right-ross{width:100%;height:26vw;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 3vw;}
+    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .instrue-right{width: 100%;background: #fff;position:relative;float: left;}
+    .instrue-right .wrap_tittle{padding: 0 3.2vw;color: #909090; font-size: 3.4vw;}
+    .instrue-right .hot-search{padding: 2.7vw;overflow: hidden;height: 7vw;background: #fff;border-radius: 0 0 1.6vw 1.6vw;}
+    .instrue-right .hot-search .hot-list{display: inline-block;background: #f7f7f7;color: #4a4f58;font-size: 3.2vw;padding: .7vw 2vw;margin: 0 2.4vw 3.1vw 0;position: relative;}
+    .instrue-left{margin-top: 3vw;}
+    .top-category{background: #fff;}
+    .top-category .nav-list{display: inline-block;width: 24%;height: 21vw;text-align: center;}
+    .item_icon{height: 8.8vw;padding: 2.7vw 0;width: 100%}
+    .item_icon img{width: 8.8vw;height: 8.8vw;display: block;margin: 0 auto}
+    .instrue-right .hot-search .right-box{position:absolute;right: 2.7vw;top:3vw;width:10%;text-align:center}
+    .close.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -42vw 0px;transition:none}ght .hot-search .left-box{width: 90%;float: left}
+    .bg{position: fixed;background: rgba(34,39,46, 0.3);left: 0;width: 100%;height: 100%;z-index: 1000;transition: 0.5s;}
+    .mIcon.hot:before{width: 5.3vw;height:4.5vw;background-position: -53.9vw -69.3vw;position: absolute;top: -2.7vw;right: -2.7vw;}
+    .open.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -51vw 0px;transition:none}
+    .noclick{pointer-events: none}
+}

src/main/resources/static/css/product/list.css

@@ -4,11 +4,11 @@ li{list-style:none}
  * PC端
  */
 @media screen and (min-width:768px){
-    .search-text{float: left;margin-right: 20px;}
+    .search-text{float: left;margin-right: 20px;color: #999;}
     .search-text-brand{float: left;position: relative; height: 24px;padding: 0 24px 0 12px;line-height: 24px;box-sizing: border-box;border: 1px solid #DDDDDD;border-radius: 2px;text-align: center;font-size: 14px;color: #4A4F58;}
     .search-text-brand a{color: #E15621;}
     .search-text-brand .icon:before{background-position: -227px -648px;width: 24px;height: 24px;right: 0;position: absolute;cursor: pointer;}
-    .product-brand{width:1184px;margin:16px auto;box-sizing:border-box;min-height: 88px;padding:24px 12px 12px 12px;font-size:0;text-align:center;background:#FFF;position: relative;}
+    .product-brand{width:1184px;margin:16px auto;box-sizing:border-box;min-height: 88px;border-radius: 8px; padding:24px 12px 12px 12px;font-size:0;text-align:center;background:#FFF;position: relative;}
     .product-brand .product-brand-name{width: 116px;float: left;border-right: 1px solid #F7F7F7;line-height: 44px;text-align: center;font-size: 16px;color: #4A4F58;}
     .product-brand .product-brand-name.show{line-height: 88px;}
     .product-brand-oper{width: 110px;height: 32px;position: absolute;right: 24px;top: 24px;}
@@ -18,7 +18,7 @@ li{list-style:none}
     .product-brand-add{width: 56px;height: 24px;box-sizing: border-box;border: 1px solid #E2E7EF;float: right;font-size: 14px;color: #9AA5B5;line-height: 24px;text-align: center;cursor: pointer;}
     .product-brand-list{width: 900px;float: left;box-sizing: border-box;padding:0 24px;height: 44px;overflow: scroll;overflow-x: hidden;overflow-y:auto;}
     .product-brand-list.show{height: 150px;}
-    .product-brand-list .brand-list{width: 90px;height: 32px;padding: 0 12px;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 32px;font-size: 16px;color: #4A4F58;border-radius: 2px;margin-right: 24px;margin-bottom: 12px;}
+    .product-brand-list .brand-list{width: 90px;height: 32px; padding: 0 12px;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 32px;font-size: 16px;color: #4A4F58;border-radius: 16px;margin-right: 24px;margin-bottom: 12px;}
     .product-brand-list .brand-list.checked{border-color: #E15621;}
     .product-brand-list .brand-list.checked a{color: #E15621;}
     .product-brand-list .brand-list a{width: 100%;height: 100%;display: block;text-align: center;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;word-break: break-all;}
@@ -30,7 +30,7 @@ li{list-style:none}
     .product-brand-button .brand-button .btn.confirm.disabled{background-color: #E2E7EF;}
     .product-brand-button .brand-button .btn.confirm{background-color: #E15621;}
     .product-brand-button .brand-button .btn.cancel{background-color: #FFFFFF;border: 1px solid #E2E7EF;color: #4A4F58;}
-    .sortBox{width:1184px;margin:16px auto;box-sizing:border-box;text-align:center;background:#FFFFFF;position: relative;}
+    .sortBox{width:1184px;margin:16px auto;box-sizing:border-box;text-align:center;background:#FFFFFF;position: relative;border-radius: 8px;overflow: hidden;}
     .sortBox li{display:inline-block;cursor:pointer;width:128px;height:64px;line-height:64px;font-size:16px;background:#FFFFFF;color:#93979F;position:relative;float: left;border-right: 1px solid #F7F7F7;}
     .sortBox li.on,.sortBox li.up,.sortBox li.down{background:#FFE6DC;color:#FF5B00}
     .sortBox li:before,.sortBox li:after{position:absolute;right:35px;content:'';width:0;height:0;border-style:solid}
@@ -42,7 +42,7 @@ li{list-style:none}
     .sortBox li.down:after{border-top-color:#FF5B00}
     .sortBox li.down:before{border-bottom-color:#FF5B00;opacity:.3}
     .sortBox .sortBox-checked{width: 200px;height: 64px;position: absolute;top: 0;right: 0;box-sizing: border-box;padding: 18px;}
-    .sortBox-checked .sortBox-new{float: right;height: 28px;line-height: 16px;box-sizing: border-box;padding: 6px 0;display: flex;cursor: pointer;margin-right: 10px;}
+    .sortBox-checked .sortBox-new{float: right;height: 28px;color: #666666;line-height: 16px;box-sizing: border-box;padding: 6px 0;display: flex;cursor: pointer;margin-right: 10px;}
     .sortBox-checked .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;margin-right: 6px;}
     .sortBox-checked .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
 

src/main/resources/static/css/supplier-center/dashboard.css

@@ -4,7 +4,7 @@
      .pageContent form {width: 498px;margin: 0 auto;padding: 50px 0;}
      /**/
      #dashboard li {list-style: none;}
-     .information {background: #fff;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+     .information {background: #fff;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
      .head {width: 80px;height: 80px;border-radius: 2px;margin-right: 10px;position: relative;cursor: pointer;display: inline-block;vertical-align: top;}
      .zhuti {font-size: 16px;color: #22272e;padding: 25px 236px 10px}
      .info_main h3{display: inline-block;}
@@ -19,7 +19,7 @@
      .activeright p{text-align: left;line-height: 20px;font-size: 12px}
      .activeimg img{width: 100%;height: 100%}
      .username {color: #627386;font-size: 12px;margin: 10px 0;}
-     .perfect {width: 64px;height: 22px;background-color: #627386;border-radius: 2px;color: #ffffff;font-size: 12px;line-height: 22px;text-align: center;display: inline-block;cursor: pointer}
+     .perfect {height: 22px;padding: 0 10px;background-color: #627386;border-radius: 11px;color: #ffffff;font-size: 12px;line-height: 22px;text-align: center;display: inline-block;cursor: pointer}
      .ziliao {font-size: 14px;color: #22272e;}
      .ziliao span {color: #f94b4b;}
      .message {float: right;width: 30px;height: 30px;cursor: pointer;margin-right: 10px}
@@ -31,9 +31,9 @@
      .product-title .product-sel{float: right;height: 100%;}
      .product-title .product-sel span{}
      .product-title .product-sel .state{width: 160px;}
-     .product ul {height: 50px;line-height: 80px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 15px;}
+     .product ul {height: 50px;line-height: 80px;border-radius: 8px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 15px;}
      .product li {height: 100%; display: inline-block;margin-right: 20px;width: 110px;text-align: center;color: #333333;position: relative;cursor: pointer;}
-     .product .product-ul {height: 50px;line-height: 80px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 15px;}
+     .product .product-ul {height: 50px;line-height: 80px;border-radius: 8px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 15px;}
      .product .product-li {width: 110px;height: 100%; display: block;margin-right: 20px;text-align: center;color: #333333;position: relative;cursor: pointer;}
      .product .product-li .product-li-icon{ width:100%;height: 26px;float: left;}
      .product .product-li .icon{ width: 26px;height: 26px;margin: 0 auto; display: block;position: relative;}
@@ -46,11 +46,11 @@
      .rank_top span {color: #627386;font-size: 16px;}
      .sales-ranke ul li {display: inline-block;width: 10%;}
      .sales-ranke ul li:nth-child(2) {width: 79%;}
-     .sales-ranke {background: #fff;color: #627386;padding: 10px 22px}
+     .sales-ranke {background: #fff;color: #627386;padding: 10px 22px;border-radius: 8px;}
      .sales-ranke ul {padding: 10px 0;border-bottom: 1px solid #e2e7ef}
      .rank_top {padding: 10px 22px;}
      .file_img {width: 80px;height: 80px;font-size: 999px;opacity: 0;top: 0px;left: 0px;position: absolute}
-     .shop-ranke {background: #fff;padding-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+     .shop-ranke {background: #fff;padding-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 0 0 8px 8px;}
      .shop-ranke ul li {float: left;height: 70px;width: 10%;color: #FF5B00;line-height: 70px}
      .shop-ranke ul {padding: 5px 15px;overflow: hidden;}
      .shop-ranke ul li:nth-child(2) {width: 79%;}
@@ -67,7 +67,7 @@
      .Statistics {margin-top: 20px;}
      .Stati_top p {font-size: 16px;color: #333333;display: inline-block;}
      .Stati_top span {font-size: 12px;color: #999999;}
-     #StatisticsEacths {width: 968px;height: 440px;box-sizing: border-box;background: #FFF;padding:20px 0;margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+     #StatisticsEacths {width: 968px;height: 440px;border-radius: 8px;box-sizing: border-box;background: #FFF;padding:20px 0;margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
      .Statistics .Stati_top{padding: 0 22px}
      .mainContent p{    display: inline-block;margin-right: 10px;}
  }

src/main/resources/static/css/supplier-center/operation/list.css

@@ -1,101 +1,101 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    .pageWrap{width: 100%;}
-    .navLayout {min-height: 410px;}
-    .crumbs{padding-left: 220px;padding-right: 20px;}
-    .navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF}
-    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
-    .navLayout .navList .tab{display:block;color:#22272e;position:relative;cursor: pointer;}
-    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
-    .navLayout .navList .con{position:relative;}
-    .navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
-    .navLayout .navList .con:before{top:0}
-    .navLayout .navList .con:after{bottom:0}
-    .navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
-    .navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
-    .navLayout .navList.on .tab{color:#FF5B00}
-    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
-    /*个人中心右侧*/
-    .navLayout .right{float:right;width:968px}
-    .order-header{width: 100%;height: 78px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .order-header .header-bt {width: 100%;height: 38px;float: left;}
-    .order-header .header-bt .header-search{height: 38px;float: left;}
-    .order-header .header-bt .search{height: 38px;float: left;margin-right: 15px;}
-    .order-header .header-bt .search .label{display: inline-block;float: left;height: 38px;line-height:38px;font-size: 12px;color: #627386;margin-right: 15px;}
-    .order-header .header-bt .search .search-input{width: 210px;box-sizing: border-box;padding: 0 10px;font-size: 12px;line-height: 36px;border: 1px solid #b8bfca;border-radius: 2px; }
-    .order-header .header-bt .header-button{height: 38px;float: right;}
-    .order-header .header-bt .header-button .btn-serch{width: 90px;height: 36px;display: block;background-color: #FF5B00;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FFFFFF;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
-    .order-header .header-bt .header-button .btn-add{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
-
-    .container{width: 100%;height:auto;box-sizing: border-box;margin-top: 10px;}
-    .container .empty{background-color:#FFF;}
-    .container .section{width: 100%;height:auto;padding-bottom: 16px;box-sizing: border-box;padding:0 16px 16px 16px;background-color: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .container .section .title{width: 100%;height: 54px;border-bottom: 1px solid #e2e7ef;}
-    .container .section .title .td{height: 54px;font-size: 14px;color:#627386;float: left;line-height:54px;text-align: left;}
-    .container .section .title .td.td-1{width:10%;}
-    .container .section .title .td.td-2{width:12%;text-align: center;}
-    .container .section .title .td.td-3{width:10%;text-align: center;}
-    .container .section .title .td.td-4{width:9%;text-align: center;}
-    .container .section .title .td.td-5{width:9%;text-align: center;}
-    .container .section .title .td.td-6{width:12%;text-align: center;}
-    .container .section .title .td.td-7{width:11%;text-align: center;}
-    .container .section .title .td.td-8{width:11%;text-align: center;}
-    .container .section .title .td.td-9{width:16%;text-align: center;}
-    .container .section .content{width: 100%;height: auto;padding: 16px 0 0 0;}
-    .container .section .list{width: 100%;height: 64px;}
-    .container .section .list .td{height: 64px;font-size: 14px;color:#22272e;float: left;line-height:50px;text-align: left;box-sizing: border-box;padding: 7px 0;border-bottom: 1px solid #e2e7ef;}
-    .container .section .list .td p{line-height: 25px;width: 100%;float: left;}
-    .container .section .list .td.td-1{width:10%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
-    .container .section .list .td.td-2{width:12%;text-align: center;}
-    .container .section .list .td.td-3{width:10%;text-align: center;}
-    .container .section .list .td.td-4{width:9%;text-align: center;}
-    .container .section .list .td.td-5{width:9%;text-align: center;}
-    .container .section .list .td.td-6{width:12%;text-align: center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
-    .container .section .list .td.td-7{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
-    .container .section .list .td.td-8{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
-    .container .section .list .td.td-9{width:16%;text-align: center;}
-    .container .section .list .td.td-9{width:16%;text-align: center;}
-    .container .section .list .td.td-9 a{margin: 0 5px;}
-    .container .section .list .td.td-9 .upd{color: #1890f9;}
-    .container .section .list .td.td-9 .del{color: #f94b4b;}
-    input::placeholder{color: #9aa5b5}
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .navLayout{border-top:1px solid #F5F5F5;border-bottom:1px solid #F5F5F5;}
-    .navLayout .crumbs{display:none;}
-    .navLayout .left{width:29.3vw;border-right:1px solid #F5F5F5;line-height:11.8vw;white-space:nowrap;text-indent:3.3vw;font-size:3.4vw;}
-    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5;font-size: 3.7vw;}
-    .navLayout .navList .tab{display:block;color:#22272e;position:relative}
-    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:1.4vw;top:1vw;transform:rotate(90deg);width:6.4vw;height:6.4vw;line-height:6.4vw;text-align:center;color:#bec2c9}
-    .navLayout .navList .con a{display:block;color:#9aa5b5;}
-    .navLayout .navList.on .tab:before{top:4vw;transform:rotate(270deg);color:#FF5B00}
-    .navLayout .navList.on .tab{color:#FF5B00}
-    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
-    .order-header{padding: 2.7vw 4vw;background: #fff}
-    .search{width:100%;height: 11.8vw;border: 1px solid #b8bfca;margin-bottom: 2.7vw;line-height: 11.8vw;}
-    .search span.label{padding-left: 2.7vw;color: #627386}
-    .search-input {height: -webkit-fill-available;width: 70vw;border: none;border-radius: .27vw}
-    input::placeholder{color: #9aa5b5}
-    .header-button{width: 35.3vw;height: 11.2vw;border: 1px solid #FF5B00;text-align: center;line-height: 11.2vw;background: #ffe6dc;margin: 2.7vw auto}
-    .header-button >a{color: #FF5B00;font-size: 3.7vw}
-    .section .list{margin: 2.7vw 0;background: #fff;padding: 2.7vw 3.3vw;}
-    .list div span{display: inline-block;line-height: 6.4vw;color: #9aa5b5;}
-    .list-one span{width: 35%;font-size: 3.2vw}
-    .list div span p{color: #22272e;font-size: 3.6vw}
-    .list-one span:last-child{width: 27%}
-    .operat{float: right}
-    .list div{margin-bottom: 1.7vw}
-    .operat  a{width: 22.4vw;height: 9.6vw;line-height: 9.6vw;text-align: center;display: inline-block; border-radius: 6.4vw;
-        font-size: 3.4vw;margin-left: 2.7vw}
-    .operat  a.del{border: 1px solid #f94b4b;background: #ffd8d8;color: #f94b4b;}
-    .operat  a.upd{border: 1px solid #1890f9;background: #e0f1ff;color: #1890f9;width: 23vw}
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    .pageWrap{width: 100%;}
+    .navLayout {min-height: 410px;}
+    .crumbs{padding-left: 220px;padding-right: 20px;}
+    .navLayout .left{float:left;width:200px;line-height:50px;white-space:nowrap;text-indent:16px;font-size:16px;background:#FFF}
+    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5}
+    .navLayout .navList .tab{display:block;color:#22272e;position:relative;cursor: pointer;}
+    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:10px;top:0;transform:rotate(90deg);width:32px;height:32px;line-height:32px;text-align:center;color:#bec2c9}
+    .navLayout .navList .con{position:relative;}
+    .navLayout .navList .con:before,.navLayout .navList .con:after{content:'';position:absolute;width:168px;border-top:1px solid #f5f5f5;left:16px}
+    .navLayout .navList .con:before{top:0}
+    .navLayout .navList .con:after{bottom:0}
+    .navLayout .navList .con a{display:block;font-size:14px;color:#627386;text-indent:32px}
+    .navLayout .navList.on .tab:before{top:18px;transform:rotate(270deg);color:#FF5B00}
+    .navLayout .navList.on .tab{color:#FF5B00}
+    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
+    /*个人中心右侧*/
+    .navLayout .right{float:right;width:968px}
+    .order-header{width: 100%;height: 78px;border-radius: 8px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .order-header .header-bt {width: 100%;height: 38px;float: left;}
+    .order-header .header-bt .header-search{height: 38px;float: left;}
+    .order-header .header-bt .search{height: 38px;float: left;margin-right: 15px;}
+    .order-header .header-bt .search .label{display: inline-block;float: left;height: 38px;line-height:38px;font-size: 12px;color: #627386;margin-right: 15px;}
+    .order-header .header-bt .search .search-input{width: 210px;box-sizing: border-box;padding: 0 10px;font-size: 12px;line-height: 36px;border: 1px solid #b8bfca;border-radius:18px; }
+    .order-header .header-bt .header-button{height: 38px;float: right;}
+    .order-header .header-bt .header-button .btn-serch{width: 90px;height: 36px;display: block;background-color: #FF5B00;border-radius: 18px;border: solid 1px #FF5B00;font-size: 14px;color: #FFFFFF;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
+    .order-header .header-bt .header-button .btn-add{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 18px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
+
+    .container{width: 100%;height:auto;box-sizing: border-box;margin-top: 10px;}
+    .container .empty{background-color:#FFF;border-radius: 8px;}
+    .container .section{width: 100%;height:auto;padding-bottom: 16px;box-sizing: border-box;padding:0 16px 16px 16px;background-color: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .container .section .title{width: 100%;height: 54px;border-bottom: 1px solid #e2e7ef;}
+    .container .section .title .td{height: 54px;font-size: 14px;color:#627386;float: left;line-height:54px;text-align: left;}
+    .container .section .title .td.td-1{width:10%;}
+    .container .section .title .td.td-2{width:12%;text-align: center;}
+    .container .section .title .td.td-3{width:10%;text-align: center;}
+    .container .section .title .td.td-4{width:9%;text-align: center;}
+    .container .section .title .td.td-5{width:9%;text-align: center;}
+    .container .section .title .td.td-6{width:12%;text-align: center;}
+    .container .section .title .td.td-7{width:11%;text-align: center;}
+    .container .section .title .td.td-8{width:11%;text-align: center;}
+    .container .section .title .td.td-9{width:16%;text-align: center;}
+    .container .section .content{width: 100%;height: auto;padding: 16px 0 0 0;}
+    .container .section .list{width: 100%;height: 64px;}
+    .container .section .list .td{height: 64px;font-size: 14px;color:#22272e;float: left;line-height:50px;text-align: left;box-sizing: border-box;padding: 7px 0;border-bottom: 1px solid #e2e7ef;}
+    .container .section .list .td p{line-height: 25px;width: 100%;float: left;}
+    .container .section .list .td.td-1{width:10%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
+    .container .section .list .td.td-2{width:12%;text-align: center;}
+    .container .section .list .td.td-3{width:10%;text-align: center;}
+    .container .section .list .td.td-4{width:9%;text-align: center;}
+    .container .section .list .td.td-5{width:9%;text-align: center;}
+    .container .section .list .td.td-6{width:12%;text-align: center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
+    .container .section .list .td.td-7{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
+    .container .section .list .td.td-8{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
+    .container .section .list .td.td-9{width:16%;text-align: center;}
+    .container .section .list .td.td-9{width:16%;text-align: center;}
+    .container .section .list .td.td-9 a{margin: 0 5px;}
+    .container .section .list .td.td-9 .upd{color: #1890f9;}
+    .container .section .list .td.td-9 .del{color: #f94b4b;}
+    input::placeholder{color: #9aa5b5}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .navLayout{border-top:1px solid #F5F5F5;border-bottom:1px solid #F5F5F5;}
+    .navLayout .crumbs{display:none;}
+    .navLayout .left{width:29.3vw;border-right:1px solid #F5F5F5;line-height:11.8vw;white-space:nowrap;text-indent:3.3vw;font-size:3.4vw;}
+    .navLayout .left .title{color:#22272e;font-weight:bold;border-bottom:1px solid #f5f5f5;font-size: 3.7vw;}
+    .navLayout .navList .tab{display:block;color:#22272e;position:relative}
+    .navLayout .navList .tab:before{content:'\276F';font-weight:normal;position:absolute;right:1.4vw;top:1vw;transform:rotate(90deg);width:6.4vw;height:6.4vw;line-height:6.4vw;text-align:center;color:#bec2c9}
+    .navLayout .navList .con a{display:block;color:#9aa5b5;}
+    .navLayout .navList.on .tab:before{top:4vw;transform:rotate(270deg);color:#FF5B00}
+    .navLayout .navList.on .tab{color:#FF5B00}
+    .navLayout .navList .con a.on{color:#FF5B00;background-color:#ffe6dc}
+    .order-header{padding: 2.7vw 4vw;background: #fff}
+    .search{width:100%;height: 11.8vw;border: 1px solid #b8bfca;margin-bottom: 2.7vw;line-height: 11.8vw;}
+    .search span.label{padding-left: 2.7vw;color: #627386}
+    .search-input {height: -webkit-fill-available;width: 70vw;border: none;border-radius: .27vw}
+    input::placeholder{color: #9aa5b5}
+    .header-button{width: 35.3vw;height: 11.2vw;border: 1px solid #FF5B00;text-align: center;line-height: 11.2vw;background: #ffe6dc;margin: 2.7vw auto}
+    .header-button >a{color: #FF5B00;font-size: 3.7vw}
+    .section .list{margin: 2.7vw 0;background: #fff;padding: 2.7vw 3.3vw;}
+    .list div span{display: inline-block;line-height: 6.4vw;color: #9aa5b5;}
+    .list-one span{width: 35%;font-size: 3.2vw}
+    .list div span p{color: #22272e;font-size: 3.6vw}
+    .list-one span:last-child{width: 27%}
+    .operat{float: right}
+    .list div{margin-bottom: 1.7vw}
+    .operat  a{width: 22.4vw;height: 9.6vw;line-height: 9.6vw;text-align: center;display: inline-block; border-radius: 6.4vw;
+        font-size: 3.4vw;margin-left: 2.7vw}
+    .operat  a.del{border: 1px solid #f94b4b;background: #ffd8d8;color: #f94b4b;}
+    .operat  a.upd{border: 1px solid #1890f9;background: #e0f1ff;color: #1890f9;width: 23vw}
+}
+

src/main/resources/static/css/supplier-center/order/orderlist.css

@@ -1,6 +1,6 @@
 @media screen and (min-width:768px) {
     .crumbs{font-size: 16px;color: #22272e}
-    .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
+    .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
     .head-top>div {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
     .state {width: 158px !important;}
     .state.small{width: 170px;margin: 0 8px;}
@@ -34,7 +34,7 @@
     .userinfo{background-color: #f0f3f7;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 10px 20px;color: #627386;}
     .userinfo p{display: inline-block;margin: 10px 55px 10px 0;}
     .userinfo .blcak{color: #22272e;}
-    .empty{background: #fff;margin-top: 10px;}
+    .empty{background: #fff;margin-top: 10px;border-radius: 8px;}
     .navLayout{min-height: auto;}
     .pagination{width: 100%;margin-top: 10px;float: left; background: #FFFFFF;padding: 8px 20px;box-sizing: border-box;}
     .el-dialog-p{font-size: 14px;color: #22272E;line-height: 24px;margin-bottom: 10px;}

src/main/resources/static/css/supplier-center/order/settlement.css

@@ -1,60 +1,60 @@
- @media screen and (min-width:768px) {
-     table, td, th{border: none;}
-    .pageWrap{width: 968px;margin: auto;padding: 32px 0}
-    .crumbs{color: #22272e;font-size: 16px;}
-     .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
-     .head-top .form-row {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
-     .state {width: 158px !important;}
-     .state.small{width: 170px;margin: 0 8px;}
-     .head-top .form-row .time {width: 185px !important;}
-     input::placeholder{color: #9aa5b5;font-size: 12px;}
-     #newBtn div{height: 36px;border-radius: 2px;display: inline-block;text-align: center;cursor: pointer}
-     #newBtn{float: left;margin: 0;}
-    .query-btn{ width: 90px; height: 36px; background-color: #FF5B00;border-radius: 2px;text-align: center;color: #fff;line-height: 36px;cursor: pointer;float: left;margin: 0 5px;}
-    .main-content{padding: 0;background: #fff; margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
-    .main-title{height: 55px;line-height: 55px;border-bottom: solid 1px #e2e7ef;color: #627386;}
-    .main-title li{list-style: none;display: inline-block;width: 10%; text-align: center}
-    .main-title li.samewidth{width: 15%;}
-    .main-title li:nth-child(4){width: 20%}
-    .mentlist ul li{list-style: none;display: inline-block;font-size: 12px;text-align: center;width: 10%;vertical-align: middle; line-height: 20px;color: #22272e;}
-    .mentlist ul{padding: 10px 0;margin-bottom: 30px}
-    .mentlist li.samewidth{width: 15%;}
-    .mentlist li:nth-child(4){width: 20%;vertical-align: middle; word-break: break-all;overflow: hidden;text-overflow: ellipsis;display: -webkit-inline-box;
-    -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
-    .samewidth a{text-decoration: underline;color: #1890f9;}
-    .status-red{color: #f94b4b;}
-    .status-blue{color: #1890f9;}
-    .status-yellow{color: #f9a94b;}
-    .air{position: relative;min-height: 600px}
-    .air img{position: absolute; top: 0; bottom: 0; left: 0; right: 0;margin: auto; width: 221px;height: 180px}
-    .empty{background: #fff;margin-top: 10px;}
-    .navLayout{min-height: auto;}
-    ::-webkit-scrollbar{ height: 6px;}
-    .pagination{width: 100%;margin-top: 10px;background: #FFFFFF;padding: 8px 20px;box-sizing: border-box;}
- }
-
-/* 移动*/
-
-@media screen and (max-width: 768px){
-    table, td, th{border: none;}
-    .head-top{padding: 3vw 0;background: #fff;}
-    .head-top .form-row{margin:1.5vw 0;color: #627386;float: left;width: 50%;}
-    .head-top .form-row.time{width: 100%;box-sizing: border-box;padding: 0 2vw;}
-    .state {width: 92% !important;margin: 0 2vw;}
-    .head-top .form-row .time {width: 47.2% !important;}
-    #newBtn{float: left;margin: 2vw;}
-    .main-content{padding-bottom: 15vw;}
-    .content-list .list{padding: 3.3vw;background: #fff;margin: 2.7vw 0}
-    .content-list div div{margin: 2.7vw 0}
-    .content-list span{color: #9aa5b5;font-size: 3.2vw;line-height: 6.4vw}
-    .content-list p{color: #22272e;font-size: 3.4vw}
-    .order-name p{width: 89vw;overflow: hidden;display: block;text-overflow: ellipsis;white-space: nowrap}
-    .order-price span,.order-info span{display: inline-block;width: 28%;}
-    .order-info span:nth-child(3){width: 41%}
-    .OrderNo p{color: #FF5B00}
-    .content-list .status-red{color: #f94b4b;}
-    .content-list .status-blue{color: #1890f9;}
-    .content-list .status-yellow{color: #f9a94b;}
-    footer{display: none;}
-    .pagination{width: 100%;min-height: 2vw;position: fixed;bottom: 0;left: 0;background: #FFFFFF;z-index: 99;padding: 2vw;box-sizing: border-box;}
-}
+ @media screen and (min-width:768px) {
+     table, td, th{border: none;}
+    .pageWrap{width: 968px;margin: auto;padding: 32px 0}
+    .crumbs{color: #22272e;font-size: 16px;}
+     .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
+     .head-top .form-row {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
+     .state {width: 158px !important;}
+     .state.small{width: 170px;margin: 0 8px;}
+     .head-top .form-row .time {width: 185px !important;}
+     input::placeholder{color: #9aa5b5;font-size: 12px;}
+     #newBtn div{height: 36px;border-radius: 2px;display: inline-block;text-align: center;cursor: pointer}
+     #newBtn{float: left;margin: 0;}
+    .query-btn{ width: 90px; height: 36px; background-color: #FF5B00;border-radius: 2px;text-align: center;color: #fff;line-height: 36px;cursor: pointer;float: left;margin: 0 5px;}
+    .main-content{padding: 0;background: #fff; margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
+    .main-title{height: 55px;line-height: 55px;border-bottom: solid 1px #e2e7ef;color: #627386;}
+    .main-title li{list-style: none;display: inline-block;width: 10%; text-align: center}
+    .main-title li.samewidth{width: 15%;}
+    .main-title li:nth-child(4){width: 20%}
+    .mentlist ul li{list-style: none;display: inline-block;font-size: 12px;text-align: center;width: 10%;vertical-align: middle; line-height: 20px;color: #22272e;}
+    .mentlist ul{padding: 10px 0;margin-bottom: 30px}
+    .mentlist li.samewidth{width: 15%;}
+    .mentlist li:nth-child(4){width: 20%;vertical-align: middle; word-break: break-all;overflow: hidden;text-overflow: ellipsis;display: -webkit-inline-box;
+    -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
+    .samewidth a{text-decoration: underline;color: #1890f9;}
+    .status-red{color: #f94b4b;}
+    .status-blue{color: #1890f9;}
+    .status-yellow{color: #f9a94b;}
+    .air{position: relative;min-height: 600px}
+    .air img{position: absolute; top: 0; bottom: 0; left: 0; right: 0;margin: auto; width: 221px;height: 180px}
+    .empty{background: #fff;margin-top: 10px;border-radius: 8px;}
+    .navLayout{min-height: auto;}
+    ::-webkit-scrollbar{ height: 6px;}
+    .pagination{width: 100%;margin-top: 10px;background: #FFFFFF;padding: 8px 20px;box-sizing: border-box;border-radius: 8px;}
+ }
+
+/* 移动*/
+
+@media screen and (max-width: 768px){
+    table, td, th{border: none;}
+    .head-top{padding: 3vw 0;background: #fff;}
+    .head-top .form-row{margin:1.5vw 0;color: #627386;float: left;width: 50%;}
+    .head-top .form-row.time{width: 100%;box-sizing: border-box;padding: 0 2vw;}
+    .state {width: 92% !important;margin: 0 2vw;}
+    .head-top .form-row .time {width: 47.2% !important;}
+    #newBtn{float: left;margin: 2vw;}
+    .main-content{padding-bottom: 15vw;}
+    .content-list .list{padding: 3.3vw;background: #fff;margin: 2.7vw 0}
+    .content-list div div{margin: 2.7vw 0}
+    .content-list span{color: #9aa5b5;font-size: 3.2vw;line-height: 6.4vw}
+    .content-list p{color: #22272e;font-size: 3.4vw}
+    .order-name p{width: 89vw;overflow: hidden;display: block;text-overflow: ellipsis;white-space: nowrap}
+    .order-price span,.order-info span{display: inline-block;width: 28%;}
+    .order-info span:nth-child(3){width: 41%}
+    .OrderNo p{color: #FF5B00}
+    .content-list .status-red{color: #f94b4b;}
+    .content-list .status-blue{color: #1890f9;}
+    .content-list .status-yellow{color: #f9a94b;}
+    footer{display: none;}
+    .pagination{width: 100%;min-height: 2vw;position: fixed;bottom: 0;left: 0;background: #FFFFFF;z-index: 99;padding: 2vw;box-sizing: border-box;}
+}

src/main/resources/static/css/supplier-center/shop/goods.css

@@ -4,13 +4,13 @@ li{list-style: none}
     input::placeholder{color: #9aa5b5;font-size: 12px;}
     textarea::placeholder{color: #9aa5b5;}
     .crumbs{color: #22272e;font-size: 16px;}
-    .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
+    .head-top{overflow: hidden;background: #fff;padding:17px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
     .head-top>div {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
     .state {width: 158px !important;}
     .state.small{width: 170px;margin: 0 0;}
     #newBtn div{height: 36px;border-radius: 2px;display: inline-block;text-align: center;cursor: pointer}
     #newBtn{float: left;margin: 0}
-    .goods-main{width: 100%; height: auto; float: left; margin:10px 0;background: #fff;}
+    .goods-main{width: 100%; height: auto; float: left; margin:10px 0;background: #fff;border-radius: 8px;overflow: hidden;}
     .goods-tips{width: 100%;box-sizing: border-box;margin-top: 14px;}
     .goods-tips .end-tips{width:100%;height: 32px;background: #FFF3F3;border-radius: 2px;line-height: 32px;color: #F94B4B;font-size: 12px;box-sizing: border-box;padding: 0 10px;}
     .goods-tips .end-tips .tips{display:inline-block;width:32px;height:32px;line-height:32px;box-sizing:border-box;position:relative;color:#333;font-size:14px;text-align:center;white-space:nowrap}
@@ -21,7 +21,7 @@ li{list-style: none}
     .empty{background: #fff;margin-top: 10px;}
     .navLayout{min-height: auto;}
     ::-webkit-scrollbar{ height: 6px;}
-    .pagination{width: 100%;margin-top: 10px;float: left; background: #FFFFFF;padding: 8px 20px;box-sizing: border-box;}
+    .pagination{width: 100%;margin-top: 10px;float: left; background: #FFFFFF;padding: 8px 20px;box-sizing: border-box;border-radius: 8px;}
     .el-button--primary.is-plain{background:#FFE6DC !important;color: #FF5B00 !important;border-color: #FF5B00 !important;}
  }
 

src/main/resources/static/css/supplier-center/shop/release.css

@@ -1,333 +1,333 @@
-input::-webkit-outer-spin-button,
-input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-}
-input[type="number"]{
-    -moz-appearance: textfield;
-}
-div{box-sizing: border-box;}
-@media screen and (min-width:768px) {
-    .container{width: 100%;height: auto;box-sizing: border-box;background-color: #FFFFFF;padding: 0 16px;}
-    .release-stepbox{width: 100%;box-sizing: border-box;    line-height: 60px; }
-    .release-stepbox .stepSpan{float: left;padding: 0 15px;margin-right: 80px;position: relative;}
-    .release-stepbox .stepSpan:last-child{margin-right: 0;}
-    .release-stepbox .stepSpan p{font-size: 16px;line-height: 24px;color: #9aa5b5;text-align: center;display: inline-block}
-    .release-stepbox .stepSpan p span{display: inline-block;width: 24px;height: 24px;font-size: 14px;text-align: center;line-height: 24px;background: #9aa5b5;color: #FFFFFF;border-radius: 40px;margin-top: 5px;}
-    .release-stepbox .stepSpan.active  p{color:#FF5B00 ;}
-    .release-stepbox .stepSpan.active p span{background: #FF5B00;}
-    .release-container{width: 100%;height: auto;border-top: 1px solid #e2e7ef;padding:20px 0;opacity: 0;}
-    .release-container.active{opacity: 1;}
-    .release-main-container{width: 100%;padding:0 168px;box-sizing: border-box;}
-    .release-main-container.new{width: 100%;padding: 0 24px;box-sizing: border-box;}
-    .release-main-container.new .release-image{width: 100%;height: auto;}
-    .release-main-container.new .release-image img{width: 100%;height: auto;}
-    .release-from{width: 100%;height:auto;margin-bottom: 15px;line-height: 32px;font-size: 14px;color: #333;}
-    .release-from.text p .em{color: #FF5B00;}
-    .release-from.none{margin-bottom: 0;}
-    .release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;color: #627386;font-weight: bold;position: relative;}
-    .release-from .release-label.active{ font-weight: normal;color: #FF5B00; }
-    .release-from .release-label span{color: #FF0000;}
-    .release-from .release-label .release-label-btn{display: block;position: absolute;right: 0;top: 0;line-height: 32px;font-weight: normal;color: #2398FF;cursor: pointer;}
-    .release-from .release-from-tr{width: 100%;height: 32px;float: left;}
-    .release-from .release-from-tr .tr-labe{width: 88px;height: 32px;float: left;text-align: left;font-size: 14px;color: #627386;line-height: 32px;margin-right: 14px;}
-    .release-from .release-from-tr .tr-labe .star{color: #F94B4B;}
-    .release-from .release-from-tr .tr-labe.none{margin-right: 0;}
-    .release-from .release-from-td{width: 100%;height: auto;float: left;margin: 8px 0;position: relative;}
-    .release-from .release-from-td .tr-labe{width: 88px;height: 36px;float: left;text-align: left;margin-right: 14px;}
-    .release-from .release-from-td .tr-labe.none{margin-right: 0;}
-    .release-from .release-from-td .tr-labe .tr-input{width: 100%;height: 36px;font-size: 14px;color: #627386;line-height: 36px;box-sizing: border-box;border: 1px solid #B8BFCA;padding: 0 5px;}
-    .release-from .release-from-td .tr-icon{width: 36px;height: 36px;box-sizing: border-box;padding: 4px;float: left;margin-left: 15px; cursor: pointer;}
-    .release-from .release-from-td .tr-icon .add:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -51px -1px;margin-right: 2px;}
-    .release-from .release-from-td .tr-icon .del:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -77px -1px;margin-right: 2px;}
-    .release-from .release-input{width: 100%;height: auto;float: left;position: relative;}
-    .release-from .release-input.expen{margin-top:10px;}
-    .release-from .release-input.expen .input{padding-left:30px;}
-    .release-from .release-input.expen .span{width:30px;height:36px;display:block;position:absolute;top:0;left:0;text-align:center;line-height:36px;font-size:14px;color:#22272e;}
-    .release-from .release-input .input{width: 100%;height: 36px;padding: 0 10px;border-radius: 2px;border: 1px solid #b8bfca;float: left;font-size: 13px;box-sizing: border-box;}
-    .release-from .release-input .input.price{padding-left: 30px;}
-    .release-from .release-input .yang{width: 30px;height: 36px;position: absolute;left: 0;top: 0;line-height: 36px;text-align: center;}
-    .release-from .release-input .unit{height: 36px;padding: 0 10px;position: absolute;right: 0;top: 0;line-height: 36px;text-align: right;font-size: 14px;}
-    .release-from .release-input .tax{display: block;float: left;}
-    .release-from .release-input .mg{margin-left: 10px;}
-    .release-from .release-input .edit-btn{display: block;float: left;margin-left: 20px;color: #FF5B00;text-decoration: underline;}
-    .release-from .release-input .input.keyword{width: 243px;margin:0 10px 10px 0;}
-    .release-from .release-input .p{display: block;position: absolute;right: 0;bottom: 0;line-height: 32px;font-size: 12px;color: #FF5B00;text-decoration: underline;}
-    .release-from .release-input .add{display: inline-block;width: 100%;height: 20px;float: right;line-height: 20px;font-size: 14px;color: #FF5B00;text-align: right;}
-    .release-from .release-input .add span{font-size: 20px;}
-    .release-from .release-input .input.keyword:nth-child(2n){margin-right: 0;}
-    .release-from .release-input .release-param{width:100%;height: auto;padding: 0 10px;border: 1px solid #b8bfca;float: left;margin-bottom: 10px;border-radius: 2px;position: relative;}
-    .release-from .release-input .release-param .param-input{width: 100%;height: 36px;border: none;font-size: 13px;line-height: 36px;}
-    .release-from .release-input .release-param .param-input:first-child{border-bottom: 1px solid #e2e7ef;}
-    .release-from .release-input .release-param .del-btn{display: block;line-height: 64px;color: #FF0000;font-size: 14px;position: absolute;    top: -18px;right: 0px;}
-    .release-from .release-input .release-opt{width: 100%;height: 155px;border: 1px solid #e4e7ed;border-radius: 2px;background-color: #fff;box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);overflow: hidden;overflow-y: scroll;box-sizing: border-box;margin: 5px 0;padding: 10px 0;z-index: 88;position: absolute;top: 31px;left: 0;}
-    .release-from .release-input .textarea{width: 420px;height: 150px;position: relative;padding: 10px;overflow: hidden;}
-    .release-from .release-input .textarea .limit-text{position: absolute;right: 15px;bottom: 10px;line-height: 30px;font-size:13px ;color: #D0D0D0;}
-    .release-from .release-input .textarea .limit-text .red{color:#FF5B00 ;}
-    .release-from .release-input .textarea textarea{width: 100%;height: 100%;border: 1px solid #EBEBEB;border-radius: 2px;resize: none;padding: 10px;font-size: 13px;color: #333;}
-    .release-from .release-input .release-opt .opt-item{font-size: 14px;padding: 0 10px;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #606266;height: 34px;line-height: 34px;box-sizing: border-box;cursor: pointer;}
-    .release-from .release-input .release-opt .opt-item:hover {background-color: #F5E7E0;color: #FF5B00;}
-    .release-from .release-input.upload{height: 78px;}
-    .release-from .release-input.upload.image{height: auto;width: 500px;}
-    .release-from .release-input.Editor{width: 600px;min-height: 540px;margin: 0;}
-    .release-from  .upload-file{width: 90px;height: 90px;border-radius: 2px;position: relative;float: left;margin-right: 10px;margin-bottom: 10px;cursor: pointer;}
-    .release-from  .upload-file .icon-del:before{width: 16px;height: 16px;cursor: pointer; background-position: -118px -140px;position: absolute;top: 0;right: 0}
-    .release-from  .upload-file .icon-add{width:100% ;height: 100%;background: url("/img/account/icon-addimg.svg");display: block}
-    .release-from  .upload-file .input-file{width: 90px;height: 90px;opacity: 0;cursor: pointer;position: absolute;top: 0}
-    .release-from  .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .release-from .release-input .input.tags{width: 390px;}
-    .release-from .release-input .add-btn{width: 90px;height: 34px;border-radius: 2px;border: 1px solid #FF5B00;background:#ffe6dc;float: left;margin-left: 15px;text-align: center;line-height: 34px;font-size: 14px;color:#FF5B00 ;cursor: pointer;}
-    .release-from .release-input .add-btn.active{background-color: #ffe6dc;color: #FF5B00;}
-    .release-from .release-tips{width: 100%;color: #FF0000;float: left;}
-    .release-from.text{height: auto;}
-    .release-from .text{width: 303px;line-height: 32px;font-size: 12px;color: #FF5B00;}
-    .release-from .tags-main{width: 100%;height: auto;}
-    .release-from .tags-main .item-tags{padding: 0 10px;line-height: 28px;background: #FFF3E5;text-align: center;font-size:14px;color:  #333333;margin: 5px;border-radius: 2px;float: left;position: relative;}
-    .release-from .tags-main .item-tags .del-tags{width: 16px;height: 16px;display: block;background: url("/img/base/icon.png") no-repeat;background-position: -175px -300px;position: absolute;right: -5px;top: -5px;cursor: pointer;}
-    .release-from .select-main{padding: 0 10px;cursor: pointer;width: 155px;height: 36px;border: 1px solid #b8bfca;border-radius: 2px;line-height: 32px;color: #333;font-size: 14px;margin-right: 15px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;position: relative;}
-    .release-from .select-main:last-child{margin-right: 0;}
-    .release-from .select-main.border{border: 1px solid #FF5B00;}
-    .release-from .select-main .select{cursor: pointer;width: 135px;height: 36px;line-height: 36px;color: #22272e;font-size: 12px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;border: none;background: url("/img/supplier/Retract.png") no-repeat scroll right 0px center transparent;}
-    .release-from .select-main .option-main{width: 100%;min-height:50px;max-height: 200px;border: 1px solid #e4e7ed;border-radius: 2px;background-color: #fff;box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);overflow: hidden;overflow-y: scroll;box-sizing: border-box;margin: 5px 0;padding: 10px 0;z-index: 88;position: absolute;top: 28px;left: 0;}
-    .release-from .select-main .option {font-size: 14px;padding: 0 20px;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #606266;height: 34px;line-height: 34px;box-sizing: border-box;cursor: pointer;}
-    .release-from .select-main .option:hover {background-color: #F5E7E0;color: #FF5B00;}
-    .release-from .from-button{width: fit-content;height: 70px;padding: 10px 0;}
-    .release-from .from-button.last{margin-left: 0;}
-    .release-from .from-button.last .btn{width: 153px;}
-    .release-from .from-button .btn{box-sizing: border-box;width: 232px;height: 50px;background-color: #FF5B00;box-shadow: 0px 3px 6px 0px rgba(249, 75, 75, 0.17);border-radius: 2px;display: block;line-height: 50px;text-align: center;float: left;margin-right: 6px;}
-    .release-from .from-button .btn.prev{border: 1px solid #FF5B00;background-color: #ffe6dc;color: #FF5B00;}
-    .release-from .from-button .btn.next{background-color: #FF5B00;color: #fff;}
-    .release-from .from-button .btn.eyes{background-color:#A69DFE;color: #fff;}
-    .release-main-tips{width: 100%;height: 60px;box-sizing: border-box;padding: 12px 168px;background: linear-gradient(90deg, #FFFFFF 0%, #FFEEE5 51%, #FFFFFF 100%);font-size: 12px;color: #FF5B00;line-height: 18px;}
-
-    /*预览*/
-    .preview-container{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,.5);z-index: 99999;display: none;}
-    .preview-container .preview-content{width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
-    .preview-container .preview-content img{border-radius: 4px;}
-
-    /*销售信息*/
-    input[type="radio"]{opacity:0;}
-
-    .release-from .release-input-add{width: 100%;margin-top: 10px;float: left;}
-    .release-from .release-input .release-props{width: 100%;height: 38px;}
-    .release-from .release-input .release-props .release-radio{width:150px;height:36px;margin-right:10px;line-height:34px;box-sizing:border-box;font-size:14px;text-align:center;display:inline-block}
-    .release-from .release-input .release-props .release-radio.second{width:100px;}
-    .release-from .release-input .release-props .release-radio input{display:none}
-    .release-from .release-input .release-props .release-radio i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:1px solid #b8bfca;color:#627386;}
-    .release-from .release-input .release-props .release-radio i:before{position:absolute;right:0;bottom:0;display:none;width:20px;height:20px;background-position:-208px -253px}
-    .release-from .release-input .release-props .release-radio input:checked + i{border-color:#FF5B00;color:#FF5B00}
-    .release-from .release-input .release-props .release-radio input:checked + i:before{display:block}
-    .release-from .release-input .release-props .release-select{width: 320px;float: left;}
-    .release-from .release-input .release-props .release-select-refresh{width: auto;float: left;color: #FFFFFF;font-size: 14px;text-align: center;line-height: 36px;margin: 0 15px;}
-    .release-from .release-input .release-props .release-select-all{width: 92px;float: left;}
-    .release-from .release-input .release-props .release-select-all a{width: 92px;height: 36px;box-sizing: border-box; background: #FFEBE4;border-radius: 2px 2px 2px 2px;opacity: 1;display: block;color: #FF5B00;font-size: 14px;line-height: 36px;text-align: center;border: 1px solid #FF5B00;}
-
-    .release-from .release-input .release-province{width: 100%;height: auto;margin-top: 20px;}
-    .release-from .release-input .release-province .province-item{line-height:26px;padding: 0 10px;text-align: center;font-size: 14px;color: #627386;background: #F0F3F7;border-radius: 2px;display: block;margin: 0 10px 10px 0;float: left;}
-    .release-from .release-input .release-province .province-item.active{background: #FF5B00;color: #FFF;}
-    .release-from .release-input .release-radios{ width:150px;height:38px;margin-right:10px;line-height:36px;box-sizing:border-box;font-size:14px;text-align:center;display:block;border: 1px solid #B8BFCA;position: relative;border-radius: 2px;float: left; }
-    .release-from .release-input .release-radios.active{border-color: #FF2A2A;color: #FF5B00;}
-    .release-from .release-input .release-radios.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
-
-        /*税率弹窗*/
-    .popup{width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;opacity: 0;}
-    .popup.active{opacity: 1;}
-    .popup-layer{-webkit-overflow-scrolling: touch;width: 338px;position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;background-color: #fff;-webkit-background-clip: content;border-radius: 2px;box-shadow: 1px 1px 50px rgba(0,0,0,.3);z-index: 1000;}
-    .popup-layer.bran{height: 330px;}
-    .popup-layer.edit{height: 153px;}
-    .popup-layer .popup-title{padding: 0 80px 0 20px;height: 42px;line-height: 42px;border-bottom: 1px solid #eee;font-size: 14px;color: #333;overflow: hidden;background-color: #F8F8F8;border-radius: 2px 2px 0 0;position: relative;}
-    .popup-title .popup-close{width: 16px;height: 16px;display: block;position: absolute;right: 10px;top: 13px;background-position: 1px -40px;cursor: pointer;}
-    .popup-layer .popup-content{padding: 13px;}
-    .popup-layer .popup-content .popup-from{height: auto;color: #999999;line-height: 32px;position: relative;}
-    .popup-layer .popup-content .popup-from input{width: 260px;height: 32px;border: 1px solid #EFEFEF;font-size: 14px;color: #333;padding: 0 10px;margin-left: 10px;box-sizing: border-box;}
-    .popup-layer .popup-content .popup-from span{display: inline-block;height: 32px;font-size: 14px;color: #999;float: left;}
-    .popup-layer .popup-content .popup-from .popup-p{width: 220px;height: 32px;font-size: 14px;color: #333;padding: 0 10px;float: left;}
-    .popup-layer .popup-content .popup-from .popup-textarea{height: 78px;float: left;margin-left: 10px;border-radius: 2px;}
-    .popup-layer .popup-content .popup-from textarea{width: 100%;height: 100%;font-size: 12px;resize:none;border: 1px solid #EFEFEF;padding: 5px;}
-    .popup-layer .popup-content .popup-from  .poze{width: 40px;height: 30px;text-align: center;font-size: 14px;position: absolute;right: 0;top: 0;}
-    .popup-layer .popup-content .popup-tips{color: #FF0000;float: left;margin-left: 10px;}
-    .popup-layer .popup-content .popup-from .popup-upload{height: 48px;float: left;margin-left: 10px;}
-    .popup-layer .popup-content .popup-from  .upload-file{width: 48px;height: 48px;border: 1px solid #EFEFEF;border-radius: 2px;position: relative;cursor: pointer;}
-    .popup-layer .popup-content .popup-from .upload-file .icon-del{width: 16px;height: 16px;display: block;background: url("/img/base/icon.png") no-repeat;background-position: -175px -300px;position: absolute;right: -8px;top: -8px;cursor: pointer;}
-    .popup-layer .popup-content .popup-from  .upload-file .icon-add{display: block;width:26px ;height: 26px;background: url("/img/base/icon.png") no-repeat;background-position: -168px -374px;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
-    .popup-layer .popup-content .popup-from .upload-file .input-file{width: 48px;height: 48px;opacity:0;cursor: pointer;margin-left: 0;padding: 0;}
-    .popup-layer .popup-content .popup-from  .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
-    .popup-layer .popup-button{text-align: right;padding: 0 15px 12px;pointer-events: auto;user-select: none;-webkit-user-select: none;}
-    .popup-layer .popup-button .btn{height: 28px;line-height: 28px;margin: 5px 5px 0;padding: 0 15px;border: 1px solid #dedede;background-color: #fff;color: #333;border-radius: 2px;font-weight: 400;cursor: pointer;text-decoration: none;display: inline-block;}
-    .popup-layer .popup-button .btn.btn-confim{border-color: #FF5B00;background-color: #FF5B00;color: #fff}
-    .popup-layer .popup-button .btn.btn-cancel{}
-    .ck-editor {min-width: 600px !important;}
-    .ck-content {min-height: 500px;}
-    .footTop{height: 100px;}
-    .baseHeadCenter .keyword{height: 40px;line-height: 40px;}
-    input::placeholder{color: #9aa5b5}
-    .release-from.shili .text{width: 100%;color: #627386}
-    .imgText .text{width: 100%;color: #627386}
-    .release-from .release-label.rightTxt{padding-left: 6px}
-    .icon.del-btn:before{
-        width: 20px;
-        background-position: -114px -140px;
-        height: 20px
-    }
-    /* 运费模板弹窗 */
-    .el-message{min-width: 280px !important;}
-    .el-dialog__body{padding: 10px 20px !important;box-sizing: border-box;max-height: 620px;}
-    .el-form-content{width: 100%;max-height: 500px;overflow: hidden;overflow-y: scroll;box-sizing: border-box;padding: 0 12px;}
-    .el-form-list{width: 100%;height: auto;border: 1px solid #B8BFCA;border-radius: 2px;margin-bottom: 10px;}
-    .el-form-list:last-child{margin-bottom: 0;}
-    .el-form-list-title{width: 100%;box-sizing: border-box;padding: 0 13px;line-height: 40px;background: #F5F5F5;font-size: 14px;color: #333333; position: relative;}
-    .el-form-list-title .el-form-close{width: 20px;height: 20px;line-height: 20px;background: #F94B4B;text-align: center;color: #FFFFFF;cursor: pointer;position: absolute;right: 0;top: 0;}
-    .el-form-list-roles{box-sizing: border-box;padding: 0 13px;}
-    .el-form-list-roles.rol3{border-top: 1px solid #B8BFCA;border-bottom: 1px solid #B8BFCA;}
-    .el-form-role3,.el-form-role5{align-items: center;box-sizing: border-box;display: flex;justify-content: space-between;padding: 12px 0;}
-    .el-form-role3-ns,.el-form-role5-ns{width: 550px;line-height: 24px;}
-    .el-form-add{ width: 100%;box-sizing: border-box;line-height: 24px;font-size: 14px;color: #FF5B00;}
-    /* 运费规则弹窗 */
-    .el-area-wup{margin-bottom: 20px;}
-    .el-area-box{display: flex;flex-wrap: wrap;}
-    .el-area-checkbox{align-items: center;display: flex;flex: 0 0 auto;margin: 10px 16px 0 0;}
-    .el-area-label{ margin-left: 8px;cursor: pointer;}
-    .el-area-label.disabled{ color: #9AA5B5;cursor: not-allowed;}
-    /* 运费规则弹窗 */
-    .box-row-col{width: 100%;height: 118px;background: #F7F7F7;box-sizing: border-box;padding: 16px;}
-}
-
-/*移动*/
-
-@media screen and (max-width:768px) {
-    .container .release-stepbox{height: 17.6vw;}
-    .container .release-stepbox>div{float: left;    width: 20%;text-align: center;top: 9.3vw;position: relative;}
-    .release-stepbox .stepSpan p{color: #9aa5b5}
-    .release-stepbox .stepSpan.active p {color: #FF5B00;}
-    .release-stepbox .stepSpan.active p span {background: #FF5B00;}
-    .release-stepbox .stepSpan p span{display: inline-block;width: 5.3vw;height: 5.3vw;font-size: 3.2vw;text-align: center;line-height: 5.3vw;background: #9aa5b5;color: #FFFFFF;border-radius: 10.6vw;position: absolute;top: -6.4vw;right: 7vw}
-    .release-container{background: #fff;padding: 3vw;}
-    .release-from .release-label{height:8.3vw;color: #627386;}
-    .release-from .release-label span {color: #FF0000;}
-    .release-from .release-input .input{width: -webkit-fill-available; border: .27vw solid rgba(184,191,202,.5);border-radius: .27vw;padding-left: 2.7vw;height: 11.8vw}
-     input::placeholder{color: #9aa5b5;}
-    .release-from{margin-bottom: 4vw;line-height: 8.5vw}
-    .release-from .text{line-height: 6.4vw;color: #FF5B00;width: 87vw;margin: auto;font-size: 3.1vw}
-    .release-from .select-main .select{border: .27vw solid rgba(184,191,202,.5);height: 11.7vw;width: -webkit-fill-available;padding-left: 2.7vw;color: #9aa5b5;}
-    .release-from .release-input .input.tags{width: 52vw;height: 11.7vw;}
-    .release-from .release-input .add-btn{width: 33.4vw;border-radius: .53vw;border: .27vw solid #FF5B00;display: inline-block;margin-left:2.7vw;text-align: center;line-height: 11.7vw;background-color: #ffe6dc;color: #FF5B00;}
-    .release-from .release-input .input.keyword{margin-bottom: 2.7vw;}
-    .release-from .p{width: 22.4vw;height: 7.2vw;line-height: 7.2vw;text-align: center;font-size: 12px;color: #FF5B00;border: .27vw solid #FF5B00;background: #ffe6dc;display: block;border-radius: 4.8vw;margin: 2.7vw auto;}
-    .release-from .release-input .release-param{ position: relative;width: 100%;height: auto;border: 1px solid rgba(184,191,202,.5);margin-bottom: 2.7vw;}
-    .release-from .release-input .release-param .param-input:first-child {border-bottom: 1px solid #f0f3f7;}
-    .release-from .release-input .release-param .param-input{width: -webkit-fill-available;border-radius: .27vw;padding-left: 2.7vw;height: 11.8vw;border: none;}
-    .release-from .release-input .add{width: 22.4vw;height: 7.2vw;line-height: 7.2vw;text-align: center;font-size: 12px;color: #FF5B00;border: .27vw solid #FF5B00;background: #ffe6dc;display: block;border-radius: 4.8vw;margin: 2.7vw auto;}
-    .release-from .from-button .btn.next{width: 100%;height: 11.2vw;line-height: 11.2vw;text-align: center;color: #fff;background: #FF5B00;display: block;}
-    .release-from .release-tips {width: 100%;color: #FF0000;}
-    .popup.active {opacity: 1;}
-    .popup {width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;opacity: 0;}
-    .popup-layer {width:74.7vw;height: 98.8vw;position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;background: #fff;border-radius: 1vw;z-index: 1000;}
-    .popup-layer .popup-title {padding-left: 4vw;height: 10.5vw;line-height:10.5vw;border-bottom: .27vw solid #e2e7ef;font-size: 3.4vw;color: #22272e;overflow: hidden;border-radius: 2px 2px 0 0;position: relative;}
-    .popup-title .popup-close {width: 25px;height: 26px;display: block;position: relative;right: -240px;top: -38px}
-    .popup-layer .popup-content {padding: 2.7VW;}
-    .popup-layer .popup-content .popup-from {height: auto;color: #999999;line-height: 8.5vw;position: relative;}
-    .popup-layer .popup-content .popup-from span {display: inline-block;height: 8.5vw;font-size: 3vw;color: #22272e;float: left}  .popup-layer .popup-content .popup-from .popup-upload {height: 13vw;float: left;margin-left: 2.7vw;}
-    .popup-layer .popup-content .popup-from .upload-file {width:13vw;height: 13vw;border: .27vw solid #EFEFEF;border-radius:.53vw;position: relative;cursor: pointer;}
-    .popup-layer .popup-content .popup-from .upload-file .input-file {width: 13vw;height: 13vw;opacity: 0;cursor: pointer;margin-left: 0;padding: 0;}
-    .popup-layer .popup-content .popup-from .popup-p{width: 49.8vw;height: 8.8vw;border: .27vw solid #b8bfca;display: inline-block;padding-left: 1.7vw}  .popup-textarea textarea{width: 47vw;height: 16vw;padding: 2.7vw;border: .27vw solid #b8bfca;resize: none;font-size: 3vw;}
-    textarea::placeholder{color: #9aa5b5}  .popup-button{padding: 10px;}
-    .popup-button div{height: 9.9vw;line-height: 9.9vw;text-align: center;margin-bottom: 2.7vw;}
-    .popup-button div.btn-confim{color: #fff;background: #FF5B00;}
-    .popup-button div.btn-cancel{color: #9aa5b5;border: .27vw solid #b8bfca;}
-    .mIcon.icon-add:before {width: 5vw;height: 5vw;background-position: -9.6vw -62vw;position: relative;top: 3vw;right: -4vw;}
-    .mIcon.popup-close:before{top: 1.9vw;width: 5.3vw;height: 5.3vw;background-position: -34vw 0px;right: 2.7vw;position: absolute}
-    .release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;color: #627386;font-weight: bold;position: relative;}
-    .release-from .release-label.active{ font-weight: normal;color: #FF5B00; }
-    .release-from .release-label span{color: #FF0000;}
-    .release-from .release-label .release-label-btn{display: block;position: absolute;right: 0;top: 0;line-height: 32px;font-weight: normal;color: #2398FF;cursor: pointer;}
-    .release-from .release-from-tr{width: 100%;height: 32px;float: left;}
-    .release-from .release-from-tr .tr-labe{width: 20%;height: 8vw;float: left;text-align: left;font-size: 3.2vw;color: #627386;line-height: 8vw;}
-    .release-from .release-from-tr .tr-labe .star{color: #F94B4B;}
-    .release-from .release-from-tr .tr-labe.none{margin-right: 0;}
-    .release-from .release-from-td{width: 100%;height: auto;float: left;margin:0;position: relative;}
-    .release-from .release-from-td .tr-labe{width: 19%;height: 8vw;float: left;text-align: left;margin-right: 1vw;}
-    .release-from .release-from-td .tr-labe.none{margin-right: 0;}
-    .release-from .release-from-td .tr-labe .tr-input{width: 100%;height: 8vw;font-size: 14px;color: #627386;line-height: 8vw;box-sizing: border-box;border: 1px solid #B8BFCA;padding: 0 1vw;border-radius: 1vw;}
-    .release-from .release-from-td .tr-icon{width: 8vw;height: 8vw;box-sizing: border-box;padding: 4px;float: left;cursor: pointer;}
-    .release-from .release-from-td .tr-icon .WEB-icon:before{content:'';display:inline-block;background:url(/img/base/WEB-icon.png) no-repeat;font-size:0;}
-    .release-from .release-from-td .tr-icon .add:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -51px -1px;margin-right: 2px;}
-    .release-from .release-from-td .tr-icon .del:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -77px -1px;margin-right: 2px;}
-    .release-from .release-input{width: 100%;height: auto;float: left;position: relative;}
-    .release-from .release-input .yang{width: 8vw;position: absolute;left: 0;top: 0;line-height:13vw;text-align: center}
-    .release-from .release-input .input.price{padding-left: 7vw}
-    .release-from .release-input{position: relative}
-    .release-from .release-input.expen{margin-top:5.5vw;}
-    .release-from .release-input.expen .input{padding-left:6vw;}
-    .release-from .release-input.expen .span{width:6vw;height:11.8vw;display:block;position:absolute;top:0;left:0;text-align:center;line-height:11.8vw;font-size:3.4vw;color:#22272e;}
-
-    .release-from .release-input .release-radios{ padding:0 2.5vw;height:10vw;margin-right:2.7vw;line-height:10vw;box-sizing:border-box;font-size:3.4vw;text-align:center;display:block;border: 1px solid #B8BFCA;position: relative;border-radius: 2px;float: left; }
-    .release-from .release-input .release-radios.active{border-color: #FF2A2A;color: #FF5B00;}
-    .release-from .release-input .release-radios.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
-    .release-main-tips{width: 100%;height: 18vw;box-sizing: border-box;padding: 2vw 1vw;background: linear-gradient(90deg, #FFFFFF 0%, #FFEEE5 51%, #FFFFFF 100%);font-size: 3.2vw;color: #FF5B00;line-height: 5vw;}
-
-    /*销售信息*/
-    input[type="radio"]{opacity:0;}
-    .release-from .release-input .release-props{width: 100%;height: 36px;}
-    .release-from .release-input .release-props .release-radio{    width: 26.7vw;height: 11.2vw;margin-right: 2.7vw;line-height: 11.2vw;box-sizing: border-box;font-size: 3.4vw;text-align: center;display: inline-block}
-    /*.release-from .release-input .release-props .release-radio.second{width:100px;}*/
-    .release-from .release-input .release-props .release-radio input{display:none}
-    .release-from .release-input .release-props .release-radio i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:.27vw solid #b8bfca;color:#627386;}
-    .release-from .release-input .release-props .release-radio i:before{position:absolute;right:0;bottom:0;display:none;width:5.3vw;height:5.3vw;background-position:-75.7vw -8.5vw}
-    .release-from .release-input .release-props .release-radio input:checked + i{border-color:#FF5B00;color:#FF5B00}
-    .release-from .release-input .release-props .release-radio input:checked + i:before{display:block}
-    .release-from .release-input .release-province{width: 100%;height: auto;margin-top: 5.3vw;}
-    .release-from .release-input .release-province .province-item{line-height:8vw;padding: 0 2.7vw;text-align: center;font-size: 3.2vw;color: #627386;background: #F0F3F7;border-radius: .27vw;display: block;margin: 0 .27vw .27vw 0;float: left;}
-    .release-from .release-input .release-province .province-item.active{background: #FF5B00;color: #FFF;}
-    .release-from .release-input .tax{color: #627386;float: left;}
-    .release-from .secondbtn {width: 100%;padding: 2.7vw 0;text-align: center;}
-    .release-from .secondbtn .btn {box-sizing: border-box;width:40vw;height: 11.2vw;border-radius:.53vw;display: block;line-height:11.2vw;text-align: center;display: inline-block;margin: 0 1.3vw;}
-    .release-from .secondbtn .btn.next{width: 40vw;display: inline-block;}
-    .release-from .secondbtn .btn.next {background-color: #FF5B00;color: #fff;}
-    .release-from .secondbtn .btn.prev {border: .27vw solid #FF5B00;background-color: #ffe6dc;color: #FF5B00;}
-    .release-from .release-input .tax .mg{display: block;width: 54vw;height: 11.7vw;line-height: 11.7vw;border: .27vw solid #b8bfca;color: #22272e;padding-left: 2.7vw;}
-    .release-from .release-input .edit-btn{width: 30.4vw;height: 11.7vw;line-height: 11.7vw;text-align: center;color: #FF5B00;background: #ffe6dc;border: .27vw solid #FF5B00;float: left;margin-top: 8vw;margin-left: 2.7vw}
-    .popup-layer .popup-content .popup-from input{height: 8.8vw;width: 55.5vw;padding-left: 2.7vw;border: .27vw solid #b8bfca}
-    .popup-layer .popup-content .popup-from .poze{width: 40px;text-align: center;font-size: 3.4vw;position: absolute;right: 0;top: 0;height: -webkit-fill-available}
-    .popup-layer.edit{height: 62.3vw;}
-    .release-from .release-input.upload.image{width: 100%;}
-    .release-from .upload-file {width: 26vw;height: 26vw;border: .27vw solid #EBEBEB;border-radius: .53vw;position: relative;float: left;margin-right: 2.7vw;margin-bottom: 2.7vw;cursor: pointer;}
-    .release-from .upload-file .input-file {width: 26vw;height: 26vw;opacity: 0;cursor: pointer;}
-    .release-from .upload-file .upload-img {width: 100%;height: 100%;display: block;border-radius:.53vw;}
-    .mIcon.icon-del:before{width: 5.3vw;height: 5.3vw;background-position: -89.8vw -7.6vw;position: absolute;top: -.8vw;right: -.8vw}
-    .mIcon.icon-add:before{width: 8vw;height: 8vw;background-position: -8.2vw -60.3vw;position: absolute;top: 5.5vw;right: 9vw}
-    .add-text {font-size: 3.6vw;color: #333330;opacity: 0.5;position: absolute;top: 61%;right: 5.3vw;}
-    .release-from.text p .em {color: #FF5B00;}
-    .imgText .text{color: #627386;font-size: 3vw;}
-    .ck-editor__main p{height: 42.4vw;}
-    .release-from .last  .btn{width: 25.2vw}
-    .release-from .secondbtn .btn.next{width: 25.2vw}
-    .release-from .tags-main .item-tags {padding: 0 2.7vw;line-height: 8vw;background: #ffe6dc;text-align: center;font-size: 3.2vw;color: #FF5B00;margin: 1.3vw;border-radius: .53vw;float: left;position: relative;}
-    .mIcon.del-tags:before{width: 4.3vw;height: 4.3vw;background-position: -26.4vw -9vw;position: absolute;top: -2vw;}
-    .mIcon.del-btn:before{width: 5.3vw;background-position: -98.4vw -9.3vw;height: 5.3vw;position: absolute;top: 0;right: 0}
-    .select-main {margin-bottom: 2.7vw; position: relative}
-    .select-main  .option-main{border: .27vw solid rgba(184,191,202,.5)}
-    .select-main  .option-main  .option{padding:0 2.7vw;color: #9aa5b5}
-    .selected.mIcon:before{width: 5.3vw;height: 5.3vw;background-position: -51.2vw -.27vw;position: absolute;top: 4vw;right: 2.7vw}
-    /* 运费模板弹窗 */
-    .el-message{min-width: 280px !important;}
-    .el-dialog__body{padding: 1vw 2vw !important;box-sizing: border-box;max-height: 620px;}
-    .el-form-content{width: 100%;max-height: 500px;overflow: hidden;overflow-y: scroll;box-sizing: border-box;padding: 0 2vw;}
-    .box-row.el-row span{font-size: 3.2vw;}
-    .el-form-list{width: 100%;height: auto;border: 1px solid #B8BFCA;border-radius: 2px;margin-bottom: 10px;}
-    .el-form-list:last-child{margin-bottom: 0;}
-    .el-form-list-title{width: 100%;box-sizing: border-box;padding: 0 13px;line-height: 40px;background: #F5F5F5;font-size: 14px;color: #333333; position: relative;}
-    .el-form-list-title .el-form-close{width: 20px;height: 20px;line-height: 20px;background: #F94B4B;text-align: center;color: #FFFFFF;cursor: pointer;position: absolute;right: 0;top: 0;}
-    .el-form-list-roles{box-sizing: border-box;padding: 0 13px;}
-    .el-form-list-roles.rol3{border-top: 1px solid #B8BFCA;border-bottom: 1px solid #B8BFCA;}
-    .el-form-role3,.el-form-role5{align-items: center;box-sizing: border-box;display: flex;justify-content: space-between;padding: 12px 0;}
-    .el-form-role3-ns,.el-form-role5-ns{width: 550px;line-height: 24px;}
-    .el-form-add{ width: 100%;box-sizing: border-box;line-height: 24px;font-size: 14px;color: #FF5B00;}
-    /* 运费规则弹窗 */
-    .el-area-wup{margin-bottom: 20px;}
-    .el-area-box{display: flex;flex-wrap: wrap;}
-    .el-area-checkbox{align-items: center;display: flex;flex: 0 0 auto;margin: 10px 16px 0 0;}
-    .el-area-label{ margin-left: 8px;cursor: pointer;}
-    .el-area-label.disabled{ color: #9AA5B5;cursor: not-allowed;}
-    /* 运费规则弹窗 */
-    .box-row-col{width: 100%;height: auto;background: #F7F7F7;box-sizing: border-box;padding: 16px;}
-    footer{display: none;}
-}
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+}
+input[type="number"]{
+    -moz-appearance: textfield;
+}
+div{box-sizing: border-box;}
+@media screen and (min-width:768px) {
+    .container{width: 100%;height: auto;box-sizing: border-box;background-color: #FFFFFF;padding: 0 16px;border-radius: 8px;overflow: hidden;}
+    .release-stepbox{width: 100%;box-sizing: border-box;    line-height: 60px; }
+    .release-stepbox .stepSpan{float: left;padding: 0 15px;margin-right: 80px;position: relative;}
+    .release-stepbox .stepSpan:last-child{margin-right: 0;}
+    .release-stepbox .stepSpan p{font-size: 16px;line-height: 24px;color: #9aa5b5;text-align: center;display: inline-block}
+    .release-stepbox .stepSpan p span{display: inline-block;width: 24px;height: 24px;font-size: 14px;text-align: center;line-height: 24px;background: #9aa5b5;color: #FFFFFF;border-radius: 40px;margin-top: 5px;}
+    .release-stepbox .stepSpan.active  p{color:#FF5B00 ;}
+    .release-stepbox .stepSpan.active p span{background: #FF5B00;}
+    .release-container{width: 100%;height: auto;border-top: 1px solid #e2e7ef;padding:20px 0;opacity: 0;}
+    .release-container.active{opacity: 1;}
+    .release-main-container{width: 100%;padding:0 168px;box-sizing: border-box;}
+    .release-main-container.new{width: 100%;padding: 0 24px;box-sizing: border-box;}
+    .release-main-container.new .release-image{width: 100%;height: auto;}
+    .release-main-container.new .release-image img{width: 100%;height: auto;}
+    .release-from{width: 100%;height:auto;margin-bottom: 15px;line-height: 32px;font-size: 14px;color: #333;}
+    .release-from.text p .em{color: #FF5B00;}
+    .release-from.none{margin-bottom: 0;}
+    .release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;color: #627386;font-weight: bold;position: relative;}
+    .release-from .release-label.active{ font-weight: normal;color: #FF5B00; }
+    .release-from .release-label span{color: #FF0000;}
+    .release-from .release-label .release-label-btn{display: block;position: absolute;right: 0;top: 0;line-height: 32px;font-weight: normal;color: #2398FF;cursor: pointer;}
+    .release-from .release-from-tr{width: 100%;height: 32px;float: left;}
+    .release-from .release-from-tr .tr-labe{width: 88px;height: 32px;float: left;text-align: left;font-size: 14px;color: #627386;line-height: 32px;margin-right: 14px;}
+    .release-from .release-from-tr .tr-labe .star{color: #F94B4B;}
+    .release-from .release-from-tr .tr-labe.none{margin-right: 0;}
+    .release-from .release-from-td{width: 100%;height: auto;float: left;margin: 8px 0;position: relative;}
+    .release-from .release-from-td .tr-labe{width: 88px;height: 36px;float: left;text-align: left;margin-right: 14px;}
+    .release-from .release-from-td .tr-labe.none{margin-right: 0;}
+    .release-from .release-from-td .tr-labe .tr-input{width: 100%;height: 36px;font-size: 14px;color: #627386;line-height: 36px;box-sizing: border-box;border: 1px solid #B8BFCA;padding: 0 5px;}
+    .release-from .release-from-td .tr-icon{width: 36px;height: 36px;box-sizing: border-box;padding: 4px;float: left;margin-left: 15px; cursor: pointer;}
+    .release-from .release-from-td .tr-icon .add:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -51px -1px;margin-right: 2px;}
+    .release-from .release-from-td .tr-icon .del:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -77px -1px;margin-right: 2px;}
+    .release-from .release-input{width: 100%;height: auto;float: left;position: relative;}
+    .release-from .release-input.expen{margin-top:10px;}
+    .release-from .release-input.expen .input{padding-left:30px;}
+    .release-from .release-input.expen .span{width:30px;height:36px;display:block;position:absolute;top:0;left:0;text-align:center;line-height:36px;font-size:14px;color:#22272e;}
+    .release-from .release-input .input{width: 100%;height: 36px;padding: 0 10px;border-radius: 2px;border: 1px solid #b8bfca;float: left;font-size: 13px;box-sizing: border-box;}
+    .release-from .release-input .input.price{padding-left: 30px;}
+    .release-from .release-input .yang{width: 30px;height: 36px;position: absolute;left: 0;top: 0;line-height: 36px;text-align: center;}
+    .release-from .release-input .unit{height: 36px;padding: 0 10px;position: absolute;right: 0;top: 0;line-height: 36px;text-align: right;font-size: 14px;}
+    .release-from .release-input .tax{display: block;float: left;}
+    .release-from .release-input .mg{margin-left: 10px;}
+    .release-from .release-input .edit-btn{display: block;float: left;margin-left: 20px;color: #FF5B00;text-decoration: underline;}
+    .release-from .release-input .input.keyword{width: 243px;margin:0 10px 10px 0;}
+    .release-from .release-input .p{display: block;position: absolute;right: 0;bottom: 0;line-height: 32px;font-size: 12px;color: #FF5B00;text-decoration: underline;}
+    .release-from .release-input .add{display: inline-block;width: 100%;height: 20px;float: right;line-height: 20px;font-size: 14px;color: #FF5B00;text-align: right;}
+    .release-from .release-input .add span{font-size: 20px;}
+    .release-from .release-input .input.keyword:nth-child(2n){margin-right: 0;}
+    .release-from .release-input .release-param{width:100%;height: auto;padding: 0 10px;border: 1px solid #b8bfca;float: left;margin-bottom: 10px;border-radius: 2px;position: relative;}
+    .release-from .release-input .release-param .param-input{width: 100%;height: 36px;border: none;font-size: 13px;line-height: 36px;}
+    .release-from .release-input .release-param .param-input:first-child{border-bottom: 1px solid #e2e7ef;}
+    .release-from .release-input .release-param .del-btn{display: block;line-height: 64px;color: #FF0000;font-size: 14px;position: absolute;    top: -18px;right: 0px;}
+    .release-from .release-input .release-opt{width: 100%;height: 155px;border: 1px solid #e4e7ed;border-radius: 2px;background-color: #fff;box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);overflow: hidden;overflow-y: scroll;box-sizing: border-box;margin: 5px 0;padding: 10px 0;z-index: 88;position: absolute;top: 31px;left: 0;}
+    .release-from .release-input .textarea{width: 420px;height: 150px;position: relative;padding: 10px;overflow: hidden;}
+    .release-from .release-input .textarea .limit-text{position: absolute;right: 15px;bottom: 10px;line-height: 30px;font-size:13px ;color: #D0D0D0;}
+    .release-from .release-input .textarea .limit-text .red{color:#FF5B00 ;}
+    .release-from .release-input .textarea textarea{width: 100%;height: 100%;border: 1px solid #EBEBEB;border-radius: 2px;resize: none;padding: 10px;font-size: 13px;color: #333;}
+    .release-from .release-input .release-opt .opt-item{font-size: 14px;padding: 0 10px;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #606266;height: 34px;line-height: 34px;box-sizing: border-box;cursor: pointer;}
+    .release-from .release-input .release-opt .opt-item:hover {background-color: #F5E7E0;color: #FF5B00;}
+    .release-from .release-input.upload{height: 78px;}
+    .release-from .release-input.upload.image{height: auto;width: 500px;}
+    .release-from .release-input.Editor{width: 600px;min-height: 540px;margin: 0;}
+    .release-from  .upload-file{width: 90px;height: 90px;border-radius: 2px;position: relative;float: left;margin-right: 10px;margin-bottom: 10px;cursor: pointer;}
+    .release-from  .upload-file .icon-del:before{width: 16px;height: 16px;cursor: pointer; background-position: -118px -140px;position: absolute;top: 0;right: 0}
+    .release-from  .upload-file .icon-add{width:100% ;height: 100%;background: url("/img/account/icon-addimg.svg");display: block}
+    .release-from  .upload-file .input-file{width: 90px;height: 90px;opacity: 0;cursor: pointer;position: absolute;top: 0}
+    .release-from  .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .release-from .release-input .input.tags{width: 390px;}
+    .release-from .release-input .add-btn{width: 90px;height: 34px;border-radius: 2px;border: 1px solid #FF5B00;background:#ffe6dc;float: left;margin-left: 15px;text-align: center;line-height: 34px;font-size: 14px;color:#FF5B00 ;cursor: pointer;}
+    .release-from .release-input .add-btn.active{background-color: #ffe6dc;color: #FF5B00;}
+    .release-from .release-tips{width: 100%;color: #FF0000;float: left;}
+    .release-from.text{height: auto;}
+    .release-from .text{width: 303px;line-height: 32px;font-size: 12px;color: #FF5B00;}
+    .release-from .tags-main{width: 100%;height: auto;}
+    .release-from .tags-main .item-tags{padding: 0 10px;line-height: 28px;background: #FFF3E5;text-align: center;font-size:14px;color:  #333333;margin: 5px;border-radius: 2px;float: left;position: relative;}
+    .release-from .tags-main .item-tags .del-tags{width: 16px;height: 16px;display: block;background: url("/img/base/icon.png") no-repeat;background-position: -175px -300px;position: absolute;right: -5px;top: -5px;cursor: pointer;}
+    .release-from .select-main{padding: 0 10px;cursor: pointer;width: 155px;height: 36px;border: 1px solid #b8bfca;border-radius: 2px;line-height: 32px;color: #333;font-size: 14px;margin-right: 15px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;position: relative;}
+    .release-from .select-main:last-child{margin-right: 0;}
+    .release-from .select-main.border{border: 1px solid #FF5B00;}
+    .release-from .select-main .select{cursor: pointer;width: 135px;height: 36px;line-height: 36px;color: #22272e;font-size: 12px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;border: none;background: url("/img/supplier/Retract.png") no-repeat scroll right 0px center transparent;}
+    .release-from .select-main .option-main{width: 100%;min-height:50px;max-height: 200px;border: 1px solid #e4e7ed;border-radius: 2px;background-color: #fff;box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);overflow: hidden;overflow-y: scroll;box-sizing: border-box;margin: 5px 0;padding: 10px 0;z-index: 88;position: absolute;top: 28px;left: 0;}
+    .release-from .select-main .option {font-size: 14px;padding: 0 20px;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #606266;height: 34px;line-height: 34px;box-sizing: border-box;cursor: pointer;}
+    .release-from .select-main .option:hover {background-color: #F5E7E0;color: #FF5B00;}
+    .release-from .from-button{width: fit-content;height: 70px;padding: 10px 0;}
+    .release-from .from-button.last{margin-left: 0;}
+    .release-from .from-button.last .btn{width: 153px;}
+    .release-from .from-button .btn{box-sizing: border-box;width: 232px;height: 50px;background-color: #FF5B00;box-shadow: 0px 3px 6px 0px rgba(249, 75, 75, 0.17);border-radius: 2px;display: block;line-height: 50px;text-align: center;float: left;margin-right: 6px;}
+    .release-from .from-button .btn.prev{border: 1px solid #FF5B00;background-color: #ffe6dc;color: #FF5B00;}
+    .release-from .from-button .btn.next{background-color: #FF5B00;color: #fff;}
+    .release-from .from-button .btn.eyes{background-color:#A69DFE;color: #fff;}
+    .release-main-tips{width: 100%;height: 60px;box-sizing: border-box;padding: 12px 168px;background: linear-gradient(90deg, #FFFFFF 0%, #FFEEE5 51%, #FFFFFF 100%);font-size: 12px;color: #FF5B00;line-height: 18px;}
+
+    /*预览*/
+    .preview-container{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,.5);z-index: 99999;display: none;}
+    .preview-container .preview-content{width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
+    .preview-container .preview-content img{border-radius: 4px;}
+
+    /*销售信息*/
+    input[type="radio"]{opacity:0;}
+
+    .release-from .release-input-add{width: 100%;margin-top: 10px;float: left;}
+    .release-from .release-input .release-props{width: 100%;height: 38px;}
+    .release-from .release-input .release-props .release-radio{width:150px;height:36px;margin-right:10px;line-height:34px;box-sizing:border-box;font-size:14px;text-align:center;display:inline-block}
+    .release-from .release-input .release-props .release-radio.second{width:100px;}
+    .release-from .release-input .release-props .release-radio input{display:none}
+    .release-from .release-input .release-props .release-radio i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:1px solid #b8bfca;color:#627386;}
+    .release-from .release-input .release-props .release-radio i:before{position:absolute;right:0;bottom:0;display:none;width:20px;height:20px;background-position:-208px -253px}
+    .release-from .release-input .release-props .release-radio input:checked + i{border-color:#FF5B00;color:#FF5B00}
+    .release-from .release-input .release-props .release-radio input:checked + i:before{display:block}
+    .release-from .release-input .release-props .release-select{width: 320px;float: left;}
+    .release-from .release-input .release-props .release-select-refresh{width: auto;float: left;color: #FFFFFF;font-size: 14px;text-align: center;line-height: 36px;margin: 0 15px;}
+    .release-from .release-input .release-props .release-select-all{width: 92px;float: left;}
+    .release-from .release-input .release-props .release-select-all a{width: 92px;height: 36px;box-sizing: border-box; background: #FFEBE4;border-radius: 2px 2px 2px 2px;opacity: 1;display: block;color: #FF5B00;font-size: 14px;line-height: 36px;text-align: center;border: 1px solid #FF5B00;}
+
+    .release-from .release-input .release-province{width: 100%;height: auto;margin-top: 20px;}
+    .release-from .release-input .release-province .province-item{line-height:26px;padding: 0 10px;text-align: center;font-size: 14px;color: #627386;background: #F0F3F7;border-radius: 2px;display: block;margin: 0 10px 10px 0;float: left;}
+    .release-from .release-input .release-province .province-item.active{background: #FF5B00;color: #FFF;}
+    .release-from .release-input .release-radios{ width:150px;height:38px;margin-right:10px;line-height:36px;box-sizing:border-box;font-size:14px;text-align:center;display:block;border: 1px solid #B8BFCA;position: relative;border-radius: 2px;float: left; }
+    .release-from .release-input .release-radios.active{border-color: #FF2A2A;color: #FF5B00;}
+    .release-from .release-input .release-radios.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
+
+        /*税率弹窗*/
+    .popup{width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;opacity: 0;}
+    .popup.active{opacity: 1;}
+    .popup-layer{-webkit-overflow-scrolling: touch;width: 338px;position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;background-color: #fff;-webkit-background-clip: content;border-radius: 2px;box-shadow: 1px 1px 50px rgba(0,0,0,.3);z-index: 1000;}
+    .popup-layer.bran{height: 330px;}
+    .popup-layer.edit{height: 153px;}
+    .popup-layer .popup-title{padding: 0 80px 0 20px;height: 42px;line-height: 42px;border-bottom: 1px solid #eee;font-size: 14px;color: #333;overflow: hidden;background-color: #F8F8F8;border-radius: 2px 2px 0 0;position: relative;}
+    .popup-title .popup-close{width: 16px;height: 16px;display: block;position: absolute;right: 10px;top: 13px;background-position: 1px -40px;cursor: pointer;}
+    .popup-layer .popup-content{padding: 13px;}
+    .popup-layer .popup-content .popup-from{height: auto;color: #999999;line-height: 32px;position: relative;}
+    .popup-layer .popup-content .popup-from input{width: 260px;height: 32px;border: 1px solid #EFEFEF;font-size: 14px;color: #333;padding: 0 10px;margin-left: 10px;box-sizing: border-box;}
+    .popup-layer .popup-content .popup-from span{display: inline-block;height: 32px;font-size: 14px;color: #999;float: left;}
+    .popup-layer .popup-content .popup-from .popup-p{width: 220px;height: 32px;font-size: 14px;color: #333;padding: 0 10px;float: left;}
+    .popup-layer .popup-content .popup-from .popup-textarea{height: 78px;float: left;margin-left: 10px;border-radius: 2px;}
+    .popup-layer .popup-content .popup-from textarea{width: 100%;height: 100%;font-size: 12px;resize:none;border: 1px solid #EFEFEF;padding: 5px;}
+    .popup-layer .popup-content .popup-from  .poze{width: 40px;height: 30px;text-align: center;font-size: 14px;position: absolute;right: 0;top: 0;}
+    .popup-layer .popup-content .popup-tips{color: #FF0000;float: left;margin-left: 10px;}
+    .popup-layer .popup-content .popup-from .popup-upload{height: 48px;float: left;margin-left: 10px;}
+    .popup-layer .popup-content .popup-from  .upload-file{width: 48px;height: 48px;border: 1px solid #EFEFEF;border-radius: 2px;position: relative;cursor: pointer;}
+    .popup-layer .popup-content .popup-from .upload-file .icon-del{width: 16px;height: 16px;display: block;background: url("/img/base/icon.png") no-repeat;background-position: -175px -300px;position: absolute;right: -8px;top: -8px;cursor: pointer;}
+    .popup-layer .popup-content .popup-from  .upload-file .icon-add{display: block;width:26px ;height: 26px;background: url("/img/base/icon.png") no-repeat;background-position: -168px -374px;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
+    .popup-layer .popup-content .popup-from .upload-file .input-file{width: 48px;height: 48px;opacity:0;cursor: pointer;margin-left: 0;padding: 0;}
+    .popup-layer .popup-content .popup-from  .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .popup-layer .popup-button{text-align: right;padding: 0 15px 12px;pointer-events: auto;user-select: none;-webkit-user-select: none;}
+    .popup-layer .popup-button .btn{height: 28px;line-height: 28px;margin: 5px 5px 0;padding: 0 15px;border: 1px solid #dedede;background-color: #fff;color: #333;border-radius: 2px;font-weight: 400;cursor: pointer;text-decoration: none;display: inline-block;}
+    .popup-layer .popup-button .btn.btn-confim{border-color: #FF5B00;background-color: #FF5B00;color: #fff}
+    .popup-layer .popup-button .btn.btn-cancel{}
+    .ck-editor {min-width: 600px !important;}
+    .ck-content {min-height: 500px;}
+    .footTop{height: 100px;}
+    .baseHeadCenter .keyword{height: 40px;line-height: 40px;}
+    input::placeholder{color: #9aa5b5}
+    .release-from.shili .text{width: 100%;color: #627386}
+    .imgText .text{width: 100%;color: #627386}
+    .release-from .release-label.rightTxt{padding-left: 6px}
+    .icon.del-btn:before{
+        width: 20px;
+        background-position: -114px -140px;
+        height: 20px
+    }
+    /* 运费模板弹窗 */
+    .el-message{min-width: 280px !important;}
+    .el-dialog__body{padding: 10px 20px !important;box-sizing: border-box;max-height: 620px;}
+    .el-form-content{width: 100%;max-height: 500px;overflow: hidden;overflow-y: scroll;box-sizing: border-box;padding: 0 12px;}
+    .el-form-list{width: 100%;height: auto;border: 1px solid #B8BFCA;border-radius: 2px;margin-bottom: 10px;}
+    .el-form-list:last-child{margin-bottom: 0;}
+    .el-form-list-title{width: 100%;box-sizing: border-box;padding: 0 13px;line-height: 40px;background: #F5F5F5;font-size: 14px;color: #333333; position: relative;}
+    .el-form-list-title .el-form-close{width: 20px;height: 20px;line-height: 20px;background: #F94B4B;text-align: center;color: #FFFFFF;cursor: pointer;position: absolute;right: 0;top: 0;}
+    .el-form-list-roles{box-sizing: border-box;padding: 0 13px;}
+    .el-form-list-roles.rol3{border-top: 1px solid #B8BFCA;border-bottom: 1px solid #B8BFCA;}
+    .el-form-role3,.el-form-role5{align-items: center;box-sizing: border-box;display: flex;justify-content: space-between;padding: 12px 0;}
+    .el-form-role3-ns,.el-form-role5-ns{width: 550px;line-height: 24px;}
+    .el-form-add{ width: 100%;box-sizing: border-box;line-height: 24px;font-size: 14px;color: #FF5B00;}
+    /* 运费规则弹窗 */
+    .el-area-wup{margin-bottom: 20px;}
+    .el-area-box{display: flex;flex-wrap: wrap;}
+    .el-area-checkbox{align-items: center;display: flex;flex: 0 0 auto;margin: 10px 16px 0 0;}
+    .el-area-label{ margin-left: 8px;cursor: pointer;}
+    .el-area-label.disabled{ color: #9AA5B5;cursor: not-allowed;}
+    /* 运费规则弹窗 */
+    .box-row-col{width: 100%;height: 118px;background: #F7F7F7;box-sizing: border-box;padding: 16px;}
+}
+
+/*移动*/
+
+@media screen and (max-width:768px) {
+    .container .release-stepbox{height: 17.6vw;}
+    .container .release-stepbox>div{float: left;    width: 20%;text-align: center;top: 9.3vw;position: relative;}
+    .release-stepbox .stepSpan p{color: #9aa5b5}
+    .release-stepbox .stepSpan.active p {color: #FF5B00;}
+    .release-stepbox .stepSpan.active p span {background: #FF5B00;}
+    .release-stepbox .stepSpan p span{display: inline-block;width: 5.3vw;height: 5.3vw;font-size: 3.2vw;text-align: center;line-height: 5.3vw;background: #9aa5b5;color: #FFFFFF;border-radius: 10.6vw;position: absolute;top: -6.4vw;right: 7vw}
+    .release-container{background: #fff;padding: 3vw;}
+    .release-from .release-label{height:8.3vw;color: #627386;}
+    .release-from .release-label span {color: #FF0000;}
+    .release-from .release-input .input{width: -webkit-fill-available; border: .27vw solid rgba(184,191,202,.5);border-radius: .27vw;padding-left: 2.7vw;height: 11.8vw}
+     input::placeholder{color: #9aa5b5;}
+    .release-from{margin-bottom: 4vw;line-height: 8.5vw}
+    .release-from .text{line-height: 6.4vw;color: #FF5B00;width: 87vw;margin: auto;font-size: 3.1vw}
+    .release-from .select-main .select{border: .27vw solid rgba(184,191,202,.5);height: 11.7vw;width: -webkit-fill-available;padding-left: 2.7vw;color: #9aa5b5;}
+    .release-from .release-input .input.tags{width: 52vw;height: 11.7vw;}
+    .release-from .release-input .add-btn{width: 33.4vw;border-radius: .53vw;border: .27vw solid #FF5B00;display: inline-block;margin-left:2.7vw;text-align: center;line-height: 11.7vw;background-color: #ffe6dc;color: #FF5B00;}
+    .release-from .release-input .input.keyword{margin-bottom: 2.7vw;}
+    .release-from .p{width: 22.4vw;height: 7.2vw;line-height: 7.2vw;text-align: center;font-size: 12px;color: #FF5B00;border: .27vw solid #FF5B00;background: #ffe6dc;display: block;border-radius: 4.8vw;margin: 2.7vw auto;}
+    .release-from .release-input .release-param{ position: relative;width: 100%;height: auto;border: 1px solid rgba(184,191,202,.5);margin-bottom: 2.7vw;}
+    .release-from .release-input .release-param .param-input:first-child {border-bottom: 1px solid #f0f3f7;}
+    .release-from .release-input .release-param .param-input{width: -webkit-fill-available;border-radius: .27vw;padding-left: 2.7vw;height: 11.8vw;border: none;}
+    .release-from .release-input .add{width: 22.4vw;height: 7.2vw;line-height: 7.2vw;text-align: center;font-size: 12px;color: #FF5B00;border: .27vw solid #FF5B00;background: #ffe6dc;display: block;border-radius: 4.8vw;margin: 2.7vw auto;}
+    .release-from .from-button .btn.next{width: 100%;height: 11.2vw;line-height: 11.2vw;text-align: center;color: #fff;background: #FF5B00;display: block;}
+    .release-from .release-tips {width: 100%;color: #FF0000;}
+    .popup.active {opacity: 1;}
+    .popup {width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;opacity: 0;}
+    .popup-layer {width:74.7vw;height: 98.8vw;position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;background: #fff;border-radius: 1vw;z-index: 1000;}
+    .popup-layer .popup-title {padding-left: 4vw;height: 10.5vw;line-height:10.5vw;border-bottom: .27vw solid #e2e7ef;font-size: 3.4vw;color: #22272e;overflow: hidden;border-radius: 2px 2px 0 0;position: relative;}
+    .popup-title .popup-close {width: 25px;height: 26px;display: block;position: relative;right: -240px;top: -38px}
+    .popup-layer .popup-content {padding: 2.7VW;}
+    .popup-layer .popup-content .popup-from {height: auto;color: #999999;line-height: 8.5vw;position: relative;}
+    .popup-layer .popup-content .popup-from span {display: inline-block;height: 8.5vw;font-size: 3vw;color: #22272e;float: left}  .popup-layer .popup-content .popup-from .popup-upload {height: 13vw;float: left;margin-left: 2.7vw;}
+    .popup-layer .popup-content .popup-from .upload-file {width:13vw;height: 13vw;border: .27vw solid #EFEFEF;border-radius:.53vw;position: relative;cursor: pointer;}
+    .popup-layer .popup-content .popup-from .upload-file .input-file {width: 13vw;height: 13vw;opacity: 0;cursor: pointer;margin-left: 0;padding: 0;}
+    .popup-layer .popup-content .popup-from .popup-p{width: 49.8vw;height: 8.8vw;border: .27vw solid #b8bfca;display: inline-block;padding-left: 1.7vw}  .popup-textarea textarea{width: 47vw;height: 16vw;padding: 2.7vw;border: .27vw solid #b8bfca;resize: none;font-size: 3vw;}
+    textarea::placeholder{color: #9aa5b5}  .popup-button{padding: 10px;}
+    .popup-button div{height: 9.9vw;line-height: 9.9vw;text-align: center;margin-bottom: 2.7vw;}
+    .popup-button div.btn-confim{color: #fff;background: #FF5B00;}
+    .popup-button div.btn-cancel{color: #9aa5b5;border: .27vw solid #b8bfca;}
+    .mIcon.icon-add:before {width: 5vw;height: 5vw;background-position: -9.6vw -62vw;position: relative;top: 3vw;right: -4vw;}
+    .mIcon.popup-close:before{top: 1.9vw;width: 5.3vw;height: 5.3vw;background-position: -34vw 0px;right: 2.7vw;position: absolute}
+    .release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;color: #627386;font-weight: bold;position: relative;}
+    .release-from .release-label.active{ font-weight: normal;color: #FF5B00; }
+    .release-from .release-label span{color: #FF0000;}
+    .release-from .release-label .release-label-btn{display: block;position: absolute;right: 0;top: 0;line-height: 32px;font-weight: normal;color: #2398FF;cursor: pointer;}
+    .release-from .release-from-tr{width: 100%;height: 32px;float: left;}
+    .release-from .release-from-tr .tr-labe{width: 20%;height: 8vw;float: left;text-align: left;font-size: 3.2vw;color: #627386;line-height: 8vw;}
+    .release-from .release-from-tr .tr-labe .star{color: #F94B4B;}
+    .release-from .release-from-tr .tr-labe.none{margin-right: 0;}
+    .release-from .release-from-td{width: 100%;height: auto;float: left;margin:0;position: relative;}
+    .release-from .release-from-td .tr-labe{width: 19%;height: 8vw;float: left;text-align: left;margin-right: 1vw;}
+    .release-from .release-from-td .tr-labe.none{margin-right: 0;}
+    .release-from .release-from-td .tr-labe .tr-input{width: 100%;height: 8vw;font-size: 14px;color: #627386;line-height: 8vw;box-sizing: border-box;border: 1px solid #B8BFCA;padding: 0 1vw;border-radius: 1vw;}
+    .release-from .release-from-td .tr-icon{width: 8vw;height: 8vw;box-sizing: border-box;padding: 4px;float: left;cursor: pointer;}
+    .release-from .release-from-td .tr-icon .WEB-icon:before{content:'';display:inline-block;background:url(/img/base/WEB-icon.png) no-repeat;font-size:0;}
+    .release-from .release-from-td .tr-icon .add:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -51px -1px;margin-right: 2px;}
+    .release-from .release-from-td .tr-icon .del:before{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background-position: -77px -1px;margin-right: 2px;}
+    .release-from .release-input{width: 100%;height: auto;float: left;position: relative;}
+    .release-from .release-input .yang{width: 8vw;position: absolute;left: 0;top: 0;line-height:13vw;text-align: center}
+    .release-from .release-input .input.price{padding-left: 7vw}
+    .release-from .release-input{position: relative}
+    .release-from .release-input.expen{margin-top:5.5vw;}
+    .release-from .release-input.expen .input{padding-left:6vw;}
+    .release-from .release-input.expen .span{width:6vw;height:11.8vw;display:block;position:absolute;top:0;left:0;text-align:center;line-height:11.8vw;font-size:3.4vw;color:#22272e;}
+
+    .release-from .release-input .release-radios{ padding:0 2.5vw;height:10vw;margin-right:2.7vw;line-height:10vw;box-sizing:border-box;font-size:3.4vw;text-align:center;display:block;border: 1px solid #B8BFCA;position: relative;border-radius: 2px;float: left; }
+    .release-from .release-input .release-radios.active{border-color: #FF2A2A;color: #FF5B00;}
+    .release-from .release-input .release-radios.active:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
+    .release-main-tips{width: 100%;height: 18vw;box-sizing: border-box;padding: 2vw 1vw;background: linear-gradient(90deg, #FFFFFF 0%, #FFEEE5 51%, #FFFFFF 100%);font-size: 3.2vw;color: #FF5B00;line-height: 5vw;}
+
+    /*销售信息*/
+    input[type="radio"]{opacity:0;}
+    .release-from .release-input .release-props{width: 100%;height: 36px;}
+    .release-from .release-input .release-props .release-radio{    width: 26.7vw;height: 11.2vw;margin-right: 2.7vw;line-height: 11.2vw;box-sizing: border-box;font-size: 3.4vw;text-align: center;display: inline-block}
+    /*.release-from .release-input .release-props .release-radio.second{width:100px;}*/
+    .release-from .release-input .release-props .release-radio input{display:none}
+    .release-from .release-input .release-props .release-radio i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:.27vw solid #b8bfca;color:#627386;}
+    .release-from .release-input .release-props .release-radio i:before{position:absolute;right:0;bottom:0;display:none;width:5.3vw;height:5.3vw;background-position:-75.7vw -8.5vw}
+    .release-from .release-input .release-props .release-radio input:checked + i{border-color:#FF5B00;color:#FF5B00}
+    .release-from .release-input .release-props .release-radio input:checked + i:before{display:block}
+    .release-from .release-input .release-province{width: 100%;height: auto;margin-top: 5.3vw;}
+    .release-from .release-input .release-province .province-item{line-height:8vw;padding: 0 2.7vw;text-align: center;font-size: 3.2vw;color: #627386;background: #F0F3F7;border-radius: .27vw;display: block;margin: 0 .27vw .27vw 0;float: left;}
+    .release-from .release-input .release-province .province-item.active{background: #FF5B00;color: #FFF;}
+    .release-from .release-input .tax{color: #627386;float: left;}
+    .release-from .secondbtn {width: 100%;padding: 2.7vw 0;text-align: center;}
+    .release-from .secondbtn .btn {box-sizing: border-box;width:40vw;height: 11.2vw;border-radius:.53vw;display: block;line-height:11.2vw;text-align: center;display: inline-block;margin: 0 1.3vw;}
+    .release-from .secondbtn .btn.next{width: 40vw;display: inline-block;}
+    .release-from .secondbtn .btn.next {background-color: #FF5B00;color: #fff;}
+    .release-from .secondbtn .btn.prev {border: .27vw solid #FF5B00;background-color: #ffe6dc;color: #FF5B00;}
+    .release-from .release-input .tax .mg{display: block;width: 54vw;height: 11.7vw;line-height: 11.7vw;border: .27vw solid #b8bfca;color: #22272e;padding-left: 2.7vw;}
+    .release-from .release-input .edit-btn{width: 30.4vw;height: 11.7vw;line-height: 11.7vw;text-align: center;color: #FF5B00;background: #ffe6dc;border: .27vw solid #FF5B00;float: left;margin-top: 8vw;margin-left: 2.7vw}
+    .popup-layer .popup-content .popup-from input{height: 8.8vw;width: 55.5vw;padding-left: 2.7vw;border: .27vw solid #b8bfca}
+    .popup-layer .popup-content .popup-from .poze{width: 40px;text-align: center;font-size: 3.4vw;position: absolute;right: 0;top: 0;height: -webkit-fill-available}
+    .popup-layer.edit{height: 62.3vw;}
+    .release-from .release-input.upload.image{width: 100%;}
+    .release-from .upload-file {width: 26vw;height: 26vw;border: .27vw solid #EBEBEB;border-radius: .53vw;position: relative;float: left;margin-right: 2.7vw;margin-bottom: 2.7vw;cursor: pointer;}
+    .release-from .upload-file .input-file {width: 26vw;height: 26vw;opacity: 0;cursor: pointer;}
+    .release-from .upload-file .upload-img {width: 100%;height: 100%;display: block;border-radius:.53vw;}
+    .mIcon.icon-del:before{width: 5.3vw;height: 5.3vw;background-position: -89.8vw -7.6vw;position: absolute;top: -.8vw;right: -.8vw}
+    .mIcon.icon-add:before{width: 8vw;height: 8vw;background-position: -8.2vw -60.3vw;position: absolute;top: 5.5vw;right: 9vw}
+    .add-text {font-size: 3.6vw;color: #333330;opacity: 0.5;position: absolute;top: 61%;right: 5.3vw;}
+    .release-from.text p .em {color: #FF5B00;}
+    .imgText .text{color: #627386;font-size: 3vw;}
+    .ck-editor__main p{height: 42.4vw;}
+    .release-from .last  .btn{width: 25.2vw}
+    .release-from .secondbtn .btn.next{width: 25.2vw}
+    .release-from .tags-main .item-tags {padding: 0 2.7vw;line-height: 8vw;background: #ffe6dc;text-align: center;font-size: 3.2vw;color: #FF5B00;margin: 1.3vw;border-radius: .53vw;float: left;position: relative;}
+    .mIcon.del-tags:before{width: 4.3vw;height: 4.3vw;background-position: -26.4vw -9vw;position: absolute;top: -2vw;}
+    .mIcon.del-btn:before{width: 5.3vw;background-position: -98.4vw -9.3vw;height: 5.3vw;position: absolute;top: 0;right: 0}
+    .select-main {margin-bottom: 2.7vw; position: relative}
+    .select-main  .option-main{border: .27vw solid rgba(184,191,202,.5)}
+    .select-main  .option-main  .option{padding:0 2.7vw;color: #9aa5b5}
+    .selected.mIcon:before{width: 5.3vw;height: 5.3vw;background-position: -51.2vw -.27vw;position: absolute;top: 4vw;right: 2.7vw}
+    /* 运费模板弹窗 */
+    .el-message{min-width: 280px !important;}
+    .el-dialog__body{padding: 1vw 2vw !important;box-sizing: border-box;max-height: 620px;}
+    .el-form-content{width: 100%;max-height: 500px;overflow: hidden;overflow-y: scroll;box-sizing: border-box;padding: 0 2vw;}
+    .box-row.el-row span{font-size: 3.2vw;}
+    .el-form-list{width: 100%;height: auto;border: 1px solid #B8BFCA;border-radius: 2px;margin-bottom: 10px;}
+    .el-form-list:last-child{margin-bottom: 0;}
+    .el-form-list-title{width: 100%;box-sizing: border-box;padding: 0 13px;line-height: 40px;background: #F5F5F5;font-size: 14px;color: #333333; position: relative;}
+    .el-form-list-title .el-form-close{width: 20px;height: 20px;line-height: 20px;background: #F94B4B;text-align: center;color: #FFFFFF;cursor: pointer;position: absolute;right: 0;top: 0;}
+    .el-form-list-roles{box-sizing: border-box;padding: 0 13px;}
+    .el-form-list-roles.rol3{border-top: 1px solid #B8BFCA;border-bottom: 1px solid #B8BFCA;}
+    .el-form-role3,.el-form-role5{align-items: center;box-sizing: border-box;display: flex;justify-content: space-between;padding: 12px 0;}
+    .el-form-role3-ns,.el-form-role5-ns{width: 550px;line-height: 24px;}
+    .el-form-add{ width: 100%;box-sizing: border-box;line-height: 24px;font-size: 14px;color: #FF5B00;}
+    /* 运费规则弹窗 */
+    .el-area-wup{margin-bottom: 20px;}
+    .el-area-box{display: flex;flex-wrap: wrap;}
+    .el-area-checkbox{align-items: center;display: flex;flex: 0 0 auto;margin: 10px 16px 0 0;}
+    .el-area-label{ margin-left: 8px;cursor: pointer;}
+    .el-area-label.disabled{ color: #9AA5B5;cursor: not-allowed;}
+    /* 运费规则弹窗 */
+    .box-row-col{width: 100%;height: auto;background: #F7F7F7;box-sizing: border-box;padding: 16px;}
+    footer{display: none;}
+}

src/main/resources/static/css/user-center/account/beans.css

@@ -1,83 +1,83 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*采美豆右侧*/
-    .crumbs{font-size: 16px;}
-    .pageWrap{width: 968px;}
-    .navLayout{min-height: 500px;}
-    .beans-header{width:100%;height:120px;box-sizing:border-box;padding:24px;background:url("/img/account/icon-beans-bg.png")no-repeat;background-size: cover;}
-    .beans-header-l{float: left;line-height: 78px;color: #FFFFFF;font-size: 16px;}
-    .beans-header-l span.big{font-size: 24px;font-weight: bold;}
-    .beans-header-r{float: right;line-height: 78px;}
-    .beans-header-r a{color: #FFFFFF;font-size: 14px;}
-    .beans-header-r a .icon{width:16px;height:16px;display: block;float: right;margin-left: 3px;}
-    .beans-header-r a .icon:before{width:16px;height:16px;background-position:-241px -550px}
-    .beans-container{width: 100%;min-height: 500px;background-color: #FFFFFF;margin-top: 16px;}
-    .beans-content-tabs{width: 100%;height: 96px;box-sizing: border-box;padding:0 24px;}
-    .beans-content-tabs .tabs-main{width: 100%;height:100%;border-bottom: 1px solid #e2e7ef;box-sizing: border-box;padding:33px 0; position: relative;}
-    .beans-content-tabs .time-template{width: 184px;height: 100%;margin: 0 auto;}
-    .beans-content-tabs .time-template .time-pre{width: 30px;height: 100%;float: left;display: block;cursor: pointer;}
-    .beans-content-tabs .time-template .time-pre .icon{width:30px;height:30px;display: block;}
-    .beans-content-tabs .time-template .time-pre .icon:before{width:30px;height:30px;background-position:-269px -550px}
-    .beans-content-tabs .time-template .time-text{width: 124px;height: 100%;float: left;line-height: 30px;text-align: center;font-size: 16px;color: #22272e;}
-    .beans-content-tabs .time-template .time-next{width: 30px;height: 100%;float: left;display: block;cursor: pointer;}
-    .beans-content-tabs .time-template .time-next .icon{width:30px;height:30px;display: block;}
-    .beans-content-tabs .time-template .time-next .icon:before{width:30px;height:30px;background-position:-311px -550px}
-    .beans-content-tabs .time-tabs{width: 216px;height:30px;position: absolute;right: 0;top: 33px;cursor: pointer;}
-    .beans-content-tabs .time-tabs-cell{width: 72px;height: 100%;float: left;text-align: center;font-size: 14px;color: #22272e;line-height: 30px;display: block;cursor: pointer;}
-    .beans-content-tabs .time-tabs-cell.active{color: #FF5B00;}
-
-    .beans-content-list{width: 100%;height: auto;box-sizing: border-box;padding:24px;}
-    .beans-content-list .beans-list-cell{width: 100%;height: 60px;box-sizing: border-box;float: left;margin-bottom: 10px;}
-    .beans-content-list .list-cell-left{width: 50%;height: 60px;float: left;text-align: left;}
-    .beans-content-list p{width: 100%;height: 32px;float: left;line-height: 32px;font-size: 16px;color: #22272e;}
-    .beans-content-list p.none{color: #627386;font-size: 14px;line-height: 28px;}
-    .beans-content-list p.blod{font-weight: bold;line-height: 28px;}
-    .beans-content-list .list-cell-right{width: 50%;height: 60px;float: right;text-align: right;}
-    .empty{width: 100%;float: left;}
-    .empty img{width: 180px;height: 180px;}
-
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .beans-header{width:100%;height:28vw;box-sizing:border-box;padding:4vw 8vw;background:url("/img/account/icon-beans-bg.png")no-repeat;background-size: cover;}
-    .beans-header-l{float: left;line-height: 10vw;color: #FFFFFF;font-size:3.2vw;}
-    .beans-header-l span{display: inline-block;width: 100%;height: 10vw;float: left;}
-    .beans-header-l span.big{font-size: 7.2vw;font-weight: bold;}
-    .beans-header-r{float: right;line-height:20vw;}
-    .beans-header-r a{color: #FFFFFF;font-size: 3vw;}
-    .beans-header-r a .icon{width:4vw;height:4vw;display: block;float: right;margin-left: 1vw;}
-    .beans-header-r a .icon:before{width:4vw;height:4vw;background-position:-44.6vw -78.3vw;}
-    .beans-container{width: 100%;min-height: 50vw;background-color: #FFFFFF;margin-top:2vw;}
-    .beans-content-tabs{width: 100%;height: auto;box-sizing: border-box;padding:0 3.4vw;}
-    .beans-content-tabs .tabs-main{width: 100%;height:100%;border-bottom: 1px solid #e2e7ef;box-sizing: border-box;padding-top: 6.4vw;position: relative;float: left;}
-    .beans-content-tabs .time-template{width: 100%;height: 6.7vw;float: left;box-sizing: border-box;padding: 0 25vw;}
-    .beans-content-tabs .time-template .time-pre{width: 6.7vw;height: 6.7vw;float: left;display: block;}
-    .beans-content-tabs .time-template .time-pre .icon{width:6.7vw;height:6.7vw;display: block;}
-    .beans-content-tabs .time-template .time-pre .icon:before{width:6.7vw;height:6.7vw;background-position:-51.2vw -78.3vw}
-    .beans-content-tabs .time-template .time-text{width: 28.4vw;height: 6.7vw;float: left;line-height: 6.7vw;text-align: center;font-size: 3.4vw;color: #22272e;}
-    .beans-content-tabs .time-template .time-next{width: 6.7vw;height: 6.7vw;float: left;display: block;}
-    .beans-content-tabs .time-template .time-next .icon{width:6.7vw;height:6.7vw;display: block;}
-    .beans-content-tabs .time-template .time-next .icon:before{width:6.7vw;height:6.7vw;background-position:-60.4vw -78.3vw}
-    .beans-content-tabs .time-tabs{width:100%;height:9.6vw;float: left;margin-top: 3.6vw;}
-    .beans-content-tabs .time-tabs-cell{width: 33.3%;height: 100%;float: left;text-align: center;font-size: 4vw;color: #22272e;line-height: 9.6vw;display: block;}
-    .beans-content-tabs .time-tabs-cell.active{color: #FF5B00;font-weight: bold;}
-
-    .beans-content-list{width: 100%;height: auto;box-sizing: border-box;padding:3.4vw;float: left;}
-    .beans-content-list .beans-list-cell{width: 100%;height: 10.7vw;box-sizing: border-box;float: left;margin-bottom: 6.4vw;}
-    .beans-content-list .list-cell-left{width: 50%;height: 10.7vw;float: left;text-align: left;}
-    .beans-content-list p{width: 100%;height: 4.7vw;float: left;line-height:  4.7vw;font-size: 3.6vw;color: #22272e;margin-bottom: 2vw;}
-    .beans-content-list p.none{color: #627386;font-size: 3.2vw;line-height: 4.2vw;}
-    .beans-content-list p.blod{font-weight: bold;line-height: 4.2vw;}
-    .beans-content-list .list-cell-right{width: 50%;height:10.7vw;float: right;text-align: right;}
-    .empty{width: 100%;float: left;}
-    .empty img{width: 36vw;height: 36vw;}
-
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*采美豆右侧*/
+    .crumbs{font-size: 16px;}
+    .pageWrap{width: 968px;}
+    .navLayout{min-height: 500px;}
+    .beans-header{width:100%;height:120px;border-radius: 8px;box-sizing:border-box;padding:24px;background:url("/img/account/icon-beans-bg.png")no-repeat;background-size: cover;}
+    .beans-header-l{float: left;line-height: 78px;color: #FFFFFF;font-size: 16px;}
+    .beans-header-l span.big{font-size: 24px;font-weight: bold;}
+    .beans-header-r{float: right;line-height: 78px;}
+    .beans-header-r a{color: #FFFFFF;font-size: 14px;}
+    .beans-header-r a .icon{width:16px;height:16px;display: block;float: right;margin-left: 3px;}
+    .beans-header-r a .icon:before{width:16px;height:16px;background-position:-241px -550px}
+    .beans-container{width: 100%;min-height: 500px;background-color: #FFFFFF;margin-top: 16px;border-radius: 8px;}
+    .beans-content-tabs{width: 100%;height: 96px;box-sizing: border-box;padding:0 24px;}
+    .beans-content-tabs .tabs-main{width: 100%;height:100%;border-bottom: 1px solid #e2e7ef;box-sizing: border-box;padding:33px 0; position: relative;}
+    .beans-content-tabs .time-template{width: 184px;height: 100%;margin: 0 auto;}
+    .beans-content-tabs .time-template .time-pre{width: 30px;height: 100%;float: left;display: block;cursor: pointer;}
+    .beans-content-tabs .time-template .time-pre .icon{width:30px;height:30px;display: block;}
+    .beans-content-tabs .time-template .time-pre .icon:before{width:30px;height:30px;background-position:-269px -550px}
+    .beans-content-tabs .time-template .time-text{width: 124px;height: 100%;float: left;line-height: 30px;text-align: center;font-size: 16px;color: #22272e;}
+    .beans-content-tabs .time-template .time-next{width: 30px;height: 100%;float: left;display: block;cursor: pointer;}
+    .beans-content-tabs .time-template .time-next .icon{width:30px;height:30px;display: block;}
+    .beans-content-tabs .time-template .time-next .icon:before{width:30px;height:30px;background-position:-311px -550px}
+    .beans-content-tabs .time-tabs{width: 216px;height:30px;position: absolute;right: 0;top: 33px;cursor: pointer;}
+    .beans-content-tabs .time-tabs-cell{width: 72px;height: 100%;float: left;text-align: center;font-size: 14px;color: #22272e;line-height: 30px;display: block;cursor: pointer;}
+    .beans-content-tabs .time-tabs-cell.active{color: #FF5B00;}
+
+    .beans-content-list{width: 100%;height: auto;box-sizing: border-box;padding:24px;}
+    .beans-content-list .beans-list-cell{width: 100%;height: 60px;box-sizing: border-box;float: left;margin-bottom: 10px;}
+    .beans-content-list .list-cell-left{width: 50%;height: 60px;float: left;text-align: left;}
+    .beans-content-list p{width: 100%;height: 32px;float: left;line-height: 32px;font-size: 16px;color: #22272e;}
+    .beans-content-list p.none{color: #627386;font-size: 14px;line-height: 28px;}
+    .beans-content-list p.blod{font-weight: bold;line-height: 28px;}
+    .beans-content-list .list-cell-right{width: 50%;height: 60px;float: right;text-align: right;}
+    .empty{width: 100%;float: left;}
+    .empty img{width: 180px;height: 180px;}
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .beans-header{width:100%;height:28vw;box-sizing:border-box;padding:4vw 8vw;background:url("/img/account/icon-beans-bg.png")no-repeat;background-size: cover;}
+    .beans-header-l{float: left;line-height: 10vw;color: #FFFFFF;font-size:3.2vw;}
+    .beans-header-l span{display: inline-block;width: 100%;height: 10vw;float: left;}
+    .beans-header-l span.big{font-size: 7.2vw;font-weight: bold;}
+    .beans-header-r{float: right;line-height:20vw;}
+    .beans-header-r a{color: #FFFFFF;font-size: 3vw;}
+    .beans-header-r a .icon{width:4vw;height:4vw;display: block;float: right;margin-left: 1vw;}
+    .beans-header-r a .icon:before{width:4vw;height:4vw;background-position:-44.6vw -78.3vw;}
+    .beans-container{width: 100%;min-height: 50vw;background-color: #FFFFFF;margin-top:2vw;}
+    .beans-content-tabs{width: 100%;height: auto;box-sizing: border-box;padding:0 3.4vw;}
+    .beans-content-tabs .tabs-main{width: 100%;height:100%;border-bottom: 1px solid #e2e7ef;box-sizing: border-box;padding-top: 6.4vw;position: relative;float: left;}
+    .beans-content-tabs .time-template{width: 100%;height: 6.7vw;float: left;box-sizing: border-box;padding: 0 25vw;}
+    .beans-content-tabs .time-template .time-pre{width: 6.7vw;height: 6.7vw;float: left;display: block;}
+    .beans-content-tabs .time-template .time-pre .icon{width:6.7vw;height:6.7vw;display: block;}
+    .beans-content-tabs .time-template .time-pre .icon:before{width:6.7vw;height:6.7vw;background-position:-51.2vw -78.3vw}
+    .beans-content-tabs .time-template .time-text{width: 28.4vw;height: 6.7vw;float: left;line-height: 6.7vw;text-align: center;font-size: 3.4vw;color: #22272e;}
+    .beans-content-tabs .time-template .time-next{width: 6.7vw;height: 6.7vw;float: left;display: block;}
+    .beans-content-tabs .time-template .time-next .icon{width:6.7vw;height:6.7vw;display: block;}
+    .beans-content-tabs .time-template .time-next .icon:before{width:6.7vw;height:6.7vw;background-position:-60.4vw -78.3vw}
+    .beans-content-tabs .time-tabs{width:100%;height:9.6vw;float: left;margin-top: 3.6vw;}
+    .beans-content-tabs .time-tabs-cell{width: 33.3%;height: 100%;float: left;text-align: center;font-size: 4vw;color: #22272e;line-height: 9.6vw;display: block;}
+    .beans-content-tabs .time-tabs-cell.active{color: #FF5B00;font-weight: bold;}
+
+    .beans-content-list{width: 100%;height: auto;box-sizing: border-box;padding:3.4vw;float: left;}
+    .beans-content-list .beans-list-cell{width: 100%;height: 10.7vw;box-sizing: border-box;float: left;margin-bottom: 6.4vw;}
+    .beans-content-list .list-cell-left{width: 50%;height: 10.7vw;float: left;text-align: left;}
+    .beans-content-list p{width: 100%;height: 4.7vw;float: left;line-height:  4.7vw;font-size: 3.6vw;color: #22272e;margin-bottom: 2vw;}
+    .beans-content-list p.none{color: #627386;font-size: 3.2vw;line-height: 4.2vw;}
+    .beans-content-list p.blod{font-weight: bold;line-height: 4.2vw;}
+    .beans-content-list .list-cell-right{width: 50%;height:10.7vw;float: right;text-align: right;}
+    .empty{width: 100%;float: left;}
+    .empty img{width: 36vw;height: 36vw;}
+
+}
+

src/main/resources/static/css/user-center/account/cards.css

@@ -1,179 +1,179 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*采美豆右侧*/
-    .crumbs{font-size: 16px;}
-    .pageWrap{width: 968px;}
-    .navLayout{min-height: 500px;}
-    .cards-container{width: 100%;min-height: 500px;background-color: #FFFFFF;margin-top: 16px;box-sizing: border-box;padding: 24px 264px 24px 32px;}
-    .cards-list{width: 312px;height: 112px;box-sizing: border-box;padding: 16px;border-radius: 4px;float: left;margin: 0 24px 24px 0;position: relative;}
-    .cards-list.ABC{background-image: linear-gradient(90deg, #19B8B2 0%, #009C96 100%);}
-    .cards-list.BCCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list.BOC{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.BOCO{background-image: linear-gradient(90deg, #7275BE 0%, #434492 100%);}
-    .cards-list.CCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list.CEB{background-image: linear-gradient(90deg, #B673CB 0%, #843C9A 100%);}
-    .cards-list.CGB{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.CIB{background-image: linear-gradient(90deg, #457EBC 0%, #1B518A 100%);}
-    .cards-list.CMBC{background-image: linear-gradient(90deg, #3C9EC2 0%, #0584B4 100%);}
-    .cards-list.CMBCHINA{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.ECITIC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.HXB{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.ICBC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.PINGAN{background-image: linear-gradient(90deg, #F5A15A 0%, #E47F29 100%);}
-    .cards-list.POST{background-image: linear-gradient(90deg, #3EB97B 0%, #11874B 100%);}
-    .cards-list.SHB{background-image: linear-gradient(90deg, #6479C8 0%, #314693 100%);}
-    .cards-list.SPDB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list .list-logo{width: 36px;height: 100%;float: left;}
-    .cards-list .list-logo .logo{width: 36px;height: 36px;border-radius: 50%;padding: 6px;box-sizing: border-box;background-color: #ffffff;float: left;}
-    .cards-list .list-logo .logo img{width: 24px;height: 24px;border-radius: 50%;display: block;}
-    .cards-list-add{width: 312px;height: 112px;box-sizing: border-box;cursor: pointer; padding: 16px;border-radius: 4px;float: left;border: 1px dashed #B8BFCA;display: flex;align-items: center;justify-content: center;flex-direction: column;}
-    .cards-list-add .icon{width:24px ;height:24px;display: inline-block;float: left;margin-right: 10px;}
-    .cards-list-add .icon:before{width:24px ;height:24px;background-position: -236px -597px;}
-    .cards-list-add span{display: inline-block;line-height: 24px;font-size: 14px;color: #333;}
-    .list-main{width: 228px;float: left;margin-left: 16px;}
-    .list-main .list-main-name{width: 100%;height: 22px;line-height: 22px;font-size: 16px;color: #ffffff;}
-    .list-main .list-main-tag{width: 100%;height: 20px;margin:4px 0 14px 0;}
-    .list-main .list-main-tag .tag{display: inline-block;line-height: 20px;padding: 0 5px;border-radius: 2px;font-size: 12px;color: #ffffff;background: rgba(255, 255, 255, 0.2);float: left;}
-    .list-main .list-main-code{width: 100%;height: 22px;line-height: 22px;font-size: 16px;color: #ffffff;}
-    .list-btn{font-size: 14px;color: #ffffff;height: 22px;line-height: 22px;position: absolute;right: 16px;top: 16px;cursor: pointer;}
-    /*快捷支付弹窗*/
-    .model-cards-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
-    .model-cards-popup .model-content{width:710px;height:480px;padding: 16px 32px; position:absolute;top:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
-    .model-content .title{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
-    .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:0;top: 0;background: url("/img/base/icon.png")-315px 0 no-repeat;cursor: pointer;}
-    .model-content .title .title-tabs{width: 100%;height: 27px;float: left;}
-    .model-content .title .title-tabs a{width: 100px;height: 27px;float: left;margin-right: 64px;display: block;font-size: 16px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 3px solid #FFFFFF;color: #333333;}
-    .model-content .title .title-tabs a.current{ font-weight: bold;border-color: #FF5B00;}
-    .model-content .content{ width:100%;height:330px;box-sizing:border-box;float:left;overflow:hidden;overflow-y:auto }
-    .model-content .content .list{width: 142px;height: 46px;display: block;margin:0 16px 16px 0;float: left;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
-    .model-content .content .list img{width: 100%;height: 100%;display: block;}
-    .model-content .content .list.current{border-color: #FF2A2A;}
-    .model-content .content .list.current:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
-    .model-content .button{width: 100%;height: 50px;float: left;margin-top: 10px;}
-    .model-content .button .button-btn{display: block;width: 232px;height: 50px;margin: 0 auto;box-sizing: border-box;border: 1px solid #FF5B00;background: #FF5B00;line-height: 50px;text-align: center;font-size: 14px;color: #FFFFFF;}
-    .model-content .button .button-btn.disabled{border: 1px solid #B8BFCA;background: #B8BFCA;color: #FFFFFF;}
-    .model-content .content .content-labe{width: 100%;height: 38px;line-height: 38px;float: left;font-size: 14px;color: #333333;}
-    .model-content .content .content-labe.sen{margin-bottom: 10px;}
-    .model-content .content .content-labe p{float: left;}
-    .model-content .content .content-labe img{width: 120px;height: 38px;display: block;margin: 0 10px 0 10px;float: left;border-radius: 2px;}
-    .model-content .content .content-labe .form-type{float: left; height:100%; box-sizing: border-box;padding:10px 11px;}
-    .model-content .content .content-labe .form-type .form-radio {height: 18px;margin-right: 40px;line-height: 18px;box-sizing: border-box;float: left;cursor: pointer;}
-    .model-content .content .content-labe .form-type .form-radio input{box-sizing: border-box;width: 100%;height: 16px;line-height: 18px;text-indent: 1.2em;background-color: #FFF;border: 1px solid #b8bfca;border-radius: 2px;display: none;}
-    .model-content .content .content-labe .form-type .form-radio .icon{display: block;font-style: normal;cursor: pointer;width: 18px;height: 18px;position: relative;overflow: hidden;float: left;}
-    .model-content .content .content-labe .form-type .form-radio span{font-size: 14px;color: #666666;font-weight: normal;margin-left: 5px;}
-    .model-content .content .content-labe .form-type .form-radio input:checked + i:before{ background-position: -277px -596px; }
-    .model-content .content .content-labe .form-type .form-radio .icon:before{position: absolute;left: 0;bottom: 0;width:18px ;height:18px;background-position: -311px -596px;}
-    .model-content .content .content-labe .form-label{width:  92px;height: 32px;float: left;line-height: 32px;text-align: right;font-size: 14px;color: #666666;}
-    .model-content .content .content-label{width: 100%;height:32px;float: left;line-height: 32px;text-align: left;font-size: 14px;color: #1890F9;box-sizing: border-box;}
-    .model-content .content .content-form{width: 100%;height: 32px;float: left;margin-bottom: 10px;}
-    .model-content .content .content-form.none{margin-bottom: 0;}
-    .model-content .content .content-tabs{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
-    .model-content .content .content-tabs a{width: 60px;height: 27px;float: left;margin-right: 24px;display: block;font-size: 13px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 1px solid #FFFFFF;color: #333333;}
-    .model-content .content .content-tabs a.current{ border-color: #FF5B00;}
-    .model-content .content .content-form .form-label{width: 70px;height: 32px;float: left;line-height: 32px;text-align: right;font-size: 14px;color: #666666;}
-    .model-content .content .content-form .form-label.sen{width: 92px;}
-    .model-content .content .content-form .form-label span{color: #F94B4B;}
-    .model-content .content .content-form .form-input{width: 500px;height: 32px;float: left;margin-left:10px;color: #F94B4B;box-sizing: border-box;padding: 0 13px;border:1px solid #B8BFCA;border-radius: 2px;}
-    .model-content .content .content-form .form-input input{width: 100%;height:30px;float: left;line-height: 30px;font-size: 14px;color: #333333;border: none;font-style: normal;}
-    .model-content .content .content-form .form-input.code{ width: 350px; }
-    .model-content .content .content-form .form-btn{width: 140px;height: 32px;float: left;margin-left: 20px;}
-    .model-content .content .content-form .form-btn a{display: block;width: 130px;height: 32px;box-sizing: border-box;background: #FF5B00;line-height: 32px;text-align: center;font-size: 14px;color: #FFFFFF;border-radius: 2px;}
-    .model-content .content .content-form .form-btn a.disabled{background: #B8BFCA;color: #FFFFFF;}
-    .model-content .content .content-form .form-text{ line-height: 32px; font-size: 14px;color: #333333; }
-    .model-content .content .content-error{ width: 100%;height: 22px;float: left;line-height: 22px;text-align: left;font-size: 12px;color: #FF0000;box-sizing: border-box;padding-left: 100px; }
-
-
-
-
-
-
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    body{background: #FFFFFF;}
-    .cards-container{width: 100%;min-height: 100vw;background-color: #FFFFFF;margin-top: 0;box-sizing: border-box;padding: 4.8vw;}
-    .cards-list{width: 100%;height:32.2vw;box-sizing: border-box;padding: 4vw;border-radius: 3.2vw;float: left;margin: 0 4.8vw 4.8vw 0;position: relative;}
-    .cards-list.ABC{background-image: linear-gradient(90deg, #19B8B2 0%, #009C96 100%);}
-    .cards-list.BCCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list.BOC{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.BOCO{background-image: linear-gradient(90deg, #7275BE 0%, #434492 100%);}
-    .cards-list.CCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list.CEB{background-image: linear-gradient(90deg, #B673CB 0%, #843C9A 100%);}
-    .cards-list.CGB{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.CIB{background-image: linear-gradient(90deg, #457EBC 0%, #1B518A 100%);}
-    .cards-list.CMBC{background-image: linear-gradient(90deg, #3C9EC2 0%, #0584B4 100%);}
-    .cards-list.CMBCHINA{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
-    .cards-list.ECITIC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.HXB{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.ICBC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
-    .cards-list.PINGAN{background-image: linear-gradient(90deg, #F5A15A 0%, #E47F29 100%);}
-    .cards-list.POST{background-image: linear-gradient(90deg, #3EB97B 0%, #11874B 100%);}
-    .cards-list.SHB{background-image: linear-gradient(90deg, #6479C8 0%, #314693 100%);}
-    .cards-list.SPDB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
-    .cards-list .list-logo{width: 10.7vw;height: 100%;float: left;}
-    .cards-list .list-logo .logo{width: 10.7vw;height: 10.7vw;border-radius: 50%;padding: 1.2vw;box-sizing: border-box;background-color: #ffffff;float: left;}
-    .cards-list .list-logo .logo img{width: 8.3vw;height: 8.3vw;border-radius: 50%;display: block;}
-    .cards-list-add{width: 100%;height:32.2vw;box-sizing: border-box;cursor: pointer; padding: 4vw;border-radius: 3.2vw;float: left;border: 1px dashed #B8BFCA;display: flex;align-items: center;justify-content: center;flex-direction: column;}
-    .cards-list-add .icon{width:6.4vw ;height:6.4vw;display: inline-block;float: left;margin-right: 2vw;}
-    .cards-list-add .icon:before{width:6.4vw ;height:6.4vw;background-position:-0.5vw -93vw;}
-    .cards-list-add span{display: inline-block;line-height: 6.4vw;font-size: 3.4vw;color: #333;}
-    .list-main{width: 66.6vw;float: left;margin-left: 4.6vw;}
-    .list-main .list-main-name{width: 100%;height: 6vw;line-height: 6vw;font-size: 3.4vw;color: #ffffff;}
-    .list-main .list-main-tag{width: 100%;height: 6vw;margin:1vw 0 4vw 0;}
-    .list-main .list-main-tag .tag{display: inline-block;line-height: 6vw;padding: 0 1.5vw;border-radius: 2px;font-size: 3.2vw;color: #ffffff;background: rgba(255, 255, 255, 0.2);float: left;}
-    .list-main .list-main-code{width: 100%;height: 10vw;line-height: 10vw;font-size: 3.8vw;color: #ffffff;}
-    .list-btn{font-size: 3.4vw;color: #ffffff;height: 6vw;line-height: 6vw;position: absolute;right: 4vw;top: 4vw;cursor: pointer;}
-    .model-cards-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
-    .model-cards-popup .model-content{width:100%;height:150vw;padding: 3.2vw 6vw; position:absolute;left:0;bottom:0;background-color:#FFFFFF;border-radius:2px;box-sizing:border-box}
-    .model-content .title{width: 100%;height: 8vw;box-sizing: border-box;float: left;position: relative;margin-bottom: 6vw;}
-    .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:0;top: 0;background: url("/img/base/icon.png")-315px 0 no-repeat;cursor: pointer;}
-    .model-content .title .title-tabs{width: 100%;height: 8vw;float: left;box-sizing: border-box;}
-    .model-content .title .title-tabs a{width: 100px;height: 8vw;float: left;display: block;font-size: 3.4vw;line-height: 7.8vw;text-align: center;box-sizing: border-box;border-bottom: 3px solid #FFFFFF;color: #333333;}
-    .model-content .title .title-tabs a.current{ font-weight: bold;border-color: #FF5B00;}
-    .model-content .content{ width:100%;height:110vw;box-sizing:border-box;float:left;overflow:hidden;overflow-y:auto }
-    .model-content .content .list{width: 25.2vw;height: 8vw;display: block;margin:0 3.5vw 3vw 0;float: left;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
-    .model-content .content .list img{width: 100%;height: 100%;display: block;}
-    .model-content .content .list.current{border-color: #FF2A2A;}
-    .model-content .content .list.current:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
-    .model-content .button{width: 100%;height: 11vw;float: left;margin-top: 4.8vw;}
-    .model-content .button .button-btn{display: block;width: 60vw;height: 11vw;margin: 0 auto;box-sizing: border-box;border: 1px solid #FF5B00;background: #FF5B00;line-height: 11vw;text-align: center;font-size: 14px;color: #FFFFFF;}
-    .model-content .button .button-btn.disabled{border: 1px solid #B8BFCA;background: #B8BFCA;color: #FFFFFF;}
-    .model-content .content .content-labe{width: 100%;height: 8vw;line-height: 8vw;float: left;font-size: 3.4vw;color: #333333;font-weight: bold;}
-    .model-content .content .content-labe.sen{margin-top: 3vw;}
-    .model-content .content .content-labe p{float: left;}
-    .model-content .content .content-labe img{width: 25.2vw;height: 8vw;display: block;margin-left: 4vw;float: left;border-radius: 2px;}
-    .model-content .content .content-labe .form-type{float: left; height:100%; box-sizing: border-box;padding:2vw 0;margin-left: 3vw;}
-    .model-content .content .content-labe .form-type .form-radio {height:4vw;margin-right: 2vw;line-height: 4vw;box-sizing: border-box;float: left;cursor: pointer;}
-    .model-content .content .content-labe .form-type .form-radio input{box-sizing: border-box;width: 100%;height: 4vw;line-height: 4vw;text-indent: 1.2em;background-color: #FFF;border: 1px solid #b8bfca;border-radius: 2px;display: none;}
-    .model-content .content .content-labe .form-type .form-radio .icon{display: block;font-style: normal;cursor: pointer;width: 4vw;height: 4vw;position: relative;overflow: hidden;float: left;}
-    .model-content .content .content-labe .form-type .form-radio span{font-size: 14px;color: #666666;font-weight: normal;margin-left: 5px;}
-    .model-content .content .content-labe .form-type .form-radio input:checked + i:before{ background-position: -10.1vw -93.7vw; }
-    .model-content .content .content-labe .form-type .form-radio .mIcon:before{position: absolute;left: 0;bottom: 0;width:4vw ;height:4vw;background-position: -18.2vw -93.7vw;}
-    .model-content .content .content-labe .form-label{float: left;}
-    .model-content .content .content-label{width: 100%;height:6vw;float: left;line-height: 6vw;text-align: left;font-size: 3.4vw;color: #1890F9;box-sizing: border-box;}
-    .model-content .content .content-form{width: 100%;height: auto;float: left;margin-bottom: 2vw;}
-    .model-content .content .content-form.none{margin-bottom: 0;}
-    .model-content .content .content-tabs{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
-    .model-content .content .content-tabs a{width: 60px;height: 27px;float: left;margin-right: 24px;display: block;font-size: 13px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 1px solid #FFFFFF;color: #333333;}
-    .model-content .content .content-tabs a.current{ border-color: #FF5B00;}
-    .model-content .content .content-form .form-label{width: 100%;height: 6vw;float: left;line-height: 6vw;text-align: left;font-size: 3.4vw;color: #666666;font-weight: bold;}
-    .model-content .content .content-form .form-label.card{width: auto;}
-    .model-content .content .content-form .form-label span{color: #F94B4B;}
-    .model-content .content .content-form .form-input{width: 100%;height: 10vw;float: left;color: #F94B4B;box-sizing: border-box;padding: 0 3vw;border:1px solid #B8BFCA;border-radius: 2px; }
-    .model-content .content .content-form .form-input input{width: 100%;height:9vw;float: left;line-height: 9vw;font-size: 3.4vw;color: #333333;border: none;font-style: normal;}
-    .model-content .content .content-form .form-input.code{ width: 54.8vw; }
-    .model-content .content .content-form .form-btn{width: 26vw;height: 10vw;float: left;margin-left: 20px;}
-    .model-content .content .content-form .form-btn a{display: block;width: 100%;height: 10vw;box-sizing: border-box;background: #FF5B00;line-height: 10vw;text-align: center;font-size: 3.4vw;color: #FFFFFF;}
-    .model-content .content .content-form .form-btn a.disabled{background: #B8BFCA;color: #FFFFFF;}
-    .model-content .content .content-form .form-text{ line-height: 6vw; font-size: 3.4vw;color: #333333;float: left; }
-    .model-content .content .content-error{ width: 100%;height: 6vw;float: left;line-height: 6vw;;text-align: left;font-size: 3.2vw;color: #FF0000; }
-    footer{display: none;}
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*采美豆右侧*/
+    .crumbs{font-size: 16px;}
+    .pageWrap{width: 968px;}
+    .navLayout{min-height: 500px;}
+    .cards-container{width: 100%;min-height: 500px;background-color: #FFFFFF;border-radius: 8px;box-sizing: border-box;padding: 24px 264px 24px 32px;}
+    .cards-list{width: 312px;height: 112px;box-sizing: border-box;padding: 16px;border-radius: 4px;float: left;margin: 0 24px 24px 0;position: relative;}
+    .cards-list.ABC{background-image: linear-gradient(90deg, #19B8B2 0%, #009C96 100%);}
+    .cards-list.BCCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list.BOC{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.BOCO{background-image: linear-gradient(90deg, #7275BE 0%, #434492 100%);}
+    .cards-list.CCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list.CEB{background-image: linear-gradient(90deg, #B673CB 0%, #843C9A 100%);}
+    .cards-list.CGB{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.CIB{background-image: linear-gradient(90deg, #457EBC 0%, #1B518A 100%);}
+    .cards-list.CMBC{background-image: linear-gradient(90deg, #3C9EC2 0%, #0584B4 100%);}
+    .cards-list.CMBCHINA{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.ECITIC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.HXB{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.ICBC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.PINGAN{background-image: linear-gradient(90deg, #F5A15A 0%, #E47F29 100%);}
+    .cards-list.POST{background-image: linear-gradient(90deg, #3EB97B 0%, #11874B 100%);}
+    .cards-list.SHB{background-image: linear-gradient(90deg, #6479C8 0%, #314693 100%);}
+    .cards-list.SPDB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list .list-logo{width: 36px;height: 100%;float: left;}
+    .cards-list .list-logo .logo{width: 36px;height: 36px;border-radius: 50%;padding: 6px;box-sizing: border-box;background-color: #ffffff;float: left;}
+    .cards-list .list-logo .logo img{width: 24px;height: 24px;border-radius: 50%;display: block;}
+    .cards-list-add{width: 312px;height: 112px;box-sizing: border-box;cursor: pointer; padding: 16px;border-radius: 8px;float: left;border: 1px dashed #B8BFCA;display: flex;align-items: center;justify-content: center;flex-direction: column;}
+    .cards-list-add .icon{width:24px ;height:24px;display: inline-block;float: left;margin-right: 10px;}
+    .cards-list-add .icon:before{width:24px ;height:24px;background-position: -236px -597px;}
+    .cards-list-add span{display: inline-block;line-height: 24px;font-size: 14px;color: #333;}
+    .list-main{width: 228px;float: left;margin-left: 16px;}
+    .list-main .list-main-name{width: 100%;height: 22px;line-height: 22px;font-size: 16px;color: #ffffff;}
+    .list-main .list-main-tag{width: 100%;height: 20px;margin:4px 0 14px 0;}
+    .list-main .list-main-tag .tag{display: inline-block;line-height: 20px;padding: 0 5px;border-radius: 2px;font-size: 12px;color: #ffffff;background: rgba(255, 255, 255, 0.2);float: left;}
+    .list-main .list-main-code{width: 100%;height: 22px;line-height: 22px;font-size: 16px;color: #ffffff;}
+    .list-btn{font-size: 14px;color: #ffffff;height: 22px;line-height: 22px;position: absolute;right: 16px;top: 16px;cursor: pointer;}
+    /*快捷支付弹窗*/
+    .model-cards-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
+    .model-cards-popup .model-content{width:710px;height:480px;padding: 16px 32px; position:absolute;top:0;left:0;right:0;bottom:0;background-color:#FFFFFF;margin:auto;border-radius:2px;box-sizing:border-box}
+    .model-content .title{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
+    .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:0;top: 0;background: url("/img/base/icon.png")-315px 0 no-repeat;cursor: pointer;}
+    .model-content .title .title-tabs{width: 100%;height: 27px;float: left;}
+    .model-content .title .title-tabs a{width: 100px;height: 27px;float: left;margin-right: 64px;display: block;font-size: 16px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 3px solid #FFFFFF;color: #333333;}
+    .model-content .title .title-tabs a.current{ font-weight: bold;border-color: #FF5B00;}
+    .model-content .content{ width:100%;height:330px;box-sizing:border-box;float:left;overflow:hidden;overflow-y:auto }
+    .model-content .content .list{width: 142px;height: 46px;display: block;margin:0 16px 16px 0;float: left;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
+    .model-content .content .list img{width: 100%;height: 100%;display: block;}
+    .model-content .content .list.current{border-color: #FF2A2A;}
+    .model-content .content .list.current:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
+    .model-content .button{width: 100%;height: 50px;float: left;margin-top: 10px;}
+    .model-content .button .button-btn{display: block;width: 232px;height: 50px;margin: 0 auto;box-sizing: border-box;border: 1px solid #FF5B00;background: #FF5B00;line-height: 50px;text-align: center;font-size: 14px;color: #FFFFFF;}
+    .model-content .button .button-btn.disabled{border: 1px solid #B8BFCA;background: #B8BFCA;color: #FFFFFF;}
+    .model-content .content .content-labe{width: 100%;height: 38px;line-height: 38px;float: left;font-size: 14px;color: #333333;}
+    .model-content .content .content-labe.sen{margin-bottom: 10px;}
+    .model-content .content .content-labe p{float: left;}
+    .model-content .content .content-labe img{width: 120px;height: 38px;display: block;margin: 0 10px 0 10px;float: left;border-radius: 2px;}
+    .model-content .content .content-labe .form-type{float: left; height:100%; box-sizing: border-box;padding:10px 11px;}
+    .model-content .content .content-labe .form-type .form-radio {height: 18px;margin-right: 40px;line-height: 18px;box-sizing: border-box;float: left;cursor: pointer;}
+    .model-content .content .content-labe .form-type .form-radio input{box-sizing: border-box;width: 100%;height: 16px;line-height: 18px;text-indent: 1.2em;background-color: #FFF;border: 1px solid #b8bfca;border-radius: 2px;display: none;}
+    .model-content .content .content-labe .form-type .form-radio .icon{display: block;font-style: normal;cursor: pointer;width: 18px;height: 18px;position: relative;overflow: hidden;float: left;}
+    .model-content .content .content-labe .form-type .form-radio span{font-size: 14px;color: #666666;font-weight: normal;margin-left: 5px;}
+    .model-content .content .content-labe .form-type .form-radio input:checked + i:before{ background-position: -277px -596px; }
+    .model-content .content .content-labe .form-type .form-radio .icon:before{position: absolute;left: 0;bottom: 0;width:18px ;height:18px;background-position: -311px -596px;}
+    .model-content .content .content-labe .form-label{width:  92px;height: 32px;float: left;line-height: 32px;text-align: right;font-size: 14px;color: #666666;}
+    .model-content .content .content-label{width: 100%;height:32px;float: left;line-height: 32px;text-align: left;font-size: 14px;color: #1890F9;box-sizing: border-box;}
+    .model-content .content .content-form{width: 100%;height: 32px;float: left;margin-bottom: 10px;}
+    .model-content .content .content-form.none{margin-bottom: 0;}
+    .model-content .content .content-tabs{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
+    .model-content .content .content-tabs a{width: 60px;height: 27px;float: left;margin-right: 24px;display: block;font-size: 13px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 1px solid #FFFFFF;color: #333333;}
+    .model-content .content .content-tabs a.current{ border-color: #FF5B00;}
+    .model-content .content .content-form .form-label{width: 70px;height: 32px;float: left;line-height: 32px;text-align: right;font-size: 14px;color: #666666;}
+    .model-content .content .content-form .form-label.sen{width: 92px;}
+    .model-content .content .content-form .form-label span{color: #F94B4B;}
+    .model-content .content .content-form .form-input{width: 500px;height: 32px;float: left;margin-left:10px;color: #F94B4B;box-sizing: border-box;padding: 0 13px;border:1px solid #B8BFCA;border-radius: 2px;}
+    .model-content .content .content-form .form-input input{width: 100%;height:30px;float: left;line-height: 30px;font-size: 14px;color: #333333;border: none;font-style: normal;}
+    .model-content .content .content-form .form-input.code{ width: 350px; }
+    .model-content .content .content-form .form-btn{width: 140px;height: 32px;float: left;margin-left: 20px;}
+    .model-content .content .content-form .form-btn a{display: block;width: 130px;height: 32px;box-sizing: border-box;background: #FF5B00;line-height: 32px;text-align: center;font-size: 14px;color: #FFFFFF;border-radius: 2px;}
+    .model-content .content .content-form .form-btn a.disabled{background: #B8BFCA;color: #FFFFFF;}
+    .model-content .content .content-form .form-text{ line-height: 32px; font-size: 14px;color: #333333; }
+    .model-content .content .content-error{ width: 100%;height: 22px;float: left;line-height: 22px;text-align: left;font-size: 12px;color: #FF0000;box-sizing: border-box;padding-left: 100px; }
+
+
+
+
+
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    body{background: #FFFFFF;}
+    .cards-container{width: 100%;min-height: 100vw;background-color: #FFFFFF;margin-top: 0;box-sizing: border-box;padding: 4.8vw;}
+    .cards-list{width: 100%;height:32.2vw;box-sizing: border-box;padding: 4vw;border-radius: 3.2vw;float: left;margin: 0 4.8vw 4.8vw 0;position: relative;}
+    .cards-list.ABC{background-image: linear-gradient(90deg, #19B8B2 0%, #009C96 100%);}
+    .cards-list.BCCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list.BOC{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.BOCO{background-image: linear-gradient(90deg, #7275BE 0%, #434492 100%);}
+    .cards-list.CCB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list.CEB{background-image: linear-gradient(90deg, #B673CB 0%, #843C9A 100%);}
+    .cards-list.CGB{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.CIB{background-image: linear-gradient(90deg, #457EBC 0%, #1B518A 100%);}
+    .cards-list.CMBC{background-image: linear-gradient(90deg, #3C9EC2 0%, #0584B4 100%);}
+    .cards-list.CMBCHINA{background-image: linear-gradient(90deg, #FB6965 0%, #CE4343 100%);}
+    .cards-list.ECITIC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.HXB{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.ICBC{background-image: linear-gradient(90deg, #ED796B 0%, #EF585E 100%);}
+    .cards-list.PINGAN{background-image: linear-gradient(90deg, #F5A15A 0%, #E47F29 100%);}
+    .cards-list.POST{background-image: linear-gradient(90deg, #3EB97B 0%, #11874B 100%);}
+    .cards-list.SHB{background-image: linear-gradient(90deg, #6479C8 0%, #314693 100%);}
+    .cards-list.SPDB{background-image: linear-gradient(90deg, #4D8CD8 0%, #3C66C9 100%);}
+    .cards-list .list-logo{width: 10.7vw;height: 100%;float: left;}
+    .cards-list .list-logo .logo{width: 10.7vw;height: 10.7vw;border-radius: 50%;padding: 1.2vw;box-sizing: border-box;background-color: #ffffff;float: left;}
+    .cards-list .list-logo .logo img{width: 8.3vw;height: 8.3vw;border-radius: 50%;display: block;}
+    .cards-list-add{width: 100%;height:32.2vw;box-sizing: border-box;cursor: pointer; padding: 4vw;border-radius: 3.2vw;float: left;border: 1px dashed #B8BFCA;display: flex;align-items: center;justify-content: center;flex-direction: column;}
+    .cards-list-add .icon{width:6.4vw ;height:6.4vw;display: inline-block;float: left;margin-right: 2vw;}
+    .cards-list-add .icon:before{width:6.4vw ;height:6.4vw;background-position:-0.5vw -93vw;}
+    .cards-list-add span{display: inline-block;line-height: 6.4vw;font-size: 3.4vw;color: #333;}
+    .list-main{width: 66.6vw;float: left;margin-left: 4.6vw;}
+    .list-main .list-main-name{width: 100%;height: 6vw;line-height: 6vw;font-size: 3.4vw;color: #ffffff;}
+    .list-main .list-main-tag{width: 100%;height: 6vw;margin:1vw 0 4vw 0;}
+    .list-main .list-main-tag .tag{display: inline-block;line-height: 6vw;padding: 0 1.5vw;border-radius: 2px;font-size: 3.2vw;color: #ffffff;background: rgba(255, 255, 255, 0.2);float: left;}
+    .list-main .list-main-code{width: 100%;height: 10vw;line-height: 10vw;font-size: 3.8vw;color: #ffffff;}
+    .list-btn{font-size: 3.4vw;color: #ffffff;height: 6vw;line-height: 6vw;position: absolute;right: 4vw;top: 4vw;cursor: pointer;}
+    .model-cards-popup{width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4);z-index: 99999;}
+    .model-cards-popup .model-content{width:100%;height:150vw;padding: 3.2vw 6vw; position:absolute;left:0;bottom:0;background-color:#FFFFFF;border-radius:2px;box-sizing:border-box}
+    .model-content .title{width: 100%;height: 8vw;box-sizing: border-box;float: left;position: relative;margin-bottom: 6vw;}
+    .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:0;top: 0;background: url("/img/base/icon.png")-315px 0 no-repeat;cursor: pointer;}
+    .model-content .title .title-tabs{width: 100%;height: 8vw;float: left;box-sizing: border-box;}
+    .model-content .title .title-tabs a{width: 100px;height: 8vw;float: left;display: block;font-size: 3.4vw;line-height: 7.8vw;text-align: center;box-sizing: border-box;border-bottom: 3px solid #FFFFFF;color: #333333;}
+    .model-content .title .title-tabs a.current{ font-weight: bold;border-color: #FF5B00;}
+    .model-content .content{ width:100%;height:110vw;box-sizing:border-box;float:left;overflow:hidden;overflow-y:auto }
+    .model-content .content .list{width: 25.2vw;height: 8vw;display: block;margin:0 3.5vw 3vw 0;float: left;border: 1px solid #FFFFFF;position: relative;border-radius: 2px;}
+    .model-content .content .list img{width: 100%;height: 100%;display: block;}
+    .model-content .content .list.current{border-color: #FF2A2A;}
+    .model-content .content .list.current:before{content: '';width: 20px;height: 20px;position: absolute;bottom: 0;right: -2px;background: url("/img/base/icon.png")-210px -252px no-repeat;}
+    .model-content .button{width: 100%;height: 11vw;float: left;margin-top: 4.8vw;}
+    .model-content .button .button-btn{display: block;width: 60vw;height: 11vw;margin: 0 auto;box-sizing: border-box;border: 1px solid #FF5B00;background: #FF5B00;line-height: 11vw;text-align: center;font-size: 14px;color: #FFFFFF;}
+    .model-content .button .button-btn.disabled{border: 1px solid #B8BFCA;background: #B8BFCA;color: #FFFFFF;}
+    .model-content .content .content-labe{width: 100%;height: 8vw;line-height: 8vw;float: left;font-size: 3.4vw;color: #333333;font-weight: bold;}
+    .model-content .content .content-labe.sen{margin-top: 3vw;}
+    .model-content .content .content-labe p{float: left;}
+    .model-content .content .content-labe img{width: 25.2vw;height: 8vw;display: block;margin-left: 4vw;float: left;border-radius: 2px;}
+    .model-content .content .content-labe .form-type{float: left; height:100%; box-sizing: border-box;padding:2vw 0;margin-left: 3vw;}
+    .model-content .content .content-labe .form-type .form-radio {height:4vw;margin-right: 2vw;line-height: 4vw;box-sizing: border-box;float: left;cursor: pointer;}
+    .model-content .content .content-labe .form-type .form-radio input{box-sizing: border-box;width: 100%;height: 4vw;line-height: 4vw;text-indent: 1.2em;background-color: #FFF;border: 1px solid #b8bfca;border-radius: 2px;display: none;}
+    .model-content .content .content-labe .form-type .form-radio .icon{display: block;font-style: normal;cursor: pointer;width: 4vw;height: 4vw;position: relative;overflow: hidden;float: left;}
+    .model-content .content .content-labe .form-type .form-radio span{font-size: 14px;color: #666666;font-weight: normal;margin-left: 5px;}
+    .model-content .content .content-labe .form-type .form-radio input:checked + i:before{ background-position: -10.1vw -93.7vw; }
+    .model-content .content .content-labe .form-type .form-radio .mIcon:before{position: absolute;left: 0;bottom: 0;width:4vw ;height:4vw;background-position: -18.2vw -93.7vw;}
+    .model-content .content .content-labe .form-label{float: left;}
+    .model-content .content .content-label{width: 100%;height:6vw;float: left;line-height: 6vw;text-align: left;font-size: 3.4vw;color: #1890F9;box-sizing: border-box;}
+    .model-content .content .content-form{width: 100%;height: auto;float: left;margin-bottom: 2vw;}
+    .model-content .content .content-form.none{margin-bottom: 0;}
+    .model-content .content .content-tabs{width: 100%;height: 27px;box-sizing: border-box;float: left;position: relative;margin-bottom: 24px;}
+    .model-content .content .content-tabs a{width: 60px;height: 27px;float: left;margin-right: 24px;display: block;font-size: 13px;line-height: 24px;text-align: center;box-sizing: border-box;border-bottom: 1px solid #FFFFFF;color: #333333;}
+    .model-content .content .content-tabs a.current{ border-color: #FF5B00;}
+    .model-content .content .content-form .form-label{width: 100%;height: 6vw;float: left;line-height: 6vw;text-align: left;font-size: 3.4vw;color: #666666;font-weight: bold;}
+    .model-content .content .content-form .form-label.card{width: auto;}
+    .model-content .content .content-form .form-label span{color: #F94B4B;}
+    .model-content .content .content-form .form-input{width: 100%;height: 10vw;float: left;color: #F94B4B;box-sizing: border-box;padding: 0 3vw;border:1px solid #B8BFCA;border-radius: 2px; }
+    .model-content .content .content-form .form-input input{width: 100%;height:9vw;float: left;line-height: 9vw;font-size: 3.4vw;color: #333333;border: none;font-style: normal;}
+    .model-content .content .content-form .form-input.code{ width: 54.8vw; }
+    .model-content .content .content-form .form-btn{width: 26vw;height: 10vw;float: left;margin-left: 20px;}
+    .model-content .content .content-form .form-btn a{display: block;width: 100%;height: 10vw;box-sizing: border-box;background: #FF5B00;line-height: 10vw;text-align: center;font-size: 3.4vw;color: #FFFFFF;}
+    .model-content .content .content-form .form-btn a.disabled{background: #B8BFCA;color: #FFFFFF;}
+    .model-content .content .content-form .form-text{ line-height: 6vw; font-size: 3.4vw;color: #333333;float: left; }
+    .model-content .content .content-error{ width: 100%;height: 6vw;float: left;line-height: 6vw;;text-align: left;font-size: 3.2vw;color: #FF0000; }
+    footer{display: none;}
+}
+

src/main/resources/static/css/user-center/address/list.css

@@ -1,101 +1,101 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*个人中心右侧*/
-    .navLayout .right{float:right;width:968px}
-    .order-header{width: 100%;height: 78px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .order-header .header-bt {height: 38px;float: left;}
-    .order-header .header-bt p{float: left;font-size: 14px;line-height: 38px;text-align: left;color: #627386;}
-    .order-header .header-bt p span{color: #FF5B00;margin: 0 5px;}
-    .order-header .header-button{height: 38px;float: right;}
-    .order-header .header-button .btn-server{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;}
-    .container{width: 100%;height: auto;box-sizing: border-box;position: relative;margin-top: 8px}
-    .container .empty{background-color:#FFF;}
-    .container .section.address-none{height: 318px;left: 0;top:0;background-color: #FFF;box-shadow: 0px 3px 6px 0px
-		rgba(34, 39, 46, 0.07);z-index: 999;padding: 16px 0;box-sizing: border-box;margin-bottom: 10px}
-    .addressWrap{padding:16px;position:relative}
-    .addressWrap .formLine{padding-bottom:16px;font-size:14px;position:relative;padding-left:90px;text-align:left;width:450px}
-    .addressWrap .formLine .label{position:absolute;left:0;top:0;width:90px;text-align:right;line-height:36px;font-size:14px}
-    .addressWrap .formLine .checked{top:8px}
-    .addressWrap .formLine .errTips{display:none}
-    .addressWrap .formLine.error .errTips{display:block}
-    .addressWrap .formLine input{width:420px;height:36px}
-    .addressWrap .formLine textarea{width:420px;min-height:114px;padding:10px 16px;line-height:20px;resize:none}
-    .addressWrap .formLine select{width:136px;height:36px}
-    .addressWrap .btnBox{position:absolute;left:610px;top:100px}
-    .addressWrap .btnBox .group{text-align:left;height:92px;box-sizing:border-box;border-left:1px dashed #b8bfca;padding: 0 30px;}
-    .addressWrap .btnBox .group p:first-child{line-height:32px}
-    .addressWrap .btnBox .group .btn{display:inline-block;width:128px;height:34px;line-height:34px;margin:0 auto;text-align:center;font-size:14px;color:#1890f9;border:1px solid #FFFFFF}
-    .addressWrap .btnBox .group .btn.con{background-color:#FFE6DC;color:#FF5B00;border-color:#FF5B00}
-    .addressWrap .btnBox .group .btn.save{background-color:#FF5B00;color:#FFF;border-color:#FF5B00;margin-right:15px}
-    .addressWrap .btnBox .group .check{display:inline-block;height:18px;line-height:18px;color:#1890f9;margin-bottom: 25px;}
-    .addressWrap .btnBox .group .check input{vertical-align:top;margin-right:10px}
-    .container .section{width: 100%;height: auto;}
-    .container .section .list{width: 100%;height: 123px;box-sizing: border-box;padding:6px 16px;float: left;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;}
-    .container .section .list-left{width: 660px;height: 100%;float: left;}
-    .container .section .list-right{width: 240px;height: 100%;float: right;padding: 42.5px 0;box-sizing: border-box;}
-    .container .section .list-left p{width: 100%;height: 36px;line-height: 36px;font-size: 14px;color: #22272e;}
-    .container .section .list-left p .label{color: #627386;margin-right: 5px;display: inline-block;min-width: 60px;height:36px;text-align: justify;vertical-align: top;}
-    .container .section .list-left p .label:after{content: '';display: inline-block;width: 100%;}
-    .container .section .list-left p .prov{margin-right: 15px}
-    .container .section .list .list-defalut{float: left;width: 115px;}
-    .container .section .list .list-button{float: right;width: 120px;}
-    .container .section .list .list-btn{width: 60px;color:#FF5B00;float: right;display: inline-block;height: 22px;font-size: 12px;text-align: center;line-height: 22px;}
-    .container .section .list .list-btn.ico{box-sizing: border-box;padding: 4px 22px;}
-    .container .section .list .list-button .icon{width: 16px;height: 16px;float: right;position: relative;}
-    .container .section .list .list-button .icon span{display: block;width: 64px;height: 38px;line-height: 38px;background-color: #f94b4b;border-radius:3px;box-shadow: 0px 3px 6px 0px rgba(98, 115, 134, 0.17);position: absolute;bottom: -50px;left: -20px;color: #FFF;font-size: 14px;text-align: center;font-style: normal;transition: all ease-in 0.3s;opacity: 0;}
-    .container .section .list .list-button .icon span:before{content:'';width:0;height:0;border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f94b4b;position: absolute;top: -7px;left: 19px;}
-    .container .section .list .list-btn.ico:hover span{opacity: 1;}
-    .container .section .list .list-button .icon:before{height: 16px;width: 16px;background-position: -317px -2px;}
-    .container .section .list .list-defalut .icon{height: 24px;width: 24px;display: block;float: left;margin-right: 5px;}
-    .container .section .list .list-defalut .icon:before{height: 24px;width: 24px;background-position: -255px -330px;}
-    .container .section .list .list-defalut .span-s{display: inline-block;height: 24px;line-height:24px;padding: 0 15px;background-color: #f94b4b;font-size: 12px;color: #FFFFFF;border-radius: 12px;text-align: center;cursor: pointer;}
-    input[type=checkbox]:checked:after{background: #1890f9;border: 1px solid #1890f9}
-    input[type=checkbox]:after{border: 1px solid #1890f9;}
-    input::placeholder,textarea::placeholder{color: #9aa5b5}
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .order-header{line-height:7.4vw;background:#FFF;padding:3.3vw;margin:1.5vw auto;font-size:3.1vw;position:relative}
-    .order-header p span{color:#FF5B00;margin:0 1vw}
-    .header-button .btn-server{position:absolute;right:3.3vw;top:3vw}
-    .container{box-sizing:border-box;width:100%;position:relative}
-    .container .list{line-height:7.4vw;background:#FFF;padding:3.3vw}
-    .container .list{margin-bottom:1vw;border-bottom:1px dashed #eee;position:relative}
-    .container .list p{display:inline-block;min-width:49%;line-height:5vw;font-size:3.4vw;color:#22272e}
-    .container .list p .label{color:#627386;margin-right:2vw}
-    .container .list-right{padding-top:2vw}
-    .container .list-btn,.header-button .btn-server{display:inline-block;height:8vw;line-height:8vw;font-size:3.4vw;color:#1890f9;padding:0 3vw;border-radius:4.5vw;background-color:#e0f1ff;border:solid 1px #1890f9}
-    .container .list-btn.ico{background-color:#ffd8d8;color:#f94b4b;border-color:#f94b4b;margin-left:2vw}
-    .header-button .btn-server{background-color:#FF5B00;color:#FFF;border-color:#FF5B00;}
-    .container .list-btn i{font-style:normal;}
-    .container .list-defalut{height:8vw;line-height:8vw}
-    .container .list-defalut .mIcon{display:inline-block;vertical-align:middle}
-    .container .list-defalut .mIcon:before{height:8vw;width:8vw;background-position:-94.1vw -36.7vw}
-    .container .list-defalut span{display:inline-block;height:6vw;line-height:6vw;font-size:3.1vw;color:#FFFFFF;background-color:#f94b4b;border-radius:3vw;padding:0 3vw;vertical-align:middle}
-    .container .list-defalut a{display:inline-block;height:6vw;line-height:6vw;margin-left:2vw;color:#1890f9;vertical-align:middle}
-    .container .list-defalut a{padding:0;margin:0;font-size: 3.1vw;}
-    .container .list .seclet{width:6vw;height:6vw;position:absolute;bottom:0;right:0;opacity:0}
-    .container .list .seclet .mIcon{width:6vw;height:6vw;display:block}
-    .container .list .seclet .mIcon:before{width:6vw;height:6vw;background-position:-75.1vw -7.8vw}
-    .container .list.checked{border:1px solid #FF5B00}
-    .container .list.checked .seclet{opacity:1}
-    .addressWrap{position:fixed;bottom:0;left:0;width:100%;height:100%;margin:0 auto;background-color:rgba(74,79,88,.7);z-index:999999;box-sizing:border-box;}
-    .addressWrap .form{width:100%;box-sizing:border-box;position:absolute;bottom:0;left:0;background:#FFF;border-radius:2vw 2vw 0 0;padding:3.3vw}
-    .addressWrap .btnBox .group{text-align:center}
-    .addressWrap .btnBox .group p:first-child{margin-bottom:5vw}
-    .addressWrap .btnBox .group .check{display:inline-block;color:#1890f9}
-    .addressWrap .btnBox .group .check input{vertical-align:top;margin-right:2vw}
-    .addressWrap .btnBox .group .btn{display:inline-block;width:40vw;height:11vw;line-height:11vw;text-align:center;font-size:3.4vw;color:#FF5B00;border:1px solid #FF5B00;background:#FFE6DC}
-    .addressWrap .btnBox .group .btn.save{background-color:#FF5B00;color:#FFF;border-color:#FF5B00}
-    input[type=checkbox]:checked:after{background: #1890f9;border: 1px solid #1890f9}
-    input[type=checkbox]:after{border: 1px solid #1890f9;}
-    input::placeholder,textarea::placeholder{color: #9aa5b5}
-
-}
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*个人中心右侧*/
+    .navLayout .right{float:right;width:968px}
+    .order-header{width: 100%;height: 78px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
+    .order-header .header-bt {height: 38px;float: left;}
+    .order-header .header-bt p{float: left;font-size: 14px;line-height: 38px;text-align: left;color: #627386;}
+    .order-header .header-bt p span{color: #FF5B00;margin: 0 5px;}
+    .order-header .header-button{height: 38px;float: right;}
+    .order-header .header-button .btn-server{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;}
+    .container{width: 100%;height: auto;box-sizing: border-box;position: relative;margin-top: 8px}
+    .container .empty{background-color:#FFF;}
+    .container .section.address-none{height: 318px;left: 0;top:0;background-color: #FFF;box-shadow: 0px 3px 6px 0px
+		rgba(34, 39, 46, 0.07);z-index: 999;padding: 16px 0;box-sizing: border-box;margin-bottom: 10px}
+    .addressWrap{padding:16px;position:relative}
+    .addressWrap .formLine{padding-bottom:16px;font-size:14px;position:relative;padding-left:90px;text-align:left;width:450px}
+    .addressWrap .formLine .label{position:absolute;left:0;top:0;width:90px;text-align:right;line-height:36px;font-size:14px}
+    .addressWrap .formLine .checked{top:8px}
+    .addressWrap .formLine .errTips{display:none}
+    .addressWrap .formLine.error .errTips{display:block}
+    .addressWrap .formLine input{width:420px;height:36px}
+    .addressWrap .formLine textarea{width:420px;min-height:114px;padding:10px 16px;line-height:20px;resize:none}
+    .addressWrap .formLine select{width:136px;height:36px}
+    .addressWrap .btnBox{position:absolute;left:610px;top:100px}
+    .addressWrap .btnBox .group{text-align:left;height:92px;box-sizing:border-box;border-left:1px dashed #b8bfca;padding: 0 30px;}
+    .addressWrap .btnBox .group p:first-child{line-height:32px}
+    .addressWrap .btnBox .group .btn{display:inline-block;width:128px;height:34px;line-height:34px;margin:0 auto;text-align:center;font-size:14px;color:#1890f9;border:1px solid #FFFFFF}
+    .addressWrap .btnBox .group .btn.con{background-color:#FFE6DC;color:#FF5B00;border-color:#FF5B00}
+    .addressWrap .btnBox .group .btn.save{background-color:#FF5B00;color:#FFF;border-color:#FF5B00;margin-right:15px}
+    .addressWrap .btnBox .group .check{display:inline-block;height:18px;line-height:18px;color:#1890f9;margin-bottom: 25px;}
+    .addressWrap .btnBox .group .check input{vertical-align:top;margin-right:10px}
+    .container .section{width: 100%;height: auto;}
+    .container .section .list{width: 100%;height: 123px;border-radius: 8px;box-sizing: border-box;padding:6px 16px;float: left;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;}
+    .container .section .list-left{width: 660px;height: 100%;float: left;}
+    .container .section .list-right{width: 240px;height: 100%;float: right;padding: 42.5px 0;box-sizing: border-box;}
+    .container .section .list-left p{width: 100%;height: 36px;line-height: 36px;font-size: 14px;color: #22272e;}
+    .container .section .list-left p .label{color: #627386;margin-right: 5px;display: inline-block;min-width: 60px;height:36px;text-align: justify;vertical-align: top;}
+    .container .section .list-left p .label:after{content: '';display: inline-block;width: 100%;}
+    .container .section .list-left p .prov{margin-right: 15px}
+    .container .section .list .list-defalut{float: left;width: 115px;}
+    .container .section .list .list-button{float: right;width: 120px;}
+    .container .section .list .list-btn{width: 60px;color:#FF5B00;float: right;display: inline-block;height: 22px;font-size: 12px;text-align: center;line-height: 22px;}
+    .container .section .list .list-btn.ico{box-sizing: border-box;padding: 4px 22px;}
+    .container .section .list .list-button .icon{width: 16px;height: 16px;float: right;position: relative;}
+    .container .section .list .list-button .icon span{display: block;width: 64px;height: 38px;line-height: 38px;background-color: #f94b4b;border-radius:3px;box-shadow: 0px 3px 6px 0px rgba(98, 115, 134, 0.17);position: absolute;bottom: -50px;left: -20px;color: #FFF;font-size: 14px;text-align: center;font-style: normal;transition: all ease-in 0.3s;opacity: 0;}
+    .container .section .list .list-button .icon span:before{content:'';width:0;height:0;border-width:0 10px 10px;border-style:solid;border-color:transparent transparent #f94b4b;position: absolute;top: -7px;left: 19px;}
+    .container .section .list .list-btn.ico:hover span{opacity: 1;}
+    .container .section .list .list-button .icon:before{height: 16px;width: 16px;background-position: -317px -2px;}
+    .container .section .list .list-defalut .icon{height: 24px;width: 24px;display: block;float: left;margin-right: 5px;}
+    .container .section .list .list-defalut .icon:before{height: 24px;width: 24px;background-position: -255px -330px;}
+    .container .section .list .list-defalut .span-s{display: inline-block;height: 24px;line-height:24px;padding: 0 15px;background-color: #f94b4b;font-size: 12px;color: #FFFFFF;border-radius: 12px;text-align: center;cursor: pointer;}
+    input[type=checkbox]:checked:after{background: #1890f9;border: 1px solid #1890f9}
+    input[type=checkbox]:after{border: 1px solid #1890f9;}
+    input::placeholder,textarea::placeholder{color: #9aa5b5}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .order-header{line-height:7.4vw;background:#FFF;padding:3.3vw;margin:1.5vw auto;font-size:3.1vw;position:relative}
+    .order-header p span{color:#FF5B00;margin:0 1vw}
+    .header-button .btn-server{position:absolute;right:3.3vw;top:3vw}
+    .container{box-sizing:border-box;width:100%;position:relative}
+    .container .list{line-height:7.4vw;background:#FFF;padding:3.3vw}
+    .container .list{margin-bottom:1vw;border-bottom:1px dashed #eee;position:relative}
+    .container .list p{display:inline-block;min-width:49%;line-height:5vw;font-size:3.4vw;color:#22272e}
+    .container .list p .label{color:#627386;margin-right:2vw}
+    .container .list-right{padding-top:2vw}
+    .container .list-btn,.header-button .btn-server{display:inline-block;height:8vw;line-height:8vw;font-size:3.4vw;color:#1890f9;padding:0 3vw;border-radius:4.5vw;background-color:#e0f1ff;border:solid 1px #1890f9}
+    .container .list-btn.ico{background-color:#ffd8d8;color:#f94b4b;border-color:#f94b4b;margin-left:2vw}
+    .header-button .btn-server{background-color:#FF5B00;color:#FFF;border-color:#FF5B00;}
+    .container .list-btn i{font-style:normal;}
+    .container .list-defalut{height:8vw;line-height:8vw}
+    .container .list-defalut .mIcon{display:inline-block;vertical-align:middle}
+    .container .list-defalut .mIcon:before{height:8vw;width:8vw;background-position:-94.1vw -36.7vw}
+    .container .list-defalut span{display:inline-block;height:6vw;line-height:6vw;font-size:3.1vw;color:#FFFFFF;background-color:#f94b4b;border-radius:3vw;padding:0 3vw;vertical-align:middle}
+    .container .list-defalut a{display:inline-block;height:6vw;line-height:6vw;margin-left:2vw;color:#1890f9;vertical-align:middle}
+    .container .list-defalut a{padding:0;margin:0;font-size: 3.1vw;}
+    .container .list .seclet{width:6vw;height:6vw;position:absolute;bottom:0;right:0;opacity:0}
+    .container .list .seclet .mIcon{width:6vw;height:6vw;display:block}
+    .container .list .seclet .mIcon:before{width:6vw;height:6vw;background-position:-75.1vw -7.8vw}
+    .container .list.checked{border:1px solid #FF5B00}
+    .container .list.checked .seclet{opacity:1}
+    .addressWrap{position:fixed;bottom:0;left:0;width:100%;height:100%;margin:0 auto;background-color:rgba(74,79,88,.7);z-index:999999;box-sizing:border-box;}
+    .addressWrap .form{width:100%;box-sizing:border-box;position:absolute;bottom:0;left:0;background:#FFF;border-radius:2vw 2vw 0 0;padding:3.3vw}
+    .addressWrap .btnBox .group{text-align:center}
+    .addressWrap .btnBox .group p:first-child{margin-bottom:5vw}
+    .addressWrap .btnBox .group .check{display:inline-block;color:#1890f9}
+    .addressWrap .btnBox .group .check input{vertical-align:top;margin-right:2vw}
+    .addressWrap .btnBox .group .btn{display:inline-block;width:40vw;height:11vw;line-height:11vw;text-align:center;font-size:3.4vw;color:#FF5B00;border:1px solid #FF5B00;background:#FFE6DC}
+    .addressWrap .btnBox .group .btn.save{background-color:#FF5B00;color:#FFF;border-color:#FF5B00}
+    input[type=checkbox]:checked:after{background: #1890f9;border: 1px solid #1890f9}
+    input[type=checkbox]:after{border: 1px solid #1890f9;}
+    input::placeholder,textarea::placeholder{color: #9aa5b5}
+
+}

src/main/resources/static/css/user-center/dashboard.css

@@ -1,193 +1,193 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*个人中心右侧*/
-    .crumbs{font-size: 16px;}
-    .user-header{width:100%;height:120px;box-sizing:border-box;padding:20px;background-color:#FFF;box-shadow:0px 3px 6px 0px rgba(0,0,0,0.07);position:relative}
-    .user-header .logo{width:110px;height:78px;float:left;border:1px solid #f5f5f5;border-radius:2px;margin-right:8px;position:relative;cursor:pointer}
-    .user-header .logo .logo-file{width:110px;height:78px;position:relative;outline:none;opacity:0;position:absolute;top:0;left:0;cursor:pointer}
-    .user-header .logo .file{display:block;width:110px;height:78px;line-height:78px;text-align:center}
-    .user-header .logo .file:before{width:40px;height:40px;background-position:-161px -367px;vertical-align:middle}
-    .user-header .logo img{width:110px;height:78px;display:block;border-radius:2px}
-    .user-header .account{float:left;box-sizing:border-box;padding:5px 0}
-    .user-header .account .name{width:100%;height:36px;float:left;margin-bottom:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}
-    .user-header .account .name a,.user-header .account .name span{display:block;margin-left:8px}
-    .user-header .account .name .username{line-height:36px;font-size:18px;font-weight:bold;color:#22272e;display:inline-block;float:left}
-    .user-header .account .name .update{position:relative;width:104px;height:24px;background:#FFE6DC;border:1px solid #FF5B00;opacity:1;border-radius:2px;color:#FF5B00;font-size:12px;line-height:22px;text-align:center}
-    .user-header .account .name .update .name-tips{width:44px;height:19px;line-height:19px;text-align:center;border-radius:10px;background-color:#ffe6dc;font-size:12px;color:#FF5B00;position:absolute;right:-20px;top:-25px;z-index:99}
-    .user-header .account .name .update .name-tips:before{content:'';width:6px;height:6px;background-color:#ffe6dc;position:absolute;bottom:-3px;left:12px;z-index:-1;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
-    .user-header .account .name .agency{width:64px;height:24px;text-align:center;line-height:22px;border-radius:2px;font-size:12px;-webkit-box-sizing:border-box;box-sizing:border-box}
-    .user-header .account .name .agency.ordinary{background:#E7EAEF;border:1px solid #627386;color:#627386}
-    .user-header .account .name .agency.vip{background:#FFF2D5;border:1px solid #FFD54F;color:#E4AA43}
-    .user-header .account .name .vip-icon{width:32px;height:24px;text-align:center;line-height:24px;border-radius:2px;font-size:12px;font-weight:400}
-    .user-header .account .name .vip-icon.vip{color:#4E4539;background:#F0CB72}
-    .user-header .account .name .vip-icon.svip{color:#F0CB72;background:#333333}
-    .user-header .account .msg{width:100%;font-size:14px;line-height:26px;color:#22272e;margin-top:20px}
-    .user-header .account .msg em{color:#22272e;display:inline-block;margin-right:8px}
-    .user-header .account .msg .red{color:#f94b4b;font-style:normal;margin:0 5px}
-    .user-header .account .msg a{display:inline-block;width:64px;height:22px;line-height:22px;color:#FFFFFF;font-size:12px;text-align:center;background-image:linear-gradient(225deg,#61686f 0%,#313a43 100%);border-radius:2px}
-    .user-header .account .money{position:absolute;right:15px;bottom:20px;font-size:16px}
-    .user-header .account .money em{color:#FF5B00;font-style:normal;}
-    .user-header .message{position:absolute;height:28px;right:15px;top:20px}
-    .user-header .message a{width:28px;height:28px;float:right;display:block;position:relative}
-    .user-header .message .icon{width:28px;height:28px;float:right;display:block;position:relative}
-    .user-header .message .icon:before{width:28px;height:28px;background-position:-240px -370px}
-    .user-header .message .icon span{display:block;width:20px;height:20px;background-image:linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position:absolute;top:-9px;left:-9px;font-style:normal;font-size:12px;color:#f94b4b;line-height:20px;text-align:center;border-radius:50%;color:#fff}
-    .user-header .message .icon span.ellipse{width:30px;height:20px;border-radius:10px;line-height:20px;left:-22px}
-    .user-content{width:100%;height:auto;margin-top:10px}
-    .user-content .title{width: 100%;height: 44px;line-height: 44px;font-size: 16px;text-align: left;color: #22272e;padding: 0 20px}
-    .user-content .title a{display: block;float: right;position: relative;padding-right: 36px;position: relative;}
-    .user-content .title a .icon{display: block;width: 18px;height: 18px;position: absolute;top: 5px;right: 10px;}
-    .user-content .title a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
-    .user-content .section{width: 100%;height: auto;}
-    .user-content .section .user-main{width: 100%;height:auto;background-color: #FFFFFF;box-sizing: border-box;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;}
-    .user-content .section .user-main.tabs{height: 90px;padding: 15px 20px;}
-    .user-content .section .user-main.account{height: 78px;}
-    .user-content .section .user-main.account .account-cell{line-height: 34px;font-size:14px;color: #333333;float: left;margin-right: 80px;display: block;}
-    .user-content .section .user-main.account .account-cell .red{font-size:16px;color: #f94b4b;font-weight: bold;}
-    .user-content .section .user-main.collec{height: 78px;padding: 10px 20px;}
-    .user-content .section .user-main.collec .account-collec{width: 72px;display: block;float: left;}
-    .user-content .section .user-main.collec .account-collec img{height: 26px;width: 26px;display: block;margin: 0 auto;margin-bottom: 2px;}
-    .user-content .section .user-main.collec .account-collec p{height: 26px;line-height: 26px;text-align: center;font-size: 14px;color: #333333;}
-    .user-content .section .user-main .tabs-left{height: 100%;float: left;}
-    .user-content .section .user-main .tabs-left .item{width: 50px;height: 100%;float: left;margin:0 40px;}
-    .user-content .section .user-main .tabs-left .item a{width: 100%;height: 100%;display: block;}
-    .user-content .section .user-main .tabs-left .item a .icon{width: 24px;height: 24px;display: block;margin: 0 auto;position: relative;margin-top: 10px;}
-    .user-content .section .user-main .tabs-left .item a .icon span{display: block;width: 20px;height: 20px;background-image: linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position: absolute;top: -9px;right: -13px;font-style: normal;font-size: 13px;color: #f94b4b;line-height: 20px;text-align: center;border-radius: 50%;color: #fff;}
-    .user-content .section .user-main .tabs-left .item a .icon span.ellipse{width: 30px;height: 20px;border-radius: 10px;line-height: 20px;right: -22px;}
-    .user-content .section .user-main .tabs-left .item a .icon.icon-1:before{width: 24px;height: 24px;background-position: 0px -512px;}
-    .user-content .section .user-main .tabs-left .item a .icon.icon-2:before{width: 24px;height: 24px;background-position: -38px -512px;}
-    .user-content .section .user-main .tabs-left .item a .icon.icon-3:before{width: 24px;height: 24px;background-position: -73px -512px;}
-    .user-content .section .user-main .tabs-left .item a .icon.icon-4:before{width: 24px;height: 24px;background-position: -110px -512px;}
-    .user-content .section .user-main .tabs-left .item a .icon.icon-5:before{width: 24px;height: 24px;background-position: -145px -512px;}
-    .user-content .section .user-main .tabs-left .item a .p{display:block;font-size: 14px;color: #22272e;text-align: center;line-height: 20px;margin-top: 3px;}
-    .user-content .section .user-main .tabs-right{float: right;line-height: 60px;font-size: 14px;color: #22272e;}
-    .user-content .section .user-main .tabs-right a{display: block;float: right;padding-right: 16px;position: relative}
-    .user-content .section .user-main .tabs-right a .icon{width: 18px;height: 18px;display: block;position: absolute;top: 4px;right: -10px;}
-    .user-content .section .user-main .tabs-right a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
-    .user-content .section .user-main.order{height: 224px;padding-left: 68px;padding-top: 10px;}
-    .user-content .section .user-main .order-title{width: 100%;height: 40px;position: relative;float: left;margin-bottom: 0;}
-    .user-content .section .user-main .order-title .bag{display: block;position: absolute;left: -45px;top: 12px; width: 36px;height: 16px;background-image: linear-gradient(335deg,#FF5B00 0%,#ffb496 100%);border-radius: 2px;font-size: 10px;color: #FFFFFF;line-height: 16px;text-align: center;}
-    .user-content .section .user-main .order-title .title-name{float: left;line-height:  40px;font-size: 14px;color: #22272e;}
-    .user-content .section .user-main .order-title .title-name p{float: left;margin-right: 10px;}
-    .user-content .section .user-main .order-title .title-name p.state{color: #FF5B00;}
-    .user-content .section .user-main .order-title .title-type{float: left;width: 40px;height: 40px;background: url("/img/order/second.png")center center no-repeat;background-size: cover;}
-    .user-content .section .user-main .order-title .title-time{float: right;line-height:  40px;font-size: 12px;color: #9aa5b5;}
-    .user-content .section .user-main .order-content{width: 100%;height: auto;float: left;}
-    .user-content .section .user-main .order-content .order-item{width: 100%;height: 36px;float: left;}
-    .user-content .section .user-main .order-content .order-item p{float: left;margin-right: 50px;line-height: 36px;color: #22272e;font-size: 14px;}
-    .user-content .section .user-main .order-content .order-item p span{margin-left: 5px;}
-    .user-content .section .user-main .order-content .order-item p .red{color: #f94b4b;}
-    .user-content .section .user-main .order-content .order-botton{width: 100%;height: 36px;float: left;margin-top: 8px;}
-    .user-content .section .user-main .order-content .order-botton .btn{width: 88px;height: 34px;border-radius: 2px;border: 1px solid #FFF;float: right;margin-left: 16px;font-size: 14px;line-height: 34px;text-align: center;display: block;}
-    .user-content .section .user-main .order-content .order-botton .btn.cancel{border-color: #9aa5b5;background-color: #FFFFFF;color: #22272e;}
-    .user-content .section .user-main .order-content .order-botton .btn.primary{border-color: #FF5B00;background-color: #FF5B00;color: #FFFFFF;}
-    .user-content .section .user-main.product{height: 260px;padding: 20px 20px 10px 20px;}
-    .user-content .section .user-main .product-item{width: 173px;height: auto;float: left;margin-right: 15px;cursor: pointer;}
-    .user-content .section .user-main .product-item:last-child{margin-right: 0;}
-    .user-content .section .user-main .product-item .product-img{width: 171px;height: 171px;float: left;border: 1px solid #e2e7ef;}
-    .user-content .section .user-main .product-item .product-img img{width: 173px;height: 173px;display: block;}
-    .user-content .section .user-main .product-item .product-name{width: 100%;height: 40px;float: left;margin-top: 10px;}
-    .user-content .section .user-main .product-item .product-name p{font-size: 14px;color: #93979f;text-align: justify;line-height: 20px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
-    .user-content .section .user-main .product-item .product-name p:hover{color: #FF5B00;text-decoration: underline;}
-    .user-content .section .user-main.news{height: 207px;padding: 13px 20px;}
-    .user-content .section .user-main .new-list{width: 100%;height: 36px;float: left;cursor: pointer;}
-    .user-content .section .user-main .new-list .text{width: 600px;line-height: 36px;font-size: 14px;color: #4a4f58;float: left;padding-left: 15px;position: relative; white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}
-    .user-content .section .user-main .new-list .text:hover{color: #FF5B00;text-decoration: underline;}
-    .user-content .section .user-main .new-list .text:before{content: '';width: 6px;height: 6px;border-radius: 50%;background-color: #FF5B00;position: absolute;left: 0;top:15px;}
-    .user-content .section .user-main .new-list .time{line-height: 36px;font-size: 12px;color: #9aa5b5;float: right;}
-    .user-content.coupon{width: 100%;height: 240px}
-    .user-content.coupon .coupon_img{width: 100%;height: 100%;}
-    /*SVIP*/
-    .svip-content{margin-top:10px}
-    .svip-content .title{width:100%;height:44px;line-height:44px;font-size:16px;text-align:left;color:#22272e;padding:0 20px}
-    .svip-content .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:968px;height:78px;padding:0 24px 0 110px;background:url(https://static.caimei365.com/app/img/svip/pc-cm-svip-bg-01.png) no-repeat center;background-size:968px 78px;-webkit-box-sizing:border-box;box-sizing:border-box}
-    .svip-content .section div{-webkit-box-flex:1;-ms-flex:1;flex:1;color:#F0CB72}
-    .svip-content .section div span:first-child{font-size:16px;font-weight:400;color:#F0CB72}
-    .svip-content .section div span.error{color: #FF2A2A}
-    .svip-content .section div span:last-child{font-size:14px;font-weight:400;color:#BCBCBC;margin-left: 10px}
-    .svip-content .section a.btn{width:104px;height:36px;color:#4E4539;text-align:center;line-height:36px;background:-webkit-gradient(linear,right top,left top,from(#FEE9BA),to(#F0CB72));background:-o-linear-gradient(right,#FEE9BA 0%,#F0CB72 100%);background:linear-gradient(270deg,#FEE9BA 0%,#F0CB72 100%);border-radius:2px}
-    .svip-content .section a.link{font-size:16px;font-weight:400;color:#F0CB72}
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .user-header{box-sizing:border-box;width:100%;padding:2.7vw;background:#fff;position:relative}
-    .user-header .logo{width:26.7vw;height:19.4vw;border:solid 1px #f5f5f5;margin-right:2.7vw;position:relative}
-    .user-header .logo .logo-file{width:26.7vw;height:19.4vw;outline:none;opacity:0;position:absolute;top:0;left:0}
-    .user-header .logo .file{position:absolute;top:5vw;left:9vw;width:9vw;height:9vw}
-    .user-header .logo .file:before{width:9vw;height:9vw;background-position:-7.5vw -60.3vw}
-    .user-header .logo img{max-width:100%;max-height:100%;display:block;margin:0 auto;}
-    .user-header .account{width:64vw;height:auto;box-sizing:border-box;color:#9aa5b5;font-size:3.1vw;line-height:6.4vw;position:relative}
-    .user-header .account .name{font-size:3.7vw;color:#22272e}
-    .user-header .account em{font-style:normal;color:#FF5B00}
-    .user-header .account .name a,.user-header .account .msg a{display:inline-block;height:5.4vw;line-height:5.4vw;padding:0 2vw;color:#FFF;border-radius:2px;margin-left:2vw}
-    .user-header .account .name a{background-color:#FF5B00;position: relative;}
-    .user-header .account .name a .name-tips{width: 11.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 12px;color: #FF5B00;position: absolute;right: -20px;top: -25px;z-index: 99;}
-    .user-header .account .name a .name-tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
-    .user-header .account .msg{ margin-top: 1.2vw;}
-    .user-header .account .msg a{background-color:#313a43}
-    .user-header .account .user-info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-wrap:wrap;flex-wrap:wrap}
-    .user-header .account .user-info a,.user-header .account .user-info span{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin-right:1.6vw}
-    .user-header .account .user-info .username{width:100%;font-size:3.6vw;font-weight:bold;color:#22272e;display:inline-block}
-    .user-header .account .user-info .update{position:relative;height:5.4vw;background:#FFE6DC;border:1px solid #FF5B00;opacity:1;border-radius:2px;color:#FF5B00;font-size:3.2vw;line-height:22px;text-align:center;margin-left:0}
-    .user-header .account .user-info .update .name-tips{width:44px;height:19px;line-height:19px;text-align:center;border-radius:10px;background-color:#ffe6dc;font-size:12px;color:#FF5B00;position:absolute;right:0;top:-25px;z-index:99}
-    .user-header .account .user-info .update .name-tips:before{content:'';width:6px;height:6px;background-color:#ffe6dc;position:absolute;bottom:-3px;left:12px;z-index:-1;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
-    .user-header .account .user-info .agency{width:16vw;height:5.4vw;text-align:center;border-radius:2px;font-size:3.2vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-    .user-header .account .user-info .agency.ordinary{background:#E7EAEF;border:1px solid #627386;color:#627386}
-    .user-header .account .user-info .agency.vip{background:#FFF2D5;border:1px solid #FFD54F;color:#E4AA43}
-    .user-header .account .user-info .vip-icon{height:5.4vw;text-align:center;border-radius:2px;font-size:3.2vw;font-weight:400}
-    .user-header .account .user-info .vip-icon.vip{width:8vw;color:#4E4539;background:#F0CB72}
-    .user-header .account .user-info .vip-icon.svip{width:9vw;color:#F0CB72;background:#333333}
-    .user-header .account .update a{position: relative;width: 32.6vw;height: 8.5vw;display: block; background-color:#ffe6dc;box-sizing: border-box;border: 1px solid #FF5B00;line-height: 8.5vw;text-align: center;color: #FF5B00;font-size: 3.4vw;border-radius: 4.25vw;}
-    .user-header .account .update a .name-tips{width: 12.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 2.8vw;color: #FF5B00;position: absolute;right: -2vw;top: -6.5vw;z-index: 99;}
-    .user-header .account .update a .name-tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
-    .user-header .message{position:absolute;right:0;top:5vw}
-    .user-header .message .mIcon{position:absolute;right:0;top:0}
-    .user-header .message .mIcon:before{width:8vw;height:8vw;background-position:-16.5vw -60.3vw}
-    .user-header .message .ellipse,.user-header .message .circular{padding:.6vw;border-radius:3.1vw;font-size:3.1vw;background-color:#f55c5c;color:#FFF;font-style:normal;position:absolute;right:4vw;top:-1vw;transform:scale(.7)}
-    .user-header .message .circular{padding:0 1vw;}
-    .user-content{width:100%;margin:0 auto 2.4vw auto;background:#FFF;padding-top: 2.4vw;margin-top: 2.4vw;}
-    .user-content .section .user-main.account{height: 23vw;box-sizing: border-box;padding: 2vw 3.2vw;}
-    .user-content .section .user-main.account .account-cell{line-height:9vw;font-size:3.4vw;color: #333333;float: left;margin-right: 10vw;display: block;}
-    .user-content .section .user-main.account .account-cell .red{font-size:4.2vw;color: #f94b4b;font-weight: bold;}
-    .user-content .section .user-main.collec{width: 20vw;height: 20vw;box-sizing: border-box;padding: 3vw 3.2vw;}
-    .user-content .section .user-main.collec .account-collec{height: 20vw;box-sizing: border-box;width: 100%;display: block;}
-    .user-content .section .user-main.collec .account-collec img{height: 6.4vw;width: 6.4vw;display: block;margin: 0 auto;margin-bottom: 1vw;}
-    .user-content .section .user-main.collec .account-collec p{height: 4.4vw;line-height: 4.4vw;text-align: center;font-size: 3vw;color: #333333;}
-    .user-content .user-main .tabs-left{box-sizing:border-box;width:100vw;padding:.7vw 6vw 4vw 6vw}
-    .user-content .user-main .tabs-left .item{width:20.8vw;height:8.4vw;line-height:8.4vw;text-align:center;border-radius:4.2vw;border:1px solid #b8bfca;font-size:3.3vw;color:#627386;margin:3.3vw 4vw 0 4vw;position:relative}
-    .user-content .user-main .tabs-left .item .icon span{height:4.6vw;line-height:4.6vw;padding:0 .6vw;border-radius:2.1vw;font-size:3.1vw;background-color:#f55c5c;color:#FFF;font-style:normal;position:absolute;right:1vw;top:-2vw}
-    .user-content .title{box-sizing:border-box;padding:0 3.2vw;height:10.3vw;line-height:10.3vw;font-size:3.4vw;color:#22272e}
-    .user-content .title.order{height:6vw;line-height:6vw;}
-    .user-content .title a{float:right;color:#627386}
-    .user-content .title a:after{content:'\276F';margin-left:1vw}
-    .user-content .user-main.product{box-sizing:border-box;width:100%;height:43vw;padding:0 3.2vw;overflow-x:scroll;overflow-y:hidden;white-space:nowrap}
-    .user-content .product-item{display:inline-block;width:26.7vw;height:43vw;margin-right:2.6vw;overflow:hidden}
-    .user-content .product-item .product-img{box-sizing:border-box;width:100%;height:26.7vw;border:solid 1px #fef6f3}
-    .user-content .product-item .product-name p{margin-top:2.6vw;line-height:6vw;font-size:3.4vw;color:#627386;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
-    .user-content .user-main.news{box-sizing:border-box;width:100%;padding:0 3.2vw 2vw 3.2vw}
-    .user-content .user-main .new-list{box-sizing:border-box;display:block;margin-bottom:2vw;font-size:3.4vw;position:relative;padding-left:4vw;line-height:6vw}
-    .user-content .user-main .new-list:before{content:'\25CF';color:#9aa5b5;position:absolute;left:0}
-    .user-content .user-main .new-list .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#4a4f58}
-    .user-content .user-main .new-list .time{color:#9aa5b5}
-    .user-content.coupon{width: 100%;height: 32vw;background: none}
-    .user-content.coupon .coupon_img{width: 100%;height: 100%;}
-    /*SVIP*/
-    .svip-content{margin-top:2vw}
-    .svip-content .title{display: none}
-
-    .svip-content .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100vw;height:20.6vw;padding:0 5vw 0 17vw ;background:url(https://static.caimei365.com/app/img/svip/h5-cm-svip-bg-01.png) no-repeat center;background-size:100vw 20.6vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-    .svip-content .section div{-webkit-box-flex:1;-ms-flex:1;flex:1;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;color:#F0CB72}
-    .svip-content .section div span:first-child{font-size:3.4vw;font-weight:400;color:#F0CB72}
-    .svip-content .section div span.error{color: #FF2A2A}
-    .svip-content .section div span:last-child{font-size:3.2vw;font-weight:400;color:#BCBCBC;margin-top: 1.6vw}
-    .svip-content .section a.btn{width:19.2vw;height:7.2vw;color:#4E4539;text-align:center;line-height:7.2vw;background:-webkit-gradient(linear,right top,left top,from(#FEE9BA),to(#F0CB72));background:-o-linear-gradient(right,#FEE9BA 0%,#F0CB72 100%);background:linear-gradient(270deg,#FEE9BA 0%,#F0CB72 100%);border-radius:2px}
-    .svip-content .section a.link{font-size:3.2vw;font-weight:400;color:#F0CB72}
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*个人中心右侧*/
+    .crumbs{font-size: 16px;}
+    .user-header{width:100%;height:120px;box-sizing:border-box;padding:20px;background-color:#FFF;box-shadow:0px 3px 6px 0px rgba(0,0,0,0.07);position:relative;border-radius: 8px;}
+    .user-header .logo{width:80px;height:80px;float:left;border:1px solid #f5f5f5;border-radius:4px;margin-right:8px;position:relative;cursor:pointer;overflow: hidden;}
+    .user-header .logo .logo-file{width:80px;height:80px;position:relative;outline:none;opacity:0;position:absolute;top:0;left:0;cursor:pointer}
+    .user-header .logo .file{display:block;width:80px;height:80px;line-height:78px;text-align:center}
+    .user-header .logo .file:before{width:40px;height:40px;background-position:-156px -364px;vertical-align:middle}
+    .user-header .logo img{width:80px;height:80px;display:block;border-radius:4px}
+    .user-header .account{float:left;box-sizing:border-box;padding:5px 0}
+    .user-header .account .name{width:100%;height:36px;float:left;margin-bottom:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}
+    .user-header .account .name a,.user-header .account .name span{display:block;margin-left:8px}
+    .user-header .account .name .username{line-height:36px;font-size:18px;font-weight:bold;color:#22272e;display:inline-block;float:left}
+    .user-header .account .name .update{position:relative;width:104px;height:24px;background:#FFE6DC;border:1px solid #FF5B00;opacity:1;border-radius:2px;color:#FF5B00;font-size:12px;line-height:22px;text-align:center}
+    .user-header .account .name .update .name-tips{width:44px;height:19px;line-height:19px;text-align:center;border-radius:10px;background-color:#ffe6dc;font-size:12px;color:#FF5B00;position:absolute;right:-20px;top:-25px;z-index:99}
+    .user-header .account .name .update .name-tips:before{content:'';width:6px;height:6px;background-color:#ffe6dc;position:absolute;bottom:-3px;left:12px;z-index:-1;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
+    .user-header .account .name .agency{width:64px;height:24px;text-align:center;line-height:22px;border-radius:12px;font-size:12px;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .user-header .account .name .agency.ordinary{background:#E7EAEF;border:1px solid #627386;color:#627386}
+    .user-header .account .name .agency.vip{background:#FFF2D5;border:1px solid #FFD54F;color:#E4AA43}
+    .user-header .account .name .vip-icon{height:24px;text-align:center;line-height:24px;border-radius:12px;font-size:12px;font-weight:400;padding: 0 10px;}
+    .user-header .account .name .vip-icon.vip{color:#4E4539;background:#F0CB72}
+    .user-header .account .name .vip-icon.svip{color:#F0CB72;background:#333333}
+    .user-header .account .msg{width:100%;font-size:14px;line-height:26px;color:#22272e;margin-top:20px}
+    .user-header .account .msg em{color:#22272e;display:inline-block;margin-right:8px}
+    .user-header .account .msg .red{color:#f94b4b;font-style:normal;margin:0 5px}
+    .user-header .account .msg a{display:inline-block;height:22px;line-height:22px;padding:0 8px;color:#FFFFFF;font-size:12px;text-align:center;background-image:linear-gradient(225deg,#61686f 0%,#313a43 100%);border-radius:11px}
+    .user-header .account .money{position:absolute;right:15px;bottom:20px;font-size:16px}
+    .user-header .account .money em{color:#FF5B00;font-style:normal;}
+    .user-header .message{position:absolute;height:28px;right:15px;top:20px}
+    .user-header .message a{width:28px;height:28px;float:right;display:block;position:relative}
+    .user-header .message .icon{width:28px;height:28px;float:right;display:block;position:relative}
+    .user-header .message .icon:before{width:28px;height:28px;background-position:-240px -370px}
+    .user-header .message .icon span{display:block;width:20px;height:20px;background-image:linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position:absolute;top:-9px;left:-9px;font-style:normal;font-size:12px;color:#f94b4b;line-height:20px;text-align:center;border-radius:50%;color:#fff}
+    .user-header .message .icon span.ellipse{width:30px;height:20px;border-radius:10px;line-height:20px;left:-22px}
+    .user-content{width:100%;height:auto;margin-top:10px}
+    .user-content .title{width: 100%;height: 44px;line-height: 44px;font-size: 16px;text-align: left;color: #22272e;padding: 0 20px}
+    .user-content .title a{display: block;float: right;position: relative;padding-right: 36px;position: relative;}
+    .user-content .title a .icon{display: block;width: 18px;height: 18px;position: absolute;top: 5px;right: 10px;}
+    .user-content .title a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
+    .user-content .section{width: 100%;height: auto;}
+    .user-content .section .user-main{width: 100%;height:auto;background-color: #FFFFFF;box-sizing: border-box;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;border-radius: 8px;}
+    .user-content .section .user-main.tabs{height: 90px;padding: 15px 20px;}
+    .user-content .section .user-main.account{height: 78px;}
+    .user-content .section .user-main.account .account-cell{line-height: 34px;font-size:14px;color: #333333;float: left;margin-right: 80px;display: block;}
+    .user-content .section .user-main.account .account-cell .red{font-size:16px;color: #f94b4b;font-weight: bold;}
+    .user-content .section .user-main.collec{height: 78px;padding: 10px 20px;}
+    .user-content .section .user-main.collec .account-collec{width: 72px;display: block;float: left;}
+    .user-content .section .user-main.collec .account-collec img{height: 26px;width: 26px;display: block;margin: 0 auto;margin-bottom: 2px;}
+    .user-content .section .user-main.collec .account-collec p{height: 26px;line-height: 26px;text-align: center;font-size: 14px;color: #333333;}
+    .user-content .section .user-main .tabs-left{height: 100%;float: left;}
+    .user-content .section .user-main .tabs-left .item{width: 50px;height: 100%;float: left;margin:0 40px;}
+    .user-content .section .user-main .tabs-left .item a{width: 100%;height: 100%;display: block;}
+    .user-content .section .user-main .tabs-left .item a .icon{width: 24px;height: 24px;display: block;margin: 0 auto;position: relative;margin-top: 10px;}
+    .user-content .section .user-main .tabs-left .item a .icon span{display: block;width: 20px;height: 20px;background-image: linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position: absolute;top: -9px;right: -13px;font-style: normal;font-size: 13px;color: #f94b4b;line-height: 20px;text-align: center;border-radius: 50%;color: #fff;}
+    .user-content .section .user-main .tabs-left .item a .icon span.ellipse{width: 30px;height: 20px;border-radius: 10px;line-height: 20px;right: -22px;}
+    .user-content .section .user-main .tabs-left .item a .icon.icon-1:before{width: 24px;height: 24px;background-position: 0px -512px;}
+    .user-content .section .user-main .tabs-left .item a .icon.icon-2:before{width: 24px;height: 24px;background-position: -38px -512px;}
+    .user-content .section .user-main .tabs-left .item a .icon.icon-3:before{width: 24px;height: 24px;background-position: -73px -512px;}
+    .user-content .section .user-main .tabs-left .item a .icon.icon-4:before{width: 24px;height: 24px;background-position: -110px -512px;}
+    .user-content .section .user-main .tabs-left .item a .icon.icon-5:before{width: 24px;height: 24px;background-position: -145px -512px;}
+    .user-content .section .user-main .tabs-left .item a .p{display:block;font-size: 14px;color: #22272e;text-align: center;line-height: 20px;margin-top: 3px;}
+    .user-content .section .user-main .tabs-right{float: right;line-height: 60px;font-size: 14px;color: #22272e;}
+    .user-content .section .user-main .tabs-right a{display: block;float: right;padding-right: 16px;position: relative}
+    .user-content .section .user-main .tabs-right a .icon{width: 18px;height: 18px;display: block;position: absolute;top: 4px;right: -10px;}
+    .user-content .section .user-main .tabs-right a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
+    .user-content .section .user-main.order{height: 224px;padding-left: 68px;padding-top: 10px;}
+    .user-content .section .user-main .order-title{width: 100%;height: 40px;position: relative;float: left;margin-bottom: 0;}
+    .user-content .section .user-main .order-title .bag{display: block;position: absolute;left: -45px;top: 12px; width: 36px;height: 16px;background-image: linear-gradient(335deg,#FF5B00 0%,#ffb496 100%);border-radius: 2px;font-size: 10px;color: #FFFFFF;line-height: 16px;text-align: center;}
+    .user-content .section .user-main .order-title .title-name{float: left;line-height:  40px;font-size: 14px;color: #22272e;}
+    .user-content .section .user-main .order-title .title-name p{float: left;margin-right: 10px;}
+    .user-content .section .user-main .order-title .title-name p.state{color: #FF5B00;}
+    .user-content .section .user-main .order-title .title-type{float: left;width: 40px;height: 40px;background: url("/img/order/second.png")center center no-repeat;background-size: cover;}
+    .user-content .section .user-main .order-title .title-time{float: right;line-height:  40px;font-size: 12px;color: #9aa5b5;}
+    .user-content .section .user-main .order-content{width: 100%;height: auto;float: left;}
+    .user-content .section .user-main .order-content .order-item{width: 100%;height: 36px;float: left;}
+    .user-content .section .user-main .order-content .order-item p{float: left;margin-right: 50px;line-height: 36px;color: #22272e;font-size: 14px;}
+    .user-content .section .user-main .order-content .order-item p span{margin-left: 5px;}
+    .user-content .section .user-main .order-content .order-item p .red{color: #f94b4b;}
+    .user-content .section .user-main .order-content .order-botton{width: 100%;height: 36px;float: left;margin-top: 8px;}
+    .user-content .section .user-main .order-content .order-botton .btn{width: 88px;height: 34px;border-radius: 2px;border: 1px solid #FFF;float: right;margin-left: 16px;font-size: 14px;line-height: 34px;text-align: center;display: block;}
+    .user-content .section .user-main .order-content .order-botton .btn.cancel{border-color: #9aa5b5;background-color: #FFFFFF;color: #22272e;}
+    .user-content .section .user-main .order-content .order-botton .btn.primary{border-color: #FF5B00;background-color: #FF5B00;color: #FFFFFF;}
+    .user-content .section .user-main.product{height: 260px;padding: 20px 20px 10px 20px;}
+    .user-content .section .user-main .product-item{width: 173px;height: auto;float: left;margin-right: 15px;cursor: pointer;}
+    .user-content .section .user-main .product-item:last-child{margin-right: 0;}
+    .user-content .section .user-main .product-item .product-img{width: 171px;height: 171px;float: left;border: 1px solid #e2e7ef;}
+    .user-content .section .user-main .product-item .product-img img{width: 173px;height: 173px;display: block;}
+    .user-content .section .user-main .product-item .product-name{width: 100%;height: 40px;float: left;margin-top: 10px;}
+    .user-content .section .user-main .product-item .product-name p{font-size: 14px;color: #93979f;text-align: justify;line-height: 20px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
+    .user-content .section .user-main .product-item .product-name p:hover{color: #FF5B00;text-decoration: underline;}
+    .user-content .section .user-main.news{height: 207px;padding: 13px 20px;}
+    .user-content .section .user-main .new-list{width: 100%;height: 36px;float: left;cursor: pointer;}
+    .user-content .section .user-main .new-list .text{width: 600px;line-height: 36px;font-size: 14px;color: #4a4f58;float: left;padding-left: 15px;position: relative; white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}
+    .user-content .section .user-main .new-list .text:hover{color: #FF5B00;text-decoration: underline;}
+    .user-content .section .user-main .new-list .text:before{content: '';width: 6px;height: 6px;border-radius: 50%;background-color: #FF5B00;position: absolute;left: 0;top:15px;}
+    .user-content .section .user-main .new-list .time{line-height: 36px;font-size: 12px;color: #9aa5b5;float: right;}
+    .user-content.coupon{width: 100%;height: 240px}
+    .user-content.coupon .coupon_img{width: 100%;height: 100%;}
+    /*SVIP*/
+    .svip-content{margin-top:10px}
+    .svip-content .title{width:100%;height:44px;line-height:44px;font-size:16px;text-align:left;color:#22272e;padding:0 20px}
+    .svip-content .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:968px;height:78px;padding:0 24px 0 110px;background:url(https://static.caimei365.com/app/img/svip/pc-cm-svip-bg-01.png) no-repeat center;background-size:968px 78px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius: 8px;}
+    .svip-content .section div{-webkit-box-flex:1;-ms-flex:1;flex:1;color:#F0CB72}
+    .svip-content .section div span:first-child{font-size:16px;font-weight:400;color:#F0CB72}
+    .svip-content .section div span.error{color: #FF2A2A}
+    .svip-content .section div span:last-child{font-size:14px;font-weight:400;color:#BCBCBC;margin-left: 10px}
+    .svip-content .section a.btn{width:104px;height:36px;color:#4E4539;text-align:center;line-height:36px;background:-webkit-gradient(linear,right top,left top,from(#FEE9BA),to(#F0CB72));background:-o-linear-gradient(right,#FEE9BA 0%,#F0CB72 100%);background:linear-gradient(270deg,#FEE9BA 0%,#F0CB72 100%);border-radius:18px}
+    .svip-content .section a.link{font-size:16px;font-weight:400;color:#F0CB72}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .user-header{box-sizing:border-box;width:100%;padding:2.7vw;background:#fff;position:relative}
+    .user-header .logo{width:26.7vw;height:19.4vw;border:solid 1px #f5f5f5;margin-right:2.7vw;position:relative}
+    .user-header .logo .logo-file{width:26.7vw;height:19.4vw;outline:none;opacity:0;position:absolute;top:0;left:0}
+    .user-header .logo .file{position:absolute;top:5vw;left:9vw;width:9vw;height:9vw}
+    .user-header .logo .file:before{width:9vw;height:9vw;background-position:-7.5vw -60.3vw}
+    .user-header .logo img{max-width:100%;max-height:100%;display:block;margin:0 auto;}
+    .user-header .account{width:64vw;height:auto;box-sizing:border-box;color:#9aa5b5;font-size:3.1vw;line-height:6.4vw;position:relative}
+    .user-header .account .name{font-size:3.7vw;color:#22272e}
+    .user-header .account em{font-style:normal;color:#FF5B00}
+    .user-header .account .name a,.user-header .account .msg a{display:inline-block;height:5.4vw;line-height:5.4vw;padding:0 2vw;color:#FFF;border-radius:2px;margin-left:2vw}
+    .user-header .account .name a{background-color:#FF5B00;position: relative;}
+    .user-header .account .name a .name-tips{width: 11.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 12px;color: #FF5B00;position: absolute;right: -20px;top: -25px;z-index: 99;}
+    .user-header .account .name a .name-tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
+    .user-header .account .msg{ margin-top: 1.2vw;}
+    .user-header .account .msg a{background-color:#313a43}
+    .user-header .account .user-info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-wrap:wrap;flex-wrap:wrap}
+    .user-header .account .user-info a,.user-header .account .user-info span{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin-right:1.6vw}
+    .user-header .account .user-info .username{width:100%;font-size:3.6vw;font-weight:bold;color:#22272e;display:inline-block}
+    .user-header .account .user-info .update{position:relative;height:5.4vw;background:#FFE6DC;border:1px solid #FF5B00;opacity:1;border-radius:2px;color:#FF5B00;font-size:3.2vw;line-height:22px;text-align:center;margin-left:0}
+    .user-header .account .user-info .update .name-tips{width:44px;height:19px;line-height:19px;text-align:center;border-radius:10px;background-color:#ffe6dc;font-size:12px;color:#FF5B00;position:absolute;right:0;top:-25px;z-index:99}
+    .user-header .account .user-info .update .name-tips:before{content:'';width:6px;height:6px;background-color:#ffe6dc;position:absolute;bottom:-3px;left:12px;z-index:-1;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
+    .user-header .account .user-info .agency{width:16vw;height:5.4vw;text-align:center;border-radius:2px;font-size:3.2vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .user-header .account .user-info .agency.ordinary{background:#E7EAEF;border:1px solid #627386;color:#627386}
+    .user-header .account .user-info .agency.vip{background:#FFF2D5;border:1px solid #FFD54F;color:#E4AA43}
+    .user-header .account .user-info .vip-icon{height:5.4vw;text-align:center;border-radius:2px;font-size:3.2vw;font-weight:400}
+    .user-header .account .user-info .vip-icon.vip{width:8vw;color:#4E4539;background:#F0CB72}
+    .user-header .account .user-info .vip-icon.svip{width:9vw;color:#F0CB72;background:#333333}
+    .user-header .account .update a{position: relative;width: 32.6vw;height: 8.5vw;display: block; background-color:#ffe6dc;box-sizing: border-box;border: 1px solid #FF5B00;line-height: 8.5vw;text-align: center;color: #FF5B00;font-size: 3.4vw;border-radius: 4.25vw;}
+    .user-header .account .update a .name-tips{width: 12.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 2.8vw;color: #FF5B00;position: absolute;right: -2vw;top: -6.5vw;z-index: 99;}
+    .user-header .account .update a .name-tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
+    .user-header .message{position:absolute;right:0;top:5vw}
+    .user-header .message .mIcon{position:absolute;right:0;top:0}
+    .user-header .message .mIcon:before{width:8vw;height:8vw;background-position:-16.5vw -60.3vw}
+    .user-header .message .ellipse,.user-header .message .circular{padding:.6vw;border-radius:3.1vw;font-size:3.1vw;background-color:#f55c5c;color:#FFF;font-style:normal;position:absolute;right:4vw;top:-1vw;transform:scale(.7)}
+    .user-header .message .circular{padding:0 1vw;}
+    .user-content{width:100%;margin:0 auto 2.4vw auto;background:#FFF;padding-top: 2.4vw;margin-top: 2.4vw;}
+    .user-content .section .user-main.account{height: 23vw;box-sizing: border-box;padding: 2vw 3.2vw;}
+    .user-content .section .user-main.account .account-cell{line-height:9vw;font-size:3.4vw;color: #333333;float: left;margin-right: 10vw;display: block;}
+    .user-content .section .user-main.account .account-cell .red{font-size:4.2vw;color: #f94b4b;font-weight: bold;}
+    .user-content .section .user-main.collec{width: 20vw;height: 20vw;box-sizing: border-box;padding: 3vw 3.2vw;}
+    .user-content .section .user-main.collec .account-collec{height: 20vw;box-sizing: border-box;width: 100%;display: block;}
+    .user-content .section .user-main.collec .account-collec img{height: 6.4vw;width: 6.4vw;display: block;margin: 0 auto;margin-bottom: 1vw;}
+    .user-content .section .user-main.collec .account-collec p{height: 4.4vw;line-height: 4.4vw;text-align: center;font-size: 3vw;color: #333333;}
+    .user-content .user-main .tabs-left{box-sizing:border-box;width:100vw;padding:.7vw 6vw 4vw 6vw}
+    .user-content .user-main .tabs-left .item{width:20.8vw;height:8.4vw;line-height:8.4vw;text-align:center;border-radius:4.2vw;border:1px solid #b8bfca;font-size:3.3vw;color:#627386;margin:3.3vw 4vw 0 4vw;position:relative}
+    .user-content .user-main .tabs-left .item .icon span{height:4.6vw;line-height:4.6vw;padding:0 .6vw;border-radius:2.1vw;font-size:3.1vw;background-color:#f55c5c;color:#FFF;font-style:normal;position:absolute;right:1vw;top:-2vw}
+    .user-content .title{box-sizing:border-box;padding:0 3.2vw;height:10.3vw;line-height:10.3vw;font-size:3.4vw;color:#22272e}
+    .user-content .title.order{height:6vw;line-height:6vw;}
+    .user-content .title a{float:right;color:#627386}
+    .user-content .title a:after{content:'\276F';margin-left:1vw}
+    .user-content .user-main.product{box-sizing:border-box;width:100%;height:43vw;padding:0 3.2vw;overflow-x:scroll;overflow-y:hidden;white-space:nowrap}
+    .user-content .product-item{display:inline-block;width:26.7vw;height:43vw;margin-right:2.6vw;overflow:hidden}
+    .user-content .product-item .product-img{box-sizing:border-box;width:100%;height:26.7vw;border:solid 1px #fef6f3}
+    .user-content .product-item .product-name p{margin-top:2.6vw;line-height:6vw;font-size:3.4vw;color:#627386;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
+    .user-content .user-main.news{box-sizing:border-box;width:100%;padding:0 3.2vw 2vw 3.2vw}
+    .user-content .user-main .new-list{box-sizing:border-box;display:block;margin-bottom:2vw;font-size:3.4vw;position:relative;padding-left:4vw;line-height:6vw}
+    .user-content .user-main .new-list:before{content:'\25CF';color:#9aa5b5;position:absolute;left:0}
+    .user-content .user-main .new-list .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#4a4f58}
+    .user-content .user-main .new-list .time{color:#9aa5b5}
+    .user-content.coupon{width: 100%;height: 32vw;background: none}
+    .user-content.coupon .coupon_img{width: 100%;height: 100%;}
+    /*SVIP*/
+    .svip-content{margin-top:2vw}
+    .svip-content .title{display: none}
+
+    .svip-content .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100vw;height:20.6vw;padding:0 5vw 0 17vw ;background:url(https://static.caimei365.com/app/img/svip/h5-cm-svip-bg-01.png) no-repeat center;background-size:100vw 20.6vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .svip-content .section div{-webkit-box-flex:1;-ms-flex:1;flex:1;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;color:#F0CB72}
+    .svip-content .section div span:first-child{font-size:3.4vw;font-weight:400;color:#F0CB72}
+    .svip-content .section div span.error{color: #FF2A2A}
+    .svip-content .section div span:last-child{font-size:3.2vw;font-weight:400;color:#BCBCBC;margin-top: 1.6vw}
+    .svip-content .section a.btn{width:19.2vw;height:7.2vw;color:#4E4539;text-align:center;line-height:7.2vw;background:-webkit-gradient(linear,right top,left top,from(#FEE9BA),to(#F0CB72));background:-o-linear-gradient(right,#FEE9BA 0%,#F0CB72 100%);background:linear-gradient(270deg,#FEE9BA 0%,#F0CB72 100%);border-radius:2px}
+    .svip-content .section a.link{font-size:3.2vw;font-weight:400;color:#F0CB72}
+}
+

src/main/resources/static/css/user-center/operation/list.css

@@ -1,80 +1,80 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*个人中心右侧*/
-    .navLayout .right{float:right;width:968px}
-    .order-header{width: 100%;height: 78px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .order-header .header-bt {width: 100%;height: 38px;float: left;}
-    .order-header .header-bt .header-search{width: 560px;height: 38px;float: left;}
-    .order-header .header-bt .search{height: 38px;float: left;margin-right: 15px;}
-    .order-header .header-bt .search .label{display: inline-block;float: left;height: 38px;line-height:38px;font-size: 12px;color: #627386;margin-right: 15px;}
-    .order-header .header-bt .search .search-input{width: 210px;box-sizing: border-box;padding: 0 10px;font-size: 12px;line-height: 36px;border: 1px solid #b8bfca;border-radius: 2px; }
-    .order-header .header-bt .header-button{height: 38px;float: right;}
-    .order-header .header-bt .header-button .btn-serch{width: 90px;height: 36px;display: block;background-color: #FF5B00;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FFFFFF;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
-    .order-header .header-bt .header-button .btn-add{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
-
-    .container{width: 100%;height:auto;box-sizing: border-box;margin-top: 8px;}
-    .container .empty{background-color:#FFF;}
-    .container .section{width: 100%;height:auto;padding-bottom: 16px;box-sizing: border-box;padding:0 16px 16px 16px;background-color: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .container .section .title{width: 100%;height: 54px;border-bottom: 1px solid #e2e7ef;}
-    .container .section .title .td{height: 54px;font-size: 14px;color:#627386;float: left;line-height:54px;text-align: left;}
-    .container .section .title .td.td-1{width:10%;}
-    .container .section .title .td.td-2{width:12%;text-align: center;}
-    .container .section .title .td.td-3{width:10%;text-align: center;}
-    .container .section .title .td.td-4{width:9%;text-align: center;}
-    .container .section .title .td.td-5{width:9%;text-align: center;}
-    .container .section .title .td.td-6{width:12%;text-align: center;}
-    .container .section .title .td.td-7{width:11%;text-align: center;}
-    .container .section .title .td.td-8{width:11%;text-align: center;}
-    .container .section .title .td.td-9{width:16%;text-align: center;}
-    .container .section .content{width: 100%;height: auto;padding: 16px 0 0 0;}
-    .container .section .list{width: 100%;height: 64px;}
-    .container .section .list .td{height: 64px;font-size: 14px;color:#22272e;float: left;line-height:25px;text-align: left;box-sizing: border-box;padding: 7px 0;}
-    .container .section .list .td p{line-height: 25px;width: 100%;float: left;}
-    .container .section .list .td.td-1{width:10%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
-    .container .section .list .td.td-2{width:12%;text-align: center;}
-    .container .section .list .td.td-3{width:10%;text-align: center;}
-    .container .section .list .td.td-4{width:9%;text-align: center;}
-    .container .section .list .td.td-5{width:9%;text-align: center;}
-    .container .section .list .td.td-6{width:12%;text-align: center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
-    .container .section .list .td.td-7{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
-    .container .section .list .td.td-8{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
-    .container .section .list .td.td-9{width:16%;text-align: center;}
-    .container .section .list .td.td-9{width:16%;text-align: center;}
-    .container .section .list .td.td-9 a{margin: 0 5px;}
-    .container .section .list .td.td-9 .upd{color: #1890f9;}
-    .container .section .list .td.td-9 .del{color: #f94b4b;}
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .order-header{padding: 2.7vw 4vw;background: #fff}
-    .search{width:100%;height: 11.8vw;border: 1px solid #b8bfca;margin-bottom: 2.7vw;line-height: 11.8vw;font-size:3.1vw;overflow: hidden;}
-    .search span.label{padding-left: 2.7vw;color: #627386}
-    .search-input {height: -webkit-fill-available;width: 70vw;font-size:3.1vw;border: none;border-radius: .27vw}
-    input::placeholder{color: #9aa5b5}
-    .header-button a{width: 35.3vw;height: 11.2vw;border: 1px solid #FF5B00;text-align: center;line-height: 11.2vw;background: #ffe6dc;
-    display: inline-block;color: #FF5B00;font-size: 3.7vw}
-    .header-button .btn-serch{color: #fff;background: #FF5B00}
-    .header-button{text-align:center;padding: 1.7vw 0;}
-    .section .list{margin: 2.7vw 0;background: #fff;padding: 2.7vw 3.3vw;}
-    .list div span{display: inline-block;line-height: 6.4vw;color: #9aa5b5;}
-    .list-one span{width: 35%;font-size: 3.2vw}
-    .list div span p{color: #22272e;font-size: 3.6vw}
-    .list-one span:last-child{width: 27%}
-    .operat{float: right}
-    .list div{margin-bottom: 1.7vw}
-    .operat  a{width: 22.4vw;height: 9.6vw;line-height: 9.6vw;text-align: center;display: inline-block; border-radius: 6.4vw;
-    font-size: 3.4vw;margin-left: 2.7vw}
-    .operat  a.del{border: 1px solid #f94b4b;background: #ffd8d8;color: #f94b4b;}
-    .operat  a.upd{border: 1px solid #1890f9;background: #e0f1ff;color: #1890f9;width: 23vw}
-
-
-
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*个人中心右侧*/
+    .navLayout .right{float:right;width:968px}
+    .order-header{width: 100%;height: 78px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
+    .order-header .header-bt {width: 100%;height: 38px;float: left;}
+    .order-header .header-bt .header-search{width: 560px;height: 38px;float: left;}
+    .order-header .header-bt .search{height: 38px;float: left;margin-right: 15px;}
+    .order-header .header-bt .search .label{display: inline-block;float: left;height: 38px;line-height:38px;font-size: 12px;color: #627386;margin-right: 15px;}
+    .order-header .header-bt .search .search-input{width: 210px;box-sizing: border-box;padding: 0 10px;font-size: 12px;line-height: 36px;border: 1px solid #b8bfca;border-radius:18px; }
+    .order-header .header-bt .header-button{height: 38px;float: right;}
+    .order-header .header-bt .header-button .btn-serch{width: 90px;height: 36px;display: block;background-color: #FF5B00;border-radius: 18px;border: solid 1px #FF5B00;font-size: 14px;color: #FFFFFF;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
+    .order-header .header-bt .header-button .btn-add{width: 128px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 18px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;float: left;margin: 0 5px;}
+
+    .container{width: 100%;height:auto;box-sizing: border-box;margin-top: 8px;border-radius: 8px;overflow: hidden;}
+    .container .empty{background-color:#FFF;}
+    .container .section{width: 100%;height:auto;padding-bottom: 16px;box-sizing: border-box;padding:0 16px 16px 16px;background-color: #FFFFFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
+    .container .section .title{width: 100%;height: 54px;border-bottom: 1px solid #e2e7ef;}
+    .container .section .title .td{height: 54px;font-size: 14px;color:#627386;float: left;line-height:54px;text-align: left;}
+    .container .section .title .td.td-1{width:10%;}
+    .container .section .title .td.td-2{width:12%;text-align: center;}
+    .container .section .title .td.td-3{width:10%;text-align: center;}
+    .container .section .title .td.td-4{width:9%;text-align: center;}
+    .container .section .title .td.td-5{width:9%;text-align: center;}
+    .container .section .title .td.td-6{width:12%;text-align: center;}
+    .container .section .title .td.td-7{width:11%;text-align: center;}
+    .container .section .title .td.td-8{width:11%;text-align: center;}
+    .container .section .title .td.td-9{width:16%;text-align: center;}
+    .container .section .content{width: 100%;height: auto;padding: 16px 0 0 0;}
+    .container .section .list{width: 100%;height: 64px;}
+    .container .section .list .td{height: 64px;font-size: 14px;color:#22272e;float: left;line-height:25px;text-align: left;box-sizing: border-box;padding: 7px 0;}
+    .container .section .list .td p{line-height: 25px;width: 100%;float: left;}
+    .container .section .list .td.td-1{width:10%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
+    .container .section .list .td.td-2{width:12%;text-align: center;}
+    .container .section .list .td.td-3{width:10%;text-align: center;}
+    .container .section .list .td.td-4{width:9%;text-align: center;}
+    .container .section .list .td.td-5{width:9%;text-align: center;}
+    .container .section .list .td.td-6{width:12%;text-align: center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
+    .container .section .list .td.td-7{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
+    .container .section .list .td.td-8{width:11%;text-align: center;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 25px;}
+    .container .section .list .td.td-9{width:16%;text-align: center;}
+    .container .section .list .td.td-9{width:16%;text-align: center;}
+    .container .section .list .td.td-9 a{margin: 0 5px;}
+    .container .section .list .td.td-9 .upd{color: #1890f9;}
+    .container .section .list .td.td-9 .del{color: #f94b4b;}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .order-header{padding: 2.7vw 4vw;background: #fff}
+    .search{width:100%;height: 11.8vw;border: 1px solid #b8bfca;margin-bottom: 2.7vw;line-height: 11.8vw;font-size:3.1vw;overflow: hidden;}
+    .search span.label{padding-left: 2.7vw;color: #627386}
+    .search-input {height: -webkit-fill-available;width: 70vw;font-size:3.1vw;border: none;border-radius: .27vw}
+    input::placeholder{color: #9aa5b5}
+    .header-button a{width: 35.3vw;height: 11.2vw;border: 1px solid #FF5B00;text-align: center;line-height: 11.2vw;background: #ffe6dc;
+    display: inline-block;color: #FF5B00;font-size: 3.7vw}
+    .header-button .btn-serch{color: #fff;background: #FF5B00}
+    .header-button{text-align:center;padding: 1.7vw 0;}
+    .section .list{margin: 2.7vw 0;background: #fff;padding: 2.7vw 3.3vw;}
+    .list div span{display: inline-block;line-height: 6.4vw;color: #9aa5b5;}
+    .list-one span{width: 35%;font-size: 3.2vw}
+    .list div span p{color: #22272e;font-size: 3.6vw}
+    .list-one span:last-child{width: 27%}
+    .operat{float: right}
+    .list div{margin-bottom: 1.7vw}
+    .operat  a{width: 22.4vw;height: 9.6vw;line-height: 9.6vw;text-align: center;display: inline-block; border-radius: 6.4vw;
+    font-size: 3.4vw;margin-left: 2.7vw}
+    .operat  a.del{border: 1px solid #f94b4b;background: #ffd8d8;color: #f94b4b;}
+    .operat  a.upd{border: 1px solid #1890f9;background: #e0f1ff;color: #1890f9;width: 23vw}
+
+
+
+}
+

src/main/resources/static/css/user-center/order/orderlist.css

@@ -1,131 +1,131 @@
-@charset "utf-8";
-li{list-style:none}
-/**
- * PC端
- */
-@media screen and (min-width:768px){
-    /*个人中心右侧*/
-    .navLayout .right{float:right;width:968px}
-    .order-header{width: 100%;height: 138px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
-    .order-header .header-tp{width: 100%;height: 38px;float: left;margin-bottom: 25px;}
-    .order-header .header-tp .header-tabs{width: 828px;height: 38px;float: left;}
-    .order-header .header-tp .header-tabs .tabs-item{width:16.66%;height: 38px;float: left;}
-    .order-header .header-tp .header-tabs .tabs-item a{width:100%;height: 100%;display: block;font-size: 16px;line-height: 38px;text-align: left;color: #9aa5b5;}
-    .order-header .header-tp .header-tabs .tabs-item.active a{color: #FF5B00;}
-    .order-header .header-tp .header-ser{height: 38px;float: right;}
-    .order-header .header-tp .header-ser .btn-server{width: 90px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 2px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;}
-    .order-header .header-bt {width: 100%;height: 38px;float: left;}
-    .order-header .header-bt .form-row {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
-    .order-header .header-bt .state {width: 320px !important;}
-    .order-header .header-bt .form-row .time {width: 185px !important;}
-    .order-header .header-bt .header-button{height: 38px;float: left;}
-
-    .order-container{width: 100%;min-height:410px;margin-top: 8px;}
-    .order-container .empty{background-color:#FFF;}
-    .order-container .title{width: 100%;height: 44px;line-height: 44px;font-size: 16px;text-align: left;color: #22272e;}
-    .order-container .title a{display: block;float: right;position: relative;padding-right: 36px;position: relative;}
-    .order-container .title a .icon{display: block;width: 18px;height: 18px;position: absolute;top: 5px;right: 10px;}
-    .order-container .title a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
-    .order-container .section{width: 100%;height: auto;}
-    .order-container .section .user-main{width: 100%;height:auto;background-color: #FFFFFF;box-sizing: border-box;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;}
-    .order-container .section .user-main.tabs{height: 78px;padding: 15px 20px;}
-    .order-container .section .user-main .tabs-left{height: 100%;float: left;}
-    .order-container .section .user-main .tabs-left .item{width: 50px;height: 100%;float: left;margin:0 40px;}
-    .order-container .section .user-main .tabs-left .item a{width: 100%;height: 100%;display: block;}
-    .order-container .section .user-main .tabs-left .item a .icon{width: 24px;height: 24px;display: block;margin: 0 auto;position: relative;}
-    .order-container .section .user-main .tabs-left .item a .icon span{display: block;width: 18px;height: 18px;background-image: linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position: absolute;top: -9px;left: -9px;font-style: normal;font-size: 13px;color: #f94b4b;line-height: 18px;text-align: center;border-radius: 50%;color: #fff;}
-    .order-container .section .user-main .tabs-left .item a .icon:before{width: 24px;height: 24px;background-position: -273px -370px;}
-    .order-container .section .user-main .tabs-left .item a p{font-size: 14px;color: #22272e;text-align: center;line-height: 20px;margin-top: 3px;}
-    .order-container .section .user-main .tabs-right{float: right;line-height: 48px;font-size: 14px;color: #22272e;}
-    .order-container .section .user-main .tabs-right a{display: block;float: right;padding-right: 16px;}
-    .order-container .section .user-main.order{height: 224px;padding-left: 68px;padding-top: 10px;}
-    .order-container .section .user-main .order-title{width: 100%;height: 40px;position: relative;float: left;margin-bottom: 0;}
-    .order-container .section .user-main .order-title .bag{display: block;position: absolute;left: -45px;top: 12px; width: 36px;height: 16px;background-image: linear-gradient(335deg,#FF5B00 0%,#ffb496 100%);border-radius: 2px;font-size: 10px;color: #FFFFFF;line-height: 16px;text-align: center;}
-    .order-container .section .user-main .order-title .title-name{float: left;line-height:  40px;font-size: 14px;color: #22272e;}
-    .order-container .section .user-main .order-title .title-name p{float: left;margin-right: 10px;}
-    .order-container .section .user-main .order-title .title-name p.state{color: #FF5B00;margin-left: 10px;font-weight: normal;}
-    .order-container .section .user-main .order-title .title-type{float: left;width: 40px;height: 40px;background: url("/img/order/second.png")center center no-repeat;background-size: cover;}
-    .order-container .section .user-main .order-title .title-time{float: right;line-height:  40px;font-size: 12px;color: #9aa5b5;}
-    .order-container .section .user-main .order-content{width: 100%;height: auto;float: left;}
-    .order-container .section .user-main .order-content .order-item{width: 100%;height: 36px;float: left;}
-    .order-container .section .user-main .order-content .order-item p{float: left;margin-right: 50px;line-height: 36px;color: #627386;font-size: 14px;}
-    .order-container .section .user-main .order-content .order-item p.confirm-text{float: right;color: #f94b4b;}
-    .order-container .section .user-main .order-content .order-item p span{margin-left: 5px;color: #22272e;}
-    .order-container .section .user-main .order-content .order-item p .red{color: #f94b4b;}
-    .order-container .section .user-main .order-content .order-botton{width: 100%;height: 36px;float: left;margin-top: 8px;}
-    .order-container .section .user-main .order-content .order-botton .btn{height: 34px;padding: 0 10px;border-radius: 2px;border: 1px solid #FFF;float: right;margin-left: 16px;font-size: 14px;line-height: 34px;text-align: center;display: block;}
-    .order-container .section .user-main .order-content .order-botton .btn.cancel{border-color: #9aa5b5;background-color: #FFFFFF;color: #22272e;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary{border-color: #FF5B00;background-color: #FF5B00;color: #FFFFFF;position: relative;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary .tips{width: 44px;height: 19px;line-height: 19px;text-align: center;border-radius: 10px;background-color: #ffe6dc;font-size: 12px;color: #FF5B00;position: absolute;right:0px;top: -25px;z-index: 99;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary .tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
-    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm{line-height: 15px;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm p{line-height: 15px;}
-    .order-container .section .user-main.product{height: 260px;padding: 20px 20px 10px 20px;}
-    .order-container .section .user-main .product-item{width: 173px;height: auto;float: left;margin-right: 15px;cursor: pointer;}
-    .order-container .section .user-main .product-item:last-child{margin-right: 0;}
-    .order-container .section .user-main .product-item .product-img{width: 173px;height: 173px;float: left;}
-    .order-container .section .user-main .product-item .product-img img{width: 173px;height: 173px;display: block;}
-    .order-container .section .user-main .product-item .product-name{width: 100%;height: 40px;float: left;margin-top: 10px;}
-    .order-container .section .user-main .product-item .product-name p{font-size: 14px;color: #93979f;text-align: justify;line-height: 20px;text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
-    .order-container .section .user-main .product-item .product-name p:hover{color: #FF5B00;text-decoration: underline;}
-    /*弹窗*/
-    .popup{width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;}
-    .popup-layer{-webkit-overflow-scrolling: touch;width: 390px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);background-color: #fff;-webkit-background-clip: content;border-radius: 2px;box-shadow: 1px 1px 50px rgba(0,0,0,.3);z-index: 1000;}
-    .popup-layer.bran{height: auto;}
-    .popup-layer .popup-title{padding: 0 80px 0 20px;height: 42px;line-height: 42px;border-bottom: 1px solid #eee;font-size: 14px;color: #333;overflow: hidden;background-color: #F8F8F8;border-radius: 2px 2px 0 0;position: relative;}
-    .popup-title .popup-close{width: 16px;height: 16px;display: block;position: absolute;right: 10px;top: 13px;background: url("/img/base/icon.png") -317px -2px no-repeat;cursor: pointer;}
-    .popup-layer .popup-content{min-height: 80px;box-sizing: border-box;padding:10px 16px;}
-    .popup-layer .popup-content .popup-message{box-sizing: border-box;padding: 8px 0;border-top: 1px solid #ebebeb;display: none;}
-    .popup-layer .popup-content p{font-size: 14px;color: #333;text-align: justify;line-height: 24px;}
-    .popup-layer .popup-content p input {border: none;background-color: #FFF;width: 60px;font-size: 14px;color: #333;}
-    .popup-layer .popup-content p.red{padding-left: 24px;color: #FF2A2A;margin-top: 10px;background: url("/web/order/img/icon-tips.png")no-repeat;}
-    .popup-layer .popup-content p span{color: #FF5B00;}
-    .popup-layer .popup-content p span.down{color: #333;display: inline-block;padding-right: 20px;background: url("/web/order/img/Retract.png") right center no-repeat;}
-    .popup-layer .popup-content p span.copy{width:42px;height:18px;background:linear-gradient(34deg,rgba(255,41,41,1) 0%,rgba(255,109,27,1) 100%);opacity:1;border-radius:3px;font-size: 12px;display: inline-block;line-height: 18px;color: #FFF;text-align: center;cursor: pointer;}
-    .popup-layer .popup-button{box-sizing: border-box;text-align: right;padding: 0 15px 12px;pointer-events: auto;user-select: none;-webkit-user-select: none;}
-    .popup-layer .popup-button .btn{height: 30px;line-height: 28px;margin: 5px 5px 0;padding: 0 15px;border: 1px solid #dedede;background-color: #fff;color: #333;border-radius: 2px;font-weight: 400;cursor: pointer;text-decoration: none;display: inline-block;}
-    .popup-layer .popup-button .btn.btn-confim{border-color: #FF5B00;background-color: #FF5B00;color: #fff;}
-    .popup-layer .popup-button .btn.btn-onlinePayConfim{border-color: #FF5B00;background-color: #FF5B00;color: #fff;}
-    input::placeholder{color: #9AA5B5}
-}
-
-/**
-* 移动端
-*/
-@media screen and (max-width:768px){
-    .order-container{width: 100%;min-height:120vw;background: #FFFFFF;}
-    .order-header{width:100%;background:#FFF;margin-bottom:1.5vw}
-    .header-tabs{padding:4vw 3.2vw;box-sizing:border-box;width:100%;overflow-y:hidden;overflow-x:scroll;white-space:nowrap;background:#FFF}
-    .header-tabs .tabs-item{display:inline-block;height:8.4vw;border:1px solid #b8bfca;line-height:8.4vw;padding:0 3vw;border-radius:4.2vw;margin-right:2.6vw}
-    .header-tabs .tabs-item a{color:#627386}
-    .header-tabs .tabs-item a span{color:#FF5B00}
-    .header-tabs .tabs-item.active{background-color:#ffe6dc;border-color:#FF5B00;color:#FF5B00}
-    .header-tabs .tabs-item.active a{color:#FF5B00}
-    .header-search{padding:0 3.3vw 2.6vw 3.3vw}
-    .order-header .header-bt{width: 100%;height: auto;float: left;}
-    .order-header .header-bt .form-row {margin:1.5vw 0;color: #627386;float: left;width: 100%;box-sizing: border-box;padding: 0 3vw;}
-    .order-header .header-bt .state {width: 100% !important;}
-    .order-header .header-bt .form-row.time{width: 100%;box-sizing: border-box;padding: 0 3vw;}
-    .order-header .header-bt .form-row .time {width: 47% !important;}
-    .order-header .header-bt .header-button{width: 100%;box-sizing: border-box;padding: 2vw 3vw;height: auto;float: left;text-align: right;}
-     .user-main.order{box-sizing:border-box;width:100%;background:#FFF;margin-bottom:1.5vw;padding:2vw 3.2vw 4vw 3.2vw;font-size:3.2vw;color:#627386;line-height:7vw}
-    .user-main.order .order-title{position:relative;height:16vw}
-    .user-main.order .order-title .title-name:nth-of-type(1){padding-left:11.6vw;color:#FF5B00;font-size:3.5vw;line-height:9vw}
-    .user-main.order .order-title .bag{position:absolute;left:0;top:2.6vw;width:9.6vw;height:4.2vw;line-height:4.2vw;text-align:center;color:#FFF;background-image:linear-gradient(90deg,#ffb427 0%,#f58e4d 100%);border-radius:2px}
-    .user-main.order .order-title .state{position:absolute;right:0;bottom:0;color:#FF5B00}
-    .user-main.order .order-title .title-time span,.user-main.order .order-content span{color:#22272e}
-    .user-main.order .order-content span.red{color: #f94b4b;}
-    .user-main.order .order-item p{display:inline-block;width:49%}
-    .user-main.order .order-botton{text-align:right;margin-top:2vw}
-    .user-main.order .order-botton .btn{display:inline-block;padding:0 2vw;height:9.5vw;line-height:9.5vw;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #FF5B00;color:#FF5B00;font-size:3.4vw;margin-left:2.6vw;vertical-align: text-top}
-    .user-main.order .order-botton .primary{background:#FF5B00;color:#FFF;position: relative;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm{line-height: 4.5vw;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm p{line-height: 5vw;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary .tips{width: 12.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 2.8vw;color: #FF5B00;position: absolute;right: -2vw;top: -6.5vw;z-index: 99;}
-    .order-container .section .user-main .order-content .order-botton .btn.primary .tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
-    footer{display: none;}
-
-
-
-}
-
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*个人中心右侧*/
+    .navLayout .right{float:right;width:968px}
+    .order-header{width: 100%;height: 138px;box-sizing: border-box;padding: 20px;background-color: #FFF;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);border-radius: 8px;}
+    .order-header .header-tp{width: 100%;height: 38px;float: left;margin-bottom: 25px;}
+    .order-header .header-tp .header-tabs{width: 828px;height: 38px;float: left;}
+    .order-header .header-tp .header-tabs .tabs-item{width:16.66%;height: 38px;float: left;}
+    .order-header .header-tp .header-tabs .tabs-item a{width:100%;height: 100%;display: block;font-size: 16px;line-height: 38px;text-align: left;color: #9aa5b5;}
+    .order-header .header-tp .header-tabs .tabs-item.active a{color: #FF5B00;}
+    .order-header .header-tp .header-ser{height: 38px;float: right;}
+    .order-header .header-tp .header-ser .btn-server{width: 90px;height: 36px;display: block;background-color: #ffe6dc;border-radius: 18px;border: solid 1px #FF5B00;font-size: 14px;color: #FF5B00;line-height: 36px;text-align: center;}
+    .order-header .header-bt {width: 100%;height: 38px;float: left;}
+    .order-header .header-bt .form-row {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 10px;margin-bottom: 10px}
+    .order-header .header-bt .state {width: 320px !important;}
+    .order-header .header-bt .form-row .time {width: 185px !important;}
+    .order-header .header-bt .header-button{height: 38px;float: left;}
+
+    .order-container{width: 100%;min-height:410px;margin-top: 8px;}
+    .order-container .empty{background-color:#FFF;}
+    .order-container .title{width: 100%;height: 44px;line-height: 44px;font-size: 16px;text-align: left;color: #22272e;}
+    .order-container .title a{display: block;float: right;position: relative;padding-right: 36px;position: relative;}
+    .order-container .title a .icon{display: block;width: 18px;height: 18px;position: absolute;top: 5px;right: 10px;}
+    .order-container .title a .icon:before{width: 18px;height: 18px;background-position: -304px -32px;}
+    .order-container .section{width: 100%;height: auto;}
+    .order-container .section .user-main{width: 100%;height:auto;background-color: #FFFFFF;box-sizing: border-box;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);margin-bottom: 10px;}
+    .order-container .section .user-main.tabs{height: 78px;padding: 15px 20px;}
+    .order-container .section .user-main .tabs-left{height: 100%;float: left;}
+    .order-container .section .user-main .tabs-left .item{width: 50px;height: 100%;float: left;margin:0 40px;}
+    .order-container .section .user-main .tabs-left .item a{width: 100%;height: 100%;display: block;}
+    .order-container .section .user-main .tabs-left .item a .icon{width: 24px;height: 24px;display: block;margin: 0 auto;position: relative;}
+    .order-container .section .user-main .tabs-left .item a .icon span{display: block;width: 18px;height: 18px;background-image: linear-gradient(90deg,#ff5353 0%,#ff2424 100%);position: absolute;top: -9px;left: -9px;font-style: normal;font-size: 13px;color: #f94b4b;line-height: 18px;text-align: center;border-radius: 50%;color: #fff;}
+    .order-container .section .user-main .tabs-left .item a .icon:before{width: 24px;height: 24px;background-position: -273px -370px;}
+    .order-container .section .user-main .tabs-left .item a p{font-size: 14px;color: #22272e;text-align: center;line-height: 20px;margin-top: 3px;}
+    .order-container .section .user-main .tabs-right{float: right;line-height: 48px;font-size: 14px;color: #22272e;}
+    .order-container .section .user-main .tabs-right a{display: block;float: right;padding-right: 16px;}
+    .order-container .section .user-main.order{height: 224px;padding-left: 68px;padding-top: 10px;border-radius: 8px;}
+    .order-container .section .user-main .order-title{width: 100%;height: 40px;position: relative;float: left;margin-bottom: 0;}
+    .order-container .section .user-main .order-title .bag{display: block;position: absolute;left: -45px;top: 12px; width: 36px;height: 16px;background-image: linear-gradient(335deg,#FF5B00 0%,#ffb496 100%);border-radius: 2px;font-size: 10px;color: #FFFFFF;line-height: 16px;text-align: center;}
+    .order-container .section .user-main .order-title .title-name{float: left;line-height:  40px;font-size: 14px;color: #22272e;}
+    .order-container .section .user-main .order-title .title-name p{float: left;margin-right: 10px;}
+    .order-container .section .user-main .order-title .title-name p.state{color: #FF5B00;margin-left: 10px;font-weight: normal;}
+    .order-container .section .user-main .order-title .title-type{float: left;width: 40px;height: 40px;background: url("/img/order/second.png")center center no-repeat;background-size: cover;}
+    .order-container .section .user-main .order-title .title-time{float: right;line-height:  40px;font-size: 12px;color: #9aa5b5;}
+    .order-container .section .user-main .order-content{width: 100%;height: auto;float: left;}
+    .order-container .section .user-main .order-content .order-item{width: 100%;height: 36px;float: left;}
+    .order-container .section .user-main .order-content .order-item p{float: left;margin-right: 50px;line-height: 36px;color: #627386;font-size: 14px;}
+    .order-container .section .user-main .order-content .order-item p.confirm-text{float: right;color: #f94b4b;}
+    .order-container .section .user-main .order-content .order-item p span{margin-left: 5px;color: #22272e;}
+    .order-container .section .user-main .order-content .order-item p .red{color: #f94b4b;}
+    .order-container .section .user-main .order-content .order-botton{width: 100%;height: 36px;float: left;margin-top: 8px;}
+    .order-container .section .user-main .order-content .order-botton .btn{height: 34px;padding: 0 10px;border-radius: 2px;border: 1px solid #FFF;float: right;margin-left: 16px;font-size: 14px;line-height: 34px;text-align: center;display: block;}
+    .order-container .section .user-main .order-content .order-botton .btn.cancel{border-color: #9aa5b5;background-color: #FFFFFF;color: #22272e;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary{border-color: #FF5B00;background-color: #FF5B00;color: #FFFFFF;position: relative;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary .tips{width: 44px;height: 19px;line-height: 19px;text-align: center;border-radius: 10px;background-color: #ffe6dc;font-size: 12px;color: #FF5B00;position: absolute;right:0px;top: -25px;z-index: 99;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary .tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
+    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm{line-height: 15px;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm p{line-height: 15px;}
+    .order-container .section .user-main.product{height: 260px;padding: 20px 20px 10px 20px;}
+    .order-container .section .user-main .product-item{width: 173px;height: auto;float: left;margin-right: 15px;cursor: pointer;}
+    .order-container .section .user-main .product-item:last-child{margin-right: 0;}
+    .order-container .section .user-main .product-item .product-img{width: 173px;height: 173px;float: left;}
+    .order-container .section .user-main .product-item .product-img img{width: 173px;height: 173px;display: block;}
+    .order-container .section .user-main .product-item .product-name{width: 100%;height: 40px;float: left;margin-top: 10px;}
+    .order-container .section .user-main .product-item .product-name p{font-size: 14px;color: #93979f;text-align: justify;line-height: 20px;text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
+    .order-container .section .user-main .product-item .product-name p:hover{color: #FF5B00;text-decoration: underline;}
+    /*弹窗*/
+    .popup{width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;}
+    .popup-layer{-webkit-overflow-scrolling: touch;width: 390px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);background-color: #fff;-webkit-background-clip: content;border-radius: 2px;box-shadow: 1px 1px 50px rgba(0,0,0,.3);z-index: 1000;}
+    .popup-layer.bran{height: auto;}
+    .popup-layer .popup-title{padding: 0 80px 0 20px;height: 42px;line-height: 42px;border-bottom: 1px solid #eee;font-size: 14px;color: #333;overflow: hidden;background-color: #F8F8F8;border-radius: 2px 2px 0 0;position: relative;}
+    .popup-title .popup-close{width: 16px;height: 16px;display: block;position: absolute;right: 10px;top: 13px;background: url("/img/base/icon.png") -317px -2px no-repeat;cursor: pointer;}
+    .popup-layer .popup-content{min-height: 80px;box-sizing: border-box;padding:10px 16px;}
+    .popup-layer .popup-content .popup-message{box-sizing: border-box;padding: 8px 0;border-top: 1px solid #ebebeb;display: none;}
+    .popup-layer .popup-content p{font-size: 14px;color: #333;text-align: justify;line-height: 24px;}
+    .popup-layer .popup-content p input {border: none;background-color: #FFF;width: 60px;font-size: 14px;color: #333;}
+    .popup-layer .popup-content p.red{padding-left: 24px;color: #FF2A2A;margin-top: 10px;background: url("/web/order/img/icon-tips.png")no-repeat;}
+    .popup-layer .popup-content p span{color: #FF5B00;}
+    .popup-layer .popup-content p span.down{color: #333;display: inline-block;padding-right: 20px;background: url("/web/order/img/Retract.png") right center no-repeat;}
+    .popup-layer .popup-content p span.copy{width:42px;height:18px;background:linear-gradient(34deg,rgba(255,41,41,1) 0%,rgba(255,109,27,1) 100%);opacity:1;border-radius:3px;font-size: 12px;display: inline-block;line-height: 18px;color: #FFF;text-align: center;cursor: pointer;}
+    .popup-layer .popup-button{box-sizing: border-box;text-align: right;padding: 0 15px 12px;pointer-events: auto;user-select: none;-webkit-user-select: none;}
+    .popup-layer .popup-button .btn{height: 30px;line-height: 28px;margin: 5px 5px 0;padding: 0 15px;border: 1px solid #dedede;background-color: #fff;color: #333;border-radius: 2px;font-weight: 400;cursor: pointer;text-decoration: none;display: inline-block;}
+    .popup-layer .popup-button .btn.btn-confim{border-color: #FF5B00;background-color: #FF5B00;color: #fff;}
+    .popup-layer .popup-button .btn.btn-onlinePayConfim{border-color: #FF5B00;background-color: #FF5B00;color: #fff;}
+    input::placeholder{color: #9AA5B5}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .order-container{width: 100%;min-height:120vw;background: #FFFFFF;}
+    .order-header{width:100%;background:#FFF;margin-bottom:1.5vw}
+    .header-tabs{padding:4vw 3.2vw;box-sizing:border-box;width:100%;overflow-y:hidden;overflow-x:scroll;white-space:nowrap;background:#FFF}
+    .header-tabs .tabs-item{display:inline-block;height:8.4vw;border:1px solid #b8bfca;line-height:8.4vw;padding:0 3vw;border-radius:4.2vw;margin-right:2.6vw}
+    .header-tabs .tabs-item a{color:#627386}
+    .header-tabs .tabs-item a span{color:#FF5B00}
+    .header-tabs .tabs-item.active{background-color:#ffe6dc;border-color:#FF5B00;color:#FF5B00}
+    .header-tabs .tabs-item.active a{color:#FF5B00}
+    .header-search{padding:0 3.3vw 2.6vw 3.3vw}
+    .order-header .header-bt{width: 100%;height: auto;float: left;}
+    .order-header .header-bt .form-row {margin:1.5vw 0;color: #627386;float: left;width: 100%;box-sizing: border-box;padding: 0 3vw;}
+    .order-header .header-bt .state {width: 100% !important;}
+    .order-header .header-bt .form-row.time{width: 100%;box-sizing: border-box;padding: 0 3vw;}
+    .order-header .header-bt .form-row .time {width: 47% !important;}
+    .order-header .header-bt .header-button{width: 100%;box-sizing: border-box;padding: 2vw 3vw;height: auto;float: left;text-align: right;}
+     .user-main.order{box-sizing:border-box;width:100%;background:#FFF;margin-bottom:1.5vw;padding:2vw 3.2vw 4vw 3.2vw;font-size:3.2vw;color:#627386;line-height:7vw}
+    .user-main.order .order-title{position:relative;height:16vw}
+    .user-main.order .order-title .title-name:nth-of-type(1){padding-left:11.6vw;color:#FF5B00;font-size:3.5vw;line-height:9vw}
+    .user-main.order .order-title .bag{position:absolute;left:0;top:2.6vw;width:9.6vw;height:4.2vw;line-height:4.2vw;text-align:center;color:#FFF;background-image:linear-gradient(90deg,#ffb427 0%,#f58e4d 100%);border-radius:2px}
+    .user-main.order .order-title .state{position:absolute;right:0;bottom:0;color:#FF5B00}
+    .user-main.order .order-title .title-time span,.user-main.order .order-content span{color:#22272e}
+    .user-main.order .order-content span.red{color: #f94b4b;}
+    .user-main.order .order-item p{display:inline-block;width:49%}
+    .user-main.order .order-botton{text-align:right;margin-top:2vw}
+    .user-main.order .order-botton .btn{display:inline-block;padding:0 2vw;height:9.5vw;line-height:9.5vw;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #FF5B00;color:#FF5B00;font-size:3.4vw;margin-left:2.6vw;vertical-align: text-top}
+    .user-main.order .order-botton .primary{background:#FF5B00;color:#FFF;position: relative;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm{line-height: 4.5vw;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary.confirm p{line-height: 5vw;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary .tips{width: 12.6vw;height: 4.8vw;line-height: 4.8vw;text-align: center;border-radius: 2.4vw;background-color: #ffe6dc;font-size: 2.8vw;color: #FF5B00;position: absolute;right: -2vw;top: -6.5vw;z-index: 99;}
+    .order-container .section .user-main .order-content .order-botton .btn.primary .tips:before{content: '';width: 6px;height: 6px;background-color: #ffe6dc;position: absolute;bottom: -3px;left: 12px;z-index: -1;transform:rotate(45deg);}
+    footer{display: none;}
+
+
+
+}
+

src/main/resources/static/js/product/promotions.js

@@ -1,148 +1,148 @@
-var promotionsList = new Vue({
-    el: "#promotionsList",
-    data: {
-        userId: 0,
-        listLoading: true,
-        requestFlag: true,
-        noMore: false,
-        params: {
-            id: 0,
-            size: 0,
-            num: 0
-        },
-        promotions: {},
-        listData: [],
-        listRecord: 0,
-        pageInput: '1',
-        userIdentity: '',
-        userToken: ''
-    },
-    computed: {
-        pageTotal: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
-            return total > 0 ? total : 1;
-        },
-        showPageBtn: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
-            total = total > 0 ? total : 1;
-            var index = this.params.num, arr = [];
-            if (total <= 6) {
-                for (var i = 1; i <= total; i++) {
-                    arr.push(i);
-                }
-                return arr;
-            }
-            if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
-            if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
-            return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
-        }
-    },
-    methods: {
-        toPagination: function (pageNum) {
-            if (pageNum <= this.pageTotal) {
-                var params = {pageNum: pageNum};
-                window.location.href = updateUrlParam(params);
-            }
-        },
-        checkNum: function () {
-            if (this.pageInput > this.pageTotal) {
-                this.pageInput = this.pageTotal;
-            } else if (this.pageInput < 1) {
-                this.pageInput = 1;
-            }
-        },
-        getPromotions: function(){
-            var _self = this;
-            ProductApi.GetPromotionsInfo({promotionsId:this.params.id},function (res) {
-                if (res.code === 0 && res.data) {
-                    _self.promotions = res.data;
-                    _self.getProductsByPromotions();
-                }else{
-                    CAIMEI.Alert("该促销活动已过期或不存在!", '确定', true, function(){
-                        window.location.href="/";
-                    });
-                }
-            });
-        },
-        getProductsByPromotions: function () {
-            var _self = this;
-            ProductApi.GetPromotionsProduct({
-                promotionsId: this.params.id,
-                pageSize: this.params.size,
-                pageNum: this.params.num,
-                identity:this.userIdentity
-            },function (res) {
-                if (res.code === 0 && res.data) {
-                    _self.listRecord = res.data.total;
-                    var resultData = res.data.list;
-                    var productIdArr = [];
-                    resultData.map(function (item) {
-                        productIdArr.push(item.productId)
-                    });
-                    setProductPrice(resultData, productIdArr.join(","), _self.userId, function () {
-                        _self.$forceUpdate();
-                    });
-                    if(isPC){
-                        _self.listData = resultData;
-                    }else{
-                        _self.listData = _self.listData.concat(resultData);
-                    }
-                    console.log(_self.listData);
-                    _self.listLoading = false;
-                    _self.requestFlag = true;
-                }else{
-                    CAIMEI.Alert(res.msg, '确定');
-                }
-            });
-        }
-    },
-    created: function () {
-        if(isPC){
-            this.params.size = getUrlParam("pageSize") ? getUrlParam("pageSize") * 1 : 20;
-            this.params.num = getUrlParam("pageNum") ? getUrlParam("pageNum") * 1 : 1;
-        }else{
-            this.params.size = 10;
-            this.params.num = 1;
-        }
-        this.params.id = getUrlParam("id") ? getUrlParam("id") : 0;
-        // 搜索框赋值
-        $('#topSearch').find('[data-select]').attr("data-select", 0).text("产品");
-        $('#topSearch').find('.jqSelect').find('select').val(0);
-        $('#topSearch').find('.keyword').val(getUrlParam("keyword"));
-        if(globalUserData){
-            this.userId = globalUserData.userId;
-            this.userIdentity = globalUserData.identity;
-            this.userToken = globalUserData.token;
-        }
-        // 获取页面数据
-        this.getPromotions();
-    },
-    mounted: function () {
-        var _self = this;
-        if(!isPC){
-            $('footer').addClass("noneImportant");
-            //移动端上垃加载更多
-            $(window).on('scroll', function(){
-                var scrollTop = $(this).scrollTop();
-                var scrollHeight = $(document).height();
-                var windowHeight = window.innerHeight;
-                if (scrollTop + windowHeight >= scrollHeight) {
-                    //此处是滚动条到底部时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作
-                    var totalPage = Math.ceil(_self.listRecord / _self.params.size)?Math.ceil(_self.listRecord / _self.params.size):1;
-                    var next = _self.params.num+1;
-                    if(next <= totalPage){
-                        if (_self.requestFlag){
-                            _self.params.num = next;
-                            _self.getPromotions();
-                        }
-                        _self.requestFlag = false;
-                    }else{
-                        //到底了
-                        _self.noMore = true;
-                        $('footer').removeClass("noneImportant");
-                    }
-                }
-            });
-        }
-    }
-});
+var promotionsList = new Vue({
+    el: "#promotionsList",
+    data: {
+        userId: 0,
+        listLoading: true,
+        requestFlag: true,
+        noMore: false,
+        params: {
+            id: 0,
+            size: 0,
+            num: 0
+        },
+        promotions: {},
+        listData: [],
+        listRecord: 0,
+        pageInput: '1',
+        userIdentity: '',
+        userToken: ''
+    },
+    computed: {
+        pageTotal: function () {
+            var total = Math.ceil(this.listRecord / this.params.size);
+            return total > 0 ? total : 1;
+        },
+        showPageBtn: function () {
+            var total = Math.ceil(this.listRecord / this.params.size);
+            total = total > 0 ? total : 1;
+            var index = this.params.num, arr = [];
+            if (total <= 6) {
+                for (var i = 1; i <= total; i++) {
+                    arr.push(i);
+                }
+                return arr;
+            }
+            if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
+            if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
+            return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
+        }
+    },
+    methods: {
+        toPagination: function (pageNum) {
+            if (pageNum <= this.pageTotal) {
+                var params = {pageNum: pageNum};
+                window.location.href = updateUrlParam(params);
+            }
+        },
+        checkNum: function () {
+            if (this.pageInput > this.pageTotal) {
+                this.pageInput = this.pageTotal;
+            } else if (this.pageInput < 1) {
+                this.pageInput = 1;
+            }
+        },
+        getPromotions: function(){
+            var _self = this;
+            ProductApi.GetPromotionsInfo({promotionsId:this.params.id},function (res) {
+                if (res.code === 0 && res.data) {
+                    _self.promotions = res.data;
+                    _self.getProductsByPromotions();
+                }else{
+                    CAIMEI.Alert("该促销活动已过期或不存在!", '确定', true, function(){
+                        window.location.href="/";
+                    });
+                }
+            });
+        },
+        getProductsByPromotions: function () {
+            var _self = this;
+            ProductApi.GetPromotionsProduct({
+                promotionsId: this.params.id,
+                pageSize: this.params.size,
+                pageNum: this.params.num,
+                identity:this.userIdentity
+            },function (res) {
+                if (res.code === 0 && res.data) {
+                    _self.listRecord = res.data.total;
+                    var resultData = res.data.list;
+                    var productIdArr = [];
+                    resultData.map(function (item) {
+                        productIdArr.push(item.productId)
+                    });
+                    setProductPrice(resultData, productIdArr.join(","), _self.userId, function () {
+                        _self.$forceUpdate();
+                    });
+                    if(isPC){
+                        _self.listData = resultData;
+                    }else{
+                        _self.listData = _self.listData.concat(resultData);
+                    }
+                    console.log(_self.listData);
+                    _self.listLoading = false;
+                    _self.requestFlag = true;
+                }else{
+                    CAIMEI.Alert(res.msg, '确定');
+                }
+            });
+        }
+    },
+    created: function () {
+        if(isPC){
+            this.params.size = getUrlParam("pageSize") ? getUrlParam("pageSize") * 1 : 20;
+            this.params.num = getUrlParam("pageNum") ? getUrlParam("pageNum") * 1 : 1;
+        }else{
+            this.params.size = 10;
+            this.params.num = 1;
+        }
+        this.params.id = getUrlParam("id") ? getUrlParam("id") : 0;
+        // 搜索框赋值
+        $('#topSearch').find('[data-select]').attr("data-select", 0).text("商品");
+        $('#topSearch').find('.jqSelect').find('select').val(0);
+        $('#topSearch').find('.keyword').val(getUrlParam("keyword"));
+        if(globalUserData){
+            this.userId = globalUserData.userId;
+            this.userIdentity = globalUserData.identity;
+            this.userToken = globalUserData.token;
+        }
+        // 获取页面数据
+        this.getPromotions();
+    },
+    mounted: function () {
+        var _self = this;
+        if(!isPC){
+            $('footer').addClass("noneImportant");
+            //移动端上垃加载更多
+            $(window).on('scroll', function(){
+                var scrollTop = $(this).scrollTop();
+                var scrollHeight = $(document).height();
+                var windowHeight = window.innerHeight;
+                if (scrollTop + windowHeight >= scrollHeight) {
+                    //此处是滚动条到底部时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作
+                    var totalPage = Math.ceil(_self.listRecord / _self.params.size)?Math.ceil(_self.listRecord / _self.params.size):1;
+                    var next = _self.params.num+1;
+                    if(next <= totalPage){
+                        if (_self.requestFlag){
+                            _self.params.num = next;
+                            _self.getPromotions();
+                        }
+                        _self.requestFlag = false;
+                    }else{
+                        //到底了
+                        _self.noMore = true;
+                        $('footer').removeClass("noneImportant");
+                    }
+                }
+            });
+        }
+    }
+});

src/main/resources/templates/components/header.html

@@ -114,7 +114,6 @@
                 <!-- 热门搜索关键词 -->
                 <div class="hotKey">
                     <span th:each="word,wordStat: ${searchHotWord}">
-                        <i th:if="${wordStat.index}>0">/</i>
                         <em class="word" th:text="${word}"></em>
                     </span>
                 </div>
@@ -272,4 +271,4 @@
     </div>
     <input type="hidden" th:value="${coreServer}" id="coreServer">
     <input type="hidden" th:value="${agent}" id="userAgent">
-</header>
+</header>

src/main/resources/templates/product/instrument.html

@@ -12,7 +12,7 @@
 <!-- 引用头部 -->
 <template th:replace="components/header"></template>
 <div id="container">
-    <div id="instrueMent" >
+    <div id="instrueMent" v-cloak>
         <th:block th:if="${typeFloorJson.get('contentLabel')}!=null" th:object="${typeFloorJson}">
             <input type="hidden" th:value="${typeFloorJson.get('contentLabel')}" id="contentLabel">
         </th:block>