@charset "UTF-8";

/* =========================
   공통
========================= */
.sub-inner {
  position: relative;
  width: 90%;
  height: 100%;
  max-width: 1400px;
  margin: 0 auto;
}
.first-section {
  padding: 195px 0 160px;
}
.mix-tit {
  margin-bottom: 40px;
  font-size: var(--fs-h2);
  line-height: 1.3;
  letter-spacing: -0.08rem;
}
.mix-tit strong {
  display: inline-block;
  color: var(--mint);
}
.sub-inner .tit strong span {
  color: var(--mint);
}
.img-box {
  position: relative;
  overflow: hidden;
  border-radius: var(--border30);
}
.img-box img {
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.p-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.p-box p {
  font-size: var(--fs-sub);
}
.p-box p > span {
  color: var(--mint);
  font-weight: var(--fw-700);
}

/* 배너 */
.banner {
  position: relative;
  padding: var(--padding160);
  text-align: center;
  color: var(--white);
}
.banner::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
}
.banner h5 {
  margin-bottom: 20px;
  font-size: var(--fs-h3);
  font-weight: var(--fw-700);
  line-height: 1.7;
}
.banner h5 span,
.banner p span {
  color: var(--mint);
}
.banner p {
  font-size: var(--fs-sub);
}
.banner .btn {
  margin: 30px auto 0;
}

/* 스와이퍼 라운드 버튼 - white */
.round-button-prev,
.round-button-next {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin-top: 0;
  padding: 0;
  border-radius: 50%;
  border: 1px solid var(--white);
  background: rgba(255, 255, 255, 0.2);
  color: var(--white);
  transition: var(--transition);
  transform: translateY(-50%);
}
.round-button-prev::after,
.round-button-next::after {
  color: inherit;
  font-size: var(--fs-body);
}
.round-button-prev:hover,
.round-button-next:hover {
  border-color: var(--mint);
  background: var(--mint);
  color: var(--white);
}
.round-button-prev { left: 5%; }
.round-button-next { right: 5%; }
.round-button-prev::after { transform: translate(-1px, 0); }
.round-button-next::after { transform: translate(1px, 0); }

/* 스와이퍼 라운드 버튼 - mint */
.mint-button-prev,
.mint-button-next {
  width: 40px;
  height: 40px;
  border: 1px solid var(--mint);
  background: rgba(48, 183, 186, 0.2);
  color: var(--mint);
  transition: var(--transition);
}
.mint-button-prev:hover,
.mint-button-next:hover {
  background: var(--mint);
  color: var(--white);
}
.mint-button-prev { left: 0; }
.mint-button-next { right: 0; }

/* =========================
   서브비주얼
========================= */
.sub-visual {
  position: relative;
  width: 100%;
  height: 85vh;
}
.about-page .sub-visual {
  background: url(/img/sub/sub-visual01.png) no-repeat center / cover;
}
.medical-service .sub-visual {
  background: url(/img/sub/sub-visual02.png) no-repeat 67% center / cover;
}
.medical-service .sub-visual::before {
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .1);
  position: absolute;
  top: 0;
  left: 0;
}

.highlevel-page .sub-visual {
  background: url(/img/sub/sub-visual03.jpg) no-repeat 35% center / cover;
}
.special-page .sub-visual {
  background: url(/img/sub/sub-visual04.png) no-repeat center / cover;
}
.onlycat-page .sub-visual {
  background: url(/img/sub/sub-visual05.jpg) no-repeat 26% center / cover;
}
.videocenter-page .sub-visual {
  background: url(/img/sub/sub-visual06.jpg) no-repeat 3% center / cover;
}
.healthcheckup-page .sub-visual {
  background: url(/img/sub/sub-visual07.jpg) no-repeat 68% center / cover;
}
.community-page .sub-visual {
  background: url(/img/sub/sub-visual08.jpg) no-repeat center / cover;
}
.sub-visual .sub-inner {
  display: flex;
  justify-content: center;
  align-items: center;
}
.sub-visual-textbox {
  text-align: center;
  color: var(--white);
}
.sub-visual-textbox .text {
  margin-top: 40px;
}
.sub-visual-textbox .text h2 {
  margin-bottom: 20px;
  font-size: 60px;
  font-weight: var(--fw-700);
}
.sub-visual-textbox .text span {
  font-size: var(--fs-sub);
  color: var(--eee);
  line-height: 1.5;
}

/* =========================
   브레드크럼
========================= */
.breadcrumb ol {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.breadcrumb li {
  font-size: var(--fs-small);
}
.breadcrumb li i {
  font-size: var(--fs-xsmall);
}
.breadcrumb li figure {
  display: inline-block;
  width: 16px;
  transform: translateY(1px);
}

/* =========================
   서브 네비게이션
========================= */
.sub-nav {
  display: flex;
  position: absolute;
  bottom: -35px;
  left: 50%;
  transform: translateX(-50%);
  padding: 0 10px;
  border: 1px solid var(--mint);
  border-radius: 100px;
  background: var(--white);
}
.nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 280px;
  height: 75px;
  border-radius: 5px;
  transition: var(--transition);
}
.nav-btn.on {
  color: var(--mint);
  font-weight: var(--fw-700);
}
.nav-btn:not(:last-child)::after {
  position: absolute;
  right: 0;
  content: '';
  width: 1px;
  height: 20px;
  background: rgba(1, 1, 1, 0.2);
}

/* =========================
   모바일 드롭다운
========================= */
.dropdown {
  display: none;
  position: absolute;
  bottom: -30px;
  width: 100%;
  z-index: 2;
}
.dropdown .dropdown-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  width: 100%;
  background: var(--white);
  border: 1px solid var(--mint);
  border-radius: 30px;
  cursor: pointer;
}
.dropdown .dropdown-header span,
.dropdown .dropdown-header i {
  color: var(--mint);
}
.dropdown .dropdown-header span {
  font-weight: var(--fw-700);
}
.dropdown .dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
}
.dropdown-list {
  display: block;
  max-height: 0;
  overflow: hidden;
  background: var(--white);
  border: transparent;
  border-radius: 0 0 30px 30px;
  transition: var(--transition);
}
.dropdown-list li {
  border-bottom: 1px solid #eee;
}
.dropdown-list li a {
  display: block;
  padding: 20px 40px;
  font-size: var(--fs-small);
  background: var(--white);
  color: var(--c999);
  transition: var(--transition);
}
.dropdown-list li:hover a,
.dropdown-list li.active a {
  font-weight: var(--fw-700);
  color: var(--black);
}
.dropdown.active .dropdown-header {
  border-radius: 30px 30px 0 0;
  border-bottom: transparent;
}
.dropdown.active .dropdown-list {
  border: 1px solid var(--mint);
  border-top: 1px solid var(--eee);
}

/* =========================
   공통 영역 반응형
========================= */
@media (max-width: 1600px) {
  .nav-btn { width: 230px; }
}
@media (max-width: 1280px) {
  .nav-btn {
    width: 185px;
    height: 65px;
  }
}
@media (max-width: 1024px) {
  .first-section { padding: 150px 0 120px; }
  .sub-visual-textbox .text { margin-top: 20px; }
  .sub-visual-textbox .text h2 { font-size: 50px; }
  .sub-nav { display: none; }
  .dropdown { display: block; }
  .mix-tit { margin-bottom: 30px; }
}
@media (max-width: 768px) {
  .first-section { padding: 130px 0 100px; }
  .breadcrumb ol { gap: 15px; }
  .sub-visual-textbox .text h2 {
    font-size: 40px;
    margin-bottom: 10px;
  }
  .mix-tit { margin-bottom: 20px; }
  .p-box { gap: 15px; }
  .round-button-prev,
  .round-button-next {
    width: 40px;
    height: 40px;
  }
}
@media (max-width: 480px) {
  .first-section { padding: 105px 0 80px; }
  .breadcrumb ol { gap: 5px; }
  .breadcrumb ol li figure { width: 14px; }
  .sub-visual-textbox .text { margin-top: 15px; }
  .sub-visual-textbox .text h2 { font-size: 35px; }
  .dropdown .dropdown-header,
  .dropdown-list li a { padding: 15px 30px; }
  .mix-tit { margin-bottom: 15px; }
  .round-button-prev,
  .round-button-next {
    width: 35px;
    height: 35px;
  }
}

/* =========================
   공통 섹션 레이아웃
========================= */
.second-section { padding: var(--padding160); background: var(--skyblue); }
.second-section .half-wrap { flex-direction: row-reverse; }
.second-section .half-wrap .tag { background: var(--white); }

/* ----------------------------------
	가로 테이블 섹션
---------------------------------- */
.horizontal-table-section {
  padding: var(--padding160);
  background: var(--skyblue);
}
.horizontal-table-box {
  display: flex;
  flex-direction: column;
  gap: 80px;
}
.horizontal-table {
  display: flex;
  border-radius: var(--border30);
  overflow: hidden;
}
.table-left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35%;
  background: var(--mint);
  color: var(--white);
  text-align: center;
}
.table-left h5 {
  font-size: var(--fs-h3);
  font-weight: var(--fw-700);
}
.table-right { flex: 1; background: var(--white); }
.table-right table { width: 100%; border-collapse: collapse; }
.table-right table th,
.table-right table td {
  padding: 30px;
  border-bottom: 1px solid var(--eee);
}
.table-right table th {
  border-right: 1px solid var(--eee);
  vertical-align: middle;
  font-size: var(--fs-h5);
  font-weight: var(--fw-700);
}
.table-right table tr:last-child th,
.table-right table tr:last-child td { border-bottom: none; }
.table-right table td { font-size: var(--fs-sub); color: #333; }

/* 반응형 */
@media (max-width: 1024px) {
  .horizontal-table-box { gap: 60px; }
  .horizontal-table { flex-direction: column; }
  .table-left { width: 100%; padding: 30px; }
  .table-left h5 { display: flex; align-items: center; gap: 15px; }
  .table-left h5 br { display: none; }
  .table-right table th,
  .table-right table td { padding: 25px; line-height: 1.5;}
}

@media (max-width: 768px) {
  .horizontal-table-box { gap: 40px; }
  .table-right table th,
  .table-right table td { padding: 20px; }
}

@media (max-width: 480px) {
  .table-left,
  .table-right table th,
  .table-right table td { padding: 15px; }
}

/* ----------------------------------
	가로 네비게이션
---------------------------------- */
.horizontal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 0 auto 80px;
  border: 1px solid var(--mint);
  border-radius: 100px;
}
.horizontal-nav li a {
  display: block;
  padding: 20px 80px;
  font-size: var(--fs-body);
  font-weight: var(--fw-700);
  color: var(--c999);
  border-radius: 50px;
}
.horizontal-nav li.on a { color: var(--white); background: var(--mint); }

/* 반응형 */
@media (max-width: 1440px) {
  .horizontal-nav li a { padding: 20px 60px; }
}

@media (max-width: 1024px) {
  .horizontal-nav { margin: 0 auto 60px; }
}

@media (max-width: 768px) {
  .horizontal-nav { margin: 0 auto 40px; }
  .horizontal-nav li a { padding: 15px 45px; }
}

@media (max-width: 480px) {
  .horizontal-nav { margin: 0 auto 30px; }
  .horizontal-nav li a { padding: 10px 20px; }
}

/* ----------------------------------
	스텝 섹션
---------------------------------- */
.step-section { padding: var(--padding160); }
.step-wrap {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: 20px;
}
.step-wrap li {
  width: calc((100% - 40px) / 3);
  border-radius: var(--border30);
  overflow: hidden;
  border: 1px solid var(--eee);
}
.step-wrap li figure { width: 100%; aspect-ratio: 5 / 3; overflow: hidden; }
.step-wrap li figure img { height: 100%; object-fit: cover; object-position: center; }
.step-wrap li .text-box { padding: 30px 30px 40px; }
.step-wrap li .text-box .step-tit { margin-bottom: 20px; }
.step-wrap li .text-box .step-tit .number { margin-bottom: 10px; }
.step-wrap li .text-box .step-tit span { font-size: var(--fs-h4); font-weight: var(--fw-700); }
.step-wrap li .text-box p { color: var(--c666); font-size: var(--fs-body); /* var(--fs-sub) */ }
.step-wrap li .text-box p span { font-weight: var(--fw-700); }

/* 반응형 */
@media (max-width: 1280px) {
  .step-wrap li .text-box { padding: 25px 25px 35px; }
}

@media (max-width: 1024px) {
  .step-wrap li { width: calc((100% - 20px) / 2); }
}

@media (max-width: 768px) {
  .step-wrap { gap: 15px; }
  .step-wrap li { width: calc((100% - 15px) / 2); }
  .step-wrap li .text-box { padding: 20px 20px 25px; }
  .step-wrap li .text-box .step-tit { margin-bottom: 10px; }
}

@media (max-width: 480px) {
  .step-wrap { flex-direction: column; }
  .step-wrap li { width: 100%; }
  .step-wrap li .text-box { padding: 15px 15px 20px; }
  .step-wrap li .text-box .step-tit { margin-bottom: 10px; }
  .step-wrap li .text-box .step-tit .number { margin-bottom: 8px; }
}

/* ----------------------------------
	딤드 그리드 섹션
---------------------------------- */
.dimmed-wrap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  justify-content: center;
  gap: 20px;
}
.dimmed-wrap li figure {
  position: relative;
  width: 100%;
  aspect-ratio: 335 / 400;
  border-radius: 20px;
  overflow: hidden;
  transition: var(--transition);
}
.dimmed-wrap li figure::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, .3);
}
.dimmed-wrap li figure img { height: 100%; object-fit: cover; }
.dimmed-wrap li p {
  text-align: center; font-size: var(--fs-h5); font-weight: var(--fw-700); margin-top: 20px;
}

/* 반응형 */
@media (max-width: 1280px) {
  .dimmed-wrap { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
  .dimmed-wrap { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .dimmed-wrap { gap: 10px; }
  .dimmed-wrap li figure { border-radius: 15px; }
  .dimmed-wrap li p { margin-top: 10px; }
}

/* ----------------------------------
	지그재그 섹션
---------------------------------- */
.zigzag { padding: var(--padding160); }
.zigzag-wrap { display: flex; flex-direction: column; gap: 80px; }
.zigzag-wrap li { display: flex; align-items: center; gap: 60px; }
.zigzag-wrap li:nth-child(2n) { flex-direction: row-reverse; }
.zigzag-wrap li figure {
  width: 50%; max-height: 400px; overflow: hidden; border-radius: var(--border30); aspect-ratio: 3 / 2;
}
.zigzag-wrap li figure img { height: 100%; object-fit: cover; }
.zigzag-wrap li .text-box { width: calc(50% - 60px); }
.zigzag-wrap li .text-box .zigzag-tit h5 {
  margin: 15px 0 30px; font-size: var(--fs-h2-2); font-weight: var(--fw-700);
}
.zigzag-wrap .p-box p { color: var(--c666); font-size: var(--fs-body); }
.zigzag-wrap .p-box p > span { display: block; font-size: var(--fs-sub); }

/* 반응형 */
@media (max-width: 1024px) {
  .zigzag-wrap { gap: 60px; }
  .zigzag-wrap li { gap: 40px; }
  .zigzag-wrap li .text-box { width: calc(50% - 40px); }
}

@media (max-width: 768px) {
  .zigzag-wrap { gap: 40px; }
  .zigzag-wrap li { flex-direction: column; gap: 30px; }
  .zigzag-wrap li:nth-child(2n) { flex-direction: column; }
  .zigzag-wrap li figure { width: 100%; max-height: 350px; }
  .zigzag-wrap li .text-box { width: 100%; }
  .zigzag-wrap li .text-box .zigzag-tit h5 { margin: 10px 0 20px; }
}

@media (max-width: 480px) {
  .zigzag-wrap li { gap: 20px; }
  .zigzag-wrap li .text-box .zigzag-tit h5 { margin: 8px 0 10px; }
}

/* ----------------------------------
	반반 레이아웃
---------------------------------- */
.half-wrap { display: flex; align-items: center; gap: 60px; }
.half-wrap .text-box { width: calc(50% - 60px); }
.half-wrap .img-box { width: 50%; height: 500px; }
.half-tit-box { display: flex; flex-direction: column; gap: 10px; }
.half-wrap .p-box p, .half-bigimg-wrap .p-box p { color: var(--c666); }

/* 반응형 */
@media (max-width: 1280px) {
  .half-wrap .text-box { gap: 30px; }
  .half-wrap .img-box { height: 550px; }
}

@media (max-width: 1024px) {
  .half-wrap { flex-direction: column-reverse; gap: 40px; }
  .half-wrap .img-box { width: 100%; height: 400px; }
  .half-wrap .text-box { width: 100%; }
}

@media (max-width: 768px) {
  .half-wrap { gap: 30px; }
  .half-wrap .img-box { height: 350px; }
}

@media (max-width: 480px) {
  .half-wrap { gap: 20px; }
  .half-wrap .img-box { height: 250px; }
}

/* ----------------------------------
	반반(빅이미지) 레이아웃
---------------------------------- */
.half-bigimg-wrap { display: flex; align-items: stretch; }
.half-bigimg-wrap > figure {
  position: relative; width: 50%;
}
.half-bigimg-wrap > figure img { height: 100%; object-fit: cover; object-position: center; }
.half-bigimg-wrap > figure::before {
  content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,.4); z-index: 1;
}
.half-bigimg-wrap > figure::after {
  content: ''; position: absolute; bottom: 20px; right: 20px; width: 50px; height: 50px;
  background: url(/img/symbol-wm.svg) no-repeat center; opacity: .7; z-index: 1;
}
.half-bigimg-wrap .text-box {
  background: var(--skyblue);
  padding: 160px calc((100vw - min(1400px, 90vw)) / 2) 160px 60px;
  width: 50%;
}

/* 반응형 */
@media (max-width: 1024px) {
  .half-bigimg-wrap { flex-direction: column; }
  .half-bigimg-wrap > figure { width: 100%; height: 400px; }
  .half-bigimg-wrap .text-box { width: 100%; padding: 40px 5% 120px; }
}

@media (max-width: 768px) {
  .half-bigimg-wrap > figure { height: 350px; }
  .half-bigimg-wrap .text-box { padding: 30px 5% 80px; }
}

@media (max-width: 480px) {
  .half-bigimg-wrap > figure { height: 250px; }
  .half-bigimg-wrap > figure::after { width: 30px; height: 30px; }
  .half-bigimg-wrap .text-box { padding: 20px 5% 80px; }
}

/* ----------------------------------
	반대 반반 레이아웃
---------------------------------- */
.reversal-section {
	padding: var(--padding160);
}

/* 반응형 */
@media (max-width: 1024px) {
	.reversal-section .half-wrap {
		flex-direction: column;	
	}
}

/* ----------------------------------
	요약(프로필+텍스트)
---------------------------------- */
.summary {
  display: flex; align-items: center; gap: 20px; margin-top: 50px;
  padding: 40px; border-radius: var(--border30); background: var(--white);
}
.summary figure { position: relative; width: 100px; height: 100px; border-radius: 100px; overflow: hidden; }
.summary figure img { height: 100%; object-fit: cover; object-position: center; }
.summary p { flex: 1; }

/* 반응형 */
@media (max-width: 1024px) {
  .summary { margin-top: 40px; padding: 30px; }
  .summary figure { width: 90px; height: 90px; }
}

@media (max-width: 768px) {
  .summary { margin-top: 30px; padding: 20px; }
  .summary figure { width: 80px; height: 80px; }
}

@media (max-width: 480px) {
  .summary { flex-direction: column; gap: 15px; padding: 15px; }
}

/* ----------------------------------
	카드 그리드 섹션
---------------------------------- */
.grid-card { padding: var(--padding160); }
.grid-card .card-box {
  position: relative; padding: 50px 30px; background: #fff;
  border: 1px solid var(--mint); border-radius: 15px;
}
.grid-card .card-box::before {
  position: absolute; bottom: 20px; right: 20px; content: '';
  display: block; width: 85px; height: 85px; opacity: .1;
}
.card-grid {
  display: grid; align-items: stretch;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 66px 20px; margin: 0 auto; max-width: 1100px; padding-top: 22px;
}
.card-grid .card-box p {
  position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);
  width: calc(100% - 60px); padding: 8px; text-align: center;
  font-size: var(--fs-h5); font-weight: var(--fw-700); color: var(--white);
  background: var(--mint); border-radius: 500px;
}
.card-grid .card-box ul { display: flex; flex-direction: column; gap: 15px; }
.card-grid .card-box li {
  display: flex; align-items: center; position: relative; list-style: none;
  font-size: var(--fs-sub); color: #333;
}
.card-grid .card-box li::before {
  content: ''; display: block; width: 20px; height: 20px; margin-right: 10px;
  background: url(/img/sub/svg/round-plus.svg) no-repeat center;
}

@media (max-width: 768px) {
  .grid-card .card-box { padding: 40px 20px; }
  .card-grid { gap: 60px 20px; padding-top: 18px; }
  .card-grid .card-box p { padding: 6px; }
  .card-grid .card-box ul { gap: 10px; }
  .grid-card .card-box::before { width: 80px; height: 80px; }
}

@media (max-width: 480px) {
  .grid-card .card-box { padding: 35px 20px; }
  .grid-card .card-box::before { bottom: 15px; right: 15px; width: 70px; height: 70px; }
  .card-grid { gap: 35px 20px; padding-top: 16px; }
  .card-grid .card-box p { padding: 5px; }
  .card-grid .card-box li::before { width: 15px; height: 15px; margin-right: 5px; }
}

/* ----------------------------------
	치료사례 케이스
---------------------------------- */
.treatment-case { padding: var(--padding160); background: var(--skyblue); }
.treatment-case-list { display: flex; align-items: stretch; gap: 20px; }
.treatment-case-list li {
  width: calc(100% / 3); background: var(--white); border-radius: var(--border30);
}
.treatment-case .btn { margin: 40px auto 0; }
.treatment-case .text-box {
  position: relative; margin-top: -30px;
  padding: 30px 30px 40px; background: var(--white); border-radius: var(--border30); text-align: center;
}
.treatment-case-list li figure {
  position: relative; height: 300px; overflow: hidden; border-radius: 30px 30px 0 0;
}
.treatment-case-list li figure img {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  object-fit: cover; height: 100%;
}
.treatment-case .card-tit-box span { display: block; margin-bottom: 5px; color: var(--mint); font-weight: var(--fw-700); }
.treatment-case .card-tit-box strong { font-size: var(--fs-h4); }
.treatment-case .text-box p { font-size: var(--fs-sub); color: var(--c666); margin-top: 20px; }

/* 반응형 */
@media (max-width: 1280px) {
  .treatment-case-list li figure { height: 250px; }
}

@media (max-width: 1024px) {
  .treatment-case-list { flex-wrap: wrap; }
  .treatment-case-list li { width: calc((100% / 2) - 15px); }
  .treatment-case-list li figure { height: 220px; border-radius: 25px 25px 0 0; }
  .treatment-case .text-box { padding: 25px 25px 30px; }
  .treatment-case .text-box p { margin-top: 15px; }
  .treatment-case .text-box p br { display: none; }
  .treatment-case .btn { margin: 35px auto 0; }
}

@media (max-width: 768px) {
  .treatment-case-list li figure { height: 200px; border-radius: 20px 20px 0 0; }
  .treatment-case .text-box { padding: 20px 20px 25px; }
  .treatment-case .text-box p { margin-top: 10px; }
  .treatment-case .btn { margin: 30px auto 0; }
}

@media (max-width: 480px) {
  .treatment-case-list li { width: 100%; }
  .treatment-case-list li figure { height: 200px; border-radius: 15px 15px 0 0; }
  .treatment-case .text-box { padding: 15px 15px 20px; }
  .treatment-case .text-box p br { display: block; }
}

/* ----------------------------------
	칼럼 리스트
---------------------------------- */
.column-list { display: flex; flex-direction: column; }
.column-list li { display: flex; flex-direction: column; gap: 10px; padding: 20px 0; position: relative; }
.column-list li:first-child { padding-top: 0; }
.column-list li::after {
  position: absolute; bottom: 0px; content: ''; width: 100%; height: 1px;
  background: var(--darkskyblue); display: block;
}
.column-list li strong { font-size: var(--fs-h5); }
.column-list li p { margin-top: 5px; color: var(--black) !important; font-size: var(--fs-sub); }

/* 반응형 */
@media (max-width: 1024px) {
  .column-list li { padding: 15px 0; }
  .column-list li p { margin-top: 0; }
}
@media (max-width: 480px) {
  .column-list li { gap: 8px; }
}

/* ----------------------------------
   질환 리스트 (ex. 안과)
---------------------------------- */
.disease-list { display: flex; flex-wrap: wrap; gap: 20px; }
.disease-list > li {
  display: flex; flex-direction: column; align-items: center;
  width: calc((100% - 60px)/4); padding: 40px; border-radius: var(--border30);
  background-color: var(--white); text-align: center;
}
.disease-list > li figure { width: 140px; height: 140px; }
.disease-list li .text-box { width: 100%; }
.disease-list li .text-box p { font-size: var(--fs-h4); font-weight: var(--fw-700); margin: 20px 0; }
.disease-list li .text-box ul {
  display: flex; flex-direction: column; align-items: center; gap: 15px;
}
.disease-list li .text-box ul li {
  background: rgba(48,183,186,0.05); padding: 10px; font-size: var(--fs-sub);
  border: 1px solid var(--mint); width: 100%; border-radius: 100px;
}

/* 반응형 */
@media (max-width: 1280px) {
  .disease-list > li { padding: 30px; }
  .disease-list > li figure { width: 130px; height: 130px; }
}

@media (max-width: 1024px) {
  .disease-list > li { width: calc((100% - 40px)/2); }
  .disease-list > li figure { width: 120px; height: 120px; }
  .disease-list li .text-box ul li { width: 80%; }
}

@media (max-width: 768px) {
  .disease-list { gap: 15px; }
  .disease-list > li { padding: 25px; }
  .disease-list > li figure { width: 110px; height: 110px; }
  .disease-list li .text-box ul { gap: 10px; }
  .disease-list li .text-box ul li { padding: 8px 10px; }
  .disease-list li .text-box p { margin: 15px 0; }
}

@media (max-width: 480px) {
  .disease-list { gap: 20px; }
  .disease-list > li { width: 100%; padding: 20px; gap: 5px; }
  .disease-list > li figure { width: 100px; height: 100px; }
  .disease-list li .text-box ul { gap: 6px; }
  .disease-list li .text-box ul li { padding: 6px 10px; }
  .disease-list li .text-box p { margin: 10px 0; }
}
