/**
 * ==========================================================================
 *
 * Index
 *
 * 2cols
 * 1col
 * on scroll
 * Default header and menu. Simple header and menu.
 * Primary menu.
 * Attribute data-type accordion
 * Javascript disable. primary menu
 * Widget Navigation Menu
 * Table of contents
 *
 * ==========================================================================
 *
 * dinamic attribute
 *
 * data-direction="horizontal" ( default )
 *      For PC view horizontal menu
 * data-direction="vertical"
 *      For Mobile view vertical menu ( need javascript )
 * data-type="accordion"
 *      caret click show child
 *      If there is no accordion class, the child menu will be displayed on the right.
 *
 * ==========================================================================
 */
.primary-menu-wrapper{
    max-width:100%;
}
/**
 * 1col
 * ========================================================================== */
.emulsion-no-sidebar{
    .primary-menu-wrapper{
        display:flex;
        flex-wrap:wrap;
        margin-right:auto;
        margin-left:auto;
        .menu-placeholder:nth-child(1):nth-last-child(1){
            position:absolute;
            right:0;
            z-index:1;
            width:var( --thm_sidebar_width, 400px );
            min-width:var( --thm_sidebar_width, 400px );
            max-width:var( --thm_sidebar_width, 400px );
        }
        nav[class|="menu"]{
            flex:1 1 auto;
        }
        &.menu-inactive{
            display:none;
            .menu-placeholder{
                display:none;
            }
        }
        .menu-placeholder:empty{
            display:none;
        }
        .menu-placeholder{
            position:absolute;
            right:0;
            bottom:0;
            z-index:1;
            flex:1 1 auto;
            width:var(--thm_content_min_width, 296px);
            min-width:var(--thm_content_min_width, 296px);
            text-align:right;
        }
        .menu-simple-container{
            ul.wp-nav-menu{
                &[data-direction="horizontal"]{
                    width:auto;
                }
            }
        }
    }
    .header-layer{
        .menu-simple-container{
            .menu{
                margin-top:0;
            }
        }
    }
    &.on-scroll{
        .menu-active{
            max-width: 100vw;
        }
    }
}
/**
 * menu-placeholder action basic style
 * like on click something change.
 * template part: header-custom.php
 * action:header_menu_placeholder
 */
.menu-placeholder{
    & > [id]:not(input){
        box-sizing:content-box;
        display:inline-block;
        padding:.74rem;
    }
}
/**
 * on scroll
 * ========================================================================== */
.on-scroll[class]{
    .primary-menu-wrapper{
        .menu-placeholder{
            [for="toc-toggle"]{
                box-sizing:content-box;
                padding-top:.74rem;
                padding-bottom:.74rem;
            }
        }
        nav{
            & > ul{
                li{
                    box-sizing:content-box;
                    // padding-top:.92rem;
                    // padding-bottom:.92rem;
                }
            }
        }
    }
    &.logged-in{
        .menu-active{
            margin-top:32px;

        }
        &.on-scroll{
            @media screen and ( max-width : 600px ) {
                .menu-active{
                    margin-top:0;

                }

            }
        }
        &.customize-partial-edit-shortcuts-shown{
            .header-layer-site-title-navigation{
                top: 0;
            }
            .template-part-header{
                .header-layer-site-title-navigation{
                    top:0;
                }
            }
        }

        .template-part-header{
            .header-layer-site-title-navigation{
                top: 32px;
            }
        }
    }
    &.customize-partial-edit-shortcuts-hidden.logged-in,
    &.customize-partial-edit-shortcuts-shown.logged-in{
        .menu-active{
            margin-top:0;
        }
    }
    .menu-active{
        position: fixed;
        top: 0;
        right:0;
        left:0;
        z-index: 1000;
        margin-top:0;
        margin-bottom:0;
        .primary{
            margin-top:0;
            margin-bottom:0;
            & > li{
                border-bottom:none;
            }
        }
    }
    .template-part-header{
        .header-layer-site-title-navigation{
            position: fixed;
            top: 0;
            z-index: 10;
            width:100vw;
        }
    }
}
/**
 * Default header and menu. Simple header and menu.
 * ========================================================================== */
header{
    &.template-part-header-custom ~ .primary-menu-wrapper{
        nav[class|="menu"]{
            ul[data-direction="horizontal"]{
                justify-content: center;
            }
        }
    }
    &.template-part-header{
        // simple header
        &.header-layer-nav-menu{
            nav[class|="menu"]{
                width:auto;
            }
        }
        ul[data-direction="horizontal"]{
            justify-content: flex-end;
        }
        nav[class|="menu"]{
            background:transparent;

            .wp-nav-menu.primary{
                &[data-type="accordion"]{
                    & > li{
                        .sub-menu,
                        .children{
                            // margin-top:.9rem;
                        }
                    }
                }
            }
        }
    }
}
/**
 * Primary menu.
 * ========================================================================== */
nav[class|="menu"]{
    max-width:100%;
    padding-right:0;
    padding-left:0;
    // @extend %block_main_wide;
    @include font_size(5, no-margin);
    // font-size:var(--thm_meta_data_font_size, 13px);
    // font-family:var(--thm_meta_data_font_family);
    // text-transform:var(--thm_meta_data_font_transform);

    margin:0 auto 0;
    .children:focus-within,
        .sub-menu:focus-within,
        &:not(.has-chckbox-control) .wp-nav-menu li.menu-item-has-children a:focus ~ .sub-menu,
        &:not(.has-chckbox-control) .wp-nav-menu li.menu-item-has-children a:focus ~ .children,
        &:not(.has-chckbox-control) .wp-nav-menu li.menu-item-has-children:hover > .sub-menu,
        &:not(.has-chckbox-control) .wp-nav-menu li.menu-item-has-children:hover > .children{
        display:block; //EDGE
        height:auto;
        clip:auto;
        clip-path: none;
    }
    // input type checkbox element Added from jQuery
    &.has-chckbox-control{
        .wp-nav-menu{
            margin-top:0;
            margin-bottom:0;
            li{
                box-sizing:content-box;

                list-style:none;
                // for click control
                .nav-menu-child-opener:checked ~ .children .menu-item-has-children,
                    .nav-menu-child-opener:checked ~ .children,
                    .nav-menu-child-opener:checked ~ .sub-menu{
                    display:block; //EDGE
                    height:auto;
                    clip:auto;
                    clip-path: none;
                    visibility:visible;
                }
            }
            &[data-direction="vertical"]{
                .nav-menu-child-opener:checked ~ .children  .menu-item-has-children .nav-menu-child-opener-label:before,
                    .nav-menu-child-opener:checked ~ .sub-menu  .menu-item-has-children .nav-menu-child-opener-label:before{
                    transform: rotate(0deg);
                }
            }
        }
    }
    ul.wp-nav-menu{
        max-width:100%;
        padding-right:0;
        //@extend %block_main_wide;
        padding-left:0;
        margin-top:0;
        margin-bottom:0;
        & > li{
            box-sizing:content-box;
            margin:0 var(--thm_box_gap, 3px) 0;
            // padding-top:15px;
            // padding-bottom:14px;
            list-style:none;
            &:not(.menu-item-has-children) a{
                display:inline-block;
            }
            & > a{
                display:inline-block;
                padding:.88rem 0 .88rem .88rem;
            }
        }
        li ul{
            @include clip;
            display:none;
            width:100%;
            text-align:left;//EDGE
        }
        &[data-direction="horizontal"]{
            display:flex;
            flex-wrap:wrap;
            width:calc(100vw - 100px);
            padding-right:0;
            & > li{
                z-index:7;
                box-sizing:border-box;
                display:inline-block;
                flex:0 1 auto;
                width:auto;
                padding-right:1rem;
                padding-left:1rem;
                text-align:center;
            }
            li{
                position:relative;
                list-style:none;
                .sub-menu,
                .children{
                    position:absolute;
                    left:0;
                    z-index:9999;
                    box-sizing:border-box;
                    width:auto;
                    width:var(--thm_sidebar_width, 400px);
                    min-width:100%;
                    max-width:var(--thm_sidebar_width, 400px);
                    padding-right:0;
                    //  margin-top:.88rem;
                    padding-left:0;
                    margin:0;
                    margin-bottom:0;
                    overflow:visible;
                    li{

                        margin-top:0;
                        margin-bottom:0;
                        &.show-left{
                            &.menu-item-has-children a:focus ~ .sub-menu,
                                &.menu-item-has-children a:focus ~ .sub-menu,
                                &.menu-item-has-children:hover > .sub-menu,
                                &.menu-item-has-children:hover > .children{
                                left:-100%;
                            }
                        }
                        & > a{
                            display:inline-block;
                            padding:.88rem;
                        }
                    }
                    .sub-menu,
                    .children{
                        top:0;
                        left:100%;
                        z-index:9999;
                        padding-right:0;
                        padding-left:.0;
                        li{

                            margin-top:0;
                            margin-bottom:0;
                            &.show-left{
                                &.menu-item-has-children a:focus ~ .sub-menu,
                                    &.menu-item-has-children a:focus ~ .sub-menu,
                                    &.menu-item-has-children:hover > .sub-menu,
                                    &.menu-item-has-children:hover > .children{
                                    left:-100%;
                                }
                            }
                            & > a{
                                display:inline-block;
                                padding:.88rem;
                            }
                        }
                        .sub-menu,
                        .children{
                            left:100%;
                            z-index:9999;
                            width:100%;
                            li{

                                margin-top:0;
                                margin-bottom:0;
                                &.show-left{
                                    &.menu-item-has-children a:focus ~ .sub-menu,
                                        &.menu-item-has-children a:focus ~ .sub-menu,
                                        &.menu-item-has-children:hover > .sub-menu,
                                        &.menu-item-has-children:hover > .children{
                                        left:-100%;
                                    }
                                }
                                & > a{
                                    display:inline-block;
                                    padding:.88rem;
                                }
                            }
                        }

                    }
                }
                &.menu-item-has-children{
                    padding-right:0;
                }
            }
        }
        &.top-right[data-direction="horizontal"]{
            & > li{
                & > .sub-menu,
                & > .children{

                    left: 0;
                }
            }
            .sub-menu,
            .children{
                .sub-menu,
                .children{
                    left: -100%;
                    width:100%;
                }
            }
        }
        &[data-direction="vertical"]{
            &.primary{
                padding-right: var(--thm_content_gap, 24px);
                padding-left: var(--thm_content_gap, 24px);
            }
            li{
                position:relative;
                display:list-item;
                width:100%;
                list-style:none;
                & > .sub-menu,
                & > .children{
                    position:relative;
                    left:0;
                    z-index:9999;
                    box-sizing:border-box;
                    width:auto;
                    width:var(--thm_sidebar_width, 400px);
                    min-width:100%;
                    max-width:100%;
                    padding-right:.5rem;
                    padding-left:.5rem;
                    margin:1rem 0 0;
                    margin-bottom:0;
                    overflow:visible;
                    li{
                        box-sizing:border-box;
                        padding:.5rem;
                    }
                    .menu-item-has-children{
                        font-weight:700;
                        .menu-item-has-children{
                            border:none;
                        }
                        .sub-menu,
                        .children{
                            font-weight:normal;
                        }
                    }
                    .sub-menu,
                    .children{
                        position:relative;
                        padding-right:0;
                        padding-left:.0;
                        .sub-menu,
                        .children{
                            left:0;
                            width:100%;
                            margin-right:0;
                            margin-left:0;
                        }
                    }
                }
            }
        }
    }
}
/**
 * Attribute data-type accordion
 * Arrange so that sub-menu and children fit within the width of level0. in PC view
 * If accordion is not specified for data-type, sub-menu children are displayed outside level0. in PC view
 * ========================================================================== */
.emulsion:not(.noscript){
    nav[class|="menu"]{
        &.has-chckbox-control{
            .wp-nav-menu{
                &[data-type="accordion"]{
                    & > li{
                        .sub-menu,
                        .children{
                            position:absolute;
                            //margin-top:.88rem;
                            .sub-menu,
                            .children{
                                position:static;
                                left:0;
                                padding-bottom:0;
                                li{
                                    padding-right:0;
                                    &:first-child{
                                        //padding-top:0;
                                    }
                                    &:last-child{
                                        border-bottom:none;
                                        // padding-bottom:0;
                                    }
                                }
                                .sub-menu,
                                .children{
                                    left:0;
                                }
                            }
                        }
                    }
                    &[data-direction="vertical"]{
                        & > li{
                            .sub-menu,
                            .children{
                                position:relative;/// 変更点
                                max-width:100%;
                            }
                        }
                    }
                }
            }
        }
    }
}
.emulsion:not(.noscript){
    .template-part-header{
        nav[class|="menu"]{
            &.has-chckbox-control{
                .wp-nav-menu{
                    &[data-type="accordion"]{
                        & > li{
                            .sub-menu,
                            .children{
                                .sub-menu,
                                .children{
                                    li{
                                        &:first-child{
                                            padding-top:0.88rem;
                                        }
                                        &:last-child{
                                            padding-bottom:0;
                                            border-bottom:none;
                                        }
                                    }
                                    left:0;
                                    .sub-menu,
                                    .children{
                                        left:0;
                                    }
                                }

                            }
                        }
                    }
                }
            }
        }
    }
}
/**
 * Javascript disable. primary menu
 * ========================================================================== */
.noscript{
    nav[class|="menu"]{
        ul.wp-nav-menu{
            /**
             * When list hover, Sub menu show
             */
            &[data-direction="horizontal"]{
                li{
                    & > a{
                        display:inline-block;
                        padding:.88rem 0 .88rem .88rem;
                    }
                    .sub-menu,
                    .children{
                        margin-top:0;
                        visibility:hidden;
                        & > a{
                            display:inline-block;
                            padding:.88rem 0 .88rem .88rem;
                        }
                        .sub-menu,
                        .children{
                            margin-right:0;
                            margin-left:0;
                            & > a{
                                display:inline-block;
                                padding:.88rem 0 .88rem .88rem;
                            }

                        }

                    }
                    &.menu-item-has-children:hover > .sub-menu,
                        &.menu-item-has-children:hover > .children{
                        display:block; //EDGE
                        height:auto;
                        clip:auto;
                        clip-path: none;
                        visibility:visible;

                    }
                    &.show-left{
                        &.menu-item-has-children:hover > .sub-menu,
                            &.menu-item-has-children:hover > .children{
                            left:-100%;
                        }
                    }
                }

                li:focus,
                    li:focus-within{
                    .sub-menu,
                    .children{
                        display: block;
                        margin-top:0;
                        visibility:visible;
                        opacity: 1;
                        .sub-menu:focus,
                            .children:focus{
                            display: block;
                            margin-right:0;
                            margin-left:0;
                            visibility:visible;
                            opacity: 1;
                        }
                    }
                }
            }
        }
    }
    .template-part-header{
        .header-layer-nav-menu{
            .wp-nav-menu.primary{
                & > li{
                    position:relative;
                    &.menu-item-has-children{
                        .sub-menu,
                        .children{
                            position:absolute;
                            left:0;
                            width:auto;

                        }
                    }
                }
                .menu-item-has-children{
                    position:relative;
                    .sub-menu,
                    .children{
                        position:absolute;
                        left:-100%;
                        width:auto;
                        a{
                            box-sizing:border-box;
                            display:block;
                            width:100%;
                        }
                        .sub-menu,
                        .children{
                            a{
                                display:block;
                                width:100%;
                            }
                            left:-100%;
                            .sub-menu,
                            .children{
                                a{
                                    display:block;
                                    width:100%;
                                }
                                left:-100%;
                            }
                        }
                    }
                }
            }
        }
    }
}
/**
 * Widget Navigation Menu
 * ========================================================================== */
.header-layer-nav-menu{
    position:absolute;
    z-index:6;
    display:inline-block;
    width:60vw;
    text-align:right;
    ul.wp-nav-menu{
        &.top-right[data-direction="vertical"]{
            width:var(--thm_content_min_width, 296px);
            width:calc(100vw - 72px);
            margin-right:0;
        }
        &.top-right[data-direction="horizontal"]{
            margin-right:0;
        }
    }
}
/**
 * Table of contents
 * ========================================================================== */
.toc,
body:not(.on-scroll) input[type="checkbox"][data-skin="inset"][id="toc-toggle"] ~ .toc,
body:not(.on-scroll) input[type="checkbox"][data-skin="inset"][id="toc-toggle"] + label span,
body:not(.on-scroll) input[type="checkbox"][data-skin="inset"][id="toc-toggle"] + label,
body:not(.on-scroll) .toc{
    display:none;
}
body.on-scroll input[type="checkbox"][data-skin="inset"][id="toc-toggle"] + label span,
body.on-scroll input[type="checkbox"][data-skin="inset"][id="toc-toggle"] + label{
    display:inline-block;
}
body.on-scroll  input[type="checkbox"][data-skin="inset"][id="toc-toggle"]:checked ~ .toc {
    position:absolute;
    right:0;
    z-index:2;
    display:inline-block;
    width: var(--thm_sidebar_width);
    text-align:left;
}
.on-scroll .toc {
    top:52px;
}
.toc a:empty:before{
    content:var(--thm_i18n_no_title, 'No Title');
}
span[id|="toc"]{
    width:1px;
}
.toc .toc-h2 {
    margin-left: 10px
}
.toc .toc-h3 {
    margin-left: 20px
}
.toc .toc-h4 {
    margin-left: 30px
}
input[type="checkbox"][data-skin] + label{
    display:block;
    padding-right:0;
    padding-left:0;
    margin:0 var(--thm_content_gap, 24px);
    clear:both;
    vertical-align:middle;
}
input[type="checkbox"][data-skin] {
    display:none;
}
input#primary-menu-controll{
    position:absolute;
    top:-100px;
    left:-50px;
    display:block;
    // don't change relate tab control
    visibility:visible;
}
.menu-short-container:focus-within{
    visibility:visible;
}
input[type="checkbox"][data-skin="inset"] + label span{
    position:relative;
    top: 0;
    display:inline-block;
    width: 24px;
    height: 24px;
    margin:0 0 0 0;
    vertical-align: middle;
    cursor: pointer;
    border:2px solid;
    border-radius: calc(12px + 4px);
    //background:rgba(188, 188, 188, .5);
}
input[type="checkbox"][data-skin="inset"] + label{
    display:inline-block;
}
input[type="checkbox"][data-skin="inset"] + label span:after {
    position: absolute;
    top: 6px;
    left: 5px;
    width: 9px;
    height: 5px;
    content: '';
    background: transparent;
    // -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    border: 3px solid var(--thm_black_color);
    border-top: none;
    border-right: none;
    opacity: 0;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
input[type="checkbox"][data-skin="inset"]:checked + label span{
    background:#16a085;
    &:after{
        border: 3px solid var(--thm_white_color, #ffffff);
        border-top: none;
        border-right: none;
    }
}
input[type="checkbox"][data-skin="inset"]:checked + label span:hover:after {
    opacity: 0.3;
}
input[type="checkbox"][data-skin="inset"]:checked + label span:after {
    opacity: 1;
}

//body{
body .template-part-header-custom{
    & + .primary-menu-wrapper{

        &.menu-is-light,
        &.menu-is-dark{
            color:var(--thm_primary_menu_color);
            background:var(--thm_primary_menu_background);
            a{
                color:var(--thm_primary_menu_link_color);
                &:hover{
                    color:var(--thm_primary_menu_color);
                }
            }
        }
    }
}
//}
.menu-is-dark,
.menu-is-light{
    .menu-main-container{
        color:var(--thm_primary_menu_color);
        background:var(--thm_primary_menu_background);
        a{
            color:var(--thm_primary_menu_link_color);
        }
    }
}
body.on-scroll{
    .primary-menu-wrapper,
    .header-layer-site-title-navigation{
        filter: var(--thm_filter_shadow, drop-shadow(3px 3px 3px rgba(0,0,0,0.3)));
    }
}
.elementor_library-template-default.on-scroll.logged-in .primary-menu-wrapper{
    margin-top:0;
}
body .primary-menu-wrapper{
    .icon {
        display: inline;
    }
}
.emulsion-has-sidebar{
    .primary-menu-wrapper{
        position:relative;
        display:flex;
        flex-direction: row;
        margin-right:auto;
        margin-left:auto;
        nav[class|="menu"]{
            position:relative;
            box-sizing: border-box;
            flex:1 1 auto;
            flex-wrap:wrap;
            order:1;
            width: var(--thm_content_width, 720px);
        }
        &.menu-inactive{
            display:none;
            .menu-placeholder{
                display:none;
            }
        }
        .menu-placeholder:empty{
            display:none;
        }
        .menu-placeholder{
            position:relative;
            z-index:1;
            flex:0 0;
            flex-basis:var( --thm_sidebar_width, 400px );
            width:var( --thm_sidebar_width, 400px );
            max-width:100%;
            text-align:right;
        }
        &.side-right{
            .menu-placeholder{
                order:2;
            }
        }
        &.side-left{
            .menu-placeholder{
                order:0;
            }
        }
    }
    .header-layer{
        .menu-simple-container{
            .menu{
                margin-top:0;
            }
        }
    }
}
.emulsion-has-sidebar{
    .menu-inactive{
        &.primary-menu-wrapper{
            display:none;
        }
    }
    &.on-scroll{
        overflow:visible;
    }
}

input[type="checkbox"][data-skin] + label[for="primary-menu-controll"],
.header-layer-nav-menu input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
    position:relative;
    top:3rem;
    left:calc(100% - 2rem);
    display:block;
    margin:0 1em 45px;
    clear:both;
    vertical-align:middle;
}

.emulsion-no-sidebar input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
    left:100%;
}
.emulsion-no-sidebar .header-layer-nav-menu input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
    // left:calc(100% - var(--thm_content_gap, 24px) * 2);
}
.header-layer-nav-menu input[type="checkbox"][data-skin] {
    display:none;
}
input[type="checkbox"][id="toc-toggle"]{
    display:none;
    visibility:hidden;
}

input[type="checkbox"][data-skin="hamburger"] + label[for="primary-menu-controll"] span{
    position: absolute;
    display:inline-block;
    width: 35px;
    height: 5px;
    margin:-30px 45px 0 0;
    vertical-align: middle;
    cursor:pointer;
    content: '';
    background:var(--thm_gray_color);
    border-radius: 1px;
}
.primary-menu-wrapper input[type="checkbox"][data-skin="hamburger"] + label[for="primary-menu-controll"] span,
header .header-layer-nav-menu input[type="checkbox"][data-skin="hamburger"] + label[for="primary-menu-controll"] span,
.primary-menu-wrapper input[type="checkbox"][data-skin="hamburger"] + label[for="primary-menu-controll"] span:before,
primary-menu-wrapper input[type="checkbox"][data-skin="hamburger"] + label[for="primary-menu-controll"] span:after{
    position: absolute;
    display: block;
    width: 35px;
    height: 6px;
    cursor: pointer;
    content: '';
    background:var(--thm_gray_color);
    border-radius: 1px;
}
.template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"],
html[style^="overflow"] .template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{

    @media screen and ( min-width : 780px ) {
        display:none;
    }
}
.template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"],
html[style^="overflow"] .template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{

    @media screen and ( min-width : 780px ) {
        display:none;
    }
}
@media screen and ( max-width : $main_width ) {
    .emulsion-has-sidebar{
        .primary-menu-wrapper{
            &.side-left{
                .menu-placeholder{
                    position:relative;
                    z-index:1;
                    flex:1 0;
                    flex-basis:auto;
                    width:auto;
                    min-width:0;
                    padding-right:var(--thm_content_gap, 24px);
                    text-align:right;
                }
            }
            &.side-right{
                .menu-placeholder{
                    position:relative;
                    z-index:1;
                    flex:1 1 auto;
                    width:auto;
                    min-width:96px;
                }
            }
        }
    }
    body.on-scroll{
        .primary-menu-wrapper{
            &.side-right{
                input[type="checkbox"][data-skin="inset"][id="toc-toggle"]:checked ~ .toc{
                    right:0;
                }
            }
            &.side-left{
                input[type="checkbox"][data-skin="inset"][id="toc-toggle"]:checked ~ .toc{
                    right:auto;
                    left:0;
                }
            }
        }
    }
}
@media screen and ( max-width : $content_width + $content_gap * 2 + 16px) {
    body{
        .template-part-header{
            &.header-image-active{
                height:auto;
                max-height:none;
                & + div{
                    padding-top:0;
                }
                .entry-text{
                    height:auto;
                    padding-bottom:1.5rem;
                    margin-bottom:0;
                    overflow:visible;
                    div{
                        height:auto;
                        overflow:visible;
                    }
                }
            }
        }
    }
    .header-layer-nav-menu input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
        display:block;
        visibility:visible;
    }
    .header-layer-nav-menu input[type="checkbox"][data-skin="hamburger"] ~ nav{
        display:none;
        visibility:hidden;
        .menu{
            &.wp-nav-menu[data-direction="vertical"],
            &.wp-nav-menu[data-direction="horizontal"] {
                display:none!important;
            }
        }
    }
    .header-layer-nav-menu input[type="checkbox"][data-skin="hamburger"]:checked ~ nav{
        position:absolute;
        top:1.5rem;
        //  right:48px;
        z-index:10;
        display:block;
        visibility:visible;

        .menu{
            width:100%;
            &.wp-nav-menu[data-direction="vertical"],
            &.wp-nav-menu[data-direction="horizontal"] {
                display:block!important;
            }
            li{
                display:block;
            }
            .nav-menu-child-opener-label:before{
                background-size:contain;
            }
            .nav-menu-child-opener[type="checkbox"]:checked ~ label:before {
                background-size:contain;
            }
        }
    }
    .on-scroll .template-part-header-custom ~ .primary-menu-wrapper{
        filter: var(--thm_filter_shadow, drop-shadow(3px 3px 3px rgba(0,0,0,0.3)));
        transition: filter 0.5s ease-in-out;
        transition-delay: 0s;
        transition-timing-function: ease-in-out;
        transition-duration: 0.5s;
        transition-property: filter;
    }
    .template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
        display:block;
        visibility:visible;
    }
    .template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin="hamburger"] ~ nav{
        display:none;
        visibility:hidden;
    }
    //////////////////////
    header.template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin] + label[for="primary-menu-controll"]{
        position:relative;
        top:3.2rem;
        left:0;
        display:block;
        width:45px;
        margin:0 1em 45px;
        clear:both;
        vertical-align:middle;
    }
    ///////////////////////
    header.template-part-header-custom ~ .primary-menu-wrapper input[type="checkbox"][data-skin="hamburger"]:checked ~ nav{
        position:absolute;
        top:auto;
        left:72px;
        z-index:10;
        display:block;
        width:calc(100vw - 72px - 1rem);
        visibility:visible;


        ul{
            li{
                &.menu-item{
                    .nav-menu-child-opener-label:before{
                        background-size:contain;
                    }
                    .nav-menu-child-opener[type="checkbox"]:checked ~ label:before {
                        background-size:contain;
                    }
                }
            }
        }
    }
    body.on-scroll .primary-menu-wrapper{
        .menu-placeholder{
            padding-top:0;
            //margin-left:48px;
            text-align:right;
        }
        input[type="checkbox"][data-skin="inset"][id="toc-toggle"]:checked ~ .toc {
            right:0;
            left:auto;
            width: 50vw;
        }
    }
    //effect.scss
    body.emulsion-has-sidebar .page-wrapper {
        width: var(--thm_content_width, 100%);
        min-width:100%;
    }
    article footer{
        max-width:100%;
    }
}