@charset "utf-8";

.wrap-visual {position: relative;}
.wrap-visual .item {color:#fff; position: absolute; top:33.7%; left:100px}
.wrap-visual .swiper-slide img {max-height:960px; position: relative; left:50%; display: block; max-width:none; height:100%; transform: translate(-50%, 0); width: 100%; object-fit: cover;}
.wrap-visual .icon {position: relative;}
.wrap-visual .icon::after {content:''; width:100%; height: 100%; background:rgba(0,0,0,0.4); position: absolute; top:0; left:0;}
.wrap-visual .text_1 {font-size: 50px; line-height: 65px; font-family: 'SUITE Bold'; text-shadow: 2px 2px 5px rgba(0,0,0,0.3);}
.wrap-visual .text_2 {font-size: 18px; line-height: 30px; font-family: 'HG Regular'; margin-top: 25px;}
.wrap-visual .detail-view { display: inline-flex; font-size: 14px; align-items: center; padding:0 20px; position: relative; border:1px solid rgba(255,255,255,0.4); color:#fff; border-radius:50px; height:50px; color:#fff; min-width:170px; background:url('../images/visual-more-arrw.png') no-repeat right 20px center; margin-top: 60px; transition: border .3s;}
.wrap-visual .detail-view:hover {border:1px solid rgba(255,255,255,1)}
/* control */
.wrap-visual .control {position: absolute; bottom:115px; left:100px; z-index: 10;}
.wrap-visual .prevnext {position: relative; display: flex; align-items: center;}
.wrap-visual .prevnext button {text-indent: -9999px;}
.wrap-visual .prevnext .prev {width:24px; height:30px; background:url('../images/visual-prev.png') no-repeat center; display: inline-block; margin-right: 20px; opacity:0.5; transition:.3s;}
.wrap-visual .prevnext .next {width:24px; height:30px; background:url('../images/visual-next.png') no-repeat center; display: inline-block; margin-left: 20px; opacity:0.5; transition:.3s;}
.wrap-visual .prevnext .prev:hover,
.wrap-visual .prevnext .next:hover {opacity:1; } 
.wrap-visual .prevnext .play {}
.wrap-visual .prevnext .stop {}
.wrap-visual .numbering span {display: inline-block; font-size: 15px; font-family:'Mont Regular'; color:#fff;}
.wrap-visual .paging {width:325px; height:2px; display: flex; margin-top: 30px;}
.wrap-visual .swiper-pagination-bullet {background:rgba(255,255,255,0.3); width:100%; height:2px; opacity:1; border-radius:0;}
.wrap-visual .swiper-pagination-bullet-active {background:rgba(255,255,255,1);}
@media screen and (min-width:2600px) {
    .wrap-visual .control {bottom:25% !important}
}
@media screen and (min-width:1921px) {
    .wrap-visual {height:47.86vw;}
    .wrap-visual .slider {height:100%;}
    .wrap-visual .icon {height:100%;}
    .wrap-visual .swiper-slide img {max-height:unset; width:100%;}
    /* .wrap-visual .item {max-width:1720px; margin:0 auto; width:100%; left:50%; transform: translateX(-50%);} */
    .wrap-visual .control {bottom:20%}
}

@media screen and (max-width:1800px) {
    .wrap-visual .item {left:40px;}
    .wrap-visual .control {left:40px;}
}
@media screen and (max-width:1400px) {
    .wrap-visual .item {top:23.7%;}
    .wrap-visual .text_1 {font-size: 40px; line-height: 50px;}
}
@media screen and (max-width:1200px) {
    .wrap-visual .swiper-slide img {max-height:790px;}
    .wrap-visual .detail-view {margin-top: 55px;}
    .wrap-visual .control {bottom:122px;}
}
@media screen and (max-width:768px) {
    .wrap-visual .item {left:20px;}
    .wrap-visual .text_2 {font-size: 16px; padding-right:40px;}
    .wrap-visual .text_2 br {display: none;}
    .wrap-visual .detail-view {margin-top: 38px;}
    .wrap-visual .control {bottom:50px;}
    .wrap-visual .paging {width:200px; margin-top: 10px;}

    .wrap-visual .swiper-slide img {max-height: 650px;}
}