@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}

blockquote:before, blockquote:after,q:before, q:after {content: "";}

/* リンク設定
------------------------------------------------------------*/
a{color:#3f4360;text-decoration:none;}
a:hover{color:#292d48;}
a:a

ctive, a:focus{outline:0;}

html {
  height: 100%;
  margin: 0;
}

body{
	color:#333;
	font:12px verdana,"ヒラギノ丸ゴ ProN W4","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	line-height:1.5;
	background:#f2f2f2;
	/* -webkit-text-size-adjust: none; */
	-webkit-text-size-adjust: 100%;

	margin: 0;
	min-height: 100%;
	height: 100%;
	margin-bottom: -50px;

}

/*************
/* 共通で使用
*************/
/* ヘッダ部 */
#header {
	padding:5px 0 5px;
	max-width: 100%;
	height:84px;
	background:#363947;
	//opacity:0.8;
	border-bottom:10px solid #cccccc;

}

/* 中央よせ用ﾎﾞｯｸｽ */
#header_inner {
	position:relative;
	max-width: 100%;
	width:940px;
	height:100%;	
	margin:0 auto;
	//border:1px solid green;
}

/* ロゴ用ﾎﾞｯｸｽ */
#logo {
	position:absolute;
	float:left;
	top: 50%;
	transform: translateY(-50%);		
	width:40%;
	height:auto;
	//border:1px solid pink;

}

#logo img{
	display: inline-block;
	vertical-align: middle;
	//width: 13%;
	width: 43px;
	height: auto;
	margin: 0 5px 0 5px;
	//border:1px solid green;	
}

#logo a{
	display: inline-block;
	vertical-align: middle;
	font-size:22px;
	font-weight:bold;
	color:#fff;
	//border:1px solid yellow;
}

#logo span{
	font-size:12px;
	font-weight:normal;
}

/* ﾄｯﾌﾟﾅﾋﾞ用 */
#nav{
	float:right;
	width:60%;	
	height:100%;
	padding-right: 10px;
}

ul#topnav{
	float:right;
	//height:99%;
	//width:60%;
	//overflow:hidden;
	//display: flex;
	//border:1px solid yellow;
}

ul#topnav li{
	position: relative;
	float:left;
	margin:2px 5px;
	text-align:center;
	border-radius: 5px;
}

ul#topnav a{
	display:block;
	font-size:13px;
	padding:20px 10px;
	color:#fff;
}

ul#topnav li{
	width: 100px;
}

ul#topnav span{
	color:#fff;
	font-size:10px;
}

ul#topnav li.active a, ul#topnav a:hover{
	background:#EE6557;
	border-radius:5px;	
}

/* 問い合わせ用 */
.contact{
	background: #b80117;
}

/*スマホ用メニュー*/
#menubar-s {
	position: absolute;		
	display: block;
	top: 57px;	/*画面の上から110pxの場所に配置*/
	left: 0px;	/*画面の左から0pxの場所に配置*/
	width: 100%;
}

/*メニュー１個あたりの設定*/
#menubar-s a {
	display: block;
	text-decoration: none;
	background: #f2f2f2 ;	/*メニューの背景色*/
	padding: 20px;		/*メニュー内の余白*/
	border-bottom: 1px solid #fff;	/*下線の幅、線種、色*/
	color:#363947;
}

/*１つ目のメニューの設定*/
#menubar-s li:first-child a {
	border-top: 1px solid #fff;	/*上に入れる線の幅、線種、色*/
	color:#363947;
}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: relative;
	top: 50%;	/* 縦位置中央 */
	transform: translateY(-50%);	/* 縦位置中央 */
	margin: 0 auto;	/* 横位置中央 */
	height: 100%;
	width: 42px;	/*幅*/
	//border: 1px solid #FFF;	/*枠線の幅、線種、色*/
	border-radius: 4px;	/*角丸のサイズ*/
	padding: 0px;

//border:solid yellow 1px;
float: right;

}

/*３本のバー（1本あたり）*/
#menubar_hdr span {
	display: block;
	border-top: 3px solid #fff;	/*枠線の幅、線種、色*/
	width: 61%;
	margin: 0 auto;
	margin-top: 8.25px;	/*バー同士の余白*/
	margin-bottom: 8.25px;	/*バー同士の余白*/
}

/* コンテンツ */
#wrapper {
	width:940px;
	//padding:0;
	margin:0 auto;
	max-width: 100%;
	padding-bottom:20px;
	//border:1px solid green;
}

/* フッタ */
.footer {
	 //border: 2px solid #000;
	 background:#363947;
	 border-top:10px solid #cccccc;
	width:100%;

}

/* フッタ浮き対策 */
.footer_sitemap{
	position:absolute;
	bottom:0;
}

/* 中央よせ用ﾎﾞｯｸｽ */
#footer_inner {
	max-width: 100%;
	width:940px;
	height:84px;
	padding:10px 0 0;
	margin:0 auto;
	color: #ffffff;
	//border:1px solid green;
}

#footer_inner p {
	max-width: 100%;
	width:940px;
	text-align: center;
	//border:1px solid yellow;
}

#footer_inner p a:link { color: #fff; }
#footer_inner p a:visited { color: #fff; }
#footer_inner p a:hover { color: #fff; }
#footer_inner p a:active { color: #fff; }

.compname {
	font-weight: bold;
	font-size: 16px;
}

/*************
/* トップページ用
*************/
/* ﾒｲﾝｲﾒｰｼﾞ */
#mainImage{
	margin:10px auto;
	padding:0;
	width:98%;
	line-height:0;
	//border:1px solid red;
}

#mainImage img{
	display: block;
	max-width:100%;
	height:auto;
	border-radius:3px;
}

/* 業務内容 */
.contentgrid{
	padding-bottom:20px;
	overflow: hidden;
	margin-left: 8px;
}

.grid{
	float:left;
	border-radius:5px;
	background:#fff;
	//border: 1px solid ;
}


.grid h3{
	padding:20px 5px;
	text-align:center;
	color:#fff;
	border-radius:5px 5px 0 0;
	background:#363947;	
	font-size: 12px;
	font-weight: bold;
}

h3.mente{
	background:#244765;	
}

h3.aging{
	background:#5c002f;	
}

h3.dojyo{
	background:#1a653c;	
}

h3.consul{
	background:#5e2a58;	
}

.grid img{
	max-width:100%;
	height:auto;
	margin-top: 0px;
	margin-bottom: 5px;
	width:100%; 
}

.grid p{
	padding:5px 10px;
}

.details {
	padding:20px 10px;
	height: auto;
	color: #363947;
	border: solid 1px orange;
}
/*
ul.top_List {
	//border:1px solid red;
	height: 70px;
}

.top_List li {
	position: relative;
	margin-left: 10px;
	text-indent: 20px;
}

.top_List li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	//left: -1em;
	width: 8px;
	height: 3px;
	border-left: 2px solid #3498db;
	border-bottom: 2px solid #3498db;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);

}

*/

ul.top_List {
    //list-style: none;
    padding:0;
    margin:0;
    height: 78px;
    //border: solid 1px blue;
}

.top_List li {
    padding-left: 2em; 
    text-indent: -.7em;
    font-size: 12px;
    font-weight: bold;
    color: #393939;
}

.top_List li:before {
    content: "\002713 ";
    //color: #0168b3;
}

.readmore{
	text-align: right;
}

.readmore a { color: #b80117; font-weight: bold;}
.readmore a:visited { color: #b80117; font-weight: bold;}
.readmore a:hover { color: #b80117; font-weight: bold;}
.readmore a:active { color: #b80117; font-weight: bold;}

/* グリッド共通 ベース:トップページ4カラム */
/*************
メイン コンテンツ(白いボックス)
*************/
.content{
	overflow:hidden;	
	padding:19px;
	margin-top:10px;
	margin-bottom:10px;	
	border:1px solid #ebebeb;
	border-radius:6px;
	background:#fff;
	font-size:14px;
	//max-width: 100%;
	//width:95%;
	//margin:0 auto;
}

.content p{
	margin-bottom:5px;
	color: #363947;
}


p.service_title{
	padding-left:10px;
	margin-bottom:10px;
	color:#fff;	

	//font-size:16px;
	//color:#3f4360;
	//border-top: 1px solid gray;
	//border-bottom: 1px solid gray;
	//background-color: #244765;
	//padding-right:7px;
	//font-weight:bold;
}

/* メンテ用背景色 */
p.bgcolor_blue{background-color: #244765;}
/* 老朽化対策用背景色 */
p.bgcolor_green{background-color: #1a653c;}
/* 土壌用背景色 */
p.bgcolor_red{background-color: #8f253b;}
/* コンサル用背景色 */
p.bgcolor_purple{background-color: #5e2a58;}

.service_text1{
	display: block; 
	//text-align:left;
	font-size:20px;
}

.service_text2{
	display: block; 
	//text-align:right;
	font-size:12px;
}





h3.heading{
	padding-left:7px;
	margin-bottom:10px;
	font-size:16px;
	color:#3f4360;
	//border-top: 1px solid gray;
	border-bottom: 1px solid gray;
}

h3.border_red{border-left:5px solid #b80117;}


.content img{
	max-width:100%;
	height:auto;
}

img.frame,#gallery img{
	border:4px solid #fff;
	box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
}

.alignleft{
	float:left;
	clear:left;
	margin:3px 10px 10px 0;
}

.alignright{
	float:right;
	clear:right;
	margin:3px 0 10px 10px;
}

/***************************
会社情報用
***************************/
table.comp_tbl{
	//border-collapse: collapse;
	table-layout: fixed;
	margin: 0 auto;	
	width: 100%;
	font-size: 15px;
}

table.comp_tbl tr{
	height: 40px;
	//border-bottom:1px #cccccc solid;
}

table.comp_tbl th{
	background: #295890;
	color: #fff;
	width:30%;
	vertical-align: middle;
	border-radius: 5px;
}

table.comp_tbl td{
	color: #363947;
	width:70%;
	vertical-align: middle;
	border-bottom:1px #cccccc solid;
}

table.indent_pc td{
	text-indent: 1em;
}

/***************************
プライバシーポリシー用
***************************/
h3.privacy{
	padding-left:7px;
	margin-bottom:10px;
	font-size:18px;
	color:#3f4360;
	border-bottom: solid 1px #5DB5BD;
	border-left:5px solid #5DB5BD;
}

p.privacy_top{
	margin:5px 0 5px 10px;	
}

p.privacy_title{
	font-size:16px;
	margin:10px 0 5px 10px;	
}

p.privacy{
	margin:5px 0 5px 20px;	
}

p.privacy_art{
	margin:5px 0 5px 20px;	
}

p.privacy_art2{
	margin:5px 0 5px 50px;	
}

/***************************
サイトマップ用
***************************/
ul.sitemap{
	padding-left: 20px;
	width: 90%;
}

ul.sitemap li{
    display: inline-block;
    width: 150px;
}

/***************************
メール用
***************************/
#sunmit_wrapper{
	width:70%; 
	padding-left:1%; 
	//border:1px solid pink
}

#form {
	border-collapse: collapse;
	table-layout: fixed;
	margin: 1em 0;
	width:100%;
}

#form-tbl {
	margin-left: 1.5em;
}

#form th, #form td {
	border: 1px solid #c0c0c0;
	padding: 8px;
}

#form th {
	white-space: nowrap;
	background: #222584;
	color:#fff;
	width:23%;
	vertical-align: middle;;
}

#form td {
	background: #fff;
}

p.btn{
	width:100%;
	text-align: center;    
	//border:5px solid green; 		
}

p.btn input {
	width: 110px;
	height: 32px;
}

.submit_btn {
    font-size: 12px;
    font-weight: bold;
    background-color: #b80117;
    color: #fff;
    border-style: none;
  }

#form input[type="text"],textarea {
	width:95%;
}

.h2_title {
	font-size: 16px;
	text-align: left;
	margin: 10px 0 5px 0;
	width: 100%;
}

/*スマホ用メニューを表示させない*/
#menubar-s {
	display: none;
}

/*３本バーアイコンを表示させない*/
#menubar_hdr {
	display: none;
}

#tbl_mb{display: none;}

/* PC用 */
@media screen and (min-width: 960px){

	.contentgrid {
		width: 960px;
		margin:0 0 0 -20px;
	}

	.grid{
		float:left;
		width:220px;
		margin-left:20px;
	}

}

/* モニター幅940px以下 iPadPro縦横　iPad横*/
@media only screen and (max-width:940px){

	.grid{
		width:48%;
		margin:10px 2% 0 0;
	}

}

/* iPad縦 iPhone7/6 Plus横 */
@media only screen and (max-width:768px){

	#header_inner {
		height:42px;
	}

	#logo{width:80%;}

	#logo img{
		width: 7.5%;
		height: auto;
	}
	
	/*
	.details {
		height: 50px;
		border: solid 1px green;
	}
	*/

	/* PC用メニュー非表示 */
	#topnav{
		display: none;
	}
	
	#header {
		height:42px;
	}

	#header_inner {
		//border:1px solid white;
	}

	#logo{
		width:80%;	
	}

	#logo img{
		width: 7.5%;
		height: auto;
	}

	#logo a{
		font-size:16px;
	}

	.grid h3{font-size: 10px;}

	#nav{
		width:20%;
		//overflow:hidden;
		//display: flex;
		//border:1px solid yellow;
	}

	/*スマホ用メニューを非表示から表示に切り替える*/
	#menubar-s {
		position: absolute;		
		display: block;

	}

	/*メニュー１個あたりの設定*/
	#menubar-s a {
		display: block;
	}

	/*３本バーアイコン設定
	---------------------------------------------------------------------------*/
	/*３本バーブロック*/
	#menubar_hdr {
		display: block;
	}

	/*３本のバー（1本あたり）*/
	#menubar_hdr span {
		display: block;
	}

	.content{margin:3px 3px auto;}

	ul.sitemap li{
	    display: block;
	    width: 90%;
	}
	

	#sunmit_wrapper{
		width:100%; 
	}

}

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){


	ul.sitemap li{
		font-size: 10px;
	}

	#form th {
		display: block;
		width:95%;
	}

	#form td {
		display: block;
		width:95%;
	}

}

/* スマートフォン iPhone5縦(ポートレート) */
@media only screen and (max-width:480px){

	//.content{margin:3px 3px auto;}

	.top_List li {
	    padding-left: 1em; 
	    text-indent: -.7em;
	    font-size: 10px;
	}

	.details {
		height: 80px;
		//border: solid 1px blue;
	}

	img.frame{width:98%;}

	.cpr{font-size: 10px;}

	table.comp_tbl{
		font-size: 12px;
	}

	#tbl_pc{display: none;}
	#tbl_mb{display: block;}

	ul.sitemap li{
		font-size: 14px;
	}

}
