*{
    padding: 0;
    margin: 0;
}
html,body{
  height: 100%;
}
body{
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Lantinghei SC', 'Helvetica Neue', Arial, 'Open Sans', 'Hiragino Sans GB', sans-serif;
}
ul li{
  list-style: none;
}
.hr{
  margin: 0.5rem 0 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  width: 100%;
}
a,h1,h2,h3,h4,h5,h6,span{
  color: white;
}
p{
  color: rgba(255, 255, 255, 0.6);
}
a:hover{
  text-decoration: none;
}
.navbar-toggler{
  padding: 0;
}
/* main */
#main{
    position: relative;
    max-width: 1920px;
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    width: 100%;
    padding-bottom: 150px;
    background-color: black;
  }
  .b-black{
    background-color: black;
  }
  .job-logo{
    width: 400px;
    height: auto;
  }
 .school-container,.job-container,.job-desc-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-origin: content-box;
    background-size: cover;
  }
  .job-container{
    background-image: url(../../img/job/bg.png);
  }
  .school-container{
    background-image: url(../../img/job/school-bg.png);
  }
  .job-desc-container{
    background-image: url(../../img/job/job-desc-bg.png);
  }
  .job-container .top{
    z-index: 2;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
  }
  .title{
    position: absolute;
    top: 50%;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: translateY(-50%);

  }
  .title-en,.title-cn{
    width: 462px;
    font-weight: 500;
    color: #FFFFFF;
    text-shadow: 0px 2px 19px rgba(106, 59, 7, 0.21);
    text-align: center;
  }
  .title-cn{
    font-size: 32px;
    line-height: 45px;
  }
  .title-en{
    font-size: 15px;
    line-height: 22px;
    letter-spacing: 4px;
  }
  .job-entrance{
    width: 428px;
    height: 230px;
    background: #141414;
    border-radius: 8px;
  }
  .joinUs{
    margin-top: 50px;
    margin-bottom: 0;
  }
  .joinUs a{
    color: #7eb9ec;
    text-decoration: underline;
    font-size: 60px;
  }
  .joinUs a:hover{
    color: #7eb9ec;

  }
 
/* faq */


.school-notice-outter{
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: fixed;
  outline: 0;
  overflow: auto;
}
.school-notice-container{
  position: relative;
  top: 100px;
  outline: 0;
  padding-bottom: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.school-notice{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  width: 800px;
  height: 550px;
  margin: 0 auto;
  background-color: white;
}
.job-detail{
  padding-top:56px;
  min-height:100%
}
.modal{
  top: 20%;
}
.modal h5{
  color: black;
}
.modal h2{
  color: black;
}
.modal p{
  color: black;
}
@media only screen and (max-width: 576px){
 
}
@media only screen and (max-width: 769px){
    
  .job-logo{
    width: 220px;
    height: auto;
  }
  .title h1{
    color: white;
    font-size: 30px;
    line-height: 60px;
  }
  .joinUs a{
    font-size: 40px;
  }
  .school h4{
      font-size: 1.2rem;
  }
  .navbar-toggle{
    border-color: #333;
  }
  .navbar-brand{
    margin-right: auto;
  } 
  .navbar{
    height: auto;
  }
  .title-cn{
    font-size: 25px;
  }
  .title-en{
    font-size: 12px;
  } 
}
@media only screen and (min-width: 769px){
    .login-btn{
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 86px;
      height: 25px;
      font-size: 12px;
      border-radius: 20px;
      border: 1px solid #00A2DF;
      cursor: pointer;
  }
  .login-btn span{
      color: #00A2DF;
  }
    
}