@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
/* font-family: 'Noto Sans KR', sans-serif; */
/* Thin 250, Light 300, DemiLight 350, Regular 400, Medium 500, Bold 700, Black 900 */
/* 100, 300,400, 500,700,900 */

.blind {
    position: absolute;
    clip: rect(0 0 0 0);
    overflow: hidden;
}
/*
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 300;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 900;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),	
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
}
@font-face{
	font-family: 'jeonBukState';
	src:url(JeonBukState.ttf);
}*/
/* Base Style Start */
html {width: 100%; height: 100%; margin: 0px auto; padding: 0;}
body {position: relative; width: 100%; height: 100%; margin: 0px auto; padding: 0;}
body, div, ul, li, dl, dt, dd, ol, p, h1, h2, h3, h4, h5, h6, table, form {margin: 0; padding: 0; border: 0;}

body {
	position: relative;
	font-family: 'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif; word-break: keep-all; /* word-break: break-all; */ word-wrap: break-word;
	font-size : 16px; font-weight: normal; color: #666;
	background-color : #fff;

	min-width: 320px;
}
/* Base Style End */

/* Text Base Style Start */
dl, dt, dd, ul, ol, li, p {list-style : none; /* for smartEditor text-align : justify; */ vertical-align : middle; letter-spacing : 0px; line-height: 1.8em; }

h1 {font-weight: bold; color: #222; font-size: 34px; line-height: 50px;}
h2 {font-weight: bold; color: #222; font-size: 30px; line-height: 40px;}
h3 {font-weight: bold; color: #222; font-size: 24px; line-height: 30px;}
h4 {font-weight: bold; color: #222; font-size: 20px; line-height: 30px;}
h5 {font-weight: bold; color: #222; font-size: 16px; line-height: 25px;}
h6 {font-weight: bold; color: #222; font-size: 14px; line-height: 20px;}

.bold	{font-weight: bold; font-weight: 500;}
.left	{text-align: justify;}
.center	{text-align: center;}
.center > p {padding:0px !important;}
.right	{text-align: right;}
.caution {color: #2cafcb !important;}
.caution02 {color: #222;}
.caution03 {color: #e7404f !important;}

.pColor01 {color: #1e2b4b;}
.pColor02 {color: #3163b4;}

.pColorRed {color: #e7404f;}
.pColorGreen {color: #91c329;}
.pColorBlue {color: #153d79;}
.pColorGray {color: #cbd0d3;}
/* Text Base Style Start */

.hidden {
  overflow: hidden;
  display: inline-block;
  position: relative;
  z-index: -1;
  border: 0;
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
}

fieldset {border: none; margin: 0; padding: 0;}
img,
input.image {border: 0 none;}
form,
select,
input {font-size: 14px; margin: 0; padding: 0; font-family: 'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif;}
legend {display:none; margin:0; padding:0;}
caption {overflow: hidden; width: 0; height: 0; line-height: 0; text-indent: -9999px;}
textarea {width: 100%; min-height: 120px; box-sizing: border-box; padding: 9px; border: 1px #e0e0e0 solid; line-height: 20px; color: #222; font-size: 14px; margin: 0; padding: 0; font-family: 'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif;}
button {border: 0; cursor: pointer}
label {display: inline-block; padding: 0;}

input[type=text],
input[type=password] {display: inline-block; width: 100%; height: 40px; box-sizing: border-box; padding: 9px; border: 1px #e0e0e0 solid; line-height: 20px; color: #222;}
select {display: inline-block; width: auto; height: 40px; box-sizing: border-box; padding: 9px; border: 1px #e0e0e0 solid; line-height: 20px; color: #222;}

button.postSearch {display: inline-block; width: 60px; height: 40px; margin: 0; padding: 0; border: 0; line-height: 40px; font-size: 12px; font-weight: 400; color: #fff; text-align: center; background-color: #464855;}

table input,
table select {margin: 5px 0;}
table input[type=radio],
table input[type=checkbox] {margin: 10px 0;}
table td label {margin-left: 20px;}
table td label:first-of-type {margin-left: 0;}

input:-webkit-input-placeholder {color: #707070; font-weight: 500; font-size: 13px;}
input:-moz-placeholder {color: #707070; font-weight: 500; font-size: 13px;}
input:-moz-placeholder {color: #707070; font-weight: 500; font-size: 13px;}
input:-ms-input-placeholder {color: #707070; font-weight: 500; font-size: 13px;}

/* a href Style Start */
a {letter-spacing: 0px;	margin: 0; text-align: justify; text-decoration: none; outline: 0; color: #444;}
a:visited {text-decoration: none; border: none;}
a:active {text-decoration: none; border: none;}
a:hover {text-decoration: underline; border: none; color: #000;}
*:focus {outline: 2px dotted #e7404f !important}
/* a href Style End */

/* Space Null Start */
.null05 {width: 100%; height: 5px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null10 {width: 100%; height: 10px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null20 {width: 100%; height: 20px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null30 {width: 100%; height: 30px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null40 {width: 100%; height: 40px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null50 {width: 100%; height: 50px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.null100 {width: 100%; height: 100px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
/* Space Null End */

.dummy {clear: both; width: 100%; height: 0; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.line01 {width: 100%; height: 1px; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0; background-color: #dddddd;}

.clearFix:after {content:""; display: block; clear: both;} /* 부모창에 자식창의 높이를 알려주는 권장방법 */
.clearFix {*zoom: 1;} /* IE5.5 ~ 7 브라우저 대응 핵 */

.dpNone {
	/* display: none; */
	overflow: hidden;
	display: inline-block;
	position: relative;
	z-index: -1;
	border: 0;
	width: 1px;
	height: 1px;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
}  
.worning01 {position: relative; display: inline-block; line-height: 20px; font-size: 14px; padding: 0; font-weight: 500; color: #444; z-index: 0;}
.worning01:before {position: absolute; top: 0; left: 0; display: inline-block; width: 100%; height: 100%; box-sizing: border-box; padding: 0 10px; z-index: -1; content: ""; background-color: #eeffb1;}

.worning01.blue:before {background-color: #c0f7ff;}
.worning01.red:before {background-color: #ffdaf9;}

/* 웹접근성을 위한 본문 바로가기 : Navigation Skip (메뉴 스킵) */
#skipBind {position: relative; top: 0; left: 0; width: 100%; height: 0px; z-index: 9999;}
#skipBind > li > a {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 0; margin: 0; line-height: 40px; font-size: 14px; color: #fff; text-align: center; overflow: hidden; background-color: #222;}
#skipBind > li > a:focus {height: 40px; overflow: visible;}
/* 웹접근성을 위한 본문 바로가기 : Navigation Skip (메뉴 스킵) */

	/* Top Header Start */
	#pageBlack {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: -1; opacity: 0; transition: all 0.5s;}
	#naviBlack {position: fixed; top: 0; right: -100%; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: -1; transition: all 0.5s;}

	/* Top Header Start */
	#header {position: relative; top: 0; left: 0; width: 100%; height: 140px; z-index: 999;}
	#header > .headerFix {
		position: fixed; top: 0px; width: 100%; height: 140px; margin: 0 auto; z-index: 1000; border-bottom: 0px #ddd solid;
		background-color: rgba(255,255,255,1.0);
		box-shadow: 0 1px 0 0 #eee;
		transition: all 0.3s;
	}

	#header .headerFix > .topLineArea {display: block;width: 100%;height: 40px;background-color: #1e2b4b;}
	#header .headerFix > .topLineArea > .topLineBox {position: relative;display: flex;width: 100%;max-width: 1400px;height: 100%;margin: 0 auto;justify-content: space-between;flex-direction: row;}
	#header .headerFix > .topLineArea > .topLineBox > .leftArea {/* position: absolute; *//* top: 0; */left: 0;display: block;width: 320px;height: 100%;}
	#header .headerFix > .topLineArea > .topLineBox > .leftArea > .count {float: left; display: block; width: 200px; height: 100%; line-height: 40px; font-size: 13px; font-weight: 300; color: #fff; text-align: center; background-color: #1e2b4b;}
	#header .headerFix > .topLineArea > .topLineBox > .leftArea > .kakao {float: left; display: block; width: 120px; height: 100%; line-height: 40px; font-size: 13px; font-weight: 300; color: #fff; text-align: center; background-color: #ffde00;}
	#header .headerFix > .topLineArea > .topLineBox > .leftArea > .kakao > a {display: block; width: 120px; height: 100%;}
	#header .headerFix > .topLineArea > .topLineBox > .leftArea > .kakao > a > img {display: block; width: 100%; height: auto; vertical-align: top;}
	
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea {position: absolute; top: 0; right: 0; display: block; width: 450px; height: 100%; z-index: 1;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li {float: left; display: block; width: 40px; height: 100%; box-sizing: border-box; border-left: rgba(255,255,255,0.2) 1px solid; background-color: #1e2b4b;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(7) {border-right: rgba(255,255,255,0.2) 1px solid;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(2),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(3),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(4) {width: 80px;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(5),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(6),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(7) {background-color: #3163b4;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li > a {display: block; width: 100%; height: 100%; text-decoration: none; line-height: 40px; font-size: 12px; font-weight: 300; color: #fff; text-align: center;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li > button {display: block; width: 100%; height: 100%; padding: 0; border: 0; cursor: pointer; background-color: #3163b4;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li > button > img {display: block; width: 100%; height: auto; vertical-align: top;}
	
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 {/* position: absolute; *//* top: 0; *//* right: 0; */display: flex;/* width: 400px; */height: 100%;z-index: 1;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li {/* float: left; */display: block;width: 40px;height: 100%;box-sizing: border-box;border-left: rgba(255,255,255,0.2) 1px solid;background-color: #1e2b4b;flex-direction: row;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(6) {border-right: rgba(255,255,255,0.2) 1px solid;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(2){width: 80px;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(4), 
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(5),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(6),
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(7) {background-color: #3163b4;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li > a {display: block; width: 100%; height: 100%; text-decoration: none; line-height: 40px; font-size: 12px; font-weight: 300; color: #fff; text-align: center;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li > button {display: block; width: 100%; height: 100%; padding: 0; border: 0; cursor: pointer; background-color: #3163b4;}
	#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li > button > img {display: block; width: 100%; height: auto; vertical-align: top;}
	
	#header .headerFix > .naviArea {display: flex;flex-direction: row;position: relative;width: 100%;max-width: 1400px;height: 100px;margin: 0px auto 0;vertical-align: middle;}
	#header .headerFix > .naviArea .gi {width: 260px; height: 100px; box-sizing: border-box;padding: 35px 20px 30px;line-height: 20px; text-align: center; overflow: hidden; z-index: 1; transition: all 0.3s;}
	#header .headerFix > .naviArea .gi > a {display: block; width: 100%; height: 100%;}
	#header .headerFix > .naviArea .gi > a img {float: left; width: 100%; height: auto;}

		/* for Mobile Start */
		#header .naviArea .naviToggle {position: absolute; top: 15px; right: 20px; display: none; width: 30px; height: 30px; border: 0; text-indent: -9999px; z-index: 1; background-color: #fff; background-image: url('../img/naviToggle.png'); background-position: 0 0; transition: all 0.3s;}
		#header .naviArea .mobileHome {position: fixed; top: 0; right: -320px; display: none; width: 320px; height: 100px; box-sizing: border-box; padding: 50px 20px 19px; border-bottom: 1px #eee solid; z-index: 11; background: url('../img/bgMobileNavi.png') center top no-repeat #fff;}
		#header .naviArea .mobileHome > h1.logo {float: left; display: block; width: 195px; height: 30px;}
		/*
		#header .naviArea .mobileHome > h1.logo a {display: block; width: 100%; height: 100%; line-height: 30px; font-size: 14px; font-weight: 500; color: #222; text-align: left;}
		#header .naviArea .mobileHome > h1.logo a > img {display: block; width: 100%; vertical-align: top;}
		#header .naviArea .menuNavi > li > a.mobileSubHref {display: none;}
		*/
		#header .naviArea .mobileHome > h1.logo img {display: block; width: 100%; vertical-align: top;}
		/* for Mobile End */

	#gnb,
	#header .headerFix .naviArea .menuNavi {position: absolute; top: 0; right: 0; width: 880px; height: 100px; z-index: 1;}
	#header .headerFix .naviArea .menuNavi>li {position: relative; float: left; width: 100px; height: 100px; transition: all 0.3s;}
	#header .headerFix .naviArea .menuNavi>li:nth-child(1) {width: 140px;}
	#header .headerFix .naviArea .menuNavi>li:nth-child(2) {width: 160px;}
	#header .headerFix .naviArea .menuNavi>li:nth-child(3) {width: 140px;}
	#header .headerFix .naviArea .menuNavi>li:nth-child(5) {width: 100px;}
	#header .headerFix .naviArea .menuNavi>li:nth-child(6) {width: 140px;}
	#header .headerFix .naviArea .menuNavi>li.fix,
	#header .headerFix .naviArea .menuNavi>li.on,
	#header .headerFix .naviArea .menuNavi>li:hover {color: #222; font-weight: 500;}
	#header .headerFix .naviArea .menuNavi>li.on {color: #222; font-weight: 500;}

	#header .headerFix .naviArea .menuNavi>li>a {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; box-sizing: border-box; padding: 30px 0;  line-height: 40px; font-size: 16px; font-weight: 400; text-align: center; letter-spacing: 0; text-decoration: none; color: #444;z-index: 1; }

	#header .naviArea .menuNavi li .subMenu {
		position: absolute; display: none;
		top: 80px; left: 0px; width: 180px; height: auto; padding: 20px 0; z-index: 10; background-color: #464855;
		opacity: .95;
		filter: alpha(opacity=95);
		background-color: rgba(70,72,85,0.95);
		border-top: 0 #464855 solid;
	}
	#header .headerFix .naviArea .menuNavi li:last-child > .subMenu {left: auto; right: 0;}
	/*
	#header .headerFix .naviArea .menuNavi li>.sm01 {left: 0; height: 200px;}
	#header .headerFix .naviArea .menuNavi li>.sm02 {left: 0; height: 160px;}
	#header .headerFix .naviArea .menuNavi li>.sm03 {left: 0; height: 0;}
	#header .headerFix .naviArea .menuNavi li>.sm04 {left: 0; height: 0;}
	#header .headerFix .naviArea .menuNavi li>.sm05 {left: 0; height: 0;}
	*/
	#header .headerFix .naviArea .menuNavi li>.subMenu>li {float: left; display: block; width: 100%;}
	#header .headerFix .naviArea .menuNavi li>.subMenu>li>a {float: left; display: block; box-sizing: border-box; padding: 10px 15px; width: 100%; line-height: 20px; font-size: 13px; font-weight: 300; color: #fff; text-align: left; background-image: none; transition: all 0.3s;}
	#header .headerFix .naviArea .menuNavi li>.subMenu>li>a:hover,
	#header .headerFix .naviArea .menuNavi li>.subMenu>li:hover {color: #fff; text-decoration: none; background-color: rgba(0,0,0,0.2); transition: all 0.3s;}

	#header .headerFix .naviArea .menuNavi li:last-child>.subMenu>li>a {text-align: right;}
	@media screen and (max-width: 1220px) {
		#header .headerFix .naviArea .menuNavi {width: 690px;}
		#header .headerFix .naviArea .menuNavi>li {width: 70px; font-size: 15px; letter-spacing: -1px;}
		#header .headerFix .naviArea .menuNavi>li>a {font-size: 15px; letter-spacing: -1px;}
		#header .headerFix .naviArea .menuNavi>li:nth-child(1) {width: 110px;}
		#header .headerFix .naviArea .menuNavi>li:nth-child(2) {width: 130px;}
		#header .headerFix .naviArea .menuNavi>li:nth-child(3) {width: 120px;}
		#header .headerFix .naviArea .menuNavi>li:nth-child(5) {width: 80px;}
		#header .headerFix .naviArea .menuNavi>li:nth-child(6) {width: 110px;}
	}

	@media screen and (max-width: 980px) {
		#header {height: 100px; transition: all 0.3s;}
		#header .headerFix {height: 100px !important; background-color: rgba(255,255,255,1.0); transition: all 0.3s;}

		#header .headerFix > .naviArea {position: relative; width: 100%; height: 60px; margin: 0px auto 0;}
		#header .headerFix > .naviArea > .naviToggle {display: block; z-index: 11;}
		#header .headerFix > .naviArea > .naviToggle:hover {cursor: pointer; background-position: 0 -30px; transition: all 0.3s;}
		#header .headerFix > .naviArea > .mobileHome {display: block;}
		#header .headerFix > .naviArea .gi {width: 230px; height: 60px; padding: 18px 10px 12px;}
		#header .headerFix > .naviArea .menuNavi {display: none;}

		#header .headerFix .naviArea .menuNavi {position: fixed; top: 0; left: auto; right: -320px; display: none; width: 100%; max-width: 320px; min-width: 200px; margin-top: 100px; height: calc(100% - 100px); box-sizing: border-box; padding: 0 40px 20px;  z-index: 10; overflow-y: scroll; background-color: #fff;}
		#header .headerFix .naviArea .menuNavi > li:nth-child(n) {position: relative; display: block; list-style: none; width: 100%; height:40px;/* height: auto; */ min-height: 60px;transition: all 0.3s;}
		#header .headerFix .naviArea .menuNavi > li:nth-child(n) > a {position: relative; display: block; width: 100%; /* height: 100%; */ min-height: 60px; line-height: 40px; text-align: left; font-size: 15px; font-weight: 400; color: #444; box-sizing: border-box; padding: 10px 0;}
		#header .headerFix .naviArea .menuNavi li:last-child>.subMenu>li>a {text-align: left;}
		#header .headerFix .naviArea .menuNavi > li > span,
		#header .headerFix .naviArea .menuNavi > li:last-child > span {height: 100%; background: none;}
		#header .headerFix .naviArea .menuNavi > li.fix,
		#header .headerFix .naviArea .menuNavi > li.on,
		#header .headerFix .naviArea .menuNavi > li:hover {color: #222; background-color: #fff;}
		#header .headerFix .naviArea .menuNavi > li.on {color: #222;}

		#header .headerFix .naviArea .menuNavi > li > a.mobileSubHref {display: block;}

		#header .headerFix .naviArea .menuNavi > li > .subMenu {position: relative; top: 0; float: left; display: none; width: 100%; margin-top: -2px; padding: 0; border-top: 2px #222 solid;}
		#header .headerFix .naviArea .menuNavi > li > .subMenu > li {float: left; display: block; width: 100%; min-height: 40px; box-sizing: border-box; padding: 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}

		#header .headerFix .naviArea .menuNavi > li > .subMenu > li > a {width: 100%; box-sizing: border-box; padding: 10px 20px; font-weight: 300; line-height: 20px; font-size: 14px; font-weight: 300; text-align: left; color: #fff; background-image: none;}
		#header .headerFix .naviArea .menuNavi > li > .subMenu > li > a:hover,
		#header .headerFix .naviArea .menuNavi > li > .subMenu > li:hover {color: #fff; text-decoration: none;}

		#header .headerFix .naviArea .menuNavi > li > .subMenu > li.topLine {display: none;}
	}
	@media screen and (max-width: 660px) {
		#header .headerFix > .topLineArea > .topLineBox > .leftArea {width: 120px;}
		#header .headerFix > .topLineArea > .topLineBox > .leftArea > .count {display: none;}
		
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 {width: auto !important;}
		
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(3) {display: none !important;}
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(4) {display: none !important;}
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(5) {display: none !important;}
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(6) {display: none !important;}
		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea2 > li:nth-child(7) {display: none !important;}
		
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea {width: 200px;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(6) {border-right: rgba(255,255,255,0.2) 1px solid;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(4), */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(5), */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(6) {display: none;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(7) {display: none;} */	
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea {width: 200px;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(6) {border-right: rgba(255,255,255,0.2) 1px solid;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(4), */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(5), */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(6) {display: none;} */
/* 		#header .headerFix > .topLineArea > .topLineBox > ul.rightArea > li:nth-child(7) {display: none;} */
	}
	/* Top Header End */

	/* Response Box Start */
	#contentWrap {position: relative; width: 100%; min-width: 320px; margin: 0 auto; padding: 0;  /* headerFix의 높이와 동일하게 */}

	.responseArea {position: relative; width: 100%; height: auto; margin: 0 auto; padding: 0;}

	.r02Area {position: relative; width: 100%; height: auto; margin: 0 auto; padding: 0;}
	.r02Area .r02Box {position: relative; float: left; display: block; width: 50%; height: auto; margin: 0; padding: 0; transition: all 0.3s;}
	@media screen and (max-width: 980px) {
		.r02Box {width: 100% !important; transition: all 0.3s;}
	}

	.r03Area {position: relative; width: 100%; height: auto; margin: 0 auto; padding: 0;}
	.r03Area .r03Box {position: relative; float: left; display: block; width: 33.3333%; height: auto; margin: 0; padding: 0; transition: all 0.3s;}
	@media screen and (max-width: 980px) {
		.r03Box {width: 100% !important; transition: all 0.3s;}
	}
	/* Response Box End */

	/* Copyright Start */
	#bottom {position: relative; width: 100%; min-height: 160px; box-sizing: border-box; padding: 0; background-color: #464855;}

	#bottom > .bottomLinkArea {position: relative; display: block; width: 100%; max-width: 1200px; height: 60px; margin: 0 auto; box-sizing: border-box; padding: 0; }
	#bottom > .bottomLinkArea > ul.linkGroup {display: block; width: 100%; height: 60px;}
	#bottom > .bottomLinkArea > ul.linkGroup > li {float: left; width: 80px; height: 60px; box-sizing: border-box; padding: 20px 10px 20px 9px; border-left: 1px rgba(255,255,255,0.2) solid;}
	#bottom > .bottomLinkArea > ul.linkGroup > li:last-child {padding: 20px 9px 20px 9px; border-right: 1px rgba(255,255,255,0.2) solid;}
	#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(3) {width: 120px;}
	#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(4) {width: 130px;}
	#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(5) {width: 130px;}
	#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(6) {width: 60px;}
	#bottom > .bottomLinkArea > ul.linkGroup > li > a {display: block; width: 100%; height: 100%; line-height: 20px; font-size: 13px; font-weight: 400; color: #fff; text-align: center;}

	#bottom > .bottomLinkArea > ul.link2Group {position: absolute; right: 0; top: 10px; display: block; width: 300px; height: 40px; z-index: 1;}
	#bottom > .bottomLinkArea > ul.link2Group > li {float: left; display: block; width: auto; height: 40px;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related {width: 170px;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form,
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset {width: 100%; margin: 0; padding: 0; border: 0;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > legend {display: none;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > label {position: absolute; top: 0; left: 0; display: block; width: 0; height: 0; overflow: hidden;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > select {float: left; width: 130px; height: 40px; box-sizing: border-box;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > select,
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > select > * {font-size: 12px; font-weight: 400; color: #222;}
	#bottom > .bottomLinkArea > ul.link2Group > li.related > form > fieldset > button {float: left; display: block; width: 40px; height: 40px; box-sizing: border-box; padding: 10px 5px; border: 0px #666 solid; line-height: 20px; font-size: 12px; font-weight: 500; color: #fff; text-align: center; background-color: #222;}

	#bottom > .bottomLinkArea > ul.link2Group > li.kakao {width: 130px; box-sizing: border-box; padding-left: 10px; overflow: hidden;}
	#bottom > .bottomLinkArea > ul.link2Group > li.kakao > a,
	#bottom > .bottomLinkArea > ul.link2Group > li.kakao > a img {display: block; width: auto; height: 100%;}

	#bottom > .copyrightArea {display: block; width: 100%; box-sizing: border-box; padding: 30px 0; background-color: #fff;}
	#bottom > .copyrightArea > .copyrightBox {position: relative; display: block; width: 100%; max-width: 1200px; margin: 0 auto;}
	#bottom > .copyrightArea > .copyrightBox .bottomGI {position: absolute; top: 0; left: 0; display: block; width: 260px; height: 40px; z-index: 1;}
	#bottom > .copyrightArea > .copyrightBox .bottomGI > img {vertical-align: top; width: 100%;}
	#bottom > .copyrightArea > .copyrightBox .copyright {width: 100%; height: 40px; box-sizing: border-box; padding-left: 280px; line-height: 20px; font-size: 13px; font-weight: 400; color: #222; text-align: left;}
	#bottom > .copyrightArea > .copyrightBox .copyright br:first-child {display: none;}

	#bottom > .copyrightArea > .copyrightBox .wa {position:absolute; top:-10px; right:0px}

	@media screen and (max-width: 1220px) {
		#bottom > .bottomLinkArea {max-width: 960px;}
		#bottom > .copyrightArea > .copyrightBox {max-width: 960px;}
	}
	@media screen and (max-width: 980px) {
		#bottom > .bottomLinkArea {height: auto; padding: 0 10px;}

		#bottom > .bottomLinkArea > ul.linkGroup {text-align: center; height: auto; padding: 20px 0;}
		#bottom > .bottomLinkArea > ul.linkGroup > li {float: none; display: inline-block; width: auto; height: 40px; padding: 10px; border: 0;}
		#bottom > .bottomLinkArea > ul.linkGroup > li:last-child,
		#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(n) {width: auto; padding: 10px; border: 0; background-color: #2a2c38;}

		#bottom > .bottomLinkArea > ul.link2Group {position: relative; right: auto; top: auto; margin: 0 auto; padding-bottom: 20px;}

		#bottom > .copyrightArea > .copyrightBox .bottomGI {position: relative; margin: 0 auto;}
		#bottom > .copyrightArea > .copyrightBox .bottomGI > img {vertical-align: top; width: 100%;}
		#bottom > .copyrightArea > .copyrightBox .copyright {margin: 20px auto 0; font-size: 12px; padding-left: 0; text-align: center;}
		#bottom > .copyrightArea > .copyrightBox .wa {display:none}
	}
	@media screen and (max-width: 660px) {
		#bottom > .bottomLinkArea > ul.linkGroup > li:nth-child(n) {height: 30px; padding: 5px;}
		#bottom > .copyrightArea > .copyrightBox .copyright br:first-child {display: block;}
		#bottom > .copyrightArea > .copyrightBox .wa {display:none}
		
		.rPopup .rPopup_body img {max-height: 500px !important; }
	}
	@media screen and (max-width: 420px) {
		#bottom > .bottomLinkArea {height: auto; padding: 0;}
		#bottom > .bottomLinkArea > ul.linkGroup > li > a {font-size: 12px;}
		#bottom > .copyrightArea > .copyrightBox .copyright br:first-child {display: block;}
		#bottom > .copyrightArea > .copyrightBox .wa {display:none}
	}


	.BtGoTop {position: fixed; display: block; bottom: 20px; right: -60px; width: 60px; height: 60px; z-index: 99; background-color: rgba(0,0,0,0.7); transition: all 0.3s;}
	.BtGoTop:hover {background-color: rgba(230,4,18,0.8);}
	/* Copyright End */


	/* Up Slideanimate */
	.slideanim {visibility: hidden;}
	.slideUp {
	  animation-name: slide;
	  -webkit-animation-name: slide;
	  animation-duration: 1.0s;
	  -webkit-animation-duration: 1.0s;
	  visibility: visible;
	}
	@keyframes slide {
		0% {
		  opacity: 0;
		  transform: translateY(70%);
		} 
		100% {
		  opacity: 1;
		  transform: translateY(0%);
		}
	}
	@-webkit-keyframes slide {
		0% {
		  opacity: 0;
		  -webkit-transform: translateY(70%);
		} 
		100% {
		  opacity: 1;
		  -webkit-transform: translateY(0%);
		}
	}
	/* Up Slideanimate */
	
	/*추가*/
	.btnStyle{height: 40px; width: 100%; display: block;line-height: 40px; font-size: 16px; background-color: #3163b4; color: #fff; text-align: center;font-weight: 400; padding: 0 3px 0 3px;}




/*  전체메뉴ㅜ관련 추가 */
.skip {overflow: hidden;position: absolute; width: 1px; height: 1px;background: 0 0;font-size: 0 !important; color: transparent !important;line-height: 0;}
.lnb {width: calc(100% - 260px);}
.lnb:before{content: '';display: block;background: #FFF;border-bottom:1px solid #eee;/* box-shadow: 0px 15px 15px #eee; */}
.nav_open .nav_button, .nav_close .nav_button { display:none; }
.menu { background:#FFF; color:#111; position: relative;z-index: 1;}
.menu ul { list-style:none; margin:0; padding:0; }
.menu a { color:#111; text-decoration:none; display:block;  width: 100%; box-sizing: border-box; }
.menu .depth1_list { display:flex;flex-direction: row;justify-content: space-between;}
.menu .depth1_item { position:relative; width: 162.86px; }
.menu .depth1_item a{text-align: center;font-weight: 600;padding: 30px 0 40px;background: #FFF;font-size:1.1rem;letter-spacing: -0.09rem;}
.menu .depth1_item.depth1-active>a{color: #3163b4;}
.lnb .depth2 {display: none;/* 기존 스타일 유지 */position:relative;width:100%;border-right: 1px #eee solid;height: calc(100% - 100px);}
.lnb .depth2 .depth2_item .depth2_text{position:relative;width:100%;display: block;font-size: .9rem;}

.lnb.open .depth2 {display: flex; /* 전체 2뎁스 메뉴가 동시에 열림 */}
.depth2:before{content: '';width:100%;height:1px;background: #eee;position: absolute;left:0; top:0;}
.depth2.depth2-active:before{content: '';width:100%;height:3px;background: #3163b4;position: absolute;left:0; top:-3px;}
.depth2.depth2-active{background: #f7f7f7;}
.depth2.depth2-active a{background: #f7f7f7;color:#444;}
.depth2.depth2-active a:hover{font-weight:500;color: #3163b4;}
.menu .depth2 ul {padding:0.1rem 1.2rem;width:100%; box-sizing: border-box;}
.menu .depth2 ul li{width:100%;}
.menu .depth2 a { color:#111;font-weight: 400;padding:5px 0;text-align:left; letter-spacing:normal;}
/* PC: hover로 전체 서브 메뉴 표시 */
.depth1_item.has:hover .depth2 { display:flex; }
.menu-overlay {position: fixed;top:141px;left: 0;width:100vw;height: 535px;background: rgb(255, 255, 255); /* 반투명 어두운 배경 */box-shadow: 0px 5px 15px #eee;display: none;border-bottom: 1px solid #eee;}
.menu-overlay.active {display: block;}


/* 모바일 */
@media(max-width:1024px){
  .lnb{width: calc(100% - 230px);}
  .lnb:before{content: ''; display: block;visibility: hidden; opacity: 0; position: fixed; top: 0; left: 0;width: 100%;height: 100%; background-color: rgba(0, 0, 0, 0.8);z-index: 1;transition-property: visibility, opacity;transition-duration: 0.25s;transition-timing-function: linear;}
  .lnb.mshow:before{opacity: 1;visibility: visible;} 
  .nav_open{ position: absolute;display:block;visibility: visible;top:12px;right: 20px;z-index: 10; }
  .nav_close{width:280px;}
  /* 햄버거 메뉴 버튼 스타일 */
  .nav_open .nav_button, .nav_close .nav_button { width: 40px; height: 40px; display: flex; flex-direction: column; justify-content: space-around;align-items: flex-end;cursor: pointer;font-size: 0;background: #FFF;}  
  .nav_close .nav_button{display: none;}  
  .nav_close .nav_button{position: fixed;top: 10px;right:10px;z-index: 20; transition-property: visibility, right, margin-right;transition-duration: 250ms; transition-timing-function: ease-in-out;    background: url(/img/naviToggle.png) 5px -25px no-repeat;}
  .nav_open .lnb_line{display: block;height: 4px; width: 100%; background-color: #3163b4; border-radius: 2px; transition: all 0.3s ease; }
 .nav_open .lnb_line:nth-child(2) { width: 80%;}

  /* 햄버거 클릭 시 변형 (선택사항) */
  .nav_open.active .lnb_line:nth-child(1) { transform: rotate(45deg) translate(6px, 6px);}
  .nav_open.active .lnb_line:nth-child(2) { opacity: 0;}
  .nav_open.active .lnb_line:nth-child(3) { transform: rotate(-45deg) translate(7px, -7px);}

  /* 메뉴 기본 상태 */
  .lnb .menu {visibility: hidden;  overflow-x: hidden;overflow-y: auto; position: fixed; top: 0; left: auto;right: -2890px; z-index: 20; width: 280px; height: 100%;background-color: #ffffff;transition-property: visibility, right;    transition-duration: 250ms;transition-timing-function: ease-in-out;}
  /* 메뉴 열릴 때 */
  .lnb.mshow .menu{  visibility: visible;right: 0;background: #FFF url(/img/GI.png) 10px 18px no-repeat;background-size: 70%;}

  .menu .depth1_list { flex-direction:column;padding-top:60px; }
  .menu .depth1_item{width:100%;border-bottom:0.1rem solid #eee;}
  .menu .depth1_item:nth-child(1){border-top: 3px solid #3163b4;}
  .menu .depth1_item a{line-height: 140%;padding: 1rem 1.2rem;text-align: left;display: flex; flex-direction: row; gap: 0 1rem; align-items: center;letter-spacing: normal;}  
  .depth1_item.open>a{background: #3163b4;color:#FFF ;}
  .depth2 { position:static; display:none; flex-direction:column; padding:0; background:#ffffff; }
  .depth2 ul { margin:0; padding:0; }
  .depth2 a { padding-left:30px; }
  .lnb .depth2 .depth2_item .depth2_text{padding: .6rem;background: transparent;font-size: 1rem;}
  .lnb .depth1_item.open .depth2 .depth2_item .depth2_text:hover{color: #3163b4;}
  .depth1_item.open > .depth2 { display:block;background:#f7f7f7; }
  .depth1_item > a::after {display: block;content: '열기'; width: 7px;height: 7px;border-bottom: 2px solid #111;border-right: 2px solid #111;transform: rotate(45deg); transition: transform 150ms ease-in-out;    font-size: 0; }
  .depth1_item.open > a::after {content: '닫기';    border-bottom: 0;border-right: 0;border-top: 2px solid #fff;border-left: 2px solid #fff;}
  .depth2_item.open > .depth3 { display:block; } 
  .depth2 { max-height: 0; overflow: hidden;transition: max-height 0.3s ease;}
}