/* 就職 */
.page_recruit {
  padding: 80px 0 0;
}
@media screen and (max-width:768px){
  .page_recruit {
    padding: 50px 0 0;
  }
}
.grad_section {
  padding: 120rem 0;
}
@media screen and (max-width:768px){
  .grad_section {
    padding: 60rem 0;
  }
}
.page_mv_recruit {
  max-width: 100%;
  width: 1360rem;
  height: 560rem;
  margin-right: 0;
  margin-left: auto;
  background-image: url("../img/recruit-top.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 50px 0 0 50px;
}
@media screen and (max-width:768px){
  .page_mv_recruit {
    border-radius: 0 0 0 50px;
    }
}
@media screen and (max-width:375px){
  .page_mv_recruit {
    width: 375px;
    height: 342px;
    background-image: url("../img/recruit-top_sp.webp");
    }
}
.rec_top {
  padding-top: 50rem;
}
@media screen and (max-width:768px){
  .rec_top {
    padding-top: 20rem;
  }
}
.grad_message {
  font-size: 30rem;
  line-height: 1.5;
}
@media screen and (max-width:768px){
  .grad_message {
    font-size: 20px;
  }
}
.recruit_list {
  display: flex;
  width: 70%;
  margin-top: 70rem;
  padding-bottom: 120rem;
  position: relative;
  z-index: 100;
}
@media screen and (max-width:768px){
  .recruit_list {
  flex-direction: column; 
  padding-bottom: 60rem; 
  }
}
@media screen and (max-width:768px){
  .recruit_list {
  margin-top: 0;
  }
}
.recruit_item {
  /* background-color: white; */
  /* border-radius: 20px; */
  font-size: 18rem;
  margin-right: 20rem;
  width: 282rem;
}
@media screen and (max-width:960px){
	.recruit_item {
  margin-right: 60rem;
}
}
@media screen and (max-width:768px){
  .recruit_item {
    margin-bottom: 10rem;
    margin-right: 0;
  }
}
@media screen and (max-width:375px){
  .recruit_item {
    width: 200rem;
  }
}

.rec_company {
  margin-top: 57rem;
}
@media screen and (max-width:375px){
  .rec_company {
    margin-top: 40rem;
  }
}
.rec_company_title {
  font-size: 48rem;
  color: #F08300;
}
@media screen and (max-width:768px){
  .rec_company_title {
    font-size: 33px;
  }
}
.rec_company_title span {
  font-size: 30rem;
  color: #F08300;
}
@media screen and (max-width:768px){
  .rec_company_title span {
    font-size: 21px;
  }
}
.rec_ft {
  font-size: 28rem;
  background-color: #53A72C;
  display: inline-block;
  color: white;
  margin-top: 30px;
}
@media screen and (max-width:768px){
  .rec_ft {
    font-size: 18px;
    margin-top: 20px;
  }
}
.rec_sub_ft {
  font-size: 20rem;
  line-height: 2;
  margin-top: 20px;
}
@media screen and (max-width:768px){
  .rec_sub_ft {
    font-size: 18px;
    margin-top: 14px;
  }
}
.unv_content {
  font-size: 20rem;
  line-height: 2;
  margin-top: 28px;
  display: inline-block;
}
@media screen and (max-width:768px){
  .unv_content {
    font-size: 15px;
    margin-top: 20px;
  }
}
.rec_ft_border {
  border-radius: 28rem;
  padding: 8rem 30rem;
}
@media screen and (max-width:375px){
  .rec_ft_border {
    padding: 5rem 15rem;
}
}
.rec_sec_border {
  border-radius: 28rem;
  padding: 8rem 30rem;
	line-height:1.5;
}
@media screen and (max-width:375px){
.rec_sec_border {
  border-radius: 17rem;
  padding: 7.5rem 30rem 7.5rem 20rem;
  line-height: 1.5;
}
}
.license_list {
  font-size: 20rem;
  line-height: 2;
  background-color: white;
  display: inline-block;
  padding: 3rem 30rem;
  margin-top: 20px;
  margin-bottom: 20px;
}
.license_list:first-of-type {
  margin-top: 30px;
}
@media screen and (max-width:768px){
.license_list {
  font-size: 16px;
  padding: 3rem 15rem;
  margin-bottom: 15px;
}
}
.license_list_sec {
  font-size: 20rem;
  line-height: 2;
  background-color: white;
  display: inline-block;
  padding: 3rem 30rem;
  margin-top: 10px;
  margin-bottom: 10px;
}
.license_list_sec:first-of-type {
  margin-top: 30px;
}
@media screen and (max-width:768px){
.license_list_sec {
  font-size: 16px;
  padding: 3rem 15rem;
  margin-top: 5px;
  margin-bottom: 5px;
}
}
.rec_sub_sec {
  font-size: 20rem;
  line-height: 2;
}
@media screen and (max-width:768px){
  .rec_sub_sec {
    font-size: 15px;
  }
}
/* 就職 */

/* 卒業生の活躍 */
.grad_page_list {
  display: flex;
  flex-wrap: wrap;
  width: calc(98% + 48rem);
  position: relative;
  z-index: 100;
}
@media screen and (max-width:768px){
  .grad_page_list {
    flex-direction: column;
    flex-wrap: nowrap;
    width: calc(100%);
  }
}
.grad_item {
  /* display: flex; */
  width: calc(50% - 24rem);
  margin: 25rem 48rem 25rem 0;
}
@media screen and (max-width:768px){
  .grad_item {
    width: calc(95%);
    margin: 0 auto 30rem;
  }
}
.grad_item:nth-child(2n) {
  margin-right: 0;
}
@media screen and (max-width:768px){
  .grad_item:nth-child(2n) {
    margin: 0 auto 30rem;
  }
}
.grad_page_image {
  width: 210rem;
  height: 229rem;
  overflow: hidden;
}
@media screen and (max-width:950px){
  .grad_page_image {
    height: 250rem;
  }
}

@media screen and (max-width:768px){
  .grad_page_image {
    height: 200px;
  }
}
 @media screen and (max-width:500px){
  .grad_page_image {
    height: 142px;
  }
}

@media screen and (max-width:375px){
  .grad_page_image {
    width: 100px;
  }
} 
.grad_page_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .6s;
}
.grad_page_title {
  max-width: 70%;
  width: 100%;
  background-color: #F8F5F0;
  position: relative;
}
 span.re_a { 
    border: 1px solid black;
    border-radius: 15px;
    position: absolute;
    bottom: 20rem;
    right: 20rem;
    width: 110px;
    font-size: 14rem;
    display: inline-block;
    padding: 5rem 0 5rem 10rem; 
    display: flex;
    align-items: center;
    background-color: white;
    transition: .4s;
  }
  @media screen and (max-width:1200px){
    span.re_a {
      width: 90px;
    }
  }
  @media screen and (max-width:768px){
    span.re_a {
      font-size: 14px;
      width: 110px;
    }
  }
  @media screen and (max-width:375px){
    span.re_a {
      bottom: 10rem;
  }
  }
  span.re_a::before {
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10.5rem;
  width: 10.5rem;   
  height: 10rem;   
  border-top: 2rem solid #90be20;     
  border-right: 2rem solid #90be20;   
  transform: rotate(45deg);  
} 

@media screen and (max-width:375px){
  span.re_a::before {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10.5rem;
    width: 8rem;   
    height: 8rem;   
    border-top: 2rem solid #90be20;     
    border-right: 2rem solid #90be20;   
    transform: rotate(45deg);  
  } 
}

span.re_a::after {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 12rem;
    width: 10rem; 
    height: 2.5rem; 
    background: #90be20; 
}

@media screen and (max-width:375px){
  span.re_a::after {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 12rem;
    width: 10rem; 
    height: 2rem; 
    background: #90be20; 
}
}

.grad_page_content {
  padding-top: 35rem;
  padding-left: 40rem;
  padding-right: 40rem;
}

@media screen and (max-width:768px){
  .grad_page_content {
    padding-top: 15px;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 1.35;
  }
}

.grad_page_content  h2 {
    font-size: 30rem;
    margin-bottom: 10rem;
  }

  @media screen and (max-width:768px){
    .grad_page_content  h2 {
      font-size: 17px;
      margin-bottom: 10px;
    }
  }

  .grad_ex {
    font-size: 20rem;
    line-height: 1.35;
  }
  @media screen and (max-width:768px){
    .grad_ex {
      font-size: 13px;
    }
  }

  /* 卒業生の活躍 */

  .grad_item a {
    width: 100%;
    height: 100%;
    display: flex;
  }
 @media screen and (min-width:769px){
  .grad_item a:hover .grad_page_image img {
    transform: scale(1.2);
  }
  .grad_item a:hover span.re_a {
    background-color: #90be20;
  }
  .grad_item a:hover span.re_a::before {
    border-top: 2rem solid #E7F1CE;     
    border-right: 2rem solid #E7F1CE;  
  }
  .grad_item a:hover span.re_a::after {
    background-color: #E7F1CE;    
  }
}