/*圈圈狂三的动画*/
@-webkit-keyframes slide-market20 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px)
    }
    to {
        opacity: 1
    }
}

@keyframes slide-market20 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px)
    }
    to {
        opacity: 1
    }
}


@-webkit-keyframes slide-market30 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(30px)
    }
    to {
        opacity: 1
    }
}

@keyframes slide-market30 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(30px);
        transform: translateY(30px)
    }
    to {
        opacity: 1
    }
}


@-webkit-keyframes slide-market40 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px)
    }
    to {
        opacity: 1
    }
}

@keyframes slide-market40 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        transform: translateY(40px)
    }
    to {
        opacity: 1
    }
}


/*动画*/
@-webkit-keyframes slide-market50 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px)
    }
    to {
        opacity: 1
    }
}

@keyframes slide-market50 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }
    to {
        opacity: 1
    }
}


.point-area .point {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    height: 10px;
    margin: auto;
    -webkit-border-radius: 50%;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 50%;
    -moz-background-clip: padding;
    border-radius: 50%;
    background-clip: padding-box;
    background: transparent
}

.point-area .point-shadow:after {
    box-shadow: inset 0 0 5em rgba(0, 205, 236, .16)
}

.point-area .point-white {
    background-color: #fff;
    border: 1px solid #12709d
}

.point-area .point-dot {
    z-index: 1;
    background-color: #12709d;
    border: 1px solid rgba(0, 205, 236, .37)
}

.point-area .point-10 {
    width: 100%;
    height: 100%
}

.point-area .point-10:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out 225ms infinite;
    animation: ripple 4.5s ease-out 225ms infinite
}

.point-area .point-20 {
    width: 100%;
    height: 100%
}

.point-area .point-20:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out .45s infinite;
    animation: ripple 4.5s ease-out .45s infinite
}

.point-area .point-30 {
    width: 100%;
    height: 100%
}

.point-area .point-30:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out 675ms infinite;
    animation: ripple 4.5s ease-out 675ms infinite
}
/*蓝色扩散线条*/
.point-area .point-40 {
    width: 100%;
    height: 100%
}
/*多个圈圈线条*/
.point-area .point-40:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out .9s infinite;
    animation: ripple 4.5s ease-out .9s infinite
}

/*洛杉矶*/
.point-area .point-70 {
    width: 100%;
    height: 100%
}

.point-area .point-70:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out 1575ms infinite;
    animation: ripple 4.5s ease-out 1575ms infinite
}

.point-area .point-80 {
    width: 100%;
    height: 100%
}

.point-area .point-80:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #12709d;
    opacity: 0;
    -webkit-animation: ripple 4.5s ease-out 1.8s infinite;
    animation: ripple 4.5s ease-out 1.8s infinite
}
.point-area .point-name{
    font-weight: 400;
    font-size:10px;
    color:#333;
}
/*扩大范围的圆点*/
@-webkit-keyframes ripple {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1)
    }
    5% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: scale(1)
    }
}
/*图片百分比*/
.aliyun-index-serve-2016 .module-wrap .ali-main-serve .main-img, .aliyun-index-serve-2016 .module-wrap .ali-main-serve .main-img img {
    width: 100%
}
@media screen and (min-width:60em){
    .stpo_text_content{
        display: none;
    }
}
@media screen and (max-width:60em){
    .point-area .point-name{
        font-size:10px;
        color:black;
        display: none;
    }
    .stpo_text_content{
        width:100%;
        margin-top:1.5em;
        padding:0.2em 0.3em 0.2em 0.2em;
        border:1px dashed  #999;
        display: inline-block;
    }
    .stpo_text_content i{
        width:8px;height:8px;background:#12709d;display: inline-block;border-radius:50%;margin:-0.1em 0.2em 0 0.2em;
    }

    .stop_text_center label{
        margin-left:2%;
    }
    .stpo_text_content span{
        display: inline-block;
        text-align:center;
        font-size:0.6em;
        font-weight:normal;
    }
    .stpo_text_content .stop_text_center{
        width:98%;
        margin:0 auto;
    }
    .text_moblie{
        font-size:76%;
    }

}