dudao_uniapp/pages/content/MediaList/MediaList.vue

<template>
	<view class="bg">
		<!-- 轮播 -->
		<view class="swipercontent ">
					<view class='swiper-img'>
						<image :src="typeconfig.banner" class="slide-image" mode="widthFix" />
					</view>
		</view>
		<!--内容区域  -->
		<view class="content">
	

			<view class="cont-title ">
				<view class="dtitle" style="margin-top: 76upx;">
					<!-- <image class="limg" src="../../../static/images/ling.png" mode=""></image> -->
					<view class="title">
						读道公众号都有什么？
					</view>
					<!-- <image class="limg" src="../../../static/images/ling.png" mode=""></image> -->
				</view>
				<view class="ftitle">
					公众号资源（{{typeconfig.num}}个微信公众号）
				</view>
				
				

			</view>
			
			<view class="content-list"    v-for="(item, index) in typeContent" :key="index">
				<view class="weiixn-gzh " :class="'lin'+index">{{item.name}}</view>
				
				<view class="content-cont">

				<view class="list-ul" v-for="(items, indexs) in item.data" :key="indexs" @tap="weJump(items.ercode,items.link)">
					<view class="list-li">
						<view class="list-pic">
							<image :src="items.pic" mode=""></image>
						</view>
						<view class="list-title">{{items.name}}</view>
						<!-- <view class="list-desc">点击了解详情</view> -->
						
					</view>
				</view>
				
				</view>


			</view>


		</view>


		<view class="footer">
			<view class="footer-cont">
				<view class="footer-btn">

					<view class="btn-title">
						<label class="btn-title-sz"> {{configbut_name0}}</label>
						<label class="btn-title-sz1"> {{configbut_name1}}</label>
						<text class=""></text>
					</view>

					<view class="btn-fdesc">{{config.but_title}}<text></text></view>
				</view>

				<view class="logocont">
					<view class="logos">
						<image class="logo" src="../../../static/images/icon_i.png" mode=""></image>
						<view class="logo-text">
							<text v-for="(item, index) in config.account" :key="index">{{item}}</text>
						</view>
					</view>

					<view class="code">
						<image class="codePic" :src="catePic" mode=""></image>
						<view class="codetext"><text class="codetext-s"> 长按二维码 获取更多</text> <text class="codetext-a">超级创意</text> </view>
					</view>
				</view>

			</view>


			<!-- 底部标签 -->
			<view class="business">
				<view class="businesscard">


							<image class="pic" :src="config.tel_pic" mode=""></image>
							<view class="cont">

								<view class="bus-cont">
									<view class="title1">{{config.but_count}} <text></text> </view>

									<view class="tel">
										<label class="tel-num">{{config.name}}:</label>
										<label class="tel-txt">{{config.phone}}</label>
										<text></text>
									</view>
									<view class="tel">
										<label class="tel-num">座&ensp;机:</label>
										<label class="tel-txt">{{config.tel}}</label>
										<text></text>
									</view>

									<view class="bus-desc">{{config.but_flag}}<text></text></view>
								</view>

							</view>

					<view class="rights1" @tap="tel">
						<image class="ri-tel" src="../../../static/images/phone.gif" mode=""></image>
						<!-- <view class="ri-tel">立即咨询</view> -->
					</view>

				</view>
			</view>



		</view>
		
		<view class="mark" v-show="isShow">
			<view class="mark-content">
				<view class="mark-relative">
					<!--  41upx -->
					<!-- <image class="mark-dj" :style="{'left':Ju+'rpx'}" src="../../static/images/dj.png" mode=""></image> -->
					<image class="mark-del" @tap="cancat" src="../../../static/images/del.png" mode=""></image>
					<view class="">
		                 <image class="qercode" :src="ercode" mode=""></image>
		
					</view>
				</view>
			</view>
		</view>
		
		



	</view>
</template>

<script>
	var graceRichText = require("../../../components/richText.js");
	import share from '../../../components/share2.js'

	//#ifdef H5
	   import jquery from '@/components/h5Shsre/jquery-3.5.1.min.js';
		var jweixin = require('jweixin-module')
		import Dever_Share from '@/components/h5Shsre/share.js';
		//#endif


	export default {
		data() {
			return {
				swiperCurrent: 0,
				pic: [],
				top: '',
				
				tabnum: 4,
				currentTab: 0, //预设当前项的值
				navScrollLeft: 0,
				currentTabs: 0,
				scrollLeft: 0, //tab标题的滚动条位置
				scrollTop: 0,
				account: [],
				phine: '',
				cate: [],
				listCase: [],
				cateid: '',
				desc: '',
				id: '',
				catePic: '',
				shares: '',
				config: '',
				type: '',
				poster:'',
				wechat:'',
				
				typeContent:[],
				typeconfig:'',
				isShow: false,
				ercode:'',
				configbut_name0:'',
				configbut_name1:''

			}
		},
		onLoad(e) {
			
			var that = this;
			console.log(2222, e)

			if (e) {
				that.type = e.type
				that.id = e.id
			}
			this.swiperChange = function(event) {
				var that = this;
				this.swiperCurrent = event.detail.current;
			}
			

			wx.loadFontFace({
				family: 'MFJinHei',
				source: 'url("https://trade.5dev.cn/cmmc/main/assets/mobile/css/MFJinHei_Noncommercial-Regular1.ttf")',
				// family: 'MFJinHei',
				// source: 'url("https://trade.5dev.cn/cmmc/main/assets/mobile/css/mfjin.TTF")',
				success: console.log
			})
			
			this.getap()
			this.share()

		},
		
		onShow() {
			
		},
		
		
		onShareAppMessage(e) {
		
			var that = this;
			console.log(111, e)
		
			// var pic = that.myshopShare.pic;
			var scene = uni.getStorageSync('scene', scene);
			return share.share('/pages/taBbar/Home/Home?id=' + this.config.id ,
				this.shares.home_name, this.shares.home_pic, 9)
		},
		
		methods: {
			
			ThePublicNumber(){
				uni.navigateTo({
					url:'../../content/ThePublicNumber/ThePublicNumber'
				})
			},

			share() {
				var that = this;
				var params = new Object()
				uni.request({
					// url: 'https://trade.5dev.cn/dudaowenlv/content/?l=api.share',
					url: this.host + 'api.share',
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success(res) {
						that.shares = res.data.data
						
						// //#ifdef H5

						// let button = false;
						//  let uid = -1;
						//  let project = 111;
						//  let url = "http://cm.5dev.cn/wechat/share/?api.";
						//  let param = {
						//    title:'11111111111111',
						//    img: res.data.data.home_pic,
						//    desc:'222222222222',
						//    url: window.location.href
						//  };
						// console.log(89897, param);	
							
						// Dever_Share.Init(uid, project, url, param, button);	
						// //#endif
						
						console.log(2222, res)
					}
				})
			},
			getap() {
				var that = this;
				var params = new Object()
				params.type_id = 1;
				uni.showLoading({
					title: '加载中'
				});
				uni.request({
					// url: 'https://trade.5dev.cn/dudaowenlv/content/?api.home',
					// http://www.dudaowenlv.com/dudaowenlv/content/?l=
					url: this.host + 'l=api.getMediaList',
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success(res) {
						
						 console.log(444444,res)
						 
						 that.typeContent=res.data.data.cate;
						 
						 that.configbut_name0 = res.data.data.config.but_name[0];
						 that.configbut_name1 = res.data.data.config.but_name[0]
						 
						that.pic = res.data.data.config.pic.split(",")
						that.top = res.data.data.config.top
						that.config = res.data.data.config
						that.typeconfig =res.data.data.type
						that.account = res.data.data.config.account
						that.catePic = res.data.data.config.code
						
						var mob = res.data.data.config.phone;
						that.phine = mob.replace(/(\d{3})(\d{4})/, "$1  $2  ");
						
						uni.hideLoading();
						uni.hideNavigationBarLoading();
						uni.stopPullDownRefresh(); //得到数据后停止下拉刷新	
						
					}
				})
			},
			
			
		weJump(ercode, link) {
			if(link == '' && ercode != ''){
				this.ercode=ercode
				this.isShow=true;
			}else if(link == '' && ercode == ''){
				
				// return;
			}else{
				//#ifdef H5
				window.location.href=link;
				//#endif
			}
			
			
		},
			
			cancat(){
				this.isShow=false;
			},
					
			
			
			cateList() {
				var that = this;
				console.log(111136, that.cateid)
				uni.navigateTo({
					url: '../../content/List/List?cateid=' + that.cateid
				})
			},
			list(event) {
				// event.currentTarget.dataset.id
				// console.log(22222,event.currentTarget.dataset.id)
				var id = event.currentTarget.dataset.id
				uni.navigateTo({
					url: '../../content/List-dl/List-dl?id=' + id
				})
			},

			tel() {
				var that = this;
				uni.makePhoneCall({
					phoneNumber: that.phine
				});
			}

		}
	}
</script>

<style lang="less">
	body{
		font-size: 6px;
		}

	.weiixn{
		overflow: hidden;
		_zoom:1;
		padding: 20rpx 0rpx;
		background: #FFFFFF;
	}
	.weiixn-pic1{
		float: left;
		width:375rpx;
		height: auto;
		display: block;
	}
	.weiixn-pic2{
		float: right;
		width: 375rpx;
		height: auto;
		display: block;
	}
	.bg {
		// background: #f7f7f7;
	}

	/* 轮播自定义样式 */
	.swipercontent {
		position: relative;
	}

	.swiper-box {
		background: #fff;
	}

	.slide-image {
		width: 100%;
		height: 454upx;
		display: block;
	}

	.swiper-box .uni-swiper-dots {
		position: absolute;
		margin: 0 auto !important;
		top: 316upx;
	}

	.swiper-box .uni-swiper-dot {
		width: 19upx;
		display: inline-flex;
		height: 7upx;
		margin-right: 20upx;
		justify-content: space-between;
	}

	.swiper-box .uni-swiper-dot::before {
		content: '';
		flex-grow: 1;
		background: #e0e0e0;
	}

	.swiper-box .uni-swiper-dot-active::before {
		background: #2f2f2f;
		border-radius: 4upx;
	}

	.swipercontent {
		position: relative;
	}

	.dots {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0upx;
		display: flex;
		justify-content: center;
	}

	.dot {
		margin: 0 8upx;
		width: 21upx;
		height: 9upx;
		background: #333;
		border-radius: 16upx;
	}

	.dot.active {
		width: 21upx;
		background: #dfdfdf;
	}

	/* 结束 */

	/* 内容 */


	.introduce {
		/* 	font-size: 30upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		padding: 55upx 34upx; */
		
		/* background: #ED7D31; */
		margin-top: 24upx;
		
		background: #ED7D31;
		color: #FFFFFF;

	}

	.grace-rich-text {
		font-size: 24upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		line-height: 45upx;
		/* color: rgba(51, 51, 51, 1); */
		padding: 45upx 55upx;
	}



	/* tab切换列表 */

	/* 列表 */
	.listening {
		// background: #FFFFFF;
		padding-bottom: 48upx;
	}

	.list {
		margin: 0 12upx;
		// padding-top: 31upx;
		/* display:flex; */
		overflow: hidden;
		_zoom: 1;
		// margin-bottom: 61upx;
	}

	.listcent {
		margin-left: 66upx;
		float: left;
	
		
		
		width: 268upx;
		height: 245upx;
		background: #FFFFFF;
		border: 1upx solid #DBDBDB;
		margin-bottom: 30upx;
		// box-sizing: border-box;
	}

	.listPic {
		display: block;
		width: 268upx;
		height: 170upx;
		// border-radius: 10upx 10upx 0px 0px;
	}

	/*  */
	.biaot {
		background: #fff;
		text-align: center;
		
	}

	.bt {
		font-size: 18upx;
		line-height: 18upx;
		font-family: PingFang-SC-Regular;
		font-weight: bold;
		color: #333333;
		padding: 16upx 0upx 8upx 0upx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;

	}
	.bts{
		margin: 0 auto !important;
	}
	

	.xianq {
		overflow: hidden;
		_zoom: 1;
		margin: 0 81upx;
	}

	.text {
		font-size: 24upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		color: rgba(102, 102, 102, 1);
		float: left;
	}

	.jt {
		width: 14upx;
		height: 16upx;
		float: right;
		display: block;
		margin-top: 11upx;

	}

	.btn {
		padding-bottom: 82upx;
	}

	.btn-cont {
		margin: 0 155upx;

		height: 70upx;
		background: #f4f4f4;
		/* box-shadow:3upx 5upx 134upx 7upx rgba(7,7,7,0.13); */
		/* opacity:0.2; */
		border-radius: 35upx;
		overflow: hidden;
		_zoom: 1;
		padding: 0 107upx;
	}

	.anli {
		font-size: 30upx;
		font-family: PingFang-SC-Regular;
		font-weight: bold;
		color: rgba(102, 102, 102, 1);

		line-height: 70upx;
		float: left;
	}

	.gd {
		width: 30upx;
		height: 29upx;
		float: right;
		margin-top: 22upx;

	}

	.footer-cont {
		padding: 72upx 73upx 37upx 86upx;
		background: #FFFFFF;
	}

	.tag {
		overflow: hidden;
		_zoom: 1;
	}

	.labels {
		overflow: hidden;
		_zoom: 1;
		float: left;
		/* display: inline-block; */
		/* display: flex; */
	}

	.label {
		font-size: 26upx;
		font-family: SourceHanSansCN-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		float: left;
	}

	.lxian {
		font-size: 26upx;
		font-family: SourceHanSansCN-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		float: left;
		margin: 0 4upx;
	}

	.labels:last-child .lxian {
		font-size: 0upx;
		float: left;
		margin: 0;
	}

	.labels:first-child .lxian {
		font-size: 0upx;
		float: left;
		margin: 0;
	}



	.telpic {
		width: 37upx;
		height: 41upx;
		float: left;
		display: block;
		margin-right: 20upx;
	}

	.laos {
		/* font-family: MFJinHei; */
		/* font-weight: bold; */
		font-size: 34upx;
		color: #FFFFFF;
		float: left;
	}

	.phine {
		/* font-family: MFJinHei; */
		letter-spacing: 2upx;
		/* font-weight: bold; */
		font-size: 34upx;
		color: #FFFFFF;
		float: left;
	}

	.bohao {
		width: 36upx;
		height: 40upx;
		display: block;
		float: left;
		margin-left: 38upx;
		margin-top: 5upx;

	}



	.tjt {
		width: 39upx;
		height: 28upx;
		display: block;
		float: left;
		margin-left: 12upx;
		margin-top: 12upx;

	}






	.footer-btn {
		width: 100%;
	}

	.footer-btn view {

		text-align: justify;
		display: inline-block;
		text-align-last: justify;
		text-justify: inter-ideograph;
		vertical-align: top;
	}

	.footer-btn view text {
		display: inline-block;
		height: 0;
		width: 100%
			/* 换行 */
	}
	.btn-title {
		display: flex;
		font-size: 58upx;
		font-family: Source Han Sans CN;
		font-weight: 800;
		color: rgba(220, 66, 66, 1);
		line-height: 58upx;
		margin-bottom: 14rpx;
		height: 58rpx;
		width: 100%;
	}
	.btn-title-sz {
		color: #ED7D31;

	}

	.btn-title-sz1 {
		color: #211717;

	}

	.btn-fdesc {
		width: 100%;
		font-size: 32upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 32upx;
		height: 32rpx;
		text-align: center;
		margin-bottom: 24rpx;
	}

	.logocont {
		overflow: hidden;
		_zoom: 1;
		/* margin-top: 42upx; */
	}

	.logos {
		float: left;
		width: 352upx;
		margin-top: 15upx;
	}

	.logo {
		width: 324upx;
		height: 160upx;
		display: block;
		margin: 0 auto;

	}

	.logo-text {
		text-align: center;
		font-size: 28upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 28upx;
		margin-top: 20rpx;
	}

	.code {
		float: right;
	}

	.codePic {
		width: 210upx;
		height: 210upx;
		display: block;

	}

	.codetext {
		text-align: center;
		font-size: 16upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 16upx;
	}

	.codetext-s {
		color: #333333;
	}

	.codetext-a {
		color: #ED7D31;
	}



	@keyframes move {

		0%,
		5% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		15% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		25% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		35% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		45% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		55% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		60% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		65% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		70% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		75% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		80% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		85% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		90% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		95% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		100% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	}

	.tjt {
		animation: move 1s 0s infinite;
		-webkit-animation: move 1s 0s infinite;
	}


	.tjt {
		position: relative;
		animation: myfirst 1s 0s infinite;
		-webkit-animation: myfirst 1s linear 1s infinite alternate;
	}

	@keyframes myfirst {
		0% {
			left: 0px;
		}

		25% {
			left: 3px;
		}

		50% {
			left: 6px;
		}

		75% {
			left: 3px;
		}

		100% {
			left: 0px;
		}
	}



	/* 底部 */

	.business {
		width: 100%;
		background: #ED7D31;



	}

	.businesscard {
		height: 190upx;
		overflow: hidden;
		_zoom: 1;
		padding: 0 42upx 0 53upx;
		display: flex;

	}

	.left {

	}

	.rights1 {

		margin-top: 13upx;
		margin-left: 10rpx;
	}

	.ri-tel {
		width: 103upx;
		height: 173upx;
		display: block;
	}

	.phone {
		overflow: hidden;
		_zoom: 1;
		display: flex;
	}

	.pic {
		width: 154upx;
		height: 154upx;
		/* border-radius: 50%; */
		display: block;
		margin: 18upx 20upx 0 0upx;
		display: block;
		/* margin-bottom: 17upx; */

	}

	.bus-cont view{
	/* 	text-align: justify;
		text-align-last: justify; */
		text-align: justify;
		display: inline-block;
		text-align-last: justify;
		text-justify: inter-ideograph;
		vertical-align: top;
		width: 100%;
		margin-bottom: 10upx;
		
	}
	.bus-cont view text {
	   display: inline-block;
	   height:0;
	   width:100%  /* 换行 */
	}
	

	

	.title1 {
		margin-top: 26upx;
		margin-bottom: 17rpx;
		font-size: 28upx;
		height: 28upx;
		line-height: 28upx;
		/* font-weight:bold; */
		color: #fff;
	}

	.tel {
		color: #fff;
		font-size: 30upx;
		
		line-height: 30upx;
		height: 30upx;
		display: flex;
		

	}

	.tel-num {
       width: 52upx;
	   text-align: justify;
	}

	.tel-txt {
		letter-spacing: 6upx;
	}

	.bus-desc {
		font-size: 20upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		line-height: 20upx;
		color: #fff;
		height: 20upx;
	}

	.cont {
		overflow: hidden;
		_zoom: 1;
		flex: 1;
	}


	.bustag {
		overflow: hidden;
		_zoom: 1;
	}

	.bustext {
		overflow: hidden;
		_zoom: 1;
		float: left;
		/* margin-bottom: 30upx; */
	}

	.buslxian {
		float: left;
		font-size: 30upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		margin: 0 6upx;
	}

	.bustext:first-child .buslxian {
		float: left;
		font-size: 0upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		margin: 0;
	}

	.bust {
		float: left;
		font-size: 30upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
	}

	.btnPic {
		width: 100%;
		display: block;
	}
	
	

	
	/* 新增 */
	/* 大标题 */
	.cont-title {
		// background: #FFFFFF;
	}
	
	.h {
		margin-top: 20upx;
	}
	
	.dtitle {
		overflow: hidden;
		_zoom: 1;
		display: flex;
		justify-content: center;
		margin: 0 auto;
	}
	
	.title {
		font-size: 44upx;
		font-family: PingFang-SC-Medium;
		font-weight: bold;
		color: rgba(34, 34, 34, 1);
		padding: 0 24upx;
		float: left;
	}
	
	.limg {
		float: left;
		width: 35upx;
		height: 15upx;
		display: block;
		margin-top: 22upx;
	
	}
	
	.ftitle {
		margin-top: 8upx;
		font-size: 24upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
		text-align: center;
	}
	
	.weiixn-gzh{
		width: 176upx;
		height: 44upx;
		background: #ED7D31;
		border-radius: 6upx;
		font-size: 26upx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 44upx;
		text-align: center;
		margin: 0 auto;
		margin-bottom: 28upx;
	}
	
	.weiixn-gzhs{
		width: 236upx;
		height: 44upx;
		background: #ED7D31;
		border-radius: 6upx;
		font-size: 26upx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 44upx;
		text-align: center;
		margin: 0 auto;
		margin-top: 34upx;
		margin-bottom: 28upx;
	}
	
	/* 公众号列表 */
	.content{
		background: #FFFFFF;
		// padding-bottom:60upx ;
	}
	
	.content-list{
		// padding: 0 30upx;

		
	}
	.content-cont{
		overflow: hidden;
		_zoom:1;
	}
	.list-ul{
		float: left;
		margin-left: 38upx;
	}
	.list-li{
		width: 140upx;
		margin-bottom: 40upx;
	}
	
	.list-pic{
		image{
			width: 140upx;
			height: 140upx;
			// background: #A22D26;
			border-radius: 70upx;
			display: block;
		}
	}
	.list-title{
		font-size: 18upx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: #333333;
		// line-height: 18upx;
		text-align: center;
		margin: 14upx 0 8upx 0;
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
	}
	.list-desc{
	
		width: 96upx;
		height: 26upx;
		border: 1upx solid rgba(189, 194, 196, 0.99);
		border-radius: 2upx;
		font-size: 12upx;
		text-align: center;
		line-height: 26upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #333333;
		margin: 0 36upx;
		box-sizing: border-box;
		    -webkit-text-size-adjust: 100%;

	
	}
	
	
	.ljgd{
		width: 212upx;
		height: 43upx;
		border: 1upx solid #DD2B2E;
		border-radius: 3upx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 auto;
		
		.ljgd-pic{
			image{
				width: 30upx;
				height: 30upx;
				display: block;
				margin-right: 12upx;
			}
			
		}
		.ljgd-text{
			line-height: 20upx;
			font-size: 20upx;
			font-family: Microsoft YaHei;
			font-weight: bold;
			color: #444444;
		}
	}
	
	.lic{
		width: 173upx;
		height: 35upx;
		border: 1upx solid #DD2B2E;
		border-radius: 3px;
		display: flex;
		justify-content: center;
		align-items: center;
		// margin: 0 auto;
		margin-top: 14upx;
		
		.ljgd-pic{
			image{
				width: 27upx;
				height: 27upx;
				display: block;
				margin-right: 12upx;
			}
			
		}
		.ljgd-text{
			line-height: 16upx;
			font-size: 16upx;
			font-family: Microsoft YaHei;
			font-weight: bold;
			color: #444444;
		}
	}
	
	
	
	.lin1{
		margin-top: 38upx;
	}
	.lin2{
		margin-top: 60upx;
	}
	
	.links{
		margin-top: 8upx;
	}
	
	.mark {
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.5);
		z-index: 9999999;
	}
	
	.mark-content {
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		z-index: 9;
		width: 500upx;
		height: 500upx;
		background: #FFFFFF;
		border-radius: 16upx;
	}
	
	.mark-relative {
		position: relative;
	}
	
	.mark-del {
		width: 30upx;
		height: 30upx;
		display: block;
		position: absolute;
		right: 0;
		padding: 22upx 20upx 0 0;
	}
	
	.qercode{
		width: 320upx;
		height: 320upx;
		display: block;
	    margin: 0 auto;
		padding-top: 90upx;
	}
</style>