@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%;}

.sec1 .ob1{position:absolute; left:6.827%; top:26.475%; width:85.701%; animation:updown 2s infinite ease-in-out;}
.sec1 .ob2{position:absolute; left:76.107%; top:-5.819%; width:28.967%; animation:scale 2s infinite ease;}
.sec1 .ob3{position:absolute; left:-5.443%; top:19.435%; width:22.417%; animation:scale2 2s infinite ease;}
.sec1 .ob4{position:absolute; left:80.812%; top:61.525%; width:20.572%; animation:scale 2s infinite ease;}
.sec1 .ob5{position:absolute; left:-1.384%; top:60.621%; width:33.303%; animation:scale 2s infinite ease;}
.sec1 .ob6{position:absolute; left:60.793%; top:87.119%; width:33.118%; animation:scale2 2s infinite ease;}
.sec1 .ob7{position:absolute; left:19.465%; top:4.124%; width:6.734%; animation:rotate 4s steps(8) infinite;}
.sec1 .ob8{position:absolute; left:88.745%; top:25.989%; width:6.734%; animation:rotate 4s steps(8) infinite;}
.sec1 .ob9{position:absolute; left:33.303%; top:75.537%; width:6.734%; animation:rotate 4s steps(8) infinite;}
.sec3 .ob1{position:absolute; left:43.266%; top:5.737%; width:13.469%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec3 .ob2{position:absolute; left:0%; top:35.469%; width:22.509%; z-index:2;}
.sec3 .ob3{position:absolute; left:-12.915%; top:33.250%; width:33.579%; /*animation:scale3 1.4s infinite ease;*/}
.sec3 .ob4{position:absolute; left:75%; top:71.147%; width:25%; z-index:2;}
.sec3 .ob5{position:absolute; left:75.461%; top:68.425%; width:33.579%; /*animation:scale3 1.4s infinite ease;*/}
.sec3 .ob6{position:absolute; left:29.982%; top:73.916%; width:40.314%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec3 .roul1{position:absolute; left:44.004%; top:34.296%; width:12.823%; z-index:2;}
.sec3 .roul2{position:absolute; left:15.590%; top:37.605%; width:69.557%;}
.sec3 .roul3{position:absolute; left:40.221%; top:48.953%; width:20.295%;}
.sec3 .board{padding-top:0;}
.sec4 .btn-cp{display:block; position:absolute; left:12.454%; top:76.570%; width:75.092%; height:7.826%; text-indent:-9999em;}
.sec4 .ob1{position:absolute; left:43.266%; top:7.246%; width:13.469%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec5 .ob1{position:absolute; left:43.266%; top:3.003%; width:13.469%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec5 .ob2{position:absolute; left:70.572%; top:18.111%; width:43.727%; animation:scale4 0.8s steps(1) infinite alternate;}
.sec5 .ob3{position:absolute; left:7.565%; top:19.613%; width:85.240%; z-index:10;}
.sec5 .ob5{position:absolute; left:72.694%; top:77.929%; width:47.694%; /*animation:scale4 0.8s steps(1) infinite alternate;*/}
.sec5 .ob6{position:absolute; left:53.321%; top:24.437%; width:6.365%; z-index:10; animation:scale5 0.8s steps(1) infinite alternate;}
.sec5 .ob7{position:absolute; left:0; top:26.280%; width:13.469%; animation:scale5 0.8s steps(1) infinite alternate;}
.sec5 .ob8{position:absolute; left:93.173%; top:40.137%; width:6.734%; animation:rotate 4s steps(8) infinite;}
.sec5 .ob9{position:absolute; left:63.561%; top:60.523%; width:5.258%; animation:rotate 4s steps(8) infinite; z-index:10;}
.sec5 .ob10{position:absolute; left:75.185%; top:63.436%; width:5.627%; animation:rotate 4s steps(8) infinite; z-index:10;}
.sec5 .ob11{position:absolute; left:18.727%; top:76.928%; width:5.258%; animation:rotate 4s steps(8) infinite; z-index:10;}
.sec5 .btn-app1{position:absolute; left:13.284%; top:42.116%; width:73.801%; height:3.663%; text-indent:-9999em; z-index:20;}
.sec5 .btn-app2{position:absolute; left:13.284%; top:81.124%; width:73.801%; height:3.686%; text-indent:-9999em; z-index:20;}
.sec5 .close{position:absolute; left:7.196%; top:19.522%; width:85.886%; z-index:50;}
.sec6 .ob1{position:absolute; left:43.266%; top:6.336%; width:13.469%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec7 .ob1{position:absolute; left:43.266%; top:4.874%; width:13.469%; animation:updown3 0.7s infinite alternate ease-in-out;}
.sec7 .ob2{position:absolute; left:11.439%; top:23.491%; width:77.491%; transform:translateY(53vw); transition:all 0.7s ease;}
.sec7 .ob2.on{transform:translateY(0);}
.sec7 .ob3{position:absolute; left:0.000%; top:38.302%; width:100.000%; z-index:2;}
.sec7 .ob4{position:absolute; left:17.804%; top:40.535%; width:7.657%; z-index:2;}
.sec7 .ob4.on{transform:translateY(0);}
.sec7 .ob5{position:absolute; left:0; bottom:0%; width:100%; z-index:20;}
.sec7 .slide{position:absolute; left:17.712%; top:63.648%; width:64.576%; z-index:10;}
.sec7 .slide .swiper-container{height:92.8966vw;}
.sec7 .swiper-pagination{display:none; position:absolute; left:0; top:93.920%; width:100%; font-size: 0; line-height: 1;}
.sec7 .swiper-pagination .swiper-pagination-bullet{width:1.66%; height: auto; aspect-ratio: 1/1; margin: 0 1.66%; padding: 0; background: #54BDEB; opacity: 1;}
.sec7 .swiper-pagination .swiper-pagination-bullet-active{background: #fff;}
.sec7 .btn-app{position:absolute; left:13.100%; top:51.038%; width:73.801%; height:5.000%; text-indent:-9999em; z-index:10;}
.sec8{overflow:visible !important; z-index:2;}
.sec8 .ob1{position:absolute; left:43.266%; top:-3.500%; width:13.469%;}
.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 .heart{position: absolute; left:42.267%; top:12.453%; width:15.467%; z-index:10; animation:updown4 0.5s infinite alternate ease-in-out;}
.pop .con .heart2{position: absolute; left:42.210%; top:19.685%; width:15.446%; z-index:10; animation:updown4 0.5s infinite alternate ease-in-out;}
.pop .con .heart3{position: absolute; left:58.667%; top:13.015%; width:6.133%; z-index:10; animation:updown4 0.5s infinite alternate ease-in-out;}
.pop .con .btn-close{position: absolute; right: 0; top: 0; width:13.333%; aspect-ratio: 1/1; text-indent: -9999em; z-index:10;}
#pop1_1 .btn-my{position:absolute; left:29.867%; top:76.339%; width:42.933%; height:11.208%; text-indent:-9999em;}
#pop1_2 .btn-my{position:absolute; left:28.628%; top:56.818%; width:42.743%; height:20.227%; text-indent:-9999em;}
#pop2_1 .btn-my{position:absolute; left:28.628%; top:62.598%; width:42.743%; height:17.520%; text-indent:-9999em;}
#pop2_2 .btn-my{position:absolute; left:28.628%; top:57.432%; width:42.743%; height:20.045%; 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(0vw)}
}

@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)}
}