/* =========================================================
   CROWNBARSHOP FAQ V1
========================================================= */

.cbs-faq{
  padding:88px 0 92px;
  background:#fff;
}

.cbs-faq-layout{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:90px;
  align-items:start;
}


/* LEFT */

.cbs-faq-head{
  position:sticky;
  top:30px;
}

.cbs-faq-kicker{
  margin:0 0 11px;
  color:#dc171d;
  font-size:10px;
  font-weight:800;
  letter-spacing:2.5px;
}

.cbs-faq-head h2{
  margin:0;
  color:#151515;
  font-size:43px;
  line-height:1.08;
  letter-spacing:-1.6px;
}

.cbs-faq-head > p:last-child{
  max-width:390px;
  margin:16px 0 0;
  color:#777975;
  font-size:14px;
  line-height:1.65;
}


/* FAQ */

.cbs-faq-list{
  border-top:1px solid #dedfdb;
}

.cbs-faq-item{
  border-bottom:1px solid #dedfdb;
}

.cbs-faq-item summary{
  position:relative;

  min-height:75px;

  padding:25px 48px 25px 0;

  display:flex;
  align-items:center;

  color:#171717;

  font-size:16px;
  line-height:1.45;
  font-weight:700;

  cursor:pointer;

  list-style:none;
}

.cbs-faq-item summary::-webkit-details-marker{
  display:none;
}


/* PLUS */

.cbs-faq-item summary span{
  position:absolute;
  right:2px;
  top:50%;

  width:22px;
  height:22px;

  transform:translateY(-50%);
}

.cbs-faq-item summary span::before,
.cbs-faq-item summary span::after{
  content:"";

  position:absolute;
  left:50%;
  top:50%;

  width:14px;
  height:1.5px;

  background:#171717;

  transform:translate(-50%,-50%);
}

.cbs-faq-item summary span::after{
  transform:
    translate(-50%,-50%)
    rotate(90deg);

  transition:transform .2s ease;
}

.cbs-faq-item[open] summary span::after{
  transform:
    translate(-50%,-50%)
    rotate(0);
}


/* ANSWER */

.cbs-faq-answer{
  padding:0 55px 25px 0;
}

.cbs-faq-answer p{
  max-width:650px;

  margin:0;

  color:#6d706b;

  font-size:14px;
  line-height:1.7;
}


/* MOBILE */

@media(max-width:760px){

  .cbs-faq{
    padding:60px 0 65px;
  }

  .cbs-faq-layout{
    display:block;
  }

  .cbs-faq-head{
    position:static;
    margin-bottom:30px;
  }

  .cbs-faq-head h2{
    font-size:33px;
    letter-spacing:-1px;
  }

  .cbs-faq-head > p:last-child{
    font-size:14px;
  }

  .cbs-faq-item summary{
    min-height:68px;

    padding:
      21px
      42px
      21px
      0;

    font-size:14px;
  }

  .cbs-faq-answer{
    padding:
      0
      38px
      21px
      0;
  }

  .cbs-faq-answer p{
    font-size:13px;
  }

}
