.recommend-city {
	margin: 0 8px
}
#hot {
	line-height: 14px;
	margin: 20px auto 0;
	text-align: left
}

#hot-title {
	float: left;
	margin-right: 18px;
	color: #2467f4;
	font-size: 16px;
}

a.hot-city {
	margin: 0 10px;
	color: #424242;
	font-size: 14px
}

#selector {
	margin: 20px auto 0;
	height: 30px;
	text-align: left
}

.selector-title {
	float: left;
	line-height: 30px;
	margin-right: 29px;
	color: #666;
	font-size: 16px;
}

.selector {
	float: left;
	cursor: pointer;
	position: relative;
	z-index: 10;
	width: 118px;
	height: 28px;
	margin-right: 8px;
	border: solid 1px #DDD;
	border-radius: 2px;
	color: #999;
	font-size: 14px
}

.selector:hover {
	border-color: #999
}

.selector-result {
	height: 28px;
	padding-left: 15px;
	line-height: 28px;
	font-size: 12px
}

.selector-arrow {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 11px;
	height: 7px;
	background-image: url(//img.58cdn.com.cn/ui6/index/changecity_down.png);
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.selector-arrow-HD {
	background-image: url(//img.58cdn.com.cn/ui6/index/changecity_down@2x.png)!important
}

.selector-arrow-up {
	transform: rotate(180deg)
}

.selector-box {
	display: none;
	position: absolute;
	top: 28px;
	left: -1px;
	width: 118px;
	border: solid 1px #DDD;
	font-size: 12px;
	background-color: #fff;
	overflow-x: hidden;
	overflow-y: auto
}

.selector-list {
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding-left: 15px;
	color: #999;
	box-sizing: border-box
}

.selector-list:hover {
	color: #ff552e;
	background-color: #f8f8f8
}

#selector-city {
	margin-right: 39px
}

#selector-btn {
	cursor: pointer;
	float: left;
	width: 80px;
	height: 30px;
	margin-right: 39px;
	line-height: 30px;
	border-radius: 2px;
	color: #fff;
	font-size: 14px;
	background-color: #ff552e;
	text-align: center
}

#selector-search {
	float: left;
	width: 168px;
	height: 28px;
	border: solid 1px #DDD;
	border-radius: 2px;
	overflow: hidden
}

#selector-search-input {
	float: left;
	width: 108px;
	height: 28px;
	line-height: 28px;
	padding: 0 0 0 6px;
	border: 0;
	outline: 0;
	font-size: 14px;
	color: #999
}

#selector-search-btn {
	cursor: pointer;
	float: left;
	width: 53px;
	height: 28px;
	line-height: 28px;
	border-left: solid 1px #DDD;
	color: #555;
	font-size: 14px;
	text-align: center;
	background-color: #f5f5f5
}

#content {
	margin: 20px auto 0;
	text-align: left
}
#content-title {
	line-height: 16px;
	color: #424242;
	font-size: 16px;
font-weight:bold;
padding:10px 0
}
#content-box {
	float: left;
	margin: 10px 0 50px;
}

.content-letter {
	float: left;
	border: solid 1px #eee;
	width: 100%;
	display: flex;
	margin: 10px 0 0;
	background: #fff;
}
.content-letter:hover .content-letter-panel{
	background: #2467f4;
	color:#fff;
}

.content-letter-panel {
	float: left;
	width: 40px;
	height: 100%;
	color: #bababa;
	background-color: #f9f9f9;
	text-align: center;
	font-size:16px;
}
.content-province-box{
	width:calc(100% - 40px);
}
.content-province {
	float: left;
	position: relative;
	z-index: 1;
	width: 100%;
	border-bottom: solid 1px #eee;
}
.content-province:last-child{
	border-bottom:0;
}
.content-province:hover{
	background: #f9f9f9;
}
.content-province:hover .content-province-triangle{
	display:block;
}
.content-province:hover .content-cities a:hover{
	color: #2467f4;
} 
.content-province-triangle {
	display: none;
    position: absolute;
    top: 50%;
    left: -4px;
    width: 7px;
    height: 10px;
    width: 5px;
    height: 5px;
    transform: rotate(45deg) translateY(-50%);
    background: #2467f4;
	
	
}
.content-province-title {
	float: left;
	line-height: 46px;
	padding-left: 16px;
	border-left-style: solid;
	border-right-style: solid;
	border-width: 1px;
	border-color: #eee;
	color: #424242;
	font-size: 16px;
	padding:0 16px;
	
}
.content-cities {
	float: left;
	padding: 12px 0;
	overflow: hidden
}

.content-city {
	display: inline-block;
	line-height: 20px;
	color: #999;
	font-size: 14px;
	margin: 0 10px
}

.content-letter-panle-hover {
	color: #fff;
	background-color: #ff552e
}

.content-province-hover {
	background-color: #f5f5f5
}

.content-province-triangle-hover {
	display: block
}

.clb {
	clear: both
}
@media screen and (max-width: 1199px){
	body{min-width:100%;}
	.min-w,.footer-wrapper{width:100%;}
	#content-box{width:auto;}
	#content-title{padding: 10px;margin-top: -10px;}
	.content-province{display:flex;}
	.content-province-title{width:12%;text-align:center;}
	.content-province-title > span{display:block;position:relative;top:50%;transform:translateY(-50%)}
	.content-cities{width:88%}
	.content-city{line-height:40px;width: 50px;text-align: center;}
	.content-letter:hover .content-letter-panel{color: #bababa;background-color: #f9f9f9;}
	.content-letter {box-sizing: border-box;}
	
}