@charset "utf-8";

.icon {
    width: inherit;
    height: inherit;
    display: inline-block;
    background-color: transparent;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}

    .icon.icon-eye {
        background-image: url("../gigif/login/B-1.svg");
    }

        .icon.icon-eye:hover {
            background-image: url("../gigif/login/B-2.svg");
        }

    .icon.icon-app-pe {
        width: 35px;
        height: 20px;
        background-image: url("../gigif/login/C-1.svg");
    }

    .icon.icon-app-sa {
        width: 26px;
        height: 26px;
        background-image: url("../gigif/login/C-2.svg");
    }

    .icon.icon-app-tm {
        width: 35px;
        height: 30px;
        background-image: url("../gigif/login/C-3.svg");
    }

    .icon.icon-app-nc {
        width: 31px;
        height: 24px;
        background-image: url("../gigif/login/C-4.svg");
    }

    .icon.icon-app-cs {
        width: 25px;
        height: 25px;
        background-image: url("../gigif/login/C-5.svg");
    }

    .icon.icon-addons {
        width: 21px;
        height: 21px;
        background-image: url("../gigif/login/C-6.svg");
    }

    .icon.icon-logout {
        background-image: url("../gigif/login/F-1.svg");
    }

    .icon.icon-bell {
        width: 64px;
        height: 64px;
        background-image: url("../gigif/login/G-2.svg");
    }

        .icon.icon-bell:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-bell-in {
        width: 64px;
        height: 64px;
        background-image: url("../gigif/login/G-3.svg");
    }

        .icon.icon-bell-in:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-avatar {
        width: 64px;
        height: 64px;
        background-image: url("../gigif/login/G-4.svg");
    }

        .icon.icon-avatar:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-subheadings {
        background-image: url("../gigif/login/H-1.svg");
    }

    .icon.icon-signout {
        width: 22px;
        height: 14px;
        background-image: url("../gigif/login/H-2.svg");
    }

    .icon.icon-close {
        width: 12px;
        height: 12px;
        background-image: url("../gigif/login/I-1.svg");
    }

        .icon.icon-close:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-menu-accessory {
        width: 6px;
        height: 9px;
        background-image: url("../gigif/login/I-3.svg");
    }

        .icon.icon-menu-accessory:hover {
            background-color: #F5F5F5;
        }

        .icon.icon-menu-accessory.open {
            width: 9px;
            height: 6px;
            background-image: url("../gigif/login/I-5.svg");
        }

            .icon.icon-menu-accessory.open:hover {
                background-color: #F5F5F5;
            }

    .icon.icon-right-arrow {
        background-image: url("../gigif/login/I-3.svg");
    }

        .icon.icon-right-arrow:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-down-arrow {
        background-image: url("../gigif/login/I-5.svg");
    }

        .icon.icon-down-arrow:hover {
            background-color: #F5F5F5;
        }

    .icon.icon-menu {
        width: 16px;
        height: 11px;
        background-image: url("../gigif/login/J-1.svg");
    }

    .icon.icon-contents {
        width: 17px;
        height: 13px;
        background-image: url("../gigif/login/J-3.svg");
    }

        .icon.icon-contents.disabled {
            background-image: url("../gigif/login/J-5.svg");
        }

    .icon.icon-search {
        background-image: url("../gigif/login/K-1.svg");
    }

    .icon.icon-condition {
        background-image: url("../gigif/login/K-2.svg");
    }

        .icon.icon-condition:hover {
            background-image: url("../gigif/login/K-3.svg");
        }

.active .icon.icon-app-pe {
    background-image: url("../gigif/login/D-1.svg");
}

.active .icon.icon-app-sa {
    background-image: url("../gigif/login/D-2.svg");
}

.active .icon.icon-app-tm {
    background-image: url("../gigif/login/D-3.svg");
}

.active .icon.icon-app-nc {
    background-image: url("../gigif/login/D-4.svg");
}

.active .icon.icon-app-cs {
    background-image: url("../gigif/login/D-5.svg");
}

.active .icon.icon-addons {
    background-image: url("../gigif/login/D-6.svg");
}

.active .icon.icon-menu-accessory {
    background-image: url("../gigif/login/I-4.svg");
}

    .active .icon.icon-menu-accessory.open {
        background-image: url("../gigif/login/I-6.svg");
    }

.active .icon.icon-right-arrow {
    background-image: url("../gigif/login/I-4.svg");
}

.active .icon.icon-down-arrow {
    background-image: url("../gigif/login/I-6.svg");
}

.active .icon.icon-menu {
    background-image: url("../gigif/login/J-2.svg");
}

.active .icon.icon-contents {
    background-image: url("../gigif/login/J-4.svg");
}