@import url("https://fonts.googleapis.com/css?family=Exo+2:100,200,300,regular,500,600,700,800,900,100italic,200italic,300italic,italic,500italic,600italic,700italic,800italic,900italic");
@import url("https://fonts.googleapis.com/css?family=Montserrat:100,200,300,regular,500,600,700,800,900,100italic,200italic,300italic,italic,500italic,600italic,700italic,800italic,900italic");

.btn_alink{position: relative; width: 6rem; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; font-size: 2.5rem; line-height: 1; color: #fff; font-weight: lighter; background-color: var(--point); border-radius: 50%; margin: 0 auto;}

p{margin-bottom: 0;}
ul{margin-bottom: 0;}
a:hover{text-decoration: initial;}

html.main .swiper-button-next, 
html.main .swiper-button-prev{width: auto; height: auto; color: #fff; background-image: none; background-color: initial; transition: color ease 0.5s;}
html.main .swiper-button-next:hover, 
html.main .swiper-button-prev:hover{color: var(--point2);}

#mVisual{width:100%; font-size:0; line-height:0; padding: 0; margin: 0; position: relative; overflow:hidden;}
#mVisual .mySwiper .swiper-slide{width: 100%;}

#mVisual .mySwiper .swiper-slide img{width:100%; max-width:none; max-height: 100vh;height:72rem;object-fit: cover;}
.mVisual_textArea{position: absolute; left:50%; top: 0; max-width: 128rem; width:100%; height: 100%; display: flex; flex-wrap: wrap; flex-direction: column; align-items: center; justify-content: center; text-align: left; padding:0 2rem; transform: translateX(-50%); z-index:6;}  
.mVisual_textArea_inner{width: 100%; position: relative;}

.mVisual_text_eq p.title{font-size: 4.2rem; line-height: 1.3; color: rgba(255,255,255,0.9); font-weight: 700; margin-bottom: 2rem;}
.mVisual_text_eq p.title span{color:#00fced}
.mVisual_text_eq p.text{font-size: 3.2rem; line-height: 1.5; color: rgba(255,255,255,0.8);}
.mVisual_text_eq p.text span{font-weight:700;}
.mVisual_text_eq a {position: relative; text-align: center; display: inline-flex; align-items: center; line-height: 1.3; padding-bottom: 0.5rem; justify-content: center; top: 0; font-size: 1.9rem; font-weight: 500; color: rgba(255,255,255,0.8); margin: 0 auto 0; border-bottom: 1px solid rgba(255,255,255,0.8);}

.mVisual_text_eq{width:100%; position: absolute; left:0; top:0; opacity: 0; text-align: center; }
.mVisual_text_eq .ii{top: 5rem; position: relative; text-align: right; word-break:keep-all; word-wrap:break-word; opacity: 0; transition: all ease 1s;}
.mVisual_text_eq .i01{-webkit-transition-delay: .4s; transition-delay: .4s;}
.mVisual_text_eq .i02{-webkit-transition-delay: .45s; transition-delay: .45s;}
.mVisual_text_eq .i03{-webkit-transition-delay: .5s; transition-delay: .5s;}
.mVisual_text_eq .i04{-webkit-transition-delay: .55s; transition-delay: .55s;}
.mVisual_text_eq .i05{-webkit-transition-delay: .6s; transition-delay: .6s;}
.mVisual_text_eq .i06{-webkit-transition-delay: .65s; transition-delay: .65s;}
.mVisual_text_eq .i07{-webkit-transition-delay: .7s; transition-delay: .7s;}
.mVisual_text_eq .i08{-webkit-transition-delay: .8s; transition-delay: .8s;}
.mVisual_text_eq .i09{-webkit-transition-delay: .9s; transition-delay: .9s;}

.mVisual_text_eq.active{position: static; top: 0; opacity: 1;}
.mVisual_text_eq.active .ii{top: 0; opacity:1;}

/* #mVisual .mVisual_control{position: relative; width: 100%; display: flex; gap:  2rem 6rem; align-items: center; justify-content: flex-start; margin: 13rem 0 0; display: none;} */
/* #mVisual .mVisual_control.active{display: flex;} */
#mVisual .swiper-pagination{position: absolute; bottom: 5rem; display: none; gap: 1rem; justify-content: center;
  /* swiper 기본 css 없애기 */ top: auto; left: 0; right: auto; 
}
#mVisual .swiper-pagination .swiper-pagination-bullet{position: relative; width: 2rem; height: 2rem; background-color: #fff; opacity: 0.6;
  /* swiper 기본 css 없애기 */ padding: 0; margin: 0; border-radius: 50%; 
}
#mVisual .swiper-pagination .swiper-pagination-bullet span{display: block;}
/* #mVisual .swiper-pagination .swiper-pagination-bullet span.line{height: 2rem; border-bottom: 2px solid #fff;} */
#mVisual .swiper-pagination .swiper-pagination-bullet-active{opacity: 1;}

/* #mVisual .swiper-button-next, 
#mVisual .swiper-button-prev{width: 3.6rem; height: 7rem; color: transparent; background-image: none; background-color: initial; background-size: cover; transition: color ease 0.5s;}
#mVisual .swiper-button-next{background-image: url('/theme/prix/img/main/mVisual_arrow_next.png'); right: 5vw;}
#mVisual .swiper-button-prev{background-image: url('/theme/prix/img/main/mVisual_arrow_prev.png'); left: 5vw;} */

#mVisual .thumbs_area{position:absolute;left:50%;transform:translateX(-50%);z-index:3;width:100%;max-width:128rem;animation: fadeup 1s;animation-delay:1.3s;animation-fill-mode: forwards;}
#mVisual .swiper-thumbs{margin-right:0;max-width: 97.3rem;}
/* #mVisual .swiper-thumbs .swiper-wrapper{max-width: 97.3rem;overflow:hidden;} */
#mVisual .swiper-thumbs .swiper-slide{border:0.2rem solid rgba(255,255,255,0.75);position:relative;padding-bottom:22.66%;}
#mVisual .swiper-thumbs .swiper-slide img{width:100%;height:100%;position:absolute;left:0;top:0;object-fit:cover}
#mVisual .swiper-thumbs .sw_btn{margin-top:-1.2rem;}
#mVisual .swiper-thumbs .sw_btn::after{width:1.5rem;height:2.4rem;font-size:0;background-position:center;background-repeat: no-repeat;background-size:contain;}
#mVisual .swiper-thumbs .swiper-button-prev::after{background-image:url("/theme/prix/img/sw_prev.png");}
#mVisual .swiper-thumbs .swiper-button-next::after{background-image: url("/theme/prix/img/sw_next.png");}
#mVisual .swiper-thumbs .swiper-slide-thumb-active{border:0.2rem solid #ffb800}
@keyframes fadeup {
    from{
        bottom:0;
        opacity:0;
    }
    to{
        bottom:4rem;
        opacity:1;
    }
}

@media only screen and (max-width : 1600px){

}
@media only screen and (max-width : 1440px){
  
}
@media only screen and (max-width : 1320px){
}
@media only screen and (max-width : 1280px){
    #mVisual .swiper-thumbs{margin-right:auto;}

    .mBusiness_links li .textArea .kr_title{margin: 2rem auto;}
    .mBusiness_links li .textArea .btn_alink{margin: 2rem auto 0;}

}
@media only screen and (max-width : 1024px){

    #mVisual .swiper-pagination{display: flex;}

    .mBusiness_links li{flex: 1 1 100%; aspect-ratio: initial; height: 38.2rem;}
    .mBusiness_links li .textArea .en_title{visibility: inherit; opacity: initial;} 
    .mBusiness_links li .textArea .btn_alink{visibility: inherit; opacity: initial;} 

    #mPerformance .swiper-slide{width: calc((100% - 80px)/ 1.5);}

    #mPartners .swiper{padding: 0 30px;}
    #mPartners .swiper-slide{margin-right: 2rem;}



}
@media only screen and (max-width : 840px){
    .mVisual_text_eq p.text{font-size:3.5rem;}
    .mVisual_text_eq p.title{font-size:4.5rem;}
    #mVisual .thumbs_area{padding:0 8%;max-width:49rem;bottom:3rem;}
    #mVisual .swiper-thumbs .swiper-slide{padding-bottom:48.92%;}
    /* #mVisual .mySwiper .swiper-slide img{height:111.7rem;} */
    #mVisual .swiper-thumbs .sw_btn::after{width:2rem;height:3.2rem;}
}

@media only screen and (max-width : 640px){

    .mProduct_tabWrapNav{gap: 1.5rem; }
    .mProduct_tabWrapNav li{min-width: initial; width: calc((100% - 6rem)/5);}
    .mProduct_tabWrapNav li .icon{width: 100%; height: auto; aspect-ratio: 1/1;}

    .mProduct_tabWrapContents .swiper-slide{width: calc((100% - 40px)/2);}

    #mPerformance .swiper-slide{width: calc((100% - 40px)/ 1.25);}

    #mDirect .flexArea .box{width: 100%;}
    #mDirect .flexArea .direct01 .direct01_link{right: 50%; transform: translateX(50%);}

    #mPartners .swiper-button-prev,
    #mPartners .swiper-button-next{display: none;}


}

@media only screen and (max-width : 480px){
    .mVisual_text_eq p.text{font-size:2.5rem;}
    .mVisual_text_eq p.title{font-size:3.5rem;}
    .mProduct_tabWrapNav li p{font-size: 1.6rem; line-height: 2rem;}
 
}
@media only screen and (max-width : 400px){
    .mVisual_text_eq p.title{font-size: 4rem; line-height: 5rem;}

    .mProduct_tabWrapNav li .icon{max-width: 6.5rem;}
    .mProduct_tabWrapNav li p{font-size: 1.6rem;}

    .mProduct_tabWrapContents .swiper-slide{width: calc((100% - 40px)/1.5);}

    #mPerformance .swiper-slide{width: calc(100% - 20px);}
 
}




