.relative{
    position: relative;
}
.arrow{
    background-repeat: no-repeat; background-position: center center; background-size: 100% 100%;
    height: 18px; width: 18px; display: inline-block;
}
.arrow.dis{
    opacity: 0.5;
}
.arrow.arrow-left{
    background-image: url("/img/system/arrow-left.svg");
}
.arrow.arrow-left.black{
    background-image: url("/img/system/arrow-left-black.svg");
}
.arrow:hover.arrow-left{
    background-image: url("/img/system/arrow-left-orange.svg");
}

.arrow.arrow-right{
    background-image: url("/img/system/arrow-right2.svg");
}
.arrow.arrow-right.black{
    background-image: url("/img/system/arrow-right2-black.svg");
}
.arrow:hover.arrow-right{
    background-image: url("/img/system/arrow-right2-orange.svg");
}
.forMobi{
    display: none;
}
.arrows{
    position: absolute; z-index: 1;
}
.arrows{
    display: none; padding-right: 10px;
    /*margin-right: 20px;*/
    /*position: absolute;*/
    top: 30px; right: 0;
}
.arrows{
    padding-right: 10px;
}
.arrows a:first-child{
    margin-right: 20px;
}


@media only screen and (max-width: 640px){
    .arrows{
        display: block;
    }

    .ulf.ulf-arrows li:first-child{
        display: block;
    }

    .ulf.ulf-arrows > li.hidden{
        display: none;
    }
    .ulf.ulf-arrows > li.force_show{
        display: block !important;
    }

    .ulf.ulf-arrows > li{
        display: none;
    }
    /*.ulf.seo6 > li{*/
    /*display: none;*/
    /*width: 100%;*/
    /*}*/
    .ulf.ulf-arrows > li:first-child,
    .arrows{
        display: block;
    }
    .ulf.ulf-arrows > li{
        width: 100%;
    }
    .ulf.ulf-arrows > li.hidden{
        display: none;
    }
    .ulf.ulf-arrows > li.force_show{
        display: block !important;
    }
    .forMobi{
        display: block;
    }
}