@charset "utf-8";

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

/*-- layout --*/
	
	img	{
		max-width: 100%;
	}
	
	.inner {
		width: 96%;
		margin: 0 2%;
	}
	
	#contents .post {
		width: 100%;
		margin: 0;
	}

	#header{
		min-width: 320px;
		width: 100%;
	}

	#main_area{
		min-width: 320px;
		width: 100%;
	}

	#top_box_area{
		min-width: 320px;
		width: 100%;
		padding: 0 0 30px 0;
	}

	#news_top{
		min-width: 320px;
		width: 100%;
		padding: 40px 0;
	}

	#supplier_top{
		min-width: 320px;
		width: 100%;
		padding: 40px 0;
	}

	#pageTop{
		min-width: 320px;
		width: 100%;
	}

	#footer_nav{
		min-width: 320px;
		width: 100%;
	}

	#footer_address{
		min-width: 320px;
		width: 100%;
	}

	#copy{
		min-width: 320px;
		width: 100%;
	}
	
	#page_title{
		min-width: 320px;
		width: 100%;
	}
	
	#bn_area{
		min-width: 320px;
		width: 100%;
		padding: 30px 0 15px;
	}
	
	#contact_area{
		min-width: 320px;
		width: 100%;
		height: auto;
		padding: 0 0 30px 0;
	}

/*-- header --*/
	
	#header .nav {
		display: none;
	}
	#sp_header {
		display: block;
	}
	#header .logo {
		margin: 0 0 10px 0;
		float: none;
		text-align: center;
	}
	#header .languege_bt {
		float: none;
		width: 124px;
		margin: 12px auto;
	}
	
	
/*-- footer --*/

	#footer_address .logo {
		float: none;
		text-align: center;
	}

	#footer_address .text {
		float: none;
		margin: 8px 0 20px;
		text-align: center;
	}

	#footer_address .address {
		float: none;
		margin: 0 0 18px 10px;
	}

	#footer_nav dl {
		float: none;
		width: 100%;
	}
	
	#bn_area .bn01,#bn_area .bn02,#bn_area .bn03,#bn_area .bn04 {
		width: 100%;
		margin: 0 25px 15px 0;
		background-size: cover;
	}

/*-- contact --*/

#contact_area .box_left {
	width: 100%;
	height: auto;
	margin: 30px 0;
	}
	#contact_area .box_left h4 {
	font-size: 32px;
	margin: 15px 0 0 37px;
	}
	#contact_area .box_left h5 {
	font-size: 20px;
	}
	#contact_area .box_left .bt {
	margin: 0 37px 15px;
	}

#contact_area .box_right {
	width: 100%;
	height: auto;
	margin: 0 0 0;
	}
	#contact_area .box_right h4 {
	font-size: 32px;
	margin: 15px 0 0 37px;
	}
	#contact_area .box_right h5 {
	font-size: 20px;
	margin: 0 22px 10px 37px;
	}
	#contact_area .box_right .bt {
	margin: 0 37px 15px;
	}
	
#contact_area .box_long {
	width: 100%;
	height: auto;
	margin: 30px 0;
	}
	#contact_area .box_long h4 {
	font-size: 32px;
	margin: 15px 0 0 37px;
	}
	#contact_area .box_long h5 {
	font-size: 20px;
	}
	#contact_area .box_long .bt {
	margin: 0 37px 15px;
	}

#contents .inquiry table {
	width: 100%;
	margin: 0 0 40px;
	}
	#contents .inquiry table th,#contents .inquiry table td {
	display: block;
	}
	#contents .inquiry table th {
	padding: 10px;
	}
	#contents .inquiry table td {
	padding: 10px 0;
	}
	#contents .inquiry .post table textarea{
	padding: 0;
	}
	#contents .inquiry .post table select{
	width: auto;
	}
	#contents .inquiry .post p {
	margin: 0 auto 0px;
	}
	#contents .inquiry .post table input[type='text'] {
	width: 91%;
	}
	#contents .inquiry .post table td span.mini {
	display: block;
	}
	input#back {
	margin: 0 0 20px 0;
	}
	input#back:hover {
	margin: 6px 0 20px 0;
	}


/*-- Top page --*/
	#main_area {
		height: 500px;
		}
		#main_area h1 {
		left: 0;
		margin: 0 7%;
		padding: 139px 0 0 0;
		}
		#main_area h2{
		font-size: 19px;
		padding: 140px 0 0 0;
		}
		#main_area p{
		font-size: 15px;
		padding: 209px 0 0 0;
		}
	
	#top_box_area .left {
		width: 100%;
		float: none;
		}
		#top_box_area .left .full_box h3 {
		margin: 5px 0 16px;
		}
		#top_box_area .left .full_box .thumb{
		width: 100%;
		float: none;
		}
		#top_box_area .left .full_box .text {
		width: 100%;
		float: none;
		}
		#top_box_area .left .full_box .bt{
		position: relative;
		right: 0;
		bottom: 0;
		text-align: center;
		margin: 10px 0 0 0;
		}
		#top_box_area .left .left_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#top_box_area .left .left_box .bt {
		width: 92.5%;
		text-align: center;
		}
		#top_box_area .left .right_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#top_box_area .left .right_box .bt {
		width: 92.5%;
		text-align: center;
		}
		
	#top_box_area .right {
		width: 100%;
		float: none;
		}
		#top_box_area .right .full_box {
		margin: 0 0 30px;
		}
		#top_box_area .right .full_box h3 {
		margin: 5px 0 16px;
		}
		#top_box_area .right .full_box .thumb{
		width: 100%;
		float: none;
		}
		#top_box_area .right .full_box .text {
		width: 100%;
		float: none;
		}
		#top_box_area .right .full_box .bt{
		position: relative;
		right: 0;
		bottom: 0;
		text-align: center;
		margin: 10px 0 0 0;
		}
		#top_box_area .right .left_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#top_box_area .right .left_box .bt {
		width: 92.5%;
		text-align: center;
		}
		#top_box_area .right .right_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#top_box_area .right .right_box .bt {
		width: 92.5%;
		text-align: center;
		}
	
	#news_top h2 {
		font-size: 40px;
		}
		#news_top p.sub_title{
		margin: 0 0 20px;
		}
		#news_top .new_products {
		width: 100%;
		}
		#news_top .new_event{
		width: 100%;
		}
		#news_top .new_topics{
		width: 100%;
		}
	
	
	#supplier_top h2{
		font-size: 40px;
		}
		#supplier_top p.sub_title{
		margin: 0 0 20px;
		}
		#supplier_top ul li {
		margin: 0 1% 8px;
		width: 46%;
		}
		#supplier_top .full_bt{
		margin: 0 1%;
		width: 96%;
		}

/*--  about --*/
	
	#contents .about .left {
		width: 100%;
		float: none;
		}
	#contents .about .left {
		width: 100%;
		float: none;
		}
		#contents .about .left .full_box h3 {
		margin: 5px 0 16px;
		}
		#contents .about .left .full_box .thumb{
		width: 100%;
		float: none;
		}
		#contents .about .left .full_box .text {
		width: 100%;
		float: none;
		}
		#contents .about .left .full_box .bt{
		position: relative;
		right: 0;
		bottom: 0;
		text-align: center;
		margin: 10px 0 0 0;
		}
		#contents .about .left .left_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#contents .about .left .left_box .bt {
		width: 92.5%;
		text-align: center;
		}
		#contents .about .left .right_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#contents .about .left .right_box .bt {
		width: 92.5%;
		text-align: center;
		}
	
	#contents .about .right {
		width: 100%;
		float: none;
		}
		#contents .about .right .full_box h3 {
		margin: 5px 0 16px;
		}
		#contents .about .right .full_box .thumb{
		width: 100%;
		float: none;
		}
		#contents .about .right .full_box .text {
		width: 100%;
		float: none;
		}
		#contents .about .right .full_box .bt{
		position: relative;
		right: 0;
		bottom: 0;
		text-align: center;
		margin: 10px 0 0 0;
		}
		#contents .about .right .left_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#contents .about .right .left_box .bt {
		width: 92.5%;
		text-align: center;
		}
		#contents .about .right .right_box{
		width: 100%;
		float: none;
		background-size: cover;
		margin: 0 0 30px;
		}
		#contents .about .right .right_box .bt {
		width: 92.5%;
		text-align: center;
		}
		
	#contents .about .post{
		width: 100%;
		margin: 0 0 40px;
		}
		#contents .about h2{
		font-size: 18px;
		}
		
/*--  event --*/
	#contents .post .event_area .event_text{
		margin: 0 0 20px 0;
		}
		#contents .post .event_area .post {
		margin: 0;
		width: 100%;
		}
		#contents .post .event_area .post h2{
		margin: 0;
		}
		#contents .post .event_area dl dt{
		width: 100%;
		}
		#contents .post .event_area dl dd{
		width: 100%;
		}
	
	#contents .event .post .event_text{
		margin: 0 0 20px 0;
		}
		#contents .event .post .post {
		margin: 0;
		width: 100%;
		}
		#contents .event .post .post h2{
		margin: 0;
		}
		#contents .event .post dl dt{
		width: 100%;
		}
		#contents .event .post dl dd{
		width: 100%;
		}

/*--  topics --*/
	#contents .topics .topics_text{
		margin: 0 0 20px 0;
		}
		#contents .topics .post {
		margin: 0;
		width: 100%;
		}
		#contents .topics .post h2{
		margin: 0;
		}
		#contents .topics dl dt{
		width: 100%;
		}
		#contents .topics dl dd{
		width: 100%;
		}

/*--  policy --*/
	#contents .policy dl dt{
		text-align: center;
		}
		#contents .policy dl dd{
		margin: 0 10px 40px 10px;
		}
		
/*--  supplier --*/
	#contents .supplier .post ul li {
		width: 48%;
		margin: 0 1% 30px;
		}

/*--  recruit --*/
	#contents .recruit table{
		width: 100%;
		margin: 0 0 40px;
		}
		#contents .recruit table th,#contents .recruit table td {
		display: block;
		}
		#contents .recruit table th {
		padding: 10px;
		}
		#contents .recruit table td {
		padding: 10px 5px;
		}
		#contents .recruit .bt {
		width: 90%;
		margin: 0 5%;
		}
		
/*--  company_plofile  --*/
	#contents .company_plofile  table{
		width: 100%;
		margin: 0 0 40px;
		}
		#contents .company_plofile table th,#contents .company_plofile table td {
		display: block;
		}
		#contents .company_plofile table th {
		padding: 10px;
		}
		#contents .company_plofile table td {
		padding: 10px 5px;
		}

/*--  client_company  --*/
	#contents .client_company .post ul li {
		width: 100%;
		}

/*--  siteuse  --*/
	#contents .siteuse dl dt{
		text-align: center;
		}
		#contents .siteuse dl dd{
		margin: 0 10px 40px 10px;
		}

/*--  products  --*/
	#contents .products .products_text{
		margin: 0 0 20px 0;
		}
		#contents .products .post {
		margin: 0;
		width: 100%;
		}
		#contents .products .post h2{
		margin: 0;
		}
		#contents .products dl dt{
		width: 100%;
		}
		#contents .products dl dd{
		width: 100%;
		}
		#contents .products .products_inner {
		width: 100%;
		margin: 0 0 0;
		}
		#contents .products .products_inner ul li {
		width: 48%;
		margin: 0 1% 30px;
		}

/*--  environment  --*/
	#contents .environment table{
		width: 100%;
		margin: 0 0 40px;
		}
		#contents .environment h2{
		font-size: 24px;
		margin: 0 0 30px;
		}
		#contents .environment .post{
		margin: 0 0 50px;
		}
		#contents .environment .environment_text{
		margin: 0 0 20px 0;
		}
		#contents .environment table th,#contents .environment table td {
		display: block;
		}
		#contents .environment table th {
		padding: 10px;
		}
		#contents .environment table td {
		padding: 10px 5px;
		}
		
/*-- single --*/
	.single_news {
	margin: 50px 0 30px;
	width: 100%;
	}
	.single_news dl dt {
	width: 100%;
	}
	.single_news dl dd {
	width: 100%;
	}

}