/* sec_work */

.sec_work .inner_base{
  --inner_base_mw: 1200px;
}
.sec_work .wv_tab .wv_tab_menu h3{
  margin-bottom : 1.25rem;
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 160%;
  color: #090909;
}
.sec_work .wv_tab .wv_tab_btn{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  position : relative;
  width : 100%;
  height: 11.25rem;
  padding: 1.25rem;
  border-radius: 1.25rem;
  text-align: left;
  font-weight: 700;
  letter-spacing: -0.025em;
  transition: background var(--trans2), border var(--trans2);
}
.sec_work .wv_tab .wv_tab_btn p{
  display: flex;
  align-items:center;
  gap: 0.25rem;
  margin-top : 0.313rem;
  font-size: 0.875rem;
  line-height: normal;
  font-weight: 400;
}
.sec_work .wv_tab .wv_tab_btn p::after{
  display : block;
  content: "";
  width : 0.313rem;
  height : 0.438rem;
  background: url("../images/icons/ico_arrow_r.svg") no-repeat center / cover;
}
.sec_work .wv_tab .wv_tab_btn.link_btn i{
  position: absolute;
  z-index : 5;
  right : 1.25rem;
  bottom: 1.25rem;
  width : 2.25rem;
  height: 2.25rem;
  background: url("../images/icons/link_deco.svg") no-repeat center / cover;
}
.clr_white{
  border: 1px solid var(--white-stroke, #FFF);
  background: #FFF;
}
.clr_brown{
  border: 1px solid var(--linear-white, #FFF);
  background: #EED098;
}
.clr_green{
  border: 1px solid var(--linear-white, #FFF);
  background: #64E099;
}
.clr_red{
  border: 1px solid var(--linear-white, #FFF);
  background: #F07776;
}
.clr_blue{
  border: 1px solid var(--linear-white, #FFF);
  background: #7FB3FB;
}
.clr_pink{
  border: 1px solid var(--linear-white, #FFF);
  background: #EBA4FD;
}
.clr_purple{
  border: 1px solid var(--linear-white, #FFF);
  background: #BAA4FD;
}
.sec_work .wv_tab .wv_tab_menu{
  border-bottom: 3px solid #dcdcdc;
}
.sec_work .wv_tab .wv_tab_btn.active{
  border: 1px solid var(--linear-white, #FFF);
  background: #FFFFFF;
}
.sec_work .wv_tab_panel{
  display : none;
  overflow: hidden;
}
.sec_work .wv_tab_panel.active{
  display : block;
}
.sec_work .work_tit_wrap p{
  height: max-content;
  padding: 0.625rem 0.875rem;
  background-color: #fff;
  border-radius: 0.75rem;
}
.sec_work .wv_tab_menu{
  display : flex;
  flex-wrap: wrap;
  justify-content: space-between;
  column-gap: 4.333%;
  row-gap: 2.5rem;
}
.sec_work .wv_tab_menu > div:nth-child(odd){
  flex: 0 0 57.666%;
  min-width: 18.75rem;
}
.sec_work .wv_tab_menu > div:nth-child(even){
  flex: 0 0 38%;
  min-width: 12.5rem;
}
.sec_work .works_swiper{
  height: max-content;
}
.sec_work .works_swiper .work_btn{
  position: relative;
  overflow: hidden;
  border-radius: 3.125rem;
}
.sec_work .works_swiper .work_btn .txt{
  position: absolute;
  left: 0; bottom: 0;
  z-index: 20;
  padding: 2.5rem;
  color: var(--white1);
  text-align: left;
}
.sec_work .works_swiper .swiper-slide{
  border-radius: 3.125rem;
  overflow: hidden;
  width : max-content;
  width : 31.25rem;
  height: max-content;
}
.sec_work .works_swiper_mo .swiper-wrapper{
  height: max-content;
}
.sec_work .works_swiper_mo .swiper-slide{
  height: max-content;
  overflow: hidden;
  border-radius: 3.125rem;
}
.sec_work .video_wrap{
  position: relative;
  cursor: pointer;
}
.sec_work .works_swiper_mo .swiper-slide video{
  display : block;
  width : 100%;
  height: 26.875rem;
  object-fit: cover;
}
.sec_work .works_swiper_mo .swiper-slide p{
  height: 4.375rem;
  background-color: var(--white1);
  font-size: 1.375rem;
}
.sec_work .video_wrap i{
  position: absolute;
  left: 0; bottom: 0;
  z-index : 5;
  width : 3.625rem;
  height: 3.625rem;
}
.sec_work .video_wrap.pause i{
  background: url("../images/icons/ico_play.svg") no-repeat center / cover;
}
.sec_work .video_wrap.play i{
  background: url("../images/icons/ico_paused.svg") no-repeat center / cover;
}
.sec_work .video_wrap.ooh_video i{
  left: 1.25rem;
  bottom: 1.25rem;
}

#workModal{
  position: fixed;
  top: 50%; left: 50%;
  display : block;
  transform: translate(-50%, -50%);
  z-index : 2000;
  border-radius: 3.125rem;
  width : calc(100% - 40px);
  max-width: 87.5rem;
  height: 50rem;
  outline: none;
  border: none;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--trans3), visibility var(--trans3), transform var(--trans3);
}
#workModal.show{
  opacity: 1;
  visibility: visible;
  animation: modalBounceIn 0.5s ease-out;
}


.modal_close_btn{
  position: absolute;
  top: 3.125rem; right: 3.125rem;
  z-index : 100;
  width : 1.875rem;
  height: 1.875rem;
  background: url("../images/icons/ico_close.svg") no-repeat center / cover;
}
#workModal .tit{
  position: absolute;
  top: 3.125rem; left: 3.125rem;
  z-index : 50;
}
#workModal .tit h2{
  transition: all var(--trans3);
  word-break: keep-all;
}
#workModal .swiper-pagination{
  display: flex;
  justify-content: center;
  gap: 0.875rem;
  bottom: 2.5rem;
  margin: 0;
  padding: 0;
}
#workModal .swiper-pagination .swiper-pagination-bullet{
  width : 0.75rem;
  height: 0.75rem;
  margin: 0;
  background-color: rgba(255,255,255,0.4);
  backdrop-filter: blur(5px);
  transition: background-color var(--trans3);
}
#workModal .swiper-pagination .swiper-pagination-bullet-active{
  background-color: rgba(255,255,255,1);
}
#workModal .swiper-button-prev{
  left: 3.125rem;
  transform: rotate(180deg);
}
#workModal .swiper-button-next{
  right : 3.125rem;
}
#workModal .swiper-button-prev,
#workModal .swiper-button-next{
  width : 2.125rem;
  height: 2.125rem;
  margin: 0;
  background: url("../images/icons/ico_swiper-arrow.svg") no-repeat center / cover;
}
#workModal .swiper-button-prev:after,
#workModal .swiper-button-next:after{
  content: "";
}
#workModal .txt{
  position: absolute;
  top: 0;
  left: 0;
  z-index : 10;
  width : 100%;
}
#workModal .txt h3,
#workModal .txt p{
  word-break: normal;
}
#workModal .txt.bottom{
  top: auto;
  bottom: 6.25rem;
}
#workModal .inner{
  gap: 6.25rem;
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width : 100%;
  max-width : 68.75rem;
  height: 50rem;
  z-index : 5;
}
#workModal .deco_img{
  width : max-content;
  height: calc(100% - 257px);
  margin-top: 9.8125rem;
}
#workModal .swiper-wrapper{
  cursor: grab;
}
#workModal .swiper-wrapper .swiper-slide.h{
  height: 50rem;
}
#workModal .swiper-slide .bg_img{
  width : 100%;
  height: 50rem;
  object-fit: cover;
}
/* sec_work END */

/* sec_sm_banner */
.sec_sm_banner{
  --inner_base_mw: 1200px;
  height: 7.5rem;
  background-color: var(--point1);
}
.sec_sm_banner .inner_base{
  display : flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}
.sec_sm_banner a{
  display : flex;
  justify-content: center;
  align-items: center;
  width : 13.5625rem;
  height: 3.75rem;
  font-size: 1.375rem;
  font-weight: 600;
  font-family: "Montserrat";
  color: var(--white1);
  border-radius: 1.875rem;
}
/* sec_sm_banner END */


.sec_about .inner_base{
  --inner_base_mw: 1440px;
}
/* team_card */
.team_card .img_wrap{
  display : flex;
  align-items: flex-end;
  position: relative;
  height: 22.25rem;
  border-radius: 1.875rem;
  background-color: var(--white1);
  overflow: hidden;
}
.team_card .img_wrap img{
}
.team_card .img_wrap .txt{
  position: absolute;
  top: 1.125rem; right : 1.375rem;
  text-align: right;
}
.team_card > p{
  color: #585858;
}
/* team_card END */



/* sec_contact */


.sec_contact .inner_base{
  --inner_base_mw: 946px;
}


.sec_contact .txt_st_large_sub-title {
  font-weight:800;
  letter-spacing: -2px;
}



/* 1) 실제 체크박스 감추기 */
.wv_cb {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

/* 2) 커스텀 레이블 스타일 */
.wv_category {
  position: relative;
  display: inline-block;
  padding-left: 48px;  /* 아이콘 너비 + 텍스트 간격 */
  line-height: 1;
  cursor: pointer;
  user-select: none;

}

/* 3) 기본(비선택) 아이콘 */
.wv_category::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: url('/assets/images/icons/ico_check_unclick.svg') no-repeat center center;
  background-size: contain;
}

/* 4) 체크되었을 때 아이콘 교체 */
.wv_category.checked::before {
  background-image: url('/assets/images/icons/ico_check_click.svg');
}
/* 4) 체크되었을 때 아이콘 교체 */
.category_list .wv_category.checked::before {
  background-image: url('/assets/images/icons/ico_check_click_b.svg');
}






.sec_contact .arti_cont2{
  height: 50rem;
}
.sec_contact .arti_cont2 .root_daum_roughmap{
  width : 100%;
  height: 100%;
}
.sec_contact .arti_cont2 .root_daum_roughmap .wrap_map{
  height: 100%;
}
/* sec_contact END */



.preparing_modal{
  width: calc(100% - 40px);
  max-width: 450px;
  padding: 28px 30px 32px;
  border-radius: 1.25rem;
  box-shadow: 0 0 20px 0 rgba(9, 9, 10, 0.10);
}
.preparing_modal img{
  width : calc(100% - 100px);
  max-width: 240px;
  aspect-ratio: 1/1;
  margin: 0 auto;
}
.preparing_modal .btn_st{
  display: flex;
  justify-content: center;
  align-items: center;
  width : 100%;
  height: 50px;
  margin-top: 35px;
  font-size: 18px;
  font-weight: 600;
  color:#fff;
  border-radius: 50px;
  background-color: #1D1B20;
}
.preparing_modal .icon_st{
  display: block;
  position: absolute;
  top: 23px;
  right: 23px;
  width: 24px;
  height: 24px;
  background: #3E404C;
  mask-image: url("../images/icons/ico_close_modal.svg");
}


.formModal{
  display : flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width : calc(100% - 40px);
  max-width : 450px;
  height: 366px;
  border-radius: 1.25rem;
}
.formModal h2{
  line-height: 84px;
  vertical-align: middle;
}
.spinner {
  width: 50px;
  height: 50px;
  margin: 0 auto;
  background: url("../images/icons/spinner.svg") no-repeat center / cover;
  animation: spin 1.5s linear forwards infinite;
}
@keyframes spin {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.formModal .close_modal{
  display: flex;
  justify-content: center;
  align-items: center;
  width : calc(100% - 60px);
  height: 50px;
  margin: 0 auto;
  background-color: #1d1b20;
  color: var(--white1);
  border-radius: 1.25rem;
}

@media all and (max-width: 768px){
  .sec_work .categorys{
    display : flex !important;
    justify-content: center;
    width : calc(100% - 40px);
    margin: 0 auto 20px;
  }
  .sec_work .categorys button{
    padding: 6px;
    font-size: 14px;
    font-weight: 500;
    line-height: 160%;
    color: #777777;
    font-family: "Montserrat";
  }
  .sec_work .categorys button.on{
    color: #191919;
    border-bottom: 1px solid #191919;
  }
  .sec_work .wv_tab .wv_tab_btn{
    display : flex;
    justify-content: center;
    align-items: flex-start;
    height: 80px;
    border-radius: 20px;
    padding: 0;
    padding-left: 20px;
    line-height: normal;
  }
  .sec_work .wv_tab .wv_tab_btn p{
    margin-top : 7px;
  }
  .sec_work .wv_tab .wv_tab_menu{
    width : 100%;
  }
  .sec_work .wv_tab .wv_tab_menu > div > div{
    padding: 0 20px;
  }
  .sec_work .wv_tab_menu{
    gap: 16px;
  }
  .sec_work .wv_tab_menu > div:nth-child(odd),
  .sec_work .wv_tab_menu > div:nth-child(even){
    flex: 1;
    width : 100%;
  }
  .sec_work .wv_tab .wv_tab_menu > div{
    display : none;
  }
  .sec_work .wv_tab .wv_tab_menu > div.on{
    display : block;
  }

  .sec_work .work_tit_wrap p{
    padding: 10px 14px;
    border-radius: 12px;
    line-height: 26px;
  }
  .sec_work .works_swiper .swiper-slide{
    border-radius: 24px;
    width : 240px;
  }
  .sec_work .works_swiper .work_btn{
    border-radius: 24px;
  }
  .sec_work .works_swiper .work_btn .txt{
    padding: 20px;
  }
  #workModal{
    width : 320px;
    border-radius: 24px;
  }
  #workModal .tit{
    top: 24px;
    left: 24px;
    width : calc(100% - 126px);
  }
  .modal_close_btn{
    top: 20px;
    right : 20px;
    width : 30px;
    height: 30px;
  }
  #workModal .swiper-button-prev, #workModal .swiper-button-next{
    width : 34px;
    height: 34px;
  }
  #workModal .swiper-button-prev{
    left: 24px;
  }
  #workModal .swiper-button-next{
    right : 24px;
  }
  #workModal .swiper-pagination{
    gap: 14px;
    bottom: 40px;
  }
  #workModal .swiper-pagination .swiper-pagination-bullet{
    width : 12px;
    height: 12px;
  }
  #workModal .txt{
    left: 50%;
    transform: translateX(-50%);
    width : calc(100% - 136px);
    margin: 0 auto;
    word-break: keep-all;
  }
  #workModal .inner{
    flex-direction: column;
    width : calc(100% - 74px);
  }
  #workModal .inner .txt{
    transform: none;
    width : 100% !important;
  }
  #workModal .deco_img{
    margin-top: 120px;
  }
  #workModal .txt.bottom,
  #workModal .txt.md_bottom{
    top: auto;
    bottom: 120px;
    height : max-content !important;
  }


  .sec_sm_banner{
    height: 268px;
  }
  .sec_sm_banner .inner_base{
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
  }
  .sec_sm_banner a{
    width : 185px;
    height: 60px;
    font-size: 16px;
  }

  .sec_work .works_swiper_mo .swiper-wrapper{
    flex-direction: row;
    flex-wrap: nowrap;
    width : max-content;
  }
  .sec_work .works_swiper_mo .swiper-slide{
    flex: auto;
    width: 180px;
    height: 300px;
    border-radius: 24px;
  }
  .sec_work .works_swiper_mo .swiper-slide .video_wrap{
    height: calc(100% - 66px);
  }
  .sec_work .works_swiper_mo .swiper-slide video{
    height: 100%;
  }
  .sec_work .works_swiper_mo .swiper-slide p{
    justify-content: flex-end;
    height: 66px;
    padding-right : 16px;
    font-size: 16px;
  }

  .team_card{
    width : calc(50% - 10px);
  }
  .team_card .img_wrap{
    height: 240px;
  }
  .sec_about .arti_cont3 .inner_base{
    max-width: 360px;
  }
  .team_card .img_wrap .txt{
    top: 15px;
    right : 18px;
  }

  .marquee_swiper .swiper-slide{
    height: 24px;
  }

  .sec_work .wv_tab .wv_tab_btn.link_btn i{
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
  }

  .formModal{
    height: 280px;
  }


  .sec_work .video_wrap.ooh_video i{
    left: 0;
    bottom:0;
  }
}