@charset "UTF-8";

/* カード内の所属店舗 */
.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoStore {
    margin-top: 8px;
}

.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoStore .el_staffListItem_infoStoreInner {
    font-size: 12px;
    line-height: 1.4;
    color: #7A7A7A;
}

/* ホバーで情報エリアがピンク背景になるので、所属店舗も白にする（氏名の英字と同じ扱い） */
@media (hover: hover) and (pointer: fine) {
    .page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_inner:hover .el_staffListItem_info .el_staffListItem_infoStore .el_staffListItem_infoStoreInner {
        color: #fff;
    }
}

/* 詳細ページのカードでは所属店舗を項目側に出すので、カード内には出さない */
.page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_info .el_staffListItem_infoStore {
    display: none;
}

/* 氏名が長い人（中濵 和佳奈 等）で日本語名が2行に折り返してカードの高さがずれるのを防ぐ。
   日本語名は必ず1行にし、日英の間隔を詰めて収める。それでも収まらない長い氏名が来た場合は
   英字名だけが次の行へ送られる（カードは崩れない） */
.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoName .el_staffListItem_infoNameInner,
.page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_info .el_staffListItem_infoName .el_staffListItem_infoNameInner {
    flex-wrap: wrap;
    column-gap: 6px;
}

.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoName .el_staffListItem_infoNameInner .__ja,
.page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_info .el_staffListItem_infoName .el_staffListItem_infoNameInner .__ja {
    white-space: nowrap;
}

/* 写真の枠は画像の実寸に依存させない。枠の幅から高さが決まるようにして、
   どんな縦横比の写真を入れてもカード内の位置がずれないようにする */
.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg,
.page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg {
    height: auto;
    aspect-ratio: 200 / 300;
}

.page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg img,
.page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: bottom;
}

@media screen and (max-width: 750px) {
    .page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoStore {
        margin-top: 2.13vw;
    }

    .page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_info .el_staffListItem_infoStore .el_staffListItem_infoStoreInner {
        font-size: 3.2vw;
    }

    .page_staff .page_staff_container .bl_home_staffList .el_staffList .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg,
    .page_staff_single .page_staff_single_container .page_staff_single_box .el_staffListItem .el_staffListItem_top .el_staffListItem_topImg {
        aspect-ratio: 200 / 280;
    }
}
