.main--event--banner{
    position:relative;
    z-index: 1;
    height: calc(100vh - 70px);
    max-height: 1024px;
}
.main--event--banner img{
    height: 100%;
    object-fit: cover;
    position: relative;
    width: 100%;
}

.main--event--banner .main--event--title{
    position:absolute;
    width:92%;
    max-width:1440px;
    bottom:32px;
    left:50%;
    transform: translateX(-50%);
    z-index: 9;
    margin:0 4%;
    box-sizing: border-box;
}




.main--event--banner .main--event--title > h2{
    letter-spacing: -0.015em;
    font-size:45px;
    font-weight:800;
    margin-bottom:20px;
}
.main--event--banner .main--event--title > h2.black{
    color:#000;
}
.main--event--banner .main--event--title > h2.white{
    color:#fff;
}
.main--event--banner .main--event--title a{
    font-size:20px;
    color:#fff;
    background:#000;
    display:inline-flex;
    padding: 1em;
    padding-inline: 2em;
}

.main--event--banner .main--event--title a.white{
    background:#fff;
    color:#000;
}


@media screen and (max-width:880px){
    .main--event--banner .main--event--title{
        left:0%;
        transform: translateX(0%);
        box-sizing: border-box;
    }
    .main--event--banner .main--event--title > h2{
        font-size:30px;
    }
    .main--event--banner .main--event--title a{
        width:100%;
        justify-content: center;
        box-sizing: border-box;

    }
}

/******************************************************************************/

.title--service--menu .title{
    width:100%;
    text-align: center;
    padding-top:54px;
    margin-bottom:54px;
}
.title--service--menu .title > h2{
    font-size: 5.4rem;
    line-height: 7.8rem;
    font-weight: 700;
}

.swiper--slide--contents{
    height:100vh;
    width:100%;
    display: grid;
    grid-template-columns: 30% 70%;
}

@media screen and (max-width:1024px){
    .swiper--slide--contents{
        display:flex;
        flex-direction: column;
    }
}


.swiper-pagination{
    position:static;
    width:auto!important;
}

.swiper-pagination span{
    background:none;
    font-weight: bold;
    color: rgb(0, 0, 0);
    border-bottom: 2px solid rgb(0, 0, 0);
    border-radius:0px;
    font-size:14px;
    width:auto;
    height:auto;
    margin:0 15px!important;
}

.slide--wrapper{
    display:flex;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.nav--thumb{
    grid-area: 1 / 2 / auto / auto;
    height:100vh;
    overflow:hidden;
}

.nav--thumb img{
    height:100%;
    width: 100%;
    object-fit: cover;
    position:absolute;
    top:50%;
    transform: translateY(-50%);
}

.nav--thumb .img--wrapper{
    position:relative;
    height:100vh;
    overflow:hidden;
}
.nav--thumb .img--wrapper video{
    position: absolute;
    bottom:0%;
    width: 100%;
    min-height: 80%;
    object-fit: cover;
    overflow: hidden;
}


.swiper-button-next,
.swiper-button-prev{
    position:static;
    width:24px;
    height:24px;
    margin:0px;
}

.swiper-button-next:after,
.swiper-button-prev:after{
    display:none;
}

.swiper--actions--wrap{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:0px 125px;
    padding-top:20px;

}
.swiper--actions--wrap > div{
    max-width:100%;
}


@media screen and (max-width:1024px){
    .swiper--actions--wrap{
        flex-direction: column-reverse;
        padding:0 25px;
        padding-top: 20px;
    }
    .swiper--actions--wrap .swiper--actions{
        margin-left:0px!important;
    }
}

.swiper--actions{
    display:flex;
    align-items: center;
    justify-content:flex-start;
    width:100%;
    padding:32px 0px;
}

.swiper--actions--wrap .swiper--actions{
    padding-top:0px;
    margin-left: 125px;
    width:auto;
    flex-wrap: nowrap;
}
.swiper--actions--wrap .swiper--actions .swiper-pagination{
    flex-wrap: nowrap;
    display: flex;
}





.swiper-button-next svg,
.swiper-button-prev svg{
    width:24px;
    height:24px;
    color:#000;
}


.swiper-button-next.wtf--s svg,
.swiper-button-prev.wtf--s svg{
    width:24px;
    height:24px;
    color:#fff;
}

.swiper--slide--contents .slide--wrapper{
    padding:0 32px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
}
.swiper--slide--contents .slide--wrapper .desc--wrapper h2{
    font-weight: 700;
    font-size:24px;
    line-height:36px;
    margin-block-end: 12px;
    text-align: left;
    justify-content:flex-start;
}
.swiper--slide--contents .slide--wrapper .desc--wrapper > div{
    font-size:16px;
    line-height:24px;
    color: rgb(51, 51, 51);
    font-weight: 400;
}


.full--size--swiper--slide--contents .img--wrapper{
    height: calc(100vh - 157px);
    overflow: hidden;
    position:relative;
}
.full--size--swiper--slide--contents .img--wrapper video,
.full--size--swiper--slide--contents .img--wrapper img{
    position:absolute;
    top:50%;
    transform: translateY(-50%);
}

@media screen and (max-width:768px) {
    .full--size--swiper--slide--contents .img--wrapper{
        height: calc(100vh - 189px);
    }
}

@media screen and (max-width:640px) {
    .full--size--swiper--slide--contents .img--wrapper{
        height: calc(100vh - 320px);
    }
    .lr--thumb--info .lr--thumb--info--contents > div.desc h2{
        font-size: 1.7rem!important;
        line-height: 3.4rem!important;
    }
    .lr--thumb--info .lr--thumb--info--contents > div.desc p{
        font-size:1.4rem!important;
    }
}



.text--title--wrapper{
    width:100%;
    padding: 80px 96px;
    box-sizing: border-box;
}

.text--title--wrapper > div{
    max-width:765px;
}
.text--title--wrapper.center > div{
    max-width:100%;
}

.text--title--wrapper h2{
    font-weight: 700;
    font-size:52px;
    line-height:76px;
    margin-bottom:24px;
}
.text--title--wrapper h2.center{
    text-align:center;
}

.text--title--wrapper h3{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight:700;
    font-size: 3.6rem;
    line-height: 5.4rem;
    margin-top:15px;
}

.text--title--wrapper p{
    font-size:16px;
    line-height:24px;
}


.text--title--wrapper.black{
    background:#000;
}
.text--title--wrapper.black p,
.text--title--wrapper.black h2{
    color:#fff;
}


.swp--tb2,
.swp--tb{
    font-size:16px;
    line-height:24px;
}



.lr--thumb--info{
    width:100%;
    display: flex;
    align-items:center;
    justify-content: center;
    padding: 78px 10%;
    box-sizing: border-box;
    margin-top:120px;
}



.lr--thumb--info .lr--thumb--info--contents{
    width:100%;
    display: flex;
    align-items:center;
    justify-content: center;
}

.lr--thumb--info.reverse .lr--thumb--info--contents{
    flex-direction: row-reverse;
}

.lr--thumb--info .lr--thumb--info--contents > div{
    width:50%;
}

.lr--thumb--info .lr--thumb--info--contents > div.thumb img{
    width:100%;
    max-width:100%;
}
.lr--thumb--info .lr--thumb--info--contents > div.desc{
    padding:54px;
    box-sizing: border-box;
}
.lr--thumb--info .lr--thumb--info--contents > div.desc h2{
    font-size: 3.6rem;
    line-height: 5.4rem;
    font-weight:900;
    margin-bottom:16px;
    justify-content: flex-start;
    text-align: left;
}
.lr--thumb--info .lr--thumb--info--contents > div.desc p{
    font-size: 1.6rem;
    line-height: 2.4rem;
}
.lr--thumb--info .lr--thumb--info--contents > div.desc ul{
    margin-top:25px;
}
.lr--thumb--info .lr--thumb--info--contents > div.desc ul li{
    font-size: 1.4rem;
    line-height: 2.4rem;
}

.lr--thumb--info .lr--thumb--info--contents > div.desc .sm--title{
    font-size:12px;
    margin-top:25px;
}

.lr--thumb--info .lr--thumb--info--contents > div.desc a{
    display: inline-flex;
    font-size:16px;
    color:#fff;
    background:#000;
    padding:1em 2em;
    margin-top:52px;
}
@media screen and (max-width:1024px){
    .title--service--menu .title > h2{
        font-size: 3.4rem;
        line-height: 4.8rem;
    }
    .text--title--wrapper{
        padding:55px 25px 35px;
        margin-top:35px;
    }
    .text--title--wrapper h2{
        font-size:32px;
        margin-bottom:0px;
    }
    .lr--thumb--info {
        padding: 35px 25px;
    }


    #canvas--wrapper .text--anim{
        font-size:35px!important;
    }
}

@media screen and (max-width:850px){

    .lr--thumb--info .lr--thumb--info--contents{
        flex-direction:column;
    }
    .lr--thumb--info .lr--thumb--info--contents > div{
        width:100%;
    }

    .lr--thumb--info.reverse .lr--thumb--info--contents{
        flex-direction:column;
    }

    /*#canvas--wrapper{
        height:1000px!important;
    }
    .canvas--wrap{
        height:30vh!important;
    }*/
}

@media screen and (max-width:640px){
    .title--service--menu .title > h2 {
        font-size: 2.4rem;
        line-height: 3.8rem;
        padding:0 25px;
    }

    #canvas--wrapper .text--anim{
        font-size:24px!important;
        padding-left:25px!important;
    }
    .lr--thumb--info .lr--thumb--info--contents > div.desc{
        padding:25px 0px;
    }
}

.normal--banner{
    width:100%;
    overflow: hidden;
}
.normal--banner img{
    width:100%;
    max-width:100%;
}


.caution--text--wrapper{
    padding: 45px 10%;
}
.caution--text--wrapper p{
    font-size: 1.2rem;
    line-height: 2rem;
}



/** 패럴렉스 켄버스  **/
#canvas--wrapper{
    box-sizing: border-box;
    height: 200vh;
    position: relative;
}
#canvas--wrapper .text--anim{
    font-size:52px;
    font-weight:900;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100vh;
    z-index: 9;
    display:flex;
    align-items: center;
    justify-content: flex-start;
    padding-left:96px;
    opacity: 1;
    box-sizing: border-box;
}

.canvas--wrap #cover--bg{
    background:#fff;
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    z-index: 9;
}

.canvas--wrap{
    position:sticky;
    top:0px;
    height:100vh;
    overflow: hidden;
}
#hero-lightpass{
    height:100%;
    width:100%;
}


/*****************************
 *2023
 */
.mt--0{margin-top:0px!important;}
.mt--50{margin-top:50px!important;}
.mb--0{margin-bottom:0px!important;}
.ml--0{margin-left:0px!important;}
.mr--0{margin-right:0px!important;}

.pt--0{padding-top:0px!important;}
.pb--0{padding-bottom:0px!important;}
.pl--0{padding-left:0px!important;}
.pr--0{padding-right:0px!important;}


.main--banner--wrap{
    width:100%;
}
.main--banner--wrap img{
    width:100%;
    max-width:100%;
}


.title--service--menu.ty2 .title{
    padding: 78px 10%;
    box-sizing: border-box;
}
.title--service--menu.ty2 .title > h2{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.title--service--menu.ty2 .title > h3{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight:700;
    font-size: 3.6rem;
    line-height: 5.4rem;
    margin-top:15px;
}

.title--service--menu.ty2 .title > p{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-top:15px;
}

.btn--wrappers{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
}
