@charset "UTF-8";
/* ==========================================================================
   基本設定
   ========================================================================== */

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus{
	outline : none;
}

.slides,
.flex-control-nav,
.flex-direction-nav{
	margin : 0;
	padding : 0;
	list-style : none;
}



/* ==========================================================================
   Icon Fonts
   ========================================================================== */

@font-face {
	font-weight : normal;
	font-style : normal;
}



/* ==========================================================================
   メインCSS
   ========================================================================== */

.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;
}

/* Clearfix for the .slides element */
.slides:after{
	content : "\0020";
	display : block;
	clear : both;
	visibility : hidden;
	line-height : 0;
	height : 0;
}

html[xmlns] .slides{
}

* html .slides{
	height : 0%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child{
	display : block;
}



/* ==========================================================================
   デフォルトテーマ
   ========================================================================== */

.flexslider{
	padding : 0 0 30px 0;
	margin : 0;
	background : #eee;
/*	border : 4px solid #fff; */
	position : relative;
/*	-webkit-border-radius : 4px; */
/*	-moz-border-radius : 4px; */
/*	-o-border-radius : 4px; */
/*	border-radius : 4px; */
	zoom : 1;
}

@media screen and (max-width: 767px) {
	.flex-viewport{
		max-height : 200px;
		-webkit-transition : all 1s ease;
		-moz-transition : all 1s ease;
		-o-transition : all 1s ease;
		transition : all 1s ease;
	}

	.flex-viewport img{
		margin : 0 auto;
		max-height : 200px;
		max-width : 450px;
	}

	.loading .flex-viewport{
		max-height: 200px;
	}
}

@media screen and (min-width: 768px) {
	.flex-viewport{
		max-height : 300px;
		-webkit-transition : all 1s ease;
		-moz-transition : all 1s ease;
		-o-transition : all 1s ease;
		transition : all 1s ease;
	}

	.flex-viewport img{
		margin : 0 auto;
		max-height : 300px;
		max-width : 980px;
	}

	.loading .flex-viewport{
		max-height: 300px;
	}
}

.flexslider .slides{
	zoom : 1;
}

.carousel li{
	margin-right : 5px;
}



/* ==========================================================================
   左右ナビCSS
   ========================================================================== */

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

.flex-direction-nav a{
	display : block;
	width : 30px;
	height : 60px;
	margin : -30px 0 0;
	position : absolute;
	top : 50%;
	z-index : 1;
	overflow : hidden;
	opacity : 0;
	cursor : pointer;
	color : rgba(0,0,0,0);
	-webkit-transition : all .3s ease;
	-moz-transition : all .3s ease;
	transition : all .3s ease;
}

.flex-direction-nav .flex-prev{
	left : 0px;
	background : url("../img/btprev.png") no-repeat 0 0;
	background-size : 30px 60px;
}

.flex-direction-nav .flex-next{
	right : 0px;
	text-align : right;
	background : url("../img/btnext.png") no-repeat 0 0;
	background-size : 30px 60px;
}

.flexslider:hover .flex-prev{
	opacity : 0.7;
	left : 0px;
}

.flexslider:hover .flex-next{
	opacity : 0.7;
	right : 0px;
}

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover{
	opacity : 1;
}

.flex-direction-nav .flex-disabled{
	opacity : 0!important;
	filter : alpha(opacity=0);
	cursor : default;
}

.flex-direction-nav a:before{
	font-size: 10px;
	display : inline-block;
	content : '\f001';
}

.flex-direction-nav a.flex-next:before{
	content : '\f002';
}



/* ==========================================================================
   下部ナビCSS
   ========================================================================== */

.flex-control-nav{
	position : absolute;
	bottom : 10px;
	height : 10px;
	text-align : center;
	left : 50%;
}

.flex-control-nav li{
	width : 10px;
	height : 10px;
	padding : 0;
	margin : 0 8px;
/*	display : inline-block;*/
	zoom : 1;
	*display : inline;
	position : relative;
	left : -50%;
	float : left;
}

.flex-control-paging li a{
	width : 10px;
	height : 10px;
	display : block;
	background : #666;
	background : rgba(0,0,0,0.5);
	cursor : pointer;
	text-indent : -9999px;
	-webkit-border-radius : 5px;
	-moz-border-radius : 5px;
	-o-border-radius : 5px;
	border-radius : 5px;
}

.flex-control-paging li a:hover{
	background : #333;
	background : rgba(0,0,0,0.7);
}

.flex-control-paging li a.flex-active{
	background : #000;
	background : rgba(0,0,0,0.9);
	cursor : default;
}



/* ==========================================================================
   860px以下のディスプレイ時のCSS
   ========================================================================== */

@media screen and (max-width: 860px) {

	.flex-direction-nav{
	display : none;
	}

}