/*cat_select start*/
.cat_select{
	width: 100%;
	display: block;
/*  display: grid;
  grid-gap: 2px 2px;
  grid-template-columns: repeat(5,1fr);*/
  margin: 0 0 20px 0;
  letter-spacing: -7px;
}
.cat_select .title{
	position: relative;
	display: inline-block;
	width: calc(20% - 0px);
	margin: 0 0 5px 0;
	padding: 0 3px;
  text-align: center;
  letter-spacing:0;
}
.cat_select .title>a{
	width: 100%;
	text-decoration: unset;
	display: block;
	border-radius: 50px;
	padding: 8px 16px;
	color: #fff;
	background-color: #5d5d5d;
}
.cat_select>.title.sel{
	display: block;
}
.cat_select>.title.sel_inline{
  display: inline-block;
}
.cat_select .title.sel>a{
	color: #000;
	background-color: var(--hover_color);
}
.cat_select .title.brand>a{
	background-color: #236f89;
}
.cat_select .title.sel.brand>a{
	background-color: var(--hover_color);
}
.cat_select .title>a:hover{
	color: #000;
	background-color: var(--hover_color);
}
.cat_select .title_rehearsal>a{
  background-image: url('../style/xz/icon_calendar_black.svg');
  background-repeat: no-repeat;
  background-position: 4px center;
  background-size: 29px;
}
.cat_select .title .arrow_right{
	position: absolute;
	top: 3px;
	right: 6px;
	color: #5d5d5d;
  background-image: url(../style/xz/icon_dropdown.svg);
  background-color: #fff;
  background-repeat: no-repeat;
  border-radius: 50px;
  width: 31px;
  height: 31px;
  display: inline-block;
  margin: 0;
  transform: rotate(-90deg);
  z-index: 3;
  cursor: pointer;
}
.cat_select .title .arrow_right.sel{
  background-color: #ccc;
  background-color: var(--hover_color);
  transform: rotate(0deg);
}
.cat_select .title .arrow_right:hover,
.cat_select .title .arrow_right.sel:hover{
	background-color: var(--hover_color);
}
.cat_select .submenu2{
	display: none;
}
.cat_select .submenu2.sel{
	display: block;
}
.cat_select .submenu2 .sub_class{
	border-bottom: 1px dashed #ccc;
	margin: 0 0 8px 0;
}
.cat_select .submenu2 .sub_class .title>a{
	background-color: #eee;
	color: #000;
}
.cat_select .submenu2 .sub_class .title>a:hover{
	background-color: var(--hover_color);
}
.cat_select .submenu2 .sub_class .title.sel>a{
	background-color: var(--hover_color);
}
/*cat_select end*/
/***************************************************************/
.option_column .option .sort a.sel{
	background-color: var(--hover_color);
	color: var(--hover_textcolor);
}
.option_column .option .sort a:hover{
	background-color: #ccc;	
	color: var(--hover_textcolor);
}
/***************************************************************/
.main_title_column h2::before{
	background-color: var(--hover_color);
	background-image: url('../style/xz/icon_title_black.svg');
}
/***************************************************************/
.page_block a.page_block_see{
  border:1px solid var(--hover_color);
  display:inline-block;
	background-color: var(--hover_color);
	color: var(--hover_textcolor);
  font-weight:bold;
}
.page_block a:hover{
  background-color: #ddd;
}
.page_block a.page_block_see:hover{
	color: var(--hover_textcolor);
  background-color: var(--hover_color);
}
/***************************************************************/
.left_menu ul li>a{
	padding: 5px 10px;
}
.left_menu ul .sel>a {
  background-color: #eee;
  color: #000;
}
.left_menu ul .sel a{
  color: #000;
}
.left_menu ul li a:hover,
.left_menu ul .sel a:hover {
  color: #000;
  background-color: #ddd;
}
.left_menu ul li.master.sel>a{
	font-weight: bold;
}

.left_menu ul li.master>a{
	font-weight: normal;
	font-size: 1em;
	padding: 5px 10px;
}
.left_menu ul li.master>ul{
	display: none;
}
.left_menu ul li.master.sel>ul{
	display: block;
}
.left_menu ul li img{
	width: 40px;
	height: 40px;
	vertical-align: middle;
	margin: 0 3px 0 0;
	-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
}
.left_menu ul li ul{
	margin: 0;
	padding: 0;
}
.left_menu ul li ul li>a{
	padding: 5px 10px 5px 50px;
}

.left_menu ul li.brand{
 	border-bottom: 0px solid #ccc;
}
.left_menu ul li.brand>a{
	padding: 1px 10px;
}
.left_menu ul li.brand a:hover,
.left_menu ul .brand.sel a:hover {
  color: unset;
  background-color: unset;
}
.left_menu ul li.brand img{
	width: 100%;
	vertical-align: middle;
	margin: 0;
	-webkit-border-radius:0px; -moz-border-radius:0px; border-radius:0px;
}
.left_menu ul li{
	position: relative;
}
.left_menu ul li .arrow_right{
	position: absolute;
	top: 8px;
	right: 6px;
	color: #5d5d5d;
  background-image: url(../style/xz/icon_dropdown.svg);
  background-color: #ddd;
  background-repeat: no-repeat;
  border-radius: 50px;
  width: 31px;
  height: 31px;
  display: inline-block;
  margin: 0;
  transform: rotate(-90deg);
  z-index: 3;
  cursor: pointer;
  transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in;
}
.left_menu ul li .arrow_right.sel{
  background-color: #ccc;
  background-color: var(--hover_color);
  transform: rotate(0deg);
}
.left_menu ul li .arrow_right:hover,
.left_menu ul li .arrow_right.sel:hover{
	background-color: var(--hover_color);
}
.form_button_order:hover{
	color: #000;
}
/***************************************************************/
/*練團室*/
.table_rehearsal_list_option{
  width: 100%;
  border-top: 1px dashed #ccc;
  padding: 6px 0 0 0;
}
.table_rehearsal_list_option .inputtext {
  font-size: 1em;
  font-family: Microsoft JhengHei, simhei, Arial;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 5px;
  -webkit-appearance: none;
  border: 1px solid #666;
  display: inline-block;
  max-width: 300px;
}
.table_rehearsal_list_option .s1{
  float: left;
  display: inline-block;
  text-align: left;
  padding: 5px 0 5px 0;
  margin-bottom: 10px;
}
.table_rehearsal_list_option .s1 a{
  padding: 6px 12px;
  text-decoration: unset;
  background-color: #ececec;
  border: 1px solid #ccc;
  color: #000;
  border-radius: 5px;
  margin: 0 0 0 2px;
}
.table_rehearsal_list_option .s1 a:hover{
  background-color: var(--hover_color);
}
.table_rehearsal_list_option .s2{
  float: left;
  display: inline-block;
  padding: 0 15px 10px 15px;
}
.table_rehearsal_list_option .s3{
  float: right;
  display: inline-block;
  text-align: left;
  padding: 5px 0 0 0;
  margin-bottom: 10px;
}
.table_rehearsal_list_option .s3 .button,
.table_rehearsal_list_option .s3 a{
  padding: 6px 12px;
  text-decoration: unset;
  background-color: #ececec;
  border: 1px solid #ccc;
  color: #000;
  border-radius: 5px;
  margin: 0 2px 0 0;
  cursor: pointer;
}
.table_rehearsal_list_option .s3 .button_order{
  color: #fff;
  background-color: #ED5F55;
  border: 1px solid #DA4D43;
  padding: 6px 12px 6px 36px;
  background-image: url(../style/xz/icon_calendar_white.svg);
  background-repeat: no-repeat;
  background-position: 12px center;
  background-size: 22px;
}
.table_rehearsal_list_option .s3 .notice{
  padding: 6px 12px 6px 36px;
  background-image: url(../style/xz/icon_notice.svg);
  background-repeat: no-repeat;
  background-position: 12px center;
  background-size: 22px;
}
.table_rehearsal_list_option .column_desc{
  width: 100%;
  margin: 10px 0;
  font-size: 0.9em;
}
.table_rehearsal_list_option .column_desc .row{
  display: inline-block;
  margin: 0 10px;
}
.icon_color{
  display: inline-block;
  border-radius: 2px;
  width: 26px;
  height: 18px;
  background-color: #aaa;
  vertical-align: text-bottom;
  margin: 0 3px 0 0;
}
.icon_color.out{
  background-color: #6bbdc7;
}
.icon_color.rent{
  background-color: #fff38b;
}

.table_rehearsal_list{
  width: 100%;
}
.table_rehearsal_list tr td{
  padding: 5px;
}
.table_rehearsal_list td.none{
  background-color: #aaa;
}
.table_rehearsal_list td.out{
  background-color: #6bbdc7;
}
.table_rehearsal_list td.rent{
  background-color: #fff38b;
}
.table_rehearsal_list td.rent:hover{
  background-color: var(--hover_color);
}
.table_rehearsal_list td.rent a{
  color: #000;
  text-decoration: unset;
  width: 100%;
  height: 100%;
  display: block;
}
.column_notice{
  background-color: #f2f2f2;
  border-radius: 5px;
  border: 1px solid #999;
  margin: 0 2px 0;
}
.column_notice h3{
  text-align: center;
}
.column_notice ul li,
.column_notice ol li{
  font-size: 0.9em;
  margin: 0 0 6px 0;
}
._bg_light_gray{
  background-color: #EBEEF9;
}
._bg_light_sat{
  background-color: #e0fbd3;
}
._bg_light_sun{
  background-color: #fbded3;
}
/***************************************************************/