/*==================================
Sidebar Layout
==================================*/

.side_layout{

    display:grid;
    grid-template-columns:320px 1fr;
    gap:96px;
    align-items:start;

}

.side{

    position:sticky;
    top:110px;

}

.side_content{

    min-width:0;

}

/*==================================
Title
==================================*/

.side_title {
    margin: 0 0 48px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    color: #222;
    border-left: 5px solid #222;
    padding: 0 0 0 10px;
}

/*==================================
Accordion
==================================*/

.side_accordion{

    display:flex;
    flex-direction:column;
    gap:10px;

}

.side_details{

    border-bottom:2px solid #E6EBE8;
    padding-bottom:12px;

}

/*==================================
Summary
==================================*/

.side_summary{

    display:flex;
    justify-content:space-between;
    align-items:center;

    cursor:pointer;
    list-style:none;

    font-size:20px;
    font-weight:500;
    line-height:1.2;

    color:#222;

    transition:.25s;

}

.side_summary:hover{

    color:#165B3A;

}

.side_summary::-webkit-details-marker{

    display:none;

}

/* Arrow */

.side_summary::after{

    content:"›";

    font-size:34px;
    font-weight:300;

    color:#165B3A;

    transition:.3s;

}

.side_details[open] .side_summary::after{

    transform:rotate(90deg);

}

/*==================================
Child Menu
==================================*/

.side_nav{

    display:flex;
    flex-direction:column;

    margin-top:22px;
    margin-left:8px;

    border-left:1px solid #E5E5E5;

}

.side_item{

    position:relative;

    padding:13px 0 13px 22px;

    color:#666;

    font-size:16px;
    font-weight:500;

    text-decoration:none;

    transition:.25s;

}

.side_item:hover{

    color:#165B3A;

    transform:translateX(6px);

}

/* Active */

.side_item.is_active{

    color:#165B3A;

    font-weight:700;

}

.side_item.is_active::before{

    content:"";

    position:absolute;

    left:-1px;
    top:50%;

    width:3px;
    height:20px;

    transform:translateY(-50%);

    background:#165B3A;

    border-radius:10px;

}

/*==================================
Responsive
==================================*/

@media (max-width:1024px){

    .side_layout{

        grid-template-columns:1fr;
        gap:56px;

    }

    .side{

        position:relative;
        top:auto;

    }

    .side_title{

        font-size:20px;

    }

    .side_summary{

        font-size:20px;

    }

}

.side_link{

    border-bottom:1px solid #E6EBE8;
    padding-bottom:22px;

}

.side_summary_link{

    display:flex;
    justify-content:space-between;
    align-items:center;

    text-decoration:none;

    color:#222;

}

.side_summary_link::after{

    content:"›";

    font-size:34px;
    font-weight:300;

    color:#165B3A;

    transition:.3s;

}

.side_summary_link:hover{

    color:#165B3A;

}


@media (max-width:768px){

    .side_layout{
        width: 90%;
        margin:0 auto;

    }

}