#mainslider{transition: .3s all ease;}

#mainslider .roominfo{height:19.5rem}
#mainslider .roomtitle, #mainslider .roominfo h3{color:#000;text-shadow:none;}

.slider{position:relative;width:100%;overflow:hidden;}
.slides{height:100%;overflow:hidden;-webkit-backface-visibility:hidden;-webkit-transform-style:preserve-3d;-webkit-transition:all 1000ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-moz-transition:all 1000ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-ms-transition:all 1000ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-o-transition:all 1000ms cubic-bezier(0.165, 0.840, 0.440, 1.000);transition:all 1000ms cubic-bezier(0.165, 0.840, 0.440, 1.000);margin:0}
.slide{height:100%;float:left;clear:none;width: 100%;}

.slider-arrow{position:absolute;display:block;margin-top:-2.2rem;width:1.2rem;height:1.2rem;padding:1.6rem;border-radius:0;background:#fff;transition: .3s all ease;}
.slider-arrow img{width:1.2rem;float: left;padding: 0!important;transition: .3s all ease;}
.slider-arrow:hover{background: #000;}
.slider-arrow:hover img{filter: invert(1);}
.slider-arrow--right{top:50%;right:-5rem;}
.slider-arrow--left{top:50%;left:-5rem;}
.slider:hover .slider-arrow--right{right:3rem;}
.slider:hover .slider-arrow--left{left:3rem;}
.slider-arrow--left img{transform: rotate(180deg)}
.slider-nav{position:absolute;bottom:3.6rem}
.slider-nav__item{width:1.4rem;height:1.4rem;float:left;clear:none;display:block;margin:0 .5rem;border-radius:.3rem;opacity:.75;border:.2rem solid #fff}
.slider-nav__item:hover{background:#fff;}
.slider-nav__item--current{background:#fff;opacity:1}

.stripe{background-image: url(../img/svg/stripe.svg);height: 4.6rem;width: 30rem;background-size: 100%;background-repeat: no-repeat;line-height: 4.6rem;text-align: center;font-weight: 600;margin: 1rem calc(50% - 15rem) 2rem;}

li.slide{list-style: none;margin:0}
li.slide .box{height:55rem;background-size:cover;color:#fff;background-position: center;position: relative;}
.room li.slide .box{height:60rem;}


.banbtn{display: inline-block;position: relative;cursor: pointer;text-transform: uppercase;font-size: 1.5rem;border: 0.1rem solid #000;background:#000;color:#fff;font-weight: 400;transition: .3s all ease;line-height: 4.4rem;padding: 0 1.5rem;letter-spacing:.1rem;margin-top: 2rem;}
.banbtn:hover{background:#fff;color:#000}

@media (max-width: 860px) {
.bantext {padding-top: 10rem}
}
@media (max-width: 830px) {
.room li.slide .box{height:55rem;}
}

@media (max-width: 700px) {
.slider-arrows{display:none}
.bantext {padding-top: 9rem}
.bantext h2{font-size:2.9rem}
}

@media (max-width: 500px) {
.bantext {width: 90%;margin:0 5%;padding-top: 7rem;text-align: center;}
li.slide .box{height:45rem;}
.room li.slide .box{height:45rem;}
}
@media (max-width: 420px) {
.bantext h2{font-size:2.6rem}
}

@media (max-width: 380px) {
.bantext {width: 96%;margin:0 2%}
}