.kv {
  background-image: url("");
}
body,main{
  background-color: #F6F8FB;
}
.multi-intro-group{
    margin-top: 0;
}
.job-detail {
  padding: 120px 0 0 0;
}
.job-detail .container {
  background-color: white;
  padding: 60px 50px 0 50px;
  max-width: 1200px;
  margin: 0 auto;
  width: calc(80vw - 50px);
  color: #444;
  position: relative;
}
.job-detail .container .back-btn {position: absolute;right:50px;top: -55px;padding: 7px 22px;}
.jobs-tltle{position: relative; top: -100px;left: 0;line-height: 0;  font-size: 28px; color: #2c5dbc;}


.job-detail .container .title {width: 100%;}
.job-detail .container .title h2 {color: #333; font-size: 20px; font-weight: normal;display: flex;  flex-direction: row;justify-content: space-between; flex-wrap: wrap;    margin: 0 0 10px 0;}
.job-detail .container .title h3 {color: #777; font-size: 16px;  font-weight: normal;  display: flex;  flex-direction: row;  gap: 20px;padding: 10px 0 0 0;}
.job-detail .container .title span{font-size:15px;font-weight:normal;margin:0 0 0 20px;color:#555;}


.job-detail .container hr {
  opacity: 0.2;
  margin: 30px 0 0 0;
}
.job-detail .container .date {
  margin-bottom: 14px;
  color: #888;
  font-size: 16px;
}
.job-detail .container .sub-title {
  font-size: 20px;
  color: #333;
  margin: 30px 0 14px 0;
}
.job-detail .container .job-info {
  line-height: 2;
  font-size: 18px;
}
.job-detail .container .btn-group {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}
.job-detail .container .apply-btn {
  margin-top: 40px;
  padding: 10px 42px;
  letter-spacing: 1px;
}
.job-detail .container #confirm-apply {
  margin-top: 40px;
}
.job-detail .container .download-btn {
  background-color: #E65804;
  padding: 0 20px;
  border-radius: 4px;
  color: white;
  display: flex;
  align-items: center;
  height: 44px;
  gap: 10px;
  line-height: 1;
  width: fit-content;
}
.job-detail .container .upload-btn {
  margin: 30px auto 0 auto;
  padding: 0 50px;
  height: 50px;
  display: flex;
  align-items: center;
}

.hide{
  display: none;
}

.submit-group{
    width: 80%!important;
padding-top: 30px;
display: flex;
align-items: flex-start !important;
gap: 20px;
flex-direction: column !important;
}
.form-table{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:  center;
  gap: 4%;
  padding: 40px 0;
}

.form-table .form-item{
  width: 80%;
  display: flex;
  align-items: center;
  margin: 0 0 20px 0;
}

.text-group{display: flex; flex-direction: column !important; align-items: flex-start !important;  flex-wrap: nowrap !important;gap: 15px;}
.text-group>textarea{    width: 95%;}

.form-table .half-item{
  width: 38%;
}

.form-table .form-item>label{
    min-width: 120px;
    display: inline-block;
    text-align:left;
    padding: 0 15px 0 0;
}

.form-table .form-item>label i{color: #ff0000;font-style: normal;text-align: center;}
.files-group h3 i{color: #ff0000;font-style: normal;text-align: center;}

.form-table .form-item>input{width: 100%;border-color: transparent;border-style: solid;border-width: 1px; outline: none;padding: 14px;border-radius: 5px; background-color: #f5f5f5;font-size: 16px;    color: #333;font-family: auto;}
.form-table .form-item>select{width: 100%;border-color: transparent;border-style: solid;border-width: 1px; outline: none;padding: 14px;border-radius: 5px; background-color: #f5f5f5;font-size: 16px;    color: #333;font-family: auto;}
.form-table .form-item input[type="radio"]{margin: 0 0 0 20px;    color: #333;font-family: auto;}


.form-table .extra-input-group{
    display: flex;
    gap: 5px;
    align-items: center;
    margin: 10px 0 20px 0;
}

.form-table .extra-input-group input{
    width: 100px;
    border-color: transparent;
    border-style: solid;
    border-width: 1px; outline: none;padding: 10px 14px;border-radius: 5px; background-color: #f5f5f5;font-size: 16px;    color: #333;font-family: auto;
}

.more-input{width: 100%; max-width: 100%; border-color: transparent;border-style: solid;border-width: 1px;  outline: none; padding: 14px; border-radius: 5px;  background-color: #f5f5f5;
  margin: 0px;}

.form-table .form-item>textarea{
  border-color: transparent;border-style: solid;border-width: 1px; 
  outline: none;
  padding: 20px;
  border-radius: 5px;
  background-color: #f5f5f5;
  font-size: 16px;
      color: #333;
      font-family: auto;
}


.submit-btn{width: 280px;}

.captcha{
  display: flex;
   display: flex;
  align-items: center;
  gap: 10px;
}
 .captcha input {
  max-width: 200px;
  width: 100%;
  border: none;
  outline: none;
  padding: 14px;
  border-radius: 5px;
  background-color: #f5f5f5;
}
 .captcha img {
  height: 36.5px;
  width: 118px;
}
.files-group{margin: 30px 0 20px 0; display: flex; flex-direction: column;flex-wrap: wrap;width: 80%;   justify-content: space-around;    border-top: 1px #ebebeb solid;   padding: 30px 0 0 0;}
.files-group span{    display: flex;align-content: center;   flex-wrap: wrap;   flex-direction: row;align-items: center;justify-content: flex-start;gap: 20px;}
.files-group h3{font-size: 16px; font-weight: normal;  margin: 10px 0 10px 0;  text-align: left;min-width: 120px;display: flex;
    flex-direction: row;align-items: center;}
.files-group i{font-size: 14px;font-style: normal;clear: both;color: #c91919; line-height:40px;}


.loading{
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0,0,0,0.5);
  z-index: 9999;
  left: 0;
  top: 0;
}

.loading div{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  color: white;
  font-size: 24px;
  opacity: .9;
}
.pointers{cursor: pointer;text-decoration:underline;}
.pointers:hover{color:#2c5dbc}

@media screen and (max-width: 1025px) {
  .job-detail { padding: 180px 0;}
  .job-detail .container {padding: 30px 20px;width: 80vw;}
  .jobs-tltle{top: -65px; left: 0;}
  .job-detail .container .back-btn {position: absolute;right: 20px;top:-55px;}
}

    
@media screen and (max-width: 850px) {
    .form-table {display: flex;  gap: 4%; padding: 40px 0;width: 100%; flex-wrap: wrap; justify-content: space-around; flex-direction: column;align-content: center;}
.form-table .form-item { width: 95%;}
.form-table .half-item { width: 95%;}
.text-group>textarea { width: 92%;}
.job-detail .container .title h2{font-size: 20px;line-height:28px}
.job-detail .container .title h3{font-size: 18px;line-height:28px;color: #888;}
.job-detail .container span{font-size: 14px;color:#555;}
}

@media screen and (max-width: 550px) {
    .job-detail {  padding: 150px 0; }
    .job-detail .container{padding: 20px 20px;}
     .form-table .half-item {width: 95%;font-size:14px;}
     .form-table .form-item{width: 95%;font-size:14px;margin: 10px 0;}
    .job-detail .container .back-btn{padding: 4px 10px;right: 10px;  top: -58px;}
    .form-table .form-item>label{min-width: 23%;display: inline-block;  text-align: left;  padding: 0 12px 0 0;font-size:14px;}
    .form-table .form-item>input{font-size:14px;}
    .form-table .form-item .radio-group{width:100%;font-size:14px;}
    .form-table .form-item>textarea{font-size:14px;}
    .form-table .form-item>select{font-size:14px;}
    .more-input{max-width: 100%;width:100%;padding: 10px;margin:0;}
    .form-table .submit-group{ display: flex;   align-items: center;  flex-direction: column;}
    .form-table .text-group{display: flex;flex-wrap: wrap;flex-direction: column;align-items: flex-start;gap: 10px;}
    .form-table .text-group>textarea{width: 88% !important;}
    .files-group span{gap: 5px;  margin: 0 0 20px 0;}
    .files-group{width: 95% ;}
    .job-detail .container .title{gap:20px;}
    .job-detail .container .title h2{width:100%}
    .submit-group{width: 95% !important;}
    .submit-btn{width: 86%;margin: 10px auto;}
    .job-detail .container .title h3{font-size:16px;line-height:20px;color: #888;}
}
@media screen and (max-width: 450px) {
    .jobs-tltle{font-size: 22px;}
}
 





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

    .btn{
        padding: 6px 12px;
    }
}




.row{
  display: flex;
  align-items: center;
}

.extra-form{
  position: relative;
}


.extra-form .text-limit-tips{
  position: absolute;
  right: 0px;
  bottom: 10px;
  top: auto;
}


.form-item:has(.form-more-tips){
  margin-bottom: 40px;
  position: relative;
}


.form-more-tips{
  position: absolute;
  bottom: -20px;
  left: 140px;
  font-size: 12px;
  color: #666;
}