
.footer-area .text-left { text-align:left!important }
.footer-area .text-right { text-align:right!important }
.footer-area .text-center { text-align:center!important }

.footer-area .row-layout { display:flex;width:100%; }
.footer-area .row-layout > .col { box-sizing:border-box;padding:0px 15px; }
.footer-area .row-layout > .col-a { width:350px; }
.footer-area .row-layout > .col-b { width:100%; }

.footer-area .label { margin:10px 5px;margin-bottom:5px; }
.footer-area .label.mt { margin-bottom:20px; }
.footer-area .label img { max-width:100%; }
.footer-area .label img.full { width:100% }

.footer-area hr.line { border:none;border-bottom:1px #9b0e11 solid;background:none;margin:30px 0px; }
.footer-area img { max-width:100%; }

.footer-area .mb { margin-bottom:10px }
.footer-area .row { display:flex;width:100%;padding:8px 0px;padding-top:0px;box-sizing:border-box;  }
.footer-area .row.mb { margin-bottom:10px }
.footer-area .row > .col { box-sizing:border-box;padding:0px 5px; }
.footer-area .row > .col-1 { width:8.333%; }
.footer-area .row > .col-2 { width:16.666%; }
.footer-area .row > .col-3 { width:25%; }
.footer-area .row > .col-4 { width:33.333%; }
.footer-area .row > .col-5 { width:41.666%; }
.footer-area .row > .col-6 { width:50%; }
.footer-area .row > .col-7 { width:58.333%; }
.footer-area .row > .col-8 { width:66.666%; }
.footer-area .row > .col-9 { width:75%; }
.footer-area .row > .col-10 { width:83.333%; }
.footer-area .row > .col-11 { width:91.666%; }
.footer-area .row > .col-12 { width:100%; }
.footer-area .row > .col.dot { position: relative; }
.footer-area .row > .col.dot:after { content:':';position:absolute;right:7px;top:11px;color:#fff; }

.footer-area .row-input { display:flex;width:100%;padding:12px 5px;padding-top:0px;box-sizing:border-box; }
.footer-area .row-input label { font-weight:400;font-size:11pt;padding:10px 15px 0px 5px;display:inline-block;width:100%;text-align:right;box-sizing:border-box  }
.footer-area .row-input label .red { color:#ff0000 }
.footer-area .row-input label.checkbox { padding-top:0px;margin-bottom:10px; }
.footer-area .row-input .input { display:block;width:100%;box-sizing:border-box;padding:10px 17px;border:1px #ddd solid;border-radius:6px;color:#333;font-size:11pt; }
.footer-area .row-input .input.icon { padding-left:50px; }
.footer-area .row-input .input.icon.user { background:url(../img/career-2019/icon/users.png) left 15px center no-repeat; }
.footer-area .row-input .input.icon.lock { background:url(../img/career-2019/icon/lock2.png) left 15px center no-repeat; }
.footer-area .row-input .btn { display:block;width:100%;box-sizing:border-box;padding:10px 17px;border-radius:6px;background-color:#273184;color:#fff;font-size:11pt;text-align:center;cursor: pointer;border:none; transition:background .5s, color .5s  }
.footer-area .row-input .btn:hover { background-color:#1c5193;  }
.footer-area .row-input .btn.default { background-color:#acacac;color:#fff;font-weight:400; }
.footer-area .row-input .btn.primary { background-color:#f2b134;color:#111;font-weight:400;  }
.footer-area .row-input .btn.link { background-color:transparent;color:#fff;text-decoration:underline;font-style:italic;opacity:.8;  }
.footer-area .row-input .btn.inline { display:inline }
.footer-area .row-input .input-select { display:block;width:100%;box-sizing:border-box;border:1px #ddd solid;border-radius:6px;color:#888;font-size:11pt;position: relative; }
.footer-area .row-input .input-select::after { content:'';height:0px;width:0px;border:6px transparent solid;border-top-color:#777;position: absolute;right:10px;top:18px;  }
.footer-area .row-input .input-select::before { content:'';border-left:1px #ddd solid;position: absolute;right:30px;top:5px;bottom:5px;  }
.footer-area .row-input .input-select select { appearance: none;-webkit-appearance: none; background:none;border:none;padding:0px;width:100%;padding:10px 17px;font-size:11pt;color:#888;position: relative;z-index:1; }
.footer-area .row-input label.input-radio { display:inline-block!important;margin-right:10px;width:auto }
.footer-area .row-input .link { color:#f2b134;font-style:italic;text-decoration:underline;opacity:.8;  }

.footer-area.white  , .footer-area.white label { color:#fff; }

.footer-area .helper { color:#777;margin:0px 10px 5px 10px;font-size:14px; }
.footer-area .helper a { color:#777 }
.footer-area .helper.danger { color:#ff0000; }
.footer-area .helper.danger a { color:#ff0000 }

.footer-area.white .helper { color:#fff;opacity:.8;}

.footer-area .row-input.danger {}
.footer-area .row-input.danger .input { border-color:#ff0000 }
.footer-area .row-input.danger .helper { font-size:15pt }
.footer-area .row-input.danger .helper.danger { display:block; }


.footer-area .panel { margin-bottom:30px; }
.footer-area .panel.bg { background-color:#f0f0f0 }
.footer-area .panel > .heading { background-color:#273284;color:#fff;padding:10px 30px;font-size:18pt; }
.footer-area .panel > .body { padding:20px 0px; }


.footer-area .btn-area { text-align:center;margin:30px 0px; }
.footer-area .btn-area.nbd { border:0px;margin-top:0px; }
.footer-area .btn-area .btn { display:inline-block;width:auto;min-width:200px;margin-left:5px;padding:10px 20px;font-size:18px; }
.footer-area .btn-area .btn.primary { background-color:#f2b134;color:#111;font-weight:400;  }
.footer-area .btn-area .btn.icon { padding-left:50px;background-repeat:no-repeat;background-position:left 20px center;  }
.footer-area .btn-area .btn.icon.doc { background-image:url(../img/career-2019/icon/doc.png);background-size:auto 18px;background-color:#E0E0E3!important;color:#273186 }
.footer-area .btn-area .btn.icon.mail { background-image:url(../img/career-2019/icon/mail.png);background-size:auto 14px; }

.footer-area { text-align:center;padding:20px 30px;  }
.footer-area h2 { margin:20px 0px; }
.footer-area .list { text-align:left;font-size:15px; line-height:18px;white-space: nowrap; }
.footer-area .btn { display:block;margin:10px 0px; }
.footer-area .link { color:#111;font-size:16px;display:inline-block;margin-bottom:3px;border-bottom:1px #333 solid;font-weight:bold;  }




@media only screen and (max-width: 1100px) {
  .footer-area { margin:20px; }
  .footer-area > .wrapper { margin:0px; }
  .footer-area .list {white-space:normal; }

  .md-hide { display:none; }

  .footer-area .row { flex-flow:row wrap }
  .footer-area .row > .col-md-1 { width:8.333%; }
  .footer-area .row > .col-md-2 { width:16.666%; }
  .footer-area .row > .col-md-3 { width:25%; }
  .footer-area .row > .col-md-4 { width:33.333%; }
  .footer-area .row > .col-md-5 { width:41.666%; }
  .footer-area .row > .col-md-6 { width:50%; }
  .footer-area .row > .col-md-7 { width:58.333%; }
  .footer-area .row > .col-md-8 { width:66.666%; }
  .footer-area .row > .col-md-9 { width:75%; }
  .footer-area .row > .col-md-10 { width:83.333%; }
  .footer-area .row > .col-md-11 { width:91.666%; }
  .footer-area .row > .col-md-12 { width:100%; }

  .career-user-menu .step-area { display:none; }
}

@media only screen and (max-width: 800px) {
  .footer-area .row-layout { display:block }
  .footer-area .row-layout > .col { width:auto }

  .footer-area .row > .col-sm-1 { width:8.333%; }
  .footer-area .row > .col-sm-2 { width:16.666%; }
  .footer-area .row > .col-sm-3 { width:25%; }
  .footer-area .row > .col-sm-4 { width:33.333%; }
  .footer-area .row > .col-sm-5 { width:41.666%; }
  .footer-area .row > .col-sm-6 { width:50%; }
  .footer-area .row > .col-sm-7 { width:58.333%; }
  .footer-area .row > .col-sm-8 { width:66.666%; }
  .footer-area .row > .col-sm-9 { width:75%; }
  .footer-area .row > .col-sm-10 { width:83.333%; }
  .footer-area .row > .col-sm-11 { width:91.666%; }
  .footer-area .row > .col-sm-12 { width:100%; }
  .footer-area .row-input > .col-sm-12.dot:after { display:none; }
}

@media only screen and (max-width: 600px) {
  .xs-hide { display:none; }
  .career-user-menu > .wrapper { padding:20px }
  .career-user-menu .user-info-area { display:block;text-align:center;padding:0px; }
  .career-user-menu .user-info-area > .detail-area { margin:20px 0px; }
  .career-user-menu .user-info-area ul.menu-area .btn { min-width:100px; }

  .footer-area { margin:20px;font-size:15pt }
  .footer-area .panel > .heading { font-size:16pt; }
  .footer-area table thead { font-size:16pt; }
  .footer-area table tbody { font-size:15pt; }

  .footer-area h1.heading { font-size:20pt; }

  .footer-area .btn-area .btn { min-width:100px;}
  .reverse-block { display:flex;flex-direction:column-reverse }
  .reverse-block .btn { margin-bottom:10px; }

  .prompt-career .card { margin:0px 20px; }



  .footer-area .row > .col-xs-1 { width:8.333%; }
  .footer-area .row > .col-xs-2 { width:16.666%; }
  .footer-area .row > .col-xs-3 { width:25%; }
  .footer-area .row > .col-xs-4 { width:33.333%; }
  .footer-area .row > .col-xs-5 { width:41.666%; }
  .footer-area .row > .col-xs-6 { width:50%; }
  .footer-area .row > .col-xs-7 { width:58.333%; }
  .footer-area .row > .col-xs-8 { width:66.666%; }
  .footer-area .row > .col-xs-9 { width:75%; }
  .footer-area .row > .col-xs-10 { width:83.333%; }
  .footer-area .row > .col-xs-11 { width:91.666%; }
  .footer-area .row > .col-xs-12 { width:100%; }
  .footer-area .row-input > .col-xs-12 .btn.inline { display:block; }

  .footer-area .row > .col-offset-xs-1 { margin-left:8.333%; }
  .footer-area .row > .col-offset-xs-2 { margin-left:16.666%; }

  .footer-area .row-input { padding-bottom:10px;padding:12px 0px; }
  .footer-area .row-input > .col-xs-12 label { text-align:left;margin-top:0px;padding-top:0px;padding-bottom:4px; }
  .footer-area .row-input > .col-xs-12 label.text-right {  text-align:left!important; }
  .footer-area .row-input > .col-xs-12.dot:after { display:none; }
  .footer-area .row-input > .col-xs-12 .input { margin-bottom:3px }
  .footer-area .row-input > .col-xs-12 .input-select { margin-bottom:3px }
  .footer-area .row-input > .col-xs-12 .input-radio { display:block!important;margin-left:15px;margin-top:5px;}

  .footer-area .row-xs-nmb { margin-bottom:0px;padding-bottom:4px }
  .footer-area .row-xs-mb { margin-bottom:10px; }

  .footer-area .row-layout > .col { padding:0px; }

  .footer-area hr.line { margin:20px 0px; }

  .footer-area .row > .col.col-2.col-xs-12{
      width: 33.33%;
  }
  .footer-area .row > .col.col-2.col-xs-12 .list{

    font-size:14px;
  }
}

@media only screen and (max-width: 768px) {
    .web-footer{
        font-size: 13px;
    }
    .footer-area .list{
        font-size: 13px;
    }
}

@media only screen and (max-width: 400px) {
  .footer-area .row-layout > .col { padding:0px 10px; }
}
