|
|
@@ -2,41 +2,55 @@
|
|
|
<div class="context bgStyle1" id="online">
|
|
|
<div class="change">
|
|
|
<div class="basicInfo">
|
|
|
- <em>课程名：{{PlanName}} </em>
|
|
|
- <em>学员数：{{Num}} </em>
|
|
|
- <em>教练：{{Teacher}} </em>
|
|
|
+ <em>课程名：{{ PlanName }}</em>
|
|
|
+ <em>学员数：{{ Num }}</em>
|
|
|
+ <em>教练：{{ Teacher }}</em>
|
|
|
<!--<em>（在线：{{classInfo.online}}人 离线：{{classInfo.offline}}人） </em>-->
|
|
|
- <em>当前时间：{{classInfo.endTime}} </em>
|
|
|
+ <em>当前时间：{{ classInfo.endTime }}</em>
|
|
|
<!--拿到eqsn才能获取数据-->
|
|
|
- <em class="room">区域列表 </em>
|
|
|
- <select id="regionSelect" v-model="VenueId" placeholder="请选择区域" @change="queryEqsnByVenueId">
|
|
|
- <option value=""> 请选择区域</option>
|
|
|
- <option :value="item.SvId" v-for="item in VenueOption"> {{item.Name}}</option>
|
|
|
+ <em class="room">区域列表</em>
|
|
|
+ <select
|
|
|
+ id="regionSelect"
|
|
|
+ v-model="VenueId"
|
|
|
+ placeholder="请选择区域"
|
|
|
+ @change="queryEqsnByVenueId"
|
|
|
+ >
|
|
|
+ <option value>请选择区域</option>
|
|
|
+ <option :value="item.SvId" v-for="item in VenueOption">{{ item.Name }}</option>
|
|
|
</select>
|
|
|
<!--<el-select v-model="VenueId" placeholder="请选择区域" @change="queryEqsnByVenueId">-->
|
|
|
- <!--<el-option-->
|
|
|
- <!--v-for="item in VenueOption"-->
|
|
|
- <!--:key="item.SvId"-->
|
|
|
- <!--:label="item.Name"-->
|
|
|
- <!--:value="item.SvId">-->
|
|
|
- <!--</el-option>-->
|
|
|
+ <!--<el-option-->
|
|
|
+ <!--v-for="item in VenueOption"-->
|
|
|
+ <!--:key="item.SvId"-->
|
|
|
+ <!--:label="item.Name"-->
|
|
|
+ <!--:value="item.SvId">-->
|
|
|
+ <!--</el-option>-->
|
|
|
<!--</el-select>-->
|
|
|
</div>
|
|
|
|
|
|
- <el-button @click="full_screen" v-if="!screen_full" icon="el-icon-full-screen" type="primary">全屏</el-button>
|
|
|
+ <el-button
|
|
|
+ @click="full_screen"
|
|
|
+ v-if="!screen_full"
|
|
|
+ icon="el-icon-full-screen"
|
|
|
+ type="primary"
|
|
|
+ >全屏</el-button>
|
|
|
<el-button @click="cancle_screen" v-else icon="el-icon-full-screen" type="primary">缩小</el-button>
|
|
|
<!--<el-button v-if="classState == 0" @click="" type="success">上课</el-button>-->
|
|
|
<!--<el-button v-else @click="" type="danger">下课</el-button>-->
|
|
|
<el-button @click="showRank" type="warning">排行榜</el-button>
|
|
|
<!--<el-button @click="">隐藏信息 todo</el-button>-->
|
|
|
</div>
|
|
|
- <div :class="[{'userList':true},{'bigUserList':bigUserList}]">
|
|
|
- <ul :class="[{'bigUserList':bigUserList}]">
|
|
|
+ <div :class="[{ 'userList': true }, { 'bigUserList': bigUserList }]">
|
|
|
+ <ul :class="[{ 'bigUserList': bigUserList }]">
|
|
|
<li v-if="students.length == 0">
|
|
|
<h5 style="color: #fff;font-size: 3rem">暂无学生加入当前课程</h5>
|
|
|
</li>
|
|
|
- <li v-for="(s,i) in students" :class="studentsClassName[i].name" v-show="students"
|
|
|
- v-if="students.length > 0">
|
|
|
+ <li
|
|
|
+ v-for="(s,i) in students"
|
|
|
+ :class="studentsClassName[i].name"
|
|
|
+ v-show="students"
|
|
|
+ v-if="students.length > 0"
|
|
|
+ >
|
|
|
<div class="centerLi">
|
|
|
<div class="topLi">
|
|
|
<div class="human">
|
|
|
@@ -51,13 +65,19 @@
|
|
|
</div>
|
|
|
</span>
|
|
|
<div class="head">
|
|
|
- <img :src="s.Head" alt="" v-if="s.Head">
|
|
|
- <img src="../static/img/people/flyhead.png" alt="" v-if="!s.Head">
|
|
|
+ <img :src="s.Head" alt v-if="s.Head" />
|
|
|
+ <img src="../static/img/people/flyhead.png" alt v-if="!s.Head" />
|
|
|
|
|
|
<!-- 生日快乐 -->
|
|
|
<div class="birth" v-if="s.IsBirthday == 1">
|
|
|
- <img src="../assets/img/birth/birthCrow.png" class="birthCrow"/>
|
|
|
- <img src="../assets/img/birth/birthText.png" class="birthText"/>
|
|
|
+ <img
|
|
|
+ src="../assets/img/birth/birthCrow.png"
|
|
|
+ class="birthCrow"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ src="../assets/img/birth/birthText.png"
|
|
|
+ class="birthText"
|
|
|
+ />
|
|
|
</div>
|
|
|
<!--私有心率带-->
|
|
|
<div class="isPrivate" v-if="s.IsPrivate == 1">
|
|
|
@@ -66,10 +86,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="cla">
|
|
|
- <em v-if="s.RealHr != 0">{{ s.ActivePercent |max100 }}</em>
|
|
|
- <em class="plus" v-if="s.ActivePercent == 0 && s.RealHr == 0">
|
|
|
- ---
|
|
|
- </em>
|
|
|
+ <em v-if="s.RealHr != 0">{{ s.ActivePercent | max100 }}</em>
|
|
|
+ <em class="plus" v-if="s.ActivePercent == 0 && s.RealHr == 0">---</em>
|
|
|
</div>
|
|
|
<div class="lcla">
|
|
|
<span>%</span>
|
|
|
@@ -78,36 +96,42 @@
|
|
|
<!--heartJump-->
|
|
|
<div>
|
|
|
<div class="lhj">
|
|
|
- <div :class="[{'heartJump':true}]">
|
|
|
- <span class="fastJump" v-if="s.RealHr != 0"
|
|
|
- v-show="parseInt(s.ActivePercent) > 90">{{ s.RealHr }}</span>
|
|
|
- <span class="normalJump" v-if="s.RealHr != 0"
|
|
|
- v-show="parseInt(s.ActivePercent) <= 90 && parseInt(s.ActivePercent) > 30">
|
|
|
- {{ s.RealHr }}</span>
|
|
|
- <span class="slowJump" v-if="s.RealHr != 0"
|
|
|
- v-show="parseInt(s.ActivePercent) <= 30">{{ s.RealHr }}</span>
|
|
|
- <span class="plus" v-if="s.RealHr == 0">
|
|
|
- ---
|
|
|
- </span>
|
|
|
+ <div :class="[{ 'heartJump': true }]">
|
|
|
+ <span
|
|
|
+ class="fastJump"
|
|
|
+ v-if="s.RealHr != 0"
|
|
|
+ v-show="parseInt(s.ActivePercent) > 90"
|
|
|
+ >{{ s.RealHr }}</span>
|
|
|
+ <span
|
|
|
+ class="normalJump"
|
|
|
+ v-if="s.RealHr != 0"
|
|
|
+ v-show="parseInt(s.ActivePercent) <= 90 && parseInt(s.ActivePercent) > 30"
|
|
|
+ >{{ s.RealHr }}</span>
|
|
|
+ <span
|
|
|
+ class="slowJump"
|
|
|
+ v-if="s.RealHr != 0"
|
|
|
+ v-show="parseInt(s.ActivePercent) <= 30"
|
|
|
+ >{{ s.RealHr }}</span>
|
|
|
+ <span class="plus" v-if="s.RealHr == 0">---</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="rhj">
|
|
|
- <img src="../static/img/heart.svg" class=""/>
|
|
|
+ <img src="../static/img/heart.svg" class />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="bottomLi">
|
|
|
<div class="btcla">
|
|
|
- <img src="../static/img/s1.svg"/>
|
|
|
- <span>{{ s.Cle |fmtInt }}</span>
|
|
|
+ <img src="../static/img/s1.svg" />
|
|
|
+ <span>{{ s.Cle | fmtInt }}</span>
|
|
|
</div>
|
|
|
<div class="btck">
|
|
|
- <img src="../static/img/s2.svg"/>
|
|
|
- <span>{{ s.PureCalorieNoVo2 |fmtInt }}</span>
|
|
|
+ <img src="../static/img/s2.svg" />
|
|
|
+ <span>{{ s.PureCalorieNoVo2 | fmtInt }}</span>
|
|
|
</div>
|
|
|
<div class="step">
|
|
|
- <img src="../static/img/ck.svg"/>
|
|
|
- <span>{{ s.Ck |fmtFloat }}</span>
|
|
|
+ <img src="../static/img/ck.svg" />
|
|
|
+ <span>{{ s.Ck | fmtFloat }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -121,7 +145,7 @@
|
|
|
<!--排行榜-->
|
|
|
<el-dialog :title="dialogTitle" :visible.sync="dialogMemberVisible" width="1366px">
|
|
|
<userRank :rank-info="rankInfo"></userRank>
|
|
|
- <br>
|
|
|
+ <br />
|
|
|
<div class="dialogFooter">
|
|
|
<el-button size="small" @click="dialogMemberVisible = false">关闭</el-button>
|
|
|
</div>
|
|
|
@@ -130,2336 +154,2332 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import levelIcon from '@/components/levelIcon'
|
|
|
- import power from '@/components/power'
|
|
|
- import userRank from '@/components/userRank'
|
|
|
- import Global from '../Global.js'
|
|
|
- import {
|
|
|
- QueryShopVenue,
|
|
|
- QueryVenueEquip,
|
|
|
- getHello,
|
|
|
- CalorieStatsQuery,
|
|
|
- ClassUserRank,
|
|
|
- } from "../api/getApiRes";
|
|
|
-
|
|
|
- let qs = require('qs');
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- classInfo: {
|
|
|
- name: '',
|
|
|
- len: '',
|
|
|
- online: 0,
|
|
|
- offline: 0,
|
|
|
- time: '00：00：00',
|
|
|
- endTime: '00：00：00',
|
|
|
- },
|
|
|
- VenueId: '',//所选区域
|
|
|
- classState: 0,//0 下课 1上课
|
|
|
- students: [],
|
|
|
- VenueOption: [],
|
|
|
- studentsClassName: [],
|
|
|
- rankInfo: [],
|
|
|
- screen_full: false,
|
|
|
- bigUserList: false,
|
|
|
- dialogMemberVisible: false,//false
|
|
|
- dialogTitle: '排行榜',
|
|
|
- EqSn: '',
|
|
|
- PlanName: '',
|
|
|
- BeginTime: '',
|
|
|
- Num: '',
|
|
|
- Teacher: '',
|
|
|
-
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.init();
|
|
|
- },
|
|
|
- watch: {
|
|
|
- $route(to) {
|
|
|
- if (to.name != 'online') {
|
|
|
- this.clearRem();
|
|
|
- clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
- } else {
|
|
|
- this.setRem();
|
|
|
- this.getVenueQuery();
|
|
|
- this.queryEqsnByVenueId();
|
|
|
- }
|
|
|
+import levelIcon from '@/components/levelIcon'
|
|
|
+import power from '@/components/power'
|
|
|
+import userRank from '@/components/userRank'
|
|
|
+import Global from '../Global.js'
|
|
|
+import {
|
|
|
+ QueryShopVenue,
|
|
|
+ QueryDemoVenueEquipInOlinClass,
|
|
|
+ getHello,
|
|
|
+ CalorieStatsQuery,
|
|
|
+ ClassUserRank,
|
|
|
+} from "../api/getApiRes";
|
|
|
+
|
|
|
+let qs = require('qs');
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ classInfo: {
|
|
|
+ name: '',
|
|
|
+ len: '',
|
|
|
+ online: 0,
|
|
|
+ offline: 0,
|
|
|
+ time: '00：00：00',
|
|
|
+ endTime: '00：00：00',
|
|
|
},
|
|
|
- // EqSn(to){
|
|
|
- // console.log(to);
|
|
|
- // clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
- // if(to){
|
|
|
- // this.mainTimer = setInterval(() => {
|
|
|
- // this.GetgetUserList();
|
|
|
- // }, 1000);
|
|
|
- // }
|
|
|
- // }
|
|
|
+ VenueId: '',//所选区域
|
|
|
+ classState: 0,//0 下课 1上课
|
|
|
+ students: [],
|
|
|
+ VenueOption: [],
|
|
|
+ studentsClassName: [],
|
|
|
+ rankInfo: [],
|
|
|
+ screen_full: false,
|
|
|
+ bigUserList: false,
|
|
|
+ dialogMemberVisible: false,//false
|
|
|
+ dialogTitle: '排行榜',
|
|
|
+ EqSn: '',
|
|
|
+ PlanName: '',
|
|
|
+ BeginTime: '',
|
|
|
+ Num: '',
|
|
|
+ Teacher: '',
|
|
|
+ Memo: '',
|
|
|
+
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ $route(to) {
|
|
|
+ if (to.name != 'online') {
|
|
|
+ this.clearRem();
|
|
|
+ clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ } else {
|
|
|
+ this.setRem();
|
|
|
+ this.getVenueQuery();
|
|
|
+ this.queryEqsnByVenueId();
|
|
|
+ }
|
|
|
},
|
|
|
- destroyed() {
|
|
|
- clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ // EqSn(to){
|
|
|
+ // console.log(to);
|
|
|
+ // clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ // if(to){
|
|
|
+ // this.mainTimer = setInterval(() => {
|
|
|
+ // this.GetgetUserList();
|
|
|
+ // }, 1000);
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ destroyed() {
|
|
|
+ clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ // this.getList(26);
|
|
|
+ this.getVenueQuery();
|
|
|
},
|
|
|
- methods: {
|
|
|
- init() {
|
|
|
- // this.getList(26);
|
|
|
- this.getVenueQuery();
|
|
|
- },
|
|
|
- getClassUserRank() {
|
|
|
- let that = this;
|
|
|
- let param = {
|
|
|
- eqSn:that.EqSn
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
-
|
|
|
- ClassUserRank(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- if (json.Rs) {
|
|
|
- that.rankInfo = json.Rs;
|
|
|
- }else{
|
|
|
- that.rankInfo = [];
|
|
|
- }
|
|
|
+ getClassUserRank() {
|
|
|
+ let that = this;
|
|
|
+ let param = {
|
|
|
+ eqSn: that.EqSn
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+
|
|
|
+ ClassUserRank(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ if (json.Rs) {
|
|
|
+ that.rankInfo = json.Rs;
|
|
|
} else {
|
|
|
- if (json.Code == '999') {
|
|
|
- // that.$router.push({path: '/'});
|
|
|
- } else {
|
|
|
- // 已出错
|
|
|
- that.$message.error(json.Memo);
|
|
|
- }
|
|
|
+ that.rankInfo = [];
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- // 载入课程信息
|
|
|
- ReadLessonInfo(Dp) {
|
|
|
- this.PlanName = Dp.PlanName;
|
|
|
- this.BeginTime = Dp.BeginTime;
|
|
|
- this.Teacher = Dp.Teacher;
|
|
|
- this.Num = this.students.length;
|
|
|
- },
|
|
|
- // 计算团队竞技课持续时间
|
|
|
- ClacClassTime() {
|
|
|
- let BeginTime = new Date(globalcurrent() + ' ' + this.BeginTime);//结束时间
|
|
|
- let nowDate = new Date();
|
|
|
- let date = new Date(nowDate - BeginTime - 8 * 60 * 60 * 1000);//减掉东八区时区问题
|
|
|
-
|
|
|
- let h = date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':';
|
|
|
- let m = date.getMinutes() < 10 ? '0' + date.getMinutes() + ':' : date.getMinutes() + ':';
|
|
|
- let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
|
|
|
- this.classInfo.endTime = h + m + s;
|
|
|
- },
|
|
|
- clearRem() {
|
|
|
- // 320 默认大小16px; 320px = 20rem ;每个元素px基础上/16
|
|
|
- let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;
|
|
|
- //得到html的Dom元素
|
|
|
- let htmlDom = document.getElementsByTagName('html')[0];
|
|
|
- htmlDom.style.fontSize = '14px'
|
|
|
- },
|
|
|
- setRem() {
|
|
|
- // 320 默认大小16px; 320px = 20rem ;每个元素px基础上/16
|
|
|
- let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;
|
|
|
- //得到html的Dom元素
|
|
|
- let htmlDom = document.getElementsByTagName('html')[0];
|
|
|
- //设置根元素字体大小
|
|
|
- htmlDom.style.fontSize = htmlWidth / 140 + 'px';
|
|
|
- },
|
|
|
- // 全屏显示
|
|
|
- full_screen() {
|
|
|
- let that = this;
|
|
|
- this.screen_full = true;
|
|
|
- let elem = document.getElementById("online");
|
|
|
- this.full_state = true;
|
|
|
- if (elem.webkitRequestFullScreen) {
|
|
|
- elem.webkitRequestFullScreen();
|
|
|
- that.full_rule();
|
|
|
- } else if (elem.mozRequestFullScreen) {
|
|
|
- elem.mozRequestFullScreen();
|
|
|
- that.full_rule();
|
|
|
- } else if (elem.requestFullScreen) {
|
|
|
- elem.requestFullscreen();
|
|
|
- that.full_rule();
|
|
|
} else {
|
|
|
- this.screen_full = false;
|
|
|
- notice.notice_show("浏览器不支持全屏API或已被禁用", null, null, null, true, true);
|
|
|
+ if (json.Code == '999') {
|
|
|
+ // that.$router.push({path: '/'});
|
|
|
+ } else {
|
|
|
+ // 已出错
|
|
|
+ that.$message.error(json.Memo);
|
|
|
+ }
|
|
|
}
|
|
|
- },
|
|
|
- // 取消全屏
|
|
|
- cancle_screen() {
|
|
|
- let that = this;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 载入课程信息
|
|
|
+ ReadLessonInfo(Dp) {
|
|
|
+ this.PlanName = Dp.PlanName;
|
|
|
+ this.BeginTime = Dp.BeginTime;
|
|
|
+ this.Teacher = Dp.Teacher;
|
|
|
+ this.Num = this.students.length;
|
|
|
+ },
|
|
|
+ // 计算团队竞技课持续时间
|
|
|
+ ClacClassTime() {
|
|
|
+ let BeginTime = new Date(globalcurrent() + ' ' + this.BeginTime);//结束时间
|
|
|
+ let nowDate = new Date();
|
|
|
+ let date = new Date(nowDate - BeginTime - 8 * 60 * 60 * 1000);//减掉东八区时区问题
|
|
|
+
|
|
|
+ let h = date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':';
|
|
|
+ let m = date.getMinutes() < 10 ? '0' + date.getMinutes() + ':' : date.getMinutes() + ':';
|
|
|
+ let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
|
|
|
+ this.classInfo.endTime = h + m + s;
|
|
|
+ },
|
|
|
+ clearRem() {
|
|
|
+ // 320 默认大小16px; 320px = 20rem ;每个元素px基础上/16
|
|
|
+ let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;
|
|
|
+ //得到html的Dom元素
|
|
|
+ let htmlDom = document.getElementsByTagName('html')[0];
|
|
|
+ htmlDom.style.fontSize = '14px'
|
|
|
+ },
|
|
|
+ setRem() {
|
|
|
+ // 320 默认大小16px; 320px = 20rem ;每个元素px基础上/16
|
|
|
+ let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;
|
|
|
+ //得到html的Dom元素
|
|
|
+ let htmlDom = document.getElementsByTagName('html')[0];
|
|
|
+ //设置根元素字体大小
|
|
|
+ htmlDom.style.fontSize = htmlWidth / 140 + 'px';
|
|
|
+ },
|
|
|
+ // 全屏显示
|
|
|
+ full_screen() {
|
|
|
+ let that = this;
|
|
|
+ this.screen_full = true;
|
|
|
+ let elem = document.getElementById("online");
|
|
|
+ this.full_state = true;
|
|
|
+ if (elem.webkitRequestFullScreen) {
|
|
|
+ elem.webkitRequestFullScreen();
|
|
|
+ that.full_rule();
|
|
|
+ } else if (elem.mozRequestFullScreen) {
|
|
|
+ elem.mozRequestFullScreen();
|
|
|
+ that.full_rule();
|
|
|
+ } else if (elem.requestFullScreen) {
|
|
|
+ elem.requestFullscreen();
|
|
|
+ that.full_rule();
|
|
|
+ } else {
|
|
|
this.screen_full = false;
|
|
|
- this.full_state = false;
|
|
|
- var elem = document;
|
|
|
- if (elem.webkitCancelFullScreen) {
|
|
|
- elem.webkitCancelFullScreen();
|
|
|
- that.cancle_full_rule();
|
|
|
- } else if (elem.mozCancelFullScreen) {
|
|
|
- elem.mozCancelFullScreen();
|
|
|
- that.cancle_full_rule();
|
|
|
- } else if (elem.cancelFullScreen) {
|
|
|
- elem.cancelFullScreen();
|
|
|
- that.cancle_full_rule();
|
|
|
- } else if (elem.exitFullscreen) {
|
|
|
- elem.exitFullscreen();
|
|
|
- that.cancle_full_rule();
|
|
|
- } else {
|
|
|
- this.screen_full = true;
|
|
|
- notice.notice_show("浏览器不支持全屏API或已被禁用", null, null, null, true, true);
|
|
|
- }
|
|
|
- },
|
|
|
- // 打开排行榜
|
|
|
- showRank() {
|
|
|
- if (this.rankInfo.length == 0) {
|
|
|
- this.$message.error('暂无排名数据');
|
|
|
- return false
|
|
|
- } else {
|
|
|
- this.dialogMemberVisible = true;
|
|
|
- }
|
|
|
- },
|
|
|
- // 获取演示区域
|
|
|
- getVenueQuery() {
|
|
|
- let that = this;
|
|
|
- that.loading = true;
|
|
|
- let param = {
|
|
|
- key: localStorage.ServiceKey,
|
|
|
- shopId: localStorage.ServiceId,
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- QueryShopVenue(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- that.loading = false;
|
|
|
- if (json.Rs) {
|
|
|
- that.VenueOption = json.Rs;
|
|
|
-
|
|
|
- } else {
|
|
|
- that.VenueOption = [];
|
|
|
- }
|
|
|
+ notice.notice_show("浏览器不支持全屏API或已被禁用", null, null, null, true, true);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 取消全屏
|
|
|
+ cancle_screen() {
|
|
|
+ let that = this;
|
|
|
+ this.screen_full = false;
|
|
|
+ this.full_state = false;
|
|
|
+ var elem = document;
|
|
|
+ if (elem.webkitCancelFullScreen) {
|
|
|
+ elem.webkitCancelFullScreen();
|
|
|
+ that.cancle_full_rule();
|
|
|
+ } else if (elem.mozCancelFullScreen) {
|
|
|
+ elem.mozCancelFullScreen();
|
|
|
+ that.cancle_full_rule();
|
|
|
+ } else if (elem.cancelFullScreen) {
|
|
|
+ elem.cancelFullScreen();
|
|
|
+ that.cancle_full_rule();
|
|
|
+ } else if (elem.exitFullscreen) {
|
|
|
+ elem.exitFullscreen();
|
|
|
+ that.cancle_full_rule();
|
|
|
+ } else {
|
|
|
+ this.screen_full = true;
|
|
|
+ notice.notice_show("浏览器不支持全屏API或已被禁用", null, null, null, true, true);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 打开排行榜
|
|
|
+ showRank() {
|
|
|
+ if (this.rankInfo.length == 0) {
|
|
|
+ this.$message.error('暂无排名数据');
|
|
|
+ return false
|
|
|
+ } else {
|
|
|
+ this.dialogMemberVisible = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取演示区域
|
|
|
+ getVenueQuery() {
|
|
|
+ let that = this;
|
|
|
+ that.loading = true;
|
|
|
+ let param = {
|
|
|
+ key: localStorage.ServiceKey,
|
|
|
+ shopId: localStorage.ServiceId,
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ QueryShopVenue(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ that.loading = false;
|
|
|
+ if (json.Rs) {
|
|
|
+ that.VenueOption = json.Rs;
|
|
|
+
|
|
|
} else {
|
|
|
- if (!localStorage.ServiceKey) {
|
|
|
- that.$message.error('还未与心率系统对接，请联系管理员');
|
|
|
- } else {
|
|
|
- that.$message.error(json.Memo + ' 错误码：' + json.Code);
|
|
|
- }
|
|
|
+ that.VenueOption = [];
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- // 获取演示设备eqsn
|
|
|
- queryEqsnByVenueId() {
|
|
|
- let that = this;
|
|
|
- that.loading = true;
|
|
|
- if(!that.VenueId){
|
|
|
- return false
|
|
|
- }
|
|
|
- let param = {
|
|
|
- key: localStorage.ServiceKey,
|
|
|
- shopId: localStorage.ServiceId,
|
|
|
- svId: that.VenueId,
|
|
|
- eqType: 3//设备类型 1 电视盒子 2 演示对应中间件 3 演示客户端
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- QueryVenueEquip(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- that.loading = false;
|
|
|
- if (json.Rs) {
|
|
|
- that.EqSn = json.Rs[0].EqSn;
|
|
|
- clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
- that.GetgetUserList();
|
|
|
- if (that.EqSn) {
|
|
|
- this.mainTimer = setInterval(() => {
|
|
|
- this.GetgetUserList();
|
|
|
- }, 1000);
|
|
|
- }
|
|
|
-
|
|
|
- } else {
|
|
|
- that.$message.error('当前区域没有设置显示设备');
|
|
|
- that.students = [];
|
|
|
- that.rankInfo = [];
|
|
|
- this.PlanName = '';
|
|
|
- this.BeginTime = '';
|
|
|
- this.Teacher = '';
|
|
|
- this.Num = '0';
|
|
|
- this.classInfo.endTime = "00:00:00";
|
|
|
- clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
- return false
|
|
|
- }
|
|
|
+ } else {
|
|
|
+ if (!localStorage.ServiceKey) {
|
|
|
+ that.$message.error('还未与心率系统对接，请联系管理员');
|
|
|
} else {
|
|
|
that.$message.error(json.Memo + ' 错误码：' + json.Code);
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- GetgetUserList() {
|
|
|
- let that = this;
|
|
|
- let param = {
|
|
|
- token: localStorage.token,
|
|
|
- eqSn: that.EqSn
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- // CalorieStatsQuery(postdata).then(res => {
|
|
|
- getHello(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- if (!json.Dp) {
|
|
|
- // that.$message.error('没有获取到课程信息');
|
|
|
- this.PlanName = '';
|
|
|
- this.BeginTime = '';
|
|
|
- this.Teacher = '';
|
|
|
- } else {
|
|
|
- that.ReadLessonInfo(json.Dp);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取演示设备eqsn
|
|
|
+ queryEqsnByVenueId() {
|
|
|
+ let that = this;
|
|
|
+ that.loading = true;
|
|
|
+ if (!that.VenueId) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let param = {
|
|
|
+ key: localStorage.ServiceKey,
|
|
|
+ shopId: localStorage.ServiceId,
|
|
|
+ svId: that.VenueId,
|
|
|
+ eqType: 3//设备类型 1 电视盒子 2 演示对应中间件 3 演示客户端
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ QueryDemoVenueEquipInOlinClass(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ that.loading = false;
|
|
|
+ if (json.Rs) {
|
|
|
+ that.EqSn = json.Rs[0].EqSn;
|
|
|
+ that.Memo = json.Rs[0].Memo;
|
|
|
+ clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ that.GetgetUserList();
|
|
|
+ if (that.EqSn) {
|
|
|
+ this.mainTimer = setInterval(() => {
|
|
|
+ this.GetgetUserList();
|
|
|
+ }, 1000);
|
|
|
}
|
|
|
- that.students = json.Rs;
|
|
|
- that.rankInfo = json.Rs;
|
|
|
- that.giveClassName(json.Rs);
|
|
|
- that.ClacClassTime();
|
|
|
+
|
|
|
} else {
|
|
|
- // 已下课
|
|
|
- if (json.Code == '999') {
|
|
|
- that.students = "";
|
|
|
- that.rankInfo = "";
|
|
|
- // this.PlanName = '';
|
|
|
- // this.BeginTime = '';
|
|
|
- // this.Teacher = '';
|
|
|
- that.getClassUserRank();
|
|
|
- } else {
|
|
|
- // 已出错
|
|
|
- that.$message.error(json.Memo);
|
|
|
- }
|
|
|
+ that.$message.error('当前区域没有设置显示设备');
|
|
|
+ that.students = [];
|
|
|
+ that.rankInfo = [];
|
|
|
+ this.PlanName = '';
|
|
|
+ this.BeginTime = '';
|
|
|
+ this.Teacher = '';
|
|
|
+ this.Num = '0';
|
|
|
+ this.classInfo.endTime = "00:00:00";
|
|
|
+ clearInterval(this.mainTimer);//页面销毁时清除定时器
|
|
|
+ return false
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- getList(len) {
|
|
|
- let rs = {};
|
|
|
- for (var i = 0; i < len; i++) {
|
|
|
- rs = {
|
|
|
- Age: 13,
|
|
|
- AvgHr: 0,
|
|
|
- BeginTime: 1608188579,
|
|
|
- Ck: "99",
|
|
|
- Cle: "159",
|
|
|
- DuId: 119,
|
|
|
- EndTime: 0,
|
|
|
- GroupNo: 1,
|
|
|
- Head: "http://192.168.0.2/gc.png",
|
|
|
- Height: 160,
|
|
|
- HrId: 41,
|
|
|
- IsBirthday: 0,
|
|
|
- IsBreaking: 0,
|
|
|
- IsNewUser: 0,
|
|
|
- MaxHr: 80,
|
|
|
- PowerPercent: "80",
|
|
|
- Name: "西门吹雪",
|
|
|
- PkSucessnum: '1',//胜场数
|
|
|
- PkTotalnum: '1',//总场数
|
|
|
- PlanId: 60,
|
|
|
- PureCalorieNoVo2: "500",
|
|
|
- Sex: 1,
|
|
|
- Sn: "22735",
|
|
|
- StaticHr: 60,
|
|
|
- Steps: "1280",
|
|
|
- SvId: 20,
|
|
|
- UserId: 104,
|
|
|
- UserMd5: "55661a861f8fae20dd505b2b4575dc0e",
|
|
|
- Weight: 50,
|
|
|
- ActivePercent: 70,
|
|
|
- bmrMSjRmrcb: 66.00000000000001,
|
|
|
- FormatCk: "12",
|
|
|
- isAlive: true,
|
|
|
- isFinish: false,
|
|
|
- isOver: false,
|
|
|
- IsPrivate: 1,
|
|
|
- lastPushDataTime: 1608188947175,
|
|
|
- lastUpdateTime: 1608188945184,
|
|
|
- queuePushData: [],
|
|
|
- RealHr: "100",
|
|
|
- vo2Max: "123"
|
|
|
- };
|
|
|
- this.students.push(rs);
|
|
|
- this.rankInfo.push(rs);
|
|
|
+ } else {
|
|
|
+ that.$message.error(json.Memo + ' 错误码：' + json.Code);
|
|
|
}
|
|
|
- this.giveClassName(this.students);
|
|
|
- },
|
|
|
- // 给每一个数据加类名，一次遍历全部赋值
|
|
|
- giveClassName(res) {
|
|
|
- let that = this;
|
|
|
- let numberClass = '';
|
|
|
- let colorClass = '';
|
|
|
- for (let i = 0; i < parseInt(res.length); i++) {
|
|
|
- switch (true) {
|
|
|
- case parseInt(res.length) == 1:
|
|
|
- numberClass = 'max';
|
|
|
- break;
|
|
|
- case parseInt(res.length) == 2:
|
|
|
- numberClass = 'two';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 4 && parseInt(res.length) > 2:
|
|
|
- numberClass = 'three';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 6 && parseInt(res.length) > 4:
|
|
|
- numberClass = 'six';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 9 && parseInt(res.length) > 6:
|
|
|
- numberClass = 'nine';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 12 && parseInt(res.length) > 9:
|
|
|
- numberClass = 'ten';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 15 && parseInt(res.length) > 12:
|
|
|
- numberClass = 'twelve';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 20 && parseInt(res.length) > 15:
|
|
|
- numberClass = 'sixteen';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 24 && parseInt(res.length) > 20:
|
|
|
- numberClass = 'twenty';
|
|
|
- break;
|
|
|
- case parseInt(res.length) <= 30 && parseInt(res.length) > 24:
|
|
|
- this.bigUserList = true;
|
|
|
- numberClass = 'twentyFour';
|
|
|
- break;
|
|
|
- case parseInt(res.length) >= 31:
|
|
|
- this.bigUserList = true;
|
|
|
- numberClass = 'twentyFour';
|
|
|
- break;
|
|
|
- }
|
|
|
- let per = parseInt(res[i].ActivePercent);
|
|
|
- switch (true) {
|
|
|
- case per >= 90:
|
|
|
- colorClass = 'red';
|
|
|
- break;
|
|
|
- case per <= 89 && per > 79:
|
|
|
- colorClass = 'brown';
|
|
|
- break;
|
|
|
- case per <= 79 && per > 69:
|
|
|
- colorClass = 'yellow';
|
|
|
- break;
|
|
|
- case per <= 69 && per > 54:
|
|
|
- colorClass = 'green';
|
|
|
- break;
|
|
|
- case per <= 54 && per > 39:
|
|
|
- colorClass = 'violet';
|
|
|
- break;
|
|
|
- case per <= 39:
|
|
|
- colorClass = 'blue';
|
|
|
- break
|
|
|
+ })
|
|
|
+ },
|
|
|
+ GetgetUserList() {
|
|
|
+ let that = this;
|
|
|
+ let param = {
|
|
|
+ token: localStorage.token,
|
|
|
+ eqSn: that.EqSn
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ // CalorieStatsQuery(postdata).then(res => {
|
|
|
+ getHello(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ if (!json.Dp) {
|
|
|
+ // that.$message.error('没有获取到课程信息');
|
|
|
+ this.PlanName = '';
|
|
|
+ this.BeginTime = '';
|
|
|
+ this.Teacher = '';
|
|
|
+ } else {
|
|
|
+ that.ReadLessonInfo(json.Dp);
|
|
|
}
|
|
|
-
|
|
|
- that.studentsClassName[i] = {
|
|
|
- name: numberClass + ' ' + colorClass,
|
|
|
+ that.students = json.Rs;
|
|
|
+ that.rankInfo = json.Rs;
|
|
|
+ that.giveClassName(json.Rs);
|
|
|
+ that.ClacClassTime();
|
|
|
+ } else {
|
|
|
+ // 已下课
|
|
|
+ if (json.Code == '999') {
|
|
|
+ that.students = "";
|
|
|
+ that.rankInfo = "";
|
|
|
+ // this.PlanName = '';
|
|
|
+ // this.BeginTime = '';
|
|
|
+ // this.Teacher = '';
|
|
|
+ that.getClassUserRank();
|
|
|
+ } else {
|
|
|
+ // 已出错
|
|
|
+ that.$message.error(json.Memo);
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
+ })
|
|
|
},
|
|
|
- filters: {
|
|
|
- fmtNum(val) {
|
|
|
- if (val == 0) {
|
|
|
- return '--'
|
|
|
- } else {
|
|
|
- if (parseInt(val) < 0) return 0;
|
|
|
- if (parseInt(val) > 0) return val
|
|
|
- }
|
|
|
- },
|
|
|
- fmtFloat(val) {
|
|
|
- if (val == 0) {
|
|
|
- return '0.0'
|
|
|
- } else {
|
|
|
- return parseFloat(val).toFixed(1);
|
|
|
+ getList(len) {
|
|
|
+ let rs = {};
|
|
|
+ for (var i = 0; i < len; i++) {
|
|
|
+ rs = {
|
|
|
+ Age: 13,
|
|
|
+ AvgHr: 0,
|
|
|
+ BeginTime: 1608188579,
|
|
|
+ Ck: "99",
|
|
|
+ Cle: "159",
|
|
|
+ DuId: 119,
|
|
|
+ EndTime: 0,
|
|
|
+ GroupNo: 1,
|
|
|
+ Head: "http://192.168.0.2/gc.png",
|
|
|
+ Height: 160,
|
|
|
+ HrId: 41,
|
|
|
+ IsBirthday: 0,
|
|
|
+ IsBreaking: 0,
|
|
|
+ IsNewUser: 0,
|
|
|
+ MaxHr: 80,
|
|
|
+ PowerPercent: "80",
|
|
|
+ Name: "西门吹雪",
|
|
|
+ PkSucessnum: '1',//胜场数
|
|
|
+ PkTotalnum: '1',//总场数
|
|
|
+ PlanId: 60,
|
|
|
+ PureCalorieNoVo2: "500",
|
|
|
+ Sex: 1,
|
|
|
+ Sn: "22735",
|
|
|
+ StaticHr: 60,
|
|
|
+ Steps: "1280",
|
|
|
+ SvId: 20,
|
|
|
+ UserId: 104,
|
|
|
+ UserMd5: "55661a861f8fae20dd505b2b4575dc0e",
|
|
|
+ Weight: 50,
|
|
|
+ ActivePercent: 70,
|
|
|
+ bmrMSjRmrcb: 66.00000000000001,
|
|
|
+ FormatCk: "12",
|
|
|
+ isAlive: true,
|
|
|
+ isFinish: false,
|
|
|
+ isOver: false,
|
|
|
+ IsPrivate: 1,
|
|
|
+ lastPushDataTime: 1608188947175,
|
|
|
+ lastUpdateTime: 1608188945184,
|
|
|
+ queuePushData: [],
|
|
|
+ RealHr: "100",
|
|
|
+ vo2Max: "123"
|
|
|
+ };
|
|
|
+ this.students.push(rs);
|
|
|
+ this.rankInfo.push(rs);
|
|
|
+ }
|
|
|
+ this.giveClassName(this.students);
|
|
|
+ },
|
|
|
+ // 给每一个数据加类名，一次遍历全部赋值
|
|
|
+ giveClassName(res) {
|
|
|
+ let that = this;
|
|
|
+ let numberClass = '';
|
|
|
+ let colorClass = '';
|
|
|
+ for (let i = 0; i < parseInt(res.length); i++) {
|
|
|
+ switch (true) {
|
|
|
+ case parseInt(res.length) == 1:
|
|
|
+ numberClass = 'max';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) == 2:
|
|
|
+ numberClass = 'two';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 4 && parseInt(res.length) > 2:
|
|
|
+ numberClass = 'three';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 6 && parseInt(res.length) > 4:
|
|
|
+ numberClass = 'six';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 9 && parseInt(res.length) > 6:
|
|
|
+ numberClass = 'nine';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 12 && parseInt(res.length) > 9:
|
|
|
+ numberClass = 'ten';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 15 && parseInt(res.length) > 12:
|
|
|
+ numberClass = 'twelve';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 20 && parseInt(res.length) > 15:
|
|
|
+ numberClass = 'sixteen';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 24 && parseInt(res.length) > 20:
|
|
|
+ numberClass = 'twenty';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) <= 30 && parseInt(res.length) > 24:
|
|
|
+ this.bigUserList = true;
|
|
|
+ numberClass = 'twentyFour';
|
|
|
+ break;
|
|
|
+ case parseInt(res.length) >= 31:
|
|
|
+ this.bigUserList = true;
|
|
|
+ numberClass = 'twentyFour';
|
|
|
+ break;
|
|
|
}
|
|
|
- },
|
|
|
- fmtInt(val) {
|
|
|
- if (val == 0) {
|
|
|
- return '0'
|
|
|
- } else {
|
|
|
- return parseInt(val);
|
|
|
+ let per = parseInt(res[i].ActivePercent);
|
|
|
+ switch (true) {
|
|
|
+ case per >= 90:
|
|
|
+ colorClass = 'red';
|
|
|
+ break;
|
|
|
+ case per <= 89 && per > 79:
|
|
|
+ colorClass = 'brown';
|
|
|
+ break;
|
|
|
+ case per <= 79 && per > 69:
|
|
|
+ colorClass = 'yellow';
|
|
|
+ break;
|
|
|
+ case per <= 69 && per > 54:
|
|
|
+ colorClass = 'green';
|
|
|
+ break;
|
|
|
+ case per <= 54 && per > 39:
|
|
|
+ colorClass = 'violet';
|
|
|
+ break;
|
|
|
+ case per <= 39:
|
|
|
+ colorClass = 'blue';
|
|
|
+ break
|
|
|
}
|
|
|
- },
|
|
|
- max100(val) {
|
|
|
- if (val <= 100) {
|
|
|
- return val
|
|
|
- } else {
|
|
|
- return 100
|
|
|
+
|
|
|
+ that.studentsClassName[i] = {
|
|
|
+ name: numberClass + ' ' + colorClass,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- components: {
|
|
|
- levelIcon, power, userRank
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ fmtNum(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ return '--'
|
|
|
+ } else {
|
|
|
+ if (parseInt(val) < 0) return 0;
|
|
|
+ if (parseInt(val) > 0) return val
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fmtFloat(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ return '0.0'
|
|
|
+ } else {
|
|
|
+ return parseFloat(val).toFixed(1);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fmtInt(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ return '0'
|
|
|
+ } else {
|
|
|
+ return parseInt(val);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ max100(val) {
|
|
|
+ if (val <= 100) {
|
|
|
+ return val
|
|
|
+ } else {
|
|
|
+ return 100
|
|
|
+ }
|
|
|
}
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ levelIcon, power, userRank
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
- @import "../assets/css/bg.css";
|
|
|
-
|
|
|
- .context {
|
|
|
- border-radius: 12px;
|
|
|
- height: 820px;
|
|
|
- overflow-y: scroll;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- background-color: #fff !important;
|
|
|
- padding: 5px;
|
|
|
- }
|
|
|
-
|
|
|
- .context::-webkit-scrollbar { /*滚动条整体样式*/
|
|
|
- width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
- height: 1px;
|
|
|
- }
|
|
|
-
|
|
|
- .context::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
|
|
|
- border-radius: 5px;
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
- background: #535353;
|
|
|
- }
|
|
|
-
|
|
|
- .context::-webkit-scrollbar-track { /*滚动条里面轨道*/
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
- border-radius: 5px;
|
|
|
- background: #EDEDED;
|
|
|
- }
|
|
|
-
|
|
|
- .panel /deep/ h5 {
|
|
|
- margin: 0;
|
|
|
- text-align: left;
|
|
|
- font-size: 18px;
|
|
|
- font-weight: normal;
|
|
|
- padding-bottom: 10px;
|
|
|
- border-bottom: 1px solid #F0F2F5;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .change {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- padding-top: 10px;
|
|
|
- padding-bottom: 0px;
|
|
|
- }
|
|
|
-
|
|
|
- .el-button--primary {
|
|
|
- margin-right: 10px;
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .change button {
|
|
|
- float: right;
|
|
|
- margin-right: 10px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
-
|
|
|
- .basicInfo {
|
|
|
- float: left;
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 2rem;
|
|
|
- color: #fff;
|
|
|
- padding-left: 1%;
|
|
|
- padding-top: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .userList {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- min-height: 42rem;
|
|
|
- margin-top: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- em {
|
|
|
- font-style: normal;
|
|
|
- }
|
|
|
-
|
|
|
- ul, li {
|
|
|
- list-style: none;
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
-
|
|
|
- ul {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- min-height: 42rem;
|
|
|
- overflow: hidden;
|
|
|
- margin: 0 auto;
|
|
|
- display: inline-flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- flex-wrap: wrap;
|
|
|
- }
|
|
|
-
|
|
|
- .blue .centerLi {
|
|
|
- background: #028FE1;
|
|
|
- }
|
|
|
-
|
|
|
- .violet .centerLi {
|
|
|
- background: #6D26FA;
|
|
|
- }
|
|
|
-
|
|
|
- .green .centerLi {
|
|
|
- background: #059F00;
|
|
|
- }
|
|
|
-
|
|
|
- .yellow .centerLi {
|
|
|
- background: #DFB200;
|
|
|
- }
|
|
|
-
|
|
|
- .brown .centerLi {
|
|
|
- background: #EA8813;
|
|
|
- }
|
|
|
-
|
|
|
- .red .centerLi {
|
|
|
- background: #CF1122;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .slowJump {
|
|
|
- animation: mymove 3s infinite;
|
|
|
- -webkit-animation: mymove 3s infinite; /*Safari and Chrome*/
|
|
|
- animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- /* Safari 和 Chrome */
|
|
|
- -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- }
|
|
|
-
|
|
|
- .normalJump {
|
|
|
- animation: mymove 2s infinite;
|
|
|
- -webkit-animation: mymove 2s infinite; /*Safari and Chrome*/
|
|
|
- animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- /* Safari 和 Chrome */
|
|
|
- -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- }
|
|
|
-
|
|
|
- .fastJump {
|
|
|
- animation: mymove 1s infinite;
|
|
|
- -webkit-animation: mymove 1s infinite; /*Safari and Chrome*/
|
|
|
- animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- /* Safari 和 Chrome */
|
|
|
- -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
- -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
- }
|
|
|
-
|
|
|
- @keyframes mymove {
|
|
|
- 0% {
|
|
|
- transform: scale(1); /*开始为原始大小*/
|
|
|
- }
|
|
|
- 25% {
|
|
|
- transform: scale(1.1); /*放大1.1倍*/
|
|
|
- }
|
|
|
- 50% {
|
|
|
- transform: scale(1);
|
|
|
- }
|
|
|
- 75% {
|
|
|
- transform: scale(1.1);
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- @-webkit-keyframes mymove /*Safari and Chrome*/
|
|
|
- {
|
|
|
- 0% {
|
|
|
- transform: scale(1); /*开始为原始大小*/
|
|
|
- }
|
|
|
- 25% {
|
|
|
- transform: scale(1.1); /*放大1.1倍*/
|
|
|
- }
|
|
|
- 50% {
|
|
|
- transform: scale(1);
|
|
|
- }
|
|
|
- 75% {
|
|
|
- transform: scale(1.1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .centerLi {
|
|
|
- width: 99.8%;
|
|
|
- overflow: hidden;
|
|
|
- float: left;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
-
|
|
|
- .human img {
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- border: 2px solid #fff;
|
|
|
- border-radius: 33rem;
|
|
|
- /*box-shadow: 0px 0px 5px #fff;*/
|
|
|
- }
|
|
|
-
|
|
|
- s {
|
|
|
- text-decoration: none;
|
|
|
- }
|
|
|
-
|
|
|
- em {
|
|
|
- font-style: normal;
|
|
|
- }
|
|
|
-
|
|
|
- .cla {
|
|
|
- position: relative;
|
|
|
- float: left;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
-
|
|
|
- .centerLi .human {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .human .name {
|
|
|
- width: 100%;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
-
|
|
|
- .human .name div {
|
|
|
- float: left;
|
|
|
- width: 20%;
|
|
|
- text-align: left;
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .human .name .nameMd {
|
|
|
- width: 60%;
|
|
|
- text-align: center;
|
|
|
- text-indent: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .lcla span {
|
|
|
- position: relative;
|
|
|
- float: left;
|
|
|
- }
|
|
|
-
|
|
|
- .cla em {
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
-
|
|
|
- .heartJump {
|
|
|
- position: relative;
|
|
|
- }
|
|
|
-
|
|
|
- .lhj span {
|
|
|
- position: relative;
|
|
|
- text-align: right;
|
|
|
- float: left;
|
|
|
- }
|
|
|
-
|
|
|
- .rhj {
|
|
|
- float: right;
|
|
|
- }
|
|
|
-
|
|
|
- .rhj img {
|
|
|
- position: relative;
|
|
|
- float: right;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi {
|
|
|
- width: 96%;
|
|
|
- height: auto;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- margin-top: 1.2rem;
|
|
|
- font-weight: normal !important;
|
|
|
- color: #fff;
|
|
|
- text-align: left;
|
|
|
- line-height: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi img {
|
|
|
- float: left;
|
|
|
- margin-left: 10%;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi .btcla {
|
|
|
- width: 33.333%;
|
|
|
- float: left;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi .btck {
|
|
|
- width: 33.333%;
|
|
|
- float: left;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi .step {
|
|
|
- width: 33.333%;
|
|
|
- float: right;
|
|
|
- }
|
|
|
-
|
|
|
- .bottomLi span {
|
|
|
- float: left;
|
|
|
- text-align: left;
|
|
|
- }
|
|
|
-
|
|
|
- .topLi {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
-
|
|
|
- /*max*/
|
|
|
- .max {
|
|
|
- width: 40rem;
|
|
|
- height: 20rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .centerLi {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .max .human .name {
|
|
|
- font-size: 2rem;
|
|
|
- height: 5rem;
|
|
|
- line-height: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .human img {
|
|
|
- width: 10rem;
|
|
|
- height: 10rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .cla {
|
|
|
- width: 12rem;
|
|
|
- height: 8rem;
|
|
|
- top: -10rem;
|
|
|
- left: 0;
|
|
|
- font-size: 8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .lcla span {
|
|
|
- font-size: 3rem;
|
|
|
- top: -8rem;
|
|
|
- float: left;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .max .cla em {
|
|
|
- font-size: 6rem;
|
|
|
- left: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .lhj span {
|
|
|
- width: 12rem;
|
|
|
- height: 8rem;
|
|
|
- top: -8rem;
|
|
|
- left: 10rem;
|
|
|
- font-size: 6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .rhj img {
|
|
|
- width: 2rem;
|
|
|
- top: -8rem;
|
|
|
- right: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .longIcon {
|
|
|
- position: absolute;
|
|
|
- width: 1.96rem;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- bottom: 2rem;
|
|
|
- right: 3.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .topLi {
|
|
|
- height: 16rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi {
|
|
|
- height: 6rem;
|
|
|
- line-height: 6rem;
|
|
|
- font-size: 2rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btck {
|
|
|
- /*text-indent: 1.6rem;*/
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi span {
|
|
|
- line-height: 3rem;
|
|
|
- text-indent: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btck {
|
|
|
- width: 29%;
|
|
|
- padding-left: 1%;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .step {
|
|
|
- width: 24%;
|
|
|
- padding-right: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .max .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.5rem
|
|
|
- }
|
|
|
-
|
|
|
- .max .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 8.75rem
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btcla img {
|
|
|
- width: 1.8rem;
|
|
|
- height: 1.8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btcla span {
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btck span {
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .max .bottomLi .btck img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- /*two*/
|
|
|
- .two {
|
|
|
- width: 40rem;
|
|
|
- height: 20rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-top: 6%
|
|
|
- }
|
|
|
-
|
|
|
- .two .centerLi {
|
|
|
- height: 100%;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- }
|
|
|
-
|
|
|
- .two:nth-child(2) {
|
|
|
- float: right;
|
|
|
- }
|
|
|
-
|
|
|
- .two .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 4rem;
|
|
|
- font-size: 2rem;
|
|
|
- line-height: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .human img {
|
|
|
- width: 11rem;
|
|
|
- height: 11rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .cla {
|
|
|
- width: 12rem;
|
|
|
- height: 8rem;
|
|
|
- top: -9rem;
|
|
|
- left: 0;
|
|
|
- font-size: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .lcla span {
|
|
|
- font-size: 2rem;
|
|
|
- top: -9rem;
|
|
|
- float: left;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .two .cla em {
|
|
|
- font-size: 5rem;
|
|
|
- left: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .lhj span {
|
|
|
- width: 12rem;
|
|
|
- height: 8rem;
|
|
|
- top: -9rem;
|
|
|
- left: 10rem;
|
|
|
- font-size: 5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .rhj img {
|
|
|
- width: 1.6rem;
|
|
|
- top: -9rem;
|
|
|
- right: 2.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .topLi {
|
|
|
- height: 16rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi {
|
|
|
- font-size: 2.5rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi span {
|
|
|
- line-height: 3rem;
|
|
|
- text-indent: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi .btck {
|
|
|
- width: 29%;
|
|
|
- padding-left: 0%;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi .step {
|
|
|
- width: 26%;
|
|
|
- padding-right: 1%;
|
|
|
- }
|
|
|
-
|
|
|
- .two .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.5rem
|
|
|
- }
|
|
|
-
|
|
|
- .two .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 9rem
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi .btck img {
|
|
|
- width: 2.6rem;
|
|
|
- height: 2.6rem;
|
|
|
- margin-top: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .two .bottomLi .btck span {
|
|
|
- text-indent: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- /*three*/
|
|
|
- .three {
|
|
|
- width: 40rem;
|
|
|
- height: 16rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 1%
|
|
|
- }
|
|
|
-
|
|
|
- .three .centerLi {
|
|
|
- width: 90%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .three .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 2.5rem;
|
|
|
- font-size: 1.8rem;
|
|
|
- line-height: 2.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .human img {
|
|
|
- width: 9rem;
|
|
|
- height: 9rem;
|
|
|
- margin-top: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .cla {
|
|
|
- width: 11rem;
|
|
|
- height: 8rem;
|
|
|
- top: -8rem;
|
|
|
- left: 0;
|
|
|
- font-size: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .lcla span {
|
|
|
- font-size: 2rem;
|
|
|
- top: -9rem;
|
|
|
- float: left;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .three .cla em {
|
|
|
- font-size: 5rem;
|
|
|
- left: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .lhj span {
|
|
|
- width: 12rem;
|
|
|
- height: 8rem;
|
|
|
- top: -8rem;
|
|
|
- left: 7rem;
|
|
|
- font-size: 4.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .rhj img {
|
|
|
- width: 1.4rem;
|
|
|
- top: -8rem;
|
|
|
- right: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .topLi {
|
|
|
- height: 13rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi {
|
|
|
- font-size: 1.6rem;
|
|
|
- margin-top: 0rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .three .bottomLi img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi span {
|
|
|
- line-height: 3.2rem;
|
|
|
- text-indent: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi .btck {
|
|
|
- width: 30%;
|
|
|
- padding-left: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi .step {
|
|
|
- width: 25%;
|
|
|
- padding-right: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .three .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.5rem
|
|
|
- }
|
|
|
-
|
|
|
- .three .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 8rem
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi .btck img {
|
|
|
- width: 2.4rem;
|
|
|
- height: 2.4rem;
|
|
|
- margin-top: 0.2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .bottomLi .btck span {
|
|
|
- text-indent: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three /deep/ .powerContainer img {
|
|
|
- width: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*six*/
|
|
|
- .six {
|
|
|
- width: 35rem;
|
|
|
- height: 14rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 1%
|
|
|
- }
|
|
|
-
|
|
|
- .six .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .six .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 3.2rem;
|
|
|
- font-size: 1.3rem;
|
|
|
- line-height: 3.2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .human img {
|
|
|
- width: 7rem;
|
|
|
- height: 7rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .cla {
|
|
|
- width: 8rem;
|
|
|
- height: 8rem;
|
|
|
- top: -8rem;
|
|
|
- left: 0;
|
|
|
- font-size: 6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .lcla span {
|
|
|
- font-size: 2rem;
|
|
|
- top: -6.5rem;
|
|
|
- float: left;
|
|
|
- left: -0.2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .cla em {
|
|
|
- font-size: 4rem;
|
|
|
- left: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .lhj span {
|
|
|
- width: 8rem;
|
|
|
- height: 8rem;
|
|
|
- top: -6.5rem;
|
|
|
- left: 11rem;
|
|
|
- font-size: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .rhj img {
|
|
|
- width: 1.4rem;
|
|
|
- top: -7rem;
|
|
|
- right: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .topLi {
|
|
|
- height: 10.9rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 2rem;
|
|
|
- margin-top: 0.2rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi img {
|
|
|
- width: 1.8rem;
|
|
|
- margin-top: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .btcla img {
|
|
|
- width: 1.4rem;
|
|
|
- margin-top: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .btck img {
|
|
|
- width: 1.6rem;
|
|
|
- margin-top: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi span {
|
|
|
- line-height: 3.2rem;
|
|
|
- text-indent: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .btck {
|
|
|
- width: 33%;
|
|
|
- padding-left: 3%;
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .step {
|
|
|
- width: 28%;
|
|
|
- padding-right: 0%;
|
|
|
- }
|
|
|
-
|
|
|
- .six .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -1.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .six .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 11.3rem
|
|
|
- }
|
|
|
-
|
|
|
- .six .bottomLi .btck img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- /*nine*/
|
|
|
- .nine {
|
|
|
- width: 33.3333%;
|
|
|
- height: 13rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 0.4rem
|
|
|
- }
|
|
|
-
|
|
|
- .nine .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 2.4rem;
|
|
|
- font-size: 1.6rem;
|
|
|
- line-height: 2.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .human img {
|
|
|
- width: 6rem;
|
|
|
- height: 6rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .cla {
|
|
|
- width: 8rem;
|
|
|
- height: 8rem;
|
|
|
- top: -5.5rem;
|
|
|
- left: 0;
|
|
|
- font-size: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .lcla span {
|
|
|
- font-size: 1.3rem;
|
|
|
- top: -5.5rem;
|
|
|
- float: left;
|
|
|
- left: 0.05rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .cla em {
|
|
|
- font-size: 4rem;
|
|
|
- left: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .lhj span {
|
|
|
- width: 7rem;
|
|
|
- height: 8rem;
|
|
|
- top: -5.5rem;
|
|
|
- left: 12rem;
|
|
|
- font-size: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -5.5rem;
|
|
|
- right: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .topLi {
|
|
|
- height: 10rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1.6rem;
|
|
|
- margin-top: 0.2rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .nine .bottomLi img {
|
|
|
- width: 1.6rem;
|
|
|
- height: 1.6rem;
|
|
|
- margin-top: 0.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi span {
|
|
|
- line-height: 3.2rem;
|
|
|
- text-indent: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 5%;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi .step {
|
|
|
- width: 28%;
|
|
|
- padding-right: 0%;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -1.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .nine .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 1.3rem
|
|
|
- }
|
|
|
-
|
|
|
- .nine .bottomLi .btck img {
|
|
|
- width: 2rem;
|
|
|
- height: 2rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine /deep/ .powerContainer img {
|
|
|
- width: 1.2rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*ten*/
|
|
|
- .ten {
|
|
|
- width: 25rem;
|
|
|
- height: 13rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 0.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .ten .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 2rem;
|
|
|
- font-size: 1.4rem;
|
|
|
- line-height: 2rem;
|
|
|
- margin-bottom: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .human img {
|
|
|
- width: 6rem;
|
|
|
- height: 6rem;
|
|
|
- margin-top: 0.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .cla {
|
|
|
- width: 5rem;
|
|
|
- height: 4rem;
|
|
|
- top: -5rem;
|
|
|
- left: 2rem;
|
|
|
- font-size: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .lcla span {
|
|
|
- font-size: 1.5rem;
|
|
|
- top: -5rem;
|
|
|
- float: left;
|
|
|
- left: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .cla em {
|
|
|
- font-size: 4rem;
|
|
|
- left: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .lhj span {
|
|
|
- width: 4rem;
|
|
|
- height: 4rem;
|
|
|
- top: -5rem;
|
|
|
- left: 9.5rem;
|
|
|
- font-size: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -4.5rem;
|
|
|
- right: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .topLi {
|
|
|
- height: 9rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1.5rem;
|
|
|
- margin-top: 0.1rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi img {
|
|
|
- width: 1.5em;
|
|
|
- height: 1.5rem;
|
|
|
- margin-top: 0.9rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi span {
|
|
|
- line-height: 3.2rem;
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 3%;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .bottomLi .step {
|
|
|
- width: 29%;
|
|
|
- padding-right: 0%;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -1.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .ten .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 1.2rem;
|
|
|
- line-height: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .btck img {
|
|
|
- width: 1.8rem;
|
|
|
- height: 1.8rem;
|
|
|
- margin-top: 0.65rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten /deep/ .powerContainer img {
|
|
|
- width: 1.2rem;
|
|
|
- margin-left: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*twelve*/
|
|
|
- .twelve {
|
|
|
- width: 20rem;
|
|
|
- height: 11rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 1.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 1.5rem;
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 1.5rem;
|
|
|
- margin-bottom: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .human img {
|
|
|
- width: 5rem;
|
|
|
- height: 5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .cla {
|
|
|
- width: 4rem;
|
|
|
- height: 4rem;
|
|
|
- top: -4rem;
|
|
|
- left: 1.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .lcla span {
|
|
|
- font-size: 1rem;
|
|
|
- top: -4rem;
|
|
|
- float: left;
|
|
|
- left: 1.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .cla em {
|
|
|
- font-size: 3rem;
|
|
|
- left: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .lhj span {
|
|
|
- width: 1.2rem;
|
|
|
- height: 1.2rem;
|
|
|
- top: -4.2rem;
|
|
|
- left: 8.1rem;
|
|
|
- font-size: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -4rem;
|
|
|
- right: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .topLi {
|
|
|
- height: 8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1.4rem;
|
|
|
- margin-top: 0.1rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi img {
|
|
|
- width: 1.4rem;
|
|
|
- height: 1.4rem;
|
|
|
- margin-top: 0.75rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi span {
|
|
|
- line-height: 3.2rem;
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .bottomLi .step {
|
|
|
- width: 27%;
|
|
|
- padding-right: 1%;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 3.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .btck img {
|
|
|
- width: 1.5rem;
|
|
|
- height: 1.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .btck img {
|
|
|
- width: 1.7rem;
|
|
|
- height: 1.7rem;
|
|
|
- margin-top: 0.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve /deep/ .powerContainer img {
|
|
|
- width: 1.2rem;
|
|
|
- margin-left: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*sixteen*/
|
|
|
- .sixteen {
|
|
|
- width: 20rem;
|
|
|
- height: 10rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 0.1rem
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 2.5rem;
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 2.5rem;
|
|
|
- margin-top: 0.1rem;
|
|
|
- margin-bottom: 0.1rem;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .human img {
|
|
|
- width: 4rem;
|
|
|
- height: 4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .cla {
|
|
|
- width: 1.2rem;
|
|
|
- height: 1.4rem;
|
|
|
- top: -3.7rem;
|
|
|
- left: 3rem;
|
|
|
- font-size: 0.15rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .lcla span {
|
|
|
- font-size: 1rem;
|
|
|
- top: -3.5rem;
|
|
|
- float: left;
|
|
|
- left: 5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .cla em {
|
|
|
- font-size: 3rem;
|
|
|
- left: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .lhj span {
|
|
|
- width: 1rem;
|
|
|
- height: 1.8rem;
|
|
|
- top: -4rem;
|
|
|
- left: 11rem;
|
|
|
- font-size: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -4rem;
|
|
|
- right: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .topLi {
|
|
|
- height: 8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1.3rem;
|
|
|
- margin-top: -0.05rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi img {
|
|
|
- width: 1.2rem;
|
|
|
- height: 1.2rem;
|
|
|
- margin-top: 0.25rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi span {
|
|
|
- line-height: 2.2rem;
|
|
|
- text-indent: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 3%;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .bottomLi .step {
|
|
|
- width: 27%;
|
|
|
- padding-right: 2%;
|
|
|
- /*text-align: center;*/
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 0.9rem
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .btck img {
|
|
|
- width: 1.6rem;
|
|
|
- height: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen /deep/ .powerContainer img {
|
|
|
- width: 1.2rem;
|
|
|
- margin-left: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*twenty*/
|
|
|
- .twenty {
|
|
|
- width: 20rem;
|
|
|
- height: 8rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 0.1rem
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .centerLi {
|
|
|
- width: 98%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 2.1rem;
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 2rem;
|
|
|
- margin-bottom: 0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .human img {
|
|
|
- width: 3.5rem;
|
|
|
- height: 3.5rem;
|
|
|
- margin-top: 0.15rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .cla {
|
|
|
- width: 0.95rem;
|
|
|
- height: 1.4rem;
|
|
|
- top: -3.5rem;
|
|
|
- left: 3rem;
|
|
|
- font-size: 0.8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .lcla span {
|
|
|
- font-size: 1rem;
|
|
|
- top: -3.5rem;
|
|
|
- float: left;
|
|
|
- left: 5.2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .cla em {
|
|
|
- font-size: 3rem;
|
|
|
- left: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .lhj span {
|
|
|
- width: 0.85rem;
|
|
|
- height: 2rem;
|
|
|
- top: -3.5rem;
|
|
|
- left: 11rem;
|
|
|
- font-size: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -3.5rem;
|
|
|
- right: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .topLi {
|
|
|
- height: 6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1rem;
|
|
|
- margin-top: -0.1rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi img {
|
|
|
- width: 1.2rem;
|
|
|
- height: 1.2rem;
|
|
|
- margin-top: 0.8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi span {
|
|
|
- line-height: 3rem;
|
|
|
- text-indent: 0.05rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 3%;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .bottomLi .step {
|
|
|
- width: 28%;
|
|
|
- padding-right: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 3.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twenty /deep/ .powerContainer img {
|
|
|
- width: 1rem;
|
|
|
- margin-left: 1.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .bigUserList {
|
|
|
- min-height: 58rem
|
|
|
- }
|
|
|
-
|
|
|
- /*twentyFour*/
|
|
|
- .twentyFour {
|
|
|
- width: 20rem;
|
|
|
- height: 9rem;
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 0.1rem
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .centerLi {
|
|
|
- width: 96%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*border: 1px solid #fff;*/
|
|
|
- /*border: 0.03rem solid rgba(255,255,255,0.1);*/
|
|
|
- /*box-shadow:inset 0 0 6px rgba(0,0,0,0.4);*/
|
|
|
- float: none;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .human .name {
|
|
|
- width: 100%;
|
|
|
- height: 1.6rem;
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .human img {
|
|
|
- width: 5rem;
|
|
|
- height: 5rem;
|
|
|
- margin-top: 0.05rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .cla {
|
|
|
- width: 0.9rem;
|
|
|
- height: 1.4rem;
|
|
|
- top: -4rem;
|
|
|
- left: 2.2rem;
|
|
|
- font-size: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .lcla span {
|
|
|
- font-size: 0.2rem;
|
|
|
- top: -4rem;
|
|
|
- float: left;
|
|
|
- left: 4.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .cla em {
|
|
|
- font-size: 3rem;
|
|
|
- left: 5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .lhj span {
|
|
|
- width: 0.75rem;
|
|
|
- height: 2rem;
|
|
|
- top: -4rem;
|
|
|
- left: 11rem;
|
|
|
- font-size: 3rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .rhj img {
|
|
|
- width: 1rem;
|
|
|
- top: -4rem;
|
|
|
- right: 0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .topLi {
|
|
|
- height: 7.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi {
|
|
|
- width: 98%;
|
|
|
- font-size: 1.2rem;
|
|
|
- margin-top: 0rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi img {
|
|
|
- width: 1rem;
|
|
|
- height: 1rem;
|
|
|
- margin-top: 0.15rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi span {
|
|
|
- line-height: 1.4rem;
|
|
|
- text-indent: 0.05rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi .btcla {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi .btck {
|
|
|
- width: 32%;
|
|
|
- padding-left: 2%;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi .step {
|
|
|
- width: 28%;
|
|
|
- padding-right: 0%;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .cla em.plus {
|
|
|
- position: relative;
|
|
|
- left: -0.2rem
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .lhj span.plus {
|
|
|
- position: relative;
|
|
|
- left: 3.2rem;
|
|
|
- line-height: 0.45rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .btck img {
|
|
|
- width: 1.3rem;
|
|
|
- height: 1.3rem;
|
|
|
- margin-top: 0.12rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .bottomLi .step img {
|
|
|
- margin-top: 0.16rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour /deep/ .powerContainer img {
|
|
|
- width: 1rem;
|
|
|
- margin-left: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*生日*/
|
|
|
-
|
|
|
- .birth {
|
|
|
- position: relative;
|
|
|
- top: -11rem;
|
|
|
- width: 40%;
|
|
|
- height: 1px;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
-
|
|
|
- .birth img.birthCrow {
|
|
|
- position: relative;
|
|
|
- top: -0.1rem;
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- border: none;
|
|
|
- }
|
|
|
-
|
|
|
- .birth img.birthText {
|
|
|
- position: relative;
|
|
|
- top: 6rem;
|
|
|
- width: 5rem;
|
|
|
- height: 3rem;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- border: none;
|
|
|
- }
|
|
|
-
|
|
|
- .two .birth img.birthCrow {
|
|
|
- top: -1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .birth img.birthCrow {
|
|
|
- top: 1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .birth {
|
|
|
- top: -8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .birth img.birthCrow {
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- top: 0rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .birth img.birthText {
|
|
|
- top: 4rem;
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .birth {
|
|
|
- top: -8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .birth img.birthCrow {
|
|
|
- width: 3rem;
|
|
|
- height: 1.5rem;
|
|
|
- top: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .birth img.birthText {
|
|
|
- top: 4.5rem;
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .birth {
|
|
|
- top: -8.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .birth img.birthCrow {
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- top: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .birth img.birthText {
|
|
|
- top: 5rem;
|
|
|
- width: 4rem;
|
|
|
- height: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .birth {
|
|
|
- top: -8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .birth img.birthCrow {
|
|
|
- width: 3rem;
|
|
|
- height: 1.5rem;
|
|
|
- top: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .birth img.birthText {
|
|
|
- top: 5rem;
|
|
|
- width: 3rem;
|
|
|
- height: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .birth {
|
|
|
- top: -7rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .birth img.birthCrow {
|
|
|
- width: 2rem;
|
|
|
- height: 0.8rem;
|
|
|
- top: 2.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .birth img.birthText {
|
|
|
- top: 4.5rem;
|
|
|
- width: 3rem;
|
|
|
- height: 1.6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .birth {
|
|
|
- top: -6rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .birth img.birthCrow {
|
|
|
- width: 2rem;
|
|
|
- height: 0.8rem;
|
|
|
- top: 2.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .birth img.birthText {
|
|
|
- top: 4.45rem;
|
|
|
- width: 2rem;
|
|
|
- height: 0.8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .birth {
|
|
|
- top: -8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .birth img.birthCrow {
|
|
|
- width: 2.5rem;
|
|
|
- height: 1rem;
|
|
|
- top: 2.4rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .birth img.birthText {
|
|
|
- top: 5.5rem;
|
|
|
- width: 3rem;
|
|
|
- height: 1.7rem;
|
|
|
- }
|
|
|
-
|
|
|
- /*isPrivate*/
|
|
|
- .isPrivate {
|
|
|
- position: relative;
|
|
|
- float: right;
|
|
|
- top: -10rem;
|
|
|
- width: 75%;
|
|
|
- height: 1px;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- overflow: visible;
|
|
|
- }
|
|
|
-
|
|
|
- .isPrivate i {
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- margin-top: 0.1rem;
|
|
|
- width: 3rem !important;
|
|
|
- height: 3rem !important;
|
|
|
- border: none !important;
|
|
|
- background: url("../static/img/privateSign.svg");
|
|
|
- background-size: 100% 100%;
|
|
|
- background-position: top center;
|
|
|
- }
|
|
|
-
|
|
|
- .two .isPrivate {
|
|
|
- top: -11rem;
|
|
|
- }
|
|
|
-
|
|
|
- .three .isPrivate {
|
|
|
- top: -10rem;
|
|
|
- left: -0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .isPrivate {
|
|
|
- top: -8rem;
|
|
|
- left: -1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .six .isPrivate i {
|
|
|
- width: 3.2rem !important;
|
|
|
- height: 3.2rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .isPrivate {
|
|
|
- top: -7rem;
|
|
|
- left: -1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .nine .isPrivate i {
|
|
|
- width: 3rem !important;
|
|
|
- height: 3rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .isPrivate {
|
|
|
- top: -7rem;
|
|
|
- }
|
|
|
-
|
|
|
- .ten .isPrivate i {
|
|
|
- width: 2.5rem !important;
|
|
|
- height: 2.5rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .isPrivate {
|
|
|
- top: -5.8rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twelve .isPrivate i {
|
|
|
- width: 2.1rem !important;
|
|
|
- height: 2.1rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .isPrivate {
|
|
|
- top: -4.5rem;
|
|
|
- left: -0.1rem;
|
|
|
- }
|
|
|
-
|
|
|
- .sixteen .isPrivate i {
|
|
|
- width: 2rem !important;
|
|
|
- height: 2rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .isPrivate {
|
|
|
- top: -4rem;
|
|
|
- left: -0.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twenty .isPrivate i {
|
|
|
- width: 1.5rem !important;
|
|
|
- height: 1.5rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .isPrivate {
|
|
|
- top: -5.5rem;
|
|
|
- }
|
|
|
-
|
|
|
- .twentyFour .isPrivate i {
|
|
|
- width: 2rem !important;
|
|
|
- height: 2rem !important;
|
|
|
- }
|
|
|
-
|
|
|
- .bottom {
|
|
|
- position: relative;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- /deep/ .el-dialog {
|
|
|
- background-color: #028fe1;
|
|
|
- background: url("../static/img/bg/bg_1.png");
|
|
|
- background-size: 100% 100%;
|
|
|
- background-repeat: no-repeat;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
-
|
|
|
- /deep/ .el-dialog__title {
|
|
|
- color: #fff;
|
|
|
- font-size: 2rem;
|
|
|
- }
|
|
|
-
|
|
|
- /deep/ .el-input__inner {
|
|
|
- background-color: inherit;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
-
|
|
|
- .el-select-dropdown__item {
|
|
|
- padding-left: 10px !important;
|
|
|
- }
|
|
|
-
|
|
|
- .el-scrollbar {
|
|
|
- padding-left: 10px !important;
|
|
|
- }
|
|
|
-
|
|
|
- .selected {
|
|
|
- padding-left: 10px !important;
|
|
|
- }
|
|
|
- .room {
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
- #regionSelect {
|
|
|
- height: 25px;
|
|
|
- line-height: 25px;
|
|
|
- background-color: inherit;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- #regionSelect option {
|
|
|
- color: #000;
|
|
|
- }
|
|
|
- /deep/ .el-dialog__body .el-col {
|
|
|
- width: 50%;
|
|
|
- }
|
|
|
+@import "../assets/css/bg.css";
|
|
|
+
|
|
|
+.context {
|
|
|
+ border-radius: 12px;
|
|
|
+ height: 820px;
|
|
|
+ overflow-y: scroll;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ background-color: #fff !important;
|
|
|
+ padding: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.context::-webkit-scrollbar {
|
|
|
+ /*滚动条整体样式*/
|
|
|
+ width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
+ height: 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.context::-webkit-scrollbar-thumb {
|
|
|
+ /*滚动条里面小方块*/
|
|
|
+ border-radius: 5px;
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+ background: #535353;
|
|
|
+}
|
|
|
+
|
|
|
+.context::-webkit-scrollbar-track {
|
|
|
+ /*滚动条里面轨道*/
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+ border-radius: 5px;
|
|
|
+ background: #ededed;
|
|
|
+}
|
|
|
+
|
|
|
+.panel /deep/ h5 {
|
|
|
+ margin: 0;
|
|
|
+ text-align: left;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: normal;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #f0f2f5;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.change {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding-top: 10px;
|
|
|
+ padding-bottom: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-button--primary {
|
|
|
+ margin-right: 10px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.change button {
|
|
|
+ float: right;
|
|
|
+ margin-right: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.basicInfo {
|
|
|
+ float: left;
|
|
|
+ font-size: 1rem;
|
|
|
+ line-height: 2rem;
|
|
|
+ color: #fff;
|
|
|
+ padding-left: 1%;
|
|
|
+ padding-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.userList {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ min-height: 42rem;
|
|
|
+ margin-top: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+em {
|
|
|
+ font-style: normal;
|
|
|
+}
|
|
|
+
|
|
|
+ul,
|
|
|
+li {
|
|
|
+ list-style: none;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+ul {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ min-height: 42rem;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0 auto;
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+
|
|
|
+.blue .centerLi {
|
|
|
+ background: #028fe1;
|
|
|
+}
|
|
|
+
|
|
|
+.violet .centerLi {
|
|
|
+ background: #6d26fa;
|
|
|
+}
|
|
|
+
|
|
|
+.green .centerLi {
|
|
|
+ background: #059f00;
|
|
|
+}
|
|
|
+
|
|
|
+.yellow .centerLi {
|
|
|
+ background: #dfb200;
|
|
|
+}
|
|
|
+
|
|
|
+.brown .centerLi {
|
|
|
+ background: #ea8813;
|
|
|
+}
|
|
|
+
|
|
|
+.red .centerLi {
|
|
|
+ background: #cf1122;
|
|
|
+}
|
|
|
+
|
|
|
+.slowJump {
|
|
|
+ animation: mymove 3s infinite;
|
|
|
+ -webkit-animation: mymove 3s infinite; /*Safari and Chrome*/
|
|
|
+ animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+ /* Safari 和 Chrome */
|
|
|
+ -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+}
|
|
|
+
|
|
|
+.normalJump {
|
|
|
+ animation: mymove 2s infinite;
|
|
|
+ -webkit-animation: mymove 2s infinite; /*Safari and Chrome*/
|
|
|
+ animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+ /* Safari 和 Chrome */
|
|
|
+ -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+}
|
|
|
+
|
|
|
+.fastJump {
|
|
|
+ animation: mymove 1s infinite;
|
|
|
+ -webkit-animation: mymove 1s infinite; /*Safari and Chrome*/
|
|
|
+ animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+ /* Safari 和 Chrome */
|
|
|
+ -webkit-animation-direction: alternate; /*轮流反向播放动画。*/
|
|
|
+ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes mymove {
|
|
|
+ 0% {
|
|
|
+ transform: scale(1); /*开始为原始大小*/
|
|
|
+ }
|
|
|
+ 25% {
|
|
|
+ transform: scale(1.1); /*放大1.1倍*/
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: scale(1);
|
|
|
+ }
|
|
|
+ 75% {
|
|
|
+ transform: scale(1.1);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@-webkit-keyframes mymove /*Safari and Chrome*/ {
|
|
|
+ 0% {
|
|
|
+ transform: scale(1); /*开始为原始大小*/
|
|
|
+ }
|
|
|
+ 25% {
|
|
|
+ transform: scale(1.1); /*放大1.1倍*/
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: scale(1);
|
|
|
+ }
|
|
|
+ 75% {
|
|
|
+ transform: scale(1.1);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.centerLi {
|
|
|
+ width: 99.8%;
|
|
|
+ overflow: hidden;
|
|
|
+ float: left;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.human img {
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ border: 2px solid #fff;
|
|
|
+ border-radius: 33rem;
|
|
|
+ /*box-shadow: 0px 0px 5px #fff;*/
|
|
|
+}
|
|
|
+
|
|
|
+s {
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
+
|
|
|
+em {
|
|
|
+ font-style: normal;
|
|
|
+}
|
|
|
+
|
|
|
+.cla {
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+.centerLi .human {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.human .name {
|
|
|
+ width: 100%;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.human .name div {
|
|
|
+ float: left;
|
|
|
+ width: 20%;
|
|
|
+ text-align: left;
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.human .name .nameMd {
|
|
|
+ width: 60%;
|
|
|
+ text-align: center;
|
|
|
+ text-indent: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.lcla span {
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+
|
|
|
+.cla em {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+.heartJump {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.lhj span {
|
|
|
+ position: relative;
|
|
|
+ text-align: right;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+
|
|
|
+.rhj {
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+
|
|
|
+.rhj img {
|
|
|
+ position: relative;
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi {
|
|
|
+ width: 96%;
|
|
|
+ height: auto;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-top: 1.2rem;
|
|
|
+ font-weight: normal !important;
|
|
|
+ color: #fff;
|
|
|
+ text-align: left;
|
|
|
+ line-height: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi img {
|
|
|
+ float: left;
|
|
|
+ margin-left: 10%;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi .btcla {
|
|
|
+ width: 33.333%;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi .btck {
|
|
|
+ width: 33.333%;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi .step {
|
|
|
+ width: 33.333%;
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+
|
|
|
+.bottomLi span {
|
|
|
+ float: left;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+.topLi {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+/*max*/
|
|
|
+.max {
|
|
|
+ width: 40rem;
|
|
|
+ height: 20rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .centerLi {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.max .human .name {
|
|
|
+ font-size: 2rem;
|
|
|
+ height: 5rem;
|
|
|
+ line-height: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .human img {
|
|
|
+ width: 10rem;
|
|
|
+ height: 10rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .cla {
|
|
|
+ width: 12rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -10rem;
|
|
|
+ left: 0;
|
|
|
+ font-size: 8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .lcla span {
|
|
|
+ font-size: 3rem;
|
|
|
+ top: -8rem;
|
|
|
+ float: left;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.max .cla em {
|
|
|
+ font-size: 6rem;
|
|
|
+ left: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .lhj span {
|
|
|
+ width: 12rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -8rem;
|
|
|
+ left: 10rem;
|
|
|
+ font-size: 6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .rhj img {
|
|
|
+ width: 2rem;
|
|
|
+ top: -8rem;
|
|
|
+ right: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .longIcon {
|
|
|
+ position: absolute;
|
|
|
+ width: 1.96rem;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ bottom: 2rem;
|
|
|
+ right: 3.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .topLi {
|
|
|
+ height: 16rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi {
|
|
|
+ height: 6rem;
|
|
|
+ line-height: 6rem;
|
|
|
+ font-size: 2rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btck {
|
|
|
+ /*text-indent: 1.6rem;*/
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi span {
|
|
|
+ line-height: 3rem;
|
|
|
+ text-indent: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btck {
|
|
|
+ width: 29%;
|
|
|
+ padding-left: 1%;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .step {
|
|
|
+ width: 24%;
|
|
|
+ padding-right: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.max .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 8.75rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btcla img {
|
|
|
+ width: 1.8rem;
|
|
|
+ height: 1.8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btcla span {
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btck span {
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.max .bottomLi .btck img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*two*/
|
|
|
+.two {
|
|
|
+ width: 40rem;
|
|
|
+ height: 20rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 6%;
|
|
|
+}
|
|
|
+
|
|
|
+.two .centerLi {
|
|
|
+ height: 100%;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+}
|
|
|
+
|
|
|
+.two:nth-child(2) {
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+
|
|
|
+.two .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 4rem;
|
|
|
+ font-size: 2rem;
|
|
|
+ line-height: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .human img {
|
|
|
+ width: 11rem;
|
|
|
+ height: 11rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .cla {
|
|
|
+ width: 12rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -9rem;
|
|
|
+ left: 0;
|
|
|
+ font-size: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .lcla span {
|
|
|
+ font-size: 2rem;
|
|
|
+ top: -9rem;
|
|
|
+ float: left;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.two .cla em {
|
|
|
+ font-size: 5rem;
|
|
|
+ left: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .lhj span {
|
|
|
+ width: 12rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -9rem;
|
|
|
+ left: 10rem;
|
|
|
+ font-size: 5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .rhj img {
|
|
|
+ width: 1.6rem;
|
|
|
+ top: -9rem;
|
|
|
+ right: 2.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .topLi {
|
|
|
+ height: 16rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi {
|
|
|
+ font-size: 2.5rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi span {
|
|
|
+ line-height: 3rem;
|
|
|
+ text-indent: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi .btck {
|
|
|
+ width: 29%;
|
|
|
+ padding-left: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi .step {
|
|
|
+ width: 26%;
|
|
|
+ padding-right: 1%;
|
|
|
+}
|
|
|
+
|
|
|
+.two .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 9rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi .btck img {
|
|
|
+ width: 2.6rem;
|
|
|
+ height: 2.6rem;
|
|
|
+ margin-top: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.two .bottomLi .btck span {
|
|
|
+ text-indent: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*three*/
|
|
|
+.three {
|
|
|
+ width: 40rem;
|
|
|
+ height: 16rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 1%;
|
|
|
+}
|
|
|
+
|
|
|
+.three .centerLi {
|
|
|
+ width: 90%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.three .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 2.5rem;
|
|
|
+ font-size: 1.8rem;
|
|
|
+ line-height: 2.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .human img {
|
|
|
+ width: 9rem;
|
|
|
+ height: 9rem;
|
|
|
+ margin-top: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .cla {
|
|
|
+ width: 11rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -8rem;
|
|
|
+ left: 0;
|
|
|
+ font-size: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .lcla span {
|
|
|
+ font-size: 2rem;
|
|
|
+ top: -9rem;
|
|
|
+ float: left;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.three .cla em {
|
|
|
+ font-size: 5rem;
|
|
|
+ left: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .lhj span {
|
|
|
+ width: 12rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -8rem;
|
|
|
+ left: 7rem;
|
|
|
+ font-size: 4.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .rhj img {
|
|
|
+ width: 1.4rem;
|
|
|
+ top: -8rem;
|
|
|
+ right: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .topLi {
|
|
|
+ height: 13rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi {
|
|
|
+ font-size: 1.6rem;
|
|
|
+ margin-top: 0rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi span {
|
|
|
+ line-height: 3.2rem;
|
|
|
+ text-indent: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi .btck {
|
|
|
+ width: 30%;
|
|
|
+ padding-left: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi .step {
|
|
|
+ width: 25%;
|
|
|
+ padding-right: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.three .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi .btck img {
|
|
|
+ width: 2.4rem;
|
|
|
+ height: 2.4rem;
|
|
|
+ margin-top: 0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .bottomLi .btck span {
|
|
|
+ text-indent: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three /deep/ .powerContainer img {
|
|
|
+ width: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*six*/
|
|
|
+.six {
|
|
|
+ width: 35rem;
|
|
|
+ height: 14rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 1%;
|
|
|
+}
|
|
|
+
|
|
|
+.six .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.six .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 3.2rem;
|
|
|
+ font-size: 1.3rem;
|
|
|
+ line-height: 3.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .human img {
|
|
|
+ width: 7rem;
|
|
|
+ height: 7rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .cla {
|
|
|
+ width: 8rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -8rem;
|
|
|
+ left: 0;
|
|
|
+ font-size: 6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .lcla span {
|
|
|
+ font-size: 2rem;
|
|
|
+ top: -6.5rem;
|
|
|
+ float: left;
|
|
|
+ left: -0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .cla em {
|
|
|
+ font-size: 4rem;
|
|
|
+ left: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .lhj span {
|
|
|
+ width: 8rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -6.5rem;
|
|
|
+ left: 11rem;
|
|
|
+ font-size: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .rhj img {
|
|
|
+ width: 1.4rem;
|
|
|
+ top: -7rem;
|
|
|
+ right: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .topLi {
|
|
|
+ height: 10.9rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 2rem;
|
|
|
+ margin-top: 0.2rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi img {
|
|
|
+ width: 1.8rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .btcla img {
|
|
|
+ width: 1.4rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .btck img {
|
|
|
+ width: 1.6rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi span {
|
|
|
+ line-height: 3.2rem;
|
|
|
+ text-indent: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .btck {
|
|
|
+ width: 33%;
|
|
|
+ padding-left: 3%;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .step {
|
|
|
+ width: 28%;
|
|
|
+ padding-right: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.six .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -1.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 11.3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .bottomLi .btck img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*nine*/
|
|
|
+.nine {
|
|
|
+ width: 33.3333%;
|
|
|
+ height: 13rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 2.4rem;
|
|
|
+ font-size: 1.6rem;
|
|
|
+ line-height: 2.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .human img {
|
|
|
+ width: 6rem;
|
|
|
+ height: 6rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .cla {
|
|
|
+ width: 8rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -5.5rem;
|
|
|
+ left: 0;
|
|
|
+ font-size: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .lcla span {
|
|
|
+ font-size: 1.3rem;
|
|
|
+ top: -5.5rem;
|
|
|
+ float: left;
|
|
|
+ left: 0.05rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .cla em {
|
|
|
+ font-size: 4rem;
|
|
|
+ left: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .lhj span {
|
|
|
+ width: 7rem;
|
|
|
+ height: 8rem;
|
|
|
+ top: -5.5rem;
|
|
|
+ left: 12rem;
|
|
|
+ font-size: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -5.5rem;
|
|
|
+ right: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .topLi {
|
|
|
+ height: 10rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1.6rem;
|
|
|
+ margin-top: 0.2rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi img {
|
|
|
+ width: 1.6rem;
|
|
|
+ height: 1.6rem;
|
|
|
+ margin-top: 0.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi span {
|
|
|
+ line-height: 3.2rem;
|
|
|
+ text-indent: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 5%;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi .step {
|
|
|
+ width: 28%;
|
|
|
+ padding-right: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -1.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 1.3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .bottomLi .btck img {
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ margin-top: 0.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine /deep/ .powerContainer img {
|
|
|
+ width: 1.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*ten*/
|
|
|
+.ten {
|
|
|
+ width: 25rem;
|
|
|
+ height: 13rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 2rem;
|
|
|
+ font-size: 1.4rem;
|
|
|
+ line-height: 2rem;
|
|
|
+ margin-bottom: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .human img {
|
|
|
+ width: 6rem;
|
|
|
+ height: 6rem;
|
|
|
+ margin-top: 0.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .cla {
|
|
|
+ width: 5rem;
|
|
|
+ height: 4rem;
|
|
|
+ top: -5rem;
|
|
|
+ left: 2rem;
|
|
|
+ font-size: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .lcla span {
|
|
|
+ font-size: 1.5rem;
|
|
|
+ top: -5rem;
|
|
|
+ float: left;
|
|
|
+ left: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .cla em {
|
|
|
+ font-size: 4rem;
|
|
|
+ left: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .lhj span {
|
|
|
+ width: 4rem;
|
|
|
+ height: 4rem;
|
|
|
+ top: -5rem;
|
|
|
+ left: 9.5rem;
|
|
|
+ font-size: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -4.5rem;
|
|
|
+ right: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .topLi {
|
|
|
+ height: 9rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1.5rem;
|
|
|
+ margin-top: 0.1rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi img {
|
|
|
+ width: 1.5em;
|
|
|
+ height: 1.5rem;
|
|
|
+ margin-top: 0.9rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi span {
|
|
|
+ line-height: 3.2rem;
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 3%;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .bottomLi .step {
|
|
|
+ width: 29%;
|
|
|
+ padding-right: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -1.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 1.2rem;
|
|
|
+ line-height: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .btck img {
|
|
|
+ width: 1.8rem;
|
|
|
+ height: 1.8rem;
|
|
|
+ margin-top: 0.65rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten /deep/ .powerContainer img {
|
|
|
+ width: 1.2rem;
|
|
|
+ margin-left: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*twelve*/
|
|
|
+.twelve {
|
|
|
+ width: 20rem;
|
|
|
+ height: 11rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 1.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 1.5rem;
|
|
|
+ font-size: 1rem;
|
|
|
+ line-height: 1.5rem;
|
|
|
+ margin-bottom: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .human img {
|
|
|
+ width: 5rem;
|
|
|
+ height: 5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .cla {
|
|
|
+ width: 4rem;
|
|
|
+ height: 4rem;
|
|
|
+ top: -4rem;
|
|
|
+ left: 1.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .lcla span {
|
|
|
+ font-size: 1rem;
|
|
|
+ top: -4rem;
|
|
|
+ float: left;
|
|
|
+ left: 1.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .cla em {
|
|
|
+ font-size: 3rem;
|
|
|
+ left: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .lhj span {
|
|
|
+ width: 1.2rem;
|
|
|
+ height: 1.2rem;
|
|
|
+ top: -4.2rem;
|
|
|
+ left: 8.1rem;
|
|
|
+ font-size: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -4rem;
|
|
|
+ right: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .topLi {
|
|
|
+ height: 8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1.4rem;
|
|
|
+ margin-top: 0.1rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi img {
|
|
|
+ width: 1.4rem;
|
|
|
+ height: 1.4rem;
|
|
|
+ margin-top: 0.75rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi span {
|
|
|
+ line-height: 3.2rem;
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .bottomLi .step {
|
|
|
+ width: 27%;
|
|
|
+ padding-right: 1%;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 3.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .btck img {
|
|
|
+ width: 1.5rem;
|
|
|
+ height: 1.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .btck img {
|
|
|
+ width: 1.7rem;
|
|
|
+ height: 1.7rem;
|
|
|
+ margin-top: 0.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve /deep/ .powerContainer img {
|
|
|
+ width: 1.2rem;
|
|
|
+ margin-left: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*sixteen*/
|
|
|
+.sixteen {
|
|
|
+ width: 20rem;
|
|
|
+ height: 10rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 2.5rem;
|
|
|
+ font-size: 1rem;
|
|
|
+ line-height: 2.5rem;
|
|
|
+ margin-top: 0.1rem;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .human img {
|
|
|
+ width: 4rem;
|
|
|
+ height: 4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .cla {
|
|
|
+ width: 1.2rem;
|
|
|
+ height: 1.4rem;
|
|
|
+ top: -3.7rem;
|
|
|
+ left: 3rem;
|
|
|
+ font-size: 0.15rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .lcla span {
|
|
|
+ font-size: 1rem;
|
|
|
+ top: -3.5rem;
|
|
|
+ float: left;
|
|
|
+ left: 5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .cla em {
|
|
|
+ font-size: 3rem;
|
|
|
+ left: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .lhj span {
|
|
|
+ width: 1rem;
|
|
|
+ height: 1.8rem;
|
|
|
+ top: -4rem;
|
|
|
+ left: 11rem;
|
|
|
+ font-size: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -4rem;
|
|
|
+ right: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .topLi {
|
|
|
+ height: 8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1.3rem;
|
|
|
+ margin-top: -0.05rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi img {
|
|
|
+ width: 1.2rem;
|
|
|
+ height: 1.2rem;
|
|
|
+ margin-top: 0.25rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi span {
|
|
|
+ line-height: 2.2rem;
|
|
|
+ text-indent: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 3%;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .bottomLi .step {
|
|
|
+ width: 27%;
|
|
|
+ padding-right: 2%;
|
|
|
+ /*text-align: center;*/
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 0.9rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .btck img {
|
|
|
+ width: 1.6rem;
|
|
|
+ height: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen /deep/ .powerContainer img {
|
|
|
+ width: 1.2rem;
|
|
|
+ margin-left: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*twenty*/
|
|
|
+.twenty {
|
|
|
+ width: 20rem;
|
|
|
+ height: 8rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .centerLi {
|
|
|
+ width: 98%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 2.1rem;
|
|
|
+ font-size: 1rem;
|
|
|
+ line-height: 2rem;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .human img {
|
|
|
+ width: 3.5rem;
|
|
|
+ height: 3.5rem;
|
|
|
+ margin-top: 0.15rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .cla {
|
|
|
+ width: 0.95rem;
|
|
|
+ height: 1.4rem;
|
|
|
+ top: -3.5rem;
|
|
|
+ left: 3rem;
|
|
|
+ font-size: 0.8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .lcla span {
|
|
|
+ font-size: 1rem;
|
|
|
+ top: -3.5rem;
|
|
|
+ float: left;
|
|
|
+ left: 5.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .cla em {
|
|
|
+ font-size: 3rem;
|
|
|
+ left: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .lhj span {
|
|
|
+ width: 0.85rem;
|
|
|
+ height: 2rem;
|
|
|
+ top: -3.5rem;
|
|
|
+ left: 11rem;
|
|
|
+ font-size: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -3.5rem;
|
|
|
+ right: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .topLi {
|
|
|
+ height: 6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1rem;
|
|
|
+ margin-top: -0.1rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi img {
|
|
|
+ width: 1.2rem;
|
|
|
+ height: 1.2rem;
|
|
|
+ margin-top: 0.8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi span {
|
|
|
+ line-height: 3rem;
|
|
|
+ text-indent: 0.05rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 3%;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .bottomLi .step {
|
|
|
+ width: 28%;
|
|
|
+ padding-right: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 3.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty /deep/ .powerContainer img {
|
|
|
+ width: 1rem;
|
|
|
+ margin-left: 1.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.bigUserList {
|
|
|
+ min-height: 58rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*twentyFour*/
|
|
|
+.twentyFour {
|
|
|
+ width: 20rem;
|
|
|
+ height: 9rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .centerLi {
|
|
|
+ width: 96%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*border: 1px solid #fff;*/
|
|
|
+ /*border: 0.03rem solid rgba(255,255,255,0.1);*/
|
|
|
+ /*box-shadow:inset 0 0 6px rgba(0,0,0,0.4);*/
|
|
|
+ float: none;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .human .name {
|
|
|
+ width: 100%;
|
|
|
+ height: 1.6rem;
|
|
|
+ font-size: 1rem;
|
|
|
+ line-height: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .human img {
|
|
|
+ width: 5rem;
|
|
|
+ height: 5rem;
|
|
|
+ margin-top: 0.05rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .cla {
|
|
|
+ width: 0.9rem;
|
|
|
+ height: 1.4rem;
|
|
|
+ top: -4rem;
|
|
|
+ left: 2.2rem;
|
|
|
+ font-size: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .lcla span {
|
|
|
+ font-size: 0.2rem;
|
|
|
+ top: -4rem;
|
|
|
+ float: left;
|
|
|
+ left: 4.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .cla em {
|
|
|
+ font-size: 3rem;
|
|
|
+ left: 5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .lhj span {
|
|
|
+ width: 0.75rem;
|
|
|
+ height: 2rem;
|
|
|
+ top: -4rem;
|
|
|
+ left: 11rem;
|
|
|
+ font-size: 3rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .rhj img {
|
|
|
+ width: 1rem;
|
|
|
+ top: -4rem;
|
|
|
+ right: 0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .topLi {
|
|
|
+ height: 7.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi {
|
|
|
+ width: 98%;
|
|
|
+ font-size: 1.2rem;
|
|
|
+ margin-top: 0rem;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi img {
|
|
|
+ width: 1rem;
|
|
|
+ height: 1rem;
|
|
|
+ margin-top: 0.15rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi span {
|
|
|
+ line-height: 1.4rem;
|
|
|
+ text-indent: 0.05rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi .btcla {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi .btck {
|
|
|
+ width: 32%;
|
|
|
+ padding-left: 2%;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi .step {
|
|
|
+ width: 28%;
|
|
|
+ padding-right: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .cla em.plus {
|
|
|
+ position: relative;
|
|
|
+ left: -0.2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .lhj span.plus {
|
|
|
+ position: relative;
|
|
|
+ left: 3.2rem;
|
|
|
+ line-height: 0.45rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .btck img {
|
|
|
+ width: 1.3rem;
|
|
|
+ height: 1.3rem;
|
|
|
+ margin-top: 0.12rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .bottomLi .step img {
|
|
|
+ margin-top: 0.16rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour /deep/ .powerContainer img {
|
|
|
+ width: 1rem;
|
|
|
+ margin-left: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*生日*/
|
|
|
+
|
|
|
+.birth {
|
|
|
+ position: relative;
|
|
|
+ top: -11rem;
|
|
|
+ width: 40%;
|
|
|
+ height: 1px;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.birth img.birthCrow {
|
|
|
+ position: relative;
|
|
|
+ top: -0.1rem;
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+.birth img.birthText {
|
|
|
+ position: relative;
|
|
|
+ top: 6rem;
|
|
|
+ width: 5rem;
|
|
|
+ height: 3rem;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+.two .birth img.birthCrow {
|
|
|
+ top: -1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .birth img.birthCrow {
|
|
|
+ top: 1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .birth {
|
|
|
+ top: -8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .birth img.birthCrow {
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+ top: 0rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .birth img.birthText {
|
|
|
+ top: 4rem;
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .birth {
|
|
|
+ top: -8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .birth img.birthCrow {
|
|
|
+ width: 3rem;
|
|
|
+ height: 1.5rem;
|
|
|
+ top: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .birth img.birthText {
|
|
|
+ top: 4.5rem;
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .birth {
|
|
|
+ top: -8.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .birth img.birthCrow {
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+ top: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .birth img.birthText {
|
|
|
+ top: 5rem;
|
|
|
+ width: 4rem;
|
|
|
+ height: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .birth {
|
|
|
+ top: -8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .birth img.birthCrow {
|
|
|
+ width: 3rem;
|
|
|
+ height: 1.5rem;
|
|
|
+ top: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .birth img.birthText {
|
|
|
+ top: 5rem;
|
|
|
+ width: 3rem;
|
|
|
+ height: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .birth {
|
|
|
+ top: -7rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .birth img.birthCrow {
|
|
|
+ width: 2rem;
|
|
|
+ height: 0.8rem;
|
|
|
+ top: 2.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .birth img.birthText {
|
|
|
+ top: 4.5rem;
|
|
|
+ width: 3rem;
|
|
|
+ height: 1.6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .birth {
|
|
|
+ top: -6rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .birth img.birthCrow {
|
|
|
+ width: 2rem;
|
|
|
+ height: 0.8rem;
|
|
|
+ top: 2.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .birth img.birthText {
|
|
|
+ top: 4.45rem;
|
|
|
+ width: 2rem;
|
|
|
+ height: 0.8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .birth {
|
|
|
+ top: -8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .birth img.birthCrow {
|
|
|
+ width: 2.5rem;
|
|
|
+ height: 1rem;
|
|
|
+ top: 2.4rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .birth img.birthText {
|
|
|
+ top: 5.5rem;
|
|
|
+ width: 3rem;
|
|
|
+ height: 1.7rem;
|
|
|
+}
|
|
|
+
|
|
|
+/*isPrivate*/
|
|
|
+.isPrivate {
|
|
|
+ position: relative;
|
|
|
+ float: right;
|
|
|
+ top: -10rem;
|
|
|
+ width: 75%;
|
|
|
+ height: 1px;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: visible;
|
|
|
+}
|
|
|
+
|
|
|
+.isPrivate i {
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-top: 0.1rem;
|
|
|
+ width: 3rem !important;
|
|
|
+ height: 3rem !important;
|
|
|
+ border: none !important;
|
|
|
+ background: url("../static/img/privateSign.svg");
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-position: top center;
|
|
|
+}
|
|
|
+
|
|
|
+.two .isPrivate {
|
|
|
+ top: -11rem;
|
|
|
+}
|
|
|
+
|
|
|
+.three .isPrivate {
|
|
|
+ top: -10rem;
|
|
|
+ left: -0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .isPrivate {
|
|
|
+ top: -8rem;
|
|
|
+ left: -1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.six .isPrivate i {
|
|
|
+ width: 3.2rem !important;
|
|
|
+ height: 3.2rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .isPrivate {
|
|
|
+ top: -7rem;
|
|
|
+ left: -1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.nine .isPrivate i {
|
|
|
+ width: 3rem !important;
|
|
|
+ height: 3rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .isPrivate {
|
|
|
+ top: -7rem;
|
|
|
+}
|
|
|
+
|
|
|
+.ten .isPrivate i {
|
|
|
+ width: 2.5rem !important;
|
|
|
+ height: 2.5rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .isPrivate {
|
|
|
+ top: -5.8rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twelve .isPrivate i {
|
|
|
+ width: 2.1rem !important;
|
|
|
+ height: 2.1rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .isPrivate {
|
|
|
+ top: -4.5rem;
|
|
|
+ left: -0.1rem;
|
|
|
+}
|
|
|
+
|
|
|
+.sixteen .isPrivate i {
|
|
|
+ width: 2rem !important;
|
|
|
+ height: 2rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .isPrivate {
|
|
|
+ top: -4rem;
|
|
|
+ left: -0.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twenty .isPrivate i {
|
|
|
+ width: 1.5rem !important;
|
|
|
+ height: 1.5rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .isPrivate {
|
|
|
+ top: -5.5rem;
|
|
|
+}
|
|
|
+
|
|
|
+.twentyFour .isPrivate i {
|
|
|
+ width: 2rem !important;
|
|
|
+ height: 2rem !important;
|
|
|
+}
|
|
|
+
|
|
|
+.bottom {
|
|
|
+ position: relative;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-dialog {
|
|
|
+ background-color: #028fe1;
|
|
|
+ background: url("../static/img/bg/bg_1.png");
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-dialog__title {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 2rem;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-input__inner {
|
|
|
+ background-color: inherit;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.el-select-dropdown__item {
|
|
|
+ padding-left: 10px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-scrollbar {
|
|
|
+ padding-left: 10px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.selected {
|
|
|
+ padding-left: 10px !important;
|
|
|
+}
|
|
|
+.room {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+#regionSelect {
|
|
|
+ height: 25px;
|
|
|
+ line-height: 25px;
|
|
|
+ background-color: inherit;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+#regionSelect option {
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+/deep/ .el-dialog__body .el-col {
|
|
|
+ width: 50%;
|
|
|
+}
|
|
|
</style>
|
