﻿/* CSS Document */
/* main.css*/
/* 横幅750px固定*/
/*左右両端に設ける余白10px指定*/

/*@import "index.css";*/
/*@import "reset.css";*/
/*@import "toiawase.css";*/


a{
	/*text-decoration: none;*/
}

a:link {
	color: #555;
	/*text-decoration: none;*/
}

a:visited {
	color: #555;
	/*text-decoration: none;*/
}

a:hover {
	color: #555;
	/*text-decoration: none;*/
}

a:active {
	color: #555;
	/*text-decoration: none;*/
}
html,body{
   margin:0px;
   /*height:100%;*/
   font-size:17px;
}

img{
	vertical-align:middle;
}

/* フォントサイズ */

.font9{
	font-size:9px;
}
.font10{
	font-size:10px;
}
.font11{
	font-size:11px;
}
.font12{
	font-size:12px;
}
.font13{
	font-size:13px;
}
.font14{
	font-size:14px;
}
.font15{
	font-size:15px;
}
.font16{
	font-size:16px;
}
.font17{
	font-size:17px;
}
.font18{
	font-size:18px;
}
.font19{
	font-size:19px;
}
.font30{
	font-size:30px;
}


h5 {
	margin: 0;
	padding: 3px 5px 2px 5px;
	color: #231815;
	background: #FFE860;
	font-size: 12px;
	line-height: 1.3;
	height:23px;
}

.header_area {
  position: fixed; /* 固定 */
  top: 0; /* 一番上に表示 */
  width: 100%; /* 中央に表示 */
  z-index:50;	}

.header_box_t{
	width:100%;
	height:100%;
	float:left;	
	background:#2A80A2;

}
.header_box_b{
	width:100%;
	height:22px;
	float:left;
	text-align: center;
    position: relative;
	
}


.header_box_b_1{
	width:25%;
	height:22px;
	float:left;
	text-align: center;
	background:#EAEAED;
}

.header_box_b_2{
	width:25%;
	height:22px;
	float:left;
	text-align: center;
    position: relative;
	background:#EAEAED;
}
 
.header_box_b_1 a { display:block;
width: 100%; /* 横幅 */
text-decoration:none;
color:#443C58;
}
.header_box_b_2a { display:block;
width: 100%; /* 横幅 */
text-decoration:none;
color:#443C58;
}
 
/* フッター */
.footer_area {
  position: fixed; /* 固定 */
  bottom: 0; /* 一番下に表示 */
  width: 100%; /* 中央に表示 */
  z-index:50;	
  height:63px;
	background: #443C58;
}
.footer_block {
	position: relative;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	width:100%;
	background: #443C58;
	padding:0px;
	text-align:center;
	

}
.footer_block img {
max-width: 95px;
	width:20%;
margin-left: auto;
margin-right: auto;
}


.footer_box {
	width:100%;
	float:left;
	text-align:center;
	
}
.footer_box_l {
	width:55%;	
	float:left;
}

.footer_box_r {
	width:45%;	
	float:left;
	
}

/* フッター */


/* コンテンツ */
.contents_wrap {
  width: 100%;
  overflow: auto; /* スクロールする範囲を制御 */
  margin: 0 auto;
  padding: 0px 0px 63px 0px; /* コンテンツ上下にスペース */
	
	background-color:#F6F5F7;
}

.contents_area {
  width: 100%;
  overflow: auto; /* スクロールする範囲を制御 */
  margin: 0 auto;
  padding: 0px 0px 0px 0px; /* コンテンツ上下にスペース */
	
	background-color:#ffffff;
}
/* コンテンツ */





/*↓メルフォ部分の画像＆文字＆背景設定↓*/
 
	body {
		margin: 0;
		padding: 0;
		
		font-family: 'Roboto', sans-serif;
		font-size: 13px;
		
		webkit-text-size-adjust: 100%;
	}
		
	h1 {
		margin: 0;
		padding: 15px 12px 14px 50px;
		color: #fff;
		background: #2FACC1;
		font-size: 18px;
		line-height: 1.3;
	}
	
	h1:before {
	  font-family: "Font Awesome 5 Free";
	  content: '\f0e0';
	  font-weight:normal;
	  position: absolute;/*絶対位置*/
	  font-size: 25px;/*サイズ*/
	  left: 15px;/*アイコンの位置*/
	  top: 10px;/*アイコンの位置*/
	  color: #ffffff; /*アイコン色*/
	}
	

	h3 {
	  position: relative;
	  padding-top:10px;
	  padding-bottom:9px;
	  padding-left:33px;/*アイコン分のスペース*/
	  margin-top:20px;
	  margin-bottom:10px;	  
	  line-height: 1.4;
	  border-bottom: solid 1px #B7B7B7;/*下線*/
	  border-top: solid 1px #B7B7B7;/*上線*/
	  color:#4F4F4F;
	background: #E5E5E5;
	}

	h3:before {
	  font-family: "Font Awesome 5 Free";
	  content: '\f5ac';
	  position: absolute;/*絶対位置*/
	  font-size: 20px;/*サイズ*/
	  left: 8px;/*アイコンの位置*/
	  top: 5px;/*アイコンの位置*/
	  color: #2FACC1; /*アイコン色*/
	  z-index:10;
	}
	
	h4{
	  border-left: double 3px #2FACC1;/*左線*/
	  margin:0px 0px 2px 0px;
	  padding:0px 0px 0px 5px;
	  font-weight:normal;
	}


h2 {/* 緑の見出し */
	margin: 30px 0px 3px 0px;
	padding: 5px 12px 14px 12px;
	color: #fff;
	background: #443C58;
	font-size: 20px;
	line-height: 1.3;
	height:15px;
	/*　border-top:1.5px solid #000000;*/
	/* border-bottom:1.5px solid #000000;*/
}

h5{/* グレーの見出し　*/
	margin: 30px 0px 3px 0px;
	padding: 5px 12px 14px 12px;
	color: #000000;
	background: #cccccc;
	font-size: 20px;
	line-height: 1.3;
	height:15px;	
}

h6{/* グレーの見出し　*/
	margin: 0px 0px 0px 0px;
	padding: 60px 0px 0px 0px;
	color: #736D82;
	background-color: #ffffff;
  border-bottom: solid 1px #736D82;	
	font-size: 20px;
	line-height: 1.3;
	height:15px;	
}




/* 背景グレー */
.glay{
	background-color:#F6F5F7;
	width:100%;	
  padding:30px 35px 30px 30px; /* コンテンツ上下にスペース */
	box-sizing: border-box;
	color:#736D82;
}

/* 背景グレー */




/*メニューリンク*/

.span1box a { 	
	display:block;
	width: 100%; /* 横幅 */
	background-color:#F6F5F7;
	border-top:1px solid #B4B1BC;
	border-bottom:1px solid #B4B1BC;
	padding:10px 0px 35px 0px; /* a要素内の余白 */
	text-decoration: none;
	position: relative;
	color:#736D82;
}

.span2box a { 	
	display:block;
	width: 100%; /* 横幅 */
	background-color:#F6F5F7;
	border-bottom:1px solid #B4B1BC;
	padding:10px 0px 35px 0px; /* a要素内の余白 */
	text-decoration: none;
	position: relative;
	color:#736D82;
}

.spanbox_left { 	
  position: absolute;
  left: 0;	
	font-size:15px;	
}
.spanbox_right { 	
  position: absolute;
  right: 0;	
	font-size:20px;	
	padding-right:5px;
}

.span_title { 
	width: 100%; /* 横幅 */
	padding:35px 0px 0px 0px; /* a要素内の余白 */
	position: relative;
	text-align:center;
	display: block;
}

.span_main { 
	width: 100%; /* 横幅 */
	padding:0px 0px 0px 0px; /* a要素内の余白 */
	position: relative;
	display: block;
	text-align:center;
}

/*メニューリンク*/


table, th, td {
  border-collapse: collapse;
  border: 1px solid #ccc;
  line-height: 1.5;
	font-size:12px;
}

table.type06 th {
  padding: 5px;
  font-weight: bold;
  vertical-align: middle;
	background-color:#EAEAED;
	width:40%;
	text-align:left;
}
table.type06 td {
  padding: 5px;
  vertical-align: middle;
 }

table.type05{
	width:100%
}

table.type05 th {
  padding: 5px;
  font-weight: bold;
  vertical-align: middle;
	background-color:#EAEAED;
	width:30%;
	text-align:left;
}
table.type05 td {
  padding: 5px;
  vertical-align: middle;
 }




/*フォーム内「必須」*/
	.Font_red {
		font-size: 9px;
		font-weight:bold;
		color:#D51C09;		
		line-height: 5px;
	  margin:0px;
	  padding:0px;
	}
	.Font_red_big {
		font-size: 12px;
		font-weight:bold;
		color:#D51C09;		
		line-height: 2px;
	  margin:0px;
	  padding:0px;
	}
	
	.Font_blue {
		color:#443C58;
		font-weight:bold;
	}
	.Font_B {
		font-weight:bold;
	}
.Font_small {
		font-size:10px;
	}
	
	.Formwrap{
		background-color:#ffffff;
		width:100%;
		padding-bottom:50px;
	}
	
	
	.nomal {
		padding: 5px 10px 5px 10px;
		font-size: 13px;
	}

	.Mainnomal {
		padding: 5px 25px 5px 25px;
		font-size: 14px;
		line-height:1.3;
	}
	.Mainnomal_half {
		float:left;
		width:50%;
		font-size: 14px;
		line-height:1.3;
		text-align:center;
	}
	
	.hosoku{
		padding: 5px 0px 5px 0px;
		font-size: 11px;
		color:#969696;
		line-height: 1.3;        /* 行の高さ */
		
	}

	
	.Formmain {
		padding: 5px 10px 5px 10px;
		font-size: 13px;
		line-height:1.4			;
	}
	
	
	input[type="text"] ,
	input[type="email"] ,
	input[type="tel"] ,
	textarea,
	select {
		font-size: 16px;
		border: 1px solid #B7B7B7;  /* 枠線 */
    	border-radius: 3px;   /* 角丸 */
		padding: 5px;          /* 内側の余白量 */
		margin: 2px 0px 2px 0px;   /* 外側の余白量 */
		background-color: #ffffff;  /* 背景色 */
		width: 100%;             /* 横幅 */
		line-height: 1.2;        /* 行の高さ */
		box-shadow:0 1px 1px 1px #F3F3F3 inset;
	}
	
	input[type="text"] ,
	input[type="email"] ,
	input[type="tel"] ,
	textarea {
		
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		
		-webkit-appearance: none;
	}
	input[type="text"] ,
	input[type="email"] ,
	input[type="tel"] ,
	select {
		height:35px;
	}
	
	input[type="radio"],
	input[type="checkbox"]{
		width: 25px;             /* 横幅 */
		height:25px;
		border: 1px solid #B7B7B7;  /* 枠線 */
		vertical-align:middle;
		
	}

	input[type="submit"],
	input[type="reset"],
	input[type="button"]
{
		width:65%;
		height:50px;
		background:#443C58;
		font-size:16px;
		color:#ffffff;
		font-weight: bold;
    	border-radius: 3px;   /* 角丸 */
		box-shadow:2px 2px 1px #cccccc;
		
		-webkit-box-sizing: content-box;
		-webkit-appearance: button;
		appearance: button;
		border: none;
		box-sizing: border-box;
		cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration,
	input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="reset"]::focus,
input[type="button"]::focus  {
  outline-offset: -2px;
}

/*現調 見積依頼ボタン*/
.button_gencho,
.button_mitsumori{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #fd9535;/*背景色*/
  border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/
  border-radius: 4px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
}

a.button_gencho_Inner{
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding:2px 2px 0px 0px;
	width:100%;
	height:25px;
	color:#ffffff;
	text-align:center;
}

a.button_mitsumori_Inner{
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding:2px 2px 0px 0px;
	width:100%;
	height:25px;
	color:#ffffff;
	text-align:center;
}


/*↓フォームボタンや問合せボタン↓*/



	
	.zenbu{
		width:100%;
		text-align:center;	}
	
	.hanbun{
		width:50%;
		float:left;
		text-align:center;
	}


/*↓グレー背景↓*/
.BG_gray{
	background-color: #EAEAED;
	width:100%;
	padding:20px 0px 20px 0px;
}


/*↓問合せ部分↓*/
.toiawase_l{
	font-size:35px;
	color:#443C58;
	float:left;
}

.toiawase_r{
	font-size:20px;
	color:#443C58;
	padding:0px 0px 0px 50px;
}







/*youtube部分の画像＆背景設定*/
.YouTube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
 max-width:560px;
	margin: 0 auto;
	background-color:#EAEAED 
}

.YouTube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
/*youtube部分の画像＆背景設定*/








/*↓ページトップへ↓*/
/* パソコン・スマホ共通のCSS */
#PageTopBtn {
    position: fixed; /*ボタンの配置場所を固定*/
    bottom: 48px; /*下からのボタンの配置場所を指定*/
    right: 10px; /*右からのボタンの配置場所を指定*/
}
#PageTopBtn a {
    display: block; /*配置の調整*/
    text-decoration: none; /*文字の下線を消す*/
    color: #fff; /*文字の色*/
    background: #FF4545; /*ボタンの背景色*/
    text-align: center; /*文字を中央に配置*/
    border-radius: 5%; /*ボタンの角を少し丸くする*/
    outline: none; /*クリックしたときの黒い枠を消す*/
}
#PageTopBtn a:hover {
    text-decoration: none; 
    background: #FFA0A0; /*マウスオーバー時の背景色*/
}

/* パソコンで表示する場合のCSS */
@media (min-width: 768px) {
#PageTopBtn {
    font-size: 13px; /*文字のサイズ*/
}
#PageTopBtn a {
    width: 100px; /*ボタンの幅*/
    height: 20px; /*ボタンの高さ*/
    padding: 24px 0; /*文字の配置場所の調整*/
}
}

/* スマホで表示する場合のCSS */
@media (max-width: 767px) {
#PageTopBtn {
    font-size: 13px;
	font-weight:bold;
}
#PageTopBtn a {
    width: 100px;
    height: 30px;
    padding: 12px 0px 5px 0px;
}
}
	



/***************************/
/* 仕様書ページ */


/* テーブル */
.Shiyo_wrap{
	width:100%;
}

.Shiyo{
	Width:95%;
	
}




