.demo[data-v-1b507215]{display:flex;width:100vw;height:100vh;align-items:center;justify-content:center;background:linear-gradient(to top right,#ecbd72,#c97c53)}.demo .content[data-v-1b507215]{display:flex;width:8rem;height:8rem;background-color:#fff;box-shadow:0 .10667rem .21333rem rgba(0,0,0,.3);border-radius:.4rem;overflow:hidden}.demo .side[data-v-1b507215]{display:flex;flex:1;flex-direction:column}.demo .side[data-v-1b507215]:first-child{flex:2;justify-content:center;align-items:center;text-align:center}.demo .side .avatar[data-v-1b507215]{display:flex;position:relative;margin-bottom:.4rem;width:2.13333rem;height:2.13333rem;align-items:center;justify-content:center}.demo .side .avatar[data-v-1b507215]:after,.demo .side .avatar[data-v-1b507215]:before{position:absolute;display:block;content:"";top:0;left:0;width:2.13333rem;height:2.13333rem;border-width:.02667rem;border-style:solid;border-color:transparent #786450 #786450 #786450;border-radius:50%;transition:transform 1s cubic-bezier(.78,.17,.24,1.08)}.demo .side .avatar[data-v-1b507215]:after{width:1.92rem;height:1.92rem;top:.10667rem;left:.10667rem;border-width:.02667rem;border-style:solid;border-color:#786450 #786450 transparent #786450;transition-duration:.4s;transition-delay:.2s}.demo .side .avatar[data-v-1b507215]:hover:after,.demo .side .avatar[data-v-1b507215]:hover:before{transform:rotate(1turn);transition:transform 1s cubic-bezier(.78,.17,.24,1.08)}.demo .side .avatar[data-v-1b507215]:hover:after{transform:rotate(-1turn);transition-duration:.4s;transition-delay:.2s}.demo .side .avatar img[data-v-1b507215]{display:block;width:1.70667rem;height:1.70667rem;margin:auto;border-radius:50%;overflow:hidden}.demo .side .info[data-v-1b507215]{margin-bottom:1.6rem;font-size:.42667rem;color:#786450}.demo .side .info small[data-v-1b507215]{display:block}.demo .side .btn[data-v-1b507215]{margin-bottom:.4rem;width:45%;height:.8rem;line-height:.8rem;color:#786450;border:.02667rem solid #786450;transition:background-color .25s linear;border-radius:.53333rem;font-size:.37333rem}.demo .side .btn[data-v-1b507215]:hover{background-color:#786450;transition:background-color .25s linear;color:#fff}.demo .side .child[data-v-1b507215]{flex:1;display:flex;align-items:center;justify-content:center;font-weight:600;text-align:center;background-color:#f5e8e0;font-size:.42667rem;border-bottom:.02667rem solid #fff;transition:background-color .25s linear;cursor:pointer}.demo .side .child[data-v-1b507215]:hover{background-color:#e1cfc3;transition:background-color .25s linear}.demo .side .child[data-v-1b507215]:last-child{border-bottom:none}.demo .side .child span[data-v-1b507215]{display:block;font-weight:400;font-size:.37333rem}