/*메인 common*/
.tit{font-size: 6rem; font-weight: 700; text-align: center; margin-bottom: 19.4rem; }
section.active .tit{animation: fadeInUp 1s 0.6s both; animation-delay: 0.2s;}
.sub-tit{font-size: 3rem; font-weight: 700; line-height: 1.4;}
section.active .fadeUp{animation: fadeInUp 1s 0.6s both;}

/* 메인 */
section{width: 100%; overflow-x: hidden;}
.main .sec-01,
.main .sec-02,
.main .sec-03,
.main .sec-04{min-height: 100vh; box-sizing: border-box;}
.main .sec-01{position: relative; padding: 0; }
.main .sec-01 .visual-img{overflow: hidden;}
.main .sec-01 .visual-img video,
.main .sec-01 .visual-img img{ height: 100vh;width: 100%;object-fit: cover; display: block;}
.main .sec-01 .inner{position: absolute; top: 29rem; transform: translate(-50%); left: 50%;}
.main .sec-01 .inner .txt{color: #fff; font-size: 8rem; font-weight: 700; line-height: 1.2; position: relative;}
.main .sec-01 .inner .txt span{display: block; animation: up 1s ease-out 1 both;}
.main .sec-01 .inner .txt span i{font-style: normal}
.main .sec-01.active .inner .txt span.ani-03 i {animation: fadeUp 0.4s 0.2s both;}
.main .sec-01 .inner .txt span + span{margin-top: 1rem;position: relative;}
.main .sec-01 .inner .txt .line{width: 100%; height: 1px; background: rgba(217, 217, 217, 0.2); display: none; position: absolute; top: 50%; transform: translateY(-50%); right: -42%;}
.main .sec-01 .inner .txt .line::before{content: ''; display: block; width: 16rem; height: 3px; background: #fff; position: absolute; top: 50%; transform: translateY(-50%); }
.main .sec-01.active .line{animation: fadeRight 0.4s 0.2s both; animation-delay: 1.4s;}

.main .sec-02{background: #000; color: #fff;}
.main .sec-02 .sec02-wrap{gap: 6rem;}
.main .sec-02.active .sec02-box:nth-child(1){animation-delay: 0.4s}
.main .sec-02.active .sec02-box:nth-child(2){animation-delay: 0.6s}
.main .sec-02.active .sec02-box:nth-child(3){animation-delay: 0.8s}
.main .sec-02 .img{position: relative; overflow: hidden; width: 100%;}

.main .sec-02 .img picture img{width: 100%;}
.main .sec-02 .txt{margin-top: 5rem; position: relative;}
.main .sec-02 .txt i{display: block; width: 1.4rem; height: 1.4rem; background: #DC202E; border-radius: 100%; margin-bottom: 2rem;}
.main .sec-02 .txt p{font-weight: 500; font-size: 2.4rem; line-height: 1.4;}
.main .sec-02 .txt-hover{opacity: 0; display: flex; transition: all .3s;  position: absolute; top: 0; left: 0; background: rgba(0, 1, 70, 0.64); width: 100%; height: 100%; flex-direction: column; justify-content: flex-end; }
.main .sec-02 .txt-hover a{font-size: 4rem; line-height: 1.4; font-weight: 600; margin-top: 2rem;}
.main .sec-02 .txt-hover .comming{margin: auto; text-align: center; font-weight: 600; font-size: 4rem; line-height: 1.4;}
.main .sec-02 .img:hover .txt-hover{opacity: 1;}
.main .sec-02 .sec02-box:nth-child(1) .txt-hover{padding: 10rem;}


.main .sec-03{ background: linear-gradient(172deg, #000 49.8%, #000 50%, #F3F3F3 50.2%, #F3F3F3 51%); position: relative; }
.main .sec-03 .fp-tableCell{position: relative; z-index: 1;}
/*.main .sec-03::before{content: ''; display: block; position: absolute; top: 30%; transform: translateY(-30%) rotate(-10deg); right: 7rem; background: url("../images/main/sec03_before.png") no-repeat center;background-size: contain; width: 97rem; height: 21rem;}*/
/*.main .sec-03::after{content: ''; display: block; position: absolute; top: 75%; transform: translateY(-75%) rotate(-10deg); left: 4rem; background: url("../images/main/sec03_after.png") no-repeat center;background-size: contain; width: 93rem; height: 24rem;}*/
.main .sec-03 .mainPortfolio-box{position: relative;}
.main .sec-03.active .mainPortfolio-box{animation-delay: 0.4s;}
/*.main .sec-03 .mainPortfolio-box::before{content: ''; display: block; position: absolute; top: -14.5rem; right: 7rem; transform: rotate(-10deg); background: url("../images/main/sec03_before.png") no-repeat center;background-size: contain; width: 97rem; height: 21rem;}*/
/*.main .sec-03 .mainPortfolio-box::after{content: ''; display: block; position: absolute; bottom: 12rem; transform: rotate(-10deg); left: 4rem; background: url("../images/main/sec03_after.png") no-repeat center;background-size: contain; width: 93rem; height: 24rem;}*/

.main .sec-03 .swiper-slide{background: #fff; border: 1px solid #fff; width: 41.5rem; height: 54rem; border-radius: 2rem; padding: 3rem;}
.main .sec-03 .swiper-slide .txt{display: flex; flex-direction: column; height: 100%; width: 100%;}
.main .sec-03 .swiper-slide .txt .txtTop{background: #111; padding: 3rem 3rem 2rem 3rem; border-radius: 2rem 2rem 0 0; position: absolute; top: 0; left: 0; width: 100%;}
.main .sec-03 .swiper-slide .txt .txtTop .tag{color: #fff; font-size: 1.6rem; line-height: 1.4; border-radius: 50rem; padding: 1rem 2rem; border: 2px solid transparent;background: linear-gradient(#484848, #484848) padding-box, linear-gradient(90deg, red, blue) border-box; }
.main .sec-03 .swiper-slide .txt .txtTop .arrow_up{display: block; font-size: 0; width: 4rem; height: 4rem; border-radius: 100%; background-color: #484848; background-image: url("../images/common/arrow_up.png"); background-repeat: no-repeat; background-size: 1.6rem 1.6rem; background-position: center center;}
.main .sec-03 .swiper-slide .txt .txtBt{margin: 10.2rem 0 3.6rem 0;}
.main .sec-03 .swiper-slide .txt .txtBt .sub-tit{color: #3A3A3A;}
.main .sec-03 .swiper-slide .txt .txtBt .desc{color:#686868; font-size: 1.8rem; line-height: 1.4; }
.main .sec-03 .swiper-slide .txt .img{margin-top: auto; border-radius: 2rem; box-shadow: 0 0 11px rgba(41, 77, 195, 0.2);}
.main .sec-03 .swiper-slide .txt .img img{width: 100%;}
.main .sec-03 .pagination-wrap{ width: 15rem; height: 7rem;position: absolute; left: 50%; transform: translateX(-50%); margin-top: 11rem;}
.main .sec-03 .pagination-wrap::before{content: ''; width: 1px; height: 3.6rem;background: rgba(0,0,0,.1); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.main .sec-03 .pagination-wrap div{flex: 1; width: 50%; position: relative; top: unset; left: unset; right: unset; margin: unset; transform: unset; border: none;}
.main .sec-03 .pagination-wrap div::after{content: ''; width: 100%; height: 100%; background-repeat: no-repeat; background-size: auto 3.6rem; background-position: center center;}
.main .sec-03 .pagination-wrap .swiper-button-next::after{background-image: url("../images/common/arrow_next.svg"); }
.main .sec-03 .pagination-wrap .swiper-button-prev::after{background-image: url("../images/common/arrow_prev.svg"); }

.main .sec-04{background-color: #F3F3F3; background-image: url("../images/main/sec04_bg.png"); background-repeat: no-repeat; background-size: 100%; background-position-y: bottom;}
.marquee-wrap{padding: 8rem 0; box-shadow: 4px 4px 15px rgba(0,0,0,.06);}
.marquee{display: flex;overflow: hidden;user-select: none;gap:var(--gap);}
.marquee_group{flex-shrink: 0;display: flex;align-items: center;justify-content: space-around;min-width: 100%;animation: scroll-x var(--duration) linear infinite;}
.marquee-reverse{margin-top: 9rem;}
.marquee-reverse .marquee_group{animation-direction: reverse;animation-delay: -3s;}
.fa{font-size: 70px!important}
.marquee .fa{display: grid;place-items:center;width: 300px;aspect-ratio:19/9;}
.marquee .fa img{aspect-ratio: 300 / 122;width: 100%;}

/* 서브페이지 공통 ------------------------------*/
.sub-wrap{margin-top: 8rem;}
.sub-banner{position: relative; width: 100%; height: 30rem; background-repeat: no-repeat; background-size: cover; background-position: center center; background-color: #ccc;}
.sub-banner .banner-tit{color: #fff; font-weight: 600; font-size: 5rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center;}
.sub-tab{ width: 100%; height: 6rem; border-bottom: 1px solid #DCDCDC;}
.sub-tab ul{justify-content: center; gap: 1rem; height: 100%; }
.sub-tab ul li{ height: 100%; color: rgba(0, 0, 0, 0.87); font-weight: 400; font-size: 2rem; line-height: 3rem; }
.sub-tab ul li a{width: 100%; height: 100%; display: flex;padding: 0 5rem; align-items: center; position: relative;}
.sub-tab ul li.active{font-weight: 700;}
.sub-tab ul li.active a::after{content: ''; display: block; width: 100%; height: 4px; background-color: #DC202E; position: absolute; bottom: 0; left: 0;}

.sub-content{padding: 10rem 0; background: #F9F9F9;}
.sub-inner{width: 100%; padding: 0 2rem; overflow: hidden; max-width: 124rem; box-sizing: border-box; margin: 0 auto;}
.sub-tit{font-size: 3rem; font-weight: 700; line-height: 1; margin-bottom: 2rem;}
.sub-desc{color: #333; line-height: 1.4;}
.sub-desc2{font-size: 2rem; font-weight: 600; line-height: 1.4; color: rgba(0, 0, 0, 0.87);}
.gap24{gap: 2.4rem;}

.list-disc{position: relative; display: flex; align-items: center; }
.list-disc::before{content: ''; display: inline-block; width: 3px; height: 3px; min-width: 3px; border-radius: 100%; background: #666666; margin-right: 1rem;}

.box-ty01 .bx-line{padding: 0; position: relative;}
.box-ty01 .bx-line b{display: inline-block; padding: 1rem 3rem; color: #fff; background: #131313; font-weight: 600; font-size: 2rem; line-height: 1;}
.box-ty01 .bx-line p{padding: 2rem; color: #333; line-height: 1.4;}

/*서브배너*/
.company .sub-banner{background-image: url("../images/company/company_banner.jpg");}
.skill .sub-banner{background-image: url("../images/skill/skill_bg.jpg");}
.portfolio .sub-banner{background-image: url("../images/portfolio/info_banner.jpg");}
.inquiry .sub-banner{background-image: url("../images/inquiry/info_banner.jpg");}
.terms .sub-banner{background-image: url("../images/terms/info_banner.jpg");}
.product .sub-banner{background-image: url("../images/product/info_banner.jpg");}


/*회사*/

.sub-content .sec-01 .cont{margin-top: 4rem;}
.sub-content .sec-02{margin-top: 10rem;}
#info .cont .bx-line{text-align: center;}
#info .cont .bx-line img{margin: 0 auto 4rem auto;}
#info .cont .bx-line p{font-weight: 500; color: #666; margin-bottom: 1.2rem;}
#info .cont .bx-line b{display: block; font-weight:700; font-size: 2.4rem; color: rgba(0, 0, 0, 0.87); line-height: 1;}
#info .cont01{position: relative; }
#info #map{width: 100%; background: #ccc; height: 47.5rem;}
#info .cont01 .map-txt{display: flex; flex-direction: column; justify-content: center; gap: 6rem; line-height: 1.4; position: absolute; z-index: 1; top: 0; right: 0; text-align: center; background: #000; color: #fff; width: 28.5rem; height: 100%;}
#info .cont01 .map-txt div{position: relative;}
#info .cont01 .map-txt div::before{content: ''; display: block; width: 1px; height: 4rem; background: #d9d9d9; position: absolute; bottom: -4.7rem; left: 50%; transform: translateX(-50%);}
#info .cont01 .map-txt div:last-child::before{content: none;}
#info .cont01 .map-txt b{display: block; width: 100%; font-weight: 600;}
#info .cont02{margin-top: 2rem;}
#info .cont02 .bx-line{padding: 4rem; height: 32rem;}
#info .cont02 dl:first-child{margin-bottom: 3rem;}
#info .cont02 .bx-line .align-start{align-items: flex-start;}
#info .cont02 .bx-line:nth-child(2) dl{margin-bottom: 2rem;}
#info .cont02 dt{font-weight: 600; font-size: 1.8rem; line-height: 1;color: #333; margin-bottom: 2rem;}
#info .cont02 dt i{display: inline-block; width: 2.4rem; height: 2.4rem; margin-right: 6px; background-repeat: no-repeat; background-size: contain; background-position: center;}
#info .cont02 dt i.ico-bus{background-image: url("../images/company/info02_1.svg");}
#info .cont02 dt i.ico-car{background-image: url("../images/company/info02_2.svg");}
#info .cont02 dt i.ico-building{background-image: url("../images/company/info02_3.svg");}
#info .cont02 dd{color: #666666; line-height: 1; margin-left: 1rem;}
#info .cont02 dd + dd{margin-top: 1rem;}
#info .cont02 dd p{margin-right: 1rem;}
#info .cont02 dd span{line-height: 1;}
#info .cont02 dd span img{margin-right: 1rem;}
#info .info-table{width: 100%; height: auto;}

#vision .sub-tit,
#group .sub-tit,
#certify .sub-tit{margin-bottom: 4rem;}
#vision .sub-content{background: url("../images/company/vision_bg.png") no-repeat; background-position-y: 10rem; background-position-x: 62%;}
#vision .sec-01 .fc-blue{display: block; font-weight: 700; font-size: 4rem; line-height: 1;}

#group .cont .d-flex span{color: #636363; line-height: 1.4;}
#group .cont table{margin-top: 2rem;}

#certify .certify-items{flex-wrap: wrap; gap: 8rem;}
#certify .certify-item{ flex: 0 0 calc((100% - 24rem) / 4); }
#certify .certify-item p{text-align: center; margin-top: 2rem;}

/*기술*/
#business .img{padding: 9rem 0;}
#business img{margin: 0 auto;}
#business .box-ty01 .bx-line:nth-child(1) b{background: #336185;}
#business .box-ty01 .bx-line:nth-child(2) b{background: #33A29B;}
#business .box-ty01 .bx-line:nth-child(3) b{background: #338DC5;}

#technical .sub-content .sec-01 .cont{margin-top: 5rem;}
#technical .technical-item{position: relative; overflow: hidden; padding: 6rem 0; transition: all .3s ease; transition-delay: 0.2s; border-left: 1px solid #DFDFDF; box-sizing: border-box; flex: 1; background: #fff; height: 65rem; display: flex; align-items: flex-end;}
#technical .technical-item.active{flex: 2;}
#technical .technical-item .technical-ico{width: 7.4rem; height: 15rem; position: absolute; top: 6rem; letter-spacing: 0; display: flex; align-items: center; justify-content: center;}
#technical .technical-item .technical-ico::before{content: ''; display: block; position: absolute; top: 0; left: -7.5rem;z-index: 0; width: 15rem; height: 15rem; border-radius: 100%;}
#technical .technical-item:nth-child(1) .technical-ico::before{background: #9DCAE2;}
#technical .technical-item:nth-child(2) .technical-ico::before{background: #6FADD2;}
#technical .technical-item:nth-child(3) .technical-ico::before{background: #4E8BB8;}
#technical .technical-item:nth-child(4) .technical-ico::before{background: #336FA4;}
#technical .technical-item:nth-child(5) .technical-ico::before{background: #144774;}
#technical .technical-item .technical-ico img{z-index: 1;}
#technical .technical-item .txt-box{padding: 0 2rem;}
#technical .technical-item .txt-box .sub-desc2{line-height: 1;}
#technical .technical-item .txt-box .sub-desc{margin: 1rem 0 2rem 0; color: #666; letter-spacing: -1px;}
#technical .technical-item .txt-box img{width: 100%; height: 100%; object-fit: cover;}
#technical .technical-item .technical-hide{display: none;}
#technical .technical-item.active .technical-hide{display: block;}
#technical .technical-item.active .technical-hide.sub-desc{height: 9rem; overflow: hidden;}
#technical .technical-item.active .technical-hide.img{height: 19.9rem; overflow: hidden;}

#service .bx-line{padding: 4rem;}
#service .bx-line p{font-weight: 600; font-size: 3rem; line-height: 1; color: rgba(0, 0, 0, 0.87); margin-bottom: 8rem; text-align: center;}
#service .service-tabs .tab-link{flex: 1; border-bottom: 1px solid #333; text-align: center; padding: 1.8rem 0; font-size: 2rem; font-weight: 500; line-height: 2.4rem; color: #444444; cursor: pointer;}
#service .service-tabs .tab-link.current{font-weight: 700; color: #333; background: #fff; border:1px solid #333; border-top-width: 2px; border-bottom: none;}
#service .service-tabs .tab-link span{display: inline-block;}
#service .tab-content{background: #fff; margin-top: 0; padding: 4rem 6rem;}
#service .tab-content .d-flex{gap: 8rem; align-items: flex-end;}
#service .tab-content .d-flex .img{width: 52rem;}
#service .tab-content .d-flex .img img{margin: 0 auto;}
#service .tab-content .txt-box div + div{margin-top: 2rem;}
#service .tab-content .txt-box b{font-weight: 600; line-height: 1; letter-spacing: -1px; margin-bottom: 0.6rem; display: block;}
#service .tab-content .txt-box p{font-size: 1.4rem; line-height: 1.2; letter-spacing: -1px; color: #666;}


/*  포트폴리오 */
.container{width: 100%;margin: 0 auto;}
.project-items{display: grid; grid-template-columns: repeat(3,1fr); gap: 4rem 2.4rem; }
.project-items .project-item .img-wrap{aspect-ratio: 384/230; overflow: hidden;border: 1px solid #DFDFDF;}
.project-items .project-item .img-wrap img{width: 100%; height: 100%; object-fit: cover; aspect-ratio: 384 / 230; object-position: top center;}
.project-items .project-item .project-desc{margin-top: 2rem;}
.project-items .project-item .project-desc p{color: #333333; font-weight: 600; font-size: 2rem; margin-bottom: 0.4rem;}
.project-items .project-item .project-desc span{color: #666666; font-weight: 500; font-size: 1.5rem}
ul.tabs{ display: flex; align-items: center; padding: 1rem 0;}
ul.tabs li{padding: 0 4rem;cursor: pointer; font-size: 2rem; position: relative;}
ul.tabs li:first-of-type{padding-left: 0;}
ul.tabs li:not(:last-of-type):after{content: ''; display: block; width: 0.1rem; height: 2rem; background: #D9D9D9; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
ul.tabs li.current{font-weight: 700;}
.tab-content{display: none; margin-top: 4rem;}
.tab-content.current{display: inherit;}

.tab-content2 .project-items{gap: 8rem 12.3rem;}
.tab-content2 .project-items .project-item .img-wrap{aspect-ratio: 318 / 450;  box-sizing: border-box;}
.tab-content2 .project-items .project-item .img-wrap img{aspect-ratio: 318 / 450; background-color: #fff;}

.pagination {display: flex;align-items: center;justify-content: center;gap: 0.8rem; margin-top: 4rem;}
.page-btn, .page-number {width: 3.2rem;height: 3.2rem;border-radius: 0.4rem;color: #767676;font-size: 1.6rem;cursor: pointer;transition: background 0.3s, color 0.3s; line-height: 1.5;}
.page-btn{display: flex; align-items: center; justify-content: center;   border: 1px solid #dfdfdf;}
.pages{margin: 0 2rem; }
.page-numbers{display: flex; align-items: center; gap: 0 0.8rem;}
.page-number.active {background: #001127;color: white;border: none;}

.portfolio .cont{margin-top: 4rem;}
.partners{display: flex; flex-wrap: wrap;}
.partner-logo{border: 1px solid #DFDFDF; background: #fff; display: flex; align-items: center; justify-content: center; flex: 1 1 25%; height: 12.2rem;}


.db-ipt-group{display: flex; flex-wrap: wrap; gap: 2rem 2.4rem}
.db-ipt-group .ipt-group{flex: 1;}
.db-ipt-group .ipt-group input{ flex: 1;}
.terms-group{margin-top: 4rem; display: flex; gap: 0.6rem; padding: 4rem 0; border-top: 1px solid #DFDFDF; }
.terms-group p.label{width: 10.2rem; font-size: 1.6rem; flex-shrink: 0; font-weight: 500;}
.terms-group .terms-wrap .terms-conts{border: 1px solid #dfdfdf; background: #fff; padding: 1.4rem 1.5rem; color: #7A7A7A; max-height: 16rem; overflow-y: auto; border-radius: 0.4rem;}
.terms-group .terms-wrap .terms-conts pre{white-space: wrap;}
.terms-group .terms-wrap .checkbox_label{margin-top: 1.6rem;}
textarea{resize: none;}

input[type='checkbox']{display: none;}
.checkbox_label{display: flex;align-items: center; cursor: pointer;}
.checkbox_icon{display: flex;}
.checkbox_icon::before{content:'';margin-right: 1rem;display: inline-block;width: 2.2rem;height: 2.2rem;background-color: transparent;border: 1px solid #D9D9D9;box-sizing:border-box;position: relative;cursor: pointer; border-radius: 0.2rem;}
.checkbox_label input:checked + .checkbox_icon::before{background: url('../images/common/icon_checked.svg') #333333 no-repeat center;border:none;}
.checkbox_text{font-size: 1.6rem; color: #444;}

.btn-submit{background: #333; color: #fff; height: 6.4rem;display: flex;align-items: center;justify-content: center; width: 29.6rem; border-radius: 1rem; font-size: 2.4rem; font-weight: 600; margin: 0 auto;}

.box{background: #fff; padding: 4rem; border-radius: 2rem; border: 1px solid #DFDFDF;}
.cont-tit{font-size: 3rem; font-weight: 700;}

.terms-list{line-height: 1.4;}
.terms-list ul + ul{margin-top: 1.5rem;}
.terms-list li{font-size: 1.6rem; display: flex; }
.terms-list li span{display: inline-block; margin: 0 0.5rem;}
.terms-list .list-title{font-weight: 600; color: #000000; margin-bottom: 0.5rem; }
.terms-list .list-disc{padding-left: 0.5rem;}
.terms-list .list-disc::before{margin-right: 0.5rem;}

.sub-desc + .box{margin-top: 4rem; border-radius: 0 0 1rem 1rem;}
.product .sub-tit{margin-bottom: 1rem;}
.product section {overflow-x: unset;}
.product .sub-inner {overflow: unset;}
.product .box {background: url("../images/product/@image_product_bg.svg")no-repeat; padding: 0;}
.product .box .product-info{display: flex; align-items: center; justify-content: space-between; gap: 0 6.7rem; padding: 9.5rem 7rem 0 7rem; }
.product .box .product-info .link-btn{margin-top: 8rem;}
.product .box .product-info .info-text{color: #666666; margin-top: 2rem; }
.product .box .product-desc{display: flex; align-items: center; border: 1px solid #DFDFDF; justify-content: space-between; height: 14.6rem; box-shadow: 3px 3px 13px 0 #0000001F; padding: 4rem; background: #fff; border-radius: 1rem; width: 100%;}
.product .box .product-desc p{font-weight: 600; color: #333; display: flex; align-items: center; font-size: 2.4rem; line-height: 1.2;}
.product .box .product-desc p:before{content: ''; display: inline-block; width: 0.3rem; height: 2.1rem; background: #C9641C; margin-right: 1.4rem;}

.link-btn{ background: #4F4C74; height: 6rem; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; border-radius: 1rem; width: fit-content; padding: 1.4rem 3rem; font-size: 2rem;}
.link-btn:after{background: url("../images/common/arrow_right_white.png")no-repeat center; content: ''; display: inline-block; width: 3rem; height: 1.5rem; margin-left: 1rem; flex-shrink: 0;}

.bullet-list li{color: #666666;  display: flex; line-height: 1.4;}
.bullet-list li:before{width: 0.4rem; height: 0.4rem; background: #666666; display: inline-block; border-radius: 50%; content: ''; margin: 1rem 1rem 0 0; flex-shrink: 0;}
.inquiry .sub-tit{margin-bottom: 5rem;}

/* 1920 */
@media (max-width:1920px) {
  .inner{max-width: 172rem;}
  .tit{margin-bottom: 10rem; font-size: 4rem;}

  .main .sec-01 .inner .txt{font-size: 6rem;}
  .main .sec-02 .sec02-box{width: 25%;}
  .main .sec-02 .sec02-box:nth-child(1){width: 50%;}
  .main .sec-02 .img{height: 40rem;}
  .main .sec-02 .img picture{width: 100%; height: 100%;}
  .main .sec-02 .img picture img{width: 100%; height: 100%; object-fit: cover;}
  .main .sec-02 .sec02-box:nth-child(1) .img{max-width: 77rem; }
  .main .sec-02 .sec02-box:nth-child(2) .img{max-width: 35.5rem; }
  .main .sec-02 .sec02-box:nth-child(3) .img{max-width: 35.5rem; }
  .main .sec-02 .sec02-box:nth-child(1) .txt-hover{padding: 5rem;}

  .main .sec-03 .pagination-wrap{margin-top: 5rem;}
}

@media (max-width: 1440px) {
  .tit{margin-bottom: 8rem;}
  .main .sec-02,
  .main .sec-03{padding: 8rem 0; min-height: auto;}
  .main .sec-04{padding: 8rem 0 20rem 0; min-height: auto;}
  .main .sec-03 .pagination-wrap{margin: 0; position: relative; left: 50%; transform: translateX(-50%); bottom: 0; margin-top: 8rem;}

  .marquee-wrap{padding: 4rem 0;}
  .marquee-reverse{margin-top: 5rem;}
}
@media (max-width:1280px) {
  .main .sec-01 .inner .txt{font-size: 5rem;}
  .main .sec-02 .txt{margin-top: 2rem;}
  .main .sec-02 .img{height: 35rem;}
  .main .sec-03::after,
  .main .sec-03::before{content: none;}
  .marquee-wrap{padding: 2rem 0;}

  .main .sec-03 .swiper-slide{height: 48rem;}
  .main .sec-03 .swiper-slide .txt .txtTop{padding: 2rem;}
  .main .sec-03 .swiper-slide .txt .txtBt{margin: 8.2rem 0 0 0;}
  .main .sec-03 .swiper-slide .txt .txtBt .sub-tit{margin-bottom: 1rem;}
  .main .sec-03 .swiper-slide .txt .txtBt .desc{font-size: 1.6rem;}


}
/* 1200 */
@media (max-width:1200px) {

  .box-ty01 .bx-line p{padding: 2rem 1rem; height: 9rem;}
  #business .box-ty01 .bx-line p{height: 12rem;}
}
/* 1024 */
@media  (max-width: 1024px) {
  .tit{font-size: 4rem; margin-bottom: 8rem;}
  .main .sec-01 .inner{top: 15rem;}
  .main .sec-01 .inner .txt{font-size: 4rem;}
  .main .sec-01 .inner .txt + .txt{margin-top: 1rem;}
  .main .sec-01 .inner .txt .line{position: relative; top: unset; transition: unset; margin-top: 6rem; right: 0; width: 110%;}


  .main .sec-02{padding: 8rem 0;}
  .main .sec-02 .sec02-wrap{flex-wrap: wrap; gap: 4rem;}
  .main .sec-02 .sec02-wrap .sec02-box{width: 100%;}
  .main .sec-02 .img{height: auto; max-width: 100% !important;}
  .main .sec-02 .txt{margin-top: 4rem;}
  .main .sec-02 .txt-hover{display: none; padding: 3rem;}
  .main .sec-02 .sec02-box:nth-child(1) .txt-hover{display: flex; opacity: 1; padding: 2rem;}
  .main .sec-02 .sec02-logo{width: 15rem;}
  .main .sec-02 .txt-hover a{font-size: 2rem; margin-top: 1rem;}
  .arrow-right{width: 2rem;}

  .main .sec-03{padding: 8rem 0; }
  .main .sec-03 .mainPortfolio-box::before,
  .main .sec-03 .mainPortfolio-box::after{content: none;}
  .main .sec-03 .pagination-wrap{margin-top: 8rem;}
  .main .sec-03 .swiper-slide{height: auto;}
  .main .sec-03 .swiper-slide .txt .txtTop .tag{padding: 1rem 2rem;}
  .main .sec-03 .swiper-slide .txt .txtBt{margin: 9.2rem 0 2.5rem 0;}
  .main .sec-03 .swiper-slide .txt .txtBt .sub-tit{margin-bottom: 0; font-size: 2.8rem;}
  .main .sec-03 .swiper-slide .txt .txtBt .desc{font-size: 1.8rem;margin-top: 2rem;}

  .main .sec-04{padding: 8rem 0 12rem 0;}
  .marquee-wrap{padding: 2rem 0;}
  .marquee-reverse{margin-top: 2rem;}
  .marquee .fa{width: 167px;}

  /*서브 공통*/
  .sub-banner .banner-tit{font-size: 4rem;}
  .sub-wrap{margin-top: 6.4rem;}
  .sub-content{padding: 4rem 0;}
  .sub-content .sec-02{margin-top: 6rem;}
  .sub-tab ul li{font-size: 1.6rem; flex: 1;}
  .sub-tab ul li a{padding: 0; justify-content: center; }

  .box-ty01 .bx-line p{height: 10rem;}

  /* 회사소개페이지 */
  .company .sub-banner{background-image: url("../images/company/m_company_banner.jpg");}
  #info .cont02{flex-wrap: wrap;}
  #info .cont02 .bx-line{padding: 2rem; height: auto;}
  #info .cont02 dd{flex-wrap: wrap;}
  #info .cont02 dd + dd{margin-top: 1rem;}
  #info .cont02 dd span{width: 100%; line-height: 1.3; margin-top: 1rem;}
  #info .cont .bx-line b{font-size: 2rem;}
  #info .cont .bx-line img{width: 4rem; height: 4rem; margin-bottom: 2rem;}

  #vision .sub-content{background-size: 90%; background-position-y: 4rem; background-position-x: 90%;}
  #vision .sec-01 .fc-blue{line-height: 1.2;}

  #group .sub-content .sec-01 .cont{margin-top: 6rem !important;}
  #group .sub-content .sec-01 .cont .d-flex{flex-wrap: wrap;}
  #group .sub-content .sec-01 .cont .d-flex span{width: 100%; margin-top: 0.6rem;}

  #certify .certify-items{gap: 4rem 2.4rem;}
  #certify .certify-item{flex: 0 0 calc((100% - 4.8rem) / 3);}

  /* 기술 */
  #business .img{padding: 6rem 19rem 2rem 19rem;}
  #business .box-ty01{flex-wrap: wrap;}
  #business .box-ty01 .bx-line p{height: auto; padding: 2rem;}

  #technical .sub-content .sec-01 .cont{margin-top: 4rem;}
  #technical .technical-items{flex-wrap: wrap; border-top: 1px solid #DFDFDF;}
  #technical .technical-item{flex: 1 1 100%; height: auto; padding: 3rem 2rem; border-left: none; border-bottom: 1px solid #DFDFDF; transition: unset;}
  #technical .technical-item .technical-ico{top: 0; left: unset; right: 4.5rem; width: 4.9rem; height: 5rem;}
  #technical .technical-item .technical-ico img{width: 3.3rem; height: 3.3rem;}
  #technical .technical-item .technical-ico::before{width: 10rem; height: 10rem;top: -5rem; left: -2.5rem;}
  #technical .technical-item.active{flex: 1 1 100%; padding: 2rem;}
  #technical .technical-item .txt-box{padding: 0;}
  #technical .technical-item.active .technical-hide.sub-desc{height: unset;}
  #technical .technical-item.active .technical-hide.img{height: unset;}

  #service .bx-line .img{padding: 0 22.5rem;}
  #service .tab-content{padding: 4rem 2rem;}
  #service .tab-content .d-flex{flex-wrap: wrap; gap: 4rem;}
  #service .tab-content .d-flex .img{width: 100%;}


    /* 포트폴리오 */
  .inquiry .sub-tit{margin-bottom: 4rem;}
  .product .box {background: url("../images/product/@image_product_tablet.svg")no-repeat top/cover;}
  .product .box .product-conts{margin-bottom: 2rem;}
  .product .box .product-info{flex-direction: column-reverse;}
  .product .box .product-info .link-btn{width: 100%; margin-top: 3rem;}
  .product .box .product-desc{flex-direction: column; align-items: flex-start; height: unset; padding: 2rem;}
  .product .box .product-desc .bullet-list{margin-top: 1rem; margin-left: 1rem;}
  .project-items .project-item .img-wrap,
  .project-items .project-item .img-wrap img{aspect-ratio: 335 / 207;}
  .tab-content2 .project-items{gap: 4rem 2.5rem;}
  .tab-content2 .project-items .project-item .img-wrap,
  .tab-content2 .project-items .project-item .img-wrap img{aspect-ratio: 318 / 450;}
  .partner-logo{flex: 1 1 50%;}

  .portfolio .sub-banner{background-image: url("../images/portfolio/m_info_banner.jpg"); }
  .inquiry .sub-banner{background-image: url("../images/inquiry/m_info_banner.jpg");}
  .terms .sub-banner{background-image: url("../images/terms/m_info_banner.jpg");}
  .product .sub-banner{background-image: url("../images/product/m_info_banner.jpg");}

}

/* 768 */
@media  (max-width: 768px) {
  .tit{margin-bottom: 4rem; }

  .main .sec-01 .inner .txt{font-size: 3rem;}
  .main .sec-02 .sec02-logo{width: 10rem;}

  .main .sec-03 .mainPortfolio-box{padding: 0 2rem;}
  .main .sec-03 .pagination-wrap{margin-top: 4rem; position: relative; bottom: 0;}
  .main .sec-03 .swiper-slide .txt .txtTop{padding: 3rem 3rem 2rem 3rem;}


  .main .sec-04{padding: 4rem 0 12rem 0; min-height: auto;}
  .main .sec-01 .inner .txt .line{display: none;}

  /*서브공통*/
  .sub-inner{padding: 0 1.6rem;}
  .sub-tab ul{gap: 0;}
  .sub-content .sec-01 .cont{flex-wrap: wrap; gap: 1.6rem;}


  .pages{margin: 0;}
  .box-ty01{flex-wrap: wrap; gap: 4rem;}
  .box-ty01 img{width: 100%;}
  .box-ty01 .bx-line p{height: auto;}

  .pagination,
  .page-numbers{gap: 0.5rem;}
  .page-btn, .page-number{width: 3rem; height: 3rem; }

  /* 회사소개페이지 */
  #info .sub-content .sec-01 .cont{margin-top: 2rem;}
  #info .cont .bx-line{flex: 0 0 calc((100% - 1.6rem) / 2); padding: 4rem 0;}
  #info #map{height: 30rem;}
  #info .cont01 .map-txt{position: relative; width: 100%; padding: 4.8rem 0;}

  #vision .sub-content{background: none;}
  #vision .sec-01 .sub-inner{background: url("../images/company/m_vision_bg.png") no-repeat bottom; background-size: 95%; background-position-y: 80%;}
  #vision .sec-01 .fc-blue{font-size: 3.6rem;}



  #certify .cont{padding: 0 1.1rem;}
  #certify .certify-items{gap: 3.2rem 0;}
  #certify .certify-item{flex: 0 0 100%;}
  #certify .certify-item img{width: 100%;}

  /* 기술 */

  #business .img{padding: 6rem 2.5rem 3rem 2.5rem;}
  #service .bx-line{padding: 4rem 3.3rem;}
  #service .bx-line .img{padding: 0 3.3rem;}
  #service .service-cont{margin-top: 6rem !important;}
  #service .service-tabs .tab-link span{display: none;}
  #service .service-tabs .tab-link{padding: 1.3rem 0; font-size: 1.6rem;}
  #service .service-tabs .tab-link.current{border-top-width: 4px;}
  #service .tab-content .d-flex .img{padding: 0 4rem;}

  /* 포트폴리오 */
  .box{padding: 2rem;}
  .db-ipt-group {flex-direction: column; gap: 0;}
  .ipt-group{flex-direction: column; align-items: flex-start; gap: 1.5rem 0;}
  .terms-group{flex-direction: column;}
  .terms-group p.label{width: unset;}
  .terms-list .list-disc{align-items: flex-start; padding-left: 0;}
  .terms-list .list-disc::before{margin-top: 1rem;}
  .btn-submit{width: 100%;}
  .project-items{grid-template-columns: repeat(1,1fr);}
  .project-items .project-item .project-desc{margin-top: 3rem;}
  .tab-content2 .project-items{padding: 0 1.25rem;}
  ul.tabs li{font-size: 1.6rem; padding: 0 1.2rem;}
  ul.tabs li:not(:last-of-type):after{height: 1rem;}

  .product .box .product-info{padding: 6rem 2rem 0 2rem;}
  .product .box .product-info .link-btn{padding: 1.8rem 2rem; font-size: 1.6rem;}
  .partner-logo{height: 6.8rem;}
  .partner-logo:nth-child(2n){border-left: none;}
  .partner-logo:nth-child(1) img{width: 7.5rem;}
  .partner-logo:nth-child(2) img{width: 13.2rem}
  .partner-logo:nth-child(3) img{width: 13.2rem}
  .partner-logo:nth-child(4) img{width: 14.2rem;}
  .partner-logo:nth-child(5) img{width: 9rem;}
  .partner-logo:nth-child(6) img{width: 9.4rem;}
  .partner-logo:nth-child(7) img{width: 9rem;}
  .partner-logo:nth-child(8) img{width: 9.4rem;}
  .partner-logo:nth-child(9) img{width: 7.6rem}
  .partner-logo:nth-child(10) img{width: 7.7rem;}
  .partner-logo:nth-child(11) img{width: 11.4rem;}
  .partner-logo:nth-child(12) img{width: 10.3rem;}
  .partner-logo:nth-child(13) img{width: 12.6rem;}
  .partner-logo:nth-child(14) img{width: 11.7rem;}
  .partner-logo:nth-child(15) img{width: 7.4rem;}
  .partner-logo:nth-child(16) img{width: 11rem;}
  .partner-logo:nth-child(17) img{width: 12.1rem;}
  .partner-logo:nth-child(18) img{width: 12.7rem;}
  .partner-logo:nth-child(19) img{width: 7.7rem;}
  .partner-logo:nth-child(20) img{width: 10.6rem;}
  .partner-logo:nth-child(21) img{width: 13.4rem;}
  .partner-logo:nth-child(22) img{width: 11.3rem;}
  .partner-logo:nth-child(23) img{width: 8.8rem;}
  .partner-logo:nth-child(24) img{width: 12.6rem;}

}