/*banner*/

.hero .banner{
    left: 0%;
    font-size:0px;
    height:100%;
    transition: left 0s;
}


.banner.idx-sl-banner{
}
.banner .item {
    display: inline-block;
    height: 500px;
    background-position: center center;
    background-repeat: no-repeat;
    transition: background-image 0s;
    background-size: cover;
}




.hero .banner-sw{
    position:absolute;
    bottom: calc(10% - 20px);
    width: 100%;
}

.hero .banner-sw.swhd{
    display:none;
}

@media only screen and (max-width : 768px){
    .banner .item{
        background-size: cover;
        /*max-height: 409.6px;*/
    }
    
}


@media only screen and (max-width : 480px){
    .banner .item{
        max-height: 288px;
    }
}


@media only screen and (max-width : 320px){
    .banner .item{
        max-height: 240px;
    }
}