/* ===== Base ===== */
.rc-wrap{
  width:100%;
  background:#fff;
  color:#111;
  font-family:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;

  /* 글자 굵기/렌더링 통일 */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
}
.rc-wrap *{ box-sizing:border-box; }
.rc-wrap img{ display:block; max-width:100%; height:auto; }

.rc-p,
.rc-checktext,
.rc-card-text,
.rc-band-desc{
  font-size:17px;   /* ✅ 제목 제외 전부 17px */
  line-height:1.65;
  margin:0;
}

/* ===== Top category ===== */
.rc-topcat{
  width:100%;
  text-align:center;
  padding:80px 20px 10px;
}
.rc-topcat-line{
  display:block;
  width:1px;
  height:28px;
  background:#6bbf1f;
  margin: 10px auto;
}
.rc-topcat-title{
  margin:0;
  font-size:22px;
  font-weight:700;
  color:#6bbf1f;
}

/* ===== Section title ===== */
.rc-section-title{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  padding:10px 20px 30px;
}
.rc-hr{
  display:block;
  height:1px;
  width:min(520px, 32vw);
  background:#cfcfcf;
}
.rc-h2{
  margin:0;
  font-size:40px;
  font-weight:700;
  color:#111;
}

/* ===== Headline (h3 + short line) ===== */
.rc-headline{
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:16px;
}
.rc-headline--left{ justify-content:flex-start; }

.rc-h3{
  margin:0;
  font-size:20px;
  font-weight:700;
  white-space:nowrap;
}
.rc-h3-line{
  display:block;
  height:1px;
  width:120px;
  background:#cfcfcf;
}

/* ===== Upper row ===== */
.rc-upper{
  width:min(1200px, calc(100% - 80px));
  margin:0 auto;
  display:flex;
  align-items:flex-start;
  gap:60px;
  padding:10px 0 24px;
}
.rc-upper-img{
  flex:0 0 56%;
}
.rc-upper-img img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#eee;
}
.rc-upper-text{
  flex:1;
  padding-top:28px; /* 스샷처럼 살짝 아래 */
}
.rc-upper-text .rc-p{ margin-bottom:18px; }

/* ===== Lower row ===== */
.rc-lower{
  width:min(1200px, calc(100% - 80px));
  margin:0 auto;
  display:grid;
  grid-template-columns: 1fr 520px;
  gap:40px;
  padding:10px 0 70px;
  align-items:start;
}
.rc-cause{ padding-top:18px; }

.rc-checklist{
  list-style:none;
  padding:10px 0 0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.rc-checkitem{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.rc-check{
  width:16px;
  height:16px;
  display:inline-grid;
  place-items:center;
  margin-top:4px;
  background:#6bbf1f;
  color:#fff;
  border-radius:3px;
  font-size:12px;
  font-weight:800;
  line-height:1;
}
.rc-checktext{ color:#333; }

.rc-lower-img{
  justify-self:end;
  width:100%;
}
.rc-lower-img img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#eee;
}

/* ===== Symptom ===== */
.rc-symptom{
  padding:70px 20px 70px;
  background:#f2f2f2; /* 스샷처럼 밝은 회색 톤 */
}
.rc-symptom-title{
  margin:0 0 28px;
  text-align:center;
  font-size:40px;
  font-weight:700;
  color:#111;
}
.rc-symptom-bold{ font-weight:800; }

/* ✅ grid 반응형 핵심 */
.rc-symptom-grid{
  width:min(1200px, calc(100% - 80px));
  margin:0 auto;
  display:grid;
  gap:18px;
}
.rc-symptom-grid--3{
  grid-template-columns: repeat(3, 1fr);
  margin-bottom:22px;
}
.rc-symptom-grid--2{
  grid-template-columns: repeat(2, 1fr);
  width:min(820px, calc(100% - 80px)); /* 아래 2개는 가운데로 더 좁게 */
}

.rc-card{
  background:#fff;
  border:1px solid #e6e6e6;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  overflow:hidden;
}
.rc-card-img img{
  width:100%;
  aspect-ratio: 4 / 3;
  object-fit:cover;
  background:#eee;
}
.rc-card-cap{
  padding:18px 14px;
  text-align:center;
  background:#f8f8f8;
  border-top:1px solid #ededed;
}
.rc-card-text{
  color:#333;
}

/* ===== Dark band ===== */
.rc-band{
  background-color:#6a6a6a;
  background-image: url(../img/rotatorcuff-bg.png);
  background-size:cover;
  background-position:center;
  position:relative;
  padding:78px 20px;
}
.rc-band::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.35);
}
.rc-band-inner{
  position:relative;
  width:min(1200px, calc(100% - 80px));
  margin:0 auto;
  text-align:center;
  color:#fff;
}
.rc-band-title{
  margin:0 0 18px;
  font-size:40px;
  font-weight:700;
  color:#fff;
}
.rc-band-desc{
  color:rgba(255,255,255,0.92);
  margin:0 auto 18px;
}

/* ===== Responsive ===== */
@media (max-width:1200px){
  .rc-upper,
  .rc-lower,
  .rc-symptom-grid,
  .rc-band-inner{
    width:min(1200px, calc(100% - 40px));
  }
  .rc-symptom-grid--2{
    width:min(820px, calc(100% - 40px));
  }
}

@media (max-width:980px){
  .rc-upper{
    flex-direction:column;
    gap:22px;
  }
  .rc-upper-text{ padding-top:0; }

  .rc-lower{
    grid-template-columns: 1fr;
    gap:22px;
  }
  .rc-lower-img{ justify-self:stretch; }

  /* ✅ 3열 → 2열 */
  .rc-symptom-grid--3{
    grid-template-columns: repeat(2, 1fr);
  }
  .rc-symptom-grid--2{
    grid-template-columns: repeat(2, 1fr);
    width:min(1200px, calc(100% - 40px));
  }
}

@media (max-width:520px){
  .rc-section-title{ gap:16px; }
  .rc-hr{ width:22vw; }

  /* ✅ 2열 → 1열 */
  .rc-symptom-grid--3,
  .rc-symptom-grid--2{
    grid-template-columns: 1fr;
    width:min(1200px, calc(100% - 40px));
  }
}
