@charset "UTF-8";

/* 공통 - 상단으로 이동 */
#top{display: none; position: fixed; right: 50px; bottom: 30px; width: 79px; height: 78px; border-radius: 50%; background: url(../images/common/top.png)no-repeat center; z-index: 99999; box-shadow: 0 4px 15px rgba(0, 0, 0, .3); background-size: contain!important;}

@media (max-width: 1199px){

  #top{right: 20px; bottom: 20px; width: 50px; height: 50px;}

}

@media (max-width: 480px){

  #top{width: 45px; height: 45px;}

}

/* 공통 - 여백 */
.mt-20{margin-top: 20px!important;}
.mb-20{margin-bottom: 20px!important;}
.mb-30{margin-bottom: 30px!important;}

/* 가운데영역 */
.container{max-width: 1440px; margin: 0 auto; padding: 0 20px;}

/* 헤더 */
#headerWrap{position: relative; z-index: 999999;}
#headerWrap .bg{display: none; height: 450px; position: absolute; top:221px; left:0; right:0; background: linear-gradient(200deg, #4f94c4, #27476b, #1b2c44); z-index: 9;}
#headerWrap .headerTopWrap{display: flex; justify-content: center; border-bottom: 1px solid #ddd; background-color: #fff;}
#headerWrap .headerTopWrap .mobileMenuBtn{display: none!important;}
#headerWrap .headerTopWrap .logoBox h1 a{padding: 26px 0;}
#headerWrap .headerTopWrap .logoBox h1 a,
#headerWrap .headerTopWrap .logoBox h1 img{display: block;}
#headerWrap .headerTopWrap .btnBox{position: absolute; top:60px; right:53px; display: flex; align-items: center; gap: 0 27px;}
#headerWrap .headerTopWrap .btnBox a{display: block; transition: all .3s;}
#headerWrap .headerTopWrap .btnBox a:hover{transform: translateY(-7px);}
#headerWrap .headerTopWrap .btnBox .search{display: none; width: 27px; height: 27px; background: url(../images/common/search_icon.png)no-repeat center;}
#headerWrap .headerTopWrap .btnBox .signin{width: 22px; height: 27px; background: url(../images/common/icon01.png)no-repeat center;}
#headerWrap .headerTopWrap .btnBox .signup{width: 31px; height: 24px; background: url(../images/common/icon02.png)no-repeat center;}
#headerWrap .headerBottomWrap {display: flex; justify-content: center; background-color: #fff; box-shadow: 0 5px 5px rgba(0,0,0,.1);}
#headerWrap .headerBottomWrap .depth01{position: relative; display: flex; gap: 0; z-index: 999;}
#headerWrap .headerBottomWrap .depth01 li{position: relative;}
#headerWrap .headerBottomWrap .depth01 li:hover > a{font-weight: 700;}
#headerWrap .headerBottomWrap .depth01 li > a{ display: block; padding: 31px 80px; font-size: 20px; color: #000;}
#headerWrap .headerBottomWrap .depth01 li > a span{position: relative;}
#headerWrap .headerBottomWrap .depth01 li > a span::before{content: ''; height: 2px; position: absolute; left:0; bottom: -3px; width: 0; transition: all .3s; background-color: #1b2c44;}
#headerWrap .headerBottomWrap .depth01 li:hover  > a span::before{width: 100%;}
#headerWrap .headerBottomWrap .depth02{display: none; padding: 25px 0; position: absolute; top:92px; left:0; right:0;}
#headerWrap .headerBottomWrap .depth02 li h3 a{display: block; padding: 15px 20px; color: #fff; font-weight: 500; text-align: center;}
#headerWrap .headerBottomWrap .depth02 li h3 a:hover{text-decoration: underline;}
#headerWrap .headerTopWrap .mobileMenuBtn,
#headerWrap .headerBottomWrap .sitemapBtn{position: relative; display: block; width: 80px; background-color: #1b2c44;}
#headerWrap .headerTopWrap .mobileMenuBtn::after,
#headerWrap .headerBottomWrap .sitemapBtn::after{width: 49px; height: 32px; content: ''; position: absolute; top: 50%; left:50%; transform: translate(-50%, -50%); background: url(../images/common/menu_icon.png)no-repeat center; background-size: contain!important;}
#headerWrap .sitemapBox{display: none; position: fixed; top:0; left:0; right: 0; bottom: 0; z-index: 999; background-color: #fff; background: linear-gradient(200deg, #4f94c4, #27476b, #1b2c44);}
#headerWrap .sitemapBox .sitemapDepht01{padding-bottom: 25px; gap: 0 80px; display: flex; justify-content: center; border-bottom: 1px solid rgba(255,255,255, .4);}
#headerWrap .sitemapBox .sitemapDepht01 li h2 a{position: relative; display: block; padding: 30px 25px; color: #fff; font-size: 23px; text-align: center; transition: all .3s;}
#headerWrap .sitemapBox .sitemapDepht01 li h2 a::before{content: ''; position: absolute; left:0; bottom: 0; width: 0; height: 3px; transition: all .3s; background-color: #4f94c4;}
#headerWrap .sitemapBox .sitemapDepht01 li:hover h2 a::before{width: 100%;}
#headerWrap .sitemapBox .sitemapDepht01 li:hover h2 a{color: #4f94c4;}
#headerWrap .sitemapBox .sitemapDepht02{padding: 15px 0;}
#headerWrap .sitemapBox .sitemapDepht02 li h3 a{padding: 15px 0; display: block; text-align: center; color: #fff; font-weight: 500; font-size: 18px; transition: all .3s;}
#headerWrap .sitemapBox .sitemapDepht02 li h3 a:hover{color: #4f94c4;}
#headerWrap .sitemapBox .sitemapLogoBox{text-align: center;}
#headerWrap .sitemapBox .sitemapLogoBox h1 a{display: inline-block; padding: 50px 0 30px;}
#headerWrap .sitemapBox .sitemapLogoBox h1 a img{display: block; margin: 0 auto;}
#headerWrap .closeBtn{position: absolute; top: 20px; right: 30px; width: 50px;  height: 50px; background-color: #1b2c44; border-radius: 50%;}
#headerWrap .closeBtn::before,
#headerWrap .closeBtn::after{content:""; position:absolute; top: 50%;
  left: 50%; width: 20px; height: 2px; background:#fff;border-radius: 5px;}
#headerWrap .closeBtn::before{transform: translate(-50%, -50%) rotate(45deg);}
#headerWrap .closeBtn::after{transform: translate(-50%, -50%) rotate(-45deg);}
#headerWrap .mobileMenuWrap{display: none; position: fixed; top:0; right: 0; left:0; bottom: 0; background: rgba(0,0,0,.4);}
#headerWrap .mobileMenuBox{padding: 70px 0 0; position: absolute; top:0; right:-100%; bottom:0; max-width: 450px; width: 100%; background: linear-gradient(200deg, #4f94c4, #27476b, #1b2c44); z-index: 999;}
#headerWrap .mobileMenuBox .closeBtn{top: 20px; right:20px; width: 35px; height: 35px;}
#headerWrap .mobileMenuBox .closeBtn::before,
#headerWrap .mobileMenuBox .closeBtn::after{width: 15px; height: 2px;}
#headerWrap .mobileMenuBox .mobileMenuLogoBox{margin-bottom: 30px; text-align: center;}
#headerWrap .mobileMenuBox .mobileMenuLogoBox h1{display: flex; justify-content: center;}
#headerWrap .mobileMenuBox .mobileMenuLogoBox h1 a{display: block;}
#headerWrap .mobileMenuBox .mobileMenuLogoBox h1 a img{display: block; margin: 0 auto; width: 195px;}
#headerWrap .mobileMenuBox .mobileDepht01{height: calc(100vh - 240px); overflow-y: auto;     -ms-overflow-style: none; scrollbar-width: none;}
#headerWrap .mobileMenuBox .mobileDepht01::-webkit-scrollbar{display: none;}
#headerWrap .mobileMenuBox .mobileDepht01 li h2 a{position: relative; padding: 15px 65px 15px 40px; display: block; color: #fff; font-size: 18px;}
#headerWrap .mobileMenuBox .mobileDepht01 li h2.active a::after{transform: translateY(-50%) rotate(-135deg)!important;}
#headerWrap .mobileMenuBox .mobileDepht01 li h2.arrow a::after{content:''; position:absolute; top:50%; right:30px; transform:translateY(-50%) rotate(45deg); width:8px; height:8px; border-right:2px solid #fff;
    border-bottom:2px solid #fff; transition: all .3s;}
#headerWrap .mobileMenuBox .mobileDepht02{display: none; padding: 13px 0;}
#headerWrap .mobileMenuBox .mobileDepht02 li h3 a{display: block; padding: 12px 20px 12px 55px; font-size: 16px; color: #fff; font-weight: 300;}
#headerWrap .mobileMenuBox .btnBox{padding: 30px 0; display: flex; justify-content: center; align-items: center; gap: 0 20px;}
#headerWrap .mobileMenuBox .btnBox a{display: block; font-size: 16px; color: #fff;}
#headerWrap .mobileMenuBox .btnBox .search{display: none; width: 27px; height: 27px; background: url(../images/common/search_icon.png)no-repeat center;}

@media (min-width: 1200px){
  
  #headerWrap .mobileMenuWrap{display: none!important;}

}

@media (max-width: 1580px){

  #headerWrap .headerBottomWrap{justify-content: flex-start;}
  #headerWrap .headerBottomWrap .sitemapBtn{flex-shrink: 0;}
  #headerWrap .headerBottomWrap .menu{justify-content: center;}
  #headerWrap .headerBottomWrap .depth01 li a{padding: 31px 60px;}

}

@media (max-width: 1280px){

  #headerWrap .headerBottomWrap .depth01 li a{padding: 31px 55px;}
  
  #headerWrap .sitemapBox .sitemapDepht01 li h2 a{padding: 20px; font-size: 22px;}

}

@media (max-width: 1199px){
  
  #headerWrap .headerBottomWrap .depth01::before,
  #headerWrap .bg{display: none;}
  #headerWrap{box-shadow: 0 5px 5px rgba(0, 0, 0, .1);}
  #headerWrap .sitemapBox{display: none;}
  #headerWrap{position: fixed; top:0; left:0; right:0;}
  #headerWrap .headerBottomWrap{display: none;}
  #headerWrap .headerTopWrap{padding-left: 20px; border-bottom: 0;}
  #headerWrap .headerTopWrap .logoBox h1 img{width: 200px;}
  #headerWrap .headerTopWrap .logoBox h1 a{padding: 15px 0;}
  #headerWrap .headerTopWrap .btnBox{display: none;}
  #headerWrap .headerTopWrap .mobileMenuBtn{display: block!important;}
  #headerWrap .headerTopWrap{justify-content: space-between;}
  #headerWrap .headerTopWrap .mobileMenuBtn::after{width: 39px; height: 22px;}

}

@media (max-width: 767px){

  #headerWrap .headerTopWrap .logoBox h1 img{width: 150px;}
  #headerWrap .headerTopWrap .mobileMenuBtn{width: 60px;}
  #headerWrap .headerTopWrap .mobileMenuBtn::after{width: 34px; height: 17px;}

}

@media (max-width: 480px){

  #headerWrap .headerTopWrap .logoBox h1 img{width: 120px;}
  #headerWrap .headerTopWrap .logoBox h1 a{padding: 10px 0;}
  #headerWrap .headerTopWrap .mobileMenuBtn{width: 50px;}
  #headerWrap .headerTopWrap .mobileMenuBtn::after{width: 30px; height: 13px;}

}

/* 푸터 */
#footerWrap{background-color: #30343b; border-top: 1px solid #fff;}
#footerWrap .footerBottomBox .footerLogoBox img{display: block;}
#footerWrap .footerTopBox .layoutBox{display: flex; justify-content: space-between;}
#footerWrap .footerTopBox{border-bottom: 1px solid #c1c2c5;}
#footerWrap .footerTopBox .link{display: flex; align-items: center; gap: 0 40px;}
#footerWrap .footerTopBox .link li{position: relative;}
#footerWrap .footerTopBox .link li::after{content: ''; position: absolute; top:22px; right:-20px; width: 1px; height: 16px; background-color: #c1c2c5;}
#footerWrap .footerTopBox .link li:last-child:after{display: none;}
#footerWrap .footerTopBox .link li a{padding: 15px 0; display: block; font-weight: 500; color: #fff; font-size: 18px; word-break: keep-all; text-align: center;}
#footerWrap .footerTopBox .snsLink{margin-top: 6px; display: flex; align-items: center; gap: 0 18px;}
#footerWrap .footerTopBox .snsLink li a,
#footerWrap .footerTopBox .snsLink li a{display: block;}
#footerWrap .footerBottomBox{padding: 50px 0 45px;}
#footerWrap .footerBottomBox .footerLogoBox{margin-bottom: 35px;}
#footerWrap .footerBottomBox .footerInfoList {margin-bottom: 40px;}
#footerWrap .footerBottomBox .footerInfoList .box{margin-bottom: 8px; font-size: 18px; font-weight: 300; color: #808285; line-height: 1.6;}
#footerWrap .footerBottomBox .footerInfoList .box span{margin-right: 15px;}
#footerWrap .footerBottomBox .footerInfoList .box strong{margin-right: 3px;}
#footerWrap .footerBottomBox .copyright{display: block; font-size: 18px; font-weight: 300; color: #808285;}

@media (max-width: 1199px){

  #footerWrap .footerTopBox{padding: 10px 0 15px;}
  #footerWrap .footerTopBox .layoutBox{flex-direction: column; align-items: center; gap: 10px 0;} 
  #footerWrap .footerTopBox .link li::after{height: 12px;}
  #footerWrap .footerTopBox .link li a{font-size: 16px;}
  #footerWrap .footerBottomBox .footerLogoBox img{margin: 0 auto; width: 230px;}
  #footerWrap .footerBottomBox .copyright,
  #footerWrap .footerBottomBox .footerInfoList .box{font-size: 16px; text-align: center;}

}

@media (max-width: 767px){
  
  #footerWrap .footerTopBox .link{flex-direction: column; align-items: center; gap: 0;}
  #footerWrap .footerTopBox .link li::after{top: auto; right: auto; left: 50%; margin-left: -6px; bottom: 0; width: 12px; height: 1px;}


}

@media (max-width: 480px){

  #footerWrap .footerBottomBox .footerInfoList .box br{display: none;}
  #footerWrap .footerBottomBox .footerInfoList .box span{display: block;}
  #footerWrap .footerTopBox .link li a{font-size: 14px;}
  #footerWrap .footerBottomBox .footerLogoBox img{margin: 0 auto; width: 200px;}
  #footerWrap .footerBottomBox .copyright,
  #footerWrap .footerBottomBox .footerInfoList .box{font-size: 14px;}
  
}

/* 그누보드 - 검색 */
#hd_sch{position: relative;}
#hd_sch #sch_submit{position: absolute; top: 50%; transform: translateY(-50%); right: 0; background: 0;}
#hd_sch #sch_stx{width: 280px; padding: 0 50px 0 20px; background-color: #1b2c44; font-size: 16px;}
#hd_sch #sch_stx::placeholder{color: #fff;}

.switch_field{display: none !important;}

/* 그누보드 - 개인정보처리방침 */
#ctt{flex: 1;}

/* 그누보드 - 회원가입, 검색결과 */
#bo_v,
#sch_result,
.register{max-width: 1440px; margin: 0 auto; padding: 80px 20px;}

@media (max-width: 1199px){

  #bo_v,
  #sch_result,
  .register{padding: 150px 20px;}

}


/* 20250818 bpopup 영역 */
.tl_pop_con{background:#fff;} 
.tl_pop_con h2.f_pop_tit{width:100%;height:80px;line-height:80px;background:#076aa3;font-size:20px;color:#fff;}
.tl_pop_con h2.f_pop_tit img {display:inline-block;margin-left:50px;margin-right:5px;margin-top:-10px;width:120px;}
.tl_pop_con h2.f_pop_tit span {display:inline-block; padding-left:50px;}
.f_pop_wrap {line-height:23px;text-align:justify;word-break:break-all;font-size:15px;overflow-y:auto;}
.f_pop_wrap strong {color:#00a19a;font-weight:normal;}
.f_pop_wrap p { color:#333; padding:40px 50px; line-height:1.6;}
.mfp-close:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url("../images/w_btn_close.png") no-repeat center center; -webkit-transition: -webkit-transform 300ms; transition: -webkit-transform 300ms; transition: transform 300ms; transition: transform 300ms, -webkit-transform 300ms; border-radius: 50%; }
.mfp-close { width: 40px; height: 40px; text-indent: -999px;opacity: 1; overflow: hidden; background-color:transparent; border:0; }
button.mfp-close:hover:after { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }

.mfp-close02:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url("../images/w_btn_close.png") no-repeat center center; -webkit-transition: -webkit-transform 300ms; transition: -webkit-transform 300ms; transition: transform 300ms; transition: transform 300ms, -webkit-transform 300ms; border-radius: 50%; }
.mfp-close02 { width: 40px; height: 40px; text-indent: -999px;opacity: 1; overflow: hidden; background-color:transparent; border:0; }
button.mfp-close02:hover:after { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }

.mfp-close2:after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: -32px;
	left: 0;
	background: url("../images/w_btn_close.png") no-repeat center center;
	-webkit-transition: -webkit-transform 300ms;
	transition: -webkit-transform 300ms;
	transition: transform 300ms;
	transition: transform 300ms, -webkit-transform 300ms;
	border-radius: 50%;
}

.mfp-close2 {
	width: 40px;
	height: 40px;
	text-indent: -999px;
	opacity: 1;
	overflow: hidden;
	background-color: transparent;
	border: 0;
}

button.mfp-close2:hover:after {
	-webkit-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg)
}