@charset "UTF-8";
/* CSS Document */

:root {
	--color-01: #edeee9;
	--color-02: #f6f6ff;
	--color-03: #7700bb;
	--color-04: #70ae42;
	--color-05: #8a8075;
	--color-06: #2d89bb;

}

/*------------------------------------------------------

	common css

------------------------------------------------------*/
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
html { width: 100%; overflow: scroll; font-size: 10px; }
html.fixed {}
html.fixed body { height: 100%; position: fixed; width: 100%;}
body { font-family: 游明朝, YuMincho,"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG 明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #333; line-height: 1.8; background-color: #fff; overflow: hidden; letter-spacing: 0.05em;}
.container { width: 100%; margin-left: auto; margin-right: auto; position: relative;}
ul { list-style: none; }
ol { list-style: decimal; }
img { vertical-align: bottom; width: auto; max-width: 100%; height: auto; }
/*a:link { color: #000; text-decoration: none; }
a:visited { color: #000; }*/
a.fade:hover { text-decoration: none; background-color: #fff; color: #333; -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }


main { display: block; margin-bottom: 50px; }

@media (min-width: 768px) {
	body{ min-width: 1100px; }
	.container { max-width: 990px; }
	.w800 { max-width: 800px; margin-left: auto; margin-right: auto;}
    .w920 { max-width: 920px; margin-left: auto; margin-right: auto;}
	.w960 { max-width: 960px; margin-left: auto; margin-right: auto;}

	a:hover { text-decoration: underline; }
	a img:hover { opacity: 0.8; -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }

	.pc { display:block !important; }
	.sp { display:none !important; }

}

@media screen and (min-width:768px) and ( max-width:1080px) {
    .container { width: -webkit-calc(100% - 40px); width: calc(100% - 40px);}
}

@media (max-width: 767px) {
	body{ }
	.container { margin-left: 20px; margin-right: 20px; width: auto; }
	.pc { display: none !important; }
	.sp { display: block !important; }

}



/*------------------------------------------------------

    pageTop

------------------------------------------------------*/
#page-top { position: fixed; bottom:20px; right:20px; z-index:999; }
#page-top a { background: rgba(0,0,0,0.5); text-decoration: none; width:48px; height: 48px; text-align:center; display: block; transition: all 0.2s; }
#page-top a::before { content: ''; position: absolute; top: 50%; left: 0; right: 0; margin: -4px auto 0; transform: rotate(-45deg); border-top: 2px solid #fff; border-right: 2px solid #fff; width: 15px; height: 15px; }

@media (min-width: 768px) {
    #page-top a:hover { text-decoration:none; opacity: 0.8; }
}

@media (max-width: 767px) {
	#page-top { display: none;}
}


/*------------------------------------------------------

	animation

------------------------------------------------------*/
:root {
    --delay: 0.5s;
    --duration: 600ms;
    --iterations: 1;
}

/**
	js-fade-up
	animation
*/
.js-fade-up { opacity: 0;}
.js-fade-up.animation-on {
	animation-name: basic-animation;
	animation-duration: var(--duration);
	animation-fill-mode: forwards;
	animation-timing-function: ease-out;
}

/**
	js-fade
	animation
*/
.js-fade { opacity: 0;}
.js-fade.animation-on {
	animation-name: fade-only-animation;
	animation-duration: 800ms;
	animation-fill-mode: forwards;
	animation-timing-function: ease-out;
}

/**
	js-fade-scale
	animation
*/
.js-fade-scale { opacity: 0;}
.js-fade-scale.animation-on {
	animation-name: fade-scale-animation;
	animation-duration: 800ms;
	animation-fill-mode: forwards;
	animation-timing-function: ease-out;
}


/**
	下から上
*/
@keyframes basic-animation{
	0% {
		opacity: 0;
		transform: translateY(20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

/**
	フェードだけ
*/
@keyframes fade-only-animation{
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/**

*/
@keyframes fade-scale-animation{
	0% {
		opacity: 0;
		transform: scale(1.1);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}


.delay01 { animation-delay: 0.1s; }
.delay02 { animation-delay: 0.2s; }
.delay03 { animation-delay: 0.3s; }
.delay04 { animation-delay: 0.4s; }
.delay05 { animation-delay: 0.5s; }
.delay06 { animation-delay: 0.6s; }
.delay07 { animation-delay: 0.7s; }
.delay08 { animation-delay: 0.8s; }
.delay09 { animation-delay: 0.9s; }
.delay10 { animation-delay: 1.0s; }
.delay11 { animation-delay: 1.1s; }
.delay12 { animation-delay: 1.2s; }
.delay13 { animation-delay: 1.3s; }
.delay14 { animation-delay: 1.4s; }
.delay15 { animation-delay: 1.5s; }
.delay16 { animation-delay: 1.6s; }
.delay17 { animation-delay: 1.7s; }
.delay18 { animation-delay: 1.8s; }
.delay19 { animation-delay: 1.9s; }
.delay20 { animation-delay: 2.0s; }


.duration100 { animation-duration: 100ms !important; }
.duration200 { animation-duration: 200ms !important; }
.duration300 { animation-duration: 300ms !important; }
.duration400 { animation-duration: 400ms !important; }
.duration500 { animation-duration: 500ms !important; }
.duration600 { animation-duration: 600ms !important; }
.duration700 { animation-duration: 700ms !important; }
.duration800 { animation-duration: 800ms !important; }
.duration900 { animation-duration: 900ms !important; }
.duration1000 { animation-duration: 1000ms !important; }

@media (min-width: 768px) {

}

/*------------------------------------------------------

	visual

------------------------------------------------------*/
#visual { position: relative; background-color: var(--color-01); margin-bottom: 0;}
#visual::before { content: ""; position: absolute; width: 50%; height: 415px; background: url(/special/shinto2025/common/images/bg_visual-02.png) no-repeat center center / cover; top: 0; right: 0;}
#visual .cut-corner {
  width: 100%;
  clip-path: polygon(
    0 0,       /* 左上 */
    100% 0,    /* 右上 */
    77% 100%,  /* 右下を内側にカット */
    0 100%     /* 左下 */
  );
  overflow: hidden;
}
#visual .cut-corner img { width: 100%; display: block; }
#visual .title { position: absolute; color: #fff; left: 0; width: 100%;}
#visual .title::before { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(37,30,28,0.68); z-index: 1; }
#visual .title p { position: absolute;   border-radius: 50%; text-align: center;  }
#visual .title h1 { position: relative; z-index: 1; font-weight: 600;}
#visual .lead { position: absolute; top: 0; right: 0; width: 100%; left: 0; right: 0; margin: auto; display: flex; justify-content: end; }
#visual .lead p { writing-mode: vertical-rl; text-shadow: 7px 7px 10px rgba(0,0,0,0.3); }
#visual .lead p span { display: inline-block;}
#visual .img { position: absolute; }
#visual .img img {}


@media (min-width: 768px) {
	#visual {}
	#visual .cut-corner { max-width: 60%;}
	#visual .cut-corner img { object-fit: cover; height: 550px; width: 100%; }
	#visual .title { top: 90px; }
	#visual .title p { top: -72px; background: rgba(120, 98, 66, 0.87); width: 157px; height: 157px; font-size: 1.8rem; padding-top: 35px;}
	#visual .title h1 { font-size: 4rem; }
	#visual .lead { max-width: 910px;  top: 60px; }
	#visual .lead p { font-size: 4rem; }
	#visual .img { max-width: 170px; bottom: 0; right: 210px; }
	#visual .img img {}
}


@media (max-width: 767px) {
	#visual {}
	#visual::before { height: 325px; background: url(/special/shinto2025/common/images/bg_visual-02_sp.png) no-repeat center center / cover;}
	#visual .cut-corner { max-width: 60%; }
	#visual .cut-corner img { object-fit: cover; height: 450px; width: 100%; }
	#visual .title { top: 70px; }
	#visual .title .container { margin-left: 0; margin-right: 0;}
	#visual .title p { top: -52px; background: rgba(122, 0, 128, 0.87); width: 106px; height: 106px; font-size: 1.3rem; padding-top: 25px; left: 20px; }
	#visual .title h1 { font-size: 2.5rem; }
	#visual .lead { top: 230px; right: 20px; left: auto; z-index: 1; }
	#visual .lead p { font-size: 2.3rem; }
	#visual .img { max-width: 117px; bottom: -45px; right: 100px;}
	#visual .img img {}

}



/*------------------------------------------------------

	outline

------------------------------------------------------*/
#outline { background-color: var(--color-01); position: relative; padding-bottom: 20px; }
#outline .container {}
#outline .title { text-align: center; font-weight: 600; margin-bottom: 35px;}
#outline .title span { border-bottom: 1px solid #7700bb; display: inline-block; }
#outline .text { font-size: 1.6rem;}
#outline .text p {}

#outline::after { content: ""; position: absolute; bottom: -150px; left: 0; width: 0; height: 0; border-left: 100vw solid transparent; border-top: 150px solid var(--color-01); }

@media (min-width: 768px) {
	#outline { padding-top: 80px; }
	#outline .container {}
	#outline .title { font-size: 2.2rem; }
	#outline .text { max-width: 640px; margin-left: auto; margin-right: auto; }
	#outline .text p {}
}

@media (max-width: 767px) {
	#outline { padding-top: 130px; }
	#outline .container {}
	#outline .title { font-size: 1.6rem; }
	#outline .title span { padding-bottom: 8px; }
	#outline .text { margin-left: 20px; margin-right: 20px;}
	#outline .text p {}

	#outline::after { bottom: -60px; border-top-width: 60px; }
}



/*------------------------------------------------------

	detail

------------------------------------------------------*/
#detail { margin-bottom: 0;}
#detail .container {}
#detail section {}
#detail .title { border: 1px solid #000; height: 45px; line-height: 45px; width: 246px; text-align: center; margin-bottom: 40px;}
#detail .l_col-contents {}
#detail .l_col-contents .text { font-size: 1.4rem; position: relative;}
#detail .l_col-contents .text p {}
#detail .l_col-contents .table-wrap { background-color: var(--color-02); box-shadow: 0px 0px 12px 0px rgba(201,201,201,0.75); padding: 30px 20px;}
#detail .l_col-contents .table-wrap table {}
#detail .l_col-contents .table-wrap table tr {}
#detail .l_col-contents .table-wrap table th { border-bottom: 1px solid #8c8c8c; border-right: 1px solid #8c8c8c; width: 23%; }
#detail .l_col-contents .table-wrap table td { border-bottom: 1px solid #8c8c8c; border-right: 1px solid #8c8c8c; text-align: center; vertical-align: middle; }
#detail .l_col-contents .table-wrap table tr th:last-child ,
#detail .l_col-contents .table-wrap table tr td:last-child { border-right: none; }
#detail .l_col-contents .table-wrap table tr:last-child td { border-bottom: none;}
#detail .l_col-contents .table-wrap table tr td:last-child { text-align: left;}
#detail .l_col-contents .table-wrap table tr th:last-child { width: 31%;}

#gakubusei {}
#senkoukasei {}

#gakubusei .text::before { content: ""; position: absolute; width: 114px; height: 98px; background: url(/special/shinto2025/common/images/bg_detail-01.png) no-repeat left top / cover;}
#senkoukasei .text::before { content: ""; position: absolute; width: 118px; height: 106px; background: url(/special/shinto2025/common/images/bg_detail-02.png) no-repeat left top / cover;}


#other { background-color: var(--color-01); padding: 15px 0;}
#other .container {}
#other a { background: url(/special/shinto2025/common/images/bg_other-link.png) no-repeat left top / cover; display: block; margin-left: auto; margin-right: auto; color: var(--color-03); font-size: 1.6rem; text-decoration: none; font-weight: 700;}
#other a img { width: 144px; height: 26px;}

@media (min-width: 768px) {
	#detail {}
	#detail .container {}
	#detail section { padding-left: 100px;}
	#detail .title { display: inline-block; font-size: 1.8rem; }
	#detail .l_col-contents {}
	#detail .l_col-contents .text { width: 40%; max-width: 280px; }
	#detail .l_col-contents .text p {}
	#detail .l_col-contents .table-wrap { width: 60%; max-width: 515px; }
	#detail .l_col-contents .table-wrap table {}
	#detail .l_col-contents .table-wrap table tr {}
	#detail .l_col-contents .table-wrap table th { font-size: 1.2rem; padding: 10px; }
	#detail .l_col-contents .table-wrap table td { font-size: 1.4rem; padding: 20px 10px; }
	#detail .l_col-contents .table-wrap table tr td:last-child { font-size: 1.2rem; }

	#gakubusei { margin-bottom: 90px;}
	#senkoukasei { margin-bottom: 60px;}
	#gakubusei .text::before { right: 0; bottom: 20px; }
	#senkoukasei .text::before { left: 0; bottom: 10px;}

	#other {}
	#other .container {}
	#other a { max-width: 735px; height: 84px; line-height: 84px; text-align: center;}
	#other a img { vertical-align: middle; margin-left: 15px;}


}


@media (max-width: 767px) {
	#detail {}
	#detail .container {}
	#detail section { margin-bottom: 50px;}
	#detail .title { margin-left: auto; margin-right: auto; font-size: 1.6rem;}
	#detail .l_col-contents {}
	#detail .l_col-contents .text { margin-left: 20px; margin-right: 20px; margin-bottom: 35px;}
	#detail .l_col-contents .text p {}
	#detail .l_col-contents .table-wrap { padding: 20px 15px; margin-bottom: 0; width: 100%;}
	#detail .l_col-contents .table-wrap table {}
	#detail .l_col-contents .table-wrap table tr {}
	#detail .l_col-contents .table-wrap table th { font-size: 1.1rem; padding: 10px 5px; }
	#detail .l_col-contents .table-wrap table td { font-size: 1.1rem; padding: 5px; }
	#detail .l_col-contents .table-wrap table tr td:last-child {}

	#gakubusei {}
	#senkoukasei {}
	#gakubusei .text::before { right: 0; bottom: -70px; z-index: -1; }
	#senkoukasei .text::before { right: 0; bottom: -70px; z-index: -1; }

	#other {}
	#other .container {}
		#other .container::before { content: ""; position: absolute; width: calc(100% - 10px); height: calc(100% - 10px); border: 1px solid var(--color-06); left: 0; top: 0; right: 0; bottom: 0; margin: auto; }

	/*
	#other a {
		background: none;
        background: url(/special/shinto2025/common/images/bg_other-link-01.png) no-repeat left top / 70px auto, url(/special/shinto2025/common/images/bg_other-link-02.png) no-repeat right bottom / 70px auto;
        min-height: 100px;
        padding: 20px 50px 20px;
	}
	#other a img {
        display: block;
        margin-left: auto;
        margin-top: 10px;
	}
*/
	#other a {
		background: none;
        min-height: 100px;
        padding: 20px 50px 20px;
		position: relative; z-index: 1;
	}
	#other a::before { content: ""; width: 70px; height: 70px; position: absolute; left: 0; top: 0; background: url(/special/shinto2025/common/images/bg_other-link-01.png) no-repeat left top / cover; z-index: -1;}
	#other a::after { content: ""; width: 70px; height: 70px; position: absolute; right: 0; bottom: 0; background: url(/special/shinto2025/common/images/bg_other-link-02.png) no-repeat left top / cover; z-index: -1;}

	#other a img {
        display: block;
        margin-left: auto;
        margin-top: 10px;
		margin-right: 10px;
	}


}



/*------------------------------------------------------

	senkou

------------------------------------------------------*/
#senkou { background-color: var(--color-01); margin-bottom: 0;}
#senkou > .title { background: url(/special/shinto2025/common/images/st_senkou.png) no-repeat center center / cover; text-align: center; margin-bottom: 25px;}
#senkou > .title h2 { -webkit-text-stroke: 6px #fff; text-stroke: 6px #fff; paint-order: stroke; font-weight: 600; }
#senkou .container {}
#senkou .text { font-size: 1.4rem; margin-bottom: 30px;}
#senkou .text p {}

#senkou .container > .title { font-size: 1.4rem;}
#senkou .container > .title::before { content: "■";}
#senkou table { border-left: 1px solid #000; border-top: 1px solid #000; }
#senkou table tr {}
#senkou table th { border-right: 1px solid #000; border-bottom: 1px solid #000;}
#senkou table td { border-right: 1px solid #000; border-bottom: 1px solid #000; text-align: center; vertical-align: middle; }
#senkou table tr th:last-child ,
#senkou table tr td:last-child {}

@media (min-width: 768px) {
	#senkou { padding-bottom: 130px;}
	#senkou > .title { height: 124px; line-height: 124px;}
	#senkou > .title h2 { font-size: 2.2rem;}
	#senkou .container {}
	#senkou .text { text-align: center;}
	#senkou .text p {}

	#senkou .container > .title { max-width: 700px; margin-left: auto; margin-right: auto; }
	#senkou table { max-width: 700px; margin-left: auto; margin-right: auto; width: 100%;}
	#senkou table tr {}
	#senkou table th { font-size: 1.4rem; padding: 5px 10px; }
	#senkou table td { font-size: 1.4rem; padding: 10px; }
}

@media (max-width: 767px) {
	#senkou { padding-bottom: 50px; }
	#senkou > .title { padding: 30px 10px;}
	#senkou > .title h2 { font-size: 2rem;}
	#senkou .container {}
	#senkou .text { margin-left: 20px; margin-right: 20px;}
	#senkou .text p {}

	#senkou .container > .title {}
	#senkou table { width: 100%;}
	#senkou table tr {}
	#senkou table th { font-size: 1.1rem; padding: 5px; }
	#senkou table td { font-size: 1.1rem; padding: 10px 5px; }
}



/*------------------------------------------------------

	trivia

------------------------------------------------------*/
#trivia { margin-bottom: 0;}
#trivia .l_col-2 {}
#trivia .l_col-2 > div {}
#trivia .l_col-2 .title { margin-bottom: 20px;}
#trivia .l_col-2 .title img { max-width: 310px; height: auto;}
#trivia .l_col-2 .text { font-size: 1.4rem;}
#trivia .l_col-2 .text p {}
#trivia .l_col-2 figure { margin: 0; }
#trivia .l_col-2 figure img { height: auto; position: relative; }

@media (min-width: 768px) {
	#trivia { padding-top: 30px; margin-bottom: -125px;}
	#trivia .l_col-2 { padding-left: 70px; padding-right: 70px;}
	#trivia .l_col-2 > div { max-width: 335px;}
	#trivia .l_col-2 .title {}
	#trivia .l_col-2 .title img {}
	#trivia .l_col-2 .text {}
	#trivia .l_col-2 .text p {}
	#trivia .l_col-2 figure {}
	#trivia .l_col-2 figure img { top: -125px;  max-width: 310px; }

}

@media (max-width: 767px) {
	#trivia { padding-top: 50px;}
	#trivia .l_col-2 {}
	#trivia .l_col-2 > div {}
	#trivia .l_col-2 .title { text-align: center;}
	#trivia .l_col-2 .title img {}
	#trivia .l_col-2 .text { margin-left: 20px; margin-right: 20px;}
	#trivia .l_col-2 .text p {}
	#trivia .l_col-2 figure {}
	#trivia .l_col-2 figure img {  max-width: 240px; }

}



/*------------------------------------------------------

	reduction-system

------------------------------------------------------*/
#reduction-system { background-color: var(--color-01); position: relative;}
#reduction-system .l_col-2 {}
#reduction-system .l_col-2 figure { margin-bottom: 0;}
#reduction-system .l_col-2 figure img {}
#reduction-system .l_col-2 > div {}
#reduction-system .l_col-2 .title { color: var(--color-04); font-size: 1.8rem; margin-bottom: 15px;}
#reduction-system .l_col-2 .text { font-size: 1.4rem; margin-bottom: 25px;}
#reduction-system .l_col-2 .text p {}
#reduction-system .l_col-2 > div figure { max-width: 338px; margin-bottom: 0; margin-left: auto; margin-right: auto;}
#reduction-system .l_col-2 > div figure img {}

#reduction-system .mezasu { text-align: center; padding-top: 100px; padding-bottom: 10px; position: relative;}
#reduction-system .mezasu p { border-top: 1px solid var(--color-03); border-bottom: 1px solid var(--color-03); position: relative; z-index: 1;}
#reduction-system .mezasu figure { max-width: 260px; height: auto; transform: rotate(15deg); z-index: 1; position: absolute;}
#reduction-system .mezasu figure img {}
#reduction-system .mezasu::before { content: ""; width: 148px; height: 148px; position: absolute; background: url(/special/shinto2025/common/images/bg_reduction-system-01.png) no-repeat left top / cover;}
#reduction-system .mezasu::after { content: ""; width: 126px; height: 128px; position: absolute; background: url(/special/shinto2025/common/images/bg_reduction-system-02.png) no-repeat left top / cover;}

#reduction-system::after { content: ""; position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 50vw solid transparent; border-right: 50vw solid transparent; border-top: 60px solid var(--color-01); z-index: -1;}


@media (min-width: 768px) {
	#reduction-system { margin-bottom: 120px;}
	#reduction-system .l_col-2 { padding-left: 30px;}
	#reduction-system .l_col-2 figure { max-width: 400px; position: relative; z-index: 1;}
	#reduction-system .l_col-2 figure img {}
	#reduction-system .l_col-2 > div { max-width: 420px; padding-top: 45px;}
	#reduction-system .l_col-2 .title {}
	#reduction-system .l_col-2 .text {}
	#reduction-system .l_col-2 .text p {}
	#reduction-system .l_col-2 > div figure {}
	#reduction-system .l_col-2 > div figure img {}

	#reduction-system .mezasu { }
	#reduction-system .mezasu p { font-size: 2.5rem; max-width: 700px; margin-left: auto; margin-right: auto; height: 100px; line-height: 100px;}
	#reduction-system .mezasu figure { top: 50px; right: -100px; }
	#reduction-system .mezasu figure img {}
	#reduction-system .mezasu::before { left: 30px; top: -30px;}
	#reduction-system .mezasu::after { right: 0; bottom: -90px;}
}

@media (max-width: 767px) {
	#reduction-system { padding-top: 30px;}
	#reduction-system .l_col-2 { flex-direction: column-reverse;}
	#reduction-system .l_col-2 > figure { position: relative; z-index: 1; width: 80%; margin-left: auto; margin-right: auto; }
	#reduction-system .l_col-2 > figure img {}
	#reduction-system .l_col-2 > div {}
	#reduction-system .l_col-2 .title { text-align: center;}
	#reduction-system .l_col-2 .text { margin-left: 20px; margin-right: 20px;}
	#reduction-system .l_col-2 .text p {}
	#reduction-system .l_col-2 > div figure { width: 80%;}
	#reduction-system .l_col-2 > div figure img {}

	#reduction-system .mezasu { }
	#reduction-system .mezasu p { font-size: 2rem; padding: 20px; }
	#reduction-system .mezasu figure { top: 5px; right: -50px; max-width: 180px; }
	#reduction-system .mezasu figure img {}
	#reduction-system .mezasu::before { left: 0; top: -10px; width: 98px; height: 98px; }
	#reduction-system .mezasu::after { right: -10px; bottom: -50px; width: 98px; height: 98px;}

	#reduction-system::after { bottom: -40px; border-top-width: 40px;}
}


/*------------------------------------------------------

    header

------------------------------------------------------*/
header {}


#g_nav { position: fixed; width: 100%; transition: all 0.6s; z-index: 50; }
#g_nav ul li a { display: block; font-weight: bold; text-align: center; text-decoration: none; transition: 0.3s; }
#g_nav ul li a:hover { opacity: 0.6; }


@media (min-width: 768px) {
    #g_nav { top: 150px; right: -320px; background: rgba(255,255,255,0.67); padding: 20px 60px 20px 0; max-width: 318px; position: fixed; }
    #g_nav.open { right: 0; }
    #g_nav ul { border-right: 1px solid #000; }
    #g_nav ul li a { color: #000; padding: 8px; font-size: 1.6rem; }
    #menu_pc .menu_wrap { position: fixed; top: 70px; right: 0; z-index: 100; background-color: rgba(232,255,109,0.6); width: 32px; text-align: center; padding: 8px 0; }
    #menu_pc .menu_wrap [class^='header_'] { display: block; padding: 4px; }
    /* #menu_pc .menu_wrap .header_fb { padding: 0px; padding-top: 40px; } */
    /* #menu_pc .menu_wrap .header_insta { padding: 0px; } */
    #menu_pc .menu_wrap .menu { transition: 0.3s; color: #000; font-size: 1.4rem; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; margin: 13px auto; line-height: 1; font-weight: bold; height: 46px; }
	#menu_pc .menu_wrap .menu:hover { opacity: 0.7; }
	#menu_pc .menu_wrap > a { transition: 0.3s; }
	#menu_pc .menu_wrap > a:hover { opacity: 0.7; }
    #menu_pc .menu { cursor: pointer; }
    #menu_pc .menu > span { opacity: 1; transition: all 0.6s; }
    #menu_pc .menu.open > span { opacity: 0; }
    #menu_pc .menu .close { width: 35px; height: 35px; position: absolute; top: 110px; right: 0; left: -1px; margin: 0 auto; }
    #menu_pc .menu .close span { opacity: 0; transition: all 0.6s; display: block; background: #000; width: 20px; height: 2px; position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; }
    #menu_pc .menu.open .close span { opacity: 1; }
    #menu_pc .menu.open .close span:nth-of-type(1) { transform: rotate( 45deg); }
    #menu_pc .menu.open .close span:nth-of-type(2) { transform: rotate( -45deg); }
}

@media (max-width: 767px) {
    #g_nav { bottom: -340px; left: 0; right: 0; margin-left: auto; background: rgba(63, 60, 60, 0.55); width: 200px; }
    
    #g_nav.open { bottom: 62px; }
    #g_nav ul li:first-of-type { text-align: center; }
    #g_nav ul li:first-of-type img { max-width: 16px; }
    #g_nav ul li:not(:last-of-type) { border-bottom: 1px solid #fff; }
    #g_nav ul li a { color: #fff; padding: 5px; font-size: 1.6rem; }
    #g_nav ul li.sp a { padding: 1px 0px 7px; }
    #menu_sp_wrap { position: fixed; bottom: 0; left: 0; width: 100%; background-size: 100%; z-index: 999; background-color: var(--color-05); }

    #menu_sp_wrap ul  { display: -webkit-flex; display: flex;
    -webkit-justify-content: space-between; justify-content: space-between; }
    #menu_sp_wrap ul { padding: 6px 30px; }
    #menu_sp_wrap ul li img { height: 50px; }

    #g_nav .contact { position: relative; }
    #g_nav .contact::before { content: ''; display: inline-block;background-image: url(/special/shinto2025/common/images/icon_mail_white.svg); width: 10px; height:8px; background-size: cover; margin-right: 5px;   }
    #g_nav .document { position: relative; }
    #g_nav .document::before { content: ''; display: inline-block;background-image: url(/special/shinto2025/common/images/icon_book_white.svg); width: 15px; height: 12px; background-size: cover; margin-right: 5px; top: 3px; position: relative;  }

    #menu_sp span { display: block; background: rgba(0,0,0,1); height: 2px; }
    #menu_sp span:nth-of-type(1) { margin-bottom: 4px; }
    #menu_sp span { transition: all .4s; }
    #menu_sp.open span:nth-of-type(1) { transform: translateY(3px) rotate(-45deg); }
    #menu_sp.open span:nth-of-type(2) { transform: translateY(-3px) rotate(45deg); }
}


/*------------------------------------------------------

    footer

------------------------------------------------------*/

footer .copyright { text-align: center; color: #000; width: 100%; padding:20px 0px; font-size: 14px; font-weight: bold;}

#foot_navi {}
#foot_navi ul {}
#foot_navi ul li { position: relative;}
#foot_navi ul li::before ,
#foot_navi ul li::after { content: ""; position: absolute; width: 1px; height: 70%; background-color: #fff; top: 15%; z-index: 1;}
#foot_navi ul li::before { left: 0; }
#foot_navi ul li::after { right: 0;}


#foot_navi ul li a { border: 1px solid #000; box-sizing: border-box; font-weight: bold; font-size: 1.6rem; position: relative; display: block; text-decoration: none;  color: #000; }


#foot_cont .foot_logo {}
#foot_cont .contact_sns { font-size: 1.6rem; font-weight: bold; color: #000; font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", " 游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic,メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
#foot_cont .contact_sns * { display: inline-block; line-height: 25px; }
#foot_cont .contact_sns a { width: 25px; height: 25px; }

#foot_cont .l_col-2 { -webkit-align-items: center; align-items: center; }

#foot_cont .contact_sns > div:first-child { margin-right: 30px; }
#foot_cont .contact_sns > div:last-child a:not(:last-child) { margin-right: 15px; }
#foot_cont .contact_sns > div > p { margin-right: 15px; }

@media (min-width: 768px) {
	footer { max-width: 1100px; margin-left: auto; margin-right: auto;}
    #foot_navi { margin-bottom: 60px;  }
    #foot_navi ul { padding: 0px 55px;  }
    #foot_navi ul li a { width: 290px; height: 60px; text-align: center; padding-top: 15px;  }

	#foot_cont { padding-left: 30px; padding-right: 30px;}
    #foot_cont .foot_logo { width: 240px; height: auto; display:block; }
    #foot_cont .contact_sns { text-align: right;  }
    
}


@media (max-width: 767px) {
	footer { margin-left: 20px; margin-right: 20px;}
    #foot_navi { margin-bottom: 30px;  }
    #foot_navi ul li { width: 100%; }
    #foot_navi ul li a { padding: 20px; }
    #foot_cont .contact_sns { text-align: left;  }
    #foot_cont .contact_sns > div:first-child { margin-bottom: 10px;}


}


/*------------------------------------------------------



------------------------------------------------------*/
.js_text-anim {
	/*
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  */
  overflow: hidden;
  text-transform: uppercase;

}

.js_text-anim.animation-on {
  --y: 0;
}

.char {
  display: inline-block;
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
  transition-delay: calc(0.04s * var(--char-index));
}


@media (min-width: 768px) {
.char {
  transform: translateY(var(--y, 110%));
}
}

@media (max-width: 767px) {
.char {
  transform: translateY(var(--y, 240%));
}
}



/*------------------------------------------------------



------------------------------------------------------*/


@media (min-width: 768px) {

}

@media (max-width: 767px) {

}
