@charset "utf-8";

/* ==================================
brandlist.css
================================== */
#brandlist #contents {
  padding-top:10px;
}
#brandlist .contents-inner {
	width: 1000px;
	margin: 0 auto;
}

/* ==================================
brandlist-nav
================================== */
#brandlist .tab-list {
	width:1000px;
	margin:0 auto;
	font-size:0;
}
#brandlist .tab-list li {
	display:inline-block;
	font-size:16px;
	width: 50%;
}
#brandlist .tab-list a {
	display:block;
	width:100%;
	padding:18px 0;
	background:#fff;
	border: solid 2px #d2d2d2;
	box-sizing: border-box;
	text-align:center;
}
#brandlist .tab-list .active a {
	background:#d2d2d2;
}
#brandlist .tab-list a:hover {
	text-decoration: none;
	opacity: .8;
}


/* ==================================
brandlist-nav
================================== */
#brandlist .brandlist-nav {
	color:#666;
}
#brandlist .brandlist-nav .inner {
	width:1000px;
	margin:0 auto;
	padding:40px 0 0;
}
#brandlist .brandlist-nav .tab-header {
	display:none;
}
#brandlist .brandlist-nav .tab-header:first-child {
	display:block;
}
#brandlist .brandlist-nav #brandlist-kana ul {
	width:526px;
	font-size:0;
	margin: 0 auto;
}
#brandlist .brandlist-nav #brandlist-alphabet ul {
	width:639px;
	font-size:0;
	margin: 0 auto;
}
#brandlist .brandlist-nav li {
	display:inline-block;
	margin:10px 0 0 10px;
	font-size:16px;
}
#brandlist .brandlist-nav li a,
#brandlist .brandlist-nav li span {
	display:block;
	width:32px;
	line-height:32px;
	border:1px solid #999;
	text-align:center;
	background:#d2d2d2;
	color:#333;
}
#brandlist .brandlist-nav span {
	opacity:.5;
}
#brandlist .brandlist-nav a:hover {
	background:#e4e4e4;
	text-decoration: none;
}
#brandlist .brandlist-nav li:last-child a,
#brandlist .brandlist-nav li:last-child span {
	width:76px;
}
#brandlist .tab-header li:nth-child(1),
#brandlist #brandlist-alphabet li:nth-child(15) {
	margin-left:0;
}

/* ==================================
brandlist-detail
================================== */
.brandlist-detail {
	width:1000px;
	margin:0 auto;
	padding:40px 0;
}
.brandlist-detail .tab-body {
	display:none;
}
.brandlist-detail .tab-body:first-child {
	display:block;
}
.brandlist-detail .ttl {
	margin-bottom:25px;
	padding-bottom: 15px;
	border-bottom:1px solid #d2d2d2;
}
.brandlist-detail .ttl + .ttl {
		margin-top:60px;
}
.brandlist-detail .ttl span {
	padding-right:5px;
	font-size:35px;
}
.brandlist-detail ul {
	margin-bottom:50px;
}
.brandlist-detail li {
	float:left;
	width:176px;
	margin:25px 0 0 30px;
}
.brandlist-detail li:nth-child(5n+1) {
	clear:both;
	margin-left:0;
}
.brandlist-detail li:nth-child(-n+5) {
	margin-top:0;
}
.brandlist-detail li a,
.brandlist-detail li a span {
	display: block;
	position: relative;
	color:#333;
	font-size:14px;
	word-wrap:break-word;
	padding-left: 0.6em;
}
.brandlist-detail li a:before {
	content:"・";
	display:block;
	position:absolute;
	left:0;
	top:0;
}
.brandlist-detail li a:hover span {
	color:#aaa;
}
.brandlist-detail li a span:last-child {
	color: #999;
	font-size: 10px;
	padding-left: 0.9em;
}

/* ==================================
clearfix
================================== */
#brandlist .brandlist-nav .inner:after,
.brandlist-detail ul:after {
  content:"";
  clear:both;
  display:block;
}