.font-tool{width:100%;height:100%;position:relative;display:flex;flex-wrap:wrap;-moz-column-gap:8px;column-gap:8px;justify-content:space-between;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.font-tool .font-selecter{float:left;position:relative;width:130px;height:28px;border-radius:3px;box-sizing:border-box;background-color:var(--bg-color-tertiary);margin-right:6px}.font-tool .font-selecter .font-name{height:24px;text-indent:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:22px;cursor:pointer;padding-right:20px}.font-tool .font-selecter .font-list{background-color:var(--bg-color-tertiary);box-shadow:var(--box-shadow-color-box);height:400px;overflow:auto}.font-tool .font-selecter .font-list li{list-style:none;padding:5px 0;padding-left:10px;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.font-tool .font-selecter .font-list li:hover{background-color:var(--bg-color-font-list-item-hover)}.font-tool .font-selecter .down-arrow{position:absolute;right:8px;top:11px;width:8px;height:4px;color:var(--svg-color-primary)}.font-tool .font-selecter .down-arrow:hover{cursor:pointer}.font-tool .font-btn{float:left;position:relative;width:24px;height:24px;margin-left:12px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:6px}.font-tool .font-btn .item-arrow{position:absolute;left:0;top:0;width:22px;height:22px}.font-tool .font-btn .item-icon{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px;color:var(--svg-color-primary-secondary)}.font-tool .font-btn .item-icon.noteImageInsIcon{color:var(--svg-color-primary-secondary);fill:var(--svg-color-gray-75-secondary)}.font-tool .font-btn .item-color{position:absolute;left:-6px;bottom:1px;width:16px;height:3px;border-radius:2px}.font-tool .font-btn.active{background-color:var(--select-color-common-6)}.font-tool .font-btn:hover:not(.active){background-color:var(--hover-color-common)}.font-tool .font-btn .font-btn-arrow{position:absolute;right:0;bottom:0}.font-tool .font-btn .aroundbox-list{width:167px;height:180px;padding:8px 10px;margin-top:13px;background-color:var(--bg-color-tertiary);border-radius:5px;box-shadow:var(--box-shadow-color-box);box-sizing:border-box;z-index:1}.font-tool .font-btn .aroundbox-list .aroundbox-li{float:left;list-style:none;width:33px;height:33px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;margin-right:5px}.font-tool .font-btn .aroundbox-list .aroundbox-li:nth-child(4n){margin-right:0}.font-tool .font-btn .aroundbox-list .aroundbox-li:not(.ban-btn):hover{background-color:#ddd}.font-tool .font-btn .aroundbox-list .aroundbox-li .item-icon{margin:3px;width:27px;height:27px}.font-tool .font-btn .aroundbox-list .roundbox-clean{float:left;width:100%;height:24px;line-height:24px;margin-top:10px;border-top:1px solid #ddd;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.font-tool .font-btn .aroundbox-list .roundbox-clean:not(.ban-btn)hover{background-color:#ddd}.font-tool .font-btn .aroundbox-list .ban-btn{opacity:.2;cursor:not-allowed}.font-tool .down-arrow-container{display:inline-block;position:absolute;right:0;width:16px;height:26px;border-left:1px solid #fff}.font-tool .down-arrow-container:hover{border-left-color:#4c4c4c}.font-tool .down-arrow-container svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px}.font-tool .menu-item:hover{background-color:#96bef8}.font-tool .activedBtn{background-color:#d2d0ce}.font-tool .activedDrop{background-color:#c4c4c4!important}.font-tool .switchBtn{width:25px;height:25px;margin:0 4px}.font-tool .switchBtn .item-icon{width:20px;height:20px}.font-tool .switchBtn .item-icon,.font-tool .switchBtn>img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.font-tool .switchBtn:hover:not(.active){background-color:var(--hover-color-common)}.font-tool .drop-btn{width:32px;height:24px;border-radius:6px;position:relative}.font-tool .drop-btn .drop-mask{width:100%;height:100%}.font-tool .drop-btn .drop-div{margin-top:5px;margin-left:5px;width:18px;height:14px}.font-tool .drop-btn>.item-icon{width:20px;height:20px;position:absolute;top:50%;left:50%;transform:translate(-70%,-50%);color:var(--svg-color-primary-secondary)}.font-tool .drop-btn .item-color{position:absolute;left:7px;bottom:4px;width:18px;height:3px}.font-tool .drop-btn>img{position:absolute;top:50%;left:50%;transform:translate(-70%,-50%)}.font-tool .drop-btn>svg{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(100%,-50%)}.font-tool .drop-btn .simpledrop-def-svg{width:8px;height:4px;color:var(--svg-color-primary)}.font-tool .drop-btn:hover:not(.active){background-color:var(--hover-color-common)}.font-tool .drop-btn .drop-TP{width:50px;height:50px}.font-tool .drop-btn .drop-TP>img{width:100%;height:100%}.font-tool .drop-btn .drop-TP>img:hover{background-color:#e5e5e5}.font-tool .drop-btn .drop-TPContainer{position:fixed;display:flex;flex-wrap:wrap;right:0;background-color:#fff;border:1px solid #bcbcbc;width:202px;height:202px}.font-tool .drop-btn .drop-AL{width:50px;height:50px;position:relative}.font-tool .drop-btn .drop-AL:hover{background-color:#e5e5e5}.font-tool .drop-btn .drop-AL>img{position:absolute;width:80%;height:80%;top:50%;left:50%;transform:translate(-50%,-50%)}.font-tool .drop-btn .drop-ALContainer{width:120px;padding:8px 10px;margin-top:3px;background-color:var(--bg-color-tertiary);border-radius:5px;box-shadow:var(--box-shadow-color-box);box-sizing:border-box;z-index:1;overflow:hidden}.font-tool .drop-btn .drop-ALContainer .imgbox-li{float:left;list-style:none;width:30px;height:30px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;margin-right:5px;position:relative}.font-tool .drop-btn .drop-ALContainer .imgbox-li:nth-child(3n){margin-right:0}.font-tool .drop-btn .drop-ALContainer .imgbox-li:hover{background-color:var(--hover-color-common)}.font-tool .drop-btn .drop-ALContainer .imgbox-li .item-icon{width:30px;height:30px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--svg-color-gray-42-secondary)}.font-tool .drop-btn .drop-BT{width:50px;height:50px;position:relative}.font-tool .drop-btn .drop-BT:hover{background-color:#e5e5e5}.font-tool .drop-btn .drop-BT>img{position:absolute;width:80%;height:80%;top:50%;left:50%;transform:translate(-50%,-50%)}.font-tool .drop-btn .drop-BTContainer{position:fixed;box-shadow:var(--box-shadow-color-box);z-index:1;border-radius:6px}@media screen and (max-width:878px){.font-tool .drop-btn .drop-BTContainer{right:0}}.font-tool .drop-btn .drop-BTContainer .liststylemodal{border-radius:6px}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul{padding:16px;width:168px;height:168px;background:var(--bg-color-tertiary);border-radius:6px;box-shadow:var(--box-shadow-color-expand-drop);list-style:none;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li{width:40px;height:40px;position:relative}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li.active,.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li:hover{background-color:transparent}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li.active .border{border:2px solid var(--themeColor)}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li .border{width:40px;height:40px;position:absolute;top:0;left:0;border-radius:6px;border:1px solid var(--border-color-box-8)}.font-tool .drop-btn .drop-BTContainer .liststylemodal ul li .item-icon{width:40px;height:40px}.font-tool .drop-btn .drop-LS{width:100px;height:24px;line-height:24px;position:relative;text-indent:20px}.font-tool .drop-btn .drop-LS:hover{background-color:#e5e5e5}.font-tool .drop-btn .activedLS:before{content:"\2713";position:absolute;left:8px;text-indent:0}.font-tool .drop-btn .drop-LSContainer{position:fixed;background-color:#fff;border:1px solid #bcbcbc;width:100px;height:146px}.font-tool .note-font-family,.font-tool .note-font-family .font-family-menu{width:150px!important}.font-tool .note-font-size,.font-tool .note-font-size .font-size-menu{width:80px!important}.font-tool .font-family{display:inline-block;position:relative;width:185px;height:28px;border:1px solid #bebebe;border-radius:3px;border-top-right-radius:0;border-bottom-right-radius:0}.font-tool .font-family:hover{border-color:#4c4c4c}.font-tool .font-family .font-family-title{display:flex;height:25px}.font-tool .font-family .font-family-input{border:none;outline:none;width:100%;margin:2px}.font-tool .font-family .font-family-menu{overflow-y:scroll;overflow-x:hidden;width:185px;height:240px;position:fixed;z-index:101;background-color:#fff;border:1px solid #828790}.font-tool .font-size{display:inline-block;position:relative;border:1px solid #bebebe;border-left:none;border-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0;width:65px;height:28px}.font-tool .font-size:hover{border-color:#4c4c4c}.font-tool .font-size .font-size-title{display:flex;height:25px}.font-tool .font-size .font-size-input{border:none;outline:none;width:27px;margin:2px}.font-tool .font-size .font-size-menu{overflow-y:scroll;overflow-x:hidden;width:65px;height:120px;position:fixed;z-index:101;background-color:#fff;border:1px solid #828790}.font-tool .ivu-tooltip-rel{display:block}.font-tool .separate-line{width:1px;height:16px;margin:4px 0;background-color:#aaa}.floatbox-split-line{width:100%;height:1px;background:var(--bg-color-floatbox-split-line);margin:16px 0}.floatbox-main-title{font-weight:700;margin-bottom:12px}.floatbox-main-title,.floatbox-sub-title{font-size:12px;line-height:16px;color:var(--text-color-primary)}.position-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.position-bottom{position:absolute;bottom:0}.flex-center{display:flex;align-items:center;justify-content:space-around}.ed-load-loop{animation:ani-load-loop 1s linear infinite}.note-dialog{width:640px}.note-dialog .dialog-slot{padding-top:10px}.note-dialog .edit-tool{margin-bottom:16px;display:flex;align-items:center}.note-dialog .edit-tool .note-reun{margin-right:2px;display:flex;-moz-column-gap:8px;column-gap:8px}.note-dialog .edit-tool .note-reun .disabled{opacity:.2!important;pointer-events:none;cursor:no-drop!important}.note-dialog .edit-tool .note-reun>div{width:24px;height:24px;border-radius:4px;position:relative}.note-dialog .edit-tool .note-reun>div .item-icon{width:20px;height:20px;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--svg-color-42-secondary)}.note-dialog .edit-tool .note-reun>div:hover{background-color:#eee}.note-dialog .edit-tool .note-reun>div>img{-webkit-user-select:none;-moz-user-select:none;user-select:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.note-dialog .edit-tool .activeBtn:hover{background-color:#e5e5e5}.note-dialog .edit-tool .down-arrow{width:8px}.note-dialog .edit-div{padding:10px;margin-bottom:23px;height:278px;outline:none;border:1px solid var(--border-color-box-6);overflow-y:auto;border-radius:6px}.note-dialog .dialog-enter{margin-top:12px;height:40px;position:relative}.note-dialog .dialog-enter .dialog-op{position:absolute;width:78px;height:29px;border:1px solid #e5e5e5;border-radius:3px;text-align:center;line-height:28px;cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none}.note-dialog .dialog-enter .dialog-op:hover{background-color:#e5e5e5}.note-dialog .dialog-enter .dialog-ok{right:100px}.note-dialog .dialog-enter .dialog-cancel{right:15px}@media screen and (max-height:768px){.note-dialog .dialog-slot{overflow-y:inherit}}.note-dialog .font-selecter{height:24px}.note-dialog .font-btn{margin-left:0!important}.note-dialog .font-btn .item-color{left:6px!important}.note-dialog .font-name{border:1px solid var(--border-color-box-6);border-radius:6px}