@charset "utf-8";

:root {--blue:#036eb8; --yellow:#f7b407;}



body.m-active {overflow-y: hidden;}
body.intro-on {overflow-y: hidden;}



/* intro */
.intro-wrap {width: 100%; height: 100%; overflow: hidden;}
.intro-wrap.hide {transition:all ease-out .6s; opacity: 0; overflow:hidden; transition-delay:3s;}   
.intro {display:flex; align-items:center; justify-content:center; position: relative; width:100%; height:100%; position:fixed; top:0; left:0; background:url(../images/intro_bg.png) top center no-repeat; background-size: cover; z-index:1100;}
.intro-wrap.hivesolution .intro {background:url(../images/intro_bg_hive2.png) top center no-repeat; background-size: cover;}

.intro::before {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); opacity: 1; width: 100%; height: 100%; background-color: #fff; animation: bg-ani 1.5s; animation-delay:0.5s; animation-fill-mode: forwards;}

@keyframes bg-ani {
    0% {opacity: 1;}
    50% {opacity: 0;}
    100% {opacity: 0;}
}

.heading {margin-top: 400px; width: 100%; display: flex; flex-direction: column;}
.heading > div {overflow: hidden; animation-delay: 0}
.heading > div > p {text-align: center; width: 100%; white-space: nowrap; margin: 0; line-height: 117%;}
.intro-wrap.hivesolution .heading > div > p {line-height: 125%;}

.heading > div:nth-child(1) > p {animation-delay: 1.5s; font-family: 'PTSerif' !important; font-size: 70px; font-style: italic; font-weight: 700; color:#333; word-break:keep-all;}
.heading > div:nth-child(1) > p em {font-family: 'PTSerif' !important; font-style: italic; font-weight: 700;}

.intro-wrap.maumn .heading > div:nth-child(1) > p em {color: var(--blue);}
.intro-wrap.hivesolution .heading > div:nth-child(1) > p {font-family: 'Poppins' !important; font-size: 60px; font-style: normal; font-weight: 600;}
.intro-wrap.hivesolution .heading > div:nth-child(1) > p em {font-family: 'Poppins' !important; font-style: normal; font-weight: 600; color: var(--yellow);}

.heading > div:nth-child(1) > p br {display: none;}
.heading > div:nth-child(2) > p {margin-top: 30px; animation-delay: 2s; font-size: 35px; font-weight: 300; color:#333; word-break:keep-all;}

.slide-up {animation: slide-up 1s cubic-bezier(0.65, 0, 0.35, 1) both;}

@keyframes slide-up {
    0% {transform: translateY(100px)}
    100% {transform: translateY(0)}
}

.intro-video-wrap {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 10;}
.intro-video {width: 100%; height: 100%; object-fit: cover;}



/* popup */
.main-popup {position:absolute; left:50px; top:80px; display:none; min-width:452px; max-width:452px; z-index:999; background-color:#fff; box-shadow: 2px 2px 6px 3px rgba(0, 0, 0, 0.1);}
.main-popup .popup-body .popup-img {display:flex;}
.main-popup .popup-foot {display:flex; justify-content:space-between; width:100%; height:45px; padding:0 20px; position:relative;}
.main-popup .popup-foot .popup-check {display:flex; gap:5px; line-height:45px;}
.main-popup .popup-foot .popup-check input {display:inline-block; margin:auto 0; border-radius:0;}
.main-popup .popup-foot .popup-check label {font-size:14px;}
.main-popup .popup-foot .btn_close {display:flex; width:20px; height:45px;}
.main-popup .popup-foot .btn_close i {margin:auto;}

/* popup 반응형 */
@media screen and (max-width: 600px) {
	.main-popup {top:50px; left:50%; transform:translateX(-50%);}
}

@media screen and (max-width: 500px) {
	.main-popup {top:20px; min-width:auto; width:90%;}
}



/* wrap */
#wrap {position: relative; width: 100%; margin: auto 0; overflow-x: clip; overflow:hidden; transition: .3s;}



/* skip-navigation */
.skip-navigation {position:absolute;}
.skip-navigation a {position:absolute; top:-200px;}
.skip-navigation a:focus,
.skip-navigation a:active {display:block; position: fixed; top:0px; left:0; width:100%; height:50px; text-align:center; font-size:14px; font-weight:bold; line-height: 50px; color:#fff; background:#000; text-decoration:none; z-index:9999;}



/* header */
.header {position: absolute; top: 0; width: 100%; height: 110px; background-color:transparent; z-index: 100; transition: .3s;}
body.intro-on .header {opacity:0; animation: visual-ani 2s; animation-delay:6.5s; animation-fill-mode: forwards;}
.header-inner {width: 100%; height: 100%; display: flex; justify-content: space-between; padding: 0 50px;}
.logo {height: 110px;}
.logo a {position: relative; display: flex; width: 160px; height: 100%;}
.logo a img {position: absolute; top: 50%; transform: translateY(-50%); transition: .3s;}
.logo a img.color-ver {opacity: 0;}


/* one depth */
.gnb nav {position: relative;}
/* 헬프데스크 링크 */
.gnb nav:has(.other-link) {display:flex; gap:30px;}
.other-link {display:flex; gap:5px; margin:auto; padding:8px 20px; font-size:14px; border-radius:20px; background-color:var(--yellow); color:#fff; font-weight:600;}
.other-link i {font-size:20px;}
.other-link span {padding-top:1px; margin:auto 0;}

.menu {position: relative; display: flex; gap: 65px;}
.menu > li {position: relative;}
.menu > li:not(:last-of-type)::after {content: ""; position: absolute; top:50%; right: -38px; transform: translateY(-50%); width: 10px; height: 1px; background-color: #fff; transition: .3s;}
/* .header.scroll-on .menu > li:not(:last-of-type)::after {background-color: var(--blue); transition: .3s;} */
.menu > li > a {position: relative; display: block; font-size: 14px; font-weight: 700; line-height: 110px; color: #fff; transition: .3s;}
.menu > li:hover > a {color: #57baff;}
.hivesolution .menu > li:hover > a {color: var(--yellow);}


/* two depth */
.sub-menu {position: absolute; left: 50%; transform: translateX(-50%); padding: 0 30px; font-weight: 400;}
.menu > li:first-of-type .sub-menu::before {content: ''; position: absolute; top: 1px; left: -100vw; right: -100vw; bottom: 0; background-color: #fff; backdrop-filter: blur(5px); z-index: -1; transition: .3s;}
.sub-menu li {max-height: 0; width: 0; padding: 0; opacity: 0; text-align: center;  overflow: hidden;  transition: .3s;}
.sub-menu li a {white-space: nowrap; font-size: 16px; color: #333; transition: .3s;}
.sub-menu li:hover a {color: var(--green); transition: .3s;}


.right-menu {position: absolute; display: flex; right: 0; height: 100%;}


/* mobile - header */
.ham-btn {display: none; position: relative; width: 110px; height: 110px; border: none; border-left: 1px solid #666; background-color: transparent; border: none;}
.ham-btn i,
.ham-btn svg {font-size: 40px; color: #fff;}

.m-header {display: flex; justify-content: space-between; width: 100%; height: 110px; padding: 0 50px;}
.m-header .m-logo a {display: flex; justify-content: space-between; width: 100%; height: 110px;}
.m-header .m-logo a img {margin: auto;}
.m-header .ham-btn {position: absolute; right: 0; width: 110px; height: 110px;  background-color: transparent; border: none;}
.m-header .ham-btn i,
.m-header .ham-btn svg {font-size: 36px;}

.m-inner {padding-top: 20px;}

.m-menu-wrap {position:fixed; top:0; right:0; width:100%; height:100%; background-color:rgba(0,0,0,0); visibility:hidden; z-index: 1300; transition: .5s;}
.m-menu-wrap.active {background-color:rgba(0,0,0,0.6); visibility:visible;}

.m-menu {position:fixed; top:0; right:-100%; width:100%; height:100%; padding-bottom:15px; background-color:rgba(0, 0, 0, 0.8); backdrop-filter: blur(5px); transition:right .5s; }
.m-menu .m-inner {padding-top: 30px; height: calc(100% - 60px); overflow-y: auto;}
.m-menu-wrap.active .m-menu {right:0;}

.m-menu .menu-wrap .one-depth-menu {width: 100%; padding: 0 50px;}
.m-menu .menu-wrap .one-depth-menu > li:not(.else-menu) {border-bottom:1px dashed #7c7c7c;}
.m-menu .menu-wrap .one-depth-menu > li {padding: 0 0 30px; margin-bottom: 45px; font-weight: 500;}
.m-menu .menu-wrap .one-depth-menu > li > a {display: block; position: relative; width: 100%; padding: 0 0 10px; font-size: 20px; color: #fff;}
.m-menu .menu-wrap .one-depth-menu > li.else-menu .else-btn {display:inline-block;}
.m-menu .menu-wrap .two-depth-menu {width: 100%; margin-top: 5px;}
.m-menu .menu-wrap .two-depth-menu > li:not(:last-of-type) {padding-bottom: 15px;}
.m-menu .menu-wrap .two-depth-menu > li > a {font-size: 16px; font-weight: 400; line-height: 19px; color: #ececec;}

.m-menu .menu-wrap .mobile-sns-list {display: flex; padding-top: 10px;}
.m-menu .menu-wrap .mobile-sns-list li:not(:last-of-type) {margin-right: 7px;}


/* header - sub ver */
#wrap:has(.sub-content) .menu > li:not(:last-of-type)::after {background-color: #4393CA;}
#wrap.hivesolution:has(.sub-content) .menu > li:not(:last-of-type)::after {background-color: var(--yellow);}

#wrap:has(.sub-content) .menu > li > a {color: #898989; transition: .3s;}
#wrap:has(.sub-content) .menu > li.on > a {color: var(--blue);}
#wrap:has(.sub-content) .menu > li > a:hover {color: var(--blue); transition: .3s;}
#wrap.hivesolution:has(.sub-content) .menu > li > a:hover {color: var(--yellow); transition: .3s;}

#wrap:has(.sub-content) .logo a img.default-ver {opacity: 0;}
#wrap:has(.sub-content) .logo a img.color-ver {opacity: 1;}

#wrap:has(.sub-content) .ham-btn i,
#wrap:has(.sub-content) .ham-btn svg {color: #111;}

#wrap:has(.sub-content) .m-header .ham-btn i,
#wrap:has(.sub-content) .m-header .ham-btn svg {color: #fff;}


/* main - 공통 */
.container {position: relative;}

@keyframes visual-ani1 {
    0% {opacity:1;}
    100% {opacity:0;}
}

.content-title-wrap {text-align: center;}
.content-text {margin-bottom: -55px; font-size: 100px; font-family: 'PTSerif' !important; font-style: italic; font-weight: 700; color: #333333; letter-spacing: -0.3px; opacity: 0.1;}
.hivesolution .content-text {margin-bottom: -60px; font-family: 'Poppins' !important; font-style: normal; font-weight: 600; color: #888; letter-spacing: -2px;}

.content-title {font-size: 55px; line-height: 80px; font-weight: 700; color: #333; word-break: keep-all;}
.content-title em {color: var(--blue);}
.hivesolution .content-title em {color: var(--yellow);}


/* main sec1 visual */
.main-visual {}
.visual-inner {position: relative; width: 100%; height: 100vh; min-height: 830px; max-height: 100vh; background-color: #fff; overflow: hidden; z-index: -1;}
.visual-content {position: relative; display: flex; width: 100%; height: 100%; opacity:1;}
.intro-on .visual-content {opacity:0; animation: visual-ani 2s; animation-delay:6.5s; animation-fill-mode: forwards;}
.intro-on .objet-mask {position: absolute; width: 100%; height: 100%; clip-path: circle(15%);}
.intro-on .objet-mask {--clip:0%; clip-path: circle(var(--clip));}
.visual-video {position: absolute; top: 50%; left: 50%; display: block; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover !important; background-color: #000; backface-visibility: hidden; opacity: 0.6; animation: video-ani 1.6s; animation-delay:5.1s; animation-fill-mode: forwards; z-index: -2;}
.video-bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background-color: #036eb8; z-index: -3;}
.hivesolution .video-bg {background-color: #333;}

.visual-list {position: absolute; top: 45%; transform: translateY(-50%); width: 100%; padding: 0 20px; margin: auto; text-align: center; word-break: keep-all;}
.visual-list li:first-of-type {padding-bottom: 20px; font-family: 'PTSerif' !important; font-style: italic; font-weight: 700; font-size: 120px; color: #fff; letter-spacing: 0px; text-shadow: 2px 2px 2px #00000027;}
.hivesolution .visual-list li:first-of-type {font-family: 'Poppins' !important; font-style: normal; font-weight: 500; font-size: 120px; color: #fff; letter-spacing: -2px;}

.visual-list li:nth-of-type(2) {font-size: 45px; font-weight: 300; line-height: 60px; color: #fff; letter-spacing: -0.3px; text-shadow: 2px 2px 2px #00000027;}


.scroll-down {display: flex; position: absolute; bottom: 180px; left: 50%; transform: translateX(-50%); width: 75px; height: 75px; animation: down 1.5s infinite; border-radius: 75px; background-color: var(--blue);}
.hivesolution .scroll-down {background-color: var(--yellow);}
.scroll-down img {margin: auto;}

@keyframes down {
    0% {transform: translate(-50%, 0);}
    20% {transform: translate(-50%, 15px);}
    50% {transform: translate(-50%,0);}
}

@keyframes visual-ani {
    0% {opacity:0;}
    100%{opacity:1;} 
}



/* main sec2 core */
.main-core {}
.core-inner {padding: 160px 0 110px;}
.core-list {padding: 20px 0 125px;}
.core-list li {text-align: center; font-size: 30px; font-weight: 300; color: #161616; line-height: 50px;}

.biz-btn-list {display: flex; justify-content: center; flex-wrap: wrap; column-gap: 15px; row-gap: 20px; margin: 75px auto 0;}
.biz-btn {height: 70px; padding: 4px 38px 0; font-size: 30px; font-weight: 300; color: #fff; letter-spacing: -0.5px; background-color: transparent; border: 1px solid #fff; border-radius: 70px; transition: .3s;}
.biz-btn:hover {color:#000; font-weight: 500; background-color: #fff; transition: .3s;}
.biz-btn-list li.on .biz-btn {color:#000; font-weight: 500; background-color: #fff; transition: .3s;}

.works-btn-list {display: flex; justify-content: center; flex-wrap: wrap; column-gap: 15px; row-gap: 20px; margin: 75px auto 0;}
.works-btn {height: 70px; padding: 0 38px; font-size: 30px; font-weight: 300; color: #333; letter-spacing: -0.5px; background-color: transparent; border: 1px solid #333; border-radius: 70px; transition: .3s;}
.works-btn:hover {color:#fff; font-weight: 500; background-color: #000; transition: .3s;}
.works-btn-list li.on .works-btn {color:#fff; font-weight: 500; background-color: #000; transition: .3s;}

.core-banner {}
.core-swiper {max-width: 1920px; padding: 0 50px; margin: auto;}
.core-swiper .swiper-slide {border-radius: 30px; overflow: hidden;}
.core-swiper .swiper-slide a {position: relative; display: flex; width: 100%; height: 100%;}
.core-swiper .swiper-slide a::before {content: ""; position: absolute; width: 100%; height: 100%; background-color: #181818; opacity: 0; transition: .3s;}
.core-swiper .swiper-slide a:hover::before {opacity: 0.6; transition: .3s;}
.core-swiper .swiper-slide a:hover .pf-list {opacity: 1; transition: .3s;}
.core-swiper .swiper-slide img {margin: auto;}



/* main sec3 biz */
.main-biz {background-color: #181818;}
.biz-inner {padding: 230px 50px 180px; text-align: center;}

.main-biz .content-text {color: #fff; opacity: 0.05;}
.main-biz .content-title {color: #fff;}

.banner-container {display: flex; width: 100%; height: 155px; overflow: hidden; position: relative;}
.banner-container:first-of-type {margin-bottom: 10px;}
.slide-container {display: flex; justify-content: center; align-items: center; animation: loop 35s linear infinite; -webkit-animation: loop 35s linear infinite;}
.banner-container.reverse-ver .slide-container {animation-direction : reverse;}
.slide-box {margin: 0 110px;}
.slide-box > h1 {white-space: nowrap; font-family: 'PTSerif' !important; font-style: italic; font-weight: 700; font-size: 133px; transition: 0.3s ease; color: transparent; -webkit-text-stroke: 1px #535353;}

@keyframes loop {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-100%);
    }
}
@-webkit-keyframes loop {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-100%);
    }
}



/* main sec4 pf */
.main-pf {background-color: #181818; transition: .3s;}
.pf-inner {position: relative; padding:0 50px 180px; margin-top: -205px; z-index: 1; transition: .3s;}

.pf-wrap {display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: auto; gap: 60px; max-width: 1805px; margin: auto;}
.pf-item {border-radius: 10px; overflow: hidden;}
.pf-item a {position: relative; display: flex; width: 100%; height: 100%;}
.pf-item a::before {content: ""; position: absolute; width: 100%; height: 100%; background-color: #181818; opacity: 0; transition: .3s;}
.pf-item a:hover::before {opacity: 0.6; transition: .3s;}
.pf-item a img {width:100%; object-fit:cover;}
.pf-item.big-item {grid-column: span 2; grid-row: span 2;}
.pf-list {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; padding: 25px; text-align: center; font-size: 25px; word-break: keep-all; line-height: 35px; color: #fff; opacity: 0; transition: .3s;}
.pf-item a:hover .pf-list {opacity: 1; transition: .3s;}
.pf-list li:first-of-type {font-weight: 500;}
.pf-list li:nth-of-type(2) {font-weight: 300;}
.pf-link {padding-top: 15px; display: inline-block; font-family: 'PTSerif' !important; font-size: 15px; font-style: italic; border-bottom: 1px solid rgba(255, 255, 255, 0.3);}

.more-btn-wrap {text-align: center;}
.more-btn {position: relative; margin-top: 115px;  font-family: 'PTSerif' !important; padding-right: 110px; font-size: 100px; font-style: italic; color: transparent; letter-spacing: -0.3px; -webkit-text-stroke: 1px #535353; border: none; background: transparent; transition: .3s;}
.more-btn::after {content: ""; position: absolute; top: 55%; right: 0; transform: translateY(-50%); width: 75px; height: 75px; border: 1px solid #535353; border-radius: 75px; background: url(../images/arrow_more.png) center no-repeat; transition: .3s;}
.more-btn:hover {-webkit-text-stroke: 1px #fff; transition: .3s;}
.more-btn:hover::after {border: 1px solid #fff; background: url(../images/arrow_down.png) center no-repeat; transition: .3s;}



/* main sec5 contact */
.main-contact {}
.contact-inner {padding: 130px 50px 170px; text-align: center;}
.contact-img {}
.contact-btn {display: inline-block; width: 260px; height: 70px; margin-top: 55px; text-align: center; color: #000; font-size: 30px; font-weight: 300; line-height: 70px; letter-spacing: -0.5px; border: 1px solid #000; border-radius: 70px; transition: .3s;}
.contact-btn:hover {background-color: #000; color: #fff; transition: .3s;}



/* top btn */
.top-btn {display:none; position: fixed; right: 30px; bottom: 30px; width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.8); border-radius: 50px; box-shadow: 2px 2px 6px 3px rgba(0, 0, 0, 0.1); cursor: pointer; z-index: 100;}
.top-btn a {position: relative; display: inline-block; width: 100%; height: 100%; border-radius: 50px; background: url(../images/arrow_up.png) center no-repeat; background-size: 13px;}



/* footer */
.footer {display: flex; width: 100%; border-top: 1px solid #101010;}
.footer-inner {display: flex; justify-content: space-between; width: 100%; padding: 75px 50px 60px; margin: auto;}
.foot-info {display: flex; justify-content: center; gap:45px;}
.foot-info:first-of-type {padding-bottom: 15px;}
.foot-info li {position: relative; font-size: 17px; font-weight: 500; color:#161616; word-break: keep-all;}
.foot-info li:not(:last-of-type):after {content: ""; position: absolute; top:45%; right:-22.5px; transform: translateY(-50%); width: 1px; height: 80%; border-right: 1px solid #ccc;}
.copy {font-size: 15px; font-weight: 500; color: #aaaaaa;}


/* main 반응형 */
@media screen and (min-width: 1921px) {
	.core-swiper {padding:0;}
    .visual-img img {width: 100%; height: 100%; object-fit: cover;}
}
@media screen and (min-width: 2000px) {
    .intro {background:url(../images/intro_bg_2.png) top center no-repeat; background-size: cover;}
	.intro-wrap.hivesolution .intro {background:url(../images/intro_bg_2_hive2.png) top center no-repeat; background-size: cover;}

    .heading {margin-top: 12%;}
}
@media screen and (min-width: 2500px) {
    .heading {margin-top: 15%;}
}

@media screen and (max-width: 1900px) {
    .heading {margin-top: 20%;}
}

@media screen and (max-width: 1600px) {
    .heading > div:nth-child(1) > p {font-size: 50px !important;}
    .heading > div:nth-child(2) > p {margin-top: 20px !important; font-size: 28px !important;}



    .pf-wrap {gap: 45px;}
}

@media screen and (max-width: 1450px) {
    .visual-list li:first-of-type {font-size: 90px !important;}
    .visual-list li:nth-of-type(2) {font-size: 40px; line-height: 55px;}

    .scroll-down {bottom: 120px;}



    .content-text {font-size: 90px !important;}
    .content-title {font-size: 50px; line-height: 70px;}



    .core-list {padding: 10px 0 125px;}
    .core-list li {font-size: 28px; line-height: 45px;}


    .biz-inner {padding: 190px 50px 120px;}
    .biz-btn-list {max-width: 1170px;}
    .biz-btn {height: 65px; padding: 0 30px; font-size: 26px;}
	
	.works-btn-list {max-width: 1170px;}
    .works-btn {height: 65px; padding: 0 30px; font-size: 26px;}

    .banner-container {height: 130px;}
    .slide-box > h1 {font-size: 112px;}



    .pf-inner {padding: 0 50px 190px; margin-top: -190px;}

    .more-btn {margin-top: 70px; font-size: 90px;}
    .more-btn::after {top: 58%;}



    .contact-btn {width: 230px; height: 65px; font-size: 26px; line-height: 65px;}



    .footer-inner {flex-direction: column; gap: 20px;}
    .foot-info {justify-content: start;}
    .foot-info:first-of-type {padding-bottom: 8px;}
}

@media screen and (max-width: 1300px) {
    .core-inner {padding: 120px 0 110px;}
    .core-list {padding: 10px 20px 40px;}

    
    .biz-inner {padding: 160px 20px 120px;}
    .biz-btn-list {margin: 60px auto 0;}
	
	.works-btn-list {margin: 60px auto 0;}



    .pf-wrap {gap: 40px;}
    .pf-list {font-size: 22px; line-height: 32px;}
    .pf-link {padding-top: 5px;}



    .footer-inner {padding: 50px 20px 35px;}
}

@media screen and (max-width: 1020px) {
    .heading {margin-top: 25%;}



    .gnb {display: none;}
    .ham-btn {display: block;}



    .visual-inner {min-height: 600px;}
    .visual-list li:first-of-type {font-size: 60px !important;}
    .visual-list li:nth-of-type(2) {font-size: 32px; line-height: 48px;}

    .scroll-down {bottom: 80px; width: 55px; height: 55px;}
    .scroll-down img {width: 18px;}



    .content-text {margin-bottom: -35px !important; font-size: 65px !important;}
    .content-title {font-size: 35px; line-height: 50px;}



    .core-list li {font-size: 24px; line-height: 40px;}
    .core-swiper .swiper-slide {border-radius: 20px;}



    .biz-inner {padding: 160px 0 95px;}
    .biz-btn-list {column-gap: 10px; row-gap: 15px; margin: 40px auto 0;}
    .biz-btn {height: 50px; padding: 0 22px; font-size: 20px;}
	
	.works-btn-list {column-gap: 10px; row-gap: 15px; margin: 40px auto 0;}
    .works-btn {height: 50px; padding: 0 22px; font-size: 20px;}

    .banner-container {height: 85px;}
    .slide-box {margin: 0 30px;} 
    .slide-box > h1 {font-size: 73px;}



    .pf-inner {padding: 0 50px 130px; margin-top: -115px;}
    .pf-wrap {gap: 25px;}
    .pf-list {font-size: 18px; line-height: 26px;}

    .more-btn {padding-right: 80px; margin-top: 50px; font-size: 75px;}
    .more-btn::after {width: 50px; height: 50px; background-size: 18px;}



    .contact-btn {width: 220px; height: 60px; margin-top: 30px; font-size: 24px; line-height: 60px;}



    .foot-info {flex-wrap: wrap; gap: 15px; row-gap: 10px;}
    .foot-info:first-of-type {padding-bottom: 10px;}
    .foot-info li {font-size: 15px;}
    .foot-info li:not(:last-of-type):after {display: none;}
    .copy {font-size: 15px;}



    .top-btn {display: none !important;}
}

@media screen and (max-width: 900px) {
    .intro {background:url(../images/intro_bg_m.png) center no-repeat; background-size: cover;}
	.intro-wrap.hivesolution .intro {background:url(../images/intro_bg_m_hive2.png) top center no-repeat; background-size: cover;}

    .heading {margin-top: 25%;}
	.hivesolution .heading {margin-top: 35%;}



    .biz-btn-list {overflow-x: auto; flex-wrap: nowrap; justify-content: start; max-width: none; padding: 0 20px;}
    .biz-btn-list::-webkit-scrollbar {display: none;}
    .biz-btn {white-space: nowrap;}
	
	.works-btn-list {overflow-x: auto; flex-wrap: nowrap; justify-content: start; max-width: none; padding: 0 50px;}
    .works-btn-list::-webkit-scrollbar {display: none;}
    .works-btn {white-space: nowrap; height: 45px; padding: 0 22px; font-size: 18px;}
}

@media screen and (max-width: 800px) {
    .heading {margin-top: 30%;}    
    .heading > div:nth-child(1) > p {font-size: 40px !important;}
    .heading > div:nth-child(2) > p {font-size: 25px !important;}

    .scroll-down {bottom: 60px; width: 40px; height: 40px;}
    .scroll-down img {width: 13px;}



    .header {height: 90px;}
    .header-inner {padding: 0 25px;}
    .logo {height: 90px;}
    .ham-btn {width: 90px; height: 90px;}

    .m-header {height: 90px; padding: 0 25px;}
    .m-header .m-logo a {height: 90px;}
    .m-header .ham-btn {width: 90px; height: 90px;}
    .m-header .ham-btn i,
    .m-header .ham-btn svg {font-size: 30px;}
    .m-menu .menu-wrap .one-depth-menu {padding: 0 25px;}
    .m-menu .menu-wrap .one-depth-menu > li {padding: 0 0 30px; margin-bottom: 30px;}
    .m-menu .menu-wrap .one-depth-menu > li > a {padding: 0;}



    .content-text {font-size: 58px !important; margin-bottom: -30px !important;}
    .content-title {font-size: 30px; line-height: 45px;}



    .core-swiper {padding: 0 20px;}
    .core-list li {font-size: 20px; line-height: 35px; word-break: keep-all;}
    .core-list li br {display: none;}



    .biz-inner {padding: 160px 0 80px;}
    .biz-btn {height: 50px; padding: 0 20px; font-size: 22px;}
	

    .banner-container {height: 75px;}
    .slide-box > h1 {font-size: 64px;}



    .pf-inner {padding: 0 20px 130px; margin-top: -115px;}
    .pf-wrap {gap: 20px;}
    .pf-list {padding: 10px; font-size: 16px; line-height: 24px;}
    .pf-type {display: none;}
    .pf-link {font-size: 13px;}

    .more-btn {font-size: 60px;}


    .contact-inner {padding: 130px 20px 170px;}
    .contact-img img {max-width: 175px;}
    .contact-btn {width: 195px; height: 55px; margin-top: 25px; font-size: 22px; line-height: 55px;}



    .foot-info li {font-size: 14px;}
    .copy {font-size: 13px;}	
}

@media screen and (max-width: 600px) {
    .heading {margin-top: 35%;}
    .heading > div:nth-child(1) > p {font-size: 30px !important;}
    .heading > div:nth-child(1) > p br {display: block !important;}
    .heading > div:nth-child(2) > p {font-size: 20px !important;}



    .core-swiper .swiper-slide {border-radius: 10px;}



    .pf-wrap {grid-template-columns:repeat(2, 1fr);}
	
	
	
	.biz-btn {height: 45px; padding: 0 20px; font-size: 17px;}
	
	.works-btn-list {padding: 0 25px; margin-top:30px;}
	.works-btn {height: 45px; padding: 0 20px; font-size: 17px;}
}

@media screen and (max-width: 500px) {
    .heading {margin-top: 45%;}
	.hivesolution .heading {margin-top: 45%;}



    .header {height: 75px;}
    .logo {height: 75px;}
    .logo a {width: 110px;}
    .ham-btn {width: 70px; height: 75px;}
    .ham-btn i, .ham-btn svg {font-size: 27px;}

    .m-header {height: 75px;}
    .m-header .m-logo a {width: 110px; height: 75px;}
    .m-header .ham-btn {width: 70px; height: 75px;}
    .m-header .ham-btn i, .m-header .ham-btn svg {font-size: 23px;}
    .m-menu .m-inner {padding-top: 20px;}
    .m-menu .menu-wrap .one-depth-menu > li {padding: 0 0 22px; margin-bottom: 22px;}
    .m-menu .menu-wrap .one-depth-menu > li > a {font-size: 16px;}

    .sub-content {padding-top: 80px; background-size: 150px;}



    .visual-inner {min-height: 480px;}
    .visual-list li:first-of-type {font-size: 44px !important;}
    .visual-list li:nth-of-type(2) {font-size: 24px; line-height: 40px;}



    .content-text {margin-bottom:-22px !important; font-size: 44px !important;}
    .content-title {padding: 0 20px; font-size: 22px; line-height: 34px;}
    
    
    
    .core-inner {padding:90px 0 100px;}
    .core-list li {font-size: 17px; line-height: 28px;}



    .biz-inner {padding:100px 0 30px;}
    .biz-btn-list {column-gap: 8px;}
    .biz-btn {height: 40px; font-size: 15px;}
	
	.works-btn-list {column-gap: 8px;}
    .works-btn {height: 40px; font-size: 15px;}

    .banner-container {height: 60px;}
    .slide-box > h1 {font-size: 50px;}



    .pf-inner {padding:0 20px 120px; margin-top: -80px;}
    .pf-wrap {gap: 15px;}

    .more-btn {font-size: 50px; padding-right: 50px;}
    .more-btn::after {width: 35px; height: 35px; background-size: 13px}



    .contact-inner {padding: 90px 20px 100px;}
    .contact-img img {max-width: 135px;}
    .contact-btn {width: 155px; height: 45px; margin-top: 20px; font-size: 18px; line-height: 45px;}
}

@media screen and (max-width: 400px) {
    .heading {margin-top: 50%;}
}



/* ====================================== SUB ====================================== */

/* 공통 */
.sub-content {padding-top: 110px; background: url(../images/header_objet.png) left 30px top no-repeat; background-size:355px;}
.hivesolution .sub-content {background: #fff;}

.content-inner {}
.content-inner.content-tb-pd {padding-top: 75px; padding-bottom: 175px;}
.content-inner.content-lr-pd {padding-left: 50px; padding-right: 50px;}
.content-inner.content-wait-pd {padding:75px 50px;}

.ctt-lr-pd {padding-left: 50px; padding-right: 50px;}

.font-pt {font-family: 'PTSerif' !important; font-weight: bold !important; font-style: italic !important;}
.font-pp {font-family: 'Poppins' !important; font-weight: 600 !important; letter-spacing:-2px;}
.link-btn {display: inline-block; width: 260px; height: 72px; text-align: center; font-size: 30px; font-weight: 300; line-height: 72px; background-color: #fff; border: 1px solid #000; border-radius: 100px; transition: .3s;}
.link-btn:hover {background-color: #000; color: #fff; transition: .3s;}

.submit-btn {display: inline-block; width: 260px; height: 72px; text-align: center; font-size: 25px; font-weight: 300; line-height: 72px; background-color: #fff; border: 1px solid #000; border-radius: 100px; transition: .3s;}
.submit-btn:hover {background-color: #000; color: #fff; transition: .3s;}

.sub-category-title {padding-bottom:90px;}
.sub-category-title .sub-content-title {padding-bottom: 0px;}

.sub-content-title {padding-bottom: 90px;}
.sub-content-title h1 {font-size: 70px; text-align: center; color:#333;}
.sub-content-title h3 {font-size: 35px; font-weight: 300; text-align: center; color:#333; word-break: keep-all;}


/* 회사소개서 다운로드 */
.we-objet-img1 {animation: obj-ani 1.8s ease-in-out infinite; width:80px; height:80px; border-radius:100px; background:#000; text-align:center; line-height:auto; padding-top:28px; font-size:13px; position:fixed; right:30px; bottom:100px; z-index:100000; color:#fff; box-shadow:2px 2px 6px 3px rgba(0, 0, 0, 0.1);}



/* WE ARE */
.we-sec-a {padding: 0 50px;}
.we-objet-img {position: relative; text-align: center; height: 250px; animation: obj-ani 1.8s ease-in-out infinite;}
.we-txt-list {text-align: center;}
.we-txt-list li:not(:last-of-type) {margin-bottom: 30px;}
.we-txt-list li h1 {font-size: 70px; word-break: keep-all;}
.we-txt-list li h2 {font-size: 35px; line-height: 50px; font-weight: 300; color: #333; word-break: keep-all;}
.we-txt-list li h3 {font-size: 25px; line-height: 40px; font-weight: 500; color: #333; word-break: keep-all;}
.we-txt-list li ul li {font-size: 20px; line-height: 35px; font-weight: 300; color: #111; word-break: keep-all;}
.we-txt-list li ul li b {font-weight: 500; word-break: keep-all;}
.m-br {display: none;}

@keyframes obj-ani {
    0% {transform:translateY(0);}
    50% {transform:translateY(25px);}
    100% {transform:translateY(0);}
}


.we-sec-b {padding-top: 120px;}
.we-box-wrap {position: relative; display: flex; justify-content: center; gap: 60px; max-width: 1920px; padding: 0 50px; margin: 0 auto; z-index: 1;}
.we-box {display: flex; width: calc(100% / 3); height: 500px; border-radius: 30px;}
.we-box.a-ver {background: url(../images/we_are_box_img_01.png) no-repeat; background-size: cover;}
.we-box.b-ver {background: url(../images/we_are_box_img_02.png) no-repeat; background-size: cover;}
.we-box.c-ver {background: url(../images/we_are_box_img_03.png) no-repeat; background-size: cover;}
.we-box-list {text-align: center; margin: auto;}
.we-box-list li {color: #fff; word-break: keep-all;}
.we-box-list li.we-box-title {padding-bottom: 50px; font-size: 26px; font-weight: 700;}
.we-box-list li.we-box-text {font-size: 26px; font-weight: 500; line-height: 40px;}

.text-banner.we-ver {position: relative; margin-top: -215px;}
.text-banner.we-ver .slide-box > h1 {-webkit-text-stroke: 1px #5f5f5f; opacity: 0.3;}


.we-sec-c {position: relative; padding-top: 210px; margin-bottom: -480px;}
.we-sec-c.hs-ver {margin-bottom: -1500px;}
.we-history {position: relative;}
.we-history::before {content: ""; position: absolute; top: 40px; right: 0; width: 100%; max-width: 1522px; height: calc(100% - 40px); border-radius: 0 0 0 80px;}
.history-left {position: relative; width: 100%; height: 100%;}
.history-left:before {content: ""; position: absolute; top: 40px; right: 0; width: 1522px; height: 120px; background: linear-gradient(to top, rgba(20, 20, 20, 0) 0%, #141414 90%); z-index: 2;}
.history-left::after {content: ""; position: absolute; top: 0; left: 0; width: 900px; height: 1000px;  border-radius: 0 80px 80px 0; background:url(../images/we_are_bg.png) center no-repeat; background-size: cover; z-index: 3;}
.hivesolution .history-left::after {background:url(../images/we_are_bg_hivesolution.png) center no-repeat; background-size: cover;}

.history-left-inner {position: relative; position: absolute; top: 40px; right: 0; width: 1522px; height: 1100px; border-radius: 80px 0 0 80px; background-color: #141414;}
.history-left-inner::before {content: ""; position: absolute; top: -41px; right: 0; width: 1522px; height: 40px; background-color: #fff; z-index: 2;}
.large-child {position: relative;}
.history-right {position: relative; padding:135px 50px 130px 0; margin-left: 1000px;}
.history-title {position: relative; margin-bottom: 70px;}
.history-title h1 {font-size: 120px;}
.history-title h3 {font-size: 55px;}
.histoy-list li {word-break: keep-all; font-feature-settings: "tnum";font-variant-numeric: tabular-nums;}
.histoy-list > li {display: flex; gap:50px;}
.histoy-list > li:not(:last-of-type) {margin-bottom: 70px;}
.histoy-list > li h6 {font-size: 30px; font-weight: 700; color: #fff;}
.history-inner-list li {font-size: 18px; font-weight: 500; line-height: 34px; color: #fff;}


.we-sec-d {position:relative; padding: 160px 50px 0; text-align: center; z-index:1;}
.contact-title {padding-bottom: 60px;}
.contact-title h1 {font-size: 100px;}
.contact-title h3 {font-size: 55px; line-height: 80px; word-break: keep-all;}



/* WORKS */
.sub-content .pf-inner {margin-top: 0;}
.sub-content .more-btn::after {background: url(../images/arrow_down_bk.png) center no-repeat;}
.sub-content .more-btn:hover {-webkit-text-stroke: 1px #181818; color: #181818; transition: .3s;}
.sub-content .more-btn:hover::after {border: 1px solid #181818; background: url(../images/arrow_down.png) center no-repeat #181818; transition: .3s;}


/* WORKS - detail */
.pf-detail-content {}
.pf-detail-title-bar {max-width:1200px; margin:0 auto; margin-bottom:60px; text-align:center;}
.pf-detail-title {margin-bottom:35px; font-size:38px; font-weight:500; word-break:keep-all;}
.pf-link-btn {display: inline-block; width: 200px; height: 65px; text-align: center; font-size: 20px; font-weight: 300; line-height: 65px; background-color: #fff; border: 1px solid #000; border-radius: 100px; transition: .3s;}
.pf-link-btn:hover {background-color: #000; color: #fff; transition: .3s;}

.pf-detail-list-bar {width:100%; max-width:1200px; height:65px; margin:0 auto; border-radius:15px; background-color:#f7f7f7;}
.pf-detail-list {display:flex; width:100%; height:100%;}
.pf-detail-list li {width: calc(50% - 65px / 2);}
.pf-detail-list li:not(:last-of-type) {position:relative;}
.pf-detail-list li:not(:last-of-type)::before {content:""; position:absolute; top:50%; right:0; transform:translateY(-50%); width:1px; height:calc(100% - 20px); background-color: #e1e1e1;}
.pf-detail-list li.pf-list-btn {width:65px;}
.pf-detail-list li.pf-other-btn {}
.pf-detail-list li a {display:flex; width:100%; height:100%;}

.pf-detail-list li.pf-list-btn i {font-size:25px; color:#333; margin:auto; transition:.3s;}
.pf-detail-list li.pf-list-btn:hover i {color:var(--blue); transition:.3s;}

.pf-detail-list li.pf-other-btn p {display:flex; gap:10px; width:100%; padding:0 25px;}
.pf-detail-list li.pf-other-btn p span {line-height:65px;}
.pf-detail-list li.pf-other-btn p span.pf-other-text {width:40px;}
.pf-detail-list li.pf-other-btn p span.pf-other-title {max-width: calc(100% - 50px); color:#999; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; transition:.3s;}
.pf-detail-list li.pf-other-btn a:hover span.pf-other-title {color:var(--blue); transition:.3s;}
.hivesolution .pf-detail-list li.pf-other-btn a:hover span.pf-other-title {color:var(--yellow); transition:.3s;}

.pf-detail-img {display: flex; margin:25px 0 60px;}
.pf-detail-img img {margin: auto;}



/* CONTACT */
.ctt-title-wrap {display: flex; justify-content: space-between; gap: 110px; max-width: 1212px; padding-bottom: 90px; margin: 0 auto;}
.ctt-title h1 {font-size: 70px; text-align: center; color:#333;}
.ctt-title h3 {font-size: 35px; font-weight: 300; text-align: center; color:#333; word-break: keep-all;}

.ctt-list {margin: auto 0;}
.ctt-list li {display: flex; gap: 60px;}
.ctt-list li h6 {width: 85px; font-size: 18px; font-weight: 700; line-height: 35px; color: #333;}
.ctt-list li p {font-size: 18px; font-weight: 300; line-height: 35px; color: #111; word-break: keep-all;}

.map-box {display: flex; justify-content: center;}
.map-box .root_daum_roughmap {border-radius: 30px;}
.map-box .root_daum_roughmap .border1,
.map-box .root_daum_roughmap .border2,
.map-box .root_daum_roughmap .border3,
.map-box .root_daum_roughmap .border4 {border: none; opacity: 0;}
.map-box .root_daum_roughmap .wrap_controllers {display: none;}


.text-banner.ctt-ver {position: relative; margin-top: -240px;}
.text-banner.ctt-ver .slide-box > h1 {-webkit-text-stroke: 1px #5f5f5f; opacity: 0.1;}

.ctt-form {padding-top: 90px;}
.form-title {padding-bottom: 75px; text-align: center;}
.form-title h1 {padding-bottom: 15px; font-size: 55px; font-weight: 700; color: #161616; word-break: keep-all;}
.form-title p {font-size: 25px; font-weight: 300; color: #333; word-break: keep-all;}
.form-title p br {display: none;}

.form-wrap {}
.category-wrap {max-width: 1212px; padding-bottom: 35px; margin: 0 auto;}
.form-item-wrap {max-width: 1212px; display: flex; flex-wrap: wrap; gap: 30px; margin: 0 auto;}
.form-item-wrap .form-item {width: calc(50% - 15px);}
.form-item-wrap .form-item.only {width: 100%;}
.form-item-wrap .form-item:not(.only) {height: 50px; display: flex; border-bottom: 1px solid #000;} 
.form-item-wrap .form-item:not(.only) h5 {font-size: 22px; font-weight: 500; line-height: 49px; color:#333;}
.category {display: flex; gap:10px}
.category li button {width: 140px; height: 50px; font-size: 20px; font-weight: 300; color: #272727; border-radius: 50px; border: 1px solid #272727; background-color: #fff; transition: .3s;}
.category li:hover button,
.category li.on button {color: #fff; background-color: #272727; transition: .3s;}

.textarea-title {display:inline-block; height:50px; font-size: 22px; font-weight: 500; color: #333; word-break: keep-all; line-height:50px;}
.form-inner-box {padding: 25px; border: 1px solid #000;}
.form-inner-box .textarea textarea {width: 100%; min-height: 270px; resize: none; padding-top:5px; margin-bottom: 15px; font-size: 18px; border: none; outline: none;}
.form-inner-box .filebox {display: flex; align-items: center; margin: 0; color: gray;}
.form-inner-box .filebox span {display: block; font-size: 18px; font-weight: 300; color: #111;}
.form-inner-box .filebox label {display: inline-block; min-width:110px; max-width: 50%; height: 40px; padding: 0 15px; margin-right: 10px; text-align: center; line-height: 40px; color: #FFF; white-space: nowrap; text-overflow: ellipsis; vertical-align: middle; background: #272727; border-radius: 100px; cursor: pointer; overflow: hidden;}
.form-inner-box .filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
 
.form-item .project-box.input-ver {display:flex; width:100%;}
.form-item .project-box.input-ver h5 {min-width:180px; width:180px;}
.form-item .project-box.input-ver input[type="text"] {flex:1; border:none; outline:none; font-size: 18px; font-weight: 300;}
.form-item #project_02 input[type="radio"],
.form-item #project_03 input[type="radio"] {display: none;}
.form-item #project_02, 
.form-item #project_03 {position: relative; display: flex; justify-content: space-between; width: 100%;}
.form-item #project_02 ul, 
.form-item #project_03 ul {position: absolute; top: 50px; left:0; margin: 0; padding: 0; width: 100%; display: none; z-index: 7; box-shadow: 2px 2px 6px 3px rgba(0, 0, 0, 0.1);}
.form-item #project_02 li, 
.form-item #project_03 li {position: relative; background-color: #efefef; transition: .3s;}

.form-item #project_02 li:hover, 
.form-item #project_03 li:hover {background-color: #d9d9d9; transition: .3s;}
.form-item #project_02 li:not(:last-of-type)::before, 
.form-item #project_03 li:not(:last-of-type)::before {content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; border-bottom: 1px solid #cacaca; transition: .3s;}
.form-item #project_02 li:hover::before, 
.form-item #project_03 li:hover::before {opacity: 0; transition: .3s;}

.form-item #project_02 li label, 
.form-item #project_03 li label {display: inline-block; padding: 12px 15px; width: 100%; color: #000;}
.form-item #project_02 button , 
.form-item #project_03 button {position: relative; width: calc(100% - 180px); margin: 0; text-align: left; font-size: 18px; font-weight: 300; line-height: 49px; color: #111; border: none; background-color: transparent;}
.form-item #project_02 button i , 
.form-item #project_03 button i {position: absolute; top: 50%; right: 10px; transform: translateY(-50%); font-size: 18px; color: #666;}
.form-item #project_02 input[type="text"] ,
.form-item #project_03 input[type="text"] {width:100%; font-size:18px; font-weight: 300; color:#111; background-color: transparent; border:none; outline: none;}

.submit-btn-wrap {width: 100%; padding-top: 35px; text-align: center;}

#file_str {transition:.3s;}
#file_str:has(.file_str_item) {padding: 10px; margin-top:10px; background: #f1f1f1; border-radius:5px; transition:.3s;}
#file_str .file_str_item {position:relative; padding-left:20px; font-size:14px; word-break: break-word;}
#file_str .file_str_item::before {content: "\ea94"; font-family: xeicon !important; position:absolute; top:0; left:0; font-size:15px;}
#file_str .file_str_item:not(:last-of-type) {margin-bottom:10px;}



/* 준비중 */
.wait-content {display:flex; min-height:calc(100vh - 451px);}
.wait-content-inner {margin:auto;}
.wait-img {position:relative; margin-bottom:-70px; text-align:center; z-index:1; animation: obj-ani2 1.8s ease-in-out infinite;}
.wait-title {text-align:center; font-family: 'PTSerif' !important; font-weight: bold !important; font-style: italic !important; font-size:100px; color:#f0f0f0;}
.hivesolution .wait-title {font-family: 'Poppins' !important; font-weight: 600 !important; font-style: normal !important; letter-spacing:-2px;}
.wait-title.m-br {display:none;}
.wait-list {padding-top:5px; text-align:center;}
.wait-list li {word-break:keep-all;}
.wait-list li:first-of-type {padding-bottom:20px; font-size:35px; font-weight:700; color:#333;}
.wait-list li:last-of-type {font-size:25px; font-weight:300; color:#333;}

@keyframes obj-ani2{
    0% {transform:translateY(0);}
    50% {transform:translateY(-20px);}
    100% {transform:translateY(0);}
}



/* sub 반응형 */
@media screen and (min-width: 2300px) {
    .history-left:before {width: calc(100% - 700px);}
    .history-left-inner {width: calc(100% - 700px);}
}

@media screen and (max-width: 1900px) {
    .history-left::after {width: 800px;}
    .history-right {margin-left: 910px;}



    .map-box {padding: 0 50px;}
}

@media screen and (max-width: 1750px) {
    .sub-content {background-size: 280px;}
    

    
    .we-sec-c {padding-top: 160px; margin-bottom: 0;}
	.we-sec-c.hs-ver {margin-bottom: -1950px;}
    
	.we-history {max-height: 2300px;}
	.we-sec-c.hs-ver .we-history {max-height: none	;}
    .history-left::after {width: 700px; height: 110vh; border-radius: 0 60px 60px 0;}
    .history-left-inner {width: 100%; max-width: 80%; height: 120vh; border-radius: 60px 0 0 60px;}
    .history-right {margin-left: 800px;}
    .history-right .back-text {margin-bottom: -40px !important;}
    .history-title h1 {font-size: 100px;}
    .history-title h3 {font-size: 48px;}
    .histoy-list > li {flex-direction: column; gap: 35px;}
}

@media screen and (max-width: 1600px) {
    .we-box-wrap {gap: 35px;}

    .history-left::after {width: 600px;}
    .history-right {margin-left: 680px;}
}

@media screen and (max-width: 1450px) {
    .sub-content {background-size: 240px;}
    .content-inner.content-tb-pd {padding-top: 65px; padding-bottom: 155px;}

	.sub-category-title {padding-bottom:70px;}
    .sub-content-title {padding: 0 50px 70px;}
    .sub-content-title h1 {font-size: 60px;}
    .sub-content-title h3 {font-size: 30px;}
    


    .we-objet-img {height: 230px;}
    .we-objet-img {margin-bottom: 10px;}
    .we-objet-img img {max-width: 190px;}
    .we-txt-list li h1 {font-size: 60px;}
    .we-txt-list li h2 {font-size: 30px; line-height: 45px;}
    .we-txt-list li h3 {font-size: 22px; line-height: 36px;}

    .we-box-wrap {gap: 30px;}
    .we-box {height: 450px;}
    .we-box-list li.we-box-title {padding-bottom: 35px;}
    .we-box-list li.we-box-text {font-size: 23px; font-weight: 500; line-height: 38px;}
    .text-banner.we-ver {margin-top: -175px;}

	.we-sec-c.hs-ver {margin-bottom: -1800px;}
    .we-history {max-height: 2000px;}
    .history-left::after {height: 105vh; border-radius: 0 50px 50px 0;}
    .history-left-inner {height: 110vh; border-radius: 50px 0 0 50px;}
    .history-title h1 {font-size: 78px;}
    .history-title h3 {font-size: 42px;}
    .histoy-list > li {gap: 30px;}
    .histoy-list > li h6 {font-size: 25px;}
    .history-inner-list li {font-size: 16px; line-height: 30px; word-break: keep-all;}

    .contact-title {padding-bottom: 45px;}
    .contact-title .back-text {margin-bottom: -40px !important;}
    .contact-title h1 {font-size: 78px;}
    .contact-title h3 {font-size: 42px; line-height: 60px;}
    .link-btn {width: 235px; height: 68px; font-size: 27px; line-height: 68px;}



    .ctt-title-wrap {gap: 70px; padding: 0 50px 70px;}
    .ctt-title h1 {font-size: 60px;}
    .ctt-title h3 {font-size: 30px;}
    .ctt-list li {gap: 50px;}

    .map-box .root_daum_roughmap {border-radius: 20px;}

    .text-banner.ctt-ver {margin-top: -200px;}

    .ctt-form {padding-top: 70px;}
    .form-title {padding: 0 50px 75px;}
    .form-title h1 {font-size: 45px;}
    .submit-btn {width: 250px; height: 70px; font-size: 23px; line-height: 70px;}

    .category-wrap {max-width: none;}
    .category {padding: 0 50px 5px; overflow-x: auto;}
    .category::-webkit-scrollbar {display: none;}
    .form-item-wrap {max-width: none; padding: 0 50px;}
	
	
	
	.wait-img {margin-bottom:-60px;}
	.wait-img img {max-width:220px;}
	.wait-title {font-size:80px;}
}

@media screen and (max-width: 1300px) {
    .history-left::after {width: 500px;}
    .history-right {margin-left: 560px;}
}

@media screen and (max-width: 1200px) {
    .we-objet-img {height: 180px;}
    .we-objet-img img {max-width: 160px;}
    .we-txt-list li:not(:last-of-type) {margin-bottom: 20px;}
    .we-txt-list li h1 {font-size: 50px;}
    .we-txt-list li h2 {font-size: 24px; line-height: 38px;}
    .we-txt-list li h3 {font-size: 20px; line-height: 33px;}

    .we-sec-b {padding-top: 100px;}
    .we-box-wrap {gap: 25px;}
    .we-box {height: 400px; border-radius: 20px;}
    .we-box-list li.we-box-title {font-size: 22px; padding-bottom: 30px;}
    .we-box-list li.we-box-text {font-size: 17px; line-height: 30px;}

    .we-sec-c {padding-top: 120px;}
	.we-sec-c.hs-ver {margin-bottom: -1420px;}
    .we-history {max-height: 1600px;}
    .history-left::after {width: 400px; border-radius: 0 30px 30px 0;}
    .history-left-inner {border-radius: 30px 0 0 30px;}
    .history-right {padding: 100px 50px 0 0; margin-left: 460px;}
    .history-right .back-text {margin-bottom: -20px !important;}
    .history-title {margin-bottom: 50px;}
    .history-title h1 {font-size: 60px;}
    .history-title h3 {font-size: 33px;}
    .histoy-list > li {gap: 20px;}
    .histoy-list > li:not(:last-of-type) {margin-bottom: 50px;}
    .histoy-list > li h6 {font-size: 20px;}
    
    .contact-title {padding-bottom: 35px;}
    .contact-title .back-text {margin-bottom: -30px !important;}
    .contact-title h1 {font-size: 60px;}
    .contact-title h3 {font-size: 33px; line-height: 45px;}
    .link-btn {width: 200px; height: 55px; font-size: 21px; line-height: 55px;}
	
	.form-item-wrap .form-item h5 {font-size:20px !important;}
	.form-item .project-box.input-ver h5 {min-width:160px; width:160px;}
	.form-item #project_02 button, .form-item #project_03 button {width:calc(100% - 160px);}
	


    .ctt-title-wrap {flex-direction: column;}
    .ctt-list {margin: auto;}


    .text-banner.ctt-ver {margin-top: -190px;}
	
	
	
	.pf-detail-title {margin-bottom: 30px; font-size: 35px;}
	.pf-link-btn {width: 185px; height: 60px; font-size: 19px; line-height: 60px;}
}

@media screen and (max-width: 1020px) {
    .sub-content {background-size: 200px;}
    .content-inner.content-tb-pd {padding-top: 30px; padding-bottom: 140px;}
    .sub-content-title h1 {font-size: 50px;}
    .sub-content-title h3 {font-size: 28px;}



    .we-objet-img img {max-width: 130px;}
    .we-txt-list li h1 {font-size: 35px;}
    .we-txt-list li h2 {font-size: 20px; line-height: 32px;}
    .we-txt-list li h3 {font-size: 18px; line-height: 30px;}
    .we-txt-list li ul li {font-size: 16px; line-height: 28px;}

    .we-sec-b {padding-top: 80px;}
    .we-box-wrap {flex-direction: column; gap: 30px;}
    .we-box {margin: 0 auto; width: 370px; height: 350px;}
    .text-banner.we-ver {margin-top: -120px;}

    .we-sec-c {padding-top: 90px;}
	.we-sec-c.hs-ver {margin-bottom: 0;}
    .we-history {max-height: none; background-color: #141414;}
    .history-left::after {width: calc(100% - 50px); height: 300px; border-radius: 0 20px 20px 0;}
    .history-right {padding: 380px 50px 160px; margin-left: 0;}
    .history-title {text-align: center; margin-bottom: 60px;}
    .history-title h1 {font-size: 48px;}
    .history-title h3 {font-size: 30px;}
    .histoy-list > li {text-align: center;}
    .we-objet-img {height: 160px;}
    .histoy-list > li:not(:last-of-type) {margin-bottom: 65px;}

    .contact-title {padding-bottom: 30px;}
    .contact-title h1 {font-size: 48px;}
    .contact-title h3 {font-size: 30px; line-height: 40px;}
    .link-btn {width: 170px; height: 50px; font-size: 18px; line-height: 50px;}



    .sub-content .more-btn::after {background-size: 18px;}
    .sub-content .more-btn:hover::after {background-size: 18px;}



    .ctt-title-wrap {gap: 50px;}
    .ctt-title h1 {font-size: 50px;}
    .ctt-title h3 {font-size: 28px;}

    .ctt-form {padding-top:50px;}
    .form-title {padding: 0 50px 50px;}
    .form-title h1 {padding-bottom: 10px; font-size: 35px;}
    .form-title p {font-size: 23px;}
    .form-item-wrap .form-item {width: 100%;}
    .textarea-title {display: inline-block; height: 50px; line-height: 50px;}
    .submit-btn-wrap {padding-top: 20px;}
    .submit-btn {width: 220px; height: 60px; font-size: 20px; line-height: 60px;}
	
	.text-banner.ctt-ver {margin-top: -120px;}
	
	
	
	.pf-detail-title {margin-bottom: 25px; font-size: 32px;}
	.pf-link-btn {width: 180px; height: 55px; font-size: 18px; line-height: 55px;}
	
	
	
	.wait-img {margin-bottom: -45px;}
	.wait-img img {max-width: 190px;}
	.wait-title {font-size: 65px;}
	.wait-list li:first-of-type {padding-bottom: 18px; font-size: 33px;}
}

@media screen and (max-width: 800px) {
    .sub-content {background-size: 185px; padding-top: 90px;}
    .content-inner.content-tb-pd {padding-top: 20px; padding-bottom: 120px;}
	
	.sub-category-title {padding-bottom:50px;}
    .sub-content-title {padding: 0 50px 50px;}
    .sub-content-title h1 {font-size: 45px;}
    .sub-content-title h3 {padding-top: 5px; font-size: 26px;}



    .we-sec-a {padding: 0 50px;}
    .we-objet-img {height: 160px;}
    .we-txt-list li ul li {padding:0 50px;}
    .we-txt-list li ul li br {display: none;}
    

    
    .ctt-title-wrap {padding: 0 50px 50px;}
    .ctt-title h1 {font-size: 45px;}
    .ctt-title h3 {padding-top: 5px; font-size: 26px;}
    .ctt-list li {gap: 40px;}


    .map-box .root_daum_roughmap {border-radius: 15px;}


    .form-title h1 {font-size: 30px;}
    .form-title p {font-size: 18px; line-height: 28px;}
    .category {gap:8px}
    .category li button {font-size: 18px;}
    .form-inner-box .filebox {flex-direction: column; gap: 15px; align-items: baseline;}
    .form-inner-box .filebox label {max-width: 100%;}
    .submit-btn-wrap {padding-top: 10px;}
    .submit-btn {width: 170px; height: 50px; font-size: 16px; line-height: 50px;}
	
	
	
	.pf-detail-title-bar {margin-bottom:50px;}
	.pf-detail-title {margin-bottom: 20px; font-size: 27px;}
	.pf-link-btn {width: 165px; height: 52px; font-size: 17px; line-height: 52px;}
	.pf-detail-list-bar {height:60px; border-radius:10px;}
	.pf-detail-list li {width: calc(50% - 60px / 2);}
	.pf-detail-list li.pf-list-btn {width:60px;}
	.pf-detail-list li.pf-other-btn p {gap:5px; padding:0 20px;}
	.pf-detail-list li.pf-other-btn p span  {line-height:60px;}
	
	
	.pf-detail-list li.pf-list-btn i {font-size:22px;}
	.pf-detail-img {display: flex; margin: 20px 0 50px;}
	
	
	
	.wait-content {min-height: 400px;}
	.wait-img {margin-bottom: -30px;}
	.wait-img img {max-width: 170px;}
	.wait-title {font-size: 55px; line-height: 56px;}
	.wait-list {padding-top: 15px;}
	.wait-list li:first-of-type {padding-bottom: 15px; font-size: 28px;}
	.wait-list li:last-of-type {font-size:22px;}
}

@media screen and (max-width: 700px) {
	.sub-category-title {padding-bottom:40px;}
    .sub-content-title {padding: 0 50px 40px;}



    .ctt-title-wrap {gap: 40px; padding: 0 50px 40px;}
    .ctt-list {margin: 0;}
    .ctt-list li {flex-direction: column; gap: 0;}
    .ctt-list li:not(:last-of-type) {margin-bottom: 15px;}
    .ctt-list li h6 {font-size:15px; line-height: 28px;}
    .ctt-list li p {font-size:15px; line-height: 28px;}
}

@media screen and (max-width: 650px) {
    .we-txt-list li h3 {padding: 0 10px;}
    .we-txt-list li h3 br {display: none;}
    .we-txt-list li h3 span {display: block;}

    .history-inner-list li:not(:last-of-type) {margin-bottom: 10px;}
    .history-inner-tt {display: block; color: #767676;}
	
	.pf-detail-list li {width:calc(100% - 60px);}
	.pf-detail-list li:not(:first-of-type)::before {display:none;}
	.pf-detail-list li.pf-other-btn.m-none-view {display:none;}
}

@media screen and (max-width: 600px) {
    .content-inner.content-lr-pd {padding-left: 25px; padding-right: 25px;}
	.content-inner.content-wait-pd {padding: 35px 25px;}
	
	.ctt-lr-pd {padding-left: 25px; padding-right: 25px;}
	
	.sub-content {background-size: 135px;}
    .sub-content-title {padding: 0 25px 40px;}
    .sub-content-title h1 {font-size: 30px;}
    .sub-content-title h3 {font-size:18px;}



    .we-sec-a {padding: 0 25px;}
    .we-objet-img {height: 130px;}
    .we-objet-img img {max-width: 100px;}
    .we-txt-list li ul li {padding: 0 30px;}

    .we-sec-b {padding-top: 50px;}
    .we-box-wrap {padding: 0 25px;}

    .we-sec-c {padding-top: 60px;}
    .history-right {padding: 380px 25px 120px;}
    .history-title h1 {font-size: 40px;}
    .history-title h3 {font-size: 26px; line-height: 36px;}

    .we-sec-d {padding: 120px 25px 0;}
    .contact-title .back-text {margin-bottom: -20px !important;}
    .contact-title h1 {font-size: 40px;}
    .contact-title h3 {font-size: 26px; line-height: 36px;}

    
    
    .map-box {padding: 0 25px;}


    .form-title {padding: 0 25px 35px;}
    .form-title h1 {font-size: 22px; line-height: 34px; padding-bottom: 5px;}
    .category {padding: 0 25px 5px;}
    .form-item-wrap {padding: 0 25px;}
    .form-item-wrap .form-item:not(.only) h5 {font-size: 16px !important; line-height:35px;}
	.form-item .project-box.input-ver h5 {min-width: 140px; width: 140px;}
	.form-item .project-box.input-ver input[type="text"] {font-size:15px;}
    .form-item #project_02 button, .form-item #project_03 button {width: calc(100% - 140px); font-size:15px; line-height:40px;}
	.form-item #project_02 button i, .form-item #project_03 button i {font-size:14px;}
    .textarea-title {font-size: 16px; }
    .form-inner-box {padding: 15px; margin-top: 0;}
    .form-inner-box .textarea textarea {font-size:15px;}
	
	.form-inner-box .filebox label {font-size:14px; min-width: 105px; height: 38px; line-height: 38px;}
	.form-inner-box .filebox span {font-size: 13px;}



    .ctt-title-wrap {gap: 35px; padding: 0 25px 40px;}
    .ctt-title h1 {font-size: 30px;}
    .ctt-title h3 {font-size:18px;}

	.category-wrap {padding-bottom:25px;}
    .category li button {width: 100px; height:45px; font-size:15px;}
	
	
		
	.pf-detail-list-bar {border-radius:5px;}
	.pf-detail-title {font-size:25px; line-height: 35px;}
	.pf-link-btn {width: 160px; height: 50px; font-size: 16px; line-height: 50px;}
	.pf-detail-list li.pf-list-btn i {font-size: 19px;}
	
	
	
	.wait-img {margin-bottom: -25px;}
	.wait-img img {max-width: 120px;}
	.wait-title {font-size: 40px; line-height: 38px;}
		
	.wait-title .m-br {display:block;}
	.wait-list li:first-of-type {font-size:22px;}
	.wait-list li:last-of-type {font-size: 16px;}
}

@media screen and (max-width: 500px) {
	.sub-content {padding-top:75px;}



    .we-txt-list li h2 br {display: none;}
    .we-txt-list li ul li {padding: 0 10px;}
    .we-txt-list li ul li b br {display: block;}

    .we-box {width: calc(100% - 20px);}
    .we-box-list {padding: 20px;}
    .text-banner.we-ver {margin-top: -86px;}

    .history-left::after {width: calc(100% - 35px); height: 240px;}
    .history-title h3 span {display: block;}
    .history-right {padding: 310px 25px 120px;}



    .sub-content .more-btn::after {background-size: 13px;}
    .sub-content .more-btn:hover::after {background-size: 13px;}



    .form-title p br {display: block;}
    .form-item-wrap .form-item:not(.only) {height: auto;}
	.form-item .project-box.input-ver input[type="text"] {width:100%; height:40px;}
	.form-item .project-box.input-ver {display:block;}
    .form-item #project_02,
    .form-item #project_03 {flex-direction: column;}
    .form-item #project_02 button,
    .form-item #project_03 button {width: 100%; max-height:40px;}
    .form-item #project_02 ul,
    .form-item #project_03 ul {top: 100px;}
    .textarea-title {height: auto; line-height: 30px;}
    .form-inner-box {margin-top: 15px;}
	
	.text-banner.ctt-ver {margin-top: -90px;}
	
	
		
	.pf-detail-title {margin-bottom:15px; font-size: 22px;}
	.pf-detail-list-bar {height:50px;}
	.pf-detail-list li.pf-list-btn {width: 50px;}
	.pf-detail-list li.pf-other-btn p {padding: 0 15px;}
    .pf-detail-list li.pf-other-btn p span {line-height: 50px;}
	.pf-detail-list li.pf-other-btn p span.pf-other-text {display:none;}
	.pf-detail-list li.pf-other-btn p span.pf-other-title {max-width:100%; font-size:15px;}
	.pf-link-btn {width: 150px; height: 48px; line-height: 48px;}
}