﻿@charset "utf-8";
/*--京common.css--*/
/* ##########PC########## */
.page_nav{
	margin:2em 0 3em 0;
}

/*スマホ用は非表示*/
.page_nav_sp{
	display:none;
}

	.page_nav ul{
		display:flex;
		justify-content:center;
	}
	
		.page_nav ul li{
			border-right:1px solid #cbcbcb;
			padding:0 1.5em;
		}
		
		.page_nav ul li:first-child{
			border-left:1px solid #cbcbcb;
		}
		
			.page_nav ul li a{
				display:block;
				text-decoration:none;
				color:#555;
				padding:0.5em 0;
			}
			
			.page_nav ul li.active a{
				color:#001a85;
				font-weight:bold;
			}
			
			.page_nav ul li a:hover{
				text-decoration:underline;
			}
			
			
		
.page_title{
	width:980px;
	height:60px;
	margin:0 auto 3em auto;
	border:1px solid #ccc;
	background:#fff;
	position:relative;
	z-index:0;
	box-sizing:border-box;
	padding:20px 0 0 20px;
	border-radius:3px;
	overflow:hidden;
	box-shadow:0 5px 3px -3px rgba(0,0,0,0.1);
}

	.page_title h3{
		font-size:1.5em;
		position:relative;
		z-index:2;
	}
	
	.page_title:before{
		content:"";
		display:block;
		width:100%;
		height:50%;
		position:absolute;
		bottom:0;
		left:0;
		z-index:1;
		background:rgba(0,110,241,0.05);
	}
	

.page_body{
	width:980px;
	margin:0 auto;
}

/*インデックス*/
.index_intro_box{
	background-image:url(../../shared/company/bg_index_intro.jpg);
	background-repeat:no-repeat;
	background-position:center bottom;
	height:560px;
	box-sizing:border-box;
	padding-top:80px;
	margin-bottom:80px;
}

	.index_intro_box > .box_header{
		margin-bottom:40px;
	}
	
		.index_intro_box > .box_header h3{
			text-align:center;
		}
	
	.index_intro_box > .box_inner{
		display:flex;
		justify-content:center;
		margin-bottom:15px;
	}
	
		.index_intro_box > .box_inner p{
			width:760px;
			font-size:1.05em;
			line-height:1.9;
		}
	
	.index_intro_box > .box_footer{
		text-align:center;
	}
	
.index_intro_sp_box{
	display:none;
}
	
.index_page_nav{
	margin-bottom:60px;
}

	.index_page_nav > .box_header{
		margin-bottom:50px;
		text-align:center;
	}
	
		.index_page_nav > .box_header h3{
			font-size:1.9em;
			margin-bottom:1.1em;
		}
		
		.index_page_nav > .box_header p{
			font-size:1.2em;
			line-height:1.9;
		}

	.index_page_nav ul{
		display:flex;
		justify-content:center;
	}
	
		.index_page_nav ul li{
			margin-right:50px;
		}
		
		.index_page_nav ul li:last-child{
			margin-right:0;
		}
		
			.index_page_nav ul li a{
				display:block;
				text-decoration:none;
				padding:10px;
				transition:.3s all ease;
			}
			
			.index_page_nav ul li a span{
				display:block;
				text-align:center;
			}
			
			.index_page_nav ul li a .img_nav{
				margin-bottom:0.8em;
				transition:.3s all ease;
			}
			
			.index_page_nav ul li a:hover .img_nav{
				opacity:0.8;
			}
			
			.index_page_nav ul li a .lbl_nav{
				color:#011882;
				font-size:1.2em;
				padding-top:0.8em;
			}
			
.index_activity_nav{
	background-color: #e6f0fc;
	background-image: url(../../shared/products/bg_product_detail_start_box.png);
	padding: 60px 0;
}

	.index_activity_nav > .box_header{
		text-align:center;
		margin-bottom:2.5em;
	}
	
		.index_activity_nav > .box_header h3{
			font-size: 1.9em;
			font-weight: bold;
			color: #004E93;
			letter-spacing:0.1em;
			margin-bottom:0.8em;
		}
		
		.index_activity_nav > .box_header p{
			font-size:1.15em;
			line-height:1.8;
		}
		
	.index_activity_nav > .box_inner{}
	
		.index_activity_nav > .box_inner ul{
			display:flex;
			justify-content:center;
		}
		
		.index_activity_nav > .box_inner ul li{
			width:400px;
			margin-right:50px;
		}
		
		.index_activity_nav > .box_inner ul li:last-child{
			margin-right:0;
		}		
		
		.index_activity_nav > .box_inner ul li a{
			display:block;
			background:#fff;
			color:#111;
			text-decoration:none;
			box-sizing:border-box;
			padding:20px;
			width:100%;
			height:100%;
			box-shadow:0 0 5px 5px rgba(0,0,0,0.05);
			border:2px solid rgba(0,78,147,0);
			transition:.3s all ease;
		}
		
		.index_activity_nav > .box_inner ul li a:hover{
			box-shadow:0 0 5px 5px rgba(0,0,0,0.1);
			border:2px solid rgba(0,78,147,0.5);
		}
		
			.index_activity_nav > .box_inner ul li a .fig_activity,
			.index_activity_nav > .box_inner ul li a .exp_activity{
				display:block;
			}
			
			.index_activity_nav > .box_inner ul li a .fig_activity{
				text-align:center;
				margin-bottom:1em;
			}
			
			.index_activity_nav > .box_inner ul li a .exp_activity{
				font-size:1.1em;
				line-height:1.7;
				padding:0.7em 0.5em 0 0.5em;
				border-top:1px dotted #aaa;
			}
		

/*トップメッセージ*/
.page_body.top_msg_box{
	width:850px;
}

	.top_msg_box > .box_header{
		margin:0 0 2em;
	}
	
		.top_msg_box > .box_header h4{
			color:#004f94;
			font-size:1.4em;
		}

	.top_msg_box > .box_inner{
		line-height:1.8;
		font-size:1.1em;
		margin-bottom:2em;
	}
	
		.top_msg_box > .box_inner p{
			margin-bottom:1em;
		}
		
		.top_msg_box > .box_inner p:last-child{
			margin-bottom:0;
		}
		
	.top_msg_box > .box_footer{
		line-height:1.8;
		font-size:1.1em;
		padding:0 2em;
		text-align:right;
	}


/*会社概要*/
.outline_box{
	margin-bottom:5em;
}

	.outline_box > .box_header{
		margin-bottom:3em;
	}
	
		.outline_box > .box_header .bld_img{
			text-align:center;
		}
		
	.outline_box > .box_inner{}
	
		.outline_box > .box_inner dl{
			display:flex;
			flex-wrap:wrap;
			width:840px;
			margin:0 auto;
			font-size:1.05em;
			line-height:1.6;
		}
		
			.outline_box > .box_inner dl dt,
			.outline_box > .box_inner dl dd{
				padding:0.8em 0;
				border-bottom:1px solid #ddd;
			}
		
			.outline_box > .box_inner dl dt{
				width:150px;
			}
			
			.outline_box > .box_inner dl dd{
				width:calc(100% - 150px);
			}
			
.access_box{
	width:840px;
	margin:0 auto;
}

	.access_box > .box_inner{
		position:relative;
	}
	
		.access_box > .box_inner .info_kumamoto{
			display:flex;
			justify-content:space-between;
			position:relative;
		}
		
		.access_box > .box_inner .info_tokyo{
			position:absolute;
			bottom:0;
			left:0;
		}
	
		.access_box > .box_inner .access_text{
			width:400px;
			font-size:1.1em;
		}
		
			.access_box > .box_inner .access_text h4{
				font-size: 1.2em;
				font-weight: bold;
				color: #333;
				position: relative;
				margin: 0 0 0.8em 0;
				padding-left: 1em;
				line-height: 1.4;
			}
			
			.access_box > .box_inner .access_text h4:before{
				content: "";
				display: inline-block;
				height: 90%;
				width: 0;
				border-left:6px solid #004E93;
				position: absolute;
				top: 0;
				left: 0;
			}
			
			.access_box > .box_inner .access_text dl.access_addr{
				padding-left:1em;
				line-height:1.4;
				display:flex;
				flex-wrap:wrap;
				margin-bottom:2em;
			}
			
				.access_box > .box_inner .access_text dl.access_addr dt,
				.access_box > .box_inner .access_text dl.access_addr dd{
					margin-bottom:0.8em;
				}
			
				.access_box > .box_inner .access_text dl.access_addr dt{
					width:4.5em;
				}
				
				.access_box > .box_inner .access_text dl.access_addr dd{
					width:calc(100% - 4.5em);
				}
	
		.access_box > .box_inner .access_time{
			padding-left:1em;
		}
		
			.access_box > .box_inner .access_time h5{
				border-bottom:1px dotted #aaa;
				padding:0 0 0.3em 0.3em;
				margin-bottom:1em;
			}
			
			.access_box > .box_inner .access_time h5:before{
				font-family: FontAwesome;
				content:"\f041";
				font-weight:normal;
				color:#ea4249;
				margin-right:0.4em;
			}
		
			.access_box > .box_inner .access_time ul{}
			
				.access_box > .box_inner .access_time ul li{
					margin-bottom:1em;
				}
				
				.access_box > .box_inner .access_time ul li:before{
					font-family: FontAwesome;
					content:"\f105";
					margin-right:0.4em;
				}
				
		.access_box > .box_inner .photo_map{
			width:400px;
		}
		
			.access_box > .box_inner .photo_map .bld_img{
				margin-bottom:20px;
			}
		
/*沿革*/
.page_body.history{
	width:100%;
	margin:0;
	background-color: #e6f0fc;
	background-image: url(../../shared/bg_slanting.png);
	padding: 60px 0 40px 0;
}

.history_box{
	margin:0 auto 4em auto;
	width:900px;
	background:#fff;
	box-sizing:border-box;
	padding:30px;
}

	.history_box > .box_header{
		margin-bottom:1em;
	}
	
		.history_box > .box_header h3{
			font-size: 1.4em;
			font-weight: bold;
			color: #004E93;
			position: relative;
			padding-left:0.8em;
			line-height:1.4;
		}
		
		.history_box > .box_header h3:before{
			content: "";
			display: inline-block;
			height: 95%;
			width: 0;
			border-left:6px solid #004E93;
			position: absolute;
			top: 0;
			left: 0;
		}
	
	.history_box > .box_inner{
		padding:1em 1em 0 1em;
		line-height:1.6;
	}
	
		.history_box > .box_inner dl{
			display:flex;
			flex-wrap:wrap;
			border-bottom:1px solid #ddd;
		}
		
			.history_box > .box_inner dl dt,
			.history_box > .box_inner dl dd{
				padding:0.6em 0;
			}
		
			.history_box > .box_inner dl dt{
				width:10em;
				box-sizing:border-box;
				padding-left:0.5em;
			}
			
			.history_box > .box_inner dl dd{
				width:calc(100% - 10em);
				box-sizing:border-box;
				padding-right:0.5em;
			}
			
				.history_box > .box_inner dl dd .image_box{
					padding:0.5em 0 0 0.5em;
				}
			
				.history_box > .box_inner dl dd .image_box img{
					width:200px;
					height:auto;
				}
				
				/*縦長画像用*/
				.history_box > .box_inner dl dd .image_box img.portrait{
					width:auto;
					height:150px;
				}
				
				/*複数個*/
				.history_box > .box_inner dl dd .image_box ul{
					display:flex;
					align-items:center;
				}
				
					.history_box > .box_inner dl dd .image_box ul li{
						margin-right:10px;
					}
					
					.history_box > .box_inner dl dd .image_box ul li:last-child{
						margin-right:0;
					}
			
/*AIMの取り組み*/
.activity_box{}

	.activity_box > .box_header{
		text-align:center;
		margin-bottom:2em;
	}
	
		.activity_box > .box_header p{
			color:#008740;
			font-size:1.4em;
			line-height:1.8;
		}
	
	.activity_box > .box_inner{}
	
		.activity_box > .box_inner ul{
			display:flex;
			padding:0 20px;
		}
		
			.activity_box > .box_inner ul li{
				width:calc((100% - 50px) / 2);
				margin:0 50px 0 0;
			}
			
			.activity_box > .box_inner ul li:nth-child(even){
				margin:0;
			}
			
				.activity_box > .box_inner ul li a{
					display:block;
					padding:20px;
					height:100%;
					box-sizing:border-box;
					border:1px solid #ccc;
					text-decoration:none;
					color:#222;
					box-shadow:5px 5px 0 0 rgba(0,79,148,0.2);
				}
				
					.activity_box > .box_inner ul li a .fig_activity{
						display:block;
						margin-bottom:1em;
						text-align:center;
					}
					
					.activity_box > .box_inner ul li a dl{
						border-top:1px dotted #aaa;
						padding:1.4em 0.5em 0 0.5em;
					}
					
					.activity_box > .box_inner ul li a dl dt{
						font-size:1.2em;
						font-weight:bold;
						margin-bottom:0.8em;
						text-align:center;
					}
					.activity_box > .box_inner ul li a dl dd{
						line-height:1.8;
						font-size:1.1em;
					}
					
/*一覧に戻る*/
.backto_index{
	text-align:center;
	margin-top:5em;
	font-size:1.1em;
}

	.backto_index a{
		display:inline-block;
		border:1px solid rgba(0,80,150,0.3);
		color:#111;
		text-decoration:none;
		padding:0.6em 1.5em 0.5em 1.5em;
		transition:.3s all ease;
	}
	
	.backto_index a:hover{
		border:1px solid rgba(0,80,150,0.5);
		background:rgba(0,80,150,0.1);
	}


/* ##########SP########## */
@media screen and (max-width:479px) {
	/*スマホでは.page_navは非表示とし、複製した.page_nav_spを使用*/
	.page_nav{
		display:none;
	}
	
	.page_nav_sp{
		display:block;
		margin:10vw 5vw 0 5vw;
	}
	
	.page_nav_sp ul{}
	
		.page_nav_sp ul li{
			margin-bottom:1px;
		}
		
		.page_nav_sp ul li:last-child{
			margin-bottom:0;
		}
		
			.page_nav_sp ul li a{
				display:block;
				text-decoration:none;
				color:#333;
				padding:0.8em 0.5em;
				background:#efefef;
			}
			
			.page_nav_sp ul li.active a{
				color:#001a85;
				background:#e6f0fc;
				font-weight:bold;
			}
			
			.page_nav_sp ul li a:hover{
				background:#e6f0fc;
			}
				
			
	.page_title{
		width:calc(100% - 6vw);
		margin:0 auto 2em auto;
		padding:2.4vw 2vw 2vw 2vw;
		height:auto;
	}
	
		.page_title h3{
			font-size:1.2em;
			line-height:1.3;
		}
	
	.page_body{
		width:auto;
		margin:0;
		padding:0 3vw;
	}
	
	/*インデックス*/
	.index_intro_box{
		background-size:cover;
		height:45vw;
		padding-top:8vw;
		margin-bottom:4vw;
	}
	
		.index_intro_box > .box_header{
			padding:0 3vw;
			margin-bottom:1.5em;
		}
		
			.index_intro_box > .box_header h3{}
			
				.index_intro_box > .box_header h3 img{
					max-width:100%;
					height:auto;
				}
	
		.index_intro_box > .box_inner{
			display:none;
		}
		
		.index_intro_box > .box_footer img{
			width:50%;
			height:auto;
		}
	
	.index_intro_sp_box{
		display:block;
		padding:0 5vw;
		margin-bottom:2em;
		line-height:1.6;
	}
	
		
	.index_page_nav{
		margin-bottom:3vw;
	}
	
		.index_page_nav > .box_header{
			margin-bottom:6vw;
		}
		
			.index_page_nav > .box_header h3{
				font-size:5vw;
				margin-bottom:1em;
				line-height:1.6;
			}
			
			.index_page_nav > .box_header p{
				padding:0 4vw;
				font-size:1em;
				line-height:1.6;
			}
	
		.index_page_nav ul{
			flex-wrap:wrap;
			padding:0 5vw;
		}
		
			.index_page_nav ul li{
				margin-right:5vw;
				width:calc((100% - 5vw) / 2);
				margin-bottom:5vw;
			}
			
			.index_page_nav ul li:nth-child(2n),
			.index_page_nav ul li:last-child{
				margin-right:0;
			}
			
				.index_page_nav ul li a{
					padding:0;
				}
				
				.index_page_nav ul li a .img_nav{
					margin-bottom:3vw;
				}
				
					.index_page_nav ul li a .img_nav img{
						max-width:100%;
						height:auto;
					}
				
				.index_page_nav ul li a .lbl_nav{
					padding-top:0;
					font-size:1.1em;
				}
				
	.index_activity_nav{
		padding: 10vw 0;
	}
	
		.index_activity_nav > .box_header{
			margin-bottom:2em;
		}
		
			.index_activity_nav > .box_header h3{
				font-size: 5vw;
			}
			
			.index_activity_nav > .box_header p{
				font-size:1em;
				line-height:1.6;
			}
			
			.index_activity_nav > .box_inner ul{
				display:block;
			}
			
			.index_activity_nav > .box_inner ul li{
				width:92%;
				margin:0 auto 4vw auto;
			}
			
			.index_activity_nav > .box_inner ul li:last-child{
				margin:0 auto;
			}		
			
			.index_activity_nav > .box_inner ul li a{
				display:flex;
				padding:3vw;
			}
			
				
				.index_activity_nav > .box_inner ul li a .fig_activity{
					margin-bottom:0;
					width:30%;
				}
				
					.index_activity_nav > .box_inner ul li a .fig_activity img{
						max-width:100%;
						height:auto;
					}
				
				.index_activity_nav > .box_inner ul li a .exp_activity{
					width:70%;
					box-sizing:border-box;
					font-size:1em;
					line-height:1.6;
					padding:0 0 0 0.5em;
					border-top:none;
				}
	
	/*トップメッセージ*/
	.page_body.top_msg_box{
		width:100%;
		padding:0 4vw;
		box-sizing:border-box;
	}
	
		.top_msg_box > .box_header{
			margin:0 0 2em 0;
		}
		
			.top_msg_box > .box_header h4{
				font-size:4.4vw;
				line-height:1.5;
				text-align:center;
			}
	
		.top_msg_box > .box_inner{
			line-height:1.6;
			font-size:1em;
			padding:0 2vw;
			margin-bottom:1.5em;
		}
		
			.top_msg_box > .box_inner p{
				margin-bottom:0.8em;
			}
			
			.top_msg_box > .box_inner p:last-child{
				margin-bottom:0;
			}
			
		.top_msg_box > .box_footer{
			line-height:1.6;
			font-size:1em;
			padding:0 2vw 0 0;
		}
	
	
	/*会社概要*/
	.outline_box{
		margin-bottom:3em;
	}
	
		.outline_box > .box_inner{
			margin:0 2vw;
		}
	
		.outline_box > .box_inner dl{
			width:100%;
			margin:0;
			font-size:1em;
		}
			
				.outline_box > .box_inner dl dt,
				.outline_box > .box_inner dl dd{
					padding:0.6em 0;
				}
			
				.outline_box > .box_inner dl dt{
					width:5.5em;
				}
				
				.outline_box > .box_inner dl dd{
					width:calc(100% - 5.5em);
				}
				
	.access_box{
		width:100%;
		margin:0;
	}
	
		.access_box > .box_inner .info_kumamoto{
			display:block;
		}
		
		.access_box > .box_inner .info_tokyo{
			position:relative;
			margin-top:6vw;
			bottom:auto;
			left:auto;
		}
		
			.access_box > .box_inner .access_text{
				width:100%;
				font-size:1em;
			}
			
				.access_box > .box_inner .access_text h4{
					padding-left: 0.8em;
				}
				
				.access_box > .box_inner .access_text dl.access_addr{
					padding:0 3vw;
					line-height:1.4;
					display:flex;
					flex-wrap:wrap;
					margin-bottom:2em;
				}
				
					.access_box > .box_inner .access_text dl.access_addr dt,
					.access_box > .box_inner .access_text dl.access_addr dd{
						margin-bottom:0.8em;
					}
				
					.access_box > .box_inner .access_text dl.access_addr dt{
						width:4.5em;
					}
					
					.access_box > .box_inner .access_text dl.access_addr dd{
						width:calc(100% - 4.5em);
					}
		
			.access_box > .box_inner .access_time{
				padding:0 3vw;
			}
			
			.access_box > .box_inner .photo_map{
				width:100%;
			}
			
				.access_box > .box_inner .photo_map .bld_img{
					margin-bottom:5vw;
				}
				
					.access_box > .box_inner .photo_map .bld_img img{
						max-width:100%;
						height:auto;
					}
					
				.access_box > .box_inner .photo_map .access_map iframe{
					width:100%;
					height:60vw;
				}
			
	/*沿革*/
	.page_body.history{
		padding: 6vw 3vw;
		box-sizing:border-box;
	}
	
	.history_box{
		margin:0 auto 5vw auto;
		width:100%;
		padding:3vw;
	}
	
		.history_box > .box_header{
			margin-bottom:0.5em;
		}
		
			.history_box > .box_header h3{
				font-size: 4.4vw;
			}
			
		.history_box > .box_inner{
			padding:0 1vw;
		}
		
			.history_box > .box_inner dl{
				display:block;
			}
			
				.history_box > .box_inner dl dt,
				.history_box > .box_inner dl dd{
					padding:0;
				}
			
				.history_box > .box_inner dl dt{
					width:100%;
					padding-left:0;
					border-bottom:none;
				}
				
					.history_box > .box_inner dl dt:before{
						font-family: FontAwesome;
						content:"\f0da";
						margin-right:0.4em;
						color:rgba(0,110,241,0.5);
					}
				
				.history_box > .box_inner dl dd{
					width:100%;
					padding:0 2vw 2vw 2.5vw;
					margin-bottom:2vw;
				}
				
					.history_box > .box_inner dl dd .image_box img{
						width:28vw;
					}
					
					/*縦長画像用*/
					.history_box > .box_inner dl dd .image_box img.portrait{
						height:26vw;
					}
					
					/*複数個*/
						.history_box > .box_inner dl dd .image_box ul li{
							margin-right:2vw;
						}
						
						.history_box > .box_inner dl dd .image_box ul li:last-child{
							margin-right:0;
						}
				
	/*AIMの取り組み*/
	.activity_box > .box_header p{
		font-size:4.4vw;
		line-height:1.6;
	}
		
			.activity_box > .box_inner ul{
				display:block;
				padding:0 3vw;
			}
			
				.activity_box > .box_inner ul li{
					width:100%;
					margin:0 0 5vw 0;
				}
				
					.activity_box > .box_inner ul li a{
						padding:4vw;
						height:100%;
						box-shadow:1.5vw 1.5vw 0 0 rgba(0,79,148,0.2);
					}
						/*画像入れてから調整↓*/
						.activity_box > .box_inner ul li a .fig_activity{
							display:block;
							margin-bottom:1em;
						}
						/*画像入れてから調整↑*/
						
					.activity_box > .box_inner ul li a dl dd{
						font-size:1em;
						line-height:1.6;
					}
					
	/*一覧に戻る*/
	.backto_index{
		margin-top:3em;
		font-size:1em;
	}
	
}

/* ##########印刷用########## */
@media print{

}

/*IEの印刷用調整*/
@media print and (-ms-high-contrast: none){
	.history_box > .box_inner dl{
		display:table-row;
		clear:both;

	}
	
		.history_box > .box_inner dl dt{
			display:table-cell;
			border-bottom:1px solid #ccc;
		}
		
		.history_box > .box_inner dl dd{
			display:table-cell;
			border-bottom:1px solid #ccc;
		}
		
			.history_box > .box_inner dl dd .image_box ul{
				display:block;
			}
			
				.history_box > .box_inner dl dd .image_box ul li{
					float:left;
				}
}

/*Edgeの印刷用調整*/
@media print{
	@supports (-ms-ime-align:auto) {
		.history_box > .box_inner dl{
			display:table-row;
			clear:both;
		}
		
			.history_box > .box_inner dl dt{
				display:table-cell;
				border-bottom:1px solid #ccc;
			}
			
			.history_box > .box_inner dl dd{
				display:table-cell;
				border-bottom:1px solid #ccc;
			}
			
			.history_box > .box_inner dl dd .image_box ul{
				display:block;
			}
			
				.history_box > .box_inner dl dd .image_box ul li{
					float:left;
				}
	}
}
