/*
Theme Name: Sohsha Boen Theme
Description: 播磨国総社 総社墓苑 専用テーマ
Version: 1.0
*/


/* =============================================================================
   animation
============================================================================= */
.zoom-target {
  opacity: 0;
  transform: scale(0.8);
  transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}

.zoom-target.active {
  opacity: 1;
  transform: scale(1);
}

.show2 {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease-out;
}

.show2.active {
  opacity: 1;
  transform: translateY(0);
}




.boen_header{
	background:#111;
	padding:32px 20px;
	text-align:center;
}

.boen_header h1{
	margin:0;
	color:#fff;
	font-size:32px;
	line-height:1.5;
	letter-spacing:.12em;
	font-family:"Yu Mincho","YuMincho",serif;
	font-weight:400;
}

@media(max-width:768px){

.boen_header{
	padding:24px 16px;
}

.boen_header h1{
	font-size:24px;
}

}



/****************************************
    共通
****************************************/

body{
	margin:0;
	background:#f7f5ef;
	color:#333;
	font-family:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN",sans-serif;
	line-height:2;
}

.boen_inner{
	width:min(92%,1000px);
	margin:auto;
}

.boen_section{
	padding:90px 0;
}

.boen_section:nth-child(even){
	background:#fff;
}


/****************************************
    タイトル
****************************************/

.boen_hero{
	padding:80px 0 70px;
	text-align:center;
}

.boen_hero h1{
	margin:0 0 50px;
	font-size:42px;
	font-family:"Yu Mincho","YuMincho",serif;
	line-height:1.5;
	color:#3b3128;
}

.boen_section h2{
	margin:0 0 45px;
	text-align:center;
	font-size:32px;
	font-family:"Yu Mincho","YuMincho",serif;
	color:#3b3128;
	position:relative;
}

.boen_section h2:after{
	content:"";
	display:block;
	width:60px;
	height:2px;
	background:#9a7a45;
	margin:20px auto 0;
}

.boen_section h3{
	margin:0 0 15px;
	font-size:24px;
	font-family:"Yu Mincho","YuMincho",serif;
}


/****************************************
    本文
****************************************/

.boen_section p{
	font-size:17px;
	line-height:2.2;
}

.boen_section p + p{
	margin-top:20px;
}


/****************************************
    画像
****************************************/

.boen_main_img img,
.boen_img img,
.boen_map_img img{
	display:block;
	width:100%;
	height:auto;
	margin:auto;
}

.boen_main_img{
	max-width:1000px;
	margin:0 auto;
}

.boen_img{
	max-width:900px;
	margin:45px auto;
}

.boen_map_img{
	max-width:700px;
	margin:40px auto;
}


/****************************************
    料金
****************************************/

.boen_price_box{
	background:#fff;
	padding:35px;
	margin-top:35px;
	border-left:6px solid #a68453;
	box-shadow:0 5px 18px rgba(0,0,0,.08);
}

.boen_price{
	margin:10px 0 25px;
	font-size:34px !important;
	font-weight:bold;
	color:#b60000;
}


/****************************************
    問い合わせ
****************************************/

.boen_contact_wrap{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:35px;
	margin-top:40px;
}

.boen_contact_box{
	background:#fff;
	padding:30px;
	box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.boen_contact_box h3{
	font-size:20px;
	margin-bottom:20px;
}

.boen_contact_box a{
	color:#9b1b1b;
}


/****************************************
    GoogleMap
****************************************/

.boen_googlemap{
	margin-top:45px;
}

.boen_googlemap iframe{
	display:block;
	width:100%;
	height:500px;
	border:0;
}


/****************************************
    SP
****************************************/

@media(max-width:768px){

.boen_section{
	padding:60px 0;
}

.boen_hero{
	padding:50px 0;
}

.boen_hero h1{
	font-size:30px;
}

.boen_section h2{
	font-size:25px;
	margin-bottom:35px;
}

.boen_section h3{
	font-size:20px;
}

.boen_section p{
	font-size:15px;
	line-height:2;
}

.boen_price{
	font-size:28px !important;
}

.boen_contact_wrap{
	grid-template-columns:1fr;
}

.boen_googlemap iframe{
	height:320px;
}

}


/****************************************
    Footer
****************************************/

.boen_footer{
	background:#111;
	padding:30px 20px;
	text-align:center;
}

.boen_footer p{
	margin:0;
	color:#fff;
	font-size:15px;
	line-height:1.8;
	letter-spacing:.08em;
}

.boen_footer small{
	display:block;
	margin-top:6px;
	font-size:13px;
	opacity:.7;
}

@media(max-width:768px){

.boen_footer{
	padding:24px 16px;
}

.boen_footer p{
	font-size:14px;
}

.boen_footer small{
	font-size:12px;
}

}