#staff {
padding: 40px 0 200px;
}
#staff .staff-section-title {
text-align: center;
margin-bottom: 40px;
}
#staff .staff-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 35px;
max-width: 1720px;
margin: 0 auto;
padding: 0 40px;
box-sizing: border-box;
}
#staff .staff-item {
width: calc((100% - 175px) / 6);
text-align: center;
}
#staff .staff-item a {
text-decoration: none;
color: inherit;
display: block;
}
#staff .staff-photo {
overflow: hidden;
margin-bottom: 18px;
aspect-ratio: 258 / 320;
}
#staff .staff-photo img {
width: 100%;
height: auto;
display: block;
transition: transform 0.3s ease;
}
#staff .staff-item a:hover .staff-photo img {
transform: scale(1.1);
}
#staff .staff-name {
font-size: 28px;
font-weight: normal;
line-height: 1.75;
margin-bottom: 8px;
}
#staff .staff-position {
font-size: 17px;
line-height: 1.75;
margin-bottom: 8px;
}
@media (max-width: 1200px) and (min-width: 1025px) {
#staff .staff-item {
width: calc((100% - 105px) / 4);
}
}
@media (max-width: 1024px) and (min-width: 768px) {
#staff .staff-item {
width: calc((100% - 70px) / 3);
}
}
@media (max-width: 767px) {
#staff {
padding: 20px 0 100px;
}
#staff .staff-list {
display: block;
padding: 0;
}
#staff .staff-item {
width: 260px;
padding: 0 12px;
}
} #archive-staff {
padding: 60px 0 100px;
background-image: url(//mm-property.jp/wp-content/themes/mm-p-theme/images/archive-staff-bg.webp);
background-size: 100% 1368px;
background-position: top center;
background-repeat: no-repeat;
}
#archive-staff .archive-staff-header {
text-align: center;
margin-bottom: 60px;
}
#archive-staff .archive-staff-breadcrumb {
font-size: 14px;
color: #666;
text-align: left;
max-width: 1130px;
margin: 0 auto 30px;
padding-left: 40px;
}
#archive-staff .archive-staff-breadcrumb a {
color: #666;
text-decoration: none;
}
#archive-staff .archive-staff-breadcrumb a:hover {
color: #00947A;
}
#archive-staff .archive-staff-inner {
max-width: 1130px;
margin: 0 auto;
padding: 0 40px;
box-sizing: border-box;
} #archive-staff .archive-staff-item {
margin-bottom: 96px;
} #archive-staff .archive-staff-item--featured {
margin-bottom: 152px;
} #archive-staff .archive-staff-item--featured {
text-align: center;
}
#archive-staff .archive-staff-photo--wide {
margin-bottom:  20px;
overflow: hidden;
}
#archive-staff .archive-staff-photo--wide img {
width: 100%;
height: auto;
display: block;
} #archive-staff .archive-staff-columns {
display: flex;
align-items: stretch;
gap: 50px;
margin-bottom: 34px;
}
#archive-staff .archive-staff-left {
width: 500px;
flex-shrink: 0;
text-align: center;
display: flex;
flex-direction: column;
}
#archive-staff .archive-staff-photo {
overflow: hidden;
margin-bottom: 20px;
flex: 1;
}  @media (max-width: 1024px) and (min-width: 768px) {
#archive-staff .archive-staff-columns {
flex-direction: column;
gap: 40px;
}
#archive-staff .archive-staff-left {
width: 100%;
display: block;
} #archive-staff .archive-staff-photo {
width: 400px;
height: 496px;
flex: none;
margin: 0 auto 30px;
}
#archive-staff .archive-staff-photo img {
width: 100%;
height: 100%;
object-fit: cover;
}
#archive-staff .archive-staff-right {
width: 100%;
}
}  #archive-staff .archive-staff-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
#archive-staff .archive-staff-right {
flex: 1;
} #archive-staff .archive-staff-name {
font-size: 28px;
font-weight: normal;
line-height: 1.75;
letter-spacing: 0.1em;
margin-bottom: 0;
color: #000;
}
#archive-staff .archive-staff-position {
font-size: 17px;
line-height: 1.75;
letter-spacing: 0.05em;
color: #000;
}
#archive-staff .archive-staff-experience {
font-size: 17px;
line-height: 1.75;
letter-spacing: 0.05em;
color: #000;
margin-bottom: 0;
}
#archive-staff .archive-staff-message-title {
font-size: 29px;
line-height: 1.75;
letter-spacing: 0.1em;
font-weight: normal;
margin-bottom: 50px;
color: #000;
}
#archive-staff .archive-staff-message {
font-size: 22px;
line-height: 1.72;
letter-spacing: 0.05em;
font-weight: normal;
color: #000;
} #archive-staff .archive-staff-details {
border: 2px solid #d0f8f2;
border-radius: 20px;
padding: 36px 45px;
position: relative;
}
#archive-staff .archive-staff-details::before {
content: '';
position: absolute;
top: 36px;
bottom: 36px;
left: calc(45px + 180px);
width: 2px;
background-color: #d0f8f2;
}
#archive-staff .archive-staff-detail-row {
display: flex;
font-size: 22px;
line-height: 1.72;
letter-spacing: 0.05em;
margin-bottom: 8px;
color: #808080;
}
#archive-staff .archive-staff-detail-row:last-child {
margin-bottom: 0;
}
#archive-staff .archive-staff-detail-label {
width: 180px;
flex-shrink: 0;
color: #808080;
font-weight: normal;
padding-right: 30px;
margin-right: 30px;
}
#archive-staff .archive-staff-detail-value {
flex: 1;
}
@media (max-width: 767px) {
#archive-staff {
padding: 40px 0 0;
}
#archive-staff .archive-staff-breadcrumb {
padding-left: 20px;
}
#archive-staff .archive-staff-inner {
max-width: 600px;
padding: 0;
}
#archive-staff .archive-staff-item {
padding: 0 20px;
margin-bottom: 50px;
}
#archive-staff .archive-staff-columns {
flex-direction: column;
gap: 20px;
margin-bottom: 10px;
}
#archive-staff .archive-staff-left {
width: 100%;
display: block;
}
#archive-staff .archive-staff-photo {
flex: none;
max-width: 250px;
height: auto;
margin: 0 auto 20px;
}
#archive-staff .archive-staff-photo img {
height: auto;
aspect-ratio: 500 / 620;
}
#archive-staff .archive-staff-photo--wide {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}
#archive-staff .archive-staff-item--featured {
padding: 0;
margin-bottom: 80px;
}
#archive-staff .archive-staff-item--featured .archive-staff-name,
#archive-staff .archive-staff-item--featured .archive-staff-position {
padding: 0 20px;
} #archive-staff .archive-staff-message-title {
font-size: 20px;
margin-bottom: 20px;
}
#archive-staff .archive-staff-message {
font-size: 16px;
text-align: justify;
font-feature-settings: "palt";
}
#archive-staff .archive-staff-details {
padding: 16px 16px;
border-radius: 0;
}
#archive-staff .archive-staff-details::before {
top: 16px;
bottom: 16px;
left: calc(16px + 110px);
}
#archive-staff .archive-staff-detail-row {
font-size: 14px;
}
#archive-staff .archive-staff-detail-label {
width: 110px;
padding-right: 10px;
margin-right: 10px;
}
}  .cv_area {
max-width: 1050px;
margin: 20px auto !important;
}
.cv_area img {
width: 100%;
height: auto;
display: block;
}
.portal-banner-wrap {
position: relative;
display: block;
}
.portal-btn-pc {
position: absolute;
top: 54%;
right: 1%;
transform: translateY(-50%);
display: flex;
flex-direction: column;
gap: 8px;
width: 30%;
}
.portal-btn-pc a img {
transition: opacity 0.3s;
}
.portal-btn-pc a:hover img {
opacity: 0.8;
}
.portal-btn-sp {
position: absolute;
bottom: 0%;
left: 50%;
transform: translateX(-50%);
display: flex;
flex-direction: row;
justify-content: center;
gap: 10px;
width: 94%;
z-index: 2;
}
.portal-btn-sp a {
width: 48%;
display: block;
}
@media (max-width: 990px) {
.cv_area {
width: 90% !important;
}
.cv_area img {
width: 100% !important;
margin: 0 !important;
}
} @media (min-width: 768px) {
.is-sp {
display: none !important;
}
}
@media (max-width: 767px) {
.is-pc {
display: none !important;
}
}