body {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(238, 238, 238);
    font-family: 'Open Sans', sans-serif;
}

td a {
    text-decoration: none;
    /* 移除下划线样式 */
    color: inherit;
    /* 继承父元素的文字颜色 */
    /* 添加其他链接样式，如需要 */
}


.container {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100vh;
    /* 使容器占据整个视口高度 */
}

.top {
    width: 100%;
    background-color: #e0e0e0;
    /* 背景颜色 */
    box-shadow: 0px 10px 20px -5px rgba(0, 0, 0, 0.7), 0px -10px 20px -5px rgba(255, 255, 255, 0.7);
    /* 上面的阴影和下面的高亮 */
}

.biaoti {
    text-align: center;
    font-size: 200%;
    padding-top: 40px;
    /* 可以根据需要添加或修改 */
}

.daohang {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    /* 将其水平居中 */
    padding-bottom: 20px;
    /* 可以根据需要添加或修改其他样式 */
}

.daohang table {
    margin: auto;
    /* 设置左右外边距为 auto，使表格在父容器中水平居中 */
    /* 可以根据需要添加或修改其他表格样式 */
}

.daohang td {
    font-size: 10px;
    font-style: inherit;
    text-align: center;
    /* 将单元格中的文字居中 */
    padding-left: 10px;
    padding-right: 10px;
    /* 为了更好的可读性，添加一些内边距 */
}

.center {
    flex: 1;
    width: 80%;
    margin: 0 auto;
    text-align: center;
}

.center-1 {
    width: 100%;
}

.fade {
    opacity: 0; /* 初始透明度为0，隐藏元素 */
}

.bottom {
    width: 80%;
    margin: auto;
    text-align: center;
    font-size: 100%;
    padding: 10px;
    /* 内边距，可以根据需要调整 */
}

.img div
{
    display: inline-block;
    width: 40%;
    background-color: rgb(153, 153, 153);
    margin: 0 50px; /* 添加适当的外边距以区分两个 div */
    font-size: 120%;
}


.center-1 {
    text-align: center;
}

.center-1 iframe {
    width: 100%;
    height: 400px; /* 设置高度，或根据需要调整 */
}

.center-1 video {
    width: 80%;
    height: 50%; /* 设置高度，或根据需要调整 */
}

#neirong {
    text-align: left;
    line-height: 1.5;
    /* 设置行高，可以根据需要调整 */
}

#name1,
#name2 {
    margin-top: 50px;
    margin-bottom: 50px;
    font-size: 230%;
}

#content {
    transition: opacity 0.5s; /* 添加 opacity 过渡效果，时长为0.5秒 */
}