@charset "UTF-8";
/**
 * members.css
 */

.interviewTitleBg{
  background-color: rgba(147, 187, 158, 0.2);
}
.interviewTitle{
  font-size: 2.4rem;
  text-align: center;
  line-height: 1.5;
  font-weight: bold;
  padding: 60px 0; 
}

/* member */
h2{
  padding-bottom: 0;
}
.intro .textBox{
  padding-bottom: 30px;
}
.underpage .cv .interviewBox{
  position: absolute;
  background: white;
  width: 233px;
  min-height: 233px;
  bottom: 25px;
  left: 10%;
  z-index: 2;
  /* padding: 35px 30px; */
  padding: 20px 30px;
}
.underpage .cv .interviewBox.alignR{
  right: 10%;
  left: auto;
}
.underpage .cv .interviewBox img{
  width: auto;
  height: auto;
  margin-bottom: 30px;
}
.underpage .cv .interview-title{
  font-size: 1.4rem;
}
.underpage .cv .interview-title span{
    font-weight: bold;
    font-size: 1.8rem;
}
.underpage .cv .interview-roman{
  font-size: 1rem;
  padding-top: 10px;
  /*
  padding-bottom: 30px;
  */
}
.underpage .cv .interviewBox p{
  font-size: 1.4rem;
  line-height: 1.9;
  padding-bottom: 30px;
}
.underpage .cv-single{
  height: auto;
  text-align: center;
}
.underpage .cv-single .of-img{
  object-fit: fill;
  max-width: 100%;
  max-height: 600px;
  width: auto;
  height: auto;
}

.underpage .contents .interviewBox{
  position: absolute;
  background: white;
  width: auto;
  min-width: 210px;
  min-height: auto;
  z-index: 2;
  padding: 10px;
  bottom: 60px;
  left: 10%;
}
.underpage .contents .interview-title{
  font-size: 1.4rem;
}
.underpage .contents .interview-title span{
    font-weight: bold;
    font-size: 1.8rem;
}
.underpage .contents .interview-roman{
  font-size: 1rem;
  padding-top: 10px;
}
.underpage .contents .interviewBox p{
  font-size: 1.4rem;
  line-height: 1.9;
  padding-bottom: 10px;
}
.underpage .contents .interviewBoxOuter{
  position: relative;
}
.underpage .contents .interviewBox.interview-hmki-1{
  bottom: 40px;
  left: 3%;
}
.underpage .contents .interviewBox.interview-hmki-2{
  bottom: 40px;
  left: auto;
  right: 2%;
}
.underpage .contents .interviewBox.interview-hmki-1 p,
.underpage .contents .interviewBox.interview-hmki-2 p{
  line-height: 1.7;
}

.contents h3{
  font-size: 2.4rem;
  text-align: center;
  line-height: 1.5;
  font-weight: bold;
  padding-bottom: 60px;
}
.contents .textBox img{
  max-width: 100%;
  height: auto;
}
.contents .textBox img.no-pad{
  padding: 0;
}
.contents .textBox img.no-pad-top{
  padding-top: 0;
}
.contents .textBox img.no-pad-bottom{
  padding-bottom: 0;
}
.contents .textBox img.no-pad-bottom-10{
  padding-bottom: 10px;
}
.textBox p{
  padding-bottom: 25px;
}
.textBox img{
  display: inline-block;
  padding-top: 30px;
  padding-bottom: 60px;
}
.textBox h4{
  font-size: 1.8rem;
  font-weight: bold;
  padding-bottom: 60px;
}
.memberLinks{
  padding-top: 20px;
  text-align: center;
}
.memberLinks a{
  font-size: 1.6rem;
}
.memberLinks a:hover{
  text-decoration: none;
  opacity: .7;
}
.memberLinks .btnArea{
  display: inline-block;
  width: 84px;
}
.memberLinks .btnArea.prevBtn{
  margin-right: 50px;
}
.memberLinks .btnArea.nextBtn{
  margin-left: 50px;
}
.memberLinks .btnArea.nextBtn .icon{
  margin-left: 14px;
  margin-right: 0;
}
.memberLinks .btnArea.prevBtn .icon{
  left: 0;
}
.memberLinks .btnArea.prevBtn a:hover .icon{
  left: -5px;
}


/* membersList */
.membersList .intro .textBox{
  padding-bottom: 0;
}
.membersList .textBox p{
  padding-bottom: 0;
}
.membersList .memberBox{
  display: flex;
}
.membersList .memberBoxItem{
  width: 48%;
  display: flex;
}
.membersList .memberBoxItem:nth-child(2n){
  margin-left: 4%;
}
.membersList .cBox2-info{
  padding: 0 0 0 20px;
  width: auto;
  height: auto;
  float: none;
  background-color: transparent;
}
.membersList .cBox2-info p{
  line-height: 1.5;
  padding-bottom: 0;
  font-size: 1.3rem;
}
.membersList .cBox2-info h4{
  font-size: 1.6rem;
}
.membersList .cBox2-title{
  padding: 10px 0 5px;
}
.membersList .cBox2-roman{
  display: inline-block;
  padding-bottom: 20px;
}
.membersList .cBox2-info .btnArea{
  position: static;
}

.textBox .innerBox-catch img{
  padding: 0;
}
.innerBox-catch{
  position: relative;
  margin-bottom: 60px;
}
.innerBox-catch.cv .interviewBox{
  background-color: rgba(255,255,253,.8);
  bottom: auto;
  left: 30px;
  top: 30px;
  right: auto;
}
.underpage .innerBox-catch.cv .interviewBox.alignR{
  right: 30px;
  left: auto;
}

/* interview */
.underpage .cv-ex .interviewBox img{
  margin-bottom: 10px;
}
.underpage .cv-ex .interviewBox{
  width: auto;
  min-height: auto;
}
.underpage .cv-ex .interview-title,
.underpage .cv-ex .interview-roman{
  display: inline-block;
}
.underpage .cv-ex .interviewBox p{
  padding-bottom: 10px;
}

.underpage .contents .interviewBox.interview-nwyo-1{
  bottom: 40px;
  left: 2%;
}
.underpage .contents .interviewBox.interview-nwyo-2{
  bottom: 40px;
  left: auto;
  right: 2%;
}
.underpage .contents .interviewBox.interview-nwyo-1 p,
.underpage .contents .interviewBox.interview-nwyo-2 p{
  line-height: 1.7;
}

.underpage .cv-ex .of-img{
  object-position: top;
}


@media screen and (max-width: 835px) {
  .interviewTitle{
    font-size: 2.2rem;
    text-align: left;
    padding: 30px 15px;
  }
  .underpage .cv .interviewBox{
    width: auto;
    min-height: 0;
    z-index: 2;
    padding: 20px 15px;
  }

  .underpage .cv .interviewBox{
    left: 3%;
    bottom: 4%;
    right: auto;
    min-width: 150px;
  }
  .underpage .cv .interviewBox.alignR{
    right: 3%;
    left: auto;
  }
  .underpage .cv .interviewBox p{
    font-size: 1.2rem;
  }

  .intro .textBox{
    padding-bottom: 50px;
  }

  .cBox2:last-child{
    padding-bottom: 0;
  }
  .cBox2-title{
    font-size: 1.8rem;
    text-align: center;
  }
  .cBox2-roman{
    text-align: center;
  }

  .contents h3{
    font-size: 2.2rem;
    text-align: left;
    padding-bottom: 30px;
  }
  .memberLinks .btnArea.prevBtn{
    margin-right: 30px;
  }
  .memberLinks .btnArea.nextBtn{
    margin-left: 30px;
  }

  .contents.innerBox{
    padding-top: 30px;
  }

  /* membersList */
  .membersList .bg-gray{
    background-color: transparent;
  }
  .membersList .memberBox{
    display: block;
  }
  .membersList .memberBox.innerBox{
    padding: 0;
  }
  .membersList .catch.innerBox{
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .membersList .memberBoxItem{
    width: auto;
    background-color: #f8f8f8;
    padding: 20px;
  }
  .membersList .memberBoxItem:nth-child(2n){
    background-color: transparent;
    margin-left: 0;
  }
  .membersList .memberBoxItem figure{
    max-width: 171px;
  }
  .membersList .cBox2-title,
  .membersList .cBox2-info{
    text-align: left;
    max-width: none;
    margin: 0;
  }
  .membersList .cBox2-title{
    padding-top: 10px;
  }
  .membersList .cBox2-roman{
    padding-bottom: 25px;
  }
  .membersList .cBox2-info p{
    font-size: 1.2rem;
  }
  .membersList .memberBoxItem-comment{
    display: none;
  }
  .membersList .cBox2-info .btnArea{
    font-size: 1.4rem;
  }
  .membersList .cBox2-info .btnArea .icon{
    width: 24px;
    height: auto;
    margin-right: 8px;
  }
  
  .textBox .innerBox-catch img{
    height: auto;
  }
  .innerBox-catch.cv{
    position: relative;
    margin-bottom: 30px;
    height: auto;
  }
  .innerBox-catch.cv .interviewBox{
    top: 3%;
    bottom: auto;
    left: 3%;
    right: auto;
    height: auto;
  }
  .underpage .innerBox-catch.cv .interviewBox.alignR{
    right: 3%;
    left: auto;
  }

  .underpage .contents .interviewBox{
    min-width: 0;
    max-width: 49%;
    min-height: 160px;
    display: block;
    float: left;
  }
  .underpage .contents .interviewBox.interview-hmki-1{
    position: static;
    bottom: 0;
    left: 0;
  }
  .underpage .contents .interviewBox.interview-hmki-2{
    position: static;
    bottom: 0;
    left: auto;
    right: 0;
    margin-left: 2%;
  }
  .underpage .contents .interviewBox.interview-nwyo-1{
    position: static;
    bottom: 0;
    left: 0;
    width: 49%;
    min-height: 0;
  }
  .underpage .contents .interviewBox.interview-nwyo-2{
    position: static;
    bottom: 0;
    left: auto;
    right: 0;
    margin-left: 2%;
    width: 49%;
    min-height: 0;
  }
  .underpage .contents .interviewBoxOuter{
    overflow: hidden;
    padding-bottom: 60px;
  }
  .underpage .contents .interviewBoxOuter img{
    padding-bottom: 0;
  }
}