/*********************************************************************************************************************************

		コンテンツ（一覧リスト）

*********************************************************************************************************************************/


/*セレクトBOX（カテゴリー選択）･････････････････････････････････････*/
#catSelector{
	display:inline-block;
	width:100%;
	max-width:1000px;
	margin-bottom:50px;
}
	#catSelector>span{/*カテゴリー：*/
		width:auto;
		margin-right:0.5em;
		font-size:17px;
		font-weight:bold;
		float:right;
	}
	#catSelector>select{
		width:15.0em;
		padding-left:0.8em;
		font-size:17px;
		float:right;
		background:white url(images/ico_bc_arrow2.png) right 9px center no-repeat;
	}




/*よくあるご質問（FAQ一覧）･････････････････････････････････････････*/
.listFAQ{
	display:inline-block;
	width:100%;
}
	.listFAQ_list,
	.listFAQ_list *{
		display:inline-block;
		width:100%;
	}
	.listFAQ_list{
		width:1000px;
		max-width:1000px;
		border:solid 1px var(--Gray_02);
		box-sizing:border-box;
		background-color:white;
	}
		.listFAQ_list>li:nth-of-type(n+2){/*2番目以降*/
			border-top:solid 1px var(--Gray_02);
		}
			.listFAQ_list>li>p{
				position:relative;
				width:calc(100% - 112px);
				padding:21px 46px 21px 66px;
				text-align:left;
				text-align-last:left;
			}
			.listFAQ_list>li>p.listFAQ_f{/*質問*/
				pointer-events:auto;
				cursor:pointer;
				background:url(images/ico_question.png) left 20px center no-repeat;
			}
			.listFAQ_list>li>p.listFAQ_a{/*回答*/
				display:none;
				border-top:solid 1px var(--Gray_02);
				background-color:var(--Cyan_01);
			}
				.listFAQ_list>li>p>span{/* ＞ */
					position:absolute;
					top:0;
					left:auto;
					right:25px;
					bottom:0;
					margin:auto;
					height:13px;
					width:13px;
					background:url(images/ico_faq_arrow.png) center center no-repeat;
				}

				/*faqArrow アニメーション･･････････････････････････*/
				.faqArrow_180deg{
					transform-origin:center center;/*基準点*/
					animation:faqArrow_180deg 0.25s ease-out forwards;
				}
				.faqArrow_0deg{
					transform-origin:center center;/*基準点*/
					animation:faqArrow_0deg 0.25s ease-out forwards;
				}

				@keyframes faqArrow_180deg{
					from{/*デフォルト*/
						transform:rotate(0deg);
					}
					to{
						transform:rotate(180deg);
					}
				}
				@keyframes faqArrow_0deg{
					from{/*デフォルト*/
						transform:rotate(180deg);
					}
					to{
						transform:rotate(0deg);
					}
				}
				/*･････････････････････････････････････････････････*/




/*ブログ一覧････････････････････････････････････････････････････････*/
#listBlog{
	display:inline-block;
	width:100%;
}
	#listBlog_list,
	#listBlog_list *{
		display:inline-block;
		width:100%;
	}
	#listBlog_list{
		width:1000px;
		max-width:1000px;
	}
		#listBlog_list>li{/*カード*/
			height:370px;
			width:33.33333333333333%;
			border-right:solid 1px var(--Gray_02);
			border-bottom:solid 1px var(--Gray_02);
			box-sizing:border-box;
			float:left;
		}
		#listBlog_list>li:nth-of-type(-n+3){/*上から3番目まで*/
			border-top:solid 1px var(--Gray_02);
		}
		#listBlog_list>li:nth-of-type(3n+1){/*3の倍数+1番目(1,4,7…)*/
			border-left:solid 1px var(--Gray_02);
		}
			#listBlog_list>li>a{
				position:relative;
				height:100%;
				background-color:white;
			}
			#listBlog_list>li>a:hover{
				opacity:1;
				color:var(--Cyan_02);
			}
			#listBlog_list>li>a:hover div>img{/*サムネイル画像*/
				transform:scale(1.2);/*拡大・縮小*/
				transition:0.4s ease-out;/*秒*/
				transform-origin:center center;/*軸*/
			}
				#listBlog_list>li>a>div{
					z-index:10;
					position:absolute;
					top:0;
					left:0;
					right:auto;
					bottom:auto;
					height:208px;
					width:100%;
					overflow:hidden;
				}
					#listBlog_list>li>a>div>span{/*カテゴリー*/
						z-index:30;
						position:absolute;
						top:0;
						left:0;
						right:auto;
						bottom:auto;
						width:auto;
						padding:2px 18px;
						color:white;
						background-color:var(--Category_01);
					}
					#listBlog_list>li:nth-of-type(4n+2)>a>div>span{/*4の倍数+1番目(2,6,10…)*/
						background-color:var(--Category_02);
					}
					#listBlog_list>li:nth-of-type(4n+3)>a>div>span{/*4の倍数+1番目(3,7,11…)*/
						background-color:var(--Category_03);
					}
					#listBlog_list>li:nth-of-type(4n+4)>a>div>span{/*4の倍数+1番目(4,8,12…)*/
						background-color:var(--Category_04);
					}
					#listBlog_list>li>a>div>img{/*サムネイル画像*/
						z-index:20;
						position:absolute;
						top:0;
						left:0;
						right:auto;
						bottom:auto;
						height:208px;
						width:100%;
						object-fit:cover;
						object-position:center center;

						/*a:hoverからの戻りアニメ*/
						transform:scale(1.0);/*拡大・縮小*/
						transition:0.4s ease-out;/*秒*/
					}
				#listBlog_list>li>a>p{
					position:absolute;
					top:228px;
					left:30px;
					right:auto;
					bottom:auto;
					height:102px;
					width:calc(100% - 60px);
					font-weight:bold;
				}
				#listBlog_list>li>a>span{
					position:absolute;
					top:auto;
					left:30px;
					right:auto;
					bottom:25px;
					width:calc(100% - 60px);
					color:gray;
					font-size:14px;
					line-height:1.0em;
				}




/*お知らせ一覧･･････････････････････････････････････････････････････*/
#listNews{
	display:inline-block;
	width:100%;
}
	#listNews_list,
	#listNews_list *{
		display:inline-block;
		width:100%;
	}
	#listNews_list{
		width:1000px;
		max-width:1000px;
		border:solid 1px var(--Gray_03);
		box-sizing:border-box;
		background-color:white;
	}
		#listNews_list>li:nth-of-type(n+2){/*2番目以降*/
			border-top:solid 1px var(--Gray_03);
			box-sizing:border-box;
		}
			#listNews_list>li>a{
				height:180px;
			}
			#listNews_list>li>a:hover{
				opacity:1;
			}
				#listNews_list>li>a>p{
					height:100%;
					width:290px;
					border-right:solid 1px var(--Gray_01);
					box-sizing:border-box;
					overflow:hidden;
					float:left;
				}
					#listNews_list>li>a>p>img{/*サムネイル画像*/
						height:100%;
						width:100%;
						object-fit:cover;
						object-position:center center;
					}
					#listNews_list>li>a>p>img:hover{
						opacity:1;
					}
					#listNews_list>li>a:hover p>img{
						transform:scale(1.2);/*拡大・縮小*/
						transition:0.4s ease-out;/*秒*/
						transform-origin:center center;/*軸*/
					}
					#listNews_list>li>a>div{
						height:152px;
						width:calc(100% - 290px);
						padding:28px 37px 0 37px;
						box-sizing:border-box;
						overflow:hidden;
						float:right;
					}
						#listNews_list>li>a>div>span{
							color:var(--Gray_03);
						}
						#listNews_list>li>a:hover div>span{
							color:var(--Cyan_03);
						}
						#listNews_list>li>a>div>p{
							margin-top:0.5em;
							text-align-last:left;
						}
						#listNews_list>li>a:hover div>p{
							color:var(--Cyan_04);
						}




/*********************************************************************************************************************************

		メディアクエリ（ ～1000px以下 ）

*********************************************************************************************************************************/
@media(max-width:1000px){


	/*セレクトBOX（カテゴリー選択）･････････････････････････････････････*/
	#catSelector{
		width:95%;
		margin-left:2.5%;
	}


	/*FAQリスト････････････････････････････････････････････････････････*/
	.listFAQ_list{
		width:95%;
		margin-left:2.5%;
	}


	/*ブログ一覧リスト･････････････････････････････････････････････････*/
	#listBlog #catSelector{
		margin-left:0;
	}
	#listBlog_list{
		width:667px;
		max-width:667px;
	}
		#listBlog_list>li{/*カード*/
			width:50%;
		}
		#listBlog_list>li:nth-of-type(-n+3){/*上から3番目まで*/
			border-top:none;
		}
		#listBlog_list>li:nth-of-type(3n+1){/*3の倍数+1番目(1,4,7…)*/
			border-left:none;
		}
		#listBlog_list>li:nth-of-type(-n+2){/*上から2番目まで*/
			border-top:solid 1px var(--Gray_02);
		}
		#listBlog_list>li:nth-of-type(2n+1){/*2の倍数+1番目(1,3,5…)*/
			border-left:solid 1px var(--Gray_02);
		}

}




/*********************************************************************************************************************************

		メディアクエリ（ ～750px以下 ）

*********************************************************************************************************************************/
@media(max-width:750px){

}




/*********************************************************************************************************************************

		メディアクエリ（ ～500px以下 ）

*********************************************************************************************************************************/
@media(max-width:500px){


	/*セレクトBOX（カテゴリー選択）･････････････････････････････････････*/
	#catSelector{
		width:450px;
		margin-top:50px;
		margin-left:25px;

		/*表示順の変更*/
		display:flex;
		flex-direction:column;
		-webkit-flex-direction:column;
	}
		#catSelector>span{/*セレクトエリア*/
			font-size:23px;
			order:1; -ms-flex-order:1;/*表示順*/
		}
		#catSelector>select{/*セレクトエリア*/
			font-size:23px;
			order:2; -ms-flex-order:2;/*表示順*/
			border:solid 1px var(--Gray_03) !important;
		}


	/*FAQリスト････････････････････････････････････････････････････････*/
	.listFAQ_list{/*リスト*/
		width:450px;
		max-width:450px;
		margin-left:0;
		border:solid 1px var(--Gray_03);
		box-sizing:border-box;
	}
		.listFAQ_list>li:nth-of-type(n+2){/*2番目以降*/
			border-top:solid 1px var(--Gray_03);
		}
			.listFAQ_list>li>p.listFAQ_f{/*質問*/
				width:calc(100% - 114px);
				padding:21px 48px 21px 66px;
			}
			.listFAQ_list>li>p.listFAQ_a{/*回答*/
				width:calc(100% - 50px);
				padding:21px 25px 21px 25px;
				border-top:solid 1px var(--Gray_03);
			}


	/*ブログ一覧リスト･････････････････････････････････････････････････*/
	#listBlog #catSelector{
		margin-left:25px;
	}
	#listBlog_list{
		width:450px;
		max-width:450px;
	}
		#listBlog_list>li{/*カード*/
			width:100%;
			border:solid 1px var(--Gray_02);
		}
		#listBlog_list>li:nth-of-type(-n+3){/*上から3番目まで*/
			border-top:solid 1px var(--Gray_02);
		}
		#listBlog_list>li:nth-of-type(3n+1){/*3の倍数+1番目(1,4,7…)*/
			border-left:solid 1px var(--Gray_02);
		}
		#listBlog_list>li:nth-of-type(n+2){/*2番目以降*/
			margin-top:48px;
		}
			#listBlog_list>li>a:hover{
				color:black;
			}
			#listBlog_list>li>a:hover div>img{/*サムネイル画像*/
				transform:scale(1.0);/*拡大・縮小*/
				transition:0;/*秒*/
			}
				#listBlog_list>li>a>span{
					font-size:21px;
				}


	/*お知らせ一覧リスト････････････････････････････････････････････････*/
	#listNews_list{
		width:450px;
		max-width:450px;
		border:none;
		background-color:white;
	}
		#listNews_list>li:nth-of-type(n+2){/*2番目以降*/
			margin-top:48px;
		}
		#listNews_list>li{
			border:solid 1px var(--Gray_03);
			box-sizing:border-box;
		}
			#listNews_list>li>a{
				height:auto;
			}
				#listNews_list>li>a>p{
					width:100%;
				}
					#listNews_list>li>a>p>img{
						height:208px;
					}
					#listNews_list>li>a:hover p>img{/*サムネイル画像*/
						transform:scale(1.0);/*拡大・縮小*/
						transition:0s ease-out;/*秒*/
					}
					#listNews_list>li>a>div{
						height:auto;
						width:100%;
						padding:20px 30px;
						display:flex;
						flex-wrap:wrap;
					}
						#listNews_list>li>a>div>span{
							order:2;
						}
						#listNews_list>li>a:hover div>span{
							color:var(--Gray_03);
						}
						#listNews_list>li>a>div>p{
							margin-top:0;
							margin-bottom:0.5em;
							color:black;
							font-weight:bold;
							order:1;
						}
						#listNews_list>li>a:hover div>p{
							color:black;
						}

}