/* ============================================
   微信风格移动端布局样式表
   Layout CSS for WeChat-style Mobile App
   ============================================ */

/* ============================================
   1. 基础工具类
   Basic Utility Classes
   ============================================ */

/* 禁止页面滚动 */
body.overflow {
	overflow: hidden;
	touch-action: manipulation;  /* 禁用非精确手势(如双指缩放),消除点击延迟 */
}

/* 针对所有可能的输入元素和可编辑区域 === 避免iOS的Safari浏览器自动放大 */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea,
select,
[contenteditable] {
  font-size: 16px; /* 核心步骤 */
  -webkit-text-size-adjust: 100%; /* 增加兼容性 */
}

/* 右侧分割线 */
.splitline::after {
	content: '';
	border-right: 1px solid #f5c106;
	position: absolute;
	top: .25rem;
	bottom: .25rem;
	right: 0;
}

/* 左侧分割线 */
.splitlineL::after {
	content: '';
	border-left: 1px solid #f5c106;
	position: absolute;
	top: .25rem;
	bottom: .25rem;
	left: 0;
}

/* 底部阴影效果 */
.shadowB {
	box-shadow: 0 .01rem .1rem rgba(100,100,100,.1);
}

/* 过渡动画效果 */
.transit {
	transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
}

/* 材料设计风格单元格点击效果 */
.wc__material-cell:active {
	background-color: #e9e9e9!important;
}


/* ============================================
   2. 徽章组件
   Badge Component
   ============================================ */

/* 徽章基础样式 */
.wc__badge {
	background-color: #f85542;
	border-radius: 18px;
	color: #fff;
	display: inline-block;
	font-size: 12px;
	font-family: Verdana;
	text-align: center;
	padding: 0 4px;
	line-height: 14px;
	min-width: 8px;
	vertical-align: middle;
}

/* 圆点徽章样式 */
.wc__badge-dot {
	padding: 5px;
	min-width: 0;
}


/* ============================================
   3. 边框工具类
   Border Utility Classes
   ============================================ */

/* 顶部和底部边框容器 */
.wc__borT, .wc__borB {
	position: relative;
}

/* 顶部边框 */
.wc__borT:before {
	content: '';
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 底部边框 */
.wc__borB:after {
	content: '';
	border-bottom: 1px solid #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 箭头图标 */
.wc__arr:after {
	content: '';
	border-color: #d9d9d9;
	border-style: solid;
	border-width: .06rem .06rem 0 0;
	display: inline-block;
	vertical-align: middle;
	margin-right: -.07rem;
	height: .45rem;
	width: .45rem;
	position: relative;
	transform: rotate(45deg) scale(.5);
	-webkit-transform: rotate(45deg) scale(.5);
}


/* ============================================
   4. 首页容器
   Home Page Container
   ============================================ */

/* 首页包装器 */
.wc__home-wrapper {
	height: calc(100vh);
	position: relative;
}


/* ============================================
   5. 头部导航栏
   Header Navigation Bar
   ============================================ */

/* 头部导航栏内部容器 */
.wc__headerBar .inner {
	height: .9rem;
	width: 100%;
	z-index: 999;
	position: absolute;
}

/* 固定定位的头部导航栏 */
.wc__headerBar.fixed {
	padding-bottom: .9rem;
}

/* 固定定位时的内部容器样式 */
.wc__headerBar.fixed .inner {
	max-width: 750px;
	width: 100%;
	position: fixed;
	top: 0;
	background-color: #fff;
}

/* 头部导航栏链接点击效果 */
.wc__headerBar .inner a:active {
	background-color: rgba(255,255,255,.15);
}

/* 头部导航栏标题 */
.wc__headerBar .inner .barTit {
	color: #252525;
	font-size: .3rem;
	font-family: 'Microsoft Yahei';
	line-height: .9rem;
	position: relative;
}

/* 头部导航栏文本 */
.wc__headerBar .inner .barTxt {
	color: #fff;
	font-size: .24rem;
	font-family: 'Microsoft Yahei';
	padding: 0 .35rem;
	line-height: .9rem;
	position: relative;
}

/* 头部导航栏按钮 */
.wc__headerBar .inner .batBtn {
	color: #252525;
	font-size: .24rem;
	font-family: 'Microsoft Yahei';
	padding: 0 .35rem;
	line-height: .9rem;
	position: relative;
}

/* 头部导航栏大标题 */
.wc__headerBar .inner .barTitLg {
	font-size: .44rem;
	padding-left: .25rem;
	font-weight: 900;
	color: #121212;
}

/* 关闭按钮图标 */
.wc__headerBar .inner .close {
	background: url(../img/topbar/icon__close-white.png) no-repeat center;
	background-size: .36rem;
	width: .85rem;
	position: relative;
}

/* 返回按钮图标 */
.wc__headerBar .inner .back {
	background: url(../img/topbar/icon__back-white.png) no-repeat center;
	background-size: .36rem;
	width: .85rem;
	position: relative;
}

/* 头部导航栏图标容器 */
.wc__headerBar .inner .barIco {
	width: 1.15rem;
	position: relative;
}

/* 单个用户图标 */
.wc__headerBar .inner .u-one {
	background: url(../img/topbar/icon__user.png) no-repeat center;
	background-size: .36rem;
}

/* 群组用户图标 */
.wc__headerBar .inner .u-qun {
	background: url(../img/topbar/icon__users.png) no-repeat center;
	background-size: .36rem;
}

/* 搜索图标 */
.wc__headerBar .inner .sear {
	background: url(../img/topbar/icon__sear.png) no-repeat center;
	background-size: .36rem;
}

/* 语言切换图标 */
.wc__headerBar .inner .lang {
	background: url(/static/img/lang.png) no-repeat center;
	background-size: .56rem;
}

/* 添加图标 */
.wc__headerBar .inner .add {
	background: url(../img/topbar/icon__add.png) no-repeat center;
	background-size: .36rem;
}


/* ============================================
   6. 顶部弹窗菜单
   Top Bar Popup Menu
   ============================================ */

/* 顶部弹窗菜单容器 */
.wc__popup-topbar {
	position: relative;
	display: none;
}

/* 顶部菜单遮罩层 */
.wrap__topbar-mask {
	background: rgba(100,100,100,0);
	height: 100%;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 2008;
}

/* 顶部菜单容器 */
.wrap__topbar-menu {
	max-width: 750px;
	width: 100%;
	position: fixed;
	top: 1rem;
	z-index: 2008;
}

/* 顶部菜单列表 */
.wrap__topbar-menu ul {
	background: #fff;
	border-radius: .03rem;
	box-shadow: 0 .05rem .2rem rgba(0,0,0,.2);
	position: absolute;
	right: .1rem;
}

/* 顶部菜单项 */
.wrap__topbar-menu ul li {
	color: #666;
	font-size: .28rem;
	font-family: "Microsoft Yahei";
	padding: .3rem;
	position: relative;
}

/* 顶部菜单项分割线 */
.wrap__topbar-menu ul li:after {
	content: '';
	background-color: #e2e2e2;
	color: #e2e2e2;
	height: 1px;
	position: absolute;
	left: .2rem;
	right: .2rem;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一项不显示分割线 */
.wrap__topbar-menu ul li:last-child:after {
	display: none;
}

/* 顶部菜单项图标 */
.wrap__topbar-menu ul li .ico {
	display: inline-block;
	vertical-align: top;
	margin-right: .2rem;
	height: .48rem;
	width: .48rem;
	position: relative;
}

/* 群聊图标 */
.wrap__topbar-menu ul li .ico.i1 {
	background: url(../img/topbar/icon__qun-chat.png) no-repeat center;
	background-size: .48rem;
}

/* 添加好友图标 */
.wrap__topbar-menu ul li .ico.i2 {
	background: url(../img/topbar/icon__add-friend.png) no-repeat center;
	background-size: .48rem;
}

/* 帮助图标 */
.wrap__topbar-menu ul li .ico.i3 {
	background: url(../img/topbar/icon__help.png) no-repeat -.02rem center;
	background-size: .48rem;
}


/* ============================================
   7. 滑动标签栏
   Swiper Tab Bar
   ============================================ */

/* 滑动标签栏中的幻灯片 */
.wc__swiper-tabBar .swiper-slide {
	height: calc(100vh - 2rem);
	position: relative;
	z-index: 11;
}

/* 滚动面板 */
.wc__scrolling-panel {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	height: 100%;
	position: relative;
}


/* ============================================
   8. 聊天记录列表
   Chat Record List
   ============================================ */

/* 聊天记录列表项 */
.wc__recordChat-list ul li {
	background: #fff;
	font-family: 'Microsoft Yahei';
	padding: .2rem .3rem;
	padding-top: 15px;
	position: relative;
}

/* 聊天记录列表项遮罩层 */
.wc__recordChat-list ul li:before {
	background: transparent;
	content: '';
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

/* 聊天记录列表项底部边框 */
.wc__recordChat-list ul li:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: 80%;
	position: absolute;
	right: 0;
	bottom: 0;
	transform: scaleY(.5);
	-webkit-transform: scaleY(.5);
}

/* 聊天记录头像 */
.wc__recordChat-list ul li .img {
	margin-right: .3rem;
	height: 1rem;
	width: 1rem;
	position: relative;
}

/* 聊天群头像图片 */
.wc__recordChat-list ul li .img img {
	float: left;
	height: 100%;
	width: 100%;
	object-fit: contain;
	border-radius: 8%;
}

/* 群组头像容器 */
.wc__recordChat-list ul li .imgs {
	background: #e9e9e9;
	border-radius: 2px;
}

/* 群组头像图片 */
.wc__recordChat-list ul li .imgs img {
	margin-left: .03rem;
	margin-top: .03rem;
	height: .29rem;
	width: .29rem;
}

/* 聊天记录头像上的徽章 */
.wc__recordChat-list ul li .img .wc__badge {
	position: absolute;
	top: -5px;
	right: -5px;
}

/* 聊天记录标题 */
.wc__recordChat-list ul li .title {
	color: #333;
	font-size: .3rem;
}

/* 聊天记录描述 */
.wc__recordChat-list ul li .desc {
	color: #999;
	font-size: .05rem;
	font-family: Verdana;
	margin-top: .1rem;
}

/* 聊天记录时间 */
.wc__recordChat-list ul li .time {
	color: #ccc;
	font-size: .2rem;
	font-family: Verdana;
	margin-top: .1rem;
	text-align: right;
	min-width: 1rem;
}


/* ============================================
   9. 通讯录
   Address Book
   ============================================ */

/* 通讯录字母提示显示 */
.wc__addrFriend-showletter {
	background: rgba(0,0,0,.5);
	border-radius: .05rem;
	color: #fff;
	font-size: .32rem;
	font-family: Verdana;
	text-align: center;
	margin: -.5rem 0 0 -.5rem;
	height: 1rem;
	line-height: 1rem;
	width: 1rem;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 11;
	display: none;
}

/* 通讯录右侧字母导航 */
.wc__addrFriend-floatletter {
	color: #666;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: .4rem;
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 11;
}

/* 通讯录字母导航项 */
.wc__addrFriend-floatletter em {
	flex: 1;
	font-size: .24rem;
	font-family: arial;
	text-align: center;
	height: 3.846%;
	align-self: center;
	width: 100%;
}

/* 通讯录列表首字母标识 */
.wc__addrFriend-list ul li .initial {
	font-size: .24rem;
	font-family: Verdana;
	padding: 0 .3rem;
}

/* 第一个首字母标识前不显示分割线 */
.wc__addrFriend-list ul li:first-child .initial:before {
	display: none;
}

/* 通讯录列表行 */
.wc__addrFriend-list ul li .row {
	background: #fff;
	font-family: 'Microsoft Yahei';
	padding: .15rem .3rem;
	position: relative;
}

/* 通讯录列表行底部边框 */
.wc__addrFriend-list ul li .row:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .4rem;
	bottom: 0;
	transform: scaleY(.5);
	-webkit-transform: scaleY(.5);
}

/* 最后一行不显示边框 */
.wc__addrFriend-list ul li .row:last-child::after {
	display: none;
}

/* 通讯录用户头像 */
.wc__addrFriend-list ul li .row .uimg {
	display: inline-block;
	vertical-align: top;
	margin-right: .2rem;
	height: .7rem;
	width: .7rem;
}

/* 通讯录用户名 */
.wc__addrFriend-list ul li .row .name {
	color: #333;
	font-size: .28rem;
}

/* 通讯录总数显示 */
.wc__addrFriend-list .total {
	color: #999;
	font-size: .28rem;
	font-family: arial;
	padding: .4rem 0;
	text-align: center;
}


/* ============================================
   10. 个人中心列表
   User Center List
   ============================================ */

/* 个人中心列表容器 */
.wc__ucenter-list {
	padding-bottom: .35rem;
}

/* 个人中心列表项 */
.wc__ucenter-list ul li {
	margin-top: .35rem;
}

/* 个人中心列表项内容 */
.wc__ucenter-list ul li .item {
	background: #fff;
	font-family: 'Microsoft Yahei';
	padding: .25rem .3rem;
	position: relative;
}

/* 个人中心列表项底部边框 */
.wc__ucenter-list ul li .item:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .3rem;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一项不显示边框 */
.wc__ucenter-list ul li .item:last-child::after {
	display: none;
}

/* 个人中心用户头像 */
.wc__ucenter-list ul li .item .uimg {
	display: inline-block;
	margin-right: .4rem;
	vertical-align: top;
	height: 1.1rem;
	width: 1.1rem;
}

/* 个人中心图标 */
.wc__ucenter-list ul li .item .icon {
	display: inline-block;
	margin-left: .1rem;
	vertical-align: top;
	margin-right: .4rem;
	height: .5rem;
	width: .5rem;
}

/* 个人中心文本 */
.wc__ucenter-list ul li .item .txt {
	color: #333;
	font-size: .28rem;
}

/* 个人中心文本中的说明 */
.wc__ucenter-list ul li .item .txt i {
	color: #aaa;
	display: block;
	font-size: .24rem;
	font-family: Verdana;
	margin-top: .1rem;
}

/* 个人中心标签 */
.wc__ucenter-list ul li .item .lbl {
	color: #999;
	font-size: .24rem;
}

/* 个人中心二维码容器 */
.wc__ucenter-list ul li .item .qrcode {
	position: relative;
}

/* 个人中心二维码图片 */
.wc__ucenter-list ul li .item .qrcode img {
	vertical-align: middle;
	height: .5rem;
	width: .5rem;
}


/* ============================================
   11. 底部标签栏
   Bottom Tab Bar
   ============================================ */

/* 底部标签栏固定容器 */
.wechat__tabBar .bottomfixed {
	background: #fff;
	max-width: 750px;
	height: 1.1rem;
	width: 100%;
	z-index: 1001;
}

/* 底部标签栏列表 */
.wechat__tabBar ul {
	text-align: center;
	height: 1.1rem;
}

/* 底部标签栏列表项 */
.wechat__tabBar ul li {
	background: none;
	border-radius: 0;
	opacity: 1;
	height: 1.1rem;
	width: auto;
}

/* 底部标签栏图标 */
.wechat__tabBar ul li .ico {
	display: inline-block;
	vertical-align: top;
	margin-top: .15rem;
	height: .48rem;
	width: .48rem;
	position: relative;
}

/* 聊天图标 */
.wechat__tabBar ul li .ico.i1 {
	background: url(../img/tabbar/icon_chat.png) no-repeat center;
	background-size: .41rem;
}

/* 通讯录图标 */
.wechat__tabBar ul li .ico.i2 {
	background: url(../img/tabbar/icon_abook.png) no-repeat center;
	background-size: .5rem;
}

/* 发现图标 */
.wechat__tabBar ul li .ico.i3 {
	background: url(../img/tabbar/icon_explore.png) no-repeat center;
	background-size: .42rem;
}

/* 我图标 */
.wechat__tabBar ul li .ico.i4 {
	background: url(../img/tabbar/icon_me.png) no-repeat center;
	background-size: .42rem;
}

/* 动态图标 */
.wechat__tabBar ul li .ico.i5 {
	background: url(../img/tabbar/icon_dt.png) no-repeat center;
	background-size: .49rem;
}

/* 客服图标 */
.wechat__tabBar ul li .ico.i6 {
	background: url(../img/tabbar/icon_chat.png) no-repeat center;
	background-size: .41rem;
}

/* 激活状态的聊天图标 */
.wechat__tabBar ul li.on .ico.i1, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i1 {
	background: url(../img/tabbar/icon_chat_HL.png) no-repeat center;
	background-size: .5rem;
}

/* 激活状态的通讯录图标 */
.wechat__tabBar ul li.on .ico.i2, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i2 {
	background: url(../img/tabbar/icon_abook_HL.png) no-repeat center;
	background-size: .57rem;
}

/* 激活状态的发现图标 */
.wechat__tabBar ul li.on .ico.i3, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i3 {
	background: url(../img/tabbar/icon_explore_HL.png) no-repeat center;
	background-size: .49rem;
}

/* 激活状态的我图标 */
.wechat__tabBar ul li.on .ico.i4, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i4 {
	background: url(../img/tabbar/icon_me_HL.png) no-repeat center;
	background-size: .49rem;
}

/* 激活状态的动态图标 */
.wechat__tabBar ul li.on .ico.i5, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i5 {
	background: url(../img/tabbar/icon_dt_HL.png) no-repeat center;
	background-size: .55rem;
}

/* 激活状态的客服图标 */
.wechat__tabBar ul li.on .ico.i1, .wechat__tabBar ul li.swiper-pagination-bullet-active .ico.i6 {
	background: url(../img/tabbar/icon_chat_HL.png) no-repeat center;
	background-size: .5rem;
}

/* 底部标签栏图标上的徽章 */
.wechat__tabBar ul li .ico .wc__badge {
	position: absolute;
	top: -3px;
	right: -18px;
}

/* 底部标签栏图标上的圆点徽章 */
.wechat__tabBar ul li .ico .wc__badge-dot {
	right: -6px;
}

/* 底部标签栏文字 */
.wechat__tabBar ul li span {
	color: #acb5be;
	display: block;
	font-size: .24rem;
	margin-top: .1rem;
}

/* 激活状态的底部标签栏文字 */
.wechat__tabBar ul li.on span {
	color: #45c00c;
}

/* 滑动激活状态的底部标签栏文字 */
.wechat__tabBar ul li.swiper-pagination-bullet-active span {
	color: #45c00c;
}


/* ============================================
   12. 聊天消息面板
   Chat Message Panel
   ============================================ */

/* 聊天包装器 */
.wc__chat-wrapper {
	position: absolute;
	z-index: 2;
	height: 100%;
	max-width: 750px;
	width: 100%;
}

/* 聊天消息面板 */
.wc__chatMsg-panel {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	width: 100%;
	position: relative;
}

/* 聊天消息内容容器 */
.wc__chatMsg-panel .chatMsg-cnt {
	padding: .15rem;
	position: relative;
}

/* 聊天消息列表项 */
.chatMsg-cnt ul li {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	display: -ms-flexbox;
	margin-bottom: .25rem;
}

/* 时间显示项 */
.chatMsg-cnt ul li.time {
	padding-top: .25rem;
}

/* 时间显示文本 */
.chatMsg-cnt ul li.time span {
	background: rgba(0,0,0,.1);
	color: #fff;
	border-radius: .05rem;
	display: block;
	font-size: .22rem;
	font-family: Verdana;
	overflow: hidden;
	margin: 0 auto;
	padding: .05rem .1rem;
	line-height: normal;
	max-width: 90%;
}

/* 通知消息样式 */
.chatMsg-cnt ul li.notice span {
	color: #797979;
	border-radius: .05rem;
	display: block;
	font-size: .24rem;
	font-family: Verdana;
	overflow: hidden;
	margin: 0 auto;
	padding: .1rem;
	line-height: normal;
	max-width: 90%;
}

/* 通知消息中的链接 */
.chatMsg-cnt ul li.notice span a {
	color: #22a7ff;
}

/* 聊天消息头像 */
.chatMsg-cnt ul li .avatar {
	display: block;
	overflow: hidden;
	height: .8rem;
	width: .8rem;
	position: relative;
	border-radius: 8%;
}

/* 聊天消息头像图片 */
.chatMsg-cnt ul li .avatar img {
	vertical-align: top;
	height: 100%;
	width: 100%;
}

/* 聊天消息头像遮罩层 */
.chatMsg-cnt ul li .avatar:after {
	background-color: transparent;
	content: "";
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

/* 聊天消息内容区域 */
.chatMsg-cnt ul li .content {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

/* 聊天消息作者 */
.chatMsg-cnt ul li .content .author {
	color: #aaa;
	font-size: .2rem;
	margin: 0 .2rem;
}

/* 聊天消息气泡 */
.chatMsg-cnt ul li .content .msg {
	border-style: solid;
	border-width: 1px;
	border-radius: .07rem;
	color: #333;
	float: left;
	font-size: .28rem;
	margin: 0 .1rem;
	padding: .1rem;
	word-wrap: break-word;
	word-break: break-all;
	min-height: .6rem;
	max-width: 8rem;
	position: relative;
	transition: all .3s;
}

/* 聊天消息中的表情 */
.chatMsg-cnt ul li .content .msg .face {
	vertical-align: top;
	height: .4rem;
}

/* 聊天消息中的大表情 */
.chatMsg-cnt ul li .content .msg .lg-face {
	vertical-align: top;
	max-height: 2.5rem;
	max-width: 2.5rem;
}

/* 聊天消息中的链接 */
.chatMsg-cnt ul li .content .msg a {
	color: #22a7ff;
	font-family: arial;
}

/* 聊天消息中链接的点击效果 */
.chatMsg-cnt ul li .content .msg a:active {
	background-color: #c2e6fd;
}

/* 他人消息气泡样式 */
.chatMsg-cnt ul li.others .content .msg {
    font-weight: normal;
	background-color: #fff;
	border-color: #f0f0f0;
}

/* 他人消息气泡点击效果 */
.chatMsg-cnt ul li.others .content .msg:active, .chatMsg-cnt ul li.others .content .msg.taped {
	background-color: #e9e9e9;
	border-color: #dedede;
}

/* 自己消息的作者对齐 */
.chatMsg-cnt ul li.me .content .author {
	text-align: right;
}

/* 自己消息气泡样式 */
.chatMsg-cnt ul li.me .content .msg {
	float: right;
	font-weight: normal;
	background-color: #69e331;
	border-color: #09bb07;
}

/* 自己消息气泡点击效果 */
.chatMsg-cnt ul li.me .content .msg:active, .chatMsg-cnt ul li.me .content .msg.taped {
	background-color: #7cc6ff;
	border-color: #6abbfd;
}

/* 他人消息气泡左侧箭头 */
.chatMsg-cnt ul li.others .content .msg:before {
	background: inherit;
	border-color: inherit;
	left: -.115rem;
	transform: translate(0, -50%) rotate(-135deg);
}

/* 自己消息气泡右侧箭头 */
.chatMsg-cnt ul li.me .content .msg:before {
	background: inherit;
	border-color: inherit;
	right: -.11rem;
	transform: translate(0, -50%) rotate(45deg);
}

/* 图片和视频消息不显示箭头 */
.chatMsg-cnt ul li .content .picture:before, .chatMsg-cnt ul li .content .video:before {
	display: none;
}

/* 图片和视频消息容器 */
.chatMsg-cnt ul li .content .picture, .chatMsg-cnt ul li .content .video {
	background-color: transparent!important;
	border-width: 0;
	border-radius: .07rem;
	padding: 0;
	overflow: hidden;
	position: relative;
}

/* 图片和视频消息点击效果 */
.chatMsg-cnt ul li .content .picture.taped, .chatMsg-cnt ul li .content .video.taped {
	opacity: .5;
}

/* 图片和视频内容 */
.chatMsg-cnt ul li .content .picture .img__pic, .chatMsg-cnt ul li .content .video .img__video {
	vertical-align: top;
	pointer-events: auto;
	max-height: 5.4rem;
	max-width: 5.4rem;
}

/* 视频消息播放图标 */
.chatMsg-cnt ul li .content .video:after {
	content: '';
	background: url(../img/wchat/icon-play.png) no-repeat center;
	background-size: .6rem;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

/* 大表情消息容器 */
.chatMsg-cnt ul li .content .lgface {
	background-color: transparent!important;
	border-width: 0;
	border-radius: 0;
	padding: 0;
	overflow: hidden;
	position: relative;
}

/* @提醒样式 */
.onez-at {
	color: #006efe;
}

/* 聊天消息通知栏 */
.wc__chatMsg-panel .chatMsg-notice {
	background-color: #fff;
	box-shadow: 0 0 5px rgba(0,0,0,.2);
	border-top-left-radius: .5rem;
	border-bottom-left-radius: .5rem;
	color: #12b7f5;
	font-size: .24rem;
	font-family: arial;
	padding: 0 .25rem;
	line-height: .7rem;
	position: fixed;
	top: 1.6rem;
	right: 0;
}


/* ============================================
   13. 聊天长按菜单
   Chat Long Press Menu
   ============================================ */

/* 聊天长按菜单容器 */
.wc__chatTapMenu {
	display: inline-block;
}

/* 聊天长按菜单 */
.wc__chatTapMenu .menu {
	background: #313131;
	border-radius: .07rem;
	overflow: hidden;
	padding: 0 .1rem;
	text-align: center;
}

/* 聊天长按菜单箭头 */
.wc__chatTapMenu .menu:before {
	content: "";
	border-style: solid dashed dashed dashed;
	border-width: .16rem;
	font-size: 0;
	overflow: hidden;
	height: 0;
	width: 0;
	position: absolute;
	left: 50%;
	bottom: -.14rem;
	border-color: #313131 transparent transparent transparent;
	transform: translate(-50%, 50%);
}

/* 聊天长按菜单项 */
.wc__chatTapMenu .menu a {
	color: #fff;
	font-size: .2rem;
	display: inline-block;
	vertical-align: top;
	padding: .07rem .3rem;
}

/* 聊天长按菜单项点击效果 */
.wc__chatTapMenu .menu a:active {
	background-color: #515151;
}

/* 聊天长按菜单图标 */
.wc__chatTapMenu .menu a .ico {
	display: block;
	margin: .03rem auto;
	height: .45rem;
	width: .45rem;
}

/* 复制图标 */
.wc__chatTapMenu .menu a .ico.i1 {
	background: url(../img/wchat/icon__chat-copy.png) no-repeat;
	background-size: cover;
}

/* 收藏图标 */
.wc__chatTapMenu .menu a .ico.i2 {
	background: url(../img/wchat/icon__chat-collect.png) no-repeat;
	background-size: cover;
}

/* 保存图标 */
.wc__chatTapMenu .menu a .ico.i3 {
	background: url(../img/wchat/icon__chat-save.png) no-repeat;
	background-size: cover;
}

/* 撤回图标 */
.wc__chatTapMenu .menu a .ico.i4 {
	background: url(../img/wchat/icon__chat-revoke.png) no-repeat;
	background-size: cover;
}

/* 删除图标 */
.wc__chatTapMenu .menu a .ico.i5 {
	background: url(../img/wchat/icon__chat-del.png) no-repeat;
	background-size: cover;
}


/* ============================================
   14. 底部工具栏
   Footer Tool Panel
   ============================================ */

/* 底部工具栏面板 */
.wc__footTool-panel {
	background: #fff;
	max-width: 750px;
	width: 100%;
	z-index: 1005;
}


/* ============================================
   15. 编辑器面板
   Editor Panel
   ============================================ */

/* 编辑器面板 */
.wc__editor-panel {
	padding: .15rem .2rem;
	align-items: flex-end;
}

/* 编辑器面板顶部边框 */
.wc__editor-panel:before {
	border-top-color: #d9d9d9;
}

/* 编辑器包装器 */
.wc__editor-panel .wrap-editor {
	max-width: 100%;
}

/* 编辑器输入框 */
.wc__editor-panel .wrap-editor .editor {
	background: none;
	color: #333;
	caret-color: #12b7f5;
	font-size: .28rem;
	padding: .1rem .15rem;
	overflow-y: auto;
	overflow-x: hidden;
	outline: none;
	word-wrap: break-word;
	word-break: break-all;
	line-height: .4rem;
	max-height: 2.3rem;
	max-width: 100%;
	position: relative;
}

/* 编辑器输入框底部边框 */
.wc__editor-panel .wrap-editor .editor:after {
	content: '';
	border-bottom: 1px solid #000;
	color: #000;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: scaleY(1);
	-webkit-transform: scaleY(1);
	transition: border-color .3s;
}

/* 编辑器输入框聚焦时的底部边框 */
.wc__editor-panel .wrap-editor .editor:focus:after {
	border-bottom-color: #12b7f5;
}

/* 编辑器中的表情 */
.wc__editor-panel .wrap-editor .editor .face {
	vertical-align: middle;
	height: .4rem;
}

/* 编辑器按钮 */
.wc__editor-panel .btn {
	margin-left: .1rem;
	height: .7rem;
	width: .7rem;
}

/* 语音按钮 */
.wc__editor-panel .btn-voice {
	background: url(../img/wchat/icon-voice.png) no-repeat;
	background-size: cover;
	margin-left: 0;
	margin-right: .1rem;
	cursor: pointer;
}

/* 表情按钮 */
.wc__editor-panel .btn-emotion {
	background: url(../img/wchat/icon__emotion.png) no-repeat;
	background-size: cover;
}

/* 选择按钮 */
.wc__editor-panel .btn-choose {
	background: url(../img/wchat/icon__choose.png) no-repeat;
	background-size: cover;
}

/* 提交按钮 */
.wc__editor-panel .btn-submit {
	background: #ededed;
	border: 0;
	color: #252525;
	font-size: .28rem;
	font-family: "Microsoft Yahei";
	outline: none;
	margin-left: .15rem;
	margin-bottom: .05rem;
	padding: 0 .15rem;
	height: .6rem;
}


/* ============================================
   16. 选择面板（表情/文件选择）
   Choose Panel (Emotion/File Selection)
   ============================================ */

/* 选择面板容器 */
.wc__choose-panel {
	height: 5.8rem;
}

/* 选择面板顶部边框 */
.wc__choose-panel:before {
	border-top-color: #d9d9d9;
}

/* 表情包装器 */
.wc__choose-panel .wrap-emotion {
	height: 100%;
}

/* 表情单元格容器 */
.wc__choose-panel .wrap-emotion .emotion__cells {
	height: 100%;
}

/* 表情滑动容器 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .swiper-container {
	height: 100%;
}

/* 小表情列表 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__sm-list {
	display: inline-block;
	margin-right: -.15rem;
	padding: .25rem .15rem 0;
}

/* 小表情项 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__sm-list span {
	float: left;
	text-align: center;
	margin-top: .35rem;
	margin-right: .15rem;
	height: .9rem;
	width: .9rem;
}

/* 小表情项点击效果 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__sm-list span:active {
	background-color: #f3f3f3;
	border-radius: .07rem;
}

/* 小表情图片 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__sm-list span img {
	margin-top: .15rem;
	height: .6rem;
	width: .6rem;
}

/* 大表情列表 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__lg-list {
	display: inline-block;
	margin-right: -.366rem;
	padding: .25rem .2rem 0;
}

/* 大表情项 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__lg-list span {
	float: left;
	text-align: center;
	margin-top: .35rem;
	margin-right: .366rem;
	height: 1.5rem;
	width: 1.5rem;
}

/* 大表情项点击效果 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__lg-list span:active {
	background-color: #f3f3f3;
	border-radius: .07rem;
}

/* 大表情图片 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .face__lg-list span img {
	margin-top: .1rem;
	height: 1.3rem;
	width: 1.3rem;
}

/* 表情分页器 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .pagination-emotion {
	text-align: center;
	position: absolute;
	bottom: .1rem;
	z-index: 11;
}

/* 表情分页器圆点 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .pagination-emotion .swiper-pagination-bullet {
	opacity: .1;
	height: 6px;
	width: 6px;
}

/* 激活状态的表情分页器圆点 */
.wc__choose-panel .wrap-emotion .emotion__cells-swiper .pagination-emotion .swiper-pagination-bullet-active {
	background: #999;
	opacity: 1;
	transform: scale(1.3);
}

/* 表情底部标签栏 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer {
	border-top: 1px solid #e9e9e9;
	white-space: nowrap;
	overflow: hidden;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	height: .75rem;
	width: 100%;
}

/* 表情底部标签栏列表 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul {
	font-size: 0;
}

/* 表情底部标签栏项 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul li {
	border-left: 1px solid #e9e9e9;
	display: inline-block;
	padding: .1rem 0;
	text-align: center;
	height: .75rem;
	width: 1.26rem;
}

/* 表情底部标签栏最后一项 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul li:last-child {
	border-right: 1px solid #e9e9e9;
}

/* 当前激活的表情标签 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul li.cur {
	background-color: #e9e9e9;
}

/* 表情标签图片 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul li img {
	height: 100%;
}

/* 模板设置图片 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer ul li.swiperTmplSet img {
	height: 100%;
}

/* 隐藏表情底部标签栏滚动条 */
.wc__choose-panel .wrap-emotion .emotion__cells-footer::-webkit-scrollbar {
	display: none;
}

/* 文件选择列表 */
.wc__choose-panel .wrap-choose ul {
	display: inline-block;
	padding: 0 .4rem;
	width: 100%;
}

/* 文件选择项 */
.wc__choose-panel .wrap-choose ul li {
	float: left;
	text-align: center;
	margin-top: .8rem;
	width: 25%;
}

/* 文件选择链接 */
.wc__choose-panel .wrap-choose ul li a {
	display: inline-block;
}

/* 文件选择图标容器 */
.wc__choose-panel .wrap-choose ul li a .img {
	display: inline-block;
	height: 1.2rem;
	width: 1.2rem;
	position: relative;
}

/* 文件选择图标边框 */
.wc__choose-panel .wrap-choose ul li a .img:before {
	content: '';
	background-color: #fff;
	border: 1px solid #e9e9e9;
	border-radius: .25rem;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

/* 文件选择图标点击效果 */
.wc__choose-panel .wrap-choose ul li a .img:active:before {
	background-color: #f3f3f3;
}

/* 文件选择图标图片 */
.wc__choose-panel .wrap-choose ul li a .img img {
	margin-top: .25rem;
	height: .7rem;
	width: .7rem;
	position: relative;
	z-index: 9;
}

/* 文件选择输入框 */
.wc__choose-panel .wrap-choose ul li a .img input[type="file"] {
	opacity: 0;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 11;
}

/* 文件选择文字说明 */
.wc__choose-panel .wrap-choose ul li a em {
	color: #999;
	display: block;
	font-size: .2rem;
	margin-top: .1rem;
}


/* ============================================
   17. WeUI 选择器样式覆盖
   WeUI Picker Style Override
   ============================================ */

/* 选择器头部 */
.weui-picker__hd {
	font-size: 14px!important;
}

/* 选择器操作按钮 */
.weui-picker__hd .weui-picker__action {
	color: #00c1de;
}

/* 选择器项 */
.weui-picker__item {
	font-size: 14px;
}

/* 选择器容器 */
.weui-picker {
	z-index: 10005!important;
}

/* 遮罩层 */
.weui-mask, .weui-mask_transparent {
	z-index: 10004!important;
}


/* ============================================
   18. 弹窗模板
   Popup Template
   ============================================ */

/* 弹窗模板容器 */
.wc__popupTmpl {
	text-align: left;
}

/* 弹窗关闭按钮 */
.wc__popupTmpl .wc-xclose {
	background: url(../img/icon__wc-close.png) no-repeat;
	background-size: 14px;
	height: 14px;
	width: 14px;
	position: absolute;
	top: 8px;
	right: 12px;
}

/* 弹窗标题 */
.wc__popupTmpl .hdTit {
	color: #333;
	font-size: 16px;
	margin-bottom: 20px;
	text-align: center;
}

/* 弹窗项 */
.wc__popupTmpl .item {
	align-items: center;
	height: 50px;
	font-size: 13px;
	padding: 0 10px;
	margin-bottom: 20px;
	border-radius: 4px;
	background: #fff;
}

/* 文本域项 */
.wc__popupTmpl .item-area {
	height: 60px;
}

/* 上传项 */
.wc__popupTmpl .item-upload {
	background: none;
	padding: 0;
	height: auto;
}

/* 礼物项 */
.wc__popupTmpl .item-gift {
	height: auto;
}

/* 弹窗项标签文本 */
.wc__popupTmpl .item label.txt {
	color: #333;
	font-size: 13px;
}

/* 弹窗项时间显示 */
.wc__popupTmpl .item label.txt .time {
	color: #999;
	display: block;
	font-size: 12px;
	margin-top: 2px;
}

/* 弹窗项单位 */
.wc__popupTmpl .item .unit {
	color: #333;
	font-size: 13px;
	margin-left: 10px;
}

/* 弹窗项输入框 */
.wc__popupTmpl .item .ipt-txt {
	border: 0;
	font-size: 13px;
	outline: none;
	text-align: right;
	padding: 10px 0;
	min-width: 50px;
}

/* 弹窗项描述框 */
.wc__popupTmpl .item .describe {
	border: 0;
	font-size: 14px;
	font-family: arial;
	outline: none;
	resize: none;
	padding: 10px 0;
	height: 100%;
	width: 100%;
}

/* 弹窗提示文字 */
.wc__popupTmpl .tips {
	color: #999;
	font-size: 12px;
	font-family: helvetica;
	margin: -15px 0 15px;
	padding-left: 9px;
}

/* 弹窗总金额 */
.wc__popupTmpl .amountTotal {
	color: #333;
	font-size: 13px;
	margin-bottom: 4px;
	text-align: center;
}

/* 弹窗总金额数字 */
.wc__popupTmpl .amountTotal .num {
	font-size: 28px;
	font-family: helvetica;
	vertical-align: middle;
}

/* 礼物项容器 */
.wc__popupTmpl .item-gift .gift {
	align-items: center;
	justify-content: space-between;
	height: 50px;
	position: relative;
}

/* 礼物项底部边框 */
.wc__popupTmpl .item-gift .gift:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一个礼物项不显示边框 */
.wc__popupTmpl .item-gift .gift:last-child:after {
	display: none;
}

/* 礼物金额 */
.wc__popupTmpl .item-gift .gift .amount {
	color: #333;
	font-size: 12px;
	font-family: arial;
}

/* 礼物金额强调 */
.wc__popupTmpl .item-gift .gift .amount em {
	font-size: 15px;
}

/* 礼物选择框 */
.wc__popupTmpl .item-gift .gift .amount .chkbox {
	background: #fff;
	border: 1px solid #00c1de;
	border-radius: 50%;
	display: inline-block;
	margin-left: 10px;
	height: 12px;
	width: 12px;
}

/* 选中状态的礼物选择框 */
.wc__popupTmpl .item-gift .gift.selected .amount .chkbox {
	background: #00c1de;
}

/* 充值模板项 */
.wc__popupTmpl.tmpl-recharge .item {
	border-radius: 0;
	padding: 0;
	height: auto;
}

/* 充值模板项容器 */
.wc__popupTmpl.tmpl-recharge .item .itembox {
	padding: 15px 0;
	position: relative;
}

/* 充值模板银行标签 */
.wc__popupTmpl.tmpl-recharge .item .bankLbl {
	width: 90px;
}

/* 充值模板银行名称 */
.wc__popupTmpl.tmpl-recharge .item .bankName {
	color: #f90;
	font-size: 14px;
}

/* 充值模板银行限额 */
.wc__popupTmpl.tmpl-recharge .item .bankQuota {
	color: #999;
	font-size: 12px;
	margin-top: 5px;
}

/* 充值模板输入框 */
.wc__popupTmpl.tmpl-recharge .item .ipt-txt {
	font-size: 40px;
	text-align: left;
	padding: 0;
}

/* 充值模板单位 */
.wc__popupTmpl.tmpl-recharge .item .unit {
	color: #333;
	font-size: 40px;
	margin-left: 0;
	margin-right: 15px;
}

/* 银行充值按钮 */
#bankRecharge .popui__panel-btn:after {
	display: none;
}


/* ============================================
   19. 文件上传器
   File Uploader
   ============================================ */

/* 上传器面板 */
.wc__uploader-panel {
	background: #fff;
	border: 1px dashed #bbb;
	border-radius: 4px;
	height: 120px;
	width: 100%;
	position: relative;
}

/* 上传器输入框 */
.wc__uploader-panel .wc__uploader-input {
	opacity: 0;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

/* 上传器提示文字 */
.wc__uploader-panel .wc__uploader-tips {
	color: #bbb;
	font-size: 14px;
	transform: translate(-50%, -50%);
	padding-top: 35px;
	position: absolute;
	top: 50%;
	left: 50%;
}

/* 上传器提示图标 */
.wc__uploader-panel .wc__uploader-tips i:before, .wc__uploader-panel .wc__uploader-tips i:after {
	content: "";
	background: #bebebe;
	border-radius: 20px;
	transform: translate(-50%, -50%);
	position: absolute;
	top: 30%;
	left: 50%;
}

/* 上传器提示图标竖线 */
.wc__uploader-panel .wc__uploader-tips i:before {
	height: 30px;
	width: 6px;
}

/* 上传器提示图标横线 */
.wc__uploader-panel .wc__uploader-tips i:after {
	height: 6px;
	width: 30px;
}


/* ============================================
   20. 禁止发言提示
   Talk Not Allowed Notice
   ============================================ */

/* 禁止发言提示 */
.wc__talk-notAllowed {
	background: #fff;
	color: #e64240;
	font-size: .28rem;
	text-align: center;
	padding: .15rem .2rem;
	line-height: .7rem;
}

/* 禁止发言提示顶部边框 */
.wc__talk-notAllowed:before {
	border-top-color: #d9d9d9;
}


/* ============================================
   21. 用户信息详情
   User Info Detail
   ============================================ */

/* 用户信息详情容器 */
.wc__ucinfo-detail {
	padding-bottom: .35rem;
}

/* 用户信息详情列表项 */
.wc__ucinfo-detail ul li {
	margin-top: .35rem;
}

/* 用户信息详情项 */
.wc__ucinfo-detail ul li .item {
	background: #fff;
	font-family: 'Microsoft Yahei';
	padding: .25rem .3rem;
	position: relative;
}

/* 用户信息详情项底部边框 */
.wc__ucinfo-detail ul li .item:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .3rem;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一项不显示边框 */
.wc__ucinfo-detail ul li .item:last-child::after {
	display: none;
}

/* 用户信息详情头像 */
.wc__ucinfo-detail ul li .item .uimg {
	display: block;
	margin-right: .4rem;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 8%;
}

/* 用户信息详情标签 */
.wc__ucinfo-detail ul li .item .lbl {
	color: #333;
	font-size: .28rem;
	min-width: 1.5rem;
}

/* 用户信息详情标签说明 */
.wc__ucinfo-detail ul li .item .lbl i {
	color: #aaa;
	display: block;
	font-size: .24rem;
	font-family: Verdana;
	margin-top: .1rem;
}

/* 用户信息详情内容 */
.wc__ucinfo-detail ul li .item .cnt {
	font-size: .24rem;
	line-height: .4rem;
}

/* 用户信息详情内容图片 */
.wc__ucinfo-detail ul li .item .cnt img {
	object-fit: cover;
	vertical-align: top;
	margin-right: .1rem;
	height: 1.1rem;
	width: 1.1rem;
}


/* ============================================
   22. 按钮面板
   Buttons Panel
   ============================================ */

/* 按钮面板容器 */
.wc__btns-panel {
	padding: 0 .3rem .3rem;
}

/* 按钮面板链接 */
.wc__btns-panel a {
	display: block;
	margin-bottom: .3rem;
}


/* ============================================
   23. 个人信息编辑
   Personal Info Edit
   ============================================ */

/* 个人信息列表项 */
.wc__ucinfo-personal ul li {
	margin-top: .35rem;
}

/* 个人信息项 */
.wc__ucinfo-personal ul li .item {
	background: #fff;
	font-family: 'Microsoft Yahei';
	padding: .25rem .3rem;
	position: relative;
}

/* 个人信息项底部边框 */
.wc__ucinfo-personal ul li .item:after {
	content: '';
	background-color: #e3e3e3;
	color: #e3e3e3;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .3rem;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一项不显示边框 */
.wc__ucinfo-personal ul li .item:last-child::after {
	display: none;
}

/* 个人信息头像 */
.wc__ucinfo-personal ul li .item .uimg {
	display: block;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 8%;
}

/* 个人信息标签 */
.wc__ucinfo-personal ul li .item .lbl {
	color: #333;
	font-size: .28rem;
}

/* 个人信息值输入框 */
.wc__ucinfo-personal ul li .item .val {
	background: transparent;
	border: none;
	color: #999;
	font-size: .24rem;
	outline: none;
	padding: .1rem 0;
	text-align: right;
}

/* 个人信息区域输入框 */
.wc__ucinfo-personal ul li .item .area {
	background: transparent;
	border: none;
	color: #999;
	font-size: .24rem;
	font-family: arial;
	outline: none;
	padding: .1rem 0;
}

/* 选择图片输入框 */
.wc__ucinfo-personal ul li .item .chooseImg {
	opacity: 0;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}


/* ============================================
   24. 钱包快捷功能
   Wallet Quick Functions
   ============================================ */

/* 钱包快捷功能列表项 */
.wc__wallet-quick ul li {
	padding: .5rem 0;
	text-align: center;
}

/* 钱包快捷功能项点击效果 */
.wc__wallet-quick ul li:active {
	background: #d1c08f!important;
}

/* 钱包快捷功能图标 */
.wc__wallet-quick ul li .icon {
	display: block;
	margin: 0 auto;
	height: .7rem;
	width: .7rem;
}

/* 钱包快捷功能文字 */
.wc__wallet-quick ul li .txt {
	color: #f8f8f8;
	display: block;
	font-size: .28rem;
	margin-top: .15rem;
}

/* 钱包快捷功能数字 */
.wc__wallet-quick ul li .txt .num {
	color: #fff;
	display: block;
	font-size: .32rem;
	font-family: verdana;
}


/* ============================================
   25. 钱包服务
   Wallet Services
   ============================================ */

/* 钱包服务容器 */
.wc__wallet-services {
	margin-top: .1rem;
}

/* 钱包服务标题 */
.wc__wallet-services .tit {
	font-size: .28rem;
	padding: .2rem;
}

/* 钱包服务列表 */
.wc__wallet-services ul {
	border-top: 1px solid #e9e9e9;
	flex-wrap: wrap;
}

/* 钱包服务列表项 */
.wc__wallet-services ul li {
	border-left: 1px solid #e9e9e9;
	border-bottom: 1px solid #e9e9e9;
	padding: .3rem 0;
	text-align: center;
	min-width: 33.3%;
	max-width: 33.3%;
	width: 33.3%;
}

/* 每行第一个服务项不显示左边框 */
.wc__wallet-services ul li:nth-of-type(3n+1) {
	border-left: 0;
}

/* 钱包服务图标 */
.wc__wallet-services ul li .icon {
	display: block;
	margin: 0 auto;
	height: .5rem;
	width: .5rem;
}

/* 钱包服务文字 */
.wc__wallet-services ul li .txt {
	color: #333;
	display: block;
	font-size: .28rem;
	margin-top: .15rem;
}


/* ============================================
   26. 零钱页面
   Change Page
   ============================================ */

/* 零钱页面容器 */
.wc__wallet-lingqian {
	text-align: center;
}

/* 零钱页面图标 */
.wc__wallet-lingqian .icon {
	display: block;
	margin: .5rem auto 0;
	height: 1.5rem;
	width: 1.5rem;
}

/* 零钱页面文字 */
.wc__wallet-lingqian p {
	color: #333;
	font-size: .28rem;
	margin-top: .1rem;
}

/* 零钱页面数字 */
.wc__wallet-lingqian p.num {
	font-size: .6rem;
	font-family: verdana;
}

/* 零钱页面按钮面板 */
.wc__wallet-lingqian .wc__btns-panel {
	margin-top: .5rem;
}

/* 零钱页面按钮 */
.wc__wallet-lingqian .wc__btns-panel a {
	font-size: .3rem;
}


/* ============================================
   27. 银行卡列表
   Bank Card List
   ============================================ */

/* 银行卡列表容器 */
.wc__bankCard-list ul {
	padding-top: .2rem;
}

/* 银行卡列表项 */
.wc__bankCard-list ul li {
	background: #c64f58;
	border-radius: .07rem;
	margin: .15rem .15rem 0;
	height: 2rem;
}

/* 银行卡Logo容器 */
.wc__bankCard-list ul li .bklogo {
	background: rgba(255,255,255,.7);
	border-radius: 50%;
	margin: .3rem .1rem 0 .3rem;
	overflow: hidden;
	padding: .1rem;
	height: .725rem;
	width: .725rem;
}

/* 银行卡信息容器 */
.wc__bankCard-list ul li .bkinfo {
	padding-top: .3rem;
}

/* 银行卡名称 */
.wc__bankCard-list ul li .bkinfo h2 {
	color: #fff;
	font-size: .28rem;
}

/* 银行卡类型 */
.wc__bankCard-list ul li .bkinfo h5 {
	color: #ddd;
	font-size: .24rem;
}

/* 银行卡号 */
.wc__bankCard-list ul li .bkinfo .bknum {
	color: #fff;
	display: block;
	font-size: .36rem;
	font-family: arial;
	margin-top: .15rem;
}

/* 添加银行卡按钮 */
.wc__bankCard-add {
	background: url(../img/icon__add.png) no-repeat .3rem center;
	background-size: .45rem;
	color: #fff;
	font-size: .32rem;
	margin: .5rem 0;
	padding-left: .9rem;
	height: 1rem;
}

/* 添加银行卡按钮底部边框 */
.wc__bankCard-add.wc__borB:after {
	border-bottom-color: #4a4f58;
}

/* 添加银行卡按钮点击效果 */
.wc__bankCard-add:active {
	background-color: #4a4f58!important;
}


/* ============================================
   28. 收款二维码
   Receivables QR Code
   ============================================ */

/* 收款二维码容器 */
.wc__receivables-qrcode {
	background: #fff;
	border-radius: .05rem;
	margin: .2rem;
}

/* 收款二维码头部 */
.wc__receivables-qrcode .head {
	background: #f8f8f8;
	border-top-left-radius: .05rem;
	border-top-right-radius: .05rem;
	height: 1rem;
}

/* 收款二维码头部标签 */
.wc__receivables-qrcode .head .lbl {
	background: url(../img/wallet/icon__wallet-shoukuan-color.png) no-repeat .2rem center;
	background-size: .5rem;
	color: #ccae56;
	font-size: .28rem;
	padding-left: .9rem;
}

/* 收款二维码头部说明图标 */
.wc__receivables-qrcode .head .intro {
	background: url(../img/icon__dot.png) no-repeat center;
	background-size: .5rem;
	display: block;
	height: 1rem;
	width: 1rem;
}

/* 收款二维码内容区域 */
.wc__receivables-qrcode .cnt .pay-qrcode {
	padding: .5rem 0;
	text-align: center;
}

/* 收款二维码图片 */
.wc__receivables-qrcode .cnt .pay-qrcode .qrcode {
	width: 3rem;
}

/* 收款二维码底部 */
.wc__receivables-qrcode .foot {
	padding: .3rem .2rem;
	position: relative;
}

/* 收款二维码底部顶部边框 */
.wc__receivables-qrcode .foot:before {
	content: '';
	border-top: 1px solid #e9e9e9;
	color: #d9d9d9;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .3rem;
	top: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 收款二维码底部银行图标 */
.wc__receivables-qrcode .foot .img-bank {
	height: .4rem;
	width: .4rem;
	margin-right: .2rem;
}

/* 收款二维码底部标题 */
.wc__receivables-qrcode .foot h2 {
	color: #333;
	font-size: .28rem;
}

/* 收款二维码底部副标题 */
.wc__receivables-qrcode .foot h5 {
	color: #999;
	font-size: .2rem;
}


/* ============================================
   29. 收款列表
   Receivables List
   ============================================ */

/* 收款列表容器 */
.wc__receivables-list {
	margin: .2rem .2rem .5rem;
}

/* 收款列表 */
.wc__receivables-list ul {
	background: #d1bf88;
	border-radius: .05rem;
}

/* 收款列表项 */
.wc__receivables-list ul li {
	position: relative;
}

/* 收款列表项底部边框 */
.wc__receivables-list ul li:after {
	content: '';
	border-bottom: 1px solid #e4d6ad;
	color: #d9d9d9;
	height: 1px;
	width: auto;
	position: absolute;
	left: .3rem;
	right: .3rem;
	bottom: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 最后一项不显示边框 */
.wc__receivables-list ul li:last-child:after {
	display: none;
}

/* 收款列表项内容 */
.wc__receivables-list ul li .item {
	font-family: 'Microsoft Yahei';
	padding: .15rem .3rem;
	min-height: 1.1rem;
	position: relative;
}

/* 收款列表项点击效果 */
.wc__receivables-list ul li .item:active {
	background-color: #d6c48e!important;
}

/* 收款列表项标签 */
.wc__receivables-list ul li .item .lbl {
	color: #fff;
	font-size: .28rem;
	min-width: 1.5rem;
}


/* ============================================
   30. 群成员列表
   Group Member List
   ============================================ */

/* 群成员列表容器 */
.wc__ucinfo-qunMember {
	padding: 0 .15rem;
}

/* 群成员列表项 */
.wc__ucinfo-qunMember ul li {
	float: left;
	text-align: center;
	margin-top: .3rem;
	width: 20%;
}

/* 群成员头像 */
.wc__ucinfo-qunMember ul li .uimg {
	height: 1.1rem;
	width: 1.1rem;
	object-fit: cover;
	border-radius: 8%;
}

/* 群成员名称 */
.wc__ucinfo-qunMember ul li .name {
	color: #999;
	display: block;
	font-size: .24rem;
	margin-top: .05rem;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}


/* ============================================
   31. 朋友圈
   Friend Zone
   ============================================ */

/* 朋友圈头部 */
.wc__friendZone .head {
	height: 5rem;
	position: relative;
}

/* 朋友圈封面图片 */
.wc__friendZone .head .cover {
	height: 5rem;
	width: 100%;
	object-fit: cover;
	position: absolute;
	left: 0;
	top: 0;
}

/* 朋友圈用户名 */
.wc__friendZone .head .uname {
	color: #fff;
	font-size: .3rem;
	font-weight: 700;
	text-shadow: 0 1px 1px #000;
	padding-left: .3rem;
	text-align: right;
	position: absolute;
	right: 2.3rem;
	bottom: .2rem;
}

/* 朋友圈头像 */
.wc__friendZone .head .avator {
	background: #fff;
	display: block;
	padding: 2px;
	height: 1.8rem;
	width: 1.8rem;
	position: absolute;
	right: 10px;
	bottom: -.6rem;
}

/* 朋友圈头像图片 */
.wc__friendZone .head .avator img {
	display: block;
	height: 100%;
	width: 100%;
}

/* 朋友圈内容区域 */
.wc__friendZone .cont .inner {
	padding: .2rem 0 .1rem;
}


/* ============================================
   32. 评论列表
   Comment List
   ============================================ */

/* 评论列表项 */
.wc__cmtlist li {
	padding: .2rem 0;
	position: relative;
}

/* 评论列表项顶部边框 */
.wc__cmtlist li:before {
	content: '';
	border-top: 1px solid #d9d9d9;
	color: #d9d9d9;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	transform: scaleY(0.5);
	-webkit-transform: scaleY(0.5);
}

/* 第一个评论项 */
.wc__cmtlist li:first-child {
	margin-top: .5rem;
}

/* 第一个评论项不显示顶部边框 */
.wc__cmtlist li:first-child:before {
	display: none;
}

/* 评论头像容器 */
.wc__cmtlist li .wrap-avt {
	margin: 0 .2rem;
}

/* 评论头像图片 */
.wc__cmtlist li .wrap-avt img {
	height: .8rem;
	width: .8rem;
}

/* 评论内容容器 */
.wc__cmtlist li .wrap-cmt {
	padding-left: 1.2rem;
	padding-right: .2rem;
}

/* 评论用户名 */
.wc__cmtlist li .wrap-cmt .u-name {
	color: #576b95;
	font-size: .28rem;
	margin-top: .05rem;
}

/* 评论内容 */
.wc__cmtlist li .wrap-cmt .post__cnt {
	color: #333;
	font-size: .28rem;
	margin-top: .05rem;
	padding-bottom: .2rem;
	line-height: .32rem;
}

/* 评论内容中的图片 */
.wc__cmtlist li .wrap-cmt .post__cnt img {
	float: left;
	margin-right: .1rem;
	margin-top: .15rem;
	max-height: 3rem;
	max-width: 3rem;
}

/* 评论内容中的图片列表 */
.wc__cmtlist li .wrap-cmt .post__cnt .list-img {
	object-fit: cover;
	max-height: 1.5rem;
	max-width: 1.5rem;
	height: 1.5rem;
	width: 30%;
}

/* 评论回复框容器 */
.wc__cmtlist li .wrap-cmt .reply__box {
	position: relative;
}

/* 评论回复按钮 */
.wc__cmtlist li .wrap-cmt .reply__box .btn-reply {
	background: url(../img/wchat/icon__wcZone-cmts.png) no-repeat center;
	background-size: .4rem;
	height: .4rem;
	width: .4rem;
}

/* 评论回复按钮点击效果 */
.wc__cmtlist li .wrap-cmt .reply__box .btn-reply:active {
	opacity: .7;
}

/* 评论操作菜单 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox {
	display: none;
	background: #313131;
	border-radius: .07rem;
	margin-top: -.1rem;
	overflow: hidden;
	height: .6rem;
	position: absolute;
	top: 0;
	right: .6rem;
}

/* 评论操作菜单项 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a {
	color: #ccc;
	float: left;
	font-size: .24rem;
	text-align: center;
	line-height: .62rem;
	width: 1.5rem;
	position: relative;
}

/* 评论操作菜单项点击效果 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a:active {
	background: #515151;
}

/* 评论操作菜单项分割线 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a:first-child:after {
	content: '';
	border-right: 1px solid #515151;
	position: absolute;
	right: 0;
	top: .12rem;
	bottom: .12rem;
}

/* 评论操作菜单图标 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a i {
	display: inline-block;
	vertical-align: top;
	margin: .15rem .1rem 0 0;
	height: .3rem;
	width: .3rem;
}

/* 点赞图标 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a.like i {
	background: url(../img/wchat/icon__wcZone-like-white.png) no-repeat center;
	background-size: cover;
}

/* 评论图标 */
.wc__cmtlist li .wrap-cmt .reply__box .wc__cmtbox a.cmt i {
	background: url(../img/wchat/icon__wcZone-cmt-white.png) no-repeat center;
	background-size: cover;
}

/* 评论箭头 */
.wc__cmtlist li .wrap-cmt .arr {
	border-bottom: 8px solid #e9e9e9;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	margin: 5px 0 0 10px;
	width: 1px;
}

/* 评论底部区域 */
.wc__cmtlist li .wrap-cmt .cmt-bd {
	background: #e9e9e9;
	width: 100%;
}

/* 点赞区域 */
.wc__cmtlist li .wrap-cmt .cmt-bd .like {
	background: url(../img/wchat/icon__wcZone-like.png) no-repeat .18rem .12rem;
	background-size: .3rem;
	color: #576b95;
	padding: .1rem .1rem 0 .6rem;
}

/* 回复列表 */
.wc__cmtlist li .wrap-cmt .cmt-bd .reply-list {
	color: #333;
	padding: .1rem;
}

/* 回复列表段落 */
.wc__cmtlist li .wrap-cmt .cmt-bd .reply-list p {
	padding-top: .05rem;
}

/* 回复列表中的用户名 */
.wc__cmtlist li .wrap-cmt .cmt-bd .reply-list p span {
	color: #3b5384;
}


/* ============================================
   33. 登录注册面板
   Login/Register Panel
   ============================================ */

/* 登录注册面板标题提示 */
.wc__lgregPanel .hdtips {
	color: #333;
	font-size: .4rem;
	padding: 1rem .3rem .5rem;
}

/* 登录注册表单 */
.wc__lgregPanel .forms {
	margin: 0 .2rem;
}

/* 登录注册表单列表项 */
.wc__lgregPanel .forms ul li {
	position: relative;
}

/* 登录注册表单标签 */
.wc__lgregPanel .forms ul li .lbl {
	display: block;
}

/* 登录注册表单标签文字 */
.wc__lgregPanel .forms ul li .lbl em {
	color: #333;
	font-size: .28rem;
	display: block;
	padding-left: .15rem;
	min-width: 1.5rem;
	line-height: .35rem;
	position: absolute;
	left: 0;
	top: .4rem;
}

/* 登录注册表单输入框 */
.wc__lgregPanel .forms ul li .lbl .iptxt {
	background: none;
	border: 0;
	border-bottom: 1px solid #d9d9d9;
	font-size: .28rem;
	padding-left: 1.5rem;
	height: 1.1rem;
	width: 100%;
	transition: border-color .3s;
}

/* 登录注册表单输入框聚焦效果 */
.wc__lgregPanel .forms ul li .lbl .iptxt:focus {
	border-bottom-color: #12b7f5;
}

/* 登录方式链接 */
.wc__lgregPanel .forms .lgway {
	padding: .2rem .15rem 0;
}

/* 登录方式链接样式 */
.wc__lgregPanel .forms .lgway a {
	color: #22a7ff;
	font-size: .28rem;
}

/* 登录注册按钮容器 */
.wc__lgregPanel .forms .btns {
	padding: 1rem .1rem;
}

/* 登录按钮 */
.wc__lgregPanel .forms .btns .btn__login {
	font-size: .36rem;
}

/* 登录注册底部 */
.wc__lgregFoot {
	text-align: center;
	padding: .2rem 0;
}

/* 登录注册底部列表 */
.wc__lgregFoot ul {
	display: inline-block;
	vertical-align: top;
}

/* 登录注册底部列表项 */
.wc__lgregFoot ul li {
	border-left: 1px solid #d9d9d9;
	float: left;
	padding: 0 .2rem;
}

/* 第一个底部列表项不显示左边框 */
.wc__lgregFoot ul li:first-child {
	border-left: 0;
}

/* 登录注册底部链接 */
.wc__lgregFoot ul li a {
	color: #666;
	font-size: .24rem;
}


/* ============================================
   34. 图片预览弹窗
   Image Preview Popup
   ============================================ */

/* 图片预览弹窗容器 */
.wc__popup-imgPreview {
	background: rgba(0,0,0,1);
	height: 100%;
	width: 100%;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 2003;
}

/* 图片预览滑动容器 */
.wc__popup-imgPreview .swiper-container {
	height: 100%;
	max-width: 750px;
}

/* 图片预览幻灯片 */
.wc__popup-imgPreview .swiper-slide {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	align-items: center;
}

/* 图片预览图片 */
.wc__popup-imgPreview .swiper-slide img {
	max-height: 100%;
	max-width: 100%;
	width: 100%;
	transition: all .3s;
	transform: scale(.8);
}

/* 激活状态的图片预览 */
.wc__popup-imgPreview .swiper-slide-active img {
	transform: scale(1);
}


/* ============================================
   35. 视频预览弹窗
   Video Preview Popup
   ============================================ */

/* 视频预览弹窗容器 */
.wc__popup-videoPreview {
	background: rgba(0,0,0,1);
	height: 100%;
	width: 100%;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 2003;
}

/* 视频预览顶部渐变遮罩 */
.wc__popup-videoPreview:after {
	content: '';
	background-image: linear-gradient(-180deg,  rgba(0,0,0,.6), transparent);
	height: 1.2rem;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/* 视频预览关闭按钮 */
.wc__popup-videoPreview .wc__videoClose {
	margin-left: -.25rem;
	height: .5rem;
	width: .5rem;
	position: absolute;
	top: .3rem;
	left: 50%;
	z-index: 2003;
}

/* 视频预览关闭按钮图标 */
.wc__popup-videoPreview .wc__videoClose:before, .wc__popup-videoPreview .wc__videoClose:after {
	content: "";
	background: #fff;
	transform: translate(50%, -50%) rotate(45deg) scale(.9);
	position: absolute;
	top: 50%;
	right: 50%;
}

/* 视频预览关闭按钮竖线 */
.wc__popup-videoPreview .wc__videoClose:before {
	height: .5rem;
	width: 2px;
}

/* 视频预览关闭按钮横线 */
.wc__popup-videoPreview .wc__videoClose:after {
	height: 2px;
	width: .5rem;
}


/* ============================================
   36. 键盘面板
   Keyboard Panel
   ============================================ */

/* 键盘面板容器 */
.keyboardPanel {
	max-width: 750px;
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 10005;
}

/* 键盘结果显示 */
.keyboardPanel .keyboard-result {
	background: #f8f8f8;
	border-top: 1px solid #e9e9e9;
	color: #00c1de;
	font-size: .28rem;
	font-weight: 700;
	text-align: center;
	height: .5rem;
	line-height: .5rem;
}

/* 键盘关闭按钮 */
.keyboardPanel .keyboard-xclose {
	background: url(../img/icon__keyboard-xclose.png) no-repeat center #f8f8f8;
	background-size: .4rem;
	height: .5rem;
	border-top: 1px solid #e9e9e9;
}

/* 键盘关闭按钮点击效果 */
.keyboardPanel .keyboard-xclose:active {
	background-color: #e9e9e9;
}

/* 键盘按钮列表 */
.keyboardPanel ul {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	display: -ms-flexbox;
	align-items: center;
	flex-wrap: wrap;
}

/* 键盘按钮项 */
.keyboardPanel ul li {
	background: #fff;
	border-left: 1px solid #e9e9e9;
	border-top: 1px solid #e9e9e9;
	color: #333;
	font-size: .5rem;
	font-family: arial;
	text-align: center;
	text-align: center;
	height: 1.25rem;
	line-height: 1.25rem;
	min-width: 33.3%;
	width: 33.3%;
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

/* 每行第一个按钮不显示左边框 */
.keyboardPanel ul li:nth-of-type(3n+1) {
	border-left: 0;
}

/* 删除按钮 */
.keyboardPanel ul li.del {
	background: url(../img/icon__keyboard-del.png) no-repeat center;
	background-size: .64rem;
}

/* 浮动和删除按钮背景 */
.keyboardPanel ul li.float, .keyboardPanel ul li.del {
	background-color: #f8f8f8;
}

/* 键盘按钮点击效果 */
.keyboardPanel ul li:active {
	background-color: #e9e9e9;
}