@charset "UTF-8";
* {font-family:'Pretendard','Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', system-ui, sans-serif;}
body {background:#ffffff;}
section, .section {position:relative; z-index:2;background:#fff;box-sizing: border-box;overflow: hidden; color:#ffffff;}


body {position: relative;}
.bg-gray {background-color:#1D1D21;}
.inner {overflow: visible;}
.sec-group .inner {text-align: center;}
.sec-group h2 {font-size:26px; line-height: 34px; font-weight: 800; margin-bottom:25px; text-align: left;;}
.sec-group h2 span {color:#FFD704;}
.sec-group p {font-size:16px; line-height: 26px; color:rgba(255,255,255,0.4); text-align: left;}
.sec-group p span {color:rgba(255,255,255,0.7);}
.sec-group .small {display: block; font-size:13px; line-height: 20px; color:rgba(255,255,255,0.4); text-align: left; margin-top:2px;}

.ir{ text-indent: -999em; overflow: hidden;}
.section-kv { height:100vh;}
.section-kv .inner {display: table; height:100%;}
.section-kv .box {display: table-cell; vertical-align: middle; text-align: center;}
.section-kv .thumb {position:relative; display: inline-block;}
.section-kv .shield {width:112px;}
.section-kv .star {position:absolute; top:80px; left:-30px;}
.section-kv .star1 {width:22px; top:-18px; left:110px; animation:scale-ani 0.6s steps(2) infinite;}
.section-kv .star2 {width:16px; animation:scale-ani 0.6s 0.3s steps(2) infinite;}
.section-kv h2 {padding:51px 0 54px; font-size:38px; line-height: 43px; font-weight: 800;}
.section-kv p {color:#BBBBBC; font-size:17px; line-height: 27px; font-weight: 500;}
.section-kv p span {color:#FFD704;}
.section-kv .scroll {width:20px; margin:58px auto 0;}
.section-kv .scroll img {animation:arrow-bounce-ani 2s infinite;}


@keyframes scale-ani {
  0% {transform:scale(0.25)}
  50% {transform:scale(1)}
  100% {transform:scale(0.25)}
  
}

@keyframes arrow-bounce-ani {
  0%, 100%, 20%, 50%, 80% {transform:translateY(0)}
  40% {transform:translateY(-10px)}
  60% {transform:translateY(-5px)}
  
}


.section-kv .thumb {transform:translate(0, 100px); opacity:0;}
.section-kv h2 {transform:translate(0, 100px); opacity:0;}
.section-kv p {transform:translate(0, 100px); opacity:0;}
.section-kv .scroll {opacity:0;}

.section-kv.is-active .thumb {transform:translate(0, 0); opacity:1; transition:all 1s 0.1s;}
.section-kv.is-active h2 {transform:translate(0, 0); opacity:1; transition:all 1s 0.2s;}
.section-kv.is-active p {transform:translate(0, 0); opacity:1; transition:all 1s 0.3s;}
.section-kv.is-active .scroll {opacity:1; transition:all 1s 0.4s;}


.section-online {text-align: left; padding:40px 35px 0;}
.section-online ul {position:relative; display:inline-block; margin:78px auto 67px;}
.section-online ul li {position:absolute; top:0; left:0;}
.section-online .fraud {position:relative; width:196px;}
.section-online .fraud .face {position:absolute; top:-41px; left:-24px; width:315px;}
.section-online .card {width:53px; top:60px; left:-30px;}
.section-online .pw {width:54px; top:150px; left:180px;}
.section-online .fishing-g {top:-160px; left:170px;}
.section-online .fishing {display: block; width:68px;}
.section-online .fishing-catch {position:absolute; bottom:0; left:0; width:68px;}

.section-online h2 {transform:translate(0, 50px); opacity:0;}
.section-online p {transform:translate(0, 50px); opacity:0;}
.section-online .card {transform:rotate(-30deg); opacity:0;}
.section-online .pw {transform:translate(0, 10px); opacity:0;}
.section-online .fishing-g {transform:translate(0, -30px);}
.section-online .fishing-catch {opacity:0;}
.section-online .face {opacity:0;}

.section-online.is-active h2 {transform:translate(0, 0); opacity:1; transition:all 1s 0.1s;}
.section-online.is-active p {transform:translate(0, 0); opacity:1; transition:all 1s 0.2s;}
.section-online.is-active .face {opacity:1; transition:all 1s;}
.section-online.is-active .card {transform:rotate(0deg); opacity:1; transition:all 1s 0.1s;}
.section-online.is-active .pw {transform:translate(0, 0); opacity:1; transition:all 1s 0.3s;}
.section-online.is-active .fishing-g {transform:translate(0, 0); transition:all 1s 0.3s;}
.section-online.is-active .fishing-catch {opacity:1; transition:opacity 1s 2s;}


.section-free {padding:40px 34px 25px;}
.section-free .small::before {content:"* "; display: inline-block; font-size:15px; line-height: 26px; vertical-align: top;}
.section-free .bankbook {position:relative; width:200px;}
.section-free .line {position:absolute; top:32px; left:48px; width:80px;}
.section-free .line span {display: block; width:0; height:6px; background-color:#353535; margin-bottom:5px;}
.section-free ul {position:relative; display:inline-block; margin:78px auto 67px;}
.section-free ul li {position:absolute; top:0; left:0;}
.section-free .free-info {color:#636363; font-size:12px; line-height: 26px;}
.section-free .free-info .icon {display: inline-block; width:13px; margin-left:4px; vertical-align: top; margin:5px 5px 0 0;}
.section-free .shield {top:86px; left:160px;}
.section-free .shield .off {width:49px;}
.section-free .shield .on {position:absolute; top:0; left:0; width:49px; opacity:0;}
.section-free .shield .check {position:absolute; top:17px; left:12px; width:0; overflow:hidden;}
.section-free .shield .check img {width:26px;}


.section-free h2 {transform:translate(0, 50px); opacity:0;}
.section-free p {transform:translate(0, 50px); opacity:0;}
.section-free .small {transform:translate(0, 50px); opacity:0;}

.section-free.is-active h2 {transform:translate(0, 0); opacity:1; transition:all 1s 0.1s;}
.section-free.is-active p {transform:translate(0, 0); opacity:1; transition:all 1s 0.2s;}
.section-free.is-active .small {transform:translate(0, 0); opacity:1; transition:all 1s 0.3s;}
.section-free.is-active .line span {width:100%; transition:width 0.6s;}
.section-free.is-active .line span:nth-of-type(1) {transition-delay: 0.1s;} 
.section-free.is-active .line span:nth-of-type(2) {transition-delay: 0.3s;} 
.section-free.is-active .line span:nth-of-type(3) {transition-delay: 0.2s;} 
.section-free.is-active .line span:nth-of-type(4) {transition-delay: 0.4s;}
.section-free.is-active .shield .check {width:26px; transition:width 0.6s 0.5s;}
.section-free.is-active .shield .on {opacity:1; transition:opacity 0.6s 0.5s;}

.section-slide {background-color:#FFD704; padding:60px 35px;}
.section-slide .slide {font-size:0; margin-bottom:60px;}
.section-slide h2 {font-size:26px; line-height: 34px; font-weight: 800; color:#000; margin-bottom:40px;}




/*  button */
#btnApply {bottom:-90px;padding : 0 25px ;box-sizing: border-box;transition:bottom 0.5s;}
#btnApply.on {bottom:23px;}
#btnApply a.apply-btn {background:#FFE500;width:100%;max-width:325px;}
#btnApply span.apply-btn {background:#B8BBBF;color:#fff;width:100%;max-width:325px;}
.theme-default #eventInfo #btnStop {color:#005A96; text-decoration: underline;}


/* Popup */
.popups .okay-btn .btn-ok {background-color:#FFE500; color:#000}