@media (min-width: 768px) {
    div{
        box-sizing: content-box;
    }
	input:focus {
	    outline: none;
	}
	.content{
		width: 100%;
		background-image: url('../img/shop/back.png');
		background-size: 100% 100%;
	}
	.shopBox1{
		width: 72.91vw;
		margin: 0 auto;
		padding: 4vw 0;
	}
	.shopBox1 .tab_box {
		width: 62.51vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		padding: 1vw 5.2vw;
		cursor: pointer;
		background-color: #FFFFFF;
		border-radius: 0.5vw;
	}

	.shopBox1 .tab_box p {
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 0.83vw;
		color: #3D3D3D;
        margin-bottom: 0;
	}
	.shopBox1 .tab_box a {
		font-weight: 600;
		font-size: 0.83vw;
		color: #3D3D3D;
	}

	.shopBox1 .tab_box .active {
		color: #E80707;
	}

	.shopBox1 .tab_box .line {
		width: 4.2vw;
		height: 2px;
		background-color: #E80707;
		position: absolute;
		bottom: 0;
		left: 5.2vw;
		transition: all 0.2s;

	}
	.inputBox {
	    width: 72.91vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 3.125vw 0;
	}
	.inputBox_l{
		display: flex;
		align-items: center;
		width: 48vw;
		height: 3.1vw;
		background: #FFFFFF;
		border-radius: 0.5vw;
		border: 1px solid #E80707;
		position: relative;
	}
	.inputBox_l img{
		width: 1.09vw;
		height: 1.09vw;
		margin-left: 1vw;
		margin-right: 0.8vw;
	}
	.inputBox_l input{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 0.83vw;
		color: #999999;
		border: none;
		width: 38.6vw;
		line-height: 3.1vw;
		padding: 0;
	}
	
	.inputBox_l div{
		width: 5.8vw;
		height: 2.1vw;
		background: linear-gradient( 325deg, #F40000 0%, #FF8F8F 100%);
		border-radius: 0.25vw;
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 0.83vw;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		right: 0.5vw;
	}
	.inputBox_r{
		display: flex;
		align-items: center;
	}
	.inputBox_r div{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 6.875vw;
		height: 2.6vw;
		margin-left: 1vw;
		border-radius: 0.5vw;
	}
	.red{
		background: linear-gradient( 325deg, #F40000 0%, #FF8F8F 100%);
		
	}
	.white{
		background: #FFFFFF;
	}
	.inputBox_r p{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 0.83vw;
		color: #333333;
		margin-bottom: 0;
	}
	.inputBox_r .red p{
		color: #FFFFFF;
		margin-bottom: 0;
	}
	.inputBox_r img{
		width: 1.56vw;
		height: 1.56vw;
		margin-right: 1vw;
	}
	
	.list{
		display: flex;
		flex-wrap: wrap;
		width: 72.91vw;
	}
	.list_item{
		background-color: #FFFFFF;
		border-radius: 0.5vw;
		overflow: hidden;
		margin-right: 1.6vw;
		margin-bottom: 1.5vw;
	}
	.list_item:nth-child(3n) {
		margin-right: 0;
	}
	.list_item .imgBox{
		width: 23.22vw;
		height: 23.22vw;
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		overflow: hidden;
	}
	.list_item .imgBox img{
		width: 23.22vw;
		height: 23.22vw;
	}
	.imgBox .back{
		transition: all 0.6s;
		position: absolute;
		width: 0;
		height: 0;
		border-radius: 50%;
		background-color: rgba(232, 7, 7, 0.1);
	}
	.list_item:hover .imgBox .back{
		width: 32vw;
		height: 32vw;
	}
	.list_item .title{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 1.14vw;
		color: #333333;
		margin: 1vw;
		transition: all 0.4s;
	}
	.list_item:hover .title {
		color: #E80707;
	}
	.list_item .tips {
		
		display: flex;
	}
	.list_item .tips p{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 0.83vw;
		color: #999999;
		padding: 0.41vw 1vw;
		background: rgba(153,153,153,0.1);
		border-radius: 100px 100px 100px 100px;
		margin-left: 1vw;
		margin-bottom: 0;
	}
	.price {
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 1.14vw;
		color: #E80707;
		margin: 0.52vw 1vw 1vw 1vw;
	}
	.price span{
		font-size: 0.73vw;
	}
}
@media (max-width: 768px) {
    div{
        box-sizing: content-box;
    }
	input:focus {
	    outline: none;
	}
	.content{
		width: 100%;
		background-image: url('../img/shop/back.png');
		background-size: 100% 100%;
	}
	.shopBox1{
		width: 100%;
		/*margin: 0 auto;*/
		padding: 4vw 0;
	}
	.shopBox1 .tab_box {
		width: 90vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		padding: 4.6vw 2vw;
		margin: 0 auto;
		cursor: pointer;
		background-color: #FFFFFF;
		border-radius: 1vw;
	}

	.shopBox1 .tab_box p {
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 3vw;
		color: #3D3D3D;
        margin-bottom: 0;
	}

	.shopBox1 .tab_box .active {
		color: #E80707;
	}

	.shopBox1 .tab_box .line {
		width: 10vw;
		height: 2px;
		background-color: #E80707;
		position: absolute;
		bottom: 0;
		left: 2.5vw;
		transition: all 0.2s;

	}
	.inputBox {
	    width: 94vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 3.125vw auto;
	}
	.inputBox_l{
		display: flex;
		align-items: center;
		width: 50vw;
		height: 9.6vw;
		background: #FFFFFF;
		border-radius:1vw;
		border: 1px solid #E80707;
		position: relative;
	}
	.inputBox_l img{
		width: 4.2vw;
		height: 4.2vw;
		margin-left: 2.6vw;
		margin-right: 1.6vw;
	}
	.inputBox_l input{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 3.2vw;
		color: #999999;
		border: none;
		width: 50vw;
		line-height: 9.6vw;
		padding: 0;
		background: #FFFFFF;
	}
	
	.inputBox_l div{
		width: 5.8vw;
		height: 2.1vw;
		background: linear-gradient( 325deg, #F40000 0%, #FF8F8F 100%);
		border-radius: 0.25vw;
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 0.83vw;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		right: 0.5vw;
		display: none;
	}
	.inputBox_r{
		display: flex;
		align-items: center;
	}
	.inputBox_r div{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 18.6vw;
		height: 8.2vw;
		margin-left: 2vw;
		border-radius: 1vw;
	}
	.red{
		background: linear-gradient( 325deg, #F40000 0%, #FF8F8F 100%);
		
	}
	.white{
		background: #FFFFFF;
	}
	.inputBox_r p{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 3.2vw;
		color: #333333;
		margin-bottom: 0;
	}
	.inputBox_r .red p{
		color: #FFFFFF;
		margin-bottom: 0;
	}
	.inputBox_r img{
		width: 5.6vw;
		height: 5.6vw;
		margin-right: 1vw;
	}
	
	.list{
		display: flex;
		flex-wrap: wrap;
		width: 94vw;
		margin: 0 auto;
	}
	.list_item{
	    width: 86vw;
	    padding: 4vw;
		background-color: #FFFFFF;
		border-radius: 2.6vw;
		overflow: hidden;
		margin-bottom: 3.2vw;
		
	}
	.list_item a {
	    display: flex;
	}
	.list_item .imgBox{
		width: 23vw;
		height: 23vw;
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		overflow: hidden;
	}
	.list_item .imgBox img{
		width: 23vw;
		height: 23vw;
	}
	.imgBox .back{
		transition: all 0.6s;
		position: absolute;
		width: 0;
		height: 0;
		border-radius: 50%;
		background-color: rgba(232, 7, 7, 0.1);
	}
	.list_item:hover .imgBox .back{
		width: 32vw;
		height: 32vw;
	}
	.list_item .title{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 4vw;
		color: #333333;
		margin: 0 2.6vw 2.6vw 2.6vw;
		transition: all 0.4s;
	}
	.list_item:hover .title {
		color: #E80707;
	}
	.list_item .tips {
		
		display: flex;
	}
	.list_item .tips p{
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 400;
		font-size: 2.9vw;
		color: #999999;
		padding: 1vw 2.6vw;
		background: rgba(153,153,153,0.1);
		border-radius: 100px 100px 100px 100px;
		margin-left: 2.6vw;
		margin-bottom: 0;
	}
	.price {
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: 600;
		font-size: 4.8vw;
		color: #E80707;
		margin: 0.52vw 1vw 1vw 2.6vw;
	}
	.price span{
		font-size: 3.4vw;
	}
}