@charset "UTF-8";

#question-banner {
  position: relative;
  min-height: 300px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center
}

#question-banner img {
  height: 100%;
  object-fit: cover
}

#question-banner .question-banner__main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

#question-banner .question-banner__title {
  color: #fff;
  font-size: 62px;
  font-weight: 400
}

#question-list .question-list__top {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-size: 36px;
  font-weight: 400
}

#question-list .question-list__top img {
  margin-right: 10px
}

#question-list .question-list__main {
  display: flex
}

#question-list .question-list__type {
  display: flex;
  flex-direction: column;
  width: 130px;
  margin-right: 110px
}

#question-list .question-list__type-item {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 16px 0 16px 26px;
  border-left: 2px solid transparent;
  margin-bottom: 48px;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  transition: linear .2s color
}

#question-list .question-list__type-item.is-active {
  border-left-color: #f08200;
  color: #f08200
}

#question-list .question-list__type-item:hover {
  color: #f08200
}

#question-list .question-list__list {
  display: flex;
  flex: 1;
  flex-direction: column
}

#question-list .question-list__list-item {
  margin-bottom: 32px
}

#question-list .question-list__list-item-q {
  position: relative;
  display: flex;
  align-items: center;
  align-self: stretch;
  background: #fafafa;
  color: #000;
  font-size: 24px;
  font-weight: 500;
  padding: 10px 16px 10px 60px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none
}

#question-list .question-list__list-item-q:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 16px;
  width: 28px;
  height: 28px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3csvg%20width='34'%20height='34'%20viewBox='0%200%2034%2034'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M17.0026%2031.1673C20.9146%2031.1673%2024.4563%2029.5816%2027.0199%2027.018C29.5836%2024.4543%2031.1693%2020.9126%2031.1693%2017.0007C31.1693%2013.0887%2029.5836%209.547%2027.0199%206.9833C24.4563%204.41964%2020.9146%202.83398%2017.0026%202.83398C13.0906%202.83398%209.54895%204.41964%206.98525%206.9833C4.4216%209.547%202.83594%2013.0887%202.83594%2017.0007C2.83594%2020.9126%204.4216%2024.4543%206.98525%2027.018C9.54895%2029.5816%2013.0906%2031.1673%2017.0026%2031.1673Z'%20fill='%23F08200'/%3e%3cpath%20d='M17%2020.2767V17.4434C19.3472%2017.4434%2021.25%2015.5406%2021.25%2013.1934C21.25%2010.8462%2019.3472%208.94336%2017%208.94336C14.6528%208.94336%2012.75%2010.8462%2012.75%2013.1934'%20stroke='white'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M16.9974%2026.651C17.9754%2026.651%2018.7682%2025.8582%2018.7682%2024.8802C18.7682%2023.9022%2017.9754%2023.1094%2016.9974%2023.1094C16.0194%2023.1094%2015.2266%2023.9022%2015.2266%2024.8802C15.2266%2025.8582%2016.0194%2026.651%2016.9974%2026.651Z'%20fill='white'/%3e%3c/svg%3e") center center no-repeat;
  background-size: cover
}

#question-list .question-list__list-item-q:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -4px;
  width: 10px;
  height: 9px;
  background: url("data:image/svg+xml,%3csvg%20width='10'%20height='10'%20viewBox='0%200%2010%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M5.23686%209.125L0.473721%200.874999L10%200.875L5.23686%209.125Z'%20fill='%23F08200'/%3e%3c/svg%3e") center center no-repeat;
  background-size: cover
}

#question-list .question-list__list-item-q.is-expand:after {
  transform: rotate(-90deg)
}

#question-list .question-list__list-item-a {
  color: #000;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  padding-top: 26px;
  padding-left: 60px
}

@media (max-width: 991px) {
  #question-banner .question-banner__title {
    font-size: 40px
  }

  #question-list .question-list__top {
    font-size: 24px
  }

  #question-list .question-list__top img {
    width: 24px
  }

  #question-list .question-list__list-item-q {
    font-size: 18px;
    padding-left: 50px
  }

  #question-list .question-list__type-item {
    font-size: 18px;
    padding: 10px 0 10px 26px;
    margin-bottom: 30px
  }

  #question-list .question-list__list-item-a {
    font-size: 14px;
    padding-left: 50px;
    padding-top: 15px
  }

  #question-list .question-list__list-item-q:before {
    width: 20px;
    height: 20px
  }

  #question-list .question-list__type {
    margin-right: 60px
  }
}

@media (max-width: 767px) {
  #question-list .question-list__main {
    flex-direction: column
  }

  #question-list .question-list__type {
    display: flex;
    flex-direction: row;
    width: auto;
    margin-right: 0;
    overflow-y: auto;
    white-space: nowrap;
    margin-bottom: 20px
  }

  #question-list .question-list__type-item {
    width: auto;
    border-left: 0;
    border-bottom: 2px solid transparent;
    padding: 0 10px;
    margin-bottom: 0
  }

  #question-list .question-list__type-item.is-active {
    border-bottom-color: #f08200
  }

  #question-list .question-list__list-item-q {
    font-size: 14px
  }

  #question-list .question-list__list-item-q {
    font-size: 12px
  }

  #question-list .question-list__type-item {
    font-size: 16px
  }

  #question-banner .question-banner__title {
    font-size: 30px
  }

  #question-banner {
    height: 300px
  }
}