.c-single {
    padding: 5.75rem 0 8.75rem;
    @media (768px > width) {
        padding: 3.75rem 0 5.375rem;
    }
    .entry-content {
        position: relative;
        z-index: 2;
        padding: 0 0 5.625rem;
        h2 {
            margin: 2.5rem 0 1rem;
            @media (768px > width) {
                margin: 2rem 0 .75rem;
            }
        }
        h3 {
            margin: 2rem 0 .75rem;
            @media (768px > width) {
                margin: 1.5rem 0 .5rem;
            }
        }
        h4 {
            margin: 1.5rem 0 .5rem;
            @media (768px > width) {
                margin: 1.25rem 0 .4375rem;
            }
        }
        p {
            margin: 0 0 1rem;
            line-height: calc(30/16);
            @media (768px > width) {
                line-height: calc(28/15);
            }
        }
        td {
            line-height: calc(30/16);
        }
        .wp-block-media-text__content {
            padding: 0 8% 0 0;
            @media (768px > width) {
                padding: 0;
            }
        }
    }
    & .nav-links {
        justify-content: center;
        margin-bottom: 5.625rem;
        padding: 4.375rem 0;
        border-top: 3px solid var(--color-bg02);
        border-bottom: 3px solid var(--color-bg02);
        @media (768px > width) {
            gap: 3.125rem;
            margin-bottom: 2.125rem;
            padding: 1.875rem;
        }
        & .nav-previous {
            width: auto;
            padding: 0 5.625rem;
            flex: none;
            font-size: 1.25rem;
            @media (768px > width) {
                padding: 0;
                font-size: 1rem;
            }
            & .nav-subtitle {
                position: relative;
                font-weight: 700;
                color: var(--color-main);
            }
            a {
                display: flex;
                align-items: center;
                gap: 1.25rem;
                font-weight: 700;
                color: var(--color-main);
                @media (768px > width) {
                    flex-direction: column-reverse;
                    align-items: center;
                }
                span {
                    position: relative;
                    &::before {
                        position: absolute;
                        content: "";
                        bottom: -4px;
                        left: 0;
                        width: 0;
                        height: 1px;
                        background: var(--color-main);
                        transition: .3s ease;
                    }
                }
                img {
                    width: 54px;
                    @media (768px > width) {
                        width: 44px;
                    }
                }
                &:hover {
                    span {
                        &::before {
                            width: 100%;
                        }
                    }
                    img {
                        width: 54px;
                        content: url("../images/icon-prev-hover.png");
                    }
                }
            }
            span.arrow {
                position: absolute;
                top: unset;
                content: "";
                top: 50%;
                left: -4rem;
                transform: translateY(-50%);
                width: 54px;
                height: 54px;
                border: 1.5px solid var(--color-main);
                border-radius: 50%;
                background: var(--color-wh);
                transition: .3s ease;
                &::after {
                    position: absolute;
                    content: "";
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    width: 7px;
                    height: 12px;
                    background: url(../images/arrow-navy-prev.png), top center / contain no-repeat;

                }
            }
            &:hover {
                span.arrow {
                    background: var(--color-main);
                    &::after {
                        background: url(../images/arrow-navy-prev-white.png), top center / contain no-repeat;
                    }
                }

            }
        }
        & .nav-next {
            width: auto;
            padding: 0 5.625rem;
            flex: none;
            font-size: 1.25rem;
            @media (768px > width) {
                padding: 0;
                font-size: 1rem;
            }
            & .nav-subtitle {
                position: relative;
                font-weight: 700;
                color: var(--color-main);
            }
            a {
                display: flex;
                align-items: center;
                gap: 1.25rem;
                font-weight: 700;
                color: var(--color-main);
                transition: .3s ease;
                @media (768px > width) {
                    flex-direction: column;
                    align-items: center;
                }
                span {
                    position: relative;
                    &::before {
                        position: absolute;
                        content: "";
                        bottom: -4px;
                        left: 0;
                        width: 0;
                        height: 1px;
                        background: var(--color-main);
                        transition: .3s ease;
                    }
                }
                img {
                    width: 54px;
                    @media (768px > width) {
                        width: 44px;
                    }
                }
                &:hover {
                    span {
                        &::before {
                            width: 100%;
                        }
                    }
                    img {
                        width: 54px;
                        content: url("../images/icon-next-hover.png");
                    }
                }
            }
            span.arrow {
                position: absolute;
                top: unset;
                content: "";
                top: 50%;
                right: -4rem;
                transform: translateY(-50%);
                width: 54px;
                height: 54px;
                border: 1.5px solid var(--color-main);
                border-radius: 50%;
                background: var(--color-wh);
                transition: .3s ease;
                &::after {
                    position: absolute;
                    content: "";
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    width: 7px;
                    height: 12px;
                    background: url(../images/arrow-navy-next.png), top center / contain no-repeat;
                }
            }
            &:hover {
                span.arrow {
                    background: var(--color-main);
                    &::after {
                        background: url(../images/arrow-navy-next-white.png), top center / contain no-repeat;
                    }
                }

            }
        }
    }
    & .entry-title {
        margin-bottom: 2.25rem;
        padding-bottom: 1rem;
        border-bottom: 1px solid var(--color-bg03);
        font-size: 1.5625rem;
        color: var(--color-main);
        @media (768px > width) {
            padding-bottom: .9375rem;
            margin-bottom: 1.5rem;
            font-size: 1.5rem;
        }
    }
    & .entry-meta {
        @media (768px > width) {
            display: flex;
            align-items: center;
            gap: .75rem;
        }
    }
    & .entry-date {
        font-size: .9375rem;
        font-weight: 500;
        color: var(--color-main03);
        @media (768px > width) {
            font-size: .875rem;
            white-space: nowrap;
        }
    }
    & .entry-categories {
        @media (768px > width) {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }
        a {
            display: inline-block;
            padding: .125rem .375rem;
            border-radius: .1875rem;
            font-size: .875rem;
            font-weight: 500;
            color: var(--color-main03);
            word-break: keep-all;
            pointer-events: none;
            @media (768px > width) {
                padding: .25rem .375rem;
                font-size: .8125rem;
            }
            &:not(:last-of-type) {
                margin-right: .5rem;
            }
        }
    }
    & .post, & .news, & .catalog, & .products {
        ul {
            list-style: disc;
            list-style-position: inside;
            li {
                &::marker {
                    line-height: 1;
                    color: var(--color-main);
                }
            }
        }
        h2 {
            position: relative;
            padding-left: 1.375rem;
            &::before {
                content: '';
                position: absolute;
                inset: -3px;
                border-radius: 50%;
                padding: 3px;
                background: linear-gradient(to right, var(--color-main03) 0%, var(--color-main) 100%);
                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: xor;
                mask-composite: exclude;
                top: 48%;
                left: 0;
                transform: translateY(-50%);
                width: 14px;
                height: 14px;
            }
        }
        h3 {
            position: relative;
            margin-left: 3.125rem;
            &::before {
                position: absolute;
                content: "";
                top: 50%;
                left: -48px;
                transform: translateY(-50%);
                width: 36px;
                height: 3px;
                background: linear-gradient(to right, var(--color-main03) 0%, var(--color-main) 100%);
            }
        }
    }
    & .c-single__nav {
        display: flex;
        justify-content: center;
        margin-top: 5.625rem;
        & .c-button--back {
            font-weight: 600;
            color: var(--color-main);
            span {
                transform: skewX(11deg);
            }
        }
    }
}
