@charset "UTF-8";

main {
  padding: 6.4vw 0;
  background-color: #fffaf0;
}

a{
   word-break: break-all;
}

.faqList__desc img {
    margin: 5px auto 20px auto;
    border-radius: 10px;
}

.pageTitle {
  height: 11.466667vw;
  margin-bottom: 6.4vw;
  background: transparent url('../images/faq/h2_title.png') 50% 0 no-repeat;
  background-size: auto 100%;
  white-space: nowrap;
  text-indent: 101%;
  overflow: hidden;
}

.pageTitle02 {
  height: 11.466667vw;
  margin-bottom: 6.4vw;
  background: transparent url('../images/guide/h2_title02.png') 50% 0 no-repeat;
  background-size: auto 100%;
  white-space: nowrap;
  text-indent: 101%;
  overflow: hidden;
}

.faqWrap {
  margin: 0 auto;
  padding: 0 8vw;
}

.faq {
  border: 1px solid #ada39c;
  border-radius: 7px;
  background-color: #fff;
}

.faq + .faq {
  margin-top: 5.333333vw;
}

.faq__title {
  position: relative;
  height: 4vw;
  padding: 14px 0;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: auto calc(100% - 28px);
  white-space: nowrap;
  text-indent: 101%;
  overflow: hidden;
  cursor: pointer;
}

.faq__title_2 {
  position: relative;
  height: 5.5vw;
  padding: 14px 0;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: auto calc(100% - 28px);
  white-space: nowrap;
  text-indent: 101%;
  overflow: hidden;
  cursor: pointer;
}

.faq__title_3 {
  position: relative;
  padding: 10px 0;
  overflow: hidden;
  cursor: pointer;
  color: #75645C;
  font-family: "fot-tsukuardgothic-std", "sans-serif","sans-serif","ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","ヒラギノ角ゴシック","Hiragino Sans","游ゴシック","Yu Gothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic", sans-serif;
  text-align: center;
  font-weight: 700;
  font-size: 2.0rem;
}

.faq__title--cat01 { background-image: url('../images/faq/h3_category01.png'); }
.faq__title--cat02 { background-image: url('../images/faq/h3_category02.png'); }
.faq__title--cat03 { background-image: url('../images/faq/h3_category03.png'); }
.faq__title--cat04 { background-image: url('../images/faq/h3_category04.png'); }
.faq__title--cat05 { background-image: url('../images/faq/h3_category05.png'); }
.faq__title--cat06 { background-image: url('../images/faq/h3_category06.png'); }
.faq__title--cat07 { background-image: url('../images/faq/h3_category07.png'); }
.faq__title--cat08 { background-image: url('../images/faq/h3_category08.png'); }
.faq__title--cat09 { background-image: url('../images/faq/h3_category09.png'); }
.faq__title--cat10 { background-image: url('../images/faq/h3_category10.png'); }
.faq__title--cat11 { background-image: url('../images/faq/h3_category11.png'); }
.faq__title--cat12 { background-image: url('../images/faq/h3_category12.png'); }
.faq__title--cat13 { background-image: url('../images/faq/h3_category13.png'); }
.faq__title--cat14 { background-image: url('../images/faq/h3_category14.png'); }
.faq__title--cat15 { background-image: url('../images/faq/h3_category15.png'); }
.faq__title--cat16 { background-image: url('../images/faq/h3_category16.png'); }
.faq__title--cat17 { background-image: url('../images/faq/h3_category17.png'); }
.faq__title--cat18 { background-image: url('../images/faq/h3_category18.png'); }
.faq__title--cat19 { background-image: url('../images/faq/h3_category19.png'); }

.faq__title::after {
  position: absolute;
  top: calc(50% - 8px);
  right: 3.947368%;
  width: 16px;
  height: 16px;
  background: transparent url('../images/faq/faqTitle_arrow.png') 50% 50% no-repeat;
  background-size: 100%;
  transition: all .2s;
  content: "";
}

.faq__title_2::after {
  position: absolute;
  top: calc(50% - 8px);
  right: 3.947368%;
  width: 16px;
  height: 16px;
  background: transparent url('../images/faq/faqTitle_arrow.png') 50% 50% no-repeat;
  background-size: 100%;
  transition: all .2s;
  content: "";
}

.faq__title_3::after {
  position: absolute;
  top: calc(50% - 8px);
  right: 3.947368%;
  width: 16px;
  height: 16px;
  background: transparent url('../images/faq/faqTitle_arrow.png') 50% 50% no-repeat;
  background-size: 100%;
  transition: all .2s;
  content: "";
}

.faq__title.is-active::after {
  transform: rotate(-180deg);
}

.faq__title_2.is-active::after {
  transform: rotate(-180deg);
}

.faq__title_3.is-active::after {
  transform: rotate(-180deg);
}

.faqList {
  display: none;
  color: #5e4b44;
}

.faqList__title {
  padding: 6.389776% 6.389776% 1.277955%;
  border-top: 1px dashed #707070;
  font-size: 1.4rem;
}

.faqList__desc {
  padding: 0 6.389776% 6.389776%;
  font-size: 1.2rem;
}

@media screen and (min-width: 768px) {
  main { padding: 3.515625vw; }

  .pageTitle {
    height: 4.0625vw;
    max-height: 52px;
    margin-bottom: 3.515625vw;
  }

  .faqWrap {
    width: 59.375vw;
    max-width: 760px;
    padding: 0;
  }

  .faq + .faq {
    margin-top: 3.947368%;
  }

  .faq__title {
    height: 2.03125vw;
    max-height: 26px;
    padding: 28px 0;
    background-size: auto calc(100% - 56px);
  }

   .faq__title_2 {
    height: 2.5vw;
    max-height: 30px;
    padding: 28px 0;
    background-size: auto calc(100% - 54px);
  }

   .faq__title_3 {
    padding: 20px 0;
    background-size: auto calc(100% - 54px);
    font-size: 2.8rem;
  }

  .faq__title::after {
    top: 50%;
    right: 3.957784%;
    width: 4.166667%;
    height: 0;
    margin-top: -2.083333%;
    padding-top: 4.166667%;
    overflow: hidden;
  }


  .faq__title_2::after {
    top: 50%;
    right: 3.957784%;
    width: 4.166667%;
    height: 0;
    margin-top: -2.083333%;
    padding-top: 4.166667%;
    overflow: hidden;
  }

  .faq__title_3::after {
    top: 50%;
    right: 3.957784%;
    width: 4.166667%;
    height: 0;
    margin-top: -2.083333%;
    padding-top: 4.166667%;
    overflow: hidden;
  }


  .faqList__title {
    padding: 5.277045% 5.277045% 1.055409%;
    font-size: 2rem;
  }

  .faqList__desc {
    padding: 0 5.277045% 5.277045%;
    font-size: 1.5rem;
  }
}

.btn_kotu{
	max-width:200px;
	padding:5px;
}

.btn_soudan{
	margin-top:10px;
	max-width:100%;
	padding:5px;
}

.waku-soudan {
    padding: 20px;
    background-color: #ffe8c7;
    border-radius: 10px;
    margin-top: 20px;
}

.toiawase{
    margin: 10px 0 0 auto;
	text-align: right;
	color: #a96f32;
	font-weight:bold; 
}

.petsoudan {
    margin: 0 auto 5px auto;
    text-align: center;
    color: #a96f32;
    font-weight: bold;
    font-size: 2.2rem;
	font-family:FOT-筑紫A丸ゴシック Std E;
}

/*
.toiawase{
	max-width: 250px;
    margin: 20px 0 0 auto;
	text-align: right;
	color: #fff;
    padding: 5px;
    background-color: #a96f32;
    border-radius: 20px;
    box-shadow: 3px 3px #915e1f;
}*/

@media screen and (min-width: 768px) and (max-width: 1279px) {
  .faq__title { padding: 2.1875vw 0; background-size: auto calc(100% - 4.375vw); }
  .faqList__title { font-size: 1.6rem;}
  .faqList__desc { font-size: 1.3rem; }

  .faq__title_2 {
  	padding: 2.3vw 0;
  	background-size: auto calc(100% - 4.375vw);
  }

  .faq__title_3 {
  	padding: 2.3vw 0;
  	background-size: auto calc(100% - 4.375vw);
  }
 }

/*----歯磨き講座----*/
.relative {
    position: relative;
}

p.hamigaki_btn {
    position: absolute;
    bottom: 10%;
}

video.hamigaki_video {
    position: absolute;
    top: 17%;
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
}