@charset "utf-8";

/*------------  faq  ------------*/

#faq { box-sizing: border-box; margin: 0 auto; padding: 35px 3% 20px; max-width: 1080px; }
#faq .title { margin: 0 auto; padding: 0 0 30px; width: 232px; }
#faq .block { padding: 0 0 20px; }
#faq .block-inner { padding: 30px 4% 35px; background: #fff; border-radius: 18px; }
#faq .que { display: flex; padding: 0 0 24px; }
#faq .que .item { box-sizing: border-box; width: 68px; }
#faq .que .txt { box-sizing: border-box; padding: 0 0 0 1%; width: 90%; font-size: 18px; line-height: 1.6; font-weight: bold; }
#faq .ans { display: flex; }
#faq .ans .item { box-sizing: border-box; width: 68px; }
#faq .ans .txt { box-sizing: border-box; padding: 0 0 0 1%; width: 90%; font-size: 16px; line-height: 1.6; }
#faq .ans .txt a { text-decoration: underline; }

#faq .contact { padding: 20px 0 20px; }
#faq .contact-inner { padding: 35px 4% 50px; background: #fff; border-radius: 18px; }
#faq .contact-title { margin: 0 auto; padding: 0 0 10px; max-width: 576px; }
#faq .contact-notes { padding: 0 0 25px; font-size: 16px; font-weight: bold; line-height: 1.3; color: #008ac2; text-align: center; }
#faq .contact .company { display: flex; align-items: center; box-sizing: border-box; border-top: 1px solid #0b9ece; line-height: 1.3; }
#faq .contact .company .item1 { width: 28%; padding: 25px .5%; text-align: center; }
#faq .contact .company .item1 .name { font-family: 'Noto Sans JP', sans-serif; font-size: 22px; font-weight: 900; color: #008ac2; }
#faq .contact .company .item2 { width: 72%; padding: 25px .5%; }
#faq .contact .company .item2 .department { padding: 0 0 1px; font-size: 16px; }
#faq .contact .company .item2 .department span { font-size: 14px; }
#faq .contact .company .item2 .tel { display: inline-block; margin-right: 6px; font-family: 'Noto Sans JP', sans-serif; font-size: 26px; font-weight: 900; }
#faq .contact .company .item2 .break { position: relative; margin-right: 20px; }
#faq .contact .company .item2 .break:after { content: ""; position: absolute; right: -14px; top: 6px; width: 1px; height: 24px; border-left: 1px solid #323232; transform: rotate(20deg); }
#faq .contact .company .item2 .time { display: inline-block; font-family: sans-serif; font-size: 14px; }
#faq .contact .zensho { border-bottom: 1px solid #0b9ece; }


.btn-home { margin: 0 auto; padding: 0 0 70px; width: 320px; }
.btn-home a { display: block; height: 60px; background: url('/images/campaign/btn_home.png') no-repeat center #057eb0; background-size: 140px 18px; border-radius: 30px; text-indent: -9999px; overflow: hidden; }






@media screen and (max-width: 920px) {

  #faq .title { width: 210px; }
  #faq .contact-title { max-width: 540px; }
  #faq .contact .company .item1 .name { font-size: 20px; }
  #faq .contact .company .item2 .tel { font-size: 24px; }

}






@media screen and (max-width: 740px) {

  #faq { padding: 20px 3% 10px; }
  #faq .title { padding: 0 0 16px; width: 150px; }
  #faq .block { padding: 0 0 10px; }
  #faq .block-inner { padding: 18px 3% 22px; background: #fff; border-radius: 12px; }
  #faq .que { padding: 0 0 14px; }
  #faq .que .item { width: 40px; }
  #faq .que .txt { font-size: 14px; }
  #faq .ans .item { width: 40px; }
  #faq .ans .txt { font-size: 14px; }

  #faq .contact { padding: 13px 0 10px; }
  #faq .contact-inner { padding: 22px 4% 26px; border-radius: 12px; }
  #faq .contact-title { margin: 0 auto; padding: 0 0 8px; max-width: 380px; }
  #faq .contact-notes { padding: 0 0 18px; font-size: 14px; }
  #faq .contact .company { flex-direction: column; text-align: center; }
  #faq .contact .company .item1 { width: 100%; padding: 16px 0 0; }
  #faq .contact .company .item1 .name { font-size: 18px; }
  #faq .contact .company .item2 { width: 100%; padding: 6px 0 16px; }
  #faq .contact .company .item2 .department { padding: 0 0 4px; font-size: 14px; }
  #faq .contact .company .item2 .department span { font-size: 13px; }
  #faq .contact .company .item2 .tel { display: block; margin-right: 0; padding: 0 0 4px; font-size: 24px; }
  #faq .contact .company .item2 .break { margin-right: 0; padding: 0; }
  #faq .contact .company .item2 .break:after { display: none; }
  #faq .contact .company .item2 .time { display: block; font-size: 13px; }
  #faq .contact .zensho .item1 .name br { display: none; }

  .btn-home { padding: 0 0 30px; width: 260px; }
  .btn-home a { height: 48px; background-size: 108px 14px; border-radius: 24px; }

}

