/*! Список ссылок [[js/hrefs-map.js]] */
/*@ CSS  Global [[css/global-styles.css]] */
/*@ html Куток споживача [[consumer-support.html]] */

body {
    /* CSS  Global [[css/global-styles.css]] */
}
        body[data-media="landscape__portrait--PC"] {
            overflow-y: scroll;
        }
        #start {
            scroll-margin-top: 1000px;
        }
    header {
        /* CSS  Хедер [[css/header.css]] */
    }
        h1 > span[data-media="landscape__portrait--PC"] {
            /* --text-condensed: 0.85; */
        }
        h1 > span[data-media="portrait--mobile"] {
            --text-condensed: 0.75;
        }
    main {
        position: relative;
        margin-left: auto;
        margin-right: auto;

        width: 100%;

        background-color: var(--color-test);
    }
            main[data-media="landscape__portrait--PC"] {
                margin-top: calc(72px * var(--scale_1200));

                /* min-height: calc(var(--100vh_start) - 434px * var(--scale_1200)); */
                min-height: calc(var(--100vh_true) - 416px * var(--scale_1200));
                max-width: 1200px;
            }
            main[data-media="portrait--mobile"] {
                margin-top: calc(112px * var(--scale_1200));

                min-height: calc(100vh - 866px * var(--scale_1200));
            }
        .labels_container {
            z-index: 2;
            left: 50%;

            background-color: var(--color-test);
        }
                .labels_container[data-media="landscape__portrait--PC"] {
                    position: fixed;
                    top: calc(72px * var(--scale_1200));
                    
                    height: 496px;
                    /* max-height: calc((var(--100vh_start) - 110px * var(--scale_1200)) / var(--scale_1200)); */
                    max-height: calc((var(--100vh_true) - 110px * var(--scale_1200)) / var(--scale_1200));
                    width: 264px;

                    overflow-y: auto;
                    overflow-x: hidden;

                    transform: translateX(calc(-580px * var(--scale_1200))) scale(var(--scale_1200));
                    transform-origin: top left;
                }
                .labels_container[data-media="portrait--mobile"] {
                    position: fixed;
                    top: calc(68px * var(--scale_1200));

                    display: flex;
                    justify-content: center;
                    align-items: center;
                    flex-direction: row;
                    
                    height: 40px;
                    width: fit-content;
                    
                    transform: translateX(-50%) scale(var(--scale_1200));
                    transform-origin: top center;
                }
                #sticky_labels_container{
                    position: absolute;
                    left: 0;
                    bottom: 0;

                    height: 0px;
                    width: 100%;
                }
            .labels_container > label {
                position: relative;
                display: block;
                
                background-color: var(--color-test);
                
                transition: all 0.5s ease-in-out;
            }
                    .labels_container > label[data-media="landscape__portrait--PC"] {
                        height: calc((100% - 16px) / 3 - 14px);
                        min-height: 100px;
                        width: calc(100% - 13px * 2);
                        padding: 7px 13px;
                    }
                    .labels_container > label[data-media="portrait--mobile"] {
                        height: 100%;
                        width: 186px;
                    }
                        label[for="consSup_POA"][data-media="portrait--mobile"] {
                            background-image: url(../img/consumer-support/button_consSup_POA.svg);
                        }
                                input#consSup_POA:checked ~ .labels_container label[for="consSup_POA"][data-media="portrait--mobile"] {
                                    background-image: url(../img/consumer-support/button_consSup_POA_hover.svg);
                                }
                        label[for="consSup_consents"][data-media="portrait--mobile"] {
                            background-image: url(../img/consumer-support/button_consSup_consents.svg);
                        }
                                input#consSup_consents:checked ~ .labels_container label[for="consSup_consents"][data-media="portrait--mobile"] {
                                    background-image: url(../img/consumer-support/button_consSup_consents_hover.svg);
                                }
                        label[for="consSup_ToS"][data-media="portrait--mobile"] {
                            background-image: url(../img/consumer-support/button_consSup_ToS.svg);
                        }
                                input#consSup_ToS:checked ~ .labels_container label[for="consSup_ToS"][data-media="portrait--mobile"] {
                                    background-image: url(../img/consumer-support/button_consSup_ToS_hover.svg);
                                }
                    .labels_container > label::before {
                        position: absolute;
                        z-index: -1;
                        top: 0;
                        left: 0;

                        width: 100%;

                        content: "";

                        background-size: 100%;
                    }
                        .labels_container > label[data-media="landscape__portrait--PC"]::before {
                            height: 50%;
                            
                            opacity: 0.4;
                            background-image: url(../img/areas-of-activity/advisory-assistance/button_background.svg);
                            background-repeat: no-repeat;

                            transition: all 0.5s ease-in-out;
                        }
                                .labels_container > label[data-media="landscape__portrait--PC"]:hover::before {
                                    background-image: url(../img/areas-of-activity/advisory-assistance/button_background_hover.svg);
                                }
                        .labels_container > label[data-media="portrait--mobile"]::before {
                            height: 100%;

                            border-radius: 15px;

                            backdrop-filter: blur(2px);
                        }
                    .labels_container > label[data-media="landscape__portrait--PC"]::after {
                        position: absolute;
                        z-index: -1;
                        top: 50%;
                        left: 0;

                        height: 50%;
                        width: 100%;
                        transform: scaleY(-1);

                        opacity: 0.4;

                        content: "";

                        background-image: url(../img/areas-of-activity/advisory-assistance/button_background.svg);
                        background-repeat: no-repeat;
                        background-size: 100%;

                        transition: all 0.5s ease-in-out;
                    }
                            .labels_container > label[data-media="landscape__portrait--PC"]:hover::after {
                                background-image: url(../img/areas-of-activity/advisory-assistance/button_background_hover.svg);
                            }
                .labels_container > label[data-media="landscape__portrait--PC"]:not(:first-child) {
                    margin-top: 8px;
                }
                .labels_container > label[data-media="portrait--mobile"]:not(:first-child) {
                    margin-left: 10px;
                }
                input#consSup_POA:checked ~ .labels_container label[for="consSup_POA"][data-media="landscape__portrait--PC"]::before,
                input#consSup_consents:checked ~ .labels_container label[for="consSup_consents"][data-media="landscape__portrait--PC"]::before,
                input#consSup_ToS:checked ~ .labels_container label[for="consSup_ToS"][data-media="landscape__portrait--PC"]::before,
                input#consSup_POA:checked ~ .labels_container label[for="consSup_POA"][data-media="landscape__portrait--PC"]::after,
                input#consSup_consents:checked ~ .labels_container label[for="consSup_consents"][data-media="landscape__portrait--PC"]::after,
                input#consSup_ToS:checked ~ .labels_container label[for="consSup_ToS"][data-media="landscape__portrait--PC"]::after {
                    opacity: 0.5;
                    background-image: url(../img/areas-of-activity/advisory-assistance/button_background_hover.svg);
                }
                .label-img-container {
                    width: 100%;

                    background-color: var(--color-test);

                    transition: all 0.5s ease-in-out;
                }
                        .label-img-container[data-media="landscape__portrait--PC"] {
                            height: calc(100% - 29px);
                            
                            overflow: hidden;
                            opacity: 0.35;
                        }
                        .label-img-container[data-media="portrait--mobile"] {
                            display: none;
                        }
                        label:hover .label-img-container[data-media="landscape__portrait--PC"] {
                            opacity: 1;
                        }
                        input#consSup_POA:checked ~ .labels_container label[for="consSup_POA"] > .label-img-container[data-media="landscape__portrait--PC"],
                        input#consSup_consents:checked ~ .labels_container label[for="consSup_consents"] > .label-img-container[data-media="landscape__portrait--PC"],
                        input#consSup_ToS:checked ~ .labels_container label[for="consSup_ToS"] > .label-img-container[data-media="landscape__portrait--PC"] {
                            opacity: 1;
                        }
                    .label-img-container img[data-media="landscape__portrait--PC"] {
                        height: 100%;
                        width: 100%;

                        transform-origin: center;

                        object-fit: cover;
                        object-position: center;
                    }
                .label-title {
                    text-align: center;
                    

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.3));

                    background-color: var(--color-test);

                    transition: all 0.2s ease-in-out;
                }
                    .label-title[data-media="landscape__portrait--PC"] {
                        font-size: 20px;
                        white-space: nowrap;
                        line-height: 32px;
                    }
                    .label-title[data-media="portrait--mobile"] {
                            height: calc(100% - 6px);
                            width: calc(100% - 32px);
                            padding-top: 6px;

                            float: right;
                            overflow: hidden;

                            font-size: 16px;
                            line-height: 14px;
                            
                            color: white;
                        }
                        input#consSup_POA:checked ~ .labels_container label[for="consSup_POA"] > .label-title[data-media="landscape__portrait--PC"],
                        input#consSup_consents:checked ~ .labels_container label[for="consSup_consents"] > .label-title[data-media="landscape__portrait--PC"],
                        input#consSup_ToS:checked ~ .labels_container label[for="consSup_ToS"] > .label-title[data-media="landscape__portrait--PC"] {
                            filter: drop-shadow(0 0 5px white) drop-shadow(0 0 5px white) drop-shadow(0 0 5px white);
                        }
                    label[for="consSup_POA"] > .label-title > span[data-media="landscape__portrait--PC"] {
                        --text-condensed: 0.9;
                    }
                    label[for="consSup_POA"] > .label-title > span[data-media="portrait--mobile"] {
                        /* margin-top: 4px; */

                        /* --text-condensed: 0.8; */
                    }
                    label[for="consSup_consents"] > .label-title > span[data-media="landscape__portrait--PC"] {
                        /* --text-condensed: 0.64; */
                    }
                    label[for="consSup_consents"] > .label-title > span[data-media="portrait--mobile"] {
                        line-height: 32px;
                        
                        /* --text-condensed: 0.85; */
                    }
                    label[for="consSup_ToS"] > .label-title > span[data-media="landscape__portrait--PC"] {
                        --text-condensed: 0.9;
                    }
                    label[for="consSup_ToS"] > .label-title > span[data-media="portrait--mobile"] {
                        /* margin-top: 12px; */

                        /* display: block; */
                    }
                        .label-title > span br[data-media="landscape__portrait--PC"] {
                            content: none;
                            display: none;
                        }
        input[name="supportDoc"] + section {
            position: relative;
            z-index: 1;
            height: 0;
            padding: 0;
            
            overflow: hidden;
            visibility: hidden;
            opacity: 0;

            font-size: 0;
            
            transition: opacity 1s ease-in-out;

            /* pointer-events: none; */
        }
                input#consSup_PEC + section {
                    padding-left: calc(10px * var(--scale_1200));
                    padding-right: calc(10px * var(--scale_1200));
                }
                input[name="supportDoc"]:checked + section {
                        height: auto;

                        overflow: visible;
                        visibility: visible;
                        opacity: 1;

                        /* pointer-events: auto; */
                    }
                        input[name="supportDoc"]:not(#consSup_consents):checked + section {
                            padding-top: calc(40px * var(--scale_1200));
                            padding-bottom: calc(40px * var(--scale_1200));
                        }
                input:not(#consSup_consents) + section::after {
                    content: "";
                    position: absolute;
                    z-index: -1;

                    top: 0;

                    height: 100%;

                    box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.4);
                    background-color: rgba(255, 255, 255, 0.8);
                }
                        input:not(#consSup_consents) + section[data-media="landscape__portrait--PC"]::after {
                            left: calc(310px * var(--scale_1200));
                            width: calc(880px * var(--scale_1200));
                        }
                        input:not(#consSup_consents) + section[data-media="portrait--mobile"]::after {
                            left: 50%;
                            width: calc(100% - 10px);

                            transform: translateX(-50%);
                        }
            section > h2 {
                position: sticky;
                z-index: 2;

                margin-top: calc(-40px * var(--scale_1200));
                /* left: 50%; */

                height: 40px;

                overflow: hidden;
                text-align: center;
                font-weight: bold;
                font-size: 24px;
                line-height: 43px;
                color: grey;
                text-transform: uppercase;
                letter-spacing: 0;

                transform: scale(var(--scale_1200));
                transform-origin: top left;

                box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.4);
                mix-blend-mode: hard-light;

                background-color: rgba(0, 0, 0, 0.8);
            }
                    section > h2[data-media="landscape__portrait--PC"] {
                        top: calc(72px * var(--scale_1200));
                        margin-left: calc(305px * var(--scale_1200));

                        width: 890px;
                    }
                            input#consSup_PEC + section > h2[data-media="landscape__portrait--PC"] {
                                margin-left: calc(295px * var(--scale_1200));
                            }
                            input#consSup_PEC + section > h2[data-media="portrait--mobile"] {
                                margin-left: calc(-8px * var(--scale_1200));
                            }
                    section > h2[data-media="portrait--mobile"] {
                        top: calc(112px * var(--scale_1200));
                        margin-left: calc(2px * var(--scale_1200));

                        width: 596px;
                    }
                    div[data-sticky-top].sticky-h2 {
                        position: relative;
                        top: calc(-40px * var(--scale_1200));
                    }
                    div[data-sticky-bottom].sticky-h2 {
                        position: relative;
                        top: calc(20px * var(--scale_1200));
                    }
                    section > h2 + div {
                        position: sticky;
                        z-index: 1;
                        
                        margin-top: -40px;
                        
                        left: 50%;
            
                        height: 40px;

                        transform: scale(var(--scale_1200));
                        transform-origin: top left;
    
                        backdrop-filter: blur(5px);
                    }
                            section > h2 + div[data-media="landscape__portrait--PC"] {
                                top: calc(72px * var(--scale_1200));
                                margin-left: calc(305px * var(--scale_1200));
                                
                                width: 890px;
                            }
                                    input#consSup_PEC + section > h2 + div[data-media="landscape__portrait--PC"] {
                                        margin-left: calc(295px * var(--scale_1200));
                                    }
                                    input#consSup_PEC + section > h2 + div[data-media="portrait--mobile"] {
                                        margin-left: calc(-8px * var(--scale_1200));
                                    }
                            section > h2 + div[data-media="portrait--mobile"] {
                                top: calc(112px * var(--scale_1200));
                                margin-left: calc(2px * var(--scale_1200));

                                width: 596px;
                            }
                h2 > span {
                    white-space: nowrap;
                }
                        input#consSup_CPPD + section > h2 > span[data-media="landscape__portrait--PC"] {
                            /* --text-condensed: 0.75; */
                        }
                        input#consSup_CPPD + section > h2 > span[data-media="portrait--mobile"] {
                            --text-condensed: 0.75;
                        }
                        input#consSup_PEC + section > h2 > span[data-media="landscape__portrait--PC"] {
                            --text-condensed: 0.65;
                        }
                        input#consSup_PEC + section > h2 > span[data-media="portrait--mobile"] {
                            --text-condensed: 0.45;
                        }
                        input#consSup_PSC + section > h2 > span[data-media="landscape__portrait--PC"] {
                            /* --text-condensed: 0.75; */
                        }
                        input#consSup_PSC + section > h2 > span[data-media="portrait--mobile"] {
                            --text-condensed: 0.75;
                        }
            input[name="consSup_consents"] + section {
                position: relative;

                height: auto;

                -webkit-mask-image:     linear-gradient(to bottom, rgba(255,255,255,1), rgba(255, 255, 255, 1)),
                                        linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
                        mask-image:     linear-gradient(to bottom, rgba(255,255,255,1), rgba(255, 255, 255, 1)),
                                        linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
                -webkit-mask-repeat:    no-repeat;
                        mask-repeat:    no-repeat;
                -webkit-mask-size:      100% 58%,
                                        100% 30%;
                        mask-size:      100% 58%,
                                        100% 30%;
                -webkit-mask-position:  0% 0%,
                                        0% 82%;
                        mask-position:  0% 0%,
                                        0% 82%;
                                        
                padding-top: calc(40px * var(--scale_1200));
                padding-bottom: calc(40px * var(--scale_1200));
                font-size: 0;
            }
                    input[name="consSup_consents"]:checked + section {
                        -webkit-mask-image: none;
                        mask-image: none;

                    }
                    input[name="consSup_consents"]:checked + section:not(:last-child) {
                        margin-bottom: calc(20px * var(--scale_1200));
                    }
                .PEC_header {
                    margin-top: 20px;
                    margin-left: 400px;
                }
                    .PEC_header p {
                        margin-top: 0 !important;
                    }
                .PEC_content {
                    position: relative;
                    margin-top: 20px;

                    height: 1004px;
                    width: 100%;
                }
                        .PEC_content::after,
                        .PEC_content_header::after {
                            content: "";

                            position: absolute;
                            z-index: -1;

                            left: -10px;
                            top: -10px;

                            height: calc(100% + 20px);
                            width: calc(100% + 20px);

                            border: 1px solid black;

                            background-color: var(--color-test);
                        }
                    .PEC_content_header {
                        position: relative;

                        height: 240px;
                        width: 100%;
                    }
                        .PEC_content_header > div {
                            position: relative;

                            height: 100%;
                            width: 400px;
                        }
                                .PEC_content_header > div::after {
                                    content: "";

                                    position: absolute;
                                    z-index: -1;

                                    top: -10px;
                                    left: -10px;
                                    
                                    height: calc(100% + 20px);
                                    width: calc(100% + 20px);
                                    
                                    border: 1px solid black;
                                }
                        .PEC_content_header > div:nth-child(1)                                                          /* Правий блок хедера */ {
                            float: left;
                        }                                
                            .PEC_content_header > div:nth-child(1) > :nth-child(1),
                            .PEC_content_header > div:nth-child(1) > :nth-child(4),
                            .PEC_content_header > div:nth-child(1) > :nth-child(6) {
                                font-size: 16px;
                                line-height: 16px;
                            }
                                    .PEC_content_header > div:nth-child(1) > :nth-child(4),
                                    .PEC_content_header > div:nth-child(1) > :nth-child(6) {
                                        margin-top: 16px;
                                    }
                            .PEC_content_header > div:nth-child(1) > :nth-child(2),
                            .PEC_content_header > div:nth-child(1) > :nth-child(3),
                            .PEC_content_header > div:nth-child(1) > :nth-child(5) {
                                height: 25px;
                                border-bottom: 1px solid black;
                            }
                            .PEC_content_header > div:nth-child(1) > :nth-child(6) > :nth-child(1) {
                                float: left;
                                
                                width: 30%;
                            }
                            .PEC_content_header > div:nth-child(1) > :nth-child(6) > :nth-child(2) {
                                margin-bottom: 20px;

                                float: right;

                                height: 14px;
                                width: 70%;

                                border-bottom: 1px solid black;
                            }
                        .PEC_content_header > div:nth-child(2)                                                          /* Лівий блок хедера */ {
                            float: right;
                        }
                            .PEC_content_header > div:nth-child(2) > :nth-child(1) {
                                position: relative;

                                height: 30px;

                                font-size: 18px;
                                line-height: 36px;
                                letter-spacing: 3px;
                                text-align: center;
                                font-weight: bold;
                                text-transform: uppercase;
                            }
                                    .PEC_content_header > div:nth-child(2) > div:nth-child(1)::after {
                                        content: "";

                                        position: absolute;
                                        z-index: -1;

                                        top: -10px;
                                        left: -10px;

                                        height: calc(100% + 20px);
                                        width: calc(100% + 20px);

                                        border: 1px solid black;
                                    }
                            .PEC_content_header > div:nth-child(2) > :nth-child(2) {
                                
                            }
                                .PEC_content_header > div:nth-child(2) > :nth-child(2) p {
                                    font-size: 16px !important;
                                    text-align: center !important;
                                    text-indent: 0 !important;
                                    margin-top: 24px !important;
                                }
                                        .PEC_content_header > div:nth-child(2) > :nth-child(2) > p:nth-child(2) {
                                            margin-top: 0px !important;
                                        }
                                .PEC_content_header > div:nth-child(2) > :nth-child(2) > div {
                                    text-align: center;
                                }
                                    .PEC_content_header > div:nth-child(2) > :nth-child(2) > div > :nth-child(1) {
                                        display: inline-block;
                                        height: 24px;
                                        width: 30%;
                                        border-bottom: 1px solid black;
                                    }
                                    .PEC_content_header > div:nth-child(2) > :nth-child(2) > div > :nth-child(2) {
                                        display: inline-block;
                                        
                                        width: 10%;

                                        line-height: 23px;
                                    }
                                    .PEC_content_header > div:nth-child(2) > :nth-child(2) > div > :nth-child(3) {
                                        display: inline-block;
                                        height: 24px;
                                        width: 30%;
                                        border-bottom: 1px solid black;
                                    }
                    .PEC_content_main {
                        font-size: 20px;
                    }
                        .PEC_content_main > :nth-child(2) {
                            
                        }
                            .PEC_content_main > :nth-child(2) > :nth-child(1),
                            .PEC_content_main > :nth-child(6) > :nth-child(1) {
                                margin-left: 15px;
                                display: inline-block;
                            }
                            .PEC_content_main > :nth-child(2) > :nth-child(2),
                            .PEC_content_main > :nth-child(6) > :nth-child(2) {
                                margin-left: 10px;
                                position: relative;
                                
                                display: inline-block;
                                
                                height: 40px;
                                width: 90%;

                                border-bottom: 1px solid black;
                            }
                                    .PEC_content_main > :nth-child(2) > :nth-child(2)::after,
                                    .PEC_content_main > :nth-child(6) > :nth-child(2)::after {
                                        position: absolute;
                                        top: 100%;
                                        left: 50%;
                                        content: "(прізвище, ім’я, по батькові)";
                                        font-size: 10px;
                                        width: fit-content;
                                        transform: translateX(-50%);
                                    }
                            .PEC_content_main > :nth-child(2) > :nth-child(3),
                            .PEC_content_main > :nth-child(6) > :nth-child(3) {
                                margin-left: 15px;
                                display: inline-block;
                            }
                            .PEC_content_main > :nth-child(5),
                            .PEC_content_main > :nth-child(8) {
                                margin-left: 20px;
                            }
                                .PEC_content_main > :nth-child(5) > div,
                                .PEC_content_main > :nth-child(8) > div {
                                    display: inline-block;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(2),
                                .PEC_content_main > :nth-child(8) > div:nth-child(1),
                                .PEC_content_main > :nth-child(5) > div:nth-child(4),
                                .PEC_content_main > :nth-child(8) > div:nth-child(3),
                                .PEC_content_main > :nth-child(5) > div:nth-child(6),
                                .PEC_content_main > :nth-child(8) > div:nth-child(5),
                                .PEC_content_main > :nth-child(5) > div:nth-child(8),
                                .PEC_content_main > :nth-child(8) > div:nth-child(7) {
                                    position: relative;
                                    margin-left: 6px;
                                    border-bottom: 1px solid black;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(2),
                                .PEC_content_main > :nth-child(8) > div:nth-child(1) {
                                    width: 175px;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(4),
                                .PEC_content_main > :nth-child(8) > div:nth-child(3) {
                                    width: 35px;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(6),
                                .PEC_content_main > :nth-child(8) > div:nth-child(8) {
                                    width: 100px;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(8),
                                .PEC_content_main > :nth-child(8) > div:nth-child(7) {
                                    width: 130px;
                                }
                                .PEC_content_main > :nth-child(5) > div:nth-child(2)::after,
                                .PEC_content_main > :nth-child(5) > div:nth-child(6)::after,
                                .PEC_content_main > :nth-child(5) > div:nth-child(8)::after {
                                    content: attr(data-under);
                                    position: absolute;
                                    top: 100%;
                                    left: 50%;
                                    transform: translateX(-50%);
                                    font-size: 10px;
                                }
            label[for="consSup_CPPD"],
            label[for="consSup_PEC"],
            label[for="consSup_PSC"] {
                position: sticky;
                z-index: 3;

                margin-top: calc(-40px + 7px * var(--scale_1200));
                margin-bottom: calc(8px * var(--scale_1200));

                display: block;

                height: 26px;
                width: 28px;

                transform: scale(var(--scale_1200));
                transform-origin: top left;

                transition: background-image 0.5s ease-in-out, opacity 0.5s ease-in-out;
            }
                    label[for="consSup_CPPD"]::after {
                        content: "";
                        height: 0;
                        width: 0;
                        background-image: url(../img/consumer-support/button_collapse.svg);
                    }
                    input#consSup_CPPD:checked + section > label[for="consSup_CPPD"],
                    input#consSup_PEC:checked + section > label[for="consSup_PEC"],
                    input#consSup_PSC:checked + section > label[for="consSup_PSC"] {
                        opacity: 0.7;
                    }
                    label[for="consSup_CPPD"][data-media="landscape__portrait--PC"],
                    label[for="consSup_PSC"][data-media="landscape__portrait--PC"] {
                        margin-left: calc(315px * var(--scale_1200));
                        top: calc(79px * var(--scale_1200));
                    }
                    label[for="consSup_PEC"][data-media="landscape__portrait--PC"] {
                        margin-left: calc(305px * var(--scale_1200));
                        top: calc(79px * var(--scale_1200));
                    }

                    label[for="consSup_CPPD"][data-media="portrait--mobile"],
                    label[for="consSup_PEC"][data-media="portrait--mobile"],
                    label[for="consSup_PSC"][data-media="portrait--mobile"] {
                        margin-left: calc(10px * var(--scale_1200));
                        top: calc(120px * var(--scale_1200));
                    }
                            label[for="consSup_PEC"][data-media="portrait--mobile"] {
                                margin-left: calc(0px * var(--scale_1200));
                                /* top: calc(79px * var(--scale_1200)); */
                            }
                    label[for="consSup_CPPD"][data-media="pointer--fine"],
                    label[for="consSup_PEC"][data-media="pointer--fine"],
                    label[for="consSup_PSC"][data-media="pointer--fine"] {
                        opacity: 0.4;
                    }
                    label[for="consSup_CPPD"][data-media="pointer--fine"]:hover,
                    label[for="consSup_PEC"][data-media="pointer--fine"]:hover,
                    label[for="consSup_PSC"][data-media="pointer--fine"]:hover {
                        opacity: 1 !important;
                    }
                    label[for="consSup_CPPD"][data-media="pointer--coarse"],
                    label[for="consSup_PEC"][data-media="pointer--coarse"],
                    label[for="consSup_PSC"][data-media="pointer--coarse"] {
                        opacity: 0.7;
                    }
                label[for="consSup_CPPD"] > div,
                label[for="consSup_PEC"] > div,
                label[for="consSup_PSC"] > div {
                    height: 100%;
                    width: 100%;

                    transform: rotate(0deg);
                    transform-origin: center center;

                    background-image: url(../img/consumer-support/button_expand.svg);
                    background-size: cover;
                    background-position: center center;
                    background-repeat: no-repeat;

                    transition: transform 0.5s ease-in-out;
                }
                        input#consSup_CPPD:checked + section > label[for="consSup_CPPD"] > div,
                        input#consSup_PEC:checked + section > label[for="consSup_PEC"] > div,
                        input#consSup_PSC:checked + section > label[for="consSup_PSC"] > div {
                            transform: rotate(180deg);

                            background-image: url(../img/consumer-support/button_collapse.svg);
                        }
            a.pdf-dl {
                position: sticky;
                z-index: 3;

                margin-top: calc(-40px + 6px * var(--scale_1200));
                margin-bottom: calc(4px * var(--scale_1200));

                display: block;

                height: 30px;
                width: 29px;

                transform: scale(var(--scale_1200));
                transform-origin: top left;

                opacity: 0.5;

                background-image: url(../img/consumer-support/button_download-pdf.svg);
                background-size: cover;
                background-position: center center;
                background-repeat: no-repeat;

                transition: opacity 0.5s ease-in-out;
            }
                    a.pdf-dl[data-media="landscape__portrait--PC"] {
                        top: calc(78px * var(--scale_1200));
                        left: calc(50% + 556px * var(--scale_1200));
                    }
                    a.pdf-dl[data-media="portrait--mobile"] {
                        top: calc(119px * var(--scale_1200));;
                        /* right: calc(15px * var(--scale_1200)); */
                        margin-left: calc(560px * var(--scale_1200));
                    }
                    a.pdf-dl[data-media="pointer--fine"]:hover {
                        opacity: 1;
                    }
                    a.pdf-dl[data-media="pointer--coarse"] {
                        opacity: 0.7;
                    }
                    input#consSup_consents + section a.pdf-dl[data-media="landscape__portrait--PC"] {
                        margin-top: calc(-28px - 7px * var(--scale_1200));
                    }
                    input#consSup_consents + section a.pdf-dl[data-media="portrait--mobile"] {
                        margin-top: calc(-28px - 6px * var(--scale_1200));
                    }
                    input#consSup_PEC + section > a.pdf-dl[data-media="portrait--mobile"] {
                        margin-left: calc(550px * var(--scale_1200));
                    }
            main .outer {
            }
                main .inner  {
                    
                }
                    main .inner[data-media="landscape__portrait--PC"] {
                        width: 1200px;
                    }
                    main .inner[data-media="portrait--mobile"] {
                        width: 600px;
                    }
                        main .inner > div {
                            position: relative;

                            font-size: 24px;
                            
                            background-color: var(--color-test);
                        }
                                main .inner > div[data-media="landscape__portrait--PC"] {
                                    margin-left: 310px;
                                    margin-right: 10px;
                                    width: 840px;
                                    padding-left: 20px;
                                    padding-right: 20px;
                                }
                                        main input[name="consSup_consents"] + section .outer[data-media="landscape__portrait--PC"] {
                                            
                                            
                                            max-height: 30vh;
                                            overflow: hidden;

                                            transition: max-height 0.5s ease-in-out;
                                        }
                                        main input[name="consSup_consents"]:checked + section .outer[data-media="landscape__portrait--PC"] {
                                            margin-top: calc(14px * var(--scale_1200));
                                            
                                            height: auto;
                                            max-height: 10000px;
                                            overflow: visible;
                                        }
                                        main input[name="consSup_consents"] + section .outer[data-media="portrait--mobile"] {
                                            max-height: 20vh;
                                            overflow: hidden;

                                            transition: max-height 0.5s ease-in-out;
                                        }
                                        main input[name="consSup_consents"]:checked + section .outer[data-media="portrait--mobile"] {
                                            margin-top: calc(14px * var(--scale_1200));
                                            
                                            height: auto;
                                            max-height: 10000px;
                                            overflow: visible;
                                        }
                                        input#consSup_PEC + section .inner > div[data-media="landscape__portrait--PC"] {
                                            margin-left: 300px;
                                            margin-right: 20px;
                                        }
                                main .inner > div[data-media="portrait--mobile"] {
                                    padding-left: 20px;
                                    padding-right: 20px;
                                    width: calc(100% - 40px);
                                }
                            p.category {
                                text-align: right !important;
                                margin-top: 10px !important;
                                margin-bottom: -10px !important;
                            }
                            main .inner > div p.section_title {
                                font-size: 24px;
                                line-height: 24px;
                                font-weight: bold;
                                color: #4e98b7;
                                text-align: center !important;
                                text-indent: 0 !important;
                            }
                            main .inner > div > p.section_undertitle {
                                margin-top: 0;

                                font-size: 20px;
                                line-height: 20px;
                                color: #4e98b7;
                                text-align: center;
                                text-indent: 0;

                            }
                            main .inner > div > img {
                                margin-top: 20px;
                                margin-left: auto;
                                margin-right: auto;
                                width: 540px;
                                object-fit: cover;
            
                                filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.35));
                            }
                            main .inner > div > p,
                            input#consSup_ToS + section .inner > div p:not(.section_title):not(.section_undertitle),
                            input#consSup_PEC + section p {
                                margin-top: calc(20px * var(--scale_1200));

                                /* display: block; */
            
                                font-size: 20px;
                                line-height: 24px;
                                text-indent: 16px;
                                text-align: left;
                            }
                                    h3 + p {
                                        margin-top: 0 !important;
                                    }
                            h3 {
                                position: relative;
                                left: 50%;
                                transform: translateX(-50%);
                                margin-top: calc(20px * var(--scale_1200));
                                margin-bottom: calc(10px * var(--scale_1200));

                                display: inline-block;

                                font-size: 20px;
                                line-height: 24px;
                                font-weight: bold;
                                color: #4e98b7;
                                text-align: center;
                                text-indent: 0;
                            }
                            main .inner > div ul {
                                list-style-type: none;
                                font-size: 20px;
                                line-height: 24px;
                                text-align: left;
                            }
                                main .inner > div ul > li {
                                    position: relative;
                                    margin-left: 60px;
                                }
                                        main .inner > div ul > li::before {
                                            position: absolute;
                                            top: 0;
                                            left: -14px;
                                            content: "-";
                                        }
                            main .inner > div > ol {
                                list-style-type: none;
                                font-size: 20px;
                                line-height: 24px;
                                text-align: left;

                                
                            }
                                main .inner > div > ol > li {
                                    position: relative;
                                    margin-left: 60px;
            
                                    counter-increment: section;
                                    counter-reset: subsection;
                                }
                                        input#consSup_POA + section .inner > div > ol > li,
                                        input#consSup_CPPD + section .inner > div > ol > li {
                                            margin-left: 0px;
                                        }
                                        input#consSup_ToS + section .inner > div > ol > li {
                                            margin-left: 0px;
                                        }
                                        main .inner > div > ol > li::before, 
                                        input + section h3::before {
                                            position: absolute;
                                            top: 1px;
            
                                            /* left: -22px; */
                                            right: calc(100% + 10px);
                                            text-align: right;
                                            font-size: 18px;
            
                                            content: counter(section) ".";
                                        }
                                                input#consSup_POA + section .inner > div > ol > li::before,
                                                input#consSup_ToS + section .inner > div > ol > li::before,
                                                input#consSup_CPPD + section .inner > div > ol > li::before {
                                                    visibility: hidden;
                                                }
                                    main .inner > div > ol ol {
                                        list-style-type: none;
                                        font-size: 20px;
                                        line-height: 24px;
                                        text-align: left;

                                        counter-reset: subsection2;
                                    }
                                        main .inner > div > ol ol > li {
                                            position: relative;
                                            margin-left: 60px;
                                            
                                            counter-increment: subsection;
                                        }
                                                main .inner > div > ol ol > li::before {
                                                    position: absolute;
                                                    top: 1px;
            
                                                    /* left: -30px; */
                                                    right: calc(100% + 10px);
                                                    text-align: right;
                                                    font-size: 18px;
            
                                                    content: counter(section) "." counter(subsection);
                                                }
                                        main .inner > div > ol ol ol {
                                            list-style-type: none;
                                            font-size: 20px;
                                            line-height: 24px;
                                            text-align: left;
                                        }
                                            main .inner > div > ol ol ol > li {
                                                position: relative;
                                                margin-left: 60px;
                                                
                                                counter-increment: subsection2;
                                            }
                                                    main .inner > div > ol ol ol > li::before {
                                                        position: absolute;
                                                        top: 1px;
            
                                                        /* left: -30px; */
                                                        right: calc(100% + 10px);
                                                        text-align: right;
                                                        font-size: 18px;
            
                                                        content: counter(section) "." counter(subsection) "." counter(subsection2);
                                                    }



    .navbar {
        /* Navbar [[css/navbar.css]] */
    }
    footer {
        /* [[css/footer.css]] */
    }
    .background {
        /* [[css/background.css]] */
    }