html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,
ins,kbd,q,samp,small,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin: 0;padding: 0;font-weight: lighter;}
input,select,textarea{margin: 0;padding: 0}
input,select{vertical-align: middle}
ul,ol{list-style: none}
ul,ol,li,dl,dt,dd,pre,form,fieldset,img,div{margin: 0;padding: 0;border: none}
img{ vertical-align: middle; border-style: none;}
textarea{resize: none}
a{text-decoration: none}
em{font-style: normal}
html{font-size: 100%;-webkit-text-size-adjust: 100%;-moz-text-size-adjust: 100%;-ms-text-size-adjust: 100%;text-size-adjust: 100%}
*,*::after,*::before{-webkit-box-sizing: border-box;box-sizing: border-box}
.clear{clear: both}
.clearfix,.w{zoom: 1}
.clearfix:after,.w:after{content: ".";display: block;overflow: hidden;height: 0;clear: both;visibility: hidden}
.fl{float: left}
.fr{float: right}
html,body{ font-size: 13px; width: 100%; line-height: 186%; background-color: #FFF; color:#5a5655; font-family: "Microsoft YaHei",Arial,Helvetica,sans-serif; letter-spacing: 1px;}
*{ moz-user-select: -moz-none;  -moz-user-select: none;  -o-user-select:none;  -khtml-user-select:none;  -webkit-user-select:none;  -ms-user-select:none;  user-select:none; }

/* links */
a{color:#5a5655; text-decoration:none; outline:none !important;}
a:hover{color:#c00; text-decoration:none;} a:focus{outline:thin dotted;} a:hover,a:active{outline:0;}
a, a:hover, a:focus { text-decoration: none; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s; }


.pc-header { width: 100%; margin: 0 auto; background: #FFF; z-index: 9999999; position: fixed;}

/* Toper Star */
.toper { display: block; line-height: 36px; width: 100%; margin: 0 auto; border-bottom: solid 1px #dadada; /*-webkit-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); behavior: url(ie-css3.htc);*/}
    .toper .toperL { overflow: hidden; height: 36px; text-align: left;}
    .toper .toperR { text-align: right; overflow: hidden; height: 36px;}
    .toper .toperR>a { margin-right: 10px;}
/* Toper End */


/* Header Star */
.header { display: block; background: url("../img/headerLine.png") bottom center no-repeat;}
    .header .logoer { margin: 10px 0 0 15px; float: left; width: 20%;}
    .header .headerR { margin: 10px 15px 0 0; float: right; width: 63%; text-align: right;}
    .header .headerR .wechat-hotline { padding-bottom: 5px;}
    .header .headerR .wechat { max-height: 76px;}
    .header .headerR .hotline { max-height: 76px;}

    .header .mobile { display: none;}

    .header .headerR .menuer { text-align: right;}
    .header .headerR .menuer ul li { float: right; background:url("../img/menuLine.png") right center no-repeat; font-size: 17px; text-align: center; padding: 10px 32px;}
    .header .headerR .menuer ul li.active { font-weight: 700;}
    .header .headerR .menuer ul li:first-child { padding-right: 0px; background:none;}

.mobile-header { display: none;}

/* Header End */


/* Section Header Star */
.section-header { background: url("../img/blackLine.jpg") center repeat-x; margin: 20px 0;}
    .section-header .title { margin: 0 auto; width: 220px; text-align: center; background: #FFF;}
    .section-header .title h1 { font-size: 24px; font-weight: 700; color: #d81616;}
    .section-header .title p { font-size: 12px; font-weight: lighter; color: #d81616; text-transform: uppercase; margin: 5px 0 0 0;}
/* Section Header End */


/* Services Ico Star */
.services-ico { width: 90%; margin: 0 auto;}
    .services-ico ul li { float: left; width: 14.280000%; text-align: center;}
    .services-ico ul li .services-intro { margin: 10px 0 0 0;}
    .services-ico ul li .services-intro h1 { font-size: 18px; font-weight: 700;}
    .services-ico ul li .services-intro p { font-size: 12px; }

    .services-ico ul li.active .services-intro h1 { color: #cc0000;}
    .services-ico ul li.active .services-intro p { color: #cc0000;}

    /*
    .services-ico ul li.services-ico1 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico1.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico1 .services-imgs { background: url("../img/services/services-ico1-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico1 .services-imgs { background: url("../img/services/services-ico1-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico2 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico2.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico2 .services-imgs { background: url("../img/services/services-ico2-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico2 .services-imgs { background: url("../img/services/services-ico2-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico3 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico3.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico3 .services-imgs { background: url("../img/services/services-ico3-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico3 .services-imgs { background: url("../img/services/services-ico3-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico4 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico4.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico4 .services-imgs { background: url("../img/services/services-ico4-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico4 .services-imgs { background: url("../img/services/services-ico4-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico5 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico5.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico5 .services-imgs { background: url("../img/services/services-ico5-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico5 .services-imgs { background: url("../img/services/services-ico5-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico6 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico6.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico6 .services-imgs { background: url("../img/services/services-ico6-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico6 .services-imgs { background: url("../img/services/services-ico6-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico7 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico7.png") center no-repeat; background-size: 80%;}
    .services-ico ul li.active.services-ico7 .services-imgs { background: url("../img/services/services-ico7-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    .services-ico ul li:hover.services-ico7 .services-imgs { background: url("../img/services/services-ico7-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    */
/* Services Ico End */


/* Brand Category Star */
.brand-category ul li { float: left; font-size: 15px; text-align: left; margin: 0 0 10px 0; padding: 0 34px 0 33px; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(11n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:last-child { border-right:none;}
    .brand-category ul li.active a { color: #cc0000;}
/* Brand Category End */

/* Brand List Star*/
.brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:left; box-sizing:border-box; padding:5px; width:25%; overflow:hidden;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:20px; color: #fff; font-weight:700; vertical-align: middle; margin: 20px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: block; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
/* Brand List End */

/* Single Star */
.single-title { text-align: left; font-size: 22px; color: #333; font-weight: 700; margin: 0 0 10px 0;}
.single-more { text-align: left; font-size: 12px; color: #c00; font-weight: 700; margin: 5px 0 30px 0;}
    .single-more a { color: #c00;}
    .single-more a:hover { text-decoration: underline;}
/* Single End */

/* Infos List Star */
.infos-list { }
    .infos-list ul li { font-size: 13px; height: 28px; line-height: 28px; overflow: hidden; text-align: left;}
/* Infos List End */


/* Service Area Star */
.service-area { margin-bottom: 30px;}
    .service-area ul li { width: 8.333333%; float: left; text-align: left; font-size: 15px; margin: 0 0 5px 0;}
    .service-area ul li.active a { color: #cc0000;}

/* Service Area End */

/* Footer Star */
.footer { border-top: solid 1px #949494; text-align: left;}
    .footer .footer-content { margin: 20px 0;}
    .footer .footer-content .footer-quick { }
    .footer .footer-content .footer-quick a { margin: 0 8px 0 0;}
    .footer .footer-content .footer-links { overflow: hidden; }
    .footer .footer-content .footer-links a { margin: 0 8px 0 8px; overflow:hidden;}
    .footer .footer-content .footer-links a:first-child { margin-left: 0px;}

/* Footer End */
@media (max-width: 992px) {
	html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,
	ins,kbd,q,samp,small,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{ font-weight: normal;}
    /* Toper Star */
    .toper { display: none;}
    /* Toper End */

    /* Header Star */
    .header { display: none;}

    .mobile-header { display: block; border-bottom: solid 1px #dedede; background:rgba(255,255,255,.96);  z-index: 100; width: 100%; -webkit-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); behavior: url(ie-css3.htc);}
    .mobile-header .logoer { margin: 2px 0 2px 0; float: left; width: 20%;}
    .mobile-header .logoer img { height: 45px;}
    .mobile-header .headerR { margin: 5px 0 0 0; float: right; width: 63%; text-align: right;}
    /* Header End */

    .mobile-header .toggle { margin-top: -5px; padding-left: 20px;}
    .mobile-header .toggle:hover span, header .toggle:hover span::before, header .toggle:hover span::after { background: #999999; -moz-border-radius:1px; -webkit-border-radius:1px; border-radius:1px;}
    .hc-nav-trigger { right: 15px;}
    .mobile-header .toggle span, header .toggle span::before, header .toggle span::after { background-color: #999999;}
    .hc-nav-trigger span, .hc-nav-trigger span::before, .hc-nav-trigger span::after { background-color: #999999; -moz-border-radius:1px; -webkit-border-radius:1px; border-radius:1px;}
    .hc-offcanvas-nav .nav-container, .hc-offcanvas-nav .nav-wrapper, .hc-offcanvas-nav ul { background-color: #FFF;}
    .hc-offcanvas-nav h2 { color: #333; padding: 8px 17px; border-bottom: 1px solid #ddc5bc; text-align: left;}
    .hc-offcanvas-nav h2 img { height: 60px;}
    .hc-offcanvas-nav ul:first-of-type:not(:first-child)>li:first-child:not(.nav-back):not(.nav-close)>a { border-top: 1px solid #eaeaea;}
    .hc-offcanvas-nav ul:first-of-type:not(:first-child)>li:first-child:not(.nav-back):not(.nav-close)>a i { margin-right: 10px; color: #c3c3c3;}
    .hc-offcanvas-nav li.nav-close a, .hc-offcanvas-nav li.nav-back a { background: #ddc5bc; color:#FFF; border-top: 1px solid #ddc5bc; border-bottom: 1px solid #ddc5bc;}
    .hc-offcanvas-nav li.nav-close a:hover, .hc-offcanvas-nav li.nav-back a:hover { background: #ddc5bc;}
    .hc-offcanvas-nav a { border-bottom: 1px solid #eaeaea; color: #333;}
    .hc-offcanvas-nav:not(.touch-device) a:hover { background: #2d2f2e;}
    .hc-offcanvas-nav a[href]:not([href="#"])>span.nav-next { border-left: 1px solid #eaeaea;}
    .hc-offcanvas-nav span.nav-next::before, .hc-offcanvas-nav li.nav-back span::before { border-top: 2px solid #eaeaea;  border-left: 2px solid #eaeaea;}
    .hc-offcanvas-nav.nav-levels-overlap ul li i { margin-right: 10px; color: #c3c3c3;}


    /* Services Ico Star */
    .services-ico { width: 90%; margin: 0 auto;}
    .services-ico ul li { float: left; width: 33.333333%; text-align: center;}
    .services-ico ul li .services-intro { margin: 10px 0 0 0;}
    .services-ico ul li .services-intro h1 { font-size: 18px; font-weight: 700;}
    .services-ico ul li .services-intro p { font-size: 10px; height: 20px; overflow: hidden;}
    .services-ico ul li:last-child { display: none;}


    .services-ico ul li.services-ico1 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico1.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico1 .services-imgs { background: url("../img/services/services-ico1-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico2 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico2.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico2 .services-imgs { background: url("../img/services/services-ico2-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico3 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico3.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico3 .services-imgs { background: url("../img/services/services-ico3-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico4 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico4.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico4 .services-imgs { background: url("../img/services/services-ico4-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico5 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico5.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico5 .services-imgs { background: url("../img/services/services-ico5-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico6 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico6.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico6 .services-imgs { background: url("../img/services/services-ico6-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}

    .services-ico ul li.services-ico7 .services-imgs { display: block; height: 125px; background: url("../img/services/services-ico7.png") center no-repeat; background-size: 80%;}
    .services-ico ul li:hover.services-ico7 .services-imgs { background: url("../img/services/services-ico7-hover.png") center no-repeat; background-size: 80%; -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s;  -ms-transition: all .3s;  transition: all .3s;}
    /* Services Ico End */

    /* Brand Category Star */
    .brand-category ul li { float: left; font-size: 15px; width: 33.333333%; text-align: center; margin: 0 0 10px 0; padding: 0 0 0 0; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(3n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:nth-child(11n) { border-right: solid 1px #4f4d4c;}
    .brand-category ul li:last-child { border-right: solid 1px #4f4d4c;}
    /* Brand Category End */


    /* Brand List Star*/
    .brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:none; box-sizing:border-box; padding:5px; width:100%; overflow:hidden; margin: 0 0 10px 0;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:16px; color: #fff; font-weight:700; vertical-align: middle; margin: 20px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: none; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
    /* Brand List End */

    /* Single Star */
    .single-title { text-align: left; font-size: 22px; color: #333; font-weight: 700;}
    .single-more { text-align: left; font-size: 12px; color: #c00; font-weight: 700; margin: 5px 0 20px 0;}
    /* Single End */

    /* Infos List Star */
    .infos-list { }
    .infos-list ul li { font-size: 13px; height: 28px; line-height: 28px; overflow: hidden; text-align: left;}
    /* Infos List End */


    /* Service Area Star */
    .service-area { margin-bottom: 30px;}
    .service-area ul li { width: 20%; float: left; text-align: center; font-size: 15px; margin: 0 0 5px 0;}
    /* Service Area End */

}

@media (min-width: 992px) {
	html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,
	ins,kbd,q,samp,small,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{ font-weight: normal;}
    /* Header Star */
    .header { background: url("../img/headerLine.png") bottom center no-repeat;}
    .header .logoer { margin: 10px 0 0 15px; float: left; width: 20%;}
    .header .headerR { margin: 10px 15px 0 0; float: right; width: 63%; text-align: right;}
    .header .headerR .wechat-hotline { padding-bottom: 5px;}
    .header .headerR .wechat { max-height: 76px;}
    .header .headerR .hotline { max-height: 76px;}

    .header .headerR .menuer { text-align: right;}
    .header .headerR .menuer ul li { float: right; background:url("../img/menuLine.png") right center no-repeat; font-size: 16px; text-align: center; padding: 10px 10px 10px 10px;}
    .header .headerR .menuer ul li.active { font-weight: 700;}
    .header .headerR .menuer ul li:first-child { padding-right: 0px; background:none;}
    /* Header End */

    /* Brand Category Star */
    .brand-category ul li { float: left; font-size: 15px; text-align: left; margin: 0 0 10px 0; padding: 0 7px 0 7px; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(11n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:last-child { border-right:none;}
    /* Brand Category End */

    /* Brand List Star*/
    .brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:left; box-sizing:border-box; padding:5px; width:33.333333%; overflow:hidden;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:20px; color: #fff; font-weight:700; vertical-align: middle; margin: 10px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: none; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
    /* Brand List End */
}

@media (min-width: 1200px) {
    /* Header Star */
    .header { background: url("../img/headerLine.png") bottom center no-repeat;}
    .header .logoer { margin: 10px 0 0 15px; float: left; width: 20%;}
    .header .headerR { margin: 10px 15px 0 0; float: right; width: 63%; text-align: right;}
    .header .headerR .wechat-hotline { padding-bottom: 5px;}
    .header .headerR .wechat { max-height: 76px;}
    .header .headerR .hotline { max-height: 76px;}

    .header .headerR .menuer { text-align: right;}
    .header .headerR .menuer ul li { float: right; background:url("../img/menuLine.png") right center no-repeat; font-size: 17px; text-align: center; padding: 10px 17.850001px;}
    .header .headerR .menuer ul li.active { font-weight: 700;}
    .header .headerR .menuer ul li:first-child { padding-right: 0px; background:none;}
    /* Header End */

    /* Brand Category Star */
    .brand-category ul li { float: left; font-size: 15px; text-align: left; margin: 0 0 10px 0; padding: 0 17px 0 17px; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(11n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:last-child { border-right:none;}
    /* Brand Category End */

    /* Brand List Star*/
    .brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:left; box-sizing:border-box; padding:5px; width:33.333333%; overflow:hidden;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:20px; color: #fff; font-weight:700; vertical-align: middle; margin: 20px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: block; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
    /* Brand List End */
}

@media (min-width: 1366px) {
    /* Header Star */
    .header { background: url("../img/headerLine.png") bottom center no-repeat;}
    .header .logoer { margin: 10px 0 0 15px; float: left; width: 20%;}
    .header .headerR { margin: 10px 15px 0 0; float: right; width: 63%; text-align: right;}
    .header .headerR .wechat-hotline { padding-bottom: 5px;}
    .header .headerR .wechat { max-height: 76px;}
    .header .headerR .hotline { max-height: 76px;}

    .header .headerR .menuer { text-align: right;}
    .header .headerR .menuer ul li { float: right; background:url("../img/menuLine.png") right center no-repeat; font-size: 17px; text-align: center; padding: 10px 19px;}
    .header .headerR .menuer ul li.active { font-weight: 700;}
    .header .headerR .menuer ul li:first-child { padding-right: 0px; background:none;}
    /* Header End */

    /* Brand Category Star */
    .brand-category ul li { float: left; font-size: 15px; text-align: left; margin: 0 0 10px 0; padding: 0 19px 0 19px; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(11n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:last-child { border-right:none;}
    /* Brand Category End */

    /* Brand List Star*/
    .brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:left; box-sizing:border-box; padding:5px; width:33.333333%; overflow:hidden;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:20px; color: #fff; font-weight:700; vertical-align: middle; margin: 20px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: block; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
    /* Brand List End */
}

@media (min-width: 1920px) {
    /* Header Star */
    .header { background: url("../img/headerLine.png") bottom center no-repeat;}
    .header .logoer { margin: 10px 0 0 15px; float: left; width: 20%;}
    .header .headerR { margin: 10px 15px 0 0; float: right; width: 63%; text-align: right;}
    .header .headerR .wechat-hotline { padding-bottom: 5px;}
    .header .headerR .wechat { max-height: 76px;}
    .header .headerR .hotline { max-height: 76px;}

    .header .headerR .menuer { text-align: right;}
    .header .headerR .menuer ul li { float: right; background:url("../img/menuLine.png") right center no-repeat; font-size: 17px; text-align: center; padding: 10px 32px;}
    .header .headerR .menuer ul li.active { font-weight: 700;}
    .header .headerR .menuer ul li:first-child { padding-right: 0px; background:none;}
    /* Header End */

    /* Brand Category Star */
    .brand-category ul li { float: left; font-size: 15px; text-align: left; margin: 0 0 10px 0; padding: 0 34px 0 33px; border-right: solid 1px #4f4d4c;}
    .brand-category ul li:nth-child(1),.brand-category ul li:nth-child(12),.brand-category ul li:nth-child(23) { padding-left: 0px;}
    .brand-category ul li:nth-child(11n) { border-right:none; padding-right: 0px;}
    .brand-category ul li:last-child { border-right:none;}
    /* Brand Category End */

    /* Brand List Star*/
    .brand-box{ margin: 0 15px; position:relative;}
    .brand-box .brand-list { margin:20px -5px 0; position:relative; z-index:2; overflow:hidden;}
    .brand-box .brand-list li { float:left; box-sizing:border-box; padding:5px; width:25%; overflow:hidden;}
    .brand-box .brand-list li img { max-width: 100%;}
    .brand-box .brand-list li .item{position: relative; }
    .brand-box .brand-list li a{ display:block; width:100%; height:100%; position: absolute;left: 0;top: 0; z-index: 4;}
    .brand-box .brand-list li .mask_layer{ background: rgba(204,0,0,0.80); position:absolute;  left: 0; top: 0; width: 100%; height: 100%;  z-index: 2; opacity: 0;}
    .brand-box .brand-list li .shadow { position: absolute; top: 30px; width: 100%; z-index: 3; opacity: 0; height:100%;text-align: left; padding: 0 30px; vertical-align: middle;}
    .brand-box .brand-list li .shadow .category { font-size:16px; color: #fff; font-weight:500; vertical-align: middle; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .project { font-size:15px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 0px 0 0 0;}
    .brand-box .brand-list li .shadow .name{ font-size:20px; color: #fff; font-weight:700; vertical-align: middle; margin: 20px 0 0 0; text-align:left; width:100%;}
    .brand-box .brand-list li .shadow .intro { display: block; font-size:12px; color: #fff; font-weight:lighter; vertical-align: middle; text-align:left; width:100%; margin: 10px 0 0 0;}
    .brand-box .brand-list li .shadow .more { font-size:13px; margin: 12px 0 0 0; padding: 5px 0 0 0; color: #fff; font-weight:lighter; border-top: solid 3px #FFF; vertical-align: middle; text-align:right; width:100%;}
    /* Brand List End */

}