/*****************************************************************************
CSS only for Partner page
*****************************************************************************/

/* TopImg
-----------------------------------------*/
.TopImg {
  margin: 30px auto 45px;
  max-width: 976px;
}
.TopImg img {
  max-width: 100%;
  height: auto;
}

/* Partner
-----------------------------------------*/
.Partner {
  margin: 0 auto;
  max-width: 976px;
}
@media screen and (max-width: 976px) {
  .Partner {
    margin: 0 20px;
  }
}
.Partner__sec + .Partner__sec {
  margin-top: 75px;
}
@media screen and (max-width: 767px) {
  .Partner__sec + .Partner__sec {
    margin-top: 55px;
  }
}

/* LogoList
-----------------------------------------*/
.LogoList {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-top: 45px;
}
@media screen and (max-width: 767px) {
  .LogoList {
    display: block;
    width: 85%;
    margin: 30px auto 0;
  }
}
.LogoList li {
  text-align: center;
}
.LogoList img{
  max-width: 100%;
  height: auto;
}

.LogoList li a:hover  { opacity: .8 }
.LogoList li a:focus  { opacity: .8 }
.LogoList li a:active { opacity: .8 }

.LogoList li.LogoList__wide {
  width: 100%;
}

.LogoList--official > li {
  width: 33.333%;
  padding: 25px 30px;
}
@media screen and (max-width: 976px) {
  .LogoList--official > li {
    padding: 20px 18px;
  }
}
@media screen and (max-width: 767px) {
  .LogoList--official > li {
    width: auto;
  }
}

.LogoList--platinum > li {
  padding: 48px 30px;
}
@media screen and (max-width: 976px) {
  .LogoList--platinum > li {
    padding: 15px 18px;
  }
}

.LogoList--gold > li {
  padding: 18px 30px;
}
@media screen and (max-width: 976px) {
  .LogoList--gold > li {
    padding: 15px 18px;
  }
}

.LogoList--silver > li {
  padding: 20px 24px;
}
@media screen and (max-width: 976px) {
  .LogoList--silver > li {
    padding: 15px 18px;
  }
}

.LogoList--bronze > li {
  padding: 18px 17px;
}
@media screen and (max-width: 976px) {
  .LogoList--bronze > li {
    padding: 15px 18px;
  }
}

.LogoList--blue > li {
  padding: 18px 17px;
}
@media screen and (max-width: 976px) {
  .LogoList--blue > li {
    padding: 15px 18px;
  }
}

.LogoList--supplier > li {
  padding: 18px 26px;
}
@media screen and (max-width: 976px) {
  .LogoList--supplier > li {
    padding: 15px 18px;
  }
}