diff --git a/src/api/account/shopUser.ts b/src/api/account/shopUser.ts
index b457827..25faf3c 100644
--- a/src/api/account/shopUser.ts
+++ b/src/api/account/shopUser.ts
@@ -63,6 +63,14 @@ const API = {
       method: "get",
       params
     });
+  },
+  //获取店铺用户详情
+  vipInfo(params: getRequest) {
+    return request({
+      url: `${baseURL}/detail`,
+      method: "get",
+      params
+    });
   }
 }
 export default API;
diff --git a/src/views/marketing_center/coupon_exchange_code/components/record.vue b/src/views/marketing_center/coupon_exchange_code/components/record.vue
index cbe613b..6a2de84 100644
--- a/src/views/marketing_center/coupon_exchange_code/components/record.vue
+++ b/src/views/marketing_center/coupon_exchange_code/components/record.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-dialog title="充值兑换码" top="5vh" width="800px" v-model="visible" @closed="closedHandle">
+    <el-dialog title="券兑换码" top="5vh" width="800px" v-model="visible" @closed="closedHandle">
       <el-form label-width="80px" label-position="right">
         <el-form-item label="名称">
           {{ form.name }}
@@ -15,7 +15,7 @@
           {{ form.stock }}
         </el-form-item>
         <el-form-item label="优惠券">
-          {{form.couponInfoList.map(item => item.title).join('、')}}
+          {{form.couponInfoList.map(item => `${item.title}x${item.num}`).join('、')}}
         </el-form-item>
         <el-form-item v-if="shopInfo.isHeadShop == 1 || shopInfo.shopType == 'only'">
           <el-button type="primary" @click="addRef.show({ ...form })">编辑</el-button>
@@ -37,9 +37,16 @@
           </el-form-item>
         </el-form>
       </div>
-      <div class="row mt14">
+      <div class="row">
         <el-table :data="tableData.list" border stripe v-loading="tableData.loading" height="300px">
-          <el-table-column label="兑换码" prop="code" />
+          <el-table-column label="兑换码" prop="code">
+            <template #default="scope">
+              <div class="center" @click="copyHandle(scope.row.code)">
+                <el-text>{{ scope.row.code }}</el-text>
+                <el-link type="primary">复制</el-link>
+              </div>
+            </template>
+          </el-table-column>
           <el-table-column label="状态" prop="status" width="100">
             <template #default="scope">
               <el-tag disable-transitions :type="statusList.find(item => item.value === scope.row.status).type">
@@ -48,7 +55,14 @@
             </template>
           </el-table-column>
           <el-table-column label="兑换时间" prop="redemptionTime" />
-          <el-table-column label="兑换用户" prop="nickName" />
+          <el-table-column label="兑换用户" prop="nickName">
+            <template #default="scope">
+              <div class="column">
+                <span>{{ scope.row.nickName }}</span>
+                <span>{{ scope.row.phone }}</span>
+              </div>
+            </template>
+          </el-table-column>
         </el-table>
       </div>
       <div class="row mt14">
@@ -66,6 +80,9 @@ import { ref } from "vue";
 import add from "./add.vue";
 import { couponRedemptionCodeList, couponRedemptionDetail, couponRedemptionCodeExport } from "@/api/coupon/index.js";
 import { downloadFile } from "@/utils/index";
+import { ElNotification } from 'element-plus'
+import useClipboard from "vue-clipboard3";
+const { toClipboard } = useClipboard();
 
 const emit = defineEmits(['update']);
 const addRef = ref(null);
@@ -96,6 +113,21 @@ const resetForm = () => {
   };
 };
 
+// 复制
+async function copyHandle(text) {
+  try {
+    await toClipboard(text);
+    ElNotification({
+      title: "成功",
+      message: `复制成功`,
+      type: "success",
+    });
+    console.log("Copied to clipboard");
+  } catch (e) {
+    console.error(e);
+  }
+}
+
 // 关闭
 function closedHandle() {
   resetForm();
@@ -223,4 +255,15 @@ defineExpose({
     margin-top: 14px;
   }
 }
+
+.center {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.column {
+  display: flex;
+  flex-direction: column;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/marketing_center/discount_limit/components/add.vue b/src/views/marketing_center/discount_limit/components/add.vue
index 1de1864..da0c30b 100644
--- a/src/views/marketing_center/discount_limit/components/add.vue
+++ b/src/views/marketing_center/discount_limit/components/add.vue
@@ -75,13 +75,13 @@
             <el-radio label="优先使用会员价/会员折扣" value="vip-price"></el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="参与商品" prop="goodsType">
+        <el-form-item label="参与商品">
           <el-radio-group v-model="form.foodType" @change="goodRadioChnage">
             <el-radio label="全部商品可用" :value="1"></el-radio>
             <el-radio label="部分商品可用" :value="2"></el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item v-if="form.foodType == 2">
+        <el-form-item v-if="form.foodType == 2" prop="goodsType">
           <el-cascader v-model="goodsTypeCascaderValue" :options="goodsList" :props="cascaderProps"
             :show-all-levels="false" :max-collapse-tags="3" collapse-tags clearable style="width: 300px"
             @change="selectFoodsConfirm"></el-cascader>
@@ -215,7 +215,7 @@ const useShopTypeValidate = (rule, value, callback) => {
 
 // 自定义校验参与商品（用于模板中 goodsType 判断）
 const goodsTypeValidate = (rule, value, callback) => {
-  if (goodsType.value == 2 && form.value.foods === "") {
+  if (form.value.foodType == 2 && form.value.foods === "") {
     callback(new Error("请选择商品"));
   } else {
     callback();
@@ -266,7 +266,7 @@ const formRules = reactive({
       },
       trigger: "change",
     },
-  ],
+  ]
 });
 
 // 开始提交
@@ -278,7 +278,11 @@ function submitHandle() {
       if (valid) {
         loading.value = true;
         const data = { ...form.value };
-        data.shopId = shopInfo.value.shopId;
+        if (form.value.id) {
+          data.shopId = form.value.shopId;
+        } else {
+          data.shopId = shopInfo.value.shopId;
+        }
         data.useDays = form.value.useDays.join(",");
         data.useType = form.value.useType.join(",");
         await limitTimeDiscount(data, form.value.id ? "put" : "post");
@@ -315,7 +319,7 @@ async function getBranchPageAjax() {
 
 // 获取商品列表
 const goodsList = ref([]);
-async function getProductListAjax() {
+async function getProductListAjax(shopId) {
   try {
     const categorys = await getCategoryList();
     const products = await getProductList();
@@ -365,6 +369,8 @@ function show(obj = null) {
   });
 
   if (obj && obj.id) {
+    getProductListAjax(form.value.shopId);
+
     form.value = { ...obj };
 
     form.value.useDays = form.value.useDays.split(",");
@@ -403,6 +409,7 @@ function show(obj = null) {
       console.log(useTimeScope.value);
     }
   } else {
+    getProductListAjax(shopInfo.value.shopId);
     reset();
   }
   dialogVisible.value = true;
@@ -468,7 +475,6 @@ onMounted(() => {
   resetForm.value = { ...form.value };
   getLocalShopInfo();
   getBranchPageAjax();
-  getProductListAjax();
 });
 </script>
 
diff --git a/src/views/marketing_center/order_recommendation/index.vue b/src/views/marketing_center/order_recommendation/index.vue
index 563c679..dd70611 100644
--- a/src/views/marketing_center/order_recommendation/index.vue
+++ b/src/views/marketing_center/order_recommendation/index.vue
@@ -8,7 +8,7 @@
       <div class="row mt14">
         <div class="center">
           <el-button type="primary" @click="addRef.show()">添加</el-button>
-          <el-button type="primary" plain @click="visible = true">首次弹窗触发事件</el-button>
+          <el-button type="primary" plain :loading="showDialogLoading" @click="showDialogHandle">首次弹窗触发事件</el-button>
           <span class="tips">多个弹窗时，每个弹窗之间关闭和弹出间隔为30秒</span>
         </div>
       </div>
@@ -23,13 +23,13 @@
               <div v-else>{{ scope.row.useStartTime }} - {{ scope.row.useEndTime }}</div>
             </template>
           </el-table-column>
-          <el-table-column label="启用状态" prop="status">
+          <el-table-column label="启用状态" prop="status" width="150">
             <template #default="scope">
               <el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0"
                 @change="statusChange($event, scope.row)" />
             </template>
           </el-table-column>
-          <el-table-column label="操作">
+          <el-table-column label="操作" width="120" fixed="right">
             <template #default="scope">
               <el-button link type="primary" @click="addRef.show(scope.row)">编辑</el-button>
               <el-popconfirm title="确认要删除吗？" @confirm="deleteHandle(scope.row)">
@@ -140,6 +140,15 @@ async function shopInfoGetAjax() {
   }
 }
 
+// 限时弹窗
+const showDialogLoading = ref(false)
+async function showDialogHandle() {
+  showDialogLoading.value = true
+  await shopInfoGetAjax()
+  showDialogLoading.value = false
+  visible.value = true
+}
+
 const visible = ref(false)
 const confirmLoading = ref(false)
 const formRef = ref(null)
diff --git a/src/views/marketing_center/recharge_exchange/components/record.vue b/src/views/marketing_center/recharge_exchange/components/record.vue
index b03a54b..52c47ee 100644
--- a/src/views/marketing_center/recharge_exchange/components/record.vue
+++ b/src/views/marketing_center/recharge_exchange/components/record.vue
@@ -39,7 +39,14 @@
       </div>
       <div class="row mt14">
         <el-table :data="tableData.list" border stripe v-loading="tableData.loading" height="300px">
-          <el-table-column label="兑换码" prop="code" />
+          <el-table-column label="兑换码" prop="code">
+            <template #default="scope">
+              <div class="center" @click="copyHandle(scope.row.code)">
+                <el-text>{{ scope.row.code }}</el-text>
+                <el-link type="primary">复制</el-link>
+              </div>
+            </template>
+          </el-table-column>
           <el-table-column label="状态" prop="status" width="100">
             <template #default="scope">
               <el-tag disable-transitions :type="statusList.find(item => item.value === scope.row.status).type">
@@ -48,7 +55,14 @@
             </template>
           </el-table-column>
           <el-table-column label="兑换时间" prop="redemptionTime" />
-          <el-table-column label="兑换用户" prop="nickName" />
+          <el-table-column label="兑换用户" prop="nickName">
+            <template #default="scope">
+              <div class="column">
+                <span>{{ scope.row.nickName }}</span>
+                <span>{{ scope.row.phone }}</span>
+              </div>
+            </template>
+          </el-table-column>
         </el-table>
       </div>
       <div class="row mt14">
@@ -66,6 +80,8 @@ import { ref } from "vue";
 import add from "./add.vue";
 import { rechargeRedemptionCodeList, rechargeRedemptionDetail, rechargeRedemptionExport } from "@/api/coupon/index.js";
 import { downloadFile } from "@/utils/index";
+import useClipboard from "vue-clipboard3";
+const { toClipboard } = useClipboard();
 
 const emit = defineEmits(['update']);
 const addRef = ref(null);
@@ -94,6 +110,21 @@ const resetForm = () => {
   };
 };
 
+// 复制
+async function copyHandle(text) {
+  try {
+    await toClipboard(text);
+    ElNotification({
+      title: "成功",
+      message: `复制成功`,
+      type: "success",
+    });
+    console.log("Copied to clipboard");
+  } catch (e) {
+    console.error(e);
+  }
+}
+
 // 关闭
 function closedHandle() {
   resetForm();
@@ -220,4 +251,15 @@ defineExpose({
     margin-top: 14px;
   }
 }
+
+.center {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.column {
+  display: flex;
+  flex-direction: column;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/user/list/components/user-coupon-dialog.vue b/src/views/user/list/components/user-coupon-dialog.vue
index 421197e..08380b8 100644
--- a/src/views/user/list/components/user-coupon-dialog.vue
+++ b/src/views/user/list/components/user-coupon-dialog.vue
@@ -1,72 +1,53 @@
 <template>
 	<div>
-		<el-dialog title="优惠券" v-model="visible" width="80%">
+		<el-dialog title="优惠券" v-model="visible" width="1200px">
 			<el-form :inline="true" :model="form">
 				<el-form-item label="券名称">
 					<el-input v-model="form.name" placeholder="请输入券名称"></el-input>
 				</el-form-item>
-
 				<el-form-item label="状态">
 					<el-select v-model="form.status" placeholder="请选择" style="width: 140px">
-						<el-option
-							v-for="item in status"
-							:key="item.value"
-							:label="item.label"
-							:value="item.value"
-						/>
+						<el-option v-for="item in status" :key="item.value" :label="item.label" :value="item.value" />
 					</el-select>
 				</el-form-item>
 				<el-form-item label="领取时间">
-					<el-date-picker
-						v-model="form.date"
-						type="daterange"
-						value-format="yyyy-MM-dd"
-						range-separator="至"
-						start-placeholder="开始日期"
-						end-placeholder="结束日期"
-					/>
+					<el-date-picker v-model="form.date" type="daterange" value-format="yyyy-MM-dd" range-separator="至"
+						start-placeholder="开始日期" end-placeholder="结束日期" />
 				</el-form-item>
 				<el-form-item>
-					<el-button type="primary" @click="handleSearch">搜索</el-button>
+					<el-button type="primary" @click="handleSearch" :loading="loading">搜索</el-button>
 				</el-form-item>
 			</el-form>
-
-			<el-table
-				style="width: 100%"
-				:data="tableData"
-				:columns="columns"
-				:pagination="pagination"
-				:row-key="getRowKey"
-			>
-				<el-table-column prop="id" label="券ID" />
-				<el-table-column prop="name" label="券名称" />
+			<el-table style="width: 100%" :data="tableData" stripe border v-loading="loading">
+				<el-table-column prop="id" label="券ID" width="80" />
+				<el-table-column prop="name" label="券名称" width="250" />
 				<!-- <el-table-column prop="type" label="券类型" /> -->
-				<el-table-column prop="createTime" label="领取时间" />
-				<el-table-column prop="useTime" label="使用时间" />
-				<el-table-column prop="source" label="领取来源" />
-				<el-table-column label="操作">
+				<el-table-column prop="createTime" label="领取时间" width="250" />
+				<el-table-column prop="useTime" label="使用时间" width="250" />
+				<el-table-column prop="source" label="领取来源" width="150" />
+				<el-table-column prop="status" label="状态">
 					<template #default="scope">
-						<el-link :underline="false" type="primary" size="mini">查看</el-link>
-						<el-link
-							:underline="false"
-							type="danger"
-							class="ml-4"
-							@click="deleteCoupon(scope.row)"
-							size="mini"
-						>
-							删除
-						</el-link>
+						<el-tag disable-transitions :type="status.find(item => item.value === scope.row.status).type">
+							{{status.find(item => item.value === scope.row.status).label}}
+						</el-tag>
+					</template>
+				</el-table-column>
+				<el-table-column label="操作" width="80" fixed="right">
+					<template #default="scope">
+						<!-- <el-button link type="primary" @click="">查看</el-button> -->
+						<el-popconfirm title="确认要失效吗？" @confirm="deleteCoupon(scope.row)">
+							<template #reference>
+								<el-button type="danger" link icon="EditPen">失效</el-button>
+							</template>
+						</el-popconfirm>
 					</template>
 				</el-table-column>
 			</el-table>
-			<el-pagination
-				v-model:current-page="pagination.page"
-				v-model:page-size="pagination.size"
-				:total="pagination.total"
-				layout="total, sizes, prev, pager, next, jumper"
-				@current-change="getList"
-				@size-change="getList"
-			/>
+			<div style="margin-top: 14px;display: flex;justify-content: flex-end;">
+				<el-pagination v-model:current-page="pagination.page" v-model:page-size="pagination.size"
+					:total="pagination.total" layout="total, sizes, prev, pager, next, jumper" @current-change="getList"
+					@size-change="getList" />
+			</div>
 		</el-dialog>
 	</div>
 </template>
@@ -75,12 +56,12 @@
 import couponApi from "@/api/market/coupon";
 
 import { ref, reactive } from "vue";
-const status = [
-	{ label: "全部", value: "" },
-	{ label: "未使用", value: 0 },
-	{ label: "已使用", value: 1 },
-	{ label: "已过期", value: 2 },
-];
+const status = reactive([
+	{ label: "全部", value: "", type: 'info' },
+	{ label: "未使用", value: 0, type: 'warning' },
+	{ label: "已使用", value: 1, type: 'info' },
+	{ label: "已过期", value: 2, type: 'info' },
+]);
 const visible = ref(false);
 const form = reactive({
 	status: 0,
@@ -105,12 +86,24 @@ function open(data) {
 function close() {
 	visible.value = false;
 }
-function getList() {
-	couponApi.getRecordByUser({ ...form, ...pagination }).then((res) => {
-		console.log(res);
+
+function handleSearch() {
+	getList()
+}
+
+const loading = ref(false)
+async function getList() {
+	try {
+		loading.value = true
+		const res = await couponApi.getRecordByUser({ ...form, ...pagination })
 		tableData.value = res.records;
 		pagination.total = res.totalRow;
-	});
+	} catch (error) {
+		console.log(error);
+	}
+	setTimeout(() => {
+		loading.value = false
+	}, 300);
 }
 
 function deleteCoupon(row) {
diff --git a/src/views/user/list/config/content.ts b/src/views/user/list/config/content.ts
index 73b5f4b..b990658 100644
--- a/src/views/user/list/config/content.ts
+++ b/src/views/user/list/config/content.ts
@@ -104,9 +104,11 @@ const contentConfig: IContentConfig<any> = {
           name: "more",
           text: "更多",
           options: [
+            // { label: '增减积分', command: 'change-points' },
             { label: '增减余额', command: 'change-money' },
             { label: '充值记录', command: 'charge-list' },
             { label: '赠送券', command: 'give-coupon' },
+            { label: '账号禁用/开启', command: 'user-disabld' },
           ]
         },
       ],
diff --git a/src/views/user/list/index.vue b/src/views/user/list/index.vue
index 259c02e..b8b13f7 100644
--- a/src/views/user/list/index.vue
+++ b/src/views/user/list/index.vue
@@ -32,15 +32,19 @@
 			@edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
 			@toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange">
 			<template #status="scope">
-				<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
+				<el-link :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
 					{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
-				</el-tag>
+				</el-link>
 			</template>
 			<template #options="scope">
 				{{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }}
 			</template>
 			<template #bol="scope">
-				{{ scope.row[scope.prop] ? "是" : "否" }}
+				<el-tag disable-transitions type="primary" v-if="scope.row.isVip" @click="showVipInfoHandle(scope.row)"
+					style="cursor: pointer;">
+					{{ scope.row.memberLevelName }}
+				</el-tag>
+				<span v-else>否</span>
 			</template>
 			<template #gender="scope">
 				<el-tag :type="scope.row[scope.prop] == null
@@ -97,6 +101,46 @@
 		<UserCouponDialog ref="userCouponDialogRef"></UserCouponDialog>
 		<!-- 赠送券 -->
 		<GiveCoupon ref="GiveCouponRef"></GiveCoupon>
+		<el-dialog :title="`账号${userRow.status == 0 ? '开启' : '禁用'}`" width="600px" v-model="visible">
+			<span>确定要{{ userRow.status == 0 ? '开启' : '禁用' }}【{{ userRow.nickName }} / {{ userRow.phone }}】账号吗？</span>
+			<template #footer>
+				<div class="dialog-footer">
+					<el-button @click="visible = false">取 消</el-button>
+					<el-button type="primary" @click="handleOk" :loading="confirmLoading">确 定</el-button>
+				</div>
+			</template>
+		</el-dialog>
+		<!-- 会员详情 -->
+		<el-dialog title="会员详情" width="600px" v-model="vipDialogVisable">
+			<div class="vip_info">
+				<div class="top">
+					<el-avatar :src="currentVipInfo.headImg" :size="60" shape="square"></el-avatar>
+					<div class="info">
+						<div class="name">{{ currentVipInfo.nickName }}</div>
+						<div class="id">ID：{{ currentVipInfo.id }}</div>
+					</div>
+				</div>
+				<div class="btm">
+					<div class="row">
+						<span class="row_t">会员等级：</span>
+						<span class="row_b">{{ currentVipInfo.memberLevelName }}</span>
+					</div>
+					<div class="row">
+						<span class="row_t">开通时间：</span>
+						<span class="row_b">{{ currentVipInfo.startTime }}</span>
+					</div>
+					<div class="row">
+						<span class="row_t">到期时间：</span>
+						<span class="row_b" style="color: #FF2F2F;">{{ currentVipInfo.endTime }}</span>
+					</div>
+					<div class="row">
+						<span class="row_t">成长值</span>
+						<span class="row_b" style="margin-left: 6px;">{{ currentVipInfo.experience }}</span>
+						<span class="tips">（距离{{ currentVipInfo.nextMemberLevelName }}还差{{ currentVipInfo.nextExperience }}）</span>
+					</div>
+				</div>
+			</div>
+		</el-dialog>
 	</div>
 </template>
 
@@ -112,6 +156,7 @@ import searchConfig from "./config/search";
 import { returnOptionsLabel } from "./config/config";
 import shopUserApi from "@/api/account/shopUser";
 import { useRoute } from 'vue-router'
+import { ElNotification } from 'element-plus'
 const editMoneyModalRef = ref(null);
 const userCouponDialogRef = ref(null);
 const GiveCouponRef = ref(null);
@@ -196,6 +241,61 @@ function handleToolbarClick(name) {
 	}
 }
 
+// 账号禁用 start
+const userRow = ref('')
+const visible = ref(false)
+const confirmLoading = ref(false)
+
+async function handleOk() {
+	try {
+		confirmLoading.value = true
+		const shopId = localStorage.getItem('shopId')
+		let state = 0
+		if (userRow.value.status == 0) {
+			state = 1
+		} else {
+			state = 0
+		}
+		await shopUserApi.edit(shopId, { id: userRow.value.id, status: state })
+		searchQueryClick()
+		ElNotification({
+			title: '注意',
+			message: `${userRow.value.status == 0 ? '开启' : '禁用'}成功`,
+			type: 'success'
+		})
+	} catch (error) {
+		console.log(error);
+	}
+	setTimeout(() => {
+		confirmLoading.value = false
+		visible.value = false
+	}, 300);
+}
+// 账号禁用 end
+
+// 会员详情 start
+const vipDialogVisable = ref(false)
+const currentVipInfo = ref('')
+const currentVipUser = ref('')
+function showVipInfoHandle(row) {
+	currentVipUser.value = { ...row }
+	vipDialogVisable.value = true
+	getUserVipInfo()
+}
+
+// 获取会员详情
+async function getUserVipInfo() {
+	try {
+		const res = await shopUserApi.vipInfo({ id: currentVipUser.value.id })
+		currentVipInfo.value = res
+		console.log('getUserVipInfo===', res);
+
+	} catch (error) {
+		console.log(error);
+	}
+}
+// 会员详情 end
+
 // 赠送券
 function toGiveCoupon() { }
 // 其他操作列
@@ -219,6 +319,11 @@ async function handleOperatClick(data) {
 			GiveCouponRef.value.open(row);
 			return;
 		}
+		if (data.command === 'user-disabld') {
+			userRow.value = { ...row }
+			visible.value = true
+			return
+		}
 		return;
 	}
 }
@@ -270,4 +375,48 @@ onMounted(() => {
 		}
 	}
 }
+
+.vip_info {
+	.top {
+		padding: 14px;
+		background-color: #f5f5f5;
+		display: flex;
+		align-items: center;
+
+		.info {
+			padding-left: 10px;
+			display: flex;
+			flex-direction: column;
+
+			.name {
+				font-size: 16px;
+				color: #333;
+			}
+
+			.id {
+				font-size: 14px;
+				color: #666;
+			}
+		}
+	}
+
+	.btm {
+		margin-top: 14px;
+		display: grid;
+		grid-template-columns: repeat(2, 1fr);
+		grid-template-rows: repeat(auto, 1fr);
+		grid-column-gap: 14px;
+		grid-row-gap: 14px;
+
+		.row {
+			.row_t {
+				color: #666;
+			}
+
+			.row_b {
+				color: #333;
+			}
+		}
+	}
+}
 </style>