@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;}
div {vertical-align: top;}
span {display: inline-block; vertical-align: top;}
button:focus {outline: none;}

.ir {font-size:0; text-indent: -99999px;}

section {text-align: center;}
section > .inner {max-width:420px; margin:0 auto; width:100%;}
section.section-kv-event1 {background-color:#ffffff; padding:60px 20px;}
section.section-event2 {background-color:#f7f7f7; padding:60px 20px;}
section.section-info {background-color:#e9e9eb; padding:50px 24px 80px;}

.kv {padding-bottom: 60px;}
.kv .kv-area {position:relative;}
.kv .kv-tit {position:relative; width:240px; height:339px; margin-bottom:40px; background:url("https://og.kakaobank.io/view/dce45a93-d0f2-42fe-bc1c-0ebf06ceafba") no-repeat 0 0; background-size:100%;}
.kv .kv-sp {display: block; position:absolute; top:0; left:0;}
.kv .kv-sp:before {content:""; position:absolute; top:32px; left:19px; width:63px; height:63px; background:url("https://og.kakaobank.io/view/8523af48-5115-4d06-8ac5-eca68a86e228") no-repeat; background-size:63px;
    -webkit-animation:kv-spani-01 2s steps(25) infinite;
    animation:kv-spani-01 2s steps(25) infinite;
}
.kv .kv-sp:after {content:""; position:absolute; top:196px; left:11px; width:63px; height:63px; background:url("https://og.kakaobank.io/view/576c59f2-2de5-4e5b-bce6-f8f0cf5fd7ad") no-repeat; background-size:63px;
    -webkit-animation:kv-spani-02 2s steps(25) infinite;
    animation:kv-spani-02 2s steps(25) infinite;
}
.kv .kv-subtit {width:240px; height:104px; margin-bottom:40px; background:url("https://og.kakaobank.io/view/9f388b13-c070-404b-a4c3-8ce5067f54fb") no-repeat 0 0; background-size:100%;}
.kv .video-container {position:relative; font-size:0; background-color:#000; overflow:hidden;}
.kv .video-container .video-area {position:absolute; top:0; left:0; width:100%; height: 100%;}
.kv .video-container .video-area iframe {width:100%; height:100%;}
.kv .video-container .video-play-box {position:relative; display: block; visibility: hidden; opacity:0;}
.kv .video-container .video-play-box img.thumb {width:100%;}



.event1 .event1-tit {width:260px; height:200px; background:url("https://og.kakaobank.io/view/92f533be-4fe0-4d9c-9fa7-532365eb3819") no-repeat 0 0; background-size:100%; margin-bottom:50px;}
.event1 .video-share-btns {display: block; font-size:0; margin-bottom:50px;}
.event1 .video-share-btns a {display: inline-block; margin:0 7px;}
.event1 .video-share-btns a.kt {width:70px; height:70px; background:url("https://og.kakaobank.io/view/0f93706e-2650-4105-8668-1859c68230b5") no-repeat 0 0; background-size:100%;}
.event1 .video-share-btns a.fb {width:70px; height:70px; background:url("https://og.kakaobank.io/view/e3d84988-76f8-4eba-af9f-f42cb9f0bcd9") no-repeat 0 0; background-size:100%;}
.event1 .video-share-btns a.tw {width:70px; height:70px; background:url("https://og.kakaobank.io/view/1845abf4-ff71-4ca6-a454-2605bf02f890") no-repeat 0 0; background-size:100%;}
.event1 .prize {width:260px; height:320px; background:url("https://og.kakaobank.io/view/b5d914e5-e0da-4f10-bb35-5f8b18e4c632") no-repeat 0 0; background-size:100%;}




.event2 .event2-tit {width: 260px; height:200px; margin-bottom:50px; background:url("https://og.kakaobank.io/view/b7198a2c-ee2d-453a-8faa-a4653d8ecf57") no-repeat 0 0; background-size:100%;}
.event2 .prize {width: 260px; height:344px; margin-bottom:50px; background:url("https://og.kakaobank.io/view/150c10c0-60f3-482b-9468-6c3ca7679723") no-repeat 0 0; background-size:100%;}
.event2 .vote-list li {background-color:#ffffff; border-radius: 20px; overflow: hidden; padding:40px 0; margin-bottom:18px;}
.event2 .vote-list li:last-child {margin-bottom:0;}
.event2 .vote-list li .vote-list-tit {width:200px; height:90px; margin-bottom:20px;}
.event2 .vote-list li .vote-list-tit01 {background:url("https://og.kakaobank.io/view/b7a97f05-0061-47e4-86d9-c5768fd8e794") no-repeat 0 0; background-size:100%;}
.event2 .vote-list li .vote-list-tit02 {background:url("https://og.kakaobank.io/view/6ae0a082-dcaa-48cb-840e-57c78ae8909b") no-repeat 0 0; background-size:100%;}
.event2 .vote-list li .vote-list-tit03 {background:url("https://og.kakaobank.io/view/e235517b-220b-42b7-94ed-7020079951e7") no-repeat 0 0; background-size:100%;}
.event2 .vote-list li .vote-thumb {position:relative; margin:0 30px; border-radius: 20px; overflow:hidden; margin-bottom:30px;}
.event2 .vote-list li .vote-thumb .thumb {font-size:0;}
.event2 .vote-list li .vote-thumb .thumb img {width:100%;}
.event2 .vote-list li .vote-thumb .thumb1 {background:url("https://og.kakaobank.io/view/d8913adb-b753-4a3c-90e8-d9d9bd41edd7") no-repeat; background-size:100%;
    -webkit-animation:card-ani-thumb 2s steps(9) infinite;
    animation:card-ani-thumb 2s steps(9) infinite;
}
.event2 .vote-list li .vote-thumb .thumb2 {background:url("https://og.kakaobank.io/view/6dedafe4-f2bf-413e-a929-7be77ffba201") no-repeat; background-size:100%;
    -webkit-animation:card-ani-thumb 2s steps(12) infinite;
    animation:card-ani-thumb 2s steps(12) infinite;
}
.event2 .vote-list li .vote-thumb .thumb3 {background:url("https://og.kakaobank.io/view/49739439-616e-4390-bb95-2f7dc60cc1de") no-repeat; background-size:100%;
    -webkit-animation:card-ani-thumb 2s steps(11) infinite;
    animation:card-ani-thumb 2s steps(11) infinite;
}
.event2 .vote-list li .vote-thumb .copys {position:absolute; bottom:16px; left:0; width:100%;}
.event2 .vote-list li .vote-thumb .vote-copy {position:absolute; bottom:0; left:18px; font-size:14px; font-weight: 800; line-height: 1.43; color:#fff;}
.event2 .vote-list li .vote-thumb .vote-num {position:absolute; bottom:0; right:18px; font-size:20px; font-weight: 800; line-height: 1.15; color:#fff;}
.event2 .vote-list li .vote-btn {padding:0 20px; width:100%; height:66px; box-sizing: border-box; }
.event2 .vote-list li .vote-btn button { display: block; width:100%; height:100%; border-radius: 10px; font-size:0;}
.event2 .vote-list li .vote-btn button .vote-btn-copy { width:90px; height:30px; font-size:0; background:url("https://og.kakaobank.io/view/2bee1d0e-dc5e-49c0-acdf-e63238913ed6") no-repeat 0 0; background-size:100%;}
.event2 .vote-list li .vote-btn01 button {background-color:#bae471; }
.event2 .vote-list li .vote-btn02 button {background-color:#80a0e7; }
.event2 .vote-list li .vote-btn03 button {background-color:#fcae72; }



.info {text-align: left;}

.info .default-share {text-align: center; margin-bottom:60px;}
.info .default-share .default-share-tit {width:210px; height:24px; margin:0 auto 24px; background:url("https://og.kakaobank.io/view/b755bd4c-9b59-46a1-bb78-773c636236c3") no-repeat 0 0; background-size:100%;}
.info .default-share .default-share-btns {display: block; font-size:0; text-align: center;}
.info .default-share .default-share-btns button {display: inline-block; width:61px; height:61px; margin-right:12px;}
.info .default-share .default-share-btns button:last-child {margin-right:0;}
.info .default-share .default-share-btns button.kakaotalk {background:url("https://og.kakaobank.io/view/5446d955-ea1d-436c-8531-3e57798bac67") no-repeat 0 0; background-size:100%;}
.info .default-share .default-share-btns button.facebook {background:url("https://og.kakaobank.io/view/a1dc8314-970a-4cdf-93ac-9f6216e160c0") no-repeat 0 0; background-size:100%;}
.info .default-share .default-share-btns button.twitter {background:url("https://og.kakaobank.io/view/3ea51498-dfda-4d05-a4e9-610a740feb66") no-repeat 0 0; background-size:100%;}
.info .default-share .default-share-btns button.intent {background:url("https://og.kakaobank.io/view/9924a62a-8b20-4585-bc28-42fd5fab3587") no-repeat 0 0; background-size:100%;}

.info .info-tit {font-size:18px; font-weight: bold; padding-bottom:35px;}
.info dl dt {font-size:14px; font-weight: bold; }
.info dl dd {font-size:14px; line-height:1.57; color:#22252e; margin-bottom:30px;}
.info dl dd span {position:relative; padding-left: 13px;}
.info dl dd span:before {content:"·"; display: block; position:absolute; top:0; left:0; font-size:14px; line-height: 1.57;}
.info dl dd:last-child {margin-bottom:0;}
.info .serial {font-size:14px; font-weight: 800; line-height: 1.57; color:#22252e; margin-top:20px;}



/****** 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 .pop-inner .bg {position:absolute; top:0; left:0; width:100%; height:200%; background-color:rgba(0,0,0,0.4);}
.popups .pop-inner .pop-content {position:relative; max-width:330px; padding:0 20px; margin:0 auto;}
.popups .pop-inner .pop-content .pop-content-inner {background-color:#fff; border-radius: 8px;}
.popups .pop-inner .pop-content .copy {position:relative; display: block; padding:40px 0 40px; text-align: center; }
.popups .pop-inner .pop-content .copy img {max-width:260px; width:100%;}
.popups .pop-inner .pop-content .ok-btn,
.popups .pop-inner .pop-content .create-mini-btn {display: block; width:100%; padding:0 15px 15px;}
.popups .pop-inner .pop-content .ok-btn span,
.popups .pop-inner .pop-content .create-mini-btn span {display:block; font-size:0; background-color:#ffe400; text-align: center; padding:18px 0; border-radius: 6px;}
.popups .pop-inner .pop-content .ok-btn img {width:40px;}
.popups .pop-inner .pop-content .create-mini-btn img {width:120px;}

.popup-pc .pop-inner .pop-content .copy img {width:210px;}


.popup-complete .sp {display: block; width:63px; height:63px; background:url("https://og.kakaobank.io/view/576c59f2-2de5-4e5b-bce6-f8f0cf5fd7ad") no-repeat; background-size:63px; margin:0 auto 12px;
    -webkit-animation:kv-spani-02 2s steps(25) infinite;
    animation:kv-spani-02 2s steps(25) infinite;
}
.popup-complete .pop-inner .pop-content .copy {padding:20px 0;}

.popup-finish .copy {padding:48px 0 40px;}
.popup-finish .copy img {width:244px;}



@keyframes kv-spani-01 {
    100% {background-position:0 -1575px;}
}

@keyframes kv-spani-02 {
    100% {background-position:0 -1575px;}
}

@keyframes card-ani-thumb {
    100% {background-position:0 100%;}
}


@media screen and (min-width: 420px) {
    .popup-pc .pop-inner .pop-content {max-width:240px;}
    .popup-pc .pop-inner .pop-content .copy {padding:30px 0 30px;}
    .popup-pc .pop-inner .pop-content .copy img {width:160px;}
    .popup-pc .pop-inner .pop-content .ok-btn img {width:30px;}
    .popup-pc .pop-inner .pop-content .ok-btn span {padding:11px 0;}
}


@media screen and (max-width: 320px) {
    .info .default-share .default-share-btns button {margin-right:7px;}
}