@charset "UTF-8";
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;-webkit-text-size-adjust:100%;}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@supports not (min-block-size:100dvb){:where(html){block-size:100%}
}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}
}:where(body){block-size:100%;block-size:100dvb;line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px}:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

.cf:before,.cf:after{content:"";display:table;}
.cf:after{clear:both;}
.cf{*zoom:1;}


html{font-size:62.5%;}
body{font-size:15px; font-size:1.5rem; font-family:'Noto Sans JP',system-ui, "Hiragino Sans", "YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif; letter-spacing:0.05em; line-height:1.7; text-align:center; background:#fff; -webkit-text-size-adjust:100%; color:#3d4b24; max-height: 100%; box-sizing:content-box; margin:0;}

img {width:100%; max-width:100%; height:auto;}
img[src$=".svg"] {width: 100%;}

/*Layout*/
a{color:#3d4b24; text-decoration:none; opacity: 1; transition: 0.5s; -webkit-transition:0.5s; text-decoration:none;}
a:hover{opacity: 0.7; transition: 0.5s; -webkit-transition:0.5s;}
a.line{text-decoration:underline;}

br.pc{display:none;}
br.smp{display:block;}
@media only screen and (min-width:540px) {
br.smp{display:none;}
}
@media only screen and (min-width:880px) {
br.pc{display:block;}
}

.sml{padding-left:4px; font-size:0.8em;}

.box{max-width:800px; padding:10px 20px;}
@media only screen and (min-width:1010px) {
.box{padding:10px 0;}
}

body{}
header{padding-top:50px;}
header h1{width:90%; max-width:420px; margin:0 auto;}

@media only screen and (min-width:360px) {
header h1{}
}

#sec01{margin:30px 0; padding:30px 3vw; background:#dbfe66; color:#3d4b24;}
#sec01 h2{font-size:17px; font-size:clamp(1.6rem, 0.833rem + 2.67vw, 2rem); color:#3d4b24; font-weight: 900; line-height:1.6;}
#sec01 p{font-size:15px; font-size:min(5vw,1.6rem); color:#3d4b24; font-weight:500; text-align:left; max-width:840px; margin:16px auto 0; line-height:1.6; letter-spacing:0;}
@media only screen and (min-width:880px) {
#sec01 p{font-size:16px; text-align: center;}
}

#datearea{width:90%; margin:0 auto;}
#datearea #title img{max-width:496px; margin:0 auto 16px auto;}
#datearea #date img{max-width:435px; margin:0 auto;}
#datearea .address{margin-top:8px; font-size:16px; font-size:1.6rem; font-weight:400;}
#datearea .time{margin-top:20px; font-size:18px; font-size:1.8rem; font-weight:700;}

#sec02{margin:30px 0 0 0; padding:30px 0 10px; background:#dbfe66;}
#sec02 ul{width:90%; margin:0 auto 5px; max-width:1000px;}
#sec02 ul li:first-child{margin-bottom:30px;}
#sec02 ul p.name{margin-top:8px; font-size:22px; font-size:min(9vw,2.2rem);font-weight:600; text-align:center; color:#3d4b24;}

@media only screen and (min-width:740px) {
#sec02 ul{display:flex;}
#sec02 ul li{width:50%;}
#sec02 ul li:first-child{margin:0;}
#sec02 ul p.name{font-size:28px; font-size:min(9vw,2.8rem);}
#sec02 .content {font-size:15px;}
}
@media only screen and (min-width:900px) {
#sec02 ul p.name{font-size:32px; font-size:min(9vw,3.2rem);}
}

#gallery{padding:30px 0; padding:30px 3vw;}
#gallery p.right{max-width:1200px; margin:20px auto; text-align:right;}
#gallery h3{margin-top:30px; font-size:37px; font-size:3.7rem; font-weight:600; color:#3d4b24;}
#gallery h3:before{display:block; content:""; margin:0 auto 12px auto; background:url("../lib/tit_icon.svgz"); width:28px; height:13px;}
#gallery ul{max-width:1200px; margin:20px auto; display:flex; justify-content:flex-start; flex-wrap:wrap;}
#gallery ul li{max-width:250px; width: calc(33% - 8px); margin:4px;}
#gallery ul li{overflow:hidden;}
#gallery ul li img{object-fit:cover; aspect-ratio:800 / 533;}
#gallery ul li img.pt01{object-position: center -30px;}
#gallery ul li img.pt02{object-position: center -10px;}
#gallery ul li img.pt03{object-position: center -40px;}
#gallery ul li img.pt04{object-position: center -70px;}
#gallery ul li img.pt05{object-position: center -100px;}
@media only screen and (min-width:740px) {
#gallery ul{max-width:1200px; margin:20px auto;}
#gallery ul li{max-width:250px; width: calc(16.6% - 16px); margin:8px;}
}


#goods{padding:30px 0; padding:5px 3vw 30px; background:#fff; color:#3d4b24;}
#goods h3{margin-top:30px; font-size:30px; font-size:3rem; font-weight:600; color:#3d4b24;}
#goods h3:before{display:block; content:""; margin:0 auto 12px auto; background:url("../lib/tit_icon.svgz"); width:28px; height:13px;}
#goods img{margin:30px auto; max-width:1200px;}

#ticket{padding:30px 0; padding:30px 0 60px;}
#ticket h3{margin-top:30px; font-size:37px; font-size:3.7rem; font-weight:600;  color: #3d4b24;}
#ticket h3:before{display:block; content:""; margin:0 auto 12px auto; background:url("../lib/tit_icon.svgz"); width:28px; height:13px;}
#ticket ul{width:290px; text-align:left; margin:0 auto;}
#ticket ul.imp{width:auto;}
#ticket .price{position:relative; margin-top:30px; font-size:18px; font-size:1.8rem; font-weight:600;}
#ticket .imp{display:flex; gap:4px; justify-content:center; margin-top:8px; font-size:13px; font-size:1.3rem; font-weight:400;}
#ticket .imp li:before{content:"※ ";}
#ticket .imp li{text-align:left;}
#ticket h4{max-width:400px; width:100%; margin:40px auto 8px auto; padding:8px 0; font-size:18px; font-size:min(5vw,1.8rem); font-weight:700; background:#3d4b24; color:#fff; text-align:center;}
#ticket h4 a{color:#fff;}
#ticket .ticketend{margin-top:30px; font-weight:600; font-size:16px; font-size:1.6rem;}
#ticket del{font-size:16px; font-size:1.6rem;}
#ticket .ticketdate{font-size:18px; font-size:1.8rem; font-weight:700;}
#ticket .btn a,#ticket .btn.soldout{position:relative; display:inline-block; margin:16px 8px 0 8px; padding:8px; max-width:320px; width:90%; background:#ffa500; color:#3d4b24; font-size:17px; font-size:1.7rem; font-weight:700; text-align:center; text-decoration:none; border-radius:50px;}
#ticket .btn.soldout{ max-width:300px;}
#ticket .btn a:after{content:""; width: 6px; height: 6px; border-top: 1px solid #3d4b24; border-right: 1px solid #000; -webkit-transform: rotate(45deg); position: absolute; top:calc( 50% - 3px ); right: 20px; transform: rotate(45deg);}
@media only screen and (min-width:740px) {
#ticket ul{width:inherit;}
#ticket .btn a{font-size:19px; font-size:1.9rem;}
#ticket .price ul{display:flex; justify-content: center; text-align:center;}
#ticket .imp{display:flex; justify-content: center; font-size:14px; font-size:1.4rem;}
}
#information{padding:30px 0; padding:30px 3vw; color:#eee; background: #dbfe66;}
#information h3{margin-top:30px; font-size:30px; font-size:3rem; font-weight:600; color:#3d4b24;}
#information h3:before{display:block; content:""; margin:0 auto 12px auto; background:url("../lib/tit_icon.svgz"); width:28px; height:13px;}
#information ul{max-width:800px; margin:20px auto;}
#information p{max-width:800px; margin:20px auto; text-align:left;}
#information ul li{margin-bottom:8px; margin-left:30px;}
#information ul li:before{content:"※ ";}
#information ul li{text-align:left; text-indent:-1.2em; padding-left:1em;}
@media only screen and (min-width:740px) {
#information ul{margin:20px auto 20px auto;}
}

#movie{margin:30px 0 0 0;padding:5px 3vw 30px; background:#dbfe66;}
#movie h3{margin-top:30px; font-size:37px; font-size:3.7rem; font-weight:600; color:#3d4b24;}
#movie h3:before{display:block; content:""; margin:0 auto 12px auto; background:url("../lib/tit_icon.svgz"); width:28px; height:13px;}
.mvset{width:100%; padding:20px;}
.moviebox{position:relative; max-width:600px; width:100%; margin-bottom:20px;}
.movie iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.movie{
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
}

@media only screen and (min-width:640px) {
.moviebox{position:relative; max-width:600px; margin:20px auto;}
.mvset{display:flex; gap:16px; width:100%; max-width:1200px; margin:0 auto;}
}

#contact{padding:30px 0; padding:30px 3vw; font-size:14px; font-size:1.4rem; font-weight:400;}


footer{padding:30px 0; background:#323a22; font-size:12px; font-size:1.2rem; font-weight:400; text-align:center; color:#fff;}

footer .copy{margin-top:30px; font-size:12px; font-size:1.2rem; color:#fff; letter-spacing:0; font-weight:100;}


/*fadein*/
.fadeUpTrigger,fadeDownTrigger,fadeLeftTrigger,fadeRightTrigger{opacity: 0;}
.fadeUp{animation-name:fadeUpAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeUpAnime{
from {opacity: 0; transform: translateY(30px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeDown{animation-name:fadeDownAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeDownAnime{
from {opacity: 0; transform: translateY(-30px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeLeft{animation-name:fadeLeftAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0; }
@keyframes fadeLeftAnime{
from {opacity: 0; transform: translateX(-30px);}
to {opacity: 1; transform: translateX(0);}
}

.fadeRight{animation-name:fadeRightAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeRightAnime{
from {opacity: 0; transform: translateX(30px);}
to {opacity: 1; transform: translateX(0);}
}

/*TOP PAGE*/
#pagetop{position:fixed; bottom:20px; right:10px; font-size:1.3rem; font-weight:700; z-index:999;}
#pagetop a{background: rgba(0, 0, 0, 0.70); text-decoration: none; color: #222222; padding:10px 20px; text-align: center; display: block; border-radius: 3px;}
#pagetop a:hover{text-decoration: none;}