/*トグルになるメニューの初期のデザイン*/
dl.toggle {
  max-width: 900px;
  width: 96%;
  margin: 0 auto 4em;
}
dl.toggle dt {
  margin-top: 16px;
  cursor: pointer;
  padding: 1em 1em 1em 3em;
  position: relative;
  background: #FFFFFF;
  color: #333333;
  font-size: 1.2em;
  text-align: left;
  position: relative;
  border-radius: 6px;
  border: 3px solid #102916;
 font-weight: 700;
}
dl.toggle dt::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1em;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 1.5em;
  height: 1.5em;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #102916;
}
dl.toggle dt::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1.57em;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 0.25em;
  height: 0.25em;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
/*トグルになるメニューがアクティブ時のデザイン*/
dl.toggle dt.active {
  cursor: pointer;
  padding: 1em 1em 1em 3em;
  position: relative;
  text-align: left;
  color: white;
  background: #102916;
  border: 2px solid #102916;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
}
dl.toggle dt.active::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1em;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 1.5em;
  height: 1.5em;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFFFFF;
}
dl.toggle dt.active::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1.57em;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 0.25em;
  height: 0.25em;
  border-top: 2px solid #102916;
  border-right: 2px solid #102916;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
dl.toggle dd dl dt, dl.toggle dd dl dt.active {
  text-align: left;
  font-size: 1.0em;
}
dl.toggle dd dl dd {
  background: #F1F1F1;
}
dl.toggle dd dl dd ul {
  list-style: none;
}
/*表示切り替えしたい要素は最初は非表示にしておく*/
dl.toggle dd {
  display: none;
  background: 15px 25px #FFF;
  padding: 20px 20px 20px 20px;
  text-align: left;
  border: 2px solid #102916;
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 6px;
  -moz-border-radius-bottomleft: 6px;
}
.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;
}
*/
@media screen and (max-width: 768px) {
  dl.toggle dt {
    font-size: 1.0em;
  }
  .sp-toggle .sp-t-midashi {
    cursor: pointer;
    position: relative;
  }
  .sp-toggle .sp-t-midashi::before {
    content: '';
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #71504E;
    border-right: solid 2px #71504E;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    top: 30%;
    right: 2%;
    margin-top: -4px;
    color: white;
  }
  .sp-toggle .sp-t-midashi.active::before {
    content: '';
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #71504E;
    border-right: solid 2px #71504E;
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute;
    top: 30%;
    right: 2%;
    margin-top: -4px;
    color: white;
  }
  .sp-toggle .sp-t-inside {
    display: none;
  }
  dl.toggle dd img {
    width: 60%;
    height: auto;
    padding-left: 2%;
  }
}