@charset "utf-8";

#pageName{
	display: none;
}

.instructor{
	clear: both;
	margin-top: 30px;
}
.instructor .name{
	color: #008000;
	font: bold 15px HiraKakuProN-W6;
	border-bottom: 1px solid #008000;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
.instructor:after{
  content: "";
  clear: both;
  display: block;
}
.instructor .image{
	float: left;
	display: inline;
	width: 170px;
}
.instructor .image img{
	width: 100%;
	height: auto;
}
.instructor .introduction{
	margin-left: 180px;
}
.instructor .introduction p{
	margin-top: 10px;
	line-height: 1.8;
}

/**
 * responsive style
 */
 
@media screen and (max-width: 620px) {
		
	@font-face {
		font-family: 'svg';
		src:url('fonts/svg.eot?-ce649g');
		src:url('fonts/svg.eot?#iefix-ce649g') format('embedded-opentype'),
			url('fonts/svg.woff?-ce649g') format('woff'),
			url('fonts/svg.ttf?-ce649g') format('truetype'),
			url('fonts/svg.svg?-ce649g#svg') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	
	[class^="svg-"]:before, [class*=" svg-"]:before, .svg{
		font-family: 'svg';
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 1;
	
		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	.svg-arrow-circle:before {
		content: "\e600";
	}

	body{
		font: 14px/1.231 Arial,Verdana,"Helvetica Neue",Helvetica,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic", sans-serif;
	}
	 
	*{
		max-width: 100%;
	}
	
	#homeSiteID{
		display: none;
	}
	
	.slide_image{
		margin-top: 0;
	}
	
	#pageName{
		color: white;
		display: block;
		position: absolute;
		left: 10px;
		top: 0;
	}
	
	#contentContainer #content,
	.kakaku
	{
		width: 100%;
		box-sizing: border-box;
		-ms-box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	
	
	body{
		margin: 0;
		padding: 0;
	}
	img{
		height: auto;
	}
	#bodyGrad{
		display: none;
	}
	#container, .photo-navigation{
		width: 100%;
		border: none;
	}
	#pageHeader{
		height: auto;
	}
	#pageHeader h1,#pageHeader h2{
		display: none;
	}
	#pageHeader img{
		position: static;
	}
	#sidebarContainer {
		float: none;
		width: 100%;
	}
	#contentContainer{
		margin-left: 0;
	}
	#sidebarContainer #sidebar{
		margin: 0 auto;
		width: 200px;
		text-align: center;
	}
	
	#container{
		text-align: left;
	}
	
	.slide_image{
		height: 200px;
	}
	.slide_image .item img{
		width: 100%;
		position: static!important;
	}
	.slide_image .item .copy{
		text-align: center;
	}
	.slide_image .item .copy img{
		max-width: 90%;
	}

	/**
	 * navigation
	 */
	#navcontainer{
		height: auto;
		padding: 0;
		border-bottom: 0;
		text-align: right;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	body.home #navcontainer{
		background:url(../../../../../files/tsujidotop.png) no-repeat left top;
		background-size: cover;
	}
	#navcontainer .handler{
		display: inline-block;
		width: 50px;
		height: 50px;
		cursor: pointer;
		background: #FFF;
		position: relative;
	}
	#navcontainer .handler a{
		text-align: center;
		padding: 0;
	}
	#navcontainer .handler span{
		display: block;
		padding-top: 30px;
		color: #004C00;
		font-size: 11px;

		-webkit-transition: all 500ms ease-in-out;
		-o-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;
	}
	#navcontainer .handler i{
		display: block;
		width: 80%;
		height: 3px;
		position: absolute;
		left: 10%;
		background: #004C00;

		-webkit-transition: all 500ms ease-in-out;
		-o-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;
	}
	#navcontainer .handler i:nth-child(1){
		top: 5px;
	}
	#navcontainer .handler i:nth-child(2){
		top: 15px;
	}
	#navcontainer .handler i:nth-child(3){
		top: 25px;
	}
	
	#offCanvas ul{
		padding: 0;
	}
	#offCanvas ul a{
		display: block;
		background: white;
		border-radius: 2px;
		margin: 10px;
		line-height: 1;
		color: #004400;
		text-decoration: none;
		text-align: left;
		padding: 13px 10px 10px;
	}
	#offCanvas ul a:before{
		font-family: 'svg';
		content: "\e600";
		vertical-align: middle;
		margin-right: 10px;
		color: #177647;
	}
	
	/**
	 * elements
	 */
	#boxcontents{
		display: block;
		text-align: center;
		min-width: inherit;
		
	}
	
	.album-wrapper .thumbnail-wrap{
		float: left;
		width: 50%!important;
		height: 190px!important;
		margin: 0!important;
		text-align: center;
	}
	.album-description{
		margin-bottom: 20px;
	}
	.album-wrapper .thumbnail-wrap .thumbnail-frame{
		width: auto!important;
		position: static!important;
	}
	
	.instructor .image{
		width: 110px;
		float: right;
		margin: 0 0 0 10px;
	}
	.instructor .introduction{
		margin-left: 0;
	}
	
	img.alignright, img.alignleft{
		float: none;
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
	}
	.sns-area{
		margin-left:10px;
	}
	.sns-title{
		margin-left:10px;
	}
	.album-title {
		font-size:20px !important;
	}
	
	
}