@charset "utf-8";


.lnb {width: 100%;min-height: 4.375rem;background-color: #fff;box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.08);
  .container { display: flex;}
  .inner{justify-content: start}
  .lnb-list .item {display: flex;align-items: center;position: relative;}
  .lnb-list .item.lnb-dropdown{padding-right: 1.375rem; height: 100%;}
  .lnb-list .item:not(:first-child)::before {
    content: "";position: absolute;top: 50%;left: 0;width: 1px;height: 19px;transform: translateY(-50%);background-color: #e0e0e0;}
  .lnb-list .item a {font-size: 18px;font-weight: 400;color: #a0a0a0;position: relative; padding-inline:2rem;white-space: nowrap;  transition: all 0.3s; display: flex; align-items: center;}
  .lnb-list .item.active {background-color: #f4f4f4;}
  .lnb-list .item.active::after {
    content: "";position: absolute; bottom: 0;left: 0;width: 100%;height: 3px;background-color: var(--primary);}
  .lnb-list .item.active a {font-weight: 700;color: var(--primary);   height: 4.375rem;}
  .lnb-menus {display: none;}
  .lnb-menus.active {display: grid;  grid-auto-flow: column;  grid-template-columns: repeat(auto-fit, minmax(auto, max-content));}
  .lnb-dropdown .trigger {display: flex;align-items: center;justify-content: space-between;gap:1.5rem;font-size: 1.375rem;font-weight: 700;transition: all 0.4s; white-space: nowrap;}
  .lnb-dropdown .trigger .ico-down {transform: rotate(0deg);transition: all 0.5s;}
  .lnb-dropdown ul {position: absolute;top: 100%;right: 0;width: 100%;display: none;transition: color 0.4s, border 0.4s, background 0.4s;z-index: 51;background-color: #fff;}
  .lnb-dropdown ul > li {background-color: #fbfbfb;}
  .lnb-dropdown ul > li:not(:last-child) {border-bottom: 1px solid #c4c4c4;}
  .lnb-dropdown ul > li > a {display: flex;justify-content: center;align-items: center;padding-block: 15px;line-height: 1;font-size: 1.125rem;font-weight: 400;font-family: var(--font-secondary);color: #a0a0a0; text-align: center;transition: all 0.3s;gap: 0.5em;}
  .lnb-dropdown ul > li > a img {width: 1.4em;height: 1.4em;border-radius: 50%;object-fit: cover;}
  .lnb-dropdown.toggle .trigger .ico-down {transform: rotate(180deg);}
  .lnb-dropdown.toggle  > ul { display: flex; flex-direction: column;box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.04);}

  @media (hover: hover) {
    .lnb-dropdown:hover ul { display: block; display: flex; justify-content:end; flex-direction: column;}
    .lnb-dropdown:hover .trigger .ico-down {transform: rotate(180deg);}
    .lnb .lnb-list .lnb-item:hover a {color: var(--primary);}
    .lnb-dropdown ul > li > a:hover {color: #000;}
  }
  @media screen and (max-width: 1399px) {
    .container{flex-direction: column; width: 100%;}
    .lnb-list .item a{width: 100%; justify-content: center; padding-inline: 1em; }
    .lnb-list .item{height: 100%;}
    .lnb-menus .item:not(.active){ border-bottom: 1px solid #F2F2F2}
     .lnb-menus.active{ grid-auto-flow:unset;  grid-auto-rows: 60px; grid-template-columns: repeat(4,1fr);}
     .lnb-list .item:not(:first-child)::before{background-color: #F2F2F2;}
     .lnb-menus .item:not(.active):last-of-type::after {content: ""; position: absolute;right: -1px;top: 0;bottom: 0;width: 1px;background: #F2F2F2;}
     .lnb-list .item.lnb-dropdown{width: 100%; margin-right: 24px;}
     .lnb-dropdown .trigger{width: 100%; }
     .lnb-list .item.lnb-dropdown{margin-right: 0; padding: 1.175em 1.725em;}
     .lnb-list .item:not(:first-child)::before{height: 100%;}
     .lnb-list .item.lnb-dropdown{box-shadow:0 5px 15px rgba(0,0,0,0.15); z-index: 5;}
     .lnb-dropdown:hover ul{box-shadow:0 5px 15px rgba(0,0,0,0.15);}
  }
  @media screen and (max-width: 767px) {
    .lnb-menus.active{ grid-auto-flow:unset;   grid-auto-rows: 60px;grid-template-columns: repeat(2,1fr);}
    .lnb-list .item a{padding-inline: 1rem;}
    .lnb-list .item:not(:first-child)::before{content: none;}
    .lnb-list .item a{padding-inline: 1rem;}
    .lnb-dropdown .trigger{line-height: 1;}
    .lnb-menus .item:not(.active):nth-of-type(2n+1)::after {content: ""; position: absolute;right: -1px;top: 0;bottom: 0;width: 1px;background: #F2F2F2;}
  }
  @media screen and (max-width: 499px) {
  }
}






/* 
.sp-content {
  padding-block: 150px;
} */
.sp-content img.ex {margin: 0 auto;width: 100%;}
.sp-head {margin-bottom: 3.75em;}
.sp-head .sp-title {font-size:2.5rem;font-weight: 700;font-family: var(--ff-secondary);}




/* About us */
/* overview */

.sp-head{text-align: center;}
.page-head{color: var(--primary); font-size: 1.25rem;}
.page-title{font-size:3.75rem; }
.sp-head .text-4xl{margin-top: 2em; line-height: 1.3;}

.overview {
  .intro {height: 604px;max-height: 604px;position: relative;}
  .sp-head{margin-bottom: 0;position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center;}
  .sp-head .img-cover{margin-top: 100px; max-width: 1200px;}
  .intro{color: white; position: relative; display: flex;justify-content: center; align-items: center;}
  .intro .text{position: absolute;text-align: center;}
  .intro .text-2xl{margin-bottom: 2em;}

  /* card */
  .cards{display: grid; grid-template-columns: repeat(3,1fr);height: 360px; gap: 0.625rem;margin-top: 12.5em;}
  .card__item{position: relative; color: white; border-radius:1.25rem ;overflow: hidden; cursor:pointer; transition: all 0.5s;}

  .card__inner{height: 100%;}
  .card__title{font-size: 1.875rem; font-weight: bold;font-family: var(--ff-secondary);position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%);}
  .card__detail{text-align: center; background-color: var(--primary);height: 100%; display: flex;flex-direction: column;align-items: center;justify-content: center; gap: 1.5rem; opacity: 0; transition: all 0.5s; position: relative; z-index: 1;}
  .card__detail-title{font-size: 1.5rem; font-weight: bold; color: #AEDCFF;}
  .card__detail-title b{color: white;}
  .card__detail-text{font-size: 1.0625rem; line-height: 1.6;}
  .card__detail .line{display: inline-block; width: 1px; height: 35px; background: #fff;}
  .card__item:hover .card__detail{opacity: 1;}
  @media (hover: hover) {
    .card__item:hover{transform: translateY(-5%);}
  }
  @media screen and (max-width: 1399px) {
    .cards{grid-template-columns: auto; min-height: 600px; margin-top: 6.25em;}
    .card__detail .line{display: none;}
    .card__detail-text{width: 85%;}
  }
  @media screen and (max-width: 767px) {
     .cards {
    grid-template-columns: 1fr; height: fit-content;
  }
  .card__item{height: 300px;}
    .card__detail{gap: 0; }

  }

  /* certification */
  .cert{background-color: #F5F7F9; position: relative; padding-bottom: 13.625em;}
  .cert::before{content: ""; background-color: #F5F7F9; height: 340px; display: block; position: absolute; top: 0; width: 100%; transform: translateY(-100%); z-index: -1;}
  .cert-inner {display: grid;  grid-template-columns: 460px 1fr; margin-top: 160px;}
  .cert .title{font-family: var(--ff-secondary); font-weight: bold; text-align: start;}
  .cert-table {width: 100%;border-collapse: collapse;table-layout: fixed;}
  .cert-table .flex{justify-content: space-between;}
  .cert-table__th {background-color: white;padding: 1em 2.25rem;font-weight: 600;font-size: 1.125rem;text-align: left;border-bottom: 1px solid #dfe4ea;}
  .cert-table__th.name{ width: 60%;}
  .cert-table__th.no{ width: 40%; text-align: center;}
  .cert-table__name{position: relative;}
.cert-table__zoom-btn{ height: 100%; display: flex; width: 50px; position: absolute;top: 0; right: 0;justify-content: center;align-items: center; }
  .cert-table__row>td{padding: 0.75em 2.25em;border-bottom: 1px solid #E1E1E1;}
  .cert-img{position: absolute; right: 55px; bottom: 0;}
  .cert-table__row:first-of-type  .cert-img,
  .cert-table__row:nth-of-type(2)  .cert-img,
  .cert-table__row:nth-of-type(3)  .cert-img,
  .cert-table__row:nth-of-type(4)  .cert-img{bottom: auto; top: 10px;}
  .cert .table-wrap{position: relative; min-height: 428px;}
  .cert-table__row{color: #ccc;}
  .cert-table__row .name,.cert-table__row .no{color: #000;}
  .cert-table__row.active .cert-img{display: block; z-index: 5; border: 1px solid var(--gray-03); box-shadow:0 5px 15px rgba(0,0,0,0.15);}
  .cert-img{display: none;}
  .cert-table__row.active{color: var(--primary);}
  @media screen and (max-width: 1399px) {
    .cert-inner {grid-template-columns: auto; }
    .cert-img{right: 0; transform: translateX(35%);}
    .cert-table__row>td{text-align: start; padding-inline: 1.25em;}
    .cert-table__th.no{text-align: start;}
    .cert-table__th{ padding-inline: 1.25em;}
    .cert .title {margin-bottom: 0.25em; text-align: center;}
    .cert-table__row.active .cert-img{bottom: 100%}
    .cert-table__row:first-of-type .cert-img, .cert-table__row:nth-of-type(2) .cert-img, .cert-table__row:nth-of-type(3) .cert-img, .cert-table__row:nth-of-type(4) .cert-img,
    .cert-table__row:nth-of-type(5) .cert-img{top: 100%;}
    .cert-table__row .name{max-width: 80%;}
  }
  @media screen and (max-width: 767px) {

  }

}

/* ceo-messgae */
.ceo-message{
  .intro{background: var(--primary); height: 630px; color: white;}
  .intro .img-cover{aspect-ratio: 538/304; position: relative;}
  .intro .left .text-3xl{margin-bottom: 1.625rem;}
  .intro .inner{justify-content: space-between; padding-top: 3.625rem;flex-wrap: wrap; text-align: left;}
  .bottom .inner {position: relative; text-align: center; padding-bottom: 13.75em;}
  .bottom .inner .images{gap: 7.5em; position: absolute; top: 0; transform: translateY(-50%);   }
  .bottom .inner .images .img-cover{aspect-ratio: 1/1;}
  .bottom .text-cont{margin-top: 16.25em;}
  .bottom .text-cont > p:not(:last-of-type){ margin-bottom: 1.625rem;}
  .ceo{display: flex; justify-content: center;align-items: center; margin-top: 3.125rem; font-weight: 600;}
  .ceo .line{width: 2px; height: 20px; background-color: #8C8C8C; margin-inline: 1rem; }
  .ceo .job{font-weight: bold; color: #8C8C8C;}
  @media screen and (max-width: 1399px) {
    .intro .inner{justify-content: center; gap: 3em; text-align: center;}
    .bottom .inner .images{margin-inline: 1.25rem; gap: 3em;  position: relative; transform: translate(0);}
    .intro{display: flex; align-items: center; justify-content: center;}
    .bottom .text-cont{margin-top: 0}
    .bottom .inner{flex-direction: column; gap: 3em; margin-top: 3em;}
  }
  @media screen and (max-width: 767px) {
    /* .bottom .inner .images .img-cover{max-width: 15.5rem;} */
    .bottom .inner .images{ flex-direction: column; gap: 1rem;}
    .ceo{flex-direction: column;}
    .ceo .line{display: none;}
  }
}


/* history */

.history{
  .texts{width: 100%; text-align: start;}
  .texts .text-lg{color: #8C8C8C; margin-top: 1.575rem; margin-bottom: 4.0625rem;}
.historyTabs{position:relative;height:48px; z-index: 10;}
.historyTabs>div{position:relative;box-sizing:border-box;width:100%;
background:#fff;	left:0;top:0;transition:all 0.4s;}
.historyTabs>div.on{padding:20px 0 50px;box-shadow:0 1px 3px rgba(0,0,0,0.1);}
.historyTabs>div.on.up{top:0;}
.historyTabs>div.on.down{top:90px;}
.historyTabs>div>div{position:relative;width:100%;margin:0 auto; max-width: 1200px;}
.historyTabs>div>div:before{display:block;content:"";width:100%;height:1px;margin:0 auto;background:#dfdfdf;position:absolute;left:50%;top:50%;transform:translate(-50%);}
.historyTabs ul{display:flex;align-items:center;justify-content:space-evenly;position:relative;max-width:1500px;width:100%;margin:0 auto;	}
.historyTabs ul:before{display:block;content:"";width:1px;height:15px;background:var(--primary);position:absolute;left:0;top:50%;transform:translateY(-50%);}
.historyTabs ul:after{display:block;content:"";width:1px;height:15px;background:var(--primary);position:absolute;right:0;top:50%;transform:translateY(-50%);}
.historyTabs ul li{position:relative;z-index:10;}
.historyTabs ul li a{display:block;width:48px;height:48px;box-sizing:border-box;border:1px solid #999;border-radius:50%; background-color: white;}
.historyTabs ul li a:after{display:block;content:"";width:8px;height:8px;background:#999;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.historyTabs ul li a .year{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:15px;;font-size:16px;color:#999;font-weight:500;}
.historyTabs .line{position:absolute;left:0;top:50%;width:100%;height:1px;background:var(--primary);transition:all 0.6s;}

.historyTabs ul li.on a{border:1px solid var(--primary);  z-index: 5;}
.historyTabs ul li.on a:after{background:var(--primary);;}
.historyTabs ul li.on a .year{color:var(--primary);;}
.historyTabcons{margin:160px 0 0;}
.historyTabcons .tabcon{padding-top:200px;}
.historyTabcons .tabcon:first-child{padding-top:0;}
.historyTabcons .tabcon .img-cover{height:400px; position: relative;margin-bottom: 4.6875rem;}
.historyTabcons .tabcon .img-cover img{position: absolute; inset: 0; object-fit: cover;}
.historyTabcons .tabcon .conwrap{display:grid; grid-template-columns: 370px 1fr;margin-bottom: 10em}
.historyTabcons:last-of-type .tabcon .conwrap{margin-bottom: 13.75rem;}
.historyTabcons .tabcon .conwrap .con{width:100%;border-top:2px solid #333;}
.historyTabcons .tabcon .conwrap .con dl{display:flex;padding:1.875em 1.25em;border-bottom:1px solid #ddd;}
.historyTabcons .tabcon .conwrap .con dl dt{width:125px;font-size:1.875rem;font-weight:600;line-height:1; flex-shrink: 0;}
.historyTabcons .tabcon .year{text-align: start;}
.historyTabcons .tabcon .conwrap .con dl dd ul li{margin-bottom:5px;font-size:1.25rem; text-align: start;}
.historyTabcons .tabcon .conwrap .con dl dd ul li:last-child{margin-bottom:0;}
@media screen and (max-width: 1399px) {
  .historyTabcons .tabcon .conwrap{grid-template-columns: auto;}
  .historyTabcons .tabcon .conwrap .con dl{padding-inline: 0 ;}
  .historyTabcons .tabcon .conwrap .con dl dt{text-align: start; font-size: 1.575rem;}
}
@media screen and (max-width:767px){
  .historyTabcons .tabcon .conwrap .con dl{flex-direction: column; gap: 1em;}
  .historyTabcons .tabcon .conwrap{margin-bottom: 5em;}
}
}

/* partners */

.partners{
  background-color: #F5F7F9;
  .inner{position: relative; background-size: contain;background-repeat: no-repeat; display: block;}
  .sp-head,.sp-content{position: relative; z-index: 10;}
  .global-bg {position: absolute; inset: 0; z-index: 0}
  .global-bg .bg {position: relative;width: 100%;aspect-ratio: 1920 / 1162;  height: auto;}
  .global-bg .bg .img {position: absolute;inset: 0;width: 100%;height: 100%;object-fit: contain;}
  .prod-bullet {position: absolute;transform: translate(-50%, -50%);}
  .prod-bullet.bullet-01 {left: 20%;top: 85%;}
  .prod-bullet.bullet-02 {left: 25%;top: 85%;}
  .prod-bullet.bullet-03 {left: 25%;top: 68%;}
  .prod-bullet.bullet-04 {left: 28%;top: 45%;}
  .prod-bullet.bullet-05 {left: 40%;top: 65%;}
  .prod-bullet.bullet-06 {left: 46%;top: 67%;}
  .top .content{width: 50%; margin-left: auto;}
  .top .content .texts {display: flex; flex-direction: column; gap:  1.5rem; text-align: start;}
  .top .content .texts .text-lg{line-height: 160%; color: var(--gray-03);}
  .bottom{height: 430px;align-items: center; z-index: 1; position: relative; background-size: cover;}
  .bottom .container{display: flex; justify-content: space-between;align-items: flex-end; height: calc(100% - 210px)}
  .bottom .texts{color: white; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
  .bottom .text-4xl{line-height: 1.4;}
  .bottom .text-xl{line-height: 160%;}
  .partners__list {display: grid; grid-template-columns: repeat(4,1fr); grid-template-rows: repeat(2,1fr); height: 140px; gap: 0.5625rem; margin-top: 3.625rem; margin-bottom: 15em;}

  @media screen and (max-width: 1399px) {
    .top .content{width: 100%; display: flex;flex-direction: column;align-items: center}
    .top .content .texts{text-align: center; }
    .bottom .text-4xl{line-height: 1.3}
    .bottom .texts{margin-bottom: 2em; gap: 1em;}
    /* .global-bg .bg{display: none;} */
    .prod-bullet{display: none;}
   
    
  }
  @media screen and (max-width: 767px) {
  
    .bottom .container{flex-direction: column; align-items: flex-start; justify-content: center;}
    .partners__list{grid-template-rows:auto;  grid-template-columns: repeat(2, max-content); }
  }
}

/* bullet */
/* 마커 공통 */
.prod-bullet {
  position: absolute;
}

/* 점(중심) – 크기 고정 */
.prod-bullet .bullet {
  position: absolute;
  width: 0.6rem;    
  height: 0.6rem;
  background: #4A4B4C;
  border-radius: 50%;
  transition: background-color 0.3s ease-in-out;
}

/* 레이더 링 기본 */
.prod-bullet .radar {
  position: absolute;
  width: 1.3rem;    
  height: 1.3rem;
  background: #4A4B4C;
  border-radius: 50%;
  display: block;
  opacity: 0.4;
  left: -0.35rem;   
  top: -0.35rem;
  z-index: 5;
}

.prod-bullet .radar.r2 {
  opacity: 0.3;
}


.prod-bullet.active .bullet {
  background: var(--primary);
}


.prod-bullet.active .radar {
  width: 2.6rem;    
  height: 2.6rem;
  background: var(--primary);
  left: -1rem;       
  top: -1rem;
}

.prod-bullet.active .radar.r1 {
  animation: radarR1 1.2s ease-out infinite;
  animation-delay: 0.25s;
}

.prod-bullet.active .radar.r2 {
  animation: radarR2 1.2s ease-out infinite;
}

/* 애니메이션 */
@keyframes radarR1 {
  0% { transform: scale(0.3); opacity: 0; }
  20% { opacity: 0.35; }
  70% { transform: scale(1.25); opacity: 0; }
  100% { transform: scale(1.25); opacity: 0; }
}

@keyframes radarR2 {
  0% { transform: scale(0.5); opacity: 0; }
  20% { opacity: 0.25; }
  70% { transform: scale(1.5); opacity: 0; }
  100% { transform: scale(1.5); opacity: 0; }
}



/* Organization */
.organization{
  .img-cover.back{
   aspect-ratio: 1920/550;
    position: relative;
  }
  .sp-head{margin-bottom: 0;}
  .sp-head .text-lg{color: var(--gray-03); margin-top: 2.5em; margin-bottom: 5.9375em;}
  .img-cover.organ{ position: relative;}
  .img-cover.organ img{aspect-ratio: 1400/653;}
  .sp-content .container{padding-top: 10em; padding-bottom: 13.75em;}

  @media screen and (max-width: 1399px) {
    .sp-content .container{padding-top: 5em; padding-bottom: 6.3em;}
  }
  @media screen and (max-width: 767px) {
    .img-cover.organ{min-width: 600px; margin-bottom: 1em;}
    .moScroll{overflow-x: auto;  -webkit-overflow-scrolling: touch; }
    .sp-head .text-lg{margin-top: 1.25em; margin-bottom: 3em;}
  }
}


/* location */
.location{
  .map-wrapper{display: grid;  grid-template-columns: 1fr 460px; gap: 1.875rem;}
  .sp-head{margin-bottom: 7.5em;}
  .map-cover{border-radius: 1.25rem; overflow: hidden;}
  .container{display: flex; flex-direction: column; gap: 7.5rem; padding-bottom: 13.75em;}
  .map-wrapper .upper{min-width: 6.875rem;}
  .map-wrapper .text-4xl{line-height: 1; padding-bottom: 2rem;  margin-bottom: 2rem; border-bottom: 1px solid #E1E1E1; text-align: start;}
  .info{display: flex; flex-direction: column; gap: 0.875rem; text-align: start;}
  .links .link{width: 3.125rem; height: 3.125rem; display: inline-block;box-shadow: 0 4px 20px rgba(0,0,0,0.15); border-radius: 0.625rem;}
  .links {display: flex; gap: 0.75rem;}
  .side{display: flex; flex-direction: column; justify-content: space-between;}

  @media screen and (max-width: 1399px) {
    .map-wrapper {grid-template-columns: auto;}
    .side{gap: 2em;}
    .sp-head{margin-bottom:3.5em;}
    .container{padding-bottom: 10.75em;}
  }
  @media screen and (max-width: 767px) {
    .map-cover{aspect-ratio: 1/1;}
  }
}

/* oem */
/* development */
.sp-head.with-bg{
  height: 500px;margin: 0;width: 100%;background-size: cover;background-position: center;display: flex;flex-direction: column;justify-content: center;align-items: center;
  color: white;
}
.sp-head.with-bg .page-head{color: white;}
.sp-content{text-align: center;}
.sp-content .process{
  padding-bottom: 11.875em;
}
.development{
  /* process */
  .sp-content .process{padding-top: 10em;}
  .sp-content .text-4xl {margin-bottom: 4.625rem; line-height: 1.3;}
  .development__list{display: grid; grid-template-columns: repeat(4,1fr);grid-template-rows: repeat(3,1fr);  row-gap: 4.375rem; column-gap: 1.4375rem;}
  .development__list .item:nth-child(odd) { color: var( --primary) }
  .development__list .item:nth-child(even) { color: var( --third) }

  .development__list .item .label{font-size: 1.5rem; color: #000; font-weight: 600;}
  .development__list .item .number{display: inline-block;
    font-size: 1.375rem; width: 2.5rem; height: 2.5rem; border-radius: 50%; background-color: currentColor; line-height: 1;display: flex;justify-content: center;align-items: center;
    flex-shrink: 0; margin-top: 1.4375rem; 
  }
  .development__list .item .hidden-cont{font-size: 1.125rem; color: white; visibility: hidden; height: 63%; position: absolute;bottom: 10%;display: flex;flex-direction: column;align-items: start; justify-content: center; font-weight: 500; max-width: 85%; width: fit-content;}
  .development__list .item .hidden-cont span{display: flex;justify-content: center;
    align-items: start; text-align: start;}
  .development__list .item .hidden-cont span::before{content: ""; width: 0.375rem; height: 0.375rem; border-radius: 999px; background-color: white; display: inline-block; margin-right: 0.5rem; position: relative; top: 0.75rem; flex-shrink: 0;}
  .development__list .item .number>span{color: white;}
  .development__list .item .icon{display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1.3625rem;}
  .development__list .item .line{height: 0.3125rem; width: 100%; display: inline-block; background-color: currentColor; position: relative; top: 1px;}
  .development__list .item .img-cover{width: 5rem; position: relative;}
  .development__list .item{border: 1px solid #E0E0E0; padding-bottom: 1.75rem;  display: flex; flex-direction: column; justify-content: space-between; position: relative;  }
  .development__list .item .content{display: flex; flex-direction: column; justify-content: space-between; align-items: center; height: 100%; gap: 1em;}
  .development__list .item:nth-of-type(10) .img-cover{width: 5.5rem;}

  /* oem ready */
  .oem-ready{background-color: #F5F7F9; padding-top: 11.25em; padding-bottom: 13.75em;}
  .oem-ready .text-4xl{text-align: start;}
  .oem-ready__list{display: grid; grid-template-columns: repeat(5,1fr); column-gap: 3.75rem; row-gap: 6.25rem;}
  .oem-ready__list .item{position: relative;}
  .oem-ready__list .item:hover .btn-zoom{visibility: visible;}
  .oem-ready__list .item .name{position: absolute; bottom: -1.125rem; transform: translateY(100%) translateX(-50%); left: 50%;}
  .oem-ready__list .item .btn-zoom{position: absolute; width: 3.4375rem; height: 3.4375rem; top: 50%; left: 50%; transform: translate(-50%, -50%);
  visibility: hidden;
  }

  @media (hover: hover) {
    .development__list .item:hover{background-color: currentColor; border-color: currentColor;}
    .development__list .item:hover .hidden-cont{visibility: visible;}
    .development__list .item:hover .line{background-color: white;}
    .development__list .item:hover .number{background-color: white;}
    .development__list .item:hover .number>span{color: currentColor;}
    .development__list .item:hover .icon{display: none;}
  }

  @media screen and (max-width: 1399px) {
    .development__list{grid-template-columns: repeat(3,1fr); column-gap: 1rem; grid-template-rows:auto}
    .development__list .item .img-cover{width: 4rem;}
    .development__list .item .content{gap: 0.75em;}
    .oem-ready__list{grid-template-columns: repeat(4,1fr); column-gap: 1rem;}
    .development__list .item .label{line-height: 1.3; font-size: 1.3rem;}
    .development__list .item .hidden-cont{display: block; opacity: 1; visibility: visible; color: #000; position: relative; bottom: 0; width: 100%;}
    .development__list .item .hidden-cont span{justify-content: start;}
    .development__list .item .hidden-cont span::before{background-color: currentColor; width: 0.3rem; height: 0.3rem; flex-shrink: 0; top: 0.6rem;}
  }
  @media screen and (max-width: 767px) {
    .development__list{grid-template-columns: repeat(2,1fr); row-gap: 2.375rem;}
    .development__list .item .icon{height: 100%;}
    .development__list .item .label{line-height: 1.25;}
    .development__list .item .number{font-size: 1.25rem; width: 2.25rem; height: 2.25rem;}
    .oem-ready{padding-top: 5.65em;}
    .oem-ready__list{grid-template-columns: repeat(2,1fr);}
  }
@media screen and (max-width:400px) {
  .development__list{grid-template-columns: auto;}
  .moView{display: none;}
}
}

/* manufacturing */
.manufacturing{
  .sp-content .process{padding-bottom: 0;}
  .development__list{grid-template-rows: auto; grid-template-columns: repeat(5,1fr);row-gap: unset;}
  .development__list .item .img-cover{width: 4.6875rem;display: flex;align-items: center;}
  .development__list .item .img-cover .img{position: absolute;}
  .development__list .item .img-cover .img{visibility: visible;}
  .development__list .item .img-cover {height: 4.4375rem;}
  .development__list .item:nth-of-type(3) .img-cover{width: 6.0625rem;}
  .development__list{padding-bottom: 3.375rem;}

  .equipment{text-align: start}
  .equipment .inner{ align-items: start; padding-top: 6.875rem; padding-bottom: 13.75em;}
  .equipment .img-cover{max-width: 64rem;}

  @media (hover: hover) {
    .development__list .item:hover .number{background-color: transparent;}
    .development__list .item:hover .number>span{color: white;}
    .development__list .item:hover .img-cover .img.hover{visibility: visible; z-index: 10;}
    .development__list .item:hover .icon {display: flex;}
    .development__list .item:hover .label{color: #fff;}
    .development__list .item .img-cover .img.hover{visibility: hidden;}
  }

  @media screen and (max-width: 1399px) {
    .development__list{grid-template-columns: repeat(3,1fr); row-gap: 2.375rem;}
    .equipment .inner{flex-direction: column;}
    .development__list .item .img-cover .img.hover{visibility: hidden;}
  }
  @media screen and (max-width: 767px) {
    .development__list{grid-template-columns: repeat(2,1fr);}
    .equipment .inner{padding-top: 3.4rem;}
    .development__list .item .img-cover .img.hover{visibility: hidden;}
  }
}


/* Product */


.product-all{
  .container{padding-bottom: 17.875em; padding-top: 10em;}
  .tabs{display: grid; grid-template-columns: repeat(3,1fr); background-color: #F2F2F2; border-radius: 999px; margin-bottom: 3.25rem;}
  .tabs .tab{ height: 55px;display: flex; justify-content: center; align-items: center; font-size: 1.5rem; color: var(--gray-03); font-weight: 600; cursor: pointer;}
  .tabs .tab > button{width: 100%; height: 100%;}
  .tabs .tab.active{background-color: var(--primary); color: white; border-radius: 999px;}
  .product__list{display: none;}
  .product__list.active{display: grid; grid-template-columns: repeat(5,1fr); column-gap: 3.75rem; row-gap: 6.25rem;  }
  .product__list .item{border: 1px solid #E0E0E0; aspect-ratio: 233/304; position: relative;}
  .product__list .item .name{position: absolute; bottom: -1.125em; transform: translateY(100%) translateX(-50%); width: 100%;}

  @media screen and (max-width: 1399px) {
    .product__list.active{grid-template-columns: repeat(4,1fr); column-gap: 1rem;}
    .product__list .item .name{bottom: -0.5em;}

  }
  @media screen and (max-width: 767px) {
    .container{padding-top: 5em;}
    .product__list.active{grid-template-columns: repeat(2,1fr); }
    .tabs{grid-template-columns: auto; background-color: transparent; gap: 0.5em;}
    .tabs .tab{background-color: #F2F2F2; border-radius: 999px; }
  }
}

.product{
  position: relative;
  .sp-head.with-bg .page-title{color: #000;}
  .sp-head.with-bg {height: 488px; background-image: url("../images/sub/product/product-bg.png"); background-size: cover;}
  .sp-head .text-4xl {color: var(--primary);}

   /* main */
  .main{height: 802px; background-position: center; background-size: cover; background-repeat: no-repeat;display: flex; align-items: center; justify-content: center;}
  .main .inner{width: 100%;}
  .main .container{display: grid; grid-template-columns: repeat(2,1fr); gap: 14.8125em;}
  .main .img-cover.item{position: relative; aspect-ratio: 546/556; height: auto}
  .main .img-cover.item img{object-fit: contain;}
  .main .texts{text-align: start; display: flex;flex-direction: column; justify-content: center;}
  .main .texts .head{font-family: var(--ff-secondary); font-weight: bold; color: var(--primary);}
  .main .texts .name{font-size: 3.125rem; font-weight: 600; margin-bottom: 1.625rem; margin-top: 0.5rem; line-height: 120%;}
  .main .type .img-cover{position: relative; width: 5rem; height: 5rem; flex-shrink: 0;}
  .main .type .img-cover .bg{object-fit: contain;}
  .main .card {background-color: rgb(255, 255, 255, 0.6) ;border-radius: 0.75rem; padding-inline: 1.25rem; border: 1px solid white;}
  .main .card .title{ padding-block: 0.75rem; font-family: var(--ff-secondary); border-bottom: 1px solid white; line-height: 1;}
  .main .variants{display: grid; grid-template-columns: 17.375rem 1fr; gap: 0.75rem; margin-top: 3.125rem; margin-bottom: 5.4375em; min-height: 9.375em;}
  .main .card .content{align-items: center;  }
  .main .variants .type .content{gap: 1.5rem; height: calc(100% - 43px);}
  .main .variants .product-color .color {display: flex; gap: 0.875rem;}
  .main .variants .product-color .color > span {font-weight: 500; background: var(--gray-03); color: white; border-radius: 50px; width: 8.3125rem; text-align: center; height: 29px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
  .main .variants .product-color .content{flex-direction: column;
    justify-content: center; align-items: start; row-gap: 0.625rem; margin-block: 1rem; }
  .main .variants .product-color .content .swatches li {display: inline-block; width: 2.1875rem; height: 1.8125rem; background: #000; border-radius: 50px;
    box-shadow:
    inset 0 0 8px rgba(0, 0, 0, 0.15)
  }
  .main .variants .product-color .content .image .swatches li{background-position: center;background-size: cover;background-repeat: no-repeat;width: 4.125rem;}
  .main .variants .product-color .content .image .swatches{grid-template-columns: repeat(3,1fr);}
  .main .variants .product-color .content .swatches{column-gap : 0.75rem; row-gap: 0.4375rem; display: grid; grid-template-columns: repeat(4,1fr);}
  @media screen and (max-width: 1399px) {
    .main{height: auto;}
    .main .container{gap: 0; padding-block: 3em;grid-template-columns: auto;}
    .main .img-cover.item{width: 90%;max-height: 500px;}
    .main .texts .name{font-size: 2.625rem;}
  }
  @media screen and (max-width: 767px) {
    .main .variants{grid-template-columns: auto;}
    .main .variants .type .content{height: auto; padding-block: 0.5em;}
    .sp-head.with-bg {background-image: url("../images/sub/product/product-bg-mo.png"); }
  }
  @media screen and (max-width: 400px) {

  }
  
  /* feature */
  .feature {position: relative; padding-top: 3.251em; padding-bottom: 10rem;}
  .feature .sp-title {text-align: center; line-height: 1;}
  .feature .sp-body {position: relative;}
  .feature .sp-body .line {position: absolute;top: 0;left: 50%;transform: translate(-50%, 0);height: 100%;}
  .feature .item {width: 700px;height: 490px; position: relative;background-color: #f5f7f9;border-radius: 20px 0 0 20px;transition: all 0.3s;}
  .feature .item .basic {opacity: 1;}
  .feature .item .active {opacity: 0;position: absolute;}
  .feature .item .tit-box {position: absolute;top: 2.8125em;}
  .feature .item.left .tit-box {left: 2.5em; text-align: start; }
  .feature .item .tit-box .prod-sbj {font-size: 1.5rem;font-weight: 700;width: 500px;transition: all 0.3s; white-space: nowrap;}
  .feature .item .tit-box .prod-sbj.basic {color: var(--primary);}
  .feature .item .tit-box .prod-sbj.active {color: #fff;top: 0;}
  .feature .item .img-box {position: absolute;top: 50%;left: 0;transform: translateY(-50%); width: 100%;}
  .feature .item .img-box .img-cover {width: 100%;height: auto;transition: opacity 0.3s;}
  .feature .item.left .img-box .img-cover img {margin-left: auto;}
  .feature .item .img-box .basic {opacity: 1;}
  
  .feature .item .img-box .active {opacity: 0;height: auto;top: 50%;left: 0;transform: translateY(-50%);}
  .feature .item .desc {font-size: 1.0625rem;font-weight: 400;line-height: 1.5;color: #000;position: absolute;bottom: 2.8125em;left: 2.5em;transition: all 0.3s; width: calc(100% - 2.5em);}
  .feature .item.left .desc {text-align: start;} 
  .feature .item.right {border-radius: 0 20px 20px 0;}
  .feature .item.right .tit-box {right: 2.5em;text-align: right;}
  .feature .item.right .desc {left: auto;right: 2.5em;text-align: right;}
  .feature .item .plus {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 1;transition: all 0.3s;}
  .feature .item.active {background-color: var(--primary);}
  .feature .item.active .basic {opacity: 0;}
  .feature .item.active .active {opacity: 1;}
  .feature .item.active .img-box .basic {opacity: 0;}
  .feature .item.active .img-box .active {opacity: 1;}
  .feature .item.active .desc {color: #fff;}
  .feature .item.active .plus {opacity: 0;}

  @media screen and (max-width: 1399px) {
    .feature .sp-body{flex-direction: column;}
    .feature .sp-body .line{display: none;}
    .feature .item{width: 100%; border-radius: 0;}
    .feature .item.right, .feature .item.left{border-radius: 0;}
    
  }
  @media screen and (max-width: 767px) {
    .feature{padding-bottom: 5em;}
    .feature .item .tit-box .prod-sbj{width: 100%;}
    .feature .item{height: 390px;}
    .feature .item .desc{left: 1.5em;}
    .feature .item.left .tit-box {left: 1.5em;}
    .feature .item.right .tit-box {right: 1.5em;}
    .feature .item.right .desc{right: 1.5em;}
    .feature .sp-body{overflow: hidden;}
    /* .feature .item .tit-box {display: block; width: 100%;} */

  }
  /* lineup */
  .product-lineup {
    background-color: #f5f7f9;
    position: relative;
    overflow: hidden;
    /* height: 1036px; */
  }
  .product-lineup .container{position: relative; height: 100%;}
  .product-lineup .sp-head{font-family: var(--ff-secondary); position: absolute; left: 0;}
  .product-lineup .sp-head .text-4xl {margin-top: 3.75em}
  .product-lineup .sp-body {height: 100%; display: flex;
    justify-content: center;align-items: center}
  .product-lineup .sp-body .lineup-bg {
    position: absolute;
    top: 130px;
    left: 50%;
    transform: translateX(-50%);
    width: 500px;
  }
  .prod-lineup-swiper {
    position: relative;
    width: 100%;
    overflow: visible;
  }
  .prod-lineup-swiper .swiper-wrapper {align-items: center; margin-top:15.625em}
  .prod-lineup-swiper .swiper-slide {
    width: 100%;
    max-width: 400px;
    transition: all 0.5s;
    opacity: 0.2;
    transform: scale(0.6);
  }
  .prod-lineup-swiper .swiper-slide-active {
    opacity: 1;
    transform: scale(1);
  }
  .prod-lineup-swiper .swiper-slide .img-cover {
    width: 100%;
    height: 592px;
    margin-bottom: 30px;
    position: relative;
  }
  .prod-lineup-swiper .swiper-slide .img-cover img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .prod-lineup-swiper .swiper-slide .txt-box {
    text-align: center;
    opacity: 0;
    transition: all 0.5s;
  }
  .prod-lineup-swiper .swiper-slide .txt-box .sbj {
    font-size: 24px;
    font-weight: 700;
  
  }
  .prod-lineup-swiper .swiper-slide-active .txt-box {
    opacity: 1;
  }
  
  .prod-lineup-swiper .swiper-button-next,
  .prod-lineup-swiper .swiper-button-prev {
    width: 4.375rem;
    height: 4.375rem;
    background: none;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 10px 16px 0 rgba(0, 0, 0, 0.25);
    z-index: 10;
  }
  .prod-lineup-swiper .swiper-button-next::after,
  .prod-lineup-swiper .swiper-button-prev::after {
    display: none;
  }
  .prod-lineup-swiper .swiper-button-next {
    right: 10%;
  }
  .prod-lineup-swiper .swiper-button-prev {
    left: 10%;
  }
  
  .prod-lineup-swiper .swiper-button-next img,
  .prod-lineup-swiper .swiper-button-prev img {
    display: block;
    width: 4.375em;
    height: 4.375em;
    transition: opacity 0.3s;
  }
  .prod-lineup-swiper .swiper-button-next img.disabled,
  .prod-lineup-swiper .swiper-button-prev img.disabled {
    display: none;
  }
  .prod-lineup-swiper .swiper-button-next img.active,
  .prod-lineup-swiper .swiper-button-prev img.active {
    display: block;
  }
  
  .prod-lineup-swiper .swiper-button-disabled img.disabled {
    display: block;
  }
  .prod-lineup-swiper .swiper-button-disabled img.active {
    display: none;
  }
  
  .go-to-list {padding-block: 8.75em 12.5em;position: relative;background-color: #F5F7F9;}
  .go-to-list .container {display: flex;justify-content: center;}
  .go-to-list .btn {justify-content: center;}
  

  @media screen and (max-width: 1399px) {
    .product-lineup{overflow: hidden;}
    /* .prod-lineup-swiper{overflow: hidden;} */
    .product-lineup .sp-head .text-4xl{margin-top: 1.6em;}
    .prod-lineup-swiper .swiper-slide .img-cover{height: 492px;}
    .go-to-list{padding-block: 4.75em 8.5em;}
    .prod-lineup-swiper .swiper-button-next{right: 2.5%;}
    .prod-lineup-swiper .swiper-button-prev{left:2.5%;}
 
  }
  @media screen and (max-width: 767px) {

    .prod-lineup-swiper .swiper-slide .img-cover{height: 350px;}
    .go-to-list{padding-block: 4.3em 6.25em;}
    .prod-lineup-swiper .swiper-button-next{right: 0;}
    .prod-lineup-swiper .swiper-button-prev{left: 0;}

  }
}






/* board */


/* customer */
.board-news{
  .board_ls {width: 100%; border-top: 2px solid var(--primary); border-bottom: 1px solid #000; background-color: white; border-top: 2px solid var(--primary);} 
  .container{padding-top: 6.75rem; padding-bottom: 13.75rem;}
  .board_ls colgroup { border-spacing: 14px;}
  .board_ls .col--num {width: 90px; background-color: #FBFBFB;}
  .board_ls .col--sbj {padding: 0;}
  .board_ls .col--date {width: 170px;}
  .board_ls tr {border-bottom: 1px solid #CBCBCB;}
  
  .board_ls tr:last-child td {border-bottom: 0;}
  .board_ls tr td .num {font-size: 1.25rem; font-weight: 700; color: #CBCBCB;}
  .board_ls tr td.title {padding: 0; }
  .board_ls tr td .box {display: flex;  padding: 1.825em 1.25em; }
  .board_ls tr:last-child td .box {border-bottom: 0;}
  .board_ls tr td .box .category {font-size: 1.25rem; font-weight: 700; min-width: 14.875rem; display: flex; justify-content: center; align-items: center; font-family: var(--ff-secondary); line-height: 0;}
  .board_ls tr td .box .category.notice {color:#0088FF}
  .board_ls tr td .box .category.news {color: #135EBF}
  .board_ls tr td .box .sbj {font-size: 1.25rem; font-weight: 700; border: 0;}
  .board_ls tr td.date {font-size: 1.1875rem; font-weight: 400; color: #CBCBCB; text-align: right; width: 180px;}

  
  @media screen and (max-width: 1399px) {
    .board_ls tr td .box .category { width: 3.75rem; min-width: 3.75rem; margin-right: 1em; justify-content:unset}
    .board_ls tr td.date{width: 150px;}
  }
  @media screen and (max-width: 767px) {
    .board_ls colgroup { border-spacing: 14px;}

    .board_ls tr td .box {display: grid; grid-template-columns: 50px 1fr;  margin-right: 0; gap:0.25em; padding-bottom: 1em;}
    .board_ls tr td.date{display: none;}
    .board_ls .col--num{width: 3.125rem;}
    .board_ls tr td .box .category.notice{margin-bottom: 1em;}
    .board_ls tr:last-child td .box{display: flex; flex-direction: column;}
    .board_ls tr td .box .category{font-size: 1rem;}
  }
}
.news-detail{
  .board-view{  margin-top: 5em;padding-bottom: 10em;}
  @media screen and (max-width: 767px) {
    .board-view .btn-list{width: 100%;}
  }
}

.common-sence{
  .board_ls tr:last-child td .box{display: flex;}
  @media screen and (max-width: 767px) {
    .board_ls tr td .box{padding-top: 1.25em;}
  }
}

/* contact */

.board-form{
  .form-body{  padding-top: 7.5rem; padding-bottom: 13.75rem;}
  .form-body-head{display: flex; justify-content: space-between;align-items: end; line-height: 1;}
  .req {font-size: 18px; font-weight: 500; color: var(--primary);}

  .dd-form {margin-top:1.25rem; padding-top: 19px; border-top: 1px solid #000;}
  .dd-form-table tbody tr :where(th, td) {padding-block: 19px;}
  .dd-form .label {font-size: 1.125rem; font-weight: 500; text-align: left;}

  .dd-form .label .title span {font-size: 18px; font-weight: 500;}
  .dd-inp .inp-box {border-radius: 23px; border: 0; background-color: #F6F6F6;}
  .dd-inp .inp-box:has(textarea) {border-radius: 5px;}
  .dd-inp .inp-box input, .inquiry-form-body .dd-inp .inp-box textarea {font-size: 1.125rem; font-weight: 400; padding-inline: 2em;}
  .dd-inp .inp-box input::placeholder {color: #9C9C9C; font-weight: 400}
  .dd-form-indiv-policy {margin-top: 40px; padding-top: 65px; border-top: 1px solid #C9C9C9;}
  .dd-form-indiv-policy .title {color: #000; font-size: 1.625rem;}
  .dd-form-indiv-policy .content {height: 580px; background: #fff; border-radius: 5px; color: #707070;}
  .dd-form-indiv-policy .dd-inp .checkbox-group .checkbox label .label {font-size: 16px; color: #000;}
  .dd-inp .checkbox-group .checkbox label .chck.radio::before {background-color: var(--primary);}
  .dd-inp .checkbox-group .checkbox label input:checked ~ .chck {border-color: var(--primary);}
  .dd-form .submit-button {font-size: 18px; padding: 12px 34px; border-radius: 25px; background-color: #2C2C2C;}

  @media screen and (max-width: 767px) {
    .dd-form-table tbody tr :where(th, td){padding: 0;}
    .dd-form-indiv-policy .dd-inp .checkbox-group{flex-direction: row; gap: 1em;}
  }
}


/* video */
.video{
  .container{padding-top: 8rem; padding-bottom: 10rem; }
 .video-ls {width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.125rem;}
 .video-ls li a .thumb {width: 100%; box-shadow: none; aspect-ratio: 377/212; border: 1px solid #E0E0E0;}
 .video-ls li a .content {border-bottom: none;}
 .video-ls > li > a{height: auto;}
 .video-ls > li > a .content .title{font-size: 19px;}
 @media screen and (max-width: 1399px) {
  .video-ls {grid-template-columns: repeat(2,1fr);}
 }

 @media screen and (max-width: 767px) {
  .video-ls {grid-template-columns: repeat(1,1fr);}
 }
}

.board-tit{font-size: 2.5rem; font-weight: bold; margin-bottom: 1.75rem; line-height: 1;}
/* common-sence */
.sence{
  .board_ls {width: 100%; border-top: 2px solid var(--primary); border-bottom: 1px solid #000; background-color: white; border-top: 2px solid var(--primary);} 
  .container{padding-top: 6.75rem; padding-bottom: 13.75rem;}
  .board_ls colgroup { border-spacing: 14px;}
  .board_ls .col--num {width: 90px; background-color: #FBFBFB;}
  .board_ls .col--sbj {padding: 0;}
  .board_ls .col--date {width: 170px;}
  .board_ls tr {border-bottom: 1px solid #CBCBCB;}
  
  .board_ls tr:last-child td {border-bottom: 0;}
  .board_ls tr td .num {font-size: 1.25rem; font-weight: 700; color: #CBCBCB;}
  .board_ls tr td.title {padding: 0; }
  .board_ls tr td .box {display: flex;  padding: 1.825em 1.25em; }
  .board_ls tr:last-child td .box {border-bottom: 0;}
  .board_ls tr td .box .category {font-size: 1.25rem; font-weight: 700; min-width: 14.875rem; display: flex; justify-content: center; align-items: center; font-family: var(--ff-secondary); line-height: 0;}
  .board_ls tr td .box .category.notice {color:#0088FF}
  .board_ls tr td .box .category.news {color: #135EBF}
  .board_ls tr td .box .sbj {font-size: 1.25rem; font-weight: 700; border: 0;}
  .board_ls tr td.date {font-size: 1.1875rem; font-weight: 400; color: #CBCBCB; text-align: right;}
  
  @media screen and (max-width: 1399px) {
    .board_ls tr td .box .category { width: 3.75rem; min-width: 3.75rem; margin-right: 1em;}
  }
  @media screen and (max-width: 767px) {
    .board_ls colgroup { border-spacing: 14px;}
    .board_ls .col--date {display: none;}
    .board_ls tr td.date {display: none;}
    .board_ls .col--num{width: 3.125rem;}

  }
}

/* ecatalog */
.ecatalog{
  .container{padding-top: 8em; padding-bottom: 10em; }
  .video-ls {width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.125rem;}
  .video-ls li a .thumb {width: 100%; box-shadow: none; aspect-ratio: 280/394; max-height: 394px; }

  .video-ls li a .content {border-bottom: none;}
  .video-ls > li > a{height: auto;}
  .gall-ls--v > li > a .thumb{position: relative; background-size: contain; border: 1px solid #E0E0E0; border-radius: 0; box-shadow: none;}
  .gall-ls--v > li > a .thumb::before{content: ""; background: rgba(0, 0, 0, 0.4); position: absolute; inset: 0; visibility: hidden;}
  .gall-ls--v > li > a .thumb .icon{visibility: hidden;}


    .gall-ls--v > li:hover > a .thumb::before{visibility: visible;}
    .gall-ls--v > li:hover > a .thumb .icon{visibility: visible; z-index: 5;}

  @media screen and (max-width: 767px) {
    .video-ls {grid-template-columns: repeat(2,1fr);}
   }

}

/* 페이지네이션 */


.subpage-wrapper .paging .paging__num {background: white; color: #919191; border-radius: 0.625rem; border: 0; }
.subpage-wrapper .paging .paging__num.active {background: var(--primary); color: #fff;}


@media screen and (max-width: 1399px) {
  .sp-head.with-bg{height:  350px;}
}
@media screen and (max-width: 767px) {
}
@media screen and (max-width: 499px) {
}