@charset "utf-8";

html,
body {
	height: 100%;
	margin: 0;
}
a {
	color: #333;
    text-decoration: none;

	transition: 0.25s; /* all */
}
a:hover {
	color: #fff;
}
img {
	max-width: 100%;	
	height: auto;
	width /***/:auto; /* IE8のみ */
	vertical-align: bottom;

	transition: 0.25s; /* all */
}
/* body */

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
	background-color: #fff;
}

/**//**//**//**//**//**//**/
/* レスポンシブ画面右余白バグ */
div.wrapper {
	overflow: hidden;
}
/**//**//**//**//**//**//**/

	/* リスト */
.bread_list {
	background-color: #eee;
	padding: 2%;
	font-size: 14px;
}
.bread_list li {
	display: inline;	
}
.bread_list li a:hover {
	color: #999;
}

.bread_list_home:before {
	content: url(../img/index_icon_house.gif);
}
/* ロゴ */
.logo {
	padding: 2%;
	background-color: #eee;
}
.logo img {
	width: 20%;
}
/*nav position*/
nav {	
	width: 100%;	
	padding: 1% 0 1.5% 0;
	text-align: center;
	font-size: 16px;
	color: #fff;
	background-color: #164088;
}
nav img {
	width: 9%;
}	
nav ul  {
	overflow: hidden;
}

nav ul li {
	font-size: 18px;
	float:left;
	width: 16.6666%; /*x5では20%*/
}
nav ul li a {
	color: #ddd;
	width: 16.6666%; /*x5では20%*/
}

nav ul li a:hover {
	color: #fff;
}
nav ul li.now a {
	color: #fff;
}
	/*現在のページ設定*/
nav ul li.now a {
	color: #fff;
}
		/*吹き出し下三角*/
.now-fukidasi {
	width: 100%;
	background-color: #eee;
}
		/* bg-image+margin-left */
.now-fukidasi-in {	
	width: 20%;
	margin-left: 14.5%; /*x5では20%*/
	height: 20px;
	background-image: url(../img/works/works_arrow.png);
	background-position: center center;
	background-size: 20px 20px;
	background-repeat: no-repeat;
}
	
/* maincontent */

	/*hello 全体*/
.hello {
	width: 100%;
	overflow: hidden;
	margin-bottom: 3%;
	background-color: #eee;
}
		/*hello 内範囲中央固定*/
.hello-box {
	width: 100%;
	height: 250px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.text-area img {
	position: absolute;
	top: 0%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	margin-left: auto;
	margin-right: auto;
	width: 95%;
	max-width: 610px;　/*最大値*/
	max-height: 200px;

	min-width: 500px;
	min-height: 175px; /*最小値*/
}
.hello-left .text-area h2,
.hello-left .text-area p {
	text-align: center;
}

.hello-right {
	width: 100%;
	height: inherit;
	float: right;
	background-image: url(../img/about/about_bg.jpg);
	background-clip: padding-box;
	background-size: cover;
	background-position: 50% 85%;
}
/*.hello-right p*/ {
	/*width: calc(100% - 20%);*/
	/*height: calc(100% - 20%);*/
}
.hello-right p {
	text-indent: -99999px;
}

/* gif 600x animation */
.new-company-gif {
	margin-left: auto;
	margin-right: auto;
	width: 500px;
	height: 367px;

	padding: 2.5% 0 5% 0;
}
.new-company-gif img {
	margin-left: auto;
	margin-right: auto;
	width: 500px;
	height: 367px;
}
/* gif animation */

/* 会社情報 */
.table-area {
	width: auto;
	margin-bottom: 7%;
}
table.infor-table {
	margin-left: auto;
	margin-right: auto;
	width: 680px;
}
.table-area th {
	font-size: 16px;
	width: 30%;
	padding: 4% 0;
}
.table-area td {
	font-size: 16px;
	width: 70%;
	border-bottom: 1px solid #d9e2ee;
	line-height: 1.3;
}
	/* 事業案内（主要取扱工事） x2 分割 */
.businessbox {
	overflow: hidden;
	padding-bottom: 5%;
	position: relative;
}
.businessbox-l {
	width: 50%;
}
		/* right - position */
.businessbox-r {
	width: 50%;
	position: absolute;
	top: 0;
	right: 0;
}

/* history 沿革 */
section.history{
	margin-bottom: 7%;
}
section.history h2 {
	padding: 3% 0;
	padding-left: 3%;
	background-color: #164088;
	color: #fff;
	font-size: 24px;
}
.history-in {
	width: 850px;	
	margin-left: auto;
	margin-right: auto;
	margin-top: 3.5%;
}
.history-in h3 {
	font-size: 28px;
	font-weight: normal;
}
.history-in p {
	width: 650px; /* important */
	margin-left: auto;
	margin-right: auto;

	font-weight: normal;
	font-size: 18px;
	text-align: center;
	margin-bottom: 4%;
	padding: 2% 0 2% 0;
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
}
/* 沿革 table */
table.enkaku-table {
	margin-left: auto;
	margin-right: auto;
}
.history-in table {
	width: 650px;
}
	/* x年x月 ～創業*/
.history-in th {
	width: 30%;
	padding: 4.5% 0;
	font-weight: normal;
	font-size: 16px;
}
.history-in td {
	width: 70%;
	font-weight: normal;
	font-size: 16px;
}
.history-in tr {		
	margin: 5% 0;
}
	/* x2 */
.history-in table tr:nth-child(even) {
background: #fff;
}
 		/* x1 */
.history-in table tr:nth-child(odd) {
background: #eee;
}

/* map */
section.map {
	margin-bottom: 8%;
}
section.map h2 {
	padding: 3% 0;
	padding-left: 3%;
	background-color: #f0cb00;
	color: #fff;
	font-size: 24px;
}

.map-area {
	width: 650px;		
	margin-left: auto;
	margin-right: auto;
}
.map-area-bg {
	background-color: #fff;
}
iframe {
	width: 650px;
	height: 450px;
}

/* 求人情報 */
	/* 下部分間隔 */
section.hire {
	margin-bottom: 4%;
}
	/* 求人情報h2との間隔 */
section.hire .hire-area {
	margin-top: 4%;
	width: 700px;
	margin-left: auto;
	margin-right: auto;
}
	/* h2 見出し */
section.hire h2 {
	padding: 3% 0;
	padding-left: 3%;
	background-color: #164088;
	color: #fff;
	font-size: 25px;
}
	/* table */
section.hire table {
	border: 1px solid #c4ccd4;
}

section.hire table th {
	font-size: 16px;
	width: 20%;
	border: 1px solid #a1b7d0;
	background-color: #d9e0e8;
}
section.hire table td {
	font-size: 16px;
	line-height: 1.4;
	width: 80%;
	padding: 20px;
	background-color: #fff;
	border: 1px solid #a1b7d0;
}

	/* 詳細につきましては */
section.hire .hire-contact {
	padding: 4% 0;
	margin: 3% 0;
	background: #f6f6f6;
	border: 3px solid #0080c9;
	text-align: center;
}
section.hire .hire-contact p {
	line-height: 1.6;
	font-size: 19px;
	font-weight: bold;
	color: #333;
}
section.hire .hire-contact p span {
	font-size: 16px;	
}
section.hire .hire-contact p i {
	font-size: 25px;
	padding-right: 12px;
}

section.hire .hire-contact p a {
	font-size: 20px;
	color: #333;
}
section.hire .hire-contact p a:hover {
	color: #555;
}

/* フッター */
footer {
	clear: both;
	overflow: hidden;
	padding: 15px 0px;
	text-align: center;
	font-size: 14px;
	background-color: #eee;
}
footer p.personal {
	text-align: center;
}
footer .footer-copy-box {
	text-align: center;
	padding-top: 15px;
}
footer .copy {
	padding-bottom: 5px;
}

/* 上へ戻る */
footer #pageTop {
	clear: both;
	text-align: right;	
	padding: 0;
	font-size: 14px;
}
		/*i display:block--- p 下へ*/
footer #pageTop i {
	display: block;
	text-align: center; 
}
/**//**//**//**//**//**//**/
	/* add　トップへ戻るボタンが下へ(x)px移動すると固定で現れる */
#pageTop {
  position: fixed;
  bottom: 2%;
  right: 2%;
}
#pageTop a {
  display: block;
  z-index: 999;
}
#pageTop {
	font-size: 19px;
}
/**//**//**//**//**//**//**/

/*footer　nav メニュー位置*/
footer .footer-nav {
	width: 750px;
	padding: 2% 0% 3% 0%;
	font-size: 16px;
	background-color: #000;
	background-color: rgba(0,0,0,0.0);
	margin-left: auto;
	margin-right: auto;		
}
footer .footer-nav ul  {
	overflow: hidden;
}
footer .footer-nav ul li {
	float:left;
	width: 125px;

	transition: all 0.3s ease;
}
footer .footer-nav ul li a {
	display: block;
	width: 125px;	
	overflow: hidden;
}
footer a {	
	color: #000;
}
footer a:hover {
	color: #999;
}

/* 連絡先 */
address {
	font-style: normal;
}

/*＝＝＝＝＝＝＝＝＝*/
.hello-sp-h2 {
	display: none;
}
/*＝＝＝＝＝＝＝＝＝*/


@media screen and (max-width: 767px) {
    /* 767px */
		/* 会社情報 */
	.table-area {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	}
	.table-area th {
	text-align: left;
	}
	table.infor-table {
	margin-left: auto;
	margin-right: auto;
	width: 475px;
	}
		/* 沿革 */
	.history-in {
	width: 90%;	
	margin-left: auto;
	margin-right: auto;
	margin-top: 6%;
	}
		/* 沿革 文字*/
	section.history h2 {
	padding: 4% 0;
	padding-left: 5%;
	font-size: 26px;
	}
		/* 沿革*/
	.history-in p {
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 4.5%;
	font-size: 17px;
	line-height: 1.8;
	}
		/* 段落大きさ */
	.history-in table {
	width: 450px;
	width: 80%;
	line-height: 2.75;
	}
	.history-in table th,
	.history-in table td {
	padding-left: 5%;
	}
	/* map */
	section.map {
	margin-bottom: 10%;
	}
	section.map h2 {
	padding: 4% 0;
	padding-left: 5%;
	font-size: 26px;
	}
	.map-area-bg {
	width: 100%;
	}
	.map-area {
	width: 500px;
	margin-left: auto;
	margin-right: auto;
	}
	iframe {
	width: 500px;
	}
	/* 求人情報 */
	section.hire h2 {
	padding: 4% 0;
	padding-left: 5%;
	font-size: 26px;
	}
	section.hire .hire-area {
    margin-top: 5%;
    width: 80%; /*全体幅*/
	}
	.hire-area table {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	}

	/* nav change */
		/* nav メニュー位置 */
	footer .footer-nav {
	width: 100%;
	padding: 0% 0% 2% 0%;
	margin-left: auto;
	margin-right: auto;		
	}
	footer .footer-nav ul li {
	width: 16.666%;
	}
	footer .footer-nav ul li a {
	width: 100%;
	}
}

@media screen and (max-width: 479px) {
	/* nav change */
		/*nav position*/
	nav {	
	width: 100%;	
	padding: 0;
	}
	nav img {
	width: 18%;
	}
	nav ul  {
	overflow: hidden;
	padding: 1.5% 0 2.5% 0;
	background-color: #164088;
	}
		/* top icon */
	nav h2 {
	padding: 2% 0 0 0;
	}
	nav ul li {
	font-size: 18px;
	float: none;
	width: 100%;
	padding: 2.25% 0;
	}
	nav ul li a {
	width: 100%;
	}
		/* nav a:hover */
	nav ul li a:hover {
	border-bottom: #fff 1px solid;
	}
	nav ul li.now a {
	/*border-bottom: #CCC 1px solid;*/
	}
	nav ul li.now a:hover {
	border: none;
	color: #fff;
	}
		/*吹き出し下三角-不可視*/
	.now-fukidasi {
	width: 0%;

	display: none;
	}
			/* bread_list */
	.bread_list {
	padding: 4% 0 4% 2%;
	}
	/* ロゴ */
	.logo {
	padding: 3.5%;
	}
	.logo img {
	width: 40%;
	margin-left: auto;
	margin-right: auto;
	}
			/*ロゴ　文字 内範囲中央固定*/
				/* 当社では～させて頂きます */
	.hello-box {
	width: 100%;
	height: 180px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	}
		/* テキストimg */
	.text-area img {
	position: absolute;
	top: 5%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 435px;　/*最大値*/
	max-height: 155px;

	min-width: 300px;
	min-height: 115px; /*最小値*/
	}
	/* GIF アニメ */
		/* gif 600x animation */
	.new-company-gif {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	height: auto;

	padding: 2.5% 0 5% 0;
	}
	.new-company-gif img {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: auto;
	}
		/* gif animation */

		/* 会社概要テーブル */
	.table-area {
	width: 85%;
	}
	table.infor-table {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	font-size: 16px;
	}

		/* レスポンシブ table */
	.table-area td,
	.table-area th {
	width: 100%;
	display: block;
	padding: 6% 0;
	border: none;	
	}
		/* th 色 */
	.table-area th {
	background-color: #eee;
	padding: 4.5% 0;
	}
		/* 会社概要内 工事種類 box float null */
	.table-area td {
	line-height: 1.5;
	}
	.businessbox-l {
	width: 100%;
	}
		/* right - position */
	.businessbox-r {
	width: 100%;
	position: static;
	}

	/* 沿革 */
	section.history {
    margin-bottom: 12%;
	}
	.history-in table {
	width: 100%;
	}
	/* 沿革文字 */
	section.history h2 {
    padding: 6.25% 0;
    padding-left: 6%;
	}
		/* 現在に至るまでの p */
	.history-in p {
	width: 100%;
	padding: 5% 0;
	margin-bottom: 12%;
	margin-left: auto;
	margin-right: auto;
	font-size: 15px;
	}
		/* x年x月 ～創業*/
	.history-in {
    margin-top: 10%;
	}
	.history-in th {
	width: 40%;
	padding: 4% 0;
	font-size: 15px;
	}
	.history-in td {
	width: 60%;
	font-size: 15px;
	}

	/* MAP */
	section.map {
	margin-bottom: 15%;
	}
		/* MAP 文字 */
	section.map h2 {
    padding: 6.25% 0;
    padding-left: 6%;
	}

	.map-area {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	}
	iframe {
	width: 100%;
	}

	/* 求人情報　レスポンシブ段組 */
		/* 優先順位に注意 */
	section.hire table td,
	section.hire table th {
	width: 100%;
	display: block;
	padding: 5% 0;
	border: none;
	text-align: center;
	}
	section.hire .hire-area {
    width: 85%;
    margin-top: 8%;
	}

	/* 詳細につきましては */
	section.hire .hire-contact {
	padding: 16px;
	}
	section.hire .hire-contact p {
	font-size: 16px;
	}

	/* footer */
	footer {
	padding: 0 0 3% 0;	
	}
		/* nav position */
	footer .footer-nav {
	width: 100%;
	padding: 3% 0%;
	font-size: 19px;
	margin-left: auto;
	margin-right: auto;		
	}
	footer .footer-nav-t {
	overflow: hidden;
	width: 100%;
	text-align: center;
	}
	/* footer nav change */
			/* TOP~画面幅へ広げた一段落 or x2 */
	footer .footer-nav ul li {
	float: left; /* none で1段落 */
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	}
	footer .footer-nav ul li a {
    width: 100%;
    padding: 5% 0; /* important */
	}
		/*  a:hover background-color 色変更 */
	footer .footer-nav ul li a:hover {
	color: #000; /* overwritten */
	background-color: #fff;
	}
		/*現ページを無視する設定*/
	footer .footer-nav ul li.now-footernav a {
	color: #000;
	}
	footer .footer-nav ul li.now-footernav a:hover {
	color: #000;
	background-color: #fff;
	}
			/* footer CSS3 矢印 */
	#css-arrow {
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px; padding: 0;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
	}
	#css-arrow::before,
	#css-arrow::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
	}

	#css-arrow::before {
	left: 3px; left: 5px;
	width: 4px; width: 6px;
	height: 4px; height: 6px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	}
}

@media screen and (max-width: 320px) {
	nav img {
    width: 18.5%;
	}
	.bread_list {
	font-size: 12px;
	padding: 5% 0;
	}
		/*ロゴ　文字 内範囲中央固定*/
			/* 当社では～させて頂きます */
	.hello-box {
	height: 135px;
	}
	.text-area img {
	position: absolute;
	top: 5%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 300px;
	max-height: 90px;

	min-width: 250px;
	min-height: 80px; /*最小値*/
	}
	/* 求人情報　レスポンシブ段組 */
		/* 優先順位に注意 */
	section.hire .hire-area {
    width: 90%;
	}
	section.hire table td,
	section.hire table th {
	padding: 7% 0;
	line-height: 1.6;
	text-align: left;
	}
	section.hire .hire-area {
    margin-top: 10%;
	}
	/* 詳細につきましては */
	section.hire .hire-contact {
	margin: 24px 0;
	padding: 20px 12px;
	}
	section.hire .hire-contact p {
	font-size: 14px;
	}
}

/* 印刷時の設定 "page-break-point"*/
@media print {
	body {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	}
	/* print ブレークポイント */
	.page-break-point {
	page-break-after: always;
	}
	.logo {
	background-color: #fff;
	margin: 8px 0;
	}
	.logo img {
	width: 22.5%;
	}
		/* nav,吹き出し none */
	.mainVisual-cover-box {
	display: none;
	}
		/* blead none */
	.bread_list {
	display: none;
	}
	.hello {
    margin-bottom: 2.5%;
	background: #fff;
	}
	.hello-box {
    height: 230px;
	}
	.hello {
	display: none;
	}
		/* GIF none */
	.new-company-gif-wrapper {
	display: none;
	}
	/* 会社情報テキスト print追加 */
	.gaiyou-text {
	display: block !important;
	padding: 20px 0;
	padding-left: 28px;
	background-color: #164088;
	color: #fff;
	font-size: 19px;
	}
	.table-area {
	line-height: 2.5;
	margin-top: 22px;
	padding: 0;
	}
		/* table width */
	table.infor-table {
	width: 95%;
	}
	table.infor-table {
    border: 1px solid #c4ccd4;
	}
	.table-area th {
    border: 1px solid #a1b7d0;
    background-color: #d9e0e8;
	}
	.table-area th {
	width: 30%;
	padding: 8px 0 8px 0;
	text-align: center;
	}
	.table-area td {
	width: 70%;
	line-height: 1.5;
	padding: 8px 0 8px 16px;
    border: 1px solid #c4ccd4;
	}

	/* history 沿革 */
	section.history{
	margin-top: 20px;
	margin-bottom: 20px;
	}
		/* h2 見出し */
	section.history h2 {
	padding: 20px 0;
	padding-left: 28px;
	font-size: 19px;
	}
	.history-in {
	width: 100%;
	margin-top: 3%;
	}
	.history-in h3 {
	font-size: 16px;
	}
		/* p */
	.history-in p {
	width: 80%;
	margin-bottom: 4%;
	margin-top: 4.5%;
	padding: 1% 0;
	font-size: 16px;
	border: none;
	}
	/* 沿革 table */
	.history-in table {
	width: 80%;
	border: 1px solid #a1b7d0;
	}
	/* x年x月 ～創業*/
	.history-in th {
	width: 35%;
	padding: 3% 5%;
	font-size: 16px;
	text-align: left;
	border-right: 1px solid #a1b7d0;
	border-bottom: 1px solid #a1b7d0;
	background-color: #fff;
	}
	.history-in td {
	width: 65%;
	padding: 0 5%;
	font-size: 16px;
	border-bottom: 1px solid #a1b7d0;
	background-color: #fff;
	}
		/* トップ */
	.history-in .history-tr-top th,
	.history-in .history-tr-top td {
	background-color: #d9e0e8;
	}

	/* map の設定 */
	section.map {
	margin-bottom: 2%;
	}
		/* h2 見出し */
	section.map h2 {
	padding: 20px 0;
	padding-left: 28px;
	font-size: 19px;
	}
		/* map div */
	.map-area {
	width: 100%;
	margin-top: 16px;
	text-align: center;
	}
	iframe {
	width: 90%;
	height: 400px;
	}

	/* 求人情報 */
	section.hire {
	margin: 5% 0;
	}
		/* 求人情報h2との間隔 */
	section.hire .hire-area {
	width: 640px;
	}
	/* h2 見出し */
	section.hire h2 {
	padding: 20px 0;
	padding-left: 28px;
	font-size: 19px;
	}
	/* table */
	section.hire table td {
	width: 80%;
	padding: 13px;
	}
		/* 詳細につきましては */
	section.hire .hire-contact {
	margin: 4% 0;
	font-size: 13px;
	text-align: center;
	background-color: #fff;
	}
	section.hire .hire-contact p {
	line-height: 1.5;
	}
	/* footer (i) */
	footer {
	display: none;
	}
}