From 7b57abb1c2b36e4a77bb4fc2bab74f8069ef74b2 Mon Sep 17 00:00:00 2001
From: "Mr.jiang" <714156421@qq.com>
Date: Tue, 9 Jul 2024 14:05:28 +0800
Subject: [PATCH] =?UTF-8?q?=E5=95=86=E5=9F=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 App.vue                                      |    2 +
 package/pages/zysc/index/commoditydetail.vue |   21 +-
 package/pages/zysc/member/orderdetail.vue    |    4 +-
 pages.json                                   |   29 +-
 pages/my/index.vue                           |    1 +
 static/css/indexShop.css                     | 1088 +++++
 static/css/simpleproShop.css                 | 4112 ++++++++++++++++++
 7 files changed, 5238 insertions(+), 19 deletions(-)
 create mode 100644 static/css/indexShop.css
 create mode 100644 static/css/simpleproShop.css

diff --git a/App.vue b/App.vue
index a1bcdde..08f0e71 100644
--- a/App.vue
+++ b/App.vue
@@ -486,6 +486,8 @@
 	@import "uview-ui/index.scss";
 	@import 'components/colorui/main.css';
 	@import 'components/colorui/icon.css';
+	@import './static/css/common.css';
+	@import './static/css/simpleproShop.css';
 	// /deep/uni-page-body{
 	// 	background-color: #f7f7f7 !important;
 	// }
diff --git a/package/pages/zysc/index/commoditydetail.vue b/package/pages/zysc/index/commoditydetail.vue
index a78dcb6..fcecfd7 100644
--- a/package/pages/zysc/index/commoditydetail.vue
+++ b/package/pages/zysc/index/commoditydetail.vue
@@ -140,7 +140,7 @@
 				<view class="goods-info-title" style="color: #333;font-weight: bold;">宝贝详情</view>
 				<view class="imglist">
 					<!-- <uparse :content="ordersList.descrition" @navigate="navigate" class="is-response"></uparse> -->
-					<div v-html="ordersList.descrition"></div>
+					<div class="imglist-div" v-html="ordersList.descrition"></div>
 				</view>
 			</view>
 
@@ -182,7 +182,7 @@
 
 						<!-- #endif -->
 						<view class="em">
-							<view style="font-size: 14px" @tap="navBarButtontO('home')">
+							<view style="font-size: 14px" @tap="goBackUp">
 								<text class="iconfont icon-shouye"></text>
 								返回首页
 							</view>
@@ -989,8 +989,21 @@
 </script>
 
 <style>
-	@import '../../../../static/css/index.css';
-
+	/* @import '../../../../static/css/index.css'; */
+	@import url('../../../../static/css/indexShop.css');
+	.imglist{
+		width:100%;
+	}
+	.imglist-div{
+		width:100%;
+	}
+	
+	.imglist-div /deep/p{
+		width:100%;
+	}
+	.imglist-div /deep/p /deep/img{
+		width:100%;
+	}
 	page {
 		background: #f8f8f8;
 	}
diff --git a/package/pages/zysc/member/orderdetail.vue b/package/pages/zysc/member/orderdetail.vue
index 1c78b22..c398724 100644
--- a/package/pages/zysc/member/orderdetail.vue
+++ b/package/pages/zysc/member/orderdetail.vue
@@ -139,7 +139,7 @@
 		</view>
 
 		<!-- 淘口令分享 -->
-		<simpleModal ref="simpleModalTkl" @maskClose="TklmaskClose">
+		<!-- <simpleModal ref="simpleModalTkl" @maskClose="TklmaskClose">
 			<view class="buy-box-title">兑换码</view>
 			<view class="buy-box-center" style="width: 700upx;">
 				<view class="code-cent">
@@ -161,7 +161,7 @@
 						@tap="copyTklWenAns">{{ copyTklStatus ? '已复制到剪切板' : '一键复制' }}</view>
 				</view>
 			</view>
-		</simpleModal>
+		</simpleModal> -->
 
 		<view
 			style="text-align: center;position: fixed;bottom: 0upx;background-color: #FFFFFF;width: 100%;height: 100upx;justify-content: center;overflow: hidden;"
diff --git a/pages.json b/pages.json
index c8331ba..01e32f3 100644
--- a/pages.json
+++ b/pages.json
@@ -1190,7 +1190,7 @@
 					"app-plus": {
 						"bounce": "none",
 						"scrollIndicator": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			}, {
@@ -1213,7 +1213,7 @@
 					"app-plus": {
 						"bounce": "none",
 						"scrollIndicator": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1240,7 +1240,10 @@
 			{
 				"path": "pages/zysc/index/wlcgList",
 				"style": {
-					"navigationBarTitleText": "物料采购"
+					"navigationBarTitleText": "物料采购",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 	
@@ -1266,7 +1269,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1280,7 +1283,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1293,7 +1296,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1306,7 +1309,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1319,7 +1322,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1332,7 +1335,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1345,7 +1348,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1357,7 +1360,7 @@
 					"app-plus": {
 						"bounce": "none",
 						"scrollIndicator": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1370,7 +1373,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			},
@@ -1383,7 +1386,7 @@
 					"app-plus": {
 						"scrollIndicator": "none",
 						"bounce": "none",
-						"titleNView": true
+						"titleNView": false
 					}
 				}
 			}
diff --git a/pages/my/index.vue b/pages/my/index.vue
index ae34ee0..36c13b3 100644
--- a/pages/my/index.vue
+++ b/pages/my/index.vue
@@ -149,6 +149,7 @@
 					{urlImg:'../../static/my-gong-7.png',text:'设置中心',link:'/my/setting/index'},
 					{urlImg:'../../static/my-gong-8.png',text:'浏览历史',link:'/pages/my/historyMy'},
 					{urlImg:'../../static/my-gong-9.png',text:'我的团队',link:'/pages/my/myteam'},
+					{urlImg:'../../static/my-gong-9.png',text:'项目推荐',link:'/pages/my/fuwuGengduo'},
 				],
 				token:'',
 				vipData:[],
diff --git a/static/css/indexShop.css b/static/css/indexShop.css
new file mode 100644
index 0000000..745cfbd
--- /dev/null
+++ b/static/css/indexShop.css
@@ -0,0 +1,1088 @@
+*{
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+}
+	
+.index-content {
+	width: 100%;
+	background: #f8f8f8;
+}
+
+.index-content .index-header {
+	position: fixed;
+	z-index: 160;
+	border-bottom: solid 1px #ddd;
+	/*background: linear-gradient(to left, #e10a07 0, #FBAA58 100%);*/
+	border-bottom-color: transparent;
+	-webkit-transition: all .4s ease 0s;
+	transform-origin: center;
+	width: 100%;
+}
+
+.index-content .index-header .icon_header {
+	width: 100%;
+	line-height: 45px;
+	position: relative;
+	background: -webkit-linear-gradient(left, #e10a07 0, #f15b6c 100%);
+	background: -o-linear-gradient(left, #e10a07 0, #f15b6c 100%);
+	background: -ms-linear-gradient(left, #e10a07 0, #f15b6c 100%);
+	background: -webkit-gradient(linear, right top, left top, color-stop(0, #e10a07), to(#f15b6c));
+	background: -o-linear-gradient(right, #e10a07 0, #f15b6c 100%);
+	background: linear-gradient(to left, #e10a07 0, #f15b6c 100%);
+}
+
+.index-content .index-header .icon_header .index-search {
+	text-align: center;
+	font-size: 16px;
+	color: #fff;
+	position: relative;
+	z-index: 2;
+	zoom: 1;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	padding-top: 8px;
+	margin: 0 32upx 0 32upx;
+	padding-bottom: 6px;
+}
+
+.index-content .index-header .icon_header .index-search .icon_search {
+	background: #F6F6F6;
+	border-radius: 40upx;
+	-moz-border-radius: 40upx;
+	-webkit-border-radius: 40upx;
+	-o-border-radius: 40upx;
+	-ms-border-radius: 40upx;
+	height: 66upx;
+	line-height: 66upx;
+	font-size: 26upx;
+	color: #dcdcdc;
+	text-align: left;
+	text-indent: 32upx;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	transition: all .4s ease 0s;
+	-o-transition: all .4s ease 0s;
+	-moz-transition: all .4s ease 0s;
+	-webkit-transition: all .4s ease 0s;
+	transform-origin: center;
+
+}
+
+.icon_header .icon_search>.iconfont {
+	margin-right: 20upx;
+	top: 1px;
+	color: #ccc;
+}
+
+.icon_header .icon_suji {
+	position: absolute;
+	top: 0;
+	width: 90upx;
+	text-align: center;
+	right: 0;
+	color: #FFFFFF;
+}
+
+.icon-gender {
+	position: absolute;
+	top: 0;
+	width: 90upx;
+	text-align: center;
+	left: 16px;
+	color: #FFFFFF;
+}
+
+.icon_header .icon_suji .icon-zuji {
+	font-size: 40upx;
+}
+
+.index-content .index-banner {
+	padding-top: 40px;
+	width: 100%;
+}
+
+.index-content .index-banner swiper-item {
+	height: 400px;
+}
+
+.index-content .index-banner .swiper .swiper-container image {
+	width: 100%;
+}
+
+.index-content .index-navlist {
+	/*border-bottom: 10upx solid #f2f2f2*/
+}
+
+.index-content .index-navlist image {
+	width: 64px;
+	height: 64px;
+}
+
+.index-content .home_ant_juhuasuan {
+	padding: 0px 5px;
+	/*border-bottom: 10upx solid #f2f2f2*/
+	margin-bottom: 6px;
+}
+
+.index-content .home_ant_juhuasuan .fl-jutext {
+	font-size: 0;
+	height: 45px;
+	line-height: 500px;
+	overflow: hidden;
+	-webkit-background-size: auto 18px;
+	background-size: auto 18px;
+	float: left;
+	width: 25%;
+}
+
+.index-content .home_ant_juhuasuan .fr-jutext {
+	line-height: 45px;
+	background: url('~@/static/images/my/right_icon.png') center right no-repeat;
+	color: #999;
+	-webkit-background-size: auto 11px;
+	background-size: auto 11px;
+	width: 65%;
+	float: right;
+	text-align: right;
+	padding-right: 10px;
+	font-size: 14px;
+}
+
+.index-content .juhuasuan-list {
+	clear: both;
+	padding-bottom: 10px;
+}
+
+.index-content .juhuasuan-list .juhuasuan-list-goods {
+	width: 25%;
+	float: left;
+}
+
+.index-content .juhuasuan-list .juhuasuan-list-goods .image {
+	display: block;
+	margin: 0 2px;
+	border-radius: 5px;
+	overflow: hidden;
+	position: relative;
+	z-index: 0;
+}
+
+.index-content .juhuasuan-list .juhuasuan-list-goods .image image {
+	width: 91px;
+	/* 	height: 91px; */
+}
+
+.index-content .juhuasuan-list .juhuasuan-list-goods .name {
+	position: absolute;
+	left: 0;
+	bottom: 0;
+	height: 20px;
+	line-height: 22px;
+	font-size: 12px;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+	-o-border-radius: 3px;
+	-ms-border-radius: 3px;
+	background: -webkit-linear-gradient(left, #f15b6c 0, #e10a07 100%);
+	background: -o-linear-gradient(left, #f15b6c 0, #e10a07 100%);
+	background: -ms-linear-gradient(left, #f15b6c 0, #e10a07 100%);
+	background: -webkit-gradient(linear, right top, left top, color-stop(0, #f15b6c), to(#e10a07));
+	background: -o-linear-gradient(right, #f15b6c 0, #e10a07 100%);
+	background: linear-gradient(to left, #f15b6c 0, #e10a07 100%);
+	color: #FFFFFF;
+	width: 100%;
+	overflow: hidden;
+}
+
+
+.index-content .juhuasuan-list .juhuasuan-list-goods .name:before {
+	background: #FFE7C9;
+	height: 100px;
+	position: absolute;
+	-ms-transform: rotate(15deg);
+	right: 0;
+	color: #e10a07;
+	padding-left: 5upx;
+	padding-right: 5upx;
+}
+
+.index-content .juhuasuan-list .juhuasuan-list-goods .name .pinname {
+	font-size: 12px;
+	line-height: 20px;
+}
+
+.index-content .index-coupon .coupon-tab {
+	margin: 0 10upx;
+}
+
+.index-content .index-coupon .coupon-tab .fl-jutext {
+	width: 33.33333333%;
+	font-size: 30upx;
+	color: #333;
+}
+
+.index-content .index-coupon .coupon-tab .fl-jutext:before {
+	content: "";
+	float: left;
+	margin-top: 3px;
+	width: 3px;
+	height: 18px;
+	border-radius: 3px;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+	-o-border-radius: 3px;
+	-ms-border-radius: 3px;
+	background: -o-linear-gradient(top, #ff5d06 0, #e10a07 100%);
+	background: -o-linear-gradient(bottom, #ff5d06 0, #e10a07 100%);
+	background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ff5d06), to(#e10a07));
+	background: linear-gradient(to top, #ff5d06 0, #e10a07 100%);
+	margin-right: 5px;
+}
+
+.index-content .index-coupon .coupon-tab .fr-jutext {
+	float: right;
+	color: #aaa;
+	font-size: 14px;
+	background: url('~@/static/images/my/right_icon.png') center right no-repeat;
+	-webkit-background-size: auto 11px;
+	background-size: auto 11px;
+	width: 65%;
+	text-align: right;
+	padding-right: 10px;
+}
+
+
+.index-content .index-coupon .goods-list {}
+
+.index-content .index-coupon .goods-list .coupon-page {
+	/* padding: 10upx; */
+}
+
+.index-content .index-coupon .goods-list .coupon-page .image {
+	float: left;
+	width: 40%;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .image image {
+	width: 250rpx;
+	height: 250rpx;
+	border-radius: 10px;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content {
+	float: right;
+	width: 60%;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .title {
+	color: #333;
+	font-weight: 400;
+	font-size: 16px;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+	height: 42px;
+	margin-bottom: 20px;
+	overflow: hidden;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .num {
+	color: #aaa;
+	line-height: 20px;
+	font-size: 13px;
+	padding-top: 13px;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .num .tmprice {
+	padding-right: 10px;
+	margin-right: 10px;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	display: inline-block;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .num .volume {
+	/* float: right; */
+
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money {
+	height: 24px;
+	font-size: 18px;
+	margin-top: 5px;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .quan {
+	padding: 0;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	top: 0;
+	overflow: hidden;
+	float: right;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .quan {
+	/*background: -moz-linear-gradient(left, #e10a07 0, #FF927C 100%);*/
+	/*background: -webkit-gradient(linear, left top, left right, color-stop(0, #e10a07), color-stop(100%, #FF927C));*/
+	/*background: -webkit-linear-gradient(left, #e10a07 0, #FF927C 100%);*/
+	/*background: -o-linear-gradient(left, #e10a07 0, #FF927C 100%);*/
+	/*background: -ms-linear-gradient(left, #e10a07 0, #FF927C 100%);*/
+	/*background: linear-gradient(to left, #e10a07 0, #FF927C 100%);*/
+	background: -moz-linear-gradient(left, #f15b6c 0, #FF927C 100%);
+	background: -webkit-gradient(linear, left top, left right, color-stop(0, #f15b6c), color-stop(100%, #FF927C));
+	background: -webkit-linear-gradient(left, #f15b6c 0, #FF927C 100%);
+	background: -o-linear-gradient(left, #f15b6c 0, #FF927C 100%);
+	background: -ms-linear-gradient(left, #f15b6c 0, #FF927C 100%);
+	background: linear-gradient(to left, #f15b6c 0, #FF927C 100%);
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	font-style: normal;
+	display: block;
+	border-radius: 3px;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+	-o-border-radius: 3px;
+	-ms-border-radius: 3px;
+	font-size: .785rem;
+	min-width: 3rem;
+	text-align: center;
+	padding: 1px 12upx;
+	color: #fff;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .quan:before {
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	top: 50%;
+	margin-top: -3px;
+	background: #fff;
+	display: block;
+	width: 5px;
+	height: 5px;
+	content: "";
+	border-radius: 10px;
+	border: 1px solid #fff;
+	left: auto;
+	right: -4px;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .quan:after {
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	top: 50%;
+	margin-top: -3px;
+	background: #fff;
+	display: block;
+	width: 5px;
+	height: 5px;
+	content: "";
+	border-radius: 10px;
+	border: 1px solid #fff;
+	left: -4px;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .coupon-price {
+	background: white;
+	color: #FF563A;
+	font-size: 24upx;
+}
+
+.index-content .index-coupon .goods-list .coupon-page .content .money .coupon-price text {
+	font-size: 32upx;
+	padding-left: 5px;
+}
+
+/*
+** 商品详情
+*/
+
+.index-goods {
+	width: 100%;
+}
+
+.index-goods .goods_info {
+	background: white;
+	width: 100%;
+}
+
+.index-goods .goods_info .title {
+	padding: 20upx 10upx;
+	font-size: 32upx;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	font-weight: 400;
+	color: #333333;
+}
+
+.index-goods .goods_info .title text {
+	border: 1px solid #e10a07;
+	color: #e10a07;
+	border-radius: 2px;
+	-moz-border-radius: 2px;
+	-webkit-border-radius: 2px;
+	-o-border-radius: 2px;
+	-ms-border-radius: 2px;
+	padding: 0 5px;
+	margin-right: 5px;
+	font-size: 28upx;
+	top: -1px;
+}
+
+.index-goods .goods_info .coupon-price {
+	margin: 10upx 10upx 0 10upx;
+	margin-top: 0upx;
+}
+
+.index-goods .goods_info .coupon-price .price {
+	float: left;
+	font-size: 30upx;
+	color: #e10a07;
+	width: 50%;
+}
+
+.index-goods .goods_info .coupon-price .price text {
+	font-size: 46upx;
+	font-weight: 500;
+}
+
+.index-goods .goods_info .coupon-price .volume {
+	float: right;
+	font-size: 30upx;
+	color: #333333;
+	width: 50%;
+	text-align: right;
+}
+
+.index-goods .goods_info .coupon-price .yprice {
+	float: left;
+	color: #888;
+	width: 40%;
+}
+
+.index-goods .goods_info .coupon-price .tag-list {
+	float: right;
+	width: 60%;
+	text-align: right;
+}
+
+.index-goods .goods_info .coupon-price .tag-list .tag {
+	text-align: right;
+	float: right;
+	margin-left: 20upx;
+	color: #888888;
+	font-size: 28upx;
+}
+
+.index-goods .goods_info .coupon-price .tag-list .tag .iconfont {
+	color: #e10a07;
+	margin-right: 4upx;
+
+}
+
+.index-goods .goods_quan {
+	background: white;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+}
+
+.index-goods .goods_quan:before {
+	content: "";
+	width: 2px;
+	height: 55%;
+	/* background: url('~@/static/img/goods/hr.png'); */
+	-webkit-background-size: auto 100%;
+	-moz-background-size: auto 100%;
+	background-size: auto 100%;
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	left: 64%;
+	top: 20%;
+	display: block;
+}
+
+.index-goods .goods_quan .row {
+	display: block;
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	left: 0;
+	top: 0;
+	width: 100%;
+	height: 100%;
+	text-align: center;
+}
+
+.index-goods .goods_quan .row .money {
+	font-size: 36upx;
+	color: #FFFFFF;
+	padding-top: 6%;
+	line-height: 48upx;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	left: .3rem;
+}
+
+
+.index-goods .goods_quan .row .money .date-coupon {
+	font-size: 12px;
+	color: #fff;
+}
+
+.index-goods .goods_quan .row .name {
+	line-height: 100%;
+	color: #fff;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	top: 50%;
+	margin-top: -.6rem;
+	text-align: left;
+	font-weight: 600;
+}
+
+.index-goods .goods_quan .row .name text {
+	margin-left: 15%;
+}
+
+.index-goods .goods_desc {
+	font-size: 24upx;
+	line-height: 48upx;
+	padding: 10upx 20upx;
+	color: #888888;
+}
+
+.hr10 {
+	background: #F5F5F5;
+	height: 10upx;
+}
+
+.scroll_top {
+	background: rgba(51, 51, 51, .8);
+	width: 35px;
+	height: 35px;
+	border-radius: 35px;
+	-moz-border-radius: 35px;
+	-webkit-border-radius: 35px;
+	-o-border-radius: 35px;
+	-ms-border-radius: 35px;
+	text-align: center;
+	line-height: 35px;
+	color: #fff;
+	position: fixed;
+	z-index: 1;
+	zoom: 1;
+	right: 20px;
+	bottom: 25px;
+	opacity: 0;
+	-webkit-transform: translateY(100px) translateX(0);
+	transform: translateY(100px) translateX(0);
+	transition: all .4s ease 0s;
+	-o-transition: all .4s ease 0s;
+	-moz-transition: all .4s ease 0s;
+	-webkit-transition: all .4s ease 0s;
+	transform-origin: center;
+}
+
+.scroll_top.active {
+	opacity: 1;
+	-webkit-transform: translateY(-25px) translateX(0);
+	transform: translateY(-25px) translateX(0);
+}
+
+.index-goods .goods_shop {}
+
+.index-goods .goods_shop .info {
+	padding-top: 20upx;
+	min-height: 120upx;
+}
+
+.index-goods .goods_shop .info image {
+	float: left;
+	width: 120upx;
+	height: 120upx;
+	background: rgb(245, 245, 245);
+	margin-left: 20upx;
+}
+
+.index-goods .goods_shop .info .shop-text {
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	min-height: 120upx;
+	padding-left: 160upx;
+	line-height: 60upx;
+}
+
+.index-goods .goods_shop .info .shop-text .shop-title {
+	font-size: 1.1rem;
+	font-weight: 400;
+	margin-right: 235upx;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.index-goods .goods_shop .info .shop-text .icon-taobao {
+	color: #ff5000;
+}
+
+.index-goods .goods_shop .info .shop-text .icon-tianmaotmall {
+	color: #e10a07;
+}
+
+.index-goods .goods_shop .info .shop-text .shop-new {
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	right: 20upx;
+	top: 50%;
+	margin-top: -15px;
+	font-size: 30upx;
+	color: #888;
+}
+
+.index-goods .goods_shop .info .shop-text .shop-new .icon-youjiantou {
+	font-size: 24upx;
+}
+
+.index-goods .goods_shop .goods-tab {
+	margin-top: 30upx;
+	border-top: solid 1px #F5F5F5;
+	font-size: 30upx;
+	color: #555;
+	padding: 20upx;
+}
+
+.index-goods .goods_shop .goods-tab .lv_p {
+	color: #FF7800;
+	margin-left: 8upx;
+}
+
+.index-goods .goods_shop .goods-tab .lv_d {
+	color: #2CA800;
+	margin-left: 8upx;
+}
+
+.index-goods .goods_shop .goods-tab .lv_g {
+	color: #E31436;
+	margin-left: 8upx;
+}
+
+.index-goods .goods_shop .goods-tab .is-col-8:nth-child(2n):after,
+.index-goods .goods_shop .goods-tab .is-col-8:nth-child(2n):before {
+	position: absolute;
+	z-index: 1;
+	zoom: 1;
+	left: 0;
+	top: 50%;
+	width: 1px;
+	height: 1rem;
+	margin-top: -.5rem;
+	background: #eee;
+	display: block;
+	content: "";
+}
+
+.index-goods .goods_shop .goods-tab .is-col-8:nth-child(2n):after {
+	left: auto;
+	right: 0;
+}
+
+.index-goods .goods_reco {
+	background: #FFFFFF;
+	margin-bottom: 120upx;
+}
+
+.index-goods .goods_reco .goods-info-title {
+	font-weight: 400;
+	text-align: center;
+	font-size: 28upx;
+	height: 80upx;
+	line-height: 80upx;
+	color: #333333;
+}
+
+.index-goods .goods_reco .imglist {
+	max-width: 100%;
+}
+
+.index-goods .goods_shop_cart {
+	position: fixed;
+	zoom: 1;
+	bottom: 0;
+	z-index: 500;
+	left: 0;
+	width: 100%;
+}
+
+.index-goods .goods_shop_cart .cent {
+	position: relative;
+	zoom: 1;
+	z-index: 5;
+	background: #fff;
+	box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, .1);
+}
+
+.index-goods .goods_shop_cart .but .img {
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	padding-top: 8px;
+	height: 28px;
+}
+
+.index-goods .goods_shop_cart .but .img image {
+	height: 23px;
+	width: 23px;
+}
+
+.index-goods .goods_shop_cart .but .img .iconfont {
+	font-size: 20px;
+	color: #777;
+	top: 1px;
+}
+
+.index-goods .goods_shop_cart .is-col-16 {
+	color: #fff;
+	border: 0;
+	padding: 0;
+	height: 43px;
+	line-height: 43px;
+	position: relative;
+	z-index: 1;
+	zoom: 1;
+	top: 10px;
+	background: linear-gradient(to left, #e10a07 0, #FE9F69 100%);
+	width: 65%;
+}
+
+.index-goods .goods_shop_cart .is-col-16 .btn view {
+	height: 41px;
+	color: #fff;
+	text-align: center;
+}
+
+.index-goods .goods_shop_cart .is-col-16 .btn .tkl {
+	background: #fff;
+	color: #FE9F69;
+	zoom: 1;
+	top: 1px;
+	left: 1px;
+	z-index: 5;
+	position: relative;
+	/* 	border-radius: 3px 0 0 3px; */
+}
+
+.index-goods .goods_shop_cart .is-col-16 .btn .coupon-buy {
+	background: linear-gradient(to left, #e10a07 0, #FBAA58 100%);
+	height: 42px;
+}
+
+.index-goods .goods_shop_cart_bg {
+	width: 100%;
+	height: 100%;
+	position: fixed;
+	z-index: 50;
+	background: #000;
+	left: 0;
+	top: 0;
+	/*  display: none; */
+	opacity: .5;
+}
+
+.index-goods .goods_share {
+	position: fixed;
+	left: 2.5%;
+	width: 95%;
+	background: #fff;
+	border-radius: 4px;
+	opacity: 0;
+	bottom: -200px;
+	transition: all .3s cubic-bezier(.4, .68, .15, 1.21) .2s;
+	-o-transition: all .3s cubic-bezier(.4, .68, .15, 1.21) .2s;
+	-moz-transition: all .3s cubic-bezier(.4, .68, .15, 1.21) .2s;
+	-webkit-transition: all .3s cubic-bezier(.4, .68, .15, 1.21) .2s;
+	z-index: 0;
+}
+
+.index-goods .goods_share.active {
+	opacity: 1;
+	bottom: 60px;
+	z-index: 100;
+}
+
+.index-goods .goods_share .cent view {
+	height: 56px;
+	line-height: 36px;
+	text-align: center;
+	color: #666;
+	display: block;
+	font-size: 16px;
+	padding: 10px 0;
+
+}
+
+.index-goods .goods_share .cent view:nth-child(2) {
+	border-bottom: solid 1px #eee;
+}
+
+.index-goods .goods_share .cent view .iconfont {
+	margin-right: 10upx;
+}
+
+.index-goods .goods_share .cent .em {
+	position: absolute;
+	left: 44%;
+	bottom: -10px;
+	width: 0;
+	height: 0;
+	border-left: 12px solid transparent;
+	border-right: 12px solid transparent;
+	border-top: 12px solid #fff;
+}
+
+.navBarButton {
+	z-index: 501 !important;
+}
+
+.index-goods .h_newlit {
+	z-index: -50;
+	top: 45px;
+	right: 0;
+	border: 1px solid #ddd;
+	width: 35%;
+	-o-transition: all .4s ease 0s;
+	-moz-transition: all .4s ease 0s;
+	-webkit-transition: all .4s ease 0s;
+	opacity: 0;
+	-webkit-transform: translateY(0) translateX(100%);
+	transform: translateY(0) translateX(100%);
+	padding-bottom: 5px;
+	-moz-box-shadow: -1px 1px 3px rgba(125, 125, 125, .2);
+	-webkit-box-shadow: -1px 1px 3px rgba(125, 125, 125, .2);
+	box-shadow: -1px 1px 3px rgba(125, 125, 125, .2);
+
+}
+
+.index-goods .h_newlit.active {
+
+	-webkit-transform: translateY(0) translateX(0);
+	transform: translateY(0) translateX(0);
+	opacity: 1;
+	position: fixed;
+	z-index: 600;
+	/* #ifndef H5 */
+	margin-top: 32upx;
+	/* #endif */
+	zoom: 1;
+}
+
+.index-goods .h_newlit {
+	width: 120px;
+	text-align: center;
+	background: rgba(51, 51, 51, .9);
+	border: 0;
+	border-radius: 5px;
+	-moz-border-radius: 5px;
+	-webkit-border-radius: 5px;
+	-o-border-radius: 5px;
+	-ms-border-radius: 5px;
+	overflow: inherit;
+	right: .5rem;
+	/*margin-top: 50upx;*/
+}
+
+.index-goods .h_newlit .em {
+	position: relative;
+	z-index: 5;
+	zoom: 1;
+}
+
+.index-goods .h_newlit .em:before {
+	content: "";
+	position: absolute;
+	z-index: 601;
+	zoom: 1;
+	top: -7px;
+	right: 10px;
+	width: 17px;
+	height: 12px;
+}
+
+.index-goods .h_newlit .em:before {
+	width: 0;
+	height: 0;
+	border-left: 7px transparent solid;
+	border-right: 7px transparent solid;
+	border-bottom: 7px rgba(51, 51, 51, .9) solid;
+	border-top: none;
+	position: absolute;
+	z-index: 601;
+	zoom: 1;
+	right: 8px;
+	top: -7px;
+}
+
+.index-goods .h_newlit .em view {
+	border-bottom: solid 1px rgba(102, 102, 102, .9);
+	color: #fff;
+	font-size: 1rem;
+	line-height: 44px;
+}
+
+.index-goods .h_newlit .em view:last-child {
+	border-bottom: 0;
+}
+
+.index-goods .h_newlit .em view .iconfont {
+	margin-right: 10upx;
+}
+
+.buy-box-title {
+	height: 40px;
+	line-height: 40px;
+	text-align: center;
+	background: linear-gradient(to right, #e10a07, #e10a07);
+	-webkit-background-clip: text;
+	color: transparent;
+	font-size: 18px;
+	padding: 5px 0;
+}
+
+.buy-box-title .iconfont {
+	right: 7px;
+	font-weight: 600;
+	color: #e10a07;
+	position: absolute;
+	font-size: 38upx;
+	top: -1px;
+}
+
+.buy-box-center .code-cent {
+	margin: 0 10px;
+}
+
+.buy-box-center .cente-text {
+	margin: 0 10px;
+	padding: 10px 0;
+	background: #F1F1F1;
+	color: #333;
+	font-size: 14px;
+	line-height: 24px;
+	height: 260px;
+	border-radius: 4px;
+	overflow: hidden;
+	text-align: left;
+}
+
+.buy-box-center .cente-text .textarea {
+	padding: 10px;
+}
+
+.buy-box-center .code-cent .closeTips {
+	text-align: left;
+	line-height: 22px;
+	color: #AAA;
+	font-size: 12px;
+	padding-top: 10px;
+	margin-left: 10px;
+}
+
+.buy-box-center .buy-btn-copy {
+	background: linear-gradient(to left, #e10a07 0, #e10a07 100%);
+	display: block;
+	border-radius: 50px;
+	line-height: 40px;
+	height: 40px;
+	text-align: center;
+	color: #fff;
+	font-size: 16px;
+	width: 90%;
+	margin: 0 auto;
+	margin-top: 10px;
+	margin-bottom: 10px;
+}
+
+
+
+.buy-box-center .buy-btn-copy.active {
+	background: #1FB931;
+}
+
+.buy-box-center .code-pic-info {
+	height: 119px;
+}
+
+.navBarButtonBox {
+	width: 0px;
+	height: 0px;
+	overflow: hidden;
+}
+
+.getTbk {
+	background: -moz-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -webkit-gradient(linear, left top, left right, color-stop(0, #e10a07), color-stop(100%, #FBAA58));
+	background: -webkit-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -o-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -ms-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: linear-gradient(to left, #e10a07 0, #FBAA58 100%);
+}
+
+/*
+	9.9包邮
+*/
+.jiu-page .main-title {
+	background: -moz-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -webkit-gradient(linear, left top, left right, color-stop(0, #e10a07), color-stop(100%, #FBAA58));
+	background: -webkit-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -o-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: -ms-linear-gradient(left, #e10a07 0, #FBAA58 100%);
+	background: linear-gradient(to left, #e10a07 0, #FBAA58 100%);
+	border-bottom-color: transparent;
+	padding: 10px;
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	z-index: 120;
+	display: block;
+	box-sizing: border-box;
+	/* #ifdef APP-PLUS */
+	padding-top: var(--status-bar-height);
+	/* #endif */
+}
+
+.jiu-page .main-title .menu-cat {
+	font-family: Simhei;
+	font-size: 17px;
+	height: 28px;
+	line-height: 28px;
+	color: #fff;
+	text-align: center;
+}
+
+.jiu-page .main-title .menu-cat .span {
+	position: relative;
+	cursor: pointer;
+	padding: 6px 22px 6px 15px;
+	text-align: center;
+}
+
+.jiu-page .main-title .menu-cat .span image {
+	width: 65px;
+	height: 22px;
+	margin-left: 42%;
+}
diff --git a/static/css/simpleproShop.css b/static/css/simpleproShop.css
new file mode 100644
index 0000000..cba94be
--- /dev/null
+++ b/static/css/simpleproShop.css
@@ -0,0 +1,4112 @@
+@charset "UTF-8";
+@import "./icon.css";
+
+/* Simple Pro 简
+ * Author 芥末
+ * 2018-09-27
+ */
+/* 全局变量  */
+.s-page-wrapper {
+    max-width: 750 rpx;
+}
+
+/* 含有阴影 */
+.has-shadow {
+    box-shadow: 3px 5px 7px 3px rgba(29, 29, 31, 0.09);
+}
+
+/* 含有边框 */
+.has-border {
+    border: 1px solid #dcdee2;
+}
+
+.has-radius {
+    border-radius: 4px;
+}
+
+.has-break {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+/* 混合颜色 */
+/* 网格 */
+.is-flex {
+    display: flex;
+}
+
+.is-block {
+    display: block;
+}
+
+.is-column {
+    flex-direction: column;
+}
+
+.s-row {
+    position: relative;
+    margin-left: 0;
+    margin-right: 0;
+    height: auto;
+    zoom: 1;
+    display: block;
+}
+
+.s-row::after,
+.s-row::before {
+    content: "";
+    display: table;
+}
+
+.s-row::after {
+    clear: both;
+    visibility: hidden;
+    font-size: 0;
+    height: 0;
+}
+
+.s-row-flex {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap;
+}
+
+.s-row-flex,
+.s-row-flex::after,
+.s-row-flex::before {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+}
+
+.s-col {
+    flex-direction: column;
+}
+
+.is-justify-end {
+    justify-content: flex-end;
+}
+
+.is-justify-center {
+    justify-content: center;
+}
+
+.is-justify-start {
+    justify-content: flex-start;
+}
+
+.is-justify-between {
+    justify-content: space-between;
+}
+
+.is-justify-around {
+    justify-content: space-around;
+}
+
+.is-align-start {
+    align-items: flex-start;
+}
+
+.is-align-center {
+    align-items: center;
+}
+
+.is-align-end {
+    align-items: flex-end;
+}
+
+.is-align-stretch {
+    align-items: stretch;
+}
+
+.s-col {
+    position: relative;
+    display: block;
+    box-sizing: border-box;
+}
+
+.is-col-1,
+.is-col-2,
+.is-col-3,
+.is-col-4,
+.is-col-5,
+.is-col-6,
+.is-col-7,
+.is-col-8,
+.is-col-9,
+.is-col-10,
+.is-col-11,
+.is-col-12,
+.is-col-13,
+.is-col-14,
+.is-col-15,
+.is-col-16,
+.is-col-17,
+.is-col-18,
+.is-col-19,
+.is-col-20,
+.is-col-21,
+.is-col-22,
+.is-col-23,
+.is-col-24,
+.is-col-1-5,
+.is-col-1-8 {
+    float: left;
+    -webkit-box-flex: 0;
+    -ms-flex: 0 0 auto;
+    flex: 0 0 auto;
+}
+
+.is-col-1-5 {
+    display: block;
+    width: 20%;
+}
+
+.is-push-1-5 {
+    left: 20%;
+}
+
+.is-pull-1-5 {
+    right: 20%;
+}
+
+.is-offset-1-5 {
+    margin-left: 20%;
+}
+
+.is-col-1-8 {
+    display: block;
+    width: 12.5%;
+}
+
+.is-push-1-8 {
+    left: 12.5%;
+}
+
+.is-pull-1-8 {
+    right: 12.5%;
+}
+
+.is-offset-1-8 {
+    margin-left: 12.5%;
+}
+
+.is-col-24 {
+    display: block;
+    width: 100%;
+}
+
+.is-push-24 {
+    left: 100%;
+}
+
+.is-pull-24 {
+    right: 100%;
+}
+
+.is-offset-24 {
+    margin-left: 100%;
+}
+
+.is-order-24 {
+    -webkit-box-ordinal-group: 25;
+    -ms-flex-order: 24;
+    order: 24;
+}
+
+.is-col-23 {
+    display: block;
+    width: 95.83333333%;
+}
+
+.is-push-23 {
+    left: 95.83333333%;
+}
+
+.is-pull-23 {
+    right: 95.83333333%;
+}
+
+.is-offset-23 {
+    margin-left: 95.83333333%;
+}
+
+.is-order-23 {
+    -webkit-box-ordinal-group: 24;
+    -ms-flex-order: 23;
+    order: 23;
+}
+
+.is-col-22 {
+    display: block;
+    width: 91.66666667%;
+}
+
+.is-push-22 {
+    left: 91.66666667%;
+}
+
+.is-pull-22 {
+    right: 91.66666667%;
+}
+
+.is-offset-22 {
+    margin-left: 91.66666667%;
+}
+
+.is-order-22 {
+    -webkit-box-ordinal-group: 23;
+    -ms-flex-order: 22;
+    order: 22;
+}
+
+.is-col-21 {
+    display: block;
+    width: 87.5%;
+}
+
+.is-push-21 {
+    left: 87.5%;
+}
+
+.is-pull-21 {
+    right: 87.5%;
+}
+
+.is-offset-21 {
+    margin-left: 87.5%;
+}
+
+.is-order-21 {
+    -webkit-box-ordinal-group: 22;
+    -ms-flex-order: 21;
+    order: 21;
+}
+
+.is-col-20 {
+    display: block;
+    width: 83.33333333%;
+}
+
+.is-push-20 {
+    left: 83.33333333%;
+}
+
+.is-pull-20 {
+    right: 83.33333333%;
+}
+
+.is-offset-20 {
+    margin-left: 83.33333333%;
+}
+
+.is-order-20 {
+    -webkit-box-ordinal-group: 21;
+    -ms-flex-order: 20;
+    order: 20;
+}
+
+.is-col-19 {
+    display: block;
+    width: 79.16666667%;
+}
+
+.is-push-19 {
+    left: 79.16666667%;
+}
+
+.is-pull-19 {
+    right: 79.16666667%;
+}
+
+.is-offset-19 {
+    margin-left: 79.16666667%;
+}
+
+.is-order-19 {
+    -webkit-box-ordinal-group: 20;
+    -ms-flex-order: 19;
+    order: 19;
+}
+
+.is-col-18 {
+    display: block;
+    width: 75%;
+}
+
+.is-push-18 {
+    left: 75%;
+}
+
+.is-pull-18 {
+    right: 75%;
+}
+
+.is-offset-18 {
+    margin-left: 75%;
+}
+
+.is-order-18 {
+    -webkit-box-ordinal-group: 19;
+    -ms-flex-order: 18;
+    order: 18;
+}
+
+.is-col-17 {
+    display: block;
+    width: 70.83333333%;
+}
+
+.is-push-17 {
+    left: 70.83333333%;
+}
+
+.is-pull-17 {
+    right: 70.83333333%;
+}
+
+.is-offset-17 {
+    margin-left: 70.83333333%;
+}
+
+.is-order-17 {
+    -webkit-box-ordinal-group: 18;
+    -ms-flex-order: 17;
+    order: 17;
+}
+
+.is-col-16 {
+    display: block;
+    width: 66.66666667%;
+}
+
+.is-push-16 {
+    left: 66.66666667%;
+}
+
+.is-pull-16 {
+    right: 66.66666667%;
+}
+
+.is-offset-16 {
+    margin-left: 66.66666667%;
+}
+
+.is-order-16 {
+    -webkit-box-ordinal-group: 17;
+    -ms-flex-order: 16;
+    order: 16;
+}
+
+.is-col-15 {
+    display: block;
+    width: 62.5%;
+}
+
+.is-push-15 {
+    left: 62.5%;
+}
+
+.is-pull-15 {
+    right: 62.5%;
+}
+
+.is-offset-15 {
+    margin-left: 62.5%;
+}
+
+.is-order-15 {
+    -webkit-box-ordinal-group: 16;
+    -ms-flex-order: 15;
+    order: 15;
+}
+
+.is-col-14 {
+    display: block;
+    width: 58.33333333%;
+}
+
+.is-push-14 {
+    left: 58.33333333%;
+}
+
+.is-pull-14 {
+    right: 58.33333333%;
+}
+
+.is-offset-14 {
+    margin-left: 58.33333333%;
+}
+
+.is-order-14 {
+    -webkit-box-ordinal-group: 15;
+    -ms-flex-order: 14;
+    order: 14;
+}
+
+.is-col-13 {
+    display: block;
+    width: 54.16666667%;
+}
+
+.is-push-13 {
+    left: 54.16666667%;
+}
+
+.is-pull-13 {
+    right: 54.16666667%;
+}
+
+.is-offset-13 {
+    margin-left: 54.16666667%;
+}
+
+.is-order-13 {
+    -webkit-box-ordinal-group: 14;
+    -ms-flex-order: 13;
+    order: 13;
+}
+
+.is-col-12 {
+    display: block;
+    width: 50%;
+}
+
+.is-push-12 {
+    left: 50%;
+}
+
+.is-pull-12 {
+    right: 50%;
+}
+
+.is-offset-12 {
+    margin-left: 50%;
+}
+
+.is-order-12 {
+    -webkit-box-ordinal-group: 13;
+    -ms-flex-order: 12;
+    order: 12;
+}
+
+.is-col-11 {
+    display: block;
+    width: 45.83333333%;
+}
+
+.is-push-11 {
+    left: 45.83333333%;
+}
+
+.is-pull-11 {
+    right: 45.83333333%;
+}
+
+.is-offset-11 {
+    margin-left: 45.83333333%;
+}
+
+.is-order-11 {
+    -webkit-box-ordinal-group: 12;
+    -ms-flex-order: 11;
+    order: 11;
+}
+
+.is-col-10 {
+    display: block;
+    width: 41.66666667%;
+}
+
+.is-push-10 {
+    left: 41.66666667%;
+}
+
+.is-pull-10 {
+    right: 41.66666667%;
+}
+
+.is-offset-10 {
+    margin-left: 41.66666667%;
+}
+
+.is-order-10 {
+    -webkit-box-ordinal-group: 11;
+    -ms-flex-order: 10;
+    order: 10;
+}
+
+.is-col-9 {
+    display: block;
+    width: 37.5%;
+}
+
+.is-push-9 {
+    left: 37.5%;
+}
+
+.is-pull-9 {
+    right: 37.5%;
+}
+
+.is-offset-9 {
+    margin-left: 37.5%;
+}
+
+.is-order-9 {
+    -webkit-box-ordinal-group: 10;
+    -ms-flex-order: 9;
+    order: 9;
+}
+
+.is-col-8 {
+    display: block;
+    width: 33.33333333%;
+}
+
+.is-push-8 {
+    left: 33.33333333%;
+}
+
+.is-pull-8 {
+    right: 33.33333333%;
+}
+
+.is-offset-8 {
+    margin-left: 33.33333333%;
+}
+
+.is-order-8 {
+    -webkit-box-ordinal-group: 9;
+    -ms-flex-order: 8;
+    order: 8;
+}
+
+.is-col-7 {
+    display: block;
+    width: 29.16666667%;
+}
+
+.is-push-7 {
+    left: 29.16666667%;
+}
+
+.is-pull-7 {
+    right: 29.16666667%;
+}
+
+.is-offset-7 {
+    margin-left: 29.16666667%;
+}
+
+.is-order-7 {
+    -webkit-box-ordinal-group: 8;
+    -ms-flex-order: 7;
+    order: 7;
+}
+
+.is-col-6 {
+    display: block;
+    width: 25%;
+}
+
+.is-push-6 {
+    left: 25%;
+}
+
+.is-pull-6 {
+    right: 25%;
+}
+
+.is-offset-6 {
+    margin-left: 25%;
+}
+
+.is-order-6 {
+    -webkit-box-ordinal-group: 7;
+    -ms-flex-order: 6;
+    order: 6;
+}
+
+.is-col-5 {
+    display: block;
+    width: 20.83333333%;
+}
+
+.is-push-5 {
+    left: 20.83333333%;
+}
+
+.is-pull-5 {
+    right: 20.83333333%;
+}
+
+.is-offset-5 {
+    margin-left: 20.83333333%;
+}
+
+.is-order-5 {
+    -webkit-box-ordinal-group: 6;
+    -ms-flex-order: 5;
+    order: 5;
+}
+
+.is-col-4 {
+    display: block;
+    width: 16.66666667%;
+}
+
+.is-push-4 {
+    left: 16.66666667%;
+}
+
+.is-pull-4 {
+    right: 16.66666667%;
+}
+
+.is-offset-4 {
+    margin-left: 16.66666667%;
+}
+
+.is-order-4 {
+    -webkit-box-ordinal-group: 5;
+    -ms-flex-order: 4;
+    order: 4;
+}
+
+.is-col-3 {
+    display: block;
+    width: 12.5%;
+}
+
+.is-push-3 {
+    left: 12.5%;
+}
+
+.is-pull-3 {
+    right: 12.5%;
+}
+
+.is-offset-3 {
+    margin-left: 12.5%;
+}
+
+.is-order-3 {
+    -webkit-box-ordinal-group: 4;
+    -ms-flex-order: 3;
+    order: 3;
+}
+
+.is-col-2 {
+    display: block;
+    width: 8.33333333%;
+}
+
+.is-push-2 {
+    left: 8.33333333%;
+}
+
+.is-pull-2 {
+    right: 8.33333333%;
+}
+
+.is-offset-2 {
+    margin-left: 8.33333333%;
+}
+
+.is-order-2 {
+    -webkit-box-ordinal-group: 3;
+    -ms-flex-order: 2;
+    order: 2;
+}
+
+.is-col-1 {
+    display: block;
+    width: 4.16666667%;
+}
+
+.is-push-1 {
+    left: 4.16666667%;
+}
+
+.is-pull-1 {
+    right: 4.16666667%;
+}
+
+.is-offset-1 {
+    margin-left: 4.16666667%;
+}
+
+.is-order-1 {
+    -webkit-box-ordinal-group: 2;
+    -ms-flex-order: 1;
+    order: 1;
+}
+
+.is-col-0 {
+    display: none;
+}
+
+.is-push-0 {
+    left: auto;
+}
+
+.is-pull-0 {
+    right: auto;
+}
+
+/* 间隙 */
+/* 间隙 */
+.has-space-mg-1 {
+    margin-left: -2 rpx !important;
+    margin-right: -2 rpx !important;
+}
+
+.has-space-pd-1 {
+    padding-left: 2 rpx !important;
+    padding-right: 2 rpx !important;
+}
+
+.has-space-mg-2 {
+    margin-left: -4 rpx !important;
+    margin-right: -4 rpx !important;
+}
+
+.has-space-pd-2 {
+    padding-left: 4 rpx !important;
+    padding-right: 4 rpx !important;
+}
+
+.has-space-mg-3 {
+    margin-left: -6 rpx !important;
+    margin-right: -6 rpx !important;
+}
+
+.has-space-pd-3 {
+    padding-left: 6 rpx !important;
+    padding-right: 6 rpx !important;
+}
+
+.has-space-mg-5 {
+    margin-left: -10 rpx !important;
+    margin-right: -10 rpx !important;
+}
+
+.has-space-pd-5 {
+    padding-left: 10 rpx !important;
+    padding-right: 10 rpx !important;
+}
+
+.has-space-mg-7 {
+    margin-left: -14 rpx !important;
+    margin-right: -14 rpx !important;
+}
+
+.has-space-pd-7 {
+    padding-left: 14 rpx !important;
+    padding-right: 14 rpx !important;
+}
+
+.has-space-mg-8 {
+    margin-left: -16 rpx !important;
+    margin-right: -16 rpx !important;
+}
+
+.has-space-pd-8 {
+    padding-left: 16 rpx !important;
+    padding-right: 16 rpx !important;
+}
+
+.has-space-mg-10 {
+    margin-left: -20 rpx !important;
+    margin-right: -20 rpx !important;
+}
+
+.has-space-pd-10 {
+    padding-left: 20 rpx !important;
+    padding-right: 20 rpx !important;
+}
+
+.has-space-mg-15 {
+    margin-left: -30 rpx !important;
+    margin-right: -30 rpx !important;
+}
+
+.has-space-pd-15 {
+    padding-left: 30 rpx !important;
+    padding-right: 30 rpx !important;
+}
+
+.has-space-mg-20 {
+    margin-left: -40 rpx !important;
+    margin-right: -40 rpx !important;
+}
+
+.has-space-pd-20 {
+    padding-left: 40 rpx !important;
+    padding-right: 40 rpx !important;
+}
+
+.has-space-mg-25 {
+    margin-left: -50 rpx !important;
+    margin-right: -50 rpx !important;
+}
+
+.has-space-pd-25 {
+    padding-left: 50 rpx !important;
+    padding-right: 50 rpx !important;
+}
+
+.has-space-mg-30 {
+    margin-left: -60 rpx !important;
+    margin-right: -60 rpx !important;
+}
+
+.has-space-pd-30 {
+    padding-left: 60 rpx !important;
+    padding-right: 60 rpx !important;
+}
+
+.has-space-mg-35 {
+    margin-left: -70 rpx !important;
+    margin-right: -70 rpx !important;
+}
+
+.has-space-pd-35 {
+    padding-left: 70 rpx !important;
+    padding-right: 70 rpx !important;
+}
+
+.has-space-mg-40 {
+    margin-left: -80 rpx !important;
+    margin-right: -80 rpx !important;
+}
+
+.has-space-pd-40 {
+    padding-left: 80 rpx !important;
+    padding-right: 80 rpx !important;
+}
+
+.has-space-mg-45 {
+    margin-left: -90 rpx !important;
+    margin-right: -90 rpx !important;
+}
+
+.has-space-pd-45 {
+    padding-left: 90 rpx !important;
+    padding-right: 90 rpx !important;
+}
+
+.has-space-mg-50 {
+    margin-left: -100 rpx !important;
+    margin-right: -100 rpx !important;
+}
+
+.has-space-pd-50 {
+    padding-left: 100 rpx !important;
+    padding-right: 100 rpx !important;
+}
+
+.has-space-mg-55 {
+    margin-left: -110 rpx !important;
+    margin-right: -110 rpx !important;
+}
+
+.has-space-pd-55 {
+    padding-left: 110 rpx !important;
+    padding-right: 110 rpx !important;
+}
+
+.has-space-mg-60 {
+    margin-left: -120 rpx !important;
+    margin-right: -120 rpx !important;
+}
+
+.has-space-pd-60 {
+    padding-left: 120 rpx !important;
+    padding-right: 120 rpx !important;
+}
+
+/* 宫格 */
+.s-grids {
+    position: relative;
+    overflow: hidden;
+}
+
+.is-grid:before {
+    top: 0;
+    width: 1px;
+    border-right: 1px solid #dcdee2;
+    -webkit-transform-origin: 100% 0;
+    transform-origin: 100% 0;
+    -webkit-transform: scaleX(0.5);
+    transform: scaleX(0.5);
+}
+
+.is-grid::after,
+.is-grid::before {
+    content: " ";
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    color: #dcdee2;
+}
+
+.is-grid::after {
+    left: 0;
+    height: 1px;
+    border-bottom: 1px solid #dcdee2;
+    -webkit-transform-origin: 0 100%;
+    transform-origin: 0 100%;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+}
+
+.s-grids-noborder {
+    position: relative;
+    overflow: hidden;
+}
+
+.s-grids::before {
+    right: 0;
+    height: 1px;
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+}
+
+.s-grids::after,
+.s-grids::before {
+    content: " ";
+    position: absolute;
+    left: 0;
+    top: 0;
+    color: #dcdee2;
+}
+
+.s-grids::after {
+    width: 1px;
+    bottom: 0;
+    /* border-left: 1px solid #dcdee2; */
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    -webkit-transform: scaleX(0.5);
+    transform: scaleX(0.5);
+}
+
+.is-grid {
+    position: relative;
+    float: left;
+    box-sizing: border-box;
+}
+
+.is-grid-2 {
+    width: 50%;
+}
+
+.is-grid-3 {
+    width: 33.33333333%;
+}
+
+.is-grid-4 {
+    width: 25%;
+}
+
+.is-grid-5 {
+    width: 20%;
+}
+
+/* 模拟 a 的点击效果 */
+a {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    text-decoration: none;
+}
+
+.is-a {
+    text-decoration: none;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    color: inherit;
+}
+
+.is-a:active {
+    background-color: #ececec;
+}
+
+.has-underline {
+    text-decoration: underline;
+}
+
+.is-red {
+    color: #e64340 !important;
+}
+
+.has-bg-red {
+    background-color: #e64340 !important;
+}
+
+.is-grey {
+    color: #888888 !important;
+}
+
+.has-bg-grey {
+    background-color: #888888 !important;
+}
+
+.is-green {
+    color: #09bb07 !important;
+}
+
+.has-bg-green {
+    background-color: #09bb07 !important;
+}
+
+.is-blue {
+    color: #2A62FF !important;
+}
+
+.has-bg-blue {
+    background-color: #2A62FF !important;
+}
+
+.is-black {
+    color: black !important;
+}
+
+.has-bg-black {
+    background-color: black !important;
+}
+
+.is-white {
+    color: #fff !important;
+}
+
+.has-bg-white {
+    background-color: #fff !important;
+}
+
+.has-title-color {
+    color: black;
+}
+
+.has-content-color {
+    color: #353535;
+}
+
+.has-desc-color {
+    color: #888888;
+}
+
+.has-link-color {
+    color: #576b95;
+}
+
+.is-normal {
+    font-weight: normal;
+}
+
+.is-light {
+    font-weight: 300;
+}
+
+.is-bold {
+    font-weight: 700 !important;
+}
+
+.is-italic {
+    font-style: italic;
+}
+
+.is-left {
+    text-align: left !important;
+}
+
+.is-oneline {
+    max-width: 100%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+
+.is-right {
+    text-align: center !important;
+}
+
+/* 字体居中 */
+.is-center {
+    text-align: center !important;
+}
+
+.is-p {
+    font-size: 32 rpx;
+    color: #353535;
+    line-height: 2;
+    margin-bottom: 30 rpx;
+    text-align: justify;
+}
+
+.is-h1,
+.is-h2,
+.is-h3,
+.is-h4,
+.is-h5,
+.is-h6 {
+    color: black;
+    font-weight: normal;
+}
+
+.is-h1 {
+    font-size: 48 rpx !important;
+}
+
+.is-h2 {
+    font-size: 44 rpx !important;
+}
+
+.is-h3 {
+    font-size: 36 rpx !important;
+}
+
+.is-h4 {
+    font-size: 32 rpx !important;
+}
+
+.is-h5 {
+    font-size: 28 rpx !important;
+}
+
+.is-h6 {
+    font-size: 24 rpx !important;
+}
+
+/* 排版容器，小程序可以不用，正文排版等，请在容器上添加此类，自动格式化 */
+.s-typo p {
+    font-size: 32 rpx;
+    color: #353535;
+    line-height: 2;
+    margin-bottom: 30 rpx;
+    text-align: justify;
+}
+
+.s-typo h1,
+.s-typo h2,
+.s-typo h3,
+.s-typo h4,
+.s-typo h5,
+.s-typo h6 {
+    color: black;
+    font-weight: normal;
+}
+
+.s-typo h1 {
+    font-size: 48 rpx;
+}
+
+.s-typo h2 {
+    font-size: 44 rpx;
+}
+
+.s-typo h3 {
+    font-size: 36 rpx;
+}
+
+.s-typo h4 {
+    font-size: 32 rpx;
+}
+
+.s-typo h5 {
+    font-size: 28 rpx;
+}
+
+.s-typo h6 {
+    font-size: 24 rpx;
+}
+
+.s-typo ol li {
+    list-style-type: decimal;
+    margin-left: 1rem;
+    line-height: 2;
+}
+
+.s-typo ul li {
+    list-style-type: disc;
+    margin-left: 1rem;
+    line-height: 2;
+}
+
+.s-typo img {
+    display: inline-block;
+    height: auto;
+    max-width: 100%;
+}
+
+/* 辅助类 */
+/* 页面高度 */
+.is-100vh {
+    height: 100vh;
+}
+
+.is-33vh {
+    height: 33vh;
+}
+
+.is-50vh {
+    height: 50vh;
+}
+
+.is-20vh {
+    height: 20vh;
+}
+
+/*页面宽度*/
+.is-width-30 {
+    width: 30% !important;
+}
+
+.is-width-40 {
+    width: 40% !important;
+}
+
+.is-width-50 {
+    width: 50% !important;
+}
+
+.is-width-60 {
+    width: 60% !important;
+}
+
+.is-width-70 {
+    width: 70% !important;
+}
+
+.is-width-80 {
+    width: 80% !important;
+}
+
+.is-width-90 {
+    width: 90% !important;
+}
+
+.is-width-100 {
+    width: 100% !important;
+}
+
+.is-width-100px {
+    width: 200 rpx !important;
+}
+
+.is-width-130px {
+    width: 260 rpx !important;
+}
+
+.is-width-150px {
+    width: 300 rpx !important;
+}
+
+.is-width-180px {
+    width: 360 rpx !important;
+}
+
+.is-width-200px {
+    width: 400 rpx !important;
+}
+
+.is-width-220px {
+    width: 440 rpx !important;
+}
+
+/* 图片 */
+.is-img {
+    display: block;
+}
+
+/* 图片响应式 小程序的兼容 mode='widthFix' */
+.is-response {
+    display: block;
+    width: 100%;
+    max-width: 100%;
+    height: 500upx;
+}
+
+.has-floatr {
+    float: right;
+}
+
+.has-floatl {
+    float: left;
+}
+
+.is-absolute {
+    position: absolute;
+}
+
+.is-relative {
+    position: relative;
+}
+
+.is-fixed {
+    position: fixed;
+}
+
+.has-right0 {
+    right: 0;
+}
+
+.has-left0 {
+    left: 0;
+}
+
+.has-top0 {
+    top: 0;
+}
+
+.hsa-bottom0 {
+    bottom: 0;
+}
+
+/* 圆角 */
+.is-circle {
+    border-radius: 50%;
+}
+
+/* 行高 */
+.is-lh-1 {
+    line-height: 1 !important;
+}
+
+.is-lh-15 {
+    line-height: 1.5 !important;
+}
+
+.is-lh-16 {
+    line-height: 1.6 !important;
+}
+
+.is-lh-18 {
+    line-height: 1.8 !important;
+}
+
+.is-lh-2 {
+    line-height: 2 !important;
+}
+
+.is-lh-25 {
+    line-height: 2.5 !important;
+}
+
+/* 字体大小 */
+.is-size-12 {
+    font-size: 24 rpx !important;
+}
+
+.is-size-14 {
+    font-family: "Franklin Gothic Medium";
+    font-size: 28 rpx !important;
+    color: #333333;
+}
+
+.is-size-16 {
+    font-size: 32 rpx !important;
+}
+
+.is-size-17 {
+    font-size: 34 rpx !important;
+}
+
+.is-size-18 {
+    font-size: 36 rpx !important;
+}
+
+.is-size-20 {
+    font-size: 40 rpx !important;
+}
+
+.is-size-25 {
+    font-size: 50 rpx !important;
+}
+
+.is-size-30 {
+    font-size: 60 rpx !important;
+}
+
+.is-size-35 {
+    font-size: 70 rpx !important;
+}
+
+.is-size-40 {
+    font-size: 80 rpx !important;
+}
+
+.is-size-50 {
+    font-size: 100 rpx !important;
+}
+
+.is-size-60 {
+    font-size: 120 rpx !important;
+}
+
+/* 徽标 */
+.has-badge-border {
+    border: 1px solid #dcdee2;
+    padding: 3px 3px;
+}
+
+.has-radius {
+    border-radius: 8 rpx;
+}
+
+.has-radius-0 {
+    border-radius: 0 rpx;
+}
+
+.has-radius-2 {
+    border-radius: 4 rpx;
+}
+
+.has-radius-top-2 {
+    border-top-left-radius: 4 rpx;
+    border-top-right-radius: 4 rpx;
+}
+
+.has-radius-4 {
+    border-radius: 8 rpx;
+}
+
+.has-radius-top-4 {
+    border-top-left-radius: 8 rpx;
+    border-top-right-radius: 8 rpx;
+}
+
+.has-radius-6 {
+    border-radius: 12 rpx;
+}
+
+.has-radius-8 {
+    border-radius: 16 rpx;
+}
+
+/* 1px 边框 */
+.has-borderb:before {
+    border-bottom: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    -webkit-transform-origin: left bottom;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-borderb:before {
+        -webkit-transform: scaleY(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-borderb:before {
+        -webkit-transform: scaleY(0.3333);
+    }
+}
+
+.has-bordert:before {
+    border-top: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    top: 0;
+    -webkit-transform-origin: left top;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-bordert:before {
+        -webkit-transform: scaleY(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-bordert:before {
+        -webkit-transform: scaleY(0.3333);
+    }
+}
+
+.has-borderl:before {
+    border-left: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    bottom: 0;
+    position: absolute;
+    left: 0;
+    top: 0;
+    -webkit-transform-origin: left top;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-borderl:before {
+        -webkit-transform: scaleX(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-borderl:before {
+        -webkit-transform: scaleX(0.3333);
+    }
+}
+
+.has-borderr:before {
+    border-right: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    bottom: 0;
+    position: absolute;
+    right: 0;
+    top: 0;
+    -webkit-transform-origin: right top;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-borderr:before {
+        -webkit-transform: scaleX(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-borderr:before {
+        -webkit-transform: scaleX(0.3333);
+    }
+}
+
+.has-bordert,
+.has-borderl,
+.has-borderb,
+.has-borderr,
+.has-bordertb,
+.has-bordera,
+.has-border-radius {
+    position: relative;
+}
+
+.has-bordertb:before {
+    border-top: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    top: 0;
+    -webkit-transform-origin: left top;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-bordertb:before {
+        -webkit-transform: scaleY(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-bordertb:before {
+        -webkit-transform: scaleY(0.3333);
+    }
+}
+
+.has-bordertb:after {
+    border-bottom: 1px solid #dcdee2;
+    content: '';
+    display: block;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    -webkit-transform-origin: left bottom;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-bordertb:after {
+        -webkit-transform: scaleY(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-bordertb:after {
+        -webkit-transform: scaleY(0.3333);
+    }
+}
+
+.has-bordera:before {
+    content: "";
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border: 1px solid #dcdee2;
+    -webkit-transform-origin: 0 0;
+    padding: 1px;
+    -webkit-box-sizing: border-box;
+    pointer-events: none;
+    z-index: 10;
+    pointer-events: none;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-bordera:before {
+        width: 200%;
+        height: 200%;
+        -webkit-transform: scale(0.5);
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-bordera:before {
+        width: 300%;
+        height: 300%;
+        -webkit-transform: scale(0.3333);
+    }
+}
+
+.has-border-radius:before {
+    content: "";
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border: 1px solid #dcdee2;
+    -webkit-transform-origin: 0 0;
+    padding: 1px;
+    -webkit-box-sizing: border-box;
+    border-radius: 4px;
+    pointer-events: none;
+    z-index: 10;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 2) {
+    .has-border-radius:before {
+        width: 200%;
+        height: 200%;
+        -webkit-transform: scale(0.5);
+        border-radius: 8px;
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 3) {
+    .has-border-radius:before {
+        width: 300%;
+        height: 300%;
+        -webkit-transform: scale(0.3333);
+        border-radius: 12px;
+    }
+}
+
+/* 浮动 */
+.has-mg-0 {
+    margin: 0 rpx !important;
+}
+
+.has-mgtb-0 {
+    margin-top: 0 rpx !important;
+    margin-bottom: 0 rpx !important;
+}
+
+.has-mglr-0 {
+    margin-left: 0 rpx !important;
+    margin-right: 0 rpx !important;
+}
+
+.has-pd-0 {
+    padding: 0 rpx !important;
+}
+
+.has-pdtb-0 {
+    padding-top: 0 rpx !important;
+    padding-bottom: 0 rpx !important;
+}
+
+.has-pdlr-0 {
+    padding-left: 0 rpx !important;
+    padding-right: 0 rpx !important;
+}
+
+.has-mgt-0 {
+    margin-top: 0 rpx !important;
+}
+
+.has-mgl-0 {
+    margin-left: 0 rpx !important;
+}
+
+.has-mgr-0 {
+    margin-right: 0 rpx !important;
+}
+
+.has-mgb-0 {
+    margin-bottom: 0 rpx !important;
+}
+
+.has-pdt-0 {
+    padding-top: 0 rpx !important;
+}
+
+.has-pdl-0 {
+    padding-left: 0 rpx !important;
+}
+
+.has-pdr-0 {
+    padding-right: 0 rpx !important;
+}
+
+.has-pdb-0 {
+    padding-bottom: 0 rpx !important;
+}
+
+.has-mg-1 {
+    margin: 2 rpx !important;
+}
+
+.has-mgtb-1 {
+    margin-top: 2 rpx !important;
+    margin-bottom: 2 rpx !important;
+}
+
+.has-mglr-1 {
+    margin-left: 2 rpx !important;
+    margin-right: 2 rpx !important;
+}
+
+.has-pd-1 {
+    padding: 2 rpx !important;
+}
+
+.has-pdtb-1 {
+    padding-top: 2 rpx !important;
+    padding-bottom: 2 rpx !important;
+}
+
+.has-pdlr-1 {
+    padding-left: 2 rpx !important;
+    padding-right: 2 rpx !important;
+}
+
+.has-mgt-1 {
+    margin-top: 2 rpx !important;
+}
+
+.has-mgl-1 {
+    margin-left: 2 rpx !important;
+}
+
+.has-mgr-1 {
+    margin-right: 2 rpx !important;
+}
+
+.has-mgb-1 {
+    margin-bottom: 2 rpx !important;
+}
+
+.has-pdt-1 {
+    padding-top: 2 rpx !important;
+}
+
+.has-pdl-1 {
+    padding-left: 2 rpx !important;
+}
+
+.has-pdr-1 {
+    padding-right: 2 rpx !important;
+}
+
+.has-pdb-1 {
+    padding-bottom: 2 rpx !important;
+}
+
+.has-mg-2 {
+    margin: 4 rpx !important;
+}
+
+.has-mgtb-2 {
+    margin-top: 4 rpx !important;
+    margin-bottom: 4 rpx !important;
+}
+
+.has-mglr-2 {
+    margin-left: 4 rpx !important;
+    margin-right: 4 rpx !important;
+}
+
+.has-pd-2 {
+    padding: 4 rpx !important;
+}
+
+.has-pdtb-2 {
+    padding-top: 4 rpx !important;
+    padding-bottom: 4 rpx !important;
+}
+
+.has-pdlr-2 {
+    padding-left: 4 rpx !important;
+    padding-right: 4 rpx !important;
+}
+
+.has-mgt-2 {
+    margin-top: 4 rpx !important;
+}
+
+.has-mgl-2 {
+    margin-left: 4 rpx !important;
+}
+
+.has-mgr-2 {
+    margin-right: 4 rpx !important;
+}
+
+.has-mgb-2 {
+    margin-bottom: 4 rpx !important;
+}
+
+.has-pdt-2 {
+    padding-top: 4 rpx !important;
+}
+
+.has-pdl-2 {
+    padding-left: 4 rpx !important;
+}
+
+.has-pdr-2 {
+    padding-right: 4 rpx !important;
+}
+
+.has-pdb-2 {
+    padding-bottom: 4 rpx !important;
+}
+
+.has-mg-3 {
+    margin: 6 rpx !important;
+}
+
+.has-mgtb-3 {
+    margin-top: 6 rpx !important;
+    margin-bottom: 6 rpx !important;
+}
+
+.has-mglr-3 {
+    margin-left: 6 rpx !important;
+    margin-right: 6 rpx !important;
+}
+
+.has-pd-3 {
+    padding: 6 rpx !important;
+}
+
+.has-pdtb-3 {
+    padding-top: 6 rpx !important;
+    padding-bottom: 6 rpx !important;
+}
+
+.has-pdlr-3 {
+    padding-left: 6 rpx !important;
+    padding-right: 6 rpx !important;
+}
+
+.has-mgt-3 {
+    margin-top: 6 rpx !important;
+}
+
+.has-mgl-3 {
+    margin-left: 6 rpx !important;
+}
+
+.has-mgr-3 {
+    margin-right: 6 rpx !important;
+}
+
+.has-mgb-3 {
+    margin-bottom: 6 rpx !important;
+}
+
+.has-pdt-3 {
+    padding-top: 6 rpx !important;
+}
+
+.has-pdl-3 {
+    padding-left: 6 rpx !important;
+}
+
+.has-pdr-3 {
+    padding-right: 6 rpx !important;
+}
+
+.has-pdb-3 {
+    padding-bottom: 6 rpx !important;
+}
+
+.has-mg-4 {
+    margin: 8 rpx !important;
+}
+
+.has-mgtb-4 {
+    margin-top: 8 rpx !important;
+    margin-bottom: 8 rpx !important;
+}
+
+.has-mglr-4 {
+    margin-left: 8 rpx !important;
+    margin-right: 8 rpx !important;
+}
+
+.has-pd-4 {
+    padding: 8 rpx !important;
+}
+
+.has-pdtb-4 {
+    padding-top: 8 rpx !important;
+    padding-bottom: 8 rpx !important;
+}
+
+.has-pdlr-4 {
+    padding-left: 8 rpx !important;
+    padding-right: 8 rpx !important;
+}
+
+.has-mgt-4 {
+    margin-top: 8 rpx !important;
+}
+
+.has-mgl-4 {
+    margin-left: 8 rpx !important;
+}
+
+.has-mgr-4 {
+    margin-right: 8 rpx !important;
+}
+
+.has-mgb-4 {
+    margin-bottom: 8 rpx !important;
+}
+
+.has-pdt-4 {
+    padding-top: 8 rpx !important;
+}
+
+.has-pdl-4 {
+    padding-left: 8 rpx !important;
+}
+
+.has-pdr-4 {
+    padding-right: 8 rpx !important;
+}
+
+.has-pdb-4 {
+    padding-bottom: 8 rpx !important;
+}
+
+.has-mg-5 {
+    margin: 10 rpx !important;
+}
+
+.has-mgtb-5 {
+    margin-top: 10 rpx !important;
+    margin-bottom: 10 rpx !important;
+}
+
+.has-mglr-5 {
+    margin-left: 10 rpx !important;
+    margin-right: 10 rpx !important;
+}
+
+.has-pd-5 {
+    padding: 10 rpx !important;
+}
+
+.has-pdtb-5 {
+    padding-top: 10 rpx !important;
+    padding-bottom: 10 rpx !important;
+}
+
+.has-pdlr-5 {
+    padding-left: 10 rpx !important;
+    padding-right: 10 rpx !important;
+}
+
+.has-mgt-5 {
+    margin-top: 10 rpx !important;
+}
+
+.has-mgl-5 {
+    margin-left: 10 rpx !important;
+}
+
+.has-mgr-5 {
+    margin-right: 10 rpx !important;
+}
+
+.has-mgb-5 {
+    margin-bottom: 10 rpx !important;
+}
+
+.has-pdt-5 {
+    padding-top: 10 rpx !important;
+}
+
+.has-pdl-5 {
+    padding-left: 10 rpx !important;
+}
+
+.has-pdr-5 {
+    padding-right: 10 rpx !important;
+}
+
+.has-pdb-5 {
+    padding-bottom: 10 rpx !important;
+}
+
+.has-mg-6 {
+    margin: 12 rpx !important;
+}
+
+.has-mgtb-6 {
+    margin-top: 12 rpx !important;
+    margin-bottom: 12 rpx !important;
+}
+
+.has-mglr-6 {
+    margin-left: 12 rpx !important;
+    margin-right: 12 rpx !important;
+}
+
+.has-pd-6 {
+    padding: 12 rpx !important;
+}
+
+.has-pdtb-6 {
+    padding-top: 12 rpx !important;
+    padding-bottom: 12 rpx !important;
+}
+
+.has-pdlr-6 {
+    padding-left: 12 rpx !important;
+    padding-right: 12 rpx !important;
+}
+
+.has-mgt-6 {
+    margin-top: 12 rpx !important;
+}
+
+.has-mgl-6 {
+    margin-left: 12 rpx !important;
+}
+
+.has-mgr-6 {
+    margin-right: 12 rpx !important;
+}
+
+.has-mgb-6 {
+    margin-bottom: 12 rpx !important;
+}
+
+.has-pdt-6 {
+    padding-top: 12 rpx !important;
+}
+
+.has-pdl-6 {
+    padding-left: 12 rpx !important;
+}
+
+.has-pdr-6 {
+    padding-right: 12 rpx !important;
+}
+
+.has-pdb-6 {
+    padding-bottom: 12 rpx !important;
+}
+
+.has-mg-7 {
+    margin: 14 rpx !important;
+}
+
+.has-mgtb-7 {
+    margin-top: 14 rpx !important;
+    margin-bottom: 14 rpx !important;
+}
+
+.has-mglr-7 {
+    margin-left: 14 rpx !important;
+    margin-right: 14 rpx !important;
+}
+
+.has-pd-7 {
+    padding: 14 rpx !important;
+}
+
+.has-pdtb-7 {
+    padding-top: 14 rpx !important;
+    padding-bottom: 14 rpx !important;
+}
+
+.has-pdlr-7 {
+    padding-left: 14 rpx !important;
+    padding-right: 14 rpx !important;
+}
+
+.has-mgt-7 {
+    margin-top: 14 rpx !important;
+}
+
+.has-mgl-7 {
+    margin-left: 14 rpx !important;
+}
+
+.has-mgr-7 {
+    margin-right: 14 rpx !important;
+}
+
+.has-mgb-7 {
+    margin-bottom: 14 rpx !important;
+}
+
+.has-pdt-7 {
+    padding-top: 14 rpx !important;
+}
+
+.has-pdl-7 {
+    padding-left: 14 rpx !important;
+}
+
+.has-pdr-7 {
+    padding-right: 14 rpx !important;
+}
+
+.has-pdb-7 {
+    padding-bottom: 14 rpx !important;
+}
+
+.has-mg-8 {
+    margin: 16 rpx !important;
+}
+
+.has-mgtb-8 {
+    margin-top: 16 rpx !important;
+    margin-bottom: 16 rpx !important;
+}
+
+.has-mglr-8 {
+    margin-left: 16 rpx !important;
+    margin-right: 16 rpx !important;
+}
+
+.has-pd-8 {
+    padding: 16 rpx !important;
+}
+
+.has-pdtb-8 {
+    padding-top: 16 rpx !important;
+    padding-bottom: 16 rpx !important;
+}
+
+.has-pdlr-8 {
+    padding-left: 16 rpx !important;
+    padding-right: 16 rpx !important;
+}
+
+.has-mgt-8 {
+    margin-top: 16 rpx !important;
+}
+
+.has-mgl-8 {
+    margin-left: 16 rpx !important;
+}
+
+.has-mgr-8 {
+    margin-right: 16 rpx !important;
+}
+
+.has-mgb-8 {
+    margin-bottom: 16 rpx !important;
+}
+
+.has-pdt-8 {
+    padding-top: 16 rpx !important;
+}
+
+.has-pdl-8 {
+    padding-left: 16 rpx !important;
+}
+
+.has-pdr-8 {
+    padding-right: 16 rpx !important;
+}
+
+.has-pdb-8 {
+    padding-bottom: 16 rpx !important;
+}
+
+.has-mg-10 {
+    margin: 20 rpx !important;
+}
+
+.has-mgtb-10 {
+    margin-top: 20 rpx !important;
+    margin-bottom: 20 rpx !important;
+}
+
+.has-mglr-10 {
+    margin-left: 20 rpx !important;
+    margin-right: 20 rpx !important;
+}
+
+.has-pd-10 {
+    padding: 20 rpx !important;
+}
+
+.has-pdtb-10 {
+    padding-top: 20 rpx !important;
+    padding-bottom: 20 rpx !important;
+}
+
+.has-pdlr-10 {
+    padding-left: 20 rpx !important;
+    padding-right: 20 rpx !important;
+}
+
+.has-mgt-10 {
+    margin-top: 20 rpx !important;
+}
+
+.has-mgl-10 {
+    margin-left: 20 rpx !important;
+}
+
+.has-mgr-10 {
+    margin-right: 20 rpx !important;
+}
+
+.has-mgb-10 {
+    margin-bottom: 20 rpx !important;
+}
+
+.has-pdt-10 {
+    padding-top: 20 rpx !important;
+}
+
+.has-pdl-10 {
+    padding-left: 20 rpx !important;
+}
+
+.has-pdr-10 {
+    padding-right: 20 rpx !important;
+}
+
+.has-pdb-10 {
+    padding-bottom: 20 rpx !important;
+}
+
+.has-mg-12 {
+    margin: 24 rpx !important;
+}
+
+.has-mgtb-12 {
+    margin-top: 24 rpx !important;
+    margin-bottom: 24 rpx !important;
+}
+
+.has-mglr-12 {
+    margin-left: 24 rpx !important;
+    margin-right: 24 rpx !important;
+}
+
+.has-pd-12 {
+    padding: 24 rpx !important;
+}
+
+.has-pdtb-12 {
+    padding-top: 24 rpx !important;
+    padding-bottom: 24 rpx !important;
+}
+
+.has-pdlr-12 {
+    padding-left: 24 rpx !important;
+    padding-right: 24 rpx !important;
+}
+
+.has-mgt-12 {
+    margin-top: 24 rpx !important;
+}
+
+.has-mgl-12 {
+    margin-left: 24 rpx !important;
+}
+
+.has-mgr-12 {
+    margin-right: 24 rpx !important;
+}
+
+.has-mgb-12 {
+    margin-bottom: 24 rpx !important;
+}
+
+.has-pdt-12 {
+    padding-top: 24 rpx !important;
+}
+
+.has-pdl-12 {
+    padding-left: 24 rpx !important;
+}
+
+.has-pdr-12 {
+    padding-right: 24 rpx !important;
+}
+
+.has-pdb-12 {
+    padding-bottom: 24 rpx !important;
+}
+
+.has-mg-15 {
+    margin: 30 rpx !important;
+}
+
+.has-mgtb-15 {
+    margin-top: 30 rpx !important;
+    margin-bottom: 30 rpx !important;
+}
+
+.has-mglr-15 {
+    margin-left: 30 rpx !important;
+    margin-right: 30 rpx !important;
+}
+
+.has-pd-15 {
+    padding: 30 rpx !important;
+}
+
+.has-pdtb-15 {
+    padding-top: 30 rpx !important;
+    padding-bottom: 30 rpx !important;
+}
+
+.has-pdlr-15 {
+    padding-left: 30 rpx !important;
+    padding-right: 30 rpx !important;
+}
+
+.has-mgt-15 {
+    margin-top: 30 rpx !important;
+}
+
+.has-mgl-15 {
+    margin-left: 30 rpx !important;
+}
+
+.has-mgr-15 {
+    margin-right: 30 rpx !important;
+}
+
+.has-mgb-15 {
+    margin-bottom: 30 rpx !important;
+}
+
+.has-pdt-15 {
+    padding-top: 30 rpx !important;
+}
+
+.has-pdl-15 {
+    padding-left: 30 rpx !important;
+}
+
+.has-pdr-15 {
+    padding-right: 30 rpx !important;
+}
+
+.has-pdb-15 {
+    padding-bottom: 30 rpx !important;
+}
+
+.has-mg-18 {
+    margin: 36 rpx !important;
+}
+
+.has-mgtb-18 {
+    margin-top: 36 rpx !important;
+    margin-bottom: 36 rpx !important;
+}
+
+.has-mglr-18 {
+    margin-left: 36 rpx !important;
+    margin-right: 36 rpx !important;
+}
+
+.has-pd-18 {
+    padding: 36 rpx !important;
+}
+
+.has-pdtb-18 {
+    padding-top: 36 rpx !important;
+    padding-bottom: 36 rpx !important;
+}
+
+.has-pdlr-18 {
+    padding-left: 36 rpx !important;
+    padding-right: 36 rpx !important;
+}
+
+.has-mgt-18 {
+    margin-top: 36 rpx !important;
+}
+
+.has-mgl-18 {
+    margin-left: 36 rpx !important;
+}
+
+.has-mgr-18 {
+    margin-right: 36 rpx !important;
+}
+
+.has-mgb-18 {
+    margin-bottom: 36 rpx !important;
+}
+
+.has-pdt-18 {
+    padding-top: 36 rpx !important;
+}
+
+.has-pdl-18 {
+    padding-left: 36 rpx !important;
+}
+
+.has-pdr-18 {
+    padding-right: 36 rpx !important;
+}
+
+.has-pdb-18 {
+    padding-bottom: 36 rpx !important;
+}
+
+.has-mg-20 {
+    margin: 40 rpx !important;
+}
+
+.has-mgtb-20 {
+    margin-top: 40 rpx !important;
+    margin-bottom: 40 rpx !important;
+}
+
+.has-mglr-20 {
+    margin-left: 40 rpx !important;
+    margin-right: 40 rpx !important;
+}
+
+.has-pd-20 {
+    padding: 40 rpx !important;
+}
+
+.has-pdtb-20 {
+    padding-top: 40 rpx !important;
+    padding-bottom: 40 rpx !important;
+}
+
+.has-pdlr-20 {
+    padding-left: 40 rpx !important;
+    padding-right: 40 rpx !important;
+}
+
+.has-mgt-20 {
+    margin-top: 40 rpx !important;
+}
+
+.has-mgl-20 {
+    margin-left: 40 rpx !important;
+}
+
+.has-mgr-20 {
+    margin-right: 40 rpx !important;
+}
+
+.has-mgb-20 {
+    margin-bottom: 40 rpx !important;
+}
+
+.has-pdt-20 {
+    padding-top: 40 rpx !important;
+}
+
+.has-pdl-20 {
+    padding-left: 40 rpx !important;
+}
+
+.has-pdr-20 {
+    padding-right: 40 rpx !important;
+}
+
+.has-pdb-20 {
+    padding-bottom: 40 rpx !important;
+}
+
+.has-mg-25 {
+    margin: 50 rpx !important;
+}
+
+.has-mgtb-25 {
+    margin-top: 50 rpx !important;
+    margin-bottom: 50 rpx !important;
+}
+
+.has-mglr-25 {
+    margin-left: 50 rpx !important;
+    margin-right: 50 rpx !important;
+}
+
+.has-pd-25 {
+    padding: 50 rpx !important;
+}
+
+.has-pdtb-25 {
+    padding-top: 50 rpx !important;
+    padding-bottom: 50 rpx !important;
+}
+
+.has-pdlr-25 {
+    padding-left: 50 rpx !important;
+    padding-right: 50 rpx !important;
+}
+
+.has-mgt-25 {
+    margin-top: 50 rpx !important;
+}
+
+.has-mgl-25 {
+    margin-left: 50 rpx !important;
+}
+
+.has-mgr-25 {
+    margin-right: 50 rpx !important;
+}
+
+.has-mgb-25 {
+    margin-bottom: 50 rpx !important;
+}
+
+.has-pdt-25 {
+    padding-top: 50 rpx !important;
+}
+
+.has-pdl-25 {
+    padding-left: 50 rpx !important;
+}
+
+.has-pdr-25 {
+    padding-right: 50 rpx !important;
+}
+
+.has-pdb-25 {
+    padding-bottom: 50 rpx !important;
+}
+
+.has-mg-30 {
+    margin: 60 rpx !important;
+}
+
+.has-mgtb-30 {
+    margin-top: 60 rpx !important;
+    margin-bottom: 60 rpx !important;
+}
+
+.has-mglr-30 {
+    margin-left: 60 rpx !important;
+    margin-right: 60 rpx !important;
+}
+
+.has-pd-30 {
+    padding: 60 rpx !important;
+}
+
+.has-pdtb-30 {
+    padding-top: 60 rpx !important;
+    padding-bottom: 60 rpx !important;
+}
+
+.has-pdlr-30 {
+    padding-left: 60 rpx !important;
+    padding-right: 60 rpx !important;
+}
+
+.has-mgt-30 {
+    margin-top: 60 rpx !important;
+}
+
+.has-mgl-30 {
+    margin-left: 60 rpx !important;
+}
+
+.has-mgr-30 {
+    margin-right: 60 rpx !important;
+}
+
+.has-mgb-30 {
+    margin-bottom: 60 rpx !important;
+}
+
+.has-pdt-30 {
+    padding-top: 60 rpx !important;
+}
+
+.has-pdl-30 {
+    padding-left: 60 rpx !important;
+}
+
+.has-pdr-30 {
+    padding-right: 60 rpx !important;
+}
+
+.has-pdb-30 {
+    padding-bottom: 60 rpx !important;
+}
+
+.has-mg-35 {
+    margin: 70 rpx !important;
+}
+
+.has-mgtb-35 {
+    margin-top: 70 rpx !important;
+    margin-bottom: 70 rpx !important;
+}
+
+.has-mglr-35 {
+    margin-left: 70 rpx !important;
+    margin-right: 70 rpx !important;
+}
+
+.has-pd-35 {
+    padding: 70 rpx !important;
+}
+
+.has-pdtb-35 {
+    padding-top: 70 rpx !important;
+    padding-bottom: 70 rpx !important;
+}
+
+.has-pdlr-35 {
+    padding-left: 70 rpx !important;
+    padding-right: 70 rpx !important;
+}
+
+.has-mgt-35 {
+    margin-top: 70 rpx !important;
+}
+
+.has-mgl-35 {
+    margin-left: 70 rpx !important;
+}
+
+.has-mgr-35 {
+    margin-right: 70 rpx !important;
+}
+
+.has-mgb-35 {
+    margin-bottom: 70 rpx !important;
+}
+
+.has-pdt-35 {
+    padding-top: 70 rpx !important;
+}
+
+.has-pdl-35 {
+    padding-left: 70 rpx !important;
+}
+
+.has-pdr-35 {
+    padding-right: 70 rpx !important;
+}
+
+.has-pdb-35 {
+    padding-bottom: 70 rpx !important;
+}
+
+.has-mg-40 {
+    margin: 80 rpx !important;
+}
+
+.has-mgtb-40 {
+    margin-top: 80 rpx !important;
+    margin-bottom: 80 rpx !important;
+}
+
+.has-mglr-40 {
+    margin-left: 80 rpx !important;
+    margin-right: 80 rpx !important;
+}
+
+.has-pd-40 {
+    padding: 80 rpx !important;
+}
+
+.has-pdtb-40 {
+    padding-top: 80 rpx !important;
+    padding-bottom: 80 rpx !important;
+}
+
+.has-pdlr-40 {
+    padding-left: 80 rpx !important;
+    padding-right: 80 rpx !important;
+}
+
+.has-mgt-40 {
+    margin-top: 80 rpx !important;
+}
+
+.has-mgl-40 {
+    margin-left: 80 rpx !important;
+}
+
+.has-mgr-40 {
+    margin-right: 80 rpx !important;
+}
+
+.has-mgb-40 {
+    margin-bottom: 80 rpx !important;
+}
+
+.has-pdt-40 {
+    padding-top: 80 rpx !important;
+}
+
+.has-pdl-40 {
+    padding-left: 80 rpx !important;
+}
+
+.has-pdr-40 {
+    padding-right: 80 rpx !important;
+}
+
+.has-pdb-40 {
+    padding-bottom: 80 rpx !important;
+}
+
+.has-mg-45 {
+    margin: 90 rpx !important;
+}
+
+.has-mgtb-45 {
+    margin-top: 90 rpx !important;
+    margin-bottom: 90 rpx !important;
+}
+
+.has-mglr-45 {
+    margin-left: 90 rpx !important;
+    margin-right: 90 rpx !important;
+}
+
+.has-pd-45 {
+    padding: 90 rpx !important;
+}
+
+.has-pdtb-45 {
+    padding-top: 90 rpx !important;
+    padding-bottom: 90 rpx !important;
+}
+
+.has-pdlr-45 {
+    padding-left: 90 rpx !important;
+    padding-right: 90 rpx !important;
+}
+
+.has-mgt-45 {
+    margin-top: 90 rpx !important;
+}
+
+.has-mgl-45 {
+    margin-left: 90 rpx !important;
+}
+
+.has-mgr-45 {
+    margin-right: 90 rpx !important;
+}
+
+.has-mgb-45 {
+    margin-bottom: 90 rpx !important;
+}
+
+.has-pdt-45 {
+    padding-top: 90 rpx !important;
+}
+
+.has-pdl-45 {
+    padding-left: 90 rpx !important;
+}
+
+.has-pdr-45 {
+    padding-right: 90 rpx !important;
+}
+
+.has-pdb-45 {
+    padding-bottom: 90 rpx !important;
+}
+
+.has-mg-50 {
+    margin: 100 rpx !important;
+}
+
+.has-mgtb-50 {
+    margin-top: 100 rpx !important;
+    margin-bottom: 100 rpx !important;
+}
+
+.has-mglr-50 {
+    margin-left: 100 rpx !important;
+    margin-right: 100 rpx !important;
+}
+
+.has-pd-50 {
+    padding: 100 rpx !important;
+}
+
+.has-pdtb-50 {
+    padding-top: 100 rpx !important;
+    padding-bottom: 100 rpx !important;
+}
+
+.has-pdlr-50 {
+    padding-left: 100 rpx !important;
+    padding-right: 100 rpx !important;
+}
+
+.has-mgt-50 {
+    margin-top: 100 rpx !important;
+}
+
+.has-mgl-50 {
+    margin-left: 100 rpx !important;
+}
+
+.has-mgr-50 {
+    margin-right: 100 rpx !important;
+}
+
+.has-mgb-50 {
+    margin-bottom: 100 rpx !important;
+}
+
+.has-pdt-50 {
+    padding-top: 100 rpx !important;
+}
+
+.has-pdl-50 {
+    padding-left: 100 rpx !important;
+}
+
+.has-pdr-50 {
+    padding-right: 100 rpx !important;
+}
+
+.has-pdb-50 {
+    padding-bottom: 100 rpx !important;
+}
+
+.has-mg-55 {
+    margin: 110 rpx !important;
+}
+
+.has-mgtb-55 {
+    margin-top: 110 rpx !important;
+    margin-bottom: 110 rpx !important;
+}
+
+.has-mglr-55 {
+    margin-left: 110 rpx !important;
+    margin-right: 110 rpx !important;
+}
+
+.has-pd-55 {
+    padding: 110 rpx !important;
+}
+
+.has-pdtb-55 {
+    padding-top: 110 rpx !important;
+    padding-bottom: 110 rpx !important;
+}
+
+.has-pdlr-55 {
+    padding-left: 110 rpx !important;
+    padding-right: 110 rpx !important;
+}
+
+.has-mgt-55 {
+    margin-top: 110 rpx !important;
+}
+
+.has-mgl-55 {
+    margin-left: 110 rpx !important;
+}
+
+.has-mgr-55 {
+    margin-right: 110 rpx !important;
+}
+
+.has-mgb-55 {
+    margin-bottom: 110 rpx !important;
+}
+
+.has-pdt-55 {
+    padding-top: 110 rpx !important;
+}
+
+.has-pdl-55 {
+    padding-left: 110 rpx !important;
+}
+
+.has-pdr-55 {
+    padding-right: 110 rpx !important;
+}
+
+.has-pdb-55 {
+    padding-bottom: 110 rpx !important;
+}
+
+.has-mg-60 {
+    margin: 120 rpx !important;
+}
+
+.has-mgtb-60 {
+    margin-top: 120 rpx !important;
+    margin-bottom: 120 rpx !important;
+}
+
+.has-mglr-60 {
+    margin-left: 120 rpx !important;
+    margin-right: 120 rpx !important;
+}
+
+.has-pd-60 {
+    padding: 120 rpx !important;
+}
+
+.has-pdtb-60 {
+    padding-top: 120 rpx !important;
+    padding-bottom: 120 rpx !important;
+}
+
+.has-pdlr-60 {
+    padding-left: 120 rpx !important;
+    padding-right: 120 rpx !important;
+}
+
+.has-mgt-60 {
+    margin-top: 120 rpx !important;
+}
+
+.has-mgl-60 {
+    margin-left: 120 rpx !important;
+}
+
+.has-mgr-60 {
+    margin-right: 120 rpx !important;
+}
+
+.has-mgb-60 {
+    margin-bottom: 120 rpx !important;
+}
+
+.has-pdt-60 {
+    padding-top: 120 rpx !important;
+}
+
+.has-pdl-60 {
+    padding-left: 120 rpx !important;
+}
+
+.has-pdr-60 {
+    padding-right: 120 rpx !important;
+}
+
+.has-pdb-60 {
+    padding-bottom: 120 rpx !important;
+}
+
+/* 按钮  */
+.is-btn,
+.is-btn-lg,
+.is-btn-md {
+    position: relative;
+    text-align: center;
+    background-color: #fff;
+    vertical-align: top;
+    color: #000;
+    -webkit-box-sizing: border-box;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    border: 1px solid #dcdee2;
+    border-radius: 6 rpx;
+    text-decoration: none;
+}
+
+.is-btn:not(.disabled):not(:disabled):active,
+.is-btn.active,
+.is-btn-lg:not(.disabled):not(:disabled):active,
+.is-btn-lg.active,
+.is-btn-md:not(.disabled):not(:disabled):active,
+.is-btn-md.active {
+    background-color: #f0f0f0;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    border-color: #dcdee2;
+}
+
+.is-btn.disabled,
+.is-btn:disabled,
+.is-btn-lg.disabled,
+.is-btn-lg:disabled,
+.is-btn-md.disabled,
+.is-btn-md:disabled {
+    border: 0;
+    color: #bbb;
+    background: #e9ebec;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+}
+
+.is-btn {
+    height: 60 rpx;
+    line-height: 60 rpx;
+    padding: 0 rpx 32 rpx;
+    display: block;
+    text-align: center;
+    font-size: 28 rpx;
+    border-radius: 4 rpx;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    overflow: hidden;
+}
+
+.is-btn-md {
+    display: block;
+    text-align: center;
+    width: 280 rpx;
+    height: 80 rpx;
+    line-height: 80 rpx;
+    font-size: 34 rpx;
+    border-radius: 6 rpx;
+    margin: auto;
+    margin-bottom: 30 rpx;
+}
+
+.is-btn-lg {
+    font-size: 34 rpx;
+    height: 80 rpx;
+    line-height: 80 rpx;
+    display: block;
+    text-align: center;
+    width: 100%;
+    border-radius: 6 rpx;
+    margin-bottom: 30 rpx;
+}
+
+.has-btn-radius {
+    border-radius: 50px;
+}
+
+.has-bg-green {
+    border: 0;
+    background-color: #09bb07;
+    color: #fff;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+}
+
+.has-bg-green:not(.disabled):not(:disabled):active,
+.has-bg-green.active {
+    background: #179b16 !important;
+    color: rgba(255, 255, 255, 0.6) !important;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+}
+
+.has-bg-blue {
+    border: 0;
+    background-color: #2A62FF;
+    color: #fff;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    box-shadow: 0 2px 6px #71b6f7;
+}
+
+.has-bg-blue:not(.disabled):not(:disabled):active,
+.has-bg-blue.active {
+    background: #0e80d2 !important;
+    color: rgba(255, 255, 255, 0.6) !important;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    box-shadow: 0 2px 6px #71b6f7;
+}
+
+.has-bg-red {
+    border: 0;
+    background-color: #e64340;
+    color: #fff;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    box-shadow: 0 2px 6px #ffa299;
+}
+
+.has-bg-red:not(.disabled):not(:disabled):active,
+.has-bg-red.active {
+    background: #ce3c39 !important;
+    color: rgba(255, 255, 255, 0.6) !important;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    box-shadow: 0 2px 6px #ffa299;
+}
+
+/* 列表 */
+.s-list-title {
+    margin-bottom: -24 rpx;
+    padding-left: 30 rpx;
+    padding-right: 30 rpx;
+    color: #888888;
+    font-size: 28 rpx;
+    margin-top: 30 rpx;
+}
+
+.s-list {
+    margin-top: 40 rpx;
+    background-color: #fff;
+    line-height: 1.47058824;
+    font-size: 32 rpx;
+    overflow: hidden;
+    position: relative;
+}
+
+.s-list:before {
+    top: 0;
+    border-top: 1px solid #dcdee2;
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+}
+
+.s-list:after,
+.s-list:before {
+    content: " ";
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 1px;
+    color: #dcdee2;
+    z-index: 2;
+}
+
+.s-list:after {
+    bottom: 0;
+    border-bottom: 1px solid #dcdee2;
+    -webkit-transform-origin: 0 100%;
+    transform-origin: 0 100%;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+}
+
+.is-item-line {
+    padding: 20 rpx 30 rpx;
+    position: relative;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-box-align: center;
+    -webkit-align-items: center;
+    align-items: center;
+    text-decoration: none;
+    color: #353535;
+    -webkit-tap-highlight-color: transparent;
+}
+
+.is-item-line:before {
+    content: " ";
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    height: 1px;
+    border-top: 1px solid #dcdee2;
+    color: #dcdee2;
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+    z-index: 2;
+}
+
+.is-item,
+.is-item-line {
+    padding: 20 rpx 30 rpx;
+    position: relative;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-box-align: center;
+    -webkit-align-items: center;
+    align-items: center;
+    text-decoration: none;
+    color: #353535;
+    -webkit-tap-highlight-color: transparent;
+}
+
+.is-item.has-right-icon .is-item-ft,
+.is-item-line.has-right-icon .is-item-ft {
+    padding-right: 26 rpx;
+    position: relative;
+}
+
+.is-item.has-right-icon .is-item-ft:after,
+.is-item-line.has-right-icon .is-item-ft:after {
+    content: " ";
+    display: inline-block;
+    height: 12 rpx;
+    width: 12 rpx;
+    border-width: 4 rpx 4 rpx 0 0;
+    border-color: #c8c8cd;
+    border-style: solid;
+    -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+    position: relative;
+    top: -4 rpx;
+    position: absolute;
+    top: 50%;
+    margin-top: -8 rpx;
+    right: 4 rpx;
+}
+
+.is-item:before {
+    content: " ";
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    height: 1px;
+    border-top: 1px solid #dcdee2;
+    color: #dcdee2;
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+    left: 30 rpx;
+    z-index: 2;
+}
+
+.is-item:first-child:before,
+.is-item-line:first-child:before {
+    display: none !important;
+}
+
+.is-item-bd {
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    flex: 1;
+}
+
+.is-item-ft {
+    text-align: right;
+    font-size: 28 rpx;
+    color: #888888;
+}
+
+.is-bd-subline {
+    font-size: 28 rpx;
+    color: #888888;
+}
+
+.s-list2-title {
+    padding-left: 30 rpx;
+    padding-right: 30 rpx;
+    color: #888888;
+    font-size: 28 rpx;
+    margin-top: 30 rpx;
+    margin-bottom: 18 rpx;
+}
+
+.s-list2 {
+    background-color: #fff;
+    width: 100%;
+}
+
+.is-item2 {
+    position: relative;
+    padding-left: 24 rpx;
+    display: flex;
+}
+
+.is-list2-info {
+    flex: 1;
+    padding-top: 16 rpx;
+    padding-bottom: 16 rpx;
+    display: flex;
+    flex-direction: column;
+    padding-right: 24 rpx;
+}
+
+.is-list2-link .has-list2-tip {
+    padding-right: 50 rpx;
+}
+
+.is-list2-img {
+    margin: 16 rpx 24 rpx 16 rpx 0 rpx;
+}
+
+.is-item2.is-list2-link:after {
+    content: " ";
+    display: inline-block;
+    height: 16 rpx;
+    width: 16 rpx;
+    border-width: 4 rpx 4 rpx 0 0;
+    border-color: #c8c8cd;
+    border-style: solid;
+    -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+    position: relative;
+    top: -4 rpx;
+    position: absolute;
+    top: 50%;
+    margin-top: -14 rpx;
+    right: 24 rpx;
+}
+
+.s-list2 .is-item2:first-child .has-bordert:before {
+    border: none;
+}
+
+.has-list2-tip {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+
+.is-list2-tip {
+    color: #888888;
+    font-size: 28 rpx;
+}
+
+
+.s-divide {
+    height: 1px;
+    text-align: center;
+}
+
+.s-divide .is-divide-otext {
+    position: relative;
+    top: -24 rpx;
+    padding: 0 40 rpx;
+}
+
+/* 顶部 底部菜单 */
+
+.flex-sub {
+    flex: 1;
+}
+
+.simple-bar {
+    display: flex;
+    position: relative;
+    align-items: center;
+    background: #fff;
+    height: 100 rpx;
+    justify-content: space-between;
+}
+
+.simple-bar .action {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    justify-content: center;
+    max-width: 100%;
+}
+
+.simple-bar .action:first-child {
+    margin-left: 30 rpx;
+    font-size: 30 rpx;
+}
+
+.simple-bar .action text.text-cut {
+    text-align: left;
+    width: 100%;
+}
+
+.simple-bar .avatar:first-child {
+    margin-left: 20 rpx;
+}
+
+.simple-bar .action:first-child > text[class*='icon'] {
+    margin-left: -0.3em;
+    margin-right: 0.3em;
+}
+
+.simple-bar .action:last-child {
+    margin-right: 30 rpx;
+}
+
+.simple-bar .action > text[class*='icon'] {
+    font-size: 36 rpx;
+}
+
+.simple-bar .action > text[class*='icon'] + text[class*='icon'] {
+    margin-left: 0.5em;
+}
+
+.simple-bar .content {
+    position: absolute;
+    text-align: center;
+    width: 400 rpx;
+    left: 0;
+    right: 0;
+    bottom: 16 rpx;
+    margin: auto;
+    height: 60 rpx;
+    font-size: 36 rpx;
+    line-height: 60 rpx;
+    cursor: none;
+    pointer-events: none;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+.simple-bar.btn-group {
+    justify-content: space-around;
+}
+
+.simple-bar.btn-group button {
+    padding: 20 rpx 32 rpx;
+}
+
+.simple-bar.btn-group button {
+    flex: 1;
+    margin: 0 20 rpx;
+    max-width: 50%;
+}
+
+.modal-box {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1110;
+    opacity: 0;
+    outline: 0;
+    text-align: center;
+    -ms-transform: scale(1.185);
+    transform: scale(1.185);
+    backface-visibility: hidden;
+    perspective: 2000 rpx;
+    background: rgba(0, 0, 0, 0.6);
+    transition: all 0.6s ease-in-out 0;
+    pointer-events: none;
+}
+
+.modal-box::before {
+    content: '\200B';
+    display: inline-block;
+    height: 100%;
+    vertical-align: middle;
+}
+
+.modal-box.show {
+    opacity: 1;
+    transition-duration: 0.3s;
+    -ms-transform: scale(1);
+    transform: scale(1);
+    overflow-x: hidden;
+    overflow-y: auto;
+    pointer-events: auto;
+}
+
+.dialog {
+    position: relative;
+    display: inline-block;
+    vertical-align: middle;
+    margin-left: auto;
+    margin-right: auto;
+    width: 680 rpx;
+    max-width: 100%;
+    background: #ffffff;
+    border-radius: 16rpx;
+}
+
+.modal-box.bottom-modal::before {
+    vertical-align: bottom;
+}
+
+.modal-box.bottom-modal .dialog {
+    width: 100%;
+    border-radius: 0;
+}
+
+.modal-box.bottom-modal {
+    margin-bottom: -1000 rpx;
+}
+
+.modal-box.bottom-modal.show {
+    margin-bottom: 0;
+}
+
+.bg-img {
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+}
+
+.shadow-blur {
+    position: relative;
+}
+
+.shadow-blur::before {
+    content: "";
+    display: block;
+    background: inherit;
+    filter: blur(10 rpx);
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 10 rpx;
+    left: 10 rpx;
+    z-index: -1;
+    opacity: 0.4;
+    transform-origin: 0 0;
+    border-radius: inherit;
+    transform: scale(1, 1);
+}
+
+
+swiper.square-dot .wx-swiper-dot {
+    background: #fff;
+    opacity: 0.4;
+    width: 10 rpx !important;
+    height: 10 rpx !important;
+    border-radius: 20 rpx !important;
+    transition: all 0.3s ease-in-out 0s !important;
+}
+
+swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active {
+    opacity: 1;
+    width: 30 rpx !important;
+}
+
+swiper.round-dot .wx-swiper-dot {
+    /* background: #39b54a; */
+    width: 10 rpx !important;
+    height: 10 rpx !important;
+    top: -4 rpx !important;
+    transition: all 0.3s ease-in-out 0s !important;
+    position: relative;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after {
+    content: "";
+    position: absolute;
+    width: 10 rpx;
+    height: 10 rpx;
+    top: 0 rpx;
+    left: 0 rpx;
+    right: 0;
+    bottom: 0;
+    margin: auto;
+    background: #fff;
+    border-radius: 20 rpx;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active {
+    width: 18 rpx !important;
+    height: 18 rpx !important;
+    top: 0 rpx !important;
+}
+
+.screen-swiper {
+    min-height: 375 rpx;
+}
+
+.screen-swiper image {
+    width: 100%;
+    display: block;
+    height: 100%;
+    margin: 0;
+}
+
+.simple-card-swiper {
+    height: 420 rpx;
+}
+
+.simple-card-swiper swiper-item {
+    width: 610 rpx !important;
+    left: 70 rpx !important;
+    box-sizing: border-box;
+    padding: 40 rpx 0 rpx 70 rpx;
+    overflow: initial !important;
+}
+
+.simple-card-swiper swiper-item .bg-img {
+    width: 100%;
+    display: block;
+    height: 100%;
+    border-radius: 10 rpx;
+    transform: scale(0.9);
+    transition: all 0.2s ease-in 0s;
+}
+
+.simple-card-swiper swiper-item.cur .bg-img {
+    transform: none;
+    transition: all 0.2s ease-in 0s;
+}
+
+.tower-swiper {
+    height: 420 rpx;
+    position: relative;
+}
+
+.tower-swiper .tower-item {
+    position: absolute;
+    width: 300 rpx;
+    height: 380 rpx;
+    top: 0;
+    bottom: 0;
+    left: 50%;
+    margin: auto;
+    transition: all 0.3s ease-in 0s;
+    opacity: 1;
+}
+
+.tower-swiper .tower-item.none {
+    opacity: 0;
+}
+
+.tower-swiper .tower-item .bg-img {
+    width: 100%;
+    height: 100%;
+    border-radius: 6 rpx;
+}
+
+
+.simple-load {
+    display: block;
+    line-height: 3em;
+    text-align: center;
+}
+
+.simple-load::before {
+    font-family: "simplepro" !important;
+    display: inline-block;
+    margin-right: 6 rpx;
+}
+
+.simple-load.loading::before {
+    content: "\e67a";
+    animation: icon-spin 2s infinite linear;
+}
+
+.simple-load.loading::after {
+    content: "加载中...";
+}
+
+.simple-load.over::before {
+    content: "\e64a";
+}
+
+.simple-load.over::after {
+    content: "没有更多了";
+}
+
+.simple-load.erro::before {
+    content: "\e658";
+}
+
+.simple-load.erro::after {
+    content: "加载失败";
+}
+
+.simple-load.load-icon::before {
+    font-size: 32 rpx;
+}
+
+.simple-load.load-icon::after {
+    display: none;
+}
+
+.simple-load.load-icon.over {
+    display: none;
+}
+
+.simple-load.load-modal {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 140 rpx;
+    left: 0;
+    margin: auto;
+    width: 260 rpx;
+    height: 260 rpx;
+    background: #fff;
+    border-radius: 10 rpx;
+    box-shadow: 0 0 0 rpx 2000 rpx rgba(0, 0, 0, 0.5);
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    font-size: 28 rpx;
+    z-index: 999999;
+    line-height: 2.4em;
+
+}
+
+.simple-load.load-modal [class*="icon"] {
+    font-size: 60 rpx;
+}
+
+.simple-load.load-modal image {
+    width: 70 rpx;
+    height: 70 rpx;
+}
+
+.simple-load.load-modal::after {
+    content: "";
+    position: absolute;
+    background: #fff;
+    border-radius: 50%;
+    width: 200 rpx;
+    height: 200 rpx;
+    font-size: 10px;
+    border-top: 6 rpx solid rgba(0, 0, 0, 0.05);
+    border-right: 6 rpx solid rgba(0, 0, 0, 0.05);
+    border-bottom: 6 rpx solid rgba(0, 0, 0, 0.05);
+    border-left: 6 rpx solid #f37b1d;
+    animation: icon-spin 1s infinite linear;
+    z-index: -1;
+}
+
+.load-progress {
+    pointer-events: none;
+    top: 0;
+    position: fixed;
+    width: 100%;
+    left: 0;
+    z-index: 2000;
+}
+
+.load-progress.hide {
+    display: none;
+}
+
+.load-progress .load-progress-bar {
+    position: relative;
+    width: 100%;
+    height: 4 rpx;
+    overflow: hidden;
+    transition: all 200ms ease 0s;
+}
+
+
+.load-progress .load-progress-spinner {
+    position: absolute;
+    top: 10 rpx;
+    right: 10 rpx;
+    z-index: 2000;
+    display: block;
+}
+
+.load-progress .load-progress-spinner::after {
+    content: "";
+    display: block;
+    width: 24 rpx;
+    height: 24 rpx;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    border: solid 4 rpx transparent;
+    border-top-color: inherit;
+    border-left-color: inherit;
+    border-radius: 50%;
+    -webkit-animation: load-progress-spinner 0.4s linear infinite;
+    animation: load-progress-spinner 0.4s linear infinite;
+}
+
+@-webkit-keyframes load-progress-spinner {
+    0% {
+        -webkit-transform: rotate(0);
+        transform: rotate(0);
+    }
+
+    100% {
+        -webkit-transform: rotate(360deg);
+        transform: rotate(360deg);
+    }
+}
+
+@keyframes load-progress-spinner {
+    0% {
+        -webkit-transform: rotate(0);
+        transform: rotate(0);
+    }
+
+    100% {
+        -webkit-transform: rotate(360deg);
+        transform: rotate(360deg);
+    }
+}
+
+
+.cu-list.menu {
+    display: block;
+    overflow: hidden;
+}
+
+.cu-list + .cu-list {
+    margin-top: 30 rpx;
+}
+
+.cu-list.menu > .cu-item {
+    position: relative;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    min-height: 100 rpx;
+    background: #fff;
+    padding: 0 30 rpx;
+}
+
+
+.cu-list.menu > .cu-item::after {
+    content: " ";
+    width: 200%;
+    height: 200%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border-radius: inherit;
+    transform: scale(0.5);
+    transform-origin: 0 0;
+    pointer-events: none;
+    box-sizing: border-box;
+    border-bottom: 1 rpx solid #ddd;
+}
+
+.cu-list.menu.sm-border > .cu-item::after {
+    width: calc(200% - 120rpx);
+    left: 30 rpx;
+}
+
+.cu-list.menu > .cu-item:last-child::after {
+    border: none;
+}
+
+.cu-list.menu > .cu-item.cur {
+    background-color: #fcf7e9;
+}
+
+.cu-list.menu-avatar > .cu-item {
+    padding-left: 140 rpx;
+}
+
+.cu-list.menu-avatar > .cu-item .cu-avatar {
+    left: 30 rpx;
+}
+
+.cu-list.menu > .cu-item .content {
+    line-height: 1.6em;
+    flex: 1;
+    font-size: 30 rpx;
+}
+
+.cu-list.menu > .cu-item button.content {
+    padding: 0;
+    justify-content: flex-start;
+    background-color: transparent;
+}
+
+.cu-list.menu > .cu-item button.content::after {
+    display: none;
+}
+
+.cu-list.menu > .cu-item .content > text[class*="icon"] {
+    margin-right: 10 rpx;
+    display: inline-block;
+    width: 1.6em;
+    text-align: center;
+}
+
+.cu-list.menu > .cu-item .content > image {
+    margin-right: 10 rpx;
+    display: inline-block;
+    width: 1.6em;
+    height: 1.6em;
+    vertical-align: middle;
+}
+
+.cu-list.menu-avatar > .cu-item .action {
+    text-align: center;
+}
+
+.cu-list.menu-avatar > .cu-item .action view + view {
+    margin-top: 10 rpx;
+}
+
+.cu-list.menu > .cu-item .action .cu-tag:empty {
+    right: 10 rpx;
+}
+
+.cu-list.menu > .cu-item.arrow {
+    padding-right: 90 rpx;
+}
+
+.cu-list.menu > .cu-item.arrow::before {
+    font-family: "simplepro" !important;
+    display: block;
+    content: "\e6a3";
+    position: absolute;
+    font-size: 34 rpx;
+    color: #aaa;
+    line-height: 30 rpx;
+    height: 30 rpx;
+    width: 30 rpx;
+    text-align: center;
+    top: 0 rpx;
+    bottom: 0;
+    right: 30 rpx;
+    margin: auto;
+}
+
+.cu-list.menu > .cu-item .cu-avatar-group .cu-avatar {
+    border-color: #fff;
+}
+
+.cu-list.card-menu {
+    margin-left: 30 rpx;
+    margin-right: 30 rpx;
+    border-radius: 20 rpx;
+    overflow: hidden;
+}
+
+.cu-list.menu-avatar > .cu-item {
+    padding-left: 140 rpx;
+    height: 140 rpx;
+}
+
+.cu-list.menu-avatar > .cu-item > .cu-avatar {
+    position: absolute;
+    left: 30 rpx;
+}
+
+.cu-list.menu-avatar.comment > .cu-item {
+    height: auto;
+    padding-top: 30 rpx;
+    padding-bottom: 30 rpx;
+    padding-left: 120 rpx;
+}
+
+.cu-list.menu-avatar.comment .cu-avatar {
+    align-self: flex-start;
+}
+
+.cu-list.menu > .cu-item .content .cu-tag.sm {
+    font-size: 16 rpx;
+    line-height: 80%;
+    padding: 8 rpx 6 rpx 4 rpx;
+    margin-top: -6 rpx;
+}
+
+.cu-list.grid {
+    text-align: center;
+    background: #fff;
+}
+
+.cu-list.grid > .cu-item {
+    display: flex;
+    flex-direction: column;
+    padding: 20 rpx 0 30 rpx;
+    position: relative;
+    transition-duration: 0s;
+}
+
+.cu-list.grid > .cu-item [class*="icon"] {
+    display: block;
+    width: 100%;
+    position: relative;
+    font-size: 48 rpx;
+    margin-top: 20 rpx;
+}
+
+.cu-list.grid > .cu-item text {
+    display: block;
+    color: #888;
+    margin-top: 10 rpx;
+    line-height: 40 rpx;
+    font-size: 26 rpx;
+}
+
+.cu-list.grid > .cu-item .cu-tag {
+    left: 50%;
+    right: auto;
+    margin-left: 20 rpx;
+}
+
+.cu-list.grid > .cu-item::after {
+    content: " ";
+    width: 200%;
+    height: 200%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border-radius: inherit;
+    transform: scale(0.5);
+    transform-origin: 0 0;
+    pointer-events: none;
+    box-sizing: border-box;
+    border-right: 1px solid rgba(0, 0, 0, 0.1);
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.cu-list.grid.col-3 > .cu-item:nth-child(3n)::after {
+    border-right-width: 0px;
+}
+
+.cu-list.grid.col-4 > .cu-item:nth-child(4n)::after {
+    border-right-width: 0px;
+}
+
+.cu-list.grid.col-5 > .cu-item:nth-child(5n)::after {
+    border-right-width: 0px;
+}
+
+.cu-list.grid.no-border {
+    padding: 20 rpx 10 rpx;
+}
+
+.cu-list.grid.no-border > .cu-item {
+    padding-top: 10 rpx;
+    padding-bottom: 20 rpx;
+}
+
+.cu-list.grid.no-border > .cu-item::after {
+    border: none !important;
+}
+
+.cu-list > .cu-item {
+    transform: translateX(0 rpx);
+    transition: all 0.6s ease-in-out 0s;
+}
+
+.cu-list > .cu-item .move {
+    display: flex;
+    width: 260 rpx;
+    height: 100%;
+    position: absolute;
+    right: 0;
+    transform: translateX(100%);
+}
+
+.cu-list > .cu-item.move-cur {
+    transform: translateX(-260 rpx);
+}
+
+.cu-list > .cu-item .move view {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}