@charset "utf-8";
/* CSS Document */

body {
	width: 100%;
	background-color: #FFF;
	color: #000;
	font-family:'Lucida Grande',
 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	line-height: 2;
}

img { vertical-align: bottom; }

a:hover { opacity: 0.7; }

/*-----------------------------
text_style, box_style
-----------------------------*/

/*スマホ向けレイアウトの指定*/

.fs_12_sp { font-size: 12px; }
.fs_14_sp { font-size: 14px; }
.fs_16_sp { font-size: 16px; }
.fs_18_sp { font-size: 18px; }
.fs_20_sp { font-size: 20px; }
.fs_24_sp { font-size: 24px; }
.fs_30_sp { font-size: 30px; }
.fs_40_sp { font-size: 40px; }
.fs_50_sp { font-size: 50px; }
.fs_80_sp { font-size: 80px; }

.fs_150_sp {font-size: 150%; }
.fs_200_sp { font-size: 200%; }
.fs_250_sp { font-size: 250%; }
.fs_120_sp { font-size: 120%; }

.font_fami02 { font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif" }

.ta_center_sp { text-align: center; }
.ta_left_sp { text-align: left; }
.ta_right_sp { text-align: right; }

.fw_bold { font-weight: bold; }
.fw_lighter { font-weight: lighter; }

.fc_white { color: #fff; }
.fc_black { color: #000; }
.fc_rd { color: #990000; }
.fc_bl { color: #003399; }

.space2 { letter-spacing: 2px; }
.space5 { letter-spacing: 5px; }

.only_sp { display: block; }
.only_tb { display: none; }
.only_pc { display: none; }

.lh_10 { line-height: 1; }
.lh_12 { line-height: 1.2; }
.lh_15 { line-height: 1.5; }
.lh_17 { line-height: 1.7; }

/*.bg_rd { background-color: #990000; }*/

.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb60 { margin-bottom: 60px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt60 { margin-top: 60px; }
.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.ml60 { margin-left: 60px; }

.img_responsive {
	max-width: 100%;
	height: auto;
}

.link_01 {
    vertical-align:baseline;
    background:transparent;
	text-decoration: none;
}

.list_01 {
	list-style: none;
	text-indent: -1em;
	padding-left: 1em;
}

.list_02 {
	list-style: none;
}

.list_03 {
	list-style: none;
	padding-left: 1em;
	list-style-image: url(../images/list_mark01.png);
}

.word_wrap {
	word-wrap: break-word;
}

.color_filter_base {
    background-color: #000; /* カラーフィルタ効果の色を指定 */
    /*display: inline-block;*/
}
.color_filter_image {
    opacity: 0.7;    /* カラーフィルタ効果の度合いを指定(※) */
    display: block;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.fs_12_tb { font-size: 12px; }
	.fs_16_tb { font-size: 16px; }
	.fs_18_tb { font-size: 18px; }
	.fs_20_tb { font-size: 20px; }
	.fs_24_tb { font-size: 24px; }
	.fs_30_tb { font-size: 30px; }
	.fs_40_tb { font-size: 40px; }
	.fs_50_tb { font-size: 50px; }
	.fs_80_tb { font-size: 80px; }

	.fs_150_tb {font-size: 150%; }
	.fs_200_tb { font-size: 200%; }
	.fs_250_tb { font-size: 250%; }
	.fs_120_tb { font-size: 120%; }

	.ta_center_tb { text-align: center; }
	.ta_left_tb { text-align: left; }
	.ta_right_tb { text-align: right; }

	.only_sp { display: none; }
	.only_tb { display: block; }
	.only_pc { display: none; }
	}

		/*PC向けおよび大型PCの指定*/
		@media only screen and (min-width:1080px){
		body { min-width: 1080px; }

		.fs_12_pc { font-size: 12px; }
		.fs_14_pc { font-size: 14px; }
		.fs_16_pc { font-size: 16px; }
		.fs_18_pc { font-size: 18px; }
		.fs_20_pc { font-size: 20px; }
		.fs_24_pc { font-size: 24px; }
		.fs_30_pc { font-size: 30px; }
		.fs_40_pc { font-size: 40px; }
		.fs_50_pc { font-size: 50px; }
		.fs_80_pc { font-size: 80px; }
		.fs_150_pc {font-size: 150%; }
		.fs_200_pc { font-size: 200%; }
		.fs_250_pc { font-size: 250%; }
		.fs_120_pc { font-size: 120%; }

		.ta_center_pc { text-align: center; }
		.ta_left_pc { text-align: left; }
		.ta_right_pc { text-align: right; }

		.only_sp { display: none; }
		.only_tb { display: block; }
		.only_pc { display: block; }
		}

/*-----------------------------
responsive_grid
-----------------------------*/

/*スマホ向けレイアウトの指定*/
.inner01 {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.inner02 {
	width: 94%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.inner03 {
	width: 94%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.flex_box_sp {
	display: flex;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.flex_box_tb {
		display: flex;
	}

		
		/*事例紹介個別ページ写真*/
	.flex_box_02_tb {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-start;
	}

		/*事例紹介個別ページ写真二枚の場合左寄せ*/
	.flex_box_02_tb:after {
		content:"";
    	display:block;
    	width: 31%;
    	height:0;
	}
		
	.col_01_tb {
		width: 64%;
	}

	.col_02_tb {
		width: 32%;
	}

	.col_03_tb {
		width: 49.9%;
	}

	.col_04_tb {
		width: 24%;
	}
	}

		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1080px){
		.inner01 {
			width: 1200px;
		}

		.inner02 {
			width: 1080px;
		}

		.inner03 {
			width: 980px;
		}

		.flex_box_pc {
			display: flex;
		}

		.col_01_pc {
			width: 64%;
		}

		.col_02_pc {
			width: 32%;
		}

		.col_03_pc {
			width: 49.9%;
		}	

		.col_04_pc {
			width: 24%;
		}
		}

/*-----------------------------
Header
-----------------------------*/
header {
	/*border-top: solid #003399 10px;*/
	padding: 20px 0;
	/*background-color: #EAEAEA;*/
}

.inner_header {
	width: 94%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.header_contact_wrap {
	position: fixed;
	bottom:0;
	width: 100%; /**fixedにした時に左右中央にするため**/
	text-align: center; /**fixedにした時に左右中央にするため**/
	z-index: 999;
}
	
.header_contact{
	display: inline-block; /**fixedにした時に左右中央にするため**/
}

.header_contact p{
	float: left;
	padding: 0 5px;
	width: 45%;
}

h1 {
	/*margin-top: 5px;*/
	padding-left: 10px;
	padding-top: 10px;
	font-size: 30px;
	line-height: 1;
}

h1 a {
	text-decoration: none;
	color: #003399;
}

h1 a:hover { opacity: 1; }

/*開閉ボタン*/
#nav_toggle{
	display: block;
	width: 30px;
	height: 30px;
	position: absolute;
	top: 30px;
	right: 20px;
	/*z-index: 100;*/
}

#nav_toggle div {
	position: relative;
}

#nav_toggle span{
	display: block;
	height: 3px;
	background: #003;
	position:absolute;
	width: 100%;
	left: 0;
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;	
}

#nav_toggle span:nth-child(1){
	top:0px;
}

#nav_toggle span:nth-child(2){
	top:12px;
}

#nav_toggle span:nth-child(3){
	top:24px;
}
	
/*開閉ボタンopen時*/
.open #nav_toggle span:nth-child(1) {
	top: 12px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	transform: rotate(135deg);
}

.open #nav_toggle span:nth-child(2) {
	width: 0;
	left: 50%;
}

.open #nav_toggle span:nth-child(3) {
	top: 12px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){

	}
	
		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1080px){
		header {
			padding-bottom: 10px;
		}
		
		.inner_header {
			width: 1200px;
		}
		
		header h1 {
			/*margin-top: -8px;*/
			/*float: left;
			width: 45%;
			padding-left: 0;*/
			font-size: 36px;
			/*z-index: 999;*/
		}

		.header_contact_wrap{
			width: 50%;
			position: absolute;
			top: 0;
			right: 0;
			/*z-index: auto;*/
			text-align: right;
		}

		.header_contact p{
			width: auto;
			/*background-color: #003399;*/
			margin-left: 10px;
		}
		
		#nav_toggle{
			display: none;
		}
		}
	
/*-----------------------------
Gloval navigation
-----------------------------*/
nav{
	display: none;
	position: absolute;
	top:72px;
	width: 100%;
	background: #003399;
	left: 0;
	z-index: 100;
}

nav ul{
	display: block;
	margin: 0 auto;
}

nav ul li{
	/*margin: 0 auto;*/
	/*border-bottom: 1px solid #fff;*/
	text-align: center;
	list-style: none;
	letter-spacing: 2px;
	font-weight: bold;
}
	
nav ul li a{
	display: block;
	/*width: 100%;*/
	text-decoration: none;
	color: #fff;
	border-bottom: 1px solid #fff;
	padding: 5px 0;
}
 

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){

	}

		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1080px){
	
		nav {
			display: block;
			position: static;
			top: 0;
			/*float: right;
			width: 55%;*/
			background: none;
		}

		nav ul li {
			float: left;
			border-bottom: none;
			border-right: dotted 1px #999999;
			width: 15%;
			/*text-align: left;*/
		}
		
		nav ul li:first-child {
			border-left: dotted 1px #999999;
		}

		nav ul li a{
    		color: #333333;
			transition-duration: 0.8s;
			transition-property: background-color;
		}
		
		nav ul li a:hover {
			background-color: #003399;
			color: #fff;
		}

		}

/*-----------------------------
mainimg
-----------------------------*/
.inner_mainimg {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1200px){
		.inner_mainimg {
			width: 1200px;
			margin-top: 10px;
		}
		}


/*-----------------------------
top_contents
-----------------------------*/
.img_jigyo {
	width: 260px;
	margin-left: auto;
	margin-right: auto;
}

.img_jigyo a {
		transition-duration: 0.8s;
		transition-property: opacity;
	}
		
.img_jigyo a:hover {
		opacity: 0.5;
	}

.txt_jigyo {
	width: 260px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	padding: 15px;
	margin-bottom: 20px;
	font-size: 16px;
	background-color: #eef4f9;
}

.company_info {
	background-color: #E3DDDC;
	padding: 60px 0;
}

.btn_top_company a {
	display: block;
	margin-bottom: 10px;
}
	
	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.box_top_01 {
		width: 520px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.img_jigyo {
		float: left;
		height: 195px;
	}
	
	.txt_jigyo {
		float: left;
		height: 195px;
		line-height: 1.7;
	}

	.btn_top_company a {
		display: inline;
		padding-right: 10px;
	}
	}
	
		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1080px){
		.txt_top_company {
			box-sizing: border-box;
			padding-right: 20px;
		}
		}

/*-----------------------------
footer
-----------------------------*/

footer {
	background-color: #003399;
}

.footer_nav {
	display: none;
}

.copyright {
	color: #fff;
	text-align: center;
	font-size: 14px;
	padding: 5px 0;
}

		/*PC向けおよび大型PCレイアウトの指定*/
		@media only screen and (min-width:1080px){
		footer {
			text-align: center;
			padding: 30px 0 20px 0;
		}
		
		.footer_nav {
			display: block;
			list-style: none;
		}
		
		.footer_nav li {
			display: inline;
			border-left: solid 1px #fff;
		}
		
		.footer_nav li:first-child {
			border-left: none;
		}
		
		
		.footer_nav a {
			padding: 20px;
			color: #fff;
			text-decoration: none;
		}
		}

/*-----------
totopボタン
-------------*/

#totop {
	position: fixed;
	bottom: 100px;
	right: 0px;
	height: auto;
	opacity: 0.7;
	z-index: 999;
}

/*-----------------------------
他ページcommon
-----------------------------*/

.contents {
	min-height: 300px;
}

.ttl_level2 {
	background: url(../images/bg_ttl_02.jpg) repeat-x center center;
	padding: 30px 0;
	color: #fff;
	font-size: 24px;
	text-align: center;
	letter-spacing: 5px;
	margin-top: 10px;
	margin-bottom: 60px;
}

.ttl_level3 {
	border-left: 10px solid #003399;
	padding-left: 5px;
	font-size:24px;
	line-height: 1.3;
}

/*-----------------------------
仕事の流れ
-----------------------------*/

.flow_01 {
	padding: 20px;
	background-color: #F2F9FF;
	border: solid 2px #003399;
	list-style: none;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px) {
	.flow_01 {
		width: 70%;
		margin-left: auto;
		margin-right: auto;
	}
	}


/*-----------------------------
会社概要
-----------------------------*/

.table_company01 {
	width: 100%;
	border-collapse:collapse;
    border-spacing:0;
}

.table_company01 tr th {
	background-color: #EAEAEA;
}

.table_company01 tr th, .table_company01 tr td {
	display: block;
	padding: 10px;
	vertical-align: top;
	text-align: left;
}

.table_company01 tr td {
	/*border-bottom: solid 1px;*/
	text-align: left;
}

.map {
	position: relative;
	padding-bottom: 50%;
	height: 0;
	overflow: hidden;
}

.map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height:100% !important;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:769px){
	
	.table_company01 tr th, .table_company01 tr td{
		display: table-cell;
		padding: 10px;
	}

	.table_company01 tr th {
		border: solid 1px;
		white-space: nowrap;
	}

	.table_company01 tr td {
		width: auto;
		border: solid 1px;
	}
	}

		/*PC向けおよび大型PCの指定*/
		@media only screen and (min-width:1080px){
		.table_company01 {
			width: 80%;
			margin-left: auto;
			margin-right: auto;		
		}

		.map_google {
			width: 69%;
			float: left;
		}
		
		.map_detail {
			width: 29%;
			float: right;
		}
		.access {
			float: left;
			margin-right: 20px;
		}
}

/*-----------------------------
設備
-----------------------------*/
.scroll {
	overflow: auto;
	white-space: nowrap;
}

.scroll:-webkit-scrollbar {
	height: 5px;
}

.scroll:-webkit-scrollbar-track {
	background: #F6F6F6;
}

.scroll:-webkit-scrollbar-thumb {
	background: #C2C2C2;
}

.machinery01 {
	width: 100%;
	/*border: solid 1px #000;*/
	border-collapse:collapse;
    border-spacing:0;
}

.machinery01 tr th, .machinery01 tr td {
	border: solid 1px #003399;
	padding: 5px 10px;
	font-size: 16px;
	white-space: nowrap;
}

.machinery01 tr th {
	background-color: #E0E0E0;
	line-height: 1.5;
}




/*-----------------------------
お問い合わせ
-----------------------------*/

input[type="text"], textarea {
    width: 100%;
	height: 24px;
	font-size: 16px;
}

textarea {
	height: auto;
}


.form_wrap {
	padding: 20px;
	border-bottom: solid 1px #999;
}

.form_wrap p {
	font-weight: bold;
	color: #003399;
}

.form_submit {
	text-align: center;
}

.form_submit input {		
	background-color: #003399;
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	font-size: 16px;
	color: #fff;
}

.form_submit input:hover {
	opacity: 0.7;
}

.error {
	color: red;
}

		/*PC向けおよび大型PCの指定*/
		@media only screen and (min-width:1080px) {
		.form_wrap p {
			float: left;
			width: 200px;
		}
		
		.form_item {
			float: right;
			width: 600px;
		}
		}
