@charset "utf-8";

.megacast_wrap{ overflow: hidden; background:#f6f6f8; }

.event_tit { background:#fff; position:relative }
.event_tit h2{ padding:1rem; text-align:center; font-size: 1.4rem; color:#1677cb; border-bottom:0.1rem solid #1677cb; }
.event_tit .bt_sch {position: absolute;right: 1.5rem;display: inline-block;width: 1.3rem;top: 0.7em;}
.event_tit .bt_sch .ico_sch {width:2.0rem}

.event_selbox{ background:#fff; border-bottom: 0.1rem solid #e4e4e4; }
.event_selbox h3{display: inline-block;font-size:1.2rem;line-height: 3;color:#2082dd;margin:0 1rem}
.event_selbox a{display: inline-block;font-size:1.2rem;line-height: 3;margin:0 .4rem 0 0}
.event_selbox .on, .event_selbox a:hover{color:#2082dd;text-decoration: underline;}

.event_sbx{ display: -webkit-flex; display: flex; flex-wrap: wrap; padding:1rem; border: 0.1rem solid #e4e4e4; border-width:0.1rem 0 ; }
.event_sbx span{ -webkit-flex: 3.5; flex: 3.5; }
.event_sbx span .txd1{color:#1677cb;}
.event_sbx .txd2{ flex: none; display: block; width:100%; color:#f34d51;}
.event_sbx .sel_st2{ -webkit-flex: 1; flex: 1; background-color:#fff;margin:0 0.1rem }
.event_sbx2 span{flex:3}
.event_sbx2 .sel_st2{flex:1.5}

.megacast_cast2{ overflow:hidden;  }
.megacast_cast2>li{ background:#fff; padding:1.3rem 0; border-bottom:1px solid #e4e4e4;}
.megacast_cast2>li a{display: flex;}
.event--pic{width:43.6%; display: flex;align-items: center;justify-content: flex-end;}
.event--pic img{ width:calc(100% - 1.3rem);}
.event--ath{ width:56.4%;padding:0 1.3rem 0 1rem;box-sizing: border-box; display: flex;flex-flow:column;justify-content:center;font-size:.8rem}
.event--ath li{margin-bottom: 2%;}
.event--ath .icon{display:inline-block;color:#fff;padding:0 .4rem;margin-right: 0.2rem;}
.event--ath .icon1{background: #f34d51;}
.event--ath .icon2{background: #333333;}
.event--ath .icon3{background: #1162db;}
.event--ath .txt{display:inline-block;}
.event--ath .txt1{color:#3fd1ca}
.event--ath .txt2{color:#9b4ce3}
.event--ath .txt3{color:#ee4495}
.event--ath .txt4{color:#fb9a10}
.event--title{font-size:1rem;font-weight: bold;line-height: 1.3;}
.event--ath .event--name{margin-bottom: 0;color: #666;}
.event--ath .event--etc{color:#8d8d8d;letter-spacing: -0.05rem;}



.megacast-more_btn{  padding:1.3rem; background:#fff; text-align:center;  } 
.megacast-more_btn a{ display:block; padding:1rem 0; font-weight:bold; }

/* Media Query ################################################################################*/
@media screen and (max-width:360px) {
  /* CSS for screens that are 320 pixels or less will be put in this section */
}

@media screen and (min-width:360px) and (max-width:640px) {
  /* for screens that are at least 320 pixels wide but less than or equal to 640 pixels wide */
}
@media screen and (orientation:portrait) {
  /* ... */
}

@media screen and (orientation: landscape) {
  /* ... */
}