@charset "utf-8";


/* -------------- 
												先輩の声 
																			-------------- */

/* title */
.staff__title {
  position: relative;
	margin: 5% auto 0;
	padding: 10% 0 9%;
  background: url("../img/rexcruiter_topBg.png") no-repeat 0 0;
	background-size: cover;
}

.staff__title h2 {
	display: block;
	width: 92%;
	max-width:1075px ;
	position: absolute; top: -6%; right: 0; bottom: 0; left: 5%;
}

.staff__title h2 img {
  display: block;
	width: 100%;
}
.staff__title h2 img.showSp {
  display: none;
}


@media screen and (max-width:900px) {
.staff__title {
	margin: 14% auto 0;
	padding: 10% 0 24%;
  background: url("../img/rexcruiter_topBg_Sp.png") no-repeat ;
	background-size: cover;
}
.staff__title h2 {
	display: block;
	width: 92%;
	max-width:650px ;
	position: absolute; top: -6%; right: 0; bottom: 0; left: 5%;
}
.staff__title h2 img.showPc {
  display: none;
}
.staff__title h2 img.showSp {
  display: block;
}
}


/* -------------- インタビュー -------------- */
#staff_interview {
  margin: 3em auto;
}
@media screen and (max-width:1600px) {
#staff_interview {
  margin: 10em auto;
}
}
.staff {
  position: relative;
  margin-bottom: 10%;
}

.staff_02 {
  margin-bottom: 10%;
}
@media screen and (max-width:1070px) {
.staff,
.staff_02 {
	margin:0 auto 0;
}	
}

/* photo01 */
.staff .staffImg {
  display: block;
  width: 85%;
  max-width: 889px;
  margin: 0 0 0 13%;
}

.staff .staffImg img {
  display: block;
  width: 100%;
}
@media screen and (max-width:1600px) {
.staff .staffImg {
  margin: 0 auto 10%;
  padding: 6% 0 0 0;
}
}
@media screen and (max-width:780px) {
.staff .staffImg {
  width: 92%;
  margin: 0 auto;
}
}

/* photo02 */
.staff_02 .staffImg {
  display: block;
  width: 85%;
  max-width: 892px;
  margin: 0 0 0 31%;
}

.staff_02 .staffImg img {
  display: block;
  width: 100%;
}
@media screen and (max-width:1600px) {
.staff_02 .staffImg {
  margin: 0 auto 10%;
  padding: 7% 0 0 0;
}
}
@media screen and (max-width:780px) {
.staff_02 .staffImg {
  width: 92%;
  margin: 0 auto;
}
}


/*-- profile --*/
.staff_prof {
	position: relative;
}

@media screen and (max-width:1070px) {
	
.staff_prof {
	margin-top: 18%
}

}

/* profile01 */
.staff .staffCatch {
	display: block;
	position: absolute; top: 25%; right: 18%;
	width: 80%;
	max-width: 615px;
}

.staff .staffCatch img {
	display: block;
	width: 100%;
}
@media screen and (max-width:1600px) {
.staff .staffCatch {
	position: absolute; top: -2%; right: 3%;
}
}
@media screen and (max-width:780px) {
.staff .staffCatch {
	position: absolute; top: -10%; left:6%;
}
}

/* profile02 */
.staff_02 .staffCatch {
	display: block;
	position: absolute; top: 25%; left: 11%;
	width: 80%;
	max-width: 615px;
}

.staff_02 .staffCatch img {
	display: block;
	width: 100%
}
@media screen and (max-width:1600px) {
.staff_02 .staffCatch {
	position: absolute; top: -2%; left:6%;
}
}
@media screen and (max-width:780px) {
.staff_02 .staffCatch {
	position: absolute; top: -10%; left:6%;
}
}


/*-- name --*/

/* name右 */
.staff .staffName {
	display: block;
	position: absolute; top: 82%;	right: 33%;
	width: 60%;
	max-width: 304px;
}

.staff .staffName img{
	display: block;
	width: 100%
}
@media screen and (max-width:1600px) {
.staff .staffName {
	position: static;
  margin: -14em 12em 0 auto ;
}
}
@media screen and (max-width:780px) {
.staff .staffName {
	position: static;
  margin: -3em 1em 0 auto ;
}
}
@media screen and (max-width:599px) {
.staff .staffName {
	max-width: 200px;
}
}

/* name左 */
.staff_02 .staffName {
	display: block;
	position: absolute; top:80%; left:20%;
	width: 60%;
	max-width: 304px;
}
.staff_02 .staffName img{
	display: block;
	width: 100%
}


@media screen and (max-width:1600px) {
.staff_02 .staffName {
	position: static;
  margin: -12em 0 0 12em ;
}
}
@media screen and (max-width:780px) {
.staff_02 .staffName {
	position: static;
  margin: -3em 0 0 1em ;
}
}
@media screen and (max-width:599px) {
.staff_02 .staffName {
	max-width: 200px;
}
}

.staff_02 .staff_L,.staff_05 .staff_L {
	max-width: 362px;
}

@media screen and (max-width:599px) {
.staff_02 .staff_L,.staff_05 .staff_L {
	max-width: 250px;
}
}


/*------- viewボタン 開いたとき -------*/
.viewBtn {
	width: 50%;
	max-width: 56px;
	margin: 8% auto 0;
	text-align: center;
	cursor: pointer;
}

.viewBtn img {
  display: block;
	width: 100%;
}
@media screen and (max-width:1600px) {
.viewBtn {
	margin: 5% auto 0;
}
}
@media screen and (max-width:1070px) {
.viewBtn {
	margin: 3% auto 0;
}

.staff_02 .viewBtn {
	margin: 9% auto 0;
}
}

/* コンテンツ */
.detail_inner {
	position: relative;
	width: 86%;
	margin: 6% auto ;
	padding-bottom: 4%;
	border-bottom : 1px dotted #000;
}

.staff_02_01 .detail_inner {
	padding-bottom: 12%;
}

@media screen and (max-width:1600px) {
.detail_inner {
	padding: 0;
}
.staff_02_01 .detail_inner,.staff_02_02 .detail_inner  {
	padding-bottom: 1%;
}
}

@media screen and (max-width:768px) {
	
.detail_inner {
	margin: 13% auto ;
	width: 92%;
}
	
.staff_05 .detail_inner {
}
}

/* 質問・回答*/
.QandA01 ,
.QandA02 {
	max-width: 1057px;
	margin: 0 auto ;
}
.QandA01 {
	margin-bottom: 8%;
}

.QandA02{
	margin-bottom: 8%;
}

/* 質問 */
.Qtext {
	margin-bottom: 2%;
	padding-left: 0.5%;
	font-size: 27px;
	font-size: 2.7rem;
	font-style: oblique;
	font-weight: bold;
	line-height: 1;
}

.Qtext:before {
	content: url("../img/interview_after.png");
	width: 100%;
	max-width: 38px;
  height: 11px;
  vertical-align: middle;
}

/* 回答 */
.Atext {
	font-size: 17px;
	font-size: 1.7rem;
	line-height: 1.8;
}

@media screen and (max-width:1600px) {
/* 質問 */
.Qtext {
	font-size: 20px;
	font-size: 2rem;
}

.Qtext:before {
	content: url("../img/interview_after.png");
	width: 100%;
	max-width: 38px;
  height: 2px;
}


/* 回答 */
.Atext {
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 2;
}
}

@media screen and (max-width:526px) {

/* 質問 */
.Qtext {
	font-size: 17px;
	font-size: 1.7rem;
}
	
/* 回答 */
.Atext {
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 2;
}

.QandA01{
  margin: 5% auto 12%;
}

}

/*     staff01 QA 横並び      */
.QandA03_Box {
	display: block;
	width: 100%;
	max-width: 1057px;
	margin: 0 auto;
	text-align: center;	
}

.QandA03_Box .staffImg02 {
	float: left;
	width: 93%;
	max-width: 472px;
}

.QandA03_Box .staffImg02 img{
  display: block;
	width: 100%;
}

.QandA03_Box .QandA03 {
	float: right;
	width: 100%;
	max-width: 495px;
	margin: 3.5% 0 0 0;
}

/*     staff02 QA 横並び      */
.QandA03_Box02 {
	width: 100%;
	max-width: 1235px;
	margin: 0 auto;
	text-align: center;
}

.QandA03_Box02 .staffImg02 {
	float: right;
	width: 100%;
	max-width: 472px;
}

.QandA03_Box02 .staffImg02 {
	float: right;
	width: 100%;
	max-width: 472px;
}

.QandA03_Box02 .staffImg02 img {
  display: block;
	width: 100%;
}

.QandA03_Box02 .QandA03 {
	float: left;
	width: 100%;
	max-width: 717px;
}

.QandA03_Box02 .QandA03 .Qtext{
	margin-bottom: 3.5%;
}

@media screen and (max-width:1600px) {
	
/* 質問三つ目 */
.QandA03_Box {
	width: 100%;
	max-width: 1057px;
	margin: 0 auto 15%;
	text-align: center;	
}
	
.QandA03_Box .staffImg02 {
	float: none;
}

.QandA03_Box .QandA03 {
	max-width: 910px;
	margin: 0 0 5% 0; 
	float: none;
}
	
/*     staff02 QA 横並び      */

.QandA03_Box02{
	width: 100%;
	max-width: 1057px;
	margin: 0 auto 10%;
	text-align: center;
}

.QandA03_Box02 .staffImg02 {
	float: none;
}

.QandA03_Box02 .QandA03 {
	float: none;
	max-width: 920px;
	margin-bottom: 5%;	
}
}
@media screen and (max-width:526px) {

.QandA03_Box02 .QandA03,
.QandA03_Box .QandA03 {
	margin: 0 0 15% 0; 
}
}

/* 人・吹き出し */
.staff_fuki {
  display: block;
  position: absolute; right: 3%; bottom: 33%;
}

.staff_fuki img {
  display: block;
	width: 100%;
}

/* staff01 */
.staff01_fuki {
  position: absolute; right: 0; bottom: 43%;
  width: 50%;
  max-width: 218px;
}

/* staff02 */
.staff02_fuki {
	display: block;
	position: absolute; right: 35%; bottom: 3%;
	width: 30%;
	max-width: 261px;
}

/* staff03 */
.staff03_fuki {
	position: absolute; right: 0; bottom:20%;
	width: 35%;
	max-width: 253px;
}

/* staff04 */
.staff04_fuki {
	position: absolute; right: 0; bottom:43%;
	width: 35%;
	max-width: 188px;
}

/* staff05 */
.staff05_fuki {
	position: absolute; right: 0; bottom:10%;
	margin-bottom: 2em;
	width: 38%;
	max-width: 267px;
}

@media screen and (max-width:1600px) {
.staff01_fuki {
	position: absolute; right: 5%; bottom:0;
}

.staff02_fuki {
	position: absolute; left:45%; bottom:0;
}

.staff03_fuki {
	position: absolute; right: 12%; bottom:4%;
max-width: 220px;}
	
.staff04_fuki {
	position: absolute; right: 5%; bottom:0;
	max-width: 170px;
}

.staff05_fuki {
	max-width: 240px;
	position: absolute; right: 8%; bottom:0;
}
}

@media screen and (max-width:1070px) {
.staff01_fuki {
  width: 30%;
  max-width: 200px;
}

.staff03_fuki {
	position: absolute; right: 7%; bottom:0;
}
	
.staff04_fuki {
	position: absolute; right: 0; bottom:0;
  max-width: 150px;
}
.staff05_fuki {
	max-width: 220px;
	position: absolute; right: 0; bottom:0;;
}
}
@media screen and (max-width:780px) {
.staff01_fuki {
	position: absolute; right: 0; bottom:0;
  width:25%;
}
.staff02_fuki {
  position: absolute; right: 0; left: auto; bottom:0;
}
.staff03_fuki {
	position: absolute; right: 0; bottom:0;
}

.staff04_fuki {
	width: 22%;
	position: absolute;left: 0;bottom:0;
}
.staff05_fuki {
	max-width: 180px;
}
	
}
@media screen and (max-width:499px) {
.staff03_fuki {
	max-width: 120px;
}
}