@charset "UTF-8";

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,button{margin:0;padding:0}
fieldset,img{border:0 none}
dl,ul,ol,menu,li{list-style:none}
blockquote, q{quotes:none}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none}
input,select,textarea,button{vertical-align:middle;font-size:100%}
button{border:0 none;background-color:transparent;cursor:pointer}
table{border-collapse:collapse;border-spacing:0}
body{min-width:320px;background-color:#fff;-webkit-text-size-adjust:none}
input:checked[type='checkbox']{background-color:#666; -webkit-appearance:checkbox}
input[type='text'],input[type='password'],input[type='submit'],input[type='search'],input[type='tel'],input[type='email'],html input[type='button'],input[type='reset']{-webkit-appearance:none;border-radius:0}
input[type='search']::-webkit-search-cancel-button{-webkit-appearance:none}
body,th,td,input,select,textarea,button{font-size:14px;line-height:1.5;  font-family: 'Apple SD Gothic Neo', 'Malgun Gothic','맑은 고딕', system-ui, sans-serif;color:#000}
a{color:#005a96;text-decoration:none}
a:active, a:hover{text-decoration:none}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
hr {border: 0 none;}
img {width:100%;}
div:focus {outline: none;}
button:focus {outline: none;}

.ir {display:block; font-size:0; text-indent: -99999px; height:0;}
.is-app {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
}

body {background-color:#3f49a7;}
main {width:100%; overflow: hidden;}
section {padding:0 20px;}
section .inner {max-width:600px; margin:0 auto;}



.top-logo {background-color:#2c3692;}
.top-logo .inner {padding:18px 0;}
.top-logo .inner span {display: inline-block; vertical-align: top;}
.top-logo .top-img01 {width:107px; height:28px; background:url("https://og.kakaobank.io/view/e3fa9b74-b4e1-499e-a828-d5e50ae1dc5d") 0 0 no-repeat; background-size:100%;}
.top-logo .top-img02 {float:right; width:80px; height:28px; background:url("https://og.kakaobank.io/view/eeb2aea7-cfc8-4086-bbbb-2234dcc8a5ae") 0 0 no-repeat; background-size:100%;}



.kv {clear:both; text-align: center;}
.kv .inner {padding-top:50px;}
.kv .tit01 {width:180px; height:30px; margin:0 auto 10px; background:url("https://og.kakaobank.io/view/f4ff53c7-3c51-4d5e-8240-b9184dd15d32") 0 0 no-repeat; background-size:100%;}
.kv .tit02 {position:relative; display: block; width:280px; height:260px; margin:0 auto 16px;}
.kv .tit02 .copy {position:relative; width:280px; height:260px; background:url("https://og.kakaobank.io/view/a6b10fd7-2ac2-49d7-86bd-3c13d4ffc98f") 0 0 no-repeat; background-size:100%;}
.kv .tit02 .copy:before {content:""; position:absolute; top:0; left:0; width:280px; height:260px; margin:0 auto 16px; background:url("https://og.kakaobank.io/view/a6b10fd7-2ac2-49d7-86bd-3c13d4ffc98f") 0 0 no-repeat; background-size:100%;
    animation:boom-ani 3s infinite;
    opacity:0.3;
}
.kv .tit02 .copy:after {content:""; position:absolute; top:0; left:0; width:280px; height:260px; margin:0 auto 16px; background:url("https://og.kakaobank.io/view/a6b10fd7-2ac2-49d7-86bd-3c13d4ffc98f") 0 0 no-repeat; background-size:100%;
    animation:boom-ani 3s 0.2s infinite;
    opacity:0.3;
}
.kv .star01 {position:absolute; top:0; left:0; width:21px; height:21px;}
.kv .star02 {position:absolute; top:0; left:0; width:30px; height:30px;}
.kv .star01:before {content:""; position:absolute; top:113px; left:-22px; width:21px; height:21px; background:url("https://og.kakaobank.io/view/9aaa6cbc-f77c-4266-b34e-cfdcdb2420e3") 0 0 no-repeat; background-size:100%;
    /*animation:star-opacity-ani 1s infinite;*/
    opacity:0;
    transform: scale(0);
    animation:star-scale-ani 2s 0.2s infinite;
}
.kv .star01:after {content:""; position:absolute; top:203px; left:-12px; width:21px; height:21px; background:url("https://og.kakaobank.io/view/5185262a-a8cd-4ce2-8552-c2dd81522294") 0 0 no-repeat; background-size:100%;
    opacity:0;
    transform: scale(0);
    animation:star-scale-ani 2s 1.4s infinite;
}

.kv .star02:before {content:""; position:absolute; top:196px; left:268px; width:30px; height:30px; background:url("https://og.kakaobank.io/view/fe096c43-5e2d-44aa-8eae-0a6abc313092") 0 0 no-repeat; background-size:100%;
    opacity:0;
    transform: scale(0);
    animation:star-scale-ani 2s 1s infinite;
}
.kv .star02:after {content:""; position:absolute; top:56px; left:268px; width:30px; height:30px; background:url("https://og.kakaobank.io/view/8edf565f-a290-40ab-a4d6-42fce2dc4302") 0 0 no-repeat; background-size:100%;
    opacity:0;
    transform: scale(0);
    animation:star-scale-ani 2s 1.8s infinite;
}

.kv .tit03 {width:274px; height:56px; margin:0 auto; background:url("https://og.kakaobank.io/view/589e7698-61aa-4fb0-bdef-cbae571040bf") 0 0 no-repeat; background-size:100%;}
.kv .seq {display: block; width:270px; height:270px; margin:0 auto; background:url("https://og.kakaobank.io/view/213529f1-1813-4e67-8419-963464521896") 0 0 no-repeat; background-size:100%;
    animation:seq-ani 1.5s steps(24) infinite;
}
.kv .steps-slide {max-width:600px; margin-top:24px;}
.kv .steps-slide > div {width:100%;}
.kv .arrow {position:absolute; width:43px; height:22px; background:url("https://og.kakaobank.io/view/33b5e10d-03a1-4362-b41a-49a410ba993c") 0 0 no-repeat; background-size:100%;}
.kv .steps {position:relative;}
.kv .step01 .desc {width:240px; height:160px; margin:0 auto; background:url("https://og.kakaobank.io/view/47d1f472-426a-434a-ba73-139a1605976c") 0 0 no-repeat; background-size:100%;}
.kv .step01 .arrow {top:69px; right:0;}
.kv .step02 .desc {width:240px; height:160px; margin:0 auto; background:url("https://og.kakaobank.io/view/9b659c28-a4d0-4f0d-ae49-6f3edf7e5a9d") 0 0 no-repeat; background-size:100%;}
.kv .steps-slide .slick-dots {text-align: center; margin-top:20px;}
.kv .steps-slide .slick-dots li {font-size:0; display: inline-block; vertical-align: top;}
.kv .steps-slide .slick-dots li button {font-size:0; width:8px; height:8px; background-color:rgba(255,255,255,0.2); border-radius: 50%; margin:0 5px;}
.kv .steps-slide .slick-dots li.slick-active button {background-color:#fff;}



@keyframes seq-ani {
    100% {background-position:0 -6480px;}
}

@keyframes star-scale-ani {
    0% {transform:scale(0); opacity:0;}
    10% {transform:scale(1); opacity:1;}
    15% {transform:scale(1); opacity:1;}
    20% {transform:scale(0); opacity:0;}
}



.week-apply {padding-top:50px; padding-bottom:40px;}
.week-apply ul li {margin-bottom:20px;}
.week-apply ul li:last-child {margin-bottom:0;}
.week-apply ul li .tit {width:150px; height:44px; margin:0 auto 40px;}
.week-apply ul li .desc {width:187px; height:24px; margin:0 auto;}
.week-apply .coming {background-color:#5964ca; padding:24px 0; border-radius: 30px; overflow: hidden;}
.week-apply .coming img {display:block; width:138px; margin:0 auto;}
.week-apply .gift01 {display: block; width:240px; margin:0 auto 40px;}
.week-apply .gift02 {display: block; width:240px; margin:0 auto 40px;}
.week-apply .btn-apply {width:100%; height:80px; padding:0 18px; box-sizing: border-box; margin-bottom:16px;}
.week-apply .btn-apply button {width:100%; height:100%; border-radius: 30px; background-color:#ffe830;}
.week-apply .btn-apply span {width:87px; height:25px; margin:0 auto; background:url("https://og.kakaobank.io/view/7e330b2f-5aa4-4091-9e8a-aa3ddf29c2b1") 0 0 no-repeat; background-size:100%;}
.week-apply .btn-apply.complete button {background-color:rgba(255,232,48,0.4);}
.week-apply .btn-apply.complete span {background:url("https://og.kakaobank.io/view/981c72a3-7f47-424a-89f3-a0e66d9c3c59") 0 0 no-repeat; background-size:100%;}
.week-apply .apply {padding:30px 0 24px; background-color:#fff; border-radius: 30px; overflow: hidden;}
.week-apply .week01 .tit {background:url("https://og.kakaobank.io/view/d5ebc3c6-3c72-4dec-9254-44a451f49024") 0 0 no-repeat; background-size:100%;}
.week-apply .week01 .desc {background:url("https://og.kakaobank.io/view/d97ea573-49d4-44e5-937c-46069bd39deb") 0 0 no-repeat; background-size:100%;}
.week-apply .week02 .tit {background:url("https://og.kakaobank.io/view/37587641-321b-46ee-b992-70959cc80fe2") 0 0 no-repeat; background-size:100%;}
.week-apply .week02 .desc {background:url("https://og.kakaobank.io/view/990f3948-5c90-425f-94c4-5a4eaa454487") 0 0 no-repeat; background-size:100%;}
.week-apply .week03 .tit {background:url("https://og.kakaobank.io/view/407c7bb7-99b0-432a-a5fc-c504c1df5258") 0 0 no-repeat; background-size:100%;}
.week-apply .week03 .desc {background:url("https://og.kakaobank.io/view/8db49471-5a8d-46fa-8a5e-1208a4d04428") 0 0 no-repeat; background-size:100%;}
.week-apply .week04 .tit {background:url("https://og.kakaobank.io/view/f333a383-78e6-4b56-a9cb-5c3212bc7bcf") 0 0 no-repeat; background-size:100%;}
.week-apply .week04 .desc {background:url("https://og.kakaobank.io/view/67710557-8437-40d3-bed8-c65bc1b9c410") 0 0 no-repeat; background-size:100%;}
.week-apply .finish {padding:30px 0 24px; background-color:#5964ca; border-radius: 30px;}
.week-apply .finish .copy {width:100px; height:30px; margin:0 auto 12px;}
.week-apply .finish .btn-winner {width:100%; padding:0 20px; box-sizing: border-box;}
.week-apply .finish .btn-winner button {width:100%; height:70px; border-radius: 30px; background-color:#374092;}
.week-apply .finish .btn-winner button span {width:137px; height:25px; margin:0 auto; background:url("https://og.kakaobank.io/view/acd4d3cc-29e8-4c9d-ac49-58929af72009") 0 0 no-repeat; background-size:100%;}
.week-apply .finish .btn-winner button:disabled {border:solid 2px rgba(63,73,167,0.4); background-color:#5964ca;}
.week-apply .finish .btn-winner button:disabled span {width:186px; height:25px; margin:0 auto;}


.week-apply .week01.finish .copy {background:url("https://og.kakaobank.io/view/6e50a719-0603-40e0-9e75-fe66fd140fc5") 0 0 no-repeat; background-size:100%;}
.week-apply .week01.finish .btn-winner button:disabled span {background:url("https://og.kakaobank.io/view/7d88246e-0b73-4ea0-af19-af1d64e52e5a") 0 0 no-repeat; background-size:100%;}
.week-apply .week02.finish .copy {background:url("https://og.kakaobank.io/view/61cfc336-2ace-45d6-894f-6738029b37c5") 0 0 no-repeat; background-size:100%;}
.week-apply .week02.finish .btn-winner button:disabled span {background:url("https://og.kakaobank.io/view/0629b219-b49a-43b6-9bea-b437b93377f6") 0 0 no-repeat; background-size:100%;}
.week-apply .week03.finish .copy {background:url("https://og.kakaobank.io/view/28091132-3c0b-4634-a1cc-095afdc82f54") 0 0 no-repeat; background-size:100%;}
.week-apply .week03.finish .btn-winner button:disabled span {background:url("https://og.kakaobank.io/view/2d6dbca7-a679-4232-aa34-820cf6fb5ec5") 0 0 no-repeat; background-size:100%;}
.week-apply .week04.finish .copy {background:url("https://og.kakaobank.io/view/f9e9365c-76ea-4394-a39a-c7ee9572378a") 0 0 no-repeat; background-size:100%;}
.week-apply .week04.finish .btn-winner button:disabled span {background:url("https://og.kakaobank.io/view/64c4325c-0a54-4617-acd3-fd9a9013330f") 0 0 no-repeat; background-size:100%;}

.share-event {padding:40px 0 80px; text-align: center;}
.share-event .copy {width:321px; height:280px; margin:0 auto 30px; background:url("https://og.kakaobank.io/view/7204df85-f3a3-4c2b-ad4e-3496d41246fe") 0 0 no-repeat; background-size:100%;}
.share-event .default-share-btns {display: block; font-size:0; text-align: center;}
.share-event .default-share-btns button {display: inline-block; width:61px; height:61px; margin-right:12px;}
.share-event .default-share-btns button:last-child {margin-right:0;}


.info {background-color:#374092; color:#fff; padding:40px 0 80px;}
.info .mini-info .copy {width:240px; height:180px; margin:0 auto 24px; background:url("https://og.kakaobank.io/view/04a37665-0745-4ae4-8df3-cb0d36641ca3") 0 0 no-repeat; background-size:100%;}
.info .mini-info .btn-detail {width:100%; padding:0 18px; margin-bottom:50px; box-sizing: border-box;}
.info .mini-info .btn-detail a {display:block; width:100%; padding:23px 0; background-color:#8894fe; border-radius: 30px;}
.info .mini-info .btn-detail a span {width:149px; height:24px; margin:0 auto; background:url("https://og.kakaobank.io/view/9c3b83c6-c140-4510-840b-e9333816c82e") 0 0 no-repeat; background-size:100%;}

.info dl {margin:0 auto; padding:0 20px; box-sizing: border-box;}
.info dl dt {font-size:14px; line-height:22px; margin-top:22px; font-weight: bold;}
.info dl dd {position:relative; padding-left: 13px; font-size:14px; line-height: 22px;}
.info dl dd:before {content:"·"; display: block; position:absolute; top:0; left:0; font-size:14px; line-height: 1.57;}
.info dl dd.serial {font-size:14px; font-weight:bold; margin-top:20px;}
.info dl dd.serial:before {content:none;}




/****** popups **************************/
.popups {position:fixed; top:0; left:0; width:100%; height:100%; z-index:999; display: table; text-align: center; visibility: hidden; opacity:0;}
.popups.on {visibility: visible; opacity:1;}
.popups .pop-inner {display: table-cell; vertical-align: middle;}
.popups .bg {position:absolute; top:0; left:0; width:100%; height:200%; background-color:rgba(0,0,0,0.4);}
.popups .pop-content {position:relative; max-width:330px; padding:0 20px; margin:0 auto;}
.popups .pop-content-inner {background-color:#fff; border-radius: 30px;}
.popups .copy {position:relative; display: block; padding:40px 0 30px; text-align: center; }
.popups img {width:100%;}
.popups .ok-btn {display: block; width:100%; padding:0 20px 30px; box-sizing: border-box;}
.popups .ok-btn button,
.popups .ok-btn a {display:block; width:100%; font-size:0; background-color:#ffe400; text-align: center; padding:16px 0; border-radius: 20px;}
.popups .ok-btn img {width:36px;}

.popup-complete .tit {width:185px; margin:0 auto 24px;}
.popup-complete .desc {display: block; font-size:15px; line-height: 21px; margin-bottom:20px; color:#3d4465;}
.popup-complete .desc .bold {font-weight: bold;}
.popup-complete .toggle {width:57px;}


.popup-notwinner .tit {width:244px; margin:0 auto 24px;}
.popup-notwinner .copy {padding-bottom:6px;}
.popup-notwinner .desc {display: block; font-size:15px; line-height: 21px; color:#3d4465; margin-bottom:18px;}
.popup-notwinner .ok-btn .alert-week1 {width:167px;}
.popup-notwinner .ok-btn .alert-week2 {width:167px;}
.popup-notwinner .ok-btn .alert-week3 {width:167px;}

.popup-winner .copy {padding-bottom:0;}
.popup-winner .tit {width:200px; margin-bottom:30px;}
.popup-winner .desc {display:block; font-size:15px; line-height: 21px; color:#3d4465; margin-bottom:20px;}
.popup-winner .winner-info {padding:0 20px;}
.popup-winner .winner-info span {display:block; text-align: center; font-size:15px; line-height: 21px; color:#3d4465; margin-bottom:24px; padding:16px 0; background-color:#f5f5f6; border-radius: 20px;}

.popup-notapply .tit {width:263px;}
.popup-already .tit {width:173px;}
.popup-pc .tit {width:211px;}

.popup-create-mini {}
.popup-create-mini .pop-content-inner {border-radius: 0;}
.popup-create-mini .pop-content-inner .desc {font-size:16px; line-height: 23px; color:#000;}
.popup-create-mini .pop-content-inner .btns button {float:left; font-size:16px; height:54px; line-height: 54px; color:#000;}
.popup-create-mini .pop-content-inner .btns .ok-btn {width:40%; background-color:#dddddd;}
.popup-create-mini .pop-content-inner .btns .create-mini-btn {width:60%; background-color:#ffe100;}
.popup-create-mini .pop-content-inner .clear {clear:both;}



.popups .alert-weeks {display: none;}
.popups[data-week='1'] .alert-week1 {display: inline-block;}
.popups[data-week='2'] .alert-week2 {display: inline-block;}
.popups[data-week='3'] .alert-week3 {display: inline-block;}
.popups[data-week='4'] .alert-week4 {display: inline-block;}



@media screen and (max-width: 320px) {
    .popup-winner .tit {width:160px;}
}