/* CSS Document */
/*华歌专属，未经授权，切勿转载*/
@media all{
    .Brands_Title{ margin:0 0 10px; color:#25282a; font-size:25px; font-weight:300;}
    .Brands_wrap{ padding-bottom:50px; margin-top:10px;}
    .Brands_wrap li{ width:49%; margin-bottom:10px; padding:0px 10px 20px; float:left;border: 1px solid #e5e5e5;overflow: hidden;position: relative}
    .Brands_BTN{bottom:-95px;width: 100%;transition: bottom 0.5s;left: 0;}
    .Brands_wrap li:nth-child(2n){ margin-left:2%;}
    .Brands_wrap li:hover{ box-shadow:0px 1px 8px 1px #d1d1d1;}
    .Brands_imgBox img{ max-width:100%;}
    .Brands_TxT h3{ font-size:14px; font-weight:bold; color:#525355; margin:5px 0;}
    .Brands_TxT p{ margin:0; color:#666; font-size:0.85em; height:100px; text-align:justify;}
    .Brands_BTN{bottom: -110px;background-color: #ffffff}
    .Brands_BTN a{ font-size:0.85em; display:inline-block; padding:4px 0px 4px; font-weight:300; text-align:center;width: 45%;}
    .Brands_BTN a +a{float: right;}
    /*.Brands_BTN a:hover,Brands_BTN a:focus{ color:#fff;}*/
    .Brands_imgBox{text-align: center}
    .BtnBlue{ background-color:#ffffff;border: 1px solid #d3a129;color: #d3a129}
    .BtnBlue:hover{color: #d3a129}
    .BtnYellow{ background-color:#c7000d;color: #ffffff}
    .BtnYellow:hover{ color: #ffffff}
    .Brands_wrap li:hover  .Brands_BTN{bottom:20px;transition:bottom 0.5s;background-color:#ffffff}
    .brandW{margin-top:20px;margin-left:20px;display:none}
    .brandW>a{display: inline-block;width:20px;height:20px;background:url("../images/brandw3.png")no-repeat center;position:relative;margin-right:10px;cursor:pointer;float: none!important;}
    .brandW>a.facebook{background-image: url("../images/facebook.png")}
    .brandW>a.twitter{background-image: url("../images/twitter.png")}
    .brandW>span b{display:block;bottom:-20px;width:120px;height:120px;background:url("../images/brand-bg.png ")no-repeat center;position:absolute;left:-52px;transform:scale(0);transition: all 0.5s;text-align:center;background-size:cover;}
    .brandW>span b>img{margin-top:10px;width:90%;}
    .brandW>a:hover{background-image:url("../images/brandw4.png")}
    .brandW>a.facebook:hover{background-image: url("../images/facebook-hover.png")}
    .brandW>a.twitter:hover{background-image: url("../images/twitter-hover.png")}
    .brandW>span:hover>b{transform:scale(1);transition: all 0.5s;bottom:20px;}
    .brandW>span{display: inline-block;width: 20px;height:20px;background: url("../images/brandw1.png");position:relative}
    .brandW>span:hover{background: url("../images/brandw2.png")}
}
@media(min-width:768px){
    .Brands_wrap li,.Brands_wrap li:nth-child(2n){float:left;width:32%;margin-left:2%;margin-bottom:15px;padding:0 20px;}
    .Brands_wrap li:nth-child(3n+1){margin-left:0;}
    .Brands_TxT h3{ font-size:20px;}
    .Brands_TxT p{ font-size:13px; overflow:hidden;}
    .Brands_BTN>a{ font-size:14px;margin-top: 20px;}
    .Brands_TxT p{height: 115px;}
    .Brands_BTN{bottom:-115px;height:115px;padding:0 20px;position:absolute}
    .brandW{margin-left:10px;display:block}
    .Brands_BTN::before{position: absolute;width:80%;top:0;left:10%;content:"";display:block;height:1px;background-color:#eee}
    .Brands_wrap li:hover .Brands_TxT{opacity:0;transition:opacity 0.5s}
}
@media(min-width:992px){
    .Brands_wrap li,.Brands_wrap li:nth-child(3n+1),.Brands_wrap li:nth-child(2n){float:left;width:23.875%;margin-left:1.5%;}
    .Brands_wrap li:nth-child(4n+1){margin-left:0;}
    .Brands_TxT p{height:115px;margin:0;}
    .Brands_BTN{bottom:-115px;height:115px;}
}
@media(min-width: 1200px) {
    .Brands_TxT p{height:95px;margin:0;word-break:break-all;}
    .Brands_BTN{height:95px;background-color:#ffffff;bottom:-95px;}
    .Brands_BTN{padding:0 40px;}
    .Brands_BTN::before{width:70%;left:15%}

}