.line-gray{ width: 100%; display: block; height: 3px; background: #c6c6c6;}
.thumb-recruit{ margin-bottom: 50px;}
.thumb-recruit h2{ font-size: 24px; font-weight: bold; text-align: center; line-height: 1.5;}
.thumb-recruit ul{ display: flex; flex-wrap: wrap; padding: 0; margin: 0;}
.thumb-recruit ul li{ display: block; width: 31.33%; margin: 12px 1%; border-radius: 8px; overflow: hidden;
    -webkit-box-shadow: 0px 4px 13px -2px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 4px 13px -2px rgba(0,0,0,0.75);
    box-shadow: 0px 4px 13px -2px rgba(0,0,0,0.75);}
.thumb-recruit ul li .img-recruit img{ width: 100%;}
.thumb-recruit ul li .text-thumb{ padding: 14px 14px 28px 14px; font-size: 14px; font-weight: 400;}
.thumb-recruit ul li .title-thumb{ border-left: 3px solid #122d9b; padding-left: 12px; font-size: 18px; font-weight: bold; margin: 0;}

.recruit{ margin: 22px auto 50px;}
.recruit h3{ margin-bottom: 8px; font-size: 18px;}
.text-topic{ padding: 8px 4px 24px; font-size: 13px; font-weight: 500; line-height: 1.8;}
.table-detail ul{ display: table; width: 100%; border-collapse: collapse; padding: 0; margin: 0;}
.table-detail ul li{ display: table-row;}
.table-detail ul li div{ display: table-cell; border: 1px solid #c6c6c6; padding: 12px 8px; font-size: 13px; color: #000;}
.table-detail ul li div:first-child{ background: #f1f1f1; text-align: center; vertical-align: middle; width: 108px;}

.salary{ border: none !important; padding: 0!important; width: 100%!important; background: none!important;}
.salary ul{ display: table; width: 100%;}
.salary ul li{ display: table-row;}
.salary ul li span{ display: table-cell; padding: 8px 8px; background: #fff; text-align: left;}
.salary ul li span:first-child{ width: 85px;}

.remark{ padding:30px 24px; background: #f1f1f1; font-size: 13px; font-weight: 500; text-align: left; line-height: 1.8; margin-bottom: 22px;}
.detail-more{ padding: 8px 12px; width: 150px; background: #fff; border: 2px solid #122d9b; color: #122d9b; margin: 4px auto; text-align: center; font-weight: 500;}
.detail-more:hover{ background: #122d9b; color: #fff; transition: all 0.3s ease-in-out;}

.sub-title{color: #122d9b; font-size: 18px; font-weight: 500; display: block; width: 100%; text-align: center; padding: 12px 0; border-bottom: 1px solid #c6c6c6;}

@media(max-width:768px){
    .recruit{ margin: 0 auto 14px; padding: 8px;}
}

@media(max-width:680px){
    .thumb-recruit ul li{ width: 48%;}
}

@media(max-width:480px){
    .table-detail ul li div:first-child{ width: 75px;}

    .salary ul,
    .salary ul li,
    .salary ul li span { display: block; width: 100%; padding: 4px 0; text-indent: 6px;}    
    .salary ul li span:first-child{ width: 100%; border-top: 1px solid #d7d7d7; font-weight: bold; text-indent: 0;}
    .salary ul li span:first-child::after{content: ":"; margin-left: 12px;}
    .salary ul li:first-child span{ border-top: 0;}

    .thumb-recruit ul li{ width: 90%; margin: 8px auto;}
}