@charset "UTF-8";
/*STAFF LIST*/
.staffListPage{background: gray;}
.staffListPage header{position: fixed;top:0;z-index: 10;background: rgba(0,0,0,0.8);}
.staffListPage .staffList_container{margin-top: 13.5vw;}
.staffListPage .staffList_container ul{width: 100%;display: flex;flex-wrap: wrap;}
.staffListPage .staffList_container ul li{width: 33.3%;position: relative;vertical-align: bottom;}/*3カラム*/
.staffListPage .staffList_container ul .off{opacity: 0.5;}
.staffListPage .staffList_container ul li img{width: 100%;vertical-align: bottom;}
.staffListPage .text_box{position: absolute;bottom:0;background: rgba(0,0,0,0.6);color: #fff;width: 100%;text-align: center;padding:2vw 0;}
.staffListPage .text_box　.post{font-size: 2vw}
.staffListPage .name_area{ font-size: 2.3vw;line-height: 1.5;}
.staffListPage .rank_medal{position: absolute;top:0;left:0;width: 40%;}
.staffListPage .post_area{font-size: 2.0vw;line-height: 1.5;}

.name_ju{margin-right: -10em;}


/*STAFF INNER*/
.staffDetailPage{background: gray;}
.staffDetailPage header{position: fixed;top:0;z-index: 10;background: rgba(0,0,0,0.8);}
.photo_area{margin-bottom: 20vw;}
.staff_container{position: relative;margin-top: 13.5vw;}

.staffDetailPage .rank_area{position: fixed;top:15vw;left:0;display: flex;justify-content:flex-start;width: 40%;}
.staffDetailPage .rank_area p{width: 50%;}
.staffDetailPage .rank_area p img{width: 100%;}

.staffDetailPage .bottom{position: fixed;bottom:0;width: 100%;}
.staffDetailPage .trophy{display: flex;flex-direction:row-reverse;flex-wrap: wrap-reverse;}
.staffDetailPage .trophy p{width: 16.3%}
.staffDetailPage .trophy p img{width: 100%}

.staffDetailPage .detail_text_area{z-index: 5;background: rgba(250,250,250,0.7);width: 100%;padding: 2vw 0;}
.staffDetailPage .detail_text_area .upper{display: flex;}
.staffDetailPage .center table{width: 100%;}

.staffDetailPage .name_box{width: 30%;}
.staffDetailPage .detail_area{width: 70%;}

.staffDetailPage .name_box{text-align: left;padding: 2vw auto;padding-left: 2vw; vertical-align: middle;}
.staffDetailPage .name_box .post{font-size: 2.5vw;}
.staffDetailPage .name_area{font-size: 6.6vw;}
.staffDetailPage .name_area span{font-size: 3vw}

.staffDetailPage .detail_area{padding: 1.5vw;/* display: flex;flex-wrap: wrap; */font-size: 1.8vw;line-height: 1.3;/* width: 55%; */}
.staffDetailPage .detail_area span{font-weight: bold;background: #5B5B5B;color: #fff;margin-right:1vw;padding: 0 1vw;line-height: 1.5;}
.staffDetailPage .detail_area p{/* width: 50%; */margin-bottom: 1vw;}

.staffDetailPage footer{width: 100%;text-align: center;z-index: 10;height: 20px;position: relative;}
#foo{background-color: black;padding-top: 0.98em;}

.post_area{
    font-size: 2.0vw;
}