<template>
	<view class="page">
	  <view class="group_1">
	    <view class="box_1">
	      <view class="nav-bar_1">
	      	<view @click="goback" class="arr-right">&lt;&lt;&lt;</view>
	      	<view class="arr-left">阴阳历转换</view>
	      </view>
	      <view @click="settype"  :class="type==1?'image-wrapper_1':'image-wrapper_1_1'">
	      </view>
	      <view class="text-wrapper_1">
			<picker class="picker datepick" mode="date"  :start="startDate" :end="endDate" @change="bindDateChange">
				<view lines="1" class="text_46">{{check_date.y}}</view>
				<view lines="1" class="text_3">年</view>
				<view lines="1" class="text_47">{{check_date.m}}</view>
				<view lines="1" class="text_4">月</view>
				<view lines="1" class="text_48">{{check_date.d}}</view>
				<view lines="1" class="text_5">日</view>
			</picker>
			<picker class="picker"  :range="time24" start="0" end="23" @change="bindTimeEnd">
			<view style="display: inline-block;" lines="1" class="text_49">{{check_date.h}}</view>
			<view style="display: inline-block;" lines="1" class="text_16">时</view>
			</picker>
	      </view>
		  
	    </view>
	    <view class="box_3">
	      <view class="top">
			  <view class="text-wrapper_3">
			    <view lines="1" decode="true" class="text_17">公历（阳历）：{{info.public.year}}-{{info.public.month}}-{{info.public.day}}</view>
			    <view lines="1" decode="true" class="text_18">{{info.public.hour}} 时</view>
			  </view>
			  <view class="text-wrapper_3" style="margin-top: 20rpx;">
			    <view lines="1" decode="true" class="text_17">农历（阴历）：</view>
				<view lines="1" decode="true" class="text_17">{{info.nong.year}}年</view>
				<view lines="1" decode="true" class="text_17">{{info.nong.month}}</view>
				<view lines="1" decode="true" class="text_17"></view>
				<view lines="1" decode="true" class="text_17">{{info.nong.day}}</view>
			    <view lines="1" decode="true" class="text_17">{{info.nong.hour}}时</view>
			  </view>
			  <img src="../../static/yinyang/3.png" class="image_5"/>
			  <view class="text-wrapper_4">
			    <text lines="1" class="paragraph_1">{{info.ba_zi.year}}</text>
			    <text lines="1" class="paragraph_2">{{info.ba_zi.month}}</text>
			    <text lines="1" class="paragraph_3">{{info.ba_zi.day}}</text>
			    <text lines="1" class="paragraph_4">{{info.ba_zi.hour}}</text>
			  </view>
		  </view>
		  <view class="bottom">
			  <view lines="1" class="text_20">二十四节气查询</view>
			  <picker class="text_21"  mode="date" fields="year"  @change="bindDate24">{{date24}}</picker>
			  <view class="section_2"  v-for="item in jieqi">
			    <view class="text-wrapper_5" :class="item.status==1?'active':''">
			      <view lines="1" class="text_22">{{item.year}}年</view>
			      <view lines="1" class="text_42">{{item.name}}</view>
			      <view lines="1" class="text_26">时间：</view>
			      <view lines="1" decode="true" class="text_27">{{item.month_day}}</view>
				  <view lines="1" decode="true" class="text_27-1">{{item.time}}</view>
			    </view>
			  </view>
			
			  
		  </view>
	      
	     
	    </view>
	  </view>
	  <tabBar  class="tab-bar_1" currenttype="2" displaytype="2">
	  </tabBar >
	</view>
</template>

<script>
		import tabBar  from '@/components/tabbar'
		import * as YingyangApi from '@/api/yingyang'
	export default {
		components: {
		  tabBar
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		data() {
			return {
				type:true,
				check_date:{
					y:'',
					m:'',
					d:'',
					h:''
				},
				date24:'',
				time24:["00","01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23"],
				info:{},
				jieqi:{}
			}
		},
		onLoad(options) {
		  // 当前页面参数
		  this.options = options
		  // 加载页面数据
		  this.setCurrentdate();
		  
		  this.getDataInfo();
		  
		  this.getjieqi();
		},
		
		
		methods: {
			getDataInfo()
			{
				var checkdate = this.check_date.y+"-"+this.check_date.m+"-"+this.check_date.d+" "+this.check_date.h+":00:00";
				
				YingyangApi.res({time:checkdate,type:this.type})
				  .then(result => {
					  this.info = result.data;
					  console.log(this.info);
				  });
				  
			},
			
			getjieqi()
			{
				if(this.date24  =='')
				{
					this.date24 = this.check_date.y;
					
				}
				YingyangApi.jieqires({time:this.date24+""})
				  .then(result => {
					  this.jieqi = result.data;
					  console.log(this.jieqi);
				  })
			},
			bindDateChange: function(e) {
				console.log(e.target.value);
				var datearr = e.target.value.split('-');
				this.check_date.y = datearr[0];
				this.check_date.m = datearr[1];
				this.check_date.d = datearr[2];
				this.getDataInfo();
			},
			bindTimeEnd(e)
			{
				this.check_date.h = e.target.value;
				this.getDataInfo();
			},
			bindDate24(e)
			{
				console.log(e.target);
				this.date24 = e.target.value;
				this.getjieqi();
			},
			getDate(type) {
					const date = new Date();
					let year = date.getFullYear();
					let month = date.getMonth() + 1;
					let day = date.getDate();
			
					if (type === 'start') {
						year = year - 100;
					} else if (type === 'end') {
						year = year + 2;
					}
					month = month > 9 ? month : '0' + month;
					day = day > 9 ? day : '0' + day;
					return `${year}-${month}-${day}`;
				},
			setCurrentdate()
			{
				var myDate = new Date();
				this.check_date.y = myDate.getFullYear();
				this.check_date.m = myDate.getMonth() +1;  
				this.check_date.d = myDate.getDate();    
				this.check_date.h = myDate.getHours(); 
				this.date24 = myDate.getFullYear();
				
			},
			goback()
			{
				this.$navTo('pages/yingyong/yingyong')
			},
			settype()
			{
				if(this.type==1)
				{
					this.type=2;
				}
				else
				{
					this.type= 1;
				}
				this.getDataInfo();
			}
		}
	}
</script>

<style  lang="scss" scoped>
.page {
  background-color: rgba(255,255,255,1);
  position: relative;
  width: 750rpx;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  
}
.group_1 {
  position: relative;
  width: 750rpx;
  display: flex;
  flex-direction: column;
  padding-bottom: 120rpx;
}
.box_1 {
  width: 750rpx;
  height: 347rpx;
  display: flex;
  flex-direction: column;

}

.datepick
{
	width: 430rpx;
	
}

.datepick view
{
	display:inline-block;
}

.group_2 {
  width: 651rpx;
  height: 22rpx;
  flex-direction: row;
  display: flex;
  margin: 43rpx 0 0 70rpx;
}
.text_1 {
  width: 56rpx;
  height: 19rpx;
  overflow-wrap: break-word;
  color: rgba(0,0,0,1);
  font-size: 28rpx;
  font-family: SFProText-Semibold;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  line-height: 28rpx;
  margin-top: 1rpx;
}
.image_1 {
  width: 32rpx;
  height: 20rpx;
  margin: 1rpx 0 0 475rpx;
}
.image_2 {
  width: 29rpx;
  height: 20rpx;
  margin-left: 9rpx;
}
.group_3 {
  height: 22rpx;
  margin-left: 9rpx;
  display: flex;
  flex-direction: column;
  width: 41rpx;
}
.section_1 {
  background-color: rgba(0,0,0,1.000000);
  border-radius: 2rpx;
  width: 34rpx;
  height: 14rpx;
  display: flex;
  flex-direction: column;
  margin: 4rpx 0 0 4rpx;
}

.text_2 {
  width: 386rpx;
  height: 40rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 40rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 40rpx;
  margin: 32rpx 0 0 81rpx;
}
.image-wrapper_1,.image-wrapper_1_1 {
  width: 296rpx;
  height: 70rpx;
  flex-direction: row;
  display: flex;
  justify-content: space-between;
  margin: 50rpx auto 0 auto;
}


.image-wrapper_1 {
  background: url(../../static/yinyang/1.png) 100% no-repeat;
  background-size: 100% 100%;
}

.image-wrapper_1_1 {
  background: url(../../static/yinyang/2.png) 100% no-repeat;
  background-size: 100% 100%;
}


.image_3 {
  width: 120rpx;
  height: 50rpx;
  margin: 12rpx 0 12rpx 17rpx;
}
.image_4 {
  width: 118rpx;
  height: 50rpx;
  margin: 12rpx 17rpx 12rpx 0;
}
.text-wrapper_1 {
	background: url(../../static/yinyang/selectbg.png) 100% no-repeat;
	background-size: 100% 100%;
  width: 536rpx;
  height: 50rpx;
  flex-direction: row;
  display: flex;
  margin: 48rpx auto 26rpx auto;
  position: relative;
}
.text_3 {
  width: 36rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(128,127,128,1);
  font-size: 24rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;

}
.text_4 {
  width: 40rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(128,127,128,1);
  font-size: 24rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin: 0;
}
.text_5 {
  width: 38rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(128,127,128,1);
  font-size: 24rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin:0;
}
.box_2 {
  width: 750rpx;
  height: 141rpx;
  margin-top: 1009rpx;
  display: flex;
  flex-direction: column;
}
.group_4 {
  position: relative;
  width: 566rpx;
  height: 43rpx;
  display: flex;
  flex-direction: row;
  margin: 41rpx 0 0 94rpx;
}
.tag_1 {
  width: 96rpx;
  height: 43rpx;
  margin-left: 131rpx;
}
.text-wrapper_2 {
  position: absolute;
  left: 0rpx;
  top: 6rpx;
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_6 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_7 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_8 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_9 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_10 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_11 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}

.text_15 {
  width: 38rpx;
  height: 19rpx;
  overflow-wrap: break-word;
  color: rgba(121,121,121,1);
  font-size: 20rpx;
  font-family: FZLTKHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 20rpx;
  margin: 8rpx 0 0 1rpx;
}
.box_3 {
  width: 704rpx;

  display: flex;
  flex-direction: column;
  margin:0 auto;
  margin-bottom: 120rpx;
  .top
  {
	  
	  background: url(../../static/mingju/top.png) 100% no-repeat;
	  background-size: 100% 100%;
	  padding-bottom: 40rpx;
  }
  
  .bottom
  {
	  padding-top: 40rpx;
	  margin-top:40rpx;
	  background: url(../../static/mingju/bottom.png) 100% no-repeat;
	     background-size: 100% auto;
	     text-align: center;
	     background-position-y: top;
  }
}
.text_16 {
  position: absolute;
  top:0;
  width: 21rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(128,127,128,1);
  font-size: 24rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 50rpx;
  right: -30rpx;
}
.text-wrapper_3 {
  width: 426rpx;
  height: 25rpx;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 25rpx;
  margin: 73rpx auto 0 auto;
  display: flex;
  justify-content: space-between;
}
.text_17 {
  height: 25rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 25rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 25rpx;
}
.text_18 {
  height: 25rpx;
  overflow-wrap: break-word;
  color: rgba(34, 24, 21, 1);
  font-size: 25rpx;
  font-family: FZPSHJW--GB1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 25rpx;
}
.text_19 {
  width: 429rpx;
  height: 25rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 25rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 25rpx;
  margin: 41rpx 0 0 138rpx;
}
.image_5 {
  width: 423rpx;
  height: 39rpx;
  margin: 49rpx 0 0 138rpx;
}
.text-wrapper_4 {
  width: 452rpx;
  height: 156rpx;
  flex-direction: row;
  display: flex;
  margin: 21rpx 0 0 124rpx;
}
.paragraph_1 {
  width: 65rpx;
  height: 155rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 72rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  line-height: 72rpx;
  margin-top: 1rpx;
}
.paragraph_2 {
  width: 61rpx;
  height: 153rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 72rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  line-height: 72rpx;
  margin: 1rpx 0 0 62rpx;
}
.paragraph_3 {
  width: 62rpx;
  height: 153rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 72rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  line-height: 72rpx;
  margin: 1rpx 0 0 72rpx;
}
.paragraph_4 {
  width: 65rpx;
  height: 156rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 72rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  line-height: 72rpx;
  margin-left: 65rpx;
}
.text_20 {
  width: 254rpx;
  height: 39rpx;
  overflow-wrap: break-word;
  color: rgba(230,0,18,1);
  font-size: 40rpx;
  font-family: FZQKBYSJW--GB1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 40rpx;
  margin: 0 auto 0 auto;
}
.text_21 {
  width: 120rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(34,24,21,1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin: 34rpx auto 20rpx auto;
  background-image: url('../../static/4select.png');
  background-size: 100% 100%;
  display: inline-block;
  padding-right: 30rpx;
  
}
.section_2 {
  position: relative;
  width: 650rpx;
  height: 43rpx;
  display: flex;
  flex-direction: row;
  margin: 40rpx auto 0 auto;
  
}

.section_2 .active .text_42
  {
	  
	  background-image: url(../../static/yinyang/jieqi-bg-blue.png);
	  background-size: 100%  100%;
  }

.tag_2 {
  width: 96rpx;
  height: 43rpx;
  position: absolute;
  top:0;
  left:0;
  
}
.text-wrapper_5 {
  width: 100%;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  display: flex;
  justify-content: space-between;
  align-items: center}
  
  .text-wrapper_5>view
  {
	  display: inline-block;
	  
  }
  
.text_22 {
  height: 30rpx;
  width: 120rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_23 {
  height: 30rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
  position: relative;
  
}
.text_25 {
  height: 30rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_26 {
  height: 30rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_27 {
  height: 30rpx;
  width: 160rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}


.text_27-1 {
  height: 30rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.section_3 {
  position: relative;
  width: 566rpx;
  height: 43rpx;
  display: flex;
  flex-direction: row;
  margin: 37rpx 0 0 69rpx;
}
.tag_3 {
  width: 96rpx;
  height: 43rpx;
  margin-left: 131rpx;
}
.text-wrapper_6 {
  position: absolute;
  left: 0rpx;
  top: 6rpx;
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_28 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_29 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_30 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_31 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_32 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_33 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.section_4 {
  position: relative;
  width: 566rpx;
  height: 43rpx;
  display: flex;
  flex-direction: row;
  margin: 40rpx 0 0 69rpx;
}
.image_6 {
  width: 96rpx;
  height: 43rpx;
  margin-left: 131rpx;
}
.text-wrapper_7 {
  position: absolute;
  left: 0rpx;
  top: 6rpx;
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_34 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_35 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_36 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_37 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_38 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_39 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text-wrapper_8 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  font-size: 0rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
  margin: 47rpx 0 5rpx 69rpx;
}
.text_40 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_41 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_42 {
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  background-image: url(../../static/yinyang/jieqi-bg-red.png);
  background-size: 100%  100%;
  height: 43rpx;
  line-height: 43rpx;
  width: 96rpx;
  margin:0 10rpx;
  align-self: center;
}
.text_43 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_44 {
  width: 566rpx;
  height: 31rpx;
  overflow-wrap: break-word;
  color: rgba(159, 160, 160, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 32rpx;
}
.text_45 {
  width: 566rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(230, 0, 18, 1);
  font-size: 32rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
}

.text_46 {
  width: 90rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(34,24,21,1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin-right: 30rpx;
}
.text_47 {
  width: 64rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(34,24,21,1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin-right: 28rpx;
}
.text_48 {
  width: 80rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(34,24,21,1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin-right: 24rpx;
}
.text_49 {
  width: 78rpx;
  height: 50rpx;
  overflow-wrap: break-word;
  color: rgba(34,24,21,1);
  font-size: 30rpx;
  font-family: FZLTHK--GBK1-0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  line-height: 50rpx;
  margin-right: 24rpx;
}
.tag_4 {
  position: absolute;
  left: 200rpx;
  top: 968rpx;
  width: 96rpx;
  height: 43rpx;
}
.image_7 {
  position: absolute;
  left: 289rpx;
  top: 608rpx;
  width: 137rpx;
  height: 55rpx;
}
.tag_5 {
  position: absolute;
  left: 193rpx;
  top: 877rpx;
  width: 110rpx;
  height: 57rpx;
}
</style>
