@charset "utf-8";

/* ========================================
   Responsive CSS (통합)
   - Part 1: KAPA 섹션별 반응형 (A~G_layout 연동)
   - Part 2: Resonance 템플릿 전역 반응형 (구 style-responsive.css)
   ※ 이 파일만 로드 — style-responsive.css 별도 로드 불필요
   ======================================== */

/* ========================================
   Part 1: KAPA 섹션별 반응형 (A~G)
   ======================================== */

/* ========================================
   A_layout.css - 협회안내 관련 반응형
   ======================================== */

/* 역대회장 5컬럼 레이아웃 반응형 */
@media screen and (max-width: 1200px) {
    .colum_list.col05 li {
        width: 25%;
    }
    .colum_list li:nth-child(4n):after {
        display: none;
    }
}

@media screen and (max-width: 992px) {
    .colum_list.col05 li {
        width: 33.333%;
    }
    .colum_list li:nth-child(3n):after {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .colum_list.col05 li {
        width: 50%;
        padding: 30px 20px 35px;
    }
    .colum_list li:nth-child(2n):after {
        display: none;
    }
    
    .colum_list li .colum_list_img img {
        width: 120px;
        height: 120px;
    }
    
    .colum_list li .tit {
        font-size: 20px;
    }
}

@media screen and (max-width: 480px) {
    .colum_list li:after {
        display: none;
    }
}

/* 회원사 현황 모바일 반응형 */
@media (max-width: 768px) {
    .local-org-header {
        display: none;
    }
    
    .local-org-item {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        padding: 15px;
        margin-bottom: 10px;
        border: 1px solid #eee;
        border-radius: 5px;
    }

    .local-org-item > div:nth-child(1),
    .local-org-item > div:nth-child(2),
    .local-org-item > div:nth-child(3),
    .local-org-item > div:nth-child(4),
    .local-org-item > div:nth-child(5) {
        width: 100% !important;
        max-width: 100%;
        flex: 0 0 auto;
        min-width: 0;
        box-sizing: border-box;
        padding: 5px 0;
        text-align: left;
        border-bottom: 1px solid #f5f5f5;
        word-break: keep-all;
        overflow-wrap: break-word;
    }
    
    .local-org-item > div:last-child {
        border-bottom: none;
    }
    
    .local-org-item > div:before {
        content: attr(data-label);
        display: inline-block;
        width: 80px;
        font-weight: bold;
        color: #666;
    }
    
    .local-org-item > div:nth-child(1):before { content: "지회명: "; }
    .local-org-item > div:nth-child(2):before { content: "지회장명: "; }
    .local-org-item > div:nth-child(3):before { content: "소속: "; }
    .local-org-item > div:nth-child(4):before { content: "주소: "; }
    .local-org-item > div:nth-child(5):before { content: "전화: "; }
}

@media (max-width: 480px) {
    .local-org-header > div,
    .local-org-item > div {
        padding: 0 6px;
        font-size: 13px;
    }
}

/* 회원사 현황 모바일 반응형 스타일 */
@media (max-width: 768px) {
    .member-header {
        display: none;
    }
    
    .member-item {
        flex-direction: column;
        padding: 15px;
        margin-bottom: 10px;
        border: 1px solid #eee;
        border-radius: 5px;
    }
    
    .member-item > div {
        width: 100%;
        padding: 5px 0;
        text-align: left;
        border-bottom: 1px solid #f5f5f5;
    }
    
    .member-item > div:last-child {
        border-bottom: none;
    }
    
    .member-item > div:before {
        content: attr(data-label);
        display: inline-block;
        width: 80px;
        font-weight: bold;
        color: #666;
    }
    
    .member-item > div:nth-child(1):before { content: "구분: "; }
    .member-item > div:nth-child(2):before { content: "합계: "; }
    .member-item > div:nth-child(3):before { content: "법인합계: "; }
    .member-item > div:nth-child(4):before { content: "본사(법인): "; }
    .member-item > div:nth-child(5):before { content: "지사(법인): "; }
    .member-item > div:nth-child(6):before { content: "사무소: "; }
}

@media (max-width: 480px) {
    .member-item > div {
        padding: 4px 0;
        font-size: 13px;
    }
    
    .member-item > div:before {
        width: 70px;
    }
}

/* 임원현황 프로필 반응형 */
@media (max-width: 1400px) {
    .profile_box {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1200px) {
    .profile_box {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 992px) {
    .profile_box {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .profile_box {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .profile_box .profile_photo {
        min-width: 120px;
        min-height: 150px;
    }
}

@media (max-width: 480px) {
    .profile_box {
        grid-template-columns: repeat(1, 1fr);
    }
}

/* 찾아오시는 길 반응형 */
@media (max-width:640px) {
    .dept-row {
        display:block; 
        margin-bottom:10px; 
        padding:8px; 
        border:1px solid #eee; 
        border-radius:4px;
    }
    .dept-header {
        display:none;
    }
    .dept-tel:before {
        content:"전화: "; 
        font-weight:bold;
    }
    .dept-fax:before {
        content:"팩스: "; 
        font-weight:bold;
    }
    .dept-name {
        font-weight:bold; 
        margin-bottom:5px;
    }
    /*모바일용 카카오맵 화면맞춤*/
    .alt-features-item.border-left{
        border: 0;
        padding-left: 0;
    }
    .root_daum_roughmap{
        padding-left: 0;
    }
}

/* ========================================
   B_layout.css - 회원등록업무 관련 반응형
   ======================================== */

/* 회원등록업무 반응형 스타일 */
@media screen and (max-width: 768px) {
    /* doc-table 모바일 스타일 */
    .doc-table {
        width: 100%;
        margin: 0;
    }
    
    /* doc-row를 모바일에서 세로로 쌓기 */
    .doc-row {
        flex-direction: column;
        border: 1px solid #dee2e6;
        border-radius: 4px;
        margin-bottom: 15px;
        padding: 0;
        background-color: #fff;
        overflow: hidden;
    }
    
    .doc-row.doc-header {
        display: none; /* 헤더는 모바일에서 숨김 */
    }
    
    /* doc-cell을 모바일에서 전체 너비로 - 제목 스타일 (cell-doc) */
    .doc-row:not(.doc-header) .cell-doc {
        width: 100% !important;
        padding: 12px 15px;
        border-right: none;
        border-bottom: 1px solid #dee2e6;
        border-top: none;
        border-left: none;
        text-align: left;
        background-color: #f8f9fa;
        font-weight: 600;
        color: #495057;
    }
    
    /* doc-cell 내용 부분 (cell-method) - 백색 배경 */
    .doc-row:not(.doc-header) .cell-method {
        width: 100% !important;
        padding: 12px 15px;
        border-right: none;
        border-bottom: none;
        border-top: none;
        border-left: none;
        text-align: left;
        background-color: #fff;
    }
    
    .doc-row:not(.doc-header) .doc-cell:last-child {
        border-bottom: none;
    }
    
    /* 각 셀에 라벨 추가 - cell-doc는 제목이므로 라벨 불필요 */
    .doc-row:not(.doc-header) .cell-doc::before {
        display: none;
    }
    
    .doc-row:not(.doc-header) .cell-method::before {
        content: '제출방법: ';
        font-weight: 600;
        color: #495057;
        display: block;
        margin-bottom: 8px;
    }
    
    /* doc-table-grid 모바일 스타일 */
    .doc-table-grid {
        width: 100%;
        margin: 0;
        display: block;
    }
    
    .doc-cell-grid {
        width: 100%;
        padding: 12px 15px;
        border-right: none;
        border-bottom: 1px solid #dee2e6;
        text-align: left;
        background-color: #fff;
    }
    
    .doc-cell-grid.doc-header {
        display: none; /* 헤더 숨김 */
    }
    
    /* doc-cell-grid에서 rowspan 요소는 제목 스타일 */
    .doc-cell-grid.rowspan-base,
    .doc-cell-grid.rowspan-cell,
    .doc-cell-grid.rowspan-cell-3 {
        background-color: #f8f9fa;
        font-weight: 600;
        color: #495057;
        border: 1px solid #dee2e6;
        border-radius: 4px;
        margin-bottom: 10px;
    }
    
    /* doc-table-3col 모바일 스타일 */
    .doc-table-3col {
        width: 100%;
        margin: 0;
        display: block;
    }
    
    .doc-cell-3col {
        width: 100%;
        padding: 12px 15px;
        border-right: none;
        border-bottom: 1px solid #dee2e6;
        text-align: left;
        background-color: #fff;
    }
    
    .doc-cell-3col.doc-header-3col {
        display: none; /* 헤더 숨김 */
    }
    
    /* rowspan 처리 - 제목 스타일 (회색 배경) */
    .rowspan-base,
    .rowspan-cell,
    .rowspan-cell-3,
    .rowspan-cell-3-right,
    .rowspan-cell-3col-2,
    .rowspan-cell-3col-3,
    .doc-cell-3col.rowspan-base,
    .doc-cell-3col.rowspan-cell-3col-2,
    .doc-cell-3col.rowspan-cell-3col-3 {
        grid-row: span 1 !important;
        grid-column: span 1 !important;
        display: block;
        width: 100%;
        margin-bottom: 10px;
        padding: 12px 15px;
        background-color: #f8f9fa;
        font-weight: 600;
        color: #495057;
        border: 1px solid #dee2e6;
        border-radius: 4px;
    }
    
    /* rowspan 다음의 셀들은 내용 스타일 (백색 배경) */
    .doc-cell-3col:not(.rowspan-base):not(.rowspan-cell-3col-2):not(.rowspan-cell-3col-3):not(.doc-header-3col) {
        background-color: #fff;
    }
    
    /* 인라인 스타일로 grid-column이 있는 경우도 모바일에서 무시 */
    .doc-cell-3col[style*="grid-column"] {
        grid-column: span 1 !important;
        width: 100%;
    }
    
    /* 인라인 스타일로 고정 너비가 있는 경우 모바일에서 반응형으로 */
    span[style*="width:273px"],
    span[style*="width: 273px"] {
        width: auto !important;
        max-width: 100%;
        display: inline-block;
        word-break: keep-all;
    }
    
    .doc-title, .doc-method {
        width: 100%;
        padding: 10px 0;
    }
    
    .doc-title {
        font-weight: 600;
    }
    
    /* 모바일에서 kapa_container와 kapa_process 양 옆 여백 줄이기 */
    .kapa_container {
        padding: 20px 5px;
    }
    
    .kapa_process {
        max-width: 100%;
    }
    
    /* 모바일에서 features-2-item 박스 크기 동일하게 맞추기 */
    .row .col-md-6.col-lg-4,
    .row .col-md-8.col-lg-7,
    .row .col-md-6.col-lg-5 {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 20px;
    }
    
    .row .col-md-6.col-lg-4 .features-2-item,
    .row .col-md-8.col-lg-7 .features-2-item,
    .row .col-md-6.col-lg-5 .features-2-item {
        width: 100%;
        height: auto;
        min-height: 200px;
        max-height: none;
        padding: 30px 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        box-sizing: border-box;
    }
    
    /* features-2-item-left 모바일 스타일 */
    .features-2-item-left {
        width: 100%;
    }
    
    .features-2-title-large {
        font-size: 18px;
        margin-bottom: 12px;
    }
    
    .features-2-descr-large {
        font-size: 15px;
        line-height: 1.7;
    }
    
    /* 같은 행의 모든 features-2-item을 동일한 높이로 */
    .row .d-flex.align-items-stretch {
        height: auto;
    }
    
    .row .d-flex.align-items-stretch .features-2-item {
        height: auto;
        min-height: 200px;
        max-height: none;
    }
}



/* 자격증신청 flow chart 반응형 */
@media (max-width: 600px) {
    .process {
        flex-direction: column;
        gap: 10px;
    }
    .step {
        margin: 0 32px; /* 모바일에서 센터 정렬을 위해 제거 */
    }
    .step::after {
        content: '\25BC'; /* ▼ 아래 방향 화살표 */
        right: 50%;
        top: 100%;
        transform: translateX(50%);
        font-size: small !important;
        line-height: 2;
    }
}


/* ========================================
   C_layout.css - 국제교류 관련 반응형
   ======================================== */

/* C_layout.css에는 미디어쿼리가 없음 */

/* ========================================
   D_layout.css - 알림마당 관련 반응형
   ======================================== */

/* 알림마당 최신부동산 뉴스 글정보 테이블 반응형 */
@media screen and (max-width: 768px) {
    .view-header > div { 
        flex-direction: column; 
    }
    .label { 
        width: 100%; 
        border-bottom: 1px solid #ddd; 
    }
    .view-title .content { 
        flex-direction: column; 
        align-items: flex-start; 
        gap: 10px; 
    }
    .btn-print { 
        float: none; 
        width: 100%; 
        justify-content: center; 
    }
    .view-footer { 
        margin-top: 50px; 
        text-align: center; 
    }
    .view-footer::before { 
        top: -25px; 
    }
    .btn-list { 
        width: 100%; 
        justify-content: center; 
    }

    /* 공지·알림마당 상세 본문 (.view-full) — 모바일 (D_layout.css와 동일) */
    .view-full {
        padding: 15px 12px;
        font-size: 15px;
        line-height: 1.75;
        overflow-wrap: break-word;
        word-break: keep-all;
        clear: both;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .view-full img,
    .view-full iframe,
    .view-full video,
    .view-full embed,
    .view-full object {
        max-width: 100% !important;
        height: auto !important;
    }

    .view-full table {
        width: 100% !important;
        max-width: 100%;
        table-layout: fixed;
    }

    .view-full table td,
    .view-full table th {
        font-size: 13px;
        padding: 4px 6px;
        word-break: break-word;
    }

    /* 감정평가사 모집 상세(sub_D_04-1) 버튼: 모바일에서도 2개 가로 유지 */
    .career-detail-view .career-view-buttons {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }
    .career-detail-view .career-view-buttons > a,
    .career-detail-view .career-view-buttons > button {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        white-space: nowrap !important;
    }
}

/* 알림마당 최신부동산 뉴스 테이블 반응형 (local-ln-header, local-ln-item) */
@media screen and (max-width: 768px) {
    /* 검색 영역 모바일 스타일 - Bootstrap col-md-6 오버라이드 */
    .row.mb-20.mb-xs-10.align-items-center {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    
    /* 검색 영역 내 Bootstrap col-md-6만 모바일에서 전체 너비로 */
    .row.mb-20.mb-xs-10.align-items-center > .col-md-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 15px !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center > .col-md-6:last-child {
        margin-bottom: 0 !important;
    }
    
    /* 검색 영역 내부 요소들 */
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2 {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 10px !important;
    }
    
    .search-input,
    .form-control.search-input {
        width: 100% !important;
        flex: 1 1 100% !important;
        min-width: 0 !important;
        margin-bottom: 0 !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center .justify-content-md-end {
        flex-direction: column !important;
        justify-content: flex-start !important;
        width: 100% !important;
        gap: 10px !important;
    }
    
    /* 버튼 모바일 스타일 */
    .btn-guide-download,
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2 .btn {
        width: 100% !important;
        justify-content: center !important;
        flex: 1 1 100% !important;
        min-width: 0 !important;
    }
    
    /* 검색 영역의 검색 버튼도 100% 너비 */
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2.justify-content-md-end .btn,
    .row.mb-20.mb-xs-10.align-items-center .col-md-6 .d-flex.gap-2 .btn {
        width: 100% !important;
    }
    
    /* 검색 input도 100% 너비 확보 */
    .row.mb-20.mb-xs-10.align-items-center .col-md-6 .d-flex.gap-2 .form-control.search-input,
    .row.mb-20.mb-xs-10.align-items-center .col-md-6 .d-flex.gap-2 input[type="text"],
    .row.mb-20.mb-xs-10.align-items-center .col-md-6 .d-flex.gap-2 #searchText,
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2.justify-content-md-end .form-control.search-input,
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2.justify-content-md-end input[type="text"],
    .row.mb-20.mb-xs-10.align-items-center .d-flex.gap-2.justify-content-md-end #searchText {
        width: 100% !important;
        flex: 1 1 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    
    /* 헤더 숨기기 */
    .local-ln-header {
        display: none !important;
    }
    
    /* D_layout.css와 base.css의 고정 너비 및 flex 레이아웃 오버라이드 */
    /* HTML 순서: 1=번호, 2=제목, 3=출처, 4=날짜, 5=조회 → 모바일: 제목 위, 번호|출처|날짜|조회 한 줄 아래 */
    .local-ln-item {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
    }
    
    /* 모든 div의 고정 너비 제거 */
    .local-ln-item > div:nth-child(1),
    .local-ln-item > div:nth-child(2),
    .local-ln-item > div:nth-child(3),
    .local-ln-item > div:nth-child(4),
    .local-ln-item > div:nth-child(5),
    .local-ln-item > div:nth-child(6) {
        max-width: 100% !important;
        min-width: 0 !important;
    }
    
    /* 아이템을 카드 형태로 변경 */
    .local-ln-item {
        gap: 8px !important;
        padding: 15px !important;
        border-bottom: 1px solid #eee !important;
        background-color: #fff !important;
        margin-bottom: 10px !important;
        border-radius: 5px !important;
        border: 1px solid #eee !important;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
    }
    
    .local-ln-item > div {
        text-align: left !important;
        padding: 5px 0 !important;
        overflow: visible !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }
    
    /* 제목(2번째 div)을 첫 번째 줄에 표시 - order로 맨 앞에 */
    .local-ln-item > div:nth-child(2) {
        order: 1 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        font-size: 14px;
        white-space: normal;
        word-break: break-word;
    }
    
    .local-ln-item > div:nth-child(2) a,
    .local-ln-item > div:nth-child(2) {
        font-size: 14px;
        font-weight: bold;
        word-break: break-word;
    }
    
    /* 번호(1), 출처(3), 날짜(4), 조회(5)를 두 번째 줄에 한 줄로 배치 */
    .local-ln-item > div:nth-child(1),
    .local-ln-item > div:nth-child(3),
    .local-ln-item > div:nth-child(4),
    .local-ln-item > div:nth-child(5) {
        order: 2 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        display: inline-block !important;
        font-size: 12px;
        white-space: nowrap;
        padding: 0 2px !important;
    }
    
    /* 번호·출처·날짜 뒤에 구분자 " | " */
    .local-ln-item > div:nth-child(1)::after,
    .local-ln-item > div:nth-child(3)::after,
    .local-ln-item > div:nth-child(4)::after {
        content: ' \007C ';
        margin-left: 4px;
        font-weight: normal;
    }
    
    /* 빈 목록 메시지(6번째)는 맨 아래 */
    .local-ln-item > div:nth-child(6) {
        order: 3 !important;
        width: 100% !important;
    }

    /* sub_G_01 홍보센터 뉴스 — local-news-ln-* (4컬럼: 번호·제목·출처·날짜) */
    .local-news-wrap .local-news-ln-header {
        display: none !important;
    }

    .local-news-wrap .local-news-ln-item {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 15px !important;
        border-bottom: 1px solid #eee !important;
        background-color: #fff !important;
        margin-bottom: 10px !important;
        border-radius: 5px !important;
        border: 1px solid #eee !important;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
    }

    .local-news-wrap .local-news-ln-item > div:nth-child(1),
    .local-news-wrap .local-news-ln-item > div:nth-child(2),
    .local-news-wrap .local-news-ln-item > div:nth-child(3),
    .local-news-wrap .local-news-ln-item > div:nth-child(4) {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .local-news-wrap .local-news-ln-item > div {
        text-align: left !important;
        padding: 5px 0 !important;
        overflow: visible !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .local-news-wrap .local-news-ln-item > div:nth-child(2) {
        order: 1 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        font-size: 14px;
        white-space: normal;
        word-break: break-word;
    }

    .local-news-wrap .local-news-ln-item > div:nth-child(2) a,
    .local-news-wrap .local-news-ln-item > div:nth-child(2) {
        font-size: 14px;
        font-weight: bold;
        word-break: break-word;
    }

    .local-news-wrap .local-news-ln-item > div:nth-child(1),
    .local-news-wrap .local-news-ln-item > div:nth-child(3),
    .local-news-wrap .local-news-ln-item > div:nth-child(4) {
        order: 2 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        display: inline-block !important;
        font-size: 12px;
        white-space: nowrap;
        padding: 0 2px !important;
    }

    .local-news-wrap .local-news-ln-item > div:nth-child(1)::after,
    .local-news-wrap .local-news-ln-item > div:nth-child(3)::after {
        content: ' \007C ';
        margin-left: 4px;
        font-weight: normal;
    }
    
    /* 페이지네이션 모바일 */
    .pagination-wrap {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }
    
    .pagination {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .pagination a {
        min-width: 32px;
        height: 32px;
        font-size: 12px;
    }
}

@media screen and (max-width: 480px) {
    .local-ln-item {
        padding: 12px;
    }

    .local-news-wrap .local-news-ln-item {
        padding: 12px;
    }
    
    .pagination a {
        min-width: 28px;
        height: 28px;
        padding: 4px;
    }
}

/* 징계 정보 공개 및 열람 테이블 모바일 스타일 (discipline-board) */
@media screen and (max-width: 768px) {
    /* discipline-board 헤더 숨기기 */
    .discipline-board .local-ln-header {
        display: none !important;
    }
    
    /* discipline-board 아이템을 카드 형태로 변경 */
    .discipline-board .local-ln-item {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        padding: 15px !important;
        border: 1px solid #eee !important;
        border-radius: 8px !important;
        background-color: #fff !important;
        margin-bottom: 15px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    }
    
    /* 모든 div의 고정 너비 제거 및 라벨 추가 */
    .discipline-board .local-ln-item > div {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        text-align: left !important;
        padding: 8px 0 !important;
        border-bottom: 1px solid #f0f0f0 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        word-break: keep-all !important;
        line-height: 1.6 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
    
    .discipline-board .local-ln-item > div:last-child {
        border-bottom: none !important;
    }
    
    /* 각 항목에 라벨 추가 */
    .discipline-board .local-ln-item > div:nth-child(1)::before {
        content: '연번: ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
    }
    
    .discipline-board .local-ln-item > div:nth-child(2)::before {
        content: '성명(생년월일): ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
    }
    
    .discipline-board .local-ln-item > div:nth-child(3)::before {
        content: '소속: ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
    }
    
    .discipline-board .local-ln-item > div:nth-child(4)::before {
        content: '징계종류: ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
    }
    
    .discipline-board .local-ln-item > div:nth-child(5)::before {
        content: '징계사유: ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
        display: block;
        margin-bottom: 5px;
    }
    
    .discipline-board .local-ln-item > div:nth-child(6)::before {
        content: '징계의효력발생일: ';
        font-weight: 600;
        color: #495057;
        margin-right: 8px;
    }
    
    /* 징계사유는 블록으로 표시 및 텍스트 줄바꿈 처리 */
    .discipline-board .local-ln-item > div:nth-child(5) {
        display: block !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        word-break: keep-all !important;
        overflow: visible !important;
        text-overflow: clip !important;
        max-width: 100% !important;
        line-height: 1.6 !important;
    }
    
    /* 페이지 정보 및 버튼 영역 모바일 스타일 */
    .discipline-board ~ .pagination-wrap,
    .discipline-board + * .pagination-wrap {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }
    
    /* 페이지 정보 영역 모바일 스타일 */
    .row.mb-20.mb-xs-10.align-items-center .col-md-6:first-child {
        margin-bottom: 15px !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center .col-md-6:first-child .d-flex {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center .col-md-6:first-child .small {
        width: 100% !important;
        margin-bottom: 10px !important;
        text-align: center !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center .col-md-6:first-child .mx-2 {
        display: none !important;
    }
    
    .row.mb-20.mb-xs-10.align-items-center .col-md-6:first-child .btn {
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        font-size: 13px !important;
        padding: 8px 12px !important;
    }

    /* 징계 목록(sub_D_06): 모바일에서 신청 버튼 영역 ↔ 검색 영역 구분 */
    .punishment-list-toolbar > .col-md-6:first-child {
        margin-bottom: 0 !important;
        padding-bottom: 16px !important;
    }

    .punishment-list-toolbar > .col-md-6:last-child {
        margin-top: 0 !important;
        padding-top: 16px !important;
        border-top: none !important;
        position: relative;
    }

    .punishment-list-toolbar > .col-md-6:last-child::before {
        content: '';
        position: absolute;
        top: 0;
        left: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
        right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
        border-top: 1px dotted #ddd;
    }
}

@media screen and (max-width: 480px) {
    .discipline-board .local-ln-item {
        padding: 12px !important;
        gap: 8px !important;
    }
    
    .discipline-board .local-ln-item > div {
        padding: 6px 0 !important;
        font-size: 14px !important;
    }
    
    .discipline-board .local-ln-item > div::before {
        font-size: 13px !important;
    }
}

/* ========================================
   D_layout.css - 징계 정보 열람신청(sub_D_06-1) 반응형
   (.punishment-apply-view 전용 — career-detail-view 공통 규칙과 분리)
   ======================================== */
@media screen and (max-width: 768px) {
    /* 폼 행: 라벨·입력 세로 배치 */
    .punishment-apply-view .career-inquiry-table .career-inquiry-row {
        flex-direction: column;
        align-items: stretch;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row .label {
        width: 100%;
        min-width: 0;
        border-right: none;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row .content {
        padding: 12px 0;
    }

    /* 입금자명/입금일자·환불 계좌 2열 필드 */
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.career-contact-row {
        flex-direction: column;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.career-contact-row > div.contact-col {
        flex-direction: column;
        align-items: stretch;
        border-right: none;
        border-bottom: 1px solid #eee;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.career-contact-row > div.contact-col:last-child {
        border-bottom: none;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.career-contact-row .contact-col .label {
        width: 100%;
        min-width: 0;
        border-right: none;
        border-bottom: 1px solid #eee;
    }
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.career-contact-row .contact-col .content {
        padding: 12px 0;
    }

    /* 조회기간 3컬럼 → 세로 스택 */
    .punishment-apply-view .punish-period-row {
        grid-template-columns: 1fr;
    }
    .punishment-apply-view .punish-period-col {
        border-right: none;
        border-bottom: 1px solid #eee;
        padding: 0 0 1rem 0;
    }
    .punishment-apply-view .punish-period-col:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    /* 첨부서류 + 전자서명 세로 배치 */
    .punishment-apply-view .career-inquiry-table .career-inquiry-row.punish-attach-sign-row > .content.punish-attach-sign-content {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box;
    }
    .punishment-apply-view .punish-attach-sign-body {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch !important;
        width: 100%;
    }
    .punishment-apply-view .punish-attach-sign-content .punish-attach-files {
        width: 100%;
    }
    /* PC용 flex:0 0 240px / min-width:200px / align-items:center 가 모바일에서 왼쪽으로 줄어드는 원인 */
    .punishment-apply-view .punish-attach-sign-content .punish-sign-column {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        align-self: stretch !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        border-left: none;
        padding-top: 1rem;
        border-top: 1px solid #eee;
        display: flex;
        flex-direction: column;
        align-items: stretch !important;
        box-sizing: border-box;
    }
    .punishment-apply-view .punish-sign-column .signature-pad,
    .punishment-apply-view .punish-sign-column #signature-pad {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        align-self: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box;
    }
    .punishment-apply-view .punish-sign-column .signature-pad--body {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box;
    }
    .punishment-apply-view .punish-sign-column .signature-pad--body canvas {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box;
    }
    .punishment-apply-view .punish-sign-column .punish-sign-clear-btn {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 첨부서류 제목·양식 다운로드 줄바꿈 */
    .punishment-apply-view .punish-attach-files .d-flex.flex-nowrap {
        flex-wrap: wrap !important;
        gap: 0.5rem;
    }
    .punishment-apply-view .punish-attach-files .text-nowrap {
        white-space: normal !important;
    }

    /* 평가사 찾기 버튼 */
    .punishment-apply-view .career-inquiry-row .content .d-flex.flex-nowrap {
        flex-wrap: wrap !important;
    }
    .punishment-apply-view #btnGetMember,
    .punishment-apply-view #btnCancelMember {
        min-width: 0;
        flex: 1 1 calc(50% - 0.25rem);
    }

    /* 환불 정보 3컬럼 → 세로 스택 */
    .punishment-apply-view .view-header.career-contact-display.refund-info-header-row,
    .punishment-apply-view .view-header.career-contact-display.refund-info-data-row {
        grid-template-columns: 1fr !important;
    }
    .punishment-apply-view .view-header.career-contact-display > .career-contact-display-item {
        grid-column: span 1 !important;
    }

    /* 섹션 제목 + 목록으로 버튼 */
    .punishment-apply-view .career-section-title.d-flex {
        flex-direction: column;
        align-items: flex-start !important;
    }
    .punishment-apply-view .career-section-title.d-flex > .btn {
        align-self: flex-end;
        margin-top: 0.5rem;
    }
}

/* ========================================
   E_layout.css - 감정평가안내 관련 반응형
   ======================================== */

/* 회원검색 탭 반응형 */
@media (max-width: 480px) {
    .specialty-card {
        flex: 1 1 100%;
        font-size: 0.95rem;
    }
    .specialty-header {
        font-size: 1rem;
        padding: 10px 14px;
        margin-bottom: 12px;
    }
}

/* 회원 및 법인검색 반응형 */
@media (max-width: 768px) {
    .srch_search_row {
        flex-direction: column;
        gap: 15px;
    }
    
    .srch_filters {
        grid-template-columns: 1fr;
    }
}

/* 감정평가사 분포현황 반응형 */
@media (max-width: 768px) { 
    .chart-section { 
        flex-direction: column; 
    }
    .chart-wrapper { 
        height: 250px; 
    }
}

/* 서비스 카드 반응형 */
@media (max-width: 768px) {
    .service-cards-container {
        grid-template-columns: 1fr;
        gap: 16px;
        margin: 24px 0;
    }
    
    .service-cards-container[role="list"] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .wide-card {
        grid-column: 1;
    }
    
    .service-card-header {
        padding: 20px;
    }
    
    .service-card-body {
        padding: 20px;
    }
    
    .service-card-title {
        font-size: 1.3rem;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .service-cards-container {
        grid-template-columns: 1fr 1.3fr;
        gap: 20px;
    }
    
    .service-cards-container[role="list"] {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 480px) {
    .service-cards-container {
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 20px 0;
    }
    
    .service-cards-container[role="list"] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .service-card-header {
        padding: 16px;
    }
    
    .service-card-body {
        padding: 16px;
    }
    
    .service-card-title {
        font-size: 1.2rem;
    }
}

/* 세번째 탭 단일 카드 모바일 반응형 */
@media (max-width: 768px) {
    .single-card .service-card-text {
        column-count: 1;
        column-gap: 0;
        column-rule: none;
    }
}

/* 네번째 탭 문서 카드 반응형 */
@media (max-width: 768px) {
    .documents-4col .wide-card .service-card-list {
        column-count: 1;
        column-gap: 0;
        column-rule: none;
    }
}

/* 반응형 조정 */
@media (max-width: 1200px) {
    .documents-4col {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .documents-4col {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px;
    }
    .documents-4col .wide-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 480px) {
    .documents-4col {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }
}

/* 감정평가수수료 속산표 반응형 */
@media (max-width: 768px) {
    .fees-single-card-container {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .fees-single-card-container .service-card:last-child {
        grid-column: 1;
    }
    
    .fees-single-card-container .service-card-header {
        padding: 16px 20px;
    }
    
    .fees-single-card-container .service-card-body {
        padding: 20px 16px;
    }
    
    .fees-single-card-container .service-card-title {
        font-size: 1.2rem;
    }
    
    /* 모바일에서 테이블 스타일 조정 */
    .fees-single-card-container .fee-table {
        font-size: 12px;
        margin: 10px 0;
    }
    
    .fees-single-card-container .fee-table-header,
    .fees-single-card-container .fee-table-cell {
        padding: 5px;
    }
}

/* 기본 테이블 모바일 반응형 */
@media (max-width: 768px) {
    .fee-table {
        font-size: 12px;
        margin: 15px 0;
    }
    
    .fee-table-header,
    .fee-table-cell {
        padding: 8px 6px;
    }
}

@media (max-width: 576px) {
    .fee-table {
        font-size: 11px;
        margin: 10px 0;
    }
    
    .fee-table-header,
    .fee-table-cell {
        padding: 6px 4px;
    }
}

/* 다운로드 버튼 모바일 반응형 */
@media (max-width: 768px) {
    .download-btn {
        min-width: 160px;
        max-width: 240px;
        padding: 10px 20px;
        font-size: 13px;
    }
    
    .fee-table-btn {
        min-width: 150px;
        max-width: 200px;
        padding: 8px 16px;
        font-size: 12px;
    }
}

@media (max-width: 576px) {
    .download-btn {
        min-width: 140px;
        max-width: 200px;
        padding: 8px 16px;
        font-size: 12px;
    }
    
    .fee-table-btn {
        min-width: 130px;
        max-width: 180px;
        padding: 6px 12px;
        font-size: 11px;
    }
}

/* 감정평가보수 카드 반응형 */
@media (max-width: 768px) {
    .fee-card-container {
        gap: 20px;
        margin: 24px 0;
        padding: 0 16px;
    }
    
    .fee-card-header {
        padding: 18px 20px;
    }
    
    .fee-card-title {
        font-size: 1.3rem;
    }
    
    .fee-card-body {
        padding: 20px;
    }
    
    .fee-special-list li {
        padding-left: 25px;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .fee-card-container {
        gap: 16px;
        margin: 20px 0;
        padding: 0 12px;
    }
    
    .fee-card-header {
        padding: 16px 18px;
    }
    
    .fee-card-title {
        font-size: 1.2rem;
    }
    
    .fee-card-body {
        padding: 18px;
    }
    
    .fee-special-list {
        padding-left: 15px;
    }
    
    .fee-special-list li {
        padding-left: 22px;
        font-size: 0.8rem;
    }
}

/* ========================================
   F_layout.css - 감정평가상담센터 관련 반응형
   ======================================== */

/* FAQ 검색 후 상세 페이지 반응형 */
@media (max-width: 768px) {
    /* FAQ 컨테이너 모바일 스타일 */
    .faq-container {
        margin: 10px auto;
        padding: 0.5rem 1rem;
        border-radius: 1rem;
    }
    
    /* 검색 영역 모바일 스타일 */
    .srch-area {
        padding: 15px 0;
    }
    
    /* 검색 컨테이너 모바일 스타일 */
    .search-container {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
        padding: 0 10px;
    }
    
    .search-container label {
        font-size: 13px;
        text-align: left;
    }
    
    /* 검색 입력 그룹 모바일 스타일 */
    .search-input-group {
        flex-direction: column;
        gap: 10px;
    }
    
    .search-input-group input[type="text"] {
        width: 100%;
        max-width: 100%;
        height: 38px;
        font-size: 14px;
    }
    
    .search-input-group button {
        width: 100%;
        height: 38px;
        font-size: 14px;
        min-width: auto;
    }
    
    /* 탭 메뉴 모바일 스타일 */
    .tab-menu {
        padding: 0 10px;
    }
    
    .tab-menu ul {
        flex-wrap: wrap;
        gap: 4px;
    }
    
    .tab-menu ul li {
        flex: 1 1 calc(50% - 2px);
        min-width: calc(50% - 2px);
    }
    
    .tab-menu .tab-btn {
        padding: 10px 8px;
        font-size: 14px;
        min-height: 44px;
    }
    
    /* 탭 콘텐츠 모바일 스타일 */
    .tab-contents .tab-content {
        margin: 10px 0;
        padding: 0 10px;
    }
    
    /* FAQ 아코디언 모바일 스타일 */
    .faq-accordion {
        padding: 0 5px;
    }
    
    /* FAQ 아이템 모바일 스타일 */
    .faq-item {
        margin-bottom: 12px;
        border-radius: 6px;
    }
    
    .faq-item.active .faq-content {
        padding: 16px;
    }
    
    /* FAQ 헤더 모바일 스타일 */
    .faq-header {
        padding: 12px 16px;
    }
    
    /* FAQ 질문 모바일 스타일 */
    .faq-question {
        gap: 12px;
        font-size: 15px;
    }
    
    /* FAQ 아이콘 모바일 스타일 */
    .faq-icon {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }
    
    /* FAQ 화살표 모바일 스타일 */
    .faq-arrow {
        width: 18px;
        height: 18px;
    }
    
    /* FAQ 콘텐츠 모바일 스타일 */
    .faq-item.active .faq-content {
        padding: 16px;
    }
    
    /* FAQ 답변 래퍼 모바일 스타일 */
    .faq-answer-wrapper {
        gap: 12px;
        flex-direction: column;
    }
    
    .faq-answer-wrapper .faq-icon {
        align-self: flex-start;
    }
    
    /* FAQ 답변 텍스트 모바일 스타일 */
    .faq-answer {
        font-size: 14px;
        line-height: 1.5;
    }
}

@media (max-width: 480px) {
    /* FAQ 컨테이너 작은 모바일 스타일 */
    .faq-container {
        margin: 8px auto;
        padding: 0.5rem 0.75rem;
        border-radius: 0.8rem;
    }
    
    /* 검색 영역 작은 모바일 스타일 */
    .srch-area {
        padding: 12px 0;
    }
    
    /* 검색 컨테이너 작은 모바일 스타일 */
    .search-container {
        padding: 0 8px;
        gap: 10px;
    }
    
    .search-container label {
        font-size: 12px;
    }
    
    /* 검색 입력 그룹 작은 모바일 스타일 */
    .search-input-group input[type="text"] {
        height: 36px;
        font-size: 13px;
        padding: 6px 10px;
    }
    
    .search-input-group button {
        height: 36px;
        font-size: 13px;
        padding: 6px 12px;
    }
    
    /* 탭 메뉴 작은 모바일 스타일 */
    .tab-menu {
        padding: 0 8px;
    }
    
    .tab-menu ul li {
        flex: 1 1 100%;
        min-width: 100%;
    }
    
    .tab-menu .tab-btn {
        padding: 12px 6px;
        font-size: 13px;
        min-height: 48px;
    }
    
    /* 탭 콘텐츠 작은 모바일 스타일 */
    .tab-contents .tab-content {
        margin: 8px 0;
        padding: 0 8px;
    }
    
    /* FAQ 아코디언 작은 모바일 스타일 */
    .faq-accordion {
        padding: 0;
    }
    
    /* FAQ 아이템 작은 모바일 스타일 */
    .faq-item {
        margin-bottom: 10px;
        border-radius: 4px;
    }
    
    /* FAQ 헤더 작은 모바일 스타일 */
    .faq-header {
        padding: 10px 12px;
    }
    
    /* FAQ 질문 작은 모바일 스타일 */
    .faq-question {
        gap: 10px;
        font-size: 14px;
    }
    
    /* FAQ 아이콘 작은 모바일 스타일 */
    .faq-icon {
        width: 26px;
        height: 26px;
        font-size: 12px;
    }
    
    /* FAQ 화살표 작은 모바일 스타일 */
    .faq-arrow {
        width: 16px;
        height: 16px;
    }
    
    /* FAQ 콘텐츠 작은 모바일 스타일 */
    .faq-item.active .faq-content {
        padding: 12px;
    }
    
    /* FAQ 답변 텍스트 작은 모바일 스타일 */
    .faq-answer {
        font-size: 13px;
        line-height: 1.5;
    }
}

/* FAQ 모던 스타일 반응형 */
@media (max-width: 992px) {
    .faq-quickcats {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .faq-quickcats {
        grid-template-columns: 1fr;
    }
    .faq-chip-sm {
        height: 52px;
        font-size: 0.95rem;
        border-radius: 10px;
    }
}

/* FAQ 인라인 반응형 */
@media (max-width: 768px) {
    .faq-inline-title {
        flex: 0 0 6.75rem;
        width: 6.75rem;
        min-width: 6.75rem;
        max-width: 6.75rem;
    }
    
    .faq-modern-search-container {
        padding: 24px;
    }
    
    .faq-modern-search-form {
        flex-direction: column;
        gap: 12px;
    }
    
    .faq-modern-select,
    .faq-modern-search-input,
    .faq-modern-btn {
        width: 100%;
    }
    
    .faq-modern-category-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media (max-width: 480px) {
    .faq-modern-search-container {
        padding: 16px;
    }
    
    .faq-modern-search-title {
        font-size: 1.3rem;
    }
}

/* 모바일 글씨 자동 축소 설정 */
@media (max-width: 768px) {
    /* 기본 텍스트 크기 자동 조정 */
    body {
        font-size: clamp(14px, 3.5vw, 16px);
    }
    
    /* 제목 크기 자동 조정 */
    h1, .hs-title-1 {
        font-size: clamp(20px, 6vw, 32px) !important;
    }
    
    h2 {
        font-size: clamp(18px, 5vw, 28px) !important;
    }
    
    /* 서브 히어로 캡션(둥근 pill) — h2 일반 규칙과 분리, 상세는 kapa-site-layout.css */
    h2.section-caption-border {
        font-size: clamp(12px, 3.2vw, 15px) !important;
    }
    
    h3, .service-card-title {
        font-size: clamp(16px, 4.5vw, 24px) !important;
    }
    
    h4 {
        font-size: clamp(15px, 4vw, 20px) !important;
    }
    
    /* 카드 내 텍스트 자동 조정 */
    .service-card-text p {
        font-size: clamp(13px, 3.2vw, 15px) !important;
    }
    
    .service-card-list li {
        font-size: clamp(12px, 3vw, 14px) !important;
    }
    
    /* 네비게이션 탭 글씨 자동 조정 */
    .nav-tabs .nav-link {
        font-size: clamp(13px, 3.5vw, 16px) !important;
    }
}

/* ========================================
   G_layout.css - 홍보센터 관련 반응형
   ======================================== */

/* 홍보센터 반응형 스타일 (sub_G_02 / sub_G_05 — G_layout.css와 동일) */
@media (max-width: 768px) {
    .radio-page-container {
        padding: 15px;
    }

    .radio-page-container .grid-container {
        margin: -12.5px 0;
    }

    .grid-container.two-per-row .album-card,
    .grid-container .single-item {
        flex: 1 1 100%;
        max-width: 100%;
        margin: 12.5px 0;
    }
}

/*
 * sub_G_04 홍보영상 — 모바일 전용 (이 페이지에서만 사용, 규칙은 미디어쿼리 안에만 정의)
 * 클래스: g04-m-main, g04-m-main-title, g04-m-gallery, g04-m-gallery-title, g04-m-grid, g04-m-inline-active
 */
@media (max-width: 991px) {
    .g04-m-main {
        margin-bottom: 36px;
    }

    .g04-m-main-title {
        font-size: clamp(1.125rem, 4vw, 1.5rem);
        margin-bottom: 1.25rem !important;
    }

    .g04-m-gallery {
        margin-top: 28px;
    }

    .g04-m-gallery-title {
        font-size: 1rem;
        margin-bottom: 18px;
    }

    /* 열 수는 G_layout.css .thumbnail-grid 미디어쿼리에서 통일 */
}

@media (max-width: 767px) {
    /* 상단 메인 플레이어는 PC 전용 — 모바일은 썸네일에서 바로 재생 */
    .g04-m-main .main-video-container {
        display: none !important;
    }

    .g04-m-main {
        margin-bottom: 20px;
    }

    .g04-m-main-title {
        font-size: clamp(1rem, 4.5vw, 1.35rem);
        margin-bottom: 0.75rem !important;
    }

    /* 상단 메인 없음 → ‘다른 영상 보기’는 중복·어색함(PC만 유지) */
    .g04-m-gallery-title {
        display: none !important;
    }

    .g04-m-gallery {
        margin-top: 8px;
    }

    /* 터치 환경: 호버 없이 재생 아이콘·오버레이가 보이도록 */
    .g04-m-grid .thumbnail-overlay {
        opacity: 1;
        background: rgba(0, 0, 0, 0.28);
    }

    .g04-m-grid .thumbnail-item:hover {
        transform: none;
    }

    .g04-m-grid .thumbnail-title {
        font-size: 11px;
        padding: 12px 6px 6px;
    }

    .g04-m-grid .play-button {
        width: 36px;
        height: 36px;
        font-size: 14px;
    }

    /* 인라인 재생 중: 오버레이 제거(네이티브 컨트롤 사용) */
    .g04-m-grid .thumbnail-item.g04-m-inline-active .thumbnail-overlay {
        opacity: 0 !important;
        visibility: hidden;
        pointer-events: none;
    }

    /* 인라인 재생: 가로 풀(컨테이너 패딩까지). contain = 좌우 잘림 없음(레터박스는 검정) */
    .g04-m-grid .thumbnail-item.g04-m-inline-active {
        grid-column: 1 / -1;
        width: calc(100% + 60px);
        max-width: none;
        margin-left: -30px;
        margin-right: -30px;
        box-sizing: border-box;
    }

    .g04-m-grid .thumbnail-item.g04-m-inline-active .thumbnail-container {
        aspect-ratio: 16 / 9;
        width: 100%;
        overflow: hidden;
        background: #111;
        border-radius: 0;
    }

    .g04-m-grid .thumbnail-item.g04-m-inline-active .thumbnail-video {
        z-index: 2;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center center;
    }

    .g04-m-grid .thumbnail-item.g04-m-inline-active .thumbnail-title {
        z-index: 4;
        pointer-events: none;
    }
}

@media (max-width: 479px) {
    .g04-m-grid .thumbnail-title {
        font-size: 12px;
    }
}

/* sub_G_07 - 협회로고안내 페이지 반응형 */
@media (max-width: 992px) {
    .symbol-intro-section {
        padding-top: 60px;
        padding-bottom: 60px;
        background: #fafafa;
    }

    .logotype-section {
        padding-top: 60px;
        padding-bottom: 60px;
        background: #fafafa;
    }

    .symbol-showcase {
        padding: 40px 30px !important;
        margin-top: 50px !important;
        margin-bottom: 50px !important;
    }

    .symbol-main-img {
        max-height: 150px;
    }

    .signature-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 24px;
    }

    .logotype-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .symbol-showcase {
        padding: 30px 20px !important;
        margin-top: 40px !important;
        margin-bottom: 40px !important;
    }

    .symbol-main-img {
        max-height: 120px;
    }

    .symbol-text {
        font-size: 1rem;
    }

    .signature-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .signature-item {
        padding: 24px;
    }

    .logotype-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .logotype-item {
        padding: 24px;
    }

    .ci-notice-section {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .ci-notice-box {
        padding: 16px 20px;
    }

    .ci-notice-text {
        font-size: 0.8125rem;
        flex-direction: column;
        gap: 6px;
    }
}

@media (max-width: 480px) {
    .symbol-showcase {
        padding: 24px 16px !important;
        margin-top: 30px !important;
        margin-bottom: 30px !important;
    }

    .symbol-main-img {
        max-height: 100px;
    }

    .symbol-text {
        font-size: 0.9375rem;
    }

    .signature-item {
        padding: 20px;
    }

    .logotype-item {
        padding: 20px;
    }

    .logotype-preview {
        min-height: 120px;
    }

    .logotype-bg-light {
        padding: 20px;
        min-height: 120px;
    }

    .logotype-img {
        max-height: 80px;
    }
}

/* ========================================
   유틸리티 클래스 - 마진 유틸리티
   ======================================== */

/* 마진 유틸리티 */
.mt-30 {
    margin-top: 30px;
}

/* 작은 화면에서 마진 유틸리티 */
@media (max-width: 480px) {
    .mt-xs-20 {
        margin-top: 20px;
    }
}

/* ========================================
   Part 2: Template global responsive (구 style-responsive.css)
   ======================================== */

/*    .inner-nav > ul{
        justify-content: flex-end;
    전부 추가함 20240717 }*/

/* ==============================
   Small desktop
   ============================== */

@media only screen and (max-width: 1440px) {
    
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
    .decoration-1{
        left: -30px;
    }
    
}
@media only screen and (max-width: 1366px) {	
    .webzine{
        background-size:cover;
        background-color: #ffffcc;
        background-position: 62% 15px;
        background-origin: border-box;
        background-repeat: no-repeat;
    }

    .inner-nav > ul{
        justify-content: flex-end;
    }
    
    :root{
        --full-wrapper-margin-x: 30px;
    }
    .container{
        max-width: 1260px;
    }
    .row.gx-huge{
        --bs-gutter-x: calc(-6.527rem + 27.85vw);
    }
    .inner-nav ul li{
        margin: 0 16px;
    }
    .mn-has-multi{
        padding: 7px;
    }
    .mn-sub-multi {
        width: 196px !important;
    }
    .inner-nav ul li .mn-sub li a{
        padding: 10px 14px;
    }
    .stack-images{
        position: relative;
        padding: 12.5% 0;
    }
    .lead-alt{
        font-size: calc(1.896rem + 1.15vw);
    }
    .hs-line{
        height: 87vh;
    }
    .hs-title-1{
        font-size: calc(1.5rem + 3vw);
    }
    .hs-title-2{
        font-size: 8.78477vw;
    }
    .hs-title-2a{
        font-size: 7.5vw;
    }
    .hs-title-3{
        font-size: calc(1.559rem + 0.96vw);
    }
    .hs-title-3a{
        font-size: calc(1.559rem + 0.96vw);
    }
    .hs-title-4{
        font-size: calc(1.19rem + 5.93vw);
    }
    .hs-title-4a{
        font-size: calc(0.39rem + 6.86vw);
    }
    .hs-title-5{
        font-size: 10.9809vw;
    }
    .hs-title-7{
        font-size: 11.7129vw;
    }
    .hs-title-8{
        font-size: calc(1.587rem + 2.53vw);
    }
    .hs-title-9{
        font-size: calc(1.614rem + 2.87vw);
    }
    .hs-title-10{
        font-size: calc(1.827rem + 1.96vw);
    }
    .hs-title-11{
        font-size: calc(0.76rem + 0.57vw);
    }
    .hs-title-12{
        font-size: calc(1.294rem + 4.78vw);
    }
    .hs-title-13{
        font-size: calc(1.37rem + 4.4vw);
    }
    .hs-title-13a{
        font-size: calc(0.717rem + 5.16vw);
    }
    .hs-line-14{
        font-size: calc(1.297rem + 7.27vw);
    }
    .hs-paragraph-1{
        top: 11.713vw;
    }
    .hs-paragraph-2{
        top: 11.7130vw;
        right: 3.66vw;
    }
    .hs-descr{
        font-size:  calc(1.227rem + 1.05vw);
    }
    .section-title{
        font-size: calc(1.179rem + 2.5vw);
    }
    .section-title-small{
         font-size: calc(1.136rem + 1.82vw);
         word-break: keep-all;/*내 주변의 감정평가사*/
    }
    .section-title-medium{
        font-size: calc(1.735rem + 3.82vw);
    }
    .section-title-large{
        font-size: calc(0.50887rem + 5.99vw);
    }    
    .section-title-repeat{
        font-size: calc(0.358rem + 8.37vw);
    }
    .section-title-strong{
        font-size: calc(1.409rem + 4.21vw);
    }
    .section-descr{
        font-size: calc(1.152rem + 0.33vw);
    }
    .section-descr-large{
        font-size: calc(1.23rem + 0.76vw)
    }
    .section-descr-extralarge{
        font-size: calc(1.156rem + 1.72vw);
    }
    .section-text{
        font-size: calc(1.157rem + 0.4vw);
    }
    
    .services-2-button{
        padding: 4.2459vw;
    }
    .services-2-title{
        font-size: 6.0029vw;
    }
    .services-2-number{
        font-size: 1.9vw;
    }
    .services-2-image{
        max-width: 15.959vw;
    }
    .services-2-descr{
        max-height: 2.1962vw;
        margin-top: -2.1962vw;
        margin-left: 7.3206vw;
        padding: 0 2.9282vw;
        font-size: calc(0.83rem + 0.2vw);
    }
    .services-2-button-close{
        width: 4.39238vw;
        height: 4.39238vw;
    }
    .services-3-item{
        padding: 40px calc(0.868rem + 1.91vw);
    }
    .services-4-title > b{
        font-size: calc(0.521rem + 1.15vw);
    }
    .services-tabs{
        font-size: calc(1.194rem + 1.53vw);
    }
    .services-tabs > li{
        margin-bottom: 0.1em;
    }
    .services-text{
        bottom: 30px;
    }
    .post-prev-title{
        padding-top: calc(0.459rem + 2.39vw);
    }
    .post-prev-title,
    .post-prev-text,
    .post-prev-info{
        padding-left: calc(0.459rem + 2.39vw);
        padding-right: calc(0.459rem + 2.39vw);
    }
    .post-prev-container > *:last-child{
        padding-bottom: calc(0.459rem + 2.39vw);
    }
    
    .portfolio-1-title{
        margin-left: -7.6867vw;
        font-size: calc(0.297rem + 5.65vw);
    }
    .portfolio-1-title a{
        margin-left: -0.19vw;
    }
    
    .post-prev-1-title{
        font-size: calc(0.684rem + 0.96vw);
    }
    .post-prev-1-title.large{
        font-size: calc(0.789rem + 1.27vw);
    }
    
    .post-prev-2-title{
        font-size: calc(0.98rem + 1.2vw);
    }
    
    .contact-1-text{
        font-size: calc(0.692rem + 1.39vw);
    }
    
    .marquee-style-1{
        font-size: calc(0.779rem + 0.48vw);
    }
    .marquee-style-2{
        font-size: calc(0.398rem + 1.73vw);
    }
    .marquee-style-3{
        font-size: 10.9809vw;
    }
    .marquee-style-4{
        font-size: 5.1244vw;
    }
    .marquee-style-5{
        font-size: 14.6412vw;
    }
    .accordion-1 > dt{
        font-size: calc(0.632rem + 1.53vw);
    }
    .portfolio-2-title{
        font-size: calc(1.463rem + 1.43vw);
    }
    .portfolio-3-title{
        font-size: calc(0.975rem + 3.25vw);
    }
    .testimonial,
    .testimonial p,
    .testimonials-slider-1 blockquote {
        font-size: calc(1.079rem + 2.1vw);
    }
    .testimonials-slider-2 blockquote{
        padding-left: 16.1054vw;
    }
    .testimonials-slider-2 .blockquote-icon{
        width: 13.9092vw;
        height: 7.3206vw;;
        font-size: 20.4978vw;
    }
    .testimonials-slider-2 blockquote p{
        font-size: calc(0.81rem + 2.2vw);
    }
    .testimonials-3-text p{
        font-size: calc(1.214rem + 0.33vw);
    }
    .services-5-title{
        font-size: calc(1.26rem + 0.57vw);
    }
    .big-icon-link,
    .big-icon-link-gradient{
        font-size: calc(1.653rem + 1.58vw);
    }
    .testimonials-6-item,
    .testimonials-6-text{
        font-size: calc(0.915rem + 1.05vw);
    }    
    .ci-text.large{
        font-size: calc(0.904rem + 0.48vw);
    }
    .fw-menu-large{
        font-size: calc(0.915rem + 1.05vw);
    }    
    .newsletter-elegant input.newsletter-field{
        font-size: calc(1.472rem + 0.76vw) !important;
    }
    .form.newsletter-modern input.newsletter-field,
    .form.newsletter-modern input.newsletter-field:hover,
    .form.newsletter-modern input.newsletter-field::placeholder,
    .form.newsletter-modern input.newsletter-field:hover::placeholder{
        font-size: calc(1.398rem + 1.29vw);  
    }
    .features-1-title{
        font-size: calc(1.541rem + 2.29vw);
    }
    
    .testimonials-5-text{
        font-size: calc(1.174rem + 0.38vw);
    }
    
    .form.newsletter-elegant input.newsletter-field {
        font-size: calc(1.309rem + 0.96vw) !important;
    }

    
/* 주변 감정평가사 찾기*/
h4.alt-features-title{
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}
.alt-features-title{
    margin-bottom: 11px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}

.light-content .text-gray{
    color: var(--color-dark-mode-gray-1);
    font-size: smaller;letter-spacing: -0.08em;
}

    
}
@media only screen and (max-width: 1200px) {
    .inner-nav > ul{
        justify-content: flex-end;
    }
    .hs-paragraph-1{
        font-size: 15px;
    }
    .hs-paragraph-2{
        max-width: 300px;
        font-size: 12px;
    }
    .inner-nav ul{
        font-size: 14px;
    }	
    .inner-nav ul li{
        margin: 0 11px;
    }

    .inner-nav ul li .mn-sub li a{
        padding: 8px 10px;
        font-size: 12px;
    }
    .mn-sub-multi {
        width: 180px !important;
    }
    .team-social-links a{
        width: 30px;
        height: 30px;
    }    
    
    .mod-breadcrumbs-mini{
        text-align: right;
    }
    
    .decoration-1{
        bottom: -20px;
    }
    
    .number-title{
        font-size: calc(2.273rem + 3.64vw);
    }
    
    .item-carousel .owl-item{
        padding: 0 3vw;
    }
    
    .works-grid:not(.work-grid-3) .work-item{
        width: 49.9%;
    } 
     
    /* 주변 감정평가사 찾기*/
h4.alt-features-title{
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}
.alt-features-title{
    margin-bottom: 11px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}


}
@media only screen and (max-width: 1199px) {
    .inner-nav > ul{
        justify-content: flex-end;
    }
    main{
        overflow: hidden;
    }    
    .tpl-alt-tabs{
        font-size: 13px;
        letter-spacing: 0.2em;
    }
    .tpl-alt-tabs > li{
        width: 170px;
    }
    
/*추가*/
.tpl-alt-tabs-6{
    font-size: 13px;
    letter-spacing: 0.2em;
}
.tpl-alt-tabs-6 > li{
    width: 165px;
}/* 주변 감정평가사 찾기*/
h4.alt-features-title{
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}
.alt-features-title{
    margin-bottom: 11px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.05em;
    transition: var(--transition-default);
    vertical-align: middle;
}


    .services-tabs > li > a > .number{
        top: .3em;
    }
    :root{
        --services-text-overlap: 135px;
    }
    
    .team-1-column-sticky{    
        position: static;
        height: auto;
    }
    
}




/* ==============================
   Tablet landskape
   ============================== */

@media only screen and (max-width: 1024px) {
    
    .inner-nav > ul{
        justify-content: flex-end;
    }

    .hs-paragraph-1{
        position: static;
        top: 0;
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    .hs-paragraph-2{
        position: static;
        top: 0;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        text-indent: 0;
    }
    .scroll-down-alt{
        width: 62px;
        height: 62px;
        line-height: 52px;
        margin-left: -31px;
        font-size: 15px;
    }
    .testimonials-slider-1 blockquote p{
        font-size: 18px;
    }
    .benefit-item{
        width: 300px;
        padding: 15px 32px;
    }

    .page-section,
    .split-column-left,
    .split-column-right{
        padding-top: 120px; 
        padding-bottom: 120px;       
    }
    
    .owl-pagination{
        bottom: 25px;
    }  
    
    .lp-item{
        width: 50%;
    }
    .lp-item:nth-child(4n + 5) { 
        clear: none; 
    }
    .lp-item:nth-child(2n + 3) {        
        clear:left;
    }
    .lp-title, .lp-author{
        font-size: 13px;
    }
    
    .fa-examples > li{
        width: 33.3%;
    }
    
    .services-2-descr.js-visible{
        max-height: 800px;  
    }
    
    .works-filter.works-filter-bold a{
        margin-left: 12px;
    }
    
    .section-showcases{
        border-radius: 30px;
    }

}
  
@media only screen and (max-width: 991px) {
    .inner-nav > ul{
        justify-content: flex-end;
    }
    .works-grid.work-grid-gut-lg{
        margin: -40px 0 0 -30px;
    }
    .works-grid.work-grid-gut-lg .work-item{
        padding: 40px 0 0 30px;
    }
    .works-grid.work-grid-gut-xl{
        margin: -40px 0 0 -30px;
    }
    .works-grid.work-grid-gut-xl .work-item{
        padding: 40px 0 0 30px;
    }
    .owl-prev,
    .owl-next{
        height: 37px;
        font-size: 37px;
    }
    
    :root{
        --services-text-overlap: 0;
    }
    .services-content-item{
        min-height: 200px;
    }
    .services-text{
        padding: 0;
    }
    img.services-image{
        align-self: flex-end;
        width: 60%;
        max-width: 520px;
        margin: 0 0 0 35%;
    }
    
    .mod-breadcrumbs:not(.align-center):not(.mod-breadcrumbs-mini) {
        text-align: left !important;
    }
    
    .tpl-alt-tabs > li{
        width: 200px;
    } 
    
    /*추가*/
    .tpl-alt-tabs-6 > li{
        width: 200px;
    } 
    
    .team-item-name{
        font-size: 18px;
    }
    
    .features-icon{
        font-size: 64px;
    } 
    .features-title{
        font-size: 20px;
    }
    .features-descr{
        font-size: 16px;
    }
    .alt-features-grid{
        margin-top: -30px;
    } 
    .alt-features-item{
        margin-top: 30px;
    }
    .work-item,
    .work-grid-3 .work-item,
    .container .work-grid-3 .work-item{
        width: 49.9%;
    }      
    
    .contact-1-left,
    .contact-1-right{
        border-radius: 20px;
    }
    
    .split-column-left{
        padding-right: 30px;
        border-radius: 0;
    }
    .split-column-right{
        padding-left: 30px;
        border-radius: 0;
    }
    .split-image-left,
    .split-image-right{
        overflow: visible;
        border-radius: 0;
    }
    .split-image-left img,
    .split-image-right img{
        position: relative;
        height: auto;
    }
    
    .call-action-2-images {
        margin: 0;
    }
    .call-action-3-image-2-wrap{
        left: 0;
    }

}
  
  
/* ==============================
   Tablet Portrait
   ============================== */
  
@media only screen and (max-width: 768px) {
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
    /* section-caption-border pill — 서브 히어로 통일 스타일은 kapa-site-layout.css에서 관리 */
    
    /* 메인 히어로 건물 배경: 모바일에서 우측으로 조금 이동 */
    .hero-shortcut-section{
        background-position: 70% 30% !important;
    }
    .page-section,
    .split-column-left,
    .split-column-right{
        padding-top: 80px;
        padding-bottom: 80px;
    }    
    .small-section{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .small-title{
        font-size: 18px;
    }
    
    .section-features li{
        font-size: 11px;
        padding: 8px 8px 6px 8px;
     }
    
    .owl-pagination{
        bottom: 17px;
    }  
    
    .tpl-minimal-tabs > li{
        padding: 0 5px;
    }    
        
    .benefit-item{
        width: 264px;
    }
    .alt-service-grid{
        margin-top: -30px;
    }
    .alt-service-item{
        margin-top: 30px;
    }

    .works-filter a{
        margin: 4px 12px 4px 0;
    }    
    .blog-item{
        margin-bottom: 50px;
    }
    .blog-item-title{
        font-size: 28px;
    }
    .blog-item-title .small{
        font-size: 15px;
    }
    .blog-media{
        margin-bottom: 15px;
    }
    .blog-item-body .small{
        font-size: 13px;
    }
    .google-map > iframe{
        height: 300px;
    }
    
    .decoration-3{
        bottom: -125px;
        right: -35px;
    }
    
    .portfolio-3-image{
        border-radius: 30px;
    }

    .light-content .text-gray{
        color: var(--color-dark-mode-gray-1);
        font-size: smaller;letter-spacing: -0.08em;
    }
    
    
}

@media only screen and (max-width: 767px) {
    
    .inner-nav > ul{
        justify-content: flex-end;
    }

    .fixed-height-small{
        height: 300px;
        min-height: 300px;
    }
    .fixed-height-medium{
        height: 350px;
        min-height: 350px;
    }
    .fixed-height-large{
        height: 400px;
        min-height: 400px;
    }
    .mark-decoration-1 > svg{
        bottom: -0.55em;
    }
    .services-text{
        position: relative;
        bottom: 0;
        left: 0;
        max-width: 100%;
        margin-bottom: 10px;
    }
    .services-text-container{
        padding: 30px;
    }
    img.services-image{
        max-width: unset;
        width: 100%;
        margin: 0;
    }
    .benefit-item{
        width: 230px;
        padding: 0;
    }    
    .benefit-item:hover:after{
        display: none;
    }       
    .wide-heading{
        font-size: 32px;
        letter-spacing: 2px;
    }    
    .works-filter a{
        margin: 4px 4px 4px 0;
        width: 46%;
    }
    .works-filter a.active:after,
    .works-filter a:hover:after{
        transform: scaleX(0);
    }
    .works-filter.works-filter-elegant a{
        margin: 4px 4px 4px 0;
        width: 48%;
    }
    .works-filter.works-filter-fancy{
        display: block;
    }
    .works-filter.works-filter-fancy a,
    .works-filter.works-filter-fancy a:hover,
    .works-filter.works-filter-fancy a.active{
        margin: 2px !important;
        width: 46%;
    }
    .works-filter.works-filter-fancy a.active:after,
    .works-filter.works-filter-fancy a:hover:after{
        transform: none;
    }
    .works-filter.works-filter-fancy a:before,
    .works-filter.works-filter-fancy a:after{
        width: 100%;
        margin-left: 0;
    }
    .works-filter.works-filter-fancy a:before{
        border: 1px solid var(--color-dark-1) !important;
    }
    .works-filter.works-filter-fancy a:before,
    .works-filter.works-filter-fancy a:after{
        border-radius: var(--border-radius-default);
    }
    .works-filter.works-filter-gradient a{
        margin: 4px 4px 4px 0;
        width: 47.5%;
    }
    .works-filter.works-filter-slick{
        display: block;
        padding: 0;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
    }
    .works-filter.works-filter-slick a,
    .works-filter.works-filter-slick a:hover,
    .works-filter.works-filter-slick a.active{        
        width: 46%;
        margin: 2px !important;
        padding-top: 10px;
        padding-bottom: 10px;
        background: #fff;
        border-radius: 100px;
        box-shadow: var(--box-shadow-block);
    }
    .works-filter.works-filter-bold a,
    .works-filter.works-filter-bold a:first-child{
        margin: 4px;
        font-size: 14px;
    }
    .work-item,
    .work-grid-2 .work-item,
    .work-grid-3 .work-item,
    .container .work-grid-3 .work-item,
    .work-grid-4 .work-item{
        width: 100% !important;
    }   
    .big-icon{
        width: 60px;
        height: 60px;
        line-height: 52px;
        font-size: 24px;
        margin-bottom: 0;
    }
    .text-mobile{
        font-size: 110%;
        line-height: 1.2;
    }
    .portfolio-1-title{
        margin-left: 0;
    }
    
    .fw-social-inline-item{
        display: block;
    }
    
    .map-boxed-1{
        min-height: 50vh;
        aspect-ratio: 9/12;
        padding: 5px;
        border-radius: var(--border-radius-default);
    }
    .map-boxed-1 iframe,
    .map-boxed-1 img{        
        border-radius: calc(var(--border-radius-default) - 5px);
    }
    
    .composition-7{
        margin-top: -30px;
    }
    .composition-7-image-1,
    .composition-7-image-2,
    .composition-7-image-3,
    .composition-7-image-4{
        width: 46.5%;
        margin-top: 30px;
    }
    .testimonials-6-icon{
        font-size: 7em;
    }
    .services-8-icon{
        margin-bottom: 25px;
    }
    
}


/* ==============================
   Phone
   ============================== */
  
@media only screen and (max-width: 575px) { 
    .nav-logo-wrap .logo img{
        max-height: 60%;
    }
    .nav-logo-wrap .logo img:not([draggable]),
    .nav-logo-wrap .logo embed,
    .nav-logo-wrap .logo object,
    .nav-logo-wrap .logo video {
        max-width: 60%;
        height: auto;
    }

.tpl-alt-tabs-7 > li{
    min-width: 140px;
    display: inline-flex;
    align-items: stretch;
    margin:15px 0;
    vertical-align: top;
    float: none;
    padding: 0;
    background: none !important;
    /* font-size: 20px; */
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 120%;
}
    
    .inner-nav > ul{
        justify-content: flex-end;
    }

    .form input.newsletter-field,
    .form .newsletter-field-wrap{
        display: block;
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .form .newsletter-button{
        display: block;
        width: 100%;
    }
    
    .works-filter a{
        margin: 4px 4px 4px 0;
    } 
    
    .hs-wrap{
        padding: 30px 20px;
    }
    
    .scroll-down-2,
    .scroll-down-2:hover{
        animation: none;
    }
    
    .contact-2-icon{
        width: 36px;
    }
    .contat-2-intro{
        padding: 15px 10px;
    }
    .contact-2-text{
        font-size: 16px;
    }
    .webzine{
        background-size:cover;
        background-color: #ffcccc;
        background-position: 62% 15px;
        background-origin: border-box;
        background-repeat: no-repeat;
    }
    
     
}
    
@media only screen and (max-width: 480px) {
    .webzine{
        background-size:cover;
        background-color: #ffffcc;
        background-position: 62% 15px;
        background-origin: border-box;
        background-repeat: no-repeat;
    }
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
    .full-wrapper{
        --full-wrapper-margin-x: 20px;
    }
    .container{
        padding-left: 20px;
        padding-right: 20px;
    }
    .lead{
        font-size: 120%;
    }
    .form textarea{
        min-height: 200px !important; 
    }
    .tpl-tabs {
        border: none;
    }
    .tpl-tabs li .nav-link.active{
        border-color: var(--color-dark-mode-gray-1);
        border-radius: var(--border-radius-default);
    }
    .blog-item-body blockquote p:before{
        display: block;
        margin-top: 1em;
        position: static;
        top: 0;
        left: 0;
        font-size: 2.58em;
        line-height: 0;
        opacity: 1;
    }
    .page-section,
    .split-column-left,
    .split-column-right{
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .small-section{
        padding: 30px 0;
    }    
    .owl-pagination{
        bottom: 5px !important;
    }    
    .owl-page{
        padding-left: 8px;
        padding-right: 8px;
    }
    .owl-prev{
        left: 0;
    }
    .owl-next{
        right: 0;
    }
    
    .tpl-minimal-tabs > li{
        padding: 0;
    }
    .tpl-minimal-tabs > li > a{
        padding: 6px 10px 5px;
    }
    .tpl-alt-tabs{
        font-size: 12px;
        letter-spacing: 0.1em;
    }
    .tpl-alt-tabs > li{
        width: 120px;
        font-size: 16px;
    }

/*추가*/
.tpl-alt-tabs-6{
    font-size: 12px;
    letter-spacing: -0.08em;
}
.tpl-alt-tabs-6 > li{
    width: 120px;
    font-size: 16px;
}

/*바로가기 추가*/
.tpl-alt-tabs-7{
    font-size: 12px;
    letter-spacing: -0.08em;
}
.tpl-alt-tabs-7 > li{
    width: 120px;
    font-size: 16px;
}

    .alt-tabs-icon{
        font-size: 32px;
    }
    
    .work-container{
        padding: 30px 0;
    }     
    .works-filter a{
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }    
    .work-full-text{
        margin-top: 30px;
    }
    .work-full-title{
        font-size: 20px;
    }    
    .works-filter.works-filter-elegant a{
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .works-filter.works-filter-fancy a,
    .works-filter.works-filter-fancy a:hover,
    .works-filter.works-filter-fancy a.active{
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .works-filter.works-filter-gradient a{
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .works-filter.works-filter-slick a,
    .works-filter.works-filter-slick a:hover,
    .works-filter.works-filter-slick a.active{
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    } 
    .call-action-2-image-2{
        margin: 60px auto;
    }
    .post-prev-3-intro{
        padding: 25px 20px;
    }
    .composition-8-image{
        margin-bottom: 60px;
        border-radius: 50px;        
    }
    .composition-8-decoration-2{
        bottom: -60px;
    }
    .blog-container{
        margin-top: 30px;
        margin-bottom: 30px;
    }    
    .blog-item-q p{
        font-size: 20px;
    }
    .pagination a{
        min-width: 32px;
        margin-right: 3px;
        padding: 6px 8px;
        font-size: 16px;
    }
    .comment-avatar{
        width: 30px;
        margin-top: 7px;
    }    
    .comment-item{
        font-size: 15px;
    }    
    .separ-space{
        display: block;
        height: 10px;
    }
    .google-map > iframe{
        height: 300px;
    }
    .tpl-tabs > li{
        display: block;
        float: none;
        width: 100%;
    }
    .tpl-tabs > li.active a{
        background: #f5f5f5 !important;
    }
    
    .mark-decoration-1:before{
        bottom: -0.27em;
    }
    
    .blog-item-title{
        font-size: 22px;
    }
    .blog-item-body{
        margin-bottom: 37px;
        font-size: 18px;
    }

/*
 * Toggle_global 협회업무>국제교류>20250121 추가
 */
/* 기본 스타일 (데스크톱) */
div.toggle_global > dl.toggle > dt > a > p {
    background: var(--color-dark-4);
    color: white;
    margin: 0 5px;
    font-size: 14px;
    top: 50%;
    display: inline;
    min-width: 100px;
    text-align: center;
}

/* 태블릿 */
@media only screen and (max-width: 1024px) {
    div.toggle_global > dl.toggle > dt > a > p {
        font-size: 13px;
        min-width: 100px;
        padding: 3px 8px;
    }
}
/* 모바일 */
@media only screen and (max-width: 768px) {
    div.toggle_global > dl.toggle > dt {
        font-size: 15px;
    }
    
    div.toggle_global > dl.toggle > dt > a {
        padding: 12px 25px 12px 0;
        display: flex;
    }
    
    div.toggle_global > dl.toggle > dt > a > p {
        font-size: 12px;
        min-width: 100px;
        padding: 2px 6px;
        margin: 0 8px 0 10px;
    }

    div.toggle_global > dl.toggle > dt > a.active > span {
        white-space: normal;         /* 줄바꿈 허용 */
        display: -webkit-box;        /* 여러 줄 표시를 위한 설정 */
        -webkit-line-clamp: 3;      /* 최대 2줄까지 표시 */
        -webkit-box-orient: vertical;
        overflow: hidden;
        word-break: keep-all;       /* 단어 단위로 줄바꿈 */
        line-height: 1.4;           /* 줄간격 조정 */
    }
    .works-filter a.active:hover{
        color: var(--color-dark-1);
    }
    .works-filter a:after{
        content: "";
        display: block;
        position: absolute;
        left: 0;
        bottom: -1px;
        width: 100%;
        height: 1px;
        background-color: var(--color-primary-1);
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
        -webkit-transition: transform .25s ease-out;
        transition: transform .25s ease-out;
    }
    .works-filter a.active:after{
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    .works-filter a:hover:after{
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: left center;
        transform-origin: left center;
    }

    div.toggle_global > dl.toggle > dt > a.active {
        padding: 15px 25px 15px 0;  /* 여백 약간 증가 */
    }
    
    div.toggle_global > dl.toggle > dt > a.active > span {
        line-height: 1.3;           /* 모바일에서의 줄간격 */
    }
    div.toggle_global > dl.toggle > dt > a > span {
        padding-right: 10px; /* 화살표 아이콘과 겹치지 않도록 */
        
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 200px;
    }
    
    div.toggle_global > dl.toggle > dd {
        margin: 0 1.5em 1.2em;
        font-size: 14px;
        line-height: 1.5;
    }
}

/* 작은 모바일 화면 */
@media only screen and (max-width: 480px) {
    div.toggle_global > dl.toggle > dt {
        font-size: 14px;
    }
    
    div.toggle_global > dl.toggle > dt > a > p {
        font-size: 11px;
        min-width: 50px;
        padding: 2px 4px;
        margin: 0 5px 0 5px;
    }
}
}


/* ==============================
   Max Height 768
   ============================== */

@media only screen and (max-height: 768px) {
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
    .stack-images{
        padding: 16% 0;
    }
    
}


/* ==============================
   Max Height 374
   ============================== */

@media only screen and (max-height: 374px) {
    
    .min-height-80vh,
    .min-height-90vh,
    .min-height-100vh{
        min-height: 374px;
    }
    
}


/* ==============================
   IOS Background Fix
   ============================== */
  
.mobile .page-section, .mobile .home-section, .mobile .small-section{
    background-attachment: scroll !important;
}

/*
 * iPad Pro
 */

@media only screen and (min-width: 1024px) and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5) {
    
    html:not(.no-touch) .page-section, html:not(.no-touch) .home-section, html:not(.no-touch) .small-section{
        background-attachment: scroll !important;
    }
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
}

/* ==============================
   Internet Explorer Fix
   ============================== */
  
@media all and (-ms-high-contrast:none){
    .inner-nav > ul{
        justify-content: flex-end;
    }
    
     
    .min-height-80vh{
        height: 80vh;
    } 
    .min-height-90vh{
        height: 90vh;
    } 
    .min-height-100vh{
        height: 100vh;
    }
    .fixed-height-large{
        height: 800px;
    } 
    .fixed-height-medium{
        height: 700px;
    } 
    .fixed-height-small{
        height: 600px;
    }
     
}


/*=======================
      홍보센터 추가작업
=======================*/


    /* ===== 모바일 반응형 스타일 ===== */
    
    /* 태블릿 (768px 이하) */
    @media (max-width: 768px) {
        /* 연도별 섹션 여백 조정 */
        .year-section {
          margin-bottom: 40px !important;
        }
        
        .year-title {
          font-size: 20px !important;
          margin-bottom: 20px !important;
        }
        .cartoon-card {
            min-height: 200px !important;
        }
        
        .empty-card {
            height: 200px !important;
            min-height: 200px !important;
        }

 /* 모바일 반응형 스타일 */
 @media (max-width: 768px) {
    .work-grid-3 .work-list {
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }
    
    .work-grid-4 .work-list {
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }
    
    .work-wt-img {
      height: 200px;
    }
  }

  @media (max-width: 480px) {
    .work-grid-3 .work-list,
    .work-grid-4 .work-list {
    grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }
    
    .work-wt-img {
      height: 180px;
    }
  }



        /* 2025년도 2열 그리드 - 태블릿에서는 2열 유지 */
        .work-grid-2 .work-list {
          flex-direction: row !important;
          gap: 15px !important;
          display: flex !important;
        }
        
        .work-grid-2 .work-item {
          flex: 1 !important;
          max-width: calc(50% - 7.5px) !important;
          width: calc(50% - 7.5px) !important;
        }
        
        /* 2024년도 4열 그리드 - 태블릿에서는 2열로 변경 */
        .work-grid-4 .work-list {
          display: flex !important;
          flex-wrap: wrap !important;
          gap: 15px !important;
          justify-content: space-between !important;
          grid-template-columns: unset !important;
        }
        
        .work-grid-4 .work-item {
          flex: 0 0 calc(50% - 7.5px) !important;
          width: calc(50% - 7.5px) !important;
          max-width: calc(50% - 7.5px) !important;
        }
        
        /* 브로슈어 그리드 - 태블릿에서는 2열로 변경 */
        #brochure-grid .work-list {
          gap: 15px !important;
        }
        
        #brochure-grid .work-item {
          flex: 0 0 calc(50% - 7.5px) !important;
        }
        
        /* EBook 그리드 - 태블릿에서는 2열로 변경 */
        #ebook-grid .work-list {
          grid-template-columns: repeat(2, 1fr) !important;
          gap: 20px !important;
          max-width: 100% !important;
        }
        
        /* EBook 아이템 위치 재조정 */
        #ebook-grid .work-item:nth-child(1) {
          grid-column: 1 !important;
        }
        
        #ebook-grid .work-item:nth-child(2) {
          grid-column: 2 !important;
        }
        
        /* 태블릿 이미지 높이 통합 */
        .work-img-bros {
          height: 280px !important;
        }
        
        .work-wt-img,
        .work-grid-2 .work-img {
          height: 200px !important;
          width: 100% !important;
        }
        
        .work-grid-2 .work-img {
          min-height: unset !important;
        }
        
        /* 탭 필터 버튼 크기 조정 */
        .works-filter .filter {
          padding: 8px 16px !important;
          font-size: 14px !important;
          margin: 0 5px !important;
        }
        
        /* 태블릿 이미지 정렬 통합 */
        .work-item {
          text-align: center !important;
        }
        
        .work-img,
        .work-img-bros,
        .work-wt-img {
          display: flex !important;
          justify-content: center !important;
          align-items: center !important;
        }
        
        .work-img img,
        .work-img-bros img,
        .work-wt-img img {
          margin: 0 auto !important;
          display: block !important;
        }
        
        /* 웹툰 이미지 특별 처리 */
        .work-wt-img img {
          width: auto !important;
          height: -webkit-fill-available !important;
        }
        
        .work-img-bg {
          background-color: #fff !important;
        }
      }
      
      /* 모바일 (480px 이하) */
      @media (max-width: 480px) {
        /* 연도별 섹션 여백 더 줄임 */
        .year-section {
          margin-bottom: 30px !important;
        }
        
        .year-title {
          font-size: 18px !important;
          margin-bottom: 15px !important;
        }
        
        /* 모바일에서 2열 그리드로 변경 - 한 줄에 2개씩 배치 */
        .work-grid-4 .work-list {
          display: flex !important;
          flex-wrap: wrap !important;
          gap: 10px !important;
          justify-content: space-between !important;
          grid-template-columns: unset !important;
        }
        
        .work-grid-4 .work-item {
          flex: 0 0 calc(50% - 5px) !important;
          width: calc(50% - 5px) !important;
          max-width: calc(50% - 5px) !important;
        }
        
        /* 2025년도 그리드도 모바일에서 2열로 배치 */
        .work-grid-2 .work-list {
          flex-direction: row !important;
          gap: 10px !important;
          display: flex !important;
        }
        
        .work-grid-2 .work-item {
          flex: 1 !important;
          max-width: calc(50% - 5px) !important;
          width: calc(50% - 5px) !important;
        }
        
        #brochure-grid .work-list {
          flex-direction: column !important;
          gap: 15px !important;
        }
        
        #brochure-grid .work-item {
          flex: 0 0 100% !important;
        }
        
        #ebook-grid .work-list {
          grid-template-columns: 1fr !important;
          gap: 15px !important;
        }
        
        /* EBook 아이템 위치 재조정 */
        #ebook-grid .work-item:nth-child(1),
        #ebook-grid .work-item:nth-child(2) {
          grid-column: 1 !important;
        }
        
        /* 모바일 이미지 높이 통합 */
        .work-img-bros {
          height: 200px !important;
        }
        
        .work-wt-img,
        .work-grid-2 .work-img {
          height: 140px !important;
          width: 100% !important;
        }
        
        .cartoon-card {
            min-height: 140px !important;
        }
        
        .empty-card {
            height: 140px !important;
            min-height: 140px !important;
        }
        
        .work-grid-2 .work-img {
          min-height: unset !important;
        }
        
        /* 모바일 이미지 정렬 통합 */
        .work-item {
          text-align: center !important;
        }
        
        .work-img,
        .work-img-bros,
        .work-wt-img {
          display: flex !important;
          justify-content: center !important;
          align-items: center !important;
        }
        
        .work-img img,
        .work-img-bros img,
        .work-wt-img img {
          margin: 0 auto !important;
          display: block !important;
        }
        
        /* 탭 필터 버튼을 세로로 배치 */
        .works-filter {
          display: flex !important;
          flex-direction: column !important;
          gap: 10px !important;
          align-items: center !important;
        }
        
        .works-filter .filter {
          width: 200px !important;
          margin: 0 !important;
          padding: 10px 20px !important;
          font-size: 16px !important;
        }
        
        /* 섹션 여백 조정 */
        .page-section {
          padding: 40px 0 !important;
        }
        
        .works-filter {
          margin-bottom: 40px !important;
        }
      }
      
      /* 작은 모바일 (360px 이하) */
      @media (max-width: 360px) {
        .year-title {
          font-size: 16px !important;
        }
        
        .work-img-bros {
          height: 200px !important;
        }
        
        .work-wt-img,
        .work-grid-2 .work-img {
          height: 140px !important;
          width: 100% !important;
        }
        
        .work-grid-2 .work-img {
          min-height: unset !important;
        }
        
        /* 작은 모바일에서도 2열 레이아웃 유지 */
        .work-grid-4 .work-list {
          display: flex !important;
          flex-wrap: wrap !important;
          gap: 10px !important;
          justify-content: space-between !important;
          grid-template-columns: unset !important;
        }
        
        .work-grid-4 .work-item {
          flex: 0 0 calc(50% - 5px) !important;
          width: calc(50% - 5px) !important;
          max-width: calc(50% - 5px) !important;
        }
        
        .works-filter .filter {
          width: 180px !important;
          padding: 8px 16px !important;
          font-size: 14px !important;
        }
      }
      
      /* 터치 디바이스 최적화 */
      @media (hover: none) and (pointer: coarse) {
        .work-item a {
          cursor: pointer !important;
        }
        
        .works-filter .filter {
          min-height: 44px !important;
        }
        
        .work-item {
          transition: transform 0.2s ease !important;
        }
        
        .work-item:active {
          transform: scale(0.98) !important;
        }
      }
      
      /* 고해상도 디스플레이 최적화 */
      @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
        .work-img img,
        .work-img-bros img,
        .work-wt-img img {
          image-rendering: -webkit-optimize-contrast !important;
          image-rendering: crisp-edges !important;
        }
      }


/* ==============================
   Print Styles Fix
   ============================== */
  
@media print {
    
    *{
        color: #000 !important;
        background: #fff !important;
    }
    .main-nav{
        display: none;
    }
    .buy-button{
        display: none;
    }
    img{
        display: block;
    }    
    /*20250523추가 : 프린트 시 배경이 양쪽으로 까맣게 나오는 오류*/
    .bg-dark-2 {
        background-color: #fff !important;
}
    
}