@charset "utf-8";


/*202205から付け足し
---------------------------------------------------------------------------*/
/*追加デザイン分*/
.list2 {
	overflow: hidden;
	width: 40%;	/*幅*/
	float: left;	/*左に回り込み*/
	margin: 0 0 20px 3%;	/*上、右、下、左へのボックスの外側に空けるスペース*/
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	box-shadow: 3px 4px 2px rgba(0,0,0,0.1);	/*ボックスの影。右へ、下へ、ぼかし幅、色。0,0,0は黒の事で、0.1は色が10%出た状態。*/
	padding: 3% 3% 0% 3% ;	/*ボックス内の余白*/
	border-radius: 3px;	/*角丸のサイズ。ほんの少し角が丸くなってます。*/
}

p.check2 {
	background: #003899;
	color:#fff;
	padding: 5px 10px !important;
	margin-bottom: 15px;
	border-radius: 4px;
}


.w25p {width: 25%;}
.w30p {width: 30%;}
.w35p {width: 35%;}
.w50p {width: 50%;}

.bgcolor3 {background: #FFFF77 !important;}


.box202205 {
	padding: 15px;			/*ボックス内の余白*/
	margin-bottom: 20px;	/*ボックスの下に空けるスペース*/
	background: #003899;
	border: solid 1px #BA0D0D;	/*線の線種、幅、色*/
	border-radius: 10px;	/*角丸のサイズ*/
}

.boxaccess {
	padding: 15px;			/*ボックス内の余白*/
	margin-top: 20px;
	margin-bottom: 20px;	/*ボックスの下に空けるスペース*/
	background: #eee;
	border: solid 1px #003899;	/*線の線種、幅、色*/
	box-shadow: 0px 0px 1px 1px #fff inset;	/*ボックスの影。右へ、下へ、ぼかし幅、距離。#fffは白のことでinsetは内側へ向けての影の指定。*/
	border-radius: 10px;	/*角丸のサイズ*/
}

.color202205 {color: #003399 !important;}
.colorred {color: #ED1831 !important;}
.colorpink {color: #FF99AC !important;}
.colorlemon {color: #ffffe0 !important;}
.colorwhite {color: #ffffff !important;}

.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}

.mr10 {margin-right: 10px;}

.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}



/*btn2の設定
---------------------------------------------------------------------------*/
p.btn2 {margin: 0;}

/*ボタンを囲むブロック*/
.btn2 {
	text-align: center;	/*内容をセンタリング*/
}

/*ボタン*/
.btn2 a,
.btn2 input {
	text-decoration: none;border: none;
	display: block;
	font-size: 1em;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅の順。0,0,0は黒の事で0.2は色が20%出た状態。*/
	background: #F72B7E;	/*背景色*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 0.8em 1em;		/*上下、左右へのボタン内の余白*/
	margin-top: 0.3em;		/*ボタンの上に１文字分のスペースを空ける*/
	border-radius: 10px;	/*角丸のサイズ。この行を削除すれば角が尖った長方形になります。*/
}

/*ボタンのマウスオン時*/
.btn2 a:hover,
.btn2 input:hover {
	cursor: pointer;			/*inputタグを使う場合に「手」のマークになるように。リンクと同じ表示になるようにという事です。*/
	opacity: 1;					/*一番上のリンク設定でhoverにopacityを指定しているので、適用されないようにする。*/
	filter: brightness(1.2);	/*少しだけ明るくする。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}

/*ボタン内にiタグを使った場合*/
.btn2 i {
	margin-left: 15px;		/*テキストとの間に空ける余白*/
	opacity: 0.5;			/*透明度。色が50%でた状態。*/
	transform: scale(1.4);	/*サイズを1.4倍にする*/
}


/*メンテナンスバナーボタン*/
.btn3 a,
.btn3 input {
	text-decoration: none;border: none;
	display: block;
	font-size: 1em;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅の順。0,0,0は黒の事で0.2は色が20%出た状態。*/
	background: #E93F00;	/*背景色*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 0.8em 1em;		/*上下、左右へのボタン内の余白*/
	margin-top: 0.3em;		/*ボタンの上に１文字分のスペースを空ける*/
	border-radius: 10px;	/*角丸のサイズ。この行を削除すれば角が尖った長方形になります。*/
}


/*ボタンのマウスオン時*/
.btn3 a:hover,
.btn3 input:hover {
	cursor: pointer;			/*inputタグを使う場合に「手」のマークになるように。リンクと同じ表示になるようにという事です。*/
	opacity: 1;					/*一番上のリンク設定でhoverにopacityを指定しているので、適用されないようにする。*/
	filter: brightness(1.2);	/*少しだけ明るくする。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}

/*ボタン内にiタグを使った場合*/
.btn3 i {
	margin-left: 15px;		/*テキストとの間に空ける余白*/
	opacity: 0.5;			/*透明度。色が50%でた状態。*/
	transform: scale(1.4);	/*サイズを1.4倍にする*/
}



/*会社概要バナーボタン*/
.btn4 a,
.btn4 input {
	text-decoration: none;border: none;
	display: block;
	font-size: 1em;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅の順。0,0,0は黒の事で0.2は色が20%出た状態。*/
	background: #67A1F2;	/*背景色*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 0.8em 1em;		/*上下、左右へのボタン内の余白*/
	margin-top: 0.3em;		/*ボタンの上に１文字分のスペースを空ける*/
	border-radius: 10px;	/*角丸のサイズ。この行を削除すれば角が尖った長方形になります。*/
}


/*ボタンのマウスオン時*/
.btn4 a:hover,
.btn4 input:hover {
	cursor: pointer;			/*inputタグを使う場合に「手」のマークになるように。リンクと同じ表示になるようにという事です。*/
	opacity: 1;					/*一番上のリンク設定でhoverにopacityを指定しているので、適用されないようにする。*/
	filter: brightness(1.2);	/*少しだけ明るくする。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}

/*ボタン内にiタグを使った場合*/
.btn4 i {
	margin-left: 15px;		/*テキストとの間に空ける余白*/
	opacity: 0.5;			/*透明度。色が50%でた状態。*/
	transform: scale(1.4);	/*サイズを1.4倍にする*/
}




/*採用情報バナーボタン*/
.btn5 a,
.btn5 input {
	text-decoration: none;border: none;
	display: block;
	font-size: 1em;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅の順。0,0,0は黒の事で0.2は色が20%出た状態。*/
	background: #ff69b4;	/*背景色*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 0.8em 1em;		/*上下、左右へのボタン内の余白*/
	margin-top: 0.3em;		/*ボタンの上に１文字分のスペースを空ける*/
	border-radius: 10px;	/*角丸のサイズ。この行を削除すれば角が尖った長方形になります。*/
}

/*ボタンのマウスオン時*/
.btn5 a:hover,
.btn5 input:hover {
	cursor: pointer;			/*inputタグを使う場合に「手」のマークになるように。リンクと同じ表示になるようにという事です。*/
	opacity: 1;					/*一番上のリンク設定でhoverにopacityを指定しているので、適用されないようにする。*/
	filter: brightness(1.2);	/*少しだけ明るくする。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}

/*ボタン内にiタグを使った場合*/
.btn5 i {
	margin-left: 15px;		/*テキストとの間に空ける余白*/
	opacity: 0.5;			/*透明度。色が50%でた状態。*/
	transform: scale(1.4);	/*サイズを1.4倍にする*/
}



/*アクセスバナーボタン*/
.btn6 a,
.btn6 input {
	text-decoration: none;border: none;
	display: block;
	font-size: 1em;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅の順。0,0,0は黒の事で0.2は色が20%出た状態。*/
	background: #00CC88;	/*背景色*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 0.8em 1em;		/*上下、左右へのボタン内の余白*/
	margin-top: 0.3em;		/*ボタンの上に１文字分のスペースを空ける*/
	border-radius: 10px;	/*角丸のサイズ。この行を削除すれば角が尖った長方形になります。*/
}


/*ボタンのマウスオン時*/
.btn6 a:hover,
.btn6 input:hover {
	cursor: pointer;			/*inputタグを使う場合に「手」のマークになるように。リンクと同じ表示になるようにという事です。*/
	opacity: 1;					/*一番上のリンク設定でhoverにopacityを指定しているので、適用されないようにする。*/
	filter: brightness(1.2);	/*少しだけ明るくする。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}

/*ボタン内にiタグを使った場合*/
.btn6 i {
	margin-left: 15px;		/*テキストとの間に空ける余白*/
	opacity: 0.5;			/*透明度。色が50%でた状態。*/
	transform: scale(1.4);	/*サイズを1.4倍にする*/
}



/*メンテナンスページの一覧用ブロック
---------------------------------------------------------------------------*/
/*box（info1.htmlやstaff.htmlで使っている枠色がついたタイプのボックス）
---------------------------------------------------------------------------*/
/*box*/
.box_m {
	overflow: hidden;
	border: 2px solid #003899;	/*枠線の幅、線種、色*/
	padding: 20px;				/*ボックス内の余白*/
	border-radius: 10px;		/*角丸のサイズ。この１行を削除すれば角のとれた長方形になります。*/
	margin-bottom: 20px;		/*ボックスの下に空けるスペース*/
}
/*box内のh4タグ*/
.box_m h4 {
	color: #003899;		/*文字色*/
	font-size: 130%;	/*文字サイズ*/
	border-bottom: dotted 3px #DE001D;
}
/*box内のpタグ*/
.box_m p {
	padding: 0 !important;
}
/*box内のfrとflスタイルのリセット*/
.box_m .fr,.box .fl {margin-bottom: 0;}


.cb{
  /* floatを解除 */
  clear: both;
}

.br-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 15px;
  margin-top: 15px;
  margin-bottom: 35px;
  padding-top: 20px;
  padding-bottom: 25px;
  border-top: 3px solid #003899;
  border-bottom: 3px solid #BA0D0D;
  background-color: #FFFFEB;
}

.kochira {
  font-weight: bold;
  border-bottom: dotted;
  color: #ffffff;
border-width:3px;/*3ピクセルの太さにする*/
}