/* work visit link */ /*20240619*/
.visit_wrap{
  background-color: #fff;
  padding: 90px 0 166px;
  transform: translateY(-1px);
}
.visit_wrap .visit_link{
  margin: 0 auto;
}
.visit_wrap .visit_link a  {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 0 auto 48px;
  font-size: 32px;
  font-weight: 600;
  text-align: center;
  color: var(--color-black1);
}
.visit_wrap .visit_link a p{
  font-family: Montserrat;
}
.visit_wrap .visit_link a .link_arrow {
  display: flex;
  height: 80px;
  margin-top: 48px;
  width: 100%;
  max-width: 580px;
  position: relative;
  transition: max-width .75s;
}
.visit_wrap .visit_link a .link_arrow i {
  background: url(../../images/common/ic_arrow_b.svg) no-repeat 50%/cover;
  display: block;
  height: 80px;
  opacity: .5;
  position: absolute;
  transition: opacity .75s;
  width: 100px
}
.visit_wrap .visit_link a .link_arrow i {
  background: url(../../images/common/ic_arrow_b.svg) no-repeat 50%/cover;
  display: block;
  height: 80px;
  opacity: .3;
  position: absolute;
  transition: opacity .75s;
  width: 100px
}
.visit_wrap .visit_link a .link_arrow i:first-child {
  left: 0
}

.visit_wrap .visit_link a .link_arrow i:nth-child(2) {
  left: 50%;
  transform: translateX(-50%)
}

.visit_wrap .visit_link a .link_arrow i:nth-child(3) {
  right: 0
}

.visit_wrap .visit_link a:hover .link_arrow {
  max-width: 860px;
  width: 100%
}

.visit_wrap .visit_link a:hover .link_arrow i {
  opacity: 1
}
/* work visit link END */ /*20240619*/

/* work sub text area  */ /* 20240619 */
.work_sub_txt .inner{
  display : grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 80px;
  grid-row-gap: 160px;
  justify-content: center;
  padding: 200px 0;
  width : calc(100% - 272px);
  max-width : 1648px;
  margin: 0 auto;
}
.work_sub_txt .col3{
  grid-column: span 3;
}
.work_sub_txt .col4{
  grid-column: span 4;
}
.work_sub_txt p{
  padding-top: 50px;
  border-top: 2px solid var(--color-white);
  font-size: 32px;
  font-weight: 500;
  color: var(--color-white);
  line-height: 48px;
}
.work_sub_txt span{
  display: block;
  margin-top: 30px;
  font-size: 18px;
  font-weight: 600;
  color: var(--color-white);
  line-height: 28px;
}

.work_content .grid_lay{
  display: grid !important;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 80px;
  grid-row-gap: 125px;
}
.work_content .grid_lay + .grid_lay{
  margin-top: 200px;
}
.content01.work_content .grid_lay + .grid_lay > div{
  gap: 64px;
}
.work_content .grid_lay > div{
  display: flex !important;
  flex-direction: column;
  gap: 80px;
  width : 100%;
}
.work_content .grid_lay img{
  width : 100%;
}
.work_content .inner{
  position: relative;
  margin: 0 auto;
  max-width: 1648px;
  width: calc(100% - 272px);
}
.work_content.content02{
  position: relative;
  background-color: #F3F5F1;
}
.work_content.content02 .inner{
  padding-top: 300px;
  padding-bottom: 400px;
}
.work_content .mobile_txt{
  position: absolute;
  left: 0;
  top: -122px;
  font-size: 200px;
  font-weight: 600;
  font-family: "Montserrat";
}

.work_content .grid_lay .col_st_1{grid-column-start: 1;}
.work_content .grid_lay .col_st_2{grid-column-start: 2;}
.work_content .grid_lay .col_st_3{grid-column-start: 3;}
.work_content .grid_lay .col_st_4{grid-column-start: 4;}
.work_content .grid_lay .col_st_5{grid-column-start: 5;}
.work_content .grid_lay .col_st_6{grid-column-start: 6;}
.work_content .grid_lay .col_st_7{grid-column-start: 7;}
.work_content .grid_lay .col_st_8{grid-column-start: 8;}
.work_content .grid_lay .col_st_9{grid-column-start: 9;}
.work_content .grid_lay .col_st_10{grid-column-start: 10;}
.work_content .grid_lay .col_st_11{grid-column-start: 11;}
.work_content .grid_lay .col_st_12{grid-column-start: 12;}

.work_content .grid_lay .col_ed_1{grid-column-end: 1;}
.work_content .grid_lay .col_ed_2{grid-column-end: 2;}
.work_content .grid_lay .col_ed_3{grid-column-end: 3;}
.work_content .grid_lay .col_ed_4{grid-column-end: 4;}
.work_content .grid_lay .col_ed_5{grid-column-end: 5;}
.work_content .grid_lay .col_ed_6{grid-column-end: 6;}
.work_content .grid_lay .col_ed_7{grid-column-end: 7;}
.work_content .grid_lay .col_ed_8{grid-column-end: 8;}
.work_content .grid_lay .col_ed_9{grid-column-end: 9;}
.work_content .grid_lay .col_ed_10{grid-column-end: 10;}
.work_content .grid_lay .col_ed_11{grid-column-end: 11;}
.work_content .grid_lay .col_ed_12{grid-column-end: 12;}
.work_content .grid_lay .col_ed_-1{grid-column-end: -1;}

/* work sub text area END */ /* 20240619 */





/* 서울형 가사서비스 */
.work_dt_wrap[data-work="seoulgasa"] .visual_bg{
  background-image: url(/assets/images/works/seoulgasa/works_seoulgasa_bg.png);
}
.work_dt_wrap[data-work="seoulgasa"] .visual_bg::before{
  background: linear-gradient(180deg, #000 58.2%, rgba(0, 0, 0, 0.00) 100%);;
}
.work_dt_wrap[data-work="seoulgasa"] .work_sub_txt{
  background-color: #88B066;
}
.work_dt_wrap[data-work="seoulgasa"] .content01.work_content .grid_lay > div{
  gap: 125px;
}
/* 서울형 가사서비스 END */

/* 대통령 경호처 */
.work_dt_wrap[data-work="pss"] .visual_bg{
  background-image: url(/assets/images/works/pss/works_pss_bg.png);
}
.work_dt_wrap[data-work="pss"] .visual_bg::before{
  background-color: #10192B;
  opacity: 0.4;
}
.work_dt_wrap[data-work="pss"] .work_sub_txt{
  background-color: #272A3B;
}
.work_dt_wrap[data-work="pss"] .content01.work_content .grid_lay > div{
  gap: 186px;
}
/* 대통령 경호처  END */

/* STAXX */
.work_dt_wrap[data-work="staxx"] .visual_bg{
  background-image: url(/assets/images/works/staxx/works_staxx_bg.png);
}
.work_dt_wrap[data-work="staxx"] .visual_bg::before{
  background-color: #000;
  opacity: 0.4;
}
.work_dt_wrap[data-work="staxx"] .work_sub_txt{
  background-color: #6D2626;
}
.work_dt_wrap[data-work="staxx"] .content01.work_content .grid_lay > div{
  gap: 268px;
}
/* STAXX  END */

/* 대동 모빌리티 스마트 모빌리티 */
.work_dt_wrap[data-work="emob"] .visual_bg{
  background-image: url(/assets/images/works/emob/works_emob_bg.png);
}
.work_dt_wrap[data-work="emob"] .visual_bg::before{
  background-color: #000;
  opacity: 0.4;
}
.work_dt_wrap[data-work="emob"] .work_sub_txt{
  background-color: #4B4E57;
}
.work_dt_wrap[data-work="emob"] .content01.work_content .grid_lay > div{
  gap: 64px;
}
/* 대동 모빌리티 스마트 모빌리티  END */

/* 녹색성장  */
.work_dt_wrap[data-work="netzero"] .visual_bg{
  background-image: url(/assets/images/works/netzero/works_netzero_bg.png);
}
.work_dt_wrap[data-work="netzero"] .visual_bg::before{
  background-color: #000;
  opacity: 0.4;
}
.work_dt_wrap[data-work="netzero"] .work_sub_txt{
  background-color: #111;
}
.work_dt_wrap[data-work="netzero"] .content01.work_content .grid_lay > div{
  gap: 64px;
}
.work_dt_wrap[data-work="netzero"] .content01.work_content .grid_lay > div{
  gap: 182px;
}
/* 녹색성장 END */



@media all and (max-width: 1600px){
  .work_dt_wrap[data-work="seoulgasa"] .content01.work_content .grid_lay > div{
    gap: 112px;
  }
  .work_dt_wrap[data-work="pss"] .content01.work_content .grid_lay > div{
    gap: 160px;
  }
  .work_dt_wrap[data-work="staxx"] .content01.work_content .grid_lay > div{
    gap: 240px;
  }
  .work_dt_wrap[data-work="netzero"] .content01.work_content .grid_lay > div{
    gap: 160px;
  }
  .work_sub_txt p{
    font-size: 26px;
    line-height: 150%;
  }
}

@media all and (max-width: 1440px){
  .work_dt_wrap[data-work="seoulgasa"] .content01.work_content .grid_lay > div{
    gap: 105px;
  }
  .work_dt_wrap[data-work="pss"] .content01.work_content .grid_lay > div{
    gap: 144px;
  }
  .work_dt_wrap[data-work="staxx"] .content01.work_content .grid_lay > div{
    gap: 216px;
  }
  .work_dt_wrap[data-work="netzero"] .content01.work_content .grid_lay > div{
    gap: 145px;
  }
}

@media all and (max-width: 1024px){
  .work_content .inner{
    width : calc(100% - 64px);
  }
  .work_content .grid_lay{
    grid-column-gap: 16px;
  }

  .visit_wrap .visit_link a .link_arrow{
    height: 60px;
    max-width : 540px;
  }
  .visit_wrap .visit_link a .link_arrow i{
    width : 80px;
    height: 61px;
  }
  .visit_wrap .visit_link a:hover .link_arrow{
    max-width : 760px;
  }
  .work_sub_txt .inner{
    grid-row-gap : 80px;
  }
  .work_sub_txt .inner > div{
    grid-column: 1 / -1;
  }
  .work_sub_txt p{
    padding-top: 30px;
    font-size: 18px;
  }

  .sec_work_dt .work_overview::before{
    width: calc(100% - 126px);
  }
  .work_dt_wrap[data-work="emob"] .content01.work_content .grid_lay > div{
    gap: 1.26%;
  }
  .work_dt_wrap[data-work="pss"] .content01.work_content .grid_lay > div{
    gap: 3.62%;
  }
  .work_dt_wrap[data-work="netzero"] .content01.work_content .grid_lay > div{
    gap: 3%;
  }
  .work_dt_wrap[data-work="seoulgasa"] .content01.work_content .grid_lay > div{
    gap: 4%;
  }
  .work_dt_wrap[data-work="staxx"] .content01.work_content .grid_lay > div{
    gap: 5.5%;
  }
}


@media all and (max-width: 768px){
  .work_content .grid_lay > div.m_hide{
    display: none !important;
  }
  .work_content .grid_lay.m_hide{
    display: none !important;
  }
  .work_dt_wrap[data-work="seoulgasa"] .visual_bg{
    background-image: url(/assets/images/works/seoulgasa/works_seoulgasa_bg_mo.png);
  }
  .work_dt_wrap[data-work="pss"] .visual_bg{
    background-image: url(/assets/images/works/pss/works_pss_bg_mo.png);
  }
  .work_dt_wrap[data-work="staxx"] .visual_bg{
    background-image: url(/assets/images/works/staxx/works_staxx_bg_mo.png);
  }
  .work_dt_wrap[data-work="netzero"] .visual_bg{
    background-image: url(/assets/images/works/netzero/works_netzero_bg_mo.png);
  }



  .visit_wrap{
    padding: 140px 0;
  }
  .visit_wrap .visit_link a{
    font-size: 20px;
    margin: 0 auto;
  }
  .visit_wrap .visit_link a .link_arrow{
    max-width: 232px;
    height: 45px;
    margin-top: 32px;
  }
  .visit_wrap .visit_link a:hover .link_arrow{
    max-width: 232px;
  }
  .visit_wrap .visit_link a .link_arrow i{
    width: 56px;
    height: 45px;
  }

  .sec_work_dt .work_overview::before{
    width : calc(100% - 64px)
  }
  .work_sub_txt .inner{
    grid-template-columns: repeat( 6, 1fr);
    grid-column-gap: 16px;
    grid-row-gap: 80px;
    width : calc(100% - 64px);
    padding: 140px 0;
  }
  .work_sub_txt p{
    padding-top: 30px;
    font-size: 18px;
    line-height: 160%;
  }
  .work_sub_txt span{
    margin-top: 20px;
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
  }

  .work_content.content01{
    padding: 160px 0;
  }
  .work_content .mobile_txt{
    font-size: 76px;
    font-weight: 600;
    top: -40px;
  }

  .work_content .grid_lay{
    grid-template-columns: repeat( 6, 1fr);
    grid-column-gap: 16px;
    grid-row-gap: 60px;
  }
  .work_content .grid_lay + .grid_lay{
    margin-top: 60px;
  }
  .work_content .grid_lay > [class*="col_"]{
    grid-column: 1 / -1;
    gap: 60px !important;
  }

  .work_content .grid_lay.mo_col_3 > [class*="col_"]:nth-child(3n + 1){
    grid-column: 1 / 3;
  }
  .work_content .grid_lay.mo_col_3 > [class*="col_"]:nth-child(3n + 2){
    grid-column: 3 / 5;
  }
  .work_content .grid_lay.mo_col_3 > [class*="col_"]:nth-child(3n + 3){
    grid-column: 5 / -1;
  }

  .work_content .grid_lay.mo_col_2 > [class*="col_"]:nth-of-type(1){
    grid-column: 1 / 4;
  }
  .work_content .grid_lay.mo_col_2 > [class*="col_"]:nth-of-type(2){
    grid-column: 4 / -1;
  }
  .work_content .grid_lay.mo_col_3 > [class*="col_"],
  .work_content .grid_lay.mo_col_2 > [class*="col_"]{
    gap: 40px !important;
  }

  .work_content.content02 .inner{
    padding: 140px 0;
  }

}