* {font-size: 14px;padding: 0;margin: 0;box-sizing: border-box;}
ul,li {list-style: none;}
a {color: #000000;text-decoration: none;}
.banner {display: block;width: 94%;height: auto;margin: 10px auto;}
.banner img {width: 100%;height: 100%;border-radius: 10px;}
.container {position: relative;display: flex;flex-direction: column;width: 100%;height: auto;background-color: rgb(247, 247, 247);}
.search-box {display: flex;justify-content: center;align-items: center;width: 96%;padding: 0 16px;margin: 15px auto 20px;border-radius: 26px;color: rgb(196, 196, 196);background-color: #fff;box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 4px 0px;}
.search-input {display: flex;flex: 1;flex-direction: row;align-items: center;height: 33px;font-size: 13px;}
.search-input-icon {display: flex;width: 24px;height: 33px;padding: 0 6px 0 3px;justify-content: center;align-items: center;}
.search-input input {display: block;width: 100%;height: 100%;color: rgb(166, 166, 166);background: inherit;outline: none;border: none;}
.search-submit {display: block;width: 24px;height: 38px;line-height: 42px;font-size: 1.7rem;color: inherit;background-color: inherit;border: none;}
.nav-two {display: flex;align-items: center;justify-content: space-between;width: 96%;margin: 0 auto;}
.nav-two > .nav-item {display: flex;justify-content: center;align-items: center;width: 48%;height: 38px;line-height: 38px;border-radius: 26px;text-align: center;color: #737373;background-color: #fff;box-shadow: 0 0 4px 0 rgba(0,0,0,.12);}
.nav-two > .nav-item.cursor_pointer {cursor: pointer;}
.nav-two > .nav-item svg {color: #ce4949;margin-right: 3px;}
.hot-brands > .brand-title,.hot-categories > .category-title {display: block;font-size: 1.2rem;font-weight: bold;color: #303133;text-align: center;margin: 15px 0;}
.hot-brands > .brand-content,.hot-categories > .category-content {display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: center;width: 100%;}
.hot-brands > .brand-content > .brand-item,.hot-categories > .category-content > .category-item {width: 25%;}
.hot-brands > .brand-content > .brand-item a,.hot-categories > .category-content > .category-item a {display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 6px;}
.hot-brands > .brand-content > .brand-item a > img,.hot-categories > .category-content > .category-item a > img {display: inline-block;width: 62px;height: 62px;border-radius: 50%;margin-bottom: 6px;}
.modal {position: fixed;display:flex;justify-content: center;padding-top:100px;top: 0;left: 0;width: 100%;height: 100vh;background-color: rgba(0, 0, 0, 0.5);z-index: 1050;}
.categories-modal, .brands-modal {margin: auto !important;position: relative;display: block;width: 96%;height: 80%;max-height:580px;max-width: 956px;border-radius: 4px;background-color: #FFFFFF;}
.modal .modal-close {position: absolute;top: 10px;right: 10px;width: 25px;height: 25px;font-size: 25px;font-weight: bold;cursor: pointer;}
.modal .modal-title {display: block;width: 100%;height: 56px;font-weight: normal;font-size: 1.3rem;line-height: 56px;text-align: left;padding: 0 24px;border: 1px solid #dedada;border-radius-topleft: 4px;border-radius-topright: 4px;}
.modal .modal-body {display: flex;width: 100%;height: calc(100% - 56px);background-color: inherit;border-top: 1px solid #eee;}
.modal .modal-body .tab-list {display: flex;flex-direction: column;width: 30%;height: 100%;border-right: 1px solid #eee;}
.modal .modal-body .tab-list .tab-btn {display: block;width: 100%;height: 40px;line-height: 40px;text-align: center;color: #555;border-bottom: 1px solid #eee;}
.modal .modal-body .tab-list .tab-btn.active {width: calc(100% + 1px);border-right: 1px solid #fff;border-left: 4px solid #f81d44;}
.modal .modal-body .tab-list .tab-btns {display: block;width: 100%;height: 40px;line-height: 40px;text-align: center;color: #555;border-bottom: 1px solid #eee;}
.modal .modal-body .tab-list .tab-btns.active {width: calc(100% + 1px);border-right: 1px solid #fff;border-left: 4px solid #f81d44;}
.modal .modal-body .tab-content {display: block;width: 70%;height: 100%;padding: 6px;overflow-y: auto;}
.modal .modal-body .tab-content .tab-item {width: 100%;}
.modal .modal-body .tab-content .tab-item h2 {display: block;font-weight: bold;font-size: 1.2rem;margin: 6px;}
.modal .modal-body .tab-content .tab-item.active {display: block;}
.modal .modal-body .tab-content .tab-item .tab-content-group {display: grid;grid-gap: 6px;grid-template-columns: repeat(2, 1fr);}
.modal .modal-body .tab-content .tab-item .tab-content-group .tab-content-group-item {display: inline-block;height: 40px;width:100%;font-size: .75rem;line-height: 40px;text-align: center;color: #555;background-color: #f3f3f3;}
/*.modal.hide, .categories-modal.hide, .brands-modal.hide  {display: none;}*/
.mainflex{
    grid-template-columns: repeat(3, 1fr);width: 100%;justify-content: space-around;
}

.mainLi{
    margin-top: 10px;
    width: 100%;background-color: #fff;border-radius: 8px;overflow: hidden;    box-shadow: rgb(231 231 231) 0px 0px 0px 1px;
}
.moind{
    background-color: #f4f4f4;height: 100%;margin-top: 30px;
}
.moininde{
    margin-top: 30px;
}
.abc {padding-bottom: 150px!important;height: 100%!important;}
.abcd {margin:  20px}
.abcde {display: flex;justify-content: space-between;align-items: center;}
.abcdef {font-weight: bold;margin-top: 15px;}
.abcdefg {font-weight: 500;margin-top: 15px;}
.abcdefgh {font-weight: bold;margin-top: 20px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.abcdefghi {display: flex;align-items: center;padding:8px;}
.abcdefghij {width: 100px;height:100px;border-radius: 8px;margin-right:8px;}
.abcdefghijk {font-size: 13px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.abcdefghijkl {font-size: 13px;font-weight: bold;margin-top: 20px; }
/* .mainflex{
    grid-template-columns: repeat(3, 1fr);width: 100%;display: flex;justify-content: space-around;
}
.mainLi{
    width: 32%;background-color: #fff;border-radius: 8px;overflow: hidden;
} */
@media (max-width: 959px) {[data-device='pc'] {display: none;}}
@media (min-width: 958px) {
    body {position: relative;display: flex;justify-content: center;flex-wrap: wrap; min-height: 100vh;background-color: #f5f5f5;}
    .container {width: 858px;background-color: #FFFFFF;border-radius: 12px;box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 4px 0px;}
    .nav-two {display: flex;align-items: center;justify-content: space-between;width: 100%;height: 64px;border-bottom: 1px solid #eee;padding: 0 8%;margin: 0;}
    .nav-two > .nav-item {align-items: center;width: auto;background-color: inherit;border: none;border-radius: unset;box-shadow: none;}
    .nav-two > .nav-item svg {margin: 6px;}
    .nav-two > .nav-item span {font-weight: 600;font-size: 1.25rem!important;}
    .nav-two > .nav-item .logo {height: 41px; width: 49px;}
    .search-box {position: relative;display: block;width: 300px;margin: 0;padding: 0;border: 0;border-radius: 26px;color: inherit;background-color: inherit;box-shadow: none;}
    .search-input-icon {position: absolute;top: 6px;left: 10px;max-width: 100%;height: auto;max-height: 100%;color: #222222;margin-top: 2px;z-index: 9;}
    .search-input {position: relative;width: 300px;height: 30px;background-color: #fff;line-height: 1.4em;font-size: 16px;border: 1px #bf5c57 solid;border-radius: 20px;padding: 0 100px 0 30px;outline: none;}
    .search-submit {position: absolute;right: 0;top: 0;width: 94px;height: 30px;border: none;border-radius: 20px;color: #fff;font-size: 1.25rem;line-height: 30px;background-color: #bf5c57;cursor: pointer;}
    .banner {width: 80%;}
    .banner img {width: 90% !important; height: 78% !important;}
    .hot-brands, .hot-categories {width: 94%;margin: 0 auto;}
    .hot-brands > .brand-title,.hot-categories > .category-title {text-align: left;font-size: 1.5rem;}
    .hot-brands > .brand-content, .hot-categories > .category-content {display: grid;}
    .hot-brands > .brand-content > .brand-item, .hot-categories > .category-content > .category-item {width: 100%;}
    .hot-brands > .brand-content {grid-gap: 12px;grid-template-columns: repeat(3, 1fr);}
    .hot-brands > .brand-content > .brand-item a {flex-direction: unset;justify-content: flex-start;border-radius: 12px;background-color: #f7f9fa;padding: 8px;}
    .hot-brands > .brand-content > .brand-item a > img {width: 138px;height: 138px;border-radius: 12px;margin: 0;}
    .hot-brands > .brand-content > .brand-item a > span, .hot-categories > .category-content > .category-item a > span {display: inline-block;width: 100%;text-align: center;font-weight: 600;font-size: 1.1rem;}
    .hot-categories > .category-content {grid-gap: 12px;grid-template-columns: repeat(6, 1fr);}
    .hot-categories > .category-content > .category-item a {border-radius: 12px;background-color: #f7f9fa;padding: 8px;margin-bottom: 12px;}
    .hot-categories > .category-content > .category-item a > img {width: 100%;height: auto;border-radius: 12px;margin: 0;}
    .hot-categories > .category-content > .category-item a > span {height: 50px;line-height: 50px;}
    .modal .modal-body .tab-content .tab-item .tab-content-group {grid-template-columns: repeat(4, 1fr);}
    .mainflex{
        grid-template-columns: repeat(3, 1fr);width: 100%;display: flex;justify-content: space-around;
    }
    .mainLi{
        width: 32%;background-color: #fff;border-radius: 8px;overflow: hidden;    box-shadow: rgb(231 231 231) 0px 0px 0px 1px;
    }

    .moind{
        background-color: #f4f4f4;padding-bottom: 10px;height: 170px;
    }
    .moininde{
        margin-top: 80px;
    }
    /* .mainflex {display: block !important;} */
    [data-device='mobile'] {display: none;}
}
@media (min-width: 1170px) {.container {max-width: 1170px;width: 100%;}}