/* EUCで保存*/
/* EUCで保存*/
/* EUCで保存*/
/*注意！コメントアウトの位置などの影響でIE8で不具合が起こるケースあり*/


@media screen and (min-width:0px) and (max-width: 639px){

/*-------------------------------------------------
  ヘッダー header
-------------------------------------------------*/

	#header
	{
		position: relative;
		width: 100%;
		height: 100%;
		background: #083400 url(images/) repeat;
		border-width: 0px 0px 0px 0px;
		border-style: solid;
		border-color: #E0E0E0;
		margin: auto;
	}

	#headercontents
	{
		width: 320px;
		margin: auto;

	}

	#headercontents h1
	{
		width: 320px;
		background:;
		padding: 0px 0px 10px 0px;
		clear: both;
		font-size: 13px;
		text-align: center;
		margin: auto;
	}

/*-------------------------------------------------
  ロゴ
-------------------------------------------------*/

	.logo
	{
		width: 320px;
		padding: 0;
		float: none;
	}

	.logo img /*ロゴ画像のサイズ*/
	{
		width: 240px;
		/* display: block; */
		margin-left: auto;
		margin-right: auto;
		padding: 0px;
		height: auto;
	}

	.logo_l{

		display: none;
	}
	
	.logo_sm{
	
		display: block;
	}
/*-------------------------------------------------
  ページ上部お問合せ
-------------------------------------------------*/

	.contactus /*ヘッダーの電話番号＆メール問合せはこちらエリア*/
	{
		padding: 10px 0px 20px 0px;
		width: 220px; 
		float: none; 
		text-align: center; 
		margin: auto;
		line-height: 33px;
	}

	.mail
	{
		width: 90%;
		margin: auto;
	}

/*-------------------------------------------------
  ヘッダーの背景色や背景画像
-------------------------------------------------*/

	.head_img
	{
		width: 100%;
		height: 130px;
		background: url(images/bg_header02.png) center no-repeat;
		background-size: contain;
		text-align: center;
		color: #ffffff;
		padding: 0px 0px 0px 0px;
		box-sizing: border-box;
		margin-top: 10px;
		font-size: 18px;
	}

	.head_img_sub
	{
		width: 100％;
		height: 100％;
		background: /*#4FC449*/ url(images/head_img_sub.png) center no-repeat;
		text-align: center;
		color: #ffffff;
		padding: 200px 0px 0px 0px;
		margin-top: 0px;
		font-size: 18px;
	}

/*-------------------------------------------------
  スマホで閲覧時のメニュー
-------------------------------------------------*/

	.homebutton
	{
		display: inline;
		float: left;
		margin-left: 110px;
	}

	.homebutton img
	{
			width: 50px;
	}

	.menubutton
	{
		display: inline;
		float: right;
		margin-right: 110px;
	}

		.tabmenu
		{
			width: 100%;
			/*background: #7AD371;*/
			margin-bottom: 5px;
		}

		.tabmenu img
		{
			width: 50px;
			margin-left: 8px;
		}

		.tab
		{
			height: 50px;
		}

		.tab li
		{
			width: 44px;
			height: 44px;
			cursor: pointer;
			display: inline-block;
			margin-left: 0px;
		}
						
		/*.tab li.select
		{
			/*background:#fd9;*/
		}*/
			

		.content div
		{
			/*background:#efefef;*/
			height: 100%;
			padding: .6em;
		}

		.hide
		{
			display:none;
		}

		.content div.sub
		{
			margin: 5px 5px 5px 30px;
		}

		/*.tab li:after
		{
			content:"▼";
			padding-left: 1em;
		}

		.tab li.select:after
		{
			content:"▲";
			padding-left: 1em;
		}*/

		.other
		{
			margin-top: 1em;
			padding: 1em;
		}

		.close
		{
			float: right;
			width:20%;
			background:#426851;
			-webkit-border-radius:2px;
			border-radius: 2px;
			color: #fdfdfd;
			text-align: center;
			cursor: pointer;
		}

/*-------------------------------------------------
  ボディー　body部の囲い
-------------------------------------------------*/

	#mainwrapper
	{
		width: 100%;
		background: url(images/) repeat-y;
		border-width: 0px 0px 0px 0px;
		border-style: solid;
		border-color: #E0E0E0;
		padding: 0px 0px 0px 0px;
		margin: auto;
	}

/*-------------------------------------------------
  ボディー　body内部
-------------------------------------------------*/

	#container
	{

		width: 100%;
		height: 1%;
		overflow: visible;
	/*にわ・なびの記事幅表示と合わせるために以下はすべて0にすること。paddingは.contentで入力*/
		padding: 0px 0px 0px 0px;
		clear: both;
		background: #;
	}

	.container_m
	{
		width: 320px;
		margin: auto;
		clear: both;
	}

/*-------------------------------------------------
  施工例カテゴリサムネイル
-------------------------------------------------*/

	.works_trim
	{
		width: 105px;
		height: 100%;
		float: left;
		margin: 0px 0px 10px 1px;
		padding: 0px 0px 10px 0px;
		display: inline;
		overflow: hidden;
	}

	.works_trim_img
	{
		width: 210px; 
		height: 140px; 
		border-width: 0px; 
		border-style: solid; 
		border-color: #cccccc;
		display: none;
	}

	.works_trim_img_s
	{
		width: 210px; 
		height: 140px; 
		border-width: 0px; 
		border-style: solid; 
		border-color: #cccccc;
		display: block;
		margin-left: -52px;
	}

	.works_trim_img_s img
	{
		width: 210px; 
		height: 140px;

	}

	.works_trim_title
	{
		width: 83px; 
		height: 33px; 
		overflow: hidden; 
		float: left; 
		padding: 5px 10px 5px 10px; 
		font-size: 10px; 
		line-height: 130%;
	}

	.works_trim_comments
	{
		width: 83px; 
		height: 48px; 
		overflow: hidden; 
		float: left; 
		padding: 5px 10px 5px 10px; 
		font-size: 9px; 
		line-height: 130%;
	}

/*-------------------------------------------------
  トップページの新着施工例エリア
-------------------------------------------------*/

	.works_trim2
	{
		width: 105px;
		height: 100%;
		float: left;
		margin: 0px 0px 10px 1px;
		padding: 0px 0px 10px 0px;
		display: inline;
		overflow: hidden;
	}

	.works_trim2_img
	{
		width: 210px; 
		height: 140px; 
		border-width: 0px; 
		border-style: solid; 
		border-color: #cccccc;
		display: none;
	}

	.works_trim2_img_s
	{
		width: 210px; 
		height: 140px; 
		border-width: 0px; 
		border-style: solid; 
		border-color: #cccccc;
		display: block;
		margin-left: -52px;
	}

	.works_trim2_img_s img
	{
		width: 210px; 
		height: 140px;

	}

	.works_trim2_title
	{
		width: 83px; 
		height: 33px; 
		overflow: hidden; 
		float: left; 
		padding: 5px 10px 5px 10px; 
		font-size: 10px; 
		line-height: 130%;
	}

	.works_trim2_comments
	{
		width: 83px; 
		height: 48px; 
		overflow: hidden; 
		float: left; 
		padding: 5px 10px 5px 10px; 
		font-size: 9px; 
		line-height: 130%;
	}

	.more_works
	{
		font-size: 0.8em;
		margin: 0px 2px 0px 0px;
	}

/*-------------------------------------------------
  トップページInformationのエリア
-------------------------------------------------*/

	.home_info
	{
		width: 270px; 
		padding: 25px 25px 25px 25px; 
		background: #ffffff;
		-webkit-text-size-adjust: 100%;
		display: none;
	}

	.home_info_s
	{
		width: 290px; 
		padding: 15px 15px 15px 15px; 
		background: #ffffff;
		-webkit-text-size-adjust: 100%;
		display: block;
	}

	.info_s
	{
		width: 100%;
		font-size: 80%;
	}

	.info_s img
	{
		width: 100%;
		height: auto;
	}

/*-------------------------------------------------
  トップページ下部電話番号
-------------------------------------------------*/

	.tel
	{
		font-size: 25px; 
		padding: 20px 0px 0px 0px; 
		float: none; 
		color: #0d5b3b;
		text-align: center;
	}

/*-------------------------------------------------
  トップページ下部メール問合せボタン
-------------------------------------------------*/

	.mail
	{
		font-size: 15px; 
		padding: 10px 0px 5px 0px; 
		float: none;
		text-align: center;
	}

/*-------------------------------------------------
  フッターの会社情報、施工例、お問合せボタン
-------------------------------------------------*/

	.footer_button /*フッターの会社情報、施工例、お問合せボタン*/
	{
		width: 75px; 
		/*background: #41A838; */
		float: left; 
		padding: 10px; 
		margin: 0px 5px;
		text-align: center; 
		font-size: 15px;
	}

/*-------------------------------------------------
  スマホ閲覧時の下部会社情報と施工エリア
-------------------------------------------------*/

	#sidebarcontainer
	{
		width: 100%;
		padding: 0px 0px 0px 0px;
		background: #004512;
		margin: 20px 0px 0px 0px;
		clear: both;
		display: hidden;
	}

/*スマホ、タブレットで見た際の電話番号などのリンクカラー*/
	#sidebarcontainer a:link, #sidebarcontainer a:visited
	{
		color: #ffffff;
	}

	.menubox
	{
		width: 0%;
		height: 0%;
		display: none;
	}

	.box0
	{

	}

	.aboutusbox
	{
		width: 100%;
		height: 100%;
		/*background: #41A838;*/
		float: left;
		padding: 0px 0px 0px 0px;
	}
	.aboutusbox_m
	{

		/*float: right;*/
		padding: 20px 20px 20px 20px;
		text-align: center;
	}

	.areabox
	{
		width: 100%;
		height: 100%;
		/*background: #26961A;*/
		float: left;
		padding: 0px 0px 0px 0px;
	}
	.areabox_m
	{

		/*float: left;*/
		padding: 20px 20px 20px 20px;
		text-align: center;
	}

/*-------------------------------------------------
  フッター　Footer
-------------------------------------------------*/

	#footer
	{

		border-width: 0px 0px 0px 0px;

	}

/*-------------------------------------------------
  このページのトップへボタン
-------------------------------------------------*/

	.pagetop {
		width: 100%;
		position: fixed;
		right: 0px;
		bottom: 0px;
		z-index: 9000;
		display: none;
		filter:alpha(opacity=95);
		-moz-opacity: 0.95;
		opacity: 0.95;
	} 

	.pagetop a {
		display: block;
		color: #ffffff;
		padding: 7px 15px;
		margin: 0;
		background: #797979 url(images/);
		border-radius: 3px;
		text-decoration: none;
		font-weight: normal;
		font-size: 15px;
	}

	.pagetop a:hover {
		background: #797979 url(images/bg_gototop.png);
		color: #FFFFFF;
	}

}