.solutionBox * {
    box-sizing: border-box;
    font-family: 'Microsoft YaHei';
}

.solutionBox {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.solutionBox .solutionLeft,
.solutionBox .solutionRight {
    flex: 1;
}

.solutionBox .solutionLeft .solutionList .solutionItem,
.solutionBox .solutionRight .solutionList .solutionItem {
    margin-bottom: 20px;
    padding: 20px 12px;
    margin-top: 40px;
    display: flex;
    align-items: center;
    text-decoration: none;
}

.solutionBox .solutionLeft .solutionList .solutionItem i,
.solutionBox .solutionRight .solutionList .solutionItem i {
    background: #45CF5F;
    color: #fff;
    width: 16.22%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 100%;
    display: inline-block;
    font-style: normal;
    font-size: 18px;
    margin-right: 14px;
    font-weight: bold;
}

.solutionBox .solutionRight .solutionList .solutionItem i {
    margin-right: 0;
}

.solutionBox .solutionLeft .solutionList .solutionItem .title,
.solutionBox .solutionRight .solutionList .solutionItem .title {
    width: 83.78%;
    font-size: 18px;
    color: #333;
    text-decoration: none;
}

.solutionBox .solutionRight .solutionList .solutionItem {
    justify-content: flex-end;
}

.solutionBox .solutionRight .solutionList .solutionItem .title {
    margin-right: 14px;
}

.solutionBox .solutionItem:hover {
    /* 张家界天成机电设备制造有限公司 */
    text-decoration: none;
}

.solutionBox .solutionItem:hover .title {
    color: #45CF5F !important;
}

.solutionBox .solutionCenter {
    width: 500px;
    height: 500px;
    display: inline-block;
    position: relative;
}

@keyframes iconSpin {
    to {
        transform: rotate(1turn);
    }
}

@keyframes iconSpin2 {
    to {
        transform: rotate(-360deg);
    }
}


/* 暂时动画 */

.solutionBox .solutionCenter:hover .changePicIcon,
.solutionBox .solutionCenter:hover .changePicIcon div {
    animation-play-state: paused;
    -webkit-animation-play-state: paused
}

.solutionBox .solutionCenter .changePicIcon {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    animation: iconSpin 20s linear infinite;
    z-index: 2;
}

.solutionBox .solutionCenter .solutionPicImg {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    padding: 120px;
    object-fit: cover;
    z-index: 1;
}

.solutionBox .solutionCenter .solutionIcon {
    position: absolute;
    width: 66px;
    height: 66px;
    animation: iconSpin2 20s linear infinite;
    cursor: pointer;
}

.solutionBox .solutionCenter .changePicIcon img {
    max-width: 100%;
    display: block;
    border: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon1 {
    left: 33%;
    margin-left: -40px;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon2 {
    left: 66%;
    margin-left: -40px;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon3 {
    top: 25%;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon4 {
    top: 25%;
    right: 0;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon5 {
    bottom: 25%;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon6 {
    bottom: 25%;
    right: 0;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon7 {
    bottom: 0;
    left: 33%;
    margin-left: -40px;
}

.solutionBox .solutionCenter .solutionIcon.solutionIcon8 {
    bottom: 0;
    left: 66%;
    margin-left: -40px;
}