.student {
  background-image: url("../images/bg_student.png");
  background-size: cover;
}
.student .header {
  height: 50px;
  text-align: center;
}
.student .header .header_tit {
  display: inline-block;
  position: relative;
  top: -14px;
  z-index: 20;
  font-family: "NSRoundEB", sans-serif;
  color: #FFF;
  font-size: 46px;
  width: 660px;
  height: 106px;
  padding-top: 26px;
}
.student .gnb {
  height: 90px;
}
.student .gnb .logo_socketGame {
  background-image: url("../images/bi_socket_game.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 305px;
  height: 66px;
  background-position: 0 0;
  position: absolute;
  top: 15px;
  left: 15px;
}
.student .gnb .logo_socketGame > span {
  position: absolute;
  color: #222222;
  width: 80px;
  height: 46px;
  line-height: 41px;
  border-radius: 38px;
  text-align: center;
  background-color: #FFF;
  border: 2px solid #222222;
  box-shadow: -2px 5px 0px 0px #222222;
  font-family: "PretendardEB", sans-serif;
  font-weight: 700;
  font-size: 28px;
  right: 0;
  top: calc(50% - 25px);
}
.student .character {
  width: 500px;
  height: 460px;
  background-size: contain;
  background-position: center bottom;
  background-repeat: no-repeat;
}
.student .character._1 {
  background-image: url("../images/cha_1_basic.png");
}
.student .character._2 {
  background-image: url("../images/cha_2_basic.png");
}
.student .character._3 {
  background-image: url("../images/cha_3_basic.png");
}
.student .character._4 {
  background-image: url("../images/cha_4_basic.png");
}
.student .character._5 {
  background-image: url("../images/cha_5_basic.png");
}
.student .gameTitle {
  font-family: "NSRoundEB", sans-serif;
  font-size: 40px;
  line-height: 90px;
  color: #FFF;
}
.student.game .gnb_flex {
  padding: 10px 40px;
  display: flex;
  align-items: center;
}
.student.game .gnb_flex .gnb_wrap {
  flex-grow: 1;
}
.student.game:not(.__mobile) .gameTitle {
  text-shadow: 4px 4px 1px #00aaa4, 4px 3px 1px #00aaa4, 4px 2px 1px #00aaa4, 4px 1px 1px #00aaa4, 4px 0 1px #00aaa4, 4px -1px 1px #00aaa4, 4px -2px 1px #00aaa4, 4px -3px 1px #00aaa4, 4px -4px 1px #00aaa4, 3px -4px 1px #00aaa4, 2px -4px 1px #00aaa4, 1px -4px 1px #00aaa4, 0 -4px 1px #00aaa4, -1px -4px 1px #00aaa4, -2px -4px 1px #00aaa4, -3px -4px 1px #00aaa4, -4px -4px 1px #00aaa4, -4px -3px 1px #00aaa4, -4px -2px 1px #00aaa4, -4px -1px 1px #00aaa4, -4px 0 1px #00aaa4, -4px 1px 1px #00aaa4, -4px 2px 1px #00aaa4, -4px 3px 1px #00aaa4, -4px 4px 1px #00aaa4, -3px 4px 1px #00aaa4, -2px 4px 1px #00aaa4, -1px 4px 1px #00aaa4, 0px 4px 1px #00aaa4, 1px 4px 1px #00aaa4, 2px 4px 1px #00aaa4, 3px 4px 1px #00aaa4;
}
.student .typeTag {
  display: inline-block;
  vertical-align: middle;
  color: #FFF;
  font-size: 24px;
  width: 82px;
  height: 44px;
  border-radius: 22px;
  text-align: center;
  line-height: 44px;
}
.student .typeTag.red {
  background-color: #ff6652;
  text-shadow: 2px 2px 1px #c35445, 2px 1px 1px #c35445, 2px 0 1px #c35445, 2px -1px 1px #c35445, 2px -2px 1px #c35445, 1px -2px 1px #c35445, 0 -2px 1px #c35445, -1px -2px 1px #c35445, -2px -2px 1px #c35445, -2px -1px 1px #c35445, -2px 0 1px #c35445, -2px 1px 1px #c35445, -2px 2px 1px #c35445, -1px 2px 1px #c35445, 0px 2px 1px #c35445, 1px 2px 1px #c35445;
}
.student .typeTag.grn {
  background-color: #00d4cd;
  text-shadow: 2px 2px 1px #00aaa4, 2px 1px 1px #00aaa4, 2px 0 1px #00aaa4, 2px -1px 1px #00aaa4, 2px -2px 1px #00aaa4, 1px -2px 1px #00aaa4, 0 -2px 1px #00aaa4, -1px -2px 1px #00aaa4, -2px -2px 1px #00aaa4, -2px -1px 1px #00aaa4, -2px 0 1px #00aaa4, -2px 1px 1px #00aaa4, -2px 2px 1px #00aaa4, -1px 2px 1px #00aaa4, 0px 2px 1px #00aaa4, 1px 2px 1px #00aaa4;
}

.title {
  margin-top: 35px;
  text-align: center;
}
.title .tit_main {
  display: inline-block;
  background-image: url("../images/bi_main_socket_game.png");
  width: 432px;
  height: 210px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.main .content {
  display: flex;
  justify-content: space-between;
  border-radius: 28px;
  background-color: #FFF;
  box-shadow: 0 16px 20px 0 rgba(43, 43, 40, 0.1);
  width: 1760px;
  height: 780px;
  margin-top: 25px;
  padding: 60px;
  border: 2px solid #9cb5b4;
}
.main .selectChar {
  position: relative;
  background-image: url("../images/cha_bg_readyEnter.png");
  width: 780px;
  height: 660px;
  background-size: cover;
  border-radius: 20px;
}
.main .selectChar #_c_canvas {
  position: absolute;
  top: -200px;
  left: -55px;
  transform: scale(70%);
  transform-origin: center;
}
.main .selectChar .character {
  width: 234px;
  height: 368px;
  position: absolute;
  top: 74px;
  left: 50%;
  transform: translateX(-50%);
}
.main .selectChar .character._2 {
  left: 46.8% !important;
}
.main .selectChar .character._4 {
  left: 47.5% !important;
}
.main .selectChar .charList {
  display: flex;
  justify-content: space-between;
  width: 100%;
  position: absolute;
  bottom: 30px;
  padding: 0 40px;
}
.main .selectChar .charList > li {
  background-image: url("../images/btn_charSelect_off.png");
  width: 124px;
  height: 140px;
  position: relative;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 62px;
}
.main .selectChar .charList > li._1 .charCircle {
  background-image: url("../images/cha_1_select.png");
}
.main .selectChar .charList > li._2 .charCircle {
  background-image: url("../images/cha_2_select.png");
}
.main .selectChar .charList > li._3 .charCircle {
  background-image: url("../images/cha_3_select.png");
}
.main .selectChar .charList > li._4 .charCircle {
  background-image: url("../images/cha_4_select.png");
}
.main .selectChar .charList > li._5 .charCircle {
  background-image: url("../images/cha_5_select.png");
}
.main .selectChar .charList > li > img {
  position: absolute;
  top: 10px;
  left: 10px;
  border-radius: 50%;
  width: 104px;
}
.main .selectChar .charList > li .charCircle {
  position: absolute;
  top: 10px;
  left: 10px;
  border-radius: 50%;
  width: 104px;
  height: 104px;
  background-size: cover;
}
.main .selectChar .charList > li.on {
  background-image: url("../images/btn_charSelect_on.png");
  width: 128px;
  height: 144px;
  top: -10px;
}
.main .selectChar .charList > li.on .charCircle {
  width: 108px;
  top: 12px;
  left: 12px;
}
.main .enterInfo {
  font-family: "NSRoundEB", sans-serif;
  font-size: 30px;
  width: 780px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.main .enterInfo .inputBox {
  width: 560px;
  font-size: 36px;
  border: 2px solid #c7d0d3;
  padding: 0 35px;
  height: 120px;
}
.main .enterInfo .selectWrap {
  width: 560px;
}
.main .enterInfo .selectWrap .selected, .main .enterInfo .selectWrap .selectList li {
  height: 120px;
  font-size: 36px;
  padding: 42px 35px;
  border-color: #c7d0d3 !important;
}
.main .enterInfo .selectWrap .selectList {
  border-color: #c7d0d3 !important;
}
.main .enterInfo .selectWrap .selected:after {
  right: 35px;
}
.main .enterInfo .btn_access {
  background-image: url("../images/btn_access.png");
  width: 780px;
  height: 102px;
  display: block;
  cursor: pointer;
}

.readyGame .header_tit, .prevStudy .header_tit {
  background-image: url("../images/header_tit_red.png");
  text-shadow: 3px 3px 2px #c35445, 3px 2px 2px #c35445, 3px 1px 2px #c35445, 3px 0 2px #c35445, 3px -1px 2px #c35445, 3px -2px 2px #c35445, 3px -3px 2px #c35445, 2px -3px 2px #c35445, 1px -3px 2px #c35445, 0 -3px 2px #c35445, -1px -3px 2px #c35445, -2px -3px 2px #c35445, -3px -3px 2px #c35445, -3px -2px 2px #c35445, -3px -1px 2px #c35445, -3px 0 2px #c35445, -3px 1px 2px #c35445, -3px 2px 2px #c35445, -3px 3px 2px #c35445, -2px 3px 2px #c35445, -1px 3px 2px #c35445, 0px 3px 2px #c35445, 1px 3px 2px #c35445, 2px 3px 2px #c35445;
}

.readyGame .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 892px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
}
.readyGame .wordInfo, .readyGame .gameInfo {
  flex-wrap: wrap;
}
.readyGame .infoBox {
  display: inline-block;
  height: 72px;
  border-radius: 28px;
  padding: 0 35px;
  line-height: 72px;
  font-size: 28px;
  margin-bottom: 20px;
}
.readyGame .infoBox.infoBox {
  margin-left: 20px;
}
.readyGame .infoBox.blue1 {
  background-color: #25b5d9;
  color: #FFF;
}
.readyGame .infoBox.blue2 {
  background-color: #c5ebf5;
  color: #25b5d9;
}
.readyGame .infoBox.grn1 {
  background-color: #0dbe79;
  color: #FFF;
}
.readyGame .infoBox.grn2 {
  background-color: #c0ede2;
  color: #0dbe79;
}
.readyGame .infoBox.purple {
  background-color: #dbdafb;
  color: #4a45bb;
}
.readyGame .readyWrap {
  display: flex;
  margin-top: 30px;
}
.readyGame .readyWrap .gameImg {
  width: 960px;
}
.readyGame .readyWrap .gameImg > img {
  width: 100%;
}
.readyGame .readyWrap .gameImg .gameImgPC {
  display: block;
}
.readyGame .readyWrap .gameImg .gameImgMO {
  display: none;
}
.readyGame .readyWrap .charWrap {
  width: 680px;
  position: relative;
}
.readyGame .readyWrap .charWrap:before {
  content: "";
  position: absolute;
  width: 250px;
  height: 56px;
  border-radius: 50%;
  background-color: #e5e5e5;
  top: 580px;
  left: 170px;
}
.readyGame .readyWrap .charWrap .char_balloon {
  position: absolute;
  background-image: url("../images/balloon_readyStart.png");
  width: 440px;
  height: 195px;
  top: 0;
  right: 20px;
}
.readyGame .readyWrap .charWrap #_c_canvas {
  position: absolute;
  bottom: 37px;
  left: -13px;
}
.readyGame .readyWrap .charWrap .character {
  display: none;
  width: 325px;
  height: 390px;
  position: absolute;
  bottom: 50px;
  left: 130px;
}
.readyGame .readyWrap .charWrap .character._2 {
  left: 95px;
}
.readyGame .readyWrap .charWrap .character._4 {
  left: 108px;
}

.prevStudy .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 892px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.prevStudy .content .word_eng {
  color: #625bf5;
  font-family: "NSRoundEB", sans-serif;
  font-size: 56px;
  margin-top: 55px;
}
.prevStudy .content .word_kor {
  color: #70706a;
  font-size: 34px;
  margin-top: 15px;
}
.prevStudy .content .word_ex {
  font-size: 36px;
  margin-top: 40px;
}

.loading .header_tit {
  background-image: url("../images/header_tit_ylw.png");
  text-shadow: 3px 3px 2px #bb770b, 3px 2px 2px #bb770b, 3px 1px 2px #bb770b, 3px 0 2px #bb770b, 3px -1px 2px #bb770b, 3px -2px 2px #bb770b, 3px -3px 2px #bb770b, 2px -3px 2px #bb770b, 1px -3px 2px #bb770b, 0 -3px 2px #bb770b, -1px -3px 2px #bb770b, -2px -3px 2px #bb770b, -3px -3px 2px #bb770b, -3px -2px 2px #bb770b, -3px -1px 2px #bb770b, -3px 0 2px #bb770b, -3px 1px 2px #bb770b, -3px 2px 2px #bb770b, -3px 3px 2px #bb770b, -2px 3px 2px #bb770b, -1px 3px 2px #bb770b, 0px 3px 2px #bb770b, 1px 3px 2px #bb770b, 2px 3px 2px #bb770b;
}
.loading .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 892px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
}
.loading .cha_gameOver {
  background-image: url("../images/cha_gameOver.png");
  width: 440px;
  height: 551px;
}
.loading .btn_wrap {
  display: flex;
  margin-top: 30px;
}
.loading .btn_out {
  background-image: url("../images/btn_out.png");
  width: 260px;
  height: 78px;
  cursor: pointer;
}
.loading .btn_reconnect {
  background-image: url("../images/btn_reconnect.png");
  width: 260px;
  height: 78px;
  cursor: pointer;
  margin-left: 30px;
}

.game_started .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 942px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
}
.game_started .cha_gameStarted {
  background-image: url("../images/cha_gameStarted.png");
  width: 440px;
  height: 483px;
}

.game_error .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 942px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
}
.game_error .cha_gameStarted {
  background-image: url("../images/cha_socketError.png");
  width: 380px;
  height: 491px;
}

.result .header_tit {
  background-image: url("../images/header_tit_pink.png");
  text-shadow: 3px 3px 1px #bb4167, 3px 2px 1px #bb4167, 3px 1px 1px #bb4167, 3px 0 1px #bb4167, 3px -1px 1px #bb4167, 3px -2px 1px #bb4167, 3px -3px 1px #bb4167, 2px -3px 1px #bb4167, 1px -3px 1px #bb4167, 0 -3px 1px #bb4167, -1px -3px 1px #bb4167, -2px -3px 1px #bb4167, -3px -3px 1px #bb4167, -3px -2px 1px #bb4167, -3px -1px 1px #bb4167, -3px 0 1px #bb4167, -3px 1px 1px #bb4167, -3px 2px 1px #bb4167, -3px 3px 1px #bb4167, -2px 3px 1px #bb4167, -1px 3px 1px #bb4167, 0px 3px 1px #bb4167, 1px 3px 1px #bb4167, 2px 3px 1px #bb4167;
}
.result .content {
  border-radius: 28px;
  width: 1760px;
  height: 892px;
  padding: 65px 60px;
  position: relative;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
}
.result .content .btn_resultWord, .result .content .btn_resultStats {
  width: 260px;
  height: 78px;
  position: absolute;
  top: 30px;
  right: 50px;
  cursor: pointer;
}
.result .content .btn_resultWord {
  background-image: url("../images/btn_result_word.png");
}
.result .content .btn_resultWord.t1 {
  background-image: url("../images/btn_result_word_t1.png");
}
.result .content .btn_resultStats {
  background-image: url("../images/btn_result_stats.png");
}
.result .divider {
  height: 100%;
  width: 1px;
  border-left: 2px dashed rgba(102, 171, 188, 0.5);
}
.result.stats .content {
  display: flex;
  padding: 125px 60px 65px;
}
.result.stats .charWrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 56px;
  font-family: "NSRoundEB", sans-serif;
  width: 550px;
}
.result.stats .charWrap .bonus_balloon {
  background-image: url("../images/balloon_bonus.png");
  width: 380px;
  height: 197px;
  text-align: center;
  color: #625bf5;
  font-size: 56px;
  font-family: "NSRoundEB", sans-serif;
  padding-top: 30px;
}
.result.stats .charWrap .bonus_balloon .ic_bonus {
  display: inline-block;
  vertical-align: middle;
  background-image: url("../../common/images/ic_bonus.png");
  width: 107px;
  height: 100px;
  background-size: contain;
  background-repeat: no-repeat;
}
.result.stats .charWrap .character._2 {
  background-position: 83px bottom;
}
.result.stats .charWrap .character._4 {
  background-position: 107px bottom;
}
.result.stats .charWrap .resultText {
  margin-top: 20px;
  white-space: nowrap;
}
.result.stats .resultStatsWrap {
  background-color: #f4f4fb;
  width: 1110px;
  height: 706px;
  border-radius: 16px;
  padding: 60px 70px;
}
.result.stats .resultStatsWrap .subTit {
  font-size: 28px;
  line-height: 32px;
  height: 32px;
  font-family: "NSRoundEB", sans-serif;
  padding-left: 45px;
  background-position: left;
  background-repeat: no-repeat;
  background-size: contain;
}
.result.stats .resultStatsWrap .correctStats .subTit {
  background-image: url("../../common/images/ic_statsCorrection.png");
}
.result.stats .resultStatsWrap .correctStats .barChart {
  display: flex;
  font-family: "NSRoundEB", sans-serif;
  align-items: center;
  margin-top: 30px;
}
.result.stats .resultStatsWrap .correctStats .barChart .myScore {
  width: 524px;
  height: 244px;
  font-size: 48px;
  color: #ffffff;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-evenly;
  align-content: center;
  background-color: #625bf5;
  border-radius: 15px;
}
.result.stats .resultStatsWrap .correctStats .barChart .myScore .totalScore {
  width: 100%;
  text-align: center;
  height: 80px;
  line-height: 80px;
}
.result.stats .resultStatsWrap .correctStats .barChart .myScore .comboWrap {
  background-image: url("../images/result/d_bonus_bg.png");
  background-repeat: no-repeat;
  width: 220px;
  height: 110px;
  font-size: 28px;
  text-align: center;
  line-height: 138px;
  text-shadow: 3px 3px 2px #4a45bb, 3px 2px 2px #4a45bb, 3px 1px 2px #4a45bb, 3px 0 2px #4a45bb, 3px -1px 2px #4a45bb, 3px -2px 2px #4a45bb, 3px -3px 2px #4a45bb, 2px -3px 2px #4a45bb, 1px -3px 2px #4a45bb, 0 -3px 2px #4a45bb, -1px -3px 2px #4a45bb, -2px -3px 2px #4a45bb, -3px -3px 2px #4a45bb, -3px -2px 2px #4a45bb, -3px -1px 2px #4a45bb, -3px 0 2px #4a45bb, -3px 1px 2px #4a45bb, -3px 2px 2px #4a45bb, -3px 3px 2px #4a45bb, -2px 3px 2px #4a45bb, -1px 3px 2px #4a45bb, 0px 3px 2px #4a45bb, 1px 3px 2px #4a45bb, 2px 3px 2px #4a45bb;
}
.result.stats .resultStatsWrap .correctStats .barChart .myScore .timeWrap {
  background-image: url("../images/result/d_time_bonus_bg.png");
  background-repeat: no-repeat;
  width: 220px;
  height: 110px;
  font-size: 28px;
  text-align: center;
  line-height: 138px;
  text-shadow: 3px 3px 2px #4a45bb, 3px 2px 2px #4a45bb, 3px 1px 2px #4a45bb, 3px 0 2px #4a45bb, 3px -1px 2px #4a45bb, 3px -2px 2px #4a45bb, 3px -3px 2px #4a45bb, 2px -3px 2px #4a45bb, 1px -3px 2px #4a45bb, 0 -3px 2px #4a45bb, -1px -3px 2px #4a45bb, -2px -3px 2px #4a45bb, -3px -3px 2px #4a45bb, -3px -2px 2px #4a45bb, -3px -1px 2px #4a45bb, -3px 0 2px #4a45bb, -3px 1px 2px #4a45bb, -3px 2px 2px #4a45bb, -3px 3px 2px #4a45bb, -2px 3px 2px #4a45bb, -1px 3px 2px #4a45bb, 0px 3px 2px #4a45bb, 1px 3px 2px #4a45bb, 2px 3px 2px #4a45bb;
}
.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap {
  font-size: 28px;
  text-align: center;
  display: flex;
  color: black;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  margin-left: 30px;
  height: 204px;
}
.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap ._score_wrapping {
  padding-left: 30px;
  border-left: 3px solid #aba8f9;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 96px;
  justify-content: center;
}
.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap p {
  margin-bottom: 20px;
  font-size: 26px;
  color: #625bf5;
}
.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap div {
  font-size: 36px;
  color: #111111;
}
.result.stats .resultStatsWrap .timeStats {
  margin-top: 40px;
}
.result.stats .resultStatsWrap .timeStats .subTit {
  background-image: url("../../common/images/ic_statsTime.png");
}
.result.stats .resultStatsWrap .timeStats .arrChart {
  display: flex;
  margin-top: 25px;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_label {
  width: 175px;
  height: 62px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_label + .arrChart_label {
  margin-top: 12px;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graphWrap {
  width: 800px;
  padding: 21px 28px 21px 0;
  border-left: 2px solid #c7d0d3;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph {
  height: 20px;
  position: relative;
  border-left: none !important;
  min-width: 178px;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph + .arrChart_graph {
  margin-top: 54px;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph:after {
  content: "";
  position: absolute;
  width: 28px;
  height: 40px;
  right: -20px;
  top: -13px;
  z-index: 2;
  background-repeat: no-repeat;
  background-size: contain;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph > p {
  width: 178px;
  height: 56px;
  position: absolute;
  top: -22px;
  left: 50%;
  background-color: #FFF;
  border-radius: 28px;
  font-size: 25px;
  line-height: 46px;
  text-align: center;
  transform: translateX(-50%);
  font-family: "NSRoundEB", sans-serif;
  z-index: 5;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.purple {
  border: 3px solid #4a45bb;
  background-color: #625bf5;
  box-shadow: 0 -9px 0 #5a54e2 inset;
  color: #5a54e2;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.purple:after {
  background-image: url("../images/arrChart_tail_purple.png");
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.purple > p {
  border: 6px solid #5a54e2;
  box-shadow: 0 0 0 3px #4a45bb;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.grn {
  border: 3px solid #00aaa4;
  background-color: #00d4cd;
  box-shadow: 0 -9px 0 #00c3bd inset;
  color: #00aaa4;
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.grn:after {
  background-image: url("../images/arrChart_tail_grn.png");
}
.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.grn > p {
  border: 6px solid #00d4cd;
  box-shadow: 0 0 0 3px #00aaa4;
}
.result.word .content {
  padding: 125px 60px 45px;
}
.result.word .wordListWrap {
  height: 150px;
}
.result.word .wordListWrap .wordList {
  display: flex;
  flex-wrap: wrap;
}
.result.word .wordListWrap .wordList li {
  width: 282px;
  height: auto;
  border-radius: 28px;
  line-height: 33px;
  margin: 16px 8px;
  font-size: 34px;
  display: flex;
  padding: 15px 0;
  align-content: center;
  align-items: center;
  justify-content: center;
  border: 2px solid #dddde6;
  text-align: center;
  position: relative;
  cursor: pointer;
}
.result.word .wordListWrap .wordList li._click {
  box-shadow: 0 4px 0 0 #f0f0f0, 2px 6px 0 rgba(221, 221, 230, 0.2) inset;
}
.result.word .wordListWrap .wordList li.x {
  color: #fe7462;
  border: 2px solid #fe7462;
  box-shadow: 0 4px 0 0 #f0f0f0;
  font-family: "NSRoundEB", sans-serif;
  padding: 15px 0 15px 30px;
}
.result.word .wordListWrap .wordList li.x._click {
  box-shadow: 0 4px 0 0 #f0f0f0, 2px 6px 0 rgba(254, 116, 98, 0.2) inset;
}
.result.word .wordListWrap .wordList li.x:before {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("../../common/images/ic_x.png");
  width: 16px;
  height: 16px;
  position: absolute;
  top: 50%;
  left: 22px;
  margin-top: -8px;
}
.result.word .showWordWrap {
  border: 2px solid #c7d0d3;
  height: 532px;
  border-radius: 20px;
  display: flex;
  margin-top: 30px;
}
.result.word .showWordWrap .word_img {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.result.word .showWordWrap .word_img > img {
  max-height: 90%;
}
.result.word .showWordWrap .word_text {
  width: 50%;
  padding: 25px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.result.word .showWordWrap .word_text .word_eng {
  color: #625bf5;
  font-family: "NSRoundEB", sans-serif;
  font-size: 44px;
  display: inline-block;
  position: relative;
}
.result.word .showWordWrap .word_text .word_eng .btn_sound {
  position: absolute;
  top: -12px;
  right: -90px;
}
.result.word .showWordWrap .word_text .word_kor {
  color: #70706a;
  font-size: 28px;
  margin-top: 15px;
}
.result.word .showWordWrap .word_text .word_ex {
  font-size: 28px;
  margin-top: 40px;
}
.result.survival .content {
  display: block;
  padding: 60px 40px;
}
.result.survival .content .btn_resultWord {
  z-index: 100;
}
.result.survival .feedback {
  position: relative;
  display: flex;
  justify-content: center;
  margin: 0 auto;
  padding-top: 48px;
  width: 428px;
  height: 160px;
  background-image: url("../images/result/feedback_bg.png");
  background-repeat: no-repeat;
  background-size: contain;
  font-family: "NSRoundEB", sans-serif;
  font-size: 44px;
  color: #fff;
  text-shadow: 2px 2px 1px #A72316, 2px 1px 1px #A72316, 2px 0 1px #A72316, 2px -1px 1px #A72316, 2px -2px 1px #A72316, 1px -2px 1px #A72316, 0 -2px 1px #A72316, -1px -2px 1px #A72316, -2px -2px 1px #A72316, -2px -1px 1px #A72316, -2px 0 1px #A72316, -2px 1px 1px #A72316, -2px 2px 1px #A72316, -1px 2px 1px #A72316, 0px 2px 1px #A72316, 1px 2px 1px #A72316;
}
.result.survival .feedback::before, .result.survival .feedback::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}
.result.survival .feedback::before {
  left: 0;
  transform: translate(-100%, -50%) scale(0.8);
  width: 234px;
  height: 100px;
  background-image: url("../images/result/deco_left.png");
}
.result.survival .feedback::after {
  right: 0;
  transform: translate(100%, -50%) scale(0.8);
  width: 272px;
  height: 105px;
  background-image: url("../images/result/deco_right.png");
}
.result.survival .stair {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  height: calc(100% - 144px);
}
.result.survival .stair_wrap {
  position: relative;
  width: 148px;
}
.result.survival .stair_wrap.on._1 .stair_item {
  border-color: #8548B6;
  background-color: #C484F8;
}
.result.survival .stair_wrap.on._2 .stair_item {
  border-color: #4C5FBC;
  background-color: #8498F8;
}
.result.survival .stair_wrap.on._3 .stair_item {
  border-color: #2F6B94;
  background-color: #6EB3E3;
}
.result.survival .stair_wrap.on._4 .stair_item {
  border-color: #36826E;
  background-color: #72BAA7;
}
.result.survival .stair_wrap.on._5 .stair_item {
  border-color: #478942;
  background-color: #AAD4A7;
}
.result.survival .stair_wrap.on._6 .stair_item {
  border-color: #8B9936;
  background-color: #E1EF96;
}
.result.survival .stair_wrap.on._7 .stair_item {
  border-color: #A8A840;
  background-color: #F9F9A7;
}
.result.survival .stair_wrap.on._8 .stair_item {
  border-color: #BB9530;
  background-color: #FDD97B;
}
.result.survival .stair_wrap.on._9 .stair_item {
  border-color: #BB5F23;
  background-color: #FFA568;
}
.result.survival .stair_wrap.on._10 .stair_item {
  border-color: #A82B35;
  background-color: #EE646F;
}
.result.survival .stair_item {
  width: 100%;
  height: 44px;
  border: 2px solid #7C7C8E;
  border-radius: 8px;
  background-color: #CECEDB;
}
.result.survival .stair_item + .stair_item {
  margin-top: 4px;
}
.result.survival .stair .average, .result.survival .stair .winner {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  padding: 16px 22px;
  border: 2px solid transparent;
  border-radius: 64px;
  box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1);
  font-family: "NSRoundEB", sans-serif;
  font-size: 28px;
  text-align: center;
  white-space: nowrap;
  z-index: 10;
}
.result.survival .stair .average::before, .result.survival .stair .average::after, .result.survival .stair .winner::before, .result.survival .stair .winner::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.result.survival .stair .average::before, .result.survival .stair .winner::before {
  top: -26px;
  border: 13px solid transparent;
}
.result.survival .stair .average::after, .result.survival .stair .winner::after {
  top: -23px;
  border: 13px solid transparent;
}
.result.survival .stair .average {
  border-color: #095855;
  background-color: #CBFFFD;
  color: #095855;
}
.result.survival .stair .average::before {
  border-bottom-color: #095855;
}
.result.survival .stair .average::after {
  border-bottom-color: #CBFFFD;
}
.result.survival .stair .winner {
  border-color: #58092F;
  background-color: #FFE1EF;
  color: #58092F;
}
.result.survival .stair .winner::before {
  border-bottom-color: #58092F;
}
.result.survival .stair .winner::after {
  border-bottom-color: #FFE1EF;
}
.result.survival .stair #cha_motion {
  position: absolute;
  top: 4px;
  left: 50%;
  transform: translate(-50%, -100%);
  z-index: 100;
}

.finGame .logo_socketGame {
  display: none;
}
.finGame .header_tit {
  background-image: url("../images/header_tit_purple.png");
  text-shadow: 3px 3px 2px #4a45bb, 3px 2px 2px #4a45bb, 3px 1px 2px #4a45bb, 3px 0 2px #4a45bb, 3px -1px 2px #4a45bb, 3px -2px 2px #4a45bb, 3px -3px 2px #4a45bb, 2px -3px 2px #4a45bb, 1px -3px 2px #4a45bb, 0 -3px 2px #4a45bb, -1px -3px 2px #4a45bb, -2px -3px 2px #4a45bb, -3px -3px 2px #4a45bb, -3px -2px 2px #4a45bb, -3px -1px 2px #4a45bb, -3px 0 2px #4a45bb, -3px 1px 2px #4a45bb, -3px 2px 2px #4a45bb, -3px 3px 2px #4a45bb, -2px 3px 2px #4a45bb, -1px 3px 2px #4a45bb, 0px 3px 2px #4a45bb, 1px 3px 2px #4a45bb, 2px 3px 2px #4a45bb;
}
.finGame .content {
  border-radius: 28px;
  overflow: hidden;
  width: 1760px;
  height: 892px;
  border: 2px solid #9cb5b4;
  background-color: #FFF;
  position: relative;
  padding: 70px 60px 60px;
  display: flex;
}
.finGame .content .scoreWrap {
  width: 588px;
  margin-left: 20px;
}
.finGame .content .scoreWrap .charWrap {
  position: relative;
  padding-bottom: 15px;
}
.finGame .content .scoreWrap .charWrap:before {
  content: "";
  position: absolute;
  width: 196px;
  height: 44px;
  border-radius: 50%;
  background-color: #e5e5e5;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.finGame .content .scoreWrap .charWrap .char_balloon {
  background-image: url("../images/balloon_finGame.png");
  background-position: center;
  background-size: contain;
  height: 213px;
  background-repeat: no-repeat;
}
.finGame .content .scoreWrap .charWrap .character {
  width: 100%;
  height: 320px;
  position: relative;
}
.finGame .content .scoreWrap .charWrap .character._2 {
  background-position: 126px bottom;
}
.finGame .content .scoreWrap .charWrap .character._4 {
  background-position: 149px bottom;
}
.finGame .content .scoreWrap .charWrap #_c_canvas {
  display: block;
  margin: auto;
  transform-origin: top;
}
.finGame .content .scoreWrap .myScore {
  height: 188px;
  padding: 35px;
  border-radius: 16px;
  background-color: #efefff;
  font-size: 28px;
  margin-top: 25px;
}
.finGame .content .scoreWrap .myScore .score_subTit {
  width: 145px;
  flex-basis: 145px;
}
.finGame .content .scoreWrap .myScore .correctScoreWrap {
  background-color: #eaeaf4;
  width: 100%;
  height: 48px;
  overflow: hidden;
  box-shadow: 0 4px 0 #d8d8e1 inset;
  border-radius: 24px;
  position: relative;
}
.finGame .content .scoreWrap .myScore .correctScoreWrap .percentTxt {
  color: #d8d8e1;
  position: absolute;
  top: 9px;
  left: 20px;
  z-index: 5;
}
.finGame .content .scoreWrap .myScore .correctScoreWrap .correctScore {
  position: relative;
  border-radius: 24px;
  height: 100%;
  background-color: #625bf5;
  border: 3px solid #4a45bb;
  color: #FFF;
  padding: 6px 20px;
  box-shadow: 0 -9px 0 #5a54e2 inset;
}
.finGame .content .gameWrap {
  position: relative;
  margin-left: 50px;
}
.finGame .content .gameWrap .gameTit {
  width: 96px;
  height: 186px;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 28px 0 0 28px;
  color: #FFF;
  background-color: #ff6652;
  text-align: center;
  font-family: "NSRoundEB", sans-serif;
  font-size: 28px;
  padding-top: 60px;
  line-height: 36px;
}
.finGame .content .gameWrap .gameCont {
  width: 960px;
  height: 760px;
  border: 2px solid #433db7;
  border-radius: 16px;
  background-color: #ffcbda;
}

.game .gameTimer {
  width: 1752px;
  font-size: 24px;
  height: 48px;
  font-family: "NSRoundEB", sans-serif;
  position: relative;
  margin: 14px auto 0;
  display: flex;
  align-items: center;
}
.game .gameTimer:before {
  content: "";
  position: absolute;
  background-image: url("../../common/images/ic_timer.png");
  width: 64px;
  height: 78px;
  top: -14px;
  left: -10px;
  background-size: contain;
  background-repeat: no-repeat;
}
.game .gameTimer:after {
  content: "";
  position: absolute;
  background-image: url("../../common/images/ic_timer_txt.png");
  width: 60px;
  height: 24px;
  top: 12px;
  left: 61px;
  background-size: contain;
  background-repeat: no-repeat;
}
.game .gameTimer .gameTimerBarWrap {
  flex-grow: 1;
  height: 100%;
  overflow: hidden;
  border-radius: 24px;
  background-color: #9bc32c;
  box-shadow: 0 4px 0 #8fb429 inset;
}
.game .gameTimer .gameTimerBarWrap .gameTimerBar {
  height: 100%;
  border-radius: 24px;
  background-color: #ff6652;
  transition-timing-function: linear;
  border: 3px solid #c35445;
  box-shadow: 0 -9px 0 #eb5e4c inset;
  transition-duration: 1s;
}
.game .gameTimer .gameTimerBarWrap .gameTimerBar._hurry {
  background-color: #E3516E;
}
.game .ic_timeAttack {
  background-image: url("../images/ic_timeAttack.png");
  width: 272px;
  height: 96px;
  opacity: 0.5;
}
.game .ic_timeAttack.on {
  opacity: 1;
}
.game #gameDimLayer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 500;
}

.popCont .countWrap {
  background-image: url("../images/bg_countWrap.png");
  width: 440px;
  height: 440px;
  box-shadow: 0 0 0 32px #FFF, 0 30px 40px rgba(0, 0, 0, 0.3);
  text-align: center;
  border-radius: 50%;
  font-size: 300px;
  font-family: "NSRoundEB", sans-serif;
  color: #4d3600;
  padding-top: 67px;
  background-color: #ffe050;
  border: 8px solid #eecc2d;
}
.popCont .timeAttackWrap {
  background-image: url("../images/bg_timeAttackWrap.png");
  width: 472px;
  height: 472px;
  box-shadow: 0 30px 40px rgba(0, 0, 0, 0.3);
  text-align: center;
  border-radius: 50%;
  font-size: 188px;
  font-family: "NSRoundEB", sans-serif;
  color: #ffe050;
  padding-top: 160px;
  text-shadow: 4px 4px 1px #00aaa4, 4px 3px 1px #00aaa4, 4px 2px 1px #00aaa4, 4px 1px 1px #00aaa4, 4px 0 1px #00aaa4, 4px -1px 1px #00aaa4, 4px -2px 1px #00aaa4, 4px -3px 1px #00aaa4, 4px -4px 1px #00aaa4, 3px -4px 1px #00aaa4, 2px -4px 1px #00aaa4, 1px -4px 1px #00aaa4, 0 -4px 1px #00aaa4, -1px -4px 1px #00aaa4, -2px -4px 1px #00aaa4, -3px -4px 1px #00aaa4, -4px -4px 1px #00aaa4, -4px -3px 1px #00aaa4, -4px -2px 1px #00aaa4, -4px -1px 1px #00aaa4, -4px 0 1px #00aaa4, -4px 1px 1px #00aaa4, -4px 2px 1px #00aaa4, -4px 3px 1px #00aaa4, -4px 4px 1px #00aaa4, -3px 4px 1px #00aaa4, -2px 4px 1px #00aaa4, -1px 4px 1px #00aaa4, 0px 4px 1px #00aaa4, 1px 4px 1px #00aaa4, 2px 4px 1px #00aaa4, 3px 4px 1px #00aaa4, 0 14px 10px rgba(0, 0, 0, 0.16);
}
.popCont .comboWrap {
  background-image: url("../images/bg_comboWrap.png");
  width: 472px;
  height: 472px;
  box-shadow: 0 30px 40px rgba(0, 0, 0, 0.3);
  text-align: center;
  border-radius: 50%;
  font-size: 188px;
  font-family: "NSRoundEB", sans-serif;
  color: #ffe050;
  padding-top: 160px;
  text-shadow: 4px 4px 1px #8f2e21, 4px 3px 1px #8f2e21, 4px 2px 1px #8f2e21, 4px 1px 1px #8f2e21, 4px 0 1px #8f2e21, 4px -1px 1px #8f2e21, 4px -2px 1px #8f2e21, 4px -3px 1px #8f2e21, 4px -4px 1px #8f2e21, 3px -4px 1px #8f2e21, 2px -4px 1px #8f2e21, 1px -4px 1px #8f2e21, 0 -4px 1px #8f2e21, -1px -4px 1px #8f2e21, -2px -4px 1px #8f2e21, -3px -4px 1px #8f2e21, -4px -4px 1px #8f2e21, -4px -3px 1px #8f2e21, -4px -2px 1px #8f2e21, -4px -1px 1px #8f2e21, -4px 0 1px #8f2e21, -4px 1px 1px #8f2e21, -4px 2px 1px #8f2e21, -4px 3px 1px #8f2e21, -4px 4px 1px #8f2e21, -3px 4px 1px #8f2e21, -2px 4px 1px #8f2e21, -1px 4px 1px #8f2e21, 0px 4px 1px #8f2e21, 1px 4px 1px #8f2e21, 2px 4px 1px #8f2e21, 3px 4px 1px #8f2e21, 0 14px 10px rgba(0, 0, 0, 0.16);
}
.popCont .timeAttackWrap + .comboWrap {
  margin-left: 50px;
}

#resultStats .wordModal, #resultWord .wordModal {
  width: 720px;
  height: 800px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 24px;
  background-color: #FFF;
  z-index: 22;
}
#resultStats .wordModal .word_eng, #resultWord .wordModal .word_eng {
  position: relative;
  color: #3265e5;
  font-family: "NSRoundEB", sans-serif;
  font-size: 44px;
  margin-top: 55px;
}
#resultStats .wordModal .word_eng .btn_sound, #resultWord .wordModal .word_eng .btn_sound {
  position: absolute;
  top: -12px;
  right: -90px;
}
#resultStats .wordModal .word_kor, #resultWord .wordModal .word_kor {
  color: #70706a;
  font-size: 28px;
  margin-top: 10px;
}
#resultStats .wordModal .word_ex, #resultWord .wordModal .word_ex {
  font-size: 28px;
  margin-top: 25px;
}

.bgWrapper.__mobile {
  background-image: url("../images/bg_student_mo.png");
  overflow: hidden;
}
.bgWrapper.__mobile .wrap {
  width: 1080px;
  height: 2300px;
  padding: 0 48px;
}
.bgWrapper.__mobile .gnb {
  height: 144px;
}
.bgWrapper.__mobile .gnb .logo_socketGame {
  width: 415px;
  height: 88px;
  top: 38px;
}
.bgWrapper.__mobile .gnb .logo_socketGame > span {
  width: 115px;
  height: 64px;
  line-height: 55px;
  border: 3px solid #222222;
  font-size: 40px;
  top: calc(50% - 33px);
}
.bgWrapper.__mobile .title .tit_main {
  width: 732px;
  height: 270px;
}
.bgWrapper.__mobile .header {
  height: 116px;
}
.bgWrapper.__mobile .header .header_tit {
  top: 10px;
  font-size: 60px;
  width: 846px;
  height: 137px;
  padding-top: 30px;
}
.bgWrapper.__mobile.readyGame .header_tit, .bgWrapper.__mobile.prevStudy .header_tit {
  background-image: url("../images/header_tit_red_mo.png");
}
.bgWrapper.__mobile.main .content {
  width: 984px;
  height: 1892px;
  flex-direction: column;
  padding: 49px;
}
.bgWrapper.__mobile.main .selectChar {
  background-image: url("../images/cha_bg_readyEnter_mo.png");
  width: 888px;
  height: 1004px;
}
.bgWrapper.__mobile.main .selectChar #_c_canvas {
  position: absolute;
  top: 0;
  left: 0;
  transform: none;
}
.bgWrapper.__mobile.main .selectChar .charList {
  bottom: 55px;
}
.bgWrapper.__mobile.main .selectChar .charList > li {
  background-image: url("../images/btn_charSelect_off_mo.png");
  width: 161px;
  height: 181px;
}
.bgWrapper.__mobile.main .selectChar .charList > li > img {
  width: 133px;
  top: 13px;
  left: 13px;
}
.bgWrapper.__mobile.main .selectChar .charList > li .charCircle {
  top: 13px;
  left: 13px;
  border-radius: 50%;
  width: 133px;
  height: 133px;
}
.bgWrapper.__mobile.main .selectChar .charList > li.on {
  background-image: url("../images/btn_charSelect_on_mo.png");
  width: 165px;
  height: 186px;
  top: -20px;
}
.bgWrapper.__mobile.main .selectChar .charList > li.on .charCircle {
  top: 16px;
  left: 16px;
  width: 139px;
  height: 139px;
}
.bgWrapper.__mobile.main .selectChar .character {
  width: 348px;
  height: 460px;
  top: 230px;
  left: 50%;
}
.bgWrapper.__mobile.main .selectChar .char_balloon {
  width: 553px;
  height: 198px;
  background-size: contain;
  background-repeat: no-repeat;
}
.bgWrapper.__mobile.main .enterInfo {
  font-size: 38px;
  padding: 0 30px;
  width: 100%;
  flex-grow: 1;
  margin-top: 40px;
}
.bgWrapper.__mobile.main .enterInfo .inputBox {
  width: 628px;
  font-size: 40px;
  border: 3px solid #c7d0d3;
  height: 144px;
  padding: 0 40px;
  border-radius: 20px;
}
.bgWrapper.__mobile.main .enterInfo .selectWrap {
  width: 628px;
}
.bgWrapper.__mobile.main .enterInfo .selectWrap .selected, .bgWrapper.__mobile.main .enterInfo .selectWrap .selectList li {
  height: 128px;
  font-size: 38px;
  padding: 40px;
  border-width: 3px !important;
}
.bgWrapper.__mobile.main .enterInfo .selectWrap .selected.on {
  border-radius: 20px 20px 0 0;
}
.bgWrapper.__mobile.main .enterInfo .selectWrap .selectList {
  border-width: 3px !important;
}
.bgWrapper.__mobile.main .enterInfo .selectWrap .selected:after {
  right: 40px;
}
.bgWrapper.__mobile.main .enterInfo .btn_access {
  background-image: url("../images/btn_access_mo.png");
  width: 840px;
  height: 150px;
}
.bgWrapper.__mobile.readyGame .content {
  width: 984px;
  height: 1992px;
  padding: 80px 60px 60px;
}
.bgWrapper.__mobile.readyGame .infoBox {
  display: inline-block;
  height: 96px;
  border-radius: 36px;
  padding: 0 35px;
  line-height: 96px;
  font-size: 36px;
}
.bgWrapper.__mobile.readyGame .readyWrap {
  flex-direction: column;
}
.bgWrapper.__mobile.readyGame .readyWrap .gameImg {
  width: 100%;
}
.bgWrapper.__mobile.readyGame .readyWrap .gameImg .gameImgPC {
  display: none;
}
.bgWrapper.__mobile.readyGame .readyWrap .gameImg .gameImgMO {
  display: block;
}
.bgWrapper.__mobile.readyGame .charWrap {
  height: 760px;
  width: 100%;
}
.bgWrapper.__mobile.readyGame .charWrap:before {
  top: unset;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}
.bgWrapper.__mobile.readyGame .charWrap .char_balloon {
  background-image: url("../images/balloon_readyStart_mo.png");
  width: 564px;
  height: 251px;
  top: 50px;
  left: 50%;
  right: unset;
  transform: translateX(-50%);
}
.bgWrapper.__mobile.readyGame .charWrap #_c_canvas {
  bottom: 20px;
  left: 115px;
}
.bgWrapper.__mobile.readyGame .charWrap .character {
  width: 423px;
  height: 436px;
  bottom: 20px;
  left: 219px;
}
.bgWrapper.__mobile.readyGame .charWrap .character._2 {
  left: 175px;
}
.bgWrapper.__mobile.readyGame .charWrap .character._4 {
  left: 185px;
}
.bgWrapper.__mobile.prevStudy .content {
  width: 984px;
  height: 1992px;
}
.bgWrapper.__mobile.prevStudy .content .word_img {
  width: 100%;
  text-align: center;
}
.bgWrapper.__mobile.prevStudy .content .word_img > img {
  width: 80%;
}
.bgWrapper.__mobile.prevStudy .content .word_eng {
  font-size: 72px;
  margin-top: 140px;
}
.bgWrapper.__mobile.prevStudy .content .word_kor {
  font-size: 48px;
  margin-top: 30px;
}
.bgWrapper.__mobile.prevStudy .content .word_ex {
  font-size: 48px;
  margin-top: 60px;
}
.bgWrapper.__mobile.result .header_tit {
  background-image: url("../images/header_tit_pink_mo.png");
}
.bgWrapper.__mobile.result .content {
  width: 984px;
  height: 1992px;
  flex-direction: column;
  padding: 210px 35px 35px;
}
.bgWrapper.__mobile.result .content .btn_resultWord, .bgWrapper.__mobile.result .content .btn_resultStats {
  width: 381px;
  height: 105px;
  top: 72px;
  right: 40px;
}
.bgWrapper.__mobile.result .content .btn_resultWord {
  background-image: url("../images/btn_result_word_mo.png");
}
.bgWrapper.__mobile.result .content .btn_resultWord.t1 {
  background-image: url("../images/btn_result_word_mo_t1.png");
}
.bgWrapper.__mobile.result .content .btn_resultStats {
  background-image: url("../images/btn_result_stats_mo.png");
}
.bgWrapper.__mobile.result.stats .charWrap {
  width: 888px;
  height: 830px;
  font-size: 64px;
  background-color: #f4f4fb;
  border-radius: 20px;
  margin: 0 auto;
  padding: 40px;
  flex-shrink: 0;
}
.bgWrapper.__mobile.result.stats .charWrap .character._2 {
  background-position: 192px bottom;
}
.bgWrapper.__mobile.result.stats .charWrap .character._4 {
  background-position: 222px bottom;
}
.bgWrapper.__mobile.result.stats .charWrap .bonus_balloon {
  background-image: url("../images/balloon_bonus_mo.png");
  width: 360px;
  height: 187px;
  font-size: 53px;
  padding-top: 30px;
}
.bgWrapper.__mobile.result.stats .charWrap .bonus_balloon .ic_bonus {
  background-image: url("../../common/images/ic_bonus.png");
  width: 102px;
  height: 95px;
}
.bgWrapper.__mobile.result.stats .charWrap .resultText {
  margin-top: 40px;
  font-size: 48px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap {
  width: 100%;
  background-color: #FFF;
  padding: 60px 35px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .subTit {
  font-size: 38px;
  line-height: 48px;
  height: 48px;
  padding-left: 65px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart {
  width: 100%;
  display: block;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .myScore {
  width: 100%;
  background-image: url("../images/result/d_total_score_m.png");
  height: 172px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .myScore .totalScore {
  width: auto;
  min-width: 310px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap {
  font-size: 28px;
  text-align: center;
  display: flex;
  color: black;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  padding-left: 0;
  border-left: none;
  padding-top: 20px;
  margin-top: 20px;
  height: auto;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap ._score_wrapping {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 50%;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap p {
  margin-bottom: 10px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .correctStats .barChart .class_score_wrap .averageWrap ._score {
  margin-bottom: 0;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats {
  margin-top: 50px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart {
  padding-left: 0;
  margin-top: 35px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_label {
  width: 260px;
  height: 80px;
  font-size: 34px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_label + .arrChart_label {
  margin-top: 16px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graphWrap {
  width: 800px;
  padding: 27px 36px 27px 0;
  border-left: 3px solid #c7d0d3;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph {
  height: 26px;
  min-width: 228px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph + .arrChart_graph {
  margin-top: 70px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph:after {
  width: 36px;
  height: 53px;
  right: -36px;
  top: -16px;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph > p {
  width: 228px;
  height: 72px;
  top: -27px;
  border-radius: 36px;
  font-size: 32px;
  line-height: 64px;
  border-width: 8px !important;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.purple {
  border: 4px solid #4a45bb;
  box-shadow: 0 -9px 0 #5a54e2 inset;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.purple > p {
  box-shadow: 0 0 0 4px #4a45bb;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.grn {
  border: 4px solid #00aaa4;
  box-shadow: 0 -11px 0 #00c3bd inset;
}
.bgWrapper.__mobile.result.stats .resultStatsWrap .timeStats .arrChart .arrChart_graph.grn > p {
  box-shadow: 0 0 0 4px #00aaa4;
}
.bgWrapper.__mobile.result.word .wordListWrap {
  height: 600px;
}
.bgWrapper.__mobile.result.word .wordListWrap .wordList li {
  width: 282px;
  height: auto;
  border-radius: 28px;
  line-height: 33px;
  margin: 16px 8px;
  font-size: 34px;
  display: flex;
  padding: 15px 0;
  align-content: center;
  align-items: center;
  justify-content: center;
}
.bgWrapper.__mobile.result.word .wordListWrap .wordList li.x {
  padding: 15px 20px 15px 60px;
  word-break: break-all;
  text-align: left;
}
.bgWrapper.__mobile.result.word .wordListWrap .wordList li.x:before {
  width: 24px;
  height: 24px;
  top: 50%;
  margin-top: -12px;
}
.bgWrapper.__mobile.result.word .wordListWrap .wordList li._click.x:before {
  top: 29px;
}
.bgWrapper.__mobile.result.word .showWordWrap {
  border: 3px solid #c7d0d3;
  height: 1100px;
  margin-top: 60px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_img {
  max-height: 500px;
  width: 100%;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_img > img {
  width: 70%;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_text {
  width: 100%;
  align-items: center;
  margin-top: 100px;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_text .word_eng {
  font-size: 72px;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_text .word_eng .btn_sound {
  width: 116px;
  height: 116px;
  top: -12px;
  right: -130px;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_text .word_kor {
  font-size: 48px;
  margin-top: 25px;
}
.bgWrapper.__mobile.result.word .showWordWrap .word_text .word_ex {
  font-size: 48px;
  margin-top: 55px;
}
.bgWrapper.__mobile.result.survival .content {
  padding: 190px 60px 20px;
}
.bgWrapper.__mobile.result.survival .feedback {
  padding-top: 60px;
  width: 600px;
  height: 226px;
  font-size: 70px;
}
.bgWrapper.__mobile.result.survival .feedback::before, .bgWrapper.__mobile.result.survival .feedback::after {
  top: 10px;
}
.bgWrapper.__mobile.result.survival .feedback::before {
  left: 86px;
  transform: translate(-100%, -50%) scale(1.2);
  width: 218px;
  height: 142px;
  background-image: url("../images/result/deco_left_mo.png");
}
.bgWrapper.__mobile.result.survival .feedback::after {
  right: 100px;
  transform: translate(100%, -50%) scale(1.2);
  width: 231px;
  height: 148px;
  background-image: url("../images/result/deco_right_mo.png");
}
.bgWrapper.__mobile.result.survival .stair {
  flex-direction: column-reverse;
  justify-content: flex-start;
  align-items: center;
  gap: 4px;
  height: calc(100% - 222px);
}
.bgWrapper.__mobile.result.survival .stair_wrap {
  width: 450px;
}
.bgWrapper.__mobile.result.survival .stair_item {
  height: 120px;
  border-radius: 16px;
}
.bgWrapper.__mobile.result.survival .stair_item:not(:first-child) {
  display: none;
}
.bgWrapper.__mobile.result.survival .stair .average, .bgWrapper.__mobile.result.survival .stair .winner {
  top: 50%;
  left: 10px;
  transform: translate(-100%, -50%);
  padding: 32px 26px;
  min-width: 190px;
  border-width: 3px;
  font-family: "NSRoundEB", sans-serif;
  font-size: 38px;
}
.bgWrapper.__mobile.result.survival .stair .average::before, .bgWrapper.__mobile.result.survival .stair .average::after, .bgWrapper.__mobile.result.survival .stair .winner::before, .bgWrapper.__mobile.result.survival .stair .winner::after {
  top: 50%;
  left: auto;
  right: 0;
  transform: translate(100%, -50%) rotate(90deg);
}
.bgWrapper.__mobile.result.survival .stair .average::after, .bgWrapper.__mobile.result.survival .stair .winner::after {
  right: 3px;
}
.bgWrapper.__mobile.result.survival .stair .cha {
  top: -306px;
  left: 0;
  transform: scale(1.5);
  z-index: 100;
}
.bgWrapper.__mobile.result.survival .stair #cha_motion {
  top: -92px;
  transform: translate(-50%, -100%) scale(1.5);
}
.bgWrapper.__mobile.game .gameTimer {
  width: 970px;
  height: 60px;
  border-radius: 30px;
  margin: 7px auto 0;
}
.bgWrapper.__mobile.game .gameTimer:before {
  width: 82px;
  height: 101px;
  top: -25px;
  left: -15px;
}
.bgWrapper.__mobile.game .gameTimer:after {
  background-image: url("../../common/images/ic_timer_txt_mo.png");
  width: 82px;
  height: 31px;
  top: 15px;
  left: 75px;
}
.bgWrapper.__mobile.game .gameTimer .gameTimerBarWrap {
  border-radius: 30px;
}
.bgWrapper.__mobile.game .gameTimer .gameTimerBarWrap .gameTimerBar {
  border-radius: 30px;
  border: 4px solid #c35445;
}
.bgWrapper.__mobile.game .gameTitle {
  font-size: 56px;
  line-height: 144px;
}
.bgWrapper.__mobile.game .ic_timeAttack {
  background-image: url("../images/ic_timeAttack_mo.png");
  width: 286px;
  height: 104px;
}
.bgWrapper.__mobile.finGame .gameTitle {
  display: none;
}
.bgWrapper.__mobile.finGame .logo_socketGame {
  display: block;
}
.bgWrapper.__mobile.finGame .header_tit {
  background-image: url("../images/header_tit_purple_mo.png");
}
.bgWrapper.__mobile.finGame .content {
  flex-direction: column;
  width: 984px;
  height: 1992px;
  position: relative;
  padding: 70px 50px 65px;
  display: flex;
}
.bgWrapper.__mobile.finGame .content .scoreWrap {
  width: 100%;
  margin-left: 0;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .charWrap .char_balloon {
  background-image: url("../images/balloon_finGame_mo.png");
  width: 734px;
  height: 203px;
  margin: auto;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .charWrap #_c_canvas {
  transform: scale(0.95) translateY(-10px);
}
.bgWrapper.__mobile.finGame .content .scoreWrap .charWrap .character {
  height: 300px;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .charWrap .character._2 {
  background-position: 294px bottom;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .charWrap .character._4 {
  background-position: 311px bottom;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore {
  height: 226px;
  padding: 45px;
  border-radius: 20px;
  font-size: 34px;
  margin-top: 30px;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore .score_subTit {
  width: 180px;
  flex-basis: 180px;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore .correctScoreWrap {
  height: 60px;
  box-shadow: 0 5px 0 #d8d8e1 inset;
  border-radius: 30px;
  font-size: 36px;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore .correctScoreWrap .correctScore {
  border-radius: 40px;
  border: 4px solid #4a45bb;
  padding: 9px 30px;
  box-shadow: 0 -11px 0 #5a54e2 inset;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore .correctScoreWrap {
  height: 67px;
  overflow: hidden;
}
.bgWrapper.__mobile.finGame .content .scoreWrap .myScore .correctScoreWrap .correctScore {
  padding: 10px 25px;
}
.bgWrapper.__mobile.finGame .content .gameWrap {
  margin-left: 0;
  margin-top: 60px;
}
.bgWrapper.__mobile.finGame .content .gameWrap .gameCont {
  width: 888px;
  height: 1020px;
  border-radius: 26px;
}
.bgWrapper.__mobile .divider {
  width: 100%;
  height: 1px;
  border-top: 2px dashed rgba(102, 171, 188, 0.5);
  border-left: none;
}
.bgWrapper.__mobile .typeTag {
  width: 124px;
  height: 66px;
  font-size: 39px;
  border-radius: 33px;
  line-height: 66px;
}
.bgWrapper.__mobile.loading .header_tit {
  background-image: url("../images/header_tit_ylw_mo.png");
}
.bgWrapper.__mobile.loading .content {
  width: 984px;
  height: 1992px;
  padding: 80px 60px 60px;
}
.bgWrapper.__mobile.loading .cha_gameOver {
  background-image: url("../images/cha_gameOver_mo.png");
  width: 734px;
  height: 700px;
}
.bgWrapper.__mobile.loading .btn_wrap {
  flex-direction: column;
  margin-top: 40px;
}
.bgWrapper.__mobile.loading .btn_out {
  background-image: url("../images/btn_out_mo.png");
  width: 381px;
  height: 105px;
}
.bgWrapper.__mobile.loading .btn_reconnect {
  background-image: url("../images/btn_reconnect_mo.png");
  width: 381px;
  height: 105px;
  margin-left: 0;
  margin-top: 20px;
}
.bgWrapper.__mobile.game_started .content {
  width: 984px;
  height: 2108px;
  padding: 80px 60px 60px;
}
.bgWrapper.__mobile.game_started .cha_gameStarted {
  background-image: url("../images/cha_gameStarted_mo.png");
  width: 733px;
  height: 639px;
}
.bgWrapper.__mobile.game_error .content {
  width: 984px;
  height: 2108px;
  padding: 80px 60px 60px;
}
.bgWrapper.__mobile.game_error .cha_gameStarted {
  background-image: url(../images/cha_socketError.png);
  width: 520px;
  height: 671px;
  background-size: cover;
}
.bgWrapper.__mobile .popCont {
  display: block;
}
.bgWrapper.__mobile .popCont .timeAttackWrap + .comboWrap {
  margin-left: 0;
  margin-top: 50px;
}

/*# sourceMappingURL=student.css.map */