@charset "utf-8";

/**********************************************
　共通
**********************************************/
html {scroll-behavior: smooth; scroll-padding-top: 80px;}

body {
	word-wrap: break-word;
	line-height: 1.6;
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	/*font-family: "SF Pro", "Helvetica Neue", sans-serif;*/
	font-weight: 500;
	letter-spacing: 0;
	color: #222;
}

#wrapper {position: relative;}

.desktop {display: block;}
.smartphone {display: none;}

img {width: 100%; height: auto;}

.container {max-width: 1160px; margin: 0 auto; padding: 0 30px;}
ib {display: inline-block;}
.dropshadow {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}


@media screen and (max-width: 991px){
	.container {padding-left: 20px; padding-right: 20px;}
	html {scroll-padding-top: 60px;}
}
@media screen and (max-width: 768px){
	.desktop {display: none;}
	.smartphone {display: block;}
}


.events-none {pointer-events: none; color: #bbb!important;}
.font-eb {font-family: 'EB Garamond', serif;}


/*****　レイアウト　*****/
.tcenter {text-align: center;}
.tleft {text-align: left;}
.tright {text-align: right;}
.mt0 {margin-top: 0;}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mt2em {margin-top: 2em;}
.mt3em {margin-top: 3em;}
.mt4em {margin-top: 4em;}

@media screen and (max-width: 768px){
	.mt2em {margin-top: 1em;}
	.mt3em {margin-top: 1.75em;}
	.mt4em {margin-top: 2.5em;}
	.mt10sp {margin-top: 10px;}
	.mt20sp {margin-top: 20px;}
	.mt30sp {margin-top: 30px;}
	.mt40sp {margin-top: 40px;}
	.mb10sp {margin-bottom: 10px;}
	.mb20sp {margin-bottom: 20px;}
	.mb30sp {margin-bottom: 30px;}
	.mb40sp {margin-bottom: 40px;}
}

/*****　ブロック　*****/
.row-ar {display: flex; flex-wrap: wrap; justify-content: center; position: relative; background-color: #fff;}

.col-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.col-10 {-ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%;}
.col-9 {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-8 {-ms-flex: 0 0 66.666666%; flex: 0 0 66.666666%; max-width: 66.666666%;}
.col-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.col-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-5 {-ms-flex: 0 0 41.666666%; flex: 0 0 41.666666%; max-width: 41.666666%;}
.col-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-2 {-ms-flex: 0 0 16.666666%; flex: 0 0 16.666666%; max-width: 16.666666%;}

@media screen and (max-width: 768px){
	.col-8 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-7 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-5 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-3 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}


/*****　セクションカラー　*****/

/*--------------------
 マーカーアンダーライン
--------------------*/
.marker-animation {
    background-image: -webkit-linear-gradient(left, transparent 50%, rgb(240,246,84) 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, rgb(240,246,84) 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, rgb(240,246,84) 50%);
    background-image: -o-linear-gradient(left, transparent 50%, rgb(240,246,84) 50%);
    background-image: linear-gradient(left, transparent 50%, rgb(240,246,84) 50%);
    background-repeat: repeat-x;
    background-size: 200% .8em;
    background-position: 0 .5em;
    transition: all 1.5s ease 0.8s;
    font-weight: bold;
}
.marker-animation.active{background-position: -100% .5em;}


/*--------------------
 ヘッダー
--------------------*/
header .front-header {}
header .lowerlayer-header {}
.headbg .lowerlayer-header nav ul li.has-child::before {border-top: 1px solid #222; border-right: 1px solid #222;}
.lowerlayer-header nav ul li.has-child::before {border-top: 1px solid #fff; border-right: 1px solid #fff;}
.lowerlayer-header .grand-navigation ul li a {color: #fff;}
.lowerlayer-header a img.base-logo {display: block;}
.lowerlayer-header a img.scroll-logo {display: none;}
.headbg .lowerlayer-header .grand-navigation ul li a {color: #222;}
.headbg .lowerlayer-header a img.base-logo {display: none;}
.headbg .lowerlayer-header a img.scroll-logo {display: block;}

@media screen and (max-width: 991px){
	.headbg .lowerlayer-header .grand-navigation ul li a {color: #fff;}
}

/*--------------------
 ナビゲーション
--------------------*/
.logo {position: absolute; top: 10px; left: 0px;}
.logo img {width: 100%; height: auto; max-width: 160px;}

.grand-navigation {position: absolute; top: 10px; right: 0;}
.grand-navigation ul li a span {display: block; font-size: 12px;}


@media screen and (max-width: 991px){
	.logo img {max-width: 100px;}
}


/*--------------------
 フッター
--------------------*/
#se-footer {background-color: #23438a;}
#footer-menu {max-width: 1100px; margin: 0 auto;}
.footer-list {padding: 5px 0;}
.footer-list ul {display: flex; justify-content: center;}
.footer-list ul li {width: 100%; max-width: 25%; text-align: center; padding: 5px; border-left: 1px solid rgb(212 164 79 / 75%);}
.footer-list ul li:first-child {border: none;}
.footer-list ul li a {display: block; color: #fff; transition: 0.3s;}
.footer-list ul li a:hover {color: #e8d3d1;}
#se-footer .container {padding: 30px 0 20px;}

#footer-sk {text-align: center;}
#footer-sk h3 {}
#footer-sk h3 a img {max-width: 200px;}
.fot-address {padding: 10px 10px 0;}
.fot-address h5 {color: #fff; font-size: 20px;}
.fot-address p {color: #fff;}

#copyright {color: #fff; line-height: 60px; height: 60px; font-size: 12px; text-align: center; border-top: 1px solid rgb(212 164 79 / 75%); background-color: #0a1a4b;}

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

@media screen and (max-width: 480px){
	.footer-list ul li a {font-size: 3.33vw;}
	#se-footer .container {padding: 6.25vw 0 4.16vw;}
	#footer-sk h3 a img {max-width: 41.66vw;}
	.fot-address {padding: 2.08vw 2.08vw 0;}
	.fot-address h5 {font-size: 4.16vw;}
	.fot-address p {font-size: 3.33vw;}
	#copyright {line-height: 12.5vw; height: 12.5vw; font-size: 2.5vw;}
}


/*****　リキャプチャ　*****/
/*.grecaptcha-badge {z-index: 999;}

@media screen and (max-width: 768px){
	.grecaptcha-badge {bottom: 68px!important;}
}*/

/*****　ページトップへ　*****/
#page_top {}
#page_top a {position: fixed; bottom: 50px; right: 20px; font-size: 30px; text-align: center; color: #fff; text-decoration: none; background: #777; width: 60px; height: 60px; border-radius: 100%; z-index: 998;}
#page_top a::before {font-family: "Font Awesome 5 Free"; font-weight: bold; content: " \f077"; position: absolute; top: 8px; left: 0; right: 0; margin: 0 auto;}

@media screen and (max-width: 768px){
	#page_top a {bottom: 80px; width: 40px; height: 40px; font-size: 20px;}
	#page_top a::before {top: 4px;}
}


/*--------------------
 ページヘッダー画像
--------------------*/
#front-page {padding-top: 80px;}
.head-contents {position: relative; width: 100%; height: 600px; top: -80px;}
.head-contents-inner {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); z-index: 9;}
.cachcopy {}
.cachcopy img {max-width: 200px;}
#front-page .head-contents-image {background:url('../images/main-image.webp') no-repeat center; background-size: cover; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 600px;}


@media screen and (max-width: 991px){
	#front-page {padding-top: 30px;}
	#front-page .head-contents-image {background:url('../images/main-image_sp.webp') no-repeat center; background-size: cover; height: 510px;}
	.head-contents {height: 510px; top: -60px;}
	.head-contents-inner {top: initial; left: 50%; bottom: 20px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);}
	.cach-sp {display: none;}
	.cachcopy h2 {font-size: 3vw;}
	.cachcopy p {font-size: 20px;}
}

@media screen and (max-width: 768px){
	.cachcopy h2 {font-size: 22px; padding: 0 15px; margin-bottom: 10px;}
	.cachcopy p {padding: 0 15px; font-size: 16px;}
}


/*****　スクロールダウン　*****/
.scrolldown2 {position: absolute; bottom: 20px; right: 60px; z-index: 6;}
/*Scrollテキストの描写*/
.scrolldown2 span{
    /*描画位置*/
  position: absolute;
  left:10px;
  bottom:10px;
    /*テキストの形状*/
  color: #fff;
  font-size: 1rem;
  letter-spacing: 0.05em;
  /*縦書き設定*/
  -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

/* 丸の描写 */
.scrolldown2:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom:0;
    left:-6px;
    /*丸の形状*/
  width:14px;
  height:14px;
  border-radius: 50%;
  background:#eee;
    /*丸の動き1.6秒かけて透過し、永遠にループ*/
  animation:
    circlemove 1.6s ease-in-out infinite,
    cirlemovehide 1.6s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove{
      0%{bottom:90px;}
     100%{bottom:-5px;}
 }

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide{
      0%{opacity:0}
     50%{opacity:1;}
    80%{opacity:0.9;}
  100%{opacity:0;}
 }

/* 線の描写 */
.scrolldown2:after{
  content:"";
    /*描画位置*/
  position: absolute;
  bottom:0;
  left:0;
    /*線の形状*/
  width:2px;
  height: 100px;
  background:#eee;
}


/*--------------------
 コンテンツ
--------------------*/
/*****　正覚寺縁起　*****/
#se-about {background: url('../images/bg-washi.webp') no-repeat center center; background-size: cover;}
.se-about-wrap {padding: 60px 0;}
.mainsub-title h2 {color: #b02b2c; font-size: 48px;}
.mainsub-title h3 {color: #b02b2c; font-size: 24px; margin: 0 0 30px;}
.mainsub-title p {margin: 0 0 20px;}
.se-about-wrap .row-ar {background: none;}
.se-about-wrap .col-4 {padding: 0 0 0 30px;}
.se-about-img {text-align: center; padding: 10px; background-color: #fff; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; border: solid 1px #d4a44f;}
.se-about-img img {}

.se-about-wrap .rm-wrap p.more-shell {margin: 0;}


@media screen and (max-width: 768px){
	.se-about-wrap {padding: 7.8125vw 0;}
	.mainsub-title h2 {font-size: 6.25vw;}
	.mainsub-title h3 {font-size: 3.125vw;}
	.se-about-wrap .col-4 {padding: 0;}
	.se-about-img {max-width: 500px; margin: 0 auto;}
}

@media screen and (max-width: 480px){
	.mainsub-title h2 {font-size: 28px;}
	.mainsub-title h3 {font-size: 13px; margin: 0 0 6.25vw;}
	.mainsub-title p {font-size: 14px; margin: 0 0 4.16vw;}
}


/*****　文化財 十二神将像　*****/
#se-highlights {margin: 0 auto; padding: 60px 0; background-image: url('../images/bg-gg_statue.webp'); background-size: cover; background-position: center center; background-repeat: no-repeat; background-attachment: fixed; position: relative; z-index: 0;}
#se-highlights .mainsub-title h2, #se-highlights .mainsub-title h3, #se-highlights .mainsub-title p {color: #fff;}
.se-highlights-wrap {}
.se-highlights-wrap .row-ar {background: none;}
.se-highlights-img {padding: 0 15px;}
.se-highlights-img img {max-width: 500px;}
.se-highlights-text {padding: 0 15px;}
.se-highlights-text p {color: #fff; margin: 0 0 20px;}
#se-highlights a.read-more {color: #fff; border: solid 1px #fff;}
#se-highlights a.read-more::after {border-top: solid 1px #fff; border-right: solid 1px #fff;}
#se-highlights a.read-more:hover {color: #d4a44f;}
#se-highlights a.read-more:hover::after {border-color: #d4a44f;}


@media screen and (max-width: 768px){
	#se-highlights {padding: 7.8125vw 0; background-attachment: scroll;}
	.se-highlights-img {text-align: center; margin: 0 0 20px;}
	.se-highlights-img img {max-width: 375px;}
}

@media screen and (max-width: 480px){
	.se-highlights-text {padding: 0;}
	.se-highlights-text p {font-size: 14px; margin: 0 0 4.16vw;}
}


/*****　正覚寺画廊　*****/
#se-gallery {margin: 0 auto; padding: 60px 0; background: url('../images/bg-stone.webp') repeat left top;}
.se-gallery-wrap {}
.gallery-grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px;}

.gallery-item {aspect-ratio: 1 / 1; overflow: hidden; border-radius: 8px; position: relative; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
.gallery-image-wrap {width: 100%; height: 100%; overflow: hidden;}
.gallery-image-wrap img {width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease, opacity 0.4s ease; display: block;}
.gallery-image-wrap::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.25); opacity: 0; transition: opacity 0.3s ease; z-index: 1;}
.gallery-item:hover .gallery-image-wrap img {transform: scale(1.05);}
.gallery-item:hover .gallery-image-wrap::before {opacity: 1;}




@media screen and (max-width: 768px){
	#se-gallery {padding: 7.8125vw 0;}
	.gallery-grid {grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));}
}

@media screen and (max-width: 480px){
	.gallery-grid {grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 4.16vw;}
}


/*****　お知らせ　*****/
#se-notice {padding: 60px 0 0; position: relative; top: -80px;}
.notice-wrap {display: flex; flex-wrap: wrap; padding: 0 30px;}
.notice-wrap dl {width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #ccc; font-size: 1.1em;}
.notice-wrap dl:first-of-type {border-top: 1px solid #ccc;}
.notice-wrap dl dt {width: 20%; text-align: center;}
.notice-wrap dl dd {width: 78%; overflow: hidden;}
.notice-wrap dl dd a {text-decoration: none; transition: 0.3s;}
.notice-wrap dl dd a span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.notice-wrap dl dd a:hover {color: #3e7062;}

#se-notice .rm-wrap {margin: 40px 0 0;}

@media screen and (max-width: 991px){
	#se-notice {top: -60px;}
}

@media screen and (max-width: 768px){
	#se-notice {padding: 7.8125vw 0 0;}
}

/*****　Google MAP　*****/
#g-map {}
#g-map iframe {width: 100%; height: 400px;}


@media screen and (max-width: 768px){
	#g-map iframe {height: 300px;}
}

@media screen and (max-width: 480px){
	#g-map iframe {height: 62.5vw;}
}

/*****　read moreボタン　*****/
.rm-wrap {margin: 40px 0;}
.more-shell {text-align: center;}
a.read-more {position: relative; display: inline-block; min-width: 200px; text-align: center; padding: 12px 24px; color: #222; font-weight: 600; text-decoration: none; border: solid 1px #222; transition: 0.3s ease-out;}
a.read-more:hover {background-color: #23438a; color: #d4a44f;}
a.read-more::after {position: absolute; content: ''; top: 20px; right: 15px; width: 8px; height: 8px; border-top: solid 1px #222; border-right: solid 1px #222; transform: rotate(45deg); transition: 0.3s ease-out;}
a.read-more:hover::after {border-color: #d4a44f;}


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

/*****　お問い合わせボタン　*****/
.but_illustration_style {margin: 40px 0 60px;}
.but_illustration_style a {position: relative; display: flex; justify-content: center; align-items: center; margin: 0 auto; max-width: 320px; padding: 15px 30px; color: #000; transition: 0.3s ease-in-out; font-weight: 600; z-index: 1; border-radius: 5px; text-decoration: none; line-height: 1.6; font-family: "Helvetica", "Arial", "Hiragino Kaku Gothic ProN", "Hiragino Sans", YuGothic, "Yu Gothic", "メイリオ", Meiryo, sans-serif; font-size: 18px;}
.but_illustration_style a::before {content: ""; width: 100%; height: 100%; position: absolute; background: #c5dde9; z-index: -1; border: 2px solid #000; border-radius: 5px;}
.but_illustration_style a::after {position: absolute; top: 0; bottom: 0; width: 100%; height: 100%; content: ''; -webkit-transition: all .3s; transition: all .3s; -webkit-transform: translate3d(0,0.40rem,-1rem); transform: translate3d(0,0.40rem,-1rem); border: 2px solid #000; border-radius: inherit; background: #5e8295; -webkit-box-shadow: 0 0.6rem 0 0 rgb(0 0 0 / 20%); box-shadow: 0 0.4rem 0 0 rgb(0 0 0 / 20%); z-index: -2;}
.but_illustration_style a b {position: absolute; right: 9px; -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;}
.but_illustration_style a:hover {transform: translate3d(0,0.2rem,-1rem);}
.but_illustration_style a:hover::before {background: #f2b15c;}
.but_illustration_style a:hover::after {transform: translate3d(0,0.2rem,-1rem); box-shadow: 0 0.2rem 0 0 rgb(0 0 0 / 20%); background: #aa6914;}




