@charset "UTF-8";
:root{
    --dtl-header-space: 0px;
}

html,
body{position: relative;overflow-x: hidden;}

::-webkit-scrollbar{width: 7px;display: none;}
::-webkit-scrollbar-track{background:var(--color-black);}
::-webkit-scrollbar-thumb{background:var(--color-green);border-radius:999px;box-shadow:0 0 8px rgba(165,251,81,0.55);}
::-webkit-scrollbar-thumb:hover{background:#c2ff7a;box-shadow:0 0 10px rgba(165,251,81,0.85);}

body{background-color: #000;}

#smooth-wrapper {overflow: hidden;}
#smooth-content {overflow: visible;width: 100%;}


/* ================================== S::list  ========================================  */
.project_list_component{width: 100%;max-width: 1920px;min-height: 100dvh;margin: 0 auto;padding: 192px 20px;}
.project_list_component .project_list_box{position: relative;}

.project_list_component #projectCateList{display: flex;align-items: flex-start;justify-content: flex-end;flex-wrap: no-wrap;gap: 12px;}
.project_list_component #projectCateList .project_cate_item{}
.project_list_component #projectCateList .project_cate_item .item_inner{}
.project_list_component #projectCateList .project_cate_item .project_cate{}
.project_list_component #projectCateList .project_cate_item .project_cate .cate_name{display: inline-block;font-size: var(--fs-16);font-weight: 400;line-height: var(--lh-20);color: var(--color-white);transition:text-shadow .25s ease,color .25s ease;}
.project_list_component #projectCateList .project_cate_item:hover .project_cate .cate_name{color: var(--color-green);text-shadow:.45px 0 0 currentColor,-.45px 0 0 currentColor,0 .45px 0 currentColor,0 -.45px 0 currentColor;}
.project_list_component #projectCateList .project_cate_item.is_active .project_cate .cate_name{color: var(--color-green);text-shadow:.45px 0 0 currentColor,-.45px 0 0 currentColor,0 .45px 0 currentColor,0 -.45px 0 currentColor;}

.project_list_component .project_cate_box + .project_list_box{margin-top: 24px;}
.project_list_component #projectList{display: flex;align-items: stretch;flex-wrap: wrap;column-gap: 56px;row-gap: 64px;}
.project_list_component #projectList .project_item{width: calc((100%/3) - ((56px*2)/3));opacity: 0;transform: translateY(80px);}
.project_list_component #projectList .project_item .item_inner{width: 100%;height: 100%;will-change:transform,opacity;}

.project_list_component #projectList .project_item .item_hd{}
.project_list_component #projectList .project_item .item_thumb_box{width: 100%;height: 0;padding-top: 56.25%;position: relative;overflow: hidden;}
.project_list_component #projectList .project_item .item_thumb_box .item_thumb{display: block;width: 100%;height: 100%;position: absolute;inset: 0;z-index: 1;}
.project_list_component #projectList .project_item .item_thumb_box .item_thumb img{width: 100%;height: 100%;object-fit: cover;object-position: center top;transition: transform .45s;}
.project_list_component #projectList .project_item .item_thumb_box:hover  .item_thumb img{transform: scale(1.08);}

.project_list_component #projectList .project_item .item_bd{}
.project_list_component #projectList .project_item .item_hd + .item_bd{margin-top: 16px;}
.project_list_component #projectList .project_item .item_subject_box{}
.project_list_component #projectList .project_item .item_subject_box .item_subject_link{display: inline-block;line-height: 0;}
.project_list_component #projectList .project_item .item_subject_box .item_subject{font-size: var(--fs-18);font-weight: 500;line-height: var(--lh-26);color: var(--color-white);text-transform: capitalize;}

.project_list_component #projectList .project_item.empty_project_item{width: 100%;padding: 144px 16px;overflow: hidden;}
.project_list_component #projectList .project_item.empty_project_item .item_inner{width: 100%;display: flex;align-items: center;justify-content: center;}
.project_list_component #projectList .project_item.empty_project_item .item_subject_box .item_subject{font-size: var(--fs-32);font-weight: 700;line-height: var(--lh-40);}


.project_list_component .project_list_box + .project_paging_box{margin-top: 48px;}

@media (max-width: 1280px){
    .project_list_component #projectList{column-gap: 48px;row-gap: 56px;}
    .project_list_component #projectList .project_item{width: calc((100%/2) - ((48px/2)));}
}
@media (max-width: 1080px){
    .project_list_component{padding: 128px 20px;}

    .project_list_component #projectList{column-gap: 32px;row-gap: 48px;}
    .project_list_component #projectList .project_item{width: calc((100%/2) - ((32px/2)));}

    .project_list_component #projectList .project_item.empty_project_item .item_subject_box .item_subject{font-size: var(--fs-28);line-height: var(--lh-36);}
    
}
@media (max-width: 768px){
    .project_list_component #projectList{column-gap: 24px;row-gap: 48px;}
    .project_list_component #projectList .project_item{width: calc((100%/2) - ((24px/2)));}

    .project_list_component #projectList .project_item .item_hd + .item_bd{margin-top: 12px;}
    .project_list_component #projectList .project_item .item_subject_box .item_subject{font-size: var(--fs-16);line-height: var(--lh-24);}
    
}
@media (max-width: 600px){
    .project_list_component{padding: 96px 20px;}
    .project_list_component #projectList{column-gap: 0;row-gap: 32px;}
    .project_list_component #projectList .project_item{width: 100%;}

    .project_list_component #projectList .project_item .item_hd + .item_bd{margin-top: 8px;}
    .project_list_component #projectList .project_item .item_subject_box .item_subject{font-size: var(--fs-14);line-height: var(--lh-20);}

    .project_list_component #projectList .project_item.empty_project_item .item_subject_box .item_subject{font-size: var(--fs-20);line-height: var(--lh-28);}

    .project_list_component .project_list_box + .project_paging_box{margin-top: 24px;}

}


.project_paging_box .paging_wrap{display: flex;align-items: center;justify-content: center;flex-wrap: nowrap;column-gap: 8px;width: 100%;padding: 48px 0 24px;box-sizing: border-box;}
.project_paging_box .paging_wrap .paging_btns_box{display: flex;align-items: center;justify-content: center;flex-wrap: nowrap;line-height: 0;}
.project_paging_box .paging_wrap .paging_btns_box .paging_btns{display: inline-block;line-height: 0;}
.project_paging_box .paging_wrap .paging_btns_box .paging_btns .icon_pg_box{display: inline-block;width: 24px;height: 24px;pointer-events: none;}
.project_paging_box .paging_wrap .paging_btns_box .paging_btns .icon_pg_box svg{width: 100%;height: 100%;pointer-events: none;}
.project_paging_box .paging_wrap .paging_btns_box .paging_btns .icon_pg_box svg path{stroke: var(--color-white);transition: stroke .2s;}
.project_paging_box .paging_wrap .paging_btns_box .paging_btns:hover .icon_pg_box svg{filter:drop-shadow(0 0 3px rgba(255,255,255,.9)) drop-shadow(0 0 9px rgba(255,255,255,.75)) drop-shadow(0 0 18px rgba(255,255,255,.55)) drop-shadow(0 0 30px rgba(255,255,255,.35));}
/* .project_paging_box .paging_wrap .paging_btns_box .paging_btns:hover .icon_pg_box svg path{stroke: var(--color-green);} */

.project_paging_box .paging_wrap .paging_numb_list{display: flex;align-items: center;justify-content: center;flex-wrap: nowrap;column-gap: 4px;}
.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item{}
.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box{display: inline-flex;align-items: center;justify-content: center;width: 24px;height: 24px;}
.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box.is_current{}
.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box .paging_numb{display: inline-block;font-size: var(--fs-16);font-weight: 400;line-height: var(--lh-20);color: var(--color-white);transition: text-shadow .2s;}



.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box:not(.is_current):hover .paging_numb{color:var(--color-white);text-shadow:.45px 0 0 currentColor,-.45px 0 0 currentColor,0 .45px 0 currentColor,0 -.45px 0 currentColor,0 0 6px rgba(255,255,255,.45),0 0 14px rgba(255,255,255,.35);}
.project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box.is_current .paging_numb{color:var(--color-green);text-shadow:.45px 0 0 currentColor,-.45px 0 0 currentColor,0 .45px 0 currentColor,0 -.45px 0 currentColor,0 0 6px rgba(255,255,255,.45),0 0 14px rgba(255,255,255,.35);}

@media (max-width: 1680px){
}
@media (max-width: 1440px){
}
@media (max-width: 1280px){
}
@media (max-width: 1080px){
}
@media (max-width: 768px){
}
@media (max-width: 600px){
    .project_paging_box .paging_wrap{column-gap: 2px;}
    .project_paging_box .paging_wrap .paging_numb_list{column-gap: 0;}
    .project_paging_box .paging_wrap .paging_btns_box .paging_btns .icon_pg_box{width: 20px;height: 20px;}
    .project_paging_box .paging_wrap .paging_numb_list .paging_numb_item .paging_numb_box .paging_numb{font-size: var(--fs-14);}
}
@media (max-width: 360px){
}


/* @media (max-width: 1280px){
    
}
@media (max-width: 1080px){
    
}
@media (max-width: 768px){
    
}
@media (max-width: 600px){

} */


/* ================================== E::list  ========================================  */



/* ================================== S::detail  ========================================  */
.project_detail_component{}
.project_detail_component #projectDtlWrap{}

#projectDtlWrap .dtl_btns_box{width: 100%;max-width: 1920px;margin: 0 auto;padding: 80px 100px;display: flex;align-items: center;justify-content: center;}
#projectDtlWrap .dtl_btns_box .dtl_btns{}
#projectDtlWrap .dtl_btns_box .dtl_btns .btns_name{display: inline-block;font-size: var(--fs-30);font-weight: 500;line-height: var(--lh-42);color: var(--color-white);transition: text-shadow .25s;}
#projectDtlWrap .dtl_btns_box .dtl_btns:hover .btns_name{text-shadow: .45px 0 0 currentColor, -.45px 0 0 currentColor, 0 .45px 0 currentColor, 0 -.45px 0 currentColor, 0 0 6px rgba(255,255,255,.45), 0 0 14px rgba(255,255,255,.35);}
#projectDtlWrap .dtl_btns_box .dtl_btns .btns_name .txt_arrow{display: inline-block;font-size: var(--fs-30);font-weight: 500;line-height: var(--lh-42);color: var(--color-white);transform: translateX(0);transition: transform .25s;}
#projectDtlWrap .dtl_btns_box .dtl_btns:hover .btns_name .txt_arrow{transform: translateX(-5px);}


/* ================================== S::detail tamplete 01  ========================================  */
#projectDtlWrap .dtl_tmp_01{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .sect_inner{width: 100%;max-width: 1920px;margin: 0 auto;padding: 128px 0;box-sizing: border-box;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_img_box{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_img_box .top_img_box{width: 100%;aspect-ratio: 1440 / 960;line-height: 0;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_img_box .top_img_box img{width: 100%;height: 100%;object-fit: cover;object-position: center;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_img_box .img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_img_box .img_box img{width: 100%;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_vod_box .vod_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_vod_box .vod_box video{width: 100%;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{position: relative;width: 100%;max-width: 1100px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup > img{display: block;width: 100%;height: auto;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_screen{position: absolute;left: 4.1%;top: 5%;width: 91.8%;height: 62.2%;overflow: hidden;background: #000;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_screen .mockup_vod{display: block;width: 100%;height: 100%;object-fit: cover;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect01 .sect_inner{max-width: 100%;padding-top: 0;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .sect_inner{padding: 32px 64px;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box{display: inline-flex;flex-direction: column;align-items: flex-end;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-48);font-weight: 500;line-height: var(--lh-56);color: var(--color-white);}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box + .cate_box{margin-top: 48px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-32);font-weight: 500;line-height: var(--lh-40);color: var(--color-green);}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_bottom_box{}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box + .txt_bottom_box{margin-top: 304px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box{text-align: right;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-24);font-weight: 500;line-height: var(--lh-34);color: var(--color-white);}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box,
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box,
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box{overflow:hidden;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .dtl_tit,
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .dtl_cate{display:block;will-change:transform,opacity;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .dtl_desc_stack{display:block;will-change:transform;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .dtl_desc{display:block;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect04 .dtl_vod_box .vod_box{text-align: right;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .sect_inner{padding: 128px 64px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .dtl_img_box .img_box{border-radius: 10px;overflow: hidden;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .dtl_img_box .img_box + .img_box{margin-top: 72px;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .sect_inner{max-width: 1440px;padding: 128px 64px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list{display: flex;justify-content: center;gap: 80px;flex-wrap: nowrap;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item{width: calc((100%/4) - (240px/4));}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(2){margin-top: 250px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(3){margin-top: 100px;}
#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(4){margin-top: 180px;}

#projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_box{border-radius: 10px;overflow: hidden;}


@media (max-width: 1920px){}
@media (max-width: 1680px){}
@media (max-width: 1440px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{max-width: 1024px;}
}
@media (max-width: 1280px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{max-width: 768px;}
}
@media (max-width: 1080px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .sect_inner{padding: 96px 0;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .sect_inner{padding: 24px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box + .txt_bottom_box{margin-top: 144px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .sect_inner{padding: 96px 24px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .sect_inner{padding: 96px 24px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list{gap: 48px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item{width: calc((100%/4) - (144px/4));}

    #projectDtlWrap .dtl_btns_box{padding: 64px 24px;}
}
@media (max-width: 960px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{max-width: 480px}
}
@media (max-width: 768px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-28);line-height: var(--lh-36);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box + .cate_box{margin-top: 24px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-20);line-height: var(--lh-28);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box + .txt_bottom_box{margin-top: 128px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-20);line-height: var(--lh-28);}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .dtl_img_box .img_box + .img_box{margin-top: 48px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list{gap: 32px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item{width: calc((100%/4) - (96px/4));}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(2){margin-top: 200px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(3){margin-top: 50px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(4){margin-top: 130px;}

    #projectDtlWrap .dtl_btns_box .dtl_btns .btns_name{font-size: var(--fs-20);line-height: var(--lh-28);}
}
@media (max-width: 640px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .sect_inner{padding: 64px 0;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .sect_inner{padding: 0 16px 16px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-20);line-height: var(--lh-28);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box + .cate_box{margin-top: 8px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-14);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box + .txt_bottom_box{margin-top: 72px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-14);line-height: var(--lh-20);}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{max-width: 320px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect05 .sect_inner{padding: 64px 16px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .sect_inner{padding: 64px 16px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list{gap: 20px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item{width: calc((100%/4) - (60px/4));}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(2){margin-top: 140px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(3){margin-top: 30px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(4){margin-top: 80px;}
}
@media (max-width: 480px){}
@media (max-width: 375px){
    #projectDtlWrap .dtl_tmp_01 .dtl_sect .dtl_mockup_box .imac_mockup{max-width: 280px;}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-18);line-height: var(--lh-26);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-12);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .txt_top_box + .txt_bottom_box{margin-top: 56px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect02 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-12);line-height: var(--lh-20);}

    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(2){margin-top: 100px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(3){margin-top: 20px;}
    #projectDtlWrap .dtl_tmp_01 .dtl_sect.sect06 .dtl_img_box .img_list .img_item:nth-child(4){margin-top: 60px;}

}
@media (max-width: 360px){}
/* ================================== E::detail tamplete 01  ========================================  *



/* ================================== S::detail tamplete 02  ========================================  */

#dtlFixedWrap{position: fixed;left: 0;top: 0;right: 0;z-index: 20;pointer-events: none;}
#dtlFixedWrap .dtl_txt_box{width: 100%;height: 100%;min-height: 100dvh;max-height: 100dvh;display: flex;align-items: flex-end;justify-content: flex-start;}
#dtlFixedWrap .dtl_txt_box .box_inner{width: 100%;padding: 48px;box-sizing: border-box;}
#dtlFixedWrap .dtl_txt_box .tit_box{}
#dtlFixedWrap .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-36);font-weight: 500;line-height: var(--lh-44);color: var(--color-white);}
#dtlFixedWrap .dtl_txt_box .date_box{}
#dtlFixedWrap .dtl_txt_box .tit_box + .date_box{margin-top: 8px;}
#dtlFixedWrap .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-20);font-weight: 600;line-height: var(--lh-28);color: var(--color-white);}


#projectDtlWrap .dtl_tmp_02{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect:not(.sect01){width: 100%;max-width: 1920px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect .sect_inner{width: 100%;max-width: calc(100% - 450px);margin-left: auto;padding: 156px 100px;box-sizing: border-box;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect01 .sect_inner{max-width: 100%;padding: 0;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect01 .dtl_img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect01 .dtl_img_box .top_img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect01 .dtl_img_box .top_img_box img{width: 100%;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box{width: 100%;max-width: 1200px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup{position: relative;width: 100%;aspect-ratio: 1512 / 1048;overflow: hidden;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .ipad_pannel{position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: block;z-index: 3;pointer-events: none;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .ipad_screen{position: absolute;left: 3.75%;top: 5.35%;width: 92.5%;height: 89.25%;overflow: hidden;background: #000;border-radius: 1.6vw;z-index: 1;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .ipad_screen .scroll_inner{width: 100%;height: 100%;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .mockup_img{display: block;width: 100%;height: 100%;object-fit: cover;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup video{display: block;width: 100%;height: 100%;object-fit: cover;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup.type_scroll .ipad_screen{overflow-y: auto;overflow-x: hidden;-webkit-overflow-scrolling: touch;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup.type_scroll .ipad_screen::-webkit-scrollbar{width:0;height:0;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup.type_scroll .ipad_screen{scrollbar-width: none;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup.type_scroll .ipad_screen .scroll_inner{height: auto;min-height: 100%;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup.type_scroll .mockup_img{width: 100%;height: auto;min-height: 100%;object-fit: initial;}

@media (max-width:1024px){
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box{max-width: 100%;box-sizing: border-box;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .ipad_screen{border-radius: 2.2vw;}
}

@media (max-width:640px){
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box .ipad_mockup .ipad_screen{border-radius: 3vw;}
}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper_box{width: 100%;max-width: 1200px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper_list{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper_item{width: 100%;aspect-ratio: 795 / 450;overflow: hidden;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper_item .dtl_img{width: 100%;height: 100%;object-fit: cover;object-position: center top;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box{width: 100%;max-width: 1200px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .mockup_list{display: flex;align-items: center;justify-content: space-evenly;column-gap: 64px;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .mockup_item{width: calc((100%/3) - (128px/3))}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup{position: relative;width: 100%;aspect-ratio: 868 / 1798;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup .iphone_pannel{position: absolute;inset: 0;width: 100%;height: 100%;object-fit: contain;z-index: 2;pointer-events: none;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup .iphone_screen{position: absolute;left: 3.6%;top: 1.7%;width: 92.8%;height: 96.5%;overflow: hidden;border-radius: 13.5% / 6.5%;background: #000;z-index: 1;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup .mockup_img,
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup .mockup_vod{display: block;width: 100%;height: 100%;object-fit: cover;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup.type_img .mockup_img{object-fit: cover;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .iphone_mockup.type_video .mockup_vod{object-fit: cover;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .sect_inner{padding: 156px 48px 24px;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .dtl_vod_box{width: 100%;aspect-ratio: 988/557;overflow: hidden;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .dtl_vod_box .vod_box{width: 100%;height: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .dtl_vod_box .vod_box .dtl_vod{width: 100%;height: 100%;object-fit: cover;object-position: center;}

#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06{}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .sect_inner{padding: 24px 48px 128px;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box{display: flex;align-items: flex-start;justify-content: space-between;column-gap: 100px;flex-wrap: nowrap;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box{flex: 1 1 0%;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box{flex: 0 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .txt_name{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box{flex: 0 0 auto;}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .txt_name{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}



@media (max-width: 1920px){}
@media (max-width: 1680px){}
@media (max-width: 1440px){
    #projectDtlWrap .dtl_tmp_02 .dtl_sect .sect_inner{padding: 128px 48px;}
}
@media all and (max-width:1280px){
}
@media (max-width: 1280px){
    #projectDtlWrap .dtl_tmp_02 .sect01{position:relative;}
    #projectDtlWrap .dtl_tmp_02 .sect01 .sect_inner{position:relative;}
    #projectDtlWrap .dtl_tmp_02 .sect01 #dtlFixedWrap{position:absolute;left:0;top:0;right:0;bottom:0;z-index:20;pointer-events:none;}
    #projectDtlWrap .dtl_tmp_02 .sect01 #dtlFixedWrap .dtl_txt_box{width:100%;height:100%;min-height:0;max-height:none;}
    #projectDtlWrap .dtl_tmp_02 .sect01 #dtlFixedWrap .dtl_txt_box .box_inner{width:100%;padding: 48px 24px;box-sizing:border-box;}

    #projectDtlWrap .dtl_tmp_02 .dtl_sect .sect_inner{max-width: 100%;padding: 96px 24px;}

    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect02 .dtl_mockup_box{max-width: 750px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect03 .dtl_swiper_box{max-width: 750px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box{max-width: 750px;}

    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .sect_inner{padding: 96px 24px 16px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .sect_inner{padding: 16px 24px 96px;}
}
@media (max-width: 1080px){
    #projectDtlWrap .dtl_tmp_02{padding-top: var(--dtl-header-space);}
    #projectDtlWrap .dtl_tmp_02 .sect01 #dtlFixedWrap .dtl_txt_box .box_inner{padding: 24px;}
    #dtlFixedWrap .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-24);line-height: var(--lh-32);}
    #dtlFixedWrap .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-16);line-height: var(--lh-24);}
}
@media (max-width: 960px){
}
@media (max-width: 850px){
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box{flex-direction: column;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box{align-self: flex-end;text-align: right;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box + .tit_box{margin-top: 48px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box{align-self: flex-end;text-align: right;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box + .cate_box{margin-top: 24px;}
}
@media (max-width: 768px){
}
@media (max-width: 640px){
    #projectDtlWrap .dtl_tmp_02 .sect01 #dtlFixedWrap .dtl_txt_box .box_inner{padding: 16px;}
    #dtlFixedWrap .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-16);line-height: var(--lh-24);}
    #dtlFixedWrap .dtl_txt_box .tit_box + .date_box{margin-top: 4px;}
    #dtlFixedWrap .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-12);line-height: var(--lh-16);}
    
    #projectDtlWrap .dtl_tmp_02 .dtl_sect .sect_inner{padding: 96px 16px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect04 .dtl_mockup_box .mockup_list{column-gap: 24px;}

    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect05 .sect_inner{padding: 96px 16px 8px;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .sect_inner{padding: 8px 16px 64px;}

    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-14);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .txt_name{font-size: var(--fs-14);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-14);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .txt_name{font-size: var(--fs-14);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-14);line-height: var(--lh-20);}
}
@media (max-width: 480px){}
@media (max-width: 375px){
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-12);line-height: var(--lh-16);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .desc_box .dtl_desc br{display: none;}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .txt_name{font-size: var(--fs-12);line-height: var(--lh-16);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .tit_box .dtl_tit{font-size: var(--fs-12);line-height: var(--lh-16);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .txt_name{font-size: var(--fs-12);line-height: var(--lh-16);}
    #projectDtlWrap .dtl_tmp_02 .dtl_sect.sect06 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-12);line-height: var(--lh-16);}
}
@media (max-width: 360px){}

/* ================================== E::detail tamplete 02  ========================================  *




/* ================================== S::detail tamplete 03  ========================================  */
#projectDtlWrap .dtl_tmp_03{padding-top: 304px;padding-bottom: 112px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect .sect_inner{width: 100%;max-width: 1920px;margin: 0 auto;padding: 32px 100px;box-sizing: border-box;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box{width: 100%;line-height: 0;border-radius: 30px;overflow: hidden;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box + .img_box{margin-top: 64px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box .dtl_img{width: 100%;}

#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .sect_inner{padding-bottom: 0;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .top_txt_box{display: flex;align-items: flex-end;flex-wrap: nowrap;column-gap: 16px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .subject_box{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-86);font-weight: 500;line-height: var(--lh-94);}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .date_box{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-20);font-weight: 600;line-height: var(--lh-28);color: var(--color-white);}

#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .bottom_txt_box{display: flex;align-items: flex-start;flex-wrap: nowrap;column-gap: 200px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .top_txt_box + .bottom_txt_box{margin-top: 140px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .dtl_name{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .client_box{flex: 0 0 auto;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .client_box .dtl_client{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .cate_box{flex: 0 0 auto;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .desc_box{flex: 1 1 0%;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);text-align: right;}

#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_list{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_item{width: 100%;max-width: 64.25%;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_item + .dtl_img_item{margin-top: 64px;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_item:nth-child(odd){margin-left: auto;}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_item:nth-child(even){margin-right: auto;}

#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect04 .dtl_img_box{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect04 .dtl_img_box .img_box{}
#projectDtlWrap .dtl_tmp_03 .dtl_sect.sect04 .dtl_img_box .img_box .dtl_vod{width: 100%;line-height: 0;}


@media (max-width: 1920px){}
@media (max-width: 1680px){}
@media (max-width: 1440px){
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .sect_inner{padding: 32px 48px;}
}
@media all and (max-width:1280px){
}
@media (max-width: 1280px){
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .sect_inner{max-width: 100%;padding: 32px 24px;}

}
@media (max-width: 1080px){
    #projectDtlWrap .dtl_tmp_03{padding-top: var(--dtl-header-space);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box{border-radius: 24px;}

    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-56);line-height: var(--lh-64);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-18);line-height: var(--lh-26);}

    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .bottom_txt_box{column-gap: 16px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .top_txt_box + .bottom_txt_box{margin-top: 96px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .cate_box{margin-left: 96px;}
}
@media (max-width: 960px){
}
@media (max-width: 850px){
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .sect_inner{padding: 48px 24px 32px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .bottom_txt_box{flex-wrap: wrap;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .desc_box{flex: 0 0 auto;width: 100%;margin-top: 48px;}
    
}
@media (max-width: 768px){
}
@media (max-width: 640px){
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .sect_inner{padding: 16px;}
    
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box{border-radius: 8px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect .dtl_img_box .img_box + .img_box{margin-top: 32px;}
    
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .sect_inner{padding: 32px 16px 16px}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-26);line-height: var(--lh-34);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-10);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .top_txt_box + .bottom_txt_box{margin-top: 48px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .bottom_txt_box{column-gap: 48px;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .dtl_name{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .client_box .dtl_client{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .cate_box{margin-left: 0;}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect01 .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_03 .dtl_sect.sect03 .dtl_img_item{width: 70%;}
}
@media (max-width: 480px){}
@media (max-width: 375px){
}
@media (max-width: 360px){}


/* ================================== E::detail tamplete 03  ========================================  *




/* ================================== S::detail tamplete 04  ========================================  */
#projectDtlWrap .dtl_tmp_04 .dtl_sect{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .sect_inner{width: 100%;max-width: 1920px;margin: 0 auto;padding: 96px 100px;box-sizing: border-box;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box .img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box .img_box + .img_box{margin-top: 192px;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box .img_box .dtl_img{width: 100%;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .subject_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-86);font-weight: 500;line-height: var(--lh-94);text-transform: uppercase;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .date_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-20);font-weight: 600;line-height: var(--lh-28);color: var(--color-white);}

#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .dtl_name{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .client_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .client_box .dtl_client{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .cate_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .desc_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-16);font-weight: 500;line-height: var(--lh-24);color: var(--color-white);}
#projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .desc_box .dtl_desc + .dtl_desc{margin-top: 8px;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect01{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect01 .sect_inner{max-width: 100%;padding: 0%;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_cnt_box{display: flex;align-items: center;justify-content: center;width: 100%;max-width: 1200px;margin: 0 auto;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box{width: 100%;max-width: 720px;aspect-ratio: 1 /1;overflow: hidden;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box .vod_box{width: 100%;height: 100%;object-fit: cover;object-position: center;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .top_txt_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .date_box .dtl_date{text-align: right;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .mid_txt_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .client_box + .cate_box{margin-top: 16px;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .top_txt_box + .mid_txt_box{margin-top: 64px;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .mid_txt_box + .bottom_txt_box{margin-top: 72px;}


#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .sect_inner{max-width: 100%;padding-left: 0;padding-right: 0;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_list{transition-timing-function: linear !important;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_item{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_item .img_box{width: 100%;line-height: 0;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_item .img_box .dtl_img{width: 100%;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_txt_box{width: 100%;padding: 0 56px;display: flex;justify-content: flex-end;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_swiper_box + .dtl_txt_box{margin-top: 24px;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_txt_box .desc_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect03 .dtl_txt_box .desc_box .dtl_desc{text-align: right;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect05{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect05 .dtl_img_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect05 .dtl_txt_box{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect05 .dtl_img_box + .dtl_txt_box{margin-top: 24px;}

#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_list{}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item{width: 100%;max-width: 64.25%;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item:nth-child(odd){margin-right: auto;}
#projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item:nth-child(even){margin-top: -160px;margin-left: auto;}

@media (max-width: 1920px){}
@media (max-width: 1680px){}
@media (max-width: 1440px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .sect_inner{padding: 96px 48px;}
}
@media all and (max-width:1280px){
}
@media (max-width: 1280px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .sect_inner{max-width: 100%;padding: 96px 24px;}
}
@media (max-width: 1080px){
    #projectDtlWrap .dtl_tmp_04{padding-top: var(--dtl-header-space);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .sect_inner{padding: 64px 24px;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box .img_box + .img_box{margin-top: 128px;}

    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-56);line-height: var(--lh-64);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-18);line-height: var(--lh-26);}

    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box{max-width: 560px;flex: 0 0 auto;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .top_txt_box{display: inline-flex;flex-direction: column;align-items: flex-end;justify-content: center;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .desc_box .dtl_desc br{display: none;}

    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item:nth-child(even){margin-top: -112px;}
}
@media (max-width: 960px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box{max-width: 520px;}
}
@media (max-width: 850px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box{max-width: 420px;}
}
@media (max-width: 768px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_cnt_box{display: block;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box{margin: 0 auto;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box{width: 100%;max-width: 720px;margin: 0 auto;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_vod_box + .dtl_txt_box{margin-top: 48px;}
    
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item:nth-child(even){margin-top: -64px;}
}
@media (max-width: 640px){
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .sect_inner{padding: 48px 16px;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_img_box .img_box + .img_box{margin-top: 96px;}
    
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .subject_box .dtl_subject{font-size: var(--fs-26);line-height: var(--lh-34);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .date_box .dtl_date{font-size: var(--fs-10);line-height: var(--lh-20);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .dtl_name{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .client_box .dtl_client{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .cate_box .dtl_cate{font-size: var(--fs-12);line-height: var(--lh-18);}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect .dtl_txt_box .desc_box .dtl_desc{font-size: var(--fs-12);line-height: var(--lh-18);}

    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect02 .dtl_txt_box .mid_txt_box + .bottom_txt_box{margin-top: 48px;}
    #projectDtlWrap .dtl_tmp_04 .dtl_sect.sect06 .dtl_img_item:nth-child(even){margin-top: -32px;}
}
@media (max-width: 480px){}
@media (max-width: 375px){
}
@media (max-width: 360px){}





/* ================================== E::detail tamplete 04  ========================================  *