/*---------------------------
店舗一覧ページ専用パーツ
（もとはcss/lower_page.cssの汎用カードリストと共通だったが、
店舗一覧だけ体裁を変えるために分離）
---------------------------*/

.office_list_group { width:100%; }
.office_list_group + .office_list_group { margin-top:56px; }
.office_list_group_heading { width:100%; font-size:24px; font-weight:bold; padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid #e3e3e3; }
.office_list_subgroup + .office_list_subgroup { margin-top:48px; }
.office_list_subgroup_heading { width:100%; padding:5px 0 5px 10px; font-size:16px; font-weight:bold; margin-bottom:16px; display:block; background:#000; color:#fff; }
.office_list { display:grid; grid-template-columns:repeat(2, 1fr); gap:40px 16px; margin-top:40px; }
.office_office_link { display:block; }
.office_list_img { display:block; margin-bottom:12px; aspect-ratio:430/280; overflow:hidden; }
.office_list_img img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.4s ease; }
.office_office_link:hover .office_list_img img { transform:scale(1.08); }
.office_list_name { position:relative; display:inline-block; font-size:16px; font-weight:700; letter-spacing:0.08em; padding-bottom:16px; }
.office_list_name::after { content:''; position:absolute; left:0; bottom:0; width:40px; height:1px; background:#000; }

@media screen and (min-width:769px){
    .office_list_group + .office_list_group { margin-top:96px; }
    .office_list_group_heading { font-size:35px; padding-bottom:32px; margin-bottom:40px; }
    .office_list_subgroup + .office_list_subgroup { margin-top:64px; }
    .office_list_subgroup_heading { max-width:350px; font-size:20px; }
    .office_list { grid-template-columns:repeat(3, 1fr); gap:100px 32px; }
    .office_list_img { margin-bottom:16px; }
    .office_list_name { font-size:20px; }
}

.list_link_heading { font-weight:normal; }
.list_link_area_heading { font-size:15px; border-bottom:0; padding:0; margin:0 0 8px 0; letter-spacing:0.08em; }
.list_link_sub_heading { margin-bottom:8px; padding:5px 0 5px 5px; background:#000; color:#fff; line-height:1em; font-size:14px; font-weight:normal; }
.list_link_items { gap:8px; }

.list_link_top { padding-bottom:0; }


@media screen and (min-width:769px){
    .list_link_area_heading { font-size:24px; }
    .list_link_sub_heading { font-size:16px; }
    /*.h1_wrappers { margin-bottom:0; }*/
    
}

.scrollfix_caption_extra { margin-top:0; }

/*事業ページ等の.h1_img（format.css側でposition:absolute; top:40px; right:40px;で右上配置）と
同じ位置に、店舗ページの動画も420×236の枠でぴったり収まる形で配置する。
枠(.h1_img_frame)側に位置指定を持たせ、中の動画(.h1_img)はformat.cssの位置指定を打ち消して
枠いっぱいに敷き詰める*/
.h1_img_frame { width:100%; height:236px; overflow:hidden; display:block; }
.wrapper.is-h1-img-relative .h1_img_frame .h1_img {
    position:static; width:100%; height:100%; object-fit:cover; display:block;
}

.h1_img_frame { margin-bottom:24px; }
 .wrapper.is-h1-img-relative .h1_img_frame { width:100%; height:auto; }
@media screen and (min-width:769px){
    .wrapper.is-h1-img-relative .h1_img_frame {
        position:absolute; top:40px; right:40px; z-index:-1;
        /*width:420px; height:236px; */width:579px; height:325px; overflow:hidden; display:block; margin-bottom:initial; 
    }
}

/*一覧部分の上書き*/
@media screen and (max-width:1024px){
    .list_link_col + .list_link_col { margin-top:16px; }
}