@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang ExtraLight.ttf') format('truetype');
    font-weight: 200; /* Extra Light */
}

@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang Light_0.ttf') format('truetype');
    font-weight: 300; /* Light */
}

@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang Regular_0.ttf') format('truetype');
    font-weight: 400; /* Regular */
}

@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang Medium_0.ttf') format('truetype');
    font-weight: 500; /* Medium */
}

@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang Bold_0.ttf') format('truetype');
    font-weight: 700; /* Bold */
}

@font-face {
    font-family: 'PingFang SC';
    src: url('fonts/PingFang Heavy.ttf') format('truetype');
    font-weight: 900; /* Heavy */
}

body{
    margin: 0;
    /*font-family: Arial, sans-serif;*/
    background-color: #010101;
    color: #ffffff;
    font-family: 'PingFang SC', sans-serif;
    overflow-x: hidden; 
}
.container{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    height:11rem;
    overflow: hidden;
}

#newscontainer{
    height:35.5rem;
}

#projectcontainer{
    height:20rem;
}

#coursecontainer{
    height:14rem;
}

#publicationcontainer{
    height:53rem;
}

#membercontainer{
    height:23rem;
}

.personalcontainer{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    height:19rem;
    overflow: hidden;
}

#wzyperonsalcontainer{
    height:20rem;
}

#pyperonsalcontainer{
    height:20rem;
}

#sdpersonalcontainer{
    height:24rem;
}
.navbar{
    position:relative;
    top:0;
    left:0;
    width:10rem;
    height:0.42rem;
    background-color: transparent;
}

.navbarbg{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    z-index: -1;
}


.hamburger {
    display: none; /* 默认隐藏 */
    font-size: 1.5rem;
    cursor: pointer;
    z-index: 10;
}
/* 覆盖层的样式 */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 半透明的黑色背景 */
    display: none; /* 默认隐藏 */
    z-index: 8; /* 确保在侧边栏之下 */
}


/* 侧边栏的样式 */
.sidebar {
    position: fixed;
    top: 0;
    right: -100%; /* 初始隐藏在屏幕外 */
    width: 40%;
    height: 100%;
    background-color: #333;
    transition: right 0.3s ease;
    z-index: 9;
}

.sidebar-nav {
    list-style: none;
    padding: 1rem;
}

.sidebar-nav li {
    margin: 0.1rem;
}

.sidebar-nav li a {
    color: white;
    text-decoration: none;
    font-size: 0.5rem;
}

.divlogo{
    position:absolute;
    top:0.08rem;
    left:0.3rem;
    width:1.8rem;
}


/* 去除无序列表的默认样式 */
.navul {
    position:absolute;
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    right:0.2rem;
    top:0.08rem;
}

/* 设置列表项的显示方式 */
.navul li {
    margin-right: 0.1rem;
    width:0.4rem;
    /*border: 1px solid red;*/
}

/* 设置链接的样式 */
.navul li a {
    color: white;
    text-decoration: none;
    display: flex; /* 使用Flexbox布局 */
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    height: 100%; /* 确保链接项的高度与父元素一致 */
    flex-direction: column; /* 使中文和英文垂直排列 */
    transition: transform 0.2s ease;
}

/* 设置中文部分的样式 */
.navul li a .zh {
    font-size: 0.09rem;
    color: white;
}

/* 设置英文部分的样式 */
.navul li a .en {
    font-size: 0.08rem; /* 调整英文字体大小 */
    color: rgb(207, 207, 207); /* 设置英文字体颜色 */
}


/* 设置链接悬停样式 */
.navul li a:hover {
    transform: scale(1.1); 
    color:white;
}

#MainBanner{
    position:absolute;
    top:0;
    z-index: -1;
    width:10rem;
    height:4.37rem;
}

#mainpicture{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    height:4.37rem;
}

#mianmask{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 50%, black 100%);
}

#mainvideo{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
}



#maintitle{
    position:absolute;
    top:0.75rem;
    width:7rem;
    left: 1.5rem;
}

#homeselected{
    position:absolute;
    top:0.26rem;
    left:0.2rem;
    transform: translateX(-50%);
    width:0.3rem;
    height:0.02rem;
    background-color: white;
}


/* 特殊样式的容器，确保 news 和 newsselected 居中对齐 */
.news-container {
    position: relative;
}

/* 设置 newsselected 的样式 */
#newsselected {
    position: absolute;
    top: 0.26rem;
    width: 0.3rem;
    height: 0.02rem;
    background-color: white;
    transform: translateX(-50%);
    left: 50%; /* 调整居中对齐 */
}

/* 保持news和newsselected一起放大 */
.news-container:hover #newsselected {
    transform: translateX(-50%) scale(1.1);
}

.bgwhiteline{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    z-index: -1;
}

.x{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    z-index: -1;
}

.xcontainer{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    z-index: -1;
}

#newsxcontainer{
    height: 30.5rem; /* 设置最大高度为200px */
    overflow: hidden;  /* 超出部分隐藏 */
}

#projectxcontainer{
    height: 14.5rem; /* 设置最大高度为200px */
    overflow: hidden;  /* 超出部分隐藏 */
}

#coursesxcontainer{
    height: 14.5rem; /* 设置最大高度为200px */
    overflow: hidden;  /* 超出部分隐藏 */
}

#memberxcontainer{
    height: 18.5rem; /* 设置最大高度为200px */
    overflow: hidden;  /* 超出部分隐藏 */
}

.blackbgcontainer{
    backdrop-filter: blur(100px);
    position:absolute;
    top:0;
    left:50%;
    transform: translateX(-50%);
    width:8rem;
    height:9.5rem;
    z-index:-1;

}

#indexblackbgcontainer{
    backdrop-filter: blur(0px);
}

#newsblackbgcontainer{
    height:34rem;
}

#courseblackbgcontainer{
    height:12.5rem;
}


#projectblackbgcontainer{
    height:18.5rem;
}

#publicationblackbgcontainer{
    height:51.5rem;
}

#memberblackbgcontainer{
    height:21.5rem;
}

.blackbg{
    width:100%;
    height:100%;
    background-color: #010101;
}


#newsblackbg{
    border-left: 0.5px solid #676767;
    border-right: 0.5px solid #676767;
    border-top: none;
    border-bottom: none;
    opacity:0.7;
}

#projectblackbg{
    border-left: 0.5px solid #676767;
    border-right: 0.5px solid #676767;
    border-top: none;
    border-bottom: none;
    opacity:0.7;
}

#courseblackbg{
    border-left: 0.5px solid #676767;
    border-right: 0.5px solid #676767;
    border-top: none;
    border-bottom: none;
    opacity:0.7;
}

#publicationblackbg{
    border-left: 0.5px solid #676767;
    border-right: 0.5px solid #676767;
    border-top: none;
    border-bottom: none;
}

#memberblackbg{
    border-left: 0.5px solid #676767;
    border-right: 0.5px solid #676767;
    border-top: none;
    border-bottom: none;
    opacity:0.7;
}

.blackcontainer{
    position:absolute;
    top:0;
    left:50%;
    transform: translateX(-50%);
    width:8rem;
    height:11rem;
}

#aboutus{
    position:absolute;
    top:4.25rem;
    left:0.5rem;
    font-size:0.1rem;
    color:white;
    z-index:1;
}

.separator{
    position:absolute;
    top:4.6rem;
    left:0.4rem;
    width:7rem;
}

#labname{
    position:absolute;
    top:5rem;
    left:0.5rem;
    font-size:0.2rem;
}

.regular{
    font-weight:300;
}

#theme{
    position:absolute;
    top:5.7rem;
    left:0.5rem;
    width:2.9rem;
}

#intro{
    position:absolute;
    top:6.5rem;
    left:0.5rem;
    font-size:0.08rem;
    width:3rem;
    text-align: justify;
    line-height: 1.8;
    font-weight:400;

}

#strategy{
    position:absolute;
    top:5.8rem;
    right:0.2rem;
    width:4rem;
}

#homebottom{
    position:absolute;
    bottom:0;
    width:10rem;
    height:1.5rem;
    z-index:-1;
}

.head{
    position:absolute;
    top:0.7rem;
    left:0.5rem;
    /*border: 1px solid red;*/
}

.headtitle{
    font-size:0.2rem;
    /*border: 1px solid red;*/
}

.vline{
    position:absolute;
    top:0.25rem;
    left:0.6rem;
    width:2px;
    height:0.2rem;
    background-color: white;
}

.headtitleen{
    position:absolute;
    top:0;
    left:0.8rem;
    font-size:0.2rem;
    font-weight: 200;
}

.headline{
    position:absolute;
    top:0.55rem;
    left:0;
    width:7rem;
    height:1px;
    background-color: white;
}

.maincontainer{
    position:absolute;
    width:7rem;
    height:7rem;
    /*border: 1px solid red;*/
    left:50%;
    transform: translateX(-50%);
    top:1.5rem;
    display: flex;
    flex-direction: column; /* 垂直排列子元素 */
}


.news-item {
    justify-content: space-between; /* 在顶部和底部对齐子元素 */
    width: 7rem;
    height: 1.15rem;
    /*border: 1px solid green;*/
    margin-bottom: 0.35rem;
    position:relative;
    display: block;
    text-decoration: none; 
    color: inherit;
}

.news-item:visited {
    color: inherit; /* 确保点击后的颜色也与父元素一致 */
    text-decoration: none; /* 去掉点击后的下划线 */
}

.news-item:focus {
    outline: none; /* 去掉点击时的焦点轮廓 */
}

.new-item-move{
    justify-content: space-between; /* 在顶部和底部对齐子元素 */
    width: 7rem;
    height: 1.15rem;
    /*border: 1px solid blue;*/
    margin-bottom: 0.35rem;
    align-items: top;
    position:relative;
    transition: transform 0.2s ease;
}

.news-item:hover .new-item-move {
    transform: translateX(0.1rem);
}

.hover-div {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;
}



.news-date {
    position:absolute;
    top:0;
    left:0;
    display:flex;
    /*border: 1px solid red;*/
    margin: 0; /* 移除默认 margin */
    align-items: center;
    width:1rem;
}

.newsdot {
    width: 0.06rem;  /* 圆点的直径 */
    height: 0.06rem;
    background-color: white;  /* 圆点的颜色 */
    border-radius: 50%;  /* 使其成为圆形 */
    margin-right:0.08rem;  /* 圆点与日期之间的间距 */
    display: inline-block;
}

.news-date-p {
    margin: 0;  /* 去除段落的默认外边距 */
    font-size:0.1rem;
    font-weight:300;
}

.news-intro {
    font-size: 0.1rem;
    bottom: 0; /* 对齐到父元素的底部 */
    margin: 0; /* 移除默认 margin */
}

.news-content {
    /*border: 1px solid red;*/
    width:2.3rem;
    height: 1.15rem;
    margin: 0;
    position:absolute;
    top:0;
    left:1.5rem;
    display:flex;
    flex-direction: column; /* 垂直排列子元素 */

}

.news-pic{
    position:absolute;
    top:0;
    right:0;
    height:1.15rem;
    margin: 0;
}

.news-content-title{
    font-size:0.11rem;
    margin: 0;
    margin-bottom:0.1rem;
    font-weight:600;
}

.news-content-content{
    font-size:0.1rem;
    line-height:1.5;
    margin: 0;
    text-align: justify;
    font-weight:300;
}

.course-container {
    position: relative;
    width: 7.5rem;
    height: 7rem;
    /*border: 1px solid red;*/
    left: 0.5rem;
    top: 1.5rem;
    white-space: normal; /* 确保子元素会自动换行 */
    margin:0;
    font-size: 0; 
}

.projectcontainer {
    position: relative;
    width: 7.5rem;
    height: 7rem;
    /*border: 1px solid red;*/
    left: 0.5rem;
    top: 1.5rem;
    white-space: normal; /* 确保子元素会自动换行 */
    margin:0;
    font-size: 0; 
}

.course-item {
    width: 2rem;
    height: 2.2rem;
    /*border: 1px solid green;*/
    margin-top:0;
    margin-left:0;
    margin-bottom: 0.2rem; /* 调整子元素之间的垂直间距 */
    margin-right: 0.5rem; /* 调整子元素之间的水平间距 */
    display: inline-block; /* 使子元素横向排列并自动换行 */
    text-decoration: none;
    color: inherit;
    position:relative;
    transition: transform 0.2s ease; /* 平滑的过渡效果 */
}


.project-item {
    width: 2.2rem;
    height: 2.2rem;
    /*border: 1px solid green;*/

    margin-top:0;
    margin-left:0;
    margin-bottom: 0.5rem; /* 调整子元素之间的垂直间距 */
    margin-right: 0.2rem; /* 调整子元素之间的水平间距 */
    display: inline-block; /* 使子元素横向排列并自动换行 */
    text-decoration: none;
    color: inherit;
    position:relative;
    transition: transform 0.2s ease; /* 平滑的过渡效果 */
}


.project-item:hover {
    transform: scale(1.03); /* 放大到1.1倍 */
}

.project-item:hover .project-title {
    transform: translateX(0.05rem);
    transition: transform 0.3s ease;
  }

  .course-item:hover {
    transform: scale(1.03); /* 放大到1.1倍 */
}

.course-item:hover .course-title p{
    transform: translateX(0.1rem);
    transition: transform 0.3s ease;
  }

  .course-item:hover .course-title .course-title-line{
    transform: scaleX(0.95);
    transition: transform 0.3s ease;
  }

.projectpicture{
    position:absolute;
    top:0;
    left:0;
    width:2.2rem;
    margin:0;
}

.course-picture{
    position:absolute;
    top:0;
    left:0;
    width:2rem;
    margin:0;
}

.project-title{
    position:absolute;
    top:1.3rem;
    left:0;
    width:2.2rem;
    height:0.45rem;
    transition: transform 0.2s ease;
}

.course-title{
    position:absolute;
    top:1.3rem;
    left:0;
    width:2rem;
    height:0.7rem;
}

.project-title-h1{
    font-size:0.1rem;
    font-weight:400;
    margin-bottom:0.025rem;
    background: linear-gradient(90deg, #0F44FE 0%, rgba(15, 68, 254, 0) 100%);
    padding:0.02rem;
    padding-left:0.05rem;
    width:auto;
}

#knowledge{
    background: linear-gradient(90deg, #00C2FF 0%, rgba(0, 193.80, 255, 0) 100%);
}

#ai{
    background: linear-gradient(90deg, #26D0B7 0%, rgba(38, 208, 183, 0) 100%);
}
.course-title-h1{
    font-size:0.12rem;
    font-weight:400;
    margin-bottom:0.05rem;
}

.publication-title-h1{
    font-size:0.12rem;
    font-weight:400;
    margin:0;
    margin-bottom:0.05rem;
}


.course-title-line{
    width:2rem;
    height:0.5px;
    background-color: white;
    margin:0;
    transform-origin: right; /* 设置变换的原点在左边 */
}

.project-title-h2{
    font-size:0.12rem;
    font-weight:400;
    margin:0;
}

.course-title-h2{
    font-size:0.08rem;
    font-weight:200;
    margin-top:0.05rem;
    margin-bottom:0.02rem;
}

.publication-title-h2{
    font-size:0.1rem;
    font-weight:300;
    color:#cccccc;
    margin:0;
}

.publication-title-h3{
    font-size:0.1rem;
    font-weight:400;
    margin:0;
    font-style: italic;
}

.course-title-h3{
    font-size:0.08rem;
    font-weight:200;
    margin:0;
}
.project-tag{
    position:absolute;
    top:2rem;
    left:0;
    width:2.2rem;
    height:0.25rem;
    display:flex;
}

.project-tag-1{
    width:0.5rem;
    height:0.15rem;
    border: 1px solid white;
    font-size:0.07rem;
    font-weight:300;
    text-align: center;
    line-height: 0.15rem;
    border-radius: 0.15rem; 
    margin-right:0.1rem;
}

.hover-div-project{
    position: absolute;
    top: 1.4rem;
    left: 0;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;
}

.hover-div-course{
    position: absolute;
    top: 1.45rem;
    left: 0;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;
}

#publication-maincontainer{
    top:1.5rem;
    width:7rem;
    position:absolute;
    left:50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column; /* 垂直排列子元素 */
}

.publication-item{
    justify-content: space-between; /* 在顶部和底部对齐子元素 */
    width: 7rem;
    height: 0.8rem;
    margin-top:0;
    margin-bottom: 0.4rem;
    position:relative;
    display: block;
    text-decoration: none; 
    color: inherit;
}

.publication-picture{
    position:absolute;
    top:0;
    left:0;
    height:0.9rem;
}

.publication-title{
    position:absolute;
    top:0;
    left:1.9rem;
    width:5rem;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content: center; 
}

.publication-item:hover .publication-title p{
    transform: translateX(0.1rem);
    transition: transform 0.3s ease;
  }


  .hover-div-publication{
    position: absolute;
    top: 0.1rem;
    left: 1.9rem;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;
  }

#publicationpage-page1{
    position:absolute;
    top:0;
    left:0;
}


/* 显示选中的 publicationpage */
.publicationpage.active {
    display: block;
}

#membermaincontainer{
    /*background-color: #676767;*/
}

.teacher{
    position:relative;
    width:7rem;

    /*background-color: #c8c8c8;*/
    justify-content: space-between; /* 在顶部和底部对齐子元素 */
    /*border: 1px solid green;*/
    margin-bottom: 0.9rem;
    position:relative;
    display: block;
    text-decoration: none; 
    color: inherit;
}

.teacher-title{
    position:absolute;
    top:0;
    left:0;
    width:7rem;
    display: flex;
    align-items: center; /* 垂直居中 */
    gap:0.06rem;
    font-size:0.15rem;
    margin:0;
}

.teacher-title .zh{
    font-weight:400;
    margin:0;
}

.teacher-title .en{
    font-weight:300;
    margin:0;
}

.teacherline{
    margin-left:0.2rem;
    width:4.4rem;
}

.teacher-bio{
    top:0.05rem;
    width:1.2rem;
    height:1.8rem;
    /*background-color: #ffb6b6;*/
    text-decoration: none; 
    color: white;
    margin-right: 0.75rem; /* 调整子元素之间的水平间距 */
    display: inline-block; /* 使子元素横向排列并自动换行 */
    position:relative; 
}

.teacherphoto{
    position:absolute;
    top:0;
    left:0;
    width:1.2rem;
    margin:0;
}

.teachername{
    font-size:0.12rem;
    font-weight:400;
    margin-top:0;
    margin-bottom:0.03rem;
}
.teachertitle{
    font-size:0.08rem;
    font-weight:400;
    margin-top:0;
    margin-bottom:0.03rem;
}

.teacherinterest{
    font-size:0.08rem;
    font-weight:300;
    margin-top:0;
    margin-bottom:0.03rem;
}

.teacher-p{
    position:relative;
    top:1.3rem;
    left:0;
    display:flex;
    flex-direction: column;
    width:100%;
}

.teacher-bio:hover{
    transform: scale(1.03); 
}

.teacher-bio:hover .teacher-p{
    transform: translateX(0.1rem);
    transition: transform 0.3s ease;
}

.hover-div-teacher{
    position: absolute;
    top: 1.3rem;
    left: 0;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;

}

.teacher-bio-container{
    position: relative;
    width: 7.5rem;
    left: 0;
    top:0.4rem;
    white-space: normal; /* 确保子元素会自动换行 */
    margin:0;
    font-size: 0; 
}

#labline{
    width:7rem;
    position:absolute;
    top:0.25rem;
}

#doctor{
    margin-bottom:0.5rem;
}

#doctor-title{
    gap:0rem;
}

#doctorline{
    width:6rem;
}

#ourmember{
    margin-bottom:0.5rem;
}

.member-bio-container{
    position: relative;
    width: 7.5rem;
    left: 0;
    top:0.4rem;
    white-space: normal; /* 确保子元素会自动换行 */
    margin:0;
    font-size: 0; 
}

.member-bio{
    width:1.2rem;
    height:1.8rem;
    text-decoration: none; 
    color: white;
    margin-top: 0;
    margin-left:0;
    margin-right: 0.25rem; /* 调整子元素之间的水平间距 */
    margin-bottom:0.1rem;
    display: inline-block; /* 使子元素横向排列并自动换行 */
    text-decoration: none;
    position:relative;
}

.memberphoto{
    position:absolute;
    top:0;
    left:0;
    width:1.2rem;
    margin:0;
}

.member-bio:hover{
    transform: scale(1.03); 
}

.member-bio:hover .teacher-p{
    transform: translateX(0.1rem);
    transition: transform 0.3s ease;
}

.hover-div-member{
    position: absolute;
    top: 1.3rem;
    left: 0;
    width: 3px;
    height: 0;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: height 0.5s ease;

}

.greycontainer{
    position:relative;
    top:2rem;
    width:7rem;
    height:15.5rem;
    background-color: #1A1A1A;
    border-left: none;
    border-right: none;
    border-top:1px solid white;
    border-bottom: 1px solid white;
}

#wzygreycontainer{
    height:16.5rem;
}

#pygreycontainer{
    height:16.5rem;
}
.myphoto{
    position:absolute;
    top:1rem;
    left:0.5rem;
    width:2.5rem;
    border: 1px solid white;
}

.myname{
    position:absolute;
    top:1rem;
    left:3.6rem;
    display:flex;
    flex-direction: column;
    width:100%;
}

.myname-name{
    font-size:0.1rem;
    font-weight:400;
    margin-top:0;
    margin-bottom:0.04rem;
}

.myname-grade{
    font-size:0.08rem;
    font-weight:300;
    margin-top:0;
    margin-bottom:0.04rem;
}

.myname-interest{
    font-size:0.08rem;
    font-weight:300;
    margin-top:0;
    margin-bottom:0.04rem;
}

.email{
    position:absolute;
    top:0.5rem;
    left:3.6rem;
    font-size:0.1rem;
    font-weight:300;
    color:white;
    transform: translateY(-50%);
}

.selfintro{
    position:absolute;
    top:1rem;
    left:0.5rem;
    width:2.5rem;
    height:1rem;
}

.mytitle{
    font-size:0.1rem;
    font-weight:400;
    margin:0;
}

.myline{
    width:2.5rem;
    margin:0;
    margin-bottom: 0.05rem;
}

.myintro{
    width:2.45rem;
    margin:0;
    font-size:0.08rem;
    font-weight:300;
    text-align: justify;
    line-height: 1.5;
}

.honor{
    position:absolute;
    top:1rem;
    left:3.6rem;
    width:2.5rem;
    height:1rem;
}

.edubg{
    position:absolute;
    top:2.5rem;
    left:0.5rem;
    width:2.5rem;
    height:1rem;
    margin:0;
}

.education-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin:0;
    margin-top:-0.05rem;
    
}

.education-row div {
    flex: 1;
    text-align: left;
    font-size:0.08rem;
    font-weight:300;
    line-height: 1; 
    margin:0;
}

.education-row .education-degree {
    text-align: right;
    font-size:0.08rem;
    font-weight:300;
    line-height: 1; 
    margin:0;
}

.mypublication{
    width:2.5rem;
    height:auto;
    margin-bottom:0.25rem;
}

#publicationline{
    width:5.5rem;
}

.mypublication-p{
    width:5.2rem;
    margin:0;
    font-size:0.08rem;
    font-weight:200;
    line-height: 1.5;
}

.publication-list {
    list-style-type: disc; /* 使用圆点作为列表项目符号 */
    margin: 0;
}

.publication-list li {
    width:5.2rem;
    margin-bottom: 0.8rem; /* 设置列表项之间的间距 */
    line-height: 1.5; /* 设置行距，使段落更容易阅读 */
    margin-top: 0.1rem;
    margin-bottom: 0.2rem;
    margin-left: -0.12rem;
    margin-right: 0;
}



.myblackcontainer{
    position:absolute;
    top:0;
    left:50%;
    transform: translateX(-50%);
    width:7rem;
    height:14.5rem;
}

.personalblackbgcontainer{
    backdrop-filter: blur(100px);
    position:absolute;
    top:0;
    left:50%;
    transform: translateX(-50%);
    width:7rem;
    height:9.5rem;
    z-index:-1;
}



.mycolume{
    position:absolute;
    top:3.8rem;
    left:0.5rem;
    display:flex;
    flex-direction: column;
}
#xprbio{
    width:2rem;
}

.myproject{
    width:2.5rem;
}

.myproject-section{
    display: flex;
    flex-direction: column;
    margin-top:0.1rem;
}

.myproject-item {
    width:5.5rem;
    height:1.5rem;
    position:relative;
    margin-top:0;
    margin-bottom:0.3rem;
}

.myproject-item-pro {
    width:5.5rem;
    position:relative;
    margin-top:0;
    margin-bottom:0.3rem;
}

.myproject-image {
    position:absolute;
    height:100%;
    top:0;
    left:0;
}

.myproject-details {
    position:absolute;
    top:0;
    right:0;
    width:2.5rem;
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.myproject-detailes-p{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap:0.03rem;
}

.myjournal-info {
    font-size:0.08rem;
    font-weight:200;
    color: #ffffff;
    margin:0;
}

.myproject-details h3 {
    font-size: 0.12rem;
    margin:0;
}

.mypublication-link {
    font-size:0.08rem;
    font-weight:200;
    color: #ffffff;
    text-decoration: none;
    margin:0;
    text-decoration: underline;
}

.myproject-details p {
    bottom:0;
    font-size:0.08rem;
    font-weight:200;
    line-height: 1.6;
    margin:0;
}

.yeartag{
    font-size:0.14rem;
    margin-top:0.1rem;
    margin-bottom:0.2rem;
    margin-left:0;
    margin-right:0;
}

.year-navigation {
    position: fixed;
    left: 0.4rem;
    top: 1.55rem; /* 根据需求调整 */
    color: white;
}
.year-item {
    position:relative;
    display: flex;
    align-items: center;
    margin:0;
    margin-bottom: 0.05rem; /* 根据需要调整间距 */
}

input[type="radio"] {
    display: none;
}

.newsdot2 {
    width: 0.06rem;  
    height: 0.06rem;
    background-color: white;
    border-radius: 50%;  
    margin-right: 0.08rem; 
    display: inline-block;
}

label {
    cursor: pointer;
    font-size: 0.13rem;
    color: gray;
}

input[type="radio"]:checked + .newsdot2 + label {
    color: white;
}

.hover-div-year{
    position:absolute;
    top:0.18rem;
    left:0.12rem;
    width: 0;
    height: 3px;
    background-color: white;
    z-index: 1; /* 确保它在顶部 */
    transition: width 0.5s ease;
}

.year-item:hover{
    transform: scale(1.1); 
  }

  .year-item:hover .year-label{
    color:white;
  }

  .graduate-member-bio{
    width:1.2rem;
    text-decoration: none; 
    color: white;
    margin-top: 0;
    margin-left:0;
    margin-right: 0.25rem; /* 调整子元素之间的水平间距 */
    margin-bottom:0.1rem;
    display: inline-block; /* 使子元素横向排列并自动换行 */
    text-decoration: none;
    position:relative;
  }

.graduate-p{
    position:relative;
    top:0rem;
    left:0;
    display:flex;
    flex-direction: column;
    width:100%;
}

.vipbg{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
    height:5rem;
    overflow: hidden;
}

#vipbgwny{
    height:10rem;
}

.xianyanbao{
    position:absolute;
    top:0;
    left:0;
    width:10rem;
}

#vipgrey{
    top:3.8rem;
    height:18.7rem;
    background: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(150px);
    border-bottom: 0;
}

#vipselfintro{
    top:0.4rem;
}

#viphonor{
    top:0.4rem;
}

#vipeducation{
    top:1.7rem;
}
#vipcolume{
    top:3rem;
}

.remove-bullet {
    list-style-type: none;
}

.remove-bullet li{
    list-style-type: disc;
}
.project-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

#vipmyname{
    top:3rem;
    left:5.1rem;
}

#vipmynameyr{
    top:3rem;
    left:5.1rem;
}

.sdpro{
    width:100%;
}

.myphotozheng{
    position:absolute;
    top:1rem;
    left:0.5rem;
    width:1.8rem;
    border: 1px solid white;
}

.linkicon{
    width:0.1rem;
}