.header-content{max-width: 1200px;margin:0px auto 0px;position: relative;}
.header-wapper-hide{width:100%;min-width:1200px;height:74px;position:relative;user-select:none;}

.header-wapper{width:100%;height:74px;background-color:#fff;padding:0px 60px 0px;min-width:1200px;box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 4px;position:fixed;top:0px;z-index:100;}
.header-wapper .header-logo{width:166px;height:100%;}

.header-wapper .header-menu{position: absolute;top:0px;left:218px;}
.header-wapper .header-menu li.parent-nav-item{cursor:pointer;display:inline-block;margin-left:26px;position: relative;height:100%;}
.header-wapper .header-menu li.parent-nav-item .parent-name{font-size:16px;color:var(--main-text-color);line-height: 74px;}
.header-wapper .header-menu li.parent-nav-item .parent-name:hover{color: var(--main-color);}
.header-wapper .header-menu li.parent-nav-item .use-nav{display: none;position:absolute;left:-40px;top:70px;border:1px solid #dddddd;border-radius: 20px;background-color: #fff; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);}
.header-wapper .header-menu li.parent-nav-item.MergePdfAndSlicePdf .use-nav{left:-10px;}
.header-wapper .header-menu li.parent-nav-item .use-nav .use-group{align-items: flex-start;margin: 0px 15px 0px;}
.use-group .use-group-name,.use-group ul{white-space: nowrap;}
.use-group .use-group-name{width:142px;margin:24px 0px 24px;text-indent: 30px;color:var(--main-color)}
.use-group ul li{width:142px;height:50px;line-height:50px;text-indent: 30px;color:#2c2c2c;margin:10px 0px 10px;border-radius:50px;}
.use-group ul li:hover{background-color:#ebf2fd;color:var(--main-color);}

.header-wapper .header-right{position:absolute;top:0px;right:0px;height:100%;}

.header-wapper .header-login{width:76px;height:74px;line-height:74px;}
.header-wapper .header-login-btn{display:inline-block;width:76px;height:36px;border-radius:50px;color:#fff;background-color: var(--main-color);line-height: 34px;letter-spacing: 2px;cursor: pointer;}
.header-wapper .header-login-btn:hover{background-color: var(--main-hover-color);transition: all 0.5s ease;}

.header-wapper .header-right .header-payvip{position:absolute;top:0px;right:74px;height:100%;line-height:74px;cursor: pointer;}
.header-wapper .header-right .header-payvip-icon{width:140px;height:36px;line-height:36px;background-color: #f5cc87;color:#7a330d;border-radius:20px;letter-spacing: 1px;}

.header-wapper .header-right .header-face{position:absolute;top:0px;right:0px;width:74px;height:100%;}
.header-wapper .header-right .header-face .face-image{position:absolute;right:0px;width:36px;height:100%;cursor:pointer;}
.header-wapper .header-right .header-face .face-image img{width:36px;height:36px;border-radius: 50%;position: absolute;top:50%;margin-top: -18px;right:0px;border: 1px solid #EBEBEB;}
.header-wapper .header-right .header-face .face-image .header-userface-menu{display:none;width:222px;position:absolute;right:-8px;top:74px;border-radius:20px;overflow:hidden;box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);background-color:#fff;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo{width:100%;height:114px;background-color:#0266ff;position: relative;}

.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-left{width:60px;height:100%;position:absolute;top:0px;left:0px;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-left img{display:block;width:48px;height:48px;border-radius:50%;position:absolute;top:50%;margin-top:-24px;right:0px;}

.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right{width:150px;height:100%;position:absolute;top:0px;right:0px;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info{width:100%;height:68px;margin-top:15px;line-height:20px;position: relative;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .nickname-and-userid{color:#fff;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .nickname-and-userid .line-item{position:relative;top:0px;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .nickname-and-userid .nickname{max-width:60px;}

.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .vip-action{display: flex;align-items:flex-start;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .active-vip{color:#f5cc87;border:1px solid #f5cc87;padding:0px 4px 0px;border-radius:20px;max-width:100px;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .upvip{position:relative;width:52px;height:22px;line-height:22px;background-color: #f5cc87;border-radius: 20px;margin-left:10px;color:#7a330d;}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .vip-times{margin-top:4px;color:#f5cc87}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .vipinfo-text-info .vip-endtime{color:#fff;}

.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .normal-user{color:#699ff2}
.header-wapper .header-right .header-face .face-image .header-userface-menu .userface-vipinfo-right .pay-vip{color:#7a330d;background-color: #f5cc87;width:80px;height:20px;line-height: 20px;border-radius: 20px;margin-top:6px;}

.header-wapper .header-right .header-face .face-image .header-userface-menu .menu-list-item{text-indent: 36px;width:100%;height:48px;line-height:48px;font-size: 14px;display: inline-block;color: var(--main-text-color);}
.header-wapper .header-right .header-face .face-image .header-userface-menu .menu-list-item:hover{background-color: #ebf2fd;color: var(--main-color);}

.menu-icon-transform-180{
    transform:rotate(180deg);
    -ms-transform:rotate(180deg);/* IE9 */
    -moz-transform:rotate(180deg);/* Firefox */
    -webkit-transform:rotate(180deg);/* Safari和Chrome */
    -o-transform:rotate(180deg);/* Opera */
    transition:all 0.2s ease-in-out;
    -moz-transition:all 0.2s ease-in-out;/*Firefox 4 */
    -webkit-transition:all 0.2s ease-in-out;/* Safari和Chrome */
    -o-transition:all 0.2s ease-in-out;/* Opera */
}

.menu-icon-transform-0{
    transform:rotate(0deg);
    -ms-transform:rotate(0deg);/* IE9 */
    -moz-transform:rotate(0deg);/* Firefox */
    -webkit-transform:rotate(0deg);/* Safari和Chrome */
    -o-transform:rotate(0deg);/* Opera */
    transition:all 0.2s ease-in-out;
    -moz-transition:all 0.2s ease-in-out;/*Firefox 4 */
    -webkit-transition:all 0.2s ease-in-out;/* Safari和Chrome */
    -o-transition:all 0.2s ease-in-out;/* Opera */
}
