@charset "utf-8";

#schdulMain{height:100%;}
.scheduleMain{height:100%;}
.scheduleMain .topWrap{display:flex;align-items:center;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid #DDD;}
.scheduleMain h2{font-size:25px;line-height:1;font-family:'Noto Medium';}
.scheduleControl{}
.monthDate{display:flex;align-items:center;justify-content:space-between;}
.monthDate span{line-height:0;}
.monthDate a{display:block;text-indent:-9999px;width:30px;height:30px;border-radius:100%;background:url(/sites/style_guide/images/common/arrow_3_b.png) no-repeat center;}
.monthDate a.pre{transform:rotate(180deg);}
.monthDate a.next{}
.scheduleScroll{}
ul.event{overflow-y:auto;height:100px;}
ul.event li{position:relative;padding-left:15px;}
ul.event li:nth-child(n+6){}
ul.event li:before{content:"";display:block;background:#8feeff;border-radius:100%;width:6px;height:6px;position:absolute;left:0;top:13px;}
ul.event li dl{overflow:hidden;font-size:16px}
ul.event li dl dt{color:#dee9f8;float:left;width:165px;}
ul.event li dl dd{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;float:left;width:calc(100% - 165px);}
.scheduleMain a.more{display:block;width:40px;height:40px;text-indent:-9999px;background:url(../images/plus_1_w.png) no-repeat center;position:absolute;top:27px;left:140px;}
.scheduleMain a.more:hover{background:url(../images/plus_1_s.png) no-repeat center;}
.scheduleMain .noData{text-align:center;}

@media only screen and (max-width:1280px){
	ul.event{height:195px;}
	ul.event li{padding-bottom:10px}
	.scheduleMain a.more{top:16px;left:125px;}
}
@media only screen and (max-width:1024px){
	ul.event{height:205px;}
}
@media only screen and (max-width:768px){
	.scheduleMain .topWrap{flex-wrap:wrap;}
	.scheduleMain h2{width:100%;text-align:center;}
	.scheduleControl{width:100%;}
	.monthDate{justify-content:center;margin-top:15px;width:100%;}
	.scheduleMain a.more{left:110px;}
	ul.event{height:95px;}
	ul.event li{padding-bottom:0}
}
@media only screen and (max-width:380px){
	.scheduleMain a.more{left:95px;top:14px}
	ul.event li dl{font-size:14px}
	ul.event li dl dt{width:140px}
	ul.event li dl dd{width:calc(100% - 140px)}
}
@media only screen and (max-width:320px){
	ul.event li dl dt,
	ul.event li dl dd{float:none;width:100%}
}