@charset "UTF-8";

/* ===============================================================
	MV欄
================================================================== */

/* 背景画像
-------------------------------------------------------------------------*/
#title.index {
	background-image: url("../img/mv_index.png");
	background-size: 340px;
	background-position: 10% 150%;
	background-color: #e2e4df;
}

#title.index h1{
	color: #333;
}

@media screen and (max-width:767px) {

	#title.index {
		background-position: 30px bottom;
		background-size: 200px;
	}

}


section {
	margin-bottom: 35px;
}

.accordion{
	width: 100%;
	margin: 40px auto;
}

.toggle {
	display: none;
}

.qa_box{
	width: 100%;
	margin: 0 auto 30px;
}

.Label {
	padding: 1em;
	padding-left: 3em;
	display: block;
	color: #fff;
	background: #13538a;
	cursor: pointer;
	font-size: 1.8rem;
	position: relative;
}

.Label::before{
	content: "Ｑ．";
	display: inline-block;
	font-weight: bold;
	font-size: 2.2rem;
	margin-right: 10px;
	position: absolute;
	top: 15px;
	left: 15px;
}

.Label::after {
	font-family: "Font Awesome 5 Free";
	content: '\f067';
	font-weight: 900;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 20px;
}

.Label,
.content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
	border-radius: 15px;
}

.content {
	height: 0;
	padding: 0 20px;
	overflow: hidden;
	text-align: left;
}

.under section .content p{
	display: flex;
	align-items: center;
}
.under section .content p::before{
	content: "Ａ．";
	display: block;
	font-size: 2.2rem;
	font-weight: bold;
	color: red;
}

.toggle:checked+.Label+.content {
	height: auto;
	padding: 20px;
	transition: all .3s;
	border: 2px solid #13538a;
	border-radius: 15px;
	margin-bottom: 30px;
}

.toggle:checked+.Label::after {
	content: "\f068";
}

@media screen and (max-width:767px) {

	/* メニュー
	-------------------------------------------------------------------------*/
	.Label {
		padding: 20px;
		padding-left: 50px;
		padding-right: 50px;
		display: flex;
		align-items: center;
		font-size: 1.4rem;
	}

	.Label::before {
		
	}


	.flex_center {
		display: block;
	}
	.flex_center img {
		width: 75%;
		display: block;
		margin: 0 auto;
	}


}



/* テキスト、キャラ画像
-------------------------------------------------------------------------*/
.flex_center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.flex_center img {
	width: 200px;
}

.flex_txt {
	text-align: center;
	margin-top: 25px;
	font-size: 20px;
}

@media screen and (max-width:767px) {

	.flex_center {
		display: block;
	}

	.flex_center img {
		width: 75%;
		display: block;
		margin: 0 auto;
	}

}

.bold {
  font-size: 2.5rem;
  font-weight: bold;
  text-align: center;
  margin: 15px 0;
}