.page-professional {
    padding: .59rem 0;
    background-color: #F8F8F8;
}

.page-professional .navigation {
    font-size: .3rem;
    color: #333333;
    line-height: .39rem;
    margin-bottom: .56rem;
}

.professional-warp {
    width: 100%;
    height: fit-content;
    background: #fff;
    border-radius: .07rem;
    padding: .31rem 0;
    display: flex;
}

.professional-warp .warp-left {
    width: 3.7rem;
    height: 100%;
}

.professional-warp .warp-left li{
    position: relative;
}

.professional-warp .warp-left li a {
    width: 100%;
    height: .96rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .33rem;
    line-height: .44rem;
    cursor: pointer;
}

.professional-warp .warp-left li.active {
    font-weight: bold;
    background: #EBF2FD;
    color: #0E77EE;
}

.professional-warp .warp-left li.active::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    width: .11rem;
    background: #0E77EE;
}

.item-content {
    flex: 1;
    height: fit-content;
    padding-right: .17rem;
}

.item-content .item-content-title {
    padding-bottom: .39rem;
    border-bottom: .02rem solid #E5E5E5;
}

.item-content .item-content-title h1 {
    font-size: .37rem;
    font-weight: bold;
    color: #333333;
    letter-spacing: .02rem;
    height: .74rem;
    line-height: .74rem;
    border-left: .07rem solid #0A75FF;
    padding-left: .22rem;
}

.item-content .warp-right{
    width: 100%;
    height: fit-content;
    padding-right: .35rem;
}

.item-content .warp-right li{
    width: 100%;
    cursor: pointer;
    height: 1.24rem;
    padding-left: .3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: .3rem;
    color: #333333;
    letter-spacing: .02rem;
    border-bottom: 1px dashed #DDE4EC;
}

.item-content .warp-right li:hover{
    color: #0A75FF !important;
}

.item-content .warp-right li .li-time{
    color: #999999;
}

.item-content .warp-right a:last-child{
    border: 0;
}

/* detials.html */
.professional-details-warp {
    width: 100%;
    height: fit-content;
    background: #fff;
    border-radius: .07rem;
    padding: .54rem 0 .87rem;
}

.professional-details-warp .details-title{
    width: 100%;
    text-align: center;
    padding-bottom: .37rem;
    border-bottom: .02rem solid #E5E5E5;
}

.professional-details-warp .details-title h1{
    font-size: .48rem;
    color: #424242;
    line-height: .48rem;
    font-weight: 400;
}

.professional-details-warp .detials-html{
    padding: .37rem .3rem 0;
}

.professional-details-warp .detials-html .release-time{
    font-size: .26rem;
    color: #666666;
    line-height: .26rem;
    text-align: center;
    margin-bottom: .37rem;
}

.list-page{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.11rem;
    margin-top: 1.2rem;
}

.list-page .page-item-num.active{
    border: 0.02rem solid #0099FF;
    color: #0A75FF;
}

.list-page .page-item-num{
    width: 0.52rem;
    height: 0.52rem;
    background: #FFFFFF;
    border-radius: 0.06rem;
    border: 0.02rem solid #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.22rem;
    color: #333333;
    line-height: 0.3rem;
}

.list-page .page-item-num-dtrs{
    width: 0.52rem;
    height: 0.52rem;
    color: #333333;
    font-size: 0.22rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-page .page-img{
    width: 0.52rem;
    height: 0.52rem;
    cursor: pointer;
}

.list-page .page-img:nth-child(1) img{
    transform: rotate(180deg);
}

.list-page .page-img img{
    width: 100%;
    height: 100%;
}