@charset "utf-8";
/*------------------------------------------*/
/* 熊谷・深谷 合同LP（saitama2）追加スタイル
/*------------------------------------------*/

#renewal_3,
#renewal_4 {
  width: 100%;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
}

/*------------------------------------------*/
/* FV（熊谷・深谷 合同）
/* 背景写真・キャッチコピー・赤エリア＋訴求を重ねて表示
/*------------------------------------------*/
.fv2_bar {
  padding: 16px 20px;
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
}

.fv2_logo {
  margin: 0;
  line-height: 1;
}

.fv2_logo img {
  display: block;
  width: 100%;
  max-width: 480px;
  height: auto;
  margin: 0 auto;
}

.fv2_main img {
  display: block;
  width: 100%;
  height: auto;
}

/* その②③ 大見出し（その①の画像のように、下の赤い四角の幅いっぱいに表示）
   各行の文字サイズはJSで見出し幅に合わせて自動計算 */
.big_ttl {
  margin-bottom: 10px;
  text-align: center;
  color: #c21732;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
  line-height: 1.25;
  font-feature-settings: "palt";
  overflow: hidden;
}

.big_ttl .fit {
  display: block;
  font-size: 6rem;
  white-space: nowrap;
}

.big_ttl .fit_in {
  display: inline-block;
  letter-spacing: 0;
}

.big_ttl_dark {
  color: #333;
}

.big_ttl_line {
  background: linear-gradient(transparent 72%, #ffe100 72%, #ffe100 90%, transparent 90%);
}

/* その③ 100日チャレンジ */
.support_steps {
  display: flex;
  justify-content: space-between;
  margin: 30px auto 70px;
}

.support_steps li {
  width: 32%;
}

.support_steps img {
  width: 100%;
}

/*------------------------------------------*/
/* 開催中のスタジオプログラム（熊谷・深谷）
/* ピンク：熊谷 / 赤：深谷 を斜めの境界で分割
/*------------------------------------------*/
.program2 {
  margin-bottom: 100px;
}

.program2_head {
  padding: 30px 20px 20px;
  background: #fff;
  text-align: center;
}

.program2_head img {
  display: block;
  width: 100%;
  max-width: 380px;
  margin: 0 auto;
}

.program2_body {
  position: relative;
  display: flex;
  background: #EFC2CA;
}

/* 斜めの境界は常に横幅の中央に来るよう固定幅で描画 */
.program2_body::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #c21732;
  clip-path: polygon(calc(50% + 60px) 0, 100% 0, 100% 100%, calc(50% - 60px) 100%);
}

.program2_shop {
  position: relative;
  z-index: 1;
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}

/* 各店を中央の境界線に寄せて配置（境界に重ならない分の余白は確保） */
.program2_kumagaya {
  align-items: flex-end;
  padding: 40px 90px 50px 20px;
}

.program2_fukaya {
  align-items: flex-start;
  padding: 40px 20px 50px 90px;
}

.program2_name {
  width: 100%;
  max-width: 260px;
  text-align: center;
  margin-bottom: 10px;
  font-size: 3.2rem;
  font-weight: bold;
  letter-spacing: .1em;
}

.program2_kumagaya .program2_name {
  color: #c21732;
}

.program2_fukaya .program2_name {
  color: #fff;
}

.schedule_btn {
  display: block;
  width: 100%;
  max-width: 260px;
  padding: 10px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
  text-align: center;
  text-decoration: none;
  transition: .3s;
}

.schedule_btn:hover {
  opacity: .8;
}

.schedule_btn img {
  width: 100%;
}

.schedule_btn span {
  display: block;
  margin-top: 8px;
  color: #c21732;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.3;
}

.program2_note {
  margin-top: 10px;
  color: #666;
  font-size: 1.4rem;
  text-align: center;
}

/*------------------------------------------*/
/* お電話（2店舗）
/*------------------------------------------*/
.cvtel_shops {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 4vw;
}

.cvtel_shop {
  display: flex;
  align-items: center;
}

.cvtel_shop_name {
  margin: 10px 1.2vw 0 0;
  padding: .2em .6em;
  background: #c21732;
  color: #fff;
  font-size: max(1.6rem, 2vw);
  font-weight: bold;
  border-radius: 4px;
  white-space: nowrap;
}

/*------------------------------------------*/
/* 固定ボタン（PC：2つ並べて縦中央）
/*------------------------------------------*/
.cvbtn_r_inner,
.cvbtn_r2_inner {
  font-size: 1.6rem;
}

@media screen and (min-width:641px) {

  .cvbtn_r,
  .cvbtn_r2 {
    top: 50%;
    bottom: auto;
  }

  .cvbtn_r {
    transform: translateY(calc(-100% - 6px));
  }

  .cvbtn_r2 {
    transform: translateY(6px);
  }
}

/* 261101 追記 */
.cta-sub {
  font-size: 3.6rem;
  font-weight: 900;
  margin: 50px auto -40px auto;
  text-align: center;
}

/*------------------------------------------*/
/* SP
/*------------------------------------------*/
@media screen and (max-width:640px) {
  .fv2_bar {
    padding: 10px 16px;
  }

  .fv2_logo img {
    max-width: 300px;
  }

  .big_ttl {
    line-height: 1.3;
  }

  .support_steps {
    display: block;
    margin: 20px auto 40px;
  }

  .support_steps li {
    width: 90%;
    margin: 10px auto;
  }

  .program2 {
    margin-bottom: 5%;
  }

  .program2_head {
    padding: 20px 20px 10px;
  }

  .program2_head img {
    max-width: 260px;
  }

  /* SPもPC同様に店舗で境界を分ける（斜めの幅は画面に合わせて小さく） */
  .program2_body::before {
    clip-path: polygon(calc(50% + 20px) 0, 100% 0, 100% 100%, calc(50% - 20px) 100%);
  }

  .program2_kumagaya {
    align-items: center;
    padding: 24px 26px 30px 12px;
  }

  .program2_fukaya {
    align-items: center;
    padding: 24px 12px 30px 26px;
  }

  .program2_name {
    font-size: 2rem;
    margin-bottom: 6px;
  }

  .schedule_btn {
    padding: 6px;
  }

  .schedule_btn span {
    font-size: 1.3rem;
  }

  .program2_note {
    font-size: 1.2rem;
  }

  .cvtel_shops {
    flex-direction: column;
    align-items: center;
  }

  .cvtel_shop_name {
    font-size: 1.5rem;
    margin-right: 10px;
  }

  .cvbtn_r_inner,
  .cvbtn_r2_inner {
    font-size: 1.3rem;
  }

  /* 261101 追記 */
  .cta-sub {
    font-size: 1.6rem;
    margin: 20px auto -50px auto;
  }
}