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


/*all inside*/
@media only screen and (min-width: 1px) and (max-width: 1050px) {
	
#contentTop strong {
	top: 15px;
	display: none;
	font-size: 0.85em;
}

#breadcrumbBox {
	top: -10px;
}

}





/*case.html*/
@media only screen and (min-width: 1px) and (max-width: 549px) {
	
#caseBox ul .list .top {
	background-image: url(../images/icon_case.png);
	background-size: 70px 70px;
	padding-left: 80px;
}

#caseBox ul li.list .date {
	margin-top:10px;
	font-size: 0.9em;
}

#caseBox ul li.list .title {
	font-size: 1.1em;
	width: 95%;
	line-height:1.3;
}

}

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

#caseBox ul {
	float: left;
	padding: 0px;
	width: 96%;
	margin-top: 0px;
	margin-right: 2%;
	margin-bottom: 0px;
	margin-left: 2%;
}

}

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

#caseBox ul li.list .title {
	line-height:2;
}

}





/*center.html*/
@media only screen and (min-width: 1px) and (max-width: 519px) {
	
#centerBox ul li {
	width: 96%;
	margin-right: 2%;
	margin-bottom: 2%;
	margin-left: 2%;
}

#centerBox ul li {
	height: 320px;
}

}

@media only screen and (min-width: 520px) and (max-width: 779px) {
	
#centerBox ul li {
	width: 46%;
	margin-right: 2%;
	margin-bottom: 2%;
	margin-left: 2%;
}

#centerBox ul li {
	height: 320px;
}

}

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

#centerBox ul li {
	height: 350px;
}

#centerBox ul li h3 {
	font-size: 1.05em;
}

#centerBox ul li p {
	font-size: 0.9em;
}

}

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

#centerBox ul li {
	height: 320px;
}

#centerBox ul li h3 {
	font-size: 1.05em;
}

#centerBox ul li p {
	font-size: 0.92em;
	margin-top: 5px;
	margin-bottom: 5px;
}

}

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

#centerBox ul li {
	height: 300px;
}

#centerBox ul li h3 {
	font-size: 1.05em;
}

#centerBox ul li p {
	font-size: 0.95em;
	margin-top: 5px;
	margin-bottom: 5px;
}

}




/*contact.html*/
@media only screen and (min-width: 1px) and (max-width: 1000px) {
	
#form #formTable tr th {
	width: 100%;
	float:left;
	text-align: left;
	height:25px;
	line-height:25px;
}

#form #formTable tr td {
	width: 100%;
	float:left;
}

.form-words1 {
	width: 100%;
}

.form-words2{
	width: 100%;
}

.form-words3 {
	width: 100%;
	height: 100px;
}

#contactContent .left {
	margin-top: 10px;
}

.contactRight #map {
	width: 100%;
}

}





/*news.html*/
@media only screen and (min-width: 1px) and (max-width: 499px) {
	
#newsBox ul li {
	height: 470px;
}

#newsBox ul li {
	width: 96%;
	margin-right: 2%;
	margin-left: 2%;
	margin-bottom: 2%;
	padding: 20px;
	text-align: center;
}

#newsBox ul li .more {
	margin-top: 10px;
}

}

@media only screen and (min-width: 500px) and (max-width: 619px) {

#newsBox ul li .title {
	height: 70px;
}

#newsBox ul li .more {
	margin-top: 10px;
}

#newsBox ul li {
	width: 46%;
	margin-right: 2%;
	margin-left: 2%;
	margin-bottom: 2%;
	padding: 20px;
	text-align: center;
	height: 470px;
}

}

@media only screen and (min-width: 620px) and (max-width: 869px) {

#newsBox ul li {
	height: 470px;
	width: 46%;
	margin-right: 2%;
	margin-left: 2%;
	margin-bottom: 2%;
	padding: 20px;
	text-align: center;
}

#newsBox ul li .more {
	margin-top: 10px;
}

}

@media only screen and (min-width: 870px) and (max-width: 1200px) {

#newsBox ul li {
	height: 480px;
}
	
#newsBox ul li .title {
	height: 70px;
}

#newsBox ul li .more {
	margin-top: 10px;
}

}

@media only screen and (min-width: 1201px) and (max-width: 1280px) {

#newsBox ul li {
	height: 490px;
}

#newsBox ul li .more {
	margin-top: 10px;
}

}





/*news_detail.html*/
@media only screen and (min-width: 1px) and (max-width: 740px) {
	
#newsDetailBox  {
	max-width:96%;
	padding-top: 0;
	padding-right: 2%;
	padding-bottom: 0;
	padding-left: 2%;
	background-color:red;
}	

#newsDetailBox .up .title {
	width: 100%;
}

#newsDetailBox .up .date {
	width: 100%;
}
	
}





/*price.html*/
@media only screen and (min-width: 1px) and (max-width: 760px) {

#priceBox .left {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 2%;
}

#priceBox .left h3 {
	width: 100%;
}

#priceBox .left h4 {
	width: 100%;
}

#priceBox .right {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 2%;
}

}





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

#productBox .right ul li {
	float: left;
	height: auto;
	width: 31.3%;
	margin-right: 1%;
	margin-left: 1%;
	margin-bottom: 1%;
}

.productTablewareBox {
	padding-right: 5%;
	padding-left: 5%;
}

}

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

#productBox .left {
	float:left;
	width: 100%;
	margin-top: 20px;
	padding-left: 2%;
	padding-right: 2%;
}

.left .subNav {
	float:left;
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.subNav li {
	float:left;
	list-style-image: none;
	list-style-type: none;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;
	width: 48%;
}

#productBox .left .subNav li a {
	width: 100%;
}

#productBox .left .subNav .current a {
	width: 100%;
}

#productBox .right {
	float: left;
	width: 100%;
	padding-left: 2%;
	padding-right: 2%;
}

#productBox .right1 {
	float: left;
	width: 100%;
	padding-left: 2%;
	padding-right: 2%;
}

}

@media only screen and (min-width: 451px) and (max-width: 1100px) {
	
#productBox .left {
	float:left;
	width: 100%;
	margin-top: 20px;
	padding-left: 2%;
	padding-right: 2%;
}

.left .subNav {
	float:left;
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.subNav li {
	float:left;
	list-style-image: none;
	list-style-type: none;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;
}

#productBox .left .subNav li a {
	width: 130px;
}

#productBox .left .subNav .current a {
	width: 130px;
}

#productBox .right {
	float: left;
	width: 100%;
	padding-left: 2%;
	padding-right: 2%;
}

#productBox .right1 {
	float: left;
	width: 100%;
	padding-left: 2%;
	padding-right: 2%;
}

}