 @media screen and (min-width:768px) {
  .pageWrap{width: 968px;margin: auto;padding: 32px 0}
  .crumbs{color: #22272e;font-size: 16px;}
  .head-top>form{overflow: hidden;background: #fff;padding:20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07)}
  form>div {float: left; height: 40px;font-size: 12px;color: #627386;line-height: 40px;margin-right: 15px}
  .Buyer {width: 168px; height: 36px;background-color: #ffffff;border-radius: 2px;border: solid 1px #b8bfca;padding-left: 10px;cursor: pointer;}
  .state {width: 168px;height: 36px;background-color: #ffffff;border-radius: 2px;border: solid 1px #b8bfca;padding-left: 10px;color: #627386;cursor: pointer;}
  input::placeholder{color: #9aa5b5;font-size: 12px;}
  textarea::placeholder{color: #9aa5b5;}
  #newBtn div{height: 36px;line-height:36px;border-radius: 2px;display: inline-block;text-align: center;margin-left: 10px;cursor: pointer}
  #newBtn{float: right}
  .query-btn{background-color: #e15616;color: #fff;width: 90px;border: 1px solid #e15616}
  .addBrand{border: solid 1px #e15616;width: 128px;color: #e15616;background: #ffe6dc}
  .brand-list{padding:0 20px 30px 20px; background: #fff; margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
  .brand-title li{list-style: none;display: inline-block;color: #627386;width: 11%;text-align: center}
  .brand-title li:last-child{width: 14%}
  .brand-title li:first-child{text-align: left}
  .brand-title li:nth-child(3){width: 15%}
  .brand-title li:nth-child(4){width: 30%}
  .brand-title li:nth-child(5){width: 15%}
  .brand-title li:last-child{text-align: right}
  .brand-title{border-bottom: solid 1px #e2e7ef;line-height: 55px;height: 55px}
  .tbody ul li{list-style: none;display: inline-block;width: 11%;text-align: center;line-height: 24px;overflow: hidden;text-overflow: ellipsis;vertical-align: middle;
    white-space: nowrap;font-size: 12px;color: #22272e}
  .tbody li:first-child{text-align: left}
  .tbody li:nth-child(3){width: 15%}
  .tbody li:nth-child(4){width: 30%}
  .tbody li:nth-child(5){width: 15%}
  .tbody li:last-child{width: 52px;height: 24px;background-color: #ffe6dc; border-radius: 2px;border: solid 1px #e15616;margin-left: 92px;color: #e15616;cursor: pointer}
  .tbody ul{height: 100px;line-height: 100px;margin-bottom: 10px}
  .brand-logo img{width: 80px;height: 80px}
  .brand-name h3{font-size: 12px}
  .brand-status .font-red{color: #f94b4b;}
  .brand-status .font-blue{color: #1890f9;}
  .brand-status .font-red{color: #f94b4b;}
  .bg-brand{position: fixed;background: rgba(34,39,46, 0.3); top: 0;left: 0; width: 100%;height: 100%;z-index: 1000}
  .add-brand-box{ width: 338px; height: 350px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16); border-radius: 2px;
    border: solid 1px #efefef;position: absolute;left: 0;top: 0;right: 0;bottom: 0;margin: auto}
  .modal-header{height: 42px; line-height: 42px;border: solid 1px #efefef;background-color: #f8f8f8;padding-left: 20px;color: #333333}
  .icon.close-modalForm::before{cursor: pointer;width: 20px;height: 20px;background-position: -315px 1px;position: absolute;right: 13px;top: 10px}
  .brand-content{padding: 10px 10px;color: #22272e}
  .required{color: red}
   .brandlogo-name input{width: 210px;height: 36px;background-color: #ffffff; border-radius: 2px;border: solid 1px #b8bfca;padding-left: 10px}
  .img-box{ width: 56px;height: 56px;background-color: #ffffff;border-radius: 2px;border: solid 1px #b8bfca;display: inline-block; position: relative;}
  .img-box img{width: 100%;height: 100%; }
  .brand-img{margin: 10px 0;}
  .add-pic{ width: 56px;height: 56px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);border-radius: 2px;opacity: 0;cursor: pointer}
  .brand-content .label{width: 81px;text-align: right; display: inline-block;}
  .font-color{color: #e15616;}
  .tishiyu{font-size: 12px;text-align: right; margin-top: 5px}
  .brand-description span{vertical-align: top; }
  .miaoshu{background-color: #ffffff;width: 220px;height: 78px;border-radius: 2px; border: 1px solid #EFEFEF; padding: 5px;resize: none}
  .box-btn{float: right}
  .box-btn div{display: inline-block;width: 68px;height: 32px;line-height: 32px;text-align: center;background-color: #ffffff;border-radius: 2px;border: solid 1px #b8bfca;
   margin-right: 10px;color: #22272e; cursor: pointer;}
  .box-btn .btn-cancel{background-color: #e15616;color: #fff; border: 1px solid #e15616;}
  .icon.add:before { width: 25px;height: 25px;background-position: -168px -374px; position: relative; top: 15px; right: -15px}
  .empty{background: #fff;margin-top: 10px;}
  .navLayout{min-height: auto;}
  }



/*移动*/
 @media screen and (max-width:768px) {
   .head-top{padding: 3.4vw;background: #fff;}
   .head-top form div{margin-top: 2.7vw}
   .order-border{width: 93.4vw;height: 11.8vw;line-height: 11.8vw;border: 1px solid #b8bfca;font-size: 3.4vw;}
   .order-border span{color: #627386;padding-left: 2.7vw}
   .Buyer{color: #9aa5b5;border: 0;width: 70vw}
   input::placeholder,textarea::placeholder{color: #9aa5b5}
   .state{width: 93.4vw;height: 11.7vw;line-height: 11.7vw;padding-left: 1.3vw;border: 1px solid #b8bfca;background: #fff}
   #newBtn>div{width: 40vw;height: 11.2vw;line-height: 11.2vw;text-align: center;display: inline-block;margin-left: 4vw;}
   #newBtn>.query-btn{border: .27vw solid #e15616;background: #e15616;color: #fff;}
   #newBtn>.addBrand{border: .27vw solid #e15616;background: #ffe6dc;color: #e15616;}
  .brand-list .list{margin-top: 2.7vw;background: #fff;padding: 3.3vw;}
  .brand-title li{display: inline-block;color: #9aa5b5;line-height: 8vw;font-size: 3.2vw;width: 21%;}
  .brand-title li:last-child{float: right;}
  .brand-logo{width: 17vw;height:17vw;float: left;line-height: 17vw;text-align: center}
  .brand-logo img{width: 100%;height: 100%;}
  .brand-name{float: right;width: 72vw}
  .brand-name .proname{color: #22272e;font-size: 3.4vw;overflow: hidden;text-overflow: ellipsis;width: 40vw;white-space: nowrap;vertical-align: middle;display: inline-block}
  .brand-name span:nth-child(2){display: inline-block;width: 30vw;text-align: center;}
  .brand-description{font-size: 3.2vw;margin: 1.7vw 0;   color: #9aa5b5}
  .brand-name .font-red{color: #f94b4b;}
  .brand-name .font-blue{color: #1890f9;}
  .brand-name .font-red{color: #f94b4b;}
  .brand-edit{width: 22.4vw;height: 7.2vw;line-height: 7.2vw;color: #1890f9;border: 1px solid #1890f9;border-radius: 4.8vw;text-align: center;float: right;margin-top: 2.7vw;}
  .brand-time{float: left}
  .button{overflow: hidden}
  .text-des{white-space: nowrap;vertical-align: middle;display: inline-block; overflow: hidden;text-overflow: ellipsis;width: 65vw;}
  .bg-brand{position: fixed;background: rgba(34,39,46, 0.3); top: 0;left: 0; width: 100%;height: 100%;z-index: 1000}
  .add-brand-box{ width: 74.7vw; height: fit-content;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16); border-radius: 2px;
    border: solid 1px #efefef;position: absolute;left: 0;top: 0;right: 0;bottom: 0;margin: auto}
   .modal-header{height: 10.5vw; line-height: 10.5vw;border-bottom: solid .27vw #e2e7ef;padding-left: 5.3vw;color: #22272e}
  .mIcon.close-modalForm:before{cursor: pointer;    top: 1.9vw;cursor: pointer;width: 5.3vw;height: 5.3vw;background-position: -34vw 0px;right: 2.7vw;position: absolute;}
  .brand-content{padding:2.7vw;color: #22272e}
  .required{color: red}
  .brandlogo-name input{width: 46vw;height: 8.8vw;background-color: #ffffff;border-radius: .53vw;border: solid .27vw #b8bfca;padding-left: 2.7vw;display: inline-block}
  .img-box{ width: 13vw;height: 13vw;background-color: #ffffff;border-radius: 2px;border: solid .27vw #b8bfca;display: inline-block; position: relative;}
  .img-box img{width: 100%;height: 100%; }
  .brand-img{margin: 10px 0;}
  .add-pic{ width:13vw;height: 13vw;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);border-radius: .53vw;opacity: 0;cursor: pointer}
  .brand-content .label{text-align: right; display: inline-block;font-size: 3vw}
  .font-color{color: #e15616;}
  .tishiyu{font-size:2.2vw;text-align: left; margin-top: 1.3vw;    padding-left: 19.7vw}
  .brand-description span{vertical-align: top; }
  .miaoshu{width: 46.4vw;height: 16vw;border-radius: .53vw;border: 1px solid #b8bfca;padding: 1.3vw;resize: none;display: inline-block;font-size: 3vw}
  .box-btn{padding: 2.7vw;}
  .box-btn div{display: inline-block;width: 100%;height: 9.9vw;line-height: 9.9vw;text-align: center;background-color: #e15616;border-radius: .53vw;border: solid 1px #e15616;margin-bottom: 2.7vw;color: #fff;cursor: pointer}
  .box-btn .btn-cancel{background-color: #fff;color: #9aa5b5; border: 1px solid #b8bfca;}
  .mIcon.add:before {width:5vw;height: 5vw;background-position: -9.6vw -62vw;position: relative;top: 4vw;right: -4vw}
 }
@media screen and (max-width: 360px){
    .brandlogo-name input{width: 43vw}
    .miaoshu{width: 45.4vw}
}
