.mark{
    z-index:101;
}
.page-radar ::-webkit-input-placeholder { /* WebKit browsers */
    color: #76f0fd;
    font-size: 14px;
}
  
.page-radar ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #76f0fd;
    font-size: 14px;
  }
  
.page-radar :-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #76f0fd;
    font-size: 14px;
}   
.page-radar{
    width:1114px;
    margin:0 auto;
    background:url('../images/back.png') no-repeat;
    padding:20px 30px 30px 56px; 
    border-radius:5px;
    position: fixed;
    margin-left:-600px;
    margin-top:-415px;
    z-index: 102;
}
.page-radar .modal-close{
    position:absolute;
    right:15px;
    top:0;
    color:#fff;
    font-size:25px;
}
.page-radar .form-box {
    width:300px;
    float:left;
    font-size:12px;
    color:#b9ccd9;
    margin-right: 60px;
}
.page-radar .form-box .logo-box{
    padding-bottom:10px;
}
.page-radar .form-box .logo-box img{
    position: relative;
    left:-20px;
}
.page-radar .form-box .logo-box .logo-text{
    margin-top:-13px;
}
.page-radar .title{
    color:#b9ccd9;
    font-size:16px;
    margin:20px 0;
    padding-left:8px;
    border-left:4px solid #1e92ff;
}
.page-radar .form .form-input{
    box-sizing: border-box;
    width:100%;
    height:38px;
    line-height: 36px;
    border:1px solid #5491b4;
    border-radius:5px;
    background-color:rgba(29,99,133,.70);
    padding-left:8px;
    font-size:14px;
    color:#76f0fd;
}
.page-radar .form .classify-item{
    float:left;
    box-sizing: border-box;
    width:90px;
    height:32px;
    line-height:32px;
    margin:0 15px 20px 0;
    background-color:rgba(29,99,133,.25);
    border-radius:5px;
    text-align: center;
    color:#6bc3cf;
    font-size:14px;
    cursor: pointer;
}
.page-radar .form .classify-item.on{
    background-color:rgba(29,99,133,.7);
    border:1px solid #5491b4;
    line-height:30px;
    color:#76f0fd;
}
.page-radar .form .classify-item:nth-child(3n){
    margin-right:0;
}
.page-radar .form .page-radar .radatSelect{
    box-sizing: border-box;
    background-color:rgba(29,99,133,.7);
    border:1px solid #5491b4;
    color:#76f0fd;
    width:100%;
    border-radius:5px;
    position: relative;
}
.page-radar .btn-box{
    padding:20px 0;
}
.page-radar .btn-box .btn-blue{
    display:inline-block;
    box-sizing: border-box;
    width:100%;
    font-size:14px;
    color:#fff;
    background-color:#1e92ff;
    padding:8px 0;
    text-align: center;
    border-radius:5px;
    cursor: pointer;
}
.page-radar .btn-box .btn-blue:hover{
    background-color:#41a3ff;
}
.page-radar .btn-box .btn-end,.page-radar .btn-box .btn-end:hover{
    background-color:#3b6b97;
    cursor: inherit;
}
.page-radar .btn-box .btn-end img{
    display:inline-block;
    vertical-align: middle;
    margin-right:3px;
}
.page-radar #main canvas {
    background: url(../images/radar.png) no-repeat center !important;
}
.page-radar #main2 canvas{
    background: url(../images/radar2.png) no-repeat center !important;
}
.page-radar .chart-box{
    float:left;
    position: relative;
    padding-top:20px;
}
.page-radar .chart-box .successRate{
    position: absolute;
    z-index: 10;
    left: 238px;
    top: 142px;
    color: #fff;
    font-size:14px;
    font-weight:700;
}
.page-radar .chart-box .successRate .rate-item{
    margin-bottom:20px;
}
.page-radar .chart-box .robot-box{
    position: absolute;
    bottom:0;
    right:266px;
    z-index: 20;
}
.page-radar .chart-box .robot-box img{
    cursor: pointer;
}
.page-radar .chart-box .robot-box .robot-text{
    position: absolute;
    top:20px;
    right:80px;
    width:400px;
    box-sizing: border-box;
    padding:15px;
    background-color:#fff;
    border-radius:10px;
    font-size:14px;
    color:#363636;
}
.page-radar .chart-box .robot-box .robot-text.noShow{
    width:184px;
    padding:10px;
}
.page-radar .chart-box .robot-text:after{
    content:'';
    position: absolute;
    right:-8px;
    top:8px;
    display: inline-block;
    background:url('../images/polygon.png') no-repeat;
    width:8px;
    height:8px;
}
.page-radar .chart-box .robot-text .til{
    color:#343a5a;
}
.page-radar .chart-box .robot-box .close{
    position:absolute;
    right:10px;
    top:0px;
    font-size:16px;
    color:#9d9d9d;
}
.page-radar .chart-box .statistics{
    width:215px;
    box-sizing:border-box;
    padding:20px 20px 10px 20px;
    text-align: center;
    font-size:12px;
    color:#b9ccd9;
    margin-left:30px;
    background: url('../images/statistics-back.png') no-repeat;
    background-size:100%;
}
.page-radar .chart-box .statistics .statistics-num{
    padding:72px 0;
    font-size:14px;
}
.page-radar .chart-box .statistics .num-item:first-child{
    padding-bottom:27px;
}
.page-radar .chart-box .statistics .num-item em{
    font-size:24px;
    color:#fff;
}
.page-radar .chart-box .statistics .tip{
    padding:0 0 0px;
}
.page-radar .chart-box .statistics .tip em{
    color:#fff;
}
.page-radar .chart-box .btn-blue:first-child{
    margin-bottom:15px;
}
.page-radar .notice-box .title{
    margin:15px 0;
}
.page-radar .notice-box .notice-list{
    padding-left:10px;
}
.page-radar .notice-box .notice-item{
    width:48%;
    box-sizing: border-box;
    padding:23px 26px;
    float:left;
    background: url('../images/notice-back.png');
}
.page-radar .notice-box .notice-item:first-child{
    margin-right:15px;
}
.page-radar .notice-box .notice-item .text{
    float:left;
    padding:5px 0 0 10px;
    font-size:12px;
    color:#b9ccd9;
}
.page-radar .notice-box .notice-item .til{
    font-size:16px;
    color:#fff;
    padding-bottom:5px;
    font-weight: 400;
}
.page-radar .notice-box .notice-item .btn-box{
    text-align: right;
    padding:10px 0 0;
}
.page-radar .notice-box .notice-item .notice-btn{
    display:inline-block;
    padding:5px 20px;
    background-color:#1e92ff;
    color:#fff;
    border-radius: 5px;
    cursor: pointer;
}
.page-radar .notice-box .notice-item .notice-btn:hover{
    background-color:#41a3ff;
}
.page-radar .chart-box .num-list .num-item{
    float:left;
    background:url('../images/notice-back.png') no-repeat;
    text-align: center;
    font-size:14px;
    color:#b9ccd9;
    width:200px;
    padding:20px 0;
    margin-right:68px;
}
.page-radar .chart-box .num-list{
    padding:45px 0 20px; 
}
.page-radar .chart-box .num-list .num-item:last-child{
    margin-right:0;
}
.page-radar .chart-box .num-item .number{
    font-size:36px;
    color:#72cbff;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.page-radar .chart-box .radar-loading{
    position: relative;
}
.page-radar .chart-box .radar-back{
    background: url(../images/radar-pic3.png) no-repeat;
    width: 519px;
    height: 450px;
    position: absolute;
    left: 0;
    top: 0;
}
.page-radar .chart-box .rotate{
    top: 10px;
    left: 238px;
    position: absolute;
    -webkit-transform-origin: 0 219px;
    transform-origin: 0 219px;
    transform: rotate(-80deg);
    animation: radar 3s linear infinite;
}
.page-radar .chart-box .radar-loading{
    width: 470px;
    height: 450px;
    margin-left:85px;
}
.page-radar .chart-box .radar-loading .dot{
    display: block;
    border-radius: 50%;
    animation-timing-function: linear;
}
.page-radar .chart-box .radar-loading .dot1{
    position: absolute;
    width: 100%;
    height: 100%;
    animation: blips 3s infinite;
    animation-delay: .5s;
}
.page-radar .chart-box .radar-loading .dot2{
    position: absolute;
    width: 40%;
    height: 60%;
    animation: blips2 3s infinite;
    animation-delay: 1.5s;
}
.page-radar .chart-box .radar-loading .dot3{
    position: absolute;
    width: 120%;
    height: 60%;
    animation: blips 3s infinite;
}
.page-radar .chart-box .radar-tip{
    text-align: center;
    width:180px;
    font-size:16px;
    color:#76f0fd;
    font-weight:700;
    position: absolute;
    left: 230px;
    top: 538px;
}
@keyframes radar{
    0%{
        transform: rotate(0deg);
    }
    50%{
        transform: rotate(180deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
@keyframes blips {
    14% {
        background: radial-gradient(.5vmin circle at 75% 70%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
    }
    14.0002% {
        background: radial-gradient(.5vmin circle at 75% 70%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
    }
    25% {
        background: radial-gradient(.5vmin circle at 75% 70%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
        opacity: 1;
    }
    100% {
        background: radial-gradient(.5vmin circle at 75% 70%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
        opacity: 0;
    }
}
@keyframes blips2 {
    14% {
        background: radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
    }
    14.0002% {
        background: radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
    }
    25% {
        background: radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 75% 40%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
        opacity: 1;
    }
    100% {
        background: radial-gradient(.5vmin circle at 56% 86%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 63% 72%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(.5vmin circle at 75% 40%, #ffffff 10%, #b7ffff 30%, rgba(255, 255, 255, 0) 100%);
        opacity: 0;
    }
}
.page-radar .form .radatSelect{
    box-sizing: border-box;
    background-color:rgba(29,99,133,.7);
    border:1px solid #5491b4;
    color:#76f0fd;
    width:100%;
    border-radius:5px;
    position: relative;
    line-height: 34px;
    font-size:14px;
}
.page-radar .radatSelect div{
    height:0;
    margin-top:-1px;
    background-color:rgba(29,99,133,1);
    border:1px solid #5491b4;
    color:#76f0fd;
    border-radius:0 0 3px 3px;
    overflow:hidden;
    opacity:0;
    filter:alpha(opacity=0);
    position:absolute;
    top:100%;
    left:-1px;
    right:-1px;
}
.page-radar .radatSelect .selected{line-height:23px;padding-left:8px;}
.page-radar .radatSelect li{display:block;font-size:16px;line-height:1;padding:8px 7px 10px;overflow:hidden;white-space:nowrap;cursor:pointer;}
.page-radar .radatSelect ul{height:100%;width:100%;list-style:none;overflow-y:auto;}
.page-radar .radatSelect ul::-webkit-scrollbar{width:8px;height:100%}
.page-radar .radatSelect ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: #56bed0;
    background: #56bed0;
}
.page-radar .radatSelect ul::-webkit-scrollbar-track {
    border-radius: 0;
    -webkit-box-shadow: #0b4865;
    background: #0b4865;

}
.page-radar .radatSelect li{font-size:14px;}
.page-radar .radatSelect li.focus{background-color:rgba(29,99,133,1);color:#76f0fd !important;}
.page-radar .radatSelect .old{display:none;}
.page-radar .radatSelect .carat{display:block;width:13px;height:6px;background:url(../images/carat.png) no-repeat;position:absolute;right:15px;top:15px;transform: rotate(0);transition: .5s all ease-in-out;}
.page-radar .radatSelect:hover{box-shadow:0 0 5px rgba(0,0,0,.15);}
.page-radar .radatSelect.open{z-index:2;}
.page-radar .radatSelect.open div{opacity:1;filter:alpha(opacity=100);z-index:2;}
.page-radar .radatSelect.open .carat{transform: rotate(180deg);}
@media (max-height:800px){
    .page-radar{
        margin-top:-306px;
    }
    .page-radar .notice-box{
        display:none;
    }
    .page-radar .radatSelect.open div{
        max-height:100px;
    }
}