.circle-module{align-items:flex-start;display:flex;gap:40px}.circle-area{background:#fff;border-radius:50%;flex-shrink:0;height:300px;position:relative;width:300px}.circle-area:before{background:radial-gradient(circle at center,transparent 5%,transparent 15%,#cfd5cc 0,#cfd5cc 15.5%,transparent 0,transparent 25%,#cfd5cc 0,#cfd5cc 25.5%,transparent 0,transparent 35%,#cfd5cc 0,#cfd5cc 35.5%,transparent 0,transparent 45%,#cfd5cc 0,#cfd5cc 45.5%,transparent 0,transparent 55%,#cfd5cc 0,#cfd5cc 55.5%,transparent 0);inset:0}.circle-area:after,.circle-area:before{border-radius:50%;content:"";position:absolute;z-index:0}.circle-area:after{background:radial-gradient(circle,rgba(212,255,115,.5) 0,rgba(198,255,90,.2) 60%,transparent 100%);height:60px;left:50%;pointer-events:none;top:50%;transform:translate(-50%,-50%);width:60px}.circle-dot{align-items:center;background:#4d4784;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:12px;font-weight:700;height:20px;justify-content:center;position:absolute;transition:transform .2s,background .2s;width:20px;z-index:1}.circle-dot.active{background:#000;transform:scale(1.3)}.circle-dot[data-index="0"]{left:34%;top:34%}.circle-dot[data-index="1"]{left:64%;top:44%}.circle-dot[data-index="2"]{left:30%;top:65%}.circle-dot[data-index="3"]{left:58%;top:25%}.circle-dot[data-index="4"]{left:76%;top:58%}.circle-dot[data-index="5"]{left:15%;top:41%}.circle-dot[data-index="6"]{left:47%;top:8%}.content-area{flex:1}.content-block{cursor:pointer;display:flex;margin-bottom:30px;opacity:.3;transition:opacity .2s}.content-block.active{opacity:1}.content-title{font-size:24px}.number-circle{background:#3f3d56;border-radius:50%;color:#fff;display:inline-block;font-size:14px;height:24px;line-height:24px;margin-right:10px;margin-top:5px;min-width:24px;text-align:center}@media (max-width:768px){.circle-module{flex-direction:column}.circle-area{margin-left:auto;margin-right:auto}}