*{ margin: 0; padding: 0; -webkit-touch-callout:none; -moz-touch-callout:none; -ms-touch-callout:none; touch-callout:none; } input,button,select,textarea{outline:none;} body { box-sizing: border-box; font-size: 14px; background: #f5f7f7; padding-left: 10px; padding-right: 10px; text-align: center; } .first{ width: 100%; /*height: 140px;*/ background: #fff; border-radius: 5px; margin-top: 10px; display: flex; flex-direction: column; align-items: center; } .con{ position: relative; width: 90%; height: 50px; align-items: center; display: flex; border-bottom: 2px solid #f2f2f2; } .con>div:nth-child(1){ width: 110px; text-align: left; white-space: nowrap; } .con:nth-child(1)>div:nth-child(2){ width: calc(100% - 115px); text-align: right; } .color{ font-size: 20px; color: #f2976b; } .con>select{ position: absolute; top: 15px; right: 0; font-size: 13px; border: none; outline: none; max-width: calc(90% - 70px); padding-right: 5px; } .tips{ width: 90%; text-align: left; line-height: 12px; margin-top: 10px; font-size: 12px; color: #f79767; } .discounts{ width: 100%; height: 44px; background: #fff; margin: 5px 0; border-radius: 5px; display: flex; align-items: center; position: relative; } .discounts>div:nth-child(1){ margin-left: 5%; } .couponnum{ position: absolute; right: 9vw; top: 12px; line-height: 20px; padding: 0 7px; color: #fff; border-radius: 50%; background: #f79767; } .selectdetail{ margin-left: 10px; font-size: 12px; line-height: 44px; color: #f79767; } .openCoupon{ position: absolute; right: 0; top: calc(22px - 3vw); width: 9vw; height: 6vw; } .youh{ width: 100%; height: 35px; display: flex; align-items: center; } .youh>div{ margin-left: 5%; } .remark{ width: 100%; height: 100px; background: #fff; display: flex; } .remark>div{ margin-top: 5px; margin-left: 5%; } .remark>textarea{ width: 80%; height: 80px; margin-top: 7px; border: none; } button{ font-size: 14px; width: 100%; height: 45px; border: none; background: #f79767; color: #fff; border-radius: 5px; margin: 10px 0; } .pwd_con{ box-sizing: content-box; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.7); position: fixed; top: 0; left: 0; display: none; } .pwd_small_con{ width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; flex-wrap: wrap; } .center{ display: flex; flex: 1; justify-content: center; align-items: center; } .pwd_center{ padding: 10vw 10vw 15vw; background-color: white; border-radius: 5px; text-align: center; width: 60vw; position: relative; } .top{ font-size: 16px; color: #f79767; margin-bottom: 5px; } .needpay{ font-size: 14px; margin-bottom: 20px; } .needpay>span{ color: #f79767; } .ul{ display: block; margin: 0 auto; position: relative; font-size: 0; white-space: nowrap; width: 60vw; height: 10vw; border: 1px solid #f79767; display: flex; justify-content: space-between; } .ul>li{ padding: 0; margin: 0; flex: 1; height: 100%; font-size: 3vw; font-weight: bold; border-left: 1px solid #f79767; text-align: center; line-height: 10vw; } ul>li:nth-child(1){ border: none; } .pwd{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; overflow: hidden; } .loading{ position: absolute; width: 15vw; height:15vw; top: 90px; left: 32.5vw; display: none; } .couponlist_con{ top: 0; left: 0; position: absolute; width: 100vw; min-height: 100vh; background-color: white; z-index: 100; display: none; } .notuse,.nocoupon{ margin: 0 auto; margin-top: 10px; width: 90vw; height: 20vw; text-align: center; line-height: 20vw; background-color: white; border: 1px dashed #e8e8e8; } .notuse{ display: none; } .card_content{ /*box-sizing: border-box;*/ padding: 10px 0; font-size: 0; } .card_content_inner{ font-size: 3vw; width: 90vw; height: 30.12vw; margin: auto; background: url(../images/z_mjq.png); background-size:100% 100%; position: relative; } .card_content_inner img{ width: 100%; } .notselect{ padding: 1.5vw 4vw; font-size: 4vw; background: #F69667; } .select{ width: 24px; height: 24px; background-image: url("../images/pe_dd.png"); background-repeat: no-repeat; background-size: 100% 100%; } table{ moz-user-select: -moz-none; -moz-user-select: none; -o-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none; } .cursor{ position: absolute; width: 2px; height: 18px; top: 17px; right: 2px; background-color: #f79767; animation: cursor infinite forwards 1.2s; display: none; } @keyframes cursor{ 0%{ background-color: #f79767; } 49%{ background-color: #f79767; } 50%{ background-color: transparent; } 99%{ background-color: transparent; } 100%{ background-color: #f79767; } } #num,.marsk{ width: calc(100% - 110px); text-align: right; height: 32px; padding: 5px 5px 0 0; line-height: 32px; color: transparent; background-color: transparent; } .marsk{ position: absolute; top: 6px; right: 0px; font-size: 18px; color: black; } #money:active{ background-color: transparent !important; }