@charset "utf-8";
/*---------------------- staffList ----------------------*/
ul.staffList li {
  list-style-type: none;
  padding: 20px 0 0;
  text-align: center;
}
ul.staffList li img {
  max-width: 100%;
}
ul.staffList li p.name {
  font-size: 22px;
  font-weight: 700;
  color: #000;
  margin: 15px 0 15px;
}
ul.staffList li p.position {
  background-color: #9a001b;
  color: #FFF;
  display: inline-block;
  padding: 5px 10px;
  margin: 0 0 10px;
}
ul.staffList li p.job {
  line-height: 150%;
  margin: 0 0 10px;
}
ul.staffList li p.greeting {
  line-height: 150%;
  color: #9a001b;
  margin: 0 0 10px;
}
ul.staffList li p.link {
  display: inline-block;
  text-align: right;
  width: 15em;
}
ul.staffList li p.link a {
  display: inline-block;
  line-height: normal;
  position: relative;
  padding: 0 25px 0 0;
  color: #a07832;
}
ul.staffList li p.link a::before {
  position: absolute;
  top: 50%;
  margin-top: -9px;
  right: 0;
  content: "";
  width: 18px;
  height: 18px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background-color: #a07832;
}
ul.staffList li p.link a::after {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  top: 50%;
  margin-top: -4px;
  right: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media(min-width: 768px) {
  ul.staffList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    max-width: 980px;
    margin: auto;
  }
  ul.staffList li {
    width: 28%;
    margin: 0 8% 4% 0;
  }
  ul.staffList li:nth-child(3n) {
    margin-right: 0;
  }
}
@media (max-width: 767px) {
  ul.staffList {
    margin: 7% 12%;
  }
  ul.staffList li {
    padding: 0;
    margin: 0 0 12%;
  }
  ul.staffList li:last-of-type {
    margin: 0;
  }
}

/*---------------------- staffList02 ----------------------*/
ul.staffList02 li {
  list-style-type: none;
  padding: 20px 0 0;
  text-align: center;
}
ul.staffList02 li img {
  max-width: 100%;
}
ul.staffList02 li p.name {
  font-size: 22px;
  font-weight: 700;
  color: #000;
  margin: 15px 0 15px;
}
ul.staffList02 li p.position {
  background-color: #9a001b;
  color: #FFF;
  display: inline-block;
  padding: 5px 10px;
  margin: 0 0 10px;
}
ul.staffList02 li p.job {
  line-height: 150%;
  margin: 0 0 10px;
}
ul.staffList02 li p.greeting {
  line-height: 150%;
  color: #9a001b;
  margin: 0 0 10px;
}
ul.staffList02 li p.link {
  display: inline-block;
  text-align: right;
  width: 15em;
}
ul.staffList02 li p.link a {
  display: inline-block;
  line-height: normal;
  position: relative;
  padding: 0 25px 0 0;
  color: #a07832;
}
ul.staffList02 li p.link a::before {
  position: absolute;
  top: 50%;
  margin-top: -9px;
  right: 0;
  content: "";
  width: 18px;
  height: 18px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background-color: #a07832;
}
ul.staffList02 li p.link a::after {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  top: 50%;
  margin-top: -4px;
  right: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media(min-width: 768px) {
  ul.staffList02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    max-width: 980px;
    margin: auto;
  }
  ul.staffList02 li {
    width: 28%;
    margin: 0 8% 4% 0;
  }
  ul.staffList02 li:nth-child(3n) {
    margin-right: 0;
  }
}
@media (max-width: 767px) {
  ul.staffList02 {
    margin: 7% 12%;
  }
  ul.staffList02 li {
  	width: 42%;
    padding: 0;
    margin: 0 0 12%;
  }
  ul.staffList02 li:last-of-type {
    margin: 0;
  }
  
.staffList02 li {
	width: 45%;
	margin-left:3.33%;
	margin-bottom:3.33%;
	display:inline-block;
	vertical-align:top;
	letter-spacing: 0.1em;
} 
}