h2{
	font-family: swis721 cn bt bold;
	font-size: 2em;
	color: rgb(0,160,135);
	text-align: center;
	width: 100%;
	padding: 1vw;
}

/*-----------product----------*/

#product_content{
 width: 100%;
 display: flex;
 flex-direction: row;
 justify-content: space-between;
 flex-wrap: wrap;
 margin-top:100px;
 
 padding-left: 100px;
 padding-right: 100px;


}
	
#product_box{
	display: flex;
	align-items: flex-end;
	width: 19.5vw;
	height: 19.5vw;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgb(200,200,200);
	margin-bottom: 2vw;
	overflow: hidden;
}

#product_label{
	width: 100%;
	height: 6vw;
	padding: 1vw;
	background: white;
}

#product_label>#name{color: rgb(0,160,135);}

#product_label>#desc{color: gray; font-size: 0.8em;}

.product_1{	background: url("picture/product/hdpe_sf.jpg") center/120% no-repeat;}
.product_2{	background: url("picture/product/hdpe.jpg") center/120% no-repeat;}
.product_3{	background: url("picture/product/hdpe_black.jpg") center/120% no-repeat;}
.product_4{ background: url("picture/product/ldpe.jpg") center/120% no-repeat; }
.product_5{ background: url("picture/product/ldpe_white.jpg") center/120% no-repeat;}
.product_6{ background: url("picture/product/ldpe_green.jpg") center/120% no-repeat;}
.product_7{ background: url("picture/product/lldpe.jpg") center/120% no-repeat;}
.product_8{ background: url("picture/product/pp.jpg") center/120% no-repeat;}
.product_9{ background: url("picture/product/pp_black.jpg") center/120% no-repeat;}



/*-----------facitity----------*/

#facility_content{
 width: 100%;
 display: flex;
 flex-wrap: wrap;
 margin-top:50px;
 padding-left: 100px;
 padding-right: 100px;
 
}
	
#facility_box{
	display: flex;
	align-items: flex-end;
	width: 25vw;
	height: 18vw;
	box-shadow: 5px 5px 10px rgb(200,200,200);
	border-radius: 15px;
	margin: 1vw;
	overflow: hidden;
	

}

.facility_1{ background: url("picture/facility/facility_1 copy.jpg") 50% 0/120% no-repeat;}
.facility_2{ background: url("picture/facility/facility_2 copy.jpg") 50% 0%/120% no-repeat;}
.facility_3{ background: url("picture/facility/facility_3 copy.jpg") 50% 0/120% no-repeat;}
.facility_4{ background: url("picture/facility/facility_4 copy.jpg") 50% 0%/120% no-repeat;}
.facility_5{ background: url("picture/facility/facility_5 copy.jpg") 50% 50%/100% no-repeat;}
.facility_6{ background: url("picture/facility/facility_6 copy.jpg") 50% 50%/100% no-repeat;}
.facility_7{ background: url("picture/facility/facility_7 copy.jpg") 50% 0/120% no-repeat;}
.plan_8{ background: url("picture/facility/siteplan.jpg") center/100% no-repeat;}
.plan_9{ background: url("picture/facility/sorting_area.jpg") center/100% no-repeat;}
.plan_10{ background: url("picture/facility/granulating_area.jpg") center/100% no-repeat;}

#facility_label{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 4vw;
	padding: 1vw;
	background: white;
}

#facility_label>#name{color: rgb(0,160,135); font-size: 0.9em}


#facility_link{
	display: flex;
	width: 100%;
	padding: 2vw;
}

#facility_link>a{
	margin: auto;
}

#facility_link>a>button{
	width: 120px;
	height:50px;
	border : 1px solid rgb(0,160,135);
	border-radius: 25px;
	background: rgb(0,160,135);
	font-size: 1em;
	font-weight: 600;
	color: white;
}

/*-----------news----------*/

#news_content{
 width: 100%;
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 margin-top:100px;
 padding-left: 100px;
 padding-right: 100px;
 background: rgb(245,245,245);
}

#news_box{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	width: 41vw;
	height: 28vw;
	border-radius: 5px;
	border: 1px solid rgb(200,200,200);
	background: white;
	padding-left: 2vw;
	padding-right: 2vw;
	margin-bottom: 2vw;
}

#news_source{
	display: flex;
	height: 5vw;
	font-size: 1em;
	border-bottom: 1px solid rgb(200,200,200);
	
}



#news_title{
	display: flex;
	height: 8vw;
	font-size: 1em;
	font-weight: 600;
	line-height: 1.5em;
}

#news_pic_1{
	width: 80px;
	height: 80px;
	background: url("picture/news/bottle.jpg") center/cover no-repeat; 
	border-radius: 10px;
	margin: auto;
}

#news_pic_2{
	width: 80px;
	height: 80px;
	background: url("picture/news/plastic_waste.jpg") center/cover no-repeat; 
	border-radius: 10px;
	margin: auto;
}


#news{
	display: flex;
	height: 9vw;
	font-size: 0.9em;
	line-height: 1.5em;
	color: gray;
}

#news_source>p{width: 100%; margin: auto;}
#news_title>h3{width: 70%; margin: auto;}
#news>p{margin: auto;}

#news_link>a{
	height: 5vw;
	font-size: 0.9em;
	font-weight: 600;
	color: rgb(0,160,135);
}



@media screen and (min-width: 1024px) and (max-width: 1200px) and (orientation: landscape){
	  /* For TAB: landscape*/
	  
	 /*-----------product----------*/

	#product_content{
	 width: 100%;
	 height: 25%;
	 display: flex;
	 justify-content: space-between;
	 flex-wrap: wrap;
	 margin-top: 50px;
	 padding-left: 50px;
	 padding-right: 50px;
	}
		
	#product_box{
		display: flex;
		align-items: flex-end;
		width: 28vw;
		height: 28vw;
		border-radius: 15px;
		box-shadow: 3px 3px 8px rgb(200,200,200);
		margin-bottom: 3vw;
		overflow: hidden;
	}

		
	/*-----------facitity----------*/

	#facility_content{
	 width: 100%;
	 display: flex;
	 flex-wrap: wrap;
	 margin-top:50px;
	 padding-left: 50px;
	 padding-right: 50px;

	}
		
	#facility_box{
		display: flex;
		align-items: flex-end;
		width: 42vw;
		height: 30vw;
		box-shadow: 5px 5px 10px rgb(200,200,200);
		border-radius: 15px;
		margin: 1.5vw;
		overflow: hidden;
	}

	.facility_1{ background: url("picture/facility/facility_1 copy.jpg") 50% 0/120% no-repeat;}
	.facility_2{ background: url("picture/facility/facility_2 copy.jpg") 50% 0%/120% no-repeat;}
	.facility_3{ background: url("picture/facility/facility_3 copy.jpg") 50% 0/120% no-repeat;}
	.facility_4{ background: url("picture/facility/facility_4 copy.jpg") 50% 0%/120% no-repeat;}
	.facility_5{ background: url("picture/facility/facility_5 copy.jpg") 50% 50%/100% no-repeat;}
	.facility_6{ background: url("picture/facility/facility_6 copy.jpg") 50% 50%/100% no-repeat;}
	.facility_7{ background: url("picture/facility/facility_7 copy.jpg") 50% 0/120% no-repeat;}
	.plan_8{ background: url("picture/facility/siteplan.jpg") center/100% no-repeat;}
	.plan_9{ background: url("picture/facility/sorting_area.jpg") center/100% no-repeat;}
	.plan_10{ background: url("picture/facility/granulating_area.jpg") center/100% no-repeat;}

	#facility_label{
		display: flex;
		width: 100%;
		height: 6vw;
		padding: 1vw;
		background: white;
	}

	#facility_label>#name{margin: auto; color: rgb(0,160,135); font-size: 1em}

	#facility_link>button{
		width: 150px;
		height:50px;
		border : 1px solid rgb(0,160,135);
		border-radius: 25px;
		background: rgb(0,160,135);
		font-size: 1em;
		font-weight: 600;
		color: white;
		margin: auto;
	}
	
	/*-----------news----------*/

	#news_content{
	 width: 100%;
	 margin-top:100px;
	 padding-left: 50px;
	 padding-right: 50px;
	}

	#news_box{
		width: 44vw;
		height: 30vw;
		border-radius: 5px;
		border: 1px solid rgb(200,200,200);
		background: white;
		padding-left: 2vw;
		padding-right: 2vw;
		margin-bottom: 2vw;
	}

	#news_title{
		height: 10vw;
		font-size: 0.9em;
	}

	#news_pic_1{
		width: 90px;
		height: 90px;
		background: url("picture/news/bottle.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}

	#news_pic_2{
		width: 90px;
		height: 90px;
		background: url("picture/news/plastic_waste.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}


	#news{
		display: flex;
		height: 10vw;
		font-size: 0.9em;
		line-height: 1.3em;
		color: gray;
	}

	#news_source>p{width: 100%; margin: auto;}
	#news_title>h3{width: 70%; margin: auto;}
	#news>p{margin: auto;}

	#news_link{
		height: 5vw;
		font-size: 0.9em;
		font-weight: 600;
		color: rgb(0,160,135);
	}

	  
}

@media screen and (min-width: 767px) and (orientation: portrait){
	  /* For TAB: portrait */
	  
	  
		 /*-----------product----------*/

	#product_content{
	 width: 100%;
	 height: 25%;
	 display: flex;
	 justify-content: space-between;
	 flex-wrap: wrap;
	 margin-top: 50px;
	 padding-left: 50px;
	 padding-right: 50px;
	}
		
	#product_box{
		display: flex;
		align-items: flex-end;
		width: 42vw;
		height: 42vw;
		border-radius: 10px;
		box-shadow: 3px 3px 5px rgb(200,200,200);
		margin-bottom: 3vw;
		overflow: hidden;
	}

	#product_label{
		width: 100%;
		height: 8vw;
		padding: 2vw;
		background: white;
	}

	#product_label>#name{color: rgb(0,160,135);font-size: 1em;}
	#product_label>#desc{color: gray; font-size: 0.8em;}


	/*-----------facitity----------*/

	#facility_content{
	 width: 100%;
	 padding-left: 50px;
	 padding-right: 50px;

	}
		
	#facility_box{
		width: 40vw;
		height: 30vw;
		box-shadow: 3px 3px 5px rgb(200,200,200);
		border-radius: 10px;
	}

	
	#facility_label{
		display: flex;
		width: 100%;
		height: 6vw;
		padding: 1vw;
		background: white;
	}
		
	#facility_label>#name{margin: auto; color: rgb(0,160,135); font-size: 0.9em}

	#facility_link>button{
		height:40px;
	}

	 
		
	/*-----------news----------*/

	#news_content{
	 width: 100%;
	 margin-top:100px;
	 padding-left: 50px;
	 padding-right: 50px;
	}

	#news_box{
		width: 43vw;
		height: 43vw;
		border-radius: 5px;
		border: 1px solid rgb(200,200,200);
		background: white;
		padding-left: 2vw;
		padding-right: 2vw;
		margin-bottom: 2vw;
	}

	#news_title{
		height: 15vw;
		font-size: 0.9em;
	}

	#news_pic_1{
		width: 70px;
		height: 70px;
		background: url("picture/news/bottle.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}

	#news_pic_2{
		width: 70px;
		height: 70px;
		background: url("picture/news/plastic_waste.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}


	#news{
		display: flex;
		height: 17vw;
		font-size: 0.9em;
		line-height: 1.3em;
		color: gray;
	}

	#news_source>p{width: 100%; margin: auto;}
	#news_title>h3{width: 70%; margin: auto;}
	#news>p{margin: auto;}

	#news_link{
		height: 5vw;
		font-size: 0.9em;
		font-weight: 600;
		color: rgb(0,160,135);
	}	  
}


@media only screen and (max-width: 500px){
	  /* For MOBILE PHONE: portrait */
		  
	/*-----------product----------*/

	#product_content{
	 width: 100%;
	 display: flex;
	 flex-direction: row;
	 justify-content: space-between;
	 align-items: center;
	 flex-wrap: wrap;
	 margin-top:30px;
	 padding-left: 15px;
	 padding-right: 15px;
	}
		
	#product_box{
		display: flex;
		align-items: flex-end;
		width: 44vw;
		height: 50vw;
		border-radius: 15px;
		box-shadow: 3px 3px 5px rgb(200,200,200);
		margin-bottom: 5vw;
		overflow: hidden;
	}

	#product_label{
		width: 100%;
		height: 16vw;
		padding: 2vw;
		background: white;
	}

	#product_label>#name{color: rgb(0,160,135); font-size: 0.9em}

	#product_label>#desc{color: gray; font-size: 0.6em;}


	/*-----------facitity----------*/

	#facility_content{
	 width: 100%;
	 display: flex;
	 flex-wrap: wrap;
	 margin-top:50px;
	 padding-left: 25px;
	 padding-right: 25px;
	 margin-bottom: 50px;

	}
		
	#facility_box{
		display: flex;
		align-items: flex-end;
		width: 85vw;
		height: 70vw;
		box-shadow: 5px 5px 10px rgb(200,200,200);
		border-radius: 15px;
		margin: 0;
		margin-bottom: 5vw;
		overflow: hidden;
	}

	#facility_label{
		width: 100%;
		height: 14vw;
		padding: 3vw;
		background: white;
	}

	#facility_label>#name{color: rgb(0,160,135); font-size: 0.9em}


	#facility_link{
		display: flex;
		width: 100%;
		padding: 2vw;
	}

	#facility_link>button{
		width: 120px;
		height:50px;
		border : 1px solid rgb(0,160,135);
		border-radius: 25px;
		background: rgb(0,160,135);
		font-size: 1em;
		font-weight: 600;
		color: white;
		margin: auto;
	}

	/*-----------news----------*/

	#news_content{
	 width: 100%;
	 display: flex;
	 justify-content: space-between;
	 flex-wrap: wrap;
	 margin-top: 50px;
	 padding-left: 25px;
	 padding-right: 25px;
	 background: rgb(245,245,245);
	}

	#news_box{
		display: flex;
		flex-direction: column;
		overflow: hidden;
		width: 85vw;
		height: 85vw;
		border-radius: 5px;
		border: 1px solid rgb(200,200,200);
		background: white;
		padding-left: 3vw;
		padding-right: 3vw;
		margin-bottom: 5vw;
	}

	#news_source{
		display: flex;
		height: 10vw;
		font-size: 1em;
		border-bottom: 1px solid rgb(200,200,200);
	}

	#news_title{
		display: flex;
		height: 30vw;
		font-size: 1em;
		font-weight: 600;
		line-height: 1.3em;
	}

	#news_pic_1{
		width: 80px;
		height: 80px;
		background: url("picture/news/bottle.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}

	#news_pic_2{
		width: 80px;
		height: 80px;
		background: url("picture/news/plastic_waste.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}


	#news{
		display: flex;
		height: 30vw;
		font-size: 0.9em;
		line-height: 1.3em;
		color: gray;
		overflow: hidden;
	}

	#news_source>p{width: 100%; margin: auto;}
	#news_title>h3{font-size: 1em; width: 65%; margin: auto;}
	#news>p{margin: auto;}

	#news_link{
		display: flex;
		align-items: center;
		height: 10vw;
		font-size: 0.9em;
		font-weight: 600;
		color: rgb(0,160,135);
	}
}	


@media screen and (min-width: 550px) and (max-width: 900px) and (orientation: landscape){
	  /* For mobile phone: landscape*/
	  
	    
	/*-----------product----------*/

	#product_content{
	 width: 100%;
	 display: flex;
	 justify-content: space-between;
	 align-items: center;
	 flex-wrap: wrap;
	 margin-top: 50px;
	 padding-left: 25px;
	 padding-right: 25px;
	}
		
	#product_box{
		display: flex;
		align-items: flex-end;
		width: 45vw;
		height: 45vw;
		border-radius: 15px;
		box-shadow: 5px 5px 10px rgb(200,200,200);
		margin-bottom: 5vw;
		overflow: hidden;
	}

	#product_label{
		width: 100%;
		height: 10vw;
		padding: 3vw;
		background: white;
	}

	#product_label>#name{color: rgb(0,160,135); font-size: 1em}

	#product_label>#desc{color: gray; font-size: 0.8em;}


	/*-----------facitity----------*/

	#facility_content{
	 width: 100%;
	 display: flex;
	 flex-wrap: wrap;
	 margin-top:50px;
	 padding-left: 25px;
	 padding-right: 25px;

	}
		
	#facility_box{
		display: flex;
		align-items: flex-end;
		width: 45vw;
		height: 35vw;
		box-shadow: 5px 5px 10px rgb(200,200,200);
		border-radius: 15px;
		margin: 0;
		margin: auto;
		margin-bottom: 5vw;
		overflow: hidden;
	}

	#facility_label{
		width: 100%;
		height: 10vw;
		padding: 3vw;
		background: white;
	}

	#facility_label>#name{color: rgb(0,160,135); font-size: 0.9em}


	#facility_link{
		display: flex;
		width: 100%;
		padding: 2vw;
	}

	#facility_link>button{
		width: 120px;
		height:50px;
		border : 1px solid rgb(0,160,135);
		border-radius: 25px;
		background: rgb(0,160,135);
		font-size: 1em;
		font-weight: 600;
		color: white;
		margin: auto;
	}

	/*-----------news----------*/

	#news_content{
	 width: 100%;
	 display: flex;
	 justify-content: space-between;
	 flex-wrap: wrap;
	 margin-top: 50px;
	 padding-left: 25px;
	 padding-right: 25px;
	 background: rgb(245,245,245);
	}

	#news_box{
		display: flex;
		flex-direction: column;
		overflow: hidden;
		width: 95vw;
		height: 35vw;
		border-radius: 5px;
		border: 1px solid rgb(200,200,200);
		background: white;
		padding-left: 3vw;
		padding-right: 3vw;
		margin-bottom: 5vw;
	}

	#news_source{
		display: flex;
		height: 10vw;
		font-size: 1em;
		border-bottom: 1px solid rgb(200,200,200);
	}

	#news_title{
		display: flex;
		height: 35vw;
		font-size: 1.3em;
		font-weight: 600;
		line-height: 1.3em;
	}

	#news_pic_1{
		width: 90px;
		height: 90px;
		background: url("picture/news/bottle.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}

	#news_pic_2{
		width: 90px;
		height: 90px;
		background: url("picture/news/plastic_waste.jpg") center/cover no-repeat; 
		border-radius: 10px;
		margin: auto;
	}


	#news{
		display: flex;
		height: 30vw;
		font-size: 1em;
		line-height: 1.3em;
		color: gray;
		overflow: hidden;
	}

	#news_source>p{width: 100%; margin: auto;}
	#news_title>h3{font-size: 1em; width: 75%; margin: auto;}
	#news>p{margin: auto;}

	#news_link{
		display: flex;
		align-items: center;
		height: 10vw;
		font-size: 0.9em;
		font-weight: 600;
		color: rgb(0,160,135);
	}

	}