@charset "utf-8";

.main_schedule_grad1 {display:block;box-sizing:border-box;position:relative;text-align:left; padding: 55px 7%; background: #23262F url("../images/main_schedule_bg.jpg") no-repeat right bottom;}

.main_schedule_grad1 .schedule-title {float: left;}
.main_schedule_grad1 h2{display: inline-block; vertical-align: middle; font-size:60px;line-height:1;letter-spacing: -0.25px; font-family: "TitilliumWeb-Bold"; color: #fff;}
.main_schedule_grad1 h2 i{font-style:italic;}

.main_schedule_grad1 .scheduleControl{float: right; overflow: hidden; margin: 13px 0 25px;}
.main_schedule_grad1 .scheduleControl .monthDate a{float: left; display:block;text-indent:-9999px;width:6px;height:36px;border-radius:100%;}
.main_schedule_grad1 .scheduleControl .monthDate a.prev{background:url(../images/btn_schedule_prev.png) no-repeat center;}
.main_schedule_grad1 .scheduleControl .monthDate a.next{background:url(../images/btn_schedule_next.png) no-repeat center;}
.main_schedule_grad1 .scheduleControl .monthDate a:hover{background-color:rgba( 0,0,0,0.2 );}
.main_schedule_grad1 .scheduleControl .monthDate > span{float: left; display:block;line-height:1;font-family:'Noto DemiLight';font-size:26px;color:#fff; margin: 0 20px;}
.main_schedule_grad1 .scheduleControl .monthDate span .num {font-size: 36px; font-family:'S-CoreDream-4Regular';}


.main_schedule_grad1 .scheduleScroll ul.event{overflow-y:auto;height:350px;}
.main_schedule_grad1 .scheduleScroll ul.event::after {content: ""; display: block; clear: both;}
.main_schedule_grad1 .scheduleScroll ul.event li{position:relative; float: left; padding: 15px 0; width: 50%;}
.main_schedule_grad1 .scheduleScroll ul.event li dl{overflow:hidden;font-size:16px}
.main_schedule_grad1 .scheduleScroll ul.event li dl dt{color:#dee9f8;float:left; width: 55px;}
.main_schedule_grad1 .scheduleScroll ul.event li dl dt .day-icon {width: 55px; height: 55px; line-height: 55px; text-align: center; border-radius: 50%; background: rgba(255, 255, 255, 0.1); font-family:'S-CoreDream-5Medium'; font-size: 24px; color: #fff;}
.main_schedule_grad1 .scheduleScroll ul.event li dl dd{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;float:left;width:calc(100% - 55px); box-sizing: border-box; padding-left: 3%; font-family: "TitilliumWeb-Light"; font-size: 18px; color: #fff;}
.main_schedule_grad1 .scheduleScroll ul.event li dl dd p {font-family: "Noto Light"; letter-spacing: -0.5px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.main_schedule_grad1 .scheduleScroll ul.event li p.noData{text-align:center; color: #fff;}
.main_schedule_grad1 .scheduleScroll ul.event li.noData {width: 100%;}

.main_schedule_grad1 a.view_more_schedule{display: inline-block; vertical-align: middle; width:50px;height:50px;text-indent:-9999px;background:url(../images/btn_schedule_more.png) no-repeat center; border: 2px solid rgba(255, 255, 255, 0.25); border-radius: 50%; margin-left: 30px;}
.main_schedule_grad1 a.view_more_schedule:hover{}

@media only screen and (max-width:1280px){
	.main_schedule_grad1 h2{}
	.main_schedule_grad1{padding-left:30px;}

	.main_schedule_grad1 .scheduleScroll ul.event li{padding-bottom:10px}
	.main_schedule_grad1 a.view_more_schedule{top:16px;left:125px;}
}
@media all and (max-width: 1200px){
	.main_schedule_grad1 .scheduleScroll ul.event {height: auto; max-height: 350px;}
}

@media only screen and (max-width:1024px){
	.main_schedule_grad1 h2 {font-size: 48px;}
	.main_schedule_grad1{display:block;width:100%;}
	.main_schedule_grad1 .scheduleControl{top:25px;}

}

@media all and (max-width: 767px){
	.main_schedule_grad1 {padding: 30px 7%; padding-left: 30px;}
	.main_schedule_grad1 .scheduleScroll ul.event {max-height: 200px;}
	.main_schedule_grad1 .scheduleScroll ul.event li {float: none; width: 100%;}
	.main_schedule_grad1 .schedule-title {float: none;}
	.main_schedule_grad1 h2 {font-size: 40px;}
	.main_schedule_grad1 .scheduleControl {float: none; margin: 10px 0;}
	.main_schedule_grad1 .schedule-title {position: relative;}
	.main_schedule_grad1 a.view_more_schedule {position: absolute; width: 40px; height: 40px; top: 0; left: auto; right: 0; background-size: 20px auto;}
	.main_schedule_grad1 .scheduleControl .monthDate > span {font-size: 23px;}
	.main_schedule_grad1 .scheduleControl .monthDate span .num {font-size: 30px;}
}

@media only screen and (max-width:730px){

}
@media only screen and (max-width:380px){

}
@media only screen and (max-width:320px){

}
