/*---------------------------------------------------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;
						}



/*---------------------------------------------------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: 1275px;
	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: 33%;
	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: 33.3%;
	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;}

/*.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;}
.depth02{right:0px;}

.depth02 li:first-child{text-align:right!important;margin-left:0%!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(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;
		  }
.depth 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:40%;}	
	
.depth{/*width:120%;*/
	   padding:0;
	   /*left:-12%;*/
	   right:0%;
	   top:/*160125 40px;*/55px;
	   width:100%;
	   /*left:5%;*/}


.depth li a{font-size:10.5px!important;margin:14px 0!important;}
.depth li{margin:/*160125 11px 0;*/0px; width: 27%;}
.depth li a:hover{/*color: #C70C47;*/font-size:11.5px!important;}

.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:1290px) {
	.header_wrap{width:92%;}
	.mobile_btn {
		display: none;
	}
	.cbp-spmenu {
		display: none;
	}
	header ul li a {
		font-size: 14px !important;	
	}

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

/*.depth{width:100%;
	   height:40px;
	   position:absolute;
	   top:42px;
	   padding:6% 0;}

.depth li{
		  float:left;
		  margin:0;
		  border:0px solid #fff;}

.depth li a{font-size:11px!important;margin:11px 0;}*/

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

.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;
}



.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;}