@charset "UTF-8";

.film_roll_wrapper {
    display: block;
    text-align: center;
    float: none;
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: auto;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    z-index: 0;
}

.film_roll_shuttle {
    text-align: left;
    float: none;
    position: relative;
    top: 0;
    left: 0;
    right: auto;
    bottom: auto;
    margin: 0 !important;
    padding: 0 !important;
    z-index: auto;
}

.film_roll_child {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.film_roll_child.active {
}

.film_roll_pager {
    position: absolute;
    text-align: center;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 920px;
    z-index: 100;
}

/* .film_roll_wrapper img {
    opacity: 0.6;
}

.film_roll_wrapper .active img {
       opacity: 1;

} */
/*
.path1 {
    clip-path: polygon(0% 2%, 98% 0%, 95% 98%, 5% 95%);
}
.bordersT1{
    display: block;
    background: #fff;
    height: 2px;
    width: 100%;
    top: 25px;
    left: 50%;
    position: absolute;
    transform: translate(-50%, 0) rotate(-1deg);
}
.bordersR1{
    display: block;
    background: #fff;
    height: 100%;
    width: 2px;
    top: 50%;
    right: 60px;
    position: absolute;
    transform: translate(0, -50%) rotate(-1deg);
}
.bordersB1{
    display: block;
    background: #fff;
    height: 2px;
    width: 100%;
    bottom: 50px;
    left: 50%;
    position: absolute;
    transform: translate(-50%, 0) rotate(2deg);
}
.bordersL1{
    display: block;
    background: #fff;
    height: 100%;
    width: 2px;
    top: 50%;
    left: 0;
    position: absolute;
    transform: translate(40px, -50%) rotate(-2deg);
}
.path2 {
    clip-path: polygon(0% 5%, 98% 2%, 90% 95%, 5% 100%);
}
.path3 {
    clip-path: polygon(1% 0%, 95% 5%, 100% 100%, 5% 96%);
}
.path4 {
    clip-path: polygon(0% 3%, 95% 5%, 96% 95%, 5% 100%);
}
.path5 {
    clip-path: polygon(0% 2%, 95% 0%, 90% 95%, 5% 95%);
}
*/
/*
.film_roll_pager a {
	cursor: pointer;
	display: inline-block;
	*display: inline;
    *zoom: 1;
	width: 16px;
	height: 16px;
	margin: 0 2px;
	background: url(./dotnav_rollover.png) no-repeat 50% 50%;
 }

.film_roll_pager a:hover { background-color: transparent; background-image: url(dotnav.png);}
.film_roll_pager a.active { cursor: auto; background-image: url(dotnav_active.png);}

.film_roll_pager span {
	display: none;
 }
*/

.film_roll_pager a,
a.film_roll_prev,
a.film_roll_next {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.film_roll_pager a::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    transition: 0.3s ease;
}
.film_roll_pager a:hover::before{
    opacity: 0;
}
.film_roll_pager a.active::before{
    opacity: 0;
}