 

/* 인덱스 롤링 - 큰화면 ===================================  */
@media (min-width:769px){   
	.div_S1 {background: linear-gradient(135deg, #75d446 0%, #4bcea4 100%);}
	.div_S2 {background: linear-gradient(135deg, #4bcea4 0%, #75d446 100%);}

	.bx_cntr {width:1000px; margin:0 auto; overflow:hidden;}

	.bx_t {padding:0 0 0 0; position:absolute;}
	.bx_t1 {font-size:70px; color:#fff;}
	.bx_t2 {font-size:25px; color:#fff; line-height:28pt;}
	/*.bx_t3 {font-size:15px; color:#fff; opacity:0.5;}*/
	.bx_t3 {font-size:15px; color:#0d7352; font-weight:bold;}
	.bx_img {float:right;} 

	.pagetop_title {font-size:60px; font-weight:bold; color:#fff; padding:0 0 10px; text-shadow: 2px 2px 2px #4bcea4;}
	.pagetop_tip {font-size:18px; color:#fff; opacity:0.7; }

	.CNTR2 { width:50%; }
} 

 
/* 인덱스 롤링 - 작은화면 ===================================  */
@media (max-width:768px){ 

	.div_S1 {background: linear-gradient(135deg, #4bcea4 0%, #75d446 100%);height:420px;}
	.div_S2 {background: linear-gradient(135deg, #4bcea4 0%, #75d446 100%);height:420px;}

	.bx_t {text-align:center; padding:0 0 0 0;}
	.bx_t1 {font-size:36px; color:#fff;}
	.bx_t2 {font-size:18px; color:#fff; line-height:20pt;}
	.bx_t3 {display:none;}


	.bx_img img {width:350px; margin:-20px auto;}
	.bx_img2 img {height:60px; }

	.pagetop_title {font-size:45px; font-weight:bold; color:#fff; padding:0 0 10px; text-shadow: 2px 2px 2px #4bcea4;}
	.pagetop_tip {font-size:15px; color:#fff; opacity:0.7; }
	
	.CNTR2 { width:100%; }
}






/* 모바일 - 세로 =================================== */
@media (max-width:479px){   
	/*
	#mobile {width:100%; height:100vh; background-color:#cfcbe5;}
	#tablet {display:none;}
	#pc {display:none;}
	.CNTR { width:320px;  display:block; margin: 0 auto; }	
	*/
	.CNTR { width:98%; display:block; margin: 0 auto; }	
	.CNTR50 { width:98%; }
	.INPUT_TOP {width:200px;} /* 상단 서치박스 */
	.TOP_NENU_BIG {display:none;}
	.TOP_NENU_SMALL {width:100%;}
	#MAIN_NENU {display:none;}
 
	
}


/* 모바일 - 세로 =================================== */
@media (min-width:480px) and (max-width:639px){  
	/*
	#mobile {width:100%; height:100vh; background-color:#cfcbe5;}
	#tablet {display:none;}
	#pc {display:none;}
	.CNTR { width:480px;  display:block; margin: 0 auto; }	
	*/
	.CNTR { width:98%; display:block; margin: 0 auto; }	
	.CNTR50 { width:98%; }
	.INPUT_TOP {width:200px;} /* 상단 서치박스 */
	.TOP_NENU_BIG {display:none;}
	.TOP_NENU_SMALL {width:100%;}
	#MAIN_NENU {display:none;}
	
 
}


/* 모바일 - 가로 =================================== */
@media (min-width:640px) and (max-width:767px){  
	/*
	#mobile {width:100%; height:100vh; background-color:#cfcbe5;}
	#tablet {display:none;}
	#pc {display:none;}
	*/
	.CNTR { width:640px; text-align:center; display:block; margin: 0 auto; }	
	.CNTR50 { width:320px; }
	.INPUT_TOP {width:300px;} /* 상단 서치박스 #MAIN_NENU {display:none;}*/
	.TOP_NENU_BIG {width:100%;}
	.TOP_NENU_SMALL {display:none;}
 
	
}


/* 테블릿 =================================== */
@media (min-width:768px) and (max-width:1024px){  
	/*
	#mobile {display:none;}
	#tablet {width:100%; height:60vh; background-color:#bdd7c0;}
	#pc {display:none;}
	*/
	.CNTR { width:768px; text-align:center; display:block; margin: 0 auto; } 
	.CNTR50 { width:384px; }
	.INPUT_TOP {width:350px;} /* 상단 서치박스 */
	.TOP_NENU_BIG {width:100%;}
	.TOP_NENU_SMALL {display:none;}
 
}


/* pc =================================== */
@media (min-width:1025px){  
	/*
	#mobile {display:none;}
	#tablet {display:none;}
	#pc {width:100%; height:50vh; background-color:#faedc0;}
	*/
	.CNTR { width:1000px; text-align:center; display:block; margin: 0 auto; }
	.CNTR50 { width:500px; } 
	.TOP_NENU_BIG {width:100%;}
	.TOP_NENU_SMALL {display:none;}
	 
}



/*
	가로 중앙정렬을 하고 싶은 DIV에 넣는다  display:block; margin: 0 auto;
*/

.ROW_BLOCK{ text-align:center; display:block; margin: 0 auto; }

.IMG{
	overflow : hidden;
}
.EIMG{
	display : block;
	max-width : 100%;
}


/* 메인페이지 데이타서머리 영역 ================== */
.tot_data {
	display : inline-block;
	width : 250px;
}


/* 최상단메뉴 영역 */
.TOPbar{width:100%; text-align:center; position:relative; overflow:hidden; } 
/*
.topbar .pc{ position:absolute; float:left; display:block; top:17px; left:15px;} 
.M_header .logo{  display:block; margin:5px auto;} 
.M_header .logout{ position:absolute; float:right;  display:block; top:17px; right:10px;}  
*/
.TOPbar .TOP_fav{ display : inline-block;  float:left;  background-color:#aaaaaa;} 
.TOPbar .TOP_left{ display : inline-block;  float:right;  background-color:#aaaaaa;} 



.item {
	background-color:#bbbbbb;
	display : inline;
	border : 1px solid;
}
.item2 {
	background-color:#dddddd;
	display : inline-block;
	border : 1px solid;
	width : 200px;
	height : 100px;
}















/* 폼요소들 ================== */

.input_basic {
	color: #000000; /* 폰트색 */
	font-size: 16px; /* 폰트크기 */
	padding:6px;
	height:40px;
	width:96%;
	border: 1px solid #D3D9E0;  /* 테두리 */
	background-color: #FBFBFD;  /* 배경색깔 */ 
}

.input_rsv {
	color: #000000;
	font-size: 14px;
	padding:4px;
	border: 1px solid #CECECE;  /* 테두리 */
	width:100px; height:30px; 

	/* 
	background:url('input_bg.jpg') no-repeat; 
	*/
}
.input_rsv_none {
	color: #000000;
	font-size: 12px;
	padding:8px; 
	width:150px; height:30px; 
}

.input_rsv_none40 {
	color: #000000;
	font-size: 12px;
	padding:10px;
	border: 0px;  
	background-color: #FBFBFD; 
	width:40px; height:30px; 
} 

.input_f10 {
	color: #000000; /* 폰트색 */
	font-size: 10px; /* 폰트크기 */
}

.input_f11 {
	color: #000000; /* 폰트색 */
	font-size: 11px; /* 폰트크기 */
}
.input_f11_DATE {
	color: #000000; /* 폰트색 */
	font-size: 11px; /* 폰트크기 */
	width:65px;
}
 
.input_f12 {
	color: #000000; /* 폰트색 */
	font-size: 12px; /* 폰트크기 */
}

.input_readonly {
	border: 1px solid #cccccc;  /* 테두리 */
	background-color: #eeeeee;  /* 배경색깔 */
}

.login_input {
	color: #1B3243;
	font-size: 14px;
	font-weight:bold;
	width:120px;
	height:22px;
}


/* 인풋박스 넘버형에서 화살표 지우기 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;    
	margin: 0;
}
 
.div_radius{border-radius:5px 10px 15px 20px;}
 


/* 스판류들 ================== */
.span_popinfo {
	color:#555555; 
	line-height: 200%; 
	border:#555555 1px solid; 
	padding:2px 5px; border-radius:5px 5px;
}


/* 체크박스 ================  */
.wrap-btnToday {position:relative; margin-top:10px; margin-left:10px; text-align:left; cursor:pointer; overflow:hidden;}
.wrap-btnToday input.form-inputPop {position:absolute; top:0; left:0; opacity:0; cursor:pointer; z-index:5;}
.wrap-btnToday i {float:left; display:block; width:20px; height:20px; background:url(./images/chkbox_blue20.png)no-repeat left top; z-index:3;}
.wrap-btnToday label {float:left; margin-left:10px; cursor:pointer;}
.wrap-btnToday input.form-inputPop:checked+i {background-position:left bottom;}
/* .wrap-btnToday input.form-inputPop:checked+i+label {color:#f56592;}  체크시 폰트색 변경 */




/* go top 버튼*/
.go-top{
	display:block;
	width:40px;
	height:40px;
	line-height:35px;
	text-align:center;
	font-size:30px;
	position:fixed;
	bottom:-40px;
	right:20px;
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
	background-color:#df9302; /* background-color:#404040; */
	color:#FFFFFF;
	text-decoration:none;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

.go-top.show{
	bottom:20px;
}

.go-top:hover{
	background-color:#7c5101; /* background-color:#5DBA9D; */
	color:#FFFFFF;
}
 
 
/* 마우스오버 이미지 확대 ================  */
	.scale_image img {
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-ms-transform:scale(1);	
		-o-transform:scale(1);	
		transform:scale(1);
		-webkit-transition:.3s;
		-moz-transition:.3s;
		-ms-transition:.3s;
		-o-transition:.3s;
		transition:.3s;
	}
	.scale_image:hover img {
		-webkit-transform:scale(1.2);
		-moz-transform:scale(1.2);
		-ms-transform:scale(1.2);	
		-o-transform:scale(1.2);
		transform:scale(1.2);
	} 
	.scale_image { overflow: hidden; } 
