hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-21 16:56:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

共享者大会迁移

Browse Source
This commit is contained in:
cai.pingxiang
2025-12-05 14:55:46 +08:00
committed by joshen
parent b517d92347
commit 3b2056b4ec
526 changed files with 19080 additions and 658 deletions
Download Patch File Download Diff File Expand all files Collapse all files

786
src/views/contributorConference/index.vue Normal file
View File

@@ -0,0 +1,786 @@
<template>
<div id="bg">
<div id="navi">
<img class="stick1" src="@/assets/images/contributor/sideNavi/stickLong.png" alt="">
<img class="stick2" src="@/assets/images/contributor/sideNavi/stick.png" alt="">
<ul><img id="top" src="@/assets/images/contributor/sideNavi/navigation_top.png" alt="">
<li :class="{active: isActive === 'markPoint1'}" @click="scrollTo('markPoint1')" >最佳培训项目</li>
<li :class="{active: isActive === 'markPoint2'}" @click="scrollTo('markPoint2')">最佳教师</li>
<li :class="{active: isActive === 'markPoint3'}" @click="scrollTo('markPoint3')">最佳课程</li>
<li :class="{active: isActive === 'markPoint4'}" @click="scrollTo('markPoint4')">最佳案例</li>
<li :class="{active: isActive === 'markPoint5'}" @click="scrollTo('markPoint5')">最佳培训伙伴</li>
</ul>
<ul style="margin-top:33px;cursor: pointer;"><img src="@/assets/images/contributor/sideNavi/navigation_bottom.png" @click="scrollTo('markPoint6')" alt=""></ul>
</div>
<div id="videoBox">
<img id="video_button" v-show="button" @click="play" src="@/assets/images/contributor/video_button.png" alt="">
<video ref="videoPlayer" id="video" :controls="controls" src="https://u.boe.com/upload/contributor/VIDEOV2.mp4" poster="../../assets/images/contributor/video_post_v3.png"></video>
</div>
<span id="markPoint1"></span>
<span @click="toMore('/contributor/project')" id="more1" class="more">查看更多>></span>
<div id="project">
<div class="item1" @click="toProjectDetail(4)">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_9.png" alt="">
</div>
<div class="txt1">
显示器件及物联网创新业务正处于战略级变革的关键阶段，要解决运营管理模式、组织、人才等一系列不适配的问题，需要一批在未来1-3年内能担当重任的新型复合型人才梯队。项目成果显著，培养出来的学员深受业务的好评与欢迎，一二期学员在各个新事业新业务及重要岗位上承担着重要的职责。
</div>
</div>
<div class="item1" @click="toProjectDetail(9)">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_14.png" alt="">
</div>
<div class="txt1">
我们开创性的采用了场景化的培训形式，还原日常真实管理场景，通过案例演练强化应用，为学员们提供有效可复制的管理方法。通过多角度的需求访谈，我们聚焦了5大典型管理场景，并选取了8个子场景作为本次培训重点解决问题；在整个项目过程中，完成了3场三天两夜的线下集训，现场通过场景演练...
</div>
</div>
<div class="item1" @click="toProjectDetail(10)" style="margin-right: 0px;">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_15.png" alt="">
</div>
<div class="txt1">
部级干部是承上启下的中坚力量，目前MLED中层管理者在创新业务抢占市场阶段缺乏速度、力度和高度，缺乏以客户为中心的导向精神，为强化MLED业务腰部力量，急需提高中层干部能力，敢于决策，独挡业务，抢占先机。
</div>
</div>
<div class="item1" @click="toProjectDetail(8)">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_13.png" alt="">
</div>
<div class="txt1">
项目背景：1）经营层面：①整体持续亏损，经营压力大②各条产线的业务发展阶段不同，也遭遇着不同的难题③创新业务前期投入大，资金回收周期长。2）组织层面：①团队之间仍需提升协作，形成合力②整体团队士气需不断激活。3）人员层面：①对达成战略目标的信心不足②中基层管理干部对战略目标理解不深刻...
</div>
</div>
<div class="item1" @click="toProjectDetail(1)">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_6.png" alt="">
</div>
<div class="txt1">
本项目旨在为集团各组织培养能够“想到、说到、写到、做到”的战略型人才，使学员在战略思维、商业逻辑、市场意识等层面重构认知体系。来自集团16个不同组织的37名学员从308名报名者中脱颖而出，90后占60%，构成多元化年轻骨干学员群体框架：• 能力：从素质、个人、战略专业、业务四维度定义目标人员...
</div>
</div>
<div class="item1" @click="toProjectDetail(7)" style="margin-right:0">
<div class="border1">
<img class="img1" src="@/assets/images/contributor/project/img_12.png" alt="">
</div>
<div class="txt1">
为加快建设“一个、数字化、可视”的京东方，随着集团数字化变革的强力推进，CTIO组织需要培养一批在1-3年内能担当重任的新型复合型人才梯队，引领数字化变革；组织人才储备相对丰富，但尚未通过有效方式发掘高潜人才，支撑组织战略调整，同时现有人才使用和培养方式也无法自然生长...
</div>
</div>
</div>
<span id="markPoint2"></span>
<span @click="toMore('/contributor/teacher')" id="more2" class="more">查看更多&gt;&gt;</span>
<div id="teacher">
<div class="item2">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/jinzhiheng.png" alt="">
<div class="namespace">
<div class="name">金志恒</div>
<div class="depart">显示器件及物联网创新业务前台</div>
</div>
</div>
<div class="txt2">代表课程：《整机全生命周期概论》《解决方案销售》《规划先行 战略致胜-如何制定战略》</div>
</div>
<div class="item2">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/huangzhubing.png" alt="">
<div class="namespace">
<div class="name">黄助兵</div>
<div class="depart">显示器件及物联网创新业务中台</div>
</div>
</div>
<div class="txt2">代表课程：《创新挖潜 节能降耗 成本降低秘籍分享-B9 Bx成本降低工作与案例分享》《走进Cell/Cell工艺简介》</div>
</div>
<div class="item2" style="margin-right:0">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/wangxiuliang.png" alt="">
<div class="namespace">
<div class="name">王修亮</div>
<div class="depart">传感器及解决方案业务</div>
</div>
</div>
<div class="txt2">代表课程：《平台化与工厂管理》《数字化与工厂管理》</div>
</div>
<div class="item2">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/MLED-sunlei.png" alt="">
<div class="namespace">
<div class="name">孙雷</div>
<div class="depart">MLED业务</div>
</div>
</div>
<div class="txt2">代表课程：《MLED直显工艺介绍》</div>
</div>
<div class="item2">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/aizhihua.png" alt="">
<div class="namespace">
<div class="name">艾智华</div>
<div class="depart">智慧医工业务</div>
</div>
</div>
<div class="txt2">代表课程：《甲状腺结节》《高尿酸血症与痛风的规范化诊治》《医学科研素养》《我的成长：从学生到医生》</div>
</div>
<div class="item2" style="margin-right:0">
<div class="cardTopPart">
<img src="@/assets/images/contributor/portrait/bestTeacher/caixiang.png" alt="">
<div class="namespace">
<div class="name">蔡翔</div>
<div class="depart">后台(业务支援体系)</div>
</div>
</div>
<div class="txt2">代表课程：《京东方的历史与文化》《职业发展规划与管理》《托业复习指南》《项目管理》</div>
</div>
</div>
<span id="markPoint3"></span>
<span @click="toMore('/contributor/course')" id="more3" class="more">查看更多>></span>
<div id="course">
<div id="button"><button @click="showOnlineCourse" :class="{activeBtn: btnAct === 'on'}" class="normalBtn">在线课程</button><button @click="showOfflineCourse" :class="{activeBtn: btnAct === 'off'}" class="normalBtn">面授课程</button></div>
<div v-show="online">
<div class="item3" @click="toLink('http://u.boe.com/pc/course/boeframe?id=F41343DA-DF37-80F2-8EFF-EF18821BA275&type=20')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/img5.png" alt="">
<div class="txt3">T社对标学习分享</div>
<div class="txt4">石悦/刘莎/葛兴/金晓妍/冯光宇/沈伟/李京鹏</div>
</div>
<div class="item3" @click="toLink('http://u.boe.com/pc/course/detail?id=1037024129070534656')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/img4.png" alt="">
<div class="txt3">平台化管理与工厂运营变革</div>
<div class="txt4">王修亮</div>
</div>
<div class="item3" style="margin-right:0" @click="toLink('http://u.boe.com/pc/course/studyindex?id=989930841121492992')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/xinpianjichu.png" alt="">
<div class="txt3">芯片基础</div>
<div class="txt4">范利涛</div>
</div>
<div class="item3" @click="toLink('http://u.boe.com/pc/course/studyindex?id=1042015352001228800')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="" >
<img class="img2" src="../../assets/images/contributor/course/shulijiankang.png" alt="">
<div class="txt3">树立健康生活方式 科学看待胃、肠镜检查--消化内科</div>
<div class="txt4" style="margin-top:-29px">姚永刚</div>
</div>
<div class="item3" @click="toLink('http://u.boe.com/pc/course/studyindex?id=989452448236048384')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="" >
<img class="img2" src="../../assets/images/contributor/course/qiyejingying.png" alt="">
<div class="txt3">企业经营法则</div>
<div class="txt4">苏倩</div>
</div>
<div class="item3" style="margin-right:0" @click="toLink('http://u.boe.com/pc/course/studyindex?id=1029319894711279616')">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="" >
<img class="img2" src="../../assets/images/contributor/course/img2.png" alt="">
<div class="txt3">系统思维-用系统思维分析和解决问题</div>
<div class="txt4">任广顺</div>
</div>
</div>
<div v-show="!online">
<div class="item3" @click="toCourseDetail(16)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/TPM.png" alt="">
<div class="txt3">TPM自主保全</div>
<div class="txt4">罗道源</div>
</div>
<div class="item3" @click="toCourseDetail(1)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/warmanage.png" alt="">
<div class="txt3">战略管理方法</div>
<div class="txt4">刘毅</div>
</div>
<div class="item3" style="margin-right:0" @click="toCourseDetail(9)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/jiazhitanpan.png" alt="">
<div class="txt3">价值谈判技巧</div>
<div class="txt4">张洪岐</div>
</div>
<div class="item3" @click="toCourseDetail(13)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/jijiujishu.png" alt="">
<div class="txt3">急救技术</div>
<div class="txt4">张玉</div>
</div>
<div class="item3" @click="toCourseDetail(2)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/smartService.png" alt="">
<div class="txt3">智慧行政服务与管理体系构建</div>
<div class="txt4">顾新芳</div>
</div>
<div class="item3" style="margin-right:0" @click="toCourseDetail(8)">
<img class="border2" src="../../assets/images/contributor/border1.png" alt="">
<img class="img2" src="../../assets/images/contributor/course/from0to1.png" alt="">
<div class="txt3">从“0”到“1”构建创业型研发团队</div>
<div class="txt4">鄂丽娟</div>
</div>
</div>
</div>
<span id="markPoint4"></span>
<span id="more4" @click="toMore('/contributor/example')" class="more">查看更多>></span>
<div id="example">
<div class="item4" @click="toLink('http://u.boe.com/pc/case/detail?id=1047584195947266048')">
<div class="txt5">战略目标“点线面”式多维度管理</div>
<div><span class="tag">#管理</span><span class="tag">#战略预算</span><span class="tag">#综合管理</span><span class="tag">#战略目标管理</span><span class="tag">#项目管理平台</span><span class="tag">#KPI</span><span class="tag">#无极项目</span></div>
<div class="txt6">战略目标管理与公司价值创造紧密关联，如何将分散在公司的各个内部资源拉通起来，整合统一的管理战略目标，是B4一直努力探索的方向。B4实行的“点线面”式多维度战略目标管理方法，是以项目管理平台作为战略分解的“管理面”，以各部门KPI将关键战略分解点相互串联形成“承接线”，以部门长主责、短期内解决经营痛难点的“无极项目”作为战略落地的“聚力点”。在实施过程中......</div>
<div><span class="name">文斌</span> <span class="org">显示器件及物联网创新业务中台</span></div>
</div>
<div class="item4" @click="toLink('http://u.boe.com/pc/case/detail?id=1032775790846017536')">
<div class="txt5">数字化背景下Panel核心材料运营思路</div>
<div><span class="tag">#CTIO</span><span class="tag">#研发</span><span class="tag">#数字化变革</span><span class="tag">#Panel材料</span><span class="tag">#流程体系</span><span class="tag">#数字化</span></div>
<div class="txt6">Panel作为TFT-LCD显示器件主要组成部件，其核心材料对于器件性能起到决定性的影响。在公司产线分散、产品多样化背景下，应用数字化工具，通过材料标准化流程和体系建设，强化材料平台化、挖潜材料能力、创新材料开发、布局材料资源，提升LCD产品竞争力。</div>
<div><span class="name">占红明</span> <span class="org">显示器件及物联网创新业务中台</span></div>
</div>
<div class="item4" @click="toLink('')">
<div class="txt5">应对组织剧烈异动</div>
<div><span class="tag">#管理</span><span class="tag">#营销</span><span class="tag">#人员异动</span><span class="tag">#客户信任</span><span class="tag">#竞业</span></div>
<div class="txt6">2022年年初，我们组织进行了调整，设立MNT终端产品线，在组织上也做出相应的调整。而主动的调整触发了一系列被动的调整，包括大面积、集中的人员流失；甚至暴露了一系列之前被隐藏的、被刻意而为的问题，例如公司商业信息被盗、合同遭篡改、客户关系被诽谤，等等。面对内外交困，我们冷静对待，积极应对，分清楚事情的紧急程度，寻找问题的关键点，一一化解，最终快速将......</div>
<div><span class="name">武延兵</span> <span class="org">显示器件及物联网创新业务前台</span></div>
</div>
<div class="item4" @click="toLink('http://u.boe.com/pc/case/detail?id=1047584379620032512')">
<div class="txt5">基于疫情封控、管控、封闭、闭环管理模式下的员工舆情管理及对策</div>
<div><span class="tag">#管理</span><span class="tag">#人力资源</span><span class="tag">#综合管理</span><span class="tag">#首都疫情</span><span class="tag">#管控管理</span><span class="tag">#封闭管理</span><span class="tag">#员工舆情管理对策</span></div>
<div class="txt6">自2022年4月下旬以来，首都疫情多点散发、此起彼伏，作为北京市国资委、经开区、北京电控重点企业，北京京东方显示技术有限公司先后于5月3日至9日管控运行，5月15日至6月2日、6月23日至7月1日封闭运行。其他时间要求员工做到“两点一线”、不聚集、不聚会。在管控、封闭管理的情境下，大量掺杂着情感化表达及员工情绪的舆情事件屡屡发生，本案例将结合该情境下发生......</div>
<div><span class="name">贺道品</span> <span class="org">后台(业务支援体系)</span></div>
</div>
</div>
<span id="markPoint5"></span>
<span @click="toMore('/contributor/colleage')" id="more5" class="more">查看更多>></span>
<div id="colleage">
<div class="item2">
<img src="@/assets/images/contributor/portrait/wangmengdi.png" alt="">
<div class="namespace">
<div class="name">王梦迪</div>
<div class="depart">CHRO组织</div>
</div>
</div>
<div class="item2" >
<img src="@/assets/images/contributor/portrait/chenlu.png" alt="">
<div class="namespace">
<div class="name">陈露</div>
<div class="depart">CHRO组织</div>
</div>
</div>
<div class="item2" style="margin-right:0">
<img src="@/assets/images/contributor/portrait/MLEDyangyuying.png" alt="">
<div class="namespace">
<div class="name">杨玉莹</div>
<div class="depart">CHRO组织</div>
</div>
</div>
<div class="item2">
<img src="@/assets/images/contributor/portrait/liujinyu.png" alt="">
<div class="namespace">
<div class="name">刘锦钰</div>
<div class="depart">CHRO组织</div>
</div>
</div>
<div class="item2">
<div class="thumbRing">
<img src="@/assets/images/contributor/portrait/luojiangbo.png" alt="">
</div>
<div class="namespace">
<div class="name">罗江波</div>
<div class="depart">CTIO组织</div>
</div>
</div>
<div class="item2" style="margin-right:0">
<img src="@/assets/images/contributor/portrait/songyuhang.png" alt="">
<div class="namespace">
<div class="name">宋雨航</div>
<div class="depart">CHRO组织</div>
</div>
</div>
</div>
<span id="markPoint6"></span>
<div id="project_">
<div class="item1" @click="toProjectDetail(11)">
<div class="border1">
<img class="img1" src="../../assets/images/contributor/project/img_16.png" alt="">
</div>
<div class="txt1">
项目3月18日正式上线启动，3批上线，已覆盖2396名管理者。其中科级1079人；部级1021人；中心长级296人。根据各业务需求定制14条学习路径。2022年共开设3个面授班，覆盖105名管理者。
</div>
</div>
<div class="item1" @click="toProjectDetail(12)">
<div class="border1">
<img class="img1" src="../../assets/images/contributor/project/img_17.png" alt="">
</div>
<div class="txt1">
项目采用“选-育-用-长”的人才培养模式.首次采用业务部门推荐&学员自荐双渠道推荐模式，共推荐优秀候选人14000+，经过认知/性格/动机的多维测评与严格面试共有91人最终入选。预习阶段精选U选小课堂4大主题课程夯实基础知识，商业案例分析模拟商业市场模拟学员基础。直播阶段10位大咖倾情授课...
</div>
</div>
<div class="item1" style="margin-right:0" @click="toProjectDetail(13)">
<div class="border1">
<img class="img1" src="../../assets/images/contributor/project/img_18.png" alt="">
</div>
<div class="txt1">
面向全集团中心长及以上人群，参考一流商学院培养方案，汇集顶级高校师资，助力学员全面认知升级。框架：定制化的资源组合、线上+线下教学模式相融合、学习+研讨+交流并进。实施进展：有来自显示期间及物联网创新业务、传感业务、MLED业务的119名学员完成培养项目或正在培养中...
</div>
</div>
</div>
<div class="bottomTxt">
<p>2022年知识贡献者大会结出的累累硕果，来自于BOE土壤中深厚底蕴的滋养，来自于各业务组织、各位教师和各位培训工作伙伴的悉心耕耘，更得益于各位专家评委专业、严谨的评审与指导。BOEU将继续发挥专业价值，激活智力资本，强化培训赋能，与全体BOE知识贡献者携手，为BOE人才队伍注入活力！</p>
</div>
</div>
</template>
<script>
// import HTTP from "@/api/http/index";
export default {
data() {
return {
online:true,
isActive:"",
button:true,
controls:false,
autoplay:false,
btnAct:'on'
}
},
methods: {
play(){
this.button = false;
this.controls = true;
this.$refs.videoPlayer.paused === true ? this.$refs.videoPlayer.play():this.$refs.videoPlayer.paused();
},
toMore(route){
this.$router.push(route);
},
toLink(link){
if(link == ''){
this.$message('该案例为保密案例，暂不允许观看')
}else{
window.location = link;
}
},
showOnlineCourse(){
this.btnAct = 'on';
this.online = true;
},
showOfflineCourse(){
this.btnAct = 'off';
this.online = false
},
toCourseDetail(id){
this.$router.push({
name:'contributorCourseDetail',
params:{id:id}
})
},
toProjectDetail(id){
this.$router.push({
name:'projectDetail',
params:{id:id}
})
},
scrollTo(params){
this.isActive = params;
document.getElementById(params).scrollIntoView();
}
},
async created() {
// let res = await HTTP.getBaseInfo();
// console.log("res===", res);
// if (res && res.code == "0") {
// console.log(res);
// }
}
}
</script>
<style lang='scss'>
@media screen and (min-width: 1440px) and (max-width: 1600px){
body{
zoom: 79%;
}
#bg{
width: 1900px !important;
}
}
@media screen and (min-width: 1366px) and (max-width: 1440px){
body{
zoom: 74%;
}
#bg{
width: 1869px !important;
}
}
@media screen and (min-width: 1280px) and (max-width: 1366px){
body{
zoom: 72%;
}
#bg{
width: 1874px !important;
}
}
@media screen and (max-width: 1280px){
body{
zoom: 67%;
}
#bg{
width: 1885px !important;
}
}
</style>
<style scoped>
#bg{
position: relative;
width: 1903px;
height: 9690px;
background-image: url(../../assets/images/contributor/index_bg_v3.png);
background-repeat: no-repeat;
background-color: #001227;
}
#navi{
position: fixed;
left: 25px;
top: 250px;
}
video{
object-fit: contain;
width: 100%;
height: 100%;
}
#videoBox{
width: 1000px;
height: 478px;
position: relative;
top: 661px;
left: 461px;
}
#video_button{
position: absolute;
top: 194px;
left: 441.5px;
cursor: pointer;
z-index: 1;
}
#project{
width: 1420px;
position: relative;
top: 1052px;
left: 253px;
}
.item1{
padding: 30px;
background-color: #010000;
height: 503px;
width: 429px;
box-sizing: border-box;
border: 1px solid #FEECBC;
border-radius: 10px;
display: inline-block;
vertical-align: middle;
margin: 0px 64px 84px 0px;
cursor: pointer;
}
.txt1{
width: 360px;
height: 175px;
box-sizing: border-box;
font-family: "ArialMT", "Arial", sans-serif;
color: #A49473;
text-align: left;
line-height: 25px;
letter-spacing: 1px;
}
.border1{
background-image: url(../../assets/images/contributor/border1.png);
background-position: -44px -31px;
height: 237px;
width: 379px;
}
.border2{
position: relative;
top: -43px;
left: -45px;
}
.img1{
transform: translate(22px,26px);
cursor: pointer;
}
.img2{
position: relative;
top: -289px;
left: 20px;
}
#teacher{
width: 1420px;
position: relative;
top: 1307px;
left: 253px;
}
.item2{
background-image: url(../../assets/images/contributor/card_bg.png);
height: 339px;
width: 428px;
box-sizing: border-box;
margin: 0 64px 70px 0;
padding: 40px 34px 45px 47px;
display: inline-block;
vertical-align: middle;
}
.item2 .cardTopPart{
height: 165px;
}
.item2 img{
display: inline-block;
}
.name{
text-align: center;
color:#FFD89F;
font-size: 24px;
margin-bottom: 20px;
}
.depart{
color: #FFD89F;
text-align: center;
font-size: 18px;
}
.txt2{
color: #FFD89F;
text-align: center;
font-size: 18px;
}
.namespace{
margin: -135px 0 60px 170px;
}
#course{
width: 1420px;
position: relative;
top: 1646px;
left: 253px;
}
#button{
width: 1000px;
position: relative;
top: -145px;
left: 349px;
}
.item3{
padding: 24px;
background-color: #010000;
height: 456px;
width: 429px;
box-sizing: border-box;
border: 1px solid #FEECBC;
border-radius: 10px;
display: inline-block;
vertical-align: middle;
margin: 0px 64px 84px 0px;
cursor: pointer;
}
.txt3{
margin-top: -218px;
color: #FFD89F;
font-size: 22px;
margin-bottom: 38px;
}
.txt4{
color: #FFD89F;
font-size: 17px;
}
.activeBtn{
background-color: #FFEBCF;
color: #4E4E4D;
}
button{
border: #FEECBC solid 1px;
margin: 0 276px 0 0;
border-radius: 10px;
width: 220px;
height: 56px;
font-size: 28px;
background-color: #7C7870;
color: #F1C588;
cursor: pointer;
}
#example{
position: relative;
top: 1920px;
left: 253px;
width: 1420px;
}
.item4{
padding: 38px 116px 30px 125px;
border: 1px solid #FEECBC;
border-radius: 10px;
box-sizing: border-box;
width: 1420px;
background-color: #081017;
margin: 0 0 50px 0;
cursor: pointer;
}
.tag{
display: inline-block;
height: 34px;
padding: 0 15px 0 15px;
border: #FEECBC solid 1px;
border-radius: 10px;
background-color: #FBD09F;
line-height: 34px;
font-size: 16px;
text-align: center;
color: #363636;
margin: 0 26px 0 0;
}
.txt5{
color: #FFD89F;
font-size: 28px;
margin-bottom: 20px;
}
.txt6{
font-size: 20px;
color:#81807B;
margin: 11px 0 20px 0;
line-height: 37px;
}
#colleage{
width: 1420px;
position: relative;
top: 2354px;
left: 253px;
}
#project_{
width: 1420px;
position: relative;
top: 2791px;
left: 253px;
}
.more{
width: 120px;
height: 24px;
box-sizing: border-box;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
color: #FEECBC;
text-align: right;
line-height: normal;
font-size: 21px;
margin-left: 721px;
margin-top: 10px;
margin-bottom: 9px;
cursor: pointer;
}
#more1{
position: absolute;
top: 1320px;
left: 820px;
}
#more2{
position: absolute;
top: 2754px;
left: 820px;
}
#more3{
position: absolute;
top: 3840px;
left: 820px;
}
#more4{
position: absolute;
top: 5315px;
left: 820px;
}
#more5{
position: absolute;
top: 7185px;
left: 820px;
}
#markPoint1{
position: absolute;
top: 1310px;
left: 820px;
}
#markPoint2{
position: absolute;
top: 2754px;
left: 820px;
}
#markPoint3{
position: absolute;
top: 3840px;
left: 820px;
}
#markPoint4{
position: absolute;
top: 5315px;
left: 820px;
}
#markPoint5{
position: absolute;
top: 7185px;
left: 820px;
}
#markPoint6{
position: absolute;
top: 8185px;
left: 820px;
}
.bottomTxt{
width: 920px;
background-color: #001227;
text-align: left;
position: absolute;
color: #F4D2A0;
font-size: 20px;
line-height: 36px;
top: 9369px;
left: 509px;
}
li{
margin: 33px 0 0 16px;
font-size: 16px;
text-align: center;
line-height: 39px;
color: #8A8A8A;
list-style: none;
border: solid 1px #6D6D6D;
border-radius: 5px;
width: 134px;
box-sizing: border-box;
height: 39px;
cursor: pointer;
}
li::before{
content: "";
width: 10px;
height: 10px;
position: absolute;
left: -5px;
background-color: #6D6D6D;
display: inline-block;
border-radius: 5px;
transform: translateY(15px);
}
.active{
border-color: #F0D9BC;
color: #F4D3A2;
}
.stick1{
position: absolute;
top: 14px;
left: -21px;
margin-right: 16px;
}
.stick2{
position: absolute;
top: 98px;
left: -0.5px;
}
#colleage .item2{
background-image: url(../../assets/images/contributor/card-bg-small.png);
height: 238px;
width: 428px;
}
.item4 .name{
font-size: 16px;
font-weight: 600;
color: #FFD89F;
}
.item4 .org{
font-size: 16px;
color: #FFD89F;
}
</style>