.staff{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.staff > div{
border-top: 1px solid #ddd;
width: min(46.087vw,530px);
padding: 30px 0;
}

.staff > div > div{
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
align-items: flex-start;
border-width: 0 0 0 min(0.87vw, 10px);
border-style: solid;
padding: 30px 0 30px min(3.4783vw, 40px);
font-size: 10px;
}

.staff .prof{
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
width: 43.75%;
padding-top: 4.2rem;
font-size: min(0.87vw, 10px);
}

.staff .prof h3,
.staff .prof p,
.staff .comment p:not(.intro){
line-height: 1;
}

.staff .position{
order: 0;
background-color: #000;
color: #fff;
padding: 0.3em 0.6em 0.4em 0.6em;
margin-bottom: 1.5em;
font-size: 1.3em;
}
.staff h3{
order: 2;
margin-bottom: 0.4em;
font-size: 3.3em;
}
.staff .rome{
order: 1;
margin-bottom: 1em;
font-size: 1.3em;
font-weight: bold;
}
.staff .furigana{
order: 3;
margin-bottom: 1.5em;
font-size: 1.8em;
}
.staff .job{
order: 4;
margin-bottom: 0;
font-size: 1.5em;
}


.staff .photo{
background-color: #eee;
width: 50%;
height: min(26.087vw, 300px);
margin:0 min(2.6087vw, 30px) 0 0;
}

.staff .photo img{
object-fit: cover;
width: 100%;
height: 100%;
}

.staff .comment{
width: 100%;
margin-top: 30px;
font-size: min(0.87vw, 10px);
}

.staff .comment p{
font-size: 1.5em;
}

.staff .favorite{
margin-top:1.3em;
}

.staff .favorite.hidden{
visibility: hidden;
}

.staff .job span,
.staff .favorite span{
display: block;
border: 1px solid #000;
width: 3.2em;
padding: 0.2em 0.4em 0.3em 0.4em;
text-align: center;
}

.staff .job span{
margin-bottom: 0.4em;
}

.staff .favorite span{
display: inline-block;
margin:0 0.4em 0.4em 0;
}

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

.staff > div{
width: 100%;
padding: 5vw 0;
}

.staff > div > div{
display: block;
border-left: none;
padding: 0;
}

.staff > div > div::after{
content:"";
display: block;
clear: both;
}

.staff .prof{
float: right;
width: 45%;
padding-top: 5vw;
font-size: 2vw;
}

.staff .photo{
float: left;
height: 50vw;
margin-right: 5%;
}

.staff .photo img{
object-position: top;
}

.staff .comment{
clear: both;
padding-top: 5vw;
font-size: 2vw;
}

.staff .favorite{
margin-bottom: 0;
}

}