@charset "utf-8";
/********************
메인페이지 및 서브페이지 동시 적용.
가장 마지막에 불러오는 CSS 파일입니다.
※ 공통영역 CSS에서 부분별 개별 적용시 사용하시면 됩니다. 
********************/ 

/* popup */

    .PZwindow {display:flex; flex-direction:column}
    .PZwindow iframe {height: 100%;width:100%}
    .PZwindow .PZwrap img {width:100%; height: 100%;}
    .PZwindow .PZwrap a {display: block; background: #333;}

@media only screen and (max-width:768px){
    .PZwindow {width: 80% !important; top:0 !important; left:0 !important}
    .PZwindow .PZwrap {width: 100% !important; height: auto !important;}
}

@media only screen and (max-width:550px){
    .PZwindow {width: 100% !important}
}



.eQ01 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual01.jpg);}
.eQ02 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual02.jpg);}
.eQ03 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual03.jpg);}
.eQ04 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual04.jpg);}
.eQ05 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual05.jpg);}
.eQ06 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual06.jpg);}
.eQ07 .wrap-sub-visual {background-image: url(/sites/temp_18/images/sub/sub-visual07.jpg);}

  

/* ----- 20260225 수정 ----- */
.wrap-header.fNav .top-header {display:none;}
.wrap-contents * { font-family: 'Gmarket Medium' !important;}

.wrap-visual {margin-top: 80px;}
.wrap-contents .con-list2 > li {position:relative;padding: 1px 0 1px 17px !important;color:#666;}
.wrap-header .top-header .inner {align-items: center;}
.wrap-header .head-logo a img {height: 60px; max-width:400px;}
.wrap-header .top-header {border-bottom: 1px solid #ffffff73; background: #fff; padding: 10px 0 !important;}

.wrap-header .head-navi .ul_1 {margin-right: 30px;}
.wrap-header .head-navi .ul_2 {padding: 0;}
.wrap-header .head-navi .a_1 {height: 100%; display: flex; align-items: center; justify-content: center;}
.wrap-header .head-navi .a_2 {font-size: 17px; padding: 12px 10px;}
.wrap-header .head-navi .a_2[target=_blank] span:before {left: auto; right: -20px}

@media (max-width: 1200px) {
  .wrap-header .head-navi .a_1 {font-size: 16px;}
  .wrap-header .head-navi .a_2 {font-size: 15px;}
}
@media (max-width: 1024px) {
  .wrap-header.fNav .top-header {display: block;}
  .wrap-visual {margin-top: 0;}

  .wrap-header .top-header {padding: 0 !important;}
  .wrap-header .sub-header {height: 70px;}
  .wrap-header .head-logo {top: 50px; left: 10px;}
  .wrap-header .head-logo a img {height: 50px;}
  .wrap-header .head-util {width: 70px; height: 70px; top: 40px;}
  .wrap-header .head-util li.btn-mgnb {width: 35px; height: 35px; top: 18px;  right: -18px;}

  .wrap-header .head-navi .ul_1 {flex-direction: column;}
  .wrap-header .head-navi .div_1 {padding-top: 20px;}
  .wrap-header .head-navi .div_2.on {top: 20px;}
  .wrap-header .head-navi .a_1 span {display: block; max-width: 100px;}
  .wrap-header .head-navi .a_2 {font-size: 16px; padding: 12px 15px;}
  .wrap-header .head-navi .a_2[target=_blank] span:before {top: -4px;}
}
@media (max-width: 768px) {
  .wrap-header .sub-header {height: 69px;}

  .wrap-header .head-navi .div_2 {width: 60% !important;}
  .wrap-header .head-navi .a_1 {padding: 15px 0 15px 10px;}
}
@media (max-width: 550px) {
  .wrap-header .head-logo {top: 44px; left: 10px;}
  .wrap-header .head-logo a img {height: 38px;}

  .wrap-header .head-util {top: 30px; height: calc(100% - 30px;)}

  .wrap-header .head-navi .header-navi-box {width: calc(100% - 30px);}
  .wrap-header .head-navi .div_2 {width: 50% !important;}
}

/* 서브 */
.wrap-sub-visual .slogan {margin-top: 130px;}
.wrap-sub-navi {z-index: 10;}
.wrap-sub-navi .sub-util {right: 10px;}
.wrap-sub-navi .sub-navi .navUl {max-height: 400px;}

@media (max-width: 1280px)  {
  .wrap-sub-visual {margin-top: 0;}
}
@media (max-width: 1200px)  {
  .wrap-sub-visual .slogan {margin-top: 115px;}
}
@media (max-width: 1024px) {
  .wrap-sub-visual .slogan {margin-top: 0;}
  .wrap-header .head-navi .a_1 {display: block;}
}

.wrap-contents .b-basic {padding: 6px 20px 5px 40px;}
