.red {
	color:red;
}

button,
.btn {
	transition: .3s;
	outline: 1px solid;
	outline-color: #696969;
	outline-offset: 0px;
}
button:disabled,
.btn:disabled {
	background-color: #ebebeb;
	border-color: #ccc;
	color:#969494
}
.non_eff {
	outline: 0px;
	border:1px solid #000;
}
button:hover:not([disabled]),
.btn:hover:not([disabled]) {
	animation: light .8s infinite;
}
@keyframes light {
	100% { 
		outline-color: transparent;
		outline-offset: 12px;
	}
}

button.swal2-styled {
	margin:1.0em;
}

.even td {
	background-color:#FFF;
}
.odd td {
	background-color:#dbf1f3;
}

footer {
	text-align:center;
}

/*フラッシュメッセージ*/
.flash-alert {
    position: relative;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
	text-align: center;
	width: 100%;
}
.flash-alert-success {
    color: #1d643b;
    background-color: #d7f3e3;
    border-color: #c7eed8;
    z-index: 99;
}
.flash-alert-error {
    background: #f00;
    color: #fff;
    z-index: 99;
}
/*フラッシュメッセージ ここまで*/

/*style css*/

.back_img{
	width: 100%;
	min-height: calc(100vh - 44px);
	background: url(../images/back_image.jpg) repeat-x;
	background-position: bottom;
	padding: 25px;
}

.back_img .contents_w{
	width: 90%;
	margin: auto;
	max-width: 1400px;
}

.back_img h2{
	margin-bottom: 0.5rem;
}

.login-f{
	display: flex;
	align-items: stretch;
	justify-content: space-around;
}

.login-f .flex-2{
	width: 48%;
}

.maxw-80{
	width: 90%;
	max-width: 1400px;
	margin: auto;
}

.button_style{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 85%;
	max-width: 350px;
	margin: 15px auto;
	padding: 20px 5px 20px 20px;
	font-size: 1.6rem;
	font-weight: bold;
	color: #fff;
	position: relative;
}

.button_style::before{
	content: '';
	width: 10px;
	height: 53%;
	background-color: #fff;

	position: absolute;
	top: 50%;
	left: 8px;
	transform: translateY(-50%);
}

.button_h90{
	min-height: 90px;
}

.flex_3{
	flex-wrap: wrap;
}

.flex_3 div{
	width: calc( 100% / 4 );
	min-width: 250px;
}

.news_list{
	font-size: 1.4rem;
}

.news_list .news_item{
	display: flex;
	align-items: flex-start;
	border-bottom: solid 1px #969494;
	padding: 5px 10px;
}

.news_list a:hover{
	color: #65a30d;
}

.news_list .news_item .news_day{
	margin-right: 15px;
}

.serch_left{
	background-color: #f7fff5;
	padding: 15px;
	border-right: solid 2px #65a30d;
	/* width: 50%; */
	min-height: calc(100vh - 38.5px);
}

.serch_ul{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 30px;
}

.serch_ul li{
	height: 85px !important;
	min-width: 230px;
}

.serch_ul li button{
	display: flex;
	justify-content: flex-start;
	padding-left: 25px;
	align-items: center;
	width: 95%;
	color: #1d643b;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: left;
	outline: none;
	background-color: #fff;
	border: solid 2px #65a30d;
	position: relative;
	transition: 0.2s;
}

.serch_ul li button::before{
	content: '';
	width: 10px;
	height: 53%;
	background-color: #1d643b;

	position: absolute;
	top: 50%;
	left: 7px;
	transform: translateY(-50%);
	transition: 0.2s;
}

.serch_ul li button:hover,
.serch_ul li button.act{
	color: #fff;
	background-color: #1d643b;
}

.serch_ul li button:hover::before,
.serch_ul li button.act::before{
	background-color: #fff;
}

.paging-flex{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	flex-wrap: nowrap;
}

.paging-flex .prev,
.paging-flex .next{
	display: block;
	width: 30px;
	height: 30px;
	border: solid 21px transparent;
	transition: 0.3s;
}

.paging-flex .prev{
	border-right: solid 21px #1d643b;
	margin-right: 25px;
}

.paging-flex .next{
	border-left: solid 21px #1d643b;
	margin-left: 25px;
}

.paging-flex .prev:hover{
	transform: translateX(-3px);
}

.paging-flex .next:hover{
	transform: translateX(3px);
}

.paging-flex .pageno-fl{
	display: flex;
}

.paging-flex .pageno-fl li{
	margin: 5px;
}

.paging-flex .pageno-fl li a{
	display: block;
	padding: 10px 18px;
	border: solid 2px #65a30d;
	color: #1d643b;
	transition: 0.2s;
}

.paging-flex .pageno-fl li a:hover,
.paging-flex .pageno-fl li a.act{
	border: solid 2px #1d643b;
	background-color: #1d643b;
	color: #fff;
	font-weight: bold;
}

.serch_right{
	padding: 0;
	min-height: calc(100vh - 38.5px);
}

.serch_right h2{
	margin: 20px 0 30px;
	padding-left: 25px;
	border-bottom-width: 6px;
}

.serch_right .shisetsu-deta{
	width: 90%;
	margin: auto;
}

.serch_right .shisetsu-deta img{
	display: block;
	width: 100%;
	height: auto;
	max-width: 450px;
	margin: auto;
}
.serch_right .shisetsu-deta img.equipment,
.serch_right .shisetsu-deta span.equipment {
	display:inline;
	width:30px;
	margin-right:3px;
}
.serch_right .shisetsu-deta img.purpose,
.serch_right .shisetsu-deta span.purpose {
	display:inline;
	width:30px;
	margin-right:3px;
}
.serch_right .shisetsu-deta span.equipment,
.serch_right .shisetsu-deta span.purpose {
	text-decoration:underline;
	margin-right:5px;
}

.serch_right .shisetsu-deta .deta-tb{
	margin: 25px auto;
	border-collapse: collapse;
	width: 100%;
	font-size: 1.2rem;
}

.serch_right .shisetsu-deta .deta-tb th,
.serch_right .shisetsu-deta .deta-tb td{
	border: 1px solid #919191;
	padding: 10px 7px;
}

.facility_h{
	padding: 15px 0;
}

.facility_h h1{
	border-bottom: solid 6px #65a30d;
	font-weight: bold;
	margin-bottom: 15px;
	padding: 5px 15px;
}

.facility_h p{
	padding: 5px 15px;
}

.day_tb_area{
	background-color: #e9e9e9;
	padding: 15px;
	/*max-height: 60vh;
	overflow-y: scroll;*/
	width: 100vw;
	overflow: scroll;

}

.day_select{
	display: flex;
	align-items: center;
}

.day_select .today{
	color: #0284c7;
	margin: 10px;
	font-size: 2.2rem;
}

.day_select .next_b{
	background-color: #0284c7;
	padding: 5px 25px 5px 10px;
	margin: 0 10px;
	color: #fff;
	font-weight: bold;
	clip-path: polygon(0% 0% , 80% 0%, 100% 50%, 80% 100%, 0% 100%);
}

.day_tb_area table{
	background-color: #fff;
	border-collapse: collapse;
	font-size: 1.75rem;
}

.day_tb_area table th{
	padding: 0px 12px;
	border: solid 1px #969494;
}

.day_tb_area table td{
	padding: 5px 13px;
	border: solid 1px #969494;
	text-align: center;
}

.bgc_y{
	background-color: #ffffcf;
}

.day_tb_area table:not(.venues) td:nth-of-type(1){
	white-space: nowrap;
}

.day_tb_area table:not(.venues) td:nth-of-type(2){
	background-color: #ffffcf;
	padding: 5px;
}

/* .day_tb_area table td:nth-of-type(1){
	text-align: left;
	padding: 5px;
} */

.w0{
	background-color: #ffdeff;
}

.w6{
	background-color: #e0ffff;
}

.cir{
	color: #0284c7;
	font-weight: bold;
}

.tri{
	color: #fbb03b;
}

.ng{
	background-color: #ccc;
}

.ng2{
	background-color: #ccc;
}

.ng1{
	background-color: #f2f2f2;
}

.day_tb_area table caption{
	width: 100%;
	background-color: #0284c7;
	padding: 5px;
	color: #fff;
	font-weight: bold;
}

.day_tb_time  table{
	margin-bottom: 20px;
}

.day_tb_time  table:not(.venues) th:nth-of-type(2){
	background-color: #ffffcf;
	padding: 5px;
}
.button_s_style{
	display: flex;
	align-items: center;
	margin: 15px auto;
	padding: 13px 5px 13px 25px;
	font-weight: bold;
	color: #fff;
	position: relative;
	min-width: 175px;
}

.button_s_style::before{
	content: '';
	width: 10px;
	height: 53%;
	background-color: #fff;

	position: absolute;
	top: 50%;
	left: 8px;
	transform: translateY(-50%);
}

.serch_button{
	position: absolute;
	top: 15px;
	right: 15px;
	margin: auto;
	padding: 7px 5px 7px 25px;
}

.serch_button::after{
	content: url(../images/icon_serch.png);
	position: absolute;
	height: auto;
	top: 50%;
	transform: translateY(-50%);
	right: 6px;
}

.search-box{
	background-color: rgba(0,0,0,0.85);
	padding: 15px;
	transition: 0.3s;
	height:100%;
	/* min-height: calc( 100vh - 38.5px); */
	/* position: relative; */
}

.search-box .search_category{
	display: flex;
	flex-wrap: wrap;
}

.search-box .h_label{
	font-size: 2rem;
    margin-bottom: 10px;
    display: block;

    padding-left: 10px;
	padding-bottom: 10px;
	border-left: solid #fff 10px;
	border-bottom: solid #636363 2px;
	font-weight: bold;
}

.search-box .search_category label{
	display: block;
	margin-right: 30px;
	margin-bottom: 10px;
	white-space: nowrap;
	font-size: 1.3rem;
}

.search-box .search_category label input{
	margin-right: 3px;
}

.toziru_b{
	position: absolute;
	top: 5;
	right: 5;
	width: 30px;
	height: 30px; 
	outline: none;
}

.toziru_b .batsu{
	display: block;
	width: 27px;
	height: 5px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

#search .toziru_b .batsu1{
	background-color: #fff;
	transform: rotate(45deg);
}

#search .toziru_b .batsu2{
	background-color: #fff;
	transform: rotate(-45deg);
}

.toziru_b .batsu3{
	background-color: #65a30d;
	transform: rotate(45deg);
}

.toziru_b .batsu4{
	background-color: #65a30d;
	transform: rotate(-45deg);
}

@media all and (max-width:767px) {
	.text-4xl{
		font-size: 1.8rem;
	}

	.back_img{
		padding: 20px 10px;
	}

	.login-f{
		display: block;
	}
	
	.login-f .flex-2{
		width: auto;
		margin: auto;
		margin-bottom: 20px;
	}

	.flex_3{
		display: block;
	}

	.flex_3 div{
		width: auto;
		min-width: auto;
		margin: auto;
	}

	.news_list .news_item{
		display: block;
		padding: 10px;
	}

	.news_list .news_item .news_day{
		color: #65a30d;
		margin-bottom: 3px;
	}

	.serch_button{
		position: relative;
		top: auto;
		right: auto;
		margin: -25px 0 15px auto;
	}


	.serch_ul li button{
		margin: auto;
	}

	.serch_right .shisetsu-deta .deta-tb th,
	.serch_right .shisetsu-deta .deta-tb td{
		display: block;
	}

	.serch_right .shisetsu-deta .deta-tb th{
		text-align: left;
		background-color: #919191;
		color: #fff;
		padding: 6 10px;
	}

	.serch_right .shisetsu-deta .deta-tb td{
		padding: 10px;
	}

	.day_select{
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 5px;
		position: sticky;
		top: 0;
		left: 0;
	}
	
	.day_select .today{
		width: 100%;
		text-align: center;
	}

	.day_select .next_b{
		margin: 0 3px;
	}

}