@charset "UTF-8";

/* body{
	font-family: 'NanumGothic', sans-serif;
	color: #393939; 
	font-size: 16px;
	line-height:130%;
} */

.container .grayBt	{ background:#f7f7f7 !important; border:1px solid #d7d7d7 !important; color:#323232 !important; }
.container .blueBt	{ background:#208da9 !important; border:1px solid #208da9 !important; color:#fff !important; }


.headerWrap	{ width:100%; z-index: 2;  background: #ffffff;}
.headerWrap	.logo	{position: absolute; top: 30px; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0);}
.headerWrap	.logo > a	{display: block;}
.headerWrap	.logo > a img	{width: 232px;}
.headerWrap .headTop	{ max-width:1200px; margin:0 auto; height:100px; overflow:hidden; position: relative;}
.headerWrap .headTop div	{ position: absolute; right: 0; top: 50%; transform: translate(0,-50%); -ms-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); overflow: hidden;}
.headerWrap .headTop div > a	{ float:left; border:1px solid #bfbfbf; border-radius: 20px; background:#ffffff; height:20px; text-align: center; min-width: 74px; font-size:0.750em; color:#333333; line-height:19px; margin-left: 10px; font-weight: 600;}
.headerWrap .header	{ width:100%; border-top:1px solid #dbdbdb; position:relative; z-index: 2;}
.headerWrap .header .gnbArea	{ max-width:1315px; margin:0 auto; position:relative; height: 55px; z-index: 2;}
.headerWrap .header .gnbArea .logo	{display: none;}
/*적용*/
.headerWrap .header .gnbArea .gnb	{
	width: 100%;
    padding-right: 100px;
    display: flex;
    flex-direction: row;
}
.headerWrap .header .gnbArea .gnb>li{    
	position: relative;
    flex: 1 1 auto;
	text-align: center;
}
.headerWrap .header .gnbArea .gnb>li:first-child{
	/*padding-left: 0;*/
	margin-left: -36px;
	 /* width: 16.2%;  */
	 /* margin-left: 0; */
}
.headerWrap .header .gnbArea .gnb>li>a	{ display:inline-block; height: 55px; line-height: 55px; font-size:1.125em; color:#1c1c1c; text-decoration:none;  text-align: center; /*border-bottom: 4px solid #ffffff;*/}
.headerWrap .header .gnbArea .gnb>li>a.select{color:#254e97; font-weight: 600;} 
/* 이전 */
/* .headerWrap .header .gnbArea .gnb	{ width:100%; display:block; padding-right: 40px;}
.headerWrap .header .gnbArea .gnb>li	{ float:left; display: inline-block; width: 12.5%;}
.headerWrap .header .gnbArea .gnb>li:first-child{margin-left: -15px;}
.headerWrap .header .gnbArea .gnb>li>a	{ display:block; height: 55px; line-height: 55px; font-size:1.125em; color:#1c1c1c; text-decoration:none;  text-align: center; border-bottom: 4px solid #ffffff;} */

/* gnb 하단 선 여부 */
/* .headerWrap .header .gnbArea .gnb>li>a:hover,
.headerWrap .header .gnbArea .gnb>li>a:focus	{ border-bottom:3px solid #004892; } */

.headerWrap .header .gnbArea .gnb>li>a.on{border-bottom:3px solid #004892;}


.headerWrap .header .gnbArea .gnb .gnbS	{ position:absolute; top:55px; left:0px; width:100%; text-align:center; min-height:276px; overflow:hidden; display:none; z-index:3; padding:30px 0 30px 6.2%; background: #f6f7f9; border-top: 1px solid #cccccc;}
.headerWrap .header .gnbArea .gnb .gnbS.on{display: block;}
.headerWrap .header .gnbArea .gnb .gnbS > li	{ float: left; width:17.5%; margin-right: 5.8%;}
.headerWrap .header .gnbArea .gnb .gnbS > li:nth-child(4n)	{margin-right: 0;}
.headerWrap .header .gnbArea .gnb .gnbS > li:nth-child(n+5)	{margin-top: 30px;}

.headerWrap .header .gnbArea .gnb .gnbS > li > a	{color:#1f1f1f; display:block; padding:9px 0; text-align:center; border: 1px solid #cccccc; background: #ffffff; }
/* .headerWrap .header .gnbArea .gnb .gnbS > li > a:hover,
.headerWrap .header .gnbArea .gnb .gnbS > li > a:focus	{border: 1px solid #254e97; color:#254e97; box-shadow: 1px 1px 0 #254e97 inset, -1px -1px 0 #254e97 inset;} */
.headerWrap .header .gnbArea .gnb .gnbS > li.on > a	{border: 1px solid #254e97; color:#254e97; box-shadow: 1px 1px 0 #254e97 inset, -1px -1px 0 #254e97 inset;}
.headerWrap .header .gnbArea .gnb .gnbS > li > ul	{padding:10px; margin-top:9px; padding-left: 20px;}
.headerWrap .header .gnbArea .gnb .gnbS > li > ul > li	{text-align: left; margin-top: 8px;}
.headerWrap .header .gnbArea .gnb .gnbS > li > ul > li:first-child	{margin-top: 0;}
.headerWrap .header .gnbArea .gnb .gnbS > li > ul > li > a:hover,
.headerWrap .header .gnbArea .gnb .gnbS > li > ul > li > a:focus	{ color:#254e97; font-weight: 600; border-bottom: 1px solid #31589d; }
/* .headerWrap .header .gnbArea .gnb .gnbS>li > ul >li > a {color: #ffffff;} */

/*05.16*/
.gnb > li > .list.depth2{padding: 30px 5px; position: absolute; top: 56px; width: 100%; left: 0; overflow: hidden; z-index: 1; display: none;}
/* .gnb > li > .list.depth2 > li{padding-top: 30px;} */
.gnb > li > .list.depth2 > li:first-child a{padding-top: 0;}
.gnb > li > .list.depth2 > li:last-child a{padding-bottom: 0;}
.gnb > li > .list.depth2 > li a{display: block; color: #1f1f1f; text-align: center; line-height: 1; padding: 15px 0;}  
.gnb > li > .list.depth2 > li a:hover, .gnb > li > .list.depth2 > li a:focus{color:#254e97; font-weight: 600;}

/*3뎁스*/
.gnb > li > .list.depth2 > li > ul{padding: 5px 0 5px 0; display: none;}
.gnb > li > .list.depth2 > li > ul > li{margin-top: 11px;}
.gnb > li > .list.depth2 > li > ul > li a{font-size: 0.875em;/* font-weight: 300; */color: #4a4949;}
.gnb > li > .list.depth2 > li > ul > li:first-child{margin-top: 0;}


.gnbSubBg	{ width:100%; height:258px; background: rgba(32,141,169, 0.9); position:absolute; top:121px; left:0; z-index:9; }
.headerWrap .header .mobGnbBt	{ display:none; position:absolute; top:50%; left:30px; margin-top:-25px; }
.headerWrap .header .homeBt	{ display:none; position:absolute; top:50%; right:30px; margin-top:-25px; }
.headerWrap p span a b{display: block;}

.headerWrap.scrolled .headTop{	display: none;}
.headerWrap.scrolled .header{/* position: fixed;	 */	background: #ffffff;	top: 0;	border-top: 0; border-bottom: 1px solid #dbdbdb;}


/*메뉴*/
.view_wrap{	position: absolute; right: 0; top: 50%;	height: 15px; z-index: 1;	transform: translate(0,-50%);	-ms-transform: translate(0,-50%);	-webkit-transform: translate(0,-50%);}
.view_wrap .hamburger{background: transparent; font-size: 0; width: 38px; height: 54px;}
.hamburger .line{	width: 21px; height: 2px; background-color: #333333; display: block; margin: 4px auto 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.hamburger .line:first-child{margin-top: 0;}
.hamburger.is-active .line:nth-child(1){	-webkit-transform: translateY(6px) rotate(45deg); -ms-transform: translateY(6px) rotate(45deg); -o-transform: translateY(6px) rotate(45deg); transform: translateY(6px) rotate(45deg);}
.hamburger.is-active .line:nth-child(2){	opacity: 0;}
.hamburger.is-active .line:nth-child(3){	-webkit-transform: translateY(-6px) rotate(-45deg); -ms-transform: translateY(-6px) rotate(-45deg); -o-transform: translateY(-6px) rotate(-45deg); transform: translateY(-6px) rotate(-45deg);}

/* sitemap */ 
.sitemap{display: none;}
.sitemap.on{background: #fff;position: absolute;top: 0;left: 0;display: block;width: 100%;margin-top: 55px;border: 1px solid #dddddd; }
.sitemap > li{float: left;width: 20%;border: 1px solid #dddddd;border-width: 0 1px 1px 0; height: 531px;}
.sitemap > li:nth-child(5n){border-right: 0;}
.sitemap > li:nth-child(n+6){/*min-height: 797px;*/  /*04.19 메뉴구조도 늘어나면서 높이수정함 */min-height: 927px; border-bottom: 0;}
.sitemap > li > a{display: block;color: #1f1f1f;font-weight: 600;text-align: center;line-height: 1;padding: 15px 10px;background: #f0f3f8; letter-spacing: 0;}
.sitemap > li > .site_gnb{padding: 18px 0;border-top: 1px solid #cccccc;}
.sitemap > li > .site_gnb > li{padding:0 20px; margin-top: 18px;}
.sitemap > li > .site_gnb > li:first-child{margin-top: 0;}
.sitemap > li > .site_gnb > li > a{border-bottom: 1px solid #cccccc;display: block;padding-bottom: 9px;color: #1f1f1f;font-weight: 600;font-size: 0.938em; letter-spacing: 0;}
.sitemap > li > .site_gnb > li > ul{padding: 8px 5px; margin: 0;}
.sitemap > li > .site_gnb > li > ul > li{margin-top: 4px;}
.sitemap > li > .site_gnb > li > ul > li:first-child{margin-top: 0;}


/* .m_header .mobGnb .join_wrap div{
	display: table;
	table-layout: fixed;
	width: 100%;
	overflow: hidden;
	margin: 0 auto;
	text-align: center;
	border-spacing: 10px 0;
}

.m_header .mobGnb .join_wrap div > a	{border:1px solid #bfbfbf;border-radius: 20px;background:#ffffff;height:24px;text-align: center;min-width: 67px;font-size:0.875em;color:#333333;line-height:22px;font-weight: 600;width: 31.3%;margin-right: 3%; display: table-cell;}  
.m_header .mobGnb .join_wrap div > a:last-child{margin-right: 0;} */

/* m_menu */
.m_header{display: none;}
.mobGnb	{ position:fixed; top:80px; right:0; z-index:100; margin-right:-70%; width:70%; background:#fff; height:100%; overflow:auto; padding-bottom: 200px;}
.mobGnb .m_gnb	{ border-bottom: 1px solid #dddddd; margin-bottom: 80px;}
.mobGnb .m_gnb>li	{ width:100%; display:block; border-top: 1px solid #dddddd;}
.mobGnb .m_gnb>li:first-child{border-top: 0;}
.mobGnb .m_gnb>li>a	{height: 45px;line-height: 45px;display: block;font-weight: 600;color: #1f1f1f;padding: 0 20px;}
.mobGnb .m_gnb>li>a.on	{background: #f0f3f8; border-bottom: 1px solid #dddddd;}
.mobGnb .m_gnb>li>.m_gnbS	{display:none; background: #ffffff;padding: 20px 30px;}
.mobGnb .m_gnb>li>.m_gnbS>li	{margin-top: 20px;}
.mobGnb .m_gnb>li>.m_gnbS>li:first-child{margin-top: 0;}
.mobGnb .m_gnb>li>.m_gnbS>li>a	{color:#3c3c3c;display:block; font-weight: 600;}
.mobGnb .m_gnb>li>.m_gnbS>li ul	{padding-left: 10px;}
.mobGnb .m_gnb>li>.m_gnbS>li ul li	{ padding:0 0 0 10px; position:relative; }
.mobGnb .m_gnb>li>.m_gnbS>li ul li:first-child{margin-top: 0;}
/* .mobGnb .m_gnb>li>.m_gnbS>li ul li:after	{width:3px;height:3px;background:#333;position:absolute;top:16px;left:0;} */
.mobGnb .m_gnb>li>.m_gnbS>li ul li a	{font-size: 0.938em;}


.mobFade{position:fixed; display: none; top:113px; left:0; width:100%; height:100%;  background:rgba(0,0,0,5); opacity:0.8; z-index:1;}
.mobFade.on{display: block;}


.footerWrap	{ position: relative; background: #303039; }
.footerWrap .mft_list	{display: none;}
.footerWrap .footerMenu	{ max-width: 1200px; height: 50px; padding: 15px 0; padding-left: 320px; margin: 0 auto; background: #303039;}
.footerWrap .footerMenu a	{ font-size: 0.875em; /*font-weight: 300;*/ color: #b9b9b9; line-height: 18px; padding: 0 30px; float: left; margin: 0; position: relative;}
.footerWrap .footerMenu a:after	{ content:''; width:1px; height:10px; position:absolute; top:50%; left:0px; background:#6d6d6f; margin:-4px 0 0; }
.footerWrap .footerMenu a:first-child	{ color:#91c4d5; padding-left: 0;}
.footerWrap .footerMenu a:first-child:after	{ display:none; }
.footerWrap .footerArea	{ background: #3e3e47; padding:26px 0;}
.footerWrap .footerArea .footer	{ max-width:1200px; margin:0 auto; padding:0 0 0 0px; position:relative; }
.footerWrap .footerArea .footer .footLogo	{ position:absolute; top:7px; left:0; width: 233px;}
.footerWrap .footerArea .footer .address	{ font-size:0.875em; color:#bdbdbd; /*font-weight: 300;*/ margin-top: 7px;}
.footerWrap .footerArea .footer .address:first-child{margin-top: 0;}

/* ft_sns_list */
.footerWrap .footerArea .ft_sns_list{overflow: hidden; position: absolute; right: 0; top: 50%; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); border: 1px solid #1d1d1d;}
.footerWrap .footerArea .ft_sns_list li{float: left;text-align: center; background: #fff; border-left: 1px solid #1d1d1d;}
.footerWrap .footerArea .ft_sns_list li > a{display: block; width: 39px; height: 38px; padding-top: 9px; }
.footerWrap .footerArea .ft_sns_list li:first-child{border-left: none;}

/* contop_btn */
.footerWrap .contop_btn{position: absolute; right:0; top: 0;}
.footerWrap .contop_btn > span{display: block; width: 58px; height: 50px; background: #254e97; color: #ffffff;}
.footerWrap .contop_btn > span:before{content: ''; display: block; background-image: url(/_static/yjcf/img/sub/bar_on.png); background-position: center top 13px; background-repeat: no-repeat; height: 7px; width: 12px; padding-top: 13px; padding-bottom: 4px; margin: 0 auto;}

/* .gnb_bg */ 

.gnb_bg{	display: none; position: absolute; top: 55px; left: 0; z-index: 1; width: 100%; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background: #fff;	}

/* 헤더 메뉴 목록 블릿 */
.h_sub_list{ margin-top: 9px; padding-left: 32px;}
.h_sub_list:first-child{ margin-top: 0;}
.h_sub_list > li{ position: relative; padding-left: 12px; margin-top: 9px; text-align: left; }
.h_sub_list > li > a{font-size: 0.875em; letter-spacing: 0;}
.h_sub_list > li:before { content: ''; display: inline-block; position: absolute; top: 8px; left: 0; width: 4px; height: 4px; border-radius: 4px; background: #21b2b8;}

@media(max-width:1330px){
	.headerWrap .header .gnbArea .gnb>li:first-child{margin-left: 0;}
	.view_wrap{right: 10px;}
}

@media(max-width:1200px){
	/* header */
	

	/* .headerWrap .header .gnbArea .gnb	{ width:100%; display:block; padding-right: 40px;}
	.headerWrap .header .gnbArea .gnb>li	{ float:left; display: inline-block; width: 12.5%; margin: 0; padding: 0;}
	.headerWrap .header .gnbArea .gnb>li:first-child{margin-left: 0;}
	.headerWrap .header .gnbArea .gnb>li>a	{ display:block; height: 55px; line-height: 55px; font-size:1.125em; color:#1c1c1c; text-decoration:none;  text-align: center; border-bottom: 4px solid #ffffff;} */

	/* footer */	
	.footerWrap .footerArea .ft_sns_list{top: auto; bottom: -10px; transform: translate(0,0); -ms-transform: translate(0,0); -webkit-transform: translate(0,0);}

}


@media(max-width:1024px){

	.view_wrap{right: 30px;}

	/*.gnb_bg*/
	.gnb_bg{display: none;}	

	.m_header{display: block;}

	/* .headerWrap */
	.headerWrap	{ width:100%; position: relative;}
	.headerWrap .logo	{display: none;}
	.headerWrap .headTop	{ display: none; max-width:1199px; margin:0 auto; height:32px; text-align:right; overflow:hidden; border-right:1px solid #eaeaea; }
	.headerWrap .headTop span	{ float:right; }
	.headerWrap .headTop > a	{ float:left; border-left:1px solid #eaeaea; background:#f8f8f8; height:32px; padding:0 22px; font-size:12px; color:#4e4e4e; line-height:32px; }
	.headerWrap .headTop .head_pc	{ display: inherit; }
	.headerWrap .header	{ width:100%; height:80px; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea; }
	.headerWrap .header .gnbArea	{height: 80px; }
	/* .headerWrap .header .gnbArea h1.logo	{ position:static; padding:22px 0 0; } */	
	.headerWrap .header .gnbArea .logo	{display: block; top: 50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
	.headerWrap .header .gnbArea .gnb	{ display:none; }
	
	/* 
	.headerWrap .header .mobGnbBt	{ display:block; }
	.headerWrap .header .homeBt	{ display:block; } */

	.headerWrap.scrolled .mobGnb{top: 80px;}

	/* footer */
	.footerWrap .footerMenu{padding-left: 0;}
	/* .footerWrap .footerArea .footer{padding-left: 0;}	
	.footerWrap .footerArea .footer .footLogo{display: none;} */
	
}
@media (max-width:860px){

	.view_wrap{right: 10px;}
	
	.headerWrap	{ width:100%; }
	/*	.headerWrap .headTop	{ display:none; }*/
	.headerWrap .headTop .head_pc	{ display: none; }
	.headerWrap .headTop a.log_out{width: 50%;border-right: 1px solid #eaeaea;}
	.headerWrap .headTop a.log_out:last-child{border-right: 0;}
	.headerWrap .headTop span	{ float: left;width: 100%; }
	.headerWrap .headTop > a	{ float: inherit; width: 33.333%;border-left:1px solid #eaeaea;  height:32px; padding: 0; line-height:32px; text-align: center; }
	.headerWrap .headTop a:last-child{border-right: 0;}
	.headerWrap .header	{height:60px;}
	.headerWrap .header .gnbArea	{height: 60px;}	
	.headerWrap .header .gnbArea .gnb	{ display:none; }	
	
	.headerWrap.scrolled .mobGnb{top: 60px;}

	/* hamburger */
	/* .view_wrap .hamburger{height: 45px;} */


	/* m_menu */
	.mobGnb{top:60px;}
	.mobFade{top:92px;}
	
	/* footerWrap */
	.footerWrap .footerMenu	{ display: none; }

	/* mft_list */
	.footerWrap .mft_list {position:relative; display: block; margin-right: 48px;}
	.footerWrap .mft_list .foot_site_btn {display:inline-block; vertical-align: middle; position:relative; padding-left: 20px;	width:100%; height: 45px;line-height: 43px; color: #bdbdbd;	 text-align: left; background: #303039;}
	.footerWrap .mft_list .foot_site_btn span{color:#91c4d5; font-size: 0.875rem;}
	.footerWrap .mft_list .foot_site_btn .arr{position: absolute; top: 0;	right: 0;	display: inline-block; width: 44px;height: 44px;border-left: 1px solid #585858;	}
	.footerWrap .mft_list .foot_site_btn .arr img {position:absolute; transform:rotate(180deg); left:15px; top:50%; margin-top:-3px; font-size:12px; transition:all 0.3s;}
	.footerWrap .mft_list .foot_site_btn.on .arr img { margin-top:-4px; transform:rotate(0deg);}
	.footerWrap .mft_list .foot_site_menu {display:none; position:absolute; left:0; bottom:43px; z-index:1; overflow:auto; width:100%; background-color:#303039; }
	.footerWrap .mft_list .foot_site_menu li{border-bottom: 1px solid #585858;}	
	.footerWrap .mft_list .foot_site_menu li a {display:block; height: 45px; line-height: 45px; padding-left:20px; color:#b9b9b9; font-size:0.875em;}
	.footerWrap .mft_list .foot_site_menu li.info a {color:#235788;}
	.footerWrap .mft_list .slt_btn{color: #a0a0a0; border: 1px solid #585858; width: 60px; height: 45px; display: inline-block; vertical-align: middle; line-height: 43px;}
	
	.footerWrap .footerArea{padding:15px 0; }
	.footerWrap .footerArea .footer{padding:0; }
	.footerWrap .footerArea .footer > div{margin-top: 10px;}
	.footerWrap .footerArea .footer .footLogo{ display:block; text-align:center; position:static; margin: 0 auto; width: 155px;}
	
	.footerWrap .footerArea .footer .address{ text-align: center;}
	/* .footerWrap .footerArea .ft_sns_list{position: relative; display: inline-block; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0);	} */
	.footerWrap .footerArea .ft_sns_list{position: static; margin: 10px auto 0; /*max-width: 201px;*/ max-width: 161px; /* sns 4개 일때 161 */}

	/* contop_btn */	
	.footerWrap .contop_btn > span{width: 48px; height: 45px;}

}

@media(max-width:480px){

	.headerWrap .header{height:45px;}
	.headerWrap .header .gnbArea{height: 45px;}	
	.headerWrap .logo > a img{width: 116px;}
	.headerWrap.scrolled .mobGnb{top: 45px;}

	/* m_menu */
	.mobGnb{top:45px;}
	.mobFade{top:77px;}
	.mobGnb .m_gnb>li>a{font-size: 0.938em; height: 42px; line-height: 42px;}
	.mobGnb .m_gnb>li>.m_gnbS{padding: 15px 20px;}
	.mobGnb .m_gnb>li>.m_gnbS>li>a{font-size: 0.938em;}
	.mobGnb .m_gnb>li>.m_gnbS>li ul li a{font-size: 0.875em;}
	
}