*:where(:not(html,iframe,canvas,img,svg,video,audio):not(svg *,symbol *)){all:unset;display:revert}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}a,button{cursor:revert}ol,ul,menu,summary{list-style:none}ol{counter-reset:revert}img{max-inline-size:100%;max-block-size:100%}table{border-collapse:collapse}input,textarea{-webkit-user-select:auto}textarea{white-space:revert}meter{-webkit-appearance:revert;appearance:revert}:where(pre){all:revert;box-sizing:border-box}::placeholder{color:unset}:where([hidden]){display:none}:where([contenteditable]:not([contenteditable="false"])){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space;-webkit-user-select:auto}:where([draggable="true"]){-webkit-user-drag:element}:where(dialog:modal){all:revert;box-sizing:border-box}::-webkit-details-marker{display:none}

  body {
    font-family: YakuHanJP,游ゴシック体,YuGothic,游ゴシック,Yu Gothic,Noto Sans JP,Meiryo,sans-serif;
  }


    :root{
        --baseBlack:#303232;
        --basePointRed: #c21b39;
        --baseGray: #989695;

    }

  .quickAccess,.categoryList,.faqList {
      width: 900px;
      margin: 0 auto 30px;
  }
  
  h1 {
      /* font-size: 20px; */
      font-weight: bold;
      border-bottom: 1px solid var(--baseGray);
      padding-bottom: 10px;
      color: var(--basePointRed);
      font-size: 27px;
      margin-bottom: 20px;
  }
  
  
  .fqList {
      border: 1px solid var(--baseGray);
      border-radius: 15px;
      padding: 15px;
      margin: 15px 0 30px;
  }
  
  h2 {
      /*color: #989695;
      font-weight: bold;*/
      /* font-size: 16px; */
      margin-bottom: 1rem;
  }
  
  /* .fqList ul li>div {
      font-size: 15px;
  } */
  
  .fqQ:before {
      content:"Q";
      width: 1.1rem;
      height: 1rem;
      color: white;
      /* font-weight:bold; */
      background: var(--baseBlack);
      padding: .1rem .2rem;
      margin-right: 1rem;
      
  }
  .fqA:before {
      content:"A";
      width: 1.1rem;
      height: 1rem;
      color: white;
      /* font-weight:bold; */
      background: var(--basePointRed);
      /* padding: .1rem .2rem; */
      padding: 5px;

      margin-left: -1rem;
      margin-right: 1rem;
  }
  .fqQ,.fqA{
      letter-spacing: .08rem;
      margin-bottom: .4rem;
      line-height:1.5;
      cursor: pointer;
      font-size:16px;
  }
  .fqA{
      display:none;
      padding: .4rem;
      line-height: 1.8;
      padding-left: 1rem;
  }
  .fqA a {
  text-decoration: underline;
  color: royalblue;
  font-weight: bold;
  display: inline-block;
  width: 15%;
  }  
  .confirmList {
      display: flex;
      justify-content: space-between;
      margin-bottom: 60px;
  }
  
  .confirmList>div a {
      width: 100%;
      background: var(--baseBlack);
      color: #fff;
      display: block;
      text-align: center;
      padding: 1.5rem;
      font-weight: bold;
      margin-bottom: .4rem;
  }
  
  .confirmList>div {
      width: 49%;
      text-align: center;
  }
  
  .confirm {
      margin-bottom: 30px;
  }
  
  .searchBoxFaq form {
      display: block;
      border: solid 1px #989695;
      height: 2rem;
      cursor: pointer;
      margin-bottom: 1rem;
      width: 50%;
  }
  
  h3 {
      font-size: 15px;
  }
  
  .wordList ul {
      display: flex;
  }
  
  .wordList ul li {
      background: #d9d9d9;
      padding: 1rem 2rem 1rem 2rem;
      margin: 5px 0;
  }
  
  .wordList ul li+li {
      margin-left: .8rem;
  }
  
  .categoryAccess {
      padding: 30px;
      background: #f9f8f7;
  }
  .searchBoxFaq form input {
      width: 100%;
  }
  
  .categoryList ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
  }
  
  /* .categoryList ul li { */
   .categoryList ul a { 

      width: 24%;
      background: #fff;
      border: solid 2px #e6e6e6;
      /*color: #989695;*/
      box-sizing: border-box;
      padding: 1.5rem 0 1.5rem 4rem;
      margin-bottom: .6rem;
      position: relative;
      cursor: pointer;
  }
  
  .faqList ul li {
      background: #fff;
      padding: 1rem;
      border: solid 1px #e6e6e6;
      border-radius: 10px;
      cursor: pointer;
      font-size: 15px;
  }
  
  .faqList ul li+li {
      margin-top: .6rem;
  }
  .confirmList>div p {
      font-size: 12px;
  }
  .confirmList1,.confirmList2{ 
      position:relative;
  }
  .confirmList1:before,.confirmList2:before {
      position: absolute;
      left: 1.5rem;
      top: 1.5rem;
  }
  .confirmList1:before {
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/mail.png");
  filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);

  }
  .confirmList2:before {
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/mobile.png");
  filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);

  }
  
  .categoryList ul li:before {
      position: absolute;
      left: 1.2rem;
  }
  .categoryList ul .li1:before{
      content: url("https://asset.myfabius.jp/lib/fos/ecforce_assets/icon-user.svg");
  }
  .categoryList ul .li2:before{
      content: url("https://asset.myfabius.jp/lib/fos/ecforce_assets/icon-recycle.svg");
  }
  .categoryList ul .li3:before{
      content: url("https://asset.myfabius.jp/lib/fos/ecforce_assets/icon-cart.svg");
  }
  .categoryList ul .li4:before{
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/card.png");
  }
  .categoryList ul .li5:before{
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/point.png");
  }
  .categoryList ul .li6:before{
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/location.png");
  }
  .categoryList ul .li7:before{
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/pass.png");
  }
  .categoryList ul .li8:before{
      content: url("https://asset.myfabius.jp/lib/fos/mypage_faq/icon/login.png");
  }
  
  .fqA img {
  width: 100%;
  vertical-align: top;
  border:solid 1px #ccc;
  display: inline;
  }

  @media screen and (max-width: 600px) {
    .quickAccess,.categoryList,.faqList {
      width: 90%;
      margin: 0 auto;
  }
  /* h2 {
      font-size: 1.2rem;
  }
  .fqList ul li>div {
      font-size: 1.1rem;
  } */
  .fqQ,.fqA{
      margin-bottom: 1rem;
  }
  .confirmList {
      flex-direction: column;
  }
  .confirmList>div {
      width: 100%;
      text-align: center;
      margin-bottom: 1rem;
  }
  /* h3 {
      font-size: 14px;
  } */
  .categoryAccess{
    padding: 30px 0;
  }
  .categoryList ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin-bottom: 2rem;
  }
  /* .categoryList ul li { */
  .categoryList ul a {

    width: 49%;
  }
  /* .faqList ul li {
      font-size: 1.1rem;
  } */
  .fqA a {
  width: unset;
  text-decoration: underline;
  color: royalblue;
  font-weight: bold;
  display: inline-block;
  }
  .fqA img {
  width: 100%;
  display: inline;
  vertical-align: top;
  border:solid 1px #ccc;
  }
  .lbx{width: 20% !important}   
  }