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

	FAQ／よくある質問

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


/*body･･････････････････････････････････････････････････････････････*/
body{
	background:var(--BK_Pattern_Tree);
}


/*タイトル･･････････････････････････････････････････････････････････*/
#contents>#section01{
	padding-top:200px;
	padding-bottom:0;
}
	#section01>div{/*baseArea*/
		display:inline-block;
		width:100%;
		text-align:center;
		text-align-last:center;
	}
		#section01>div>div{
			display:inline-block;
			width:1000px;
		}
			#section01>div>div>h3{/*Career Support、キャリア形成支援*/
				display:inline-block;
				width:200px;
				max-width:200px;
				float:left;
			}
				#section01>div>div>h3>p{/*Career Support*/
					margin-top:15px;
					font-size:56px;
					line-height:1.23em;
					letter-spacing:0.01em;
				}
				#section01>div>div>h3>span{/*キャリア形成支援*/
					display:inline-block;
					margin-top:5px;
					padding-left:15px;
					font-size:13px;
					background:url(../images/ico_dot2.png) left center no-repeat;
				}
			#section01>div>div>p{/*キャリアの正解はひとつではありません…*/
				display:inline-block;
				width:800px;
				max-width:800px;
				margin-top:30px;
				font-size:12px;
				float:right;
			}


/*リスト････････････････････････････････････････････････････････････*/
#contents>#section02{
	padding-top:60px;
}
	#section02>div{/*baseArea*/
		display:inline-block;
		width:100%;
		text-align:center;
		text-align-last:center;
	}
		#section02>div>div{
			display:inline-block;
			width:1000px;
		}
		#section02>div>div:nth-of-type(n+2){/*2番目以降*/
			margin-top:180px;
		}
			#section02>div>div>em{/*仕事内容・配属*/
				display:inline-block;
				width:200px;
				max-width:200px;
				font-weight:bold;
				float:left;
			}
				#section02>div>div>em>span{/*仕事内容・配属*/
					width: auto;
					padding-left:22px;
					background:url(../images/ico_dot_w.png) left center no-repeat;
				}
			#section02>div>div>ul{/*リスト*/
				width:calc(100% - 200px);
				float:right;
			}
				#section02>div>div>ul>li{
					display:inline-block;
					width:100%;
					border-radius:10px;
					background-color:white;
				}
				#section02>div>div>ul>li:nth-of-type(n+2){/*2番目以降*/
					margin-top:27px;
				}
					#section02>div>div>ul>li>p{
						display:inline-block;
						width:100%;
						padding:40px 40px 40px 125px;
						line-height:1.75em;
						box-sizing:border-box;
					}
					#section02>div>div>ul>li>p.listFAQ_f{
						position:relative;
						font-weight:bold;
						background:url(../images/ico_q.png) left 48px top 38px no-repeat;
					}
						#section02>div>div>ul>li>p.listFAQ_f>span.faqArrow{
							position: absolute;
							top:50px;
							right:48px;
							height: 7px;
							width: 12px;
							background:url(../images/ico_arrow_faq.png);
						}
					#section02>div>div>ul>li>p.listFAQ_a{
						display:none;
						padding:0 40px 40px 125px;
						background:url(../images/ico_a.png) left 48px top 6px 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);
						}
					}
					/*･････････････････････････････････････････････････*/




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

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

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

	/*･･･････････････････････････････････････････････････････････*/
	/*･･･････････････････････････････････････････････････････････*/
	

}




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

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

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


	/*body･･････････････････････････････････････････････････････････････*/
	body{
		background:var(--BK_Pattern_Tree);
	}


	/*タイトル･･････････････････････････････････････････････････････････*/
	#contents>#section01{
		padding-top:200px;
																					padding-top:137px;
		padding-bottom:0;
	}
		#section01>div{/*baseArea*/
			display:inline-block;
			width:100%;
			text-align:center;
			text-align-last:center;
		}
			#section01>div>div{
				display:inline-block;
				width:1000px;
																					width:450px;
			}
				#section01>div>div>h3{/*Career Support、キャリア形成支援*/
					display:inline-block;
					width:200px;
					max-width:200px;
					float:left;
				}
					#section01>div>div>h3>p{/*Career Support*/
						margin-top:15px;
						font-size:56px;
						line-height:1.23em;
						letter-spacing:0.01em;
					}
					#section01>div>div>h3>span{/*キャリア形成支援*/
						display:inline-block;
						margin-top:5px;
						padding-left:15px;
						font-size:13px;
																					font-size:15px;
						background:url(../images/ico_dot2.png) left center no-repeat;
					}
				#section01>div>div>p{/*キャリアの正解はひとつではありません…*/
					display:inline-block;
					width:800px;
					max-width:800px;
																					width:450px;
																					max-width:450px;
					margin-top:30px;
					font-size:12px;
																					font-size:18px;
																					line-height:1.75em;
					float:right;
				}
					#section01>div>div>p br{
						display: none;
					}


	/*リスト････････････････････････････････････････････････････････････*/
	#contents>#section02{
		padding-top:60px;
																					padding-top:120px;
	}
		#section02>div{/*baseArea*/
			display:inline-block;
			width:100%;
			text-align:center;
			text-align-last:center;
		}
			#section02>div>div{
				display:inline-block;
				width:1000px;
			}
			#section02>div>div:nth-of-type(n+2){/*2番目以降*/
				margin-top:180px;
																					margin-top:60px;
			}
				#section02>div>div>em{/*仕事内容・配属*/
					display:inline-block;
					width:200px;
					max-width:200px;
																					width:100%;
																					max-width:100%;
					font-weight:bold;
					float:left;
				}
					#section02>div>div>em>span{/*仕事内容・配属*/
						width: auto;
						padding-left:22px;
						background:url(../images/ico_dot_w.png) left center no-repeat;
					}
				#section02>div>div>ul{/*リスト*/
					width:calc(100% - 200px);
					float:right;
																					width:450px;
																					margin:30px auto 0 25px;
																					float:left;
				}
					#section02>div>div>ul>li{
						display:inline-block;
						width:100%;
						border-radius:10px;
						background-color:white;
					}
					#section02>div>div>ul>li:nth-of-type(n+2){/*2番目以降*/
						margin-top:27px;
																					margin-top:30px;
					}
						#section02>div>div>ul>li>p{
							display:inline-block;
							width:100%;
							padding:40px 40px 40px 125px;
																					padding:20px 80px 20px 125px;
							line-height:1.75em;
							box-sizing:border-box;
						}
						#section02>div>div>ul>li>p.listFAQ_f{
							position:relative;
							font-weight:bold;
							background:url(../images/ico_q.png) left 48px top 38px no-repeat;
																					background:url(../images/ico_q.png) left 48px top 24px no-repeat;
						}
							#section02>div>div>ul>li>p.listFAQ_f>span.faqArrow{
								position: absolute;
								top:50px;
																					top:35px;
								right:48px;
								height: 7px;
								width: 12px;
								background:url(../images/ico_arrow_faq.png);
							}
						#section02>div>div>ul>li>p.listFAQ_a{
							display:none;
							padding:0 40px 40px 125px;
							background:url(../images/ico_a.png) left 48px top 6px 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);
							}
						}
						/*･････････････････････････････････････････････････*/

}