.elementor-1588 .elementor-element.elementor-element-359aa7c2{--display:flex;--min-height:180px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-1588 .elementor-element.elementor-element-359aa7c2:not(.elementor-motion-effects-element-type-background), .elementor-1588 .elementor-element.elementor-element-359aa7c2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFF765;background-image:url("https://hakuei-shoji.jp/wp-content/uploads/2025/06/page-header-scaled.webp");background-position:center left;background-repeat:no-repeat;background-size:cover;}.elementor-1588 .elementor-element.elementor-element-21e1ecdd{--display:flex;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:190px;--padding-right:0px;}.elementor-1588 .elementor-element.elementor-element-21e1ecdd.e-con{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1588 .elementor-element.elementor-element-adfa134 .elementor-heading-title{font-family:"Zen Maru Gothic", Sans-serif;font-size:2.5rem;font-weight:600;color:#F368A1;}.elementor-1588 .elementor-element.elementor-element-57db3723 .elementor-heading-title{font-family:"Noto Sans JP", Sans-serif;font-size:1rem;font-weight:400;color:var( --e-global-color-text );}.elementor-1588 .elementor-element.elementor-element-20f5f2f1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1588 .elementor-element.elementor-element-10e165c7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--border-radius:15px 15px 15px 15px;box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 0.22);--margin-top:-25px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:8px;--padding-bottom:8px;--padding-left:30px;--padding-right:30px;}.elementor-1588 .elementor-element.elementor-element-10e165c7:not(.elementor-motion-effects-element-type-background), .elementor-1588 .elementor-element.elementor-element-10e165c7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-5f287c3 );}.elementor-1588 .elementor-element.elementor-element-6698f7d{width:auto;max-width:auto;}.elementor-1588 .elementor-element.elementor-element-6698f7d > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1588 .elementor-element.elementor-element-6698f7d.elementor-element{--align-self:center;}@media(max-width:1024px){.elementor-1588 .elementor-element.elementor-element-359aa7c2:not(.elementor-motion-effects-element-type-background), .elementor-1588 .elementor-element.elementor-element-359aa7c2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://hakuei-shoji.jp/wp-content/uploads/2025/06/page-header-mobile.webp");background-repeat:no-repeat;background-size:contain;}.elementor-1588 .elementor-element.elementor-element-359aa7c2{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-1588 .elementor-element.elementor-element-359aa7c2:not(.elementor-motion-effects-element-type-background), .elementor-1588 .elementor-element.elementor-element-359aa7c2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://hakuei-shoji.jp/wp-content/uploads/2025/06/page-header-mobile.webp");background-repeat:no-repeat;background-size:360px auto;}.elementor-1588 .elementor-element.elementor-element-359aa7c2{--content-width:100%;--min-height:100px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1588 .elementor-element.elementor-element-21e1ecdd{--width:100%;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:8px 8px;--row-gap:8px;--column-gap:8px;--flex-wrap:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:125px;--padding-right:0px;}.elementor-1588 .elementor-element.elementor-element-adfa134{text-align:left;}.elementor-1588 .elementor-element.elementor-element-adfa134 .elementor-heading-title{font-size:1.5rem;}.elementor-1588 .elementor-element.elementor-element-57db3723{text-align:left;}.elementor-1588 .elementor-element.elementor-element-57db3723 .elementor-heading-title{font-size:1rem;}.elementor-1588 .elementor-element.elementor-element-10e165c7{--border-radius:0px 0px 0px 0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-1588 .elementor-element.elementor-element-6698f7d{width:auto;max-width:auto;}}/* Start custom CSS for shortcode, class: .elementor-element-6698f7d *//* Base styles (for larger screens or default) */
/* Make the breadcrumb container a flex container to control spacing */
.rank-math-breadcrumb p, /* Target the paragraph containing breadcrumbs */
.rank-math-breadcrumb {
    display: flex !important; /* Use flexbox */
    align-items: center !important; /* Vertically align items in the middle */
    flex-wrap: wrap !important; /* Allow breadcrumbs to wrap to next line if too long */
    column-gap: 16px !important; /* Adjust this value for horizontal spacing between items and separators */
    font-size: 1rem !important;
    font-family: 'Noto Sans JP', sans-serif;
    color: #333333;
    height: 44px;
    align-items: center;
}

/* Hide the default separator text (e.g., '/') */
.rank-math-breadcrumb .separator {
    font-size: 0 !important; /* Completely hide the default text */
    line-height: 0 !important; /* Collapse its line height */
    overflow: hidden !important; /* Hide any potential overflow */
    margin: 0 !important; /* Remove any default margins on the separator itself */
    padding: 0 !important; /* Remove any default padding */
    display: flex !important; /* Make it a flex item to properly center the pseudo-element */
    align-items: center !important; /* Vertically center the image within the separator's space */
    justify-content: center !important; /* Horizontally center the image */
}

/* Add the SVG image as a pseudo-element to the separator */
.rank-math-breadcrumb .separator::before {
    content: '' !important; /* Essential for pseudo-elements */
    display: inline-block !important; /* Ensure it can have width and height */
    width: 14px !important; /* Adjust the width of your SVG as needed */
    height: 14px !important; /* Adjust the height of your SVG as needed */
    background-image: url('https://hakuei-shoji.jp/wp-content/uploads/2025/06/Vector-9-Stroke.svg') !important;
    background-size: contain !important; /* Ensures the SVG scales to fit the set width/height */
    background-repeat: no-repeat !important; /* Prevents the image from repeating */
    background-position: center !important; /* Centers the SVG within its own space */
    transform: rotate(270deg);
}

/* Optional: Adjust vertical alignment of the breadcrumb links/spans themselves if needed */
.rank-math-breadcrumb span {
    vertical-align: middle !important; /* Ensures text aligns with the middle of the separator image */
}

/* Optional: Styles for the last breadcrumb item if it's not a link */
.rank-math-breadcrumb span[itemprop="name"] {
    white-space: nowrap; /* Prevent current page title from wrapping too early */
}

/* For screens smaller than 480px (common for mobile phones) */
@media (max-width: 480px) {
    .rank-math-breadcrumb p,
    .rank-math-breadcrumb {
        font-size: 0.8rem !important; /* Even smaller font size */
        column-gap: 10px !important; /* Further reduce gap */
        height: 20px;
    }

    .rank-math-breadcrumb .separator::before {
        width: 10px !important; /* Even smaller SVG */
        height: 10px !important; /* Even smaller SVG */
    }

    /* You might consider adding more aggressive wrapping or truncation for very long breadcrumb paths on tiny screens */
    .rank-math-breadcrumb span {
        white-space: normal; /* Allow breadcrumb text to wrap if necessary */
    }
    .rank-math-breadcrumb span[itemprop="name"] {
        white-space: normal; /* Allow current page title to wrap on very small screens */
        /* Optionally, you could add text-overflow: ellipsis; and overflow: hidden; here
           if you prefer to truncate long titles instead of wrapping. */
    }
}

/* You can also define specific breakpoints based on your site's needs, e.g., for iPads in portrait */
/* @media (max-width: 992px) {
    .rank-math-breadcrumb p,
    .rank-math-breadcrumb {
        font-size: 0.95rem !important;
        column-gap: 14px !important;
    }
} */

@media (max-width: 480px) {
    .elementor-shortcode .rank-math-breadcrumb p, .elementor-shortcode  .rank-math-breadcrumb {
        height: 100%;
        margin:0;
    }
}/* End custom CSS */