@charset "utf-8";
html,body{overflow-x: hidden;}
body, main {height: 100%;overflow: hidden;}

/*메인 페이지*/
main.index{}
main.index article.article-item{width: 100%;height: 100%;min-height: 90rem;}
main.index article.article-item.swiper-slide.swiper-slide-active {}
main.index article.article-item.swiper-slide .container{display: flex;align-items: center;height: 100%;}

main.index #section01 .visual-swiper {position: relative;width: 100%;height: 100%;}
main.index #section01 .visual-swiper .swiper-slide{position: relative;width: 100%;height: 100%;}
main.index #section01 .visual-swiper .swiper-slide .bg-box{width: 100%;height: 100%;overflow: hidden;position: absolute;top:0;left: 0;}
main.index #section01 .visual-swiper .swiper-slide .bg-box img{width: 100%;height: 100%;object-fit: cover;display: block;}

main.index #section01 .visual-swiper .text-box{position: absolute;top:50%;transform: translateY(-50%);left: var(--container-padding);z-index: 1;max-width: calc(100% - 16rem);}
main.index #section01 .visual-swiper .text-box h2{font-family: var(--Poppins);font-weight: 600;font-size: 8.4rem;color:var(--white-op-100);line-height: 1.07;letter-spacing: 0.005em;}
main.index #section01 .visual-swiper .text-box p{font-family: var(--Pretendard);font-weight: 400;font-size: 2.2rem;color:var(--white-op-80);line-height: 4.54em;position: relative;letter-spacing: -0.025em;}
main.index #section01 .visual-swiper .visual-swiper-pagination{}
main.index #section01 .visual-swiper .visual-swiper-pagination .swiper-pagination-bullet{width: 1rem;height: 1rem;background-color: var(--white-op-100);opacity: 1;transition-duration: 0.3s;transition-property: background-color;}
main.index #section01 .visual-swiper .visual-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: var(--point-color)}

main.index #section02 {}
main.index #section02 .content-box{display: flex;width: 100%;height: 100%;}
main.index #section02 .content-box .left-box{width: 50%;display: flex;flex-direction: column;justify-content: center;}
main.index #section02 .content-box .right-box{width: 50%;}
main.index #section02 .content-box .text-box{padding:var(--container-padding);}
main.index #section02 .content-box .text-box h2{font-family: var(--Poppins);font-weight: 500;font-size: 8rem;color:var(--default-color);line-height: 1.875;}
main.index #section02 .content-box .text-box p{font-family: var(--Pretendard);font-weight: 600;font-size: 2rem;color:var(--black-op-60);line-height: 1.5;    letter-spacing: -0.05em;}
main.index #section02 .content-box .text-box a{display: block;font-family: var(--Pretendard);font-weight: 700;font-size: 1.8rem;color:var(--a-color);line-height: 1;letter-spacing: -0.05em;transition-duration: 0.6s;transition-property: color;margin-top: 3rem;}
main.index #section02 .content-box .text-box a::after{content:'';display: inline-block;background-image: url("../../images/web/icons/icon-arrow.svg");background-repeat: no-repeat;background-size: cover;width: 2.7rem;height: 1.1rem;transition-duration: 0.6s;transition-property: background-image,transform;margin-left: 0.5em;}
main.index #section02 .content-box .text-box a:hover{color:var(--a-hover-color);}
main.index #section02 .content-box .text-box a:hover::after{background-image: url("../../images/web/icons/icon-arrow-hover.svg");transform: translateX(40%);}
main.index #section02 .content-box .text-box .img{width:48.5rem;height: 18.9rem;overflow-block: hidden; margin-top: 14rem}
main.index #section02 .content-box .text-box .img img{width: 100%;height: 100%;display: block;object-fit: cover;}
main.index #section02 .content-box .img-box{width: 100%;overflow: hidden;height: 100%;}
main.index #section02 .content-box .img-box img {width: 100%;height: 100%;object-fit: cover;display: block;}
main.index #section02 .building-swiper{width: 100%;height: 100%;overflow: hidden;}
main.index #section02 .building-swiper .swiper-slide{width: 100%;height: 100%;}
main.index #section02 .building-swiper .swiper-slide .bg-box{width: 100%;height: 100%;overflow: hidden;}
main.index #section02 .building-swiper .swiper-slide .bg-box > img{width: 100%;height: 100%;display: block;object-fit: cover;}
main.index #section02 .building-swiper-pagination{margin-top: 3rem;}
main.index #section02 .building-swiper-pagination .swiper-pagination-bullet{width: 1rem;height: 1rem;background-color: #e1e1e1;opacity: 1;transition-duration: 0.3s;transition-property: background-color;}
main.index #section02 .building-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: var(--point-color)}


main.index #section03{background-image: url("../../images/web/section03-bg.png");background-size: cover;background-repeat: no-repeat;}
main.index #section03 .content-box{display: flex;width: 100%;height: 100%;padding-left: var(--container-padding);padding-top: var(--header-height)}
main.index #section03 .content-box .left-box{padding:0 10rem;width: 47rem;display: flex;flex-direction: column;justify-content: center;}
main.index #section03 .content-box .right-box{width: calc(100% - 47rem);}
main.index #section03 .text-box{text-align: right;}
main.index #section03 .text-box h2{font-family: var(--Pretendard);font-weight: 600;font-size: 8rem;color:var(--black-op-100);letter-spacing: -0.025em;}
main.index #section03 .text-box p{font-family: var(--Pretendard);font-weight: 600;font-size: 2rem;color:var(--black-op-60);letter-spacing: -0.055em;margin-top: 4rem;}
main.index #section03 .text-box a{display: block;font-family: var(--Pretendard);font-weight: 700;font-size: 1.8rem;color:var(--default-color);line-height: 1;letter-spacing: -0.05em;transition-duration: 0.6s;transition-property: color;margin-top: 3rem;}
main.index #section03 .text-box a::after{content:'';display: inline-block;background-image: url("../../images/web/icons/icon-arrow-black.svg");background-repeat: no-repeat;background-size: cover;width: 2.7rem;height: 1.1rem;transition-duration: 0.6s;transition-property: background-image,transform;margin-left: 0.5em;}
main.index #section03 .text-box a:hover{color:var(--a-hover-color);}
main.index #section03 .text-box a:hover::after{background-image: url("../../images/web/icons/icon-arrow-hover.svg");transform: translateX(40%);}
main.index #section03 .facility-box{top: 50%;position: relative;transform: translateY(-50%);overflow: hidden;padding:3rem 2rem;}
main.index #section03 .facility-box .facility-item{}
main.index #section03 .facility-box .facility-item .img-box{max-width: 100%;width: 80rem;height:56rem;border-radius: 24rem;overflow: hidden;transform: scale(0.9);transition-duration: 0.6s;box-shadow: 1rem 1rem 1rem 0 rgba(0,0,0,0.2);transition-property: transform ,box-shadow;}
main.index #section03 .facility-box .facility-item .name-box{width: 80rem;font-family: var(--Pretendard);font-weight: 600;font-size: 2.6rem;color:var(--black-op-100);letter-spacing: -0.05em;margin-top: 4rem;text-align: center;}
main.index #section03 .facility-box .facility-item.swiper-slide-active .img-box{transform: scale(1);box-shadow: 1rem 1.2rem 2rem 1.3rem rgba(0,0,0,0.2);}
main.index #section03 .control-box{display: flex;column-gap: 2rem;justify-content: flex-end;margin-top: 10rem;}
main.index #section03 .control-box .facility-button-next{width:6rem;height: 6rem;border-radius: 100%;background-color: #ffffff;border:1px solid #c7c7c7;cursor: pointer;position: relative;}
main.index #section03 .control-box .facility-button-next::before{content:'';background-image: url("../../images/web/icons/icon-arrow.png");background-size: 2.4rem 1.8rem;background-repeat: no-repeat;background-position: center;display: block;position: absolute;top:0;left: 0;width: 100%;height: 100%;}
main.index #section03 .control-box .facility-button-prev{width:6rem;height: 6rem;border-radius: 100%;background-color: #ffffff;border:1px solid #c7c7c7;cursor: pointer;position: relative;}
main.index #section03 .control-box .facility-button-prev::before{content:'';background-image: url("../../images/web/icons/icon-arrow.png");background-size: 2.4rem 1.8rem;background-repeat: no-repeat;background-position: center;display: block;position: absolute;top:0;left: 0;width: 100%;height: 100%;transform: rotate(180deg)}

main.index #section04 .youtube-box{width: 100%;height: 100%;}
.video-box{pointer-events: none;width: 100%;height: 100%;}

@media all and (max-width:1400px) {


}
@media all and (max-width:1000px) {

    main.index #section01 .visual-swiper .text-box p {font-size: 3rem;}
    main.index #section01 .visual-swiper .visual-swiper-pagination .swiper-pagination-bullet{width: 2rem;height: 2rem;}


    main.index #section02 .content-box {flex-direction: column;}
    main.index #section02 .content-box .left-box {width: 100%;height: 50%;}
    main.index #section02 .content-box .right-box {width: 100%;height: 50%;}
    main.index #section02 .content-box .text-box h2 {font-size: 10rem;}
    main.index #section02 .content-box .text-box p {font-size: 2.8rem;}
    main.index #section02 .content-box .text-box a {font-size: 3rem;margin-top: 5rem;}
    main.index #section02 .content-box .text-box a::after {width: 3.8rem;height: 1.5rem;}
    main.index #section02 .content-box .text-box .img {display: none;}
    main.index #section02 .building-swiper-pagination{margin-top: 6rem}
    main.index #section02 .building-swiper-pagination .swiper-pagination-bullet{width: 2rem;height: 2rem;}

    main.index #section03 {background-image: none;}
    main.index #section03 .content-box {flex-direction: column;padding:0;}
    main.index #section03 .content-box .left-box {background-image: url(../images/section03-bg-mobile.png);background-size: cover;background-position: bottom right;width: 100%;height: 50%;padding:var(--container-padding);    justify-content: flex-end;padding-bottom: 8rem;}
    main.index #section03 .content-box .right-box {width: 100%;height: 50%;}
    main.index #section03 .text-box {text-align: left;}
    main.index #section03 .content-box .text-box h2 {font-size: 10rem;}
    main.index #section03 .content-box .text-box p {font-size: 2.8rem;}
    main.index #section03 .content-box .text-box a {font-size: 3rem;margin-top: 5rem;}
    main.index #section03 .content-box .text-box a::after {width: 3.8rem;height: 1.5rem;}
    main.index #section03 .facility-box {top: 0;height: 100%;padding:0;transform: translateY(0);}
    main.index #section03 .facility-box .facility-item {height: 100%;}
    main.index #section03 .facility-box .facility-item .img-box {max-width: 100%;width: 100%;height: 100%;border-radius: 0;overflow: hidden;box-shadow: none;}
    main.index #section03 .facility-box .facility-item .img-box img{width: 100%;height: 100%;display: block;object-fit: cover;}
    main.index #section03 .facility-box .facility-item .name-box {width: auto;font-family: var(--Pretendard);font-weight: 600;font-size: 3.4rem;color: var(--white-op-100);letter-spacing: -0.05em;margin-top: 4rem;text-align: center;position: absolute;left: var(--container-padding);bottom:var(--container-padding);z-index: 2;}
    main.index #section03 .control-box  {display: none;}



}

@media all and (max-width:760px) {
    main.index #section02 .content-box .left-box {height: calc((100% - var(--header-height)) / 2 ) ;margin-top: var(--header-height);}
    main.index #section02 .content-box .right-box {height: calc((100% - var(--header-height)) / 2 ) ;}
    main.index #section03 .content-box .left-box {height: calc((100% - var(--header-height)) / 2 ) ;margin-top: var(--header-height);}
    main.index #section03 .content-box .right-box {height: calc((100% - var(--header-height)) / 2 ) ;}

}
