@charset "utf-8";

#wrap{ position:relative; min-width:1300px; min-height:100%; overflow:hidden; background:#fafafa;}

/* #web {position:relative; width:214px; min-height:100%; float:left; z-index:999;} */
#web {position:relative; width:214px; min-height:100%; float:left; z-index:99;}

/* webnavi */
#webNavi{position:relative; width:214px; height:100%; z-index:10; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#webNavi h1{ width:214px; height:90px; line-height:90px; background-color:#fff; border-right:1px solid #f3f3f3; border-bottom:1px solid #f3f3f3; text-align:center; }
#webNavi h1 img{position:absolute; left:50%; top:26px;  margin-left:-70px; }
#webNavi .snb{ line-height:22px; background-color:#2b2b2b; overflow:hidden }
#webNavi .snb li{float:left; width:50%;  font-family:'돋움', 'dotum'; font-size:12px;}
#webNavi .snb li a{color:#afafaf; display:block; padding:7px 0; letter-spacing:-1px; border-left:1px solid #3d3d3d; text-align:center;}
#webNavi .snb li:first-child a{background:none}
#webNavi .snb li a:hover{ text-decoration:none}

/* 왼쪽메뉴 */
#slidemenu{position:relative; margin-top:20px;}
#slidemenu ul#leftmenu{position:relative}
#slidemenu ul#leftmenu > li > a{display:block; font-size:16px; font-family:"NotoM"; color:#fff; padding:10px 20px 10px 20px; word-break:keep-all; }
#slidemenu ul#leftmenu > li > a:hover,
#slidemenu ul#leftmenu > li > a:focus,
#slidemenu ul#leftmenu > li > a.hover{color:#ffe36b; border-right:4px solid #ffe36b}

#slidemenu ul#leftmenu > li .hiddenBox {position:absolute; left:214px; top:0; width:200px; overflow:hidden; z-index:2}
#slidemenu ul#leftmenu > li .hiddenBg {width:110px; margin-left:-200px;}
#slidemenu ul#leftmenu > li ul{display:none;}
#slidemenu ul#leftmenu > li ul li a{display:block; font-size:13px; color:#d4e0d6; padding:6px 0 6px 12px; font-family:"NotoR"}
#slidemenu ul#leftmenu > li ul li a:hover{color:#ffe36b;}

#slidemenu ul#leftmenu > li ul#leftSubm1{margin-top:0px;}
#slidemenu ul#leftmenu > li ul#leftSubm2{margin-top:40px;}
#slidemenu ul#leftmenu > li ul#leftSubm3{margin-top:85px;}
#slidemenu ul#leftmenu > li ul#leftSubm4{margin-top:125px;}
#slidemenu ul#leftmenu > li ul#leftSubm5{margin-top:170px;}
#slidemenu ul#leftmenu > li ul#leftSubm6{margin-top:215px;}
#slidemenu ul#leftmenu > li ul#leftSubm7{margin-top:255px;}
#slidemenu ul#leftmenu > li ul#leftSubm8{margin-top:300px;}
#slidemenu ul#leftmenu > li ul#leftSubm9{margin-top:345px;}

#slidemenu ul#leftmenu > li ul#leftSubm10{margin-top:390px;}
#slidemenu ul#leftmenu > li ul#leftSubm11{margin-top:435px;}
#slidemenu ul#leftmenu > li ul#leftSubm12{margin-top:480px;}
#slidemenu ul#leftmenu > li ul#leftSubm13{margin-top:525px;}

/* #leftbg{position:absolute; left:0; top:0; width:200px; height:100%; background:url('/images/web/template/1092/common/bg_left_mn.gif') left top repeat; z-index:99;} */
#leftbg{position:absolute; left:0; top:0; width:200px; height:100%; background:url('/images/web/template/1092/common/bg_left_mn.gif') left top repeat; z-index:97;}
/* .web_mnBg {position:absolute; left:0; top:0; width:214px; height:100%; background:#3d3d3d; z-index:998;} */
.web_mnBg {position:absolute; left:0; top:0; width:214px; height:100%; background:#3d3d3d; z-index:98;}


/* 검색 - 웹버전 */
.box_search_0 {position:relative; width:200px; height:30px; margin-bottom:20px; overflow:hidden;}
.box_search_0 input { position:absolute; top:0; left:12px; width:144px; height:28px; line-height:30px; padding:0 10px 0 15px; border:1px solid #2b2b2b; border-radius:15px; font-size:12px; color:#666; font-family:'돋움',Dotum; background:#313131;}
.box_search_0 button { position:absolute; top:5px; right:29px; width:19px; height:19px; border:none; background:url("/images/web/template/1092/common/btn_search_w.png") no-repeat; text-indent:-10000px;}
.box_search_0 input::-webkit-input-placeholder {color:#fff; font-family:'Dotum';}


/* mobile layout */
#tablet{display:none; width:100%;}
#tabletHeader {position:relative; width:100%; height:66px; margin:0 auto; border-bottom:1px solid #ccc; background-color:#fff; }
#tabletLogo a { position:absolute; left:50%; top:15px; display:block; width:144px; height:37px; font-size:0; line-height:0; text-indent:-9999em; margin-left:-91px; no-repeat;}

#tabletSnb a { position:absolute; top:20px; right:10px; display:inline-block; font-size:12px; font-family:"NotoR"; color:#666; padding:4px 8px; border:1px solid #ddd; border-radius:3px; background-color:#fbfbfb;}
#tabletGnb #menuOpen{position:fixed; z-index:101}
#tabletGnb #menuOpen img{ width:67px; height:66px}

/* mobile 검색영역 */
#tabletSearch #searchOpen{position:fixed; right:0; z-index:101}
#tabletSearch #searchOpen img{width:67px; height:66px;}

#mSearch{ position:absolute; top:-90px; left:0; width:100%; height:90px; z-index:22; background-color:#647485}
#mSearch .con p {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; position:relative; width:90%; margin:0 auto; padding:21px 200px 0 0}
#mSearch .con .inputText {border-color:transparent; width:100%; background:#fff; border-radius:3px; height:39px; line-height:39px; padding:0 10px 0}
#mSearch .con .btnSearch { position:absolute; top:21px; right:90px; min-width:80px; font-size:15px}
#mSearch  .btnSearch, #mSearch  a.btnSearch { font-family:"NotoR"; display:inline-block; padding:14px 15px 13px; background-color:#205e9f; font-size:16px; color:#fff; border:none; border-radius:3px}
#mSearch .btnSearchClose { font-size:0; line-height:0; text-indent:-9999em; position:absolute; top:25px; right:5%; width:25px; height:33px; background:url('/images/web/template/1092/common/btn_search_close.png') no-repeat 50% 0}


/* mobile navi */
#mNavi{position:absolute; left:-228px; top:0; width:228px; height:100%; z-index:9999; background-color:#354052}
#mNavi #mtitle{width:100%; height:50px; background:#354052; border-bottom:1px solid #434d5e;}
#mNavi #mtitle a { position:absolute; left:18px; top:14px; display:inline-block; width:26px; height:23px; font-size:0; line-height:0; text-indent:-9999em; background:url('/images/web/template/1092/common/btn_close.gif') no-repeat; background-size:100% auto;}
#mNavi #mgnb ul{width:100%; overflow:hidden}
#mNavi #mgnb ul li{border-bottom:1px solid #535c6c; background-color:#30394a; position:relative}
#mNavi #mgnb ul li.snb{ height:42px; line-height:42px}
#mNavi #mgnb ul li.snb a{ display:inline-block; color:#a7a8aa; font-size:12px; font-family:'돋움', 'dotum'}

#mNavi #mgnb ul li a{display:block; height:42px; line-height:42px; padding:0 0 0 29px;  font-size:16px; font-family:"NotoM"; color:#fff}
#mNavi #mgnb ul li a:hover, #mNavi #mgnb ul li a:focus, #mNavi #mgnb ul li a:active{color:#2eaced}
#mNavi #mgnb ul li.row > a:before,
#mNavi #mgnb ul li.row > a:after {display:block; position:absolute; background-color:#a7a8aa; content:'';}
#mNavi #mgnb ul li.row > a:before { right:18px; top:21px; width:9px; height:1px; }
#mNavi #mgnb ul li.row > a:after { right:22px; top:17px; width:1px; height:9px;}
#mNavi #mgnb ul li.on > a:after { display:none}

#mNavi #mgnb ul li ul{display:none; background-color:#202631; padding:10px 0;}
#mNavi #mgnb ul li ul li{border-bottom:0; background-color:#202631}
#mNavi #mgnb ul li ul li a{display:block;height:25px; line-height:25px; padding:0 0 0 20px;  font-size:14px; font-family:"NotoR"; color:#fff}
#mNavi #mgnb ul li ul li a:hover, #mNavi #mgnb ul li ul li a:focus, #mNavi #mgnb ul li ul li a:active{color:#2eaced}

/* 웹버전카피라이트 */

/* 관련링크 바로가기 */
.family_area{ position:absolute; bottom:170px; left:18px; width:142px; }
.family_area .select_family .select_tit{ position:relative; height:26px; line-height:26px; border:1px solid #80c398; background-color:#008630; font-family:"NotoR"; font-size:12px; color:#bfe1cb;  cursor:pointer; z-index:101}
.family_area .select_family .select_tit .tit{ margin-left:6px;}
.family_area .select_family .select_tit .arr{ position:absolute; right:11px; top:11px; width:7px; height:4px; background:url('/images/web/template/1092/common/arr.gif') no-repeat; }
.family_area .select_family .select_list { position:absolute; bottom:0; left:0; width:100%; height:0; padding-bottom:22px; overflow:hidden; border-bottom:none; z-index:100;  }
.family_area .select_family .select_list ul { border:1px solid #80c398; background:#008630; }
.family_area .select_family .select_list li { display:block; width:100%; }
.family_area .select_family .select_list li a { display:block; height:28px; font-size:12px; color:#bfe1cb; padding-left:15px; line-height:28px;}

/* 검색 카피, 메뉴 */
.ft_box {position:relative; width:100%; margin-top:50px;}
/* 카피메뉴 */
#guidebox{ position:relative; width:195px; padding:10px 0 10px 19px; font-family:"NotoR"; background:#2b2b2b;}
#guidebox li { font-size:12px; line-height:12px; background:url("/images/web/template/1092/common/f_bul.png") no-repeat left 5px; margin-bottom:5px; }
#guidebox li a {display:block; padding:4px 12px 0 13px; letter-spacing:-1px; color:#afafaf; }
#guidebox li.point a { color:#1cb8ff;  font-family:"NotoM";}

#fnb{ position:relative; width:100%; padding-top:20px; font-size:12px; font-family:"NotoR"; color:#afafaf; letter-spacing:-1px;}
#fnb address{ display:inline-block;  font-style:normal; margin:0 26px 15px 20px;  }
p.copyright {position:relative; margin: 0 26px 15px 20px; font-family:"NotoR"; font-size:12px; color:#cdd1d4; }

/* 태블릿 모바일 버전 푸터 */
#m_copyWrap{ display:none}

/* 구글번역 */
.googletranslate  {position:absolute; bottom:38px; left:18px; z-index:9999; display:block;}

/* 방문자수 */
.visitant {position:relative; height: 49px; font-family:'NotoM'; background: #2b2b2b; }
.visitant h2 {text-indent:-10000em; font-size:0; }
.visitant ul {overflow:hidden; }
.visitant ul li {width:49%; float:left; line-height: 48px; text-align:center; color: #2e95fe; font-size:13px; background: url('/images/web/template/1092/common/bar_visitant.gif') no-repeat left center; }
.visitant li:first-child{ background:none; }
.visitant ul li strong {margin-right:10px; }
.visitant ul li.today strong {padding:5px 0; color:#fff; }
.visitant ul li.total strong {padding:5px 0; color:#fff; }

.btn_top{ position:fixed; right:0; bottom:35px; z-index:100} 

/******* 서브레이아웃 ********/		
#sub_container {position:relative; padding-left:214px}

/* 비주얼 */
.S_visual {width:100%; height:158px; background: #bfe0ec;  margin:0 auto;}

#sub_content{ position:relative; width:940px; padding:10px 0 60px; margin-left:50px;}
#sub_content:after {content:""; display:block; clear:both;}

/* 서브페이지 */
#subContent{ position:relative; margin:0 0 100px;}
.subContent_body{ position:relative}

/* 로케이션 */
#location { position:relative; display:block; overflow:hidden; font-size:12px; vertical-align:middle; padding-top:20px;}
#location img {vertical-align:middle; margin-top:-1px}
#location span,
#location strong { display:inline-block; padding-left:13px; margin-left:7px; background:url('/images/web/template/1092/sub/bgLocation.gif') no-repeat 0 3px; }
#location span { color:#666; }
#location strong { color:#333; }

.box_line_map{ display:none;}
.box_line_map_1 .sp_home,
.box_line_map_1 .span_gt {display:block; overflow:hidden; height:0; font-size:0; line-height:100px; text-indent:-10000px;}

/* 페이지 타이틀 */
#pageTitle { font-size:30px; letter-spacing:-1px; color:#111; font-family:"NotoM"; padding-top:9px;}
#pageTxt { margin:8px 0 30px 0; color:#666; font-size:13px; line-height:150%; font-family:"NotoR";}


/* etc : sns*/ 
.snsBox { position:absolute; top:17px; right:0; text-align:right;}
.snsBox button { display:inline-block; width:26px; height:26px; overflow:hidden; margin-left:3px; background:url("/images/web/template/1092/sub/btnSns.gif") no-repeat 0 0;}
.snsBox button > span {text-indent:-1000px; font-size:0; line-height:0;}
.snsBox .btnPrint { background-position:0 0; }
.snsBox .btnFbook { background-position:-29px 0; }
.snsBox .btnTwt { background-position:-58px 0; }
.snsBox .btnBlog { background-position:-87px 0; }
.snsBox .btnYtb { background-position:-116px 0; }
.snsBox .btnInstar{ background-position:-145px 0; }
.snsBox .btnShare{ background-position:-174px 0; }
.snsBox  .sns_more{display:none; position:absolute; top:30px; right:0; width:165px; *width:145px; border:1px solid #bbb; border-radius:2px; padding:10px 10px 10px 7px; z-index:30; background-color:#fff;}


/********** media query tablet *************/

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

	/* 구글번역 */
	.googletranslate  {position:relative; width:230px; bottom:55px; margin:10px 0 0 0;}
	.goog-te-gadget { line-height:30px;}
	.goog-te-gadget .goog-te-combo { float:left; margin:4px 10px 4px 0 !important;}
	
	#wrap, #m_copyWrap, .area_footer, .box_footer, .footer_link li {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}	
	#wrap{min-width:auto}

	#wrap{min-width:320px; height:100%; overflow:visible; }
	#web {display:none;}
	#leftbg{display:none;}
	.web_mnBg {display:none;}
	#tablet, .tabletlogo {display:block;}
	
	#tabletHeader { position:fixed; top:0; z-index:100}
	.box_mot_1{width:100%; background:#fff; overflow:hidden; }
	.box_mot_1.on{position:fixed; top:0}
	
	/* 태블릿 모바일 버전 푸터 */
	#m_copyWrap{ position:relative; display:block; background-color:#3d3d3d; padding:0 0 10px}
	#m_copyWrap footer{ position:relative; width:96%; margin:0 auto}
	#m_copyWrap .copymenu{ margin-bottom:14px; padding-top:26px}
	#m_copyWrap .copymenu li a{ font-family:'NotoM'; color:#535353; font-size:12.5px}
	#m_copyWrap .copyTxt{font-family:'NotoR'; color:#898989; font-size:13px; line-height:20px;}
	#m_copyWrap .copyTxt address{ margin-bottom:2px; font-style:normal}
	#m_copyWrap .copyTxt address span{ margin-left:10px}

	/* 방문자수 */
	.visitant {position:relative; height: 49px; margin-top:20px; font-family:'NotoM'; background: #2b2b2b; }
	.visitant h2 {text-indent:-10000em; font-size:0; }
	.visitant ul {overflow:hidden; }
	.visitant ul li {width:49%; float:left; line-height: 48px; text-align:center; color: #2e95fe; font-size:13px; background: url('/images/web/template/1092/common/bar_visitant.gif') no-repeat left center; }
	.visitant li:first-child{ background:none; }
	.visitant ul li strong {margin-right:10px; }
	.visitant ul li.today strong {padding:5px 0; color:#fff; }
	.visitant ul li.total strong {padding:5px 0; color:#fff; }
	
	/* 관련링크 바로가기 */
	.family_area2{ position:absolute; width:142px; top:18px; right:0}
	.family_area2 .select_family2 .select_tit2{position:relative;  height:26px; line-height:26px; border:1px solid #d4d4d4; background-color:#fff; font-family:"NotoR"; font-size:12px; color:#666;  cursor:pointer; z-index:101}
	.family_area2 .select_family2 .select_tit2 .tit{ margin-left:6px;}
	.family_area2 .select_family2 .select_tit2 .arr{ position:absolute; right:11px; top:11px; width:7px; height:4px; background:url('/images/web/template/1092/common/copy_arr.gif') no-repeat; }
	.family_area2 .select_family2 .select_list2 { position: absolute; bottom:0; left:0; width:100%; height:0; padding-bottom:22px; overflow:hidden; border-bottom:none; z-index:100;  }
	.family_area2 .select_family2 .select_list2 ul { border: 1px solid #d4d4d4; background: #fff; }
	.family_area2 .select_family2 .select_list2 li { display: block; width: 100%; }
	.family_area2 .select_family2 .select_list2 li a { display: block; height:28px;  line-height:28px; font-size:12px; color:#666; padding-left:15px;}
	
	/* footer */
	.area_footer {position:relative; z-index:20; padding:0 0 30px; }
	.box_footer {position:relative; width:95%; margin:0 auto;}
	.footer_link {font-family:'NotoR'; font-size:14px; border-bottom:none; padding:20px 0 10px; overflow:hidden;}
	.footer_link li {float:left;  width:33.33%; line-height:30px; border:1px solid #ddd; background:none}
	.footer_link li a {display:block; padding:0 25px 0 0; letter-spacing:-1px; color:#d9d9d9; text-align:center}
	.footer_link li:nth-child(4), .footer_link li:nth-child(5) {  border-top:0}
	.footer_link li:nth-child(2), .footer_link li:nth-child(3), .footer_link li:nth-child(5) { border-left:0}
	.box_footer .box_info span{display:block; margin-left:0;}
	.footer_link li.point a { color:#27c3f3; }
	.box_footer .box_info{ font-size:12px; font-family:'돋움',Dotum; color:#eee;}
	.box_footer .box_info address{line-height:18px; color:#d9d9d9; font-style:normal; }
	.box_footer .box_info span{ margin-left:10px;}
	p.copyright {font-family:'돋움',Dotum; font-size:12px; color:#d9d9d9; margin:0; padding:3px 0 0;}

		/* 태블릿 모바일 버전 푸터 */
	#m_copyWrap .copyTxt address span{ display:block; margin-left:0}

	/******* 서브레이아웃 ********/		
	#sub_container,
	#sub_visual_area, #sub_visual_area .visual_cnt,
	#sub_content,
	.cntBody{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
	#sub_visual_area, #sub_visual_area .visual_cnt{ width:90%}
	.S_visual {height:auto;}
	.S_visual img {width:100%; height:auto;}
		
	#sub_container {padding:68px 0 0; }
	#sub_content{ width:100%; padding:30px 16px 100px}
		
	.cntBody{ padding:0; min-height:auto}
	
	#sub_content{width:100%;  min-height:600px; padding:0; margin:0;}	
	#subContent{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; width:100%; margin:0 0 50px 0;}
	.subContent_body{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; padding:0 3% 0}
	
	#location { display:none;}

	/* 페이지 타이틀 */
	#pageTitle { font-size:27px; padding-top:16px;}

	/* etc : sns*/ 
	.snsBox { position:absolute; top:21px; right:2%;}



}

@media screen and (max-width: 580px){
		
	/* mobile 검색영역 */
	#mSearch .con p {padding:21px 150px 0 0}
	#mSearch .con .btnSearch {right:50px; min-width:70px; font-size:14px}
	
	
	/* footer */
	.footer_link li { width:50%}
	.footer_link li:nth-child(3), .footer_link li:nth-child(5){ border-left:1px solid #ddd !important;}
	.footer_link li:nth-child(3){  border-top:0}
	.footer_link li:nth-child(4) { border-left:0 !important}

}


/********** media query mobile *************/

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

	/* mobile layout */
	#tabletLogo a { top:12px; width:160px; height:41px; margin-left:-80px}

	
	/* footer */
	.footer_link li { width:100%}
	.footer_link li:nth-child(2), .footer_link li:nth-child(4), .footer_link li:nth-child(5){ border-left:1px solid #ddd !important;}
	.footer_link li:nth-child(2){  border-top:0 !important}

}

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

	/* mobile layout */
	#tabletLogo a { margin-left:-70px}


}