@charset "utf-8";

/*------------------------
Common
------------------------*/
img { max-width: 100%}


/*------------------------
Header
------------------------*/
#gnb li { font-weight: 500}
#gnb li.active { font-weight: 700}


/*------------------------
Main
------------------------*/
/* 게임형 이벤트 */
.slide__03 .home_3_contents__p0e1X .img button { border: 0; background: transparent; cursor: pointer}

/* 룰렛 */
.modal_modal__zB_6A .inner { position: relative; display: inline-block}
.modal_modal__zB_6A .inner span { display: block}
.roulette_result__modal__4rXZF {
  display: none;
  justify-content: center;
  align-items: center;
}
/*#roulette-wheel { position: absolute; left: 0; top: 0;}
.roulette_result__modal__4rXZF {
  display: none;
}
#wheel_wrap {
  transition: 2s;
}
.roulette_result__modal__4rXZF {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  bottom: 50%;
  right: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 160px;
  height: 50px;
  font-family: Pretendard;
  font-size: 15px;
  font-weight: 500;
  color: #fff;
  background-color: rgba(0,0,0,.7);
  box-shadow: 0 20px 30px rgba(0,0,0,.2);
  z-index: 999;
  border-radius: 4px;
  -webkit-animation-duration: .25s;
  animation-duration: .25s;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  -webkit-animation-name: roulette_fadeIn__KiFHt;
  animation-name: roulette_fadeIn__KiFHt;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards
}

.roulette_result__modal__4rXZF b {
  font-size: 15px
}

#rouletteStart {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}*/

#roulette .wrap_roulette {
  position: relative;
  margin-top: -6px;
  max-width: 500px;
}
#roulette .wrap_wheel {
  position: relative;
}
#roulette .wheel {
  display: inline-block;
  width: 462px;
  height: 462px;
}
.wheel.case1 {
  animation: case1 ease-in-out 2s forwards;
}
@keyframes case1 {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(1542deg);
  }
}
#roulette .start {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#roulette .hand {
  position: absolute;
  top: 0;
  left: 50%;
  width: 6%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
#roulette .result {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 100%;
  overflow: hidden;
  z-index: 9;
}
#roulette .result.on {
  display: block;
}

@media screen and (max-width: 850px) {
  #roulette .wrap_roulette {
    max-width: 370px;
  }
  #roulette .wheel {
    width: 370px;
    height: 370px;
  }
}

/* 퍼즐 */
.puzzle_container__E6w_p .puzzle_target__ettkk .inner { position: relative; display: inline-block}
.puzzle_container__E6w_p .puzzle_target__ettkk .inner span { display: block}
.puzzle_container__E6w_p .puzzle_target__ettkk .inner .img-target { position: absolute; top: 0; left: 0}
.puzzle_container__E6w_p .puzzle_target__ettkk .school {
    position: relative;
    display: block;
    width: 80px;
    height: 58px;
    background: url('/evt_w_landing/images/puzzle_target.png') center /contain no-repeat;
}
.puzzle_container__E6w_p .puzzle_target__ettkk .school.on {
	background-image: url('/evt_w_landing/images/puzzle_target_on.png');
}
.puzzle_container__E6w_p .puzzle_wrapper__Elnyy.answer { transform: translate(999999px, 999999px) !important;}

 /*복권 기존*/
.ScratchCard__Container { position: relative; width: 240px; height: 180px; user-select: none;}
.lottery_container__lLDZ8 .lottery_lottery__wrapper__MoV5q div canvas { z-index: 1}
.ScratchCard__Result { width: 100%; height: 100%}
.lottery_prize__o0k0y span { display: block}
.lottery_prize__o0k0y span img { position: absolute; top: 0; left: 0}

/*복권 추가*/

#eventGame3 .title {
  padding: 25px;
  margin-bottom: 40px;
}

#eventGame3 .content .scratch .canvas_wrap {
  /*width: 550px !important;
  height: 324px !important;*/
  width: 240px !important;
  height: 184px !important;
  position: absolute;
  left: 50%;
  top: 50%;
  background-image: url('../evt_w_landing/images/popup_result_gift_gs2000.png');
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#eventGame3 .content .scratch .canvas_wrap .canvas {
  position:absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

#eventGame3 .content .scratch .complete_item {
  /*width: 550px;
  height: 150px;*/
  width: 240px;
  height: 180px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-position: center;
  background-repeat: no-repeat;
}

#eventGame3 .content .scratch {
  /*width: 812px;
  height: 590px;*/
  width: 420px;
  height: 320px;
  margin: auto;
  background-image: url('../evt_w_landing/images/lotto_bg_back.png');
  background-position: center;
  position: relative;
  background-size: cover;
}

/*#eventGame3 .content .scratch .complete_item.n0 {
  background-image: url('../evt_w_landing/images/popup_result_gift_gs2000.png');
}

#eventGame3 .content .scratch .complete_item.n1 {background-image:url('../evt_w_landing/images/popup_result_gift_gs2000.png');}
#eventGame3 .content .scratch .complete_item.n2 {background-image:url('../evt_w_landing/images/popup_result_gift_gs2000.png');}*/

/* 가위바위보 */
.handgame_container__y1xe5 .inner { position: relative; display: inline-block}
.handgame_container__y1xe5 .inner span { display: block}
.handgame_container__y1xe5 .inner .img-target { position: absolute; top: 0; left: 0}
.hand_res {
  position: absolute;
  top: 90px;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, .8);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 11vw;
  height: 6vh;
  border-radius: 5px;
  opacity: 0;
  transition: .3s;
}
@media screen and (max-width: 1200px) {
  .hand_res {
    width: 60vw;
    height: 7vh;
    top: 30px;
  }
}
.hand_res p {
  color: #fff;
  font-family: Poppins;
  font-size: 22px;
  font-weight: 700;
}
/* 사다리 */
.ladder_container__s1rks .ladder_inner__pZj95 .ladder_selector__Hedmd .ladder_wrapper__I3JAs { font-size: 10px}
.ladder_wrapper__I3JAs .inner { position: relative; display: inline-block}
.ladder_wrapper__I3JAs .inner span { display: block}
.ladder_wrapper__I3JAs .inner span + img { position: absolute; top: 0; left: 0}

/* 주사위 */
._space3d {
  perspective: 1000px;
  text-align: center;
  display: inline-block;
  padding: unset;
  border: unset;
  background-color: transparent;
  outline: unset;
  box-shadow: unset;
}
._space3d ._3dbox {
  display: inline-block;
  transition: all 0.85s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  text-align: center;
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transform: rotateX(-90deg) rotateY(0deg) rotateZ(0deg);
}
._space3d ._3dface {
  overflow: hidden;
  position: absolute;
  opacity: 1;
  background-size: auto 100%;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
._space3d .defaultFace {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-radius: 12px;
  box-shadow: inset 0 0 6px #000000;
  background-color: #fff;
}
._space3d .defaultFace div {
  display: flex;
  align-items: center;
  justify-content: center;
}
._space3d .defaultFace span {
  width: 60%;
  height: 60%;
  box-shadow: 0 0 6px #000000;
  border-radius: 50%;
  background-color: #000;
}
._space3d.one ._3dbox {
  transform: rotateX(90deg) rotateY(0deg) rotateZ(0deg);
}
._space3d.two ._3dbox {
  transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
}
._space3d.three ._3dbox {
  transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
}
._space3d.four ._3dbox {
  transform: rotateX(-90deg) rotateY(90deg) rotateZ(90deg);
}
._space3d.five ._3dbox {
  transform: rotateX(90deg) rotateY(-90deg) rotateZ(90deg);
}
._space3d.rolling ._3dbox {
  transform-style: preserve-3d;
  animation: spin 2s infinite linear;
}

@keyframes spin {
  0% {
    transform: translateZ(-100px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
  }
  16% {
    transform: translateZ(-100px) rotateX(180deg) rotateY(180deg) rotateZ(0deg);
  }
  33% {
    transform: translateZ(-100px) rotateX(360deg) rotateY(90deg) rotateZ(180deg);
  }
  50% {
    transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
  66% {
    transform: translateZ(-100px) rotateX(180deg) rotateY(360deg) rotateZ(270deg);
  }
  83% {
    transform: translateZ(-100px) rotateX(270deg) rotateY(180deg) rotateZ(180deg);
  }
  100% {
    transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}
/* 빈 칸 게임 */

.blank_game_res {
  position: absolute;
  top: 145px;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, .8);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16vw;
  height: 6vh;
  border-radius: 5px;
  opacity: 0;
  transition: .3s;
}
@media screen and (max-width: 1200px) {
  .blank_game_res {
    width: 55vw;
    height: 8vh;
    top: 135px;
  }
}
.blank_game_res p {
  color: #fff;
  font-family: Poppins;
  font-size: 22px;
  font-weight: 700;
}

/* 랜딩페이지 제작안내 */
.guide_row__5ya1g .guide_row__item__aGW4y .guide_type__basic__5kKSg .guide_type__content__3mO1l strong { background: #0086ff}
.guide_row__5ya1g .guide_row__item__aGW4y .guide_type__premium__ueIUs .guide_type__content__3mO1l strong { background: #00d369}
.guide_row__5ya1g .guide_row__item__aGW4y .guide_type__wlVoH .guide_type__content__3mO1l strong { display: flex; align-items: center; width: 45%; height: 100%; padding-left: 40px; color: #fff; font-size: 1.6rem; font-family: Pretendard; border-left: 1px solid #b4b4b4; border-bottom: 1px solid #b4b4b4}

@media (max-width: 1280px){
	.guide_row__5ya1g .guide_row__item__aGW4y .guide_type__wlVoH .guide_type__content__3mO1l li strong,
	.guide_row__5ya1g .guide_row__item__aGW4y .guide_type__wlVoH .guide_type__content__3mO1l li span { font-size: 1.4rem; padding: 10px}
}

/* 1:1 */
.contact_slide__inner__ek9ww .contact_row__eXlLh .contact_term__text__UJQk_ span a { font-size: 1.4rem}

.contact_slide__inner__ek9ww .contact_row__eXlLh .contact_content__nLpzs .contact_input__form__pV3rZ li span.tit { display: flex; align-items: center; justify-content: center; width: 100px; height: 54px; font-family: Pretendard; font-size: 1.6rem; font-weight: 700}
.contact_slide__inner__ek9ww .contact_row__eXlLh .contact_content__nLpzs .contact_input__form__pV3rZ li .btn-file { height: 100%; background: #ffca3a; border-left: 2px solid #000; cursor: pointer; margin-left: auto}


/*------------------------
bPopup
------------------------*/
.modal-box { display: none; width: 90vw; max-width: 1160px; max-height: 70%; font-size: 18px; color: #000; font-family: 'Pretendard'; line-height: 1.4; font-weight: 400; background:#fff; border-radius: 4px}
.modal-box * { font-size: 18px}

.modal-close { position: absolute; right: 20px; top: 20px}
.modal-close .b-close { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: url(../img/content/delete-file.svg) center no-repeat}
.modal-close .b-close span { display: block; text-indent: -9999px}

.modal-header h4 { font-size: 26px; color: #000; font-weight: 700; text-align: center; padding: 20px 40px}

.modal-body { min-height: 130px; padding: 0 40px}

.modal-footer { display: flex; justify-content: center; align-items: center; gap: 0 10px; padding: 20px 40px 30px 40px}
.modal-footer .btn-modal { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 260px; height: 45px; font-size: 18px; font-weight: 700; color: #fff; border-radius: 4px; border: 0; background: #333; cursor: pointer}

.b-modal { opacity: 0.5 !important}

@media (max-width: 500px){
	.modal-header h4 { font-size: 22px}
}
@media (max-width: 500px){
	.modal-header h4 { font-size: 18px}
}

/* terms modal */
.terms-md { height: 350px; overflow-y: auto}
.terms-md h3 { font-weight: 700; margin-top: 20px}


/*------------------------
Portfolio
------------------------*/
.portfolio_c_row__OizO7 .portfolio_c_row___item__w97Af .portfolio_c_portofolio___item__gWUX3 li .img img { display: block; width: 100%}








