/* responsive view */

@media (max-width: 1700px) {
    html {
        font-size: 58.5%;
    }
    .modal-content {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
    }
    body.vegas-container.modal-open {
        overflow-y: hidden !important;
    }

    .overview-inner{
        width: 95%;
    }
}
@media (max-width: 1500px) {
    .footer-inner {
        flex-direction: column;
        gap: 2rem;
    }
    html {
        font-size: 55%;
    }
    .title img {
        max-width: 80%;
    }
    .modal-content  .modal-wrapper {
        flex-direction: column;
        gap: 2rem;
    }
    .modal-content button:not(.add-btn) {
        margin-bottom: 5rem;
    }
    .modal-content .form-group textarea {
        padding: 2rem;
        margin-top: 0;
    }
    .footer-left {
        flex-direction: column;
    }
    .modal-content .modal-right .form-group:not(.txt-box) {
        flex-direction: column;
        width: 100%;
        align-items: flex-start;
        gap: 1rem;
    }
    .footer-left {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem
    }
    .modal-content {
        width: 100%;
        padding: 0 5rem;
    }
    .modal-content  .agree_wrapper {
        flex-direction: column;
        margin-top: 0rem;
    }
    .modal {
        background-position-x: 55%;
    }

    /* Architectural */
    
    .architect .left{
        width: 35%;
    } 
    .architect ul.left-list li{
        flex-direction: column;
        gap: 1rem;
    }

    .architect ul.left-list li b{
        display: block;
    }

    .architect .bottom {   
        justify-content: unset;
        padding-left: 6rem;
    }

    .architect .top .top-box{
        padding: 4rem 6rem;
    }

    .architect .left {
        padding: 7rem 5rem;
    }

    .architect.other .top{
        padding-left: 0;
    } 

    /* overview */

        .swiper.com-slider .swiper-slide img{
        height: auto;
    }
    .com-slider .swiper-slide img{
        padding: 0;
    }

    .swiper.com-slider{
        height: auto;
    }
    
    .swiper.com-slider .swiper-slide{
        height: auto;
    }

}
@media (max-width: 768px) {
    .modal-content {
        width: 100%;
        padding: 0 3rem;
    }
    .title img {
        max-width: 60%;
    }
    .register-btn a {
        top: 70%;
    }
    .modal-content h2 {
        font-size: 18px;
        margin-bottom: 10px;
    }
    .modal-content .modal-heading-box p br {
        display: block;
    }
    .modal-content .modal-heading-box p {
        font-size: 13px;
        line-height: 1.5;
    }
    #overlay-menu .menu-header {
        margin-bottom: 2rem;
    }
    .modal {
        background-position-x: 50%;
    }

    .architect .top .top-box {
        gap: 4rem;
    }
    
    /* overview */

    .bottom-desc {
        width: 95%;
    }
    .bottom-desc br {
        display: none;
    }

    .reveal-line-vertical{
        height: 15rem;
    }

}

    @media (max-width: 768px) {

        

        .architect-container{
            height:auto;
        }
        
        .architect{
            flex-direction: column-reverse;
        }

        .architect .left{
            width: 100%;
            padding: 3rem 6rem 6rem 6rem;
        }

        .architect .right{
            width: 100%;
        }

        .architect .bottom{
            padding: 3rem 6rem;
        }

        .architect ul.left-list li{
            flex-direction: row;
        }

        .architect .left .reveal-wrapper.vertical {
            right: 0;
            top: 0;
            left: 0;
            height: 1px;
            width: 100%;
        }

        .architect .reveal-line.vertical {
            width: 100%;
            height: 1px;
        }

        .architect .left p.main-heading{
            padding-bottom: 1rem;
        }

        .architect ul.left-list li span {
            width: 75%
        }

        .architect .top-box .reveal-wrapper.vertical{
            display: none;
        }

        .architect .reveal-line{
            background: #b2af9e;
        }

        .architect .right p.main-heading{
            padding-bottom: 1rem;
        }
    }

    
    @media (max-width: 480px) {

        .architect{
            padding-bottom: 5rem;
        }

        .architect .bottom{
            padding: 3rem;
        }

        .architect .left{
            padding: 3rem;
        }

        .architect .top .top-box{
            flex-direction: column;
            width: 100%;
            padding: 3rem;
            gap: 2rem;
        }

        .txt-box{
            width: 100%;
        }
        
        .architect .bottom ul.bottom-list li span{
            text-wrap: wrap;
        }

        .architect .bottom ul.bottom-list li b{
            width: 45%;
            font-weight: 700;
        }

        .architect .bottom ul.bottom-list li{
            /* flex-direction: column; */
            gap: 5px;
        }

        .architect .reveal-line.vertical{
            transform: translateX(-100%);
        }

        .architect .bottom ul.bottom-list li span {
            width: 53%;
        }

        .architect ul.left-list li:not(:last-child){
            padding-bottom: 1.2rem;

        }
        
        /* overview */
        .overview-container .txt-box{
        flex-direction: column;
        }
    }
/* End */


@media all and (max-width:1900px) {
    .modal-content button.add-btn {
        width: 42%;
    }
    .modal {
        height: auto;
    }
    .modal-content button:not(.add-btn) {
        margin-bottom: 5rem;
    }
    .facade .con-wrapper.zero{
        padding-left: 0 !important;
    }
    .facade .con-wrapper.zero .txt-box {
        width: 100%;
        width: 80%;
        /* border: 1px solid; */
        margin: 0 auto;
        padding-left: 0rem;
    }

    .facade .con-wrapper.one {
        /* border: 1px solid; */
        /* margin: 0 auto; */
        padding-right: 0rem;
        /* padding-top: 10rem; */
        /* width: 20%; */
        /* border: 1px solid; */
        width: 90%;
        align-items: center;
        display: flex;
        height: 100%;
        /* background: #bbbbbb33; */
    }

    .facade .con-wrapper.one .txt-box {
        width: 100%;
        /* width: 60%; */
        width: 100%;
        /* border: 1px solid; */
        /* margin: 0 auto; */
        /* padding-left: 0rem; */
        /* margin-left: 60%; */
        width: fit-content;
    }
    .brand .sub-inner {
        width: 90%;
        margin: 0 auto;
        gap: 4rem;
    }
    .brand .con-wrapper{
        gap: 10rem;
    }
}

@media all and (max-width:1700px) {
    .modal {
        height: auto;
    }
    #wrap {
        overflow-y: hidden;
    }
    img {
        max-width: 100%;
    }
    .brand .sub-inner {
        width: 90%;
        margin: 0 auto;
        height: auto;
        min-height: auto;
        padding: 7rem 0;
    }
    .brand .con-wrapper {
        gap: 7rem;
        padding-top: 0;
    }
    #overlay-menu ul li a {
        font-size: 6.5rem;
    }
    #overlay-menu {
        position: fixed;
        height: 100vh;
        overflow-y: scroll;
    }
}
@media all and (max-width:1600px) {
    .brand p.sub-desc br{
        display: none;
    }
    .brand .txt-box{
        width: 30%;
    }
}
@media all and (max-width:1024px) {
    .brand .con-wrapper {
        flex-direction: column;
        gap: 3rem;
    }
    .brand .txt-box {
        width: 100%;
        text-align: center;
        padding-bottom: 0;
    }
    .brand .txt-box p.sub-desc br{
        display: block;
    }
    .brand .img-box {
        gap: 0rem;
    }
    .footer-left {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 1rem;
    }
    .location .txt-box {
        right: 5rem;
    }
    .location .sub-inner {
        padding-top: 0;
    }
    .facade .con-wrapper.one {
        /* max-width: 100%; */
        padding: 5rem;
        box-sizing: border-box;
        padding-right: 2rem;
    }
    .facade .con-wrapper.zero {
        padding: 5rem;
        margin-top: -32rem;
        box-sizing: border-box;
    }
    .facade div p.main-heading {
        font-size: 17px;
    }
    .facade p.sub-desc {
        font-size: 11px;
    }
    #overlay-menu ul li a {
        font-size: 4.8rem;
        padding: 4rem;
        line-height: 1;
    }
    #overlay-menu ul li:last-child a {
        text-align: left;
        font-size: 5rem;
    }
    #overlay-menu ul li a span {
        font-size: 3.5rem;
        padding-right: 1rem;
    }
    .location .txt-box {
        right: 0;
        width: 100%;
        text-align: center;
        /* left: 50%; */
        /* right: 50%; */
        padding: 0 4rem;
    }
    .location .map-wrapper {
        position: relative;
        height: 70rem;
    }
    .location .map-img {
        width: 100%;
    }
    .location .map-img {
        object-fit: cover;
    }
    .brand .txt-box img{
        width: 8rem;
    }
}
@media (max-width: 768px) {
    .modal-content .modal-heading-box img {
        width: 10rem;
    }
    
    #overlay-menu {
        overflow-y: hidden;
    }

    #overlay-menu .menu-footer span {
        font-size: 11px;
        margin: 3rem 0;
    }
    #overlay-menu ul li a span {
        font-size: 2.5rem;
    }
    #overlay-menu li {
        border-bottom: 1px solid #ffffff00;
    }
    p.sub-desc p br {
        display: none;
    }
    p.sub-desc {
        font-size: 13px;
    }
    .modal-content .modal-content label:not(.agree_wrapper label){
        margin-top: 0;
        font-size: 14px;
    }
    .modal-content .modal-content .form-group textarea{
        margin-top: 0;
    }
    .facade .con-wrapper.zero .txt-box {
        width: 90%;
        padding-left: 3rem;
    }
}

@media all and (max-width:2000px) and (min-width:1921px){
    .location .map-img{
        width: 100%;
    }
}
@media all and (max-width:1400px) {
    /* .location .marker .dot{
        margin-right: 2rem;
    } */
    .location .marker{
        padding-right: 3rem;
        max-width:80%;
    }
    .location .marker .label img{
        max-width: 80%
    }
}

@media all and (max-width:920px) {

    .location  .marker{
        padding-right: 9rem;
        padding-top: 0.5rem;
    }
}

@media all and (max-width:500px) {

    .location  .marker .dot {
        margin-right: 0rem;
    }
    #overlay-menu .menu-footer span {
        opacity: 1;
        font-size: 10px;
        color: #ffffff4a;
    }
    #overlay-menu ul li a {
        font-size: 3.5rem;
        padding: 3rem;
        height: 10rem;
        display: flex;
        align-items: baseline;
        justify-content: start;
        letter-spacing: -0.15rem;
        text-wrap: nowrap;
    }
    #overlay-menu ul li:last-child a {
        font-size: 3rem;
    }
    .modal-content button.add-btn {
        width: 50%;
    }
    .facade div p.main-heading {
        font-size: 16px;
    }
    .footer-left {
        gap: 0.5rem;
    }
    .location .marker .label img {
        max-width:60%;
    }
    .location .map-wrapper {
        position: relative;
        height: 65rem;
    }
    .location .marker .label {
        margin-top: 5px;
    }
    .location .marker .dot {
        width: 8px;
        height: 8px;
    }
    .modal-content.agree_wrapper {
        margin-top: 0rem;
    }
    .modal-content.agree_wrapper label{
        padding-bottom: 0;
    }
    .modal-content.con-wrapper.zero {
        padding: 0rem;
        margin-top: -34rem;
    }
    .modal-content .form-group:not(.last){
        margin-bottom: 1rem;
    }
    .modal-content .agree_wrapper label{
        padding-bottom: 0;
    }
    .modal-content label:not(.agree_wrapper label){
        font-size: 14.5px;
        font-weight: 500;
        letter-spacing: -0.01rem;
    }
    .modal-content .radio-group{
        gap:1rem
    }
}


@media (max-width: 850px) {

    /* 개요 수정 */
    .overview-container .top-wrapper .overview-inner{
        flex-direction: column;
    }

    .top-wrapper {
    padding-top: 5rem;
    }

    .overview-container .txt-box{
        width: 95%;
        margin: 0 auto;
    }
    
    .table-basic{
        margin: 0 auto;
        width: 95%;
        text-align: center;
    }

    
    .table-basic table th{
        padding: 1rem;
    }

    .table-basic table td{
        padding: 1rem;
    }

    .overview-inner.bottom p.main-heading{
        font-size: 2.5rem;
    }
}


@media screen and (max-width: 768px) {
    .vegas-slide.custom-mobile-adjust {
        background-position: center top !important;
        background-size: cover !important;
    }
}