@charset "UTF-8";

/*=====================
 基本カラー設定はここから
=====================*/

/*ベース色カラー（スライダー背景色）*/
@base-bgcolor: #FFF4F6;

/*メイン背景カラー（コンテンツ背景）*/
@main-bgcolor: #fff;

/*サブ背景カラー（右カラム背景）*/
@sub-bgcolor: #fff5bc;

/*メインテキストカラー*/
@main-txtcolor: #333;

/*抜きテキストカラー*/
@light-txtcolor: #fff;

/*サブカラー（タグ色）*/
@sub-color: #76ad0c;

/*サブカラー２（カテゴリ背景）*/
@sub2-color: #FF6600;

/*=====================
 スタイル設定まとめ
=====================*/

/*メインボーダースタイル*/
.main-border {
	border: 1px #ccc solid;
}

/*ボーダー付背景グラデ*/
.grad-box {
	background-image: -webkit-linear-gradient(#fff 0%, #eee);
	background-image: -o-linear-gradient(#fff 0%, #eee);
	background-image: linear-gradient(#fff 0%, #eee);
}

/*ボーダー付背景グラデon*/
.grad-box-on {
	background-image: -webkit-linear-gradient(#eee 0%, #fff);
	background-image: -o-linear-gradient(#eee 0%, #fff);
	background-image: linear-gradient(#eee 0%, #fff);
}

/*角丸5px*/
.radius5   {  
    border-radius: 5px;/* CSS3草案 */  
    -webkit-border-radius: 5px;/* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;/* Firefox用 */  
}

/*角丸7px*/
.radius7   {  
    border-radius: 7px;/* CSS3草案 */  
    -webkit-border-radius: 7px;/* Safari,Google Chrome用 */  
    -moz-border-radius: 7px;/* Firefox用 */  
}

/*背景透明黒*/
.bg-alpha-bk {
	background-color:rgba(0,0,0,0.65);
}

/*線・パディング込のボックスサイズ*/
.box-border-box {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

/*明朝文字スタイル*/
.font-mincho {
	font-family: "ヒラギノ明朝 ProN W6","HiraMinProN-W6","HG明朝E","ＭＳ Ｐ明朝","MS PMincho","MS 明朝",serif;
}

/*背景cover*/ 
.bg-cover {
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	-ms-background-size: cover;
}

/*=====================
　　記事内スタイル設定
=====================*/

.post_box {
	font-size: 16px;
		
		@media screen and (max-width: 640px){
			font-size: 14px;
		}
	
	h1 {
		color: @sub-color;
		border-bottom: 3px solid @sub-color;
		//以下固定
		font-size: 35px;
		margin: 30px 0 10px;
	}

	h2 {
		color: @sub2-color;
		border-bottom: 3px dotted @sub2-color;
		//以下固定
		font-size: 33px;
		margin: 30px 0 10px;
	}

	h3 {
		color: @sub-color;
		border-bottom: 3px double @sub-color;
		//以下固定
		font-size: 30px;
		margin: 30px 0 10px;
	}

	h4 {
		color: @sub2-color;
		border-bottom: 3px solid @sub2-color;
		//以下固定
		font-size: 25px;
		margin: 30px 0 10px;
	}

	h5 {
		border-bottom: @sub-color 3px dotted;
		//以下固定
		font-size: 20px;
		margin: 30px 0 10px;
		color: @sub-color;
	}

	h6 {
		border-bottom: @sub2-color 3px double;
		//以下固定
		font-size: 16px;
		margin: 30px 0 10px;
		color: @sub2-color;
	}

	blockquote {
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		background-color: @sub-bgcolor;
		margin: 20px 20px;
		padding: 3em 1em;
		position: relative;
		
		@media screen and (max-width: 640px){
			margin: 0;
		}
	}

	blockquote:before {
		content: "“";
		font-size: 600%;
		line-height: 1em;
		font-family: "ＭＳ Ｐゴシック",sans-serif;
		color: #FFF;
		position: absolute;
		left: 0;
		top: 0;
	}

	blockquote:after {
		content: "”";
		font-size: 600%;
		line-height: 0em;
		font-family: "ＭＳ Ｐゴシック",sans-serif;
		color: #FFF;
		position: absolute;
		right: 0;
		bottom: 0;
	}

	a {
		color: #2ea1d6;
		border-bottom: 1px solid #2ea1d6;
	}
}

.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	
	iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100% !important;
		height: 100% !important;
	}
}

.bold{
	font-weight: bold;
}
.red{
	color: #f00;
}

/*=====================
     各ページヘッダー
=====================*/

#Pageid_top {
	background: #f2f2f2 url(../img/body_bg.jpg);
	padding-top: 120px;
	
	@media screen and (max-width: 1000px){
		padding-top: 70px;
	}
}

#Pageid_inpage {
	background: #f2f2f2 url(../img/body_bg.jpg);
}

/*=====================
        基本css
=====================*/

body {
	color: @main-txtcolor;/*基本のテキストのカラー設定*/
	background-color: #f2f2f2;/*基本背景カラー設定*/
	width: 100%;
}

	#Header {
		position: fixed;
		top: 0;
		left:0;
		width: 100%;
		z-index: 999;
		border-bottom: 1px solid #bbb;
		margin: 0;
		background: #f2f2f2 url(../img/body_bg.jpg);
		
		@media screen and (max-width: 1000px){
			height: 70px;
		}

		#Header_pc {
			overflow: hidden;
			z-index: 5;
			
			
			@media screen and (max-width: 1000px){
				display: none;
			}

			#Top {
				width: 1000px;
				margin: 0 auto;
				overflow: hidden;
				height: 80px;
				
				h1 {
					float: left;
					width: 300px;
					padding-top: 5px;
				}

				#Contact {
					float: right;
					width: 700px;
					padding-top: 10px;
					
					ul {
						li {
							width: 100%;
							text-align: right;
						}

						.bottom {
							padding-top: 5px;
							font-size: 160%;
						
							.number {
								padding-right: 10px;
								padding-left: 5px;
								padding-top: 5px;
								font-weight: bold;
							}

							a {
								display: inline-block;
								background: #56ADE8;
								padding: 6px 8px;
								font-size: 75%;
								color: #fff;
								.radius5;
								margin-left: 5px;
							}

							a:hover {
								background: #96D3FD;
							}

							.school {
								
								a{
									background: #72af2c;
								}

								a:hover{
									background: #b7e94a;
								}

							}
						}
					}
				}
			}

			#Header_nav {
				width: 100%;
				height: 40px;
				background: @sub2-color;
				
				@media screen and (max-width: 1000px){
					display: none;
				}

				.menu-header_nav-container {
					width: 1000px;
					margin: 0 auto;
					
					ul {
						overflow: hidden;
						padding: 0 5px;
						
						li {
							float: left;
							width: 165px;
							text-align: center;
							height: 40px;
							
							a {
								color: #fff;
								padding-top: 10px;
								display: block;
								-webkit-transition: 0.3s ease-in-out; 
							       -moz-transition: 0.3s ease-in-out; 
							         -o-transition: 0.3s ease-in-out; 
							            transition: 0.3s ease-in-out;
							}

							a:hover {
								opacity: 0.4;  
							    filter: alpha(opacity=60);
							}
						}
					}
				}
			}
		}

		#Header_sm {
			float: left;
			height: 49px;
			z-index: 5;
			width: 75%!important;

			@media screen and (min-width: 1000px){
				display: none;
			}

			h1 {
				width: 100%;
				margin: 0;
				padding-top: 5px;
				
				img {
					max-width: 100%;
				}
			}
		}

		.right-menu {
			float: right;
			z-index: 10;
			padding: 15px;

			@media screen and (min-width: 1000px){
				display: none;
			}
		}
	}


	#Content {
		min-height: 1000px;
		overflow: hidden;
		padding: 10px 0;
		overflow: hidden;
		
		@media screen and (max-width: 640px){
			width: 100%;
		}

		.breadcrumbs {
			text-align: left;
			padding: 0 20px;
			margin: 30px auto 0;
			width: 960px;
			
			@media screen and (min-width: 641px) and (max-width: 1000px){
				width: 640px;
				padding: 0;
			}

			@media screen and (max-width: 640px){
				width: 100%;
				.box-border-box;
			}
		}
	}
		#Main {
			width: 1000px;
			margin: 0 auto;
			overflow: hidden;
			
			@media screen and (max-width: 640px){
				width: 100%;
				padding: 20px;
				.box-border-box;
			}

			@media screen and (min-width: 641px) and (max-width: 1000px){
				width: 640px;
				marign: 0 auto;
				float: none;
				padding-top: 20px;
			}
		}

		#Main_page {
			min-width: 300px;
			padding: 10px 180px 0;
			position: relative;
			
			@media screen and (max-width: 640px){
				position: static;
			}
			
			#Center {
				overflow: hidden;
				width: 90%;
				margin: 0 auto;
			}
		}

		#Side {
			float: left;
			padding-top: 20px;
			width: 270px;
			margin-left: 20px;
			
			@media screen and (max-width: 640px){
				width: 100%;
				margin: 0;
			}

			@media screen and (min-width: 641px) and (max-width: 1000px){
				width: 640px;
				margin: 40px auto 0;
				overflow: hidden;
				float: none;
			}
		
			#Left {
				width: 100%;
				
				@media screen and (min-width: 641px) and (max-width: 1000px){
					float: left;
					width: 50%;
					padding-right: 20px;
					.box-border-box;
				}
				
				>div {
					margin-bottom: 20px;
				}

				.left_banner {
					
					ul {
						overflow: hidden;
						
						li {
							@media screen and (max-width: 1000px){
								width: 50%;
								float: left;
								text-align: center;
								.box-border-box;
								padding: 5px;
								overflow: hidden;
							}

							@media screen and (max-width: 640px){
								width: 100%;
							}

							img {
								width: 100%;
								height: auto;
							}

							p {
								text-align: center;
								margin-bottom: 10px;
							}
						}

						.pc_notview {
							@media screen and (min-width: 1001px){
								display: none;
							}
						}

						.smtb_notview {
							@media screen and (max-width: 1000px){
								display: none;
							}
						}

						.feedly {
							background: #FFF;
							text-align: center;
							padding: 10px;
							.radius5;
							border: 1px solid #ddd;
							
							p {
								padding-bottom: 5px;
							}

							img {
								width: auto;
							}
						}
					}
				}

				#Category {

					a {
						width: 270px;
						display: block;
						padding: 15px 20px;
						.box-border-box;
						font-size: 15px;
						background-color: #fff;
						margin-bottom: 5px;
						.radius5;
						.main-border;
						color: @sub2-color;
						font-weight: bold;
						
						@media screen and (max-width: 1000px){
							width: 100%;
							.box-border-box;
							padding: 15px 10px;
						}
					}

					a:hover {
					    text-decoration: none;
					    background-color: @sub2-color;
					    .main-border;
					    color: #fff;
					}
				}

				#Widget_left {

					>li {
						margin-bottom: 20px;
					}

					.widget_search {
					
						text-align: center;

						input{
							font-size: 15px;
						}

						#s {
							width: 150px;
						}
					}
					
					.tagcloud{

						a {
							.main-border;
							.radius5;
							padding: 5px 5px 5px 20px;
							background: url(../img/tag_ico.png) no-repeat 6px 6px;
							margin-bottom: 5px;
							display: inline-block;
							background-color: #fff;
						}

						a:hover {
							text-decoration: none;
							background: @base-bgcolor url(../img/tag_ico.png) no-repeat 6px 6px;
						}
					}
				}
			}

			#Right {
				width: 270px;
				background: #fff;
				padding: 10px;
				float: left;
				.box-border-box;
				
				@media screen and (max-width: 640px){
					width: 100%;
					padding: 0;
				}

				@media screen and (min-width: 641px) and (max-width: 1000px){
					float: right;
					width: 50%;
				}
				
				#Favorite {
					z-index: 1;

					@media screen and (max-width: 640px){
						width: 100%;
						padding: 10px;
						.box-border-box;
					}

					.wpp-list>li {
						list-style: none;
						
						@media screen and (max-width: 1000px){
							margin-bottom: 10px;
							overflow: hidden;
							min-height: 75px;
							padding: 10px 0;
							border-top: 1px dotted @sub-color;
						}

						.wpp-thumbnail {
							margin-bottom: 5px;
							z-index: 1;
						
							@media screen and (max-width: 1000px){
								width: 100px;
								height: auto;
								min-height: 75px;
								position: absolute;
								
							}	

						}

					}

					h3 {
						text-align: center;
						font-weight: normal;
						font-size: 19px;
					}

					.mini_subtxt {
						text-align: center;
						font-size: 13px;
						color: #888;
					}
					
					a {
						overflow: hidden;
						display: block;
						z-index: 1;
						
						@media screen and (max-width: 1000px){
							float: left;
						}
					}

					.wpp-post-title {
						font-size: 12px;
						line-height: 1.3em;
						margin-bottom: 15px;
						border-bottom: 1px dotted @sub-color;
						padding-bottom: 3px;
						
						@media screen and (max-width: 1000px){
							border-bottom: none;
							padding: 25px 0 0 110px;
						}
					}

					.wpp-list {
						counter-reset: wpp-ranking;
						z-index: 1;
						
						li {
							position: relative;
						}
					}

					.wpp-list li:before {
						content: counter(wpp-ranking, decimal);
						counter-increment: wpp-ranking;
						text-align: center;
						background: url(../img/clown.png) no-repeat;
						width: 20px;
						height: 20px;
						color: #fff;
						display: block;
						padding-top: 5px;
						position: absolute;
						top: -10px;
						z-index: 2!important;
						
						@media screen and (max-width: 1000px){
							top: 0;
							left: 110px;
							margin-top: 10px;
						}
					}
				}
			}
		}
	
	/*マウスオーバー時の透過設定(数値が低いほど薄い)*/
	.over_alpha a:hover {
		filter: alpha(opacity=60);
		-moz-opacity:0.60;
		opacity:0.60;
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);  /* For IE 5-7 */
    	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* For IE 8 */
	}
	
	.foot_conv{
		width: 100%;

		li{
			margin-bottom: 15px;

			a{
				background: @sub-color;
				color: #fff;
				padding: 15px;
				font-weight: bold;
				font-size: 160%;
				display: block;
				text-align: center;
				.radius7;
			}	
		}
		
	}

footer {
	clear: both;
	margin: 0;
}
		
	#Footer_bg {
		width: 100%;
		background: #fff repeat-x;
		overflow: hidden;
	}


		#Footer_bottom {
			width: 1000px;
			padding: 0;
			margin: 10px auto 0;
			overflow: hidden;
			
			@media screen and (min-width: 641px) and (max-width: 1000px){
				width: 640px;
			}
			
			@media screen and (max-width: 640px){
				width: 100%;
				padding-top: 10px;
				.box-border-box;
			}
		}
			#Fb_box {
				width: 320px;
				float: left;
				
				@media screen and (max-width: 640px){
					width: 100%;
					text-align: center;
					float: none;
				}

				iframe {
					background-color: #fff;
				}
			}
			
			#Powered {
				width: 660px;
				float: right;
				
				@media screen and (min-width: 641px) and (max-width: 1000px){
					width: 320px;
				}		
				
				@media screen and (max-width: 640px){
					width: 100%;
					float: none;
					margin-top: 10px;
					padding: 10px 20px;
					.box-border-box;
				}
			}

			#Copyright {
				text-align: center;
				clear: both;
				margin-top: 20px;
			}

/*=====================
        トップ
=====================*/

.smp_slide {

  @media screen and (max-width: 1000px){
    display: inline;
    margin-top: 20px;
  }

  @media screen and (min-width: 1001px){
    display: none;
  }
}

/* スライダー */
.wideslider {
  width: 100%;
  height: 380px;
  text-align: left;
  position: relative;
  overflow: hidden;
  border-top: #fff 20px solid;
  border-bottom: #fff 20px solid;
  background: #fff;
  
  @media screen and (max-width: 1000px){
    display: none;
  }
}

.wideslider ul,
.wideslider ul li {
  float: left;
  display: inline;
  overflow: hidden;
}

.wideslider_base {
  top: 0;
  position: absolute;
}
.wideslider_wrap {
  top: 0;
  position: absolute;
  overflow: hidden;

}
.slider_prev,
.slider_next {
  top: 0;
  overflow: hidden;
  position: absolute;
  z-index: 100;
  cursor: pointer;
}
.slider_prev {background: #fff /*url(../images/slider/prev.jpg) no-repeat right center*/;}
.slider_next {background: #fff /*url(../images/slider/next.jpg) no-repeat left center*/;}

.pagination {
  bottom: 10px;
  left: 0;
  width: 100%;
  height: 15px;
  text-align: center;
  position: absolute;
  z-index: 200;
}

.pagination a {
  margin: 0 5px;
  width: 15px;
  height: 15px;
  display: inline-block;
  overflow: hidden;
  background: #333;
}
.pagination a.active {
  filter:alpha(opacity=100)!important;
  -moz-opacity: 1!important;
  opacity: 1!important;
}
.wideslider ul:after {
  content: ".";
  height: 0;
  clear: both;
  display: block;
  visibility: hidden;
}

.wideslider ul {
  display: inline-block;
  overflow: hidden;
  width:1000px;
}
.wideslider img {
  width:1000px;
  height: 380px;
}

/*スライドここまで*/


#Sp_topimage {
	display: none;
	
	@media screen and (max-width: 640px){
		display: inline;
		width: 100%;
	}

	img {
		@media screen and (max-width: 640px){
			width: 100%;
		}
	}
}

.top_longbn {
	width: 100%;
	
	ul {
		li {
			width: 100%;
			text-align: center;
			margin-top: 15px;
			
			img{
				max-width: 100%;
			}
		}
	}
}

#Top_postlist {
	overflow: hidden;
	float: right;
	width: 685px;
	padding-left: 5px;
	
	@media screen and (max-width: 1000px){
		width: 100%;
	}

	#Top_postbox {
		overflow: hidden;
		width: 685px;
		
		@media screen and (max-width: 640px){
			width: 100%;
			overflow: hidden;
		}

		@media screen and (min-width: 641px) and (max-width: 1000px){
			width: 640px;
			margin: 0 auto;
		}

		/*投稿記事ボックス*/
		>li {
			width: 280px;
			min-height: 320px;
			.main-border;
			padding: 10px;
			margin: 20px;
			background: #fff;
			float: left;
			
			@media screen and (max-width: 640px){
				width: 100%;
				.box-border-box;
				margin: 0 0 10px 0;
				min-height: 280px;
			}

			@media screen and (min-width: 641px) and (max-width: 1000px){
				margin: 9px;
			}
			
			.postbox_img {
				width: 280px;
				height: 210px;
				position: relative;
				background: url(../img/postimg_bg.jpg);
				.bg-cover;
				
				@media screen and (max-width: 640px){
					width: 100%;
					height: 170px;
					margin: 10px;
					overflow: hidden;
					margin: 0;
				}
				
				a {

					img {
						width: 100%;
						height: 210px;
						display: block;
						
						@media screen and (max-width: 640px){
							width: 100%;
							height: auto;
						}
					}
					
					h3 {
						.bg-alpha-bk;
						position: absolute;
						bottom: 0;
						left: 0;
						padding: 3px;
						font-size: 15px;
						font-weight: bold;
						color: #fff;
						width:274px;
						background-color: #555\9;
						
						@media screen and (max-width: 640px){
							width: 100%;
						}
					}
				}
			}

			>p {
				line-height: 1.5em;
				padding: 8px 0 5px;
			}

			dl {

				overflow: hidden;
				
				dt {
					width: 100%;
					@media screen and (max-width: 640px){
						width: 100%;
					}

					a {
						background: @sub2-color;
						color: #fff;
						.radius5;
						float: left;
						padding: 1px 5px;
						margin-right: 5px;
						margin-bottom: 5px;
						font-size: 90%;
					}

					a:hover {
						background: #999;
						color: #fff;
					}
				}

				dd {
					float: right;
					font-weight: bold;
					color: @sub-color;
					width: 100%;
					padding-top: 5px;

					@media screen and (max-width: 640px){
						width: 100%;
					}
				}	
			}
		}
	}

	#Top_service {
		width: 100%;
		.box-border-box;
		overflow: hidden;
		margin-top: 10px;
		
		@media screen and (max-width: 640px){
			padding: 0;
		}
		
		li {
			width: 165px;
			.radius5;
			text-align: center;
			float: left;
			margin: 3px;
			.box-border-box;

			&.full_bn{
				width: 100%!important;
				margin: 3px 3px 0px;
			}
			
			@media screen and (min-width: 641px) and (max-width: 1000px){
				width: 48%;
				margin: 1%;
			}

			@media screen and (max-width: 640px){
				width: 48%;
				margin: 1%;
			}

			img {
				max-width: 100%;
				height: auto;
				
				@media screen and (max-width: 640px){
					height: auto;
				}
			}

			h3 {
				color: #e06f24;
				font-size: 120%;
				margin: 0;
				
				@media screen and (max-width: 640px){
					font-size: 80%;
				}
			}
		}

		li:hover {
			filter: alpha(opacity=60);
			-moz-opacity:0.60;
			opacity:0.60;
			filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);  /* For IE 5-7 */
    		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* For IE 8 */
		}
	}

	#Top_ser_other {
		width: 100%;
		.box-border-box;
		padding: 0 5px;
		
		@media screen and (max-width: 640px){
			padding: 0;
		}
		
		li {
			max-width: 100%;
			.box-border-box;
			text-align: center;
			padding:10px;
			background: #fff;
			border: 2px #009C9F solid;
			text-align: center;
			.radius5;
			margin: 10px;
			
			@media screen and (max-width: 640px){
				max-width: 98%;
				margin: 10px auto;
			}

			h3 {
				color: #e06f24;
				font-size: 120%;
				margin: 10px 0;
				
				@media screen and (max-width: 640px){
					font-size: 80%;
				}
			}

			img {
				margin-top: 10px;
				width: auto;
				height: 90px;
				
				@media screen and (max-width: 640px){
					max-width: 80%;
					height: auto;
				}
			}
		}

		li:hover {
			background: #d7f5e2;
		}
	}
}

/*=====================
      記事ページcss
=====================*/

#Single_post {
	width: 600px;
	float: right;
	background: #fff;
	.main-border;
	margin: 20px;
	padding: 20px;
	
	@media screen and (max-width: 640px){
		.box-border-box;
		width: 100%;
		margin: 0;
	}

	@media screen and (min-width: 641px) and (max-width: 1000px){
		width: 640px;
		padding: 20px;
		.box-border-box;
		margin: 0 auto;
		float: none;
	}

	.post {
		
		.tag_list {
			overflow: hidden;
				
			a {
				color: @sub-color;
				margin-right: 10px;
				font-weight: bold;
			}
			
		}
		
		h3 {
			font-size: 30px;
			margin-bottom: 10px;
			
			@media screen and (max-width: 640px){
				font-size: 25px;
			}
		}

		.postinfo {
			margin-bottom: 40px;
			border-bottom: 10px solid @base-bgcolor;
			line-height: 2.5em;
			color: @sub2-color;
			
			@media screen and (max-width: 640px){
				overflow: hidden;
				margin-bottom: 20px;
			}
			
			.date {
				margin-right: 25px;
				
				@media screen and (max-width: 640px){
					width: 100%;
					display: block;
					font-size: 15px;
					margin-right: 0;
					line-height: 1.2em;
				}
			}

			.catg {
				@media screen and (max-width: 640px){
					width: 100%;
					display: block;
					font-size: 13px;
				}
			}
		}

		.post_box {
		
			img {
				max-width: 100%;
				height: auto;
			}
		}
	}

	.pagelink {
		margin-top: 40px;
		overflow: hidden;
		border-top: 10px solid @base-bgcolor;
		
		.oldpage {
			width: 50%;
			display: block;
			float: left;
			.box-border-box;
			padding: 10px 20px 10px 10px;
		}

		.newpage {
			width: 50%;
			display: block;
			float: right;
			.box-border-box;
			padding: 10px 10px 10px 20px;
		}
	}

}

/*=====================
      　中ページ
=====================*/

#Page_main {
	width: 1000px;
	margin: 120px auto 0;
	text-align: center;
	
	@media screen and  (min-width: 640px) and (max-width: 1000px){
		width: 100%;
		margin: 0;
		margin-top: 60px;	
	}

	@media screen and (max-width: 640px){
		width: 100%;
		margin: 0;
		margin-top: 60px;	
	}

	p {
		font-size: 35px;
		letter-spacing: 0.3em;
		padding-top: 40px;
		
		@media screen and (max-width: 640px){
			width: 100%;
			font-size: 20px;
		}
	}
}

#Page_content_nopad {
	width: 640px;
	float: right;
	margin: 20px;

	@media screen and (max-width: 640px){
		width: 100%;
		margin: 0 auto 40px;
		.box-border-box;
		padding: 0;
		background: none;
		border: none;
	}

	@media screen and (min-width: 641px) and (max-width: 1000px){
		width: 640px;
		padding: 20px;
		.box-border-box;
		margin: 0 auto;
		float: none;
	}

	.post_box {
		background: #fff;
		padding: 20px;
		width: 100%;
		.box-border-box;
		.main-border;
		margin-bottom: 30px;
	}
}

#Page_content {
	width: 600px;
	float: right;
	background: #fff;
	.main-border;
	margin: 20px;
	padding: 20px;

	@media screen and (max-width: 640px){
		width: 100%;
		margin: 0 auto 40px;
		.box-border-box;
	}

	@media screen and (min-width: 641px) and (max-width: 1000px){
		width: 640px;
		padding: 20px;
		.box-border-box;
		margin: 0 auto;
		float: none;
	}

	/*お問い合わせ*/

	#Contactform {
		font-size: 16px;
		
		dl {
			overflow: hidden;
			clear: both;
			border-bottom: 1px dotted @sub-color;
			padding: 20px 0;

			dt {
				float: left;
				width: 220px;
				text-align: center;
				
				@media screen and (max-width: 640px){
					float: none;
					text-align: left;
					width: 100%;
					padding-bottom: 10px;
				}
				
				.hissu {
					margin-left: 15px;
					padding: 5px;
					background: @sub-color;
					font-size: 14px;
					font-weight: bold;
					color: @light-txtcolor;
				}
			}

			dd {
				float: left;
				font-size: 14px;
				width: 350px;
				
				@media screen and (max-width: 640px){
					float: none;
					width: 100%;
				}
				
				input {
					font-size: 18px;
					padding: 5px;
					width: 350px;
					
					@media screen and (max-width: 640px){
						width: 100%;
						.box-border-box;
					}
				}

				span {
					width: 100%;
					.box-border-box;
				}

				textarea {
					font-size: 18px;
					padding: 5px;
					width: 100%;
					.box-border-box;
				}
			}
		}

		p {
			text-align: center;
			margin-top: 20px;
			
			@media screen and (max-width: 640px){
				width: 100%;
			}

			input {
				display: inline-block;
				background: #72af2c;
				padding: 5px 30px;
				color: #fff;
				.radius5;
				border: none;
				font-size: 150%;
				cursor: pointer;
				
				@media screen and (max-width: 640px){
					width: 100%;
				}
			}
		}

		.checkbox-606{ 
			input{
				width: 15px;
			}
			
			.wpcf7-list-item{
				display: block;
			}
		}

		.text-147{
			.short{
				width: 60%;
  				margin: 10px;
			}	
		}
	}
}


.green{
	color: #488B00;
	font-weight: bold;
	font-size: 110%;
}

.orange{
	color: #FF4800;
	font-size: 120%;
}

/*=====================
      スタッフページ
=====================*/

/*スタッフ個別ページ*/

.staff_post {

	.post_box {

		#Name {
			h4 {
				color: #000;
				border: none;
				margin: 0;
				font-size: 120%;
			}

			h3 {
				color: #000;
				border: none;
				margin: 0;
				font-size: 150%;
			}
		}

		#Case_photos {
			li {
				.imgs {
					img {
						max-width: 100%;
					}
				}
			}
		}

		#Comment {
			padding: 30px 0;
		}
	}
}



.staff_listbox {
	overflow: hidden;

	li {
		float: left;
		width: 230px;
		padding: 10px;
		text-align: center;

		@media screen and (min-width: 641px) and (max-width: 1000px){
			width: 190px;
		}

		@media screen and (max-width: 640px){
			width: 50%;
			.box-border-box;
		}

		a {
			img {
				max-width: 100%;
			}
		}

		p {
			font-size: 110%;

			@media screen and (max-width: 640px){
				display: none;
			}
		}

		h3 {
			font-size: 140%;
		}

		.icon {
			display: inline;

			img {
				width: 40px;
				height: 40px;
			}
		}
	}
}



/*====================================
料金・コース／HAYAメソッド／その他固定ページ
====================================*/

.pageid_price, .pageid_schedule, .pageid_trial, .pageid_recruit {

	img {
		max-width: 100%;
	}

	ul.after{
		margin: 20px 0;

		li{
			margin: 20px 0;
			img{
				width: 100%;
			}
		}
	}

	.choice_course {
		margin: 30px 0;

		li {
			width: 100%;
			margin-bottom: 5px;

			a {
				text-align: center;
				padding: 10px 0;
				display: block;
				border: 1px #ddd solid;
				.radius5;
				background: #FFF5BC;
				font-size: 15px;
				color: #000;
			}

			a:hover {
				background: #eee;
			}
		}
	}

	.box {
		width: 100%;
		border: 2px solid #72AF2C;
		padding: 10px;
		.box-border-box;
		margin-bottom: 20px;
	}

	.box.fuki{
		.radius5;
		width: 90%;
		position: relative;
		margin: 0 auto 20px auto;
		img{
			position: absolute;
			bottom: 8px;
			&.fuki-r{right:-31px;}
			&.fuki-l{left:-31px;}
		}
	}

	ul.what{
	width: 94%;
	margin: 10px auto 0 auto;
		li{
			font-size: 90%;
			border-left: 6px solid #72AF2C;
			background: #f5f5f5;
			margin-bottom: 4px;
			padding: 3px 0 3px 10px;
		}
	}

	.target {
		overflow: hidden;
		
		img {
			width: 40%;
			float: left;
			
			@media screen and (max-width: 640px){
				width: 100%;
				padding-top: 20px;
			}
		}

		ul {
			width: 60%;
			float: right;
			
			@media screen and (max-width: 640px){
				width: 100%;
			}
			
			li {
				padding-left: 50px;
				width: 100%;
				overflow: hidden;
				background: url(../img/ico_check.png) no-repeat 20px 3px;
				.box-border-box;
				
				@media screen and (max-width: 640px){
					padding-left: 30px;
					background: url(../img/ico_check.png) no-repeat 0 3px;
					.box-border-box;
				}
			}

			.osusume {
				padding-left: 20px;
				width: 100%;
				overflow: hidden;
				background: none;
				
				@media screen and (max-width: 640px){
					padding-left: 0;	
				}
				
				img {
					max-width: 100%;
					width: auto;
					padding-bottom: 20px;
				}
			}
		}
	}

	table {
		width: 100%;
		background: #fff;
		
		th, td {
			border: 1px #eee solid;
			padding: 15px 5px;
			font-size: 80%;
			text-align: center;
			
			@media screen and (max-width: 640px){
				font-size: 60%;
			}
		}
	}

	.tablepress {
		tr {
			th,td {
				width: 14%;
			}
		}
	}

	.first_table {
		th {
			background: #9be1ec;
		}

		th, td {
			width: 50%;
		}
	}

	.price_table {
		
		th {
			background: #FFF5BC;
		}

		.title {
			width: 30%;
		}

		.price {
			width: 25%;
		}

		.week {
			width: 15%;
		}

		.time {
			width: 15%;
		}

		.month {
			width: 15%;
		}
	}

	h2 {
		font-size: 150%;
		text-align: center;
		border-bottom: 3px dotted #f60;
		margin-top: 0!important;
	}

	.title {
		overflow: hidden;
		
		img {
			float: left;
			width: 80px;
			height: auto;
		}

		h2 {
			float: left;
			padding-left: 2%;
			font-size: 130%;
			text-align: left;
			border: none;
			padding: 10px;
		}
	}

	h3 {
		font-size: 130%;
		margin-top:-150px;
    	padding-top:150px;
	}

	h5 {
		font-size: 100%;
		color: #37A7E1;
		border-bottom: 2px dotted #37A7E1;
		
		span {
			background: #72af2c;
			color: #fff;
			.radius5;
			padding: 3px 5px;
			margin-right: 10px;
		}
	}

	p {
		font-size: 80%;
	}

	strong {
		color: #ef0000;
	}

	.distance_txt{
		display: inline-block;
		background: #F00;
		color: #fff;
		padding: 13px;
		font-size: 105%;
		margin: 20px 0 10px;
		.radius5;
	}

	iframe{
		width: 100%;
		margin-top: 10px;
	}

	.acMenu.blue{
		dt{
			div{
		    	width: 70%;
		    	margin: 0 auto;
		    	float: none;
		    	background: #37a7e1;
			}
		}
	}

	.acMenu {
		margin-top: 20px;

		dt {
		    width: 100%;
		    cursor: pointer;
		    overflow: hidden;
	    }

	    dt div,div.link {
	    	border: 1px #eee solid;
	    	.radius5;
	    	display: block;
	    	width: 25%;
	    	padding: 10px 15px;
	    	text-align: center;
	    	background: #FF6600;
	    	color: #fff;
	    	font-weight: bold;
	    	float: right;
	    	
	    	@media screen and (max-width: 640px){
	    		font-size: 90%;
	    		width: 50%;
	    	}
	    }

	    div.link{
	    	margin-bottom: 15px;

	    	a{
	    		color: #fff;
	    		text-decoration: none;
	    		border: none;
	    	}
	    }

	    dd {
			background: #fff;
		    width: 100%;
		    display: none;
		    padding: 10px;
		    .box-border-box;
		    border: 5px #eee solid;
		    
		    h4 {
		    	margin-top: 0;
		    	font-size: 130%;
		    	border-bottom: 3px solid #17A4CB;
		    }

		    p {
		    	margin: 0 0 20px;
		    }

		    .lecturer_ul{
		    	margin-bottom: 20px;
		    	font-size: 95%;
		    }

		    .lecturer_youtube{
		    	margin-bottom: 20px;
		    }

		    .lecturer_content{
		    	li{
		    		border-left: 5px solid #72AF2C;
		    		padding-left: 5px;
		    		margin: 5px 0;
		    	}
		    }

		    img.price_bn{
				display: block;
				margin: 0 auto 20px;
		    }
	    }	
	}

	.qestion {
		overflow: hidden;
		
		li {
			float: left;
			width: 50%;
			
			@media screen and (max-width: 640px){
				width: 100%;
			}

			div {
				margin: 20px;
				padding: 20px;
				background: #FFF5BC url(../img/question.png) no-repeat;
				background-position: center center; 
				.radius5;
				min-height: 110px;
			}
		}
	}

	.point {
		font-size: 120%;
		margin-top: 10px;
		
		p{
			margin-bottom: 10px;
			
			span {
				font-weight: bold;
				color: #37A7E1;
				padding-right: 10px;
			}
		}
	}

	.episode{

		p{
			font-size: 100%;
		}

		p{
			margin-bottom: 10px;
		}

		.episode_lr{
			overflow: hidden;
			.txt{
				width: 50%;
				float: left;
			}

			.img{
				width: 50%;
				float: right;
			}
		}
		.episode_bn{
			border: none;

			img{
				display: block;
				margin: 15px auto 0 auto;
			}
		}
	}

	.lrset {
		overflow: hidden;
		margin-bottom: 20px;
		
		.left {
			width: 40%;
			float: left;
			padding-right: 20px;
			.box-border-box;
			text-align: center;
			
			@media screen and (max-width: 640px){
				width: 100%;
				padding: 0;
			}

			img {
				max-width: 100%;
			}
		}

		.right {
			width: 60%;
			float: right;
			
			@media screen and (max-width: 640px){
				width: 100%;
				padding: 0;
			}
		}

		.left_txt{
			width: 60%;
			float: right;

			@media screen and (max-width: 640px){
				width: 100%;
				padding: 0;
			}

		}

		.right_img{
			width: 40%;
			float: right;
			padding-left: 20px;
			.box-border-box;
			text-align: center;

			@media screen and (max-width: 640px){
				width: 100%;
				padding: 0;
			}

			img {
				max-width: 100%;
			}

		}
	}

	.recruit_top_bn{
		margin-bottom: 25px;
	}

	.recruit_comment{
		p{
			font-size: 100%;
		}
	}
	.president_name{
		float: right;
	}

	.content_box{
		margin-bottom: 20px;
		overflow: hidden;
	}

	.box_le {
		width: 55%;
    	float: left;
    	margin-right: 5%;
	}

	.box_ri{
		width: 40%;
    	float: left;
	}

	.box_le_2 {
		width: 40%;
    	float: left;
    	margin-right: 5%;
	}

	.box_ri_2{
		width: 55%;
    	float: left;
	}

	.one_day{
		overflow: hidden;

		.content_box:first-child{
			border-bottom: dotted 2px;
			padding-bottom: 15px;
		}

		.title2{
			overflow: hidden;

			h3{
				border: none;
				color: #000000;
			}

			.clock_ico{
			float: left;
			margin-right: 5px;
			}
		}

		.lr_img{
			overflow: hidden;
			margin-bottom: 20px;
			border-bottom: dotted 2px;
			padding-bottom: 15px;

			img{
				float: left;
				width: 48%;

				@media screen and (max-width: 640px){
				width: 100%;
				}
			}

			img:first-child{
				margin-right: 2%;

				@media screen and (max-width: 640px){
				margin-bottom: 10px;
				}
			}
		}
	}

	.recruit_view{
		
		p{
			font-size: 100%;
		}

		p span{
			color: #ff0000;
		}

		h3{
			font-size: 105%;
			color: #56ADE8;
			border-bottom: 3px dotted #56ADE8;
		}

		.font_weight{
			font-weight: bold;
		}
	}
}

.course_box {
	width: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	overflow: hidden;
	border: 1px solid #ccc;
	padding: 20px;
	background: #FFF;

	.course_text {
		float: left;
		width: 50%;
		margin-top: 6px;
	}

	.course_text:before {
		content: "▶";
		color: #56ADE8;
		margin-right: 3px;
	}
}

.normal_txt {
	font-size: 16px;
}

.course_btn {
	float: right;
	width: 50%;

	a {
		display: inline-block;
		background: #72af2c;
		padding: 6px 8px;
		font-size: 100%;
		color: #fff;
		.radius5;
		margin-left: 5px;
		text-align: center;
		border-bottom: none;
	}

	a:hover {
		background: #b7e94a;
	}
}

.lecturer_bn{
	margin-top:20px;
}

.video{
	padding-top:40px;
	h2{
		padding-top: 50px;					
	}
	h3{
		margin-top: 0;
		font-size: 17px;
	}
	.youtube + h3{
		margin-top: 30px;
	}
}

h3.lect{
	margin: 10px 10px 20px 10px;
	padding: 0;
}

span.red{
	color: #ff3322;
	font-weight: bold;
}


/*====================================
料金・コース／HAYAメソッド／その他固定ページここまで
====================================*/

/*=====================
Googleカレンダーレスポンシブ
=====================*/

.googlecal{
		width: 100%;
		height: 500px;

	@media screen and (max-width: 640px){
		width: 280px;
		height: 300px;
		margin: 0 auto;
	}

	iframe{
		width: 100%;
		height: 500px;
	}
}

 
@media screen and (max-width: 640px) {
    iframe[src*="calendar"] {
        width: 280px!important;
        height: 300px!important;
    }
}

#Year{
	color: @sub-color;
	border-bottom: 3px double @sub-color;
	//以下固定
	margin-bottom: 10px;
}

/*=====================
      　会社概要
=====================*/

.Company {
  margin-bottom: 40px;
  
  table {
    width: 100%;
    background: #fff;
    font-size: 90%;
    
    th {
      padding: 10px;
      border: 1px #bbb solid;
      text-align: center;
      background: #eee;
    }

    td {
      padding: 10px;
      border: 1px #bbb solid;
    }

    tr {
      border: 1px #bbb solid;
    }

    .column-1 {
    	width: 20%;
    	text-align: center;
    }
  }

	h3 {
		margin-top: 0;
	}

  .ggmap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin: 30px 0;
  }
   
  .ggmap iframe,
  .ggmapr object,
  .ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  ul {
    overflow: hidden;
    
    li {
      width: 50%;
      float: left;
      padding: 10px;
      .box-border-box;
      
      @media screen and (max-width: 640px){
        width: 100%;
      }
      
      img {
        max-width: 100%;
      }
    }
  }
}

/*スタッフ一覧ページ*/

#Pageid_stafflist {

	#Top_postbox {
  
		.post_staff_sm {
			width: 640px;
			.box-border-box;
			min-height: 240px!important;
			position: relative;
			min-height: 210px;
	      
	    	@media screen and (max-width: 1000px){
	        	width: 100%;
	        	.box-border-box;
	        	margin: 0 0 30px!important;
	    	}

	    	@media screen and (max-width: 640px){
	    		width: 100%;
	    		.box-border-box;
	    		margin: 0 0 30px!important;
	    	}

	    	.postbox_img {
	      		float: left;
	      
	      		@media screen and (max-width: 640px){
			        width: 100%;
			        height: auto;
			    }

	      		a {
	        		img {
	          			height: auto;
	        		}
	      		}
	    	}

	    	.staff_info {
	    		float: right;
	    		width: 330px;
	      
	      		@media screen and (max-width: 640px){
			        width: 100%;
			    }
	      
			    h4 {
			        font-size: 120%;
			    }

			    h3 {
			        font-size: 150%;
			        margin-bottom: 20px;
			    }

			    p {
			        @media screen and (max-width: 640px){
			          padding: 0 0 50px;
			    }
	      	}
	    }

	    .staff_more {
			width: 140px;
			height: 30px;
			right: 10px;
			bottom: 10px;
			position: absolute;
			display: block;
			background: @sub2-color;
			color: #fff;
			text-align: center;
			.radius5;
			font-size: 120%;
			padding-top: 10px;
	    }

	    .staff_more:hover {
	        filter: alpha(opacity=60);
	    	-moz-opacity:0.60;
	    	opacity:0.60;
	    	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);  /* For IE 5-7 */
	    	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* For IE 8 */
	    }
	}
	}//#Content_end
}//#Pageid_stafflist

/*=====================
      プラグイン用
=====================*/

/*sharebar*/
body ul#sharebar {
    border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
    padding: 5px 0 5px 0;
    margin-top: 40px;
}

/*WordPress Related Posts」*/
#wp_rp_first {

	margin: 30px 0;
	
	li {
		min-height: 80px;
	}
}

/*メンバーコメント*/

.member_comment {
	#comments {
		h3 {
			font-size: 150%;
			background: #ff6600;
			color: #fff;
			width: 100%;
			text-align: center;
			margin-top: 50px;
		}

		.logged-in-as {
			margin-borrom: 10px;
		}

		.comment-form-comment {
			label {
				display: block;
			}

			textarea {
				width: 100%;
				font-size: 120%;
			}
		}

		.form-allowed-tags {
			padding: 10px;
			border: 1px dotted #ddd;
			margin-bottom: 20px;
		}
	}
}

/*facebookコメント*/
.fb-comments,
.fb_iframe_widget,
.fb_iframe_widget[style],
.fb-comments iframe[style],
.fb-social-plugin span,
.fb-comments span {
    width: 100% !important;
    display: block;
}

.facebook_comment {
	.h5 {
		font-size: 80%;
		color: #72af2c;
	}
}

/*各シェアボタン*/
#Post_sharebox {
	overflow: hidden;

	.commoninput {
	    border: none;
	    color: #fff;
	    font-size: 18px;
	    -o-transition: .3s;
	    -ms-transition: .3s;
	    -moz-transition: .3s;
	    -webkit-transition: .3s;
	    transition: .3s;
	    border-radius: 0;
	}

    .snsfb-btn {
    	-webkit-appearance: button;
        background: #305097;
        height: 70px;
        width: 50%;
        line-height: 50px;
        text-align: center;
        display: inline-block;
        .box-border-box;
        float: left;
        border: 3px solid #fff;
        margin-top: 20px;
        
        @media screen and (max-width: 1000px){
			width: 100%;
        }
    }
    
    .snsfb-btn:focus, .snsfb-btn:hover, .snsfb-btn:active {
        outline: none;
        background: #22417d;
        cursor: pointer;
    }
    
    .snstw-btn {
    	-webkit-appearance: button;
        background: #00aced;
        height: 70px;
        width: 50%;
        line-height: 50px;
        text-align: center;
        display: inline-block;
        border: 3px solid #fff;
        .box-border-box;
        float: left;
        margin-top: 20px;
        
        @media screen and (max-width: 1000px){
			width: 100%;
        }
    }
    
    .snstw-btn:focus, .snstw-btn:hover, .snstw-btn:active {
        outline: none;
        background: #056e93;
        cursor: pointer;
    }
    
    .snsline-btn {
    	-webkit-appearance: button;
        background: #5ae628;
        height: 70px;
        width: 100%;
        line-height: 50px;
        text-align: center;
        display: inline-block;
        margin-top: 20px;
        border: 3px solid #fff;
        .box-border-box;
    }
}

/*Pagenate*/

#Pagenate {
	width: 685px;
	overflow: hidden;
	text-align: center;
	min-height: 20px;
	margin: 20px 0;

	@media screen and (max-width: 1000px){
		width: 100%;
	}

	.wp-paginate {

		.current {
			display: -webkit-inline-box;
			display: inline-block;  
	    	*display: inline;  
	    	*zoom: 1;
	    }

	    a {
	    	display: -webkit-inline-box;
			display: inline-block;  
	    	*display: inline;  
	    	*zoom: 1;
	    } 
	}
}