@charset "utf-8";

/*---取組みのステップ---*/

#service.section {
  padding: 80px 20px;
/*  background: linear-gradient(135deg, #fff 50%, #e9ecec 50%);*/
  text-align: center;
}

/*
#service .container {
  max-width: 1100px;
  margin: 0 auto;
}
*/

/* ===== リスト全体 ===== */
.service-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column; /* ← 縦並び */
  gap: 60px;
}
/* ===== 各ステップ ===== */
.service-list li {
  flex: 1;
  position: relative;
  padding-top: 220px;
}

/* ===== 円デザイン ===== */
.service-list li::before {
  content: "";
  width: 240px;
  height: 240px;
  border: 1px solid rgba(230, 130, 90, 0.4);
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

/* ===== ステップ番号 ===== */
.step-number {
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  letter-spacing: 0.2em;
  color: #e0895c;
}

/* ===== タイトル（円の中央） ===== */
.service-content strong {
  position: absolute;
  top: 110px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  color: #333;
}

/* ===== 説明文 ===== */
.service-content p {
  margin-top: 30px;
  font-size: 1.1rem;
  line-height: 2;
  color: #555;
  padding: 0 10px;
  text-align: left;
    
}


/* =========================
パソコン表示（768px以上）
========================= */
@media (min-width: 768px) {
       

    
/*パソコン取り組みのステップ　　*/
 .service-list {
    flex-direction: row;      /*横並び */
    justify-content: space-between;
    gap: 40px;
  }

 .service-list li {
    flex: 1;
    padding-top: 240px;
  }
 .service-content p {
    max-width: 300px;
    }    
/*パソコン取り組のステップ終了　　*/
/*スマホメンバー紹介*/
 .member-card {
    flex-direction: column;
    text-align: center;
    padding: 30px 20px;
  }

 .member-profile {
    width: 100%;
  }

 .member-text {
    border-left: none;
    padding-left: 0;
    margin-top: 20px;
  }
  .member-list {
    grid-template-columns: 1fr;
  }

  .member-card {
    padding: 30px 20px;
  }

  .member-photo {
    width: 180px;
    height: 220px;
  }
    /*スマホメンバー紹介終了*/
}