.main {overflow: hidden; padding-top: 100px;}
.point-font {letter-spacing: 0;}

@media(max-width:990px) {
    .main {padding-top: 80px;}
}

.tit img {display: inline-block; width: 5.25rem;}
.desc {color: #444444;}

@media(max-width:1550px) {
    .main .container {width: 85%;}
}

@media(max-width:990px) {
    .tit .font-20 {font-size: 1.5625rem;}
    .font-22 {font-size: 1.5rem;}
    .font-20 {font-size: 1.5rem;}
    .font-19 {font-size: 1.325rem;}
    .font-18 {font-size: 1.5rem;}
    .font-17 {font-size: 1.5rem;}
    .font-16 {font-size: 1.25rem;}
}

@media(max-width:768px) {
    .tit .font-20 {font-size: 1.5625rem;}
    .font-22 {font-size: 1.75rem;}
    .font-20 {font-size: 1.75rem;}
    .font-19 {font-size: 1.5625rem;}
    .font-18 {font-size: 1.75rem;}
    .font-17 {font-size: 1.75rem;}
    .font-16 {font-size: 1.5rem;}
}

/* 버튼 */
.moreBtn {padding: 1rem 1.5rem; border: 1px solid #e0e0e0; border-radius: 8px;   width: 190px; position: relative; overflow: hidden;}
.moreBtn.big {width: 220px;}
.moreBtn:after {position: absolute; content: ""; display: block; top: 0; right: 0; width: 3.5rem; height: 3.5rem; border-radius: 0 0 0 4.5rem; background: var(--pointcolor); pointer-events: none; opacity: 0; z-index: -1;}
.moreBtn:hover:after  {animation: circleExpandBtn 1.4s ease forwards; }
.moreBtn span.arrow {transform: rotate(-45deg);}
.moreBtn:hover span {color: #fff;}

.downBtn {width: 15.625rem; background: #fff; border: 1px solid #efefef; padding: 1rem 2rem; border-radius: 0.625rem; position: relative; overflow: hidden;}
.downBtn:after {position: absolute; content: ""; display: block; top: 0; right: 0; width: 3.5rem; height: 3.5rem; border-radius: 0 0 0 4.5rem; background: var(--pointcolor); pointer-events: none; opacity: 0; }
.downBtn span {position: relative; z-index: 1;}
.downBtn .arrow {transform: rotate(90deg);}
.downBtn:hover:after {animation: circleExpandBtn 1.4s ease forwards; }
.downBtn:hover span { color: #fff;}

@media(max-width:768px) {
    .moreBtn .font-18 {font-size: 1.6875rem;}

    .downBtn {width: 22rem;}
}

@keyframes circleExpandBtn {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(20);
        opacity: 1;
    }
}

/* 메인슬라이드 */
.main #mainSlide {height: 50rem;}
.main #mainSlide .wrap {width: 90%; margin: auto; border-radius: 1.25rem; overflow: hidden; height: 100%;}
.main #mainSlide .swiper {height: 100%;}
.main #mainSlide .swiper-slide {-webkit-backface-visibility:hidden; backface-visibility:hidden; width: 100%;  overflow:hidden;}
.main #mainSlide .swiper-slide .bg {background-size: cover; background-repeat: no-repeat; background-position: center; height: 100%;}
.main #mainSlide .swiper-slide.slide01 .bg {background-image: url("/img/main/mainSlide01.jpg");}
.main #mainSlide .swiper-slide.slide02 .bg {background-image: url("/img/main/mainSlide02.jpg");}
.main #mainSlide .swiper-slide.slide03 .bg {background-image: url("/img/main/mainSlide03.jpg");}
.main #mainSlide .swiper-slide.slide04 .bg {background-image: url("/img/main/mainSlide04.jpg");}
.main #mainSlide .txtbox {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; width: 90%;}
.main #mainSlide .txtbox h2 {text-transform: uppercase;}
.main #mainSlide .swiper-slide.slide01 .tag {gap: 1rem;}
.main #mainSlide .swiper-slide.slide01 span {padding: 0.9rem 2rem; border-radius: 100px; border: 1px solid rgba(255,255,255,0.7);}

.main #mainSlide h2 img {display: inline; width: 8.25rem;}

.main #mainSlide .navBtn div {color: #fff;}
.main #mainSlide .navBtn .swiper-button-next:after, 
.main #mainSlide .navBtn .swiper-button-prev:after {font-size: 4rem; font-weight: 300;}
.main #mainSlide .navBtn .swiper-button-prev, 
.main #mainSlide .navBtn .swiper-rtl .swiper-button-next {left: 5%;}
.main #mainSlide .navBtn .swiper-button-next, 
.main #mainSlide .navBtn .swiper-rtl .swiper-button-prev {right: 5%;}

.main #mainSlide .pgWrap div {bottom: 5rem; width: fit-content; left: 5%;}
.main #mainSlide .pgWrap div span {opacity: 1; background: #fff; width: 4px; height: 4px; margin: 0 1rem; position: relative;}
.main #mainSlide .pgWrap div span:after {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0); width: 30px; height: 30px; background: transparent; border: 1px solid #fff; border-radius: 50%; content: ""; opacity: 0; transition: 0.45s;}
.main #mainSlide .pgWrap div span.swiper-pagination-bullet-active:after {opacity: 0.3; transform: translate(-50%, -50%) scale(1);}

.main #mainSlide .solutionBtn {position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; z-index: 3; background: #fff; width: 16rem; padding: 1.25rem 1.5rem 1.25rem; border-radius: 1rem 1rem 0 0;}
.main #mainSlide .solutionBtn span.arrow { transition: 0.3s;}
.main #mainSlide .solutionBtn:hover span {color: var(--pointcolor);}
.main #mainSlide .solutionBtn:hover span.arrow {transform: rotate(-45deg);}

.main #mainSlide .scroll {position: absolute; right: 5%; bottom: 0; z-index: 5; padding-bottom: 8rem; transform: rotate(90deg); font-size: 13px; color: #fff; display: flex; align-items: center; gap: 1rem; letter-spacing: 0.05rem;}
.main #mainSlide .scroll .line {width: 8rem; height: 1px; background: rgba(255, 255, 255, 0.2);}

.main #mainSlide .scroll .line::after {display: block; content: ""; width: 8rem; height: 2px; background: rgba(255, 255, 255, 0.7); position: absolute; left: 0;  transform-origin: left; animation: scrollAni 1.4s infinite;}

@keyframes scrollAni {
    0% {
        transform: scaleX(0);
        left: 30%;
    }
    100% {
        transform: scaleX(1);
        left: 100%;
    }
}

@media(max-width:990px) {
    .main #mainSlide .navBtn {display: none;}
}

@media(max-width:768px) {
    .main #mainSlide {height: 77.5rem;}
    .main #mainSlide .swiper-slide.slide01 .bg {background-image: url("/img/main/mainSlide01_m.jpg");}
    .main #mainSlide .swiper-slide.slide02 .bg {background-image: url("/img/main/mainSlide02_m.jpg");}
    .main #mainSlide .swiper-slide.slide03 .bg {background-image: url("/img/main/mainSlide03_m.jpg");}
    .main #mainSlide .swiper-slide.slide04 .bg {background-image: url("/img/main/mainSlide04_m.jpg");}

    .main #mainSlide .txtbox {top: 45%;}
    .main #mainSlide .swiper-slide.slide01 .tag {width: 60%; flex-wrap: wrap; margin: 3rem auto; }
    .main #mainSlide .swiper-slide.slide01 span {padding: 1rem 2.5rem;}

    .main #mainSlide .pgWrap div {left: 50%; transform: translateX(-50%); bottom: 20%; width: 100%;}
    .main #mainSlide .pgWrap div span {width: 0.625rem; height: 0.625rem; margin: 0 2.5rem;}
    .main #mainSlide .pgWrap div span:after {width: 4.5rem; height: 4.5rem; }

    .main #mainSlide .scroll {display: none;}

    .main #mainSlide .solutionBtn {width: 22rem;}
}

@media(max-width:500px) {
    .main #mainSlide .swiper-slide.slide01 .tag {width: 80%;}
    .main #mainSlide .pgWrap div span {width: 0.45rem; height: 0.45rem; margin: 0 2rem;}
    .main #mainSlide .pgWrap div span:after {width: 3.5rem; height: 3.5rem;}
}

@media(max-width:420px) {
    .main #mainSlide {height: 90lvh;}
    .main #mainSlide .font-90 {font-size: 4rem;}
    .main #mainSlide .font-80 {font-size: 4rem;}
    .main #mainSlide .swiper-slide.slide01 .tag {width: 100%;}
    .main #mainSlide .tag.font-20 {font-size: 1.5rem;}
    .main #mainSlide .solutionBtn {width: 75%;}
    .main #mainSlide .pgWrap div  {bottom: 18%;}
}

/* about us */
.main #about {overflow: hidden;}
.main #about .imgbox-wrap {max-width: 55.625rem; margin: auto;}
.main #about .bg-wrap {clip-path: circle(50% at center);  width: 32.5rem; height: 32.5rem; margin: auto;}
.main #about .bg-wrap .bg {position: fixed; display: block; top: 0; left: 0%; width: 60%; height: 100lvh; background-repeat: no-repeat; background-position: center top; background-size: cover; will-change: transform; background-image: url("/img/main/about_bg.jpg");}

.main #about .cir-logo {width: 15rem; height: 15rem; background: rgba(16,50,101,0.9); z-index: 3; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; box-shadow: 0 3px 140px rgba(13, 76, 170, 0.25); mix-blend-mode: multiply;}
.main #about .cir-logo-txt { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 4;}
.main #about .cir-logo-txt img {filter: brightness(0) invert(1);}
.main #about .cir-logo-txt p {color: #7490ba;}

.main #about .item {width: 11rem; height: 11rem; border-radius: 50%; position: absolute; z-index: 5; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: 1s;}

.main #about .imgbox-wrap.aos-animate .item.item01 {top: 0%; left: 5%; transform: none; opacity: 1;}
.main #about .imgbox-wrap.aos-animate .item.item02 {top: 40%; left: auto; right: -15%; transform: none; opacity: 1;}
.main #about .imgbox-wrap.aos-animate .item.item03 {top: auto; bottom: -25%; left: 30%; transform: none; opacity: 1;}

.main #about .item > div {width: 100%; height: 100%; border-radius: 50%; background: #fff; position: relative; z-index: 5;}

.main #about .item:after {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 12.5rem; height: 12.5rem; border-radius: 50%; background: rgba(10,34,76,0.04); z-index: -2; content: "";}
.main #about .item:before {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 14rem; height: 14rem; border-radius: 50%; background: rgba(10,34,76,0.02); z-index: -1; content: "";} 


.main #about .txtbox {padding-left: 13rem;}

@media(max-width:1440px) {
    .main #about .txtbox br {display: none;}
}

@media(max-width:1240px) {
    .main #about .container {padding-bottom: 0;}
    .main #about .cont_wrap {flex-direction: column; gap: 12rem;}
    .main #about .cir-logo {width: 18rem; height: 18rem;}
    .main #about .txtbox {width: 100%;}
    .main #about .txtbox br {display: block;}
    .main #about .imgbox {width: 40rem; margin: auto;}
    .main #about .bg-wrap .bg {width: 100%; left: 8%;}
    .main #about .item img {transform: scale(0.8);}
    .main #about .item p {margin-top: 0;}
}


@media(max-width:990px) {
    .main #about {padding: 200px 0 100px;}
    .main #about .container {padding-top: 6.25rem;}
    .main #about .imgbox {width: 90%;}
    .main #about .bg-wrap {width: 100%;}
    .main #about .cir-logo {width: 22rem; height: 22rem;}
    .main #about .txtbox {padding-left: 0;}
    .main #about .item {width: 12em; height: 12em;}
    .main #about .imgbox-wrap.aos-animate .item.item01 {top: -10%; left: 2%;}
    .main #about .imgbox-wrap.aos-animate .item.item02 {top: 75%; left: auto; right: 0%;}
    .main #about .imgbox-wrap.aos-animate .item.item03 {bottom: auto; top: -35%; left: auto; right: 10%;}
    .main #about .item:after {width: 14rem; height: 14rem;}
    .main #about .item:before {width: 16rem; height: 16rem;}
    .main #about .item.item01 p {margin-top: -1rem; padding-bottom: 1rem;}
    .main #about .item.item02 p {margin-top: -1rem;}
    .main #about .item.item03 p {margin-top: -0.5rem;}
}

@media(max-width:768px) {
    .main #about {padding: 160px 0 80px;}
    .main #about .item {width: 14rem; height: 14rem;}
    .main #about .item:after {width: 16rem; height: 16rem;}
    .main #about .item:before {width: 18rem; height: 18rem;}
    .main #about .imgbox-wrap.aos-animate .item.item01 {left: -2%;}
}

@media(max-width:580px) {
    .main #about .cont_wrap {gap: 8rem;}
    .main #about .imgbox {width: 100%;}
    .main #about .imgbox-wrap.aos-animate .item.item01 {left: 0%;}
    .main #about .item {width: 12rem; height: 12rem;}
    .main #about .item:after {width: 14rem; height: 14rem;}
    .main #about .item:before {width: 16rem; height: 16rem;}
    .main #about .item img {transform: scale(0.7);}
}

@media(max-width:500px) {
    .main #about {padding: 140px 0 80px;}
    .main #about .cir-logo {width: 50%; height: auto; aspect-ratio: 1 /1;}
    .main #about .imgbox-wrap.aos-animate .item.item03 {top: -30%;}
}

@media(max-width:420px) {
    .main #about {padding: 80px 0;}
    .main #about .bg-wrap .bg {background-size: auto;}
    .main #about .cont_wrap {gap: 5rem;}
    .main #about .bg-wrap {width: 80%;}
    .main #about .bg-wrap .bg {left: 0;}
    .main #about .cir-logo-txt img {transform: scale(0.8);}
    .main #about .item {width: 10rem; height: 10rem;}
    .main #about .item:after {width: 12rem; height: 12rem;}
    .main #about .item:before {width: 14rem; height: 14rem;}
    .main #about .item .font-18 {font-size: 1.25rem;}
    .main #about .item img {transform: scale(0.6);}
    .main #about .item.item01 p {margin-top: -1.5rem;}
    .main #about .item.item02 p {margin-top: -1.5rem;}
    .main #about .item.item03 p {margin-top: -1rem;}
    .main #about .imgbox-wrap.aos-animate .item.item01 {top: 0; left: 2%;}
    .main #about .imgbox-wrap.aos-animate .item.item02 {right: 5%;}
    .main #about .imgbox-wrap.aos-animate .item.item03 {top: -15%; right: 5%;}

    .main #about .txtbox p br {display: none;}
}

/* 비지니스 */
.main #business {background-image: url("/img/main/business_bg01.jpg"); background-size: cover; background-position: center; transition: 0.3s;}
.main #business .contbox {width: 31.25rem; padding: 2.5rem 2rem 3rem; border-radius: 1.25rem; display: none; cursor: pointer;}
.main #business .contbox img {width: 11.1875rem;}
.main #business .contbox h3 {transition: 0.3s;}
.main #business .contbox .arrow {transform: rotate(-45deg); aspect-ratio: 1 / 1; width: 3.125rem; height: 3.125rem; background-color: #f3f3f3; border-radius: 50%; line-height: 1; transition: 0.3s;}

.main #business .contbox.current {display: block;}

.main #business .contbox.on h3 {color: var(--pointcolor);}
.main #business .contbox.on .arrow {background-color: var(--pointcolor); transform: rotate(0); color: #fff;}

.main #business .contbox:hover h3 {color: var(--pointcolor);}
.main #business .contbox:hover .arrow {background-color: var(--pointcolor); transform: rotate(0); color: #fff;}

.main #business ul {background: #103265; backdrop-filter: blur(20px); border-radius: 0.625rem;  position: relative; position: relative; overflow: hidden;}
.main #business ul:after {position: absolute; left: 0;  top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); content: "";}
.main #business ul li {width: calc(100% / 4); padding: 2rem; cursor: pointer; position: relative; display: flex; justify-content: center; align-items: center; position: relative; z-index: 1;}
.main #business ul li .background {position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #fff; border-radius: 0.625rem; z-index: -1; display: none; will-change: transform; background: var(--pointcolor);}
.main #business ul li[data-active] .background {display: block;}

.main #business br.visible-mo {display: none;}

@media(max-width:990px) {
    .main #business .contbox {width: 34rem;}
    .main #business .contbox .arrow {font-size: 1.875rem;}
}

@media(max-width:768px){
    .main #business {background-image: url("/img/main/business_bg01_m.jpg");}
    .main #business .cont_wrap {flex-direction: column;}
    .main #business .contbox {width: 38rem;}
    .main #business ul.font-16 {font-size: 1.875rem;}
}

@media(max-width:540px) {
    .main #business ul {flex-wrap: wrap;}
    .main #business ul li {width: calc(100% / 2);}
    /* .main #business ul li:nth-child(n+3) {border-top: 1px solid rgba(255,255,255,0.3) ;}
    .main #business ul li:nth-child(odd) {border-right: 1px solid rgba(255,255,255,0.3) ;} */

    .main #business .contbox  {width: 100%;}
}

@media(max-width:380px) {
    .main #business br.visible-mo {display: block;}
}

@media(max-width:320px) {
    .main #business .tit br {display: none !important;}
}

/* 고객 맞춤 업무 프로세스 */
.main #process {border-radius: 1.25rem 1.25rem 0 0; margin-top: -1.25rem; position: relative; z-index: 10; background: #fff;}
.main #process .cont-item {padding: 2.5rem 0 3.75rem; border-radius: 1.25rem 1.25rem 0 0;  position: relative;}
.main #process .cont-item.item02, 
.main #process .cont-item.item03,
.main #process .cont-item.item04 {margin-top: -12.5rem;}
.main #process .cont-item.item02 {background: #f8f9fa;}
.main #process .cont-item.item03 {background: #e1e7ee;}
.main #process .cont-item.item04 {background: #103265;}

.main #process .imgbox img {border-radius: 1.25rem;}

.main #process .txtbox {padding-left: 9.375rem;}
.main #process .txtbox h4 {background: var(--pointcolor); color: #fff; width: fit-content; padding: 0.5rem 1rem 0.25rem; border-radius: 100px; text-transform: uppercase;}
.main #process .cont-item.item04 .txtbox {color: #fff;}
.main #process .cont-item.item04 .txtbox h4 {background: rgba(255,255,255,0.1);}

@media(max-width:1550px) {
    .main #process .container {width: 90%;}
}

@media(max-width:1440px) {
    .main #process .cont-item.item02, 
    .main #process .cont-item.item03,
    .main #process .cont-item.item04 {margin-top: -11rem;}
}

@media(max-width:1240px) {
    .main #process .txtbox {padding-left: 6.25rem;}
}

@media(max-width:1024px) {
    .main #process .cont-item.item02, 
    .main #process .cont-item.item03,
    .main #process .cont-item.item04 {margin-top: -10rem;}
}

@media(max-width:768px) {
    .main #process .font-36 {font-size: 3.125rem; line-height: 1.2;}
    .main #process .font-19 {font-size: 1.75rem;}

    .main #process .cont-item {padding: 2.5rem 0 60px; transform: translateY(-1.25rem) !important; margin-top: -1.25rem !important;}
    .main #process .cont-item.item02, 
    .main #process .cont-item.item03,
    .main #process .cont-item.item04 {margin-top: 0;}
    .main #process .cont-item .flex {flex-direction: column; align-items: flex-start; gap: 3.5rem;}
    .main #process .cont-item .box {width: 100%;}
    .main #process .txtbox {padding-left: 2rem;}
}

@media(max-width:320px) {
    .main #process .tit br {display: none !important;}
}

/* 가맹 브랜드 */
.main #franchise .swiper-slide {border-right: 1px solid #efefef; padding: 2rem; cursor: pointer; position: relative; height:34rem; width: 26.25rem; transition: 0.3s;}
.main #franchise .swiper-slide .imgbox img {border-radius: 0.625rem;}
.main #franchise .swiper-slide .arrow {position: absolute; right: 2rem; bottom: 2rem; transform: rotate(-45deg); aspect-ratio: 1 / 1; width: 3.125rem; height: 3.125rem; background-color: #f3f3f3; border-radius: 50%; line-height: 1; transition: 0.3s;}
.main #franchise .swiper-slide p {transition: 0.3s;}


@media(min-width:769px) {
    .main #franchise .swiper-slide:hover {background: var(--pointcolor); color: #fff; border-radius: 1.25rem;}
    .main #franchise .swiper-slide:hover p {color: #fff !important;}
    .main #franchise .swiper-slide:hover .arrow {transform: rotate(0); color: #000;}
}

@media(max-width:768px) {
    .main #franchise .txtbox .font-16 {font-size: 1.5625rem;}
    .main #franchise .txtbox .font-22 {font-size: 1.875rem;}
    .main #franchise .txtbox .font-19 {font-size: 1.75rem;}
    
    .main #franchise .swiper-slide {width: 30rem; height:40rem; }
    .main #franchise .swiper-slide-active {background: var(--pointcolor); color: #fff ; border-radius: 1.25rem;}
    .main #franchise .swiper-slide-active p {color: #fff !important;}
    .main #franchise .swiper-slide-active .arrow {transform: rotate(0); color: #000;}
}

@media(max-width:360px) {
    .main #franchise .tit br {display: none !important;}
}

/* 포인트섹션 */

/* 공통부분 */
#point .bg {background-size: cover; background-position: center; position: absolute; left: 5%; top: 0%; width: 90%; height: 100%; border-radius: 1.25rem; margin: auto;}
.main #point .txtbox { position: relative; z-index: 2;}

@media(max-width:1550px) {
    #point .container {width: 80%;}
}

@media(max-width:5000px) {
    .sub .main #point .txtbox br {display: none !important;}
}

/* 메인 */
.main #point .bg {background-image: url("/img/main/point_bg.jpg"); }
.main #point .txtbox {padding: 100px 0;}
.main #point h2 span:after {position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #fff; content: ""; transition: 1.2s; transition-delay: 1s;}
.main #point h2.aos-animate span:after {width: 100%;}

.main #point .tit img {width: 7.125rem;}
.main #point .tit {display: flex; justify-content: flex-end;}

@media(max-width:768px) {
    .main #point .txtbox {padding: 80px 0;}
    .main #point .tit {justify-content: flex-start; margin-top: 4.5rem;}
}

@media(max-width:500px) {
    .main #point .tit .font-70 {font-size: 4rem;}
    .main #point .tit img {width: 6.5rem;}
}

@media(max-width:420px) {
    .main #point .tit .font-70 {font-size: 3.4375rem;}
    .main #point .tit img {width: 5rem;}
}

@media(max-width:360px) {
    .main #point h2 span:after {display: none;}
    .main #point h2 span {text-decoration: underline; text-decoration-line: 1px;}
}


/* 소식 */
.main #news .item {padding: 2rem 0; border-bottom: 1px solid #efefef; cursor: pointer;}
.main #news .item .item-img {position: relative; overflow: hidden;}
.main #news .item .item-img:after {position: absolute; content: ""; display: block; top: 0; right: 0; width: 5rem; height: 5rem; border-radius: 0 0 0 4.5rem; background: var(--pointcolor); z-index: 1; pointer-events: none; opacity: 0;}

.main #news .item:hover .item-img:after  {animation: circleExpand 1.4s ease forwards; }


@keyframes circleExpand {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(20);
        opacity: 0;
    }
}

@media(max-width:768px) {
    .main #news .cont_wrap {flex-direction: column;}
    .main #news .box {width: 100%;}
    .main #news .box h3 {width: 80%; font-size: 1.875rem;}
}

@media(max-width:500px) {
    .main #news .item {flex-direction: column; gap: 1.5rem;} 
    .main #news .item-txt {width: 100%;}
    .main #news .item-img {width: 100%; order: -1;}
    .main #news .item-img img {width: 100%;}
}

/* 브랜드 */
.main #brand .cont_wrap {mask-image: linear-gradient(to right,#0000,#000 12.5%,#000 87.5%,#0000);}
.main #brand .swiper-wrapper {transition-timing-function: linear;}
.main #brand .swiper-slide {width: fit-content; margin-right: 3.5rem;}

@media(max-width:990px) {
    .main #brand .swiper-slide {margin-right: 0;}
    .main #brand .swiper-slide img {transform: scale(0.8);}
}

@media(max-width:500px) {
    .main #brand .swiper-slide {margin-right: -2rem;}
    .main #brand .swiper-slide img {transform: scale(0.7);}
}

/* 문의하기 폼 */
#contac .cont_wrap {align-items: baseline;}
#contact .box {padding: 80px 5%;  overflow: hidden; height: auto;}
#contact .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1;}
#contact .bg img {transform: scale(1.2); width: 100%; transition: 5s; height: 100%; object-fit: cover;}
#contact .bg img.aos-animate {transform: scale(1);}

#contact .formbox {background: #f4f4f4; height: 100%;}
#contact .formbox .harf {width: 50%; padding-right: 1.25rem; display: inline-block; margin-bottom: 2rem;}
#contact .formbox .full {width: 100%;  padding-right: 1.25rem;}
#contact .formbox .right {float: right;}
#contact .formbox label span {color: #d72d2d;}
#contact .formbox input[type="text"],
#contact .formbox textarea {width: 100%; border-width: 0; padding: 1rem; border-radius: 5px; margin-top: 1rem; font-size: 1rem;}
 
#contact .formbox input:focus,
#contact .formbox textarea:focus {outline: none; box-shadow: none; border: none !important;} 

input::placeholder,
textarea::placeholder {color: #a6a6a6;}

#contact .formbox input[type="checkbox"] {background: #fff; border: none; width: 1rem; height: 1rem; margin-right: 0.5rem; margin-top: 0.1rem;}
#contact .formbox label[for="agree1"] span {color: #a6a6a6; font-weight: 400; font-size: 14px;}

#contact button {width: 100%; background: var(--pointcolor); color: #fff; padding: 1.35rem 1rem; border-radius: 5px; transition: 0.3s;}
#contact button:hover {background: #000;}

@media(max-width:990px) {
    #contact .cont_wrap {flex-direction: column;}
    #contact .box  {width: 100%;}
    #contact .bg img {width: 100%;}
}

@media(max-width:768px) {
    #contact .bg img.aos-animate {transform: scale(1);}

    #contact .formbox label.font-22 {font-size: 2.5rem;}
    #contact .formbox input[type="text"],
    #contact .formbox textarea {font-size: 1.75rem; margin-top: 1.5rem; padding: 1.5rem 2rem;}

    #contact .formbox .harf {width: 100%; margin-bottom: 3rem;}

    #contact .formbox input[type="checkbox"] {width: 1.5rem; height: 1.5rem; margin-top: 0.4rem; margin-right: 1rem;}
    #contact .formbox label.font-16 {font-size: 1.75rem;}
    #contact .formbox label[for="agree1"] span {font-size: 1.5625rem;}
    #contact button {font-size: 2.5rem; padding: 1.5rem;}
}

@media(max-width:420px) {
    #contact .formbox label[for="agree1"] span br {display: none !important;}
}

/* 네트워크 */
.sub #network h3 img {width: 3.375rem; display: inline-block;}
.sub #network li {background: #f8f8f8; padding: 1rem 3rem; margin-top: 1.5rem;}

@media(max-width:768px) {
    .sub #network .font-30 {font-size: 2rem;}
}

@media(max-width:360px) {
    .sub #network .tit .visible-xs {display: none !important;}
}