.swp .btn {
  min-width: auto;
  box-shadow: unset;
}

@font-face {
  font-family: 'BetterTogetherLight';
  font-weight: light;
  font-display: swap;
  src: url('https://www.true.th/ir/assets/fonts/bettertogether-light-webfont.woff2') format('woff2'),
  url('https://www.true.th/ir/assets/fonts/bettertogether-light-webfont.woff') format('woff');
}

@font-face {
  font-family: 'BetterTogetherRegular';
  font-weight: normal;
  font-display: swap;
  src: url('https://www.true.th/ir/assets/fonts/bettertogether-regular-webfont.woff2') format('woff2'),
  url('https://www.true.th/ir/assets/fonts/bettertogether-regular-webfont.woff') format('woff');
}

@font-face {
  font-family: 'BetterTogetherMedium';
  font-weight: normal;
  font-display: swap;
  src: url('https://www.true.th/ir/assets/fonts/bettertogether-medium-webfont.woff2') format('woff2'),
  url('https://www.true.th/ir/assets/fonts/bettertogether-medium-webfont.woff') format('woff');
}

@font-face {
  font-family: 'BetterTogetherBold';
  font-weight: bold;
  font-display: swap;
  src: url('https://www.true.th/ir/assets/fonts/bettertogether-bold-webfont.woff2') format('woff2'),
  url('https://www.true.th/ir/assets/fonts/bettertogether-bold-webfont.woff') format('woff');
}

@font-face {
  font-display: swap;
  font-family: TrueLight;
  font-weight: 300;
  src: url(https://www.true.th/static/true-light-2464ac3b7aa66ac883d25102c6600ff7.woff2) format("woff2"), url(https://www.true.th/static/true-light-6e7bca88be597791ed3e25283989b4ba.woff) format("woff")
}

@font-face {
  font-display: swap;
  font-family: TrueMedium;
  font-weight: 400;
  src: url(https://www.true.th/static/true-medium-df4f7f923127f1996b6e6089155ee529.woff2) format("woff2"), url(https://www.true.th/static/true-medium-f9109596798bd8a68fa934a3e3b731b1.woff) format("woff")
}

@font-face {
  font-display: swap;
  font-family: TrueBold;
  font-weight: 700;
  src: url(https://www.true.th/static/true-bold-61d87478b4c0d4f47fe33afeeeae70a4.woff2) format("woff2"), url(https://www.true.th/static/true-bold-06ec62031fa5d86ad8fbc805723fdca9.woff) format("woff")
}

@font-face {
  font-display: swap;
  font-family: TrueBoldSpecial;
  font-weight: 800;
  src: url(https://www.true.th/static/true-bold-special-1485748d2b1a528595c902e71225a047.woff2) format("woff2"), url(https://www.true.th/static/true-bold-special-6237537c3d1638511e9d6562ae86bcec.woff) format("woff")
}

.grecaptcha-badge {
  visibility: hidden;
}


:root {
  --bgGradient: linear-gradient(
    355deg,
    #00c8ff -13.26%,
    #07c0f8 -7.38%,
    #1dace8 0.45%,
    #408bcc 9.26%,
    #6f60a9 20.03%,
    #b3207a 31.78%,
    #cc1550 40.59%,
    #e20b2d 49.4%,
    #f20514 57.23%,
    #fb0105 65.06%,
    #ff0000 70.94%
  );
  --bWhite: #ffffff;
  --bgd-red: linear-gradient(173deg, #ff1600 0%, #f09 72.47%), #d9d9d9;
  --bgd-blue: linear-gradient(173deg, #00a6ff 0%, #ff0098 100%),
    radial-gradient(151.5% 80.52% at 20.37% 97.66%, #c0fdfe 0%, #b4f5fd 18%, #95e1fb 51%, #62c1f9 94%, #5cbdf9 100%),
    #d9d9d9;
  --color-chacoal: #303c46;
  --color-darkGray: #202020;
  --bgYellow: linear-gradient(90deg, #ffc800 0.28%, #ffbb08 100.28%);
}

body * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

form {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.-True .btnPrimary {
  border: 1px solid #e00000;
  color: #ffffff;
  background-color: #e00000;
}

.cChacoal {
  color: var(--color-chacoal);
}

.cDarkGray {
  color: var(--color-darkGray);
}

.cGradient {
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  background-clip: text;
  padding-top: 4px;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cPrimaryRed {
  color: #e00000;
}

.cPrimaryBlue {
  color: #19aaf8;
}

.bPrimaryRed {
  background: #e00000 !important;
}

.bPrimaryBlue {
  background: #19aaf8 !important;
}

.bYellow {
  background: var(--bgYellow);
}

.lineGradient {
  display: flex;
  width: 48px;
  height: 4px;
  margin: 12px auto;
  border-radius: 4px;
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
}

.icoPlane {
  background-image: url("../images/icons/ico-plane.svg");
}

.icoSims {
  background-image: url("../images/icons/ico-sims.svg");
}

.icoGift {
  background-image: url("../images/icons/ico-gift.svg");
}

.icoGift.active {
  background-image: url("../images/icons/ico-gift-active.svg");
}

.icoNet {
  background-image: url("../images/icons/ico-net.svg");
}

.icoCalendar {
  background-image: url("../images/icons/ico-calendar.svg");
}

.icoEsims {
  background-image: url("../images/icons/ico-eSim.svg");
}

.icoCallGrd {
  background-image: url("../images/icons/ico-call-gradient.png");
}

.icoDataGrd {
  background-image: url("../images/icons/ico-data-gradient.png");
}

.icoShare {
  background-image: url("../images/icons/ico-share.svg");
}

.icoAccident {
  background-image: url("../images/icons/ico-accident.svg");
}

.icoLuggage {
  background-image: url("../images/icons/ico-luggage.svg");
}

.icoBag {
  background-image: url("../images/icons/ico-bag.svg");
}

.icoCar {
  background-image: url("../images/icons/ico-car.svg");
}

.icoCall {
  background-image: url("../images/icons/ico-call-white.svg");
}

.icoCallTrue {
  background-image: url("../images/icons/ico-call-true.png");
}

.icoCallDtac {
  background-image: url("../images/icons/ico-call-dtac.png");
}

.fancybox-slide--video .fancybox-content {
  border-radius: 14px;
  overflow: hidden;
}

.fancybox-toolbar {
  right: 44px;
  display: none;
  transform: translateY(-60px);
}

.fancybox-button {
  border-radius: 50%;
}

.scBannerHero .container {
  padding: 0;
  max-width: 100%;
}

.bannerHero {
  border-radius: 0;
  padding: 0;
  opacity: 0;
  transition: all 0.15s ease 0s;
}

.bannerHero.active {
  opacity: 1;
}

.heroCarousel .owl-stage-outer {
  border-radius: 0;
}

.bannerMain {
  display: block;
  width: 100%;
}

.bannerMain img {
  width: 100%;
}

.heroCarousel .owl-dots .owl-dot {
  width: 9px;
  height: 9px;
  border-radius: 12px;
  opacity: 0.5;
  margin: 0 6px;
  border: none !important;
}

.heroCarousel .owl-dots .owl-dot:focus {
  outline: 0;
}

.heroCarousel .owl-dots {
  margin-top: 0;
}

.scBannerHero picture img {
  border-radius: 0;
}

.heroCarousel .owl-dots .owl-dot.active {
  border: none !important;
  background: #ffffff !important;
  opacity: 1;
}

.btn {
  display: flex;
  align-items: center;
  margin: 0 8px;
  justify-content: center;
  transition: all 0.35s ease-in-out 0s;
  -moz-transition: all 0.35s ease-in-out 0s;
  -webkit-transition: all 0.35s ease-in-out 0s;
}

.btn.btnWhite {
  font-size: 14px;
  color: #000000;
  min-width: 170px;
  height: 40px;
  padding: 0 12px;
  border-radius: 50px;
  font-family: "better_togetherbold" !important;
  background: linear-gradient(#fff 0 0) padding-box, linear-gradient(90deg, red 0%, #ff00a6 50%, #00a6ff 100%) border-box;
  color: #1a1a1a;
  border: 2px solid transparent;
}

.btn.btnArrow {
  background: none;
  border-radius: 0;
  padding: 0 10px 0 0;
  box-shadow: none !important;
  position: relative;
  color: #29abe2;
  font-size: 12px;
  height: auto;
  margin: 0;
  min-width: inherit;
  width: max-content;
}

.btn.btnArrow::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 11px;
  right: 0;
  margin-top: 1px;
  background: url(../images/icons/ico-caret-right.svg) center center/100% auto no-repeat;
}

.btn.btnArrow.cGradient {
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn.btnArrow.cGradient::after {
  background: url(../images/icons/ico-caret-gradient-right.svg) center center/100% auto no-repeat;
}

.btn.btnPrimary {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  border-radius: 40px;
}

.btn.btnOutline {
  width: 100%;
  height: 40px;
  padding: 0;
  margin: 0;
  border-radius: 40px;
  background: #ffffff;
  color: #e00000;
  border: 1px solid #e00000;
}

.btn.btnCategory {
  background: none;
  border: none;
  padding: 0 8px 16px;
  box-shadow: none;
  position: relative;
  border-radius: 0;
}

.btn.btnCategory::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 0%;
  height: 4px;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
  opacity: 0;
  transition: all 0.35s ease-in-out 0s;
  -moz-transition: all 0.35s ease-in-out 0s;
  -webkit-transition: all 0.35s ease-in-out 0s;
}

.btn.btnCategory span {
  color: #b3b3b3;
}

.btn.btnCategory.active {
  border: none;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn.btnCategory.active::after {
  opacity: 1;
  width: 100%;
}

.bannerHero .heroCarousel .owl-dots {
  display: flex;
  position: absolute;
  bottom: 16px;
  margin: 0 auto !important;
  width: 100%;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

.bannerHero .heroCarousel .owl-dots .owl-dot {
  display: flex;
  width: auto;
  height: auto;
  padding: 4px;
  border-radius: none;
  opacity: 1;
  background: none !important;
}

.bannerHero .heroCarousel .owl-dots .owl-dot.active {
  background: none;
  width: auto;
}

.bannerHero .heroCarousel .owl-dots .owl-dot.active span {
  width: 24px;
  background: #e00000;
}

.bannerHero .heroCarousel .owl-dots .owl-dot span {
  transition: all 0.35s ease-in-out 0s;
  display: flex;
  width: 8px;
  height: 8px;
  border-radius: 10px;
  background: #ffffff;
  margin: 0;
  opacity: 1;
}

.packCategory {
  display: flex;
  width: 100%;
}

.packCategory .innerWrapper {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: center;
}

.packCategory .navCategory {
  display: flex;
  width: 96px;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  padding: 14px 0 6px;
  margin-right: 24px;
  color: var(--color-chacoal);
  text-decoration: none;
  transition: all 0.3s ease-in-out 0s;
}

.packCategory .navCategory span {
  color: var(--color-chacoal);
}

.packCategory .navCategory:last-child {
  margin-right: 0;
}

.packCategory .navCategory:hover span {
  color: #e00000;
}

.packCategory .navCategory.active .icoPlane {
  background-image: url(../images/icons/ico-plane-active.svg);
}

.packCategory .navCategory.active .icoSims {
  background-image: url(../images/icons/ico-sims-active.svg);
}

.packCategory .navCategory.active .icoGift {
  background-image: url(../images/icons/ico-gift-gradient.svg);
}

.packCategory .navCategory.active span {
  color: #e00000;
}

.titleSection {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.selectCountry {
  display: block;
  margin-right: -16px;
}

.selectCountry .country {
  display: flex;
  justify-content: center;
  align-items: center;
}

.selectCountry .country .cGradient {
  max-width: max-content;
  padding-top: 5px;
}

.selectCountry .innerWrapper {
  display: flex;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.selectCountry .innerWrapper::-webkit-scrollbar {
  display: none;
}

.selectCountry .innerWrapper .navCountry {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-right: 16px;
  padding: 0 12px 10px;
  height: 100%;
  text-decoration: none;
  color: var(--color-chacoal);
}

.selectCountry .innerWrapper .navCountry .imgFlag {
  display: flex;
  width: 64px;
  margin-bottom: 10px;
}

.selectCountry .innerWrapper .navCountry .imgFlag img {
  width: 100%;
  align-self: center;
}

.serchBox {
  display: flex;
  width: 100%;
  position: relative;
  max-width: 310px;
  margin: 0 auto;
}

.serchBox .form-control {
  display: flex;
  font-size: 14px;
  height: 40px;
  border-radius: 40px;
  line-height: 16px;
  padding: 3px 50px 0 16px;
  color: rgba(48, 60, 70, 0.8);
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  color: #313149;
  border: 2px solid transparent;
  resize: none;
}

.serchBox .form-control:-moz-placeholder {
  font-size: 11px;
}

.serchBox .form-control:-ms-input-placeholder {
  font-size: 11px;
}

.serchBox .form-control::-webkit-input-placeholder {
  font-size: 11px;
}

.serchBox form {
  display: flex;
  position: relative;
  width: 100%;
}

.serchBox .btnSubmit {
  display: flex;
  width: 24px;
  height: 24px;
  position: absolute;
  box-shadow: none;
  border: none;
  right: 16px;
  top: 8px;
  background: url(../images/icons/ico-search.svg) center center/100% auto no-repeat;
}

.selectPackage {
  display: block;
}

.selectPackage .innerWrapper {
  display: flex;
  width: 100%;
  flex-direction: column;
}

.selectPackage .packageBox {
  display: flex;
  align-items: center;
  padding: 16px 18px;
  border-radius: 8px;
  border: 1px solid #d8d8d8;
  justify-content: space-between;
}

.selectPackage .select2-container--default .select2-selection--single {
  border: none;
}

.selectPackage .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding-left: 0;
}

.selectPackage .select2-container .select2-selection--single .select2-selection__rendered {
  font-size: 14px;
}

.selectPackage .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-width: 7px 8px 0 8px;
  border-color: #000000 transparent transparent transparent;
  left: auto;
  right: 0;
  margin-top: -4px;
}

.scCountry .selectPackage .innerWrapper > .cGradient {
  max-width: max-content;
  margin-left: auto;
  margin-right: auto;
}

.scPackage .selectPackage .packageBox {
  padding: 10px 18px;
}

.scPackage .selectPackage .packageBox .selectBox {
  position: relative;
}

.scPackage .selectPackage .packageBox .selectBox::before {
  content: "";
  display: flex;
  width: 20px;
  height: 20px;
  top: 5px;
  left: -30px;
  position: absolute;
  background: url("../images/icons/ico-filter.svg") center center/100% auto no-repeat;
}

.select2-search--dropdown {
  display: none;
}

.select2-container--open .select2-dropdown--above {
  border-bottom: 1px solid #aaa;
  border-radius: 4px;
}

.select2-container--open .select2-dropdown--below {
  border-radius: 4px;
  border-top: 1px solid #aaa;
}

.select2-results__option {
  font-size: 14px;
}

.cardRecommend {
  display: flex;
  margin-bottom: 16px;
  justify-content: center;
}

.cardRecommend .innerWrapper {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  max-width: 100%;
  width: 342px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  transition: all 0.15s ease-in-out 0s;
}

.cardRecommend .innerWrapper:hover {
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  border: 1px solid transparent;
}

.cardRecommend .innerWrapper .thumb {
  display: flex;
  width: 100%;
  height: 235px;
  overflow: hidden;
}

.cardRecommend .innerWrapper .thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.cardRecommend .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 8px 12px;
  align-items: center;
}

.cardRecommend .innerWrapper .detail .text {
  display: flex;
  flex-direction: column;
  width: calc(100% - 90px);
  padding-right: 6px;
}

.cardRecommend .innerWrapper .detail .text .title {
  max-width: 100%;
}

.cardRecommend .innerWrapper .detail .text .title p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cardRecommend .innerWrapper .buttonControl {
  display: flex;
  width: 90px;
}

.cardRecommend .innerWrapper .buttonControl .btn {
  width: 100%;
  height: 40px;
  min-width: 100%;
}

.cardSims {
  display: flex;
  padding: 0 16px;
  margin: 0 auto 24px;
}

.cardSims .innerWrapper {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  max-width: 100%;
  width: 342px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  transition: all 0.15s ease-in-out 0s;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.cardSims .innerWrapper:hover {
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  border: 1px solid transparent;
}

.cardSims .innerWrapper .thumb {
  display: flex;
  width: 100%;
  height: 385px;
  overflow: hidden;
}

.cardSims .innerWrapper .thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.cardSims .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 0 0 42px;
  align-items: center;
  flex-direction: column;
}

.cardSims .innerWrapper .detail .title {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 16px;
  align-items: center;
  justify-content: center;
}

.cardSims .innerWrapper .detail .text {
  display: flex;
  flex-direction: row;
  width: 100%;
  padding: 24px 32px;
  justify-content: space-between;
  background: #f0f0f3;
}

.cardSims .innerWrapper .detail .text .days {
  display: flex;
  width: calc(100% - 110px);
}

.cardSims .innerWrapper .detail .text .days p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cardSims .innerWrapper .detail .text .days p:first-child {
  position: relative;
  padding-right: 8px;
  margin-right: 4px;
}

.cardSims .innerWrapper .detail .text .days p:first-child::after {
  content: "";
  position: absolute;
  right: 0;
  top: 6px;
  width: 1px;
  height: 25px;
  background: #303c46;
}

.cardSims .innerWrapper .detail .text .price {
  display: flex;
  width: 110px;
  justify-content: flex-end;
}

.cardSims .innerWrapper .detail .btnArrow {
  font-size: 14px;
  padding-top: 4px;
}

.cardSims .innerWrapper .buttonControl {
  display: flex;
  width: 100%;
  justify-content: center;
  padding: 16px 32px 20px;
}

.cardSims .innerWrapper .buttonControl .btn {
  width: 100px;
  height: 40px;
  min-width: inherit;
  font-family: "better_togethermedium" !important;
}

.cardSims .innerWrapper .country {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.scRoamingRate {
  position: relative;
}

.scRoamingRate .container {
  position: relative;
  z-index: 5;
}

.scRoamingRate::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
  opacity: 0.1;
}

.scTravel .serchBox {
  width: 100%;
  max-width: 310px;
}

.scTravel .serchBox .form-control {
  width: 310px;
}

.absoluteLink {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}

.packRecommend {
  display: flex;
  max-width: 1168px;
  margin: 0 auto;
}

.packRecommend .owl-carousel .owl-stage {
  display: flex;
}

.packRecommend .owl-carousel .owl-stage .item {
  height: 100%;
}

.packRecommend .owl-carousel .owl-stage .cardRecommend {
  height: 100%;
}

.packRecommend ~ .buttonControl .btnLink {
  position: relative;
}

.packRecommend ~ .buttonControl .btnLink::after {
  content: "";
  width: 100%;
  height: 1px;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  position: absolute;
  bottom: 0;
  left: 0;
}

.packSims {
  display: flex;
  max-width: 100%;
  margin: 0 auto;
}

.cardTravel {
  display: flex;
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}

.cardTravel .innerWrapper {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  max-width: 100%;
  width: 280px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  transition: all 0.15s ease-in-out 0s;
}

.cardTravel .innerWrapper:hover {
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  border: 1px solid transparent;
}

.cardTravel .innerWrapper .title {
  display: flex;
  width: 100%;
  padding: 10px 16px;
  background: #f5f5f5;
}

.cardTravel .innerWrapper .title p {
  display: flex;
  align-items: center;
  min-height: 40px;
}

.cardTravel .innerWrapper .thumb {
  display: flex;
  width: 100%;
  height: 280px;
  overflow: hidden;
}

.cardTravel .innerWrapper .thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.cardTravel .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px;
  align-items: center;
  text-align: center;
  border-top: 1px solid #d8d8d8;
}

.headSlide {
  display: flex;
  width: 100%;
}

.cardBenefit {
  display: flex;
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}

.cardBenefit .innerWrapper {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  max-width: 100%;
  width: 280px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  transition: all 0.15s ease-in-out 0s;
}

.cardBenefit .innerWrapper:hover {
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  border: 1px solid transparent;
}

.cardBenefit .innerWrapper .title {
  display: flex;
  width: 100%;
}

.cardBenefit .innerWrapper .title p {
  display: block;
  align-items: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.cardBenefit .innerWrapper .thumb {
  display: flex;
  width: 100%;
  height: 190px;
  overflow: hidden;
}

.cardBenefit .innerWrapper .thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.cardBenefit .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px;
  align-items: center;
  flex-direction: column;
  border-top: 1px solid #d8d8d8;
}

.cardBenefit .innerWrapper .detail .text {
  display: flex;
  width: 100%;
  align-items: center;
}

.cardBenefit .innerWrapper .detail .text p {
  display: block;
  width: calc(100% - 60px);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.cardBenefit .innerWrapper .detail .text .buttonControl {
  display: flex;
  width: 60px;
  justify-content: flex-end;
}

.packTravel,
.packBenefit {
  display: block;
  margin-right: -16px;
}

.packTravel .owl-carousel .owl-stage,
.packBenefit .owl-carousel .owl-stage {
  display: flex;
}

.packTravel .owl-carousel .owl-stage .item,
.packBenefit .owl-carousel .owl-stage .item {
  height: 100%;
}

.packTravel .owl-carousel .owl-stage .cardTravel,
.packBenefit .owl-carousel .owl-stage .cardTravel {
  height: 100%;
}

.packTravel .owl-carousel .owl-stage .cardBenefit,
.packBenefit .owl-carousel .owl-stage .cardBenefit {
  height: 100%;
}

.packageWrapper {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

.packSims {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

.cardPackage {
  display: flex;
  padding: 0 16px;
  margin-bottom: 16px;
}

.cardPackage .innerWrapper {
  display: flex;
  width: 342px;
  flex-direction: column;
  border: 1px solid #e9e9ea;
  border-radius: 16px;
  padding-bottom: 16px;
}

.cardPackage .innerWrapper .btn {
  min-width: 105px;
  width: auto;
  max-width: min-content;
}

.cardPackage .innerWrapper .head {
  display: flex;
  width: 100%;
  flex-direction: column;
  border-bottom: 1px solid #e9e9ea;
}

.cardPackage .innerWrapper .head .label {
  display: flex;
  -webkit-mask-image: url(../images/mask-label.png);
  mask-image: url(../images/mask-label.png);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  max-width: 212px;
  width: 100%;
  height: 53px;
}

.cardPackage .innerWrapper .head .label span {
  display: flex;
  width: 100%;
  height: 100%;
  padding-right: 20px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
}

.cardPackage .innerWrapper .head .title {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 24px 28px 18px;
}

.cardPackage .innerWrapper .head .title p {
  display: flex;
}

.cardPackage .innerWrapper .head .title p:first-child {
  width: calc(100% - 100px);
  padding-right: 10px;
}

.cardPackage .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px 36px 24px;
}

.cardPackage .innerWrapper .detail ul {
  display: flex;
  width: 100%;
  padding: 0;
  margin: 0;
  flex-direction: column;
}

.cardPackage .innerWrapper .detail ul li {
  width: 100%;
  margin: 0;
  display: flex;
  margin-bottom: 24px;
}

.cardPackage .innerWrapper .detail ul li:last-child {
  margin-bottom: 0;
}

.cardPackage .innerWrapper .detail ul li p {
  display: flex;
  width: calc(100% - 24px);
  padding-left: 16px;
}

.cardPackage .innerWrapper .buttonControl {
  display: flex;
  justify-content: center;
}

.cardNetwork {
  display: flex;
  padding: 0 16px;
  margin-bottom: 16px;
}

.cardNetwork:last-child {
  margin-bottom: 0;
}

.cardNetwork .innerWrapper {
  display: flex;
  width: 342px;
  flex-direction: column;
  border: 1px solid #e9e9ea;
  border-radius: 16px;
  padding-bottom: 16px;
}

.cardNetwork .innerWrapper .head {
  display: flex;
  width: 100%;
}

.cardNetwork .innerWrapper .head .label {
  display: flex;
  -webkit-mask-image: url(../images/mask-label.png);
  mask-image: url(../images/mask-label.png);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  max-width: 212px;
  width: 100%;
  height: 53px;
}

.cardNetwork .innerWrapper .head .label span {
  display: flex;
  width: 100%;
  height: 100%;
  padding-right: 20px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
}

.cardNetwork .innerWrapper .head .title {
  display: flex;
  width: 100%;
  align-items: flex-start;
  padding: 16px 16px 0;
  flex-direction: column;
}

.cardNetwork .innerWrapper .head .title p {
  display: flex;
  align-items: baseline;
}

.cardNetwork .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px;
}

.cardNetwork .innerWrapper .detail ul {
  display: flex;
  width: 100%;
  padding: 0;
  margin: 0;
  flex-direction: column;
}

.cardNetwork .innerWrapper .detail ul li {
  width: 100%;
  margin: 0;
  display: flex;
  margin-bottom: 24px;
}

.cardNetwork .innerWrapper .detail ul li:last-child {
  margin-bottom: 0;
}

.cardNetwork .innerWrapper .detail ul li p {
  display: flex;
  padding-left: 16px;
}

.cardNetwork .innerWrapper .buttonControl {
  display: flex;
  justify-content: flex-end;
  padding: 0 16px;
}

.simsWrapper .cateWrapper {
  justify-content: space-between;
}

.simsWrapper .navCategory {
  margin: 0 auto;
}

.simsWrapper .navCategory .newCate .btnCategory {
  height: auto;
  width: auto;
  flex-direction: column;
  background: none;
}

.simsWrapper .navCategory .newCate .btnCategory.active span {
  border: none;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.simsWrapper .navCategory .newCate .btnCategory.navTrue p {
  background: #e00000;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.simsWrapper .navCategory .newCate .btnCategory.navDtac p {
  background: #19aaf8;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.simsWrapper .navCategory .btnCategory {
  width: 120px;
}

.eSimsBox {
  display: flex;
  background: #f9f9fc;
  border-radius: 24px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.eSimsBox .head {
  display: flex;
  align-items: center;
}

.eSimsBox .head span {
  display: flex;
}

.deviceContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.deviceContainer > .cGradient {
  max-width: max-content;
  margin-left: auto;
  margin-right: auto;
}

.deviceContainer .deviceWrapper > .row {
  margin: 0 -14px;
}

.deviceContainer .deviceWrapper > .row [class^=col-] {
  padding: 0 14px;
}

.deviceContainer .deviceWrapper .deviceEsim {
  display: flex;
  width: 100%;
  background: #f9f9fc;
  border-radius: 24px;
  padding: 24px 0;
  margin-bottom: 24px;
  justify-content: center;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
}

.deviceContainer .deviceWrapper .deviceEsim ul {
  display: flex;
  margin: 0 -12px;
  padding: 0;
  flex-direction: column;
}

.deviceContainer .deviceWrapper .deviceEsim ul li {
  display: flex;
  padding: 0;
  margin-bottom: 12px;
}

.deviceContainer .deviceWrapper .deviceEsim ul li .deviceBox {
  display: flex;
  width: 140px;
  flex-direction: column;
  align-items: center;
}

.deviceContainer .deviceWrapper .deviceEsim ul li .deviceBox .image {
  display: block;
  margin-bottom: 10px;
}

.deviceContainer .deviceWrapper .deviceEsim ul li .deviceBox .image img {
  width: 100%;
}

.deviceContainer .deviceWrapper .deviceEsim .buttonControl {
  display: flex;
  margin-top: 10px;
  justify-content: center;
}

.travelContainer {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

.travelContainer .packageWrapper {
  flex-direction: column;
}

.travelContainer .packageWrapper .cardPackage {
  padding: 0;
}

.travelContainer .packageWrapper .cardPackage ul li {
  align-items: center;
}

.travelContainer .packageWrapper .cardPackage ul li p {
  flex-direction: column;
  padding-right: 16px;
}

.travelContainer .packageWrapper .cardPackage .innerWrapper {
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
}

.travelContainer .packageWrapper .cardPackage .innerWrapper .detail {
  width: calc(100% - 106px);
  padding-right: 0;
  padding-left: 28px;
}

.travelContainer .packageWrapper .cardPackage .innerWrapper .buttonControl {
  width: 106px;
  padding-right: 24px;
}

.travelContainer .packageWrapper .cardPackage .innerWrapper .buttonControl .btn {
  min-width: 82px;
}

.travelContainer .titleSection {
  display: flex;
  width: 100%;
}

.travelWrapper {
  display: flex;
  flex-wrap: wrap;
}

.travelWrapper .thumb {
  display: flex;
  width: 100%;
  height: 164px;
  overflow: hidden;
  border-radius: 16px;
}

.travelWrapper .thumb img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.bannerWrapper {
  display: flex;
  width: 100%;
  height: 164px;
  border-radius: 16px;
  overflow: hidden;
}

.bannerWrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.scRoaming .selectPackage .packageBox {
  width: 100%;
  padding: 0;
  border: none;
}

.scRoaming .selectPackage .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: none;
  width: 16px;
  height: 7px;
  background: url("../images/icons/ico-caret-gradient-down.svg") center center/100% no-repeat;
}

.shareContainer {
  display: flex;
  width: 100%;
  padding: 0 16px;
  flex-direction: column;
}

.shareContainer .head {
  display: flex;
  align-items: center;
}

.listSocial {
  display: flex;
  padding: 0;
  margin: 0;
  justify-content: space-between;
}

.listSocial li {
  display: flex;
  margin: 0;
}

.listSocial li .socialLink {
  display: flex;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
}

.listSocial li .socialLink img {
  width: 100%;
}

.listSocial li .btnCopy {
  border-radius: 0;
}

.fancybox-slide--html .fancybox-close-small {
  right: 12px;
  top: 10px;
  width: 34px;
  height: 34px;
}

.fancybox-slide--html .fancybox-close-small svg {
  transform: scale(1);
}

.fancybox-slide--html .fancybox-close-small path {
  fill: #000000;
}

.popupPackage {
  background: none;
  border-radius: 0;
  padding: 0;
  vertical-align: bottom;
}

.popupPackage .innerWrapper {
  width: 320px;
  background: #ffffff;
  border-radius: 24px 24px 0 0;
  display: flex;
  padding: 48px 16px;
  flex-direction: column;
}

.popupPackage .innerWrapper .btn {
  min-width: 310px;
  width: auto;
  height: 48px;
  max-width: min-content;
}

.popupPackage .innerWrapper .head {
  display: flex;
  width: 100%;
  flex-direction: column;
  border-bottom: 1px solid #e9e9ea;
}

.popupPackage .innerWrapper .head .label {
  display: flex;
  -webkit-mask-image: url(../images/mask-label.png);
  mask-image: url(../images/mask-label.png);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  max-width: 212px;
  width: 100%;
  height: 53px;
}

.popupPackage .innerWrapper .head .label span {
  display: flex;
  width: 100%;
  height: 100%;
  padding-right: 20px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
}

.popupPackage .innerWrapper .head .title {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 0 0 18px;
}

.popupPackage .innerWrapper .head .title p {
  display: flex;
}

.popupPackage .innerWrapper .head .title p:first-child {
  width: calc(100% - 100px);
  padding-right: 10px;
}

.popupPackage .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px 0 0;
  flex-direction: column;
}

.popupPackage .innerWrapper .detail ul {
  display: flex;
  width: 100%;
  padding: 0;
  margin: 0;
  flex-direction: column;
}

.popupPackage .innerWrapper .detail ul li {
  width: 100%;
  margin: 0;
  display: flex;
  margin-bottom: 24px;
}

.popupPackage .innerWrapper .detail ul li:last-child {
  margin-bottom: 0;
}

.popupPackage .innerWrapper .detail ul li p {
  display: flex;
  width: calc(100% - 24px);
  padding-left: 16px;
}

.popupPackage .innerWrapper .text {
  border-top: 1px solid #e9e9ea;
}

.popupPackage .innerWrapper .buttonControl {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.popupPackage .innerWrapper .buttonControl > p {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.popupRate {
  background: none;
  border-radius: 0;
  padding: 0;
  vertical-align: bottom;
}

.popupRate .innerWrapper {
  width: 320px;
  background: #ffffff;
  border-radius: 24px 24px 0 0;
  display: flex;
  padding: 48px 28px;
  flex-direction: column;
}

.popupRate .innerWrapper .btn {
  min-width: 100%;
  width: auto;
  height: 40px;
  max-width: min-content;
}

.popupRate .innerWrapper .head {
  display: flex;
  width: 100%;
  flex-direction: column;
  border-bottom: 1px solid #e9e9ea;
}

.popupRate .innerWrapper .head .label {
  display: flex;
  -webkit-mask-image: url(../images/mask-label.png);
  mask-image: url(../images/mask-label.png);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  max-width: 212px;
  width: 100%;
  height: 53px;
}

.popupRate .innerWrapper .head .label span {
  display: flex;
  width: 100%;
  height: 100%;
  padding-right: 20px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
}

.popupRate .innerWrapper .head .title {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 0 0 18px;
}

.popupRate .innerWrapper .head .title p {
  display: flex;
}

.popupRate .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px 0 0;
  flex-direction: column;
}

.popupRate .innerWrapper .detail ul {
  display: flex;
  width: 100%;
  padding: 0;
  margin: 0;
  flex-direction: column;
}

.popupRate .innerWrapper .detail ul li {
  width: 100%;
  margin: 0;
  display: flex;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #d9dadd;
}

.popupRate .innerWrapper .detail ul li:last-child {
  margin-bottom: 0;
}

.popupRate .innerWrapper .detail ul li > div {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
}

.popupRate .innerWrapper .detail ul li > div:last-child {
  padding-left: 24px;
}

.popupRate .innerWrapper .detail ul li p {
  display: flex;
  width: 100%;
  margin-bottom: 8px;
}

.popupRate .innerWrapper .detail ul li p:last-child {
  margin-bottom: 0;
}

.popupRate .innerWrapper .text {
  border-top: 1px solid #e9e9ea;
}

.popupRate .innerWrapper .buttonControl {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.popupRate .innerWrapper .buttonControl > p {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.popupMaps {
  background: none;
  border-radius: 0;
  padding: 20px 0;
}

.popupMaps .innerWrapper {
  width: 300px;
  background: #ffffff;
  border-radius: 0;
  display: flex;
  padding: 0;
  overflow: hidden;
  flex-direction: column;
}

.popupMaps .innerWrapper .btn {
  min-width: 310px;
  width: auto;
  height: 48px;
  max-width: min-content;
}

.popupMaps .innerWrapper .head {
  display: flex;
  width: 100%;
  flex-direction: column;
  border-bottom: 1px solid #e9e9ea;
  background: #f9b72f;
}

.popupMaps .innerWrapper .head .label {
  display: flex;
  -webkit-mask-image: url(../images/mask-label.png);
  mask-image: url(../images/mask-label.png);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  max-width: 212px;
  width: 100%;
  height: 53px;
}

.popupMaps .innerWrapper .head .label span {
  display: flex;
  width: 100%;
  height: 100%;
  padding-right: 20px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%) center center/cover no-repeat;
}

.popupMaps .innerWrapper .head .title {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 16px;
  text-align: center;
  justify-content: center;
}

.popupMaps .innerWrapper .detail {
  display: flex;
  width: 100%;
  padding: 16px 0 0;
  flex-direction: column;
}

.popupMaps .innerWrapper .detail .maps {
  display: flex;
  width: 100%;
  padding: 0 0 15px;
}

.popupMaps .innerWrapper .detail .maps img {
  align-self: center;
  width: 100%;
}

.popupMaps .innerWrapper .detail .listsCountry {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  padding: 16px;
}

.popupMaps .innerWrapper .detail .listsCountry li {
  display: flex;
  flex-direction: column;
  width: 50%;
  list-style: none;
  margin-bottom: 12px;
}

.popupMaps .innerWrapper .text {
  border-top: 1px solid #e9e9ea;
}

.popupMaps .innerWrapper .buttonControl {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.popupMaps .innerWrapper .buttonControl > p {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.popupMaps .fancybox-close-small {
  top: 30px !important;
}

.popupMaps .fancybox-close-small svg {
  transform: scale(1.15);
}

.popupMaps .fancybox-close-small svg path {
  fill: #ffffff;
}

.fancybox-active {
  overflow: hidden;
}

.linkBox {
  display: flex;
  justify-content: center;
}

.linkBox .textLink {
  color: #007ad0;
}

.linkBox .textLink:hover {
  color: #007ad0;
  text-decoration: underline;
}

.bLightGradient {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
}

.bLightGradient::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
  opacity: 0.1;
  z-index: -1;
}

.deliveryWrapper {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 5;
}

.deliveryWrapper i {
  margin-right: 12px;
}

.callCenterWrapper {
  display: flex;
  width: 100%;
  flex-direction: column;
}

.callCenterWrapper .callWrapper {
  display: flex;
  flex-direction: column;
}

.callCenterWrapper .callWrapper .head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.callCenterWrapper .callContainer {
  display: flex;
  width: 100%;
  justify-content: center;
}

.callCenterWrapper .cardCall {
  display: flex;
  margin-right: 24px;
}

.callCenterWrapper .cardCall:last-child {
  margin-right: 0;
}

.callCenterWrapper .cardCall .innerWrapper {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 16px;
  padding: 12px 32px;
  width: 342px;
  border: 1px solid #dee2e6;
}

.en .callCenterWrapper .cardCall .innerWrapper {
  width: 350px;
}
.callCenterWrapper .cardCall .callNumber {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.callCenterWrapper .cardCall .callNumber.-True .btnPrimary:hover {
  background: #e00000;
  border: 1px solid #e00000;
  color: #ffffff;
}
.callCenterWrapper .cardCall .callNumber.-Dtac .btnPrimary:hover .icoCall {
  background-image: url("../images/icons/ico-call-dtac-active.svg");
}

.callCenterWrapper .cardCall .callNumber .btn {
  width: auto;
  height: 40px;
  width: 100%;
  min-width: inherit;
  padding: 0 24px;
  max-width: max-content;
}

.insuranceWrapper {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  border-radius: 24px;
}

.insuranceWrapper .innerWrapper {
  display: flex;
  width: 100%;
  position: relative;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 16px;
  z-index: 5;
}

.insuranceWrapper .insuranceList {
  display: flex;
  padding: 0;
  margin: 0;
  align-items: baseline;
}

.insuranceWrapper .insuranceList li {
  display: flex;
  margin: 0 32px 0 0;
}

.insuranceWrapper .insuranceList li a,
.insuranceWrapper .insuranceList li p {
  display: flex;
  align-items: baseline;
  align-items: center;
  color: #000000;
}

.insuranceWrapper .insuranceList li a i,
.insuranceWrapper .insuranceList li p i {
  margin-right: 12px;
}

.insuranceWrapper .insuranceList li:last-child {
  margin-right: 0;
}

.tabsTrue .cardSims {
  margin: 0 0 48px;
}

.tabsTrue .cardSims .innerWrapper .thumb {
  height: 385px;
}

.tabsTrue .cardSims .innerWrapper .detail {
  height: calc(100% - 385px);
}

.tabsTrue .cardSims .innerWrapper .detail .text {
  margin-top: auto;
}

.tabsDtac .cardSims {
  margin: 0 0 48px;
}

.tabsDtac .cardSims .innerWrapper .thumb {
  height: 408px;
}

.tabsDtac .cardSims .innerWrapper .detail {
  height: calc(100% - 408px);
}

.tabsDtac .cardSims .innerWrapper .detail .text {
  margin-top: auto;
}

.tabsDtac .cardSims .buttonControl {
  flex-direction: row;
}

.tabsDtac .cardSims .buttonControl .btn {
  margin-right: 32px;
  font-size: 14px;
}

.tabsDtac .cardSims .buttonControl .btn:last-child {
  margin-right: 0;
}

.tabsDtac .cardSims .buttonControl .btn.btnOutline {
  color: #19aaf8;
  border-color: #19aaf8;
}

.tabsDtac .cardSims .buttonControl .btn.btnOutline:hover {
  color: #19aaf8;
  background: #ffffff;
  border-color: #007ad0;
}

.tabsDtac .cardSims .buttonControl .btn.btnPrimary {
  background: #19aaf8;
  border-color: #19aaf8;
}

.tabsDtac .cardSims .buttonControl .btn.btnPrimary:hover {
  color: #ffffff;
  background: #19aaf8;
  border-color: #007ad0;
}

.popupCountry {
  background: none;
  border-radius: 16px;
  padding: 20px;
}

.popupCountry .innerWrapper {
  width: 300px;
  background: #ffffff;
  border-radius: 0;
  display: flex;
  padding: 0;
  overflow: hidden;
  flex-direction: column;
  border-radius: 16px;
}

.popupCountry .innerWrapper > header {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 24px 12px;
  text-align: center;
  z-index: 1;
  border-radius: 0;
}

.popupCountry .innerWrapper ul {
  display: flex;
  width: 100%;
  padding: 0;
  flex-direction: column;
}

.popupCountry .innerWrapper ul header {
  display: flex;
  padding: 8px 16px;
  background: #f0f0f3;
  cursor: pointer;
}

.popupCountry .innerWrapper .content {
  display: flex;
  flex-direction: column;
}

.popupCountry .innerWrapper .content ul {
  flex-direction: row;
  flex-wrap: wrap;
  padding: 16px;
}

.popupCountry .innerWrapper .content ul li {
  display: flex;
  width: 33.33333%;
  margin-bottom: 12px;
}

.popupCountry .innerWrapper .remark {
  padding: 8px 16px;
}

.popupCountry .fancybox-close-small {
  border-radius: 50%;
  right: 6px;
  top: 6px;
  background: rgba(255, 255, 255, 0.6);
}

.popupCountry .fancybox-close-small svg {
  transform: scale(0.75);
}

.searchCountries {
  display: flex;
  width: 100%;
}

.searchCountries .formWrapper {
  position: relative;
  display: flex;
  width: 100%;
  padding: 0;
}

.searchCountries .formWrapper .form-control {
  display: flex;
  height: 40px;
  width: 100%;
  border-radius: 40px;
  padding: 0 16px;
  color: #303c46;
  font-size: 14px;
  background: linear-gradient(#ffffff 0 0) padding-box, linear-gradient(90deg, #f00 10%, #ff00a6 50%, #00a6ff 90%) border-box;
  border: 1px solid transparent;
}

.searchCountries .formWrapper .form-control::placeholder {
  color: #000000;
  opacity: 1;
  /* Firefox */
}

.searchCountries .formWrapper .form-control::-ms-input-placeholder {
  /* Edge 12 -18 */
  color: #000000;
}

.searchCountries .formWrapper .btnSearch {
  display: flex;
  border: none;
  outline: 0;
  position: absolute;
  z-index: 5;
  top: 0;
  right: 12px;
  width: 40px;
  padding: 0;
  height: 40px;
  background: url("../images/icons/ico-search.svg") center center/24px auto no-repeat;
}

.headCountries {
  position: relative;
}

.headCountries::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  right: 24px;
  top: 8px;
  transition: all 0.25s ease 0s;
  transform: rotate(0);
  background: url("../images/icons/ico-caret.svg") center center/100% auto no-repeat;
}

.headCountries.active::after {
  transform: rotate(-180deg);
}

.tabsTrue .cardSims .innerWrapper .detail,
.tabsDtac .cardSims .innerWrapper .detail {
  text-align: center;
}

@media only screen and (min-width: 992px) {
  .titleSection .tH2D {
    font-size: 36px !important;
    line-height: 44px !important;
  }
}
.titleSection .textHilight {
  display: inline;
  padding: 6px 26px;
  border-radius: 30px;
}
.titleSection .text {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.scTopic {
  position: relative;
  z-index: 5;
  padding-bottom: 50px;
}

.scPrivilege {
  background: linear-gradient(102.99deg, rgba(255, 218, 212, 0.6) 32.04%, rgba(255, 216, 231, 0.6) 57.46%, rgba(231, 222, 255, 0.6) 74.48%, rgba(190, 233, 255, 0.6) 100%);
}

.cardprivilege {
  display: flex;
  max-width: max-content;
  width: 100%;
  flex-direction: column;
  align-items: center;
  margin: 0 16px 40px;
  min-width: 320px;
}
.cardprivilege .thumb {
  display: flex;
  position: relative;
  max-width: 240px;
  height: 300px;
  width: 100%;
  align-items: center;
  justify-content: center;
  z-index: 5;
}
.cardprivilege .thumb::before {
  content: "";
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: url("../images/aw-window-seat.png") center center/cover no-repeat;
}
.cardprivilege .thumb .image {
  position: relative;
  width: 124px;
  height: 175px;
  overflow: hidden;
  z-index: 0;
  margin-top: 15px;
}
.cardprivilege .thumb .image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.cardprivilege .thumb .icons {
  display: flex;
  width: 80px;
  height: 80px;
  overflow: hidden;
  box-shadow: 0px 5px 20px 0px #0000000d;
  position: absolute;
  bottom: 44px;
  left: 0;
  z-index: 5;
}
.cardprivilege .thumb .icons img {
  width: 100%;
}
.cardprivilege .text {
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  align-items: center;
}
.cardprivilege .listText {
  display: flex;
  align-items: baseline;
  padding: 0;
  margin: 0;
}
.cardprivilege .listText li {
  display: inline-flex;
  align-items: center;
  margin-right: 4px;
}
.cardprivilege .listText li::last-child {
  margin-right: 0;
}
.cardprivilege .listText li .icon {
  display: flex;
  margin-right: 2px;
}

.privilegeWrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.privilegeWrapper .linkBox {
  margin: 0 auto;
  display: flex;
  padding: 20px 70px;
  border-radius: 24px;
  max-width: 440px;
  width: 100%;
  background: rgba(20, 23, 45, 0);
  border: solid 2px #0f0;
  box-sizing: border-box;
  flex-direction: column;
  border-image-slice: 10;
  /* border-radius*2 */
  border-image-repeat: round;
  border-image-width: 10px;
  /* border-radius*2 */
  border-image-source: url("../images/border-gradient.png");
}
.en .privilegeWrapper .linkBox { 
  max-width: 480px;
  width:100%;
}
.privilegeWrapper .linkBox .list {
  display: flex;
  align-items: baseline;
}
.privilegeWrapper .linkBox .list span {
  width: 90px;
}
.en .privilegeWrapper .linkBox .list span {
  width: 150px;
}
.privilegeContainer {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
}

@media only screen and (min-width: 992px) {
  .scCallCenter .titleSection .tH1D,
.scPrivilege .titleSection .tH1D {
    font-size: 56px !important;
    line-height: 64px !important;
  }
}

.scDetail {
  position: relative;
  padding-top: 80px;
  z-index: 0;
}
.scDetail .detailWrapper {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: flex-end;
  position: relative;
}
.scDetail .detailWrapper .awImage {
  display: flex;
  width: 808px;
  position: absolute;
  left: -120px;
  bottom: -150px;
  z-index: 0;
}
.scDetail .detailWrapper .awImage img {
  width: 100%;
}
.scDetail .detailWrapper .detailList {
  display: flex;
  width: 500px;
  justify-content: flex-end;
  flex-direction: column;
  padding: 0;
  margin: 0;
  z-index: 5;
  position: relative;
  margin-bottom: 64px;
}
.scDetail .detailWrapper .detailList li {
  display: flex;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 6px;
}
.scDetail .detailWrapper .detailList li .icon {
  display: flex;
  width: 26px;
  height: 26px;
  margin-right: 6px;
}
.scDetail .detailWrapper .detailList li .icon img {
  width: 100%;
}
.scDetail .customerWrapper {
  display: flex;
  align-items: center;
  width: 100%;
}
.scDetail .cardCustomer {
  display: flex;
  flex-direction: column;
  max-width: 600px;
  width: 100%;
  margin-right: 32px;
  border: 1px solid transparent;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  z-index: 5;
  background: #ffffff;
}
.scDetail .cardCustomer .head {
  display: flex;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 16px;
  min-height: 80px;
  justify-content: center;
  align-items: center;
}
.scDetail .cardCustomer .content {
  display: flex;
  flex-direction: column;
  padding: 40px;
  align-items: center;
  justify-content: center;
}
.scDetail .cardCustomer .content .icon {
  display: flex;
  max-width: 242px;
}
.scDetail .cardCustomer .content .icon img {
  width: 100%;
}
.scDetail .cardCustomer .content .buttonControl {
  display: flex;
  align-items: center;
  justify-content: center;
}
.scDetail .cardCustomer .content .btn {
  border-radius: 30px;
  height: 50px;
  width: 130px;
  align-items: center;
  justify-content: center;
  margin: 0;
  color: #ffffff;
}
.scDetail .cardCustomer .content .btn.btnPrimaryTrue {
  background: linear-gradient(309.52deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
}
.scDetail .cardCustomer .content .btn.btnPrimaryDtac {
  background: linear-gradient(92.53deg, #007ad0 13.39%, #19aaf8 82.37%);
}
.scDetail .cardCustomer.-True::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  border-radius: 23px;
  background: #ffffff;
  z-index: -1;
}
.scDetail .cardCustomer.-True::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: -2;
  border-radius: 24px;
  background: linear-gradient(355deg, #00c8ff -13.26%, #07c0f8 -7.38%, #1dace8 0.45%, #408bcc 9.26%, #6f60a9 20.03%, #b3207a 31.78%, #cc1550 40.59%, #e20b2d 49.4%, #f20514 57.23%, #fb0105 65.06%, #ff0000 70.94%);
}
.scDetail .cardCustomer.-True .head {
  background-image: url("../images/bg-head-true-customer.jpg");
}
.scDetail .cardCustomer.-Dtac {
  background: linear-gradient(#fff 0 0) padding-box, linear-gradient(92.53deg, #007ad0 13.39%, #19aaf8 82.37%);
}
.scDetail .cardCustomer.-Dtac .head {
  background-image: url("../images/bg-head-dtac-customer.jpg");
}
.scDetail .cardCustomer:last-child {
  margin-right: 0;
}

@media only screen and (min-width: 375px) {
  .popupPackage .innerWrapper {
    width: 360px;
  }

  .popupRate .innerWrapper {
    width: 360px;
  }

  .popupMaps .innerWrapper,
.popupCountry .innerWrapper {
    width: 360px;
  }
}
@media only screen and (min-width: 410px) {
  .popupPackage .innerWrapper {
    width: 390px;
  }

  .popupRate .innerWrapper {
    width: 390px;
  }

  .packRecommend {
    justify-content: center;
  }
}
@media only screen and (min-width: 480px) {
  .bannerHero .heroCarousel .owl-dots {
    bottom: 12px;
  }

  .listSocial {
    justify-content: flex-start;
  }

  .listSocial li {
    margin-right: 16px;
  }

  .listSocial li:last-child {
    margin-right: 0;
  }

  .cardNetwork:last-child {
    margin-bottom: 16px;
  }

  .scRoaming .selectPackage .packageBox {
    max-width: 100%;
  }

  .popupMaps .innerWrapper {
    width: 400px;
  }

  .popupMaps .innerWrapper .detail .listsCountry {
    padding: 32px;
  }

  .popupMaps .innerWrapper .detail .listsCountry li {
    width: 33.33333%;
  }
}
@media only screen and (min-width: 768px) {
  .cardRecommend .innerWrapper .buttonControl .btn {
    width: 100%;
    min-width: 100%;
  }

  .packTravel,
.packBenefit {
    margin-right: 0;
  }

  .cardRecommend {
    margin-bottom: 0;
  }

  .selectPackage .packageBox {
    max-width: 340px;
  }

  .serchBox {
    max-width: 500px;
  }

  .cardPackage {
    margin-bottom: 32px;
  }

  .simsWrapper .cateWrapper {
    justify-content: center;
  }

  .simsWrapper .navCategory .btnCategory {
    margin: 0 45px;
  }

  .eSimsBox {
    flex-direction: row;
  }

  .deviceContainer .deviceWrapper .deviceEsim ul {
    flex-direction: row;
  }

  .packSims {
    max-width: 718px;
  }

  .travelContainer .packageWrapper {
    flex-direction: row;
    max-width: 748px;
    margin: 0 auto;
  }

  .travelContainer .packageWrapper .cardPackage {
    padding: 0 16px;
  }

  .shareContainer {
    padding: 0;
  }

  .scRoaming .packageWrapper .row {
    margin: 0 -9px;
  }

  .cardNetwork {
    padding: 0 9px;
    margin-bottom: 18px;
  }

  .popupPackage {
    vertical-align: middle;
  }

  .popupPackage .innerWrapper {
    width: 390px;
    border-radius: 24px;
  }

  .popupRate {
    vertical-align: middle;
  }

  .popupRate .innerWrapper {
    width: 390px;
    border-radius: 24px;
  }

  .popupMaps .innerWrapper {
    width: 680px;
    border-radius: 24px;
  }

  .bannerWrapper {
    height: 270px;
  }

  .travelContainer .packageWrapper .cardPackage .innerWrapper {
    max-width: 335px;
  }

  .deviceContainer .deviceWrapper .deviceEsim {
    max-width: 478px;
    margin: 0 auto 24px;
  }

  .popupCountry .innerWrapper {
    width: 680px;
  }

  .searchCountries .formWrapper {
    width: 500px;
    margin: 0 auto;
  }

  .popupCountry .innerWrapper ul header {
    padding: 9px 32px;
  }

  .popupCountry .innerWrapper .content ul {
    padding: 24px 32px;
  }

  .popupCountry .innerWrapper .remark {
    padding: 32px;
  }

  .popupCountry .innerWrapper .remark:last-child {
    padding-top: 0;
  }

  .popupCountry .innerWrapper .content > ul + .remark {
    padding-top: 0;
  }

  .popupCountry .innerWrapper .content ul li {
    width: 25%;
  }
}
@media only screen and (min-width: 1200px) {
  .travelWrapper {
    width: calc(100% - 342px);
    padding-right: 42px;
    flex-direction: column;
  }

  .travelContainer .packageWrapper {
    flex-direction: column;
    max-width: 342px;
  }

  .travelContainer .packageWrapper .cardPackage {
    padding: 0;
    margin-bottom: 16px;
  }

  .travelContainer .packageWrapper .cardPackage .innerWrapper .detail {
    padding-bottom: 0;
  }

  .bannerWrapper {
    height: 315px;
  }

  .fancybox-slide--html .fancybox-close-small {
    right: 10px;
    top: 10px;
    width: 40px;
    height: 40px;
  }

  .deviceContainer .deviceWrapper .deviceEsim {
    max-width: 100%;
  }

  .serchBox .form-control {
    text-align: left;
  }

  .popupMaps .innerWrapper {
    width: 870px;
  }

  .popupMaps .innerWrapper .detail .listsCountry li {
    width: 25%;
  }

  .popupCountry .innerWrapper .content ul li {
    width: 20%;
  }

  .popupCountry .innerWrapper {
    width: 928px;
  }

  .popupCountry .innerWrapper .remark {
    max-width: 100%;
  }

  .popupCountry .fancybox-close-small {
    top: 0;
    right: 0;
  }

  .popupCountry .innerWrapper > header {
    padding: 24px 32px;
  }
}
@media only screen and (min-width: 1300px) {
  .container {
    max-width: 1200px;
  }

  .packRecommend {
    max-width: 100%;
  }

  .deviceContainer .deviceWrapper .deviceEsim ul li {
    padding: 0 12px;
    margin-bottom: 0;
  }

  .packTravel,
.packBenefit {
    max-width: 1168px;
    position: relative;
    margin: 0 auto;
  }

  .packTravel .owl-theme .owl-nav,
.packBenefit .owl-theme .owl-nav {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
  }

  .packTravel .owl-theme .owl-nav [class*=owl-],
.packBenefit .owl-theme .owl-nav [class*=owl-] {
    position: absolute;
    top: 0;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border: none !important;
    outline: 0 !important;
    background-color: transparent !important;
  }

  .packTravel .owl-theme .owl-nav [class*=owl-] span,
.packBenefit .owl-theme .owl-nav [class*=owl-] span {
    display: flex;
    width: 100%;
    height: 100%;
    background-size: 100% auto;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
    text-indent: -9999999px;
  }

  .packTravel .owl-theme .owl-nav .owl-prev,
.packBenefit .owl-theme .owl-nav .owl-prev {
    left: -70px;
  }

  .packTravel .owl-theme .owl-nav .owl-prev span,
.packBenefit .owl-theme .owl-nav .owl-prev span {
    background-image: url("../images/icons/ico-arrow-prev.png");
  }

  .packTravel .owl-theme .owl-nav .owl-next,
.packBenefit .owl-theme .owl-nav .owl-next {
    right: -55px;
  }

  .packTravel .owl-theme .owl-nav .owl-next span,
.packBenefit .owl-theme .owl-nav .owl-next span {
    background-image: url("../images/icons/ico-arrow-next.png");
  }

  .packTravel .owl-theme .owl-nav .disabled,
.packBenefit .owl-theme .owl-nav .disabled {
    opacity: 0;
  }

  .packageWrapper {
    max-width: 1168px;
  }

  .packageWrapper .row {
    margin: 0 -35px;
  }

  .packSims {
    max-width: 1168px;
  }

  .packSims .row {
    margin: 0 -35px;
  }

  .cardPackage {
    padding: 0 35px;
    margin-bottom: 46px;
  }

  .cardSims {
    padding: 0 35px;
    margin-bottom: 46px;
  }

  .travelContainer .packageWrapper .cardPackage .innerWrapper {
    max-width: 342px;
  }
}
@media only screen and (max-width: 360px) {
  .packRecommend .sliderControl {
    width: 100%;
  }

  .packRecommend .sliderControl .cardRecommend .innerWrapper {
    width: 100%;
  }
}
@media only screen and (max-width: 991px) {
  .insuranceWrapper .insuranceList {
    flex-wrap: wrap;
    justify-content: center;
  }

  .insuranceWrapper .insuranceList li {
    margin-bottom: 16px;
  }

  .insuranceWrapper .insuranceList li:last-child {
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 767px) {
  .tabsTrue .cardSims,
.tabsDtac .cardSims {
    margin: 0 auto 32px;
  }

  .insuranceWrapper .innerWrapper {
    padding: 32px 16px;
  }

  .insuranceWrapper .insuranceList {
    justify-content: flex-start;
    flex-direction: column;
  }

  .insuranceWrapper .insuranceList li {
    margin-right: 0;
  }

  .simsWrapper .cateWrapper.newCate {
    justify-content: center;
  }

  .simsWrapper .cateWrapper.newCate .btnCategory {
    margin: 0 50px 0 0;
  }

  .simsWrapper .cateWrapper.newCate .btnCategory:last-child {
    margin-right: 0;
  }

  .packSims {
    justify-content: center;
  }

  .callCenterWrapper .cardCall:last-child {
    margin-right: auto;
  }

  .callCenterWrapper .cardCall .innerWrapper {
    margin: 0 auto;
  }
}
@media only screen and (max-width: 480px) {
  .callCenterWrapper .callContainer {
    flex-direction: column;
  }

  .callCenterWrapper .cardCall {
    margin: 0 auto 12px;
    width: 100%;
  }

  .callCenterWrapper .cardCall:last-child {
    margin-bottom: 0;
  }

  .tabsTrue .cardSims:last-child,
.tabsDtac .cardSims:last-child {
    margin-bottom: 8px;
  }

  .callCenterWrapper .cardCall .innerWrapper {
    width: 100%;
    max-width: 342px;
  }

  .cardSims .innerWrapper {
    width: 100%;
    max-width: 342px;
  }

  .packSims .row {
    display: flex;
    flex-direction: column;
    margin: 0;
  }

  .tabsTrue .cardSims,
.tabsDtac .cardSims {
    padding: 0;
  }
}
@media only screen and (max-width: 320px) {
  .cardSims .innerWrapper {
    width: 285px;
    max-width: 100%;
  }

  .tabsDtac .cardSims .innerWrapper .thumb {
    height: 340px;
  }

  .tabsTrue .cardSims .innerWrapper .detail,
.tabsDtac .cardSims .innerWrapper .detail {
    height: auto;
  }

  .tabsTrue .cardSims .innerWrapper .thumb {
    height: 320px;
  }

  .cardSims .innerWrapper .detail .text {
    padding: 24px 8px;
  }
}
.tcList header {
  position: relative;
  padding: 16px 40px 16px 56px;
  cursor: pointer;
}

.tcList header {
  padding-top: 0;
  padding-left: 8px;
}

.tcList header::after {
  display: none;
}

.tcList .content li > a {
  transition: all 0.3s ease;
}

.tcList header i.icoPlus {
  position: absolute;
  top: 6px;
  right: 0;
  background: url("../images/icons/ico-plus.svg") center center no-repeat;
  background-size: 100% auto;
  transition: all 0.3s ease;
}

.tcList.active header i.icoPlus {
  background: url(../images/icons/ico-minus.svg) center center no-repeat !important;
  background-size: 100% auto !important;
  transform: rotate(180deg);
}

.tcList {
  border: transparent;
  border-bottom: 1px solid #dee2e6;
}

.tcList header i.icoArrow {
  position: absolute;
  top: 14px;
  right: 24px;
  background: url("../images/icons/ico-arrow.png") center center no-repeat;
  background-size: 100% auto;
  transition: all 0.3s ease;
  transform: rotate(90deg);
}

.tcList.active header i.icoArrow {
  transform: rotate(-90deg);
}

.innerWrapper .headPopup {
  position: relative;
}

.innerWrapper .headPopup:before {
  background: linear-gradient(90deg, #f00 10%, #ff00a6 40%, #00a6ff 70%);
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.1;
}

.popupMaps .tcList header {
  padding-left: 16px;
}

.popupMaps .tcList .content {
  padding: 0;
}

.popupMaps .innerWrapper.innerCountry .detail .listsCountry {
  padding: 16px;
}

.popupMaps .innerWrapper.innerCountry,
.popupTC .innerWrapper {
  width: 320px;
  border-radius: 8px;
}

.popupMaps .tcList {
  border: transparent;
  border-bottom: 1px solid #fff;
}

.popupMaps .tcList:nth-child(n+2) {
  margin-top: 0;
}

.popupMaps .fancybox-close-small svg path {
  fill: #000;
}

.popupTC {
  padding: 0;
  border-radius: 8px;
  overflow: hidden;
}

.popupTC .detail {
  padding: 16px 12px !important;
}

.popupTC .detail .-images img {
  height: 150px;
  width: auto;
}

.tcList .content ol {
  counter-reset: item;
}

.tcList .content ol > li {
  display: block;
}

.tcList .content ol > li:before {
  content: counters(item, ".") " . ";
  counter-increment: item;
}

@media only screen and (min-width: 480px) {
  .popupMaps .innerWrapper .detail .listsCountry li {
    width: 24%;
  }

  .popupMaps .innerWrapper.innerCountry,
.popupTC .innerWrapper {
    width: 480px;
    border-radius: 12px;
  }

  .popupTC .detail {
    padding: 24px 16px !important;
  }
}
@media only screen and (min-width: 768px) {
  .popupMaps .innerWrapper.innerCountry,
.popupTC .innerWrapper {
    width: 600px;
    border-radius: 12px;
  }

  .popupMaps .tcList header {
    padding-left: 24px;
  }

  .popupMaps .innerWrapper.innerCountry .detail .listsCountry {
    padding: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .popupMaps .innerWrapper.innerCountry {
    width: 928px;
    border-radius: 12px;
  }

  .popupMaps .innerWrapper.innerCountry .detail .listsCountry li {
    width: 16.5%;
  }

  .popupTC {
    border-radius: 16px;
  }

  .popupTC .innerWrapper {
    width: 800px;
  }
}
@media only screen and (max-width: 1200px) {
  .scDetail .detailWrapper .awImage {
    width: 500px;
    left: -50px;
    bottom: -20px;
  }
}
@media only screen and (max-width: 991px) {
  .scTopic {
    padding-bottom: 0;
  }

  .scDetail .detailWrapper {
    justify-content: center;
    align-items: center;
  }

  .scDetail .detailWrapper .awImage {
    position: relative;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
  }

  .scDetail .detailWrapper {
    flex-direction: column-reverse;
  }

  .scDetail .detailWrapper .detailList {
    margin-bottom: -30px;
  }

  .scDetail .detailWrapper .detailList li .icon {
    width: 20px;
    height: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fancybox-slide--html .popupTC .fancybox-close-small {
    right: 8px;
    top: 10px;
    width: 24px;
    height: 24px;
  }

  .serchBox .btnSubmit {
    width: 16px;
  }

  .scDetail .detailWrapper .detailList {
    width: 100%;
  }

  .titleSection .text {
    flex-direction: column;
  }

  .scDetail .cardCustomer .content .icon {
    width: 140px;
  }

  .scDetail .cardCustomer .head {
    min-height: 60px;
  }

  .callCenterWrapper .cardCall .innerWrapper {
    width: 300px;
  }

  .cardprivilege .thumb .icons {
    bottom: 30px;
    width: 60px;
    height: 60px;
  }

  .cardprivilege {
    min-width: 100%;
    width: 100%;
    margin-bottom: 10px;
  }

  .privilegeWrapper .linkBox {
    padding: 16px;
    align-items: center;
    max-width: 300px;
    min-height: 100px;
  }
}
@media only screen and (max-width: 480px) {
  .scDetail .customerWrapper {
    flex-direction: column;
    width: 100%;
  }

  .scDetail .cardCustomer {
    width: 100%;
    margin: 0 auto 16px;
  }

  .cardprivilege .listText {
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
  }

  .privilegeWrapper .linkBox {
    padding: 16px;
    align-items: center;
  }

  .callCenterWrapper .cardCall .innerWrapper {
    width: 100%;
  }
}