@charset "utf-8";
/* CSS Document */

/***** home_common *****/
.home section {
  padding: 11.6rem 0 12rem;
}
.home_about_wrap{
  max-width: 1536px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.home #service .title_text{
  margin-bottom: 4rem;
}

/***** home_hero *****/
.hero_wrap .img_wrap img{
  height: calc(100vh - 80px);
  object-position: 38% 50%;
}
 .slide {
  position: absolute;
  overflow   : hidden;
  top: 20%;
  bottom: 20%;
  right: 8%;
  width      : 42vh;
  height     : 58.8vh;
  margin     : auto;
}
.slide img {
  display    : block;
  position   : absolute;
  width      : 100%;
  height     : 100%;
  opacity    : 0;
  animation  : slideAnime 18s ease infinite;
}
 
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 6s }
.slide img:nth-of-type(3) { animation-delay: 12s }
 
@keyframes slideAnime{
   0% { opacity: 0; }
  16% { opacity: 1; }
  34% { opacity: 1; }
  50% { opacity: 0; }
 100% { opacity: 0; }
}
.catch{
  position: absolute;
  left: 10vw;
  right: 10vw;
  bottom: 12.8vh;
  font-weight: 500;
  color: #fefefe;
  line-height: 1.4;
  text-shadow: 0px 0px 4px #777;
}
.catch .jp{
  font-size: clamp(1.6rem, 3.2vw, 2.8rem);
}
.catch .en{
  font-size: clamp(3.2rem, 6.6vw, 6rem);
}

@media screen and (min-width:900px){
  .slide {
    left: 48%;
  }
  .recruit-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: #003893; /* 青背景 */
    color: white;
    text-align: center;
    line-height: 1.4;
    border: 4px solid white;   /* 白の縁 */
    box-shadow: 0 0 0 3px red; /* 赤の外枠 */
    text-decoration: none;
    position: absolute;
    bottom: 9.6%;
    right: 6.6%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .recruit-button:hover {
    transform: scale(1.08);
    box-shadow: 0 0 0 4px red, 0 4px 12px rgba(0, 0, 0, 0.2);
  }
}
@media screen and (max-width:899px){
  .hero_wrap .img_wrap img {
    height: calc(100vh - 60px);
  }
  .slide {
    width: 34vh;
    height: 48.8vh;
  }
  .catch{
    left: 5.6vw;
    right: 5.6vw;
  }
  .recruit-button{
    display: none;
  }
}
/*** home_about ***/
section#home_about{
  padding: 18rem 0 12rem;
  font-size: clamp(1.6rem, 2.8vw, 1.8rem);
}
#home_about h2{
  font-weight: 600;
  line-height: 1.6;
}
#home_about .img_outer img{
  min-height: 320px;
}
#home_about p{
  padding-bottom: 1.2rem;
}
@media screen and (min-width:769px) {
  #home_about .intro{
    display: flex;
    align-items: center;
  }
  #home_about .intro .text_box{
    margin-left: 8rem;
    font-size: clamp(2rem, 2.3vw, 2.4rem);
  }
}

/*** home_company ***/
section#home_company .btn {
  margin-bottom: 4rem;
}
#home_company img{
  min-height: 400px;
}
@media screen and (min-width:900px) {
  section#home_company .btn {
    margin-top: 0;
  }
}

/*** home_recruit ***/
#home_recruit .box_right{
  margin-top: 4rem;
}
.recruit_list{
  max-width: 900px;
  border-top: 1px solid #e2001b; /* 赤ライン */
}
.recruit_list li{
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
  text-decoration: none;
  padding: 20px 0px 20px 20px;
  border-bottom: 1px solid #ccc;
  transition: background 0.3s;
  cursor: pointer;
}
.recruit_list li a{
  width: 100%;
}
.recruit_list li a .text{
  transition: 0.3s;
}
.recruit_list li a:hover .text{
  opacity: .6;
}
@media screen and (min-width:900px) {
  #home_recruit .wrap{
    display: flex;
    justify-content: space-between;
    align-items: normal;
  }
  #home_recruit .box_left,#home_recruit .box_right{
    width: 47%;
  }
  #home_recruit .box_right{
    
  }
}