/* =============================================
   riskmanagement_consulting.css | リスクマネジメント・体制整備コンサルティング専用スタイル
   共通スタイルは common-design.css を参照
   ============================================= */

/* ── レイアウトリセット（full-width ヒーロー用） ── */
body.page_riskmanagement_consulting {
  overflow-x: hidden;

  /* サービスごとのプライマリーカラー（ブランドカラーの赤/ネイビーとは別軸。トーンはブランドに合わせて深め・落ち着いた色味に統一） */
  --rc-accent-01    : #c2410c; /* 01 POLICY：明るいオレンジ */
  --rc-accent-01-rgb: 194, 65, 12;
  --rc-accent-02    : #1f6e78; /* 02 ISO27001：深い青緑 */
  --rc-accent-02-rgb: 31, 110, 120;
  --rc-accent-03    : #9c3a63; /* 03 PRIVACY MARK：深い薔薇色（プライバシーマークのロゴ色を意識） */
  --rc-accent-03-rgb: 156, 58, 99;
}

#service-01 {
  --rc-accent    : var(--rc-accent-01);
  --rc-accent-rgb: var(--rc-accent-01-rgb);
}

#service-02 {
  --rc-accent    : var(--rc-accent-02);
  --rc-accent-rgb: var(--rc-accent-02-rgb);
}

#service-03 {
  --rc-accent    : var(--rc-accent-03);
  --rc-accent-rgb: var(--rc-accent-03-rgb);
}

body.page_riskmanagement_consulting main#contents {
  max-width     : none;
  width         : 100%;
  padding-left  : 0;
  padding-right : 0;
  padding-bottom: 0;
}

body.page_riskmanagement_consulting #locator_template_c2 .inner {
  max-width   : none !important;
  margin-left : 0    !important;
  padding-left: max(clamp(24px, 5vw, 80px), calc((100vw - 1440px) / 2 + clamp(24px, 5vw, 80px))) !important;
}

/* パンくずリストを紺背景・白文字に */
body.page_riskmanagement_consulting #locator_template_c2 {
  background  : var(--oc-navy);
  border-color: var(--oc-navy);
}

body.page_riskmanagement_consulting #locator_template_c2 ol li,
body.page_riskmanagement_consulting #locator_template_c2 ol li a,
body.page_riskmanagement_consulting #locator_template_c2 ol li a:hover,
body.page_riskmanagement_consulting #locator_template_c2 span {
  color: #fff;
}

/* ── コンテンツ幅を1280pxに拡張 ── */
body.page_riskmanagement_consulting .oc-container {
  max-width: 1280px;
}

/* ── アンカースクロール時のヘッダー分オフセット ── */
body.page_riskmanagement_consulting #rc-about,
body.page_riskmanagement_consulting #service-01,
body.page_riskmanagement_consulting #service-02,
body.page_riskmanagement_consulting #service-03 {
  scroll-margin-top: 110px;
}

html {
  scroll-padding-top: 110px;
}

/* =============================================
   ヒーロー追加要素
   ============================================= */

/* 背景を白に、文字をネイビーに（既定はネイビー背景＋白文字） */
.rc-hero {
  background   : #fff;
  border-top   : 5px solid var(--oc-navy);
  border-bottom: 1px solid var(--oc-border);
}

body.page_riskmanagement_consulting .rc-hero .page-header__title {
  color : var(--oc-navy);
  margin: 20px 0;
}

/* 英語ラベルを赤背景のカプセル型に */
body.page_riskmanagement_consulting .rc-hero .oc-hero-en {
  display       : inline-block;
  background    : var(--oc-red);
  color         : #fff;
  padding       : 6px 18px;
  border-radius : 999px;
  letter-spacing: 0.2em;
}

.rc-hero-lead {
  color      : var(--oc-navy);
  font-size  : clamp(13px, 1.2vw, 16px);
  line-height: 1.9;
  max-width  : 620px;
  margin     : 0 0 28px;
}

/* ヒーローの高さを共通デザイン（common-design.css）より100px高くする */
body.page_riskmanagement_consulting .rc-hero .page-header__inner {
  min-height: clamp(400px, calc(38vw + 100px), 620px);
}

@media screen and (min-width: 980px) {
  body.page_riskmanagement_consulting .rc-hero .page-header__inner {
    min-height: clamp(270px, calc(38vw - 30px), 490px);
  }
}

/* 背景は単色（common-design.css の .oc-hero 既定色 = ネイビー）のまま、
   タイトル右側にイラストを配置する。イラストは .page-header__inner の
   padding に影響されないよう、ヒーロー本体（.rc-hero）基準の絶対配置にして
   ヒーローの実際の高さぴったりに揃える */

/* 共通のグラデーション演出はこのページのみ無効化 */
body.page_riskmanagement_consulting .rc-hero::before {
  content: none;
}

img.rc-hero-illust {
  display        : none;
  position       : absolute;
  top            : 0 !important;
  bottom         : 0 !important;
  /* 画面の実エッジではなく、.page-header__inner と同じコンテンツ幅の右端に揃える */
  right          : max(clamp(24px, 5vw, 80px), calc((100vw - 1440px) / 2 + clamp(24px, 5vw, 80px)));
  z-index        : 0;
  /* 幅は固定せず、高さ(ヒーローいっぱい)からアスペクト比通りに決まるようにして、
     画像が見切れず全体が表示されるようにする */
  width          : auto !important;
  height         : 100% !important;
  max-width      : min(48vw, 640px) !important;
  max-height     : none !important;
  margin         : 0 !important;
  object-fit     : contain !important;
  object-position: center !important;
  pointer-events : none;
}

@media screen and (min-width: 980px) {
  img.rc-hero-illust {
    display: block;
  }
}

/* =============================================
   共通セクション
   ============================================= */
body.page_riskmanagement_consulting .oc-section-heading {
  border-top: none;
}

#rc-about {
  background: #fff;
}

/* サービス詳細見出し：大きなナンバリング（01/02/03） */
.rc-service-heading {
  display    : flex;
  align-items: center;
  gap        : clamp(16px, 3vw, 32px);
  margin-top : 24px;
}

.rc-service-heading-num {
  flex-shrink: 0;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size  : clamp(48px, 6vw, 80px);
  font-weight: 700;
  line-height: 1;
  color      : var(--rc-accent, var(--oc-red));
}

.rc-service-heading-text {
  min-width: 0;
}

.rc-section {
  padding: 80px 0;
}

/* サービス詳細（01/02/03）：各サービス固有のプライマリーカラーを反映 */
#service-01,
#service-02,
#service-03 {
  position  : relative;
  background: rgba(var(--rc-accent-rgb), 0.06);
}

#service-01 .oc-label,
#service-02 .oc-label,
#service-03 .oc-label {
  color: var(--rc-accent);
}

#service-01 .rc-subheading h3,
#service-02 .rc-subheading h3,
#service-03 .rc-subheading h3 {
  border-left-color: var(--rc-accent);
}

#service-01 table.rc-table thead th {
  background: var(--rc-accent);
}

#service-02 .rc-merit-grid .rc-merit-num {
  background: var(--rc-accent);
}

#service-03 .rc-step-num {
  background: var(--rc-accent);
}

#service-03 .rc-step + .rc-step {
  border-left-color: rgba(var(--rc-accent-rgb), 0.35);
}

body.page_riskmanagement_consulting .oc-section-heading + .rc-section {
  padding-top: 28px;
}

.rc-lead {
  font-size  : clamp(14px, 1.3vw, 16px);
  line-height: 2;
  color      : var(--oc-text);
  margin     : 0 0 32px;
}

/* 各サービス冒頭のリード文：コンテンツ幅の約70%で折り返す */
.rc-service-lead {
  max-width: 70%;
}

.rc-subheading {
  margin: 64px 0 28px;
}

.rc-subheading h3 {
  margin      : 0;
  font-size   : clamp(19px, 2vw, 24px);
  font-weight : 700;
  color       : var(--oc-navy);
  padding-left: 16px;
  border-left : 4px solid var(--oc-red);
}

.rc-subheading--center {
  text-align: center;
}

.rc-subheading--center h3 {
  display     : inline-block;
  padding-left: 0;
  border-left : none;
}

/* =============================================
   こんなお悩みありませんか（目的別ご相談メニュー）
   ============================================= */
.rc-persona-grid {
  display              : grid;
  grid-template-columns: repeat(4, 1fr);
  gap                  : 20px;
  align-items          : stretch;
}

.rc-persona-col {
  display       : flex;
  flex-direction: column;
}

.rc-persona-card {
  position      : relative;
  z-index       : 0;
  display       : flex;
  flex-direction: column;
  flex-grow     : 1;
  background    : #fff;
  border        : 1px solid var(--oc-border);
  padding       : 28px 22px;
}

.rc-persona-card--contact {
  background: var(--oc-light);
}

/* カード右上の大きな薄い番号 */
.rc-persona-watermark {
  display    : block;
  position   : absolute;
  top        : 8px;
  right      : 14px;
  z-index    : -1;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size  : 56px;
  font-weight: 700;
  line-height: 1;
  color      : rgba(3, 38, 71, 0.15);
  pointer-events: none;
}

.rc-persona-tag {
  display       : inline-block;
  font-family   : 'IBM Plex Sans', sans-serif;
  font-size     : 12px;
  font-weight   : 700;
  letter-spacing: 0.08em;
  color         : var(--oc-red);
  margin-bottom : 12px;
}

.rc-persona-card h4 {
  margin     : 0 0 12px;
  font-size  : clamp(15px, 1.5vw, 17px);
  font-weight: 700;
  line-height: 1.5;
  color      : var(--oc-navy);
}

.rc-persona-card p {
  margin     : 0;
  font-size  : 13px;
  line-height: 1.8;
  color      : #555;
  flex-grow  : 1;
}

.rc-persona-down {
  display   : block;
  text-align: center;
  font-size : 18px;
  line-height: 1;
  color     : var(--oc-red);
  margin    : 14px 0;
}

.rc-persona-btn {
  display        : flex;
  align-items    : center;
  justify-content: center;
  padding        : 13px 16px;
  background     : var(--oc-navy);
  color          : #fff !important;
  font-size      : clamp(13px, 1.1vw, 14px);
  font-weight    : 700;
  text-align     : center;
  text-decoration: none !important;
  transition     : background-color 0.25s var(--oc-ease);
}

.rc-persona-btn:hover,
.rc-persona-btn:focus-visible {
  background-color: var(--oc-red);
}

.rc-persona-btn--contact {
  background-color: var(--oc-red);
}

.rc-persona-btn--contact:hover,
.rc-persona-btn--contact:focus-visible {
  background-color: #a81220;
}

/* 体制整備によるメリット→選ばれる理由への遷移バンド（下向き三角形の切り込み。背景色はセクション末尾まで続く） */
body.page_riskmanagement_consulting #rc-merit .rc-section {
  padding-bottom: 0;
}

.rc-solution-band {
  width        : 100vw;
  margin-inline: calc(50% - 50vw);
  margin-top   : 48px;
  padding      : clamp(56px, 8vw, 96px) 0 clamp(64px, 8vw, 96px);
  background   : #fff;
}

.rc-solution-heading {
  margin     : 0 0 16px;
  text-align : center;
  font-size  : clamp(22px, 2.6vw, 30px);
  font-weight: 700;
  color      : var(--oc-navy);
}

.rc-solution-lead {
  max-width  : 1200px;
  margin     : 0 auto 40px;
  text-align : center;
  font-size  : clamp(13px, 1.2vw, 15px);
  line-height: 1.9;
  color      : var(--oc-text);
}

.rc-feature-list {
  display              : grid;
  grid-template-columns: repeat(3, 1fr);
  gap                  : 20px;
  margin-bottom        : 24px;
}

.rc-feature-item {
  background   : #fff;
  border       : 1px solid var(--oc-border);
  border-radius: 10px;
  padding      : 28px 24px;
  box-shadow   : 0 6px 20px rgba(3, 38, 71, 0.08);
}

/* 丸＋チェックマークのアクセントアイコン（CSSのみで描画。CMSはインラインSVGを除去するため使用しない） */
.rc-feature-check {
  position     : relative;
  display      : block;
  width        : 44px;
  height       : 44px;
  margin       : 0 auto 18px;
  border-radius: 50%;
  background   : var(--oc-red);
}

.rc-feature-check::after {
  content     : '';
  position    : absolute;
  left        : 17px;
  top         : 12px;
  width       : 9px;
  height      : 18px;
  border      : solid #fff;
  border-width: 0 3px 3px 0;
  transform   : rotate(45deg);
}

.rc-feature-item h4 {
  margin     : 0 0 12px;
  font-size  : clamp(17px, 1.8vw, 20px);
  font-weight: 700;
  line-height: 1.5;
  color      : var(--oc-navy);
  text-align : center;
}

.rc-feature-item p {
  margin     : 0;
  font-size  : 14px;
  line-height: 1.85;
  color      : #555;
}

/* =============================================
   サービス紹介：画像は純粋な背景装飾として扱う。
   テキスト側の幅・間隔には一切影響させず、画像とテキストが
   重なっても構わない（z-index:-1 で常に文字の下に沈める）。
   position:relative は #service-01/02/03 セクション自体に付与済みなので、
   .rc-service-decor はセクションの最上部（見出しの上端）を基準に配置される。
   ============================================= */
.rc-service-decor {
  position           : absolute;
  z-index            : -1;
  top                : 0;
  margin-top         : 24px;
  width              : clamp(280px, 42vw, 620px);
  height             : clamp(280px, 30vw, 440px);
  background-repeat  : no-repeat;
  background-position: center top;
  background-size    : contain;
  pointer-events      : none;
}

/* 01・02・03：画像はすべて右 */
#service-01 .rc-service-decor,
#service-02 .rc-service-decor,
#service-03 .rc-service-decor {
  right: clamp(20px, 4vw, 40px);
}

#service-01 .rc-service-decor {
  background-image: url('/dcms_media/image/riskmanagement_consulting_img01.png');
}

#service-03 .rc-service-decor {
  background-image: url('/dcms_media/image/riskmanagement_consulting_img03.png');
}

#service-02 .rc-service-decor {
  background-image: url('/dcms_media/image/riskmanagement_consulting_img02.png');
}

/* =============================================
   コンテンツ行（サービス内容テーブル用）
   ============================================= */
.rc-content-row {
  display      : flex;
  align-items  : center;
  gap          : clamp(32px, 5vw, 56px);
  margin-bottom: 56px;
}

/* =============================================
   サービス内容テーブル
   ============================================= */
.rc-content-row .rc-table-scroll {
  flex     : 1;
  min-width: 0;
}

.rc-table-scroll {
  overflow-x                : auto;
  -webkit-overflow-scrolling: touch;
  border                    : 1px solid var(--oc-border);
}

table.rc-table {
  width          : 100%;
  min-width      : 420px;
  border-collapse: collapse;
  font-size      : clamp(12.5px, 1.2vw, 14px);
  background     : #fff;
}

table.rc-table th,
table.rc-table td {
  padding       : 16px 18px;
  text-align    : left;
  vertical-align: top;
  border-bottom : 1px solid var(--oc-border);
}

table.rc-table thead th {
  background : var(--oc-navy);
  color      : #fff;
  font-weight: 700;
  white-space: nowrap;
}

table.rc-table tbody th,
table.rc-table tbody td:first-child {
  font-weight: 700;
  color      : var(--oc-navy);
  white-space: nowrap;
}

table.rc-table tbody tr:last-child td {
  border-bottom: none;
}

/* アドバイザリー：タグリスト */
.rc-tag-list {
  display   : flex;
  flex-wrap : wrap;
  gap       : 12px;
  list-style: none;
  margin    : 24px 0 0;
  padding   : 0;
}

.rc-tag-list li {
  padding      : 10px 22px;
  background   : #fff;
  border       : 1px solid var(--oc-border);
  border-radius: 999px;
  font-size    : 13.5px;
  font-weight  : 700;
  color        : var(--oc-navy);
}

/* =============================================
   サービス詳細セクション末尾のCTA
   ============================================= */
.rc-service-cta {
  width        : 100vw;
  margin-inline: calc(50% - 50vw);
  padding      : clamp(40px, 6vw, 64px) 0;
}

.rc-service-cta-inner {
  text-align: center;
}

.rc-service-cta-inner p {
  margin     : 0 0 24px;
  font-size  : clamp(15px, 1.4vw, 18px);
  font-weight: 700;
  color      : #fff;
}

.rc-service-cta-btn {
  display        : inline-flex;
  align-items    : center;
  gap            : 10px;
  padding        : 13px 28px;
  background     : #fff;
  font-size      : clamp(13px, 1.1vw, 14px);
  font-weight    : 700;
  text-decoration: none !important;
  border-radius  : 4px;
  transition     : opacity 0.25s var(--oc-ease);
}

.rc-service-cta-btn:hover,
.rc-service-cta-btn:focus-visible {
  opacity: 0.8;
}

.rc-service-cta--01 {
  background: var(--rc-accent-01);
}

.rc-service-cta--01 .rc-service-cta-btn {
  color: var(--rc-accent-01) !important;
}

.rc-service-cta--02 {
  background: var(--rc-accent-02);
}

.rc-service-cta--02 .rc-service-cta-btn {
  color: var(--rc-accent-02) !important;
}

.rc-service-cta--03 {
  background: var(--rc-accent-03);
}

.rc-service-cta--03 .rc-service-cta-btn {
  color: var(--rc-accent-03) !important;
}

/* =============================================
   メリットカード（体制整備 / ISO27001）
   ============================================= */
/* 「体制整備によるメリット」：左に縦並びカード、右に大きな画像 */
.rc-merit-row {
  display      : flex;
  align-items  : stretch;
  gap          : clamp(32px, 5vw, 56px);
  margin-bottom: 56px;
}

.rc-merit-stack {
  flex          : 1;
  min-width     : 0;
  display       : flex;
  flex-direction: column;
  gap           : 32px;
}

.rc-merit-visual {
  flex-shrink: 0;
  width      : clamp(320px, 42vw, 520px);
}

.rc-merit-visual img {
  display   : block;
  width     : 100%;
  height    : 100%;
  object-fit: cover;
}

.rc-merit-card {
  position: relative;
}

.rc-merit-num {
  display    : inline-block;
  font-family: 'IBM Plex Sans', sans-serif;
  font-weight: 700;
}

.rc-merit-card h4 {
  margin     : 0 0 12px;
  font-size  : clamp(15px, 1.5vw, 17px);
  font-weight: 700;
  color      : var(--oc-navy);
  line-height: 1.5;
}

.rc-merit-card p {
  margin     : 0;
  font-size  : 13.5px;
  line-height: 1.85;
  color      : #555;
}

/* 体制整備によるメリット：写真の隣に置く、箱を使わないエディトリアル型リスト */
.rc-merit-stack .rc-merit-card h4 {
  display    : flex;
  align-items: center;
  gap        : 12px;
  font-size  : clamp(17px, 1.8vw, 20px);
}

.rc-merit-icon {
  display    : inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width      : 26px;
  height     : 26px;
  color      : var(--oc-red);
}

.rc-merit-icon svg {
  width : 100%;
  height: 100%;
}

/* ISO27001のメリット：円形ナンバー＋横並びのライトカード（グリッド） */
.rc-merit-grid {
  display              : grid;
  grid-template-columns: repeat(2, 1fr);
  gap                  : 20px;
}

.rc-merit-grid .rc-merit-card {
  display      : flex;
  align-items  : flex-start;
  gap          : 18px;
  background   : #fff;
  border-radius: 10px;
  padding      : 24px;
}

.rc-merit-grid .rc-merit-num {
  flex-shrink    : 0;
  width          : 40px;
  height         : 40px;
  display        : flex;
  align-items    : center;
  justify-content: center;
  border-radius  : 50%;
  background     : var(--oc-navy);
  color          : #fff;
  font-size      : 14px;
  margin-bottom  : 0;
}

.rc-merit-grid .rc-merit-body {
  min-width: 0;
  flex     : 1;
}

/* =============================================
   プライバシーマーク：フロー
   ============================================= */
.rc-step-flow {
  display              : grid;
  grid-template-columns: repeat(5, 1fr);
  gap                  : 0;
  margin-bottom        : 24px;
  background           : #fff;
  border               : 1px solid var(--oc-border);
  border-radius        : 10px;
  overflow             : hidden;
}

.rc-step {
  position  : relative;
  padding   : 28px 16px;
  text-align: center;
}

.rc-step + .rc-step {
  border-left: 1px dashed var(--oc-border);
}

.rc-step-num {
  display        : flex;
  align-items    : center;
  justify-content: center;
  width          : 40px;
  height         : 40px;
  margin         : 0 auto 14px;
  border-radius  : 50%;
  background     : var(--oc-navy);
  color          : #fff;
  font-family    : 'IBM Plex Sans', sans-serif;
  font-weight    : 700;
  font-size      : 14px;
}

.rc-step h4 {
  margin     : 0 0 10px;
  font-size  : 14.5px;
  font-weight: 700;
  color      : var(--oc-navy);
}

.rc-step p {
  margin     : 0;
  font-size  : 12.5px;
  line-height: 1.8;
  color      : #666;
  text-align : left;
}

/* =============================================
   サービス詳細ゾーンのスクロール連動ナビ（幅の広いデスクトップのみ）
   ============================================= */
.rc-service-subnav {
  display: none;
}

@media screen and (min-width: 1400px) {
  .rc-service-subnav {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 22px;
    position       : fixed;
    right          : 28px;
    top            : 50%;
    transform      : translateY(-50%) translateX(10px);
    z-index        : 40;
    opacity        : 0;
    pointer-events : none;
    transition     : opacity 0.3s var(--oc-ease), transform 0.3s var(--oc-ease);
  }

  .rc-service-subnav.is-visible {
    opacity  : 1;
    transform: translateY(-50%) translateX(0);
    pointer-events: auto;
  }

  .rc-service-subnav::before {
    content   : '';
    position  : absolute;
    top       : 17px;
    bottom    : 17px;
    left      : 50%;
    width     : 1px;
    background: var(--oc-border);
    z-index   : -1;
  }

  .rc-service-subnav-item {
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: center;
    text-decoration: none !important;
  }

  .rc-service-subnav-num {
    display        : flex;
    align-items    : center;
    justify-content: center;
    width          : 34px;
    height         : 34px;
    border-radius  : 50%;
    background     : #fff;
    border         : 2px solid var(--oc-border);
    color          : var(--oc-navy);
    font-family    : 'IBM Plex Sans', sans-serif;
    font-weight    : 700;
    font-size      : 12px;
    transition     : background-color 0.25s var(--oc-ease), border-color 0.25s var(--oc-ease), color 0.25s var(--oc-ease);
  }

  .rc-service-subnav-item:hover .rc-service-subnav-num {
    border-color: var(--oc-red);
  }

  .rc-service-subnav-item.is-active .rc-service-subnav-num {
    background  : var(--oc-navy);
    border-color: var(--oc-navy);
    color       : #fff;
  }

  .rc-service-subnav-item[data-target="service-01"].is-active .rc-service-subnav-num {
    background  : var(--rc-accent-01);
    border-color: var(--rc-accent-01);
  }

  .rc-service-subnav-item[data-target="service-02"].is-active .rc-service-subnav-num {
    background  : var(--rc-accent-02);
    border-color: var(--rc-accent-02);
  }

  .rc-service-subnav-item[data-target="service-03"].is-active .rc-service-subnav-num {
    background  : var(--rc-accent-03);
    border-color: var(--rc-accent-03);
  }

  .rc-service-subnav-tip {
    position       : absolute;
    top            : 50%;
    right          : 100%;
    margin-right   : 14px;
    transform      : translateY(-50%) translateX(6px);
    white-space    : nowrap;
    background     : var(--oc-navy);
    color          : #fff;
    font-size      : 12px;
    font-weight    : 700;
    padding        : 7px 14px;
    border-radius  : 4px;
    opacity        : 0;
    pointer-events : none;
    transition     : opacity 0.2s ease, transform 0.2s ease;
  }

  .rc-service-subnav-item:hover .rc-service-subnav-tip,
  .rc-service-subnav-item:focus-visible .rc-service-subnav-tip {
    opacity   : 1;
    transform : translateY(-50%) translateX(0);
  }
}

/* =============================================
   レスポンシブ
   ============================================= */
@media screen and (max-width: 979px) {

  .rc-persona-grid,
  .rc-merit-grid,
  .rc-feature-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .rc-step-flow {
    grid-template-columns: repeat(3, 1fr);
    row-gap              : 32px;
  }

  .rc-step:nth-child(3n+1) {
    border-left: none;
  }
}

@media screen and (max-width: 679px) {
  .rc-section {
    padding: 48px 0;
  }

  .rc-service-heading {
    gap: 16px;
  }

  .rc-service-heading-num {
    font-size: 40px;
  }

  .rc-service-lead {
    max-width: 100%;
  }

  .rc-service-decor {
    width : 60%;
    height: 180px;
  }

  .rc-persona-grid,
  .rc-merit-grid,
  .rc-feature-list {
    grid-template-columns: 1fr;
  }

  .rc-content-row,
  .rc-merit-row {
    flex-direction: column;
  }

  .rc-merit-visual {
    width : 100%;
    height: 280px;
  }

  .rc-step-flow {
    grid-template-columns: 1fr;
    row-gap              : 20px;
  }

  .rc-step {
    border-left: none !important;
    text-align : left;
    display    : flex;
    align-items: flex-start;
    gap        : 16px;
    padding    : 20px;
  }

  .rc-step-num {
    flex-shrink: 0;
    margin     : 0;
  }
}