

/* Start:/local/templates/gtech2022/components/bitrix/news.detail/case/style.css?175872491210920*/
.portfolio_detail_wrap{

}
    .portfolio_detail_header{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;

        width: calc(100% - 100px);
        padding: 0 50px;
    }
        .portfolio_detail_header__title{
            position: relative;

            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-items: center;
            justify-content: flex-start;

            height: 50%;
        }
            .portfolio_detail_header__title div:first-of-type{
                width: 60%;

                font-weight: 500;
                font-size: calc(100vw/55);
                text-transform: uppercase;

                z-index: 10;
            }
            .portfolio_detail_header__title div:last-of-type{
                position: absolute;
                top: 10%;
                left: -10%;

                height: 80%;
                width: 20%;
                background: var(--main-color-red75);

                transform: skew(-25deg);
            }
        .portfolio_detail_header_data{
            position: relative;

            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-items: flex-end;
            justify-content: space-between;

            height: 50%;
            padding: 0 0 20px 0;

            text-transform: uppercase;
            font-weight: 300;
        }
            .portfolio_detail_header_data div:first-of-type{
                display: flex;
                flex-direction: row;
                flex-wrap: nowrap;
                align-items: flex-end;
                justify-content: flex-start;
            }
                .portfolio_detail_header_data div:first-of-type div:first-of-type{
                    font-weight: bold;
                    margin-right: 30px;
                }
                .portfolio_detail_header_data div:first-of-type div:last-of-type{
                    opacity: 0.9;
                }
            .portfolio_detail_header_data div:last-of-type{
                opacity: 0.9;
            }

    .portfolio_detail_target{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;

        width: 100vw;
        height: auto;

        margin: 0;
    }
        .portfolio_detail_target_img{
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;
            justify-content: center;

            width: 30%;
        }
            .portfolio_detail_target_img > img{
                width: 100%;
                height: auto;
            }
        .portfolio_detail_target_info{
            width: 70%;
        }
    .portfolio_detail_text{

    }
        .portfolio_detail_screenshots{
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: flex-start;
        }
            .portfolio_detail_screenshots > img{
                width: calc(25vw - 20px);
                height: auto;
                margin-bottom: 20px;
            }
                /*.portfolio_detail_screenshots > img:nth-of-type(2),
                .portfolio_detail_screenshots > img:nth-of-type(4),
                .portfolio_detail_screenshots > img:nth-of-type(5),
                .portfolio_detail_screenshots > img:nth-of-type(7),
                .portfolio_detail_screenshots > img:nth-of-type(10),
                .portfolio_detail_screenshots > img:nth-of-type(12),
                .portfolio_detail_screenshots > img:nth-of-type(13),
                .portfolio_detail_screenshots > img:nth-of-type(15){
                    margin-top: 20px;
                }*/
                .portfolio_detail_screenshots > img:nth-of-type(2n){
                    margin-top: 100px;
                }
        .portfolio_detail_text img.portfolio_detail_text_image{
            width: 100%;
            height: auto;
        }
    .portfolio_links{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;

        padding: 0 50px 50px 75px;
    }
        .portfolio_links_item{
            display: flex;
            align-items: center;
            justify-content: center;

            border-radius: var(--main-borderradius10);
            border: solid 1px;
            padding: 10px 20px;
            margin: 0 0 0 25px;
        }
            .portfolio_links_item a{
                text-decoration: none;
                color: var(--main-color-dark);
            }
            .portfolio_links_item:not(:first-of-type){
                margin-left: 10px;
            }
            .portfolio_links_item img{
                width: 15px;
                height: auto;
                margin-right: 5px;
            }

    .portfolio_review{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;

        width: calc(100vw - 17px);
        margin: 50px 0 75px 0;
    }
        .portfolio_review_blocktitle{
            display: flex;
            justify-content: flex-end;
            align-items: center;

            width: 285px;
            height: 70px;
            margin-left: -30px;
            transform: skew(-30deg);

            background-color: var(--main-color-red);
        }
            .portfolio_review_blocktitle div{
                transform: skew(30deg);
                margin-right: 30px;

                font-size: 20px;
                font-weight: normal;
                text-transform: uppercase;
                color: var(--main-color-white);
            }
        .portfolio_review_info{
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: space-between;
            align-items: flex-start;

            margin: 40px 0 0 0;
        }
            .portfolio_review_info_left{
                width: calc(60vw - 100px - 25px);
                margin: 0 0 0 100px;
            }
                .portfolio_review_info_firsttitle{
                    font-weight: 300;
                    font-size: 28px;
                    text-transform: uppercase;
                }
                .portfolio_review_info_secondtitle{
                    font-weight: bold;
                    font-size: 16px;
                    text-transform: uppercase;
                }
                .portfolio_review_info_text{
                    padding: 20px 0 0 0;
                    font-size: 20px;
                }
            .portfolio_review_info_right{
                width: calc(40vw - 75px - 25px);
                margin: 0 75px 0 0;
            }
                .portfolio_review_info_right img{
                    width: 100%;
                    height: auto;
                }

/* Общий стиль для всех текстовых блоков с заголовком такого типа */
.project_block_wrap{
    padding: 75px 75px 75px 100px;
}
    .project_block_title_wrap{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-end;

        position: relative;
    }
        .project_block_title_wrap > div:first-of-type{
            font-weight: bold;
            font-size: 18px;
            text-transform: uppercase;
        }
        .project_block_title_wrap > div:last-of-type{
            font-weight: 300;
            font-size: 24px;
            text-transform: uppercase;
            margin: 0 0 -2px 5px;
        }
        .project_block_title_wrap:before{
            content: '';

            position: absolute;
            top: 4px;
            left: -25px;

            width: 12px;
            height: 20px;
            transform: skew(-20deg);

            background-color: var(--main-color-red);
        }
    .project_block_text{
        margin: 20px 0 0 0;
        font-size: 20px;
    }

@media screen and (max-width: 949px){
    .portfolio_detail_header{
        justify-content: space-between;
        padding: 0 0px;
        width: calc(100% - 0px);
    }
    .portfolio_detail_header__title div:first-of-type{
        width: 80%;
        font-size: calc(100vw/20);
        padding: 0 20px;
    }
    .portfolio_detail_header__title div:last-of-type{
        left: -15%;
        width: 40%;
    }
    .portfolio_detail_header_data{
        align-items: center;
        justify-content: space-between;

        height: 20%;
        padding: 0 20px;

        background: var(--main-color-dark50);
    }

    .portfolio_detail_target_info{
        width: calc(100% - 80px);
        background-color: var(--main-color-gray);
    }
    .project_block_wrap{
        padding: 30px 30px 30px 50px;
    }

    .portfolio_detail_screenshots > img{
        width: calc(50vw - 10px);
        height: auto;
        margin-bottom: 0px;
    }
        .portfolio_detail_screenshots > img:nth-of-type(2),
        .portfolio_detail_screenshots > img:nth-of-type(4),
        .portfolio_detail_screenshots > img:nth-of-type(5),
        .portfolio_detail_screenshots > img:nth-of-type(7),
        .portfolio_detail_screenshots > img:nth-of-type(10),
        .portfolio_detail_screenshots > img:nth-of-type(12),
        .portfolio_detail_screenshots > img:nth-of-type(13),
        .portfolio_detail_screenshots > img:nth-of-type(15){
            margin-top: 0px;
        }
        .portfolio_detail_screenshots > img:nth-of-type(2n){
            margin-top: 20px;
        }

    .portfolio_links_item{
        margin: 0px;
        padding: 10px 15px;
    }
    .portfolio_links{
        padding: 0 30px 30px 50px;
    }
    .portfolio_review{
        width: 100%;
        margin: 50px 0 50px 0;
        padding: 0 0 50px 0;
        background-color: var(--main-color-gray);
    }
        .portfolio_review_blocktitle{
            width: 240px;
            height: 60px;
            margin-left: -20px;
            margin-top: -20px;
        }
            .portfolio_review_blocktitle div{
                font-size: 18px;
            }
        .portfolio_review_info_left{
            width: calc(100vw - 80px);
            margin: 0 0 0 50px;
        }
            .portfolio_review_info_firsttitle{
                display: flex;
                flex-direction: row;
                flex-wrap: nowrap;
                align-items: flex-start;
            }
                .portfolio_review_info_firsttitle div:first-of-type{
                    width: 70%;
                }
                .portfolio_review_info_firsttitle div:last-of-type{
                    width: 30%;
                }
                    .portfolio_review_info_firsttitle div:last-of-type img{
                        width: 100%;
                    }
            .portfolio_review_info_secondtitle{
                width: 70%;
            }
}
/* End */
/* /local/templates/gtech2022/components/bitrix/news.detail/case/style.css?175872491210920 */
