.compare-widget{
    position: fixed;
    bottom: 0px;
    right: 20px;
    display: flex;
    width: 416px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    border-radius: 8px 8px 0px 0px;
    border: 1px solid var(--grey-03, #E9E9E9);
    background: var(--White, #FFF);
    z-index: 10000;

    /* Drop Shadow 1 */
    box-shadow: 0px 1.16667px 3.14815px 0px rgba(0, 0, 0, 0.02), 0px 5.13333px 6.51852px 0px rgba(0, 0, 0, 0.03), 0px 12.6px 13px 0px rgba(0, 0, 0, 0.04), 0px 24.26667px 25.48148px 0px rgba(0, 0, 0, 0.04), 0px 40.83333px 46.85185px 0px rgba(0, 0, 0, 0.05), 0px 63px 80px 0px rgba(0, 0, 0, 0.07);
}
#compare-widget-wrap.on .compare-widget, #compare-widget-wrap .compare-widget-min {
    display: flex;
}
#compare-widget-wrap .compare-widget, #compare-widget-wrap.on .compare-widget-min{
    display: none;
}

.widget-title{
    display: flex;
    height: 64px;
    padding: 0px 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}
.widget-title-sub{
    display: flex;
    align-items: center;
    gap: 8px;
}
.widget-title-sub .icon-2{
    color: var(--FS-red, #B2243C);
    text-align: center;
    font-size: 24px;
    font-weight: 900;

}
.widget-title-sub span{
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 16px;
    font-weight: 700;
}


.widget-list{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}
.widget-list.found{
    padding: 16px 24px;
}
.widget-control{
    display: flex;
    padding: 16px 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-top: 1px solid var(--Black, #222);
    background: var(--grey-01, #F8F8F8);

}

.widget-school{
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    gap: 8px;
    padding-bottom: 16px;
}
.widget-school:not(:last-child){
    border-bottom: 1px solid var(--grey-03, #E9E9E9);
}
.widget-school .school-type{
    display: flex;
    padding: 8px;
    align-items: center;
    gap: 4px;
    border-radius: 4px;
    background: var(--grey-03, #E9E9E9);
    min-width: 90px;
}
.widget-school .school-type i{
    font-size: 16px;
    color: var(--Black, #222);
}
.widget-school .school-type span{
    font-size: 12px;
    color: var(--Black, #222);
}
.widget-school .school-name{
    flex: 1 0 0;
    color: var(--Black, #222);
    font-size: 16px;
}

.widget-line{
    width: 368px;
    height: 1px;
    background: #E9E9E9;
}

.widget-control .c1{
    display: flex;
    padding: 12px 16px;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background: var(--Black, #222);
    color: var(--White, #FFF);
    font-size: 16px;
}
.widget-control .c1 a{
    color: var(--White, #FFF);
    font-weight: 600;
    text-decoration-line: underline;
}
.widget-control .c2{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 8px;
}
.widget-control .c2 .c21{
    display: flex;
    align-items: center;
    gap: 4px;
}
.widget-control .c2 .c22{
    display: flex;
    align-items: center;
    gap: 4px;
}

.widget-school-item{
    display: flex;
    width: 356px;
    align-items: center;
    gap: 8px;
    height: 32px;
}

.compare-widget-min{
    position: fixed;
    bottom: 0px;
    right: 20px;
    display: inline-flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 100px;
    border: 1px solid var(--grey-03, #E9E9E9);
    background: var(--White, #FFF);

    /* Drop Shadow 1 */
    box-shadow: 0px 1.16667px 3.14815px 0px rgba(0, 0, 0, 0.02), 0px 5.13333px 6.51852px 0px rgba(0, 0, 0, 0.03), 0px 12.6px 13px 0px rgba(0, 0, 0, 0.04), 0px 24.26667px 25.48148px 0px rgba(0, 0, 0, 0.04), 0px 40.83333px 46.85185px 0px rgba(0, 0, 0, 0.05), 0px 63px 80px 0px rgba(0, 0, 0, 0.07);
}

.compare-widget-min i{
    display: flex;
    width: 20px;
    height: 19px;
    flex-direction: column;
    justify-content: center;
    color: var(--FS-red, #B2243C);
    text-align: center;
    font-size: 20px;
    font-weight: 900;
}


    @media (max-width: 768px) {
        .compare-widget {
            width: auto;
        }
        .widget-control {
            padding: 8px;
        }
        .widget-school-item {
            width: auto;
            max-width: 250px;
        }
    }