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


body {position: relative;}
.bg-gray {background-color:#1D1D21;}
.inner {position:relative; overflow: visible; padding:0 30px;}
main {overflow: hidden;}

.ir{ text-indent: -999em; overflow: hidden;}
.accordion-block .accordion-btn .icon-plus {top:0;}


.sec-kv {padding:53px 0 80px;}
.sec-kv h2 {padding-left:3px; font-size:36px; line-height: 43px; font-weight: 800; margin-bottom:40px;}
.sec-kv h2 span {display: inline-block;}
.sec-kv h2 .sub-title {position:relative;display: inline-block; font-size:19px; line-height: 23px; font-weight: 700; margin-bottom:20px;}
.sec-kv h2 .sub-title::before {content:""; position:absolute; bottom:-1px; left:-5px; width:calc(100% + 10px); height:11px; background-color:#FFF500; z-index:-1;}
.sec-kv h2 img {width:40px; vertical-align: top; padding-left: 12px;}
.sec-kv ul {position:relative; padding:43px 0 25px;}
.sec-kv ul .bg-blue {position:absolute; top:0; left:0; width:100%; height:100%; background-color:#89E3FF; border-radius: 30px; transform:rotate(-7deg);}
.sec-kv ul .bg-green {position:absolute; top:0; left:0; width:100%; height:100%; background-color:#62C365; border-radius: 30px;}
.sec-kv ul .bg-green::after {content:""; position:absolute; top:20px; right:20px; width:14px; height:14px; background-color:#89E3FF; border-radius: 50%;}
.sec-kv ul .copy {position:relative; font-size:0;}

.mot {transform:translate(0, 50px); opacity:0;}
.is-active .mot {transform:translate(0, 0); opacity:1; transition:transform 0.6s, opacity 0.6s;}


.sec-kv ul .copy {opacity:0;}
.sec-kv.is-active h2 span:nth-child(1) {transition-delay: 0.2s;}
.sec-kv.is-active h2 span:nth-child(2) {transition-delay: 0.3s;}
.sec-kv.is-active ul {transition-delay: 0.4s;}
.sec-kv.is-active ul .bg-blue {transform:rotate(4deg); transition:transform 1.3s 0.3s;}
.sec-kv.is-active ul .copy {opacity:1; transition:opacity 1s 1s;}

/* .sec-kv h2 {transform:translate(0, 50px); opacity:0;}
.sec-kv h2 span {transform:translate(0, 50px); opacity:0;}
.sec-kv ul {opacity:0;}

.sec-kv.is-active h2 {transform:translate(0, 0); opacity:1; transition:transform 0.6s, opacity 0.6s; }
.sec-kv.is-active h2 span {transform:translate(0, 0); opacity:1; transition:transform 0.6s, opacity 0.6ss; }
 */
.sec-steps p {position:relative; font-size:17px; line-height: 21px; font-weight: 800; margin-bottom:20px; color:#4CC05F;}
.sec-steps p::after {content:""; position:absolute; bottom:-6px; left:0; width:69px; height:6px; background:url("https://og.kakaobank.io/view/64540721-1759-4ddf-bbe6-18248097995f") no-repeat 0 0 / 100%;}
.sec-steps h2 {margin-bottom:25px; font-weight: 800;}

.sec-steps.is-active p {transition-delay: 0s;}
.sec-steps.is-active h2 {transition-delay: 0.1s;}
.sec-steps.is-active ul,
.sec-steps.is-active .slide,
.sec-steps.is-active .thumb {transition-delay: 0.2s;}

.sec-steps .slide {width:230px;}
.sec-step1 {padding-bottom:70px;}
.sec-step2 {padding-bottom:159px;}
.sec-step2 ul {position:relative;}
.sec-step2 ul li {position:absolute; top:0; left:0;}
.sec-step2 .hand {width:51px; top:-28px; left:-23px;}
.sec-step2 .count {font-size:24px; line-height:29px; font-weight: 700; color:#111111; background-color:#BBE5FF; padding:15px 29px; border-radius: 66px;;}
.sec-step2 .heart {width:165px; top:-10px; left:125px;}
.sec-step2 .face {width:69px; top:-50px; left:240px;}
.sec-step3 {padding-bottom:70px;}
.sec-step3 .thumb {position:relative; text-align: center; font-size:0;}
.sec-step3 .thumb .on {position:absolute; top:0; left:0; opacity:0; animation:step3-thumb-ani 4s infinite;}
.sec-step3 span {display: block; font-size:13px; line-height: 15px; color:#aaaaaa; margin-top:16px;}


.sec-present {position:relative; padding:69px 0 0; background-color:#FFEC3F;}
.sec-present h2 {padding-left:3px; font-size:36px; line-height: 47px; font-weight: 800; margin-bottom:40px;}
.sec-present h2 span {position:relative;display: inline-block; font-size:19px; line-height: 23px; font-weight: 700; margin-bottom:20px;}
.sec-present h2 span::before {content:""; position:absolute; bottom:-1px; left:-5px; width:calc(100% + 10px); height:11px; background-color:#BBE5FF; z-index:-1;}
.sec-present ul li {margin-bottom:30px;}
.sec-present ul li:last-child {margin-bottom:0;}
.sec-present .medal {position:absolute; top:-69px; right:0; width:146px;}

.sec-present.is-active ul li:nth-child(1) {transition-delay: 0.2s;}
.sec-present.is-active ul li:nth-child(2) {transition-delay: 0.3s;}
.sec-present.is-active ul li:nth-child(3) {transition-delay: 0.4s;}

.section-share {padding:60px 0; background-color:#FFEC3F;}
.theme-default #share {background-color:#FFEC3F;}

#btnApply .apply-btn {background-color:#000000; color:#fff;}

.info .info-tit {padding-bottom:40px;}
#eventInfo .info-list .nodot {padding-left:0; margin:10px 0 2px;}
#eventInfo .info-list .nodot::before {content:none;}
.accordion-block.last {border-bottom:2px solid #333333;}

.popups .okay-btn .btn-ok {background-color:#6D81E2; color:#ffffff;}


@keyframes step3-thumb-ani {
  0% {opacity:0;}
  10% {opacity:1;}
  50% {opacity:1;}
  60% {opacity:0;}
}


@media screen and (max-width: 320px) {

}