@charset "utf-8";
html,body{
    max-width:750px;
    margin: 0 auto;
}
*{
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-text-size-adjust: none;
}
body{
    color: #000000;
    font-size: 14px;
    -webkit-tap-highlight-color:transparent;
    position: relative;
	font-family: '微软雅黑',"宋体";
	background:#eeeeee;
}
ul li{
    list-style-type:none;
}
p{-webkit-text-size-adjust: none;}
a{
    text-decoration:none;
}
input::-webkit-input-placeholder {
    color: #666666;
}

input::-moz-placeholder {
    color: #666666;
}

input:-ms-input-placeholder {
    color: #666666;
}

input:-moz-placeholder { 
    color: #666666;
}
.product_nr img {
    width: 100%;
}
.all {
    width: 100%;
}
.clear {
    height: 120px;
}
.list_top{
	width: 100%;
    height: 187px;
    background: url(../images/car_top.jpg) no-repeat;
    background-size: 100% 100%;
}
.list_top_logo {
    text-align: center;
    padding: 18px 0px 10px;
    overflow: hidden;
}

.list_top_logo img {
    width: 202px;
}
.list_top_title {
    padding: 0px 17%;
    font-size: 21px;
    color: #ffffff;
    height: 35px;
    line-height: 35px;
	-webkit-animation: titleLeft 0.8s ease-out;
    animation: titleLeft 0.8s ease-out;
	font-family: '微软雅黑';
}
.list_top_title span {
    color: #a50908;
}
.list_top_bottom {
    font-size: 21px;
    color: #ffffff;
    padding: 0px 17%;
    text-align: right;
    height: 35px;
    line-height: 35px;
	-webkit-animation: titleRight 0.8s ease-out;
    animation: titleRight 0.8s ease-out;
	font-family: '微软雅黑';
}
.list_bottom ul li {
    padding: 10px;
    box-sizing: border-box;
    box-shadow: 0 1px 0px #d7d7d6, 0 2px 0px #ffffff;
    background-image: linear-gradient(#f4f5f5,#e6e6e6);
    background-image: -webkit-linear-gradient(#f4f5f5,#e6e6e6);
    margin-bottom: 2px;
    overflow: hidden;
    width: 100%;
    height: auto;
}

.list_bottom ul li a {
    display: flex;
    width: 100%;
    height: auto;
}
.list_bottom ul li span {
    display: block;
    float: left;
    width: 48px;
    height: 36px;
    border: 1px solid #bfbfbf;
    box-sizing: border-box;
    min-width: 48px;
}
.list_bottom ul li span img {
    width: 100%;
    height: 100%;
    border: none;
    object-fit: cover;
}
.list_bottom ul li p {
    float: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #333;
    padding: 8px 10px 0px;
}
.product{
    margin: 20px 15px;
    overflow: hidden;
    overflow-y: scroll;
}
.product_top {
    width: 100%;
    height: 35px;
    line-height: 35px;
    text-align: center;
    font-weight: bold;
    background: url(../images/title_bg.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    color: #a50908;
    font-size: 15px;
}
.product_nr {
    margin: 15px 0px;
    overflow: hidden;
    overflow-y: auto;
}

.product .product_nr .product_nr_inset {
    width: 98%;
    position: relative;
    padding: 8px;
    box-sizing: border-box;
    margin: 0.2rem auto;
    background: #fff;
    margin-bottom: 15px;
}
.inset-shadow {
    box-shadow: 0 0 4px rgba(0,0,0,0.2), 0 0 20px rgba(0,0,0,0.1) inset;
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.2), 0 0 20px rgba(0,0,0,0.1) inset;
    -moz-box-shadow: 0 0 4px rgba(0,0,0,0.2),0 0 20px rgba(0,0,0,0.1) inset;
    -o-box-shadow: 0 0 4px rgba(0,0,0,0.2),0 0 20px rgba(0,0,0,0.1) inset;
    -ms-box-shadow: 0 0 4px rgba(0,0,0,0.2),0 0 20px rgba(0,0,0,0.1) inset;
    position: relative;
    background: #fff;
}
.inset-shadow:before, .inset-shadow:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 10px;
    right: 10px;
    bottom: -1px;
    border-radius: 110px/10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.6);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    -ms-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    z-index: -1;
}

.product .product_nr .product_nr_inset img {
    width: 100%;
    display: block;
}

@media only screen and (max-width: 340px) {
   .list_top {
    width: 100%;
    height: 165px;
    background: url(../images/car_top.jpg) no-repeat;
    background-size: 100% 100%;
}
.list_top_bottom {
    font-size: 19px;
}
.list_top_title {
    font-size: 19px;
}
}
/* 效果 */
@keyframes next{
	0%{opacity:0.3;
	transform:translate(0,-10px) scale(1);-webkit-transform:translate(0,-10px) scale(1);-ms-transform:translate(0,-10px) scale(1);-o-transform:translate(0,-10px) scale(1);}
	100% {opacity:1;
	transform:translate(0,0) scale(1.2);-webkit-transform:translate(0,0) scale(1.2);-o-transform:translate(0,0) scale(1.2);-ms-transform:translate(0,0) scale(1.2);}
}
@-webkit-keyframes next{
	0%{opacity:0.3;
	transform:translate(0,-10px) scale(1);-webkit-transform:translate(0,-10px) scale(1);-ms-transform:translate(0,-10px) scale(1);-o-transform:translate(0,-10px) scale(1);}
	100% {opacity:1;
	transform:translate(0,0) scale(1.2);-webkit-transform:translate(0,0) scale(1.2);-o-transform:translate(0,0) scale(1.2);-ms-transform:translate(0,0) scale(1.2);}
}
@keyframes nextOne{
	0%{
	transform:translate(0,0);-webkit-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);}
	100% {
	transform:translate(0,5px);-webkit-transform:translate(0,5px);-o-transform:translate(0,5px);-ms-transform:translate(0,5px);}
}
@-webkit-keyframes nextOne{
	0%{
	transform:translate(0,0);-webkit-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);}
	100% {
	transform:translate(0,5px);-webkit-transform:translate(0,5px);-o-transform:translate(0,5px);-ms-transform:translate(0,5px);}
}
@keyframes prevOne{
	0%{
	transform:translate(0,0);-webkit-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);}
	100% {
	transform:translate(0,-5px);-webkit-transform:translate(0,-5px);-o-transform:translate(0,-5px);-ms-transform:translate(0,-5px);}
}
@-webkit-keyframes prevOne{
	0%{
	transform:translate(0,0);-webkit-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);}
	100% {
	transform:translate(0,-5px);-webkit-transform:translate(0,-5px);-o-transform:translate(0,-5px);-ms-transform:translate(0,-5px);}
}
/*top bg*/
@keyframes bg_scale {
	0%{background-size:150% 150%;}
	100% {background-size:100% 100%;}
}
@-webkit-keyframes bg_scale {
	0%{background-size:150% 150%;}
	100% {background-size:100% 100%;}
}
/*logo*/
@keyframes logoDown {
	0%{ opacity:0;-webkit-transform:translateY(-100%);-o-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%); }
	100% { opacity:1;-webkit-transform:translateY(25%);-o-transform:translateY(25%);-ms-transform:translateY(25%);transform:translateY(25%);  }
}
@-webkit-keyframes logoDown {
	0%{opacity:0;-webkit-transform:translateY(-100%);-o-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%); }
	100% { opacity:1;-webkit-transform:translateY(25%);-o-transform:translateY(25%);-ms-transform:translateY(25%);transform:translateY(25%); }
}
/*title left*/
@keyframes titleLeft {
	0%{ opacity:0;-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%); }
	100% { opacity:1;-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
@-webkit-keyframes titleLeft {
	0%{ opacity:0;-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%); }
	100% { opacity:1;-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
/*title right*/
@keyframes titleRight {
	0%{ visibility:visible;opacity:0;-webkit-transform:translateX(100%);-o-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%); }
	100% {  visibility:visible;opacity:1;-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
@-webkit-keyframes titleRight {
	0%{ visibility:visible;opacity:0;-webkit-transform:translateX(100%);-o-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%); }
	100% {  visibility:visible;opacity:1;-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
/*center red_bg*/
@keyframes red_bg {
	0%{-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%); }
	100% { -webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
@-webkit-keyframes red_bg {
	0%{-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%); }
	100% { -webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
/*center car*/
@keyframes car {
	0%{-webkit-transform:translateX(100%);-o-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%); }
	100% { -webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
@-webkit-keyframes car {
	0%{-webkit-transform:translateX(100%);-o-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%); }
	100% { -webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);  }
}
/*center content*/
@keyframes contentShow {
	0%{-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);transform:scale(0);}
	100% {-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);}
}
@-webkit-keyframes contentShow {
	0%{-webkit-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0);transform:scale(0);}
	100% {-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);}
}