/* ------ For Left Mode (Main Content) ------ */

#Left_Box {
	float:right;
	padding-top:10px;
	width: 270px;
}

#MainContent_Box, #MainContent_Box2 {
	margin-left:0;
	margin-right:290px;
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	width:auto;
	overflow:hidden;		/* ต้องใส่ไว้ ไม่งั้นถ้าฝั่งขวามือมี style=clear:both จะเกิดการตัดขึ้นบรรทัดใหม่ต่อท้ายด้านล่างสุดของ object ตัวสุดท้ายด้านซ้าย (เกิดเป็นช่องว่างขนาดใหญ่) */
}

.MainContent_Box2_ShowMenuBox {
	margin-left:auto;
	margin-right:290px;
	width:auto;
	overflow:hidden;
}






@media only screen and (max-width:560px) {

#Left_Box {
	clear:both;
	width: 100%;
}

#MainContent_Box, #MainContent_Box2, .MainContent_Box2_ShowMenuBox {
	margin-right:0px;
	clear:both;
	width: 100%;
}

}



/* ----- Article Detail ----- */

@media only screen and (max-width:1920px) {

	.article_box {
		width:33.33%;
	}

}

@media only screen and (max-width:1183px) {

	.article_box {
		width:49%;
	}

}

@media only screen and (max-width:1035px) {

	.article_box {
		height:340px;
	}

	.article_topic {
		font-size:2.2em;
	}

}

@media only screen and (max-width:747px) {

	.article_box {
		width:98%;
		height:390px;
	}

}

@media only screen and (max-width:863px) {

	.article_box {
		width:98%;
		height:390px;
	}

	#arc_time span {
		display:block;
		box-sizing:border-box;
		padding-top:7px;
		clear:left;
	}

}

@media only screen and (max-width:636px) {

	.article_box {
		height:330px;
	}

}

@media only screen and (max-width:592px) {

	.article_topic {
		font-size:1.9em;
	}

}

@media only screen and (max-width:560px) {

	.article_topic {
		font-size:2.2em;
	}

	.article_box {
		height:400px;
	}

}

@media only screen and (max-width:362px) {

	.article_box {
		height:335px;
	}

}




/* -------------- Mouse Over Show Menu PdtCategory (Arrow Right) -------------- */

#mnu_pdts_box:after, #mnu_pdts_box:before {
	right:auto;
	left: 100%;
}

#mnu_pdts_box:after {
	border-right-color:transparent;
	border-left-color: #ffffff;
}
#mnu_pdts_box:before {
	border-right-color:transparent;
	border-left-color: #dddddd;
}





/* ----------------- Track At Home ----------------- */

.track_datas {
	width:300px;
}

.TrackContentBox_Content .track_datas {
	width:330px;
}



/* -------------------- PdtDetail (Attribute) -------------------- */
@media only screen and (max-width:944px) {

	.pdtattr_box {
		width: 45%;
	}

}

@media only screen and (max-width:750px) {

	.pdtattr_box {
		width: 95%;
	}

}

@media only screen and (max-width:560px) {

	.pdtattr_box {
		width: 45%;
	}

}

@media only screen and (max-width:455px) {

	.pdtattr_box {
		width:95%;
	}

}