#pageSection{
 background: url(../img/recruit/page_202307.jpg) center center;
 background-size: cover;
}

#sec1 .bg{
 background: url("../img/recruit/bg1_202307.jpg") no-repeat center center;
 background-size: contain;
 padding: 0px 20px;
}
#sec1 .bg>.inner{
 padding: 80px 50px;
}

#interview .photo{
 position: relative;
}
#interview .photo:before{
 display: block;
 position: absolute;
 content: "";
 height: 60%;
 width: 100%;
 background: #D4D7E8;
 top: 15%;
}
#interview .photo .inner{
 position: relative;
 padding: 0px 30px;
}
#interview .name{
 background: #F8B62D;
 display: flex;
 padding: 30px;
 width: 80%;
 max-width: 900px;
 margin-left: auto;
 margin-right: auto;
 align-items: center;
 margin-top: -50px;
 position: relative;
 z-index: 2;
}
#interview .name .num{
 color: #fff;
 font-weight: bold;
 font-size: 500%;
 width: 20%;
 text-align: center;
}
#interview .name .text{
 width: 80%;
}
#interview .data{
 padding: 0 15px;
}
#interview .data .inner{
 max-width: 800px;
 margin-left: auto;
 margin-right: auto;
}
#interview .data h4 span{
 color: #fff;
 background: #171C61;
 padding: 5px 10px;
 display: inline-block;
}

#interview #member1 .data{
 background: url(../img/recruit/member1_bg.png) no-repeat left top;
 background-position: left 3% top 0%;
 background-size: 11% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}
#interview #member2 .data{
 background: url(../img/recruit/member2_bg.png) no-repeat left top;
 background-position: right 3% top 0%;
 background-size: 11% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}
#interview #member3 .data{
 background: url(../img/recruit/member3_bg.png) no-repeat left top;
 background-position: left 3% top 0%;
 background-size: 18% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}
#interview #member4 .data{
 background: url(../img/recruit/member4_bg.png) no-repeat left top;
 background-position: left 3% top 0%;
 background-size: 11% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}
#interview #member5 .data{
 background: url(../img/recruit/member5_bg.png) no-repeat left top;
 background-position: left 3% top 0%;
 background-size: 11% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}
#interview #member6 .data{
 background: url(../img/recruit/member6_bg.png) no-repeat left top;
 background-position: right 3% top 0%;
 background-size: 14% auto;
 max-width: 1800px;
 margin-left: auto;
 margin-right: auto;
}

.pageList li{
 display: flex;
 margin-bottom: 10px;
}
.pageList li .ttl{
 background:#C9CACA;
 width: 20%;
 padding: 15px;
 text-align: center;
 min-width: 6em;
}
.pageList li .text{
 background:#EFEFEF;
 width: 80%;
 padding: 15px;
}

/*
===================================================
        pc small
===================================================
*/
@media screen and (max-width: 1150px) {
 #sec1 .bg{
  background: none;
 }
 #interview #member1 .data{
  background: none;
 }
 #interview #member2 .data{
  background: none;
 }
 #interview #member3 .data{
  background: none;
 }
 #interview #member4 .data{
  background: none;
 }
 #interview #member5 .data{
  background: none;
 }
 #interview #member6 .data{
  background: none;
 }
}

/*
===================================================
        sp
===================================================
*/
@media screen and (max-width: 768px) {
 #sec1 .bg>.inner{
  padding: 40px 20px;
 }
 #interview .name{
  background: #F8B62D;
  display: flex;
  padding: 8px;
  width: 70%;
  margin-top: -30px;
 }
 #interview .name .num{
  color: #fff;
  font-weight: bold;
  font-size: 200%;
  width: 20%;
  text-align: center;
 }
 #interview .name .text{
  width: 80%;
  line-height: 1.5em;
 }
 #interview .data{
  padding: 0 15px;
 }
 #interview .data .inner{
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
 }
 #interview .data h4 span{
  color: #fff;
  background: #171C61;
  padding: 5px 10px;
  display: inline-block;
 }
 .pageList li .ttl{
  padding: 10px;
 }
 .pageList li .text{
  padding: 10px;
 }
}