.topNav { border-bottom: 3px solid #1697ea; } .navigationShop .shopAll { width: 100%; background: #f4f9fd; height: 60px; line-height: 60px; font-size: 16px; } .navigationShop .shopAll img { margin-right: 44px; margin-left: 14px; display: inline-block; } .tabShop { margin-top: 19px; } .tabShop #checkboxAll { vertical-align: top; opacity: 0; margin-top: 19px; margin-left: -23px; } .nubTotal { display: inline-block; margin-left: 5px; } .tabShop .checkImg { display: inline-block; vertical-align: top; margin-top: 19px; margin-left: 36px; margin-right: 10px; width: 13px; height: 13px; background: url(../../../img/shopList/shopOK.jpg)no-repeat; background-size: 100% 100%; } .tabShop .checkNoImg { display: inline-block; vertical-align: top; margin-top: 19px; margin-left: 36px; margin-right: 10px; width: 13px; height: 13px; background: url(../../../img/shopList/shopNo.jpg)no-repeat; background-size: 100% 100%; } .shopLists .companyImg { display: inline-block; width: 23px; height: 23px; background: url(../../../img/shopList/shop_com.jpg) no-repeat; background-size: 100% 100%; margin-left: 33px; margin-right: 28px; vertical-align: bottom } .shopLists .tdImg img { width: 105px; height: 105px; float: left; } .checkIcon .checkSingle { margin-top: 48px; opacity: 0; margin-left: -26px !important; } .shopTr .checkIcon{ width: 64px; } .tabShop ol { overflow: hidden; height: 50px; line-height: 50px; background: #f9f9f9; } .tabShop ol li { float: left; line-height: 50px; } .tabShop ol li span, .tabShop ol li label { color: #7f7f7f; font-size: 14px; font-weight: normal } .tabShop ol li label { margin-left: 10px; } .tabShop ol li:nth-child(1) { margin-right: 345px; } .tabShop ol li:nth-child(2) { margin-right: 134px; } .tabShop ol li:nth-child(3) { margin-right: 167px; } .tabShop ol li:nth-child(4) { margin-right: 190px; } .shopLists { clear: both; } .shopLists .shopBox { overflow: hidden; border: 1px solid #eeeeee; padding: 20px 0; margin-top: 12px; margin-bottom: 50px; } .tdImg .tdText { position: relative; width: 168px; margin-left: 20px; height: 105px; margin-right: 17px; } .tdImg .tdText p { width: 168px; font-size: 16px; position: absolute; overflow: hidden; top: 50%; left: 0; transform: translate(0, -50%) } .shopLists .shopBox div { float: left; } .shopLists li { clear: both; } .checkIcon .checkImg, .checkIcon .checkNoImg { margin-top: 48px; } .shopLists li:last-child .shopBox { margin-bottom: 0 } .shopBox .price { width: 200px; text-align: center; font-size: 16px; color: #ff580e; display: inline-block; margin-top: 40px; margin-right: 44px; } .inpG { margin-top: 34px; position: relative; width: 96px; height: 30px; margin-right: 74px; border: 1px solid #e3e3e3; } .inpG button { width: 30px; height: 28px; line-height: 26px; background: #f7f7f7; border: none; } .inpG .reduce { position: absolute; left: 0; top: 0; border-right: 1px solid #e3e3e3; } .priceTotal { text-align: center; width: 200px; color: #ff580e; font-size: 16px; margin-top: 40px; margin-right: 126px; } .del { cursor: pointer; font-size: 14px; color: #7a7878; margin-top: 40px; display: inline-block; } .del:hover { color: #f00; } .inpG .add { position: absolute; right: 0; top: 0; border-left: 1px solid #e3e3e3 } .inpG input { position: absolute; left: 31px; top: 0; width: 36px; height: 28px; border: none; line-height: 28px; font-size: 14px; text-align: center } .totalFooter { display: none; height: 50px; width: 100%; border: 1px solid #eeeeee; border-top: none; background: #f9f9f9; overflow: hidden; margin-bottom: 100px; } .totalFooter label { font-weight: normal; font-size: 14px; color: #7f7f7f; margin-left: 10px; vertical-align: top; margin-top: 15px; margin-right: 50px; } .totalFooter .btnDel { background: none; border: none; margin-top: 15px; color: #7f7f7f; margin-right: 500px; } .totalFooter .btnDel:hover { color: #f00; } .totalFooter span { color: #7f7f7f; } .totalFooter span span { color: #1797e9; } .totalFooter #checkboxAlls { margin-left: -22px; vertical-align: middle; margin-top: -2px; opacity: 0; } .totalFooter .orderOk { cursor: pointer; float: right; height: 50px; border: none; background: #ccc; width: 140px; color: #ffffff; font-size: 18px; line-height: 50px; text-align: center; } .totalFooter .orderOk.active { background: #1797e9; } .shopNull { display: none; width: 550px; height: 150px; margin: 100px auto; background: url(../../../img/shopList/shop_null.png) no-repeat; background-size: 100% 100%; } /* 遮罩 */ .shopMarsk { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999999999; background: rgba(000, 000, 000, .2) } .shopMarsk .shopOrderBody { width: 400px; position: fixed; left: 50%; top: 0; background: #f3f9fc; border: 1px solid #86caf5; transform: translate(-50%, -50%); padding: 8px; transition: all 2s ease-in; animation: mymove 1s ease-in-out 0s 1 alternate forwards; -webkit-animation: mymove 0.8s ease-in-out 0s 1 alternate forwards; /* Safari 和 Chrome */ } @keyframes mymove { from { top: 0; } to { top: 50%; } } @-webkit-keyframes mymove{ from { top: 0; } to { top: 50%; } } .shopMarsk .shopOrderBody.active { top: 50%; transition: all 2s ease-in-out; } .shopMarsk .shopOrderBody .shopOrderOk, .shopOrderCancel { background: #ffffff; width: 100%; height: 100%; padding-left: 88px; padding-bottom: 20px; } .shopOrderOk .shopClose, .shopOrderCancel .shopClose { width: 14px; height: 26px; cursor: pointer; display: inline-block; margin-right: 10px; float: right; font-size: 20px; color: #ccc } .shopOrderOk .shopClose, .shopOrderCancel .shopClose:hover { color: #f00 } .shopOrderOk h4, .shopOrderCancel h4 { clear: both; font-weight: normal; font-size: 18px; padding-top: 24px; margin-bottom: 25px; color: #1f1f1f; } .shopOrderOk h4 img, .shopOrderCancel h4 img { margin-right: 17px; } .shopOrderOk div p, .shopOrderCancel div p { margin-bottom: 20px; font-size: 14px; color: #7a7878; } .shopOrderOk .shopTime, .shopOrderCancel .shopTime { width: 240px; text-align: right; } .shopOrderCancel div p:nth-child(1) { color: #f00; }