/*トグルになるメニューの初期のデザイン*/
dl#toggle{
 max-width: 900px;
 width: 96%;
 margin: 0 auto;
}
dl#toggle dt {
	margin-top:16px;
	cursor:pointer;
	padding:20px 20px 20px 20px;
  position: relative;
 background: #FFFFFF;
 text-align: left;
}
dl#toggle dt::before { 
 content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #009749;
  border-right: solid 2px #009749;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: 50%;
  right: 2%;
  margin-top: -4px;
}

/*トグルになるメニューがアクティブ時のデザイン*/
dl#toggle dt.active {
	cursor:pointer;
	padding:20px 20px 20px 20px;
  position: relative;
 text-align: left;
}
dl#toggle dt.active::before {
 content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #009749;
  border-right: solid 2px #009749;
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 50%;
  right: 2%;
  margin-top: -4px;
}

/*表示切り替えしたい要素は最初は非表示にしておく*/
dl#toggle dd {
	display:none;
	background:15px 25px #FFF;
	padding:20px 20px 20px 20px;
  text-align: left;
}
.faq-q{
	padding-left:3em;
  position: relative;
}
.faq-q::before{
 content: 'Q';
  position: absolute;
 left: 0;
 background: #009749;
 color: white;
 padding: 0 0.4em;
}
.faq-a{
	padding-left:3em;
  position: relative;
}
.faq-a::before{
 content: 'A';
  position: absolute;
 left: 0;
 background: #0097BA;
 color: white;
 padding: 0 0.4em;
}
dl#toggle dd img{
	width:40%;
	height:auto;
	padding-left:2%;
}