@charset "utf-8";

/* footer */
#footer{position:relative !important;width:auto !important;border:0;border-top:1px solid #ddd;background-color:#F9F9FB;}
#footer .container{position:relative;}
#footer .footerBanner{position:relative;bottom:0;left:0;width:100%;box-sizing:border-box;border-top:0;background:#fff;}
#footer .footerBanner .f-inner{display:flex;justify-content:flex-start;align-items:center;margin:0 auto;padding:0 2rem;max-width:164rem;box-sizing:border-box;}
#footer .footerBanner::before,
#footer .footerBanner::after{content:unset;}
#footer .footerBanner .f_ban_tit{margin-right:auto;font-size:1.6rem;font-weight:700;color:#163676;line-height:1.5;}
#footer .footerBanner .f_ban_list__wrap{padding:0 1rem;width:calc(100% - 107px);overflow:hidden;}
#footer .footerBanner .swiper-slide{width:auto;max-width:fit-content;}
#footer .footerBanner .elem-familySite__item{display:flex;justify-content:center;align-items:center;margin-left:0;width:auto;max-width:fit-content;height:8.8rem;border:0;}
#footer .footerBanner .elem-familySite__item a{position:relative;height:auto;font-size:1.6rem;font-weight:700;color:#747478;line-height:1.5;}
#footer .footerBanner .elem-familySite__item a::before{content:'';position:absolute;top:calc(50% - 1rem);right:-3.2rem;width:1px;height:2rem;background:#CFDCE6;}
#footer .footerBanner .swiper-slide:last-of-type .elem-familySite__item a::before{display:none;}
#footer .footerBanner .swiper-button-prev, footer .footerBanner .swiper-button-next{display:none;}
#footer .footerBanner .swiper-button-prev{background:url('/_res/h2hub/main/img/common/arrow_triangle_left.png') no-repeat;}
#footer .footerBanner .swiper-button-next{background-color:unset;}

#footer .f_nav::before{position:none !important;}
#footer .f_nav::after{position:none !important;}
#footer .f_info{display:block;position:relative;margin:0 auto;padding:4rem 2rem 6.4rem;max-width:164rem;box-sizing:border-box;}
/* #footer .f_info::before{ content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: block; width: 100%; height: 1px; background-color: #999;} */
#footer .f_info::before{content:unset;}
#footer .footerLogo{display:flex;margin:0;width:237px;height:47px;background:url(https://h2hub.or.kr/_res/h2hub/main/img/comm/footerlogo.png) no-repeat center center;}

#footer .f_info .footerContent{margin-left:0rem;}
#footer .f_info .footerContent .fnb .list-unstyled{display:flex;margin:0 0 1.2rem;}
#footer .f_info .footerContent .fnb ul li a{font-size:1.7rem;font-weight:500;line-height:1.5;color:#111;}
#footer .f_info .footerContent .fnb ul li + li{margin-left:4rem;}
#footer .f_info .footerContent .fnb ul li:nth-child(1) a{font-weight:700;}

#footer .f_content__wrap{display:flex;justify-content:space-between;gap:1rem;padding-right:6rem;}

#footer .addr{margin:1.2rem 0 0;}
#footer .addr address b{font-weight:700;color:#006ECF;}
#footer .addr address p{font-size:1.6rem;font-weight:400;line-height:1.6;color:#111;}
#footer .addr address p.address{display:inline-block;margin:0 0 6px;line-height:1.6;}
#footer .addr address p.address strong{margin:0 1.6rem 0 0;font-weight:700;color:#163676;}
#footer .addr address ul{display:block;padding:0;}
#footer .addr address ul li{display:inline-block;font-size:1.6rem;font-weight:400;line-height:1.6;color:#111;}
#footer .addr address ul li + li{margin-left:2rem;}
#footer .addr address ul li:last-child{margin-right:0;}
#footer .addr address p.copyright{margin-top:4rem;font-size:1.5rem;font-weight:400;line-height:1.6;color:#666;}

#footer .f_content__wrap .right{display:flex;justify-content:flex-end;align-items:center;}

#footer .footersite{position:absolute;right:6rem;}
#footer .waWrap{margin-top:0;margin-left:auto;width:13.2rem;height:auto;}
#footer .waWrap img{float:none !important;width:100%;}
#footer .sitemapWrap{display:flex;align-items:center;position:relative;margin:0 1.6rem;padding:0 3.4rem;width:23rem;height:6rem;box-sizing:border-box;border-radius:6rem;background-color:#fff;box-shadow:1px 2px 13px 0 rgba(0,0,0,0.03);}
#footer .sitemapWrap::after{content:'';position:absolute;top:50%;right:3rem;width:2.4rem;height:2.4rem;border:none;background:url('/_res/h2hub/main/img/common/icon_chevron_down.png') no-repeat 0 0/contain;text-indent:0;transform:translateY(-50%);}

#footer .sitemapWrap.active::after{transform:rotate(180deg) translateY(50%);}
#footer .sitemapWrap .list-unstyled{display:none;position:absolute;right:-1px;bottom:6.8rem;z-index:2;width:23rem;overflow:hidden;border:1px solid #ebebeb;border-radius:1.5rem;border-top:0;background-color:#fff;}
#footer .sitemapWrap .list-unstyled > li > a{display:block;padding:2rem 4rem;width:100%;box-sizing:border-box;background:#fff;background:#fff;font-size:1.4rem;color:#222;}
#footer .sitemapWrap .list-unstyled > li{border-top:1px solid #ebebeb;}
#footer .sitemapWrap .list-unstyled.active{display:block !important;}

#footer .sitemapWrap button{background-color:#fff;font-size:1.6rem;font-weight:400;line-height:1;letter-spacing:-0.25px;color:#111;}
#footer .waWrap img{float:right;}

#footer .go-top div{display:inline-block;position:fixed;right:16rem;bottom:9.7rem;z-index:9;width:4.4rem;height:4.4rem;box-sizing:content-box;border:8px solid #fff;border-radius:4.4rem;background-color:#163676;background-image:url('/_res/h2hub/main/img/common/arrow_up_white.png');background-position:center;background-size:2.4rem;background-repeat:no-repeat;cursor:pointer;z-index:10;}

@media screen and (min-width:1921px){
	#footer .go-top div{right:unset;}
}

@media screen and (max-width:1920px){
	#footer .go-top div{right:2rem;}
}

@media screen and (max-width:1640px){
	#footer .footerBanner .f-inner{padding:0 3.2rem;}
	#footer .f_info{padding:4rem 3.2rem 6.4rem;}
}

@media screen and (max-width:1024.98px){
	#footer .footerBanner{padding:0 48px;}	
	#footer .footerBanner .f-inner{padding:0;}
	#footer .footerBanner .f_ban_list__wrap{padding:0;width:100%;}
	#footer .footerBanner .swiper.mySwiper{padding:20px 0;}
	#footer .footerBanner .swiper-button-prev,
	#footer .footerBanner .swiper-button-next{display:inline-block;top:50%;margin-top:0;padding:0;width:48px;height:100%;background-position:center center;transform:translateY(-50%);pointer-events:auto !important;}
	#footer .footerBanner .swiper-button-prev{padding-left:0px;height:100%;background-size:contain;background-size:9px;}
	#footer .footerBanner .swiper-button-next{padding-right:0;height:100%;background-color:unset;}
	#footer .footerBanner .swiper-button-next::before{content:'';position:absolute;top:0;right:0;padding-right:0;width:49px;height:100%;background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 44%, rgba(255, 255, 255, 1) 100%);background-size:cover;background-repeat:no-repeat;background-position:center;pointer-events:none;}
	#footer .footerBanner .swiper-button-next::after{content:'';position:absolute;top:0;right:12px;width:8px;height:100%;background-image:url('/_res/h2hub/main/img/common/arrow_triangle_right.png');background-size:9px;background-repeat:no-repeat;background-position:center;}
	
	#footer .footerBanner .swiper-button-prev{left:0;background-color:#fff;}
	#footer .footerBanner .swiper-button-next{right:0;background-color:unset;background-image:none;}
	#footer .elem-familySite__item img{width:80%;}
	#footer .footerBanner .elem-familySite__item{height:24px;}
	#footer .footerBanner .elem-familySite__item a::before{top:calc(50% - 6px);right:-12px;height:12px;}
	#footer .footerBanner .f_ban_list__wrap{width:100%;}
	#footer .footerBanner .f_ban_tit{display:none;}
	#footer .footerBanner .elem-familySite__item a{font-size:17.647px;}
	
	#footer .footerBanner .f_ban_tit{margin-right:10px;font-size:16px;}
	#footer .footerBanner .elem-familySite__item a, #footer .addr address p,
	#footer .f_info .footerContent .fnb ul li a, #footer .sitemapWrap button{font-size:14px;word-break:keep-all;}

	#footer .f_content__wrap{flex-direction:column;padding:0;}
	#footer .footersite{display:flex;position:initial;}
	#footer .f_info .footerContent{margin-top:0px;margin-left:0;}
	#footer .footersite{order:2;margin-top:10px;}
	#footer .waWrap{grid-row:4/5;grid-column:1/2;margin:0 auto;margin-top:30px;padding-top:0;width:100px;}
	#footer .footerLogo{width:100%;height:50px;background-size:300px;background-position:center center;background-size:contain;}

	#footer .f_info{padding:24px 16px 32px;}
	#footer .f_info .footerContent .fnb ul li + li{margin-left:0;}
	#footer .f_info .footerContent .fnb ul li a{font-size:13px;}
	#footer .addr{margin:0;}
	#footer .addr address p.address{font-size:12px;line-height:1.6;text-align:center;}
	#footer .addr address p.address strong{display:block;margin:0 0 8px;font-size:13px;line-height:1.6;}
	#footer .addr address ul{margin-top:0;}
	#footer .addr address ul li{padding-left:0;font-size:12px;line-height:1.6;}
	#footer .addr address ul li + li{margin-left:10px;}
	#footer .addr address ul li:last-child{margin-left:0;}
	#footer .addr address{text-align:center;}
	#footer .f_info .footerContent .fnb .list-unstyled{justify-content:center;flex-wrap:wrap;gap:16px 24px;margin:0 auto 24px;}
	#footer .addr address p.copyright{margin:24px 0 0;font-size:12px;line-height:1.6;text-align:center;}

	#footer .f_content__wrap .right{flex-direction:column;margin-right:0;margin-top:20.588px;}
	#footer .waWrap{margin-top:0;width:108.84px;}
	#footer .sitemapWrap{margin:24px 62px 0 0;padding:15px 25px;width:calc(100% - 62px);max-width:310px;height:auto;box-shadow:unset;height:50px;}
	#footer .sitemapWrap .sitemap_div{line-height:1.1;}
	#footer .sitemapWrap .list-unstyled{bottom:74px;width:338.24px;}
	#footer .sitemapWrap button{padding:0;font-size:13px;text-align:left;}

	#footer .f_content__wrap .right{margin:24px 0 0;}
	#footer .waWrap{margin-top:5px;width:90px;height:auto;}
	#footer .sitemapWrap::after{right:29.411px;width:23.54px;height:23.54px;}
	#footer .sitemapWrap .list-unstyled{bottom:58px;width:100%;}
	#footer .sitemapWrap .list-unstyled > li > a{padding:15px 25px;}

	#footer .go-top div{bottom:32px;right:17px;width:36px;height:36px;border:6px solid #fff;background-size:20px;}
}

@media screen and (max-width:768px){	
	#footer .f_info{padding:24px 16px 32px}
}

@media screen and (max-width:750px){
	#footer .addr address p{text-align:left;}
}

@media screen and (max-width:475px){
	#footer .footerBanner .swiper-button-prev,
	footer .footerBanner .swiper-button-next{background-color:#fff;}
	#footer .f_info .footerContent .fnb .list-unstyled{width:88%;}
	#footer .addr address p.address .mo-item{display:none;}
}

@media screen and (min-width:320px) and (max-width:475px){
	#footer .elem-familySite__item img{width:60%;}
	#footer .elem-familySite__item:nth-child(-n + 3) img{width:75% !important;}
}