:root {
  --mh--breakpoint--min: 375px;
  --mh--breakpoint--sm: 640px;
  --mh--breakpoint--md: 768px;
  --mh--breakpoint--lg: 1100px;
  --mh--breakpoint--xl: 1280px;
  --mh--breakpoint--x2l: 1450px;
}

.faq-container {
  padding-top: 40px;
  padding-bottom: 85px;
}

@media (width >= 768px ) {
  .faq-container {
    padding-top: 84px;
    padding-bottom: 170px;
  }
}

/* faq-anchor
================================================== */

.faq-anchor {
  margin-bottom: 50px;
}

@media (width >= 768px ) {
  .faq-anchor {
    margin-bottom: var(--mh--space--md);
  }
}

/* faq-word
================================================== */

.faq-word__inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.faq-word .c-keyword-search01 {
  --_btn-size: 100px;
  --_input-gap: 5px;
}

.faq-word .c-keyword-search01__input {
  border: 1px solid var(--mh--color--grayscale-500);
}

.faq-word .c-keyword-search01__btn {
  position: relative;
  padding-left: 35px;
  font-size: var(--mh--font-size--x2s);
  text-align: left;
  background-color: var(--mh--color--primary-500);
}

.faq-word .c-keyword-search01__btn::before {
  position: absolute;
  inset-block: 0;
  left: 15px;
  width: 15px;
  height: 15px;
  margin-block: auto;
  content: "";
  background-color: var(--mh--color--grayscale-100);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215%22%20height%3D%2215%22%20fill%3D%22none%22%20viewBox%3D%220%200%2015%2015%22%3E%0A%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M14.224%2014.412a.797.797%200%200%201-.563-.232l-3.235-3.22a6.287%206.287%200%200%201-4.159%201.574C2.816%2012.534%200%209.718%200%206.267%200%202.816%202.816%200%206.267%200c3.451%200%206.267%202.816%206.267%206.267a6.075%206.075%200%200%201-1.068%203.48l3.307%203.307a.811.811%200%200%201%200%201.127.851.851%200%200%201-.564.23h.015ZM6.267%201.602a4.671%204.671%200%200%200-4.664%204.665%204.671%204.671%200%200%200%204.664%204.664%204.671%204.671%200%200%200%204.664-4.664%204.671%204.671%200%200%200-4.664-4.664Z%22%2F%3E%0A%3C%2Fsvg%3E%0A") no-repeat left top/cover;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215%22%20height%3D%2215%22%20fill%3D%22none%22%20viewBox%3D%220%200%2015%2015%22%3E%0A%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M14.224%2014.412a.797.797%200%200%201-.563-.232l-3.235-3.22a6.287%206.287%200%200%201-4.159%201.574C2.816%2012.534%200%209.718%200%206.267%200%202.816%202.816%200%206.267%200c3.451%200%206.267%202.816%206.267%206.267a6.075%206.075%200%200%201-1.068%203.48l3.307%203.307a.811.811%200%200%201%200%201.127.851.851%200%200%201-.564.23h.015ZM6.267%201.602a4.671%204.671%200%200%200-4.664%204.665%204.671%204.671%200%200%200%204.664%204.664%204.671%204.671%200%200%200%204.664-4.664%204.671%204.671%200%200%200-4.664-4.664Z%22%2F%3E%0A%3C%2Fsvg%3E%0A") no-repeat left top/cover;
}

@media (width >= 768px ) {
  .faq-word {
    width: 614px;
    margin-left: auto;
  }
  .faq-word__inner {
    flex-direction: row;
    gap: 45px;
    align-items: center;
  }
  .faq-word .c-keyword-search01 {
    --_btn-size: 120px;
  }
  .faq-word .c-keyword-search01__btn {
    padding-left: 40px;
  }
  .faq-word .c-keyword-search01__btn::before {
    left: 20px;
  }
}

@media (hover: hover) and (pointer: fine) {
  .faq-word .c-keyword-search01__btn:hover {
    background-color: var(--mh--color--grayscale-900);
  }
}

/* faq-sec
================================================== */

.faq-sec:not(.u-pt-lg) {
  padding-top: 50px;
}

@media (width >= 768px ) {
  .faq-sec:not(.u-pt-lg) {
    padding-top: 84px;
  }
}