@charset "utf-8";
/************************************************ 
Version : 하이로닉 1.0
Date : 2015-05-11110
*************************************************/
/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:14px; font-weight:bold; color:#fff; line-height:1; text-align:center; overflow:hidden;}
#skipToContent a:focus,
#skipToContent a:active {margin-top:0; height:auto; padding:10px 0px;}

/* common */
.hidden {overflow:hidden; position:absolute; left:-9999em; height:0; font-size:0; line-height:0;}
.disNonei {display:none !important;} 
.disBlock {display:block !important;}
.ovH {overflow:hidden; width:100%; margin-bottom:6px;}
.ovH:after {clear:both; content:""; display:block;} 
.vm {vertical-align:middle !important;}
.clearBoth {clear:both !important;}
.textDeco {text-decoration:underline!important;}
.textInde {text-indent:0 !important;}
.sound_only { display: none; }
.sr-only{text-indent: -9999999999px}
/* text-align */
.tl {text-align:left !important;}
.tr {text-align:right !important;}
.tc {text-align:center !important;} 
.vt {vertical-align:top !important}

/* float */
.fl {float:left !important;}
.fr {float:right !important;}

/* Font Color */
.colorBlu {color:#3154af !important;}
.colorRed {color:#c91b1b !important;}
.colorYel {color:#9a6a2b !important;}
.colorGry01 {color:#222 !important;}
.colorGry02 {color:#666 !important;}
.colorGry03 {color:#717171 !important;}
 
/* margin size */  
.mt0 {margin-top:0 !important;}
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}

.mb0 {margin-bottom:0 !important;}
.mb13 {margin-bottom:13px !important;}
.mb37 {margin-bottom:34px !important;} /* 텍스트 40간격에 사용 */
 
.mr0 {margin-right:0 !important;}

.ml0 {margin-left:0 !important;}
.ml5 {margin-left:5px !important;}
 
.mt-5 {margin-top:-4px !important;} 
.mt-10 {margin-top:-10px !important;}
.mt-20 {margin-top:-20px !important;}

/* link */
a.link:link, a.link:active, a.link:visited, a.link:hover {text-decoration:underline;}
a.linkB:link, a.linkB:active, a.linkB:visited, a.linkB:hover {text-decoration:underline; color:#3154af;}


/* 버튼 */
.btnGray{display:inline-block; height:29px; line-height:29px; color:#fff !important; text-align:center; padding:0 25px; background:#777}
input.btnGray { font-family: "Nanum Gothic", "돋움", Dotum, AppleSDGothicNeo ,Droid Sans, arial, sans-serif; }

/* 버튼 */
.tab01{overflow:hidden; margin-bottom:20px}
.tab01 li{float:left; width:20%;}
.tab01.m02 li{width:50% ;}
.tab01.m04 li{width:25% ;}
.tab01.m08 li{width:12.5% ;}
.tab01 li a{display:block;  height:50px; line-height:50px; text-align:center; font-size:15px; background:#f3f3f3; border-top:1px solid #d6d6d6; border-right:1px solid #d6d6d6;  border-bottom:1px solid #d6d6d6; font-weight:bold}
.tab01 li:first-child a{border-left:1px solid #d6d6d6;}
.tab01 li.on a{color:#fff;background:#E11B22; border-top:1px solid #E11B22; border-right:1px solid #E11B22;  border-bottom:1px solid #E11B22; color:#fff}
.tab01 li:first-child.on a{border-left:1px solid  #E11B22;}
.mview{display: none !important;}
.wview{display: block !important;}

.clear {clear: both;content: '';display: block;}

@media only screen and (min-width:740px) and (max-width:1044px) { 
.tab01 li a{ font-size:14px; letter-spacing:-1px;}
}

@media only screen and (max-width:739px) {
	/* 버튼 */
	.btnGray{height:33px; line-height:33px;}

	.tab01{overflow:hidden; margin-bottom:20px; border-bottom:1px solid #d6d6d6;}
	.tab01 li{float:left; width:50%; margin-bottom:-1px}
	.tab01.m04 li,
	.tab01.m08 li{width:50% ;}
	.tab01 li a{display:block;  height:33px; line-height:33px; text-align:center; font-size:14px; background:#f3f3f3; border-top:1px solid #d6d6d6; border-right:1px solid #d6d6d6;  border-bottom:1px solid #d6d6d6;}
	.tab01 li:first-child a,
	.tab01 li:nth-of-type(3) a,
	.tab01 li:nth-of-type(5) a,
	.tab01 li:nth-of-type(7) a,
	.tab01 li:nth-of-type(9) a{border-left:1px solid #d6d6d6;}
	.tab01 li:nth-of-type(5){width:100%;} 
	.tab01.m08 li:nth-of-type(5){width:50%;}
	.tab01 li.on a{color:#fff;background:#E11B22; border-top:1px solid #E11B22; border-right:1px solid #E11B22;  border-bottom:1px solid #E11B22; color:#fff}
	.tab01 li:first-child.on a{border-left:1px solid  #E11B22;}
} 

@media only screen and (max-width:640px) {
	.mview{display: block !important;}
	.wview{display: none !important;}
	.right_banner {display:none;}
}