|
|
|
|
@ -1,46 +1,138 @@ |
|
|
|
|
<template> |
|
|
|
|
<div class="container-1420" v-if="isLoading"> |
|
|
|
|
<div class="container"> |
|
|
|
|
<div class="banner"> |
|
|
|
|
<div class="title">{{ reacProjectList[0].compName }}火热报名中</div> |
|
|
|
|
<div class="description"> |
|
|
|
|
<div v-html="reacProjectList[0].compInfo"></div> |
|
|
|
|
<div class="banner-left"> |
|
|
|
|
<div style="font-size: 20px;color:#56A80B;">参赛对象：全省中小学生（含中职、高职）</div> |
|
|
|
|
<div style="font-size: 58px;margin-top: 30px;">在读书中享受乐趣、感悟人生、获得成长</div> |
|
|
|
|
<div class="application" @click="toDetail(reacProjectList[0].id)"> |
|
|
|
|
立即报名 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="banner-right" /> |
|
|
|
|
</div> |
|
|
|
|
<div class="banner-bottom"> |
|
|
|
|
<div class="one"><img src="../../assets/images/bg3.png" style="width: 84px;"> |
|
|
|
|
<div style="margin-left: 20px;"> |
|
|
|
|
<div class="top">300</div> |
|
|
|
|
<div class="bottom">参与学校</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div |
|
|
|
|
class="application gradient" |
|
|
|
|
@click="toDetail(reacProjectList[0].id)" |
|
|
|
|
> |
|
|
|
|
立即报名 |
|
|
|
|
<div class="two"><img src="../../assets/images/bg4.png" style="width: 84px;"> |
|
|
|
|
<div style="margin-left: 20px;"> |
|
|
|
|
<div class="top">20,000+</div> |
|
|
|
|
<div class="bottom">报名人数</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="three"><img src="../../assets/images/bg5.png" style="width: 84px;"> |
|
|
|
|
<div style="margin-left: 20px;"> |
|
|
|
|
<div class="top">10,000+</div> |
|
|
|
|
<div class="bottom">提交作品</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="four"><img src="../../assets/images/bg6.png" style="width: 84px;"> |
|
|
|
|
<div style="margin-left: 20px;"> |
|
|
|
|
<div class="top">1,00,000+</div> |
|
|
|
|
<div class="bottom">浏览人数</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 赛事流程 --> |
|
|
|
|
<div class="process"> |
|
|
|
|
<div class="process-1">EVENT SCHEDULE</div> |
|
|
|
|
<div class="process-2">赛事流程</div> |
|
|
|
|
<div class="process-3">大赛以线上线下相结合的形式展开，分为初赛（市级赛）、复赛（省级赛）和总决赛</div> |
|
|
|
|
<div class="process-bottom"> |
|
|
|
|
<div class="bottom-1"><img src="../../assets/images/bg7.png" style="width: 100px;padding: 0px,71px,25px;"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-top">启动仪式</div> |
|
|
|
|
<div class="text-bottom">2025年3月29日</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="bottom-2"><img src="../../assets/images/bg8.png" |
|
|
|
|
style="width: 40px;padding-top: 25px; padding-bottom: 31px;"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-top">初赛</div> |
|
|
|
|
<div class="text-bottom">2025年4月1日-2025年5月31日</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="bottom-3"><img src="../../assets/images/bg8.png" |
|
|
|
|
style="width: 40px;padding-top: 25px; padding-bottom: 31px;"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-top">复赛</div> |
|
|
|
|
<div class="text-bottom">2025年6月1日-6月20日</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="bottom-4"><img src="../../assets/images/bg8.png" |
|
|
|
|
style="width: 40px;padding-top: 25px; padding-bottom: 31px;"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-top">总决赛暨颁奖典礼</div> |
|
|
|
|
<div class="text-bottom">2025年8月（地点另行通知）</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 赛事内容 --> |
|
|
|
|
<div class="content"> |
|
|
|
|
<div class="content-1">EVENT CONTENT</div> |
|
|
|
|
<div class="content-2">赛事内容</div> |
|
|
|
|
<div class="content-3">大赛共设四个竞赛单元，原则上每竞赛单元每人限提交一件作品，可以兼报多个单元</div> |
|
|
|
|
<div class="content-bottom"> |
|
|
|
|
<div class="info"><img src="../../assets/images/bg9.png" class="cover"> |
|
|
|
|
<div class="info-text">好书推荐分享<br><img src="../../assets/images/bg18.png"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="info"><img src="../../assets/images/bg10.png" class="cover"> |
|
|
|
|
<div class="info-text">写作征文大赛<br><img src="../../assets/images/bg18.png"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="info"><img src="../../assets/images/bg11.png" class="cover"> |
|
|
|
|
<div class="info-text">中华经典朗诵大赛<br><img src="../../assets/images/bg18.png"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="info"><img src="../../assets/images/bg12.png" class="cover"> |
|
|
|
|
<div class="info-text">阅读主题绘画活动<br><img src="../../assets/images/bg18.png"></div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 赛事资讯 --> |
|
|
|
|
<div class="new"> |
|
|
|
|
<div class="new-1">EVENT NEWS</div> |
|
|
|
|
<div class="new-2">赛事资讯</div> |
|
|
|
|
<div class="new-3">比赛相关实时新闻资讯一览</div> |
|
|
|
|
<div class="new-list"> |
|
|
|
|
<div class="new-title"><img src="../../assets/images/bg14.png" class="new-icon">大赛公告 |
|
|
|
|
<img src="../../assets/images/bg18.png"></div> |
|
|
|
|
<div class="new-title"><img src="../../assets/images/bg17.png" class="new-icon">大赛指导 |
|
|
|
|
<img src="../../assets/images/bg13.png"></div> |
|
|
|
|
<div class="new-title"><img src="../../assets/images/bg15.png" class="new-icon">大赛风采 |
|
|
|
|
<img src="../../assets/images/bg13.png"></div> |
|
|
|
|
<div class="new-title"><img src="../../assets/images/bg16.png" class="new-icon">更多 |
|
|
|
|
<img src="../../assets/images/bg13.png"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="new-info"> |
|
|
|
|
<div class="date">2025年8月<img src="../../assets/images/bg19.png"></div> |
|
|
|
|
<div class="title">阅读主题绘画活动</div> |
|
|
|
|
<div class="detail">你覅欧安会安徽建瓯市发哈和贫穷服务哈珀微服务波i文化法国被列为客户让我【齐奥佩你跑了后宫妃嫔维权案和评价为哦评估和片</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 比赛列表 --> |
|
|
|
|
|
|
|
|
|
<!-- 新闻列表 --> |
|
|
|
|
<div class="news-list"> |
|
|
|
|
<!-- <div class="news-list"> |
|
|
|
|
<div class="news-title"> |
|
|
|
|
<div class="top"> |
|
|
|
|
<div>新闻资讯</div> |
|
|
|
|
<div @click="router.push('/news')"> |
|
|
|
|
<el-icon><ArrowRightBold /></el-icon> |
|
|
|
|
<el-icon> |
|
|
|
|
<ArrowRightBold /> |
|
|
|
|
</el-icon> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> --> |
|
|
|
|
<!-- <div class="bottom">30+项目登陆后报名</div> --> |
|
|
|
|
</div> |
|
|
|
|
<!-- </div> |
|
|
|
|
<div class="newa-panel"> |
|
|
|
|
<div class="tab"> |
|
|
|
|
<div |
|
|
|
|
:class="active === index ? 'item active gradient' : 'item'" |
|
|
|
|
v-for="(item, index) in newList" |
|
|
|
|
:key="index" |
|
|
|
|
@click="toggleTab(item, index)" |
|
|
|
|
> |
|
|
|
|
<div :class="active === index ? 'item active gradient' : 'item'" v-for="(item, index) in newList" :key="index" |
|
|
|
|
@click="toggleTab(item, index)"> |
|
|
|
|
{{ item.name }} |
|
|
|
|
</div> |
|
|
|
|
<div |
|
|
|
|
class="item" |
|
|
|
|
|
|
|
|
|
@click="router.push('/news')" |
|
|
|
|
> |
|
|
|
|
更多 |
|
|
|
|
<div class="item" @click="router.push('/news')"> |
|
|
|
|
更多 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="newa-main"> |
|
|
|
|
@ -49,27 +141,27 @@ |
|
|
|
|
</div> |
|
|
|
|
<div class="right"> |
|
|
|
|
<div class="title">{{ newInfo.name }}</div> |
|
|
|
|
<div class="description"> |
|
|
|
|
<div class="description"> --> |
|
|
|
|
<!-- 我是新闻描述,我是新闻描述,我是新闻描述 --> |
|
|
|
|
</div> |
|
|
|
|
<!-- </div> |
|
|
|
|
<div class="newa-main-list"> |
|
|
|
|
<ul> |
|
|
|
|
<li v-for="item in childrenNewList" :key="item.id" @click="toNewsDetail(item.id)"> |
|
|
|
|
<div class="info"> |
|
|
|
|
{{ item.title }} |
|
|
|
|
</div> |
|
|
|
|
<div class="time">{{ item.createTime }}</div> |
|
|
|
|
|
|
|
|
|
<div class="time">{{ item.createTime }}</div> --> |
|
|
|
|
|
|
|
|
|
<!-- <div class="name"> |
|
|
|
|
{{ item.createBy_dictText }} |
|
|
|
|
</div> --> |
|
|
|
|
</li> |
|
|
|
|
<!-- </li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> --> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
@ -145,7 +237,7 @@ const childrenNewList = ref<any>([]) |
|
|
|
|
const getNewInfo = async (id: any) => { |
|
|
|
|
const res: any = await queryEssayListApi(id) |
|
|
|
|
childrenNewList.value = res.result.records |
|
|
|
|
// console.log(childrenNewList, 'childrenNewList') |
|
|
|
|
console.log(childrenNewList, 'childrenNewList') |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 切换tab |
|
|
|
|
@ -164,120 +256,334 @@ export default { |
|
|
|
|
.banner { |
|
|
|
|
position: relative; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 692px; |
|
|
|
|
// background: radial-gradient( |
|
|
|
|
// circle, |
|
|
|
|
// rgba(131, 255, 197, 1) 0%, |
|
|
|
|
// rgba(255, 255, 255, 1) 50% |
|
|
|
|
// ); |
|
|
|
|
height: 930px; |
|
|
|
|
background: url('../../assets/images/banner1.png') no-repeat; |
|
|
|
|
background-size: cover; |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
justify-content: center; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
.title { |
|
|
|
|
font-size: 50px; |
|
|
|
|
font-weight: 600; |
|
|
|
|
color: #333333; |
|
|
|
|
|
|
|
|
|
.banner-left { |
|
|
|
|
width: 573px; |
|
|
|
|
height: 384px; |
|
|
|
|
padding-right: auto; |
|
|
|
|
padding-left: auto; |
|
|
|
|
|
|
|
|
|
.application { |
|
|
|
|
width: 300px; |
|
|
|
|
height: 60px; |
|
|
|
|
margin-left: 60px; |
|
|
|
|
text-align: center; |
|
|
|
|
line-height: 60px; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #fff; |
|
|
|
|
cursor: pointer; |
|
|
|
|
margin-top: 100px; |
|
|
|
|
// background-color: #61B327; |
|
|
|
|
background-image: linear-gradient(to right, #9AD34A, #61B327); |
|
|
|
|
border-radius: 30px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.banner-right{ |
|
|
|
|
width: 670px; |
|
|
|
|
height: 545px; |
|
|
|
|
background: url('../../assets/images/banner2.png') no-repeat; |
|
|
|
|
background-size: cover; |
|
|
|
|
padding-right: auto; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
.banner-bottom{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: 184px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-evenly; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.one,.two,.three,.four{ |
|
|
|
|
width: 188px; |
|
|
|
|
height: 84px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.top{ |
|
|
|
|
flex-direction: column; |
|
|
|
|
width: 62px; |
|
|
|
|
height: 40px; |
|
|
|
|
font-family: Public Sans, Public Sans; |
|
|
|
|
font-weight: 600; |
|
|
|
|
font-size: 32px; |
|
|
|
|
color: #1B1D1F; |
|
|
|
|
line-height: 40px; |
|
|
|
|
text-align: left; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
.bottom{ |
|
|
|
|
width: 80px; |
|
|
|
|
height: 28px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #A2BDAA; |
|
|
|
|
line-height: 28px; |
|
|
|
|
text-align: left; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.one{ |
|
|
|
|
margin-left: 270px; |
|
|
|
|
} |
|
|
|
|
.four{ |
|
|
|
|
margin-right: 270px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.description { |
|
|
|
|
width: 1074px; |
|
|
|
|
|
|
|
|
|
.process{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: 676px; |
|
|
|
|
background: #F6FBF9; |
|
|
|
|
padding-top: 132px; |
|
|
|
|
// padding-bottom: 134px; |
|
|
|
|
|
|
|
|
|
.process-1{ |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
width:100%; |
|
|
|
|
height: 24px; |
|
|
|
|
font-family: Montserrat, Montserrat; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #56A80B; |
|
|
|
|
line-height: 24px; |
|
|
|
|
text-align: center; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #666; |
|
|
|
|
margin-top: 37px; |
|
|
|
|
line-height: 32px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
display: -webkit-box; |
|
|
|
|
-webkit-line-clamp: 2; |
|
|
|
|
-webkit-box-orient: vertical; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
.application { |
|
|
|
|
width: 272px; |
|
|
|
|
height: 64px; |
|
|
|
|
.process-2{ |
|
|
|
|
width:100%; |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 46px; |
|
|
|
|
color: #252B42; |
|
|
|
|
line-height: 50px; |
|
|
|
|
text-align: center; |
|
|
|
|
line-height: 64px; |
|
|
|
|
border-radius: 10px; |
|
|
|
|
font-size: 24px; |
|
|
|
|
color: #fff; |
|
|
|
|
cursor: pointer; |
|
|
|
|
margin-top: 50px; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
.nav-title { |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 0; |
|
|
|
|
color: #1e2033; |
|
|
|
|
.top { |
|
|
|
|
font-size: 40px; |
|
|
|
|
font-weight: 600; |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
.bottom { |
|
|
|
|
font-size: 16px; |
|
|
|
|
text-align: center; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
.process-3{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: 20px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #737373; |
|
|
|
|
line-height: 20px; |
|
|
|
|
text-align: center; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
.process-bottom{ |
|
|
|
|
padding-top: 110px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
gap: 130px; |
|
|
|
|
.bottom-1,.bottom-2,.bottom-3,.bottom-4{ |
|
|
|
|
flex-direction: column; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.text-top{ |
|
|
|
|
flex-direction: column; |
|
|
|
|
height: 48px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 24px; |
|
|
|
|
color: #252B42; |
|
|
|
|
text-align: center; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
.text-bottom{ |
|
|
|
|
font-family: Microsoft YaHei-Regular; |
|
|
|
|
font-weight: Regular; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #252B42; |
|
|
|
|
text-align: center; |
|
|
|
|
font-style: normal; |
|
|
|
|
text-transform: none; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.race-list { |
|
|
|
|
position: relative; |
|
|
|
|
width: 100%; |
|
|
|
|
display: grid; |
|
|
|
|
grid-template-columns: repeat(4, 1fr); |
|
|
|
|
grid-template-rows: repeat(2, 1fr); |
|
|
|
|
// gap: 10px; |
|
|
|
|
margin-top: 40px; |
|
|
|
|
.item { |
|
|
|
|
width: 340px; |
|
|
|
|
height: 360px; |
|
|
|
|
// background-color: pink; |
|
|
|
|
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.06); |
|
|
|
|
cursor: pointer; |
|
|
|
|
border-radius: 10px; |
|
|
|
|
transition: all 0.2s; |
|
|
|
|
.image { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 194px; |
|
|
|
|
img { |
|
|
|
|
.content{ |
|
|
|
|
height: 676px; |
|
|
|
|
padding-top: 132px; |
|
|
|
|
padding-left: 350px; |
|
|
|
|
.content-1{ |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #56A80B; |
|
|
|
|
line-height: 24px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.content-2{ |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 46px; |
|
|
|
|
color: #252B42; |
|
|
|
|
line-height: 50px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.content-3{ |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #737373; |
|
|
|
|
line-height: 20px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.content-bottom{ |
|
|
|
|
padding-top: 80px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: left; |
|
|
|
|
align-items: center; |
|
|
|
|
gap: 50px; |
|
|
|
|
.info{ |
|
|
|
|
flex-direction: column; |
|
|
|
|
width: 280px; |
|
|
|
|
height: 325px; |
|
|
|
|
border-radius: 22px; |
|
|
|
|
background-color: #f7f6f6; |
|
|
|
|
|
|
|
|
|
.cover{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.reac-info { |
|
|
|
|
padding: 0 8px; |
|
|
|
|
.reac-title { |
|
|
|
|
margin-top: 19px; |
|
|
|
|
color: #c9c9c9; |
|
|
|
|
font-size: 12px; |
|
|
|
|
// height: 186px; |
|
|
|
|
} |
|
|
|
|
.reac-project { |
|
|
|
|
font-size: 16px; |
|
|
|
|
font-weight: 600; |
|
|
|
|
color: #333333; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
.info-text{ |
|
|
|
|
// flex-direction: column; |
|
|
|
|
padding-top: 25px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 22px; |
|
|
|
|
color: #1B1D1F; |
|
|
|
|
line-height: 29px; |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
.time { |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #8c8b8b; |
|
|
|
|
margin-top: 40px; |
|
|
|
|
img{ |
|
|
|
|
width: 50px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.item:hover { |
|
|
|
|
transform: translateY(-5px); |
|
|
|
|
} |
|
|
|
|
.new{ |
|
|
|
|
// height: 1090px; |
|
|
|
|
padding-bottom: 80px; |
|
|
|
|
padding-top: 132px; |
|
|
|
|
padding-left: 350px; |
|
|
|
|
background-color: #d9d9d927 ; |
|
|
|
|
.new-1{ |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #56A80B; |
|
|
|
|
line-height: 24px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.item:nth-child(n) { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
.new-2{ |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 46px; |
|
|
|
|
color: #252B42; |
|
|
|
|
line-height: 50px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.more { |
|
|
|
|
position: absolute; |
|
|
|
|
right: 20px; |
|
|
|
|
top: -20px; |
|
|
|
|
color: #0bd7c6; |
|
|
|
|
cursor: pointer; |
|
|
|
|
.new-3{ |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #737373; |
|
|
|
|
line-height: 20px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.new-list{ |
|
|
|
|
padding-top: 80px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: left; |
|
|
|
|
align-items: center; |
|
|
|
|
gap: 50px; |
|
|
|
|
|
|
|
|
|
.new-title{ |
|
|
|
|
width: 310px; |
|
|
|
|
height: 74px; |
|
|
|
|
border-radius: 22px; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
padding: 15px; |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #000000; |
|
|
|
|
line-height: 28px; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
gap: 20px; |
|
|
|
|
.new-icon{ |
|
|
|
|
width: 38px; |
|
|
|
|
} |
|
|
|
|
img{ |
|
|
|
|
width: 50px; |
|
|
|
|
margin-left: 30px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.new-info{ |
|
|
|
|
margin-top: 80px; |
|
|
|
|
padding: 32px; |
|
|
|
|
width: 580px; |
|
|
|
|
height: 260px; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
justify-content: center; |
|
|
|
|
border-radius: 22px; |
|
|
|
|
|
|
|
|
|
.date{ |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 24px; |
|
|
|
|
color: #333333; |
|
|
|
|
line-height: 32px; |
|
|
|
|
text-align: left; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
gap: 350px; |
|
|
|
|
// padding-right: 50px; |
|
|
|
|
img{ |
|
|
|
|
text-align:right; |
|
|
|
|
width: 40px; |
|
|
|
|
height: 29px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.title{ |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 22px; |
|
|
|
|
color: #333333; |
|
|
|
|
line-height: 47px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
.detail{ |
|
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 16px; |
|
|
|
|
color: #292D33; |
|
|
|
|
line-height: 30px; |
|
|
|
|
text-align: left; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.news-list { |
|
|
|
|
|
