@charset "utf-8";


/*********************
** CSS Reset
**********************/
html,body,div,span,applet,object,iframe,p,blockquote,pre,a,abbr,acronym,address,big,code,del,dfn,em,font,img,ins,kbd,q,s,samp,strike,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,header,section,footer {
border:0;
font-size:1em;
font-style:inherit;
font-weight:inherit;
margin:0;
outline:0;
padding:0;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,select,textarea,p,blockquote,th,td,legend,button{margin:0;padding:0;color:#333;}
section,nav,header,footer{display:block;}
html { -webkit-font-smoothing:antialiased; }
body, html {margin:0;	padding:0;	overflow-x:hidden;  }
table{border-spacing:0;border-collapse:collapse;}
form,fieldset,img{border:0 none;}
ul,ol,li{list-style:none;}
ul,ol,li,dl,dt,dd {overflow:hidden;}
form{clear:both;}
th, td {text-align:left;font-weight:normal;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display:block;}


audio, video, canvas {display:inline-block;*display:inline;*zoom:1;}
caption {display:none;height:0;}
audio:not([controls]), [hidden], hr {display:none;height:0;}
label, input[type=button], input[type=submit], button {cursor:pointer;}
button, input, select, textarea {margin:0; outline-style:none;}
object, embed {max-width:100%;}
input, button {width:auto;overflow:visible;}
input, select {vertical-align:middle;}
textarea {overflow:auto;resize:none; border:1px solid #e0e0e0};
pre {white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word;}
pre, code, kbd, samp {font-family:monospace, sans-serif;}
sub, sup {font-size:75%;line-height:0;position:relative;}
sup {top:-0.5em;}
sub {bottom:-0.25em;}
ins {background-color:#ff9;color:#000;text-decoration:none;}
mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}
del {text-decoration:line-through;}
abbr[title], dfn[title] {border-bottom:1px dotted;cursor:help;}
button { background:none; border:none; }
/* base useset */
a {color:inherit;text-decoration:none;cursor:hand;cursor:pointer;}
a:hover {text-decoration:normal;}
input[type="text"], input[type="password"], textarea {border-radius:0;-webkit-appearance:none;}
legend, caption, .hide {visibility:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
select{height:26px;}

/************************************** 
** Basic Styling
***************************************/
body{font-family: NanumGothic,'나눔 고딕','helvetica',sans-serif; font-size: 1em; line-height: 1.5; color: #333; background-color:#ededed; width: 100%; -webkit-text-size-adjust: none; }
.blind {position:absolute; left:-2000px; top:0; width:0; height:0; font-size:0; line-height:0; font-size:0; text-indent:-5000px; overflow:hidden}
.ellip {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis;}



/* 라디오  -webkit-appearance: none; */
.select_radio { min-width:21px;  height:21px; position: relative; display:inline-block; z-index:10; cursor:pointer; padding-left:5px;}
input[type="radio"] {
width: 21px;
height: 21px;
position: relative;
z-index: 110;
cursor: pointer;
-webkit-appearance: none;
background: none;
border: 0;
outline: 0;
}
input[type="radio"] + span::before  {
  display:inline-block;
  width:21px; height:21px; line-height: 21px;
  content:" ";
  vertical-align: middle;
  position: absolute; top:0; left:0; z-index:20;
  border:0;  outline:0; cursor:pointer;
  background:transparent url(../images/icon/icon_radio.png) no-repeat  0 0; 
  background-size: 21px;
}
input[type="radio"] + span::before {
  background:transparent url(../images/icon/icon_radio.png) no-repeat  0 0;  
  background-size: 21px;
}
input[type="radio"]:focus + span:before {
  background:transparent url(../images/icon/icon_radio.png) no-repeat  0 0; 
  background-size: 21px;
}
input[type="radio"]:checked + span:before {
 background:transparent url(../images/icon/icon_radio.png) no-repeat 0 -29px;  
 background-size: 21px;
}

/* 셀렉터 박스 */
select {width:100%; background-color: transparent; border: 1px solid #ccc; box-shadow:none;  }

/* 인풋터 박스 */
input::-webkit-outer-spin-button,  
input::-webkit-inner-spin-button {-webkit-appearance: none;  margin: 0; }

input[type="text"], 
input[type="number"],
input[type="email"], 
input[type="search"],
input[type="password"], 
input[type="date"], 
input[type="tel"], 
textarea, 
select {display: block; width:100%; height:35px; padding:7px 10px; line-height:20px; color: #626262; font-size:14px; background: #fff; -moz-appearance: none; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; box-sizing: border-box; border:1px solid #ccc;   -webkit-border-radius: 3px;  -moz-border-radius:3px;  border-radius:3px;  }

input[type="text"], 
input[type="number"],
input[type="email"],
input[type="search"],
input[type="password"],
input[type="date"], 
input[type="tel"],
textarea, 
select {-webkit-transition: all 0.20s ease-in-out; -moz-transition: all 0.20s ease-in-out; -ms-transition: all 0.20s ease-in-out; -o-transition: all 0.20s ease-in-out; outline: none; border: 1px solid #ddd; }

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {box-shadow: 0 0 0px rgba(255, 255, 255, 1);  border: 1px solid rgba(253, 133, 28, 1);}

input.disabled {color:red; background-color:white;}

input[type="radio"]{ }

/* 정렬 */
.ac{text-align:center;}
.al{text-align:left;}
.ar{text-align:right;}

/* float */
.fn {float:none;}
.fl {float:left;}
.fr {float:right;}

.clear{display:block; float:none; clear:both;}
.db{display:block;}
.cb {clear:both;}
.bn{border:none;}
.overh{overflow:hidden;}
.bdr{border:1px solid red;}
.vt{vertical-align:top;}
.vb{vertical-align:bottom;}
.vm{vertical-align:middle;}
.tc{text-align:center;}
.tl{text-align:left;}
.tr{text-align:right;}
.b {font-weight:bold;}
.dn{display:none;}

.pdr10{padding-right:10px;}
.pd20{padding:20px;}

.mgl1{margin-left:1px;}
.mgl2{margin-left:2px;}
.mgl3{margin-left:3px;}
.mgl4{margin-left:4px;}
.mgl5{margin-left:5px;}
.mgl6{margin-left:6px;}
.mgl7{margin-left:7px;}
.mgl8{margin-left:8px;}
.mgl9{margin-left:9px;}
.mgl10{margin-left:10px;}
.mgl15{margin-left:15px;}
.mgl20{margin-left:20px;}
.mgl25{margin-left:25px;}
.mgl30{margin-left:30px;}

.mgr1{margin-right:1px;}
.mgr2{margin-right:2px;}
.mgr3{margin-right:3px;}
.mgr4{margin-right:4px;}
.mgr5{margin-right:5px;}
.mgr6{margin-right:6px;}
.mgr7{margin-right:7px;}
.mgr8{margin-right:8px;}
.mgr9{margin-right:9px;}
.mgr10{margin-right:10px;}
.mgr15{margin-right:15px;}
.mgr20{margin-right:20px;}
.mgr25{margin-right:25px;}
.mgr30{margin-right:30px;}

.mgt0{margin-top:0px;}
.mgt1{margin-top:1px;}
.mgt2{margin-top:2px;}
.mgt3{margin-top:3px;}
.mgt4{margin-top:4px;}
.mgt5{margin-top:5px;}
.mgt6{margin-top:6px;}
.mgt7{margin-top:7px;}
.mgt8{margin-top:8px;}
.mgt9{margin-top:9px;}
.mgt10{margin-top:10px;}
.mgt12{margin-top:12px;}
.mgt13{margin-top:13px;}
.mgt15{margin-top:15px;}
.mgt20{margin-top:20px;}
.mgt21{margin-top:21px;}
.mgt22{margin-top:22px;}
.mgt23{margin-top:23px;}
.mgt24{margin-top:24px;}
.mgt25{margin-top:25px;}
.mgt30{margin-top:30px;}
.mgt40{margin-top:40px;}
.mgt50{margin-top:50px;}
.mgt70{margin-top:70px;}

.mgb1{margin-bottom:1px;}
.mgb2{margin-bottom:2px;}
.mgb3{margin-bottom:3px;}
.mgb4{margin-bottom:4px;}
.mgb5{margin-bottom:5px;}
.mgb6{margin-bottom:6px;}
.mgb7{margin-bottom:7px;}
.mgb8{margin-bottom:8px;}
.mgb9{margin-bottom:9px;}
.mgb10{margin-bottom:10px;}
.mgb15{margin-bottom:15px;}
.mgb20{margin-bottom:20px;}
.mgb25{margin-bottom:25px;}
.mgb30{margin-bottom:30px;}
.mgb40{margin-bottom:40px;}
.mgb60{margin-bottom:60px;}

.mg1{margin:1px;}
.mg2{margin:2px;}
.mg3{margin:3px;}
.mg4{margin:4px;}
.mg5{margin:5px;}
.mg10{margin:10px;}
.mg20{margin:20px;}
.mg30{margin:30px;}
.mg40{margin:40px;}
.mg50{margin:50px;}
.mg60{margin:60px;}
.mg70{margin:70px;}
.mg80{margin:80px;}
.mg90{margin:90px;}
.mg100{margin:100px;}


/* 버튼 */
.btn_wrap		{text-align: center; margin-top:5px;}
.f_left			 {float:left;}
.f_right		 {float:right;}
.w100				{width:100%;}

/* 핀치줌 */
.zoomInOn,.zoomInOff,.zoomOutOn,.zoomOutOff,.closeButton{width:35px;height:35px;display:block;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.zoomInOn,.zoomInOff	{background-image:url(../images/icon/zoom_in.png); background-size:35px; top:10px;right:10px; display:none;}
.zoomOutOn,.zoomOutOff	{background-image:url(../images/icon/zoom_out.png); background-size:35px; top:52px;right:10px; display:none;}
.closeButton {background-image:url(../images/icon/zoom_close.png); background-size:35px; top:10px;right:10px}
.zoomInOn,.zoomOutOn{opacity:1;cursor:pointer}
.zoomInOff,.zoomOutOff{opacity:.3;cursor:auto}
.closeButton{cursor:pointer; z-index:100;}


/* ===============================================================
Navigation Styles 
================================================================*/
.navSec {overflow:hidden; position:absolute; left:-100%; top:0; z-index:50; width:235px; height:100%; background:#32394a; display:block;}
.navSec a {font-size:16px; font-weight:600;}
.navSec a img {vertical-align:middle;}
.navSec h2.nav_h2 {position:absolute; right:0; top:0; z-index:50; width:8px; height:100%; text-indent:-5000em; background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.5))); background:-moz-linear-gradient(left, rgba(0,0,0,0) 0.3%, rgba(0,0,0,0.5) 100%); background:-o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.5));}

.nav_search {
			background-color:#272d33;
			height: 38px;
			padding: 6px 8px 1px 7px;
}
.nav_search .side_Search {
			background: -webkit-gradient(linear, center top, center bottom, from(#414a5a), to(#4c5464));
			background: -webkit-linear-gradient(#414a5a, #4c5464);
			position: relative; line-height: 18px;
}
.nav_search .side_Search .input_search {
			 display: block; width:100%; background:url(../images/icon_search.png) no-repeat; background-size:15px;  background-position:10px 5px; 
}

.nav_search .side_Search .input_search .inputText {
			border: none; display: block; margin-left:27px;  width:180px; background:transparent;	border:0px #000 solid;		
			color: #c4ccda; cursor: text; text-indent:0px; font-size:14px;
			text-shadow: none; padding: 4px 7px 2px 0px; text-align: start;  letter-spacing: normal; word-spacing: normal; 
			-webkit-appearance: none; 
			-webkit-rtl-ordering: logical; 
			-webkit-user-select: text;
}
.nav_search a{color: #eee;border: 1px solid #676c78;display: inline-block;width: 100px;text-align: center;line-height: 30px;border-radius: 15px;}
.nav_search a:first-child{background-color:#464d5d}


.navSec ul.nav_mainMenu		{overflow:hidden;  }
.navSec ul.nav_mainMenu li	{overflow:hidden; float:left; width:117px; height:38px; display:block;}
.navSec ul.nav_mainMenu li a	{display:block; width:116px; height:36px; color:#c4ccda; text-shadow: 0 1px #000;  line-height:38px; }
.navSec ul.nav_mainMenu li.nav_left a	{border-top:1px solid #3e4555; border-bottom:1px solid #242a37; border-right:1px solid #3e4555; text-indent:42px; }
.navSec ul.nav_mainMenu li.nav_right a	{border-top:1px solid #3e4555; border-bottom:1px solid #242a37; border-left: 1px solid #242a37; text-indent:40px; }


.navSec ul.nav_mainList			{overflow:hidden; width:240px; }
.navSec ul.nav_mainList li		{float:left; width:117px; height:38px; display:block;}
.navSec ul.nav_mainList li a	{display:block; width:116px; height:38px; line-height:38px; color:#c4ccda; text-shadow:0 1px #000;}
.navSec ul.nav_mainList li.nav_left   {border-top:1px solid #3e4555; border-bottom:1px solid #242a37; border-right:1px solid #3e4555; }
.navSec ul.nav_mainList li.nav_right  {border-top:1px solid #3e4555; border-bottom:1px solid #242a37; border-left: 1px solid #242a37;}


.navList							{display:block; background:#353b49;}
.navList ul	li						{overflow:hidden; width:100%; display:block; background: url(../images/icon/bg_line.png) top repeat-x; background-size:25px 1px; }
.navList ul	li:first-child			{background:none;}
.navList ul li a					{display:block; width:100%; height:45px; color:#eee; text-shadow: 0 0px #000;  line-height:45px;border-top: 1px solid #494f5c;border-bottom: 1px solid #17191e; }
.navList ul li a.on			{background-color: #e46b00;border-top: 1px solid #f8a962;}
.navList ul li.active				{background-color:#264a95; border-top:0px solid #252a38;}


.navSec_sub {}
.navSec_sub a {font-size:16px; }
.navSec_sub a img {vertical-align:middle;}
.navSec_sub h2.nav_h3 {position:absolute; left:0; top:0; z-index:50; width:8px; height:100%; text-indent:-5000em; 
						background: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.5))); 
						background:-moz-linear-gradient(right, rgba(0,0,0,0) 0.3%, rgba(0,0,0,0.5) 100%); 
						background:-o-linear-gradient(right, rgba(0,0,0,0), rgba(0,0,0,0.5));}

.nav_subTitle	{overflow:hidden; position:relative; width:100%; height:22px;}
.nav_subTitle h2 {
	display:block; width:100%; height:22px; border-top:0px solid #4a4f5d; border-bottom:0px solid #242a37; line-height:22px;
	font-size:12px; font-weight:600; color:#b5beb8; text-shadow:0 0px #000; text-align:left; text-indent:11px; background-color:#494f5d;
}

.navSec small {display:block; width:100%; height:100%; line-height:72px; text-align:center; color:#b3b3b3; font-size:11px;  background: url(../images/bg_line.png) top repeat-x; background-size:25px 1px;}
.navSec_sub small {display:block; width:100%; height:100%; line-height:72px; text-align:center; color:#b3b3b3; font-size:11px;   background: url(../images/bg_line.png) top repeat-x; background-size:25px 1px;}


.setting			{display:block; background:#32394a;}
.setting ul	li		{overflow:hidden; width:100%; border-top:1px solid #3e4555; border-bottom:1px solid #242a37; }
.setting ul li.active				{background-color:#252a38; border-top:1px solid #252a38;}
.setting ul li a	{display:block; width:100%; height:38px; line-height:38px; color:#c4ccda; text-shadow: 0 1px #000;  line-height:38px;}
.setting ul li.setting_faver a		{text-indent:40px; background:url(../images/icon_nav_faver.png) no-repeat 10px 7px; background-size:25px;}
.setting ul li.setting_set a		{text-indent:40px; background:url(../images/icon_nav_set.png) no-repeat 10px 7px;  background-size:25px;}
.setting ul li.set a				{text-indent:33px; background:url(../images/icon_sub_arrow.png) no-repeat 10px 10px;  background-size:20px;}

/* --------------TRANSITION -------------------- */
/* nav */
#page-header,
#container,
#paging,
#page-footer,
.aniPage {
	-webkit-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-webkit-transform:translate(0px, 0px);	
	-moz-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-moz-transform:translate(0px, 0px);	
	-ms-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-ms-transform:translate(0px, 0px);	
	-o-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-o-transform:translate(0px, 0px);	
	transition:0.6s cubic-bezier(.50, 0, .50, 1);
	transform:translate(0px, 0px);
}
.aniWrap #page-header,
.aniWrap #container,
.aniWrap #paging,
.aniWrap #page-footer,
.aniWrap .aniPage {
	-webkit-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-webkit-transform:translate(235px, 0px);	
	-moz-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-moz-transform:translate(235px, 0px);	
	-ms-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-ms-transform:translate(235px, 0px);	
	-o-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-o-transform:translate(235px, 0px);	
	transition:0.6s cubic-bezier(.50, 0, .50, 1);
	transform:translate(235px, 0px);
}

.aniWrap_right #page-header,
.aniWrap_right #container,
.aniWrap_right #paging,
.aniWrap_right #page-footer,
.aniWrap_right .aniPage {
	-webkit-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-webkit-transform:translate(-235px, 0px);		
	-moz-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-moz-transform:translate(-235px, 0px);	
	-ms-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-ms-transform:translate(-235px, 0px);	
	-o-transition:0.6s cubic-bezier(.50, 0, .50, 1);
	-o-transform:translate(-235px, 0px);	
	transition:0.6s cubic-bezier(.50, 0, .50, 1);
	transform:translate(-235px, 0px);
	
}