@charset "UTF-8";
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:where([hidden]:not([hidden='until-found'])){display:none!important}
:where(html){-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}
:where(body){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}
:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}
:where(: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 + .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}

html{font-size:62.5%}
body{margin:0;font-size:1.5rem;font-family:"Noto Sans JP",system-ui,"Hiragino Sans","YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif;letter-spacing:.05em;line-height:1.5;text-align:center;background:#fff;color:#3f3f3f;-webkit-text-size-adjust:100%; overflow-x: hidden;}
img{width:100%;max-width:100%;height:auto}
html{background:#fff}
body{background:none}
#container{position:relative;isolation:isolate;z-index:0}
#container::before{content:"";position:fixed;inset:0;z-index:-1;background:url("../lib/bg3.jpg") top center / cover no-repeat;pointer-events:none}
#fv{width:100%}
#fv .fv-inner{width:100%}
#content{width:100%;padding:8vw 0 100px;background:rgba(255,255,255,.56)}
#information{padding:0 4vw}
#content h1{padding:0 8vw}
#content h2{width:58vw;max-width:360px;margin:20px auto}
#content h3{margin:32px auto 16px;padding:4px 0;font-family:"fot-tsukuardgothic-std",sans-serif;font-weight:700;font-style:normal;font-size:1.9rem;background:#db096e;color:#fff;border-radius:50px}
#content h4{margin:32px auto 16px;padding:4px 0;font-family:"fot-tsukuardgothic-std",sans-serif;font-weight:700;font-style:normal;font-size:1.6rem;border:2px solid #db096e;color:#db096e;border-radius:50px}
#content p,#content ul{margin-top:16px;padding:0 20px;font-size:clamp(1.4rem,1.2rem + 0.5vw,1.6rem);text-align:left;line-break:strict;word-break:break-word;overflow-wrap:break-word}
#content p .day{font-size:.8em}
#content ul{margin:0 0 0 ０;}
#content ul li{padding-left:1rem;text-indent:-1rem;}
#content ul li:before{content:"• "}
#content ul.ast{margin:0 0 0 2px;font-size:clamp(1.3rem,1.2rem + 0.5vw,1.5rem)}
#content ul.ast li{padding-left:1rem;text-indent:-1rem}
#content ul.ast li::before{content:"※"}

#btnarea{width:100%;padding:8px 0;background:rgba(255,255,255,.8)}
#btnarea .date{display:flex;gap:4px;justify-content:center;align-items:center}
#btnarea h3{margin:0;padding:2px 8px;font-family:"fot-tsukuardgothic-std",sans-serif;font-weight:700;font-style:normal;font-size:1.5rem;background:#db096e;color:#fff;letter-spacing:0}
#btnarea p{margin:0;font-weight:600;letter-spacing:0}
#btnarea p span{font-size:.8em}
#btnarea .btn{margin-top:6px}
#btnarea .btn a{position:relative;display:flex;align-items:center;justify-content:center;width:min(90vw,340px);height:50px;margin:0 auto;padding:0;background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.35)),#00c4b3;color:#fff;text-decoration:none;border-radius:50px;font-size:1.9rem;font-weight:700;overflow:hidden}
#btnarea .btn a::after{content:"";position:absolute;right:10px;display:block;width:34px;height:34px;background:url("../lib/arrow.png") center / contain no-repeat}
.btn-fixed-sp{position:static}

footer{padding-top:40px; font-size:1.3rem;}

@media screen and (max-width:799px){
#content{padding:8vw 0 120px}
.btn-fixed-sp{position:fixed;left:0;right:0;bottom:0;padding:0 12px calc(env(safe-area-inset-bottom) + 12px);z-index:9999;transform:translateY(calc(100% + env(safe-area-inset-bottom) + 24px));opacity:0;pointer-events:none;transition:transform .35s ease,opacity .35s ease}
.btn-fixed-sp.is-show{transform:translateY(0);opacity:1;pointer-events:auto}
.btn-fixed-sp .btn a{min-height:56px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
}

@media screen and (min-width:800px){
#container {
  display: flex;
  align-items: flex-start;
  max-width: 1400px;
	gap:16px;
  margin: 0 auto;
  min-height: 100vh;
}

#fv {
  position: sticky;
  top: 0;
  width: 45%;
  height: 100vh;
  flex-shrink: 0;
}

#content {
  width: 55%;
  min-height: 200vh;
	margin-top:10px;
  background: rgba(255, 255, 255, .56);
  border-top-right-radius: 15px;
  border-top-left-radius: 15px;
  padding-top: 40px;
}
/* #container{min-height:100vh; max-width:1400px; margin:0 auto;}
#fv{position:sticky;top:0;left:0;width:45%;height:100vh}
#fv .fv-inner{width:100%;height:100%}
#content{width:51%;min-height:100vh;margin-left:46%;background:rgba(255,255,255,.56); margin-top:0; border-top-right-radius:15px; border-top-left-radius:15px; padding-top:40px;} */
#content h2{width:53%;max-width:360px;margin:20px auto}
#information{padding:0 20px;}
#btnarea{padding:8px 0;background:none}
#btnarea .date{display:block;}
#btnarea p{font-size:1.8rem;}
#btnarea h3{width:88%;margin:32px auto 8px;padding:4px 0;font-family:"fot-tsukuardgothic-std",sans-serif;font-weight:700;font-style:normal;font-size:1.9rem;background:#db096e;color:#fff;border-radius:50px}
.btn-fixed-sp{position:static;left:auto;right:auto;bottom:auto;padding:0;transform:none;opacity:1;pointer-events:auto}
}
@media screen and (max-height:800px) and (min-width:800px){
#mv{margin-top:10px;}
#mv img{max-height:75vh; width:auto; margin:0 auto;}
#btnarea h3{margin-top:10px;}
}

@media screen and (max-height:650px) and (min-width:800px){
#mv{margin-top:10px;}
#mv img{max-height:65vh; width:auto; margin:0 auto;}
#btnarea h3{margin-top:10px;}
}


@media screen and (max-height:450px) and (min-width:800px){
#mv{margin-top:10px;}
#mv img{max-height:60vh; width:auto; margin:0 auto;}
#btnarea h3{margin-top:10px;}
}
