/*---------------------------------------------------basic--------------------------------------------------*/
		
			/* reset-css  */
			/* �뜝�럩�뭵�뜝�럥爰�(element) �뜝�럥�뿰�뛾�룊�삕 占쎈／占쎈쐝�뵳怨ㅼ삕占쎈꼨  */
			*{margin:0;padding:0;}
			/* �뜝�럩�젷嶺뚮ㅄ維쀯옙�뭵�뜝�럥爰� */
			h1, h2, h3, h4, h5, h6 { font-size:100%;   font-weight:normal;} 
			/* �뜝�럥占쎈���삕筌뤒�逾녑뜝占� �뜝�럥�뵪�뜝�럥留됬뼨�먯삕 */
			fieldset, img, abbr,acronym { border:0 none; } 
			/* 嶺뚮ㅄ維뽨빳占� */
			 ul { list-style:none; }
			/* �뜝�럥占쎈���삕占쎈턄占쎈눀�뜝占� - 嶺뚮씭�쐡野껊벨�삕驪볦룞�삕�굢占� 'cellspacing="0"' 嶺뚯쉻�삕�뜝�럩�젧 �뜝�럥留숋옙�쇊�뜝占� �뜝�럥�닡�뜝�럩�뭵 */
			table {border-collapse: separate;border-spacing:0;border:0 none;}
			caption, th, td {text-align:left;font-weight: normal;}
			/* �뜝�럥占쎈낑�삕占쎈츩�뜝�럥諭� 占쎄슈�뜝�룞�삕占쎌죨 �뜝�럩�뭵�뜝�럥爰� 占쎈／占쎈쐝�뵳怨ㅼ삕占쎈꼨 */
			address, caption, strong, em, cite {font-weight:normal;font-style:normal;}
			ins { text-decoration:none; }
			del { text-decoration:line-through; }
			/* �뜝�럩逾ε뜝�럩�뮔占쎈닱�뜝占� */
			blockquote:before, blockquote:after, q:before, q:after { content:""; }
			blockquote,q { quotes:"" ""; }
			/* �뜝�럥�빢�뜝�럥利멨뜝�럡�맖*/
			hr { display:none; }
			/* reset-css  */
			*{margin:0px; padding:0px; -webkit-box-sizing: border-box;
 			-moz-box-sizing: border-box; box-sizing: border-box;}
 			/*�솻洹ｏ옙占쎌맠�뜝�룞�삕 �뜝�럥�넮�뜝�럥�럠�뜝�럩諭썲뜝�럥荑덂뜝�럥瑜�(嶺뚮씭�쐠壤쏅뵃�삕�뇡�꼻�삕占쎈뻔) �뜝�럩留꾢뜝�럥援▼뜝�럥裕욄뤆�룆占썬굥�뱺 �뜝�럥竊쀥뜝�럥留쇿뜝�럥六삼옙�끃裕뉓땻占� �솻洹��뫊�뙴袁ъ삕占쎈꺄占썩몿�뫒亦낆룊�삕驪볦뼲�삕占쎈턄 �뜝�럥�졅�뜝�럥由��뇦猿딆뒩甕곗빢�삕占쎈빢�뜝�럩肉녑뜝�럩踰�*/
 			

					.hide{display:none;}
					a{text-decoration:none;color:#000000;}
					li{list-style:none;}
					.block{display:block;}
					.border_right_none{border-right:0px solid #fff;}
					.border_left_none{border-left:0px solid #fff;}
					.border_top_none{border-top:0px solid #fff;}
					.border_bottom_none{border-bottom:0px solid #fff;}
					.border_none{border:0px solid #fff;}
					
					/*�뜝�럩�쓧嶺뚳퐦�삕*/
					
					.inline{
						display: inline-block;
						*display: inline;
						*zoom:1;
						}


					body {
						overflow-y:scroll;
						font-family:"NanumBarunGothic", "�뜝�럡�룎�뜝�럥�빖�뛾�룆��占쎈�뀐옙�뫁伊볣�억옙";
						font-size:100%;
						line-height: inherit;
						color: #000;
						overflow-x:hidden;
						}



/*---------------------------------------------------basic-end----------------------------------------------*/



@font-face{
  font-family:"NanumBarunGothic"; 
  src:url("/css/fonts/NanumBarunGothic.eot");
  src:local(�뜝�룞�삕), url("/css/fonts/NanumBarunGothic.woff")format("woff");
}

/*-----------font----------------------------------------------------------------------------------------*/



header {
	width: 100%;
	height: 55px;
	position: absolute;
	z-index: 100;
	top: 0px;
	float: left;
	background-color: #BE0445;
}

.header_wrap {
	width: 67%;
	margin: 0 auto;
}

.logo {
	float: left;
	/*margin:3.5px 0;*/
}

.logo img{margin:16.5px 0; width:164px;}
.mobile_logo{display:none;}


.gnb {
	float: right;
	/*width:479.5px;*/
	height:55px;
}


.last_border{border-right:0px solid #fff!important;}
.gnb>ul {
	width: /*114%;*/100%;
	display:inline-block;
	position:relative;
	height:55px;
}

.gnb>ul:after{display:block;
			  content:'';
			  clear:both;}

.gnb li {
	float: left;
	width: auto;
	margin-right:59px;
	height: 55px;
	/*text-align: center;*/
}
.gnb li:first-child{text-align:left;}

.gnb li:nth-child(2){text-align:center;}

.gnb li:last-child{text-align:right; margin-right:0px;}

/*.gnb li:hover ul{display:block;}*/

.gnb li a {
	color: #fff;
	font-size: 18px;
	display:block;
	/*border-right: 2px solid #919191;*/
	height:17px;
	margin:16.5px 0;
}

.gnb li a:hover {
	/*color: #000;*/
}


.gnb_li:hover ul{display:block;}

/*header_basic*/


.depth01{left:0px; width:700px!important;}
.depth02{right:0px; width:400px!important;}

.depth02 li:first-child{text-align:right!important;margin-right:1%!important;}
.depth02 li:nth-child(2){text-align:center!important;}
.depth02 li:nth-child(3){text-align: left!important;}

.depth02 li{float:right!important;}

.depth03{width:100%!important; text-align:center!important;}
.depth03 li{padding:0px!important; width:100%!important;}
.depth03 li a{text-align:center;}
#gnb_li03{position:relative!important;}

.depth01 li:nth-child(1){margin-left:1%!important;}
.depth01 li:nth-child(2){text-align:center!important;}
.depth01 li:nth-child(3){text-align:right!important;}


.depth{
	   width: 100%;
	   position:absolute;
	   top:30px;
	   display:none;
	   -webkit-animation: depAni .7s ease 0s backwards;
	   animation: depAni .7s ease 0s backwards
	   }

.depth li{
		  /*width: 27%;*/
		  text-align:left!important;
		  float:left;
		  margin:18px 0;
		  border:0px solid #fff;
		  margin-left:10%;
		  }
		  
.depth03 li:first-child{margin-left:1%;}
.depth li a{font-size:15px;height:12px;}
.depth li a:hover{font-size:16px;}

/* 20160119
.depth01{left:0px;}
.depth02{right:0px;}

.depth02 li:first-child{padding-right:1%!important; padding-left:6%!important;}
.depth02 li{float:right!important;}

.depth03{width:100%!important; text-align:center!important;}
.depth03 li{padding:0px!important; width:100%!important;}
.depth03 li a{text-align:center;}
#gnb_li03{position:relative!important;}

.depth{
	   width:130%;
	   position:absolute;
	   top:30px;
	   display:none;
	   -webkit-animation: depAni .7s ease 0s backwards;
		animation: depAni .7s ease 0s backwards}

.depth li{
		  width:auto;
		  text-align:left!important;
		  padding:0 6%;
		  float:left;
		  margin:18px 0;
		  border:0px solid #fff;}
.depth li:first-child{padding-left:1%;}
.depth li a{font-size:15px; height:12px;}

*/



.gnb_sub{overflow:hidden;
		 position:absolute;
		 left:0px;
		 top:55px;
		 width:100%;
		 margin:0 auto;
		 z-index:-1;
		 /*transform:all 0.3s;*/
		 display:none;}

.gnb_inn{background:rgba(70,70,70,1);
		 height:40px;
		 margin:0;
		 z-index:-3;
		 position:relative;
		 }


.top_nav{position:relative;/* background:#fafafa; */ width:100%; padding-top:10px;padding-bottom:5px;/* border-bottom:1px solid #E2E2E2; */}
.top_nav div{width:67%; margin:0 auto; background-repeat:no-repeat; background-position:0% 0%;}
.top_nav p{font-size:13px; color:#fff; position:absolute; left:16.7%;}
.top_nav p a{color:#fff;}
/*.top_nav p a:hover{color:#BE0445;}*/
.top_nav p span{font-size:8px; padding:0 5px;line-height:2.2em; }
/*.top_nav p .r_txt{color:#BE0445;}*/


.liani{
-webkit-animation: depAni .3s ease 0s backwards;
animation: depAni .3s ease 0s backwards}

@-webkit-keyframes depAni{
    0%{opacity:0;-webkit-transform:translateY(-30px)} 
    100%{opacity:1;-webkit-transform:translateY(0px)}}

@keyframes depAni{
    0%{opacity:0;transform:translateY(-30px)} 
    100%{opacity:1;transform:translateY(0px)}}    



/*about_starion*/
.about_starion {
	width: 100%;
	float: left;
	background: #3A3939;
	text-align: center;
}

#cssmenu {
	width: 100%;
	float: left;
}

.about {
	width: 100%;
	height: 42px;
	position: relative;
}

.about_btn {
	width: 1%;
	height: 42px;
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	font-size: 15px;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
}

.about_btn img {
	margin-left: 10px;
	vertical-align: middle;
}

.about_open {
	display: none;
	border-top: 1px solid #6c6c6c;
    background:rgba(69,69,69,1);
	width: 100%;
	height: 135px;
	float: left;
        position:absolute;
        bottom:100%;
        z-index:2;
}

.about_ci{width:100%!important;
		  height:135px;
		  position:absolute;
		  background:url('http://starion.designerskorea.com/images/dropzone/3232235777_NiQuIGcK_ci.png');
		  background-repeat:no-repeat;
		  background-position:100% 0%;
                  text-indent:-9999px;
                  z-index:-22;}

.about_open li {
	width: 67%;
	margin: 0 auto;
}

.about_open div {
	float: left;
	width: 20%;
	height: 132px;
}

.about_open div a {
	display: table-cell;
	height: 132px;
	text-align: center;
	vertical-align: middle;
	font-size: 17.15px;
	color: #fff;
}

.about_open div p {
	display: table-cell;
	width: 18%;
	height: 81px;
	text-align: left;
	vertical-align: middle;
	font-size: 16.34px;
	color: #fff;
        position:relative;
}

.about_open div p span {
	width: 150px;
	display: block;
	text-align: center;
	font-weight: bold;
}
.about_open div:first-child {
	width: 23%;
	height: 81px;
	margin-top: 28px;
	margin-right: 12%;
	float: left;
	border-right: 1px solid #a2a2a2;
}

.about_open div:last-child {
	width: 5%;
}

.about_open div a span {
	display: block;
	margin-top: 5px;
}

.about_open figure {
	width: auto;
	height: /*65px;*/70px;
	text-align: center;
}

.about_open div a span {
	display: block;
	margin-top: 5px;
}

.ci_new{position:absolute;
		left:-100px;
		top:center;
		width:90px;}




/*mobile*/
.mobile_btn {
	display: none;
}

	.cbp-spmenu {
		display: none;
	}

#exit {
	width: 20px;
	height: 20px;
	float: right;
	margin: 5px;
	border: 0px solid #000000;
	background: url('/images/btn_close.png');
	background-repeat: no-repeat;
	cursor:pointer;
}
/*
#exit_bk {
	width: 18px;
	height: 18px;
	float: right;
	margin: 5px;
	border: 0px solid #000000;
	background: url('images/glyphicons-208-remove-2.png'); 
	background-repeat: no-repeat;
}

#exit, #showLeft:hover {
	opacity: 0.6;
}
*/

#showLeft:hover {
	opacity: 0.6;
}

#showLeft {
	width: 22px;
	height: 22px;
	float: right;
	margin-top: /*14px;*/16.5px;
	border: 0px solid #000000;
	background: url('images/glyphicons-114-justify.png');
	background-repeat: no-repeat;
}

.cbp-spmenu li ul li:first-child{border-top:1px solid #fff;}

.cbp-spmenu li ul li:last-child{
	border-bottom: 0px solid #e1e1e1;
}

.cbp-spmenu {
	border: 1px solid #e1e1e1;
	background: rgba(0, 0, 0, 0.65);
	position: fixed;
}

.cbp-spmenu li {
	border-bottom: 1px solid #e1e1e1;
}

.cbp-spmenu a {
	display: block;
	font-size: 14.46px;
	color: #fff;
}

.cbp-spmenu li p {
	display: none !important;
}

.cbp-spmenu a:hover {
	background: rgba(255, 255, 255, 0.7);
}

.cbp-spmenu a:active {
	background: #f7f7f7;
}

/* Orientation-dependent styles for the content of the menu */
.cbp-spmenu-vertical {
	width: 200px;
	height: 100%;
	top: 55px;
	z-index: 1000;
}

.cbp-spmenu-vertical a {
	padding: 1em;
}

.cbp-spmenu-left {
	right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
	right: 0px;
}

/* Transitions */
.cbp-spmenu {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/* Example media queries */
@media screen and (max-width: 55.1875em) {
	.cbp-spmenu-horizontal {
		font-size: 75%;
		height: 110px;
	}
}

@media screen and (max-height: 26.375em) {
	.cbp-spmenu-vertical {
		font-size: 90%;
		width: 190px;
	}
	.cbp-spmenu-left
	,
	{
	right
	:
	 
	-190
	px
	;
	
	
}

}

#cssmenu li{cursor:pointer;}
.mobile_sub_sub_nav li{background:rgba(0,0,0,0.5);}
.mobile_sub_sub_nav{display:none;}

/*mobile end*/

/*responsible*/


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


.mobile_logo{display:block;}
.pc_logo{display:none;}

}


@media screen and (min-width:320px) and (max-width:660px) {
	.container{
		width: 100%;
	}
	.header_wrap{width:92%!important;
			 float:left;
			 margin:0 4%!important;
			 height:55px;}
	
	.cbp-spmenu {
		display: block !important;
	}
	.mobile_btn {
		display: block !important;
	}
	.gnb {
		display: none;
	}
	
	.logo{height:55px;}
	.logo img{margin:19px 0; width:133px;}
	
	
	/*about_starion*/

	.about_open li {
		width: 100%;
	}
	.about_open div:first-child {
		display: none;
	}
	.about_open div {
		width: 25%;
	}
	.about_open div a {
		width: 25%;
		text-align: center;
	}
	.about_open div:last-child {
		width: 22%;
	}
	.about_open div a span {
		font-size: 11px;
	}
	.about_open div a img {
		transform: scale(0.6);
		-webkit-transform: scale(0.6);
	}
	
	
}

@media screen and (min-width:661px) and (max-width:960px) {
	.cbp-spmenu {
		display: none;
	}
	.container {
		width: 100%;
	}
	header .gnb li {
		/*160125height: 15px;*/
	}
	header .gnb li a {
		font-size: 14px; /*160125height:55px;*/ margin:19px auto;
	}
	
	.header_wrap{width:92%;}

header{height:55px;}

header .gnb{/*width:350px;*/}
.gnb li{margin-right:34.8px;}	
.gnb li:nth-child(2){text-align:left;}
.depth03 li a{text-align:center;}
	
.depth{/*width:120%;*/
	   padding:0;
	   /*left:-12%;*/
	   right:0%;
	   top:/*160125 40px;*/55px;
	   width:100%;
	   /*left:5%;*/}

.depth01{left:0px; width:451px!important}
.depth02{right:0px; width:250px!important}
.depth li a{font-size:10.5px!important;margin:14px 0!important;}
.depth li{margin:/*160125 11px 0;*/0px; /*width: 27%;*/ margin-left:5%;}
.depth li a:hover{/*color: #C70C47;*/font-size:11.5px!important;}
.depth02 li:first-child{margin-left: 10%;}
.depth02 li{margin-left:10%;}
.gnb_sub{ top:55px!important;}

.gnb_inn{background:rgba(70,70,70,1);
		 height:40px;
		 margin:0;
		 z-index:-3;
		 position:relative;}



.top_nav p {left:4%;}


/*about_starion*/
         .about_ci{height:155px;}
         .about_open{height:155px;}

	.about_open div {
		float: left;
		width: 25%;
		/*height: 132px;*/
                height: 155px;
	}
	.about_open div a {
		display: table-cell;
		width: 23%;
		/*height: 132px;*/
                height: 155px;
		text-align: center;
		vertical-align: middle;
		font-size: 14px;
		color: #fff;
	}
	.about_open div:first-child {
		display: none;
	}
	.about_open div:last-child {
		width: 20%;
	}
	.about_open div:last-child a {
		width: 20%;
		text-align: center;
	}
}

@media screen and (min-width:961px) and (max-width:1272px) {
	.mobile_btn {
		display: none;
	}
	.cbp-spmenu {
		display: none;
	}
	header ul li a {
		font-size: 14px !important;	
	}

.gnb{/*width:330.5px;*/}
.gnb li{margin-right:25px;}

.gnb li a{margin:19px 0;}

.depth02{width:300px!important;}
.depth01{left:0px; width:480px!important;}

.depth{top:37px;}
.depth li a{font-size:11px!important;margin:14px 0;}
.depth li a:hover{font-size:12px!important;}
.depth li{width:auto;
		  margin-right:0!important;}

.gnb_sub{overflow:hidden;
		 position:absolute;
		 left:0px;
		 top:55px;
		 width:100%;
		 margin:0 auto;
		 z-index:-1;}

.gnb_inn{background:rgba(70,70,70,1);
		 height:40px;
		 margin:0;
		 z-index:-3;
		 position:relative;}


}
#top_btn{width:100%;
		 float:left;;}



#top_btn a span{width:45px;
				height:45px;
				display:table-cell;
				vertical-align:middle;
				text-align:center;}

#top_btn .jbFixed {
	position: fixed;
	right: 0.6%;
	bottom: 10px;
	display: none;
	z-index:10;
}



.menucolor {color:#000!important;}
.menucolor:hover {color:#fff!important;}

.sub_menucolor {color:#be0445!important;}
.sub_menucolor:hover {color:#fff!important;}


div.popup{border:5px solid #e1e1e1; background:#fff; box-shadow:2px 2px 4px rgba(0,0,0,.5);}
div.pop_footer{height:35px; margin-top:5px; font-size:13px; color:#000; text-align:right; line-height:1.8em;}
div.pop_footer label{display:inline-block; zoom:1; color:#666;float:none;margin:0;font-size:13px;font-weight:normal;width:auto;padding:0;}
div.pop_footer a.popup_x{display:inline-block; width:50px; height:19px; margin-left:5px; padding-top:4px; color:#5e5e5e; text-align:center; text-decoration:none; cursor:pointer; zoom:1;}