@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans);

body,html{
  margin:0;
  padding:0;
  overflow-x: hidden;
  font-family: 'Noto Sans JP', sans-serif ,'Noto Sans';
}

section.faq-contant-sec1 .container {
  padding: 18px 0 0px;
}

section.faq-contant-sec2 .container{
      padding:0px 0 50px;
}

section.faq-contant-sec2 .container h3#regsit-faq{
  margin-top: 20px;
}

.faq-contant-sec1 h1{
  font-size: 22px;
  color: #515C6F;
  /* font-weight: bold; */
}

.faq-contant-sec1  h1:after {
    content: "";
    display: block;
    height: 5px;
    width: 8%;
    background: linear-gradient(45deg, #d92933 33%, #ef8224 100%);
    margin: 40px 0 30px 0;
}

.faq-contant-sec1 .faq-list-nav{
  text-align: left;
  list-style: none;
  padding: 0.5rem 0;
}

.faq-contant-sec1  li {
  background: #fff;
  display: inline-block;
  margin: 0.8rem 0.2rem;
}

.faq-contant-sec1 li.first-child,
.faq-contant-sec1 li.forth-child,
.faq-contant-sec1 li.six-child{
  margin-left: 0;
}

.faq-contant-sec1 li a{
  border: 1px solid #707070;
  color: #515C6F;
  padding: 0.4rem 1rem 0.4rem;
  border-radius: 60px;

}

.faq-contant-sec1 li a:hover{
  border:solid 1px #D61E29;
  color: #fff;
  background: #D61E29;
  text-decoration: none;
}

.faq-contant-sec1 a:hover{
  border:solid 1px #D61E29;
  color: #fff;
  background: #D61E29;
  text-decoration: none;
}

.faq-contant-sec1 a{
    text-decoration: none;
    color: #515C6F;
}

.faq-contant-sec1 .box{
    position: relative;
    width: 260px;
    border:#a29e9e solid 1px;
    margin: 11px 17px;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}

.faq-contant-sec1 p{
    text-align: center;
}

.faq-contant-sec1 .box-icon{
    position: absolute;
    right: 6px;
    top: 6px;
    font-size: large;
}

.faq-contents .panel-border{
    border: #dee2e6 1px solid !important;
    color: #212529;
}

.faq-contents hr{
    border-top: 1px solid #aba9a9 !important;
}

.faq-contents a{
    color: #515C6F;
}

.faq-contents .underline{
    text-decoration: underline;
}

.faq-contents .form-button{
    padding: 12px;
    width: fit-content;
    color: white;
    background-color: mediumaquamarine;
    text-decoration: none;
}


/* アコーディオンA */
.ac-box{
width: auto;
margin: 0px auto 0px;
}

/*ラベル*/
.ac-box label{
  font-size: 16px;
  text-align: left;
  margin: auto;
  position: relative;
  display: block;
  cursor: pointer;
  color: #212529 !important;
  transition: all 0.5s;
  font-weight: 500;
  border: none;
  border-top: dotted 1px #ccc;
  padding: 1.25rem 1.5rem;
}

.ac-box.last-child{
  border-bottom: dotted 1px #ccc;
}

/*チェックを隠す*/
.ac-box input{
display: none;
}

/*チェックのアイコン（↓）*/
.ac-box label:before{
  font-family: "Font Awesome 5 Free";
  content: "\f067";
  font-weight: 600;
  margin-right: 15px;
}

/*チェックのアイコン（↑）*/
.ac-box input:checked ~ label::before {
  font-family: "Font Awesome 5 Free";
  content: "\f00d"!important;
  font-weight: 600;
}

/*中身を非表示にしておく*/
.ac-box div{
height: 0px;
padding: 0px;
overflow: hidden;
opacity: 0;
transition: 0.8s;


}

/*クリックで中身を表示*/
.ac-box input:checked ~ div{
  height: auto;
  opacity: 1;
  transition: 0.8s;
}

/*表示内容の調整*/
.ac-box div p{
  color: #212529;
  text-align: justify;
  overflow: hidden;
  padding:1.25rem;

}

.ac-small p{
margin-bottom: 0px;
transition: 0.8s;
}

.ac-small a{
  color: #D61E29;
}

.ac-small a:hover{
  color: #D61E29;
  text-decoration: underline;
}

.faq-contant-sec2 h3{
  font-size: 20px;
  color: #515C6F;
  margin-top: 50px;
  margin-bottom: 30px;
  font-weight: bold;
}

.faq-contant-sec2 h3::after{
  content: "";
  display: block;
  height: 5px;
  width: 8%;
  background: #FFB835;
  margin: 30px 0 30px 0;

}

/* iphone5 */
@media only screen and (min-device-width:320px) and (max-device-width:568px) {
  .faq-contant-sec2 h3::after,
  .faq-contant-sec1 h1:after {
    width: 25%;
  }

  section.faq-contant-sec1 .container {
    padding: 40px 0 0px;
  }

  .faq-contant-sec1 h1 {
    font-size: 36px;
  }

  .faq-contant-sec1 li{
    margin: 0.4rem 0.2rem;
    
  }

  .faq-contant-sec1 li a{
    word-break: break-all;
    display: table-cell;
    font-size: 14px;
    padding: 0.4rem 1.3rem 0.4rem;
  }



}

/* iphoneX */
@media only screen and (min-device-width:375px) and (max-device-width:667px) {

}

@media only screen and (min-device-width:414px) and (max-device-width:767px) {

  .faq-contant-sec1 li a{
    word-break: break-all;
    display: table-cell;
    font-size: 14px;
    padding: 0.4rem 1.8rem 0.4rem;
  }
}

/* ipad */
@media screen and (min-width:768px) {

  .faq-contant-sec1 h1{
    font-size: 36px;
  }

  .faq-contant-sec1 h1:after {
    width: 8%;
}

.faq-contant-sec2 h3{
  font-size: 24px;
}



.faq-contant-sec1 li.forth-child, .faq-contant-sec1 li.six-child {
    margin-left: 0.6rem;
    margin-right: 0.6rem;
}


}


/*ipad pro */
@media(min-width: 1024px) and (max-device-width:1200px) {



}

/*pc */
@media(min-width: 1200px) {


}

/* @media(min-width: 1600px) {
    .faq-contant-sec1 .row{
        width: 500px;
    }
} */

.faq__talk-examples {
  background: #fff;
  border: 2px dotted #d21b2b;
  margin: 24px auto;
  padding: 12px 24px;
  width: 80%;
}

/* --------------------------------
    Youtube動画の表示
-------------------------------- */
.youtube-wrapper {
    max-width: 600px;
    margin: 0 auto;
    padding-bottom: 20px;
}
.youtube {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
}
.youtube iframe {
    position: absolute;
    width: 100%;
    height: 100%;
}
