@charset "utf-8";


*{
	padding: 0;
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.35;
}
body{
	background: rgb(253, 253, 255);
}
.hidden{
	display: none;
	width: 0;
	height: 0;
}



/********************
 * default
 ********************/
/**
body{
	background: rgb(215, 236, 255);
}
**/

body > *{
	width: 1240px;
	margin: 0 auto;
}




/********************
 * common
 ********************/
#to_top{
	display: none;
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 50px;
	height: 50px;
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid rgb(25, 160, 180);
	border-radius: 50px;
	color: rgb(25, 160, 180);
	font-size: 2.00rem;
	line-height: 40px;
	text-align: center;
}
	#to_top:after{
		content: "\025b2";
	}


/********************
 * layout
 ********************/
#header{
	overflow: hidden;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
	height: 90px;

	background: rgb(20, 120, 200);
	background: -moz-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	background: -webkit-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	background: linear-gradient(to bottom,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(20, 120, 200)', endColorstr='rgb(110, 175, 225)',GradientType=0 );


	border-bottom: 1px solid rgb(220, 220, 220);
}
	#header * *{
		font-style: normal;
	}
	#header a,
	#header a *,
	#header a:hover{
		color: rgb(255, 255, 255);
		text-decoration: none;
	}
	#header > a > div{
		margin-right: auto;
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		width: auto;
		height: 60px;
		margin: 15px 20px;
	}
		#header > a > div:before{
			content: "";
			display: block;
			width: 140px;
			height: 60px;
			margin: 0 20px 0 0;
			background-image: url(../img/common/logo_header.png);
			background-repeat: no-repeat;
			background-position: 0 0;
			background-size: 90%;
		}
			#header > a > div > p > em{
				display: flex;
				flex-direction: row;
				flex-wrap: nowrap;
			}
				#header > a > div > p > em > span{
					padding-top: 0.25rem;
					font-size: 0.80rem;
				}
				#header > a > div > p > em > b{
					font-size: 1.05rem;
				}
				#header > a > div > p > strong{
					font-size: 1.70rem;
				}

	#header > ul{
		list-style-type: none;
		display: flex;
		flex-wrap: nowrap;
		width: auto;
		height: auto;
		margin: 15px 0 15px auto;
	}
		#header > ul > li > a{
			display: block;
			width: auto;
			height: 22px;
			margin: 0 20px 8px 0;
			font-size: 1.15rem;
		}

/*
#nav-test,
*/
#nav{
	position: relative;
	width: 100%;
	height: 60px;
	background: rgba(255, 255, 255, 0.85);

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

}

	#nav > ul{
		list-style-type: none;

		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		width: 1240px;
		max-width: 1240px;
		height: 60px;
		margin: 0 auto;
	}
		#nav > ul > li{
			width:  calc(100% / 7);
		}
			#nav > ul > li > a{
				overflow: hidden;
				display: block;
				width: 100%;
				height: 100%;
				text-align: center;
				text-decoration: none;
			}
				#nav > ul > li > a > span{
					overflow: hidden;
					display: block;
					width: 100%;
					height: 40px;
					padding: 0 3%;
					margin: 10px 0;
					border-left: 1px solid rgb(220, 220, 220);
					line-height: 40px;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
				#nav > ul > li > a.pg_nm_cls{
					background: linear-gradient(to bottom, rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
				}
				#nav.nav-haxpes > ul > li > a.pg_nm_cls_haxpes{
					background: linear-gradient( to bottom, rgb(225, 140, 15) 0%, rgb(235, 205, 65) 100% );
				}
					#nav > ul > li > a.pg_nm_cls > span,
					#nav.nav-haxpes > ul > li > a.pg_nm_cls_haxpes > span{
						color: rgb(255, 255, 255);
					}

			#nav > ul > li:last-child > a > span{
				border-right: 1px solid rgb(220, 220, 220);
				border-left: 1px solid rgb(220, 220, 220);
			}


/**
 * トップイメージのスライド周辺
 */
#topimage{
	z-index: 99999;
	position: relative;
	width: 100%;
	height: calc(100vh - 150px);
	margin-bottom: 30px;
}
	#topimage-msg-always{
		z-index: 999999;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		justify-content: center;
		max-width: 100%;
		height: 100%;
	}
		#topimage-msg-always > p{
			max-width: 85%;
			min-height: 1.5rem;
			margin: 15px auto;

			transform: translateY(50px);
			color: rgb(255, 255, 255);
			font-size: 2.00rem;
			font-weight: bold;
			opacity: 0;
			text-shadow: 3px 3px 8px rgba(10, 90, 170, 0.95);
		}
			#topimage-msg-always > p.toUp{
				transform: translateY(0);
				transition-duration: 1s;
				opacity: 1;
			}


		#topimage #slick-slider ul li{
			height: calc(100vh - 150px);
			max-width: 100%;
			max-height: 100%;
			margin: 0;
			background-repeat: no-repeat;
			background-size: cover;
		}


/**
 * スライドの画像ファイル設定
 */
			#topimage #slick-slider ul li.img-0{
				background-image: url(../img/index/carousel_2503/ti_0.jpg);
				background-position: center center;
			}
			#topimage #slick-slider ul li.img-1{
				background-image: url(../img/index/carousel_2503/ti_1.jpg);
				background-position: center center;
			}
			#topimage #slick-slider ul li.img-2{
				background-image: url(../img/index/carousel_2503/ti_2.jpg);
				background-position: bottom center;
			}
			#topimage #slick-slider ul li.img-3{
				background-image: url(../img/index/carousel_2503/ti_3.jpg);
				background-position: bottom center;
			}
			#topimage #slick-slider ul li.img-4{
				background-image: url(../img/index/carousel_2503/ti_4.jpg);
				background-position: bottom center;
			}


			#topimage .slick-dots{
				bottom: 4%;
				z-index: +1;
			}


main{
	max-width: 1240px;
	padding: 10px 30px 40px 30px;
	margin: 0 auto;

}



section#main > h2{
	padding: 5px;
	margin: 0 auto 20px auto;
	background: rgb(120, 190, 255);
	background: -moz-linear-gradient(
		top,
		rgb(120, 190, 255) 0%,
		rgb(95, 170, 250) 44%,
		rgb(65, 150, 240) 100%
	);
	background: -webkit-linear-gradient(
		top,
		rgb(120, 190, 255) 0%,
		rgb(95, 170, 250) 44%,
		rgb(65, 150, 240) 100%
	);
	background: linear-gradient(
		to bottom,
		rgb(120, 190, 255) 0%,
		rgb(95, 170, 250) 44%,
		rgb(65, 150, 240) 100%
	);
	filter: progid:DXImageTransform.Microsoft.gradient(
		startColorstr="rgb(120, 190, 255)",
		endColorstr="rgb(65, 150, 240)", GradientType=0
	);
	border-radius: 2px;
	box-shadow: rgba(0, 0, 0,0.2) 2px 2px 2px;

	color: rgb(255, 255, 255);
	font-family: serif;
	font-size: 1.40rem;
	font-weight: bold;
	text-indent: 0.5rem;
}


	section#main > article{
		margin-bottom: 30px;
	}








/********************
 * ユーザー向け情報　詳細部（index.php用）
 ********************/
#fr_info4uss2 > .btn_sec_sub,
#fr_info4uss a{
	overflow: hidden;
	position: relative;
	display: block;
	width: 32%;
	height: 143px;
	padding: 10px;
	margin-right: 2%;
	margin-bottom: 15px;
	border: 1px solid rgb(200, 200, 200);
	border-radius: 3px;
	color: rgb(50, 50,50);
	text-decoration: none;
}

	#fr_info4uss a p.flg_new{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 0;
		height: 0;
		margin: 0;
		border-style: solid;
		border-width: 0 0 50px 50px;
		border-color: transparent transparent rgb(220, 50, 50) transparent;
	}
		#fr_info4uss a p.flg_new:after{
			content: "New!";
			position: absolute;
			top: 25px;
			right: -1px;

			transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);

			display: block;
			width: 3em;

			color: rgb(255, 255, 255);
			font-size: 12px;
			line-height: 1.2;
			text-align: center;
		}
	#fr_info4uss a:nth-of-type(3n),
	#fr_info4uss2 > div:nth-of-type(3n){
		margin-right: 0;
	}
	#fr_info4uss a:last-child{
		margin-right: auto;
	}
	#fr_info4uss a section article{
		position: relative;
	}
	#fr_info4uss a section article time{
		position: absolute;
		bottom: -18px;
		right: 30px;
	}

p.hr{
	width: 100%;
	height: 1px;
	margin: 15px auto 30px auto;
	background: rgb(200, 200, 200);
}


/********************
 * サブページ共通　#aside（全ページ・全サイト）
 ********************/
.btn_sec_sub{
	height: 140px;
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.3) 2px 3px 3px;
}
	.btn_sec_sub a{
		overflow: hidden;
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: center;
		width: 100%;
		height: 100%;
		text-decoration: none;
	}

		.btn_sec_sub.btn_use{
			background: rgb(150, 200, 5);
		}
		.btn_sec_sub.btn_door{
			background: rgb(5, 120, 200);
		}
		.btn_sec_sub.btn_docs{
			background: rgb(5, 200, 165);
		}
			.btn_sec_sub.btn_use a strong,
			.btn_sec_sub.btn_door a strong,
			.btn_sec_sub.btn_docs a strong{
				width: 175px;
				display: flex;
				flex-direction: column;
				flex-wrap: wrap;
				justify-content: center;
				margin: auto auto;
			}
				.btn_sec_sub.btn_use a strong span,
				.btn_sec_sub.btn_door a strong span,
				.btn_sec_sub.btn_docs a strong span{
					width: 175px;
					margin: 5px auto;
					color: rgb(255, 255, 255);
					font-size: 1.30rem;
				}
					.btn_sec_sub.btn_use a strong span{
						width: 200px;
					}
				.btn_sec_sub.btn_use a strong span:nth-child(2),
				.btn_sec_sub.btn_door a strong span:nth-child(2){
					text-indent: 2.15rem;
				}
				.btn_sec_sub.btn_use a strong span:nth-child(2),
				.btn_sec_sub.btn_docs a strong span:nth-child(2){
					text-indent: 1.90rem;
				}

		.btn_sec_sub.btn_haxpes{
			background: rgb(225, 140, 15);
			background: -moz-linear-gradient(
				left,
				rgb(225, 140, 15) 0%,
				rgb(235, 205, 65) 100%
			);
			background: -webkit-linear-gradient(
				left,
				rgb(225, 140, 15) 0%,
				rgb(235, 205, 65) 100%
			);
			background: linear-gradient(
				to right,
				rgb(225, 140, 15) 0%,
				rgb(235, 205, 65) 100%
			);
			filter: progid:DXImageTransform.Microsoft.gradient(
				startColorstr="rgb(120, 190, 255)",
				endColorstr="rgb(65, 150, 240)", GradientType=0
			);
		}
			.btn_sec_sub.btn_haxpes a figure{
				width: 280px;
				display: flex;
				flex-direction: row;
				flex-wrap: nowrap;
				justify-content: center;
				margin: auto auto;
			}
				.btn_sec_sub.btn_haxpes a figure img{
					width: 100px;
					margin: 5px auto;
					color: rgb(255, 255, 255);
					font-size: 1.30rem;
				}
				.btn_sec_sub.btn_haxpes a figure figcaption{
					width: 180px;
					display: flex;
					flex-direction: column;
					flex-wrap: wrap;
					justify-content: center;
					margin: auto auto;
				}
					.btn_sec_sub.btn_haxpes a figure figcaption span{
						width: 175px;
						margin: 5px auto;
						color: rgb(255, 255, 255);
						font-size: 1.30rem;
					}
		.btn_sec_sub.btn_hq{
			background: rgb(20, 120, 200); /* Old browsers */
			background: -moz-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(to bottom,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(20, 120, 200)', endColorstr='rgb(110, 175, 225)',GradientType=0 ); /* IE6-9 */

		}
			.btn_sec_sub.btn_hq a strong{
				width: 250px;
				display: flex;
				flex-direction: column;
				flex-wrap: wrap;
				justify-content: center;
				margin: auto auto;
			}
				.btn_sec_sub.btn_hq a strong span{
					width: 250px;
					margin: 5px auto;
					color: rgb(255, 255, 255);
					font-size: 1.30rem;
				}
				.btn_sec_sub.btn_hq a strong span:nth-child(1){
					font-size: 1.00rem;
					text-align: center;
				}
				.btn_sec_sub.btn_hq a strong span:nth-child(2){
					font-size: 1.20rem;
					text-align: center;
				}






#fr_tpx > ul{
	list-style-type: none;
	width: calc(100% - 20px);
	margin-left: 20px;
}
	#fr_tpx > ul > li{
		border-bottom: 1px dotted rgb(220, 220, 220);
		height: 1.80rem;
		margin-bottom: 5px;
	}
	#fr_tpx > ul > li > a{
		overflow: hidden;
		display: block;
		width: 100%;
		height: 100%;
		color: rgb(50, 50, 50);
		font-size: 1.00rem;
		text-decoration: none;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	#fr_tpx > ul > li > a i{
		font-size: 0.85rem;
		margin-right: 8px;
		color: rgb(95, 170, 250);
	}
#fr_lnx > ul{
	list-style-type: none;
}
	#fr_lnx > ul > li{
		box-sizing: border-box;
		height: 37px;
		margin: 0 13px 10px 0;
		border: 1px solid rgb(95, 170, 250);
		border-radius: 2px;
	}
		#fr_lnx > ul > li > a{
			overflow: hidden;
			display: block;
			width: 100%;
			height: 100%;
			padding: 0 8px;
			line-height: 37px;
			text-align: center;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
		#fr_lnx > ul > li > a:hover{
			 background: rgb(95, 170, 250);
			 color: rgb(255, 255, 255);
		}


/********************
 * サブページ用　詳細記述部分
********************/
section#main > article#fr_sub{
	;
}
	section#main > article#fr_sub{
		;
	}
		section#main > article#fr_sub > section > div{
			margin-bottom: 30px;
			background: rgb(255, 255, 255);
			border: 1px solid rgb(230, 230, 230);
			border-radius: 3px;
		}
			section#main > article#fr_sub > section > div > h3{
				height: 35px;
				text-indent: 0.5rem;
				background: rgb(215, 230, 230);
				font-family: serif;
				font-size: 1.35rem;
				font-weight: bold;
				line-height: 35px;
			}
			section#main > article#fr_sub > section > div > article{
				padding: 20px 25px;
			}
				section#main > article#fr_sub > section > div > article > p{
					margin-bottom: 10px;
					line-height: 1.5;
					text-indent: 1rem;
				}
					section#main > article#fr_sub > section > div > article section.fr_subsub{
						margin: 0 0 30px 0;
					}
					section#main > article#fr_sub > section > div > article section.fr_subsub section.fr_minimum{
						padding: 20px;
						margin-bottom: 30px;
						border: 1px solid rgb(220, 220, 220);
						border-radius: 3px;
					}

/********************
 * サブページ（download.php用）
********************/
table.table{
	overflow: hidden;
	box-sizing: border-box;
	border-radius: 10px;
	box-shadow: rgba(0, 0, 0, 0.3) 2px 3px 3px;
}
table.table.tbl-download thead th,
table.table.tbl-download tbody td{
	text-align: center;
}
table.table.tbl-download thead th:nth-child(2),
table.table.tbl-download thead th:nth-child(3),
table.table.tbl-download tbody td:nth-child(2),
table.table.tbl-download tbody td:nth-child(3){
	width: 20%;
	min-width: 124px;
}

/********************
 * サブページ（facilities.php用）
********************/
table.table.tbl-facilities th{
	width: 50%;
	text-align: center;
}
table.table.tbl-facilities.tbl2 td{
	text-align: center;
}


/********************
 * サブページ（use_*.php用）
********************/
.ul-flow{
	max-width: 50%;
}
.ul-flow > li{
	margin-bottom: 0;
}
.ul-flow > li > *{
	display: block;
	text-align: center;
}
.ul-flow > li > span{
	padding: 4px;
	background: rgb(120, 190, 255);
	background: -moz-linear-gradient( top, rgba(120, 190, 255, 0.3) 0%, rgba(95, 170, 250, 0.3) 44%, rgba(65, 150, 240, 0.3) 100% );
	background: -webkit-linear-gradient( top, rgb(120, 190, 255) 0%, rgb(95, 170, 250) 44%, rgba(65, 150, 240, 0.3) 100% );
	background: linear-gradient( to bottom, rgba(120, 190, 255, 0.3) 0%, rgba(95, 170, 250, 0.3) 44%, rgba(65, 150, 240, 0.3) 100% );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="rgb(120, 190, 255)", endColorstr="rgb(65, 150, 240)", GradientType=0 );
	border: 1px solid rgb(220, 220, 220);
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 2px;
	font-size: 1.05rem;
}
.ul-flow > li > i{
	margin-bottom: 10px;
}
.ul-flow > li > span > ul{
	background: rgb(245, 245, 245);
	border-radius: 2px;
}


/********************
 * サブページ（status-report.php用）
********************/
table.table.tbl-status-report th:nth-child(1) i{
	font-size: 0.85rem;
	font-style: normal;
	font-weight: normal;
}


table.table.tbl-status-report td:nth-child(2){
	width: 50%;
	text-align: center;
	vertical-align: middle;
}


/********************
 * サブページ（status-report-20xx.php用）
********************/
table.table.tbl-status-report-20xx td:nth-child(1) ul li{
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted rgb(200, 200,200);
}
	table.table.tbl-status-report-20xx td:nth-child(1) ul li:last-child{
		padding-bottom: 0;
		margin-bottom: 0;
		border: none;
	}

table.table.tbl-status-report-20xx td:nth-child(2){
	width: 20%;
	text-align: center;
	vertical-align: middle;
}


/********************
 * サブページ（contactus.php用）
********************/
table.table.tbl-contactus th{
	width: 30%;
	font-size: 0.90rem;
	font-weight: normal;
	text-align: right;
	text-indent: 0.50rem;
	vertical-align: middle;
}
table.table.tbl-contactus tfoot td{
	padding: 20px;
	text-align: center;
}

#caution_email{
	display: none;
	color: rgb(255, 0, 0);
}

.fill:after{
	content: "";
	padding: 2px 5px;
	margin-left: 8px;
	border: 1px solid rgb(220, 220, 220);
	border-radius: 5px;
	color: rgb(255, 255, 255);
	font-size: 0.75rem;
	font-weight: normal;
}
	.fill.must:after{
		content: "必須";
		background: rgb(235, 30, 100);
	}
	.fill.not-must:after{
		content: "任意";
		background: rgb(120, 205, 210);
	}

/* contactus.php 最終画面用 */
table.table.tbl-contactus2{
	margin: 0 auto;
}
table.table.tbl-contactus2 *{
	text-align: center;
}
table.table.tbl-contactus2 tbody tr td:nth-child(1){
	width: 75%;
}
table.table.tbl-contactus2 tbody tr td:nth-child(2){
	width: 25%;
}


/********************
 * サブページ（access.php用）
********************/
section#main > article#fr_sub > section > div > article li{
	list-style-type: none;
	padding: 10px;
}

/********************
 * サブページ（sitemap.php用）
********************/
.txt-indent{
	text-indent: 1.00rem;
}




/********************
 * サブページ（haxpes-lab/database.php用）
********************/
table.table.tbl-database *{
	text-align: center;
}
table.table.tbl-database a{
	font-weight: bold;
}
#list-database-sample table.table hr{
	border: 1px dotted rgb(200 200 200);
}
#list-database-sample table.table .table-primary,
#list-database-sample table.table .table-info{
	text-align: center;
}


/********************
 * サブページ（haxpes-lab/outline.php用）
********************/
table.table.tbl-haxpes-outline tbody tr th:nth-child(1){
	width: 250px;
}


/********************
 * サブページ（haxpes-lab/usage.php用）
********************/
#tbl_haxpes_flow tbody tr th{
	width: 345px;
}
	#tbl_haxpes_flow tbody tr th h5{
		position: relative;
		display: table-cell;
		width: 345px;
		height: 70px;
		margin: auto auto;
		border: 1px solid rgb(220, 220, 220);
		border-radius: 5px;

		background: #feffff;
		background: -moz-linear-gradient(-45deg,  #feffff 0%, #ddf1f9 35%, #a0d8ef 100%);
		background: -webkit-linear-gradient(-45deg,  #feffff 0%,#ddf1f9 35%,#a0d8ef 100%);
		background: linear-gradient(135deg,  #feffff 0%,#ddf1f9 35%,#a0d8ef 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#a0d8ef',GradientType=1 );

		box-shadow: rgba(0, 0, 0, 0.3) 3px 2px 2px;
		text-align: center;
		vertical-align: middle;
	}

	#tbl_haxpes_flow tbody tr:nth-child(5) th h5{
		background: #feffff;
		background: -moz-linear-gradient(-45deg,  #feffff 0%, #ddf9ef 35%, #a0efb6 100%);
		background: -webkit-linear-gradient(-45deg,  #feffff 0%,#ddf9ef 35%,#a0efb6 100%);
		background: linear-gradient(135deg,  #feffff 0%,#ddf9ef 35%,#a0efb6 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#a0efb6',GradientType=1 );

	}
#tbl_haxpes_flow tbody tr:nth-child(2) th,
#tbl_haxpes_flow tbody tr:nth-child(4) th,
#tbl_haxpes_flow tbody tr:nth-child(6) th{
	text-align: center;
	vertical-align: middle;
}
	#tbl_haxpes_flow tbody tr:nth-child(2) th i,
	#tbl_haxpes_flow tbody tr:nth-child(4) th i,
	#tbl_haxpes_flow tbody tr:nth-child(6) th i{
		color: rgb(50, 150, 200);
		font-size: 2.00rem;
	}

table.tbl-haxpes-usage-2d tbody th:nth-child(1){
	width: 280px;
}
#tbl_haxpes_flow h5{
	position: relative;
}
#tbl_haxpes_flow h5:before{
	content: "ユーザー";
	position: absolute;
	top: -0px;
	left: -10px;
	transform: rotate(-30deg);
	padding: 2px;
	background: rgb(255, 255, 255);
	border: 2px solid rgb(115, 175, 230);
	box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 3px;
	border-radius: 2px;
	font-size: 0.85rem;
}
#tbl_haxpes_flow tr:nth-child(5) h5:before{
	content: "事務局";
	border: 2px solid rgb(140, 195, 75);
}
.table.table.tbl-haxpes-usage-2d th h5{
	font-size: 1.00rem;
	margin: 0;
}

/********************
 * サブページ（haxpes-lab/subscription.php用）
********************/
table.tbl-haxpes-subscription{
	width: 400px;
}
table.tbl-haxpes-subscription tr th:nth-child(1){
	width: 280px;
}

table.tbl-haxpes-subscription thead th,
table.tbl-haxpes-subscription tbody td,
table.tbl-haxpes-subscription tr td:nth-child(2){
	text-align: center;
}
section#main > article#fr_sub > section > div > article ul#ul_subscription li{
	padding: 0 0 10px 0;
}
#ul_subscription{
	padding: 10px;
	margin: 0 10px;
	border: 1px solid rgb(220, 220, 220);
}
#ul_subscription > li > ul{
	margin-left: 20px;
}
#btn_goto_rsv_haxpes{
	display: block;
	width: 330px;
	margin-top: 40px;
	margin-right: auto;
	margin-left: auto;
	font-size: 1.10rem;
}





/********************
 * サブサブページ（haxpes-lab/database.php用）
********************/
.tbl-database{
	overflow-x: auto;
	min-width: 860px;
}

.database{
	overflow: hidden;
	border: 1px solid rgb(220,220, 220);
	border-radius: 15px;
	box-shadow: rgba(0, 0, 0, 0.3) 2px 3px 3px;
}
.database > div{
	width: calc(100% / 4);
	padding: 10px;
	background: rgb(250, 250, 250);
}
.database > div:last-child{
	margin-right: auto;
}

.database > div > table{
	width: 95%
	margin: auto auto;
}
.database > div > table .table-primary{
	width: 48px;
}
.database > div > table .table-info{
	width: 64px;
}





/********************
 * サブサブページ（haxpes-lab/spectra/*.php用）
********************/
table.table.tbl-spectra{
	width: 38%;
	margin-left: auto;
}



/********************
 * サブサブページ（news.php用）
********************/
.news_article{
	overflow: hidden;
	padding: 30px 20px 0 20px;
	margin-bottom: 50px;
	background: rgb(250, 250, 253);
	border: 1px solid rgb(220, 220, 223);
	border-radius: 3px;
}
	.news_article > h3{
		padding: 10px 0.75rem 10px 1.5rem;
		margin-bottom: 20px;
		background: rgb(215, 235, 245);
		border-radius: 2px;

		font-family: serif;
		font-size: 1.20rem;
		font-weight: bold;
		line-height: 1.35;
		text-indent: 0;
	}
	.news_article > h3 > .fa,
	.news_article > h3 > .badge{
		padding-left: 0.5rem;
		text-indent: 0;
	}

	.news_article > article > div.links-in-news{
		/* margin-bottom: 10px;*/
	}
		.news_article > article > div.links-in-news > a.btn{
			display: inline-block;
			margin: 0 10px 10px 0;
		}

	.news_article > article > button.btn_back{
		float: right;
		margin-bottom: 20px;
		border: 1px solid rgb(200, 200, 200);
	}







/********************
 * 全ページ共通 #footer
********************/

#footer *{
	color: rgb(255, 255, 255);
}

#footer{
	width: 100%;
	background: rgb(20, 120, 200);
}
	#footer > div{
		max-width: 1240px;
		padding: 30px;
		margin: 0 auto;
	}
		#footer > div > ul{
			list-style-type: none;
		}

			#footer > div > ul > li{

			}

				#footer > div > ul > li > ul{
					list-style-type: none;
					margin: 0 auto 20px auto;
				}
					#footer > div > ul > li > ul > li{
						margin: 0 10px 0 0;
					}
						#footer > div > ul > li > ul > li:last-child{
							margin-right: 0
						}
		#footer > div > ul > li > dl > dt{
			margin-right: 20px;
		}
			#footer > div > ul > li > dl  ul{
				list-style-type: none;
			}
			#footer > div > ul > li > dl >dt > ul li:first-child{
				font-weight: normal;
			}
			#footer > div > ul > li > dl  ul strong{
				font-size: 1.50rem;
			}
			#footer > div > ul > li > dl  ul small{
				font-size: 0.70rem;
			}
			#footer > div > ul > li > dl  ul span{
				font-size: 0.90rem;
			}










/********************
 * 全ページ共通 bootstrap補正用
********************/
i.fa.fam-small{
	font-size: 0.80rem;
}

i.fa{
	margin-right: 5px;
	font-size: 1.50rem;
}

b.fa{
	margin-right: 5px;
	font-size: 1.00rem;
}




.breadcrumb{
	max-width: 1240px;
	padding-left: 30px;
	padding-right: 30px;
	margin: 0 auto;
	background: none;
}



.btn{
	font-size: 0.85rem;
}
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger{
	box-shadow: inset 0 0 1px rgba(255, 255, 255);
	color: #fff;
}
.btn-primary {
	background-color: transparent;
	background-image: -webkit-linear-gradient(#4D89CF, #316fb8);
	background-image: linear-gradient(#4D89CF, #316fb8);
	box-shadow: inset 0 0 1px rgba(255, 255, 255, 0.7);

	background-color: #4D89CF;
	border-color: #4D89CF;
}
.btn-success {
	background-image: -webkit-linear-gradient(#52b86a, #208537);
	background-image: linear-gradient(#52b86a, #208537);

	background-color: #52b86a;
	border-color: #52b86a;
}
.btn-danger {
	background-image: -webkit-linear-gradient(#e35d6a, #b02a37);
	background-image: linear-gradient(#e35d6a, #b02a37);

	background-color: #e35d6a;
	border-color: #e35d6a;
}

.btn-info {
	background-image: -webkit-linear-gradient(#45b4c6, #128193);
	background-image: linear-gradient(#45b4c6, #128193);

	background-color: #45b4c6;
	border-color: #45b4c6;
}

.btn-warning {
	background-image: -webkit-linear-gradient(#ffcd38, #cc9a05);
	background-image: linear-gradient(#ffcd38, #cc9a05);

	background-color: #ffcd38;
	border-color: #ffcd38;
}
.btn-dark{
	background-image: -webkit-linear-gradient(gray, black);
	background-image: linear-gradient(gray, black);

	background-color: gray;
	border-color: gray;
}


#copyrights{
	font-size: 0.70rem;
	text-align: center;
}



#header.grd_haxpes{
	background: rgb(225, 140, 15);
	background: -moz-linear-gradient( top, rgb(225, 140, 15) 0%, rgb(235, 205, 65) 100% );
	background: -webkit-linear-gradient( top, rgb(225, 140, 15) 0%, rgb(235, 205, 65) 100% );
	background: linear-gradient( to bottom, rgb(225, 140, 15) 0%, rgb(235, 205, 65) 100% );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="rgb(120, 190, 255)", endColorstr="rgb(65, 150, 240)", GradientType=0 );
}
main.haxpes{

}
#footer.grd_haxpes{
	background: rgb(225, 140, 15);
}

.nav-tabs,
.nav-tabs .nav-item.show,
.nav-tabs .nav-item.show .nav-link{
	box-sizing: border-box;
	border-bottom: none;
	margin-bottom: -1px;
}

.nav-tabs{
	margin-bottom: 20px;
	border-bottom: 1px solid rgb(200, 200, 200);
}



.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active{
	box-sizing: border-box;
	background: rgb(20, 120, 200);
	background: -moz-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	background: -webkit-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	background: linear-gradient(to bottom,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(20, 120, 200)', endColorstr='rgb(110, 175, 225)',GradientType=0 );

	border-bottom: none;
	color: rgb(255, 255, 255);
}
.nav-tabs .nav-item.show .nav-link:not(.active):hover,
.nav-tabs .nav-link:not(.active):hover{
	border-color: rgb(20, 120, 200);
	border-color: -moz-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	border-color: -webkit-linear-gradient(top,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);
	border-color: linear-gradient(to bottom,  rgb(20, 120, 200) 0%, rgb(110, 175, 225) 100%);

	border-bottom: none;
}