@charset "utf-8";

.wrap-visual {position: relative; }
.wrap-visual .item {color:#fff; position: absolute; top:55.7%; left:10rem}
.wrap-visual .swiper-slide .icon {position: relative;}
.wrap-visual .swiper-slide .icon::after {content:''; width:100%; height:100%; position: absolute; top:0; left:0; background:rgba(0,0,0,0);}
.wrap-visual .swiper-slide img {max-height:96rem; position: relative; left:50%; display: block; max-width:none; height:100%; transform: translate(-50%, 0);}
.wrap-visual .text_0 {font-size: 3rem; font-family: 'paper'; font-weight: 500; line-height: 7rem; text-shadow: 0px 0px 1rem rgba(0,0,0,0.3);}
.wrap-visual .text_1 {font-size: 6rem; line-height: 7rem; font-family: 'paper'; font-weight: 600; text-shadow: 0px 0px 1rem rgba(0,0,0,0.3);}
.wrap-visual .text_2 {font-size: 1.8rem; line-height: 3rem; font-family: 'paper'; font-weight: 400; margin-top: 2.5rem;}
.wrap-visual .detail-view { display: inline-flex; font-size: 1.6rem; align-items: center; padding:0 2rem; position: relative; border:1px solid rgba(255,255,255,1); color:#fff; border-radius:0.7rem; height:5.3rem; color:#fff; min-width:17.3rem; background:url('../images/visual-more-arrw.png') no-repeat right 2.5rem center; margin-top: 2rem!important; transition: border .3s;}
.wrap-visual .detail-view:hover {background:#fff url('../images/visual-more-arrw-on.png') no-repeat right 2.5rem center; color:#000;}

/* control */
.wrap-visual .control {position: absolute; bottom:7rem; left:82rem; z-index: 10; display: flex; align-items: center;}
.wrap-visual .prevnext {position: relative; display: flex; align-items: center; margin-left: 3rem;}
.wrap-visual .prevnext button {text-indent: -9999rem; width:3.2rem; height:3.2rem; border:1px solid #fff; border-radius:50%;}
.wrap-visual .prevnext .prev {background:url('../images/visual-prev.png') no-repeat center; display: inline-block; transition:.3s;}
.wrap-visual .prevnext .next {background:url('../images/visual-next.png') no-repeat center; display: inline-block; transition:.3s; margin-left: 0.7rem;}
.wrap-visual .prevnext .prev:hover,
.wrap-visual .prevnext .next:hover {opacity:1; } 
.wrap-visual .prevnext .play {}
.wrap-visual .prevnext .stop {}
.wrap-visual .numbering {display: flex; align-items: center;}
.wrap-visual .numbering span {display: inline-block; font-size: 1.7rem; font-family:'SUITE Medium'; color:#fff;}
.wrap-visual .numbering .total {color:#DADADA; opacity:0.7;}
.wrap-visual .paging {width:10.5rem; height:1px; display: flex; margin:0 1rem;}
.wrap-visual .swiper-pagination-bullet {background:rgba(255,255,255,0.8); width:100%; height:1px; opacity:1;}
.wrap-visual .swiper-pagination-bullet-active {background:#01498E;}
.wrap-visual .pannel .stop,
.wrap-visual .pannel .play{ width:3.2rem; height:3.2rem; display: inline-block; border-radius:50%; border:1px solid #fff; display: none;}
.wrap-visual .pannel .stop {background:url('../images/stop.png') no-repeat center;}
.wrap-visual .pannel .play {background:url('../images/play.png') no-repeat center;}
@media screen and (min-width:2600px) {
    .wrap-visual .control {bottom:30% !important;}
}
@media screen and (min-width:1921px) {
    .wrap-visual {height:47.86vw;}
    .wrap-visual .slider {height:100%;}
    /* .wrap-visual .item {max-width:1720px; width:100%; margin:0 auto; left:50%; transform:translateX(-50%);} */
    .wrap-visual .icon {height:100%;}
    .wrap-visual .swiper-slide img {max-height:unset; width:100%;}
    /* .wrap-visual .control {max-width:1720px; width:100%; margin:0 auto; left:50%; transform:translateX(-50%);} */
}

@media screen and (max-width:1800px) {
    .wrap-visual .item {left:2rem;}
    .wrap-visual .control {left:2rem;}
}
@media screen and (max-width:1400px) {
    .wrap-visual .item {top:23.7%;}
    .wrap-visual .text_1 {font-size: 5rem; line-height: 5rem;}
}
@media screen and (max-width:1200px) {
    .wrap-visual .text_0 {font-size: 2.6rem; line-height: 2;}
    .wrap-visual .item {top:33.7%;}
    .wrap-visual .swiper-slide img {max-height:79rem;}
    .wrap-visual .detail-view {margin-top: 4.7rem;}
    .wrap-visual .control {bottom:20.8rem;}
}
@media screen and (max-width:768px) {
    .wrap-visual .swiper-pagination-bullet {border-radius:0;}
    .wrap-visual .item {left:2rem; top:23.7%}
    .wrap-visual .text_0 {font-size: 2.2rem;}
    .wrap-visual .text_1 {font-size: 4rem;}
    .wrap-visual .text_2 {font-size: 1.6rem; padding-right:4rem;}
    .wrap-visual .text_2 br {display: none;}
    .wrap-visual .detail-view {margin-top: 2.3rem; min-width:15rem;}
    .wrap-visual .control {bottom:7rem; left: 2rem;}

    .wrap-visual .swiper-slide img {max-height: 65rem;}
}