@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Serif+TC:wght@200;300;400;500;600;700;900&display=swap');

*{-webkit-text-size-adjust:none;}
html,body{width:100%;height:100%;margin:0;padding:0;}
body{margin:0;padding:0;font-family:'Noto Sans TC',sans-serif;font-size:16px;line-height:1.5;background:#000914;}
h1,h2,h3,h4,p,ul,li{margin:0;padding:0;}
ul{list-style:none;}
img{border:none;}
a{text-decoration:none;cursor:pointer;outline:none;}
a:hover{text-decoration:none;}
button{outline:none;border:0;}

.wrapper{position:relative;min-width:1100px;overflow:hidden;}
.header h1,.header h2,.header h3,.header p,.section-inner{font-size:0;line-height:0;text-indent:-99999px;}
.goHome,.share,.goEvent{text-indent:-9999px;}

.ir{margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999px;}
.inner{position:relative;margin:0 auto;width:1100px;height:100%;}

/* header */
.header{position:relative;height:897px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_header.jpg") no-repeat 50% 0;}
.header .inner{position:relative;margin:0 auto;}
.header .inner .goHome{position: absolute;top:15px;left:20px;width:127px;height:46px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/logo_aion2.png") no-repeat 50% 50%;background-size:cover;}
.header .inner .share{position:absolute;top:26px;left:958px;width:26px;height:25px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/fb.png") no-repeat 50% 50%;z-index:100;}
.header .inner .goEvent{position:absolute;top:26px;left:990px;width:97px;height:27px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/more.png") no-repeat 50% 50%;z-index:100;}
.header .inner a,.section a{-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
.header .inner a:hover,.section a:hover{-webkit-filter:contrast(150%) brightness(140%);filter:contrast(150%) brightness(140%);}

/* nav */
.nav{position:absolute; top:80px; left:0; right:0; margin:0 auto;width:800px;z-index:100;}
.nav .nav-list{position: relative; list-style: none;}
.nav .nav-list li{display: block; float:left;margin-right:46px;}
.nav .nav-list li:last-child{margin-right:0;}
.nav .nav-list li a{display: block; width: 235px; height: 74px; background: url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_nav.png") 0 0 no-repeat;text-indent: -9999px;transition:filter .3s ease;}
.nav .nav-list li.m2 a{ background-position: -235px 0;}
.nav .nav-list li.m3 a{ background-position: -470px 0;}
.nav .nav-list li a:hover{ -webkit-filter:contrast(100%) brightness(140%);filter:contrast(100%) brightness(140%);}

/* item list */
.section [class*="btn"]{position:absolute;display:block;width:77px;height:28px;}
.section [class*="item-list"]{position:absolute;overflow:hidden;text-indent:-9999px;}
.section [class*="item-list"] li{position:relative;width:218px;height:23px;margin:139px 30px 84px 1px;float:left;}
.section [class*="item-list"] li a{display:block;position:absolute;text-indent: -9999px;}
.section [class*="item-list"] li .preview,
.section [class*="item-list"] li .tooltip{width:23px;height:23px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/btn_preview.png") no-repeat 50% 50%;z-index:10;bottom:0px;right:0px;}
.section [class*="item-list"] li .modal,
.section [class*="item-list"] li .youtube,.section [class*="item-list"] li .link{position:absolute;width:100%;height:23px;background:none;bottom:0px;}
.section [class*="item-list"] li .modal:before,.section [class*="item-list"] li .youtube:before,.section [class*="item-list"] li .link:before{content:'詳細說明';color:#ececec;margin:auto;left:0;right:0;position:absolute;text-indent:0px;font-size:15px;text-align:center;line-height:20px;}

.section [class*="btn-info"]{left:50%;margin-left:-11.5px;width:23px;height:23px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/btn_preview.png") no-repeat 50% 50%;}

/* section */
#section1{position:relative;height:520px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section1.jpg") no-repeat 50% 0;}
#section1 a.btn-info{top:235px;margin-left:315px;width:48px;height:46px;background-image:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/icon_preview.png");}
#section2{position:relative;height:795px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section2.jpg") no-repeat 50% 0;}
#section2 a.btn-info{top:180px;margin-left:-35px;}
#section3{position:relative;height:auto;}

/* section3 tab */
#section3-tab{}
#section3-tab ul{width:960px;height:70px;margin:0 auto;list-style:none;position:absolute;top:-70px;left:50%;margin-left:-480px;}
#section3-tab ul li{float:left;position:absolute;z-index:10;}
#section3-tab ul li:last-child{z-index:9;right:0;}
#section3-tab ul li a{display:block;width:467px;height:70px;text-indent:-9999em; background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/tab_section3.png") no-repeat 0 0;transition:filter .3s ease}
#section3-tab ul li a.on{background-position-y:-70px;-webkit-filter:contrast(100%) brightness(140%);filter:contrast(100%) brightness(140%);}
#section3-tab ul li.m2 a{background-position-x:-467px;}

.section [class*="item-list"]{position:absolute;width:1040px;}

#section3-1{height:3870px;}
#section3-11{position:relative;height:900px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-11.jpg") no-repeat 50% 0;}
#section3-11 p.tips{padding:0 20px;font-size:16px;font-weight:700;position:absolute;bottom:1rem;left:0;width:100%;line-height:66px;text-align:center;color:red;line-height:1.8;text-indent:0;}
#section3-11 .item-list{top:152px;left:65px;}
#section3-12{position:relative;height:590px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-12.jpg") no-repeat 50% 0;}
#section3-12 .item-list{top:117px;left:314px;width:780px;}
#section3-13{position:relative;height:830px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-13.jpg") no-repeat 50% 0;}
#section3-13 .item-list{top:113px;left:65px;}
#section3-14{position:relative;height:710px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-14.jpg") no-repeat 50% 0;}
#section3-14 .item-list{top:1px;left:65px;}
#section3-14 .item-list li{margin-top:121px;}
#section3-15{position:relative;height:840px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-15.jpg") no-repeat 50% 0;}
#section3-15 a.btn-info1{top:143px;margin-left:-300px;}
#section3-15 a.btn-info2{top:270px;margin-left:-250px;}
#section3-15 a.btn-info3{top:270px;margin-left:110px;}
#section3-2{position:relative;height:1320px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/bg_section3-2.jpg") no-repeat 50% 0;display:none;}
#section3-2 .btn-link1{width:306px;height:94px;position:absolute;top:60px;left:50%;margin-left:165px;background:url("//image.tw.ncsoft.com/aion/event/211006_luckygame/btn01.png") no-repeat 50% 0;}
#section3-2 .btn-link1:hover{-webkit-filter:contrast(130%);filter:contrast(130%);}

.tab-wrap{position: relative; width: 1030px; margin: 0;}
.tab-wrap .tab-nav{position: absolute; z-index: 9; background: rgba(0, 0, 0, 0.5);}
.tab-wrap .tab-nav li{overflow: hidden;}
.tab-wrap .tab-nav li a{position: relative;display: block; padding: 12px 30px 12px 10px; color: #fadca9; line-height:1;font-size: 14px;letter-spacing:-0.5px;text-decoration: none;}
.tab-wrap .tab-nav li a:hover{opacity:.8;}
.tab-wrap .tab-nav li a.on{ color: #11100e; background:#fadca9; }
.tab-wrap .tab-nav li a span{display: block; float: right; font-weight:900;font-size:16px;}
.tab-wrap .tab-img {position: absolute; top: -4px; left: 2px;}
.tab-wrap .tab-img img{display: none;}
.tab-wrap .tab-img img:first-child{display: block;}
.tab-wrap .tab-content {position: absolute; top: 0; left: 0;}
.tab-wrap .tab-content div{display: none;}
.tab-wrap .tab-content div:first-child{display: block;}
.tab-wrap .tab-content p{padding:0 20px;font-size:16px;font-weight:700;position:absolute;bottom:65%;left:0;width:270px;line-height:66px;text-align:center;color:red;line-height:1.8;}
.tab-wrap .tab-content a[class*="btn-detail"]{color:#ffffff;background:#4e61bf;padding:0 20px;font-size:20px;font-weight:bold;position:absolute;bottom:50%;left:175px;margin-bottom:-235px;width:100px;height:70px;line-height:66px;text-align:center;border-radius:5px;}

#tab-switch1{top:370px;left:39px;}
#tab-switch1 .tab-nav{top:0;left:325px;width:315px;height:742px;}

/* caution */
.caution{position:relative;margin:0 auto;background:#191919;}
.caution .inner{width:1000px;margin:0 auto;padding:60px 0 100px 0;}
.caution .inner h2{height:50px;/*text-indent:-9999px;background:none;*/color:#a5a5a5;font-size:30px;}
.caution .inner ol{margin:0 0 0 -20px;}
.caution .inner ol li{padding:2px 0;color:#a6a6a6;}
.caution .inner ol li span,.caution .inner ol li.point{color:#feac0f;}

/* top */
.goTop{position:fixed;bottom:20px;background:url("//image.tw.ncsoft.com/aion/layout/btn-top.png") no-repeat 50% 0;left:auto;display:none;width:40px;height:40px;right:20px;text-indent:-9999em;z-index:100;}

@media screen and (max-width:1099px) {
  body{width:max-content;width:-webkit-max-content;width:-moz-max-content;max-width:1100px;}
}

/* animation */
@-webkit-keyframes fade {
  50% {opacity: 1;}
}
@keyframes fade {
  50% {opacity: 1;}
}