/* written by jdm */

html {position: relative;min-width:320px;min-height: 100%;}
body {position:relative;min-width:320px;overflow-x:hidden;max-width:1900px;margin:0 auto !important;font-weight:400;}
body {padding-top:45px;}

header {position:fixed;top:0;right:0;width:100%;height:45px;padding:0;overflow:hidden;background:#fff;z-index:998;border-bottom:1px solid #d5d5d5;}
header > .container {position:relative;}
header h1 {position:absolute;top:0;left:15px;margin:0;}
header h1 a {display:block;}
body.xs header {}
body.xs header h1 a img {width:125px !important;height:auto !important}

.container_fluid {min-height:800px}
body.sub .container_fluid {padding-bottom:50px;}
body.sub .container {position:relative;}

footer {background:#3c3c3c;text-align:center;color:#fff;padding:45px 0}
footer h2 {margin:0;margin-bottom:10px;}
footer .fmenu {text-align:center;}
footer .fmenu li {position:relative;display:inline-block;margin-right:10px;}
footer .fmenu li a {display:block;font-size:14px;font-weight:400;color:#fff;}
footer .fmenu li:last-child {margin-right:0;}
footer .fmenu li:last-child:after {width:0;}
footer .fmenu li:after {position:absolute;top:3px;right:-7px;width:1px;height:11px;background:#fff;content:"";}
footer .f_logo {position:relative;}
footer address {font-size:12px;font-weight:400;margin-bottom:10px;}
footer address a {color:#fff !important;font-size:12px;font-weight:400;}
footer .copy {font-size:12px;font-weight:400;}

body.xs footer {padding:10px 0 30px}
body.xs footer .fmenu li a {font-size:12px;}
body.xs footer address {font-size:11px;margin-bottom:5px;}
body.xs footer address a {font-size:11px;color:#fff;}
body.xs footer .copy {font-size:11px;}

body.xs footer h2 img {width:150px;}
body.sm footer h2 img {width:180px;}
body.md footer h2 img {width:220px;}

body.lg .calendar .ui-datepicker th {padding:1.1em 0}
body.lg .calendar .ui-datepicker td {padding:5px 7px}
body.xl .calendar .ui-datepicker th {padding:1.1em 0}
body.xl .calendar .ui-datepicker td {padding:5px 10px}

.layerBg {display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:998;background:#000;opacity: 0.7;filter: alpha(opacity=70);}

.sidebar {display: none;width:180px;}

.contents {}
.contents h3.sub-header {font-size:30px;margin-top:20px;margin-bottom:35px;}
.contents .breadcrumb {margin-top:20px;padding:0 !important;background:none !important;-webkit-border-radius:0;border-radius:0}
.contents .breadcrumb li, .contents .breadcrumb li a {color:#8e8e8e;letter-spacing:-1px;}
body.xs .contents .breadcrumb li, .contents .breadcrumb li a {font-size:12px;}
.contents .breadcrumb li:first-child {background:url("../images/contents/ico_home.png") no-repeat 0 5px;padding-left:20px;}
body.xs .contents .breadcrumb li:first-child {background-position:0 3px;}
.contents .breadcrumb>li+li:before {content:"\00003E"}

body.xs .contents h3.sub-header {font-size:22px;margin-bottom:18px;}
body.sm .contents h3.sub-header {font-size:26px;margin-bottom:20px;}
body.sm .contents .breadcrumb {margin-top:10px;}

.contents .btn-group {margin-top:20px;margin-bottom:18px;}
.contents .btn-group:after {content:""; display:block; clear:both;}
.contents .btn-group button {font-size:22px;background:none;padding:0}
.contents .btn-group.open .dropdown-toggle {box-shadow:none}
body.sm .contents .btn-group {margin-bottom:20px;}
body.sm .contents .btn-group button {font-size:26px;}

/* datepicker */
.ui-datepicker .ui-datepicker-prev span {background:url("../images/common/btn_date_arrow_left.png") no-repeat 0 0;}
.ui-datepicker .ui-datepicker-next span {background:url("../images/common/btn_date_arrow_right.png") no-repeat 0 0;}

.ui-widget.ui-widget-content {width:100%;padding:0;border:0;border-bottom:1px solid #d5d5d5;-webkit-border-radius:0;border-radius:0}
.ui-widget-header {background:none;border:0;border-bottom:2px solid #000;-webkit-border-radius:0;border-radius:0}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {top:15px}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {text-align:center;border:0 !important;-webkit-border-radius:50%;border-radius:50%;padding:4px 0}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {text-align:center;}
.ui-datepicker .ui-datepicker-title {font-family:'Noto Sans KR';font-weight:normal;font-size:22px;line-height:2.1em;}
.ui-datepicker th {padding:1.2em .3em}
.ui-datepicker td {padding:6px 12px}

@media (min-width: 768px) {

	body.main {padding-top:111px;}
	body.sub {padding-top:131px;}

	header {height:auto}
	header:before {position:absolute;top:40px;left:0;width:100%;height:1px;background:#dddddd;content:"";}
	header:after {position:absolute;top:110px;left:0;width:100%;height:4px;background:#dddddd;content:"";}

	header h1 a img {width:200px;}

	.topMenu {}
	.topMenu:after {content:""; display:block; clear:both;}
	.topMenu nav {float:right;}
	.topMenu nav ul {}
	.topMenu nav ul li {float:left;}
	.topMenu nav ul li a {display:block;color:#8d8d8d;padding:12px 15px 11px;font-size:12px;}
	.topMenu nav ul li .input_select {margin:8px 0 0 15px;padding:0 15px;font-size:12px;color:#8d8d8d;}
	
	.topMenu nav ul.sns li a {display:block;color:#8d8d8d;padding:9px 9px 9px;font-size:12px;}

	.headerInner {position:relative;height:70px;}


	header #mainMenu {position:absolute;top:0;display:block;width:100%;height:100%;}
	header #mainMenu > ul {width:100%;}
	header #mainMenu > ul > li {position:relative;display:inline-block;float: left;width:20%;text-align:center;}

	
/*	header #mainMenu > ul > li:last-child {padding-right:0;}*/
	header #mainMenu > ul > li > a {display:inline-block;font-size:16px;font-weight:500;padding:24px 0}
	header #mainMenu > ul > li > a:hover {text-decoration:none !important}
	header #mainMenu > ul > li:after {content: '';position:absolute;width:0;height:4px;background:#d2272f;bottom:-4px;left:0%;transition-delay: all 0.3s;transition: all 0.3s;z-index:999}
	header #mainMenu > ul > li:hover:after {width:100%;}
	header #mainMenu > ul > li.on > a, 
	header #mainMenu > ul > li.current > a {color:#000;}
	header #mainMenu > ul > li.on > a span, 
	header #mainMenu > ul > li.current > a span {padding-bottom:22px; border-bottom: solid 4px #d8252b;}
	/*header #mainMenu > ul > li ul {display:none; position:absolute; left:0px; top:74px;width:100%;height:auto;}*/
	header #mainMenu > ul > li ul {display:none; position:absolute; left:0px; top:74px;width:100%;height:50px;}
	header #mainMenu > ul > li ul:after {content: '';position:absolute;width:1px;height:100%;background:#d5d5d5;top:0;right:0;}
	header #mainMenu > ul > li:last-child ul:after {width:0;height:0;}
	header #mainMenu > ul > li ul li {margin:0 10px;text-align:center;line-height:1;border-bottom:1px solid #d5d5d5;}
	header #mainMenu > ul > li ul li:first-child {margin-top:0px;}
	header #mainMenu > ul > li ul li a {position:relative;display:block;font-weight:normal;font-size:14px; line-height:17px; color:#787778; outline:none; vertical-align:top;padding:10px 0;}
	header #mainMenu > ul > li ul li a:after {content: '';position:absolute;display:inline-block;width:0;height:1px;background:#d2272f;bottom:0;left:0%;transition-delay: all 0.3s;transition: all 0.3s;}
	header #mainMenu > ul > li ul li a:hover:after {width:100%;}
	header #mainMenu > ul > li ul li a:hover {text-decoration:none !important}
	header #mainMenu > ul > li ul li a:hover,
	header #mainMenu > ul > li ul li a:focus {color:#333;}


	header #mainMenu {position:absolute;top:0;right:0;width:800px;}
	header #mainMenu ul li {float:left;}
	header #mainMenu ul li.on ul{visibility:visible;}
	header #mainMenu ul li ul {display:block;position:absolute;left:0px;margin:0;width:1000px;visibility:hidden;padding-top:0}
	header #mainMenu > ul > li {width:18%;}
	header #mainMenu > ul > li:first-child {width:27%;}
	header #mainMenu > ul > li > a {display:block;}
	header #mainMenu > ul > li ul:after {width:0;height:0;}
	header #mainMenu ul li ul.smenu_1{left:-50px;}
	header #mainMenu ul li ul.smenu_2{left:-90px;}
	header #mainMenu ul li ul.smenu_3{left:-180px;}
	header #mainMenu ul li ul.smenu_4{left:-150px;}
	header #mainMenu ul li ul.smenu_5{left:-500px;}
	header #mainMenu ul li ul li {margin:0px;font-size:16px;}
	header #mainMenu > ul > li ul li {border-bottom:0;}
	header #mainMenu ul li ul li a {padding:20px 18px 20px 18px;display:block;}
	header #mainMenu ul li ul li a:hover {color:#000;}
	header #mainMenu > ul > li ul li a:after {width:0;height:0;}
	header #mainMenu li div {display:none; }
	header #mainMenu li.on div {display:block; }
	
	/* sitemap */
	#layer02 > .layerPopInner {position:absolute;top:0;display:block;width:100%;height:100%;max-width:inherit}
	#layer02 > .layerPopInner > ul {width:100%;}
	#layer02 > .layerPopInner > ul > li {position:relative;display:inline-block;float: left;width:20%;text-align:center;}
	#layer02 > .layerPopInner > ul > li > a {display:inline-block;font-size:16px;font-weight:500;padding:24px 0}
	#layer02 > .layerPopInner > ul > li > a:hover {text-decoration:none !important}
	#layer02 > .layerPopInner > ul > li:after {content: '';position:absolute;width:0;height:4px;background:#d2272f;bottom:-4px;left:0%;transition-delay: all 0.3s;transition: all 0.3s;z-index:999}
	#layer02 > .layerPopInner > ul > li:hover:after {width:100%;}
	#layer02 > .layerPopInner > ul > li.on > a, 
	#layer02 > .layerPopInner > ul > li.current > a {color:#000;}
	#layer02 > .layerPopInner > ul > li.on > a span, 
	#layer02 > .layerPopInner > ul > li.current > a span {padding-bottom:22px; border-bottom: solid 4px #d8252b;}
	#layer02 > .layerPopInner > ul > li ul {position:absolute; left:0px; top:74px;width:100%;height:auto;}
	#layer02 > .layerPopInner > ul > li ul:after {content: '';position:absolute;width:1px;height:100%;background:#d5d5d5;top:0;right:0;}
	#layer02 > .layerPopInner > ul > li:last-child ul:after {width:0;height:0;}
	#layer02 > .layerPopInner > ul > li ul li {margin:0 10px;text-align:center;line-height:1;border-bottom:1px solid #d5d5d5;}
	#layer02 > .layerPopInner > ul > li ul li:first-child {margin-top:0px;}
	#layer02 > .layerPopInner > ul > li ul li a {position:relative;display:block;font-weight:normal;font-size:14px; line-height:17px; color:#787778; outline:none; vertical-align:top;padding:10px 0;}
	#layer02 > .layerPopInner > ul > li ul li a:after {content: '';position:absolute;display:inline-block;width:0;height:1px;background:#d2272f;bottom:0;left:0%;transition-delay: all 0.3s;transition: all 0.3s;}
	#layer02 > .layerPopInner > ul > li ul li a:hover:after {width:100%;}
	#layer02 > .layerPopInner > ul > li ul li a:hover {text-decoration:none !important}
	#layer02 > .layerPopInner > ul > li ul li a:hover,
	#layer02 > .layerPopInner > ul > li ul li a:focus {color:#333;}
	#layer02 > .layerPopInner h2 {text-align:center;}

}

@media (min-width: 992px) {

	header #mainMenu > ul > li ul li {text-align:left;}
	footer {position:relative;}
	footer h2 {position:absolute;top:40px;left:30px}
	footer .fmenu {margin-top:5px;}
	footer .fmenu li {margin-right:25px;}
	footer .fmenu li:after {right:-15px;top:4px}
	footer address {margin-bottom:5px;}

	.ui-datepicker td {padding:14px 18px}

	.sidebar {position:absolute;top:0;bottom: 0;left: 0;display: block;padding:0;}
	.sideTit {font-size:22px;text-align:center;border-bottom:3px solid #333333;padding-bottom:15px;letter-spacing:-1px;margin-bottom:0;}
	.nav-sidebar {}	
	.nav-sidebar > li {position:relative;border-bottom:1px solid #e4e4e4;}
	.nav-sidebar > li > a {position:relative;display:block;padding:15px 20px;font-size:16px;color:#636363;letter-spacing:-1px;}
	.nav-sidebar > .active > a,
	.nav-sidebar > .active > a:hover,
	.nav-sidebar > .active > a:focus {color:#d1272f;}
/*	.nav-sidebar > .active:before {position:absolute;top:25px;right:20px;width:16px;height:1px;background:#d1272f;content:"";}*/
/*	.nav-sidebar > li > a:after {content: '';position:absolute;width:0;height:1px;background:#d2272f;bottom:0px;left:0%;transition-delay: all 0.3s;transition: all 0.3s;z-index:999}*/
/*	.nav-sidebar > li > a:hover:after {width:100%;}*/

	.nav-sidebar ul {margin-top:-8px;padding-left:23px}
	.nav-sidebar ul li {position:relative;padding-left:7px;}
	.nav-sidebar ul li:before {position:absolute;top:11px;left:0;width:4px;height:1px;background:#636363;content:"";}
	.nav-sidebar ul li a {display:block;padding:3px 0;font-size:13px;letter-spacing:-.3px;}
	.nav-sidebar ul li:last-child {margin-bottom:10px;}

	.contents {margin-left:230px;}
	.contents .breadcrumb {position:absolute;top:5px;right:15px}
}

@media (min-width: 1200px) {
	body.sub .container_fluid {padding-bottom:80px;}
	.container {width:1200px;}
}

@media (min-width: 1430px) {

	body.sub {padding-top:160px;}

	.container {width:1430px !important;}

	header h1 {margin:51px 0 0 0;z-index:2}
	header h1 a img {width:266px;}
	/*header #mainMenu {width:756px;right:0}*/
/*	header #mainMenu {width:800px;right:0}*/
/*	header #mainMenu > ul > li {width:19%;}*/
/*	header #mainMenu > ul > li:first-child {width:24%;}*/

	footer .container {position:relative;}
	footer h2 {top:0px}
	footer .fmenu {margin-top:9px;margin-left:260px;text-align:left;}
	footer .f_logo {position:absolute;top:0; right:0;}
	footer address {margin-left:260px;text-align:left;}
	footer .copy {margin-left:260px;text-align:left;}

	header #mainMenu {position:absolute;top:0;right:0;width:800px;}
	header #mainMenu ul li {float:left;}
	header #mainMenu ul li.on ul{visibility:visible;}
	header #mainMenu ul li ul {display:block;position:absolute;left:0px;margin:0;width:1000px;visibility:hidden;padding-top:0}
	header #mainMenu > ul > li {width:18%;}
	header #mainMenu > ul > li:first-child {width:27%;}
	header #mainMenu > ul > li > a {display:block;}
	header #mainMenu > ul > li ul:after {width:0;height:0;}
	header #mainMenu ul li ul.smenu_1{left:-50px;}
	header #mainMenu ul li ul.smenu_2{left:-90px;}
	header #mainMenu ul li ul.smenu_3{left:-180px;}
	header #mainMenu ul li ul.smenu_4{left:-150px;}
	header #mainMenu ul li ul.smenu_5{left:-500px;}
	header #mainMenu ul li ul li {margin:0px;font-size:16px;}
	header #mainMenu > ul > li ul li {border-bottom:0;}
	header #mainMenu ul li ul li a {padding:20px 18px 20px 18px;display:block;}
	header #mainMenu ul li ul li a:hover {color:#000;}
	header #mainMenu > ul > li ul li a:after {width:0;height:0;}
	header #mainMenu li div {display:none; }
	header #mainMenu li.on div {display:block; }
}


@media (max-width: 767px){

	.primary-nav-wrapper{position:absolute;z-index:999;top:50px;right:0;visibility:hidden;width:100%;height:auto;opacity:0;background-color:#fff;-webkit-transition:all 300ms;transition:all 300ms;-webkit-overflow-scrolling: touch;}
	.primary-nav-wrapper.open{visibility:visible;opacity:1}
	.primary-nav-wrapper nav.leftNav {width:100%;height:100%;padding:0}
	.primary-nav-wrapper nav.leftNav h2 {position:absolute;top:3px;left:20px;font-size:18px;font-weight:500;}
	.primary-nav-wrapper > nav.leftNav > ul{display:block !important}
	.primary-nav-wrapper > nav.leftNav > ul > li{position:relative;display:block;padding:10px 20px 0;letter-spacing:1px;margin-bottom:20px;}
	.primary-nav-wrapper > nav.leftNav > ul > li:after {position:absolute;bottom:0;left:20px;width:90%;height:1px;background:#d5d5d5;content:"";}
	.primary-nav-wrapper > nav.leftNav > ul > li:last-child{border-bottom:none}
	.primary-nav-wrapper > nav.leftNav > ul > li > a{display:block;font-size:14px;font-weight:600;position:relative;text-decoration:none;color:#000;text-align:left;padding-bottom:10px;border-bottom:2px solid #d5d5d5;}
	.primary-nav-wrapper > nav.leftNav > ul > li > a:hover{color:#000}
	.primary-nav-wrapper > nav.leftNav > ul > li a.active {font-size:16px;font-weight:500;color:#000;}
/*	.primary-nav-wrapper > nav > ul > li > a:before{position:absolute;bottom:0;left:0;visibility:hidden;width:100%;height:2px;content:'';-webkit-transition:all .3s ease-in-out 0s;transition:all .3s ease-in-out 0s;-webkit-transform:scaleX(0);transform:scaleX(0);background-color:#7AE2DE}*/
	.primary-nav-wrapper > nav.leftNav > ul > li > a:hover:before{visibility:visible;-webkit-transform:scaleX(1);transform:scaleX(1)}

	.primary-nav-wrapper > nav.leftNav > ul > li > ul {}
	.primary-nav-wrapper nav.leftNav ul li ul {height:auto !important;display:block !important;padding-left:20px;}
	.primary-nav-wrapper nav.leftNav ul li ul li {border-bottom:1px solid #d5d5d5;}
	.primary-nav-wrapper nav.leftNav ul li ul li:last-child {border-bottom:0;}
	.primary-nav-wrapper nav.leftNav ul li ul li a {display:block;font-size:13px;color:#000;padding-bottom:10px;}
	.primary-nav-wrapper nav.leftNav ul li ul li a:first-child {padding-top:10px;}
	.primary-nav-wrapper nav.leftNav ul li ul li a:hover {text-decoration:none}

	.primary-nav-wrapper nav.topNav {padding:0 15px}
	.primary-nav-wrapper nav.topNav ul li {display:inline-block;margin-right:10px;}
	.primary-nav-wrapper nav.topNav ul li a {display:block;font-size:12px;color:#8d8d8d;}
	.primary-nav-wrapper nav.topNav ul li .input_select {margin-left::5px;padding:0 5px;font-size:12px;color:#8d8d8d;}
	.primary-nav-wrapper nav.topNav ul li.sitemap {display:none;}

	.navicon {visibility:visible;position:absolute;top:0;right:5px;width:25px;height:25px;padding:25px;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out;/*background-color:#71d5d2*/}

	.nav-toggle {position:absolute;z-index:1000;top:50%;left:50%;padding:5px 25px 13px 0;cursor:pointer;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}
	.nav-toggle:focus{outline:none}
	.nav-toggle span,.nav-toggle span:before,.nav-toggle span:after{position:absolute;display:block;width:25px;height:3px;content:'';cursor:pointer;border-radius:1px;background:#d1282f}
	.nav-toggle span:before{top:-8px}
	.nav-toggle span:after{bottom:-8px}
	.nav-toggle span,.nav-toggle span:before,.nav-toggle span:after{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}
	.nav-toggle.active span{background-color:transparent}
	.nav-toggle.active span:before,.nav-toggle.active span:after{top:0}
	.nav-toggle.active span:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}
	.nav-toggle.active span:after{top:10px;-webkit-transform:translatey(-10px) rotate(-45deg);transform:translatey(-10px) rotate(-45deg)}
	

}