@charset "UTF-8";

/* ----------------------------------
 Brand List
---------------------------------- */
body > .wrapper { background: #F0F5F7;}
header #header_top { background: #fff;}
header #header_bottom { background: #fff;}

#brand_list { width: 1200px; margin: 0 auto;}
#brand_list .brand-list-total-count { display: none;}
#brand_list .brand-list { display: flex; flex-wrap: wrap;}
#brand_list .brand-list-item { width: calc((100% - 100px)/6); margin: 0 20px 40px 0;}
#brand_list .brand-list-item:nth-child(6n) { margin-right: 0;}
#brand_list .brand-list-item a,
#brand_list .brand-list-item .nolink { display: block; text-decoration: none;}
#brand_list .brand-list-item .logo { width: 100%; padding: 60% 0 0 0; margin: 0 0 15px 0; position: relative; transition: 0.3s; box-shadow: 3px 5px 5px -1px rgba(0, 0, 0, 0.05);}
#brand_list .brand-list-item .logo figure { width: 100%; height: 100%; padding: 15px; background: #fff; display: flex; justify-content: center; align-items: center; box-sizing: border-box; position: absolute; top: 0; left: 0; overflow: hidden;}
#brand_list .brand-list-item .logo img  { vertical-align: top;}
#brand_list .brand-list-item a:hover .logo { opacity: 0.6;}
#brand_list .brand-list-item .name { font-size: 16px; font-weight: 600; text-align: center;}
#brand_list .brand-list-item .ruby { font-size: 12px; font-weight: 400; text-align: center; display: block;}
