@charset "utf-8";

#overlay{background:rgba(255,255,255,.3) 50% 50% no-repeat;color:#fff;position:absolute;height:100%;width:100%;z-index:99999999;top:0;left:0;float:left;text-align:center;padding-top:25%;opacity:1.0;}
	
/* 달력 */
#calendarT{position:relative;text-align:center}
#calendarT dl{background-color:#777}
#calendarT dt{display:inline-block;width:18%}
#calendarT dd {display:inline-block;clear:both;width:80%}
#calendarT dd li{display:inline-block;width:8.3%}
#calendarT dd li a{display:block;padding:10px 0;line-height:40px;display:block;color:#fff}
#calendarT dd li.current{background-color:#ffa80a}
#calendarT select{max-width:150px;width:100%;padding:0 25px 0 10px;background-color:#fff;line-height:35px}
#calendarT .calendarTdate{float:left;width:100px;padding:0 20px 0 0;font-size:1.5em;font-weight:600;color:#000}
#calendarT .calendarPrevBtn,#calendarT .calendarNextBtn,#calendarT .calendarTdate span{display:block}
#calendarT .calendarTdate span{padding:20px 0}
#calendarT .calendarPrevBtn,#calendarT .calendarNextBtn{display:inline-block;width:30px;height:30px;margin:5px 0;border-radius:50%;background-color:#6cc067;color:#fff;text-align:center;line-height:27px}
#calendar{float:left;width:calc(100% - 100px);font-size:14px}
#calendar table{height:330px}
#calendar th,#calendar td{width:14%;border:1px solid #ddd;}
#calendar td{background:#fff;vertical-align:middle}
#calendar thead th{padding:5px;font-weight:700;color:#333;text-align:center}
#calendar thead .closed{background-color:#fff;color:#ff5500}
#calendar .tdWrap{padding:10px}
#calendar .closed{background-color:#fafafa;color:#aaa}
#calendar .day{display:inline-block;width:30px;color:#333}
#calendar .closed .day{color:#aaa}
#calendar .state{display:inline-block;width:calc(100% - 35px)}
#calendar .state a{display:block;padding:5px 3px 7px 3px;border-width:1px;border-style:solid;border-radius:5px;text-align:center}
#calendar .state a br{display:none}
#calendar .stateBtnw{border-color:#ddd;background-color:#eee;color:#aaa}
#calendar .stateBtne{border-color:#ffa80a;background-color:#fff;color:#fe5e01}
#calendar a.stateBtni{border-color:#ff8f00;border-bottom:3px solid #e77800;background-color:#ffa80a;color:#fff}
.hand{cursor:hand}

@media screen and (max-width:1100px){
	#calendar .day{width:25px}
	#calendar .state{width:calc(100% - 30px)}
}
@media screen and (max-width:1000px){
	#calendarT .calendarTdate{width:80px}
	#calendar{width:calc(100% - 80px);font-size:13px}
	#calendar .tdWrap{padding:5px}
}
@media screen and (max-width:900px){
	#calendar .day{width:25px}
	#calendar .state{width:calc(100% - 25px)}
}
@media screen and (max-width:800px){
	#calendarT select{width:90%;line-height:25px}
	#calendar{font-size:12px}
	#calendar .state a{padding:1px 2px 4px 2px;line-height:1.2em}
	#calendar .state a br{display:block}
}
@media screen and (max-width:768px){
	#calendar{font-size:11px}	#calendar .day{width:20px}
	#calendar .state{width:calc(100% - 20px)}
}
@media screen and (max-width:620px){
	#calendarT .calendarTdate{width:70px}
	#calendar{width:calc(100% - 70px)}
	#calendar .tdWrap{padding:2px}
}
@media screen and (max-width:550px){
	#calendar .day{width:15px}
	#calendar .state{width:calc(100% - 15px)}
	#calendar .state .state_hidden{display:none}
}
@media screen and (max-width:480px){
	#calendarT .calendarTdate{float:none;width:100%;margin-top:-10px;padding-bottom:10px;text-align:center}
	#calendar{float:none;width:100%}
	#calendarT .calendarPrevBtn,#calendarT .calendarNextBtn,#calendarT .calendarTdate span{display:inline-block}
	#calendarT .calendarTdate span{padding:0}
	#calendarT .calendarPrevBtn,#calendarT .calendarNextBtn{width:20px;height:20px;margin:0 10px;line-height:17px}
	.calendarTdate span br{display:none}
}
@media screen and (max-width:360px){

}