@charset "utf-8";
:root {
	--pail-green: #f0f7ed;
	--pink: #ea6da4;
	--light-gray: #dcdcdc;
	--dark-gray: #5a5a5a;
	--white: #fff;
}

input[name="tab__switch"] { opacity: 0; position: absolute; -webkit-appearance: auto; }/*inputを非表示にする*/
.tabs__label { display: flex; flex-wrap: wrap; flex-direction: row; margin: 33px auto 26px; max-width: 840px; }
.tabs__label > label { position: relative; cursor: pointer; display: block; margin-right: 10px; margin-bottom: 10px; z-index: 1; }
.tabs__label > label > span { display: block; box-sizing: border-box; color: #fff; font-size: clamp(1.5rem, calc((15 / 960) * 100vw), 1.5rem); font-weight: 500; line-height: 1.3; padding: 10px 24px; }
.tabs__label > label::before { content: ''; background-color: #c9caca; clip-path: polygon(0% 0%, 100% 0, 100% 70%, 90% 100%, 0% 100%); width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; }
.tabs__label > label::after { content: ''; background-color: rgba(0, 0, 0, 0.4); clip-path: polygon(0% 0%, 100% 0, 100% 70%, 90% 100%, 0% 100%); width: 100%; height: 100%; filter: blur(12px);position: absolute; left: 2px; top: 2px; z-index: -2; }
@media(hover:hover) {
	.tabs__label > label::before { transition: background ease .3s; }
	.tabs__label > label:hover::before { background-color: #f0f7ed; }
	.tabs__label > label { transition: color ease .3s; }
	.tabs__label > label:hover > span { color: #595757; }
}
@media screen and (max-width: 750px) {
	.tabs__label > label { width: 48%; margin-right: 2%; margin-bottom: 2%; }
	.tabs__label > label > span { padding: min(calc((10 / 750) * 100vw), 10px) min(calc((24 / 750) * 100vw), 24px); }
}

#tab__manufact:checked ~ .tabs__label > label[for="tab__manufact"]::before,
#tab__wholesale:checked ~ .tabs__label > label[for="tab__wholesale"]::before,
#tab__service:checked ~ .tabs__label > label[for="tab__service"]::before,
#tab__medical:checked ~ .tabs__label > label[for="tab__medical"]::before,
#tab__info:checked ~ .tabs__label > label[for="tab__info"]::before,
#tab__construct:checked ~ .tabs__label > label[for="tab__construct"]::before,
#tab__transport:checked ~ .tabs__label > label[for="tab__transport"]::before,
#tab__accom:checked ~ .tabs__label > label[for="tab__accom"]::before,
#tab__other:checked ~ .tabs__label > label[for="tab__other"]::before { background-color: #f0f7ed; }

#tab__manufact:checked ~ .tabs__label > label[for="tab__manufact"] > span,
#tab__wholesale:checked ~ .tabs__label > label[for="tab__wholesale"] > span,
#tab__service:checked ~ .tabs__label > label[for="tab__service"] > span,
#tab__medical:checked ~ .tabs__label > label[for="tab__medical"] > span,
#tab__info:checked ~ .tabs__label > label[for="tab__info"] > span,
#tab__construct:checked ~ .tabs__label > label[for="tab__construct"] > span,
#tab__transport:checked ~ .tabs__label > label[for="tab__transport"] > span,
#tab__accom:checked ~ .tabs__label > label[for="tab__accom"] > span,
#tab__other:checked ~ .tabs__label > label[for="tab__other"] > span { color: #595757; }

#tab__manufact:checked ~ #manufact, 
#tab__wholesale:checked ~ #wholesale,
#tab__service:checked ~ #service,
#tab__medical:checked ~ #medical,
#tab__info:checked ~ #info,
#tab__construct:checked ~ #construct,
#tab__transport:checked ~ #transport,
#tab__accom:checked ~ #accom,
#tab__other:checked ~ #other { display: flex; flex-wrap: wrap; flex-direction: row; column-gap: 4%; }

dl.target-details { color: #3e3a39; font-size: clamp(1.4rem, calc((14 / 960) * 100vw), 1.4rem); font-weight: 300; line-height: 1.43; text-align: center; margin-bottom: 48px; }
dl.target-details dt {}
dl.target-details dt::before { content: '【'; }
dl.target-details dt::after { content: '】'; }
dl.target-details dd {}
dl.target-details dd > ul { list-style: none; }
dl.target-details dd > ul > li {}

.cards--company { display: none; max-width: 1000px; margin: auto; }

.groups { width: 48%; max-width: 480px; }
.groups .group { margin-bottom: 4%; }
@media screen and (max-width: 750px) {
	.groups { width: 100%; max-width: 100%; }
}

.group details { background-color: var(--white); color: var(--dark-gray); }
@media(hover:hover) {
	.group details { cursor: pointer; }
}
.group details::after { content: ''; display: block; background: url("../img/details_arrow_down.svg") var(--light-gray) center center no-repeat; background-size: 70px 10px; border: 0; box-sizing: border-box; width: 100%; height: 20px; padding: 5px 10px; transition: background ease .15s; pointer-events: none; }
.group details[open]::after { background-image: url("../img/details_arrow_up.svg"); pointer-events: auto; }

.group details summary.group__header { background-color: var(--pail-green); display: flex; flex-direction: row; column-gap: 4.16%; list-style-type: none; padding: 10px; }
.group details summary.group__header:focus-within { outline: 2px solid #000; }
.group details summary.group__header > div { display: flex; flex-direction: column; width: calc(100% - 37.5%); }
.group details summary.group__header > figure { aspect-ratio: 180 / 200; background-color: var(--white); display: flex; align-items: center; width: 37.5%; margin-left: auto; overflow: hidden; }
.group details summary.group__header > figure > img { width: 100%; height: auto; vertical-align: middle; object-fit: cover; }

ul.icons--target { display: flex; column-gap: 5px; margin-bottom: 9px; }
ul.icons--target li { flex-shrink: 0; color: transparent; margin-right: 3px; margin-bottom: 3px; width: 35px; height: 25px; }
ul.icons--target li.icon--target01 { background: url("../img/icon_target01@2x.png") center center no-repeat; background-size: contain; }/* 26卒 */
ul.icons--target li.icon--target02 { background: url("../img/icon_target02@2x.png") center center no-repeat; background-size: contain; }/* 既卒 */
ul.icons--target li.icon--target03 { background: url("../img/icon_target03@2x.png") center center no-repeat; background-size: contain; }/* 27卒 */
ul.icons--target li.icon--target04 { background: url("../img/icon_target04@2x.png") center center no-repeat; background-size: contain; width: 43px; }/* 留学生 */

.company-name { margin-bottom: 14px; }
.company-name small { display: block; font-size: 50%; font-weight: 100; }
.company-name span { font-size: clamp(2rem, calc((20 / 960) * 100vw), 2rem); font-weight: bold; line-height: 1.5; }

dl.com-info { font-size: clamp(1.2rem, calc((12 / 960) * 100vw), 1.2rem); line-height: 1.4; margin-top: auto; }
dl.com-info dt { flex-shrink: 0; }
dl.com-info dt::after { content: ':'; display: inline-block; vertical-align: middle; }
dl.com-info dd { padding-left: 6px; }
dl.com-info div { display: flex; }
dl.com-info div.industry dt { letter-spacing: 1.2rem; margin-right: -1.2rem; }
dl.com-info div.industry dt::after { margin-left: -1.2rem; }
dl.com-info div.location {}

.recruit-info {}
.recruit-info__message { padding: 20px 10px; }
.recruit-info__message p { font-size: clamp(1.6rem, calc((16 / 960) * 100vw), 1.6rem); line-height: 1.5; }

dl.recruit-info__list {}
dl.recruit-info__list dt { font-size: clamp(1.6rem, calc((16 / 960) * 100vw), 1.6rem); font-weight: bold; line-height: 1.5; padding: 4px 10px;  background-color: var(--pail-green); }
dl.recruit-info__list dd { background-color: var(--white); padding: 14px 10px; }
dl.recruit-info__list dd > ul { list-style: disc; font-size: clamp(1.5rem, calc((15 / 960) * 100vw), 1.5rem); font-weight: 500; margin-left: 15px; }
dl.recruit-info__list dd > ul > li {}

h5.work-exp__ttl { background-color: var(--pink); color: #fff; font-size: clamp(1.5rem, calc((15 / 960) * 100vw), 1.5rem); font-weight: bold; padding: 4px 10px; }
.work-exp { padding: 10px; }
.work-exp p > strong { font-size: clamp(1.8rem, calc((18 / 960) * 100vw), 1.8rem); font-weight: bold; line-height: 1.3; }
.work-exp p { font-size: clamp(1.5rem, calc((15 / 960) * 100vw), 1.5rem); line-height: 1.46; }