.bdb	{	border-bottom: solid 1px #DDD;}
.category	h1.ttl	{	border-bottom: solid 1px #DDD;}
div#brands	{	border-top: solid 1px #DDD;}
div#brands	h2	{	color: #7C3D31;}
div#brands	h2	img{	margin-right: 8px;	vertical-align: middle;}
div#brands	article	section	{	border-bottom: solid 1px #DDD;}
div#brands	article	section	a	{	color: #000;}

/*=======* PC 769px OVER *=================================================*/
@media only screen and (min-width: 769px) {
.category	h1.ttl	{
	width: 100%;
	max-width: 985px;
	margin: 0 auto;
	padding: 45px 40px 25px;
	text-align: left;
}
/*============================
#brands
============================*/
div#brands	{
		width: 100%;
	max-width: 985px;
	margin: 50px auto;
	padding: 50px 0 0;
}
div#brands	h2	{
	text-align: left;
	font-size: 23px;
	vertical-align: middle;
}
div#brands	h2	img{
	width: 29px;
	margin-right: 8px;
}

div#brands	article	{
	width: 100%;
	margin: 0 auto;
	-js-display: flex;
	display:-webkit-box;
	display:-moz-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}
div#brands	article	section	{
/*	display:inline-block;
	float: left;*/
	width: 33.333%;
	width : -webkit-calc(100% / 3) ;
	width : -moz-calc(100% / 3) ;
	width : calc(100% / 3) ;
	padding: 15px 0 32px;
}
div#brands	article	section	a	{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	border-right: solid 1px #FFDFBD;
}
div#brands	article	section:nth-of-type(3n)	a	{
	border-right: none;
}
div#brands	article	section	a	img	{
	width: 90%;
	max-width: 458px;
	margin: 0 auto;
}
div#brands	article	section	a	h3	{
	width: 80%;
	margin: 25px auto 14px;
	font-size: 23px;
	font-weight: normal;
}
div#brands	article	section	a	h3	sub	{
	display: block;
	font-size: 12px;
}
div#brands	article	section	a	div	{
		width: 75%;
	margin: 0 auto;
	text-align: left;
	font-size: 16px;
	line-height: 1.4;
}
}
/*=======* Mobile 768px Under *=================================================*/
@media only screen and (min-width:320px) and (max-width:768px){
.category	h1.ttl	{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 3%;
	text-align: center;
}
.category	h1.ttl	img	{
	width: 35%;
	max-width: 175px
}

/*============================
#brands
============================*/
div#brands	{
		width: 90%;
	margin: 8% auto 3%;
	padding: 8% 0 0;
}
div#brands	h2	{
	text-align: left;
	font-size: 1.2rem;
	vertical-align: middle;
}
div#brands	h2	img{
	width: 29px;
	margin-right: 8px;
}

div#brands	article	{
	width: 100%;
	margin: 0 auto;
}
div#brands	article	section	{
	width: 100%;
	margin: 0 auto;
	padding: 30px 0;
}
div#brands	article	section:last-of-type	{
	border-bottom: none;
}

div#brands	article	section	a	{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
}
div#brands	article	section	a	img	{
	width: 90%;
	max-width: 458px;
	margin: 0 auto;
}
div#brands	article	section	a	h3	{
	width: 80%;
	margin: 15px auto 8px;
	font-size: 1.2rem;
	font-weight: normal;
}
div#brands	article	section	a	h3	sub	{
	display: block;
	font-size: 12px;
}
div#brands	article	section	a	div	{
		width: 75%;
	margin: 0 auto;
	text-align: left;
	font-size: 0.9rem;
	line-height: 1.4;
}

}