/* help_common.css */ 

.help-wrap{
 width: 100%;
 max-width: var(--page-max-width-desktop);
 margin: 0 auto;
 padding: var(--page-padding-x-lg);
 color:var(--text-color-base);
 box-sizing: border-box;
}
body{
 background: var(--page-background-default);
}
.heading-h1{
 margin-bottom: 24px;
}
.heading-h2{
 margin-bottom:12px;
}
.heading-h3{
 margin-bottom: 8px;
}
.help-content-wrap{
 margin-bottom:32px;
}
section{
  margin-bottom: 32px;
}
.help-btnwrap{
  text-align:center;
}

/*Contact Us*/
.help-contact{
  background:var(--color-neutral-100);
  padding:var(--layout-spacing-24);	
  max-width:989px;
  margin:0 auto;
  text-align:center;
}
.help-contact p{
  margin-bottom: 32px;
}
/*Helpful*/
.help-helpful{
  background:var(--color-neutral-100);
  text-align:center;
  padding:32px 24px;
  margin-bottom:32px;
  border-radius:10px;
}
.help-helpfulbtns{
  margin-top: 16px; 
  display:flex;
  justify-content:center;
  gap:8px;
}
.help-result{
  display:none;
}
.help-helpful a{
  margin-top: 16px; 
}
/*Related List*/
.help-relatedList{
  margin-bottom: 32px;
}
.help-relatedList li{
  margin-bottom:16px;
  list-style:none;
}
.help-relatedList a{
  color:#404040;
  text-decoration:none;
}
.help-relatedList a:hover{
   opacity:var(--link-hover-state);
}
/* ラジオボタンを非表示 */
.help-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
/* ラベル */
.help-radio {
  position: absolute;
  opacity: 0;
}
.help-radio-label {
  display: flex;
  align-items: flex-start;
  cursor: pointer;
}
.help-radio-label span {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.help-radio-label span::before {
  content: "";
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 4px;
  border: 1px solid var(--color-neutral-700);
  border-radius: 50%;
  box-sizing: border-box;
  transition: border-color .2s;
}
.help-radio:checked + span::before {
  border-color: var(--color-primary-700);
  background:radial-gradient(circle, var(--color-primary-700) 45%, transparent 46%);
}
@media screen and (max-width:768px){
.help-wrap{
    padding:24px;
}
.heading-h1{
  margin-bottom: 18px;
}
.heading-h2{
  margin-bottom:12px;
}
.help-content-wrap{
  margin-bottom:24px;
}
.help-content-wrap{
 margin-bottom:24px;
}
section{
  margin-bottom: 24px;
}
/*Helpful*/
.help-helpful{
  padding:24px 16px;
  margin-bottom:24px;
}
.help-helpfulbtns{
  gap:8px;
}
.help-helpfulbtns button{
  flex:1;
  max-width:120px;
}
/*Contact Us*/
.help-contact-btn{
    width:100%;
}
}