@charset "utf-8";
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video{margin:0; padding:0; box-sizing:border-box;}
img{display:block; width:100%; }
#wrapper{width:100%; margin:0 auto; }
.container{position:relative; width:100%; }
.container > div{position:relative; overflow:hidden;}
.pre-event{position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 100;}
.pre-event > div{display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);}
.pre-event img{position: relative; width: 70.110%;}
.btn-link{display: block; text-indent: -9999em; background: yellow; opacity: 0;}
.menu-wrap{width: 100%; aspect-ratio: 1084 / 149;}
.menu-wrap .menu{width: 100%; aspect-ratio: 1084 / 149; background: #000; text-align: center;}
.menu-wrap .menu.fixed{position: fixed; left: 0; top: 0; width: 100%; z-index: 100;}
.menu-wrap .menu.off{display: none;}
.menu-wrap .menu ul{display: flex; align-items: center; position:absolute; left:0; top:0; width: 100%; height: 100%;}
.menu-wrap .menu ul li{flex: 1; height: 100%;}
.menu-wrap .menu ul li button{width:100%; height:100%; text-indent: -9999em;}
.sec1 .ob1{position:absolute; left:0.000%; top:15.833%; width:100.000%; animation:updown 2s infinite ease-in-out;}
.sec2 .bb{position:absolute; left:30.996%; top:31.105%; width:38.284%; animation: updown3 0.7s infinite alternate ease-in-out; z-index: 10;}
.sec2 .track{position: absolute; left:5.904%; top:32.370%; width:88.192%;}
.sec2 .track ul li{display: none;}
.sec2 .track ul li.on{display: block;}
.sec2 .btn-track{position: absolute; left:19.742%; top:37.825%; width:60.517%; height:7.189%; text-indent: -9999em;}
.sec2 .btn-link{position: absolute; left:29.244%; top:88.303%; width:41.790%; height:3.466%;}
.sec3 .btn-link{position: absolute; left:63.838%; top:63.275%; width:26.015%; height:22.396%;}
.sec4 .ob1{position:absolute; left:15.037%; top:39.823%; width:38.376%; opacity: 0; transform: translateY(15vw); transition: all 0.8s ease;}
.sec4 .ob2{position:absolute; left:15.037%; top:45.973%; width:19.280%; opacity: 0; transform: translateY(15vw); transition: all 0.8s 0.2s ease;}
.sec4 .ob3{position:absolute; left:46.402%; top:59.779%; width:37.823%; opacity: 0; transform: translateY(15vw); transition: all 0.8s ease;}
.sec4 .ob4{position:absolute; left:55.627%; top:65.885%; width:28.413%; opacity: 0; transform: translateY(15vw); transition: all 0.8s 0.2s ease;}
.sec4 .ob.on{opacity: 1; transform: translateY(0);}
.sec4 .btn-link{position: absolute; left:9.225%; top:75.376%; width:81.458%; height:8.355%;}
.sec5 .ob1{position:absolute; left:13.100%; top:28.717%; width:18.635%; animation: updown3 0.8s infinite alternate ease-in-out;}
.sec5 .ob2{position:absolute; left:75.185%; top:41.396%; width:16.144%; animation: updown4 0.8s infinite alternate ease-in-out;}
.sec5 .ob3{position:absolute; left:7.103%; top:49.358%; width:12.085%; animation: updown4 0.8s infinite alternate ease-in-out;}
.sec5 .ob4{position:absolute; left:59.594%; top:55.170%; width:33.303%; animation: updown3 0.8s infinite alternate ease-in-out;}
.sec5 .ob.on{opacity: 1; transform: translateY(0);}
.sec5 .btn-link{position: absolute; left:9.410%; top:77.187%; width:81.181%; height:7.202%;}
.sec6 .btn-link1{position: absolute; left:16.974%; top:64.249%; width:66.052%; height:8.247%;}
.sec6 .btn-link2{position: absolute; left:9.317%; top:79.836%; width:81.458%; height:13.860%;}
.sec7 .ob1{position:absolute; left:21.402%; top:6.250%; width:57.196%; animation: updown3 0.7s infinite alternate ease-in-out}
.sec7 .ob2{position:absolute; left:27.952%; top:28.600%; width:44.280%; aspect-ratio: 1 / 1; border-radius: 100%; background: #f6ce0e; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: cover;}
.sec7 .ob2 img{width: 100%; opacity: 1; transform: translateY(100%); transition: all 0.8s ease;}
.sec7 .ob2.on img{opacity: 1; transform: translateY(0);}
.sec7 .btn-link1{position: absolute; left:25.738%; top:66.755%; width:20.756%; height:14.389%;}
.sec7 .btn-link2{position: absolute; left:55.258%; top:66.755%; width:20.756%; height:14.389%;}
.btn-home{position:fixed; right:3.321%; bottom:3.321vw; width:14.944%; z-index:10;}
.pop{display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 100;}
.pop > div{display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);}
.pop .con{position: relative; width: 69.188%;}
.pop .con .btn-close{position: absolute; right: 0; top: 0; width:18.333%; aspect-ratio: 1/1; text-indent: -9999em; z-index:10;}
#pop1_1 .btn-my{position:absolute; left:11.984%; top:78.954%; width:37.417%; height:11.208%; text-indent:-9999em;}
#pop1_1 .btn-continue{position:absolute; left:50.599%; top:78.954%; width:37.417%; height:11.208%; text-indent:-9999em;}
#pop1_1 .btn-continue.only{left:31.158%; top:76.648%; width:37.550%; height:12.894%;}
#pop1_2 .btn-my{position:absolute; left:31.292%; top:71.504%; width:37.417%; height:15.752%; text-indent:-9999em;}
#pop2_1 .btn-my{position:absolute; left:31.200%; top:71.504%; width:37.600%; height:15.752%; text-indent:-9999em;}
#pop2_2 .btn-my{position:absolute; left:31.200%; top:71.327%; width:37.600%; height:15.929%; text-indent:-9999em;}
@keyframes updown{
	0%{transform:translateY(0)}
	50%{transform:translateY(5vw)}
	100%{transform:translateY(0)}
}
@keyframes updown2{
	0%{transform:translateY(0)}
	50%{transform:translateY(-5vw)}
	100%{transform:translateY(0)}
}
@keyframes updown3{
	0%{transform:translateY(-1.5vw)}
	100%{transform:translateY(1.5vw)}
}
@keyframes updown4{
	0%{transform:translateY(1.5vw)}
	100%{transform:translateY(-1.5vw)}
}

@keyframes scale{
	0%{transform:scale(1.0)}
	50%{transform:scale(0.8)}
	100%{transform:scale(1.0)}
}

@keyframes scale2{
	0%{transform:scale(0.8)}
	50%{transform:scale(1)}
	100%{transform:scale(0.8)}
}
@keyframes scale3{
	0%{transform:scale(1.0)}
	50%{transform:scale(1.15)}
	100%{transform:scale(1.0)}
}
@keyframes scale4{
	0%{transform:scale(1.05)}
	50%{transform:scale(0.9)}
	100%{transform:scale(1.05)}
}
@keyframes scale5{
	0%{transform:scale(1.0)}
	50%{transform:scale(1.2)}
	100%{transform:scale(1.0)}
}
@keyframes rotate{
	0%{transform:rotate(0)}
	100%{transform:rotate(360deg)}
}