:root{--item-translateX:-100px}.boxButton+.circular,.boxButton+.circular+.fork,.boxButton,.box-item{position:absolute;top:200px;right:-20px}.boxButton{display:block;width:30px;height:30px;z-index:2;opacity:0;cursor:pointer}.boxButton+.circular{width:30px;height:30px;display:block;z-index:1;border-radius:50%;background-color:rgba(255,255,255,0.9);box-shadow:0 0 0 10px rgba(255,255,255,0.2);margin:10px;transition:all .5s;transform-origin:50% 50%}.boxButton:checked+.circular+.fork{width:30px;height:30px;display:block;z-index:1;border-radius:50%;background-color:rgba(255,255,255,0.9);box-shadow:0 0 0 10px rgba(255,255,255,0.2);margin:10px;transition:all .5s}.boxButton:checked+.circular+.fork::after,.boxButton:checked+.circular+.fork::before{content:"";width:30px;height:3px;display:block;z-index:1;border-radius:2.5px;transition:all .5s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.boxButton:checked+.circular+.fork{transform:rotate(360deg)}.boxButton:checked+.circular+.fork::after{transform:translate(-50%,-50%) rotate(45deg)}.boxButton:checked+.circular+.fork::before{transform:translate(-50%,-50%) rotate(-45deg)}.boxButton:checked+.circular{width:0;height:0;border:0;box-shadow:none}.boxButton:checked~ul .box-item{opacity:1}.box-item:nth-child(1){transform:rotate(90deg)}.box-item:nth-child(2){transform:rotate(45deg)}.box-item:nth-child(3){transform:rotate(0deg)}.box-item:nth-child(4){transform:rotate(315deg)}.box-item:nth-child(5){transform:rotate(270deg)}.box-item:nth-child(1) a{transform:rotate(0deg)}.box-item:nth-child(2) a{transform:rotate(-45deg)}.box-item:nth-child(3) a{transform:rotate(0deg)}.box-item:nth-child(4) a{transform:rotate(45deg)}.box-item:nth-child(5) a{transform:rotate(90deg)}.boxButton1:checked~ul .box-item:nth-child(1){transform:rotate(45deg) translateX(var(--item-translateX))}.boxButton1:checked~ul .box-item:nth-child(2){transform:rotate(0deg) translateX(var(--item-translateX))}.boxButton1:checked~ul .box-item:nth-child(3){transform:rotate(-45deg) translateX(var(--item-translateX))}.boxButton:checked~ul .box-item a{pointer-events:auto}.boxButton+.circular::before{top:10px}.boxButton+.circular::after{top:-10px}.box-item{display:block;width:60px;height:60px;opacity:0;transition:.5s}.box-item a{display:block;width:inherit;height:inherit;line-height:60px;color:rgba(255,255,255,0.65);background-color:rgba(0,0,0,.6);border-radius:50%;text-align:center;text-decoration:none;font-size:30px;pointer-events:none;transition:.2s}.touming{opacity:.2}.xuanfu{position:absolute}.boxButton2:checked~ul .box-item:nth-child(1){transform:rotate(135deg) translateX(var(--item-translateX))}.boxButton2:checked~ul .box-item:nth-child(2){transform:rotate(180deg) translateX(var(--item-translateX))}.boxButton2:checked~ul .box-item:nth-child(3){transform:rotate(225deg) translateX(var(--item-translateX))}.box-button1:checked~ul .box-item:nth-child(4){transform:rotate(315deg) translateX(var(--item-translateX))}.box-button1:checked~ul .box-item:nth-child(5){transform:rotate(270deg) translateX(var(--item-translateX))}.rotate_svg{transform:rotate(360deg)}
