* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "icofont","Microsoft YaHei";
  }

body {
  background: #fff;}

.container {
  width: 1200px;
  margin: 30px auto;
  padding: 0 20px;
  }
.container_bg{
  
width: 100%;
  
background: url(../img/container_bg.png) no-repeat;
  
background-size: 100% 100%;
}
/* Ã¤Â¸Â»Ã¥Ë†â€ Ã¦Â ÂÃ¥Â¸Æ’Ã¥Â±â‚¬ */
.main-layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;}

/* Ã¥Â·Â¦Ã¤Â¾Â§Ã¥Ë†â€ Ã¦Â Â */
.left-column {
  display: flex;
  flex-direction: column;}

/* Ã¦Â â€¡Ã©Â¢ËœÃ¥Å’ÂºÃ¥Å¸Å¸ */
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;}

.section-title {
  font-size: 24px;
  color: #333;
  font-weight: 600;
  }

.more-link {
  font-size: 14px;
  color: #1765d0;
  text-decoration: none;}

/* Ã¥Â·Â¦Ã¤Â¾Â§Ã¤Â¸Â»Ã¥ÂÂ¡Ã§â€°â€¡ */
.featured-card {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  margin-bottom: 30px;
height:700px;}



.card-content {
  padding: 20px;}

.news-tag {
  display: inline-block;
  font-size: 12px;
  color: #1765d0;
  background: rgba(23,101,208,0.1);
  padding: 3px 8px;
  border-radius: 4px;
  margin-bottom: 10px;}

.news-date {
  font-size: 12px;
  color: #999;
  margin-bottom: 8px;}

.news-title {
  font-size: 18px;
  color: #333;
  margin-bottom: 12px;
  line-height: 1.4;}

.news-excerpt {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  margin-bottom: 15px;}

.read-more {
  font-size: 14px;
  color: #1765d0;
  text-decoration: none;
  display: inline-flex;
  align-items: center;}



/* Ã¥ÂÂ³Ã¤Â¾Â§Ã¥Ë†â€ Ã¦Â Â */
.right-column {
  display: flex;
  flex-direction: column;}

/* Ã¥Â¯Â¼Ã¨Ë†ÂªÃ¦Â â€¡Ã§Â­Â¾ */
.nav-tabs {
  display: flex;
  margin-bottom: 20px;
  justify-content: right;}

.nav-tab {
  font-size: 13px;
  color: #2a2a2a;
  padding: 8px 10px;
  margin-left: 20px;
  cursor: pointer;
  position: relative;
  background-color: #e1e1e1;
  border-radius: 5px;}

.nav-tab.on {
  background-color: #1765d0;
  color: #ffffff;
  font-weight: 500;}

/* Ã¦â€“Â°Ã©â€”Â»Ã¥ÂÂ¡Ã§â€°â€¡ */
.news-card {
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 28px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  border: 1px solid #f0f0f0;
  }
.news-card:hover .news-title{
  font-weight:bold;
}

.nav_tnr_tb .news-card:hover{transform:translateY(-4px);}
.nav_tnr_tb .news-card{
  transition:all .3s;
}
.news-card .news-date {
  margin-bottom: 10px;
  font-weight: bold;
  }

.news-card .news-title {
  font-size: 16px;
  margin-bottom: 10px;}

.news-card .news-excerpt {
  font-size: 14px;
  margin-bottom: 12px;
  height: 41px;
  }

.view-details {
  font-size: 13px;
  color: #1765d0;
  text-decoration: none;}
.featured-card .jdyw_con img{
  transition:all .5s;
}
.featured-card:hover .jdyw_con img{
  transform:scale(1.1);
}

/* Ã¥Â­Â¦Ã¦Å“Â¯Ã¥â€°ÂÃ¦Â²Â¿Ã©Æ’Â¨Ã¥Ë†â€ Ã¦Â Â·Ã¥Â¼Â */
.frontier-container {
  max-width: 1200px;
  margin: 60px 100px;
  padding: 0 30px;
  position: relative;
  margin: 60px auto;
  }

.frontier-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 40px;}

.frontier-main-title {
  font-size: 24px;
  color: #2a2f35;
  position: relative;
  }

.frontier-background-text {
  position: absolute;
  left: -12px;
  top: -35px;
  font-size: 72px;
  color: rgba(42,47,53,0.08);
  font-weight: 900;
  letter-spacing: 2px;
  z-index: -1;}

.frontier-more-link {
  color: #3d7af0;
  font-size: 16px;
  text-decoration: none;
  position: relative;
  padding-right: 20px;}

.frontier-more-link::after {
  content: ">";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);}

.frontier-cards {
  display: flex;
  gap: 30px;}

.frontier-card {
  flex: 1;
  border-radius: 12px;
  min-height: 560px;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease;
  background-size: cover;
  background-color:pink;}
.frontier-card img{
    width: 100%;
}
.frontier-card:hover {
  transform: translateY(-8px);}


.frontier-card-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 30px;
  color: white;
  background: linear-gradient(transparent 0%, rgba(0,0,0,0.6) 100%);}

.frontier-card-title {
  font-size: 22px;
  margin-bottom: 20px;
  line-height: 1.3;}

.frontier-card-description {
  font-size: 14px;
  opacity: 0.9;
  margin-bottom: 25px;
  line-height: 1.6;
  }

.frontier-team {
  display: block;
  font-size: 14px;
  margin-bottom: 15px;
  opacity: 0.8;}
.research-column .research-card-container:hover{
  transform:translateY(-4px);
}
.research-column .research-card-container:hover .research-card-title{font-weight:bold;}
.research-column .research-card-container{
  transition:all .3s;
}
.re_f{
  transition:all .3s;
}
.re_f:hover{transform:translateY(-4px);}
.frontier-detail-link {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  border: 1px solid rgba(255,255,255,0.3);
  padding: 8px 24px;
  border-radius: 20px;
  display: inline-block;
  transition: all 0.3s ease;}

.frontier-detail-link:hover {
  background: rgba(255,255,255,0.1);
  border-color: transparent;}
/* Ã§Â§â€˜Ã¥Â­Â¦Ã§Â â€Ã§Â©Â¶Ã©Æ’Â¨Ã¥Ë†â€ Ã¦Â Â·Ã¥Â¼Â - Ã¦ÂÂ¥Ã¨â€¡ÂªD_mainPage2.html */
.research-container {
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 20px;
  position: relative;}

.research-background-text {
  position: absolute;
  left: 20px;
  top: -20px;
  color: rgba(0,0,0,0.05);
  font-size: 68px;
  font-weight: 900;
  text-transform: uppercase;
  z-index: 0;}

.research-main-title {
  font-size: 24px;
  color: #333;
  margin-bottom: 40px;
  position: relative;
  padding-left: 20px;}

.research-columns {
  display: flex;
  gap: 30px;}

.research-column {
  flex: 1;
  background: #f5f5f5;
  border-radius: 8px;
  padding: 20px;
  position: relative;
  width: 338px;
  }

.research-column-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;}

.research-column-title {
  font-size: 20px;
  color: #333;
  font-weight: 600;
  }

.research-more-link {
  color: #666;
  font-size: 14px;
  text-decoration: none;
  position: relative;}

.research-main-image {
  background: #ff4444;
  width: 100%;
  height: 180px;
  border-radius: 6px;
  margin-bottom: 15px;
  overflow:hidden;
}
.research-main-image-content{
  width:100%;height:100%;odject-fit:contain;
}
.research-image-caption {
  font-size: 16px;
  color: #333;
  margin-bottom: 12px;
  font-weight: 500;}

.research-description {
  font-size: 14px;
  color: #666;
  line-height: 1.5;
  height: 42px;
  margin-bottom: 20px;
  }

.research-card-container {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-top: 15px;
  }

.research-card {
  background: white;
  border-radius: 8px;
  padding: 15px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);}

.research-card-title {
  font-size: 14px;
  color: #333;
  margin-bottom: 8px;
  font-weight: 500;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  }

.research-card-content {
  font-size: 12px;
  color: #666;
  line-height: 1.4;
  margin-bottom: 10px;}

.research-card-date {
  font-size: 12px;
  color: #999;
  text-align: right;}
.nav-container {
  background: #f8f9fa;
  padding: 30px 20px;}

.nav-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  overflow-x: auto;}

.nav-title {
  color: #333;
  font-size: 18px;
  margin-bottom: 25px;
  padding-left: 10px;}

.nav-grid {
  display: flex;
  gap: 45px;
  justify-content: space-around;}

.nav-item {
  text-align: center;
  min-width: 90px;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
}

.icon-wrapper {
  font-size: 28px;
  margin-bottom: 12px;
  padding: 25px 0px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  transition: transform 0.2s;
  padding:0;margin:0;width:60px;height:60px;margin-bottom:10px;
}

.nav-item:hover .icon-wrapper {
  transform: translateY(-3px);}

            
#base-intro .bi { color: #3b7ad9 ;}
#notice .bi { color: #dc3545 ;}
#dynamic .bi { color: #28a745 ;}
#research .bi { color: #8f66d7 ;}
#talent .bi { color: #ffc107 ;}
#exchange .bi { color: #8f66d7 ;}
#database .bi { color: #e83e8c ;}

.item-text {
  color: #333;
  font-size: 16px;
  line-height: 1.4;
  }