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