@charset "UTF-8";

.wrapper {
	width: 100%;
	margin: 0 auto;
}

.dates {
	display: flex;
	width: 100%;
	justify-content: space-around;
	align-items: center;
	gap: 10px;
}

.dates li {
background: url(../image/topPage/search_frame.svg) #d3edfb no-repeat;
    background-size: auto;
    width: 16%;
    height: 88px;
}

.dates li a {
	display: block;
	color: #333;
	text-decoration: none;
}

.dates li button,
.tabs button {
/*	background: #D3ECFB !important;
	border: 1px solid #0081c5;
	padding: 5px;*/
	background: none;
    padding: 0;
    border: none;
	    align-items: center;
    justify-content: center;
    text-align: center !important;
	width: 100%;
    height: 100%;
    margin: 0 auto;
}

.dates li span.tabline {
}

.dates li span.count {
display: none
}

.tabcategory {
	display: flex;
	width: 100%;
	justify-content: space-around;
	align-items: center;
}



.tabcategories {
display: flex;
	width: 100%;
	justify-content: space-around;
	flex-wrap: wrap;
	/*height: 65px;*/
}

.tabcategories li {
	width: calc(100%/11);
	column-gap: 5px;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.35);
	font-size: 90%;
	display: flex;
	height: 70px;
}

.tabcategories li:nth-child(even) {
	background: #9fd9f6;
}

.tabcategories li:nth-child(odd) {
	background:#d3edfb;
}

.tabcategories li button {
display: flex;
  align-items: center;
  justify-content: center;
  text-align: center !important;
  height: 100%;
  margin: 0 auto;
}


.dates li button.active {
	background:rgba(0,129,197,0.35);
	color: #333;
	width:100%;
}

.dates li:nth-child(1) button.active {
	background: none;
}

.tabcategories li button.active {
color:#fff;
background: #0081c5;
width: 100%;
}

.tabs{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-bottom:25px;
}

.tabs h3 {
	display: inline-block;
	position: relative;
	padding: 0 2.5em;
	color: #333333;
	    font-size: clamp(0.875rem, 0.624rem + 1.25vw, 1.375rem);
    font-weight: bold;
	text-align: center;
	width: 100%;
	margin: 20px auto 10px;
}

.tabs h3::before,
.tabs h3::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 40%;
    height: 3px;
    background-color: #212121;
}

.tabs h3::before {
    left: 0;
}

.tabs h3::after {
    right: 0;
}





.tab{
padding:8px 14px;
border:1px solid #ccc;
background:#fff;
cursor:pointer;
border-radius:5px;
}

.joblist {
	margin-bottom: 0;
}

.joblist li {
	font-size: 87%;
	margin-right: 0.5em;
	line-height: 1.6;
}

.joblist li img {
	height: 12px;
	width: auto;
	vertical-align: baseline;
}

.filter-bar {
    display: flex;
    gap: 20px;
    align-items: center;
    flex-wrap: wrap;
    margin: 20px 0;
}

.filter-bar button {
	font-size: 80%;
	border-radius: 20px;
	background: #0081c5;
	color: #fff;
	padding: 3px 15px;
	border: 1px solid #fff;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}

.filter-tag {
	padding: 7px 15px;
	background: #eee;
	border-radius: 20px;
	margin: 0 0.7em 0.6em 0;
	vertical-align: sub;
	border: 1px solid #fff;
	display: inline-block;
	font-size: 80%;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
	color: #666;
}

/*.filter-bar {
display: flex;
padding: 5px;
margin-bottom: 10px;
}

#resultCount {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	line-height: 30px;
	margin-right: 1em;
}

.filter-bar button {
	font-size: 80%;
	border-radius: 6px;
	border: none;
	background: #0081c5;
	color: #fff;
}

.filter-tag {
	padding: 5px;
	background: #ccc;
	border-radius: 10px;
	margin-right: 0.5em;
	vertical-align: sub;
}*/


.card-area {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
row-gap:10px;
column-gap: 10px;

}

.company-card {
width: calc(100%/6);
border: 1px solid #333;
padding: 5px 7px 10px;
text-align: center;
flex-direction:column;
}

.company-card .namelogo {
	margin-bottom: 10px;
}

.company-card .schedule {
	line-height: 1.5;
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 5px;
}

.company-card .jobcategory {
	font-weight: normal;
	font-size: 80%;
}

.date_link a.linkpage {
	background: #EFE36F;
	padding: 5px 0;
	text-decoration: none;
	display: inline-block;
	width: 100%;
	margin: 7px auto 7px;
	border-radius: 5px;
	color: #333;
	font-size: 90%;
}

.date_link a.linkpage:hover {
	background: #0081c5;
	color: #fff;
}


.card-tag {
	display: block;
}


#company_list {
   /* display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 5px;
    padding: 0 var(--company-block-padding);*/
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}

.icon01 {
	display: block;
    border-radius: 5px;
    background-color: #DE696F;
    color: #fff;
    margin: 5px 0;
    font-size: 0.85em;
	padding: 0.5em 0;
}

.icon01 {
	display: block;
    border-radius: 5px;
    background-color: #DE696F;
    color: #fff;
    margin: 5px 0;
    font-size: 0.85em;
	padding: 0.5em 0;
}

.icon01_n ,
.icon02_n,
.recruit_n {
	visibility: hidden;
}

.icon02 {
	display: block;
    border-radius: 5px;
    background-color: #1F9FD9;
    color: #fff;
    margin: 7px auto 0;
    text-align: center;
    font-size: 0.65em;
    line-height: 1.4em;
    padding: 5px 0;
	width: 100%;
}

.recruit {
	font-weight: bold;
	margin: 7px auto;
}


#company_list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: var(--each-company-w);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 300px;
    border: 1px solid #000;
    margin-bottom: 8px;
    text-align: center;
	/*width: 19%;*/
}

.job_head {
	margin-bottom: 15px;
}

.job img {
	width:  10%;
	display: inline-block;
	margin: 0 2px;
}

.activeFilters {
	vertical-align: sub;

}

.bnrArea {
	margin-bottom: 50px;
}

.bnrArea ul {
	    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
	row-gap: 20px;
}

.bnrArea ul li {
	width: 32%;
	height: auto;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.35);
	background: #fff;
}

.bnrArea ul li a {
	display: block;
	color: #fff;
	text-align: center;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

.bnrArea ul li a img {
		width: 100%;
	height: auto;
}


@media (max-width: 900px) {

.tabs h3 {
	margin: 10px auto;
}

.dates {
    flex-wrap: wrap;
	row-gap:20px;
}

.dates li {
	background: url(../image/topPage/search_frame.svg) #d3edfb no-repeat;
    background-size: auto;
    width: 46%;
    height: 100px;
}

/*.dates li:nth-child(1) {
	background: none;
}*/

.tabcategories{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
row-gap: 10px;
	/*column-gap: 20px;*/
	height: 100%;
}

.tabcategories li {
flex-basis: calc((100% - 20px) / 3);
/*max-width: calc((100% - 20px) / 2);*/
height: 60px;
}

.tabcategories li:nth-of-type(4n-1):nth-last-of-type(1),
.tabcategories li:nth-of-type(4n-2):nth-last-of-type(1){
margin-right: auto;
}

.company-card {
width: 43%;

}

.filter-bar {
    display: grid;
    height: 100%;
    padding: 5px;
    margin-bottom: 10px;
}

.activeFilters {
width: 100%;
margin-bottom: 10px;
}


.filter-bar button {
	padding: 5px;
	font-size: 100%;
}

.result-title {
    margin-bottom: 10px;
}
	
.bnrArea ul li {
	width: 48%;
	height: auto
}

.bnrArea ul li a {
}


}



@media (min-width: 767px) and (max-width: 900px) {
.dates li {
	background-image: none;
	background: #d3edfb no-repeat;
    background-size: auto;
    width: 46%;
    height: 100px;
	border: 1px solid #0081c5;
}
}