@charset "utf-8";

/* CSS Document */

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_header_rwd.php <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.headerRwd { display: none; }
.rwdMenuContainer { height: 50px; width: 100%; background: #85b7f9; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5); padding: 0 5px; position: fixed; top: 0; z-index: 150; overflow: hidden; }
.rwdMenuIcon { float: left; width: 50px; color: #fff; text-align: center; cursor: pointer; }
.rwdMenuLogo { float: left; vertical-align: middle; text-align: center; margin: 12px auto 0; width: calc(100% - 110px); }
.rwdMenuLogo>a>img { width: 150px; }
.rwdHeaderNavContainer { position: fixed; top: 0; bottom: 0; margin-top: 50px; width: 100%; background: rgba(255, 255, 255, 0.5); z-index: 999; }
.rwdHeaderNav { position: absolute; top: 0; bottom: 0; width: 300px; background: rgba(0, 0, 0, 0.8); z-index: 50; font: normal 16px '微軟正黑體'; line-height: 60px; letter-spacing: 1px; text-align: center; overflow: scroll; }
.rwdHeaderNav>ul>li { }
.rwdHeaderNav>ul>li>a { color: #fff; }
.rwdHeaderNav a { color: #ccc; }
.rwdSubNavTitle { color: #fff; cursor: pointer; }
.rwdSubProductNavTitle, .rwdSubProductNavTitle a { color: lightblue; cursor: pointer; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> footer_rwd.php <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.footerRwd { display: none; position: absolute; bottom: 0; width: 100%; }
.footerRwdCopyright { width: 100%; background: #000f33; color: #fff; text-align: center; font: normal 12px '微軟正黑體'; letter-spacing: 1px; line-height: 30px; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_phone_menu.php <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.phoneMenu { width: 100%; height: 50px; background: rgba(100, 150, 220, 0.7); position: fixed; bottom: 0; z-index: 30; display: none; }
.phoneMenu>ul>li { float: left; width: 25%; text-align: center; padding: 5px 0; }
.phoneMenu>ul>li>a { color: #fff; }
.phoneMenuTitle { font: normal 12px 'Century Gothic','微軟正黑體'; line-height: 16px; letter-spacing: 2px; }
.ui-widget-header{
	background: none;
	border: none;
	color: #fff;
	font: normal 16px '微軟正黑體';
	letter-spacing: 1px;
	border-bottom: solid 1px #ccc;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> member_order_detail.php欄位修改 <<<---------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1280px) {
	.wrapper { width: 96%; margin: 0 2%; }
}
@media (max-width:1000px){
}
@media screen and (max-width:900px) {
	.headerRwd { display: block; }
	.header { display: none; }
	.goTop { bottom: 60px; right: 20px; }
	.bodyContainer { padding: 50px 0 30px;min-height: calc(100% - 80px) }
	.indexLeftContainer{float: none;width: 100%; margin: 0 0 20px;}
	.indexVedioContainer{float: none;width: 100%;}
	.footer{
		display: none;
	}
	.phoneMenu{
		display: block;
	}
	.productNavContainer{
		display: none
	}
	.productMainContent{
		float:none;
		width: calc(100%);
	}
}
@media screen and (max-width:800px) {
}
@media screen and (max-width:700px) {
.newsBox{
	width: 48%;
	margin: 0 1% 30px;
}
.productBox{
	float: left;
	width: 31.33%;
	margin: 0 1% 30px;
}
.productDetailImg{
	float: none;
	width: 100%;
	margin: 0 0 20px 0px;
}
.productDetailContent{
	float: none;
	width: 100%;
}
.mobil_hide{ display: none; }
}
@media screen and (max-width:600px) {
	.productBox{
		float: left;
		width: 48%;
		margin: 0 1% 30px;
	}
	.newsDate{
		float: left;
		width: 95px;
		text-align: center;
	}
	.newsTitle{
		float: left;
		width: calc(100% - 97px);
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

}
@media screen and (max-width:500px) {
.indexNewsTitle{
	float: none;
}
.indexNewsContent{
	float: none;
	width: calc(100% - 0px);
}
.indexProductContent>ul>li{
	float: left;
	width: 48%;
	margin: 0 1% 20px;
}
.newsBox{
	width: 98%;
	margin: 0 1% 30px;
}
}
@media screen and (max-width:400px) {
}