.qf-nav-group{overflow:hidden;width:56px;height:76px;line-height:76px;font-size:14px;-webkit-transition:width .2s;transition:width .2s;cursor:pointer}.qf-nav-group .menu-popper{left:56px;padding-left:0;padding-right:0}.qf-nav-group .menu-popper .ul-item{list-style:none}.qf-nav-group .menu-popper .ul-title{padding-left:12px;color:#909399}.qf-nav-group .menu-popper .hover-item{color:#5c6073;padding-left:20px;height:36px;line-height:36px}.qf-nav-group .menu-popper .hover-item:hover{color:#000;background:#ebeef5;border-right:3px solid #fc3e4d}.qf-nav-group .nav-title{left:76px;top:0;position:absolute}.qf-nav-group .nav-btn{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;outline:0;padding-bottom:16px}.qf-nav-group .nav-btn .nav-icon{width:100%;line-height:32px;text-align:center}.qf-nav-group .nav-btn .nav-icon .bottom-name{position:absolute;bottom:9px;width:100%;text-align:center}.qf-nav-group .nav-btn .qf-icon{font-size:16px;line-height:32px;color:rgba(255,255,255,.5)}.qf-nav-group .nav-header-line{position:relative;height:55px}.qf-nav-group .nav-header-line::after{content:'';position:absolute;bottom:0;left:12px;right:8px}.qf-nav-group .nav-items{position:absolute;width:132px;top:0;left:56px;height:100%;overflow:hidden;cursor:default;background:#fff;color:#5c6073;list-style:none;margin:0;padding:0}.qf-nav-group .nav-items .group-title{height:36px;line-height:36px;padding-left:12px;font-size:14px;color:#909399}.qf-nav-group.is-fixed:hover,.qf-nav-group.is-selected>:not(ul),.qf-nav-group.is-selected>:not(ul) .qf-icon,.qf-nav-group>:not(ul):hover,.qf-nav-group>:not(ul):hover .qf-icon{color:#fff}.qf-nav-group:hover{background:rgba(255,255,255,.12)}.qf-nav-group.is-home{height:72px;line-height:72px}.qf-nav-group.is-fixed .nav-title{width:100%}.qf-nav-group.is-selected{background-color:#fe4352}.qf-nav-group .qf-nav-right-in-enter{-webkit-transform:translate(112,0);transform:translate(112,0)}.qf-nav-group .qf-nav-right-in-enter-active{-webkit-transition:.2s;transition:.2s}.qf-nav-group .qf-nav-select-out-leave-to{opacity:0}.qf-nav-group .qf-nav-select-out-leave-active{-webkit-transition:.2s;transition:.2s}.qf-nav-group .qf-nav-fixed-out-leave-to{-webkit-transform:translate(112,0);transform:translate(112,0)}.qf-nav-group .qf-nav-fixed-out-leave-active{-webkit-transition:.2s;transition:.2s}