@charset "utf-8";
/*------------------------------*/
/* メインヘッダー画像 */
.header_image_box {
	height:600px;
	position:relative;
	overflow: hidden;
}
.header_image_box_inner {
	background-image:url('/image/concept_header_image_01.jpg');
	background-size:cover;
	background-position:center;
	height:600px;
	transform:scale(1.1);
	-webkit-transform: scale(1.1);
	opacity:0;
}

/* ヘッダー画像内テキスト枠 */
.header_box_title {
	text-align:center;
	position:absolute;
	top:30%;
	left:10%;
	font-weight: bold;
	color:#ffffff;
	transition:0.5s;
	min-width:300px;
}

/* タブレット */
@media only screen and (max-width:767px) {
	.header_image_box {
			height:400px;
	}
	.header_box_title {
		left:50%;
		-webkit-transform:translateX(-50%); /* Safari用 */
		transform:translateX(-50%);
	}
}

/*------------------------------*/

/* 右配置枠 */
.concept_box {
	position:relative;
	min-height:540px;
}

/*------------------------------*/
/* グレー枠 */
.left_gray_box {
	width:80%;
	background-color:#ececec;
	padding:10px 20px;
	font-size:50px;
	font-weight:bold;
	color:#ffffff;
	position:absolute;
	top:0px;
	left:20px;
	height:300px;
}

/* 青枠 1 */
.left_blue_box_frame_01 {
	width:50%;
	border:1px solid #004093;
	position:absolute;
	top:110px;
	left:5%;
	height:300px;

}

/* 青枠 2 */
.left_blue_box_frame_02 {
	width:55%;
	border:1px solid #004093;
	position:absolute;
	top:260px;
	right:10%;
	height:280px;

}

/* 青背景 */
.left_blue_box_bg_01 {
	width:55%;
	background-color:#004093;
	position:absolute;
	top:90px;
	right:20px;
	height:400px;
}

/* 写真枠 */
.left_photo_01 {
	width:55%;
	background-image:url('/image/concept_photo_01.jpg');
	background-size:cover;
	background-position:center;
	position:absolute;
	top:70px;
	right:0px;
	height:400px;
}

/* テキスト枠 */
.left_text_box_01 {
	width:50%;
	background-color:#ffffff;
	box-shadow: 2px 2px 10px #333333;
	position:absolute;
	top:140px;
	left:0px;
	min-height:300px;
	overflow:hidden;
	padding-bottom:40px;
	background-image:url('/image/left_text_box_bg_icon');
	background-repeat:no-repeat;
	background-position:right bottom;
}

/*------------------------------*/
/* グレー枠 */
.right_gray_box {
	width:80%;
	background-color:#ececec;
	padding:10px 20px;
	font-size:50px;
	font-weight:bold;
	color:#ffffff;
	position:absolute;
	top:0px;
	right:20px;
	height:300px;
}

/* 青枠 1 */
.right_blue_box_frame_01 {
	width:50%;
	border:1px solid #004093;
	position:absolute;
	top:110px;
	right:5%;
	height:300px;

}

/* 青枠 2 */
.right_blue_box_frame_02 {
	width:55%;
	border:1px solid #004093;
	position:absolute;
	top:260px;
	left:10%;
	height:280px;

}

/* 青背景 */
.right_blue_box_bg_01 {
	width:55%;
	background-color:#004093;
	position:absolute;
	top:90px;
	left:20px;
	height:400px;
}

/* 写真枠 */
.right_photo_01 {
	width:55%;
	background-image:url('/image/concept_photo_01.jpg');
	background-size:cover;
	background-position:center;
	position:absolute;
	top:70px;
	left:0px;
	height:400px;
}

/* テキスト枠 */
.right_text_box_01 {
	width:50%;
	background-color:#ffffff;
	box-shadow: 2px 2px 10px #333333;
	position:absolute;
	top:140px;
	right:0px;
	min-height:300px;
	overflow:hidden;
	padding-bottom:40px;
	background-image:url('/image/right_text_box_bg_icon');
	background-repeat:no-repeat;
	background-position:left bottom;
}

/*------------------------------*/
/* テキスト枠内の線 */
.text_box_under {
	height:10px;
	border-top:1px solid #004093;
	border-right:1px solid #004093;
	transform:skewX(-45deg) translateX(-40px);
	-webkit-transform:skewX(-45deg) translateX(-40px);
	margin-bottom:10px
}

/*------------------------------*/
/* タブレット */
@media only screen and (max-width:767px) {

	.left_text_box_01, .right_text_box_01 {
		width:96%;
		top:400px;
		left:2%;
	}
	.left_photo_01, .right_photo_01 {
		width:100%;
	}
	.left_blue_box_bg_01, .eight_blue_box_bg_01 {
		width:100%;
	}
	.left_gray_box, .right_gray_box {
		width:95%;
		font-size:30px;
	}
	.concept_box {
		min-height:850px;
	}

}