@charset "UTF-8";
/* ==================================================
 * Color set
 * ================================================== */
/* ==================================================
 * Font
 * ================================================== */
/* ==================================================
 * width
 * ================================================== */
/* ==================================================
 * layout
 * ================================================== */
/* ==================================================
 * bg
 * ================================================== */
/* ==================================================
 * font text
 * ================================================== */
/* ==================================================
 * other
 * ================================================== */
/*=========================================================
	診断チャート
=========================================================*/
/*診断コンテンツ
----------------------------------------------- */
.chart_container,
.com_chart {
  border-width: 3px;
  border-radius: 15px;
}

.com_chart-bx {
  row-gap: 6vw;
  padding: 6vw 4vw !important;
}

/*診断タイトル*/
.chart_title,
.result_title {
  border-radius: 10px 10px 0 0;
  padding: 15px 4vw 15px 15vw;
  font-size: 28px;
  font-size: 3.6458333333vw;
}
@media screen and (min-width: 539px) {
  .chart_title,
  .result_title {
    font-size: 18.6666666667px;
  }
}

.chart_title::before {
  width: 80px;
  max-width: 10.6666666667%;
  padding: 0 0 3px 0;
  left: 4vw;
  transform: translate(0, -50%);
  font-size: 40px;
  font-size: 5.2083333333vw;
}
@media screen and (min-width: 539px) {
  .chart_title::before {
    font-size: 26.6666666667px;
  }
}

/*診断ボタン
----------------------------------------------- */
/*回答リスト*/
/*回答ボタン*/
.chart_btn_list {
  gap: 4vw;
}
.chart_btn_list-item {
  width: 100%;
}
.chart_btn_list-item a {
  padding: 20px 12vw 20px 4vw;
  font-size: 18px;
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .chart_btn_list-item a {
    font-size: 28px;
    font-size: 3.6458333333vw;
  }
}
@media screen and (max-width: 768px) and (min-width: 539px) {
  .chart_btn_list-item a {
    font-size: 18.6666666667px;
  }
}
.chart_btn_list-item a::after {
  max-width: 5vw;
  right: 5%;
}

/*診断結果
----------------------------------------------- */
.result_title {
  row-gap: 2vw;
  padding: 15px 4vw;
}
.result_title-icon {
  transform: translate(-20%, -40%);
  width: 18vw;
  max-width: 100px;
  font-size: 32px;
  font-size: 4.1666666667vw;
}
@media screen and (min-width: 539px) {
  .result_title-icon {
    font-size: 21.3333333333px;
  }
}
.result_title .main {
  font-size: 30px;
  font-size: 3.90625vw;
}
@media screen and (min-width: 539px) {
  .result_title .main {
    font-size: 20px;
  }
}

.result_chart .img {
  border-radius: 10px;
}/*# sourceMappingURL=chart_sp.css.map */