@charset "utf-8";

#site-header2 .lnb{display: inline-flex;align-items: center;font-size: 16px;font-weight: 600;/*font-family: var(--ff-gm);*/-moz-transform: translateX(0px) translateY(0);-webkit-transform: translateX(0px) translateY(0);-o-transform: translateX(0px) translateY(0);-ms-transform: translateX(0px) translateY(0);transform: translateX(0px) translateY(0);-webkit-transition: all 200ms ease-in;-moz-transition: all 200ms ease-in;-ms-transition: all 200ms ease-in;-o-transition: all 200ms ease-in;transition: all 200ms ease-in;}
/* #header-faker{ height: 160px;  } */
/* #header-faker.main{ height: 60px;  } */
#site-header2 .lnb > li{ position: relative; }
#site-header2 .lnb >  li:first-child:after{ display:none;  }
#site-header2 .lnb >  li:after{position: absolute; left: 0; top: 12px; width: 1px; height: 19px; background-color: #cdcdcd; content: "";}
#site-header2 .lnb >  li >  a{display: block;padding: 10px 45px 30px; color: #8c8c8c;}
#site-header2 .lnb >  li:first-child >  a { font-size: 20px; color: #222; }
#site-header2 .lnb >  li.on >  a,
#site-header2 .lnb >  li.hov >  a,
#site-header2 .lnb >  li >  a:hover{color: #ff9600; /*text-shadow: 1px 1px 1px #000;*/}

/* #site-header2 .lnb .depth.dp2{position: absolute;width:647px; height: 370px; left: 48px;top: 25px;background: transparent;border: 0 #000 solid;font-size: 17px;padding: 60px 0 0;text-align: left;box-sizing: border-box;font-family: var(--ff-ori);font-weight: 600;display: none;} */
/* PC 헤더 카테고리 드롭다운 - 상위 카테고리 영역만큼 배경, 그 안에 글자 맞춤 */
#site-header2 .lnb .depth.dp2 {
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 0;
    display: none;
    width: 100%;
    min-width: 0;
    /* padding: 6px 0; */
    background: #fff;
    border: 1px solid #eee;
    border-top: none;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    z-index: 10;
}
#site-header2 .lnb .depth.dp2:after{position:absolute;left:180px;top:0;width:1px;height:100%;background:#c6d4e7;content:"";display: none;}
#site-header2 .lnb .depth.dp3{position: absolute;width: 220px;left: 139px;top: 41px;background: #fff;padding: 12px 0;box-sizing: border-box;display: none;z-index: 2;height: auto;border-left: 1px solid #eee;border-radius: 0 12px 12px 0;box-shadow: 4px 0 16px rgba(0,0,0,0.04);}
#site-header2 .lnb .depth.dp3 > ul{width:100%;overflow: visible;box-sizing: border-box;overflow-y: auto;padding: 1mm 0;}
#site-header2 .lnb .depth.dp4{position: absolute;width: 240px;left: 100%;top: 0;margin-left: 4px;background: #fff;padding: 12px 0;box-sizing: border-box;display: none;z-index: 3;overflow-y: auto;height: auto;border: 1px solid #eee;border-radius: 12px;box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);}
#site-header2 .lnb .depth.dp4 > ul{padding: 1mm 0;}
#site-header2 .lnb .depth.dp4 > ul > li.hov > a,
#site-header2 .lnb .depth.dp3 > ul > li.hov > a,
#site-header2 .lnb .depth.dp2 > ul > li.hov > a,
#site-header2 .lnb .depth.dp2 > ul > li > a:hover{ color:#f87b0d;}
#site-header2 .lnb .depth.dp2 > ul{
    padding: 1mm 0;
    margin: 0;
    list-style: none;
    overflow: visible;
    overflow-y: auto;
}
#site-header2 .lnb .depth.dp2 > ul > li{
    margin: 0;
}
#site-header2 .lnb .depth.dp2 > ul > li > a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 45px;
    line-height: 1.4;
    color: #000;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    -webkit-transition: background-color 0.2s ease, color 0.2s ease;
    transition: background-color 0.2s ease, color 0.2s ease;
}
#site-header2 .lnb .depth.dp2 > ul > li > a:hover{
    background-color: #fff8f0;
    color: #f87b0d;
}
#site-header2 .lnb .depth.dp2 > ul > li:last-child > a{
    border-radius: 0 0 12px 12px;
}
#site-header2 .lnb .depth.dp2 > ul > li > a i{
  font-size: 13px;
  opacity: 0;
  -moz-transform: translateX(-6px);
  -webkit-transform: translateX(-6px);
  -ms-transform: translateX(-6px);
  transform: translateX(-6px);
  -webkit-transition: opacity 0.2s ease, transform 0.2s ease;
  transition: opacity 0.2s ease, transform 0.2s ease;
  display: none;
}
#site-header2 .lnb .depth.dp2 > ul > li.hov > a i{
  opacity: 1;
  -moz-transform: translateX(0);
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}
/* dp3/dp4 링크 스타일 통일 */
#site-header2 .lnb .depth.dp3 > ul > li > a,
#site-header2 .lnb .depth.dp4 > ul > li > a{
    display: flex;
    padding: 10px 20px;
    justify-content: space-between;
    align-items: center;
    line-height: 1.3;
    color: #333;
    -webkit-transition: background-color 0.2s ease, color 0.2s ease;
    transition: background-color 0.2s ease, color 0.2s ease;
}
#site-header2 .lnb .depth.dp3 > ul > li > a:hover,
#site-header2 .lnb .depth.dp4 > ul > li > a:hover{
    background-color: #fff8f0;
    color: #f87b0d;
}
#site-header2 .lnb .depth.hov > ul > li > .depth{ display:block;  }
#site-header2 .lnb .depth > ul > li.hov > .depth{ display:block;  }
#site-header2 .lnb .depth > ul > li .tit.dep2{ font-size:24px; font-weight:700; /*font-family:var(--ff-gm);*/ margin-bottom:10px; line-height: 1.3; display: none;}
#site-header2 .lnb .depth.dp3 > ul > li > a{display:flex;padding: 7px 0;justify-content: space-between;align-items: center;line-height: 1.2;}
#site-header2 .lnb .depth.dp3 > ul > li > a i{ margin-left:15px; opacity:0}
#site-header2 .lnb .depth.dp3 > ul > li.hov > a i{ opacity:1; }
#site-header2 .lnb .depth.dp4 > ul > li > a{display:flex;padding: 7px 0;justify-content: space-between;align-items: center;line-height: 1.2;}
#site-header2 .lnb .depth.dp4 > ul > li > a i{ margin-left:15px; display: none;}
#site-header2 .lnb >  li.hov .depth.dp2{ display: block; }
#site-header2 .top1 .rgh{ display: flex;justify-content: flex-end;align-items: center; }

.bg_lnb_top{ position: fixed; left: 0; top: 160px; width: 100%; height:0; background-color: rgba(255, 255, 255, 0.85); z-index: 4;  
     -webkit-backdrop-filter: blur(10px);
   backdrop-filter: blur(10px);
 }
.menuHv .bg_lnb_top{height: 300px;}




@media screen and (max-width: 1580px){

}

.btn-cart-top{display: inline-flex;font-size: 16px;padding: 0;line-height: 1;margin-top: 2px;margin-right: 24px;align-items: center;color: #f39800;font-weight: 600;}

.btn-cart-top .t{}
.btn-cart-top .circle{width: 32px;height: 32px;background:#f39800;border-radius:50%;color:#fff;display: inline-flex;justify-content: center;align-items: center;margin-left: 9px;font-size: 14px;}

.gnb{margin-top: 3px; margin-right: 0;}
.gnb > ul{display: inline-flex; font-size: 15px;line-height: 1;font-weight: 400;color: #000;}
.gnb > ul > li{ margin-left:15px;}
.gnb > ul > li > a:hover{ color: #f39800; }

.btn_top{position: fixed;right: 30px;bottom: 30px;width: 60px;height: 60px;background-color: #FF9B00;display: flex;align-items: center;justify-content: center;z-index: 5;border-radius: 50%;font-size: 26px;color: #fff;
  -webkit-transition: all 300ms ease-in;
  -moz-transition: all 300ms ease-in;
  -ms-transition: all 300ms ease-in;
  -o-transition: all 300ms ease-in;
  transition: all 300ms ease-in; 
  -moz-transform: scale(0);
  -webkit-transform: scale(0);
  -o-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
.scrollDown .btn_top{  
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
@media screen and (max-width: 1200px){
  .btn_top{position: fixed;right: 20px;width: 44px;height: 44px; font-size: 20px; box-shadow: rgba(255, 255, 255, 0.2) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.1) 0px 4px 6px, rgba(0, 0, 0, 0.15) 0px 8px 30px;}
  .btn_top.bmenu{ bottom: 20vw; }
}
#site-header2 .bg{position: absolute;left: 0;top: -15px;z-index:0;width: 8000px;height: 189px;background-image: url(../images/tmp/bg_top_wave1.png);background-size: 100%;background-position: 0 0;background-repeat: repeat no-repeat;/*    -webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in*/animation: move_wave 50s linear infinite;-webkit-animation: move_wave 50s linear infinite;/*-webkit-animation-delay: 1s;
   animation-delay: 1s;*/
   transform: translateX(0) translateZ(0) scaleY(1);
   display: none;
}
#site-header2 .bg2{position: absolute;left: 0;top: -20px;z-index:0;width: 8000px;height: 189px;background-image: url(../images/tmp/bg_top_wave2.png);background-size: 100%;background-position: 0 0;background-repeat: repeat no-repeat;z-index: 2;/*    -webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in*/animation: move_wave 80s linear infinite;-webkit-animation: move_wave 80s linear infinite;/*-webkit-animation-delay: 1s;
   animation-delay: 1s;*/opacity: 0.4;
   display: none;
}

#site-header2 .bg3{position: absolute;left: 0;top: -10px;z-index:0;width: 8000px;height: 189px;background-image: url(../images/tmp/bg_top_wave1.png);background-size: 100%;background-position: 0 0;background-repeat: repeat no-repeat;z-index: 2;/*    -webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in*/animation: move_wave 120s linear infinite;-webkit-animation: move_wave 120s linear infinite;/*-webkit-animation-delay: 1s;
   animation-delay: 1s;*/opacity: 0.1;
   display: none;
}



   #site-header2.tmp-header2{position: relative; width: 100%;
    /* height: 160px; */
    background-color: transparent; z-index: 5; 
      -webkit-transition: all 200ms ease-in;
      -moz-transition: all 200ms ease-in;
      -ms-transition: all 200ms ease-in;
      -o-transition: all 200ms ease-in;
      transition: all 200ms ease-in;
      background-color: #fff;
  }

  .tmp-header2 .top1{max-width: 1920px; margin: 0 auto; height: 120px; display: flex;justify-content: space-between;position:relative;z-index:7;font-size:0;
      -webkit-transition: all 200ms ease-in;
      -moz-transition: all 200ms ease-in;
      -ms-transition: all 200ms ease-in;
      -o-transition: all 200ms ease-in;
      transition: all 200ms ease-in;
  }
  .tmp-header2 .top1 > *{ flex:1; display: flex; align-items: center;}
  .tmp-header2 .top1 .cen{ display: flex; align-items: center; justify-content: center;  }
   

  .tmp-header2 .top1 img{
   -webkit-transition: all 200ms ease-in;
   -moz-transition: all 200ms ease-in;
   -ms-transition: all 200ms ease-in;
   -o-transition: all 200ms ease-in;
   transition: all 200ms ease-in; 
}
.tmp-header2 .mid{ max-width: 1920px; margin: 0 auto; height: 94px; padding: 0; background-color: transparent;display: flex;justify-content: space-between;align-items: center;position:relative;z-index:5;font-size: 0;height: auto;}
.tmp-header2 .mid .lft{ flex:10%; display: flex; }
.tmp-header2 .mid .cen{ flex:80%; display: flex; align-items: center;justify-content: center;}
.tmp-header2 .mid .rgh{ flex:10%; display: flex; justify-content: flex-end;margin-top: -22px;}
.tmp-header2 .mid .rgh > *{ margin-left:25px; }
@media (hover: hover) {
  .tmp-header2 .mid .rgh a:hover{ opacity:0.7; }
}

.tmp-header2 .top1 .lft .logo{ margin-top: 0; display: inline-block;
   -webkit-transition: all 200ms ease-in;
   -moz-transition: all 200ms ease-in;
   -ms-transition: all 200ms ease-in;
   -o-transition: all 200ms ease-in;
   transition: all 200ms ease-in; 
}
.tmp-header2 .top1 .lft .logo img{ 
   max-width: 150px;
   width: 100%;
   -webkit-transition: all 200ms ease;
   -moz-transition: all 200ms ease;
   -ms-transition: all 200ms ease;
   -o-transition: all 200ms ease;
   transition: all 200ms ease;
}
.scrollDown .tmp-header2 .lnb{-moz-transform: translateX(0px) translateY(10px);-webkit-transform: translateX(0px) translateY(10px);-o-transform: translateX(0px) translateY(10px);-ms-transform: translateX(0px) translateY(10px);transform: translateX(0px) translateY(10px);}


@media screen and (max-width: 2000px){
   .tmp-header2 .top1,
   .tmp-header2 .mid{ margin: 0 40px;  }
}



/*.scrollDown #site-header2 .bg{
  background-position: 220px 0;

}*/

/*.scrollDown #site-header2.tmp-header2{ margin-top: -50px; }*/
/*.scrollDown .tmp-header2 .top1 .lft .logo{ margin-top: 64px; }
.scrollDown .tmp-header2 .top1 .lft .logo img{ width: 100px;  }*/
/*.scrollDown #site-header2 .lnb{ font-size: 22px; }*/

@keyframes move_wave {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(-50%) translateZ(0) scaleY(1)
        transform: translateX(0%) translateZ(0) scaleY(1)
    }
    100% {
        transform: translateX(-50%) translateZ(0) scaleY(1)
    }
}



#site-header.tmp-header{position: fixed; width: 100%; height: 178px; background-color: transparent;}
.tmp-header .lft{  }
.tmp-header .top1{ height: 47px; background-color: #171a1d; display: flex; justify-content: space-between; }
.tmp-header .mid{padding: 30px; background-color: transparent; display: flex;justify-content: space-between;align-items: center;}
#site-header.tmp-header.scrollDown .mid{padding: 20px 30px;}
#site-header.tmp-header.scrollDown{ margin-top: -47px; height: 135px; }
#site-header.tmp-header .mid .lft img{ 
   max-width: 100%;
   width: 100%;
   -webkit-transition: all 200ms ease;
   -moz-transition: all 200ms ease;
   -ms-transition: all 200ms ease;
   -o-transition: all 200ms ease;
   transition: all 200ms ease;
}
#site-header.tmp-header.scrollDown .mid .lft img{ width: 110px;}
#site-header.tmp-header.scrollDown .mid .rgh{padding-top: 5px;}


.wrap_basket_out{position: fixed;right:0;top: 0;height: 100vh;width: 0;z-index: 100000;}
.wrap_basket_out .inner_basket_out{width: 180px;min-width: 180px;height: 100%;position: absolute;left: 0;top: 0;display: flex;flex-direction: column; background: #fff;z-index: 1;border-left: 1px #d2e0e6 solid;
   box-shadow: 0px 4px 13px -5px rgba(0,0,0,0.39);
   -webkit-box-shadow: 0px 4px 13px -5px rgba(0,0,0,0.39);
   -moz-box-shadow: 0px 4px 13px -5px rgba(0,0,0,0.39);
   -webkit-transition: left 300ms ease;
   -moz-transition: left 300ms ease;
   -ms-transition: left 300ms ease;
   -o-transition: left 300ms ease;
   transition: left 300ms ease; }
   .wrap_basket_out.active .inner_basket_out{ left: -180px; }
   .wrap_basket_out .ly_row{  }
   .wrap_basket_out .lst{ margin-top:40px;}
   .wrap_basket_out .lst li.add{
    margin-bottom: 0; padding-bottom: 0;
    height: 0; overflow: hidden;
    -moz-transform: scale(0) translateX(0px) translateY(0px);
    -webkit-transform: scale(0) translateX(0px) translateY(0px);
    -o-transform: scale(0) translateX(0px) translateY(0px);
    -ms-transform: scale(0) translateX(0px) translateY(0px);
    transform: scale(0) translateX(0px) translateY(0px);
}
.wrap_basket_out .lst li{ 
    height: auto;
    -moz-transform: scale(1) translateX(0px) translateY(0px);
    -webkit-transform: scale(1) translateX(0px) translateY(0px);
    -o-transform: scale(1) translateX(0px) translateY(0px);
    -ms-transform: scale(1) translateX(0px) translateY(0px);
    transform: scale(1) translateX(0px) translateY(0px); 
    position:relative; width:120px; margin:0 auto; text-align:center; margin-bottom:20px; padding-bottom:20px; border-bottom:1px #ddd solid;
    transition: all 300ms cubic-bezier(0.465, 0.180, 0.130, 0.990); /* custom */

    transition-timing-function: cubic-bezier(0.465, 0.180, 0.130, 0.990); /* custom */

}
.wrap_basket_out .lst li:last-child{margin-bottom:0;border:0;}
.wrap_basket_out .lst li .close{ position:absolute; right:0; top:0; }
.wrap_basket_out .lst li .ea{
    position: absolute;
    left: 2px;
    top: 12px;
    min-width: 30px;
    height: 30px;
    background: #000;
    z-index: 5;
    color: #fff;
    font-size: 14px;
    border-radius: 50px;
    text-align: center;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    padding: 0 5px;
}
.wrap_basket_out .lst li .thumb{display:flex;justify-content: center;height: 127px;align-items: center;}
.wrap_basket_out .lst li .thumb img{ max-height:90px; }
.wrap_basket_out .lst li .cont{ font-size:14px; font-weight:700; line-height:1.4; }
.wrap_basket_out .top{ text-align: right; }
.wrap_basket_out .info{margin-top:25px;line-height:0;text-align:center;}
.wrap_basket_out .info p{display:flex;align-items:center;justify-content: center;line-height: 1;}
.wrap_basket_out .info p .basket1{ margin-top:-1px; }
.wrap_basket_out .info p .t{color:#000;font-weight:800;font-size:16px;margin: 0 10px;}
.wrap_basket_out .info .num{width:30px;height:30px;border-radius:50%;background:#ee8e1e;color: #fff;display: inline-flex;justify-content: center;align-items: center;font-size: 14px;font-weight: 600;margin-top: -2px;}
.wrap_basket_out .top a{display:inline-flex;width: 60px;height:47px;text-align: center;justify-content: center;align-items: center;}
.wrap_basket_out .lst{margin-top: 30px;height: calc(100% - 250px);overflow-x: hidden;overflow-y: auto;width: 81%;margin-left: auto;margin-right: auto;}
.wrap_basket_out .bot{
    position: absolute;
    left: 0;
    bottom: 0;
    background: #fff;
    padding: 20px;
    text-align: center;
    height: 110px;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.wrap_basket_out .price_total{ font-weight:800; font-size:17px; }
.wrap_basket_out .btns{width:100%;margin-top: 9px;}
.wrap_basket_out .btns a{display:inline-flex;font-size:14px;width:120px;height: 40px;border: 2px #000 solid;border-radius:100px;justify-content: center;align-items: center;font-weight: 800;}
@media (min-width:840px) {
    .wrap_basket_out * {
        -ms-overflow-style: -ms-autohiding-scrollbar;
        scrollbar-width: thin;
        scrollbar-color: #455a64 #9db5c1; 
    }

    .wrap_basket_out ::-webkit-scrollbar {
        height: .8rem;
        width: 3px;
        
    }

    .wrap_basket_out ::-webkit-scrollbar-track {
        background: #efefef; 
    }

    .wrap_basket_out ::-webkit-scrollbar-thumb {
        background-color: #f87b0d;
        border-radius: .9rem;
        cursor: pointer !important;
    }
}



@media screen and (max-width: 1200px){
  
  .wrap_basket_out .inner_basket_out{
     width: 50vw;
     min-width: auto;
   }
   .wrap_basket_out.active .inner_basket_out{left: -50vw;}
   .wrap_basket_out .lst{ margin-top:5vw;}
  .wrap_basket_out .lst li{
      position:relative;
      width: 31vw;
      margin-bottom: 5vw;
      padding-bottom: 6vw;
      border-bottom:1px #ddd solid;
       /* custom */
       /* custom */
  }
  .wrap_basket_out .lst li:last-child{margin-bottom:0;border:0;}
  .wrap_basket_out .lst li .close{ position:absolute; right:0; top:0; }
  .wrap_basket_out .lst li .ea{
      position: absolute;
      left: -3vw;
      top: 1vw;
      min-width: 7vw;
      height: 7vw;
      font-size: 3.3vw;
      border-radius: 25vw;
      padding: 0 1.2vw;
  }
  .wrap_basket_out .lst li .thumb{display:flex;justify-content: center;height: 26vw;align-items: center;}
  .wrap_basket_out .lst li .thumb img{max-height: 18vw;}
  .wrap_basket_out .lst li .cont{font-size: 3.3vw;font-weight:700;line-height:1.4;}
  .wrap_basket_out .top{ text-align: right; }
  .wrap_basket_out .info{margin-top: 3vw;}
  .wrap_basket_out .info p{display:flex;align-items:center;justify-content: center;line-height: 1;}
  .wrap_basket_out .info p .basket1{ margin-top:-1px; }
  .wrap_basket_out .info p .t{color:#000;font-weight:800;font-size: 3.6vw ;margin: 0 4vw 0 2vw;}
  .wrap_basket_out .info .num{width: 7vw;height: 7vw;font-size: 3vw;margin-top: 0;padding-top: 0.3vw;box-sizing: border-box;}
  .wrap_basket_out .top a{display:inline-flex;width: 10vw;height: 10vw;font-size: 5vw;}
  .wrap_basket_out .lst{margin-top: 7vw;height: calc(100% - 60vw);overflow-x: hidden;overflow-y: auto;width: 81%;margin-left: auto;margin-right: auto;}
  .wrap_basket_out .bot{
      padding: 1vw;
      height: 28vw;
      box-sizing: border-box;
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
  }
  
  .wrap_basket_out .price_total{font-weight:800;font-size: 4vw;}
  .wrap_basket_out .btns{width:100%;margin-top: 2vw;}
  .wrap_basket_out .btns a{display:inline-flex;font-size: 3.2vw;width: 90%;height: 9vw;border-radius: 25vw;}

  
}

@media screen and (max-width: 1480px){
  #site-header2 .bg{ top: -35px; }
  #site-header2 .bg2{ top: -40px; }
  #site-header2 .bg3{ top: -30px; }  
  /*#header-faker, #site-header.sub{ height: 90px; }
  #site-header2.tmp-header2{ height: 140px; }*/
}
@media screen and (max-width: 1200px){
   .tmp-header2 .lnb{ margin-left: -40px; }
   .tmp-header2 .mid .lft{ display: none; }
   .tmp-header2 .mid .cen{ justify-content: flex-start; }
   #site-header2 .lnb >  li >  a{display: block;padding: 6px 35px 40px;font-size: 18px;}
}



button{cursor: pointer;}
#site-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 100px;
  box-sizing: border-box;
/*  background-color: rgba(0,0,0,0.75);*/
background: #fff;
-webkit-transition: all 0.20s ease-in-out;
transition: all 0.20s ease-in-out;
font-weight: 400;
/*  border-bottom: 1px solid rgba(255, 255, 255, 0.3);*/
}
#site-header a{   font-weight: 400;}
#site-header:after { content: ''; position: fixed; top: 0; right: 0; width: 100%; height: 0%; max-width: 1400px; background-color: #123896; z-index: 0; 
  -webkit-transition: height 0.25s ease-in-out;
  transition: height 0.25s ease-in-out;
}

#site-header > .top{height: 43px;display: flex;  font-size:0.9375em;position: relative;z-index: 2;}
#site-header > .top a.fm{display:block;margin-top: 0;}
#site-header > .top > .col{background:#fff;}
#site-header > .top > .col.lft{background:transparent;min-width: 304px;width: 304px;}
#site-header > .top > .col.rgh{width: 100%;text-align: right;display: flex;justify-content: flex-end;align-items: center;padding-right: 33px;line-height: 1;}
#site-header > .top .gnb{display:flex;}
#site-header > .top .gnb a{display: inline-flex;width: 152px;height: 43px;align-items: center;justify-content: center;font-size: 15px; background-color: #fff; color: #000;}
#site-header > .top .gnb a.on{color: #ffbe00;background-color: transparent;}
/*#site-header > .top .gnb a:hover{color: #ffbe00;}*/

#site-header > .inner {padding: 0 70px;height: 100px;margin: 0 auto;display: flex;align-items: center;position: relative;justify-content: space-between;}
#site-header > .inner .area_rgh{display: flex;align-items: center;}
#site-header > .inner .area_rgh .lang{ line-height:1;}
#site-header > .inner .area_rgh .lang a{ display:inline-block; color:#000; font-size:14px; margin-right:7px; border-bottom:2px transparent solid; padding:3px 0; opacity:0.6;}
#site-header > .inner .area_rgh .lang a.active{ border-color:#fff; opacity:1; }
#site-header > .inner .area_rgh .lang_ty2{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
#site-header > .inner .area_rgh .lang_ty2 a{
    font-size: 15px;
    font-weight: 700;
    margin-left: 15px;
    display: inline-block;
    border-bottom: 3px transparent solid;
    color: #8abad9;
}
#site-header > .inner .area_rgh .lang_ty2 a:hover{ color:#000}
#site-header > .inner .area_rgh .lang_ty2 a.on{
    color: #000;
    border-color: #000;
}
#site-header.scrollDown > .inner .area_rgh .lang a,
.header_hover #site-header > .inner{ /*border-bottom: 1px solid #ddd;*/ color: #222;}
.header_hover #site-header > .inner .area_rgh .lang a{  color:#222;}
.header_hover #site-header > .inner .area_rgh .lang a:hover{ opacity: 1; }
#site-header.scrollDown > .inner .area_rgh .lang a.active,
.header_hover #site-header > .inner .area_rgh .lang a.active{ border-color:#222; opacity:1; }

#site-header > .inner > * { z-index: 1; }
#site-header > .inner > * + * { margin-left: 30px; }
#site-header > .inner > .ara_cen {margin-left: 0;position: absolute;left: calc(50% - 30px);}
#site-header .logo { margin: 0; z-index: 0; }
/*#site-header .logo a { display: block; width: 250px; height: 60px; font-size: 0; background: url(../images/common/site-logo.svg) center no-repeat; 
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}*/
#site-header .logo a {
  display: block;
  width: 118px;
  height: 27px;
  font-size: 0;
  background: url(../images/common/h_logo.png) center no-repeat;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  background-size: 100%;
}

#site-header .menu {padding-left: 65px; display: flex;align-items: center;justify-content: flex-end;-moz-transition: all 300ms ease-in-out;-ms-transition: all 300ms ease-in-out;-o-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;margin: 0 auto;}
#site-header .menu > li {padding: 40px 45px;width: auto;text-align: center;}
#site-header .menu > li > a {display: block;font-size: 18px;color: #fff;font-weight: 600;position: relative;z-index: 1;-webkit-transition: color 0.5s ease;transition: color 0.5s ease;}
#site-header .menu > li:after{width:50%; height:3px; position:absolute; left:50%; margin-left:-25%; bottom:3px; content:""; background:#fff; -webkit-transition: opacity 0.5s ease;transition: opacity 0.5s ease; opacity: 0; display: none;}
/*#site-header .menu > li.hover:after*/
#site-header .menu > li.active:after{  opacity: 1; }
#site-header .menu > li > a[target]:after { content: ''; display: inline-block; width: 14px; height: 14px; background-image: url(../images/ico/ico_link_b.png); background-size: contain; background-repeat: no-repeat; margin-left: 7px; -webkit-transition: background 0.5s ease; transition: background 0.5s ease; }
#site-header .menu > li > .depth2 { position: fixed; visibility: hidden; opacity: 0; width: 100%; height: 0%; max-width: 1400px; top: 0; right: 0; overflow: hidden; padding-top: 140px; box-sizing: border-box; display: flex; background-color: transparent; }
#site-header .menu > li > .depth2 > ul { width: 340px; padding: 35px 0; padding-left: 40px; }
#site-header .menu > li > .depth2 > ul > li + li { margin-top: 20px; }
#site-header .menu > li > .depth2 > ul > li > a { display: inline-block; font-size: 26px; color: #ffff; padding: 10px 30px; border-radius: 50px; }
#site-header .menu > li > .depth2 > ul > li > a:hover,
#site-header .menu > li > .depth2 > ul > li > a:focus,
#site-header .menu > li > .depth2 > ul > li.active > a { background-color: #1a47b7; }
#site-header .menu > li > .depth2 > div { flex-grow: 1; padding: 0 50px; padding-top: 35px; display: flex; flex-direction: column; }
#site-header .menu > li > .depth2 > div > .title { font-size: 38px; color: #fff; font-family: 'S-CoreDream-5Medium', sans-serif; max-width: 760px; margin-bottom: 50px; }
#site-header .menu > li > .depth2 > div > .img { width: 100%; height: 100%; max-height: 750px; background-size: cover; background-position: center; }
#site-header .lang { position: relative; text-align: center; line-height: 0; margin-left: 40px; }
#site-header .lang .img { display: inline-block; width: 60px; height: 24px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url(../images/common/lang_select_w.png); font-size: 0; vertical-align: middle; -webkit-transition: background 0.5s ease; transition: background 0.5s ease; }
#site-header .lang > .depth {position: absolute;visibility: hidden;max-height: 0;margin-top: -1px;background-color: #fff;top: 100%;left: 50%;transform: translateX(-50%);border: 1px solid #adadad;border-radius: 5px;box-shadow: 0px 22px 22px 0px rgba(0, 0, 0, 0.12);overflow: hidden;box-sizing: border-box;margin-top: 5px;}
#site-header .lang > .depth > ul { padding: 15px 20px; }
#site-header .lang > .depth > ul > li + li { margin-top: 10px; }
#site-header .lang > .depth > ul > li > a {display: inline;font-size: 15px;color: #cc8600;line-height: 1.2;border-bottom: 1px solid transparent;white-space: nowrap;}
#site-header .lang > .depth > ul > li > a.on,
#site-header .lang > .depth > ul > li > a:hover { color: #000000; border-color: #222; }
#site-header .lang.active > .depth { visibility: visible; max-height: 300px; -webkit-transition: max-height 0.5s ease; transition: max-height 0.5s ease; }

#site-header .withPosco{margin-top: -6px;}
#site-header .withPosco .img .header_link {
    display: block;
    width: 100%;
    height: 28px;
    cursor: pointer;
}

#site-header .withPosco .img {
    width: 144px;
    height: 28px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../images/common/h_withposco_w.png);
}

#site-header .withPosco .img p {
    position: absolute;
    left: -999rem;
}

#site-header .navBtn { margin-left: 10px; }
#site-nav .closeBtn,
#site-header .navBtn .menu_btn { width: 60px; height: 60px; background-color: transparent; border-radius: 50%; position: relative; border: 0; cursor: pointer; padding: 0; display: flex; align-items: center; flex-direction: column; justify-content: center; text-align: center; font-size: 11px; color: #fff; font-family: 'Roboto', sans-serif; -webkit-transition: background 0.2s ease; transition: background 0.2s ease; }
#site-header .navBtn .menu_btn .line {width: 33px; text-align: right; font-size: 0;}
#site-header .navBtn .menu_btn .line span {display: inline-block;width: 100%;height: 3px;background-color: #fff;-webkit-transition: all 0.5s ease;transition: all 0.5s ease; border-radius: 5px;}
#site-header .navBtn .menu_btn .line span + span { margin-top: 7px; }
#site-header .navBtn .menu_btn .line span.line_02{ width:70%;}
#site-header .navBtn .menu_btn:hover  .line span{ opacity: 0.8; }
#site-header .navBtn .menu_btn:hover  .line span.line_02{ width:100%;}
#site-header .navBtn .menu_btn i{
    display: none;
}
.openGnb #site-header .navBtn .menu_btn .line{ display:none; }
.openGnb #site-header .navBtn .menu_btn i{
    color: #000;
    display: inline;
    font-size: 27px;
}
#site-header .navBtn .menu_btn:hover i{
    color: #fff;
}



#site-header.menuOn:after { height: 100%; }
#site-header.menuOn .menu > li > a { color: #a0afd5; }
#site-header.menuOn .menu > li > a[target]:after { background-image: url(../images/ico/ico_link_b3.png); }
#site-header.menuOn .menu > li > .depth2 { height: 100%; }
#site-header.menuOn .menu > li.on > a { color: #fff; }
#site-header.menuOn .menu > li.on > a[target]:after { background-image: url(../images/ico/ico_link_w.png); }
#site-header.menuOn .menu > li.on > .depth2 { visibility: visible; opacity: 1; -webkit-transition: opacity 0.75s ease; transition: opacity 0.75s ease; }
#site-header.menuOn .lang .img { background-image: url(../images/common/lang_select_b.png); }
#site-header.menuOn .withPosco .img { background-image: url(../images/common/with_posco_w.png); }
#site-header.menuOn .navBtn .menu_btn { background-color: #1d48b2; }
#site-header.news { background-color: transparent; }
#site-header.news .logo a { background: url(../images/common/site-logo-w.svg) center no-repeat; }
#site-header.news .menu > li > a { color: #fff; }
#site-header.news .navBtn .menu_btn .line span { background-color: #fff; }
#site-header.news .lang .img { background-image: url(../images/common/lang_select_w.png); }

.header_hover #site-header,
body.openGnbTy2 #site-header,
#site-header.scrollDown { background:#fff; border-bottom: 1px solid #e6e6e6; }
.header_hover #site-header .logo a,
body.openGnbTy2 #site-header .logo a,
#site-header.scrollDown .logo a{background-image: url(../images/common/h_logo.png);}

#site-header.scrollDown .withPosco .img{background-image: url(../images/common/h_withposco.png);}
#site-header.scrollDown .lang .img{ background-image: url(../images/common/lang_select.png); }



.header_hover #site-header  .menu > li > a,
body.openGnbTy2 #site-header .menu > li > a,
#site-header.scrollDown .menu > li > a{color:#222;}
.header_hover #site-header .navBtn .menu_btn .line span,
body.openGnbTy2 #site-header .navBtn .menu_btn .line span,
#site-header.scrollDown .navBtn .menu_btn .line span{background: #222;}
.header_hover #site-header .navBtn .menu_btn,
body.openGnbTy2 #site-header .navBtn .menu_btn,
#site-header.scrollDown .navBtn .menu_btn{color:#222;}
.header_hover #site-header .menu > li:after,
body.openGnbTy2 #site-header .menu > li:after,
#site-header.scrollDown .menu > li:after{background-color: #222;  display: none;}

body.openGnbTy2 { overflow: hidden; }
body.openGnbTy2 #site-header .menu{ display: none; }
body.openGnbTy2 #allmenu { visibility: visible; opacity: 1; }
body.openGnbTy2 #site-header .navBtn .menu_btn .line .line_01{
  -moz-transform: rotate(45deg) translateX(9px) translateY(1px);
  -webkit-transform: rotate(45deg) translateX(9px) translateY(1px);
  -o-transform: rotate(45deg) translateX(9px) translateY(1px);
  -ms-transform: rotate(45deg) translateX(9px) translateY(1px);
  transform: rotate(45deg) translateX(9px) translateY(1px);
}
body.openGnbTy2 #site-header .navBtn .menu_btn .line .line_03{
  -moz-transform: rotate(315deg) translateX(6px) translateY(1px);
  -webkit-transform: rotate(315deg) translateX(6px) translateY(1px);
  -o-transform: rotate(315deg) translateX(6px) translateY(1px);
  -ms-transform: rotate(315deg) translateX(6px) translateY(1px);
  transform: rotate(315deg) translateX(6px) translateY(1px);
}
body.openGnbTy2 #site-header .navBtn .menu_btn .line .line_02{ display:none; }



#site-header .dep2{
  position: absolute;
  left: 0;
  top: 106px;
  padding-top: 0;
  margin-left: 0;
  z-index: 5;
  font-size: 16px;
  text-align: center;
  border-style: solid;
  border-width: 0 0 0 1px;
  border-color: transparent;
  width: 100%;
  box-sizing: border-box;
  opacity:0;
  visibility:hidden;
  height: 0;
}
#site-header .last .dep2{border-width: 0 1px;}

#site-header .dep2 a{color:#8b8b8b; font-size:14px;}
#site-header .dep2 li{margin-top:15px;}

#site-header .menu > li{
  position: relative;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

.header_hover #site-header .menu {}
.header_hover #site-header{background: #fff;height: 320px;}
.header_hover #site-header .dep2{
    opacity: 1;
    visibility: visible;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
    -ms-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    height: 217px;
    opacity:1;
    border-color: #e9e9e9;
    background-color: #fff;
}
.header_hover  #site-header .menu > li > a{color:#222;}
.header_hover  #site-header .menu > li.hover .dep2{ background:#f9fafb;}
.header_hover  #site-header .menu > li.hover > a{color:#00b8ff;}

#site-header .dep2 a:hover{color:#222;  border-bottom:1px #222 solid;}
.header_hover  #site-header .menu > li{padding: 40px 60px; width: auto;text-align: center;}

#site-header .banner_head{position: absolute;left: 30px;top: 70px; opacity: 0; visibility: hidden;}
.header_hover  #site-header .banner_head{
  top: 130px; opacity: 1;
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  -ms-transition-delay: 0.1s;
  -o-transition-delay: 0.1s;
  transition-delay: 0.1s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  visibility: visible;
}



@media screen and (max-width: 1680px){
  #site-header { height: 80px; }
  #site-header .menu > li > a{ font-size: 16px; }
  #site-header > .inner { padding: 0 40px; }
  #site-header .menu > li { padding: 30px 30px; width: auto;text-align: center; }
  #site-header .dep2{top: 85px;}
  .header_hover #site-header .dep2{height: 237px;}
  .header_hover  #site-header .menu > li{padding: 30px 50px;width: auto; text-align: center;}
  .header_hover #site-header{background: #fff;height: 320px;}
}



@media screen and (max-width: 1380px){
  #site-header .menu > li { padding: 30px 20px;}
  .header_hover  #site-header .menu > li{ padding: 30px 30px; }
}



@media screen and (max-width: 1180px){
  #site-header .menu{ display: none; }
}

@keyframes depth2_ani {
    0% {
        opacity: 0;
        -webkit-transform: translate(0px, 20px);
        -moz-transform: translate(0px, 20px);
        -o-transform: translate(0px, 20px);
        -ms-transform: translate(0px, 20px);
        transform: translate(0px, 20px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0px);
        -moz-transform: translate(0, 0px);
        -o-transform: translate(0, 0px);
        -ms-transform: translate(0, 0px);
        transform: translate(0, 0px);
    }
}




#site-nav {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background-color: #fff;
  display: flex;
  align-items: center;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0.7s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
  transition: visibility 0.7s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
  color: #fff;
}
#site-nav a{color: #000;}
#site-nav .homeBtn{break-after: avoid;position:absolute;right: 63px;top: 35px;width: 50px;border:1px #fff solid;display:inline-flex;justify-content: center;align-items: center;padding: 0;-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;border-radius: 50%;height: 50px;font-size: 0;line-height: 0;}
#site-nav .homeBtn:hover{background: rgb(255 255 255 / 15%);}
#site-nav .depth1 > ul > li > a.m{display:none;}
#site-nav > .inner {position:absolute;left:0;top:0;width: 50%;height: 100%;display: flex;margin:0 auto;background: #fff;}
#site-nav .visual{position:fixed; left:0; top:0; width:100%; height:100vh; background-size:cover; z-index:-1;}

#site-nav .menu_container {display: none;align-items: center;justify-content: center;min-width: 100%;height: 100%;box-sizing: border-box;}
#site-nav .depth1{ min-width: 100%;}
#site-nav .footer_menu,
#site-nav .depth1 > ul{display:flex;flex-wrap: wrap;flex-direction: column;align-items: center;}
#site-nav .footer_menu{ min-width:1320px; }
#site-nav .footer_menu > .col,
#site-nav .depth1 > ul > li{width: 310px;margin: 0;position: relative;text-align: left;}
#site-nav .depth1 > ul > li > a{font-size: 41px;font-weight: 700;display:block;padding-bottom: 3px;position:relative;}
#site-nav .depth1 > ul > li > a i.icon-open{font-size: 0.8em;line-height:1;-moz-transform: translateY(3px);-webkit-transform: translateY(3px);-o-transform: translateY(3px);-ms-transform: translateY(3px);transform: translateY(1px);display: inline-block;margin-left: 8px;}
#site-nav .depth1 > ul > li.ck.mn_c1 > a,
#site-nav .depth1 > ul > li.mn_c1.active > a,
#site-nav .mn_c1 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c1 a:hover{color: #01bc92;}
#site-nav .depth1 > ul > li.ck.mn_c2 > a,
#site-nav .depth1 > ul > li.mn_c2.active > a,
#site-nav .mn_c2 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c2 a:hover{color: #1694e7;}
#site-nav .depth1 > ul > li.ck.mn_c3 > a,
#site-nav .depth1 > ul > li.mn_c3.active > a,
#site-nav .mn_c3 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c3 a:hover{color: #2bc136;}
#site-nav .depth1 > ul > li.ck.mn_c4 > a,
#site-nav .depth1 > ul > li.mn_c4.active > a,
#site-nav .mn_c4 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c4 a:hover{color: #4e59ec;}
#site-nav .depth1 > ul > li.ck.mn_c5 > a,
#site-nav .depth1 > ul > li.mn_c5.active > a,
#site-nav .mn_c5 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c5 a:hover{color: #ee8e1e;}
#site-nav .depth1 > ul > li.ck.mn_c6 > a,
#site-nav .depth1 > ul > li.mn_c6.active > a,
#site-nav .mn_c6 .depth2 > ul > li.active > a,
#site-nav .depth1 > ul > li.mn_c6 a:hover{color: #eb4ab0;}

#site-nav .depth1 > ul > li.active > a:after{width:100%;}
#site-nav .depth1 > ul > li .depth2{
  display: none; overflow: hidden;
 /* max-height: 0;
  padding-bottom: 0;
  overflow:hidden;
  -webkit-transition: max-height 800ms ease;
  -moz-transition: max-height 800ms ease;
  -ms-transition: max-height 800ms ease;
  -o-transition: max-height 800ms ease;
  transition: max-height 800ms ease;*/
}
/*#site-nav .depth1 > ul > li.ck .depth2{
  max-height:500px;
  padding-bottom:0;
  visibility: visible;
  
}
*/



#site-nav .depth2 > ul{padding: 10px 0;}
#site-nav .depth2 > ul > li{margin-bottom:5px;}
#site-nav .depth2 > ul > li:last-child{margin-bottom: 10px;}
#site-nav .footer_menu > .col > ul > li > a,
#site-nav .depth2 > ul > li > a{font-size: 22px;font-weight: 600;color: #000;opacity: 0.7;} 
#site-nav .footer_menu > .col > ul > li > a.active,
#site-nav .footer_menu > .col > ul > li > a:hover,
#site-nav .depth2 > ul > li.active > a,
#site-nav .depth2 > ul > li > a:hover{color: #000; opacity: 1;}
#site-nav .depth1 > ul > li.active > a:after{}
#site-nav .depth1 > ul > li .visual{ 
   -webkit-transition:  opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
   transition: opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
   opacity:0;
}
#site-nav .depth1 > ul > li.active .visual{ opacity:1;}
#site-nav .footer_menu{
    margin-top: 40px;
}
#site-nav .footer_menu > .col{}
#site-nav .footer_menu .h_1{
    font-size: 22px;
    font-size: 1.375em;
    font-weight: 600;
}
#site-nav .footer_menu > .col > ul{}
#site-nav .footer_menu > .col > ul > li{
    margin-bottom: 6px;
}
#site-nav .footer_menu > .col > ul > li > a{}
#site-nav .logo{ position:absolute;left: 0;top: 40px;}
#site-nav .closeBtn {position: absolute;top: 40px;right: -31px;z-index: 2;font-size: 24px;border: 0;cursor: pointer;background: #fff;color: #000;border: #e6edf7 1px solid; display: none;}
#site-nav .btn_eagroup{margin-top: 108px;position: absolute;right: 35px;top: 520px;}
#site-nav .btn_eagroup a{display:inline-flex;border: 1px #ffffffa1 solid;min-width: 230px;justify-content: space-between;align-items: center;padding: 15px 26px;border-radius: 100px;margin-top: 11px;line-height: 1;}
#site-nav .btn_eagroup a:hover{ background:rgb(255 255 255 / 13%); }
#gnb_bg{ position: fixed; top: 0; left: 0; z-index: 5; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); display: none; }
body.openGnb { overflow: hidden; }
body.openGnb #site-nav { visibility: visible; opacity: 1; }
body.openGnb #site-nav .menu > ul > li > a,
body.openGnb #site-nav .menu > ul > li > .depth2 { transform: translateY(0); transition-delay: calc(0.1s*var(--char-index)); opacity: 1; }
body.openGnb #site-nav .menu_container {display: flex;flex-direction: column;}

.nav_thumb{ position:absolute; right:0; top:0; width:50%; height:100%;}
.nav_thumb .swiper-container{ width:100%; height:100%; }

@media screen and (max-width: 1400px){
  #site-nav .homeBtn{ right:95px; }
  #site-nav > .inner {max-width: none; width: 100%;}
  #site-nav .menu_container {min-width: auto;width: calc(100% - 80px);margin: 0 40px;position: relative;display: flex;justify-content: flex-start;align-items: flex-start;margin-left: 50px;margin-top: 100px;}
  #site-nav .closeBtn {right: 40px;}
  #site-nav .depth1 > ul{min-width: auto;}
  #site-nav .depth1 > ul > li{width: 21%;margin: 0 4%;margin-top: 0;position: relative;}
  #site-nav .depth1 > ul > li > a{font-size: 26px;padding-bottom: 20px;}
  #site-nav .depth2 > ul > li > a{font-size: 16px;} 
  #site-nav .depth2 > ul > li{margin-bottom:3px;}
  #site-nav .btn_eagroup{margin-top: 108px;position: absolute;right: 0;top: 320px;}
  #site-nav .btn_eagroup a{min-width: 200px;padding: 12px 20px;border-radius: 100px;margin-top: 11px;line-height: 1; font-size:16px;}
  
}

@media screen and (max-width: 1200px){
  #site-nav .depth1 > ul > li:first-child:after{top: 40px;}
  #site-nav .depth1 > ul > li:last-child:after{top: 40px;}
  #site-nav .homeBtn{ right:95px; }
  #site-nav > .inner {max-width: none; width: 100%;}
  #site-nav .menu_container {min-width: auto;width: calc(100% - 80px);margin: 0 40px;position: relative;display: flex;justify-content: flex-start;align-items: flex-start;margin-left: 50px;margin-top: 100px;}
  #site-nav .closeBtn {right: 40px;}
  #site-nav .depth1 > ul{min-width: auto;}
  #site-nav .depth1 > ul > li{width: 21%;margin: 0 4%;margin-top: 0;position: relative;}
  #site-nav .btn_eagroup{margin-top: 0;position: absolute;right: 0;top: 350px;}
  #site-nav .depth1 > ul > li > a{font-size: 20px;}
  #site-nav .depth2 > ul > li > a{font-size: 16px;} 
}





#allmenu{position: absolute; left: 0; top: 100px; width: 100%; height: auto; padding: 65px 0 125px; background-color: #fff; font-size: 18px; visibility:hidden; opacity: 0; -webkit-transition: all 300ms ease-in; -moz-transition: all 300ms ease-in; -ms-transition: all 300ms ease-in; -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in; }
    #allmenu > .inner{ width: 1000px; margin: 0 auto; }
    #allmenu > .inner > ul{display: flex;align-items: stretch;}
    #allmenu > .inner > ul > li{width: 250px; border-left: 1px solid #eaeaea; padding-left: 50px; padding-right: 20px; box-sizing: border-box;}
    #allmenu > .inner > ul > li:first-child{border-left: 0;}
    #allmenu > .inner > ul > li > a{ color: #2492e6; font-weight: 700; font-size: 18px; line-height: 1.3; }
    #allmenu .dep2{margin-top: 17px;}
    #allmenu .dep2 li{margin-bottom: 15px;}
    #allmenu .dep2 li.active a,
    #allmenu .dep2 li a:hover{ color:#000; font-weight:600;}

/*230221 헤더 전체 수정*/
#site-header.sub{background-color: #fff; }
#site-header.sub .withPosco .img{background-image: url(../images/common/h_withposco.png);}
#site-header.sub .lang .img{ background-image: url(../images/common/lang_select.png); }
/*#header-faker{ -webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-ms-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;}*/
/*.scrollDown #header-faker{height: 100px;}*/
#site-header.sub{ height: 100px; }
#site-header.sub .logo a{ background-image: url(../images/common/h_logo.png); }
#site-header.sub > .inner{ border-bottom: 1px solid #e7e7e7; color: #222;}
#site-header.sub > .inner .area_rgh .lang a{  color:#222;}
#site-header.sub > .inner .area_rgh .lang a:hover{ opacity: 1; }
#site-header.sub > .inner .area_rgh .lang a.active{ border-color:#222; opacity:1; }

#site-header .navBtn { margin-left: 0; }
#site-header .navBtn .menu_btn { border-radius:50%; border:1px #b6b6b6 solid;  background-color:#fff; }
#site-header .navBtn .menu_btn .line {width: 22px; text-align: center;}
#site-header .navBtn .menu_btn .line span {background-color: #222;height: 3px;}
#site-header .navBtn .menu_btn .line span:first-child {margin-top:0;}
#site-header .navBtn .menu_btn .line span + span {margin-top: 7px;}
#site-header .navBtn .menu_btn .line span.line_02{ display:none; }
#site-header .navBtn .menu_btn:hover{background: #000;color: #fff;}
#site-header .navBtn .menu_btn:hover .line span{background:#fff;opacity: 1;}
#site-header.main .navBtn .menu_btn {border: 1px #e7edf7 solid;background-color:transparent;}
#site-header.main .navBtn .menu_btn .line span {background-color: #000;}
#site-header.main .navBtn .menu_btn:hover {border: 1px #000 solid;background-color: #000;color: #fff;}
#site-header.main .navBtn .menu_btn:hover .line span {background-color: #fff;}
.openGnb #site-header.main .navBtn:hover .menu_btn .icon-cross2{ color:#fff; }
#site-header.main .navBtn .menu_btn .icon-cross2{ display: none; }
.openGnb #site-header.main .navBtn .menu_btn .icon-cross2{display: inline;color: #000;font-size: 26px;}

.openGnb #site-header.main .navBtn .menu_btn .line{ display: none; }


.header_hover #site-header.sub, body.openGnbTy2 #site-header.sub, #site-header.sub.scrollDown{ border-bottom: 0;  }

#site-header .wrap_dep2{ overflow: hidden; border-bottom:1px #e7e7e7 solid; position: relative; }
#site-header .wrap_dep2 .depth2{display:flex;align-items: center;justify-content: center;}
#site-header .wrap_dep2 .depth2 li{margin: 0 30px;}
#site-header .wrap_dep2 .depth2 a{position: relative; display:inline-flex;height:100px;align-items: center; padding: 0 5px; box-sizing: border-box; font-size: 22px; font-weight: 600; color: #222;}
#site-header .wrap_dep2 .depth2 a:after{ position: absolute; left: 50%; bottom: 0; width: 0%; height: 3px; background-color: #222; content:""; -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -ms-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;}
    #site-header .wrap_dep2 .depth2 a:hover:after,
    #site-header .wrap_dep2 .depth2 .active a:after{ left: 0%; width: 100%;  }
    .wrap_dep2 .navBtn{position: absolute;left: 60px;top: -120px; -webkit-transition: all 500ms ease-out;
        -moz-transition: all 500ms ease-out;
        -ms-transition: all 500ms ease-out;
        -o-transition: all 500ms ease-out;
        transition: all 500ms ease-out; }
        #site-header.sub  .navBtn .menu_btn{ background-color: transparent; cursor: pointer;}
        #site-header.sub  .navBtn .menu_btn:hover{ background-color: #005689; }

        #site-header.sub.scrollDown .wrap_dep2 .navBtn{top: 20px;}
        #site-header.scrollDown .wrap_dep2{ border-width: 0; }
        #site-header.sub.scrollDown{top: -101px; background-color: #eaeaea;}
        #site-header.main.scrollDown{ /*background-color: transparent;*/ border: 0; }
        #site-header.main.scrollDown .navBtn .menu_btn {  border:1px #b6b6b6 solid;  background-color:#fff; /*border-color: transparent;*/ }
        #site-header.main.scrollDown .navBtn .menu_btn:hover{ 
            background-color: #005689; }
            #site-header.main.scrollDown .navBtn .menu_btn .line span {background-color: #222; }
            #site-header.main.scrollDown .navBtn .menu_btn:hover .line span {background-color: #fff; }



            @media screen and (max-width: 1280px){

              #site-header .navBtn .menu_btn { width: 50px; height: 50px;}
              #site-header .navBtn .menu_btn .line {width:20px;}
              #site-header .navBtn .menu_btn .line span { height: 2px; }
              #site-header .navBtn .menu_btn .line span + span { margin-top: 7px; }
              #site-header.sub.scrollDown .wrap_dep2 .navBtn{top: 15px;}
              #site-header.sub{height: 182px;}
              #site-header .wrap_dep2 .depth2 li{margin: 0 20px;}
              #site-header .wrap_dep2 .depth2 a{height:80px;padding: 0 5px;font-size: 18px;word-wrap: break-word;}
              .wrap_dep2 .navBtn{position: absolute;left: 40px; top: -120px; }

          }

          @media screen and (max-width: 1200px){
              #site-header .wrap_dep2 .depth2 li{margin: 0 15px;}
          }

          @media screen and (max-width: 1200px){
              /* #header-faker, */
              #site-header.sub{height: 16vw;}
              #header-faker.main{ display: none; }
              #site-nav .depth1 > ul > li .visual{ display: none; }
              body #site-header {width: 100%;height: 19vw;}
              #site-header > .top{ height:7.976190476190475vw;  font-size:2.380952380952381em; }
              #site-header > .top a.fm{display:block;margin-top:-3px;font-size: 3.2vw;}
              #site-header > .top > .col.lft{min-width: 45.95238095238095vw; }
              #site-header > .top > .col.rgh{padding-right: 4vw;}
              
              #site-header > .top .gnb a{width: 50%;height: 7.976190476190475vw;font-size: 3.2vw;}
              #site-header > .inner {width: 100%;height: 15vw;padding: 0 5vw;box-sizing: border-box;margin: 0;display: flex;justify-content: space-between;}
              #site-header > .inner .area_rgh{ display:none;}
              #site-header > .inner > * + * { margin-left: 30px; }
              #site-header .logo { margin: 0; flex-grow: 1; z-index: 0; }
              #site-header .logo a {width: 21vw;height: 9vw;background-size: 100%;margin-top: 0vw;}

              #site-header .navBtn .menu_btn { width: 9vw;height: 9vw;  display: flex !important; }
              #site-header .navBtn .menu_btn .line {width: 4vw;}
              #site-header .navBtn .menu_btn .line span {height: 1px;}
              #site-header .navBtn .menu_btn .line span + span {margin-top: 1.4vw;}
              #site-header .navBtn .menu_btn .line span.line_03{width: 100%;}
              

              #site-header.menuOn:after { height: 100%; }
              #site-header.menuOn .menu > li > a { color: #a0afd5; }
              #site-header.menuOn .menu > li > a[target]:after { background-image: url(../images/ico/ico_link_b3.png); }
              #site-header.menuOn .menu > li > .depth2 { height: 100%; }
              #site-header.menuOn .menu > li.on > a { color: #fff; }
              #site-header.menuOn .menu > li.on > a[target]:after { background-image: url(../images/ico/ico_link_w.png); }
              #site-header.menuOn .menu > li.on > .depth2 { visibility: visible; opacity: 1; -webkit-transition: opacity 0.75s ease; transition: opacity 0.75s ease; }
              #site-header.menuOn .lang .img { background-image: url(../images/common/lang_select_b.png); }
              #site-header.menuOn .withPosco .img { background-image: url(../images/common/with_posco_w.png); }
              #site-header.menuOn .navBtn .menu_btn { background-color: #1d48b2; }
              #site-header.news { background-color: transparent; }
              #site-header.news .logo a { background: url(../images/common/site-logo-w.svg) center no-repeat; }
              #site-header.news .menu > li > a { color: #fff; }
              #site-header.news .navBtn .menu_btn .line span { background-color: #fff; }
              #site-header.news .lang .img { background-image: url(../images/common/lang_select_w.png); }
              #site-header.main.scrollDown .navBtn .menu_btn{ border:1px #ddd solid; }
              

              #site-header.scrollDown {margin-top: 0;}
              #site-header.main.scrollDown {background: #fff;}
              #site-header .lang{ display: none; }
              #site-nav > .bg-pos{ display: none; }
              #site-nav {
                position: fixed;
                top: 0;
                right: 0;
                z-index: 1000;
                width: 100%;
                height: 100%;
                background-color: #000;
                display: flex;
                align-items: center;
                visibility: hidden;
                opacity: 0;
                -webkit-transition: visibility 0.7s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
                transition: visibility 0.7s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
                color: #fff;
            }
            #site-nav a{ color: #fff; }
            #site-nav .depth1 > ul > li > a.m{display:none;}
            #site-nav > .inner {max-width: 100%;width: 100%;height: 100vh;display: block;margin: 0;overflow: hidden;overflow-y: scroll;margin-left: auto;background: #00396b;}
            #site-nav .visual{position:fixed; left:0; top:0; width:100%; height:100vh; background-size:cover; z-index:-1;}

            #site-nav .menu_container {display: none;align-items: center;justify-content: center;min-width: 1320px;height: 100%;box-sizing: border-box;}
            #site-nav .footer_menu,
            #site-nav .depth1 > ul{display: block;min-width: auto;}
            #site-nav .footer_menu > .col,
            #site-nav .depth1 > ul > li:nth-child(1n+1){width: auto;padding: 0 4vw 0 12vw; margin: 0; margin-top: 4vw;}
            #site-nav .depth1 > ul > li.active{background-color: #004781;color: #000;padding-top: 5vw;padding-bottom: 5vw;}
            #site-nav .depth1 > ul > li.active > a{ color: #279bf3; }
            

            #site-nav .depth1 > ul > li > a{font-size: 4.5vw;font-weight:500;display:block;padding-bottom:10px;position:relative;}
            #site-nav .depth1 > ul > li > a:after{
                -webkit-transition: visibility 0.3s cubic-bezier(0.33, 1, 0.68, 1), width 0.3s cubic-bezier(0.33, 1, 0.68, 1);
                transition: visibility 0.3s cubic-bezier(0.33, 1, 0.68, 1), width 0.3s cubic-bezier(0.33, 1, 0.68, 1);
                width:0; height:1px; background:#ffcb33;  content:"";position: absolute;left: 0 ;bottom: 0; display: none
            }
            #site-nav .depth1 > ul > li.active > a{color:#fff;margin:0;padding:0;font-size: 6vw;}
            #site-nav .depth1 > ul > li.active > a:after{width:100%;}
            #site-nav .depth1 > ul > li.active > a:before{position:absolute; right:2.3vw; top:2.7vw; width:2vw; height:2vw; border-radius:2vw; background:#279bf3; content:"";}
            #site-nav .depth1 > ul > li.active .depth2{ display: block }

            #site-nav .depth2 > ul{padding:3.3vw 0;}
            #site-nav .depth2 > ul > li{margin-bottom: 3vw;}
            #site-nav .depth2 > ul > li.active a{ color: #279bf3; }
            #site-nav .footer_menu > .col > ul > li > a,
            #site-nav .depth2 > ul > li > a{font-size: 4.1vw;color: #fff;opacity: 1;} 
            #site-nav .footer_menu > .col > ul > li > a.active,
            #site-nav .footer_menu > .col > ul > li > a:hover,
            #site-nav .depth2 > ul > li > a.active,
            #site-nav .depth2 > ul > li > a:hover{ color:#fff;}

            #site-nav .depth1 > ul > li.active > a:after{}


            #site-nav .depth1 > ul > li .visual{ 
             -webkit-transition:  opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
             transition: opacity 0.7s cubic-bezier(0.33, 1, 0.68, 1);
             opacity:0;
         }
         #site-nav .depth1 > ul > li.active .visual{ opacity:1;}



         #site-nav .footer_menu{
          margin-top: 40px;
      }
      #site-nav .footer_menu > .col{}
      #site-nav .footer_menu .h_1{
          font-size: 22px;
          font-size: 1.375em;
          font-weight: 600;
      }
      #site-nav .footer_menu > .col > ul{}
      #site-nav .footer_menu > .col > ul > li{
          margin-bottom: 6px;
      }
      #site-nav .footer_menu > .col > ul > li > a{}

      #site-nav .lang{position:absolute;right:4vw;top: 29vw;}
      #site-nav .lang ul{display:flex;}
      #site-nav .lang ul li{display:flex; margin-left:10px; padding-left:10px; position:relative;}
      #site-nav .lang ul li:after{position:absolute;left:0;top: 1.3vw;width:1px;height: 3.1vw;background:#404040;content:"";}
      #site-nav .lang ul li:first-child:after{display:none;}
      #site-nav .lang ul li a{color:#404040;}
      #site-nav .lang ul li.on a{color:#fff;}

      #site-nav .logo{position:absolute;left: 11vw;top: 24vw;width: 50vw;}
      #site-nav .closeBtn {position: absolute;top: 16vw;right: 5vw;z-index: 2;font-size: 8.1vw;border: 0;cursor: pointer;background: transparent;color: #fff;}


      #gnb_bg{ position: fixed; top: 0; left: 0; z-index: 900; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);  }

      body.openGnb { overflow: hidden; }
      body.openGnb #site-nav {visibility: visible;opacity: 1;width: 100vw;background: rgba(0,0,0,0.5);}
      body.openGnb #site-nav .menu > ul > li > a,
      body.openGnb #site-nav .menu > ul > li > .depth2 { transform: translateY(0); transition-delay: calc(0.1s*var(--char-index)); opacity: 1; }
      body.openGnb #site-nav .menu_container {display: block;margin: 38vw 0 0;width: 100%;min-width: auto;box-sizing: border-box;height: auto;padding-bottom: 30vw;}

      #site-nav .depth2{display: none;margin-top: 3vw;}
      #site-nav .homeBtn{right: auto;top: 15.2vw;width: 10vw;-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;border-radius: 50%;height: 10vw;font-size: 0;line-height: 0;left: 5vw;}
      #site-nav .homeBtn img{ width:4vw;}
      #site-nav .btn_eagroup{margin:5vw 10vw; position: relative;right: 0;top: 0;}
      #site-nav .btn_eagroup a{min-width: 52vw;padding: 3vw 7vw;margin-top: 3vw;font-size: 3.4vw;}
      #site-nav .btn_eagroup a img{ width:4vw;}
      #site-nav .depth1 > ul > li:first-child:after,
      #site-nav .depth1 > ul > li:last-child:after{ display:none;}

      #site-header .wrap_dep2 > ul{width: 98vw;overflow:hidden;margin-left:0;overflow-x: scroll;padding-right: 0;}
      #site-header.sub.scrollDown{top: -18vw; background-color: #eaeaea;}
      #site-header.scrollDown .wrap_dep2 > ul{width: 75vw;overflow:hidden;margin-left:25vw;overflow-x: scroll;}
      #site-header .wrap_dep2 .depth2{display:flex;align-items: center;justify-content: flex-start;}

      #site-header .wrap_dep2 .depth2 li{margin: 0 4vw;white-space: nowrap;}
      #site-header .wrap_dep2 .depth2 a{height:16vw;padding: 0 2vw;font-size: 4.3vw;word-wrap: break-word;}
  }

  .head-pop1{
   padding-top: 59px;
    position: relative;
    border-bottom-color: #374c6a;
    border: 0;
    max-width: 1920px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    display:flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    transition: all 300ms cubic-bezier(0.660, 0.025, 0.065, 1.000); /* custom */
    transition-timing-function: cubic-bezier(0.660, 0.025, 0.065, 1.000); /* custom */
}
.head-pop1 .h_1{ font-size: 24px; color: #b4bbc2; font-weight: 700; }


.search-top-type2{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 0;
  background-color: #fff;
  z-index: 20;
  overflow: hidden;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
}
.search-top-type2 > .inner{ max-width:860px; margin:0 auto; }
.search-top-type2 .btn_close{position:absolute;right: 40px;top: 46px;font-size: 28px;line-height: 0;background: #000;border-radius: 50%;color: #fff;width: 70px;height: 70px;}
.search-top-type2 .cont{
  padding: 0; margin-top: 31px;
}
.search-top-type2 .cont{
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
  -moz-transform: translateY(80px);
  -webkit-transform: translateY(80px);
  -o-transform: translateY(80px);
  -ms-transform: translateY(80px);
  transform: translateY(80px);
}
.search-top-type2 .bot{ margin-top: 50px;padding: 15px 0 37px;border-top: 2px solid #222; }
.search-top-type2 .bot .result{ display: flex; }
.search-top-type2 .bot .result .hash{font-size: 16px;color: #087cff;font-weight: 300;text-align: left;overflow: hidden;display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.search-top-type2 .bot .result .hash span{ display: inline-block; margin-right: 10px; }
.search-top-type2 .bot .result .lft{ max-width: 80%; padding-top: 6px; }
.search-top-type2 .bot .result .rgh{ margin-left: auto; }
.search-top-type2 .bot .btns{ margin-top:45px; }
.search-top-type2 .bot .btn_search{ background:#000;color:#fff;width: 280px;height: 65px;font-size: 20px;border-radius: 10px; }
.search-top-type2 .btn_reset2{
    font-size: 14px;
    color: #7d7d7d;
    border: 1px #cfcfcf solid;
    width: 96px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 33px;
    border-radius: 5px;
}
.search-top-type2 .btn_reset2 i{ font-size:20px; }

@media (hover: hover) {
   .search-top-type2 .bot .btn_search:hover{ opacity: 0.8; }
  .search-top-type2 .btn_reset2:hover{ background:#000; color:#fff;  }
  .search-top-type2 .btn_reset2:hover i{  }
}

.search-top-type2 .cont > .inner{max-width: 1160px; height: 192px; min-height: 110px; overflow-x: hidden; overflow-y: auto; display:flex;margin:0 auto;justify-content: space-between;}
@media (min-width:769px) {
    .search-top-type2 .cont > .inner{
        -ms-overflow-style: -ms-autohiding-scrollbar;
        scrollbar-width: thin;
        scrollbar-color: #999 #eee
    }
    .search-top-type2 .cont > .inner::-webkit-scrollbar {
        height: .8rem;
        width: 2px;
    }
    .search-top-type2 .cont > .inner::-webkit-scrollbar-track {
        background: #ececec
    }
    .search-top-type2 .cont > .inner::-webkit-scrollbar-thumb {
        background-color: #000;
        border-radius: 0;
        cursor: pointer !important;
    }
}

.search-top-type2 .cont .head{min-width: 290px;}
.search-top-type2 .cont .head .t_1{color:#92917e;font-weight:700;font-size: 26px;text-align: left;max-width: 300px;line-height: 1.4;font-style: italic;}
.search-top-type2 .cont .group_hash{
    display: flex;
    flex-wrap: wrap;
    width: 96%;
}
.search-top-type2 .cont .group_hash a{
    padding: 12px 13.8px;
    border: 0;
    border-radius: 10px;
    line-height: 1;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
    margin-left: 9px;
    background: #efefef;
    color: #696969;
    font-weight: 500;
    font-size: 16px;
}

.search-top-type2 .cont .group_hash a.on,
.search-top-type2 .cont .group_hash a:hover{ background:#000; color:#fff; border-color:#000; }

.search-top-type2.active{ height: 390px; }
.search-top-type2.active .cont{
  -moz-transform: translateY(0);
  -webkit-transform: translateY(0);
  -o-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0); 
}
.search-top-type2 .wrap-search1{ 
  margin-right: 120px; 
  -moz-transition: all 800ms ease;
  -ms-transition: all 800ms ease;
  -o-transition: all 800ms ease;
  transition: all 800ms ease;
}
.search-top-type2 .wrap-search1 input{ color:#fff;  }
.search-top-type2.active .wrap-search1{ 
  width: 410px; margin-right: 0; 
  border-color: #495f7f;
  background-color: #495f7f;
}

.wrap-search2{border-bottom: 3px #313e47 solid;border-radius: 0;display: flex;padding: 0;width: 710px;position: relative;line-height:1;margin: 0 auto;}
.wrap-search2 input{width: calc(100% - 190px);height: 70px;background-color:transparent;border:0;outline:0;margin: 0;padding: 0;font-size: 24px;font-family: var(--ff-ori);margin-left: 60px;cursor: default;font-weight: 700;}
.wrap-search2 .ico{width: 50px;height: 100%;cursor: default;color: #000;position: absolute;left: 0;top: 0;z-index: 1;display: flex;align-items: center;justify-content: center;}
.wrap-search2 .ico i{color:#000;font-size: 38px;}
.wrap-search2 button{position:absolute;right:0;top: 13px;width: 120px;height: 50px;background:#000;color:#fff;font-size: 18px;}
.wrap-search2 input::-webkit-input-placeholder {
  font-size: 24px;
  color: #bdbdbd;
  font-weight:600;
  font-family:var(--ff-ori);
}
.wrap-search2 input:-ms-input-placeholder {
 font-size: 24px;
 color: #bdbdbd;
 font-weight:600;
 font-family:var(--ff-ori);
}

@media screen and (max-width: 1200px){
.head-pop1{
    position: relative;
    border-bottom-color: #374c6a;
    height: auto;
    margin-left: 4vw;
    margin-right: auto;
    padding-top: 8vw;
 }
.head-pop1 .h_1{font-size: 3.8vw; color: #000;}
.search-top-type2{background-color: transparent;}
.search-top-type2 .inner .top_sch{ background-color: #fff; }
.search-top-type2 .close_bot{ margin-top: 4vw; padding-bottom: 15vw; }
.search-top-type2 .btn_close{position: relative;right: auto;top: auto;font-size: 6vw;line-height: 0;background: #fff;border-radius: 50%;color: #000;width: 12vw;height: 12vw;left: 0;bottom: 0;}
.search-top-type2 .cont{
  margin-top: 0;
  padding: 0;
  box-sizing: border-box;
}
.search-top-type2 .cont > .inner{max-width: none;display:flex;margin: 4vw;flex-direction: column;height: 42vw;min-height: auto;justify-content: flex-start;overflow-y: scroll;}
.search-top-type2 .cont .head{min-width: auto;margin: 0 6vw;}
.search-top-type2 .cont .head .t_1{font-weight:700;font-size: 5vw;max-width: 73vw;line-height: 1.5;font-style: italic;}
.search-top-type2 .cont .group_hash{
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    width: 88%;
}
.search-top-type2 .cont .group_hash a{
    padding: 2.1vw 4vw;
    margin-bottom: 2vw;
    margin-left: 1.5vw;
    font-size: 3.2vw;
    border-radius: 7px;
}
.search-top-type2 .cont .group_hash a.on,
.search-top-type2 .cont .group_hash a:hover{ background:#000; color:#fff; border-color:#000; }


.search-top-type2 .wrap-search1{ 
  margin-right: 120px; 
  -moz-transition: all 800ms ease;
  -ms-transition: all 800ms ease;
  -o-transition: all 800ms ease;
  transition: all 800ms ease;
}
.search-top-type2 .wrap-search1 input{ color:#fff;  }
.search-top-type2.active .wrap-search1{ 
  width: 410px; margin-right: 0; 
  border-color: #495f7f;
  background-color: #495f7f;
}
  
  .wrap-search2{border-bottom: 2px #313e47 solid;border-radius: 0;display: flex;padding: 0;width: calc(100% - 12vw);position: relative;line-height:1;margin: 0 auto 5vw;}
  .wrap-search2 input{width: calc(100% - 33vw);height: 12vw;background-color:transparent;border:0;outline:0;margin: 0;padding: 0;font-size: 4vw;font-family: var(--ff-ori);margin-left: 8vw;cursor: default;font-weight: 700;}
  .wrap-search2 .ico{width: 6vw;height: 100%;z-index: 1;display: flex;align-items: center;justify-content: center;}
  .wrap-search2 .ico i{font-size: 6vw;}
  .wrap-search2 button{position:absolute;right: 0;top: 2px;width: 20vw;height: 11vw;background:#000;color:#fff;font-size: 3.4vw;}
  .wrap-search2 input::-webkit-input-placeholder {
    font-size: 24px;
    color: #bdbdbd;
    font-weight:600;
    font-family:var(--ff-ori);
  }
  .wrap-search2 input:-ms-input-placeholder {
   font-size: 24px;
   color: #bdbdbd;
   font-weight:600;
   font-family:var(--ff-ori);
  }
   .search-top-type2 .bot{margin-top: 9vw;padding: 4vw 0 6vw;border: 0;margin: 0 4vw;}
   .search-top-type2 .bot .result{display: flex;flex-direction: column-reverse;}
   .search-top-type2 .bot .result .hash{font-size: 3.2vw;text-align: left;}
   .search-top-type2 .bot .result .hash span{ margin-right: 5px; }
   .search-top-type2 .bot .result .lft{padding-top: 3vw;border-top: 1px #8c8c8c solid;margin-top: 1vw;max-width: none;}
   .search-top-type2 .bot .result .rgh{margin-left: auto;padding-right: 2vw;}
   .search-top-type2 .bot .btns{ margin-top:8vw; }
   .search-top-type2 .bot .btn_search{background:#000;color:#fff;width: 100%;height: 12vw;font-size: 4vw;border-radius: 2vw;}
   .search-top-type2 .btn_reset2{
    font-size: 3.6vw;
    color: #7d7d7d;
    border: 0;
    width: auto;
    height: auto;
    border-radius: 0;
   }
   .search-top-type2 .btn_reset2 i{font-size: 6vw;}


}


.cover-type1{ position:fixed; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); visibility: hidden;  opacity: 0;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
  z-index: 20;
  cursor: pointer;
}
.cover-type1.active{
  visibility: visible;
  opacity: 1;
}


.btn-search-top{ position:relative; display: none; }
.btn-search-top .icon-android-arrow-dropup{position:absolute;right: 8px;top: -18px;font-size: 30px;color: #ededed;}
.btn-search-top button{font-size: 27px;width: 89px;height: 90px;background: #fff;box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);-webkit-box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);-moz-box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);border-radius: 50%; color: #000;}
.btn-search-top .bubble{position:absolute;right: 20px;top: 105px;width: 340px;height: auto;background:#ededed;border-radius:20px;color:#000;font-size:15px;display:flex;align-items: center;justify-content: center;padding: 8px 10px; display: none;}



.btn-cart-top-mo,
.wrap-lnb-mo{ display: none; }    
.btn-lnb-mo,
.btn-lnbclose-mo{ display: none; }
@media screen and (max-width: 1200px){
  .tmp-header2 .mid .lft{position: absolute;top: 12vw;right: 4vw;}
  .btn-cart-top-mo{display: flex;position: absolute;right: 21vw;top: 4.7vw;z-index: 7;font-size: 7.7vw;color: #424242;}
  .btn-lnb-mo{display: flex;position: absolute;right: 6vw;top: 4vw;z-index: 7;font-size: 9vw;color: #424242;}
  .btn-lnbclose-mo{display: flex;position: absolute;right: 1.4vw;top: 3vw;z-index: 7;font-size: 6vw;color: #000;width: 12vw;height: 12vw;background: #fff;border-radius: 50%;align-items: center;justify-content: center;}
  .tmp-header2 .top1 .lft .logo{ margin-top: 4vw; }
  #site-header2.tmp-header2{ height: 16vw;width: 100%;min-width: auto; background-color: #fff; border-bottom: 1px #d7d7d7 solid;}
  #site-header2 .bg{
      top: 3vw;
      width: 800vw;
      height: 18.5vw;
      animation: move_wave 250s linear infinite;
      -webkit-animation: move_wave 250s linear infinite;
      transform: translateX(0) translateZ(0) scaleY(1);
      display: none;
  }
  #site-header2 .bg2{
   top: 3vw;
   width: 800vw;
   height: 19.2vw;
   animation: move_wave 300s linear infinite;
   -webkit-animation: move_wave 300s linear infinite;
   display: none;
}

#site-header2 .bg3{
   top: 4vw;
   width: 800vw;
   height: 19.2vw;
   animation: move_wave 190s linear infinite;
   -webkit-animation: move_wave 190s linear infinite;
   display: none;
}

.tmp-header2 .top1 .lft .logo img{ max-width: 27vw; }
.scrollDown .tmp-header2 .top1 .lft .logo{ margin-top: 4vw; }

  
.btn-cart-top{display:none;}
.gnb,
.tmp-header2 .mid .rgh{ display: none; }

.btn-search-top{ position:relative;  }
.btn-search-top .icon-android-arrow-dropup{position:absolute;right: 8px;top: -18px;font-size: 30px;color: #ededed;}
.btn-search-top button{font-size: 5vw;width: 16vw;height: 16vw;background: #fff;box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);-webkit-box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);-moz-box-shadow: 6px 6px 7px 1px rgb(54 52 52 / 25%);border-radius: 50%;}
.btn-search-top .bubble{position:absolute;right: 4vw;top: 20vw;width: 45vw;height: auto;background:#ededed;border-radius: 3vw;color:#000;font-size:15px;display:flex;align-items: center;justify-content: center;padding: 8px 10px;}

.scrollDown #site-header2.tmp-header2{ margin-top: 0; }
.wrap-lnb-mo{
   position: fixed;
   right: 0;
   top: 0;
   width: 0;
   height: 100%;
   z-index: 10;
   background-color: #fff;
   display: block;
   color:#000;
   transition: all 400ms cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
   transition-timing-function: cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
}
.wrap-lnb-mo > .inner{
    width: 100vw;
    position: relative;
    border-top: 1px transparent solid;
}    
.wrap-lnb-mo.active{ width:100%; z-index: 1000; }
.wrap-lnb-mo .gnb_mo{
    display: flex;
    flex-wrap: wrap;
    font-size: 4vw;
    height: 20vw;
    align-items: center;
    margin-bottom: 0;
    padding: 0 5vw;
}
.wrap-lnb-mo .gnb_mo a{display: flex;justify-content: center;align-items: center;width: auto;flex-direction: row-reverse;margin-right: 2vw;padding-right: 2vw;border-right: 1px #ddd solid;line-height: 1;color: #fff;}
.wrap-lnb-mo .gnb_mo a:last-child{ border:0;}
.wrap-lnb-mo .scroll_y{ overflow-x:hidden; overflow-y:auto; height:calc(100vh - 19vw);  }
.wrap-lnb-mo .btns_top{margin: 5vw;height: 9vw;}
.wrap-lnb-mo .btns_top a{display:inline-flex;border:1px #c2c2c2 solid;border-radius:500px;padding: 2.4vw 4.5vw;font-weight: 600;font-size: 4vw;line-height: 1;}
.wrap-lnb-mo .btns_top a.rev{ background:#000; color:#fff; }

.wrap-lnb-mo .btns_bot{
    margin-top: 6vw 0;
}
.wrap-lnb-mo .btns_bot a{display: flex;padding: 4.4vw 5vw;font-weight: 600;font-size: 4vw;line-height: 1;color: #9b9b9b;}

.wrap-lnb-mo .head{
    text-align: center;
    height: 15vw;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
}
.wrap-lnb-mo .head a{
    font-size: 0;
}
.wrap-lnb-mo .head a img{
    width: 24vw;
}
.wrap-lnb-mo .lnb{
    margin-top: 0;
}
.wrap-lnb-mo .lnb > li{
    flex-wrap: wrap;
    width: 100%;
    border-bottom: 1px rgba(255,255,255,0.4) solid;
}
.wrap-lnb-mo .lnb > li > a{
    display: block;
    padding: 5.2vw 5vw;
    font-size: 5.4vw;
    font-weight: 600;
    color: #000;
    position:relative;
    border-bottom: 1px #dedede solid;
}
.wrap-lnb-mo .lnb > li.dep_in > a:after{
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content:"\ea09";
  position:absolute;
  right:6vw;
  font-size:5vw;
  top:50%;
  margin-top:-2.5vw;
 transition: all 300ms cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
 transition-timing-function: cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
 -moz-transform: rotate(90deg);-webkit-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);transform-origin: 50% 50%;
}
.wrap-lnb-mo .lnb > li.on > a{ color:#f87b0d; }
.wrap-lnb-mo .lnb > li.on > a:after{
  margin-top:-2.5vw;
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
  transform-origin: 50% 50%;
  color:#000;
}
  
.wrap-lnb-mo .lnb > li > a i{position:absolute;right: 5vw;top: calc(50% - 0vw);transform-origin: 50% 50%;line-height: 0;transition: all 200ms cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */transition-timing-function: cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */}
.wrap-lnb-mo .lnb > li.on > a i{ -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg);transform: rotate(45deg); }
.wrap-lnb-mo .lnb .depth{
}
.wrap-lnb-mo .lnb .depth.dp2{
    display: none;
    border-top: 1px rgba(255,255,255,0.4) solid;
    background: #f6f5f2;
}
/* 모바일에서 해당 1뎁스(li)가 on일 때, 그 하위 카테고리(.depth.dp2)를 펼쳐서 기본으로 보이게 */
.wrap-lnb-mo .lnb > li.on > .depth.dp2{
    display: block;
}
.wrap-lnb-mo .lnb .depth.dp2 > ul{
    /* display: flex; */
    padding: 0;
}
.wrap-lnb-mo .lnb .depth.dp2 > ul > li{}
.wrap-lnb-mo .lnb .depth.dp2 > ul > li > a{
    display: block;
    padding: 3.1vw 5vw;
    font-weight: 600;
    font-size: 4.6vw;
    position: relative;
    color: #000;
    border-bottom: 1px #eaeaea solid;
}
.wrap-lnb-mo .lnb .depth li > a i{ display: none; }
.wrap-lnb-mo .lnb .depth li.dep_in > a i{ display: block; }
.wrap-lnb-mo .lnb .depth.dp2 > ul > li > a i{
    position: absolute;
    right: 6vw;
    top: calc(50% - 2vw);
    transition: all 300ms cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
    transition-timing-function: cubic-bezier(0.690, 0.030, 0.195, 0.985); /* custom */
    font-size: 5vw;
  -moz-transform: rotate(90deg);-webkit-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);transform-origin: 50% 50%;
}
.wrap-lnb-mo .lnb .depth.dp2 > ul > li.on > a i{
  -moz-transform: rotate(270deg);-webkit-transform: rotate(270deg);-o-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);transform-origin: 50% 50%;
}
.wrap-lnb-mo .lnb .depth.dp3 {
   background: #f6f5f2;
    display: none;
}
.wrap-lnb-mo .lnb .depth.dp3 .tit.dep2{ display:none; }
.wrap-lnb-mo .lnb .depth.dp3 > ul{
    padding: 0;
}
.wrap-lnb-mo .lnb .depth.dp3 > ul > li{}
.wrap-lnb-mo .lnb .depth.dp3 > ul > li > a{
    padding: 4vw 6vw 4vw 11.6vw;
    display: block;
    position: relative;
    font-size: 4vw;
    font-weight: 600;
    border-bottom: 1px #eaeaea solid;
    color: #222;
}
.wrap-lnb-mo .lnb .depth.dp3 > ul > li > a:after{
    position: absolute;
    right: 6.6vw;
    top: calc(50% - 1.5vw);
    /* display: none; */
    color: #929292;
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content:"\e902";
  display:none;
}
.wrap-lnb-mo .lnb .depth.dp3 > ul > li.dep_in > a:after{
  display:block;
}  
.wrap-lnb-mo .lnb .depth.dp3 > ul > li.on > a:after{
  content:"\eb2a";  
}
.wrap-lnb-mo .lnb .depth.dp4 {
    display: none;
    background: #edebe6;
}
.wrap-lnb-mo .lnb .depth.dp4 > ul{
    display: flex;
    flex-wrap: wrap;
    padding: 4vw 6vw 4vw 11.6vw;
}
.wrap-lnb-mo .lnb .depth.dp4 > ul > li{
    width: 48%;
    margin-right: 2%;
}
.wrap-lnb-mo .lnb .depth.dp4 > ul > li > a{
  padding: 1.9vw 0;
  display: block;
  position: relative;
  font-size: 3.6vw;
  font-weight: 600;
  color: #222;
}
.wrap-lnb-mo .lnb .depth.dp4 > ul > li > a i{
  position: absolute;
  right: 6vw;
  top: calc(50% - 1.5vw);
}
.wrap-lnb-mo .lnb .depth.hov{ display:block; }

}

#site-header2 .head-mobile{ display: none; }
@media screen and (max-width: 1200px){
   #site-header2 .head-mobile{
       display: flex;
       align-items: center;
       padding: 0 4vw;
       height: 16vw;
   }
   #site-header2 .head-mobile .lft_moblie{
    width: 30vw;
    min-width: 30vw;
    display: flex;
    align-items: center;
}
   #site-header2 .head-mobile .cen_moblie{
    width: 36vw;
}
   #site-header2 .head-mobile .rgh_moblie{
    width: 30vw;
    min-width: 30vw;
    display:flex;
    justify-content: flex-end;
    align-items: center;
}
#site-header2 .head-mobile .lft_moblie > *{ margin-right:4.2vw; }
#site-header2 .head-mobile .rgh_moblie > *{ margin-left:4.2vw; }
   #site-header2 .head-mobile .logo{}
   #site-header2 .head-mobile .logo img{
       height: 8.4vw;
       width: auto;
   }
}