/*　ヘッダー　************************************************/

/*  index  ***/
.recruit-career main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_career.webp);
	background-position: center bottom;
}

/*  joblist  ***/
/*  tmp_detail.html   ***/
.recruit-career-joblist main,
.recruit-career-detail main{
    background-image: url(/-/media/HOME/recruit/new/images/career/nain_joblist.webp);
	background-position: center bottom;
}

/*  conditions  ***/
.recruit-career-conditions main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_conditions.webp);
	background-position: center bottom;
}

/*  faq  ***/
.recruit-career-faq main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_careerfaq.webp);
	background-position: center bottom;
}

/*  referral  ***/
.recruit-career-referral main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_referral.webp);
	background-position: center bottom;
}

/*  alumni  ***/
.recruit-career-alumni main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_alumni.webp);
	background-position: center bottom;
}

/*  apply  ***/
.recruit-career-apply main{
    background-image: url(/-/media/HOME/recruit/new/images/career/main_apply.webp);
	background-position: center bottom;
}


/*　ヘッダー　************************************************/





/*　index　************************************************/


.recruit-career .firstbox h2{
    font-size: 22px;
    padding: 10px 20px;
    color: var(--komatsu-blue);
    background-color: var(--komatsu-yellow);
    text-align: center;
}

.recruit-career .firstbox #linklist{
    padding-top: 30px;
}

.recruit-career .firstbox ul{
    width: 47.4137931%;
    border-bottom: var(--komatsu-blue) solid 1px;
    margin-bottom: 10px;
    padding: 20px 0px 20px 0;
}

.recruit-career .firstbox ul li a {
    transition: all 500ms 0s ease;
    display: block;
    line-height: 1;
    font-size: 18px;
}

.recruit-career .firstbox .arrow_r::before{
    content: "";
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    border-top: var(--komatsu-yellow) solid 3px;
    border-right: var(--komatsu-yellow) solid 3px;
    transform: rotate(45deg);
    top: calc(50% - 4px);
    right: 10px;
}

.recruit-career .firstbox ul li a:hover {
  padding-left: .5em;
}

@media screen and (max-width: 640px){

    .recruit-career .firstbox #linklist{
        padding-top: 15px;
        padding-bottom: 20px;
    }

    .recruit-career .firstbox ul{
        width: 100%;
        border-bottom: var(--komatsu-blue) solid 1px;
        margin-bottom: 10px;
        padding: 20px 0px 20px 0;
    }
}


@media screen and (max-width: 480px){

    .recruit-career .firstbox h2{
        font-size: 18px;
    }

    .recruit-career .firstbox ul li a {
        font-size: 16px;
    }

    .recruit-career .firstbox .arrow_r::before{
        width: 8px;
        height: 8px;
    }


}




.recruit-career #buttonbox{
    margin-top: 100px;
}



.recruit-career #buttonbox .triangle {
    position: absolute;
    width: 40%;
    right: 0;
    bottom: 0;
    
}

.recruit-career #buttonbox .triangle span{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

.recruit-career #buttonbox .triangle::before {
    content: "";
    display: block;
    padding-top: 137.5%;
}

.recruit-career #buttonbox ul li{
    width: 31.5%;
    padding-bottom: 50px;
}

.recruit-career #buttonbox figure{
    z-index: 1;
}

.recruit-career #buttonbox aside{
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 5;
    width: 50px;
    height: 50px;
}

.recruit-career #buttonbox .bt_more{
    width: 100%;
    height: 100%;
}

.recruit-career #buttonbox figcaption{
    padding-top: 10px;
}

.recruit-career #buttonbox figcaption strong{
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 10px;
}

.recruit-career #buttonbox figcaption strong{
    font-size: 18px;
}

.recruit-career #buttonbox figcaption p{
    text-align:justify;
    text-justify:distribute;
    line-height: 2;
    font-size: 14px;
}

@media screen and (max-width: 1200px){

    .recruit-career #buttonbox .bt_more{
        width: 4.16666667vw;
        height: 4.16666667vw;
        min-width: 40px;
        min-height: 40px;
    }
}


@media screen and (max-width: 1023px){
    .recruit-career #buttonbox ul li{
        width: 48.5%;
    }
}


@media screen and (max-width: 767px){

    .recruit-career #buttonbox{
        margin-top: 60px;
    }

    
    .recruit-career #buttonbox ul li{
        width: 100%;
        max-width: 450px;
        margin: 0 auto;
    }
    
    .recruit-career #buttonbox figcaption{
        padding-top: 7px;
    }

    .recruit-career #buttonbox .triangle {
        width: 60%;
    }
}

@media screen and (max-width: 480px){
    .recruit-career #buttonbox figcaption p{
        font-size: 13px;
    }
}

/*　index　************************************************/




/*　joblist　************************************************/




.recruit-career-joblist #searchbox{
    background-color: var(--komatsu-yellow);
}






/* search *********************************/


.recruit-career-joblist #searchbox .search_table_row {
    padding: 0 0 24px;
    border-bottom: 1px solid #FFF;
    margin-bottom: 25px;
}

.recruit-career-joblist #searchbox .search_reset{
    position: absolute;
    width: 150px;
    height: 50px;
    border-radius: 25px;
    border: rgba(20, 10, 154,.5) solid 1px;
    cursor: pointer;
    overflow: hidden;
    z-index: 30;
}

.recruit-career-joblist #searchbox .search_reset{
    right: 0px;
    top: 0px;
}

.recruit-career-joblist #searchbox .search_reset a{
    transition: all 500ms 0s ease;
    display: flex;
    flex-wrap: wrap;
	align-content: center;
    font-size: 18px;
    width: 100%;
    height: 100%;
    padding-left: 60px;
}

.recruit-career-joblist #searchbox .search_reset a span{
    position: absolute;
    width: 22px;
    height: 24px;
    left: 20px;
    top: calc(50% - 12px) ;
    line-height: 1;
}

.recruit-career-joblist #searchbox .search_reset a em{
    display: inline-block;
    padding-bottom: 2px;
}

.recruit-career-joblist #searchbox .search_reset a:hover{
    background-color: rgba(20, 10, 154,.2);
}


.recruit-career-joblist #searchbox .search_table_th{
    font-size:18px;
    width: 160px;
    padding-top: 10px;
    line-height: 1;
}

.recruit-career-joblist #searchbox .search_table_td{
    width : calc(100% - 160px) ;
}

.recruit-career-joblist #searchbox .search_table_td li{
    display: inline-block;
    margin: 0 5px 7px 0px;
}

.recruit-career-joblist #searchbox .search_checkbox {
    cursor: pointer;
    user-select: none;
}

.recruit-career-joblist #searchbox .search_checkbox input[type="checkbox"] {
    appearance: none;
    position: absolute;
    display: none;
}

.recruit-career-joblist #searchbox .search_checkbox input[type="checkbox"]:checked + span,
.recruit-career-joblist #searchbox .bt_cat_c_all.active span{
    background-color: var(--komatsu-blue);
    color: #FFF;
}

.recruit-career-joblist #searchbox .bt_cat_c_all span,
.recruit-career-joblist #searchbox .search_checkbox span {
    display: inline-block;
    padding: 10px 20px;
    background: rgba(255, 255, 255, .80);
    line-height: 1.1;
    font-size: 16px;
    text-align: center;
    transition: 0.2s all ease;
    border-radius: 8px;
    cursor: pointer;
}

.recruit-career-joblist #searchbox input[type*="text"] {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 5px 10px;
  border: 1px solid var(--komatsu-middlegray);
  background: #fff;
  box-sizing: border-box;
  font-size: 1.4rem;
}

.recruit-career-joblist #searchbox input[type*="text"]:focus {
  outline: none;
}

.recruit-career-joblist #btn_carrer_search_box{
    text-align: center;
    padding-top: 20px;
}

.recruit-career-joblist .btn_carrer_search {
  padding: 0 30px 2px 15px;
  transition: all .1s linear;
  outline: none;
  border: none;
  border-radius: 6px;
  background-color: var(--cp-blue);
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.3;
  min-width: 300px;
  height: 50px;
  cursor: pointer;
}

.recruit-career-joblist .btn_carrer_search > span {
  position: relative;
  padding-left: 25px;
}

.recruit-career-joblist .btn_carrer_search > span::before{
    content: "";
    position: absolute;
    top: calc(50% - 7px);
    left: 0;
    width: 19px;
    height: 18px;
    background: url(/-/media/HOME/recruit/new/images/career/com_search_ic01.png) no-repeat;
}

@media screen and (max-width: 1023px){
    
    
    .recruit-career-joblist #searchbox .search_table_th{
        font-size:16px;
        width: 130px;
        padding-top: 10px;
        line-height: 1;
    }

    .recruit-career-joblist #searchbox .search_table_td{
        width : calc(100% - 130px) ;
    }

    .recruit-career-joblist #searchbox .search_table_td li{
        margin: 0 4px 6px 0px;
    }

    .recruit-career-joblist #searchbox .bt_cat_c_all span,
    .recruit-career-joblist #searchbox .search_checkbox span {
        padding: 8px 18px;
        font-size: 15px;
        border-radius: 6px;
        cursor: pointer;
    }

    .recruit-career-joblist #searchbox .search_reset{
        width: 130px;
        height: 42px;
        border-radius: 21px;
        border: rgba(20, 10, 154,.5) solid 1px;
    }

    .recruit-career-joblist #searchbox .search_reset{
        right: auto;
        top: calc(100% + 40px) ;
        left: 50%;
        transform: translateX(-50%);
    }

    .recruit-career-joblist #searchbox .search_reset a{
        font-size: 16px;
        width: 100%;
        height: 100%;
        padding-left: 50px;
    }

    .recruit-career-joblist #searchbox .search_reset a span{
        position: absolute;
        width: 20px;
        height: 22px;
        left: 20px;
        top: calc(50% - 11px) ;
        line-height: 1;
    }

}


@media screen and (max-width: 540px){

    .recruit-career-joblist #searchbox .search_table_th{
        font-size:18px;
        width : 100%;
        padding-bottom: 20px;
    }

    .recruit-career-joblist #searchbox .search_table_td{
        width : 100%;
    }

}

@media screen and (max-width: 480px){

    .recruit-career-joblist #searchbox .search_table_th{
        font-size:15px;
        width : 100%;
        padding-bottom: 20px;
    }

    .recruit-career-joblist #searchbox .bt_cat_c_all span,
    .recruit-career-joblist #searchbox .search_checkbox span {
        padding: 8px 12px;
        font-size: 13px;
        border-radius: 6px;
        cursor: pointer;
    }

}

/* search *********************************/


/* resultbox *********************************/
/* 
.recruit-career-joblist #resultbox{
    padding: 100px 0px;
} */

.recruit-career-joblist #resultbox a{
    transition: all 500ms 0s ease;
    /* width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; */
    display: block;
    width: 100%;
    border-radius: 10px;
    padding:10px 15px 10px 50px;
    margin-bottom: 20px;
    background-color: var(--komatsu-lightgray);
    overflow: hidden;
}

.recruit-career-joblist #resultbox a::before{
    transition: all 500ms 0s ease;
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    background-color: var(--komatsu-yellow);
    background-color: var(--komatsu-middlegray);
    height: 100%;
    left: 0;
    top: 0;
}

.recruit-career-joblist #resultbox a::after{
    content: "";
    position: absolute;
    display: block;
    width: 8px;
    height: 8px;
    border-right: var(--komatsu-blue) solid 2px;
    border-bottom: var(--komatsu-blue) solid 2px;
    border-right: #FFF solid 2px;
    border-bottom: #FFF solid 2px;
    top: 50%;
    left: 8px;
    transform: translateY(-50%) rotate(-45deg);
    z-index: 5;
}

.recruit-career-joblist #resultbox a div{
    display: inline-block;
    width: auto
}

.recruit-career-joblist #resultbox a div span{
    display: block;
    width: 100%;
    background-color: var(--komatsu-blue);
    color: #FFF;
    padding: 5px 10px;
    line-height: 1;
    text-align: center;
}

.recruit-career-joblist #resultbox a aside{
    display: inline-block;
    width: auto
}

.recruit-career-joblist #resultbox a aside span{
    display: block;
    background-color: #FFF;
    color: var(--komatsu-blue);
    width: 100%;
    padding: 5px 10px;
    line-height: 1;
    text-align: center;
}

.recruit-career-joblist #resultbox a p{
    transition: all 500ms 0s ease;
    display: block;
    /* width: calc(100% - 320px) ; */
    padding-top: 5px;
    line-height: 1.6;
    font-size: 16px;
}

.recruit-career-joblist #resultbox a:hover{
    background-color: var(--komatsu-yellow);
}

.recruit-career-joblist #resultbox a:hover::before{
    background-color: var(--komatsu-gray);
}

.recruit-career-joblist #resultbox a:hover p{
    color: var(--komatsu-blue);
}


/* resultbox *********************************/






/* detail */

.recruit-career-common #bthistorybox .bt_historyback{
    text-align: right;
    padding-top: 20px;
    padding-bottom: 50px;
    border-top: var(--komatsu-lightblue) solid 1px;
    margin: 0 100px;
}

@media screen and (max-width: 1439px){
  .recruit-career-common #bthistorybox .bt_historyback{
    margin: 0 calc(53px + 47 * (100vw - 769px) / 671);
  }
}

@media screen and (max-width: 767px) {
  .recruit-career-common #bthistorybox .bt_historyback{
    margin: 0 8vw;
  }
}

.recruit-career-common #bthistorybox .bt_historyback .bt_more{
    border: var(--komatsu-blue) solid 1px; 
}

.recruit-career-common #commonbox #databox{
    padding-bottom: 50px;
}


.recruit-career-common #commonbox #detail_title{
    background-color: var(--komatsu-lightgray);
    padding: 15px 20px 20px;
    font-size: 18px;
    border-top-left-radius: 10px; /* 左上　*/
    border-top-right-radius: 10px;
    border-bottom: var(--komatsu-yellow) solid 3px;
    margin-bottom: 30px;
}

.recruit-career-common #commonbox #detail_title div{
    display: inline-block;
    width: auto
}

.recruit-career-common #commonbox #detail_title div span{
    display: block;
    width: 100%;
    background-color: var(--komatsu-blue);
    color: #FFF;
    padding: 5px 10px;
    line-height: 1;
    text-align: center;
    
}

.recruit-career-common #commonbox #detail_title aside{
    display: inline-block;
    width: auto
}

.recruit-career-common #commonbox #detail_title aside span{
    display: block;
    background-color: #FFF;
    color: var(--komatsu-blue);
    width: 100%;
    padding: 5px 10px;
    line-height: 1;
    text-align: center;
}

.recruit-career-common #commonbox #detail_title p{
    transition: all 500ms 0s ease;
    display: block;
    /* width: calc(100% - 320px) ; */
    padding-top: 10px;
    line-height: 1.6;
    font-size: 24px;

    text-align:justify;
    text-justify:distribute;
}

@media screen and (max-width: 767px){
    .recruit-career-common #commonbox #detail_title{
        font-size: 16px;
    }

    .recruit-career-common #commonbox #detail_title p{
        font-size: 22px;
    }

}

@media screen and (max-width: 480px){
    .recruit-career-common #commonbox #detail_title p{
        font-size: 20px;
    }
}

@media screen and (max-width: 380px){
    .recruit-career-common #commonbox #detail_title div,
    .recruit-career-common #commonbox #detail_title aside{
        width: 100%;
    }

    
}



/* .recruit-career-common #commonbox .resultbox_inner{
    width: calc(100% - 20px);
    margin: 0 0 0 auto;
} */



.recruit-content .firstbox #first_titlebox #commonbox h2{
    padding-bottom: 10px;
    font-size: 22px;
}

.recruit-career-common #commonbox h2 {
  font-size: 22px;
  padding: 10px 20px;
  color: #000;
  background-color: var(--komatsu-yellow);
  margin-top: 40px;
}

.recruit-career-common #commonbox dl {
    border-bottom: var(--komatsu-lightblue) solid 1px;
    padding: 30px 0;
    font-size: 16px;
}

.recruit-career-common #commonbox dl dt {
    font-weight: 500;
    width: 190px;
    color: var(--komatsu-blue);
    font-size: 16px;
    line-height: 1.2;
    padding-left: 20px;
}

.recruit-career-common #commonbox dl dd {
    width: calc(100% - 230px);
    text-align: justify;
    text-justify: distribute;
    line-height: 1.8;
}

.recruit-career-common #commonbox dl dd a{
    color: var(--komatsu-blue);
    text-decoration: underline;
}

.recruit-career-common #commonbox dl dd strong{
    font-weight: 500;
    font-size: 105%;
    padding-bottom: 3px;
}


@media screen and (max-width: 767px){
    .recruit-career-common #commonbox h2 {
        font-size: 19px;
        padding: 8px 10px;
        margin-top: 20px;
    }

    .recruit-content .firstbox #first_titlebox #commonbox h2{
        padding-bottom: 8px;
        font-size: 19px;
    }
    

    .recruit-career-common #commonbox dl{
        width: calc(100% - 20px);
        margin: 0 auto;
    }
    .recruit-career-common #commonbox dl dt {
        width: 100%;
        padding-bottom: 15px;
        padding-left: 0;
        font-size: 18px;
    }

    .recruit-career-common #commonbox dl dd {
        width: 100%;
        font-size: 15px;
    }
}

@media screen and (max-width:480px){
    .recruit-career-common #commonbox dl {
        width: 100%;
        padding: 25px 0;
        font-size: 15px;
    }

    .recruit-career-common #commonbox h2 {
        font-size: 19px;
        padding: 8px 10px;
        margin-top: 0px;
    }
}












.recruit-career-common #commonbox .commonbox_inner{
    padding: 30px 20px;
}

.recruit-career-common #commonbox #applybox strong{
    display: inline-block;
    font-weight: 500;
    border: var(--komatsu-blue) solid 1px;
    margin: 5px 0px;
    padding: 5px 15px;
    font-size: 16px;
    color: var(--komatsu-blue);
}


.recruit-career-common #commonbox #mailbox p{
    font-size: 18px;
    background-color: var(--komatsu-lightgray);
}

.recruit-career-common #commonbox #mailbox p strong{
    display: block;
    width: 100px;
    padding: 10px;
    background-color: var(--komatsu-blue);
    color: var(--komatsu-yellow);
    text-align: center;
}

.recruit-career-common #commonbox #mailbox p span{
    display: block;
    width: calc(100% - 110px) ;
    padding: 10px;
}

.recruit-career-common #commonbox #selectionbox li{
    border: var(--komatsu-gray) solid 2px;
    background-color: #FFF;
    border-radius: 10px;
    margin-bottom: 80px;
    padding: 10px;
}


.recruit-career-common #commonbox #selectionbox li aside{
    display: grid;
    align-items: center;
    padding: 20px;
    width: 200px;
    font-size: 18px;
    font-weight: 500;
    border-radius: 5px;
    line-height: 1;
    background-color: var(--komatsu-lightgray);
}


.recruit-career-common #commonbox #selectionbox li p{
    width : calc(100% - 220px) ;
    min-height: 50px;
    display: grid;
    flex-wrap: wrap;
    align-items: center;
    font-size: 16px;
    line-height: 1.6;
    text-align:justify;
    text-justify:distribute;
}

.recruit-career-common #commonbox #selectionbox li:not(:last-of-type)::before{
    content: "";
    position: absolute;
    display: block;
    width: 70px;
    height: 40px;
    background: var(--komatsu-gray);
    bottom: -60px;
    left: 50%;
    transform: translateX(-50%);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
}

@media screen and (max-width: 767px){

    .recruit-career-common #commonbox .commonbox_inner{
        padding: 30px 10px;
    }

        
    .recruit-career-common #commonbox #mailbox p{
        font-size: 16px;
    }

    .recruit-career-common #commonbox #mailbox p strong{
        display: block;
        width: 100%;
        padding: 10px;
        text-align: left;
    }

    .recruit-career-common #commonbox #mailbox p span{
        display: block;
        width: 100%;
        padding: 10px;
    }




    .recruit-career-common #commonbox #selectionbox li{
        border: var(--komatsu-gray) solid 1px;
        margin-bottom: 60px;
        padding: 12px;
    }

    .recruit-career-common #commonbox #selectionbox li:not(:last-of-type)::before{
        width: 55px;
        height: 30px;
        bottom: -45px;
    }

    .recruit-career-common #commonbox #selectionbox li aside{
        padding: 15px;
        width: 150px;
        font-size: 18px;
    }


    .recruit-career-common #commonbox #selectionbox li p{
        width : calc(100% - 170px) ;
        min-height: 50px;
        font-size: 15px;
        
    }

}




@media screen and (max-width: 540px){

     .recruit-career-common #commonbox #selectionbox li aside{
        padding: 10px 15px;
        width: 100%;
        font-size: 18px;
    }


    .recruit-career-common #commonbox #selectionbox li p{
        width: 100%;
        min-height: 50px;
        font-size: 15px;
        padding: 15px 0px
    }

}


@media screen and (max-width: 480px){
     .recruit-career-common #commonbox .commonbox_inner{
        padding: 30px 0px;
    }

}



/* detail */






























/* conditions */



.recruit-career-conditions #guidelinebox dl {
    border-bottom: var(--komatsu-lightblue) solid 1px;
    padding: 30px 0;
    font-size: 16px;
}

.recruit-career-conditions #guidelinebox dl:first-of-type{
    border-top: var(--komatsu-lightblue) solid 1px;
}


.recruit-career-conditions #guidelinebox dl dt {
    font-weight: 500;
    width: 150px;
    color: var(--komatsu-blue);
    font-size: 16px;
}

.recruit-career-conditions #guidelinebox dl dd {
    width: calc(100% - 200px);
    text-align: justify;
    text-justify: distribute;
}

.recruit-career-conditions #guidelinebox dl dd strong{
    font-weight: 500;
    font-size: 105%;
    padding-bottom: 3px;
}

@media screen and (max-width: 767px){
    .recruit-career-conditions #guidelinebox dl dt {
        width: 100%;
        padding-bottom: 15px;
        font-size: 18px;
    }

    .recruit-career-conditions #guidelinebox dl dd {
        width: 100%;
        font-size: 15px;
    }
}

@media screen and (max-width:480px){
    .recruit-career-conditions #guidelinebox dl {
        padding: 25px 0;
        font-size: 15px;
    }
}


/* conditions */






/*　faq　************************************************/

.recruit-career-faq #faq_buttonbox{
    padding: 30px 0;
}

.recruit-career-faq #faq_buttonbox li{
    width: 23.5%;
    height: 54px;
}

.recruit-career-faq #faq_buttonbox li .bt_faq{
    transition: all 500ms 0s ease;
    display: flex;
    flex-wrap: wrap;
	align-content: center;
	justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 27px;
    background-color: #FFF;
    color: var(--komatsu-blue);
    z-index: 5;
    padding: 0px 10px 15px;
	cursor: pointer;
    text-align: center;
    line-height: 1.4;
}


.recruit-career-faq #faq_buttonbox .bt_faq.bt_down::before{
	content: "";
	position: absolute;
	display: block;
	width: 7px;
	height: 7px;
	border-bottom: var(--komatsu-blue) solid 1px;
    border-right: var(--komatsu-blue) solid 1px;
    left: 50%;
	bottom: 10px;
	transform: translateX(-50%) rotate(45deg);
}


@media screen and (max-width: 1023px) {
    .recruit-career-faq #faq_buttonbox li{
        width: 48.5%;
        margin-bottom: 4%;
    }

     .recruit-career-faq #faq_buttonbox li:nth-of-type(n+2){
        margin-bottom: 0%;
     }
}


@media screen and (max-width: 480px){

    .recruit-career-faq #faq_buttonbox li{
        height: 64px;
    }

    .recruit-career-faq #faq_buttonbox li .bt_faq{
        border-radius: 32px;
        line-height: 1.2;
    }

     .recruit-career-faq #faq_buttonbox .bt_faq.bt_down::before{
        width: 7px;
        height: 7px;
        bottom: 10px;
        padding-top: 0px;
    }
}

@media screen and (max-width: 360px){
    .recruit-career-faq #faq_buttonbox .bt_faq{
        font-size: 12px;
    }
}



.recruit-career-faq #faq_detailbox h2{
    font-size: 26px;
    text-align: center;
    padding: 10px;
    color: var(--komatsu-blue);
    background-color: var(--komatsu-yellow);
    margin-bottom: 50px;
}

.recruit-career-faq #faq_detailbox h2:nth-of-type(n+2){
    margin-top: 100px; 
}

.recruit-career-faq #faq_detailbox dl{
    margin-bottom: 50px;
    border-bottom: var(--komatsu-lightblue) solid 2px;
}

.recruit-career-faq #faq_detailbox dl dt{
    padding-right: 50px;
    min-height: 70px;
    padding-bottom: 20px;
    font-size: 18px;
    cursor: pointer;
}

.recruit-career-faq #faq_detailbox dl dt::before,
.recruit-career-faq #faq_detailbox dl dt::after{
    transition: all 500ms 0s ease;
    content: "";
    position: absolute;
    display: block;
    width: 20px;
    height: 2px;
    background-color: var(--komatsu-blue);
    right: 15px;
    top: 25px;
}

.recruit-career-faq #faq_detailbox dl dt::after{
    transform: rotate(90deg);
}

.recruit-career-faq #faq_detailbox dl.active dt::before{
    transform: rotate(540deg);
}

.recruit-career-faq #faq_detailbox dl.active dt::after{
    transform: rotate(540deg);
}


.recruit-career-faq #faq_detailbox dl dt div{
    display: grid;
    align-items: center;
    padding: 0px 0px 0px 70px;
    min-height: 50px;
    font-size: 18px;
    line-height: 1.4;
    text-align:justify;
    text-justify:distribute;
}

.recruit-career-faq #faq_detailbox dl dt div::before{
    content: "";
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    left: 0;
    top: 0;
    background-image: url(/-/media/HOME/recruit/new/images/career/i_qy.svg);
    background-size: cover;
}

.recruit-career-faq #faq_detailbox dl dd{
    padding-right: 50px;
    display: none;
    overflow: hidden;
    border-top: var(--komatsu-middlegray) dashed 1px;
}

.recruit-career-faq #faq_detailbox dl dd div{
    display: grid;
    align-items: center;
    padding: 20px 0px 40px 70px;
    min-height: 110px;
    text-align:justify;
    text-justify:distribute;
    line-height: 2;

}

.recruit-career-faq #faq_detailbox dl dd div::before{
    content: "";
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    background-image: url(/-/media/HOME/recruit/new/images/career/i_ay.svg);
    background-size: cover;
    left: 0;
    top: 20px;
}

.recruit-career-faq #faq_detailbox dl dd small{
    display: inline-block;
}


@media screen and (max-width: 767px){

    .recruit-career-faq #faq_detailbox h2{
        font-size: 22px;
    }

    .recruit-career-faq #faq_detailbox dl{
        margin-bottom: 40px;
    }

    .recruit-career-faq #faq_detailbox dl dt{
        padding-right: 40px;
        min-height: 55px;
        padding-bottom: 20px;
        
    }

    .recruit-career-faq #faq_detailbox dl dt::before,
    .recruit-career-faq #faq_detailbox dl dt::after{
        width: 15px;
        height: 2px;
        right: 10px;
        top: 20px;
    }

    .recruit-career-faq #faq_detailbox dl dt span{
        padding: 0px 0px 0px 60px;
        min-height: 40px;
        font-size: 16px;
    }

    .recruit-career-faq #faq_detailbox dl dt span::before{
        width: 40px;
        height: 40px;
    }

    .recruit-career-faq #faq_detailbox dl dd{
        padding-right: 50px;
        padding-right: 0px;
    }

    .recruit-career-faq #faq_detailbox dl dd span{
        padding: 0px 0px 20px 0px;
        min-height: 90px;
    }

    .recruit-career-faq #faq_detailbox dl dd span::before{
        width: 40px;
        height: 40px;
    }
    
}


@media screen and (max-width: 480px){

    .recruit-career-faq #faq_detailbox dl{
        margin-bottom: 30px;
    }

    .recruit-career-faq #faq_detailbox dl dd{
        /* padding-right: 10px; */
    }

    .recruit-career-faq #faq_detailbox dl dt div{
        padding: 0px 0px 0px 50px;
        font-size: 16px;
    }

    .recruit-career-faq #faq_detailbox dl dt div::before{
        width: 35px;
        height: 35px;
    }

    .recruit-career-faq #faq_detailbox dl dd div{
        padding: 20px 0px 30px 50px;
    }

    .recruit-career-faq #faq_detailbox dl dd div::before{
        width: 35px;
        height: 35px;
    }

}



/*　faq　************************************************/





/*　recruit-career-common　************************************************/

.recruit-career-common .career_minititle{
    width: 250px;
}

.recruit-career-common .career_minitxt{
    width: 65%;
}

.recruit-career-common .career_minititle h3 {
    font-size: 24px;
    line-height: 1.8;
    font-weight: 500;
    color: var(--komatsu-blue);
    padding-bottom: 30px;
}

.recruit-career-common .career_minititle h3::before {
    content: "";
    position: absolute;
    display: block;
    width: 50px;
    height: 5px;
    bottom: 0;
    left: 0;
    background-color: var(--komatsu-blue);
}

.recruit-career-referral .career_minitxt dl:not(:last-of-type){
    padding-bottom: 40px;
}

.recruit-career-referral .career_minitxt dl dt{
    width: 120px;
}

.recruit-career-referral .career_minitxt dl dt span{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    border-radius: 5px;
    background-color: var(--komatsu-yellow);
    color: var(--komatsu-blue);
    font-size: 20px;
}

.recruit-career-referral .career_minitxt dl dd{
    width : calc(100% - 140px) ;
    min-height: 50px;
    display: grid;
    flex-wrap: wrap;
    align-items: center;
    font-size: 18px;
}

.recruit-career-referral .career_minitxt dl dd .note{
    font-size: 88%;
}


.recruit-career-alumni .career_minitxt p{
    font-size: 18px;
    text-align:justify;
    text-justify:distribute;
    line-height: 1.8;
    padding-bottom: 30px;
}




@media screen and (max-width: 900px){
    .recruit-career-common .career_minititle{
        width: 100%;
        padding-bottom: 50px;
    }

    .recruit-career-common .career_minitxt{
        width: 100%;
        padding-bottom: 50px;
    }

    
}


@media screen and (max-width: 767px){

    .recruit-career-common .career_minititle{
        padding-bottom: 40px;
    }

    .recruit-career-common .career_minititle h3 {
        font-size: 20px;
        padding-bottom: 20px;
    }

    .recruit-career-common .career_minititle h3::before {
        width: 40px;
        height: 4px;
    }

    .recruit-career-referral .career_minitxt dl dt{
        width: 100px;
    }

    .recruit-career-referral .career_minitxt dl dt span{
        height: 40px;
        font-size: 17px;
    }

    .recruit-career-referral .career_minitxt dl dd{
        width : calc(100% - 125px) ;
        min-height: 40px;
        font-size: 15px;
    }

    .recruit-career-referral .career_minitxt dl:not(:last-of-type){
        padding-bottom: 30px;
    }

}



@media screen and (max-width: 480px){

    .recruit-career-common .career_minititle h3 {
        font-size: 18px;
    }

    .recruit-career-referral .career_minitxt dl dt{
        width: 80px;
    }

    .recruit-career-referral .career_minitxt dl dt span{
        height: 40px;
        font-size: 16px;
    }

    .recruit-career-referral .career_minitxt dl dd{
        width : calc(100% - 95px) ;
        min-height: 40px;
        font-size: 14px;
    }

    .recruit-career-alumni .career_minitxt p{
        font-size: 16px;
    }

}


.recruit-career-alumni #applybox a{
    width: 100%;
}
/* 
.recruit-career-alumni #applybox a .bt_long{
    background-color: var(--komatsu-yellow);
    color: var(--komatsu-blue);
}

.recruit-career-alumni #applybox .bt_long::before{
    border-color: var(--komatsu-blue);
} */



.recruit-career-alumni #applybox .triangle {
    position: absolute;
    width: 400px;
    right: 0;
    top: 0;
}

.recruit-career-alumni #applybox .triangle span{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

.recruit-career-referral #stepbox .triangle {
    position: absolute;
    width: 400px;
    left: 0;
    bottom: 0px;
}

.recruit-career-referral #stepbox .triangle  span{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    clip-path: polygon(0 0, 0% 100%, 100% 100%);
}


.recruit-career-common .triangle::before {
    content: "";
    display: block;
    padding-top: 137.5%;
}


@media screen and (max-width: 480px){

    .recruit-career-alumni #applybox .triangle {
        position: absolute;
        width: 70%;
        right: 0;
        top: auto;
        bottom: 0;
        clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    }

    .recruit-career-referral #stepbox .triangle {
        position: absolute;
        width: 70%;
        left: 0;
        clip-path: polygon(0 0, 0% 100%, 100% 0);
    }
}

/*　recruit-career-common　************************************************/


.recruit_new .cp_HeadingText1 h2{
  font-size: 22px;
  padding: 10px 20px;
  color: #000;
  background-color: var(--komatsu-yellow);
  margin-top: 40px;
}

.recruit_new .cp_Accordion{
    padding: 80px 0px 40px;
}

@media screen and (max-width: 1023px) {
    .recruit_new .cp_Accordion{
        padding: 7.82013685vw 0px 20px;
    }
}

@media screen and (max-width: 767px) {
    .recruit_new .cp_Accordion{
        padding: 40px 0px 20px;
    }
}


.recruit_new .accordion_dl-wrap{
    border: 1px solid #a5abaf;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
}

.recruit_new .accordion_dl {
    border-top: none;
}

.recruit_new .accordion_dl .accordion_dt{
    padding-left: 20px;
    border-bottom: none;
    background-color: var(--komatsu-lightgray);
}

.recruit_new .accordion_dl .accordion_dt div{
    text-align:justify;
    text-justify:distribute;    
}

.recruit_new .accordion_dl .accordion_dt.open {
    border-bottom: none;
    background-color: var(--komatsu-blue);
    color: #FFF;
}

.recruit_new .accordion_dl .accordion_dd-inr{
    padding-top: 0;
    padding-bottom: 0;
    border-top: solid 1px #a5abaf;
}

.recruit_new .accordion_dl .accordion_dd-inr > div{
    padding: 25px;
}

.recruit_new .cp_2ColList{
    margin-bottom: 0px;
}

.recruit_new .cp_2ColList > dl > div:first-of-type{
    border-top: none;
}

.recruit_new .cp_2ColList > dl > div:last-of-type{
    border-bottom: none;
}

.recruit_new .accordion_dl .accordion_dd-inr > div.cp_2ColList dl div{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}


.recruit_new .accordion_dl .accordion_dd-inr > div.cp_2ColList dl div dt{
    font-weight: 500;
    width: 190px;
    color: var(--komatsu-blue);
    font-size: 16px;
    margin-right: 0;
    line-height: 1.2;
    display: flex;

}

.recruit_new .accordion_dl .accordion_dd-inr > div.cp_2ColList dl div dd{
    width: calc(100% - 240px);
    text-align: justify;
    text-justify: distribute;
    line-height: 1.8;
    font-size: 16px;
}



@media screen and (max-width: 767px){

    .recruit_new .accordion_dl .accordion_dt {
        padding-right: 50px;
    }

    .recruit_new .accordion_dt::before,
    .recruit_new .accordion_dt::after{
        right: 15px;
    }

    .recruit_new .accordion_dl .accordion_dt div{
        line-height: 1.6;
    }

    .recruit_new .accordion_dl .accordion_dd-inr > div{
        padding-top: 0;
        padding-bottom: 0;
    }

    .recruit_new .accordion_dl .accordion_dd-inr > div.cp_2ColList dl div dt{
        width: 100%;
        font-size: 16px;
        margin-right: 0;
        line-height: 1.2;
        display: flex;
        margin: 0;
        padding-top: 25px;
    }

    .recruit_new .accordion_dl .accordion_dd-inr > div.cp_2ColList dl div dd{
        width: 100%;
        padding: 20px 0 30px;
        font-size: 14px;
    }

}



@media screen and (max-width: 480px){

    .recruit_new .accordion_dl .accordion_dt{
        padding: 10px 50px 10px 15px;
    }

    .recruit_new .accordion_dl .accordion_dd-inr > div{
        padding: 0 15px;
    }

}