.main *{box-sizing: border-box;}
.leftnav{width: 26.2%;height: 760px;padding: 22px 10px;border-top: 2px solid #1B5ABA;background: linear-gradient(180deg, #FAFCFF 0%, #FFFFFF 100%);box-shadow: 0px 0px 21px  rgba(56, 91, 143, 0.12);}
.rightmap{width: 73.8%;height: 760px;position: relative;}
#map{width: 100%;height: 100%;}
.toptit{font-size: 0;}
.toptit div{display: inline-block;width: 72px;margin: 0 19px;font-size: 20px;text-align: center;cursor: pointer;}
.toptit div i{display: block;width: 100%;height: 72px;border-radius: 12px;margin-bottom: 10px;}
.toptit div.jd i{background:rgba(0, 186, 173, .2) url(../../images/tianmap/lyjd.png) no-repeat center;border: none;}
.toptit div.jd.on i{border: 1px solid #00BAAD;background-color: #fff;}
.toptit div.gw i{background:#FFEDED url(../../images/tianmap/cart.png) no-repeat center;border: none;}
.toptit div.gw.on i{border: 1px solid #FF7575;background-color: #fff;}
.toptit div.ms i{background:#FFF5ED url(../../images/tianmap/food.png) no-repeat center;border: none;}
.toptit div.ms.on i{border: 1px solid #FF9036;background-color: #fff;}
.toptit div span{position: relative;}
.toptit div span::after{display: none;position: absolute;content: '';border:7px solid transparent;border-top: none;bottom: -12px;left: 50%;margin-left: -4px;}
.toptit div.jd span::after{border-bottom-color: #00BAAD;}
.toptit div.gw span::after{border-bottom-color: #FF7575;}
.toptit div.ms span::after{border-bottom-color: #FF9036;}
.toptit div.on span{font-weight: bold;}
.toptit div.jd.on span{color: #33B0A8;}
.toptit div.on span::after{display: block;}
.toptit div.gw.on span{color: #FF7575;}
.toptit div.ms.on span{color: #FF9036;}

.con{margin-top: 30px;}
.con ul{display: none;padding-left: 20px;padding-right: 11px;overflow-y: auto;height: 560px;}
.con ul::-webkit-scrollbar{width: 4px;height: 100%;background: #DCE8F5;}
.con ul::-webkit-scrollbar-thumb{background: #3392FF;}
.con ul.on{display: block;}
.con li{margin-top: 25px;}
.con li .tit a{max-width: 70%;font-size: 18px;}
.con li .tit a i{background: url(../../images/tianmap/location.png) no-repeat center;display: inline-block;width: 20px;height: 25px;text-align: center;font-size: 12px;vertical-align: top;margin-top: 3px;font-style: normal;color: #fff;background-size: contain;padding-top: 2px;}
.con li .tit a span{display: inline-block;vertical-align: middle;margin-left: 8px;max-width: 87%;}

.con li .tit .dh{font-size: 14px;line-height: 28px;color: #1272E0;margin-right: 15px;cursor: pointer;}
.con li .address{padding-left: 23px;margin-top: 10px;color: #808080;}

.rightmap .lysearchbox{position: absolute;top: 20px;left: 50px;z-index: 10;width: 386px;display: none;}
.ipt{box-shadow: 0px 4px 4px  rgba(0, 0, 0, 0.25);padding: 8px;border-radius: 10px;background-color: #fff;}
.ipt > *{display: inline-block;height: 42px;vertical-align: middle;}
.ipt input{outline: none;border: none;padding: 0 15px;width: 240px;}
.ipt div{width: 60px;background: #0B82E3 url(../../images/tianmap/schbtn.png) no-repeat center;border: 1px solid #E5E5E5;border-radius: 5px;cursor: pointer;background-size: 24px 24px;}
.ipt div.close{background-image: url(../../images/tianmap/close.png);}
.listbox{display: none;margin-top: 8px;width: 100%;max-height: 530px;padding: 12px;border-radius: 10px;background-color: #fff;box-shadow: 0px 4px 4px  rgba(0, 0, 0, 0.25);}
.schlist{width: 100%;max-height: 500px;overflow-y: auto;}
.schlist::-webkit-scrollbar{width: 4px;height: 100%;background: #DCE8F5;}
.schlist::-webkit-scrollbar-thumb{background: #3392FF;}
.schlist li{padding: 24px 15px 18px;cursor: pointer;}
.schlist li .tit i{background: url(../../images/tianmap/location.png) no-repeat center;display: inline-block;width: 15px;height: 20px;text-align: center;font-size: 12px;vertical-align: middle;font-style: normal;color: #fff;}
.schlist li .tit span{display: inline-block;width: 90%;;vertical-align: top;margin-left: 8px;font-size: 18px;font-weight: bold;color: #2166BF;}
.schlist li .info{font-size: 14px;color: #808080;line-height: 24px;margin-top: 10px;}
.schlist li + li{border-top: 1px solid #F2F2F2;}

@media screen and (max-width:1500px){
    .toptit div{margin: 0 10px;}
}
@media screen and (max-width:450px){
    .toptit div{margin: 0 15px;}
    .leftnav{height: 550px;width: 100%;}
    .rightmap{width: 100%;height: 100vw;}
    .con ul{height: 355px;}
    .con li .tit a span{max-width: 83%;}
    .rightmap .lysearchbox{width: 80%;left:10px;top:10px;}
    .ipt div{width:50px;height:40px;}
    .ipt input{width:55%;}
    .schlist li{padding:15px 10px;}
    .schlist li .tit span{width:86%;}
    .listbox{max-height:250px;}
    .schlist{max-height: 230px;}
}