@charset "utf-8";
.flow-box-con {
        background-color:#fff;
        padding:2rem;
        border-radius:20px;
      }

      .flow-number {
        font-size: 2.5rem;
        font-weight: 200;
        color: #002863;
        font-family: Outfit, sans-serif; 
        border-right:1px solid #eaeaea;
      }

      .flow-con {
        color: #002863;
        font-size:1.2rem;
        margin-bottom:0.75rem;
      }

      .price-list-box {
        font-size:1.5rem;
        background-color:#f9f9f9;
      }

      .price-list-box span {
        font-size:0.8rem;
      }

      .price-list-box small {
        font-size:1rem;
      }




      .btn-custom-pdf {
  /* ▼ ボタンの基本設定 */
  width:300px;
  position: relative; /* 矢印を絶対位置で配置するための基準点 */
  display: inline-flex; /* テキストブロックをflexアイテムとして扱う */
  align-items: center; /* テキストを垂直方向に中央揃え */
  justify-content: center;
  background-color: #ffaa00; /* 背景色 */
  color: #002863; /* テキストカラー */
  border: none;
  border-radius: 20px; /* 角を丸くする */
  padding: 1.7rem 0; /* 上下、右、左の順。右側は矢印用に広く確保 */
  text-decoration: none;
  font-weight: bold;
  line-height: 1.5;
  transition: opacity 0.3s ease;
}

/* ▼ ホバー時のエフェクト */
.btn-custom-pdf:hover {
  background-color: #ffaa00;
  opacity:0.7;
}

/* ▼ テキスト部分のスタイル */
.btn-custom-pdf .btn-text {
  text-align: center;
}

.btn-custom-pdf .btn-text small {
  font-size: 0.6em;
  font-weight: normal;
}

/* ▼ 矢印部分のスタイル */
.btn-custom-pdf .btn-arrow {
  /* 位置の指定 */
  position: absolute;
  top: 50%;
  right: 1rem; /* ボタンの右端からの距離 */
  transform: translateY(-50%); /* 垂直方向の中央に配置 */
  
  /* 円のスタイル */
  width: 20px;
  height: 20px;
  border: 1.5px solid #212529;
  border-radius: 50%; /* 正円にする */

  /* 円の中のアイコンを中央に配置 */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ▼ 矢印アイコンのサイズ調整 */
.btn-custom-pdf .btn-arrow .bi {
  font-size: 0.5rem;
}

.flow-arrow-box {
  position: absolute;
  bottom:-1.6vw;
}

.flow-arrow-box img {
width:1vw;
}

.flow-box-core {
  padding-bottom:10rem;
}

.price-title {
  font-weight:400;
  font-size:1.5rem;
  color: #002863;
  margin-bottom:2.5rem;
  line-height:170%;
  padding-left: 3em;
  text-indent: -3em;
}

.price-box-core {
  background-color:#fff;
  padding-bottom:10rem;
}


@media screen and (max-width:599px)  {
.flow-number {
        font-size: 3rem;
        padding-bottom: 2.5rem;
        margin-bottom:2rem;
      }

      .flow-con {
        text-align: center;
        margin-bottom: 1.5rem;
      }

      .flow-box-con {
        padding:3rem 2rem 4rem 2rem;
        margin-bottom:4.8rem;
      }

      .flow-arrow-box img {
        width:1.3rem;
      }

      .flow-arrow-box {
        bottom:-4.7rem;
      }
      .flow-box-core {
        padding-bottom:0rem;
      }

      .price-box-core {
  padding-bottom:6rem;
}
    }