@import url(/css/content/content_01_about.css);
@import url(/css/content/content_02_product.css);
@import url(/css/content/content_03_equipment.css);
@import url(/css/content/content_04_cust-service.css);
@import url(/css/content/content_05_inquiry.css);

.main:not(:has(>.background_text)) {
    padding-bottom: 173rem;
}


.sub_head .breadcrumb {
    display: flex;
    align-items: center;
    column-gap: 22rem;
    height: 80rem;
    padding-inline: 40rem ;
    border-radius: 5rem;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.05);
    background-color: #fff;
    font-size: var(--fs16);
    font-weight: 500;
    margin-top: -36rem;

    .ph.ph-house { font-size: 24rem; }
}
.sub_head .sub_head__bc {z-index: 1; position: relative;}

.breadcrumb > li:last-child {position: relative;}
.breadcrumb .subMenu {
    position: absolute;
    top: 32px;;

    min-width: 130rem;
    background-color: #fff;
    border-radius: 5rem;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.05);
    font-size: var(--fs16);
    font-weight: 500;
    padding-block: 12rem;
}
.breadcrumb .subMenu > li > a {
    display: block;
    padding-block: 8rem;
    padding-inline: 16rem 24rem;
}
.breadcrumb > li:last-child:hover > .subMenu_breadcrumb > ul {
    visibility: visible; 
    opacity: 1;
    transform: translateY(0);
    transition: all .2s ease-in;
}
.breadcrumb > li > .subMenu_breadcrumb > ul { 
    visibility: hidden; 
    opacity: 0; 
    transform: translateY(-10px);
    transition: all 1s ease-out; 
}
.subMenu_breadcrumb > ul > li > a:hover { color: var(--white); background-color: var(--black-muted); }

@media (max-width: 767px) {
    .main:not(:has(>.background_text)) {
        padding-bottom: 33rem;
    }
    .sub_head .breadcrumb {
        height: 54rem; 
        padding-inline: 20rem;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .main:not(:has(>.background_text)) {
        padding-bottom: 64rem;
    }
}