@charset "UTF-8";

/*
#sec-howto,
#sec-schedule{
	max-width: 1280px;
	width: calc(100% - 32px);
	padding-top: 0;
	padding-left: 16px;
	padding-right: 16px;
	margin-right: auto;
	margin-left: auto;
}
*/

.tab-bg-green {
  border: solid 2px var(--bg-main);
}
.tab-bg-green .tab-panels{
	background:var(--bg-main);
	padding: 50px 50px 50px;
}
.tab-bg-green .tab-panels .tx{
	color: var(--bg-white);
}

.tab-bg-green .tab-buttons {
  display: flex;
}

.tab-bg-green .tab-button {
  padding: 10px 18px;
  border: 0;
  width: 50%;
  background: var(--bg-white);
}
.tab-bg-green .tab-button,
.tab-bg-green .tab-button span{
  color: var(--color-main);

}
.tab-bg-green .tab-button .t-small{
	font-size: 16px;
}

.tab-bg-green .tab-button.is-active span,
.tab-bg-green .tab-button.is-active {
  color: var(--color-white);
  background: var(--bg-main);
}

.tab-panel {
  display: none;
  padding: 20px 0;
}

.tab-panel.is-active {
  display: block;
  animation: tabFadeUp 0.45s ease forwards;
}
@keyframes tabFadeUp {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tab-bg-green .c-tx h3,
.tab-bg-green .c-tx h4,
.tab-bg-green .c-tx div,
.tab-bg-green .c-tx p,
.tab-bg-green .c-tx a,
.tab-bg-green .c-tx li,
.tab-bg-green .c-tx span{
  color: var(--color-white);

}
.tab-bg-green .c-tx{
	margin-top: 40px;
}
.tab-bg-green .c-tx .title{
	margin-bottom: 20px;
}



.mono .table-scroll {
 width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 10px;
}



/* スクロールの幅の設定 */
.mono .table-scroll::-webkit-scrollbar {
width: 10px;
height: 10px;
}

/* スクロールの背景の設定 */
.mono .table-scroll::-webkit-scrollbar-track {
border-radius: 5px;
}

/* スクロールのつまみ部分の設定 */
.mono .table-scroll::-webkit-scrollbar-thumb {
border-radius: 5px;
background: var(--bg-black);
}
/**/
.table-scroll .schedule-table {
  min-width: 500px;
}

.tabs + .bt-kakomi-bl{
	margin-top: calc(50px * var(--space-scale-s));
}


.mono .table-scroll .bg-kakomi{
	padding: 6px 16px;
	text-align: center;
	margin-bottom: 20px;
}


/**table****************/

.tab-bg-green .tx-chu,
.tab-bg-green td,
.tab-bg-green th{
	color: var(--bg-white);
}
.schedule-table + .title,
.schedule-table + .schedule-table{
	margin-top: 40px;
}
/*
.schedule-table::after{
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	background: var(--bg-white);
	position: absolute;
	bottom: -10px;
}
*/
.schedule-table {
  width: 100%;
  border-collapse: collapse;
  font-family: serif;
  font-size: 16px;
  position: relative;
  margin-bottom: 20px;
}
.schedule-table td.t-2row-top{
	border-bottom: none;
}
.schedule-table td.t-2row-bottom{
	border-top: none;
}
.schedule-table th,
.schedule-table td{
	font-size: 16px;
  padding: 6px;
  vertical-align: middle;
  border: solid 1px var(--bg-white);
  text-align: center;	
}
.schedule-table th{
	background: var(--glass-20);
	font-weight: bold;
}
.tab-bg-green h3,
.tab-bg-green p,
.tab-bg-green a,
.tab-bg-green li,
.tab-bg-green div{
	color: var(--bg-white);
}
.tabs .title{
	margin-bottom: 16px;
	position: relative;
	padding-left: 20px;
}
.tabs .title::before{
	content: '';
	position: absolute;
	width: 6px;
	height: 100%;
	background: var(--bg-white);
	left: 0;
}



.schedule-table .date,
.schedule-table .day,
.schedule-table .time{
}
.schedule-table .date {
}
.schedule-table .day {
}
.schedule-table .time {
}
.schedule-table .detail {
  line-height: 1.6;
}

.schedule-table .note {
  text-align: center;
  background: var(--glass-10);
}






@media screen and (max-width: 1179px) {






}
@media screen and (max-width: 1023px) {





}
@media screen and (max-width: 767px) {




	.schedule-table th, 
	.schedule-table td {
		text-align: left;
	}

	.tab-panel .c-tx p,
	.schedule-table td{
		font-size: 14px;
		padding: 4px;
	}
	.tab-bg-green .tab-button .t-small {
	    font-size: 12px;
	}
	.tab-bg-green .tab-button{
		padding: 10px;
	}
	.tab-panel .c-tx p, .schedule-table td,
	.tab-bg-green .c-tx .title{
		text-align: left;
	}

	.tab-bg-green .tab-panels {
	    padding: 50px 24px 50px;
	}




}
@media screen and (max-width: 376px) {

	.tab-bg-green .tab-button .t-small {
	    font-size: 10px;
	}
	.tab-bg-green .tab-button{
		padding: 6px;
		font-size: 14px;
		
	}



}