/* ===== メインレイアウト ===== */
.tocompany-layout {
  max-width: 1400px;
  margin: 0 auto;
  padding: 80px clamp(24px, 5vw, 80px) 100px;
}

/* ===== セクション共通 ===== */
.tocompany-section {
  padding-bottom: 80px;
  margin-bottom: 80px;
  border-bottom: 1px solid #c7c7c7;
}
.tocompany-section:last-of-type { border-bottom: none; }
.tocompany-section-heading { text-align: center; margin-bottom: 60px; }

/* ===== リードセクション：画像左＋テキスト右 ===== */
.tocompany-intro-row {
  display: flex;
  gap: clamp(32px, 4vw, 60px);
  align-items: flex-start;
}
.tocompany-intro-img {
  flex: 0 0 auto;
  width: clamp(200px, 28%, 340px);
  border-radius: 8px;
  overflow: hidden;
}
.tocompany-intro-img img { width: 100%; height: auto; display: block; object-fit: cover; }
.tocompany-intro-text { flex: 1 1 0; min-width: 0; }
.tocompany-intro-heading {
  font-size: 38px;
  font-weight: 700;
  color: #000;
  line-height: 1.5;
  margin-bottom: 28px;
}
.tocompany-intro-body { display: flex; flex-direction: column; gap: 18px; }
.tocompany-intro-body p { font-size: 18px; line-height: 2; color: #333; }

/* ===== MERITおよびFLOWの項目リスト ===== */
.tocompany-item-list { display: flex; flex-direction: column; gap: 0; }
.tocompany-item { padding: 40px 0; border-bottom: none; }
.tocompany-item:first-child { padding-top: 0; }
.tocompany-item__title {
  font-size: 28px;
  font-weight: 700;
  color: #005eb8;
  line-height: 1.4;
  margin-bottom: 14px;
}
.tocompany-item__line { border: none; border-top: 1px solid #005eb8; margin: 0 0 20px 0; }
.tocompany-item__body { font-size: 18px; line-height: 2; color: #333; }

/* ===== SUPPORTセクション：画像左＋テキスト右 ===== */
.tocompany-support-row {
  display: flex;
  gap: clamp(32px, 4vw, 60px);
  align-items: flex-start;
  margin-bottom: 60px;
}
.tocompany-support-img {
  flex: 0 0 auto;
  width: clamp(200px, 28%, 340px);
  border-radius: 8px;
  overflow: hidden;
}
.tocompany-support-img img { width: 100%; height: auto; display: block; object-fit: cover; }
.tocompany-support-text { flex: 1 1 0; min-width: 0; }
.tocompany-support-heading {
  font-size: 34px;
  font-weight: 700;
  color: #000;
  line-height: 1.5;
  margin-bottom: 24px;
}
.tocompany-support-lead { font-size: 18px; line-height: 2; color: #333; }
.tocompany-support-details { display: flex; flex-direction: column; gap: 0; margin-top: 32px; }
.tocompany-support-detail { padding: 32px 0; border-bottom: 1px solid #f0f0f0; }
.tocompany-support-detail:first-child { padding-top: 0; }
.tocompany-support-detail:last-child { border-bottom: none; padding-bottom: 0; }
.tocompany-support-detail__title {
  font-size: 20px;
  font-weight: 700;
  color: #005eb8;
  line-height: 1.4;
  margin-bottom: 12px;
}
.tocompany-support-detail__line { border: none; border-top: 1px solid #005eb8; margin: 0 0 16px 0; }
.tocompany-support-detail__body { font-size: 18px; line-height: 2; color: #333; }

/* ===== TYPEセクション：会員種別カード ===== */
.tocompany-type-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 60px;
}
.tocompany-type-card { border: 1px solid #c7c7c7; padding: 36px 32px 40px; background: #fff; }
.tocompany-type-card__title {
  font-size: 30px;
  font-weight: 700;
  color: #005eb8;
  text-align: center;
  margin-bottom: 20px;
}
.tocompany-type-card__body { font-size: 18px; line-height: 1.8; color: #333; }

/* ===== 会費 ===== */
.tocompany-fee { padding-top: 0; }
.tocompany-fee__title { font-size: 28px; font-weight: 700; color: #005eb8; margin-bottom: 14px; }
.tocompany-fee__title-line { border: none; border-top: 1px solid #c7c7c7; margin: 0 0 32px 0; }
.tocompany-fee__row {
  display: flex;
  gap: 32px;
  align-items: baseline;
  padding: 16px 0;
  border-bottom: 1px solid #f0f0f0;
}
.tocompany-fee__row:last-of-type { border-bottom: none; }
.tocompany-fee__label {
  font-size: 20px;
  font-weight: 700;
  color: #005eb8;
  flex-shrink: 0;
  width: 80px;
}
.tocompany-fee__detail { flex: 1 1 0; min-width: 0; }
.tocompany-fee__detail p { font-size: 18px; line-height: 1.8; color: #333; }
.tocompany-fee__notes { margin-top: 28px; display: flex; flex-direction: column; gap: 8px; }
.tocompany-fee__notes p { font-size: 16px; line-height: 1.8; color: #666; }

/* ===== CTAボタン ===== */
.tocompany-cta { display: flex; gap: 20px; margin-top: 80px; }
.tocompany-cta__btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 28px 32px;
  font-weight: 700;
  font-size: 28px;
  color: #fff;
  border-radius: 4px;
  transition: opacity 0.2s, transform 0.2s;
  text-decoration: none;
}
.tocompany-cta__btn:hover { opacity: 0.88; transform: translateY(-2px); }
.tocompany-cta__btn--form { background: #005eb8; }
.tocompany-cta__btn--join { background: #31caff; }
.tocompany-cta__icon {
  font-size: 40px;
  line-height: 1;
  flex-shrink: 0;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 40;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .tocompany-type-grid { grid-template-columns: 1fr; gap: 16px; }
  .tocompany-type-card { padding: 28px 24px 32px; }
}
@media (max-width: 767px) {
  .tocompany-intro-heading { font-size: 24px; }
  .tocompany-item__title { font-size: 24px; }
  .tocompany-support-heading { font-size: 24px; }
  .tocompany-support-detail__title { font-size: 24px; }
  .tocompany-fee__label { font-size: 24px; }
  .tocompany-intro-body p { font-size: 15px; }
  .tocompany-item__body { font-size: 15px; }
  .tocompany-support-lead { font-size: 15px; }
  .tocompany-support-detail__body { font-size: 15px; }
  .tocompany-type-card__body { font-size: 15px; }
  .tocompany-fee__detail p { font-size: 15px; }
  .tocompany-section-heading .br-sp { display: block; }
  .tocompany-layout { padding: 48px 24px 64px; }
  .tocompany-section { padding-bottom: 56px; margin-bottom: 56px; }
  .tocompany-section-heading { margin-bottom: 40px; }
  .tocompany-intro-row, .tocompany-support-row { flex-direction: column; }
  .tocompany-intro-img, .tocompany-support-img { width: 100%; max-width: 360px; }
  .tocompany-item { padding: 28px 0; }
  .tocompany-type-grid { grid-template-columns: 1fr; }
  .tocompany-fee__row { flex-direction: column; gap: 8px; }
  .tocompany-fee__label { width: auto; }
  .tocompany-cta { flex-direction: column; gap: 14px; margin-top: 56px; }
  .tocompany-cta__btn { padding: 22px 24px; }
  .tocompany-cta__label { font-size: 24px; }
}