/* 메인 visual swiper */
/* .visual-swiper {width: 100%; height: 600px; margin-top: var(--hd-height); z-index: 0;}
.visual-swiper ul li {display: flex; flex-direction: column; align-items: center; text-align: center;}
.visual-swiper ul li::after {content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); z-index: 0;}
.visual-swiper ul li.slide1 {background: url(/theme/basic/img/main/vis_main_swiper_01.png) center / cover no-repeat;}
.visual-swiper ul li.slide2 {background: url(/theme/basic/img/main/vis_main_swiper_02.jpg) center / cover no-repeat;}
.visual-swiper ul li p {display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; z-index: 1;}
.visual-swiper ul li .visual-title {margin: 152px 0 16px; font-size: 52px; font-weight: 700; line-height: 1.2;}
.visual-swiper ul li .visual-title span {color: #fe7e22; font-size: 36px; font-weight: 700; line-height: 1.3;}
.visual-swiper ul li .visual-contents {font-size: 20px; font-weight: 500; line-height: 1.5;}
.visual-swiper .swiper-pagination {margin-bottom: 150px;}
.visual-swiper .swiper-button-prev,
.visual-swiper .swiper-button-next {color: #fff;}
.visual-swiper .swiper-button-prev::after,
.visual-swiper .swiper-button-next::after {font-size: 36px;}
.visual-swiper .swiper-button-prev {left: 20px;}
.visual-swiper .swiper-button-next {right: 20px;}
.visual-swiper .swiper-pagination-bullet {background-color: #aaa; transition: all 0.3s ease; opacity: 1;}
.visual-swiper .swiper-pagination-bullet-active {width: 40px; background-color: #fe7e22; border-radius: 4px;} */

/* 기존 초기화용 */
/* #main .our-service .service-list {margin: 0; gap: 0;}
#main .our-service .service-list li {filter: none;}
.service-list li {position: relative; overflow: hidden;}
#main .our-service .service-list li a {background: unset; clip-path: none; aspect-ratio: unset; border-radius: unset;} */


/* #main .our-service {max-width: 1480px; padding: 0; border-radius: 20px; overflow: hidden;}
#main .our-service .service-list li {background-color: #fff; }
#main .our-service .service-list li::after {content: ''; position: absolute; bottom: -160px; right: -160px; width: 100%; height: 100%; background: url(/theme/basic/img/main/bg_service_hover.png) center / cover no-repeat; transform: scale(0.2); transition: all 0.4s ease;}
#main .our-service .service-list li a {padding: 36px 0; text-align: center;}
#main .our-service .service-list li img {margin-bottom: 16px;}
#main .our-service .service-list li strong {margin-bottom: 12px; font-size: 24px; font-weight: 600; line-height: 1.3; transition: color 0.4s ease;}
#main .our-service .service-list li span {color: #333; font-size: 18px; line-height: 1.5; letter-spacing: -0.02rem;}

#main .install-history {display: flex; flex-flow: row nowrap; gap: 3vw; padding: 160px 0; align-items: center;}
#main .install-history .left {display: flex; flex-direction: column; width: 31.5%; min-width: 400px;}
#main .install-history .left img {width: min-content; margin-bottom: 10px;}
#main .install-history .left .tit-sub {margin-bottom: 8px; color: #283849; font-size: 24px; font-weight: 600; line-height: 1.3;}
#main .install-history .left .tit {margin-bottom: 3vw; font-size: 38px; font-weight: 700; line-height: 1.3;}
#main .install-history .left .tit em {display: block; color: #fe7e22; font-size: inherit; font-weight: inherit; line-height: inherit; font-style: normal;  letter-spacing: -0.02rem;}
#main .install-history .left .desc {color: #333; font-size: 20px; line-height: 1.5;}
#main .install-history .right {width: calc(100% - (31.5% + 3vw));}
#main .install-history .right .tit-area {margin-bottom: 24px; padding-bottom:20px; border-bottom:2px solid #1f1f1f;}
#main .install-history .right .tit-area h3 {font-size: 34px; font-weight: 700; line-height: 1.3;}
#main .install-history .right .install-card-list {height: fit-content;}
#main .install-history .right .install-card-item {padding: 16px 12px; border-radius: 16px; border: 1px solid #ececec;}
#main .install-history .right .install-card-item::after {content: 'NEW'; position: absolute; top: 10px; left: 10px; padding: 4px 8px; color: #fff; background-color: #fe7e22; border-radius: 100px; font-size: 14px;}
#main .install-history .right .install-card-item a {display: block;}
#main .install-history .right .install-card-thumb {width: 100%; margin-bottom: 10px; aspect-ratio: 1/1; overflow: hidden; border-radius: 8px;}
#main .install-history .right .install-card-thumb img {width: 100%; height: 100%; object-fit: cover;}
#main .install-history .right .install-card-address {margin-bottom: 8px; color:#222; font-size: 18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#main .install-history .right .install-card-regn {margin-right: 4px; color: #fe7e22; font-weight: 600;}
#main .install-history .right .install-card-date {font-size: 14px; color:#616161;}
#main .install-history .right .install-card-empty {font-size: 14px; color:#616161; padding:20px 0; }
#main .install-history .right .swiper-button-prev,
#main .install-history .right .swiper-button-next {width: 36px; height: 36px; border-radius: 50%; background-color: #fff; border: 1px solid #616161; opacity: 0.8; transform: translateY(80%);}
#main .install-history .right .swiper-button-prev::after,
#main .install-history .right .swiper-button-next::after {font-size: 16px; font-weight: 700; color: #616161;}
#main .install-history .right .swiper-button-prev {left: 4px;}
#main .install-history .right .swiper-button-next {right: 4px;}
#main .install-history .right .read-more {display: none;} */


/* @media (min-width: 1024px){
    #main .our-service .service-list li:hover::after {bottom: -148px; right: -118px; transform: scale(1);}
    #main .our-service .service-list li:hover strong {color: #fe7e22;}
} */

@media (max-width: 1024px){
    .popUp {width: calc(100% - 40px); max-width: 400px;}
    #hd.active {background-color: unset; backdrop-filter: unset;}

    .visual-swiper {height: 90svh; margin-top: 0;}
    .visual-swiper ul li {align-items: flex-start; padding: 0 20px; text-align: left;}
    .visual-swiper ul li p {align-items: flex-start;}
    .visual-swiper ul li .visual-title {margin: 224px 0 8px; font-size: 24px;}
    .visual-swiper ul li .visual-title span {font-size: 24px;}
    .visual-swiper ul li .visual-contents {font-size: 14px; font-weight: 400;}
    .visual-swiper .swiper-button-prev,
    .visual-swiper .swiper-button-next {display: none;}
    .visual-swiper .swiper-pagination {margin-bottom: 96px; padding: 0 15px; text-align: left;}

    /* 기존 초기화 */
    #main .our-service {backdrop-filter: unset; background: unset; box-shadow: unset;}
    #main .our-service .service-list li {aspect-ratio: unset;}

    #main .our-service {padding-bottom: 48px; border-radius: unset; overflow: visible;}
    #main .our-service .service-list {flex-wrap: wrap; gap: 12px 10px;}
    #main .our-service .service-list li {width: calc(50% - 5px); border-radius: 8px; border-bottom-left-radius: 0; border-bottom-right-radius: 24px; overflow: hidden; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);}
    #main .our-service .service-list li a {min-height: 170px; padding: 16px; align-items: flex-start;}
    #main .our-service .service-list li img {width: 32px; margin-bottom: 6px;}
    #main .our-service .service-list li strong {margin-bottom: 8px; font-size: 20px;}
    #main .our-service .service-list li span {text-align: left; font-size: 14px;}
    #main .our-service .service-list li span br {display: none;}

    #main .install-history {flex-direction: column; padding: 64px 0; gap: 32px;}
    #main .install-history .left {min-width: unset; width: 100%;}
    #main .install-history .left img {width: 24px; margin-bottom: 6px;}
    #main .install-history .left .tit-sub {margin-bottom: 4px; font-size: 16px;}
    #main .install-history .left .tit {margin-bottom: 8px; font-size: 28px;}
    #main .install-history .left .desc {font-size: 16px;}
    #main .install-history .right {width: 100%;}
    #main .install-history .right .tit-area {margin-bottom: 16px; padding-bottom: 12px;}
    #main .install-history .right .tit-area h3 {font-size: 20px;}
    #main .install-history .right .install-card-item {padding: 10px; border-radius: 12px;}
    #main .install-history .right .install-card-item::after {top: 6px; left: 8px;}
    #main .install-history .right .install-card-address {font-size: 16px;}
    #main .install-history .right .install-card-regn {display: block; margin-bottom: 6px;}
    #main .install-history .right .install-card-date span {display: block;}
    #main .install-history .right .install-card-date .date {margin-bottom: 4px;}
    #main .install-history .right .swiper-button-prev,
    #main .install-history .right .swiper-button-next {display: none;}
}