html, body{ background-color:#ededed;}

/*main banner begin*/
.main-banner{
	position: relative;
    display:inline-block;    
    width: 100%;
    height: 330px;
	background:#ffffff url('../images/com_banner.jpg') no-repeat;
    background-size: cover;
    text-align:center;
    }
	.banner-content{		    
		    display:inherit;	
			width:40%;
			max-width:500px;	
			margin:85px auto 0 auto;	
            padding:10px 4%;					
			vertical-align:top;							
			}
			.banner-content h3{
					margin:0;
					padding:0;
					font-size:22px;
					font-family:Arial, Helvetica, sans-serif;
					line-height:100%;
					color:#474747;
					font-weight:600;				
			        }
			.banner-content p{
					font-size:13px;
					font-family:Arial, Helvetica, sans-serif;
					line-height:120%;
					color:#474747;
					margin:10px 0 0 2px;
					letter-spacing:1px;
					padding:0;
					}
@media screen and (max-width: 865px) {
	.banner-content{ width:65%; }

	}			

@media screen and (max-width: 640px) {
	.banner-content p{ text-align:left; }
}
										
@media screen and (max-width: 480px) {
	.main-banner{
		height:auto;
		padding:0 0 35px 0;
        background:#ffffff url('../images/com_banner.jpg') no-repeat;
		}
		.banner-content{
			width:80%;	 
			margin:0; 
			padding:11% 10% 0 10%;
			background-color: rgba(255,255,255,0) ;	
			}

	}			
					
/*main banner end*/


.white-bg{
	display:block;
	width:100%;
	padding:70px 0 120px 0;
	background-color:#ffffff;
	}	
.feature{
	display:flex;
	width:100%;
	}
	.feature-item{
		display:inline-block;
		width:27.33%;
		text-align:center;
		padding:0 3%;
		vertical-align:top;
		}
		.yellow{ background-color:#ffc258;	}
		.deep{ background-color:#eeb555; }
		.grown{	background-color:#968466; }
		
.feature-item label {
	    display:block;
		margin:20% 0 15px 0;
		padding:0;
		font-size: 16px;
		font-family: "Open Sans",Helvetica,Arial,sans-serif;
		line-height: 100%;
		color: #222222;
		}
	.feature-item h3 {
		margin: 0 0 10px 0;
		padding: 0;
		font-size: 20px;
		font-family: Arial, Helvetica, sans-serif;
		line-height: 100%;
		color:#333333;
		font-weight: 600;
		}
	.feature-item p {
	    display:block;
		margin: 0 0 30% 0;
		padding: 0;
		font-size: 13px;
		font-family: "Open Sans",Helvetica,Arial,sans-serif;
		line-height: 160%;
		color: #ffffff;
		}
		
@media screen and (max-width: 768px) {		
.white-bg{	padding:0 0 8% 0;	}	
}
		
@media screen and (max-width: 640px) {
	.feature-item p { text-align:left; }
	.feature{ display:block;}
	.feature-item{ 	display:block; width:80%; padding:10%; }
	.feature-item p { margin: 0; }
    .feature-item label {	margin:0 0 15px 0;	}
	
.white-bg{
	width:100%;
	padding:0;
	}	
	
	}		



.content-info{
	display:block;
	width:100%;
	max-width:1280px;
	margin:50px auto 0 auto;
	text-align:center;
	}	
	.content-info img{
		display:inline-block;
		width:80%;
		max-width:312px;
		}	
	.content-info ul{
		display:inline-block;
		width:60%;
		max-width:435px;
		margin:0 5% 0 0;
		padding:0;
		list-style-type:none;	
		text-align:left;
		vertical-align:top;
		}	
		.content-info ul li{
			display:block;
			width:100%;
			margin:0;
			padding:25px 0;
			font-family: "Open Sans",Helvetica,Arial,sans-serif;
			font-size:13.5px;
			color:#333333;
			letter-spacing:2px;
			vertical-align:top;
			border-bottom:1px solid #c5c5c5;
			}
		.content-info ul li:first-child{ border-bottom:0px; }		
		.content-info ul li:last-child{ padding:20px 0 81px 0; border-bottom:5px solid #fda539; }	
				
		.content-info ul li p{
			display:inline-block;
			width:inherit;
			font-family: "Open Sans",Helvetica,Arial,sans-serif;
			padding:0;
			margin:0 4% 0 0;
			color:#333333;
			}	
		.content-info ul li a{	color:#333333;	}		
		.content-info ul li a.mail{	color:#09C;	}	
		.content-info ul li a.mail:hover{	color:#222;	}	
			
			
		.content-info ul li p b{
    font-size:17px;
	letter-spacing:1px;
	color:#222222;
			}	
			
		.content-info ul li p span{ 
		display:inline-block;
		width:28%; 
		max-width:150px;
		font-weight:bold;
		vertical-align:top;
		}	
			
			
			.content-info ul li label{ 
			   display:inline-block;
			   width:65%;
			   margin:0;
			   font-size:13px;			  
			   font-family: "Open Sans",Helvetica,Arial,sans-serif;
			   color:#999999;
			   letter-spacing:2px;
			   vertical-align:top;
			   }

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


.content-info{	margin:0 auto;}	

	.content-info ul{
		display:block;
		width:100%;
		max-width:500px;
		padding:4% 0;
		margin:0 auto;
		}	
	.content-info ul li{
		width:100%;
		}	
	.content-info ul li:last-child{ margin:0; border:0;}		
		
}
@media screen and (max-width: 640px) {	

.content-info ul {  width: 80%;   }    	
    .content-info ul li:first-child { text-align:center;}	
	.content-info img{	margin:0 0 12% 0;	}	
			   
}

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

			.content-info ul li label{ 
			   display:block;
			   width:100%;
			   margin:5px 0 0 0;
			   letter-spacing:1px;
			   }
			   
}


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

		.content-info ul li p{
			display:block;
			width:auto;
			padding:0;
			margin:0;
			}	
			.content-sandwich ul li label{ 
			  display:block;
			   margin:10px 0 0 0;
			   font-size:13px;
			   font-family:microsoft yahei,sans-serif;
			   letter-spacing:2px;
			   vertical-align:top;
			   }
					   
}

/*grid begin*/
.grid{
	display:block;
	width:100%;
	background:#FFFFFF url('../images/grid_bg.jpg') ;	
	}
/*grid End*/