/******************/

.flexslider {
    margin:0; 
    padding:0;
}
.flexslider .slides > li {
    display:none; 
    -webkit-backface-visibility:hidden;
}
.flexslider .slides img {
    width:100%; 
    display:block;
}
.flex-pauseplay span {
    text-transform:capitalize;
}

.slides:after {
    content:""; 
    display:block; 
    clear:both; 
    visibility:hidden; 
    height:0;
}
.no-js .slides > li:first-child {
    display:block;
}

/******************/
/******************/

.flexslider {position:relative;}
.flex-viewport {max-height:2000px;
	-webkit-transition:all 1s ease;
	-moz-transition:all 1s ease;
	-ms-transition:all 1s ease;
	-o-transition:all 1s ease;
	transition:all 1s ease;
}
.loading .flex-viewport {max-height:300px;}
.carousel li {margin-right:5px;}

/******************/
/* Direction Nav **/
.flex-direction-nav {height:0;}

.flex-direction-nav a {
display:block;
width:30px;
height:60px;
background-image:url(/susukino/image/common/left.webp);
	-webkit-background-size:30px 60px;
	-moz-background-size:30px 60px;
	-ms-background-size:30px 60px;
	-o-background-size:30px 60px;
	background-size:30px 60px;
margin:-40px 0 0;
position:absolute;
top:50%;
overflow:hidden;
opacity:0;
cursor:pointer;
color:rgba(255,255,255,0);
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
z-index:4;
}
.flex-direction-nav .flex-prev {left:0px; }
.flex-direction-nav .flex-next {right:0;}
.flex-direction-nav a.flex-prev {background-image: url(/susukino/image/common/left.webp)}
.flex-direction-nav a.flex-next {background-image: url(/susukino/image/common/right.webp);}
.flex-direction-nav a.flex-next {background-position:-60px 0;}
.flexslider:hover .flex-prev {opacity:0.7; left:10px;}
.flexslider:hover .flex-next {opacity:0.7; right:10px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity:1;}
.flex-direction-nav .flex-disabled {opacity:0; cursor:default;}
.flex-direction-nav a:before {font-size:40px; display:inline-block; content:'';}

/******************/
/* Pause/Play *****/
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom:5px; left:10px; opacity:0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before { font-size: 20px; display: inline-block;}
.flex-pauseplay a:hover {opacity:1;}
.flex-pauseplay a.flex-play:before {content:'\f003';}

/* Control Nav */
.flexslider .flex-control-nav  {
    display:none;
}
.flexslider_award .flex-control-nav {
    width:100%; 
    position:absolute; 
    /* bottom:10px;  */
    text-align:center; 
    margin:10px auto 20px; 
    z-index: 2; 
    padding-left: 0;
}
.flex-control-nav li {margin:0 6px; display:inline-block;}
.flex-control-paging li a {
	width: 11px;
    height: 11px;
    display: block;
    background: #666;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
    text-indent: -9999px;
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}
.flex-control-paging li a:hover {
	background: #333;
    background: rgba(0, 0, 0, 0.7);	
}
.flex-control-paging li a.flex-active {
	background: #ab8334;
    /*background: rgba(0, 0, 0, 0.9);*/
    cursor: default;	
}

.flex-control-thumbs {margin:5px 0 0; position:static; overflow:hidden;}
.flex-control-thumbs li {width:25%; float:left; margin:0;}
.flex-control-thumbs img {width:100%; display:block; opacity:0.7; cursor:pointer;}
.flex-control-thumbs img:hover {opacity:1;}
.flex-control-thumbs .flex-active {opacity:1; cursor:default;}

/*タブレット 横向き対応*/
@media screen and (max-width:1100px) {
/* =======================
		
========================== */
.flex-direction-nav a {
    width: 15px;
    height: 30px;
    background-image: url(/img/171024/left.png);
    -webkit-background-size: 15px 30px;
    -moz-background-size: 15px 30px;
    -ms-background-size: 15px 30px;
    -o-background-size: 15px 30px;
    background-size: 15px 30px;
    margin: 0;
}


}


@media screen and (max-width: 880px) {
	.flex-direction-nav .flex-prev {opacity:1; left:10px;}
	.flex-direction-nav .flex-next {opacity:1; right:10px;}
}

/*スマートフォン*/
@media screen and (max-width:675px) {
.flex-direction-nav {
    display: none;
}
}

@media screen and (min-width:1024px) {
.flexslider_award .flex-control-nav {
    bottom:-10px; 
}
}

/* end ************/
/******************/
/******************/