@charset "utf-8";

.maincopy00 {
  text-align: center;
  font-size: 1.6rem;
  margin: 50px 0;
}

.maintit01 {
  text-align: center; /* 中央寄せ */
  font-size: 2.4rem; /* 大きさはお好みで */
  letter-spacing: 0.15em; /* 文字の間隔を少し広げる（重要！） */
  padding: 20px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ba9e44;
}

/* 文字の両サイドに細い線を入れる */
.maintit01::before,
.maintit01::after {
  content: "";
  height: 1px;
  width: 100px; /* 線の長さ */
  background-color: #ba9e44; /* 上品なゴールド・ベージュ系 */
  margin: 0 20px; /* 文字との隙間 */
}
.maincopy01 {
  font-size: 1.6rem;
  margin: 20px 0;
}
.slowtbox_inn {
  margin: 0 0 50px 0;
}

.cony01 .item {
  display: flex; /* 横並びにする */
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
}

.cony01 dt {
  width: 30%; /* タイトルの幅を固定 */
  font-weight: bold;
  flex-shrink: 0; /* タイトルが潰れないように固定 */
}

.cony01 dd {
  flex-grow: 1; /* 残りの幅をすべて使う */
  margin-left: 0;
}

h4.flow {
  position: relative;
  padding: 0 65px;
  text-align: center;
  margin-bottom: 20px;
}

h4.flow:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 1px;
  content: "";
  background: #000;
}

h4.flow span {
  position: relative;
  padding: 0 1em;
  background: #fff;
  font-size: 1.8rem;
}
.cony02 .item {
  background: #f9f9f9;
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 30px; /* 矢印が入るスペースを空ける */
  position: relative;
}

.cony02 .item:not(:last-child)::after {
  content: "↓";
  position: absolute;
  bottom: -35px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 24px;
  color: #0f3675;
}
.cony02 .item dt {
  font-weight: 700;
  font-size: 1.6rem;
}

.summarytxt {
  font-weight: 700;
  font-size: 1.6rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
    /* 全体のコピー・タイトルサイズ調整 */
    .maincopy00 {
      font-size: 1.4rem;
      margin: 30px 0;
      padding: 0 15px; /* 左右に少し余白 */
    }
  
    .maintit01 {
      font-size: 1.8rem; /* 少し小さく */
      padding: 15px 0;
    }
  
    /* タイトル横の線を短くして文字スペースを確保 */
    .maintit01::before,
    .maintit01::after {
      width: 30px; /* 100pxだと長すぎるので短縮 */
      margin: 0 10px;
    }
  
    .maincopy01 {
      font-size: 1.4rem;
      padding: 0 15px;
    }
  
    /* プラン内容：横並びを縦並びに変更 */
    .cony01 .item {
      flex-direction: column; /* 縦に積む */
      align-items: flex-start;
      padding: 12px 0;
    }
  
    .cony01 dt {
      width: 100%; /* 幅をいっぱい使う */
      margin-bottom: 5px; /* 項目名と内容の間に少し隙間 */
      font-size: 1.5rem;
    }
  
    .cony01 dd {
      width: 100%;
      font-size: 1.4rem;
    }
  
    /* フローの見出し調整 */
    h4.flow {
      padding: 0 20px; /* 左右の余白を減らす */
    }
  
    h4.flow span {
      font-size: 1.5rem; /* 文字を少し小さく */
    }
  
    /* 手順ボックス（Step）の調整 */
    .cony02 .item {
      padding: 15px; /* 内側の余白を少し詰める */
      margin-bottom: 40px; /* 矢印の見栄えのため少し広げる */
    }
  
    .cony02 .item dt {
      font-size: 1.4rem;
    }
  
    .cony02 .item dd {
      font-size: 1.3rem;
      line-height: 1.6;
    }
  
    /* 下矢印の位置微調整 */
    .cony02 .item:not(:last-child)::after {
      bottom: -40px;
      font-size: 20px;
    }
  
    .summarytxt {
      font-size: 1.4rem;
      padding: 0 10px;
    }
  }