/*Add font ================================*/
/*-------------------item_detail----------------*/
#main_slide {
  margin-top: 0;
}
#main_slide .slick-track .item a {
  padding-top: 27.45%;
}

@media (max-width: 769px) {
  #container #ims-content, #container #ims-column {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}
@media (max-width: 769px) {
  #container #ims-column {
    padding: 0 15px !important;
  }
}
@media (max-width: 769px) {
  #container #ims-content {
    order: 1;
  }
}

#ims-wrapper {
  background: #F4F4F4;
}
@media (max-width: 992px) {
  #ims-wrapper {
    margin-top: 50px;
  }
}
#ims-wrapper.test {
  padding: 10px 0;
}
@media (max-width: 992px) {
  #ims-wrapper.test {
    margin-top: 0;
  }
}
#ims-wrapper.test header, #ims-wrapper.test #main_slide, #ims-wrapper.test .page_nav, #ims-wrapper.test footer {
  display: none;
}
#ims-wrapper.test #exam .this_right_answer {
  background: red;
}
#ims-wrapper.test #exam .box_content .welcome {
  display: flex;
  align-items: center;
}
#ims-wrapper.test #exam .box_content .welcome.fixed {
  position: fixed;
  background: #ffffff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  left: 0;
  top: 0;
  z-index: 9;
  padding: 10px;
}
#ims-wrapper.test #exam .box_content .welcome > .container {
  display: flex;
  align-items: center;
}
@media (max-width: 768px) {
  #ims-wrapper.test #exam .box_content .welcome > .container {
    padding: 0;
  }
}
@media (max-width: 600px) {
  #ims-wrapper.test #exam .box_content .welcome > .container {
    flex-wrap: wrap;
    justify-content: center;
  }
}
#ims-wrapper.test #exam .box_content .welcome h1 {
  text-transform: capitalize;
}
@media (max-width: 600px) {
  #ims-wrapper.test #exam .box_content .welcome h1 {
    margin-bottom: 5px;
    flex: 0 0 100%;
    font-size: 20px;
  }
}
#ims-wrapper.test #exam .box_content .welcome .countdown {
  font-weight: 600;
  color: #04457A;
  font-size: 20px;
}
@media (min-width: 601px) {
  #ims-wrapper.test #exam .box_content .welcome .countdown {
    margin-left: auto;
    font-size: 32px;
  }
}
#ims-wrapper.test #exam .box_content .welcome .end button {
  font-weight: 600;
  background: #044579;
  color: #ffffff;
  text-transform: uppercase;
  border-radius: 0;
  margin-left: 28px;
  padding: 6px 24px;
  font-size: 16px;
}
@media (min-width: 601px) {
  #ims-wrapper.test #exam .box_content .welcome .end button {
    font-size: 18px;
  }
}
@media (max-width: 768px) {
  #ims-wrapper.test #exam .box_question {
    padding: 0 0 30px;
  }
}
@media (max-width: 600px) {
  #ims-wrapper.test #exam .box_question {
    padding-bottom: 0;
  }
}

.hotline.sticky {
  display: none;
}

#BactoTop {
  display: none !important;
}

#allExam .header_title {
  font-family: "Source Sans Pro", sans-serif;
  text-align: center;
  font-weight: bold;
  color: #04457A;
  text-transform: uppercase;
  margin-bottom: 40px;
  font-size: 30px;
}
@media (min-width: 480px) {
  #allExam .header_title {
    font-size: 42px;
  }
}
#allExam .header_title span {
  color: #FF960B;
}
#allExam .list_item {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media (max-width: 600px) {
  #allExam .list_item {
    justify-content: center;
  }
}
#allExam .list_item .item {
  font-weight: 600;
  background: #ffffff;
  border-radius: 50px;
  margin-bottom: 40px;
  padding: 11px;
  display: flex;
  align-items: center;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.15);
  transition: 0.3s all;
  position: relative;
  flex: 0 0 calc(100% - 20px);
}
@media (min-width: 601px) {
  #allExam .list_item .item {
    margin-right: 20px;
    flex: 0 0 calc(50% - 22px);
  }
}
@media (min-width: 993px) {
  #allExam .list_item .item {
    flex: 0 0 calc(33.3333333333% - 14px);
  }
  #allExam .list_item .item:nth-child(3n) {
    margin-right: 0;
  }
}
#allExam .list_item .item:last-child {
  margin-right: 0;
}
#allExam .list_item .item:hover {
  background: #FF960B;
  cursor: pointer;
  transition: 0.3s all;
}
#allExam .list_item .item:hover h3 {
  color: #ffffff;
}
#allExam .list_item .item:hover span {
  background: #ffffff;
  color: #FF960B;
}
#allExam .list_item .item .free {
  position: absolute;
  left: 85%;
  top: -20%;
  width: 63px;
}
#allExam .list_item .item span {
  font-family: "MyriadPro-Bold";
  flex: 0 0 55px;
  width: 55px;
  height: 55px;
  line-height: 60px;
  text-align: center;
  font-size: 28px;
  background: #04457A;
  border-radius: 50%;
  color: #ffffff;
  margin-right: 20px;
  transition: 0.3s all;
}
#allExam .list_item .item h3 {
  font-family: "MyriadPro-Semibold";
  transition: 0.3s all;
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  color: #000000;
}
#allExam .list_item .item h3 i {
  font-style: normal;
  display: block;
  text-transform: initial;
  line-height: 1;
}

#listExam {
  border-radius: 15px;
  overflow: hidden;
  padding: 27px;
}
@media (max-width: 769px) {
  #listExam {
    background-size: cover !important;
    background-position: center !important;
    margin-bottom: 20px;
  }
}
#listExam .header_title {
  text-align: center;
  color: #ffffff;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 20px;
  font-size: 23px;
}
#listExam .list_item {
  text-align: center;
}
#listExam .list_item h3 {
  font-weight: 600;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.85);
  margin-bottom: 15px;
  padding: 12px;
  border-radius: 15px;
  transition: 0.3s all;
  cursor: pointer;
  font-size: 20px;
}
@media (min-width: 992px) {
  #listExam .list_item h3 {
    font-size: 23px;
  }
}
#listExam .list_item h3:last-child {
  margin-bottom: 0;
}
#listExam .list_item h3:hover, #listExam .list_item h3.active {
  background: #04457A;
  color: #ffffff;
  transition: 0.3s all;
}
#listExam .list_item > a {
  font-family: "Source Sans Pro";
  font-weight: 300;
  font-size: 18px;
  text-decoration: underline;
}

.main_content {
  margin-top: 60px;
}
@media (min-width: 769px) {
  .main_content {
    width: 100vw;
    margin-left: calc(-50vw + 72%);
  }
}
.main_content .content {
  background: #ffffff;
  border-radius: 15px;
  font-size: 16px;
  color: #000000;
  padding: 20px;
}
@media (min-width: 769px) {
  .main_content .content {
    padding: 40px;
  }
}
.main_content .content h2.title {
  font-weight: 600;
  font-size: 23px;
  color: #FF960B;
  margin-bottom: 40px;
}

.full.exam-buy {
  padding: 0 0 15px 0;
}

#detail .box {
  display: flex;
  margin-left: 10%;
  margin-right: 5%;
  align-items: center;
}
#detail .box .info_left {
  flex: 0 0 45%;
}
#detail .box .info_left .title {
  font-weight: 600;
  font-size: 36px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
#detail .box .info_left .title span {
  display: block;
}
#detail .box .info_left .time, #detail .box .info_left .curriculum, #detail .box .info_left .register {
  font-weight: 300;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  font-size: 18px;
}
#detail .box .info_left .time span, #detail .box .info_left .curriculum span, #detail .box .info_left .register span {
  margin-right: 10px;
  font-size: 25px;
  color: #04457A;
}
#detail .box .info_right {
  flex: 0 0 55%;
  background: #ffffff;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  padding: 35px 39px;
  border-radius: 15px;
  position: relative;
}
#detail .box .info_right .info_price {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-right: -10px;
}
#detail .box .info_right .info_price .discount {
  position: absolute;
  font-weight: bold;
  font-size: 25px;
  background: #FF960B;
  color: #ffffff;
  font-weight: bold;
  top: 0;
  left: 35px;
  padding: 18px 7px 23px;
}
#detail .box .info_right .info_price .discount:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  border-bottom: 12px solid #ffffff;
  border-left: 32px solid transparent;
  border-right: 32px solid transparent;
}
#detail .box .info_right .info_price .price {
  font-weight: 400;
  color: #383838;
  font-size: 30px;
  text-decoration: line-through;
  line-height: 1.3;
}
#detail .box .info_right .info_price .price sup {
  font-size: 60%;
}
#detail .box .info_right .info_price .price_buy {
  font-weight: bold;
  color: #04457A;
  font-size: 50px;
  line-height: 1;
  margin-left: 20px;
}
#detail .box .info_right .info_price .price_buy sup {
  font-size: 60%;
  right: 10px;
}
#detail .box .info_right .add_cart .btn_add_cart_now {
  display: block;
  width: 100%;
  height: 60px;
  font-weight: 300;
  font-size: 25px;
  background: transparent;
  border-radius: 10px;
  border: 2px solid #04457A;
  margin-bottom: 20px;
  margin-top: 35px;
  color: #04457A;
  transition: 0.3s all;
}
#detail .box .info_right .add_cart .btn_add_cart_now:hover {
  transition: 0.3s all;
  transform: translateY(-5px);
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.15);
  color: #FF960B;
  border: 2px solid #FF960B;
}
#detail .box .info_right .add_cart .btn_add_cart {
  display: block;
  width: 100%;
  height: 60px;
  font-weight: 300;
  font-size: 25px;
  background: transparent;
  border-radius: 10px;
  border: 2px solid #04457A;
  margin-bottom: 5px;
  background: #04457A;
  color: #ffffff;
  transition: 0.3s all;
}
#detail .box .info_right .add_cart .btn_add_cart:hover {
  transition: 0.3s all;
  transform: translateY(-5px);
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
  border: 2px solid #FF960B;
  background: #FF960B;
}

.full.exam.detail {
  background: var(--bg-exam) center center no-repeat;
  background-size: cover;
  padding: 0;
}
.full.exam.detail #container {
  display: flex;
  align-items: center;
}
@media (max-width: 425px) {
  .full.exam.detail #container {
    padding: 0 5px;
  }
}

#exam {
  flex: 0 0 100%;
  height: 100%;
  position: relative;
}
#exam #create_audio_here audio {
  margin: 10px auto;
}
@media (min-width: 601px) {
  #exam #create_audio_here audio {
    margin: 30px auto;
  }
}
#exam #create_audio_here audio::-webkit-media-controls-play-button {
  pointer-events: none;
}
#exam #create_audio_here audio::-webkit-media-controls-time-remaining-display {
  display: none;
}
#exam #create_audio_here audio::-webkit-media-controls-timeline {
  pointer-events: none;
  background-color: #00c1c0;
  color: #00c1c0;
}
#exam .box_content {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#exam .box_content ::-webkit-scrollbar {
  width: 10px;
}
#exam .box_content ::-webkit-scrollbar-track {
  background: #ffffff;
}
#exam .box_content ::-webkit-scrollbar-thumb {
  background: #ADADAD;
  border: 1.5px solid #ffffff;
}
#exam .box_content .welcome {
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
}
@media (min-width: 993px) {
  #exam .box_content .welcome {
    margin-bottom: 49px;
  }
}
#exam .box_content .welcome h1 {
  font-weight: 600;
  color: #383838;
  text-transform: uppercase;
  font-size: 24px;
}
@media (min-width: 601px) {
  #exam .box_content .welcome h1 {
    font-size: 30px;
  }
}
@media (min-width: 1025px) {
  #exam .box_content .welcome h1 {
    font-size: 34px;
  }
}
#exam .box_content .welcome .time {
  font-weight: 300;
  color: #383838;
  padding: 7px 0 19px;
  font-size: 22px;
}
@media (min-width: 601px) {
  #exam .box_content .welcome .time {
    font-size: 30px;
  }
}
@media (min-width: 1025px) {
  #exam .box_content .welcome .time {
    font-size: 34px;
  }
}
#exam .box_content .welcome .time p {
  font-weight: 500;
}
#exam .box_content .welcome .time ul {
  display: inline-block;
  text-align: left;
  font-size: 18px;
}
@media (min-width: 601px) {
  #exam .box_content .welcome .time ul {
    font-size: 20px;
  }
}
@media (min-width: 1025px) {
  #exam .box_content .welcome .time ul {
    font-size: 24px;
  }
}
#exam .box_content .welcome .time ul li {
  color: #000000;
}
#exam .box_content .welcome .time ul li::marker {
  color: #ff960b;
}
#exam .box_content .col_l {
  background: #ffffff;
  background-size: 100% 100%;
  height: 100%;
  justify-content: center;
  position: relative;
  z-index: 1;
  flex: 0 0 100%;
  max-width: 100%;
  border-radius: 5px;
  padding: 5px;
}
@media (min-width: 451px) {
  #exam .box_content .col_l {
    padding: 10px;
    border-radius: 15px;
  }
}
@media (min-width: 601px) {
  #exam .box_content .col_l {
    padding: 20px;
  }
}
@media (min-width: 993px) {
  #exam .box_content .col_l {
    flex: 0 0 67.5%;
    max-width: 67.5%;
    padding: 32px 25px;
  }
}
#exam .box_content .col_l .listAll .tabpart {
  display: none;
}
#exam .box_content .col_l .listAll .tabpart.active {
  display: block;
}
#exam .box_content .col_l .listAll .tabpart.active.hide {
  display: none;
}
#exam .box_content .col_l .listAll .tabpart .question_inner {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0;
}
#exam .box_content .col_l .listAll .tabpart .question_inner.show {
  display: block;
}
#exam .box_content .col_l .inner {
  text-align: center;
  overflow: hidden;
}
#exam .box_content .col_l .inner ul.list_part {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin: 0 -5px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner ul.list_part {
    font-size: 18px;
    justify-content: space-between;
  }
}
#exam .box_content .col_l .inner ul.list_part li {
  background: #E2E2E2;
  padding: 4px 0;
  flex: 0 0 calc(33.3333333333% - 10px);
  margin: 5px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner ul.list_part li {
    flex: 0 0 calc(14.2857142857% - 10px);
    margin: 0;
  }
}
#exam .box_content .col_l .inner ul.list_part li.active {
  background: #FF960B;
  color: #ffffff;
  padding: 6px 0 2px;
  font-weight: 600;
}
#exam .box_content .col_l .inner .box_around {
  margin-top: 30px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner .box_around {
    margin-top: 66px;
    padding: 0 22px;
  }
}
#exam .box_content .col_l .inner .box_around .part.cur {
  box-shadow: 0 0 5px rgba(255, 150, 11, 0.75);
}
#exam .box_content .col_l .inner .box_around .step {
  display: flex;
  align-items: center;
  text-align: left;
  margin-bottom: 74px;
}
@media (max-width: 768px) {
  #exam .box_content .col_l .inner .box_around .step {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 25px;
  }
}
#exam .box_content .col_l .inner .box_around .step:last-child {
  margin-bottom: 0;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner .box_around .step:nth-child(2n) .img {
    order: 1;
    margin-right: 0;
    margin-left: 31px;
  }
  #exam .box_content .col_l .inner .box_around .step:nth-child(2n) .content {
    order: 0;
  }
}
#exam .box_content .col_l .inner .box_around .step .title {
  font-family: "MyriadPro-Semibold";
  color: #383838;
  font-size: 20px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner .box_around .step .title {
    font-size: 25px;
  }
}
#exam .box_content .col_l .inner .box_around .step .img {
  margin-bottom: 20px;
  flex: 0 0 180px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner .box_around .step .img {
    flex: 0 0 230px;
    margin-right: 35px;
    margin-bottom: 0;
  }
}
@media (max-width: 768px) {
  #exam .box_content .col_l .inner .box_around .step .content {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
#exam .box_content .col_l .inner .box_around .step .content ul {
  list-style: none;
  font-weight: 300;
  color: #383838;
  padding: 0;
  font-size: 16px;
}
@media (min-width: 769px) {
  #exam .box_content .col_l .inner .box_around .step .content ul {
    font-size: 18px;
  }
}
#exam .box_content .col_l .inner .box_around .step .content ul li {
  line-height: 2;
  position: relative;
  padding-left: 1.2rem;
}
#exam .box_content .col_l .inner .box_around .step .content ul li:after {
  content: "";
  position: absolute;
  background: #FF960B;
  width: 7px;
  height: 7px;
  left: 0;
  top: 15px;
  border-radius: 50%;
}
#exam .box_content .col_l .intro {
  font: 400 29px/1 "Baloo 2", cursive;
  text-transform: uppercase;
  color: #fff;
  background: url("../../../../../resources/images/btn-intro.png") center center no-repeat;
  background-size: 100% 100%;
  display: inline-block;
  padding: 0.5rem 1.9em;
}
@media (min-width: 1200px) {
  #exam .box_content .col_l .intro {
    font-size: 29px;
    padding: 1rem 2.9em;
  }
}
#exam .box_content .col_l h1 {
  font: 700 30px/1 "Baloo 2", cursive;
  color: #00164A;
  padding: 10px 0;
}
@media (min-width: 768px) {
  #exam .box_content .col_l h1 {
    padding: 20px 0;
  }
}
@media (min-width: 1200px) {
  #exam .box_content .col_l h1 {
    font-size: 60px;
    padding: 3rem 0;
  }
}
#exam .box_content .col_l .note {
  font: 400 18px/150% "Baloo 2", cursive;
  color: #00164A;
}
@media (min-width: 1200px) {
  #exam .box_content .col_l .note {
    font-size: 25px;
  }
}
#exam .box_content .col_l .info {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px;
  margin: 0 -7px;
}
@media (min-width: 992px) {
  #exam .box_content .col_l .info {
    padding: 30px 15px;
  }
}
@media (min-width: 1200px) {
  #exam .box_content .col_l .info {
    padding: 3rem 0;
  }
}
#exam .box_content .col_l .info .btn {
  font: 700 16px/150% "Baloo 2", cursive;
  text-align: center;
  color: #00164A;
  background: rgba(255, 255, 255, 0.8);
  border: 0;
  border-radius: 50px;
  box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.16);
  width: 100%;
  padding: 10px;
  margin: 0 7px;
}
@media (min-width: 1200px) {
  #exam .box_content .col_l .info .btn {
    font-size: 30px;
    padding: 1.1rem 1rem;
  }
}
.listApp {
  display: block;
  text-align: left;
  color: #ff980f;
  margin-bottom: 10px;
}
@media (min-width: 993px) {
  .listApp {
    display: none;
  }
}
.listApp .material-icons {
  font-size: 30px;
}

.col_r {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow-y: auto;
  margin: -5px 0;
  display: none;
  border-radius: 0;
  background: #F4F4F4;
  max-width: 95%;
}
@media (min-width: 401) {
  .col_r {
    max-width: 85%;
  }
}
@media (min-width: 601px) {
  .col_r {
    max-width: 50%;
  }
}
@media (min-width: 993px) {
  .col_r {
    flex: 0 0 31%;
    max-width: 31%;
    display: block;
    background: transparent;
  }
}
.col_r .group_part {
  padding: 10px;
  padding-top: 40px;
  margin-top: 10px;
}
@media (min-width: 993px) {
  .col_r .group_part {
    padding: 5px;
    padding-top: 40px;
    padding-right: 15px;
    margin-top: 5px;
  }
}
.col_r .group_part .colpart {
  background: #ffffff;
  border-radius: 15px;
  margin-bottom: 10px;
  padding: 19.5px 20px 25px 28px;
}
.col_r .group_part .colpart.part-one {
  position: relative;
  border-radius: 0 0 15px 15px;
}
.col_r .group_part .colpart.part-one:before {
  content: "Listening test";
  font-weight: 600;
  position: absolute;
  bottom: 100%;
  width: 100%;
  left: 0;
  color: #ffffff;
  background: #FF960B;
  font-size: 18px;
  text-transform: uppercase;
  line-height: 40px;
  padding-left: 28px;
}
.col_r .group_part .colpart.part-five {
  position: relative;
  border-radius: 0 0 15px 15px;
  margin-top: 60px;
  float: left;
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-five {
    float: unset;
  }
}
.col_r .group_part .colpart.part-five:before {
  content: "Reading test";
  font-weight: 600;
  position: absolute;
  bottom: 100%;
  width: 100%;
  left: 0;
  color: #ffffff;
  background: #FF960B;
  font-size: 18px;
  text-transform: uppercase;
  line-height: 40px;
  padding-left: 28px;
}
.col_r .group_part .colpart.part-three, .col_r .group_part .colpart.part-four {
  float: left;
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-three, .col_r .group_part .colpart.part-four {
    float: unset;
  }
}
.col_r .group_part .colpart.part-three .list_qae, .col_r .group_part .colpart.part-four .list_qae {
  display: unset;
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-three .list_qae, .col_r .group_part .colpart.part-four .list_qae {
    display: flex;
  }
}
.col_r .group_part .colpart.part-three .list_qae .item, .col_r .group_part .colpart.part-four .list_qae .item {
  border: 0;
  margin-right: 0;
  display: unset;
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-three .list_qae .item, .col_r .group_part .colpart.part-four .list_qae .item {
    flex: 0 0 50%;
    display: flex;
    flex-wrap: wrap;
  }
}
.col_r .group_part .colpart.part-three .list_qae .item:after, .col_r .group_part .colpart.part-four .list_qae .item:after {
  display: none;
}
.col_r .group_part .colpart.part-three .list_qae .item.active .qae:after, .col_r .group_part .colpart.part-four .list_qae .item.active .qae:after {
  content: "\f00c";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
  font-size: 26px;
  position: absolute;
  color: #044579;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-shadow: 0px 0px 2px #000000;
}
.col_r .group_part .colpart.part-three .list_qae .item.view, .col_r .group_part .colpart.part-four .list_qae .item.view {
  background: transparent;
}
.col_r .group_part .colpart.part-three .list_qae .item .qae, .col_r .group_part .colpart.part-four .list_qae .item .qae {
  text-align: center;
  border: 1px solid #383838;
  line-height: 42.66px;
  position: relative;
  float: left;
  margin-right: 6px;
  margin-bottom: 6px;
  width: calc(16.6666666667% - 6px);
}
@media (min-width: 993px) {
  .col_r .group_part .colpart.part-three .list_qae .item .qae, .col_r .group_part .colpart.part-four .list_qae .item .qae {
    width: calc(25% - 6px);
    font-size: 20px;
  }
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-three .list_qae .item .qae, .col_r .group_part .colpart.part-four .list_qae .item .qae {
    flex: 0 0 calc(33.3333333333% - 6px);
    width: auto;
    float: unset;
  }
}
@media (min-width: 1400px) {
  .col_r .group_part .colpart.part-three .list_qae .item .qae, .col_r .group_part .colpart.part-four .list_qae .item .qae {
    font-size: 21.58px;
  }
}
.col_r .group_part .colpart.part-three .list_qae .item .qae.selected, .col_r .group_part .colpart.part-four .list_qae .item .qae.selected {
  background: #ff960b;
  color: #ffffff;
}
.col_r .group_part .colpart.part-six, .col_r .group_part .colpart.part-sev {
  float: left;
}
.col_r .group_part .colpart.part-six .list_qae, .col_r .group_part .colpart.part-sev .list_qae {
  display: unset;
}
.col_r .group_part .colpart.part-six .list_qae .item, .col_r .group_part .colpart.part-sev .list_qae .item {
  display: unset;
  border: 0;
  margin-right: 0;
}
.col_r .group_part .colpart.part-six .list_qae .item:after, .col_r .group_part .colpart.part-sev .list_qae .item:after {
  display: none;
}
.col_r .group_part .colpart.part-six .list_qae .item.active .qae, .col_r .group_part .colpart.part-sev .list_qae .item.active .qae {
  position: relative;
}
.col_r .group_part .colpart.part-six .list_qae .item.active .qae:after, .col_r .group_part .colpart.part-sev .list_qae .item.active .qae:after {
  content: "\f00c";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
  font-size: 26px;
  position: absolute;
  color: #044579;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-shadow: 0px 0px 2px #000000;
}
.col_r .group_part .colpart.part-six .list_qae .item.view, .col_r .group_part .colpart.part-sev .list_qae .item.view {
  background: transparent;
}
.col_r .group_part .colpart.part-six .list_qae .item .qae, .col_r .group_part .colpart.part-sev .list_qae .item .qae {
  float: left;
  margin-right: 6px;
  margin-bottom: 6px;
  text-align: center;
  border: 1px solid #383838;
  line-height: 42.66px;
  width: calc(16.6666666667% - 6px);
}
@media (min-width: 993px) {
  .col_r .group_part .colpart.part-six .list_qae .item .qae, .col_r .group_part .colpart.part-sev .list_qae .item .qae {
    width: calc(25% - 6px);
    font-size: 20px;
  }
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart.part-six .list_qae .item .qae, .col_r .group_part .colpart.part-sev .list_qae .item .qae {
    width: calc(16.6666666667% - 6px);
  }
}
@media (min-width: 1400px) {
  .col_r .group_part .colpart.part-six .list_qae .item .qae, .col_r .group_part .colpart.part-sev .list_qae .item .qae {
    font-size: 21.58px;
  }
}
.col_r .group_part .colpart.part-six .list_qae .item .qae.selected, .col_r .group_part .colpart.part-sev .list_qae .item .qae.selected {
  background: #ff960b;
  color: #ffffff;
}
.col_r .group_part .colpart:last-child {
  margin-bottom: 0;
}
.col_r .group_part .colpart.active {
  box-shadow: 0 0 5px 2px rgb(255, 150, 11);
}
.col_r .group_part .colpart .title {
  font-size: 18px;
  font-weight: 600;
  color: #383838;
  margin-bottom: 20px;
}
.col_r .group_part .colpart .list_qae {
  display: flex;
  flex-wrap: wrap;
}
.col_r .group_part .colpart .list_qae .item {
  text-align: center;
  border: 1px solid #383838;
  line-height: 42.66px;
  margin-bottom: 6px;
  margin-right: 6px;
  flex: 0 0 calc(16.6666666667% - 6px);
}
@media (min-width: 993px) {
  .col_r .group_part .colpart .list_qae .item {
    flex: 0 0 calc(25% - 6px);
    font-size: 20px;
  }
}
@media (min-width: 1025px) {
  .col_r .group_part .colpart .list_qae .item {
    flex: 0 0 calc(16.6666666667% - 6px);
  }
}
@media (min-width: 1400px) {
  .col_r .group_part .colpart .list_qae .item {
    font-size: 21.58px;
  }
}
.col_r .group_part .colpart .list_qae .item.view {
  background: #ffeed7;
}
.col_r .group_part .colpart .list_qae .item.view .qae {
  background: #ffeed7;
}
.col_r .group_part .colpart .list_qae .item.active {
  position: relative;
}
.col_r .group_part .colpart .list_qae .item.active:after {
  content: "\f00c";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
  font-size: 30px;
  position: absolute;
  color: #0073cf;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-shadow: 0px 0px 2px #000000;
}
.col_r .group_part .colpart .list_qae .item.selected {
  background: rgb(255, 150, 11);
  color: #ffffff;
}
.col_r .group_part .colpart .list_qae .item.exam {
  position: absolute;
  opacity: 0;
  width: calc(16.6666666667% - 14px);
  visibility: hidden;
}
.col_r .fancybox-close-small {
  display: block;
  background: #ffffff;
  opacity: 1;
  top: 15px;
}

.group_btn {
  display: flex;
  justify-content: flex-end;
}

#clickprev, #prevItem {
  text-align: right;
  display: none;
  cursor: pointer;
  margin-left: 10px;
}
#clickprev span, #prevItem span {
  display: inline-block;
  margin: auto;
  background: #ff960b;
  color: white;
  padding: 5px 15px;
  border-radius: 5px;
}
@media (min-width: 601px) {
  #clickprev span, #prevItem span {
    font-size: 18px;
  }
}
#clickprev span i, #prevItem span i {
  font-weight: 500;
  font-size: 16px;
  margin-top: 4px;
}

#clickme, #clickview {
  text-align: right;
  display: none;
  cursor: pointer;
  margin-left: 10px;
}
#clickme span, #clickview span {
  display: inline-block;
  margin: auto;
  background: #ff960b;
  color: white;
  padding: 5px 15px;
  border-radius: 5px;
}
@media (min-width: 601px) {
  #clickme span, #clickview span {
    font-size: 18px;
  }
}
#clickme span i, #clickview span i {
  font-weight: 500;
  font-size: 16px;
  margin-top: 4px;
}

#start_exam {
  text-align: center;
  display: none;
  cursor: pointer;
}
#start_exam span {
  display: inline-block;
  margin: auto;
  background: #ff960b;
  color: white;
  padding: 5px 15px;
  border-radius: 5px;
  font-size: 18px;
}
#start_exam span i {
  font-weight: 500;
  font-size: 16px;
  margin-top: 4px;
}

.btn-exam {
  color: #fff;
  background: #FF960B;
  background-size: contain;
  width: 100%;
  max-width: 190px;
  font-weight: 600;
  padding: 5px 0;
  box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.1);
  border-radius: 0;
}
@media (min-width: 768px) {
  .btn-exam {
    font-size: 20px;
  }
}

.swal2-container .swal2-popup {
  padding: 30px 1.25rem !important;
}
.swal2-container #swal2-content h3 {
  font-weight: bold;
  font-size: 18px;
}
@media (max-width: 768px) {
  .swal2-container .swal2-title {
    font-size: 24px;
  }
}
@media (max-width: 450px) {
  .swal2-container .swal2-title {
    font-size: 22px;
  }
}
@media (max-width: 600px) {
  .swal2-container .swal2-actions {
    margin: 0 auto 0;
  }
}
.swal2-container .swal2-footer {
  border-top: 0;
}
.swal2-container .swal2-styled.swal2-custom,
.swal2-container .swal2-styled.swal2-confirm {
  font-weight: 600;
  color: #fff;
  background-color: #04457A !important;
  border-radius: 50px;
  background-size: 100% 100% !important;
  box-shadow: none;
  font-size: 16px;
  padding: 7px 10px;
  min-width: 120px;
  min-height: 40px;
}
@media (min-width: 451px) {
  .swal2-container .swal2-styled.swal2-custom,
  .swal2-container .swal2-styled.swal2-confirm {
    font-size: 18px;
    padding: 0.625em 1.1em;
    min-width: 170px;
  }
}
.swal2-container .swal2-styled.swal2-custom:focus,
.swal2-container .swal2-styled.swal2-confirm:focus {
  box-shadow: none;
  outline: 0;
}
@media (min-width: 769px) {
  .swal2-container .swal2-styled.swal2-custom,
  .swal2-container .swal2-styled.swal2-confirm {
    font-size: 22px;
  }
}
.swal2-container .swal2-styled.swal2-cancel {
  background: url("../../../../../resources/images/close.png") center center no-repeat !important;
  background-size: contain !important;
  width: 40px;
  height: 30px;
  position: absolute;
  top: -5%;
  right: -3%;
}
.swal2-container .swal2-styled.swal2-cancel:focus {
  box-shadow: none;
  outline: 0;
}

.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation {
  background: rgba(0, 0, 0, 0.7) !important;
}

.box_question {
  width: 100%;
  height: 100%;
  padding: 2rem;
  padding-top: 0;
  padding-right: 10px;
  margin-top: 10px;
}
@media (min-width: 601px) {
  .box_question {
    margin-top: 2rem;
  }
}
.box_question::-webkit-scrollbar {
  width: 5px;
  background-color: transparent;
  border-radius: 5px;
}
.box_question::-webkit-scrollbar-thumb {
  background-color: #F5F5F5;
  border-radius: 5px;
}
.box_question::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
  background-color: transparent;
  border-radius: 5px;
}
.box_question .box_question-header {
  font: 400 18px/150% "BerlinSansFB";
  text-align: center;
  color: #000;
  background: #fff;
  border: 3px solid #18EFED;
  border-radius: 50px;
  padding: 20px;
  margin-bottom: 30px;
}
@media (min-width: 992px) {
  .box_question .box_question-header {
    font-size: 29px;
  }
}
.box_question .box_question-content {
  color: #00164A;
}
.box_question .btn_sub {
  height: 0;
  opacity: 0;
  visibility: hidden;
}

.multichoice .img-descript .img {
  max-width: 500px;
  padding-bottom: 20px;
  margin: auto;
}
.multichoice .img-descript .img img {
  border: 5px solid #fff;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
  margin: auto;
}
.multichoice .img-descript .descript {
  font: 400 20px/150% "Baloo 2", cursive;
  text-align: justify;
  color: #00164A;
  padding-bottom: 20px;
}
.multichoice .img-descript .descript p {
  padding: 5px 0;
}
.multichoice .question_inner {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0 20px;
  display: none;
}
@media (min-width: 992px) {
  .multichoice .question_inner {
    margin-bottom: 20px;
    flex: 0 0 50%;
    max-width: 50%;
    padding: 0 40px;
  }
}
.multichoice .question_inner.text {
  flex: 0 0 100%;
  max-width: 100%;
}
.multichoice .question_inner.has-pic.active {
  display: flex;
}
.multichoice .question_inner.has-pic {
  flex: 0 0 100%;
  max-width: 100%;
  flex-wrap: wrap;
}
.multichoice .question_inner.has-pic .question_index {
  flex: 0 0 100%;
  max-width: 100%;
}
.multichoice .question_inner.has-pic .img {
  margin-bottom: 8px;
}
@media (min-width: 992px) {
  .multichoice .question_inner.has-pic .img {
    margin-bottom: 15px;
    flex: 1 1 auto;
  }
}
.multichoice .question_inner.has-pic .list_item {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 992px) {
  .multichoice .question_inner.has-pic .list_item .item {
    text-align: left;
    flex: 0 0 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
  }
  .multichoice .question_inner.has-pic .list_item .item + .item {
    margin-top: 10px;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_image {
    margin: 0 15px;
    order: 2;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check {
    order: 1;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio {
    display: none;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio-label {
    font: 700 20px/150% "Baloo 2", cursive;
    color: #00164A;
    padding-left: 40px;
    padding-right: unset;
    position: relative;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio-label:before, .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio-label:after {
    content: "";
    position: absolute;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio-label:before {
    border: 2px solid #00164A;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    top: 0;
    left: 0;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check .answer-radio-label:after {
    background: url("../../../../../resources/images/checked.png") center center no-repeat;
    background-size: contain;
    width: 34px;
    height: 22px;
    top: 0;
    left: 8px;
    opacity: 0;
    transition: 300ms ease-in-out;
  }
  .multichoice .question_inner.has-pic .list_item .item .box_check input:checked + label:after {
    opacity: 1;
  }
}
.multichoice .question_inner.active {
  display: block;
}
.multichoice .question_inner.active.hide {
  display: none;
}
.multichoice .question_inner.active.show {
  display: block;
}
.multichoice .question_inner.show {
  display: block;
}
.multichoice .question_inner .destitlewrap {
  width: 100%;
}
.multichoice .question_inner .destitlewrap img {
  width: auto;
  max-height: 300px;
}
.multichoice .question_inner .short, .multichoice .question_inner .note_exam, .multichoice .question_inner .title {
  text-align: left;
  margin-bottom: 1rem;
  font-size: 13px;
}
@media (min-width: 380px) {
  .multichoice .question_inner .short, .multichoice .question_inner .note_exam, .multichoice .question_inner .title {
    font-size: 15px;
  }
}
@media (min-width: 601px) {
  .multichoice .question_inner .short, .multichoice .question_inner .note_exam, .multichoice .question_inner .title {
    font-size: 16px;
  }
}
.multichoice .question_inner .short table, .multichoice .question_inner .note_exam table, .multichoice .question_inner .title table {
  width: 100% !important;
  table-layout: auto;
}
@media (max-width: 450px) {
  .multichoice .question_inner .short table, .multichoice .question_inner .note_exam table, .multichoice .question_inner .title table {
    zoom: 0.9;
  }
}
@media (max-width: 320px) {
  .multichoice .question_inner .short table, .multichoice .question_inner .note_exam table, .multichoice .question_inner .title table {
    zoom: 0.8;
  }
}
.multichoice .question_inner .short table td, .multichoice .question_inner .note_exam table td, .multichoice .question_inner .title table td {
  width: auto !important;
  padding: 3px;
}
.multichoice .question_inner .title {
  font-weight: bold;
  font-size: 16px;
}
@media (min-width: 451px) {
  .multichoice .question_inner .title {
    font-size: 18px;
  }
}
@media (min-width: 601px) {
  .multichoice .question_inner .title {
    font-size: 20px;
  }
}
.multichoice .question_inner .itemvideo {
  margin-bottom: 2rem;
}
.multichoice .question_inner .itemvideo:last-child {
  margin-bottom: 0;
}
.multichoice .question_inner .question_index {
  font-weight: 600;
  text-align: left;
  color: #383838;
  margin-bottom: 5px;
  font-size: 16px;
}
@media (min-width: 401px) {
  .multichoice .question_inner .question_index {
    font-size: 18px;
  }
}
@media (min-width: 992px) {
  .multichoice .question_inner .question_index {
    font-size: 20px;
  }
}
.multichoice .question_inner .list_item {
  display: flex;
  flex-wrap: wrap;
}
.multichoice .question_inner .list_item .item {
  text-align: center;
  flex: 1 1;
}
.multichoice .question_inner .list_item .item:first-child {
  margin-top: 0;
}
.multichoice .question_inner .list_item .item.text {
  text-align: left;
  flex: 0 0 100%;
  max-width: 100%;
  margin-top: 10px;
}
.multichoice .question_inner .list_item .item label {
  margin-bottom: 0;
}
.multichoice .question_inner .list_item .item .box_image {
  width: 100%;
  max-width: 129px;
  max-height: 129px;
  margin: auto;
  margin-bottom: 15px;
}
.multichoice .question_inner .list_item .item .box_image .image {
  border: 1px solid #4A5843;
  width: 100%;
  padding-top: 100%;
  position: relative;
}
.multichoice .question_inner .list_item .item .box_image .image img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.multichoice .question_inner .list_item .item .box_check .answer-radio {
  display: none;
}
.multichoice .question_inner .list_item .item .box_check .answer-radio-label {
  font: 700 20px/150% "Baloo 2", cursive;
  color: #00164A;
  padding-right: 40px;
  position: relative;
}
.multichoice .question_inner .list_item .item .box_check .answer-radio-label:before, .multichoice .question_inner .list_item .item .box_check .answer-radio-label:after {
  content: "";
  position: absolute;
}
.multichoice .question_inner .list_item .item .box_check .answer-radio-label:before {
  border: 2px solid #00164A;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  top: 0;
  right: 0;
}
.multichoice .question_inner .list_item .item .box_check .answer-radio-label:after {
  background: url("../../../../../resources/images/checked.png") center center no-repeat;
  background-size: contain;
  width: 34px;
  height: 22px;
  top: 0;
  right: -8px;
  opacity: 0;
  transition: 300ms ease-in-out;
}
.multichoice .question_inner .list_item .item .box_check input:checked + label:after {
  opacity: 1;
}
.multichoice .question_inner .list_item .item .box_text .answer-radio {
  display: none;
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label {
  color: #383838;
  cursor: pointer;
  font-size: 14px;
}
@media (min-width: 401px) {
  .multichoice .question_inner .list_item .item .box_text .answer-radio-label {
    font-size: 16px;
  }
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option {
  display: inline-flex;
  position: relative;
  min-width: 27px;
}
@media (min-width: 401px) {
  .multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option {
    min-width: 31px;
  }
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option:after, .multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option:before {
  content: "";
  position: absolute;
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option span {
  text-align: center;
  display: inline-block;
  position: relative;
  font-weight: 600;
  margin-right: 5px;
  font-size: 18px;
  min-width: 27px;
  margin-top: -3px;
}
@media (min-width: 401px) {
  .multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option span {
    min-width: 31px;
    font-size: 20px;
  }
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option:before {
  border: 2px solid #383838;
  border-radius: 50%;
  left: 0;
  width: 27px;
  height: 27px;
  top: -3px;
}
@media (min-width: 401px) {
  .multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option:before {
    width: 31px;
    height: 31px;
  }
}
.multichoice .question_inner .list_item .item .box_text .answer-radio-label span.option:after {
  background: url("../../../../../resources/images/checked.png") center center no-repeat;
  background-size: contain;
  width: 34px;
  height: 22px;
  top: 50%;
  transform: translateY(-50%);
  right: 100%;
  opacity: 0;
  transition: 300ms ease-in-out;
}
.multichoice .question_inner .list_item .item .box_text input:checked + label span {
  z-index: 99;
  position: relative;
}
.multichoice .question_inner .list_item .item .box_text input:checked + label span.option:before {
  background: #FF960B;
  border: 2px solid #FF960B;
  opacity: 1;
}
.multichoice .question_inner .list_item .item .box_text input:checked + label span.option span {
  color: #ffffff;
}

.gapfill_with_answer {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.gapfill_with_answer .box_l, .gapfill_with_answer .box_r {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0 15px;
}
@media (min-width: 992px) {
  .gapfill_with_answer .box_l, .gapfill_with_answer .box_r {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
.gapfill_with_answer .img-descript {
  display: block;
}
.gapfill_with_answer .img-descript .img {
  max-width: 500px;
  padding-bottom: 20px;
  margin: auto;
}
.gapfill_with_answer .img-descript .img img {
  border: 5px solid #fff;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
  margin: auto;
}
.gapfill_with_answer .img-descript .descript {
  font: 400 20px/150% "Baloo 2", cursive;
  text-align: justify;
  color: #00164A;
  padding-bottom: 20px;
}
.gapfill_with_answer .img-descript .descript p {
  padding: 5px 0;
}
.gapfill_with_answer .list_question {
  text-align: left;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  padding: 15px;
}
.gapfill_with_answer .list_question .question_inner {
  font: 400 14px/1 "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .gapfill_with_answer .list_question .question_inner {
    font-size: 22px;
  }
}
.gapfill_with_answer .list_question .question_inner .type {
  font: 700 14px/150% "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .gapfill_with_answer .list_question .question_inner .type {
    font-size: 22px;
  }
}
.gapfill_with_answer .list_question .question_inner:not(.example) + :not(.example) .type {
  display: none;
}
.gapfill_with_answer .list_question .question_inner.example + .example .type {
  display: none;
}
.gapfill_with_answer .list_question .question_inner + .question_inner {
  padding-top: 15px;
}
.gapfill_with_answer .list_question .question_inner .fill_in_box {
  font: 400 14px/1 "Baloo 2", cursive;
  text-align: center;
  line-height: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px dashed #00164A;
  border-radius: 0;
  max-width: 120px;
  max-height: 18px;
  padding: 0;
}
@media (min-width: 992px) {
  .gapfill_with_answer .list_question .question_inner .fill_in_box {
    font-size: 22px;
  }
}

.gapfill_suggest .list_question {
  font: 400 14px/1 "Baloo 2", cursive;
  text-align: justify;
  padding-top: 15px;
}
@media (min-width: 992px) {
  .gapfill_suggest .list_question {
    font-size: 22px;
  }
}
.gapfill_suggest .list_question .fill_in_box {
  font: 400 14px/1 "Baloo 2", cursive;
  text-align: center;
  line-height: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px dashed #00164A;
  border-radius: 0;
  max-width: 120px;
  max-height: 18px;
  padding: 0;
}
@media (min-width: 992px) {
  .gapfill_suggest .list_question .fill_in_box {
    font-size: 22px;
  }
}

.gapfill .list_question {
  font: 400 14px/1 "Baloo 2", cursive;
  text-align: justify;
  padding-top: 15px;
}
@media (min-width: 992px) {
  .gapfill .list_question {
    font-size: 22px;
  }
}
.gapfill .list_question .fill_in_box {
  font: 400 14px/1 "Baloo 2", cursive;
  text-align: center;
  line-height: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px dashed #00164A;
  border-radius: 0;
  max-width: 120px;
  max-height: 18px;
  padding: 0;
}
@media (min-width: 992px) {
  .gapfill .list_question .fill_in_box {
    font-size: 22px;
  }
}

.matching_letter .img-descript {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -15px;
}
.matching_letter .img-descript .img {
  flex: 1 1;
  min-width: 50%;
  padding: 15px;
  margin: auto;
}
.matching_letter .img-descript .img img {
  border: 5px solid #fff;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
  margin: auto;
}
.matching_letter .img-descript .group_img {
  flex: 1 1;
  min-width: 50%;
  display: flex;
  flex-wrap: wrap;
  padding: 15px;
  margin: 0 -15px;
}
.matching_letter .img-descript .group_img .img-small {
  flex: 0 0 25%;
  max-width: 25%;
  padding: 15px;
}
.matching_letter .img-descript .group_img .img-small .thumbnail {
  width: 100%;
  padding-top: 62%;
  position: relative;
  overflow: hidden;
}
.matching_letter .img-descript .group_img .img-small .thumbnail img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.matching_letter .img-descript .group_img .img-small .label {
  font: 700 12px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  display: block;
  margin-top: 15px;
}
@media (min-width: 992px) {
  .matching_letter .img-descript .group_img .img-small .label {
    font-size: 18px;
  }
}
.matching_letter .img-descript .descript {
  font: 400 20px/150% "Baloo 2", cursive;
  text-align: justify;
  color: #00164A;
  flex: 100%;
  max-width: 100%;
  padding: 0 15px;
  padding-bottom: 20px;
}
.matching_letter .img-descript .descript p {
  padding: 5px 0;
}
.matching_letter .list_question {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}
@media (min-width: 992px) {
  .matching_letter .list_question {
    margin: 0 -30px;
  }
}
.matching_letter .list_question .question_inner {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 10px;
}
@media (min-width: 992px) {
  .matching_letter .list_question .question_inner {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 10px 30px;
  }
}
.matching_letter .list_question .question_inner .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.matching_letter .list_question .question_inner .item .img {
  flex: 0 0 110px;
  max-width: 110px;
}
.matching_letter .list_question .question_inner .item .name {
  font: 500 16px/normal "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: left;
  flex: 1 1;
  max-height: 10vh;
  padding: 0 15px;
  overflow-y: auto;
}
@media (min-width: 992px) {
  .matching_letter .list_question .question_inner .item .name {
    font-size: 22px;
  }
}
.matching_letter .list_question .question_inner .item .name::-webkit-scrollbar {
  width: 5px;
  background-color: transparent;
  border-radius: 5px;
}
.matching_letter .list_question .question_inner .item .name::-webkit-scrollbar-thumb {
  background-color: #F5F5F5;
  border-radius: 5px;
}
.matching_letter .list_question .question_inner .item .name::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
  background-color: transparent;
  border-radius: 5px;
}
.matching_letter .list_question .question_inner .item input {
  font: 700 16px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  color: #00164A;
  background: #fff;
  border: 3px solid #18EFED;
  border-radius: 50px;
  flex: 0 0 73px;
  width: 73px;
  height: 37px;
}
@media (min-width: 992px) {
  .matching_letter .list_question .question_inner .item input {
    font-size: 22px;
  }
}

.write_yes_no {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.write_yes_no .box_l, .write_yes_no .box_r {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0 15px;
}
@media (min-width: 992px) {
  .write_yes_no .box_l, .write_yes_no .box_r {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
.write_yes_no .img-descript {
  display: block;
}
.write_yes_no .img-descript .img {
  max-width: 500px;
  padding-bottom: 20px;
  margin: auto;
}
.write_yes_no .img-descript .img img {
  border: 5px solid #fff;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
  margin: auto;
}
.write_yes_no .img-descript .descript {
  font: 400 20px/150% "Baloo 2", cursive;
  text-align: justify;
  color: #00164A;
  padding-bottom: 20px;
}
.write_yes_no .img-descript .descript p {
  padding: 5px 0;
}
.write_yes_no .list_question {
  text-align: left;
}
.write_yes_no .list_question .question_inner {
  font: 400 14px/1 "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .write_yes_no .list_question .question_inner {
    font-size: 22px;
  }
}
.write_yes_no .list_question .question_inner .type {
  font: 700 14px/150% "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .write_yes_no .list_question .question_inner .type {
    font-size: 22px;
  }
}
.write_yes_no .list_question .question_inner:not(.example) + :not(.example) .type {
  display: none;
}
.write_yes_no .list_question .question_inner.example + .example .type {
  display: none;
}
.write_yes_no .list_question .question_inner + .question_inner {
  padding-top: 15px;
}
.write_yes_no .list_question .question_inner .fill_in_box {
  font: 400 14px/1 "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  line-height: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px dashed #00164A;
  border-radius: 0;
  max-width: 120px;
  max-height: 18px;
  padding: 0;
}
@media (min-width: 992px) {
  .write_yes_no .list_question .question_inner .fill_in_box {
    font-size: 22px;
  }
}

.check_right_wrong .list_question .question_inner {
  max-width: 690px;
  margin: auto;
}
.check_right_wrong .list_question .question_inner + .question_inner {
  margin-top: 20px;
}
@media (min-width: 992px) {
  .check_right_wrong .list_question .question_inner + .question_inner {
    margin-top: 50px;
  }
}
.check_right_wrong .list_question .question_inner .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.check_right_wrong .list_question .question_inner .item .img {
  flex: 0 0 32%;
  max-width: 220px;
}
.check_right_wrong .list_question .question_inner .item .img img {
  border: 5px solid #fff;
  width: 100%;
  height: auto;
}
.check_right_wrong .list_question .question_inner .item .name {
  font: 700 18px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: left;
  flex: 1 1;
  padding: 0 15px;
}
@media (min-width: 992px) {
  .check_right_wrong .list_question .question_inner .item .name {
    font-size: 25px;
  }
}
.check_right_wrong .list_question .question_inner .item .ul-select {
  font: 700 16px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  color: #00164A;
  background: #fff;
  border: 3px solid #18EFED;
  border-radius: 50px;
  flex: 0 0 25%;
  max-width: 185px;
  height: 60px;
}
@media (min-width: 992px) {
  .check_right_wrong .list_question .question_inner .item .ul-select {
    font-size: 22px;
  }
}
.check_right_wrong .list_question .question_inner .item .ul-select li {
  background: #fff;
  border-radius: 50px;
  height: 100%;
}
.check_right_wrong .list_question .question_inner .item .ul-select li.init {
  display: flex;
  align-items: center;
  justify-content: center;
}
.check_right_wrong .list_question .question_inner .item .ul-select li.init .select input {
  display: none;
}
.check_right_wrong .list_question .question_inner .item .ul-select li.init .select label {
  display: none;
}
.check_right_wrong .list_question .question_inner .item .ul-select li.init .select input:checked + label {
  display: block;
}
.check_right_wrong .list_question .question_inner .item .ul-select li:not(init) {
  position: relative;
}
.check_right_wrong .list_question .question_inner .item .ul-select li:not(init) label {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.check_right_wrong .list_question .question_inner .item .ul-select li .tick {
  background: url("../../../../../resources/images/checked.png") center center no-repeat;
  background-size: contain;
  width: 58px;
  height: 37px;
}
.check_right_wrong .list_question .question_inner .item .ul-select li .cross {
  background: url("../../../../../resources/images/cross.png") center center no-repeat;
  background-size: contain;
  width: 42px;
  height: 42px;
}

.dragdrop .half {
  display: flex;
  flex-wrap: wrap;
}
.dragdrop .half .box_l, .dragdrop .half .box_r {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 992px) {
  .dragdrop .half .box_l, .dragdrop .half .box_r {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
.dragdrop .half .box_l {
  max-width: 500px;
  padding: 0 30px;
  margin: auto;
}
@media (min-width: 992px) {
  .dragdrop .half .box_l {
    order: 2;
  }
}
.dragdrop .half .box_l .list_fill .item_fill {
  flex: 0 0 auto;
  max-width: 50%;
}
@media (min-width: 992px) {
  .dragdrop .half .box_r {
    order: 1;
  }
}
.dragdrop .full .box_l .list_fill {
  padding-top: 0;
  padding-bottom: 20px;
  margin: 0 -20px;
}
.dragdrop .full .box_l .list_fill .item_fill {
  flex: 0 0 auto;
  margin: 5px;
}
.dragdrop .box_l {
  position: relative;
  z-index: 1;
}
.dragdrop .box_l .list_fill {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 30px;
  margin: -30px;
  min-height: 58px;
}
.dragdrop .box_l .list_fill .item_fill {
  font: 500 16px/1 "Baloo 2", cursive;
  border: 2px dashed #00164A;
  min-width: 112px;
  min-height: 33px;
  flex: 0 0 40%;
  max-width: 40%;
  padding: 10px 20px;
  margin: 5px;
}
@media (min-width: 992px) {
  .dragdrop .box_l .list_fill .item_fill {
    font-size: 26px;
  }
}
.dragdrop .box_r {
  position: relative;
}
.dragdrop .box_r .list_cell .item_cell {
  font: 500 12px/1 "Baloo 2", cursive;
  text-align: center;
  background: rgba(255, 255, 255, 0.8);
  border: 2px dashed #00164A;
  border-radius: 50px;
  min-width: 72px;
  min-height: 27px;
  position: absolute;
  transition: transform 0.3s ease 0s, background-color 0.3s ease 0s;
}
@media (min-width: 992px) {
  .dragdrop .box_r .list_cell .item_cell {
    font-size: 17px;
  }
}
.dragdrop .box_r .list_cell .item_cell .item_fill:not(.text-transparent) {
  color: #fff;
  background: linear-gradient(to right, #FF5F29, #FFA506);
}
.dragdrop .item_fill {
  font: 500 12px/1 "Baloo 2", cursive;
  text-align: center;
  background: var(--bg);
  border-radius: 50px;
  min-width: 72px;
  min-height: 27px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 992px) {
  .dragdrop .item_fill {
    font-size: 16px;
  }
}

.write_paragraph .img-descript .group_img {
  flex: 1 1;
  min-width: 50%;
  display: flex;
  flex-wrap: wrap;
  padding: 15px;
  margin: 0 -30px;
}
.write_paragraph .img-descript .group_img .img-small {
  flex: 1 1 auto;
  min-width: 25%;
  padding: 15px 30px;
}
.write_paragraph .img-descript .group_img .img-small .thumbnail {
  border: 4px solid #fff;
  width: 100%;
  padding-top: 100%;
  position: relative;
  overflow: hidden;
}
.write_paragraph .img-descript .group_img .img-small .thumbnail img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.write_paragraph .img-descript .group_img .img-small .label {
  font: 700 12px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  display: block;
  margin-top: 15px;
}
@media (min-width: 992px) {
  .write_paragraph .img-descript .group_img .img-small .label {
    font-size: 18px;
  }
}
.write_paragraph .question_inner {
  background: #EBFCFF;
  border-radius: 25px;
  padding: 20px;
}
.write_paragraph .question_inner .require {
  font: 500 22px/150% "Baloo 2", cursive;
  color: #00164A;
  text-align: left;
  padding-bottom: 10px;
  padding-right: 65px;
  position: relative;
}
.write_paragraph .question_inner .require .count {
  position: absolute;
  top: 0;
  right: 0;
}
.write_paragraph .question_inner textarea {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 6 6"><circle cx="3" cy="3" r="1" fill="rgba(0,22,74,0.9)" /></svg>') 0 1em/4px 1.5em transparent;
  border: 0;
  width: 100%;
  min-height: 180px;
}

.word_ordering .list_question {
  font: 500 16px/150% "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .word_ordering .list_question {
    font-size: 22px;
  }
}
.word_ordering .list_question .question_inner {
  display: flex;
  align-items: center;
  padding: 30px 0;
}
.word_ordering .list_question .question_inner .img {
  flex: 0 0 25%;
  max-width: 25%;
}
.word_ordering .list_question .question_inner .box_answer {
  flex: 1 1 auto;
  height: 70px;
  padding: 0 15px;
}
@media (min-width: 992px) {
  .word_ordering .list_question .question_inner .box_answer {
    padding: 0 45px;
  }
}
.word_ordering .list_question .question_inner .box_answer input {
  font-size: 24px;
  text-align: center;
  background: #fff;
  border: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.word_ordering .list_question .question_inner .word_shuffle {
  background: url("../../../../../resources/images/book.png") center center no-repeat;
  background-size: contain;
  flex: 0 0 30%;
  max-width: 30%;
  display: flex;
  flex-wrap: wrap;
  padding-top: 19.4%;
  margin: 0 -5px;
  position: relative;
}
.word_ordering .list_question .question_inner .word_shuffle .char {
  width: 15%;
  padding-top: 15%;
  position: absolute;
  opacity: 0;
  transition: 300ms ease-in-out;
}
.word_ordering .list_question .question_inner .word_shuffle .char span {
  border: 2px solid #010308;
  background: #fff;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
}

.gapfill_selectbox .list_question {
  font: 500 18px/150% "Baloo 2", cursive;
  text-align: justify;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 25px;
  padding: 3.5% 5.5%;
}
@media (min-width: 992px) {
  .gapfill_selectbox .list_question {
    font-size: 22px;
  }
}
.gapfill_selectbox .list_question .question_inner {
  padding: 5px 0;
}
.gapfill_selectbox .list_question select {
  font-weight: 700;
  text-align: center;
  color: #00164A;
  border: 2px solid #18EFED;
  border-radius: 50px;
  min-width: 130px;
  margin: 10px 0;
}

.gapfill_dragdrop_word .list_fill {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 30px;
  margin: -30px;
  min-height: 58px;
}
.gapfill_dragdrop_word .list_fill .item_fill {
  font: 500 16px/1 "Baloo 2", cursive;
  background: #fff;
  border-radius: 50px;
  flex: 0 0 auto;
  min-width: 18%;
  min-height: 33px;
  padding: 10px 20px;
  margin: 5px;
}
@media (min-width: 992px) {
  .gapfill_dragdrop_word .list_fill .item_fill {
    font-size: 26px;
  }
}
.gapfill_dragdrop_word .list_question {
  text-align: justify;
  padding: 3% 5%;
}
.gapfill_dragdrop_word .list_question .question_inner {
  font: 400 14px/150% "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .gapfill_dragdrop_word .list_question .question_inner {
    font-size: 22px;
  }
}
.gapfill_dragdrop_word .list_question .question_inner .item_cell {
  font: 500 12px/1 "Baloo 2", cursive;
  text-align: center;
  border-bottom: 1px dashed #00164A;
  min-width: 120px;
  min-height: 27px;
  display: inline-block;
}
@media (min-width: 992px) {
  .gapfill_dragdrop_word .list_question .question_inner .item_cell {
    font-size: 17px;
  }
}

.gapfill_autofill_letters .answer-pool {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.gapfill_autofill_letters .answer-pool .item {
  flex: 0 0 50%;
  min-width: 50%;
  display: table;
  padding: 9px 23px;
}
.gapfill_autofill_letters .answer-pool .item span {
  font: 400 14px/150% "Baloo 2", cursive;
  text-align: left;
  background: #fff;
  border-radius: 50px;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
  padding: 10px 25px;
}
@media (min-width: 992px) {
  .gapfill_autofill_letters .answer-pool .item span {
    font-size: 22px;
  }
}
.gapfill_autofill_letters .list_question {
  text-align: left;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #fff;
  border-radius: 25px;
  padding: 25px 30px;
  margin: 20px 23px 0;
}
.gapfill_autofill_letters .list_question .question_inner {
  font: 400 14px/1 "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .gapfill_autofill_letters .list_question .question_inner {
    font-size: 22px;
  }
}
.gapfill_autofill_letters .list_question .question_inner .type {
  font: 700 14px/150% "Baloo 2", cursive;
}
@media (min-width: 992px) {
  .gapfill_autofill_letters .list_question .question_inner .type {
    font-size: 22px;
  }
}
.gapfill_autofill_letters .list_question .question_inner:not(.example) + :not(.example) .type {
  display: none;
}
.gapfill_autofill_letters .list_question .question_inner.example + .example .type {
  display: none;
}
.gapfill_autofill_letters .list_question .question_inner.example .fill_in_box {
  border-bottom: 1px dashed #00164A;
  max-width: unset;
  max-height: unset;
}
.gapfill_autofill_letters .list_question .question_inner + .question_inner {
  padding-top: 15px;
}
.gapfill_autofill_letters .list_question .question_inner .name::first-letter {
  font-weight: 700;
}
.gapfill_autofill_letters .list_question .question_inner .fill_in_box {
  font: 400 14px/1 "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  line-height: 100%;
  background: transparent;
  padding: 0;
}
@media (min-width: 992px) {
  .gapfill_autofill_letters .list_question .question_inner .fill_in_box {
    font-size: 22px;
  }
}
.gapfill_autofill_letters .list_question .question_inner .fill_in_box input {
  text-align: center;
  text-transform: uppercase;
  border: 1px dashed #00164A;
  border-radius: 50px;
  max-width: 128px;
  max-height: 38px;
  padding: 5px 10px;
}

.speaking .box_record {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.speaking .box_record .question {
  background: #fff;
  border-radius: 50px;
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  align-items: center;
}
.speaking .box_record .question span {
  font: 700 14px/1 "Baloo 2", cursive;
  white-space: nowrap;
  padding-left: 20px;
  margin-right: auto;
}
@media (min-width: 992px) {
  .speaking .box_record .question span {
    font-size: 18px;
  }
}
.speaking .box_record .question audio {
  width: 337px;
  height: 41px;
  margin: 0;
}
.speaking .box_record .record {
  font: 700 14px/1 "Baloo 2", cursive;
  text-transform: uppercase;
  color: #fff;
  background: radial-gradient(circle, #ffc80c 20%, #ff8902 70%);
  flex: 0 0 30%;
  max-width: 30%;
  border-radius: 50px;
  display: flex;
  align-items: center;
}
@media (min-width: 992px) {
  .speaking .box_record .record {
    font-size: 17px;
  }
}
.speaking .box_record .record span {
  padding-left: 16px;
}
.speaking .box_record .btn {
  flex: 0 0 6.9%;
  max-width: 6.9%;
  padding: 0;
}

.img-descript {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -15px;
}
.img-descript .img {
  flex: 1 1;
  min-width: 50%;
  padding: 15px;
  margin: auto;
}
.img-descript .img img {
  border: 5px solid #fff;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
  margin: auto;
}
.img-descript .group_img {
  flex: 0 0 100%;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 15px;
  margin: 0 -7px;
}
@media (min-width: 992px) {
  .img-descript .group_img {
    flex: 1 1;
    min-width: 50%;
  }
}
.img-descript .group_img .img-small {
  flex: 1 1 auto;
  min-width: 25%;
  padding: 7px;
}
.img-descript .group_img .img-small .thumbnail {
  width: 100%;
  padding-top: 55%;
  position: relative;
  overflow: hidden;
}
.img-descript .group_img .img-small .thumbnail img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.img-descript .group_img .img-small .label {
  font: 400 12px/150% "Baloo 2", cursive;
  text-transform: uppercase;
  text-align: center;
  background: #fff;
  border-radius: 50px;
  display: block;
  margin-top: 15px;
}
@media (min-width: 992px) {
  .img-descript .group_img .img-small .label {
    font-size: 18px;
  }
}
.img-descript .descript {
  font: 400 20px/150% "Baloo 2", cursive;
  text-align: justify;
  color: #00164A;
  flex: 100%;
  max-width: 100%;
  padding: 0 15px;
  padding-bottom: 20px;
}
.img-descript .descript p {
  padding: 5px 0;
}

audio {
  border-radius: 50px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  width: 100%;
  max-width: 434px;
  display: block;
  margin: auto;
  margin-bottom: 45px;
  height: 40px;
}
@media (min-width: 601px) {
  audio {
    height: 53px;
  }
}
audio::-webkit-media-controls-play-button, audio::-webkit-media-controls-panel {
  background-color: #fff;
  color: #000;
}
audio::-webkit-media-controls-timeline {
  background: #00EFF1;
  border-radius: 50px;
  padding: 0;
  margin: 0 10px;
}

.ul-select li {
  z-index: 2;
}
.ul-select li:not(.init) {
  float: left;
  width: 100%;
  display: none;
}
.ul-select li.init {
  cursor: pointer;
}

.text-transparent {
  color: transparent;
}/*# sourceMappingURL=exam.css.map */