﻿@charset "utf-8";
/* CSS Document */

body, html { height: 100%; background-color: #FFF; }
#wrap { position: relative; min-width: 980px; min-height: 100%; overflow: hidden; }


/* 상단(로고 및 메뉴) */
.area_header { position:relative; top:0; left:0; z-index:20; width:100%; height:130px; background:#fff;}
.area_header header { position:relative; width:980px; margin:0 auto;}
.area_header header h1 { position:absolute; left:40%; top:18px; }

.area_header .top_menu { position:absolute; left:0; top:30px; z-index:1}
.top_menu li { float:left;}
.top_menu li a { display:inline-block; font-size:12px; line-height:14px; padding:4px 0; color:#000; vertical-align:middle; font-family:'NotoR'; *float:left; *margin:0 8px;}
.top_menu a:hover { text-decoration:underline}
.top_menu li:before {display:inline-block; overflow:hidden; width:2px; height:2px; margin:0 8px 0 0; background:#000; content:''; vertical-align:middle}
.top_menu li:after {display:inline-block; overflow:hidden; margin:0 8px 0 0; content:'';}
.top_menu li:first-child:before { width:0; margin:0 8px 0 0}

/* 검색 - 웹버전 */
.box_search_0 { position: absolute; right: 0; top: 15px; width: 187px; height: 28px; overflow: hidden; background:#fff;}
.box_search_0 input { position: absolute; top: 0; left: 0; width: 160px; height: 28px; font-size: 12px; line-height: 28px; color: #777; font-family: '돋움', Dotum; padding: 0 4px 0 12px; border: none; }
.box_search_0 button { position: absolute; top: 5px; right: 7px; width: 16px; height: 17px; border: none; background: url("/images/sch/web/sc-h/common/btn_search_w.png") no-repeat; text-indent: -10000px; }
.box_search_0 input::-webkit-input-placeholder { color:#777; font-family:'Dotum'; }


/* ie8 미디어쿼리 핵 */
@media \0screen {
	
	.box_search_0 input { line-height: 28px; }

}


/* 웹네비게이션 */
#webNavi { display: block; position:relative; top:77px; /* 메뉴위치 탑 */ border-top:1px solid #84cfcd;}
#gnb { position: relative; }
#gnb li { position: relative; float: left; }
#gnb li a { display: inline-block; font-family: 'NotoM'; letter-spacing: -1px; color: #000; font-size: 17px; padding: 10px 31px 10px; line-height: 30px; vertical-align: middle }
#gnb li a:hover, #gnb li a:focus, #gnb li.on a { color: #ffdc17; background: url(/images/sch/web/sc-h/common/gnb_arrow.png) no-repeat center 45px }
#gnb li:first-child { margin: 0 0 0 0 }

/* 세로메뉴 */
#gnb li ul.box { position: absolute; top: 52px; left: 50%; margin-left: -82px; background-color: #fff; width: 140px; padding: 12px 12px; border: 1px solid #cdcdcd; border-top: 0 }
#gnb li ul.box li { padding: 0; margin: 0; float: none }
#gnb li ul.box li a { display: block; letter-spacing: 0; font-family: 'Dotum'; font-size: 12px; color: #666; padding: 3px; margin: 0; background: none }
#gnb li ul.box li a:hover, #gnb li ul.box li a:focus { color: #0e73c3; text-decoration: underline }


/* mobile layout */
#tablet { display: none; width: 100% }
#tabletHeader { width: 100%; margin: 0 auto; position: fixed; top: 0; left: 0; z-index: 20; background-color:#099f9a; height: 70px; }
#tabletLogo { text-align: center; padding: 14px 0 0 }
#tabletGnb #menuOpen { position: fixed; left: 10px; top: 13px; z-index: 101 }
#tabletGnb #menuOpen img { width: 44px; height: auto }


/* mobile 검색영역 */
#tabletSearch #searchOpen { position: fixed; right: 10px; top: 13px; z-index: 21 }
#tabletSearch #searchOpen img { width: 44px; height: auto }
#mSearch { position: absolute; top: -90px; left: 0; width: 100%; height: 90px; z-index: 19; background-color: #53b17a }
#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 { width: 100%; height: 39px; border-color: transparent; background: #fff; border-radius: 3px; 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: #ffdc17; font-size: 16px; color: #0c2b1a; 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/sch/web/sc-h/common/btn_search_close.png') no-repeat 50% 0 }


/* mobile navi */
#mNavi { position: absolute; left: -250px; top: 0; width: 250px; height: 100%; z-index: 9999; background-color: #efefef }
#mNavi #mtitle { width: 100%; height: 50px; background: #efefef;}
#mNavi #mtitle a { z-index: 10000; font-size: 0; line-height: 0; text-indent: -9999em; display: inline-block; width: 26px; height: 23px; position: absolute; left: 18px; top: 14px; background: url(/images/sch/web/sc-h/common/btn_close.png) no-repeat; background-size: 100% auto; }
#mNavi #mgnb .snb { width: 100%; padding: 5px 0; }
#mNavi #mgnb .snb, #mNavi #mgnb .snb ul li { background-color: #efefef }
#mNavi #mgnb .snb li { float: left; width: 30%; border-bottom: 0; }
#mNavi #mgnb .snb li a { display: inline-block; font-family: "NotoR"; height: 26px; line-height: 26px; text-align: left; font-size: 12px; color: #535c6c; vertical-align: middle }
#mNavi #mgnb ul { width: 100%; overflow: hidden }
#mNavi #mgnb ul li { border-bottom: 1px solid #70c192; background-color: #53b17a; position: relative }
#mNavi #mgnb ul li a { display: block; padding: 0 0 0 20px; height: 42px; line-height: 42px; 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: #ffdc17 }
#mNavi #mgnb ul li ul { display: none; background-color: #235a3a; padding: 10px 0; }
#mNavi #mgnb ul li ul li { border-bottom: 0; background-color:#235a3a }
#mNavi #mgnb ul li ul li a { display: block; padding: 0 0 0 20px; height: 28px; line-height: 28px; 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: #ffdc17 }
#mNavi #mgnb ul li ul li ul { display: none; background-color: #202631; padding: 4px 0; }
#mNavi #mgnb ul li ul li ul li { border-bottom: 0; background-color: #202631 }
#mNavi #mgnb ul li ul li ul li a { display: block; padding: 0 0 0 30px; height: 22px; line-height: 22px; font-size: 12px; font-family: "NotoR"; color: #ccc }
#mNavi #mgnb ul li ul li ul li a:hover, #mNavi #mgnb ul li ul li ul li a:focus, #mNavi #mgnb ul li ul li ul li a:active { color: #ffdc17 }
#mNavi #mgnb ul li ul li.row > a:before, #mNavi #mgnb ul li ul li.row > a:after { display: block; position: absolute; background-color: #a7a8aa; content: ''; }
#mNavi #mgnb ul li ul li.row > a:before { width: 9px; height: 1px; right: 18px; top: 14px; }
#mNavi #mgnb ul li ul li.row > a:after { width: 1px; height: 9px; right: 22px; top: 10px; }
#mNavi #mgnb ul li ul li.on > a:after { display: none }


/* footer */
.area_footer { position: relative; z-index: 20; padding: 20px 0 50px; background: #f7f7f7; border-top:1px solid #ddd; }
.box_footer { position: relative; width: 980px; margin: 0 auto; }
.footer_link { font-family: '돋움', Dotum; font-size: 12px; margin: 0 0 12px; }
.footer_link button { display: none; }
.footer_link li { float: left; font-size: 13px; line-height: 13px; background: url("/images/sch/web/sc-h/common/bar.gif") no-repeat left 4px; }
.footer_link li:first-child { background: none; }
.footer_link li a { display: block; padding: 4px 12px 0 13px; letter-spacing: -1px; color: #777; }
.footer_link li:first-child a { padding-left: 0; }
.footer_link li.point a { color: #2f9f42; font-weight:bold;}
.box_footer .box_info { font-size: 12px; font-family: '돋움', Dotum; color: #777; }
.box_footer .box_info address { line-height: 18px; font-style: normal; }
.box_footer .box_info span { margin-left: 10px; }
p.copyright { font-family: '돋움', Dotum; font-size: 12px; color: #777; padding: 3px 0 0; }
.footBtn { position: absolute; top: 7px; right: 0; width: 200px; overflow: visible; }
.footBtn button { width: 200px; height: 32px; border: 1px solid #ccd1da; border-radius: 3px; overflow: hidden; background: #f5f7f8 url(/images/sch/web/sc-h/common/arrow.png) no-repeat 100% 50%; color: #404040; font-family: 'Nanum'; text-align: left; padding-left: 10px; font-size: 12px; }
.footBtn ul { display: none; position: absolute; left: -1px; bottom: 33px; z-index: 100; width: 200px; background: #fff; border: 1px solid #ccd1da; border-radius: 3px; overflow: hidden; }
.footBtn ul li { border-bottom: 1px dashed #dedede; }
.footBtn ul li:last-child { border: 0; }
.footBtn ul li.subLine { border-bottom: 3px double #dedede; }
.footBtn ul li a { display: block; padding: 7px 5px 7px 10px; color: #404040; background: #fdfdfd; font-size: 0.9em; overflow: hidden; }
.footBtn ul li a:hover, .footBtn ul li a:focus, .footBtn ul li a:active { color: #fff; background: #404040; }

/********** media query mobile *************/
@media screen and (max-width: 800px) {
	
	
	#wrap { min-width: 320px; overflow: visible; height: 100% }
	.area_header { display: none }
	#wrap,  .area_footer,  .box_footer { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box }
	#web { display: none; }
	#tablet, .tabletlogo { display: block; }
	.box_mot_1 { background: #fff; overflow: hidden; width: 100% }
	.box_mot_1.on { position: fixed; top: 0 }
	.box_mot_1.on2 { position: relative; top: 92px }

	/* footer */
	.box_footer{ width:96%; margin:0px auto;}
	.area_footer{padding:10px 0px 20px 0px;}
	.box_footer{ width:96%; margin:0px auto;}
	.box_footer .box_info{width:100%;}
	.footer_link {margin:10px 0; border-bottom:none; width:100%;}
	.footer_link li { width:33%; line-height:30px; border:1px solid #ddd; background:none}
	.footer_link li a {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;}
	


}


 @media (max-width:560px) {


	/* mobile 검색영역 */
	#mSearch .con p { padding: 21px 150px 0 0; }
	#mSearch .con .btnSearch { right: 50px; min-width: 70px; font-size: 14px; }
	/* footer */
	.area_footer {padding:13px 3% 30px;}		
	.box_footer .box_info span {display:block; margin-left:0;}
	.footer_link li { width:49%;}
	.footer_link li:nth-child(3), .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(4){ border-left:0}
	.footer_link li:nth-child(3), .footer_link li:nth-child(5) {border-left:1px solid #ddd;}



}


 @media screen and (max-width: 480px) {


	#tabletLogo { text-align: center; padding: 16px 0 0; width: 150px; margin: 0 auto; }
	#tabletLogo img { width: 100%; height: auto; }
	
	/* 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}


}

