@charset "utf-8";
/* CSS Document */
@media all{
	
/* ファーストビュー */
	#firstimage{
		width: 100%;
		height: 56vw;
	}
	#firstimage .text{
		position: absolute;
		width: 100%;
		top: 28vw;
		left: 0;
		transform: translateY(-55%);
		-webkit-transform: translateY(-55%);
		-ms-transform: translateY(-55%);
		color: #fff;
		text-align: center;
		letter-spacing: .1em;
	}
	#firstimage .text h2{
		font-size: 1.8rem;
		filter: drop-shadow(0 0 5px rgba(0,0,0,.6));
	}
	#firstimage .text p{
		font-size: 3.6rem;
		line-height: 1.5;
		margin-bottom: 0.5em;
		filter: drop-shadow(0 0 5px rgba(0,0,0,.6));
	}
	#firstimage .fvimage{
		width: 100%;
		height: 100%;
	}
	
/* description */
	#description{
		padding: 80px 0 120px;
	}
	#description .dscrptn{
		font-size: 1.3rem;
		line-height: 1.5em;
		text-align: center;
		margin-bottom: 80px
	}
	#description .box{
		width: calc(100% - 40px);
		max-width: 1000px;
		margin: 0 auto;
		display: flex;
	}
	#description .box .image{
		width: 50%;
	}
	#description .box .textbox{
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	#description .box .textbox .title{
		width: 360px;
		font-size: 2rem;
		margin-bottom: 1em;
	}
	#description .box .textbox .text{
		width: 360px;
		font-size: 1.3rem;
	}
	
/* RECEPTION HALL */
	#hall{
		padding: 0 0 120px;
	}
	#hall h3{
		width: 340px;
		margin: 0 auto 20px;
	}
	#hall .title{
		font-size: 1.4rem;
		margin-bottom: 1em;
		text-align: center;
	}
	#hall article{
		width: 100%;
		padding-bottom: 120px;
	}
	#hall article .image{
		width: 100%;
		margin-bottom: 40px;
	}
	#hall article .box{
		width: calc(100% - 80px);
		max-width: 1000px;
		margin: 0 auto;
		display: flex;
	}
	#hall article .box .slickslide{
		width: 50%;
	}
	#hall article .box .textbox{
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	#hall article .box .textbox h4{
		width: 360px;
		font-size: 2rem;
		margin-bottom: 0.3em;
	}
	#hall article .box .textbox .en{
		width: 360px;
		margin-bottom: 20px;
	}
	#hall article .box .textbox .en img{
		height: 10px;
		width: auto;
	}
	#hall article .box .textbox .text{
		width: 360px;
		font-size: 1.3rem;
		line-height: 1.5;
	}
	
}

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

/* ファーストビュー */
	#firstimage{
	height: 100vh;
}
	#firstimage .fvimage img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#firstimage .text{
		top: 50vh;
	}
	#firstimage .text p{
		font-size: 2rem;
	}
	#firstimage .text h2{
		font-size: 1.2rem;
	}
	
/* description */
	#description{
		padding: 40px 0 60px;
	}
	#description .dscrptn{
		font-size: 1rem;
		margin-bottom: 40px
	}
	#description .box{
		flex-direction: column;
	}
	#description .box .image{
		width: 100%;
		margin-bottom: 40px;
	}
	#description .box .textbox{
		width: 100%;
	}
	#description .box .textbox .title{
		width: 100%;
		font-size: 1rem;
		text-align: center;
	}
	#description .box .textbox .text{
		width: 100%;
		font-size: 1rem;
	}
	
/* RECEPTION HALL */
	#hall{
		padding: 0 0 60px;
	}
	#hall h3{
		width: 100%;
		max-width:260px;
		margin: 0 auto 5px;
	}
	#hall .title{
		font-size: 1.1rem;
		margin-bottom: 1em;
	}
	#hall article{
		padding-bottom: 60px;
	}
	#hall article .image{
		margin-bottom: 20px;
	}
	#hall article .box{
		flex-direction: column;
	}
	#hall article .box .slickslide{
		width: 100%;
		margin-bottom: 50px;
	}
	#hall article .box .textbox{
		width: 100%;
	}
	#hall article .box .textbox h4{
		width: 100%;
		font-size: 1rem;
		text-align: center;
		margin-bottom: 0;
	}
	#hall article .box .textbox .en{
		width: 100%;
		text-align: center;
		margin-bottom: 10px
	}
	#hall article .box .textbox .en.line2{
		padding-top: 5px;
	}
	#hall article .box .textbox .en.line2 img{
		height: 27px;
	}
	#hall article .box .textbox .text{
		width: 100%;
		font-size: 1rem;
	}
	
}

@media screen and (min-width: 568px) and (max-width: 1024px){

/* description */
	#description .box .textbox .title,
	#description .box .textbox .text{
		width: calc(100% - 40px);
		max-width: 360px;
	}
	
/* RECEPTION HALL */
	#hall article .box .textbox h4,
	#hall article .box .textbox .en,
	#hall article .box .textbox .text{
		width: calc(100% - 40px);
		max-width: 360px;
	}
	#hall article .box .textbox .en.line2 img{
		width: 100%;
	}
	
}

@media screen and (min-width: 1025px), print{

}