@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;}

body {font-family: Pretendard, sans-serif;background:#111;color:#fff;}

.section--first {height: 100vh;}
.logo-kabang {display:block;position:absolute;width:89px;height:14px;left:30px;top:30px;background: url(https://og.kakaobank.io/view/b7cc812a-6928-4fb8-9757-0478386e8f9a);background-size:  89px 14px;color:transparent;font-size:0;}
.section--first__bg {height:100%;width:100%;object-fit: cover;}
.section--first__ani {position: absolute;left:0;right:0;top:50%;margin:auto;font-size: 0;transform:translateY(-50%);}

.img-txt--title--01 {display: block;width: 286px;height: 55px;margin:auto;background: url(https://og.kakaobank.io/view/19080dfc-a672-461e-8b1b-5f203e5c8e1c);background-size:  286px 55px;}
.img-txt--title--02 {display: block; width: 285px;height: 63px;margin:12px auto auto;position: relative;overflow: hidden;}
.img-txt--title--01, .img-txt--title--02 {opacity:0;transform:translateY(-6px);transition:transform 0.3s, opacity 0.3s;}
.img-txt--title {display: block;position: absolute;width: 286px;height: 55px;left:0;right:0;top:10px;margin:auto;background: url(https://og.kakaobank.io/view/692c60d6-a2eb-40e7-b111-94797ea96c4c);background-size:  286px 55px;opacity:0;transform:translateY(-6px);transition:transform 0.3s, opacity 0.3s;}
.img-txt--desc {font-weight: bold; display: block;position: absolute;width:243px;height: 53px;left:0;right:0;top:95px;margin:auto;background:url(https://og.kakaobank.io/view/2b43bb1d-e4a0-43b9-9ccb-a164f6bf71bf);background-size: 243px 53px; opacity:0;transform:translateY(-6px);transition:transform 0.3s, opacity 0.3s;}
.img-txt--title.is-active {transform: translateY(0px);opacity: 1;transition:transform 0.8s, opacity 0.8s;}
.img-txt--title--01.is-active,
.img-txt--title--02.is-active,
.img-txt--desc.is-active,
.downarrow-box.is-active,
.btn-video.is-active {transform: translateY(0px);opacity: 1;}
.btn-video {color:transparent;font-size:0;display: block;width: 169px;height: 58px;margin:155px auto auto;background: url(https://og.kakaobank.io/view/deec43b0-ce64-44cc-81ec-2020202824d0);background-size:  169px 58px; transform: translateY(-6px);opacity: 0;transition:transform 0.3s, opacity 0.3s;}
.downarrow-box {transform: translateY(-6px);opacity: 0;transition:transform 0.3s, opacity 0.3s;}

.notice {max-width: 315px;margin: auto;padding:80px 30px 170px;color:#f1f1f1;}
.notice h2 {font-size: 24px;line-height: 38px;margin-bottom:40px;}
.items {font-size:15px;line-height: 26px;}
.items>li {padding-left:8px;display: block;position: relative;}
.items>li:before {content: "・";display: block;position: absolute;left:0;top:0;margin:auto;font-family: 'Apple SD Gothic Neo', 'Malgun Gothic','맑은 고딕', system-ui, sans-serif;}
.accordion {border-top: 2px solid #f1f1f1;margin-top:30px}
.accordion__item h3 {display: block;height:21px;margin-top:20px;position: relative;line-height: 21px;}
.accordion__switch {position: absolute; top:0;right:20px;bottom:0; width:22px;height:22px;margin:auto;display:block;background: url(https://og.kakaobank.io/view/2bca2509-c90d-4756-a3ab-b8fe7940a89a);background-size: 22px 22px;-webkit-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition: transform 0.3s;transition: transform 0.3s;}
.accordion__content {display:none;margin-top:20px;}
.accordion__label {cursor: pointer;}
.accordion__item.is-active .accordion__switch {-webkit-transform:rotate(135deg);transform:rotate(135deg);}
.accordion__item.is-active .accordion__content {display: block;}

.accordion__item.is-active .items {animation: showDown 0.3s}
@keyframes showDown {
	0% {transform: translateY(-6px);}
	100% {transform: translateY(0px);}
}

.reward-card {border-radius: 30px;position: relative;background: rgba(255,255,255,0.1);padding:40px 28px 50px;max-width: 307px;margin:auto;box-sizing: border-box;text-align: center;font-size:18px;line-height: 21px;}
.reward-card.reward-card--2 {margin-top:20px;padding:30px 0px 40px;}
.reward-winner {margin-bottom: 50px;}
.reward-winner li+li {padding-top: 28px;}
.reward-step {width: 100%;text-align: left;}
.reward-step li+li {margin-top:32px;}
.reward-step__no {font-size:16px;display: block;width: 56px;margin:auto;background:url(https://og.kakaobank.io/view/ac4837d3-eba1-49ee-8314-f8e946383acc) 0 10px no-repeat;text-align: center;padding-bottom:4px;background-size: 56px 10px;}
.reward-step__cont {margin-top:16px;text-align: center;font-size:18px;line-height: 28px;}

.block {margin:auto;max-width: 375px;text-align: center;position: relative;}
.block+.block {margin:120px auto 0px;}
.block__media {display:block;width:295px;height:255px;margin:auto;}
.block__media video {width:100%;height:100%;object-fit: cover;}
.block__media--01 {width: 369px;height: 313px;position: relative;}
.block__title {margin-top:20px;font-size:36px;line-height: 50px;margin-bottom:20px;}
.link-more {display:block;widtH:95px;height:25px;font-size:16px;line-height: 25px;background: url(https://og.kakaobank.io/view/c531e68e-384f-4ec2-a8cc-05474be7b2bb);background-size: 95px 25px; color:transparent;margin:auto;}

.toggle-showup {
	visibility: hidden;
	outline: 10px solid #fff;
	transform: translateY(-40px);
}
.toggle-showup.is-active {
	visibility: visible;
	transform: translateY(-64px);
	transition: transform 0.2s;
}
.ani-bottom {position:absolute;left:0;right:0;bottom:0;height:10px;background: #fff;}
.section--first__ani--block {position: relative;height:55px;}
.ani-showup--01 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/caf5ef3e-733e-42d7-bd98-680d53e72cab);background-size:  285px 64px;border-top:64px solid #fff;}
.ani-showup--02 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/5f9b123d-a840-4643-abbe-0494d28879ad);background-size:  285px 64px;border-top:64px solid #fff;}
.ani-showup--03 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/f4bebcb7-f8eb-4b34-b119-84215cb8064f);background-size:  285px 64px;border-top:64px solid #fff;}
.ani-showup--04 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/0d0b59c0-5814-4771-b9e9-0320a3da1159);background-size:  285px 64px;border-top:64px solid #fff;}
.ani-showup--05 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/c49d0328-bc06-454e-a1b6-ba52e47cf0e3);background-size:  285px 64px;border-top:64px solid #fff;}
.ani-showup--06 {width: 285px;height: 64px;position:absolute;left:0;top:0;background: url(https://og.kakaobank.io/view/b71b16b9-a861-4a14-92bb-c538b12dc7fe);background-size:  285px 64px;border-top:64px solid #fff;}
.block--first {margin-top:0px !important}
.block--first .block__title--wrapper {position: relative;display: block;width: 303px;height: 123px;margin:auto;}
.block--first .block__title {position: relative; font-size:0px;line-height: 33px;display: block;width: 303px;height: 78px;background: url(https://og.kakaobank.io/view/072a5735-02ce-4a27-a9c0-db2b0d6cf1a6);background-size: 303px 78px;margin: 12px auto;}
.grad01 {opacity: 0.5; pointer-events: none;position: absolute;left:-280px;top:0;width: 443px; height: 493px;background: url(https://og.kakaobank.io/view/12db7c68-90b2-4227-95bb-b0d1d84457b6);background-size: 443px 493px;}
.grad02 {opacity: 0.8; pointer-events: none;position: absolute;right: -240px;bottom: -250px;width: 429px;height: 533px;background: url(https://og.kakaobank.io/view/f01e81da-bf12-4a69-9ab9-899fae5cbd25);background-size: 429px 533px;}
.grad03 {opacity: 0.5; pointer-events: none;position: absolute;right: -280px;bottom: -230px;width: 590px;height: 529px;background: url(https://og.kakaobank.io/view/ef8eebf9-cc2d-4518-ace1-3f60f6f2bff3);background-size: 590px 529px;}
.grad02-2 {opacity: 0.5; pointer-events: none;position: absolute;left: -240px;bottom: -250px;width: 429px;height: 533px;background: url(https://og.kakaobank.io/view/f01e81da-bf12-4a69-9ab9-899fae5cbd25);background-size: 429px 533px;}
.grad01-2 {opacity: 0.5; pointer-events: none;position: absolute;right: -300px;top: 90px;width: 443px;height: 493px;background: url(https://og.kakaobank.io/view/12db7c68-90b2-4227-95bb-b0d1d84457b6);background-size: 443px 493px;}
.grad04 {opacity: 0.5; pointer-events: none;position: absolute;left: -210px;top: 90px;width: 371px;height: 389px;background: url(https://og.kakaobank.io/view/5b363927-cfdf-49e5-9e03-37f0555c92f1);background-size: 371px 389px;}
.grad05 {opacity: 0.5; pointer-events: none;position: absolute;right: -230px;bottom: -30px;width: 477px;height: 505px;background: url(https://og.kakaobank.io/view/a46d168e-72aa-4362-ab1f-1f029686642d);background-size: 477px 505px;}
.txt-event {display: inline-block;margin:auto;font-size:20px;text-align: center;line-height: 20px;font-weight: bold;color:#000;background: #fff;padding:6px 8px;}
.event-title-sup {margin-top:24px;font-size: 22px;}
.block.block--event {margin-top: 140px;}
.block--event .block__title {margin-top:10px;font-size:42px;line-height: 56px;}
.event-desc {font-size:17px;line-height: 27px;padding-top:20px;}
.event-date {font-size:17px;padding-top:20px;}
.block--event .block__media{position: relative;height: 300px;width: 315px;}
.grad-txt01 {display: block;position: absolute;left:0;bottom: 46px;width: 178px;height: 21px;background: url(https://og.kakaobank.io/view/6d25d002-fa10-4984-bb10-1d3ee1c8e988);background-size: 178px 21px;}
.ani-floating {
	animation: floating 1.5s infinite;
}
.ico-downarrow {
	display: block;
	width:45px;
	height:45px;
	position: absolute;
	left:0;
	right:0;
	bottom:30px;
	margin:auto;
	background:url(https://og.kakaobank.io/view/2a4bc0ce-7e75-4c7a-bd1e-7b4f0c095508);
	background-size:  45px 45px;
	transform: translateY(0px);
}
@keyframes floating {
	0% {transform: translateY(0px)}
	50% {transform: translateY(10px)}
	100% {transform: translateY(0px)}
}
.downarrow-box {
	position: absolute;left:0;right:0;bottom:0;width:45px;height:45px;margin:auto;opacity:0;
	transition: opacity 0.5s;
}
.section {
	position: relative;
	overflow: hidden;
}

.scroll-card {position: absolute;left:50%;top: 110px;display:block;width:170px;height:170px;background: url(https://og.kakaobank.io/view/9f771c74-6feb-41e9-87b7-537e54665fa0);background-size: 170px 170px;margin-left: -170px;transition: transform 0.1s}
/* .scroll-money {position: absolute;left:50%;top: 250px;display:block;width:118px;height:144px;background: url(https://og.kakaobank.io/view/4ec42173-4615-44ca-9ea2-67595b30b8e6);background-size: 118px 144px;margin-left: 50px;transition: transform 0.1s} */
.scroll-bankroll {position: absolute;left:50%;top:0;display:block;width:180px;height:180px;background: url(https://og.kakaobank.io/view/6bde5c0e-29d1-4e82-bc69-a91fbc56b9da);background-size: 180px 180px;margin-left: 0px;transition: transform 0.1s}

.bottom-wrapper {
	position: fixed;
	opacity: 0;
	left: 0;
	right: 0;
	bottom: -60px;
	margin: auto;
	width: 100%;
	text-align: center;
	transition: opacity 0.3s, bottom 0.3s;
}
.bottom-wrapper.is-active {
	transition: opacity 0.5s, bottom 0.5s;
	opacity: 1;
	bottom: 40px;
}
.btn-bottom {
	display: block;
	max-width: 315px;
	width: 100%;
	margin: auto;
	height: 70px;
	background: url(https://og.kakaobank.io/view/9474aa61-a08a-462a-99a6-e471efd0f760);
	background-size: 100% 100%;
	border-radius: 20px;
	position: relative;
	line-height: 70px;
	font-size: 20px;
	font-weight: bold;
	color:#fff;
	text-align: center;
}
.btn-bottom:after {
	content: "";
	vertical-align: middle;
	display: inline-block;
	width: 10px;
	height: 16px;
	background: url(https://og.kakaobank.io/view/9672037f-9b88-49a4-86ee-34b5d610c1ce);
	margin-left: 6px;
}
.btn-bottom.is-active {display: block;}

.btn-bottom.btn-bottom--notyet {
	background-image: none;
	background-color: #bbb;
}
.btn-bottom.btn-bottom--notyet:after {
	content: none;
	display: none;
}

.section--reward {padding-bottom: 60px}
.reward-title {display: inline-block;min-width:103px;margin-bottom:32px;padding:10px;background-color: rgba(255,255,255,0.2);border-radius: 30px;font-size: 16px;font-weight: bold;line-height:19px;text-align: center;box-sizing: border-box;}
.reward-winner {text-align: left;}
.right {float:right}
.reward-hr {margin: 0 auto 50px;border-top:1px solid #404040;}
.section--info {background:#222;}
.btn-share {display: block; margin: 60px auto 0px;width:284px;height:75px;background:url(https://og.kakaobank.io/view/384ea8d7-01e4-4fba-a558-23f20b2efd32);background-size: 284px 75px;font-size:0;color:transparent;}


/* popup */
.popup {position: fixed;width: 100%;height: 100%;left: 0; top: 0;background: rgba(0,0,0,0.5);z-index: 10;display: none;}
.popup.is-active {display: block;}
.popup-layer {position: absolute;left: 0;right: 0;top: 50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);margin: auto;width: 305px;padding: 40px 14px 14px;margin:auto;background: #fff;border-radius: 20px;}
.popup-btn {display:block;text-align: center;margin-top: 35px;background:#111;border-radius: 10px;font-weight:bold;color:#fff;font-size:20px;line-height: 60px;width: 100%;}
.popup-txt-required {width: 223px;height: 78px;margin:auto;background: url(https://og.kakaobank.io/view/def62c3e-c651-4d87-a5c1-a99747f0045c);background-size: 223px 78px;}
.popup-txt-done {width: 219px;height: 107px;margin:auto;background: url(https://og.kakaobank.io/view/f62e194e-139d-476a-8923-3d8629d844a7);background-size: 219px 107px;}
.popup-txt-end {width: 156px;height: 24px;margin:auto;background: url(https://og.kakaobank.io/view/972bbd69-5cba-4a8e-8eb6-174708a1ff57);background-size: 156px 24px;}
.popup-txt-app {width: 139px;height: 51px;margin:auto;background: url(https://og.kakaobank.io/view/a6f80dc1-3b9a-4bd1-8ee7-a7da1b864596);background-size: 139px 51px;}
.popup-txt-already {width: 219px;height: 107px;margin:auto;background: url(https://og.kakaobank.io/view/6c7fc84f-1f79-426a-980f-369fa5aeab0f);background-size: 219px 107px;}
.ir {font-size:0;color:transparent;}

.popups {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9;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: 304px;padding: 0 20px;margin: 0 auto;}
.popups .title img,.popups .content img,.popups .btns img {max-width: 276px;}
.popups.full .pop-content {width: 100%;max-width: none;padding: 0;margin: 0;}
.popups .pop-content-inner {background-color: #fff;font-size: 0;border-radius: 16px;padding: 40px 14px 14px;}
.popups .title {position: relative;display: block;text-align: center;font-size: 20px;line-height: 30px;font-weight: bold;}
.popups .title svg {width: 100%;height: 100%;}
.popups .btns {margin-top: 35px;}
.popups img {width: 100%;}
.list .popups img {width: 100% !important;}
.popups .ok-btn {display: block;width: 100%;background-color: #ffe400;text-align: center;font-size: 20px;line-height: 24px;padding: 18px 0 17px;border-radius: 10px;font-weight: 700;}
.popups .ok-btn svg{vertical-align: top;}
.popup-share {bottom: 0;padding: 0;}
.popup-share .pop-content {position: absolute;left: 0;bottom: -351px;transition:bottom 0.3s;}
.popup-share .bg {opacity: 0;transition:opacity 0.3s;}
.popup-share.show .pop-content {bottom: -50px;}
.popup-share.show .bg {opacity: 1;}
.popup-share.popups .pop-content-inner {max-width: 375px;margin: 0 auto;padding: 10px 18px 81px 17px;border-radius: 30px 30px 0 0;}
.popup-share .btn-close {position: relative;width: 35px;height: 5px;border-radius: 20px;text-indent: -9999px;background: #EAECEF;}
.popup-share .pop-share-btn-list {margin-top: 35px;}
.popup-share .pop-share-btn-list button {display: inline-flex;align-items: center;justify-content: center;width: 100%;height: 60px;border-radius: 15px;background: #F1F1F1;}
.popup-share li + li {margin-top: 10px;}
.popup-share .pop-share-btn-icon {margin-right: 7px;width: 22px;height: 26px;}
.popup-share .share-btns button:after {content: none;}
.popup-share .pop-share-btn-list .kakaotalk {background: #FAE200;}
.popup-share .pop-share-btn-list .facebook {background: #1877F2;}

.popup-youtube {display: none; position:fixed;top:0;right:0;bottom:0;left:0;box-sizing:border-box;padding:20px 0;background:rgba(0, 0, 0, 1);z-index:1;}
.popup-youtube.on {display: block;}
.popup-youtube .modal-table {display:table;width:100%;height:100%;table-layout:fixed;}
.popup-youtube .modal-cell {display:table-cell;width:100%;height:100%;vertical-align:middle;text-align:center;}
.popup-youtube .iframe-wrap{display:inline-block;width:100%;height:80%;}
.popup-youtube .modal-open{display:block;z-index:1000;}
.popup-youtube .btn-close-modal{position:fixed;top:22px;right:16px;color:transparent;font-size:0;width:36px;height:36px; background:url(https://og.kakaobank.io/view/71e844ad-afb1-4b33-a78e-14370f8a1573) 4px 4px no-repeat;background-size:28px 28px;}

#preventDbClik {position: absolute;width: 100%;height:100%;z-index:1;display: none;}

.evt-img--01 {display: block; width: 120px;height: 70px;background: url(https://og.kakaobank.io/view/004eeea5-ba97-43f2-8209-e2db95fe43bf);background-size: 120px 70px;position: absolute;left: 32px;top: 23px;}
.evt-img--02 {display: block;width: 263px;height: 210px;background: url(https://og.kakaobank.io/view/8e1549bf-fb57-46d2-8e90-e0e04090bd76);background-size: 263px 210px;position: absolute;left: 31px;top: -6px;filter: drop-shadow(11px 16px 9px black);}
.evt-img--03 {display: block;width: 170px;height: 90px;background: url(https://og.kakaobank.io/view/0586077f-d3cb-4ab7-81c8-792564c397c9);background-size:170px 90px;position: absolute;left: 0px;top: 223px;}
.evt-img--04 {display: block;width: 150px;height: 130px;background: url(https://og.kakaobank.io/view/2e348b27-76c1-40ca-b424-b555372cdcd0);background-size: 150px 130px;position: absolute;left: 146px;top: 140px;}

[data-scroll-trigger] {opacity: 0;-webkit-transform: translateY(10px); transform: translateY(10px);-webkit-transition: opacity 0.5s, transform 0.5s;transition: opacity 0.5s, transform 0.5s;}
[data-scroll-trigger].is-active {opacity: 1;-webkit-transform: translateY(0px); transform: translateY(0px);}

.has-grad {display: inline-block;position: relative;}
.has-grad span {position: relative;}
.has-grad:before {content: "";display: block;width: 100%;height: 21px;position: absolute;
	bottom:0;

background: #12d4c9; /* Old browsers */
background: -moz-linear-gradient(left,  #90D300 0%, #16FFC7 40%, #1A1DFF 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #90D300 0%,#16FFC7 40%,#1A1DFF 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #90D300 0%,#16FFC7 40%,#1A1DFF 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#90D300', endColorstr='#1A1DFF',GradientType=1 ); /* IE6-9 */
}
.img-chk {display:block;width: 27px;height: 27px;margin:0px auto 12px;background: url(https://og.kakaobank.io/view/9ab5e407-9f29-4c3b-b098-5b9f3cd579e6);background-size: 27px 27px;}