@charset "utf-8";
/* -------------------------------------------------- 
	Copyright: (c)visual and echo japan
	Created: 2012-8-1
 -------------------------------------------------- */
 
 #header {
	height:178px;
	width:100%;
	border-bottom:0px #000 solid;
}

/*----------------------------------------------------
	#manvisual
----------------------------------------------------*/


#mainvisual{
	width:1024px;
	margin:0 auto;
	height:730px;
	overflow:hidden;
	position:relative;
	padding-bottom:60px;
}
#mainvisual .visual_area{
	position:absolute;
	top:0px;
	left:0%;
	width:100%;
	height:730px;
	
}
#mainvisual ul.visual{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
}
#mainvisual ul.visual li{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	width:1024px;
	
}
#mainvisual ul.visual li img{
	width:1024px;
	height:auto;
	-webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
#mainvisual ul.visual li.active img{
  filter: alpha(opacity=100);
  -moz-opacity:1;
  opacity:1;
}

#mainvisual ul.visual li a:hover img{
	/*-moz-transform: scale(1.05,1.05);
	-webkit-transform: scale(1.05,1.05);
	-o-transform: scale(1.05,1.05);
	-ms-transform:scale(1.05,1.05);*/
}


/** RESET AND LAYOUT
===================================*/

.bx-wrapper {
	position: relative;
	margin: 0px;
	padding: 0;
	*zoom: 1;
}

.bx-wrapper img {
	max-width: 100%;
	display: block;
}

/** THEME
===================================*/

.bx-wrapper .bx-viewport {
	
	/*fix other elements on the page moving (on Chrome)*/
	-webkit-transform: translatez(0);
	-moz-transform: translatez(0);
    	-ms-transform: translatez(0);
    	-o-transform: translatez(0);
    	transform: translatez(0);
}
.bx-controls-direction{
	display:none;
}

.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	position: absolute;
	bottom: -30px;
	width: 100%;
}

/* LOADER */

.bx-wrapper .bx-loading {
	min-height: 50px;
	/*background: url(img/bx_loader.gif) center center no-repeat #fff;*/
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2000;
}

/* PAGER */

.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;
}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	*zoom: 1;
	*display: inline;
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background: #666;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #000;
}



/*----------------------------------------------------
	#topics
----------------------------------------------------*/
#topics{
	margin-bottom:40px;
}
#topics h1{
	margin-bottom:20px;
	font-family: 'mo_gblock_regularregular';
	font-size:24px;
	font-weight:bold;
	line-height:180%;
	text-align:left;
	letter-spacing: 0.08em;
}
/* 項目数3つの場合 //////////////////////////////////////////////////////////*/

#topics .list{
	overflow:hidden;
	width:1044px;
	height:600px;
	height: 295px;
	margin-left:-20px;
	background:url(../img/topics_bg04.png) no-repeat 20px 0px;
	padding-top:10px;
}
#topics .list .column{
	overflow:hidden;
	width:327px;
	height:295px;
	float:left;
	margin:0 0 20px 20px;
}
#topics .list .column .thum{
	width:327px;
	height:232px;
	overflow:hidden;
	margin-bottom:10px;
	background:#000;
	text-align:center;
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	text-indent:-9999px;
}

/* 項目数4つの場合 //////////////////////////////////////////////////////////*/
/*
#topics .list{
	overflow:hidden;
	width:1044px;
	height:245px;
	margin-left:-20px;
	background:url(../img/topics_bg02.png) no-repeat 20px 0px;
	padding-top:10px;
}
#topics .list .column{
	overflow:hidden;
	width:241px;
	height:245px;
	float:left;
	margin:0 0 20px 20px;
}
#topics .list .column .thum{
	width:241px;
	height:170px;
	overflow:hidden;
	margin-bottom:10px;
	background:#000;
	text-align:center;
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	text-indent:-9999px;
}
*/
/* 項目数5つの場合 //////////////////////////////////////////////////////////*/
/*
#topics .list{
	overflow:hidden;
	width:1044px;
	margin-left:-20px;
	background:url(../img/topics_bg01.png) no-repeat 20px 0px;
	padding-top:10px;
}
#topics .list .column{
	overflow:hidden;
	width:188px;
	height:195px;
	float:left;
	margin:0 0 20px 20px;
}
#topics .list .column .thum{
	width:188px;
	height:134px;
	overflow:hidden;
	margin-bottom:10px;
	background:#eee;
	text-align:center;
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	text-indent:-9999px;
}*/

/* 項目数5つの場合ここまで //////////////////////////////////////////////////////////*/

#topics .list .column a:hover .thum{
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	opacity:0.5;
}
#topics .list .column h2{
	margin-bottom:5px;
	text-align:center;
}
#topics .list .column p{
	font-family: 'mo_gblock_regularregular';
	font-size:10px;
	color:#aaa;
}
/*----------------------------------------------------
	#news
----------------------------------------------------*/
#news{
	margin-bottom:20px;
}
#news h1{
	margin-bottom:20px;
	font-family: 'mo_gblock_regularregular';
	font-size:24px;
	font-weight:bold;
	line-height:180%;
	text-align:left;
	letter-spacing: 0.08em;
}
#news .list{
	overflow:hidden;
	width:1044px;
	margin-left:-20px;
	background:url(../img/news_bg.png) no-repeat 20px 0px;
	padding-top:10px;
}
#news .list .column{
	overflow:hidden;
	width:188px;
	height:195px;
	float:left;
	margin:0 0 20px 20px;
}
#news .list .column .thum{
	width:188px;
	height:134px;
	overflow:hidden;
	margin-bottom:10px;
	background:#eee;
	text-align:center;
}

#news .list .column a .thum{
	-webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	
  /* -webkit-filter: grayscale(100%);
  filter: gray;*/ /* IE用 */
  width:188px;
  height:134px;
	text-indent:-9999px;
}
#news .list .column a:hover .thum{
	/*-moz-transform: scale(1.05,1.05);
	-webkit-transform: scale(1.05,1.05);
	-o-transform: scale(1.05,1.05);
	-ms-transform:scale(1.05,1.05);*/
	
/*	-webkit-filter: grayscale(0%);
filter: none;*/

 filter: alpha(opacity=50);
  -moz-opacity:0.5;
  opacity:0.5;
}
#news .list .column h2{
	margin-bottom:5px;
}
#news .list .column p{
	font-family: 'mo_gblock_regularregular';
	font-size:10px;
	color:#aaa;
}

/*----------------------------------------------------
	#schedule
----------------------------------------------------*/
#schedule{
	margin-bottom:20px;
}
#schedule h1{
	margin-bottom:20px;
	font-family: 'mo_gblock_regularregular';
	font-size:24px;
	font-weight:normal;
	line-height:180%;
}
#schedule .list{
	overflow:hidden;
	width:750px;
	margin-left:-20px;
}
#schedule .list .column{
	overflow:hidden;
	width:350px;
	height:80px;
	float:left;
	margin:0 0 0px 20px;
}
#schedule .list .column .date{
	border:1px #ccc solid;
	text-align:center;
	font-family: 'mo_gblock_regularregular';
	font-size:16px;
	line-height:60px;
	float:left;
	margin-right:10px;
	padding:0 10px;
}

#schedule .list .column h2{
	margin-bottom:5px;
}
#schedule .list .column p{
	font-size:11px;
}



/*------------------------------------------------------------------ */
/*  SMARTPHONE
/*------------------------------------------------------------------ */

@media (max-width: 767px){
	 #header {
	  	height:80px;
	  	width:100%;
	  	border-bottom:0px #000 solid;
	  }
		
		
	.bx-wrapper .bx-pager,
	.bx-wrapper .bx-controls-auto {
		position: absolute;
		bottom: -20px;
		width: 100%;
	}
	
	#mainvisual{
		width:100%;
		margin:0 auto;
		height:auto;
		overflow:hidden;
		position:relative;
		padding-bottom:20px;
	}
		
	#mainvisual .visual_area{
		position:static;
		top:0px;
		left:0%;
		width:auto;
		height:auto;
		
	}
	#mainvisual ul.visual{
		position:static;
		top:0px;
		left:0%;
		width:auto;
		height:auto;
	}
	#mainvisual ul.visual li{
		position:static;
		top:0px;
		left:0%;
		width:auto;
		height:auto;
	}
	#mainvisual ul.visual li img{
		width:100%;
		height:auto;
		-webkit-transition: all 0.2s ease;
	    -moz-transition: all 0.2s ease;
	    -ms-transition: all 0.2s ease;
	    -o-transition: all 0.2s ease;
		transition: all 0.2s ease;
	}
	/*----------------------------------------------------
		#topics
	----------------------------------------------------*/
	#topics{
		margin-bottom:20px;
		
	}
	#topics h1{
		margin-bottom:10px;
	}
	#topics h1 img{
		height:15px;
		width:auto;
	}
	#topics .list{
		overflow:hidden;
		width:100%;
		height:auto;
		margin-left:0px;
		background:none;
	}
	#topics .list .column{
		overflow:hidden;
		width:100%;
		height:auto;
		float:none;
		margin:0 0 20px 0px;
	}
	#topics .list .column a{
		display:block;
		overflow:hidden;
	}
	
	#topics .list .column .thum{
		width:100%;
		height:auto;
		overflow:hidden;
		margin-bottom:10px;
		text-indent:0px;
	}
	
	#topics .list .column .thum img{
		width:100%;
		height:auto;
		opacity:1;
	}

	#topics .list .column h2{
		margin-bottom:5px;
		font-size:12px;
		line-height:150%;
	}
	
	/*----------------------------------------------------
		#news
	----------------------------------------------------*/
	#news{
		
	}
	#news h1{
		margin-bottom:10px;
	}
	#news h1 img{
		height:15px;
		width:auto;
	}
	#news .list{
		overflow:hidden;
		width:100%;
		margin-left:0px;
		background:none;
	}
	#news .list .column{
		overflow:hidden;
		width:100%;
		height:auto;
		float:none;
		margin:0 0 20px 0px;
	}
	#news .list .column a{
		display:block;
		overflow:hidden;
	}
	
	#news .list .column .thum{
		width:30% !important;
		float:left;
		max-height:170px;
		overflow:hidden;
		margin-bottom:10px;
		margin-right:10px;
		text-indent:0px;
	}
	
	#news .list .column a .thum img{
		width:100%;
		height:auto;
		opacity:1;
	}


	#news .list .column h2{
		margin-bottom:5px;
		font-size:14px;
		line-height:150%;
	}
	
}