/* 버튼스타일 */
.btn {
	font-family:nanumgothic;
  display: inline-block;
  *display: inline;
  padding: 4px 10px;
  margin: 0;
  *margin-left:5px;
  font-size: 11px;
  line-height: 11px;
  color: #333333;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #f5f5f5;
  *background-color: #cccccc;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  *border: 0;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
  color: #333333;
  background-color: #e6e6e6;
  *background-color: #d9d9d9;
}

.btn:active,
.btn.active {
  background-color: #cccccc \9;
}


.btn:hover,
.btn:focus {
  color: #333333;
  text-decoration: none;
  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
       -o-transition: background-position 0.1s linear;
          transition: background-position 0.1s linear;
}

.btn:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

.btn.active,
.btn:active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn.disabled,
.btn[disabled] {
  cursor: default;
  background-image: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}



/*오렌지색*/
.btn_orange{
	color:#fff;
	text-shadow:0 -1px 0 rgba(0,0,0,0.25);
	background-color:#faa732;*background-color:#f89406;
	background-image:-webkit-gradient(linear,0 0,0 100%,from(#fbb450),to(#f89406));
	background-image:-webkit-linear-gradient(top,#fbb450,#f89406);
	background-image:-o-linear-gradient(top,#fbb450,#f89406);
	background-image:linear-gradient(to bottom,#fbb450,#f89406);
	background-image:-moz-linear-gradient(top,#fbb450,#f89406);
	background-repeat:repeat-x;border-color:#f89406 #f89406 #ad6704;
	border-color:rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
	filter:progid:dximagetransform.microsoft.gradient(startColorstr='#fffbb450',endColorstr='#fff89406',GradientType=0);
	filter:progid:dximagetransform.microsoft.gradient(enabled=false);
}
.btn-orange:hover,.btn-orange:active,.btn-orange.active,.btn-orange.disabled,.btn-orange[disabled]{
	color:#fff;
	background-color:#f89406;
	*background-color:#df8505;
}
.btn-orange:active,.btn-orange.active{background-color:#c67605 \9;}



.btn_blue {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #006dcc;
  *background-color: #0373be;
  background-image: -moz-linear-gradient(top, #1f8dd2, #0373be);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1f8dd2), to(#0373be));
  background-image: -webkit-linear-gradient(top, #1f8dd2, #0373be);
  background-image: -o-linear-gradient(top, #1f8dd2, #0373be);
  background-image: linear-gradient(to bottom, #1f8dd2, #0373be);
  background-repeat: repeat-x;
  border-color: #0044cc #0044cc #002a80;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f8dd2', endColorstr='#0373be', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn_blue:hover,
.btn_blue:focus,
.btn_blue:active,
.btn_blue.active,
.btn_blue.disabled,
.btn_blue[disabled] {
  color: #ffffff;
  background-color: #006dcc;
  *background-color: #0373be;
}

.btn_blue:active,
.btn_blue.active {
  background-color: #003399 \9;
}



.btn_black {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #4b4f51;
  background-image: -moz-linear-gradient(top, #4b4f51, #414547);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4b4f51), to(#414547));
  background-image: -webkit-linear-gradient(top, #4b4f51, #414547);
  background-image: -o-linear-gradient(top, #4b4f51, #414547);
  background-image: linear-gradient(to bottom, #4b4f51, #414547);
  background-repeat: repeat-x;
  border-color: #333333;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4b4f51', endColorstr='#414547', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn_black:hover,
.btn_black:focus,
.btn_black:active,
.btn_black.active,
.btn_black.disabled,
.btn_black[disabled] {
  color: #ffffff;
  background-color: #313131;
  background-image: -moz-linear-gradient(top, #313131, #313131);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#313131), to(#313131));
  background-image: -webkit-linear-gradient(top, #313131, #313131);
  background-image: -o-linear-gradient(top, #313131, #313131);
  background-image: linear-gradient(to bottom, #313131, #313131);
  background-repeat: repeat-x;
  border-color: #222;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#313131', endColorstr='#313131', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn_black:active,
.btn_black.active {
  background-color: #080808 \9;
}


.btn_red {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #da4f49;
  *background-color: #bd362f;
  background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
  background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
  background-repeat: repeat-x;
  border-color: #bd362f #bd362f #802420;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn_red:hover,
.btn_red:focus,
.btn_red:active,
.btn_red.active,
.btn_red.disabled,
.btn_red[disabled] {
  color: #ffffff;
  background-color: #bd362f;
  *background-color: #a9302a;
}

.btn_red:active,
.btn_red.active {
  background-color: #942a25 \9;
}



.btn_none { 
  display: inline-block;
  *display: inline;
  padding: 4px 10px;
  margin: 0;
  *margin-left:5px;
  font-size: 12px;
  line-height: 16px;
  color: #333333;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #f5f5f5;
  *background-color: #cccccc;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  *border: 0;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); }



.btn_blue_none { 
  display: inline-block;
  *display: inline;
  padding: 4px 10px;
  margin: 0;
  *margin-left:5px;
  font-size: 12px;
  line-height: 16px;

  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;

  border: 1px solid #cccccc;
  *border: 0;

  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;

  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
		  
  /* 기본 속성값*/

  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #006dcc;
  *background-color: #0373be;
  background-image: -moz-linear-gradient(top, #1f8dd2, #0373be);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1f8dd2), to(#0373be));
  background-image: -webkit-linear-gradient(top, #1f8dd2, #0373be);
  background-image: -o-linear-gradient(top, #1f8dd2, #0373be);
  background-image: linear-gradient(to bottom, #1f8dd2, #0373be);
  background-repeat: repeat-x;
  border-color: #0044cc #0044cc #002a80;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f8dd2', endColorstr='#0373be', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  
  
.btn_black_none { 
  display: inline-block;
  *display: inline;
  padding: 4px 10px;
  margin: 0;
  *margin-left:5px;
  font-size: 12px;
  line-height: 16px;

  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;

  border: 1px solid #cccccc;
  *border: 0;

  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;

  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
		  
  /* 기본 속성값*/

  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #4b4f51;
  background-image: -moz-linear-gradient(top, #4b4f51, #414547);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4b4f51), to(#414547));
  background-image: -webkit-linear-gradient(top, #4b4f51, #414547);
  background-image: -o-linear-gradient(top, #4b4f51, #414547);
  background-image: linear-gradient(to bottom, #4b4f51, #414547);
  background-repeat: repeat-x;
  border-color: #333333;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4b4f51', endColorstr='#414547', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  
.btn_red_none { 
  display: inline-block;
  *display: inline;
  padding: 4px 10px;
  margin: 0;
  *margin-left:5px;
  font-size: 12px;
  line-height: 16px;

  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;

  border: 1px solid #cccccc;
  *border: 0;

  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;

  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
		  
  /* 기본 속성값*/

  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #da4f49;
  *background-color: #bd362f;
  background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
  background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
  background-repeat: repeat-x;
  
  border-color: #bd362f #bd362f #802420;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);}
  
  
  
.btn_none:hover,
.btn_none:focus,
.btn_none:active,

.btn_red_none:hover,
.btn_red_none:focus,
.btn_red_none:active,

.btn_black_none:hover,
.btn_black_none:focus,
.btn_black_none:active,

.btn_blue_none:hover,
.btn_blue_none:focus,
.btn_blue_none:active {  }



.btn_group {
  position: relative;
  display: inline-block;
  *display: inline;
  margin-left: .3em;
  font-size: 0;
  white-space: nowrap;
  vertical-align: middle;
  *zoom: 1;
}

.btn_group > .btn {
	z-index:1;
  	position: relative;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-left:none;
}

.btn_group > .btn:first-child {
  	z-index:2;
	margin-left: 0; *margin-left: 5px;
	border-radius:3px 0 0 3px;
	-webkit-border-radius:3px 0 0 3px;
	-moz-border-radius:3px 0 0 3px;
	border-left:1px #bfbfbf solid;
}


.btn_group > .btn:last-child {
  	z-index:3;
	border-radius:0 3px 3px 0;
	-webkit-border-radius:0 3px 3px 0;
	-moz-border-radius:0 3px 3px 0;
}


.btn_search { padding:6px 40px; font-weight:bold; *padding:6px 20px;  }
.btn_login { padding:25px 30px; font-weight:bold; border-radius:3px; font-size:16px }

.btn_admin { position:absolute; margin:-5px 0 0 10px; text-align:left}




/* 페이지번호 */
.pager {margin:20px 0; padding:0; text-align:center;}
.pager a {padding:2px 7px; display:inline-block; cursor:pointer; text-align:center; text-decoration:none;
	border:1px #ddd solid; margin-left:-1px; background-color:#fff; color:#666;
}

.pager a:first-child {
	border-radius:3px 0 0 3px;
	-webkit-border-radius:3px 0 0 3px;
	-moz-border-radius:3px 0 0 3px;
}
.pager a:last-child {
	border-radius:0 3px 3px 0;
	-webkit-border-radius:0 3px 3px 0;
	-moz-border-radius:0 3px 3px 0;
}
.pager a:hover, .pager a.active {background-color:#6d6d6d; color:#fff;}





/* 큰 아이콘 */
.icon_main { background:url(../images/icon_compass.png) no-repeat 20px 23px; padding-left:40px}

.border_none{ border:0; }
.checkbox_border_none { border:none; box-shadow:none }


/* 통계 박스*/
.stats { border:#CCC solid 1px; border-radius:5px; min-height:300px; vertical-align:middle  }


/* 체크 리스트 박스*/
.check_box { position:relative; display:block; width:100%; min-height:250px; height:auto; border-top:#666 solid 1px; }
.check_box ul  { margin:0 5px; padding:0}
.check_box li { /*width:48%; margin-right:2%;*/ font-weight:bold; list-style:none; border-bottom:#CCC solid 1px; padding:2px 0 5px 20px; 
line-height:36px; background:url(../images/list_1.png) no-repeat 5px 15px }
.check_box li button { }

.check_box h4 { line-height:35px; margin:0; border-top:#CCC dashed 1px; }
.check_box table { line-height:18px; margin-bottom:15px; }





/* 툴팁 */ 
a.tooltip {outline:none; }
a.tooltip img { border:0; }
a.tooltip strong {line-height:20px;}
a.tooltip:hover {text-decoration:none;} 
a.tooltip span {
    z-index:10;display:none; padding:10px;
    margin-top:-30px; margin-left:28px;
    line-height:16px;
}
a.tooltip:hover span{
    display:inline; position:absolute; color:#fff; background:#333;}
    
/*CSS3 extras*/
a.tooltip span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}



/* 세로 Bar 그래프 */
.vGraph{ padding:0 0 40px 0;}
.vGraph ul{ margin:0; padding:20px 35px 0 35px; height:200px; border:1px solid #ddd;  font-size:11px; font-family:Tahoma, Geneva, sans-serif; list-style:none; background-color:#fff}
.vGraph ul:after{ content:""; display:block; clear:both;}
.vGraph li{ float:left; display:inline; width:20px; height:100%; margin:0 9px; position:relative; text-align:center; white-space:nowrap;}
.vGraph .gTerm{ position:relative; display:inline-block; width:100%; height:20px; line-height:20px; margin:0 -100% -20px 0; padding:200px 0 0 0; vertical-align:bottom; color:#767676; font-weight:bold;}
.vGraph .gBar{ position:relative; display:inline-block; width:100%; margin:-1px 0 0 0; border:1px solid #ccc; border-bottom:0; background:#e9e9e9; vertical-align:bottom;}
.vGraph .gBar span{ position:absolute; width:100%; top:-20px; left:0; color:#767676;}

/* Horizontal Bar Graph */
.hGraph ul{ margin:0 50px 0 50px; padding:1px 0 0 0; border:1px solid #ddd; border-top:0; border-right:0; font-size:11px; font-family:Tahoma, Geneva, sans-serif; list-style:none;}
.hGraph li{ position:relative; margin:10px 0; white-space:nowrap; vertical-align:top;}
.hGraph .gTerm{ position:absolute; width:40px; top:0; left:-50px; line-height:20px; text-align:right; color:#767676; font-weight:bold;}
.hGraph .gBar{ position:relative; display:inline-block; height:20px; border:1px solid #ccc; border-left:0; background:#e9e9e9;}
.hGraph .gBar span{ position:absolute; width:40px; line-height:20px; top:0; right:-50px; color:#767676;}



/* 메인 롤링 배너*/
#intro { display:inline-block; position:relative; width:100%; margin:0 auto; border-bottom:#cccccc solid 1px; height:380px; background:url(../images/main/nprotect_nos_banner_bg.png) no-repeat bottom center; background-size:1300px 110px; 
 mix-height:100%; height:auto !important

}

#intro .rolling {display:block;width:1200px; height:100%; margin:0 auto;  }


#intro .main_banner { display:inline-block; position:relative; padding-top:100px; text-align:center;  font-family:Roboto   }

#intro .main_banner span { display:block; text-align:left }
#intro .text_sub { font-size:36px; color:#797979; font-weight:300; line-height:36px; padding-top:60px;}
#intro .text_tit { font-size:72px; color:#333333; font-weight:700; line-height:72px; }

#intro .orange { color:#f78f1e }

#intro button { background-color:#f78f1e; border:none; border-radius:22px; line-height:44px; padding:0 50px; font-size:18px; color:#FFF; font-family:Roboto  }

#intro button:hover,
#intro button:focus { background-color:#ff6803 }
#intro button:active { background-color:#824e2b }

.btn_submit { font-size:18px; padding:10px 40px  }