.brand-search-header h1 {
  color: #29427d;
  font-size: 20px;
  font-weight: bold;
  margin-top: 65px;
  margin-bottom: 0; }

.brand-search-header .initials-sort-container {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  align-items: center;}
  .brand-search-header .initials-sort-container .leage {
    text-align: center;
    display: inline-block;
    text-decoration: none;
    border: 1px solid #4d4d4d;
    color: #4d4d4d;
    width: 65px;
    height: 30px;
    line-height: 30px;
    margin-right: 5px;
    font-size: 10px; }
  .brand-search-header .initials-sort-container .active {
    background-color: #e4e4e3;
    border: none; }


.main-container {
  width: 80%; }

.brand-list.flex {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 30px; }
  .brand-list.flex .brand-top-img {
    display: block;
    text-decoration: none;
    color: #4d4d4d;
    border-right: 1px solid #c7c5c5;
    width: calc(100%/4 - 1%);
    height: 182px;
    padding-left: 5px;
    margin-bottom: 20px; }
    .brand-list.flex .brand-top-img div {
      width: 90%; }
      .brand-list.flex .brand-top-img div img {
        width: 100%; }
    .brand-list.flex .brand-top-img .brand-egname p {
      margin: 0;
      font-size: 14px; }
    .brand-list.flex .brand-top-img .brand-jpname p {
      margin: 0;
      font-size: 10px;
      letter-spacing: 0; }
    .brand-list.flex .brand-top-img:last-child, .brand-list.flex .brand-top-img:nth-child(4n) {
      border-right: none; }

nav.list-navi {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 55px;
  margin-bottom: 890px; }
  nav.list-navi a {
    margin-right: 25px;
    text-decoration: none;
    color: #29427d; }

@media (max-width: 768px) {
  .main-container {
    width: 100vw; }
  .brand-list.flex {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 30px; }
    .brand-list.flex .brand-top-img {
      text-decoration: none;
      color: #4d4d4d;
      border-right: 1px solid #c7c5c5;
      width: 48.5%;
      height: auto;
      padding-left: 5px;
      margin-bottom: 20px;
      text-align: center;}
      .brand-search-header{
        padding: 0 5px;
        box-sizing: border-box;
      }
      .initials-btn-container{
        margin-top: 5px;
      }
      .initials-btn{
        margin: 4px 2px;
      }
      .brand-list.flex .brand-top-img .brand-top-content {
        width: 100%;
        margin: 0 auto;
        text-align: center; }
        .brand-list.flex .brand-top-img .brand-top-content img {
          width: 80%; }
      .brand-list.flex .brand-top-img .brand-egname p {
        margin: 0;
        font-size: 14px; }
      .brand-list.flex .brand-top-img .brand-jpname p {
        margin: 0;
        font-size: 10px;
        letter-spacing: 0; }
      .brand-list.flex .brand-top-img:last-child, .brand-list.flex .brand-top-img:nth-child(4n) {
        border-right: 1px solid #c7c5c5; }
  nav.list-navi {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 55px;
    width: 100vw;
    margin-bottom: 50px; } }

@media (max-width: 506px) {
  .brand-list.flex {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .brand-list.flex .brand-top-img {
      border-right: none;
      border-bottom: 1px solid #c7c5c5;
      width: 100vw; }
      .brand-list.flex .brand-top-img .brand-top-content {
        width: 250px; }
      .brand-list.flex .brand-top-img:last-child, .brand-list.flex .brand-top-img:nth-child(4n) {
        border-right: none; }
      .brand-list.flex .brand-top-img:first-child {
        border-top: 1px solid #c7c5c5; } }

main .brand-search-container .main-left .site-footsteps {
  flex-wrap: wrap;
  margin-bottom: 0; }
  main .brand-search-container .main-left .site-footsteps a {
    margin: 0 1px 0 0;
    font-size: 12px; }
  main .brand-search-container .main-left .site-footsteps p {
    margin: 0 0 0 1px;
    font-size: 12px; }

@media (max-width: 768px) {
  .brand-search-container .main-left .site-footsteps {
    display: none; } }