.d-none {
  display: none !important; }
.d-block {
  display: block !important; }

@media (min-width: 769px) {
  .d-md-none {
    display: none !important; }
  .d-md-block {
    display: block !important; }}
@media (max-width: 768px) {
  .d-nmd-none {
    display: none !important; }}

#table_oc_schedule {
    border : none;
    
	th, td {
	    border : none;
	    padding : 5px;
	}
	tr {
	    border-bottom: 1px solid #cecece;
	}
	thead th:nth-child(n+2) {
	    padding: 3px;
	    width: 6.5%;
	}
	
	.oc_all       { color: #b02727; background: #b0272722; }
	.oc_photo     { color: #373c91; background: #373c9122; }
	.oc_cinema    { color: #d71e36; background: #d71e3622; }
	.oc_fineart   { color: #deac14; background: #deac1422; }
	.oc_music     { color: #48995b; background: #48995b22; }
	.oc_literary  { color: #708996; background: #70899622; }
	.oc_theatre   { color: #d5808c; background: #d5808c22; }
	.oc_broadcast { color: #e18b45; background: #e18b4522; }
	.oc_design    { color: #0076a5; background: #0076a522; }
	.oc_other     { color: #9c27b0; background: #9c27b022; }
	.oc_common    { color: #795548; background: #79554822; }
	.oc_graduate  { color: #2e3977; background: #2e397722; }
}

#tab_oc {
	width: 100%;
	
	.tab_group {
	    display: flex;
		width: 100%;
	    
	    label {
		    flex: auto;
		    order: -1;
		    min-width: 70px;
		    padding: .7em 0 .5em;
		    border-bottom: 1px solid #f0f0f0;
		    border-radius: 0;
		    font-size: .9em;
		    text-align: center;
		    cursor: pointer;
		    margin-bottom: 0;
		    border-color: #e9f0f6 #f0f0f0 #fff;
		    border-style: solid;
		    border-width: 4px 1px 1px;
		    border-radius: 5px;
		}
		label:hover {
		    opacity: .8;
		}
	    label:has(:checked) {
		    background-color: #fff;
		    border-color: #2589d0 #f0f0f0 #fff;
		    color: #333333;
		}
		input {
		    display: none;
		}
		
		label.oc_all       { border-top-color: #b0272777; color: #b0272777; }
		label.oc_photo     { border-top-color: #373c9177; color: #373c9177; }
		label.oc_cinema    { border-top-color: #d71e3677; color: #d71e3677; }
		label.oc_fineart   { border-top-color: #deac1477; color: #deac1477; }
		label.oc_music     { border-top-color: #48995b77; color: #48995b77; }
		label.oc_literary  { border-top-color: #70899677; color: #70899677; }
		label.oc_theatre   { border-top-color: #d5808c77; color: #d5808c77; }
		label.oc_broadcast { border-top-color: #e18b4577; color: #e18b4577; }
		label.oc_design    { border-top-color: #0076a577; color: #0076a577; }
		label.oc_other     { border-top-color: #9c27b077; color: #9c27b077; }
		label.oc_common    { border-top-color: #79554877; color: #79554877; }
		label.oc_graduate  { border-top-color: #2e397777; color: #2e397777; }
		
		label.oc_all:has(:checked)      ,label.oc_all:hover        { background-color: #b0272722; border-top-color: #b02727; color: #b02727; }
		label.oc_photo:has(:checked)    ,label.oc_photo:hover      { background-color: #373c9122; border-top-color: #373c91; color: #373c91; }
		label.oc_cinema:has(:checked)   ,label.oc_cinema:hover     { background-color: #d71e3622; border-top-color: #d71e36; color: #d71e36; }
		label.oc_fineart:has(:checked)  ,label.oc_fineart:hover    { background-color: #deac1422; border-top-color: #deac14; color: #deac14; }
		label.oc_music:has(:checked)    ,label.oc_music:hover      { background-color: #48995b22; border-top-color: #48995b; color: #48995b; }
		label.oc_literary:has(:checked) ,label.oc_literary:hover   { background-color: #70899622; border-top-color: #708996; color: #708996; }
		label.oc_theatre:has(:checked)  ,label.oc_theatre:hover    { background-color: #d5808c22; border-top-color: #d5808c; color: #d5808c; }
		label.oc_broadcast:has(:checked),label.oc_broadcast:hover  { background-color: #e18b4522; border-top-color: #e18b45; color: #e18b45; }
		label.oc_design:has(:checked)   ,label.oc_design:hover     { background-color: #0076a522; border-top-color: #0076a5; color: #0076a5; }
		label.oc_other:has(:checked)    ,label.oc_other:hover      { background-color: #9c27b022; border-top-color: #9c27b0; color: #9c27b0; }
		label.oc_common:has(:checked)   ,label.oc_common:hover     { background-color: #79554822; border-top-color: #795548; color: #795548; }
		label.oc_graduate:has(:checked) ,label.oc_graduate:hover   { background-color: #2e397722; border-top-color: #2e3977; color: #2e3977; }
	}
}

@media (max-width: 769px) {
	#tab_oc {
		overflow-x: scroll;
	}
}