@charset "utf-8";

.floatnone { float: none; vertical-align: middle; margin-bottom:2px;}
.calender { position:relative; margin:0 auto; padding:0; font-size:0; font-family:"Noto Sans Korean Regular", "Noto Sans Korean Bold" !important; }
.yearView { position:relative; width:100%; margin:0; padding:0; font-size:30px; color:#333333; font-weight:bold; text-align:center;}
.yearSelect { position:relative; width:100%; color:#aaa; font-size:0; line-height:1.6; text-align:right; }
.yearSelect select { position:relative; width:123px; height:32px; font-size:14px; border:1px solid #d0d0d0; border-radius:5px; box-sizing:border-box; padding:0 0 0 10px; margin:0 2px 0 0; display:inline-block; }
.yearSelect .btnType { position:relative; width:123px; height:32px; font-size:14px; background-color:#4689d9; border-radius:5px; box-sizing:border-box; margin:0 0 0 2px; padding:0; color:#fff; cursor:pointer; box-sizing:border-box; vertical-align:middle; padding:0; display:inline-block; text-align:center; vertical-align:top; line-height:2.4;} 

.calWrap { position:relative; width:100%; margin-top:30px !important; margin:0; padding:0;}
.calWrap > ul { position:relative; width:100%; border:1px solid #d0d0d0; margin:0; padding:0;}
.calWrap > ul > li { position:relative; width:100%; margin:0; padding:0; display:flex;color:#666; min-height:150px;}
.calWrap > ul > li > p { position:relative; width:calc(100%/7) !important; min-height:150px; border-right:1px solid #d0d0d0; border-bottom:1px solid #d0d0d0; box-sizing:border-box; margin:0; padding:0;}
.calWrap > ul > li > p > span { position:relative; color:rgba(97,97,97,0.4); width:100%; display:inline-block;}
.calWrap > ul > li > p > span:first-child { padding:10px;}


.calWrap > ul > li:last-child > p { border-bottom:0;}

.calWrap > ul > li > p:last-child { border-right:0; }

.calWrap > ul > li > p:last-child > span { color:rgba(32,107,210,0.4);}
.calWrap > ul > li > p:first-child > span { color:rgba(220,26,26,0.4);}

.calWrap > div { position:relative; width:100%; margin:0; padding:0; display:flex; color:#666;}
.calWrap > div > p { position:relative; width:calc(100%/7) !important; box-sizing:border-box; margin:0; color:rgba(97,97,97,1); font-weight:600; height:38px !important; }
.calWrap > div > p > span { width:100%; margin-left:5px; font-weight:400; color:rgba(97,97,97,0.4);}

.calWrap > div > p:last-child { color:rgba(32,107,210,1);}
.calWrap > div > p:last-child > span {  margin-left:5px; }

.calWrap > div > p:first-child { color:rgba(220,26,26,1);}
.calWrap > div > p:first-child > span { margin-left:5px; }


.calWrap > div > p:last-child > span { color:rgba(32,107,210,0.4);}
.calWrap > div > p:first-child > span { color:rgba(220,26,26,0.4);}


.today > span { color:#202020 !important; font-weight:600;}

/*행사등록*/
.event { position:relative; box-sizing:border-box; z-index:10; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.gray { background:url(../images/gray.jpg) left top no-repeat; background-color:#f7f7f7; color:rgba(105,105,105,1) !important; cursor:pointer; }
.ctnG { background-color:#f7f7f7; color:rgba(105,105,105,0.5) !important;}

.green { background:url(../images/green.jpg) left top no-repeat; background-color:#edfcf9; color:rgba(35,177,140,1) !important; cursor:pointer;}
.ctnGr { background-color:#edfcf9; color:rgba(35,177,140,0.5) !important;}

.puple { background:url(../images/puple.jpg) left top no-repeat; background-color:#f4f4ff; color:rgba(106,107,199,1) !important; cursor:pointer;}
.ctnP { background-color:#f4f4ff; color:rgba(106,107,199,0.5) !important;}

.red { background:url(../images/red.jpg) left top no-repeat; background-color:#ffebec; color:rgba(218,96,95,1) !important; cursor:pointer;}
.ctnR { background-color:#ffebec; color:rgba(218,96,95,0.5) !important;}

.yellow { background:url(../images/yellow.jpg) left top no-repeat; background-color:#fff9e9; color:rgba(222,177,96,1) !important; cursor:pointer;}
.ctnY { background-color:#fff9e9; color:rgba(222,177,96,0.5) !important; }

/*레이어팝업*/
.shardLayer { position:fixed; left: 0; top: 0; right: 0; bottom: 0; background-color:transparent; z-index:100;}
.shardLayer .shardBox {position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; height:391px; box-shadow:5px 5px 20px #aaa; width:357px; overflow: auto; text-align:center; background-color:#4689d9;}
.shardLayer .shardBox .date { position:relative; float:left; width:357px; height:80px; color:#fff; text-align:center; font-size:28px; padding-top:5px; box-sizing:border-box;}
.shardLayer .shardBox .date > p { margin:0; padding:0; font-size:14px;}
.shardLayer .shardBox .dateView { position:relative; clear: both;width:327px; margin: 0 auto; height:260px; padding:15px; background-color:#fff; box-sizing:border-box; text-align:left; line-height:1.6; font-size:14px; color:#444;}
.shardLayer .shardBox .closeBox { position:relative; float:left; width:357px; text-align:center; color:#fff; font-size:15px;}
.shardLayer .shardBox .closeBox p { position:relative; width:30px; border:1px solid #fff; display:inline-block; padding: 2px 10px; cursor:pointer; font-size: 13px;}


@media (min-width:600px){
	.yearSelect { text-align:right; }
	.yearSelect select { position:relative; width:80px; height:32px; font-size:12px;}
	.yearSelect .btnType { position:relative; width:60px; height:32px; font-size:12px;}
	
	.calWrap > ul > li { font-size:14px; min-height: 50px;}
	.calWrap > ul > li > p { min-height: 50px;}
	.calWrap > ul > li > p > span { font-size:18px;}
	
	.calWrap > ul > li > p:last-child > span { font-size:18px;}
	.calWrap > ul > li > p:first-child > span { font-size:18px;}
	.calWrap > div { font-size:14px; height:42px !important;}
	.calWrap > div > p { font-size:15px; padding:12px;}
	.calWrap > div > p > span { font-size:12px;}
	.calWrap > div > p:last-child > span { font-size:12px;}
	.calWrap > div > p:first-child > span { font-size:12px;}	
	.calWrap > ul > li > p > span:first-child { padding:10px;}
	
	.event { font-size:14px !important; padding-left:12px; height:34px; line-height:2.5;}
	
}

@media (max-width:600px){
	.yearSelect { text-align:center; }
	.yearSelect select { position:relative; width:80px; height:32px; font-size:12px;}
	.yearSelect .btnType { position:relative; width:60px; height:32px; font-size:12px;}

	.calWrap > ul > li { font-size:12px; min-height: 50px;}
	.calWrap > ul > li > p { min-height: 50px;}
	.calWrap > ul > li > p > span { font-size:13px;}
	
	.calWrap > ul > li > p:last-child > span { font-size:13px;}
	.calWrap > ul > li > p:first-child > span { font-size:13px;}
	.calWrap > div { font-size:13px; height:22px !important; padding-left:5px;}
	.calWrap > div > p { font-size:13px; }
	.calWrap > div > p:last-child > span { font-size:12px;}
	.calWrap > div > p:first-child > span { font-size:12px;}
	.calWrap > ul > li > p > span:first-child { padding:5px;}
	
	.event { font-size:11px !important; padding-left:5px; height:24px; line-height:2.2;}
	
}