@charset "UTF-8";


/* -----------------------------------------------
[Media Queries] smart phone
-------------------------------------------------- */

@media only screen and (min-width:1px) and (max-width:767px){

 
/* header */

header{
  height: 75px;
}

#logo{
  position: absolute;
  left: 1em;
  top: 1em;
}
  
  
  
.column2{
  display: block;
  margin-bottom: 5em;
}
.column2 .col{
  width: 100%;
}

.column3{
  display: block;
  margin-bottom: 5em;
}
.column3 .col{
  width: 100%;
}

    
  
.column2-1,
.column1-2{
  display: block;
}
.column2-1 .main,
.column1-2 .main{
  width: 100%;
  margin-bottom: 2em;
}
.column2-1 .sub,
.column1-2 .sub{
  width: 100%;
  margin-bottom: 2em;
}
.column2-1 .sub figure,
.column1-2 .sub figure{
  text-align: center;
}

  
  
  
  
  
  
  
  
  
.headline{
  font-size: 1.4em;
}

  
  

.top_info{
  display: block;
}
  
.top_info .txt{
  width: 100%;
  margin-bottom: 3em;
}

.top_info figure{
  margin-right: 0;
}

  
#about{
  margin-bottom: 9em;
}
  
#news{
  margin-bottom: 10em;
  display: block;
}
#news .more{
  position: relative;
  left: inherit;
  bottom: inherit;
  margin-top: 3em;
}

#news .news_txt{
  width: 100%;
  max-width: inherit;
}

  
  
#business{
  margin-bottom: 5em;
}
  
.business_info{
  display: block;
  margin-bottom: 4em;
}

.business_info .txt{
  width: 100%;
  margin-bottom: 3em;
}
.business_info .txt h2{
  margin-bottom: 3em;
}
.business_info figure{
    margin-left: 0;
}
  
#business .col{
  margin-top: 4em;
  padding-top: 4em;
  border-top: 1px #e8e8e8 solid; 
}
  

  
#why .txt{
  width: 90%;
  padding: 3em 2em;
}
  
  
#interview h2{
  margin-bottom: 2em;
}
#why .headline em{
  font-size: 2.5em;
  }
  
#why .more a{
  padding: 5px 2em 5px 1em;
  background: url("../images/i_more.png") no-repeat 95% center;
  } 
  
.photolist{
  width: 90%;
  margin: 0 auto 10em;
  display: block;
}
.photolist .col{
  width: 100%;
}
  
  
  
#pagetop{
  position: absolute;
  right: 50%;
  top: -70px;
  margin-right: -70px;
}

footer .ft_in{
  display: block;
}
  
  
  .ft_info{
    width: 100%;
    position: relative;
  }
  .snsBtn{
    position: absolute;
    right: 5%;
    top:0;
  }
  
.ft_logo{
  width: 70%;
}

.ft_add{
  display: none;
}

  
.ft_nav{
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.ft_nav dl,
.ft_nav div{
  margin-left: 0;
  width: 47%;
}
  

  
  
  
#page_title h1,
.page_title h2{
  font-size: 1.4em;
}

.page_title h2{
  max-width: inherit;
  font-size: 1.4em!important;
  padding: 0;
}
.page_title h2 span{
  font-size: 2.9em!important;
}

  
.recruit_title{
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  margin-left:0;
  background: none;
}
  
.page_title figure{
  width: 100vw;
  position: relative;
  right: inherit;
  top: inherit;
  margin-bottom: 5em;
}

.page_title figure img{
  height: 600px; /* 高さはそのまま */
  object-fit: cover; /* 画像を切り取る */
  object-position: center; /* 画像の中央を基準に切り取る */
}

#contents dl.interview dt{
  font-size: 1.4em;
  line-height: 1.3;
}

.interview_img img{
  height: 400px;
  object-fit: cover;
  object-position: center;
  }  
  
  
  
#contents{
  padding-bottom: 3em;
}

  

#contents .grid dl{
  display: block;
  padding: 1em 0;
}
#contents .grid dt{
  width: 100%;
  margin-right: 0;
}
#contents .grid dd{
  width: 100%;
}

  
#contents h2.cate_title{
  font-size: 1.8em;
}
  
  
  
.column{
  display: block;
}

.column .title{
  width: 100%;
}

.column .detail{
  max-width: inherit;
  width: 100%;
}


#contents .interview_list dd ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

#contents .interview_list li{
  width: 48%;
  margin: 0 0 1em;
}

  
#contents .schedule{
  padding: 2em 10%;
}
#contents .schedule dt{
  margin-bottom: 1em;
  }
#contents .schedule dt span{
  display: block;
  line-height: 1.2;
}

  
  
  
#contents .overflowingL h2,
#contents .overflowingR h2{
  font-size: 1.6em;
}
  
.overflowingL,
.overflowingR{
  padding: 5em 0 3em;
  display: block;
}
.overflowingL .txt,
.overflowingR .txt{
  width: 100%;
}

.overflowingL figure,
.overflowingR figure{
     width:100vw;
     position: relative;
     left: 50%;
     right: 50%;
     margin-left: -50vw;
     margin-right: -50vw;
  }

  
#contents .session h3 span{
  display: block;
}

  
  
#contents th{
  display: block;
  width: 100%;
  padding: 1em 0 0;
  border-bottom: none; 
}
#contents td{
  display: block;
  width: 100%;
  padding: 0.5em 0 1em;
  border-bottom: 1px #e8e8e8 solid;
}

  
  
  
}