section {
    margin: 0 auto 0;
    overflow: hidden;
    position: relative;
}
footer {
    margin: 20px auto 40px;
}


.cat_name {
    display: block;
    overflow: hidden;
    padding: 10px;
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    text-transform: uppercase;
}
.empty {
    padding: 30px 0;
    text-align: center
}
#owl-home {
    display: block;
}

#owl-home .item img {
    display: block;
    width: 100%;
    height: auto
}
#owl-home .owl-pagination {text-align: center}
#owl-home .owl-controls .owl-page span {
    width: 4px;
    height: 4px;
    border: 1px solid #ccc;
    background: none
}

#owl-home .owl-controls .owl-page.active span {
    background: #fe7705;
    border: 1px solid #fe7705
}

#owl-home .item {
    display: none
}

#owl-home .item:first-child {
    display: block
}

#owl-home.owl-theme .item:first-child {
    display: block
}

#owl-home .owl-item.loading {
    background: none
}

/*goods List */
.homeproduct {
    clear: both;
    display: block;
    background: #fff;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    flex: 1 100%;
    border-bottom: 1px solid #f9f9f9
}

.homeproduct li {
    float: left;
    position: relative;
    background: #fff;
    width: 49.7%;
    overflow: hidden;
    border-top: 1px solid #f9f9f9;
    border-right: 1px solid #f9f9f9
}

.homeproduct li a {
    display: block;
    overflow: hidden;
    padding: 10px 0
}

.homeproduct li h3 {
    display: block;
    overflow: hidden;
    line-height: 1.3em;
    font-size: 14px;
    color: #222;
    clear: both;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0 10px
}


.homeproduct li .price {
    display: block;
    overflow: hidden;
    padding: 5px 10px 5px 10px
}


.homeproduct li strong {
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    font-size: 14px;
    color: #111;
    font-weight: 600;
    line-height: 15px
}

.homeproduct li del {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    margin-left: 5px;
    text-decoration: line-through;
    color: #222
}

.homeproduct li img {
    display: block;
    margin: 10px auto;
    height: 200px;
    width: 200px
}


.homeproduct li label {
    display: inline-block;
    position: absolute;
    top: 142px;
    left: 10px;
    font-size: 11px;
    color: #fff;
    font-weight: 600;
    background: #3fb846;
    border-radius: 3px;
    padding: 0 5px;
    height: 18px
}

.homeproduct li label.discount {
    background-image: linear-gradient(-90deg, #ec1f1f 0%, #ff9c00 100%);
    border-radius: 10px;
    padding: 1px 7px;
    padding-left: 0;
    padding-right: 10px
}

.homeproduct li label.discount:before {
    content: ' ';
    display: inline-block;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAaCAYAAAC+aNwHAAAABGdBTUEAALGPC/xhBQAAAVpJREFUOBGVki1LBFEUhueuH0FQTAuimxVE2KZBgxj8AxaLglj8AYLJZLOYtFpFwWQ2iMUkiyBqNCloEFEQYXzuzl7mzP0Y7z3w7j0f73PuDDtZFhl5njfRI5qJREobUB+6RL9otJxEZkD7SMd1JFLagFa6aPGzW04iMpgp9CEWzEZghQVoGN0L+I28kbLgVMA6PUmBty1YlxtRCzAuIv132THx7wKIcfRik9R3IbjfDDANkp+hpumJ8535pqhN+mySDMMhSo1OdwHUWiqJ/wu19c3tXsGRFOvm9k4SVpiPzLsr6mWKlmmIc568uEU0SW/QglLqp9q2KhYfe57slZ7vsiqNqYHs70F/XEtVZ6DCOIfs2AnY3TbknkWfUyvXGehgvhULHshHAla3jbkl4E/yaddV0wHYEgtWa6z+EfBFb8GB31HTBRxC3+gKDdRY/SOgSfSExvwOt/sHwv9i4NYIgYYAAAAASUVORK5CYII=');
    background-size: 50% 50%;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #f13500;
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-right: 5px
}

.homeproduct .percent {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    padding-bottom: 4px;
    color: rgb(255, 255, 255);
    font-weight: 500;
    width: 40px;
    height: 32px;
    background-image: url(../img/deal-tag.png);
    background-size: 40px 36px;
    margin: 1px 0px 0px;
    background-position: 0px 0px;
}
.homeproduct .ratingresult {
    padding: 5px 10px
}

.homeproduct .ratingresult span {
    color: #777;
    text-decoration: none;
    position: relative;
    top: 1px;
    font-size: 12px;
}

.rank{display:inline-block;height:12px;width:70px;text-indent:-999em;background:url('../img/stars.gif') no-repeat left top;vertical-align: middle;background-size: 65px 67px;}
.rank_star{background-position:0 0;width: 12px}
.rank_2{background-position:0 -14px}
.rank_3{background-position:0 -27px}
.rank_4{background-position:0 -40px}
.rank_5{background-position:0 -52px}


.homeproduct li .promotion {
    display: block;
    max-height: 36px;
    overflow: hidden;
    padding: 0 10px;
}
.homeproduct li .promotion p {
    color: #666;
    display: block;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.homeproduct li .promotion p::before {
    color: #999;
    content: "•";
    display: inline-block;
    font-size: 16px;
    margin-right: 5px;
    vertical-align: middle;
}
.display_list li {
    width: 100%;
    display: block !important;
}
.display_list  li img {
    display: block !important;
    margin: 0 10px !important;
    width: 98% !important;
    height: 98% !important;
}


/* promo */

/* scroll */
.overpromo {
    display: block;
    background: transparent;
    overflow-y: hidden;
    overflow-x: auto;
    -ms-overflow-style: none;
    -ms-scroll-snap-type: mandatory;
    -ms-scroll-snap-points-x: snapInterval(0%, 100%);
    -ms-scroll-chaining: chained;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    position: relative;
    z-index: 2;
    margin-bottom: 0
}

.overpromo::-webkit-scrollbar {
    width: 0;
    height: 0
}

.overpromo::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px
}

.overpromo::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px
}
.listpromo {
    background: #f4f4f4;
    padding: 5px 0;
    position: relative;
    z-index: 1;
    width: 2000px
}

.listpromo li {
    float: left;
    width: 150px;
    background: #fff;
    position: relative;
    padding: 0;
    margin-left: 5px;
    border: 1px solid #ddd;
    border-radius: 4px
}

.listpromo li img {
    width: 130px;
    height: 130px
}

.listpromo li label {
    top: 132px;
    left: 5px
}

.listpromo li strong {
    font-size: 13px
}

.listpromo li h3,
.listpromo li .overpromo {
    padding-left: 5px;
    padding-right: 5px
}

.listpromo li .price {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 4px 5px 10px 5px
}

.listpromo li .promo {
    padding: 0 5px
}

/* catesearch */

.catesearch {
    display: block;
    background: #f4f4f4;
    padding: 10px;
}

.catesearch form {
    display: block;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #fff;
    height: 34px;
    position: relative
}

.catesearch input {
    display: block;
    border: 0;
    background: #fff;
    padding: 10px;
    height: 34px;
    border-radius: 3px;
    width: 90%
}

.catesearch .submit {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px 10px;
    background: #fff;
    height: 16px;
    border-radius: 0 3px 3px 0;
    border: 0;
    height: 34px
}

.catesearch .reset {
    display: none;
    position: absolute;
    top: 0;
    right: 34px;
    width: 30px;
    height: 34px;
    border: 0;
    background: #fff;
    border: 0
}

.pagination{padding:15px 0 10px;font-size:14px;clear:both}
.pagination a{color:#999;margin:5px 0 5px 3px;padding:4px 9px;background-color:#eee;border:1px solid #bbb;border-radius:3px;display: inline-block}
.pagination a:hover{color:#666;text-decoration:none;background-color:#ddd;border-color:#999}
.pagination a.current{color:#ff8c22;background-color:#ffe8ce;border-color:#ff8c22}
.pagination span{padding:5px 10px}
.pagination .total{
    color:#333;
}



/*table */
table{width: 100%; max-width: 100% }
table>thead>tr>th {border-bottom: 1px solid #bbb; text-align: left; font-weight: 600; }
table>tbody>tr>td, table>tbody>tr>th, table>tfoot>tr>td, table>tfoot>tr>th, table>thead>tr>td, table>thead>tr>th {
    padding: 8px 10px; line-height: 1.5384616; vertical-align: middle; border-top: 1px solid #ddd
}
table td, table th, table tr{transition: background-color .15s ease-in-out }
table tbody>tr:nth-of-type(odd) {background-color: #fcfcfc; }
table>tbody>tr:hover, table>tbody>tr.active>td, table>tbody>tr.active>th, table>tbody>tr>td.active, table>tbody>tr>th.active, table>tfoot>tr.active>td, table>tfoot>tr.active>th, table>tfoot>tr>td.active, table>tfoot>tr>th.active, table>thead>tr.active>td, table>thead>tr.active>th, table>thead>tr>td.active, table>thead>tr>th.active {
    background-color: #f6f6f6;
}

article{display: block; overflow: hidden;padding: 10px}
article p, article div, article h2, article h3, article h4 {
    margin: 5px auto 5px;
    font-size: 14px;
    color: #333;
    line-height: 28px;
}
article a, article a:hover, article a:active {color: #288ad6;font-size: 15px}
article h3, article h3 a{font-size: 16px}
article h2, article h2 a {font-size: 15px}
article h4, article h4 a{font-size: 15px}
article div {margin-top: 0}
article div em, article p em{font-style: italic}
article h2, article h3, article h4, article h5{font-weight: 700;margin: 10px auto;}
article ul{list-style: disc;margin-left: 30px}
article ol{margin-left: 30px;list-style: disc;}

article table {
    margin: 10px auto;
    border-collapse: collapse;
    max-width: 100%;
    font-weight: 300;
    width: 100%
}

article table+table {
    margin-top: 15px
}

article table ul,
article table ol {
    width: auto
}

article td,
article th {
    padding: .3em;
    border: 1px #ccc solid;
    width: auto
}

article td p,
article th p {
    width: auto
}

article img {
    display: block;
    height: auto;
    margin: 10px auto 5px;
    max-width: 100%;
    width: auto;
}


article .short_view {
    max-height: 150px;
    clear: both;
    overflow: hidden;
    display: block;
}
article .view-more {background: #fff;width: 100%;min-height: 50px}
article .view-more p {margin-top: 20px; text-align: center}
article .view-more p span { width: 50px;color: #288ad6  ;cursor: pointer;border:1px solid  #288ad6;padding:8px 25px;border-radius: 3px;background: #fff}
article .view-more p span:hover{background: #288ad6;color: #fff}


.choosedfilter {
    display: block;
    overflow: hidden;
    background: #fff;
    margin:5px 0;
    padding: 0 5px;
    box-sizing: border-box;
}

.choosedfilter a {
    display: inline-block;
    vertical-align: text-bottom;
    padding: 6px;
    background: #288ad6;
    font-size: 12px;
    color: #fff;
    border-radius: 4px;
    margin: 2px
}

.choosedfilter a:after {
    content: "x";
    display: inline-block;
    color: #fff;
    margin-left: 8px;
}
.choosedfilter a.reset {
    background: #c10017
}





.scrollmenu {
    display: block;
    background: transparent;
    overflow-y: hidden;
    overflow-x: scroll;
    -ms-overflow-style: none;
    -ms-scroll-snap-type: mandatory;
    -ms-scroll-snap-points-x: snapInterval(0%,100%);
    -ms-scroll-chaining: chained;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    position: relative;
    z-index: 2;
    margin: 0;
}

.brand_menu {
    display: block;
    background: transparent;
    overflow-y: hidden;
    overflow-x: auto;
    -ms-overflow-style: none;
    -ms-scroll-snap-type: mandatory;
    -ms-scroll-snap-points-x: snapInterval(0%,100%);
    -ms-scroll-chaining: chained;
    -webkit-overflow-scrolling: touch;
    padding: 5px 0;
    background: #fafafa;
}
.img_filter {
    background-color: transparent;
    white-space: normal;
    width: auto;
    text-align: center;
    height: 100%;
}
.img_filter.expand {
    height: 90px;
    overflow: hidden;
}

.img_filter a {
    display: inline-block;
    border: 1px solid #111;
    border-radius: 4px;
    height: 40px;
    position: relative;
    width: 27%;
    padding: 0 5px;
    margin: 5px 2px;
    vertical-align: top;
    color:#111;
    margin-bottom: 3px;
    background-color: #fff;
}
.img_filter a.morecate span {
    font-size: 12px;
    color: #333;
    display: block;
    text-align: center;
    padding-top: 6px;
    line-height: 1.2;
}
.img_filter a.collapsecate {
    height: auto;
    margin-top: 10px;
    color: #288ad6;
    border: none;
    background-color: transparent;
    display: block;
    width: auto;
    margin-bottom: 15px;
    text-align: center;
}
.img_filter a.collapsecate:after {
    content: '';
    width: 0;
    height: 0;
    border-bottom: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 2px 3px;
}
.img_filter a img{
    padding: 0;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 20px;
    width: auto;
    display: block;
}


.filter_scroll {
    padding: 0 10px 10px 10px;
    display: block;
    background: transparent;
    overflow-y: hidden;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-bottom: 1px solid #eee;
    margin-bottom: 3px;
    -ms-overflow-style: none;
    -ms-scroll-snap-type: mandatory;
    -ms-scroll-snap-points-x: snapInterval(0%,100%);
    -ms-scroll-chaining: chained;
}

.filter_price{
    padding-top: 10px;
    margin-bottom: 0;
    background-color: #fff;
}

.filter_scroll div {
    white-space: nowrap;
}
.filter_scroll a {
    color: #288ad6;
    padding-right: 10px;
}




/* filter */
.filter {
    display: block;
    padding: 0 10px;
    position: relative;
    box-sizing: border-box;
}

.filter li {
    display: inline-block;
    line-height: 40px;
    width: 33%;
    text-align: center;
    /*margin-right: 15px;*/
    float: left;
}

.filter li:first-child {
    max-width: 50%;
    float: left;
}

.filter li .criteria,
.filter li .selected {
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap
}

.filter li .criteria:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 4px solid #333;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin-left: 1px
}

.filter li div {
    display: none;
    overflow: visible;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1);
    padding: 5px 10px;
    position: absolute;
    left: 10px;
    right: 10px;
    top: 40px;
    z-index: 9;
    text-align: left
}

.filter li div:before,
.filter li div:after {
    content: '';
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 10%;
    border-bottom: 10px solid #d9d9d9;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.filter li div:after {
    border-width: 9px;
    border-bottom-color: #fff;
    margin-left: 1px
}

.filter li label {
    display: block;
    padding: 5px 0 6px
}

.filter li label a {
    color: #333
}


.filter li label span {
    height: 15px;
    width: 15px;
    display: inline-block;
    margin-right: 5px;
    border: 1px solid #ececec;
    line-height: 15px;
    vertical-align: middle;
    text-align: center;
    border-radius: 3px;
}

.filter li label span.check {
    background: #4a90e2;
    color:#fff;
    border: 1px solid #4a90e2!important;
}


.iconmobile-closefil {
    width: 20px;
    height: 20px;
    background-position: -205px -100px
}

.filter li .closefilter {
    position: absolute;
    right: 8px;
    top: 10px;
    background: none;
    color: #333;
    font-weight: bold;
    border:1px solid #ddd;
    text-align: center;
    border-radius: 10px

}
.filter li:nth-child(2) .feature:before, .filter li:nth-child(2) .feature:after {
    left: 47%;
}

.filter li:nth-child(3) .feature:before, .filter li:nth-child(3) .feature:after {
    left: 80%;
}

.filter li.filter_sort .sortprice {
    top: 86px;
}
.filter li.filter_sort .sortprice:before, .filter li .sortprice:after {
    left: 5%;
}




.articles_relate li {
    display: block;
    overflow: hidden;
    padding: 5px 0;
    display: block;
    margin: 0 10px;
}
.articles_relate li a {
    display: block;
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 10px;
    padding-bottom: 10px;
}

.articles_relate li a img {
    float: left;
    width: 100px;
    height: auto;
    margin-right: 10px;
}
.articles_relate li a h3 {
    display: block;
    overflow: hidden;
    line-height: 1.3em;
    font-size: 12px;
    font-weight: bold;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
}
.articles_relate li a p {
    vertical-align: middle;
    color: #666;
    cursor: pointer;
    font-size: 12px;
    margin-top: 1%;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
}


.catetag {
    display: block;
    overflow: hidden;
    background: #f4f4f4;
    padding: 10px 10px 0 10px;
    margin-top: 20px;
}
.catetag a {
    display: inline-block;
    vertical-align: top;
    padding: 6px 0;
    text-align: center;
    font-size: 12px;
    color: #288ad6;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 31.5%;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    background: #fff;
    margin: 0 5px 5px 0;
}
.catetag a:nth-child(3n + 3) {
    margin-right: 0;
}


.video-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed{position:absolute;top:0;left:0;width:100%;height:100%;}

.table_responsive{
    overflow-x:auto
}
.youtube_box {width: 100%;height: 100%;}

.youtube-play {
    display: block;
    margin: 10px auto;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.youtube-play .btnYt {
    background: #bc000b;
    width: 90px;
    height: 55px;
    border-radius: 6px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    position: absolute;
    z-index: 2;
    left: 44%;
    top: 34%;
}

.youtube-play .btnYt .icyt {
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
    border-left: 26px solid #fff;
    display: block;
    position: absolute;
    top: 14px;
    left: 50%;
    margin-left: -9px;
}

.youtube-play p{
    padding: 5px;
    overflow: hidden;
    text-align: center;
}
@media screen and (min-width:414px) {
    .display_list li {
        width: 49.7%;
        display: unset;
    }
}
@media screen and (max-width:414px) {
    .catetag a {
        width: 47%;
    }
    .homeproduct li img {width: 140px;height: 140px;}
}

@media screen and (max-width:320px) {
    .homeproduct li {width: 49%}
    .homeproduct li img {
        width: 120px;
        height: 120px;
    }
   
}