@charset "UTF-8";

/*
================================================================
 グローバルヘッダー
================================================================
*/

/* 
$global-header-height-pc: 100px;
$global-header-height-sp: 50px;
*/

/* スクロール位置 */

/* $global-header-height-pc */

/* html {
    scroll-padding-top: calc( var(--themeval-global-header-height) + 0px );
} */
.header-height-padding {
    padding-top: var(--themeval-global-header-height);
}
.header-height-margin {
    margin-top: var(--themeval-global-header-height);
}
.header-height-negative-margin {
    margin-top: calc(var(--themeval-global-header-height) * -1);
}

/* ヘッダー */

.global-header {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: var(--themeval-global-header-height); /* $global-header-height-pc */
    color: var(--themeval-color-theme-text-black);
}
.global-header-bg {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    background: var(--themeval-color-theme-white);
    overflow: hidden;
}
.global-header .layout-container {
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
.global-header a {
    color: inherit;
    text-decoration: inherit;
    opacity: 1;
    transition: opacity var(--themeval-hover-transition);
}
html:not(.agent-prop--Touch) .global-header a:hover {
    opacity: var(--themeval-hover-opacity); /* $hover-opacity */
}


/* タイトル部 */

.global-header-title {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
}
.global-header-title__label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 12;
    display: block;
    box-sizing: border-box;
    width: auto;
    height: calc(var(--themeval-global-header-height) * 1.1); /* $global-header-height-pc */
    padding: 0;
    margin: 0;
}
.global-header-title__label > * {
    float: left;
    position: relative;
    display: block;
    width: auto;
}
.global-header-title__label > *:not(:first-child) {
    margin-left: calc(var(--themeval-global-header-height) * 0.2);
}
.global-header-title__label > img {
    width: auto;
    height: 100%;
}


/* コーポレートロゴ */

.global-header-corp {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
}
.global-header-corp__label {
    position: absolute;
    top: calc(var(--themeval-global-header-height) * 0.3);
    right: calc(var(--themeval-global-header-height) * 0.4);
    z-index: 12;
    display: block;
    box-sizing: border-box;
    width: auto;
    height: calc(var(--themeval-global-header-height) * 0.4); /* $global-header-height-pc */
    padding: 0;
    margin: 0;
}
.global-header-corp__label > * {
    float: right;
    position: relative;
    display: block;
    width: auto;
}
.global-header-corp__label > *:not(:last-child) {
    margin-right: calc(var(--themeval-global-header-height) * 0.2);
}
.global-header-corp__label > img {
    width: auto;
    height: 100%;
}




/* SPヘッダー適用 */

/* @media (max-width: 1279px), (min-width: 1280px) and (max-height: 859px) { */
@media (max-width: 1079px), (min-width: 1080px) and (max-height: 767px) {

    /* ヘッダー高さ指定の変更 */
    :root {
        --themeval-global-header-height: 80px;
    }


    /* タイトル部 */


    /* ハンバーガーメニュー ボタン */

    .global-header-toggle-button {
        right: 0;
        top: 0;
    }

}
/* @media (max-width: 959px), (min-width: 960px) and (max-height: 719px) { */
@media (max-width: 767px), (min-width: 768px) and (max-height: 639px) {

    /* ヘッダー高さ指定の変更 */
    :root {
        --themeval-global-header-height: 60px;
    }


    /* タイトル部 */


    /* ハンバーガーメニュー ボタン */

    .global-header-toggle-button {
        right: 0;
        top: 0;
    }

}
@media (max-width: 639px){


    /* タイトル部 */

    /* コーポレートロゴ */

    .global-header-corp__label {
        right: calc(var(--themeval-global-header-height) * 0.2);
    }

}

