_768_magazine.scss 3.2 KB
@media screen and (max-width:768px){
.mags-container{
	width: 668px;
	margin: 0 auto;	
}
.newest-mags{
	margin: 25px 0 0 0;
}
.mags-info{
	width: 395px;
	h2{
		margin: 17px 0 0 0;
		height: 35px;
		background-size: 42% 100%;
	}
	.mags-text{
		margin: 24px auto 0;
		width: 258px;
		line-height: 18px;
		font-size: 12px;
	}
	.date-price{
		margin: 20px 0 0 0;
		p{
			font-size: 14px;
		}
		.price{
			font-size: 12px;
		}
	}
	.mags-buy{
		margin: 20px 0 0 0;
		.buy-btn{
			width: 99px;
			height: 21px;
			line-height: 21px;
			font-size: 14px;
			background-size: 100% 100%;
		}
	}
}

.mags-slide{
	width: 210px;
	.slide-box{
		height:264px;
		li{
			height: 264px;
		}
	}
	.slide-ctrl{
		margin: 8px 0 0 0;
		li{
			margin: 0 0 0 9px;
			a{
				display: block;
				width: 8px;
				height: 8px;
				background-size: 100% 100%;
			}
		}
		li.on{
			a{ 
				background-size: 100% 100%;
			}
		}
	}
}

.column-slide{
	margin: 27px 0 0 0;
	.slide-box{
		height: 221px;
		.slide-piclist{
			width: 680px;
		}
		li{
			width: 158px;
			margin: 0 12px 0 0;
			img{
				width: 100%;
				height: 198px;
				display: block;
			}
			span{
				margin: 7px 0 0 0;
				line-height: 16px;
				font-size: 12px;
			}
		}
	}
	.slide-ctrl{
		a{
			width: 27px;
			height: 30px;
			top: 50%;
			margin-top: -14px;
			background-size: 200% 100%;
		}
		a.slide-ctrl-prev{
			background-position: 0 0;
			left: -40px;
		}
		a.slide-ctrl-next{
			background-position: -27px 0;
			right: -40px;
		}
	}
}
.column-slide.magazine-list{
	.slide-box{
		width: 680px;
		li{
			width:170px;
			a{
				width: 158px;
			} 
		}
	}
}
.mags-column{
	margin: 28px 0 0 0;
	h2{
		line-height: 23px;
		font-size: 20px;
	}
	.column-slide{
		margin: 0 0 20px 0;
		h4{
			line-height: 35px;
			font-size: 14px;
		}
		.slide-box{
			margin: 0px 0 0 0;
			.slide-piclist{
				width: 688px;
			}
			li{
				margin: 0 22px 0 0;
				width: 150px;
			}
		}
		.slide-box{
			margin: 0;
			height: 242px;
			.slide-piclist{
				float: left;
				width: 680px;
				height: 242px;
			}
			li{
				margin: 0 8px 0 0;
				width: 77px;
				height: 121px;
				.img-wrap{
					width: 77px;
					height: 101px;
				}
				img{
					width: 77px;
					height: 101px;
				}
				span{
					margin: 0;
					line-height: 20px;
					font-size: 12px;
				}
			}
		}
	}
}
.column-slide.mags-app-download{
	margin: 20px 0 0 0;
	.slide-box{
		height: auto;
		li{
			img{
				width: auto;
				margin: 0 auto;
			}
			span{
				font-size: 12px;
				line-height: 14px;
			}
			h6{
				margin: 8px 0 0 12px;
				line-height: 20px;
				font-size: 18px;
			}
			p{
				margin: 0 0 0 12px;
				line-height: 14px;
				color: #666666;
				font-size: 13px;
			}
			strong{
				display: block;
				margin: 12px 0 0 12px;
				line-height: 18px;
				font-size: 12px;
				color: #000;
			}
		}
		li.column-slide01{
			img{
				width: 120px;
				height: 110px;
			}
		}
		li.column-slide02{
			img{
				margin: 11px 0 0 38px;
				width: 123px;
				height: 94px;
			}
		}
		li.column-slide03{
			img{
				width: 94px;
				height: 90px;
			}
		}
	}
}

.column-slide.rule{
	margin: 40px 0 0 0;
	h2{
		line-height: 48px;
		font-size: 28px;
		font-weight: bold;
		text-align: center;
	}
	.slide-box{
		margin: 15px 0 0 0;
		height: 237px;
	}
}
.imgZoom{
	width:358px;
}
}