@charset "utf-8";
/**
 * @version:               1.0.0
 * @createTime:            2021.11.23
 * @updateTime:            2021.11.23
 * @author:                zhangju
 * @description
 ***/

.fd-box-main {
    display: flex;
    align-items: center;
}

/* **************************************** 左侧菜单 start **************************************** */

.fd-box-main .fd-menu-list {
    position: relative;
    width: 218px;
    height: 100%;
    border-top: 1px solid #e2e4e6;
    border-right: 1px solid #e2e4e6;
    overflow-y: auto;
    overflow-x: hidden;
}

.fd-box-main .fd-menu-list::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
    background: linear-gradient(to left, rgba(0, 83, 180, 0.03), rgba(0, 83, 180, 0));
}

.fd-menu-item {
    padding: 8px;
    height: 48px;
}

.fd-sub-menu {
    padding: 0 8px;
}

.fd-sub-menu > .fd-menu-title,
.fd-menu-item > .fd-menu-title {
    display: block;
    padding-left: 24px;
    height: 32px;
    font-size: 16px;
    color: #333;
    line-height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    background: url("../images/icons/icon31.png") no-repeat left center;
}

.fd-sub-menu > .fd-menu-title:hover,
.fd-menu-item > .fd-menu-title:hover {
    color: #0053b4;
}

.fd-sub-menu.active > .fd-menu-title,
.fd-menu-item.active > .fd-menu-title {
    color: #0053b4;
    font-weight: bold;
    background: url("../images/icons/icon32.png") no-repeat left center;
}

.fd-sub-menu > .fd-menu-title {
    position: relative;
    display: block;
    padding: 8px 16px 8px 24px;
    height: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fd-sub-menu > .fd-menu-title::after {
    content: "";
    position: absolute;
    right: 4px;
    top: 20px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #a2a2a2;
    border-right: 1px solid #a2a2a2;
    transform: rotate(135deg);
}

.fd-sub-menu.open > .fd-menu-title::after {
    top: 22px;
    transform: rotate(-45deg);
}

.fd-sub-menu.active > .fd-menu-title::after {
   border-color: #0053b4
}


.fd-sub-menu-list {
    display: block;
    padding: 8px;
    width: 100%;
    background: #f2f5fa;
}

.fd-sub-menu-box {
    display: none;
    padding: 0 8px;
}

.fd-sub-menu.open + .fd-sub-menu-box {
    display: block;
}

.fd-sub-menu-item {
    padding: 4px 8px 4px 16px;
    cursor: pointer;
    border-radius: 2px;
}

.fd-sub-menu-item .fd-menu-title {
    display: block;
    line-height: 24px;
    font-size: 14px;
    color: #5f5f5f;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}

.fd-sub-menu-item:hover .fd-menu-title {
    color: #0053b4;
}

.fd-sub-menu-item.active {
    background: #0053b4;
}

.fd-sub-menu-item.active .fd-menu-title {
    color: #fff;
}

/* **************************************** 左侧菜单 end **************************************** */

/* **************************************** 右侧列表 end **************************************** */

.fd-box-main .fd-right-list {
    position: relative;
    padding-bottom: 64px;
    width: calc(100% - 218px);
    height: 100%;
}

.fd-list01 {
    padding: 0 20px;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.fd-list01 .fd-list-item01 {
    margin: 0;
    height: 56px;
    border-bottom: 1px dotted rgba(196, 200, 209, 0.5);
}

.fd-list01 .fd-list-item01 a {
    padding: 16px 180px 17px 0;
    height: 100%;
}

.fd-list01 .fd-list-item01 .fd-span-date {
    position: absolute;
    top: 16px;
    right: 0;
    width: 180px;
    font-size: 16px;
    color: #b3b4b8;
    text-align: right;
}

.fd-pagination {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 0 20px;
    width: 100%;
    height: 56px;
    text-align: right;
    line-height: 56px;
    background: #fff;
    z-index: 1;
}

.fd-pagination .fd-page-total {
    float: left;
    line-height: 56px;
    font-size: 14px;
    color: #333333;
}

.fd-pagination .fd-page-total em {
    font-size: 14px;
    color: #b92823;
    font-weight: bold;
    font-style: normal;
}

.fd-pagination .turn_page p a {
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    color: #333333;
    text-align: center;
    border-radius: 2px;
    text-decoration: none;
}

.fd-pagination .turn_page p a.point {
    pointer-events: none;
}

.fd-pagination .turn_page p a:hover {
    color: #0053b4;
}

.fd-pagination .turn_page p a.on {
    color: #fff;
    background: #0053b4;
}

.fd-pagination .turn_page p a.sp_pre,
.fd-pagination .turn_page p a.sp_next {
    position: relative;
    border: 1px solid #b3c0cc;
}

.fd-pagination .turn_page p a.sp_pre::before {
    content: "";
    position: absolute;
    right: 4px;
    top: 5px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #b3c0cc;
    border-left: 1px solid #b3c0cc;
    transform: rotate(-45deg);
}

.fd-pagination .turn_page p a.sp_next::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 5px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #b3c0cc;
    border-right: 1px solid #b3c0cc;
    transform: rotate(45deg);
}

/* **************************************** 右侧列表 end **************************************** */