/* 确保html和body占满整个视口 */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
ul,li,form,th,div,table,td,form,p,ol,dl,dt,dd{border:none; list-style:none; margin:0; padding:0}
/* 设置header的高度 */
header {
    background-color: white; /* 设置背景色为白色 */
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    border-bottom: 1px solid #ececec; /* 添加底部边框 */
    font-size: 12px; /* 设置工具栏文字大小为12px */
    position: relative;
}

.logo-container {
    display: flex;
    align-items: center;
}

.logo {
    margin-right: 10px;
    height: 30px;
}
.site-name {
    font-size: 16px; /* 设置网站名称文字大小为16px */
    font-weight: bold; /* 设置为粗体 */
    position: absolute;
    left: 140px;
    top: 22px;
    border-left: #D8D8D8 1px solid;
    padding-left: 10px;
}
.login-active a {
    background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: #fff; /* 白色文字 */
    border: none;
    border-radius: 24px; /* 圆角 */
    padding: 10px 0px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s; /* 添加过渡效果 */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    margin: 0 auto;
    text-decoration: none;
}
.login-active a:hover {
    background-color: #cdd1d6; /* 更深的蓝色 */
    transform: scale(1.05); /* 稍微放大 */
}

.clear-files a {
    background: linear-gradient(98.29deg,#7f7f7f 0,#000000 100%);
    color: #fff; /* 白色文字 */
    border: none;
    border-radius: 4px; /* 圆角 */
    padding: 6px 0px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s; /* 添加过渡效果 */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    margin: 0 auto;
    text-decoration: none;
    text-align: center;
}
.clear-files a:hover {
    background-color: #cdd1d6; /* 更深的蓝色 */
    transform: scale(1.05); /* 稍微放大 */
}
/* 设置main的高度占满剩余空间 */
main {
    display: flex;
    height: calc(100% - 61px); /* 减去header的高度 */
    overflow: hidden; /* 隐藏溢出的内容 */
}

.iframe-body{
    width: 100%;
}

.sidebar {
    width: 78px; /* 调整宽度为88px */
    background-color: white; /* 设置背景色为白色 */
    padding: 10px;
    font-size: 12px; /* 设置文字大小为12px */
    border-right: 1px solid #ececec; /* 添加底部边框 */
}

.tool-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; /* 垂直居中对齐 */
    margin-bottom: 10px;
    cursor: pointer;
    width: 74px; /* 设置宽度为74px */
    height: 74px; /* 设置高度为74px */
    border-radius: 4px;
    transition: background 0.3s; /* 添加过渡效果 */
}

.tool-item:hover {
    background: #F3F5F7; /* 鼠标移入时背景色变为#F3F5F7 */
}

.tool-active {
    background: #F3F5F7; /* 激活状态的背景色 */
}

.tool-item img {
    width: 24px; /* 调整图标大小为24px */
    margin-bottom: 8px;
}

.file-upload {
    flex: 1; /* 占据一半宽度 */
    padding: 10px;
    background-color: #F3F5F7; /* 设置文件选择栏背景色为#F3F5F7 */
    overflow-y: auto;
    position: relative;
}
.file-upload h3{
    padding: 40px 30px  0px 40px;
    background: #fff;
    margin: 0;
}
#file-list{
    list-style: none;
    background: #fff;
    padding: 20px;
    border-radius: 4px;
    position: relative;
    margin-bottom: 20px;
}
#file-list a{
    text-decoration: none;
    font-size: 14px; 
    width: 100px;
}
#file-list li{
    height: 68px;
    line-height: 68px;
    overflow: hidden;
    display: flex;
    align-items: center;
    transition: background-color 0.3s; /* 添加过渡效果 */
    padding-left: 20px;
}
#file-list li:hover {
    background-color: #f3f5f7; /* 鼠标悬停时的背景色 */
}
#file-list img{
    width: 24px;
    margin-right: 10px;
}
#file-list span{
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 56px;
    line-height: 56px;
    overflow: hidden;
    font-size: 14px;
}

.no-image{ width: 106px !important}




.file-list{
    list-style: none;
    padding-left: 0px;
}
.file-list a{
    text-decoration: none;
    font-size: 14px; 
    width: 100px;
}
.file-list li{
    height: 68px;
    line-height: 68px;
    overflow: hidden;
    display: flex;
    align-items: center;
    transition: background-color 0.3s; /* 添加过渡效果 */
    padding-left: 20px;
}
.file-list li:hover {
    background-color: #f3f5f7; /* 鼠标悬停时的背景色 */
}
.file-list img{
    width: 24px;
    margin-right: 10px;
}
.file-list span{
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 56px;
    line-height: 56px;
    overflow: hidden;
    font-size: 14px;
}
/* 删除按钮样式优化 */
#file-list .delete-btn {
    background-color: transparent;
    border: none;
    color: #FF4D4F; /* 红色文字 */
    font-size: 14px;
    cursor: pointer;
    transition: color 0.3s; /* 添加过渡效果 */
    margin-left: 20px;
    text-decoration: none;

}

#file-list .delete-btn:hover {
    color: #FF0000; /* 更深的红色 */
}
/* 文件上传动画效果 */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

#file-list li {
    animation: fadeIn 0.5s ease-in-out; /* 添加淡入动画 */
}


/* 文件选择按钮样式优化 */
.file-upload-btn {
    background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 10px 30px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 340px auto 0 auto;
}

.file-upload-btn:hover {
    background-color: #cdd1d6; /* 更深的蓝色 */
    transform: scale(1.05); /* 稍微放大 */
}

.file-upload-btn img {
    width: 16px;
    margin-right: 8px;
}

/* 文件选择输入框隐藏 */
.file-input {
    display: none;
}

.file-up{
    height: 450px;
    background: #fff url(../images/yingyong.png);
    background-size: 300px;
    background-repeat: no-repeat;
    background-position: center;
    padding: 20px;
    border-radius: 4px;
    position: relative;
}

#info-display {
    flex: 1; /* 占据一半宽度 */
    background-color: white; /* 设置信息展示栏背景色为白色 */
    padding: 30px;
}

.icon-img{
    width: 48px;
}

.info-center{
    text-align: center;

}

.wait-btn{
    color: #939393;
}
.download-btn{
    color: #0004ff;
}
/* 登录模态框样式 */
.modal {
    display: none; /* 默认隐藏 */
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background-color: #fefefe;
    margin: 10% auto;
    padding: 60px 10px 40px 10px;
    width: 80%;
    max-width: 360px;
    text-align: center;
    max-height: 80vh; /* 限制最大高度为视口高度的80% */
    overflow: hidden; /* 隐藏滚动条 */
    font-size: 12px;
    position: relative;
    border-radius: 12px;
    border-top: red 4px solid;
}

.modal-content img{
    width: 220px;
    border: 1px solid #D8D8D8;
    margin: 20px auto;
}
.close-btn {
    color: #aaa;
    font-size: 28px;
    position: absolute;
    top: 10px;
    right: 30px;
}

.close-btn:hover,
.close-btn:focus {
    color: rgb(255, 0, 0);
    text-decoration: none;
    cursor: pointer;
}

.info-center a {
    background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: #fff; /* 白色文字 */
    border: none;
    border-radius: 4px; /* 圆角 */
    padding: 10px 30px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s; /* 添加过渡效果 */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    margin: 0 auto;
    text-decoration: none;
}
.info-center a:hover {
    background-color: #cdd1d6; /* 更深的蓝色 */
    transform: scale(1.05); /* 稍微放大 */
}
.info-center p{
    font-size: 14px;
    padding: 10px 70px;
    line-height: 32px;
    color: #666;
}

.loader {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 2s linear infinite;
    margin: 0 auto;
    border-top: red 3px solid;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.loading-main{
    display: none; 
    position: fixed; 
    top: 0; left: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0, 0, 0, 0.5); 
    justify-content: center; 
    align-items: center; 
    z-index: 1000;
}
.loading-tk{
    background-color: white; 
    padding: 20px; 
    border-radius: 15px; 
    text-align: center; 
    width: 320px;
    height: 460px;
    position: relative;
    border-top: red 3px solid;

}

.merge-ofd {
    border: 1px #ccc dashed;
    width: 60%;
    margin: 0 auto 20px auto;
    background: #F3F5F7;
    border-radius: 4px;
    font-size: 14px;
}
.merge-ofd span{
    margin-right: 10px;
}
.merge-ofd li{
    list-style: none;
    text-align: left;
    margin: 20px 0;
    justify-content: center;
    display: flex;
    align-items: center; 

}
#merge-mode{
    height: 42px;
    line-height: 42px;
    padding: 2px;
    width: 180px;
    border: #c1c1c1 1px solid;
    border-radius: 4px;
}

/* 模态框样式 */
.modal-dw {
    display: block;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.4);
}

.modal-content-dw {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 260px;
    height: 310px;
    border-radius: 4px;
    text-align: center;
}

.close-btn-dw {
    color: #aaa;
    float: right;
    font-size: 28px;
    margin-top: -14px;
}

.close-btn-dw:hover,
.close-btn-dw:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.download-btn-dw {
    display: inline-block;
    padding: 10px 20px;
    background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 10px 2px;
    cursor: pointer;
    border-radius: 4px;
}

.download-btn-dw:hover {
    background-color: #45a049;
}
.cgong-dw{
    margin-top: 48px;
    background: url(../images/danxuan.svg);
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 60px;
    text-align: center;
    padding-top: 80px;
    height: 31px;
}
/* 加载弹框样式 */
.loading-modal {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

.loading-content {
    background-color: white;
    padding: 80px;
    border-radius: 5px;
    text-align: center;
    width: 120px;
    height: 180px;
}

.wx_login_tx {position: relative;top: 0px;right: 0;padding: 10px;}
.wx_login_username{line-height:32px;border-bottom: 1px solid #f6f6f6;color: #707070;padding: 4px 16px 10px 16px}
.wx_xx_tx{position: absolute;left: 10px;top: 10px;margin-right: 10px}
.avatar {width: 42px;height: 42px;border-radius: 50%;cursor: pointer;position: relative;}
.dropdown {border-top: 3px solid;border-radius: 8px; font-size:14px;display: none;width: 210px;position: absolute;left: -150px;top: 52px;background-color: white;box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.2);z-index: 1;}
.dropdown-button {color: black;padding: 12px 16px;text-decoration: none;display: block;background-image: url(../images/down_icon.png);background-repeat: no-repeat;background-size: 14px;background-position: 180px 15px;}
.dropdown-button:hover {background-color: #f7f7f7;border-radius: 0px 0px 8px 8px;}
.avatar:hover + .dropdown,.dropdown:hover {display: block;}
.dropdown p{margin: 0;}


/*merge*/
.merge{ }
.pdf_file{ width: 190px; height: 310px; display: inline-block; position: relative;margin: 0 10px 30px 0;vertical-align: top}
.pdf_img{ width: 190px; height: 283px;box-shadow: 0px 0px 10px 0 rgb(55 99 170 / 10%); font-size: 0; line-height: 280px;background: #fff;}

.pdf_img img{width: 188px; vertical-align: middle;line-height: 280px;}


.pdf_file_water{ width: 460px;margin: auto;position: relative;}
.pdf_file_water img{width: 460px;box-shadow: 0px 0px 10px 0 rgb(55 99 170 / 10%); }


.pdf_fname{ height: 36px; line-height: 36px; width: 190px; overflow: hidden; color: #666; margin-top: 5px;}
.pdf_cz_q{  position:absolute; left: 0; top: 120px;z-index: 1;}
.pdf_cz_h{  position:absolute; right: 0; top: 120px;z-index: 1;}

.pdf_cz_q a{background:rgb(0 0 0 / 10%);width: 30px; height: 40px; display:block; border-radius: 0 20px 20px 0;cursor:hand}
.pdf_cz_q a:hover{background:rgb(255 0 0 / 80%);width: 30px; height: 40px; }


.pdf_cz_h a{background:rgb(0 0 0 / 10%);width: 30px; height: 40px; display:block;border-radius: 20px 0 0 20px ;cursor:hand}
.pdf_cz_h a:hover{background:rgb(255 0 0 / 80%);width: 30px; height: 40px; }

.pdf_cz_q img{ width: 14px; margin: 14px 0 0 5px;}
.pdf_cz_h img{ width: 14px; margin: 14px 0 0 10px;transform: scaleX(-1);}



.pdf_add{ border:red 1px solid; box-sizing: border-box; }
.pdf_cr_q{position:absolute; left: 0; top: 120px;z-index: 1;}
.pdf_cr_q a{background:rgb(0 0 0 / 10%);width: 30px; height: 40px; display:block; border-radius: 0 20px 20px 0;cursor:hand}
.pdf_cr_q a:hover{background:rgb(255 0 0 / 80%);width: 30px; height: 40px; }
.pdf_cr_q img{ width: 12px; margin: 14px 0 0 5px;transform: rotate(45deg);}


.pdf_cr_h{position:absolute; right: 0; top: 120px;z-index: 1;}
.pdf_cr_h a{background:rgb(0 0 0 / 10%);width: 30px; height: 40px; display:block;border-radius: 20px 0 0 20px ;cursor:hand}
.pdf_cr_h a:hover{background:rgb(255 0 0 / 80%);width: 30px; height: 40px; }
.pdf_cr_h img{ width: 12px; margin: 14px 0 0 10px;transform: rotate(45deg);}






.pdf_cz_s{ width: 20px; height: 20px; position: absolute; top: 14px; right: 14px;cursor:hand}
.pdf_cz_s img{ width: 20px; }

.pdf_caoz{ width: 190px; height: 268px; position: absolute;left: 0; top: 0;  display: none;}
.pdf_img:hover ~ .pdf_caoz{ display: block;z-index: 1;}

.pdf_page{position: absolute;bottom: 36px;right: 14px;font-size: 12px;color: #6e6e6e;}

.pdf_cz_xz{ width: 22px; height: 22px; position: absolute; top: 14px; right: 14px;}
.pdf_cz_xz img{ width: 10px; margin:0px 0 0  6px;}
.pdf_cz_xz a{ width: 22px; height: 22px; display: block; border-radius: 11px; background:#ccc url(../images/xuan.png) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_cz_xz a:hover{ background: red url(../images/xuan.png) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_cz_c a{background: red url(../images/xuan.png) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_cz_c a:hover{background: red url(../images/xuan.png) no-repeat; background-size: 12px; background-position: 5px;}


.page_tips { text-align: left; margin: 40px 0;}
.page_tips ul{ padding: 10px 40px;}
.page_tips li{list-style: none;}
.page_tips h3{font-size: 16px;}
.page_tips input{width: 100%;line-height: 46px;border: 1px solid #E0E0E0;border-radius: 4px;padding-left: 10px; background-color: #fafafa; font-size: 16px;} 
.page_tips p{ line-height: 24px; padding: 0;}

.page_bg{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);}

.pdf_dow{width: 100%; height: 100%; position: fixed;top: 0;left: 0;}
.pdf_dow li{list-style: none;}
.pdf_dow ul{ padding: 20px; text-align: center;position: fixed;top: 20%;left:calc(50% - 250px);width: 400px;height: 500px;background: #fff;box-shadow: 0px 0px 10px 0 rgb(55 99 170 / 10%);border-top: 4px solid red;border-radius: 8px;}

.pdf_dow_close{ position: absolute;top: 20px; right: 20px;}
.pdf_dow_close a{height: 24px; width: 24px; border-radius: 24px; background: #ccc url(../images/del.png) no-repeat; background-size: 42%; background-position: 7px; display: block;}
.pdf_dow_close a:hover{ background: red url(../images/del.png) no-repeat; background-size: 42%; background-position: 7px;  }

.select{width: 100%;height: 46px;border: 1px solid #ccc;border-radius: 4px;color: #666;padding-left: 8px;}
.pdf_dow_load{padding-top: 150px;}
.pdf_dow_action , .pdf_dow_fail , .pdf_dow_timeout , .pdf_dow_err_sq {padding-top: 68px;}

.page-down-btn{background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 10px 30px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    margin: 60px auto;
    text-decoration: none}
.page-down-btn a{text-decoration: none}

/*rotation*/
.pdf_rt_file{ width: 190px; height: 310px; display: inline-block; position: relative;margin: 0 10px 30px 0;vertical-align: top}
.pdf_rt_img{ width: 190px; height: 283px; font-size: 0; line-height: 280px; text-align: center;overflow: hidden;background: #ededed;}
.pdf_rt_img img{width: 130px; vertical-align: middle;line-height: 280px;}

.pdf_rt_xz{ width: 22px; height: 22px; position: absolute; top: 14px; right: 14px;}
.pdf_rt_xz img{ width: 10px; margin:0px 0 0  6px;}
.pdf_rt_xz a{ width: 22px; height: 22px; display: block; border-radius: 11px; background:#ccc url(../images/r-rt.svg) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_rt_xz a:hover{ background: red url(../images/r-rt.svg) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_rt_c a{background: red url(../images/r-rt.svg) no-repeat; background-size: 12px; background-position: 5px;}
.pdf_rt_c a:hover{background: red url(../images/r-rt.svg) no-repeat; background-size: 12px; background-position: 5px;}

.pdf_rt_90{transform: rotate(90deg); transition: transform 0.5s ease-in-out;}


.batch-file-up{
    position: absolute;
    top: 20px;
    right: 40px;
    width: 116px;
    height:40px;
    background-repeat: no-repeat;
    padding: 0;
    margin: 0;
}

.batch-file-upload-tips{
    text-align: center;
    background: url(../images/yingyong.png) no-repeat;
    background-size: 200px;
    background-position: center -30px;
    height: 200px;
}
.batch-file-upload-tips li{
    padding-top: 160px;
    display: block;
    color: #9db3d0;
    font-size: 15px;
}
/* 文件选择按钮样式优化 */
.batch-file-upload-btn {
    background: linear-gradient(98.29deg,#FF9784 0,#FF0000 100%);
    color: #fff; /* 白色文字 */
    border: none;
    border-radius: 4px; /* 圆角 */
    padding: 10px 30px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s; /* 添加过渡效果 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.batch-file-upload-btn:hover {
    background-color: #cdd1d6; /* 更深的蓝色 */
    transform: scale(1.05); /* 稍微放大 */
}

.batch-file-upload-btn img {
    width: 16px;
    margin-right: 8px;
}
.uploadfiles-fm{background: #fff;padding: 20px;border-radius: 4px;position: relative;margin-bottom: 12px;}
.uploadfiles{background: #fff;padding: 20px;border-radius: 4px;position: relative;}