@charset "utf-8";
/*------------------------------------------------------------
	トップページ
------------------------------------------------------------*/
#gNavi .navi03 .top {
    color: #d90000;
}

#gNavi .navi03 a:before {
    margin-left: -41px;
    position: absolute;
    left: 50%;
    width: 82px;
    bottom: 20px;
    height: 1px;
    content: "";
    background-color: #d90000;
}

#main {
    padding: 15px 0 0;
}

#main .headLine01 {
    margin-bottom: 67px;
}

#main .ttl {
    margin-bottom: -8px;
    color: #3295a8;
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    font-size: 8.57rem;
    text-align: center;
    letter-spacing: 5px;
}

#main .txtP {
    margin-bottom: 102px;
    font-size: 1.7rem;
    text-align: center;
    line-height: 1.7;
}

@media all and (max-width: 767px) {
     #main {
        padding: 10px 0 0;
    }

    #main .headLine01 {
        margin-bottom: 30px;
    }

    #main .ttl {
        margin-bottom: 0;
        font-size: 3.2rem;
        letter-spacing: 0;
    }

    #main .txtP {
        margin-bottom: 50px;
        font-size: 1.4rem;
        line-height: 1.5;
    }
}

.toptxt {
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.6;
  margin: 0 0 20px;
}
.staff {
  padding: 60px 0;
  background: #f2f2f2;
}
.staffList {
  max-width: 1320px;
  padding: 0 20px;
  box-sizing: border-box;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  background: #f2f2f2;
}
.staffList--col3 {
  justify-content: center;
  gap: 2em;
}
.staffListBox {
  width: calc((100% - 90px) / 4);
  border-bottom: 6px solid #ccc;
  position: relative;
}
.staffListBox:hover {
  border-bottom: 6px solid #d90000;
  cursor: pointer;
  opacity: .75;
}
.staffListBox:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 50px 50px 0 0;
  border-color: #d90000 transparent transparent transparent;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.staffListBoxImg {
  width: 100%;
}
.staffListBoxTxt {
  font-size: 1.3rem;
  line-height: 1.2;
  font-weight: bold;
  background: #fff;
  padding: 15px 15px 18px;
}
.staffListBoxTxtType {
  margin: 0 0 5px;
}
.staffListBoxTxtName {
  font-size: 2.9rem;
}
.staffListBoxTxtJoin {
  margin: 10px 0 0;
}
@media all and (max-width: 767px) {
    .staffList {
      width: auto;
      padding: 0 16px;
      flex-wrap: wrap;
    }
    .staffList--col3 {
      justify-content: space-between;
      gap: 0;
    }
    .staffListBox {
      width: calc(50% - 10px);
      margin: 0 0 30px;
    }
    .staffListBox:before {
      border-width: 30px 30px 0 0;
    }
    .staffListBoxTxt {
        font-size: 1.1rem;
        padding: 10px 10px 12px;
    }
    .staffListBoxTxtType br {
      display: none;
    }
    .staffListBoxTxtName {
        font-size: 2.0rem;
    }
}

.interviewMv{
  display: flex;
  flex-wrap: nowrap;
}
.interviewMvImg{
  width: 50%;
}
.interviewMvImg img{
  width: 100%;
}
.interviewBox{
  width: 36%;
  padding: 0 7%;
  position: relative;
  background: #3292a5;
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.interviewBox:before {
  content: "";
  width: 64px;
  height: 50px;
  background: url(../img/interview/bq-icon.png) no-repeat 0 0;
  display: block;
  margin: 0 0 20px;
}
.interviewBoxTagline{
  font-size: 3.0rem;
  color: #fff;
  margin: 0 0 40px;
}
.interviewBoxTxt{
  font-size: 1.4rem;
  font-weight: bold;
  background: #fff;
  padding: 15px 15px 18px;
}
.interviewBoxTxtType{
  margin: 0 0 10px;
}
.interviewBoxTxtName{
  font-size: 2.8rem;
  margin: 0 0 14px;
}
.interviewBoxTxtJoin{
}
.interviewWrap{
  margin: 0 0 88px;
}
.interviewSec{
  display: flex;
  justify-content: flex-start;
  position: relative;
}
.interviewSec.secImgL{
  justify-content: flex-start;
  padding: 86px 0 0;
  z-index: 2;
}
.interviewSec.secImgR{
  background: #eef4f4;
  flex-flow: row-reverse;
  padding: 132px 0 64px;
  margin: -60px 0 0;
  z-index: 1;
}
.interviewSecImg{
  width: 38%;
}
.secImgL .interviewSecImg{
  margin: 0 5% 0 0;
  text-align: right;
}
.secImgR .interviewSecImg{
  margin: 0 0 0 5%;
  text-align: left;
}
.interviewSecCon{
  width: 57%;
  max-width: 590px;
  box-sizing: border-box;

}
.interviewSecConTitle{
  color: #3292a5;
  font-size: 2.0rem;
  font-weight: bold;
  padding: 0 0 20px;
  margin: 0 0 25px;
  border-bottom: 3px solid #ccc;
  position: relative;
}
.interviewSecConTitle:after{
  content: "";
  width: 92px;
  height: 3px;
  background: #3292a5;
  position: absolute;
  bottom: -3px;
  left: 0;
}
.interviewSecConTxt{
  font-size: 1.5rem;
  line-height: 1.7;
}
.interviewSecConTxt p{
  margin: 0 0 25px;
}
.interviewWrap .comLink {
    margin: 60px 0 0;
    text-align: center;
}

@media all and (max-width: 1663px) {
  .uchiyama .interviewBoxTagline{
    font-size: 2.4rem;
  }
}
@media all and (max-width: 767px) {
  .interviewMv{
    display: block;
  }
  .interviewMvImg{
    width: 100%;
  }
  .interviewBox{
    width: 86%;
    padding: 30px 7%;
    display: block;
  }
  .interviewBox:before {
    content: "";
    width: 32px;
    height: 25px;
    background-size: 32px 25px;
    margin: 0 0 15px;
  }
  .interviewBoxTagline{
    font-size: 2.0rem;
    margin: 0 0 20px;
  }
  .interviewBoxTxt{
    font-size: 1.2rem;
    font-weight: bold;
    background: #fff;
    padding: 7px 7px 10px;
  }
  .interviewBoxTxtType{
    margin: 0 0 5px;
  }
  .interviewBoxTxtName{
    font-size: 2.0rem;
    margin: 0 0 14px;
  }
  .interviewBoxTxtJoin{
  }
  .interviewWrap{
    margin: 0 0 45px;
  }
  .interviewSec{
    display: block;
  }
  .interviewSec.secImgL{
    padding: 45px 0 0;
    z-index: 2;
  }
  .interviewSec.secImgR{
    background: #eef4f4;
    padding: 45px 0;
    margin: 0;
  }
  .interviewSecImg{
    width: 100%;
  }
  .secImgL .interviewSecImg{
    margin: 0 0 25px;
  }
  .secImgR .interviewSecImg{
    margin: 0 0 25px;
  }
  .interviewSecCon{
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0 5%;

  }
  .interviewSecConTitle{
    color: #3292a5;
    font-size: 1.6rem;
    padding: 0 0 12px;
    margin: 0 0 15px;
  }
  .interviewSecConTitle:after{
    width: 60px;
  }
  .interviewSecConTxt{
    font-size: 1.4rem;
  }
  .interviewSecConTxt p{
    margin: 0 0 15px;
  }
  .interviewWrap .comLink {
      margin: 40px 16px 0;
      text-align: center;
  }
}
