@charset "euc-kr";

@import url("../../lib/css/base.css");

@font-face{
	font-family:"NanumSquare";
	src:url('../../font/NanumSquare.eot');
	src:url('../../font/NanumSquare.eot?#iefix') format('embedded-opentype'),
		url('../../font/NanumSquare.woff') format('woff'),
		url('../../font/NanumSquare.ttf') format('truetype'),
		url('../../font/NanumSquare.ttf') format('truetype'),
		url('../../font/NanumSquare.svg#NanumSquare') format('svg');
	src:local(¡Ø), url('../../font/NanumSquare.woff') format('woff');
}

@font-face{
	font-family:"NanumSquareB";
	src:url('../../font/NanumSquareB.eot');
	src:url('../../font/NanumSquareB.eot?#iefix') format('embedded-opentype'),
		url('../../font/NanumSquareB.woff') format('woff'),
		url('../../font/NanumSquareB.ttf') format('truetype'),
		url('../../font/NanumSquareB.ttf') format('truetype'),
		url('../../font/NanumSquareB.svg#NanumSquareB') format('svg');
	src:local(¡Ø), url('../../font/NanumSquareB.woff') format('woff');
}

@font-face{
	font-family:"NanumBarunGothic";
	src:url('../../font/NanumBarunGothic.eot');
	src:url('../../font/NanumBarunGothic.eot?#iefix') format('embedded-opentype'),
		url('../../font/NanumBarunGothic.woff') format('woff'),
		url('../../font/NanumBarunGothic.ttf') format('truetype'),
		url('../../font/NanumBarunGothic.ttf') format('truetype'),
		url('../../font/NanumBarunGothic.svg#NanumBarunGothic') format('svg');
	src:local(¡Ø), url('../../font/NanumBarunGothic.woff') format('woff');
}
@font-face{
	font-family:"NanumBarunGothicB";
	src:url('../../font/NanumBarunGothicBold.eot');
	src:url('../../font/NanumBarunGothicBold.eot?#iefix') format('embedded-opentype'),
		url('../../font/NanumBarunGothicBold.woff') format('woff'),
		url('../../font/NanumBarunGothicBold.ttf') format('truetype'),
		url('../../font/NanumBarunGothicBold.ttf') format('truetype'),
		url('../../font/NanumBarunGothicBold.svg#NanumBarunGothicBold') format('svg');
	src:local(¡Ø), url('../../font/NanumBarunGothicBold.woff') format('woff');
}

#skipNavi{position:absolute; margin:0 auto; width:998px; list-style:none; font-size:1.15em; top:-10.5em; left:0; z-index:2000; background:#eee; border:1px solid #ccc;}
#skipNavi a:active, #skipNavi a:focus{ position: absolute; padding-top: 0.5em; width: 998px; height: 2em; top: 10.5em; text-align: center; color: #000; font-weight:bold; background: #eee; border: 1px solid #ccc; outline: 0;}

.hide{position:absolute; overflow:hidden; width:0; height:0; font-size:0;}
h2,h3,h4{font-family:"NanumSquareB";}

/* header */
#header{/* border-bottom:1px solid #e6e6e6; */}
.h_wrap{height:135px;}
.h_wrap:after{display:block; content:""; clear:both;}
.h_wrap .h_logo{position:relative; margin:0 auto; width:1100px;}
.h_wrap h1{position:absolute; top:73px; left:0; z-index:1510;}
.h_wrap h1 img{}
.h_navi{height:45px; background:#3993bf;}
.h_navi .utill{margin:0 auto; width:1100px;}
.h_navi .utill::after{display:block; content:""; clear:both;}
.familysite {float:left; position:relative; z-index:1600;}
.familysite:after{display:block; content:""; clear:both;}
.familysite ul{float:left;}
.familysite .submit{display:none;}
.familysite .btn_family{overflow:hidden; float:left; position:relative; padding:14px 30px 13px 20px; width:162px; color:#eee; font-size:15px; background:rgba(0, 0, 0, 0.15); border-left:1px solid rgba(255, 255, 255, 0.30); box-sizing:border-box; text-overflow:ellipsis; white-space:nowrap;}
.familysite .btn_family::after{content:""; position:absolute; top:20px; right:20px; width:7px; height:5px; background:url(../../images/main/open_arr.png) no-repeat 0 0;}
.familysite .btn_family.open::after{transform:rotate(180deg);}
.familyList{display:none; position:absolute; left:1px; top:45px; width:161px; border-top:1px solid rgba(255, 255, 255, 0.30); background:#3993bf; box-sizing:border-box;}
.familyList li{border-bottom:1px solid rgba(255, 255, 255, 0.30);}
.familyList li:last-child{border-bottom:none}
.familyList li a{display:block; float:none; padding:8px 10px; border:none; color:#fff; font-size:11px;}
.found_sns {float:left; position:relative; z-index:1600;}
.found_sns:after{display:block; content:""; clear:both;}
.found_sns ul{float:left;}
.found_sns .submit{display:none;}
.found_sns .btn_sns{overflow:hidden; float:left; position:relative; padding:14px 30px 13px 20px; width:162px; color:#eee; font-size:15px; background:rgba(0, 0, 0, 0.15); border-left:1px solid rgba(255, 255, 255, 0.30); box-sizing:border-box; text-overflow:ellipsis; white-space:nowrap;}
.found_sns .btn_sns::after{content:""; position:absolute; top:20px; right:20px; width:7px; height:5px; background:url(../../images/main/open_arr.png) no-repeat 0 0;}
.found_sns .btn_sns.open::after{transform:rotate(180deg);}
.snsList{display:none; position:absolute; left:0px; top:45px; width:161px; border-top:1px solid rgba(255, 255, 255, 0.30); border-left:1px solid rgba(255, 255, 255, 0.30); background:#3993bf; box-sizing:border-box;}
.snsList li{border-bottom:1px solid rgba(255, 255, 255, 0.30);}
.snsList li:last-child{border-bottom:none}
.snsList li a{display:block; float:none; padding:8px 10px; border:none; color:#fff; font-size:11px;}
.found_fac {float:left; position:relative; z-index:1600;}
.found_fac:after{display:block; content:""; clear:both;}
.found_fac ul{float:left;}
.found_fac .submit{display:none;}
.found_fac .btn_fac{overflow:hidden; float:left; position:relative; padding:14px 30px 13px 20px; width:162px; color:#eee; font-size:15px; background:rgba(0, 0, 0, 0.15); border-left:1px solid rgba(255, 255, 255, 0.30); border-right:1px solid rgba(255, 255, 255, 0.30); box-sizing:border-box; text-overflow:ellipsis; white-space:nowrap;}
.found_fac .btn_fac::after{content:""; position:absolute; top:20px; right:20px; width:7px; height:5px; background:url(../../images/main/open_arr.png) no-repeat 0 0;}
.found_fac .btn_fac.open::after{transform:rotate(180deg);}
.facList{display:none; position:absolute; left:0px; top:45px; width:161px; border-top:1px solid rgba(255, 255, 255, 0.30); border-left:1px solid rgba(255, 255, 255, 0.30); background:#3993bf; box-sizing:border-box;}
.facList li{border-bottom:1px solid rgba(255, 255, 255, 0.30);}
.facList li:last-child{border-bottom:none}
.facList li a{display:block; float:none; padding:8px 10px; border:none; color:#fff; font-size:11px;}
.utill_menu{float:right; overflow:hidden; padding-top:14px;}
.utill_menu li{float:left; padding:0 9px;}
.utill_menu li:last-child{padding-right:0;}
.utill_menu li a{color:#eee; font-size:13px;}
.utill_menu li a:hover{text-decoration:underline;}

/* .search{position:relative; z-index:1600; margin:0 auto; width:1100px;}
.sch_form{position:absolute; top:25px; right:0; z-index:510;}
.sch_form:after{display:block; content:""; clear:both;}
.sch_form input{float:left;}
.sch_form input[type="text"]{width:190px; height:40px; padding:12px; font-size:13px; background:#f5f5f5; border:1px solid #ddd; box-sizing:border-box;} */
/* °Ë»ö */
.search_btn{overflow:hidden; position:absolute; top:14px; left:50%; padding:10px 10px 10px 0; margin-left:-550px; width:1100px;}
.search_btn a{display:inline-block; position:relative; float:right; z-index:1505; text-indent:-9999px; width:40px; height:40px; background:url(../../images/common/sch_open.gif) no-repeat 0 0;}
.search_btn a.close{background:url(../../images/common/sch_close.gif) no-repeat 0 0; transition:transform 0.7s; transform:rotate(270deg);}
.search_btn a.close::after{content:""; transform:rotate(360deg); transition:all;}
.search{display:none; position:absolute; top:135px; padding:45px 0; width:100%; z-index:1499; background:#e1e1e1;}
.search .sch_dim_layer{position:absolute; top:152px; left:0; width:100%; height:1242px; background:#000; opacity:0.5; z-index:-1;}
.search .sch_form{position:relative; margin:0 auto; width:1100px;}
.search .sch_form input[type="text"]{padding:0 25px; margin:0 50px; width:1000px; height:63px; font-size:20px; font-family:"NanumSquare"; letter-spacing:-0.045em; border:1px solid #aaa; box-sizing:border-box;}
.search .sch_form input[type="image"]{position:absolute; top:17px; right:70px;}

.side_menu{display:none;}
.search_m {display:none;}
.m_search_box{display:none;}

/* lnb */
/* .lnb {overflow:hidden; position:absolute; top:45px; left:0; width:100%; height:90px; z-index:500;}
.lnb_bg {display:none; position:absolute; top:91px; left:0; width:100%; height:202px; background-color:#fff; border-bottom:2px solid #000;}
.lnb > ul {position:relative; width:1100px; height:275px; margin:0 auto; z-index:500;}
.lnb > ul > li {float:left; min-width:105px; max-width:160px; height:275px; margin:0; padding:0 16px;}
.lnb > ul > li:first-child{margin-left:250px;}

.lnb > ul > li.l_title1{margin-left:300px;}
.lnb > ul > li.l_title4{background:url(../../images/gnb/gnb_menu4_1.gif) 47px top no-repeat;}

.lnb > ul > li > a{font-size:18px; font-family:"NanumSquareB";}
.lnb > ul > li > a span{margin-right:5px; color:#898b1c; font-size:16px;}
.lnb > ul > li > a, .lnb_all a {display:block; padding:35px 0; text-align:center;}
.lnb > ul > li.active > a, .lnb_all a.active, .lnb_all a.active2 {background:url(../..../../images/gnb/lnb_on.gif) repeat-x 0px 43px;}
.lnb > ul > li > ul {display:none; width:160px; height:182px; padding:20px 0 0 0; border-right:1px solid #ddd;}
.lnb > ul > li > ul.active {background:#efefef;}
.lnb > ul:first-child li:first-child ul {border-left:1px solid #7ca9c4;}
.lnb > ul > li > ul > li a {display:block; height:16px; margin:0; padding:0 0 8px 10px; color:#424242; text-align:left; font-size:12px;}
.lnb > ul > li > ul > li a:hover{font-family:"NanumBarunGothicB";} */

.lnb {overflow:hidden; position:absolute; top:45px; left:0; width:100%; height:90px; z-index:1500; border-bottom:1px solid #e1e1e1;}
.lnb_bg {display:none; position:absolute; top:90px; left:0; width:100%; height:181px; background:linear-gradient(to right, #f5f5f5, #f5f5f5 50%, #fff 50%, #fff 100%); border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1;}
.lnb > ul {position:relative; width:1100px; height:273px; margin:0 auto; z-index:500;}
.lnb > ul > li {float:left; margin:0; padding:0; height:273px;}
.lnb > ul > li:first-child{margin-left:350px;}
.lnb > ul > li > a{display:block; position:relative; padding:20px 0px; margin:14px 18px; text-align:center; color:#333; font-size:20px; font-family:"NanumSquareB"; letter-spacing:-0.045em;}
.lnb > ul > li > a + p{display:none; position:absolute; bottom:77px; left:135px; transform:translateX(-50%); z-index:1000; color:#3d6b99; font-size:30px; font-family:"NanumSquareB"; letter-spacing:-0.045em;}
.lnb > ul > li > a::after{content:""; position:absolute; left:0; bottom:10px; width:0; height:3px; background:#3993bf; transition:width 0.3s ease-in-out;}
.lnb > ul > li:hover > a{color:#3993bf;}
.lnb > ul > li:hover > a::after{width:100%;}
.lnb > ul > li > a span{margin-right:5px; color:#898b1c; font-size:16px;}
.lnb > ul > li > ul{display:none; overflow:hidden; position:absolute; left:0px; padding:29px 0 30px 296px; width:804px; height:122px; background:url(../../images/common/gnb_bg.png) no-repeat 0 0;}
.lnb > ul > li > ul > li{float:left; width:201px; box-sizing:border-box;}
.lnb > ul > li > ul > li a{display:block; position:relative; text-align:left; padding:11px 0px 11px 20px; margin:0; color:#333; font-size:16px; line-height:19px;}
.lnb > ul > li > ul > li a::before{content:""; position:absolute; top:18px; left:0; width:12px; height:4px; background:#d9d9d9;}
.lnb > ul > li > ul > li a:hover{color:#3993bf; font-family:"NanumBarunGothicB";}
.lnb > ul > li > ul > li a:hover::before{background:#3993bf;}

/* footer */
#footer{background:#fafafa;}
.fm_wrap{background:#ddd;}
.f_menu{width:1100px; height:45px; margin:0 auto;}
.f_menu:after{display:block; content:""; clear:both;}
.f_menu > ul{float:left; padding-top:15px;}
.f_menu > ul{overflow:hidden;}
.f_menu > ul li{float:left; padding-left:20px;}
.f_menu > ul li:first-child{padding:0; background:none;}
.f_menu > ul li a{color:#666;}
.f_menu > ul li a b{color:#1f9970; font-weight:normal;}
.f_menu > a.anchor{display:inline-block; float:right}
.f_wrap{overflow:hidden; width:1100px; margin:0 auto; padding-bottom:25px;}
.f_logo{float:left; margin-top:30px;}
.f_logo img{}
.f_txt{float:left; margin:30px 0 0 50px; width:800px;}
.f_txt p{margin-bottom:6px; color:#888;}

/* ¸ð¹ÙÀϸ޴º */
.dmm{position:fixed; top:0; left:0; right:0; z-index:6000; height:10000px; background-color:rgba(0, 0, 0, 0.7);}
#naviMenu{position:fixed; top:0; right:-1000px; z-index:7000; width:100%; max-width:290px; min-height:800px; background:#fff;}
#naviMenu > div{overflow:auto; position:absolute; top:0; left:0; width:100%;}
#naviMenu ul.menuCtg{}
#naviMenu ul.menuCtg li.top_menu{display:table; table-layout:fixed; overflow:hidden; width:100%; background:#fafafa; border-top:6px solid #3993bf;}
#naviMenu ul.menuCtg li.top_menu p{display:table-cell;}
#naviMenu ul.menuCtg li.top_menu p a{display:inline-block; text-align:center; padding:50px 0 20px 0; width:100%; color:#494949; font-size:14px; font-family:"NanumBarunGothic";}
#naviMenu li.top_menu .gnbHome a{background:url(../../images/common/gnbhome.png) no-repeat center 18px;}
#naviMenu li.top_menu .login a{border-left:1px solid #c4cbd6; box-sizing:border-box; background:url(../../images/common/login.png) no-repeat center 19px;}
#naviMenu li.top_menu .logout a{border-left:1px solid #c4cbd6; box-sizing:border-box; background:url(../../images/common/logout.png) no-repeat center 19px;}
#naviMenu li.top_menu .join a{border-left:1px solid #c4cbd6; box-sizing:border-box; background:url(../../images/common/join.png) no-repeat center 19px;}
#naviMenu li.top_menu .mypage a{border-left:1px solid #c4cbd6; box-sizing:border-box; background:url(../../images/common/mypage.png) no-repeat center 19px;}
#naviMenu li.top_menu .sitemap a{border-left:1px solid #c4cbd6; box-sizing:border-box; background:url(../../images/common/sitemap.png) no-repeat center 19px;}
#naviMenu li.on > ul{border-top:1px solid #c4cbd6;}
#naviMenu li.on > ul > li{border-bottom:1px solid #d9d9d9;}
#naviMenu li.on > ul > li .t_a_line{overflow:hidden;}
#naviMenu li.on > ul > li .t_a_line .mnTit{float:left; padding:20px 6% 20px 6%; width:72%; height:20px; color:#3993bf; font-size:16px; font-family:"NanumBarunGothicB";}
#naviMenu li.on > ul > li .t_a_line span.arrow{position:relative; cursor:pointer; float:left; padding:20px 0; width:16%; height:20px;}
#naviMenu li.on > ul > li .t_a_line span.arrow::before{content:""; position:absolute; top:27px; right:16px; border-top:none; border-bottom:7px solid #3993bf; border-left:7px solid transparent; border-right:7px solid transparent;}
#naviMenu li.on > ul > li .t_a_line span.arrow::after{content:""; position:absolute; top:30px; right:19px; border-top:none; border-bottom:4px solid #fff; border-left:4px solid transparent; border-right:4px solid transparent;}
#naviMenu li.on > ul > li.on .t_a_line{background-color:#3993bf;}
#naviMenu li.on > ul > li.on .t_a_line .mnTit{color:#fff;}
#naviMenu li.on > ul > li.on .t_a_line span.arrow{}
#naviMenu li.on > ul > li.on .t_a_line span.arrow::before{content:""; position:absolute; top:27px; right:16px; border-top:7px solid #fff; border-bottom:none; border-left:7px solid transparent; border-right:7px solid transparent;}
#naviMenu li.on > ul > li.on .t_a_line span.arrow::after{content:""; position:absolute; top:27px; right:19px; border-top:4px solid #3993bf; border-bottom:none; border-left:4px solid transparent; border-right:4px solid transparent;}
#naviMenu li.on > ul > li > ul.side_sub{display:none; padding:10px 0; background:#f4f4f4; border-top:none}
#naviMenu li.on > ul > li > ul.side_sub > li{border-bottom:none;}
#naviMenu li.on > ul > li.on > .side_sub{display:block;}
#naviMenu .side_sub > li > a{display:block; position:relative; padding:10px 0 10px 30px; color:#494949; font-size:15px;}
#naviMenu .side_sub > li > a:hover{text-decoration:underline;}
#naviMenu .side_sub > li > a.active{text-decoration:underline;}
#naviMenu .side_sub > li > a::before{content:""; position:absolute; top:17px; left:17px; width:6px; height:2px; background:#aaa;}
#naviMenu .side_sub > li > ul > li:last-child{margin-bottom:10px;}
#naviMenu .side_sub > li > ul > li a {display:inline-block; padding:4px 0 4px 40px; font-size:13px;}
#naviMenu .side_sub > li > ul > li a.active {color:#197FC7; font-weight:bold;}
#naviMenu .closeArea{position:absolute; top:30px; left:-50px;}
#naviMenu .closeArea .close{display:block; position:relative; width:30px; height:29px; background:url('../../images/common/bg_btn.png') no-repeat 0 0; z-index:6001;}
#naviMenu .select_box_1 {text-align:center; margin:15px 0; font-size:15px;}
#naviMenu .select_box_1 select{width:180px; height:28px; border:1px solid #d7d7d7;}
#naviMenu .select_box_1 span a{display:inline-block; padding:6px 8px; color:#fff; font-size:14px; background:#2996cc;}


@media only screen and (max-width:1100px) {

	.popup_wrap{display:none;}
	
	#header{background:none; border-top:5px solid #3993bf; border-bottom:1px solid #e6e6e6;}
	.m_header_on{height:145px;}
	.h_wrap{position:relative; margin:0 auto; width:750px; height:90px;}
	.h_wrap .h_logo{width:auto;}
	.h_wrap h1{position:static; text-align:center; padding-top:25px; z-index:0;}
	.h_navi{height:auto; background:#fff !important;}
	.h_navi .utill{display:none;}
	.sch_form{top:0;}
	.search{display:none;}
	.utill_menu{display:none;}
	.search_m{display:block; position:absolute; top:22px; left:0;}
	.m_header_on .m_search_box{display:block; margin-top:24px;}
	.m_header_on .m_search_box input[type="text"]{float:left; width:100%; height:45px; padding:8px 52px 7px 8px; font-size:14px; font-family:"NanumBarunGothic"; background:#eee; border:none; box-sizing:border-box;}
	.m_header_on .m_search_box input[type="image"]{position:absolute; right:0;}
	.side_menu{display:block; position:absolute; top:22px; right:0;}
	
	.lnb{display:none;}
	
	#footer{}
	.fm_wrap{}
	.f_menu{width:750px;}
	.f_wrap{margin:0 auto; width:750px;}
	.f_txt{width:auto;}
	
}

@media only screen and (max-width:768px) {
	
	.h_wrap{width:auto; padding:0 2%;}
	.h_wrap h1{padding-top:30px;}
	.h_wrap h1 img{height:26px;}
	
	.search_m{left:2%;}
	.m_header_on .m_search_box input[type="image"]{right:2%;}
	.side_menu{right:2%;}
	.fm_wrap{padding:0 2%; width:auto;}
	.f_menu{width:auto;}
	.f_menu > ul li.none{display:none;}
	.f_wrap{padding:0 2% 25px 2%; width:auto;}
	.f_logo{float:none;}
	.f_txt{float:none; margin-left:0;}
	
}


@media only screen and (max-width:320px) {

	.wrap{width:320px;}
}