@charset "UTF-8";
/* 目次 
* 
*/

/*=================== SPここから ==================*/
/**************************************************
* 共通
***************************************************/
/*------------------------------
レイアウト ※変更不可
------------------------------*/
.pc { display: none; }
.sp { display: block; }


/**************************************************
* TOP
***************************************************/
/*sp-catch*/
ul.sp-catch{
    margin-bottom: 64px;
    list-style: none;
    padding-left: 0;
}
ul.sp-catch li{
    margin-bottom: 1em;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 700;
    padding-left: 2em;
    background: url(../img/checkbox.png) no-repeat left 2px/20px;
}
/**************************************************
* TOP pre_footer_call_to_action.php
***************************************************/
/*求人特集一覧*/
.jpb-feature{
  margin: 96px auto ;
}
.jpb-feature .main-eyecatch-title{
  font-size: 1.8em;
  font-weight: bold;
  line-height: 48px;
  letter-spacing: 2px;
  text-align: center;
}
.jpb-feature .divider-lm {
    border-bottom: solid 4px;
    width: 64px;
    margin: 24px auto 64px;
    color: #004896;
}
.jpb-feature .flex{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin: 50px 0;
}
.jpb-feature .flex .flex-item{
  display: block;
  width: 100%;
  border-left: 3px solid #004896;
  padding: 10px 15px;
  margin-bottom: 15px;
  background: #fff;
  box-shadow: 0 0 10px 2px #eaeaea;
}
.jpb-feature .flex .flex-item a{
  color: #333;
  text-decoration: none;
}
.jpb-feature .flex .flex-item a:hover{
  text-decoration: underline;
}
.jpb-feature .flex .flex-item h4{
  font-weight: bold;
}
.jpb-feature .area-btn a {
  display: block;
  width: 100%;
  max-width: 300px;
  height: 50px;
  line-height: 50px;
  margin: 0 auto;
  border-radius: 25px;
  color: #fff;
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  letter-spacing: 2px;
  background: #004896;
  text-decoration: none;
}
.jpb-feature .area-btn a:hover {
  opacity: 0.8;
}
.jpb-feature .area-btn a img {
  width: 25px;
  margin-right: 10px;
}
/**************************************************
* 求人一覧 archive-job.php
***************************************************/
.joblist-ttl{
  position: relative;
}
.joblist-ttl::before{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 50px 50px 0 0;
  border-color: #043459 transparent transparent transparent;
}
.joblist-ttl h3{
  margin: 0;
  padding: 0.5em 0 0.5em 50px;
  color: #043459;
  font-weight: bold;
}
.joblist-ttl p{
  margin: 0;
  text-align: right;
  color: #043459;
}
.joblist-ttl p span{
  font-size: 1.3em;
  font-weight: bold;
}
ul.tips-detail{
  margin-bottom: 20px;
  padding: 0 15px;
}
ul .job-list{
  margin: 30px -15px;
  list-style-type: none;
}
.job-list .job-ttl{
  background-image: -webkit-linear-gradient(139deg, #004896 0%, #043459 100%);
  padding: 15px 10px;
  color: #fff;
}
.job-list .job-ttl .name,
.job-list .job-ttl .c_name,
.job-list .job-ttl .time{
  margin: 5px 0;
}
.job-list .job-ttl .c_name{
  font-size: 20px;
}
.job-list .job-ttl .time{
  text-align: right;
}
.job-list .job-con{
  padding: 15px 0 0;
}
.job-list .job-con dl{
  margin-bottom: 0;
}
.job-list .job-con dt{
  padding: 15px 0 15px 15px;
  border-left: 5px solid #004896;
  background: #f5f5f5;
}
.job-list .job-con dd{
  padding: 15px 0;
}
.job-list .job-con .flex dl{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 15px;
}
.job-list .job-con .flex dt{
  width: 90px;
}
.job-list .job-con .flex dd{
  width: calc( 100% - 90px );
  padding-left: 15px;
}
.job-list .job-btn a{
  display: block;
  width: 100%;
  max-width: 300px;
  height: 50px;
  line-height: 50px;
  margin: 0 auto;
  border-radius: 25px;
  color: #fff;
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  letter-spacing: 2px;
  background: #004896;
  text-decoration: none;
}
.job-list .job-btn a:hover {
  opacity: 0.8;
}
.job-list .job-btn a img {
  width: 25px;
  margin-right: 10px;
}

/**************************************************
* 求人紹介 single-job.php
***************************************************/
.job-content{
  margin: 0 -15px;
}
.job-content .job-ttl{
  background-image: -webkit-linear-gradient(139deg, #004896 0%, #043459 100%);
  padding: 15px 10px;
  color: #fff;
}
.job-content .job-ttl .name,
.job-content .job-ttl .c_name,
.job-content .job-ttl .time{
  margin: 5px 0;
}
.job-content .job-ttl .c_name{
  font-size: 20px;
}
.job-content .job-ttl .time{
  text-align: right;
}
.job-content .job-con{
  padding: 20px 0;
}
.job-content .job-con dt{
  padding: 15px 0 15px 15px;
  border-left: 5px solid #004896;
  background: #f5f5f5;
}
.job-content .job-con dd{
  padding: 15px 0;
}
.job-content .job-con .flex dl{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.job-content .job-con .flex dt{
  width: 90px;
}
.job-content .job-con .flex dd{
  width: calc( 100% - 90px );
  padding-left: 15px;
}
.job-content .job-btn a{
  display: block;
  width: 100%;
  max-width: 300px;
  height: 50px;
  line-height: 50px;
  margin: 0 auto;
  border-radius: 25px;
  color: #fff;
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  letter-spacing: 2px;
  background: #004896;
  text-decoration: none;
}
.job-content .job-btn a:hover {
  opacity: 0.8;
}
.job-content .job-btn a img {
  width: 25px;
  margin-right: 10px;
}

/*=================== TBここから ==================*/
@media screen and (min-width: 768px) {
	/**************************************************
	* 共通
	***************************************************/
	/*------------------------------
	レイアウト ※変更不可
	------------------------------*/
	.pc { display: block; }
	.sp { display: none; }
	
  /**************************************************
  * TOP pre_footer_call_to_action.php
  ***************************************************/
  /*求人特集一覧*/
  .jpb-feature{
    margin-top: 96px;
  }
  
  .jpb-feature .flex .flex-item{
    width: 49%;
    margin-bottom: 20px;
  }
  /**************************************************
  * 求人一覧 archive-job.php
  ***************************************************/
  .joblist-ttl p{
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .job-list .job-con .flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }
  .job-list .job-con .flex dl{
    width: 35%;
  }
  .job-list .job-con .flex dl:last-of-type{
    width: 30%;
  }
  /**************************************************
  * 求人紹介 single-job.php
  ***************************************************/
  .job-content .job-con .flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }
  .job-content .job-con .flex dl{
    width: 35%;
  }
  .job-content .job-con .flex dl:last-of-type{
    width: 30%;
}/*=================== TBここまで ==================*/


/*=================== PCここから ==================*/
@media screen and (min-width: 1024px) {
  /**************************************************
  * 求人一覧 archive-job.php
  ***************************************************/
  .job-list{
    box-shadow: 0 0 10px 2px #eaeaea;
    padding-bottom: 40px;
    margin: 0;
  }
  .job-list .job-ttl {
    position: relative;
    padding: 10px 20px;
  }
  .job-list .job-ttl .time{
    position: absolute;
    bottom: 10px;
    right: 20px;
  }
  .job-list .job-con{
    padding: 20px;
  }
  .job-list .job-con dd{
    padding: 15px;
  }
  
  /**************************************************
  * 求人紹介 single-job.php
  ***************************************************/
  .job-content{
    box-shadow: 0 0 10px 2px #eaeaea;
    padding-bottom: 40px;
    margin: 0;
  }
  .job-content .job-ttl{
    position: relative;
    padding: 10px 20px;
  }
  .job-content .job-ttl .name,
  .job-content .job-ttl .c_name,
  .job-content .job-ttl .time{
    margin: 10px 0;
  }
  .job-content .job-ttl .time{
    position: absolute;
    bottom: 10px;
    right: 20px;
  }
  .job-content .job-con{
    padding: 20px;
  }
  .job-content .job-con  dd{
    padding: 15px;
  }
}/*=================== PCここまで ==================*/


/*=================== PC1440ここから ==================*/
@media screen and (min-width: 1440px) {
  /**************************************************
  * 求人一覧 archive-job.php
  ***************************************************/
  .job-list .job-con{
    padding: 30px;
  }
  .job-list .job-con .flex dt{
    width: 40%;
  }
  .job-list .job-con .flex dd{
    width: 60%;
  }
  /**************************************************
  * 求人紹介 single-job.php
  ***************************************************/
  .job-content .job-ttl{
    position: relative;
    padding: 20px 30px;
  }
  .job-content .job-con{
    padding: 30px;
  }
  .job-content .job-con dt{
    padding: 20px;
  }
  .job-content .job-con dd{
    padding: 20px;
  }
  .job-content .job-con .flex dt{
    width: 40%;
  }
  .job-content .job-con .flex dd{
    width: 60%;
  }
}/*=================== PC1440ここまで ==================*/