/* jssor slider bullet navigator skin 05 css */
/*
.jssorb05 div           (normal)
.jssorb05 div:hover     (normal mouseover)
.jssorb05 .av           (active)
.jssorb05 .av:hover     (active mouseover)
.jssorb05 .dn           (mousedown)
*/
.jssorb05
{
	position: absolute;
	bottom:16px;right:16px;
}
.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av
{
	position: absolute; /* size of bullet elment */
	width: 16px;
	height: 16px;
	background: url( 'img/b05.png' ) no-repeat;
	overflow: hidden;
	cursor: pointer;
}
.jssorb05 div
{
	background-position: -7px -7px;
}
.jssorb05 div:hover, .jssorb05 .av:hover
{
	background-position: -37px -7px;
}
.jssorb05 .av
{
	background-position: -67px -7px;
}
.jssorb05 .dn, .jssorb05 .dn:hover
{
	background-position: -97px -7px;
}

/* jssor slider arrow navigator skin 22 css */
/*
.jssora22l                  (normal)
.jssora22r                  (normal)
.jssora22l:hover            (normal mouseover)
.jssora22r:hover            (normal mouseover)
.jssora22l.jssora22ldn      (mousedown)
.jssora22r.jssora22rdn      (mousedown)
.jssora22l.jssora22lds      (disabled)
.jssora22r.jssora22rds      (disabled)
*/
.jssora22l, .jssora22r
{
	display: block;
	position: absolute; /* size of arrow element */
	width: 40px;
	height: 58px;
	cursor: pointer;
	background: url( 'img/a22.png' ) center center no-repeat;
	overflow: hidden;
}
.jssora22l
{
	background-position: -10px -31px;
}
.jssora22r
{
	background-position: -70px -31px;
}
.jssora22l:hover
{
	background-position: -130px -31px;
}
.jssora22r:hover
{
	background-position: -190px -31px;
}
 .
.jssora22l.jssora22ldn
{
	background-position: -250px -31px;
}
 .
.jssora22r.jssora22rdn
{
	background-position: -310px -31px;
}
 .
.jssora22l.jssora22lds
{
	background-position: -10px -31px;
	opacity: .3;
	pointer-events: none;
}
 .
.jssora22r.jssora22rds
{
	background-position: -70px -31px;
	opacity: .3;
	pointer-events: none;
}
/* jssor slider arrow navigator skin 05 css */
/*
.jssora05l                  (normal)
.jssora05r                  (normal)
.jssora05l:hover            (normal mouseover)
.jssora05r:hover            (normal mouseover)
.jssora05l.jssora05ldn      (mousedown)
.jssora05r.jssora05rdn      (mousedown)
.jssora05l.jssora05lds      (disabled)
.jssora05r.jssora05rds      (disabled)
*/
.jssora05l, .jssora05r
{
	display: block;
	position: absolute; /* size of arrow element */
	width: 40px;
	height: 40px;
	cursor: pointer;
	background: url( 'img/a17.png' ) no-repeat;
	overflow: hidden;
}
.jssora05l
{
	background-position: -10px -40px;
}
.jssora05r
{
	background-position: -70px -40px;
}
.jssora05l:hover
{
	background-position: -130px -40px;
}
.jssora05r:hover
{
	background-position: -190px -40px;
}
 .
.jssora05l.jssora05ldn
{
	background-position: -250px -40px;
}
 .
.jssora05r.jssora05rdn
{
	background-position: -310px -40px;
}
 .
.jssora05l.jssora05lds
{
	background-position: -10px -40px;
	opacity: .3;
	pointer-events: none;
}
 .
.jssora05r.jssora05rds
{
	background-position: -70px -40px;
	opacity: .3;
	pointer-events: none;
}

/* jssor slider bullet navigator skin 03 css */
/*
.jssorb03 div           (normal)
.jssorb03 div:hover     (normal mouseover)
.jssorb03 .av           (active)
.jssorb03 .av:hover     (active mouseover)
.jssorb03 .dn           (mousedown)
*/
.jssorb03
{
	position: absolute; 
	bottom: 4px; right: 6px;
}
.jssorb03 div, .jssorb03 div:hover, .jssorb03 .av
{
	position: absolute; /* size of bullet elment */
	width: 21px;
	height: 21px;
	text-align: center;
	line-height: 21px;
	color: white;
	font-size: 12px;
	background: url( 'img/b03.png' ) no-repeat;
	overflow: hidden;
	cursor: pointer;
}
.jssorb03 div
{
	background-position: -5px -4px;
}
.jssorb03 div:hover, .jssorb03 .av:hover
{
	background-position: -35px -4px;
}
.jssorb03 .av
{
	background-position: -65px -4px;
}
.jssorb03 .dn, .jssorb03 .dn:hover
{
	background-position: -95px -4px;
}

/* jssor slider arrow navigator skin 03 css */
/*
.jssora03l                  (normal)
.jssora03r                  (normal)
.jssora03l:hover            (normal mouseover)
.jssora03r:hover            (normal mouseover)
.jssora03l.jssora03ldn      (mousedown)
.jssora03r.jssora03rdn      (mousedown)
.jssora03l.jssora03ldn      (disabled)
.jssora03r.jssora03rdn      (disabled)
*/
.jssora03l, .jssora03r
{
	display: block;
	position: absolute; /* size of arrow element */
	width: 55px;
	height: 55px;
	cursor: pointer;
	background: url( 'img/a03.png' ) no-repeat;
	overflow: hidden;
}
.jssora03l
{
	background-position: -3px -33px;
}
.jssora03r
{
	background-position: -63px -33px;
}
.jssora03l:hover
{
	background-position: -123px -33px;
}
.jssora03r:hover
{
	background-position: -183px -33px;
}
 .
.jssora03l.jssora03ldn
{
	background-position: -243px -33px;
}
 .
.jssora03r.jssora03rdn
{
	background-position: -303px -33px;
}
 .
.jssora03l.jssora03lds
{
	background-position: -3px -33px;
	opacity: .3;
	pointer-events: none;
}
 .
.jssora03r.jssora03rds
{
	background-position: -63px -33px;
	opacity: .3;
	pointer-events: none;
}

/* jssor slider thumbnail navigator skin 01 css *//*.jssort01 .p            (normal).jssort01 .p:hover      (normal mouseover).jssort01 .p.pav        (active).jssort01 .p.pdn        (mousedown)*/
.jssort01 .p
{
	position: absolute;
	top: 0;
	left: 0;
	width: 72px;
	height: 72px;
}
.jssort01 .t
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
.jssort01 .w
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}
.jssort01 .c
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 68px;
	height: 68px;
	border: #000 2px solid;
	box-sizing: content-box;
	background: url( 'img/t01.png' ) -800px -800px no-repeat;
	_background: none;
}
.jssort01 .pav .c
{
	top: 2px;
	_top: 0px;
	left: 2px;
	_left: 0px;
	width: 68px;
	height: 68px;
	border: #000 0px solid;
	_border: #fff 2px solid;
	background-position: 50% 50%;
}
.jssort01 .p:hover .c
{
	top: 0px;
	left: 0px;
	width: 70px;
	height: 70px;
	border: #fff 1px solid;
	background-position: 50% 50%;
}
.jssort01 .
.p.pdn .c
{
	background-position: 50% 50%;
	width: 68px;
	height: 68px;
	border: #000 2px solid;
}
* html .jssort01 .c, * html .jssort01 .pdn .c, * html .jssort01 .pav .c
{
	/* ie quirks mode adjust */
	width: /**/ 72px;
	height: /**/ 72px;
}

/* jssor slider thumbnail navigator skin css */
.jssorthumbox
{
	position: absolute; /* size of thumbnail navigator container */
}
.jssorthumbox .p
{
	position: absolute;
	top: 0;
	left: 0;
}
.jssorthumbox .t
{
	/* this img */
	filter: alpha(opacity=50);
	opacity: .5;
}
.jssorthumbox .p:hover .t, .jssorthumbox .pav:hover .t, .jssorthumbox .pav .t
{
	filter: alpha(opacity=100);
	opacity: 1;
}
.jssorthumbox .w
{
	overflow: hidden;
	position: absolute;
	vertical-align: middle;
	text-align: center;
	transition: border-color .6s;
	-moz-transition: border-color .6s;
	-webkit-transition: border-color .6s;
	-o-transition: border-color .6s;
	border: #a9a9a9 1px solid;
}
.jssorthumbox .pav .w
{
	border-color: #000000;
}
.jssorthumbox .w:hover
{
	border-color: #000000;
}
.jssorthumbox .p:hover .w
{
	transition: none;
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
}
.jssor_loading
{
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: rgba(0,0,0,0.7);
}
.jssor_loading .jssor_loading_filter
{
	filter: alpha(opacity=70);
	opacity: 0.7;
	position: absolute;
	display: block;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}
.jssor_loading .jssor_loading_filter
{
	position: absolute;
	display: block;
	background: url( 'img/loading.gif' ) no-repeat center center;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}
.jssor_parent
{
    margin:auto;
}
.jssor
{
	position:relative;
	margin: 0 auto;
	top: 0px;
	left: 0px;
	overflow: hidden;
	visibility: hidden;
}
/* 自定 */
.jssor_st
{
	position: absolute;
	width: 100%;
	height: auto;
	z-index: 0;
	background-color: rgba(235,81,0,0.5);
	font-size: 20px;
	color: #ffffff;
	line-height: 30px;
	padding:3px;
}
/* 標題初始位置 */
.jssor_st_1
{
	top: 30px;
	left: -900px;
}
.jssor_st_2
{
	top: -120px;
	left: 0;
}
/* 內容初始位置 */
.jssor_st_content
{
	position: absolute;
	top: 100px;
	left: 600px;
	width: 100%;
	z-index: 0;
	background-color: rgba(235,81,0,0.5);
	font-size: 20px;
	color: #ffffff;
	padding:3px;
	text-align: left;
}
.jssor .icon-play:before
{
    font-size: 60pt;
}
.jssor .icon-play
{
    z-index: 2;
    position: absolute;
    width: 30%;
    height: 20%;
    top: 40%;
    left: 35%;
    background-color: rgba(0,0,0,0.6);
    text-align: center;
    color: #FFFFFF;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 3px;
}
.jssor .icon-play:hover
{
    background-color: rgba(0,0,0,0.9);
    cursor:pointer;
}
.jssor .youtubepay iframe
{
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
}
.jssorthumbox .icon-play:before
{
    font-size: 18pt;
    padding-top:2px;
}
.jssorthumbox .icon-play
{
    width: 60%;
    height: 40%;
    top: 30%;
    left: 20%;
    padding: 0;
    line-height:normal;
    vertical-align: middle;
}

.random_51 .first1
{
    animation-name: first1;
    animation-duration:5s;
    animation-fill-mode:forwards;
}
@keyframes first1{
    0%{
        transform: scale(1.1);
        opacity:0;
   }
    50%
    {
        opacity: 1; 
    }
    100%{
        transform: scale(1);
    }
}