@font-face {
  font-family: "oppo";
  src: url("../fonts/oppo/11OPPOSansVNItalic-Regular.woff2") format("woff2"), url("../fonts/oppo/11OPPOSansVNItalic-Regular.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "oppo";
  src: url("../fonts/oppo/11OPPOSansVNItalic-Bold.woff2") format("woff2"), url("../fonts/oppo/11OPPOSansVNItalic-Bold.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "oppo";
  src: url("../fonts/oppo/11OPPOSansVNItalic-Medium.woff2") format("woff2"), url("../fonts/oppo/11OPPOSansVNItalic-Medium.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
.cussor-round {
  -webkit-animation: spin 10s linear infinite;
  -moz-animation: spin 10s linear infinite;
  animation: spin 10s linear infinite;
  display: inline-block;
  width: 150px;
  height: 150px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 9999;
}

.cussor-round > img {
  transform: scale3d(1.5, 1.5, 1.5);
  transition: all 0.5s;
  width: 100%;
  height: 100%;
}

@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.emag-main_wrapper {
  background: linear-gradient(90deg, #E8DEDC 0%, #EAE6E5 26.01%, #DBE3EE 66.05%, #D3DFED 100%);
}
.emag-main_wrapper .avarta {
  height: calc(100vh - 44px);
  position: relative;
}

.section-intro {
  padding-top: 44px;
}
.section-intro .coverThumb {
  position: relative;
  max-height: calc(100vh - 44px);
}
.section-intro .coverThumb img {
  height: calc(100vh - 44px);
}

.sectionThumb {
  position: relative;
  height: calc(100vh - 44px);
}
.sectionThumb img {
  height: 100% !important;
  object-fit: contain !important;
}

.box-section {
  margin-left: -5px;
  position: relative;
  padding-top: 44px;
  font-family: "oppo";
}

.title {
  position: absolute;
}
.title img {
  width: 100%;
}
.title.title-1 {
  top: 3.4%;
  left: 1.4%;
  width: 41%;
}

.txt-section {
  position: absolute;
  left: 0;
  bottom: 0;
  color: #3B4159;
  max-width: 42%;
  width: 100%;
  white-space: normal;
  line-height: 1.65;
  box-sizing: border-box;
  font-size: 0.9vw;
}
@media (max-width: 1440px) {
  .txt-section {
    font-size: 0.8vw;
  }
}
.txt-section strong {
  font-weight: bold;
}
.txt-section p {
  margin-bottom: 24px;
}
@media (max-width: 1440px) {
  .txt-section p {
    margin-bottom: 16px;
  }
}
.txt-section p:last-child {
  margin-bottom: 0;
}
.txt-section p strong {
  font-weight: bold;
}
.txt-section.txt-4-1 {
  padding-left: 10.2%;
  padding-bottom: 6.6%;
}
@media (max-width: 1440px) {
  .txt-section.txt-4-1 {
    padding-bottom: 4%;
  }
}
.txt-section.txt-4-2 {
  bottom: 7.2%;
  left: 44.2%;
  max-width: 33%;
}
@media (max-width: 1440px) {
  .txt-section.txt-4-2 {
    bottom: 5.5%;
  }
}

.box-2 .txt-section {
  padding: 5% 0 2.5% 6.8%;
}
@media (max-width: 1440px) {
  .box-2 .txt-section {
    padding-left: 4%;
  }
}
.box-2 .avr-abs {
  position: absolute;
  top: 0;
  right: 0;
  width: 55%;
  height: 100%;
}

.box-4 .avr {
  position: absolute;
  top: 0;
  right: 1.5%;
  max-width: 55.5%;
}
.box-4 .avr img {
  width: 100%;
}

.box-5 .txt-section {
  top: 14%;
  left: 6%;
  max-width: 23%;
}
.box-5 .caption {
  position: absolute;
  bottom: 17.5%;
  left: 14%;
  width: 28.5%;
}

.box-6 .txt-section {
  top: 8.8%;
  left: 49%;
  max-width: 33.5%;
}
.box-6 .avr {
  position: absolute;
}
.box-6 .avr-1 {
  width: 43%;
  top: 0;
  left: 0;
  position: absolute;
  height: 100%;
}
.box-6 .avr-2 {
  bottom: 6%;
  right: 3.2%;
  width: 24%;
}

.box-7 .txt-section {
  left: 36%;
  max-width: 26%;
  bottom: 9.5%;
}
@media (max-width: 1440px) {
  .box-7 .txt-section {
    bottom: 7.5%;
  }
}
.box-7 .caption {
  position: absolute;
  top: 3.5%;
  left: 30.5%;
  width: 30.7%;
}
.box-7 .avr {
  position: absolute;
}
.box-7 .avr-1 {
  position: absolute;
  top: 3%;
  left: 1.2%;
  width: 32.5%;
}
.box-7 .avr-2 {
  right: 1.8%;
  top: 3.5%;
  width: 35.4%;
}

.box-9 .caption {
  position: absolute;
  bottom: 4.5%;
  left: 4.5%;
  width: 29.5%;
}
.box-9 .avr {
  position: absolute;
  bottom: 0;
  right: 2.5%;
  width: 61.5%;
}

.box-10 .avr {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 67%;
}
.box-10 .caption {
  position: absolute;
  top: 10.5%;
  left: 12%;
  width: 29%;
  z-index: 2;
}

.box-11 .txt-section {
  position: absolute;
  top: 7.6%;
  bottom: unset;
}
.box-11 .txt-section.txt-1 {
  left: 4%;
  max-width: 30%;
}
.box-11 .txt-section.txt-2 {
  left: 37.2%;
  max-width: 31%;
}

.box-12 .txt-section {
  bottom: 9.5%;
  left: unset;
  right: 6.5%;
  max-width: 36%;
}

.box-13 .txt-section {
  left: 70%;
  max-width: 26.5%;
  bottom: 16.5%;
}
.box-13 .avr {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 65.5%;
}

.box-14 .avr {
  position: absolute;
}
.box-14 .avr-1 {
  left: 0;
  top: 0;
  height: 100%;
  width: 39.4%;
}
.box-14 .avr-2 {
  right: 0;
  left: unset;
  bottom: unset;
  top: 0;
  width: 59.5%;
  border-radius: 12px 0 0 12px;
  overflow: hidden;
}

.box-15 .txt-section {
  left: 59.5%;
  bottom: 9.4%;
  max-width: 33.4%;
}
.box-15 .title {
  position: absolute;
  left: 3.6%;
  bottom: 2%;
  width: 48%;
}
.box-15 .avr {
  position: absolute;
  bottom: unset;
  top: 8%;
  left: 13.2%;
  width: 40%;
}

.box-16 .avr {
  position: absolute;
}
.box-16 .avr-1 {
  bottom: unset;
  top: 7%;
  left: 2.4%;
  width: 19.2%;
}
.box-16 .avr-2 {
  bottom: 15%;
  left: 29.4%;
  width: 23.8%;
}
.box-16 .avr-3 {
  right: 0;
  top: 0;
  height: 100%;
  width: 44%;
}

.box-17 .avr {
  position: absolute;
  top: 0;
  left: 41%;
  height: 100%;
  width: 42.5%;
}

.box-18 .avr {
  position: absolute;
  top: 0;
  left: 0;
  width: 65%;
}
.box-18 .txt-section {
  left: unset;
  right: 3%;
  max-width: 28%;
  bottom: 20%;
}

.box-19 .txt-section {
  left: 10.4%;
  max-width: 32%;
  bottom: 10%;
}
@media (max-width: 1440px) {
  .box-19 .txt-section {
    bottom: 7%;
  }
}
.box-19 .title {
  top: 3.4%;
  left: 1.3%;
  width: 45%;
}
.box-19 .avr {
  position: absolute;
}
.box-19 .avr-1 {
  position: absolute;
  bottom: 7%;
  left: 48%;
  width: 22.5%;
}
.box-19 .avr-2 {
  position: absolute;
  top: 5%;
  width: 22.5%;
  right: 5%;
}

.box-20 .txt-section {
  left: 65%;
  bottom: 6%;
  max-width: 31%;
}
.box-20 .caption {
  position: absolute;
  bottom: 6%;
  left: 37.4%;
  width: 23.8%;
}
.box-20 .avr {
  position: absolute;
}
.box-20 .avr-1 {
  position: absolute;
  bottom: 5.5%;
  left: 4.5%;
  width: 31%;
}
.box-20 .avr-2 {
  top: 0;
  left: 37.2%;
  width: 51.5%;
}

.box-21 .txt-section {
  bottom: unset;
  top: 32%;
  left: 6%;
  max-width: 30%;
}
.box-21 .head {
  position: absolute;
  top: 9.5%;
  left: 4.3%;
  width: 49%;
}
.box-21 .link-oppo {
  position: absolute;
  left: 6%;
  top: 46%;
  width: 26%;
  z-index: 3;
}

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