@charset "UTF-8";
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);


/*----------------------------------------------------

◆　require 募集要項ページ

----------------------------------------------------*/
#recruit_mv{background: url(../images/top_recruit.jpg)0 0 no-repeat;background-size: cover;}
#ttl_recruit{background: url(../images/ttl_recruit.png)0 0 no-repeat;background-size: contain;}

section#sec-requirement{padding:80px 0 80px;}
@media (max-width: 768px) {section#sec-requirement{padding:40px 0 40px;}}

section#sec-requirement h2{width:90%;max-width: 800px;margin:0 auto;font-size: 20px;font-weight: bold;margin-bottom: 30px;}
@media (max-width: 768px) {section#sec-requirement h2{font-size: 16px;font-weight: bold;margin-bottom: 10px;}}

table.require {
  table-layout: fixed;
  box-sizing: border-box;
  width: 95%;
  max-width: 800px;
  font-size: 15px;
  margin: 0 auto;
}
table.require th {
  width: 25%;
  box-sizing: border-box;
  padding: 20px 40px;
  border-top: 1px solid #002f8f;
  text-align: left;
  vertical-align: top;
}
table.require td {
  width: 75%;
  box-sizing: border-box;
  padding: 20px 0 20px 40px;
  text-align: left;
  vertical-align: top;
}
@media (max-width: 768px) {
  table.require {width: 90%;margin: 0 auto;font-size: 13px;}
  table.require th {width: 100%;padding: 20px 0px 20px 10px;display: block;background: #eee;font-size: 13px;}
  table.require td {width: 100%;padding: 20px 0px 20px 10px;display: block;font-size: 13px;}
}


.recruit_head{max-width: 800px;width: 90%;margin:0 auto;margin-top: 80px;}
.recruit_head h2{text-align: center;font-size: 36px;margin-bottom: 16px;}
.recruit_img{height: 280px;background:url(../images/recruit_head.jpg)0 0 no-repeat;background-size: cover; }
.recruit_txt{margin-top: 20px;}
@media (max-width: 768px) {
  .recruit_head{max-width: 800px;width: 90%;margin:0 auto;margin-top: 40px;}
  .recruit_head h2{text-align: center;font-size: 24px;margin-bottom: 16px;}
  .recruit_img{height: 180px;margin-top: 10px;}
}


/* entry_btn
------------------------------------------------------------*/

.entry_btn{
    margin: 0;
    border: 0;
    position: relative;
    top: 50%;
    left: 50%;
    margin-left: -300px;
    width: 600px;
    height: 56px;
    text-align: center;
    box-sizing: border-box;
    border:2px solid #004ea2;
    margin-bottom: 120px;
    line-height: 52px;
}
@media(max-width: 768px){ .entry_btn {width: 90%;margin-left: -45%;margin-bottom: 80px;}}
.entry_btn:hover {cursor: pointer;}
.btn_slide{overflow: hidden;}
.btn_slide div {
    position: absolute;
    text-align: center;
    width: 100%;
    height: 56px;
    box-sizing: border-box;
}
.btn_slide div:nth-child(1) {background: #004ea2;}
.btn_slide div:nth-child(1) p{color: #fff;font-size: 16px;}
.btn_slide div:nth-child(2) {background: #fff;transition: left 0.3s ease;left: -600px;}
.btn_slide div:nth-child(3) {transition: opacity 0.3s ease;opacity: 0;}
.btn_slide div:nth-child(3) p{color: #004ea2;font-size: 16px;}

.btn_slide:hover div:nth-child(2) {left: 0px;transition: left 0.3s ease;}
.btn_slide:hover div:nth-child(3) {opacity: 1;transition: opacity 0.3s ease;}
@media(max-width: 768px){ 
  .btn_slide div:nth-child(2) {left: -100%;}
  .btn_slide div:nth-child(1) p{color: #fff;font-size: 15px;}
  .btn_slide div:nth-child(3) p{color: #004ea2;font-size: 15px;}
}
