.redbag_btn, .titbg, .redbag_ware, .boxware, .redbagtit { width: 100% } .boxware { position: relative; } .redbag_ware { display: block; margin: 25px auto; } .redbag_btn, .redbagtit { display: block } .redbagtit { width: 100%; margin-top: 5.5%; } .itmeboxwz { position: absolute; left: 0; top:20%; width: 100%; color:#F3530F; font-size: 36px; font-weight: bold; text-align: center; } @media screen and (min-width: 320px) { .itmeboxwz { position: absolute; left: 0; top:20%; width: 100%; color:#F3530F; font-size: 16px; font-weight: bold; text-align: center; } } @media screen and (min-width: 360px) { .itmeboxwz { position: absolute; left: 0; top:20%; width: 100%; color:#F3530F; font-size: 18px; font-weight: bold; text-align: center; } } @media screen and (min-width: 480px) { .itmeboxwz { position: absolute; left: 0; top:20%; width: 100%; color:#F3530F; font-size: 24px; font-weight: bold; text-align: center; } } @media screen and (min-width: 640px) { .itmeboxwz { position: absolute; left: 0; top:20%; width: 100%; color:#F3530F; font-size: 32px; font-weight: bold; text-align: center; } } .timeboxware { position: absolute; left: 0; bottom: 25%; width: 100%; text-align: center; } .timeboxware li { display: inline-block; position: relative; width: 15%; } .timeboxware li img { width: 100%; } .timeboxware li .num { display: block; width: 100%; position: absolute; left: 0; bottom: 20%; text-align: center; color: #fff; font-size: 18px; font-weight: 600; } .ofn { color: #fff; padding: 15px; text-align: left; } .layhb { position: relative; width: 100%; } .layhb .hbtit { width: 100%; } .layhb .srhb { position: absolute; bottom: 15px; left: 50%; margin-left: -65px; width: 120px; } .layhb .price { position: absolute; left: 0; bottom: 100px; color: #fff005; font-size: 50px; text-align: center; width: 90%; } .layhb .msg { position: absolute; left: 0; bottom: 170px; color: white; font-size: 14px; text-align: center; width: 90%; } .layhb .go { position: absolute; left: 0; bottom: 20px; color: white; font-size: 14px; text-align: center; width: 90%; } .listware { margin-top: 20%; } .listware .listit { width: calc(100% - 20px); margin: 0 10px; } .listware ul { background-color: #fff; margin: 0 10px; padding: 0 10px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .listware ul li { padding: 5px 0; border-bottom: 1px #ddd solid; font-size: 0; } .listware ul li:last-child { border-bottom: 0; } .listware1 { margin-top: 0%; } .listware1 .listit { width: calc(100% - 20px); margin: 0 10px; } .listware1 ul { background-color: #fff; margin: 0 10px; padding: 0 10px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; min-height: 400px; } .listware1 ul li { padding: 5px 0; border-bottom: 1px #ddd solid; font-size: 0; } .listware1 ul li:last-child { } .imgtit { border-radius: 50%; border: 1px #ddd solid; width: 50px; height: 50px; display: inline-block; vertical-align: middle; } .vippro { display: inline-block; vertical-align: middle; margin-left: 10px; } .vippro .top { color: #333; font-size: 14px; } .vippro .bottom { color: #666; font-size: 12px; } .vipprice{ float: right; margin-top: 20px; display: inline-block; font-size: 26px; color: #f3530f; } .hasmon { width:100%; text-align: center; position: absolute; left: 0; bottom:40px; z-index: 10; font-size: 200%; color: #fff; font-weight: 600; } .redware { background-image: url("../images/redbag/111.jpg"); padding-bottom: 15px; } @media screen and (min-width: 479px) { .hasmon{ bottom: 60px; font-size: 350%; } .timeboxware li .num{ bottom: 28%; font-size: 30px; } } @media screen and (min-width: 720px) { .hasmon{ bottom: 80px; font-size: 400%; } .timeboxware li .num { bottom: 30%; font-size: 36px; } }