/*------------------------------------------------------------------------------*/
/* #selectBox */
/*------------------------------------------------------------------------------*/
#selectBox {
	width: 100%;
	position: fixed;
	top: 60px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 99;
	transition: all 0.2s;
	-webkit-transform: translateY(-100%) translateX(0%);
	transform: translateY(-100%) translateX(0%);
	opacity: 0;
}
#selectBox.active {
	-webkit-transform: translateY(0%) translateX(0%);
	transform: translateY(0%) translateX(0%);
	opacity: 1;
}
#selectBox > div {
	display: none;
	background-color: rgba(255,255,255,1);
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2);
	padding: 10px 20px;
}
#selectBox ul:after {
	content: "";
	display: block;
	clear: both;
}
#selectBox li {
	width: 16.66%;
	float: left;
	/*font-size: 1.2em;*/
	/*font-weight: bold;*/
	line-height: 2;
	cursor: pointer;
	padding: 3px;
	transition: all 0.2s;
}
#selectBox li input {
	display: none;
	outline: none;
	margin: 0 0.2em 0 0;
}
#selectBox li label {
	display: block;
	cursor: pointer;
	padding: 5px;
	transition: all 0.2s;
}
#selectBox li label:hover {
	background-color: rgba(240,22,22,0.1);
}
#selectBox li label > span {
	display: table;
	height: 30px;
}
#selectBox li label > span > span {
	display: table-cell;
	vertical-align: middle;
}
#selectBox li label > span > span.imgBox {
	width: 30px;
	/*background-color: #000;*/
}
#selectBox li label > span > span.imgBox img {
	width: 100%;
	height: auto;
	/*opacity: 0.4;*/
	transition: all 0.2s;
}
#selectBox li label > span > span.textBox {
	font-size: 0.9em;
	line-height: 1.2;
	padding: 0 0 0 0.5em;
}

#selectBox li.checked label {
	background-color: #ffd4a1;
}
#selectBox li.checked label > span > span.imgBox img {
	opacity: 1;
}
#selectBox li.government.checked label > span > span.imgBox,
#selectBox li.education.checked label > span > span.imgBox {
	background-color: #008a61;
}

#btnClear {
	text-align: center;
	padding: 5px 0 0 0;
}
#btnClear button {
	display: inline-block;
	font-weight: bold;
	color: #fff;
	line-height: 1;
	cursor: pointer;
	outline: none;
	background-color: #575757;
	border: none;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	margin: 0 auto;
	padding: 0.7em 2em;
	transition: all 0.2s;
}
#btnClear button:hover {
	background-color: #797979;
}


#btnBoxSlide {
	display: table;
	cursor: pointer;
	outline: none;
	background-color: #B60055;
	border: none;
	/*border-bottom-left-radius : 0.3em;
	-webkit-border-bottom-left-radius: 0.3em;
	-moz-border-radius-bottomleft: 0.3em;
	border-bottom-right-radius : 0.3em;
	-webkit-border-bottom-right-radius: 0.3em;
	-moz-border-radius-bottomright: 0.3em;*/
	padding: 1em 2.5em;
	/*position: absolute;
	bottom: 0;
	left: 0;
	-webkit-transform: translateY(100%) translateX(0%);
	transform: translateY(100%) translateX(0%);*/
	transition: all 0.2s;
}
#btnBoxSlide:hover {
	background-color: #da267a;
	text-decoration:none;
}

#btnBoxSlide > span {
	display: table-cell;
	line-height: 1;
	vertical-align: middle;
}
#btnBoxSlide > span.text {
	font-weight: bold;
	color: #fff;
	padding: 0 0.5em 0 0;
}
#btnBoxSlide > span.icon > span {
	display: inline-block;
	width: 16px;
	height: 16px;
	background-color: #fff;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	position: relative;
}
#btnBoxSlide > span.icon > span > span {
	display: inline-block;
	box-sizing: border-box;
	position: absolute;
	top: 7px;
	left: 2px;
	width: 12px;
	height: 2px;
	background-color: #B60055;
	transition: all 0.3s;
}
#btnBoxSlide > span.icon > span > span:nth-of-type(1) {
	-webkit-transform: translateY(0px) rotate(0deg);
	transform: translateY(0px) rotate(0deg);
}
#btnBoxSlide > span.icon > span > span:nth-of-type(2) {
	-webkit-transform: translateY(0px) rotate(90deg);
	transform: translateY(0px) rotate(90deg);
}
#btnBoxSlide > span.icon.active > span > span:nth-of-type(1) {
	-webkit-transform: translateY(0px) rotate(0deg);
	transform: translateY(0px) rotate(0deg);
}
#btnBoxSlide > span.icon.active > span > span:nth-of-type(2) {
	-webkit-transform: translateY(0px) rotate(0deg);
	transform: translateY(0px) rotate(0deg);
}

#timetable .bbtns.bg_general {
    color: #000000;
    background-color: #FFFFFF;
    border: none;
    opacity: 0.5;
}
.active {
	opacity: 1!important;
}



#selectBox .iconCateTitle > h2,
#selectBox .iconTypeTitle > h2 {
	font-size: 1em;
	font-weight: bold;
	line-height: 1;
	position: relative;
	text-align:left;
	padding: 0 0 0 20px;
	/*margin-top:1em;*/
}
#selectBox .iconCateTitle > h2:before,
#selectBox .iconTypeTitle > h2:before {
	content: "";
	display: block;
	width: 14px;
	height: 14px;
	background-color: #d0362a;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	position:absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%) translateX(0%);
	transform: translateY(-50%) translateX(0%);
}
#selectBox .iconCateTitle p,
#selectBox .iconTypeTitle p {
	text-align:left;
	font-size:0.9em;
}

.selectBoxMain+.selectBoxMain {
	margin-top: 20px;
}

#selectCateMain {
	padding-top:10px;
}

#selectCateMain {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 0px 0 0px 0;
}
#selectCateMain > li {
	width: calc(100% / 6);
	width: calc(100% / 8);
}
#selectCateMain > li > label {
	display: block;
	text-align: center;
}
#selectCateMain > li > label > input {
	display: none;
	outline: none;
}
#selectCateMain > li > label > span {
	display: inline-block;
	height: 40px;
	cursor: pointer;
	background-color: #000;
}
#selectCateMain > li > label > span > img {
	width: auto;
	height: 100%;
	opacity: 0.4;
	transition: all 0.2s;
}
#selectCateMain > li.checked label {
	background-color: #ffd4a1;
}
#selectCateMain > li.checked label > span.imgBox img {
	opacity: 1;
}


/* 20190426 add */
#selectTypeMain {
	display: flex;
	flex-wrap: wrap;
}
#selectTypeMain > li {
	width: calc(100% / 8);

}
#selectTypeMain .iconTypeBox {
	display: flex;
	justify-content: center;
	width: calc(100% / 7);
	width: calc(100% / 8);
}

#selectCateMain .iconBox,
#selectTypeMain .iconBox,
.iconAreaMain03 .iconBox {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 25px;
	font-size: 1.4em;
	font-weight: bold;
	color: #fff;
	line-height: 1.2;
	text-align: center;
	background-color: #ccc;
	border-radius: .3em;
}

#selectCateMain li label .iconBox,
#selectTypeMain li label .iconBox {
	margin:auto;
    font-size: 80%;
    font-size:13px;
}

.iconBoxType01 {
	background-color: #529ccb!important;
	border-color: #3781ae!important;
}
.iconBoxType02 {
	background-color: #FF8E00!important;
	border-color: #FF8E00!important;
}


.sessionBox {
    background-color: #fff;
    padding: 10px 5px;
    opacity: 0.2;
    transition: all 0.2s;
}

.active {
    opacity: 1!important;
}

#selectBox ul {
	list-style-type:none;
}


/* screens smaller than 690---------------------------------------------------------- */
@media only screen and (max-width:690px) {
	#timetable .bbtns.bg_general {
		opacity:1;
	}
	#timetable .bdata {
		opacity:1;
	}
	#selectBox {
		display:none;
	}
}