#help .d-flex.helpsec {
  width:90%;
  flex-flow:row wrap;
  justify-content:space-around;
  margin:auto;
}

#help .helpbox {
  display: flex;
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  margin-bottom: 10px;
  position: relative;
  min-height: 100px;
}

#help .helpbox a { color:#000;}
#help .helpbox h3 { border:0; text-decoration:none;}
#help .helpbox ul { list-style:none;}
#help .helpbox ul a { text-decoration:underline;}

#help .helpbox img {
    border: 0;
    width: 100px;
    position: absolute;
    bottom: 0;
    right: 0;
}

.helpcontent img {
  width:90%;
  max-width:370px;
  display:block;
  border:1px solid #ddd;
  margin-bottom:2rem;
  box-shadow: 0px 1px 3px #ccc;
}

.faqlist {
  border:1px solid #ccc;
  border-radius:.5em;
  padding:20px;
  line-height:25px;
  font-size:.95rem;
  position:relative;
}

.faqlist input {
  display:none;
}

.faqlist label {
  width:100%;
  transition:.3s;
  display:block;
  position:relative;
  padding:4px;
  background:#f9f9f9;
  margin-bottom:.2rem;
}

.faqlist label:after {
  content: "";
  width: 10px;
  height: 10px;
  border-bottom: 3px solid #a3a3a3;
  border-right: 3px solid #a3a3a3;
  transform: rotate(45deg);
  display: inline-block;
  position: absolute;
  vertical-align: middle;
  right: 12px;
  top: 14px;
}

.faqlist #tab1:checked ~ label[for=tab1]::after, .faqlist #tab2:checked ~ label[for=tab2]::after, .faqlist #tab3:checked ~ label[for=tab3]::after, .faqlist #tab4:checked ~ label[for=tab4]::after, .faqlist #tab5:checked ~ label[for=tab5]::after, .faqlist #tab6:checked ~ label[for=tab6]::after {
  transform: rotate(-135deg);
}

.faqlist .faqcate {
  display:none;
}

.faqlist .faqdetail {
  width:100%;
  padding:0 5px;
  background:#eee;
  list-style:inside;
  box-sizing:border-box;
  line-height:2.2;
}

.faqlist #tab1:checked ~ .faqcate[id=tab1] {display:block;}
.faqlist #tab2:checked ~ .faqcate[id=tab2] {display:block;}
.faqlist #tab3:checked ~ .faqcate[id=tab3] {display:block;}
.faqlist #tab4:checked ~ .faqcate[id=tab4] {display:block;}
.faqlist #tab5:checked ~ .faqcate[id=tab5] {display:block;}
.faqlist #tab6:checked ~ .faqcate[id=tab6] {display:block;}

.faqlist label:hover {
  background:#eee;
}

.faqlist #tab1:checked ~ label[for=tab1], .faqlist #tab2:checked ~ label[for=tab2], .faqlist #tab3:checked ~ label[for=tab3], .faqlist #tab4:checked ~ label[for=tab4], .faqlist #tab5:checked ~ label[for=tab5], .faqlist #tab6:checked ~ label[for=tab6] {
  background:#FFEB3B;
}

.helpnav-hum {
  display: block;
  width: 36px;
  height: 36px;
  vertical-align: middle;
  cursor: pointer;
  position: fixed;
  top: 120px;
  right: 12px;
  z-index: 90;
  transform: translateX(0);
  transition: transform .3s;
  border:1px solid #000;
  background:rgba(221, 221, 221, .5);
  box-shadow:0 0 3px #000;
}
.helpnav-hum strong {
  position:absolute;
  top:-23px;
  left:-4px;
}
.helpnav-hum span {
  display: inline-block;
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  width: 80%;
  height: 4px;
  background-color: #000;
  transform:translate(-50%, -50%);
}
.helpnav-hum span:nth-of-type(1) { top:25%;}
.helpnav-hum span:nth-of-type(2) { top:50%;}
.helpnav-hum span:nth-of-type(3) { top:76%;}

.helpnav-hum.active span:nth-of-type(2) {display:none;}
.helpnav-hum.active span:nth-of-type(1) {transform: translate(-14px, 7px) rotate(-45deg);}
.helpnav-hum.active span:nth-of-type(3) {transform: translate(-14px, -11px) rotate(45deg);}

.help_nav nav {
  display:none;
  position: fixed;
  background:rgba(250,250,250,.9);
  border: 1px solid #ccc;
  padding: 50px 5px 5px;
  box-shadow: -3px 3px 8px #333;
  left:10%;
  right:0;
  overflow-y: auto;
  bottom: 0;
  top: 0;
  z-index:85;
}
.help_nav nav a { color:#000; font-weight:700; border-bottom:1px solid #ccc;}
nav.help-spnnav.open { display:block !important;}

.helpcontent ol {list-style:none; padding-left:1rem;}
.helpcontent ol li span {
  background: #FF5722;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
  width: 1.2rem;
  display: inline-block;
  vertical-align: top;
  line-height: 1.2rem;
  margin-right: 10px;
}

.helpcontent dl {
  margin-left: 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}

.faq dl dt {
  width: 1.4rem;
  line-height: 1.4rem;
  color: #fff;
  text-align: center;
  margin-right: 10px;
  display: inline-block;
  vertical-align: top;
}

.helpcontent dt.btn_q_help { background-color: #ff0000;}
.helpcontent dt.btn_a_help { background-color: #008;}

.faq dl dd { display: inline-block; width:calc(100% - 1.4rem - 10px);}
.ankmg { padding-top: 50px; margin-top: -50px; display:block;}

/*768px以上*/
@media screen and (min-width:768px) {
#help .helpbox {width:45%;}
}

/*767px以下*/
@media screen and (max-width:767px) {
#help .helpbox + .helpbox { margin-top:1rem;}
}