@charset "utf-8";
@import url("root.css");
@import url("parts/mv.css");

/*-----*ブレイクポイントルール*-----*/
/* スマートフォン：max-width:599px */
@media ( max-width: 599px ) {
}

/* タブレット：min-width:600px */
@media ( min-width: 600px ) {
}

/* PC：min-width:1025px */
@media ( min-width: 1025px ) {
}

/***************************************
------------- TOP COMMON -------------
***************************************/
.top_ttl {
  font-size: clamp(3.3rem, 3vw, 4.8rem);
  font-weight: 600;
  color: #555555;
  margin-bottom: 0.4em;
  line-height: 1.2;
  font-family: var(--title-font-family);
}

/* PC */
@media screen and (min-width: 1025px) {
  .tablet-only {
    display: none;
  }
}

/* SP */
@media screen and (max-width: 599px) {
  .sp-text-center {
    text-align: center;
  }

  .tablet-only {
    display: none;
  }
}

/***************************************
------------- MV ------------
***************************************/

@media screen and (max-width: 768px) {
  .souba_grid {
    grid-template-columns: 48% 48%;
    .col-3 { grid-column:auto; }
  }
}


/***************************************
------------- コンテンツスライダー ------------
***************************************/

.ContentsSlider {
}
.slide-img img {
  height: auto;
  width: 100%;
}

.ContentsSlider .slick-dots {
  display: flex;
  justify-content: center;
  position: absolute;
  top: auto;
  bottom: -26px;
  right: 0;
  left: 0;
  margin: auto;
}
.ContentsSlider .slick-dots li {
  margin: 0 20px;
}
.ContentsSlider .slick-dots li button {
  font-size: 0;
  background: none;
  border: 0;
  position: relative;
  cursor: pointer;
}
.ContentsSlider .slick-dots li button:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  border-radius: 100vh;
  transition: 0.2s;
  background: #686868;
}
.ContentsSlider .slick-dots li.slick-active button:after {
  background: #dfb64d;
}
@media ( max-width : 599px ) {
  .ContentsSlider .slick-dots {
    bottom: -20px;
  }
}

/***************************************
------------- FAQ ------------
***************************************/
.sec_faq #faq .faq_wrap {
  padding: 0;
  display: flex;
  flex-flow: column;
  gap: 20px;
}
.sec_faq #faq dl {
  margin: 30px auto;
}
.sec_faq #faq .question {
  font-size: clamp(15px, 1.6666666667vw, 20px);
  position: relative;
  background: #fff;
  font-weight: 500;
  padding: 12px 0 12px 70px;
  color: var(--base-color01);
  margin: 0;
  border: 4px solid #fff;
  font-family: var(--base-font-family);
}
.sec_faq #faq .answer {
  position: relative;
  padding: 15px 60px 15px 70px;
  background: transparent;
  border: 4px solid #fff;
  border-top: none;
  color: var(--base-color01);
}
.sec_faq #faq .question::before {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  top: 7px;
  bottom: auto;
  left: 10px;
  right: auto;
  margin: auto;
  background: url(../img/common/qicon.png) no-repeat right bottom/cover;
}
.sec_faq #faq .answer::before {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  top: 10px;
  bottom: auto;
  left: 10px;
  right: auto;
  margin: auto;
  background: url(../img/common/aicon.png) no-repeat right bottom/cover;
}
.sec_faq #faq .qa_active .question {
  cursor: pointer;
  padding-right: 40px;
}
.sec_faq #faq .qa_active .question:after {
  content: "";
  width: 22px;
  height: 14px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: auto;
  right: 20px;
  margin: auto;
  transition: 0.3s;
  background: url(../img/common/faq_arrow.png) no-repeat center center/cover;
}
.sec_faq #faq .qa_active .question.open:after {
  transform: rotate(180deg);
  transition: 0.3s;
}
.sec_faq #faq .qa_active .answer {
  display: none;
}

/***************************************
------------- ABOUT US ------------
***************************************/

.sec_about {
  padding: 0 0 min(6%, 100px);
}

/***************************************
------------- 買取可能な取扱カテゴリーについて ------------
***************************************/

.sec_category {
  padding: 0 0 min(6%, 100px);
}

/***************************************
------------- 買取・査定方法について ------------
***************************************/

.sec_method {
  padding: 0 0 min(6%, 100px);
}

.sec_method img {
  display: block;
  margin: 0 auto;
  width: 100%;
}

/***************************************
------------- 買取実績 ------------
***************************************/
.sec_results {
  padding: 0 0 min(6%, 100px);
}

.sec_results .top_ttl {
  margin-bottom: 1.2em;
}

/***************************************
------------- 査定額アップの秘訣 ------------
***************************************/
.sec_tips {
  padding: 0 0 min(6%, 100px);
}