
/* performance calendar */
.performanceCalendar{ }
.performanceCalendar__category{display:flex; margin:0 0;}
.performanceCalendar__category li{font-size:16px; color:#010101; display:flex; align-items:center;}
.performanceCalendar__category li:not(:last-child){margin-right:30px;}
.performanceCalendar__category li::before{display:flex; width:25px; height:25px; border-radius:100%; justify-content:center; align-items:center; font-size:14px; font-weight:500; margin-right:10px;}
.performanceCalendar__category li.e::before{content:'교'; color:#fff; background:#328f0c;}
.performanceCalendar__category li.s::before{content:'장'; color:#fff; background:#0198FF;}
.performanceCalendar__category li.etc::before{content:'etc'; color:#fff; background:#EF6700;}

.performanceCalendar caption { position: absolute; left: -10000px;}


.performanceCalendar__info{margin:0 0 40px; display:flex; justify-content:center; align-items:center;}
.performanceCalendar__info button{display:block; text-indent:-9999px; overflow:hidden; width:25px; height:25px; background-color: #2c3e50;
    border:1px solid #2c3e50;  color:#fff; background-repeat:no-repeat; background-position:center center; border-radius: 5px;}



.performanceCalendar__info button.prev{margin-right:20px; background-image:url('/images/calendar/calendarIcon_06.png');}
.performanceCalendar__info button.next{margin-left:20px; background-image:url('/images/calendar/calendarIcon_09.png');}
.performanceCalendar__info select{font-size:20px; color:#010101; font-weight:600; border: 0; font-family: 'S-Core Dream 4'; }
.performanceCalendar__info select:nth-of-type(1){width:100px; margin-right:20px;}
.performanceCalendar__info select:nth-of-type(2){width:70px;}

.performanceCalendar__table{width:100%; table-layout:fixed;border:1px solid #e2e2e2; }
.performanceCalendar__table thead th{font-size:14px; color:#000; font-weight:600;  padding:5px 0;  border-left:1px solid #e2e2e2; border-right:1px solid #e2e2e2; background: #f3f3f3; }
.performanceCalendar__table thead th:nth-child(1){color:#ef0000;}
.performanceCalendar__table thead th:nth-child(7){color:#3d8bff;}
.performanceCalendar__table tbody td{padding:20px; vertical-align:top; height:195px; border-style:solid; border-color:#e2e2e2;}
.performanceCalendar__table tbody td:not(:last-child){border-width:1px 1px 1px 0;}
.performanceCalendar__table tbody td:last-child{border-width:1px 0;}
.performanceCalendar__table tbody tr:last-child td{border-bottom:0;}
.performanceCalendar__table tbody td .day{font-size:14px; color:#000; font-weight:600;}
.performanceCalendar__table tbody td:nth-child(1) .day{color:#ef0000;}
.performanceCalendar__table tbody td:nth-child(7) .day{color:#3d8bff;}


.performanceCalendar__table .item{margin-top:20px;}
.performanceCalendar__table .item li{display:flex; align-items: flex-start; position:relative;}
.performanceCalendar__table .item li:not(:last-child){margin-bottom:10px;}
.performanceCalendar__table .item li::before{display:flex; min-width:20px; height:20px; border-radius:100%; justify-content:center; align-items:center; font-size:11px; font-weight:500; margin-right:5px;}
.performanceCalendar__table .item li.e::before{content:'교'; color:#fff; background:#328f0c;}
.performanceCalendar__table .item li.s::before{content:'장'; color:#fff; background:#0198FF;}
.performanceCalendar__table .item li.etc::before{content:'etc'; color:#fff; background:#EF6700;}



.performanceCalendar__table .item li > a{ display:block; overflow:hidden; text-overflow:ellipsis; font-size:13px; color:#010101;}

.performanceCalendar__table .item li > a.active + .itemLayer{opacity:1; visibility:visible;}
.performanceCalendar__table .itemLayer{position:absolute; opacity:0; visibility:hidden; transition:all .4s; top:0; left:0; z-index:10; background:#f5f5f5; border:1px solid #adadad; padding:40px; width:350px; display:flex; flex-direction:column; box-shadow: 2px 2px 2px #adadad;}

.performanceCalendar__table td:nth-child(4) .itemLayer{left:-150px; right:0px;}
.performanceCalendar__table td:nth-child(n + 5) .itemLayer{left:auto; right:0;}

.performanceCalendar__table .itemLayer__close{margin-left:auto; display:block; width:20px; height:20px; background:url('/images/calendar/calendarIcon_15.png') no-repeat 0 0; text-indent:-9999px; overflow:hidden; position:absolute; top:20px; right:20px;}
.performanceCalendar__table .itemLayer__wrap{display:flex;}

.performanceCalendar__table .itemLayer__cont{flex:1; display:flex; flex-direction:column;}

.performanceCalendar__table .itemLayer__cont .category{display:flex; width:100px; height:25px; align-items:center; justify-content:center; font-size:13px; margin:0 0 15px;}
.performanceCalendar__table .e .itemLayer__cont .category{color:#fff; background:#328f0c;}
.performanceCalendar__table .s .itemLayer__cont .category{color:#fff; background:#0198FF;}
.performanceCalendar__table .etc .itemLayer__cont .category{color:#fff; background:#EF6700;}




.performanceCalendar__table .itemLayer__cont .subject{font-size:18px; color:#111; font-weight:600; letter-spacing:-0.03em;}
.performanceCalendar__table .itemLayer__cont .date{font-size:14px; color:#0099ff; font-weight:300; line-height:29px; margin-bottom: 20px;}
.performanceCalendar__table .itemLayer__cont a{display:flex; width:150px; margin:auto; height:30px; justify-content:center; align-items:center; background:#616161; border:1px solid #535353; font-size:14px; color:#ffffff;}

.performanceCalendar__list{border-top:1px solid #000; margin-top:20px; display:none;}
.performanceCalendar__list li{border-bottom:1px solid #ccc; padding:10px 0;}
.performanceCalendar__list li a{display:flex; align-items:center; overflow:hidden; text-overflow:ellipsis; padding:0 10px;}
.performanceCalendar__list li a::before{display:flex; min-width:25px; height:25px; border-radius:100%; justify-content:center; align-items:center; font-size:14px; font-weight:500; margin-right:10px;}
.performanceCalendar__list li.e a::before{content:'교'; color:#fff; background:#328f0c;}
.performanceCalendar__list li.s a::before{content:'장'; color:#fff; background:#0198FF;}
.performanceCalendar__list li.etc a::before{content:'etc'; color:#fff; background:#EF6700;}

.performanceCalendar__list li .itemLayer{display:none;}



@media screen and (max-width:1024px){

	
	.performanceCalendar__category li{margin-bottom:5px;}
}
@media screen and (max-width:768px){
	
	.performanceCalendar__table tbody tr:last-child td{border-bottom:1px solid #e2e2e2;}
	.performanceCalendar__table tbody td:not(:last-child),
	.performanceCalendar__table tbody td:last-child{border-width:1px;}
	.performanceCalendar__table tbody td{height:70px; padding: 15px}
	.performanceCalendar__table .item{width:20px; height:20px; display:flex; align-items:center; justify-content:center; overflow:hidden; margin:20px 0 0;}
	.performanceCalendar__table .item::before{content:''; display:block; width:5px; height:5px; background:#000; border-radius:100%;}
	.performanceCalendar__table .item li{display:none;}
	
	.performanceCalendar__list.active{display:block;}
		
		
	.performanceCalendar__table tbody td{height: 47px; padding: 8px 5px; text-align: center;}
	.performanceCalendar__table .item{margin-top: 10px; display: block;}
	.performanceCalendar__category li{font-size: 15px;}
	.performanceCalendar__category li::before{font-size: 11px; margin-right: 5px; width: 18px; height: 18px; letter-spacing: -0.04em;}
	.performanceCalendar__category li:not(:last-child){margin-right: 15px;}
	
	.performanceCalendar__table .item{height: auto; width: auto}
	.performanceCalendar__table .item::before{margin: 0 auto;}
	.performanceCalendar__table tbody td .day{line-height: 1;}
	.performanceCalendar__info select{font-size: 18px; padding-bottom: 5px;}
	.performanceCalendar__item{padding: 20px}
	.performanceCalendar__info{margin-bottom: 25px;}
	.performanceCalendar__info button{width: 20px; height: 20px}
	.performanceCalendar__info button.prev{margin-right: 15px;}
	.performanceCalendar__info button.next{margin-left: 15px;}
	.performanceCalendar__table thead th{padding-bottom: 15px;}
	.performanceCalendar__info select:nth-of-type(1){width: 95px}
	.performanceCalendar__table td.on{background: #fbf5af}
	
	
}



@media screen and (max-width:480px){
	.performanceCalendar__category li{ width:calc(100% / 2); margin:0 0 10px 0; text-align:center;}
	.performanceCalendar__category li:not(:last-child){margin-right:0;}
}
@media screen and (max-width:380px){
	.performanceCalendar__category li{align-items: center;}
	
}
.performanceCalendar__table tbody td{position: relative;}


.performanceCalendar__table tr td:nth-child(n+5) .sch-etc{left: auto; right: 0}
.performanceCalendar__table tr td:nth-child(n+5) .sch-etc:after{left: auto; right: 25px}
.performanceCalendar__table .sch-etc .itemLayer{left: 50%; margin-top: -1px;}
.performanceCalendar__table .sch-etc td:nth-child(n + 5) .itemLayer{}

