﻿/*-- 

	Brands Ele
	/brands/

====================================================== --*/
/*-- top --*/
/*-- ------------------------------------------------- --*/
#BrandsIndex{
	background:#e7e7e7;
}

#BrandsIndex .contentsList{
	margin:0px auto 0px;
	height:249px;
	width:993px;
	position:relative;
	z-index:10;
}
#BrandsIndex .block{
	margin:-306px auto 0px;
	padding-top:0px;
}
#BrandsIndex .contentsList li{
	float:left;
	width:237px;
	margin:0px 15px 0px 0px;
	height:249px;
	text-align:center;
}
#BrandsIndex .contentsList li .thumImg{
	width:237px;
	height:205px;
}
#BrandsIndex .contentsList li .logoImg{
	max-width:237px;
	max-height:72px;
}
#BrandsIndex .contentsList li.current{
	background:url(../../images/brands/index_current.gif) no-repeat center bottom;
}
#BrandsIndex .contentsList li:nth-of-type(4){
	margin:0px;
}
#BrandsIndex .contentsList li a{
	display:block;
	width:237px;
	background:white;
	height:205px;
	text-align:center;
}
#BrandsIndex .contentsList li a img{
	transition:opacity 300ms ease;
	max-width:237px;
	max-height:205px;
}
#BrandsIndex .contentsList li a:hover img{
	opacity:0.75;
}

#BrandsIndex .brandDetail{
	width:100%;
	min-width:993px;
	margin:0px 0px 0px;
	background:url(../img/bg_white.gif) no-repeat left 44px;
	background-size: auto 753px;
	padding-top:44px;
	height:753px;
	height:44px;
	position:relative;
	top:-44px;
	z-index:10;
}
#BrandsIndex .brandDetail .block{
	width:993px;
	padding:33px 0px 33px;
	margin:0px auto;
}
#BrandsIndex .brandDetail .img{
	margin:0px 0px 30px;
	position:relative;
	z-index:2;
	text-align:center;
}
#BrandsIndex .brandDetail .img img{
	max-width:993px;
	max-height:348px;
}
#BrandsIndex .brandDetail .brandLogo{
	float:left;
	margin:0px 22px 25px 23px;
	width:360px;
	text-align:center;
}
#BrandsIndex .brandDetail .brandLogo img{
	max-width:360px;
	max-height:90px;
}
#BrandsIndex .brandDetail dl{
	width:588px;
	float:right;
	margin:-12px 0px 25px;
}
#BrandsIndex .brandDetail dl dt{
	font-size:13px;
	line-height:18px;
	word-break:break-all;
	height:48px;
	margin:0px 0px 10px;
}
#BrandsIndex .brandDetail dl dd ul{
}
#BrandsIndex .brandDetail dl dd li{
	float:left;
	margin:6px 6px 0px 0px;
}
#BrandsIndex .brandDetail dl dd li a{
	transition:opacity 300ms ease;
}
#BrandsIndex .brandDetail dl dd li a.commonBtn{
	transition:all 300ms ease;
	padding-left:0px;
	padding-right:20px;
	text-align:center;
	width:146px;
	background-image:url(../img/mark_blank.png);
	background-position:130px center;
}
#BrandsIndex .brandDetail dl dd li a.commonBtn:hover{
	background-image:url(../img/mark_blank_hover.png);
}
#BrandsIndex .brandDetail dl dd li a:hover{
	opacity:0.75;
}
#BrandsIndex .brandDetail dl dd li.official,
#BrandsIndex .brandDetail dl dd li.online{
	margin:0px 15px 0px 0px;
	width:166px;
}
#BrandsIndex .brandDetail dl dd li.online{
	margin:0px 23px 0px 0px;
}
#BrandsIndex .brandDetail dl dd li.official a:hover,
#BrandsIndex .brandDetail dl dd li.online a:hover{
	opacity:1;
}
#BrandsIndex .brandDetail .pickup{
	clear:both;
	padding:17px 0px 20px;
	border-top:1px solid #d2d2d2;
	border-bottom:1px solid #d2d2d2;
}
#BrandsIndex .brandDetail .pickup img{
	float:right;
	margin:4px 55px 0px 0px;
	max-width:237px;
	max-height:133px;
}

#BrandsIndex .brandDetail .pickup p{
	width:610px;
	margin:0px 0px 0px 40px;
	word-break:break-all;
	font-size:13px;
	line-height:24px;
	min-height:145px;
}
#BrandsIndex .brandDetail .close{
	position:absolute;
	left:50%;
	top:10px;
	top:44px;
	width:65px;
	margin:0px 0px 0px 431px;
	z-index:1;
	overflow:hidden;
	border-radius:65px;
}
#BrandsIndex .brandDetail .prev{
	position:absolute;
	left:58px;
	top:411px;
	margin:0px 0px 0px 0px;
	z-index:100;
}
#BrandsIndex .brandDetail .next img,
#BrandsIndex .brandDetail .prev img{
	opacity:0.2;
}
#BrandsIndex .brandDetail .next .on img,
#BrandsIndex .brandDetail .prev .on img{
	opacity:1;
}
#BrandsIndex .brandDetail .next{
	position:absolute;
	right:58px;
	top:411px;
	z-index:100;
	margin:0px 0px 0px 0px;
}
























