@charset "utf-8";
/* CSS Document */
@media all{

#ceremony #firstview h2,
#chapel #firstview h2,
#shinden #firstview h2{
	position: absolute;
	width: 100%;
	top: 58%;
	left: 0;
	text-align: center;
	font-size: 1.66rem;
	color: #fff;
}
#ceremony #firstview h2::before,
#chapel #firstview h2::before,
#shinden #firstview h2::before{
	position: absolute;
	content: "";
	top: -94px;
	left: calc(50% - 200px);
	width: 400px;
	height: 80px;
}
#ceremony #firstview h2::before{
	background: url("../images/ol_ceremony_wht.png") no-repeat;
	background-size: contain;
}
#chapel #firstview h2::before{
	background: url("../chapel/images/ol_chapel_wht.png") no-repeat;
	background-size: contain;
}
#shinden #firstview h2::before{
	background: url("../shinden/images/ol_shrine_wht.png") no-repeat;
	background-size: contain;
}
	
#ceremony #descript{
		padding: 120px 0;
	}
	#descript p{
		font-size: 1.16rem;
		text-align: center;
	}
	
	#place{
		padding: 0 0 40px;
	}
	#place article{
		width: 100%;
		position: relative;
		padding: 30px 0 80px;
	}
	#place article .imgbox{
		width: 83%;
		height: 50vw;
		position: relative;
	}
	#place article#shinden .imgbox{
		margin-left: 17%;
	}
	#place article#shinden .imgbox img{
		object-fit: cover;
		object-position: center;
		width: 100%;
		height: 100%;
	}
	#place article#chapel .imgbox::before,
	#place article#shinden .imgbox::before{
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	#place article#chapel .imgbox::before{
		background: rgba(207,225,243,.5);
		top: -30px;
		left: 30px;
	}
	#place article#shinden .imgbox::before{
		background: rgba(171,106,174,.3);
		top: -30px;
		right: 30px;
	}
	#place article .txtbox{
		position: absolute;
		width: 290px;
		padding: 30px;
		box-sizing: border-box;
		z-index: 1;
		text-align: center;
	}
	#place article#chapel .txtbox{
		top: 50%;
		right: 10%;
	}
	#place article#shinden .txtbox{
		top: 50%;
		left: 10%;
	}
	#place article .txtbox h3{
		font-size: 1.16rem;
		color: #a57a43;
	}
	#place article .txtbox .h3sub{
		font-size: 2.16rem;
		color: #a57a43;
	}
	#place article .txtbox .text{
		font-size: 1.16rem;
		margin-bottom: 2em;
	}

	/*下層*/
	#chapel #descript,
	#shinden #descript{
		padding: 80px 0;
	}
	
	#images{
		padding: 0 0 40px;
	}
	#images .imagebox{
		width: calc(100% - 40px);
		max-width: 1110px;
		margin: 0 auto;
	}
	#images .imagebox li{
		list-style: none;
	}
	
}

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

#ceremony #firstview{
	background: url("../images/ceremony_main_2405.jpg") no-repeat;
	background-size: 250%;
	background-position: top 58% left 47%;
}
#ceremony #firstview h2,
#chapel #firstview h2,
#shinden #firstview h2{
	top: 52%;
	font-size: 1.16rem;
}
#ceremony #firstview h2::before,
#chapel #firstview h2::before,
#shinden #firstview h2::before{
	top: -66px;
	left: calc(50% - 160px);
	width: 320px;
	height: 64px;
}
	
#ceremony #descript{
		padding: 60px 0 0;
	}
	
	#place article{
		padding: 30px 0 0;
	}
	#place article .imgbox{
		width: 100%;
		height: auto;
	}
	#place article#shinden .imgbox{
		margin-left: 0;
	}
	#place article#chapel .imgbox::before{
		background: rgba(207,225,243,.5);
		top: -175px;
		left: 0;
	}
	#place article#shinden .imgbox::before{
		background: rgba(171,106,174,.3);
		top: -175px;
		right: 0;
	}
	#place article .txtbox{
		position: static;
		width: 100%;
		padding: 30px;
	}
	#place article .nextpage{
		background: #fff;
	}
	
/*下層*/
#chapel #firstview{
	background: url("../chapel/images/chapel_main_2405.jpg") no-repeat;
	background-size: 400%;
	background-position: bottom 30% left 48%;
}
	
	#chapel #descript p,
	#shinden #descript p{
		font-size: 1rem;
	}
	
#shinden #firstview{
	background: url("../shinden/images/shinden_main_sp_2405.jpg") no-repeat;
	background-size: cover;
	background-position: bottom 50% left 50%;
}
	
}

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

#ceremony #firstview{
	background: url("../images/ceremony_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: top 30% left 50%;
}
	
	#place article .txtbox{
		background: #fff;
	}
	
/*下層*/
#chapel #firstview{
	background: url("../chapel/images/chapel_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: bottom 25% left 50%;
}
	
#shinden #firstview{
	background: url("../shinden/images/shinden_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: bottom 50% left 50%;
}
	
}

@media screen and (min-width: 1025px), print{
	
#ceremony #firstview{
	background: url("../images/ceremony_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: top 30% left 50%;
}
	
	#place article .txtbox{
		background: #fff;
	}
	
/*下層*/
#chapel #firstview{
	background: url("../chapel/images/chapel_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: bottom 25% left 50%;
}
	
#shinden #firstview{
	background: url("../shinden/images/shinden_main_2405.jpg") no-repeat;
	background-size: cover;
	background-position: bottom 50% left 50%;
}
	
}