.section__01{}
.section__01 .section01__swiper{height: 100%;}
.section__01 .section01__swiper .swiper-wrapper{z-index: -1;}
.section__01 .section01__swiper .swiper-button-next:after, .swiper-button-prev:after{display: none;}
.section__01 .section01__swiper .swiper-slide{background-position: center !important;}
.section__01 .section01__swiper .slide01{background: url('../img/main/visual_01.png') no-repeat; background-size: cover;}
.section__01 .section01__swiper .slide02{background: url('../img/main/visual_02.png') no-repeat; background-size: cover;}
.section__01 .section01__swiper .slide03{background: url('../img/main/visual_03.png') no-repeat; background-size: cover;}
.section__01 .section01__title{position: absolute; max-width: 1200px; width: 90%; height: calc(100% - 210px); bottom: 0; left: 50%; transform: translateX(-50%);}
.section__01 .section01__title .section01__text h1{font-family: 'NIXGONL-Vb'; font-size: 80px; font-weight: normal; line-height: 1.06; letter-spacing: normal; text-align: left; color: #fff;}
.section__01 .section01__title .section01__paging{display: flex; align-items: center;}

.section__01 .section01__title .section01__paging .progress-block{display: flex; align-items: center;}
.section__01 .section01__title .section01__paging .pageNum{margin-left: 30px; font-size: 14px; letter-spacing: 0.35px; color: #fff;}
.section__01 .section01__title .section01__paging .pageNum span{font-family: 'GmarketSansMedium';}
.section__01 .section01__title .section01__paging .pro-bar-wrap{width: 140px; height: 3px; background: rgba(0,0,0,.2);}
.section__01 .section01__title .section01__paging .pro-bar{bottom:0; left:0; width:0; height:100%; background: #fff;}
.pro-ani{animation-name: proBar; animation-duration:4s; animation-iteration-count: 1; animation-timing-function: ease-in-out; width:100%;}

.section__01 .section01__title .section01__paging .arrow{display: flex; align-items: center; margin-left: 30px;}
.section__01 .section01__title .section01__paging .arrow div+div{margin-left: 15px;}
/* .section__01 .section01__title .section01__paging .arrow .progress-btn{display: flex; align-items: center;} */
.progress-btn--pause {background: transparent; outline: none; border: 0; height: 12px; display: flex; align-items: center;}
.section__01 .section01__title .section01__paging .arrow .swiper-button-next, .section__01 .section01__title .section01__paging .arrow .swiper-button-prev{position: static; width: initial; height: initial; margin-top: initial;}

@keyframes proBar{
    0%{width:0;}
    100%{width:100%;}
}

.section__01 .scroll{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; z-index: 2;}
.section__01 .scroll span{font-size: 11px; font-weight: 300; text-align: center; color: #fff;}
.section__01 .scroll div{margin-top: 12px; width: 1px; height: 50px; background-color: rgba(255, 255, 255, .5); position: relative;}
.section__01 .scroll div::after{position: absolute; content: ""; width: 100%; height: 20px; background-color: #fff; top: 0;}



.section__02{}
.section__02 .section__02-block{padding: 100px 0 85px; 
    /* height: calc(100% - 100px - 85px); */
}
.section__02 .tab-menu{display: flex; align-items: center; justify-content: center;}
.section__02 .tab-menu li{font-family: 'NIXGONM-Vb'; font-size: 14px; text-align: left; color: #ccc; cursor: pointer;}
.section__02 .tab-menu li+li{margin-left: 90px;}
.section__02 .tab-menu li.active{color: #000; position: relative;}
.section__02 .tab-menu li.active::after{content: ""; display: block; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); width: 3px; height: 3px; border-radius: 50%; background: #000;}
.section__02 .section02__swiper{position: relative;
    /* height: calc(100% - 104px); */
}
.section__02 .section02__swiper .swiper-wrapper{width : calc(48.95% * 3 + 1.041%); height: auto; max-height: 700px; position: relative; left: 50%;
    /* margin-left: calc((48.95% * 3 + 1.041%) / -2) */
}
.section__02 .section02__swiper .swiper-slide img{width: 100%; height: auto;}
.section__02 .section02__swiper .inner{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2;}
.section__02 .section02__swiper .swiper-button-next:after, .section__02 .section02__swiper .swiper-rtl .swiper-button-prev:after{display: none;}
.section__02 .moreBtn{width: 100px; height: 35px; display: flex; justify-content: center; align-items: center; margin: 40px auto 0; border: solid 1px #000;}
.section__02 .moreBtn span{font-size: 14px; font-family: 'GmarketSansMedium'; color: #000;}
.section__02 .moreBtn img{margin-left: 8px;}



.section__03{background-color: #f2f5f2;}
.section__03::after{content: "SIIA INTERIOR"; writing-mode:vertical-rl; position: absolute; right: -80px; top: 50%; transform: translateY(-50%);
    opacity: 0.04; font-family: 'Cinematografica-Thin-trial'; font-size: 460px; font-weight: 100; text-align: left; color: #33a437; white-space: nowrap;}
.section__03 .inner{padding: 100px 0 140px; height: 100%; display: flex; flex-direction: column; justify-content: center;}
.section__03 .section__03__title{display: flex; flex-direction: column; align-items: center;}
.section__03 ul{position:relative; z-index: 1; height: calc(100% - 97px); max-height: 720px;}
.section__03 ul li{width: 48.33%; height: 100%; display: flex; align-items: flex-end;}
.section__03 ul li:last-child{margin-left: 3.33%;}
.section__03 ul li.interior-start{background: url('../img/main/bn_01.png') no-repeat; background-size: cover;}
.section__03 ul li.construction-example{background: url('../img/main/bn_02.png') no-repeat; background-size: cover;}
.section__03 ul li .text-block{width: 100%; display: flex; flex-direction: column; align-items: center; padding: 82px 0;}
.section__03 ul li .text-block h5{font-size: 30px; font-family: 'GmarketSansMedium'; font-weight: 500; line-height: normal; letter-spacing: -1.5px; text-align: center; color: #000;}
.section__03 ul li .text-block P{font-family: 'NIXGONL-Vb'; font-size: 16px; font-weight: normal; line-height: 1.38; letter-spacing: normal; text-align: center; color: #000;}
.section__03 ul li .text-block a{display: flex; align-items: center; justify-content: center; width: 140px; height: 40px; border: solid 1px rgba(0,0,0,.3);}
.section__03 ul li .text-block a span{font-size: 15px; font-family: 'GmarketSansMedium'; font-weight: 500; letter-spacing: -0.38px; text-align: center; color: #000;}
.section__03 ul li .text-block a:hover{background-color:rgba(0,0,0,.8); transition: all .5s;}
.section__03 ul li .text-block a:hover span{color: #fff; transition: all .5s;}



.section__04{}
.section__04>.inner{padding: 50px 0 60px; display: flex; align-items: flex-start;}
.section__04 .footer__logo{width: 10.5%;}
.section__04 .footer__info{width: 64.66%; margin-left: 9.416%;}
.section__04 .footer__info ul{display: flex;}
.section__04 .footer__info ul li{position: relative; padding-right: 8px;}
.section__04 .footer__info ul li+li{margin-left: 8px;}
.section__04 .footer__info ul li::after{position: absolute; right: 0; top: 6px; content: ""; display: block; width: 2px; height: 10px; background-color: #D4D5D4;}
.section__04 .footer__info ul li:last-child:after{display: none;}
.section__04 .footer__info ul a{font-size: 14px; font-weight: 300; line-height: 1.79; letter-spacing: normal; text-align: left; color: #646664;}
.section__04 .footer__info .company-info p{font-size: 14px; font-weight: 300; line-height: 1.79; letter-spacing: normal; text-align: left; color: #646664;}
.section__04 .footer__info .company-info p.company-info__name{font-family: 'GmarketSansMedium';}
.section__04 .sns-block{margin-left: 10.91%; display: flex;}
.section__04 .sns-block a:last-child{margin-left: 10px;}
.section__04 .footer__copyright{padding: 23px 0; background-color: #F7F7F7;}
.section__04 .footer__copyright p{font-size: 12px; font-weight: 300; text-align: left; color: #646664;}
.scrollTopBtn{position: absolute; bottom: 40px; right: 20px; z-index: 3; cursor: pointer;}



@media (max-width:1024px){
    .section__01 .section01__title .section01__text h1{font-size: 3rem;}
}
@media (max-width:769px){
    .section__03::after{font-size: 230px; white-space: initial;}
    .section__03 ul li .text-block P{padding: 0 10px;}

    .section__04>.inner{flex-direction: column; padding: 20px 0 20px;}
    .section__04 .footer__logo{width: 100px;}
    .section__04 .footer__info{width: 100%; margin-left: 0;}
    .section__04 .sns-block{margin-left: 0;}
}
@media (max-width:500px){
    .section__01 .section01__title .section01__text h1{font-size: 1.4rem;}
    .section__01 .section01__title .section01__paging{align-items: flex-start; flex-direction: column; margin-top: 25px;}
    .section__01 .section01__title .section01__paging .pageNum{margin-left: 20px;}
    .section__01 .section01__title .section01__paging .arrow{margin-left: 0; margin-top: 20px;}

    .section__02 .tab-menu{width: 100%;}
    .section__02 .tab-menu li+li{margin-left: 7%;}
    .section__02 .swiper-button-next, .section__02 .swiper-button-prev{width: 35px; height: 35px;}
    .section__02 .swiper-button-next img, .section__02 .swiper-button-prev img{width: 100%;}

    .section__03 .inner{padding: 0;}
    .section__03 ul{flex-direction: column; height: initial; margin-top: 30px;}
    .section__03 ul li{width: 100%; height:50%; align-items: center;}
    .section__03 ul li.interior-start{background-size: 100%; background-position: 50% 36%;}
    .section__03 ul li .text-block{padding: 35px 10px; justify-content: space-between;}
    .section__03 ul li .text-block h5{font-size: 1rem;}
    .section__03 ul li .text-block P{display: none;}
    .section__03 ul li .text-block a{margin-top: 10px;}
    .section__03 ul li.construction-example{background-size: 100%; background-position: center 39%;}
    .section__03 ul li:last-child{margin-left: 0;}
    .section__03::after{font-size: 200px; bottom: 0; transform: initial;}
}