@charset "UTF-8";

@font-face {
	font-family:'Pretendard';
	font-style:normal;
	font-weight:300;
	src:local(Pretendard-Light);
	src:url(../font/Pretendard-Light.eot);
	src:url(../font/Pretendard-Light.eot?#iefix) format('embedded-opentype'),
	url(../font/Pretendard-Light.woff) format('woff'),
	url(../font/Pretendard-Light.otf) format('opentype');
}

@font-face {
	font-family:'Pretendard';
	font-style:normal;
	font-weight:400;
	src:local(Pretendard-Regular);
	src:url(../font/Pretendard-Regular.eot);
	src:url(../font/Pretendard-Regular.eot?#iefix) format('embedded-opentype'),
	url(../font/Pretendard-Regular.woff) format('woff'),
	url(../font/Pretendard-Regular.otf) format('opentype');
}

@font-face {
	font-family:'Pretendard';
	font-style:normal;
	font-weight:500;
	src:local(Pretendard-Medium);
	src:url(../font/Pretendard-Medium.eot);
	src:url(../font/Pretendard-Medium.eot?#iefix) format('embedded-opentype'),
	url(../font/Pretendard-Medium.woff) format('woff'),
	url(../font/Pretendard-Medium.otf) format('opentype');
}

@font-face {
	font-family:'Pretendard';
	font-style:normal;
	font-weight:600;
	src:local(Pretendard-SemiBold);
	src:url(../font/Pretendard-SemiBold.eot);
	src:url(../font/Pretendard-SemiBold.eot?#iefix) format('embedded-opentype'),
	url(../font/Pretendard-SemiBold.woff) format('woff'),
	url(../font/Pretendard-SemiBold.otf) format('opentype');
}

/* reset */
:root{
	--white:#ffffff;
	--black:#000000;
	--t_yellow:#f2aa00;
	--t_black:#212121;
	--t_white:#fdfdfd;
	--t_light:#c5c5c5;
	--t_dark:#4c4c4c;
	--mw:1240px;
}
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}
input::-ms-clear{display:none}
button{border:0 none;background-color:transparent;cursor:pointer}
html,body{background-color:#000}
body,th,td,input,select,textarea,button{font-size:14px;line-height:1.5;font-family:'Pretendard','맑은 고딕',sans-serif;color:#fff}
a{color:#333;text-decoration:none}
a:active,a:hover{text-decoration:none}
a:active{background-color:transparent}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:350}
img{vertical-align:top}

/* global */
.ir_pm{display:block;overflow:hidden;font-size:0;line-height:0;text-indent:-9999px}
.screen_out{overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px}
.hide{display:none}

/* comm */
.txt_comm,
.list_util [class^="link_"] .txt_util,
.list_gnb .link_gnb,
.ico_scroll{background-position:0 0;background-repeat:no-repeat;font-size:0;line-height:0;text-indent:-9999px}
.list_comm,
.list_util,
.list_reward,
.list_step,
.list_mission{font-size:0}
.list_comm li,
.list_util li,
.list_reward li,
.list_step li,
.list_mission li{display:inline-block;vertical-align:top}

/* header */
.promotion-header{overflow:hidden;position:fixed;top:0;left:0;z-index:1000;width:100%;height:75px;padding:0 40px;background-color:rgba(7,7,7,1);box-sizing:border-box}
.promotion-title{float:left;margin-top:18px}
.promotion-title .link_logo{display:block;font-size:0}
.list_util{float:right;margin-top:16px}
.list_util li + li{position:relative}
.list_util [class^="link_"]{cursor:pointer;display:block;padding:14px 14px 13px 13px}
.list_util .txt_util{display:inline-block;vertical-align:top;background-repeat:no-repeat;background-position:center}
.list_util .link_home .txt_util{width:17px;height:17px;background-image:url(../img/ic_home.png)}
.list_util .link_home:hover .txt_util{background-image:url(../img/ic_home_o.png)}
.list_util .link_copy .txt_util{width:17px;height:17px;background-image:url(../img/ic_link.png)}
.list_util .link_copy:hover .txt_util{background-image:url(../img/ic_link_o.png)}
.list_util .tbox{position:absolute;font-size:1px;line-height:1px;width:1px;height:1px;border:0 none;opacity:0;left:-1px;}
.list_util .link_today .txt_util{height:17px;width:106px;background-image:url(../img/txt-nottoday.png)}
.list_util .link_today:hover .txt_util{background-image:url(../img/txt-nottoday-o.png)}

/* gnb */
.doc-gnb{position:fixed;top:50%;right:40px;z-index:1000;width:174px;transform:translate(0,-50%)}
.list_gnb li{width:174px}
.list_gnb li + li{padding-top:3px}
.list_gnb .link_gnb{display:block;font-family:'맑은 고딕';font-size:14px;line-height:19px;padding:18px 0 17px;letter-spacing:-.02em;text-align:center;color:#c2c2c2;background:url(../img/nav_bg.png) no-repeat 0 0;text-indent:0}
.list_gnb .link_gnb.on,
.list_gnb .link_gnb:hover{color:#f76863}


/* footer */
.promotion-footer{background:#000;position:relative;z-index:5}
.inner_foot{margin:0 auto;width:840px;display:table;height:135px}
.inner_foot .logo_info{display:table-cell;width:50%;vertical-align:middle;text-align:center}
.inner_foot .logo_info a{display:inline-block;vertical-align:top;padding:0 20px}
.inner_foot .info_service{display:table-cell;width:50%;vertical-align:middle;text-align:left}
.inner_foot .list_service li{display:inline-block;padding:2px 13px 2px 0;position:relative}
.inner_foot .list_service li + li{padding-left:13px}
.inner_foot .list_service li + li:before{position:absolute;top:50%;margin-top:-6px;left:-1px;width:1px;height:12px;background:#959595;content:''}
.inner_foot .list_service .link_info{font-family:'맑은 고딕';font-size:14px;line-height:20px;color:var(--t_white);text-decoration:none;letter-spacing:0;text-align:center}
.inner_foot .list_service .link_info strong{color:var(--t_yellow);font-weight:bold;}
.inner_foot .info_company{padding-top:10px;font-size:12px;line-height:20px;color:#7e7e7e}
.inner_foot .info_company .link_txt {color:inherit}
.inner_foot .info_copy{display:block;font-size:12px;line-height:20px;color:var(--t_white)}
.inner_foot .info_copy .link_txt{color:inherit;text-decoration:none}

.inner_foot .logo_kakao .img_comm{width:145px;height:26px;margin-top:32px;background-position:0 -40px}
.inner_foot .logo_company .img_comm{width:93px;height:78px;background-position:0 -70px}
.inner_foot .logo_company .img_logo{vertical-align:top}
.inner_foot .service_info{float:left;font-size:13px;letter-spacing:-1px;color:#c9c9c9}
.service_info a{font-weight:bold;font-size:13px;color:#c9c9c9}
.service_info .txt_bar{margin:0 6px}
.inner_foot .kakao_info{margin-top:4px}
.inner_foot .kakao_info,.copyright,.copyright a{font-size:12px;line-height:18px;letter-spacing:0;color:#8a8a8a}
.copyright{float:left;text-indent:0;vertical-align:baseline}
.inner_foot .grade_info{position:absolute;top:-145px;right:-50px;padding:19px 34px 37px;border:1px solid #373737;background-color:#1e1e1e}
.inner_foot .grade_info .box_grade{overflow:hidden;padding-top:20px}
.inner_foot .grade_info .list_grade{float:left;width:122px;height:71px;margin-right:6px;background-position:-460px 0}
.inner_foot .grade_info .list_info{float:right;width:460px;height:70px;background-position:-135px -80px}
.inner_foot .grade_info .grade_15 .list_grade{background-position:0 -345px}
.inner_foot .grade_info .grade_15 .list_info{background-position:-128px -345px}
.inner_foot .grade_info .ico_tail{position:absolute;bottom:-15px;left:50%;margin-left:-14px;width:27px;height:15px;background-position:-430px -30px}
.layer_grade{display:none;position:absolute;left:50%;bottom:131px;margin-left:-329px;padding:39px 34px 38px;border:1px solid #373737;background-color:#1e1e1e}
.layer_grade.visible{display:block}
.layer_grade .info_grade{width:588px;height:161px;background:url(../img/grade_guide.png) no-repeat 0 0}
.layer_grade .btn_close{position:absolute;top:0;right:0;padding:10px}
.layer_grade .btn_close .img_comm2{font-size:0;display:block;position:relative;width:17px;height:17px}
.layer_grade .btn_close .img_comm2:before,
.layer_grade .btn_close .img_comm2:after{width:24px;height:1px;background:#fff;content:"";display:block;position:absolute;left:50%;top:50%;transform-origin:0 0}
.layer_grade .btn_close .img_comm2:before{
	-webkit-transform:rotate(45deg) translate(-50%,-50%);
	-moz-transform:rotate(45deg) translate(-50%,-50%);
	-ms-transform:rotate(45deg) translate(-50%,-50%);
	transform:rotate(45deg) translate(-50%,-50%)
}
.layer_grade .btn_close .img_comm2:after{
	-webkit-transform:rotate(-45deg) translate(-50%,-50%);
	-moz-transform:rotate(-45deg) translate(-50%,-50%);
	-ms-transform:rotate(-45deg) translate(-50%,-50%);
	transform:rotate(-45deg) translate(-50%,-50%)
}


/* ui */
.ico_scroll{display:inline-block;position:relative;width:20px;height:35px;margin:96px 0 0;border:2px solid #b4b4b4;border-radius:12px;vertical-align:top}
.ico_scroll_wheel{position:absolute;top:7px;left:9px;width:2px;height:7px;background:#b4b4b4;border-radius:2px;animation:ani_move_arr 1.3s cubic-bezier(0.28,0.38,0.68,0.75) infinite}


/* layout */
.container-promotion{overflow:hidden;position:relative;min-width:var(--mw);margin:0 auto}
[class^="section_"]{position:relative;background-position:50% 0;background-repeat:no-repeat;background-size:cover;max-width:2560px;margin:0 auto}
[class^="section_"] .bg{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
[class^="section_"] .inner_wrap{display:block;position:relative;box-sizing:border-box;flex:none;height:auto;margin:0 auto;z-index:1}

.inner_wrap .section_title{display:block;text-align:center}
.inner_wrap .dc{display:block;letter-spacing:-.05em;font-weight:300}
.inner_wrap .event_time{display:block;letter-spacing:-.05em;font-weight:200;font-size:21px;line-height:30px;text-align:center;width:535px;padding:10px 0;background-repeat:no-repeat;background-position:center}
.bg-obj{position:absolute;display:block;pointer-events:none;background-repeat:no-repeat;background-size:contain;transition:opacity .15s ease, transform .35s cubic-bezier(0,0,0,0.99);opacity:0}
.activated .bg .bg-obj{transition-delay:.25s;transform:translate(0,0);opacity:1}


.item_list{display:block;white-space:nowrap;text-align:center}
.item_list > li{display:inline-block;vertical-align:top;width:255px;height:280px;margin:0 0 20px;background-repeat:no-repeat;background-position:center top}
.item_list > li + li{margin-left:20px}
.item_list .detail{font-size:20px;line-height:30px;letter-spacing:-.05em}


.notification{text-align:left}
.notification .tit_notice{display:block;padding:0 0 18px}
.notification > p{display:block;font-weight:200;font-size:15px;line-height:25px;letter-spacing:-.025em;padding-left:13px;position:relative}
.notification > p:before{content:"";display:block;position:absolute;top:0;height:25px;left:0;width:4px;background:url(../img/notice_dot.png) no-repeat left center}


/* intro */
.section_intro{overflow:hidden;position:relative;height:100vh;display:flex;flex-direction:column;max-height:1080px;min-height:960px;background-image:url(../img/intro_bg.jpg)}
.section_intro:before,
.section_intro:after{content:"";display:block;flex:1}
.section_intro .inner_wrap{display:block;flex:none;width:1060px;min-height:496px;position:relative}
.section_intro .inner_wrap img{display:inline-block;width:auto}
.section_intro .key-visual{position:absolute;right:-150px;top:-105px}
.section_intro .dc{color:var(--t_white);font-size:22px;line-height:30px;text-align:left;padding:25px 0 40px}
.section_intro .event_time{color:var(--t_white);background-image:url(../img/event_time_wht.png)}
.section_intro .ico_scroll{position:absolute;left:50%;margin-left:-12px;top:100%;margin-top:96px}


.type-a .section_intro{margin-bottom:-230px}
.type-b .section_intro{margin-bottom:-198px}


/* login */
.section_login{z-index:2;height:2118px}
.type-a .section_login{background-image:url(../img/login_a_bg.png)}
.type-b .section_login{background-image:url(../img/login_b_bg.png)}
.section_login .inner_wrap{display:block;width:1082px;position:relative;padding-top:155px;text-align:center}

.section_login .section_title{padding:140px 0 22px}
.section_login .event_time{margin:0 auto;color:var(--t_black);background-image:url(../img/event_time_blk.png);margin-bottom:8px}

.section_login .notification{padding:55px 0;color:var(--t_black)}
.section_login .list-name{padding-top:38px;padding-bottom:24px}
.section_login .item_list .preview{padding-top:20px}
.section_login .item_list .detail{padding:5px 0}
.cumulative .item_list > li{background-image:url(../img/login_cumulative_reward_box.jpg);color:var(--t_black);font-weight:600}
.cumulative .item_list{position:relative}
.cumulative .item_list:before{content:"";display:block;position:absolute;pointer-events:none;right:-95px;top:-81px;width:175px;height:162px;background:url(../img/login_tape_top.png) no-repeat right top}
.cumulative .item_list + .item_list:before{right:auto;top:auto;left:15px;bottom:-31px;width:217px;height:112px;background:url(../img/login_tape_bottom.png) no-repeat left bottom}
.continuous .item_list > li{background-image:url(../img/login_continuous_reward_box.jpg);color:var(--t_white);font-weight:500}

.type-a .section_login{margin-bottom:-290px}
.type-b .section_login{margin-bottom:-244px}

/* point */
.section_point{z-index:2;background-image:url(../img/point_bg.png);height:1994px}
.section_point .inner_wrap{display:block;width:1080px;position:relative;padding-top:155px;text-align:center}

.section_point .section_title{padding:133px 0 22px}
.section_point .event_time{margin:0 auto;color:var(--t_black);background-image:url(../img/event_time_blk.png);margin-bottom:8px}
.section_point .dc{color:var(--t_black);font-weight:600;font-size:20px;line-height:23px;letter-spacing:-.05em;padding:32px 0 38px}
.section_point .dc strong{position:relative;display:inline-block;padding-right:2px;margin-right:-2px}
.section_point .dc strong:before{content:"";display:block;z-index:-1;position:absolute;left:0;width:0;top:0;height:23px;background:var(--t_yellow);transition:width .25s .4s cubic-bezier(0.175,0.885,0.32,1)}
.section_point.activated .dc strong:before{width:100%}

.mission .item_list > li{background-image:url(../img/point_mission_box.jpg);color:var(--t_white);font-weight:500}
.mission .item_list .goal{padding:16px 50px}
.mission .item_list .preview{padding:14px 50px 0}

.goods{padding-top:44px}
.goods .list-name{padding-bottom:25px}
.goods .item_list > li{background-image:url(../img/point_goods_box.jpg);color:var(--t_white)}
.goods .item_list .preview{padding:18px 40px 10px}
.goods .item_list .detail{font-size:20px;letter-spacing:-.05em;line-height:26px;font-weight:500}
.goods .item_list .detail > strong{font-weight:inherit;color:var(--t_yellow);display:block;text-align:center}
.section_point .notification{padding:62px 0;color:var(--t_black)}

.type-a .section_point{margin-bottom:-218px}
.type-b .section_point{margin-bottom:-218px}

/* mission */
.section_mission{z-index:2;height:1914px}
.type-a .section_mission{background-image:url(../img/mission_a_bg.png)}
.type-b .section_mission{background-image:url(../img/mission_b_bg.png)}
.section_mission .inner_wrap{display:block;width:1080px;position:relative;padding-top:155px;text-align:center}

.section_mission .section_title{padding:155px 0 0}
.mission_event{padding-top:75px}
.mission_event.event_2{padding-top:85px}
.mission_event > .event_title{display:block;padding-bottom:20px}

.section_mission .event_time{color:var(--t_white);margin:0 auto;background-image:url(../img/event_time_wht.png)}
.section_mission .event_2 .event_time{position:relative;padding:11px 0;line-height:27px;background:none}
.section_mission .event_2 .event_time:before,
.section_mission .event_2 .event_time:after{content:"";display:block;position:absolute;left:0;width:100%;height:5px;background-repeat:no-repeat;background-image:url(../img/event_time_wht.png)}
.section_mission .event_2 .event_time:before{background-position:center top;top:0}
.section_mission .event_2 .event_time:after{background-position:center bottom;bottom:0}

.section_mission .dc{color:var(--white);font-size:20px;line-height:30px;font-weight:200;letter-spacing:-.05em;padding:30px 0 40px}
.section_mission .item_list .detail{font-size:20px;letter-spacing:-.05em;line-height:26px;font-weight:500}
.section_mission .item_list .goal{padding:15px 0}

.event_1 .item_list > li{background-image:url(../img/mission_event1_reward_box.jpg);color:var(--t_black)}
.event_1 .item_list .preview{padding:15px 45px 0}

.event_2 .item_list > li{width:530px;background-image:url(../img/mission_event2_reward_box.jpg);color:var(--t_black)}
.event_2 .item_list .preview{padding:15px 165px 0}

.section_mission .notification{text-align:center;padding-top:16px;color:var(--t_light)}
.section_mission .notification > p{display:inline-block}
.section_mission .notification > p:before{background-image:url(../img/notice_dot_wht.png)}


.type-a .section_mission{margin-bottom:-242px}
.type-b .section_mission{margin-bottom:-292px}


/* blackpink */
.section_blackpink{z-index:1;height:1450px;background-image:url(../img/blackpink_bg.jpg)}
.section_blackpink:before{content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:url(../img/blackpink_vinetting.png) no-repeat center;pointer-events:none;mix-blend-mode:multiply}
.section_blackpink .section_title{padding-top:104px}
.section_blackpink .section_title > span{display:block;text-align:center}
.section_blackpink .section_title .logo{margin-bottom:-48px}
.section_blackpink .section_title .dday{margin-bottom:-48px}
.section_blackpink .outfits{height:913px;width:384px;margin:0 auto;position:relative;opacity:0;transition:opacity .55s, width .65s cubic-bezier(0,0,0,0.99);top:-13px}
.section_blackpink .outfits > div{position:absolute;transform-origin:0;bottom:0;transform:translateX(-50%)}
.section_blackpink .outfits .jenny{left:0}
.section_blackpink .outfits .lisa{left:31.73%}
.section_blackpink .outfits .jisoo{left:66.7%}
.section_blackpink .outfits .rose{left:100%}
.section_blackpink.activated .outfits{width:750px;opacity:1;transition-delay:.35s}

.section_blackpink{margin-bottom:-190px}

/* notice */
.section_notice{z-index:2;height:380px;background-image:url(../img/notice_bg.png)}
.section_notice .inner_wrap{display:block;width:1080px;position:relative;padding-top:212px;text-align:left}
.section_notice .notification{color:var(--t_dark)}
.section_notice a{color:inherit}



/* obj_move */
[class*="obj_move"]{opacity:0}
.obj_move_tb{
	-webkit-transform:translate(0,-65px);
	-moz-transform:translate(0,-65px);
	-ms-transform:translate(0,-65px);
	transform:translate(0,-65px);
	-webkit-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99)
}
.obj_move_bt{
	-webkit-transform:translate(0,65px);
	-moz-transform:translate(0,65px);
	-ms-transform:translate(0,65px);
	transform:translate(0,65px);
	-webkit-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99)
}
.obj_move_rl{
	-webkit-transform:translate(1000px,-12px);
	-moz-transform:translate(1000px,-12px);
	-ms-transform:translate(1000px,-12px);
	transform:translate(1000px,-12px);
	-webkit-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99)
}
.obj_move_lr{
	-webkit-transform:translate(1000px,12px);
	-moz-transform:translate(1000px,12px);
	-ms-transform:translate(1000px,12px);
	transform:translate(1000px,12px);
	-webkit-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99);
	transition:opacity .4s ease,transform .6s cubic-bezier(0,0,0,0.99)
}
.obj_move_zin{
	-webkit-transform:scale(1.08);
	-moz-transform:scale(1.08);
	-ms-transform:scale(1.08);
	transform:scale(1.08);
	-webkit-transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99);
	transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99)
}
.obj_move_zout{
	-webkit-transform:scale(.75);
	-moz-transform:scale(.75);
	-ms-transform:scale(.75);
	transform:scale(.75);
	-webkit-transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99);
	-moz-transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99);
	transition:opacity .3s ease,transform .45s cubic-bezier(0,0,0,0.99)
}

.activated .obj_move_tb,
.activated .obj_move_bt,
.activated .obj_move_lr,
.activated .obj_move_rl{opacity:1;
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	transform:translate(0,0)
}
.activated .obj_move_zout,
.activated .obj_move_zin{opacity:1;
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	transform:scale(1)
}
.activated .delay100{-moz-transition-delay:.1s;transition-delay:.1s}
.activated .delay200{-moz-transition-delay:.2s;transition-delay:.2s}
.activated .delay300{-moz-transition-delay:.3s;transition-delay:.3s}
.activated .delay400{-moz-transition-delay:.4s;transition-delay:.4s}
.activated .delay500{-moz-transition-delay:.5s;transition-delay:.5s}
.activated .delay600{-moz-transition-delay:.6s;transition-delay:.6s}
.activated .delay700{-moz-transition-delay:.7s;transition-delay:.7s}
.activated .delay800{-moz-transition-delay:.8s;transition-delay:.8s}
.activated .delay900{-moz-transition-delay:.9s;transition-delay:.9s}
.activated .delay1000{-moz-transition-delay:1s;transition-delay:1s}





/* animation */

/* ani_move_arr */
@keyframes ani_move_arr{
	0%{transform:translateY(-2px)}
	50%{transform:translateY(2px)}
	100%{transform:translateY(-2px)}
}