@charset "UTF-8";
/*===============================================
PC
===============================================*/
/* ワイド化 */
.Stage,
#mainScreen {
	width: 950px;
	padding:0;
	margin:0 auto;
	text-align:left;
}
div#content {
	_height: 1%;
	margin-left: auto;
	margin-right: auto;
	width: auto;
}
div.contents,
div.contentsArea {
	_height: 1%;
	margin-left: auto;
	margin-right: auto;
	width: 950px;
}

/* トップページ, 共通 */
/*
@media screen and (min-width: 641px) {
*/
	#active,
	#active * {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	
  #active {
    font-family: "Lucida Grande", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    margin: 12px auto 0;
    width: 950px;
    
  }
  #active * {
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }
  #active h1,
  #active h2,
  #active h3,
  #active h4,
  #active h5,
  #active p,
  #active dl,
  #active dt,
  #active dd,
  #active ul,
  #active li {
  	background: none repeat scroll 0 0 transparent;
    border: 0 none;
    font-size: 100%;
    font-weight: normal;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
  }
	#active .cf { zoom: 1; }
	#active .cf:before, .cf:after { content: ""; display: table; }
	#active .cf:after { clear: both; }
	
	#active .bg_pink{
		background-color: #f7edec;
	}
	#active .bg_white{
		background-color: #fff;
	}
	#active .bg_brown{
		background-color: #e7e1d3;
	}
	
	
	#active img {
		display: block;
		width: 100%;
		height: auto;
		line-height: 1;
		/*
		border: none;
		font-size: 0;
		line-height: 0;
		vertical-align: top;
		*/
	}
	#active .font_b{
		font-weight: bold;
	}
  #active .sp {
    display: none !important;
  }
  #active .pc {
    display: block !important;
  }
  #active a {
    text-decoration: none;
    color: #FFF;
  }
  #active li {
    list-style: none;
  }
	#active .f_header {
		width: 100%;
		margin: 0 auto;
	}
	
		
			#active .section_wrap_inner .img_wrap_bottom{
				position: absolute;
				top:0;
				z-index: 10;
				width: 340px;
			}
				#active .section_wrap_inner .img_wrap_bottom.left{
					left: 0;
				}
				#active .section_wrap_inner .img_wrap_bottom.right{
					right: 0;
				}
			
			#active .section_wrap_inner .img_wrap_bottom img{
				position: relative;
				z-index: 10;
			}
			#active .section_wrap_inner .img_wrap_bottom .img_bg_brown{
				content: '';
				width: 100%;
				height: 0;
				padding-top: 83.823529%;
				background-color: #e7e1d3;
				position: absolute;
				top:15px;
				right: -15px;
			}
			#active .section_wrap_inner .img_wrap_bottom .img_bg_pink{
				content: '';
				width: 100%;
				height: 0;
				padding-top: 83.823529%;
				background-color: #f7edec;
				position: absolute;
				top:15px;
				right: -15px;
			}
				
			#active .section_wrap_inner .desc_wrap_bottom{
				width: 700px;
				position: relative;
				padding: 50px 0;
				overflow: hidden;
			}
				#active .section_wrap_inner .desc_wrap_bottom.left{
					float: left;
				}
				#active .section_wrap_inner .desc_wrap_bottom.right{
					float: right;
				}
				#active .section_wrap_inner .desc_wrap_bottom dl.desc_wrap_inner{
					width: 530px;
					padding: 0 30px;
					color: #4f4f4f;
				}
				
				#active .section_wrap_inner .desc_wrap_bottom.right dl.desc_wrap_inner{
					float: right;
				}
				#active .section_wrap_inner .desc_wrap_bottom.left dl.desc_wrap_inner{
					float: left;
				}
				
					#active .section_wrap_inner .desc_wrap_bottom dl.desc_wrap_inner dt{
						font-size: 20px;
						font-weight: bold;
						display: block;
						border-bottom: 1px solid #4f4f4f;
						margin-bottom: 20px;
						line-height: 1.6;
						color: #4f4f4f;
					}
						#active .section_wrap_inner .desc_wrap_bottom dl.desc_wrap_inner dd p{
							font-size: 15px;
						}
						#active .section_wrap_inner .desc_wrap_bottom dl.desc_wrap_inner dd p.top_txt{
							margin-bottom: 25px;
						}


	#active .top_wrap{
		width: 100%;
		position: relative;
		margin: 0 auto;
		overflow: hidden;
	}
		#active .top_wrap.sec01{
			padding: 60px 0 100px;
		}
						
		#active .inter_wrap{
			width: 100%;
			max-width: 890px;
			position: relative;
			overflow: hidden;
			margin: 0 auto;
		}
			#active .inter_wrap li{
				width: 50%;
				position: relative;
				overflow: hidden;
				float: left;
				padding: 0 10px;
				text-align: center;
				color: #4f4f4f;
			}
				#active .inter_wrap li a{
					color: #4f4f4f!important;
					display: block;
					width: 100%;
					position: relative;
					overflow: hidden;
				}
				
				#active .inter_wrap li .top_img{
					width: 100%;
					position: relative;
					overflow: hidden;
				}
					#active .inter_wrap li .top_img .top_img_desc{
						width: 100%;
						height: 35px;
						line-height: 35px;
						position: absolute;
						bottom: 0;
						left: 0;
						background-color: rgba(255,255,255,.8);
						font-size: 14px;
					}
				#active .inter_wrap li .bottom_txt{
					width: 100%;
					position: relative;
					overflow: hidden;
					padding: 0 20px;
					background-color: #fff;
				}
					#active .inter_wrap li .bottom_txt .bottom_txt_title{
						width: 100%;
						position: relative;
						overflow: hidden;
						border-bottom: 1px solid #4f4f4f;
						display: block;
						font-size: 17px;
						font-weight: bold;
						padding: 5px 0;
						margin: 17px 0 23px;
					}
					#active .inter_wrap li .bottom_txt img{
						display: block;
						width: 100%;
						margin-bottom: 25px;
					}
					#active .inter_wrap li .bottom_txt p{
						font-size: 14px;
						font-weight: bold;
						line-height: 1.0;
						margin-bottom: 25px;
					}
					#active .inter_wrap li .bottom_txt .readmore{
						display: none;
					}
			
		#active .top_wrap.sec02{
			padding: 40px 0 40px;
		}
			#active .top_wrap.sec02 .title_desc{
				width: 290px;
				display: block;
				margin: 0 0 7px 237px;
			}
			
			#active .logo_wrap{
				width: 100%;
				max-width: 890px;
				position: relative;
				overflow: hidden;
				margin: 0 auto;
			}
				#active .logo_wrap li{
					width: 25%;
					position: relative;
					overflow: hidden;
					float: left;
					padding: 0 10px 20px;
				}
					#active .logo_wrap li a{
						display: block;
						width: 100%;
						position: relative;
						overflow: hidden;
					}
					
		#active .top_wrap.sec03{
			padding: 80px 0 80px;
		}
			#active .top_wrap.sec03 .title_desc{
				width: 390px;
				display: block;
				margin: 0 0 7px 359px;
			}

			#active .staff_wrap{
				width: 100%;
				max-width: 892px;
				position: relative;
				overflow: hidden;
				margin: 0 auto;
			}
				#active .staff_wrap li{
					width: 25%;
					position: relative;
					overflow: hidden;
					float: left;
					padding: 0 11px 20px;
				}
					#active .staff_wrap li a{
						display: block;
						width: 100%;
						position: relative;
						overflow: hidden;
					}
					
					
		#active .top_wrap.sec04{
			padding: 70px 0 70px;
			text-align: center;
		}
			#active .top_wrap.sec04 a{
				display: inline-block;
				position: relative;
			}
			
			#active .top_wrap.sec04 .sec04_button{
				position: relative;
				display: inline-block;
				width: 230px;
				height: 40px;
				line-height: 36px;
				/* padding: .9em 4em; */
				background-color: #4f4f4f;
				border: 2px solid #4f4f4f;
				color: #fff;
				text-align: center;
				text-decoration: none;
				transition: all .3s;
				font-size: 15px;
			}
			#active .top_wrap.sec04 .sec04_button::after {
				position: absolute;
				top: 50%;
				right: 20px;
				content: '';
				margin-top: -4px;
				border: 5px solid transparent;
				border-top-width: 4px;
				border-bottom-width: 4px;
				border-left-color: #fff;
				transition: all .3s;
			}
			#active .top_wrap.sec04 a:hover .sec04_button {
				background-color: #fff;
				color: #4f4f4f;
			}
			#active .top_wrap.sec04 a:hover .sec04_button::after {
				border-left-color: #4f4f4f;
			}
			

#active a.hover_anime,
#active a.hover_anime .top_img::after,
#active a.hover_anime .top_img .figure img {
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
#active a.hover_anime{
	display: block;
	width: 100%;
	position: relative;
	overflow: hidden;
}
#active a.hover_anime .top_img {
    position: relative;
    text-align: center;
}
#active a.hover_anime .top_img::after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgba(231,225,211,.6);
    opacity: 0;
}
#active a.hover_anime .top_img .figure {
    overflow: hidden;
    text-align: left;
}
#active a.hover_anime .top_img .figure img {
    width: 100%;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #fafafa;
}

#active a.hover_anime .top_img p {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    display: inline-block;
    color: #505050;
    font-size: 22px !important;
    letter-spacing: 0.5em;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    -webkit-transition: margin 0.3s 0,opacity 0.3s 0;
    transition: margin 0.3s 0,opacity 0.3s 0;
    color: #fff;
}

#active a.hover_anime:hover .top_img .figure img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

#active a.hover_anime:hover .top_img::after {
    opacity: 1;
}
#active a.hover_anime.no_bg:hover .top_img::after {
    opacity: 0;
}

#active a.hover_anime:hover .top_img p {
    margin-top: 5px;
    opacity: 1;
    -webkit-transition: margin 0.3s 0.3s,opacity 0.3s 0.3s;
    transition: margin 0.3s 0.3s,opacity 0.3s 0.3s;
}

/*
}
*/

/*追加テキストの部分*/
#active section.text--box{
	width: 950px;
	margin: 0 auto 70px;
	padding: 0 10px 20px;
}

#active section.text--box p{
	margin: 0 0 20px;
	line-height: 1.5;
	font-size: 120%;
	color: #3a0e17;
}
#active section.text--box p:last-of-type{
	margin-bottom: 0;
}

#active section.text--box h3{
	margin: 40px 0 30px;
	font-size: 130%;
	font-weight: bold;
	line-height: 2;
	
	position: relative;
	background:  #FBE6D8;
	padding: 0.4em 0.5em 0.2em;
	border-left: solid 2.25em #E86712;
	text-indent: -2em;
	color: #3a0e17;
	border-bottom: solid 2px #E86712;
	clear: both;
}
#active section.text--box h3 span.text--white{
	color: #fff;
	margin-right: 1.5em;
}
#active section.text--box h3 span.mark{
	margin-left: -0.5em;
}
#active section.link--area p{
	font-size: 120%;
	display: block;
    border-left: solid 4px #E86712;
    margin: 15px 0 0;
    padding-left: 6px;
    padding-bottom: 1px;
	
}
#active section.link--area p a{
	text-decoration: underline;
	color: #3a0e17;
	font-weight: bold;
}
#active section.link--area p a:hover{
	color: #E86712;
	text-decoration: none;
}
#active section.link--area h3{
	margin: 60px 0 10px;
	font-size: 130%;
	font-weight: bold;
	line-height: 1.7;
	color: #E86712;
}

#active section div.autumn--image{
	width: 250px;
	height: auto;
	float: right;
	margin: 0 25px 40px 30px;
	
}