body{
    background-color: rgba(243, 246, 250 1);
}
.pageContainer{
    max-width: 19.2rem;
    margin: 0 auto;
}
.pageMain{
    display: flex;
}
.navContainer{
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    bottom: 0;
    height: 100vh;
    background-color: #E8EEF6;
    width: 3.4rem;
    padding-top: 1.8rem;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; 
    box-sizing: border-box;
   
}
.navItem{
    padding-left: .24rem;
    cursor: pointer;
    margin-bottom: .12rem;
}
.navItem .navItemFlex{
    display: flex;
    align-items: center;
    height: .6rem;
}
.navItem .navItemFlex img{
    width: .44rem;
}

.navItem .navItemFlex .navTitle{
    font-weight: 400;
    color: #434343;
    font-size: .18rem;
    padding-left: .08rem;
}
.sunNavBox{
    margin-left: .44rem;
    padding-right: .22rem;
}
.sunNavItem{
    height: .5rem;
    display: flex;
    align-items: center;
    padding-left: .08rem;
    color: #434343;
    border-radius: .04rem;
}
.sunNavItem .sunNavTitle{
    font-weight: 400;
    font-size: .18rem;
}

.sunNavItem.active{
    color: #fff;
    background-color: rgba(79, 73, 222, 1);
}