.sub_top .banner_bg {background: url(/img/sub_top2.png) no-repeat center center; background-size: cover;}
.logo_wrap li a {max-width: 85%;}

#brand #sec1 {padding: 130px 0 70px 0;}
#brand #sec1 .flex .lt {width: 50%;}
#brand #sec1 .flex .lt img {width: 85%;}
#brand #sec1 .flex .rt {width: 50%;}
#brand #sec1 .flex .rt .top {font-size: 1.875em; margin-bottom: 45px;}
#brand #sec1 .flex .rt .bt {font-size: 1.125em; opacity: 0.75; line-height: 170%; transform: rotate(-0.03deg);}

#brand .brand_title {text-align: center; transform: rotate(-0.03deg);}
#brand .brand_title .md {font-size: 1.625em;}
#brand .brand_title .line {display: block; width: 1px; height: 30px; margin: 20px auto 30px auto; background: #111;}
#brand .logo_wrap li {box-shadow: 10px 10px 10px rgb(0 0 0 / 7%);}

#brand #sec2 {padding: 60px 0 70px 0; background: #f6f6f6;}
#brand #sec3 {padding: 60px 0 70px 0; background: #fff;}


#brand #sec2 .logo_wrap li{
  width: 23%;
}


@media screen and (max-width: 1350px) {
  #brand #sec1 .flex .lt {width: 40%;}
  #brand #sec1 .flex .lt img {width: 100%;}
  #brand #sec1 .flex .rt {width: 60%; padding-left: 5%;}
  #brand #sec1 .flex .rt .top {font-size: 1.625em; margin-bottom: 6%;}
  #brand #sec1 .flex .rt .bt {font-size: 1.111em;}
  #brand #sec1 .flex .rt .bt br {display: none;}
}

@media screen and (max-width: 1024px) {
  #brand #sec1 .flex {display: block;}
  #brand #sec1 .flex .lt {width: 100%; margin-bottom: 5%; text-align: center;}
  #brand #sec1 .flex .lt img {max-width: 70%;}
  #brand #sec1 .flex .rt {width: 100%; padding-left: 0; text-align: center;}
  #brand #sec1 .flex .rt .bt br {display: block;}
  #brand #sec1 .flex .rt .bt br.br_mo {display: none;}
}

@media screen and (max-width: 768px) {
  #brand #sec1 {padding: 10% 0 7% 0;}
  #brand #sec2, #brand #sec3 {padding: 7% 0 8% 0;}
  
  #brand #sec1 .flex .lt img {max-width: 90%;}
  #brand #sec1 .flex .rt .top {margin-bottom: 3%; font-size: 1.5em;}
  #brand #sec1 .flex .rt .bt br {display: none;}
  #brand #sec1 .flex .rt .bt br.br_mo {display: block;}

  .logo_wrap li,#brand #sec2 .logo_wrap li {width: 31.3333%;}
  .logo_wrap li a {max-height: 80%; max-width: 70%;}
  .logo_wrap li a img {max-height: 100%;}
  #brand .brand_title .line {height: 25px; margin: 2.5% auto 4% auto;}
}

@media screen and (max-width: 540px) {
  #brand #sec1 {padding: 15% 0 10% 0;}
  #brand #sec2, #brand #sec3 {padding: 8% 0 11% 0;}
  #brand #sec1 .flex .lt {margin-bottom: 7%;}
  #brand #sec1 .flex .rt .top {font-size: 1.325em; margin-bottom: 5%;}
  #brand #sec1 .flex .rt .bt {font-size: 1em;}

  #brand .brand_title .md {font-size: 1.5em;}
  .logo_wrap li,#brand #sec2 .logo_wrap li {width: 46%; margin: 0 2% 4% 2%; height: 80px;}
  #brand .brand_title .line {height: 20px; margin: 3% auto 5% auto;}
}

@media screen and (max-width: 414px) {
  #brand #sec1 .flex .rt .top {font-size: 1.25em;}
}

@media screen and (max-width: 375px) {
  #brand #sec1 .flex .rt .top {font-size: 1.125em;}
}