/*
Theme Name:lighting-gesshoji
Theme URI:
Version: 1.0
Author: imawaka
Author URI: https://yoshida-designbu.com/
License: imawaka
*/


/*リセットcss*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}

html {
	line-height: 1;
    scroll-padding-top: var(--space-40);
}

ol, ul {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}

q, blockquote {
	quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}

img {
	vertical-align: bottom;
}

a img {
	border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
	display: block;
}

input[type="button"], input[type="submit"] {
	-webkit-appearance: none;
}

br.clear {
	clear: both;
}

/*リセットcssここまで*/


/*--------------
common
--------------*/
html {
    font-size: 62.5%;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

:root {
    --color-Navy: #001450;
    --color-White: #ffffff;
    --font-16px: 16px;
    --font-14px: 14px;
    --font-12px: 12px;
    --font-regular: 400;
    --font-medium: 500;
    --font-bold: 700;
    --font-black: 800;
    --font-ZenOldMincho: "Zen Old Mincho", "Shippori Mincho", "Noto Serif JP", "Source Serif Pro", "Times New Roman", Times, serif;
}

body {
	color: var(--color-Navy);
	font-family: var(--font-ZenOldMincho);
	font-size: var(--font-14px);
	line-height: 1.6;
	font-weight: 400;
	font-feature-settings: "palt";
}

a {
    text-decoration: none;
    transition: all 0.5s;
	color: var(--color-Black);
}

img, video {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}

picture {
    display: block;
}

.hidden {
    visibility: hidden;
    height: 0!important;
    margin: 0!important;
    border: 0!important;
    padding: 0!important;
}

.link {
    display: block;
}

.spanblock {
    display: block;
}

.pc {
    display: none;
}
.tab {
    display: none;
}
.sp {
    display: block;
}

.bodyContainer {
    position: relative;
}

.bodyContainer::after {
    content: "";
    width: 100vw;
    height: 100vh;
    background: url(./img/common/whBg.webp) center no-repeat;
    background-size: cover;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

@media screen and (min-width: 600px) {

    body {
        font-size: 14px;
    }

    :root {
        --font-16px:17px;
        --font-14px:15px;
        --font-12px:13px;
    }

}

@media screen and (min-width: 1000px) {

    a:hover {
        opacity: 0.6;
    }

    .tab {
        display: block;
    }
    .sp {
        display: none;
    }

}

@media screen and (min-width: 1400px) {

    body {
        font-size: 16px;
    }

    :root {
        --space-80:90px;
        --space-60:70px;
        --space-40:50px;
        --space-30:40px;
        --space-20:30px;
        --font-16px:18px;
        --font-14px:16px;
        --font-12px:14px;
    }

}


/*--------------
header
--------------*/

/* loading */

div.loading {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 20;
    animation: loading 2s forwards;
    animation-delay: 0.2s;
}

@keyframes loading {

    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        visibility: hidden;
    }

}

/* 動き */

header h1, 
div.hamburger, 
.home div.pcNav-inner, 
.home div.pcAside-logo, 
div.topNews {
    animation: topKv-fadeIn 1.2s forwards;
    animation-delay: 1.4s;
    opacity: 0;
}

div.topKv-logo {
    animation: topKv-fadeIn 1.2s forwards;
    animation-delay: 1s;
    opacity: 0;
}

@keyframes topKv-fadeIn {

    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }

}

/* header */

nav.globalMenuSp {
    display: none;
}

header {
    width: 100%;
    height: 70px;
    position: fixed;
    top: 0;
    z-index: 9;
    transition: 0.6s;
}

header h1 {
    width: 100px;
    position: absolute;
    top: 20px;
    left: 5%;
    z-index: 9;
}

.hamburger {
    display: block;
    position: fixed;
    z-index: 11;
    cursor: pointer;
    text-align: center;
    top: 15px;
    right: 4%;
    width: 40px;
}

.hamburger span {
    display: block;
    width: 100%;
    height: 1px;
    background: var(--color-Navy);
    position: absolute;
    right: 0;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
    
.hamburger img.close {
    display: none;
}
    
.hamburger.active img.open {
    display: none;
}
    
.hamburger.active img.close {
    display: block;
}

nav.globalMenuSp {
    display: block;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .6s ease, visibility .6s ease;
}
nav.globalMenuSp.active {
    opacity: 100;
    visibility: visible;
}

div.globalMenuSp-wrapper {
    position: relative;
    height: 100%;
}

ul.gMenu-list li a {
    display: block;
    color: var(--color-White);
}

/* ハンバーガー内の動き */

nav.globalMenuSp.active ul.gMenu-list li {
    opacity: 0;
    filter: blur(5px);
    animation: gMenu-fadeIn 0.6s forwards;
    animation-delay: 0.4s;
}

nav.globalMenuSp.active ul.gMenu-list li:nth-child(2) {
    animation-delay: 0.45s;
}

nav.globalMenuSp.active ul.gMenu-list li:nth-child(3) {
    animation-delay: 0.5s;
}

nav.globalMenuSp.active ul.gMenu-list li:nth-child(4) {
    animation-delay: 0.55s;
}

nav.globalMenuSp.active ul.gMenu-list li:nth-child(5) {
    animation-delay: 0.6s;
}

@keyframes gMenu-fadeIn {

    0% {
        opacity: 0;
        filter: blur(5px);
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0);
    }

}

@media screen and (min-width: 600px) {

    header h1, .hamburger {
        display: none;
    }

}


/*--------------
pcサイド画面
--------------*/

aside.pcAside, nav.pcNav {
    display: none;
}

@media screen and (min-width: 600px) {

    div.mainArea, .footer-container {
        box-sizing: border-box;
        overflow: hidden;
    }

    /* pcNav(pc画面 右メニュー) */

    nav.pcNav {
    }

}

@media screen and (min-width: 800px) {

    div.mainArea, .footer-container {
    }
}

@media screen and (min-width: 1000px) {

    div.mainArea, .footer-container {
    }

    /* pcAside(pc画面 左メニュー) */

    aside.pcAside {
    }

}

/*--------------
main
--------------*/

.mainArea {
    overflow: hidden;
}

/* ↓ここから 動き */

.scrollImage-fadeIn, .scrollText-fadeIn1,  .scrollText-fadeIn2 {
    opacity: 0;
}

.scrollImage-fadeIn {
    filter: blur(5px);
}

.scrollImage-fadeIn-animation {
    animation: scrollImage-fadeIn 1.4s forwards;
}

@keyframes scrollImage-fadeIn {

    0% {
        opacity: 0;
        filter: blur(5px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
    }

}

.scrollText-fadeIn1 {
    filter: blur(5px);
}

.scrollText-fadeIn1-animation {
    animation: scrollText-fadeIn1 0.8s forwards;
}

@keyframes scrollText-fadeIn1 {

    0% {
        opacity: 0;
        filter: blur(5px);
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0);
    }

}

.scrollText-fadeIn2-animation {
    animation: scrollText-fadeIn2 1s forwards;
}

@keyframes scrollText-fadeIn2 {

    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }

}

/* ↑ここまで 動き */


/* Top共通 */

.topSec {
    width: 85%;
    margin: 50px auto;
    position: relative;
}

.topButton {
    margin-top: 30px;
}

.decoFog {
    position: absolute;
}


/* KV(キービジュアル) */


/* topConcept(コンセプト) */

.topConcept {
    padding: 30px 0 70px;
    background: linear-gradient(to bottom, #000 20%, #111 50%, #274077 100%);
    color: var(--color-White);
}

.topConcept .topDays {
    width: 85%;
    margin: 0 auto;
}

.topDays__note {
    margin-top: 10px;
    font-size: 1.6rem;
    text-align: center;
}

.topDays__note span {
    font-size: 120%;
}

.topConcept__main {
    position: relative;
}

.topConcept__copy {
    width: 30%;
    position: absolute;
    top: -2%;
    left: 5%;
    z-index: 1;
}

.topConcept__mainImage {
    width: 80%;
    margin: 50px 0 30px auto;
}

.topConcept__text {
    width: 90%;
    margin: 0 auto;
    text-align: right;
}

.topConcept__text p {
    margin-top: 1em;
    line-height: 2;
}

.topConcept__text p:first-of-type {
    margin-top: 0;
}

.topConcept__subImage {
    width: 44%;
    position: absolute;
    left: -6%;
    bottom: -5%;
}

.topConcept__deco01 {
    width: 92%;
    top: -12%;
    right: -18%;
}
.topConcept__deco02 {
    width: 55%;
    top: 42%;
    left: -16%;
    transform: scaleX(-1);
}
.topConcept__deco03 {
    width: 92%;
    bottom: 7%;
    right: -28%;
    transform: scaleX(-1);
    opacity: 0.8;
}


/* トップお知らせ */

.topNews__Container {
    display: flex;
    justify-content: space-between;
}

.topNews__title {
    width: 8%;
}

.topNews__main {
    width: 84%;
}

.topNews-list {
    padding-bottom: 1em;
    border-bottom: 1px solid rgba(0, 20, 100, 0.2);
    margin-bottom: 1em;
    position: relative;
}

.topNews-list:last-of-type {
    margin-bottom: 0;
}

.topNews-list::after {
    content: "";
    display: block;
    width: 20px;
    height: 8px;
    background: url(./img/common/navy-arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: calc(1em + 5px);
    right: 0;
}

.topNews-list dt {
    font-size: 1.3rem;
}


/* 月照寺と小泉八雲 */

.topGesshoji {
    width: 100%;
    margin-top: 80px;
}

.topGesshoji__title {
    width: 16%;
    position: absolute;
    top: -10%;
    right: 5%;
}

.topGesshoji__mainImage {
    width: 78%;
    margin: 0 0 0 auto;
}

.topGesshoji__yakumoImage {
    width: 35%;
    position: absolute;
    top: 11%;
    left: 5%;
}

.topGesshoji__text, .topGesshoji__button {
    width: 85%;
    margin: 30px auto 0;
    position: relative;
    z-index: 1;
}

.topGesshoji__text p {
    line-height: 2;
    text-align: right;
}

.topGesshoji__deco01 {
    width: 65%;
    top: -4%;
    left: -4%;
}
.topGesshoji__deco02 {
    width: 55%;
    bottom: 12%;
    left: -14%;
}


/* みどころ */

.topBg {
    padding-bottom: 70px;
    background: url(./img/top/topBg.webp) center left no-repeat;
    background-size: cover;
    color: var(--color-White);
}

.topAttraction {
    width: 100%;
}

/* スライドの動き等速 */
.swiper-wrapper {
  transition-timing-function: linear;
}

.topAttraction__title {
    width: 24%;
    position: absolute;
    top: 10%;
    right: 5%;
    z-index: 1;
}

.topAttraction__text, .topAttraction__button {
    width: 85%;
    margin: 30px auto 0;
}

.topAttraction__text p {
    line-height: 2.2;
}

.topAttraction__deco01 {
    width: 92%;
    bottom: 14%;
    right: -34%;
    transform: scaleX(-1);
}

/* 開催概要 */

.topOverview {
    width: 85%;
    margin: 40px auto 0;
}

.topOverview:first-of-type {
    margin-top: 0;
}

.topOverview__container {
    margin-top: 50px;
}

.topOverview__container:first-of-type {
    margin-top: 0;
}

/* ↓下層ページと共通 */

.underTitleContainer {
    position: relative;
}

.underTitle__deco01 {
    width: 110%;
    top: 50%;
    left: -68%;
    transform: translateY(-50%);
}

.underTitle__deco02 {
    width: 66%;
    top: 50%;
    right: -30%;
    transform: translateY(-50%);
}

.underTitle {
    width: 9%;
    margin: 0 auto 30px;
}

.underSubTitle {
    margin-bottom: 30px;
    border: 1px solid var(--color-White);
    padding: 0.4em 0 0.5em;
    font-size: 1.8rem;
    line-height: 1;
    text-align: center;
}

/* ↑ここまで下層ページと共通 */

.topOverview__title::before {
    content: "";
    display: block;
    margin: 0 auto;
    width: 1px;
    height: 18px;
    background-color: var(--color-White);
}

/* アクセス */

.topOverview__address dl {
    margin-top: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.topOverview__address dl:first-of-type {
    margin-top: 0;
}

.topOverview__address dd {
    font-size: 1.8rem;
    margin-left: 1em;
    border-left: 1px solid rgba(255, 255, 255, 0.5);
    padding-left: 1em;
}

.topOverview__moveList {
    width: fit-content;
    margin: 15px auto 0;
}

.topOverview__moveListItem {
    display: flex;
    gap: 0.8em;
}

.topOverview__moveListItem p {
    font-size: 1.6rem;
}

.topOverview__moveIcon {
    width: 28px;
}

.topOverview__map {
    height: 220px;
    margin-top: 25px;
    border-left: 1px solid rgba(255, 255, 255, 0.5);
}

.topOverview__map iframe {
    width: 100%;
    height: 100%;
}

.topOverview__mapText a {
    display: block;
    margin-top: 20px;
    border-radius: 40px;
    padding: 0.8em 0;
    background: var(--color-White);
    color: var(--color-Navy);
    text-align: center;
    position: relative;
}

.topOverview__mapText a span {
    padding-right: 1.5em;
    background: url(./img/common/navy-linkDeco.svg) right center no-repeat;
    background-size: 1em;
}

.topOverview__parking {
    margin-top: 30px;
    padding: 20px;
    background-color: rgba(38, 55, 106, 0.4);
}

.topOverview__parking h4 {
    text-align: center;
    font-size: 1.6rem;
}

.topOverview__parkingList {
    margin-top: 10px;
}

/* チケット(下層と共通) */

.ticketPrice__item {
    margin-top: 20px;
}

.ticketPrice__item:first-of-type {
    margin-top: 0;
}

.ticketPrice__text1 {
    margin-top: 15px;
    font-size: 2.4rem;
    text-align: center;
}

.ticketPrice__text1 span {
    font-size: 130%;
}

.ticketPrice__text2 {
    margin-top: 15px;
}

/* よくあるご質問 */

.topOverview__qa dl {
    padding-bottom: 1.5em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    margin-bottom: 1.5em;
}

.topOverview__qa dl:last-of-type {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: 0;
}

.accordion-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.accordion-title div:first-of-type, 
.accordion-content {
    position: relative;
    padding-left: 1.5em;
}

.accordion-title div:first-of-type::before, 
.accordion-content::before {
    content: "";
    width: 14px;
    height: 18px;
    position: absolute;
}

.accordion-title div:first-of-type::before {
    background: url(./img/top/qa-qIcon.svg) left center no-repeat;
    background-size: contain;
    top: 3px;
    left: 0;
}

.accordion-plus {
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    background-color: var(--color-White);
    position: relative;
}

.accordion-plus::before, .accordion-plus::after {
    content: '';
    width: 10px;
    height: 1px;
    position: absolute;
    background-color: var(--color-Navy);
}

.accordion-plus::before {
    top: 48%;
    right: calc(50% - 5px);
    transform: rotate(0deg);
}

.accordion-plus::after {
    top: 48%;
    right: calc(50% - 5px);
    transform: rotate(90deg);
}

/*closeというクラスがついたら形状変化*/

.accordion-title.close .accordion-plus::before {
	transform: rotate(0deg);
}

.accordion-title.close .accordion-plus::after {
	transform: rotate(0deg);
}

.accordion-content {
    display: none;/*はじめは非表示*/
    margin-top: 1em;
}

.accordion-content::before {
    background: url(./img/top/qa-aIcon.svg) left center no-repeat;
    background-size: contain;
    top: 3px;
    left: 0;
}

/* ここまで */



/*--------------
news
--------------*/

/* archive */

div.archiveSec {
    width: var(--width-85);
    margin: 0 auto;
}

div.archive-list {
    padding-bottom: var(--space-20);
    border-bottom: 1px solid rgba(234, 230, 205, 0.3);
    margin-bottom: var(--space-20);
}

div.archive-list h3 {
    margin-top: 5px;
}

div.archive-nav {
    display: flex;
    justify-content: space-between;
}

/* single */

p.single-days {
    margin-left: 5%;
}

div.singleSec h3 {
    line-height: 1.6;
    padding: 5px 5% 15px 0;
}

div.single-text p, div.single-text img {
    margin-bottom: var(--space-20);
}

div.single-text p:last-child {
    margin-bottom: 0;
}

div.single-text strong {
    font-weight: var(--font-bold);
}

div.single-text a {
    font-weight: var(--font-bold);
    text-decoration: underline;
}

div.singleSec div.ViewMore {
    width: var(--width-85);
    margin: 0 auto;
    padding-top: var(--space-40);
    text-align: center;
}


/*--------------
404
--------------*/

section.page404 {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

div.page404-container {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--color-Navy);
    text-align: center;
}

div.page404-container h2 {
    font-size: 70px;
    line-height: 1;
}

p.page404-text {
    font-size: 14px;
    margin: 30px 0;
}

p.page404-button a {
    max-width: 200px;
    margin: 0 auto;
    display: block;
    background-color: #4f2a1a;
    padding: 10px 0;
    border-radius: 10px;
    font-size: 14px;
}

@media screen and (min-width: 600px) {

    div.page404-container h2 {
        font-size: 100px;
    }

    p.page404-text {
        font-size: 20px;
        margin: 40px 0;
    }

    p.page404-button a {
        font-size: 18px;
    }

}


/*--------------
footer
--------------*/

/* 協賛エリア */

.footerSponsorContainer {
    margin-bottom: 60px;
}

.footerSponsorBox {
    margin-top: 30px;
}

.footerSponsorBox:first-of-type {
    margin-top: 0;
}

.footerSponsor__title {
    margin-bottom: 2%;
    font-size: 1.8rem;
    text-align: center;
}

.footerSponsor__list01 {
    display: flex;
    flex-wrap: wrap;
}

.footerSponsor__list01 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 3.5vw 0;
}

.footerSponsor__list01 li {
  width: 48%;
}

.footerSponsor__list li:last-child:nth-child(odd) {
  margin: 0 auto;
}

.footerSponsor__list02 {
    width: 60%;
    margin: 0 auto;
}

/* ↑ここまで協賛エリア */

footer {
    position: relative;
}

.footerContainer {
    width: 85%;
    margin: 0 auto;
    padding: 50px 0 20px;
}

.footer__nav {
    margin-top: 30px;
}

.footer__nav li {
    margin-top: 0.8em;
    font-size: 1.6rem;
    text-align: center;
}

.footer__nav li:first-of-type {
    margin-top: 0;
}

.footer__topLinkButton {
    width: 24px;
    height: 24px;
    position: absolute;
    right: 5%;
    bottom: 20px;
}

.footer__copy {
    margin-top: 30px;
    font-size: 1.2rem;
    text-align: center;
}