/**

 * SCSS @extend
    * Font
        * @extend %post_meta_font;
    * SPACING
        * @extend %centered_spacing;
        * @extend %content_spacing;
        * @extend %wide_spacing;
        * @extend %structure_spacing;
    * WIDTH
        * @extend %block;
        * @extend %block_wide;
        * @extend %alignleft;
        * @extend %alignright;
        * @extend %aligncenter;
        * @extend %alignwide;
        * @extend %has-sidebar-alignfull;
        * @extend %no-sidebar-alignfull;
    * TEXYT-ALIGN
        * @extend %center-short-sentences;
    * FLEX
        * @extend %flex-container;
 * RULE SET
    * Elements
       h3:Version 12.9.0 theme json render improperly
       h4:Version 12.9.0 theme json render improperly
    * Classes
         * Minimal kindness for posts written in old editors
         * Shortcoce Gallery
         * header
         * footer
         * Relate posts
         * VARIATION
         * name: core/gallery
         * name: core/columns
         * name: core/table
         * name: core/media-text
         * name: core/pullquote
         * name: core/quote
         * name: core/separator
         * name: core/cover
         * name: core/embed
         * name: core/image
         * name: core/post-featured-image
         * name: core/post-excerpt
         * name: core/table
         * name: core/navigation
         * name: core/post-content
         * name: core/post-navigation-link
         * name: core/query-pagination
         * name: core/query-title
         * name: core/query
         * name: core/cover
         * name: core/template-part
         * name: core/term-description
         * name: core/buttons
         * name: core/post-comments-form
         * Theme align
         * name: core/media-text
 */

/**
    * Font
        * @extend %post_meta_font;
 */

%post_meta_font{
    font-family:var(--wp--preset--font-family--system-font);
    font-size:var( --wp--preset--font-size--normal );
}
/**
 * CSS @extend
    * SPACING
 */
/**
 * Center content
        * @extend %centered_spacing;
 */

%centered_spacing{
    -webkit-box-sizing:border-box;
    // height:100%;
    box-sizing:border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction:column;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-pack: center;
}
/**
 * Content Margin Padding
 * eg h* ul ol table
         * @extend %content_spacing;
 */
%content_spacing{
    box-sizing:border-box;
    padding-right:var( --wp--custom--padding--content, 0.75rem );
    padding-left:var( --wp--custom--padding--content, 0.75rem );
    margin:1.5rem auto;
}
/**
 * Wide Margin Padding
 * eg h* ul ol table
        * @extend %wide_spacing;
 */
%wide_spacing{
    box-sizing:border-box;
    padding-right:0;
    padding-left:0;
    margin:1.5rem auto;
}

/**
 * Layout Block Margin Padding
 * A wrapper block containing content (eg p h* ul ol table)
        * @extend %structure_spacing;
 *
 */

%structure_spacing{
    box-sizing:border-box;
    padding:0;
    margin:0 auto;
    overflow:hidden;
}

/**
    * WIDTH
 */
/**
 * Block content default width
        * @extend %block;
 */

%block {
    width: var(--wp--custom--width--content, 720px );
    max-width:100%;
}

/**
 * Wide Block Elements
        * @extend %block_wide;
 */

%block_wide {
    width:var(--wp--custom--width--wide, 920px);
    max-width:100%;
}

/**
 * alignleft
        * @extend %alignleft;
 */

%alignleft {
    box-sizing:border-box;
    float:left;
    width:var(--wp--custom--width--alignleft);
    max-width:var(--wp--custom--width--alignleft);
    padding:0;
    margin-right:1rem;
    margin-left:var(--wp--custom--padding--content, 0.75rem);
    clear:left;
    &.wp-block-embed{
        width:var(--wp--custom--width--alignleft);
    }
    & > figure{
        margin-top:0;
        margin-bottom:0;
    }
    .alignleft,
    .alignright{
        float:none;
        width:100%;
        max-width:100%;
        margin-right:0;
        margin-left:0;
    }
    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        padding:0 var(--wp--custom--padding--content, 0.75rem);
        margin-right:0;
        margin-left:0;

    }
}

/**
 * alignright
        * @extend %alignright;
 */

%alignright {
    box-sizing:border-box;
    float:right;
    width:var(--wp--custom--width--alignright);
    max-width:var(--wp--custom--width--alignright);
    padding:0;
    margin-right:var(--wp--custom--padding--content, 0.75rem);
    margin-left:1rem;
    clear:right;
    &.wp-block-embed{
        width:var(--wp--custom--width--alignright);
    }
    & > figure{
        margin-top:0;
        margin-bottom:0;
    }
    &.wp-block-media-text{
        p{
            max-width:100%;
        }
    }
    .alignleft,
    .alignright{
        float:none;
        width:100%;
        max-width:100%;
        margin-right:0;
        margin-left:0;
    }
    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        padding:0 var(--wp--custom--padding--content, 0.75rem);
        margin-right:0;
        margin-left:0;
    }
}

/**
 * aligncenter
        * @extend %aligncenter;
 */

%aligncenter {
    box-sizing:border-box;
    float:none;
    width:var(--wp--custom--width--aligncenter);
    max-width:100%;
    clear:both;

    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        margin-right:0;
        margin-left:0;
    }
}

/**
 * alignwide
        * @extend %alignwide;
 */

%alignwide{
    position: relative;
    width:var(--wp--custom--width--wide, 920px);
    max-width:100%;
}

/**
 * has sidebar alignfull
        * @extend %has-sidebar-alignfull;
 */

%has-sidebar-alignfull{
    position:relative;
    width:100%;
    max-width:100%;
}

/**
 * no sidebar alignfull
        * @extend %no-sidebar-alignfull;
 */

%no-sidebar-alignfull{
    position:relative;
    width:100%;
    max-width:100%;
    overflow:hidden;

    @media screen and ( min-width : 1280px ) {
        // Limit width
        width:var(--wp--custom--width--limit, 1600px);
        max-width:100%;
        margin-right:auto;
        margin-left:auto;
    }
}

/**
    * TEXYT-ALIGN
 */

/**
 * Block content is displayed in the center, and if the number of characters exceeds one line, it is displayed as a left-aligned tile.
        * @extend %center-short-sentences;
 */

%center-short-sentences{
    width:-moz-fit-content;
    width:fit-content;
    margin-right:auto;
    margin-left:auto;
    text-align:left;
}
/**
    * FLEX
 */
/**
 * Content wrapper to be placed horizontally
        * @extend %flex-container;
 */

%flex-container{
    display:flex;
    flex-wrap:wrap;
    &.wp-block-columns,
    .columns-default{
        flex-wrap:nowrap;
    }
    gap:var(--wp--custom--margin--gap, 3px);
    //
    --wp--style--block-gap:var(--wp--custom--margin--gap, 3px);

}

/**
 * RULE SET
 */

/**
    * Elements
 * HTML element styles can basically be described in theme.json,
 * but it is necessary to describe the element style due to a conflict with
 * the theme style or the core function is not implemented.
 * This element is ideally a style that becomes zero as the gutenberg project progresses.
 */

a{
    text-decoration: underline solid 1px;
    text-underline-offset:3px;
    background:transparent;
}
a:focus,
a:hover{
    color:var(--wp--custom--color--link-hover);
    text-decoration: none;
}

[rel="home"],
[rel="prev"],
[rel="home"],
header a,
footer a,
nav a{
    text-decoration: none;
}
body{
    box-sizing:border-box;
    padding:0;
    margin:0;
    overflow-x:hidden;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    line-height:var(--wp--custom--line-height--common);
    color:var(--wp--preset--color--black);
    //  word-break:break-word;
    overflow-wrap:break-word;
    // background:var(--wp--preset--color--white);
}

/**
 * fonts
 */

h3{
    /*
       h3:Version 12.9.0 theme json render improperly
     * font-size: clamp(var(-wp--preset--font-size--normal), calc( 100vw / 72 * 1.5), var(--wp--preset--font-size--large));	font-
     */
    font-size:var(--wp--preset--font-size--large);
    font-size:clamp(var(-wp--preset--font-size--normal), calc( 100vw / 72 * 1.5), var(--wp--preset--font-size--large));
}
h4{
    /*
       h4:Version 12.9.0 theme json render improperly
     * font-size: clamp(var(-wp--preset--font-size--normal), calc( 100vw / 72 * 1.5), var(--wp--preset--font-size--large));	font-
     */
    font-size:var(-wp--preset--font-size--normal);
}
article > div > div,
.wp-block-query-pagination,
h1,h2,h3,h4,h5,h6,p,ul,ol,blockquote,table,figure,pre, address,dl,form,hr,fieldset,menu{
    box-sizing:border-box;

    /* theme.json width not work p */
    width:var(--wp--custom--width--content, 720px);
    max-width:100%;

    /* theme.json padding not work */
    padding:0 var(--wp--custom--padding--content, .75rem);
    margin-right:auto;

    /* theme.json margin not work */
    margin-left:auto;
    overflow-wrap: break-word;
}

table{
    width:calc( var(--wp--custom--width--content) - var(--wp--custom--padding--content) * 2);
    border-collapse: collapse;
}
label{
    padding:var(--wp--custom--padding--content,75rem);
}
pre,
form,
figure,
hr,
fieldset{
    padding:0;
}
menu,
ul,
ol{
    padding-left:calc(40px + var(--wp--custom--padding--content, .75rem));
    padding-top:.75rem;
}
blockquote,
ul ul,
ul ol,
ol ol,
ol ul{
    padding-left:40px;
}
li{
    padding:.75rem;
}
textarea,
input,
th,
td{
    padding:var(--wp--custom--padding--content,75rem);

}
abbr,
kbd{
    padding:.25rem;
    margin:0 .25rem;
}
hr{
    display:block;
    margin:1.5rem auto;
    clear:both;
}
article{
    position:relative;
}
code{
    padding:var(--wp--custom--padding--content);
    tab-size:2;
    border:var(--wp--custom--border--common);
}
blockquote{
    border-left:var(--wp--custom--border--common);
}
p:empty,
div:empty{
    display:none;
}

/**
    * Classes
 * Includes theme-based core class changes and theme-specific class style definitions.
 */
.emulsion-not-found{
    display:none;
}
.search-no-results{
    .emulsion-not-found{
        display:block;
        height:var(--wp--custom--min-height--harf);
    }
}
.is-fse-light,
.is-fse-bg-default{
    color:var(--wp--preset--color--black);
    a{
        text-decoration-color:var(--wp--custom--border--common);
        color:var(--wp--custom--color--link);
    }
    a:focus,
        a:hover{
        color:var(--wp--custom--color--link-hover);
        text-decoration: none;

    }
    .wp-block-button__link{
        color:var(--wp--custom--color--dark-link);
        &:focus,
            &:hover{
            color:var(--wp--preset--color--white);
            text-decoration: none;
        }
    }
    kbd,
    textarea,
    input,
    th,
    td{

        border:var(--wp--custom--border--common);
    }

    code{
        background:var(--wp--custom--color--code-tag-bg);
    }
    .fse-header,
    .fse-footer{
        background:var(--wp--custom--color--banner-bg);
    }
    .comment-wrapper{
        color:var(--wp--custom--color--comments-text);
        background:var(--wp--custom--color--comments-bg);
        overflow:hidden;

    }
    .wrap-emulsion_relate_posts{
        color:var(--wp--custom--color--relate-posts-text);
        background:var(--wp--custom--color--relate-posts-bg);
        overflow:hidden;
    }

    .is-style-stripes{
        //OW
        border:none;
        tbody tr:nth-child(odd) {
            background-color:var(--wp--custom--color--stripe);
        }
    }

}
.is-fse-dark{
    color:var(--wp--preset--color--white);

    a{
        color:var(--wp--custom--color--dark-link);
        text-decoration-color:var(--wp--custom--border--dark-common);
    }
    a:focus,
        a:hover{
        color:var(--wp--custom--color--dark-link-hover);
        text-decoration: none;
    }
    .wp-block-button__link{
        color:var(--wp--custom--color--dark-link);
        &:focus,
            &:hover{
            color:var(--wp--preset--color--white);
            text-decoration: none;
        }
    }
    kbd,
    textarea,
    input,
    th,
    td{

        border:var(--wp--custom--border--dark-common);
    }
    code{
        background:var(--wp--custom--color--dark-code-tag-bg);
    }
    .fse-header,
    .fse-footer{
        background:var(--wp--custom--color--dark-banner-bg);
    }
    .comment-wrapper{
        color:var(--wp--custom--color--dark-comments-text);
        background:var(--wp--custom--color--dark-comments-bg);
        overflow:hidden;

    }
    .wrap-emulsion_relate_posts{
        color:var(--wp--custom--color--dark-relate-posts-text);
        background:var(--wp--custom--color--dark-relate-posts-bg);
        overflow:hidden;
    }
    .is-style-stripes{
        //OW
        border:none;
        tbody tr:nth-child(odd) {
            background-color:var(--wp--custom--color--dark-stripe);
        }
    }
}
.emulsion{
    /**
     * If the content of the post uses the alignwide, alignfull class, the width of the header and footer will be aligned.
     * .keep-align-wide, .keep-align-wide are defined in body_class
     */
    &.single,
    &.page{
        .wp-block-post-featured-image img{
            width:var(--wp--custom--width--content);
            max-width:100%;
            padding:0 .75rem;
            box-sizing:border-box;
            margin:0 auto;
        }
    }
    &.keep-align-wide{
        .wp-block-post-featured-image img,
        .wp-block-post-navigation,
        .fse-footer p,
        .post-header-content,
        .fse-header-content{
            width:var(--wp--custom--width--wide, 920px);
            max-width:100%;
            overflow:hidden;
        }
    }
    &.keep-align-full{
        .wp-block-post-featured-image img,
        .wp-block-post-navigation,
        .fse-footer p,
        .post-header-content,
        .fse-header-content{
            width:var(--wp--custom--width--full, 1280px);
            max-width:100%;
            overflow:hidden;
        }
    }
    .wrap-emulsion_relate_posts{
        li{
            padding:0;
        }
    }
    figcaption{
        @extend %center-short-sentences;
        font-size:var(--wp--preset--font-size--small,13px);
    }

    .has-background{
        padding:var(--wp--custom--padding--content);
    }

    .wp-site-blocks{
        /*
        OW
        .wp-site-blocks > * + * {
            margin-block-start: var( --wp--style--block-gap );
        }*/

        & > header{
            @extend %structure_spacing;
        }
        & > main{
            @extend %structure_spacing;
        }
        & > footer{
            @extend %structure_spacing;
        }
    }
    .article-wrapper{
        @extend %structure_spacing;
    }

    .taxsonomy{
        // width depend .post-header-content
        width:100%;
        @extend %structure_spacing;
        overflow:initial;
        .taxsonomy{
            padding:0;
        }
    }
    .posted-on{
        // width depend .post-header-content
        width:100%;
        overflow:initial;
        @extend %content_spacing;
        @extend %post_meta_font;
    }
    .post-header-content{
        .wp-block-post-author{
            display:inline-flex;
            width:auto;
            margin-top:5px;
            vertical-align:middle;

            .wp-block-post-author__avatar{
                display:inline-block;
                flex: 0 0 auto;
                width:24px;
                margin:0;
            }
            .wp-block-post-author__content{
                display:inline-block;
                flex: 0 0 auto;
                width:auto;
                padding:0;
                margin:0;
            }
            .wp-block-post-author__name{
                display:inline;
                margin: 0;
            }
        }
    }
    .wp-block-post-date{
        display:inline-flex;
        vertical-align:middle;
    }
    .wp-block-post-comments-link{
        display:inline-block;
        width:auto;
    }
    .wp-block-post-title{
        // width depend .post-header-content
        width:100%;
    }
    .wp-block-post-author__name{
        @extend %post_meta_font;
    }


    .wp-block{

        @extend %content_spacing;

        @extend %block;

        &.aligncenter{
            @extend %aligncenter;
        }
        &.alignleft{
            @extend %alignleft;
        }
        &.alignright{
            @extend %alignright;
        }
        &.alignwide{
            @extend %alignwide;
            @extend %wide_spacing;
        }
        &.alignfull{
            @extend %no-sidebar-alignfull;
            @extend %structure_spacing;
        }
    }
    .wp-block.toc{
        @extend %structure_spacing;
    }
    .wp-block-columns{
        @extend %flex-container;
    }
    .post-header-content{
        @extend %block;
        @extend %structure_spacing;
    }
    .wp-block-post-excerpt{
        @extend %structure_spacing;
    }

    /**
     * Clear Align
     */
    .wp-block-post-content > div:not([class]),
        .wp-block-query-pagination,
        h1,h2,h3,h4,h5,h6,hr{
        float:none;
        clear:both;
    }

    .wp-block-post-template{
        @extend %structure_spacing;
    }
    .post-password-form{
        @extend %structure_spacing;
    }
    /**
         * name: core/gallery
     */
    .wp-block-gallery{
        @extend %flex-container;
        margin:1.5rem auto;
    }
    /**
         * name: core/columns
     */
    .wp-block-column{
        ul,ol{
            padding-left:min(15%, 1.5rem);
            li{
                padding-left:0;
            }
        }
        h1{
            font-size:xx-large;
        }
        h2{
            font-size:x-large;
        }
        h3{
            font-size:large;
        }
        h4{
            font-size:medium;
        }
        h5{
            font-size:small;
        }
        h6{
            font-size:x-small;
        }
    }

    /**
         * name: core/table
     */

    .wp-block-table{
        @extend %content_spacing;

    }
    /**
         * name: core/post-featured-image
     */

    .wp-block-post-featured-image{
        /* OW */
        margin:var(--wp--custom--margin--container);
    }
    .wp-block-post-featured-image{
        @extend %content_spacing;
        text-align:center;
        max-width:fit-content;

        &.alignleft{
            text-align:right;
            padding:0;

        }
        &.alignright{
            text-align:left;
            padding:0;
        }
        &.alignwide{
            padding:0;
        }
        &.alignfull{
            @extend %structure_spacing;
            padding:0;
        }
    }

    /**
         * name: core/post-excerpt
    */

    .wp-block-post-excerpt__excerpt{
        max-height: calc((var(--wp--custom--line-height--common) * var(--wp--preset--font-size--normal)) * 3 );
        overflow: hidden;
    }

    /**
         * name: core/media-text
     */

    .wp-block-media-text{
        &[class*="has-background"]{
            padding:0;
        }
        &:not(.alignleft):not(.alignright){
            padding-right:0;
            padding-left:0;
        }
    }

    /**
         * name: core/pullquote
     */

    .wp-block-pullquote {
        //OW
        //margin: 0 0 1em;
        //text-align: center;

        @extend %content_spacing;
        @extend %center-short-sentences;
        text-align:left;
        &:not(#specificity){
            border-right-width:0 ! important;
            border-left-width:0 ! important;
        }
        blockquote{
            border:none;
        }
    }

    /**
         * name: core/quote
     */

    .wp-block-quote{

        overflow:hidden;
        p{
            padding:0;
        }
    }

    /**
         * name: core/separator
     */

    .wp-block-separator{
        position:relative;
        height:3rem;
        clear:both;
        border:none;
        &:before{
            position:absolute;
            top:0;
            right:0;
            bottom:0;
            left:0;
            width:50%;
            height:2px;
            margin:auto;
            color:inherit;
            content:'';
            background:transparent;
            border-bottom:1px solid;
        }
        &.is-style-dots{
            height:3rem;
            &:before{
                width:fit-content;
                height:3rem;
                margin:1rem auto;
                font-size:3rem;
                color:inherit;
                content:'\2026';
                background:transparent;
                border:none;
            }
        }

        &.is-style-wide{
            background:transparent !important;
            &:before{
                width:100%;
                color:inherit;
                background:transparent;
            }
        }
    }

    /**
         * name: core/cover
     */

    .wp-block-cover__gradient-background,
    .wp-block-cover__background{
        width:100%;
        height:100%;
        margin:0 auto;
    }

    .wp-block-cover-image .wp-block-cover__inner-container,
    .wp-block-cover .wp-block-cover__inner-container {
        /* OW color: #fff; */
        color:initial;
    }

    /**
         * name: core/embed
     */

    .wp-block-embed{
        /**
         * OW
        .wp-block-embed {
            margin: 0 0 1em;
            overflow-wrap: break-word;
        }
        */
        margin:var(--wp--custom--margin--block,1.5rem auto);
    }

    /**
         * name: core/image
     */

    .wp-block-image{
        @extend %content_spacing;
        text-align:center;
        max-width:fit-content;

        &.alignleft{
            text-align:right;
            padding:0;

        }

        &.alignright{
            text-align:left;
            padding:0;
        }
        &.alignwide{
            padding:0;
        }
        &.alignfull{
            @extend %structure_spacing;
            padding:0;
        }
    }

    /**
         * name: core/table
     */

    .wp-block-table{
        overflow-x:auto;
        overflow-y:hidden;
    }

    /**
         * name: core/navigation
     */

    .wp-block-navigation{
        @extend %content_spacing;
        padding:0;
    }
    .wp-block-navigation__responsive-dialog,
    .wp-block-navigation__container,
    .wp-block-navigation__responsive-close{
        width:100%;
        height:100%;
        margin:0 auto;
    }
    .wp-block-navigation.fse-primary{
        margin:.75rem auto;
    }
    .wp-block-navigation__responsive-container{
        @extend %structure_spacing;
    }

    .wp-block-navigation__responsive-container-content{
        @extend %content_spacing;
        margin:0 auto;
    }
    .wp-block-navigation-item a{
        @extend %content_spacing;
        margin:.75rem auto;

    }

    /**
         * name: core/post-content
     */

    .wp-block-post-content{
        overflow:hidden;
    }



    /**
         * name: core/post-navigation-link
     */

    .wp-block-post-navigation{
        @extend %flex-container;
        .wp-block-post-navigation-link{
            flex: 1 1 auto;
            padding:var(--wp--custom--padding--content,75rem);
            text-align:center;
            border:var(--wp--custom--border--common,1px solid #ccc);

        }
    }

    /**
     *
     */

    article.loop-item{
        position:relative;
        &:after{
            content:'';
            margin:0 auto 0;
            width:696px;
            max-width:100%;
            display:block;
            border-top:1px solid #ccc;
            margin:1.5rem auto;

        }
    }

    /**
     *
     */

    .wp-block-query .is-flex-container{
        min-height:var(--wp--custom--max-height--harf);
        .loop-item:after{
            border:none;
            display:none;
        }
        li{
            border-top:1px solid #ccc;
        }
    }

    /**
         * name: core/query-pagination
     */

    .wp-block-query-pagination{
        @extend %flex-container;
        margin:var(--wp--custom--margin--block, 1.5rem auto);
        a{
            flex:1 1 auto;
            padding:var(--wp--custom--padding--content,75rem);
            text-align:center;
            border:var(--wp--custom--border--common,1px solid #ccc);
        }
    }

    /**
         * name: core/query-title
     */

    .wp-block-query-title{
        position:relative;
        visibility:hidden;
        span{
            position:absolute;
            left:var(--wp--custom--padding--content);
            visibility:visible;

        }
    }

    /**
         * name: core/query
     */

    .wp-block-query{
        @extend %structure_spacing;
        padding-top:min(6vw,48px);
        li{
            width:100%;
            /* OW */
            margin:var(--wp--custom--margin--container);
        }
        .wp-block-post-template li{
            @extend %structure_spacing;
            overflow:hidden;
        }
        .is-flex-container li{
            margin:0;
        }
        [class|="wp-container"]{
            li{
                width:100%;
                /* OW */
                margin:var(--wp--custom--margin--container);
            }
        }
    }

    /**
         * name: core/template-part
     */

    .wp-block-template-part{
        @extend %structure_spacing;
    }

    /**
         * name: core/term-description
     */

    .wp-block-term-description{
        @extend %block;
        @extend %structure_spacing;
        p{
            @extend %center-short-sentences;
            @extend %post_meta_font;
            @extend %content_spacing;
        }

    }

    /**
         * name: core/buttons
     */

    .wp-block-buttons{
        @extend %flex-container;
        .wp-block-button:not(.has-custom-width){
            width:-moz-fit-content;
            width:fit-content;
        }
        .wp-block-button{
            padding:0;
            .wp-block-button__link{
                box-sizing:border-box;
                width:100%;
                font-size:1rem;
                padding:.75rem;
                text-align:center;
                border-radius:5px;
                text-decoration: none;
                &:empty{
                    display:none;
                }
            }
            &.wp-block-button__width-25{
                flex-basis:calc( 25% - var(--wp--custom--margin--gap, 3px) * 4);
                width:calc( 25% - var(--wp--custom--margin--gap, 3px) * 4);
            }
            &.wp-block-button__width-50{
                flex-basis:calc(50% - var(--wp--custom--margin--gap, 3px) * 4);
                width:calc(50% - var(--wp--custom--margin--gap, 3px) * 4);
            }
            &.wp-block-button__width-75{
                flex-basis:calc( 75% - var(--wp--custom--margin--gap, 3px) * 4);
                width:calc( 75% - var(--wp--custom--margin--gap, 3px) * 4);
            }
            &.wp-block-button__width-100{
                flex-basis:calc( 100% - var(--wp--custom--margin--gap, 3px) * 4 );
                width:calc( 100% - var(--wp--custom--margin--gap, 3px) * 4 );
            }
        }

        &.is-vertical{
            .wp-block-button{
                &.wp-block-button__width-25{
                    flex-basis:calc( 25% - var(--wp--custom--margin--gap, 3px) * 4);
                    width:calc( 25% - var(--wp--custom--margin--gap, 3px) * 4);
                }
                &.wp-block-button__width-50{
                    flex-basis:calc(50% - var(--wp--custom--margin--gap, 3px) * 4);
                    width:calc(50% - var(--wp--custom--margin--gap, 3px) * 4);
                }
                &.wp-block-button__width-75{
                    flex-basis:calc( 75% - var(--wp--custom--margin--gap, 3px) * 4);
                    width:calc( 75% - var(--wp--custom--margin--gap, 3px) * 4);
                }
                &.wp-block-button__width-100{
                    flex-basis:calc( 100% - var(--wp--custom--margin--gap, 3px) * 4 );
                    width:calc( 100% - var(--wp--custom--margin--gap, 3px) * 4 );
                }
                .wp-block-button__link{
                    min-width:146px;
                }
            }
        }
        &.is-style-has-shadow{
            .wp-block-button{
                .wp-block-button__link{
                    filter: var(--thm_filter_shadow, drop-shadow(3px 3px 3px rgba(0,0,0,0.3)));
                }
                .wp-block-button__link:active{
                    filter:none;
                }
            }
        }
    }
    /**
         * name: core/post-comments-form
     */

    .form-submit [type="submit"]{
        box-sizing:border-box;
        width:auto;
        font-size:1rem;
        padding:.75rem;
        text-align:center;
        border-radius:5px;
        text-decoration: none;
    }

    /*
         * Theme align
     * must last for cascading
     */

    .alignwide{
        @extend %alignwide;
        margin:var(--wp--custom--margin--block);

    }

    .alignfull{
        @extend %has-sidebar-alignfull;
    }

    .alignleft{
        float:left;
        width:var(--wp--custom--width--alignleft);
        margin-right:1rem;
        margin-left: var(--wp--custom--padding--content);
        clear:left;
    }
    .alignright{
        float:right;
        width:var(--wp--custom--width--alignright);
        margin-right: var(--wp--custom--padding--content);
        margin-left:1rem;
        clear:right;
    }
    .aligncenter{
        @extend %aligncenter;
        margin:1.5rem auto .75rem;
        clear:both;
    }


}

/**
         * Minimal kindness for posts written in old editors
 */
.no-blocks{
    article.post{
        @extend %block;
    }
    .entry-content{
        @extend %structure_spacing;
        @extend %block;
    }
    img{
        display:block;
    }

}

/**
         * Shortcoce Gallery
 */

div.gallery{

    @extend %flex-container;
    max-width:100%;

    @for $i from 1 through 10 {
        &.gallery-columns-#{$i}{
            .gallery-item{
                width: calc( 99.9% / #{$i});
                margin:0;
                .gallery-icon{
                    margin:0;
                }
            }
            figcaption{
                width:inherit;
                padding:0;
                margin:0;
            }
            &.gallery-size-thumbnail{
                width:calc( 153px * #{$i});
                margin:auto;
                .gallery-item{
                    width:150px;
                }
                figcaption{
                    width:150px;
                    padding:0;
                    margin:0;
                }
            }
        }
    }
}
/**
         * header
 */

.fse-header-content{
    @extend %block;
}
.emulsion{
    .fse-header{
        @extend %structure_spacing;
        width:100%;
        min-height: var(--wp--custom--min-height--eighth, 12.5vh);
        margin:var(--wp--custom--margin--container, 0 auto);

        .wp-block-cover{
            @extend %structure_spacing;
            .wp-block-site-title{
                font-size:clamp(var(--wp--preset--font-size--extra-large), calc( 100vw / 72 * 3), var(--wp--preset--font-size--huge));
                @extend %content_spacing;
            }
        }

        .wp-block-site-title{
            margin-top:1.5rem;
            margin-bottom:0;
            font-size:var(--wp--preset--font-size--medium, 20px);
        }
        .wp-block-site-tagline{
            margin-top:0;
            margin-bottom:1.5rem;
            font-size:var(--wp--preset--font-size--medium, 20px);
        }
        .wp-block-navigation{
            margin-top:1.5rem;
            margin-bottom:1.5rem;
        }

        .fse-header-content{
            @extend %structure_spacing;
            .wp-block-site-title{
                margin-left:0;
            }
            .wp-block-site-tagline{
                margin-left:0;
            }
        }
    }

    .post-header{
        min-height:var(--wp--custom--min-height--quarter);
    }
}
/**
         * footer
 */
.emulsion{
    .fse-footer{
        @extend %centered_spacing;
        width:100%;
        min-height: var(--wp--custom--min-height--eighth, 12.5vh);
        margin:var(--wp--custom--margin--container, 0 auto);

        .wp-block-site-title,
        .wp-block-site-tagline{
            margin-top:0;
            margin-bottom:0;
            font-size:var(--wp--preset--font-size--medium, 20px);
        }
    }
}
/**
         * Relate posts
 */
.emulsion .wrap-emulsion_relate_posts{
    padding-top:.1rem;
    padding-bottom:.75rem;
    .relate-posts-title{
        padding-right:var(--wp--custom--padding--content);
        padding-left:var(--wp--custom--padding--content);
        margin-right:auto;
        margin-left:auto;
    }
    .relate-posts{
        padding-right:var(--wp--custom--padding--content);
        padding-left:var(--wp--custom--padding--content);
        margin-right:auto;
        margin-left:auto;
        li{
            display:flex;
            height:48px;
            margin-bottom:6px;
            vertical-align:middle;
            list-style:none;
            &:not(#specificity):before{
                display:none;
            }
            img{
                width:auto;
                max-width:48px;
                height:48px;
                padding-right:0;
                padding-left:0;
                margin-right:0;
                margin-left:0;
                vertical-align:middle;
            }
            .relate-post-no-icon + a,
            img + a{
                display:inline-block;
                max-width:calc( 100% - 48px - 2rem );
                height:100%;
                margin-left:1rem;
                overflow: hidden;
                font-weight:700;
                line-height:48px;
                text-overflow: ellipsis;
                white-space: nowrap;
                vertical-align:middle;
            }
            .relate-post-no-icon{
                display:inline-block;
                width:46px;
                height:46px;
                padding:0;
                font-size:24px;
                line-height:46px;
                color:var(--wp--preset--color--white);

                text-align:center;
                text-transform: uppercase;
                vertical-align:middle;
                background:var(--wp--preset--color--black);
                border:var(--wp--custom--border--common);

            }
        }
    }
    &:empty{
        display:none;
    }
}
/**
         * VARIATION
 */
.wp-block-group.emulsion-panel{
    position:relative;
    width:calc(var(--thm_content_width, 720px) - var(--wp--custom--padding--content, 0.75rem) * 2);
    overflow:hidden;
    border:var(--wp--custom--border--common);
    @extend %structure_spacing;

    .emulsion-panel-title{
        width:100%;
        margin:0 auto;
        border-bottom:var(--wp--custom--border--common);
    }
    .emulsion-panel-content{
        @extend %structure_spacing;
    }
}
.emulsion:not(.block-editor-page){
    .dropdown-on-hover{
        position:relative;
        width:calc(var(--thm_content_width, 720px) - var(--wp--custom--padding--content, 0.75rem) * 2);
        padding:0;
        margin:1.5rem auto;
        border:var(--wp--custom--border--common);

        &:focus-within,
            &:active,
            &:focus,
            &:hover{
            position:static;
            .dropdown-on-hover-content{
                position:relative;
                visibility:visible;
                border:var(--wp--custom--border--common);
            }
            .dropdown-on-hover-title{
                margin:0 auto;
                margin-bottom:0;
                border:var(--wp--custom--border--common);
            }
        }
        .dropdown-on-hover-content{
            position:absolute;
            box-sizing:border-box;
            //transition:visibility 1s;
            display:block;
            visibility:hidden;
            border-top:none;
            @extend %structure_spacing;
        }
        .dropdown-on-hover-title{
            position:relative;
            box-sizing:border-box;
            display:block;
            padding:.5em var(--wp--custom--padding--content, 0.75rem);
            margin:0 auto;
            font-weight:700;
            visibility:visible;
            &:hover{
                cursor:pointer;
            }

            &:after{
                display: inline-block;
                width: 13px;
                height: 13px;
                margin: 0 5px;
                margin-left:.5rem;
                vertical-align: middle;
                content: " ";
                background: url(../images/svg/arrow-down.svg);
                filter: none;
                background-repeat: no-repeat;
                background-size: contain;
                background-size: contain;
                transition: all 1s ease-in-out;
            }
        }
    }
}
.emulsion:not(.block-editor-page){
    .dropdown-on-click{
        position:relative;
        width:calc(var(--thm_content_width, 720px) - var(--wp--custom--padding--content, 0.75rem) * 2);
        border:var(--wp--custom--border--common);
        outline:none;
        @extend %structure_spacing;

        &:focus-within,
            &:active,
            &:focus{
            position:static;
            .dropdown-on-click-content{
                position:relative;
                margin:0;
                visibility:visible;
                border:var(--wp--custom--border--common);
            }
            .dropdown-on-click-title{
                margin:0;
                border:var(--wp--custom--border--common);
                border-bottom:none;

            }
        }
        .dropdown-on-click-content{
            position:absolute;
            box-sizing:border-box;
            //transition:visibility 1s;
            display:block;
            visibility:hidden;
            border-top:none;
        }
        .dropdown-on-click-title{
            position:relative;
            box-sizing:border-box;
            display:block;
            margin:0;
            font-weight:700;
            visibility:visible;
            &:hover{
                cursor:pointer;
            }

            &:after{
                display: inline-block;
                width: 13px;
                height: 13px;
                margin: 0 5px;
                margin-left:.5rem;
                vertical-align: middle;
                content: " ";
                background: url(../images/svg/arrow-down.svg);
                filter: none;
                background-repeat: no-repeat;
                background-size: contain;
                background-size: contain;
                transition: all 1s ease-in-out;
            }
        }

    }
}
.emulsion:not(.block-editor-page){
    &:not(.agent-mobile-phone){
        .modal-open-link + .modal,
        [id|="modal-group"].is-opened,
        [id|="modal-group"].modal{
            visibility:hidden;
            .emulsion-modal-title{
                visibility:visible;
            }
            .modal-close-link{
                visibility:hidden;
            }
        }
        .modal-open-link a{
            pointer-events:none;
        }

        .modal-open-link:focus-within + .modal,
            [id|="modal-group"].is-opened,
            [id|="modal-group"]:target.modal{

            position:fixed;
            top:100px;
            right:0;
            bottom:auto;
            left:0;
            z-index:10000;
            max-height:var(--wp--custom--min-height--3-quarters, 75vh);
            overflow-y:auto;
            visibility:visible;
            filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.3));

            &.alignwide{
                position:fixed;
            }
            &.alignfull{
                position:fixed;
            }
            .modal-close-link{
                visibility:visible;
            }
        }
    }
    &.agent-mobile-phone{
        .modal-open-link{
            display:none;
        }
        .wp-block-group.modal{
            position:static;
            overflow:visible;
            visibility:visible;

            .emulsion-modal-title{
                display:none;
            }
        }

    }
    .wp-block-group.modal{
        position:absolute;
        padding:0;
        overflow:hidden;
        color:#333;
        visibility:hidden;

        background:#fff;
        border:1px solid;

        .emulsion-modal-title{
            width:100%;
            padding:.5rem;
            margin:0 auto;
            border:none;
            border-color:transparent;
            .modal-close-link{
                padding-left:24px;
                text-decoration:none;
                &:hover{
                    cursor:pointer;
                }
            }
        }
        .emulsion-modal-content{
            width:100%;
            margin-top:0;
        }
    }
}

.interface-interface-skeleton__content [data-block].is-style-sticky,
.is-style-sticky{
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    align-self: flex-start;
    @media screen and (max-width: 600px) {
        position:static;
    }
}
.on-scroll{
    .is-style-sticky{
        top: 3rem;
    }
}

.is-style-list-style-none{
    list-style:none;
    ul,ol{
        list-style:none;
    }
}

.is-style-list-style-inline{
    //Todo editor style 反映しない
    @extend %flex-container;
    @extend %content_spacing;
    align-items: center;
    justify-content: center;
    li{
        z-index:2;
        display:inline-block;
        flex:1 1 auto;
        width: -moz-fit-content;
        width:fit-content;
        padding:var(--wp--custom--padding--content, 0.75rem);
        text-align:center;
        list-style:none;
        border:var(--wp--custom--border--common);
    }

}
.is-style-shrink{

    //figure.wp-block-image.alignleft is back to div.block-image figure.alignleft, but I still keep this style

    &.alignleft{

        width:calc( var(--wp--custom--width--content, 720px ) / 2 - var(--wp--custom--padding--content, .75rem) - 1rem);
        margin-left: calc((100% - var(--wp--custom--width--content, 720px )) / 2 + var(--wp--custom--padding--content, .75rem));

        &.size-thumbnail{
            width:150px;
            padding:0;
        }
        figure{
            width:100%;
        }
        @media screen and (max-width: 720px) {
            width:auto;
            margin-right:auto;
        }

    }

    &.alignright{

        width:calc( var(--wp--custom--width--content, 720px ) / 2 - var(--wp--custom--padding--content, .75rem)  - 1rem);
        margin-right: calc((100% - var(--wp--custom--width--content, 720px )) / 2 + var(--wp--custom--padding--content, .75rem));

        &.size-thumbnail{
            width:150px;
            padding:0;
        }
        figure{
            width:100%;
        }
        @media screen and (max-width: 720px) {
            width:auto;
            margin-right:auto;
        }

    }
}
.is-style-indent-5rem{
    padding-left:calc(1rem * 5 + var(--wp--custom--padding--content, .75rem) );

    @media screen and ( max-width : 720px ) {
        padding-left:var(--wp--custom--padding--content, .75rem);
    }
}
.is-style-indent-10rem{
    padding-left:calc(1rem * 10 + var(--wp--custom--padding--content, .75rem));

    @media screen and ( max-width : 720px ) {
        padding-left:var(--wp--custom--padding--content, .75rem);
    }
}
.is-style-indent-15rem{
    padding-left:calc(1rem * 15 + var(--wp--custom--padding--content, .75rem));

    @media screen and ( max-width : 720px ) {
        padding-left:var(--wp--custom--padding--content, .75rem);
    }
}
.is-style-indent-20rem{
    padding-left:calc(1rem * 20 + var(--wp--custom--padding--content, .75rem));

    @media screen and ( max-width : 720px ) {
        padding-left:var(--wp--custom--padding--content, .75rem);
    }
}
/**
         * name: core/media-text
 */
.wp-block-media-text{
    display: grid;
    grid-template-areas: "media-text-media media-text-content";
    grid-template-rows: auto;
    grid-template-rows: 2;
    grid-template-columns: 50% 50%;
    align-items: center;

    .wp-block-media-text__media{
        position:relative;
        width:100%;
        height:100%;
        overflow:hidden;
        &[style^="background-image"]{
            img{
                display:block;
                height:100%;
                visibility:hidden;
            }
            & > a{
                display:block;
                height:100%;
            }
        }
        & > a{
            position:absolute;
            top:50%;
            left:50%;
            width:100%;
            transform: translate(-50%, -50%);
        }
        & > img{
            position:absolute;
            top:50%;
            left:50%;
            width:100%;
            transform: translate(-50%, -50%);
        }
        &:before{
            z-index:-1;
            display:block;
            height:0;
            padding-bottom:56.25%;
            content:'';
        }
    }
    &.is-vertically-aligned-top{
        figure:not([style^="background-image"]){
            & > img,
            & > a{
                top: 0;
                left: 50%;
                transform: translate(-50%, 0);
            }
        }

    }
    &.is-vertically-aligned-bottom{
        figure:not([style^="background-image"]){
            & > img,
            & > a{
                top:auto;
                bottom: 0;
                left: 0;
                transform: none;
            }
        }
    }
    .wp-block-media-text__content{
        box-sizing:border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding-right:0;
        padding-left:0;
        overflow:hidden;
        p{
            margin-bottom:0;
        }

        p:last-child{
            margin-bottom: calc(1rem * var(--wp--custom--line-height--common));
        }
        h1,h2,h3,h4{
            width: -moz-fit-content;
            width:fit-content;
        }
        .wp-block-table{
            padding-right:var(--wp--custom--padding--content);
            padding-left:var(--wp--custom--padding--content);
            overflow-x:auto;
            overflow-y:hidden;
        }
    }
    &.has-media-on-the-right {
        grid-template-areas: "media-text-content media-text-media";
        grid-template-columns: 50% 50%;
    }
}
/**
 *
 */
.wp-block-query{
    ul:not(.is-flex-container){
        .has-post-thumbnail{
            .loop-item{
                display:flex;
                width:720px;
                max-width:100%;
                flex-wrap:wrap;
                flex-direction:row-reverse;
                figure,
                header{
                    flex:1 1 50%;

                }
                .wp-block-post-excerpt{
                    display:none;
                }
                &:after{
                    flex-basis:100%;
                    margin:1.5rem auto;
                }
                @media screen and ( max-width : 640px ) {
                    display:block;
                    width:100%;
                    max-width:100%;
                    figure,
                    header{
                        display:block;
                        width:100%;
                        max-width:100%;

                    }

                }
            }

        }
    }
    ul.is-flex-container{
        .has-post-thumbnail{
            .loop-item{
                .wp-block-post-excerpt{
                    display:none;
                }
            }
        }
    }
}
.page,
.single{
    &.is-fse-light,
    &.is-fse-bg-default{
        .wp-block-post-featured-image{
            background:var(--wp--custom--color--featured-image-bg);
        }
    }
    &.is-fse-dark{
        .wp-block-post-featured-image{
            background:var(--wp--custom--color--dark-featured-image-bg);
        }
    }
    .wp-block-post-featured-image{
        width:100%;
        background:var(--wp--custom--color--featured-image-bg);
        max-width:100%;
    }
}