* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

body {
    background-color: var(--back);
}

h2,h3,a,p {
    display: block;
}

.FV {
    background: linear-gradient(90deg, rgba(23, 56, 151, 0.5) 0%, rgba(63, 93, 179, 0.5) 100%), url(../company/company-fv.jpg) no-repeat center center;
    background-blend-mode: multiply;
    background-size: cover;
}

@media (max-width: 650px) {
    .FV {
        background: linear-gradient(90deg, rgba(23, 56, 151, 0.5) 0%, rgba(63, 93, 179, 0.5) 100%), url(../company/company-spfv.jpg) no-repeat center center;
        background-blend-mode: multiply;
        background-size: cover;
    }
}

.FV hgroup {
    color: white;
}

img {
    width: 100%;
}

.text {
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 1.2;
}

ol li,
ul li {
    list-style: none;
}

/********************************

　　一覧ページ

********************************/
section.fv {
    border-bottom: 2px solid black;
    padding-top: 40vh;
}

section.fv hgroup {
    margin: 32px auto;
    padding: 0 8px;
    max-width: 1200px;
    font-weight: bold;
    letter-spacing: 0.1em;
}

section.fv hgroup h1 {
    margin: 24px auto;
    font-size: 40px;
    color: var(--main);
}

.job_list {
    margin-top: 60vh;
}

.job_list ul {
    display: grid;
    justify-items: center;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
    margin: 24px auto;
    padding: 0 8px;
    max-width: 1000px;
}

.job_list ul li {
    aspect-ratio: 3/1;
    height: 100px;
}

.job_list ul li a {
    padding: 0 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

.job_list ul li a::after {
    content: "";
    width: 10px;
    height: 10px;
    border: 1px solid white;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateX(-25%) rotate(45deg);    
}

.job_list ul li a h2 {
    color: white;
    padding: 24px 16px;
}

.job_list .first_department .seisan,.office-work .FV {
    background: url(../seisankanri_icon.png), url(../metal.jpg), #ED3E40;
    background-position: center;
    background-size: cover;
    background-blend-mode: normal, multiply, normal;
}

.job_list .first_department .design,.design .FV {
    background: url(../sekkei_icon.png), url(../metal.jpg), #ED3E40;
    background-position: center;
    background-size: cover;
    background-blend-mode: normal, multiply, normal;
}

.job_list .second_department .welding,.manufacturing .FV {
    background: url(../yousetu_icon.png), url(../metal.jpg), #0082AF;
    background-position: center;
    background-size: cover;
    background-blend-mode: normal, multiply, normal;
}

.job_list .second_department .shipment,.shipment .FV {
    background: url(../haisou_icon.png), url(../metal.jpg), #0082AF;
    background-position: center;
    background-size: cover;
    background-blend-mode: normal, multiply, normal;
}

.job_list .sales_department .sales,.sales .FV {
    background: url(../sales_icon.png), url(../metal.jpg), #0F7553;
    background-position: center;
    background-size: cover;
    background-blend-mode: normal, multiply, normal;
}

@media (min-width: 600px) {
    section.fv {
        padding: 40vh 30px 30px;
    }

    section.fv hgroup h1 {
        font-size: 80px;
    }

    section.fv hgroup p {
        font-size: 40px;
    }

    .job_list ul {
        margin: 50px auto 130px;
    }
}

/**********
各種募集要項
***********/
.FV > hgroup h1 span {
    font-size: clamp(24px, 4vw, 50px);
    padding: 0 16px;
}

.hg_con h2 span {
    font-size: clamp(18px, 2vw, 24px);
    padding: 0 14px;
}