@media screen and (max-width:599px) {

    /* ============================== HERO ============================== */

    .hero {
        margin-top: 15vw;
    }

    .hero_iner {
        padding-top: 15vw;
        padding-bottom: 15vw;
    }

    /* Beyond the Web */
    .blur_txt1 {
        font-size: 9vw;
        padding-left: 0;
        text-align: center;
    }

    .blur_txt1 span {
        font-size: 10vw;
    }

    /* 좌측 패딩 제거 */
    .pd_left {
        padding-left: 0;
    }

    /* 타이틀 영역 */
    .hero_twrap {
        text-align: center;
        align-items: center;
        margin-bottom: 0;
    }


    .hero_twrap .t1 {
        margin-top: 4vw;
    }

    /* 노트북 이미지 - 자연 배치 */
    .hero_notebook {
        position: relative;
        width: 70vw;
        top: unset;
        right: unset;
        left: unset;
        bottom: unset;
        margin-bottom: -7vw;
        margin-right: -21vw;
    }

    /* 통계 네비 - relative 가운데, 2x2 flex-wrap */
    .hero_nav_wrap {
        position: relative;
        right: unset;
        top: unset;
        left: unset;
        bottom: unset;
        flex-wrap: wrap;
        width: 95vw;
        height: auto;
        padding: 2vw 2vw;
        gap: 2vw;
        border-radius: 5vw;
        justify-content: center;
        margin-bottom: 4vw;
    }

    .hero_nav {
        width: calc((100% - 2vw) / 2);
        height: 10vw;
        padding: 0 3vw;
        gap: 2vw;
        font-size: 3.5vw;
        color: #000;
    }

    div.hero_nav_txt {
        font-size: 3vw;
        width: auto;
        bottom: auto;

        top: -13.7vw;
        right: auto;
        left: 3.9vw;
        text-align: left;
    }


    /* 박스 공통 */
    .box_wd {
        width: 95vw;
    }

    .bdrd {
        border-radius: 5vw;
    }

    .box_mg {
        margin-bottom: 3vw;
    }



    /* hero_box1 - 카테고리 + 갤러리 */
    .hero_box1 {
        padding-top: 8vw;
        padding-bottom: 8vw;
        position: relative;
    }

    /* 모바일 드롭다운 토글 (PC에서는 숨김) */
    .hero_box1_tab_toggle {
        display: flex;
        align-items: center;
        width: calc(100% - 10vw);
        height: 11vw;
        margin: 0 5vw 4vw;
        padding: 0 6vw;
        border: 1px solid #b9b9b9;
        border-radius: 999px;
        font-size: 3.5vw;
        font-weight: 500;
        cursor: pointer;
        user-select: none;
        position: relative;
        z-index: 11;
    }

    .hero_box1_tab_toggle_prefix {
        color: #999;
        font-weight: 400;
    }

    .hero_box1_tab_toggle_divider {
        color: #ccc;
        font-weight: 400;
        margin: 0 2.5vw;
    }

    .hero_box1_tab_toggle_label {
        color: #000;
        font-weight: 600;
    }

    .hero_box1_tab_toggle_arrow {
        width: 2vw;
        height: 2vw;
        border-right: 1.5px solid #777;
        border-bottom: 1.5px solid #777;
        transform: rotate(45deg) translateY(-30%);
        transition: transform 0.3s ease;
        margin-left: auto;
    }

    .hero_box1_tab_toggle.open .hero_box1_tab_toggle_arrow {
        transform: rotate(-135deg) translateY(-30%);
    }

    /* 드롭다운 패널 (absolute - 레이아웃에 영향 없음) */
    .hero_box1_tab_wrap {
        position: absolute;
        top: 21vw;
        left: 5vw;
        right: 5vw;
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 2vw 0;
        margin: 0;
        background: #fff;
        border-radius: 4vw;
        box-shadow: 0 1vw 4vw rgba(0, 0, 0, 0.08);
        opacity: 0;
        transform: translateY(-2vw);
        pointer-events: none;
        transition: opacity 0.25s ease, transform 0.25s ease;
        z-index: 10;
    }

    .hero_box1_tab_wrap.open {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* 드롭다운 옵션 */
    .hero_box1_tab {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        height: 11vw;
        padding: 0 6vw;
        background: none;
        border: none;
        border-radius: 0;
        font-size: 3.5vw;
        color: #999;
        font-weight: 400;
    }

    .hero_box1_tab::before {
        content: "";
        display: block;
        width: 1.8vw;
        height: 1.8vw;
        border-radius: 50%;
        background: #ddd;
        margin-right: 3vw;
        flex-shrink: 0;
        transition: background 0.2s ease;
    }

    .hero_box1_tab.on {
        background: none;
        color: #000;
        font-weight: 600;
    }

    .hero_box1_tab.on::before {
        background: #3235cd;
    }

    /* 갤러리 2열 */

    .hero_tab_content_wrap {
        min-height: 155vw;
    }

    .hero_tab_content {
        padding: 0 3vw;
        gap: 2vw;
    }

    .hero_tab_item {
        width: 100%;
        aspect-ratio: 466 / 356;
        height: unset;
    }

    .hero_tab_item_overlay {
        opacity: 1;
        top: 2vw;
        left: 2vw;
        width: auto;
        height: auto;
        background: #fff;
        border: 1px solid #000;
        border-radius: 999px;
        color: #000;
        padding: 1vw 3vw;

        display: none;
    }

    .hero_tab_item_overlay>p {
        font-size: 3.3vw;
        color: #000;
    }

    .hero_content_vm_btn {
        width: 87vw;
        height: 11vw;
        margin-top: 6vw;
        font-size: 3.5vw;
    }

    /* hero_box2 - 클라이언트 */
    .hero_box2 {
        flex-direction: column;
        padding: 12vw 0 2vw;
    }

    .hero_box2_twrap {
        margin-left: 0;
        margin-bottom: 8vw;
        align-items: center;
        text-align: center;
    }

    .hero_box2_content {
        width: 100%;
        height: 60vw;
        padding: 0;
    }

    .hero_box2_track {

        row-gap: 2vw;
    }

    .hero_box2_vsd {
        width: 100%;
        justify-content: center;
        gap: 5vw 2vw;
    }

    .hero_box2_vimg {
        width: 28vw;
    }

    /* ============================== CON01 - WHY V IN THE WEB ============================== */

    .con01_iner {
        padding-top: 15vw;
    }

    .con01_twrap {
        align-items: center;
        text-align: center;
    }

    .con01_box_wrap {
        padding: 0 5vw;
        justify-content: center;
        gap: 3vw;
        margin-top: 8vw;
    }

    .con01_box {
        width: 90vw;
        height: auto;
        min-height: 45vw;
        border-radius: 5vw;
        padding: 6vw;
    }

    .con01_box.item1,
    .con01_box.item2,
    .con01_box.item3 {
        transform: none;
    }

    .con01_box_number {
        width: 11.6vw;
        font-size: 3.8vw;
    }

    .con01_box_t1 {
        font-size: 4.5vw;
        margin-top: 3vw;
        margin-bottom: 2vw;
    }

    .con01_box_t2 {
        font-size: 3.3vw;
    }

    .con01_box_t3 {
        font-size: 3vw;
        margin-top: 6vw;
        opacity: 0.4;
    }

    .con01_box_icon {
        top: 15vw;
        right: -1vw;
    }

    .con01_box_icon1,
    .con01_box_icon2,
    .con01_box_icon3,
    .con01_box_icon4 {
        width: 35%;
    }

    .con01_box_txt {
        position: static;
        font-size: 3.8vw;
        margin-bottom: 2vw;
    }

    /* ============================== CON02 - PROCESS ============================== */

    .con02_iner {
        padding-top: 15vw;
    }

    /* 세로 스택. 상담 / phase1 / phase2 사이를 크게 띄워 3개씩 묶임 표현 */
    .con02_circle_wrap {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;
        gap: 9vw;
        padding: 18vw 5vw;
    }

    /* 그룹 래퍼 활성화 - 그룹 내 박스는 좁은 간격 */
    .con02_phase {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1.5vw;
        width: 100%;
    }

    /* 모든 박스 균일 너비 - move_right/left/z10 오버라이드 일괄 무력화.
       position:relative + 높은 z-index로 위 레이어 차지 (PC의 흰 배경이 인접 강조 박스의 글로우를 가려줌) */
    .con02_circle,
    .con02_circle.move_right,
    .con02_circle.move_left,
    .con02_circle.z10.box_sdw2 {
        width: 76vw;
        aspect-ratio: unset;
        height: auto;
        border-radius: 4vw;
        padding: 5vw 0;
        margin: 0;
        transform: none;
        position: relative;
        z-index: 20;
    }

    /* 강조 박스(디자인/런칭) - 보라 글로우가 위/아래 인접 박스에 가려지도록 한 칸 뒤로 */
    .con02_circle.z10.box_sdw2 {
        z-index: 10;
    }

    .con02_circle .t1 {
        font-size: 4.3vw;
        margin-bottom: 1vw;
    }

    .con02_circle .t2 {
        font-size: 3.5vw;
    }

    /* BEGIN/CARE 라벨 - 짧은 세로선으로 시작/끝 연결감 */
    .con02_circle_txt {
        flex-direction: column;
        font-size: 3.8vw;
        gap: 1vw;
    }

    .con02_circle_txt.begin {
        left: 50%;
        top: 4vw;
        transform: translateX(-50%);
    }

    .con02_circle_txt.care {
        left: 50%;
        right: unset;
        bottom: 4vw;
        transform: translateX(-50%);
    }

    .con02_circle_txt.begin::after,
    .con02_circle_txt.care::before {
        width: 1px;
        height: 6vw;
    }

    .con02_twrap2 {
        margin-top: 5vw;
        margin-bottom: 0;
    }

    .con02_twrap2 .t1 {
        margin-bottom: 6vw;
    }

    /* .con02_twrap2 .t1 br {
        display: none;
    } */


    /* ============================== CON03 - BEYOND THE EXPECTATION ============================== */

    .con03_iner {
        padding-bottom: 15vw;
    }

    .con03_video {
        aspect-ratio: 16 / 9;
        height: unset;
        order: 1;
        margin-top: 6vw;
    }

    .con03_video iframe {
        position: absolute;
        width: 110%;
        height: 110%;
    }

    .con03_twrap {
        margin-top: 15vw;
        padding-top: 15vw;
        align-items: center;
        text-align: center;
        border-top: 1px solid #2e2e2e;
    }

    .con03_blur_txt {
        margin-top: 4vw;
        font-size: 8vw;
        line-height: 1;
    }

    /* ============================== CON04 ============================== */

    .con04_iner {
        padding-top: 14vw;
        padding-bottom: 15vw;
    }

    /* box1 + box2 가로 → 세로 스택 */
    .con04_box_wrap {
        flex-direction: column;
        gap: 3vw;
    }

    .con04_box_wrap>div {
        width: 100%;
        height: auto;
    }

    /* -------- BOX1 : Floor list -------- */
    .con04_box1 {
        min-height: 100vw;
    }

    .con04_floor_wrap {
        left: 5vw;
        top: 5vw;
        width: 38vw;
        height: 90vw;
        padding: 6vw 0 6vw 3vw;
        border-radius: 5vw;
    }

    .con04_floor {
        gap: 3vw;
        font-size: 3.3vw;
    }

    .con04_floor p:first-child {
        width: 6vw;
    }

    /* -------- BOX2 : About V + 가로 스와이퍼 -------- */
    .con04_box2 {
        padding: 12vw 0 2vw;
    }

    /* .con04_box2::after{
        content: '';
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 1px;
        height: 100%;
        background: #000;
    } */

    .con04_box2_twrap {
        align-items: center;
        text-align: center;
        padding: 0;
    }

    .con04_box2_twrap .mg_top {
        margin-top: 4vw;
    }

    .con4_03 {
        display: none;
    }


    .con04_swiper_wrap {
        margin-top: 8vw;
        flex-direction: column;
    }

    .con04_swiper {
        width: 100%;
    }

    .con04_sitem {
        width: 63vw;
    }

    .con04_swiper_btn_img {
        width: 42%;
        margin-left: 3.2vw;
        position: static;
        margin-top: 4vw;
    }

    .con04_swiper_btn {
        position: absolute;
        width: 40%;
        height: 19%;
        z-index: 10;
        display: flex;
        justify-content: center;
        align-items: center;
        bottom: 5vw;
    }

    /* -------- BOX3 : TEAM V -------- */
    .con04_box3 {
        padding-top: 12vw;
        padding-bottom: 8vw;
    }

    /* TEAM 카테고리 라벨 - 무한 가로 마퀴 (GSAP, 블루박스 반대방향) */
    .con04_label_wrap {
        order: 2;
        width: 95vw;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center;
        padding: 0;
        margin-top: 2vw;
        overflow: hidden;
    }

    .con04_label_wrap_track,
    .con04_label_wrap_set {
        display: flex;
        align-items: center;
        flex-shrink: 0;
        gap: 2vw;
    }

    .con04_label_wrap_track {
        padding-left: 2vw;
    }

    .con04_label_txt,
    .con04_label_txt.item1,
    .con04_label_txt.item2,
    .con04_label_txt.item3,
    .con04_label_txt.item4,
    .con04_label_txt.item5 {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
        flex-shrink: 0;
        height: 7.5vw;
        padding: 0 3vw;
        font-size: 3.5vw;
        white-space: nowrap;
    }

    /* 팀 카드 */
    .team_sitem {
        width: 24vw;
        border-radius: 4vw;
        padding-top: 3vw;
    }

    .team_img {
        width: 13vw;
    }

    .team_name {
        font-size: 2.5vw;
        margin-top: 2.2vw;
    }

    .team_swiper1 {
        width: 100%;
    }

    .team_swiper2 {
        width: 100%;
        display: none;
    }

    .team_swiper1.last {
        display: none;
    }


    .team_swiper.mg {
        margin-bottom: 3vw;
    }

    .team_swiper.pdt {
        padding-top: 8vw;
    }

    .team_swiper.pd {
        padding-bottom: 4vw;
    }

    /* 블루 박스 (서비스 리스트) - 무한 가로 마퀴 (GSAP) */
    .con04_blue_box {
        width: 95vw;
        height: auto;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center;
        padding: 0;
        background: none;
        background-color: transparent;
        color: #3235cd;
        font-size: 3.3vw;
        border-radius: 0;
        overflow: hidden;
    }

    .con04_blue_box_track,
    .con04_blue_box_set {
        gap: 2vw;
    }

    .con04_blue_box_track {
        padding-left: 2vw;
    }

    .con04_blue_box p {
        flex-shrink: 0;
        padding: 2.2vw 4.5vw;
        border-radius: 0;
        background: #3235cd;
        border: none;
        color: #fff;
        white-space: nowrap;
        line-height: 1;
    }



    .con04_box3 .last_label {
        order: 3;
        margin-top: 8vw;
    }

    /* -------- BOX4 : V-CHAT -------- */
    .con04_box4 {
        height: auto;
        padding-top: 12vw;
    }

    .con04_box4_shadow {
        width: 120vw;
        height: 100vw;
        bottom: -40vw;
        right: auto;
    }

    .con04_twrap {
        position: relative;
        top: auto;
        left: auto;
        align-items: center;
        text-align: center;
    }

    .con04_twrap .title_txt {
        margin-bottom: 4vw;
    }

    .tel_box {
        width: 40vw;
        height: 11vw;
        font-size: 3.5vw;
        gap: 2vw;
        margin-top: 4vw;
    }

    .con04_v {
        width: 55%;
        top: 25vw;
        /* bottom: 5vw; */
        right: -10vw;
    }

    .con04_chat_bg {
        width: 80%;
        bottom: 0;
        right: 10vw;

        display: none;
    }

    .con04_chat {
        position: relative;
        width: 87vw;
        height: 100vw;
        margin-top: 8vw;
        right: auto;
        bottom: auto;
        border-radius: 4vw 4vw 0 0;
    }

    /* ============================== CON05 ============================== */

    .con05 {
        background-color: #1315b7;
        position: relative;
        overflow: hidden;
    }

    .con05::before {
        content: '';
        position: absolute;
        inset: 0;
        background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        background-size: 200px 200px;
        background-repeat: repeat;
        pointer-events: none;
        z-index: 1;
        animation: con05_noise_static 0.5s step-end infinite;
    }

    @keyframes con05_noise_static {
        0% {
            background-position: 0 0;
        }

        16% {
            background-position: -37px 53px;
        }

        32% {
            background-position: 81px -29px;
        }

        48% {
            background-position: -58px -77px;
        }

        64% {
            background-position: 63px 41px;
        }

        80% {
            background-position: -91px 17px;
        }

        100% {
            background-position: 0 0;
        }
    }

    .con05>.bg_img {
        display: none;
    }

    .con05_iner {
        padding-top: 15vw;
    }

    .con05_blur_txt .mg_left {
        margin-left: 0;
    }

    .con05_twrap {
        margin-top: 6vw;
        align-items: center;
        text-align: center;
    }


    /* box_wrap - 풀폭 가운데 */
    .con05_box_wrap {
        width: 95vw;
        margin-top: 5vw;
        margin-right: 0;
        align-items: center;
    }

    /* STEP 박스들 */
    .con05_box1 {
        height: auto;
        min-height: 100vw;
        padding: 8vw 5vw;
        padding-right: 7vw;
        margin-bottom: 3vw;
    }

    .con05_box2 {
        height: auto;
        min-height: 60vw;
        padding: 8vw 5vw;
    }

    /* STEP 인디케이터 - 현재 스텝만 노출, 라인 제거 */
    .con05_box_step {
        position: static;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

    .con05_box_step>p {
        font-size: 5.5vw;
    }

    .con05_box_step>p:not(.on) {
        display: none;
    }

    .con05_box_step .line {
        display: none;
    }

    /* 메일 폼 - absolute → static, 풀폭 컬럼 스택 */
    .mail_form {
        position: static;
        width: 100%;
        font-size: 3.5vw;
        align-items: stretch;
    }

    .mail_form_gap {
        gap: 8vw;
        margin-top: 6vw;
    }

    /* 한 행: 라벨(상단 풀폭) → 인풋 + form_txt 인라인 (줄바뀜 없음) */
    .form_row {
        position: relative;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        height: auto;
        min-height: unset;
        padding-left: 3.5vw;
        gap: 2vw;
        text-align: left;
    }

    .form_row .req {
        position: absolute;
        left: 0;
        top: 0;
        font-size: 3.3vw;
    }

    .form_label {
        width: 100%;
        text-align: left;
        padding-left: 0;
        font-size: 3.8vw;
        line-height: 1.4;
    }

    /* 필러 텍스트(의 / 입니다.) - 인풋 바로 오른쪽 인라인 */
    .form_txt {
        display: inline-flex;
        align-items: center;
        white-space: nowrap;
        font-size: 3.5vw;
    }

    .form_input {
        flex: 1 1 0;
        width: auto;
        min-width: 25vw;
        padding: 1.3vw 2vw;
        font-size: 3.5vw;
        text-align: left;
    }

    .form_input::placeholder {
        text-align: left;
    }

    /* 라디오 그룹 - 라벨 아래 가로 정렬 */
    .form_row_radio {
        margin-top: 2vw;
    }

    .form_row_radio .form_radio_wrap {
        flex-direction: row;
        width: 100%;
        gap: 2vw;
    }

    .form_radio_btn {
        flex: 0 0 auto;
        padding: 0 5vw;
        height: 10vw;
        border-radius: 5vw;
        font-size: 3.5vw;
    }

    .form_row_radio .form_radio_btn {
        flex: 1 1 0;
        padding: 0;
    }

    .form_label1,
    .form_label2 {
        width: 100%;
    }

    .form_step2_title {
        margin-bottom: 6vw;
        font-size: 3.8vw;
        padding-left: 0;
        text-align: center;
        margin-top: 2vw;
    }

    .form_check_wrap {
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 2vw;
        width: 100%;
    }

    .form_check_wrap .form_radio_btn {
        width: calc((100% - 2vw) / 2);
        padding: 0;
        height: 10vw;
        font-size: 3.3vw;
    }

    /* 동의 + 전송 */
    .mail_agree {
        gap: 2vw;
        font-size: 3.3vw;
        margin-top: 5vw;
        margin-bottom: 4vw;
    }

    .agree_check {
        width: 5vw;
    }

    .agree_check:checked {
        box-shadow: inset 0 0 0 0.6vw #adacdf;
    }

    .agree_txt {
        font-size: 3.3vw;
    }

    .mail_submit {
        width: 85vw;
        height: 11vw;
        font-size: 3.8vw;
    }

    /* last_box */
    .last_box {
        aspect-ratio: unset;
        height: 60vw;
        margin-top: 12vw;
        margin-bottom: 12vw;
    }

    .last_box .last_label {
        bottom: 5vw;
    }

    .last_box .title_txt {
        font-size: 6vw;
    }

    .last_box .bg_img {
        filter: brightness(0.6);
    }

}