@charset "utf-8";
/* CSS Document */


/*all*/
@media only screen and (max-width: 680px) {

#detailTitlePrice .detailTitle {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCC;
	padding-top: 10px;
}

}

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

#wrapper #content_wrap #content {
	padding: 0px;
	margin: 0px;
	width: 100%;
}

/* tool 的 search 隱藏*/
#searchBtn_pc {
	display: none;
}

/* tool 的 會員中心按鈕 隱藏*/
.member-button {
	display: none;
}

/*tool 的 登入註冊按鈕 隱藏*/
.login-button {
	display: none;
}

/*tool 的 購物車按鈕 隱藏*/
.shop-button {
	display: none;
}

/*history*/
#history {
	display: none;
}

/*產品內頁的價格*/
.pcPrice {
	display: none;
}

#detailRight .detailword  p,#detailRight .detailButtond p {
	float: left;
	width: 100%;
	height: auto;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
}

#detailTitlePrice .detailTitle {
	padding-top: 10px;
}

.title4 {/*furniture的無標題*/
	height: 10px;
}

}

@media only screen and (min-width: 1121px) {

/*subMenu 的 search 隱藏*/
#searchBtn_tab {
     display: none;
}

/* tool 的 search 隱藏*/
#searchBtn_mobile {
	display: none;
}

.facebook-button_mobile, .line-button_mobile {
	display: none;
}

/* tool 的 無左側產品列表的頁面，電腦版要隱藏*/
.subMenuNone {
	display: none;
}

/*產品內頁的價格*/
.mobilePrice {
	display: none;
}

}





/*all*/
/*shopTable*/
@media only screen and (max-width: 480px) {

#shop  {
	width: 100%;
}

}





/*all*/
/*tool login signin member*/
@media only screen and (max-width: 1120px) {

#toolBox{
	display: none;
}

#toolBox .member-button,
#toolBox .logout-button,
#toolBox .signup-button,
#toolBox .login-button,
#toolBox .shop-button,
#toolBox .facebook-button{
	display: none;
}

}

@media only screen and (min-width: 1121px) {

#wrapper #tool_wrap {
}

#wrapper #tool_wrap #tool{
	height: 26px;
}

#toolBox .member-button,
#toolBox .logout-button,
#toolBox .signup-button,
#toolBox .login-button{
	float: right;
	margin-left: 20px;
	color: #000;
	text-decoration: none;
	font-family: Georgia, Times, "華文宋體", STSong, "宋體", SimSun, "新細明體", PMingLiu, "細明體", MingLiu, sans-serif;
	font-size: 0.75em;
	cursor: pointer;
	margin-top: 10px;
}

#toolBox .member-button:hover,
#toolBox .logout-button:hover,
#toolBox .signup-button:hover,
#toolBox .login-button:hover{
	color: #666;
	text-decoration: underline;
}

#toolBox .shop-button{
	float: right;
	margin-left: 20px;
	color: #073ea0;
	text-decoration: none;
	font-family: Georgia, Times, "華文宋體", STSong, "宋體", SimSun, "新細明體", PMingLiu, "細明體", MingLiu, sans-serif;
	font-size: 0.75em;
	cursor: pointer;
	margin-top: 10px;
}

#toolBox .shop-button:hover{
	color: #073ea0;
}

.facebook-button {
	background-image: url(../images/icon_fb.png);
	background-repeat: no-repeat;
	float: right;
	height: 25px;
	width: 25px;
	text-indent: -9999px;
	position: absolute;
	top: 0px;
	right: 0px;
	background-size: contain;
}

.facebook-button:hover {
	opacity: 0.5;
}

.line-button {
	background-image: url(../images/icon_line.png);
	background-repeat: no-repeat;
	float: right;
	height: 25px;
	width: 25px;
	text-indent: -9999px;
	position: absolute;
	top: 0px;
	right: 0px;
	background-size: contain;
}

.line-button:hover {
	opacity: 0.5;
}

}





/*all*/
/*footer*/
@media only screen and (min-width: 1px) and (max-width: 520px) {

#footer_wrap #footerMap ul {
	width: 50%;
	padding-left: 15px;
	padding-right: 15px;
}

#footer_wrap #footerMap ul:nth-child(6), #footer_wrap #footerMap ul:nth-child(7) {
	min-height: 20px;
}

#footer_wrap #footerMap ul:nth-child(3), #footer_wrap #footerMap ul:nth-child(5) {
	clear: both;
}

}

@media only screen and (min-width: 521px) and (max-width: 1000px) {

#footer_wrap #footerMap ul {
	width: 33.3333%;
	padding-left: 30px;
	padding-right: 30px;

}

#footer_wrap #footerMap ul:nth-child(4) {
	clear: both;
}

}

@media only screen and (min-width: 1001px) {

#footer_wrap #footerMap ul {
	width: 14.2857%;
	padding-left: 20px;
	padding-right: 20px;
}


}

@media only screen and (min-width: 1px) and (max-width: 999px) {

#footer_wrap #footerMap ul:nth-last-child(1), #footer_wrap #footerMap ul:nth-last-child(2) {
	float: left;
	margin-bottom: 0;
}

}

@media only screen and (min-width: 1000px) {

/*#footer_wrap #footerMap {
	display: flex;
	align-items: stretch;
}*/

#footer_wrap #footerMap ul {
}

#footer_wrap #footerMap ul li.footerTitle {
	padding-bottom: 5px;
}

}





/*member.html*/
/*memberBox*/
@media only screen and (min-width: 1px) and (max-width: 650px) {

.infoContent {
	right: 0;
}

.infoContent dl {
	font-size: 1em;
}

}


@media only screen and (min-width: 1px) and (max-width: 779px) {

#wrapper #content_wrap #content #memberBox_wrap {
	width: 100%;
}

#memberBox_wrap #memberBox {
	margin-top: 70px;
}

#memberBox #memberBoxNav li a {
	width: 120px;
}

#memberBox #memberBoxNav li a {
	font-size: 1em;
}

#memberBox .memberForm {
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 60px;
	padding-left: 20px;
}

.collapseTable .collapseTableOne td {
	font-size: 0.83em;
}

}

@media only screen and (min-width: 780px) {

#wrapper #content_wrap #content #memberBox_wrap {
	width: 700px;
}

#memberBox_wrap #memberBox {
	margin-top: 70px;
}

#memberBox .memberForm {
	padding-top: 30px;
	padding-right: 100px;
	padding-bottom: 60px;
	padding-left: 100px;
}

}





/*news.html及news_detail.html*/
/*newsBox*/
@media only screen and (min-width: 1px) and (max-width: 599px) {

#wrapper #content_wrap #content #newsBox {
	margin-top: 10px;
}

#newsBox ul {
	width: 100%;
}

#newsBox ul li {
	float: left;
	width: 80%;
	list-style-type: none;
	height: auto;
	margin-top: 40px;
	margin-right: 10%;
	margin-bottom: 0px;
	margin-left: 10%;
	position: relative;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#newsBox ul li a, #newsBox ul li img {
	width: 100%;
	height: auto;
}

#newsdetailBox #newsdetailBoxContent {
	margin-top: 20px;
}

}

@media only screen and (min-width: 600px) and (max-width: 899px) {

#wrapper #content_wrap #content #newsBox {
	margin-top: 20px;
}

#wrapper #content_wrap #content #newsBox {
	float: none;
}

#newsBox ul {
	width: 573px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

#newsBox ul li {
	float: left;
	width: 280px;
	list-style-type: none;
	padding: 0px;
	height: 210px;
	margin-top: 20px;
	margin-right: 13px;
	margin-bottom: 0px;
	margin-left: 0px;
	position: relative;
}

#newsBox ul li:nth-child(2n) {
	margin-right: 0px;
}

#newsdetailBox #newsdetailBoxContent {
	margin-top: 40px;
}

}

@media only screen and (min-width: 900px) and (max-width: 1120px) {

#wrapper #content_wrap #content #newsBox {
	margin-top: 30px;
}

#wrapper #content_wrap #content #newsBox {
	float: none;
}

#newsBox ul {
	width: 867px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

#newsBox ul li {
	float: left;
	width: 280px;
	list-style-type: none;
	padding: 0px;
	height: 210px;
	margin-top: 20px;
	margin-right: 13px;
	margin-bottom: 0px;
	margin-left: 0px;
	position: relative;
}

#newsBox ul li:nth-child(3n) {
	margin-right: 0px;
}

#newsdetailBox #newsdetailBoxContent {
	margin-top: 60px;
}

}

@media only screen and (min-width: 1121px) {

#wrapper #content_wrap #content #newsBox {
	margin-top: 40px;
}

#newsBox ul {
	float: left;
}

#newsBox ul li {
	float: left;
	width: 280px;
	list-style-type: none;
	padding: 0px;
	height: 210px;
	margin-top: 20px;
	margin-right: 13px;
	margin-bottom: 0px;
	margin-left: 0px;
	position: relative;
}

#newsBox ul li:nth-child(3n) {
	margin-right: 0px;
}

#newsdetailBox #newsdetailBoxContent {
	margin-top: 80px;
}

}





/*furniture_detail.html furniture_set_detail.html*/
@media only screen and (min-width: 681px) and (max-width: 1120px) {

#wrapper #content_wrap #content #right_wrap #right #detailBox {
	margin-top: 25px;
}

#detailBox #detailLeft {
	width: 50%;
}

#detailLeft img {
	width: 100%;
}

#detailLeft ul li {
	margin-right: 3.5%;
	margin-top: 5px;
	height: auto;
	width: 31%;
}

#detailLeft ul li img  {
	height: auto;
	width: 100%
}

#detailBox #detailRight {
	width: 50%;
}

.detailTable .detailTableWord #setLeft {
	float: left;
	height: auto;
	width: 30%;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
}

#setLeft img {
	float: left;
	height: auto;
	width: 100%;
}

.detailTable .detailTableWord #setRight {
	float: left;
	width: 70%;
	margin: 0px;
	height: auto;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 35px;
}

#setWord ul li {
	width: 130px;
	height: 168px;
}

#setWord ul li p {
	font-size: 0.95em;
	line-height: 1.2;
}

}

@media only screen and (min-width: 1px) and (max-width: 680px) {

#wrapper #content_wrap #content #right_wrap #right #detailBox {
	margin-top: 10px;
}

#detailBox #detailLeft {
	width: 100%;
}

#detailLeft img {
	width: 100%;

	height: auto;

}

#detailLeft ul {
	float: left;
	width: 100%;
	height: auto;
	list-style-image: none;
	list-style-type: none;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#detailLeft ul li img {
	float: left;
	margin: 0px;
	padding: 0px;
}

#detailBox #detailRight {
	width: 100%;
	padding-left: 0px;
	margin-top: 5px;
}

#detailRight ul li {
	float: left;
	margin-right: 3.5%;
	margin-top: 15px;
	height: 31%;
	width: 31%;
}

#detailRight ul li img  {
	height: auto;
	width: 100%
}

.detailTable .detailTableWord #setLeft {
	float: left;
	height: auto;
	width: 100%;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#setLeft img {
	float: left;
	height: auto;
	width: 100%;
}

.detailTable .detailTableWord #setRight {
	float: left;
	width: 100%;
	margin: 0px;
	height: auto;
	padding-top: 15px;
	padding-right: 0px;
	padding-bottom: 30px;
	padding-left: 0px;
}

#setWord ul li {
	width: 130px;
	height: 168px;
}

#setWord ul li p {
	font-size: 0.95em;
	line-height: 1.2;
}

}

@media only screen and (min-width: 1px) and (max-width: 480px) {

#rightTool .sort {
	margin-bottom: 5px;
}

#rightTool .layout {
	width: 65px;
}

#rightTool .layout span{
	display: none;
}

#rightTool .sort {
	width: 55px;
}

#rightTool .sort span{
	display: none;
}

}





/*cart.html*/
/*cartBox*/
@media only screen and (min-width: 1px) and (max-width: 340px) {

.cartTable dd .paymentTable tr td .selectStyle{
	width: 100px;
}

#cartBox form .button a {
	width: 120px;
}

#cartBox form .button input {
	width: 120px;
}

}

@media only screen and (min-width: 1px) and (max-width: 779px) {

#wrapper #content_wrap #content #cartBox_wrap {
	width: 100%;
}

#cartBox_wrap #cartBox {
	margin-top: 30px;
}

#cartBox form .cartTable .recipientForm {
	padding-top: 10px;
	padding-right: 20px;
	padding-left: 20px;
}

.cartTable dd .table tr th{
	padding-right: 5px;
	padding-left: 5px;
}

.cartTable dd .table tr td {
	padding-right: 5px;
	padding-left: 5px;
	font-size: 0.85em;
}

.cartTable dd .paymentTable tr td {
	font-size: 0.75em;
}

}

@media only screen and (min-width: 780px) {

#wrapper #content_wrap #content #cartBox_wrap {
	width: 700px;
}

#cartBox_wrap #cartBox {
	margin-top: 70px;
}

#cartBox form .cartTable .recipientForm {
	padding-top: 10px;
	padding-right: 100px;
	padding-left: 100px;
}

.cartTable dd .paymentTable tr td {
	font-size: 0.9em;
}

}





/*about.html*/
/*aboutBox*/
@media only screen and (min-width: 1px) and (max-width: 779px) {

#wrapper #content_wrap #content #aboutBox_wrap {
	width: 100%;
}

#contactBox_wrap #aboutBox {
	margin-top: 30px;
}

#aboutBox_wrap #aboutBoxContent {
	margin-top: 30px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 60px;
	padding-left: 20px;
}

}

@media only screen and (min-width: 780px) {

#wrapper #content_wrap #content #aboutBox_wrap {
	width: 700px;
}

#contactBox_wrap #aboutBox {
}

#aboutBox_wrap #aboutBoxContent {
	margin-top: 80px;
	padding-top: 10px;
	padding-right: 100px;
	padding-bottom: 60px;
	padding-left: 100px;
}

}





/*contact.html*/
/*contactBox*/
@media only screen and (min-width: 1px) and (max-width: 779px) {

#wrapper #content_wrap #content #contactBox_wrap {
	width: 100%;
}

#contactBox_wrap #contactBox {
	margin-top: 30px;
}

#contactBox .contactForm {
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 60px;
	padding-left: 20px;
}

}

@media only screen and (min-width: 780px) {

#wrapper #content_wrap #content #contactBox_wrap {
	width: 700px;
}

#contactBox_wrap #contactBox {
	margin-top: 80px;
}

#contactBox .contactForm {
	padding-top: 10px;
	padding-right: 100px;
	padding-bottom: 60px;
	padding-left: 100px;
}

}





/*input*/
@media only screen and (min-width: 1px) and (max-width: 779px) {

.memberForm .inputStyle1, .recipientForm .inputStyle1 {
	width: 50%;
}

}





/*password.html*/
/*passwordBox*/
@media only screen and (min-width: 1px) and (max-width: 779px) {

#wrapper #content_wrap #content #passwordBox_wrap {
	width: 100%;
}

#passwordBox_wrap #passwordBox {
	margin-top: 70px;
}

#passwordBox #passwordBoxNav li a {
	width: 120px;
}

#passwordBox #passwordBoxNav li a {
	font-size: 1em;
}

#passwordBox .passwordForm {
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 60px;
	padding-left: 20px;
}

}

@media only screen and (min-width: 780px) {

#wrapper #content_wrap #content #passwordBox_wrap {
	width: 500px;
}

#passwordBox_wrap #passwordBox {
	margin-top: 70px;
}

#passwordBox .passwordForm {
	padding-top: 30px;
	padding-right: 100px;
	padding-bottom: 60px;
	padding-left: 100px;
}

}





/*inside breadcrumb*/
@media only screen and (min-width: 1px) and (max-width: 480px) {

#wrapper #content_wrap #content #right_wrap #right #detailBox {
	margin-top: 0px;
}

#wrapper #breadcrumb_wrap {
	padding: 0px;
	overflow: hidden;
	float: left;
	width: 100%;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	background-image: url(../images/bg_breadcrumb.jpg);
	background-repeat: repeat-x;
	background-color: none;
}

#breadcrumbBox {
	float: left;
	height:  auto;
	line-height: 1.6;
	width: 100%;
	padding-right: auto;
	padding-left: auto;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
}

#breadcrumbBox ul li:nth-child(1):after {
	content: ">";
	margin-right: 10px;
	margin-left: 10px;
}

#breadcrumbBox ul li:nth-child(3){
	float: left;
	padding-top: 10px;
	width: 100%;
}

#breadcrumbBox ul li:nth-child(3) a {
	font-size: 1.2em;
}

}

@media only screen and (min-width: 481px) {

#wrapper #breadcrumb_wrap {
	background-color: #ebebed;
}

#breadcrumbBox ul li:after {
	content: ">";
	margin-right: 10px;
	margin-left: 10px;
}

#breadcrumbBox ul li:last-child:after {
	content: "";
}

}