.earth {
    --w: 100%;
    --space: calc(20 * var(--rpx));
    --border-l-w: calc(var(--w) - clamp(var(--space), 4.1666666vw, calc(80 * var(--rpx))));
    --border-ll-w: calc(var(--border-l-w) - clamp(var(--space), 3.54166vw, calc(68 * var(--rpx))));
    --border-lll-w: calc(var(--border-ll-w) - clamp(var(--space), 3.5416vw, calc(68 * var(--rpx))));
    --earth-w: calc(var(--border-lll-w) - clamp(var(--space), 5.208333vw, calc(100 * var(--rpx))));
    width: 50%;
    aspect-ratio: 1 / 1;;
    position: relative;
    margin-top: calc(-1 * clamp(var(--space), 4.1666666vw, calc(80 * var(--rpx))));
}

.earth-box {
    width: var(--earth-w);
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.earth-box .address-box {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transform: translate(-50%, -100%);
}

.earth-box .address-box__content {
    width: max-content;
    background-color: #fff;
    padding: calc(20 * var(--rpx)) calc(5 * var(--rpx));
}

.circle-l {
    width: var(--border-l-w);
    aspect-ratio: 1 / 1;
    background: url(../images/border-1.png) no-repeat center / 100% 100%;
    animation: rotateLoop 60s linear infinite;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.circle-ll {
    width: var(--border-ll-w);
    aspect-ratio: 1 / 1;
    background: url(../images/border-2.png) no-repeat center / 100% 100%;
    animation: rotateLoop 90s linear infinite;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.circle-lll {
    width: var(--border-lll-w);
    aspect-ratio: 1 / 1;
    background: url(../images/border-3.png) no-repeat center / 100% 100%;
    animation: rotateLoop 120s linear infinite;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes rotateLoop {
    0% {
        transform: translate(-50%, -50%) rotate(0);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@media screen and (max-width: 750px) {
    .sec-industrial-1 .address-wrap {
        flex-wrap: wrap;
    }
    .sec-industrial-1 .earth,
    .sec-industrial-1 .company-list {
        width: 100%;
    }
    .sec-industrial-1 .earth {
        margin-top: 20px;
    }
}