@media (max-width:768px){
    .order1 { order: 1; }
    .order2 { order: 2; }
    .m100 .container { width: 100%; }
    .font-20, .font-24 { font-size: 1.75rem; }
}

.line { margin: 4rem 0; height: 1px; background-color: rgba(255,255,255,.2); }
.line.line-sm { margin: 2.5rem 0; }
.line.point-dot { position: relative; }
.line.point-dot::after { position: absolute; content: ''; width: 10px; height: 10px; background: var(--pointcolor); border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 5; }
.PointWrap .box { width: 33.3%; }
@media (max-width:990px){
    .line { margin: 2rem 0; }
    .line.line-sm { margin: 1.5rem 0; }
    .line.point-dot::after { width: 6px; height: 6px; }
    .PointWrap .box { width: 50%; padding-bottom: 5rem; }
    .PointWrap .box .line { background-color: transparent; }
}
@media (max-width:768px){
    .PointWrap .box { width: 100%; padding-bottom: 5rem; }
}

.check-list .check-mark { display: block; position: relative; width: 24px; aspect-ratio: 1/1; margin-right: 1rem; background: #fff; border-radius: .25rem; }
.check-list .check-mark::after
{ position: absolute; content: ''; width: 20px; height: 10px; top: 5px; left: 2px; background: transparent; border: 3px solid var(--pointcolor); border-top-color: transparent; border-right-color: transparent; transform: rotate(-45deg); border-radius: .25rem; }
.check-list span.font-20 {width: calc(100% - 24px);}
@media (max-width:768px){
    .check-list .check-mark { transform: scale(.75); }
}

/* 서비스 소개 : 공통 */
.business .commonBottom .box { position: relative; aspect-ratio: 1/1; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center; transition: transform .4s; }
.business .commonBottom .box a { position: relative; display: block; width: 100%; height: 100%; }
/* .business .commonBottom .box:hover { transform: translateY(-1rem); } */
.business .commonBottom .box a > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.business .commonBottom .box a .off { opacity: 1; transition: opacity .6s; }
.business .commonBottom .box a .on { opacity: 0; background: rgba(0,0,0,.5); backdrop-filter: blur(5px); transition: opacity .6s; }
.business .commonBottom .box a .on > * { opacity: 0; transform: translateX(50%); transition: .5s; }
.business .commonBottom .box:hover .off { opacity: 0; }
.business .commonBottom .box:hover .on { opacity: 1; transition-delay: .4s; }
.business .commonBottom .box:hover .on > * { opacity: 1; transform: translateX(0); }
.business .commonBottom .box:hover .on > h6 { transition-delay: .6s; }
.business .commonBottom .box:hover .on > h4 { transition-delay: .8s; }
.business .commonBottom .box:hover .on > p { transition-delay: 1s; }
.business .commonBottom .box:hover .on > small { transition-delay: 1.2s; }
.business .commonBottom .box a h4, .business .commonBottom .box a p { z-index: 5; }
.business .commonBottom .box a small { text-decoration: underline; text-underline-offset: .5rem; }
.business .commonBottom .box:nth-child(1)
{ background-image: url(/img/renewal/sub/business/img_common_1.jpg); }
.business .commonBottom .box:nth-child(2)
{ background-image: url(/img/renewal/sub/business/img_common_2.jpg); }
.business .commonBottom .box:nth-child(3)
{ background-image: url(/img/renewal/sub/business/img_common_3.jpg); }
.business .commonBottom .box:nth-child(4)
{ background-image: url(/img/renewal/sub/business/img_common_4.jpg); }
.business .commonBottom .box:nth-child(5)
{ background-image: url(/img/renewal/sub/business/img_common_5.jpg); }
.business .commonBottom .box:nth-child(6)
{ background-image: url(/img/renewal/sub/business/img_common_6.jpg); }
.business .commonBottom .box:nth-child(7)
{ background-image: url(/img/renewal/sub/business/img_common_7.jpg); }
@media (max-width:768px){
    .business .commonBottom .box { aspect-ratio: 5/3; background-size: 100%; }
    .business .commonBottom .box:hover { transform: none; }
    .business .commonBottom .box:hover .off { opacity: 1; }
    .business .commonBottom .box:hover .on { opacity: 0; }
    .business .commonBottom .box:hover .on > * { opacity: 0; }
    .business .commonBottom .box:nth-child(1)
{ background-image: url(/img/renewal/sub/business/img_common_1_m.jpg); }
.business .commonBottom .box:nth-child(2)
{ background-image: url(/img/renewal/sub/business/img_common_2_m.jpg); }
.business .commonBottom .box:nth-child(3)
{ background-image: url(/img/renewal/sub/business/img_common_3_m.jpg); }
.business .commonBottom .box:nth-child(4)
{ background-image: url(/img/renewal/sub/business/img_common_4_m.jpg); }
.business .commonBottom .box:nth-child(5)
{ background-image: url(/img/renewal/sub/business/img_common_5_m.jpg); }
.business .commonBottom .box:nth-child(6)
{ background-image: url(/img/renewal/sub/business/img_common_6_m.jpg); }
.business .commonBottom .box:nth-child(7)
{ background-image: url(/img/renewal/sub/business/img_common_7_m.jpg); }
}
@media (max-width:768px){
    .business .commonBottom .box a small { font-size: 1.25rem; font-weight: 700; }
}
.business .ContCheckbox { position: relative; }
.business .ContCheckbox .ContBoxText { position: absolute; top: 4rem; left: 4rem; }

.business .stepBox .box { border-right: 1px solid var(--pointcolor); padding-left: 1rem; }
.business .stepBox .box:last-child { border-right: 0; }
.business .stepBox .box > u { text-underline-offset: 7.5px; letter-spacing: 0; }

.business.branding .checkmate { background: url(/img/renewal/sub/business/img_branding_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.homepage .checkmate { background: url(/img/renewal/sub/business/img_homepage_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.design .checkmate { background: url(/img/renewal/sub/business/img_design_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.video .checkmate { background: url(/img/renewal/sub/business/img_video_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.viral .checkmate { background: url(/img/renewal/sub/business/img_viral_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.perfomance .checkmate { background: url(/img/renewal/sub/business/img_perfomance_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
.business.geo .checkmate { background: url(/img/renewal/sub/business/img_geo_5.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }

@media (max-width:990px){
    .blockBox > * { width: 50%; }
    .blockBox img { position: relative; width: 80%; object-fit: contain; align-self: flex-start; }
    .Tit.flex-wrap > * { width: 100%; }
    .Tit.flex-wrap > *:not(:first-child) { margin-top: 1.25rem; }

    .business .ContCheckbox .ContBoxBg img { width: 100%; }

    .business .stepBox { --y-gap : .25rem; }
    .business .stepBox .box { font-size: 1.25rem; }
    .business .stepBox .box:nth-child(odd) { padding-left: .5rem; padding-right: 1.5rem; }
    .business .stepBox .box:nth-child(even) { border-right: 0; }
    .business .stepBox .box:nth-child(n+3) { margin-top: 3rem; }
}
@media (max-width:768px){
    .blockBox { margin-top: 2rem; padding: 3rem; }
    .blockBox > * { position: relative; width: 100%; }
    .blockBox > *:first-child { top: -2rem; padding-bottom: 3rem; }
    .blockBox img { width: 75%; object-fit: contain; margin: 0 auto; top: -8rem; align-self: auto; }
    .business .ContCheckbox .ContBoxBg { position: relative; }
    .business .ContCheckbox .ContBoxBg::before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.25); }
    .business .ContCheckbox .ContBoxText { top: 3rem; left: 2rem; z-index: 5; }
    .business .ContCheckbox .ContBoxText ul li { align-items: flex-start; }
    .business.branding .checkmate { background-position: 75%; }
    .business.homepage .checkmate { background-position: 75%; }
    .business.video .checkmate { background-position: 75%; }
    .business.perfomance .checkmate { background-position: 75%; }
}
@media (max-width:500px){
    .business.video .ContCheckbox .font-20 {font-size: 1.5rem;}
    .business.video .ContCheckbox .font-48 {font-size: 2.5rem;}
}

@media(max-width:400px) {
    .business.video .ContCheckbox .font-20 {font-size: 1.25rem;}
    .business.video .ContCheckbox .font-48 {font-size: 2.25rem;}
}

/* 회사소개 수정 */
#company.company, #company.about {background: url("/img/renewal/sub/company/company_bg.jpg") no-repeat; background-size: cover;}

#business.company .slide::after {background-image: url("/img/renewal/sub/company/business_text.png"); height: 31.1875rem;}
#business.company::after {bottom: 200px; height: calc(70% - 200px);}

@media(max-width:1550px) {
    #business.company::after {bottom: 130px; height: calc(70% - 130px);}
}

@media(max-width:990px) {
    #business.company::after {bottom: 100px; height: calc(70% - 100px);}
}

@media(min-width:991px) {
    #business.company .swiper .swiper-slide {height: 35rem ;}
    #business.company .swiper-scrollbar {bottom: 2.5rem;}
    
}

@media(max-width:990px) {
    #business.company .tit.pb-200 {padding-bottom: 6.25rem;}
}

@media(max-width:768px) {
    #company.company, #company.about {background: url("/img/renewal/sub/company/company_bgm.jpg") no-repeat; background-size: cover; height: 100vh; background-position: right bottom;}
}

/* 배경 */
#business.company .swiper .slide01 {background-image: url(/img/renewal/sub/company/business_img01.jpg);}
#business.company .swiper .slide02 {background-image: url(/img/renewal/sub/company/business_img02.jpg);}
#business.company .swiper .slide03 {background-image: url(/img/renewal/sub/company/business_img03.jpg);}
#business.company .swiper .slide04 {background-image: url(/img/renewal/sub/company/business_img04.jpg);}
#business.company .swiper .slide05 {background-image: url(/img/renewal/sub/company/business_img05.jpg);}
#business.company .swiper .slide06 {background-image: url(/img/renewal/sub/company/business_img06.jpg);}

#strategy .num {font-size: 8.125rem; opacity: 0.05; font-weight: 800; line-height: 1;}
#strategy .txt {position: relative; top: -2.5rem;}

#strategy .imgbox.img01 {padding-left: 9.375rem;}
#strategy .imgbox.img02 {position: relative; z-index: 1; margin-top: 2rem; padding-right: 5.5rem;}
#strategy .imgbox.img03 {float: right; padding-right: 3.5rem; position: relative; transform: translateY(-5rem);}

@media(max-width:1240px) {
    #strategy .imgbox.img01 {padding-left: 6.25rem;}  
    #strategy .imgbox.img03 {padding-right: 1.5rem;}
}

@media(max-width:990px) {
    #strategy .img-wrap {width: 80%; margin: auto;}
}

@media(max-width:680px) {
    #strategy .img-wrap {width: 100%;}
}

@media(max-width:420px) {
    
    #strategy .imgbox.img01 {padding-left: 3.5rem;} 
    #strategy .imgbox.img03 {width: 80%;}
}

@media(max-width:380px) {
    #strategy br.mo {display: none !important;}
}

.business.video .swiper-slide p.desc {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.business.video .swiper-pagination {position: inherit;}
.business.video .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: var(--pointcolor);}

.business.video .portfolio .tabs {display: flex; justify-content: center; align-items: center; gap: 5rem;}
.business.video .portfolio .tabs li span {position: relative; cursor: pointer;}
.business.video .portfolio .tabs li.current span:after {position: absolute; left: 0; bottom: -5px; width: 100%; height: 2px; background: var(--pointcolor); content: "";}
.business.video .portfolio .tabs li.current {color: var(--pointcolor);}
.business.video .portfolio .tab-content {display: none;}
.business.video .portfolio .tab-content.current {display: inherit;}
/* .business.video .portfolio .swiper-slide img {height: 14rem !important; width: 100%;} */

.business.video .subBtn {position: absolute; top: 0; right: 0; z-index: 1;}
.business.video .link::after {background: #000;}
.business.video .link img {filter: grayscale(1) brightness(0);}

@media(max-width:990px) {
    .business.video .subBtn {position: inherit; width: 100%; display: flex; justify-content: flex-end;}
}

@media(max-width:768px) {
    .business.video .portfolio .tabs li {width: fit-content;}
}

@media(max-width:650px) {
    .business.video .portfolio .tabs {gap: 2.5rem;}
    .business.video .portfolio .tabs li.font-20 {font-size: 1.5rem;}
}

@media(max-width:480px) {
    .business.video .portfolio .tabs {flex-wrap: wrap;}
    .business.video .portfolio .tabs li {width: calc(50% - 1.25rem);}
}

.geoSolution {background: #1a1a1a;}
.geoSolution h3.mb-100 {margin-bottom: 0;}
.geoSolution .list ul {gap: 0; position: relative;}
.geoSolution .list ul::after {content: ''; top: 0; left: 0; width: 107.5%; background-color: #313131; height: 1px; position: absolute;}
.geoSolution .list li {position: relative; width: calc((70% - 10rem) / 3); margin-right: 5rem;}
.geoSolution .list li::before {content: ''; top: -5rem; left: 0; position: absolute; background-repeat: no-repeat; background-size: cover; height: 5rem; width: 0; max-width: 138px; transition: 1.8s linear; }
.geoSolution .list.aos-animate li::before {width: 100%;}
.geoSolution .list li .inner p {text-wrap: nowrap;}
.geoSolution .list li:nth-child(1) {width: 30%; margin-right: 0; padding-right: 1.5rem; }
.geoSolution .list li:nth-child(1) .inner {gap: 1.500rem;}
.geoSolution .list li:nth-child(1) .inner p {line-height: 1;}
.geoSolution .list li:nth-child(1) .inner p.font-32 {line-height: 1.5; opacity: 0; transition-delay: .3s;}
.geoSolution .list li:nth-child(1) .inner p.font-32.aos-animate {opacity: 1; }
.geoSolution .list li:nth-child(4) {margin-right: 0;}
.geoSolution .list li:nth-child(2)::before {background-image: url(/img/renewal/point01.png); max-width: 119px;}
.geoSolution .list li:nth-child(3)::before {background-image: url(/img/renewal/point02.png);}
.geoSolution .list li:nth-child(4)::before {background-image: url(/img/renewal/point03.png);}
.geoSolution .list.aos-animate li:nth-child(3)::before {transition-delay: .3s;}
.geoSolution .list.aos-animate li:nth-child(4)::before {transition-delay: .6s;}
@media (max-width: 990px) {
    .geoSolution .list ul {align-items: flex-start;}
    .geoSolution .list li {width: 100%; }
    .geoSolution .list ul::after {display: none;}
    .geoSolution .list li::before {position: relative; display: block; top: 0; background-size: contain; width: auto; transform: translateX(-10%); opacity: 0;transition: 0 !important;  transition-delay: 0 !important;}
    .geoSolution .list.aos-animate li::before {transform: translateX(0); opacity: 1;}
    .geoSolution .list li .inner {padding-top: 1.5625rem; border-top: 1px solid #313131;}
    
    .geoSolution .list li:nth-child(1)::before {display: none;}
    .geoSolution .list li:nth-child(1) .inner {padding-top: 0; border: 0;}
    .geoSolution .container .text {justify-content: flex-start;}
}