#pageHeader .top {
  background-image: url("../../img/faq/q_a_top_image.jpg"); }
@media screen and (max-width: 781px) {
  #pageHeader .top {
    background-image: url("../../img/faq/q_a_top_image_sp.jpg"); } }

#head {
  background-color: #f5f2ec;
  text-align: center; }
  #head .descript {
    font-size: 1.3125em;
    line-height: 1.75; }
  @media screen and (max-width: 781px) {
    #head .descript {
      font-size: 0.9375em;
      line-height: 1.4666666667; } }

#category {
  background-color: #f5f2ec; }
  #category .base {
    background-color: #FFF;
    padding: 0.9375em 4.375em; }
    #category .base .cols .col {
      border-bottom: 1px solid #888;
      padding: 1.375em 0; }
      #category .base .cols .col a {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 1.3125em;
        font-weight: bold; }
      #category .base .cols .col:nth-last-child(1), #category .base .cols .col:nth-last-child(2):nth-child(2n+1) {
        border-bottom: none; }
  @media screen and (max-width: 781px) {
    #category .base {
      padding: 0.3125em 1.25em; }
      #category .base .cols .col {
        padding: 0.625em 0; }
        #category .base .cols .col a {
          font-size: 1.0625em; } }

#faq {
  background-color: #f5f2ec; }

.faqGroup {
  background-color: #FFF; }
  .faqGroup:not(:last-child) {
    margin-bottom: 5em; }
  .faqGroup .head {
    background-color: #35200c;
    height: 3.125em;
    display: flex;
    align-items: center;
    justify-content: center; }
    .faqGroup .head .ttl {
      color: #FFF;
      font-size: 1.3125em;
      font-weight: bold; }
  .faqGroup .faqlist {
    padding: 1.25em 4.375em; }
    .faqGroup .faqlist .fl_item {
      padding: 1.875em 0; }
      .faqGroup .faqlist .fl_item:not(:last-child) {
        border-bottom: 1px solid #888; }
      .faqGroup .faqlist .fl_item .question,
      .faqGroup .faqlist .fl_item .answer {
        position: relative;
        padding-left: 2.5em; }
        .faqGroup .faqlist .fl_item .question::before,
        .faqGroup .faqlist .fl_item .answer::before {
          font-size: 2.1875em;
          line-height: 1;
          font-weight: bold;
          font-family: 'Lato', sans-serif;
          position: absolute;
          top: 0;
          left: 0.3428571429em;
          transform: translateX(-50%); }
      .faqGroup .faqlist .fl_item .question {
        padding-top: 0.125em;
        padding-bottom: 0.125em;
        padding-right: 3.75em;
        cursor: pointer; }
        .faqGroup .faqlist .fl_item .question::before {
          content: "Q";
          color: #e95469; }
        .faqGroup .faqlist .fl_item .question > .arrow {
          position: absolute;
          right: 1.875em;
          top: 0.625em;
          width: 1.125em;
          height: 1.125em;
          transform: translateX(50%); }
          .faqGroup .faqlist .fl_item .question > .arrow::before, .faqGroup .faqlist .fl_item .question > .arrow::after {
            content: "";
            display: block;
            width: 100%;
            height: 3px;
            border-radius: 2px;
            background-color: #e95469;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
            -moz-transition: -moz-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
            transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }
        .faqGroup .faqlist .fl_item .question > .txt {
          font-size: 1.125em;
          font-weight: bold;
          color: #e95469; }
      .faqGroup .faqlist .fl_item .answer {
        display: none;
        padding-top: 0.625em; }
        .faqGroup .faqlist .fl_item .answer::before {
          content: "A";
          color: #44bcdd;
          top: 0.2285714286em; }
      .faqGroup .faqlist .fl_item:not(._open) .question > .arrow::after {
        transform: translate(-50%, -50%) rotate(-90deg); }
  @media screen and (max-width: 781px) {
    .faqGroup:not(:last-child) {
      margin-bottom: 2.375em; }
    .faqGroup .head {
      height: 2.5em; }
      .faqGroup .head .ttl {
        font-size: 1.0625em; }
    .faqGroup .faqlist {
      padding: 1.25em 1.25em;
      padding-top: 0; }
      .faqGroup .faqlist .fl_item {
        padding: 1em 0; }
        .faqGroup .faqlist .fl_item .question,
        .faqGroup .faqlist .fl_item .answer {
          padding-left: 1.8125em; }
          .faqGroup .faqlist .fl_item .question::before,
          .faqGroup .faqlist .fl_item .answer::before {
            font-size: 1.53125em;
            top: 0.1632653061em;
            left: 0.306122449em; }
        .faqGroup .faqlist .fl_item .question {
          padding-top: 0.3125em;
          padding-bottom: 0.3125em;
          padding-right: 2.8125em; }
          .faqGroup .faqlist .fl_item .question > .arrow {
            right: 1.0625em;
            top: 0.625em;
            width: 1em;
            height: 1em; }
          .faqGroup .faqlist .fl_item .question > .txt {
            font-size: 1em;
            line-height: 1.6666666667; }
        .faqGroup .faqlist .fl_item .answer {
          padding-top: 0.5625em; }
          .faqGroup .faqlist .fl_item .answer::before {
            top: 0.3265306122em; }
          .faqGroup .faqlist .fl_item .answer > .txt {
            font-size: 1em;
            line-height: 1.6153846154; } }
