@charset "euc-kr";

@import url('https://webfontworld.github.io/pretendard/Pretendard.css');
@font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: normal; font-style: normal; }


#wrapper.wide{overflow-x:hidden; width:auto; min-width:1200px; margin:0;}
#wrapper .mid > div{position:relative;}
#wrapper .btn{/* display:inline-block;  */text-indent:-9999px;}
#wrapper .swiper-button-prev,
#wrapper .swiper-button-next{display:block; text-indent:-9999px;}

#wrapper .mid {
	margin-top: -20px;
}
.mid .mask{
	width: 1200px;
	position: relative;
	margin: 0 auto;
	/* overflow: hidden; */
	min-height: 50px;
	text-align:center;
}
.mask .thumb{	
	position: relative;
	left: 50%;
	transform:translateX(-50%);
}

.swiper-button-next:after,
.swiper-button-prev:after{display:none;}

.point{position:absolute; top:60px; left:50%; margin-left:-60px; z-index:10;}

/* visual */
.visual{overflow:hidden;}
.visual .con{position:absolute; top:0; left:50%; width:1200px; transform:translateX(-50%); height:100%;}
.visual .con > img{position:absolute;}
.visual .con .teacher{top:105px; left:50%; margin-left:-707px;}
.visual .con .tit{top:436px; left:calc(50% + 10px); margin-left:-549px;}
.visual .con ul{display:flex; justify-content:center; position:absolute; bottom:33px; left:0; width:100%;}
.visual .con ul li{position:relative; margin:0 -42px;}
.visual .con ul li:before{content:""; display:block; position:absolute; bottom:72px; right:50px; width:55px; height:72px; background:url(img/click_ico.png) 0 0 no-repeat; z-index:10; animation: blinker 1s ease-in infinite alternate;}
.visual .con ul li a{display:block; position:relative;}
.visual .con ul li a p{position:absolute; bottom:114px; animation:bounce 2s ease infinite;}
.visual .con ul li:nth-child(1) a p{left:115px;}
.visual .con ul li:nth-child(2) a p{left:115px;}
.visual .con ul li:nth-child(3) a p{bottom:106px; left:86px;}
.visual .con ul li:nth-child(4) a p{bottom:106px; left:140px;}

/* event_banner */
.event_banner{position:relative;}
.event_banner .tit{position:absolute; top:50px; left:50%; transform:translateX(-50%); width:100%; color:#fff;}
.event_banner .tit > span{font-family:"GmarketSansMedium"; font-size:30px;}
.event_banner .tit p{margin-top:-6px; font-family:"GmarketSansBold"; font-size:56px; color:#fff;}
.event_banner .tit p span{color:#ffee99;}

/* provide */
.provide{padding-bottom:100px; background-color:#f0f4ff;}
.provide .tabArea{display:flex; border-bottom:2px solid #000;}
.provide .tabArea li{flex:1;}
.provide .tabArea li a{display:block; height:68px; font-family:"GmarketSansBold"; font-size:28px; color:#909299; line-height:70px;}
.provide .tabArea li.on a{background-color:#000; color:#fff;}
.provide .tabCont{position:relative;}
.provide .tabCont .moviePos{position:absolute; top:39px; left:0;}
.provide .tabCont .btn{display:flex; justify-content:space-between; align-items:end; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:1200px; height:432px;}
.provide .tabCont .btn > a{display:flex; justify-content:center; width:768px; height:433px; padding-top:93px; font-family:"GmarketSansBold"; font-size:50px; color:#fff; text-indent:0; line-height:70px;}
.provide .tabCont .btn .right{width:420px;}
.provide .tabCont .btn .right > a{display:block; height:65px; text-indent:-9999px;}
.provide .tabCont .btn .right .dwn{display:flex;}
.provide .tabCont .btn .right .dwn a{width:50%; height:90px;}
.provide .tabCont > a{display:block; position:absolute; bottom:164px; left:50%; transform:translateX(-50%); width:786px; height:135px; text-indent:-9999px;}
.provide .tab_round{display:flex; justify-content: center; gap:19px; padding:63px 0;}
.provide .tab_round a{background:#fff; border:4px solid #9999af; border-radius:40px; font-size:36px; color:#9999af; padding:0 48px; height:80px; line-height:80px; font-family: 'GmarketSansBold';}
.provide .tab_round a.on{background:#513bff; border:4px solid #513bff; color:#fff;}

/* free */
.free {
    position: relative;
    background-color:#fff;
}

.free .btn_area_ a {
    display: block;
    margin: 40px auto 50px;
    width: 660px;
    height: 105px;
    background: url(img/benefit_btn.png) 0 0 no-repeat;
    text-indent: -9999em;
}

.free .notice_wrap {
    z-index: 1;
    position: relative;
    padding-bottom: 77px;
}

.free .notice_wrap > .tit {
    display: block;
    height: 70px;
    background-color: #111111;
    border-radius: 40px;
    font-family: "GmarketSansBold";
    font-size: 28px;
    color: #fff;
    line-height: 74px;
}

.free .notice_wrap > .tit span {
    position: relative;
    padding-right: 30px;
}

.free .notice_wrap > .tit span:before {
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    right: 0;
    width: 20px;
    height: 13px;
    background: url(/promotion/common/benefit/experience/img/notice_arr.png) 0 0 no-repeat;
    transition: transform .5s;
}

.free .notice_wrap > .tit.on span:before {
    transform: rotate(180deg);
}

.free .notice_wrap .con {
    display: none;
    padding: 50px;
    background-color: #f6f6f6;
    border-radius: 40px;
    text-align: left;
    letter-spacing: -1px;
}

.free .notice_wrap .con .tit {
    margin-bottom: 10px;
    padding-left: 10px;
    font-weight: 900;
    font-size: 20px;
    color: #333;
}

.free .notice_wrap .con ul + p {
    margin-top: 25px;
}

.free .notice_wrap .con ul li {
    position: relative;
    padding-left: 10px;
    font-weight: 500;
    font-size: 16px;
    color: #777;
}

.free .notice_wrap .con ul li:not(:first-child) {
    margin-top: 4px;
}

/* proof */
.proof{background-image:linear-gradient(to right, #f5f9d3 50%, #d7fcd0 50%);}
.proof .con{padding:100px 0 50px;position:absolute; top:0; left:50%; width:1200px; height:100%; transform:translateX(-50%);}
.proof_con{margin-top:60px;}
.proof .slide_top{margin-top:60px; position:relative;}
#proofSlideTop{width:1090px; }    
#proofSlideTopPrev,
#proofSlideTopNext{background:url(img/proof_arr.png) 0 0 no-repeat; width:31px; height:54px; margin:0; transform:translate(0, -50%); }
#proofSlideTopPrev{left:5px; }
#proofSlideTopNext{transform:translate(0, -50%) scaleX(-1); right:5px; }
.proof .slide_btm{margin-top:60px;}
#proofSlideBtm{overflow:visible; }
#proofSlideBtm .swiper-wrapper{transition-timing-function:linear;}
#proofSlideBtm .swiper-slide{width:330px; margin-left:-19px; }
#proofSlideBtm .swiper-slide img{width:100%; }

/* reward */
.reward{background:#0e0314;}
.reward .con{position:absolute; top:0; left:50%; width:1200px; height:100%; transform:translateX(-50%);}

/* lineup */
.lineup{background-color:#767cff;}
.lineup .slider_wrapper{position:absolute; top:363px; left:50%; width:1200px; transform:translateX(-50%); border:2px solid #000; z-index:10;}
.lineup .slider_wrapper .title ul li{height:80px; background-color:#ddd; line-height:80px; cursor:pointer;}
.lineup .slider_wrapper .title ul li.swiper-slide-thumb-active{background-color:#000;}
.lineup .slider_wrapper .title ul li span{font-family:"GmarketSansBold"; font-size:32px; color:#939393; letter-spacing:-2px;}
.lineup .slider_wrapper .title ul li.swiper-slide-thumb-active span{background:linear-gradient(90deg, rgba(0,241,221,1) 0%, rgba(95,137,238,1) 49%, rgba(190,34,255,1) 100%); color: transparent; -webkit-background-clip: text;}
.lineup .gif{display:flex; gap:102px; position:absolute; top:458px; left:50%; transform:translateX(-50%);}
.lineup .gif div{overflow:hidden; border-radius:7px;}
.lineup .gif div img{width:400px; height:234px;}

/* verification */
.verification{background-color:#191623;}
.verification .rolling{display:flex; position:absolute; left:0; bottom:100px; width:100%;}
.verification .rolling .roller.original{animation:100s linear 0s infinite normal forwards running rollingRight1;}
.verification .rolling .roller.clone{animation:100s linear 0s infinite normal none running rollingRight2;}

/* step_contents */
.step_contents .slider_wrapper{position:absolute; top:445px; left:50%; width:1200px; transform:translateX(-50%);}
.step_contents .slider_wrapper .title{margin-bottom:23px;}
.step_contents .slider_wrapper .title ul{display:flex; flex-wrap:wrap; justify-content:center; gap:60px;}
.step_contents .slider_wrapper .title ul li{display:flex; align-items:center; justify-content:center; width:280px; height:130px; border:2px solid #000; border-radius:70px; cursor:pointer;}
.step_contents .slider_wrapper .title ul li:not(:first-child):before{content:""; display:block; position:absolute; top:50%; left:-51px; width:40px; height:8px; margin-top:-4px; background:url(img/step_dot.png) 0 0 no-repeat;}
.step_contents .slider_wrapper .title ul li.swiper-slide-thumb-active{background-color:#000;}
.step_contents .slider_wrapper .title ul li.swiper-slide-thumb-active:after{content:""; display:block; position:absolute; bottom:-13px; left:128px; width:24px; height:13px; background:url(img/step_arr.png) 0 0 no-repeat;}
.step_contents .slider_wrapper .title ul li.swiper-slide-thumb-active p{color:#fff;}
.step_contents .slider_wrapper .title ul li.swiper-slide-thumb-active p span{background:linear-gradient(90deg, rgba(0,241,221,1) 0%, rgba(95,137,238,1) 49%, rgba(190,34,255,1) 100%); color: transparent; -webkit-background-clip: text;}
.step_contents .slider_wrapper .title ul li p{margin-top:5px; font-size:24px; font-family:"GmarketSansBold"; color:#000; line-height:1.2;}
.step_contents .slider_wrapper .title ul li p span{display:block; margin-top:5px; font-size:38px;}

/* management */
.management{background-color:#f8edff;}
.management .title .swiper-wrapper{display:flex; justify-content:center; flex-wrap:wrap; gap:22px; margin-bottom:26px;}
.management .title .swiper-wrapper li{display:flex; align-items:center; width:auto; width:auto; height:47px; cursor:pointer;}
.management .title .swiper-wrapper li span{display:flex; justify-content:center; width:auto; height:47px; padding:3px 27px; margin:0 !important; background-color:#999; border:1px solid #737373; border-radius:19px; font-family:"GmarketSansMedium"; font-size:26px; color:#e4e4e4; line-height:47px; opacity:1;}
.management .title .swiper-wrapper li.swiper-slide-thumb-active span{background-color:#f20f0f; border:1px solid #f20f0f; font-family:"GmarketSansBold"; color:#fffd7a;}
.management .slider .swiper-slide{opacity:0 !important;}
.management .slider .video{display:flex;  justify-content:space-between; position:absolute; top:34px; left:0; width:100%; padding:0 67px 0 74px;}
.management .slider .swiper-slide-active{opacity:1 !important;}
.management .swiper-pagination{bottom:-61px; width:100%;}
.management .swiper-pagination span{width:22px; height:22px; margin:0 4px; background-color:#6a6a6a; opacity:1;}
.management .swiper-pagination span.swiper-pagination-bullet-active{background-color:#d90101; opacity:1;}
.management .swiper-button-next{top:50%; right:0; left:auto; width:30px; height:49px;}
.management .swiper-button-prev{top:50%; left:0; right:auto; width:30px; height:49px;}
.management .swiper-button-next a{display:block; width:100%; height:100%; background:url(/promotion/event/2023/1221_11780/img/slide_next_arr.png) 0 0 no-repeat;}
.management .swiper-button-prev a{display:block; width:100%; height:100%; background:url(/promotion/event/2023/1221_11780/img/slide_prev_arr.png) 0 0 no-repeat;}

/* experience */
.experience .btn_area{padding-bottom:95px;}
.experience .btn_area a{display:inline-block; width:700px; height:105px; background:url(img/experience_btn.png) 0 0 no-repeat;}

/* ¾ó·µ Æ˾÷ */
.popup{position:relative; width:470px; background-color:#fff; text-align:center;}
.popup *{font-family:"pretendard";}
.popup .inner{padding:20px 24px 34px;}
.popup .inner .txt1{margin-top:10px; font-weight:700; font-size:22px; line-height:27px; color:#2C2C2C;}
.popup .inner .txt2{margin-top:5px; font-size:18px; color:#666;}
.popup .inner .btn_area{display:flex; justify-content:center; gap:10px; margin-top:15px;}
.popup .inner .btn_area button{width:155px; height:56px; background-color:#1154CF; border:none; border-radius:15px; font-weight:600; font-size:25px; color:#fff;}
.popup .inner .close{position:absolute; top:15px; right:15px;}

/* ¿ìÃø ½ºÄ«À̹è³Ê ºñ³ë¿ï
#only1_rnb_sky_banner{display:none;}
#only1_rnb_sky_banner_mid{top:200px !important; right:2.3% !important; margin:0 !important;}
#only1_rnb_sky_banner_mid.onFixdmenu{top:110px !important;}

/* ¾Ö´Ï¸ÞÀÌ¼Ç Å°ÇÁ·¹ÀÓ */
@keyframes blinker {
 50% {
    opacity:0;
  }
}

/* À§¾Æ·¡ ¾Ö´Ï¸ÞÀÌ¼Ç */
@keyframes bounce {
	50%{transform:translateY(5px);}
}

@keyframes rollingRight1 { /* ¿øº»¿ë */
    0% {transform: translateX(0);}
    50% {transform: translateX(-100%);}
    50.01%{transform: translateX(100%);}
    100%{transform: translateX(0);}
}

@keyframes rollingRight2 { /* Ŭ·Ð¿ë */
    0% {transform: translateX(0);}
    100% {transform: translateX(-200%);}
}