.shop-container{ width: 1600px; margin: 0 auto; .shop-container-title{ display: flex; align-items: center; margin: 20px 0; .shop-container-title-state{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(255,79,0,1); } } .shop-container-info-box{ display: flex; justify-content: space-between; .shop-container-info-item{ width:355px; min-height:117px; border:1px solid rgba(238,238,238,1); padding: 15px; >h4{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(60,60,60,1); } .shop-container-info-item-message{ margin-top: 10px; display: flex; >span{ display: block; font-size:12px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(85,85,85,1); width: 70px; min-width: 70px; } >p{ font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); } } } } .shop-container-table-box{ .table-operation2{ margin-top: 50px; padding: 10px; background:rgba(246,246,246,1); border:1px solid rgba(221,221,221,1); display: flex; position: relative; justify-content: flex-end; .table-operation2-item{ padding: 5px; text-align: right; margin-right: 10px; >span,>a{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(60,60,60,1); } } } .table-operation{ margin-top: 50px; height:50px; background:rgba(246,246,246,1); border:1px solid rgba(221,221,221,1); display: flex; align-items: center; padding-left: 20px; position: relative; >span,>a{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(60,60,60,1) } .right-oper{ position: absolute; right: 0; display: flex; align-items: center; >span{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); } >b{ font-size:16px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; } .buy-btn{ width:120px; height:52px; background:rgba(255,79,0,1); font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(255,255,255,1); display: flex; align-items: center; justify-content: center; cursor: pointer; } } } >table{ width: 100%; max-height: 800px; overflow-y: auto; thead{ background:rgba(246,246,246,1); th{ height:40px; font-size:13px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(102,102,102,1); text-align: left; padding: 0 10px; &:first-child{ padding-left: 20px; } .th-center{ display: flex; align-items: center; >input{ margin-right: 10px; } } } } tbody{ tr{ border-bottom: 2px solid #DDDDDD; &.disabled-tr{ background:rgba(246,246,246,1); .rmb-title{ color: #999999; } .disabled-tag{ width:43px; height:20px; background:rgba(208,208,208,1); border-radius:10px; font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(255,255,255,1); display: flex; align-items: center; justify-content: center; } td{ >p{ color: #999999; } >span{ color: #999999; } } .td-containe{ >p{ color: #999999; } >span{ color: #999999; } } } &.table-interval{ border: none; td{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(60,60,60,1); } } td{ height: 100px; //display: flex; text-align: left; padding: 0 10px; .td-containe{ text-align: left; >p{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(60,60,60,1); padding-bottom: 4px; } >span{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); display: block; padding-bottom: 4px; } } >p{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(60,60,60,1); padding-bottom: 4px; } >span{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); display: block; padding-bottom: 4px; &.color-blue{ color: #3F90F7; } .rmb-title{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(255,79,0,1); } .rmb-title-2{ font-size:14px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; } } >img{ width: 60px; height: 60px; min-width: 60px; } } } } } } .shop-container-filter-box{ .shop-container-filter-box-wrapper{ border:1px solid rgba(238,238,238,1); margin-bottom: 20px; //&.interval-wrapper{ // margin-top: 20px; //} } .shop-container-filter-item{ display: flex; align-items: center; position: relative; &.dotted-line{ border-bottom: 1px dashed #DDDDDD; } .shop-container-filter-item-brand{ font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); padding: 0 8px; cursor: pointer; &.checked{ color:rgba(63,144,247,1); } } .shop-container-filter-item-title{ width:70px; background:rgba(246,246,246,1); padding: 14px 20px; font-size:13px; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(102,102,102,1); position: absolute; top: 0; bottom: 0; left: 0; } .shop-container-filter-item-container{ padding: 10px; padding-left: 120px; display: flex; flex-wrap: wrap; align-items: center; min-height: 20px; .shop-container-filter-item-container-top-filter{ width: 88px; height: 40px; display: flex; justify-content: center; align-items: center; box-sizing: border-box; border-right:1px solid rgba(238,238,238,1); margin: -10px 0; font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(60,60,60,1); cursor: pointer; &:first-child{ margin-left: -10px; } &.filtered{ color: #3f90f7; } } .shop-container-filter-item-container-top-filter-2{ font-size:13px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(60,60,60,1); padding-left: 10px; display: flex; align-items: center; >input{ margin-right: 5px; } } .shop-container-filter-item-btn{ height:26px; background:rgba(255,255,255,1); border-radius:2px; border:1px solid rgba(241,157,1,1); padding: 0 10px; display: flex; align-items: center; margin-left: 20px; cursor: pointer; font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(241,157,1,1); &.btn-2{ border:1px solid #FF4F00; color:#FF4F00; } &.btn-3{ border:1px solid #3F90F7; color:#3F90F7; } } .shop-container-filter-item-car-type{ padding-left: 10px; padding-right: 30px; height:26px; border-radius:2px; border:1px solid rgba(221,221,221,1); line-height: 26px; font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(60,60,60,1); position: relative; &:before{ position: absolute; display: block; content: '×'; font-size: 20px; right: 10px; cursor: pointer; } } } } } .shop-container-search-box{ padding-top: 40px; padding-bottom: 27px; display: flex; align-items: center; .shop-container-shopping-cart{ margin-left: 20px; width:120px; height:44px; background:rgba(246,246,246,1); border-radius:2px; border:1px solid rgba(221,221,221,1); font-size:14px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(255,79,0,1); text-align: center; line-height: 44px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .shop-container-search{ margin: 0 auto; display: flex; .shop-container-search-input{ border-radius:2px; border:2px solid rgba(38,150,92,1); width:772px; height:40px; padding-left: 10px; font-size:14px; } .shop-container-search-btn{ width:85px; height:44px; background:rgba(38,150,92,1); border-radius:0px 2px 2px 0px; font-size:14px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(255,255,255,1); text-align: center; margin-left: -2px; line-height: 44px; cursor: pointer; } } } } .icon-shopcar{ background: url("../image/shopcar.png") no-repeat; width:20px; height:16px; background-size: contain; display: inline-block; cursor: pointer; }