<template>
  <div class="scientific_research_trends">
    <!--title-->
    <el-row>
      <el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
        <div class="grid-content"></div>
      </el-col>
      <el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
        <div class="title">
          <!--          {{ $t('message.news_center') }}-->
          科学研究
        </div>
        <el-row>
          <el-col :span="8">
            <el-divider></el-divider>
          </el-col>
          <el-col :span="8">
            <div class="divider_text">Scientific research trends</div>
          </el-col>
          <el-col :span="8">
            <el-divider></el-divider>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
    <!--科学研究新闻内容-->
    <el-row>
      <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">
        <div class="grid-content"></div>
      </el-col>
      <el-col class="scientific_context" :xs="22" :sm="20" :md="20" :lg="16" :xl="16">
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">科研院关于组织申报国家重点研发计划</el-col>
              <el-col :span="4">
                <div class="time">2021.10.10</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh2.png" alt="">
              </el-col>
              <el-col :span="16" class="text">科技部关于发布国家重点研发计划“科</el-col>
              <el-col :span="4">
                <div class="time">2021.10.22</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh3.png" alt="">
              </el-col>
              <el-col :span="16" class="text">关于征集适宜向“一带一路”国家转移的…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.21</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh4.png" alt="">
              </el-col>
              <el-col :span="16" class="text">西南交通大学关于2021年度国家自然</el-col>
              <el-col :span="4">
                <div class="time">2021.10.07</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh5.png" alt="">
              </el-col>
              <el-col :span="16" class="text">关于召开2021年度国家自然科学基金项…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.11</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh6.png" alt="">
              </el-col>
              <el-col :span="16" class="text">关于2021年度四川省科技奖励提名工作…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.30</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh7.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh8.png" alt="">
              </el-col>
              <el-col :span="16" class="text">国家自然科学基金委员会中德科学中心…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.26</div>
              </el-col>
            </el-row>
            <div class="scientific_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh9.png" alt="">
              </el-col>
              <el-col :span="16" class="text">关于征集适宜向“一带一路”国家转移的…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.23</div>
              </el-col>
            </el-row>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="scientific_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh10.png"
                                                 alt=""></el-col>
              <el-col :span="16" class="text">科研院关于组织申报国家重点研发计划</el-col>
              <el-col :span="4">
                <div class="time">2021.08.06</div>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
      </el-col>
    </el-row>

    <!--更多-->
    <el-row>
      <el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
        <div class="grid-content"></div>
      </el-col>
      <el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
        <div style="background: #FFFFFF;color: #1956BC;" class="more">
          {{ $t('message.more') }}
        </div>
        <el-row>
          <el-col :span="9">
            <el-divider></el-divider>
          </el-col>
          <el-col :span="6">
            <div class="divider_text">学术交流</div>
          </el-col>
          <el-col :span="9">
            <el-divider></el-divider>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
    <!--学术交流-->
    <el-row>
      <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">
        <div class="grid-content"></div>
      </el-col>
      <el-col class="academia_context" :xs="22" :sm="20" :md="20" :lg="16" :xl="16">
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <div class="academia_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <div class="academia_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <div class="academia_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <div class="academia_context_divider">
              <hr style="border: 0.1rem solid #E6E6E6;">
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
            <!--            <div class="scientific_context_divider">-->
            <!--              <hr style="border: 0.1rem solid #E6E6E6;">-->
            <!--            </div>-->
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <el-row class="academia_context_text">
              <el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
              </el-col>
              <el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
              <el-col :span="4">
                <div class="time">2021.10.01</div>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
    <!--更多-->

    <!--更多-->
    <el-row>
      <el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
        <div class="grid-content"></div>
      </el-col>
      <el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
        <div style="background: #FFFFFF;color: #1956BC;"  class="more">
          {{ $t('message.more') }}
        </div>
        <div class="more_img">
          <img src="@/assets/index/scientific_research_trends/sy_icon_zhdb.png" alt="">
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "scientific_research_trends"
}
</script>

<style scoped lang="scss">
@import '../css/comment.css';

.scientific_research_trends {
  background-image: url("../../../assets/index/scientific_research_trends/sy_bj2.png");
  padding-top: 4rem;
}

.headline {
  .title {
    background: #FFFFFF;
    color: #1956BC;
  }

  .divider_text {
    font-size: 2rem;
    font-weight: 500;
    color: #FFFFFF;
  }

}

.scientific_context {
  background: rgba(255, 255, 255, 0.9);
  border-radius: 2.4rem;
  padding: 2rem 0;

  .scientific_context_text {
    margin-top: 2rem;
    color: #1956BC;
    padding-left: 4rem;

    .img {
      width: 8.33333%;
    }

    .text {
      margin-left: 1rem;
      font-size: 1.8rem;
      font-weight: 500;
    }

    .time {
      text-align: center;
      font-size: 1.2rem;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      width: 7.2rem;
      height: 2.2rem;
      line-height: 2.2rem;
      border-radius: 1.1rem;
      border: 0.1rem solid #1956BC;
      margin-left: 3rem;
    }
  }

  .scientific_context_divider {
    padding-left: 4rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
}

.academia_context {
  background: rgba(255, 255, 255, 0.9);
  padding: 2rem 0;

  .academia_context_divider {
    padding-left: 4rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
  }

  .academia_context_text {
    margin-top: 2rem;
    color: #1956BC;
    padding-left: 4rem;


    .img {
      width: 8.33333%;
    }

    .text {
      margin-left: 1rem;
      font-size: 1.8rem;
      font-weight: 500;
    }

    .time {
      font-size: 1.2rem;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #1956BC;
      line-height: 2.4rem;
    }
  }
}

</style>
