product_detail.css 3.9 KB
@media(min-width:768px){
	.select_content ul li a{
		text-decoration: none;
	}
	.content{
		width:1180px;
		margin: auto;
	}
	.content_nav{
		margin-top:84px;
	}
	.content_nav ul{
		display: flex;
		display: -webkit-flex;
	}
	.content_nav ul li{
		display: flex;
		display: -webkit-flex;
		margin-right:14px;
	}
	.content_nav ul li img{
		width:15px;
		height:15px;
		margin-top:4px;
	}
	.content_nav ul li a{
		font-size:16px;
		margin-right:14px;
		font-family:PingFang-SC-Medium;
		font-weight:500;
		color:rgba(153,153,153,1);
	}
	.content_detail{
		margin-top: 66px;
		display: flex;
		display: -webkit-flex;
	}
	.left div{
		width:208px;
		height:128px;
	}
	.left img{
		width:100%;
		height:100%;
		cursor: pointer;
	}
	.left div:nth-child(2){
		margin:15px 0;
	}
	.center{
		width:730px;
		height:415px;
		float:left;
		overflow: hidden;
	}
	.center img{
		width:100%;
		height:100%;
		cursor: pointer;
		margin-left:15px;
	}
	.right{
		width:220px;
		height:415px;
		margin-left:15px;
		float:left;
		border:1px solid rgba(44, 126, 223, 1);
	}
	.right h1{
		text-align: center;
		font-size:18px;
		color: #333;
		font-weight:500;
	}
	.right p{
		padding:10px 20px;
		font-size:14px;
	}
	.appear{
		display: none;
		overflow: hidden;
	}
	.select{
		display: block;
	}
	.select_content{
		margin-bottom:156px;
	}
	.select_content ul{
		display: flex;
		margin-top:70px;
		display: -webkit-flex;
	}
	.select_content ul li{
		margin-right:20px;
	}
	.select_txt{
		width: 220px;
		height:40px;
		border-bottom:1px solid #D5E6FA;
	}
	.select_txt p{
		text-align: center;
		line-height:40px;
		font-family:MicrosoftYaHei;
		font-weight:400;
		color:rgba(51,51,51,1);
	}
	.selec_img{
		width:220px;
		height:122px;
	}
	.selec_img img{
		width:100%;
		height:100%;
	}
	.select_active{
		box-shadow:0px 1px 32px 0px rgba(110,110,110,0.2);
	}
	.select_content ul li:hover{
		cursor: pointer;
		box-shadow:0px 1px 32px 0px rgba(110,110,110,0.2);
	}
	.pagination li:last-child img{
		display: none;
	}
}
@media(max-width:768px){
	.content{
		width:100%;
		margin: auto;
	}
	.tabContent{
		width:100%;
	}
	.content_nav{
		margin-top:32px;
	}
	.content_nav ul{
		display: flex;
		display: -webkit-flex;
	}
	.content_nav ul li{
		display: flex;
		display: -webkit-flex;
		margin-right:2%;
	}
	.content_nav ul li img{
		width:15px;
		height:15px;
		margin-top:4px;
		vertical-align: middle;
	}
	.content_nav ul li a{
		font-size:14px;
		margin-right:14px;
		font-family:PingFang-SC-Medium;
		font-weight:500;
		color:rgba(153,153,153,1);
	}
	.content_detail{
		margin-top:17px;
		display: flex;
		display: -webkit-flex;
	}
	.left{
		display:none;
	}
	.center{
		width: 100%;
		overflow: hidden;
	}
	.center img{
		width:100%;
		height:100%;
		cursor: pointer;
	}
	.right{
		width: 100%;
		margin-top: 20px;
		padding:10px 14px 20px;
		border:1px solid rgba(44, 126, 223, 1);
	}
	.right h1{
		text-align: center;
		font-size:18px;
		color: #333;
		font-weight:500;
	}
	.right p{
		font-size:14px;
		margin-top: 10px;
	}
	.appear{
		display: none;
		overflow: hidden;
	}
	.select{
		display: block;
	}
	.select_content{
		margin: 0 8px;
		margin-bottom:156px;
		box-sizing: border-box;
	}
	.select_content ul{
		display: flex;
		justify-content: space-between;
		display: -webkit-flex;
		flex-wrap: wrap;
		margin-top:30px;
		display: -webkit-flex;
	}
	.select_content ul li{
		width:47%;
		margin-bottom: 20px;
		border:1px solid #F4F4F4;
	}
	.select_txt{
		height:40px;
		border-bottom:1px solid #D5E6FA;
	}
	.select_txt p{
		text-align: center;
		line-height:40px;
		font-family:MicrosoftYaHei;
		font-weight:400;
		color:rgba(51,51,51,1);
	}
	.selec_img{
		width:100%;
		height:122px;
	}
	.selec_img img{
		width:100%;
		height:100%;
	}
	.select_active{
		box-shadow:0px 1px 32px 0px rgba(110,110,110,0.2);
	}
	.select_content ul li:hover{
		cursor: pointer;
		box-shadow:0px 1px 32px 0px rgba(110,110,110,0.2);
	}
	.pagination li:last-child img{
		display: none;
	}
}