﻿/*반응형*/
@media screen and (max-width: 960px) {
    nav {
        display: none;
    }

    .allMenu {
        background-color: #FFF;
        overflow-y: hidden;
    }

        .allMenu.showAll {
            top: 0;
            visibility: visible;
        }

    .allMenu_center.out_center {
        width: 100%;
    }

    .allMenu_logo {
        margin-top: 2.5rem;
        background-image: url(../images/logo_02.png);
        background-repeat: no-repeat;
        margin-left: 1.5rem;
    }
        .allMenu_logo img {
            height: 5rem;
            opacity: 0;
        }

        .allMenu_close {
            position: absolute;
            right: 2.5%;
            top: 3rem;
        }
        .allMenu_close i {
            font-size: 4rem;
            color: var(--cBlack);
        }

    .allMenu_wrap {
        font-size: var(--fs-50);
        -moz-column-gap: clamp(12rem,8vw,16rem);
        column-gap: clamp(12rem, 8vw, 16rem);
    }
        .allMenu_wrap .menu {
            display: flex;
            flex-direction: column;
            row-gap: 2.5rem;
            padding: 2.5rem 5%;
            margin-top: 2rem;
            box-sizing: border-box;
            border-top: 1px solid var(--cGray);
        }

        .allMenu_wrap .menu_depth1 {
            line-height: 1;
            color: var(--cBlack);
            position: relative;
            font-weight: 700;
            font-size: var(--fs-28);
            border-bottom: 1px solid var(--cGray);
            padding-bottom: 2.5rem;
        }

            .allMenu_wrap .menu_depth1 a {
                width: 100%;
                display: block;
                padding: 0 1.5rem;
            }

            .allMenu_wrap .menu_depth1 .sub_menu {
                font-size: var(--fs-22);
                width: 100%;
                margin-top: 1.5rem;
            }

            .allMenu_wrap .menu_depth1 .sub_menu li {
                padding: 1rem 1rem 1rem 1.5rem;
                color: var(--cGray);
                font-weight: 500;
            }

                .allMenu_wrap .menu_depth1 .sub_menu li:hover {
                    color: var(--cBlue);
                }


    .visual_texts {
        top: 70%;
        transform: translate(-50%, -50%);
    }

    .visual_pc {
        display: none !important;
    }

    .visual_mobile {
        display: block !important;
        max-width: none;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }

    /* 메인 - BUSINESS */
    .business_area {
        display: flex;
        flex-direction: column;
        justify-content: center;
        row-gap: 2.5rem;
    }

    .business_area a {
        width: 95%;
        padding: 3rem 0;
        min-height: 8.5rem;
    }

    .site_footer img {
        display: none;
    }

    #btnTop {
        width: 5rem;
        height: 5rem;
    }


    .sub_center {
        padding: 15rem 0rem;
    }

    .tit_area {
        margin-bottom: 5rem;
    }

    .subTit_en {
        visibility: hidden;
        opacity: 0;
        transition: all ease-in-out .3s;
    }

    .tit_area {
        margin: 0 0 5rem 0;
    }

        .tit_area .subTit_desc {
            margin-top: 2.5rem;
            line-height: 1.5;
        }

    .gt_tit {
        line-height: 1.5;
    }

    /*회사연혁 ------------------*/
    .const_img {
        visibility: hidden;
        opacity: 0;
        transition: all ease-in-out .3s;
    }

    .history_area {
        width: 100%;
        margin: 0;
    }

    .history_tab {
        transition: all ease-in-out .3s;
        display: none;
    }

    .history_tab_wrap {
        /*        display: none;*/
        padding: 1.5rem 0;
    }

    .history_tab_link {
        padding: 0rem 0rem;
        margin-right: 1rem;
        transition: all ease-in-out .3s;
    }

    .history_list_cont p:hover {
        font-weight: 400;
        font-size: var(--fs-22);
    }

    .history_list {
        padding-left: 0;
    }

        .history_list > div {
            display: block !important;
            position: relative;
            padding-left: 4rem;
        }

        .history_list .circle {
            top: 0.5rem;
            left: 0.25rem;
        }

            .history_list .circle.first {
                top: 0.2rem;
                left: 0.1rem;
            }

    .history_list_cont p {
        margin: 0 0 1.5rem 3rem;
    }

    .projects_area {
        min-width: 100%;
        max-height: 100%;
        overflow-y: hidden;
    }

    .projects_area .projects_list {
        padding:0;
    }

        .projects_area .projects_list li {
            padding: 1.5rem 2rem 1.5rem 4.5rem;
            line-height: 1.5;
        }

    .demo_list {
        grid-template-columns: repeat(2, 1fr);
        -moz-column-gap: 3.3rem;
        column-gap: 3.3rem;
    }

    .demo_items .new_icon {
        width: 4rem;
        height: 4rem;
        right: -1rem;
        font-size: 1rem;
    }

    .container {
        padding-left: 0rem !important;
    }
}

@media screen and (max-width: 460px) {
    .demo_list {
        grid-template-columns: repeat(1, 1fr);
    }

    .demo_name {
        font-size: 2rem;
    }

    .business_img_area{
        border:0;
    }

    .business_img_area.mobile {
        display: block;
    }

    .business_img_area.pc {
        display: none;
    }

    .business_img_area .img_active {
        display: block !important;
    }

}

@media screen and (min-width: 1400px) {
    .allMenu_wrap {
        font-size: var(--fs-60);
        -moz-column-gap: clamp(18rem,8vw,22rem);
        column-gap: clamp(18rem,8vw,22rem)
    }

    .history_area {
        width: calc(60vw - 5rem);
        min-width: calc(60vw - 5rem);
    }

    .const_img {
        max-width: calc(40% + 30.7rem);
    }
}