@import "base.css";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1+Code:wght@400&family=Shippori+Mincho:wght@500;600;700;800&display=swap');



/*トップカルーセルバナー非表示*/
#banner-area{
	display: none !important;
}

/* 
------------------------------------------------------------ */
a {
	color:#333;
	text-decoration:underline;
	cursor:pointer;
	outline: none;
	-webkit-tap-highlight-color: transparent;
}

/*画像をウインドウサイズに合わせて可変*/
img{
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
	width /***/:auto;/*IE8のみ適用*/
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

body {
	color:#333;
	margin:0;
	padding:0;
	font-size:18px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	line-height:1.8;
	background-color:#fff;
	text-align:center;
	position:relative;
}

.en{
	font-family: "M PLUS 1 Code", monospace;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}

#main-wrapper{
	position:relative;
}

/* header 
--------------------------------------------*/
#header{
	height: 115px;
	display: flex;
	padding: 0 30px;
	gap: 0 20px;
	align-items: center;
}
#header .logo-icon{
	width: 50px;
}
#header .logo-icon a{
	display: block;
}
#header #navi{
	flex: 1;
	text-align: center;
}

.language #header{
	justify-content: space-between;
}
.language #header #navi{
	flex: inherit;
}

/**/
@media (min-width: 768px){
	#header #navi{
		display: flex;
		align-items: center;
		gap: 0 20px;
	}
	#header #navi > nav{
		flex: 1;
	}
	#header #navi > #utility{
		flex-shrink: 0;
	}
	.logo-icon span{
		display: none;
	}
}

#header #navi nav ul{
	display: flex;
	justify-content: center;
	font-size: 18px;
	letter-spacing: 0.1em;
}
#header #navi nav ul li{
	list-style: 1;
}
#header #navi nav ul li a{
	display: block;
	text-decoration: none;
	position: relative;
	padding: 0.5em 20px;
}

#header #navi nav ul li a::after{
	content: '';
	width: 1px;
	height: 1em;
	position: absolute;
	right: 0;
	top:1em;
	background-color: #bfbfbf;
}
#header #navi nav ul li:last-child a::after{
	display: none;
}

/*言語選択*/
.lang-switcher {
  position: relative;
  display: inline-block;
}

.lang-switcher-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  outline: none;
  /* <button>要素はグローバルな a{-webkit-tap-highlight-color:transparent;} の対象外のため、
     ここに明示的に指定しないとスマホ（特にAndroid Chrome）でタップ時に既定の半透明の青い
     ハイライトがボタン全体（「Language」「日本語」等の文字を含む）に重なって表示され、
     テキストが青くなったように見えてしまう。 */
  -webkit-tap-highlight-color: transparent;
  /* iOS Safari（15以降）は、color未指定の<button>要素に対してUser Agent側で
     システムカラー（-apple-system-blue）を強制的に適用してしまう既知の挙動がある。
     これは子要素（<span>等）へのcolor指定や、通常のCSS継承だけでは打ち消せず、
     button要素自身にcolorを明示指定しない限りOS側の青色が優先されてしまうため、
     ここで明示的に指定して回避する。 */
  color: #333;
}

.lang-switcher-icon {
  display: flex;
  align-items: center;
}

.lang-switcher-icon img {
  display: block;
  width: 18px;
}

.lang-switcher-divider {
  display: inline-block;
  width: 1px;
  height: 20px;
  margin: 0 10px;
  background-color: #bfbfbf;
}

/* 矢印(▾)*/
.lang-switcher-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  transition: transform .2s;
  margin-left: 5px;
}

.lang-switcher-btn[aria-expanded="true"] .lang-switcher-arrow {
  transform: rotate(180deg);
}

.lang-switcher-list {
  position: absolute;
  top: 100%;
  right: 0;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
  background: #fff;
  border: 1px solid #ccc;
  display: none;
  z-index: 10;
}

.lang-switcher-list.is-open {
  display: block;
}

.lang-switcher-list li {
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

.lang-switcher-list li:last-child {
  border-bottom: none;
}

.lang-switcher-list a,
.lang-switcher-list a:visited {
  display: block;
  padding: 8px 16px;
  text-decoration: none;
  /* color:inherit ではなく明示的に#333を指定する。
     （スマホ表示のナビ展開時に、リンクの既定色（訪問済みリンクの色など）が
     継承先で意図せず青系になってしまう環境があったための対策。:visitedも
     明示的に同じ色を指定し、どの状態でも確実に黒系のテキストにする。） */
  color: #333;
}

.lang-switcher-label{
	font-family: "M PLUS 1 Code", monospace;
	font-weight: 400;
}


/* footer
--------------------------------------------*/
#footer{
	background-color: #333;
	line-height: 1.2;
	font-size: 16px;
	color: #fff;
	letter-spacing: 0.1em;
	margin-top: 120px;
}
.footer-head{
	padding: 60px 0;
	text-align: center;
}
.footer-head strong{
	display: block;
	width: 300px;
	margin: 0 auto;
}
.footer-head strong a{
	display: block;
}
.footer-head p{
	font-size: 14px;
	line-height: 1.4;
	margin-top: 10px;
}

.footer-navi{
	display: flex;
	gap: 30px;
}
.footer-navi nav{
	width: 50%;
	display: flex;
	border-right: solid #616161 1px;
}
.footer-navi .contact-block{
	width: 32%;
	border-right: solid #616161 1px;
}
.footer-navi .sns-block{
	width: 15%;
}

/**/

.footer-navi ul.guide-list{
	width: 65%;
}
.footer-navi ul li{
	list-style: none;
}
.footer-navi ul li a{
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 8px 0;
}

.footer-navi ul li ul{
	display: flex;
	flex-wrap: wrap;
	padding-top: 10px;
}
.footer-navi ul li ul li{
	width: 50%;
	font-size: 14px;
}
.footer-navi ul li ul li a{
	padding: 12px 0 12px 25px;
	position: relative;
}
.footer-navi ul li ul li a::after{
	content: '';
	width: 14px;
	height: 1px;
	background-color: #fff;
	position: absolute;
	top:1.5em;
	left: 0;
}

/**/
.contact-head{
	text-align: center;
}
.contact-head strong{
	font-weight: 500;
}
.contact-head .tel{
	font-size: 30px;
	margin-top: 5px;
}
.contact-head a{
	text-decoration: none;
	color: #fff;
}

.contact-block .time-table{
	margin-top: 25px;
}
.contact-block .time-table table{
	width: 100%;
}
.contact-block .time-table th{
	text-align: center;
	vertical-align: middle;
	font-weight: 500;
	color: #fff;
	width: 120px;
	position: relative;
}
.contact-block .time-table th::after{
	content: '';
	width: 100%;
	height: 100%;
	background-color: #414141;
	border-radius: 6px;
	position: absolute;
	top:0;
	left: 0;
}
.contact-block .time-table th span{
	display: block;
	position: relative;
	z-index: 2;
}
.contact-block .time-table td{
	font-size: 14px;
	padding: 4px 10px;
}
.contact-block .time-table td.month{
	text-align: right;
}

/**/
.sns-block ul{
	display: flex;
	justify-content: center;
	gap: 20px;
	padding-top: 50px;
}
.sns-block strong{
	font-weight: 500;
	display: block;
	text-align: center;
}
.sns-block ul li{
	list-style: none;
	width: 43px;
}


/**/
.footer-utility{
	margin-top: 60px;
	border-bottom: solid #616161 1px;
	text-align: right;
}
.footer-utility ul li{
	list-style: none;
	display: inline-block;
}
.footer-utility ul li a{
	display: block;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	padding: 8px 15px;
}

address{
	display: block;
	font-size: 12px;
	text-align: center;
	counter-reset: #fff;
	padding: 30px 0;
}


/* ボタン 
--------------------------------------------*/
.btn-link{
	text-align: right;
	letter-spacing: 0.1em;
	line-height: 1.4;
	font-size: 16px;
}
.btn-link a,
.btn-link p{
	display: inline-block;
	text-decoration: none;
	padding: 12px 10px;	
	border-bottom: solid #bfbfbf 1px;
}
.btn-link a span,
.btn-link p span{
	display: block;
	background: url(../../images/arrow.png) right center no-repeat;
	background-size: 20px auto;
	padding-right: 40px;
}

/**/
.btn-link.white a,
.btn-link.white p{
	color: #fff;
	border-bottom: solid #fff 1px;
}
.btn-link.white a span,
.btn-link.white p span{
	background: url(../../images/arrow_w.png) right center no-repeat;
	background-size: 20px auto;
	padding-right: 40px;
}

/* コンテンツ
--------------------------------------------*/
/*タイトル*/
.title h2{
	text-align: left;
	font-weight: 500;
	font-size: 35px;
	letter-spacing: 0.25em;
	vertical-align: middle;
}
.title h2 span{
	font-size: 17px;
	color: #a8a8a8;
	display: inline-block;
	margin-top: 28px;
	letter-spacing: 0.05em;
}
.title h2 small{
	font-size: 0.6em;
	letter-spacing: 0.15em;
}


/*縦書きタイトル基本*/
.vertical-content{
	padding: 120px 0 50px 0;
	display: flex;
	gap: 28px;
	align-items: center;
}
.vertical-content .title{
	padding: 0 80px;
	line-height: 1.4;
	align-self: flex-start;
	display: flex;
	writing-mode: vertical-rl;
}
.vertical-content .title h2{
	writing-mode: vertical-rl;
}

.vertical-content .title ul{
	margin-top: 30px;
	padding-top: 25px;
	border-top: solid #bfbfbf 1px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.vertical-content .title ul li{
	list-style: none;
	text-align: center;
	padding: 13px 0;
}
.vertical-content .title ul li a{
	display: block;
}
.vertical-content .title ul li img{
	width: 31px;
}

/*横書きコンテンツ*/
.beside-content .title h2 span{
	display: block;
	line-height: 1.4;
}


/*イメージ付きコンテンツ*/
.imgcontent-area{
	display: flex;
	gap: 50px;
	padding: 100px 0;
	overflow: hidden;
}

.imgcontent-area.imgareaR{
	flex-direction: row-reverse;
}

.imgcontent-area .imgblock{
	width: 63%;
	border-radius: 0 80px 80px 0;
	overflow: hidden;
}
.imgcontent-area .imgblock img{
	width: 100%;
	height: auto;
}
.imgcontent-area.imgareaR .imgblock{
	border-radius: 80px 0 0 80px;
}

.no-radius{
	border-radius: 0 !important;
}

.imgcontent-area .txtblock{
	width: calc( 37% - ( 100% - 1200px )/2);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.imgcontent-area .txtblock .txtblock__inner{
	writing-mode: vertical-rl;
	text-align: left;
	padding-bottom: 60px;
}

.imgcontent-area .txtblock .txtblock__inner .txtbox{
	padding: 60px 20px 0 0;
	font-size: 16px;
	letter-spacing: 0.1em;
}


.imgcontent-area .txtblock .btn-link{
	text-align: center;
}



/*コンテンツナビ*/
.content-navi{
	width: 300px;
}
.content-navi ul li{
	list-style: none;
	line-height: 1.4;
	font-size: 20px;
	letter-spacing: 0.15em;
}
.content-navi ul li a{
	display: block;
	text-decoration: none;
	padding: 18px 10px;
	border-bottom: solid #bfbfbf 1px;
}
.content-navi ul li a span{
	display: block;
	background: url(../../images/arrow.png) right center no-repeat;
	background-size: 20px auto;
	padding-right: 30px;
}

.content-navi ul.sub-navi{
	margin-top: 28px;
}



/*お知らせタブ*/
.vertical-content__inner{
	flex: 1;
	padding-top: 60px;
}
.vertical-content__inner .btn-link{
	margin-top: 30px;
}

.info-tab ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0 0 0 10px;
  font-size: 16px;
  border-bottom: solid #bfbfbf 1px;
}

.info-tab ul li {
  cursor: pointer;
  padding: 8px 20px;
  margin-right: 8px;
  margin-bottom: -1px;
  border: 1px solid #ccc;
  border-radius: 4px 4px 0 0;
  background: #fff;
  counter-reset: #595959;
  transition: background-color .2s, color .2s;
}

.info-tab ul li:hover {
  background: #e6e6e6;
}

.info-tab ul li.active {
  background: #333;
  color: #fff;
  border-color: #333;
}

.info-tab-contents .info-list {
  display: none;
  padding-top: 30px;
  padding-left: 10px;
}

.info-tab-contents .info-list.active {
  display: block;
}


/*お知らせリスト*/
.info-list{
	font-size: 16px;
	line-height: 1.5;
}
.info-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.info-list li a {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 16px 8px;
  text-decoration: none;
  color: inherit;
}

.info-list .day {
  flex-shrink: 0;
  letter-spacing: 0.05em;
}

.info-list .cat {
  flex-shrink: 0;
  padding: 2px 10px;
  font-size: 0.9em;
  text-align: center;
  background: #eee;
  border-radius: 3px;
  width: 110px;
}

.info-list p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}




/* top
--------------------------------------------*/
/*メインスライド*/
.main-slide{
	position: relative;
	width: 100%;
	height: calc( 100vh - 115px );
	min-height: 600px;
}
.main-slide h1{
	position: absolute;
	width: 158px;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 10;
	left: 50%;
	top:0;
	margin-left: -79px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.main-slide h1 img{
	display: block;
	width: 80px;
}

/**/
.main-slide ul li{
	height: calc( 100vh - 115px );
	min-height: 600px;
	overflow: hidden;
}
.main-slide ul li img{
	display: block;
	width: 100%;
  height: 100%;
  object-fit: cover;
}


/*ご案内横イメージ*/
.top-img{
	position: absolute;
	top:105vh;
	right: 4%;
	z-index: -1;
	width: 55%;
	max-width: 1200px;
}


/*ショートカットバナースライド*/
#banner-area{
	padding: 80px 0 100px 0;
}
/* Slick初期化前のチラつき防止 */
.banner-slider {
  display: none;
}
.banner-slider.slick-initialized {
  display: block;
}

.banner-slider {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 左右チラ見せ用の余白。この余白分だけ隣のスライドが見える */
.banner-area-slider-wrapp {
  overflow: hidden; /* ラッパーの外にはみ出た部分を隠す */
  padding: 0 80px;  /* チラ見せ幅。数値は要調整 */
}

/* slick-listのoverflowをvisibleにして、外側のスライドをはみ出させる */
.banner-slider .slick-list {
  overflow: visible;
}

.banner-slider .slick-slide {
  outline: none;
}

.banner-slider .slick-slide > div {
  margin: 0 18px; /* スライド間の間隔調整(重なり防止) */
}

.banner-item .imgbox img {
  width: 100%;
  height: auto;
  display: block;
}

.banner-item a {
  display: block;
}

/**/
.banner-item{
	text-align: left;
	font-size: 16px;
	line-height: 1.6;
}
.banner-item a{
	display: block;
	text-decoration: none;
}
.banner-item .imgbox{
	border-radius: 40px;
	overflow: hidden;
}

.banner-item .txtbox h3{
	display: block;
	font-size: 20px;
	letter-spacing: 0.1em;
	font-weight: 500;
	text-decoration: none;
	padding: 20px 10px;
	border-bottom: solid #bfbfbf 1px;
}
.banner-item .txtbox h3 span{
	display: block;
	background: url(../../images/arrow.png) right center no-repeat;
	background-size: 20px auto;
	padding-right: 30px;
}
.banner-item .txtbox p{
	margin-top: 15px;
	padding: 0 10px;
}



/**/
.access-area{
	display: flex;
	gap: 80px;
	align-items: center;
	padding: 60px 0 120px 0;
}
.access-area .imgbox{
	width: 360px;
	overflow: hidden;
	border-radius: 180px;
}
.access-area .txtbox p{
	margin-top: 15px;
}
.access-area .txtbox .btn-link{
	margin-top: 50px;
	text-align: left;
}


/**/
.areainfo-area{
	border-radius: 80px;
	margin-bottom: 100px;
}
.areainfo-area a{
	display: block;
	text-decoration: none;
	background: url(../../images/guide_bg.jpg) center center no-repeat;
	background-size: cover;
	border-radius: 80px;
	overflow: hidden;
	padding: 120px 100px;
}
.areainfo-area .txtbox{
	width: 50%;
	color: #fff;
}
.areainfo-area .txtbox p{
	margin-top: 15px;
}
.areainfo-area .txtbox .btn-link{
	margin-top: 50px;
	text-align: left;
}


/* 下層ページ共通
--------------------------------------------*/
/*パンくず*/
.breadcrumb{
	padding: 0px 30px 10px 30px;
	text-align: right;
}
.breadcrumb ul{
	display: inline-flex;
	align-items: center;
	font-size: 13px;
	letter-spacing: 0.1em;
	color: #888;
}
.breadcrumb ul li{
	list-style: none;
	display: flex;
	align-items: center;
}
.breadcrumb ul li a{
	color: #888;
	text-decoration: none;
}
.breadcrumb ul li + li::before{
	content: '';
	display: inline-block;
	width: 10px;
	height: 20px;
	margin: 0 14px;
	background: url(../../images/crumb.png) center center no-repeat;
	background-size: 5px auto;
}


/*見出し（線あしらい）*/
.section-title{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	text-align: center;
	font-weight: 500;
	font-size: 35px;
	letter-spacing: 0.35em;
	line-height: 1.4;
}
.section-title::before,
.section-title::after{
	content: '';
	display: inline-block;
	width: 60px;
	height: 1px;
	background-color: #bfbfbf;
}


/*下層メインビジュアル*/
.page-mv{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 500px;
	padding-top: 10px;
}
.page-mv__head{

	flex-shrink: 0;
	padding: 0px 5% 40px 5%;
	width: 480px;
	
}
.page-mv__head .title{
	display: flex;
	justify-content: center;
}
.page-mv__head .title h2{
	writing-mode: vertical-rl;
	font-weight: 500;
}
.page-mv__head .content-navi{
	width: auto;
	margin-top: 60px;
	text-align: left;
}
.page-mv__img{
	position: relative;
	flex: 1;
	overflow: hidden;
	border-radius: 80px 0 0 80px;
	max-height: 700px;
}
.page-mv__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/*下層メインビジュアル キャプション（見出し・リード文・タブ）*/
.page-mv__caption{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	padding: 60px 70px 50px 70px;
	color: #fff;
	background: rgba(0, 0, 0, 0.6);
	display: table;
}
.page-mv__caption__inner{
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}
.page-mv__caption h1{
	display: inline-block;
	padding-bottom: 10px;
	border-bottom: solid #fff 2px;
	font-size: 33px;
	font-weight: 500;
	letter-spacing: 0.15em;
	line-height: 1.4;
}
.page-mv__caption .lead{
	margin-top: 50px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}

/*タブ状のページ内アンカーリンク*/
.anchor-nav{
	margin-top: 50px;
}
.anchor-nav ul{
	display: flex;
	flex-wrap: wrap;
	border-left: solid rgba(255,255,255,.6) 1px;
}
.anchor-nav ul li{
	list-style: none;
	border-right: solid rgba(255,255,255,.6) 1px;
}
.anchor-nav ul li a{
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 26px;
	color: #fff;
	text-decoration: none;
	font-size: 16px;
	letter-spacing: 0.1em;
}
.anchor-nav ul li a::after{
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-left: 10px;
	border-right: solid #fff 1px;
	border-bottom: solid #fff 1px;
	transform: rotate(45deg) translateY(-2px);
}


/*imgboxセクション*/
.imgbox-content{
	display: flex;
	align-items: center;
	gap: 60px;
	margin-top: 60px;
}
.imgbox-content__img{
	width: 48%;
	flex-shrink: 0;
	border-radius: 40px;
	overflow: hidden;
}
.imgbox-content__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.imgbox-content__txt{
	flex: 1;
	padding-top: 6px;
	font-size: 16px;
	line-height: 2.1;
	letter-spacing: 0.05em;
}
/*見出し＋下線（回向・祈願など、本文の先頭に見出しを置く場合に使用）*/
.imgbox-content__txt h3{
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0.1em;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: solid #ddd 1px;
}
.imgbox-content__txt p{
	line-height: 2.5;
}
.imgbox-content__txt p + p{
	margin-top: 0.6em;
}

/**/
.imgbox-content__txt.kokoroe-txt strong{
	font-size: 22px;
	letter-spacing: 0.1em;
	display: block;
	padding: 0 0 0 25px;
	font-weight: 400;
	line-height: 1.4;
	position: relative;
}
.imgbox-content__txt.kokoroe-txt strong::after{
	content: '';
	position: absolute;
	top:0.75em;
	left: 0;
	width: 15px;
	height: 3px;
	background-color: #aaa;
}
.imgbox-content__txt.kokoroe-txt p{
	line-height: 1.6;
	font-size: 16px;
	padding: 15px 0 35px 25px;
	color: #666;
}



/*画像左右反転*/
.imgbox-content.reverse{
	flex-direction: row-reverse;
}


/*・から始まる箇条書き／【】付きラベル（imgbox-contentの本文内などで使用）*/
.dot-list{
	margin-top: 20px;
}
.dot-list li{
	list-style: none;
	line-height: 1.8;
}
.label-title{
	margin-top: 30px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.label-title + p{
	margin-top: 6px;
}


/*丸形アウトラインボタン（詳しくみる／ダウンロードなど）*/
.pill-btn{
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	min-width: 300px;
	padding: 10px 34px;
	border: solid #ccc 1px;
	border-radius: 50px;
	text-decoration: none;
	color: #333;
	font-size: 16px;
	letter-spacing: 0.1em;
	background-color: #fff;
	transition: 0.3s ease-in-out;
}
.pill-btn .icon{
	flex-shrink: 0;
	position: relative;
	width: 18px;
	height: 18px;
}
.pill-btn .icon::before,
.pill-btn .icon::after{
	content: '';
	position: absolute;
	background-color: #333;
}
/*＋アイコン*/
.pill-btn.icon-plus .icon::before{
	top: 50%;
	left: 0;
	width: 100%;
	height: 1px;
	margin-top: -0.5px;
}
.pill-btn.icon-plus .icon::after{
	left: 50%;
	top: 0;
	width: 1px;
	height: 100%;
	margin-left: -0.5px;
}
/*ダウンロード*/
.icon-download{
	display: block;
}
.icon-download a{
	display: block;
	padding: 15px 34px;
}
.icon-download span{
	display: block;
	background: url(../../images/icon_download.png) right center no-repeat;
	background-size: 20px auto;
}



/*モーダル共通（詳しくみる／詳細ボタンなどで表示するポップアップ）*/
body.modal-open{
	overflow: hidden;
}
.modal-overlay{
	/* display:noneはトランジションできないため、opacity+visibilityで表示制御し
	   常にflexで中央配置（縦横中央）した状態を維持する */
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	inset: 0;
	z-index: 1000;
	padding: 60px 40px;
	background-color: rgba(0,0,0,.8);
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
.modal-overlay.active{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.modal-close{
	position: fixed;
	top: 34px;
	right: 40px;
	width: 80px;
	height: 80px;
	z-index: 1010;
	cursor: pointer;
}
.modal-close::before,
.modal-close::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60px;
	height: 1px;
	background-color: #fff;
}
.modal-close::before{
	transform: translate(-50%,-50%) rotate(45deg);
}
.modal-close::after{
	transform: translate(-50%,-50%) rotate(-45deg);
}

/*テキストモーダル（円融蔵展示室について、など）*/
.modal-text{
	width: 100%;
	max-width: 1200px;
	height: fit-content;
	max-height: 100%;
	overflow-y: auto;
	background-color: #fff;
	border-radius: 40px;
	padding: 70px 90px;

	text-align: left;
	/* flexで中央配置した際、コンテンツが縦に長くなっても上端が見切れないように */
	margin: auto;
}
.modal-text p{
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}
.modal-text p + p{
	margin-top: 1.6em;
}

/*詳細モーダル（収蔵品詳細）*/
.modal-detail{
	width: 100%;
	max-width: 1200px;
	height: fit-content;
	display: flex;
	align-items: center;
	gap: 70px;
	margin: auto;
}
.modal-detail__img{
	flex-shrink: 0;
	width: 46%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.modal-detail__img img{
	display: block;
	/*自由サイズの画像を配置しても崩れないよう最大幅・最大高さを指定して中央に収める*/
	max-width: 100%;
	max-height: 70vh;
	width: auto;
	height: auto;
	object-fit: contain;
}
.modal-detail__txt{
	flex: 1;
	color: #fff;

	text-align: left;
}
.modal-detail__txt h3{
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.modal-detail__txt .kana{
	margin-top: 8px;
	font-size: 13px;
	letter-spacing: 0.05em;
	color: #ccc;
}
.modal-detail__txt .spec{
	margin-top: 24px;
	font-size: 15px;
	line-height: 1.8;
	letter-spacing: 0.05em;
	color: #ddd;
}
.modal-detail__txt .desc{
	margin-top: 30px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}



/* ご案内トップ
--------------------------------------------*/


/*由緒*/
.guide-history{
	padding: 110px 0 90px 0;
}


/*コンテンツリンクバナー一覧*/
.contents-list{
	padding: 80px 0 100px 0;
}
.contents-list ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 60px 30px;
}
.contents-list ul li{
	list-style: none;
	width: calc((100% - 60px) / 3);
}
.contents-list ul li a{
	display: block;
	text-decoration: none;
	color: inherit;
}
.contents-list .imgbox{
	border-radius: 30px;
	overflow: hidden;
}
.contents-list .imgbox img{
	display: block;
	width: 100%;
	height: 270px;
	object-fit: cover;
}
.contents-list h3{
	margin-top: 24px;
	padding: 0 6px 18px 6px;
	border-bottom: solid #bfbfbf 1px;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.contents-list h3 span{
	display: block;
	background: url(../../images/arrow.png) right center no-repeat;
	background-size: 20px auto;
	padding-right: 36px;
}
.contents-list p{
	margin-top: 16px;
	padding: 0 6px;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.05em;
}


/*関連情報（アクセス／大原ガイド）*/
.guide-related{
	padding: 40px 0 0px 0;
}
.guide-related ul{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 60px;
}
.guide-related ul li{
	list-style: none;
	border-top: solid #bfbfbf 1px;
	border-bottom: solid #bfbfbf 1px;
	padding: 25px 0;
}
.guide-related ul li .btn-link{
	margin-top: 15px;
}
.guide-related ul li .btn-link p{
	border-bottom: none;
}
.guide-related ul li a{
	display: flex;
	align-items: center;
	gap: 40px;
	text-decoration: none;
	color: inherit;
}
.guide-related .imgbox{
	width: 180px;
	height: 180px;
	flex-shrink: 0;
	border-radius: 50%;
	overflow: hidden;
}
.guide-related .imgbox img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.guide-related .txtbox{
	flex: 1;
	padding-top: 1em;
}
.guide-related h3{
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.guide-related p{
	margin-top: 14px;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.05em;
}
.guide-related .btn-link{
	margin-top: 30px;
}


/* 拝観時間・料金
--------------------------------------------*/
/*参拝のご案内（表）*/
.info-annai{
	padding: 110px 0 90px 0;
}
.info-table{
	width: 80%;
	margin: 50px auto 0 auto;
	border-collapse: separate;
	border-spacing: 0 2px;
}
.info-table th{
	width: 300px;
	background-color: #eee;
	padding: 20px 20px;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-align: center;
	vertical-align: middle;
	border-right: solid #fff 2px;
}
.info-table td{
	background-color: #f4f4f4;
	padding: 20px 40px;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: 0.05em;
	text-align: left;
	vertical-align: middle;
}
.info-table td small{
	margin-left: 6px;
	font-size: 13px;
	color: #666;
}

.info-table td .time{
	display: flex;
}
.info-table td .time span{
	width: 100px;
}

/*御朱印ページ（/guide/goshuin/）
  各セクション（通常の御朱印／特別朱印／各霊場会の御朱印）とも、御朱印の画像スライダー（slick）と
  御朱印名・授与場所の表（既存の.info-table）を横に並べる。.reverseで左右を入れ替える。
  画像は縦長（768:1108）の枠の中に、切り抜かず全体が収まる形（object-fit: contain）で表示する。
  スライダーの初期化は common/js/scripts.js 側（.gs-slider）。*/
.gs-block{
	display: flex;
	align-items: center;
	gap: 60px;
	margin-top: 50px;
}
.gs-block.reverse{
	flex-direction: row-reverse;
}
.gs-slider-wrap{
	width: 34%;
	flex-shrink: 0;
}
.gs-block .info-table{
	flex: 1;
	width: auto;
	margin: 0;
}
.gs-block .info-table th{
	/* 「秘仏金色不動明王紺地金泥朱印」（14文字）が1行に収まる幅 */
	width: 330px;
}
.gs-block .info-table td{
	padding: 20px 28px;
}
.gs-slider{
	position: relative;
}
/* slick初期化前に全スライドが縦に並んで見えてしまうのを防ぐ */
.gs-slider:not(.slick-initialized) .gs-slide:not(:first-child){
	display: none;
}
.gs-slide__img{
	aspect-ratio: 768 / 1108;
	border-radius: 30px;
	overflow: hidden;
	background-color: #f4f4f4;
}
.gs-slide__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.gs-slide__cap{
	margin-top: 14px;
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	text-align: center;
}
/* 矢印は画像（768:1108）の縦中央に合わせる（margin-topの%はスライダーの幅基準なので、幅×1108/768÷2＝72.135%） */
.gs-slider .slick-arrow{
	top: 0;
	margin-top: calc(72.135% - 25px);
}
.gs-slider .slick-prev{
	left: -25px;
}
.gs-slider .slick-next{
	right: -25px;
}
.gs-slider.slick-dotted{
	margin-bottom: 40px;
}
.gs-slider .slick-dots{
	bottom: -34px;
}
.gs-slider .slick-dots li button:before{
	font-size: 16px;
}


/*参拝の心得*/
.info-kokoroe{
	padding: 80px 0 90px 0;
}


/*体験コースのご案内*/
.info-taiken{
	padding: 80px 0 110px 0;
}
.info-taiken .lead-text{
	margin-top: 40px;
	text-align: center;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}

/*体験コース　外枠ボックス*/
.experience-box{
	margin-top: 60px;
	padding: 50px;
	border: solid #ddd 1px;
	border-radius: 60px;
}
.experience-box__inner{
	display: flex;
	gap: 60px;
}
.experience-col{
	width: 50%;
}
.experience-col + .experience-col{
	padding-left: 60px;
	border-left: solid #ddd 1px;
}
.experience-col h3{
	text-align: center;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.1em;
}
.experience-col .ttl-sub{
	margin-top: 24px;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.experience-col .txt{
	margin-top: 14px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.experience-col .txt a{
	/* スマホでタップして電話をかけられるよう<a href="tel:...">にしているが、
	   見た目は文中の地の文のまま変えたくないため、リンクの既定の色・下線を打ち消す。 */
	color: inherit;
	text-decoration: none;
}
.experience-col .note-list{
	margin-top: 24px;
	font-size: 13px;
	line-height: 1.9;
	color: #666;
}

/*体験コース内の料金表*/
.course-table{
	width: 100%;
	margin-top: 24px;
	border-collapse: separate;
	border-spacing: 0 2px;
}
.course-table th{
	width: 170px;
	background-color: #eee;
	padding: 18px 16px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-align: left;
	vertical-align: middle;
	border-right: solid #fff 2px;
}
.course-table td{
	background-color: #f4f4f4;
	padding: 18px 16px;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	vertical-align: middle;
}
.course-table .note{
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: #666;
}

/*FAXでの申込み案内ボックス*/
.fax-box{
	margin-top: 50px;
	padding: 40px;
	background-color: #f6f6f6;
	border-radius: 40px;
	text-align: center;
	font-size: 15px;
	letter-spacing: 0.05em;
	font-size: 17px;
}
.fax-box .fax-num{
	margin: 14px 0;
	font-size: 40px;
	font-weight: 500;
	letter-spacing: 0.1em;
	background-color: #fff;
	display: inline-block;
	padding: 10px 15px 10px 30px;
	border-radius: 20px;
	line-height: 1.2;
}


/* 国宝と重文
--------------------------------------------*/
.treasure{
	padding: 100px 0 0 0;
}
.treasure + .treasure{
	padding-top: 130px;
	padding-bottom: 100px;
}

.treasure p.read{
	text-align: center;
	margin-top: 20px;
}

/*メインスライダー＋サムネイルスライダー*/
.treasure-slider{
	position: relative;
	margin-top: 50px;
}
.treasure-slider__main{
	position: relative;
	/* メイン画像エリアはブラウザ幅100%で表示（.content-innerの制約から外へはみ出す） */
	width: 100vw;
	margin-left: calc(50% - 50vw);
}
.treasure-item{
	/* slickがslide自身に.slick-slideを付与し.slick-initialized .slick-slideでdisplay:blockを強制するため!importantで上書き */
	display: flex !important;
	align-items: stretch;
	/* 画像サイズによってスライドの高さが変わらないよう高さを固定。
	   登録画像のサイズに関わらず必ず800pxになるよう、min-height／max-heightも
	   合わせて!important指定にして確実に固定しています（heightの指定一箇所だけに
	   頼らず、他の要因で上書きされにくいようにするため）。 */
	height: 800px !important;
	min-height: 800px !important;
	max-height: 800px !important;
}
.treasure-item__img{
	width: 50%;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #333;
	padding: 0;
	overflow: hidden;
	box-sizing: border-box;
}
.treasure-item__img img{
	display: block;
	width: 100%;
	height: 100%;
	/* どのサイズの画像でも黒背景エリアの中央に収まるように表示 */
	object-fit: contain;
	object-position: center;
}
.treasure-item__txt{
	width: 50%;
	flex-shrink: 0;
	background-color: #eee;
	padding: 70px 90px;
	box-sizing: border-box;
	overflow-y: auto;
}
.treasure-item__txt h3{
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.treasure-item__txt .kana{
	margin-top: 8px;
	font-size: 13px;
	letter-spacing: 0.05em;
	color: #888;
}
.treasure-item__txt .sub{
	margin-top: 24px;
	font-size: 16px;
	letter-spacing: 0.05em;
}
.treasure-item__txt .era{
	margin-top: 8px;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: #999;
}
.treasure-item__txt .desc{
	margin-top: 34px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.treasure-item__txt .desc p + p{
	margin-top: 0.4em;
}


/*サムネイルナビ
  ※以前はslickでスライダー化していたが、登録件数が少ない（slidesToShowの件数に満たない）場合に
    infinite:true + variableWidth:trueの組み合わせでslickが補完用の複製スライドを大量に生成し、
    ページ下部に意図しない余白や重複したサムネイルが表示されてしまう不具合があったため、
    スライダー化をやめてシンプルな折り返し横並び表示に変更している。
    クリックでのメイン画像切り替えは common/js/scripts.js 側でjQueryの通常のイベント処理として実装。*/
.treasure-slider__thumbs{
	margin-top: 20px;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.treasure-thumb{
	/* サムネイルは登録画像のサイズに関わらず幅120px・高さ100pxの固定サイズで
	   トリミング表示する（.treasure-thumb img側のobject-fit: coverと組み合わせ） */
	width: 120px;
	height: 100px;
	overflow: hidden;
	border-radius: 10px;
	cursor: pointer;
	opacity: .5;
	transition: opacity .3s ease-in-out;
}
.treasure-thumb img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.treasure-thumb.is-current{
	opacity: 1;
}


/* 境内MAP
--------------------------------------------*/
.ground-map{
	margin-top: 80px;
}

.ground-full-map{
	padding: 0;
}

.ground-full-map__inner .imgbox{
	background-color: #f2f2f2;
}
.ground-full-map__inner .imgbox__inner{
	width: 85%;
	min-width:1200px;
	margin:0 auto;
}

.ground-map-pdf{
	margin-top: -30px;
	text-align: center;
}
.btn-pdf{
	display: inline-block;
	margin: 0 8px;
}
.btn-pdf a{
	display: block;
	text-align: center;
	padding: 0 30px;
	color: #cf0000;
	text-decoration: none;
	background-color: #fff;
	border: solid #cf0000 1px;
	border-radius: 60px;
	line-height: 1.4;
}
.btn-pdf a span{
	display: block;
	background: url(../../images/adobe_pdf.png) right center no-repeat;
	background-size: 25px auto;
	padding: 15px 40px 15px 0;
}
.btn-pdf a span i{
	font-style: normal;
	font-size: 0.6em;
}

/*マップ横の一覧（アンカーリンク）*/
.spot-nav{
	padding-top: 40px;
}
.spot-nav ul{
	display: flex;
	flex-wrap: wrap;
	gap:15px
}
.spot-nav ul li{
	width: calc(( 100% - 30px )/3);
	list-style: none;
}
.spot-nav ul li a{
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 18px 18px;
	text-decoration: none;
	color: inherit;
	font-size: 18px;
	letter-spacing: 0.05em;
	border-radius: 10px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.spot-nav .num{
	flex-shrink: 0;
	width: 20px;
	font-size: 15px;
	color: #999;
	text-align: center;
}
.spot-nav .label{
	flex: 1;
}
.spot-nav .arrow{
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	margin-right: 4px;
	border-right: solid #333 1px;
	border-bottom: solid #333 1px;
	transform: rotate(45deg);
}

/*詳細一覧（画像＋テキスト）*/
.spot-detail{
	margin-top: 110px;
}
.spot-detail li{
	list-style: none;
	display: flex;
	align-items: center;
	gap: 60px;
	padding: 50px 0;
	border-bottom: solid #ddd 1px;
}
.spot-detail li:first-child{
	border-top: solid #ddd 1px;
}
.spot-detail__img{
	width: 500px;
	flex-shrink: 0;
	border-radius: 30px;
	overflow: hidden;
}
.spot-detail__img img{
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}
.spot-detail__txt{
	flex: 1;
}
.spot-detail__txt h3{
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.spot-detail__txt h3 .num{
	margin-right: 14px;
	font-weight: 400;
	color: #999;
}
.spot-detail__txt p{
	margin-top: 16px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}


/* 円融蔵展示室
--------------------------------------------*/
.showroom-lead{
	padding: 110px 0 0 0;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}
/* .content-innerに text-align:left が指定されているため、センター揃えは.content-inner側に指定して上書き */
.showroom-lead .content-inner{
	text-align: center;
}
.showroom-lead .pill-btn{
	margin-top: 50px;
}
.showroom-lead__btn{
	text-align: center;
}

.showroom-note{
	margin-top: 70px;
	padding-top: 60px;
	border-top: solid #ddd 1px;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}
.showroom-note .content-inner{
	text-align: center;
}

/*収蔵品カード一覧*/
.showroom-list{
	margin-top: 60px;
	padding-bottom: 110px;
}
.showroom-list.bg{
	margin-top: 0;
	padding: 100px 0 110px 0;
	background-color: #f4f4f4;
}
.showroom-list ul{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
}
.showroom-list ul li{
	list-style: none;
}
.showroom-list ul li a{
	display: block;
	text-decoration: none;
	border-radius: 30px;
	overflow: hidden;
	background-color: #333;
}
.showroom-card__img img{
	display: block;
	width: 100%;
	height: 260px;
	object-fit: cover;
}
.showroom-card__txt{
	padding: 26px 30px 40px 30px;
	color: #fff;
	text-align: center;
}
.showroom-card__txt h3{
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.showroom-card__txt .kana{
	margin-top: 6px;
	font-size: 12px;
	letter-spacing: 0.05em;
	color: #ccc;
}
.showroom-card__txt .pill-btn{
	margin-top: 26px;
	min-width: inherit;
	padding: 5px 26px;
	gap: 20px;
	background-color: transparent;
	border-color: rgba(255,255,255,.6);
	color: #fff;
}
.showroom-card__txt .pill-btn .icon::before,
.showroom-card__txt .pill-btn .icon::after{
	background-color: #fff;
}


.archive-list{
	margin-top: 60px;
}

/*お知らせ（トップページと共通の縦書きタイトル＋リストを使用）*/
.showroom-news{
	padding-bottom: 60px;
}


/* 回向・祈願
--------------------------------------------*/
.ekou-content{
	padding: 100px 0 0 0;
}
.ekou-content .imgbox-content{
	margin-top: 90px;
}
.ekou-content .imgbox-content:first-child{
	margin-top: 60px;
}

/*申込書ダウンロードボックス*/
.download-box{
	margin-top: 100px;
	padding: 60px 70px;
	background-color: #f4f4f4;
	border-radius: 50px;
}
.download-box h2{
	text-align: center;
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0.15em;
}
.download-box__inner{
	display: flex;
	align-items: center;
	gap: 60px;
	margin-top: 40px;
}
.download-box__txt{
	flex: 1;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.download-box__btns{
	flex-shrink: 0;
	width: 600px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.download-box__btns .pill-btn{
	width: 100%;
	min-width: inherit;
	font-size: 20px;
	padding: 20px 34px;
}

.ekou-news{
	padding: 90px 0 60px 0;
}


/* 写真ギャラリー
--------------------------------------------*/
/*メインビジュアル（タイトル＋スライダー）*/
.gallery-mv{
	display: flex;
	align-items: center;
	padding-top: 10px;
}
.gallery-mv__head{
	flex-shrink: 0;
	width: 480px;
	padding: 0 5% 40px 5%;
}
.gallery-mv__head .title{
	display: flex;
	justify-content: center;
}
.gallery-mv__head .title h2{
	writing-mode: vertical-rl;
	font-weight: 500;
}
.gallery-mv__body{
	flex: 1;
	min-width: 0;
}
.gallery-mv__body .gallery-nav{
	margin-top: 30px;
}

/*季節セクション（春夏秋冬・左右交互）*/
.gallery-season{
	display: flex;
	align-items: center;
	gap: 28px;
	/* タイトル＋スライダーをブラウザ幅100%で表示（.content-innerの制約から外へはみ出す） */
	width: 100vw;
	margin-left: calc(50% - 50vw);
	padding: 90px 0;
}
.gallery-season.reverse{
	flex-direction: row-reverse;
}
.gallery-season__head{
	flex-shrink: 0;
	padding: 0 80px;
	line-height: 1.4;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.gallery-season__head .title h2{
	writing-mode: vertical-rl;
	font-weight: 500;
	font-size: 50px;
}
.gallery-season__head .gallery-nav{
	margin-top: 40px;
}
.gallery-season__slider{
	flex: 1;
	min-width: 0;
}

/*矢印ボタン（スライダー下部・タイトル下に配置する独自ナビ）*/
.gallery-nav{
	display: flex;
	gap: 12px;
}
.gallery-nav-btn{
	flex-shrink: 0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #fff;
	border: solid #ccc 1px;
	position: relative;
	cursor: pointer;
	text-indent: -9999px;
	overflow: hidden;
}
.gallery-nav-btn::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	margin: -5px 0 0 -5px;
	border-top: solid #333 1px;
	border-right: solid #333 1px;
}
.gallery-prev::after{
	margin-left: -2px;
	transform: rotate(-135deg);
}
.gallery-next::after{
	transform: rotate(45deg);
}

/*画像スライダー（縦横比の異なる画像を高さ固定・幅可変で配置）*/
.gallery-slider{
	position: relative;
	border-radius: 80px 0 0 80px;
	overflow: hidden;
}
.gallery-slider.reverse{
	border-radius: 0 80px 80px 0;
}

.gallery-slider .slick-track{
	display: flex;
	align-items: stretch;
}
.gallery-slider .slick-slide{
	margin-right: 3px;
}
.gallery-item{
	position: relative;
	/* 画像の縦横比に関わらず高さを固定し、幅は画像の比率に応じて可変にする。
	   slick.js本体のCSS（slick.min.css）が同じ要素に付与する.slick-slideクラスに
	   height:100%（親要素いっぱいに広がる指定）が定義されており、こちらの
	   .gallery-item{height:460px}とは詳細度が同点（クラス1つ）になるため、
	   スタイルシートの読み込み順（slick側が後に読み込まれると逆転してしまう）次第で
	   意図しない方が勝ってしまうことがあった（親要素の高さが画像の縦横比に応じて
	   バラバラに伸び、結果的に画像が原寸大に近い、異常に大きいサイズで表示される
	   不具合の原因）。詳細度を上げて明示的に上書きし、確実にこちらを優先させる。 */
	height: 460px !important;
	cursor: pointer;
}
.gallery-item img{
	display: block;
	height: 100%;
	width: auto;
	max-width: none;
}
/* トップページの写真ギャラリー（.imgcontent-area .imgblock の中にスライダーが
   配置されている）では、.imgcontent-area .imgblock img{width:100%;height:auto;}
   （493行目付近）の方がセレクタの詳細度（クラス2つ＋要素）が高く、上の
   .gallery-item img（クラス1つ＋要素）よりも優先されてしまい、画像が原寸大の
   まま表示され、高さ固定・幅可変の設計が effectively 無効になっていた。
   （写真ごとに縦横比が違うため、結果的にサムネイルの高さが画像ごとにバラバラに
   見える不具合の原因はこれでした。写真ギャラリー一覧ページ側は元々
   .imgcontent-area の外にあるため影響を受けていません。）
   詳細度を上げて明示的に上書きし、高さ固定・幅可変を確実に効かせる。 */
.imgcontent-area .imgblock .gallery-item img{
	width: auto;
	height: 100%;
	max-width: none;
}
.gallery-item::before{
	content: '';
	position: absolute;
	inset: 0;
	background-color: rgba(0,0,0,0);
	transition: background-color 0.3s ease-in-out;
}
.gallery-item:hover::before{
	/*ロールオーバーで暗くする*/
	background-color: rgba(0,0,0,.4);
}
.gallery-item__icon{
	position: absolute;
	right: 30px;
	bottom: 30px;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-color: rgba(255,255,255,.15);
	border: solid rgba(255,255,255,.8) 1px;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}
.gallery-item:hover .gallery-item__icon{
	/*ロールオーバーでプラスアイコンを表示*/
	opacity: 1;
}
.gallery-item__icon::before,
.gallery-item__icon::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: #fff;
}
.gallery-item__icon::before{
	width: 20px;
	height: 1px;
	margin: 0 0 0 -10px;
}
.gallery-item__icon::after{
	width: 1px;
	height: 20px;
	margin: -10px 0 0 0;
}

/*ライトボックス（画像モーダル）*/
.gallery-modal{
	width: 100%;
	max-width: 1400px;
	margin: auto;
}
.gallery-modal__img{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.gallery-modal__img img{
	display: block;
	max-width: 100%;
	max-height: 75vh;
	width: auto;
	height: auto;
	object-fit: contain;
}
.gallery-modal__foot{
	text-align: center;
	gap: 30px;
	margin-top: 24px;
	color: #fff;
}
.gallery-modal__caption{
	font-size: 14px;
	letter-spacing: 0.05em;
}
.gallery-modal__meta{
	text-align: center;
}
.gallery-modal__no{
	font-size: 13px;
	letter-spacing: 0.1em;
}
.gallery-modal__season{
	writing-mode: vertical-rl;
	font-size: 13px;
	letter-spacing: 0.15em;
	color: #ccc;
}


/* 年間行事
--------------------------------------------*/
/*矢印アイコン（サイドナビ・各行の詳細リンクで共通使用）*/
.link-arrow{
	display: inline-block;
	width: 20px;
	height: 15px;
	flex-shrink: 0;
	background: url(../../images/arrow.png) center / contain no-repeat;
}

/*タグバッジ（回向／展示／祈願／行事、要お申込）*/
.event-tag{
	display: inline-block;
	padding: 6px 16px;
	background-color: #f4f4f4;
	color: #666;
	font-size: 13px;
	letter-spacing: 0.05em;
	text-align: center;
	white-space: nowrap;
	min-width: 110px;
}
.event-tag.require{
	background-color: #fff;
	border: solid #c07a33 1px;
	color: #c07a33;
}

/*時間／場所などのラベル付き情報*/
.event-meta{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 26px;
	margin-top: 18px;
}
.event-meta .meta-item{
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: #555;
}
.event-meta .meta-item .label{
	flex-shrink: 0;
	padding: 5px 14px;
	border: solid #ccc 1px;
	font-size: 12px;
	color: #888;
}

/*メインビジュアル（タイトル＋サイドナビ＋コンテンツ）*/
.side-nav-mv{
	display: flex;
	align-items: flex-start;
	padding-top: 10px;
	gap: 0 60px;
}
.side-nav-mv__head{
	flex-shrink: 0;
	width: 320px;
	padding: 0 40px 40px 0;
}
.side-nav-mv__head .title{
	display: flex;
	justify-content: center;
}
.side-nav-mv__head .title h2{
	writing-mode: vertical-rl;
	font-weight: 500;
}
.side-nav-mv__body{
	flex: 1;
	min-width: 0;
}
.event-page-title{
	font-size: 30px;
	font-weight: 500;
	letter-spacing: 0.1em;
}

/*サイドナビ（今月の予定／来月の予定／年間の行事／特別行事）*/
.side-list{
	margin-top: 90px;
}
.side-list ul{
	border-top: solid #ddd 1px;
}
.side-list li{
	list-style: none;
	border-bottom: solid #ddd 1px;
}
.side-list li a{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 22px 6px;
	text-decoration: none;
	color: #333;
	font-size: 16px;
	letter-spacing: 0.05em;
	transition: opacity 0.3s ease-in-out;
}
.side-list li a:hover{
	opacity: 0.6;
}
.side-list li.active a{
	color: #c07a33;
}

/*月タブ（アンカーリンクで各月へジャンプ）*/
/* ページスクロール時、ウィンドウ上部に追従して固定表示されるようにする
   （sticky。ヘッダーはposition:relativeで固定表示ではないため、top:0でウィンドウの
   最上部に張り付く。背景色を指定しないと透過（base.cssのリセット）のため、固定表示時に
   下のコンテンツが透けて見えてしまうのを防ぐため background-color を明示している） */
.event-month-tabs{
	display: flex;
	flex-wrap: wrap;
	border-top: solid #ddd 1px;
	padding: 22px 0;
	position: sticky;
	top: 0;
	z-index: 5;
	background-color: #fff;
}
.event-month-tabs li{
	list-style: none;
	padding: 0 22px;
	border-right: solid #ddd 1px;
}
.event-month-tabs li:last-child{
	border-right: none;
}
.event-month-tabs li a{
	display: block;
	text-decoration: none;
	color: #333;
	font-size: 16px;
	letter-spacing: 0.05em;
	transition: opacity 0.3s ease-in-out;
}
.event-month-tabs li a:hover{
	opacity: 0.6;
}

/*年間の行事一覧（月ごとにグループ化した表形式リスト）*/
.event-list{
	margin-top: 0;
}
.event-month-group{
	display: flex;
	align-items: stretch;
	border-top: solid #ddd 1px;
}
.event-month-group__label{
	flex-shrink: 0;
	width: 135px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #f4f4f4;
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.event-month-group__items{
	flex: 1;
	min-width: 0;
}
.event-row{
	display: flex;
	align-items: center;
	gap: 30px;
	padding: 40px 30px;
	border-bottom: solid #eee 1px;
	position: relative;
	text-decoration: none;
	color: inherit;
}
.event-row__date{
	flex-shrink: 0;
	width: 110px;
	font-size: 17px;
	letter-spacing: 0.05em;
}
.event-row__tags{
	flex-shrink: 0;
	width: 110px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.event-row__body{
	flex: 1;
	min-width: 0;
	padding-left: 30px;
	padding-right: 60px;
	border-left: solid #ddd 1px;
}
.event-row__body h3{
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.event-row .link-arrow{
	position: absolute;
	right: 30px;
	top: 50%;
	margin-top: -9px;
}

.event-month-group__empty.no-txt{
	padding: 40px 30px;
	color: #aaa;
	font-family: -apple-system, BlinkMacSystemFont , '游ゴシック体' , 'Yu Gothic', YuGothic , 'ヒラギノ角ゴ ProN' , 'Hiragino Kaku Gothic ProN' , 'メイリオ', 'Meiryo', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

/*今月／来月の予定（カード形式リスト）*/
.event-card-list{
	margin-top: 40px;
	border-top: solid #ddd 1px;
}
.event-card{
	display: flex;
	align-items: center;
	gap: 50px;
	padding: 50px 0px;
	border-bottom: solid #eee 1px;
	position: relative;
	text-decoration: none;
	color: inherit;
}
.event-card:hover{
	background-color: #f7f7f7;
}
.event-card .link-arrow{
	right: 30px !important;
}
.event-card__img{
	flex-shrink: 0;
	width: 400px;
	height: 270px;
	border-radius: 40px;
	overflow: hidden;
}
.event-card__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.event-card__img.noimg{
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #eee;
}
.event-card__img.noimg img{
	width: 90px;
	height: 90px;
	object-fit: contain;
	opacity: 0.4;
}
.event-card__body{
	flex: 1;
	min-width: 0;
	padding-right: 60px;
}
.event-card__body h3{
	margin-top: 22px;
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.event-card__body .date{
	margin-top: 16px;
	font-size: 15px;
	letter-spacing: 0.05em;
	color: #666;
}
.event-card .link-arrow{
	position: absolute;
	right: 0;
	bottom: 50px;
}

.event-card__body .event-tag.require{
	margin-left: 10px;
}


/* アクセス
--------------------------------------------*/
/*基本情報（住所・電話・参拝時間）*/
.access-info{
	margin-top: 40px;
	padding: 50px 60px;
	background-color: #f4f4f4;
	border-radius: 40px;
	display: flex;
	align-items: center;
	gap: 60px;
}
.access-info__block{
	flex: 1;
}
.access-info__block .name{
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.access-info__block .addr{
	margin-top: 14px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.access-info__block .tel{
	margin-top: 6px;
	font-size: 15px;
	letter-spacing: 0.05em;
}
.access-info__block .tel a{
	/* スマホでタップして電話をかけられるよう<a href="tel:...">にしているが、
	   見た目は今までのテキスト表示のまま変えたくないため、リンクの既定の
	   色・下線は打ち消して周囲の文字と同じ見た目にする。 */
	color: inherit;
	text-decoration: none;
}
.access-info__hours{
	flex-shrink: 0;
}

/*地図（Googleマップ埋め込み）*/
.access-map{
	margin-top: 100px;
}
.access-map iframe{
	display: block;
	width: 100%;
	height: 620px;
	border: solid #ddd 1px;
}



/* お知らせ（一覧・詳細）
--------------------------------------------*/
/*見出し（タイトル＋英字キャプション＋下線／一覧見出し・関連記事見出しで共通利用）*/
.list-heading{
	display: flex;
	align-items: baseline;
	gap: 22px;
	padding-bottom: 20px;
}
.list-heading h2{
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.list-heading .en{
	font-size: 13px;
	letter-spacing: 0.16em;
	color: #999;
}

/*お知らせ一覧（お知らせ一覧ページ／関連記事で共通利用）*/
.news-list{
	border-top: solid #ddd 1px;
}
.news-row{
	position: relative;
	display: flex;
	align-items: center;
	gap: 28px;
	padding: 26px 44px 26px 4px;
	border-bottom: solid #ddd 1px;
	text-decoration: none;
	color: inherit;
	transition: opacity .3s ease-in-out;
}
.news-row:hover{
	opacity: 0.6;
}
.news-row__date{
	flex-shrink: 0;
	width: 100px;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: #888;
}
.news-row .event-tag{
	flex-shrink: 0;
}
.news-row__title{
	flex: 1;
	min-width: 0;
	font-size: 16px;
	letter-spacing: 0.03em;
	color: #333;
}
.news-row .link-arrow{
	position: absolute;
	right: 4px;
	top: 50%;
	margin-top: -9px;
}

/*お知らせ詳細*/
.news-detail__meta{
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: 14px;
	color: #888;
	letter-spacing: 0.05em;
}
/* 年間行事詳細の日付（例：2026年2月28日）は一覧の日付（例：2026.02.28）より長くなるため、
   一覧用の固定幅100pxではなく、日付の文字数に応じた可変幅で折り返さないようにする */
.news-detail__meta .news-row__date{
	width: auto;
	white-space: nowrap;
}
.news-detail__title{
	margin-top: 22px;
	padding-bottom: 30px;
	border-bottom: solid #ddd 1px;
	font-size: 28px;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.6;
}
.news-detail__body{
	margin-top: 40px;
	font-size: 16px;
	line-height: 2.1;
	letter-spacing: 0.03em;
	color: #444;
	/* 本文（WordPress側で自由入力）に、URLなど半角スペースを含まない長い文字列が
	   入力された場合でも、その文字列でページ全体の横幅が広がらないよう、
	   ページ幅に収まるところで改行させる（スマホ表示での横スクロール防止）。 */
	overflow-wrap: break-word;
	word-break: break-word;
}
.news-detail__body p + p{
	margin-top: 1.6em;
}
/* WordPressの「整形済みテキスト」ブロック（<pre class="wp-block-preformatted">）対策。
   <pre>要素は既定で white-space:pre になっており、上のoverflow-wrap/word-breakを
   指定していても、改行コードが入っていない限り折り返しが一切行われず、
   スマホ表示で本文がページ幅を超えてはみ出す原因になっていた。
   pre-wrapに変更することで、入力されている改行・スペースの見た目はそのまま保ちつつ、
   通常の文章と同様にページ幅で折り返されるようにする。 */
.news-detail__body pre{
	white-space: pre-wrap;
	overflow-wrap: break-word;
	word-break: break-word;
}
.news-detail__body ul li{
	margin-left: 1.25em;
}
.news-detail__photo{
	margin-top: 40px;
}
.news-detail__photo img{
	display: block;
	width: 100%;
	height: auto;
	border-radius: 4px;
}
.news-detail__photo.is-placeholder{
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 3 / 2;
	background-color: #e4e4e4;
	color: #999;
	font-size: 15px;
	letter-spacing: 0.1em;
	border-radius: 4px;
}
.news-detail__related{
	margin-top: 90px;
}

/*一覧へ戻る*/
.back-to-list{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 16px;
	margin-top: 60px;
	font-size: 15px;
	letter-spacing: 0.05em;
	color: #333;
	text-decoration: none;
	transition: opacity .3s ease-in-out;
}
.back-to-list:hover{
	opacity: 0.6;
}






/* ============================================================
   アクセスページ専用の追加スタイル
   既存の common/css は変更せず、.ax- プレフィックスで独立させています
   ============================================================ */
.ax-app{
	--c-car: #c9863c;
	--c-train: #3f6fb0;
	--c-bus: #4f9d6e;
	--c-walk: #9a9a9a;
	--c-dest: #33312e;
	margin-top: 50px;
}
/* 凡例 */
.ax-legend{
	display: flex;
	flex-wrap: wrap;
	gap: 12px 26px;
	margin-top: 20px;
}
.ax-legend .item{
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 15px;
	letter-spacing: 0.03em;
	color: #666;
}
.ax-legend .dot{
	width: 13px;
	height: 13px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* 出発地セレクター（タブ切替はラジオボタン＋CSSのみで実装、JS不使用） */
.ax-tab-radio{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}
.ax-method-select{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 14px;
	margin-top: 26px;
	text-align: center;
	line-height: 1.3;
}
.ax-method-select i{
	font-style: normal;
	font-size: 0.7em;
}
.ax-method-btn{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 28px 10px;
	background-color: #f4f4f4;
	border: 2px solid transparent;
	border-radius: 22px;
	cursor: pointer;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.05em;
	color: #444;
	transition: background-color .2s, color .2s, border-color .2s, transform .15s;
	-webkit-tap-highlight-color: transparent;
}
.ax-method-btn svg{
	width: 38px;
	height: 38px;
	color: #777;
	transition: color .2s;
}
.ax-method-btn:hover{
	background-color: #ebebe9;
	transform: translateY(-2px);
}
#ax-tab-car:checked ~ .ax-method-select label[for="ax-tab-car"],
#ax-tab-kyotoeki:checked ~ .ax-method-select label[for="ax-tab-kyotoeki"],
#ax-tab-shiga:checked ~ .ax-method-select label[for="ax-tab-shiga"],
#ax-tab-hankyu:checked ~ .ax-method-select label[for="ax-tab-hankyu"],
#ax-tab-keihan:checked ~ .ax-method-select label[for="ax-tab-keihan"]{
	background-color: #2f2e2c;
	border-color: #2f2e2c;
	color: #fff;
}
#ax-tab-car:checked ~ .ax-method-select label[for="ax-tab-car"] svg,
#ax-tab-kyotoeki:checked ~ .ax-method-select label[for="ax-tab-kyotoeki"] svg,
#ax-tab-shiga:checked ~ .ax-method-select label[for="ax-tab-shiga"] svg,
#ax-tab-hankyu:checked ~ .ax-method-select label[for="ax-tab-hankyu"] svg,
#ax-tab-keihan:checked ~ .ax-method-select label[for="ax-tab-keihan"] svg{
	color: #fff;
}
.ax-tab-radio:focus-visible ~ .ax-method-select label{
	outline: none;
}
#ax-tab-car:focus-visible ~ .ax-method-select label[for="ax-tab-car"],
#ax-tab-kyotoeki:focus-visible ~ .ax-method-select label[for="ax-tab-kyotoeki"],
#ax-tab-shiga:focus-visible ~ .ax-method-select label[for="ax-tab-shiga"],
#ax-tab-hankyu:focus-visible ~ .ax-method-select label[for="ax-tab-hankyu"],
#ax-tab-keihan:focus-visible ~ .ax-method-select label[for="ax-tab-keihan"]{
	outline: solid 2px #9a6b26;
	outline-offset: 2px;
}

/* パネル（対応するラジオがチェックされている時だけ表示） */
.ax-panel{
	display: none;
	margin-top: 30px;
	padding: 44px 36px;
	background-color: #fff;
	border: 1px solid #ececec;
	border-radius: 28px;
	box-shadow: 0 10px 34px rgba(30,25,15,.05);
}
#ax-tab-car:checked ~ #ax-panels .ax-panel[data-key="car"],
#ax-tab-kyotoeki:checked ~ #ax-panels .ax-panel[data-key="kyotoeki"],
#ax-tab-shiga:checked ~ #ax-panels .ax-panel[data-key="shiga"],
#ax-tab-hankyu:checked ~ #ax-panels .ax-panel[data-key="hankyu"],
#ax-tab-keihan:checked ~ #ax-panels .ax-panel[data-key="keihan"]{
	display: block;
	animation: ax-fade-in .4s ease;
}
@keyframes ax-fade-in{
	from{ opacity: 0; transform: translateY(10px); }
	to{ opacity: 1; transform: translateY(0); }
}
.ax-panel__title{
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.08em;
	display: flex;
	align-items: center;
	gap: 14px;
}
.ax-panel__title svg{
	width: 32px;
	height: 32px;
	color: #777;
}

/* ルート見出し */
.ax-route-head{
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin-top: 34px;
}
.ax-route-head:first-of-type{
	margin-top: 30px;
}
.ax-route-caption{
	font-size: 18px;
	color: #777;
	letter-spacing: 0.03em;
	margin-top: 25px;
	position: relative;
	padding-left: 15px;
}
.ax-route-caption::after{
	content: '';
	position: absolute;
	left: 0;
	top:0;
	display: block;
	background-color: #333;
	width: 3px;
	height: 100%;
}
.ax-route-total{
	display: flex;
	align-items: baseline;
	gap: 6px;
	font-size: 16px;
	color: #333;
	background-color: #f4f0e6;
	padding: 6px 20px;
	border-radius: 20px;
	white-space: nowrap;
}
.ax-route-total .num{
	font-size: 22px;
	font-weight: 600;
	color: #9a6b26;
}

/* 経路ダイアグラム */
.ax-diagram{
	display: flex;
	align-items: stretch;
	width: 100%;
	margin-top: 20px;
	padding: 24px 18px;
	background-color: #f8f7f4;
	border-radius: 22px;
	overflow-x: auto;
}
.ax-point{
	flex: 0 0 auto;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 14px 14px;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.02em;
	white-space: nowrap;
	background-color: #fff;
	border: 1.5px solid #ccc;
	border-radius: 10px;
	color: #333;
}
.ax-point.station{
	border-color: var(--c-train);
	background-color: #eef3fb;
	border-radius: 8px;
}
.ax-point.busstop{
	border-color: var(--c-bus);
	background-color: #eef8f1;
	border-radius: 999px;
	padding: 14px 18px;
}
.ax-point.dest{
	background-color: var(--c-dest);
	border-color: var(--c-dest);
	color: #fff;
}
.ax-leg{
	flex: 1 1 0;
	min-width: 56px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	gap: 2px 8px;
	padding: 0 4px;
}
.ax-leg .badge{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2px 6px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1.4;
	white-space: normal;
	text-align: center;
	color: #555;
	min-height: 2.5em;
}
.ax-leg .badge > span{
	flex: 0 1 auto;
	min-width: 0;
	line-height: 1.3;
}
.ax-leg .badge svg{
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	margin-top: 1px;
}
.ax-leg .min{
	font-size: 15px;
	color: #999;
	white-space: nowrap;
	text-align: center;
}
.ax-leg .bar{
	position: relative;
	width: 100%;
	height: 4px;
	border-radius: 3px;
}
.ax-leg .bar::after{
	content: '';
	position: absolute;
	top: 50%;
	right: -2px;
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 7px solid currentColor;
	transform: translateY(-50%);
}

.ax-note{
	margin-top: 50px;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.02em;
	color: #666;
	background-color: #f9f9f9;
	border-radius: 10px;
	padding: 15px;
}


/* ============================================================
   大原ガイドページ専用の追加スタイル
   ============================================================ */
.rk-area{
	padding: 110px 0 90px 0;
}
.rk-map{
	padding: 80px 0 90px 0;
}
.rk-map__note{
	margin: 30px auto 0 auto;
	max-width: 720px;
	font-size: 14px;
	line-height: 1.9;
	letter-spacing: 0.05em;
	color: #777;
	text-align: center;
}
.rk-spot{
	padding: 80px 0 90px 0;
}
/* 主なスポット：info-tableと同じ幅・同じ配色の2列（左：種別・番号・名称／右：説明文） */
.rk-spot-list{
	width: 80%;
	margin: 50px auto 0 auto;
	list-style: none;
}
.rk-spot-list li{
	display: flex;
	margin-top: 2px;
}
.rk-spot-list__head{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 18px;
	width: 300px;
	flex-shrink: 0;
	padding: 28px 20px 28px 50px;
	background-color: #eee;
	border-right: solid #fff 2px;
	text-align: left;
}
.rk-spot-list__head .num{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #aaa;
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 0;
}
.rk-spot-list__name .rk-spot-tag{
	margin-bottom: 0;
	font-size: 14px;
	line-height: 1.2;
}
.rk-spot-list__name h3{
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.2;
}
.rk-spot-list__desc{
	flex: 1;
	display: flex;
	align-items: center;
	padding: 28px 40px;
	background-color: #f4f4f4;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: 0.05em;
	text-align: left;
}
/* 主なスポット下の外部リンク（大原観光保勝会）：案内文＋大きめのボタンを中央寄せ */
.rk-spot__cta{
	margin-top: 70px;
	text-align: center;
}
.rk-spot__cta-text{
	margin-bottom: 24px;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.rk-spot__cta .pill-btn{
	position: relative;
	justify-content: center;
	min-width: 480px;
	padding: 20px 76px;
	font-size: 18px;
}
/* 矢印は右端に絶対配置（文字は左右の余白が等しくなるよう中央） */
.pill-btn.icon-arrow span{
	display: block;
}
.pill-btn.icon-arrow::after{
	content: '';
	position: absolute;
	top: 50%;
	right: 30px;
	width: 22px;
	height: 22px;
	margin-top: -11px;
	background: url(../../images/arrow.png) center center no-repeat;
	background-size: contain;
}
.rk-spot-tag{
	display: block;
	margin-bottom: 6px;
	font-size: 15px;
	color: #999;
	letter-spacing: 0.05em;
}

.rk-route{
	padding: 80px 0 90px 0;
}
.rk-route-list{
	width: 80%;
	margin: 50px auto 0 auto;
	list-style: none;
	border-top: solid #ddd 1px;
}
.rk-route-list li{
	display: flex;
	align-items: flex-start;
	gap: 26px;
	padding: 24px 4px;
	border-bottom: solid #ddd 1px;
}

.rk-route-list .num{
	flex-shrink: 0;
	width: 26px;
	padding-top: 3px;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: #999;
	text-align: center;
}
.rk-route-list .text{
	flex: 1;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.rk-route-list .text strong{
	font-weight: 500;
	letter-spacing: 0.05em;
}

.rk-season{
	padding: 80px 0 90px 0;
}

.rk-access{
	padding: 80px 0 110px 0;
}
.rk-access__note{
	margin-top: 20px;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: #666;
	text-align: center;
}



/* ============================================================
   ご利用規約／プライバシーポリシー 共通の追加スタイル
   ============================================================ */
.section-mt{
	margin-top: 110px;
}

.lg-hero{
	padding: 110px 0 60px 0;
	text-align: center;
}
.lg-hero h1{
	display: inline-block;
	padding-bottom: 14px;
	border-bottom: solid #333 2px;
	font-size: 30px;
	font-weight: 500;
	letter-spacing: 0.15em;
}
.lg-hero .en{
	display: block;
	margin-top: 14px;
	font-size: 13px;
	letter-spacing: 0.2em;
	color: #999;
}

.lg-body{
	padding: 0 0 110px 0;
}
.lg-lead{
	padding-bottom: 40px;
	margin-bottom: 50px;
	border-bottom: solid #ddd 1px;
	font-size: 15px;
	line-height: 2.1;
	letter-spacing: 0.05em;
}
.lg-body .label-title{
	font-size: 17px;
}
.lg-body .label-title:first-child{
	margin-top: 0;
}
.lg-body p{
	font-size: 15px;
	line-height: 2.1;
	letter-spacing: 0.05em;
}
.lg-body .dot-list{
	margin-top: 14px;
}
.lg-body .dot-list li{
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.05em;
}
.lg-contact{
	margin-top: 16px;
	padding: 30px 40px;
	background-color: #f4f4f4;
	border-radius: 20px;
	font-size: 15px;
	line-height: 2;
	letter-spacing: 0.05em;
}

/*緊急のお知らせバナー（管理画面「緊急情報」で表示ON/OFF・内容を設定）
  トップページ：メインビジュアルに重ねて表示（.emergency-notice--overlay）
  下層ページ：グローバルメニューとパンくずの間に表示（.emergency-notice--static）*/
.emergency-notice__inner{
	width: 94%;
	max-width: 1520px;
	margin: 0 auto;
}
.emergency-notice__bar{
	display: flex;
	align-items: stretch;
	border-radius: 999px;
	overflow: hidden;
	background-color: #fbe0c5;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}
.emergency-notice__label{
	flex-shrink: 0;
	display: flex;
	align-items: center;
	padding: 16px 34px;
	background-color: #c94a00;
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 0.08em;
	white-space: nowrap;
}
.emergency-notice__text{
	display: flex;
	align-items: center;
	flex: 1;
	margin: 0;
	padding: 16px 34px;
	color: #c94a00;
	font-size: 15px;
	letter-spacing: 0.04em;
	text-decoration: none;
}
a.emergency-notice__text:hover{
	text-decoration: underline;
}
.emergency-notice--overlay{
	position: absolute;
	left: 0;
	right: 0;
	top: 40px;
	z-index: 20;
}
.emergency-notice--static{
	padding: 24px 0;
}


/* 多言語ページ（.language）専用スタイル
   英語／韓国語／中国語ページ（/en, /ko, /cn）で、日本語サイトと同じ
   共通クラスを流用しつつ、横書き言語に合わせて調整が必要な箇所のみ上書きする。
   日本語サイトのレイアウトをそのまま流用できる箇所（ヘッダー・フッター等）は
   このセクションに記述がない＝上書き不要ということ。
--------------------------------------------*/

.language .page-mv .page-mv__img{
	border-radius: 0;
}

.language .title span{
	display: block;
	margin-top: 0.5em;
	margin-left: 0 !important;
}

@media screen and (min-width: 768px){
	.language .imgcontent-area .imgblock{
		width: 50%;
	}
	.language .imgcontent-area .imgblock img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.language .imgcontent-area .txtblock{
		width: calc( 50% - ( 100% - 1200px )/2);
	}

}

@media (min-width: 768px){

	/* 由緒などのイメージ付きコンテンツ：日本語版は縦書きだが、
	   英語などの横書き言語では縦書きにすると読めないため横書きに変更 */

	.language .imgcontent-area .txtblock{
		align-items: flex-start;
		justify-content: center;
		padding: 20px 0;
	}
	.language .imgcontent-area .txtblock .txtblock__inner{
		writing-mode: horizontal-tb;
		text-align: left;
		padding-bottom: 0;
	}
	.language .imgcontent-area .txtblock .txtblock__inner .txtbox{
		padding: 30px 60px 0 0;
		font-size: 16px;
		line-height: 2;
	}

	/* 見出し（.title h2）と本文の間の余白調整（横書き用） */
	.language .imgcontent-area .txtblock .title h2{
		line-height: 1.4;
	}
}

/* 「ご案内」ページ内リンクなど、日本語サイトの他ページへ戻る導線に付ける注記 */
.language .lang-note{
	margin-top: 20px;
	font-size: 13px;
	line-height: 1.8;
	color: #888;
}
.language .lang-note a{
	color: #888;
}

/* セクション共通の余白（見出し＋本文をひとまとまりにするための汎用ラッパー） */
.language .lang-section{
	padding: 90px 0;
}
.language .lang-section + .lang-section{
	border-top: solid #eee 1px;
}
.language .lang-section .section-title + p,
.language .lang-section .section-title + ul{
	margin-top: 40px;
}
.language .lang-section-lead{
	max-width: 800px;
	margin: 40px auto 0 auto;
	text-align: center;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.05em;
}

/* 境内ハイライト：グリッド表示（1ページ構成のため、専用の簡易グリッドを新設） */
.language .lang-grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px 30px;
	margin-top: 50px;
}
.language .lang-grid li{
	list-style: none;
}
.language .lang-grid__img{
	border-radius: 20px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}
.language .lang-grid__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.language .lang-grid figcaption{
	margin-top: 16px;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.03em;
}
.language .lang-grid figcaption strong{
	display: block;
	font-weight: 500;
	margin-bottom: 4px;
}

/* 御朱印など、グリッドの下に添える補足ブロック */
.language .lang-subblock{
	margin-top: 60px;
	padding-top: 50px;
	border-top: solid #ddd 1px;
}
.language .lang-subblock h3{
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.language .lang-subblock p{
	margin-top: 14px;
	font-size: 15px;
	line-height: 1.9;
	letter-spacing: 0.03em;
}

/* 参拝の心得：本文の中の注意事項リスト */
.language .etiquette-list{
	margin-top: 20px;
}
.language .etiquette-list li{
	list-style: none;
	padding-left: 1.4em;
	position: relative;
	line-height: 1.9;
}
.language .etiquette-list li::before{
	content: '・';
	position: absolute;
	left: 0;
}
.language .etiquette-list li + li{
	margin-top: 10px;
}

/* Discover more：日本語サイトへの導線 */
.language .lang-cta{
	margin-top: 40px;
	text-align: center;
}
