@charset "UTF-8";
/* トップページCSS */
/*　共通　*/
#slider_wrapper{
	width: 100%;
	background: url(../img/index_slider_01.jpg) top center;
	display: table;
}

#slider_message{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

#contents_box{
	overflow: hidden;
}

.color_green{
	color: #349800;
}
	
.color_orange{
	color: #aa6400;
}

/* スマホCSS */

@media only screen and (orientation : portrait) { /*縦向きの際に適用*/
	
	.dashed_box{
		border: #349800 dashed 0.16rem !important;
	}
	
	.dashed_box dl{
		border-bottom: #969696 dotted 0.16rem !important;
	}
	
}

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

/* スライダーCSSここから */
	.pc_menu_btn{
		display: none;
	}

	#slider_wrapper{
    	height: 25.6rem;
    	background-size: cover;
	}
	
	.message_img{
		width:20rem;
	}
	
/* スライダーCSSここまで */
	
	#contents_wrapper{
		width: 92.5%;
		margin: 2rem auto;
		overflow: hidden;
	}
	
	.box_text{
		text-align: center;
		margin: 0.5rem 0 0 0;
		font-size: 1.2rem;
		
	}
	
	.flow_box{ overflow: hidden; clear: both; }
	
	.f_left{ float: left; width: 49%; }
	
	.f_right{ float: right; width: 49%; }
	
	.s_f_left{ float: left; width: 48%; }
	
	.s_f_right{ float: right; width: 48%; }
	
	.ss_f_left{ float: left; width: 32%; }
	
	.m_t_2{ margin-top: 2%; }
	
	.m_t_4{ margin-top: 4%; }
	
	#buisiness_box_02{ width:49%; float: left; }
	
	#volunteer_box{ width: 49%; float: right; }
	
	#event_box, #blog_box{
		margin: 2% 0;
		overflow: hidden;
	}
	
	.outside_box, .b_outside_box{
		background-color: #e6fad2;
		border: #c2c2c2 solid 0.1rem;
		border-radius: 0.8rem;
		padding:0 0.6rem 0.6rem 0.6rem;
	}
	
	.b_outside_box{
		background-color: #fffacd !important;
	}	
	
	.dashed_box, .b_dashed_box{
		background-color: #fff;
		border: #349800 dashed 0.1rem;
		border-radius: 0 0 0.6rem 0.6rem;
		padding: 0.6rem;
		overflow: auto;
	}
	
	.b_dashed_box{
		border: #cc6500 dashed 0.1rem !important;
	}
	
	.dashed_box dl, .b_dashed_box dl{
		border-bottom: #969696 dotted 0.2rem;
	}
	
	.font_event{
		font-size: 1.2rem;
		margin: 0.6rem 0;
		text-align: center;
	}
	
	.color_green{
		color: #349800;
	}
	
	#info_access_box{
		width: 49%;
		overflow: hidden;
	}

}

/* PC CSS */
@media only screen and (min-width: 769px) {
	#slider_wrapper{
		width: 100%;
    	height: 512px;
		background: url(../img/index_slider_01.jpg) top center;
	}
	
	.message_img{
		width: 380px;
	}
	
	#contents_wrapper{
		width: 880px;
		margin: 2rem auto;
		overflow: hidden;
		position: relative;
		height: 1200px;
	}
	
	#contents_wrapper a{ display: inline-block; }
	
	 .type_b, .life_seafty, .product_info, .gallery_photo, .play_info, .facebook_icon, .gallery_photo_box, #available_box, .privacy_icon, .access_icon, #volunteer_box, #event_box, #blog_box, .top_msg, .recuruit_box{
		position: absolute;
	}
	
	/* position配置ここから */
		.life_seafty{ left: 296px; }
		
		.product_info{ top: 296px; }
		
		#event_box{ width:288px; right: 0; }
	
		#blog_box{ width:288px; top: 296px; right: 0; }
		
		.gallery_photo_box{ top: 592px; }
		
		.play_info{ top: 592px; left: 296px; }
		
		.facebook_icon{ top: 592px; left: 444px; }
		
		#volunteer_box{ top: 592px; right: 0; }
		
		#available_box{ top: 740px; }
		
		.privacy_icon{ top: 740px; left:296px; }
		
		.access_icon{ top: 740px; left: 444px; }
		
		.top_msg{ top: 888px; }
		
		.recuruit_box{ top: 888px; left: 296px; }
	/* position配置ここまで */
	
	.flow_box{ overflow: hidden; clear: both; }
	
	.b_outside_box{
		background-color: #fffacd !important;
	}
	
	.b_dashed_box{
		border: #cc6500 dashed 2px !important;
	}
	
	.outside_box, .b_outside_box{
		background-color: #e6fad2;
		border: #c2c2c2 solid 1px;
		border-radius: 16px;
		-ms-border-radius: 16px;
		padding:0 8px 8px 8px;
		height: 288px;
	}
	
	.dashed_box, .b_dashed_box{
		background-color: #fff;
		border: #349800 dashed 2px;
		border-radius: 0 0 12px 12px;
		-ms-border-radius: 0 0 12px 12px;
		padding: 16px;
		overflow: auto;
		height: 222px;
	}
	
	.dashed_box dl, .b_dashed_box dl{
		border-bottom: #969696 dotted 2px;
		padding: 4px 0;
	}
	
	.dashed_box dl:last-child{
		border-bottom: none;
		margin-bottom:14px;
	}
	
	.font_event{
		font-size: 1.8rem;
		margin: 20px 0;
		text-align: center;
	}
	
	.dashed_box dd{
		font-size: 1.2rem;
	}
		
}