.flex-brand{display:flex;align-items:center;justify-content:center;box-sizing:border-box}svg:not(:root){overflow:unset!important}*{margin:0;padding:0;border:0;outline:none;font-family:Poppins,sans-serif}*,:after,:before{box-sizing:border-box}.clearfix:after,.clearfix:before{content:" ";display:table}.clearfix:after{clear:both}body{font-family:Microsoft YaHei,Segoe UI,Lucida Grande,Helvetica,Arial,sans-serif}.main{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;transform:scale(1.2)}.navigation-circle{display:block;position:relative;height:320px;width:320px;margin-right:200px}.navigation-circle__inner{display:block;position:relative;height:100%;width:100%}.navigation-circle__list{height:320px;width:320px;margin:0;padding:0;animation:1 animate-in-list 2.2s cubic-bezier(.25,-.25,.35,1) 0 forwards}.navigation-circle-svg,.navigation-circle__list{display:block;position:absolute;transform:rotate(-90deg)}.navigation-circle-svg{top:0;right:0;bottom:0;left:0}.navigation-circle-svg--opaque{opacity:.5}.navigation-circle-svg--mask circle{transition:all .5s ease;transition-delay:.5s;animation:animate-in-svg-circle-mask 2.2s ease .1 backwards}.navigation-circle-list-item{display:block;position:absolute;height:0;width:calc(50% + 16px);top:50%;left:50%;list-style:none;transform-origin:0 0}.navigation-circle-list-item__point{display:block;position:absolute;height:32px;width:32px;top:-16px;right:2px;cursor:pointer;transform:scale(0)}.navigation-circle-list-item__point:before{content:"•";display:block;position:absolute;height:32px;width:32px;top:0;color:#5998ff;background-color:#5998ff;font-size:12px;font-weight:400;line-height:32px;text-align:center;border:2px solid #5998ff;border-radius:50%;box-shadow:inset 0 0 0 0 #5998ff;transform:scale(.75);transition:all .5s ease}.navigation-circle-list-item__point:after{content:"";display:block;position:absolute;height:1px;width:0;top:16px;left:31px;background-color:#5998ff;transition:all .5s ease}.navigation-circle-list-item__meta{display:block;position:absolute;overflow:hidden;opacity:0;transform-origin:center;margin-left:40px;min-width:160px;padding:4px}.navigation-circle-list-item__title{display:block;color:#f7f7f7;text-align:left;font-size:20px;border-bottom:1px solid #ccc;padding-bottom:4px;margin-bottom:6px}.navigation-circle-list-item__subtitle{display:block;color:#f7f7f7;text-align:center;font-weight:200;font-size:12px}.navigation-circle-list-item{margin:0;padding:0}.navigation-circle-list-item:first-of-type{transform:rotate(51.4285714286deg)}.navigation-circle-list-item:first-of-type .navigation-circle-list-item__meta{transform:rotate(38deg) translateY(-14px)}.navigation-circle-list-item:first-of-type .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) 0s 1 forwards}.navigation-circle-list-item:nth-of-type(2){transform:rotate(102.8571428571deg)}.navigation-circle-list-item:nth-of-type(2) .navigation-circle-list-item__meta{transform:rotate(-12deg) translateY(10px)}.navigation-circle-list-item:nth-of-type(2) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) .2s 1 forwards}.navigation-circle-list-item:nth-of-type(3){transform:rotate(154.2857142857deg)}.navigation-circle-list-item:nth-of-type(3) .navigation-circle-list-item__meta{transform:rotate(-64deg) translateY(-20px)}.navigation-circle-list-item:nth-of-type(3) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) .4s 1 forwards}.navigation-circle-list-item:nth-of-type(4){transform:rotate(205.7142857143deg)}.navigation-circle-list-item:nth-of-type(4) .navigation-circle-list-item__meta{transform:rotate(-116deg)}.navigation-circle-list-item:nth-of-type(4) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) .6s 1 forwards}.navigation-circle-list-item:nth-of-type(5){transform:rotate(257.1428571429deg)}.navigation-circle-list-item:nth-of-type(5) .navigation-circle-list-item__meta{transform:rotate(-167deg)}.navigation-circle-list-item:nth-of-type(5) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) .8s 1 forwards}.navigation-circle-list-item:nth-of-type(6){transform:rotate(308.5714285714deg)}.navigation-circle-list-item:nth-of-type(6) .navigation-circle-list-item__meta{transform:rotate(-219deg) translateY(20px)}.navigation-circle-list-item:nth-of-type(6) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) 1s 1 forwards}.navigation-circle-list-item:nth-of-type(7){transform:rotate(1turn)}.navigation-circle-list-item:nth-of-type(7) .navigation-circle-list-item__meta{transform:rotate(-270deg) translateY(20px)}.navigation-circle-list-item:nth-of-type(7) .navigation-circle-list-item__point{animation:animate-in-list-item-point 1s cubic-bezier(.55,-.3,.6,1.5) 1s 1 forwards}.navigation-circle-list-item:hover .navigation-circle-list-item__point:before{transform:scale(1);font-size:16px}.navigation-circle-list-item:hover .navigation-circle-list-item__point:after{width:32px;left:34px}.navigation-circle-list-item:hover .navigation-circle-list-item__meta{opacity:1}.navigation-circle-list-item.active .navigation-circle-list-item__point:before,.navigation-circle-list-item:active .navigation-circle-list-item__point:before{transform:scale(.85);color:#8ec1ff;box-shadow:inset 0 0 0 16px #8ec1ff;border-color:transparent}.navigation-circle-list-item.active .navigation-circle-list-item__point:after,.navigation-circle-list-item:active .navigation-circle-list-item__point:after{width:34px;left:32px}.navigation-circle-list-item.active .navigation-circle-list-item__meta,.navigation-circle-list-item:active .navigation-circle-list-item__meta{opacity:1}@keyframes animate-in-list{0%{transform:rotate(-540deg)}to{transform:rotate(-90deg)}}@keyframes animate-in-svg-circle-mask{0%{stroke-dashoffset:1005}to{stroke-dashoffset:0}}@keyframes animate-in-list-item-point{0%{transform:scale(0)}to{transform:scale(1)}}.fade-enter-active,.fade-leave-active{transition:opacity .2s ease}.fade-enter-from,.fade-leave-to{opacity:0}