/* ---------------------------------------------------
	common
------------------------------------------------------ */
#pagetit {
  background: url(../img/faq/pagetit_bg.jpg) center;
  background-size: cover;
}

@media screen and (max-width: 810px) {
  #pagetit {
    background: url(../img/faq/pagetit_bg_sp.jpg) center;
    background-size: cover;
  }
}
/* ---------------------------------------------------
	faq_sec
------------------------------------------------------ */
#faq_sec {
  padding: 72px 0 128px;
}
#faq_sec .faq_list {
  letter-spacing: 0.1em;
  counter-reset: faq-q;
}
#faq_sec .faq_list .list_row + .list_row {
  margin-top: 24px;
}
#faq_sec .faq_list dt {
  position: relative;
  background: #434343;
  padding: 20px 24px 20px 128px;
  cursor: pointer;
  line-height: 1.75;
}
#faq_sec .faq_list dt::before, #faq_sec .faq_list dt::after {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  top: 50%;
  width: 13px;
  height: 1px;
  background: #bc9f77;
}
#faq_sec .faq_list dt::after {
  transform: rotate(90deg);
}
#faq_sec .faq_list dt.open::after {
  opacity: 0;
}
#faq_sec .faq_list dd {
  position: relative;
  display: none;
  padding: 16px 50px 32px 128px;
  border-bottom: 1px solid #bc9f77;
}
#faq_sec .faq_list .q,
#faq_sec .faq_list .a {
  position: absolute;
  left: 50px;
  top: 20px;
  color: #bc9f77;
  font-size: 2.4rem;
  font-family: "DM Serif Display", serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}
#faq_sec .faq_list .q::after {
  counter-increment: faq-q;
  content: counter(faq-q, decimal-leading-zero);
  margin-left: 0.2em;
}
#faq_sec .faq_list .a {
  left: 78px;
  top: 28px;
  color: #78c2c4;
}

@media screen and (max-width: 810px) {
  #faq_sec {
    padding: 32px 0 64px;
  }
  #faq_sec .faq_list {
    letter-spacing: 0.05em;
  }
  #faq_sec .faq_list .list_row + .list_row {
    margin-top: 8px;
  }
  #faq_sec .faq_list dt {
    padding: 48px 32px 16px 16px;
  }
  #faq_sec .faq_list dt::before, #faq_sec .faq_list dt::after {
    right: 16px;
  }
  #faq_sec .faq_list dd {
    padding: 16px 16px 16px 44px;
  }
  #faq_sec .faq_list .q,
  #faq_sec .faq_list .a {
    left: 16px;
    top: 16px;
    font-size: 2.4rem;
  }
  #faq_sec .faq_list .q::after {
    margin-left: 0.2em;
  }
  #faq_sec .faq_list .a {
    left: 16px;
    top: 20px;
  }
}
/* ---------------------------------------------------
	mail
------------------------------------------------------ */
#mail {
  padding: 72px 0 128px;
}
#mail .mail_txt {
  max-width: 980px;
  margin: 0 auto;
}
#mail .mail_btn {
  line-height: 1;
  margin-top: 64px;
  text-align: center;
}
#mail .mail_btn .btn {
  width: 420px;
  padding: 28px;
}
#mail .mail_btn .btn .icon {
  position: absolute;
  left: 24px;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

@media screen and (max-width: 810px) {
  #mail {
    padding: 32px 0 64px;
  }
  #mail .mail_btn {
    margin-top: 32px;
  }
  #mail .mail_btn .btn {
    width: 420px;
    padding: 20px;
  }
  #mail .mail_btn .btn .icon {
    left: 20px;
  }
}
/* ---------------------------------------------------
	tel
------------------------------------------------------ */
#tel {
  padding: 72px 0 192px;
  text-align: center;
}
#tel .tel_logo {
  margin-bottom: 16px;
  line-height: 1;
}
#tel .tel_txt {
  line-height: 2.25;
}
#tel .tel_num {
  width: max-content;
  max-width: 100%;
  margin: 48px auto 0;
  padding-bottom: 16px;
  border-bottom: 1px solid #78c2c4;
  line-height: 1.5;
}
#tel .tel_num .color {
  display: inline-block;
  margin-bottom: 16px;
  color: #78c2c4;
  font-size: 2.8rem;
  font-weight: 400;
  line-height: 1;
}
#tel .tel_num .color .big {
  font-weight: inherit;
  font-size: 4.6rem;
}
#tel .tel_num .color a {
  font-weight: inherit;
}

@media screen and (max-width: 810px) {
  #tel {
    padding: 32px 0 64px;
  }
  #tel .tel_logo img {
    width: 240px;
    height: auto;
  }
  #tel .tel_num {
    margin-top: 40px;
  }
  #tel .tel_num .color {
    margin-bottom: 8px;
    font-size: 2.2rem;
  }
  #tel .tel_num .color .big {
    font-size: 3.1rem;
  }
}