@charset "utf-8";
body:before{
	background:none;
}
#pagetop{
	max-width:100%;
	min-width:1210px;
}
.content_wrap{
	width:90%;
	max-width:1420px;
	margin:0 auto;
	float:none;
	padding:168px 0 60px;
	
}
.content_wrap.month{
	padding:100px 0 60px;
}
.nav_box{
	width:280px;
	padding:0 0;
	top:50%;
	left:-280px;
	transform:translate(0, -50%);
	filter:drop-shadow(0px 5px 15px rgba(0, 0, 0, 0.35));
	overflow:visible;
}

.nav_box .menu_wrap{
	padding:15px 20px;
}

.nav_box .menu_area{
	padding:20px 0;
	height:485px;
	background:url(../images/bg_common_1.jpg);
	background-repeat:repeat;
	overflow-y:scroll;
}
.nav_box .sns_list{
	border-top:1px solid #000;
	padding-top:20px;
}
.nav_box .pc_menu_btn{
	width:48px;
	height:485px;
	position:absolute;
	top:0;
	right:-48px;
	cursor:pointer;
}
.nav_box .pc_menu_btn span{
	display:block;
	width:100%;
}
.nav_box .pc_menu_btn .btn_close{
	display:none;
}
@media screen and (max-width: 767px){
	body:before{
		height:40px;
		background-size:767px;
		background-position:10% 0;
	}
	#pagetop{
		min-width:auto;
		padding-top:150px;
	}
	.content_wrap{
		width:100%;
		padding:40px 0 60px;
	}
	.content_wrap.month{
		padding:0 0 60px;
	}
	
	.nav_box{
		width:100%;
		height:100px;
		padding:40px 0 10px;
		filter:drop-shadow(0px 5px 15px rgba(0, 0, 0, 0));
		top:0;
		left:0;
		bottom:auto;
		transform: translate(0, 0);
	}
	
	.nav_box .menu_wrap{
		padding:0;
	}
	.nav_box .menu_area{
		padding:0;
		top:90px;
	}
	
}
/*********************
	.tt_header
*********************/
.tt_header_wrap{
	width:100%;
	height:100px;
	margin:0 auto;
	border-bottom:1px solid #333;
	position:fixed;
	top:0;
	left:0;
	z-index:4;
	background-image:url(../images/timetable/bg_timetable_header.jpg);
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-size:cover;
}

.tt_header{
	width:96%;
	max-width:1680px;
	min-width:1080px;
	margin:0 auto;
	padding-top:25px;
	box-sizing:border-box;
}
.tt_header .head_logo{
	width:200px;
	float:left;
	margin-right:50px;
}
.tab_area{
	width:540px;
	float:left;
	margin-right:20px;
	display:flex;
}
.tab_area .ttl{
	padding:5px 20px;
	font-size:2.4rem;
	font-weight:bold;
	border-right:1px solid #333;
}
.tab_area .tab{
	width:180px;
	height:44px;
	line-height:44px;
	text-align:center;
	background:#333;
	border-radius:50vh;
	color:#fff;
	font-size:1.6rem;
	font-weight:bold;
	margin-left:20px;
	cursor:pointer;
}
.tab_area .tab.active{
	background:#882111;
}
.tt_header .pc_modal_search_btn{
	width:230px;
	float:right;
}
.tt_header .pc_modal_search_btn:hover{
	cursor:pointer;
}
@media screen and (max-width: 767px){
	.tt_header_wrap{
		background-position:70% 0%;
		background-size:240%;
	}
	.tt_header{
		width:100%;
	}
	.nav_box .tab_wrap{
		width:100%;
		margin:0 auto;
		
	}
	.nav_box .tab_area{
		width:100%;
		margin:0 auto;
		border-top:1px solid #333;
		padding:10px 0;
	}
	.tab_area .ttl{
		font-size:1.4rem;
		padding:3px 10px 3px 10px;
	}
	.tab_area .tab{
		width:100px;
		height:26px;
		line-height:26px;
		font-size:1.2rem;
		margin-left:10px;
	}
}

/*******************************
	.main_area,
*******************************/

.main_area{
	width:100%;
	margin:0 auto 100px;
}


.btn_modal_bk_open{
	display:none;
	width:150px;
	padding-left:30px;
	box-sizing:border-box;
	font-size:1.4rem;
	font-weight:bold;
	position:relative;
	margin-left:calc(100% - 150px);
	margin-bottom:20px;
	margin-top:-10px;
}
.btn_modal_bk_open:hover{
	cursor:pointer;
	color:#882111;
	transition:.3s;
}
.btn_modal_bk_open:before{
	display:block;
	content:"";
	width:21px;
	height:21px;
	background-image:url("../images/ico_bkn.png");
	background-repeat:no-repeat;
	background-size:100%;
	position:absolute;
	top:0;
	left:0;
}


.timetable_wrap{
	width:100%;
	margin:0 auto;
	padding:40px 20px 20px;
	box-sizing:border-box;
	background:#fff;
	border-radius:0 0 20px 20px;
}

.timetable_box{
	display:none;
	width:100%;
	margin:0 auto;
}
.timetable_box.active{
	display:block;
}
@media screen and (max-width: 767px){



	.btn_modal_bk_open{
		width:100px;
		padding-left:18px;
		font-size:1.0rem;
		margin-left:calc(100% - 100px);
	}
	.btn_modal_bk_open:before{
		width:14px;
		height:14px;
	}
	
	.timetable_wrap{
		border-radius:0;
		padding:30px 10px;
	}
}
/*********************
	.timetable_fix_box
*********************/
.timetable_fix_box{
	width:90%;
	max-width:1420px;
	min-width:1080px;
	background:#fff;
	padding:20px 20px 0;
	box-sizing:border-box;
	margin:0 auto;
	position:fixed;
	left:0;
	right:0;
	top:100px;
	z-index:3;

}

@media screen and (max-width: 767px){
	.timetable_fix_box{
		top:140px;
		width:100%;
		padding:20px 10px 0;
		min-width:100%;
	}
}
/*********************
	.timetable_week
*********************/
.timetable_btn{
	width:100%;
	margin:0 auto 20px;
	display:flex;
	justify-content:center;
}
.timetable_btn li{
	width:180px;
	height:48px;
	line-height:48px;
	background:#333;
	border-radius:50vh;
	text-align:center;
	color:#fff;
	font-size:1.8rem;
	font-weight:bold;
	margin:0 10px;
	position:relative;
	cursor:pointer;
}
.timetable_btn li.active{
	background:#882111;
	color:#fff;
}
.timetable_btn li.active:after{
	display:block;
	content:"";
	width:19px;
	height:11px;
	background-image:url("../images/img_tab_active.png");
	background-repeat:no-repeat;
	background-size:100%;
	position:absolute;
	bottom:-11px;
	left:0;
	right:0;
	margin:0 auto;
}

.weekdata_wrap{
	width:100%;
	max-width:1080px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
@media screen and (max-width: 767px){
	.timetable_btn li{
		width:90px;
		height:38px;
		line-height:38px;
		font-size:1.4rem;
		margin:0 2%;
	}
	
}
/*********************
	.timetable_month
*********************/
.timetable_month{
	position:relative;
	padding-bottom:200px;
}

.month_tab_wrap{
	width:100%;
	margin:0 auto;
}
.timetable_month .tab__list{
	width:600px;
	display:flex;
	float:left;
}
.timetable_month .tab__list li{
	width:180px;
	height:48px;
	line-height:48px;
	background:#333;
	border-radius:50vh;
	text-align:center;
	color:#fff;
	font-size:1.8rem;
	font-weight:bold;
	margin:0 10px;
	position:relative;
	cursor:pointer;
}
.timetable_month .tab__list .tab__list__items--active{
	background:#882111;
	color:#fff;
}
.timetable_month .tab__list .tab__list__items--active:after{
	display:block;
	content:"";
	width:19px;
	height:11px;
	background-image:url("../images/img_tab_active.png");
	background-repeat:no-repeat;
	background-size:100%;
	position:absolute;
	bottom:-11px;
	left:0;
	right:0;
	margin:0 auto;
}
.timetable_month .tab__list__pdf {
	width:360px;
	height:48px;
	line-height:48px;
	background:#333;
	border-radius:50vh;
	text-align:center;
	color:#fff;
	font-size:1.8rem;
	font-weight:bold;
	float:right;
	margin: 0 0 0 auto;
	color: #fff;
	background-color:#333;
	border:2px solid #333;
	cursor:pointer;
}

.tab__body {
	position:relative;
	margin:50px auto 0;
}

.timetable_month .tab__contents{
	visibility:hidden;
	width:100%;
}
.timetable_month .tab__contents--active{
	display:block;
	visibility:visible;
	position:absolute;
	top:0;
	left:0;
	right:0;
	magin:0 auto;
}

.timetable_month_pdf {
	width:100%;
	margin:0 auto;
}
@media screen and (max-width: 767px){
	.timetable_month{
		padding-bottom:100px;
	}

	.timetable_month .tab__list__pdf {
		float:none;
		width:242px;
		height:40px;
		line-height:40px;
		font-size:1.4rem;
		margin:0 auto 30px;
	}
	.timetable_month .tab__list{
		width:100%;
		float:none;
	}
	.timetable_month .tab__list li{
		width:90px;
		height:38px;
		line-height:38px;
		margin-right:10px;
		font-size:1.4rem;
	}
	.timetable_month .tab__list .tab__list__pdf{
		width:100px;
	}
	.tab__body {
		margin:30px auto 0;
	}
	.timetable_month_pdf{
		width:100%;
		height:auto;
	}

}


/*********************
	.modal_bk_box
*********************/
.modal_bk_box{
	display:none;
	width:80%;
	height:70%;
	background-color:#fff;
	background-image:url("../images/bg_common_top.png");
	background-repeat:no-repeat;
	background-size:1654px;
	background-position:50% 0;
	border-radius:20px;
	margin:auto;
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:999;
	padding:80px 30px 10px;
	box-sizing:border-box;
	
}
.modal_bk_box .btn_modal_close_top{
	width:36px;
	height:36px;
	position:absolute;
	top:30px;
	right:20px;
	cursor:pointer;
}
.modal_bk_box .modal_bk_wrap{
	width:100%;
	margin:0 auto;
}
.modal_bk_box .modal_bk_wrap .ttl{
	width:100%;
	margin:0 auto 40px;
	font-size:2.4rem;
	font-weight:bold;
}
.modal_bk_box .modal_bk_list{
	width:100%;
	margin:0 auto 30px;
	font-size:0;
	display:flex;
	flex-wrap:wrap;
}
.modal_bk_box .modal_bk_list li{
	width:18%;
	margin:0 1% 20px;

}
.modal_bk_box .modal_bk_list li a{
	display:block;
	width:100%;
	padding:15px 5px;
	text-align:center;
	background:#7e8ebf;
	border-radius:50vh;
	box-sizing:border-box;
	color:#fff;
	font-size:1.4rem;
	font-weight:bold;
	line-height:1.2;
}
.modal_bk_box .modal_bk_list li a:hover{
	background:#882111;
	transition:.3s;
}

@media screen and (max-width: 767px){
	.modal_bk_box{
		width:90%;
		height:90%;
		background-size:1000px;
		background-position:50% 0;
		padding:40px 20px 20px;
		overflow-y:scroll;
	}
	.modal_bk_box .modal_bk_wrap .ttl{
		text-align:center;
		font-size:1.8rem;
		padding:10px 0;
		margin:0 auto 20px;
	}
	.modal_bk_box .modal_bk_list{
		text-align:center;
		margin:0 auto;
	}
	.modal_bk_box .modal_bk_list li{
		width:48%;
		margin:0 1% 15px;
	}
	.modal_bk_box .modal_bk_list li a{
		font-size:1.1rem;
		padding:12px 5px;
	}

}











/*----------------------------------
|- timetable 2021/02/17
----------------------------------*/

.week_btn {
	width:50px;
	background-color: #035d91;
}
.week_btn_prev {
  border-right: 1px solid #eceeeb;
}
.week_btn_next {
  border-left: 1px solid #eceeeb;
}
.week_btn_prev::before {
  content: '\25C0';
  color: #fff;
  font-size: 2.5rem;
  text-align: center;
  display: block;
}
.week_btn_next::before {
  content: '\25B6';
  color: #fff;
  font-size: 2.5rem;
  text-align: center;
  display: block;
}
.timetable_area{
	width:1080px;
}
.timetable_date_box {
	width:1080px;
  z-index: 2;
}
.timetable_date_box_fix {
  position: absolute;
  width: 1080px;
  top:106px;
  left: auto;
}
table tr{
	width:100%;
}
.timetable_date_box_week_btnfix {
  width: 50px;
}

@media screen and (max-width: 767px) {
  .timetable_date_box_fix {
    position: absolute;
    width: 100%;
    min-width: 1080px;
    top:147px;
    overflow: auto;
    white-space:nowrap;
  }
  .timetable_date_box_week_btnfix {
    width: 50px;
  }
  .timetable_date_hour_fix {
  position: sticky;
  left: 0;
  color: #fff;
  background: #333;
  &:before{
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid #ccc;
  }
 }
}
.date_box {
  width: 140px;
  padding: 19px 0;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  background-color: #333;
  border-left: 1px solid #333;
  border-right: 1px solid #333;
}
.date_box_sat {
  color: #95c6ff;
}
.date_box_sun {
  color: #ff9595;
}
.date_box_week {
  margin-left: 10px;
  font-size: 1.5rem;
  font-weight: 600;
  display: inline-block;
}
.table_date_hour {
  color: #fff;
  font-size: 1.2rem;
  font-weight: 600;
  text-align: center;
  background-color: #333;
  border-bottom: 2px solid #fff;
  vertical-align: middle;
}
.table_date_right,.table_date_left {
width:50px;
}
.table_date_hour-bg {
  padding: 5px 10px;
  box-sizing: border-box;
  color: #333;
  font-size: 1.2rem;
  text-align: left;
  background-color: #d6d6d6;
  border-bottom: 0;
}
.table_date_program{
  width:140px;
  border: 1px solid#d6d6d6;
}
.table_date_program-start {
  background-color: #035d91;
}
.table_date_program-end {
  background-color: #666;
}
.event_name {
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 140%;
  display: inline-block;
}
.short_message {
  margin-top: 10px;
  font-size: 1.2rem;
  display: inline-block;
}
.time_table_end {
  background-color: #666;
}
.time_table_empty_box{
  background-color: #666;
  border-right: 1px solid#d6d6d6;
  border-left: 1px solid#d6d6d6;
  border-bottom: 1px solid#d6d6d6;
}
.table_date_program-start>.timetable_link>.program_box>.event_name,
.table_date_program-start>.timetable_link>.program_box>.short_message {
  color: #fff;
  text-decoration: underline;
}
.timetable_border {
  width: 1080px;
  height: 70px;
  margin: 0 auto;
  background-color: #333;
}
.timetable_month_block {
  padding: 70px 0 100px;
  background-color: #eceeeb;
}



@media screen and (max-width: 767px){


  .weekdata_wrap {
    width: 100%;
    overflow-x: scroll;
  }
  .timetable_block {
    padding: 30px 0 0;
  }

  .date_box {
    font-size: 1.8rem;
  }
  .date_box_week {
    margin-right: 4%;
    font-size: 1.2rem;
  }
  .week_btn_prev::before,
  .week_btn_next::before {
    font-size: 1.8rem;
  }
  .event_name {
    font-size: 1.3rem;
  }
  .short_message {
    font-size: 1.2rem;
  }
  .timetable_border {
    height: 35px;
  }
  .timetable_month_block {
    padding: 30px 0 100px;
  }
  .tab__body {
    margin-top: 20px;
  }

  .timetable_month_pdf {
    width: 91%;
  }
}


.timetable_display_none{
  display: none;
}

.program_box{
	margin: 15px 10px;
}
.table_date_program{
	vertical-align: baseline;
}