@charset "UTF-8";
/*****************************************************************

Copyright C 그누위즈 테마 All rights reserved.
gnuwiz@naver.com & master@gnuwiz.com
본 페이지는 유료콘텐츠 그누위즈 테마 CSS입니다. 불법복제시 법적인 제제를 받으실 수 있습니다.
라이센스를 삭제하지 마세요. 라이센스 삭제시 불법 사용으로 간주될 수 있습니다.

******************************************************************/

/*페이지 로딩*/
#loading-screen {position: fixed;width: 100%;height: 100%;background: #fff;display: flex;flex-direction: column;justify-content: center;align-items: center;z-index:99999;}
.spinner {border: 2px solid rgba(0, 0, 0, .1);border-top-color: var(--main-color);border-radius: 50%;width: 50px;height: 50px;animation: spin 0.5s linear infinite;}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/*배경움직임*/
@keyframes bgmove01 {
    0% {transform:translateX(-101%);}
    50% {transform:translateX(0);}
    100% {transform:translateX(101%);}
}

@keyframes bgmove02 {
    0% {opacity:0;}
    50% {opacity:0;}
    51% {opacity:1;}
    100% {opacity:1;}
}


#hd{width:100vw;transition: all 0.3s ease;position:absolute;left: 0;top: 0;z-index: 300;}
#hd:before{content: "";display:block;position: absolute;bottom:0;left:0;width: 100%;height: 1px;background:rgba(255,255,255,0.2);}
#hd_wrapper {position:relative;margin:0 auto;width: calc(100vw - 100px);zoom:1}
#hd_wrapper .gnb-container{height:100px;}
.logo{z-index: 100;width:300px;height:40px;transition: all .3s;}
#logo > a {position: relative;width: 100%;height: 100%;display: block;}
#logo > a > img {position: absolute;top: 50%;left: 0;transform:translateY(-50%);}
.hd_login{position:absolute;top:50%;right:100px;transform:translateY(-50%);text-transform: uppercase;font-size: 14px;transition: all .3s;}
.hd_login li {float:left;margin:0 5px;line-height:13px}
.hd_login li:first-child {border-left:0}
.hd_login li> a {display: block;padding: 10px 20px;border-radius: 30px;}
.hd_login li:first-child > a{color: #fff;border: 1px solid rgba(255,255,255,0.2);}
.hd_login li:last-child > a {background: rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.2);}
.hd_login a{color: #fff;}
.hd_login p{padding-top:6px}

/*1차메뉴*/
#gnb{position:relative;display:flex;align-items:center;place-content:center;height: 100%;}
#gnb .gnb_wrap > ul{position:relative;display: flex;height: 100%;z-index: 200;}
.gnb_1da{padding: 0 !important;color: #fff !important;font-family: "Pretendard_B", sans-serif;}
#gnb .gnb_1dli{position:relative;padding:0 20px;display: flex;place-content: center;align-items: center;flex: 1;text-align: center;word-break:keep-all;cursor:pointer;}
#gnb .gnb_1dli:before {content: "";display: block;width: 100%;height: 0;background: var(--main-color);z-index: -1;transition: all 0.3s linear;position: absolute;top: 0;left: 0;right: 0;}
.gnb_1dli.gnb_al_li_plus .gnb_1da{position:relative;z-index:100;padding:0;transition: all .3s;font-size: 18px;}
.gnb_1dli.active .gnb_1da{color:var(--main-color);}
#gnb .gnb_1dli:hover > a {color:#fff !important;}
.gw-side-menu-container01 > [class*="gw-side-menu-depth"] > button{border-radius: 50px;}

/*1차 메뉴 활성화*/
#gnb  .gnb_1dli.on:before {height: 100%;}


/*2차메뉴*/
#gnb .gnb_wrap {position:relative;height: 100%;width:60%;}
.gnb_2dul {position:absolute;top:0;width:100%;font-size:14px;opacity: 0;visibility: hidden;}
.gnb_2dul:before {content: "";display: block;width: 100%;height: 0;background: var(--main-color);z-index: -1;transition: all 0.3s linear;position: absolute;top: 0;left: 0;right: 0;}
.gnb_2dul .gnb_2dul_box {padding:14px 0;}
.gnb_2dli{overflow:hidden;color:rgba(255,255,255,0.5);}
.gnb_2da {display:block;transform:translateY(100%);opacity:0;line-height:40px;color:rgba(255,255,255,0.6) !important;font-family:"Pretendard_M", sans-serif;transition: all 0.3s 0.3s;font-size: 16px;}
.gnb_2da:hover {color:rgba(255,255,255,1) !important;}

/*2차 메뉴 활성화*/
.gnb_2dul.show{display:block;padding: 100px 0 10px;opacity: 1;visibility: visible;  height: auto;z-index:2;}
.gnb_2dul.show:before {height: 100%;}
.gnb_2dul.show .gnb_2da{opacity: 1;transform: translateY(0);}

/* 모바일 */
#menu-btn {display: block;width: 30px;height: 16px;position: absolute;top: 50%;right: 0;transform:translateY(-50%);z-index: 1000;cursor: pointer;transition: all .3s;}
#menu-btn span {display: block;width: 100%;height: 2px;background: #fff;position: absolute;transition: all 0.3s ease-in-out;}
#menu-btn span:nth-child(1) {top: 10%;}
#menu-btn span:nth-child(2) {top: 50%;}
#menu-btn span:nth-child(3) {top: 90%;}
#menu-btn.active{right:-43px;z-index:99999;}
#menu-btn.active span{height:5px;background:#fff !important;}
#menu-btn.active span:nth-child(1) {top: 50%;transform: translateY(-50%) rotate(45deg) scale(0.5);}
#menu-btn.active span:nth-child(2) {top: 50%;transform: translateY(-50%) rotate(-45deg) scale(0.5);}
#menu-btn.active span:nth-child(3) {opacity: 0;transform:  translateX(-50px);}

#mob-gnb{/*display: none;*/position:fixed;top:0;left:-100%;z-index:100;max-width:100vw;width:100%;height:100vh;background:var(--main-color);}
#mob-gnb .menu-bg{position: relative;overflow: hidden;opacity:0;width: 30%;height:100vh;background: url(../img/gw-theme05-mene-bg.jpg) center no-repeat;background-size: cover;transition: all 0.5s ease-in-out;}
#mob-gnb .menu-bg:after {content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: var(--main-color);display: block;transform: translateX(-101%);}
#mob-gnb.on .menu-bg{animation: bgmove02 both 1s 0.2s;}
#mob-gnb.on .menu-bg:after {animation: bgmove01 both 1s 0.2s;}
#mob-gnb .menu-list{padding:0 100px;width: 70%;height: 100%;}
#mob-gnb .menu-list > ul > li {position:relative;padding:30px 0;display: flex;border-bottom: 1px solid rgba(255,255,255,0.1);transform:translateY(100%);opacity: 0;transition: all 0.8s ease-in-out;}
#mob-gnb .menu-list > ul > li:before {content: "";display: block;position: absolute;left: 0;bottom: 0;width: 0;height: 1px;background: #fff;transition: all 0.5s ease-in-out;}
#mob-gnb .menu-list > ul > li:hover:before{width: 100%;}
#mob-gnb .menu-list > ul > li > a{width: 250px;color: #fff;font-size: var(--main-title02);font-family:"Pretendard_B", sans-serif;}
#mob-gnb .dep02 {display: flex;flex-wrap: wrap;gap:20px;width: calc(100% - 200px);}
#mob-gnb .dep02 > li > a {font-size: 20px;color: rgba(255,255,255,0.6) !important;transition: all 0.3s;}
#mob-gnb .dep02 > li > a:hover{color:rgba(255,255,255,1) !important;}

/* 메뉴 검정색 */
#hd.black:before{background: #ddd;}
#hd.black #logo .dark-mode-logo{opacity: 0 !important;}
#hd.black #logo .light-mode-logo{opacity: 1 !important;}
#hd.black .gnb_1da{color: #000 !important;}
#hd.black #menu-btn span{background: #000;}
#hd.black .hd_login a{color:#222;}
.hd_login li:first-child > a{border:1px solid #ddd;}
#hd.black .hd_login li:last-child > a{background:#f2f2f2;border:1px solid #f2f2f2;}

/* 메뉴 활성화 */
html.on,body.on{overflow: hidden;}
#hd.on{border-bottom:1px solid #e8e8e8;}
#hd.on{border-bottom:1px solid #e8e8e8;}
#logo.on{display: none;}
#mob-gnb.on{left:0;display:block;z-index:9999;}
#mob-gnb.on .menu-list > ul > li{transform:translateY(0);opacity: 1;}
#mob-gnb .dep02.on > li{height: auto;}

/* 스크롤에 따른 메뉴 나타남, 사라짐 */
#hd.off{transform: translateY(-100%);}


/* 팝업 */
.popup_overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    visibility: hidden;
    opacity: 0;
    z-index: 999999 !important;
    display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  }
  
  .popup_overlay:target {
    visibility: visible;
    opacity: 1;
  }
  
  .content_pop {
    background: #fff;
    width: 60%;
    position: relative;
    transition: all 5s ease-in-out;
    padding-bottom: 10px;
    
  }

  @media screen and (max-width: 768px) {
    .content_pop {
      width: 80%;
      
    }
}
  
  .content_pop h2 {
  background-color: #000;
   margin-top: 0;
   color: rgb(255, 255, 255);
   text-align: center;
   font-size: 24px;
 font-family: 'Nanum Gothic', 'sans-serif';
   line-height: 52px;
   font-weight: 900;
   padding-top: 5px;
   border-bottom: 1px rgb(238, 238, 238) solid;
   padding-top: 13px;
   padding-bottom: 10px;
 }
 
 .content_pop .close {
   z-index: 99999;
   position: absolute;
   top: 15px;
   right: 15px;
   transition: all 200ms;
   font-size: 30px;
   font-weight: bold;
   text-decoration: none;
   color: #fff !important;
   opacity: 1;
   text-shadow: none;
   line-height: 0;
   padding-top: 12px;
   padding-bottom: 20px;
   padding-left: 5px;
   padding-right: 5px;
 }
  
  .content_pop .close:hover {
    color: #06D85F;
  }
  
  .content_pop .content {
    max-height: 350px;
    height: auto;

    padding: 25px 20px;
    font-size: 13px;
    overflow-y: auto;
    text-align: left;
    color:#666;
  }
  .content_pop .content p, .content_pop .content b {
    padding:5px 0px
  }
  .content_pop .content p .btn-1 {
    background: rgb(182, 13, 13);
    margin-top: 30px;
    width: 160px;
    text-align: center;
    color: #fff;
    
  }
  .content_pop .content p .btn-1::before {
    background-color: #2b2929;
  
  
  }
  .content_pop .content p .btn-1 span {
    color: rgb(255, 255, 255);
    border: 0;
    transition: 0.2s 0.1s;
    padding: 12px 0px;
    font-size:16px;
  
    
  }
  
  .content_pop .content p .btn-1 span:hover {
    color: rgb(255, 255, 255);
    transition: 0.2s 0.1s;
  }
  
  
  
  .popup_text_point {
    font-size: 16px;
    font-weight: 600;
    font-weight: 600;
    padding-bottom: 12px;
  }
  /* 팝업 마감 */