﻿.homepage-cont-main {
    padding-left: 290px;
    position: relative;
    margin-top: 20px;
    min-height: 600px;
}
.brand_left{border: 1px solid #e9e9e9;border-radius: 6px;overflow: hidden;z-index:111;width: 260px;position: absolute;left: 0;top: 0px;background: transparent;}
.letters{background: #f3f3f3;width:30px;position:absolute;top:0;left:0;height:572px;border-right: 1px solid #f3f3f3;}
.letters i{display:block;width: 30px;line-height: 16px;text-align: center;/* padding-top: 10px; */height: 26px;font-style: normal;font-size: 13px;cursor: pointer;color: #444a57;line-height: 26px;}
.letters i:hover,.letters i.on{color: #8BA9FF;background: #fff;}
.brand_name{background: #fff;height:572px;margin-bottom:10px;box-shadow: 0px 1px 5px 0px rgba(0,0,0,.1);}
.brand_name .brand_letter{padding-top: 5px;}
.brand_name .brand_letter label{text-indent: 10px;font-size: 15px;line-height: 30px;background: #f3f3f3;display: block;margin: 0px 5px 5px 35px;border-radius: 3px;}
.brand_name{/* padding: 0; */margin-bottom: 0;overflow-y:auto;}
.brand_name::-webkit-scrollbar-track{background-color:#f3f3f3;-webkit-box-shadow:0 0 2px rgba(0, 0, 0, 0.2);}
.brand_name::-webkit-scrollbar{width: 5px;background-color: rgba(0, 0, 0, 0.1);}
.brand_name::-webkit-scrollbar-thumb{background-color:  #dbdbdb;border-radius: 2px;}
.brand_name .brand_letter p{font-size: 20px;cursor: pointer;color: #747474;border-top: 1px solid #f3f3f3;font-size: 14px;/* text-indent: 50px; */line-height: 40px;padding-left: 40px;}
.brand_name .brand_letter p img{
	display:inline-block;
	vertical-align:middle;
	width: 40px;
    margin-right: 5px;
}
.brand_name .brand_letter p:hover,.brand_name .brand_letter p.on{color: #8BA9FF;}
@media screen and (max-height:768px) {
	.brand_name{
		height: 440px;
	}
	.letters{
		height: 440px;
	}
	.letters i{
	    line-height: 3px;
	    height: 10px;
	    font-size: 12px;
	}
}

.tabmain .main .area{/* margin: 0 20px; */line-height: 32px;font-size: 0;display: block;position: relative;}
.tabmain .main .area h4{margin-top: 15px;width: 66px;text-align: left;font-size: 16px;display: inline-block;vertical-align: top;font-weight: normal;}
.tabmain .main .area .name,.main .area .bra_img{display: inline-block;vertical-align: middle;width: 92%;margin: 15px 0;}
.tabmain .main .area .name a{border-radius: 5px;cursor: pointer;border:1px solid transparent;position: relative;font-size: 14px;padding: 0px 8px;color:#444a57;display: inline-block;margin-right: 17px;height: 26px;line-height: 26px;vertical-align: middle;}
.tabmain .main .area .name a.on,.main .area .name a:hover{color: #D30005;border-color:#D30005;}
.tabmain .main .area .name a:hover label{color: #D30005;}
.tabmain .main .area .name a label{font-weight:normal;padding: 0px 15px;font-size: 14px;color: #444a57;cursor: pointer;border-radius: 3px;display: inline-block;}
.tabmain .main .area .name a label i{display:inline-block;transition:all .2s linear;font-size: 20px;vertical-align: middle;}
.tabmain .main .area .name a b{opacity: 0;position:absolute;top: 28px;left:0px;display:block;border-radius:2px;border: 1px solid #f2f3f7;width: 100%;background:#fff;z-index: -1;color:#888;box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.1);transition:all .2s linear;font-weight: normal;text-align: center;}
.tabmain .main .area .name a b em{font-style:normal;display:block;font-size:14px;border-bottom: 1px solid #f2f3f7;font-size: 12px;line-height: 30px;color: #888f9d;}
.tabmain .main .area .name a b em:hover{color:#D30005;background:#f9f9f9;}
.tabmain .main .area .name a:hover b{opacity: 1;z-index:11;}
.tabmain .main .area .name a:hover label i{transform: rotate(180deg);margin-top: -3px;}
.bra_img{font-size:0;height: 250px;}
.bra_img a{/* float: left; */width: 16.666%;display: inline-block;cursor:pointer;vertical-align: middle;transition:all .2s linear;margin: 20px 0;}
.bra_img a:hover{margin-top:-8px;}
.bra_img a:hover span,
.bra_img a:hover i{color: #D30005;}
.bra_img a span{font-size: 16px;display: block;line-height: 33px;text-align: center;padding:0 5px;color: #444a57;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.bra_img a img{height: 50px;display: block;margin: 5px auto;transition:all .2s linear;}




.caption{line-height: 50px;font-size: 22px;margin: 30px auto 20px;height: 50px;border-bottom: 2px solid #f2f3f7;}
.caption h5{margin-right:40px;display: inline-block;vertical-align: middle;color: #333;font-size: 20px;}
.caption h5 img{display: inline-block;vertical-align: middle;width: 45px;}
.caption .btns{display: inline-block;vertical-align: middle;height: 40px;line-height: 40px;margin-top: 0;float:right;}
.caption .btns span{cursor: pointer;position: relative;color: #666;/* font-weight:550; */font-size: 16px;height: 40px;line-height: 40px;text-align: center;padding: 0px 10px;display: inline-block;margin-left: 20px;}
.caption .btns span:after{display: block;content: "";clear: both;position: absolute;bottom: 0px;left: 30%;width: 40%;background: transparent;height: 4px;border-radius: 2px;}
.caption .btns span.on:after{background: #D30005;}
.caption .btns span:hover,.caption .btns span.on{color: #D30005;}

.caption .cap_right .cap_sel{
	min-width: 160px;
	display: block;
	position: relative;
}
.caption .cap_right .cap_sel p{
	display: block;
	color: #333;
	height: 45px;
	line-height: 45px;
	padding-right: 30px;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: pointer;
}
.caption .cap_right .cap_sel p span{
	display: inline-block;
	vertical-align: middle;
	font-size: 15px;
	letter-spacing: 1px;
	text-indent: 10px;
}
.caption .cap_right .cap_sel p i{
	display: inline-block;
	vertical-align: middle;
	font-size: 25px;
	position: absolute;
	right: 0;
	top: 3px;
}
.caption .cap_right .cap_sel p.on{}
.caption .cap_right .cap_sel p.on i{
	transform: rotate(180deg);color: #ff8700;
	
}
/*.caption .cap_right .cap_sel .cap_box{*/
	
/*width: 100%;*/
	
/*display: none;*/
	
/*position: absolute;*/
	
/*top: 44px;*/
	
/*left: 0;*/
	
/*background: #fff;*/
	
/*z-index: 1;*/
	
/*height: 180px;*/
	
/*overflow-y: auto;*/
	
/*box-shadow: 0px 0px 2px 0px rgba(0,0,0,.05);*/
/*}*/
/*.caption .cap_right .cap_sel .cap_box.on{display: block;}*/
/*.caption .cap_right .cap_sel .cap_box em{*/
/*	display: block;*/
/*	line-height: 36px;*/
/*	color: #666;*/
/*	margin:0 10px;*/
/*	font-size: 14px;*/
/*	cursor: pointer;*/
/*	letter-spacing: 1px;*/
/*	    overflow: hidden;*/
/*    white-space: nowrap;*/
/*    text-overflow: ellipsis;*/
/*}*/
/*.caption .cap_right .cap_sel .cap_box em:hover{color: #ff8700;}*/
.location{/* box-shadow: 0px 4px 5px 0px rgba(0,0,0,.1); */display: inline-block;line-height: 30px;margin-top: 0px;/* padding:15px; */line-height: 50px;font-size: 22px;/* margin: 0px auto; */height: 50px;}
.location  a,.location  b{/* font-weight: normal; *//* font-size: 22px; */color: #333;display: inline-block;vertical-align: middle;/* text-indent: 6px; *//* font-weight: 550; */}
.location  a:hover{color: #ff8700;}
.location  i{color: #333;font-size: 30px;display: inline-block;vertical-align: middle;font-weight: bold;}
.location  span{/* color: #ff8700; */display: inline-block;vertical-align: middle;/* font-size: 22px; *//* font-weight: 550; */}

.scroll .scroll-content{display:none;/* margin-top: 20px; */}
.scroll .scroll-content.on{display:block;}
.scroll .scroll-content .scroll-list{font-size: 0px;}
.scroll .scroll-content .scroll-list .scroll-right{display: block;vertical-align: top;/* border-left:1px solid #e5e5e5; */padding-bottom: 100px;}
.scroll .scroll-content .scroll-list .scroll-right h3{font-size: 22px;color: #333;display: block;line-height: 52px;margin: 30px 0;position:relative;font-weight: normal;letter-spacing: 3px;}
.scroll .scroll-content .scroll-list .scroll-right h3 img{
	display:inline-block;
	vertical-align:middle;
	/* height:40px; */
	margin-right:5px;
}
.scroll .scroll-content .scroll-list .scroll-right h3:after{
    display:block;
    content:'';
    clear:both;
    height: 4px;
    width: 50px;
    background:#d30005;
    border-radius: 4px;
    left: 73px;
    position: absolute;
}
.scroll .scroll-content .scroll-list .scroll-right ul{font-size: 0px;}
.scroll .scroll-content .scroll-list .scroll-right ul li{display: inline-block;vertical-align: middle;width: 33.33%;}


.group_active li .detail{padding: 12px;width: 92%;margin: 0 auto;border-radius: 4px;cursor:pointer;transition: all .3s linear;} 
.group_active li .detail:hover{transform: translate3d(0,0,-5px);box-shadow: 0px 5px 10px 0px rgba(0,0,0,.15);}
.group_active li .detail .img img{    height: 198px;max-width: 100%;display: block;margin: 0 auto;}
.group_active li .detail .img label{display: block;line-height: 50px;font-weight: 550;font-size: 18px;text-align: left;color: #444a58;}
.group_active li .detail .img span em{font-style: normal;position: absolute;top: 0;color: #555;line-height: 25px;display: block;height: 25px;left: 0px;}
.group_active li .detail .info{padding: 10px 0;position: relative;padding-right: 90px;padding-left: 0;}
.group_active li .detail label{display: inline-block;vertical-align: middle;font-size: 20px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;/* height: 30px; *//* border-radius: 3px; */cursor: pointer;}
.group_active li .detail label img{
	display:inline-block;vertical-align:middle;width:58px;
}
.group_active li .detail .info p{display: block;font-size: 17px;line-height: 25px;}
.group_active li .detail .info p i{font-style: normal;color: #D30005;}
.group_active li .detail .info p span{font-size:14px;color:#888;padding-left:5px}
.group_active li .detail .info p span em{
	color:#d30005;
}
.group_active li .detail .info button{position: absolute;right: 0;top: 50%;height: 30px;line-height: 30px;font-size: 13px;width: 85px;border-radius: 3px;margin-top: -15px;background: url(/Templates/default/Images/btn.png) no-repeat center center;background-size: 100% 100%;color: #fff;}


.brand li{width: 20%;display: inline-block;vertical-align: middle;/* border-bottom: 1px solid #f5f5f5; */text-align: center;}
.brand li a{transition: all .1s linear;cursor:pointer;width: 99%;padding:25px 0;display: block;border: 1px solid #f5f5f5;}
.brand li a:hover{transform: translate3d(0,0,-5px);box-shadow: 0px 2px 10px 0px rgba(224,100,53,.25);}
.brand li img{max-width: 100%;display: block;margin:0 auto;}
.brand li span{display: block;line-height: 35px;font-size: 16px;}


.hot_car{font-size:0;}
.hot_car li{transition:all .3s linear;
    border-radius:5px;width: 50%;display: inline-block;vertical-align: middle;margin: 20px 0;cursor: pointer;position:relative;}
.hot_car li .rank_list{
    padding: 5px;
    cursor:pointer;
    position: relative;
    transition:all .3s linear;
    border-radius:5px;
}
.hot_car li:hover{
     transform:translate3d(0,-5px,0);
    box-shadow:0px 0px 10px 0px rgba(0,0,0,.1);
}
.hot_car li img{transition: all .5s linear;max-width: 100%;display: block;margin:0 auto;}
.hot_car li h5 {font-size: 22px;font-weight: normal;line-height: 40px;/* text-align: center; */}
.hot_car li span {color: #ff4f53;font-size: 16px;display: block;/* font-weight: 550; */}
.hot_car li a{width:160px;height:120px;display: inline-block;vertical-align: middle;overflow:hidden;margin-left: 20px;}
.hot_car li .rank_info{display: inline-block;vertical-align: middle;width: 255px;padding-left: 20px;position: relative;}
/* .hot_car li:hover a img{transform: scale(1.1)} */
.hot_car li:hover h5{color: #ff4f53;}
.hot_car li i{font-size: 14px;color:#747474;font-style:normal;display: block;/* text-align: center; */}
.hot_car li label{position:absolute;left: 5px;top: 5px;font-size:28px;color: #777;z-index:99;width: 50px;height: 50px;line-height: 37px;text-indent: 5px;}
.hot_car li label.rank_top{font-size:27px;font-style:italic;background: url('/Templates/Default/images/11.png') no-repeat;background-size: 100% 100%;color: #fff;}

.hot_car li .rank_info button{
	position: absolute;right: 10px;top: 55px;height: 30px;line-height: 30px;font-size: 13px;width: 85px;border-radius: 3px;background: url(/Templates/default/Images/btn.png) no-repeat center center;background-size: 100% 100%;color: #fff;

	color: #fff;
}





















