@charset "utf-8";

.m-history-wrap {
  display: none;
}

/* PC이하 */

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

  /* 개인정보처리방침 */
  .pp-wrap {
    padding-top: 120px;
  }

  /* 포트폴리오 모바일 웹 */
  .pfmw-list-wrap .pf-list {
    width: 32.3%;
  }

  .pfmw-list-wrap .pf-list .pf-title {
    font-size: 1.2em;
    margin-top: 10px;
  }

  .pfmw-list-wrap .pf-list .pf-link {
    margin-top: 5px;
  }

  /* QR CODE */
  .pf-list-layer {
    padding-top: 30%;
  }

  /* 히스토리 */
  .history-sec01 {
    text-align: center;
    padding: 75px 0 95px;
  }

  .history-left-side,
  .history-right-side {
    width: 49%;
  }

  .history-info-wrap .animated {
    /* opacity: 1; */
  }

  .history-right-side .history-info-wrap::before {
    width: 25px;
  }

  .history-left-side .history-info-wrap::before {
    width: 25px;
  }

  .history-info-wrap .history-info-list>p {
    word-break: keep-all;
  }

  .history-info-wrap .history-info-years,
  .history-info-wrap .history-info-list {
    display: block;
  }

  .history-info-wrap .history-info-years {
    margin-bottom: 20px;
  }

  .history-info-wrap .history-info-list {
    margin-left: 0;
    margin-bottom: 15px;
  }

  .history-info-img {
    width: 300px;
  }

  /* 찾아오시는 길 */
  .location-info-wrap {
    width: 100%;
  }

  .location-info01,
  .location-info02 {
    width: 49%;
    padding: 0 20px;
  }

  /* 견적문의 */
  .inquiry-wrap .inquiry-grid {
    width: 100%;
  }

  .inquiry-wrap .s-wrap {
    display: inline-flex;
    margin-top: 25px;
  }

  /* 견적문의 */
  .inquiry-wrap .radio-wrap {
    margin-bottom: 30px;
  }

  .inquiry-wrap .radio-wrap li {
    width: 49% !important;
    display: inline-block;
    padding: 25px 15px;
  }

  .inquiry-wrap .input-wrap {
    margin-bottom: 30px;
  }

  .inquiry-wrap .input-wrap li>div {
    width: 100%;
    display: block;
  }

  .inquiry-wrap .cb-wrap li {
    width: 49%;
    display: inline-block;
    margin-top: .5%;
  }

  .inquiry-wrap .attach-file-wrap .upload-tit {
    display: none;
  }

  .inquiry-wrap .attach-file-wrap>div {
    width: 100%;
  }

  .inquiry-wrap .contact-cont {
    margin-bottom: 10px;
  }

  .inquiry-wrap .attach-file-wrap .fileBox .fileName {
    width: 74%;
  }

  .inquiry-wrap .attach-file-wrap .fileBox .btn_file {
    width: 21%;
  }

  .inquiry-wrap .p-info-wrap {
    padding: 40px 20px;
  }

  .inquiry-wrap .p-info-wrap .p-info {
    margin-bottom: 20px;
  }

  .inquiry-wrap .p-info-wrap .p-info-tit {
    font-size: 1.1em;
  }

  .inquiry-wrap .p-info-wrap .agree-btn-wrap .agree-btn {
    font-size: 1em;
  }

  .inquiry-wrap .submit-btn .motion-linker {
    width: 220px;
  }

  .inquiry-wrap .radio-wrap li:last-child {
    width: 100%;
  }

  /* 리쿠르트 */
  .recruit-wrap .recruit-grid {
    width: 100%;
  }

  .recruit-wrap .cb-wrap li {
    width: 32.9%;
    margin: .3% .1%;
  }

  .recruit-wrap .attach-file-wrap .fileBox .fileName {
    width: 84%;
  }

  .recruit-wrap .p-info-wrap {
    padding: 50px 45px;
  }

  /* 웹호스팅 및 유지보수 */
  .support02-wrap .support02-sec01>li:first-child {
    padding: 0 100px;
  }

  .support02-wrap .support02-sec01>li:last-child {
    padding: 0;
  }

  .support02-wrap .support02-sec01>li .support02-sec01-con {
    width: 100%;
  }

  .support02-wrap .support02-sec02>li {
    width: 47%;
    margin: 12.5px;
  }

  .support02-wrap .inner2 {
    width: auto !important;
    padding-left: 3.90625% !important;
    padding-right: 3.90625% !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    background-color: #fafafa;
  }

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 11%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 77%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title>div {
    font-size: 1.5em;
  }

  .support03-wrap .contract-list-wrap .contract-list .date {
    width: 11%;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.new {
    font-size: 1em;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.open {
    font-size: 1em;
  }

  /* 서비스 */
  .hub-pms-wrap {
    padding: 80px 0;
  }

  .hub-pms-wrap .hub-pms-list .hub-pms-sub {
    margin-left: 0;
    width: 100%;
  }

  .hub-pms-wrap .hub-pms-list {
    height: 170px;
  }

  #hub-pms,
  #web-standard,
  #ci {
    top: -70px !important;
  }

  .designhub-txt {
    display: none;
  }

  /* 포트폴리오 */
  .container-inner {
    width: 100%;
    width: auto;
    margin-left: 3.90625%;
    margin-right: 3.90625%;
    padding-top: 120px;
  }

  .pf-list-wrap .pf-list {
    margin-bottom: 25px;
    margin-top: 0;
  }

  .pf-list-wrap .pf-list .pf-thumb {
    height: auto;
  }

  .pf-list-wrap .pf-list .pf-title {
    font-size: 1.2em;
    margin-top: 10px;
  }

  .pf-list-wrap .pf-list .pf-link {
    margin-top: 5px;
  }

  /* 블로그 */
  .news02-wrap .blog-list-wrap .item {
    width: 48%;
  }

  /* 케이스 스터디 */
  .case-inner {
    width: 100%;
    width: auto;
    margin-left: 3.90625%;
    margin-right: 3.90625%;
    /* padding-top: 120px; */
  }

  .case-study-wrap {
    padding: 120px 0 75px;
    width: 100%;
    width: auto;
    margin-left: 3.90625%;
    margin-right: 3.90625%;
  }

  .case-study-wrap ul .case-list {
    display: inline-block;
    width: 48%;
    margin: 1%;
  }

  .case-study-wrap ul .case-list .tit {
    font-size: 15px;
  }

  .case-study-wrap ul .case-list .date {
    font-size: 13px;
  }

  .case_top {
    padding: 115px 0 25px 0;
  }

  .case_view_tit {
    padding-top: 80px;
    padding-bottom: 35px;
    height: auto;
  }

  .case_btn .next {
    padding-right: 45px;
  }

  .case_btn .prev {
    padding-left: 45px;
  }

  .case_btn span {
    font-size: 1em;
  }

  .case_btn em {
    font-size: 1.14em;
  }

  .case_btn button {
    height: 50px;
  }

  .case_btn button::after {
    width: 30px;
    height: 30px;
    background-size: 60px auto;
    margin-top: -15px;
  }

  .case_btn .next::after {
    background-position: -30px 0;
  }

  .case_btn .list {
    width: 50px;
    height: 50px;
    margin-left: -25px;
    /* margin-top: 25px; */
  }

  .case_btn {
    margin-top: 35px;
  }

  /* 게시판 뷰 */
  .news-view-wrap {
    width: auto;
    margin-left: 3.90625%;
    margin-right: 3.90625%;
  }

  /* 뉴스 */
  .news01-wrap .news-board-wrap .news-board-list .title {
    width: 72%;
    font-size: 1.3em;
  }

  /* 블로그 & 갤러리 */
  .news02-wrap,
  .news03-wrap,
  .case-wrap {
    width: auto;
    margin-left: 3.90625%;
    margin-right: 3.90625%;
  }

  .news02-wrap .blog-list-wrap .item,
  .news03-wrap .blog-list-wrap .item,
  .case-wrap .blog-list-wrap .item {
    width: 47.7%;
  }

  .news02-wrap .blog-list-wrap .item .blog-thumb,
  .news03-wrap .blog-list-wrap .item .blog-thumb,
  .case-wrap .blog-list-wrap .item .blog-thumb {
    width: 100%;
    overflow: hidden;
  }

  .news02-wrap .blog-list-wrap .item .blog-thumb img,
  .news03-wrap .blog-list-wrap .item .blog-thumb img,
  .case-wrap .blog-list-wrap .item .blog-thumb img {
    width: 100%;
    height: auto;
  }
}

/* 타블렛 세로 */

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

  /* 타이틀 & 서브 타이틀 */
  .news01-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .news01-wrap .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .news02-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .news02-wrap .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .about01-sec01 .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .about01-sec01 .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .about01-sec02 .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .about01-sec02 .sec-sub {
    font-size: 1.2em;
  }

  .about01-sec03 .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .about01-sec03 .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .faq-sec {
    padding: 50px 0 75px;
  }

  .faq-sec .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .faq-sec .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .faq-tab {
    gap: 6px;
    margin-bottom: 30px;
  }

  .faq-tab li {
    padding: 8px 16px;
    font-size: 13px;
  }

  .faq-sec .faq-q {
    font-size: 16px;
    padding-left: 20px;
    padding-right: 50px;
    gap: 10px;
  }

  .faq-sec .faq-a {
    font-size: 14px;
    padding-left: 20px;
    padding-right: 50px;
    gap: 10px;
  }

  .faq-sec .faq-icon img {
    width: 20px;
  }

  .history-sec01 .sec-tit {
    font-size: 2em;
  }

  .about04-sec01 .sec-tit {
    font-size: 2em;
    margin-bottom: 70px;
  }

  .location-info-list {
    margin-bottom: 20px;
  }

  .location-info-list h1 {
    font-weight: 500;
    font-size: 1.3em;
    margin-bottom: 5px;
  }

  .location-info-list p {
    font-size: 1em;
    word-break: keep-all;
  }

  .inquiry-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 45px;
  }

  .recruit-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 45px;
  }

  .support02-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .support02-wrap .sec-sub {
    font-size: 1.2em;
    margin-bottom: 45px;
  }

  .support03-wrap .sec-tit {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .support03-wrap .sec-sub {
    font-size: 1.2em;
    margin-bottom: 30px;
  }

  .title-wrap .title {
    font-size: 2em;
    margin-bottom: 20px;
  }

  .title-wrap .sub-title {
    font-size: 1.2em;
    margin-bottom: 30px;
    margin-top: 0;
    word-break: keep-all;
  }

  /* 서브비주얼 */
  .sub-banner-wrap .sub-banner {
    background-size: cover;
    background-attachment: inherit;
  }

  .sub-banner-wrap .page-name {
    opacity: 1;
    font-size: 1.6em;
    margin-bottom: 12px;
  }

  .sub-banner-wrap .page-sub-tit {
    opacity: 1;
    font-size: 2em;
  }

  /* 뉴스 */
  .news01-wrap {
    padding: 45px 0 85px;
  }

  /* 블로그 */
  .news02-wrap {
    padding: 45px 0 85px;
  }

  .news02-wrap .sec-sub {
    margin-bottom: 100px;
  }

  .news02-wrap .blog-list-wrap .item {
    /* width: 31%; */
    margin: 0 1%;
    opacity: 1;
  }

  .news02-wrap .blog-list-wrap .item .title {
    margin: 10px 0 5px;
    font-size: 1.1em;
  }

  /* 어바웃컴퍼니 */
  .about01-sec01 {
    padding: 45px 0 85px 0;
  }

  .about01-sec01 .prod-process {
    margin: 0 1%;
    padding-top: 20px;
  }

  .about01-sec01 .prod-process h1 {
    font-size: 1.5em;
  }

  .about01-sec01 .prod-process-icon {
    width: 80px;
    margin: auto;
  }

  .about01-sec01 .prod-process-icon img {
    width: 100%;
  }

  .about01-sec01 .prod-process-icon {
    margin-bottom: 20px;
  }

  .about01-sec01 .prod-process-txt {
    height: 260px;
    padding: 15px;
    font-size: 1em;
  }

  .pc-organ {
    display: none;
  }

  .m-organ {
    display: block;
    margin: auto;
  }

  /* 어바웃컴퍼니 섹션02 */
  .about01-sec02 .sec-sub {
    margin-bottom: 45px;
  }

  .about01-sec02 {
    /* height: 1050px; */
  }

  /* 히스토리 */
  .history-left-side,
  .history-right-side {
    width: 49%;
  }

  .history-info-wrap .animated {
    opacity: 1;
  }

  .history-right-side .history-info-wrap::before {
    width: 25px;
  }

  .history-left-side .history-info-wrap::before {
    width: 25px;
  }

  .history-info-wrap .history-info-list>p {
    word-break: keep-all;
  }

  .history-info-wrap .history-info-years,
  .history-info-wrap .history-info-list {
    display: block;
  }

  .history-info-wrap .history-info-years {
    margin-bottom: 20px;
    font-size: 2em;
  }

  .history-info-wrap .history-info-list {
    margin-left: 0;
    margin-bottom: 15px;
  }

  .history-info-img {
    width: 250px;
  }

  /* 찾아오시는 길 */
  .about04-sec01 {
    padding: 45px 0 75px;
  }

  /* 견적문의 */
  /* .inquiry-wrap {
        padding: 75px 0;
    }
    .inquiry-wrap .radio-wrap li {
        font-size: 15px;
    }
    .inquiry-wrap .cb-wrap li {
        font-size: 15px;
        width: 32%;
    } */
  /* 리쿠르트 */
  .recruit-wrap {
    padding: 75px 0;
  }

  .recruit-wrap .radio-wrap li {
    font-size: 15px;
  }

  .recruit-wrap .cb-wrap li {
    font-size: 15px;
    width: 32%;
  }

  /* 호스팅 및 유지보수 */
  .support02-wrap .support02-sec01>li:first-child {
    padding: 0 130px;
  }

  .support02-wrap .support02-sec01>li {
    width: 100%;
  }

  .support02-wrap .support02-sec02>li {
    width: 46%;
  }

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 12%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 70%;
  }

  .support03-wrap .contract-list-wrap .contract-list .date {
    width: 12%;
  }

  /* 서비스 */
  .hub-pms-wrap .field-img {
    margin-top: 0;
  }

  .hub-pms-wrap .hub-pms-list-wrap {
    margin-top: 50px;
  }

  .hub-pms-wrap .hub-pms-list {
    width: 48%;
  }

  .hub-pms-wrap .hub-pms-list .hub-pms-sub {
    margin-top: 25px;
  }

  .web-standard-list {
    height: 450px;
  }

  .ci-wrap {
    padding: 45px 0 85px;
  }

  .ci-list {
    width: 100%;
    display: block;
  }

  /* 게시판 뷰  */
  .news-view-wrap .board-sub {
    font-size: 1.5em;
    margin-bottom: 20px;
  }

  .news-view-wrap .board-tit {
    font-size: 2em;
    margin-bottom: 45px;
  }

  .news-view-wrap {
    padding: 120px 0 75px;
  }

  /* 포트폴리오 */
  .pf-list-wrap .pf-list {
    width: 49%;
  }

  /* 포트폴리오 모바일 웹 */
  .pfmw-list-wrap .pf-list {
    width: 32.3%;
    margin: 20px .5% 0 .5%;
  }

  .pfmw-list-wrap .pf-list .pf-title {
    font-size: 1.2em;
    margin-top: 10px;
  }

  .pfmw-list-wrap .pf-list .pf-link {
    margin-top: 5px;
  }

  /* QR CODE */
  .pf-list-layer {
    display: none;
  }

  /* 케이스 스터디 */
  .case_info .desc .btn img {
    width: 16px;
    height: 16px;
    margin-left: 5px;
  }

  .case_view_tit .tit {
    font-size: 1.6em;
  }
}

/* 타블렛 가로 미만 ~ 모바일 */

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

  /* faq 탭: 줄바꿈 대신 한 줄 가로 스크롤 (sticky 바 높이 고정) */
  .faq-tab {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .faq-tab::-webkit-scrollbar {
    display: none;
  }

  .faq-tab li {
    flex: 0 0 auto;
  }

  /* 개인정보처리방침 */
  .pp-wrap {
    padding-top: 100px;
  }

  /* 어바웃컴퍼니 */
  .about01-sec01 .prod-process {
    width: 100%;
    display: block;
    margin-bottom: 20px;
  }

  .about01-sec01 .prod-process-txt {
    height: auto;
  }

  .about01-sec01-phrase {
    word-break: keep-all;
  }

  .about01-sec02 .sec-sub {
    margin-bottom: 25px;
  }

  /* 뉴스 */
  .news01-wrap .news-board-wrap .news-board-body {
    padding: 15px 0;
    font-size: 1em;
  }

  .news01-wrap .news-board-wrap .news-board-head {
    display: none;
  }

  .news01-wrap .news-board-wrap .news-board-list {
    padding: 8px;
  }

  .news01-wrap .news-board-wrap .news-board-list .num {
    display: none;
  }

  .news01-wrap .news-board-wrap .news-board-list .title {
    width: 100%;
    display: block;
  }

  .news01-wrap .news-board-wrap .news-board-list .date {
    width: auto;
    text-align: left;
    font-size: 1em;
  }

  .news01-wrap .news-board-wrap .news-board-list .view {
    margin-left: 30px;
    padding-left: 10px;
    text-align: right;
    position: relative;
    font-size: 1em;
    text-align: left;
  }

  .news01-wrap .news-board-wrap .news-board-list .view::after {
    content: "조회";
    position: absolute;
    left: -19px;
  }

  .news01-wrap .news-board-wrap .news-board-list .view::before {
    content: "";
    width: 1px;
    height: 12px;
    background-color: #ddd;
    position: absolute;
    left: -26px;
    top: 6px;
  }

  /* 블로그 */
  .news02-wrap .blog-list-wrap a:nth-child(3n-1) {
    top: 0;
  }

  .news02-wrap .blog-list-wrap .item {
    /* width: 48%; */
    margin-bottom: 15px;
  }

  /* 어바웃컴퍼니 섹션01*/
  /* 어바웃컴퍼니 섹션02 */
  .com-status-wrap {
    width: 100%;
  }

  .about01-sec02 {
    padding: 45px 0 35px 0;
    /* height: 1140px; */
  }

  .com-status {
    display: block;
    height: auto;
  }

  .com-status-head {
    padding: 20px 40px;
    background-image: none !important;
  }

  .com-status-list {
    padding: 20px 40px 50px 40px;
  }

  .com-status-con {
    width: 100%;
  }

  /* 어바웃컴퍼니 섹션03 */
  .about01-sec03 {
    padding: 45px 0 75px 0;
  }

  /* 블로그 */
  .news02-wrap .blog-list-wrap .item .title {
    font-size: 1.2em;
    margin: 15px 0 12px 0;
  }

  /* 포트폴리오 모바일 웹 */
  .container-inner {
    padding-top: 85px;
  }

  .pfmw-list-wrap .pf-list {
    width: 48%;
    margin: 20px 1% 0 1%;
  }

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 14%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 70%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title>div {
    font-size: 1.3em;
  }

  .support03-wrap .contract-list-wrap .contract-list .date {
    width: 15%;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.new {
    font-size: .8em;
    padding: 2px 12px;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.open {
    font-size: .8em;
    padding: 2px 12px;
  }

  /* 게시판 검색폼 */
  #inner_srch {
    width: 450px;
    padding: 10px 15px;
    margin-top: 25px;
  }

  #inner_srch button {
    width: 20px;
    height: 20px;
    /* background-size: cover; */
  }

  /* 케이스 스터디 뷰 */
  .case_info .desc {
    margin-left: 0;
  }

  .case_top {
    padding: 100px 0 25px 0;
  }

  /* 견적문의 */
  .inquiry-wrap .radio-wrap li {
    width: 100% !important;
    display: block;
    padding: 25px 15px;
  }

  .inquiry-wrap .cb-wrap li {
    width: 100%;
    display: block;
  }

  .inquiry-wrap .input-wrap li>div>.email-input-wrap>.email-input input {
    width: 120px;
  }

  .inquiry-wrap .input-wrap li>div>.email-input-wrap>select {
    display: none;
  }

  /* 리쿠르트 */
  .recruit-wrap .radio-wrap {
    margin-bottom: 30px;
  }

  .recruit-wrap .radio-wrap li {
    width: 100%;
    display: block;
    padding: 25px 15px;
  }

  .recruit-wrap .input-wrap {
    margin-bottom: 30px;
  }

  .recruit-wrap .input-wrap li>div {
    width: 100%;
    display: block;
  }

  .recruit-wrap .cb-wrap li {
    width: 100%;
    display: block;
  }

  .recruit-wrap .attach-file-wrap .upload-tit {
    display: none;
  }

  .recruit-wrap .attach-file-wrap>div {
    width: 100%;
  }

  .recruit-wrap .contact-cont {
    margin-bottom: 10px;
  }

  .recruit-wrap .attach-file-wrap .fileBox .fileName {
    width: 74%;
  }

  .recruit-wrap .attach-file-wrap .fileBox .btn_file {
    width: 21%;
  }

  .recruit-wrap .p-info-wrap {
    padding: 40px 20px;
  }

  .recruit-wrap .p-info-wrap .p-info {
    margin-bottom: 20px;
  }

  .recruit-wrap .p-info-wrap .p-info-tit {
    font-size: 1.1em;
  }

  .recruit-wrap .p-info-wrap .agree-btn-wrap .agree-btn {
    font-size: 1em;
  }

  .recruit-wrap .submit-btn .motion-linker {
    width: 220px;
  }

  .recruit-wrap .submit-btn {
    margin-top: 45px;
  }

  .recruit-wrap .radio-wrap .job-field {
    width: 100%;
    display: block;
  }

  .recruit-wrap .radio-wrap li .radio-circle-inner {
    width: 12px;
    height: 12px;
  }

  .recruit-wrap .radio-wrap li .radio-circle {
    width: 16px;
    height: 16px;
  }

  .recruit-wrap .p-info-wrap .agree-btn-wrap .agree-btn .radio-circle-inner {
    width: 12px;
    height: 12px;
  }

  .recruit-wrap .p-info-wrap .agree-btn-wrap .agree-btn .radio-circle {
    width: 16px;
    height: 16px;
  }

  .recruit-wrap .cb-wrap li .cb-circle-inner {
    width: 12px;
    height: 12px;
  }

  .recruit-wrap .cb-wrap li .cb-circle {
    width: 16px;
    height: 16px;
  }

  .recruit-wrap .radio-wrap .job-field {
    padding: 25px 15px;
  }

  /* 웹 호스팅 및 유지보수 */
  .support02-wrap .support02-sec02>li {
    width: 45%;
  }

  /* 연혁 */
  .history-info-img {
    width: 100%;
  }

  .history-left-side {
    padding-left: 0px;
    padding-right: 50px;
  }

  .history-left-side .history-info-wrap::before {
    right: -38px;
  }

  .history-left-side .history-info-wrap::after {
    right: -64px;
  }

  .facility__tit {
    font-size: 2em;
  }

  .facility__list {
    margin-top: 45px;
  }

  .facility__list .items {
    width: 350px;
  }

  .facility__list .arrows {
    width: 480px;
    margin-left: -240px;
  }

  .facility__list .arrows .arrows__next,
  .facility__list .arrows .arrows__prev {
    width: 25px;
    height: 48px;
  }
}

/* 모바일 상세 */

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

  /* 서브비주얼 */
  .sub-banner-wrap {
    display: none !important;
  }

  .m-sub-banner-wrap {
    display: block !important;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
  }

  .m-sub-banner-wrap .m-sub-banner {
    width: 100%;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    text-align: center;
    box-sizing: border-box;
    padding: 120px 0 75px;
  }

  .m-sub-banner-wrap .m-page-name {
    color: #f2bb0d;
    font-size: 1.3em;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 6px;
  }

  .m-sub-banner-wrap .m-page-sub-tit {
    color: #fff;
    font-size: 1.5em;
    font-weight: 300;
    text-transform: capitalize;
  }

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 15%;
    font-size: 12px;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 67%;
    font-size: 12px;
  }

  .support03-wrap .contract-list-wrap .contract-list .date {
    width: 15%;
    font-size: 12px;
  }

  .support03-wrap .contract-list-wrap .contract-list {
    padding: 20px 0;
  }

  /* 서비스 */
  .hub-pms-wrap {
    padding: 45px 0;
  }

  .hub-pms-wrap .hub-pms-list {
    height: auto;
    width: 100%;
    display: block;
    padding: 20px 0;
  }

  .hub-pms-wrap .hub-pms-list .hub-pms-title {
    font-size: 1.5em;
    margin-top: 0px;
  }

  .hub-pms-wrap .hub-pms-list .hub-pms-sub {
    margin-top: 12px;
    line-height: 1.6em;
    word-break: keep-all;
  }

  .web-standard-wrap {
    padding: 45px 0;
  }

  .web-standard-list {
    width: 100%;
    display: block;
  }

  .web-standard-list {
    height: auto;
    padding-bottom: 25px;
  }

  .web-standard-list h1 {
    font-size: 1.5em;
  }

  .web-standard-list p {
    font-size: 1em;
  }

  .web-standard-list p {
    margin-top: 15px;
  }

  .ci-wrap {
    padding: 45px 0;
  }

  .ci-list {
    height: auto;
    padding-bottom: 50px;
    margin: 0;
  }

  .ci-list p {
    font-size: 1.1em;
  }

  /* 게시판 검색폼 */
  #inner_srch {
    width: 300px;
    padding: 10px 15px
  }

  #inner_srch button {
    width: 20px;
    height: 20px;
    background-size: contain;
    background-position: 100%;
  }

  /* 케이스 스터디 뷰 */
  .case_info .desc ul {
    border-top: 1px solid #ddd;
    padding-top: 15px;
  }

  .case_info .desc li {
    display: block;
    height: auto;
    vertical-align: middle;
    text-align: left;
  }

  .case_info .desc li::after {
    display: none;
  }

  .case_info .desc .wide {
    width: 100%;
  }

  .case_info .desc li>p {
    display: inline-block;
  }

  .case_info .desc .label {
    width: 80px;
  }

  .case_info .desc .link {
    width: 100%;
    margin-top: 15px;
  }

  .case_info .desc .btn {
    height: 40px;
    line-height: 40px;
    text-align: center;
  }

  .case_info {
    margin-bottom: 45px;
  }

  /* 웹 호스팅 및 유지보수 */
  .support02-wrap .support02-sec02>li {
    width: 100%;
    margin: 12.5px 0 12.5px 0;
  }

  /* 견적문의 */
  .inquiry-wrap .input-wrap li>div>.tel-input-wrap>.tel-input input {
    width: 120px;
  }

  .inquiry-wrap .input-wrap li>div>.tel-input-wrap>.tel-input::after {
    width: 10px;
  }

  .facility__list {
    margin-top: 25px;
  }

  .facility__list .items {
    /* width: 280px; */
    margin: 0 25px;
  }

  .facility__list .arrows {
    display: none;
  }

  .facility__list .items .items__tit {
    width: 120px;
    height: 50px;
    line-height: 50px;
    font-size: 1.2em;
    bottom: 12px;
    right: -7px;
  }

  .facility__list .slick-dots {
    width: 100%;
    text-align: center;
    margin-top: 7px;
  }

  .facility__list .slick-dots li {
    display: inline;
    margin: 0 3px;
  }

  .facility__list .slick-dots li button {
    font-size: 0;
    background: none;
    border: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #87929c;
    cursor: pointer;
    padding: 0;
    outline: none;
  }

  .facility__list .slick-dots li.slick-active button {
    background-color: #4074f8;
  }

}

/* 모바일 가로 */

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

  /* 블로그 */
  .news02-wrap .sec-sub {
    margin-bottom: 30px;
  }

  .com-status-head {
    padding: 14px 20px;
    font-size: 1.3em;
  }

  .com-status-list {
    padding: 0 20px 20px 20px;
  }

  .com-status-list>li>div {
    font-size: 12px;
    padding: 10px 0 5px;
    display: block;
  }

  .com-status-list-tit {
    width: 55px;
  }

  .com-status-list-tit::before {
    width: 55px;
  }

  .com-status-list-con {
    padding-left: 15px !important;
    word-break: keep-all;
  }

  /* 회사연혁 */
  .history-wrap {
    display: none;
  }

  .history-sec01 .sec-tit {
    margin-bottom: 45px;
  }

  .m-history-wrap {
    display: block;
    padding-left: 50px;
    padding-top: 50px;
    padding-bottom: 50px;
    border-left: 1px solid #ddd;
  }

  .history-info-wrap {
    margin-top: 0px;
    margin-bottom: 75px;
  }

  .history-info-wrap .history-info-years {
    text-align: left;
  }

  .history-info-wrap .history-info-years::before {
    content: "";
    left: -37px;
    position: absolute;
    top: 13px;
    width: 25px;
    height: 1px;
    background-color: #ddd;
    -webkit-transition: all ease .8s;
    transition: all ease .8s;
  }

  .history-info-wrap .history-info-years::after {
    content: "";
    left: -63px;
    position: absolute;
    background-image: url(/image/sub/history_circle02.png);
    background-repeat: no-repeat;
    top: 0px;
    width: 26px;
    height: 26px;
  }

  .history-info-img {
    width: 100%;
  }

  /* 찾아오시는 길 */
  .location-info-wrap {
    display: block;
  }

  .location-info01 {
    border-right: none;
    border-bottom: 1px solid #ddd;
  }

  .location-info02 {
    padding-top: 20px;
  }

  .location-info-list {
    margin-bottom: 12px;
  }

  .location-info01,
  .location-info02 {
    width: 100%;
    display: block;
    padding: 20px 0 10px 0;
  }

  iframe#map {
    height: 300px;
  }

  .motion-linker::before {
    width: 50px;
    height: 50px;
    right: 0px;
    top: -1px;
  }

  .motion-linker-txt::after {
    content: "";
    position: absolute;
    right: 24px;
    height: 2px;
    background-color: #000;
    width: 40px;
    top: 25px;
    -webkit-transition: all ease .3s;
    transition: all ease .3s;
  }

  .inquiry-wrap .submit-btn {
    margin-top: 45px;
  }

  .inquiry-wrap .radio-wrap li .radio-circle-inner {
    width: 12px;
    height: 12px;
  }

  .inquiry-wrap .radio-wrap li .radio-circle {
    width: 16px;
    height: 16px;
  }

  .inquiry-wrap .p-info-wrap .agree-btn-wrap .agree-btn .radio-circle-inner {
    width: 12px;
    height: 12px;
  }

  .inquiry-wrap .p-info-wrap .agree-btn-wrap .agree-btn .radio-circle {
    width: 16px;
    height: 16px;
  }

  .inquiry-wrap .cb-wrap li .cb-circle-inner {
    width: 12px;
    height: 12px;
  }

  .inquiry-wrap .cb-wrap li .cb-circle {
    width: 16px;
    height: 16px;
  }

  /* 호스팅 및 유지보수 */
  .support02-wrap .support02-sec01-info {
    display: none !important;
  }

  .support02-wrap .support02-sec01>li .support02-sec01-con p {
    word-break: keep-all;
  }

  .support02-wrap .support02-sec02>li {
    width: 100%;
    margin: 0 0 25px 0;
  }

  .support02-wrap {
    padding: 45px 0 85px;
  }

  .support02-wrap .area-tit {
    font-size: 1em;
  }

  .m_support_bg {
    display: block;
  }

  .m_support_bg img {
    display: block;
  }

  /* 수주 및 오픈현황 */
  .support03-wrap {
    padding: 45px 0 85px;
  }

  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 14%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title>div {
    font-size: 1.3em;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 75%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title .mobile-date {
    display: block;
  }

  .support03-wrap .contract-list-wrap .contract-list .date {
    width: 18%;
    display: none;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.open {
    font-size: 0.7em;
    padding: 0px 9px;
  }

  .support03-wrap .contract-list-wrap .contract-list .status>.new {
    font-size: 0.7em;
    padding: 0px 9px;
  }

  .support03-wrap .contract-list-wrap .contract-list .date>div {
    font-size: .8em;
  }

  /* 게시판 뷰 */
  .news-view-wrap .board-sub {
    font-size: 1.2em;
    margin-bottom: 12px;
  }

  .news-view-wrap .board-tit {
    font-size: 1.5em;
    margin-bottom: 25px;
  }

  .news-view-wrap .list-btn::after {
    right: 45px;
  }

  .news-view-wrap .list-btn-wrap .list-btn {
    width: 160px;
    padding-left: 35px;
  }

  .board-view-file {
    margin-top: 120px;
  }

  /* 포트폴리오 */
  .pf-list-wrap .pf-list,
  .pfmw-list-wrap .pf-list {
    width: 100%;
    margin: 0;
    margin-bottom: 35px;
  }

  .pf-list-wrap .pf-list .pf-title {
    font-size: 1.2em;
    margin-top: 10px;
  }

  .pf-list-wrap .pf-list .pf-link {
    margin-top: 7px;
    font-size: 1.1em;
  }

  .pfmw-list-wrap .pf-list .pf-title {
    font-size: 1.2em;
    margin-top: 10px;
  }

  .pfmw-list-wrap .pf-list .pf-link {
    margin-top: 7px;
    font-size: 1.1em;
  }

  /* 케이스 스터디 */
  .case-study-wrap {
    padding: 120px 0 45px;
  }

  .case-study-wrap ul .case-list {
    display: inline-block;
    width: 100%;
    margin: 0;
  }

  .case-study-wrap ul .case-list .tit {
    font-size: 15px;
  }

  .case-study-wrap ul .case-list .date {
    font-size: 13px;
  }

  .news02-wrap .blog-list-wrap .item,
  .news03-wrap .blog-list-wrap .item,
  .case-wrap .blog-list-wrap .item {
    width: 100%;
    margin: 0 0 20px 0;
  }

  /* 케이스 스터디 */
  .case_btn .float-wrap {
    padding-bottom: 10px;
  }

  .case_btn button {
    max-width: 160px;
    height: 50px;
  }

  .case_btn em {
    font-size: 1em;
    letter-spacing: -0.03em;
  }

  .case-content-inner {
    padding: 25px 0 35px;
  }

  /* 견적문의 */
  .inquiry-wrap .input-wrap li>div>.tel-input-wrap>.tel-input input {
    width: 70px;
  }

  .inquiry-wrap .s-wrap {
    margin-bottom: 45px;
  }

  .inquiry-wrap .s-wrap .s-box {
    font-size: 1.3rem;
    margin-right: 20px;
  }

  .inquiry-wrap .s-wrap .s-box:first-child {
    width: 120px;
  }

  .inquiry-wrap .s-wrap .s-box .s-num {
    margin-left: 7px;
  }

  .inquiry-wrap .s-wrap .s-box input {
    height: 30px;
    line-height: 30px;
  }

  .inquiry-wrap .s-wrap .s-box h1 {
    margin-bottom: 8px;
  }
}

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

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 18%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 75%;
  }

  /* 케이스 스터디 */
  .case_btn .float-wrap {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
  }

  .case_btn {
    height: auto;
  }

  .case_btn .list {
    position: static;
    margin: 0 auto;
    width: 50px;
    height: 50px;
  }
}

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

  /* 견적문의 */
  .inquiry-wrap .input-wrap li>div>.email-input-wrap>.email-input input {
    width: 100px;
  }

  .inquiry-wrap .input-wrap li>div>.tel-input-wrap>.tel-input input {
    width: 62px;
  }

  .inquiry-wrap .s-wrap {
    display: block;
    margin-top: 35px;
  }

  .inquiry-wrap .s-wrap .s-box:first-child {
    margin: 70px auto 0 auto;
  }

  .inquiry-wrap .s-wrap .s-box {
    margin-right: 0px;
    margin-top: 20px;
  }
}

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

  /* 수주 및 오픈현황 */
  .support03-wrap .contract-list-wrap .contract-list {
    padding: 20px 10px;
  }

  .support03-wrap .contract-list-wrap .contract-list .status {
    width: 22%;
  }

  .support03-wrap .contract-list-wrap .contract-list .title {
    width: 75%;
  }
}