// Footer =====================
.footer {
    padding: 80px 0;
    margin: auto 0 0 0;
    background: $gray;

    &_box {
        display: flex;
    }

    &_col {
        width: calc(20% - 64px);
        margin-right: 80px;
        position: relative;
        display: block;

        &::after {
            content: '';
            position: absolute;
            top: 0;
            right: -40px;
            height: 100%;
            width: 1px;
            background: #8E8E8E;
        }

        &:last-child {
            margin-right: 0;

            &::after {
                display: none;
            }
        }

        &-group {
            margin-bottom: 40px;

            &:last-child {
                margin-bottom: 0;
            }
        }

        &-title {
            font-weight: 700;
            font-size: 14px;
            line-height: 1.2;
            color: $yellow;
            margin-bottom: 25px;
            display: block;
        }

        &-link {
            display: block;
            margin-bottom: 20px;
            font-weight: 700;
            font-size: 14px;
            line-height: 1.2;
            color: #FFFFFF;
            @include transition;

            &:hover {
                color: $yellow;
            }
        }
    }

    &_navs {
        display: flex;
        justify-content: space-between;
        border-top: 1px solid #8E8E8E;
        margin-top: 50px;
        padding-top: 50px;

        &-col {
            width: calc(25% - 50px);
            max-width: 245px;
            color: #fff;
        }

        &-link {
            display: flex;
            margin-bottom: 24px;
            
            &:last-child {
                margin-bottom: 0;
            }

            p {
                font-size: 16px;
                font-weight: 400;
                line-height: 1.3;
                color: #fff;

                width: calc(100% - 26px);
            }

            &:hover {
                p {
                    color: $yellow;
                }

                path {
                    fill: $yellow;
                }
            }

            span {
                display: block;
                width: 20px;
                height: 20px;
                margin-right: 10px;

                svg {
                    display: block;
                    @include ImgCon;
                }
            }
        }

        &-txt {
            font-size: 12px;
            font-weight: 400;
            line-height: 1.3;
        }

        .copyright {
            font-size: 16px;
            font-weight: 700;
            line-height: 1.3;
            margin-bottom: 24px;
        }

        ul {
            li {
                margin-bottom: 24px;

                &:last-child {
                    margin-bottom: 0;
                }
            }

            a {
                font-size: 16px;
                font-weight: 400;
                line-height: 1.3;
                color: #fff;

                display: flex;
                align-items: center;
                @include transition;

                &:hover {
                    color: $yellow;

                    path {
                        fill: $yellow;
                    }
                }

                span {
                    display: block;
                    width: 20px;
                    height: 20px;
                    margin-right: 10px;

                    svg {
                        display: block;
                        @include ImgCon;
                    }
                }
            }
        }


    }


}

// Footer end =================