@charset "utf-8";

/* common */
:root {
    --sub1-color: #22213a;
    --sub2-color: #22213a;
}

/* ==========================================================================
   Sub Banner : 공통 구조
   ========================================================================== */
#sub_img {
    position: relative;
    width: 100%;
    height: 740px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 60px;
    box-sizing: border-box;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


#sub_img .center {
    z-index: 2;
    width: 100%;
}

#sub_img .sub_img__title {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#sub_img .sub_img__title {
    color: #fff;
    margin-bottom: 50px;
}

/* 브레드크럼 바 */
#sub_img .sub_img__depth_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

#sub_img .sub_img__path_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

#sub_img .sub_img__path {
    display: inline-flex;
    align-items: center;
    gap: 35px;
    background-color: rgba(0, 0, 0, 0.2);
    padding: 16px 30px;
    color: #fff;
    border-radius: 10px;
    backdrop-filter: blur(56px);
    -webkit-backdrop-filter: blur(56px);
    /* Safari */

}

#sub_img .sub_img__home {
    color: #fff;
    display: flex;
    align-items: center;
    font-size: 20px;
}

#sub_img .sub_img__bar {
    color: rgba(255, 255, 255, 0.3);
}

#sub_img .sub_img__depth {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    color: #fff;
}

#sub_img .sub_img__depth i {
    font-size: 15px;
    transition: transform 0.2s;
}

#sub_img .sub_img__depth:hover i {
    transform: rotate(180deg);
}

/* 드롭다운 목록 */
#sub_img .sub_img__drop {
    display: none;
    position: absolute;
    top: 100%;
    /* bottom: 100% → top: 100% */
    left: 0;
    min-width: 220px;
    background-color: #fff;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    /* 그림자 방향도 아래로 */
    padding: 10px 0;
    margin-top: 16px;
    /* margin-bottom → margin-top */
    z-index: 10;
}

#sub_img .sub_img__depth.is-open .sub_img__drop {
    display: block;
}

#sub_img .sub_img__drop li a {
    display: block;
    padding: 12px 24px;
    color: var(--black);
    white-space: nowrap;
}


#sub_img .sub_img__drop li a:hover {
    color: var(--gold);

}

/* 페이지별 배경 이미지만 클래스로 분리 */
.sub1_img {
    background-image: url('../images/sub1_banner.png');
}

.sub2_img {
    background-image: url('../images/sub2_banner.png');
}

.sub3_img {
    background-image: url('../images/sub3_banner.png');
}

.sub4_img {
    background-image: url('../images/sub4_banner.png');
}

.sub5_img {
    background-image: url('../images/sub5_banner.png');
}

.sub6_img {
    background-image: url('../images/sub6_banner.png');
}


/* ==========================================================================
   공통 : Intro Section (라벨 + 타이틀 + 이미지)
   ========================================================================== */
.sub_content__intro {
    width: 100%;
    padding: 120px 0;
}

.sub_content__intro .center {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

.sub_content__intro .sub_content__intro-text {
    flex: 0 0 42%;
}

.sub_content__intro .sub_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 20px;
}

.sub_content__intro .sub_content__title {
    margin-bottom: 30px;
}

.sub_content__intro .sub_content__strong {
    margin-bottom: 16px;
}

.sub_content__intro .sub_content__desc p {
    line-height: 1.8;
}

.sub_content__intro .sub_content__intro-img {
    flex: 1;
    border-radius: 20px;
    overflow: hidden;
}

.sub_content__intro .sub_content__intro-img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================================================
   Sub1_1 : Greeting Section
   ========================================================================== */
.sub1_1_content__greeting {
    width: 100%;
    padding-top: 120px;
    background-color: #fff;
}

.sub1_1_content__greeting .sub1_1_content__greeting-head {
    position: relative;
    text-align: center;
    margin-bottom: 60px;
    padding: 0 0 250px;
}

.sub1_1_content__greeting .sub1_1_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 16px;
}

.sub1_1_content__greeting .sub1_1_content__title {
    margin-bottom: 20px;
}

.sub1_1_content__greeting .sub1_1_content__greeting-img {
    position: absolute;
    width: 100%;
    height: 400px;
    overflow: hidden;
    bottom: -200px;
}

.sub1_1_content__greeting .sub1_1_content__greeting-img img {
    display: block;
    width: 100%;
    height: auto;
}

/* 남색 텍스트 영역 */
.sub1_1_content__greeting .sub1_1_content__greeting-text {
    width: 100%;
    background-color: var(--navy);
    padding: 250px 0 120px;
    box-sizing: border-box;
}

.sub1_1_content__greeting .sub1_1_content__greeting-quote {
    color: #fff;
    margin-bottom: 40px;
}

.sub1_1_content__greeting .sub1_1_content__greeting-body {
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.8;
}

.sub1_1_content__greeting .sub1_1_content__greeting-body p {
    margin-bottom: 28px;
}

.sub1_1_content__greeting .sub1_1_content__greeting-body p:last-child {
    margin-bottom: 0;
}

.sub1_1_content__greeting .sub1_1_content__greeting-sign {
    color: #fff;
    text-align: right;
    margin-top: 60px;
}

.sub1_1_content__greeting .sub1_1_content__greeting-sign span {
    margin-left: 10px;
}

/* ==========================================================================
   Sub1_1 : Medical Staff Section
   ========================================================================== */
.sub1_1_content__staff {
    width: 100%;
    padding: 120px 0;
}

.sub1_1_content__staff .center {
    display: flex;
    gap: 60px;
}

.sub1_1_content__staff .sub1_1_content__staff-img {
    flex: 0 0 42%;
    border-radius: 20px;
    overflow: hidden;
}

.sub1_1_content__staff .sub1_1_content__staff-img img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.sub1_1_content__staff .sub1_1_content__staff-info {
    flex: 1;
}

.sub1_1_content__staff .sub1_1_content__staff-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 20px;
    margin-right: 12px;
}

.sub1_1_content__staff .sub1_1_content__staff-en {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
}

.sub1_1_content__staff .sub1_1_content__staff-title {
    line-height: 1.4;
    margin: 24px 0 30px;
}

.sub1_1_content__staff .sub1_1_content__staff-line {
    width: 100%;
    height: 1px;
    background-color: #ddd;
    margin-bottom: 30px;
}

.sub1_1_content__staff .sub1_1_content__staff-name p {
    margin-bottom: 6px;
}

.sub1_1_content__staff .sub1_1_content__staff-tags {
    margin-top: 12px;
    color: #AAAAAA;
}

/* 진료시간 표 */
.sub1_1_content__staff .sub1_1_content__staff-time {
    margin-top: 40px;
}

.sub1_1_content__staff .sub1_1_content__staff-time-title {
    margin-bottom: 16px;
}

.sub1_1_content__staff .sub1_1_content__staff-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    text-align: center;
}

.sub1_1_content__staff .sub1_1_content__staff-table thead tr {
    background-color: var(--navy);
}

.sub1_1_content__staff .sub1_1_content__staff-table thead th {
    color: #fff;
    padding: 12px 0;
    font-weight: 700;
}

.sub1_1_content__staff .sub1_1_content__staff-table .left-top-radius {
    border-top-left-radius: 15px;
}

.sub1_1_content__staff .sub1_1_content__staff-table .right-top-radius {
    border-top-right-radius: 15px;
}

.sub1_1_content__staff .sub1_1_content__staff-table tbody td.left-bottom-radius {
    border-bottom-left-radius: 15px;
}

.sub1_1_content__staff .sub1_1_content__staff-table tbody td.right-bottom-radius {
    border-bottom-right-radius: 15px;
}


.sub1_1_content__staff .sub1_1_content__staff-table tbody td {
    padding: 14px 0;
    border: 1px solid #D7D7D7;
    color: var(--black);
    position: relative;
}

.sub1_1_content__staff .sub1_1_content__staff-table-label {
    color: var(--light_gray);
    font-weight: 600;
}



.sub1_1_content__staff .sub1_1_content__staff-table td.sub1_1_content__staff-table-label::before {
    display: none;
}

.sub1_1_content__staff .sub1_1_content__staff-table td::before {
    content: '';
    display: inline-block;
    width: 46px;
    height: 26px;
    line-height: 26px;
    border-radius: 20px;
    background-color: #F5F7FA;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.sub1_1_content__staff .sub1_1_content__staff-table td.is-active::before {
    content: '';
    display: inline-block;
    width: 46px;
    height: 26px;
    line-height: 26px;
    border-radius: 20px;
    background-color: var(--navy);
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.sub1_1_content__staff .sub1_1_content__staff-table td.is-active {
    color: #fff;
    z-index: 0;
    position: relative;
}

.sub1_1_content__staff .sub1_1_content__staff-notice {
    margin-top: 16px;
    line-height: 1.6;
    color: #999;
}

/* 구분선 (전체 폭) */
.sub1_1_content__staff .sub1_1_content__staff-divider {
    width: 100%;
    height: 1px;
    background-color: #ddd;
    margin: 50px 0 40px;
}

/* 약력 */
.sub1_1_content__staff .sub1_1_content__staff-career-title {
    margin-bottom: 20px;
}

.sub1_1_content__staff .sub1_1_content__staff-career-list li {
    position: relative;
    padding-left: 14px;
    margin-bottom: 12px;
    line-height: 1.5;
}

.sub1_1_content__staff .sub1_1_content__staff-career-list li::before {
    content: '·';
    position: absolute;
    left: 0;
    top: 0;
}

.sub1_1_content__staff .sub1_1_content__staff-career-list li:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   Sub1_2 : Location Section
   ========================================================================== */
.sub1_2_content__location {
    width: 100%;
    padding: 120px 0;
}

.sub1_2_content__location .sub1_2_content__location-head {
    text-align: center;
    margin-bottom: 60px;
}

.sub1_2_content__location .sub1_2_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 16px;
}

.sub1_2_content__location .sub1_2_content__title {
    margin-bottom: 20px;
}

.sub1_2_content__location .sub1_2_content__address {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 30px;
}

.sub1_2_content__location .sub1_2_content__copy {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--light_gray);
    cursor: pointer;
}

.sub1_2_content__location .sub1_2_content__map-links {
    display: flex;
    gap: 14px;
    margin-bottom: 50px;
}

.sub1_2_content__location .sub1_2_content__map-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border: 1px solid #e5e5e5;
    border-radius: 30px;
    color: var(--black);
}

.sub1_2_content__location .sub1_2_content__map-btn img {
    width: 20px;
    height: 20px;
}

.sub1_2_content__location .sub1_2_content__map {
    width: 100%;
}

.sub1_2_content__location .sub1_2_content__detail {
    padding-top: 50px;
    display: flex;
    justify-content: space-between;
}

.sub1_2_content__location .sub1_2_content__detail-col1 {
    display: flex;
    gap: 25px;
}

.sub1_2_content__location .sub1_2_content__detail-col2 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sub1_2_content__location .sub1_2_content__detail-col>p:first-child {
    margin-bottom: 20px;
}

.sub1_2_content__location .sub1_2_content__time-list li {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 12px;
}

.sub1_2_content__location .sub1_2_content__time-list li span:first-child {
    display: inline-block;
    width: 50px;
}

.sub1_2_content__location .sub1_2_content__lunch {
    margin-top: 16px;
}

.sub1_2_content__location .sub1_2_content__detail-col:last-child {
    text-align: left;
}

.sub1_2_content__location .sub1_2_content__detail-col:last-child p:nth-child(2) {
    margin-bottom: 20px;
}

.sub1_2_content__location .sub1_2_content__blog-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 14px 26px;
    background-color: var(--navy);
    color: #fff;
    border: 1px solid #fff;
    border-radius: 30px;
    margin-top: 25px;
}

.sub1_2_content__location .sub1_2_content__blog-btn:hover {
    background-color: #fff;
    color: var(--navy);
    border: 1px solid var(--navy);
}

/* ==========================================================================
   Sub1_3 : Non-Covered Charges Section
   ========================================================================== */
.sub1_3_content__charge {
    width: 100%;
    padding: 120px 0;
}

.sub1_3_content__charge .sub1_3_content__charge-head {
    text-align: center;
    margin-bottom: 60px;
}

.sub1_3_content__charge .sub1_3_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 16px;
}

.sub1_3_content__charge .sub1_3_content__title {
    margin-bottom: 20px;
}

.sub1_3_content__charge .sub1_3_content__sub {
    line-height: 1.6;
}

/* 탭 */
.sub1_3_content__charge .sub1_3_content__tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    background-color: #F5F5F5;
    border-radius: 40px;
    padding: 8px;
    margin: 0 auto 50px;
    max-width: 800px;
}

.sub1_3_content__charge .sub1_3_content__tab {
    flex: 1;
    padding: 16px 0;
    background: none;
    border: none;
    border-radius: 30px;
    color: var(--light_gray);
    cursor: pointer;
    transition: 0.2s;
}

.sub1_3_content__charge .sub1_3_content__tab.is-active {
    background-color: var(--navy);
    color: #fff;
}

/* 필터 */
.sub1_3_content__charge .sub1_3_content__filter {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 20px;
}

.sub1_3_content__charge .sub1_3_content__select {
    width: 140px;
    padding: 12px 16px;
    border: 1px solid #ddd;
    border-radius: 4px;
    color: var(--black);
    background-color: #fff;
}

.sub1_3_content__charge .sub1_3_content__search {
    position: relative;
    width: 300px;
}

.sub1_3_content__charge .sub1_3_content__search-input {
    width: 100%;
    padding: 12px 44px 12px 16px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-sizing: border-box;
}

.sub1_3_content__charge .sub1_3_content__search-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--light_gray);
    cursor: pointer;
}

/* 표 */
.sub1_3_content__charge .sub1_3_content__table-wrap {
    display: none;
}

.sub1_3_content__charge .sub1_3_content__table-wrap.is-active {
    display: block;
}

.sub1_3_content__charge .sub1_3_content__table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.sub1_3_content__charge .sub1_3_content__table thead th {
    background-color: #F5F5F5;
    color: var(--black);
    padding: 16px 10px;
    border: 1px solid #D7D7D7;
    font-weight: 700;
}

.sub1_3_content__charge .sub1_3_content__table tbody td {
    padding: 16px 10px;
    border: 1px solid #e5e5e5;
    color: var(--black);
    word-break: keep-all;
    overflow-wrap: break-word;
}

.sub1_3_content__charge .sub1_3_content__table tbody td.align-left {
    text-align: left;
}

.sub1_3_content__charge .sub1_3_content__empty {
    text-align: center;
    padding: 100px 0;
}

/* 페이지네이션 */
.sub1_3_content__charge .sub1_3_content__pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 50px;
}

.sub1_3_content__charge .sub1_3_content__page-nav,
.sub1_3_content__charge .sub1_3_content__page-num {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    border-radius: 50%;
    color: var(--light_gray);
    cursor: pointer;
}

.sub1_3_content__charge .sub1_3_content__page-num.is-active {
    background-color: var(--navy);
    color: #fff;
}

/* ==========================================================================
   Sub2_1 : Spine Clinic Intro Section
   ========================================================================== */
.sub2_1_content__intro {
    width: 100%;
    padding: 120px 0;
}

.sub2_1_content__intro .center {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

.sub2_1_content__intro .sub2_1_content__intro-text {
    flex: 0 0 45%;
}

.sub2_1_content__intro .sub2_1_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 20px;
}

.sub2_1_content__intro .sub2_1_content__title {
    margin-bottom: 30px;
}

.sub2_1_content__intro .sub2_1_content__strong {
    margin-bottom: 16px;
}

.sub2_1_content__intro .sub2_1_content__desc p {
    line-height: 1.8;
}

.sub2_1_content__intro .sub2_1_content__intro-img {
    flex: 1;
    overflow: hidden;
}

.sub2_1_content__intro .sub2_1_content__intro-img img {
    display: block;
    width: 100%;
    max-width: 720px;
    height: auto;
}

/* ==========================================================================
   Sub2_1 : Spinal Disease Section (sticky scroll spy)
   ========================================================================== */
.sub2_1_content__disease {
    width: 100%;
    padding: 100px 0;
    background-color: var(--navy);
    background-image: url('../images/sub1_2_bg1.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.sub2_1_content__disease .sub2_1_content__disease-head {
    text-align: center;
    color: #fff;
    margin-bottom: 100px;
}

.sub2_1_content__disease .sub2_1_content__disease-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 16px;
}

.sub2_1_content__disease .sub2_1_content__disease-title {
    line-height: 1.4;
}

.sub2_1_content__disease .sub2_1_content__disease-body {
    display: flex;
    gap: 100px;
    height: 700px;
    padding: 100px 0;
    overflow-y: auto;
    position: relative;
}

/* 스크롤바 숨기고 싶으면 (선택) */
.sub2_1_content__disease .sub2_1_content__disease-body::-webkit-scrollbar {
    width: 4px;
}

.sub2_1_content__disease .sub2_1_content__disease-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

.sub2_1_content__disease .sub2_1_content__disease-nav {
    flex: 0 0 220px;
    position: sticky;
    top: 0;
    align-self: flex-start;
    height: fit-content;
}

.sub2_1_content__disease .sub2_1_content__disease-panels {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 40px 0;
}

.sub2_1_content__disease .sub2_1_content__disease-panel {
    color: #fff;
    min-height: 800px;
    /* 스크롤 박스(1200px)보다 커야 스크롤이 발생함 */
}

/* 좌측 sticky 네비게이션 */
.sub2_1_content__disease .sub2_1_content__disease-nav {
    flex: 0 0 220px;
    position: sticky;
    top: 50px;
    align-self: flex-start;
    height: fit-content;
}

.sub2_1_content__disease .sub2_1_content__disease-nav-list li {
    position: relative;
    padding: 14px 0 14px 20px;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    border-left: 2px solid transparent;
    transition: 0.3s;
}

.sub2_1_content__disease .sub2_1_content__disease-nav-list li span {
    display: block;
    color: inherit;
}

.sub2_1_content__disease .sub2_1_content__disease-nav-list li.is-active {
    color: #fff;
    border-left-color: var(--gold);
}

.sub2_1_content__disease .sub2_1_content__disease-nav-list li.is-active span:first-child {
    color: var(--gold);
}

/* 우측 패널들 : 각 패널이 스크롤 트리거 역할 */
.sub2_1_content__disease .sub2_1_content__disease-panels {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 450px;
}

.sub2_1_content__disease .sub2_1_content__disease-panel {
    color: #fff;
    min-height: 400px;
}

.sub2_1_content__disease .sub2_1_content__panel-num {
    margin: 0 0 16px;
}

.sub2_1_content__disease .sub2_1_content__panel-en {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 10px;
}

.sub2_1_content__disease .sub2_1_content__panel-title {
    margin-bottom: 24px;
}

.sub2_1_content__disease .sub2_1_content__panel-desc {
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
    margin-bottom: 40px;
}

.sub2_1_content__disease .sub2_1_content__panel-img {
    width: 100%;
    max-width: 550px;
    border-radius: 20px;
    overflow: hidden;
}

.sub2_1_content__disease .sub2_1_content__panel-img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================================================
   Sub2_1 : Non-Surgical Section (slick slider, 2 visible)
   ========================================================================== */
.sub2_1_content__nonsurgical {
    width: 100%;
    padding: 140px 0;
    background-color: #fff;
    overflow: hidden;
}

.sub2_1_content__nonsurgical .center {
    display: flex;
    align-items: center;
    gap: 150px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-text {
    width: 100%;
    margin-right: 150px;
    min-width: 450px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 20px;
    margin-right: 12px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-en {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-title {
    line-height: 1.4;
    margin: 24px 0 20px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-desc p {
    line-height: 1.7;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-nav {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 50px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-num {
    color: var(--black);
}

#nonsurgical_total {
    color: var(--light_gray);
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-bar {
    position: relative;
    width: 80px;
    height: 2px;
    background-color: #e5e5e5;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-bar-fill {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #2FA9A0;
    transition: width 0.3s;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--black);
    cursor: pointer;
    margin-left: 6px;
}

/* 슬라이더 */
.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider-wrap {
    flex: 1;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100vw;

}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider .slick-list {
    margin: 0 -15px;
}

/* 대신 이렇게, item에 적용 */
.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-item {
    width: 100%;
    margin: 0 ;
    box-sizing: border-box;
}


.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider .slick-slide {
    display: flex;
    flex-direction: column;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider:not(.slick-initialized) {
    opacity: 1;
    gap: 50px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-item {
    box-sizing: border-box;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-img {
    width: 100%;
    max-width: 475px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-img img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 475px;
    object-fit: cover;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-caption {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 24px 0 12px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-num-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 15px;
    background-color: #00AAA8;
    color: #fff;
    border-radius: 4px;
}

.sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-item-desc {
    line-height: 1.6;
}

/* ==========================================================================
   Sub2_1 : CTA Section
   ========================================================================== */
.sub2_1_content__cta {
    width: 100%;
    padding: 0 0 140px;
    background-color: #fff;
}

.sub2_1_content__cta .sub2_1_content__cta-box {
    position: relative;
    width: 100%;
    border-radius: 24px;
    overflow: hidden;
    background-image: url('../images/sub2_1_cta.png');
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    min-height: 400px;
}

.sub2_1_content__cta .sub2_1_content__cta-text {
    position: relative;
    z-index: 2;
    color: #fff;
    padding: 60px 70px;
    flex: 0 0 100%;
    box-sizing: border-box;
}

.sub2_1_content__cta .sub2_1_content__cta-title {
    line-height: 1.4;
    margin-bottom: 24px;
}

.sub2_1_content__cta .sub2_1_content__cta-desc {
    line-height: 1.7;
    margin-bottom: 40px;
    color: rgba(255, 255, 255, 0.85);
}

.sub2_1_content__cta .sub2_1_content__cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 14px 30px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 30px;
    color: #fff;
}

.sub2_1_content__cta .sub2_1_content__cta-btn:hover {
    background-color: #fff;
    color: var(--navy);
}

/* ==========================================================================
   Sub2_2 : Symptoms Of Spinal Disease Section
   ========================================================================== */
.sub2_2_content__intro {
    width: 100%;
    padding: 120px 0;
}

.sub2_2_content__intro .center {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

.sub2_2_content__intro .sub2_2_content__intro-text {
    flex: 0 0 42%;
}

.sub2_2_content__intro .sub2_2_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 20px;
}

.sub2_2_content__intro .sub2_2_content__title {
    margin-bottom: 30px;
}

.sub2_2_content__intro .sub2_2_content__strong {
    margin-bottom: 16px;
}

.sub2_2_content__intro .sub2_2_content__desc p {
    line-height: 1.8;
}

.sub2_2_content__intro .sub2_2_content__intro-img {
    flex: 1;
    border-radius: 20px;
    overflow: hidden;
}

.sub2_2_content__intro .sub2_2_content__intro-img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================================================
   Sub2_2 : Spine Symptoms Section
   ========================================================================== */
.sub2_2_content__symptoms {
    width: 100%;
    padding: 140px 0;
    background-color: #F5F7FA;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-head {
    text-align: center;
    margin-bottom: 100px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 12px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-title {
    line-height: 1.4;
    margin-bottom: 24px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-line {
    display: inline-block;
    width: 1px;
    height: 40px;
    background-color: #ccc;
    margin-bottom: 24px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-desc p {
    line-height: 1.7;
}

/* 항목 리스트 */
.sub2_2_content__symptoms .sub2_2_content__symptoms-list {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-item {
    position: relative;
    display: flex;
    align-items: center;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-item.is-reverse {
    justify-content: flex-end;
}

/* 카드 (남색, 점무늬 텍스처) */
.sub2_2_content__symptoms .sub2_2_content__symptoms-card {
    position: relative;
    z-index: 2;
    flex: 0 0 54%;
    background: linear-gradient(135deg, rgba(10, 41, 97, 1) 0%, rgba(25, 62, 130, 1) 100%);
    color: #fff;
    padding: 50px 45px;
    border-radius: 8px;
    border-top-right-radius: 60px;
    border-bottom-left-radius: 60px;
    box-sizing: border-box;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);

}

/* 오버레이 : 그라데이션 위에 검은 반투명 레이어 */
.sub2_2_content__symptoms .sub2_2_content__symptoms-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    border-top-right-radius: 60px;
    border-bottom-left-radius: 60px;
    z-index: -1;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-en {
    display: block;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 5px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-title2 {
    margin-bottom: 40px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-card-line {
    display: block;
    width: 100%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
    margin-bottom: 24px;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-item-desc {
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
}

/* 이미지 : 카드와 겹치도록 음수 마진으로 위치 조정 */
.sub2_2_content__symptoms .sub2_2_content__symptoms-img {
    position: relative;
    z-index: 1;
    flex: 0 0 54%;
    margin-left: -4 %;
    margin-top: 15%;
    border-radius: 10px;
    overflow: hidden;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-item.is-reverse .sub2_2_content__symptoms-img {
    margin-left: 0;
    margin-right: -8%;
    order: -1;
}

.sub2_2_content__symptoms .sub2_2_content__symptoms-item.is-reverse .sub2_2_content__symptoms-card {
    order: 0;
}

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


/* ==========================================================================
   Sub2_3 : Spine Care & Treatment Intro Section
   ========================================================================== */
.sub2_3_content__intro {
    width: 100%;
    padding: 120px 0;
}

.sub2_3_content__intro .center {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

.sub2_3_content__intro .sub2_3_content__intro-text {
    flex: 0 0 42%;
}

.sub2_3_content__intro .sub2_3_content__label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 20px;
}

.sub2_3_content__intro .sub2_3_content__title {
    margin-bottom: 30px;
}

.sub2_3_content__intro .sub2_3_content__strong {
    margin-bottom: 16px;
}

.sub2_3_content__intro .sub2_3_content__desc p {
    line-height: 1.8;
}

.sub2_3_content__intro .sub2_3_content__intro-img {
    flex: 1;
    border-radius: 20px;
    overflow: hidden;
}

.sub2_3_content__intro .sub2_3_content__intro-img img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================================================
   Sub2_3 : Spine Golden Time Section
   ========================================================================== */
.sub2_3_content__goldentime {
    width: 100%;
    padding: 140px 0;
    background-color: #fff;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-head {
    text-align: center;
    margin-bottom: 60px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 12px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-title {
    line-height: 1.4;
}

/* ==========================================================================
   Sub2_3 : Increase In Patients - Chart Card
   ========================================================================== */
.sub2_3_content__goldentime .sub2_3_content__goldentime-img {
    width: 100%;
    background-color: #F5F7FA;
    border-radius: 20px;
    padding: 50px 60px;
    box-sizing: border-box;
    margin-bottom: 60px;
    text-align: center;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-chart-title {
    color: var(--black);
    margin-bottom: 10px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-chart-note {
    color: #AAAAAA;
    margin-bottom: 40px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-chart-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: ce;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-chart-wrap img {
    display: block;
    max-width: 640px;
    width: 100%;
    height: auto;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-chart-source {
    color: #999999;
    text-align: right;
    margin-top: 16px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-desc p {
    margin-bottom: 8px;
}

.sub2_3_content__goldentime .sub2_3_content__goldentime-desc p:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   Sub2_3 : Treatment Steps Section
   ========================================================================== */
.sub2_3_content__steps {
    width: 100%;
    padding: 140px 0;
    background-color: #F5F7FA;
}

.sub2_3_content__steps.sub4_1_content__steps {
    background-color: #fff;
}

.sub2_3_content__steps .sub2_3_content__steps-head {
    margin-bottom: 60px;
}

.sub2_3_content__steps .sub2_3_content__steps-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 20px;
    margin-right: 12px;
}

.sub2_3_content__steps .sub2_3_content__steps-en {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
}

.sub2_3_content__steps .sub2_3_content__steps-title {
    margin: 24px 0 20px;
}

.sub2_3_content__steps .sub2_3_content__steps-desc p {
    line-height: 1.6;
}

/* 카드 리스트 */
.sub2_3_content__steps .sub2_3_content__steps-list {
    display: flex;
    gap: 20px;
    margin-top: 40px;
}

.sub2_3_content__steps .sub2_3_content__steps-card {
    flex: 1;
    background-color: #fff;
    border-radius: 16px;
    padding: 40px 10px;
    text-align: center;
    box-sizing: border-box;
}

.sub2_3_content__steps .sub4_1_content__steps-card {
    background-color: #F5F7FA !important;
}

.sub2_3_content__steps .sub2_3_content__steps-num {
    display: block;
    margin-bottom: 16px;
}

.sub2_3_content__steps .sub2_3_content__steps-name {
    margin-bottom: 16px;
}

.sub2_3_content__steps .sub2_3_content__steps-text p {
    line-height: 1.6;
}

/* ==========================================================================
   Sub3_1 : Preventive Measure Section
   ========================================================================== */
.sub3_1_content__prevent {
    width: 100%;
    padding: 140px 0;
    background-color: #F5F7FA;
}

.sub3_1_content__prevent .sub3_1_content__prevent-head {
    margin-bottom: 60px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 20px;
    margin-right: 12px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-en {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
}

.sub3_1_content__prevent .sub3_1_content__prevent-title {
    margin: 24px 0 20px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-desc p {
    line-height: 1.6;
}

/* 본문 : 좌측 이미지 + 우측 체크리스트 */
.sub3_1_content__prevent .sub3_1_content__prevent-body {
    display: flex;
    gap: 20px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-img {
    flex: 0 0 42%;
    border-radius: 16px;
    overflow: hidden;
}

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

.sub3_1_content__prevent .sub3_1_content__prevent-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-item {
    display: flex;
    align-items: center;
    gap: 20px;
    background-color: #fff;
    padding: 24px 30px;
    border-radius: 33px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 50%;
    flex: 0 0 auto;
    font-size: 15px;
}

.sub3_1_content__prevent .sub3_1_content__prevent-name {
    flex: 0 0 auto;
    white-space: nowrap;
}

.sub3_1_content__prevent .sub3_1_content__prevent-bar {
    display: inline-block;
    width: 1px;
    height: 20px;
    background-color: #ccc;
    flex: 0 0 auto;
}

.sub3_1_content__prevent .sub3_1_content__prevent-text {
    flex: 1;
}

/* ==========================================================================
   Sub5_1 : Treatment Method Section
   ========================================================================== */
.sub5_1_content__method {
    width: 100%;
    padding: 140px 0;
    background-color: #F5F7FA;
}

.sub5_1_content__method .sub5_1_content__method-head {
    text-align: center;
    margin-bottom: 80px;
}

.sub5_1_content__method .sub5_1_content__method-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 12px;
}

.sub5_1_content__method .sub5_1_content__method-title {
    line-height: 1.4;
    margin-bottom: 24px;
}

.sub5_1_content__method .sub5_1_content__method-line {
    display: inline-block;
    width: 1px;
    height: 40px;
    background-color: #ccc;
    margin-bottom: 24px;
}

.sub5_1_content__method .sub5_1_content__method-desc {
    line-height: 1.7;
}

.sub5_1_content__method .sub5_1_content__method-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sub5_1_content__method .sub5_1_content__method-item {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.sub5_1_content__method .sub5_1_content__method-item.is-reverse {
    flex-direction: row-reverse;
}

.sub5_1_content__method .sub5_1_content__method-card {
    flex: 0 0 42%;
    background-color: var(--navy);
    color: #fff;
    padding: 50px 45px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sub5_1_content__method .sub5_1_content__method-en {
    display: block;
    font-family: 'Cormorant Garamond', serif;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 10px;
}

.sub5_1_content__method .sub5_1_content__method-name {
    margin-bottom: 20px;
}

.sub5_1_content__method .sub5_1_content__method-text p {
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
}

.sub5_1_content__method .sub5_1_content__method-img {
    flex: 1;
    overflow: hidden;
}

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

/* ==========================================================================
   Sub5_1 : Notice Section
   ========================================================================== */
.sub5_1_content__notice {
    width: 100%;
    padding: 140px 0;
    background-color: #fff;
}

.sub5_1_content__notice .sub5_1_content__notice-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 12px;
}

.sub5_1_content__notice .sub5_1_content__notice-title {
    line-height: 1.4;
    margin-bottom: 40px;
}

.sub5_1_content__notice .sub5_1_content__notice-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: 40px;
    margin-bottom: 20px;
}

.sub5_1_content__notice .sub5_1_content__notice-desc p {
    line-height: 1.7;
}

.sub5_1_content__notice .sub5_1_content__notice-links {
    display: flex;
    gap: 12px;
    flex: 0 0 auto;
}

.sub5_1_content__notice .sub5_1_content__notice-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 14px 24px;
    border-radius: 30px;
    color: #fff;
    white-space: nowrap;
    transition: transform 0.3s ease;

}

.sub5_1_content__notice .sub5_1_content__notice-btn.is-navy {
    background-color: var(--navy);
}

.sub5_1_content__notice .sub5_1_content__notice-btn.is-red {
    background-color: #D63447;
}

.sub5_1_content__notice .sub5_1_content__notice-btn:hover .xi-plus{
    transform: rotate(180deg);
}

/* ==========================================================================
   Sub5_1 : Treatment Method Section
   ========================================================================== */
.sub5_1_content__method {
    width: 100%;
    padding: 140px 0;
    background-color: #F5F7FA;
}

.sub5_1_content__method .sub5_1_content__method-head {
    text-align: center;
    margin-bottom: 80px;
}

.sub5_1_content__method .sub5_1_content__method-label {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    margin-bottom: 12px;
}

.sub5_1_content__method .sub5_1_content__method-title {
    line-height: 1.4;
    margin-bottom: 24px;
}

.sub5_1_content__method .sub5_1_content__method-line {
    display: inline-block;
    width: 1px;
    height: 40px;
    background-color: #ccc;
    margin-bottom: 24px;
}

.sub5_1_content__method .sub5_1_content__method-desc {
    line-height: 1.7;
}

.sub5_1_content__method .sub5_1_content__method-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sub5_1_content__method .sub5_1_content__method-item {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.sub5_1_content__method .sub5_1_content__method-item.is-reverse {
    flex-direction: row-reverse;
}

.sub5_1_content__method .sub5_1_content__method-card {
    flex: 0 0 42%;
    background-color: var(--navy);
    color: #fff;
    padding: 50px 45px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sub5_1_content__method .sub5_1_content__method-en {
    display: block;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 10px;
}

.sub5_1_content__method .sub5_1_content__method-name {
    margin-bottom: 20px;
}

.sub5_1_content__method .sub5_1_content__method-text p {
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
}

.sub5_1_content__method .sub5_1_content__method-img {
    flex: 1;
    overflow: hidden;
}

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

/* 아코디언 헤드 : 위쪽 라운드 카드 */
.sub5_1_content__notice .sub5_1_content__notice-acc-item {
    border: none;
    margin-bottom: 20px;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-head {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 24px 30px;
    background: none;
    border: 1px solid #eee;
    border-radius: 12px;
    cursor: pointer;
    text-align: left;
    box-sizing: border-box;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-item.is-active .sub5_1_content__notice-acc-head {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: none;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    background-color: var(--navy);
    color: #fff;
    border-radius: 20px;
    flex: 0 0 auto;
    white-space: nowrap;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-summary {
    flex: 1;
    color: var(--black);
}

.sub5_1_content__notice .sub5_1_content__notice-acc-head i {
    transition: transform 0.2s;
    color: var(--light_gray);
    flex: 0 0 auto;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-item.is-active .sub5_1_content__notice-acc-head i {
    transform: rotate(180deg);
}

/* 아코디언 본문 : 회색 카드 */
.sub5_1_content__notice .sub5_1_content__notice-acc-body {
    display: none;
    background-color: #F5F7FA;
    padding: 40px 30px;
    border-radius: 0 0 12px 12px;
    box-sizing: border-box;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-item.is-active .sub5_1_content__notice-acc-body {
    display: block;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-block {
    margin-bottom: 30px;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-block:last-child {
    margin-bottom: 0;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-sub {
    margin-bottom: 12px;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-text p {
    line-height: 1.7;
    margin-bottom: 4px;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-text p:last-child {
    margin-bottom: 0;
}

/* 참고사항 리스트 */
.sub5_1_content__notice .sub5_1_content__notice-acc-list li {
    position: relative;
    padding-left: 16px;
    margin-bottom: 16px;
    line-height: 1.7;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-list li::before {
    content: '·';
    position: absolute;
    left: 0;
    top: 0;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-list li:last-child {
    margin-bottom: 0;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-final {
    margin-top: 24px;
    margin-bottom: 20px;
    line-height: 1.7;
}

.sub5_1_content__notice .sub5_1_content__notice-acc-contact {
    line-height: 1.7;
}

/* ==========================================================================
   Tablet (768px ~ 1024px)
   ========================================================================== */
@media screen and (min-width: 768px) and (max-width: 1024px) {

    /* Sub Banner */
    #sub_img {
        height: 480px;
    }

    #sub_img .sub_img__title {
        font-size: 44px;
    }

    #sub_img .sub_img__path {
        gap: 20px;
        padding: 12px 20px;
        flex-wrap: wrap;
    }

    /* 공통 Intro */
    .sub_content__intro {
        padding: 90px 0;
    }

    .sub_content__intro .center {
        gap: 40px;
    }

    /* Sub1_1 : Greeting */
    .sub1_1_content__greeting .sub1_1_content__greeting-head {
        padding: 0 0 180px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-img {
        height: 320px;
        bottom: -150px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-text {
        padding: 180px 0 90px;
    }

    /* Sub1_1 : Medical Staff */
    .sub1_1_content__staff .center {
        gap: 40px;
    }

    /* Sub1_2 : Location */
    .sub1_2_content__location .sub1_2_content__detail {
        gap: 40px;
    }

    .sub1_2_content__location .sub1_2_content__map-links {
        flex-wrap: wrap;
        gap: 10px;
    }

    /* Sub1_3 : Charge */
    .sub1_3_content__charge .sub1_3_content__filter {
        flex-wrap: wrap;
    }

    .sub1_3_content__charge .sub1_3_content__search {
        width: 220px;
    }

    /* Sub2_1 : Spinal Disease */
    .sub2_1_content__disease .sub2_1_content__disease-body {
        gap: 50px;
        height: 600px;
    }

    .sub2_1_content__disease .sub2_1_content__disease-nav {
        flex: 0 0 160px;
    }

    .sub2_1_content__disease .sub2_1_content__disease-panels {
        gap: 300px;
    }

    /* Sub2_1 : Non-Surgical */
    .sub2_1_content__nonsurgical .center {
        flex-direction: column;
        gap: 40px;
    }

    .sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-text {
        margin-right: 0;
        min-width: 0;
        width: 100%;
    }

    .sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider-wrap {
        width: 100%;
    }

    /* Sub2_1 : CTA */
    .sub2_1_content__cta .sub2_1_content__cta-box {
        min-height: 320px;
    }

    .sub2_1_content__cta .sub2_1_content__cta-text {
        padding: 40px 40px;
    }

    /* Sub2_2 : Symptoms */
    .sub2_2_content__symptoms .sub2_2_content__symptoms-card,
    .sub2_2_content__symptoms .sub2_2_content__symptoms-img {
        flex: 0 0 60%;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-card {
        padding: 36px 30px;
    }

    /* Sub2_3 : Steps card */
    .sub2_3_content__steps .sub2_3_content__steps-list {
        flex-wrap: wrap;
    }

    .sub2_3_content__steps .sub2_3_content__steps-card {
        flex: 0 0 calc(50% - 10px);
    }

    /* Sub3_1 : Prevent */
    .sub3_1_content__prevent .sub3_1_content__prevent-body {
        flex-direction: column;
    }

    .sub3_1_content__prevent .sub3_1_content__prevent-img {
        flex: 0 0 auto;
        height: 320px;
    }

    /* Sub5_1 : Method */
    .sub5_1_content__method .sub5_1_content__method-card {
        flex: 0 0 46%;
        padding: 36px 30px;
    }

    /* Sub5_1 : Notice */
    .sub5_1_content__notice .sub5_1_content__notice-top {
        flex-direction: column;
        gap: 20px;
    }

    .sub5_1_content__notice .sub5_1_content__notice-links {
        flex-wrap: wrap;
    }
}

/* ==========================================================================
   Mobile (max-width: 767px)
   ========================================================================== */
@media screen and (max-width: 767px) {

    #footer .center {
        margin: 0;
    }

    /* Sub Banner */
    #sub_img {
        height: 320px;
        padding-bottom: 30px;
    }

    #sub_img .sub_img__title {
        font-size: 30px;
        margin-bottom: 24px;
    }

    #sub_img .sub_img__path {
        width: calc(100% - 10%);
        gap: 7.5px;
        padding: 10px;
        flex-wrap: wrap;
        justify-content: center;
        box-sizing: border-box;
    }
    #sub_img .sub_img__drop li a{
        padding: 12px;
    }
    #sub_img .sub_img__drop {
        min-width: 0;
    }
    #sub_img .sub_img__home {
        font-size: 16px;
    }

    #sub_img .sub_img__depth span:first-child {
        font-size: 14px !important;
    }

    /* 공통 Intro : 좌우 → 세로 스택 */
    .sub_content__intro {
        padding: 60px 0;
    }

    .sub_content__intro .center {
        flex-direction: column;
        gap: 30px;
    }

    .sub_content__intro .sub_content__intro-text {
        flex: 0 0 auto;
        width: 100%;
    }

    .sub_content__intro .sub_content__intro-img {
        width: 100%;
    }

    /* Sub1_1 : Greeting */
    .sub1_1_content__greeting {
        padding-top: 60px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-head {
        padding: 0 0 120px;
        margin-bottom: 30px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-img {
        height: 200px;
        bottom: -150px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-text {
        padding: 120px 0 60px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-body p {
        margin-bottom: 20px;
    }

    .sub1_1_content__greeting .sub1_1_content__greeting-sign {
        margin-top: 40px;
    }

    /* Sub1_1 : Medical Staff */
    .sub1_1_content__staff {
        padding: 60px 0;
    }

    .sub1_1_content__staff .center {
        flex-direction: column;
        gap: 30px;
    }

    .sub1_1_content__staff .sub1_1_content__staff-img {
        flex: 0 0 auto;
        width: 100%;
    }

    .sub1_1_content__staff .sub1_1_content__staff-table {
        font-size: 12px;
    }

    .sub1_1_content__staff .sub1_1_content__staff-table thead th,
    .sub1_1_content__staff .sub1_1_content__staff-table tbody td {
        padding: 8px 0;
    }

    .sub1_1_content__staff .sub1_1_content__staff-table td::before,
    .sub1_1_content__staff .sub1_1_content__staff-table td.is-active::before {
        width: 34px;
        height: 22px;
        line-height: 22px;
    }

    /* Sub1_2 : Location */
    .sub1_2_content__location {
        padding: 60px 0;
    }

    .sub1_2_content__location .sub1_2_content__address {
        flex-wrap: wrap;
    }

    .sub1_2_content__location .sub1_2_content__map-links {
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 30px;
    }

    .sub1_2_content__location .sub1_2_content__map-btn {
        padding: 8px 16px;
    }

    .sub1_2_content__location .sub1_2_content__detail {
        flex-direction: column;
        gap: 30px;
        padding-top: 30px;
    }

    /* Sub1_3 : Charge */
    .sub1_3_content__charge {
        padding: 60px 0;
    }

    .sub1_3_content__charge .sub1_3_content__tabs {
        flex-wrap: wrap;
    }

    .sub1_3_content__charge .sub1_3_content__filter {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .sub1_3_content__charge .sub1_3_content__select,
    .sub1_3_content__charge .sub1_3_content__search {
        width: 100%;
    }

    .sub1_3_content__charge .sub1_3_content__table {
        font-size: 12px;
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .sub2_1_content__intro .center {
        flex-direction: column;
    }

    /* Sub2_1 : Spinal Disease - 좌측 sticky 목록도 세로에서 위로 이동 */

    .sub2_1_content__disease {
        padding: 60px 0;
    }

    .sub2_1_content__disease .sub2_1_content__disease-head {
        margin-bottom: 50px;
    }

    .sub2_1_content__disease .sub2_1_content__disease-body {
        flex-direction: column;
        height: auto;
        max-height: 70vh;
        gap: 0;
        padding: 0;
    }

    .sub2_1_content__disease .sub2_1_content__disease-nav {
        position: relative;
        top: 0;
        flex: 0 0 auto;
        width: 100%;
        display: flex;
        overflow-x: auto;
        margin-bottom: 20px;
    }

    .sub2_1_content__disease .sub2_1_content__disease-nav-list {
        display: flex;
        gap: 12px;
    }

    .sub2_1_content__disease .sub2_1_content__disease-nav-list li {
        padding: 10px 14px;
        white-space: nowrap;
        border-left: none;
        border-bottom: 2px solid transparent;
    }

    .sub2_1_content__disease .sub2_1_content__disease-nav-list li.is-active {
        border-left: none;
        border-bottom-color: var(--gold);
    }

    .sub2_1_content__disease .sub2_1_content__disease-panels {
        gap: 60px;
        overflow-y: auto;
    }

    .sub2_1_content__disease .sub2_1_content__disease-panel {
        min-height: auto;
    }

    .sub2_1_content__disease .sub2_1_content__panel-img {
        max-width: 100%;
    }

    /* Sub2_1 : Non-Surgical */
    .sub2_1_content__nonsurgical {
        padding: 60px 0;
    }

    .sub2_1_content__nonsurgical .center {
        flex-direction: column;
        gap: 30px;
    }

    .sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-text {
        margin-right: 0;
        min-width: 0;
        width: 100%;
    }

    .sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider-wrap {
        width: 100%;
    }

    .sub2_1_content__nonsurgical .sub2_1_content__nonsurgical-slider .slick-slide {
        width: auto;
        margin: 0 10px;
    }

    /* Sub2_1 : CTA */
    .sub2_1_content__cta {
        padding: 0 0 60px;
    }

    .sub2_1_content__cta .sub2_1_content__cta-box {
        min-height: 260px;
    }

    .sub2_1_content__cta .sub2_1_content__cta-text {
        padding: 30px 24px;
    }

    /* Sub2_2 : Symptoms - 카드/이미지 세로 스택, 겹침 해제 */
    .sub2_3_content__intro .center,
    .sub2_2_content__intro .center{
        flex-direction: column;
    }
    .sub2_2_content__symptoms {
        padding: 60px 0;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-head {
        margin-bottom: 50px;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-list {
        gap: 40px;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-item,
    .sub2_2_content__symptoms .sub2_2_content__symptoms-item.is-reverse {
        flex-direction: column;
        justify-content: flex-start;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-card,
    .sub2_2_content__symptoms .sub2_2_content__symptoms-img {
        flex: 0 0 auto;
        width: 100%;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-img,
    .sub2_2_content__symptoms .sub2_2_content__symptoms-item.is-reverse .sub2_2_content__symptoms-img {
        margin: 0 0 -30px;
        order: 0;
    }

    .sub2_2_content__symptoms .sub2_2_content__symptoms-card {
        padding: 30px 24px;
    }

    /* Sub2_3 : Golden Time */
    .sub2_3_content__goldentime {
        padding: 60px 0;
    }

    .sub2_3_content__goldentime .sub2_3_content__goldentime-img {
        padding: 30px 20px;
    }

    /* Sub2_3 : Steps */
    .sub2_3_content__steps {
        padding: 60px 0;
    }

    .sub2_3_content__steps .sub2_3_content__steps-list {
        flex-direction: column;
        gap: 16px;
    }

    /* Sub3_1 : Prevent */
    .sub3_1_content__prevent {
        padding: 60px 0;
    }

    .sub3_1_content__prevent .sub3_1_content__prevent-body {
        flex-direction: column;
        gap: 16px;
    }

    .sub3_1_content__prevent .sub3_1_content__prevent-img {
        height: 220px;
    }

    .sub3_1_content__prevent .sub3_1_content__prevent-item {
        flex-wrap: wrap;
        gap: 12px;
        padding: 20px 24px;
    }

    .sub3_1_content__prevent .sub3_1_content__prevent-bar {
        display: none;
    }

    /* Sub5_1 : Method */
    .sub5_1_content__method {
        padding: 60px 0;
    }

    .sub5_1_content__method .sub5_1_content__method-item,
    .sub5_1_content__method .sub5_1_content__method-item.is-reverse {
        flex-direction: column;
    }

    .sub5_1_content__method .sub5_1_content__method-card {
        flex: 0 0 auto;
        width: 100%;
        padding: 30px 24px;
    }

    /* Sub5_1 : Notice */
    .sub5_1_content__notice {
        padding: 60px 0;
    }

    .sub5_1_content__notice .sub5_1_content__notice-top {
        flex-direction: column;
        gap: 20px;
    }

    .sub5_1_content__notice .sub5_1_content__notice-links {
        flex-direction: column;
        width: 100%;
    }

    .sub5_1_content__notice .sub5_1_content__notice-btn {
        justify-content: center;
        width: 100%;
        box-sizing: border-box;
    }

    .sub5_1_content__notice .sub5_1_content__notice-acc-head {
        padding: 16px 20px;
        flex-wrap: wrap;
    }

    .sub5_1_content__notice .sub5_1_content__notice-acc-body {
        padding: 24px 20px;
    }
}