/* logo begin */ body{ background: #fff; color: #333 } .position-box{ width: 100%; background: #fff } .header-style{ width: 100%; background: #fff; border-bottom: 10px solid #F0F3EF; } .header{ width: 1200px; margin: 0 auto; height: 71px; padding-top: 19px; } .header:after{ content: ''; display: block; clear: both; } .header .order-box li { color: #000; float: left; padding:5px 20px 5px 23px; position: relative; border-right: none; } .header .order-box li+li{ border-left: none; } .header .order-box li:before{ content: ''; position: absolute; right: -18px; width: 18px; height: 32px; top: -1px; z-index: 3; display: none; background: url("../images/ul_nth1.png") no-repeat; background-size: 100% 100%; } .header .order-box li.nth2:before{ background-image: url("../images/ul_nth2.png"); } .header .order-box li.nth3:before{ background-image: url("../images/ul_nth3.png"); } .header .order-box li.nth4:before{ display: none; } .header .order-box li span{ margin-left: 15px; } .header .order-box .actived{ background:#FF4D00 ; color:#fff; border: 1px solid transparent; border-right: none; } .header .order-box .on{ background:#FF7700 ; color:#fff; border: 1px solid transparent; border-right: none; } .header .logo{ text-align: center; vertical-align: middle; } .header .logo .login_title2{ height: 36px; line-height: 36px; padding-left: 24px; font-size: 24px; color:#000; float: left; border-left:1px solid #eee; margin-left: 24px; margin-top: 8px; } .order-num{ background: url(../images/orderNum.png) no-repeat; padding: 10px 20px; } .order-num-icon1{ background-position: 0 0; } .order-num-icon2{ background-position: -40px -40px; } .order-num-icon2-actived{ background-position: 0 -40px; } .order-num-icon3{ background-position: -40px -80px; } .order-num-icon3-actived{ background-position: 0 -80px; } /* logo begin */ /* wrapper begin */ .wrapper{ width: 1200px; margin: 0 auto 20px; padding-bottom: 20px; min-height: 308px; } .wrapper-box{ width: 1200px; background: #fff; margin-bottom: 23px; } .wrapper-box .wrapper-item-header{ width: 1200px; height: 48px; background: #f5f5f5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .wrapper-box .wrapper-item-header ul{ margin: 0 auto; text-align: center; line-height:48px; } .wrapper-box .wrapper-item-header ul:after{ content: ''; clear: both; display: block; } .wrapper-box .wrapper-item-header li{ float: left; min-width: 73px; font-size: 12px; color:#3B3B3B; } .wrapper-box .wrapper-item-header .wrapper-goods{ width: 346px; text-align: left; text-indent: 92px; } .wrapper-box .wrapper-item-header .wrapper-size{ width: 198px; text-align: left; } .wrapper-box .wrapper-item-header .wrapper-rmb{ width: 104px; text-align: left; } .wrapper-box .wrapper-item-header .wrapper-mun{ width: 140px; text-align: left; } .wrapper-box .wrapper-item-header .wrapper-rmb-save{ width: 100px; text-align: left; } .wrapper-box .wrapper-item-header .wrapper-handle{ width: 106px; text-align: left; } .wrapper-box .wrapper-item-header .wrapper-rmb-discount{ width: 133px; text-align: left; } .wrapper-item-header .select-al{ cursor: pointer; } #price0{ /*margin-left: -4px;*/ } .wrapper-box .select-box{ cursor: pointer; display: inline-block; width: 14px; height: 14px; margin:0 4px 2px 4px; background-image: url(../images/radioBut.png); background-repeat: no-repeat; background-position:-14px 0; vertical-align: middle; } .wrapper-box .selected{ background-image: url(../images/radioBut.png); background-repeat: no-repeat; background-position:0 0; } .wrapper-box .allSelected{ background-image: url(../images/radioBut.png); background-repeat: no-repeat; background-position:0 0; } .wrapper-box .wrapper-box-item{ width: 1200px; margin: 0 auto; text-align: center; } .wrapper-box .wrapper-box-item .list-title{ line-height: 50px; text-align: left; } .wrapper-box .wrapper-box-item .wrapper-goods-list{ background: #FFFCF6; padding:12px 0; border-bottom: 1px solid #FFF4E4; } .wrapper-box .wrapper-box-item .wrapper-goods-list:after{ content: ''; display: block; clear: both; } .wrapper-box .wrapper-box-item .wrapper-goods-list li{ float: left; } .wrapper-box .wrapper-box-item .wrapper-goods-list .wrapper-size-item{ /*padding-top: 15px;*/ } .wrapper-box .wrapper-box-item .wrapper-goods-list:first-child{ margin-top: 12px; } .wrapper-box .wrapper-box-item .wrapper-goods-list+.wrapper-goods-list{ border-top: none; } .wrapper-box .wrapper-box-item .wrapper-goods-item{ width: 346px; text-align: left; } .wrapper-box .wrapper-box-item .wrapper-goods-item a{ display: inline-block; float: left; font-size: 12px; color:#3B3B3B; width: 246px; margin-left: 10px; height: 45px; } .wrapper-box .wrapper-box-item .wrapper-goods-item p{ width: 80%; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .wrapper-box .wrapper-box-item .wrapper-goods-item p:hover{ color:blue; } .wrapper-box .wrapper-box-item .wrapper-size-item{ color:#3B3B3B; width: 198px; text-align: left; /*position: relative;*/ padding: 0; margin: 0; } .wrapper-box .wrapper-box-item .wrapper-size-item .attribute{ line-height: 16px; /*position: absolute;*/ /*width: 100%;*/ /*top: 50%;*/ /*left: 0;*/ } .wrapper-box .wrapper-box-item .wrapper-size-item p{ width: 80%; margin-bottom: 4px; } .wrapper-box .wrapper-box-item .wrapper-size-item .active{ border:1px dashed #eb4f50; } .wrapper-box .wrapper-box-item .wrapper-size-item .change-btn{ position: absolute; z-index: 5; right: 0; top: 0; background: #eb5151; color: #fff; padding:0 3px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change-btn-append{ position: absolute; z-index: 5; right: 0; top: 0; background: #eb5151; color: #fff; padding:0 3px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change{ position: absolute; z-index: 500; top:80px; width: 320px; border:1px dashed #eb4f50; font-size: 12px; left: 0; background: #fff; padding-bottom: 12px } .wrapper-box .wrapper-box-item .wrapper-size-item .change .size{ clear: both; float: left; margin:10px 0 0 10px; line-height: 30px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .size .name{ float: left; height: 60px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .btn{ clear: both; float: left; margin:5px 0 0 35px; line-height: 30px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .btn span{ cursor: pointer; margin:0 15px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .btn .ok{ color: #fff; background: #e64322; padding: 5px 14px; border-radius: 3px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .btn .cancel{ color: #000; background: #f4f4f4; padding: 5px 14px; border-radius: 3px; border: 1px solid #c9c9c9; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .color{ margin:10px 0 0 10px; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .color .name{ float: left; height: 89px; margin-top: -10px } .wrapper-box .wrapper-box-item .wrapper-size-item .change .color span{ float: left; } .wrapper-box .wrapper-box-item .wrapper-size-item .change .color span img{ float: left; margin: 4px 4px 0 0; width: 16px; height: 16px; } .wrapper-box .wrapper-box-item .wrapper-mun-item{ width: 140px; overflow: hidden; padding-top: 24px; } .wrapper-box .wrapper-box-item .wrapper-goods-list li.wrapper-size-save{ width: 100px; text-align: left; /*margin-right: 28px;*/ /*margin-right: 10px;*/ padding-top: 32px; } .wrapper-box .wrapper-box-item .wrapper-goods-list li{ border:1px solid transparent; } .wrapper-box .wrapper-box-item .wrapper-goods-list li.nth1{ width: 73px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 10px; } .wrapper-box .wrapper-box-item .wrapper-mun-ite-checkout{ width: 126px; /*height: 100px;*/ /*overflow: hidden;*/ margin-top: 13px; padding-top: 32px; } .wrapper-box .wrapper-box-item .wrapper-mun-item .addbutton{ cursor: pointer; float: left; line-height:30px; width: 30px; height: 30px; border: 1px solid #ddd; } .wrapper-box .wrapper-box-item .wrapper-mun-item .addbutton i{ background: url(../images/addandminus.png) no-repeat; background-position:-18px center; padding:0 5px; } .wrapper-box .wrapper-box-item .wrapper-mun-item .minusbutton{ cursor: pointer; float: left; line-height: 30px; width: 30px; height: 30px; border: 1px solid #ddd; } .wrapper-box .wrapper-box-item .wrapper-mun-item .minusbutton i{ background: url(../images/addandminus.png) no-repeat; background-position:2px center; padding:0 5px; } /*失效按键*/ .wrapper-box .wrapper-box-item .wrapper-mun-item .add{ cursor: pointer; float: left; line-height:30px; width: 30px; height: 30px; border: 1px solid #ddd; } .wrapper-box .wrapper-box-item .wrapper-mun-item .add i{ background: url(../images/addandminus.png) no-repeat; background-position:-18px center; padding:0 5px; } .wrapper-box .wrapper-box-item .wrapper-mun-item .sub{ cursor: pointer; float: left; line-height: 30px; width: 30px; height: 30px; border: 1px solid #ddd; } .wrapper-box .wrapper-box-item .wrapper-mun-item .sub i{ background: url(../images/addandminus.png) no-repeat; background-position:2px center; padding:0 5px; } .wrapper-box .wrapper-box-item .wrapper-mun-item p{ float: left; margin:5px 0 0 30px; color:#a3a3a3 } .wrapper-box .wrapper-box-item .wrapper-mun-item input{ height: 30px; width: 40px; border: 1px solid #ddd; border-left: 0; border-right: 0; text-align: center; float: left; } .wrapper-box .wrapper-box-item .wrapper-rmb-item{ width: 104px; font-size: 13px; text-align: left; padding-top: 32px; } .wrapper-box .wrapper-box-item .wrapper-rmb-discount-item{ color:#3B3B3B; width: 134px; font-size: 15px; text-align: left; font-weight: bold; padding-top: 32px; } .wrapper-box .wrapper-box-item .wrapper-goods-list2 li.wrapper-rmb-discount-item{ margin-left: 10px; } .wrapper-box .wrapper-box-item .wrapper-rmb-discount-item:before{ content: '￥'; left: 0; } .wrapper-box .wrapper-box-item .wrapper-handle-item{ color:#a3a3a3; width: 100px; padding-top: 32px; } .wrapper-box .wrapper-box-item .wrapper-handle-item .delete{ cursor: pointer; color:#FF9900; font-size: 12px; width: 100%; text-align: left; } .wrapper-box .wrapper-box-item .wrapper-handle-item .checkoutDelete{ cursor: pointer; } .wrapper-box .wrapper-box-item .wrapper-handle-item .collect{ cursor: pointer; } .wrapper-box .wrapper-item-footer{ width: 1200px; height: 48px; margin-top: 20px; background: #f5f5f5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .wrapper-box .wrapper-item-footer ul{ width: 1200px; margin: 0 auto; text-align: center; line-height: 48px; } .wrapper-box .wrapper-item-footer li{ color: #919191; float: left; min-width: 100px; font-size: 12px; } .wrapper-box .wrapper-item-footer li:first-child{ display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding-left: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .wrapper-box .wrapper-item-footer .wrapper-del{ cursor: pointer; } .wrapper-box .wrapper-item-footer .wrapper-select-al{ color: #3B3B3B; width: 64px; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-select{ margin-left: 478px; color:#3B3B3B; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-select span{ color: #e64322; margin: 0 4px; font-size: 12px; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-save{ margin-left: 15px; color:#3B3B3B; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-save span{ color: #FF0000; font-size: 12px; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-total{ margin-left: 15px; } .wrapper-box .wrapper-item-footer ul .wrapper-goods-total span{ color: #FF0000; margin: 0 4px; font-size: 20px; font-weight: bold; vertical-align: top; } .wrapper-box .wrapper-item-footer .wrapper-goods-pay { cursor: pointer; float: right; text-align: center; background: #f70; color: #fff; line-height: 48px; font-size: 18px; font-weight: bold; } /* wrapper end */ .addrWrap{ height: 40px; box-shadow: 0 1px 0 #F5F5F5; margin-bottom: 20px; font-size: 15px; } .addrWrap .addrText{ width: 1200px; margin: 0 auto; font-weight: bold; color:#3B3B3B; height: 100%; } .addrWrap .addrText span{ font-weight: bold; font-size: 15px; color:#3B3B3B; vertical-align: middle; } .addrWrap .addrText .iconCart{ display: inline-block; width: 18px; height: 16px; margin-right: 6px; background: url('../images/shopCart.png') no-repeat; background-size: 100% 100%; vertical-align: middle; } .header .order-box li{ font-size: 15px; height: 32px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .header .order-box .actived:before{ display: block; } .wrapper-box .wrapper-box-item .wrapper-goods-item{ width: 337px; margin-left: 0; height: 80px; } .wrapper-box .wrapper-box-item .wrapper-goods-item:after{ content: ''; display: block; clear: both; } .wrapper-box .wrapper-box-item .wrapper-goods-item img{ float: left; width: 80px; height: 80px; } .senAddr{ height: 40px; line-height: 40px; box-shadow:0px 1px 0px rgba(245,245,245,1); margin-bottom: 20px; } .senAddr .mieWrap{ width: 1200px; margin:auto; } .senAddr .mieWrap .iconPen{ display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin-right: 8px; background: url('../images/pen.png') no-repeat; background-size: 100% 100%; } .senAddr .mieWrap span{ color:#3B3B3B; font-size: 15px; font-weight: bold; vertical-align: middle; } .header .order-box .on:before { display: block; } .order-box{ float: right; overflow: hidden; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px solid #eee; margin-top: 7px; } /* 商品失效样式 */ .wrapper-box .wrapper-box-item .wrapper-goods-list.on{ background: #fff; } .wrapper-box .wrapper-box-item .wrapper-goods-list.on .wrapper-goods-item a{ color:#D1D1D1 !important; } .wrapper-box .wrapper-box-item .wrapper-goods-list.on .wrapper-size-item, .wrapper-box .wrapper-box-item .wrapper-goods-list.on .wrapper-rmb-item, .wrapper-box .wrapper-box-item .wrapper-goods-list.on .wrapper-rmb-discount-item { color:#D1D1D1 ; } .wrapper-box .no-select{ cursor: pointer; display: inline-block; width: 14px; height: 14px; margin:0 4px 2px 4px; background-image: url(../images/radioBut.png); background-repeat: no-repeat; background-position:-14px 0; vertical-align: middle; } 
