@charset "UTF-8";
.page-product {background:#fafafa;}
.page-product-banner {position:sticky;top:0;left:0;width:100%;transition:all .3s;}
.page-product-banner img {width:100%;aspect-ratio:24 / 5;object-fit:cover;}
.page-product-wrapper {position:relative;z-index:1;/* min-height:100vh;*/    background:#fafafa;}
.page-product-wrapper .wrapper {padding-top:calc(var(--base-ratio) * 24px);padding-bottom:calc(var(--base-ratio) * 80px);border-bottom:1px solid #E1E1E1;}
.product-filter {position:sticky;top:104px;left:0;width:342px;max-height:90vh;padding:20px 24px;border-radius:12px;background:#fff;overflow-y:auto;}
.product-filter .head {padding-bottom:20px;/* border-bottom:1px solid #F0F0F0;*/    color:var(--dark);}
.product-filter .head .info {margin-top:8px;}
.product-filter .head .reset {color:var(--primary);cursor:pointer;}
.product-filter .head .reset:hover {padding:0 8px;border-radius:4px;color:var(--light);background-color:var(--primary);}
.filter-list .el-collapse .el-collapse-item__header {font-size:calc(var(--base-ratio) * 16px);color:var(--dark);}
.filter-list .el-collapse .el-collapse-item__arrow {font-weight:700;}
.filter-list .el-collapse .el-collapse-item:last-child .el-collapse-item__wrap {border-bottom:none;}
.filter-list .item {padding:10px 0 0;border-bottom:1px solid #F0F0F0;}
.filter-list .item:last-child {border-bottom:none;}
.filter-list .item .filter-head {margin-bottom:20px;}
.filter-checkbox-group .el-checkbox {display:flex;align-items:center;margin-right:0;}
.filter-checkbox-group .el-checkbox+.el-checkbox {margin-top:16px;}
.filter-checkbox-group .el-checkbox__inner {width:16px;height:16px;border-color:rgba(0,0,0,.85);}
.filter-checkbox-group .el-checkbox__input.is-focus .el-checkbox__inner {border-color:rgba(0,0,0,.85);}
.filter-checkbox-group .el-checkbox__input.is-checked+.el-checkbox__label {color:rgba(0,0,0,.85);}
.filter-checkbox-group .el-checkbox__input.is-checked .el-checkbox__inner {border-color:rgba(0,0,0,.85);background-color:rgba(0,0,0,.85);}
.filter-checkbox-group .el-checkbox__inner::after {left:5px;width:4px;height:8px;}
.filter-checkbox-group .el-checkbox__label {font-size:14px;line-height:1;}
.page-product-wrapper .product-content {flex:1;flex-shrink:0;margin-left:24px;}
.page-product-wrapper .product-content .product-wrap+.product-wrap {margin-top:24px;}
.page-product-wrapper .product-content .product-title {margin-bottom:8px;color:var(--dark);}
.page-product-wrapper .product-content .product-list .item {display:flex;flex-direction:column;padding:24px;border-radius:12px;background:var(--light);}
.page-product-wrapper .product-content .product-list .item .img-wrap {position:relative;width:100%;height:0;padding-bottom:74.8%;aspect-ratio:1 / 0.748;overflow:hidden;}
.page-product-wrapper .product-content .product-list .item .img {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}
.page-product-wrapper .product-content .product-list .item .title {height:calc(1em * 1.5);margin-top:0.89em;text-align: center;color:var(--dark);}
.page-product-wrapper .product-content .product-list .item .subtitle {height: calc(1em * 1.5); margin-top:0.4em; text-align: center; color:var(--dark);}
.page-product-wrapper .product-content .product-list .item .line {width:100%;height:1px;margin-top:calc(var(--base-ratio) * 16px);background:#F0F0F0;}
.page-product-wrapper .product-content .product-list .item .info {padding:calc(var(--base-ratio) * 16px) 0;border-bottom:1px solid #F0F0F0;color:rgba(0,0,0,.65);}
.page-product-wrapper .product-content .product-list .item .info ul {height:calc(4 * 1em * 1.5 + 24px);overflow:hidden;}
.page-product-wrapper .product-content .product-list .item .info li {margin-bottom:8px;}
.page-product-wrapper .product-content .product-list .item .info li:last-child {margin-bottom:0;}
.page-product-wrapper .product-content .product-list .item .btn-wrap {flex:1;justify-content:center;margin-top:calc(var(--base-ratio) * 16px);}
.page-product-wrapper .product-content .product-list .item .btn-wrap .btn+.btn {margin-top:12px;}
.page-product-wrapper .product-content .product-list .item .btn-wrap .more-btn {border:1px solid transparent;}
.page-product-wrapper .product-content .product-list .item .btn-wrap .more-btn:hover {color:var(--primary);border-color:var(--primary);background:unset;box-shadow:unset;}
.page-product-wrapper .product-content .product-list .item:hover .img {transform:scale(1.1);}
.page-product-wrapper .product-content .product-list .item:hover .title {color:var(--primary);}
.page-product-wrapper .product-content .product-list .item:hover .info {color:var(--dark);}
.mo-filter {display:none;font-size:16px;}
.mo-filter-close {display:none;}
.product-empty .text {color:#666;}
@media (max-width:1366px) {.product-filter {width:280px;}
}
@media (max-width:1280px) {.product-filter {width:240px;}
.product-content .product-list {grid-template-columns:repeat(2,minmax(0,1fr));}
.page-product-wrapper .product-content .product-title {font-size:16px;}
}
@media (max-width:1024px) {.page-product-wrapper .product-content .product-list .item .btn-wrap .btn {width:100%;height:3em;}
}
@media (max-width:992px) {.product-filter {--base-ratio:1;position:fixed;top:66px;left:-100%;z-index:2;width:70%;border-radius:0;height:calc(100vh - 66px);transition:left .3s;}
.product-filter.active {left:0;}
.product-filter .mo-filter-close {position:absolute;display:block;top:0.5em;right:0.5em;z-index:1;font-size:24px;line-height:1;color:#000;}
.product-filter-mask {position:fixed;top:0;left:0;z-index:1;width:0;height:100%;background:rgba(0,0,0,.5);transition:all .3s;}
.product-filter-mask.active {width:100%;}
.page-product-wrapper .product-content {margin-left:0;}
.mo-filter {display:flex;padding:15px;line-height:1;background:#fff;box-shadow:0 4px 16px 0 rgba(0,0,0,.1);}
.mo-filter-btn {color:var(--primary);}
.mo-filter-line {width:1px;height:0.7em;margin:0 15px;background:#666;}
.mo-filter-total {font-size:14px;color:#666;}
}
@media (max-width:768px) {.page-product-detail .breadcrumb {top:66px;}
.page-product-banner {aspect-ratio:1 / .747;}
.page-product-banner picture {aspect-ratio:1 / .747;}
.page-product-banner img {aspect-ratio:1 / .747;}
.product-filter {width:100%;}
.product-content .product-list {grid-template-columns:repeat(1,minmax(0,1fr));}
.page-product-wrapper .product-content .product-list .item .title {font-size:16px;}
.page-product-wrapper .product-content .product-list .item .info ul {font-size:14px;}
}