
/*-- sec --*/
.title_box {
    opacity: 0;
    transform: translateX(-20px);
}
.sec_eng {
    font-size: var(--ft20);
    font-weight: var(--bold);
    color: var(--primary);
    margin-bottom: 30px;
}
.sec_title {
    font-size: var(--ft45);
    font-weight: var(--bold);
    margin-bottom: 40px;
    line-height: 1.3;
}
.sec_title_contact {
    font-size: var(--ft45);
    font-weight: var(--bold);
    margin-bottom: 40px;
    line-height: 1.3;
    white-space: normal;
}
.sec_text {
    font-size: var(--ft18);
}

.bg {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
}

/*----------------------------- sec1 20251022_plus-----------------------------*/

/* 컨테이너(선택: 폭/중앙정렬만) */
.cn-hero {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 16px;
  }
  
  /* 타이틀 */
  .cn-hero-title {
    font-size: clamp(28px, 3.6vw, 48px);
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.02em;
    text-align: center;
    margin: 0 0 18px;
  
    /* 금빛 그라디언트 텍스트 */
    background: linear-gradient(135deg, #fff7c2 0%, #ffd700 45%, #d1a838 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  
    text-shadow: 0 6px 30px rgba(0,0,0,.25);
    position: relative;
  
    animation: cnFadeDown .6s ease both;
  }
  
  /* 타이틀 밑줄 */
  .cn-hero-title::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -12px;
    width: 92px;
    height: 6px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255,215,0,.95), rgba(209,168,56,0));
    box-shadow: 0 4px 18px rgba(255,215,0,.45);
  }
  
  /* 본문 */
  .cn-hero-text {
    font-size: clamp(16px, 1.45vw, 20px);
    line-height: 1.9;
    color: rgba(255,255,255,.95);
    text-align: center;
    margin-top: 28px;
    max-width: 75ch;
    margin-left: auto;
    margin-right: auto;
    text-wrap: pretty; /* 지원 브라우저에서 가독성 개선 */
    animation: cnFadeUp .6s ease .12s both;
  }
  
  /* 본문 강조: 키워드 캡슐 */
  .cn-hero-text .cn-hi {
    color: #fff;
    background: rgba(209,168,56,.25);
    border: 1px solid rgba(255,215,0,.35);
    padding: 0 .4em;
    border-radius: .45em;
    box-shadow: inset 0 0 12px rgba(255,215,0,.18);
    white-space: nowrap;
  }
  
  /* 본문 굵게를 금빛 톤으로 */
  .cn-hero-text strong {
    color: #ffd700;
    font-weight: 800;
  }
  
  /* 애니메이션 키프레임 (네임스페이스 포함) */
  @keyframes cnFadeDown { from {opacity:0; transform: translateY(-8px);} to {opacity:1; transform:none;} }
  @keyframes cnFadeUp   { from {opacity:0; transform: translateY(10px);} to {opacity:1; transform:none;} }
  
  @media (prefers-reduced-motion: reduce) {
    .cn-hero-title, .cn-hero-text { animation: none; }
  }
  


/*----------------------------- sec1 -----------------------------*/
.sec1 {
    width: 100%;
    height: 100%;
    background-color: var(--gray-300);
    z-index: 1;
    position: relative;
}
.visual_video {
    width: 100%;
    height: 100vh;
    position: sticky;
    top: 0;
    left: 0;
}
.visual_video .visual_bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 1;
}
.back_img {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/*-- visual_title --*/
.visual_text {
    width: 100%;
    min-height: 100vh;
    margin-top: -100vh;
    padding: 100px 0;
    background-color: rgba(20, 20, 20, .75);
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
}

/*-- impact_stats_ 20251022_sec1 plus --*/
.impact_stats {
    margin-top: 60px !important;
    padding: 40px !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05)) !important;
    border-radius: 16px !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    display: block !important;
    /* 테스트용 - 빨간색 배경으로 확인 */
    /* background-color: rgba(255, 0, 0, 0.3) !important; */

    /* 테스트용 - 금색 배경으로 변경 */
    /* background-color: rgba(209, 168, 56, 0.8) !important; */
}

.stats_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-bottom: 40px;
    
}


.stat_item {
    position: relative;
    text-align: center;
    padding: 25px 20px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    transition: all 0.5s ease;
    box-shadow: 0 0 0 rgba(255,215,0,0);
}

.stat_item:hover {
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255,215,0,0.6);
    box-shadow:
        0 0 20px rgba(255,215,0,0.3),
        0 0 40px rgba(209,168,56,0.25),
        inset 0 0 15px rgba(255,215,0,0.15);
    transform: translateY(-6px);
}
  
/* 숫자 강조 */
.stat_number {
  font-size: 3rem;
  font-weight: 900;
  color: #ffd700;
  text-shadow: 0 0 15px rgba(255,215,0,0.6);
  transition: text-shadow 0.4s ease, color 0.3s ease;
}

.stat_item:hover .stat_number {
  text-shadow: 0 0 25px rgba(255,215,0,0.9), 0 0 45px rgba(209,168,56,0.7);
  color: #fff8dc;
}

.stat_number {
    font-size: 3rem;
    font-weight: 900;
    color: #ffd700; /* 금색 */
    text-shadow:
        0 0 12px rgba(255, 215, 0, 0.8),
        0 0 24px rgba(209, 168, 56, 0.5),
        0 0 36px rgba(255, 255, 255, 0.2);
}

.stat_label {
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
    opacity: 0.95;
    text-shadow:
        0 0 10px rgba(255, 215, 0, 0.4),
        0 0 18px rgba(255, 215, 0, 0.2);
}

.highlight_features {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}


.feature_item {
    /* display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    flex: 1;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
    cursor: default;  */

    display: flex;
    align-items: center;
    gap: 15px;
    position: relative;
    padding: 20px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    flex: 1;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
    cursor: default;
    box-shadow: 0 0 0 rgba(255,215,0,0);
}


.feature_item:hover {
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255,215,0,0.6);
    box-shadow:
        0 0 20px rgba(255,215,0,0.3),
        0 0 40px rgba(209,168,56,0.25),
        inset 0 0 15px rgba(255,215,0,0.15);
    transform: translateY(-6px);
}

.feature_icon {
    font-size: 2rem;
    flex-shrink: 0;
}

.feature_img_icon {
    width: 80px !important;
    height: 80px !important;
    /* 이 margin이 이미지를 위로 밀어올립니다 → 제거 */
    margin: 0 !important;

    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.7));
    flex-shrink: 0;

    /* 살짝만 아래로 내리고 싶다면 translateY로 미세 조정 */
    transform: translateY(4px);
}

/* .feature_text {
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
    line-height: 1.4;
} */

.feature_text {
    font-size: 1.1rem;
    font-weight: 600;
    color: #ffd700;
    text-shadow: 0 0 15px rgba(255,215,0,0.6);
    transition: text-shadow 0.4s ease, color 0.3s ease;
}

.feature_item:hover .feature_text  {
    text-shadow: 0 0 25px rgba(255,215,0,0.9), 0 0 45px rgba(209,168,56,0.7);
    color: #fff8dc;
  }

/* 성공 사례 버튼 */
.success-case-section {
    margin-top: 40px;
    text-align: center;
}

.success-case-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 18px 40px;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.15), rgba(209, 168, 56, 0.15));
    border: 2px solid rgba(255, 215, 0, 0.6);
    border-radius: 50px;
    color: #ffd700;
    font-size: 1.2rem;
    font-weight: 700;
    text-decoration: none;
    text-shadow: 0 0 15px rgba(255, 215, 0, 0.6);
    box-shadow: 
        0 0 20px rgba(255, 215, 0, 0.3),
        inset 0 0 15px rgba(255, 215, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
}

.success-case-btn:hover {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.25), rgba(209, 168, 56, 0.25));
    border-color: rgba(255, 215, 0, 0.9);
    color: #fff8dc;
    text-shadow: 0 0 25px rgba(255, 215, 0, 0.9);
    box-shadow: 
        0 0 30px rgba(255, 215, 0, 0.5),
        0 0 50px rgba(209, 168, 56, 0.4),
        inset 0 0 20px rgba(255, 215, 0, 0.2);
    transform: translateY(-3px) scale(1.02);
}

.success-case-btn svg {
    transition: transform 0.3s ease;
}

.success-case-btn:hover svg {
    transform: translateX(5px);
}

.visual_inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 80px;
}
.visual_inner * {
    color: var(--white);
}

.visual_title {
    transform: translateY(calc(50vh - 120%));
    opacity: 0;
}
.title {
    font-size: var(--ft50);
    text-align: center;
    margin-bottom: 30px;
    /* white-space: normal; */
}
.title strong {
    font-weight: var(--bold);
}
.text {
    font-size: var(--ft18);
    text-align: center;
}

/*-- type --*/
.type_swiper {
    width: 100%;
    opacity: 0;
    pointer-events: none;
    transition: opacity .6s ease;
}
.type_swiper.show {
    opacity: 1;
    pointer-events: all;
}
.type_list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--gray-200);
    border-bottom: 1px solid var(--gray-200);
}
.type {
    width: 100%;
    height: 245px;
    padding: 30px;
    border-right: 1px solid var(--gray-200);
    overflow: hidden;
}
.type_inner {
    transition: transform .4s ease;
}
.type.active .type_inner {
    transform: translateY(-38%);
}
.type:nth-child(1),
.type:nth-child(2),
.type:nth-child(3) {
    border-bottom: 1px solid var(--gray-200);
}
.type:nth-child(3n) {
    border-right: none;
}

.type_inner div {
    width: 100%;
}
.type_img {
    width: 80px;
    height: 80px;
    margin-bottom: 30px;
}
.type_title {
    font-size: var(--ft28);
    font-weight: var(--semi-bold);
    margin-bottom: 10px;
}
.type_eng {
    font-size: var(--ft20);
    font-weight: var(--medium);
    margin-bottom: 20px;
}
.type_text {
    font-size: var(--ft18);
}

.sec1 .swiper_pagination {
    /* display: flex; */
    gap: 16px;
    align-items: center;
    justify-content: center;
    display: none;
    opacity: 0;
    transition: opacity .6s ease;
}
.sec1 .swiper_pagination.show {
    opacity: 1;
}
.swiper_btn {
    width: 22px;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.swiper_btn img {
    width: 14px;
    height: 14px;
}
.next_btn {
    transform: rotate(180deg);
}

/*----------------------------- sec2 -----------------------------*/
.sec2 {
    margin-top: 180px;
}
.member_flex {
    margin-top: 80px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 60px;
    align-items: flex-start;
    position: relative;
    opacity: 0;
    transform: translateY(20px);
}
.member_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    flex: 1;
    min-width: 0;
    padding-right: 60px;
    border-right: 1px solid var(--dark-line);
}
.member_side {
    width: calc(((100vw - (100vw - var(--container-md))) - 120px - 80px) / 4);
    display: flex;
    flex-direction: column;
    gap: 40px;
    flex-shrink: 0;
    position: sticky;
    top: 100px;
}
.member_box {
    width: 100%;
    cursor: pointer;
}
.member_side .member_box {
    width: 100%;
}
.member_img {
    width: 100%;
    aspect-ratio: 6 / 7;
    background-color: var(--gray-100);
    position: relative;
    display: flex;
    align-items: end;
    overflow: hidden;
}
.member_img figure {
    width: 100%;
    aspect-ratio: 1 / 1;
}
.member_hover {
    width: 100%;
    height: 100%;
    padding: 24px;
    background-color: rgba(20, 20, 20, 0.9);
    display: flex;
    flex-direction: column;
    justify-content: end;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(100%);
    transition: transform .4s ease;
}
.member_hover p {
    color: var(--white);
    font-weight: var(--medium);
    font-size: var(--ft14);
}
.member_hover .bold {
    font-size: var(--ft20);
    margin-bottom: 10px;
}

.member_text {
    padding: 20px;
    border-bottom: 1px solid var(--dark-line);
}
.name {
    font-size: var(--ft24);
    font-weight: var(--semi-bold);
    margin-bottom: 10px;
}
.position {
    font-size: var(--ft18);
    font-weight: var(--medium);
}

.interpretation {
    height: auto;
}

.member_linebreak {
    display: none;
}

.member_box:hover .member_hover {
    transform: translateY(0);
}



/*----- member_popup -----*/
.member_popup {
    width: 100%;
    height: 100dvh;
    padding: 20px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 15;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: all .3s ease;
}
.member_popup.active {
    opacity: 1;
    pointer-events: all;
}
body:has(.member_popup.active) {
    overflow: hidden;
    height: 100%;
    min-height: 100%;
    touch-action: none;
}
.popup_bg {
    width: 100%;
    height: 100%;
    background-color: rgba(20, 20, 20, .75);
    position: absolute;
    top: 0;
    left: 0;
}
.popup {
    width: 100%;
    max-width: 1400px;
    height: 700px;
    max-height: 80vh;
    padding: 40px;
    background-color: var(--white);
    border-radius: 4px;
    position: relative;
    z-index: 1;
    display: flex;
    gap: 40px;
}
.popup_close {
    width: 36px;
    height: 36px;
    background-color: #909090;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 26px;
    right: 26px;
    z-index: 1;
    cursor: pointer;
}
.popup_close:hover img {
    transform: rotate(180deg);
}
.popup_close img {
    width: 22px;
    height: 22px;
    transition: transform .3s ease;
}
.popup_img {
    width: 45%;
    background-color: var(--gray-100);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    position: relative;
}
.cur_img {
    position: relative;
    width: 100%;
    height: calc(100% - 100px);
    display: flex;
    align-items: end;
    overflow: hidden;
}
.cur_img figure {
    max-height: 100%;
    height: auto;
    object-fit: contain;
}
.cur_img img {
    padding: 40px;
    padding-bottom: 0;
    height: auto !important;
    object-fit: contain;
}
.popup_img .swiper_pagination {
    width: 100%;
    padding: 0 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    top: calc(50% - 30px);
    transform: translateY(-50%);
    z-index: 1;
}
.popup_img .popup_btn {
    filter: brightness(0.5);
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    cursor: pointer;
}
.popup_swiper {
    flex-shrink: 0;
    overflow: hidden;
}
.popup_img_list figure {
    min-width: 60px;
    flex-shrink: 1 !important;
    aspect-ratio: 1 / 1;
    position: relative;
    cursor: pointer;
}
.popup_img_list figure:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(20, 20, 20, .75);
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .2s ease;
}
.popup_img_list figure.on::after {
    opacity: 0;
}

.popup_img_list figure img {
    object-fit: contain;
}

.popup_text_list {
    width: 65%;
    max-width: 700px;
}
.popup_text {
    width: 100%;
    height: 100%;
    /* display: flex; */
    flex-direction: column;
    display: none;
}
.popup_text.show {
    display: flex;
}
.popup_flex {
    width: 100%;
    margin-top: 40px;
    display: flex;
    align-items: start;
}
.popup_l {
    width: 50%;
}
.popup_position {
    font-size: var(--ft18);
    font-weight: var(--bold);
}
.popup_name {
    font-size: var(--ft40);
    font-weight: var(--semi-bold);
    margin: 12px 0;
}
.popup_eng {
    font-size: var(--ft28);
    color: var(--gray-400);
}
.popup_quali {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.popup_quali li {
    display: flex;
    align-items: center;
    gap: 10px;
}
.popup_quali img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}
.popup_quali p {
    font-size: var(--ft16);
    font-weight: var(--medium);
    color: var(--gray-400);
}

.popup_career {
    width: 100%;
    border-radius: 4px;
    background-color: var(--gray-100);
    padding: 30px;
    margin-top: 40px;
    overflow: hidden;
}
.popup_career .scroll {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}
.popup_career .bold {
    font-size: var(--ft24);
    font-weight: var(--semi-bold);
    margin-bottom: 20px;
}


/*----------------------------- sec3 -----------------------------*/
.sec3 {
    margin-top: 180px;
    margin-bottom: 120px;
}
.flex {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

/*-- sns_link --*/
.sns_link {
    width: 100%;
    max-width: 410px;
    margin-top: 80px;
    margin-bottom: 60px;
    opacity: 0;
    transform: translateX(-20px);
}
.sns_link li {
    border-bottom: 1px solid var(--dark-line);
}
.sns_link .sns_link_box {
    padding: 20px;
    display: flex;
    justify-content: space-between;
}
.link_l {
    display: flex;
    align-items: center;
    gap: 20px;
}
.link_img {
    width: 60px;
    height: 60px;
    position: relative;
}
.link_img img {
    transition: opacity .4s ease;
}
.link_img img:first-child {
    position: absolute;
    top: 0;
    opacity: 0;
}
.link_title {
    font-size: var(--ft20);
    font-weight: var(--semi-bold);
    margin-bottom: 4px;
}
.link_text {
    font-size: var(--ft16);
    font-weight: var(--medium);
}
.link_qr {
    width: 60px;
    height: 60px;
}

.sns_link li:hover .link_img img:first-child {
    opacity: 1;
}
.sns_link li:hover .link_img img:last-child {
    opacity: 0;
}

/*-- map --*/
.flex_r {
    width: 100%;
    max-width: 540px;
    opacity: 0;
    transform: translateX(20px); 
}
.map {
    width: 100%;
}
.map .cls-map,
.map .cls-7 {
    stroke-miterlimit: 10;
    stroke-width: .28px;
    fill: #F5F5F5;
    stroke: #D5D4D5;
}
.map .cls-6 {
    fill: var(--gray-400);
    transition: fill .2s ease;
}
.map .cls-3,
.map .cls-4 {
    stroke-miterlimit: 10;
    stroke-width: .57px;
    display: none;
    opacity: 0;
}
.map .cls-4 {
    animation: location 2s ease-in-out infinite; 
    stroke: #c9c9c9;
    fill: none;
}
@keyframes location {
    0% {
        rx: 0;
        ry: 0;
        opacity: 0;
    }
    80% {
        rx: 6.96;
        ry: 2.95;
        opacity: 1;
    }
    100% {
        rx: 6.96;
        ry: 2.95;
        opacity: 0;
    }
}
.map .cls-3 {
    animation: location02 2s 0.2s ease-in-out infinite;
    fill: #c1c1c1; 
    stroke: #939393;
}
@keyframes location02 {
    0% {
        rx: 0;
        ry: 0;
        opacity: 0;
    }
    80% {
        rx: 3.98;
        ry: 1.5;
        opacity: 1;
    }
    100% {
        rx: 3.98;
        ry: 1.5;
        opacity: 0;
    }
}
.map .cls-1 {
    fill: #707070;
    font-family: PretendardVariable-Regular, 'Pretendard Variable';
    font-size: 3.8px;
    font-variation-settings: 'wght' 400;
}
.map .range {
    fill: rgba(0, 0, 0, 0);
}
.map .location.hover .cls-6,
.map .location.action .cls-6 {
    fill: #A61F24;
}
.map .location.action .cls-4,
.map .location.action .cls-3 {
    display: block;
}
.map .location.action {
    pointer-events: none;
}


@media all and (max-width: 1800px) {

    /*-- sec1 --*/
    .type {
        height: 240px;
    }
    .type_title {
        font-size: var(--ft24);
    }
    .type_text {
        font-size: var(--ft16);
    }
    .type.active .type_inner {
        transform: translateY(-39%);
    }
}

@media all and (max-width: 1600px) {

    /*-- sec1 --*/
    .title {
        font-size: var(--ft40);
    }


    .type_list {
        grid-template-columns: repeat(2, 1fr);
    }
    .type {
        height: 198px;
    }
    .type:nth-child(2n -1) {
        border-right: 1px solid var(--dark-line);
    }
    .type:nth-child(2n) {
        border-right: none;
    }
    .type:nth-child(4) {
        border-bottom: 1px solid var(--gray-200);
    }
    .type_img {
        width: 64px;
        height: 64px;
        margin-bottom: 24px;
    }
    .type_title {
        font-size: var(--ft22);
        margin-bottom: 6px;
    }
    .type_eng {
        font-size: var(--ft16);
        margin-bottom: 14px;
    }

    /*-- sec2 --*/
    .sec2 {
        margin-top: 140px;
    }
    .member_box {
        width: calc((100vw - 120px - 80px - 160px) / 4);
    }
    .popup_name {
        font-size: var(--ft36);
        margin: 8px 0;
    }
    .popup_eng {
        font-size: var(--ft24);
    }
    .popup_quali {
        gap: 10px;
    }
    

    /*-- sec3 --*/
    .sec3 {
        margin-top: 140px;
        margin-bottom: 80px;
    }
}

@media all and (max-width: 1400px) {
    /*-- sec2 --*/
    .member_box {
        width: 100%;
    }
    .member_side {
        width: calc((100vw - 120px - 80px - 80px) / 4);
    }
    .cur_img {
        position: relative;
        height: calc(100% - 70px);
    }

    /*-- sec3 --*/
    .flex_r {
        max-width: 500px;
    }
}

@media all and (max-width: 1200px) {
    .sec_eng {
        margin-bottom: 16px;
    }
    .sec_title {
        font-size: var(--ft40);
        margin-bottom: 20px;
    }

    /*-- sec1 --*/
    .type {
        height: 192px;
    }
    .type.active .type_inner {
        transform: translateY(-42%);
    }

    /*-- sec2 --*/
    .member_flex {
        margin-top: 40px;
    }
    .member_list {
        grid-template-columns: repeat(2, 1fr);
    }
    .member_box {
        width: 100%;
    }
    .member_side {
        width: calc((100vw - 120px - 40px - 80px) / 3);
    }

    .popup {
        flex-direction: column;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .popup_close {
        top: 16px;
        right: 16px;
    }
    .popup_img {
        width: 100%;
    }
    .cur_img {
        max-height: 300px;
    }
    .popup_swiper {
        height: 60px;
    }
    .popup_text_list {
        width: 100%;
        max-width: 100%;
    }
    .popup_career {
        padding: 0;
        padding-top: 20px;
        margin-top: 20px;
        background: none;
        border-top: 1px solid var(--dark-line);
    }

    /*-- sec3 --*/
    .flex_r {
        max-width: 450px;
    }
}

@media all and (max-width: 900px) {
    .page {
        padding-bottom: 120px;
    }
    .sec_title {
        font-size: var(--ft32);
    }
    .title_box {
        text-align: center;
    }

    /*-- impact_stats responsive _ 20251022_sec1_plus --*/
    .impact_stats {
        margin-top: 40px;
        padding: 30px 20px;
    }
    
    .stats_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        margin-bottom: 30px;
    }
    
    .stat_item {
        padding: 15px;
    }
    
    .stat_number {
        font-size: 2.5rem;
    }
    
    .stat_label {
        font-size: 1rem;
    }
    
    .highlight_features {
        flex-direction: column;
        gap: 15px;
    }
    
    .feature_item {
        padding: 15px;
    }
    
    .feature_icon {
        font-size: 1.5rem;
    }
    
    .feature_img_icon {
        width: 40px;
        height: 40px;
    }
    
    .feature_text {
        font-size: 1rem;
    }

    /* 성공 사례 버튼 - 모바일 */
    .success-case-section {
        margin-top: 30px;
    }

    .success-case-btn {
        padding: 15px 30px;
        font-size: 1.1rem;
    }

    /*-- sec1 --*/
    .visual_inner {
        gap: 40px;
    }
    .title {
        font-size: var(--ft36);
    }
    .type_swiper {
        overflow: hidden;
    }
    .type_list {
        display: flex;
        border: none;
    }
    .type {
        height: auto;
        border: none !important;
        background-color: rgba(0, 0, 0, .4);
        border-radius: 4px;
    }
    .type_inner {
        height: 100%;
        display: flex;
        align-items: center;
        gap: 40px;
    }
    .type.active .type_inner {
        transform: translateY(0);
    }
    .sec1 .swiper_pagination {
        display: flex;
    }

    /*-- sec2 --*/
    .sec2 {
        margin-top: 100px;
    }
    .member_flex {
        flex-direction: column;
        gap: 20px;
    }
    .member_list {
        grid-template-columns: repeat(3, 1fr);
        flex: none;
        padding-right: 0;
        border-right: none;
        gap: 20px;
    }
    .member_side {
        width: 100%;
        position: static;
        top: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    .member_box {
        width: 100%;
    }
    .member_text {
        padding: 14px;
    }
    .name {
        font-size: var(--ft20);
        margin-bottom: 4px;
    }
    .position {
        font-size: var(--ft16);
    }
    .member_hover {
        display: none;
    }

    .popup {
        padding: 30px;
    }
    .popup_flex {
        margin-top: 0;
    }
    .popup_l {
        width: 100%;
    }
    .popup_name {
        font-size: var(--ft32);
        margin: 6px 0;
    }
    .popup_eng {
        font-size: var(--ft24);
    }
    .popup_quali {
        margin-top: 0;
    }
    .popup_quali img {
        width: 16px;
        height: 16px;
    }

    /*-- sec3 --*/
    .sec3 {
        margin-top: 100px;
        margin-bottom: 60px;
    }
    .flex {
        flex-direction: column;
        gap: 30px;
    }
    .flex_l {
        margin: 0 auto;
    }
    .flex_l .title_box * {
        text-align: center;
    }
    .flex_r {
        max-width: 400px;
        margin: 0 auto;
        transform: translateY(20px);
    }
    .sns_link {
        margin-top: 40px;
        margin-bottom: 40px;
    }

}

@media all and (max-width: 600px) {
    .sec_title {
        font-size: var(--ft28);
    }

    /*-- impact_stats mobile _20251022_sec1_plus--*/
    .impact_stats {
        margin-top: 30px;
        padding: 20px 15px;
    }
    
    .stats_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-bottom: 25px;
    }
    
    .stat_item {
        padding: 12px;
    }
    
    .stat_number {
        font-size: 2rem;
    }
    
    .stat_label {
        font-size: 0.9rem;
    }
    
    .feature_item {
        padding: 12px;
        gap: 10px;
    }
    
    .feature_icon {
        font-size: 1.2rem;
    }
    .feature_img_icon {
        width: 35px;
        height: 35px;
    }
    
    .feature_text {
        font-size: 0.9rem;
    }

    /* 성공 사례 버튼 - 작은 모바일 */
    .success-case-section {
        margin-top: 25px;
    }

    .success-case-btn {
        padding: 14px 25px;
        font-size: 1rem;
        gap: 10px;
    }

    .success-case-btn svg {
        width: 16px;
        height: 16px;
    }

    /*-- sec1 --*/
    .visual_title {
        transform: translateY(40px);
    }
    .title {
        font-size: var(--ft32);
        white-space: pre-line;
    }
    .text {
        font-size: var(--ft16);
    }

    .type {
        padding: 24px;
    }
    .type_inner {
        flex-direction: column;
        gap: 10px;
    }
  

    /*-- sec2 --*/
    .member_list {
        grid-template-columns: repeat(2, 1fr);
    }
    .member_side {
        grid-template-columns: repeat(2, 1fr);
    }

    .popup {
        padding: 20px;
    }
    .popup_close {
        top: 8px;
        right: 8px;
    }
    .popup_flex {
        flex-direction: column;
        align-items: start;
        gap: 20px;
    }
    .cur_img img {
        padding: 20px;
        padding-bottom: 0;
    }
    .popup_position {
        font-size: var(--ft16);
    }
    .popup_name {
        font-size: var(--ft28);
    }
    .popup_eng {
        font-size: var(--ft18);
    }
    .popup_quali {
        gap: 6px;
    }
    .popup_quali img {
        width: 14px;
        height: 14px;
    }
    .popup_quali p {
        font-size: var(--ft14);
    }
    .popup_career .bold {
        font-size: var(--ft18);
        margin-bottom: 10px;
    }
    .popup_career p {
        font-size: var(--ft14);
    }

    /*-- sec3 --*/
    .link_l {
        gap: 10px;
    }
    .link_img {
        width: 40px;
        height: 40px;
    }
    .link_title {
        font-size: var(--ft18);
    }
    .link_text {
        font-size: var(--ft14);
    }
}

@media all and (max-width: 360px) {

    /*-- sec1 --*/
    .title {
        font-size: var(--ft28);
        margin-bottom: 20px;
    }
    .visual_inner {
        gap: 30px;
    }

    /*-- sec2 --*/
    .member_flex,
    .member_list,
    .member_side {
        gap: 10px;
    }
}
