.footer {
    background-color: var(--footer-background-color);
    width: 100%;
    position: fixed;
    /*height: 7vh;  */
    height: 59px;
    z-index: 999; 

}
.footer-box{
    width: 68%;
    margin: 0 auto; 
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: white;
}
.footer-box-left{
    width: 80%; 
    display: flex;
}
.footer-box-right{
    font-size: .8rem;
    font-weight: 550 ;
    display: flex;
    align-items: center; 
}
.right10{
    margin-right: 7px;
}
.right-buttom{
    width: 55px;
    background-color: rgb(31,135,224);
    padding: 4px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 3px;
    margin-left: 12px;
    cursor: pointer;
}
.footer-box-nav{
    width:680px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    color: #dddddd; 
}
.footer-box-nav :hover{
     color: white;
}
.miweilogo {
    width: 125px; /* 默认宽度 */
    height: auto; /* 高度自动调整以保持比例 */
    cursor: pointer; 
}

.right11{
    width: 13px;
}
.left1{
    margin-left:10%;cursor: pointer;
}
#hadermodal{ 
    display: none;
    position: fixed;
    width: 600px;
    height: 350px;
    border: 1px solid #dddddd;
    z-index: 999;
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
    background-color: white;
    border-radius: 8px;
    box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.5);
    color: #aaaaaa;
    padding: 16px;
    font-size: 13px;
    opacity: 1;
    background-color: white;
}

#hadermodal2{  
    width: 100%;
    height: 350px;  
    z-index: 999;  
    background-color: white;
    border-radius: 8px;
    box-shadow: 1px 1px 5px rgba(46, 0, 0, 0.16), 
              -1px -1px 5px rgba(46, 0, 0, 0.16),
              1px -1px 5px rgba(46, 0, 0, 0.16),
              -1px 1px 5px rgba(46, 0, 0, 0.16);
    color: #aaaaaa;
    padding: 16px;
    font-size: 13px;
    opacity: 1;
    background-color: white;
}

#close-modal2 {
   color: black;
    position: absolute; 
    top: -13px;
    right: -11px;
    width: 30px; 
    height: 30px; 
    border-radius: 50%;
    text-align: center; 
    font-size: 12px;
    border: 1px solid #cccccc;
    display: flex;
    background: white; 
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.from {
    border: 1px solid #aaaaaa;
    border-radius: 4px;
    height: auto; /* 根据内容高度自动调整 */
    padding: 12px 24px; /* 简化 padding */
    font-size: 15px;
}
.from2 {
    border: 1px solid #aaaaaa;
    border-radius: 4px;
    height: auto; /* 根据内容高度自动调整 */
    padding: 12px 24px; /* 简化 padding */
    font-size: 15px;
}

.labels {
    width: 40px;
    text-align: right;
}

.from-item {
    border-bottom: 1px solid #aaaaaa;
    height: 50px;
    color: black;
    line-height: 45px;
    position: relative; /* 为了使错误信息相对定位 */
}
.from-item2 {
    border-bottom: 1px solid #aaaaaa;
    height: 50px;
    color: black;
    line-height: 45px;
    position: relative; /* 为了使错误信息相对定位 */
}

input, textarea {
    width: 80%;
    padding: 8px;
    box-sizing: border-box; /* 包含内边距和边框的总宽度 */
    border: none; /* 去掉边框 */
    resize: none; /* 禁用调整大小 */
}

.from-trea { 
    height: 65px;
    color: black;
    display: flex;
    padding-top: 10px;

}

input:focus, textarea:focus {
    outline: none; /* 去掉选中时的轮廓 */
    box-shadow: none; /* 去掉任何阴影效果（可选） */
}

.error-message {
    color: red; /* 红色字体 */
    font-size: 12px; /* 小一点的字体 */
    position: absolute; /* 绝对定位以便于显示在输入框下方 */
    bottom: 27px; /* 向下移动 */
    left: 0;
    visibility: hidden; /* 默认隐藏 */
       height: 5px;

}
.error-message2 {
    color: red; /* 红色字体 */
    font-size: 12px; /* 小一点的字体 */
    position: absolute; /* 绝对定位以便于显示在输入框下方 */
    bottom: 27px; /* 向下移动 */
    left: 0;
    visibility: hidden; /* 默认隐藏 */
    height: 5px;
}
#submit-button2{
    width: 100%;
    height: 40px;
    background-color: rgb(59,134,255);
    border-radius: 6px;
       margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 16px;
    cursor: pointer;
}
#submit-button{
    width: 100%;
    height: 40px;
    background-color: rgb(59,134,255);
    border-radius: 6px;
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 16px;
    cursor: pointer;
}
.treas{
    width: 82px; margin-top: 5px;
}
.nav-item{
    margin-top: -5px;
    cursor: pointer;
}
 
.dibulan{
width: 100%;
height: 70px;  
background-color: red;
}
#buttom {
        width: 80px;
        height: 400px;
        position: fixed;
        bottom: 20%;
        right: 20px;
        padding: 10px 20px;
        background-color: transparent;
        color: white;
        border: none;
        border-radius: 5px;
    }

    .buttom-item {
        width: 80px;
        height:70px;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }

    .buttom-item img {
        cursor: pointer;
    }


  
    #modal {
        display: none; /* 确保初始状态为隐藏 */
        position: absolute; 
        right: 100px;
        top:-120px;
        width: 180px;
        height: 180px;
        background: rgba(0, 0, 0, 0.7);
        z-index: 1000;
        align-items: center;
        justify-content: center; 
        background: white; 
        padding: 10px;
        border-radius: 8px;
        box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.5);  
    }

   #close-modal {
       color: black;
        position: absolute; 
        top: -13px;
        right: -11px;
        width: 30px; 
        height: 30px; 
        border-radius: 50%;
        text-align: center; 
        font-size: 12px;
        border: 1px solid #cccccc;
        display: flex;
        background: white; 
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }
    .wxerm{ 
        height: 20px;
        background-color:rgb(59,134,255);
        font-size: 12px;
        text-align: center;
        line-height: 20px;
        padding: 5px;
        border-radius: 5px;
    }

    #modal2 {
        display: none; /* 确保初始状态为隐藏 */
        position: absolute; 
        right: 100px;
        width: 240px;
        height: 40px;
        background: rgba(0, 0, 0, 0.7);
        z-index: 1000;
        align-items: center;
        justify-content: center; 
        background: white;  
        border-radius: 4px;
        box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.5);  
    }
    .modal2-1{
        width: 40%;
        height: 100%; 
        border-left: 1px solid rgb(59,134,255);
        border-radius: 4px;
        background-color: rgb(59,134,255);
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
 
    }
    .modal2-2{
        width: 60%;
        height: 100%;  
        display: flex;
        color: black;
        justify-content: center;
        align-items: center;
        z-index: 90;
    }
    .image{
        width:70px;
        height: 70px;
    }
    @media (max-width: 768px) {
        #buttom {
        width: 50px; 
    }

    }
.wj-btn{
    height: 38px;
    line-height: 38px;
    border: 1px solid transparent;
    padding: 0 18px;
    background-color: #009688;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border-radius: 2px;
    cursor: pointer;
}
.unit-text{
    border: 1px solid #189f92;
    margin-top: 4px;
    width: 100%;
}