@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:#fef5ce;}
main {width:100%; overflow: hidden;}
section {padding-bottom:60px;}
section .inner {max-width:375px; width:100%; margin:0 auto; padding:0 30px; text-align: left; box-sizing: border-box;}

.kv {padding-top:56px;}
.kv h3 {position:relative; width:270px; height:19px; margin:0 auto 27px; z-index:1; background:url("https://og.kakaobank.io/view/f56fca69-9877-410f-85f0-70a6d62a5725") no-repeat 0 0; background-size:100%;}
.kv .tit {position:relative; width:270px; height:257px; margin:0 auto 155px; background:url("https://og.kakaobank.io/view/73ee08af-dc97-476a-bbc4-11f866730eb0") no-repeat 0 0; background-size:100%;}
.kv .tit:before {content:""; position:absolute; top:-43px; left:174px; width:100px; height:69px; background:url("https://og.kakaobank.io/view/ecd7df11-7f44-4b03-9f7d-1648db694bac") no-repeat 0 0; background-size:100%;}
.kv .tit:after {content:""; position:absolute; top:110px; left:-33px; width:89px; height:59px; background:url("https://og.kakaobank.io/view/8cac719a-4470-4636-a9d4-b20293279b5e") no-repeat 0 0; background-size:100%;}
.kv .tit .character {position:absolute; top:197px; left:23px; width:224px; height:224px; background:url("https://og.kakaobank.io/view/f1e10e79-373b-4fae-a781-f95c92824d6c") no-repeat 0 0; background-size:4683px 224px;
    -webkit-animation:kv-animate 1.8s steps(21) infinite;
    animation:kv-animate 1.8s steps(21) infinite;
}
.kv .desc {width:270px; height:118px; margin:0 auto 45px; background:url("https://og.kakaobank.io/view/f78d3b16-a767-45a2-a17e-7df39fb90891") no-repeat 0 0; background-size:100%;}
.kv .btn-apply {display: block; max-width:327px; width:100%; padding:27px 0; margin:0 auto; background-color:#0229bf; border-radius: 43px;}
.kv .btn-apply span {width:107px; height:35px; margin:0 auto; background:url("https://og.kakaobank.io/view/75cf7dc7-7fc0-4d19-a005-035e7eb02f20") no-repeat 0 0; background-size:100%;}

@-webkit-keyframes kv-animate {
    100% {background-position:-4683px 0;}
}

@keyframes kv-animate {
    100% {background-position:-4683px 0;}
}



.howto h3 {width:315px; height:79px; margin:0 auto 40px; background:url("https://og.kakaobank.io/view/279e9714-38b1-44f2-aa48-598534e02dab") no-repeat 0 0; background-size:100%;}
.howto .target {width:270px; height:85px; margin-bottom:40px; background:url("https://og.kakaobank.io/view/c571a76b-5660-4384-bb7f-7653efb2be9f") no-repeat 0 0; background-size:100%;}
.howto .apply {width:270px; height:110px; background:url("https://og.kakaobank.io/view/8307d3b7-e7e7-4485-8813-442e6fa8514b") no-repeat 0 0; background-size:100%;}


.gift h3 {width:315px; height:107px; margin:0 auto 40px; background:url("https://og.kakaobank.io/view/8669b3f8-808b-42a7-b207-17a4c4e64d73") no-repeat 0 0; background-size:100%;}
.gift ul {font-size:0;}
.gift ul li {display: inline-block; width:50%; margin-bottom:40px; box-sizing: border-box; vertical-align: top;}
.gift ul li:nth-of-type(2n+1) {padding-right:17.5px;}
.gift ul li:nth-of-type(2n) {padding-left:17.5px;}
.gift ul li:nth-last-child(1),
.gift ul li:nth-last-child(2) {margin-bottom:0;}


.share {padding-bottom:70px;}
.share h3 {width:210px; height:90px; margin:0 auto 24px; background:url("https://og.kakaobank.io/view/9dc4493b-1822-434b-803e-e6429ca63994") no-repeat 0 0; background-size:100%;}
.share .default-share-btns {display: block; font-size:0; text-align: center;}
.share .default-share-btns button {display: inline-block; width:60px; height:60px; margin-right:15px;}
.share .default-share-btns button:last-child {margin-right:0;}



.info {background-color:#0d2068;}
.info .inner {padding:50px 26px 0;}
.info .info-tit {font-size:18px; font-weight: bold; padding-bottom:35px;}
.info dl dt {width:134px; height:24px; margin-bottom:26px; background:url("https://og.kakaobank.io/view/105f67be-b5d2-41bb-9ff7-fd2e84cc3b58") no-repeat 0 0; background-size:100%;}
.info dl dd {position:relative; padding-left: 13px; font-size:14px; line-height: 22px; color:rgba(255,255,255,0.7);}
.info dl dd:before {content:"·"; display: block; position:absolute; top:0; left:0; font-size:14px; line-height: 1.57;}
.info dl dd.serial {margin-top:25px; padding-left:0;}
.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; padding:36px 0 20px;}
.popups .copy {position:relative; display: block; text-align: center; padding-bottom:36px; }
.popups img {width:100%;}
.popups .ok-btn {display: block; width:100%; padding:0 20px; box-sizing: border-box;}
.popups .ok-btn button,
.popups .ok-btn a {display:block; width:100%; font-size:0; background-color:#0229bf; text-align: center; padding:18px 0; border-radius: 33px;}
.popups .ok-btn .btn-ok img {width:40px;}

.popup-winner .pop-content-inner {background-color:#fef5ce; padding-top:50px;}
.popup-winner .copy {padding-bottom:0;}
.popup-winner .tit {width:193px; height:38px; margin:0 auto 20px; background:url("https://og.kakaobank.io/view/2646f3b0-7713-492a-a9fb-50dc0ecd8137") no-repeat 0 0; background-size:100%;}
.popup-winner .gift {width:276px; margin:0 auto;}
.popup-winner .desc {position:relative; width:276px; height:51px; margin:0 auto; padding-bottom:115px; background:url("https://og.kakaobank.io/view/20e4e778-fb9b-4ff1-9e5d-cacd9a9d3aec") no-repeat 0 0; background-size:100%;}
.popup-winner .desc:after {content:""; position:absolute; bottom:0; left:54px; width:168px; height:107px; background:url("https://og.kakaobank.io/view/35ec8b42-b8e0-41aa-9e6b-a2a7ed5b6790") no-repeat 0 0; background-size:1008px 107px;
    -webkit-animation:pop-winner-animate 1s steps(6) infinite;
    animation:pop-winner-animate 1s steps(6) infinite;
}
.popup-winner .btn-pop-share {margin-bottom:6px;}
.popup-winner .btn-pop-share img {width:144px;}
.popup-winner .ok-btn .btn-ok {background-color:#ffd677;}
.popup-winner .alert-gift {display: none;}
.popup-winner[data-gift='dom'] .alert-gift-dom {display:block;}
.popup-winner[data-gift='bbq'] .alert-gift-bbq {display:block;}
.popup-winner[data-gift='two'] .alert-gift-two {display:block;}
.popup-winner[data-gift='sta'] .alert-gift-sta {display:block;}
.popup-winner[data-gift='gga'] .alert-gift-gga {display:block;}
.popup-winner[data-gift='ban'] .alert-gift-ban {display:block;}

@-webkit-keyframes pop-winner-animate {
    100% {background-position:-1008px 0;}
}

@keyframes pop-winner-animate {
    100% {background-position:-1008px 0;}
}

.popup-notwinner .pop-content-inner {background-color:#fef5ce; padding-top:50px;}
.popup-notwinner .copy {padding-bottom:0;}
.popup-notwinner .tit {width:167px; height:38px; margin:0 auto 20px; background:url("https://og.kakaobank.io/view/4c1c7a79-ee74-4eb3-8680-7761243bb710") no-repeat 0 0; background-size:100%;}
.popup-notwinner .desc {position:relative; width:276px; height:51px; margin:0 auto; padding-bottom:115px; background:url("https://og.kakaobank.io/view/91aa6f1a-6e59-4966-ae44-43b20ea7ad52") no-repeat 0 0; background-size:100%;}
.popup-notwinner .desc:after {content:""; position:absolute; bottom:0; left:54px; width:168px; height:107px; background:url("https://og.kakaobank.io/view/1da2e995-1add-4536-88fb-98a41166e908") no-repeat 0 0; background-size:4032px 107px;
    -webkit-animation:pop-notwinner-animate 2s steps(24) infinite;
    animation:pop-notwinner-animate 2s steps(24) infinite;
}
.popup-notwinner .btn-pop-share {margin-bottom:6px;}
.popup-notwinner .btn-pop-share img {width:144px;}
.popup-notwinner .ok-btn .btn-ok {background-color:#ffd677;}

@-webkit-keyframes pop-notwinner-animate {
    100% {background-position:-4032px 0;}
}

@keyframes pop-notwinner-animate {
    100% {background-position:-4032px 0;}
}


.popup-nottarget .tit {width:254px;}
.popup-already .tit {width:241px;}
.popup-kakao .tit {width:241px;}
.popup-dup-kakao .tit {width:207px;}
.popup-pc .tit {width:156px;}
.popup-finish .tit {width:156px;}


@media screen and (max-width: 320px) {
    section .inner {padding:0 10px;}
}