@charset "UTF-8";


/* ------------------------
 HOME ()
------------------------ */
#mv{position:relative;z-index:0}
.skippr-previous,.skippr-next{display:none}
#mainvisual p{position:absolute;left:50%;top:50%;color:#fff;text-align:left;line-height:1.8em;font-weight:500;-ms-writing-mode: tb-rl;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;z-index:3;letter-spacing:0.05em;}
#mainvisual p::before{content:"";background:url(../img/common/logo.png) no-repeat center / cover;display:inline-block;margin:0 auto}
.skippr-nav-container{position:absolute;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);-moz-transform:translate(-50%,0);-ms-transform:translate(-50%,0);overflow:auto;z-index:999}
.skippr-nav-element{cursor:pointer;float:left;background-color:rgba(255,255,255,1);-webkit-transition:all .25s linear;transition:all .25s linear}
.skippr-nav-element-bubble{border-radius:50%}
.skippr-nav-element:hover,.skippr-nav-element-active{background-color:#050015}
.skippr-arrow{position:absolute;z-index:999;top:50%;cursor:pointer;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease}
#topics{background:#fff;font-weight:700;}
#topics dt{text-align:center;color:#fff;background:#050015}
#topics ul li time{color:#050015}
#topics ul li a{color:#111}
#topics ul+p a{font-size:0;position:relative;color:#050015}
#topics ul+p a:after,#serviceList ul li a h3:after,#introduction ul li a::after{content:"";display:inline-block;-webkit-transform:rotate(135deg);transform:rotate(135deg);position:absolute;}
#topics ul+p a:after,#serviceList ul li a h3:after{top:50%}


.introduction{width:100%;overflow:hidden;
  background:url(../img/common/bg01.gif);
  text-align: center;position:relative}
  .introduction > p {
    letter-spacing: 0.06em; }
  .introduction p, .introduction p strong {font-weight:normal;}
  .introduction p span {
    background: -moz-linear-gradient(top, rgba(255, 174, 158, 0) 0%, rgba(255, 174, 158, 0) 75%, #ffae9e 76%, #ffae9e 90%, rgba(255, 174, 158, 0) 91%, rgba(255, 174, 158, 0) 100%);
    background: -webkit-linear-gradient(top, rgba(255, 174, 158, 0) 0%, rgba(255, 174, 158, 0) 75%, #ffae9e 76%, #ffae9e 90%, rgba(255, 174, 158, 0) 91%, rgba(255, 174, 158, 0) 100%);
    background: linear-gradient(to bottom, rgba(255, 174, 158, 0) 0%, rgba(255, 174, 158, 0) 75%, #ffae9e 76%, #ffae9e 90%, rgba(255, 174, 158, 0) 91%, rgba(255, 174, 158, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffae9e', endColorstr='#ffae9e',GradientType=0 ); }
.introduction::before,.introduction::after{content:"";display:block;background-repeat:no-repeat;background-size:cover;background-position:center;position:absolute;opacity:.3}
.introduction::before{background-image:url(../img/index/bg_shuriken1.png);}
.introduction::after{background-image:url(../img/index/bg_shuriken2.png);}	
.introduction ul li{display:block;color:#fff;background-repeat:no-repeat;background-size:cover;position:relative;letter-spacing:0.03em;background-position:center;}
.introduction ul li[title='敢國神社について']{background-image:url(../img/index/lead01.jpg)}
.introduction ul li[title='境内のご案内']{background-image:url(../img/index/lead02.jpg)}
.introduction ul li[title='史蹟名勝']{background-image:url(../img/index/lead03.jpg)}
.introduction ul li[title='年間祭典']{background-image:url(../img/index/lead04.jpg)}
.introduction ul li[title='祈祷並びに参拝のご案内']{background-image:url(../img/index/lead05.jpg)}
.introduction ul li[title='授与品頒布品']{background-image:url(../img/index/lead06.jpg)}
.introduction ul li::after,.introduction ul li::before{position:absolute;display:block;content:"";}
.introduction ul li::after{top:3px;left:3px;width:calc(100% - 8px);height:calc(100% - 8px);border:1px solid rgba(255,255,255,.6);}
.introduction ul li::before{top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);}
.introduction ul li a{display:block;color:#fff;position:relative;z-index:1;line-height:1;text-shadow: 0px 4px 8px rgba(0,0,0,0.5)}

.latestpost {
  margin: 0 auto;
  display: flex; }
  .latestpost h2 {
    color: #050015;
    font-weight: 600; }
    .latestpost h2::before {
      font-family: "Font Awesome 5 Free";
      content: "\f05a"; }
  .latestpost .accordion01 article,.latestpost2 article {
    border-bottom: 1px solid #eee; }
    .latestpost .accordion01 article time,.latestpost2 article time {
      color: #050015;letter-spacing:0.03em;font-weight:700;}
    .latestpost .accordion01 article header {
      font-weight: 600;
      position: relative; }
      .latestpost .accordion01 article header::before, .latestpost .accordion01 article header::after {
        background: #050015;
        content: "";
        display: block;
        position: absolute;
        transition: .5s; }
      .latestpost .accordion01 article header::before {
        transform: rotate(0deg); }
      .latestpost .accordion01 article header::after {
        transform: rotate(90deg); }
      .latestpost .accordion01 article header.active::before, .latestpost .accordion01 article header.active::after {
        transform: rotate(-180deg); }
    .latestpost .accordion01 article div {
      line-height: 2em; }
  .latestpost .wp-block-button a,.latestpost2 .wp-block-button a {
    background: #fff;color:#050015;border:1px solid #050015;
    transition: .3s; }
    .latestpost .wp-block-button a:hover,.latestpost2 .wp-block-button a:hover {
      background: #050015;color:#fff; }
    .latestpost .wp-block-button a::after,.latestpost2 .wp-block-button a:after {
      font-family: "Font Awesome 5 Free";
      content: "\f105";
      font-weight: bold; }

.latestpost2 h2{text-align:center;
    color: #050015;}

/*  	PC STYLE  *************************************************************/
@media screen and (min-width: 961px), print {
.skippr{width:100%;height:100%;position:relative;overflow:hidden;padding:0;margin:0}
.skippr > li{position:absolute;width:100%;height:100%;background-size:cover;background-position:50% 62.5%}
.skippr > img{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:100%;min-height:100%}
#mainvisual p{font-size:50px;width:100px;height:320px;margin-top:-200px;margin-left:-50px;text-shadow:0px 4px 8px #000000;}
#mainvisual p::before{width:84px;height:84px;margin:0 auto 10px;}
#mv{height:90vh;position:relative;top:-90px;z-index:0;min-height:600px;}


.skippr-nav-container{left:50%;bottom:60px}
.skippr-nav-element-bubble{width:10px;height:10px;margin:0 10px;z-index:100}
.skippr-arrow{width:50px;height:50px}
.skippr-previous{left:20px}
.skippr-next{right:20px}
.skippr-previous:hover{left:15px}
.skippr-next:hover{right:15px}
.skippr-previous:before,.skippr-next:before{top:38%;left:35%}
main{width:100%;overflow:hidden;}
#topics{width:calc(100% - 20px);margin:-130px auto 0;max-width: 1000px;}
#topics dl{position:relative;margin:0 auto 0;display:flex;background:#fff;height:80px;z-index:1;overflow:hidden;align-items:center;box-shadow:0px 0px 9px 3px rgba(0,0,0,.1);}
#topics dt{width:140px;font-size:16px;padding:27px 0 0;letter-spacing:0.08em;position:relative;text-align:center;height:100%}
#topics dd{padding:0 30px}
#topics ul+p{position:absolute;right:15px;top:50%;margin-top:-12px}
#topics ul li{padding:0;height:40px;font-size:16px;overflow:hidden;line-height:1.8em;}
#topics ul li time,#topics ul li p{display:inline-block;}
#topics ul li time{padding:0 30px 0 25px;letter-spacing:0.05em;font-size:14px;position:relative;top:-2px;}
#topics ul li p{font-size:18px;padding:8px 0 0}
#topics ul li a:hover p{text-decoration:underline}
#topics ul+p a{transition:0.3s;display:inline-block;padding:16px;top:-5px}
#topics ul+p a::after{width:8px;height:8px;margin:-6px 0 0 0;right:10px;border-top:3px solid #050015;border-right:3px solid #050015;transition:0.3s}
#topics ul+p a:hover::after{margin:-2px 0 0}

main{margin-top:-40px;}
  .introduction {padding: 100px 0 40px; }
    .introduction p {
      width: 900px;
      margin: 0 auto 2em;
      line-height: 2.5em;
	 font-size: 30px;
	 padding:80px 0 50px;
}
      .introduction p ruby rt{font-size:12px}
      .introduction p strong{font-size:40px;padding:0 .2em}
      .introduction p span{padding:0 .1em}

.introduction ul{display:flex;flex-wrap:wrap;justify-content:space-between;max-width:1120px;margin:0 auto;font-size:22px;}
.introduction ul li{width:30%;text-align:center;margin:0 auto 30px;}
.introduction ul li a{padding:60px 0 56px;}
.introduction ul li::before{transition:.3s}
.introduction ul li:hover::before{opacity:.6}
.introduction::before{width:350px;height:540px;left:-50px;top:50%;margin-top:-270px;}
.introduction::after{width:400px;height:520px;right:-50px;top:50%;margin-top:-260px;}

  .latestpost {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    padding: 50px 0 30px; }
    .latestpost h2 {
      font-size: 24px;
      font-weight: 600;
      width: 240px;
      text-align: center;
      padding: 30px 0 0; }
      .latestpost h2::before {
        margin-right: 8px;
        font-size: 20px; }
    .latestpost .accordion01 {
      width: calc(100% - 240px);padding-top:25px; }
      .latestpost .accordion01 article {
        padding:15px 15px 15px 30px; }
        .latestpost .accordion01 article time {
          letter-spacing: 0.05em;
          padding: 0 0 10px;font-size:14px;
          display: block; }
		  .latestpost .accordion01 article p{font-size:18px;}
        .latestpost .accordion01 article header {
          cursor: pointer; }
          .latestpost .accordion01 article header::before, .latestpost .accordion01 article header::after {
            width: 20px;
            height: 4px;
            border-radius: 2px;
            right: 20px;
            top: 50%;
            margin-top: -2px; }
          .latestpost .accordion01 article header:hover {
            opacity: .8; }
        .latestpost .accordion01 article div {
          padding: 20px 0 0; }
        .latestpost .accordion01 article div p{font-size:15px;padding:0 20px;}
        .latestpost .accordion01 article + .wp-block-button {
          padding: 40px 240px 40px 0; }
		  .latestpost2 .wp-block-button a{padding:40px 240px 40px 0;}
          .latestpost .accordion01 article + .wp-block-button a,.latestpost2 .wp-block-button a {
            padding: 8px 15px 8px 30px;
            font-weight: 600;
            font-size: 16px; }
            .latestpost .accordion01 article + .wp-block-button a::after,.latestpost2 .wp-block-button a::after {
              margin-left: 25px;
              font-size: 22px;
              position: relative;
              top: 3px; }

  .latestpost2{
	  position:relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 0 60px;
}
  .latestpost2::after{background:url(../img/index/bg01.png);background-size:85px auto;content:'';width:500%;z-index: -1;position:absolute;left:50%;top:0;margin-left:-250%;height:100%;}

.latestpost2 h2{
      font-size: 30px;
      padding:60px 0 40px;}

.latestpost2 .postlist{display:flex;max-width:1000px;margin:0 auto;flex-wrap:wrap;}
.latestpost2 .postlist article{width:calc(50% - 40px);border-bottom:1px solid #d9d9d9;padding:20px 0;}
.latestpost2 .postlist article figure{width:160px;text-align:center;padding:0;margin:0 2em 0 0;line-height:1}
.latestpost2 .postlist article:nth-child(2n){margin-left:20px;}
.latestpost2 .postlist article:nth-child(2n+1){margin-right:20px}
.latestpost2 .postlist article img{width:120px;margin:0;line-height:1;vertical-align:top;background:#fff;height:auto;}
.latestpost2 .postlist article a{display:flex;transition:.3s;}
.latestpost2 .postlist article a time{font-size:14px;color:#050015;padding:0 0 20px;display:inline-block}
.latestpost2 .postlist article a p{font-size:18px;color:#111;}
.latestpost2 .postlist article a:hover p{text-decoration:underline;}
.latestpost2 .postlist{margin:0 auto 60px;}
}
/*  	TB/SP STYLE  *************************************************************/
@media screen and (min-width: 961px) and (max-width: 1300px) {

	.mv {
    height: 50vh;
    padding: 5em 6em 0; }
#topics{width:calc(100% - 40px);}
.introduction::before{width:350px;height:540px;left:-150px;top:50%;margin-top:-300px;}
.introduction::after{width:400px;height:520px;right:-150px;top:50%;margin-top:-300px;}
	.introduction ul{padding:0 10px;}
.introduction ul li{margin:0 auto 20px;width:calc(33.3% - 20px)}
	.latestpost h2{width:180px;}
	.latestpost .accordion01{width:calc(100% - 200px)}
	.latestpost2 .postlist{max-width:calc(100% - 40px);}
	.latestpost2 .postlist article{width:calc(50% - 20px);}
}
/*  	SP STYLE  *************************************************************/
@media screen and (max-width: 960px) {
	.ghd{background:none}
	.ghd .logo{display:none;}
#mainvisual{position:relative}
#mainvisual p{font-size:30px;width:60px;height:200px;margin-top:-150px;margin-left:-30px;text-shadow:0px 4px 8px #000000;}
#mainvisual p::before{width:42px;height:42px;margin:0 auto 10px;}
#mv{height:50vh;position:relative;top:-60px;z-index:0;min-height:400px;}
	
.skippr-nav-container{left:50%;bottom:15px}
.skippr-nav-element-bubble{width:8px;height:8px;margin:0 5px}
.skippr-previous:before,.skippr-next:before{top:30%;left:30%}
.skippr{width:100%;height:100%;position:relative;overflow:hidden;padding:0;margin:0}
.skippr > li{position:absolute;width:100%;height:100%;background-size:cover;background-position:50% 62.5%}
.skippr > img{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:100%;min-height:100%}
.skippr-arrow{display:none}

#topics{width:100%;position:relative;margin:-60px 0 0;padding:10px;background: url(../img/common/bg01.gif);z-index:1;overflow:hidden}
#topics dt{text-align:center;font-size:14px;padding:5px;}
#topics dd{padding:5px;margin:0;background:#fff;}
#topics ul+p{position:absolute;right:5px;top:60%;margin-top:-12px}
#topics ul li{display:flex;padding:8px 5px 5px}
#topics ul li time,#topics ul li p{display:inline-block;padding:3px 0 0}
#topics ul li time{padding:3px 15px 5px 0px;font-size:13px}
#topics ul li p{font-size:0.937rem;line-height:1.5em;padding:0 30px 0 0}
#topics ul li p a:hover{text-decoration:underline}
#topics ul+p a{transition:0.3s;display:inline-block;padding:16px;top:-5px}
#topics ul+p a::after{width:6px;height:6px;margin:0 0 0 0;right:12px;border-top:3px solid #050015;border-right:3px solid #050015;transition:0.3s}


  .introduction {padding:20px 10px; }
    .introduction p {
      margin: 0 auto 2em;
      line-height: 2.5em;
	 font-size: 18px;
	 padding:40px 0 20px;}
      .introduction p ruby rt{font-size:10px}
      .introduction p strong{font-size:28px;padding:0 .2em}
      .introduction p span{padding:0 .1em}

.introduction ul{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 auto;font-size:15px;}
.introduction ul li{width:calc(50% - 10px);text-align:center;margin:0 auto 10px;}
.introduction ul li a{padding:50px 0 46px;}
.introduction ul li::before{transition:.3s}
.introduction ul li:hover::before{opacity:.6}
.introduction ul li[title='祈祷並びに参拝のご案内'] a{letter-spacing:-0.04em;}
.introduction::before{width:175px;height:270px;left:-50px;top:20%;margin-top:-135px;}
.introduction::after{width:200px;height:260px;right:-50px;top:20%;margin-top:-130px;}

.latestpost,.latestpost2{margin:0 auto;padding:20px 20px 40px;display:block}
.latestpost h2,.latestpost2 h2{font-size:20px;font-weight:600;text-align:center;padding:20px 10px 10px 0}
.latestpost h2::before{margin-right:8px;font-size:20px}
.latestpost .accordion01{width:100%}
.latestpost .accordion01 article{padding:15px 5px}
.latestpost .accordion01 article time{letter-spacing:.05em;padding:0 0 10px;display:block;font-size:13px;}
.latestpost .accordion01 article header{font-size:16px}
.latestpost .accordion01 article header::before,.latestpost .accordion01 article header::after{width:15px;height:2px;border-radius:2px;right:0px;top:50%}
.latestpost .accordion01 article div{font-size:14px;padding:20px 0 0}
.latestpost .accordion01 article + .wp-block-button,.latestpost2 .wp-block-button{padding:20px 0 0;text-align:center}
.latestpost .accordion01 article + .wp-block-button a,.latestpost2 .wp-block-button a{padding:8px 15px 12px 30px;font-weight:600;font-size:14px;line-height:1}
.latestpost .accordion01 article + .wp-block-button a::after,.latestpost2 .wp-block-button a::after{font-size:15px;}
.latestpost .accordion01 article + .wp-block-button a::after,.latestpost2 .wp-block-button a::after{margin-left:25px;font-size:20px;position:relative;top:3px}
.latestpost2{background:url("../img/index/bg01.png");background-size:85px auto;border-top:1px solid #e7e7e7;}
.latestpost2 .postlist{padding:10px 0 0;}
.latestpost2 .postlist article{width:100%;padding:10px;background:rgba(255,255,255,.9);}
.latestpost2 .postlist article figure{width:120px;text-align:left;padding:0;margin:0 1em 0 0;line-height:1}
.latestpost2 .postlist article img{width:100px;margin:0;line-height:1;vertical-align:top;background:#fff;height:auto;}
.latestpost2 .postlist article a{display:flex;transition:.3s;}
.latestpost2 .postlist article a time{font-size:13px;color:#050015;padding:5px 0 10px;display:inline-block}
.latestpost2 .postlist article a p{font-size:16px;color:#111;}
.latestpost2 .postlist article:last-child{border:none;}
}