@import url('../images/null_3729ad3b06f94b608c1d0023514791b8.css2');@import url('../images/notosanskr.css');/* @charset "utf-8"; */* {  transition: all 0.3s;}.wrap_intro {  width: 100vw;  padding: 0;  height: 100vh;}.mo_download_btn {  display: none;}#popup_class_video {  display: none;  flex-direction: column;  justify-content: center;  align-items: center;  position: fixed;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 999;}.cont_pop_class {  display: flex;  flex-direction: column;  justify-content: space-between;  align-items: center;  width: 100%;  height: 50%;  background-color: #ff6176;  padding: 20px 10px;  z-index: 4;}.swiper-arrow-wrap {  position: absolute;  min-height: 79px;  bottom: 0;  padding-bottom: 3vh;  width: 100%;  z-index: 999;  box-sizing: content-box;  background: linear-gradient(transparent 10%, #000 90%);}.swiper-arrow {  display: flex;  align-items: center;  justify-content: center;  width: 100%;}/*************************//* 04. CHARACTER/************************/#character {  background-image: url('../images/bg_class.jpg');  overflow: hidden;}#character .wrap_sub_intro{  padding: 0 0 5rem;}.swiper_character {  width: 100%;}.swiper-pagination {  position: static;}.swiper-class-wrap {  /* position: absolute;    z-index: 9999;    top: 85%;    left: 50%;    transform: translate(-50%, -50%); */}.swiper-pagination-bullet {  width: 80px;  min-height: 30px;  background: transparent;}.swiper-button-prev,.swiper-button-next {  display: flex;  align-items: center;  position: unset;  margin-top: 0;}.swiper-button-next {  margin-left: 2rem;}.swiper-button-prev {  margin-right: 2rem;}.skill_name {  position: absolute;  text-align: center;  font-size: 16px;  width: 360px;  padding: 5px 0;  color: #fff;  background-color: rgba(0, 0, 0, 0.5);}.swiper-button-prev::after,.swiper-button-next::after {  content: '';}.prev_img {  transform: rotate(180deg);}.box_char {  position: relative;  display: flex;  /* justify-content: space-around; */  align-items: center;  width: 100%;  max-width: 1400px;  height: 100vh;  margin: 0 auto;  /* background: linear-gradient(to bottom, transparent 50%, #000); */}.desc_night {  /* height: 100px; */}.inner_char {  display: flex;  flex-direction: column;  justify-content: space-between;  /* margin-top: -220px;    margin-left: -100px; */}.char_info {  position: absolute;  right: calc(50% - 2vw);  margin-right: -365px;  top: 0;  height: 100%;  padding-bottom: 5rem;  display: flex;  justify-content: center;  flex-direction: column;}.char_night {  position: absolute;  height: 100%;  left: 50%;  margin-left: calc(-50% - 2rem);  opacity: 0;}.swiper-slide-active .char_night {  opacity: 1;}.char_night img {  /* position: absolute;    top: -116px;    left: 12%; */  height: 100%;}[data-rss='fade-in-up'] {  opacity: 0;  -webkit-transform: translate3d(0, 100px, 0);  transform: translate3d(0, 100px, 0);}.swiper-slide .flip {  transform: translate(0, 50%);  opacity: 0;}.swiper-slide .flip_fst {  transition: 0.7s 0.2s ease-out;}.swiper-slide-active .flip {  opacity: 1;  transform: translate(0, 0);}/* .swiper-slide-active .swiper-slide-ani {    animation: fadeOut 1.5s ease;}.swiper-slide-active .swiper-slide-ani {    animation: fadeIn 1.5s ease;} */.swiper-slide {  background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.178));}.swiper-slide-active .swiper-slide-night .char_night {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/night.png') no-repeat top -100px left 30% / 53% auto; */  /* background: url('../images/night.png') no-repeat center / auto 100%; */}.swiper-slide-active.effect_night {  animation: fadeIn 1.5s ease;  /* background-blend-mode: lighten;    background: url('../images/night_effect.png') no-repeat top -100px left 30% / 53% auto rgba(0, 0, 0, 0.3); */}.swiper-slide-active .swiper-slide-warrior {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/warrior.png') no-repeat top -80px left 35% / 45% auto rgba(0, 0, 0, 0.3); */}.swiper-slide-active .swiper-slide-assassin {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/assassin.png') no-repeat top -100px left 35% / 47% auto rgba(0, 0, 0, 0.3); */}.swiper-slide-active .swiper-slide-archer {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/archer.png') no-repeat top -80px left 32% / 47% auto rgba(0, 0, 0, 0.3); */}.swiper-slide-active .swiper-slide-cleric {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/cleric.png') no-repeat top -80px left 32% / 45% auto; */}.swiper-slide-active.effect_cleric {  animation: fadeIn 1.5s ease;  background: url('../images/cleric_effect.png') no-repeat top -80px left 32% / 45%    auto rgba(0, 0, 0, 0.4);}.swiper-slide-active .swiper-slide-wizard {  transition: 1s ease;  transition-property: opacity, left, top, height;  /* background: url('../images/wizard.png') no-repeat top -80px left 32% / 50% auto; */}.swiper-slide-active.effect_wizard {  animation: fadeIn 1.5s ease;  background: url('../images/wizard_effect.png') no-repeat top -80px left 32% / 50%    auto rgba(0, 0, 0, 0.3);}.box_night .char_night {  background-blend-mode: lighten;  background: url('../images/night_effect.png') no-repeat top left / 100% auto;}@keyframes fadeIn {  0% {    opacity: 0;  }  100% {    opacity: 1;  }}@keyframes fadeOut {  0% {    opacity: 1;  }  100% {    opacity: 0;  }}.icon_skill {  width: 365px;  display: flex;  justify-content: space-between;  margin: 20px 0 20px 0;}.btn_skill {  background-color: #ff6176;}.fst_sk_video,.scd_sk_video,.thd_sk_video,.skill_name {  display: none;}.skill_video {  border: 2px solid #fffad4;}.skill_name {  width: calc(100% - 4px);  left: 2px;}.video_skill {  width: 365px;  height: 240px;  object-fit: cover;}.btn_skill {  width: 88px;  height: 88px;  font-size: 0;}.skill_name.skill_on {  display: block;}/* 나이트 */.skiil_nt_1 {  background: url('../images/skill_nt_1_off.png') no-repeat center / contain;}.skiil_nt_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_nt_1_on.png') no-repeat center / contain;}.skiil_nt_2 {  background: url('../images/skill_nt_2_off.png') no-repeat center / contain;}.skiil_nt_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_nt_2_on.png') no-repeat center / contain;}.skiil_nt_3 {  background: url('../images/skill_nt_3_off.png') no-repeat center / contain;}.skiil_nt_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_nt_3_on.png') no-repeat center / contain;}/* 나이트 *//* 워리어 */.skiil_wr_1 {  background: url('../images/skill_wr_1_off.png') no-repeat center / contain;}.skiil_wr_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wr_1_on.png') no-repeat center / contain;}.skiil_wr_2 {  background: url('../images/skill_wr_2_off.png') no-repeat center / contain;}.skiil_wr_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wr_2_on.png') no-repeat center / contain;}.skiil_wr_3 {  background: url('../images/skill_wr_3_off.png') no-repeat center / contain;}.skiil_wr_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wr_3_on.png') no-repeat center / contain;}/* 워리어 *//* 어쌔신 */.skiil_as_1 {  background: url('../images/skill_as_1_off.png') no-repeat center / contain;}.skiil_as_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_as_1_on.png') no-repeat center / contain;}.skiil_as_2 {  background: url('../images/skill_as_2_off.png') no-repeat center / contain;}.skiil_as_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_as_2_on.png') no-repeat center / contain;}.skiil_as_3 {  background: url('../images/skill_as_3_off.png') no-repeat center / contain;}.skiil_as_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_as_3_on.png') no-repeat center / contain;}/* 어쌔신 *//* 아처 */.skiil_ac_1 {  background: url('../images/skill_ac_1_off.png') no-repeat center / contain;}.skiil_ac_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_ac_1_on.png') no-repeat center / contain;}.skiil_ac_2 {  background: url('../images/skill_ac_2_off.png') no-repeat center / contain;}.skiil_ac_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_ac_2_on.png') no-repeat center / contain;}.skiil_ac_3 {  background: url('../images/skill_ac_3_off.png') no-repeat center / contain;}.skiil_ac_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_ac_3_on.png') no-repeat center / contain;}/* 아처 *//* 클레릭 */.skiil_cl_1 {  background: url('../images/skill_cl_1_off.png') no-repeat center / contain;}.skiil_cl_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_cl_1_on.png') no-repeat center / contain;}.skiil_cl_2 {  background: url('../images/skill_cl_2_off.png') no-repeat center / contain;}.skiil_cl_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_cl_2_on.png') no-repeat center / contain;}.skiil_cl_3 {  background: url('../images/skill_cl_3_off.png') no-repeat center / contain;}.skiil_cl_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_cl_3_on.png') no-repeat center / contain;}/* 클레릭 *//* 위자드 */.skiil_wz_1 {  background: url('../images/skill_wz_1_off.png') no-repeat center / contain;}.skiil_wz_1.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wz_1_on.png') no-repeat center / contain;}.skiil_wz_2 {  background: url('../images/skill_wz_2_off.png') no-repeat center / contain;}.skiil_wz_2.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wz_2_on.png') no-repeat center / contain;}.skiil_wz_3 {  background: url('../images/skill_wz_3_off.png') no-repeat center / contain;}.skiil_wz_3.skill_on {  border: 2px solid #fddf9a;  border-radius: 50%;  background: url('../images/skill_wz_3_on.png') no-repeat center / contain;}/* 위자드 */.video_skill.skill_on,.m_video_skill.skill_on {  display: block;}.char_name {  display: flex;  align-items: center;  font-size: 40px;  color: #fff0af;  margin-bottom: 20px;}.char_name img {  margin-right: 10px;}.char_content {  font-size: 16px;  font-weight: bold;  color: #9b9b9b;}@media screen and (max-width: 1400px) {  .swiper-arrow {    transform: scale(0.8);  }  .char_info {    transform: scale(0.8);    /* transform-origin: center; */  }}@media screen and (max-width: 1300px) {  .char_info {    transform: scale(0.8);  }}/* 모바일 가로 모드 */@media screen and (max-width: 950px) and (orientation: landscape) {  #character {    height: 800px;  }  .wrap_intro {    height: 100%;  }  .swiper_character {    height: 100%;  }  .box_char {    max-width: 900px;    height: 800px;  }  .char_info {    transform-origin: center right;  }}@media screen and (max-height: 800px) and (orientation: landscape) {  .box_char {    max-width: 900px;  }  .char_info {    transform: scale(0.65);  }}@media screen and (max-width: 720px) {  .wrap_intro,  .sub_page {    height: auto;  }  #character {    margin-top: 73px;  }  .box_char {    height: auto;  }  /* .mo_view_720{        display: block;    } */  /*모바일 레이아웃 적용*/  .swiper-class-wrap {    display: none;  }  .char_info {    position: unset;    transform: scale(1);    width: 100%;    padding: 0 2rem;    padding: 80vw 0 5rem;    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);  }  .inner_char {    max-width: 480px;    margin: 0 auto;  }  .swiper-arrow-wrap {    top: calc(50vw + 60px);    bottom: auto;    padding: 0 1rem;    box-sizing: border-box;    background: transparent;  }  .swiper-arrow {    transform: scale(1);    justify-content: space-between;  }  .char_night img {    width: 100%;    height: auto;    display: none;  }  .swiper-slide-active.effect_night {    background: url('../images/m_char_night.png') no-repeat center -73px / 100%      auto;  }  .swiper-slide-active.effect_warrior {    background: url('../images/m_char_warrior.png') no-repeat center -73px / 100%      auto;  }  .swiper-slide-active.effect_assassin {    background: url('../images/m_char_assassin.png') no-repeat center -73px / 100%      auto;  }  .swiper-slide-active.effect_cleric {    background: url('../images/m_char_cleric.png') no-repeat center -73px / 100%      auto;  }  .swiper-slide-active.effect_archer {    background: url('../images/m_char_archer.png') no-repeat center -120px / 100%      auto;  }  .swiper-slide-active.effect_wizard {    background: url('../images/m_char_wizard.png') no-repeat center -73px / 100%      auto;  }}@media screen and (max-width: 480px) {  .inner_char {    max-width: 300px;  }  .char_name {    font-size: 3rem;  }  .char_content {    font-size: 0.9rem;  }  .icon_skill {    width: 100%;  }  .btn_skill {    width: 5rem;    height: 5rem;  }  .skill_video,  .video_skill {    width: 100%;    /* height: auto; */  }}@media screen and (max-width: 320px) {  .char_info {    padding: 80vw 2rem 5rem;  }}/* //모바일 가로 모드 */