@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=42dot+Sans:wght@300..800&family=DM+Serif+Text:ital@0;1&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nanum+Gothic&family=Nanum+Myeongjo&family=Noto+Sans+KR:wght@100..900&family=Noto+Serif+KR:wght@200..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


#indexVisualSwiper {
    position:relative; width:100%; height:100%;
    background-size: cover;
    background-attachment: fixed;
    background-position:center center;
    overflow: hidden;
}


#fullVisual{ width: 100%; height: 100vh; }

#fullVisual .swiper-slide { position:relative; width:100%; height:100%;  }
#fullVisual .bgimg {
    position:absolute; width:100%; height:100%; z-index:1; 
    filter: brightness(100%);
    background: url('') no-repeat center / cover;
}
#fullVisual .fv1 .bgimg { background-image: url(./img/visual4.jpg); }
#fullVisual .fv2 .bgimg { background-image: url(./img/visual5.jpg);/* filter: brightness(50%); */}

#fullVisual .anim { position: absolute;  z-index: 2;}


#indexVisualSwiper .c_bi { position: absolute; bottom: 2%; right: 2%; z-index: 3;}
#indexVisualSwiper .c_bi img {}

#fullVisual .fv1 .anim { 
    top: 50%; left: 60%; 
    transform: translate(-50%, -50%);  
}



#fullVisual .fv2 .anim {
    width: 170px; top:31%; left: 50%; transform: translate(-50%, -50%);
}
#fullVisual .fv2 .anim div { position: relative; display: block;  }
#fullVisual .fv2 .anim .resize-img1 { padding-bottom: 20px}
#fullVisual .fv2 .anim .resize-img1 img { width:100% }

#fullVisual .fv2 .anim .t1 {}
#fullVisual .fv2 .anim .t2 { }
#fullVisual .fv2 .anim .t3 { display: block; text-align: center; padding: 0px 0 20px; }
#fullVisual .fv2 .anim .t3 img { width:10% }
#fullVisual .fv2 .anim .t4 { }


/*오리발*/
.fvOribal {
    position:absolute; left:10px; bottom:10px; color:#fff; text-shadow: 2px 2px 4px #000;
    z-index: 5; opacity: 0.8;
}







@media (max-height: 900px ) {
    #fullVisual .fv2 .anim { width: 150px; top: 33%; }
    #fullVisual .fv2 .anim .resize-img1 { padding-bottom: 15px}
    #fullVisual .fv2 .anim .t3 { padding: 0px 0 15px;}
}

@media (max-height: 700px ) {
    #fullVisual .fv2 .anim { width: 120px; top: 33%; }
    #fullVisual .fv2 .anim .resize-img1 { padding-bottom: 15px}
    #fullVisual .fv2 .anim .t3 { padding: 0px 0 15px;}
}