/*
瀏覽區域的寬度大於 設定值 CSS 被執行 min 
瀏覽區域的寬度小於 設定值 CSS 被執行 max
*/

/*螢幕橫向*/
@media screen and (orientation: landscape) {

}

/*螢幕直式*/
@media screen and (orientation: portrait) {
	.div-1-4 {
	width:46%;
	max-width:450px;
	}

	.prod-list-4X {
	width:46%;
	max-width:450px;
	}

}


@media screen and (min-width:1300px) and (max-width:2000px) {

}


@media screen and (min-width:1024px) and (max-width:1299px) {
	.prod-list-4X {
		width:21%;
		max-width:240px;
		}
}



@media screen and (max-width:830px) {
	.banner {
		height:220px;
	}
	.banner-text {
	font-size:40px;
	font-weight:normal;
	}

	.prod-list-4X {
		width:27%;
		max-width:270px;
		margin:0 10px;
	}

}


@media screen and (max-width :450px) {
	.banner {
    height:140px;
    width: 100%;
	}
	
	.banner-text {
	font-size:0px;
	}

	.prod-list-4X {
	width:40%;
	//max-width:270px;
	//margin:5px 10px;
	}
	

}