.new{
width:100%;}
.announcement ul {
    width: 100%;}

.announcement ul li {
    border-top: 1px solid #eeeeee;}

.announcement .ctr {
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row; /* 垂直排列子元素 */
    justify-content: start;
    align-items: center;
    margin:15px 0;
    height:71px;
    width: 100%
    background: linear-gradient(to left,#0D5690 0 0) var(--p, 100%) / var(--p,0%) no-repeat;
    transition: .6s, background-position 0s;
    cursor: pointer;}

.announcement .ctr:hover a{
    color: #0d5690;}

.announcement .ctr .date{
    color: #0d5690;
    background-image: linear-gradient(to top, #0d5690, #0e61a2, #0f6cb5, #1177c8, #1383dc);
    border: none;}

.announcement .ctr.date-day{
    color: rgb(252, 222, 27);}

.announcement .ctr .year-month{
    color: white;}


.announcement .date {
    width: 50px; /* 圆圈直径 */
    height: 70px;
    border-radius: 5px; /* 将方块变成圆形 */
    border: 1px solid #0d5690;
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: column; /* 垂直排列子元素 */
    align-items: center; /* 在交叉轴上居中对齐子元素 */
    justify-content: center;}

.announcement .date-day {
    font-size: 25px;
    color: rgb(252, 222, 27); /* 将文字颜色设置为白色 */
    font-weight: bold;
    height: 40%;
    display: flex;
    justify-content: center;
    align-items: center;}

.announcement .year-month {
    font-size: 13px;
    color: #999999; /* 将文字颜色设置为白色 */
    height: 30%;
    display: flex;
    justify-content: center;
    align-items: center;}
.announcement .line{
 width:75px;
 border-left: 3px solid #0D5690; /* 设置竖线的样式，1px 宽度，黑色 */
 margin-left:45px;}
.announcement .contest{
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row;}
.announcement .left1 {
        display: flex;
        justify-content: space-between;
        align-items: center;}
.announcement  .title .left1 a {
    font-size: 18px;
    color: #0d5690;}
.announcement .title .left1 img {
    margin-right: 10px;}

.announcement .title-1{
margin-left:15px;
margin-right:15px;
width: calc(90% - 70px);
flex: 1;}

.announcement .title-1 a {
    width: 100%;
    font-size: 15px;
    white-space: wrap;}
.academic {
    position: relative;
    width: 100%;
    padding: 40px 20px;
    background-image: url(./images/academicbg.png);
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 5;}

.academic .academictitle {
    width: 80%;
    padding: 30px 20px;

    display: flex;
    align-items: center;
    justify-content: space-around;}

.academic .academictitle a {
    display: inline-block;
    width: 150px;
    font-size: 25px;
    line-height: 35px;
    font-weight: 800;
    text-align: center;
    color: #0d5690;}

.academic .academictitle a:hover {
    font-size: 30px;
    color: #0d5690;
    transition: all .3s ease-in-out;}

.academic .academictitle div {
    height: 3px;
    width: 40%;
    background-color: #0d5690;
    border: none;}

.academic ul {
    width: 100%;
    padding-top: 30px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-around;}

.academic ul .passage {
    width: 70%;
    border-bottom: 1px solid gray;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 1s;}

.academic ul>div {
    position: relative;
    height: 280px;
    width: 280px;
    flex: 0 0 260px;
    box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.25);
    margin: 40px 0;}

.academic ul li {
    height: 100%;
    width: 280px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    z-index: 3;
    background-color: #fff;
    line-height: 45px;}

.academic ul li::after {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    transition: height 1s;
    -webkit-transition: height 1s;
    background-image: -moz-inear-gradient(90deg, #0095fa 0%, #0d5690 100%);
    background-image: -webkit-linear-gradient(90deg, #0095fa 0%, #0d5690 100%);}

.academic ul li:hover::after {
    height: 280px;
    background-color: #0c0c0c;}

.academic ul li:hover .passage {
    border-bottom: 1px solid #fff;}

.academic ul li:hover a {
    color: #fff;}

.academic ul li:hover span {
    color: #fff;}

.academic ul li:hover path {
    fill: #fff;}

.academic ul .img {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 50%;
    margin-top: -36px;
    margin-left: -36px;
    width: 72px;
    height: 72px;
    padding: 5px;
    border: 1px dashed black;
    border-radius: 50%;
    overflow: hidden;}

.academic ul .pic {
    position: absolute;
    top: 0;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: none;
    z-index: 4;
    overflow: hidden;
    background: url(./images/jiangzuo.png);
    background-size: cover;
    background-position: center;}

.academic ul .pic img {
    width: 100%;
    height: 100%;}

.academic ul li a {
    font-weight: 600;
    font-size: 20px;
    word-break: break-all;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    transition: all 1s;}

.academic ul li .info {
    width: 70%;}

.academic ul li .info .item {
    width: 100%;
    padding-top: 10px;
    display: flex;
    align-items: center;
    font-size: 15px;}

.academic ul li .info .item svg {
    max-width: 25px;
    max-height: 25px;}

.academic ul li .info .item svg path {
    transition: all 1s;}

.academic ul li .info .item .left {
    text-align: left;
    margin-right: auto;}

.academic ul li .info .item .right {
    text-align: right;}

.academic ul li span {
    transition: all 1s;}

.academic ul li div,
.academic ul li span {
    z-index: 4;}

.academic .announcement {
    width: 100%;
    background: white;}

.academic .announcementTitle{
                display: flex;
                width: 100%;
                flex-direction: column;
                align-items: center;}
.academic .announcement .noticetitle {
                width: 300px;
                padding: 10px 20px;
                border-bottom: 3px solid #0d5690;
                display: flex;
                align-items: center;
                justify-content: center;}

.academic .announcement .noticetitle a {
                font-size: 20px;
                font-weight: 800;
                line-height: 30px;
                color: #0d5690;
                text-align: center;}

.academic .announcement .noticetitle a:hover {
                font-size: 24px;
                color: #0d5690;
                transition: all .3s ease-in-out;}

.academic .announcement .underline {
                width: 200px;
                height: 15px;
                border: none;
                border-bottom: 3px solid #0d5690;
                margin-bottom: 20px;}

.academic .announcement .notice-list {
                width: 100%;
                padding: 20px;
                display: flex;
                justify-content: center;}

.academic .announcement .notice-list list {
                width: 100%;
                display: flex;
                flex-wrap: wrap;
                flex-direction: row;
                justify-content: space-around;}

.academic .announcement .notice-list li {
                position: relative;
                width: 20%;
                height: 200px;
                flex: 0 0 242px;
                box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
                display: flex;
                flex-direction: column;
                align-items: center;
                text-align: center;
                margin: 20px 0;}

.academic .announcement .notice-list .time {
                position: relative;
                top: 25px;
                width: 100%;
                height: 17px;
                padding: 10px 0;
                display: flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;
                text-align: center;}

.academic .announcement li {
                width: 100%;
                padding: 10px 10px;
                border-bottom: 1px dotted #ededed;}

.academic .announcement li .time {
                margin-bottom: 30px;}

.academic .announcement li .time .line{
                height: 2px;
                width: 30%;
                background-color: #000;
                margin: 0 5px;}
.academic .announcement li .time span {
                font-size: 12px;
                height: 20px;
                line-height: 20px;
                position: relative;
                display: flex;
                text-align: center;
                align-items: center;
                word-break: break-all;}

.academic .announcement li a {
                display: block;
                width: 100%;
                margin-top: 10%;
                font-size: 15px;
                line-height: normal;
                white-space: normal;}
.science .contest ul {
    width: 100%;}

.science .ctr {
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row; /* 垂直排列子元素 */
    margin:15px;
    border-radius: 35px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); /* 添加阴影效果 */
    background: linear-gradient(to right,#0D5690 0 0) var(--p, 100%) / var(--p,0%) no-repeat;
    transition: .6s, background-position 0s;}

.science .ctr:hover{
    --p: 100%;}

.science .ctr:hover a{
 
    color: #fff;}

.science .date-circle {
    min-width: 70px;
    width: 70px; /* 圆圈直径 */
    height: 70px;
    background-color: #0D5690; /* 圆圈颜色 */
    border-radius: 50%; /* 将方块变成圆形 */
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: column; /* 垂直排列子元素 */
    align-items: center; /* 在交叉轴上居中对齐子元素 */
    justify-content: center;}

.science .date-day {
    font-size: 25px;
    color: rgb(252, 222, 27); /* 将文字颜色设置为白色 */
    font-weight: bold;
    height: 40%;
    display: flex;
    justify-content: center;
    align-items: center;}

.science .year-month {
    font-size: 13px;
    color: white; /* 将文字颜色设置为白色 */
    height: 30%;
    display: flex;
    justify-content: center;
    align-items: center;}
.science .line{
 width:75px;
 border-left: 3px solid #0D5690; /* 设置竖线的样式，1px 宽度，黑色 */
 margin-left:45px;}
.science .contest{
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row;}
.science .left1 {
        display: flex;
        justify-content: space-between;
        align-items: center;}
.science  .title .left1 a {
    font-size: 18px;
    color: #0d5690;}
.science .title .left1 img {
    margin-right: 10px;}

.science .title-1{
margin-left:15px;
width: calc(90% - 70px);}

.science .title-1 a {
    width: 100%;
    font-size: 15px;}
.student_work .contest ul {
    width: 100%;}

.student_work .ctr {
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row; /* 垂直排列子元素 */
    margin:15px;
    border-radius: 35px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); /* 添加阴影效果 */
    background: linear-gradient(to left,#0D5690 0 0) var(--p, 100%) / var(--p,0%) no-repeat;
    transition: .6s, background-position 0s;}

.student_work .ctr:hover{
    --p: 100%;}

.student_work .ctr:hover a{
    color: #fff;}

.student_work .date-circle {
    min-width: 70px;
    width: 70px; /* 圆圈直径 */
    height: 70px;
    background-color: #0D5690; /* 圆圈颜色 */
    border-radius: 50%; /* 将方块变成圆形 */
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: column; /* 垂直排列子元素 */
    align-items: center; /* 在交叉轴上居中对齐子元素 */
    justify-content: center;}

.student_work .date-day {
    font-size: 25px;
    color: rgb(252, 222, 27); /* 将文字颜色设置为白色 */
    font-weight: bold;
    height: 40%;
    display: flex;
    justify-content: center;
    align-items: center;}

.student_work .year-month {
    font-size: 13px;
    color: white; /* 将文字颜色设置为白色 */
    height: 30%;
    display: flex;
    justify-content: center;
    align-items: center;}
.student_work .line{
 width:75px;
 border-left: 3px solid #0D5690; /* 设置竖线的样式，1px 宽度，黑色 */
 margin-left:45px;}
.student_work .contest{
    display: flex; /* 使用 flexbox 布局 */
    flex-direction: row;}
.student_work .left1 {
        display: flex;
        justify-content: space-between;
        align-items: center;}
.student_work  .title .left1 a {
    font-size: 18px;
    color: #0d5690;}
.student_work .title .left1 img {
    margin-right: 10px;}

.student_work .title-1{
margin-left:15px;
width: calc(90% - 70px);}

.student_work .title-1 a {
    width: 100%;
    font-size: 15px;}
