@charset "utf-8";
/* CSS Document */
@media screen and (min-width:1300px), (orientation:portrait) {
.wrapper {
	width: 900px;
}
.demo-skin {
	width: 229px
}
}
@media all and (min-width:1200px) and (max-width: 1440px) {
#menu{  left:-10%;}
}
@media  screen and(max-width:1100px) {
 .wrapper {
 width: 748px;
}
#menu{ display: none;}
}

@media only screen and (max-width: 1024px) {
header > .container, header > .moreinfo, header > .moreinfo > .container {
	width: 100%;
}
.wrapper {
	width: 760px;
	margin: 0px auto auto 250px;
}
.container {
	width: 98%;
	margin: auto 1%;
}
#menu{ display: none;}
.contentwrap{ width:99%;}
.news{ width:86%; padding:45px 7% 47px 7%;}
.news .pages{padding:35px 340px 0 340px;}

.title-wrap .submenu {width: auto;float:right;margin:0px 2% 0 2%;}
.title-wrap .submenu ul {float:left;}
.title-wrap .submenu ul li { margin:10px 0 0 10px;}
.about-pic{  background-size:945px 350px;}
.history {width: 90%;}
.history .h1990 .c { width: 34%; }
.history .h1990 .c img {width: 90%; }
.history .h1990 .list {width: 66%;margin: 40px 0 0 0;  }
.history .h1990 .list ul li.mon {margin: 0 0 10px 11.5%; }
.history .h1990 .list ul li.mon p { width: 9.6%;  }
.history .h1990 .list ul li.mon span {width: 90%;  }
.history .h2010 .c { width: 34%; margin:18px  auto auto auto;  }
.history .h2010 .c img {width: 90%;  }
.history .h2010 .factory {width: 32%; }
.history .h2010 .factory1 {width: 32%;  }
.history .h2010 .list {width: 66%;    margin: 140px 0 0 0;  }
.history .h2010 .list ul li.mon {  margin: 0 0 10px 11.5%;  }
.history .h2010 .list ul li.mon p { width: 9.6%; }
.history .h2010 .list ul li.mon span { width: 90%; }
.history .h2010 .list1 ul li.mon { margin: 0 0 15px 8%; }
.history .h2010 .list1 ul li.mon > p {  width: 5.6%; }
.history .h2010 .list1 ul li.mon > span { width: 94%;  }
.history .h2015 .c { width: 34%; margin-top:120px;}
.history .h2015 .c img {  width: 90%;  }
.history .h2015 .list { width: 66%; margin: 140px 0 0 0;  }
.history .h2015 .list ul li.mon { margin: 0 0 10px 11.5%;  }
.history .h2015 .list ul li.mon p { width: 9.6%;  }
.history .h2015 .list ul li.mon span { width: 90%; }
  .distributor {
    width: 90%;
  }
  .distributor ul li {
    width: 89%;
    padding: 0 0 0 11%;
  }

.wrap {
	width: 960px
}
.leftmenu {
	width: 230px;
	padding: 34px 25px 0 25px
}
.leftmenu h2 {
	font-size: 27px;
	margin: 0 0 15px 0
}
.leftmenu ul li {
	padding: 10px 0
}
.leftmenu ul li a {
	font-size: 14px
}

.rightcontent {
	width: 730px
}
.rightcontent h3 {
	width: 90%;
	margin: 0 5%;
	padding: 40px 0 40px 0
}

.rightcontent .edit {
	width: 90%;
	margin: 0 5% 45px 5%
}
.sitemap{ width:100%;}
.sitemap h2{ padding:0 0 35px 0;}
.sitemap .list{ padding:0 0 65px 0;}
.sitemap .list ul li:first-child a{ padding:0;}
.container{width: 100%;}



}

@media only screen and (max-width: 960px) {
header > .container, header > .moreinfo, header > .moreinfo > .container {
	width: 100%;
}
.wrapper {
	width: 100%;
	float: left;
	margin:40px 0px 10px 0px;
}
header .logo {
	width: 253px;
	height: 52px;
	top: 10px;
	left: 0px;
	margin-bottom:5%;
}
.pageLine {
	width: 100%;
	z-index: 1; float:none;
}
.col.span_1_of_4.block1 {
	width: 40%;
	margin: auto 5% auto 5%;
}
.pull_1 {
	margin: 0px 1%;
}
#bannerscollection_zoominout_opportune {
	margin-top: 10px;
}
.container{width: 100%;}
.section{margin-top:-80px;}
.coninner{ width:100%;}

}
@media only screen and (max-width: 800px) {
header > .container, header > .moreinfo, header > .moreinfo > .container {
	width: 100%;
}
.wrapper {
	width: 100%;
	float: left;
	margin: 10px 0px;
}
header .logo {
	width: 253px;
	height: 52px;
	top: 10px;
	left: 10%;
}
.pageLine { display: none;}
.title-wrap .submenu {width: auto;float:left;margin:0px 2% 0 0;}
.title-wrap .submenu ul {float:left;}
.title-wrap .submenu ul li { margin:0px 0 0 10px;}
.about-pic{  padding:50px 20px 100px 80px;width:100%; margin:auto;}
.tab-container{width:100%;}
.etabs{ height:48px;}
.tabfir{ width:31%; position:absolute; padding:0 0 0 0; left:0; z-index:5; }
.tabfir a{ width:100%; text-align:center; padding:0; font-size:12px;}
.tabsec{width:41%; position:absolute; left:25.2%; padding:0 0 0 3%;}
.tabsec a{ padding:0; font-size:12px; text-align:center;}
.tabthi{width:42.5%; position:absolute; left:57.9%; z-index:3}
.tabthi a{ padding:0; font-size:12px; text-align:center;}
.tabfou{ position:absolute; left:75.5%; z-index:2}
.tabfou a{ padding: 0; font-size:12px; text-align:center;}
.tabinfo{ padding:60px 70px; min-height:300px  } 
.tabContents table {overflow-x: auto; display: block; }
.contentwrap{width:100%;}
.news {width:90%; padding: 0px; margin: auto; float:none;}
.news .list { float:none;width:90%; padding:0px 5%;}
.news .list ul a li:nth-child(1){ margin-bottom:20%;}

#form {width:98%;}
#form ul li{ margin:0 4% 10px 0;}
#form ul li:nth-child(2n){margin:0 0 10px 0;}
#form ul li >span,#form ul li.long span{ width:100%;}
#form ul li select{width:100%;}
#form ul li input{width:100%;}
#form ul li.long input,#form ul li textarea{ width:96.8%;}
#form ul li.code{width:100%; margin:0 0 10px 0;}
#form ul li.conbtn{width:100%; margin-top:20px;}
#team article { padding-bottom:3%;}
#team article span {left: 0;position: relative;	top: 0;	width:100%;}
#team article h3 { position: relative;   top: 5px;   width:100%;}
#team article ul {float: none;width:100%;}
.wrap {	width: 100%}
.leftmenu {  width: 100%; position:relative; clear:left;}
.rightcontent {	width: 100%;float: none;background: #fff;overflow: hidden;}
.edit {
	width: 90%;
	overflow: hidden;
	margin: 5%;
	float: left;
	font-size: 15px
}
#pagepiling  .container .intro {width:100%; margin-left:5%;float:left;}
#pagepiling  .container .intro-pic{width:100%; float:left; }

}

@media (max-width:767px) {
.wrapper {width: 100%;}
.highlight1, .highlight1b, .highlightno {display: none;}
.bannerscollection_zoominout.opportune .bannerControls {display: none;}
.bannerscollection_zoominout.opportune .leftNav {display: none;}
.bannerscollection_zoominout.opportune .rightNav {display: none;}
#menu{ display: none;}
.span_1_of_4, .span_2_of_3, .span_1_of_3, .span_1_of_10 {width: 100%;}
.news{  padding:25px 5% 47px 5%;}
.news h2{ line-height:120%; padding:35px 0 10px 0;}
.news p{ padding:6px 0 23px 0;}
.news p img{ width:100%;}
.news .list ul{ width:100%; padding:20px 0%;}
.news .list ul a li:first-child{width:99%; height:auto; margin:0;}
.news .list ul a li:nth-child(2),.news .list ul a li:nth-child(3),.news .list ul a li:nth-child(4),.news .list ul a li:nth-child(5){width:100%;}
.news .pages{ padding:20px 0 0 0;}
.sitemap h2{ padding:0 0 20px 0;}
.sitemap .list{ width:90%; padding:0 5%;}
.sitemap .list ul li{ background:url(../images/li.png) 3px 9px no-repeat;}
.sitemap .list ul:first-child, .sitemap .list ul:nth-child(2),.sitemap .list ul:nth-child(3){ width:90%;margin:0 5% 35px 5%;}


}
@media screen and (max-width: 640px){
.title-wrap .submenu {width:96%;float:left;margin:0;}
.title-wrap .submenu ul {float: left;}
.title-wrap .submenu ul li {width:100%; }
.title-wrap h1 {  width: 100%;}
header .logo {left:5%;}
.about-img img{ float:left; padding:0 30% 8% 0;}
.history {
	width: 90%;
	overflow: hidden;
	
	margin: 60px auto 0 auto
}
.history h2 {
	text-align: center
}
.history .h1990 {
	width: 100%;
	float: left;
	position: static;
	top: none
}
.history .h1990 .list {
	width: 100%;
	float: left;
	position: static;
	margin: 50px 0 0 0
}
.history .h1990 .list ul {
	width: 100%
}
.history .h1990 .list ul li.year {
	margin: 0 0 15px 0
}
.history .h1990 .list ul li.mon {
	width: 100%;
	margin: 0 0 10px 0
}
.history .h1990 .list ul li.mon>p {
	width: 17%
}
.history .h1990 .list ul li.mon>span {
	width: 83%
}
.history .h1990 .c {
	display: none
}
.history .h2010 {
	float: left;
	position: static;
	top: none
}
.history .h2010 .list {
	width: 100%;
	float: left;
	position: static;
	margin: 0px 0 0 0
}
.history .h2010 .list ul {
	width: 100%
}
.history .h2010 .list ul li.year {
	margin: 0 0 15px 0
}
.history .h2010 .list ul li.mon {
	width: 100%;
	margin: 0 0 10px 0
}
.history .h2010 .list ul li.mon>p {
	width: 17%
}
.history .h2010 .list ul li.mon>span {
	width: 83%
}
.history .h2010 .list1 ul {
	width: 100%
}
.history .h2010 .list1 ul li.year {
	margin: 0 0 15px 0
}
.history .h2010 .list1 ul li.mon {
	width: 100%;
	margin: 0 0 10px 0
}
.history .h2010 .list1 ul li.mon>p {
	width: 17%
}
.history .h2010 .list1 ul li.mon>span {
	width: 83%
}
.history .h2010 .c {	display: none;}
.history .h2010 .factory {display: none; }
.history .h2010 .factory1 {display: none; }

.history .h2015 {
	float: left;
	position: static;
	top: none
}
.history .h2015 .list {
	width: 100%;
	float: left;
	position: static;
	margin: 0px 0 0 0
}
.history .h2015 .list ul {
	width: 100%
}
.history .h2015 .list ul li.year {
	margin: 0 0 15px 0
}
.history .h2015 .list ul li.mon {
	width: 100%;
	margin: 0 0 10px 0
}
.history .h2015 .list ul li.mon>p {
	width: 17%
}
.history .h2015 .list ul li.mon>span {
	width: 83%
}
.history .h2015 .c {
	display: none
}
  .distributor {
    width: 100%;
    margin: 0 auto;
    padding: 50px 0 0 0;
    height: auto;
    overflow: hidden;
  }
  .distributor h2 {
    margin: 0 5% 35px 5%;
  }
  .distributor ul {
    width: 90%;
    margin:15% 5%;
  }
  .distributor ul li {
    width: 80%;
    min-height: 24px;
    padding: 7px 0 5px 44px;
    line-height: 140%;
  }
 
#pagepiling  .container .intro {width:100%; margin-left:5%;float:left;}
#pagepiling  .container .intro p{width:80%; display:block;}
#pagepiling  .container .intro-pic{width:100%; float:left;}
#pagepiling #section1 .container .intro{ margin-top:7%;}
#pagepiling #section3 .container .intro{ margin-top:7%;}
#pagepiling #section5 .container .intro{ margin-top:7%;}
.leftwrap {
	width:100%;
}
.rightwrap {
	width:100%;
}
table {
		overflow-x: auto;
		
	}
.cart_order_info_frame table tr td, .cart_order_info_frame table tr th {
    border-bottom: 1px dashed #B0B0B0;
    padding: 3%;
	
}	
.cart_order_info_frame input, .cart_order_info_frame select, .cart_order_info_frame textarea	{
	    width: 100%;
}
	
}


@media (max-width:480px) {
.wrapper {	width: 100%;}
.col {margin: 1%;}
.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4, .span_3_of_3, .span_2_of_3, .span_1_of_3, .span_1_of_10 {
	width: 100%;
}
.col.span_1_of_4.block1 {width: 100%;}
ul.list li {width: 100%;}
.pull_1 {margin: 0px 1%;}
#pp-nav ul{top:0px; position:absolute; right:-5px;}


#pagepiling .container .intro{width:80%; margin:25% 5% auto 5%;}
#pagepiling .container .intro p{display: none;}
#pagepiling .container .intro-pic{display: none;}
#pagepiling #section1 .container .intro{ margin-top:25%;}
#pagepiling #section3 .container .intro{ margin-top:25%;}
#pagepiling #section5 .container .intro{ margin-top:25%;}

.title-wrap h1 {width: 100%;}
.about-pic{  padding:50px 20px 100px 20px;}

}