.inner-wide{max-width: 1760px; width: 95%; margin: auto;}

.mainTit-wrap{display: flex; flex-direction: column; align-items: center;}
.main-tit{font-size: 40px; text-align: center; color: #000; text-transform: uppercase; font-weight:900;}
.main-titSub{font-size: 16px; letter-spacing: -0.4px; text-align: center; color: #000; word-break: keep-all;}
.verLine{display: block; width: 3px; height: 40px; background-color: #999;}


.main__section01{position: relative;}
.main__section01::before{content: ""; position: absolute; top: 0; display: block; width: 100%; height: 400px; background-color: #f0f0f0; z-index: -1;}
/* .main__section01 .inner-wide{padding: 0 80px;} */
.main__section01 .main__section01-top{width: 100%;}
.main__section01 .main__section01-top .main__swiper{}
.main__section01 .main__section01-top .swiper-slide{height: 580px; display: flex; align-items: center; background-position: center; background-repeat: no-repeat; background-size: cover;}
.main__section01 .main__section01-top .swiper-slide.slide01{background-image: url('../img/main/visual_01.png');}
.main__section01 .main__section01-top .swiper-slide.slide02{background-image: url('../img/main/visual_02.png');}
.main__section01 .main__section01-top .swiper-slide.slide03{background-image: url('../img/main/visual_03.png');}
.main__section01 .main__section01-top .swiper-slide.slide04{background-image: url('../img/main/visual_04.png');}
.main__section01 .main__section01-top .swiper-slide.slide05{background-image: url('../img/main/visual_05.png');}
.main__section01 .main__section01-top .swiper-slide.slide06{background-image: url('../img/main/visual_06.png');}
.main__section01 .main__section01-top .swiper-slide.slide07{background-image: url('../img/main/visual_07.png');}
.main__section01 .main__section01-top .swiper-slide .slide_text {position:absolute; right:5px; bottom:5px; background:rgba(255,255,255,0.4); padding:2px 10px;}
.main__section01 .main__section01-top .swiper-slide .slide_text p {color:#000;}
.main__section01 .main__section01-top .swiper-button-next, .swiper-button-prev{color: #fff !important;}
.main__section01 .main__section01-top .section01-top__txt{padding: 0 140px;}
.main__section01 .main__section01-top .section01-top__txt h1{font-family: 'GmarketSansBold'; font-size: 45px; text-align: left;color: #fff; text-transform: uppercase;}
.main__section01 .main__section01-top .section01-top__txt p{font-size: 16px; font-weight: 300; line-height: 1.56; letter-spacing: -0.4px; text-align: left; color: #fff; word-break: keep-all;}
.main__section01 .main__section01-top .section01-top__txt a{display: inline-block; min-width: 80px; height: 30px; padding: 10px 22px 8px; border-radius: 15px; border: solid 2px #fff; box-sizing: border-box;
    font-family: 'GmarketSansMedium'; font-size: 10px; letter-spacing: 0.5px; text-align: center; color: #fff;}
.main__section01 .main__section01-banners{width: 100%; display: flex; flex-wrap: wrap;}
.main__section01 .main__section01-banners li{width: 24.14%; height: 240px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.main__section01 .main__section01-banners li+li{margin-left: 1.136%;}
.main__section01 .main__section01-banners li.banner01{background-image: url('../img/main/bn_03.png');}
.main__section01 .main__section01-banners li.banner02{background-image: url('../img/main/bn_01.png');}
.main__section01 .main__section01-banners li.banner03{background-image: url('../img/main/bn_02.png');}
.main__section01 .main__section01-banners li.banner04{background-image: url('../img/main/bn_04.png');}
.main__section01 .main__section01-banners li a{display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; padding: 50px 40px 30px; box-sizing: border-box;}
.main__section01 .main__section01-banners li a div h5{font-family: "omnigothic", sans-serif; font-weight: 500; font-style: normal; font-size: 25px; letter-spacing: -0.63px; text-align: left; color: #000;}
.main__section01 .main__section01-banners li a div p{margin-top: 10px; font-size: 14px; font-weight: 300; letter-spacing: -0.35px; text-align: left; color: #000;}
.main__section01 .main__section01-banners li a span{font-family: 'GmarketSansMedium'; font-size: 10px; font-weight: 500; line-height: 2; letter-spacing: 0.5px; text-align: left; color: rgba(0, 0, 0, .5);}
.main__section01 .main__section01-banners li.banner04 a div h5{color: #fff;}
.main__section01 .main__section01-banners li.banner04 a div p{color: #fff;}
.main__section01 .main__section01-banners li.banner04 a span{color: rgba(255,255,255,.5);}
.main__section01 .scroll-block{display: flex; align-items: center; justify-content: space-between;}
.main__section01 .scroll-block>span{display: inline-block; width: 46.02%; height: 1px; background-color: #e6e6e6;}
.main__section01 .scroll-block .scroll{display: flex; flex-direction: column; align-items: center; animation: scrollUpDown infinite ease-in Alternate;}
.main__section01 .scroll-block .scroll span{display: inline-block; margin-top: 5px; font-size: 13px; font-weight: bold; text-align: center; color: #000; text-transform: uppercase;}
@keyframes scrollUpDown {
    to{margin-top: -10px;}
    from{margin-top: 0;}
}


.main__section02{}
.main__section02 .installationCase-block{width: 100%;}
.main__section02 .installationCase-block ul{display: flex; flex-wrap: wrap; width: 100%;}
.main__section02 .installationCase-block ul li{width: 18.63%; margin-right: 1.704%; margin-top: 20px; box-sizing: border-box;}
.main__section02 .installationCase-block ul li:nth-child(5n){margin-right: 0;}
.main__section02 .installationCase-block ul li img{width: 100%;}
.main__section02 .installationCase-block ul li .subject{padding: 20px 0; display: flex; flex-direction: column; align-items: center;}
.main__section02 .installationCase-block ul li .subject p{font-family: 'GmarketSansMedium'; font-size: 20px; font-weight: 500; line-height: 1.25; letter-spacing: -0.5px; text-align: center; color: #000;}
.main__section02 .installationCase-block ul li .subject span{display: inline-block; margin-top: 5px; font-family: 'GmarketSansMedium'; font-size: 12px; font-weight: 300; line-height: 2; letter-spacing: normal; text-align: center; color: #999;}
.main__section02 .installationCase-moreBtn-wrap{text-align: center;}
.main__section02 .installationCase-moreBtn-wrap a{display: inline-flex; align-items: center; min-width: 160px; padding: 10px 20px 8px 25px; border-radius: 20px; background-color: #000; box-sizing: border-box;}
.main__section02 .installationCase-moreBtn-wrap a span{font-family: 'GmarketSansMedium'; font-size: 14px; font-weight: 500; text-align: left; color: #fff;}
.main__section02 .installationCase-moreBtn-wrap a img{margin-left: 15px;}


.main__section03{background: url('../img/main/bg_best.png') no-repeat center/cover;}
.main__section03 .bestSellers__swiper{}

/* 스와이퍼 공통 스타일 */
.common-swiperStyle .swiper-slide{display: flex; flex-direction: column; margin-top: 20px; background-color: #fff; box-sizing: border-box;}
.common-swiperStyle .swiper-slide>a{padding: 40px 30px;}
.common-swiperStyle .swiper-slide .num-wrap{display: inline-block; width: 20px; font-family: 'GmarketSansBold'; font-size: 16px; text-align: left; color: #000; border-bottom: 1px solid #000; box-sizing: border-box;}
.common-swiperStyle .swiper-slide .new{display: inline-block; width: 44px; font-family: 'GmarketSansBold'; font-size: 16px; text-align: left; color: #e61205; border-bottom: 1px solid #000; box-sizing: border-box;}
.common-swiperStyle .swiper-slide img{max-width: 268px; width: 100%;}
.common-swiperStyle .swiper-slide .prd-txt{}
.common-swiperStyle .swiper-slide .prd-txt h5{font-family: 'GmarketSansBold'; font-size: 20px; line-height: 1.2; text-align: left; color: #000;
    overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.common-swiperStyle .swiper-slide .prd-txt p{margin-top: 10px; font-family: 'NEXONLv2GothicOTF'; font-size: 14px; text-align: left; color: #999;
    overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.common-swiperStyle .swiper-slide .prd-txt span{display: inline-block; margin-top: 10px; font-family: 'GmarketSansMedium'; font-size: 10px; line-height: 1; letter-spacing: 0.5px; text-align: left; color: #ccc;}
.common-swiperStyle .swiper-pagination{position: static; margin-top: 35px;}
.common-swiperStyle .swiper-pagination-bullet{width: 15px; height: 15px; background-color: rgba(0, 0, 0, .2);}
.common-swiperStyle .swiper-pagination-bullet-active{background-color: rgba(0, 0, 0, 1);}
.common-swiperStyle .swiper-slide.swiper-slide-active{margin-top: 0px; box-shadow: 10px 10px 10px 0 rgba(0, 0, 0, 0.1);}

/*.main__section04{background: url('../img/main/bg_new.png') no-repeat center/cover;}*/
.main__section04 .newPrd__swiper{}
.main__section04 .newPrd__swiper ul li {border:1px solid #e6e6e6;}


.section__brands{background-color: #f5f5f5;}
.section__brands .inner-wide{max-width: 1740px;}
.section__brands .brands{display: flex; flex-wrap: wrap;}
.section__brands .brands img{margin-right: 0.15%; margin-top: 0.15%; width: 8.18%;}
.section__brands .brands img:nth-child(12n){margin-right: 0;}


@media (max-width: 1024px) {
    .main__section01 .main__section01-top .section01-top__txt{padding: 0; padding-left: 60px;}
    
    .main__section01 .main__section01-banners li{width: 49.43%; margin-right: 1.136%;}
    .main__section01 .main__section01-banners li+li{margin-left: initial;}
    .main__section01 .main__section01-banners li:nth-child(2n){margin-right: 0;}
    .main__section01 .main__section01-banners li:nth-child(3){margin-top: 1.136%;}
    .main__section01 .main__section01-banners li:nth-child(4){margin-top: 1.136%;}

    .main__section02 .installationCase-block ul li{width: 32.19%;}
    .main__section02 .installationCase-block ul li:nth-child(5n){margin-right: 1.704%}
    .main__section02 .installationCase-block ul li:nth-child(3n){margin-right: 0}
}

@media (max-width: 769px) {
    .main-tit{font-size: 32px;}

    .main__section01::before{height: 25%;}
    .main__section01 .main__section01-top .swiper-slide{height: 400px; justify-content: center;}
    .main__section01 .main__section01-top .section01-top__txt{padding: 0 20px; display: flex; flex-direction: column; align-items: center;}
    .main__section01 .main__section01-top .section01-top__txt h1{text-align: center; font-size: 32px;}
    .main__section01 .main__section01-top .section01-top__txt p{text-align: center;}
    .main__section01 .main__section01-banners li{min-height: 200px; height: initial;}
    .main__section01 .main__section01-banners li a{padding: 40px 30px 30px;}
    .main__section01 .main__section01-banners li a div h5{font-size: 20px;}

    .main__section01 .scroll-block{margin-top: 40px;}
    .main__section01 .scroll-block .scroll span{font-size: 12px;}

    .common-swiperStyle .swiper-slide{margin-top: 0;}

    .section__brands .brands img{width: 19.75%;}
    .section__brands .brands img:nth-child(12n){margin-right: 0.454%;}
    .section__brands .brands img:nth-child(5n){margin-right: 0 !important}
}

@media (max-width: 500px) {
    :root {
        --swiper-navigation-size: initial;
    }

    .main-tit{font-size: 24px;}
    .main-titSub{font-size: 14px;}
    .verLine{height: 30px;}
    
    .main__section01{padding-top: 15px;}
    .main__section01 .main__section01-top .swiper-slide{height: 300px;}
    .main__section01 .main__section01-top .section01-top__txt h1{font-size: 20px;}
    .main__section01 .main__section01-banners{margin-top: 10px;}
    .main__section01 .main__section01-banners li{min-height: 170px;}
    .main__section01 .main__section01-banners li a{padding: 30px 20px 20px;}
    .main__section01 .main__section01-banners li a div h5{font-size: 18px;}
    .main__section01 .scroll-block{margin-top: 20px;}
    .main__section01 .scroll-block .scroll img:first-child{height: 18px;}
    .main__section01 .scroll-block .scroll img:last-child{margin-top: 5px;}

    .main__section02{margin-top: 40px; padding-bottom: 40px;}
    .main__section02 .installationCase-block{margin-top: 15px;}
    .main__section02 .installationCase-block ul li{width: 49%; margin-top: 10px;}
    .main__section02 .installationCase-block ul li:nth-child(3n){margin-right: 1.704%;}
    .main__section02 .installationCase-block ul li:nth-child(2n){margin-right: 0;}
    .main__section02 .installationCase-block ul li .subject{padding: 10px 0 0;}
    .main__section02 .installationCase-block ul li .subject p{font-size: 14px;}
    .main__section02 .installationCase-block ul li .subject span{margin-top: 0;}
    .main__section02 .installationCase-moreBtn-wrap{margin-top: 20px;}

    .main__section03{padding: 40px 0;}
    .common-swiperStyle{width: 100%;}
    .common-swiperStyle .swiper-slide>a{padding: 20px;}
    .common-swiperStyle .swiper-slide .prd-txt{margin-top: 10px;}
    .common-swiperStyle .swiper-slide .prd-txt h5{font-size: 16px;}
    .common-swiperStyle .swiper-slide .prd-txt p{word-break: keep-all;}
    .main__section04{padding: 40px 0;}
    .main__section04 .newPrd__swiper{width: 100%;}

    /* .section__brands .brands img{width: 32.88%;}
    .section__brands .brands img:nth-child(4n){margin-right: 0.454% !important;}
    .section__brands .brands img:nth-child(3n){margin-right: 0;} */
}

@media (max-width: 375px) {
    .main__section01 .main__section01-banners li{width: 100%; margin-right: 0; margin-top: 1.136%;}
}

