@media screen and (max-width:1180px) {
    :root {
    /* color */
    --mainColor:#2572ff;
    --subColor:#333;
    --white:#fbfbfb;
    --gray-shadow:6px 9px 10px 1px rgba(69,69,69,0.2);
    --blue-shadow:6px 9px 10px 1px rgba(59,128,255,0.1);

    /* font */
    --font-title:3.5rem;
    --font-subtit-l:3rem;
    --font-subtit-m:2.5rem;
    --font-keyword:2rem;
    --font-keyword-txt:2rem;
    --font-botton:2.5rem;
    --font-text:1.8rem;

    /* line-height */
    --font-text-xl-h:3rem;
    --font-text-l-h:2.8rem;
    --font-text-m-h:2.6rem;

    /* wrap */
    --wrap-l:95vw;
    --wrap-m:90vw;
    --wrap-s:85vw;
    --wrap-xs:80vw;

    /* padding */
    --basic-padding: 10px
    }

    /* mobile none */
    .gnb {display: none;}
    .moving {display: none;}
    .item .item-icon {display: none;}
    .text-box::after {display: none;}
    .item_circle {display: none;}
    .item-cover {display: none;}
    .item_line1, .item_line2 {display: none;}
    .year-wrap.right .year .line {display: none;}
    .portfolioButton::before{display: none;}
    .bus-info {display: none;}
    .walk-info {display: none;}
    .c5 {display: none;}
    .paydo_360 {display: none;}
    .top {display: none;}
    .load01 {display: none;}
    .load02 {display: none;}
    .load02_01 {display: none;}
    .cursor, .cursor-circle1 {display: none;}
    .item_circle {display: none;}

    /* main */
    .mainVOD {width: 100vw;height: auto;}
    .mainSlider {height: auto;}

    /* about */
    .about-wrap {width: 100%;height: auto;word-break: keep-all;}
    .about-title{width: 100%;height: auto;}
    .business-wrap {width: 100%;height: auto;display: flex;flex-direction: row;align-items: flex-start;flex-wrap: wrap;margin-top: 15px;}
    .business-item {width:calc(100%/3 - 20px);height: 100%;}
    .item {width: 100%;height: auto;margin: 0 auto;padding: 10px;background: var(--white);color: var(--mainColor);display: flex;border-radius: 20px;box-shadow: none;flex-direction: column;box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.1)}
    .items {position: static;margin-left:0;}
    .items li {position: static;padding: 0;box-shadow:none;border-radius: 0px;white-space: nowrap;background: var(--white);display: block;opacity: 1;color: var(--subColor);}
    .item_text {white-space: nowrap;position: static;}
    .text-box {width: 100%;height: 100%;position: relative;display: inline;font-family: 'scd4';}
    .item-box {width: 100%;}
    .client-wrap {height: auto;margin-top: 25px;padding: 15px 0;border-radius: 25px;}
    .img-wrap {width: 100%;display: flex;justify-content: center;padding: 15px;}
    .clientImg {width: calc(100%/3);height: auto;margin-bottom: 15px;margin-top: 0;margin-right: 0px;box-shadow: 1px 1px 5px 1px rgba(61,61,61,0.1);}
    .clientImg img {width: 100%;height: auto;}
    .history-wrap {width: 95%;height: auto;margin: 50px auto;border-radius: 50px;background: #fff;box-shadow:var(--blue-shadow)}
    .paydotext-wrap {width: 100%;height: auto;background: var(--mainColor);padding: 15px 0;border-radius: 45px 45px 0 0;}
    .history-title {width: 90%;height: auto;padding: 10px 0;margin: 0 auto;letter-spacing: 3px;}
    .icon{width: 30px;height: 30px;background: url(../img/icon_history.png);background-size: cover;margin: auto 15px;}
    .historytext-wrap {width: 95%;height: auto;margin: 70px auto;}
    .year {position: relative;display: inline-block;}
    .year .bullet {width: 10px;height: 10px;display: block;position: absolute;background-color: var(--mainColor);top: -8px;right: -8px;}
    .year-wrap {width: 95%;margin: 15px auto;}
    .year-wrap .line {display: none}
    .year-wrap.right {text-align: left;}
    .history-box {width: 100%;margin-left: 0;line-height: 30px;word-break:keep-all;}
    .history-box li {display: flex;flex-direction:row;align-items: flex-start;align-items: flex-start;line-height: var(--font-text-m-h);}
    .m-bullet {width: 5px;height: 5px;display: inline-block;background-color: var(--mainColor);margin-right: 5px;margin-top: 7px;}
    .historyMore {width: auto;height: auto;line-height: 45px;position:static;margin: 15px auto;padding: 5px 35px;}
    .historyMore.Blue{background: #fff;border-radius: 40px;transition: all .3s linear;color: var(--subColor);border: 1px solid var(--subColor);box-shadow: 3px 4px 0px 0px var(--subColor);}

    /* portfolio */
    .portfolio-wrap {width:100%;height:auto;padding-top: 0px;}
    .portfolio_page {width: 100%;height: auto;}
    .video_slider {width: 100%;height: auto;}
    .videoInfo-box {display:block;}
    .videoInfo {width:100%;height:40%;position:absolute;top:60%;left:0;background-color:rgba(0,0,0,0.8);text-align:center;color:#fff;display:flex;align-content:center;align-items:center;justify-content:center;}
    .pfvideo {width:45%;height: auto;border-radius: 10px;}
    .portfolioButton:hover::before {width: 100%;left: 0;}
    .portfolioButton {width: 100%;height: auto;line-height: 45px;position:static;margin: 15px auto;display: block;padding: 5px 25px;}

    /* contactUs */
    .contact-wrap {width: 100%;height: auto;padding-top: 50px;}
    .contact_txt .title {color:#616161;font-family: 'gmsb';position: relative;display: inline-block;background: url(../img/fill.svg) repeat-x;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
    .contact_txt .title .bullet {top: -50px;right: -20px;}
    .contact_txt span {display: block;margin-top: 50px;margin-bottom: 60px;line-height: 40px;word-break:keep-all;}
    .map-wrap{width: 85%;height:auto;display: flex;background-color: var(--white);position: relative;z-index: 3;flex-direction: column;
    box-shadow: 3px 3px 10px 1px rgba(69,69,69,0.1);border-radius: 0;}
    .paydo-map {width: 100%;height: auto;overflow: hidden;border-radius:0;}
    .paydo-map-base {background-size: cover;}
    .info-wrap {width:100%;height: auto;align-items: stretch;padding: 25px 0;}
    .info_title {padding-top: 0px;padding-bottom: 10px;}
    .info_bold {width:23%;text-align: right;margin-right: 3%;}
    .info_txt {width:60%;word-break: keep-all;}
    .icon-box {width: 95%;justify-content: center;}
    .bus-icon,.walk-icon {width:auto;border-radius: 40px;display: flex;justify-content: center;align-items: center;align-content: center;background-color: var(--subColor);z-index: 5;margin-right: 20px;}
    .info-box {width: 95%;height: auto;}
    .InfoImg {width: 100%;}
    .bus-icon:hover {background-color: var(--subColor);}
    .walk-icon:hover {background-color: var(--subColor);}
    .bus-icon.active {background-color: var(--mainColor);}
    .walk-icon.active {background-color: var(--mainColor);}

    #footer {width: 100%;height: 150px;margin-top: 50px;}
    #footer .logo {width: 30% !important;margin-right: 0;}
    #footer .info {width:70%;font-size: var(--font-text)}
    .mobile_map .root_daum_roughmap {width:100%!important;}
    .map-obj{position:absolute;top:0px;left:0px;width: 100%;height:100%;}
    }

@media screen and (max-width:600px) {
    nav {height:60px}
    nav .logo {width: 40px;height: 40px;background: url(../img/logo-m.svg) no-repeat center;background-size: contain;}
    .business-item {width: 85%;margin: 0 auto;}
    .item {width: 100%;margin-top: 15px;}
    .items {display: flex; flex-wrap: wrap;align-content: center;justify-content: center;}
    .items li {margin: 10px 12px 0 0 ;}
    .item_text {white-space: nowrap;position: static;}
    .text-box {width: 100%;height: 100%;position: relative;display: inline-block;}
    .clientImg {width:calc((100% / 2 - 10px));margin-right: 10px;}
    .clientMore,.clientMore.active, .clientMore.active.Blue, .clientMore.Blue  {
        width:40px;height:40px;border-width:0px;box-shadow: 3px 4px 0px 0px var(--subColor);border: 1px solid var(--subColor);line-height: 45px;text-align:center;color: var(--subColor);transition: all .3s linear;border-radius: 15px;}
    .client-wrap {padding: 5px 0;}
    .history-title {font-size: 22px;}
    .historyMore {line-height: 40px;position:static;margin: 15px auto;}
    .historyMore,.historyMore.active, .historyMore.active.Blue, .historyMore.Blue  {
        box-shadow: 3px 4px 0px 0px var(--subColor);border: 1px solid var(--subColor);line-height: 45px;text-align:center;color: var(--subColor);transition: all .3s linear;border-radius: 30px;background-color: #fbfbfb;}
    .portfolioButton {width: 100%;height: auto;line-height: 40px;position:static;margin: 15px auto;display: block;padding: 5px 25px;}
    .pfvideo {width: 80%;}
    .contact_txt span {width: 80%;margin: 20px auto;line-height: 30px;}
    .info_bold {width:20%;text-align: right;margin-right: 3%;}
    .info_txt {width:67%;word-break: keep-all;}
    .bus, .walk {width: 35px;height: 35px;}
    .icon-box {flex-direction: column;}
    .bus-icon {margin-bottom: 10px;}
    .history-wrap {border-radius: 30px;background: none;}
    .paydotext-wrap {border-radius: 30px 30px 0 0;}
    .contact_txt .title .bullet {top: -30px;right: -20px;}
    #footer .logo {width: 40%;}
    #footer .info {font-size: 10px}
    }
    
@media screen and (max-width:280px) {
    :root {
    /* font */
    --font-title:3rem;
    --font-subtit-l:2.5rem;
    --font-subtit-m:2rem;
    --font-keyword:1.8rem;
    --font-keyword-txt:1.8rem;
    --font-botton:1.8rem;
    --font-text:1.5rem;
    }
    
    .items li {margin: 5px 9px 0 0;}
    .history-title {font-size: 14.5px;}
    .videoInfo {height: 50%;top: 50%;}

    #footer {height: auto; padding: 10px 15px;}
    #footer .logo {height: 10vh;margin-right:0}
    }

@media all and (max-height:450px) and (orientation:landscape){
    nav {height: 50px;}
    nav .logo {width: 40px;height: 40px;background: url(../img/logo-m.svg) no-repeat center;background-size: contain;}
    
    /* main */
    .mainVOD {width: 100%;height:calc(100vh - 75px);}
    .mainSlider {height: auto;}
    }