@charset "utf-8";

/*===================================================================
	main_image
===================================================================*/
#main_image_wrap { position:relative; margin-bottom:40px; }
#main_image .unit{position: relative;}
#main_image .unit .text { position:absolute; top:0; left:0; width:100%; height:100%; display: table;}
#main_image .unit .text_in {position: relative;      padding: 50px 30px; color: #fff; display: table-cell; vertical-align: bottom; }
#main_image .unit .text_in::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(180deg, transparent 0 50%, #000 100%);
}

#main_image .unit .img_back { background-size: contain;}


#main_image .unit .main_text { line-height:150%; position: relative; z-index:10; font-size: 2.5em;
    margin-bottom: 10px;
    font-weight: bold;}
#main_image .unit .sub_text { position: relative; z-index:10; color:#fff; line-height:150%;  font-size: 1.25em;}

	@media (max-width: 767px){
        #main_image .unit .text_in{padding: 15px;}
        #main_image .unit .main_text {font-size: 1.75em;}
        #main_image .unit .sub_text {font-size: 1em;}
		#main_image .unit,
		#main_image .unit .img_back { height:70vw; max-height:700px; }
	}
	@media (min-width: 768px){

	}
	@media (min-width: 768px) and (max-width: 1199px){
		#main_image .unit,
		#main_image .unit .img_back { height:60vw; min-height:450px; }
	}

	@media (min-width: 1200px){
		#main_image .unit,
		#main_image .unit .img_back { height:35vw; min-height:450px; }
	}



/*===================================================================
	top_products
===================================================================*/
#top_products{    background: url(../image/layout/back.jpg) no-repeat  center / cover; }


/*===================================================================
	top_photo
===================================================================*/
#top_photo .unit{padding: 0 15px;}

/*===================================================================
	quality
===================================================================*/
#quality{}

/*===================================================================
	top_news
===================================================================*/
#top_news .img{position: relative;}
#top_news .img .cat{background: #53070D; position: absolute; bottom: 0; left: 0; color: #fff; padding: 0 5px;}
#top_news .img .img_back{border: 2px solid #CCCCCC;}

/*===================================================================
	company
===================================================================*/
#company{background: #FFF3D3;}

/*===================================================================
	top_contact
===================================================================*/
#top_contact{background: #FFF3D3;}
#top_contact .unit{background: #fff; padding: 30px;}
@media (max-width: 575px){
    #top_contact .unit{padding: 30px 15px;}
}

/*===================================================================
	top_recruit
===================================================================*/
#top_recruit{background: #FFF3D3;}
#top_recruit .banner a{max-width:300px; display: block; margin: 0 auto;}

/*===================================================================
	top_image
===================================================================*/
.top_image img{width: 100%;}