@charset "UTF-8";
/************************************************************
*  「カウンセリングフロー」のcss
*************************************************************/
/************************************************************
*  Global
*  汎用的な関数や変数を格納する
*************************************************************/
/************************************************************
*  Global
*  Mixinを定義
*************************************************************/
/*
#overview
カラーパレット

本サイトで使用するカラーコード一覧です。
*/
/*
#colors

@$mainWhiteBlue #f5f6fc
@$mainLightBlue #d5dffe
@$mainBlue #859be3
@$mainDarkBlue #5268b1

@$accentRed #ff4b4b

@$txtBlack #000
@$txtBlack2 #333333

@$borderGray #cccccc
*/
/************************************************************
*  Global
*  Mixinを定義
*************************************************************/
/************************************************************
*  Global
*  関数を定義
*************************************************************/
.p-counseling_flow__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 20px clamp(20px, 7vw, 70px);
}

.p-counseling_flow__item + .p-counseling_flow__item {
  margin-top: clamp(40px, 11vw, 110px);
}

.p-counseling_flow__item:nth-of-type(2n) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.p-counseling_flow__item:nth-of-type(2n) .p-counseling_flow__img {
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
}

.p-counseling_flow__img {
  width: min(480px, 46.875vw);
}

.p-counseling_flow__img img {
  width: 100%;
  border-radius: 0 clamp(20px, 5vw, 50px) 0 clamp(20px, 5vw, 50px);
  -webkit-box-shadow: clamp(5px, 2vw, 20px) clamp(5px, 2vw, 20px) 0 #ebf3fe;
  box-shadow: clamp(5px, 2vw, 20px) clamp(5px, 2vw, 20px) 0 #ebf3fe;
}

.p-counseling_flow__detail {
  width: min(550px, 53.7109375vw);
}

.p-counseling_flow__step {
  color: #4A6E9D;
  font-size: clamp(20px, 2.8vw, 28px);
  line-height: 1.3;
  position: relative;
}

.p-counseling_flow__step::before {
  content: "";
  width: 60px;
  height: 2px;
  background: #ccd8e5;
  position: absolute;
  bottom: 0px;
  left: 0;
}

.p-counseling_flow__step::after {
  content: "";
  width: 30px;
  height: 2px;
  background: #4A6E9D;
  position: absolute;
  bottom: 0px;
  left: 0;
}

.p-counseling_flow__step span {
  font-size: clamp(30px, 4.5vw, 45px);
  padding-left: 10px;
}

.p-counseling_flow__title {
  color: #4A6E9D;
  font-size: clamp(20px, 3vw, 30px);
  font-weight: 700;
  margin-block: clamp(15px, 2.5vw, 25px) 10px;
}

.p-counseling_flow__text {
  font-size: clamp(13px, 1.5vw, 15px);
  line-height: 2;
}

.p-counseling_flow__text + .p-counseling_flow__text {
  margin-top: clamp(15px, 3vw, 30px);
}

@media screen and (max-width: 640px) {
  .p-counseling_flow__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .p-counseling_flow__item:nth-of-type(2n) {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .p-counseling_flow__item:nth-of-type(2n) .p-counseling_flow__img {
    -webkit-transform: unset;
    transform: unset;
  }
  .p-counseling_flow__img {
    width: 100%;
  }
  .p-counseling_flow__detail {
    width: 100%;
  }
}
/*# sourceMappingURL=maps/counseling_flow.min.css.map */