/*公用*/
.nav-bar-main li:nth-of-type(1){
    background: url("../img/nav-left-1.png") no-repeat center 30px;
}
.nav-bar-main li:nth-of-type(2){
    background: url("../img/nav-left-2.png") no-repeat center 30px;;
}
.nav-bar-main li:nth-of-type(3){
    background:#879195 url("../img/nav-left-3.png") no-repeat center 30px;;
}
/*搜索区域*/
.content{
    margin: 12px 12px 5px 1px;
    width: 138px;
    height: 30px;
    border:1px solid #d9d9d9;
    border-radius: 2px;
}
.content .select{
    width: 125px;
    height: 30px;
    margin: 0px auto;
    position: relative;
    cursor: pointer;
}
.content .select::after{
    content: "";
    display: block;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #888990;
    top: 14px;
    right: 12px;
    position: absolute;
    transition: all .3s ease-in;
}
.content .select p{
    width: 112px;
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    font-family: "microsoft yahei";
    color: #626c72;
    padding: 0px 15px;
    margin: 0 !important;
}
.content .select ul{
    background: #fff;
    width: 122px;
    display: block;
    font-size: 12px;
    position: absolute;
    top: 33px;
    left: 0px;
    max-height: 0px;
    overflow: hidden;
    transition: max-height .3s ease-in;
}
.content .select ul li{
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding: 0px 15px;
    list-style: none;
    color: #626c72;
}
.content .select ul li.Selected{
    background: #2484dd;
    color: #FFFFFF;
}
.content .select ul li:hover{
    background: #D0D0D0;
}
@-webkit-keyframes slide-down{
    0%{transform: scale(1,0);}
    25%{transform: scale(1,1.2);}
    50%{transform: scale(1,0.85);}
    75%{transform: scale(1,1.05);}
    100%{transform: scale(1,1);}
}
@keyframes slide-down{
    0%{transform: scale(1,0);}
    25%{transform: scale(1,1.2);}
    50%{transform: scale(1,0.85);}
    75%{transform: scale(1,1.05);}
    100%{transform: scale(1,1);}
}
.content .select.open ul{
    max-height: 150px;
    transform-origin: 50% 0;
    -webkit-animation: slide-down .5s ease-in;
    transition: max-height .2s ease-in;
    border:1px solid #d9d9d9;
}
.content .select.open::after{
    transform: rotate(180deg);
    transition: all .3s ease-in;
    top: 14px;
}
.content .select1{
    width: 112px;
    height: 30px;
    margin: 0px auto;
    position: relative;
    cursor: pointer;
}
.content .select1::after{
    content: "";
    display: block;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #888990;
    top: 14px;
    right: 12px;
    position: absolute;
    transition: all .3s ease-in;
}
.content .select1 p{
    width: 112px;
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    font-family: "microsoft yahei";
    color: #626c72;
    padding: 0px 15px;
    margin: 0 !important;
}
.content .select1 ul{
    background: #fff;
    width: 112px;
    display: block;
    font-size: 12px;
    position: absolute;
    top: 33px;
    left: 0px;
    max-height: 0px;
    overflow: hidden;
    transition: max-height .3s ease-in;
}
.content .select1 ul li{
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding: 0px 15px;
    list-style: none;
    color: #626c72;
}
.content .select1 ul li.Selected{
    background: #2484dd;
    color: #FFFFFF;
}
.content .select1 ul li:hover{
    background: #D0D0D0;
}
@-webkit-keyframes slide-down{
    0%{transform: scale(1,0);}
    25%{transform: scale(1,1.2);}
    50%{transform: scale(1,0.85);}
    75%{transform: scale(1,1.05);}
    100%{transform: scale(1,1);}
}
@keyframes slide-down{
    0%{transform: scale(1,0);}
    25%{transform: scale(1,1.2);}
    50%{transform: scale(1,0.85);}
    75%{transform: scale(1,1.05);}
    100%{transform: scale(1,1);}
}
.content .select1.open ul{
    max-height: 250px;
    transform-origin: 50% 0;
    -webkit-animation: slide-down .5s ease-in;
    transition: max-height .2s ease-in;
    border:1px solid #d9d9d9;
}
.content .select1.open::after{
    transform: rotate(180deg);
    transition: all .3s ease-in;
    top: 14px;
}
.guidance-level{
    display: -webkit-box;
    display: -moz-box;
    display:-webkit-flex;
    display: -ms-flexbox;
    display:flex;
    height: 90px;
    margin:0 8px 5px -8px;
}
.guidance-level .level{
    color: #fff;
    flex: 1;
    background-position:center center !important;
    width:33.3%;height:100%;
    display: flex;
    justify-content:center;
    align-items: center;
    flex-direction:column;
    font-family:Microsoft Yahei;
}
.guidance-level .level >div:first-child{
    font-size:25px;
}
.guidance-level .level >div:last-child{
    font-size:12px;
}
/*
    @一级诱导
*/
.guidance-level .level:nth-of-type(1){
    background: url("../img/common/guidance-level1.png") no-repeat;
}
/*
    @二级诱导
*/
.guidance-level .level:nth-of-type(2){
    background: url("../img/common/guidance-level2.png") no-repeat;
}
/*
    @三级诱导
*/
.guidance-level .level:nth-of-type(3){
    background: url("../img/common/guidance-level3.png") no-repeat;
}
.guidance-level li div:nth-of-type(1){
    padding-right: 16px;
    font-size: 30px;
    text-align: center;
}
.guidance-level li div:nth-of-type(2){
    padding-left: 20px;
    font-size: 12px;
}
.ser-result-wrap{
    margin-right: 16px;
    height: calc(100% - 218px);
    height: -webkit-calc(100% - 218px);
    height: -moz-calc(100% - 218px);
    overflow-y: auto;
    transition: all .5s;
    -moz-transition: all .5s;	/* Firefox 4 */
    -webkit-transition: all .5s;	/* Safari 和 Chrome */
    -o-transition: all .5s;
}
/*诱导结果面板*/
.ser-result-wrap-noTop{
    margin-right: 16px;
    height: calc(100% - 128px);
    height: -webkit-calc(100% - 128px);
    height: -moz-calc(100% - 128px);
    overflow-y: auto;
}
.ser-result-wrap li{
    cursor: pointer;
    border-radius: 4px;
    /*height: 76px;*/
    height:119px;
    padding: 12px 12px;
}
.ser-result-wrap li:nth-of-type(odd){
    background: #f5f6f6;
}
.ser-result-l{
    width: 260px;
    height: 76px;
}
.ser-result-l div{
    padding: 1px 0;
    color: rgba(0,0,0,.45);
    font-size: 12px;
}
.ser-result-l div:nth-of-type(1){
    color: #1f2b3d;
    font-size: 14px;
}
.ser-result-wrap li .img-wrap{
    width: 70px;
    height: 93px;
    background-size:100% 100% ;
}
.img-wrap img{
    width: 70px;
    height: 93px;
}


/*地图*/
/*右下角图例 */
/*******************************************************右下角图例*/
.freespace{
    z-index: 3;
    position: fixed;
    height: 120px;
    width: 150px;
    bottom: 20px;
    left: 240px;
    color: #626c72;
    font-size: 12px;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 3px 10px rgba(155,166,171,.5);
}
.freespace .freespace-tit{
    width: 100%;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 14px;
    color: #1f2b3d;
    background-color: #f5f6f6;
}
.freespace .freespace-content{
    height: 188px;
    padding: 4px 0 0 16px;
}
.freespace .freespace-content .freespace-msg{
    height: 25px;
    line-height: 25px;
}
.freespace-msg .msg-common{
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
}
.freespace-msg .msg-bgfull{
    background: url("../img/guidance_bg1.png") no-repeat;
    background-size:100% 100%;
}
.freespace-msg .msg-bgfew{
    background: url("../img/guidance_bg2.png") no-repeat;
    background-size:100% 100%;
}
.freespace-msg .msg-bgeough{
    background: url("../img/guidance_bg3.png") no-repeat;
    background-size:100% 100%;
}
/*弹窗*/
.pop-common{
    /*position: relative;*/
}
/*1级诱导屏*/
.guidance1-pop{
    width: 300px;
    height:234px;
    display: none;
    /*position: fixed;*/
    /*top:100px;*/
    /*right: 200px;*/
}
.guidance1-pop img{
    width: 100%;
    height: 100%;
}
/*2级诱导屏*/
.guidance2-pop{
    width: 196px;
    /*height: 500px;*/
    padding: 14px;
    background-color: #fff;
    box-shadow: 1px 1px 10px rgba(155,166,171,.5);
}
.guidance2-poptopbar{
    height: 80px;
    background: url(../img/secIcon.png) no-repeat;
    background-position: 58px 20px;
    /* background-size: 60% 60%; */
    background-color: #aff4c7;
    box-shadow: 1px 10px 10px rgba(175,244,199,0.5);
    margin-bottom: 16px;
}
.pop-bottomcontent{
    margin-top: 12px;
    /*height: 500px;*/
    overflow-y: auto;
}
.pop-bottomUl{

}
.guidance2-pop .pop-bottomcontent .bottom-style {
    /*width: 2.36px;*/
    height: 24px;
    margin-bottom: 12px;
}
.guidance2-pop .bottom-style .bot-tit {
    float: left;
    width: 85px;
    height: 24px;
    line-height: 24px;
    color: #fff;
    text-align: center;
    font-size: 12px;
    background: #4baad7;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.guidance2-pop .bot-right .run-icon{
    width: 30px;
    height: 24px;
    float: left;
    background: url(../img/turnover_right.png) center no-repeat;
    background-position: 7px 7px;
}
.guidance2-pop .bot-right .left-icon{
    width: 30px;
    height: 24px;
    float: left;
    background: url("../img/turn-left.png") center no-repeat;
    background-position: 5.5px 4px;
}
.guidance2-pop .bot-right .right-icon{
    width: 30px;
    height: 24px;
    float: left;
    background: url(../img/turn-right.png) center no-repeat;
    background-position: 7.5px 4px;
}
.guidance2-pop .bot-right .around-icon{
    width: 30px;
    height: 24px;
    float: left;
    background: url("../img/turn-around.png") center no-repeat;
    background-position: 6px 3.5px;
}
.bot-right{
    background-color: #f1f1f1;
    height: 24px;
    /*line-height: 100px;*/
}
.guidance2-pop .bot-right .height20{
    width: 1px;
    height: 20px;
    float: left;
    margin-top: 2px;
    background-color: #c4c4c4;
}
.guidance2-pop .bot-right .bot-num {
    height: 24px;
    line-height: 24px;
    width: 52px;
    font-size: 14px;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    float: left;
}
.fontgreen{
    color: rgba(0,0,0,.6);
}
.fontblue{
    color: rgba(0,0,0,.6);
}
.fontorange{
    color: rgba(0,0,0,.6);
}

/*3级诱导屏*/
.guidance3-pop{
    width: 195px;
    height: 195px;
    padding: 0 16px;
    background-color: #fff;
    box-shadow: 1px 1px 10px rgba(155,166,171,.5);
}
.guidance3-poptopbar{
    width: 100%;
    height: 48px;
    line-height: 48px;
    text-align: center;
    border-bottom: 1px solid #f6f5f5;
    margin-bottom: 16px;
}
.guidance3-pop .guidance3-poptopbar .pop_parkName {
    float: left;
    width: 150px;
    height: 64px;
    line-height: 32px;
    font-size: 20px;
    margin-top: 20px;
    margin-left: 53px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #fff;
}
.align-center-vertical {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
}
.guidance3-mid{
    width: 100%;
    height: 24px;
    line-height: 24px;
    margin-bottom: 16px;
}
.guidance3-plies{
    width: 52px;
    height: 24px;
    font-size: 14px;
    color: rgba(0,0,0,.6);
    line-height: 24px;
}
.guidance3-plies .upper-case {
    font-size: 16px;
    width: 23px;
    margin-left: 8px;
    margin-right: 2px;
    height: 24px;
    float: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.plies-tit{
    width: 46px;
    height: 24px;
    line-height: 24px;
    background-color: #4baad7;
    color: #fff;
    text-align: center;
    font-size: 14px;
}
.plies-Num{
    width: 60px;
    height: 24px;
    line-height: 24px;
    background-color: #f1f1f1;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
}
.guidance3-pop .time-hour {
    width: 80px;
    height: 80px;
    background: url(../img/24h.png) no-repeat;
    background-size: 100% 100%;
    float: left;
    margin-left: 37px;
}
.time-hour .time-num1 {
    width: 48px;
    height: 50px;
    margin-top: 22px;
    margin-left: 19px;
    font-size: 16px;
    color: #000;
    word-wrap: break-word;
}
.guidance3-pop .maxheight-2m{
    width: 80px;
    height: 80px;
    background: url("../img/maxheight_2m.png") no-repeat;
    background-size: 100% 100%;
    float: left;
    margin-right: 20px;
}

.guidance3-pop .maxheight-2m .maxheight-tit{
    display: inline-block;
    float: left;
    width:38px ;
    height: 32px;
    line-height:32px;
    font-size: 25px;
    color: #000;
    margin-left: 9px;
    margin-top: 23px;
    text-align: center;
}
/* 多个诱导图片时 添加左右按钮切换图片*/
.guiico_left{
    top: 50%;
    left: 5px;
    margin-top: -12px;
    background: url("../img/guidepop_leftico.png") no-repeat;
    background-size: 24px 24px;
    height: 24px;
    width: 24px;
}
.guiico_right{
    top: 50%;
    right: 5px;
    margin-top: -12px;
    background: url("../img/guidepop_rightico.png") no-repeat;
    background-size: 24px 24px;
    height: 24px;
    width: 24px;
}
.guipop_close{
    background:url("../img/guipop_closeico.png") no-repeat;
    background-size: 24px 24px;
    height: 24px;
    width: 24px;
    top: 5px;
    right: 5px;
}