body {
    font-family: 'Noto Sans JP',sans-serif;
}

section{
    max-width: 1200px;
    margin: 0 auto;
}

hgroup p {
    color: #0000FB;
    font-family:  'outfit';
    display: flex;   
    align-items: center;
    padding-left: 7px;
}

hgroup p::before {
    content :"";
    height: 6px;
    width: 6px;
    background-color: #0000FB;
    margin: 3px;
}

hgroup h2{
    color: #2A2A2A;
    margin: 5px;
    font-size: min(7vw, 36px);
    line-height: 1em;
}

dl div dt{
    color: #FFFFFF;
    background-color: #010088;
    padding: 20px 35px;
    flex-basis: 30%;
}

dl div dd{
    background-color: #EFF8FF;
    padding: 20px 35px;
    margin: 0;
    color: #384158;
}

dl div dd span{
    display: inline-block;
}

@media (min-width: 640px) {
    dl {
        margin: 60px 20px
    }
   
    dl div {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        margin: 10px;
    }
    
    dl div dt {
        width: 30%;
    }

    dl div dd {
        width: 70%;
    }
}
/*************************************************

fv

********************************************************/
div.fv {
    padding: 20px 20px 0;
    max-width: 1200px;
    margin: 0 auto;
    background-image: url(../logo2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}

div.fv hgroup {
    padding-top: 200px;
    padding-bottom: 40px;
}

div.fv h1 {
    color: #010088;
    margin: 0;
    font-size: min(4vw,20px);
}

@media(min-width:640px){
    div.fv hgroup {
        height: 50%;
        padding-bottom: 100px;
    }
}

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

navigation

*******************************************/
#navigation { 
    background-color: #01009D;
    padding: 10px;
}

#navigation a {
    text-decoration: none;
    color: white;
    margin: 10px;
    display: flex;   
    align-items: center;
    gap: 20px; 
}

#navigation a::after {
    content :"";
    background-image: url(../sankaku.svg);
    height:12px;
    width: 12px;
   
    background-repeat: no-repeat;
}

@media(min-width:640px){
    #navigation {
        display: flex;
        justify-content: center;
    }

    #navigation a {
        gap: 3px;
        margin: 7px;
    }
}

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

recruit-civilengineering

*****************************************/
#recruit-civilengineering {
    padding: 20px 20px 10px 20px;
}

#recruit-civilengineering div{
    margin: 16px 0;
}

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

recruit-worker

*******************************************/
#recruit-worker {
    padding: 0px 18px 80px 18px;
}

#recruit-worker a{
    color: #0000FB;
    font-family:  'outfit';
    display: flex;   
    align-items: center;
    padding-left: 7px;
    padding-top: 112px;
}

#recruit-worker a::before {
    content :"";
    height: 6px;
    width: 6px;
    background-color: #0000FB;
    margin: 3px;
}

#recruit-worker h2{
    color: #2A2A2A;
    margin: 5px;
    font-size: min(7vw, 36px);
}

#recruit-worker div{
    margin: 16px;
}