.city-combo{position:relative}
.city-combo input{width:100%;box-sizing:border-box}
.city-list{display:none;position:absolute;left:0;right:0;top:100%;z-index:50;max-height:240px;overflow-y:auto;background:#fff;color:#222;border:1px solid #ccc;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.15);margin-top:2px}
.city-list.open{display:block}
.city-list .grp{padding:6px 10px;font-size:12px;font-weight:700;text-transform:uppercase;color:#666;background:#f5f5f5;position:sticky;top:0}
.city-list .opt{padding:7px 12px;cursor:pointer}
.city-list .opt:hover,.city-list .opt.active{background:#e8f0fe}
.city-list .none{padding:8px 12px;color:#888}