/*!***************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./node_modules/import-glob-loader/index.js!./src/scss/page/document/faq.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";

/* ==========================================================================
   Foundation
   ========================================================================== */
/* ==========================================================================
   Object
   ========================================================================== */
/* Component
   ----------------------------------------------------------------- */
/* Bread
   ----------------------------------------------------------------- */
.c-bread {
  height: auto;
  width: 100vw;
  padding: 13px 0;
}
.c-bread--box {
  height: 100%;
  flex-wrap: wrap;
}
.c-bread--box,.c-bread--list {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  gap: 6px;
}
.c-bread--list:after {
  content: "＞";
  font-size: 10px;
  color: #C7C7C7;
  display: block;
}
.c-bread--list:last-child:after {
  display: none;
}

/* Menu 
   ----------------------------------------------------------------- */
.c-menu__box,.c-menu__list {
  width: 100%;
}
.c-menu__list {
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  margin: 21px 0 32px;
}
.c-menu__list--service {
  margin: 0px;
}
.c-menu__list__label {
  height: 53px;
  padding: 0 16px;
  border-bottom: 1px solid #e0e0e0;
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: justify;
          justify-content: space-between;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
}
.c-menu__list__label:after {
  content: "";
  display: block;
  width: 5px;
  height: 8px;
  background-image: url(/images/icon/parts/ico-arrow-right.png);
  background-size: cover;
  border-bottom: none;
}
.c-menu__list__label:hover {
  background: #FAFAFA;
  opacity: 1;
}
.c-menu__list__label--active {
  background: #FAFAFA;
}
.c-menu__list__label:last-child {
  border-bottom: none;
}

.c-faq__box {
  display: grid;
  grid-auto-rows: -webkit-max-content;
  grid-auto-rows: max-content;
  gap: 4px;
  padding-top: 72px;
}
.c-faq__box:first-child {
  padding-top: 54px;
}
.c-faq__list {
  padding: 18px 15px 17px 0;
  display: grid;
  grid-auto-rows: -webkit-max-content;
  grid-auto-rows: max-content;
  border-bottom: 1px solid #e0e0e0;
}
.c-faq__answer {
  grid-template-columns: 17px 1fr 16px;
  gap: 8px;
  margin-top: 12px;
  display: none;
}
.c-faq__answer:before {
  content: "";
  display: block;
  width: 17px;
  height: 17px;
}
.c-faq__answer:after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  margin-left: 8px;
}
.c-faq__question {
  display: grid;
  grid-template-columns: 17px 1fr 16px;
  gap: 8px;
}
.c-faq__question:before {
  width: 17px;
  height: 17px;
  background-color: #6FB92B;
  -webkit-mask-image: url(/images/icon/parts/ico-toolchip.png);
          mask-image: url(/images/icon/parts/ico-toolchip.png);
  -webkit-mask-size: cover;
          mask-size: cover;
  top: 3px;
}
.c-faq__question:after,.c-faq__question:before {
  content: "";
  display: block;
  position: relative;
}
.c-faq__question:after {
  width: 8px;
  height: 8px;
  margin-left: 8px;
  background-image: url(/images/icon/parts/ico-arrow-down2.png);
  background-size: 8px;
  background-repeat: no-repeat;
  background-position: center;
  top: 9px;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}
.c-faq__question--active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

/* Project
   ----------------------------------------------------------------- */
.p-mypage--box {
  padding: 24px 0 0px;
}

/* Mypage 
   ----------------------------------------------------------------- */
.p-mypage__column {
  display: grid;
  grid-template-columns: 252px 1fr;
  gap: min(4.7619047619vw, 80px);
}
.p-mypage__column,.p-mypage__column--leave {
  width: calc(100% - 80px);
  margin: 0 auto;
  max-width: 1100px;
}
.p-mypage__sort {
  display: grid;
  gap: 16px;
  grid-template-columns: 154px 1fr 154px;
  width: 100%;
}
.p-mypage__sort__box {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
          justify-content: space-between;
  gap: 16px;
}
.p-mypage__sort--purchase,.p-mypage__sort__box {
  -webkit-box-align: center;
          align-items: center;
}
.p-mypage__sort--purchase {
  grid-template-columns: 154px auto 62px;
}
.p-mypage__sort--purchase__name {
  display: grid;
  grid-template-columns: 336px -webkit-max-content;
  grid-template-columns: 336px max-content;
  gap: 6px;
  -webkit-box-align: end;
          align-items: flex-end;
  margin-left: auto;
}
.p-mypage__sort--purchase__button .c-button {
  width: 62px;
}
.p-mypage__sort--purchase__modal {
  padding: 32px 15px 24px;
  display: grid;
  gap: 32px;
}
.p-mypage__detail__grid-column {
  padding: 20px 17px 18px;
  border-top: 1px solid #e0e0e0;
  margin-top: 18px;
  grid-template-columns: 1fr 73px 98px 101px;
}
.p-mypage__detail__grid-column--non-option {
  margin-top: -18px;
  border-top: 0px;
}
.p-mypage__detail__grid-column--has {
  grid-template-columns: 100%;
}
.p-mypage__detail__grid-column--option {
  padding: 0px;
  margin: 0px;
}
.p-mypage__detail__grid-column--option--origin {
  gap: 7px;
  padding: 0 16px;
}
.p-mypage__detail__grid-column--none__box {
  grid-template-columns: 1fr 304px;
  border-top: none;
}
.p-mypage__detail__grid-column--none__box--has .c-list__grid-column--option--has__box {
  grid-template-columns: 1fr 304px;
}
.p-mypage__detail__return {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  margin: 64px auto 0;
}
.p-mypage__detail__list__box {
  overflow-x: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.p-mypage__detail__list__box::-webkit-scrollbar {
  display: none;
}
.p-mypage__detail__list__card {
  padding: 0px;
}
.p-mypage__detail__list__card--origin {
  padding: 1px 0 13px;
}
.p-mypage__detail__list__right {
  grid-column: 1/3;
}
.p-mypage__detail__list__head {
  min-width: 768px;
  width: 100%;
  grid-template-columns: 1fr 73px 98px 101px;
}
.p-service__box,.p-service__box--contact {
  display: grid;
  gap: 40px;
}
.p-service__box--faq {
  display: grid;
}
.p-service__grid--title {
  display: grid;
  gap: 16px;
}
.p-service__grid--title--contact {
  display: grid;
  gap: 32px;
}
.p-service__grid--title--faq {
  display: grid;
  gap: 24px;
  grid-auto-rows: -webkit-max-content;
  grid-auto-rows: max-content;
}
.p-service__grid--body {
  display: grid;
  gap: 8px;
}
.p-service__grid--faq {
  display: grid;
}
.p-service__title {
  margin-bottom: 40px;
}
.p-service__menu-link,.p-service__submit {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
}
.p-service__menu-link {
  padding: 8px 16px 9px;
  -webkit-box-align: center;
          align-items: center;
  border-radius: 30px;
  border: 1px solid #e0e0e0;
  background: #FAFAFA;
  gap: 8px;
}
.p-service__menu-link:after {
  content: "";
  display: block;
  width: 10px;
  height: 6px;
  background-image: url(/images/icon/parts/ico-arrow-down2.png);
  background-size: cover;
}
.p-service__menu-link__box {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 8px;
}

/* Utility
   ----------------------------------------------------------------- */

@media (max-width: 768px){
  .pc {
    display: none !important;
  }
  .c-menu__list {
    width: 100vw;
    position: relative;
    margin: 7px auto 0;
    left: 50%;
    overflow-x: scroll;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: -webkit-max-content;
    grid-auto-columns: max-content;
    border-top: none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-menu__list::-webkit-scrollbar {
    display: none;
  }
  .c-menu__list__label {
    border-bottom: none;
    background: #FAFAFA;
  }
  .c-menu__list__label:after {
    display: none;
  }
  .c-menu__list__label--active {
    border-bottom: 2px solid #767676 !important;
    position: relative;
    bottom: -1px;
  }
  .c-faq__box,.c-faq__box:first-child {
    padding-top: 41px;
  }
  .p-mypage--box {
    padding-bottom: 0px;
  }
  .p-mypage__column {
    grid-template-columns: 100%;
    gap: 16px;
  }
  .p-mypage__column,.p-mypage__column--leave {
    width: calc(100% - 30px);
  }
  .p-mypage__column--point {
    gap: 24px;
  }
  .p-mypage__column--activity {
    gap: 32px;
  }
  .p-mypage__column--message {
    gap: 16px;
  }
  .p-mypage__sort {
    grid-template-columns: 100%;
    padding: 32px 15px 24px;
  }
  .p-mypage__sort__button {
    width: 100%;
    margin-top: 22px;
  }
  .p-mypage__sort__button .c-button {
    width: 100%;
    height: 50px;
  }
  .p-mypage__sort--purchase {
    display: grid;
    grid-template-columns: 154px -webkit-max-content;
    grid-template-columns: 154px max-content;
    -webkit-box-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
            align-items: center;
    padding: 0px;
  }
  .p-mypage__sort--purchase__name {
    grid-template-columns: 65.3333333333vw -webkit-max-content;
    grid-template-columns: 65.3333333333vw max-content;
  }
  .p-mypage__sort--purchase__button .c-button {
    width: 100%;
  }
  .p-mypage__sort--point {
    padding: 0px;
  }
  .p-mypage__sort--point__box {
    display: grid;
    grid-template-columns: 154px -webkit-max-content;
    grid-template-columns: 154px max-content;
    -webkit-box-align: center;
            align-items: center;
  }
  .p-mypage__detail__grid-column,.p-mypage__sort--point__box {
    -webkit-box-pack: justify;
            justify-content: space-between;
  }
  .p-mypage__detail__grid-column {
    padding: 16px 0px 14px;
    grid-template-columns: 1fr -webkit-max-content;
    grid-template-columns: 1fr max-content;
    border-bottom: none;
    position: relative;
    margin-top: 0px;
    border-top: none;
    width: 100%;
  }
  .p-mypage__detail__grid-column:after,.p-mypage__detail__grid-column:before {
    content: "";
    width: 100vw;
    display: block;
    position: absolute;
    bottom: 0px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    background: #E0E0E0;
    height: 1px;
  }
  .p-mypage__detail__grid-column:before {
    top: 0px;
  }
  .p-mypage__detail__grid-column--has {
    grid-template-columns: 100%;
  }
  .p-mypage__detail__grid-column--option {
    margin: 16px 0;
    overflow: unset;
  }
  .p-mypage__detail__grid-column--option .c-list__grid-column.c-list__grid-column--detail {
    grid-template-columns: 100%;
  }
  .p-mypage__detail__grid-column--option--origin {
    padding: 0px;
  }
  .p-mypage__detail__grid-column--none__box {
    border-bottom: none;
    position: relative;
  }
  .p-mypage__detail__grid-column--none__box:after {
    content: "";
    display: block;
    position: absolute;
    width: 100vw;
    height: 1px;
    background: #E0E0E0;
    bottom: 0px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .p-mypage__detail__grid-column--none__box--has .c-list__grid-column--option--has__box {
    grid-template-columns: 100%;
  }
  .p-mypage__detail__return,.p-mypage__detail__return .c-button {
    width: 100%;
  }
  .p-mypage__detail__list__box {
    overflow-x: unset;
    margin: 8px 0;
  }
  .p-mypage__detail__list__box .c-list__box {
    width: 100%;
    overflow-x: unset;
  }
  .p-mypage__detail__list__card {
    padding: 0px;
    border-bottom: none;
  }
  .p-mypage__detail__list__card:nth-child(2) {
    border-top: none;
    border-bottom: none;
    position: relative;
  }
  .p-mypage__detail__list__card:nth-child(2):before {
    top: 0px;
  }
  .p-mypage__detail__list__card:nth-child(2):after,.p-mypage__detail__list__card:nth-child(2):before {
    content: "";
    width: 100vw;
    display: block;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    background: #E0E0E0;
    height: 1px;
  }
  .p-mypage__detail__list__card:nth-child(2):after {
    bottom: 0px;
  }
  .p-mypage__detail__list__right {
    grid-column: 1/2;
  }
  .p-mypage__detail__list__option {
    grid-column: unset;
    display: -webkit-box;
    display: flex;
    margin-left: unset;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-pack: justify;
            justify-content: space-between;
  }
  .p-mypage__info__button {
    margin-bottom: 32px;
  }
  .p-service__box--contact {
    gap: 32px;
  }
  .p-service__grid--title--contact {
    gap: 16px;
  }
  .p-service__grid--title--faq {
    gap: 20px;
  }
  .p-service__title {
    margin-bottom: 24px;
  }
  .p-service__list__content:first-child {
    padding: 16px 0px 21px;
    border-top: 1px solid #e0e0e0;
  }
  .p-service__main .p-mypage--box {
    padding-top: 0px;
  }
  .p-service__main .c-menu__list {
    margin-top: 0px;
  }
  .p-service__submit,.p-service__submit .c-button {
    width: 100%;
  }
}

@media (min-width: 769px){
  .sp {
    display: none !important;
  }
  .p-mypage__sort__button .c-button {
    height: 44px;
    width: 92px;
  }
  .p-mypage__detail__grid-column,.p-mypage__detail__grid-column--none__box,.p-mypage__detail__grid-column--none__box--has {
    min-width: 768px;
    width: 100%;
  }
  .p-mypage__detail__grid-column--none__box--has .c-list__grid-column--option--has__box {
    min-width: 736px;
    width: 100%;
  }
  .p-mypage__detail__list__card {
    width: 100%;
    min-width: 768px;
  }
}

/*# sourceMappingURL=faq.css.map*/