.scenic-item{
    max-width: 61.8%;
    margin: 0 auto 12px;
    text-align: center;
    font-size: 0;
    overflow: hidden;
}
.img-tile{
    margin: 30px auto 10px auto;
    font-weight: bold;
    font-size: 18px;
    color: #333;
    line-height: 2;
}
.img{
    width: 100%;
    height: 100%;
}

.section-tile{
    margin: 30px auto 10px auto;
    font-weight: bold;
    font-size: 18px;
    color: #333;
    line-height: 2; 
    text-align: center;
}
#introuce{
    width: 950px;
    margin: 0 auto;
}
.groupList {
    display: flex;
    flex-wrap: wrap; /* 从左至右并且从上至下排列 */
    gap: 12px;
    margin: 0 auto;
    width: 950px;
}
.item{
    width: calc(33.3% - 8px);
    flex-grow: 0;
    flex-shrink: 0;
}

.floor{
    margin: 8px 0 0 0;
    position: relative;
    font-size: 12px;

}
.clear-button {
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
    cursor: pointer;
    border: none;
    background: transparent;
}
.register-dialog{
    opacity: 0.9;
    background-color: white;
    padding: 16px 0;
    width: 500px;
    box-sizing: border-box;
    margin: 115px auto 0;
    font-size: 14px;
    text-align: center;
    animation: flipAnimation .3s ease-out forwards; /* 应用动画并保持最终状态 */
}
@keyframes flipAnimation {
    from { transform: rotateY(180deg);box-shadow: none; }
    to { transform: rotateY(360deg);  box-shadow: 0 10px 10px #b0acac;}
}
#checkbox{
    vertical-align: middle;
    margin-left: -10px;
}

#register-submit{
    display: block;
    width: 222px;
    box-sizing: border-box;
    line-height: 30px;
    height: 30px;
    color: #fefefe;
    background: rgb(90 90 255);
    cursor: pointer;
    border-radius: 3px;
    font-size: 16px;
    border: 0;
    outline: none;
}
#sex{
    width: 162px;
    font-size: 12px;
}
.describe{
    font-size: 12px;
    color: #f55;
    display: none;
}
#nickname,#phonenumber, #password{
    width: 162px; 
}
#inputValidCode{
    width: 76px; 
}
#sendValidCode{
    display: inline-block;
    height: 20px;
    line-height: 20px;
    border: 0;
    margin-left: 6px;
    width: 80px;
    color: rgb(90 90 255);
    background: rgb(222 222 255);
    border-radius: 2px;
    font-size: 12px;
}
h2{
    margin: 0 auto 0;
    padding: 10px 0;
}


body, html {
margin: 0;
height: 100%;
}
/* 视频背景容器 */
.video-background {
position: fixed; /* 固定定位，覆盖整个视口 */
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden; /* 隐藏溢出部分 */
z-index: -1; /* 确保视频在最底层 */
}

/* 视频元素本身 */
.video-background video {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover; /* 保持比例并填满容器 */
transform: translate(-50%, -50%);
}