html{overflow-x: hidden;}

/* ._work .sv .flxBx{display: flex;align-items: flex-end;gap: 40px;} */
._work .sv .tabmenu ul{display: flex;gap: 15px; box-sizing: border-box; font-size: 16px; padding-top: calc(60/16*1em); }
._work .sv .tabmenu ul li a{
    display: block;
    border-radius: 25px;
    padding: 0.8em 1.5em;
    box-sizing: border-box;
    font-weight: 600;
    color: #fff;
    border: 1px solid #fff;
    font-family: 'helvetica-lt-pro';
}
._work .sv .tabmenu ul li a.on{
    background-color: var(--red);
    border: 1px solid var(--red);
}


._work .s1{padding: 110px 0;box-sizing: border-box;}

@media screen and (max-width:1024px) {._work .s1{padding: 80px 0;}}
@media screen and (max-width:820px) {._work .s1{padding: 60px 0;}}
@media screen and (max-width:500px) {._work .s1{padding: 40px 0;}}

._work .s1 .list{width: 100%;display: flex;gap: 20px;flex-wrap: wrap;justify-content: center;
    /* row-gap: 110px; */
}
._work .s1 .list .item{display: flex;flex-direction: column;gap: 20px;
    transition: border-radius .3s ease;
    width: calc((100% - (60px * 1)) / 2);
}
._work .s1 .list .item .img{position: relative;width: 100%;transition: border-radius .3s ease;overflow: hidden;}
._work .s1 .list .item:hover .img{border-radius: 30px;overflow: hidden;}
._work .s1 .list .item .img:before{content: '';display: block;padding-bottom: calc(433/768 * 100%);width: 100%;} 
._work .s1 .list .item .img img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
._work .s1 .list .item .titBx{
    display: flex; align-items: center; gap: 20px;
}
.ctgy{display: flex;gap: 6px;}
.ctgy span{
    display: block;font-size: 14px;font-weight: 700;color: #fff;
    white-space: nowrap;
    background-color: var(--red);
    padding: 0.7em 1.1em;
    border-radius: 25px;
    font-family: 'helvetica-lt-pro';
}
._work .s1 .list .item .titBx .desc{
    display: flex;gap: 20px;
    font-size: 18px;font-weight: 600;color: #fff;
    /* padding-bottom: 25px; */
    min-width: 0;
}
._work .s1 .list .item .titBx .desc .brand{min-width: 3em;}
._work .s1 .list .item .titBx .desc .brand p{word-break: break-all;}
._work .s1 .list .item .titBx .desc .txt {min-width: 0;}
._work .s1 .list .item .titBx .desc p{min-width: 0; line-height: 1.3; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

._work .s1 .paging{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 100px;
    gap: 2em;
    font-size: 18px;
}
#last, #first{display: none;}
._work .s1 .paging ul{display: flex;align-items: center;gap: 2.2em;}
._work .s1 .paging ul li{cursor: pointer;}
._work .s1 .paging ul li a{display: block;font-weight: 600;color: #fff;position: relative;}
._work .s1 .paging ul li a.on:before {
    content: '';
    display: block;
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    background-color: var(--red);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}
._work .s1 .paging .prev i,._work .s1 .paging .next i{color: #fff;transition: color .3s ease;cursor: pointer;}
._work .s1 .paging .prev i:hover,._work .s1 .paging .next i:hover{color: var(--red);}


@media screen and (max-width:1680px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
    ._work .sv .flxBx{flex-direction: column;align-items: flex-start;}
    ._work .sv .tabmenu ul li a{font-size: clamp(14px, 14 / 1024 * 100vw, 16px);}

    ._work .s1 .list .item .titBx .desc{font-size: clamp(15px, 15 / 1024 * 100vw, 18px);}
    ._work .s1 .list .item .titBx .ctgy span {font-size: 13px;}


    ._work .s1 .paging {font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
}
@media screen and (max-width:1024px) {
    ._work .sv .tabmenu ul{flex-wrap: wrap;gap: 10px;}
    ._work .sv .tabmenu ul li a{font-size: clamp(13px, 13 / 820 * 100vw, 14px);}
    ._work .s1 .list .item .titBx {flex-direction: column; align-items: flex-start; min-width: 0;}
    ._work .s1 .list .item .titBx .desc{width: 100%;}
    /* ._work .s1 .list .item{width: calc((100% - (20px * 1)) / 2);} */
}
@media screen and (max-width:820px) {
    ._work .s1 .list .item{width: 100%;}

    ._work .s1 .paging{font-size: 15px;gap: 1.5em;}
    ._work .s1 .paging ul{gap: 1.5em;}
    ._work .s1 .paging ul li a.on:before{width: 2em;height: 2em;}

    .ctgy{margin-bottom: 0;}
}
@media screen and (max-width:500px) {
    /* ._work .s1 .list{row-gap: 80px;} */
    ._work .s1 .paging{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._work .s1 .paging ul {gap: 1em;}
    ._work .s1 .paging ul li a.on:before {width: 1.8em;height: 1.8em;}
    ._work .s1 .list .item .titBx{gap: 12px;}
    /* ._work .s1 .list .item .titBx .desc {padding-bottom: 60px;} */
}
@media screen and (max-width:360px) {
    ._work .sv .tabmenu ul li a{font-size: clamp(10px, 10 / 280 * 100vw, 13px);}
    ._work .s1 .paging {font-size: clamp(13px, 13 / 280 * 100vw, 14px);}
    ._work .s1 .list .item .titBx .desc{flex-direction: column;gap: 8px;}
}



/* 뷰페이지 */
.work_view{word-break: keep-all;}
.work_view .s1{padding-bottom: 110px;}
.work_view .wrap .view_top .img{position: relative;}
.work_view .infoBx{display: flex;align-items: flex-start;justify-content: space-between;width: 100%;margin-top: 50px;}

/* .work_view .infoBx .left{width: 100%;} */
.work_view .infoBx .left .tit{font-size: 32px;font-weight: 700;color: #fff;line-height: 1.4375;letter-spacing: -0.025em;max-width: 540px;}

.work_view .infoBx .right{display: flex;flex-direction: column;gap: 60px;max-width: 810px;width: 100%;}
.work_view .infoBx .right .row span{
    font-size: 18px;font-weight: 600;color: #fff;line-height: 1.5;
    letter-spacing: -0.025em;
}

.work_view .infoBx .right .row{display: flex;justify-content: flex-start;align-items: flex-start;gap: 3em;}
.work_view .infoBx .right .row .ctgy{display: flex;flex-direction: column;gap: 10px;align-items: flex-start;}
.work_view .infoBx .right .row .ctgy b{font-size: 18px;font-weight: 700;color: #a9a9a9; letter-spacing: -0.025em;display: block;font-family: 'helvetica-lt-pro';}
.work_view .infoBx .right .row .ctgy div{display: flex;gap: 15px;flex-wrap: wrap;}
.work_view .infoBx .right .row .ctgy div p{
    font-size: 16px;font-weight: 400;color: #fff;font-family: 'helvetica-lt-pro';white-space: nowrap;
}

.work_view .imgArea{margin-top: 130px;display: flex;flex-direction: column;gap: 60px;}
.work_view .imgArea img{height: auto !important;}

.work_view .related{margin-top: 100px;}
.work_view .related ._tit{font-size: 40px;font-weight: 700;color: #fff;line-height: 1.2;letter-spacing: -0.025em;font-family: 'helvetica-lt-pro';margin-bottom: 40px;}

.work_view .related .list{display: flex;gap: 25px;}
.work_view .related .list .item ._info{margin-top: 20px;
    display: flex;align-items: center;justify-content: space-between;
}
.work_view .related .list .item ._info > p{
    font-size: 18px;font-weight: 600;color: #fff;letter-spacing: -0.025em;
    line-height: 1.3;
}

.work_view .related .list .item ._info > div{display: flex;align-items: center;gap: 10px;}
.work_view .related .list .item ._info .dot{
    width: 5px;height: 5px;border-radius: 50%;background-color: var(--red);
}
.work_view .related .list .item ._info .year{
    font-size: 18px;font-weight: 600;color: #fff;letter-spacing: -0.025em;
}
.work_view .related .list .item ._info .ctgy{
    font-size: 18px;font-weight: 600;color: #fff;letter-spacing: -0.025em;background-color: var(--red);padding: 0.4em 1.1em;border-radius: 25px;font-family: 'helvetica-lt-pro';margin-bottom: 0;
}

@media screen and (max-width:1280px) {
    .work_view .infoBx{flex-direction: column;gap: 20px;}
    .work_view .infoBx .right{gap: 30px;}

    .work_view .related .list .item ._info {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }


    .work_view .related .list .item ._info > p{font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
    .work_view .related .list .item ._info .year, .work_view .related .list .item ._info .ctgy{font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
}


@media screen and (max-width:1024px) {
    .work_view .infoBx .left .tit{font-size: clamp(24px, 24 / 820 * 100vw, 32px);}
    .work_view .infoBx .right .row span{font-size: clamp(16px, 16 / 820 * 100vw, 18px);}

    .work_view .infoBx .right .row .ctgy b{font-size: clamp(16px, 16 / 820 * 100vw, 18px);}
    .work_view .infoBx .right .row .ctgy div p{font-size: clamp(14px, 14 / 820 * 100vw, 16px);}

    .work_view .related ._tit{font-size: clamp(32px, 32 / 820 * 100vw, 40px);}
}

@media screen and (max-width:820px) {
    .work_view .infoBx .right{width: 100%;}
    .work_view .infoBx .right .row{flex-wrap: wrap;row-gap: 1em;}

    .work_view .imgArea{margin-top: 80px;gap: 40px;}
    
    .work_view .related{margin-top: 80px;}
    .work_view .related ._tit{font-size: clamp(28px, 28 / 820 * 100vw, 32px);}
    .work_view .related .list{flex-direction: column;gap: 40px;}

    .work_view .infoBx .right .row span{line-height: 1.5;}
}
@media screen and (max-width:500px) {

    .work_view .infoBx .left .tit{font-size: clamp(20px, 20 / 360 * 100vw, 24px);}
    .work_view .infoBx .right .row span{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}

    .work_view .infoBx .right .row .ctgy b{font-size: clamp(15px, 15 / 360 * 100vw, 16px);}
    .work_view .infoBx .right .row .ctgy div p{font-size: clamp(13px, 13 / 360 * 100vw, 14px);}


    .work_view .related ._tit{font-size: clamp(24px, 24 / 360 * 100vw, 28px);}

    .work_view .related .list .item ._info > p{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    .work_view .related .list .item ._info .year, .work_view .related .list .item ._info .ctgy{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
}


/* 영상영역 추가 */
.work_view .videoArea{margin-top: 130px;}
.work_view .videoArea > div {position: relative;}
.work_view .videoArea > div::after{content: '';display: block;padding-bottom: calc(9/16 * 100%);width: 100%;}
