@charset "utf-8";
/*顶部*/
.head-box {
    width: 100%;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
}
.head-top {
    height: 44px;
}
.head-top .-logo {
    width: 96px;
    height: 20px;
    background-image: url('/assets/img/logo.png');
    background-size: 96px 20px;
    background-repeat: no-repeat;
}
.head-top .-nav-btn {
    width: 16px;
    height: 16px;
    background-image: url('/assets/img/list-01.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
/*搜索*/
.search {
    position: relative;
    width: 100%;
    border-bottom: 1px solid rgba(27, 24, 24, 0.2);
    padding: 10px 0px;
}

.search .-input {
    width: 100%;
    height: 24px;
    line-height: 24px;
    margin-right: 10px;
}

.search .-icon {
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('/assets/img/search-01.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.search .-record-box{
    position:absolute;
    top:45px;
    left:0px;
    max-height: calc(100vh - 300px);
    overflow: auto;
    background-color: #ffffff;
    width:100%;
    padding:0px;
    box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -o-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -ms-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    z-index:999;
}

.search .-record-box .-no-record,
.search .-record-box .-content{
    margin:10px 20px;
    color:#5A5A63;
}

.search .-record-box .-content .-record{
    margin-top:22px;
}

.search .-record-box .-content .-record .-info{
    color:#1B1818;
    flex: 1;
}

.search .-record-box .-content .-record .-del-icon {
    display: block;
    width: 14px;
    height: 14px;
    background-image: url('/assets/img/close-01.png');
    background-size: 14px 14px;
    background-repeat: no-repeat;
}

.search .-record-box .-content .-btn{
    margin-top:22px;
}

.search .-record-box .-content .-btn span{
    border-bottom:#5A5A63 1px solid;
}

/*顶部导航*/
.head-navs-box{
    position: absolute;
    height:100vh;
    top:0px;
    right: -260px;
    transition: ease .5s;
    visibility: hidden;
    overflow: hidden;
    width:260px;
    background-color: #ffffff;
    float:right;
    z-index:1000;
}
.head-navs-box.active{
    right:0px;
    visibility: visible;
}
.head-navs-box .-navs-close {
    margin:0px 14px;
    height:44px;
}
.head-navs-box .-navs-close i{
    height:44px;
    width:20px;
    background-image: url('/assets/img/close-01.png');
    background-size: 16px 16px;
    background-position:center right;
    background-repeat: no-repeat;
    float:right;
}
.head-navs-box .-navs {
    width: 100%;
    height:100%;
    position:relative;
}
.head-navs-box .-navs .-nav{
    display: block;
    margin:0px 14px;
    height:44px;
    line-height:44px;
    background-image: url('/assets/img/arrow-10.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position:center right;
    color:#1B1818;
}
.head-navs-box .-navs .lang {
    position:absolute;
    bottom:84px;
    left:50%;
    width:80px;
    margin-left:-40px;
    background-image: url('/assets/img/arrow-03.png');
    background-size: 8px 5px;
    background-repeat: no-repeat;
    background-position: right center;
}
.head-navs-box .-navs .lang.-lang-en{
    width:120px;
    margin-left:-60px;
}
.head-navs-box .-navs .lang .lang-select{
    box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -o-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    -ms-box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.1);
    border: 1px solid rgba(0,0,0,0.1);
    bottom:34px;
    position: absolute;
    right:-31px;
    width:142px;
    background-color:#ffffff;
}
.head-navs-box .-navs .lang .lang-select .-item{
    display: block;
    padding:11px 14%;
}
.head-navs-box .-navs .lang .lang-select .-item:hover{
    background: #F5F6F7;
}
.head-navs-box .-navs .lang .lang-select .-item span{
    display: block;
}
.head-navs-box .-navs .lang .lang-select .-item.on span{
    background-image: url('/assets/img/ok-01.png');
    background-size: 12.5px 10px;
    background-repeat: no-repeat;
    background-position:center right;
}

/*二级导航*/
.head-navs-box .-nav-content{
    height:100%;
    width: 100%;
    background-color: #ffffff;
}
.head-navs-box .-nav-content .-back{
    line-height: 44px;
    height: 44px;
    border-bottom: 1px solid rgba(27, 24, 24, 0.2);
    padding:0px 15px 0px 36px;
    background-image: url('/assets/img/arrow-11.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position:15px center;
}
.head-navs-box .-items{
    padding:10px 15px 0px 15px;
    overflow-y:auto;
    height:calc(100vh - 100px);
}
/*品牌故事*/
.head-navs-box .-brand .-item{
    display: block;
    margin-bottom:15px;
}
.head-navs-box .-brand .-item img{
    width:100%;
}
.head-navs-box .-brand .-item .-title{
    line-height: 20px;
    margin-top:6px;
    color:#1B1818;
}
/*联系我们*/
.head-navs-box .-contact-us .-item{
    display: block;
    margin-bottom:24px;
}
.head-navs-box .-contact-us .-item img{
    width:100%;
}
.head-navs-box .-contact-us .-item .-title{
    line-height: 20px;
    margin-top:6px;
    color:#1B1818;
}
.head-navs-box .-contact-us .-item .-sub-title{
    line-height: 17px;
    margin-top:6px;
    color:#1B1818;
    white-space:pre-wrap;
}
/*新品上市*/
.head-navs-box .-new-product .-main{
    width: 100%;
}
.head-navs-box .-new-product .-btn-all-box{
    padding-bottom:24px;
}
.head-navs-box .-new-product .-btn-all{
    color:#1B1818;
    line-height:20px;
    border-bottom: #1B1818 1px solid;
    margin-top:6px;
}
.head-navs-box .-new-product .-item{
    margin-bottom:15px;
}
.head-navs-box .-new-product .-img-box{
    width:84px;
    height:84px;
    min-width:84px;
    background: #F5F6F7;
}
.head-navs-box .-new-product .-img-box img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.head-navs-box .-new-product .-info-box{
    margin-left:10px;
    width:140px;
}
.head-navs-box .-new-product .-info-box .-tags{
    line-height:17px;
    color:rgba(90, 90, 99, 0.60);
}
.head-navs-box .-new-product .-info-box .-product-name{
    margin-top:10px;
    line-height:20px;
    margin-bottom:20px;
}
.head-navs-box .-new-product .-info-box .-btn{
    color:#5A5A63;
    border-bottom: #5A5A63 1px solid;
    line-height:17px;
}
/*系列商品*/
.head-navs-box .-series-product .-title{
    height:44px;
    line-height:44px;
    background-image: url('/assets/img/arrow-12.png');
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position:right center;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.head-navs-box .-series-product .-title.-active{
    border-bottom:none;
    background-image: url('/assets/img/arrow-13.png');
}
.head-navs-box .-series-product .-sub-titles{
    display:none;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.head-navs-box .-series-product .-sub-title{
    margin-bottom:15px;
    color:#1B1818;
    line-height:20px;
}