@charset "UTF-8";
/* ======================================================================================

   footer.css
   共通フッター（PCフッター・SPフッター・会社情報・電話番号・フッターナビ・
   SPフッターアコーディオン・最下部の青帯・PageTop）
   common_body.css からの分離（分離元コメントはそのまま維持）

====================================================================================== */

/* ######################################################################################

　Footer（common）

###################################################################################### */

.footer{
    background:#ffffff;
    color:#111111;
}

/* ----- サイトマップ・アコーディオン（SPのみ、.meanMenuAcc） -----
   現行サイト(https://actfactory.net/)実機確認：<details>/<summary>ではなく、通常の
   <ul><li><a>+ 子持ちの場合は入れ子<ul></li></ul>とcommon.js内の専用スクリプトが
   親liへ追加する<a class="meanAcc-expand">の組み合わせで実装されている
   （ヘッダーのjquery.meanmenuと見た目は揃えつつ、開閉の仕組み自体は共通化しない別物）。
   矢印は疑似要素で描画し、.meanAcc-clicked（開いた状態、JS側が付け外し）で向きを変える。 */
@media screen and (max-width:767px){
    .sitemapAcc ul{
        width:100%;
        padding:0;
        margin:0;
        list-style:none;
    }
    .sitemapAcc li{
        position:relative;
        width:100%;
    }
    /* 不具合修正：現行サイト実機のwidget.css（.meanMenuAcc, .mean-container .mean-nav
       {...}という共通ルール）を根拠に、ヘッダー側.mean-navと同じ配色・数値へ揃える。
       親メニューはグレー(#f1f2f6)背景・font-size 1.5rem(15px)、縦罫線は無し */
    .sitemapAcc > ul > li{
        border-bottom:1px solid #dbe2e6;
        background:#f1f2f6;
    }
    /* 不具合修正：ハンバーガーメニュー側で発見したのと同じ原因（common_first.cssの
       body{line-height:1.75}を継承したまま、現行サイトのline-height:1が未反映）で、画面幅393pxの実測が
       約72.77px相当まで増えていた（22.5px×2＋border1px＋line-height1.75×15px≒26.25px）。
       現行サイト・ヘッダー側アコーディオンと同じ61px（22.5px×2＋border1px＋line-height1×15px）
       になるよう、height指定＋display:flexで確実に固定する（フォント内部メトリクスの
       誤差を受けるline-height計算に頼らない）。scrollbar-gutter:stable適用下ではvwの
       基準幅が縮む（393px幅で実測1vw≒3.78px）ため、61pxは61/393ではなく61/378で算出した
       値を使う（ヘッダー側.mean-nav > ul > li > aと同じ換算） */
    .sitemapAcc > ul > li > a{
        display:flex;
        align-items:center;
        height:16.1376vw; /* 61px */
        padding:0 13.4615vw 0 3.8462vw;
        font-weight:bold;
        font-size:3.8462vw;
        color:#111111;
        text-decoration:none;
    }
    .sitemapAcc ul ul{
        background:#ffffff;
    }
    .sitemapAcc ul ul li{
        border-bottom:1px solid #dbe2e6;
    }
    /* 第2階層は白背景・青太字・文字サイズは第1階層と同じ（字下げしない） */
    .sitemapAcc ul ul a{
        display:block;
        padding:5.7692vw 13.4615vw 5.7692vw 3.8462vw;
        color:#005bac;
        font-weight:bold;
        font-size:3.8462vw;
        text-decoration:none;
    }
    /* 第3階層以降で文字サイズを落とし黒文字にする */
    .sitemapAcc ul ul ul a{
        padding:4vw 13.4615vw 4vw 7.1795vw;
        color:#111111;
        font-size:3.3333vw;
    }
    .sitemapAcc ul ul ul ul a{
        padding-left:10.5128vw;
    }
    /* 開閉トリガー（子持ちの<ul>を持つ<li>にだけJS側が追加する） -----
       現行サイト実機のwidget.css実測に合わせ、罫線・背景を持たない領域に
       太さ2px・長さ1.25em(≒17.5px)の十字を疑似要素で描画する。文字の"+"/"−"は
       使用せず、.meanAcc-clickedで縦線のみ表示/非表示を切り替える */
    /* 不具合修正：親要素.sitemapAcc > ul > li > aのpadding（子孫ではなく直接の
       兄弟である.meanAcc-expandにも同じ直接子セレクタで及ぶ）が、padding未指定の
       ままだとbox-sizing:border-box下で明示したwidth(56px)より大きくなり、
       タップ領域が意図せず広がっていた。padding:0を明示して解消。
       高さは行の実高さ61pxに合わせ、行の上端から下端まで反応領域にする */
    .sitemapAcc a.meanAcc-expand{
        position:absolute;
        top:0;
        right:0;
        z-index:2;
        display:block;
        width:14.8148vw; /* 56px */
        height:16.1376vw; /* 61px */
        padding:0;
    }
    .sitemapAcc a.meanAcc-expand::before,
    .sitemapAcc a.meanAcc-expand::after{
        content:"";
        position:absolute;
        top:50%;
        left:50%;
        background:#18639f;
        transform:translate(-50%, -50%);
    }
    .sitemapAcc a.meanAcc-expand::before{
        width:4.4872vw;
        height:2px;
    }
    .sitemapAcc a.meanAcc-expand::after{
        width:2px;
        height:4.4872vw;
    }
    .sitemapAcc a.meanAcc-expand.meanAcc-clicked::after{
        display:none;
    }
}

/* ----- 会社情報ブロック ----- */

.companyInfo{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
}
.companyInfo__office dt{
    font-weight:bold;
}
.companyInfo__certs{
    display:flex;
    align-items:flex-end;
}
.companyInfo__certs img{
    width:auto;
}

@media print, screen and (min-width:768px){
    /* Figma実寸(node 6035:148、get_design_context実測)：ロゴ(349×50.6px)は
       京都本社/東京支店の住所ブロックと同じ行に左端から並ぶ。SP専用画像(logo_sp.png)ではなく、
       Figma上の「logobw」と同一素材である会社ロゴ(logo.png)を使用する。
       帯全体の高さ160pxに対し、内容の上端は帯上端から実測46px、下端は帯下端から実測45pxのため
       上下非対称でpadding指定する。ロゴ〜住所〜認証ロゴの4要素は帯の内容幅(実測1180px)いっぱいに
       justify-content:space-betweenで並ぶ（要素ごとの間隔がFigma実測で48/38/43pxと不均等な
       ため、固定gapではなくspace-betweenで再現する）。 */
    .companyInfo{
        flex-direction:row;
        align-items:flex-start;
        justify-content:space-between;
        max-width:118rem;
        margin:0 auto;
        padding:4.6rem 2rem 4.5rem;
        text-align:left;
    }
    .companyInfo__logo{
        flex:none;
    }
    .companyInfo__logo img{
        height:5.06rem;
        width:auto;
        aspect-ratio:349/50.6;
    }
    .companyInfo__office{
        font-size:1.3rem;
    }
    .companyInfo__office dt{
        font-size:1.4rem;
    }
    /* Figma実測：住所・電話番号行のみtracking0.65px。見出し(dt)にはtrackingが無い */
    .companyInfo__office dd{
        letter-spacing:0.065rem;
    }
    .companyInfo__certs{
        align-items:flex-start;
        gap:2.2rem;
    }
    /* 不具合修正：Footer2026.html側はMTテンプレートの既存仕様どおり証明書ロゴを<a>で
       外部リンク化しているため、imgがcompanyInfo__certsの直接の子ではなくaの子になる。
       index_2026.html側（リンクなし、imgが直接の子）とMT側（リンクあり）の両方の
       マークアップに対応できるよう、img自身がfirst/last-childの場合と、
       aがfirst/last-childでその中のimgの場合の両方を指定する */
    .companyInfo__certs img:first-child,
    .companyInfo__certs a:first-child img{
        height:6.5rem;
    }
    .companyInfo__certs img:last-child,
    .companyInfo__certs a:last-child img{
        height:6.59rem;
    }
}
@media screen and (max-width:767px){
    /* Figma実測(node 8002:243/244)：帯paddingは30px(縦)/50px(横)、要素間gapは30px。
       ロゴはFigma上でw-full（内側幅＝画面幅390px-左右padding100px=290pxいっぱいに伸縮、
       aspect-ratio 266/38で高さが決まる）ため、以前のheight固定(9.7436vw)ではなく
       幅基準に変更する */
    .companyInfo{
        gap:7.6923vw;
        padding:7.6923vw 12.8205vw;
    }
    .companyInfo__logo{
        width:100%;
    }
    .companyInfo__logo img{
        width:100%;
        height:auto;
        aspect-ratio:266/38;
    }
    /* 不具合修正：.companyInfoのベース指定(text-align:center)を継承し、京都本社/東京支店の
       住所ブロックがSPだけ中央揃えになっていた（PC側は既にtext-align:leftで上書き済み）。
       Figma実測(node 8002:243〜252)：拠点名16px/住所・TEL・FAX 14pxで、現状(14px/12px)は
       どちらも1段階小さいため合わせて修正する */
    .companyInfo__office{
        text-align:left;
        font-size:3.5897vw;
        line-height:1.5;
    }
    .companyInfo__office dt{
        font-size:4.1026vw;
    }
    .companyInfo__certs{
        gap:5.1282vw;
    }
    .companyInfo__certs img:first-child,
    .companyInfo__certs a:first-child img{
        height:14.6154vw;
    }
    .companyInfo__certs img:last-child,
    .companyInfo__certs a:last-child img{
        height:15.8974vw;
    }
}

/* ----- 最下部バー ----- */

.bottomBar{
    background:#005bac;
    color:#f1f2f6;
    text-align:center;
}
.bottomBar__nav{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
.bottomBar__nav a{
    display:inline-block;
}

@media print, screen and (min-width:768px){
    /* Figma実寸(node 6035:138)：コピーライトを左、リンク一覧を右に配置した横一列の帯。
       中央寄せの積み重ねではない。帯の高さは実測120px。従来はpadding:1.4rem（縦28px相当）
       しか無く高さ約51pxしか出ておらず大幅に不足していたため、実測に基づき縦paddingを
       再算出する（帯高さ120px、コピーライト/リンクとも上下ほぼ均等になる実測値）。
       文字色は白(#ffffff)ではなくFigma実測の#f1f2f6。ナビゲーションリンクの間隔は
       実測30〜34px（項目ごとの文字幅測定誤差の範囲でほぼ均等）のため32pxのgapで統一する。 */
    .bottomBar{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:2rem;
        padding:4.7rem 20rem;
        text-align:left;
    }
    .bottomBar__nav{
        justify-content:flex-end;
        gap:0 3.2rem;
        font-size:1.3rem;
    }
    .bottomBar__copyright{
        margin-top:0;
        font-size:1.2rem;
        letter-spacing:0.1em;
    }
}
@media screen and (max-width:767px){
    /* Figma実測(node 8002:323/325)：SP最下部の帯はコピーライトのみの単純な帯(高さ63px)。
       ナビゲーションリンク一覧はFigma上に存在しない（サイトマップ・アコーディオンが
       SP版の同等コンテンツを既に担っているため）。PC版のbottomBar__navはSPでは非表示にする */
    .bottomBar{
        display:flex;
        align-items:center;
        justify-content:center;
        height:16.1538vw;
        padding:0 5.1282vw;
    }
    .bottomBar__nav{
        display:none;
    }
    .bottomBar__copyright{
        margin-top:0;
        font-size:3.0769vw;
    }
}

/* ######################################################################################

　ページトップボタン（common）

###################################################################################### */

/* Figma実寸(node 6080:129、get_design_context実測)：92×92pxの正方形ボタン(#005bac)。
   円形(border-radius:50%)はFigma上に存在しないため廃止する。
   不具合修正：この要素は<button id="PageTop" class="pageTop">（common.jsがgetElementById
   で参照、Footer2026.html参照）。common_first.cssの`button:not(...){background:none;
   color:inherit;font:inherit;...}`リセット（詳細度0,1,1）が、単一class指定の.pageTop
   （詳細度0,1,0）より詳細度で上回るため、background/color/font-size（fontショートハンド
   に含まれる）が軒並み打ち消され、背景透明・矢印色が本文色へ、文字サイズがhtml{font-size:10px}
   基準へ縮小していた。下層ページへの打ち消しCSSやbutton側リセットの変更ではなく、この要素
   固有のid（既にJSから参照されている#PageTop、他に同名IDは存在しない）を使い、
   詳細度(1,0,0)で確実に上回るようにする */
#PageTop{
    position:fixed;
    right:2rem;
    bottom:2rem;
    z-index:400;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#005bac;
    color:#ffffff;
    opacity:0;
    visibility:hidden;
    transform:translateY(0.5rem);
    transition:opacity 0.3s, transform 0.3s, visibility 0.3s;
}
#PageTop.isVisible{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}
/* 上向き矢印は装飾のため疑似要素で実装する（HTML側に空のspanを置かない） */
#PageTop::after{
    content:"↑";
}

@media print, screen and (min-width:768px){
    /* 指示によりPCは6rem角・右下とも6remの位置へ変更する */
    #PageTop{
        width:6rem;
        height:6rem;
        right:6rem;
        bottom:6rem;
        font-size:1.8rem;
    }
}
@media screen and (max-width:767px){
    #PageTop{
        right:4.1026vw;
        bottom:4.1026vw;
        width:11.7949vw;
        height:11.7949vw;
        font-size:5.1282vw;
    }
}