html, body {
height: 100%;
height: 100vh;
}
body {
font-family: Tahoma, Geneva, sans-serif;
font-size: 100%;
color: #333;
line-height: 1.125em;
-webkit-text-size-adjust: none;
text-size-adjust: none;
/*filter: grayscale(0.9);
filter: gray;
-webkit-filter: grayscale(90%);*/
}
@font-face {
font-family: 'TrueBoldSpecial';
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBoldSpecial/true_bold_special-webfont.eot');
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBoldSpecial/true_bold_special-webfont.eot?#iefix') format('embedded-opentype'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBoldSpecial/true_bold_special-webfont.woff2') format('woff2'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBoldSpecial/true_bold_special-webfont.woff') format('woff'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBoldSpecial/true_bold_special-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'TrueBold';
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBold/true_bold-webfont.eot');
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBold/true_bold-webfont.eot?#iefix') format('embedded-opentype'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBold/true_bold-webfont.woff2') format('woff2'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBold/true_bold-webfont.woff') format('woff'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueBold/true_bold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'TrueLight';
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueLight/true_light-webfont.eot');
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueLight/true_light-webfont.eot?#iefix') format('embedded-opentype'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueLight/true_light-webfont.woff2') format('woff2'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueLight/true_light-webfont.woff') format('woff'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueLight/true_light-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'TrueMedium';
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueMedium/true_medium-webfont.eot');
src: url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueMedium/true_medium-webfont.eot?#iefix') format('embedded-opentype'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueMedium/true_medium-webfont.woff2') format('woff2'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueMedium/true_medium-webfont.woff') format('woff'),
url('https://www.true.th/truemoveh/site/assets/layouts/truemoveh/fonts/TrueMedium/true_medium-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
a {
color: #333;
text-decoration: none;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
.clearfix:after {
content: " ";
display: block;
clear: both;
height: 0;
line-height: 0;
visibility: hidden;
}
.clearboth {
clear: both;
}
.style-guide-box {
width: 1280px;
margin: 50px auto 0px;
}
.fixed-body, .fixed-body body {
position: fixed;
width: 100%;
overflow: hidden;
}
.ovf-hidden {
height: 100%;
overflow: hidden;
}
/* --- DISPLAY GROUP --- */
header .tmh-logo, header .home-icon, .top-menu > li:first-child > a:before,
.top-menu > li:first-child > a:after, .user-box, .img-cmn-screen, .banner-inner .img-cmn-screen,
.owl-carousel .owl-item .img-cmn-screen, .confirm-number > div:first-child, .tgl-target-elm,
.splitbox-left .row-element-4 > .tgl-hidden-box, .cmn-tab-head .default-text,
.component-slide .edge-bg-img, .footer-content .true-logo, footer .tgl-br, .split-bg-top,
.copyright, .banner-inner .main-bg-btm, .main-bg-left, .main-bg-top, .content-bg-full,
.main-content .box-content.box-style:first-child .double-shadow:before, .box-top-inner .view-btn,
.user-pvl .gift-red-icon, .other-number > div:first-child, .print-box, .cmn-inline-label-2 .tgl-br,
.cmn-desc-list > li .tgl-br, .inline-row > .tgl-target-elm,
.inline-row-2 > .tgl-target-elm, .edge-bg-in, .component .comp-img-slide li .img-cmn-screen, .tgl-btn-elm,
.hpl-link-box .tgl-br, .img-box-4 .box-ctn-inner-2 + .edge-bg-img, .warning-txt, .md-pic .md-img-box .img-cmn-screen,
.bubble-txt-2 .tgl-br, .large-bnr-img, .vsb-elm.hidden, .middle-prg-ctn .tgl-br-1, .title-txt-box > h3 .tgl-br,
.tgl-tab-txt, .mari-box .msg-txt br, .middle-prg-ctn .tgl-br-2 {
display: none;
}
img, .menu-txt, .first-line-text, .sec-line-text, .service-menu > li > a, .banner-inner a, .banner-inner a img,
.sm-banner > li > a, .tgl-target-elm.actived, .row-element-4 .common-txt, .first-line-text .tgl-txt, .inline-icon > li img,
.cmn-inline-icon .img-icons, .edge-bg-img.actived, .mini-block, .component-slide .edge-bg-img.actived, .edge-bg-in.actived,
.warning-txt.actived, .tgl-target-elm .show-elm, .bubble-txt-2 strong, .bubble-txt-2 p {
display: block;
}
.slick-dots > li, .inline-icon > li, .content-inline > div, .inline-box-inner, .inline-row-2 > .tgl-target-elm.actived,
.inline-row-2 > div, .box-7 .sim-list > li, .heading-title > span, .tgl-btn-elm.actived {
display: inline-block;
}
/* --- V-MIDDLE WITH FLEXBOX --- */
.cmn-tab-head > li, .cmn-button, .square-button, .main-content .box-content.box-style:first-child .box-top-inner,
.nm-btn, .noti-mini, .select-menu, .inline-elm-6, .checkbox-sm, .box-inner-style .view-btn,
.tab-inner > li, .multiple-col-box, .cmn-heading-box, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.nm-btn.flex-button, .sq-btn-sm, .btn-inline .cmn-button, .tab-inner > li {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
.multiple-col-box {
-ms-flex-flow: wrap column;
-webkit-flex-flow: wrap column;
flex-flow: wrap column;
}
.select-menu, .cmn-heading-box {
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
button.cmn-button, button.square-button, button.nm-btn, button.md-btn, .btn-inline button.cmn-button, .inline-elm-7 > *,
.inline-elm-7 .cmn-input, .btn-inline .btn-target.actived, .img-btn {
display: inline-block;
vertical-align: top;
}
.btn-inline button.btn-target {
display: none;
}
/* --- MARGIN GROUP --- */
.row-element-4:first-child {
margin-top: 0;
}
.row-element-4 .inline-elm-2 {
margin-bottom: 0;
}
.row-element-4 .inline-elm-2 > * {
margin-left: 28px;
}
.row-element-4 .inline-elm-2 > *:first-child {
margin-left: 0;
}
.row-element-4 .abs-txt-box {
font-size: 16px;
margin-bottom: 8px;
}
.row-element-4 .logo-inline {
text-align: left;
margin-bottom: 0;
}
.nm-btn.flex-button:first-child, .desc-txt-sm + .nm-btn.flex-button {
margin-left: auto;
margin-right: auto;
}
/* --- PADDING GROUP --- */
.splitbox-right .ctn-acd-header {
padding-left: 0;
}
/* --- BORDER GROUP --- */
.box-ctn-acd:first-child .ctn-acd-header {
border-top: none;
}
/* --- TOOGLE MAX-HEIGHT --- */
.main-menu-box, .sub-menu, .main-sub-menu, .tgl-menu-elm {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
transition: transform 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
.desktop .has-submenu:hover > .main-sub-box > .main-sub-menu, .has-submenu.selected > .main-sub-box > .main-sub-menu, .has-submenu.selected .sub-menu-wrap > .sub-menu, .desktop .has-submenu:hover .sub-menu-wrap > .sub-menu, .tgl-menu-elm.actived, .main-menu-box.actived {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.main-sub-menu {
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.desktop .has-submenu:hover > .main-sub-box > .main-sub-menu, .has-submenu.selected > .main-sub-box > .main-sub-menu {
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
/* --- PLACEHOLDER --- */
::-webkit-input-placeholder {
color: #555;
}
:-moz-placeholder { /* Firefox 18- */
opacity: 1;
color: #555;
}
::-moz-placeholder { /* Firefox 19+ */
opacity: 1;
color: #555;
}
:-ms-input-placeholder {
color: #555;
}
/* --- ALIGNMENT --- */
.align-center {
text-align: center;
}
.align-left {
text-align: left;
}
.align-right {
text-align: right;
}
.inline-elm > *, .inline-elm-2 > *, .inline-elm-3 > *, .inline-elm-4 > *, .inline-elm-5 > *, .inline-elm > .input-mini, .inline-elm > .cmn-input {
display: inline-block;
vertical-align: top;
}
.inline-elm-2 {
margin-bottom: 15px;
}
.inline-elm-3 {
margin-bottom: 30px;
}
.inline-elm > *, .inline-elm > .input-mini {
margin-left: 10px;
}
.inline-elm-2 > * {
margin-left: 13.33333333333333%;
}
.label-heading + .inline-elm-2 > div {
margin-top: 10px;
margin-left: 0;
margin-right: 13.33333333333333%;
}
.label-heading + .inline-elm-2 > div:last-child {
margin-right: 0;
}
.label-heading .cmn-txt-label {
margin-top: 0.1666666666666667em;
}
.inline-elm-3 > * {
margin-left: 10px;
}
.inline-elm-4 > * {
margin-left: 5px;
}
.inline-elm-5 > *, .inline-elm-5 > .cmn-inline-label {
vertical-align: middle;
}
.inline-elm-5 > .cmn-inline-label {
width: 35%;
margin-left: 0;
text-align: right;
}
.inline-elm-5 > .cmn-inline-label + div {
position: relative;
width: 63.33333333333333%;
}
.inline-elm-5 > .cmn-inline-label + div .cmn-txt-label-btm {
position: absolute;
margin-top: 1.666666666666667%;
}
.inline-elm-6 {
-ms-flex-pack: flex-start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.inline-elm-6 > * {
margin-left: 5px;
margin-left: 1.5625vw;
}
.inline-elm > *:first-child, .inline-elm-2 > *:first-child, .inline-elm-3 > *:first-child, .inline-elm-4 > *:first-child, .inline-elm > .input-mini:first-child,
.inline-elm-6 > *:first-child {
margin-left: 0;
}
.spacing-btm {
margin-bottom: 25px;
}
.inline-elm-3 .cmn-label-left, .inline-elm-3 .sm-label-left {
max-width: 72%;
text-align: left;
}
/* --- SPRITE --- */
.img-icons, .sprite-icons {
display: inline-block;
vertical-align: top;
}
.img-icons img {
display: block;
margin: 0 auto;
}
.img-icons .info-txt {
margin-bottom: 3px;
}
.owl-carousel .owl-item .img-icons img {
width: auto;
}
.sprite-icons {
background-image: url(../images/head2.png);
background-repeat: no-repeat;
}
.sprite-bg {
background-image: url(../images/bg/sprite-bg.png);
background-repeat: no-repeat;
}
_:-ms-input-placeholder, :root .sprite-icons {
background-image: url(../images/head2.png);
}
_:-ms-input-placeholder, :root .sprite-bg {
background-image: url(../images/bg/sprite-bg.png);
}
.ie8 .sprite-icons {
background-image: url(../images/head2.png);
}
.true-logo-large {
width: 128px;
height: 47px;
background-position: 0px -2451px;
}
.true-logo {
width: 75px;
height: 27px;
background-size: 600% 7407.407407407407%;
background-position: 9.466666666666667% 4.510897110998479%;
}
.ie8 .true-logo {
width: 72px;
height: 26px;
background-position: 0px -78px;
}
.true-id-logo {
width: 38px;
height: 12px;
background-size: 1406.25% 20000%;
background-position: 0px 1.206030150753769%;
}
.ie8 .true-id-logo {
width: 64px;
height: 20px;
background-position: 0px -2097px;
}
.true-partner-logo {
width: 125px;
height: 103px;
background-position: -175px -2451px;
}
.list-view-icon {
width: 22px;
height: 17px;
background-position: 25.11904761904762% 97.4968394437421%;
background-size: 1500% 8888.888888888889%;
vertical-align: middle;
}
.map-view-icon {
width: 22px;
height: 17px;
background-position: 33.57487922705314% 97.74397972116603%;
background-size: 1250% 7272.727272727273%;
vertical-align: middle;
}
.arw-list-orange {
width: 7px;
height: 12px;
background-position: 39.244851258581235% 10.485093481556342%;
background-size: 3461.5384615384614% 9523.809523809525%;
vertical-align: middle;
}
.phone-cir-red-icon {
width: 18px;
height: 18px;
vertical-align: baseline;
background-position: 36.763005780346816% 95.83858764186634%;
background-size: 2571.4285714285716% 11428.57142857143%;
}
.ie8 .phone-cir-red-icon {
width: 35px;
height: 35px;
background-position: -202px -4660px;
}
.mb-icon-2 {
width: 90px;
height: 86px;
width: 28.125vw;
height: 26.875vw;
background-size: 692.3076923076924% 3200%;
background-position: 27.92207792207792% 89.90967741935484%;
}
.ie8 .mb-icon-2 {
width: 90px;
height: 86px;
background-position: -211px -4281px;
}
.mb-pack-icon {
width: 93px;
height: 86px;
width: 29.0625vw;
height: 26.875vw;
background-size: 500% 2409.6385542168678%;
background-position: 26.52777777777778% 94.41836202399583%;
}
.ie8 .mb-pack-icon {
width: 110px;
height: 101px;
background-position: -190px -4375px;
}
.mb-code-icon {
width: 93px;
height: 86px;
width: 29.0625vw;
height: 26.875vw;
background-size: 500% 2409.6385542168678%;
background-position: 0 94.41836202399583%;
}
.ie8 .mb-code-icon {
width: 110px;
height: 101px;
background-position: -190px -4485px;
}
.tmh-sim-icon {
width: 74px;
height: 86px;
width: 23.125vw;
height: 26.875vw;
background-size: 750% 2857.1428571428573%;
background-position: 45.51282051282051% 90.25906735751296%;
}
.ie8 .tmh-sim-icon {
width: 73px;
height: 85px;
background-position: 0 -4506px;
}
.deliver-sim-icon {
width: 136px;
height: 86px;
width: 42.5vw;
height: 26.875vw;
background-size: 355.7312252964427% 2500%;
background-position: 58.887171561051% 94.97395833333333%;
}
.ie8 .deliver-sim-icon {
width: 118px;
height: 85px;
background-position: 0 -4410px;
}
.number-one-icon {
width: 47px;
height: 31px;
width: 14.6875vw;
height: 9.6875vw;
background-size: 497.2375690607735% 3305.785123966942%;
background-position: 100% 30.05929363237948%;
}
.number-one-th-icon {
width: 38px;
height: 31px;
width: 11.875vw;
height: 11.5625vw;
background-size: 725.8064516129032% 3333.333333333333%;
background-position: 73.74517374517375% 30.05929363237948%;
}
.music-icon {
width: 17px;
height: 19px;
width: 5.3125vw;
height: 5.9375vw;
background-size: 1406.25% 5714.285714285714%;
background-position: 65.66985645933014% 33.20610687022901%;
}
.vdo-icon {
width: 18px;
height: 21px;
width: 5.625vw;
height: 6.5625vw;
background-size: 1384.615384615385% 5333.333333333333%;
background-position: 76.04790419161677% 33.2484076433121%;
}
.joystick-icon {
width: 27px;
height: 18px;
width: 8.4375vw;
height: 5.625vw;
background-size: 1000% 6666.666666666667%;
background-position: 89.01234567901235% 33.12182741116751%;
}
.thumbsup-icon {
width: 18px;
height: 18px;
width: 5.625vw;
height: 5.625vw;
background-size: 1323.529411764706% 5882.352941176471%;
background-position: 100% 33.18921668362157%;
}
.pins-icon {
width: 24px;
height: 23px;
width: 7.5vw;
height: 7.1875vw;
background-size: 1875% 8695.652173913044%;
background-position: 0 96.10520991401113%;
}
.wifi-med-icon {
width: 25px;
height: 20px;
width: 7.8125vw;
height: 6.25vw;
background-size: 2000% 11111.111111111111%;
background-position: 13.216374269005849% 95.86276488395559%;
}
.speed-icon {
width: 24px;
height: 22px;
width: 7.5vw;
height: 6.875vw;
background-size: 2195.1219512195125% 10810.810810810812%;
background-position: 0 97.30002523340903%;
}
.auto-login-icon {
width: 22px;
height: 25px;
width: 6.875vw;
height: 7.8125vw;
background-size: 2500% 9756.09756097561%;
background-position: 25.810185185185187% 95.98383430159132%;
}
.ie8 .speed-icon {
width: 41px;
height: 37px;
background-position: 0 -4660px;
}
.ie8 .wifi-med-icon {
width: 45px;
height: 36px;
background-position: -113px 4604px;
}
.ie8 .pins-icon {
width: 48px;
height: 46px;
background-position: 0 4604px;
}
.ie8 .thumbsup-icon {
width: 36px;
height: 36px;
background-position: -149px -4111px;
}
.ie8 .joystick-icon {
width: 48px;
height: 33px;
background-position: -90px -4111px;
}
.ie8 .vdo-icon {
width: 35px;
height: 40px;
background-position: -45px -4111px;
}
.ie8 .music-icon {
width: 34px;
height: 37px;
background-position: 0 -4111px;
}
.ie8 .number-one-icon, .ie8 .number-one-th-icon {
height: 60px;
}
.ie8 .number-one-icon {
width: 88px;
background-position: -212px -4048px;
}
.ie8 .number-one-th-icon {
width: 60px;
background-position: -240px -4172px;
}
.phone-gray-icon {
width: 22px;
height: 20px;
width: 6.875vw;
height: 6.25vw;
background-size: 1097.560975609756% 5263.157894736842%;
background-position: 94.98777506112469% 13.27726809378186%;
}
.ie8 .phone-gray-icon {
width: 35px;
height: 32px;
background-position: 0 -2519px;
}
.comp-white-icon, .comp-sm {
width: 26px;
width: 8.125vw;
}
.comp-white-icon {
height: 30px;
height: 9.375vw;
background-size: 1046.511627906977% 4081.632653061224%;
background-position: 0 16.86314710404921%;
}
.comp-sm {
height: 30px;
height: 6.875vw;
background-size: 1046.511627906977% 5405.405405405405%;
background-position: 0 16.76006113092206%;
}
.ie8 .comp-white-icon {
height: 50px;
}
.ie8 .comp-white-icon, .ie8 .comp-sm {
width: 44px;
background-position: -199px -3966px;
}
.tv-white-icon {
width: 24px;
height: 22px;
width: 7.5vw;
height: 6.875vw;
background-size: 1125% 5633.802816901408%;
background-position: 14.51219512195122% 16.72181216594553%;
}
.ie8 .tv-white-icon {
width: 40px;
height: 35px;
background-position: -142px -3966px;
}
.gray-mobile-icon {
width: 22px;
height: 30px;
width: 6.875vw;
height: 9.375vw;
background-size: 1250% 4123.711340206186%;
background-position: 69.92753623188406% 13.52805534204458%;
}
.white-mobile-icon {
width: 22px;
height: 30px;
width: 6.875vw;
height: 9.375vw;
background-size: 1250% 4123.711340206186%;
background-position: 82.0048309178744% 13.52805534204458%;
}
.ie8 .gray-mobile-icon, .ie8 .white-mobile-icon {
width: 37px;
height: 49px;
}
.ie8 .gray-mobile-icon {
background-position: -151px -3896px;
}
.ie8 .white-mobile-icon {
background-position: -208px -3896px;
}
.two-mobile-icon {
width: 27px;
height: 30px;
width: 8.4375vw;
height: 9.375vw;
background-size: 882.3529411764706% 3478.260869565217%;
background-position: 100% 25.37966537966538%;
}
.ie8 .two-mobile-icon {
width: 44px;
height: 52px;
background-position: -256px -3965px;
}
.white-4g-txt {
width: 44px;
height: 14px;
width: 13.75vw;
height: 4.375vw;
background-size: 473.6842105263157% 6451.612903225807%;
background-position: 0 51.5997968511935%;
}
.black-4g-txt {
width: 32px;
height: 18px;
width: 10vw;
height: 5.625vw;
background-size: 573.248407643312% 4545.454545454545%;
background-position: 13.593539703903096% 56.97852760736196%;
vertical-align: middle;
}
.white-3g-txt {
width: 24px;
height: 14px;
width: 7.5vw;
height: 4.375vw;
background-size: 1525.423728813559% 11764.70588235294%;
background-position: 100% 28.13918305597579%;
}
.ie8 .white-4g-txt {
width: 55px;
height: 18px;
background-position: -61px -3536px;
}
.ie8 .white-3g-txt {
width: 32px;
height: 18px;
background-position: -269px -4025px;
}
.orange-4g-icon, .yellow-4g-icon, .gray-4g-icon, .cmn-4g-icon {
width: 54px;
height: 30px;
width: 16.875vw;
height: 9.375vw;
}
.orange-4g-icon, .yellow-4g-icon, .gray-4g-icon {
background-size: 569.620253164557% 4545.454545454545%;
}
.orange-4g-icon {
background-position: 0 13.52249488752556%;
}
.yellow-4g-icon {
background-position: 25.43741588156124% 13.52249488752556%;
}
.gray-4g-icon {
background-position: 51.14401076716016% 13.52249488752556%;
}
.cmn-4g-icon {
background-size: 569.620253164557% 4545.454545454545%;
background-position: 13.477088948787062% 54.26891615541922%;
}
.orange-4g-5g-icon, .yellow-4g-5g-icon,
.gray-4g-5g-icon, .white-4g-5g-icon {
width: 28px;
height: 22px;
width: 8.75vw;
height: 6.875vw;
background-image: url(../images/icons/sprite-icons2.png);
background-size: 961.5384615384615% 2380.952380952381%;
}
_:-ms-input-placeholder, :root .orange-4g-5g-icon,
_:-ms-input-placeholder, :root .yellow-4g-5g-icon,
_:-ms-input-placeholder, :root .gray-4g-5g-icon,
_:-ms-input-placeholder, :root .white-4g-5g-icon {
background-image: url(../images/bg/sprite-icons2.png);
}
.orange-4g-5g-icon {
background-position: 34.70982142857143% 55.11482254697286%;
}
.yellow-4g-5g-icon {
background-position: 34.70982142857143% 50.36534446764092%;
}
.gray-4g-5g-icon {
background-position: 34.70982142857143% 45.668058455114824%;
}
.white-4g-5g-icon {
background-position: 34.70982142857143% 40.91858037578288%;
}
.orange-5g-icon, .yellow-5g-icon, .gray-5g-icon {
width: 60px;
height: 27px;
width: 18.75vw;
height: 8.4375vw;
background-image: url(../images/icons/sprite-icons2.png);
background-size: 617.283950617284% 2777.777777777778%;
}
_:-ms-input-placeholder, :root .orange-4g-5g-icon,
_:-ms-input-placeholder, :root .yellow-4g-5g-icon,
_:-ms-input-placeholder, :root .gray-4g-5g-icon {
background-image: url(../images/bg/sprite-icons2.png);
}
.orange-5g-icon {
background-position: 37.11217183770883% 25.20746887966805%;
}
.yellow-5g-icon {
background-position: 37.11217183770883% 28.99377593360996%;
}
.gray-5g-icon {
background-position: 37.11217183770883% 32.780082987551864%;
}
.orange-4g-5g-icon.posi-st2, .yellow-4g-5g-icon.posi-st2, .gray-4g-5g-icon.posi-st2,
.orange-4g-5g-icon.posi-st3, .yellow-4g-5g-icon.posi-st3, .gray-4g-5g-icon.posi-st3 {
top: 35%;
left: 13px;
}
.tag-desc + .orange-4g-5g-icon.posi-st2, .tag-desc + .yellow-4g-5g-icon.posi-st2, .tag-desc + .gray-4g-5g-icon.posi-st2,
.tag-desc + .orange-4g-5g-icon.posi-st3, .tag-desc + .yellow-4g-5g-icon.posi-st3, .tag-desc + .gray-4g-5g-icon.posi-st3 {
top: 42%;
}
.ie8 .yellow-4g-icon, .ie8 .orange-4g-icon, .ie8 .gray-4g-icon {
width: 80px;
height: 46px;
}
.ie8 .yellow-4g-icon {
background-position: -112px -2028px;
}
.ie8 .orange-4g-icon {
background-position: 0px -2028px;
}
.ie8 .gray-4g-icon {
background-position: -222px -2028px;
}
.white-3g-icon, .yellow-3g-icon {
width: 27px;
height: 17px;
width: 8.4375vw;
height: 5.3125vw;
background-size: 1285.714285714286% 9090.909090909091%;
}
.white-3g-icon {
background-position: 39.1566265060241% 16.63296258847321%;
}
.yellow-3g-icon {
background-position: 27.46987951807229% 16.63296258847321%;
}
.ie8 .white-3g-icon, .ie8 .yellow-3g-icon {
width: 37px;
height: 26px;
}
.ie8 .white-3g-icon {
background-position: -263px -861px;
}
.ie8 .yellow-3g-icon {
background-position: -263px -925px;
}
.x-red-icon {
width: 10px;
height: 10px;
background-size: 2250% 10000%;
background-position: 48.95348837209303% 6.969696969696971%;
}
.ie8 .x-red-icon {
width: 11px;
height: 11px;
background-position: -259px -1216px;
}
.gray-wifi-icon, .white-wifi-icon {
width: 28px;
height: 20px;
width: 8.75vw;
height: 6.25vw;
background-size: 1323.529411764706% 8333.333333333333%;
}
.gray-wifi-icon {
background-position: 82.45192307692308% 7.667004048582996%;
}
.white-wifi-icon {
background-position: 92.66826923076923% 7.667004048582996%;
vertical-align: middle;
}
.ie8 .white-wifi-icon {
width: 28px;
height: 20px;
background-position: -209px -2194px;
}
.ie8 .gray-wifi-icon {
width: 34px;
height: 28px;
background-position: -114px -1706px;
}
.vo-wifi-icon {
width: 25px;
height: 25px;
width: 7.8125vw;
height: 7.8125vw;
background-position: 36.45833333333333% 54.88624612202688%;
background-size: 681.8181818181819% 3030.3030303030305%;
}
.ie8 .vo-wifi-icon {
width: 32px;
height: 32px;
background-position: -143px -4017px;
}
.zoom-in-icon {
width: 15px;
height: 15px;
vertical-align: middle;
background-size: 1000% 4444.444444444444%;
background-position: 62.098765432098766% 38.28644501278772%;
}
.arw-tgl-white {
width: 15px;
height: 7px;
width: 4.6875vw;
height: 2.1875vw;
background-size: 3000% 28571.428571428572%;
background-position: 21.49425287356322% 11.690918213748118%;
}
.accd-arrow, .two-way-arw-white {
width: 15px;
height: 7px;
width: 4.6875vw;
height: 2.1875vw;
background-size: 3000% 28571.42857142857%;
background-position: 54.71264367816092% 11.66583040642248%;
}
.accd-arrow.white-accd-arw, .two-way-arw-white {
background-position: 21.49425287356322% 11.66290443942814%;
}
.two-way-arw-white {
width: 12px;
height: 6px;
width: 3.75vw;
height: 1.875vw;
}
.ie8 .two-way-arw-white {
position: absolute;
left: 50%;
top: 50%;
width: 18px;
height: 10px;
background-image: url(../images/icons/sprite-icons.png);
margin-left: -9px;
margin-top: -5px;
}
.accd-arrow.red-accd-arw {
background-position: 44.13793103448276% 10.73758153537381%;
}
.ie8 .accd-arrow {
position: absolute;
top: 50%;
right: 16px;
width: 18px;
height: 10px;
margin-top: -5px;
background-position: -82px -1740px;
}
.ie8 .white-accd-arw {
background-position: -156px -1740px;
}
.two-way-arw-sm-black {
width: 12px;
height: 6px;
width: 3.75vw;
height: 1.875vw;
background-size: 3000% 28571.428571428572%;
background-position: 11.494252873563218% 10.837932764676367%;
}
.ie8 .two-way-arw-sm-black {
width: 14px;
height: 7px;
background-position: 0 -1423px;
}
.img-icons {
margin-top: 3px;
margin-top: 0.9375vw;
}
.img-icons img {
display: block;
width: 100%;
}
.tvsa-icon {
width: 39.67611336032389%;
}
/*.img-icons .tvs-img {
width: 68px;
width: 21.25vw;
}*/
.img-icons .tvs-img {
width: 100%;
max-width: 100%;
max-height: 7.5vw;
}
.img-icons.def-icon .tvs-img {
width: 100%;
max-width: 100%;
max-height: 7.5vw;
}
.topup-tab-icon, .topup-tab-th-icon {
width: 76px;
height: 42px;
width: 23.75vw;
height: 13.125vw;
background-size: 596.0264900662252% 4819.277108433735%;
}
.topup-tab-icon {
background-position: 97.46328437917223% 10.33954557058974%;
}
.topup-tab-th-icon {
background-position: 100% 84.19708960939495%;
}
.ie8 .topup-tab-icon {
width: 180px;
height: 64px;
background-position: -118px -3088px;
}
.fourg-text {
width: 36.5625%;
padding-bottom: 14.6875%;
background-size: 425.531914893617% 2162.162162162162%;
background-position: 100% 54.65268676277851%;
}
.ie8 .fourg-text {
width: 235px;
height: 93px;
padding-bottom: 0;
background-position: -1109px -856px;
}
.family-text {
width: 36.5625%;
padding-bottom: 6.875%;
background-size: 427.3504273504274% 4494.38202247191%;
background-position: 100% 58.98747123497827%;
}
.ie8 .family-text {
width: 235px;
height: 45px;
padding-bottom: 0;
background-position: -1108px -972px;
}
.arw-white-right-icon {
width: 9px;
height: 15px;
width: 2.8125vw;
height: 4.6875vw;
background-size: 4736.842105263158% 12500%;
background-position: 54.02951191827469% 7.056451612903226%;
}
.clock-icon {
width: 33px;
height: 33px;
background-position: -171px -3454px;
}
.black-email-icon {
width: 28px;
height: 21px;
background-position: 14.285714285714285% 89.08952187182095%;
background-size: 1022.7272727272726% 5882.35294117647%;
}
.ie8 .black-email-icon {
width: 26px;
height: 20px;
background-position: -274px -4248px;
}
.black-sms-icon {
width: 28px;
height: 27px;
background-position: 0 89.7770945426595%;
background-size: 891.0891089108911% 4123.711340206186%;
}
.ie8 .black-sms-icon {
width: 28px;
height: 27px;
background-position: -239px -4248px;
}
.sprite-circle-icons {
width: 65px;
height: 65px;
}
.close-signal-circ-icon {
background-position: 0 -3285px;
}
.signal-circ-icon {
background-position: 0 -3370px;
}
.globe-circ-icon {
background-position: 0 -3454px;
}
.login-circ-icon {
background-position: -85px -3285px;
}
.wifi-circ-icon {
background-position: -85px -3369px;
}
.logout-circ-icon {
background-position: -85px -3454px;
}
.price-tag-icon {
width: 32px;
height: 32px;
background-position: -203px -3835px;
}
.md-red-icon {
width: 20px;
height: 40px;
background-position: -280px -3835px;
}
.mb-pack-app-icon {
width: 125px;
height: 125px;
background-size: 360% 1600%;
background-position: 63.84615384615385% 17.52%;
}
.ie8 .mb-pack-app-icon {
width: 126px;
height: 106px;
background-position: -174px -3680px;
}
.pack-icon {
width: 134px;
height: 134px;
background-size: 335.8208955223881% 1492.537313432836%;
background-position: 0 29.09967845659164%;
}
.ie8 .pack-icon {
width: 112px;
height: 112px;
background-position: 0px -3622px;
}
.mtu-icon {
width: 189px;
height: 127px;
background-size: 238.0952380952381% 1574.803149606299%;
background-position: 0 20.95568606513615%;
}
.ie8 .mtu-icon {
width: 142px;
height: 116px;
background-position: 0px -3772px;
}
.mb-upgrade-icon {
width: 140px;
height: 140px;
background-size: 320.2846975088968% 1423.487544483986%;
background-position: 0 37.34874966388814%;
}
.ie8 .mb-upgrade-icon {
width: 142px;
height: 126px;
background-position: -159px -3528px;
}
.bubble-tail {
width: 33px;
height: 21px;
background-size: 1363.636363636364% 9523.809523809524%;
background-position: 92.0863309352518% 16.59929257200606%;
}
.ie8 .bubble-tail {
width: 30px;
height: 19px;
background-position: -271px -1979px;
}
.apple-logo, .android-logo {
position: absolute;
right: 10px;
top: 50%;
width: 20px;
height: 24px;
width: 6.25vw;
height: 7.5vw;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.apple-logo {
background-size: 1730.7692307692307% 6451.612903225807%;
background-position: 52.83018867924528% 33.67191467750127%;
}
.android-logo {
background-size: 1578.9473684210525% 5882.35294117647%;
background-position: 53.143534994068794% 36.03763987792472%;
}
.ie8 .android-logo, .ie8 .apple-logo {
position: absolute;
right: 10px;
top: 50%;
width: 36px;
height: 36px;
margin-top: -18px;
}
.ie8 .android-logo {
background-position: -263px -3230px;
}
.ie8 .apple-logo {
background-position: -216px -3230px;
}
.refresh-icon {
width: 40px;
height: 40px;
background-position: -167px -1383px;
}
.refresh-btn {
cursor: pointer;
position: absolute;
right: 80px;
top: 50%;
margin-top: -20px;
}
.jcb-logo {
width: 50px;
height: 38px;
background-position: 0 100%;
background-size: 775.8620689655172% 4545.454545454545%;
}
.jcb-logo.-small {
width: 21px;
height: 16px;
}
.jcb-logo.-xsmall {
width: 21px;
height: 16px;
}
.krungsri-cdc-logo, .visa-logo, .vrf-visa-logo, .mastercard-cmn-logo, .mastercard-logo, .pci-logo, .jcb-logo {
vertical-align: middle;
}
.krungsri-cdc-logo {
width: 25px;
height: 33px;
background-size: 476.1904761904762% 1680.6722689075632%;
background-position: 0 47.208931419457734%;
}
.ie8 .krungsri-cdc-logo {
width: 33px;
height: 43px;
background-position: 0px -3019px;
}
.visa-logo {
width: 64px;
height: 20px;
background-size: 497.2375690607735% 7017.543859649123%;
background-position: 100% 44.154197311691604%;
}
.visa-logo.-small {
width: 33px;
height: 10px;
}
.visa-logo.-xsmall {
width: 33px;
height: 10px;
}
.ie8 .visa-logo {
width: 58px;
height: 18px;
background-position: -180px -3292px;
}
.vrf-visa-logo {
width: 52px;
height: 30px;
background-size: 300% 2325.581395348837%;
background-position: 100% 47.41379310344828%;
}
.ie8 .vrf-visa-logo {
width: 57px;
height: 25px;
background-position: -48px -3019px;
}
.mastercard-cmn-logo {
width: 47px;
height: 28px;
background-size: 562.5% 4166.666666666666%;
background-position: 77.29729729729729% 41.64959016393443%;
}
.mastercard-cmn-logo.-small {
width: 26px;
height: 16px;
}
.mastercard-cmn-logo.-xsmall {
width: 26px;
height: 16px;
}
.ie8 .mastercard-cmn-logo {
width: 46px;
height: 28px;
background-position: -254px -3292px;
}
.mastercard-logo {
width: 68px;
height: 24px;
background-size: 264.70588235294116% 3333.3333333333335%;
background-position: 42.857142857142854% 45.74742268041237%;
}
.ie8 .mastercard-logo {
width: 71px;
height: 25px;
background-position: -126px -3019px;
}
.pci-logo {
width: 83px;
height: 25px;
background-size: 192.71948608137043% 2797.2027972027972%;
background-position: 47.34411085450346% 50.55742805289085%;
}
.ie8 .pci-logo {
width: 83px;
height: 25px;
background-position: -218px -3019px;
}
.tel-red-icon {
width: 12px;
height: 12px;
width: 3.75vw;
height: 3.75vw;
background-size: 1500% 6666.666666666667%;
background-position: 27.14285714285714% 18.07106598984772%;
}
.ie8 .tel-red-icon {
width: 18px;
height: 18px;
background-position: 0px -2321px;
}
.tel-black-icon, .wifi-black-icon, .sms-black-icon {
width: 24px;
height: 24px;
}
.tel-black-icon {
background-position: 4px -2276px;
}
.wifi-black-icon {
background-position: -21px -2280px;
}
.sms-black-icon {
background-position: -50px -2280px;
}
.wifi-white-icon {
width: 28px;
height: 20px;
background-position: -209px -2194px;
vertical-align: middle;
}
.postpaid-icon {
width: 27px;
height: 43px;
background-size: 1578.9473684210525% 4444.444444444444%;
background-position: 75.91933570581257% 93.04347826086956%;
}
.prepaid-icon {
width: 37px;
height: 43px;
background-size: 555.5555555555555% 2150.537634408602%;
background-position: 100% 89.01415836392239%;
}
.upgrade-icon {
width: 38px;
height: 43px;
background-size: 569.620253164557% 2209.9447513812156%;
background-position: 66.57681940700809% 89.91882691804138%;
}
.devices-icon {
width: 50px;
height: 38px;
background-size: 486.4864864864865% 2816.9014084507044%;
background-position: 100% 93.23483670295491%;
}
.social-icon {
display: block;
width: 22px;
height: 22px;
width: 6.875vw;
height: 6.875vw;
}
.social-icon > img {
display: block;
width: 100%;
}
.facebook-icon {
background-position: -156px -2321px;
}
.line-icon {
background-position: -191px -2321px;
}
.ig-icon {
background-position: -226px -2321px;
}
.whatapp-icon {
background-position: -261px -2321px;
}
.h-icon {
background-position: -171px -3395px;
}
.bb-white-icon {
width: 33px;
height: 33px;
background-position: 0px -2157px;
}
.thumb-up-icon, .thumb-down-icon, .letter-white-icon, .thumb-up-red-icon, .thumb-down-red-icon, .letter-red-icon {
width: 15px;
height: 15px;
}
.thumb-up-icon {
background-position: -57px -2157px;
}
.thumb-up-red-icon {
background-position: -57px -2197px;
}
.thumb-down-icon {
background-position: -108px -2157px;
}
.thumb-down-red-icon {
background-position: -108px -2197px;
}
.letter-white-icon {
background-position: -159px -2157px;
}
.letter-red-icon {
background-position: -159px -2197px;
}
.x-white-med-icon {
width: 20px;
height: 20px;
background-position: -174px -2097px;
}
.q-icon, .a-icon {
width: 52px;
height: 60px;
}
.q-icon {
background-position: 0px -1942px;
}
.a-icon {
background-position: -94px -1942px;
}
.print-gray-icon {
width: 32px;
height: 27px;
background-position: -229px -46px;
}
.mail-icon {
width: 26px;
height: 23px;
background-position: -181px -46px;
}
.inf-icon {
cursor: pointer;
width: 17px;
height: 17px;
vertical-align: middle;
background-size: 2250% 10000%;
background-position: 16.86046511627907% 2.02020202020202%;
}
.ie8 .inf-icon {
width: 21px;
height: 21px;
background-position: -187px -1707px;
}
.plus-white-icon {
width: 20px;
height: 20px;
width: 6.25vw;
height: 6.25vw;
background-size: 967.741935483871% 4301.075268817204%;
background-position: 54.894671623296155% 28.256974660865115%;
}
.ie8 .plus-white-icon {
width: 20px;
height: 21px;
background-position: -44px -1740px;
}
.call-center-icon {
width: 102px;
height: 90px;
background-position: -85px -84px;
}
.numpad-icon {
width: 60px;
height: 86px;
width: 18.75vw;
height: 26.875vw;
background-size: 436.8932038834951% 1351.3513513513515%;
background-position: 100% 68.97948164146868%;
}
.ie8 .numpad-icon {
background-position: -217px -84px;
}
.shop-icon {
width: 92px;
height: 75px;
width: 28.75vw;
height: 23.4375vw;
background-size: 365.8536585365854% 2000%;
background-position: 64.22018348623854% 67.23684210526316%;
}
.ie8 .shop-icon {
background-position: 0px -189px;
}
.viber-app-icon {
width: 12.5vw;
height: 12.5vw;
margin-right: 5px;
border-radius: 5px;
vertical-align: middle;
background-size: 357.14285714285717% 1587.3015873015875%;
background-position: 0 78.84204909284952%;
}
.ie8 .viber-app-icon {
width: 40px;
height: 40px;
background-position: 0 -4017px;
}
.htv-app-icon {
width: 90px;
height: 90px;
width: 28.125vw;
height: 28.125vw;
background-size: 357.14285714285717% 1587.3015873015875%;
background-position: 36.11111111111111% 86.01921024546425%;
}
.ie8 .htv-app-icon {
background-position: -45px -4017px;
}
.mb-check-icon {
width: 76px;
height: 83px;
background-position: -121px -189px;
}
.mb-x-icon {
width: 76px;
height: 83px;
background-position: -225px -189px;
}
.mb-setting-icon {
width: 72px;
height: 83px;
background-position: -225px -294px;
}
.mb-abroad-icon {
width: 66px;
height: 86px;
width: 20.625vw;
height: 26.875vw;
background-size: 584.4155844155845% 2000%;
background-position: 73.7265415549598% 55.868421052631575%;
}
.ie8 .mb-abroad-icon {
width: 72px;
height: 83px;
background-position: -121px -294px;
}
.mb-rate-icon {
width: 72px;
height: 83px;
background-position: -225px -294px;
}
.mb-sim-icon {
width: 90px;
height: 86px;
width: 28.125vw;
height: 26.875vw;
background-size: 426.54028436018956% 2000%;
background-position: 0 67.23684210526316%;
}
.ie8 .mb-sim-icon {
width: 87px;
height: 83px;
background-position: 0px -403px;
}
.mb-right-icon {
width: 71px;
height: 86px;
width: 22.1875vw;
height: 26.875vw;
background-size: 548.7804878048781% 2000%;
background-position: 100% 61.55263157894737%;
}
.ie8 .mb-right-icon {
width: 87px;
height: 83px;
background-position: -225px -403px;
}
.mb-thmap-icon {
width: 62px;
height: 86px;
width: 19.375vw;
height: 26.875vw;
background-size: 625% 2000%;
background-position: 49.60317460317461% 61.55263157894737%;
}
.ie8 .mb-thmap-icon {
width: 60px;
height: 83px;
background-position: -225px -505px;
}
.mb-gbmap-icon {
width: 75px;
height: 86px;
width: 23.4375vw;
height: 26.875vw;
background-size: 529.4117647058823% 2000%;
background-position: 26.301369863013697% 61.55263157894737%;
}
.ie8 .mb-gbmap-icon {
width: 72px;
height: 83px;
background-position: 0px -612px;
}
.mb-dial-icon {
width: 73px;
height: 86px;
width: 22.8125vw;
height: 26.875vw;
background-size: 529.4117647058823% 2000%;
background-position: 31.643835616438352% 67.23684210526316%;
}
.ie8 .mb-dial-icon {
width: 72px;
height: 83px;
background-position: -229px -3411px;
}
.mb-sms-icon {
width: 73px;
height: 86px;
width: 22.8125vw;
height: 26.875vw;
background-size: 529.4117647058823% 2000%;
background-position: 0 61.55263157894737%;
}
.ie8 .mb-sms-icon {
width: 72px;
height: 83px;
background-position: -107px -612px;
}
.mb-wifi-icon {
width: 70px;
height: 86px;
width: 21.875vw;
height: 26.875vw;
background-size: 552.1472392638037% 2000%;
background-position: 74.6268656716418% 61.55263157894737%;
}
.ie8 .mb-wifi-icon {
width: 72px;
height: 83px;
background-position: -225px -612px;
}
.mb-map-icon {
width: 82px;
height: 91px;
width: 25.625vw;
height: 28.4375vw;
background-size: 450% 1809.9547511312217%;
background-position: 51.142857142857146% 78.19528975919555%;
}
.ie8 .mb-map-icon {
width: 92px;
height: 98px;
background-position: -152px -832px;
}
.usd-bank-icon {
width: 80px;
height: 60px;
width: 25vw;
height: 18.75vw;
background-size: 450% 2666.666666666667%;
background-position: 31.71428571428571% 72.05194805194806%;
}
.ie8 .usd-bank-icon {
background-position: 0px -718px;
}
.credit-card-icon {
width: 80px;
height: 60px;
width: 25vw;
height: 18.75vw;
background-size: 450% 2666.666666666667%;
background-position: 0 72.05194805194806%;
}
.ie8 .credit-card-icon {
background-position: -107px -718px;
}
.credit-card {
width: 91px;
height: 60px;
vertical-align: top;
background-size: 612.2448979591836% 4123.711340206186%;
background-position: 100% 41.63464002049705%;
}
.ie8 .credit-card {
width: 147px;
height: 97px;
background-position: 0 -4216px;
}
.signal-icon {
width: 80px;
height: 91px;
width: 25vw;
height: 28.4375vw;
background-size: 414.7465437788019% 1619.4331983805669%;
background-position: 0 85.98454569677591%;
}
.ie8 .signal-icon {
width: 80px;
height: 94px;
background-position: -219px -718px;
}
.scissors-icon {
width: 123px;
height: 91px;
width: 38.4375vw;
height: 28.4375vw;
background-size: 309.27835051546396% 1851.851851851852%;
background-position: 100% 78.09196617336153%;
}
.ie8 .scissors-icon {
width: 116px;
height: 87px;
background-position: 0px -832px;
}
.close-btn-icon {
background-position: -225px -2933px;
}
.bubble-icon-mini {
position: relative;
width: 39px;
height: 34px;
background-size: 1153.846153846154% 5970.149253731343%;
background-position: 82.60340632603406% 16.70480549199085%;
vertical-align: middle;
}
.ie8 .bubble-icon-mini {
position: relative;
top: -2px;
width: 22px;
height: 18px;
background-position: -112px -2939px;
vertical-align: middle;
margin-right: 5px;
}
.x-white-icon {
width: 10px;
height: 10px;
background-size: 4500% 20000%;
background-position: 48.97727272727273% 9.271356783919598%;
}
.xw-icon {
width: 10px;
height: 10px;
background-size: 4500% 20000%;
background-position: 38.97727272727273% 9.246231155778894%;
}
.x-yellow-icon {
width: 15px;
height: 15px;
background-size: 1125% 5000%;
background-position: 53.65853658536586% 70.76530612244898%;
}
.ie8 .x-yellow-icon {
background-position: -176px -2129px;
}
.ie8 .x-white-icon {
width: 12px;
height: 13px;
background-position: -288px -1262px;
}
.x-circle-icon {
width: 30px;
height: 30px;
background-size: 1363.636363636364% 6060.606060606061%;
background-position: 89.92805755395683% 19.39501779359431%;
}
.ie8 .x-circle-icon {
width: 34px;
height: 34px;
background-position: -105px -2097px;
}
.print-icon {
width: 22px;
height: 22px;
width: 6.875vw;
height: 6.875vw;
background-size: 1184.210526315789% 5263.157894736842%;
background-position: 88.10679611650485% 37.97145769622834%;
}
.ie8 .print-icon {
width: 35px;
height: 35px;
background-position: -265px -1563px;
}
.bubble-small-icon {
width: 27px;
height: 22px;
width: 8.4375vw;
height: 6.875vw;
background-size: 1071.428571428571% 5882.352941176471%;
background-position: 100% 37.8942014242116%;
}
.ie8 .bubble-small-icon {
width: 42px;
height: 35px;
background-position: -209px -1563px;
}
.circle-checked-icon, .info-yellow-icon {
width: 36px;
height: 36px;
width: 11.25vw;
height: 11.25vw;
border-radius: 50%;
}
.circle-checked-icon {
background-size: 818.1818181818182% 3636.363636363636%;
background-position: 70.88607594936709% 26.63239074550129%;
}
.info-yellow-icon {
background-size: 1000% 4444.444444444444%;
background-position: 55.30864197530864% 31.125319693094628%;
}
.info-yellow-icon.-fix {
width: 36px;
height: 36px;
}
.ie8 .circle-checked-icon, .ie8 .info-yellow-icon {
width: 53px;
height: 53px;
}
.ie8 .circle-checked-icon {
background-position: -247px -1618px;
}
.ie8 .info-yellow-icon {
background-position: -247px -1618px;
}
.circle-dash-icon {
width: 53px;
height: 53px;
background-position: 0px -3537px;
}
.std-sim {
width: 135px;
height: 83px;
background-position: 0px -1444px;
}
.micro-sim {
width: 85px;
height: 70px;
background-position: -160px -1444px;
}
.nano-sim {
width: 66px;
height: 53px;
background-position: 0px -1540px;
}
.clock-icon {
width: 20px;
height: 20px;
width: 6.25vw;
height: 6.25vw;
background-size: 1216.2162162162163% 5405.405405405406%;
background-position: 83.41404358353512% 27.1523178807947%;
}
.ie8 .clock-icon {
width: 33px;
height: 33px;
background-position: -171px -3454px;
}
.calendar-icon {
width: 20px;
height: 20px;
width: 6.25vw;
height: 6.25vw;
background-size: 900% 4000%;
background-position: 76% 38.20512820512821%;
}
.ie8 .calendar-icon {
width: 32px;
height: 32px;
background-position: -268px -1444px;
}
.info-red-icon {
width: 16px;
height: 16px;
width: 4.6875vw;
height: 4.6875vw;
background-size: 2250% 10000%;
background-position: 16.86046511627907% 3.308080808080808%;
vertical-align: middle;
border-radius: 50%;
}
.ie8 .info-red-icon {
width: 15px;
height: 15px;
background-position: -161px -1711px;
}
.info-white-icon {
width: 22px;
height: 22px;
width: 6.875vw;
height: 6.875vw;
background-size: 2250% 10000%;
background-position: 0 3.4090909090909087%;
vertical-align: middle;
border-radius: 50%;
}
.checked-icon, .checked-white-icon, .checked-grey-icon {
background-size: 2045.454545454545% 11111.11111111111%;
}
.checked-icon {
width: 15px;
height: 12px;
background-position: 61.33177570093458% 1.816347124117053%;
}
.ie8 .checked-icon {
width: 16px;
height: 12px;
background-position: -30px -1707px;
}
.green-checked-icon {
width: 12px;
height: 10px;
width: 3.75vw;
height: 3.125vw;
background-size: 2045.4545454545453% 11111.111111111111%;
background-position: 59.4626168224299% 8.022199798183653%;
vertical-align: middle;
}
.ie8 .green-checked-icon {
width: 12px;
height: 10px;
background-position: -161px -1696px;
}
.checked-white-icon, .checked-grey-icon {
width: 12px;
height: 9px;
width: 3.75vw;
height: 2.8125vw;
}
.checked-white-icon {
background-position: 61.33177570093458% 2.825428859737639%;
}
.checked-grey-icon {
background-position: 61.33177570093458% 6.029263370332997%;
}
.ie8 .checked-white-icon {
width: 12px;
height: 9px;
background-position: -113px -1767px;
}
.star-icon {
width: 25px;
height: 25px;
background-size: 1800% 8000%;
background-position: 8.352941176470588% 2.025316455696203%;
}
.ie8 .star-icon {
width: 20px;
height: 20px;
background-position: -141px -558px;
}
.fb-icon, .tw-icon, .yt-icon {
width: 25px;
height: 25px;
background-size: 1500% 6666.666666666667%;
}
.fb-icon {
background-position: 32.02380952380952% 4.483627204030227%;
}
.tw-icon {
background-position: 41.54761904761905% 4.483627204030227%;
}
.yt-icon {
background-position: 51.07142857142857% 4.483627204030227%;
}
.ie8 .fb-icon {
background-position: -90px -1563px;
}
.ie8 .tw-icon {
background-position: -128px -1563px;
}
.ie8 .yt-icon {
background-position: -166px -1563px;
}
.pointer-icon {
width: 14px;
height: 21px;
background-size: 3333.333333333333% 10000%;
background-position: 30.92783505154639% 1.742424242424242%;
}
.ie8 .pointer-icon {
width: 12px;
height: 16px;
background-position: 0px -130px;
margin-top: -8px;
}
.ots-icon {
width: 19px;
height: 18px;
background-size: 1800% 8510.63829787234%;
background-position: 0 5.666582342524665%;
}
.ie8 .ots-icon {
width: 19px;
height: 18px;
background-position: -56px -130px;
margin-top: -9px;
}
.cart-icon {
width: 24px;
height: 18px;
background-size: 1764.705882352941% 10526.31578947368%;
background-position: 42.04946996466431% 1.7293997965412%;
}
.ie8 .cart-icon {
width: 20px;
height: 14px;
background-position: -27px -130px;
}
.faq-icon {
width: 19px;
height: 19px;
background-size: 2368.421052631579% 10526.31578947368%;
background-position: 0px 4.492680464411913%;
}
.ie8 .faq-icon {
width: 18px;
height: 18px;
background-position: 0px -159px;
margin-top: -9px;
}
.bubble-icon {
width: 20px;
height: 19px;
background-size: 2250% 10526.31578947368%;
background-position: 54.76744186046512% 1.741544674406865%;
}
.ie8 .bubble-icon {
width: 16px;
height: 16px;
background-position: -28px -159px;
margin-top: -8px;
}
.x-gray {
width: 11px;
height: 11px;
background-position: -259px -1237px;
}
.doc-yel-icon {
width: 14px;
height: 18px;
width: 4.375vw;
height: 5.625vw;
background-size: 1125% 3846.153846153846%;
background-position: 0 54.4917864476386%;
}
.ie8 .doc-yel-icon {
background-position: -286px -84px;
}
.white-money-icon, .gray-money-icon {
width: 22px;
height: 22px;
width: 6.875vw;
height: 6.875vw;
background-size: 1551.724137931034% 6896.551724137931%;
}
.white-money-icon {
background-position: 86.81710213776722% 25.01268391679351%;
}
.gray-money-icon {
background-position: 78.50356294536817% 25.01268391679351%;
}
.ie8 .white-money-icon, .ie8 .gray-money-icon {
height: 30px;
width: 30px;
}
.ie8 .white-money-icon {
background-position: 0 -1740px;
}
.ie8 .gray-money-icon {
background-position: -70px -3921px;
}
.gift-white-icon {
width: 19px;
height: 19px;
background-size: 2500% 10256.410256410258%;
background-position: 55.43981481481482% 3.0547841454178237%;
}
.ie8 .gift-white-icon {
background-position: -160px -1237px;
}
.gift-red-icon {
width: 19px;
height: 20px;
background-size: 2500% 10256.41025641026%;
background-position: 49.65277777777778% 3.054784145417824%;
}
.ie8 .gift-red-icon {
width: 19px;
height: 19px;
background-position: -282px -47px;
}
.desktop .gift-red-icon {
width: 19px;
height: 19px;
background-image: url(../images/icons/sprite-icons.png);
background-size: auto;
background-position: -282px -47px;
}
.bubble-red-icon {
width: 25px;
height: 20px;
background-position: 0 -1237px;
}
.search-icon {
width: 16px;
height: 16px;
background-position: -31px -1237px;
}
.lte4g-icon {
width: 274px;
height: 172px;
background-position: -9px -1045px;
}
.home-icon {
width: 18px;
height: 16px;
background-size: 2250% 11428.57142857143%;
background-position: 24.06976744186047% 1.210592686002522%;
}
.ie8 .home-icon {
width: 18px;
height: 16px;
background-position: -214px -10px;
}
.tmh-logo {
width: 118px;
height: 18px;
background-size: 382.9787234042553% 11111.11111111111%;
background-position: 0px 0px;
}
.ie8 .tmh-logo {
width: 192px;
height: 32px;
background-position: 0px 0px;
}
.iservice-icon {
width: 25.23364485981308%;
padding-bottom: 24.29906542056075%;
background-size: 1666.666666666667% 7692.307692307692%;
background-position: 60.16548463356974% 0;
}
.ie8 .iservice-icon {
width: 19px;
height: 19px;
padding-bottom: 0;
background-position: 0px -46px;
}
.heart-icon {
width: 20.5607476635514%;
padding-bottom: 17.75700934579439%;
background-size: 2093.023255813953% 10526.31578947368%;
background-position: 51.22520420070012% 0;
}
.ie8 .heart-icon {
width: 17px;
height: 15px;
padding-bottom: 0;
background-position: -67px -46px;
}
.person-red-icon {
width: 19.62616822429907%;
padding-bottom: 20.5607476635514%;
background-size: 2142.857142857143% 9090.909090909091%;
background-position: 42.65734265734266% 0;
}
.ie8 .person-red-icon {
width: 16px;
height: 16px;
padding-bottom: 0;
background-position: -33px -46px;
}
.person-icon {
width: 18px;
height: 18px;
background-size: 2500% 11111.11111111111%;
background-position: 35.53240740740741% 0;
}
.arw-mail-icon {
width: 37px;
height: 23px;
background-size: 750% 5479.45205479452%;
background-position: 56.282051282051285% 41.40565317035905%;
}
.ie8 .arw-mail-icon {
background-position: -105px -3230px;
}
.phone-sm-icon, .phone-md-icon, .phone-large-icon {
background-size: 1267.605633802817% 6060.606060606061%;
background-position: 100% 19.42043721403152%;
}
.phone-md-icon {
width: 28px;
height: 26px;
width: 8.75vw;
height: 8.125vw;
}
.phone-sm-icon {
width: 21px;
height: 20px;
width: 6.5625vw;
height: 6.25vw;
}
.phone-large-icon {
width: 35px;
height: 33px;
width: 10.9375vw;
height: 10.3125vw;
}
.ie8 .phone-sm-icon {
width: 17px;
height: 17px;
background-position: -142px -505px;
}
.ie8 .phone-md-icon {
width: 24px;
height: 24px;
background-position: -107px -505px;
}
.ie8 .phone-large-icon {
width: 35px;
height: 35px;
background-position: -179px -505px;
}
.grey-arw-icon {
width: 10px;
height: 14px;
background-size: 4736.842105263158% 14285.71428571429%;
background-position: 54.02951191827469% 9.264853977844914%;
}
.en-flag, .th-flag {
width: 29px;
height: 18px;
}
.en-flag {
background-size: 1551.724137931034% 11111.11111111111%;
background-position: 11.37440758293839% 7.038345105953582%;
}
.th-flag {
background-size: 1551.724137931034% 11111.11111111111%;
background-position: 0px 7.038345105953582%;
}
.ie8 .en-flag, .ie8 .th-flag {
width: 19px;
height: 12px;
}
.ie8 .en-flag {
background-position: -130px -46px;
}
.ie8 .th-flag {
background-position: -97px -46px;
}
.qmark-icon, .qmark-sm-icon {
cursor: pointer;
}
.arw-green-sm-right-2 {
width: 11px;
height: 17px;
background-size: 3600% 9523.809523809525%;
background-position: 5.942857142857143% 9.32289034866094%;
}
.ie8 .arw-green-sm-right-2 {
width: 11px;
height: 17px;
background-position: -283px -2364px;
}
.arw-black-right, .arw-black-btm {
width: 7px;
height: 15px;
width: 2.1875vw;
height: 4.6875vw;
background-size: 6428.571428571429% 13333.33333333333%;
background-position: 16.81715575620767% 10.45340050377834%;
}
.ie8 .arw-black-right {
width: 10px;
height: 18px;
background-position: -166px -1618px;
}
.arw-hpl {
width: 6px;
height: 11px;
background-position: -294px -2414px;
margin-left: 10px;
}
.arw-black-med-right {
width: 8px;
height: 17px;
background-size: 6428.571428571429% 13333.333333333334%;
background-position: 16.817155756207676% 10.453400503778337%;
}
.ie8 .arw-black-med-right {
width: 10px;
height: 18px;
background-position: -191px -2414px;
}
.arw-black-btm {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.ie8 .arw-black-btm {
width: 18px;
height: 10px;
background-position: -156px -1760px;
}
.arw-white-right {
width: 14px;
width: 4.375vw;
height: 27px;
height: 8.4375vw;
background-size: 3333.333333333333% 7547.169811320755%;
background-position: 58.07560137457045% 4.611097035723334%;
}
.ie8 .arw-white-right {
width: 16px;
height: 31px;
background-position: -273px -983px;
}
.arw-gray-right {
width: 12px;
height: 18px;
background-position: -186px -1981px;
}
.arw-gray-sm-right {
width: 6px;
height: 11px;
width: 1.875vw;
height: 3.4375vw;
vertical-align: middle;
background-size: 6428.571428571429% 13333.33333333333%;
background-position: 49.43566591422122% 11.48614609571788%;
}
.ie8 .arw-gray-sm-right {
width: 8px;
height: 12px;
background-position: -187px -1638px;
}
.arw-white-sm-right {
width: 11px;
height: 18px;
background-position: -213px -959px;
}
.arw-white-sm-right-2 {
width: 11px;
height: 17px;
background-position: -225px -2414px;
}
.arw-white-sm-right-3 {
width: 5px;
height: 10px;
margin-left: 5px;
background-size: 6428.571428571429% 13333.33333333333%;
background-position: 27.87810383747178% 11.51133501259446%;
vertical-align: middle;
width: 1.5625vw;
height: 3.125vw;
margin-left: 1.5625vw;
}
.ie8 .arw-white-sm-right-3 {
width: 6px;
height: 11px;
background-position: 100% -2434px;
}
.arwl-white-left, .arwl-white-right {
width: 10px;
height: 18px;
}
.arwl-white-left {
background-position: -290px -1496px;
}
.arwl-white-right {
background-position: -268px -1496px;
}
.arw-orange-right {
width: 10px;
height: 17px;
width: 2.5vw;
height: 4.6875vw;
background-size: 4500% 11764.70588235294%;
background-position: 30.45454545454545% 3.177004538577912%;
vertical-align: middle;
}
.ie8 .arw-orange-right {
width: 20px;
height: 20px;
background-position: 0px -545px;
vertical-align: middle;
}
.arw-orange-sm-right {
width: 8px;
height: 14px;
width: 2.5vw;
height: 4.375vw;
background-size: 3750% 10000%;
background-position: 39.26940639269406% 10.47979797979798%;
}
.ie8 .arw-orange-sm-right {
width: 11px;
height: 18px;
background-position: -238px -960px;
}
.arw-gray-sm-right-2 {
width: 11px;
height: 17px;
background-size: 3600% 9523.809523809525%;
background-position: 5.942857142857143% 10.88933804951996%;
}
.ie8 .arw-gray-sm-right-2 {
background-position: -261px -2414px;
background-image: url(../images/icons/sprite-icons.png);
}
.arw-gray-large-right {
width: 35px;
height: 60px;
background-size: 1500% 4000%;
background-position: 32.38095238095238% 75.76923076923077%;
}
.ie8 .arw-gray-large-right {
width: 35px;
height: 60px;
background-position: -47px -505px;
}
.arw-blue-right, .arw-red-right {
width: 7px;
height: 12px;
background-size: 6000% 15384.61538461538%;
vertical-align: middle;
}
.arw-blue-right {
background-position: 40.22598870056497% 3.170608958228485%;
}
.arw-red-right {
width: 2.1875vw;
height: 3.75vw;
background-position: 44.29378531073446% 3.170608958228485%;
}
.ie8 .arw-blue-right, .ie8 .arw-red-right {
width: 8px;
height: 12px;
vertical-align: middle;
}
.ie8 .arw-blue-right {
background-position: -187px -1618px;
}
.ie8 .arw-red-right {
background-position: -208px -1618px;
}
.arw-white-down {
width: 14px;
height: 10px;
width: 4.375vw;
height: 3.125vw;
background-size: 3214.285714285714% 21052.63157894737%;
background-position: 0 10.80130620447124%;
}
.ie8 .arw-white-down {
width: 16px;
height: 11px;
background-position: -284px -1237px;
}
.arw-white-down-sm {
width: 12px;
height: 9px;
background-position: -210px -2160px;
}
.arw-orange-down {
width: 17px;
height: 10px;
background-position: 0px -505px;
}
.arw-red-down {
width: 10px;
height: 5px;
vertical-align: middle;
margin-left: 5px;
background-size: 3000% 28571.42857142857%;
background-position: 44.13793103448276% 10.71249372804817%;
}
.ie8 .arw-red-down {
background-position: -161px -46px;
}
.arw-btn-white, .arw-btn-white-right {
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
}
.arw-btn-white {
position: absolute;
top: 50%;
right: 14px;
border-width: 7px 6px 0px 6px;
border-top-color: #FFF;
margin-top: -2px;
}
.arw-btn-white-right {
border-width: 5px 0px 5px 5px;
border-left-color: #FFF;
}
.arw-up-md-white, .arw-down-md-white {
width: 9px;
height: 4px;
width: 2.8125vw;
height: 1.25vw;
background-size: 3000% 28571.42857142857%;
}
.arw-up-md-white {
background-position: 33.2183908045977% 11.69091821374812%;
}
.arw-down-md-white {
background-position: 21.49425287356322% 11.69091821374812%;
}
.arw-md {
width: 9px;
height: 4px;
width: 2.8125vw;
height: 1.25vw;
background-size: 3000% 28571.428571428572%;
background-position: 11.494252873563218% 10.837932764676367%;
}
.arw-md.-up {
background-position: 21.49425287356322% 11.038635223281485%;
}
.arw-acd-white {
width: 12px;
height: 6px;
width: 3.75vw;
height: 1.875vw;
background-size: 3000% 28571.428571428572%;
background-position: 21.49425287356322% 11.665830406422478%;
vertical-align: middle;
}
.ie8 .arw-up-md-white, .ie8 .arw-down-md-white, .ie8 .arw-acd-white {
width: 17px;
height: 10px;
vertical-align: middle;
}
.ie8 .arw-down-md-white, .ie8 .arw-acd-white {
background-position: -58px -2321px;
}
.ie8 .arw-up-md-white {
background-position: -103px -2321px;
}
.arw-acd-md {
width: 20px;
height: 20px;
background-position: -210px -2235px;
}
.arw-white-prev, .arw-white-next {
width: 9px;
height: 15px;
background-size: 4736.842105263158% 12500%;
}
.arw-white-prev {
background-position: 43.58683314415437% 7.056451612903227%;
}
.arw-white-next {
background-position: 54.029511918274686% 7.056451612903227%;
}
.ie8 .arw-white-prev, .ie8 .arw-white-next {
width: 10px;
height: 15px;
}
.ie8 .arw-white-prev {
background-position: -236px -1538px;
}
.ie8 .arw-white-next {
background-position: -187px -1538px;
}
.arw-grey-down {
width: 17px;
height: 8px;
width: 5.3125vw;
height: 2.5vw;
background-size: 3000% 28571.42857142857%;
background-position: 54.71264367816092% 10.71249372804817%;
}
.gray-circ, .gray-circ > span, .gray-circ-med, .gray-circ-sm {
border-radius: 50%;
text-align: center;
}
.gray-circ, .gray-circ-med, .gray-circ-sm {
position: relative;
background-color: #B6B6B6;
}
.gray-circ, .gray-circ > span {
width: 34px;
height: 34px;
}
.gray-circ-sm, .gray-circ-sm > span {
width: 28px;
height: 28px;
}
.gray-circ-med {
width: 38px;
height: 38px;
}
.gray-circ > span, .gray-circ-med > span, .gray-circ-sm > span {
position: absolute;
left: 0;
top: 0;
font-family: 'TrueMedium';
color: #FFF;
}
.gray-circ > span {
font-size: 36px;
line-height: 32px;
}
.gray-circ-med > span {
width: 38px;
height: 38px;
font-size: 26px;
line-height: 36px;
}
.gray-circ-sm > span {
font-size: 22px;
line-height: 28px;
}
.circ-mini, .circ-mini > span {
width: 26px;
height: 26px;
}
.circ-mini > span {
font-family: 'TrueBold';
font-size: 16px;
line-height: 28px;
}
/* --- ARROWS --- */
.ar-triangle {
position: absolute;
left: 50%;
bottom: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 5px 6px 0 6px;
border-width: 1.5625vw 1.875vw 0 1.875vw;
border-color: #007bff transparent transparent transparent;
z-index: 1;
-webkit-transform: translateX(-50%) translateY(100%);
transform: translateX(-50%) translateY(100%);
}
.ar-triangle.ar-gray {
border-top-color: #e8e8e8;
}
.ar-triangle.ar-orange {
border-top-color: #ff5b26;
}
.ar-triangle.ar-orange-2 {
border-top-color: #e45721;
}
.ar-triangle.ar-yellow {
border-top-color: #f9b72f;
}
.white-triangle:after {
content: "";
display: block;
position: absolute;
left: 50%;
bottom: 0;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-top-color: #fff;
border-width: 10px 11px 0;
border-width: 3.125vw 3.4375vw 0;
z-index: 1;
-webkit-transform: translateX(-50%) translateY(100%);
transform: translateX(-50%) translateY(100%);
}
.arw-down-elm:after {
content: "";
display: block;
position: absolute;
left: 50%;
top: 0;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px 6px 0;
border-width: 1.875vw 1.875vw 0;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.arw-yel-down:after {
border-top-color: #d59203;
}
.arw-blue-down:after {
border-top-color: #086b92;
}
.arw-pink-down:after {
border-top-color: #af0a4f;
}
.arw-gray-down:after {
border-top-color: #c9c9c9;
}
.arw-gray-down-2:after {
border-top-color: #e8e8e8;
}
.arw-white-down-xs:after {
border-top-color: #fff;
}
.vmid-ctn-2.gray-bg-15 .arw-white-down-xs:after {
border-top-color: #fafafa;
}
.box-main-inner {
position: relative;
min-height: 120px;
padding-bottom: 18.75vw;
}
.box-main-inner .splitbox-ctn .form-xlarge {
margin-top: 0;
}
.edge-bg-img, .edge-bg-img-2 {
position: absolute;
left: -1px;
background-repeat: no-repeat;
}
.edge-bg-img.actived {
z-index: 30;
/*-webkit-transform: translateZ(0);
transform: translateZ(0);*/
}
.edge-bg-img {
width: 47.5%;
padding-bottom: 23.4375%;
background-image: url(../images/bg/sprite-bg.png);
background-size: 660.0660066006601% 2684.563758389262%;
background-position: 43.54743665291691% 25.62970656972215%;
z-index: 0;
}
.edge-bg-img-2 {
width: 37.5%;
padding-bottom: 14.0625%;
background-image: url(../images/bg/sprite-bg.png);
background-size: 584.7953216374269% 3149.606299212598%;
background-position: 44.57177322074789% 35.19235734572683%;
z-index: 1;
}
.flag-item {
display: inline-block;
width: 40px;
border: 1px solid #eee;
vertical-align: middle;
}
.flag-item.-med {
width: 50px;
}
.flag-item img {
width: 100%;
}
.box-main-2 {
min-height: 120px;
min-height: 37.5vw;
z-index: 4;
}
.box-main-2.box-auto-height {
min-height: 50px;
height: auto;
}
.box-main-2 .edge-bg-img, .box-main-4 .edge-bg-img, .component-slide .items-slides .edge-bg-img, .component-slide .edge-bg-img.actived, .slide-med-size .edge-bg-img {
bottom: -2px;
}
.component-slide .edge-bg-img, .box-inner-left .edge-bg-img-2 {
bottom: 0;
}
.component-slide .box-main-2 > .edge-bg-img {
bottom: -3px;
}
.box-content-4 .edge-bg-img, .component-slide .box-main-2 > .edge-bg-img {
bottom: -3px;
}
.component-slide .items-slides .edge-bg-img {
left: 16.87242798353909%;
width: 31.27572016460905%;
padding-bottom: 15.4320987654321%;
z-index: 0;
}
.component-slide .owl-dots, .component-slide .owl-dot, .main-bnr-box .owl-dots {
height: 10px;
}
.inline-list-icon {
text-align: center;
max-width: 93.13725490196078%;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
margin-top: 1.5625vw;
}
.inline-list-icon > li {
display: inline-block;
vertical-align: top;
margin-top: 3px;
margin-bottom: 3px;
}
.inline-icon > li > a {
display: block;
}
.inline-list-style, .cmn-inline-icon {
width: 100%;
}
.inline-list-style > li {
width: 10.20408163265306%;
}
.inline-list-style .img-icons img {
border-radius: 2px;
}
.cmn-inline-icon > li {
width: 17.00680272108844%;
vertical-align: top;
}
.cmn-inline-icon .img-icons {
margin-top: 0;
}
.owl-carousel .owl-item .cmn-inline-icon .img-icons img, .owl-carousel .owl-item .inline-list-style .img-icons img {
width: 100%;
}
.abs-list-icon {
position: absolute;
top: 50%;
margin-top: -12px;
left: 18px;
}
.logo-group > div {
display: inline-block;
vertical-align: middle;
margin-left: 40px;
}
.logo-group > div:first-child {
margin-left: 0;
}
.logo-list {
max-width: 734px;
}
.logo-list > li, .logo-list-2 > li {
display: inline-block;
vertical-align: top;
}
.logo-list > li {
margin-left: 8px;
margin-top: 10px;
vertical-align: middle;
}
.logo-list > li img {
width: 30px;
}
.logo-list-2 {
text-align: center;
}
.logo-list-2 > li {
margin-right: 2px;
}
.logo-inline {
text-align: center;
margin-top: 10px;
margin-bottom: 30px;
}
.logo-inline > li {
display: inline-block;
vertical-align: middle;
margin-right: 7px;
}
.md-ctn-box-2 .logo-inline > li {
margin-right: 3px;
}
/* --- BACKGROUNDS --- */
.yellow-bg {
background-color: #fdbb30;
}
.yellow-bg-2 {
background-color: #eeaa19;
}
.yellow-bg-3 {
background-color: #d59203;
}
.yellow-bg-4 {
background: #f8b72e;
}
.red-bg {
background-color: #EE3124;
}
.red-bg-2 {
background-color: #d01720;
}
.orange-bg-2 {
background-color: #f5911d;
}
.orange-bg-3 {
background-color: #f2860a;
}
.blue-bg {
background: #0dafed;
}
.blue-bg-2 {
background: #0b95ca;
}
.blue-bg-3 {
background: #086b92;
}
.pink-bg {
background: #f1116f;
}
.pink-bg-2 {
background: #df1167;
}
.pink-bg-3 {
background: #af0a4f;
}
.white-bg {
background-color: #FFF;
}
.white-bg-2 {
background-color: #FDFCFC;
}
.sft-gray-bg {
background-color: #F4F4F6;
}
.med-gray-bg {
background-color: #666;
}
.dark-gray-bg {
background-color: #555;
}
.dark-gray-bg-2 {
background-color: #515151;
}
.gray-bg {
background-color: #eee;
}
.gray-bg-2 {
background-color: #D4D5D9;
}
.gray-bg-3 {
background-color: #FBFBFB;
}
.gray-bg-4 {
background-color: #EDEFF3;
}
.gray-bg-5 {
background-color: #F4F4F4;
}
.gray-bg-6 {
background-color: #D5D5D5;
}
.gray-bg-7 {
background-color: #f7f7f7;
}
.gray-bg-8 {
background-color: #FBFBFB;
}
.gray-bg-9 {
background-color: #FAFAFA;
}
.gray-bg-10 {
background-color: #F3F3F3;
}
.gray-bg-11 {
background-color: #EAEAEA;
}
.gray-bg-12 {
background-color: #E3E3E3;
}
.gray-bg-13 {
background-color: #C9C9C9;
}
.gray-bg-14 {
background-color: #CDCDCD;
}
.gray-bg-15 {
background-color: #E8E8E8;
}
.gray-bg-16 {
background-color: #ddd;
}
.gray-bg-17 {
background-color: #8F8F8F;
}
.gray-bg-18 {
background-color: #eeeef3;
}
.gray-bg-19 {
background-color: #e4e5ea;
}
.gray-bg-20 {
background-color: #b6b6b6;
}
.gray-bg-21 {
background-color: #f7f7f7;
}
.gray-gd-bg {
background: rgb(255,255,255); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZWRlZmYzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 20%, rgba(237,239,243,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,rgba(255,255,255,1)), color-stop(100%,rgba(237,239,243,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 20%,rgba(237,239,243,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,1) 20%,rgba(237,239,243,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,1) 20%,rgba(237,239,243,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255,255,255,1) 20%,rgba(237,239,243,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#edeff3',GradientType=0 ); /* IE6-8 */
}
.gray-gd-bg-2 {
background: rgb(178,179,182); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IyYjNiNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVmZjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgba(178,179,182,1) 0%, rgba(237,239,243,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(178,179,182,1)), color-stop(100%,rgba(237,239,243,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2b3b6', endColorstr='#edeff3',GradientType=0 ); /* IE6-8 */
}
.dark-red-bg {
background-color: #C12030;
}
.gray-bg-content {
background-color: #EBECF0;
background-image: url(../images/bg/gray-bg.jpg);
background-repeat: repeat-x;
background-position: 0 0;
}
.mtp-bg-color {
background-size: 266.66666666666663% 3100.7751937984494%;
background-position: 0 96.17669852751227%;
}
.trueu-bg {
position:absolute;
left: 4.6875%;
top: 0;
width: 50%;
margin-top: -15.625%;
padding-bottom: 43.75%;
background-image: url(../images/icons/sprite-icons@2x.png);
background-repeat: no-repeat;
background-size: 280.3738317757009% 1428.571428571429%;
background-position: 100% 0;
z-index: 5;
}
.ie8 .trueu-bg {
top: -140px;
left: 50%;
width: 320px;
height: 280px;
padding-bottom: 0;
margin-top: 0;
background-repeat: no-repeat;
background-position: 100% 0;
margin-left: -160px;
}
.border-btm-before:before, .bdr-btm-orange:before {
content: "";
display: block;
position: absolute;
left: 0;
width: 105%;
height: 5px;
z-index: 1;
}
.border-btm-before:before {
bottom: 0;
background-color: #666;
}
.bdr-btm-orange:before {
top: -5px;
background-color: #FD8E05;
}
.split-bg-top, .split-bg-btm {
position: absolute;
width: 100%;
left: 0;
z-index: 0;
}
.split-bg-top {
top: 0;
height: 490px;
}
.split-bg-btm {
top: 421px;
height: 100%;
}
.bnr-styling + .main-content + .split-bg-top {
height: 630px;
}
/* -------------------- TXT STYLE -------------------- */
.tlight-large-size, .tlight-xlarge-size, .small-title, .common-txt {
font-family: 'TrueLight';
}
.tlight-large-size {
font-size: 28px;
font-size: 8.75vw;
}
.tlight-xlarge-size {
font-size: 50px;
line-height: 25px;
}
.common-txt {
font-size: 7.1875vw;
line-height: 0.8em;
}
/* --- TRUEMEDIUM --- */
.tmed-sm-size, .tmed-xcmn-size, .tmed-md-size, .common-txt-2 {
font-family: 'TrueMedium';
}
.tmed-sm-size {
font-size: 16px;
}
.tmed-xcmn-size {
font-size: 23px;
font-size: 7.1875vw;
line-height: 0.7826086956521739em;
}
.tmed-md-size {
font-size: 22px;
font-size: 6.875vw;
line-height: 0.8181818181818182em;
}
.common-txt-2 {
font-size: 32px;
font-size: 10vw;
line-height: 0.875em;
}
/* --- TRUEBOLD --- */
.tbold-mini-size, .tbold-sm-size, .tbold-md-size, .tbold-xlarge-size, .tbold-xlarge-size-2, .tbold-large-size, .tbold-large-size-2, .tbold-large-size-3, .tbold-xxl-size,
.tbold-exlarge-special {
font-family: 'TrueBold';
}
.tbold-mini-size {
font-size: 16px;
}
.tbold-sm-size {
font-size: 18px;
}
.tbold-md-size {
font-size: 25px;
}
.tbold-large-size {
font-size: 22px;
font-size: 6.875vw;
line-height: 0.8181818181818182em;
}
.tbold-large-size-2 {
font-size: 36px;
line-height: 18px;
}
.tbold-large-size-3 {
font-size: 23px;
font-size: 7.1875vw;
line-height: 0.5em;
}
.tbold-xlarge-size {
font-size: 28px;
}
.tbold-xlarge-size-2 {
font-size: 30px;
font-size: 9.375vw;
line-height: 0.5em;
}
.tbold-xxl-size {
font-size: 80px;
line-height: 40px;
}
.tbold-exlarge-special {
font-size: 100px;
line-height: 0.5em;
}
/* --- TRUEBOLD-SPECIAL --- */
.tboldsp-large-size, .tboldsp-xlarge-size {
font-family: 'TrueBoldSpecial';
}
.tboldsp-large-size {
font-size: 36px;
line-height: 18px;
}
.tboldsp-xlarge-size {
font-size: 7.5vw;
line-height: 0.5em;
}
/* --- TRUEMEDIUM --- */
.tmed-large-size {
font-family: 'TrueMedium';
font-size: 24px;
line-height: 0.8333333333333333em;
}
/* --- HEADING-TXT --- */
.heading-two-line {
font-family: 'TrueBold';
font-size: 36px;
font-size: 11.25vw;
line-height: 0.8333333333333333em;
margin-bottom: 5.172413793103448%;
}
.sec-line-txt, .sec-line-txt-xs {
display: block;
font-family: 'TrueMedium';
}
.sec-line-txt {
font-size: 24px;
font-size: 7.5vw;
line-height: 0.8em;
}
.sec-line-txt-xs {
font-size: 14px;
font-size: 4.375vw;
}
.heading-txt {
font-family: 'TrueLight';
font-size: 48px;
line-height: 40px;
}
.heading-txt strong {
font-family: 'TrueBold';
font-weight: normal;
}
.heading-txt-2 {
position: relative;
font-family: 'TrueMedium';
font-size: 36px;
line-height: 22px;
color: #666;
margin-bottom: 30px;
}
.heading-txt-2 strong {
font-weight: normal;
color: #050505;
}
.heading-txt-2 .sprite-icons {
display: inline-block;
vertical-align: middle;
}
.heading-txt-2 .hongkong-flag-med {
position: relative;
top: -1px;
margin-right: 15px;
}
.heading-txt-2 .qmark-icon {
margin-left: 12px;
}
.sec-line-heading {
font-family: 'TrueLight';
font-size: 48px;
line-height: 34px;
text-align: center;
color: #555;
margin-bottom: 30px;
}
.sec-line-heading strong {
font-family: 'TrueBold';
font-weight: normal;
}
.block-text {
display: block;
}
.cmn-txt-size, .med-txt-size {
font-family: 'TrueBold';
}
.cmn-txt-size {
font-size: 24px;
font-size: 7.5vw;
line-height: 0.8333333333333333em;
}
.med-txt-size {
font-size: 40px;
font-size: 12.5vw;
line-height: 0.5em;
}
.small-txt-size {
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 1em;
}
.sm-txt-size, .sm-txt-size-2, .sm-txt-size-3, .sm-txt-size-4 {
display: block;
font-family: 'TrueBold';
}
.sm-txt-size {
font-size: 25px;
color: #555;
}
.sm-txt-size-2 {
font-size: 18px;
}
.sm-txt-size-3 {
font-size: 19px;
}
.sm-txt-size-4 {
font-size: 22px;
}
.xmed-txt-size, .larger-txt-size, .xl-txt-size {
font-family: 'TrueMedium';
}
.xmed-txt-size {
font-size: 50px;
line-height: 25px;
}
.larger-txt-size {
font-size: 80px;
line-height: 80px;
}
.xl-txt-size {
font-size: 100px;
line-height: 80px;
}
.cmn-txt-size-fix {
font-family: 'TrueBold';
font-size: 24px;
line-height: 1em;
}
.cmn-txt-size-fix > a {
text-decoration: underline;
}
.sm-txt-size-fix, .sm-txt-size-fix-2 {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.85em;
}
.sm-txt-size-fix strong, .sm-txt-size-fix-2 strong {
font-family: 'TrueBold';
font-weight: normal;
}
.xs-txt-size-fix {
font-family: 'TrueMedium';
font-size: 17px;
line-height: 1em;
}
.form-cmn-label {
font-family: 'TrueBold';
font-size: 32px;
vertical-align: middle;
}
.over-txt {
position: relative;
top: -6px;
font-family: 'TrueMedium';
font-size: 16px;
}
.heading-title-box-2 {
width: 960px;
font-family: 'TrueBold';
font-size: 34px;
color: #555;
background-color: #dadada;
height: 50px;
line-height: 50px;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
}
.heading-txt-4 {
position: relative;
font-family: 'TrueBold';
font-size: 36px;
font-size: 11.25vw;
line-height: 0.8333333333333333em;
margin-bottom: 6.25%;
z-index: 2;
}
.underline-txt {
text-decoration: underline;
}
/* --- TXT COLORS --- */
.red-txt {
color: #ee3124;
}
.red-txt-2 {
color: #ed1c24;
}
.yellow-txt {
color: #fdb216;
}
.orange-txt {
color: #f5911d;
}
.orange-txt-2 {
color: #f16321;
}
.orange-txt-3 {
color: #f33529;
}
.green-txt {
color: #269717;
}
.blue-txt {
color: #00b0f0;
}
.med-gray-txt {
color: #555;
}
.dark-gray-txt {
color: #666;
}
.gray-txt {
color: #888;
}
.gray-txt-2 {
color: #808080;
}
.gray-txt-3 {
color: #999;
}
.gray-txt-4 {
color: #8e8e8e;
}
.gray-txt-5 {
color: #acacac;
}
.gray-txt-6 {
color: #989898;
}
.white-txt {
color: #fff;
}
.black-txt {
color: #000;
}
.black-txt-2 {
color: #333;
}
.black-txt-7 {
color: #404040;
}
/* --- VERTICAL ALIGN MIDDLE BOX --- */
.valign-mid-box {
display: table-row;
}
.valign-ctn {
display: table-cell;
vertical-align: middle;
}
/* --- FORM --- */
.cmn-form-style {
width: 100%;
margin: 0 auto;
}
.cmn-form-style .title-6 {
margin-top: 0;
}
.cmn-form-style .btn-inline {
margin-top: 30px;
}
.cmn-form-style .captcha-box {
width: 80%;
margin: 13.33333333333333% auto 10%;
}
.cmn-form-style > .label-heading:first-child {
margin-bottom: 0.6818181818181818em;
}
.large-form-style {
width: 100%;
max-width: 1100px;
margin: 0 auto;
}
.form-med {
max-width: 630px;
margin: 0 auto;
}
.form-med .form-heading {
margin-bottom: 20px;
}
.form-flex .two-col-inline {
width: 100%;
}
.form-large {
max-width: 767px;
margin: 9.375% auto 12.5%;
}
.form-large.cmn-spc {
margin: 30px auto;
}
.form-large.cmn-spc .cmn-desc-box {
margin-bottom: 40px;
}
.form-large.cmn-spc .common-txt {
margin-bottom: 30px;
}
.form-xlarge {
margin: 7.142857142857143% auto 0;
}
.form-xxlarge {
width: 825px;
margin: 40px auto 0;
}
.form-heading {
color: #333;
margin-bottom: 3%;
}
.form-heading.-spacetop {
margin-top: 40px;
}
.form-heading-cmn {
font-family: 'TrueMedium';
font-size: 26px;
}
.label-heading {
display: block;
color: #333;
margin-bottom: 10px;
}
.label-heading.-spacebottom {
margin-bottom: 15px;
}
.label-heading .sm-txt-size-4 {
display: inline;
}
.mini-form {
max-width: 420px;
margin: 0 auto;
}
.mini-form > .row-elm {
margin-top: 10px;
}
.mini-form > .row-elm:first-child {
margin-top: 0;
}
.mini-form .verify-text {
margin-top: 25px;
margin-bottom: 25px;
}
.row-element-group {
margin: 0 auto;
}
.row-element > div {
position: relative;
margin-bottom: 6.666666666666667%;
}
.row-element > div:first-child, .row-element > .cmn-txt-label:first-child + div {
margin-left: 0;
}
.input-with-btn {
text-align: center;
}
.input-with-btn .cmn-button {
margin: 6.667% auto 0;
}
.input-with-btn.-fix .cmn-input {
width: 36%;
}
/*.row-element > div .logo-inline {
min-height: 46px;
line-height: 42px;
}*/
.row-element .inline-elm-2 > * {
margin-left: 0;
margin-bottom: 8px;
margin-right: 13.33333333333333%;
}
.row-element .inline-elm-2 > *:first-child {
margin-left: 0;
}
.row-element .inline-elm-2 > *:last-child {
margin-right: 0;
margin-bottom: 0;
}
.row-element-2 {
position: relative;
margin-bottom: 20px;
}
.row-elm-2 {
margin-top: 12px;
}
.row-element-3 {
margin-top: 30px;
}
.row-element-3:first-child {
margin-top: 0;
}
.row-element-3 > div {
display: inline-block;
min-width: 310px;
vertical-align: middle;
margin-left: 20px;
}
.row-element-3 > div:first-child {
margin-left: 0;
}
.row-element-3 .common-txt {
position: relative;
top: 2px;
}
.row-element-5 {
margin-top: 5%;
margin-bottom: 10%;
}
.row-elm-style {
margin-bottom: 40px;
}
.row-elm-style > div {
margin-bottom: 15px;
}
.row-element .logo-inline {
margin-bottom: 0;
}
.cmn-box-ctn {
padding: 30px;
margin: 20px 20px 0px 20px;
}
.cmn-box-ctn > h3 {
font-family: 'TrueBold';
font-size: 38px;
min-height: 48px;
line-height: 48px;
color: #FFF;
background-color: #FDBB2F;
padding-left: 25px;
padding-right: 25px;
}
.cmn-box-ctn .form-xlarge {
margin-top: 20px;
}
.form-xlarge .row-element-4:first-child {
margin-top: 0;
}
.row-element-4 {
position: relative;
margin-top: 7.142857142857143%;
}
.row-element-4 .inline-label-2 {
margin-bottom: 2.857142857142857%;
}
.row-element-4 > div {
position: relative;
display: block;
vertical-align: top;
}
.row-element-4 > .exp-date-box, .cur-bal > div:nth-child(2) {
position: absolute;
right: 0;
top: 3px;
}
.cur-bal .inline-label-2 {
margin-top: 4.285714285714286%;
}
.cur-bal > div:nth-child(2) {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.mtp-row-inner .cmn-row-elm, .mtp-row-inner .cmn-input {
margin-top: 20px;
}
.mtp-row-inner .cmn-input:first-child, .mtp-row-inner .cmn-row-elm:first-child, .mtp-row-inner .cmn-row-elm + .cmn-input {
margin-top: 0;
}
.prg-ctn-2 {
display: block;
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.9090909090909091em;
color: #555;
}
.prg-ctn-2 + .prg-ctn-2 {
margin-top: 20px;
}
.prg-ctn-3 {
font-family: 'TrueLight';
font-size: 22px;
font-size: 6.875vw;
line-height: 1em;
}
.form-btm-part {
margin-top: 10%;
}
.two-col-inline {
display: inline-block;
text-align: left;
vertical-align: top;
}
.two-col-inline > div {
margin-top: 20px;
margin-top: 6.25vw;
}
.two-col-inline > div:first-child {
margin-top: 0;
}
.inline-box-inner {
vertical-align: top;
text-align: left;
}
.inline-box-inner .radiobox {
margin-bottom: 0;
}
.inline-box-inner .row-element {
margin-bottom: 6.66667%;
}
.inline-box-inner .row-element:first-child {
margin-top: 0;
}
.inline-box-inner .cmn-desc-box {
margin-top: 6.666666666666667%;
}
.inline-box-inner .form-heading-3 {
margin-bottom: 6.666666666666667%;
}
.inline-box-inner .cmn-inline-label {
width: 87.33333333333333%;
vertical-align: middle;
margin-left: 3px;
}
.inline-box-inner .inline-elm-5 .cmn-inline-label {
width: 35%;
margin-left: 0;
text-align: left;
}
.date-time-box {
margin-top: 6.666666666666667%;
}
.date-time-box .cmn-inline-label {
margin-left: 0;
margin-bottom: 2.333333333333333%;
}
.inline-row {
position: relative;
margin-bottom: 6.666666666666667%;
}
.inline-row > div {
display: inline-block;
vertical-align: top;
width: 100%;
margin-top: 4.444444444444444%;
}
.inline-row .inline-label {
display: block;
margin-bottom: 5px;
}
.inline-row > div:first-child {
margin-top: 0;
}
.inline-elm-group .inline-row .inline-row-2 {
margin-top: 20px;
}
.inline-row-2 > div {
vertical-align: middle;
margin-left: 5px;
}
.inline-row-2 > div:first-child {
margin-left: 0;
}
.inline-elm-group .inline-row > div {
margin-top: 0;
}
.the-hpl-txt {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 1em;
}
.the-hpl-txt.-topspace {
margin-top: 20px;
}
.cmn-hpl-txt, .hpl-red-txt, .hpl-txt-2 {
cursor: pointer;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.cmn-hpl-txt, .hpl-red-txt {
color: #666;
text-decoration: underline;
}
.hpl-red-txt, .cmn-hpl-txt:hover {
color: #ee3124;
}
.hpl-txt-2:hover {
color: #000;
}
.hpl-txt-2:hover .arw-hpl {
background-position: -294px -2393px;
}
.hpl-link-box {
font-family: 'TrueMedium';
font-size: 18px;
margin-top: 20px;
font-size: 5.625vw;
margin-top: 6.25vw;
line-height: 1em;
}
.hpl-link-box strong {
font-family: 'TrueBold';
font-weight: normal;
}
.hpl-link-box.hpl-abs-box {
position: absolute;
right: 10px;
top: 50%;
margin-top: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.hpl-link-box.pull-right-box {
display: block;
}
.hpl-link-fix {
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.hpl-underline {
text-decoration: underline;
}
.md-modal .hpl-link-box {
font-size: 18px;
line-height: 0.8888888888888889em;
margin-top: 20px;
}
.md-modal .hpl-med-txt {
font-size: 20px;
line-height: 1em;
}
.btn-icon {
position: relative;
width: 36px;
height: 36px;
line-height: 32px;
text-align: center;
}
.btn-icon, .btn-icon .black-email-icon, .btn-icon .black-sms-icon {
display: inline-block;
vertical-align: middle;
}
.cmn-text-1 {
font-family: 'TrueLight';
font-size: 18px;
line-height: 0.8888888888888889em;
}
.remark-txt {
font-family: 'TrueBold';
font-size: 20px;
line-height: 0.8em;
margin-top: 12px;
}
.remark-txt > strong {
font-weight: normal;
font-size: 30px;
line-height: 0.5em;
}
.cmn-label, .sm-label-left, .cmn-label-left, .cmn-label-right, .md-label-left, .cmn-flex-label {
position: relative;
display: inline-block;
vertical-align: middle;
}
.cmn-label, .sm-label-left, .cmn-label-left, .cmn-label-right, .cmn-flex-label {
font-family: 'TrueMedium';
color: #555;
}
.cmn-label, .cmn-label-left, .cmn-label-right, .cmn-flex-label {
font-size: 22px;
font-size: 6.875vw;
line-height: 0.8181818181818182em;
}
.sm-label {
display: inline-block;
vertical-align: top;
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.9em;
}
.sm-label-left {
font-size: 20px;
line-height: 0.9em;
}
.cmn-flex-label {
line-height: 0.7272727272727273em;
}
.sm-label-left, .cmn-label-left, .md-label-left {
margin-left: 6px;
}
.md-label-left {
font-family: 'TrueBold';
font-size: 26px;
color: #555;
}
.cmn-label-right {
margin-right: 8px;
}
.cmn-label-left.black-txt {
color: #000;
}
.cmn-txt-label, .cmn-txt-label-btm, .cmn-txt-label-sm, .cmn-txt-label-sm-btm, .md-txt-label, .abs-txt-label, .xcmn-txt-label,
.cmn-txt-label-xs, .cmn-txt-label-xs-2, .cmn-txt-label-xs-3, .cmn-txt-label-sm-btm-2 {
display: block;
font-family: 'TrueMedium';
}
.cmn-txt-label strong, .cmn-txt-label-btm strong, .cmn-txt-label-sm strong, .cmn-txt-label-sm-btm strong, .md-txt-label strong {
font-family: 'TrueBold';
font-weight: normal;
color: #4B4B4B;
}
.cmn-txt-label, .cmn-txt-label-btm, .abs-txt-label, .cmn-txt-label-sm-btm {
color: #888;
}
.cmn-txt-label.blue-txt, .cmn-txt-label-btm.blue-txt {
color: #00b0f0;
}
.cmn-txt-label-xs {
font-size: 17px;
font-size: 5.3125vw;
}
.cmn-txt-label-xs-2 {
font-size: 14px;
font-size: 4.375vw;
display: inline-block;
vertical-align: middle;
line-height: 0.8235294117647059em;
text-align: left;
}
.cmn-txt-label-xs-2 strong {
font-family: 'TrueBold';
font-weight: normal;
}
.cmn-txt-label-xs-3 {
font-size: 16px;
line-height: 0.875em;
}
.xcmn-txt-label {
font-size: 24px;
line-height: 22px;
margin-bottom: 20px;
}
.cmn-txt-label, .cmn-txt-label-btm {
font-size: 18px;
font-size: 5.625vw;
line-height: 0.7777777777777778em;
}
.cmn-txt-label-btm.-fix {
font-size: 18px;
}
.md-modal .cmn-txt-label-sm, .cmn-txt-label-sm-btm {
font-size: 15px;
line-height: 0.8666666666666667em;
}
.cmn-txt-label-sm-btm-2 {
font-size: 15px;
font-size: 4.6875vw;
line-height: 0.8666666666666667em;
margin-top: 0.6666666666666667em;
}
.cmn-txt-label-btm.red-txt, .cmn-txt-label-sm-btm.red-txt {
color: #ee3124;
}
.cmn-txt-label-btm.orange-txt, .cmn-txt-label-sm-btm.orange-txt {
color: #f5921d;
}
.cmn-txt-label.black-txt, .cmn-txt-label-btm.black-txt, .cmn-txt-label-sm.black-txt, .cmn-txt-label-sm-btm.black-txt {
color: #000;
}
.cmn-txt-label.white-txt strong {
color: #fff;
}
.cmn-txt-label {
margin-bottom: 8px;
}
.cmn-txt-label:empty:before {
content: " ";
display: none;
vertical-align: baseline;
}
.cmn-txt-label-btm {
margin-top: 2.857142857142857%;
}
.cmn-txt-label-sm-btm {
margin-top: 3px;
}
.cmn-txt-label.pull-right-label {
float: right;
margin-bottom: 0;
}
.cmn-txt-label.green-txt {
color: #41a734;
}
.cmn-input-label {
font-family: 'TrueMedium';
font-size: 20px;
margin-left: 8px;
vertical-align: middle;
color: #777;
}
.med-txt-label {
display: block;
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.8636363636363636em;
color: #333;
}
.med-txt-label.-spacebottom {
margin-bottom: 15px;
}
.small-txt-label {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.9em;
}
.small-txt-label.-floating {
position: absolute;
top: 0;
}
.small-txt-label.-floating.-right {
right: 0;
}
.small-txt-label > .sprite-icons {
margin-left: 3px;
}
.small-txt-label > .sprite-icons:first-child {
margin-left: 0;
}
.abs-txt-label {
position: absolute;
right: 0;
top: 0;
font-size: 18px;
}
.lbl-block {
display: block;
margin-bottom: 8px;
}
.lbl-inline {
display: inline-block;
}
.md-txt-label {
font-size: 25px;
line-height: normal;
color: #555;
margin-bottom: 2px;
}
.cmn-inline-label, .cmn-inline-label-2, .fix-inline-label,
.cmn-top-label {
display: inline-block;
font-family: 'TrueMedium';
}
.cmn-top-label {
vertical-align: top;
font-size: 24px;
font-size: 7.5vw;
line-height: 0.75em;
margin-bottom: 10px;
}
.cmn-inline-label {
color: #333;
font-size: 24px;
font-size: 7.5vw;
line-height: 0.75em;
margin-left: 8px;
vertical-align: top;
}
.cmn-inline-label-2 {
font-size: 20px;
font-size: 6.25vw;
line-height: 1em;
}
.cmn-inline-label-2 .mini-block {
margin-top: 4.347826086956522%;
}
.fix-inline-label {
display: inline-block;
vertical-align: middle;
font-size: 24px;
line-height: 0.875em;
margin-left: 3px;
margin-right: 3px;
}
.inline-label {
font-family: 'TrueMedium';
font-size: 22px;
font-size: 6.875vw;
line-height: 1em;
}
.inline-label.-spacebtm {
display: block;
margin-bottom: 5px;
}
.inline-label-2 {
display: inline-block;
font-family: 'TrueMedium';
font-size: 7.1875vw; /* 38px */
color: #555;
line-height: 1em;
vertical-align: middle;
}
.inline-label-2 .cmn-txt-label {
display: inline-block;
vertical-align: baseline;
margin: 0;
}
.inlabel-left {
margin-left: 15px;
}
.inner-label {
display: block;
font-size: 20px;
font-size: 6.25vw;
line-height: 0.5em;
color: #555;
margin-top: 3.703703703703704%;
}
.cmn-label-block {
min-height: 46px;
line-height: 46px;
}
.cmn-label-block > * {
display: inline-block;
vertical-align: middle;
line-height: normal;
margin: 0;
}
.label-inline-btm {
margin-top: 10px;
}
.floating-txt {
float: right;
margin-top: 4px;
text-decoration: underline;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.floating-txt:hover {
color: #ee3124;
}
.cmn-desc-box {
background-color: #f4f4f4;
padding: 20px;
margin-bottom: 30px;
}
.cmn-desc-box h5 {
font-family: 'TrueBold';
font-size: 25px;
font-size: 7.8125vw;
}
.cmn-desc-box .file-btn {
margin: 4.347826086956522% auto;
}
.cmn-desc-list {
margin-top: 3.846153846153846%;
}
.cmn-desc-list + .cmn-desc-list {
margin-top: 7.692307692307692%;
}
.cmn-desc-list > li {
display: block;
font-family: 'TrueLight';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.9em;
margin-top: 3.846153846153846%;
}
.cmn-desc-list > li:first-child {
margin-top: 0;
}
.mini-block .info-red-icon, .mini-block .green-checked-icon {
position: relative;
}
.mini-block .info-red-icon {
top: -1px;
}
.mini-block .green-checked-icon {
top: -2px;
}
.inline-block-form {
max-width: 500px;
margin-top: 10px;
margin-bottom: 10px;
}
.inline-block-form > div {
display: inline-block;
vertical-align: top;
}
.inline-block-form > div:first-child {
display: block;
margin-bottom: 10px;
}
.inl-form-style {
background-color: #eee;
border-radius: 5px;
padding: 8px;
}
.cmn-box-elm {
position: relative;
max-width: 760px;
margin: 0 auto;
}
.cmn-box-elm .cmn-txt-label-btm {
float: right;
}
.cmn-heading-box, .cmn-footer-box {
padding-left: 4%;
padding-right: 4%;
}
.cmn-heading-box {
min-height: 10.9375vw;
background-color: #B6B6B6;
}
.cmn-footer-box {
padding-top: 1.162790697674419%;
padding-bottom: 1.162790697674419%;
background-color: #EDEFF3;
}
.cmn-heading-box {
font-family: 'TrueBold';
font-size: 25px;
font-size: 7.8125vw;
line-height: 0.8em;
}
.cmn-heading-box-2 {
margin-bottom: 7.407407407407407%;
}
.cmn-ctn-list {
font-family: 'TrueMedium';
font-size: 18px;
font-size: 5.625vw;
}
.cmn-ctn-list > li {
display: block;
border-top: 1px solid #B6B6B6;
padding-top: 3.875968992248062%;
padding-bottom: 3.875968992248062%;
margin-left: 4%;
margin-right: 4%;
}
.cmn-ctn-list > li:first-child {
border-top: none;
}
.cmn-ctn-list > li > div, .cmn-footer-box > div {
display: inline-block;
line-height: normal;
vertical-align: middle;
}
.cmn-ctn-list > li > div {
line-height: 0.9444444444444444em;
}
.cmn-footer-box > div {
font-family: 'TrueBold';
font-size: 28px;
}
.box-spacing {
width: 93.75%;
padding-top: 7.1875%;
margin: 0 auto;
}
.box-spacing-2 {
padding-top: 50px;
padding-bottom: 10px;
}
.box-styling {
padding-top: 3.333333333333333%;
}
.tooltip-box {
position: relative;
display: inline-block;
vertical-align: top;
}
.desktop .tooltip-box:hover .tt-content, .tooltip-box.actived .tt-content,
.desktop .tooltip-box:hover .tt-content-2, .tooltip-box.actived .tt-content-2,
.desktop .tooltip-box:hover .tt-content-3, .tooltip-box.actived .tt-content-3 {
visibility: visible;
}
.tt-content, .tt-content-2, .tt-content-3 {
position: absolute;
visibility: hidden;
z-index: 10;
}
.tt-content {
top: 100%;
left: 50%;
padding-top: 10px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tt-content-2, .tt-content-3 {
padding-bottom: 10px;
bottom: 100%;
}
.tt-content-2 {
right: 0;
}
.tt-content-2.-center {
right: auto;
left: 50%;
margin-left: auto;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tt-content-3 {
right: -40px;
}
.tt-content-3 .tt-arw-down:before, .tt-content-3 .tt-arw-down:after {
right: 37px;
}
.tt-content-3 .tt-content-inner {
padding: 5px 10px;
}
.tt-top-pos {
top: -138px;
padding-top: 0;
padding-bottom: 10px;
}
.ie8 .tt-content {
margin-left: -170px;
}
.cmn-sm-box {
min-width: 120px;
min-width: 37.5vw;
}
.tt-cmn-txt {
font-family: 'TrueMedium';
font-size: 18px;
font-weight: normal;
line-height: 0.8888888888888889em;
}
.tt-cmn-txt strong {
font-family: 'TrueBold';
}
.tt-content .table-box:before {
content: "";
display: block;
position: absolute;
top: -10px;
left: 50%;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 0px 10px 10px 10px;
border-bottom-color: #FDBB30;
margin-left: -10px;
}
.tt-top-pos .table-box:before {
top: auto;
bottom: -10px;
border-width: 10px 10px 0px 10px;
border-top-color: #EDEFF3;
}
.tt-content-inner {
position: relative;
background-color: #fff;
border: 1px solid #ddd;
padding: 10px;
}
.tt-arw-down:before, .tt-arw-down:after {
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
}
.tt-arw-down:before, .tt-arw-down:after {
right: 0;
}
.tt-arw-down:before {
border-width: 10px 10px 0;
bottom: -10px;
z-index: 5;
}
.tt-arw-down:before {
border-top-color: #fff;
margin-right: 0px;
}
.tt-arw-down:after {
border-top-color: #ddd;
border-width: 11px 11px 0;
bottom: -11px;
margin-right: -1px;
}
.tt-arw-down.-center:before, .tt-arw-down.-center:after {
right: auto;
left: 50%;
margin-left: auto;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tt-abs {
position: absolute;
}
.tt-longer .tt-content-3 {
right: -10px;
left: auto;
min-width: 220px;
-webkit-transform: none;
transform: none;
}
.tt-longer .tt-content-3 .tt-arw-down:before,
.tt-longer .tt-content-3 .tt-arw-down:after {
left: auto;
right: 8px;
}
.row-element .tt-abs {
right: -25px;
top: 30%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.table-box {
position: relative;
width: 260px;
}
.tb-row-elm {
display: table-row;
table-layout: fixed;
width: 100%;
}
.tb-col-elm {
display: table-cell;
width: 50%;
height: 32px;
vertical-align: middle;
padding-left: 10px;
padding-right: 10px;
}
.tb-txt {
display: inline-block;
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
line-height: normal;
vertical-align: middle;
}
.cmn-ctn-list > li > div:first-child, .cmn-footer-box > div:first-child {
width: 70.54263565891473%;
margin-right: 3.875968992248062%;
}
.cmn-ctn-list > li > div:first-child + div, .cmn-footer-box > div:first-child + div {
width: 23.25581395348837%;
text-align: right;
}
.anim-form .row-elm, .anim-form .row-elm-2, .anim-form .btn-inline, .anim-form .true-id-logo {
opacity: 0;
}
.anim-form .row-elm, .anim-form .row-elm-2, .anim-form .btn-inline {
display: block;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
.md-modal.md-show .anim-form .row-elm, .md-modal.md-show .anim-form .row-elm-2, .md-modal.md-show .anim-form .btn-inline,
.md-modal.md-show .anim-form .true-id-logo {
opacity: 1;
}
.md-modal.md-show .anim-form .row-elm, .md-modal.md-show .anim-form .row-elm-2, .md-modal.md-show .anim-form .btn-inline {
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
transition: opacity 0.3s ease, transform 0.3s ease;
}
.md-modal.md-show .anim-form .row-elm:nth-child(1) {
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.md-modal.md-show .anim-form .row-elm:nth-child(2) {
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.md-modal.md-show .anim-form .row-elm-2 {
-webkit-transition-delay: 0.4s;
transition-delay: 0.4s;
}
.md-modal.md-show .anim-form .btn-inline {
-webkit-transition-delay: 0.5s;
transition-delay: 0.5s;
}
.md-modal.md-show .anim-form .true-id-logo {
-webkit-transition: opacity 0.5s ease;
transition: opacity 0.5s ease;
-webkit-transition-delay: 0.8s;
transition-delay: 0.8s;
}
/* --- CHECKBOX and RADIOBOX STYLE --- */
.checkbox-wrap, .radiobox-wrap {
cursor: pointer;
position: relative;
display: inline-block;
vertical-align: middle;
}
.checkbox-style {
position: relative;
cursor: pointer;
width: 24px;
height: 24px;
text-align: center;
overflow: hidden;
border: 1px solid #DDD;
background-color: #FFF;
border-radius: 4px;
}
.checkbox-white .checkbox-style {
background-color: #FFF;
}
.checkbox-style .checked-icon {
position: absolute;
left: 50%;
top: 50%;
width: 15px;
display: block;
line-height: normal;
margin-left: -7px;
margin-top: -6px;
z-index: 5;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity .2s ease;
transition: opacity .2s ease;
}
.checkbox-sm {
width: 15px;
height: 15px;
width: 4.6875vw;
height: 4.6875vw;
}
.checkbox-sm .checked-icon {
position: relative;
left: 0;
top: 0;
width: 10px;
height: 8px;
margin: 0;
width: 3.125vw;
height: 2.5vw;
background-position: 61.33177570093458% 3.75882946518668%;
}
.ie8 .checkbox-style .checked-icon {
width: 16px;
}
.checkbox-style input[type="checkbox"] {
position: absolute;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
top: 100%;
visibility: hidden;
}
.checkbox-wrap.checked .checked-icon {
opacity: 1;
filter: alpha(opacity=100);
}
.checkbox-wrap.disabled .checkbox-style {
background-color: #DDD;
}
.darkgray-checkbox .checkbox-style {
background-color: #888;
}
.darkgray-checkbox .checkbox-style .checked-icon {
background-position: 61.33177570093458% 2.825428859737639%;
}
.ie8 .darkgray-checkbox .checkbox-style .checked-icon {
background-position: -57px -1707px;
}
/* --- RADIOBOX STYLE --- */
.radiobox-style{
position: relative;
cursor: pointer;
width: 18px;
height: 18px;
border: 2px solid #b6b6b6;
background-color: #fff;
overflow: hidden;
border-radius: 50%;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.ie8 .radiobox-style {
border: none;
width: 20px;
height: 20px;
background: url(../images/icons/sprite-icons.png) no-repeat -90px -1661px;
}
.circle-checked {
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
left: 50%;
top: 50%;
width: 10px;
height: 10px;
background-color: #ee3124;
border-radius: 50%;
margin-left: -5px;
margin-top: -5px;
-webkit-transform: scale(0.1);
transform: scale(0.1);
-webkit-transition: -webkit-transform 0.2s ease, opacity 0.2s ease;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.radiobox-style input[type="radio"] {
position: absolute;
top: 110%;
visibility: hidden;
}
.radiobox-wrap.checked .circle-checked {
opacity: 1;
filter: alpha(opacity=100);
-webkit-transform: scale(1);
transform: scale(1);
}
.radiobox-wrap.checked .circle-checked {
background-color: #EE3124;
}
.radiobox-wrap.disabled .radiobox-style {
cursor: default;
border-color: #ddd;
background-color: #efefef;
}
.floating-radio:checked ~ .flex-col-panel .radiobox-wrap .circle-checked {
opacity: 1;
filter: alpha(opacity=100);
background-color: #EE3124;
-webkit-transform: scale(1);
transform: scale(1);
}
.ie8 .circle-checked {
background: url(../images/icons/sprite-icons.png) no-repeat -166px -1661px;
}
.ie8 .radiobox-wrap.checked .circle-checked {
background-color: transparent;
}
.ie8 .radiobox-wrap.disabled .radiobox-style {
background: url(../images/icons/sprite-icons.png) no-repeat -128px -1661px;
}
.row-element-2 .radio-list {
margin-top: 10px;
}
.radio-list > li {
display: inline-block;
vertical-align: top;
margin-left: 50px;
}
.radio-list > li:first-child {
margin-left: 0;
}
/* --- Radomir --- */
.effect-radomir {
overflow: visible;
}
.effect-radomir::after {
position: absolute;
top: 50%;
left: 50%;
margin: -35px 0 0 -35px;
width: 70px;
height: 70px;
border-radius: 50%;
content: '';
opacity: 0;
pointer-events: none;
box-shadow: inset 0 0 0 35px rgba(200,200,200,0);
}
.effect-radomir.clicked::after {
-webkit-animation: anim-effect-radomir 0.5s ease-out forwards;
animation: anim-effect-radomir 0.5s ease-out forwards;
}
@-webkit-keyframes anim-effect-radomir {
0% {
opacity: 1;
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
80% {
box-shadow: inset 0 0 0 2px rgba(200,200,200,0.8);
opacity: 0.1;
}
100% {
box-shadow: inset 0 0 0 2px rgba(200,200,200,0.8);
opacity: 0;
-webkit-transform: scale3d(1.0, 1.0, 1);
transform: scale3d(1.0, 1.0, 1);
}
}
@keyframes anim-effect-radomir {
0% {
opacity: 1;
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
80% {
box-shadow: inset 0 0 0 2px rgba(200,200,200,0.8);
opacity: 0.1;
}
100% {
box-shadow: inset 0 0 0 2px rgba(230,230,230,0.8);
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.0, 1.0, 1);
}
}
/* --- INPUT --- */
.input-wrap {
display: inline-block;
position: relative;
}
.input-box {
position: relative;
}
.input-box .cmn-input {
position: relative;
z-index: 5;
}
.input-box .calendar-icon, .select-menu .clock-icon {
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.md-modal .calendar-icon {
width: 20px;
height: 20px;
}
.input-box-2 {
position: relative;
width: 65%;
}
.input-block {
position: relative;
margin-bottom: 20px;
}
.cmn-input, .cmn-txtarea {
outline: none;
background-color: #FFF;
border: 1px solid #CCC;
-webkit-appearance: none;
border-radius: 0;
box-sizing: border-box;
-webkit-transition: border-color 0.3s ease, background-color 0.3s ease;
transition: border-color 0.3s ease, background-color 0.3s ease;
}
.cmn-input.-center {
text-align: center;
}
.cmn-txtarea:focus, .cmn-input:focus {
border-color: #EE3124;
color: #4B4B4B;
}
.cmn-input {
display: block;
width: 100%;
height: 10.9375vw;
font-family: 'TrueMedium';
font-size: 6.5625vw;
color: #222;
padding-top: 0;
padding-bottom: 0;
padding-left: 10px;
padding-right: 10px;
margin: 0
}
.cmn-input.-fix {
font-size: 22px;
height: 40px;
box-sizing: border-box;
}
.cmn-input.-fix.-med {
font-size: 25px;
}
.cmn-input.-bold:focus {
font-family: 'TrueBold';
}
textarea.cmn-input {
min-width: 100%;
max-width: 100%;
padding-top: 5px;
padding-bottom: 5px;
min-height: 150px;
}
.input-styling {
border: 2px solid #C9C9C9;
height: 40px;
border-radius: 7px;
}
.input-styling-2 {
border: 1px solid #B9B9B9;
height: 34px;
border-radius: 4px;
}
.input-inline {
display: inline-block;
}
.input-mini {
width: 71px;
vertical-align: top;
}
.input-xsmall {
width: 230px;
height: 36px;
font-size: 23px;
}
.input-small {
width: 150px;
width: 46.875vw;
height: 28px;
height: 8.75vw;
font-size: 5.625vw;
}
.cmn-txt-label:first-child + .input-mini {
margin-left: 0;
}
.input-medium, .input-xlong {
height: 35px;
height: 10.9375vw;
}
.input-medium-2 {
width: 325px;
}
.input-xmedium {
width: 100%;
}
.input-xmedium-2 {
width: 100%;
height: 10.9375vw;
}
.input-xmedium-3 {
font-size: 19px;
min-width: 212px;
height: 30px;
width: auto;
font-size: 5.9375vw;
min-width: 67.5vw;
height: 9.375vw;
border-right: none;
}
.input-large {
width: 352px;
height: 44px;
}
.input-long {
width: 100%;
}
.input-long-2 {
width: 437px;
}
/*.input-xlong {
width: 634px;
}*/
.transparent-bg {
background-color: transparent;
}
.cmn-input::-webkit-input-placeholder {
color: #888;
}
.cmn-input:-moz-placeholder { /* Firefox 18- */
color: #888;
}
.cmn-input::-moz-placeholder { /* Firefox 19+ */
color: #888;
}
.cmn-input:-ms-input-placeholder {
color: #888;
}
.flex-input-box {
width: 100%;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.flex-input-box.-four .square-input-box {
width: 20%;
}
.square-input-box {
position: relative;
float: left;
width: 8%;
}
.square-input {
color: #222;
padding-left: 0;
padding-right: 0;
text-align: center;
}
/* --- INPUT DISABLED STYLE --- */
.cmn-input.disabled {
background-color: #DDD;
border-color: #DDD;
color: #999;
}
.cmn-input.disabled::-webkit-input-placeholder {
color: #BBB;
}
.cmn-input.disabled:-moz-placeholder { /* Firefox 18- */
color: #BBB;
}
.cmn-input.disabled::-moz-placeholder { /* Firefox 19+ */
color: #BBB;
}
.cmn-input.disabled:-ms-input-placeholder {
color: #BBB;
}
/* --- TEXTAREA --- */
.cmn-txtarea {
display: block;
width: 318px;
min-height: 92px;
overflow: hidden;
font-family: 'TrueBold';
font-size: 20px;
color: #999;
padding: 10px 16px;
margin: 0;
}
.cmn-txtarea::-webkit-input-placeholder {
color: #999;
}
.cmn-txtarea:-moz-placeholder { /* Firefox 18- */
color: #999;
}
.cmn-txtarea::-moz-placeholder { /* Firefox 19+ */
color: #999;
}
.cmn-txtarea:-ms-input-placeholder {
color: #999;
}
.input-wrap .cmn-txt-label-sm-btm {
position: absolute;
opacity: 0;
left: 0;
bottom: -22px;
margin-top: 0;
-webkit-transform: translateY(10px);
transform: translateY(10px);
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
}
.input-wrap.actived .cmn-txt-label-sm-btm {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
/* --- SELECTMENU --- */
.select-menu {
position: relative;
width: 100%;
background-color: #FFF;
border: 1px solid #CCC;
height: 30px;
padding-left: 10px;
padding-right: 30px;
height: 9.375vw;
padding-left: 3.125vw;
padding-right: 9.375vw;
box-sizing: border-box;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.select-menu .triang-elm {
position: absolute;
right: 10px;
top: 50%;
margin-top: -4px;
}
.select-menu > select {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
font-family: Tahoma, Geneva, sans-serif;
opacity: 0;
filter: alpha(opacity=0);
background: #FFF;
border: none;
margin-left: 0;
outline: none;
-webkit-appearance: none;
}
.select-menu > select optgroup {
font-style: normal;
color: #333;
}
.select-menu > select optgroup option {
padding-top: 3px;
padding-bottom: 3px;
}
.select-menu > select optgroup option[disabled="disabled"] {
color: #aaa;
}
.select-menu.-arrowbox:after {
content: "";
display: block;
position: absolute;
right: 0;
top: 0;
width: 28px;
height: 100%;
pointer-events: none;
}
.select-menu.-arrowbox.-yellow:after {
background-color: #fab72e;
}
.select-menu .custom-arrow {
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 2;
}
.slcm-txt {
display: block;
width: 100%;
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
color: #666;
text-overflow: ellipsis;
line-height: normal;
white-space: nowrap;
overflow: hidden;
}
.slc-arw-box {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 33px;
width: 10.3125vw;
background-color: #b6b6b6;
}
.slc-arw-box.-yellow {
background-color: #fab72e;
}
.slcbx-mini {
width: 28px;
}
.slc-arw-box .arw-white-down, .slc-arw-box .arw-white-down-sm {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.ie8 .slc-arw-box .arw-white-down {
margin-top: -5px;
margin-left: -8px;
}
.select-menu.disabled {
background-color: #999;
}
.select-menu.disabled > span {
color: #777;
}
.select-menu.disabled .slc-arw-box {
background-color: #b6b6b6;
}
.slcmn-style, .sq-select {
background-color: #fff;
height: 35px;
padding-left: 10px;
padding-right: 33px;
height: 10.9375vw;
}
.slcmn-style {
padding-left: 3.125vw;
padding-right: 10.3125vw;
}
.slcmn-style .slcm-txt {
font-family: 'TrueMedium';
font-size: 21px;
font-size: 6.5625vw;
color: #000;
margin-right: 20px;
}
.slc-mini .slcm-txt {
font-family: 'TrueBold';
font-size: 25px;
line-height: 32px;
margin-right: 7px;
color: #868686;
}
.slc-mini .slc-arw-box {
width: 30px;
}
.slc-with-label, .slc-cmn-style {
width: 100%;
height: 34px;
line-height: 34px;
padding-left: 0;
border-color: #B9B9B9;
border-radius: 4px;
}
.slc-with-label {
-ms-flex-pack: flex-start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
overflow: hidden;
}
.slc-cmn-style {
padding-left: 10px;
}
.slc-label-inner {
display: inline-block;
line-height: normal;
vertical-align: top;
}
.slc-with-label .slc-label, .slc-with-label .slcm-txt, .slc-cmn-style .slcm-txt {
font-family: 'TrueMedium';
font-size: 21px;
}
.slc-with-label .slc-label, .slc-with-label .slcm-txt {
float: left;
}
.slc-with-label .slc-label {
min-width: 55px;
min-height: 40px;
line-height: 40px;
color: #FFF;
background-color: #A0A0A0;
padding-left: 10px;
margin-right: 10px;
}
.slc-with-label .slcm-txt, .slc-cmn-style .slcm-txt {
width: auto;
color: #777;
line-height: 40px;
}
.slc-short {
width: 110px;
}
.slc-mini {
display: inline-block;
min-width: 76px;
width: auto;
height: 30px;
padding-right: 30px;
border-color: #D8D8D8;
}
/*.slc-cmn {
width: 188px;
}*/
.slc-cmn-2 {
width: 100%;
}
/*.slc-medium {
width: 238px;
}*/
.slc-ex-medium {
width: 266px;
}
.slc-medium-2 {
width: 288px;
}
.slc-medium-4 {
width: 312px;
}
/*.slc-medium-5 {
width: 417px;
}*/
.slc-xmedium {
width: 428px;
}
.select-menu.disabled, .slcmn-style.disabled {
background-color: #DDD;
}
.select-menu.disabled .slcm-txt, .slcmn-style.disabled .slcm-txt {
color: #BBB;
}
.slc-fixed .slc-arw-box {
width: 33px;
}
.slc-fixed .arw-white-down {
width: 14px;
height: 10px;
}
.slc-fixed.slcmn-style {
padding-left: 10px;
padding-right: 33px;
height: 35px;
}
.slc-fixed.slcmn-style .slcm-txt {
font-size: 21px;
}
/* --- CUSTOM SELECT MENU --- */
.custom-select {
position: relative;
cursor: default;
width: 186px;
margin: 0 auto;
}
.custom-select-menu select {
top: -100%;
visibility: hidden;
}
.custom-menu-med {
width: 200px;
}
.custom-menu-med .select-menu {
width: 158px;
height: 36px;
line-height: 36px;
}
.custom-menu-med .slcm-txt {
font-size: 28px;
line-height: 36px;
}
.custom-menu-med .arw-orange-down {
position: absolute;
top: 50%;
right: 10px;
margin-top: -5px;
}
.select-option {
display: none;
position: absolute;
top: auto;
left: 0px;
width: 98.9247311827957%;
background-color: #FFF;
border: 1px solid #CCC;
border-top: none;
}
.custom-select.actived .select-option {
display: block;
}
.mini-option {
min-height: 66px;
max-height: 90px;
overflow: auto;
}
.select-option > li {
font-family: Tahoma, Geneva, sans-serif;
font-size: 12px;
color: #000;
padding-left: 10px;
height: 22px;
line-height: 22px;
text-align: left;
}
.select-option > li:hover {
color: #FFF;
background-color: #3399FF;
}
.custom-menu-med .select-option {
width: 100%;
min-height: 22px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* --- DROPDOWN WITH SEARCH LIST --- */
.dropdown-menu-list {
position: relative;
}
.dropdown-menu-list .triang-btm-med-gray {
position: absolute;
top: 50%;
right: 10px;
margin-top: -4px;
}
.dropdown-menu-list .input-long {
width: 508px;
padding-right: 30px;
}
.ul-list-wrap {
position: absolute;
width: 100%;
max-height: 0;
overflow: hidden;
z-index: 5;
-webkit-transition: max-height .3s ease;
transition: max-height .3s ease;
}
.ul-list-wrap.actived {
max-height: 1000px;
}
.ui-list {
width: 100%;
background-color: #FFF;
border: 1px solid transparent;
border-top: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.ui-scroll {
max-height: 312px;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.ul-list-wrap.actived .ui-list {
border-color: #CCC;
}
.ui-list > li {
cursor: pointer;
display: block;
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
color: #515151;
min-height: 32px;
line-height: 30px;
}
.ui-list > li > span, .ui-list .list-header-txt > span {
display: inline-block;
padding-left: 10px;
padding-right: 10px;
}
.ui-list > li:hover, .ui-list > .actived {
background-color: #EEE;
}
.ui-list > .hidden-list {
display: none;
}
.ui-list .list-header-txt {
position: relative;
background-color: #616161;
color: #FFF;
font-weight: bold;
}
/* --- BUTTON --- */
.cmn-button, .square-button {
cursor: pointer;
width: 80px;
height: 30px;
width: 25vw;
height: 9.375vw;
border-radius: 4px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 8px;
padding-right: 8px;
outline: none;
border: none;
text-align: center;
-webkit-appearance: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.cmn-button::-moz-focus-inner {
border: 0;
}
.cmn-button.hl-button {
display: inline-block;
width: auto;
height: auto;
padding-top: 0.9375vw;
padding-bottom: 0.9375vw;
}
.dash-button {
display: inline-block;
vertical-align: top;
padding: 7px 10px;
padding: 2.1875vw 3.125vw;
border: 1px dashed #d9d9d9;
border-radius: 3px;
outline: none;
-webkit-appearance: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.dash-button .doc-yel-icon {
margin-right: 5px;
}
.btn-txt {
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.9em;
}
.square-button {
height: 30px;
height: 9.375vw;
border-radius: 0;
}
.sq-btn-cmn, .sq-btn-med, .sq-btn-exmed, .sq-btn-long, .sq-btn-flex, .sq-btn-sm, .button-xs, .button-mini, .button-mini-2 {
width: auto;
}
.sq-btn-cmn {
min-width: 110px;
height: 28px;
line-height: 27px;
vertical-align: middle;
}
.sq-btn-med {
min-width: 156px;
min-width: 48.75vw;
height: 27px;
height: 8.4375vw;
}
.sq-btn-exmed {
min-width: 100px;
min-height: 40px;
line-height: 40px;
}
.sq-btn-long {
min-width: 340px;
min-height: 34px;
line-height: 32px;
padding-left: 10px;
padding-right: 10px;
}
.sq-btn-flex {
height: 20px;
height: 6.25vw;
}
.sq-btn-flex.long {
min-width: 40.625w;
}
.sq-btn-sm {
min-width: 45px;
height: 18px;
height: 5.625vw;
padding: 0 5px;
}
.button-mini, .button-sm, .button-md, .button-xmd, .button-large {
border-radius: 8px;
}
.button-xs, .button-mini, .button-mini-2 {
border-radius: 7px;
}
.button-xsm {
width: 89px;
height: 34px;
line-height: 34px;
}
.button-xsm-2 {
width: 64px;
height: 30px;
width: 20vw;
height: 9.375vw;
}
.button-xsm-2.-flexible {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
width: auto;
min-width: 30vw;
}
.button-styling {
border-radius: 7px;
}
.button-xs {
min-width: 80px;
height: 24px;
min-width: 25vw;
height: 7.5vw;
}
.button-mini, .button-mini-2 {
width: auto;
min-width: 50px;
min-height: 30px;
min-width: 15.625vw;
min-height: 9.375vw;
}
.button-mini-2 {
position: relative;
}
.button-sm {
width: 132px;
min-height: 46px;
}
.button-xmd {
width: 132px;
height: 28px;
width: 41.25vw;
height: 8.75vw;
}
.button-md {
width: 200px;
height: 46px;
}
.button-large {
width: 200px;
min-height: 48px;
line-height: 48px;
}
.button-flex {
min-width: 90px;
min-width: 28.125vw;
width: auto;
height: 35px;
height: 10.9375vw;
border-radius: 7px;
padding-left: 10px;
padding-right: 10px;
}
.flex-btn-sm {
height: 28px;
height: 8.75vw;
}
.flex-btn-cmn {
min-width: 190px;
min-height: 32px;
line-height: 32px;
}
.flex-btn-xcmn {
min-width: 180px;
min-height: 38px;
line-height: 38px;
}
.flex-btn-xcmn-2 {
min-width: 100px;
min-height: 38px;
line-height: 38px;
}
.flex-btn-med {
width: 200px;
min-height: 40px;
}
.flex-btn-long {
min-width: 272px;
}
.flex-btn-xlong {
min-width: 270px;
height: 40px;
border-radius: 8px;
}
.flex-btn-sm-fix, .flex-btn-med-fix {
min-width: 21.875vw;
}
.flex-btn-sm-fix {
width: 80px;
width: 25vw;
}
.flex-btn-med-fix {
width: 160px;
width: 50vw;
}
.flex-btn-fix {
width: auto;
min-width: 120px;
height: 38px;
padding-left: 10px;
padding-right: 10px;
border-radius: 7px;
}
.flex-btn-fix > .button-txt {
font-size: 22px;
}
.cmn-button.-transparent {
background-color: transparent;
}
.cmn-button.-transparent > span {
color: #f5921d;
}
.nm-btn, .md-btn {
position: relative;
cursor: pointer;
border: none;
margin: 0 auto;
outline: none;
padding-left: 8px;
padding-right: 8px;
box-sizing: border-box;
-webkit-appearance: none;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.nm-btn {
width: 118px;
height: 20px;
width: 36.875vw;
height: 6.25vw;
}
.nm-btn > span, .md-btn > span {
position: relative;
display: inline-block;
font-family: 'TrueBoldSpecial';
font-size: 17px;
font-size: 5.3125vw;
line-height: normal;
color: #fff;
vertical-align: middle;
}
.nm-btn.red-bg {
background: #f23428;
}
.nm-btn.orange-bg {
background: #f87b21;
}
.nm-btn.dark-gray-bg {
background: #666;
}
.nm-btn.med-gray-bg {
background: #ccc;
}
.nm-btn.med-gray-bg > span {
color: #333;
}
.desktop .nm-btn.red-bg:hover {
background-color: #eb0c15;
}
.desktop .nm-btn.orange-bg:hover {
background-color: #ee592b;
}
.desktop .nm-btn.dark-gray-bg:hover {
background-color: #888;
}
.desktop .nm-btn.med-gray-bg:hover {
background-color: #aaa;
}
.nm-btn.disabled, .nm-btn.disabled:active, .nm-btn.disabled:hover, .desktop .nm-btn.disabled:hover {
background-color: #ddd;
}
.md-btn.yellow-bg {
background: #f8b72e;
}
.md-btn.yellow-bg:hover {
background-color: #ffaf02;
}
.md-btn {
height: 7.5vw;
border-radius: 5px;
}
.view-btn {
position: absolute;
left: 2.8125%;
bottom: 0;
margin-bottom: 11.25%;
z-index: 8;
}
.box-style .view-btn {
left: 7.8125%;
}
.fix-height .view-btn {
margin-bottom: 11.5625%;
}
.nm-btn.flex-button {
width: auto;
min-width: 70px;
height: 20px;
margin-left: 2px;
min-width: 21.875vw;
height: 6.25vw;
margin-left: 0.625vw;
vertical-align: top;
}
.orange-button {
background-color: #F5911D;
}
.desktop .orange-button:hover {
background-color: #FF8902;
}
.orange-button-2, .yellow-button {
background-color: #F7B62E;
}
.desktop .orange-button-2:hover, .desktop .yellow-button:hover {
background-color: #FFAF02;
}
.orange-button-3 {
background-color: #ff5a25;
}
.desktop .orange-button-3:hover {
background-color: #ed3a00;
}
.orange-outline-button {
background-color: transparent;
border: 2px solid #f5911d;
}
.orange-outline-button .button-txt {
color: #f5911d;
}
.med-gray-button {
background-color: #848484;
}
.red-button {
background-color: #EB232A;
}
.desktop .red-button:hover {
background-color: #FF141C;
}
.gray-button {
background-color: #A5A5A5;
}
.desktop .gray-button:hover, .gray-button:active {
background-color: #888;
}
.dark-gray-button {
background-color: #666;
}
.desktop .dark-gray-button:hover, .gray-button:active {
background-color: #888;
}
.black-button {
background-color: #555;
}
.desktop .black-button:hover, .black-button:active {
background-color: #000;
}
.desktop .med-gray-button:hover {
background-color: #555;
}
.white-button, .desktop .white-button:hover, .white-button:active {
background-color: #fff;
}
.disabled-button, .desktop .disabled-button:hover, .disabled-button:active,
.cmn-button.disabled, .desktop .cmn-button.disabled:hover, .cmn-button.disabled:active {
cursor: default;
background-color: #ddd;
}
.button-txt, .button-txt-md, .button-txt-sm, .button-txt-xs {
font-family: 'TrueBold';
color: #fff;
}
.button-txt.blue {
color: #00b0f0;
}
.button-txt.med-gray {
color: #555;
}
.button-txt {
font-size: 20px;
font-size: 6.25vw;
}
.button-txt-sm {
font-size: 17px;
font-size: 5.3125vw;
}
.button-txt-xs {
font-size: 15px;
font-size: 4.6875vw;
}
.button-xsm .button-txt, .button-txt-md {
font-size: 25px;
}
.button-sm .button-txt, .button-md .button-txt, .button-large .button-txt {
font-size: 30px;
}
.button-xmd .button-txt, .button-mini .button-txt {
font-size: 20px;
font-size: 6.25vw;
}
.button-mini-2 .button-txt {
margin-left: -8px;
}
.disabled-button .button-txt {
color: #BBB;
}
.button-flex .button-txt {
font-size: 6.5625vw;
}
.button-flex .button-txt.-med {
font-size: 6.875vw;
}
.flex-btn-sm .button-txt {
font-size: 18px;
font-size: 5.625vw;
}
.flex-btn-med .button-txt {
font-size: 32px;
line-height: normal;
}
.square-button .button-txt {
display: block;
font-family: 'TrueBoldSpecial';
font-size: 22px;
font-size: 6.25vw;
}
.sq-btn-med .button-txt {
font-size: 18px;
font-size: 5.625vw;
}
.btn-box-2 {
text-align: center;
margin-top: 15px;
}
.button-block {
margin-top: 10px;
margin-top: 4.907975460122699%;
}
.button-block.-block > .cmn-button {
display: block;
margin-left: auto;
margin-right: auto;
}
.button-block.-block > .cmn-button + .cmn-button {
margin-top: 15px;
}
.loading-btn-box {
position: relative;
display: inline-block;
vertical-align: top;
overflow: hidden;
border-radius: 7px;
}
.form-heading .loading-btn-box {
vertical-align: middle;
margin-top: 7px;
margin-bottom: 7px;
}
.web-cam, .desktop .mobile-cam {
display: none;
}
.desktop .web-cam {
display: block;
}
.display-frame {
display: inline-block;
vertical-align: top;
padding: 12px;
border: 2px dashed #bcbcbc;
margin-bottom: 20px;
}
.display-img {
width: 69.0625vw;
height: 38.75vw;
margin: 0 auto;
background-color: #eee;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.display-img.sample-img-1 {
background-image: url('../images/pics/thai-id-sample-01.jpg');
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 80% auto;
}
.display-img.sample-img-2 {
background-image: url('../images/pics/thai-id-sample-02.jpg');
background-position: 0 0;
background-repeat: no-repeat;
background-size: 100% auto;
}
.display-img img {
display: block;
width: 100%;
max-height: 100%;
margin: 0 auto;
object-fit: contain;
}
.file-box-style.-center {
text-align: center;
}
.file-box-style.-med {
width: 40%;
margin-left: auto;
margin-right: auto;
}
.file-box-style .file-btn {
margin: 15px auto 0;
}
.-error .file-txt {
color: #ee3124;
}
.-success .file-txt {
color: transparent;
}
.-success .display-img {
background-image: none;
}
.-success .file-btn.-switchgray {
background-color: #a5a5a5;
}
.file-txt {
font-family: 'TrueMedium';
font-size: 6.25vw;
line-height: 1em;
}
.file-btn {
position: relative;
}
.file-btn input[type="file"] {
cursor: pointer;
height: 100%;
left: 0;
opacity: 0;
filter: alpha(opacity=0);
position: absolute;
top: 0;
width: 100%;
}
.ie8 .file-btn {
display: inline-block;
vertical-align: top;
}
.remove-button {
cursor: pointer;
position: relative;
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
}
.remove-button .x-red-icon {
position: absolute;
left: 50%;
top: 50%;
margin-left: -5px;
margin-top: -5px;
}
.btn-group {
text-align: center;
}
.md-med-form .loading-btn-box, .form-heading + .loading-btn-box {
border-radius: 7px;
}
.md-med-form .loading-btn-box {
margin-top: 15px;
}
.md-med-form .captcha-box, .mini-form .captcha-box {
width: 200px;
margin: 0 auto;
}
#elligible-modal.actived .captcha-box, .verify-text {
display: none;
}
#elligible-modal.actived .verify-text {
display: block;
}
.loading-btn {
position: absolute;
left: 0;
top: -100%;
width: 0 !important;
min-width: 0;
padding: 0;
overflow: hidden;
}
.loading-btn .button-txt {
opacity: 0;
}
.loading-btn-box.actived .loading-btn {
top: 0;
left: 0;
width: 100% !important;
z-index: 10;
-webkit-transition: width 1.2s ease;
transition: width 1.2s ease;
}
.loading-btn-box.actived .loading-btn .button-txt {
opacity: 1;
-webkit-transition: opacity 0.3s ease 1.2s;
transition: opacity 0.3s ease 1.2s;
}
.loading-btn-box.success .loading-btn {
opacity: 0;
-webkit-transition: opacity 0.6s ease;
transition: opacity 0.6s ease;
-webkit-transition-delay: 2s;
transition-delay: 2s;
}
.loading-btn-box.actived .white-button.disabled {
background-color: #fff;
}
.loading-btn-box.fade-load .loading-btn {
width: 100% !important;
opacity: 0;
}
.loading-btn-box.fade-load.actived .loading-btn {
opacity: 1;
-webkit-transition: opacity 1.2s ease;
transition: opacity 1.2s ease;
}
.loading-btn-box.fade-load.success .loading-btn {
opacity: 0;
-webkit-transition: opacity 0.6s ease;
transition: opacity 0.6s ease;
-webkit-transition-delay: 2s;
transition-delay: 2s;
}
.loading-btn-box.abs-btm-rigt {
position: absolute;
right: 0;
bottom: -8px;
}
.cmn-button .arw-btn-white, .cmn-button .arw-btn-white-right {
position: relative;
display: inline-block;
right: 0;
line-height: 0;
margin-top: 0;
margin-left: 7px;
}
.cmn-button .arw-btn-white {
top: 0;
}
.cmn-button .arw-btn-white-right {
top: 0;
}
.button-xs .arw-btn-white, .button-xs .arw-btn-white-right {
margin-left: -2px;
vertical-align: middle;
}
.btn-inline > .cmn-button, .mini-btn-inline > .mini-btn {
margin-left: 5px;
}
.btn-inline > .cmn-button:first-child, .mini-btn-inline > .mini-btn:first-child, .btn-inline > .btn-target,
.btn-inline .img-btn:first-child {
margin-left: 0;
}
.btn-inline .img-btn {
width: 40%;
margin-left: 1.666666666666667%;
}
.img-btn img {
width: 100%;
}
.btn-inline > .img-button img {
width: 120px;
}
/*.btn-inline > .cmn-button:first-child, .btn-inline > .img-button:first-child, .btn-inline > .flex-btn-long:first-child, .btn-inline .img-btn:first-child, .mini-btn-inline > .mini-btn:first-child {
margin-left: 0px;
}
.btn-block > * {
display: block;
margin-top: 12px;
margin-left: auto;
margin-right: auto;
}
.btn-block > *:first-child {
margin-top: 0;
}*/
.btn-inline.mtp-display .cmn-button {
margin: 5px;
}
.img-button img {
display: block;
}
.btn-float {
float: right;
margin-top: 15px;
margin-top: 5.357142857142857%;
}
.btn-float .ui-btn-style {
margin-left: 12px;
margin-left: 3.75%;
}
.btn-float .ui-btn-style:first-child {
margin-left: 0;
}
.btn-abs {
position: absolute;
left: 50%;
bottom: 90px;
z-index: 50;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.btn-abs > * {
display: inline-block;
margin-left: 5px;
}
.btn-abs > *:first-child {
margin-left: 0;
}
.mini-btn-inline {
position: relative;
z-index: 10;
}
.middle-txt {
font-family: 'TrueBoldSpecial';
font-size: 20px;
vertical-align: middle;
color: #ACACAC;
}
.ie8 .btn-abs {
width: 410px;
margin-left: -205px;
}
.group-ctn-box {
position: absolute;
width: 100%;
bottom: 0;
margin-bottom: 8.230452674897119%;
text-align: center;
}
.gctn-box-2 {
bottom: 30px;
}
.group-ctn-box h3 {
font-family: 'TrueBoldSpecial';
font-size: 21px;
font-size: 6.5625vw;
line-height: 18px;
line-height: 5.625vw;
color: #F5911D;
margin-bottom: 5px;
margin-bottom: 1.5625vw;
}
.group-ctn-box h4, .group-ctn-box .med-heading {
font-family: 'TrueMedium';
color: #666;
}
.group-ctn-box h4 {
font-size: 18px;
font-size: 5.625vw;
line-height: 1em;
line-height: 5.625vw;
margin-bottom: 1.5625vw;
}
.group-ctn-box .med-heading {
font-size: 23px;
line-height: 23px;
margin-bottom: 5px;
}
.price-txt, .price-txt-2, .price-txt-large {
position: relative;
display: inline-block;
font-family: 'TrueBoldSpecial';
margin-bottom: 5.625vw;
}
.price-txt span, .price-txt-2 span, .price-txt-large span {
font-family: 'TrueMedium';
position: absolute;
display: block;
vertical-align: top;
}
.price-txt, .price-txt-2 {
font-size: 45px;
font-size: 14.0625vw;
line-height: 0.5em;
}
.price-txt-large {
font-size: 78px;
line-height: 39px;
margin-bottom: 18px;
}
.price-txt span, .price-txt-2 span {
font-size: 16px;
font-size: 5vw;
}
.price-txt span, .price-txt-2 span {
right: -10.98901098901099%;
top: 0;
margin-top: -10.98901098901099%;
}
.price-txt-large span {
font-size: 28px;
right: -18px;
top: -12px;
}
.abs-txt-mini {
display: block;
position: absolute;
left: 0;
bottom: 0;
margin-bottom: 25%;
width: 100%;
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.5em;
color: #666;
text-align: center;
}
.divide-line {
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 100%;
background-color: #CCC;
z-index: 0;
}
.group-ctn-box > div {
position: relative;
display: inline-block;
min-width: 26px;
min-height: 92px;
min-height: 28.75vw;
vertical-align: top;
}
/*.group-ctn-box .cmn-button {
display: block;
}*/
.group-ctn-box .gray-circ {
position: absolute;
top: 50%;
margin-top: -13px;
z-index: 2;
}
/* --- TRIANGLE STYLE --- */
.triang-elm {
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
}
.triang-btm-gray {
border-top-color: #BBB;
border-width: 8px 6px 0 6px;
}
.triang-btm-med-gray {
border-top-color: #CCC;
border-width: 10px 7px 0 7px;
}
.triang-btm-black {
border-top-color: #333;
border-width: 8px 6px 0 6px;
}
/* --- HEADER --- */
.main-sec {
width: 100%;
margin: 0 auto;
}
header, .mb-nav-box, .mb-nav {
width: 100%;
}
header, .top-menu-box {
position: absolute;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: auto;
overflow: hidden;
}
header {
top: 44px;
}
header:before {
pointer-events: none;
content: "";
display: block;
position: fixed;
opacity: 0;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.7);
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
header.actived:before {
opacity: 1;
z-index: 7;
}
.ie8 header {
display: none;
}
.tpr-header {
padding-top: 44px;
}
.tpr-header.-nospace {
padding-top: 0;
}
.tpr-header.-tinyspace {
padding-top: 24px;
}
.top-menu-cart {
display: none;
}
.desktop .top-menu > li.top-menu-cart:hover > a {
color: #484848;
}
.top-menu-cart svg {
height: 14px;
}
.top-menu-cart .cart-badge-icon {
position: relative;
width: 16px;
display: inline-block;
}
.top-menu-cart .cart-badge {
position: absolute;
background: #eb232a;
height: 13px;
width: 13px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
color: #fff;
font-size: 14px;
top: 1px;
left: 9px;
font-weight: 600;
}
.top-menu-cart {
display: list-item;
}
.mb-nav-box, .mb-nav, .menu-nav-btn, .menu-logo {
height: 44px;
}
.mb-nav-box {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 10;
-webkit-transition: -webkit-transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.mb-nav-box.fixed-mb-nav {
display: block;
}
.fixed-menu .mb-nav-box {
height: 118px;
}
.fixed-menu .main-sec {
/*margin-top: 118px;*/
margin-top: 86px;
}
.mb-nav-box.actived {
-webkit-transform: translateY(-150%);
transform: translateY(-150%);
}
.mb-nav {
position: relative;
background-color: rgba(255,255,255,0.8);
box-shadow: 0px 0px 7px rgba(0,0,0,0.7);
}
.mb-nav > li {
position: absolute;
cursor: pointer;
}
.menu-nav-btn {
width: 44px;
z-index: 10;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.menu-nav-btn:first-child {
background-color: #df1400;
}
.menu-nav-btn.actived {
background-color: rgba(0,0,0,0.9);
}
.menu-nav-btn:nth-child(1):after, .menu-nav-btn:nth-child(3):after {
content: "";
display: block;
position: absolute;
width: 1px;
height: 100%;
background-color: rgba(0,0,0,0.1);
}
.menu-nav-btn:nth-child(1) {
left: 0;
border-right: 1px solid rgba(255,255,255,0.5);
}
.menu-nav-btn:nth-child(1):after {
right: -2px;
}
.menu-nav-btn:nth-child(2) {
padding-left: 46px;
padding-right: 46px;
}
.menu-nav-btn:nth-child(3) {
right: 0;
border-left: 1px solid rgba(255,255,255,0.5);
}
.menu-nav-btn:nth-child(3):after {
left: -2px;
}
.menu-nav-btn .person-icon, .menu-logo .tmh-logo, .menu-logo .true-logo {
position: absolute;
left: 50%;
top: 50%;
}
.menu-nav-btn .person-icon {
margin-left: -9px;
margin-top: -9px;
}
.menu-nav-btn.actived .person-icon {
background-position: 29.51388888888889% 0;
}
.menu-logo {
position: absolute;
width: 100%;
padding-left: 44px;
padding-right: 44px;
box-sizing: border-box;
}
.menu-logo .tmh-logo {
margin-left: -59px;
margin-top: -9px;
}
.menu-logo .true-logo {
margin-left: -37px;
margin-top: -13px;
}
.hamb-icon, .hamb-icon:before, .hamb-icon:after {
position: absolute;
width: 20px;
height: 3px;
background-color: #fff;
border-top: 1px solid #fff;
}
.hamb-icon {
left: 50%;
top: 50%;
margin-top: -2px;
margin-left: -10px;
}
.hamb-icon:before, .hamb-icon:after {
content: "";
}
.hamb-icon:before {
top: -8px;
}
.hamb-icon:after {
bottom: -7px;
}
.four-col-block .col-block {
width: 25%;
}
.sm-txt-1 {
font-family: 'TrueMedium';
font-size: 18px;
line-height: 0.8888888888888889em;
}
.col-block {
position: relative;
float: left;
display: block;
height: 74px;
text-align: center;
}
.col-block:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 50%;
width: 1px;
height: 70%;
background-color: #4e4c4c;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.col-block:first-child:before {
display: none;
}
.col-block .sm-txt-1 {
position: absolute;
left: 0;
right: 0;
bottom: 5px;
text-align: center;
}
.col-block .sprite-icons {
margin-top: 9px;
}
.col-block .postpaid-icon {
margin-top: 8px;
}
.col-block .devices-icon {
margin-top: 11px;
}
.tpr-header header {
border-radius: 0;
background-color: transparent;
box-shadow: none;
}
.ie8 header {
background: url(../images/bg/white-ovl.png) 0 0;
}
.ie8 .tpr-header header {
background: none;
}
.top-menu-box {
top: 0;
z-index: 10;
}
/* --- LANG-BOX --- */
.lang-box, .top-menu {
float: right;
height: 44px;
z-index: 15;
}
.lang-box {
position: relative;
width: 34.375%;
background-color: #666;
text-align: center;
}
.lang-box:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 1px;
height: 100%;
background-color: #e0dfe7;
}
.lang-box > li {
display: inline-block;
height: 44px;
line-height: 40px;
margin-left: 14px;
opacity: 0.2;
filter: alpha(opacity=20);
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.lang-box > .actived {
opacity: 1;
filter: alpha(opacity=100);
}
.lang-box > li:first-child {
margin-left: 0px;
}
.lang-box > li a {
display: inline-block;
vertical-align: middle;
}
/* --- TOP-MENU --- */
.top-menu {
width: 65.625%;
}
.top-menu > li {
float: left;
width: 50%;
}
.top-menu > li > a {
cursor: pointer;
position: relative;
display: block;
height: 44px;
line-height: 44px;
text-align: center;
background-color: #212121;
z-index: 15;
}
.top-menu > li > a:before, .top-menu > li > a:after {
content: "";
display: block;
position: absolute;
top: 50%;
width: 1px;
height: 30px;
opacity: 0.4;
margin-top: -15px;
}
.top-menu > li > a:before {
left: 0;
background-color: #fff;
}
.top-menu > li > a:after {
left: 1px;
background-color: #000;
}
.top-menu > li a {
position: relative;
display: block;
font-family: 'TrueBold';
font-size: 1.375em;
color: #7a7a7a;
-webkit-transition: background-color 0.3s ease, color 0.3s ease;
transition: background-color 0.3s ease, color 0.3s ease;
}
.desktop .top-menu > li:hover > a, .top-menu > .selected > a {
color: #fff;
}
.top-menu > .has-submenu.selected > a, .sub-menu > li {
background-color: #151515;
}
/*.top-menu > li:hover {
background-color: #40454F;
}
.top-menu > li:hover > a, .sub-menu > li:hover > a {
color: #FFF;
}*/
/* --- SUB-MENU --- */
.sub-menu-wrap {
position: absolute;
right: 0;
left: 0;
top: 44px;
bottom: 0;
overflow: hidden;
}
.sub-menu {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: auto;
z-index: 10;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.sub-menu > li {
border-top: 1px solid #c7c7c7;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.sub-menu > li:active {
background-color: rgba(0,0,0,0.9);
}
.sub-menu > li > a {
display: block;
color: #d9d9d9;
font-family: 'TrueLight';
font-size: 1.6875em;
padding: 17px 0 17px 15px;
}
/* --- SERVICE-MENU --- */
.sv-menu {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
z-index: 10;
}
.box-wrap {
position: relative;
top: -1px;
width: 100%;
padding-bottom: 29.375%;
}
.box-wrap .tmh-logo {
float: left;
width: 150px;
height: 23px;
width: 15vw;
height: 2.3vw;
margin-top: 24px;
}
.box-wrap-2 {
width: 252px;
padding-top: 8px;
padding-bottom: 8px;
margin: 0 auto;
}
.service-menu-wrap {
position: absolute;
width: 100%;
height: 100%;
background-size: 312.5% 2127.659574468085%;
background-position: 100% 18.57292759706191%;
}
.service-menu, .service-menu > li, .service-menu > li > a {
position: relative;
height: 100%;
}
.service-menu > li {
float: left;
width: 33.33333333333333%;
}
.menu-txt {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
text-align: center;
color: #555;
}
.service-menu > li:last-child .first-line-text {
font-size: 20px;
font-size: 6.25vw;
}
.first-line-text {
font-family: 'TrueBold';
font-size: 20px;
font-size: 6.25vw;
color: #555;
line-height: 0.7em;
text-transform: uppercase;
}
.sec-line-text {
font-family: 'TrueMedium';
font-size: 19px;
font-size: 5.9375vw;
line-height: 0.5em;
}
.menu-txt .sec-line-text {
position: absolute;
width: 100%;
bottom: 0;
margin-bottom: 9.345794392523364%;
}
.menu-txt .sprite-icons {
vertical-align: top;
}
.menu-txt .heart-icon, .menu-txt .person-red-icon {
margin-top: 14.01869158878505%;
}
.menu-txt .heart-icon {
margin-bottom: 8.411214953271028%;
}
.menu-txt .person-red-icon {
margin-top: 13.08411214953271%;
margin-bottom: 5.769230769230769%;
}
.menu-txt .iservice-icon {
margin-top: 11.21495327102804%;
margin-bottom: 4.672897196261682%;
}
.user-log-box {
position: relative;
height: 100%;
text-align: center;
}
.user-thumb {
width: 28px;
height: 28px;
border: 2px solid #FFF;
margin: 8px auto 2px;
width: 8.75vw;
height: 8.75vw;
border: 0.625vw solid #FFF;
border-radius: 50%;
margin: 2.5vw auto 0.625vw;
box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
.user-thumb img {
display: block;
width: 100%;
border-radius: 50%;
}
.user-box {
float: left;
height: 22px;
margin-top: 15px;
margin-right: 15px;
}
.user-info {
position: relative;
line-height: normal;
}
.ie8 .user-info, .ie9 .user-info {
padding-top: 12px;
}
.user-name {
display: block;
font-family: 'TrueBold';
font-size: 6.25vw;
line-height: 0.7em;
color: #555;
min-height: 28px;
min-height: 8.75vw;
}
.user-info > span {
cursor: pointer;
display: block;
font-family: 'TrueLight';
font-size: 19px;
font-size: 5.9375vw;
line-height: 0.5em;
color: #555;
text-decoration: underline;
margin-top: 5px;
margin-top: 1.5625vw;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.user-info > span:hover {
color: #EE3124;
}
.user-pvl {
cursor: pointer;
position: absolute;
width: 24px;
height: 24px;
right: 20px;
top: 11px;
width: 7.5vw;
height: 7.5vw;
right: 6.25vw;
top: 3.4375vw;
}
.user-pvl .noti-mini {
top: 0;
left: 0;
width: 20px;
height: 20px;
width: 6.25vw;
height: 6.25vw;
background-color: #ee3124;
border-color: #f1f1f1;
}
.user-pvl .noti-mini .noti-txt {
color: #fff;
}
.noti-mini {
position: absolute;
left: 12px;
top: 9px;
width: 18px;
height: 18px;
border-radius: 50%;
background-color: #fff;
border: 2px solid #eb232a;
text-align: center;
}
.noti-txt {
display: inline-block;
font-family: Tahoma, Geneva, sans-serif;
font-size: 10px;
font-size: 3.125vw;
line-height: 0.5em;
vertical-align: middle;
}
.user-box {
position: absolute;
top: 12px;
right: 20px;
margin: 0;
}
/* --- MEMBERS BUTTON --- */
.user-box .ui-btn-style {
margin-left: 10px;
}
.user-box .ui-btn-style:first-child {
margin-left: 0px;
}
.ui-btn-style {
position: relative;
cursor: pointer;
display: inline-block;
min-width: 50px;
min-height: 22px;
vertical-align: top;
text-align: center;
border: none;
-webkit-appearance: none;
outline: none;
padding: 0;
overflow: visible;
}
.ui-btn-style:before {
content: "";
display: block;
position: absolute;
right: 0;
bottom: 0;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 7px 7px 0 0;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.ui-btn-red:before {
border-top-color: #eb232a;
}
.ui-btn-gray:before {
border-top-color: #8e8e8e;
}
.ui-btn-style:after {
content: "";
display: block;
position: absolute;
width: 7px;
height: 16px;
right: 0;
top: 0px;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.ui-btn-style span {
display: block;
font-family: 'TrueBold';
font-size: 18px;
vertical-align: middle;
line-height: normal;
padding-left: 6px;
}
.ui-btn-md {
min-width: 64px;
min-height: 24px;
/*min-width: 20vw;
min-height: 7.5vw;*/
}
.ui-btn-md:before {
right: 0;
border-width: 8px 8px 0 0;
/*border-width: 2.5vw 2.5vw 0 0;*/
z-index: 1;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.ui-btn-md:after {
right: 0;
width: 8px;
height: 17px;
/*width: 2.5vw;
height: 5.3125vw;*/
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.ui-btn-md span {
font-size: 20px;
/*font-size: 6.25vw;*/
}
.ui-btn-red, .ui-btn-red:after {
background-color: #eb232a;
}
.ui-btn-gray, .ui-btn-gray:after {
background-color: #8e8e8e;
}
.ui-btn-red span, .ui-btn-gray span {
color: #fff;
}
/* --- MAIN MENU --- */
.main-menu-box {
position: absolute;
top: 44px;
left: 0;
right: 0;
bottom: 0;
z-index: 5;
}
/*.home-menu {
text-align: center;
}
.home-menu:hover .home-icon, .home-menu.actived .home-icon {
background-position: -267px -10px;
}
.home-menu .home-icon {
position: relative;
top: 4px;
}*/
.main-menu {
position: relative;
max-height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.main-menu > li {
position: relative;
border-top: 1px solid #c7c7c7;
background-color: rgba(52,52,52,0.9);
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.main-menu > li .grey-arw-icon {
position: absolute;
right: 12px;
top: 50%;
margin-top: -7px;
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
.main-menu > .actived, .main-menu > li:active, li.has-submenu.selected {
background-color: rgba(0,0,0,0.9);
}
li.has-submenu.selected .grey-arw-icon {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.main-menu > li > a, .main-sub-menu > li > a, .main-sub-menu-2 > li > a {
cursor: pointer;
position: relative;
display: block;
font-family: 'TrueLight';
font-size: 1.6875em;
color: #fff;
padding: 17px 0 17px 15px;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.main-menu > li > a > span {
display: inline-block;
vertical-align: middle;
}
.ie8 .main-menu > li:after {
display: none;
}
.ie8 .main-menu > li:hover, .ie8 .main-menu > .actived {
background-color: #FDBB30;
}
/* --- MAIN SUBMENU --- */
.main-sub-box {
position: relative;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.1s cubic-bezier(0.770, 0.000, 0.175, 1.000) 0.3s;
transition: max-height 0.1s cubic-bezier(0.770, 0.000, 0.175, 1.000) 0.3s;
}
.desktop .has-submenu:hover > .main-sub-box, .has-submenu.selected > .main-sub-box {
max-height: 100%;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.main-sub-menu > li, .main-sub-menu > li, .main-sub-menu-2 > li {
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.main-sub-menu > li {
background-color: #626262;
}
.main-sub-menu > li:active, .desktop .main-sub-menu > li:hover {
background-color: #8c8d91;
}
.main-sub-menu > li > a {
padding-left: 30px;
}
.main-sub-menu > li, .main-sub-menu-2 > li {
position: relative;
display: block;
}
/* --- SUB MENU LEVEL-2 --- */
.main-sub-menu-2 > li {
background-color: #333;
}
.main-sub-menu-2 > li:active, .desktop .main-sub-menu-2 > li:hover {
background-color: rgba(0,0,0,0.8);
}
.main-sub-menu-2 > li > a {
padding-left: 45px;
}
/* --- MODAL --- */
.call-modal, .call-ajax-modal, .call-other-modal {
cursor: pointer;
}
.md-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 100;
opacity: 0;
background: rgba(0,0,0,0.7);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transition: all 0.3s ease 0.3s;
transition: all 0.3s ease 0.3s;
}
.ie8 .md-overlay {
background-color: #000;
filter: alpha(opacity=70);
}
.ajax-spinner {
display: none;
position: absolute;
left: 50%;
top: 50%;
width: 40px;
height: 40px;
background-color: #FFF;
background-image: url(../images/icons/loader.GIF);
background-repeat: no-repeat;
background-position: center center;
margin-left: -25px;
margin-top: -25px;
z-index: 10;
padding: 5px;
}
.loader-black {
background-color: #000;
background-image: url(../images/icons/loader-black.GIF);
}
.ie8 .ajax-spinner, .ie9 .ajax-spinner {
display: block;
}
.modal-ajax {
opacity: 0;
visibility: hidden;
-webkit-transition: opacity .4s ease;
transition: opacity .4s ease;
}
.show-content .modal-ajax {
opacity: 1;
visibility: visible;
}
.show-content .spinner-box {
opacity: 0;
}
.show-content .ajax-spinner {
display: none;
}
.md-modal, .ajax-abs-box, .md-fix-scroll {
position: fixed;
top: 50%;
left: 50%;
height: auto;
z-index: 200;
visibility: hidden;
/*-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;*/
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.ie8 .ajax-abs-box, .ie8 .ajax-abs-box .md-modal {
left: 0;
top: 0;
}
.flex-modal, .flex-modal.md-show {
position: absolute;
z-index: 0;
}
.md-modal {
width: 93.75%;
}
.desktop .md-modal {
-webkit-filter: blur(0);
}
.md-max-scroll {
height: 96%;
max-height: 760px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.flex-modal.md-max-scroll {
height: 100%;
}
.short-scrolling {
max-height: 540px;
}
.md-show, .ajax-abs-box.actived {
visibility: visible;
z-index: 300;
}
.ie8 .md-modal {
display: none;
}
.ie8 .md-show {
display: block;
}
.md-exsm-size {
max-width: 480px;
}
.md-sm-size {
max-width: 550px;
}
.md-sm-size2 {
max-width: 440px;
}
.md-cmn-size {
width: 93.75%;
max-width: 650px;
}
.md-excmn-size {
max-width: 700px;
}
.md-med-size {
max-width: 870px;
}
.md-xmed-size {
max-width: 960px;
}
.md-large-size {
width: 1120px;
}
.md-xlarge-size {
width: 1230px;
}
.md-mari-size {
width: 1140px;
}
.md-pack-box {
width: 285px;
}
.md-full-width {
width: 100%;
}
.md-pic {
max-width: 960px;
}
.md-fix-scroll {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease 0.3s;
transition: max-height 0.3s ease 0.3s;
}
.md-fix-scroll.md-show {
overflow: visible;
max-height: 100%;
-webkit-transition: max-height 0.1s ease;
transition: max-height 0.1s ease;
}
.md-fix-scroll .md-modal {
position: relative;
left: 0;
top: 0;
opacity: 1;
visibility: visible;
margin: 0 auto;
z-index: 0;
-webkit-transform: none;
transform: none;
}
.ie8 .md-pic {
margin-left: -480px;
margin-top: -261px;
}
.md-pic .md-ctn-box-2 {
padding: 0;
background-color: transparent;
}
.md-pic .md-img-box img {
width: 100%;
}
.md-header {
position: relative;
display: block;
background-color: #F9B72F;
padding: 8px 25px 12px;
}
.md-header h3, .md-header-2 h3, .heading-3 {
display: inline-block;
font-family: 'TrueMedium';
color: #FFF;
line-height: normal;
vertical-align: middle;
}
.md-header h3, .heading-3 {
font-size: 24px;
line-height: 0.75em;
}
.md-header-2 {
position: relative;
display: block;
height: 40px;
line-height: 36px;
background-color: #FAB82E;
border-radius: 8px;
}
.md-header-2:before, .md-header-2:after {
content: "";
display: block;
position: absolute;
left: 0;
background-image: url(../images/bg/sprite-bg.png);
background-repeat: no-repeat;
}
.md-header-2:before {
width: 100%;
height: 100%;
background-size: 364.963503649635% 4761.904761904762%;
background-position: 60.19283746556474% 15.3217568947906%;
border-radius: 8px;
z-index: 1;
}
.md-header-2:after {
bottom: -12px;
width: 100%;
height: 27px;
bottom: -3.75vw;
height: 8.4375vw;
background-size: 363.6363636363636% 8695.652173913043%;
background-position: 100% 15.75619625695498%;
z-index: 0;
}
.ie8 .md-header-2:before {
background-position: -874px -600px;
}
.ie8 .md-header-2:after {
bottom: -20px;
width: 100%;
height: 56px;
background-position: -1450px -623px;
}
.md-header-2 h3 {
position: relative;
font-size: 32px;
z-index: 5;
}
.header-sm {
padding: 15px 20px;
}
.md-close-btn, .md-close-btn-2 {
cursor: pointer;
position: absolute;
}
.md-close-btn {
right: 0;
top: 0;
width: 40px;
height: 100%;
margin-top: 0;
}
.md-close-btn.-fix {
right: 0;
height: 40px;
}
.md-close-btn-2 {
right: -8px;
top: 0px;
width: 50px;
height: 50px;
z-index: 7;
}
.md-header-2 .md-close-btn {
height: 40px;
right: -15px;
top: -10px;
margin-top: 0;
z-index: 10;
}
.md-close-btn .x-white-icon, .md-close-btn .x-circle-icon, .md-close-btn .x-yellow-icon {
position: absolute;
left: 50%;
top: 50%;
}
.md-close-btn .x-white-icon {
margin-left: -5px;
margin-top: -5px;
}
.md-close-btn .x-yellow-icon {
margin-left: -7px;
margin-top: -7px;
}
.ie8 .md-close-btn .x-white-icon {
margin-left: -6px;
margin-top: -6px;
}
.md-close-btn .x-circle-icon {
margin-left: -18px;
margin-top: -15px;
}
.md-content {
position: relative;
margin: 0 auto;
}
.md-content-inner {
background-color: #ECECEC;
border-radius: 8px;
}
.md-content-inner .md-ctn-box {
background-color: transparent;
}
.md-ctn-box, .md-ctn-box-2, .md-ctn-box-4 {
background-color: #FFF;
}
.md-ctn-box {
padding: 15px 20px;
}
.md-ctn-box-2, .md-ctn-box-3 {
padding: 20px 15px;
}
.md-ctn-box-3 {
background-color: #fff;
}
.md-ctn-box-3 > h4:first-child {
font-family: 'TrueMedium';
font-size: 26px;
line-height: 0.8461538461538462em;
}
.md-ctn-box .true-id-logo {
position: absolute;
right: 10px;
bottom: 15px;
}
.ie8 .md-img-size .md-ctn-box-3 {
width: 430px;
}
.md-ctn-box .btn-inline, .md-ctn-box-2 .btn-inline {
margin-top: 20px;
}
.text-prg {
display: block;
font-family: 'TrueMedium';
font-size: 20px;
line-height: 1em;
}
.md-ctn-box-3 .text-prg {
width: 260px;
margin: 0 auto;
}
.img-button {
display: inline-block;
vertical-align: top;
margin-left: 10px;
}
.img-button:first-child {
margin-left: 0;
}
.md-max-scroll .md-content, .md-max-scroll .md-content-wrap, .md-max-scroll .modal-ajax, .md-max-scroll .ajax-container {
position: relative;
height: 100%;
}
.md-max-scroll .md-header {
position: absolute;
display: block;
left: 0;
top: 0;
width: 94.25287356321839%;
padding-left: 2.873563218390805%;
padding-right: 2.873563218390805%;
z-index: 10;
}
.md-max-scroll .md-scrolling, .md-max-scroll .md-scrolling-2, .md-max-scroll .md-scrolling-3 {
height: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.md-max-scroll.md-show .md-scrolling, .md-max-scroll.md-show .md-scrolling-2, .md-max-scroll.md-show .md-scrolling-3,
.md-max-scroll .md-scrolling-4 {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.md-max-scroll .md-scrolling {
padding-top: 65px;
}
.md-scrolling-2 {
padding-top: 62px;
}
.md-scrolling-3 {
position: relative;
padding-top: 15px;
padding-bottom: 15px;
}
.md-scrolling-4 {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 95px;
padding-top: 65px;
}
.md-scrolling-4 .box-ctn-3 {
margin-bottom: 15px;
}
.md-ctn-fix-btm {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 10px 10px 15px;
}
.md-ctn-fix-btm .btn-inline {
margin-top: 8px;
}
.md-max-scroll .md-ctn-box-4.md-scrolling {
padding-top: 50px;
}
.ie8 .md-max-scroll .md-scrolling, .ie8 .md-max-scroll .md-scrolling-2 {
height: 620px;
}
.ie8 .short-scrolling .md-scrolling, .ie8 .short-scrolling .md-scrolling-2 {
height: 540px;
}
.md-prg-box {
position: relative;
min-height: 150px;
}
.md-prg-box.-spacing {
padding: 10px;
min-height: 80px;
}
.md-prg-box h3, .md-prg-box h4 {
font-family: 'TrueBold';
font-size: 22px;
line-height: 1em;
}
.md-prg-box h3 {
max-width: 430px;
}
.md-prg-box h4 {
font-size: 23px;
line-height: 0.9em;
margin-bottom: 8px;
}
.md-prg-box .tbold-exlarge-special {
margin-bottom: 10px;
}
.md-prg-box .tmed-large-size {
margin-bottom: 10px;
}
.md-cmn-prg {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 1.1em;
color: #555;
}
.md-cmn-prg p {
display: block;
margin-bottom: 15px;
}
.md-txt-list, .md-txt-list > p {
margin-bottom: 15px;
}
.md-txt-list > li, .md-prg-box p {
display: block;
font-family: 'TrueMedium';
font-size: 19px;
line-height: 1em;
color: #555;
}
.md-prg-box p {
display: block;
margin-bottom: 20px;
}
.md-prg-box p:last-child {
margin-bottom: 0;
}
.md-prg-box p.black-txt {
color: #000;
}
.md-txt-list > li {
line-height: normal;
margin-top: 3px;
}
.md-txt-list-2 > li {
display: block;
font-family: 'TrueMedium';
font-size: 23px;
line-height: 23px;
color: #555;
margin-top: 20px;
}
.md-txt-list > li:first-child, .md-txt-list-2 > li:first-child {
margin-top: 0;
}
.middle-prg {
min-height: 130px;
line-height: 130px;
}
.middle-prg-ctn {
display: inline-block;
vertical-align: middle;
line-height: normal;
}
.middle-prg-ctn .btn-inline {
margin-top: 20px;
}
.middle-prg-ctn .info-yellow-icon {
margin-bottom: 10px;
}
.md-img-box img {
display: block;
width: 90%;
margin: 0 auto;
}
.md-img-box .md-close-btn {
width: 40px;
height: 40px;
}
.md-form-box {
max-width: 730px;
margin: 0 auto;
}
.md-form-box > h3 {
font-family: 'TrueBold';
font-size: 24px;
line-height: 0.8333333333333333em;
margin-bottom: 10px;
}
.txt-indent {
margin-left: 18px;
}
.txt-indent-2 {
margin-left: 44px;
}
.hpl-txt-box {
margin-top: 25px;
}
.hpl-txt-box > a {
display: block;
font-family: 'TrueMedium';
font-size: 28px;
letter-spacing: -0.5px;
text-decoration: underline;
}
.hpl-txt-box > a:first-child {
float: left;
}
.hpl-txt-box > a:first-child + a {
float: right;
}
.md-med-form-wrap {
background-color: #FFF;
margin: 0 auto;
}
.md-med-form-wrap.-flex {
min-height: 140px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.md-med-form-wrap > h3, .md-med-form-wrap > h2 {
font-family: 'TrueMedium';
font-size: 26px;
line-height: 0.7692307692307692em;
}
.md-med-form-wrap > h2 {
margin-bottom: 5px;
}
.md-med-form-wrap > h3 {
margin-bottom: 20px;
}
.md-med-form-wrap > h3 strong, .md-med-form-wrap > h4, .md-med-form-wrap > h5, .md-med-form-wrap > h6 {
font-family: 'TrueBold';
}
.md-med-form-wrap > h4 {
font-size: 25px;
line-height: 0.8em;
margin-bottom: 15px;
}
.md-med-form-wrap > h5 {
font-size: 18px;
line-height: 1em;
margin-bottom: 15px;
}
.md-med-form-wrap > h6 {
max-width: 91.11111111111111%;
font-size: 20px;
line-height: 1em;
margin: 0 auto 12px;
}
.md-med-form {
display: inline-block;
text-align: center;
}
.med-form-style {
min-width: 250px;
}
.md-med-row {
margin-bottom: 15px;
text-align: left;
}
.md-block-row > .md-med-col {
float: none;
display: block;
margin-left: 0;
margin-top: 12px;
}
.md-block-row .cmn-txt-label-sm-btm {
line-height: normal;
}
.md-block-row .xcmn-txt-label.lbl-block {
margin-bottom: 3px;
}
.md-med-col {
float: left;
width: 100%;
}
.md-med-row .md-med-col {
margin-top: 10px;
}
.md-med-row .lbl-block:first-child + .md-med-col {
margin-top: 0;
}
.md-med-row .cmn-button {
margin-left: 12px;
vertical-align: top;
}
.md-modal .cmn-input {
font-size: 21px;
height: 35px;
}
.md-split-col > div {
display: inline-block;
vertical-align: top;
}
.md-med-row .md-split-col > div:first-child {
width: 57.69230769230769%;
max-width: 200px;
}
.md-split-col .cmn-txt-label-sm-btm {
margin-top: 10px;
}
.md-med-row .md-split-col .cmn-button {
margin-left: 0;
}
.captcha-box {
width: 100%;
margin: 0 auto 15px;
}
.captcha-box.-topspace {
margin-top: 20px;
}
.captcha-box img {
display: block;
cursor: pointer;
width: 100%;
margin-left: auto;
margin-right: auto;
}
.captcha-box .g-recaptcha {
-webkit-transform: scale(0.77);
transform: scale(0.77);
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
}
.box-ctn-3 .tbold-xlarge-size {
line-height: 0.7142857142857143em;
margin-bottom: 10px;
}
.content-inline > div {
vertical-align: middle;
margin-top: 15px;
}
.content-inline > div:first-child {
/*width: 250px;*/
margin-top: 0;
}
.content-inline > div img {
width: 100%;
}
.splitbox-right .box-ctn-acd.actived {
background-color: transparent;
}
.splitbox-right .box-acd-ctn-inner {
padding: 3.846153846153846% 6.923076923076923% 6.923076923076923%;
}
.splitbox-right .ctn-tgl-box {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease;
transition: max-height 0.3s ease;
}
.splitbox-right .box-ctn-acd.actived .ctn-tgl-box {
max-height: 5000px;
}
.splitbox-right .content-inline > div:first-child, .splitbox-right .img-button img,
.splitbox-right .logo-list > li img, .splitbox-right .logo-list-2 > li img {
width: 100%;
}
.splitbox-right .btn-inline {
margin-top: 7.692307692307692%;
}
.splitbox-right .img-button {
width: 48%;
margin-left: 4%;
}
.splitbox-right .img-button:first-child {
margin-left: 0;
}
.splitbox-right .logo-list > li, .splitbox-right .logo-list-2 > li {
width: 19.19642857142857%;
}
.splitbox-right .prg-ctn-2 + .prg-ctn-2 {
margin-top: 20px;
margin-top: 6.25vw;
}
.box-acd-ctn-inner {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.9em;
}
.box-acd-ctn-inner h4 {
font-size: 30px;
line-height: 0.8333333333333333em;
margin-bottom: 15px;
text-align: center;
}
.content-inline h4 + .prg-ctn-2 {
line-height: 1em;
}
.inline-block-list > li {
margin-bottom: 15px;
}
.inline-block-list > li > div:first-child > span {
font-size: 24px;
}
.inline-block-list > li > div > span {
display: block;
line-height: 0.8888888888888889em;
}
.logo-list-2 > li {
margin-bottom: 10px;
}
.logo-list-2 > li img {
width: 32px;
}
.md-modal .cmn-button {
width: 80px;
height: 30px;
}
.md-modal .cmn-button .button-txt {
font-size: 20px;
}
.md-modal .flex-btn-fix {
min-width: 100px;
width: auto;
height: 38px;
}
.md-modal .flex-btn-fix .button-txt {
font-size: 22px;
}
.md-modal .button-xmd {
width: 120px;
height: 32px;
}
.md-modal .button-flex {
min-width: 100px;
width: auto;
height: 35px;
}
.md-modal .flex-btn-sm {
height: 30px;
}
.md-modal .flex-btn-med {
min-width: 180px;
width: auto;
height: auto;
min-height: 40px;
padding-top: 5px;
padding-bottom: 5px;
}
.md-modal .slc-short {
height: 30px;
}
.md-modal .slc-cmn-style {
height: 34px;
}
.md-modal .loading-btn {
min-width: 0;
}
.md-modal .button-xmd .button-txt, .md-modal .slc-short .slcm-txt {
font-size: 20px;
}
.md-modal .button-flex .button-txt {
font-size: 21px;
line-height: 0.6666666666666667em;
}
.md-modal .flex-btn-sm .button-txt {
font-size: 18px;
line-height: 1em;
}
.md-modal .button-flex .sm-txt-size-3 {
font-size: 18px;
line-height: 0.6666666666666667em;
}
.md-modal .sm-label-left {
font-size: 20px;
}
.md-modal .cmn-label, .md-modal .cmn-label-left {
font-size: 22px;
}
.md-modal .cmn-txt-label, .md-modal .cmn-txt-label-btm {
font-size: 18px;
}
.md-modal .slcm-txt {
font-size: 20px;
}
.md-modal .sq-select {
height: 35px;
}
.md-modal .flex-btn-xlong {
height: 38px;
}
.md-modal .flex-btn-xlong .button-txt {
font-size: 23px;
}
.md-header .white-wifi-icon {
width: 28px;
height: 20px;
vertical-align: bottom;
}
/* --- MODAL EFFECT --- */
.md-show.md-effect-1 ~ .md-overlay {
opacity: 1;
visibility: visible;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.md-overlay.show {
opacity: 1;
visibility: visible;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.md-effect-1 .md-content {
opacity: 0;
-webkit-transform: translateY(5%);
transform: translateY(5%);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-1 .md-content {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
/* --- SPINNER --- */
.spinner-box, .spinner {
position: absolute;
left: 50%;
top: 50%;
}
.spinner-box {
opacity: 1;
display: block;
width: 56px;
height: 56px;
margin-left: -28px;
margin-top: -28px;
background-color: #000;
border-radius: 50%;
-webkit-transform: opacity 0.3s ease;
transform: opacity 0.3s ease;
}
.spn-gray {
background-color: #FAFAFA;
}
.spinner-box.actived {
z-index: 20;
}
.ie8 .spinner-box, .ie9 .spinner-box {
display: none;
}
.spinner {
width: 44px;
height: 44px;
margin-left: -22px;
margin-top: -22px;
}
.circle {
width: 34px;
height: 34px;
margin: 0 auto;
background-color: rgba(0,0,0,0);
opacity: .9;
border: 5px solid rgba(238,49,36,0.9);
border-right: 5px solid rgba(0,0,0,0);
border-left: 5px solid rgba(0,0,0,0);
border-radius: 50px;
-webkit-box-shadow: 0 0 29px #EE3124;
box-shadow: 0 0 29px #EE3124;
-moz-animation: spinPulse 1s infinite ease-in-out;
-webkit-animation: spinPulse 1s infinite linear;
animation: spinPulse 1s infinite linear;
}
.circle1 {
position: relative;
top: -35px;
width: 16px;
height: 16px;
margin: 0 auto;
opacity: .9;
background-color: rgba(0,0,0,0);
border: 5px solid rgba(238,49,36,0.9);
border-left: 5px solid rgba(0,0,0,0);
border-right: 5px solid rgba(0,0,0,0);
border-radius: 50px;
-webkit-box-shadow: 0 0 15px #EE3124;
box-shadow: 0 0 15px #EE3124;
-moz-animation: spinoffPulse 1s infinite linear;
-webkit-animation: spinoffPulse 1s infinite linear;
animation: spinoffPulse 1s infinite linear;
}
@-moz-keyframes spinPulse {
0% { -moz-transform: rotate(160deg); opacity: 0; box-shadow:0 0 1px #EE3124; }
50% { -moz-transform: rotate(145deg); opacity: 1; }
100% { -moz-transform: rotate(-320deg); opacity: 0; }
}
@-moz-keyframes spinoffPulse {
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spinPulse {
0% { -webkit-transform: rotate(160deg); opacity: 0; box-shadow:0 0 1px #EE3124; }
50% { -webkit-transform: rotate(145deg); opacity: 1;}
100% { -webkit-transform: rotate(-320deg); opacity: 0; }
}
@-webkit-keyframes spinoffPulse {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spinPulse {
0% { transform: rotate(160deg); opacity: 0; box-shadow:0 0 1px #EE3124;}
50% { transform: rotate(145deg); opacity: 1; }
100% { transform: rotate(-320deg); opacity: 0; }
}
@keyframes spinoffPulse {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.toggle-txt {
opacity: 1;
visibility: visible;
}
.toggle-txt, .toggle-loader-box .spinner-box {
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.toggle-loader-box .spinner-box {
opacity: 0;
visibility: hidden;
left: auto;
right: 0;
margin-left: 0;
-webkit-transform: translateX(150%);
transform: translateX(150%);
}
.toggle-loader-box.actived .toggle-txt {
opacity: 0;
visibility: hidden;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
.toggle-loader-box.actived .spinner-box {
opacity: 1;
visibility: visible;
-webkit-transform: translateX(0);
transform: translateX(0);
}
.ie8 .toggle-loader-box .ajax-spinner, .ie9 .toggle-loader-box .ajax-spinner {
display: none;
left: 0;
margin-left: 0;
}
.ie8 .toggle-loader-box.actived .ajax-spinner, .ie9 .toggle-loader-box.actived .ajax-spinner {
display: block;
}
.ajax-med-box .ajax-spinner {
margin-top: -50px;
}
/* --- BANNER --- */
.main-bg-right {
position: absolute;
right: 0;
top: 0;
width: 51.5625%;
padding-bottom: 102.5%;
background-size: 609.7560975609756% 616.3328197226502%;
background-position: 71.48834429169157% 40.31632348552671%;
z-index: 5;
}
.banner-box {
position: relative;
overflow: hidden;
}
.banner-inner img, .slogan-box img, .sm-banner > li img {
width: 100%;
}
.slogan-box, .slogan-box img {
position: absolute;
}
.slogan-box {
right: 0;
top: 30px;
width: 47.8125%;
padding-bottom: 48.75%;
margin-top: 9.375%;
z-index: 6;
}
.main-banner .owl-dots {
bottom: 0;
margin-bottom: 31.875%;
padding-right: 12.5%;
height: 9px;
box-sizing: border-box;
}
.main-banner .owl-dot {
margin-left: 8px;
}
.main-banner .owl-dot:first-child {
margin-left: 0;
}
.sm-banner-box {
position: absolute;
width: 100%;
left: 0;
bottom: 0;
text-align: center;
margin-bottom: 2.5%;
z-index: 5;
}
.sm-banner {
display: inline-block;
width: 95.3125%;
vertical-align: top;
background-color: #d3d4d8;
background-color: rgba(211,212,216, 0.8);
}
.sm-banner > li {
position: relative;
float: left;
width: 70.49180327868852%;
font-family: 'TrueMedium';
font-size: 17px;
line-height: 0.9em;
text-align: left;
color: #383838;
}
.sm-banner > li:first-child {
width: 29.50819672131148%;
}
.sm-banner-box .owl-item .sm-banner {
border-radius: 6px;
}
.sm-banner-box .owl-item:first-child li img {
border-radius: 6px 0 0 6px;
}
.sm-banner > li > a {
padding: 3.255813953488372% 4.651162790697674% 0;
}
.sm-banner > li:first-child > a {
padding: 0;
}
.sm-banner > li h3 {
font-family: 'TrueBold';
font-size: 20px;
color: #b0161a;
margin-bottom: 2px;
}
.sm-banner-box .owl-item:first-child + .owl-item li {
float: right;
}
.sm-banner-box .owl-item:first-child + .owl-item li:first-child img {
border-radius: 0 6px 6px 0;
}
.sm-banner-box .owl-item:first-child li:first-child + li > a {
padding-right: 9.302325581395349%;
}
.sm-banner-box .owl-item:first-child + .owl-item li:first-child + li > a {
padding-left: 11.62790697674419%;
}
.sm-banner-box .owl-prev, .sm-banner-box .owl-next {
cursor: pointer;
position: absolute;
top: 50%;
width: 3.125%;
height: 0;
padding-bottom: 4.375%;
background-image: url(../images/icons/sprite-icons@2x.png);
background-repeat: no-repeat;
background-size: 4736.842105263158% 14285.71428571429%;
margin: 0;
z-index: 5;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.sm-banner-box .owl-prev {
left: 3.75%;
background-position: 43.58683314415437% 9.264853977844914%;
}
.sm-banner-box .owl-next {
right: 3.75%;
background-position: 54.02951191827469% 9.264853977844914%;
}
.sm-banner-box .owl-prev.disabled, .sm-banner-box .owl-next.disabled {
opacity: 0.3;
}
.main-content {
position: relative;
width: 100%;
margin: 0 auto;
overflow: hidden;
}
.main-content.t-line {
padding-top: 4px;
}
.main-content.t-line:after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
max-width: 1100px;
background-color: #666;
z-index: 1;
}
/* --- BOX --- */
.border-btm-before:before, .bdr-btm-orange:before {
content: "";
display: block;
height: 5px;
left: 0;
position: absolute;
width: 105%;
z-index: 1;
}
.border-btm-before::before {
background-color: #666;
bottom: 0;
}
.box-inner, .box-top-cmn {
position: relative;
width: 100%;
}
.box-inner {
min-height: 97px;
min-height: 30.3125vw;
margin: 0 auto;
z-index: 4;
}
.box-top-head-2 {
position: relative;
text-align: center;
padding-top: 6.25%;
border-bottom: 5px solid #666;
z-index: 5;
}
.box-top-head-2 .tab-head-styling {
border-bottom: none;
}
.box-top-head-2 > h1 {
margin-bottom: 3.125%;
}
.main-content .box-content.box-style:first-child .box-top-inner .view-btn, .box-inner-style .view-btn {
left: auto;
right: 6.25vw;
margin-bottom: 3.75%;
}
.main-content .box-content.box-style:first-child .box-inner-style .view-btn {
top: 50%;
margin-bottom: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.box-top {
position: relative;
display: block;
height: 80px;
height: 25vw;
top: 34px;
top: 10.625vw;
left: 0;
width: 100%;
z-index: 0;
border-radius: 0 60px 0 0;
border-radius: 0 18.75vw 0 0;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-top-inner {
position: relative;
min-height: 38px;
padding-top: 25px;
min-height: 11.875vw;
padding-top: 7.8125vw;
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
.box-top-inner.border-btm-before h1, .box-top-inner.border-btm-before h2 {
margin-top: 4px;
margin-top: 1.25vw;
}
.box-top-cmn {
min-height: 16.5625vw;
overflow: hidden;
}
.box-top-cmn h2, .box-top-inner h1, .box-top-inner h2, .box-ctn-mini h2 {
font-family: 'TrueLight';
font-size: 8.75vw;
}
.box-top-cmn h2, .box-top-inner h1, .box-top-inner h2 {
float: left;
}
.box-top-cmn.border-btm-before h2, .box-top-inner h1, .box-top-inner h2 {
margin-left: 10px;
margin-top: 20px;
margin-left: 3.125vw;
margin-top: 6.25vw;
}
.box-top-cmn > .cmn-tab-head, .box-top-inner > .cmn-tab-head {
position: absolute;
bottom: 5px;
}
.box-top-cmn > .cmn-tab-head {
right: 0;
}
.box-top-inner > .cmn-tab-head {
right: 4.166666666666667%;
}
.cmn-tab-head {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: flex-end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
align-items: flex-end;
-ms-flex-pack: flex-end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
text-align: center;
}
.cmn-tab-head > li {
cursor: pointer;
min-height: 32px;
min-height: 10vw;
background-color: #e0e0e0;
border-radius: 6px 6px 0 0;
padding-left: 7px;
padding-right: 7px;
padding-left: 2.1875vw;
padding-right: 2.1875vw;
margin-left: 7px;
margin-left: 2.1875vw;
vertical-align: bottom;
}
.cmn-tab-head > .actived {
background-color: #666;
}
.cmn-tab-head > li:first-child {
margin-left: 0;
}
.cmn-tab-head > li > span, .cmn-tab-head > li > a {
color: #555;
display: inline-block;
font-family: 'TrueBold';
font-size: 21px;
font-size: 6.5625vw;
line-height: normal;
vertical-align: middle;
-webkit-transition: color 0.3s ease 0s;
transition: color 0.3s ease 0s;
}
.cmn-tab-head > li > a {
width: 100%;
height: 100%;
}
.cmn-tab-head > .actived > span, .cmn-tab-head > .actived > a {
color: #fff;
}
.cmn-tab-head.-fix > li > span, .cmn-tab-head.-fix > li > a {
font-size: 18px;
font-size: 5.625vw;
padding-top: 5px;
padding-bottom: 5px;
}
.cmn-tab-head.-fix > li {
min-width: 40.625vw;
}
.cmn-tab-head.-fix .bolder {
font-family: 'TrueBoldSpecial';
font-size: 1.38889em;
line-height: 1em;
}
.cmn-tab-head.-fix .bolder.-block {
display: block;
line-height: 0.6em;
}
.tab-holder-box {
max-height: 0;
overflow: hidden;
}
.cmn-tab-holder {
max-height: none;
height: 42px;
height: 13.125vw;
padding-bottom: 5px;
}
.med-tab-holder {
max-height: none;
height: 40px;
height: 12.5vw;
padding-bottom: 20px;
}
.med-tab-holder-2 {
max-height: none;
height: 100px;
height: 31.25vw;
padding-bottom: 5px;
}
.tab-head-med > .topup-tab {
background-color: transparent;
min-height: 24px;
min-height: 7.5vw;
line-height: normal;
border-radius: 0;
padding: 0;
margin-left: 0.9375vw;
}
.tab-head-styling, .tab-head-styling-2 {
position: relative;
padding-top: 10px;
padding-top: 3.125vw;
border-bottom: 5px solid #666;
max-width: 1100px;
margin: 0 auto;
z-index: 2;
}
.tab-head-styling {
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.tab-head-styling > li, .tab-head-styling-2 > li {
min-width: 58px;
min-width: 18.125vw;
}
.tab-head-styling-2 {
display: block;
text-align: center;
}
.tab-head-styling-2 > li {
display: inline-block;
min-height: 32px;
line-height: 30px;
min-height: 10vw;
line-height: 9.375vw;
vertical-align: bottom;
}
.tab-head-styling-2 > li > a {
display: inline-block;
vertical-align: middle;
line-height: normal;
}
.tab-head-styling-2 > .tpr-tab {
display: block;
cursor: pointer;
position: absolute;
top: 0;
left: 15px;
right: 15px;
background-color: transparent;
margin-top: 7.1875%;
margin-left: 0;
}
.tab-head-styling-2 > .tpr-tab > a {
color: #ee3124;
text-decoration: underline;
}
.tab-head-txt {
display: block;
font-family: 'TrueMedium';
font-size: 22px;
font-size: 6.875vw;
margin-bottom: 12.5%;
}
.orange-tab > .actived {
background-color: #f5921d;
}
.tab-head-styling.orange-tab, .tab-head-styling-2.orange-tab {
border-bottom-color: #f5921d;
}
.abs-tab, .abs-tab-2, .fixing-box {
width: 100%;
-webkit-transition: -webkit-transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.fixed-tab .cmn-tab-holder, .fixed-tab .med-tab-holder-2 {
max-height: none;
}
.fixed-tab .abs-tab, .bottom .abs-tab, .fixed-tab .fixing-box, .bottom .fixing-box,
.fixed-tab .check-status-box .abs-tab, .bottom .check-status-box .abs-tab,
.fixed-tab .abs-tab-2, .bottom .abs-tab-2 {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 9;
-webkit-transform: translateY(44px);
transform: translateY(44px);
}
.fixed-tab .main-content:first-child .abs-tab,
.fixed-tab .main-content:first-child .check-status-box .abs-tab {
-webkit-transform: translateY(0);
transform: translateY(0);
padding-top: 25px;
-webkit-transition: padding-top 0.9s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
transition: padding-top 0.9s cubic-bezier(0.77, 0, 0.175, 1), transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.fixed-tab .mb-nav-box.actived + .main-sec .abs-tab, .fixed-tab .mb-nav-box.actived + .main-sec .fixing-box,
.fixed-tab .mb-nav-box.actived + .main-sec .abs-tab-2 {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
.fixed-tab .tab-holder-box {
max-height: 1000px;
}
.bottom .mb-nav-box.actived + .main-sec .abs-tab, .bottom .mb-nav-box.actived + .main-sec .fixing-box,
.bottom .mb-nav-box.actived + .main-sec .abs-tab-2,
.bottom .main-sec .main-content:first-child .abs-tab {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.no-trans .abs-tab, .no-trans .abs-tab-2 {
-webkit-transition: none;
transition: none;
}
.cmn-box-outer {
padding-bottom: 6.666666666666667%;
}
.cmn-box-outer .cmn-tab-head {
margin-bottom: 6.666666666666667%;
}
.cmn-box-outer .tab-ctn .cmn-form-style {
padding-top: 5%;
}
.cmn-box-outer .cmn-tab-head + .tab-ctn .cmn-form-style {
padding-top: 0;
}
.cmn-box-outer .cmn-form-style {
width: 90%;
padding-left: 5%;
padding-right: 5%;
}
.abs-select {
padding-top: 6.25%;
background-color: #fafafa;
}
.abs-select .select-menu {
width: 78.125%;
margin: 0 auto;
}
.box-main-wrap .abs-select:first-child {
border-top: 5px solid #666;
}
.box-content, .box-main-2, .img-bg-box, .box-content-3, .box-content-4 {
position: relative;
overflow: hidden;
}
.box-content.ovf-visible {
overflow: visible;
}
.box-main-2, .img-bg-box, .img-bg-box img, .box-btm, .img-bg-box .comp-img-slide .items-slides,
.img-bg-box .comp-img-slide .items-slides img {
border-radius: 0 0 0 60px;
border-radius: 0 0 0 18.75vw;
}
.img-bg-box .items-slides img {
border-radius: 0;
}
/*.box-img-styling {
overflow: visible;
}*/
.img-bg-box {
width: 100%;
}
.img-bg-box img {
position: relative;
width: 212.1875%;
}
.img-box-1 img {
left: -6.25%;
}
.img-box-2 img {
width: 238.125%;
}
.img-box-3 img {
width: 184.375%;
}
.img-bg-box.bg-pos-top img {
left: -4.6875%;
}
.box-content {
max-width: 1100px;
margin: -22.5% auto 15%;
z-index: 3;
}
.box-content + .box-content {
z-index: 4;
}
.box-content-4 + .box-content.box-style {
z-index: 5;
}
.box-style-2 {
margin-top: -15%;
margin-bottom: 15%;
}
.box-style:first-child + .box-style-2 {
z-index: 2;
margin-top: -31.25%;
}
.main-content .box-content:first-child, .main-content .no-top-spc, .main-content .box-style-2:first-child,
.main-content .cmn-tab-head + .box-content, .main-content .abs-tab-2 + .box-content {
margin-top: 0;
}
.spc-btm {
margin-bottom: 0;
}
.box-btm-2 {
position: relative;
width: 101.818%;
padding-bottom: 25%;
margin-top: -2.5%;
margin-bottom: -22.5%;
z-index: 5;
outline: 1px solid transparent;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.bnr-box-ctn {
max-width: 1100px;
margin: 0 auto;
}
.box-top-2, .bnr-box-ctn, .bnr-img-box, .bnr-img-box img {
border-top-right-radius: 60px;
border-top-right-radius: 18.75vw;
}
.box-top-2 {
position: relative;
top: 1px;
padding-bottom: 18.75%;
overflow: hidden;
}
.box-top-2:after {
content: "";
display: block;
position: absolute;
left: -3.125%;
top: 0;
margin-top: 2.5%;
width: 105%;
height: 150%;
background-color: #fff;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.bnr-box-ctn {
position: relative;
width: 100%;
margin-bottom: 9.375%;
border-bottom: 5px solid #ef0f03;
overflow: hidden;
}
.bnr-img-box {
position: relative;
}
.bnr-img-box:after {
content: "";
display: block;
position: absolute;
left: -3.125%;
top: 0;
width: 105%;
padding-bottom: 7.8125%;
margin-top: -5.3125%;
background-color: #edeff3;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.bnr-img-box img {
width: 100%;
}
.bnr-desc-box {
position: absolute;
right: 0;
left: 0;
bottom: 0;
margin-bottom: 3.125%;
text-align: center;
}
.bnr-desc-box h5 {
display: inline-block;
vertical-align: top;
font-family: 'TrueBold';
font-size: 22px;
font-size: 6.875vw;
line-height: 1em;
color: #000;
margin-bottom: 0.9375%;
}
.bnr-desc-box .btn-inline .img-btn {
width: 28.125%;
margin-left: 1.5625%;
}
.bnr-desc-box .btn-inline .img-btn:first-child {
margin-left: 0;
}
.box-main-2 .fourg-text, .box-main-2 .family-text {
position: absolute;
left: 3.125%;
}
.box-main-2 .fourg-text {
bottom: 0;
margin-bottom: 24.0625%;
}
.box-main-2 .family-text {
top: 0;
margin-top: 7.8125%;
}
.box-content-3 {
margin-top: -14.6875%;
padding-bottom: 10%;
z-index: 3;
}
.box-content-4 {
margin-top: -14.375%;
margin-bottom: 14.375%;
z-index: 3;
}
.box-ctn-rotate {
position: relative;
outline: 1px solid transparent;
z-index: 1;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-ctn-inner:before, .box-ctn-inner:after {
content: "";
display: block;
position: absolute;
padding-bottom: 9.375%;
width: 100%;
z-index: 6;
background-color: #edeff3;
outline: 1px solid transparent;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-ctn-inner:before {
left: -0.625%;
top: 0;
margin-top: -6.5625%;
}
.box-ctn-inner:after {
right: -0.625%;
bottom: 0;
margin-bottom: -6.875%;
}
.box-ctn-inner {
position: relative;
overflow: hidden;
outline: 1px solid transparent;
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
.box-ctn-inner, .slide-box-med, .slide-med-size img {
border-radius: 0 60px 0 60px;
border-radius: 0 18.75vw 0 18.75vw;
}
.box-content-4:first-child {
margin-top: 0;
}
.box-content-4:first-child .box-ctn-inner, .box-content-4:first-child .slide-box-med {
border-top-right-radius: 0;
}
.box-content-4:first-child:before, .box-content-4:first-child .box-ctn-inner:before {
display: none;
}
.box-ctn-rotate.-fixcurve .slide-med-size img {
border-radius: 0;
}
.box-ctn-rotate.-fixcurve .box-ctn-inner,
.box-ctn-rotate.-fixcurve .slide-box-med,
.box-ctn-rotate.-fixcurve .slide-med-size,
.box-ctn-rotate.-fixcurve .owl-item.active .img-slider-list-item img {
border-radius: 0 0 0 60px;
border-radius: 0 0 0 18.75vw;
}
.box-ctn-inner > .ar-triangle:first-child {
position: absolute;
top: 0;
left: 50%;
border-width: 10px 11px 0;
z-index: 4;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.slide-med-size .map-box > img {
border-radius: 0;
}
.slide-box-med {
width: 100%;
overflow: hidden;
}
.slide-med-size img {
width: 100%;
}
.slide-desc-box {
position: absolute;
width: 100%;
min-height: 80px;
min-height: 25vw;
left: 0;
bottom: 0;
text-align: right;
z-index: 5;
}
.slide-desc-box:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 120%;
border-bottom-left-radius: 60px;
border-bottom-left-radius: 18.75vw;
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(17,17,17,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(17,17,17,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(17,17,17,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(17,17,17,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(17,17,17,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(17,17,17,1) 100%); /* W3C */
}
.ie8 .slide-desc-box:after {
height: 100%;
background: url(../images/bg/ovl-black.png) repeat 0 0;
}
.slide-desc-box a {
position: relative;
display: block;
padding-top: 10px;
padding-bottom: 10px;
z-index: 5;
}
.ie8 .slide-desc-box a {
padding-top: 12px;
}
.slide-desc-box p {
position: relative;
display: block;
font-family: 'TrueMedium';
color: #FFF;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
font-size: 23px;
font-size: 7.1875vw;
line-height: 20px;
line-height: 6.25vw;
padding-left: 3.125%;
padding-right: 12.5%;
}
.slide-desc-box .arw-white-right {
position: absolute;
top: 50%;
right: 4.6875%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.slide-med-size .owl-dots {
bottom: 25px;
}
.slide-med-size .owl-dot {
margin-left: 10px;
}
.slide-med-size .owl-dot span {
width: 10px;
height: 10px;
}
.splitbox-ctn {
position: relative;
padding: 7.8125% 6.25% 12.5%;
}
.splitbox-right {
margin-top: 8.928571428571429%;
}
.splitbox-right > .acd-box > .acd-head {
cursor: pointer;
}
.splitbox-right > .acd-box > h2, .splitbox-right > .acd-box > h3 {
position: relative;
font-family: 'TrueBold';
font-size: 25px;
font-size: 7.8125vw;
color: #fff;
min-height: 10.9375vw;
line-height: 10.9375vw;
background-color: #fdbb2f;
padding-left: 4.285714285714286%;
}
.sq-arw-box {
position: absolute;
right: 0;
top: 0;
display: block;
width: 12.5%;
height: 100%;
background-color: #fecc63;
}
.sq-arw-box .arw-white-right-icon {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.splitbox-right .arw-white-right-icon {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: rotate(90deg) translateX(-50%) translateY(-50%);
transform: rotate(90deg) translateX(-50%) translateY(-50%);
}
.splitbox-right .acd-box.actived .arw-white-right-icon {
-webkit-transform: rotate(-90deg) translateX(-50%) translateY(-50%);
transform: rotate(-90deg) translateX(-50%) translateY(-50%);
}
.splitbox-right .box-ctn-acd-3 {
padding: 0 3.571428571428571%;
}
.splitbox-right .ctn-acd-header .arw-orange-right, .ctn-acd-header .button-xs {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.splitbox-right .ctn-acd-header .arw-orange-right {
left: 0;
margin-top: 1px;
}
.splitbox-right .ctn-acd-header h3 {
font-size: 25px;
font-size: 7.8125vw;
line-height: 0.72em;
padding-left: 12.73885350318471%;
}
.splitbox-right .box-acd-ctn-inner {
font-size: 20px;
font-size: 6.25vw;
}
.splitbox-right .prg-ctn-2 {
font-size: 22px;
font-size: 6.875vw;
}
.splitbox-right .box-acd-ctn-inner h4 {
font-size: 25px;
font-size: 7.8125vw;
margin-bottom: 4.901960784313725%;
}
.splitbox-right .inline-block-list > li {
margin-bottom: 15px;
margin-bottom: 6.696428571428571vw;
}
.splitbox-right .inline-block-list > li > div:first-child + div {
margin-top: 5px;
}
.splitbox-right .inline-block-list > li > div:first-child > span {
font-size: 24px;
font-size: 7.5vw;
}
.tab-topup .button-flex {
margin: 0 auto;
}
.ctn-acd-header {
position: relative;
border-top: 2px solid #ddd;
line-height: 36px;
min-height: 36px;
line-height: 11.25vw;
min-height: 11.25vw;
padding: 10px 0px 10px;
}
.ctn-acd-header.acd-head {
cursor: pointer;
}
.ctn-acd-header h3, .ctn-tgl-box h4 {
position: relative;
font-family: 'TrueBold';
color: #666;
}
.ctn-acd-header .button-xs {
right: 0;
}
.box-ctn-acd.actived + .box-ctn-acd .ctn-acd-header {
border-top-color: #ddd;
}
.ctn-acd-header.acd-head-style.disabled {
background-color: #ddd;
}
.ctn-acd-header.acd-head-style.disabled .arw-orange-sm-right {
filter: grayscale(1);
-webkit-filter: grayscale(1);
}
.box-ctn-acd-wrap.style-2 .ctn-acd-header.acd-head-style.disabled .txt-title-teb {
color: #fff;
}
.acd-hdr-inner {
width: 60.41666666666667%;
display: inline-block;
line-height: normal;
vertical-align: middle;
}
.box-main-wrap {
position: relative;
}
.single-shadow:after, .double-shadow:before, .double-shadow:after {
content: "";
display: none;
position: absolute;
width: 37.5%;
padding-bottom: 33.75%;
background-image: url(../images/bg/sprite-bg.png);
background-repeat: no-repeat;
background-size: 833.3333333333333% 1860.46511627907%;
}
.single-shadow:after, .double-shadow:after {
left: 0;
bottom: 0;
margin-bottom: -2.1875%;
background-position: 100% 39.49801849405548%;
}
.component-slide > .single-shadow:after, .component-slide > .double-shadow:after {
margin-bottom: 20.9375%;
}
.double-shadow:before {
right: 0;
top: 0;
margin-top: -24.0625%;
background-position: 100% 47.55614266842801%;
}
.box-content-3 .double-shadow:before, .box-content-4 .double-shadow:before {
margin-top: -1.5625%;
}
.cmn-tab-wrap {
position: absolute;
width: 100%;
background-color: rgba(255, 255, 255, 0.9);
z-index: 5;
text-align: center;
}
.cmn-tab-wrap:before {
content: "";
position: absolute;
top: 0;
left: 50%;
display: block;
width: 120%;
height: 100%;
box-shadow: 0 5px 4px rgba(0, 0, 0, 0.3) inset;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.cmn-tab-wrap h3, .cmn-tab-head-2 {
position: relative;
font-family: 'TrueMedium';
font-size: 24px;
font-size: 7.5vw;
padding: 0 3.125% 0;
}
.cmn-tab-wrap h3, .cmn-tab-head-2 > li a {
cursor: pointer;
display: block;
padding-top: 3%;
padding-bottom: 3%;
}
.cmn-tab-wrap .arw-grey-down {
margin-left: 7px;
margin-left: 2.1875vw;
vertical-align: middle;
}
.cmn-tab-wrap.acd-box .cmn-tab-head-2 {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease;
transition: max-height 0.3s ease;
}
.cmn-tab-wrap.acd-box.actived .cmn-tab-head-2 {
max-height: 1000px;
}
/* --- DEVICES BOX SLIDER --- */
.component {
margin: 0 auto;
position: relative;
margin-bottom: 40px;
max-width: 100%;
}
.component-small {
width: 650px;
height: 290px;
}
.component-fullwidth {
width: 100%;
height: 100%;
margin-bottom: 0;
}
.component-transparent {
width: 900px;
height: 500px;
}
.component > ul {
width: 100%;
max-width: 100%;
height: 100%;
position: relative;
list-style: none;
padding: 0;
margin: 0 auto;
}
.component-small > ul {
width: 450px;
}
.component-fullwidth > ul {
overflow: hidden;
}
.component-transparent > ul {
width: 112px;
}
.component > .ctn-slides {
padding-bottom: 88.125%;
}
.component li {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
opacity: 0;
z-index: 10;
}
.component-fullwidth li {
overflow: hidden;
}
.component .current {
opacity: 1;
pointer-events: auto;
z-index: 20;
}
.component li img {
display: block;
width: 100%;
}
/*.component-fullwidth li img {
min-width: 100%;
max-width: none;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}*/
.component nav a {
position: absolute;
width: 70px;
height: 70px;
color: #AAA;
outline: none;
overflow: hidden;
top: 50%;
border-radius: 50%;
z-index: 1005;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.7s;
transition: color 0.7s;
}
.component nav a.clicked,
.component nav a:focus {
outline: none;
color: #FFF;
}
.component nav a.prev {
left: 0px;
}
.component nav a.next {
right: 0px;
}
.component nav a span {
position: absolute;
font-size: 2.5em;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.ctn-slides > .items-slides img, .ctn-slides.owl-carousel {
position: relative;
/*left: 50%;
width: 151.875%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);*/
}
.component > .comp-img-slide {
padding-bottom: 121.875%;
}
/*.img-bg-box .comp-img-slide > li {
border-radius: 0;
}*/
.comp-img-slide .items-slides img {
width: 100%;
}
.cmn-paging, .component-slide .owl-dots {
bottom: 0;
}
.component-slide .owl-prev {
left: 19.75308641975309%;
}
.component-slide .owl-next {
right: 19.75308641975309%;
}
.component-slide .owl-dots {
/*margin-bottom: 4.11522633744856%;*/
margin-bottom: 6.25%;
}
.main-bnr-box .owl-dots {
bottom: 0;
margin-bottom: 3.112033195020747%;
}
.cmn-paging {
position: absolute;
left: 50%;
text-align: center;
margin-bottom: 6.25%;
z-index: 30;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.cmn-paging > span, .component-slide .owl-dot span {
cursor: pointer;
display: inline-block;
width: 8px;
height: 8px;
border: 1px solid #999;
background-color: #FFF;
background-color: rgba(0,0,0,0);
border-radius: 50%;
vertical-align: top;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.cmn-paging > span, .component-slide .owl-dot {
margin-left: 8px;
}
.cmn-paging > span:first-child, .component-slide .owl-dot:first-child {
margin-left: 0;
}
.cmn-paging > .actived, .component-slide .owl-dot.active span {
background-color: #999;
}
.slide-nav-prev, .slide-nav-next, .slide-nav-prev .arw-nav-prev, .slide-nav-next .arw-nav-next {
position: absolute;
top: 50%;
}
.slide-nav-prev, .slide-nav-next {
width: 40px;
height: 40px;
z-index: 4;
margin-top: -30px;
}
.slide-nav-prev {
left: 0;
}
.slide-nav-next {
right: 0;
}
.slide-nav-prev .arw-nav-prev, .slide-nav-next .arw-nav-next {
left: 50%;
margin-left: -11px;
margin-top: -16px;
}
.ie8 .items-slides, .ie9 .items-slides {
display: block;
}
.main-bnr-box {
height: 100%;
overflow: hidden;
}
.box-ctn-mini {
position: relative;
padding-top: 9.375%;
padding-bottom: 15.625%;
margin-top: 3.125%;
}
.box-ctn-mini:after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: #fff;
border-radius: 0 60px 0 60px;
border-radius: 0 18.75vw 0 18.75vw;
z-index: 1;
-webkit-transform: rotate(-5deg) skew(-5deg);
transform: rotate(-5deg) skew(-5deg);
}
.box-ctn-mini > h2, .mini-list-box {
position: relative;
z-index: 4;
}
.box-ctn-mini > h2, .box-ctn-mini .view-btn {
left: 0;
margin-left: 7.8125%;
}
.box-ctn-mini > h2 {
margin-bottom: 6.25%;
}
.box-ctn-mini .view-btn {
margin-bottom: 3.75%;
}
.mini-list-box {
width: 84.375%;
margin: 0 auto;
border-radius: 15px;
}
.mini-list-box > li, .mini-list-box .owl-item > li, .mini-list-box .owl-item > li img {
border-radius: 15px;
}
.mini-list-box > li, .mini-list-box .owl-item > li {
position: relative;
height: 46.875vw;
overflow: hidden;
text-align: center;
}
.mini-list-box > li img {
display: block;
width: 100%;
}
.mini-desc-box {
position: absolute;
width: 100%;
left: 0;
bottom: 0;
background-color: rgba(0,0,0,0.6);
font-family: 'TrueMedium';
font-size: 18px;
font-size: 5.625vw;
text-align: center;
color: #fff;
padding-top: 10px;
padding-bottom: 10px;
padding-top: 3.125vw;
padding-bottom: 3.125vw;
min-height: 30px;
min-height: 9.375vw;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
}
.mini-desc-box p {
display: block;
padding-left: 10px;
padding-right: 10px;
line-height: 0.8888888888888889em;
}
.mini-list-box .owl-stage-outer {
border-radius: 15px;
}
.mini-list-box .owl-next, .mini-list-box .owl-prev, .arw-gray-prev {
width: 10px;
width: 3.125vw;
height: 21px;
height: 6.5625vw;
background-size: 4736.842105263158% 10000%;
}
.mini-list-box .owl-next.disabled, .mini-list-box .owl-prev.disabled {
opacity: 0.3;
}
.mini-list-box .owl-prev {
left: -6.666666666666667%;
}
.mini-list-box .owl-next {
right: -6.666666666666667%;
}
.mini-list-box .owl-prev, .arw-gray-prev {
background-position: 0 9.292929292929293%;
}
.mini-list-box .owl-next {
background-position: 11.69125993189557% 9.292929292929293%;
}
.arw-nav-btn {
position: relative;
width: 40px;
height: 40px;
margin-left: -10px;
margin-left: -3.125vw;
}
.arw-nav-btn .arw-gray-prev {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
/* --- CONTENT --- */
.banner-info {
position: relative;
max-width: 1100px;
margin: 0 auto;
z-index: 1;
}
.banner-info .img-mb, .box-banner-top .img-mb img {
width: 100%;
}
.banner-info.owl-carousel .owl-dots {
bottom: -2px;
right: 46.875%;
text-align: right;
}
.box-banner-top .edge-bg-img {
left: -6.25%;
bottom: 0;
margin-bottom: -1.5625%;
}
.box-banner-top .box-main-2 {
min-height: 100px;
}
.main-content .box-content.box-style:first-child .box-inner, .main-content .cmn-tab-head + .box-content .box-inner {
height: 16.5625vw;
min-height: 16.5625vw;
}
.main-content .box-content.box-style:first-child .box-top, .main-content .box-content.box-style:first-child .box-top-inner,
.main-content .cmn-tab-head + .box-content.box-style .box-top, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner {
border-radius: 0;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
.main-content .box-content.box-style:first-child .box-top, .main-content .box-content.box-style:first-child .box-top-inner,
.main-content .cmn-tab-head + .box-content.box-style .box-top, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner {
top: 0;
height: 100%;
}
.main-content .box-content.box-style:first-child .box-top-inner, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner {
padding-top: 0;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.main-content .box-content.box-style:first-child .box-top-inner h1, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner h1,
.main-content .box-content.box-style:first-child .box-top-inner h2, .main-content .cmn-tab-head + .box-content.box-style .box-top-inner h2 {
margin-top: 0;
}
.box-style .box-top-cmn h2, .box-style .box-top-inner h1, .box-style .box-top-inner h2 {
margin-top: 4px;
margin-top: 1.25vw;
}
.box-top-inner h1 span, .box-top-inner h2 span {
display: block;
font-size: 19px;
font-size: 5.9375vw;
line-height: 0.5em;
margin-top: 5px;
margin-top: 1.5625vw;
}
.box-top-styling {
padding-top: 23px;
min-height: 43px;
padding-top: 7.1875vw;
min-height: 13.4375vw;
}
.box-style .box-top-styling h2 {
margin-top: 2px;
margin-top: 0.625vw;
line-height: 0.5em;
}
/* --- FOOTER --- */
.footer-bar-med, .footer-bar-sm {
text-align: center;
margin: 0 auto;
}
.footer-bar-med {
background-color: #dcdcdc;
padding-bottom: 7px;
}
.footer-bar-med.-style .txt-size-xxl {
font-size: 36px;
}
.truestorecare-icon {
display: inline-block;
vertical-align: baseline;
width: 34px;
margin-right: 3px;
}
.txt-size-l {
font-family: 'TrueBoldSpecial';
font-size: 35px;
line-height: 0.5em;
}
.footer-bar-med.-style .phone-cir-red-icon {
width: 16px;
height: 16px;
}
.footer-bar-sm {
font-family: 'TrueBold';
font-size: 19px;
line-height: 1em;
padding-top: 7px;
padding-bottom: 7px;
background-color: #b2b2b2;
color: #fff;
}
.footer-bar-sm a {
color: #fff;
}
.footer-bar-sm .underline-txt {
margin-left: 3px;
}
.footer-small-text {
font-family: 'TrueMedium';
font-size: 16px;
line-height: 0.85em;
}
.footer-small-text > a {
color: inherit;
}
.footer-bar-med > .footer-small-text {
margin-top: 5px;
padding-left: 15px;
padding-right: 15px;
color: #555;
}
.desktop .mtp-txt-size-box {
cursor: default;
}
.mtp-txt-size-box {
display: block;
color: #666;
padding-top: 12px;
margin-bottom: 6px;
}
.mtp-txt-size-box .phone-cir-red-icon {
margin-left: 5px;
}
.mtp-lines-box {
text-align: left;
}
.mtp-lines-box, .mtp-txt-size-box .txt-size-xxl {
display: inline-block;
vertical-align: baseline;
}
.mtp-txt-size-box .txt-size-xxl {
color: #ee3124;
}
.mtp-lines-box .txt-size-s {
display: block;
}
.txt-size-s {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.9090909090909091em;
}
.txt-size-m {
font-family: 'TrueBold';
font-size: 25px;
line-height: 0.88em;
}
.txt-size-xxl {
font-family: 'TrueBold';
font-size: 54px;
line-height: 0.5em;
}
.footer-list-box > li {
background-color: #f4f4f4;
}
.footer-list-box > li > h4 {
cursor: pointer;
position: relative;
font-family: 'TrueBoldSpecial';
font-size: 26px;
line-height: 0.5em;
color: #6c798c;
padding: 25px 0 25px 45px;
border-bottom: 1px solid #e7e7e7;
background-color: #fff;
}
.footer-list-box > li > h4 .sprite-icons {
position: absolute;
left: 15px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.footer-list-box > li > h4 .pointer-icon {
left: 19px;
}
.footer-list-box > li > h4 .cart-icon {
left: 11px;
}
.footer-list-box > li > h4:after {
content: "";
display: block;
position: absolute;
top: 50%;
right: 18px;
width: 14px;
height: 10px;
background-image: url(../images/icons/sprite-icons@2x.png);
background-repeat: no-repeat;
background-size: 3214.285714285714% 21052.63157894737%;
background-position: 0 11.68048229088169%;
-webkit-transform-origin: 50% 25% 0;
transform-origin: 50% 25% 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.footer-list-box > .acd-box.actived > h4:after {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.footer-list {
position: relative;
padding-top: 20px;
padding-bottom: 20px;
background-color: #f4f4f4;
}
.footer-list > li {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.9090909090909091em;
padding-left: 45px;
padding-right: 15px;
margin-top: 20px;
}
.footer-list > li:first-child {
margin-top: 0;
}
.footer-list > li a {
position: relative;
display: inline-block;
color: #999;
overflow: hidden;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.footer-list > li a:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0px;
width: 100%;
height: 1px;
background-color: #EA1C23;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
.footer-list > li a:hover {
color: #EA1C23;
}
.footer-list > li a:hover:after {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.ft-list-sub {
padding-left: 12px;
}
.ft-list-sub > li a {
padding-left: 12px;
}
.ft-list-sub > li a:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 5px;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px 0px 5px 5px;
border-left-color: #999;
}
.ft-list-sub > li a:hover:before {
border-left-color: #ea1c23;
}
.ft-list-sub > li {
margin-top: 5px;
}
/* --- FOOTER OPTIONS --- */
footer {
position: relative;
overflow: hidden;
}
.feed-box {
position: relative;
margin: 0 auto;
}
.feed-head {
position: relative;
min-height: 56px;
line-height: 56px;
text-align: center;
}
.feed-head h5 {
position: absolute;
top: 50%;
width: 100%;
font-family: 'TrueBold';
font-size: 22px;
font-weight: normal;
line-height: 0.5em;
color: #6C798C;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.ie8 .feed-head h5 {
margin-top: -6px;
}
.feed-head h5 span {
display: block;
cursor: pointer;
font-family: 'TrueBoldSpecial';
line-height: 0.5em;
margin-top: 8px;
}
.tgl-txt-2, .tgl-txt-3, .feed-box.actived .tgl-txt-1, .feed-box.success .tgl-txt-1, .feed-box.success .tgl-txt-2 {
opacity: 0;
visibility: hidden;
}
.feed-box.actived .tgl-txt-2, .feed-box.success .tgl-txt-3 {
opacity: 1;
visibility: visible;
}
.feed-ctn-wrap {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease;
transition: max-height 0.3s ease;
}
.feed-box.actived .feed-ctn-wrap {
max-height: 2000px;
}
.feed-content {
position: relative;
background-color: #eee;
padding: 25px 20px;
}
.feed-content:before {
content: "";
display: block;
position: absolute;
left: 50%;
top: 0;
border-style: solid;
border-color: transparent;
border-width: 10px 10px 0px 10px;
border-top-color: #fff;
margin-left: -10px;
}
.feed-list-box > li {
float: left;
width: 100%;
text-align: center;
}
.feed-list-box > li h6 {
font-family: 'TrueBoldSpecial';
font-size: 22px;
font-weight: normal;
color: #6C798C;
}
.rate-box {
margin-top: 15px;
}
.feed-desc-list > li {
position: relative;
font-family: 'TrueBold';
font-size: 20px;
line-height: 0.8em;
color: #999;
margin-top: 20px;
}
.feed-desc-list > li:first-child {
margin-top: 0;
}
.feed-contact {
margin-top: 25px;
}
.feed-contact .cmn-txtarea {
width: 100%;
font-size: 20px;
min-height: 90px;
padding: 10px 16px;
}
.feed-contact .btn-float {
float: none;
text-align: center;
}
.star-box {
text-align: center;
margin-top: 7px;
}
.star-box .star-icon {
display: inline-block;
cursor: pointer;
vertical-align: top;
}
.desktop .star-box .star-icon:hover, .star-box .star-icon.actived, .star-box .star-icon.hover {
background-position: 0 2.025316455696203%;
}
.ie8.desktop .star-box .star-icon:hover, .ie8 .star-box .star-icon.actived, .ie8 .star-box .star-icon.hover {
background-position: -106px -558px;
}
.ft-hpl-txt {
position: absolute;
left: 15px;
bottom: 9px;
display: inline-block;
font-family: 'TrueMedium';
font-size: 20px;
line-height: 1em;
vertical-align: middle;
text-decoration: underline;
z-index: 10;
}
/* --- FOOTER BOTTOM --- */
.footer-btm-box {
position: relative;
width: 100%;
background-color: #555;
margin: 0 auto;
overflow: hidden;
}
.footer-btm {
position: relative;
max-width: 1100px;
height: 100%;
margin: 0 auto;
}
.footer-btm:after {
content: "";
display: block;
position: absolute;
right: -898px;
top: 0;
width: 100%;
height: 100%;
background-color: #999;
}
.footer-btm > span {
font-family: 'TrueBold';
font-size: 18px;
line-height: 0.8888888888888889em;
color: #fff;
}
.footer-btm .true-logo {
position: relative;
left: 15px;
margin-top: 12px;
margin-bottom: 12px;
}
.footer-styling {
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
}
.footer-styling .footer-btm:after {
display: none;
}
.footer-styling .copyright {
display: inline;
}
.footer-styling .ft-hpl-txt {
position: relative;
bottom: 0;
left: 0;
vertical-align: top;
}
.social-box {
position: relative;
width: 100%;
height: 100%;
background-color: #999;
text-align: right;
z-index: 6;
}
.social-box > li {
display: inline-block;
vertical-align: top;
width: 25px;
height: 25px;
margin-left: 2px;
margin-top: 6px;
margin-bottom: 6px;
}
.social-box > li:first-child {
margin-left: 0;
}
.social-box > li:last-child {
margin-right: 15px;
}
.social-box > li a {
display: block;
vertical-align: middle;
line-height: normal;
}
.ie8 .footer-list > li a:after {
left: -100%;
}
.ie8 .footer-list > li a:hover:after {
left: 0;
}
.slick-dots, .fix-wrap-slider-3 .owl-dots {
text-align: center;
height: 10px;
}
.slick-dots > li, .inline-icon > li, .fix-wrap-slider-3 .owl-dot {
cursor: pointer;
vertical-align: top;
margin-left: 10px;
}
.slick-dots > li:first-child, .inline-icon > li:first-child, .fix-wrap-slider-3 .owl-dot:first-child {
margin-left: 0;
}
.slick-dots button, .fix-wrap-slider-3 .owl-dot span {
width: 8px;
height: 8px;
}
.slick-dots button, .fix-wrap-slider-3 .owl-dot span, .common-nav .owl-dot span {
cursor: pointer;
background-color: #aaa;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.slick-dots button {
display: block;
border-radius: 50%;
color: rgba(255,255,255,0);
padding: 0;
margin: 0;
outline: none;
border: none;
-webkit-appearance: none;
}
.slick-active > button, .fix-wrap-slider-3 .owl-dot.active span, .common-nav .owl-dot.active span {
background-color: #f03025;
}
.common-nav .owl-prev {
left: -30px;
}
.common-nav .owl-next {
right: -30px;
}
.common-nav .owl-dot span {
width: 8px;
height: 8px;
}
.common-nav .owl-dots {
position: relative;
bottom: auto;
top: auto;
margin-top: 15px;
height: 8px;
}
.inline-icon {
margin-top: 20px;
}
.box-img-styling .ar-triangle {
top: 0;
bottom: auto;
border-width: 10px 11px 0;
z-index: 4;
-webkit-transform: translateX(-50%) translateY(0);
transform: translateX(-50%) translateY(0);
}
.icon-nav {
position: absolute;
left: 0;
top: 0;
overflow: hidden;
z-index: 4;
}
.icon-nav > li {
cursor: pointer;
position: relative;
width: 58px;
height: 35px;
margin-top: 12px;
width: 18.125vw;
height: 10.9375vw;
margin-top: 3.75vw;
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0 5px 5px 0;
-webkit-transform: translateX(-5.9375vw);
transform: translateX(-5.9375vw);
-webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
transition: background-color 0.3s ease, transform 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
.icon-nav > .green-block:first-child, .icon-nav > .red-block:first-child {
margin-top: 40px;
margin-top: 12.5vw;
}
.icon-nav > .number-one + li {
margin-top: 20px;
margin-top: 6.25vw;
}
.icon-nav > .number-one {
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
.icon-nav > .number-one, .tag-box-2 {
width: 72px;
height: 53px;
width: 22.5vw;
height: 16.5625vw;
background-color: #d01720;
}
.icon-nav > li .sprite-icons, .tag-box-2 .number-one-icon, .tag-box-2 .number-one-th-icon {
position: absolute;
top: 50%;
left: 66%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.icon-nav > li .number-one-icon, .icon-nav > li .number-one-th-icon,
.tag-box-2 .number-one-icon, .tag-box-2 .number-one-th-icon {
left: 50%;
}
.red-block.actived {
background-color: #d01720;
}
.icon-nav > .actived {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.icon-nav > .musics.actived, .green-block.actived {
background-color: #4db3b3;
}
.icon-nav > .musics.actived .sprite-icons {
background-position: 65.66985645933014% 35.52162849872774%;
}
.ie8 .icon-nav > .musics.actived .sprite-icons {
background-position: 0 -4160px;
}
.icon-nav > .movies.actived, .orange-block.actived {
background-color: #f06d21;
}
.icon-nav > .movies.actived .sprite-icons {
background-position: 76.04790419161677% 35.56687898089172%;
}
.ie8 .icon-nav > .movies.actived .sprite-icons {
background-position: -45px -4160px;
}
.icon-nav > .games.actived, .yellow-block.actived {
background-color: #fdbb30;
}
.icon-nav > .games.actived .sprite-icons {
background-position: 89.01234567901235% 35.43147208121827%;
}
.ie8 .icon-nav > .games.actived .sprite-icons {
background-position: -90px -4160px;
}
.icon-nav > .thumbsup.actived, .blue-block.actived {
background-color: #0d4d9c;
}
.icon-nav > .thumbsup.actived .sprite-icons {
background-position: 100% 35.50356052899288%;
}
.ie8 .icon-nav > .thumbsup.actived .sprite-icons {
background-position: -149px -4160px;
}
.ie8 .icon-nav > .actived {
background-image: none;
}
.ie8 .icon-nav > li {
background-color: transparent;
background-image: url(../images/bg/white-ovl.png);
}
.ie8 .icon-nav > .number-one {
background-color: #d01720;
background-image: none;
}
.green-block.actived .pins-icon {
background-position: 6.690140845070422% 96.10520991401113%;
}
.ie8 .green-block.actived .pins-icon {
background-position: -57px -4604px;
}
.red-block.actived .wifi-med-icon {
background-position: 19.298245614035086% 95.86276488395559%;
}
.ie8 .red-block.actived .wifi-med-icon {
background-position: -165px -4604px;
}
.blue-block.actived .speed-icon {
background-position: 5.9371362048894065% 97.30002523340903%;
}
.ie8 .blue-block.actived .speed-icon {
background-position: -51px -4660px;
}
.yellow-block.actived .auto-login-icon {
background-position: 31.812865497076025% 95.98383430159132%;
}
.ie8 .yellow-block.actived .auto-login-icon {
background-position: -112px -4660px;
}
.box-ctn-inner-2 {
position: absolute;
left: 0;
right: 0;
top: 0;
margin-top: 45.3125%;
z-index: 1;
}
.box-ctn-inner-2.-style {
position: relative;
margin-top: 0;
padding-top: 20px;
padding-bottom: 10.9375%;
}
.heading-txt-shadow {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 1em;
text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
font-size: 6.875vw;
margin-bottom: 3.125%;
}
.box-ctn-inner-3 {
margin-top: 4.6875%;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
}
.heading-tab {
position: relative;
padding-top: 3.75%;
padding-left: 4.6875%;
padding-right: 4.6875%;
}
.heading-tab > h3 {
font-family: 'TrueBold';
font-size: 23px;
font-size: 7.1875vw;
margin-bottom: 3.125%;
}
.abs-txt-title {
display: inline-block;
vertical-align: middle;
}
.abs-txt-title {
position: absolute;
width: 55.17241379310345%;
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
min-height: 24px;
min-height: 7.5vw;
line-height: 0.8333333333333333em;
color: #808080;
bottom: 5px;
}
.tab-inner {
float: right;
}
.tab-inner > li {
cursor: pointer;
width: 60px;
height: 30px;
margin-left: 3px;
width: 18.75vw;
height: 9.375vw;
margin-left: 0.9375vw;
border-radius: 5px 5px 0 0;
border-bottom-width: 4px;
border-style: solid;
}
.tab-inner > li:first-child {
margin-left: 0;
}
.tab-inner > .btm-line-long.red-bg-2 {
border-bottom-color: #d01720;
}
.tab-inner > .btm-line-long.orange-bg-3 {
border-bottom-color: #f2860a;
}
.btm-line-long:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 4px;
-webkit-transition: width 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: width 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.btm-line-long.actived:after {
width: 100%;
}
.btm-line-long.red-bg-2.actived:after {
background-color: #d01720;
}
.btm-line-long.orange-bg-3.actived:after {
background-color: #f2860a;
}
.map-box {
position: relative;
overflow: hidden;
}
#map-canvas {
width: 100%;
height: 250px;
height: 78.125vw;
}
.slide-med-size #map-canvas img {
border-radius: 0;
}
.map-box > img {
position: relative;
left: 50%;
width: 119.375%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.btn-block {
margin-top: 5%;
}
.md-modal .btn-block {
display: inline-block;
vertical-align: top;
}
.dfr-inline .cmn-button {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
vertical-align: top;
margin-top: 10px;
margin-left: 3px;
margin-right: 3px;
}
.dfr-inline button.cmn-button {
display: inline-block;
}
.button-shadow {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.title-txt-box .circle-checked-icon, .title-txt-box .info-yellow-icon {
margin-bottom: 6.25%;
}
.title-txt-box {
font-family: 'TrueBold';
margin: 0 auto;
}
.title-txt-box + .block-wraper {
margin-top: 15px;
}
.title-txt-box > h2 {
font-size: 30px;
font-size: 9.375vw;
line-height: 0.8666666666666667em;
margin-bottom: 5%;
}
.title-txt-box > h3 {
font-size: 19px;
font-size: 5.9375vw;
line-height: 1em;
}
.title-txt-box + .btn-inline {
margin-top: 40px;
}
.title-txt-box .btn-block {
margin-top: 3%;
}
.title-txt-box .dfr-inline .cmn-button {
margin-left: 5px;
margin-right: 5px;
}
.title-txt-small {
display: block;
font-size: 0.8947368421052632em;
line-height: 1em;
margin-top: 8px;
}
.box-4 {
position: relative;
padding: 8.75% 5.625%;
}
.box-4 .multiple-col-box, .box-4 .multiple-col-box:first-child:last-child {
padding-top: 7.042253521126761%;
padding-bottom: 7.042253521126761%;
}
.box-4 .multiple-col-box:first-child {
padding-top: 3.52112676056338%;
padding-bottom: 3.52112676056338%;
}
.box-4 .circle-box-elm {
margin: -5.985915492957746% auto -5.985915492957746%;
}
.box-4 .cmn-txt-label-sm-btm {
margin-top: 10px;
}
.multiple-col-box {
min-height: 73px;
min-height: 22.8125vw;
padding-left: 3.52112676056338%;
padding-right: 3.52112676056338%;
}
.multiple-col-box.acd-head {
cursor: pointer;
}
.multiple-col-box .title-6:first-child {
margin-top: 0;
margin-bottom: 0;
}
.box-4 + .bnr-block-med {
margin-top: -8.75%;
}
.bnr-block-med {
padding-left: 5.625%;
padding-right: 5.625%;
margin: 0 auto;
}
.bnr-block-med img {
width: 100%;
max-width: 630px;
margin: 0 auto;
}
.circle-box-elm, .circ-box {
position: relative;
font-family: 'TrueLight';
line-height: 0.5em;
border-radius: 50%;
}
.circle-box-elm {
width: 32px;
height: 32px;
width: 10vw;
height: 10vw;
border: 6px solid #fafafa;
border: 1.875vw solid #fafafa;
background-color: #686868;
font-family: 'TrueLight';
font-size: 19px;
font-size: 5.9375vw;
color: #fff;
}
.circ-box {
width: 28px;
height: 28px;
width: 8.75vw;
height: 8.75vw;
font-size: 17px;
font-size: 5.3125vw;
margin: 0 auto;
}
.circle-box-elm > span, .circ-box > span {
position: absolute;
display: block;
left: 50%;
top: 48%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.box-5, .cmn-box-ctn-2 {
padding: 6.25% 3.75%;
}
.box-5 {
font-family: 'TrueMedium';
font-size: 18px;
font-size: 5.625vw;
line-height: 1em;
color: #555;
margin: 9.375% auto 0;
}
.box-5-inner {
width: 100%;
display: inline-block;
vertical-align: top;
}
.box-5 .cmn-hpl-txt {
font-family: 'TrueBold';
}
.box-5-inner > div {
position: relative;
padding-left: 36px;
padding-left: 11.25vw;
margin-top: 7.142857142857143%;
}
.box-5-inner > div:first-child {
margin-top: 0;
}
.box-5 .print-icon, .box-5 .bubble-small-icon {
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.box-5 .print-icon {
left: 1.111111111111111%;
margin-top: 1px;
}
.long-box .box-5-inner > div {
padding: 0;
}
.box-5.-fix .box-5-inner > div {
padding-left: 0;
}
.btn-img-block {
position: relative;
text-align: center;
}
.btn-img-block
.box-6 .acd-box {
background-color: #fff;
}
.box-6 .circle-box-elm {
margin: -5.666666666666667% auto -5.666666666666667%;
}
.box-6 .multiple-col-box {
margin-top: 0;
}
.box-6 .title-4 .arw-black-btm {
margin-left: 14px;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.box-6 .acd-box.actived .arw-black-btm {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
.box-6 .inline-row {
width: 90%;
margin: 0 auto;
padding-bottom: 8.333333333333333%;
}
.sim-type-box {
text-align: center;
}
.sim-list {
display: inline-block;
width: 90%;
vertical-align: top;
padding-top: 15px;
padding-bottom: 6.666666666666667%;
}
.sim-list .radiobox, .sim-list .cmn-inline-label, .sim-img {
display: inline-block;
vertical-align: middle;
}
.sim-list > li {
width: 100%;
margin-top: 7.407407407407407%;
text-align: left;
}
.sim-list > li:first-child {
margin-top: 0;
}
.sim-list > li .sim-img {
width: 22.22222222222222%;
}
.sim-list .cmn-inline-label {
width: 64.81481481481481%;
}
.sim-list .std-sim-radio + .cmn-inline-label + .sim-img img {
width: 100%;
}
.sim-list .micro-sim-radio + .cmn-inline-label + .sim-img img {
width: 66.66666666666667%;
}
.sim-list .nano-sim-radio + .cmn-inline-label + .sim-img img {
width: 50%;
}
.sim-img img {
margin: 0 auto;
}
.box-7 {
margin-top: 13.33333333333333%;
}
.box-7 .inline-label {
display: block;
margin-bottom: 3.333333333333333%;
}
.box-7 .sim-list {
width: 100%;
padding: 0;
text-align: center;
}
.box-7 .sim-list .cmn-inline-label {
width: auto;
margin-left: 0;
margin-right: 8px;
text-align: left;
}
.box-7 .sim-list > li {
width: auto;
min-width: 162px;
vertical-align: top;
padding: 3.333333333333333%;
background-color: #fff;
text-align: center;
}
.box-7 .sim-list > li .sim-img {
width: 25.92592592592593%;
}
.box-7 .sim-list > li .sim-img img {
width: 100%;
}
.cmn-box-ctn-2 {
margin: 6.25% auto 0;
}
.cmn-box-ctn-2 > h3 {
margin-bottom: 3.703703703703704%;
}
.cmn-box-ctn-2 .title-10 {
margin-bottom: 0.2272727272727273em;
}
.cmn-box-ctn-2 .title-6 {
margin-top: 0;
}
.cmn-box-ctn-2 .inline-box-inner {
width: 100%;
}
.cmn-box-ctn-2 .cmn-text-1 {
margin-top: 15px;
}
.box-1 {
position: relative;
width: 93.75%;
padding: 8.75% 0;
margin: 0 auto;
}
.box-1 .breadcrumb-box, .box-styling .breadcrumb-box {
margin-bottom: 6.666666666666667%;
}
.box-1 .btn-inline {
margin-top: 40px;
}
.box-1 .dark-gray-txt ~ .btn-inline {
margin-top: 20px;
}
.box-1 .box-5 .btn-inline {
margin-top: 20px;
}
.box-1 .cmn-box-ctn-2 .btn-inline {
margin-top: 30px;
}
.box-1.box-spacing {
padding-top: 3.333333333333333%;
}
.box-1 .hpl-link-box {
margin-top: 25px;
}
/* --- PAGING --- */
.sq-paging {
margin-top: 40px;
}
.sq-paging > *, .pg-no-box > li {
display: inline-block;
vertical-align: middle;
margin-left: 3px;
}
.sq-paging > *:first-child, .pg-no-box > li:first-child {
margin-left: 0;
}
.pg-left-arw, .pg-right-arw {
cursor: pointer;
position: relative;
width: 34px;
height: 34px;
background-color: #F8B72E;
}
.pg-left-arw .arw-white-prev, .pg-right-arw .arw-white-next {
position: absolute;
left: 50%;
top: 50%;
margin-top: -7px;
}
.pg-left-arw.in-actived, .pg-right-arw.in-actived {
cursor: default;
background-color: #f5f5f5;
}
.pg-left-arw .arw-white-prev {
margin-left: -5px;
}
.pg-right-arw .arw-white-next {
margin-left: -4px;
}
.pg-no-box > li, .sq-input {
font-family: 'TrueMedium';
}
.pg-no-box > li {
font-size: 23px;
color: #333;
}
.sq-input {
width: 34px;
height: 34px;
font-size: 23px;
text-align: center;
padding-left: 6px;
padding-right: 6px;
}
.mtp-col-box-5 > div {
position: relative;
float: left;
width: 32%;
margin-left: 3.5%;
}
.mtp-col-box-5 > div:last-child {
width: 29%;
}
.mtp-col-box-5 > div:first-child {
margin-left: 0;
}
.mtp-col-box-5.-two > div {
width: 46.5%;
margin-left: 7%;
}
.mtp-col-box-5 > div:first-child {
margin-left: 0;
}
.abs-txt-box {
position: absolute;
right: 0;
bottom: 100%;
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.5em;
margin-bottom: 10px;
}
.abs-txt-box .tooltip-box {
vertical-align: middle;
}
.box-8 {
margin-top: 10%;
}
.box-8 ~ .inline-elm-3 {
margin-top: 5%;
}
.heading-title, .title-8 {
font-family: 'TrueBold';
}
.title-8 {
font-size: 32px;
font-size: 8vw;
line-height: 1em;
margin-bottom: 3%;
}
.box-8 .heading-title {
background-color: #dadada;
}
.heading-title {
position: relative;
font-size: 22px;
font-size: 6.875vw;
line-height: 1em;
padding: 1.666666666666667% 3.333333333333333%;
}
.heading-title > span {
vertical-align: middle;
}
.heading-title .arw-orange-right {
margin-right: 2.857142857142857%;
}
.heading-title .cmn-title-2.-floating {
position: absolute;
right: 15px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.box-1 .heading-title .hpl-link-box {
margin-top: 0;
display: block;
}
/* --- TAB --- */
.tab-ctn, .acd-ctn-box, .tgl-content {
position: relative;
max-height: 0;
overflow: hidden;
}
.tab-ctn.actived, .acd-box.actived > .acd-ctn-box {
/* max-height: 9900px; */
max-height: none;
}
.tab-ctn.actived {
overflow: visible;
}
.tgl-content.actived {
max-height: 90000px;
overflow: visible;
}
/* --- ACCORDION --- */
.box-ctn-acd {
position: relative;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.box-ctn-acd.actived,
.box-ctn-acd.expanded {
background-color: #f7f7f7;
}
.box-ctn-acd.actived > .ctn-acd-header > .arw-orange-right,
.box-ctn-acd.expanded > .ctn-acd-header > .arw-orange-right {
-webkit-transform-origin: 50% 0 0;
transform-origin: 50% 0 0;
-webkit-transform: rotate(90deg) translateY(-50%);
transform: rotate(90deg) translateY(-50%);
}
.acd-ctn {
position: relative;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
transition: max-height 0.3s cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
.acd-box.actived .acd-ctn {
max-height: 2000px;
}
.ctn-tgl-box {
max-height: 0;
overflow: hidden;
/*-webkit-transition: max-height 0.3s ease;
transition: max-height 0.3s ease;*/
}
.box-ctn-acd.actived .ctn-tgl-box,
.box-ctn-acd.expanded .ctn-tgl-box,
.ctn-tgl-box.actived {
max-height: none;
}
.ctn-box .box-ctn-acd.actived .ctn-tgl-box,
.ctn-box .box-ctn-acd.expanded .ctn-tgl-box,
.ctn-box .ctn-tgl-box.actived {
max-height: none;
overflow: visible;
}
.select-tabs-wrap .ctn-tgl-box {
-webkit-transition: none;
transition: none;
}
/* --- AJAX CONTENT --- */
.box-main {
position: relative;
min-height: 110px;
/*padding-bottom: 10px;*/
z-index: 1;
}
.box-btm {
position: relative;
width: 106.25%;
padding-bottom: 15.625%;
outline: 1px solid transparent;
margin-top: -9.375%;
margin-bottom: 3.75%;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-main-outer {
position: relative;
opacity: 1;
visibility: visible;
z-index: 6;
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.box-main-outer.-nospace, .fix-ajax-ctn-2 .box-main-outer.-nospace,
.fix-ajax-ctn-2 .box-main-outer.-fix {
margin-top: 0;
}
.fix-ajax-ctn-2 .tgl-btm-box {
position: relative;
margin-top: -15.625%;
padding-bottom: 15.625%;
}
.fix-ajax-ctn-2 .ovl-block {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.fix-ajax-ctn-2 .box-main-outer {
margin-top: 13.125%;
}
.tgl-btm-box {
position: absolute;
bottom: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.tgl-btm-box .box-btm {
position: absolute;
left: 0;
bottom: 0;
}
.tgl-btm-box.single-shadow:after {
z-index: -1;
}
.tgl-btm-box.single-shadow:after {
margin-bottom: -1.25%;
}
.ovl-block {
position: relative;
height: 100%;
margin-top: -14.6875%;
}
.ajax-elm-box {
position: relative;
min-height: 120px;
}
.ajax-ctn-outer {
max-height: 9999px;
overflow: hidden;
opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: opacity 0.5s ease, max-height 0.5s ease;
transition: opacity 0.5s ease, max-height 0.5s ease;
}
.ajax-elm-box .spinner-box, .ajax-abs-box .spinner-box, .ajax-abs-box.actived .ajax-ctn-wrapper.show-content ~ .ajax-spinner + .spinner-box,
.ie9 .ajax-elm-box .ajax-spinner, .ie8 .ajax-elm-box .ajax-spinner {
opacity: 0;
filter: alpha(opacity=0);
visibility: hidden;
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.ie9 .ajax-abs-box.actived .ajax-ctn-wrapper.show-content + .ajax-spinner, .ie8 .ajax-abs-box.actived .ajax-ctn-wrapper.show-content + .ajax-spinner {
opacity: 0;
filter: alpha(opacity=0);
visibility: hidden;
}
.ajax-elm-box.actived .ajax-ctn-outer {
max-height: 0;
opacity: 0;
filter: alpha(opacity=0);
}
.ajax-elm-box.actived .spinner-box, .ajax-abs-box.actived .spinner-box, .ie9 .ajax-elm-box.actived .ajax-spinner, .ie8 .ajax-elm-box.actived .ajax-spinner {
opacity: 1;
filter: alpha(opacity=100);
visibility: visible;
}
.fix-ajax-ctn .ajax-ctn-outer, .fix-ajax-ctn.actived .ajax-ctn-outer,
.fix-ajax-ctn-2 .ajax-ctn-outer, .fix-ajax-ctn-2.actived .ajax-ctn-outer {
opacity: 1;
filter: alpha(opacity=100);
}
.fix-ajax-ctn.actived .ajax-ctn-outer {
min-height: 260px;
max-height: 260px;
}
.fix-ajax-ctn.actived .box-main-outer, .fix-ajax-ctn-2.actived .box-main-outer {
opacity: 0;
visibility: hidden;
}
.fix-ajax-ctn-2 {
min-height: 0;
}
.fix-ajax-ctn-2.actived .ajax-ctn-outer {
min-height: 200px;
max-height: 200px;
}
.divide-box-wrap {
margin-top: -16.875%;
}
.ajax-sm-box {
min-height: 10px;
}
.ajax-sm-box .spinner-box {
margin-top: -15px;
}
.ajax-med-box {
min-height: 60px;
}
.ajax-abs-box {
width: 100%;
height: 100%;
}
.ajax-ctn-wrapper {
position: relative;
height: 100%;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.ajax-ctn-wrapper.show-content {
opacity: 1;
filter: alpha(opacity=100);
}
.ie8 .ajax-ctn-wrapper {
display: none;
}
.ie8 .ajax-ctn-wrapper.show-content {
display: block;
}
.box-auto-height .ajax-elm-box .spinner-box {
margin-top: 0;
}
.box-auto-height .ajax-sm-box .spinner-box {
margin-top: -15px;
}
.box-auto-height .ajax-med-box .spinner-box {
margin-top: -38px;
}
#devices-box .ajax-ctn-outer {
max-height: 20000px;
}
/* --- AUTO COMPLETE --- */
.ui-helper-hidden-accessible {
display: none;
}
.ui-autocomplete {
position: absolute;
width: 91.25%;
max-height: 300px;
background-color: #fff;
border: 1px solid #ccc;
overflow: auto;
-webkit-overflow-scrolling: touch;
z-index: 10;
}
.ie8 .ui-autocomplete {
width: 550px;
}
.ui-autocomplete > li {
cursor: pointer;
color: #515151;
display: block;
font-family: Tahoma,Geneva,sans-serif;
font-size: 14px;
line-height: 30px;
min-height: 32px;
padding-left: 10px;
padding-right: 10px;
}
.ui-autocomplete > .ui-menu-item:hover, .ui-autocomplete > .ui-state-focus {
background-color: #eee;
}
.ui-autocomplete > .ui-autocomplete-category {
background-color: #616161;
color: #fff;
font-weight: bold;
}
/* --- TOGGLE BUTTON --- */
.tgl-button .cmn-button {
margin: 0;
}
.tgl-button .def-button, .tgl-button.actived .disabled-button {
display: none;
}
.tgl-button.actived .def-button {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
.ie8 .tgl-button.actived .def-button {
display: inline-block;
}
/* --- PRINT --- */
.cmn-title, .cmn-title-2 {
font-family: 'TrueMedium';
font-size: 34px;
line-height: 0.8333333333333333em;
}
.cmn-title-sm {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.85em;
}
.cmn-title {
color: #444;
}
.cmn-title-2 {
color: #444;
}
.cmn-title.-black {
color: #000;
}
.box-main-ctn-2 {
position: relative;
width: 960px;
margin: 0 auto;
padding-top: 50px;
}
.box-main-ctn-2 .true-logo {
position: absolute;
right: 0;
top: 0;
width: 100px;
height: 36px;
}
.box-main-ctn-2 > h3 {
text-align: center;
margin-bottom: 50px;
}
.txt-list-clmn {
margin-top: 46px;
}
.txt-list-clmn:first-child {
margin-top: 0;
}
.txt-list-clmn > div {
position: relative;
float: left;
width: auto;
margin-left: 30px;
}
.list-two-clmn > div:first-child {
width: 420px;
}
.abs-semi {
position: absolute;
top: 0;
right: -18px;
}
.flex-list-box {
padding-top: 4%;
padding-bottom: 4%;
}
.flex-two-clmn {
margin-top: 5%;
}
.flex-two-clmn > div {
width: 70%;
margin-left: 5%;
text-align: left;
}
.flex-two-clmn > div:first-child {
width: 25%;
text-align: right;
margin-left: 0;
}
.flex-two-clmn .cmn-title, .flex-two-clmn .cmn-title-2,
.flex-two-clmn .cmn-title-sm {
font-size: 18px;
font-size: 5.625vw;
line-height: 0.8888888888888889em;
}
.flex-two-clmn .cmn-title.-bold {
font-family: 'TrueBold';
}
.flex-two-clmn .cmn-title-2 {
padding-right: 10px;
}
.flex-two-clmn .sm-txt-size {
font-size: 16px;
font-size: 5vw;
line-height: 1em;
}
.flex-two-clmn .abs-semi {
right: -6.666666666666667%;
}
.flex-two-clmn.-fix, .flex-two-clmn.-full {
margin-left: 10px;
margin-right: 10px;
}
.flex-two-clmn.-fix {
margin-top: 3%;
}
.flex-two-clmn.-fix .cmn-title-2 {
padding-right: 0;
}
.flex-two-clmn.-underline {
padding-bottom: 3%;
border-bottom: 1px solid #ccc;
}
.flex-two-clmn.-fix > div {
width: 40%;
text-align: right;
}
.flex-two-clmn.-fix > div:first-child {
width: 55%;
text-align: left;
}
.flex-two-clmn.-full {
margin-top: 2px;
}
.flex-two-clmn.-full > div,
.flex-two-clmn.-full > div:first-child {
width: 100%;
margin-left: 0;
text-align: left;
}
.img-zoom {
position: relative;
display: block;
}
.overlay-box {
position: absolute;
right: 10px;
top: 10px;
background-color: #000;
background-color: rgba(0,0,0,0.7);
font-family: 'TrueBold';
font-size: 17px;
line-height: 1em;
color: #fff;
padding: 6px 10px;
border-radius: 4px;
}
/* --- Dropdown --- */
.dd-box {
position: relative;
}
.dd-box + .btm-area-box {
margin-top: 12px;
padding-bottom: 12px;
border-bottom: 2px solid #e2e2e2;
}
.dd-list {
cursor: pointer;
position: relative;
width: 256px;
height: 26px;
line-height: 26px;
border: 2px solid #CCC;
border-radius: 6px;
background-color: #FFF;
padding-left: 10px;
padding-right: 10px;
}
.dd-list > span {
float: right;
padding-right: 12px;
}
.dd-list > span:first-child {
float: left;
margin-right: 0px;
}
.dd-list > .triang-elm {
position: absolute;
right: 6px;
top: 50%;
margin-top: -4px;
}
.lg-txt, .md-txt {
font-family: 'TrueBold';
}
.lg-txt {
font-size: 25px;
color: #333;
}
.md-txt {
font-size: 22px;
color: #747474;
}
.sm-txt {
font-family: Tahoma, Geneva, sans-serif;
font-size: 12px;
color: #747474;
}
.dd-content-wrap {
position: absolute;
left: 0;
top: 100%;
width: 100%;
max-height: 0;
overflow: hidden;
margin-top: -5px;
z-index: 20;
-webkit-transition: max-height 0.4s ease;
transition: max-height 0.4s ease;
}
.dd-content-inner {
position: relative;
background-color: #FFF;
border: 2px solid #CCC;
border-top: none;
border-radius: 0 0 6px 6px;
}
.dd-head {
cursor: pointer;
padding-left: 10px;
padding-right: 10px;
}
.dd-head > span {
float: right;
}
.dd-head > span:first-child {
float: left;
}
.dd-content {
padding-top: 5px;
padding-bottom: 5px;
}
.dd-content:first-child {
padding-top: 10px;
}
.dd-acd-content {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.4s ease;
transition: max-height 0.4s ease;
}
.dd-content-list {
position: relative;
padding-top: 3px;
}
.dd-content-list > li {
cursor: pointer;
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
color: #747474;
min-height: 26px;
line-height: 26px;
padding-left: 25px;
padding-right: 10px;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.dd-content-list > li:first-child {
margin-top: 0px;
}
.dd-content-list > li:hover {
background-color: #EEE;
}
.dd-content.actived .dd-acd-content, .dd-box.actived .dd-content-wrap {
max-height: 1000px;
}
.dd-content.actived {
padding-bottom: 0px;
}
.dd-content:last-child.actived {
padding-bottom: 5px;
}
/* --- Mari --- */
.md-mari-size {
width: 300px;
}
.md-modal.md-mari-size.md-show {
max-height: 96%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.pop-top {
background-color: #fafafa;
border-radius: 8px 8px 0 0;
min-height: 108px;
position: relative;
}
.amount-txt {
color: #5a5a5a;
font-family: "TrueMedium";
font-size: 32px;
}
.amount-txt span {
color: #858585;
font-size: 18px;
}
.button {
cursor: pointer;
display: inline-block;
min-width: 40px;
height: 26px;
line-height: 26px;
border: none;
-webkit-appearance: none;
padding-left: 10px;
padding-right: 10px;
font-family: 'TrueMedium';
font-size: 22px;
color: #fff;
text-align: center;
border-radius: 5px;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.yellow-btn {
background-color: #F8C250;
}
.yellow-btn:hover, .yellow-btn:active {
background-color: #F5AE13;
}
.disable-btn {
cursor: default;
background-color: #F9E4B6;
}
.top-area-ctn-2 .mtp-box-2 {
text-align: center;
}
.top-area-ctn-2 .mtp-box-2 > div, .top-area-ctn-2 .mtp-box-2 > div:first-child {
float: none;
width: auto;
display: inline-block;
vertical-align: top;
}
.btm-area-box {
position: relative;
width: 246px;
margin-top: 8px;
margin-left: auto;
margin-right: auto;
}
.btm-area-box .button {
position: absolute;
right: 0;
top: -3px;
}
.pop-top-content {
position: relative;
padding-top: 10px;
}
.pop-top-content > li:first-child {
width: 280px;
margin: 0 auto;
}
.pop-slide-ctn .tmed-sm-size {
font-size: 18px;
position: relative;
top: -2px;
}
.first-col-box .top-area-box > div {
width: 50%;
float: left;
}
.top-area-box:after {
content: ".";
display: block;
clear: both;
height: 0;
line-height: 0;
visibility: hidden;
}
.top-area-box > div:first-child + div {
text-align: right;
}
.mini-box-slide {
width: 246px;
margin: 0 auto;
margin-top: 2px;
padding-bottom: 10px;
}
.mini-box-slide:before {
content: "";
display: block;
width: 300px;
height: 10px;
position: absolute;
left: -27px;
bottom: 0px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,969696+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #969696 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#969696)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#969696 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#969696 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#969696 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%,#969696 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#969696',GradientType=0 ); /* IE6-9 */
}
.pop-top-slide .owl-prev, .pop-top-slide .owl-next {
position: absolute;
top: 50%;
width: 12px;
height: 18px;
margin-top: -9px;
}
.pop-top-slide .owl-prev {
left: -16px;
}
.pop-top-slide .owl-next {
right: -16px;
}
.top-area-ctn-2 .sm-txt-desc:first-child {
display: block;
margin-bottom: 5px;
position: relative;
top: 3px;
}
.xs-txt-desc {
font-family: Tahoma,Geneva,sans-serif;
font-size: 11px;
line-height: 16px;
}
.sm-txt-desc {
font-family: "TrueBold";
font-size: 19px;
}
.btm-area-box-2 {
text-align: center;
}
.xs-txt-desc > * {
display: inline-block;
vertical-align: top;
}
.xs-txt-desc div {
text-align: left;
}
.xs-txt-desc div:first-child span {
margin-left: 1px;
}
.xs-txt-desc span {
text-align: left;
}
.xs-txt-desc span br {
display: none;
}
.xs-txt-desc:after {
content: ".";
display: block;
clear: both;
height: 0;
line-height: 0;
visibility: hidden;
}
.xs-link {
font-family: Tahoma,Geneva,sans-serif;
font-size: 11px;
line-height: 12px;
display: inline-block;
}
.hpl-orange-txt {
color: #f5911d;
}
.cmn-hpl-txt, .hpl-red-txt, .hpl-orange-txt {
text-decoration: underline;
}
.xs-link .pipe-sm {
height: 15px;
}
.pipe-sm {
background-color: #555;
display: inline-block;
height: 22px;
line-height: 0.5em;
margin-left: 6px;
margin-right: 6px;
vertical-align: middle;
width: 1px;
}
.med-txt-highlight {
font-family: "TrueBold";
font-size: 23px;
}
.top-area-ctn {
margin-bottom: 4px;
margin-top: 4px;
}
.top-area-ctn > .med-txt-highlight {
margin-top: 2px;
}
.top-area-ctn > .sm-txt-desc, .top-area-ctn > .med-txt-highlight {
display: block;
}
.btm-area-box .bar-chart-box {
margin-left: 12px;
position: relative;
top: 2px;
}
.bar-chart-box .bar-chart, .bar-chart-box .bar-info {
float: left;
}
.bar-chart {
background-color: #d3d3d3;
border-radius: 3px;
height: 16px;
position: relative;
width: 104px;
}
.chart-size {
background-color: #ee3d31;
border-radius: 3px 0 0 3px;
height: 100%;
left: 0;
position: absolute;
top: 0;
}
.chart-info {
height: 100%;
position: absolute;
right: 0;
width: 100%;
}
.chart-info span {
display: block;
line-height: 16px;
padding-right: 5px;
text-align: right;
}
.tbold-mini-size {
font-size: 16px;
}
.bar-chart-box .bar-chart, .bar-chart-box .bar-info {
float: left;
}
.bar-info {
height: 16px;
margin-left: 4px;
}
.first-col-box .top-area-box {
margin-top: 14px;
}
.last-col-box .top-area-box {
margin-top: 6px;
}
.last-col-box .btm-area-box {
margin-top: 20px;
}
.last-col-box .bar-info .tbold-mini-size {
position: relative;
top: -4px;
}
.pop-mini {
position: relative;
left: 10px;
top: 10px;
width: 160px;
min-height: 60px;
background-color: #EB232A;
border-radius: 8px;
z-index: 5;
padding: 10px;
-webkit-box-shadow: -1px 1px 2px #666;
box-shadow: -1px 1px 2px #666;
}
.pop-mini:after {
content: "";
display: block;
position: absolute;
right: -24px;
top: 50%;
width: 30px;
height: 32px;
background: url(../images/icons/sprite-icons.png) no-repeat -113px -1238px;
margin-top: -18px;
}
.pop-mini .user-txt {
margin-bottom: 2px;
}
.pop-mini .msg-txt {
margin-bottom: 0px;
}
.user-txt, .msg-txt {
color: #fff;
}
.user-txt {
font-family: 'TrueBold';
font-size: 26px;
margin-bottom: 2px;
}
.msg-txt {
font-family: Tahoma, Geneva, sans-serif;
font-size: 11px;
line-height: 14px;
margin-bottom: 5px;
}
.mari-pop .mari-elm {
position: absolute;
right: 0;
top: -14px;
width: 120px;
height: 120px;
z-index: 6;
background-size: 115.83333333333334% 625%;
background-position: 0 64.36507936507937%;
}
.mari-pop {
position: relative;
height: 106px;
}
.pop-shadow:after {
display: block;
height: 100%;
position: absolute;
bottom: 0px;
}
.pop-shadow:after {
content: "";
width: 100%;
height: 10px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,969696+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #969696 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#969696)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#969696 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#969696 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#969696 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%,#969696 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#969696',GradientType=0 ); /* IE6-9 */
}
.pop-btm {
width: 100%;
background: url(../images/bg/sprite-bg.png) no-repeat 0 0;
border-radius: 0px 0px 8px 8px;
padding-bottom: 30px;
}
.pop-btm-inner .owl-stage {
padding-top: 26px;
}
.box-list-elm {
width: 200px;
margin: 0 auto;
}
.box-list-elm > li {
position: relative;
float: left;
margin-left: 40px;
}
.box-list-elm > li:first-child {
margin-left: 0px;
}
.box-list-elm .hp-link {
display: inline-block;
margin-top: 3px;
}
.card-box {
border: 1px solid #c4c4c4;
border-radius: 10px;
background-color: #fff;
}
.card-box .remark-box {
padding-top: 8px;
margin-bottom: 9px;
}
.card-back {
position: absolute;
left: 0;
top: 0;
}
.card-box .select-menu {
width: 186px;
margin: 10px auto 0px;
}
.card-box .btn-inline {
margin-top: 12px;
}
.card-slide .owl-prev {
left: -32px;
}
.card-slide .owl-next {
right: -32px;
}
.card-slide .owl-stage-outer {
padding-left: 14px;
margin-left: -14px;
}
.pop-close:before {
background: url(../images/icons/sprite-icons.png) no-repeat -196px -1237px;
content: "";
display: block;
height: 45px;
left: -5px;
position: absolute;
top: 0;
width: 45px;
}
.pop-close {
background-color: #eb232a;
border-radius: 0 0 8px;
bottom: 0;
cursor: pointer;
height: 40px;
position: absolute;
right: 0;
width: 40px;
z-index: 20;
}
.pop-close .x-gray {
background-image: url(../images/icons/sprite-icons.png);
bottom: 6px;
position: absolute;
right: 7px;
}
.head-list {
height: 40px;
line-height: 38px;
text-align: center;
border-radius: 8px 8px 0px 0px;
}
.head-list h1 {
display: inline-block;
vertical-align: middle;
line-height: normal;
font-family: 'TrueBold';
font-size: 25px;
color: #3D3D3D;
}
.pics-list img {
display: block;
width: 100%;
}
.desc-list {
position: relative;
text-align: center;
height: 84px;
font-family: 'TrueBold';
}
.desc-list h2 {
display: inline-block;
min-width: 130px;
vertical-align: top;
background-color: #444;
font-size: 19px;
color: #FFF;
padding-left: 10px;
padding-right: 10px;
border-radius: 0px 0px 8px 8px;
}
.desc-list h2 + p {
top: 0;
margin-top: 12px;
-webkit-transform: none;
transform: none;
}
.desc-list p {
position: relative;
top: 50%;
font-size: 19px;
line-height: 18px;
padding-left: 5px;
padding-right: 5px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.ie8 .desc-list h2 + p {
padding-top: 0px;
}
.ie8 .desc-list p {
top: 0px;
padding-top: 22px;
}
.btm-list {
cursor: pointer;
font-family: 'TrueBoldSpecial';
font-size: 22px;
text-align: center;
height: 38px;
line-height: 38px;
background-color: #F5F5F5;
border-radius: 0px 0px 10px 10px;
}
/* --- HIGHLIGHT BOX --- */
.hl-box .card-box {
box-shadow: -8px 5px 3px rgba(0, 0, 0, 0.4);
border: none;
}
.hl-box .head-list {
background: #080808; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA4MDgwOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwODA4MDgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left, #080808 0%, #4d4d4d 50%, #080808 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#080808), color-stop(50%,#4d4d4d), color-stop(100%,#080808)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #080808 0%,#4d4d4d 50%,#080808 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #080808 0%,#4d4d4d 50%,#080808 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, #080808 0%,#4d4d4d 50%,#080808 100%); /* IE10+ */
background: linear-gradient(to right, #080808 0%,#4d4d4d 50%,#080808 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080808', endColorstr='#080808',GradientType=1 ); /* IE6-8 */
}
.hl-box .head-list h1 {
color: #FFF;
}
.hl-box .btm-list {
color: #FFF;
background-color: #EC2A31;
border-radius: 0px 0px 8px 8px;
}
/* --- CARD FLIP --- */
.flip-container, .flipper {
-webkit-transform: perspective(1000px);
transform: perspective(1000px);
/* -webkit-transform-style: preserve-3d;
transform-style: preserve-3d; */
}
.flipper {
position: relative;
-webkit-transition: all 0.6s ease 0s;
transition: all 0.6s ease 0s;
}
.flip-front, .flip-back {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: all 0.6s ease 0s;
transition: all 0.6s ease 0s;
}
.flip-front {
z-index: 2;
}
.flip-back {
-webkit-transform: rotateY(-180deg);
transform: rotateY(-180deg);
}
.ie9 .flip-back, .ie8 .flip-back {
display: none;
}
.flip-container.actived .flip-back {
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
.flip-container.actived .flip-front {
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.ie9 .flip-container.actived .flip-back, .ie8 .flip-container.actived .flip-back {
display: block;
}
.ie9 .flip-container.actived .flip-front, .ie8 .flip-container.actived .flip-front {
visibility: hidden;
}
/* --- MARI POPUP-2 --- */
.md-mari-pop, .md-mari-pop-2 {
width: 300px;
}
.ie8 .md-mari-pop {
margin-left: -432px;
margin-top: -180px;
}
.mari-pop-2, .pop-header {
position: relative;
background-image: url(../images/bg/sprite-bg.png);
background-repeat: no-repeat;
}
.mari-pop-2 {
height: 360px;
background-position: -564px -380px;
box-shadow: 0px 3px 5px rgba(0,0,0,0.7);
border-radius: 10px;
}
.pop-header {
height: 140px;
background-size: 312.5% 769.2307692307693%;
background-position: 100% 87.06896551724138%;
border-radius: 10px 10px 0 0;
}
.pop-header .mari-half {
top: -41px;
}
.pop-ctn {
position: relative;
background-color: #fff;
padding: 10px 0;
overflow: hidden;
border-radius: 0 0 10px 10px;
}
.abs-txt-1 {
position: absolute;
left: 10px;
right: 10px;
bottom: 10px;
font-family: 'TrueBold';
font-size: 20px;
line-height: 0.9em;
text-align: center;
}
.abs-txt-1 p {
display: block;
}
.cmn-bubble {
position: absolute;
top: 13px;
right: 28px;
width: 170px;
min-height: 80px;
background-color: #fff;
border-radius: 7px;
box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
z-index: 10;
}
.cmn-bubble:before {
content: "";
display: block;
position: absolute;
left: -10px;
top: 50%;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 10px 10px 10px 0;
border-right-color: #fff;
margin-top: -10px;
}
.bubble-txt-2 {
font-family: 'TrueMedium';
font-size: 20px;
text-align: center;
padding: 12px 8px 8px;
}
.bubble-txt-2 strong {
font-size: 22px;
font-family: 'TrueBold';
font-weight: normal;
margin-bottom: 0.1363636363636364em;
}
.bubble-txt-2 p {
line-height: 0.8em;
}
.mari-half {
position: absolute;
left: -15px;
top: -56px;
width: 170px;
height: 148px;
background-image: url(../images/mari/mari-sprite.png);
background-repeat: no-repeat;
background-size: 100% 619.8347107438017%;
background-position: 0 0;
}
.black-bubble-box {
position: absolute;
right: 48px;
top: 13px;
width: 120px;
height: 54px;
line-height: 48px;
padding-right: 6px;
background: #474646;
border-radius: 8px;
box-shadow: -1px -1px 2px #333333 inset;
}
.black-bubble-box .bubble-tail {
position: absolute;
left: -20px;
top: 16px;
z-index: 1;
}
.black-bubble-box > p {
position: relative;
display: inline-block;
vertical-align: middle;
font-family: 'TrueLight';
font-size: 21px;
line-height: 0.9523809523809524em;
color: #fff;
background: #474646;
margin-left: 5px;
margin-right: 5px;
z-index: 2;
}
.close-btn-icon {
background-image: url(../images/icons/sprite-icons.png);
background-repeat: no-repeat;
background-position: -225px -2933px;
height: 50px;
width: 50px;
}
.btn-link-box {
position: relative;
margin: 0 auto;
width: 266px;
padding-top: 82px;
}
.btn-link-box > li, .btn-link-box > li > a {
width: 122px;
height: 122px;
line-height: 120px;
border-radius: 10px;
}
.btn-link-box > li {
float: left;
border-right: 2px solid #CFD0CF;
border-bottom: 2px solid #CFD0CF;
box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
margin-top: 16px;
overflow: hidden;
background: #fefffe; /* Old browsers */
background: -moz-linear-gradient(top, #fefffe 0%, #e3e3e3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefffe), color-stop(100%,#e3e3e3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #fefffe 0%,#e3e3e3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #fefffe 0%,#e3e3e3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #fefffe 0%,#e3e3e3 100%); /* IE10+ */
background: linear-gradient(to bottom, #fefffe 0%,#e3e3e3 100%); /* W3C */
}
.btn-link-box > li:first-child, .btn-link-box > li:first-child + li {
margin-top: 0;
}
.btn-link-box > li:nth-child(2n) {
margin-left: 16px;
}
.btn-link-box > li > a {
display: block;
}
.btn-link-box > li > a > div {
display: inline-block;
line-height: normal;
vertical-align: middle;
}
.btn-link-box h2, .btn-link-box .red-txt-2 {
position: relative;
font-family: 'TrueBold';
font-size: 23px;
line-height: 0.6956521739130435em;
}
.btn-link-box h3 {
font-family: 'TrueMedium';
font-size: 23px;
line-height: 0.8260869565217391em;
}
.btn-link-box .sec-txt2 {
display: block;
font-family: 'TrueLight';
font-size: 22px;
line-height: 0.6363636363636364em;
}
.btn-link-box .sec-txt3 {
display: block;
font-family: 'TrueLight';
font-size: 17px;
line-height: 0.7647058823529412em;
}
.btn-link-box h2 .font-txt-1 {
font-family: 'TrueLight';
}
.sw-block {
display: block;
}
.sw-block2 {
display: block;
line-height: 12px;
}
.btn-link-box .sprite-icons {
position: relative;
}
.btn-link-box .mb-pack-app-icon {
left: 18px;
top: 6px;
height: 70px;
width: 70px;
}
.btn-link-box .mb-upgrade-icon, .btn-link-box .pack-icon {
width: 74px;
height: 74px;
}
.btn-link-box .mb-upgrade-icon {
left: 17px;
top: 7px;
}
.btn-link-box .pack-icon {
left: 10px;
top: 12px;
}
.btn-link-box .mtu-icon {
left: 9px;
top: 18px;
width: 100px;
height: 67px;
}
.mari-pop-mock {
position: absolute;
left: 50%;
top: -73px;
margin-left: -403px;
}
.icons-btn {
position: absolute;
top: 150px;
width: 183px;
height: 178px;
z-index: 5;
border-radius: 10px;
}
.btn-link-1 {
left: 32px;
}
.btn-link-2 {
left: 238px;
}
.btn-link-3 {
left: 443px;
}
.btn-link-4 {
left: 648px;
}
.abs-menu-box, .abs-menu-box:after {
position: absolute;
border-radius: 10px;
background-color: #FFF;
}
.abs-menu-box {
left: 256px;
top: 50%;
width: 460px;
min-height: 220px;
margin-top: -130px;
padding-top: 20px;
padding-bottom: 20px;
box-shadow: 0px 8px 8px rgba(0,0,0,0.3);
}
.abs-menu-box:before {
content: "";
display: block;
position: absolute;
top: 50%;
left: -12px;
width: 26px;
height: 26px;
background-color: #FFF;
margin-top: -13px;
box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
-webkit-transform: rotate(-34deg) skew(20deg);
transform: rotate(-34deg) skew(20deg);
}
.abs-menu-box:after {
content: "";
display: block;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.abs-menu-box > h3, .group-list-btn {
position: relative;
z-index: 5;
}
.abs-menu-box > h3 {
font-family: 'TrueBold';
font-size: 26px;
margin-bottom: 20px;
}
.group-list-btn > li {
margin-top: 12px;
}
.group-list-btn > li:first-child {
margin-top: 0;
}
.ie8 .abs-menu-box:before {
left: -22px;
top: 50%;
width: 0;
height: 0;
background-color: transparent;
border-color: transparent;
border-style: solid;
border-width: 22px 34px 22px 0px;
border-right-color: #FFF;
margin-top: -22px;
}
/* --- MARI POP-BTM --- */
.abs-btm-box {
position: absolute;
width: 126px;
height: 80px;
right: 0;
bottom: 37px;
}
.mari-btm {
/*position: fixed;
bottom: 37px;*/
position: absolute;
bottom: 0;
right: 0;
width: 120px;
height: 75px;
z-index: 6;
}
.bubble {
cursor: pointer;
position: absolute;
width: auto;
min-width: 70px;
height: 50px;
line-height: 48px;
background-color: #f93e60;
bottom: 49px;
right: 7px;
text-align: center;
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 8px;
padding-left: 15px;
padding-right: 65px;
visibility: hidden;
z-index: 5;
-webkit-transform: scale(0) translateY(-374px);
transform: scale(0) translateY(-374px);
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.bubble-txt {
display: inline-block;
vertical-align: middle;
font-family: 'TrueBold';
font-size: 20px;
letter-spacing: 1px;
color: #fff;
line-height: 0.85em;
}
.bubble-txt span {
display: block;
font-family: 'TrueBold';
font-size: 24px;
line-height: normal;
margin-top: -12px;
letter-spacing: 2px;
}
.bubble.actived {
opacity: 1;
visibility: visible;
-webkit-transform: scale(1) translateY(0px);
transform: scale(1) translateY(0px);
}
.mari-head {
opacity: 0;
position: absolute;
right: -7px;
bottom: -84px;
width: 89px;
height: 74px;
z-index: 21;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.mari-head.actived {
opacity: 1;
-webkit-transform: translateY(-74px);
transform: translateY(-74px);
}
.ie8 .mari-head.actived {
bottom: -10px;
}
.mari-eyes {
display: block;
position: absolute;
top: 0;
left: 0;
width: 89px;
height: 74px;
background-image: url(../images/mari/mari-head.png);
background-repeat: no-repeat;
}
.move-right-eyes {
background-position: 0 0;
}
.move-left-eyes {
background-position: 0 -74px;
}
.mari-box {
position: absolute;
opacity: 0;
width: 410px;
height: 174px;
right: 28px;
bottom: 0;
visibility: hidden;
-webkit-transform: translateY(50%);
transform: translateY(50%);
-webkit-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
}
.ie8 .mari-box {
bottom: -200px;
}
.mari-elm {
position: absolute;
right: -30px;
top: -10px;
z-index: 1;
width: 158px;
height: 184px;
background-image: url(../images/mari/mari-sprite.png);
background-repeat: no-repeat;
background-position: -61px -574px;
}
.mari-action {
position: absolute;
right: 0;
bottom: -30px;
width: 70px;
height: 129px;
color: transparent;
}
.mari-btm.-action2 {
right: 25px;
}
.mari-btm.-action2 .mari-action {
width: 101px;
height: 129px;
right: -30px;
}
.mari-btm.-action2 .bubble {
padding-right: 70px;
}
.mari-action img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.live-chat-block {
position: fixed;
left: 0;
bottom: 0;
width: 100vw;
height: 100vh;
height: 100%;
background-color: #fff;
z-index: 9999;
-webkit-transform: translateY(100%);
transform: translateY(100%);
-webkit-transition: -webkit-transform 0.4s ease, opacity 0.4s ease;
transition: transform 0.4s ease, opacity 0.4s ease;
}
.live-chat-block.actived {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.live-chat-block-header {
position: relative;
text-align: center;
font-family: 'TrueBold';
font-weight: normal;
font-size: 24px;
line-height: 0.85em;
background-color: #eb232a;
color: #fff;
min-height: 40px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.circle-dash-icon {
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: 30px;
line-height: .6;
color: #eb232a;
width: 22px;
height: 22px;
border-radius: 50%;
background-color: #fff;
}
.live-chat-block.-blue .live-chat-block-header {
background-color: #00aeef;
}
.live-chat-block.-blue .circle-dash-icon {
color: #00aeef;
}
.minimize-button {
cursor: pointer;
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 40px;
}
.minimize-button .circle-dash-icon {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.live-chat-frame {
position: absolute;
left: 0;
right: 0;
top: 40px;
bottom: 0;
display: block;
}
.live-chat-frame iframe {
position: relative;
display: block;
width: 100%;
height: 100%;
border: none;
}
.live-chat-frame iframe .css-3d1kk5 {
min-height: 100px !important;
}
.search-box {
position: absolute;
right: 125px;
bottom: 10px;
width: 140px;
min-height: 75px;
background-color: #EB232A;
border-radius: 6px;
padding: 15px 10px 10px 10px;
box-shadow: -2px -2px 6px #555;
}
.bubble-icon-mini {
margin-right: 4px;
width: 22px;
height: 18px;
}
.mini-btn-inline {
text-align: center;
}
.mini-btn-inline > .mini-btn {
margin-left: 0px;
margin-top: 10px;
}
.quote-bg::after {
content: "";
display: block;
position: absolute;
right: -30px;
top: 50%;
z-index: 2;
width: 30px;
height: 22px;
margin-top: 20px;
background: url(../images/icons/sprite-icons.png) no-repeat -57px -1239px;
}
.user-txt, .msg-txt {
color: #fff;
margin-right: 40px;
text-align: left;
}
.user-txt {
font-family: 'TrueBold';
font-size: 26px;
line-height: 0.8461538461538462em;
margin-right: 36px;
}
.msg-txt {
font-family: Tahoma, Geneva, sans-serif;
font-size: 11px;
line-height: 1.5em;
margin-bottom: 5px;
}
.search-input {
position: relative;
}
.search-input .search-icon {
position: absolute;
left: 8px;
top: 50%;
margin-top: -8px;
}
.cmn-search {
width: 150px;
height: 28px;
line-height: 28px;
background-color: #FFF;
border: none;
border-radius: 3px;
-webkit-appearance: none;
outline: none;
padding-left: 32px;
padding-right: 10px;
border: 1px solid #FFF;
-webkit-transition: border-color 0.3s ease;
transition: border-color 0.3s ease;
}
.cmn-search:focus {
border-color: #FF0000;
}
.bubble-btn {
cursor: pointer;
position: relative;
width: 48px;
height: 32px;
background-color: #FFF;
border-radius: 3px;
margin-left: 8px;
z-index: 5;
}
.bubble-red-icon {
position: absolute;
top: 50%;
left: 50%;
margin-top: -10px;
margin-left: -12px;
}
.search-input .bubble-btn, .search-input .cmn-search {
float: left;
}
.mari-noti {
position: absolute;
cursor: pointer;
width: 33px;
height: 33px;
right: 8px;
top: 12px;
z-index: 5;
}
.mari-noti .gift-white-icon {
position: absolute;
left: 4px;
top: -7px;
}
.noti-mini {
position: absolute;
left: 16px;
top: 2px;
width: 18px;
height: 18px;
border-radius: 50%;
background-color: #FFF;
border: 2px solid #EB232A;
}
.noti-txt {
position: absolute;
width: 18px;
height: 18px;
left: 1px;
top: 1px;
display: block;
font-family: Tahoma, Geneva, sans-serif;
font-size: 10px;
line-height: 18px;
color: #eb232a;
text-align: center;
}
_:-ms-input-placeholder, :root .noti-txt {
left: 1px;
top: 2px;
}
.ie9 .noti-txt, .ie8 .noti-txt {
left: 1px;
top: 2px;
}
.mari-btm.actived .mari-box {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.ie8 .mari-btm.actived .mari-box {
bottom: -10px;
}
.mini-btn {
cursor: pointer;
display: inline-block;
min-width: 114px;
height: 30px;
line-height: 26px;
border: none;
outline: none;
border-radius: 5px;
text-align: center;
-webkit-appearance: none;
z-index: 10;
border: 1px solid #FFF;
-webkit-transition: border-color 0.3s ease, background-color 0.3s ease;
transition: border-color 0.3s ease, background-color 0.3s ease;
}
.mini-btn > span {
display: inline-block;
font-family: 'TrueBold';
color: #fff;
font-size: 22px;
vertical-align: middle;
padding-left: 5px;
padding-right: 5px;
}
.mini-btn-inline .mini-btn {
min-width: 135px;
}
.mini-btn-black {
border-color: #333;
background-color: #333;
}
.mini-btn-black:hover {
border-color: #000;
background-color: #000;
}
.mari-btm-style-2 .search-box {
padding-top: 10px;
}
.pop-mini .user-txt, .pop-mini .msg-txt, .mari-btm-style-2 .msg-txt {
margin-right: 0;
}
.anim-elm .mari-large, .anim-elm .abs-menu-box, .anim-elm .abs-menu-box > h3, .anim-elm .group-list-btn li {
opacity: 0;
}
.anim-elm .mari-large, .anim-elm .abs-menu-box {
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
.anim-elm .abs-menu-box > h3, .anim-elm .group-list-btn li {
-webkit-transform: translateY(15px);
transform: translateY(15px);
}
.select-tabs-wrap .detail-content {
padding-top: 3.125%;
/* padding-top: 6.25%; */
}
.select-tabs-group {
position: relative;
width: 93.75%;
height: 40px;
margin: 0 auto;
}
.select-tabs-group .accd-arrow {
position: absolute;
top: 50%;
right: 10px;
width: 18px;
height: 8px;
z-index: 3;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.select-tabs {
position: absolute;
top: 0;
left: 0;
right: 0;
overflow: hidden;
max-height: 0;
padding-top: 38px;
background-color: #fff;
border: 1px solid #ddd;
z-index: 3;
-webkit-transition: max-height 0.2s ease;
transition: max-height 0.2s ease;
}
.slc-tabs-item {
position: relative;
cursor: pointer;
font-family: 'TrueMedium';
font-size: 22px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
padding: 10px 38px 12px 10px;
}
.select-tabs.actived {
max-height: 1000px;
}
.slc-tabs-item.actived {
position: absolute;
left: 0;
right: 0;
top: 0;
}
.tpr-btn {
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.dv-large-img {
display: none;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-style {
cursor: pointer;
position: absolute;
left: 0;
right: 0;
z-index: 1;
}
.abs-bnt-box-1 {
top: 0;
margin-top: 243.4375%;
}
.abs-bnt-box-2 {
top: 0;
margin-top: 340.625%;
}
.abs-bnt-box-3 {
top: 0;
margin-top: 2492.5%;
}
.box-th.abs-bnt-box-3 {
margin-top: 2543.4375%;
}
.abs-bnt-box-4 {
top: 0;
margin-top: 2554.375%;
}
.box-th.abs-bnt-box-4 {
margin-top: 2605%;
}
.abs-bnt-box-1 .abs-btn-style, .abs-bnt-box-4 .abs-btn-style {
float: left;
}
.abs-btn-style {
display: block;
width: 80px;
height: 30px;
width: 25vw;
height: 9.375vw;
/*background-color: blue;
opacity: 0.5;*/
}
.abs-btn-1 {
margin-left: 52px;
margin-left: 16.25vw;
}
.abs-btn-2 {
margin-left: 52px;
margin-left: 18.25vw;
}
.abs-btn-3 {
margin: 0 auto;
}
.abs-bnt-box-4 .abs-btn-1, .abs-bnt-box-4 .abs-btn-2, .abs-bnt-box-4 .abs-btn-3,
.abs-bnt-box-4 .abs-btn-4 {
margin-left: 57px;
margin-left: 17.8125vw;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4 {
margin-top: 178px;
margin-top: 55.625vw;
}
.abs-bnt-box-4 .abs-btn-5 {
margin-top: 150px;
margin-left: 125px;
margin-top: 46.875vw;
margin-left: 39.0625vw;
}
.block-ctn-1 {
margin-top: 25px;
}
.block-ctn-1 .box-ctn-acd-wrap.style-2 {
margin-top: 50px;
}
.block-ctn-1 .box-ctn-acd-wrap.style-2:first-child {
margin-top: 0;
}
.title-text-1 {
font-family: 'TrueBold';
font-size: 23px;
font-size: 7.1875vw;
line-height: 0.8695652173913043em;
/*font-size: 40px;
font-size: 12.5vw;
line-height: 0.85em;*/
}
.title-text-2 {
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.9em;
}
.title-text-2 strong, .prg-txt-1 strong {
font-family: 'TrueBold';
font-weight: normal;
}
.prg-txt-1 {
font-family: 'TrueMedium';
font-size: 20px;
font-size: 6.25vw;
line-height: 0.9em;
}
.prg-txt-1 p {
margin-top: 0.5em;
}
.prg-txt-1 p:first-child {
margin-top: 0;
}
.inline-block-col .prg-txt-1 {
max-width: 80%;
margin: 0 auto;
text-align: left;
}
.inline-block-col .title-text-1 {
margin-top: 0.375em;
margin-bottom: 0.375em;
}
.block-info-2 > .prg-txt-1 {
margin-top: 11.2781954887218%;
}
.block-info-2 .inline-col-wrap {
margin: 20px auto 0;
text-align: center;
}
.inline-col-wrap {
border-radius: 5px;
background-color: #e8e8e8;
padding: 10px 5px;
}
.inline-col-inner {
display: inline-block;
font-family: 'TrueBold';
font-size: 20px;
font-size: 6.25vw;
line-height: 1em;
vertical-align: middle;
border-left: 1px solid #000;
padding-left: 10px;
margin-left: 2px;
}
.inline-col-inner:first-child {
border-left: none;
padding-left: 0;
margin-left: 0;
}
.logo-list-3 {
margin-top: 10px;
}
.logo-list-3.-center {
text-align: center;
}
.logo-list-3 > li {
width: 22%;
display: inline-block;
vertical-align: middle;
margin-left: 5px;
margin-right: 5px;
}
.logo-list-3 > li img {
width: 100%;
}
.tab-head-txt > .tgl-br, .inline-block-col .title-text-1 .tgl-br {
display: none;
}
.block-ctn-1 .heading-tab-2 {
padding-left: 0;
padding-right: 0;
}
.abs-txt-anchor {
cursor: pointer;
font-family: 'TrueBold';
font-size: 18px;
font-size: 5.625vw;
line-height: 1em;
text-decoration: underline;
}
.bnr-info-list {
position: relative;
}
.bnr-info-list .abs-txt-anchor {
position: absolute;
right: 13.125%;
bottom: 0;
min-height: 32px;
line-height: 32px;
min-height: 10vw;
line-height: 10vw;
}
.bnr-info-list > a {
display: block;
width: 100%;
height: 100%;
outline: none;
text-decoration: none;
}
.bnr-info-list > a.abs-txt-anchor {
width: auto;
height: auto;
}
.abs-sub-txt {
float: right;
display: block;
font-family: 'TrueLight';
font-size: 22px;
font-size: 6.875vw;
line-height: 0.7272727272727273em;
margin-right: 5.625%;
margin-top: 1.875%;
}
.sub-txt-sm {
font-size: 18px;
font-size: 5.625vw;
line-height: 1em;
}
.heading-tab-2 .abs-sub-txt {
margin-top: 0;
margin-right: 0;
}
.img-icon-box {
position: relative;
cursor: pointer;
display: inline-block;
vertical-align: middle;
width: 30px;
height: 30px;
width: 9.375vw;
height: 9.375vw;
}
.img-icon-box img {
position: absolute;
top: 50%;
left: 50%;
display: block;
width: 14px;
height: 14px;
width: 4.375vw;
height: 4.375vw;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.group-txt-2 .img-icon-box {
position: absolute;
right: -20px;
right: -6.25vw;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.group-txt-2 .img-icon-box img {
margin-top: -2px;
}
.dotted-line {
border-bottom: 1px dotted #999;
}
.full-height-block, .main-sec.full-height-block {
min-height: 100%;
padding-top: 44px;
margin-bottom: -49px;
box-sizing: border-box;
}
.title-txt-spc {
margin-top: 50px;
}
.mini-bnr-box img {
width: 100%;
display: block;
}
.vsb-elm {
display: block;
}
.tab-text-box {
font-family: 'TrueBoldSpecial';
font-size: 22px;
font-size: 6.875vw;
line-height: 1em;
text-align: center;
color: #ccc;
}
.tab-text-box > li {
position: relative;
cursor: pointer;
display: inline-block;
vertical-align: top;
padding: 0.2272727272727273em 0.6818181818181818em;
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.tab-text-box > li:after {
content: "";
display: block;
position: absolute;
left: -1px;
width: 2px;
top: 50%;
height: 60%;
background-color: #999;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.tab-text-box > li:first-child:after {
display: none;
}
.tab-text-box > .actived {
color: #ee3124;
}
.input-combobox {
position: relative;
}
.input-combobox .accd-arrow {
position: absolute;
right: 12px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.hidden-sl {
display: none;
}
/* --- SPRITE BU --- */
.sprite-bu {
display: inline-block;
vertical-align: top;
background-image: url(../images/icons/sprite-bu-logo@2x.png);
background-repeat: no-repeat;
}
.ie8 .sprite-bu {
behavior: url(css/backgroundsize.min.htc);
}
.truemoveh-logo {
width: 68px;
height: 11px;
width: 21.25vw;
height: 3.4375vw;
background-position: 0 19.428571428571427%;
background-size: 430.59490084985833% 1054.5454545454545%;
}
.trueonline-logo {
width: 65px;
height: 11px;
width: 20.3125vw;
height: 3.4375vw;
background-position: 0 32.64150943396226%;
background-size: 515.2542372881355% 1160%;
}
.truevisions-logo {
width: 69px;
height: 11px;
width: 21.5625vw;
height: 3.4375vw;
background-position: 0% 45.84905660377358%;
background-size: 487.1794871794871% 1160%;
}
.truemoveh-icon {
width: 39px;
height: 50px;
width: 12.1875vw;
height: 15.625vw;
background-position: 71.39800285306704% 38.604651162790695%;
background-size: 1288.135593220339% 386.6666666666667%;
}
.trueonline-icon {
width: 64px;
height: 50px;
width: 20vw;
height: 15.625vw;
background-position: 81.3768115942029% 42.5531914893617%;
background-size: 1085.7142857142858% 527.2727272727273%;
}
.truevisions-icon {
width: 55px;
height: 50px;
width: 17.1875vw;
height: 15.625vw;
background-position: 92.15827338129496% 41.08695652173913%;
background-size: 1169.230769230769% 483.3333333333333%;
}
.nav-list-icons-box {
text-align: center;
margin-top: 15px;
}
.nav-list-items {
cursor: pointer;
display: inline-block;
vertical-align: top;
margin-left: 2.333333333333333%;
margin-right: 2.333333333333333%;
opacity: 0.4;
filter: alpha(opacity=40);
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.nav-list-items.actived {
opacity: 1;
}
.nav-list-items > .sprite-bu {
display: block;
margin: 15% auto 0;
}
.nav-list-items.disabled .truemoveh-logo {
background-position: 31.876606683804624% 19.428571428571427%;
}
.nav-list-items.disabled .trueonline-logo {
background-position: 30.36734693877551% 32.64150943396226%;
}
.nav-list-items.disabled .truevisions-logo {
background-position: 30.79470198675497% 45.84905660377358%;
}
.nav-list-items.disabled .truemoveh-icon {
background-position: 71.39800285306704% 0;
}
.nav-list-items.disabled .trueonline-icon {
background-position: 81.3768115942029% 7.234042553191489%;
}
.nav-list-items.disabled .truevisions-icon {
background-position: 92.15827338129496% 5%;
}
.nav-list-items.disabled {
cursor: default;
}
.grey-cir-box {
position: relative;
display: inline-block;
vertical-align: top;
width: 80px;
height: 80px;
width: 25vw;
height: 25vw;
background-color: #eee;
border-radius: 50%;
text-align: center;
}
.grey-cir-box .sprite-bu {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.hidden-title {
position: absolute;
top: -200%;
}
.hpl-wrap-box {
padding: 1.785714285714286% 3.571428571428571%;
border-bottom: 1px solid #ccc;
}
.hpl-wrap-box .hpl-link-box {
display: inline-block;
vertical-align: top;
padding-left: 0;
padding-right: 0;
}
.hpl-wrap-box .hpl-link-box:first-child {
width: 58%;
}
.hpl-wrap-box .hpl-link-box:first-child + .hpl-link-box {
width: 40%;
text-align: right;
}
.hpl-wrap-box .hpl-link-box:first-child:last-child {
width: 100%;
text-align: center;
}
.hpl-wrap-box .hpl-link-box:first-child + .hpl-link-box.pull-right-box strong, .switch-line-txt {
display: block;
}
.tab-heading-block, .rows, .block-inline-wrap {
padding-left: 10px;
padding-right: 10px;
}
.tab-heading-block {
font-family: 'TrueBold';
font-size: 7.5vw;
line-height: 1em;
background-color: #f5911d;
padding-top: 8px;
padding-bottom: 8px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.tab-heading-block + .mtp-rows-block {
border-top: none;
}
.mtp-rows-wrap {
margin-bottom: 10px;
}
.mtp-rows-wrap > .mtp-rows-block:first-child {
border-top: none;
padding-top: 0;
}
.mtp-rows-wrap > .mtp-rows-block {
border-top-width: 1px;
}
.mtp-rows-block {
background-color: #fff;
border-top: 2px solid #d2d2d2;
padding-top: 15px;
padding-bottom: 15px;
}
.mtp-rows-block.hl-block {
padding-top: 8px;
padding-bottom: 8px;
background-color: #edeff3;
}
.rows {
font-family: 'TrueMedium';
font-size: 6.25vw;
line-height: 1em;
color: #333;
margin-top: 5px;
}
.rows.-space {
margin-top: 30px;
}
.rows .txt-split {
display: block;
margin: 3px 0;
}
.rows.-sm {
font-size: 5.625vw;
margin-top: 2px;
}
.rows:first-child {
margin-top: 0;
}
.rows strong {
font-family: 'TrueBold';
font-weight: normal;
}
.rows .medium-txt {
font-size: 7.5vw;
font-family: 'TrueBoldSpecial';
font-weight: normal;
}
.rows.two-cols > .cols {
float: left;
width: 49%;
margin-left: 2%;
text-align: right;
}
.rows.two-cols > .cols:first-child {
margin-left: 0;
text-align: left;
}
.block-inline-wrap {
margin-top: 30px;
}
.block-inline-wrap .cmn-inline-label {
margin-left: 0;
}
.block-inline-wrap .block-inline-item {
margin-top: 10px;
}
.block-inline-wrap .block-inline-item:first-child {
margin-top: 0;
}
.clear-input-box .cir-btn {
position: absolute;
right: 2px;
top: 50%;
margin-top: -18px;
}
.clear-input-box .cmn-input {
padding-right: 36px;
}
.clear-input-box {
position: relative;
}
.cir-btn {
position: relative;
width: 36px;
height: 36px;
border-radius: 50%;
outline: none;
border: none;
-webkit-appearance: none;
padding: 0;
background-color: transparent;
}
.cir-btn:after {
content: "";
display: block;
position: absolute;
left: 50%;
top: 50%;
width: 20px;
height: 20px;
margin-left: -10px;
margin-top: -10px;
border-radius: 50%;
background-color: #ccc;
z-index: 0;
}
.cir-btn .xw-icon {
position: absolute;
display: block;
width: 8px;
height: 8px;
left: 50%;
top: 50%;
z-index: 2;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.spacing-txt {
font-family: 'TrueMedium';
font-size: 28px;
line-height: 1em;
margin-top: 5px;
margin-bottom: 5px;
}
.input-block-wrap {
position: relative;
width: 270px;
margin: 0 auto 25px;
}
.input-block-wrap .right-label {
position: absolute;
right: 0;
bottom: 0;
}
.ie8 .black-4g-txt, .ie8 .info-white-icon {
behavior: url(css/backgroundsize.min.htc);
}
.packbox {
max-width: 1000px;
margin: 0 auto 40px;
}
.box-1 .packbox:first-child {
margin-top: -24px;
}
.pack-head {
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.pack-head, .pack-row, .pack-row .pack-col.-larger {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.pack-row {
font-family: 'TrueMedium';
color: #555;
font-size: 20px;
line-height: 1em;
background-color: #fff;
padding: 10px;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.pack-head {
min-height: 38px;
padding-left: 10px;
padding-right: 10px;
text-align: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.pack-head.-yellow, .pack-head.-orange {
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
}
.pack-head.-yellow {
background-image: url('../images/bg/head-package5.jpg');
}
.pack-head.-orange {
background-image: url('../images/bg/head-package4.jpg');
}
.pack-head.-darkgray {
background-color: #666;
}
.pack-head .title {
display: block;
font-family: 'TrueBold';
color: #fff;
font-size: 22px;
line-height: 0.9em;
text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}
.pack-row.-gray {
background-color: #e8e8e8;
}
.pack-row.-leftline .pack-col {
border-left: 1px solid #ccc;
}
.pack-row.-leftline .pack-col:first-child, .pack-row.-leftline .pack-col:last-child:nth-child(4) {
border-left: none;
}
.pack-row .-bold {
font-family: 'TrueBoldSpecial';
color: #000;
font-weight: normal;
}
.pack-row .-bold {
width: 100%;
}
.pack-row .-bold:first-child, .pack-row .-block {
display: block;
}
.pack-row .text-sm {
font-size: 19px;
line-height: 0.9em;
}
.pack-row .pack-col {
position: relative;
box-sizing: border-box;
}
.pack-row .pack-col.-larger {
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.packbox.-hightlight .pack-col.-larger {
padding-left: 15px;
}
.pack-col.-larger {
width: 49.64285714285714%;
padding-right: 8px;
}
.pack-col.-small, .pack-col.-medium {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.pack-col.-small {
width: 14.28571428571429%;
width: 13%;
max-width: 58px;
}
.pack-col.-medium {
width: 25%;
max-width: 60px;
}
.pack-col .star-circle {
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.pack-col.-larger .star-circle ~ .-bold,
.pack-col.-larger .star-circle + .-bold ~ .text-sm.-block {
margin-left: 7px;
margin-right: 0;
}
.pack-col .-bold + .text-sm.-block {
margin-left: 0;
width: 100%;
}
.pack-row.-three .pack-col.-small {
width: 16%;
}
.pack-row.-three .pack-col.-larger {
width: 67%;
}
.pack-button {
font-family: 'TrueBold';
font-size: 20px;
font-weight: normal;
padding-left: 5px;
padding-right: 5px;
height: 28px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.pack-button.-small {
width: 50px;
}
.pack-button.-yellow {
color: #fff;
background-color: #f5911d;
}
.pack-button.-orange {
color: #fff;
background-color: #f23428;
}
.filter-menu {
background-color: #fff;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
padding-top: 10px;
z-index: 2;
}
.filter-menu .tlight-large-size {
font-size: 24px;
width: 93.75%;
margin: 0 auto 12px;
}
.filter-menu, .filter-menu-nav {
position: relative;
}
.filter-menu-nav {
clear: both;
margin-left: auto;
margin-right: auto;
background-color: #fafafa;
}
.filter-menu .select-menu {
width: 93.75%;
margin: 0 auto 10px;
}
.filter-menu-list {
position: relative;
font-family: 'TrueMedium';
font-size: 22px;
line-height: 1em;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
padding-bottom: 5px;
background-color: #fafafa;
}
.filter-menu-list.owl-carousel {
padding: 12px 0;
margin-left: auto;
margin-right: auto;
}
.filter-menu-list.owl-carousel .owl-prev {
left: 0;
}
.filter-menu-list.owl-carousel .owl-next {
right: 0;
}
.filter-menu-list.owl-carousel .owl-prev.disabled,
.filter-menu-list.owl-carousel .owl-next.disabled {
opacity: 0;
}
.filter-menu-list.owl-carousel .filter-menu-item {
text-align: center;
padding-left: 15px;
padding-right: 15px;
}
.filter-menu-list.owl-carousel .filter-menu-item {
white-space: nowrap;
}
/* .filter-menu-list.owl-carousel .owl-item:last-child .filter-menu-item {
margin-right: 100px;
} */
.filter-menu-list.owl-carousel .filter-menu-item.actived {
font-family: 'TrueBoldSpecial';
color: #000;
text-decoration: underline;
}
.filter-menu-item a {
display: block;
outline: none;
text-decoration: none;
}
.filter-menu-item.slick-slide a {
padding: 10px 15px;
}
.filter-menu-item.swiper-slide {
width: auto;
}
.filter-menu-list .arw-nav-prev.slick-arrow {
left: 0;
}
.filter-menu-list .arw-nav-next.slick-arrow {
right: 0;
}
.filter-menu-list .arw-nav-next.slick-arrow,
.filter-menu-list .arw-nav-prev.slick-arrow {
margin-top: -16px;
}
.filter-menu-list.owl-carousel .owl-stage {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row nowrap;
-webkit-flex-flow: row nowrap;
flex-flow: row nowrap;
}
.filter-menu-list.owl-carousel .owl-item {
float: none;
}
.swiper-container.filter-menu-nav {
padding-left: 15px;
padding-right: 15px;
}
.swiper-container .filter-menu-list {
padding-left: 0;
padding-right: 0;
}
.swiper-container .filter-menu-list > .filter-menu-item {
margin-right: 0;
}
.swiper-container .filter-menu-list > .filter-menu-item > a {
padding: 8px 20px;
}
.swiper-red-nav .swiper-button-prev,
.swiper-red-nav .swiper-button-next {
color: #ee3124;
}
.swiper-red-nav .swiper-button-prev:after,
.swiper-red-nav .swiper-button-next:after {
font-size: 20px;
font-weight: 900;
}
.swiper-button-prev {
left: 5px;
}
.swiper-button-next {
right: 5px;
}
.sq-box-shadow {
pointer-events: none;
display: block;
position: absolute;
top: 0;
width: 50px;
height: 100%;
opacity: 0.7;
z-index: 1;
}
.sq-box-shadow.-left {
left: 0;
background: -moz-linear-gradient(left, rgba(186,186,186,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left, rgba(186,186,186,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(186,186,186,0.65) 0%,rgba(0,0,0,0) 100%);
}
.sq-box-shadow.-right {
right: 0;
background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(186,186,186,0.65) 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(186,186,186,0.65) 100%);
background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(186,186,186,0.65) 100%);
}
.filter-menu-list > .filter-menu-item {
display: inline-block;
vertical-align: top;
margin-right: 10px;
}
.filter-menu-list > .actived,
.filter-menu-list .filter-menu-item.actived {
font-family: 'TrueBoldSpecial';
color: #000;
text-decoration: underline;
}
.filter-menu-list > .filter-menu-item > a {
position: relative;
display: block;
padding: 5px;
z-index: 2;
}
.star-circle {
width: 16px;
height: 16px;
background-position: 11.737089201877934% 97.57085020242914%;
background-size: 1875% 8333.333333333332%;
}
.star-circle.-orange {
background-position: 18.07511737089202% 97.57085020242914%;
}
.mtp-column-wrap {
position: relative;
width: 90%;
margin: 0 auto;
}
.mtp-col-box-6 > .rows {
float: left;
width: 48%;
margin-right: 4%;
padding: 0;
margin-top: 0;
margin-bottom: 4.166666666666667%;
}
.mtp-col-box-6 > .rows:nth-child(2n) {
margin-right: 0;
}
.mtp-col-box-6 > .rows:first-child:last-child {
margin-right: 0;
width: 100%;
float: none;
}
.wifi-area-box {
width: 100%;
height: 109.375vw;
margin: 0 auto;
}
.wifi-list-box {
width: 90%;
position: relative;
min-height: 100px;
margin: 0 auto;
}
.wifi-list-box.owl-carousel .cmn-list-txt {
width: 90%;
margin: 0 auto;
}
.wifi-list-box .owl-dots {
position: relative;
bottom: auto;
margin-top: 20px;
}
.wifi-map img {
display: block;
width: 100%;
}
.slide-med-size .wifi-map img {
border-radius: 0;
}
.hpl-link-box .list-view-icon, .hpl-link-box .map-view-icon {
margin-right: 10px;
}
.cmn-list-txt {
font-family: 'TrueBold';
font-size: 6.875vw;
line-height: 1em;
color: #666;
}
.cmn-list-txt.-underline > .cmn-list-item {
position: relative;
border-bottom: 1px solid #ddd;
}
.cmn-list-txt.-underline > .cmn-list-item > a {
display: block;
padding-top: 3.472222222222222%;
padding-bottom: 3.472222222222222%;
}
.cmn-list-txt > .cmn-list-item .arw-list-orange {
position: absolute;
right: 0;
top: 0;
margin-top: 5.555555555555556%;
width: 2.1875vw;
height: 3.75vw;
}
.sprite-icons-2 {
display: inline-block;
vertical-align: top;
background-image: url(../images/icons/sprite-icons2.png);
background-repeat: no-repeat;
}
_:-ms-input-placeholder, :root .sprite-icons-2 {
background-image: url(../images/bg/sprite-icons2.png);
}
.chat-bubble-icon {
width: 103px;
height: 100px;
width: 27.4667vw;
height: 26.667vw;
background-position: 57.82828282828283% 0;
background-size: 480.7692307692308% 990.09900990099%;
}
.staff-icon {
width: 115px;
height: 100px;
width: 30.667vw;
height: 26.667vw;
background-position: 0 0;
background-size: 434.78260869565213% 1000%;
}
.on-web-icon {
width: 103px;
height: 100px;
width: 27.4667vw;
height: 26.667vw;
background-position: 30.303030303030305% 0;
background-size: 480.7692307692308% 990.09900990099%;
}
.trueshop-icon {
width: 123px;
height: 100px;
width: 30.625vw;
height: 25vw;
background-position: 89.76063829787235% 0;
background-size: 403.2258064516129% 990.09900990099%;
}
.credit-card-icon.-med {
width: 115px;
height: 86px;
width: 35.9375vw;
height: 26.875vw;
}
.tmn-wallet-icon {
width: 258px;
height: 208px;
width: 36.5625vw;
height: 30vw;
background-position: 100% 98.86603375527426%;
background-size: 348.83720930232556% 1923.076923076923%;
}
.tmn-wallet-icon.-small {
width: 32px;
height: 25px;
}
.tmn-kiosk-icon {
width: 64px;
height: 100px;
width: 20vw;
height: 31.25vw;
background-position: 60.77481840193705% 98.27497425334707%;
background-size: 1216.2162162162163% 3448.275862068966%;
}
.social-network-icon {
width: 159px;
height: 100px;
width: 49.6875vw;
height: 31.25vw;
background-position: 0 11.2012987012987%;
background-size: 413.2231404958677% 1315.7894736842104%;
}
.data500-icon {
width: 177px;
height: 70px;
width: 55.3125vw;
height: 21.875vw;
background-position: 32.41830065359477% 10.854745673833246%;
background-size: 425.531914893617% 2150.537634408602%;
}
.lang-th .data500-icon {
background-position: 40.86161879895561% 19.39203354297694%;
background-size: 427.35042735042737% 2173.913043478261%;
}
.idcard-icon {
width: 81px;
height: 60px;
width: 25.3125vw;
height: 18.75vw;
background-position: 59.10735826296744% 11.04589114194237%;
background-size: 584.7953216374269% 1587.3015873015875%;
}
.scan-qrcode-icon {
width: 50px;
height: 88px;
width: 15.625vw;
height: 27.5vw;
background-position: 100% 11.948955916473318%;
background-size: 632.9113924050633% 724.6376811594203%;
}
.sim-checked-icon {
width: 70px;
height: 80px;
width: 21.875vw;
height: 25vw;
background-position: 80.38277511961722% 11.42384105960265%;
background-size: 609.7560975609756% 1063.8297872340424%;
}
.header-block {
position: relative;
display: block;
font-family: 'TrueBold';
font-weight: normal;
font-size: 9.067vw;
line-height: 1em;
padding: 5px;
margin-bottom: 15px;
}
.header-block.-center {
text-align: center;
}
.header-block.-yellow {
background-color: #ffb400;
color: #fff;
}
.header-title {
font-family: 'TrueBold';
font-weight: normal;
font-size: 7.85vw;
line-height: 1em;
margin-bottom: 0.7em;
}
.header-title.-center {
text-align: center;
}
.block-wraper {
width: 93.75%;
padding-top: 18px;
margin: 0 auto;
}
.block-wraper.-full {
width: 100%;
padding-bottom: 15px;
}
.block-wraper.-fix {
width: 92%;
max-width: 500px;
margin-left: auto;
margin-right: auto;
padding: 10px;
background-color: #fff;
border-radius: 8px;
}
.block-wraper.-fix .header-title {
margin-bottom: 5px;
}
.multiple-col-block {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.multiple-col-block.-three {
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.multiple-col-block.-three .col-item {
width: 100%;
}
.multiple-col-block.-three .col-item:nth-child(1),
.multiple-col-block.-three .col-item:nth-child(2) {
padding-top: 18px;
}
.multiple-col-block.-three .col-item:nth-child(2):after {
display: none;
}
.multiple-col-block.-three .col-title {
margin-top: 0;
}
.multiple-col-block.-three .col-title:last-child {
margin-bottom: 0;
}
.multiple-col-block.-three .col-item .sprite-icons,
.multiple-col-block.-three .col-item .sprite-icons-2 {
margin-bottom: 20px;
}
.multiple-col-block.-three .col-title.-med {
font-size: 1.136em;
}
.multiple-col-block.-three .col-item:nth-child(3) .col-title {
min-height: 10px;
}
.multiple-col-block.-three .col-item .button-flex.-auto {
width: auto;
}
.multiple-col-block .col-item {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
position: relative;
font-family: 'TrueMedium';
font-size: 6.875vw;
line-height: 1em;
width: 50%;
padding-top: 15px;
padding-bottom: 18px;
}
.multiple-col-block .col-item strong {
font-family: 'TrueBold';
font-weight: normal;
line-height: 0.85em;
}
.multiple-col-block .col-item .button-flex {
width: 84%;
}
.multiple-col-block .col-item:nth-child(1):before,
.multiple-col-block .col-item:nth-child(2):before {
content: "";
display: block;
position: absolute;
height: 1px;
left: 12px;
right: 12px;
background-color: #ccc;
bottom: 0;
}
.multiple-col-block .col-item:nth-child(2n):after {
content: "";
display: block;
position: absolute;
top: 0;
bottom: 18px;
left: 0;
width: 1px;
background-color: #ccc;
}
.multiple-col-block .col-item:nth-child(2n + 4):after {
top: 15px;
}
.multiple-col-block .col-item:nth-child(1),
.multiple-col-block .col-item:nth-child(2) {
padding-top: 2.27em;
}
.multiple-col-block .col-item:nth-child(3) .col-title,
.multiple-col-block .col-item:nth-child(4) .col-title {
min-height: 15.625vw;
}
.multiple-col-block .col-title {
display: block;
width: 100%;
text-align: center;
margin-top: 15px;
margin-bottom: 15px;
}
.med-label.-absolute {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.med-label {
width: 24vw;
font-family: 'TrueMedium';
font-size: 5.33vw;
line-height: 1em;
border-radius: 8px;
padding: 0.25em;
text-align: center;
}
.med-label.-red {
background-color: #ee3124;
}
.md-ctn-box-2 .box-ctn-acd-wrap.style-2 {
width: 100%;
}
.inline-block-col {
margin-top: 20px;
margin-bottom: 40px;
}
.text_terms_and_conditions {
font-size: 19px !important;
}
.mtp-icons-list {
text-align: center;
}
.mtp-icons-list > .icon-list-item {
display: inline-block;
vertical-align: top;
margin-left: 5px;
margin-right: 5px;
}
.mtp-icons-list .title {
display: block;
font-family: 'TrueBold';
font-size: 6.25vw;
line-height: 1em;
margin-bottom: 0.4167em;
}
.icon-list-item > img {
display: inline-block;
vertical-align: top;
height: 12.5vw;
}
.info-list-block {
position: relative;
}
.info-list-item {
position: relative;
box-sizing: border-box;
padding-left: 25px;
padding-right: 25px;
}
.info-list-item + .info-list-item {
margin-top: 25px;
padding-top: 25px;
border-top: 1px solid #ccc;
}
.table-info-box {
margin-bottom: 40px;
}
.table-info-box .title-info-list {
text-align: center;
}
.table-info-box .note-txt {
text-align: center;
}
.table-row-list {
position: relative;
clear: both;
width: 100%;
padding-top: 0;
margin: 0 auto 40px;
}
.table-row-list.-head {
display: none;
}
.table-inner {
position: relative;
clear: both;
}
.table-row-heading, .table-row-content {
position: relative;
width: 90%;
margin-left: auto;
margin-right: auto;
font-family: 'TrueMedium';
font-size: 6.25vw;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.table-row-heading strong, .table-row-content strong {
font-family: 'TrueBold';
}
.table-row-heading.-yellow, .table-list-col.-yellow {
background-color: #ffb400;
color: #fff;
}
.table-row-heading.-red, .table-list-col.-red {
background-color: #ee3124;
color: #fff;
}
.table-row-heading.-medgray, .table-list-col.-medgray {
background-color: #999;
color: #fff;
text-align: right;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
}
.table-row-content.-softgray, .table-list-col.-softgray {
background-color: #f7f7f7;
}
.table-list-col {
width: 50%;
line-height: 0.9em;
box-sizing: border-box;
padding: 5px 10px;
background-color: #f7f7f7;
border-bottom: 1px solid #fff;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.table-list-col.-full {
width: 100%;
text-align: center;
background-color: #fff;
font-size: 9.375vw;
padding-top: 10px;
padding-bottom: 10px;
color: #f5911d;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.table-list-col.-redtxt {
color: #ee3124;
}
.table-list-col.-full:empty {
display: none;
}
.table-list-col.-yellow, .table-list-col.-red {
text-align: right;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
}
.table-txt-sub {
display: block;
font-family: 'TrueMedium';
font-size: 0.5em;
line-height: 0.85em;
min-width: 100%;
}
.table-row-content {
color: #333;
}
.map-pic {
position: relative;
width: 96%;
margin: 15px auto;
}
.map-pic img {
display: block;
width: 100%;
}
.sim-box {
display: block;
}
.sim-title {
font-family: 'TrueBoldSpecial';
font-size: 30px;
font-size: 9.375vw;
line-height: 1em;
margin-bottom: 0.1667em;
}
.sim-pic {
position: relative;
width: 118px;
width: 53.6363%;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
}
.sim-pic:first-child:last-child {
margin-bottom: 0;
}
.sim-pic img {
display: block;
width: 100%;
box-sizing: border-box;
border: 1px solid #eee;
}
.search-area-box {
position: relative;
padding: 20px 0;
}
.search-area-box .search-title {
display: block;
font-family: 'TrueBoldSpecial';
font-size: 28px;
font-size: 8.75vw;
line-height: 1em;
margin-bottom: 0.53571em;
}
.search-list-box {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.search-list-item {
cursor: pointer;
width: 50%;
box-sizing: border-box;
padding-left: 12px;
padding-right: 12px;
text-align: center;
margin-bottom: 30px;
}
.search-txt {
display: block;
font-family: 'TrueBold';
font-size: 20px;
font-size: 6.25vw;
line-height: 1em;
}
.sim-img-list {
display: block;
width: 100%;
margin: 0 auto 10px;
}
.map-area-pic {
position: relative;
margin-bottom: 25px;
}
.map-area-pic img {
display: block;
width: 100%;
}
.txt-inline-list {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.txt-inline-item {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 1em;
width: 36%;
margin-left: 7%;
margin-right: 7%;
margin-top: 5px;
}
.txt-inline-list .txt-inline-item:first-child:last-child {
width: 100%;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.mtp-rows-block .txt-inline-item {
width: 43%;
margin-left: 0;
margin-right: 14%;
}
.mtp-rows-block .txt-inline-item:nth-child(2n) {
margin-right: 0;
}
.flex-box-panel {
margin-bottom: 25px;
}
.flex-row-panel {
width: 100%;
margin-bottom: 14px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.flex-row-panel.-btmline + .flex-row-panel.-btmline {
border-top: 1px solid #ccc;
padding-top: 14px;
margin-top: 14px;
margin-bottom: 0;
}
.flex-col-panel {
width: 60%;
}
.flex-col-panel:nth-child(2) {
width: 40%;
}
.flex-col-panel.-full {
width: 100%;
}
.flex-col-panel.-right {
text-align: right;
}
.flex-col-panel.-center {
text-align: center;
}
.flex-col-panel.-pad {
padding: 6px 15px;
}
.flex-col-panel.-gray {
background-color: #ddd;
}
.flex-col-panel.-full {
width: 100%;
}
.txt-fix {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 1em;
}
.txt-fix strong {
font-family: 'TrueBold';
font-weight: normal;
}
.price-txt-fix {
font-family: 'TrueBold';
font-size: 30px;
line-height: 1em;
font-weight: normal;
}
.cur-txt-fix {
font-size: 0.7333em;
}
.block-inline-elm {
position: relative;
margin-bottom: 5%;
}
.block-inline-elm > div + div {
margin-top: 4%;
}
.box-ctn-3 > .md-title-fix {
margin-bottom: 10px;
}
.md-title-fix {
font-family: 'TrueBold';
font-size: 24px;
line-height: 0.8em;
}
.md-title-fix.-spacing {
margin-left: 10px;
margin-right: 10px;
}
.fix-txt-size {
font-family: 'TrueMedium';
font-size: 22px;
line-height: 0.85em;
}
.fix-txt-size strong, .fix-txt-size.-bold {
font-family: 'TrueBold';
}
.fix-txt-size.-bolder {
font-family: 'TrueBoldSpecial';
}
.fix-txt-size.-block {
display: block;
}
.fix-txt-size.-small {
font-size: 18px;
}
.txt-inline-list ~ .fix-txt-size {
text-align: center;
margin: 30px auto 0;
}
.hide-dot .owl-dots {
max-height: 0;
overflow: hidden;
}
.line-app-icon {
width: 38px;
height: 38px;
background-size: 333.33333333333337% 666.6666666666667%;
background-position: 0 21.529411764705884%;
}
.pack-btn-item {
position: relative;
min-width: 125px;
min-height: 38px;
border-radius: 10px;
overflow: hidden;
font-family: 'TrueBold';
font-size: 21px;
box-sizing: border-box;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
-moz-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
justify-content: flex-start;
-ms-flex-pack: flex-start;
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
align-items: center;
}
.pack-btn-item.-full {
width: 100%;
}
.pack-btn-item.-med {
min-height: 34px;
}
.pack-btn-item.-green {
color: #fff;
background-color: #21ba4f;
}
.pack-btn-item.-whiteline {
border: 2px solid #fff;
background-color: transparent;
box-sizing: border-box;
}
.pack-btn-item *[class*='app-icon'] {
position: absolute;
left: 0;
top: 0;
width: 38px;
height: 38px;
border-radius: 10px 0 0 10px;
}
.pack-btn-item *[class*='app-icon'] + .pack-btn-txt {
margin-left: 38px;
}
.pack-btn-item.-flexi {
min-height: 11.875vw;
font-size: 6.5625vw;
}
.pack-btn-item.-flexi *[class*='app-icon'] {
width: 11.875vw;
height: 11.875vw;
}
.pack-btn-item.-flexi *[class*='app-icon'] + .pack-btn-txt {
margin-left: 11.875vw;
}
.pack-btn-item .pack-btn-txt {
width: 100%;
padding-left: 10px;
padding-right: 10px;
box-sizing: border-box;
text-align: center;
}
.cmn-form-style .pack-btn-item {
width: 82%;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
}
.jssocials-share-link {
min-width: 90px;
}
.fixedonsmall {
position: fixed;
left: 0;
right: 0;
bottom: 0;
padding: 15px 0 36px 0;
z-index: 10;
-webkit-transition: -webkit-transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.fixedonsmall .pack-btn-item.-flexi {
position: relative;
}
/* .bottom .fixedonsmall {
-webkit-transform: translateY(180%);
transform: translateY(180%);
} */
.custom-combobox {
position: relative;
}
.custom-combobox.show .combobox-list-wrap {
max-height: none;
overflow: visible;
}
.combobox-list-wrap {
position: absolute;
left: 0;
right: 0;
top: 100%;
box-sizing: border-box;
max-height: 0;
overflow: hidden;
z-index: 1;
}
.combobox-list {
position: relative;
text-align: left;
background-color: #fff;
border: 1px solid #ccc;
border-top: none;
}
.combobox-list-item {
cursor: pointer;
position: relative;
font-family: 'TrueBold';
font-size: 6.875vw;
line-height: 0.9em;
padding: 3.597% 4.2857%;
}
.combobox-list-item:after {
content: "";
display: block;
position: absolute;
left: 12px;
right: 12px;
top: 0;
height: 1px;
background-color: #ddd;
}
.combobox-list-item:first-child:after {
display: none;
}
.full-bnr-content {
position: relative;
background-repeat: no-repeat;
background-image: url('../images/bg/sprite-bg2.png');
background-size: 248% 294.11764705882354%;
min-height: 90.625vw;
padding-bottom: 15px;
box-sizing: border-box;
margin-top: 3.5%;
background-size: 248% 526.3157894736843%;
min-height: 50.625vw;
}
.full-bnr-content.-bg1 {
background-position: 0 0;
}
.full-bnr-content.-bg2 {
background-position: 0 52.27272727272727%;
background-position: 0 42.592592592592595%;
}
.full-bnr-desc {
display: block;
position: relative;
top: 0;
left: 0;
right: 0;
font-family: 'TrueMedium';
font-size: 6.875vw;
line-height: 1em;
color: #fff;
text-align: center;
padding-top: 28.125%;
margin-bottom: 3.125%;
}
.full-bnr-med-txt {
font-family: 'TrueBoldSpecial';
font-size: 1.636em;
line-height: 0.5em;
}
.full-bnr-desc .tgl-br {
display: none;
}
.youtube-vdo-iframe {
display: block;
width: 84.735vw;
height: 47.5vw;
margin-left: auto;
margin-right: auto;
}
.youtube-video {
display: block;
width: 100%;
height: 52.8125vw;
border: none;
margin-left: auto;
margin-right: auto;
}
.youtube-video.-spacebottom {
margin-bottom: 30px;
}
.wrap-cont {
position: relative;
}
.wrap-cont .form-row-elm {
margin-top: 3.125%;
margin-bottom: 5%;
}
.wrap-cont .flex-block-wrap,
.wrap-cont .heading-tab-2 {
width: 93.75%;
max-width: 1000px;
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
}
.wrap-cont .flex-block-wrap ~ .heading-tab-2 + .box-ctn-acd-wrap.style-2 {
margin-bottom: 5%;
}
.flex-block-wrap {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.flex-block-rows {
color: #222;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.flex-block-rows.-threecols .flex-block-cols {
width: 33.333%;
}
.flex-block-rows.-fourcols .flex-block-cols {
width: 25%;
}
.flex-block-rows.-head .flex-block-cols {
padding: 5px;
}
.flex-block-rows .flex-block-cols {
padding: 10px 5px;
box-sizing: border-box;
}
.flex-block-rows:nth-child(odd) {
background-color: #f7f7f7;
}
.flex-block-rows.-red {
color: #fff;
background-color: #ee3124;
}
.flex-block-rows.-yellow {
color: #fff;
background-color: #ffb400;
}
.flex-block-cols {
position: relative;
font-family: 'TrueMedium';
font-size: 19px;
line-height: 1em;
}
.flex-block-items {
position: relative;
margin-bottom: 30px;
}
.flex-block-rows.-head .text-item {
display: block;
font-family: 'TrueBoldSpecial';
}
.text-item {
display: block;
font-family: 'TrueMedium';
font-size: 19px;
line-height: 0.85em;
}
.flex-block-cols.-left {
text-align: left;
}
.flex-block-cols.-center {
text-align: center;
}
.wrap-cont .heading-tab-2 {
position: relative;
}
.wrap-cont .box-ctn-acd-wrap.style-2 {
margin-bottom: 10%;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
.wrap-cont .ctn-tgl-box .flex-block-wrap {
width: 100%;
margin-top: 25px;
}
.wrap-cont .heading-txt-2 {
margin-bottom: 15px;
}
.wrap-cont .pack-col:first-child {
text-align: left;
}
.wrap-cont .packbox {
margin-bottom: 15px;
}
.wrap-cont .flex-block-wrap {
margin-top: 20px;
}
.wrap-cont .med-box-ctn .brc-wrap-box {
margin-top: 0;
margin-bottom: 6.25%;
}
.ctn-tgl-box .flex-block-wrap.-full .flex-block-items {
margin-bottom: 0;
}
.packbox-list-item {
position: relative;
}
.packbox-list-item + .packbox-list-item {
margin-top: 30px;
}
.floating-side-block {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.floating-side-block .floating-txt-item {
width: 49%;
}
.floating-side-block > .floating-txt-item:first-child {
text-align: left;
}
.floating-side-block > .floating-txt-item:first-child + .floating-txt-item {
text-align: right;
}
.floating-side-block > .floating-txt-item:first-child:last-child {
width: 100%;
text-align: center;
}
.floating-txt-item {
position: relative;
font-family: 'TrueMedium';
font-size: 19px;
line-height: 1em;
}
.floating-txt-item.-med {
font-size: 22px;
}
.floating-txt-item.-spacebottom {
display: inline-block;
vertical-align: baseline;
margin-bottom: 20px;
}
.flex-block-sim, .sim-thumb-list {
position: relative;
text-align: center;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.flex-block-sim {
margin-top: 30px;
}
.flex-block-sim-list {
position: relative;
width: 50%;
padding: 0 10px;
box-sizing: border-box;
}
.flex-block-sim-list:nth-child(2):before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 1px;
background-color: #ddd;
}
.sim-name {
position: relative;
font-family: 'TrueBold';
font-size: 23px;
line-height: 0.9em;
color: #000;
min-height: 44px;
margin-bottom: 6px;
}
.sim-name .-highlight {
color: #ff8b00;
}
.sim-thumb {
display: block;
width: 40%;
margin-left: 10px;
}
.sim-thumb:first-child {
margin-left: 0;
}
.sim-thumb:nth-child(3n) {
margin-top: 10px;
}
.sim-thumb img,
.sim-prg {
position: relative;
display: block;
width: 100%;
}
.sim-thumb img {
box-sizing: border-box;
border: 1px solid #eee;
}
.sim-prg {
font-family: 'TrueBold';
font-size: 22px;
line-height: 1em;
margin-top: 30px;
padding-left: 20px;
padding-right: 20px;
}
.custom-arrow {
position: relative;
width: 7px;
height: 9px;
}
.custom-arrow.-small {
width: 5px;
height: 6px;
}
.custom-arrow.-med {
width: 11px;
height: 14px;
}
.custom-arrow.-large {
width: 14px;
height: 18px;
}
.custom-arrow.-red:before,
.custom-arrow.-red:after {
background-color: #ee3124;
}
.custom-arrow.-white:before,
.custom-arrow.-white:after {
background-color: #fff;
}
.custom-arrow.-prev {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.custom-arrow.-next {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
.custom-arrow:before, .custom-arrow:after {
content: "";
display: block;
position: absolute;
width: 2px;
height: 100%;
background-color: #aaa;
}
.custom-arrow:before {
right: -1px;
-webkit-transform: rotate(50deg);
transform: rotate(50deg);
}
.custom-arrow:after {
left: 0;
-webkit-transform: rotate(-50deg);
transform: rotate(-50deg);
}
.custom-x-icon {
position: relative;
width: 18px;
height: 18px;
}
.custom-x-icon.-bold:before,
.custom-x-icon.-bold:after {
width: 3px;
border-radius: 3px;
}
.custom-x-icon:before,
.custom-x-icon:after {
content: "";
display: block;
position: absolute;
left: 50%;
top: 0;
width: 2px;
height: 100%;
background-color: #888;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 2;
}
.custom-x-icon.-white:before,
.custom-x-icon.-white:after {
background-color: #fff;
}
.custom-x-icon.-red:before,
.custom-x-icon.-red:after {
background-color: #e31c24;
}
.custom-x-icon.-yellow:before,
.custom-x-icon.-yellow:after {
background-color: #fab72e;
}
.custom-x-icon:before {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.custom-x-icon:after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.custom-x-icon.-plus {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.custom-remove-btn {
cursor: pointer;
position: relative;
width: 40px;
height: 40px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.collapse-expand-block {
position: relative;
padding: 15px;
margin-bottom: 20px;
}
.collapse-expand-block.-radius {
border-radius: 7px;
}
.collapse-expand-block {
background-color: #fff;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.collapse-expand-block .row-element > div:last-child {
margin-bottom: 0;
}
.collapse-title-block {
position: relative;
min-height: 10.9375vw;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-transition: margin 0.3s ease;
transition: margin 0.3s ease;
}
.collapse-title-block .custom-arrow {
pointer-events: none;
position: absolute;
right: 5px;
top: 50%;
margin-top: 1px;
-webkit-transform: translateY(-50%) scale(1.2);
transform: translateY(-50%) scale(1.2);
}
.collapse-title-block .title-3 {
position: relative;
width: 100%;
}
.collapse-arrow-block {
position: absolute;
right: 0;
top: 0;
width: 32px;
height: 32px;
}
.collapse-arrow-block .custom-arrow {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.collapse-expand-block .square-input {
-webkit-transition: none;
transition: none;
}
.collapse-expand-block.actived .custom-arrow {
margin-top: -2px;
-webkit-transform: rotate(-180deg) scale(1.2);
transform: rotate(-180deg) scale(1.2);
}
.collapse-expand-block.actived .collapse-title-block {
margin-bottom: 10px;
}
.modal-form-style {
text-align: left;
}
.md-modal .label-heading.tmed-md-size {
font-size: 22px;
}
.md-modal .row-element .inline-elm-2 {
margin-bottom: 5px;
}
.md-modal .row-element:last-child > div:last-child {
margin-bottom: 0;
}
.md-ctn-box-2.-fix {
padding-top: 35px;
}
.md-fix-scrolling .md-ctn-box-2 {
max-height: 76vh;
box-sizing: border-box;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.cursor-pointer {
cursor: pointer;
}
.border-line-block {
position: relative;
padding: 15px 10px;
border-radius: 10px;
margin-bottom: 20px;
background-color: #fff;
border: 2px solid #fab72e;
max-width: 700px;
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.border-line-block .the-txt + .the-txt {
margin-top: 2px;
}
.the-column {
position: relative;
}
.the-column:nth-child(2) {
text-align: right;
}
.the-txt {
font-family: 'TrueBold';
font-size: 22px;
line-height: 0.9em;
}
.the-txt.-small {
font-size: 20px;
}
.the-digit {
font-family: 'TrueBold';
font-size: 32px;
line-height: 0.5em;
}
.flex-row-panel.-fix {
position: relative;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
border-top: 1px solid #eee;
margin-bottom: 0;
}
.flex-row-panel.-fix:first-child {
border-top: none;
}
.flex-row-panel.-fix .flex-col-panel {
width: 100%;
box-sizing: border-box;
padding: 5% 10px;
}
.flex-box-panel-wrap {
position: relative;
max-width: 700px;
margin-left: auto;
margin-right: auto;
background-color: #fff;
}
.flex-toggle-block-wrap {
position: relative;
min-width: 100%;
box-sizing: border-box;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease;
transition: max-height 0.3s ease;
}
.flex-toggle-block {
position: relative;
min-width: 100%;
box-sizing: border-box;
padding: 20px 10px 15px;
background-color: #edeff3;
}
.flex-toggle-block.-arwwhitetop:after {
content: "";
display: block;
position: absolute;
top: 0;
left: 50%;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 12px 16px 0px 16px;
border-top-color: #fff;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.flex-toggle-block .row-element:last-child > div:last-child {
margin-bottom: 0;
}
.flex-toggle-block .inline-elm-3 {
margin-top: 20px;
margin-bottom: 0;
}
.flex-col-panel .tmn-wallet-icon {
vertical-align: middle;
}
.flex-row-panel .toggle-radio:checked ~ .flex-toggle-block-wrap,
.flex-col-panel.actived ~ .flex-toggle-block-wrap {
max-height: 1000px;
}
.flex-col-panel.actived .radiobox-wrap .circle-checked {
opacity: 1;
filter: alpha(opacity=100);
background-color: #EE3124;
-webkit-transform: scale(1);
transform: scale(1);
}
.flex-row-panel .toggle-radio {
position: absolute;
left: 0;
top: 0;
margin: 0;
outline: none;
opacity: 1;
}
.flex-row-panel .custom-remove-btn {
position: absolute;
right: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.heading-label {
position: relative;
font-family: 'TrueBold';
font-size: 22px;
font-size: 6.875vw;
line-height: 0.85em;
}
.floating-icon {
position: absolute;
right: 0;
top: 0;
}
.logo-wrap {
position: relative;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
vertical-align: middle;
min-width: 42px;
min-height: 27px;
padding: 3px;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 4px;
text-align: center;
margin-right: 4px;
margin-left: 3px;
}
.truecard-icon {
position: relative;
display: block;
width: 70px;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
}
.truecard-icon img {
display: block;
width: 100%;
border-radius: 5px;
}
.img-box-4 .edge-bg-img {
z-index: 1;
pointer-events: none;
}
.img-slider-list-block, .img-slider-list-item,
.slider-thumb {
position: relative;
}
.slider-thumb {
display: block;
width: 100%;
}
.fiveg-ready-icon {
display: block;
width: 50px;
height: 50px;
background-image: url('../images/icons/5G-ready-icon.png');
background-repeat: no-repeat;
background-size: 100% auto;
}
.box-list-column .fiveg-ready-icon {
pointer-events: none;
position: absolute;
right: 2px;
top: -15px;
}
.box-content-4.-hiddencurve {
margin-bottom: 0;
}
.box-content-4.-hiddencurve + .box-content.box-style {
margin-top: 0;
}
.box-content-4.-hiddencurve + .box-content.box-style .box-main-inner {
padding-top: 15px;
}
.box-content-4.-hiddencurve .box-ctn-inner:after,
.box-content-4.-hiddencurve:after,
.box-content-4.-hiddencurve .edge-bg-img {
display: none;
}
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .box-ctn-inner,
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .slide-box-med,
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .slide-med-size,
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .slide-med-size,
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .slide-med-size img,
.box-content-4.-hiddencurve .box-ctn-rotate.-fixcurve .owl-item.active .img-slider-list-item img,
.box-content-4.-hiddencurve .img-box-4 {
border-radius: 0;
}
.box-content-4.-hiddencurve .slide-med-size .owl-dots {
bottom: 5px;
}
.desktop .md-prg-box .mb-prg {
display: none;
}
.mobile .md-prg-box .desktop-prg {
display: none;
}
.info-list .info-collapse-box {
width: 100%;
margin-left: auto;
margin-right: auto;
}
.info-collapse-box {
position: relative;
margin-top: 0.5em;
}
.info-collapse-inner {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
.info-collapse-title {
font-family: 'TrueBold';
font-weight: normal;
font-size: 1em;
line-height: 0.85em;
}
.info-collapse-title.-spacingbottom {
margin-bottom: 0.5em;
}
.info-collapse-title-2 {
font-family: 'TrueMedium';
font-weight: normal;
font-size: 0.9em;
line-height: 0.85em;
margin-bottom: 0.5em;
}
.info-collapse-title-2.-spacingtop {
margin-top: 1em;
}
.info-collapse-head {
cursor: pointer;
position: relative;
padding: 0.25em 0.75em;
}
.info-collapse-head .arw-orange-sm-right {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%) scale(0.8);
transform: translateY(-50%) scale(0.8);
}
.info-collapse-box.actived .info-collapse-head .arw-orange-sm-right {
-webkit-transform: translateY(-50%) scale(0.8) rotate(90deg);
transform: translateY(-50%) scale(0.8) rotate(90deg);
}
.info-collapse-content {
max-height: 0;
overflow: hidden;
}
.info-collapse-box.actived .info-collapse-content {
max-height: none;
overflow: visible;
}
.packages-list {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.packages-block {
position: relative;
font-size: 6.25vw;
width: 66.875vw;
margin-left: auto;
margin-right: auto;
}
.packages-list .owl-stage {
text-align: center;
margin-left: auto;
margin-right: auto;
}
.packages-list .owl-item {
padding-top: 5px;
padding-bottom: 5px;
}
.packages-list .owl-dots {
position: relative;
bottom: auto;
margin-top: 20px;
}
.packages-list .owl-next {
right: 0;
}
.packages-list .owl-prev {
left: 0;
}
.packages-block.-shadow {
box-shadow: 0 0 6px rgb(0 0 0 / 20%);
}
.packages-header {
position: relative;
background-color: #f05622;
background-image: url('../images/bg/head-package.jpg');
background-size: cover;
background-position: 0 0;
padding-left: 10px;
padding-right: 10px;
color: #fff;
text-align: center;
min-height: 11.875vw;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.packages-header-txt {
position: relative;
font-family: 'TrueBold';
font-size: 1em;
line-height: 0.85em;
text-shadow: 0px 1px 1px rgb(0 0 0 / 50%);
z-index: 1;
}
.packages-rows {
font-size: 1em;
position: relative;
background-color: #fff;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.packages-rows.-gray {
background-color: #e8e8e8;
}
.packages-rows.-yellow {
color: #fff;
background-color: #f9b72f;
border-bottom: 1px solid #fff;
}
.packages-rows.-bottomline {
border-bottom: 1px solid #ddd;
}
.packages-rows.-orange {
color: #fff;
background-color: #ff5925;
border-bottom: 1px solid #fff;
}
.packages-columns-item.-yellow {
color: #fff;
background-color: #f9b72f;
}
.packages-columns-item.-red {
color: #fff;
background-color: #ee3124;
}
.packages-columns-item .packages-label.-small {
min-width: 100%;
}
.packages-rows.-bottomarrow:after {
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
bottom: -0.35em;
border-style: solid;
border-color: transparent;
border-width: 0.4em 0.4em 0 0.4em;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 2;
}
.packages-rows.-gray.-bottomarrow:after {
border-top-color: #e8e8e8;
}
.packages-rows.-spacing {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
.packages-label {
font-family: 'TrueMedium';
font-size: 1em;
line-height: 0.85em;
}
.packages-label.-small {
font-size: 0.75em;
}
.packages-rows .packages-label .price-label {
margin-top: 3px;
display: inline-block;
vertical-align: baseline;
}
.packages-rows .packages-label + .packages-label {
margin-top: 2px;
}
.packages-label.-bold {
font-family: 'TrueBold';
}
.price-label {
position: relative;
font-family: 'TrueBoldSpecial';
font-size: 2.5em;
line-height: 0.5em;
z-index: 1;
}
.packages-ribbon {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #f27d22;
font-family: 'TrueMedium';
padding-left: 6px;
padding-right: 6px;
min-width: 3.5em;
box-sizing: border-box;
margin-bottom: 0.5em;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.packages-ribbon:before,
.packages-ribbon:after {
content: "";
display: block;
position: absolute;
width: 1em;
height: 100%;
top: 0;
background-color: #f27d22;
}
.packages-ribbon:before {
left: -0.5em;
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
}
.packages-ribbon:after {
right: -0.5em;
-webkit-transform: skewX(-20deg);
transform: skewX(-20deg);
}
.packages-ribbon + .packages-label {
margin-top: 1em;
}
.packages-rows .white-mobile-icon {
position: absolute;
left: 0.75em;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.packages-rows .white-mobile-icon ~ .packages-label {
width: 67%;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.packages-columns-wrap {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.packages-columns-wrap.-full {
min-width: 100%;
box-sizing: border-box;
}
.packages-columns-wrap.-line:after {
content: "";
display: block;
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 90%;
background-color: #ccc;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.packages-columns-item {
position: relative;
font-family: 'TrueBold';
font-size: 1em;
line-height: 0.85em;
text-align: center;
width: 50%;
min-height: 1.5em;
box-sizing: border-box;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.packages-columns-item:first-child:last-child {
width: 100%;
}
.packages-label + .packages-columns-wrap {
margin-top: 0.5em;
}
.packs-txt {
font-family: 'TrueBold';
}
.packs-txt.-highlight {
color: #f5911d;
}
.packs-txt.-underline {
text-decoration: underline;
}
.packs-txt.-spaceleft {
margin-left: 5px;
}
.packs-txt + .packages-label.-small {
min-width: 100%;
margin-top: 5px;
}
.custom-combobox {
position: relative;
}
.custom-combobox .accd-arrow {
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.pointer-cursor {
cursor: pointer;
}
.promo-code-block {
position: relative;
width: 100%;
max-width: 360px;
padding: 25px 15px;
box-sizing: border-box;
border-radius: 14px;
margin-top: 25px;
margin-bottom: 50px;
text-align: center;
margin-left: auto;
margin-right: auto;
background-color: #eee;
border-radius: 10px;
}
.fix-label {
display: block;
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.85em;
}
.fix-label.-bold {
font-family: 'TrueBold';
}
.fix-label.-med {
font-size: 24px;
}
.fix-label.-large {
font-size: 30px;
}
.fix-label.-spacebottom {
margin-bottom: 10px;
}
.code-block {
position: relative;
padding: 5px 15px;
background-color: #fff;
margin-bottom: 20px;
}
.flex-conntent {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.fix-text {
font-family: 'TrueBold';
font-size: 24px;
line-height: 0.85em;
}
.fix-text.-small {
font-size: 18px;
}
.copy-txt {
position: relative;
cursor: pointer;
padding: 10px;
}
.code-block .copy-txt {
right: -10px;
}
.btn-txt-area {
padding: 5px;
}
.remark-text-block {
position: relative;
width: 90%;
font-family: 'TrueMedium';
font-size: 22px;
line-height: 1em;
padding: 15px;
box-sizing: border-box;
background-color: #eee;
border-radius: 10px;
margin: 15px auto 0;
}
.remark-text-block strong {
font-family: 'TrueBold';
font-weight: normal;
}
.remark-text-block .show-on-large {
display: none;
}
.med-box-ctn .remark-text-block {
margin-top: 0;
margin-bottom: 25px;
}
.remark-desc {
display: block;
position: relative;
font-family: 'TrueMedium';
font-size: 4.375vw;
line-height: 0.95em;
}
.group-txt .remark-desc {
margin-top: 10px;
}
.free-txt-custom-icon {
position: relative;
text-align: left;
color: #000;
margin-bottom: 20px;
}
.free-txt-title-sm {
display: block;
font-size: 22px;
margin-bottom: 12px;
}
.free-txt-title-large {
display: flex;
font-family: 'TrueBoldSpecial';
font-weight: normal;
font-size: 100px;
align-items: baseline;
}
.free-txt-title-large .free-txt-title-med {
font-size: 0.75em;
}
@media print {
.mb-nav-box, .main-sec, footer, .md-overlay {
display: none;
}
.print-box {
display: block;
}
}
@media screen and (max-width: 999px) {
.top-menu > li .arw-red-down {
-webkit-filter: grayscale(1);
filter: grayscale(1);
margin-left: 0;
}
.top-menu > .has-submenu.selected .arw-red-down {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
}
@media screen and (max-width: 479px) {
.fixedonsmall .pack-btn-item.-flexi {
width: 81%;
margin-left: auto;
margin-right: auto;
}
.bottom .fixedonsmall {
-webkit-transform: translateY(180%);
transform: translateY(180%);
}
.bottom .main-sec ~ .fixedonsmall {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
.has-validate-elm.actived .validate-msg ~ .combobox-list-wrap {
margin-top: -16px;
}
.floating-btn-box {
position: fixed;
left: 0;
right: 0;
bottom: 0;
padding: 10px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
z-index: 7;
-webkit-transition: -webkit-transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.floating-btn-box > .flex-btn-xcmn-3 {
min-width: 45vw;
}
.bottom .floating-btn-box {
-webkit-transform: translateY(200%);
transform: translateY(200%);
}
}
@media screen and (max-width: 559px) {
.abs-btm-box {
bottom: 48px;
}
.abs-btm-box.-fix {
bottom: 16px;
}
}
@media screen and (max-width: 899px) {
.table-list-col:nth-child(2n) {
width: 75%;
}
.table-list-col:nth-child(2n + 3) {
width: 25%;
}
.collapse-expand-block:not(.actived) .floating-input-block {
pointer-events: none;
width: 27%;
position: absolute;
right: 12.333%;
top: 0;
margin-top: 15px;
margin-bottom: 0;
}
.collapse-expand-block:not(.actived) .floating-input-block {
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.collapse-expand-block:not(.actived) .floating-input-block .square-input-box {
width: auto;
float: none;
}
.collapse-expand-block:not(.actived) .floating-input-block .square-input:placeholder-shown {
display: none;
}
.collapse-expand-block:not(.actived) .floating-input-block .square-input {
pointer-events: none;
color: #ee3124;
border: none;
background-color: transparent;
font-size: 9.375vw;
}
.collapse-expand-block:not(.actived) .floating-input-block .inline-label,
.collapse-expand-block:not(.actived) .hidden-toggle-elm {
display: none;
}
.multiple-col-block.-fix .col-item {
width: 100%;
box-sizing: border-box;
padding-left: 42%;
padding-top: 1.5em;
padding-bottom: 1.5em;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.multiple-col-block.-fix .col-item:nth-child(1):before {
display: none;
}
.multiple-col-block.-fix .col-item:nth-child(2):before {
bottom: auto;
}
.multiple-col-block.-fix .col-item + .col-item:before {
content: "";
display: block;
position: absolute;
height: 1px;
left: 12px;
right: 12px;
background-color: #ccc;
top: 0;
bottom: auto;
}
.multiple-col-block.-fix .chat-bubble-icon,
.multiple-col-block.-fix .staff-icon,
.multiple-col-block.-fix .on-web-icon,
.multiple-col-block.-fix .trueshop-icon {
position: absolute;
left: 4%;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.multiple-col-block.-fix .med-label.-absolute {
top: 8%;
left: 42%;
-webkit-transform: none;
transform: none;
}
.multiple-col-block.-fix .col-title {
margin-top: 0;
text-align: left;
}
.multiple-col-block.-fix .col-item:nth-child(2n):after {
display: none;
}
.multiple-col-block.-fix .col-item:nth-child(3) .col-title,
.multiple-col-block.-fix .col-item:nth-child(4) .col-title {
min-height: unset;
}
.multiple-col-block.-fix .med-label.-absolute ~ .col-item-inner {
padding-top: 12%;
}
.multiple-col-block.-fix .col-item strong {
margin-bottom: 0.5em;
}
.col-item-inner {
position: relative;
width: 100%;
}
}
@media screen and (max-width: 1000px) {
.top-menu-cart,
.top-menu-cart + .has-submenu > a:before {
display: none;
}
}
@media screen and (min-width : 375px) {
.footer-styling .copyright br {
display: none;
}
.footer-styling .ft-hpl-txt {
display: block;
}
.md-med-row .md-split-col > div:first-child {
margin-right: 5px;
}
.sm-banner > li > a {
padding-top: 10px;
}
.sm-banner > li h3 {
margin-bottom: 5px;
}
.md-mari-pop-2 {
width: 350px;
}
.cmn-bubble {
right: 58px;
}
.flex-block-rows.-head .flex-block-cols,
.flex-block-rows .flex-block-cols {
padding-left: 10px;
padding-right: 10px;
}
.flex-block-cols, .text-item {
font-size: 20px;
}
.footer-bar-sm {
font-size: 22px;
}
}
@media screen and (min-width : 414px) {
.bubble-txt-2 .tgl-br {
display: inline;
}
.md-mari-pop-2 {
width: 386px;
}
.pop-header {
height: 201px;
}
.pop-header .mari-half {
left: -15px;
top: -38px;
width: 220px;
height: 192px;
}
.cmn-bubble {
top: 30px;
right: 30px;
width: 200px;
min-height: 20px;
}
.bubble-txt-2 {
padding-top: 20px;
padding-bottom: 20px;
}
.bubble-txt-2 strong {
font-size: 25px;
}
.abs-txt-1 {
bottom: 18px;
}
.flex-block-cols, .text-item {
font-size: 22px;
}
.sim-name {
font-size: 25px;
margin-bottom: 10px;
}
}
@media screen and (min-height : 660px) {
.md-modal.md-mari-size.md-show {
max-height: 100%;
overflow: visible;
}
.slc-tabs-item {
font-size: 22px;
}
}
@media screen and (min-width : 700px) and (min-height : 400px) {
.inline-block-list > li > div {
display: inline-block;
}
.box-acd-ctn-inner {
text-align: center;
}
.box-acd-ctn-inner {
font-size: 22px;
}
#smartphones-modal .ctn-tgl-box {
padding-bottom: 0;
}
.md-auto-scroll .ctn-tgl-box, .md-auto-scroll .box-acd-ctn-inner, .md-auto-scroll .md-content-wrap, .md-auto-scroll .modal-ajax,
.md-auto-scroll .ajax-container {
height: 100%;
}
.md-auto-scroll .content-inline > div {
margin-top: 0;
}
.logo-list > li {
margin-left: 18px;
margin-top: 15px;
}
.logo-list > li img {
width: 58px;
}
.logo-list-2 {
margin-top: 10px;
}
.logo-list-2 > li {
margin-right: 7px;
}
.logo-list-2 > li img {
width: 50px;
}
#trueshop-modal .box-acd-ctn-inner {
text-align: left;
}
}
@media screen and (min-width : 480px) {
.owl-carousel .owl-item .img-mb, .component li .img-mb, .box-wrap-left.double-shadow:before,
.box-wrap-right.double-shadow:after, .slogan-box .img-mb, .service-menu > li:first-child .first-line-text,
.cmn-tab-wrap h3, .fix-styling + .view-btn, .banner-info .img-mb, .box-banner-top .img-mb,
.acd-styling > .acd-head > .red-accd-arw, .prg-ctn-2 .tgl-br, .box-content-4 .img-mb,
.box-content-4 .box-ctn-inner:before, .box-content-4 .box-ctn-inner:after, .verify-text .tgl-br,
.box-6 .title-4 .arw-black-btm, .form-heading .tgl-br, .box-5 .tgl-br, .sm-banner .img-mb, .md-med-form-wrap > h3 .tgl-br,
.md-pic .md-img-box .img-mobile, .cmn-box-ctn-2 .title-5 .tgl-br, .title-txt-box > h3 > .tgl-br {
display: none;
}
.cmn-tab-wrap, .owl-carousel .owl-item .img-cmn-screen, .component li .img-cmn-screen, .cmn-tab-head-2 > li a,
.cmn-tab-head-2 > li a span, .slogan-box .img-cmn-screen, .user-box, .banner-info .img-cmn-screen,
.box-banner-top .img-cmn-screen, .user-pvl .gift-red-icon, .md-scrolling-3, .box-content-4 .img-cmn-screen,
.box-5 .tgl-br-2, .component .comp-img-slide li .img-cmn-screen, .hpl-link-box .tgl-br, .md-pic .md-img-box .img-cmn-screen {
display: block;
}
.first-line-text .tgl-txt, .middle-prg-ctn .tgl-br-1, .mari-box .msg-txt br {
display: inline;
}
.service-menu > li:first-child .sec-line-text, .sim-list, .sim-list > li, .cmn-desc-box .cmn-inline-label-2,
.box-7 .inline-label, .box-7 .sim-list {
display: inline-block;
}
.box-top-inner .view-btn {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.menu-txt, .user-log-box {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.square-button {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
/* --- SPRITE --- */
.true-id-logo {
width: 64px;
height: 20px;
}
.person-red-icon {
width: 20px;
height: 19px;
padding-bottom: 0;
}
.heart-icon {
max-width: 20px;
height: 17px;
padding-bottom: 0;
}
.iservice-icon {
max-width: 22px;
height: 21px;
padding-bottom: 0;
}
.mb-icon-2 {
width: 18.75vw;
height: 17.91666666666667vw;
}
.mb-pack-icon, .mb-code-icon {
width: 19.375vw;
height: 17.91666666666667vw;
}
.tmh-sim-icon {
width: 15.41666666666667vw;
height: 17.91666666666667vw;
}
.deliver-sim-icon {
width: 28.125vw;
height: 17.91666666666667vw;
}
.doc-yel-icon {
width: 2.916666666666667vw;
height: 3.75vw;
}
.visa-logo {
width: 32px;
height: 10px;
width: 6.666666666666667vw;
height: 2.083333333333333vw;
}
.mastercard-cmn-logo {
width: 30px;
height: 18px;
width: 6.25vw;
height: 3.75vw;
}
.mastercard-logo {
width: 45px;
height: 16px;
width: 9.375vw;
height: 3.333333333333333vw;
}
.vrf-visa-logo {
width: 38px;
height: 22px;
width: 7.916666666666667vw;
height: 4.583333333333333vw;
}
.apple-logo, .android-logo {
width: 4.166666666666667vw;
height: 5vw;
}
.print-icon {
width: 4.583333333333333vw;
height: 4.583333333333333vw;
}
.bubble-small-icon {
width: 5.625vw;
height: 4.583333333333333vw;
}
.mb-sim-icon {
width: 18.75vw;
height: 17.91666666666667vw;
}
.mb-right-icon {
width: 14.79166666666667vw;
height: 17.91666666666667vw;
}
.mb-thmap-icon {
width: 12.91666666666667vw;
height: 17.91666666666667vw;
}
.mb-gbmap-icon {
width: 15.625vw;
height: 17.91666666666667vw;
}
.mb-sms-icon {
width: 15.20833333333333vw;
height: 17.91666666666667vw;
}
.mb-wifi-icon {
width: 14.58333333333333vw;
height: 17.91666666666667vw;
}
.mb-map-icon {
width: 17.08333333333333vw;
height: 18.95833333333333vw;
}
.mb-abroad-icon {
width: 13.75vw;
height: 17.91666666666667vw;
}
.mb-dial-icon {
width: 15.20833333333333vw;
height: 17.91666666666667vw;
}
.numpad-icon {
width: 12.5vw;
height: 17.91666666666667vw;
}
.shop-icon {
width: 19.16666666666667vw;
height: 15.625vw;
}
.usd-bank-icon, .credit-card-icon {
width: 16.66666666666667vw;
height: 12.5vw;
}
.scissors-icon {
width: 25.625vw;
height: 18.95833333333333vw;
}
.signal-icon {
width: 16.66666666666667vw;
height: 18.95833333333333vw;
}
.phone-sm-icon {
width: 4.375vw;
height: 4.166666666666667vw;
}
.phone-md-icon {
width: 5.833333333333333vw;
height: 5.416666666666667vw;
}
.phone-large-icon {
width: 26px;
height: 24px;
width: 5.416666666666667vw;
height: 5vw;
}
.viber-app-icon {
width: 8.333333333333333vw;
height: 8.333333333333333vw;
}
.htv-app-icon {
width: 18.75vw;
height: 18.75vw;
}
.plus-white-icon {
width: 4.166666666666667vw;
height: 4.166666666666667vw;
}
.tel-red-icon {
width: 2.5vw;
height: 2.5vw;
}
.phone-gray-icon {
width: 4.583333333333333vw;
height: 4.166666666666667vw;
}
.comp-white-icon {
width: 5.416666666666667vw;
height: 6.25vw;
}
.comp-sm {
height: 4.583333333333333vw;
}
.tv-white-icon {
width: 5vw;
height: 4.583333333333333vw;
}
.white-4g-txt, .white-3g-txt {
height: 2.916666666666667vw;
}
.white-4g-txt {
width: 9.166666666666667vw;
}
.white-3g-txt {
width: 5vw;
}
.black-4g-txt {
width: 5.833333333333333vw;
height: 3.333333333333333vw;
}
.info-white-icon {
width: 4.166666666666667vw;
height: 4.166666666666667vw;
}
.gray-mobile-icon, .white-mobile-icon {
width: 4.583333333333333vw;
height: 6.25vw;
}
.two-mobile-icon {
width: 5.625vw;
height: 6.25vw;
}
.orange-4g-icon, .yellow-4g-icon, .gray-4g-icon {
width: 54px;
height: 30px;
width: 11.25vw;
height: 6.25vw;
}
.orange-4g-5g-icon, .yellow-4g-5g-icon, .gray-4g-5g-icon {
width: 5.8333vw;
height: 4.58333vw;
}
.orange-5g-icon, .yellow-5g-icon, .gray-5g-icon {
width: 12.5vw;
height: 5.625vw;
}
.white-3g-icon, .yellow-3g-icon {
width: 27px;
height: 17px;
width: 5.625vw;
height: 3.541666666666667vw;
}
.white-money-icon, .gray-money-icon {
width: 4.583333333333333vw;
height: 4.583333333333333vw;
}
.circle-checked-icon, .info-yellow-icon {
width: 7.5vw;
height: 7.5vw;
}
.green-checked-icon {
width: 2.5vw;
height: 2.083333333333333vw;
}
.info-red-icon {
width: 3.125vw;
height: 3.125vw;
}
.topup-tab-icon, .topup-tab-th-icon {
width: 107px;
height: 40px;
width: 22.29166666666667vw;
height: 8.333333333333333vw;
}
.topup-tab-icon {
background-size: 355.7312252964427% 4210.526315789474%;
background-position: 100% 22.50960307298335%;
}
.topup-tab-th-icon {
background-size: 517.2413793103449% 6250%;
background-position: 100% 81.91056910569105%;
}
.img-icons {
margin-top: 0.625vw;
}
.social-icon {
width: 4.583333333333333vw;
height: 4.583333333333333vw;
}
.arw-md, .arw-up-md-white, .arw-down-md-white {
width: 10px;
height: 4px;
width: 2.083333333333333vw;
height: 0.8333333333333333vw;
}
.arw-red-right {
width: 1.458333333333333vw;
height: 2.5vw;
}
.arw-white-right {
width: 14px;
height: 27px;
width: 2.916666666666667vw;
height: 5.625vw;
}
.arw-white-right-icon {
width: 1.875vw;
height: 3.125vw;
}
.arw-acd-white {
width: 2.5vw;
height: 1.25vw;
}
.arw-orange-right {
width: 2.083333333333333vw;
height: 3.541666666666667vw;
}
.arw-orange-sm-right {
width: 1.458333333333333vw;
height: 2.916666666666667vw;
}
.arw-gray-sm-right {
width: 1.25vw;
height: 2.291666666666667vw;
}
.arw-white-sm-right-3 {
width: 1.041666666666667vw;
height: 2.083333333333333vw;
margin-left: 1.041666666666667vw;
}
.arw-black-right, .arw-black-btm {
width: 1.458333333333333vw;
height: 3.125vw;
}
.number-one-icon {
width: 37px;
height: 24px;
width: 7.708333333333333vw;
height: 5vw;
}
.number-one-th-icon {
width: 25px;
height: 24px;
width: 5.208333333333333vw;
height: 5vw;
}
.music-icon {
width: 3.541666666666667vw;
height: 3.958333333333333vw;
}
.vdo-icon {
width: 3.75vw;
height: 4.375vw;
}
.thumbsup-icon {
width: 3.75vw;
height: 3.75vw;
}
.joystick-icon {
width: 5.625vw;
height: 3.75vw;
}
.pins-icon {
width: 4.375vw;
height: 4.166666666666667vw;
}
.wifi-med-icon {
width: 4.791666666666667vw;
height: 3.75vw;
}
.speed-icon {
width: 4.583333333333333vw;
height: 4.166666666666667vw;
}
.auto-login-icon {
width: 3.75vw;
height: 4.375vw;
}
.gray-wifi-icon, .white-wifi-icon {
width: 5.833333333333333vw;
height: 4.166666666666667vw;
}
.vo-wifi-icon {
width: 5.208333333333333vw;
height: 5.208333333333333vw;
}
.trueu-bg {
width: 62.5%;
margin-top: -20.83333333333333%;
padding-bottom: 54.58333333333333%;
}
.calendar-icon, .clock-icon {
width: 4.166666666666667vw;
height: 4.166666666666667vw;
}
.arw-white-down {
width: 2.916666666666667vw;
height: 2.083333333333333vw;
}
/*.img-icons .tvs-img {
width: 14.16666666666667vw;
}*/
.img-icons .tvs-img {
max-height: 5vw;
}
.img-icons.def-icon .tvs-img {
max-height: 5vw;
}
/* --- INLINE-BLOCK --- */
.inline-elm-6 > * {
margin-left: 1.041666666666667vw;
}
.inline-list-icon {
margin-top: 1.041666666666667vw;
}
.inline-elm-5 > .cmn-inline-label + div .cmn-txt-label-btm {
margin-top: 1.111111111111111%;
}
/* --- TEXT STYLE --- */
.tmed-xcmn-size, .tbold-large-size-3 {
font-size: 4.791666666666667vw;
}
.tbold-large-size {
font-size: 4.583333333333333vw;
}
.tbold-xlarge-size-2 {
font-size: 6.25vw;
}
.tbold-exlarge-special {
font-size: 130px;
}
.tmed-large-size {
font-size: 30px;
}
.heading-two-line {
font-size: 7.5vw;
margin-bottom: 3.448275862068966%;
}
.heading-txt-4 {
font-size: 8.333333333333333vw;
margin-bottom: 5.208333333333333%;
}
.sec-line-txt {
font-size: 5vw;
}
.common-txt-2 {
font-size: 6.666666666666667vw;
}
.cmn-txt-label-xs-2 {
font-size: 2.916666666666667vw;
}
.sec-line-txt-xs {
font-size: 2.916666666666667vw;
}
.hpl-link-box {
font-size: 3.541666666666667vw;
margin-top: 6.25vw;
}
.prg-ctn-3 {
font-size: 4.583333333333333vw;
}
.sm-label-left {
font-size: 4.166666666666667vw;
}
.sm-label {
font-size: 4.166666666666667vw;
}
.cmn-label, .cmn-label-left, .cmn-label-right {
font-size: 4.3vw;
}
.cmn-flex-label {
font-size: 24px;
font-size: 5vw;
line-height: 0.75em;
}
.cmn-txt-label, .cmn-txt-label-btm {
font-size: 17px;
font-size: 3.541666666666667vw;
}
.cmn-inline-label,
.cmn-top-label {
font-size: 5vw;
}
.cmn-inline-label-2 {
font-size: 4.166666666666667vw;
}
.inner-label {
font-size: 4.166666666666667vw;
margin-top: 0.625vw;
}
.inline-label {
font-size: 4.583333333333333vw;
}
.md-modal .cmn-txt-label-sm, .cmn-txt-label-sm-btm {
font-size: 16px;
line-height: 0.875em;
margin-top: 5px;
}
.md-med-form-wrap > h6 {
font-size: 22px;
}
.md-prg-box .tbold-exlarge-special {
margin-top: 10px;
margin-bottom: 15px;
}
.md-pic .md-img-box .img-cmn-screen {
width: 90%;
}
.md-pic .md-img-box .md-close-btn {
right: 4.888888888888889%;
}
.inline-label-2, .common-txt {
font-size: 4.791666666666667vw;
}
.tboldsp-xlarge-size {
font-size: 5vw;
}
.tmed-md-size {
font-size: 23px;
font-size: 4.5vw;
line-height: 0.8695652173913043em;
}
.title-8 {
font-size: 6.666666666666667vw;
margin-bottom: 4.444444444444444%;
}
.heading-title {
font-size: 4.583333333333333vw;
padding: 1.111111111111111% 2.222222222222222%;
}
.cmn-txt-size {
font-size: 5vw;
}
.med-txt-size {
font-size: 8.333333333333333vw;
}
.small-txt-size {
font-size: 4.166666666666667vw;
}
/* --- ARROWS --- */
.ar-triangle {
border-width: 6px 7px 0 7px;
border-width: 1.25vw 1.458333333333333vw 0 1.458333333333333vw;
}
.white-triangle:after {
border-width: 2.083333333333333vw 2.291666666666667vw 0;
}
.accd-arrow {
width: 3.125vw;
height: 1.458333333333333vw;
}
.two-way-arw-white {
width: 6px;
height: 12px;
width: 1.25vw;
height: 2.5vw;
background-size: 6428.571428571429% 13333.33333333333%;
background-position: 16.93002257336343% 11.51133501259446%;
}
.two-way-arw-sm-black {
width: 2.5vw;
height: 1.25vw;
}
.arw-down-elm:after {
border-width: 1.25vw 1.25vw 0;
}
/* --- CHECKBOX --- */
.checkbox-sm {
width: 3.125vw;
height: 3.125vw;
}
.checked-white-icon, .checked-grey-icon {
width: 2.5vw;
height: 1.875vw;
}
.checkbox-sm .checked-icon {
width: 2.083333333333333vw;
height: 1.666666666666667vw;
}
/* --- SELECT MENU --- */
.select-menu {
height: 6.25vw;
padding-left: 2.083333333333333vw;
padding-right: 6.25vw;
}
.slc-short {
width: 92px;
}
.slcm-txt {
font-size: 4.166666666666667vw;
}
.slcmn-style, .sq-select {
height: 7.291666666666667vw;
}
.slcmn-style {
padding-left: 2.083333333333333vw;
padding-right: 6.875vw;
}
.slc-arw-box {
width: 6.875vw;
}
.slcmn-style .slcm-txt {
font-size: 4.375vw;
}
.slc-with-label {
height: 34px;
padding-left: 0;
}
/* --- INPUTS --- */
.cmn-input {
font-size: 4.375vw;
height: 6.25vw;
}
.input-medium, .input-xlong {
height: 7.291666666666667vw;
}
.sq-input {
width: 34px;
height: 34px;
font-size: 23px;
}
.input-xmedium-2 {
height: 7.291666666666667vw;
}
.input-xmedium-3 {
min-width: 260px;
min-width: 54.16666666666667vw;
height: 6.25vw;
}
.input-small {
width: 31.25vw;
height: 5.416666666666667vw;
font-size: 3.75vw;
}
/* --- BUTTONS --- */
.cmn-button, .square-button, .button-xsm-2 {
height: 6.25vw;
}
.flex-btn-fix {
height: 38px;
}
.cmn-button, .button-xsm-2 {
width: 13.33333333333333vw;
}
.button-xsm-2.-flexible {
min-width: 16vw;
width: auto;
}
.dash-button {
padding: 1.458333333333333vw 2.083333333333333vw;
}
.btn-txt {
font-size: 4.166666666666667vw;
}
.button-xs {
width: auto;
min-width: 16.66666666666667vw;
height: 5vw;
}
.button-xmd {
width: 132px;
height: 28px;
width: 27.5vw;
height: 5.833333333333333vw;
}
.button-xmd .button-txt {
font-size: 20px;
font-size: 4.166666666666667vw;
}
.button-flex {
min-width: 18.75vw;
width: auto;
height: 6.25vw;
}
.flex-btn-sm {
height: 5.833333333333333vw;
}
.flex-btn-long {
height: 7.291666666666667vw;
}
.flex-btn-sm-fix, .flex-btn-med-fix {
min-width: 14.58333333333333%;
height: 7.291666666666667vw;
}
.flex-btn-med-fix {
width: 33.33333333333333vw;
}
.flex-btn-sm-fix {
width: 16.66666666666667vw;
}
.button-txt, .square-button .button-txt {
font-size: 4.166666666666667vw;
}
.sq-btn-med .button-txt {
font-size: 14px;
font-size: 2.916666666666667vw;
}
.button-flex .button-txt {
font-size: 4.375vw;
}
.flex-btn-sm .button-txt {
font-size: 3.75vw;
}
.btn-float {
margin-top: 3.409090909090909%;
}
.btn-float .ui-btn-style {
margin-left: 2.5%;
}
.square-button {
width: auto;
}
.sq-btn-med {
width: auto;
min-width: 60px;
min-width: 12.5vw;
height: 24px;
height: 5vw;
}
.sq-btn-flex {
height: 4.166666666666667vw;
}
.sq-btn-flex.long {
min-width: 27.08333333333333vw;
}
.sq-btn-sm {
height: 3.75vw;
}
.button-txt-sm {
font-size: 3.541666666666667vw;
}
.button-txt-xs {
font-size: 3.125vw;
}
.btn-inline .img-btn {
width: 26.66666666666667%;
margin-left: 1.111111111111111%;
}
.nm-btn > span, .md-btn > span {
font-size: 17px;
font-size: 3.541666666666667vw;
}
.nm-btn {
width: 24.58333333333333vw;
height: 22px;
height: 4.583333333333333vw;
}
.list-style4 .nm-btn {
width: 25vw;
}
.md-btn {
height: 24px;
height: 5vw;
}
.view-btn {
left: 2.083333333333333%;
margin-bottom: 12.29166666666667%;
}
.nm-btn.flex-button {
min-width: 14.58333333333333vw;
height: 4.166666666666667vw;
margin-left: 0.4166666666666667vw;
}
.loading-btn {
min-width: 0;
}
.box-top-inner .view-btn {
position: absolute;
left: auto;
right: 0;
margin-right: 4.166666666666667%;
margin-bottom: 2.083333333333333%;
}
.main-content .box-content.box-style:first-child .box-top-inner .view-btn, .box-inner-style .view-btn {
right: 0;
margin-right: 4.166666666666667%;
}
.main-content .box-content.box-style:first-child .box-top-inner .view-btn {
top: 50%;
margin-bottom: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
/* --- CONTENT --- */
.med-tab-holder {
height: 26.25vw;
padding-bottom: 8px;
}
.box-wrap {
padding-bottom: 0;
height: 141px;
}
.service-menu-wrap {
background-size: 176.056338028169% 1257.861635220126%;
background-position: 0 92.20532319391635%;
}
.service-menu > li {
position: relative;
float: none;
width: 100%;
height: 47px;
}
.service-menu > li > a {
width: 100%;
}
.service-menu > li > a:before {
content: "";
display: block;
position: absolute;
left: 50%;
top: 0;
width: 120%;
height: 120%;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) inset;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.service-menu > li:first-child .sec-line-text {
font-family: 'TrueBold';
color: #555;
width: auto;
margin: 0;
margin-left: 34px;
}
.first-line-text, .service-menu > li:first-child .sec-line-text, .service-menu > li:last-child .first-line-text {
font-size: 23px;
}
.first-line-text {
margin-bottom: -14px;
}
/*.first-line-text .tgl-txt {
margin-left: 8px;
}*/
.first-line-text, .sec-line-text {
margin-left: 34px;
}
.menu-txt, .user-log-box {
position: relative;
text-align: left;
height: 100%;
margin-left: 20px;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.menu-txt .sprite-icons, .user-thumb {
position: absolute;
left: 0;
top: 50%;
margin: 0;
}
.menu-txt .person-red-icon, .menu-txt .iservice-icon {
margin-top: -10px;
}
.menu-txt .heart-icon {
margin-top: -9px;
}
.menu-txt .sec-line-text {
position: static;
font-size: 21px;
color: #777;
margin-bottom: 0;
}
.user-thumb {
left: -5px;
width: 28px;
height: 28px;
margin-top: -15px;
margin-bottom: 0;
border-width: 2px;
}
.user-name {
font-size: 25px;
min-height: 1px;
margin-top: -5px;
}
.user-info {
margin-left: 34px;
}
.user-info > span {
font-size: 21px;
margin-top: 0;
}
.user-pvl {
width: 40px;
height: 40px;
top: 50%;
right: 0;
margin-top: -16px;
}
.user-pvl .noti-mini {
top: 50%;
left: 50%;
width: 20px;
height: 20px;
margin-top: -10px;
margin-left: -9px;
border-color: #c6c6c6;
}
.desktop .user-pvl .noti-mini {
margin-top: -11px;
margin-left: -10px;
}
.main-bg-right {
width: 23.72262773722628%;
right: 18.85644768856448%;
padding-bottom: 28.71046228710462%;
background-size: 424.6284501061571% 700.5253940455342%;
background-position: 75.21255722694572% 71.30358705161855%;
}
.main-sec {
min-height: 235px;
min-height: 48.95833333333333vw;
overflow: hidden;
}
.banner-box, .sm-banner-box {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.banner-box {
position: relative;
top: 0;
width: 171.25%;
}
.slogan-box {
top: 25px;
top: 16px;
right: 20.8029197080292%;
width: 15.20681265206813%;
padding-bottom: 13.86861313868613%;
margin-top: 2.91970802919708%;
}
.main-banner .owl-dots {
padding-right: 6.690997566909976%;
margin-bottom: 10.94890510948905%;
}
.sm-banner-box {
position: absolute;
width: 58.39416058394161%;
margin: 0 auto;
z-index: 6;
}
.sm-banner-box .owl-item .sm-banner, .sm-banner-box .owl-item:first-child li img,
.sm-banner-box .owl-item:first-child + .owl-item li:first-child img {
border-radius: 0;
}
.sm-banner {
width: 100%;
}
.sm-banner > li {
width: 73.95833333333333%;
font-size: 17px;
font-size: 3.541666666666667vw;
}
.sm-banner > li h3 {
font-size: 20px;
font-size: 4.166666666666667vw;
margin-bottom: 1.041666666666667vw;
}
.sm-banner > li:first-child {
width: 26.04166666666667%;
}
.sm-banner > li:first-child > a {
position: relative;
padding-bottom: 65.6%;
}
.sm-banner > li:first-child > a img {
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.sm-banner > li > a {
padding-top: 2.366863905325444%;
padding-bottom: 2.366863905325444%;
}
.sm-banner-box .owl-prev {
left: 2.083333333333333%;
}
.sm-banner-box .owl-next {
right: 2.083333333333333%;
}
.sm-banner-box .owl-item:first-child + .owl-item li:first-child + li > a {
padding-left: 9.302325581395349%;
}
.sm-banner-box .owl-prev, .sm-banner-box .owl-next {
width: 2.083333333333333%;
padding-bottom: 2.916666666666667%;
}
.two-col-inline {
display: block;
}
.two-col-inline > div {
display: inline-block;
width: 45%;
margin-left: 2%;
margin-top: 0;
text-align: center;
}
.two-col-inline > div:first-child {
margin-left: 0;
}
.two-col-inline > .tgl-target-elm {
display: none;
}
.two-col-inline > .tgl-target-elm.actived {
display: inline-block;
}
.form-flex .two-col-inline > div {
width: 100%;
margin-left: 0;
margin-top: 4.444444444444444%;
text-align: left;
}
.form-flex .two-col-inline > div:first-child {
margin-top: 0;
}
.inline-elm-5 > .cmn-inline-label + div {
width: 40%;
}
.box-top-cmn {
min-height: 10.56338028169014vw;
}
.box-top-head-2 {
padding-top: 4.166666666666667%;
}
.box-top-head-2 > h1 {
float: left;
margin-top: 0.625%;
margin-left: 10px;
margin-bottom: 0;
}
.box-top-head-2 .list-select-group {
float: right;
margin-top: 0;
margin-right: 10px;
margin-bottom: 10px;
z-index: 1;
}
.box-top-head-2 .list-select-group + h1 {
position: relative;
width: 38.75%;
margin-top: 1.458333333333333%;
text-align: left;
}
.box-top-head-2 .tab-head-styling {
margin-right: 10px;
padding-top: 0;
border-bottom: none;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
}
.box-top-head-2 .tab-head-styling.-fix {
min-width: 100%;
z-index: 2;
clear: both;
padding-top: 2.08333%;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.cmn-tab-head.-fix > li > span,
.cmn-tab-head.-fix > li > a {
font-size: 4.58333vw;
padding-top: 3px;
padding-bottom: 4px;
}
.cmn-tab-head.-fix > li {
min-width: 33.333vw;
}
.box-head-styling .list-select-group {
position: relative;
float: none;
display: block;
text-align: right;
margin-right: 12px;
margin-bottom: 3.125%;
}
.box-top-cmn h2, .box-top-inner h1, .box-top-inner h2, .box-ctn-mini h2, .tlight-large-size {
font-size: 5.833333333333333vw;
}
.box-top-cmn.border-btm-before h2, .box-top-inner h1, .box-top-inner h2 {
margin-top: 20px;
margin-top: 4.166666666666667vw;
}
.cmn-tab-head > li {
min-height: 6.338028169014085vw;
margin-left: 1.458333333333333vw;
}
.cmn-tab-head > li > span, .cmn-tab-head > li > a {
font-size: 4.225352112676056vw;
}
.cmn-tab-holder {
height: 45px;
height: 9.375vw;
}
.med-tab-holder-2 {
height: 110px;
height: 22.91666666666667vw;
}
.tab-head-styling.pull-left {
padding-left: 3.125vw;
-ms-flex-pack: flex-start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.abs-select {
position: absolute;
right: 2.083333333333333%;
top: 0;
width: 37.5%;
padding: 0;
margin-top: 1.875%;
background-color: transparent;
}
.abs-select .select-menu {
width: 100%;
height: 28px;
height: 5.833333333333333vw;
margin-left: auto;
margin-right: 0;
}
.abs-select .slcm-txt {
font-size: 18px;
font-size: 3.75vw;
}
.box-main-wrap .abs-select:first-child {
position: relative;
left: 0;
top: 0;
right: 0;
width: 100%;
min-height: 36px;
margin-top: 0;
padding-top: 9px;
background-color: #fff;
border-top: none;
border-bottom: 5px solid #666;
min-height: 7.5vw;
padding-top: 1.875vw;
}
.box-main-wrap .abs-select:first-child .select-menu {
width: 37.5%;
margin-left: auto;
margin-right: 2.083333333333333%;
}
.img-bg-box img {
width: 154.1666666666667%;
}
.img-box-2 img {
width: 166.6666666666667%;
}
.box-inner {
min-height: 100px;
min-height: 20.83333333333333vw;
}
.box-top {
top: 35px;
height: 86px;
top: 7.291666666666667vw;
height: 17.91666666666667vw;
}
.box-top-inner {
min-height: 38px;
padding-top: 27px;
min-height: 7.916666666666667vw;
padding-top: 5.625vw;
}
.box-top-styling {
padding-top: 23px;
min-height: 42px;
padding-top: 4.791666666666667vw;
min-height: 8.75vw;
}
.box-style .box-top-styling h1, .box-style .box-top-styling h2 {
margin-top: 6px;
margin-top: 1.25vw;
}
.box-top-inner h1 span, .box-top-inner h2 span {
font-size: 3.958333333333333vw;
margin-top: 1.041666666666667vw;
}
.single-shadow:after, .double-shadow:before, .double-shadow:after {
width: 25%;
padding-bottom: 22.5%;
}
.single-shadow:after, .double-shadow:after {
margin-bottom: -1.458333333333333%;
}
.component-slide > .single-shadow:after, .component-slide > .double-shadow:after {
margin-bottom: 11.875%;
}
.double-shadow:before {
margin-top: -16.04166666666667%;
}
.box-content-3 .double-shadow:before, .box-content-4 .double-shadow:before {
margin-top: -1.041666666666667%;
}
.box-wrap-left.double-shadow:after, .box-wrap-right.double-shadow:before {
width: 50%;
padding-bottom: 45%;
}
.box-wrap-left.double-shadow:after {
margin-bottom: -5%;
}
.box-wrap-right.double-shadow:before {
margin-top: -5%;
}
.ovl-block {
margin-top: -9.583333333333333%;
}
.box-btm {
padding-bottom: 10.41666666666667%;
margin-bottom: 4.166666666666667%;
margin-top: -5%;
}
.box-main-2, .img-bg-box, .img-bg-box img, .img-bg-box .items-slides, .box-btm,
.img-bg-box .comp-img-slide .items-slides, .img-bg-box .comp-img-slide .items-slides img {
border-radius: 0 0 0 12.5vw;
}
.box-top-2, .bnr-box-ctn, .bnr-img-box, .bnr-img-box img {
border-top-right-radius: 12.5vw;
}
.bnr-box-ctn {
margin-top: -3.333333333333333%;
}
.bnr-img-box:after {
margin-top: -4.583333333333333%;
}
.box-top-2 {
padding-bottom: 12.5%;
}
.box-top-2:after {
left: -2.083333333333333%;
margin-top: 2.916666666666667%;
}
/*.img-bg-box .comp-img-slide .items-slides, .img-bg-box .comp-img-slide .items-slides img {
border-radius: 0;
}*/
.box-main-2 .edge-bg-img, .box-main-4 .edge-bg-img, .component-slide .items-slides .edge-bg-img {
bottom: -2px;
}
.box-main-2 {
min-height: 62.91666666666667vw;
}
.box-btm-2 {
padding-bottom: 16.66666666666667%;
margin-top: -3.125%;
margin-bottom: -12.5%;
}
.main-content .box-content.box-style:first-child .box-inner, .main-content .cmn-tab-head + .box-content.box-style .box-inner {
height: 46px;
min-height: 46px;
height: 9.583333333333333vw;
min-height: 9.583333333333333vw;
}
/*.main-content .box-content.box-style:first-child .box-top-inner .view-btn {
top: 50%;
margin-bottom: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}*/
.box-main-inner {
padding-bottom: 100px;
}
.box-style:first-child + .box-style-2 {
margin-top: -22.91666666666667%;
}
.box-style:first-child + .box-style-2.spc-btm {
margin-bottom: 0;
}
.box-style-2 + .bnr-box-ctn {
margin-top: -3.125%;
}
.fix-box-outer {
margin-top: -2.5%;
}
.fix-ajax-ctn-2 .box-main-outer {
margin-top: 4.166666666666667%;
}
.edge-bg-img {
width: 31.66666666666667%;
padding-bottom: 15.625%;
}
.edge-bg-img-2 {
width: 35.50295857988166%;
padding-bottom: 13.31360946745562%;
}
.cmn-tab-wrap {
position: absolute;
left: 0;
right: 0;
top: 0;
background-color: rgba(255, 255, 255, 0.5);
z-index: 5;
}
.cmn-tab-wrap.acd-box .cmn-tab-head-2 {
max-height: none;
}
.cmn-tab-head-2 {
font-family: 'TrueMedium';
font-size: 20px;
line-height: 0.5em;
font-size: 4.166666666666667vw;
text-align: right;
padding: 0;
}
.cmn-tab-head-2 > li {
display: inline-block;
margin-right: 4.166666666666667%;
}
.cmn-tab-head-2 > li a {
position: relative;
overflow: hidden;
color: #555;
padding-top: 11px;
padding-bottom: 11px;
padding-top: 2.083333333333333vw;
padding-bottom: 2.083333333333333vw;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.cmn-tab-head-2 > li a:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 7px;
bottom: 1.458333333333333vw;
width: 100%;
height: 1px;
background-color: #ee3124;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
.desktop .cmn-tab-head-2 > li a:hover {
color: #ee3124;
}
.desktop .cmn-tab-head-2 > li a:hover:after {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.cmn-box-outer .cmn-form-style {
width: 95.55555555555556%;
padding-left: 2.222222222222222%;
padding-right: 2.222222222222222%;
}
.component > .ctn-slides {
padding-bottom: 62.91666666666667%;
}
.ctn-slides > .items-slides img, .ctn-slides.owl-carousel {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
/*width: 120.8333333333333%;*/
}
.component-slide .owl-prev {
left: 6.730769230769231%;
}
.component-slide .owl-next {
right: 6.730769230769231%;
}
.component-slide .box-main-2 {
min-height: 100px;
}
.box-img-styling .ctn-slides {
padding-bottom: 56.875%;
}
.box-img-styling .ctn-slides li {
height: auto;
}
.box-img-styling .ctn-slides li img {
left: 0;
width: 104.1666666666667%;
-webkit-transform: none;
transform: none;
}
.group-ctn-box {
margin-bottom: 9.375%;
}
.group-ctn-box > div {
min-height: 92px;
min-height: 19.16666666666667vw;
}
.group-ctn-box h4, .group-ctn-box h3 {
margin-bottom: 3px;
margin-bottom: 0.625vw;
}
.group-ctn-box h4 {
font-size: 18px;
line-height: 18px;
font-size: 3.75vw;
line-height: 3.75vw;
}
.group-ctn-box h3 {
font-size: 21px;
line-height: 18px;
font-size: 4.375vw;
line-height: 3.75vw;
}
.price-txt, .price-txt-2 {
font-size: 45px;
font-size: 9.375vw;
}
.price-txt, .price-txt-2, .price-txt-large {
margin-bottom: 18px;
margin-bottom: 3.75vw;
}
.price-txt span, .price-txt-2 span {
font-size: 18px;
font-size: 3.75vw;
right: -13.33333333333333%;
margin-top: -13.33333333333333%;
}
.abs-txt-mini {
font-size: 20px;
font-size: 4.166666666666667vw;
margin-bottom: 26.51515151515152%;
}
.cmn-paging {
margin-bottom: 5.208333333333333%;
}
.component-slide .owl-dots {
margin-bottom: 5.769230769230769%;
}
.main-bnr-box .owl-dots {
margin-bottom: 4.186046511627907%;
}
.box-content {
margin-top: -22.29166666666667%;
}
.box-content-4 + .box-content.box-style {
margin-top: -21.25%;
}
.box-img-styling:first-child {
margin-bottom: 13.75%;
}
.box-style-2 {
margin-top: -12.5%;
margin-bottom: 10%;
}
.box-content-3 {
z-index: 4;
margin-top: -18.75%;
padding-bottom: 7.916666666666667%;
}
.box-content-3:before, .box-content-3:after {
content: "";
display: block;
position: absolute;
background-color: #edeff3;
}
.box-content-3:before {
top: 0;
left: 50%;
width: 8px;
height: 85%;
margin-top: 2.083333333333333%;
margin-left: -6px;
z-index: 2;
}
.box-content-3:after {
left: 0;
bottom: 0;
margin-bottom: 6.875%;
width: 100%;
padding-bottom: 4.166666666666667%;
z-index: 1;
outline: 1px solid transparent;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-content-4 {
z-index: 4;
overflow: visible;
margin-top: -17.5%;
margin-bottom: 14.58333333333333%;
}
.box-content-4:first-child {
margin-top: -9.375%;
}
.box-content-4.-fix {
margin-top: 0;
}
.box-content-4 .box-ctn-rotate {
width: 118.75%;
left: -5%;
left: -5vw;
overflow: hidden;
}
.box-content-4 .box-ctn-rotate.-fixcurve {
left: auto;
width: 100%;
}
.box-content-4 .box-ctn-rotate.-fixcurve .img-box-4 {
left: auto;
}
.box-content-4 .box-ctn-rotate.-style {
overflow: visible;
}
.box-content-4 .box-ctn-inner, .box-content-4 .slide-box-med {
border-radius: 0;
}
.box-content-4 .box-ctn-inner {
overflow: visible;
}
.box-content-4:before, .box-content-4:after {
content: "";
display: block;
position: absolute;
left: -0.625%;
width: 105%;
background-color: #edeff3;
outline: 1px solid transparent;
z-index: 6;
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
.box-content-4:before {
top: 0;
margin-top: -1px;
padding-bottom: 3.333333333333333%;
}
.box-content-4:after {
bottom: 0;
margin-bottom: -1.875%;
margin-bottom: -1.875vw;
padding-bottom: 5.208333333333333%;
}
.box-content-4 .img-box-4 {
position: relative;
display: block;
left: 5%;
left: 5vw;
overflow: hidden;
}
.box-content-4 .img-box-4, .box-content-4 .img-cmn-screen img {
border-radius: 0 60px;
border-radius: 0 12.5vw;
}
.box-content-4 .-fixcurve .img-box-4, .box-content-4 .-fixcurve .img-cmn-screen img {
border-top-right-radius: 0;
}
.box-content-4 .slide-med-size img {
width: 84.21052631578947%;
}
.box-content-4 .edge-bg-img {
width: 26.66666666666667%;
padding-bottom: 13.15789473684211%;
bottom: -2px;
}
.box-ctn-inner-2.-style {
padding-top: 10.52631578947368%;
padding-bottom: 8.771929824561404%;
}
.box-ctn-inner > .ar-triangle:first-child {
left: 46%;
margin-top: 7.719298245614035%;
}
.icon-nav {
margin-top: 13px;
margin-top: 2.708333333333333vw;
}
.icon-nav > .number-one, .tag-box-2 {
width: 58px;
height: 42px;
width: 12.08333333333333vw;
height: 8.75vw;
}
.icon-nav > li {
width: 53px;
height: 30px;
width: 11.04166666666667vw;
height: 6.25vw;
margin-top: 5px;
margin-top: 1.041666666666667vw;
-webkit-transform: translateX(-3.958333333333333vw);
transform: translateX(-3.958333333333333vw);
}
.icon-nav > .number-one + li {
margin-top: 7px;
margin-top: 1.458333333333333vw;
}
.icon-nav > .green-block:first-child, .icon-nav > .red-block:first-child {
margin-top: 20px;
margin-top: 4.166666666666667vw;
}
.box-wrap-left, .box-wrap-right {
margin-top: 3.75%;
}
.box-wrap-left {
width: 50%;
}
.slide-box-med {
position: relative;
left: 50%;
width: 143.3333333333333%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.box-content-4 .slide-box-med {
left: 0;
width: 100%;
-webkit-transform: none;
transform: none;
}
/*.slide-med-size img, .slide-med-size.owl-carousel img {
position: relative;
left: 50%;
width: 143.3333333333333%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}*/
.box-ctn-inner, .slide-box-med, .slide-med-size img, .slide-desc-box:after {
border-radius: 0 0 0 60px;
border-radius: 0 0 0 12.5vw;
}
.box-ctn-rotate.-fixcurve .slide-med-size img {
border-radius: 0;
}
.box-ctn-rotate.-fixcurve .box-ctn-inner,
.box-ctn-rotate.-fixcurve .slide-box-med,
.box-ctn-rotate.-fixcurve .slide-med-size,
.box-ctn-rotate.-fixcurve .owl-item.active .img-slider-list-item img {
border-radius: 0 0 0 60px;
border-radius: 0 0 0 12.5vw;
}
/*.box-content-4 .slide-box-med, .box-content-4 .slide-med-size img {
border-radius: 0 60px 0 60px;
border-radius: 0 12.5vw 0 12.5vw;
}*/
#map-canvas {
height: 296px;
height: 61.66666666666667vw;
}
.slide-med-size .map-box > img {
width: 122.2222222222222%;
border-radius: 0;
}
.box-ctn-inner:before {
margin-top: -5%;
}
.box-ctn-inner:after {
visibility: hidden;
}
.slide-desc-box {
min-height: 80px;
min-height: 16.66666666666667vw;
}
.slide-desc-box p {
font-size: 4.791666666666667vw;
line-height: 4.166666666666667vw;
padding-left: 4.166666666666667%;
padding-right: 13.75%;
}
.box-wrap-right {
position: absolute;
width: 50%;
right: 0;
top: 0;
}
.box-ctn-mini {
margin-top: 0;
padding-top: 4.166666666666667%;
padding-bottom: 25%;
}
.box-ctn-mini:after {
top: 0;
margin-top: -4.166666666666667%;
height: 105%;
border-radius: 0 60px 0 0;
border-radius: 0 12.5vw 0 0;
}
.mini-list-box > li, .mini-list-box .owl-item > li {
height: 33.33333333333333vw;
}
.mini-list-box .owl-item img {
position: relative;
left: 50%;
width: 112.807881773399%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.mini-list-box .owl-next, .mini-list-box .owl-prev {
width: 7px;
height: 15px;
width: 1.458333333333333vw;
height: 3.125vw;
}
.arw-nav-btn {
margin-left: -1.666666666666667%;
}
.arw-gray-prev {
width: 10px;
height: 21px;
width: 2.083333333333333vw;
height: 4.375vw;
}
.mini-desc-box {
font-size: 18px;
min-height: 32px;
padding-top: 10px;
padding-bottom: 10px;
font-size: 3.75vw;
min-height: 6.666666666666667vw;
padding-top: 2.083333333333333vw;
padding-bottom: 2.083333333333333vw;
}
.mini-desc-box p {
padding-left: 1.477832512315271%;
padding-right: 1.477832512315271%;
}
.box-ctn-mini .view-btn {
margin-bottom: 9.166666666666667%;
}
.splitbox-ctn {
padding: 5.208333333333333% 4.166666666666667% 12.5% 4.166666666666667%;
}
.form-xlarge {
margin: 4.166666666666667% auto 0;
}
.row-element-4 {
margin-top: 4.761904761904762%;
}
.row-element-4 .inline-label-2 {
margin-bottom: 1.363636363636364%;
}
.row-element-5 {
margin-top: 3.759398496240602%;
margin-bottom: 6.666666666666667%;
}
.cur-bal .inline-label-2 {
margin-top: 2.857142857142857%;
}
.splitbox-right {
margin-top: 5.208333333333333%;
}
.splitbox-right > .acd-box > h2, .splitbox-right > .acd-box > h3 {
font-size: 5.208333333333333vw;
min-height: 7.291666666666667vw;
line-height: 7.291666666666667vw;
padding-left: 4.285714285714286%;
}
.splitbox-right .box-ctn-acd-3 {
padding: 0 4.285714285714286%;
}
.splitbox-right .ctn-acd-header h3 {
font-size: 5.208333333333333vw;
padding-left: 6.666666666666667%;
}
.acd-hdr-inner {
width: 74.62686567164179%;
}
.ctn-acd-header {
min-height: 7.5vw;
line-height: 7.5vw;
}
.splitbox-right .box-acd-ctn-inner {
font-size: 4.166666666666667vw;
padding: 2.487562189054726% 4.975124378109453% 4.975124378109453%;
}
.splitbox-right .box-acd-ctn-inner h4 {
font-size: 26px;
font-size: 5.416666666666667vw;
margin-bottom: 2.762430939226519%;
}
.splitbox-right .prg-ctn-2 {
font-size: 4.583333333333333vw;
}
.splitbox-right .content-inline > div:first-child, .splitbox-right .btn-inline {
margin: 0 auto;
}
.splitbox-right .content-inline > div:first-child {
width: 82.87292817679558%;
}
.splitbox-right .btn-inline {
width: 60.77348066298343%;
}
.splitbox-right .btn-inline {
margin-top: 4.228855721393035%;
}
.splitbox-right .inline-block-list > li > div:first-child > span {
font-size: 5vw;
}
.splitbox-right .logo-list > li, .splitbox-right .logo-list-2 > li {
width: 14.64088397790055%;
max-width: 78px;
}
.splitbox-right .prg-ctn-2 + .prg-ctn-2 {
margin-top: 5.524861878453039%;
}
.splitbox-right .logo-list-2 > li {
margin-right: 5px;
}
.splitbox-right .logo-list > li {
margin-top: 16px;
margin-left: 10px;
}
.splitbox-right .prg-ctn-2 + .prg-ctn-2 {
margin-top: 25px;
}
.banner-info .img-cmn-screen {
width: 100%;
}
.box-banner-top .img-cmn-screen img {
width: 117.9166666666667%;
max-width: 1100px;
}
.box-banner-top .edge-bg-img {
left: 0;
margin-bottom: 0;
}
.heading-txt-shadow {
font-size: 4.583333333333333vw;
margin-bottom: 1.041666666666667%;
}
.heading-txt-shadow, .box-ctn-inner-3, .box-ctn-inner-2 .inline-elm-7, .box-ctn-inner-2 .btn-block {
width: 84.21052631578947%;
}
.box-ctn-inner-2 {
margin-top: 15.78947368421053%;
}
.box-ctn-inner-2 .med-gray-button {
height: 30px;
height: 6.25vw;
}
.box-ctn-inner-2 .btn-block {
margin-top: 2.105263157894737%;
}
.box-ctn-inner-3 {
margin-top: 2.631578947368421%;
}
.heading-tab {
padding-top: 2.083333333333333%;
padding-left: 3.125%;
padding-right: 3.125%;
}
.heading-tab > h3 {
font-size: 4.791666666666667vw;
line-height: 0.75em;
margin-bottom: 1.041666666666667vw;
}
.abs-txt-title {
font-size: 4.166666666666667vw;
line-height: 1em;
min-height: 5vw;
}
.tab-inner > li {
width: 12.5vw;
height: 6.25vw;
}
/*.map-box {
height: 210px;
height: 43.75vw;
}*/
.mtp-column-wrap, .wifi-list-box {
padding-left: 30px;
padding-right: 30px;
box-sizing: border-box;
}
.mtp-column-wrap, .wifi-list-box, .wifi-list-box.owl-carousel {
width: 84.21052631578947%;
}
.wifi-list-box.owl-carousel {
padding-left: 16px;
padding-right: 16px;
}
.wifi-list-box.owl-carousel .cmn-list-txt {
width: 100%;
padding-left: 15px;
padding-right: 15px;
box-sizing: border-box;
}
.mtp-column-wrap {
margin: 10px 0 0;
}
.wifi-area-box {
height: 81.25vw;
overflow: hidden;
}
.box-content-4 .slide-med-size .hpl-link-box {
width: 84.21052631578947%;
margin-top: 5.208333333333333%;
}
.wifi-list-box {
margin: 0;
}
.cmn-list-txt {
font-size: 4.583333333333333vw;
}
.cmn-list-txt.-underline > .cmn-list-item > a {
padding-top: 2.380952380952381%;
padding-bottom: 2.380952380952381%;
}
.cmn-list-txt > .cmn-list-item .arw-list-orange {
width: 1.458333333333333vw;
height: 2.5vw;
margin-top: 3.80952380952381%;
}
.form-large {
margin: 6.25% auto 8.333333333333333%;
}
.title-txt-box > h2 {
font-size: 6.25vw;
margin-bottom: 3.333333333333333%;
}
.title-txt-box > h3 {
font-size: 3.75vw;
}
.title-txt-box .circle-checked-icon, .title-txt-box .info-yellow-icon {
margin-bottom: 4%;
}
.box-5 {
font-size: 3.75vw;
padding: 6.666666666666667% 3.125%;
margin-top: 6.25%;
}
.box-5-inner {
width: auto;
}
.box-5 .print-icon {
left: 0.7407407407407407%;
}
.box-5-inner > div {
padding-left: 7.5vw;
margin-top: 4.938271604938272%;
}
.cmn-heading-box, .cmn-footer-box {
padding-left: 3.409090909090909%;
padding-right: 3.409090909090909%;
}
.cmn-heading-box {
font-size: 5.208333333333333vw;
min-height: 7.291666666666667vw;
}
.cmn-ctn-list {
font-size: 3.75vw;
}
.cmn-ctn-list > li {
padding-top: 2.439024390243902%;
padding-bottom: 2.439024390243902%;
margin-left: 3.409090909090909%;
margin-right: 3.409090909090909%;
}
.cmn-box-ctn-2 {
padding: 4.166666666666667% 2.083333333333333%;
margin: 4.166666666666667% auto 0;
}
.cmn-box-ctn-2 > h3 {
margin-bottom: 2.469135802469136%;
}
.cmn-box-ctn-2 .inline-box-inner {
width: 390px;
}
.box-4 {
padding: 8.75% 4.166666666666667%;
text-align: center;
}
.bnr-block-med {
padding-left: 4.166666666666667%;
padding-right: 4.166666666666667%;
}
.multiple-col-box {
min-height: 162px;
min-height: 33.75vw;
padding-left: 2.347417840375587%;
padding-right: 2.347417840375587%;
}
.box-4 .multiple-col-box {
position: relative;
float: left;
width: 45.22727272727273%;
}
.box-4 .multiple-col-box, .box-4 .multiple-col-box:first-child {
padding-top: 3.409090909090909%;
padding-bottom: 3.409090909090909%;
}
.box-4 .multiple-col-box:first-child:after {
content: "";
display: block;
position: absolute;
right: -3px;
top: 0;
width: 5px;
height: 100%;
background-color: #fafafa;
z-index: 1;
}
.box-4 .multiple-col-box:first-child:last-child {
display: inline-block;
float: none;
width: 100%;
max-width: 600px;
padding-top: 20px;
padding-bottom: 20px;
/*width: 68.18181818181818%;*/
}
.box-4 .multiple-col-box:first-child:last-child:after {
display: none;
}
.box-4 .multiple-col-box:first-child:last-child .input-xmedium-2 {
width: 75%;
margin: 0 auto;
}
.multiple-col-box:first-child {
margin-left: 0;
}
.box-4 .multiple-col-box:first-child .title-4 {
position: absolute;
left: 0;
right: 0;
top: 50%;
padding-left: 20px;
padding-right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.box-4 .circle-box-elm {
position: absolute;
left: 50%;
top: 0;
width: 28px;
height: 28px;
border-width: 4px;
font-size: 18px;
width: 5.833333333333333vw;
height: 5.833333333333333vw;
border-width: 0.8333333333333333vw;
font-size: 3.75vw;
margin-top: 25%;
margin-bottom: 0;
z-index: 1;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.circle-box-elm {
font-size: 3.958333333333333vw;
width: 6.666666666666667vw;
height: 6.666666666666667vw;
border-width: 1.25vw;
}
.circ-box {
display: inline-block;
vertical-align: top;
width: 24px;
height: 24px;
width: 5vw;
height: 5vw;
font-size: 15px;
font-size: 3.125vw;
}
.inline-elm-2 > * {
margin-left: 6.666666666666667%;
}
.form-heading {
margin-bottom: 2.083333333333333%;
}
.row-element > div {
float: left;
margin-bottom: 4.444444444444444%;
margin-left: 4%;
}
.row-element > div, .row-element > div:first-child + div {
width: 48%;
}
.row-element > .radiobox {
float: none;
}
.row-element > div:last-child, .flex-width > div, .flex-width > div:first-child + div {
width: 100%;
}
.row-element.-three > div:last-child {
margin-left: 0;
}
.input-with-btn .cmn-button {
margin-top: 4.444%;
}
.flex-width > div {
margin-left: 0;
}
.inline-box-inner .cmn-desc-box {
margin-top: 30px;
}
.inline-box-inner .row-element > div, .inline-box-inner .cmn-inline-label {
display: inline-block;
vertical-align: middle;
}
.inline-box-inner .row-element > div {
width: auto;
}
.inline-box-inner .row-element > div.-fullmax {
width: 100%;
}
.inline-box-inner .cmn-inline-label {
margin-left: 8px;
}
.date-time-box .cmn-inline-label {
margin-left: 0;
}
.inline-block-form > div {
width: 22.84263959390863%;
max-width: 120px;
margin-left: 5px;
vertical-align: middle;
}
.inline-block-form > div:first-child {
display: inline-block;
width: auto;
max-width: none;
margin-bottom: 0;
margin-left: 0;
}
.inline-block-form > div .slc-short {
width: 100%;
}
.inline-row {
margin-bottom: 4.444444444444444%;
}
.cmn-desc-box {
text-align: left;
}
.cmn-desc-box h5 {
font-size: 5.208333333333333vw;
}
.cmn-desc-box .label-heading {
text-align: left;
}
.cmn-desc-box .cmn-inline-label-2 {
width: 80.76923076923077%;
vertical-align: top;
text-align: left;
}
.cmn-desc-box .file-btn {
margin-top: 1.282051282051282%;
margin-right: 1.282051282051282%;
margin-bottom: 0;
}
.cmn-inline-label-2 .mini-block {
margin-top: 2.564102564102564%;
}
.cmn-desc-list > li {
font-size: 4.166666666666667vw;
margin-top: 2.439024390243902%;
}
.cmn-desc-list + .cmn-desc-list {
margin-top: 4.878048780487805%;
}
.cmn-form-style .captcha-box {
width: 53.33333333333333%;
margin: 6.666666666666667% auto 5.555555555555556%;
}
.form-btm-part {
margin-top: 8.888888888888889%;
}
.box-6 .multiple-col-box {
min-height: 60px;
min-height: 12.5vw;
}
.box-6 .inline-row {
padding-bottom: 6.666666666666667%;
}
.box-6 .inline-row > div {
display: inline-block;
vertical-align: top;
width: 48%;
margin-top: 0;
margin-left: 1%;
}
.box-6 .inline-row > div:first-child {
margin-left: 0;
}
.box-6 .circle-box-elm {
margin: -3.777777777777778% auto -3.777777777777778%;
}
.box-6 .acd-ctn-box {
max-height: none;
overflow: visible;
}
.sim-type-box .multiple-col-box {
padding-top: 2.222222222222222%;
}
.sim-list, .sim-list > li {
vertical-align: top;
}
.sim-list {
width: 95%;
padding-top: 0;
padding-bottom: 4.444444444444444%;
}
.sim-list > li {
width: 32%;
text-align: left;
margin-top: 0;
}
.sim-list .cmn-inline-label {
width: auto;
min-width: 100px;
}
.sim-list > li .sim-img {
width: auto;
max-width: 43.7956204379562%;
}
.sim-img {
margin-top: 8.759124087591241%;
margin-left: 23.35766423357664%;
}
.sim-img img {
margin: 0;
}
.box-7 {
margin-top: 11.11111111111111%;
}
.box-7 .inline-label, .box-7 .sim-list {
width: auto;
vertical-align: middle;
margin-bottom: 0;
}
.box-7 .inline-label {
margin-right: 2.222222222222222%;
}
.box-7 .sim-list .cmn-inline-label {
min-width: 10px;
}
.box-7 .sim-list > li {
padding: 6.17283950617284%;
}
.box-7 .sim-list > li .sim-img {
max-width: none;
margin: 0;
}
.box-1 {
padding-top: 6.25%;
padding-bottom: 6.25%;
}
.box-1 .cmn-form-style {
/* max-width: 660px; */
max-width: 700px;
}
.box-1 .cmn-form-style.-fix {
max-width: 932px;
}
.logo-inline > li {
margin-right: 0;
margin-left: 7px;
}
.logo-inline > li:first-child {
margin-left: 0;
}
.box-8 {
margin-top: 6.666666666666667%;
}
.heading-title .arw-orange-right {
margin-right: 1.904761904761905%;
}
.flex-list-box {
padding-top: 4.444444444444444%;
padding-bottom: 4.444444444444444%;
}
.flex-two-clmn .cmn-title, .flex-two-clmn .cmn-title-2,
.flex-two-clmn .cmn-title-sm {
font-size: 3.75vw;
}
.flex-two-clmn .sm-txt-size {
font-size: 3.333333333333333vw;
}
/* --- FOOTER --- */
.footer-list-box > li > h4:after {
width: 14px;
height: 10px;
}
.feed-desc-list > li:after {
content: "";
display: block;
clear: both;
height: 0;
line-height: 0;
visibility: hidden;
}
.feed-desc-list > li > div {
float: right;
text-align: right;
}
.feed-desc-list > li > div:first-child {
float: left;
width: 62.5%;
line-height: 0.8em;
text-align: left;
margin-top: 4px;
}
.star-box {
margin-top: 0;
}
.rate-box {
margin-top: 14px;
}
.feed-contact {
margin-top: 25px;
}
.arw-nav-prev.slick-arrow {
left: -12px;
}
.arw-nav-next.slick-arrow {
right: -6px;
margin-right: -1.327433628318584%;
}
/* --- MODAL --- */
.md-max-scroll, .md-auto-scroll, .flex-modal.md-max-scroll {
height: 96%;
max-height: 760px;
}
.md-max-scroll.med-scroll-fix {
max-height: 634px;
}
.md-auto-scroll .md-content, .md-auto-scroll .md-ctn-box-2, .md-auto-scroll .ctn-tgl-box, .md-auto-scroll .box-acd-ctn-inner,
.md-auto-scroll .md-content-wrap, .md-auto-scroll .modal-ajax, .md-auto-scroll .ajax-container {
height: 100%;
}
.md-auto-scroll .md-ctn-box-2 {
overflow: auto;
box-sizing: border-box;
}
.md-auto-scroll.md-show .md-ctn-box-2 {
-webkit-overflow-scrolling: touch;
}
.md-auto-scroll .md-header {
position: absolute;
display: block;
left: 0;
top: 0;
width: 94.25287356321839%;
padding-left: 2.873563218390805%;
padding-right: 2.873563218390805%;
z-index: 10;
}
.md-auto-scroll .md-ctn-box-2 {
padding-top: 65px;
}
.md-auto-scroll .md-ctn-box-2.-fix {
padding-top: 35px;
}
#cvg-modal.md-auto-scroll .md-ctn-box-2 {
padding-top: 75px;
}
.md-auto-scroll .ctn-tgl-box {
padding-bottom: 25px;
height: auto;
}
.md-auto-scroll .prg-ctn-2 + .btn-inline {
margin-bottom: 25px;
}
.md-ctn-box .true-id-logo {
right: 15px;
}
.md-ctn-box-2 .btn-inline {
margin-bottom: 20px;
}
/* --- CONTENT IN MODAL --- */
.md-auto-scroll .md-med-form-wrap {
padding-bottom: 25px;
}
.md-fix-scrolling .md-med-form-wrap {
padding-bottom: 0;
}
.md-ctn-box-2.-fix .btn-inline {
margin-bottom: 0;
}
.mini-form .btn-inline {
margin-bottom: 0;
}
.md-med-row {
margin-bottom: 15px;
}
.md-med-row + .btn-block {
margin-top: 0;
}
.md-two-col .md-med-col {
width: 48.16625916870416%;
margin-top: 0;
margin-left: 3.667481662591687%;
}
.md-two-col .md-med-col:first-child, .md-two-col .med-txt-label:first-child + .md-med-col {
margin-left: 0;
}
.text-prg {
font-size: 22px;
}
.md-ctn-box-3 .text-prg {
width: 320px;
}
/* --- AUTO COMPLETE --- */
.ui-autocomplete {
width: 81.25%;
}
/* --- MARI POPUP-2 --- */
.md-mari-pop {
width: 460px;
}
.btn-link-box {
width: auto;
}
.mari-pop-2 {
height: 220px;
background-position: -404px -380px;
}
.mari-half {
top: -43px;
left: 22px;
}
.black-bubble-box {
width: 240px;
}
.btn-link-box {
padding-top: 96px;
}
.btn-link-box > li, .btn-link-box > li:nth-child(2n) {
margin-top: 0;
margin-left: 8px;
}
.btn-link-box > li, .btn-link-box > li > a {
width: 103px;
height: 103px;
line-height: 103px;
}
.btn-link-box h2, .btn-link-box .red-txt-2 {
font-size: 20px;
line-height: 0.7em;
}
.btn-link-box h3 {
font-size: 20px;
line-height: 0.7em;
}
.btn-link-box h2 {
margin-top: 5px;
}
.btn-link-box li:nth-child(4) h1 {
min-height: 28px;
}
.btn-link-box .pack-icon, .btn-link-box .mb-upgrade-icon {
width: 70px;
height: 70px;
}
.btn-link-box .pack-icon {
top: 6px;
}
.btn-link-box .mb-pack-app-icon {
width: 57px;
height: 57px;
}
.btn-link-box .mtu-icon {
top: 8px;
width: 100px;
height: 67px;
}
/*.mini-btn-inline {
text-align: left;
}*/
.mari-noti .gift-icon {
top: -2px;
left: 0;
}
.noti-mini {
top: 7px;
left: 12px;
}
.quote-bg::after {
margin-top: 0px;
}
/* --- MARI POP-BTM --- */
.search-box {
width: 270px;
}
.mini-btn-inline .mini-btn {
margin-top: 5px;
}
.mini-btn-inline .mini-btn:first-child {
margin-left: 0;
}
.mari-noti {
right: 5px;
top: 15px;
}
.msg-txt {
font-size: 13px;
line-height: 1.5em;
}
.mari-box .msg-txt {
margin-right: 15px;
}
.cmn-txt-label-sm-btm-2 {
font-size: 3.125vw;
}
.cmn-sm-box {
min-width: 25vw;
}
.tt-content-3 {
right: auto;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tt-content-3 .tt-arw-down:before, .tt-content-3 .tt-arw-down:after {
right: auto;
left: 50%;
}
.tt-content-3 .tt-arw-down:before {
margin-left: -10px;
}
.tt-content-3 .tt-arw-down:after {
margin-left: -11px;
}
.row-element .tt-abs {
right: 6.818181818181818%;
top: 26%;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-1 {
margin-top: 235.625%;
}
.abs-bnt-box-2 {
margin-top: 332.9166666666667%;
}
.abs-bnt-box-3 {
margin-top: 2484.583333333333%;
}
.box-th.abs-bnt-box-3 {
margin-top: 2535.625%;
}
.abs-bnt-box-4 {
margin-top: 2546.875%;
}
.box-th.abs-bnt-box-4 {
margin-top: 2597.708333333333%;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4 {
margin-top: 54.79166666666667%;
}
.abs-bnt-box-4 .abs-btn-5 {
margin-top: 47.29166666666667%;
}
.title-text-1 {
font-size: 4.791666666666667vw;
}
.title-text-2 {
font-size: 4.583333333333333vw;
}
.prg-txt-1 {
font-size: 4.166666666666667vw;
}
.inline-block-col .title-text-1 {
min-height: 52px;
min-height: 10.83333333333333vw;
}
.inline-col-inner {
font-size: 17px;
font-size: 3.541666666666667vw;
}
.tab-head-styling-2 > li {
min-height: 6.666666666666667vw;
line-height: 6.25vw;
}
.tab-head-styling-2 > .tpr-tab {
margin-top: 6.25%;
}
.tab-head-txt {
font-size: 27px;
font-size: 5.625vw;
margin-bottom: 9.375%;
}
.inline-block-col .title-text-1 .tgl-br {
display: inline;
}
.bnr-info-list .abs-txt-anchor {
right: 15.83333333333333%;
font-size: 4.225352112676056vw;
min-height: 27px;
line-height: 27px;
min-height: 5.625vw;
line-height: 5.625vw;
}
.abs-sub-txt {
font-size: 4.583333333333333vw;
padding-top: 0;
margin-right: 4.166666666666667%;
margin-left: 0;
margin-top: 1.666666666666667%;
}
.sub-txt-sm {
font-size: 3.75vw;
}
.img-icon-box img {
width: 2.916666666666667vw;
height: 2.916666666666667vw;
}
.group-txt-2 .img-icon-box {
right: -6.666666666666667vw;
}
.label-heading .cmn-txt-label {
margin-top: 0.2941176470588235em;
}
.title-txt-spc {
margin-top: 100px;
}
.tab-text-box {
font-size: 4.583333333333333vw;
}
/* --- SPRITE BU --- */
.truemoveh-logo {
width: 14.16666666666667vw;
height: 2.291666666666667vw;
}
.trueonline-logo {
width: 13.54166666666667vw;
height: 2.291666666666667vw;
}
.truevisions-logo {
width: 14.375vw;
height: 2.291666666666667vw;
}
.truemoveh-icon {
width: 8.125vw;
height: 10.41666666666667vw;
}
.trueonline-icon {
width: 13.33333333333333vw;
height: 10.41666666666667vw;
}
.truevisions-icon {
width: 11.45833333333333vw;
height: 10.41666666666667vw;
}
.grey-cir-box {
width: 16.66666666666667vw;
height: 16.66666666666667vw;
}
.hpl-wrap-box {
padding: 2.564102564102564%
}
.hpl-wrap-box .hpl-link-box:first-child, .hpl-wrap-box .hpl-link-box:first-child + .hpl-link-box {
width: 49%;
min-height: 40px;
}
.hpl-wrap-box .hpl-link-box:first-child {
position: relative;
top: 1.875vw;
}
.hpl-wrap-box .hpl-link-box:first-child:last-child {
text-align: center;
}
.hpl-wrap-box .hpl-link-box.pull-right-box:first-child {
text-align: right;
}
.hpl-wrap-box .hpl-link-box.pull-right-box strong, .hpl-wrap-box .hpl-link-box strong + .switch-line-txt {
display: inline-block;
}
.tab-heading-block, .rows, .block-inline-wrap {
padding-left: 20px;
padding-right: 20px;
}
.tab-heading-block, .rows .medium-txt {
font-size: 5vw;
}
.rows {
font-size: 4.166666666666667vw;
}
.rows.-sm {
font-size: 3.75vw;
}
.input-block-wrap {
width: 280px;
}
.flex-btn-xlong {
min-width: 280px;
}
.pack-row .pack-col.-larger {
width: calc(100% - 197px);
}
.file-txt {
font-size: 4.166666666666667vw;
}
.file-box-style .file-btn {
margin-top: 15px;
}
.chat-bubble-icon {
width: 21.45833vw;
height: 20.833vw;
}
.staff-icon {
width: 23.9583vw;
height: 20.833vw;
}
.on-web-icon {
width: 21.45833vw;
height: 20.833vw;
}
.trueshop-icon {
width: 23.125vw;
height: 18.75vw;
}
.credit-card-icon.-med {
width: 27.70833vw;
height: 20.833vw;
}
.tmn-wallet-icon {
width: 25.83333vw;
height: 20.83333vw;
}
.tmn-kiosk-icon {
width: 13.3333vw;
height: 20.83333vw;
}
.social-network-icon {
width: 33.125vw;
height: 20.83333vw;
}
.data500-icon {
width: 36.875vw;
height: 14.58333vw;
}
.idcard-icon {
width: 16.875vw;
height: 12.5vw;
}
.scan-qrcode-icon {
width: 10.4166667vw;
height: 18.33333vw;
}
.sim-checked-icon {
width: 14.58333vw;
height: 16.6667vw;
}
.header-block {
font-size: 7.0833vw;
}
.header-title {
font-size: 7.0833vw;
}
.multiple-col-block .col-item {
font-size: 4.85vw;
}
.multiple-col-block .col-title .tgl-br-1 {
display: none;
}
.button-flex .button-txt.-med {
font-size: 5vw;
}
.multiple-col-block .col-item .button-flex {
height: 8.334vw;
}
.med-label {
width: 18.75vw;
font-size: 4.1667vw;
}
.multiple-col-block .col-item:nth-child(3) .col-title,
.multiple-col-block .col-item:nth-child(4) .col-title {
min-height: 10.41667vw;
}
.mtp-icons-list .title {
font-size: 4.1667vw;
}
.icon-list-item > img {
height: 8.333vw;
}
.table-inner {
padding-top: 40px;
}
.tab-ctn .table-inner {
padding-top: 0;
}
.table-row-list {
width: 100%;
}
.block-info-2 .tab-head-styling {
padding-top: 50px
}
.slick-slide .table-row-list {
width: 100% !important;
display: block !important;
margin-left: auto;
margin-right: auto;
}
.table-list-col.-full {
font-size: 6.25vw;
}
.table-row-heading, .table-row-content {
font-size: 4.1667vw;
}
.table-info-box {
padding-top: 1.24%;
}
.sim-title {
font-size: 6.25vw;
}
.sim-pic {
width: 24.58333vw;
}
.search-area-box {
padding-top: 40px;
}
.search-area-box .search-title {
font-size: 5.8333vw;
}
.search-list-item {
width: 33.33333%;
}
.search-txt {
font-size: 4.16667vw;
}
.flex-two-clmn > div {
width: 55%;
}
.flex-two-clmn > div:first-child {
width: 40%;
}
.md-title-fix.-spacing {
margin-left: 20px;
margin-right: 20px;
}
.pack-btn-item.-flexi {
min-height: 7.91667vw;
font-size: 3.75vw;
}
.pack-btn-item.-flexi *[class*='app-icon'] {
width: 7.91667vw;
height: 7.91667vw;
}
.pack-btn-item.-flexi *[class*='app-icon'] + .pack-btn-txt {
margin-left: 7.91667vw;
}
.cmn-form-style .pack-btn-item {
width: 50.7987%;
margin-right: 0;
margin-left: 43.7699%;
}
.fixedonsmall .pack-btn-item {
width: 52.0833vw;
margin-left: auto;
margin-right: auto;
}
.combobox-list-item {
font-size: 3.95833vw;
padding: 5% 6.369%;
}
.inline-box-inner .row-element > div {
margin-bottom: 0;
}
.filter-menu-list .arw-nav-next.slick-arrow {
right: 0.888889%;
}
.full-bnr-content {
margin-top: 3%;
}
.wrap-cont .flex-block-wrap {
width: 95%;
padding-left: 2.222%;
padding-right: 2.222%;
}
.wrap-cont .heading-txt-2 {
margin-bottom: 5%;
}
.packbox-list-item,
.wrap-cont .med-box-ctn .brc-wrap-box {
padding-left: 2.222%;
padding-right: 2.222%;
}
.wrap-cont .brc-style.-horizontal {
width: 100%;
box-sizing: border-box;
margin-left: 0;
}
.med-txt-label {
font-size: 24px;
}
.cmn-txt-label:empty:before {
display: inline-block;
}
.floating-btn-box {
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin-bottom: 80px;
z-index: 5;
}
.border-line-block {
padding-left: 15px;
padding-right: 15px;
}
.the-txt {
font-size: 24px;
}
.flex-row-panel.-fix .flex-col-panel,
.flex-toggle-block {
padding-left: 15px;
padding-right: 15px;
}
.flex-row-panel.-fix .flex-col-panel {
padding-top: 3%;
padding-bottom: 3%;
}
.flex-toggle-block {
padding-bottom: 20px;
}
.flex-toggle-block .row-element:last-child > div {
margin-bottom: 0;
}
.heading-label {
font-size: 4.5833vw;
}
.fiveg-ready-icon {
width: 40px;
height: 40px;
}
.box-list-column .fiveg-ready-icon {
top: -8px;
}
.table-row-heading, .table-row-content {
width: 80%;
}
.table-txt-sub {
font-size: 0.75em;
}
.box-content-4.-hiddencurve .slide-med-size .owl-dots {
bottom: 0;
}
.box-content-4.-hiddencurve + .box-content.box-style .box-main-inner {
padding-top: 17px;
}
.packages-block {
font-size: 4.1667vw;
width: 48.75vw;
}
.packages-header {
min-height: 7.91667vw;
}
.packages-list .owl-prev {
left: 40px;
}
.packages-list .owl-next {
right: 40px;
}
.multiple-col-block.-fix .col-item .button-flex {
width: 60%;
}
.remark-desc {
font-size: 2.5vw;
}
}
@media screen and (min-width: 480px) and (max-width: 899px) {
.table-info-box:last-child .title-info-list {
width: 100%;
text-align: center;
}
.table-info-box:last-child .table-row-list {
padding-top: 5%;
}
.collapse-title-block {
min-height: 6.25vw;
}
.collapse-expand-block:not(.actived) .floating-input-block {
width: 17.778%;
right: 41%;
}
.collapse-expand-block:not(.actived) .floating-input-block .square-input {
font-size: 5.833333333333333vw;
}
.multiple-col-block.-fix .chat-bubble-icon {
left: 9%;
}
.multiple-col-block.-fix .on-web-icon,
.multiple-col-block.-fix .trueshop-icon {
left: 8%;
}
.multiple-col-block.-fix .staff-icon {
left: 7%;
}
.multiple-col-block.-fix .col-item {
padding-top: 1.35em;
padding-bottom: 1.35em;
}
.abs-btm-box {
right: 11px;
}
}
@media screen and (min-width : 480px) and (orientation: landscape) {
.md-fix-scroll {
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
-webkit-transform: none;
transform: none;
}
.md-fix-scroll.md-show {
max-height: 100%;
overflow: auto;
}
.md-fix-scroll .md-mari-pop-2 {
margin-top: 40px;
margin-bottom: 40px;
}
}
@media screen and (min-width : 560px) {
.dd-list {
width: 245px;
margin-left: 10px;
}
.md-mari-size {
width: 540px;
}
.mari-pop {
position: static;
height: auto;
width: 200px;
}
.pop-top-content {
width: 200px;
}
.mini-box-slide {
margin-top: 0;
margin-bottom: 0;
margin-left: 18px;
}
.pop-mini {
position: absolute;
left: auto;
right: 103px;
top: 26px;
width: 128px;
min-height: 100px;
padding: 10px;
}
.pop-mini:after {
margin-top: 9px;
right: -25px;
}
.mari-pop .mari-elm {
top: 26px;
right: -2px;
width: 150px;
height: 150px;
}
.user-txt {
font-size: 28px;
}
.box-list-elm {
width: 440px;
}
.pop-mini .msg-txt {
font-size: 11px;
line-height: 1.363636363636364em;
}
.pop-mini .user-txt {
margin-bottom: 4px;
}
.pop-btm-inner .owl-stage {
padding-top: 30px;
}
.filter-menu .tlight-large-size, .filter-menu .select-menu {
width: auto;
}
.filter-menu .tlight-large-size, .filter-menu .select-menu {
float: left;
}
.filter-menu .tlight-large-size {
margin-bottom: 0;
margin-left: 15px;
margin-right: 15px;
margin-top: 8px;
}
.filter-menu .select-menu {
width: 64.28571428571429%;
}
.info-list-item {
float: left;
width: 49%;
}
.info-list-item + .info-list-item {
margin-top: 0;
padding-top: 0;
border-top: none;
margin-left: 2%;
}
.info-list-block:before {
content: "";
display: block;
position: absolute;
left: 50%;
margin-left: -15px;
width: 1px;
height: 100%;
background-color: #ccc;
}
.txt-inline-item {
width: 23%;
margin-left: 5%;
margin-right: 5%;
}
.mtp-rows-block .txt-inline-item {
width: 28%;
margin-left: 0;
}
.mtp-rows-block .txt-inline-item,
.mtp-rows-block .txt-inline-item:nth-child(2n) {
margin-right: 8%;
}
.mtp-rows-block .txt-inline-item:nth-child(3n) {
margin-right: 0;
}
.collapse-expand-block.actived .custom-arrow {
-webkit-transform: rotate(-180deg) scale(1.5);
transform: rotate(-180deg) scale(1.5);
}
.packages-block {
font-size: 3.214vw;
width: 37.5vw;
}
.packages-list .owl-prev {
left: -2px;
}
.packages-list .owl-next {
right: -2px;
}
.sim-thumb {
width: 30%;
}
.sim-thumb:nth-child(3n) {
margin-top: 0;
}
.bubble {
bottom: 68px;
}
.mari-action {
width: 81px;
height: 150px;
bottom: -40px;
}
.abs-btm-box,
.abs-btm-box.-fix {
bottom: 8px;
}
/* .pack-row .pack-col.-larger .-bold {
width: auto;
}
.pack-col.-larger .-bold {
margin-right: 7px;
}
.pack-col.-larger .-bold:last-child {
margin-right: 0;
}
.rows .txt-split {
display: inline-block;
vertical-align: baseline;
}*/
}
@media screen and (min-width : 600px) {
.middle-prg-ctn > h4 .tgl-br, .select-tabs-group .accd-arrow, .mari-box .msg-txt .tgl-br {
display: none;
}
.tbold-xlarge-size {
font-size: 32px;
}
.heading-txt-4 {
font-size: 6.25vw;
margin-bottom: 15px;
}
.prg-ctn-2 {
font-size: 24px;
line-height: 0.8333333333333333em;
}
/* --- MARI POP-BTM --- */
.search-box {
width: 405px;
}
.mari-box {
width: 550px;
}
.mini-btn-inline .mini-btn {
min-width: 115px;
margin-left: 10px;
}
/* --- FOOTER --- */
.footer-btm-box.footer-styling {
width: auto;
height: auto;
line-height: normal;
padding-top: 10px;
padding-bottom: 10px;
}
.footer-styling .ft-hpl-txt {
display: inline-block;
}
.full-height-block, .main-sec.full-height-block {
margin-bottom: -41px;
}
/* --- ICONS --- */
.krungsri-cdc-logo {
width: 30px;
height: 40px;
}
.logo-inline > li {
margin-left: 12px;
}
.select-tabs-wrap .detail-content {
/*padding-top: 14.33333333333333%;*/
/*padding-top: 17.66666666666667%;*/
padding-top: 0;
margin-top: 17.66666666666667%;
}
.select-tabs-wrap .box-ctn-acd > .ctn-tgl-box:first-child .detail-content {
margin-top: 0;
}
.select-tabs-group {
width: 100%;
height: auto;
text-align: center;
}
.select-tabs {
position: relative;
overflow: visible;
max-height: none;
padding-top: 0;
border: none;
background-color: transparent;
border-bottom: 7px solid #666;
-webkit-transition: none;
transition: none;
}
.slc-tabs-item {
display: inline-block;
/* width: 20%;
font-size: 20px; */
width: auto;
font-size: 17px;
vertical-align: bottom;
background-color: #e0e0e4;
padding: 10px;
border-radius: 5px 5px 0 0;
margin-left: 3px;
}
.slc-tabs-item:first-child, .not-tgl-ctn + .slc-tabs-item {
margin-left: 0;
}
.select-tabs.actived {
max-height: none;
}
.slc-tabs-item.actived {
position: relative;
background-color: #666;
color: #fff;
}
.acd-tab-fixed .select-tabs-group {
position: absolute;
top: 0;
margin-top: 85.33333333333333%;
z-index: 1;
}
.acd-tab-fixed.spc-tab .select-tabs-group {
margin-top: 98.33333333333333%;
}
.box-ctn-acd > .ctn-tgl-box:first-child .acd-tab-fixed .select-tabs-group {
position: relative;
margin-top: 5%;
background-color: #fff;
}
.box-ctn-acd > .ctn-tgl-box:first-child .ctn-acd-header {
position: absolute;
top: 0;
left: 0;
right: 0;
background-color: #f7f7f7;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-1 {
margin-top: 250%;
}
.abs-bnt-box-2 {
margin-top: 347.3333333333333%;
}
.abs-bnt-box-3 {
margin-top: 2499.333333333333%;
}
.box-th.abs-bnt-box-3 {
margin-top: 2550.166666666667%;
}
.abs-bnt-box-4 {
margin-top: 2561.333333333333%;
}
.box-th.abs-bnt-box-4 {
margin-top: 2612%;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4 {
margin-top: 54.79166666666667%;
}
.abs-bnt-box-4 .abs-btn-5 {
margin-top: 47.29166666666667%;
}
.ctn-tgl-box .cmn-form-style {
min-height: 351px;
min-height: 58.5vw;
}
.wifi-area-box {
height: 60vw;
}
.box-content-4 .slide-med-size .wifi-map img {
position: relative;
width: 160%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.fix-txt-size {
font-size: 24px;
}
.fix-txt-size.-small {
font-size: 22px;
}
.fix-txt-size.-med, .md-title-fix {
font-size: 30px;
}
.map-area-pic img {
width: 70%;
margin-left: auto;
margin-right: auto;
}
.mtp-rows-wrap {
margin-bottom: 25px;
}
.cmn-form-style .pack-btn-item {
width: 56.122%;
margin-right: 0;
margin-left: 37.755%;
}
.sim-name {
min-height: 10px;
margin-bottom: 15px;
}
.sim-name .tgl-br {
display: none;
}
.sim-prg {
font-size: 26px;
}
}
@media screen and (min-width: 700px) {
.slc-tabs-item {
/* font-size: 25px; */
font-size: 21px;
}
.md-header-2 {
height: 84px;
line-height: 80px;
}
.md-header-2 h3 {
font-size: 60px;
}
.row-elm-2, .mini-form > .row-elm {
margin-top: 20px;
}
.box-top-cmn.border-btm-before h2, .box-top-inner h1, .box-top-inner h2 {
margin-top: 5.142857142857143vw;
}
.box-top-inner.border-btm-before h1, .box-top-inner.border-btm-before h2 {
margin-top: 2.428571428571429vw;
}
.box-top-head-2 > h1, .box-top-head-2 > h2 {
margin-top: 1.428571428571429%;
}
#login-modal .md-txt-label {
font-size: 32px;
}
/*.md-max-scroll, .md-auto-scroll {
height: auto;
max-height: 90%;
}*/
.flex-modal.md-max-scroll {
max-height: 100%;
}
.tt-longer .tt-content-3 {
right: auto;
left: 50%;
min-width: 220px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tt-longer .tt-content-3 .tt-arw-down:before,
.tt-longer .tt-content-3 .tt-arw-down:after {
left: 50%;
right: auto;
}
.wrap-cont .flex-block-wrap {
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
-ms-flex-pack: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.flex-block-rows.-head .flex-block-cols {
min-height: 70px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.flex-block-rows.-head .flex-block-cols.-left {
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.flex-block-items {
width: 48.5%;
}
.flex-block-wrap.-full .flex-block-items {
width: 100%;
}
}
@media screen and (min-width : 760px) {
.menu-logo .true-logo {
width: 100px;
height: 36px;
margin-left: -50px;
margin-top: -18px;
}
.full-height-block, .main-sec.full-height-block {
padding-top: 80px;
}
.mb-nav-box.fixed-mb-nav, .mb-nav-box.fixed-mb-nav .mb-nav, .mb-nav-box.fixed-mb-nav .menu-logo {
height: 80px;
}
/* --- BUTTON --- */
.doc-yel-icon {
width: 14px;
height: 18px;
}
.dash-button {
line-height: normal;
padding: 7px 10px;
}
.dash-button .doc-yel-icon {
vertical-align: top;
}
.btn-txt {
font-size: 20px;
}
.md-fix-scroll .md-mari-pop-2 {
top: 50%;
margin: 0 auto;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.xs-txt-size-fix {
font-size: 18px;
}
.sm-txt-size-fix-2 {
font-size: 22px;
}
.pack-head {
min-height: 42px;
}
.pack-head .title {
font-size: 24px;
}
.pack-row {
font-size: 22px;
padding-left: 20px;
padding-right: 20px;
}
.pack-row .text-sm {
font-size: 21px;
}
.pack-row .text-med {
font-size: 25px;
}
.pack-col.-small {
max-width: 90px;
}
.pack-col.-medium {
max-width: 80px;
}
.pack-row .pack-col.-larger {
width: calc(100% - 260px);
}
.pack-col .star-circle + .-bold {
margin-left: 10px;
}
.pack-col .star-circle + .-bold + .text-sm.-block {
margin-left: 30px;
}
.pack-button {
font-size: 22px;
height: 28px;
padding-left: 8px;
padding-right: 8px;
}
.pack-button.-small {
width: 64px;
}
.star-circle {
width: 20px;
height: 20px;
}
.pack-col .star-circle {
left: -6px;
}
.slick-slide .table-row-list {
width: 90% !important;
display: block !important;
margin-left: auto;
margin-right: auto;
}
.owl-item .table-row-list {
width: 90%;
}
.table-row-heading, .table-row-content {
font-size: 3.2vw;
}
.table-txt-sub {
font-size: 0.5em;
}
}
@media screen and (min-width: 770px) {
.live-chat-block,.live-chat-block-header {
border-radius: 8px 8px 0 0;
}
.live-chat-block {
width: 350px;
height: 490px;
max-height: 90vh;
left: auto;
right: 46px;
top: auto;
bottom: 0;
}
.live-chat-block {
box-shadow: 0 0 5px rgb(0, 0, 0, 0.5);
}
}
@media screen and (min-height : 415px) {
.md-auto-scroll {
height: auto;
}
}
@media screen and (min-width : 900px) {
.single-shadow:before, .single-shadow:after, .double-shadow:before, .double-shadow:after, .sq-arw-box,
.row-element-4.tgl-target-elm, .footer-list-box > li > h4:after, .footer-btm .true-logo, .box-5 .tgl-br-2,
.inline-row.tgl-target-elm, .md-med-form-wrap > h3 .tgl-br, .md-med-form-wrap > h4 .tgl-br, .cmn-txt-label .tgl-br,
.bnr-img-box .img-mb, .multiple-col-box .title-5 > .tgl-br, .sm-bnr-img {
display: none;
}
.main-bg-top, .footer-btm > span, .footer-content .true-logo, .split-bg-top, .box-main-inner > .splitbox-ctn .splitbox-left,
.box-main-inner > .splitbox-ctn .splitbox-right, .cmn-inline-label-2 .gray-txt-2, .cmn-desc-list > li .tgl-br,
.inline-block-form.tgl-target-elm.actived, .date-time-box.tgl-target-elm.actived, .bnr-img-box .img-cmn-screen,
.inline-label-2 .cmn-txt-label, .large-bnr-img {
display: block;
}
.feed-head h5 span, .box-top-inner h1 span, .box-top-inner h2 span, .middle-prg-ctn .tgl-br-2 {
display: inline;
}
.inline-label, .inline-label-2, .inline-label-3, .splitbox-left, .splitbox-right, .confirm-number > div:first-child,
.splitbox-left .row-element-4 > .tgl-hidden-box, .other-number > div:first-child, .cdc-input > div:first-child,
.footer-btm .copyright, .tgl-tab-txt {
display: inline-block;
}
/*.row-element-4, .tgl-target-elm.actived {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}*/
.row-element-4, .tgl-target-elm.actived {
display: block;
}
.inline-elm-6 > * {
margin-left: 6px;
}
/* --- ICONS --- */
.mb-icon-2 {
width: 90px;
height: 86px;
}
.mb-pack-icon, .mb-code-icon {
width: 93px;
height: 86px;
}
.tmh-sim-icon {
width: 74px;
height: 86px;
}
.deliver-sim-icon {
width: 135px;
height: 86px;
}
.mb-sim-icon {
width: 90px;
height: 86px;
}
.mb-right-icon {
width: 70px;
height: 86px;
}
.mb-thmap-icon {
width: 62px;
height: 86px;
}
.mb-gbmap-icon {
width: 75px;
height: 86px;
}
.mb-wifi-icon {
width: 70px;
height: 86px;
}
.mb-sms-icon {
width: 73px;
height: 86px;
}
.mb-map-icon {
width: 82px;
height: 91px;
}
.mb-abroad-icon {
width: 66px;
height: 86px;
}
.mb-dial-icon {
width: 73px;
height: 86px;
}
.numpad-icon {
width: 60px;
height: 86px;
}
.shop-icon {
width: 92px;
height: 75px;
}
.usd-bank-icon, .credit-card-icon {
width: 80px;
height: 60px;
}
.scissors-icon {
width: 123px;
height: 91px;
}
.signal-icon {
width: 80px;
height: 91px;
}
.phone-sm-icon {
width: 21px;
height: 20px;
}
.phone-md-icon {
width: 28px;
height: 26px;
}
.phone-large-icon {
width: 35px;
height: 33px;
}
.viber-app-icon {
width: 40px;
height: 40px;
}
.htv-app-icon {
width: 90px;
height: 90px;
}
.plus-white-icon {
width: 22px;
height: 22px;
}
.topup-tab-icon, .topup-tab-th-icon {
width: 172px;
height: 64px;
}
.desktop .topup-tab-icon {
background-size: auto;
background-position: -534px -405px;
}
.desktop .topup-tab-th-icon {
background-size: auto;
background-position: -726px -3224px;
}
.arw-orange-right {
width: 12px;
height: 20px;
}
.arw-orange-sm-right {
width: 11px;
height: 21px;
}
.arw-acd-white {
width: 17px;
height: 8px;
}
.arw-white-right {
width: 16px;
height: 31px;
}
.arw-white-sm-right-3 {
width: 6px;
height: 13px;
margin-left: 7px;
}
.apple-logo, .android-logo {
width: 25px;
height: 30px;
}
.pointer-icon {
width: 13px;
height: 20px;
}
.cart-icon {
width: 24px;
height: 18px;
}
.bubble-icon {
width: 20px;
height: 19px;
}
.faq-icon, .star-icon {
width: 20px;
height: 20px;
}
.white-4g-txt, .white-3g-txt {
height: 18px;
}
.white-4g-txt {
width: 55px;
}
.white-3g-txt {
width: 32px;
}
.black-4g-txt {
width: 32px;
height: 18px;
}
.info-white-icon {
width: 22px;
height: 22px;
}
.circle-checked-icon, .info-yellow-icon {
width: 60px;
height: 60px;
}
.info-yellow-icon.-fix {
width: 50px;
height: 50px;
}
.print-icon {
width: 35px;
height: 35px;
}
.bubble-small-icon {
width: 42px;
height: 34px;
}
.calendar-icon, .clock-icon {
width: 25px;
height: 25px;
}
.arw-blue-right, .arw-red-right {
width: 8px;
height: 14px;
}
.arw-gray-sm-right {
width: 6px;
height: 11px;
}
.arw-black-right, .arw-black-btm {
width: 9px;
height: 19px;
}
.info-red-icon {
width: 15px;
height: 15px;
}
.green-checked-icon {
width: 14px;
height: 12px;
}
.fb-icon, .tw-icon, .yt-icon {
width: 30px;
height: 30px;
}
.trueu-bg {
margin-top: -16.66666666666667%;
}
.tel-red-icon {
width: 18px;
height: 18px;
}
.gray-mobile-icon, .white-mobile-icon {
width: 32px;
height: 44px;
}
.two-mobile-icon {
width: 39px;
height: 44px;
}
.orange-4g-icon, .yellow-4g-icon, .gray-4g-icon {
width: 80px;
height: 45px;
}
.orange-4g-5g-icon, .yellow-4g-5g-icon, .gray-4g-5g-icon {
width: 38px;
height: 31px;
}
.orange-5g-icon, .yellow-5g-icon, .gray-5g-icon {
width: 82px;
height: 36px;
}
.white-3g-icon, .yellow-3g-icon {
width: 37px;
height: 23px;
}
.visa-logo {
width: 60px;
height: 19px;
}
.mastercard-cmn-logo {
width: 50px;
height: 30px;
}
.vrf-visa-logo {
width: 60px;
height: 35px;
}
.mastercard-logo {
width: 72px;
height: 26px;
}
.phone-gray-icon {
width: 35px;
height: 32px;
}
.comp-white-icon, .comp-sm {
width: 37px;
}
.comp-white-icon {
height: 42px;
}
.comp-sm {
height: 32px;
}
.tv-white-icon {
width: 33px;
height: 30px;
}
.gray-wifi-icon, .white-wifi-icon {
width: 34px;
height: 24px;
}
.vo-wifi-icon {
width: 25px;
height: 25px;
}
.white-money-icon, .gray-money-icon {
width: 30px;
height: 30px;
}
.number-one-icon {
width: 88px;
height: 60px;
}
.ie8 .number-one-icon {
margin-left: -44px;
margin-top: -30px;
}
.number-one-th-icon {
width: 60px;
height: 59px;
}
.ie8 .number-one-th-icon {
margin-left: -30px;
margin-top: -30px;
}
.music-icon {
width: 35px;
height: 38px;
}
.ie8 .music-icon {
margin-left: -17px;
margin-top: -19px;
}
.vdo-icon {
width: 35px;
height: 40px;
}
.ie8 .vdo-icon {
margin-left: -17px;
margin-top: -20px;
}
.thumbsup-icon {
width: 36px;
height: 36px;
}
.ie8 .thumbsup-icon {
margin-left: -18px;
margin-top: -18px;
}
.joystick-icon {
width: 48px;
height: 33px;
}
.ie8 .joystick-icon {
margin-left: -24px;
margin-top: -16px;
}
.pins-icon {
width: 48px;
height: 46px;
}
.ie8 .pins-icon {
margin-left: -24px;
margin-top: -23px;
}
.wifi-med-icon {
width: 45px;
height: 36px;
}
.ie8 .wifi-med-icon {
margin-left: -22px;
margin-top: -18px;
}
.speed-icon {
width: 41px;
height: 37px;
}
.ie8 .speed-icon {
margin-left: -20px;
margin-top: -19px;
}
.auto-login-icon {
width: 36px;
height: 41px;
}
.ie8 .auto-login-icon {
margin-left: -18px;
margin-top: -20px;
}
.phone-cir-red-icon {
width: 35px;
height: 35px;
}
.arw-white-down {
width: 16px;
height: 11px;
}
.arw-md, .arw-up-md-white, .arw-down-md-white {
width: 11px;
height: 5px;
}
.accd-arrow {
width: 18px;
height: 8px;
}
.two-way-arw-white {
width: 7px;
height: 15px;
}
.two-way-arw-sm-black {
width: 12px;
height: 6px;
}
.x-white-icon {
width: 12px;
height: 12px;
}
.social-icon {
width: 25px;
height: 25px;
}
.tvsa-icon {
width: 98px;
}
.img-icons {
margin-top: 3px;
}
.img-icons .tvs-img {
/*width: 104px;*/
max-width: 102px;
max-height: 27px;
}
.img-icons.def-icon .tvs-img {
max-height: none;
}
.inline-list-icon {
margin-top: 5px;
max-width: 88.46153846153846%;
}
.inline-list-style > li {
width: 22px;
}
.cmn-inline-icon > li {
width: 30px;
}
.inline-elm-4 > * {
margin-left: 10px;
}
/* --- TRIANGLES --- */
.ar-triangle {
border-width: 10px 11px;
}
.ie8 .ar-triangle {
margin-left: -10px;
bottom: -20px;
}
.white-triangle:after {
border-width: 20px 21px 0;
}
.arw-down-elm:after {
border-width: 6px 6px 0;
}
/* --- TEXT STYLING --- */
.tbold-large-size {
font-size: 29px;
line-height: 1em;
}
.tmed-xcmn-size, .tbold-large-size-3 {
font-size: 32px;
}
.tbold-xlarge-size, .tboldsp-xlarge-size, .title-8 {
font-size: 48px;
}
.tbold-xlarge-size-2 {
font-size: 47px;
}
.tbold-exlarge-special {
font-size: 240px;
}
.tmed-large-size {
font-size: 36px;
}
.small-title, .common-txt {
font-size: 29px;
}
.common-txt {
margin-top: 1px;
}
.heading-txt-4 {
font-size: 46px;
line-height: 0.8695652173913043em;
}
.cmn-inline-label,
.cmn-top-label {
font-size: 28px;
}
.cmn-inline-label-2 {
font-size: 22px;
line-height: 1em;
}
.cmn-text-1 {
font-size: 20px;
}
.fix-inline-label {
font-size: 26px;
line-height: 0.8846153846153846em;
}
.inner-label {
font-size: 24px;
margin-top: 6px;
}
.sm-label-left {
font-size: 20px;
}
.sm-label {
font-size: 22px;
}
.cmn-label, .cmn-label-left, .cmn-label-right {
font-size: 22px;
}
.cmn-flex-label {
font-size: 27px;
line-height: 0.7407407407407407em;
}
.cmn-txt-label, .cmn-txt-label-xs-2 {
font-size: 17px;
line-height: 0.8235294117647059em;
}
.cmn-txt-label.-med {
font-size: 20px;
line-height: 1em;
}
.cmn-txt-label-btm {
font-size: 20px;
line-height: 0.75em;
margin-top: 9px;
}
.common-txt-2 {
font-size: 39px;
}
.inline-label-2 {
color: #555;
font-size: 30px;
line-height: 0.8em;
vertical-align: middle;
}
.med-txt-label {
font-size: 28px;
}
.lbl-block {
margin-bottom: 10px;
}
.cmn-txt-label-sm, .cmn-txt-label-sm-btm {
font-size: 18px;
}
.cmn-txt-label-sm-btm {
margin-top: 5px;
}
.inline-label {
font-size: 30px;
}
.splitbox-left .row-element-4:last-child {
text-align: left;
}
.splitbox-left .common-txt {
margin-top: 6px;
}
.heading-two-line {
font-size: 46px;
margin-bottom: 15px;
}
.sec-line-txt {
font-size: 32px;
}
.prg-ctn-3 {
font-size: 29px;
}
.sec-line-txt-xs {
font-size: 17px;
line-height: 0.7647058823529412em;
}
.hpl-link-box {
font-size: 22px;
line-height: 1em;
margin-top: 30px;
}
.hpl-link-box.-med {
font-size: 28px;
}
.hpl-med-size {
font-size: 26px;
line-height: 1em;
}
.hpl-link-box .list-view-icon, .hpl-link-box .map-view-icon {
margin-right: 10px;
}
.tmed-md-size {
font-size: 36px;
}
.small-txt-size {
font-size: 22px;
}
.cmn-txt-size {
font-size: 25px;
}
.med-txt-size {
font-size: 46px;
}
.label-heading.-spacebottom {
margin-bottom: 25px;
}
.title-8 {
margin-bottom: 25px;
}
.heading-title {
font-size: 34px;
padding: 10px 20px;
}
.hpl-link-box.hpl-abs-box {
right: 20px;
margin-top: -10px;
-webkit-transform: none;
transform: none;
}
.md-modal .cmn-txt-label-sm, .md-modal .cmn-txt-label-sm-btm, .md-modal .cmn-txt-label, .md-modal .cmn-txt-label-btm {
font-size: 20px;
}
.md-modal .md-txt-label {
font-size: 32px;
}
.md-modal .med-txt-label {
font-size: 28px;
}
.md-prg-box .tbold-exlarge-special {
margin-top: 0;
}
.md-modal .slc-cmn-style {
height: 42px;
}
.md-modal .slc-cmn-style .slcm-txt {
font-size: 27px;
}
.md-header .white-wifi-icon {
position: relative;
top: 2px;
width: 34px;
height: 24px;
vertical-align: top;
}
/* --- CHECKBOX --- */
.checkbox-sm {
width: 15px;
height: 15px;
}
.checkbox-sm .checked-icon {
width: 10px;
height: 8px;
}
.ie8 .checkbox-sm .checked-icon {
top: 4px;
left: 3px;
width: 9px;
height: 8px;
background-position: -84px -1768px;
}
.checked-white-icon, .checked-grey-icon {
width: 12px;
height: 9px;
}
/* --- INPUT --- */
.cmn-input {
font-size: 26px;
}
.cmn-input, .input-styling, .input-styling-2 {
height: 42px;
}
.ie8 .cmn-input, .ie8 .input-styling, .ie8 .input-styling-2 {
line-height: 38px;
}
.input-medium, .input-xmedium-3, .input-xlong {
height: 44px;
}
.sq-input {
width: 34px;
height: 34px;
font-size: 23px;
}
.input-xmedium-2 {
width: 330px;
height: 46px;
}
.ie8 .input-xmedium-2 {
line-height: 44px;
}
.input-xmedium-3 {
min-width: 458px;
}
.input-small {
width: auto;
min-width: 100px;
}
/*.input-xlong {
width: 720px;
}*/
.input-box-2 {
width: 552px;
}
.input-styling-2 {
font-size: 27px;
}
/* --- SELECTMENU --- */
.select-menu {
height: 30px;
padding-left: 10px;
padding-right: 30px;
}
.slc-cmn {
width: 250px;
}
.sq-select, .slcmn-style {
height: 44px;
}
.ie9 .sq-select, .ie9 .slcmn-style, .ie8 .sq-select, .ie8 .slcmn-style {
line-height: 40px;
}
.slcmn-style {
padding-left: 10px;
padding-right: 50px;
}
.slc-arw-box {
width: 50px;
}
.slc-with-label, .slc-cmn-style {
height: 42px;
line-height: 42px;
}
.slc-with-label {
padding-left: 0;
}
.slc-with-label .slc-label, .slc-with-label .slcm-txt {
font-size: 28px;
}
.slc-medium-3 {
width: 338px;
}
.slcmn-style .slcm-txt, .sq-select .slcm-txt {
font-size: 26px;
}
.slcm-txt {
font-size: 20px;
}
.ie9 .slcm-txt, .ie8 .slcm-txt {
display: inline-block;
vertical-align: middle;
}
.abs-select {
width: 190px;
right: 15px;
margin-top: 18px;
}
.abs-select .select-menu {
height: 32px;
}
.abs-select .slcmn-style {
padding-right: 30px;
}
.abs-select .slcm-txt {
font-size: 20px;
}
.abs-select .slc-arw-box {
width: 30px;
}
.abs-select .arw-white-down {
width: 14px;
height: 10px;
}
.box-main-wrap .abs-select:first-child {
min-height: 50px;
padding-top: 18px;
}
.box-main-wrap .abs-select:first-child .select-menu {
width: 190px;
margin-right: 15px;
}
/* --- TEXTAREA --- */
.cmn-txtarea, .feed-contact .cmn-txtarea {
font-size: 20px;
}
/* --- BUTTONS --- */
.cmn-button, .square-button {
width: 80px;
height: 30px;
}
.flex-btn-fix {
width: auto;
min-width: 120px;
height: 38px;
}
.button-xs {
width: auto;
min-width: 80px;
height: 24px;
}
.button-xsm-2 {
width: 68px;
}
.button-xsm-2.-flexible {
min-width: 100px;
width: auto;
}
.button-xmd, .md-modal .button-xmd {
width: 166px;
height: 40px;
}
.button-flex {
min-width: 130px;
width: auto;
height: 42px;
}
.flex-btn-sm {
min-width: 10px;
height: 34px;
}
.flex-btn-sm-fix, .flex-btn-med-fix {
min-width: 70px;
height: 34px;
}
.ie9 .flex-btn-sm, .ie8 .flex-btn-sm {
line-height: 30px;
}
.button-xmd .button-txt, .button-flex .button-txt {
font-size: 26px;
}
.md-modal .button-flex {
height: 40px;
}
.md-modal .flex-btn-sm {
height: 30px;
}
.md-modal .button-xmd .button-txt, .md-modal .button-flex .button-txt {
font-size: 26px;
}
.md-modal .flex-btn-sm .button-txt {
font-size: 20px;
}
.flex-btn-sm-fix .button-txt, .flex-btn-med-fix .button-txt {
font-size: 22px;
}
.button-txt, .ui-btn-md span {
display: block;
font-size: 20px;
line-height: normal;
}
.btn-inline .img-btn {
width: 136px;
margin-left: 10px;
}
.sq-btn-med {
min-width: 130px;
}
.sq-btn-med-2 {
min-width: 100px;
height: 36px;
}
.square-button, .sq-btn-flex {
width: auto;
}
.sq-btn-flex {
height: 24px;
}
.sq-btn-flex.long {
min-width: 140px;
}
.sq-btn-sm {
min-width: 50px;
height: 22px;
}
.button-txt-sm {
font-size: 20px;
}
.button-txt-xs {
font-size: 17px;
}
.flex-btn-sm .button-txt, .square-button .button-txt {
font-size: 22px;
}
.sq-btn-med-2 .button-txt {
font-size: 25px;
}
.loading-btn {
min-width: 0;
}
.loading-btn-box.abs-btm-rigt {
bottom: -7px;
}
.ui-btn-style span {
padding-left: 6px;
}
.ui-btn-style:before {
border-width: 7px 7px 0 0;
}
.ui-btn-style:after {
width: 7px;
height: 16px;
}
.ui-btn-md {
min-width: 64px;
min-height: 24px;
}
.ui-btn-md:before {
border-width: 8px 8px 0 0;
}
.ui-btn-md:after {
width: 8px;
height: 17px;
}
.ie8 .ui-btn-style:before, .ie8 .ui-btn-style:after {
right: -7px;
}
.ie8 .ui-btn-md:before, .ie8 .ui-btn-md:after {
right: -8px;
}
.btn-float .ui-btn-style {
margin-left: 12px;
}
.nm-btn, .list-style4 .nm-btn {
width: auto;
min-width: 140px;
height: 28px;
}
.nm-btn > span {
font-size: 22px;
}
.mtp-btn-block .nm-btn > span {
font-size: 20px;
}
.md-btn > span, .list-style4 .nm-btn > span {
font-size: 20px;
}
.md-btn {
height: 28px;
}
.view-btn {
left: auto;
right: 0;
margin-right: 2.727272727272727%;
margin-bottom: 80px;
}
.nm-btn.flex-button {
min-height: 28px;
height: auto;
min-width: 90px;
}
.box-top-inner .view-btn {
margin-bottom: 16px;
}
.box-top-inner .view-btn, .main-content .box-content.box-style:first-child .box-top-inner .view-btn {
right: 12px;
margin-right: 1.333333333333333%;
}
.main-content .box-content.box-style:first-child .box-inner, .main-content .cmn-tab-head + .box-content.box-style .box-inner {
height: 64px;
min-height: 64px;
}
.main-sec {
min-height: 417px;
min-height: 46.33333333333333vw;
}
.fixed-menu .main-sec {
margin-top: 0;
}
.main-bg-top {
position: absolute;
right: 23.37837837837838%;
top: 0;
width: 23.24324324324324%;
padding-bottom: 11.75675675675676%;
background-size: 450.4504504504505% 1777.777777777778%;
background-position: 100% 2.781456953642384%;
z-index: 1;
}
.main-bg-right {
position: absolute;
top: 0;
right: 4.864864864864865%;
width: 36.68918918918919%;
padding-bottom: 28.71621621621622%;
background-size: 284.9002849002849% 728.5974499089253%;
background-position: 0 82.17907852796291%;
z-index: 2;
}
.main-bg-right.hidden-bg {
right: -1.689189189189189%;
background-position: 9.63020030816641% 82.17907852796291%;
}
.tooltip-box {
vertical-align: top;
}
.edge-bg-img, .box-content-4 .edge-bg-img {
background-size: auto;
padding-bottom: 0;
}
.edge-bg-img, .box-content-4 .edge-bg-img {
width: 298px;
height: 124px;
background-position: -739px -794px;
}
.edge-bg-img-2 {
width: 240px;
height: 90px;
padding-bottom: 0;
}
.banner-box {
top: 0;
width: 164.4444444444444%;
max-width: 1920px;
}
.main-banner .owl-dots {
height: 12px;
margin-bottom: 8.108108108108108%;
}
.main-banner .owl-dot {
margin-left: 10px;
}
.sm-banner-box {
width: 59.45945945945946%;
max-width: 1100px;
margin-bottom: 0.6756756756756757%;
}
.sm-banner-box .owl-item:first-child {
text-align: left;
}
.sm-banner-box .owl-item:first-child + .owl-item {
text-align: right;
}
.sm-banner {
width: 98.83720930232558%;
}
.sm-banner > li h3 {
font-size: 26px;
margin-bottom: 6px;
}
.sm-banner > li {
font-size: 18px;
width: 65.28735632183908%;
}
.sm-banner > li:first-child {
width: 34.58823529411765%;
}
.sm-banner > li > a {
padding: 10px 12px;
overflow: hidden;
}
.sm-banner > li:first-child > a {
padding-bottom: 0;
}
.sm-banner > li:first-child > a img {
position: relative;
top: 0;
-webkit-transform: none;
transform: none;
}
.sm-banner-box .owl-item:first-child li:first-child + li > a,
.sm-banner-box .owl-item:first-child + .owl-item li:first-child + li > a {
min-height: 78px;
}
.sm-banner-box .owl-item:first-child li:first-child + li > a {
padding-right: 12px;
}
.sm-banner-box .owl-item:first-child + .owl-item li:first-child + li > a {
padding-left: 12px;
}
.sm-banner-box .owl-item:first-child .sm-banner, .sm-banner-box .owl-item:first-child li:first-child img {
border-radius: 12px 0 0 12px;
}
.sm-banner-box .owl-item:first-child + .owl-item .sm-banner, .sm-banner-box .owl-item:first-child + .owl-item li:first-child img {
border-radius: 0 12px 12px 0;
}
.slogan-box {
top: 45px;
top: 68px;
right: 19.32432432432432%;
margin-top: 3.040540540540541%;
}
.main-content.t-line {
padding-top: 8px;
}
.main-content.t-line:after {
height: 8px;
}
.box-content {
margin-top: -193px;
margin-bottom: 135px;
}
.box-content.box-style, .box-content.box-banner-top {
margin-bottom: 60px;
}
.box-content.box-style, .box-content-4 + .box-content.box-style {
margin-top: -120px;
}
.box-content.no-top-spc {
margin-bottom: 68px;
}
.box-content.spc-btm {
margin-bottom: -4.888888888888889%;
}
.box-style:first-child + .box-style-2 {
margin-top: -111px;
}
.box-style-2 {
margin-top: -10%;
margin-bottom: 5.555555555555556%;
}
.bnr-box-ctn {
margin-top: 0;
margin-bottom: 60px;
}
.bnr-img-box {
border-bottom-width: 7px;
}
.box-top-cmn > .cmn-tab-head, .box-top-inner > .cmn-tab-head {
bottom: 7px;
}
.box-top-inner > .cmn-tab-head {
right: 25px;
}
.box-top-cmn {
min-height: 81px;
}
.box-top-cmn h2, .box-top-inner h1, .box-top-inner h2, .box-ctn-mini h2, .tlight-large-size {
font-size: 48px;
}
.box-top-cmn.border-btm-before h2, .box-top-inner h1, .box-top-inner h2 {
margin-top: 38px;
margin-left: 15px;
}
.border-btm-before:before, .bdr-btm-orange:before {
height: 7px;
}
.bdr-btm-orange:before {
top: -7px;
}
.box-top-cmn > .cmn-tab-head {
right: 10px;
right: 1.111111111111111vw;
}
.box-top-head-2 {
padding-top: 35px;
border-width: 7px;
}
.box-top-head-2 > h1 {
margin-left: 25px;
margin-top: 6px;
}
.box-top-head-2 .tab-head-styling {
margin-right: 25px;
padding-right: 0;
}
.box-top-head-2 .tab-head-styling > li {
text-transform: none;
padding-left: 12px;
padding-right: 12px;
}
.box-top-head-2 .list-select-group + h1 {
margin-top: 6px;
width: auto;
margin-right: 10px;
}
.box-top-head-2 .list-select-group {
position: relative;
top: -10px;
margin-bottom: 4px;
}
.box-head-styling .list-select-group {
margin-right: 20px;
margin-bottom: 10px;
}
.tab-head-styling, .tab-head-styling-2 {
padding-top: 26px;
}
.tab-head-styling.pull-left {
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.cmn-tab-head > li > span, .cmn-tab-head > li > a {
font-size: 28px;
}
.cmn-tab-head > li {
min-width: 285px;
min-height: 42px;
padding-left: 10px;
padding-right: 10px;
margin-left: 10px;
text-transform: uppercase;
}
.tab-nmr-text > li {
text-transform: none;
}
.cmn-tab-holder {
height: 68px;
}
.med-tab-holder-2 {
height: 154px;
}
.tab-head-med > li {
min-width: 180px;
}
.tab-head-med > .topup-tab {
min-width: 172px;
min-height: 64px;
margin-left: 4px;
}
.box-main-2 {
min-height: 510px;
}
.box-main-2.fix-height {
min-height: 200px;
}
.img-bg-box img {
width: 1100px;
}
.img-box-1 img {
left: -56px;
}
.img-bg-box.bg-pos-top img {
left: 0;
}
.box-main-2, .img-bg-box, .img-bg-box img, .img-bg-box .items-slides, .box-btm,
.img-bg-box .comp-img-slide .items-slides, .img-bg-box .comp-img-slide .items-slides img {
border-radius: 0 0 0 90px;
}
.box-top-2, .bnr-box-ctn, .bnr-img-box, .bnr-img-box img {
border-top-right-radius: 90px;
}
.box-top-2 {
padding-bottom: 10%;
}
.box-top-2:after {
height: 150%;
left: -2.083333333333333%;
margin-top: 3.333333333333333%;
}
.box-style-2 + .bnr-box-ctn {
margin-top: -40px;
}
.bnr-desc-box {
left: auto;
right: 21.11111111111111%;
margin-bottom: 1.777777777777778%;
}
.bnr-desc-box h5 {
font-size: 35px;
margin-bottom: 5px;
}
.bnr-desc-box .btn-inline .img-btn {
width: 136px;
margin-left: 15px;
}
.box-btm-2 {
width: 1120px;
height: 88px;
padding-bottom: 0;
margin-top: -87px;
margin-bottom: 0;
bottom: -46px;
}
.box-inner {
min-height: 50px;
}
.box-top {
top: 50px;
height: 160px;
border-radius: 0 90px 0 0;
}
.box-top-inner {
min-height: 50px;
padding-top: 60px;
}
.box-top-inner.border-btm-before h1, .box-top-inner.border-btm-before h2 {
margin-top: 7px;
}
.box-style .box-top-inner h1, .box-style .box-top-inner h2 {
margin-left: 24px;
}
.box-main-inner {
padding-bottom: 96px;
}
.fix-height .view-btn {
margin-bottom: 8%;
}
.heading-tab {
padding: 15px 15px 0 15px;
}
.heading-tab > h3 {
display: inline-block;
vertical-align: top;
}
.abs-txt-title {
position: absolute;
width: auto;
right: 270px;
bottom: 14px;
min-height: 26px;
}
.tab-inner > li {
width: 118px;
height: 40px;
margin-left: 5px;
}
.box-ctn-inner-2 .btn-block {
margin-top: 20px;
}
.box-ctn-inner-2 .btn-block .button-txt-sm {
font-size: 26px;
}
/*.map-box {
height: 500px;
height: 55.55555555555556vw;
}*/
.splitbox-ctn {
padding: 42px 25px 155px;
text-align: center;
}
.splitbox-left, .splitbox-right {
text-align: left;
vertical-align: top;
}
.splitbox-left {
width: 61.29411764705882%;
max-width: 600px;
}
.splitbox-right {
width: 35.29411764705882%;
margin-left: 2.705882352941176%;
margin-top: 0;
}
.splitbox-right .acd-ctn {
max-height: none;
}
.splitbox-right > .acd-box > h2, .splitbox-right > .acd-box > h3 {
font-size: 32px;
min-height: 48px;
line-height: 48px;
padding-left: 20px;
padding-right: 20px;
}
.form-xlarge {
margin: 30px auto 0;
}
.row-element-wrap {
max-width: 730px;
margin: 0 auto;
}
.row-element-4 {
margin-top: 30px;
}
.row-element-4 > div {
float: left;
width: 45.3416149068323%;
margin-left: 2.879078694817658%;
}
.row-element-4 > div:first-child {
min-width: 50.77639751552795%;
margin-left: 0;
}
.row-element-4 .inline-label-2 {
margin-top: 8px;
margin-bottom: 0;
}
.row-element-4 > .exp-date-box {
position: relative;
}
.row-element-5 {
margin-top: 25px;
margin-bottom: 60px;
}
.date-time-box {
margin-top: 20px;
}
.inline-box-inner .date-time-box .row-element > div {
width: 48%;
}
.inline-box-inner .cmn-inline-label {
width: auto;
}
.date-time-box .row-element > div:first-child {
margin-left: 0;
}
.cur-bal > div:nth-child(2) {
position: relative;
top: 0;
-webkit-transform: none;
transform: none;
}
.cur-bal .inline-label-2 {
margin-top: 5px;
}
.toggle-loader-box .spinner-box {
right: auto;
left: 0;
}
.ctn-acd-header {
min-height: 48px;
line-height: 48px;
}
.acd-hdr-inner {
width: 65.69343065693431%;
}
.splitbox-right .ctn-acd-header h3 {
font-size: 27px;
padding-left: 25px;
}
.tab-topup .button-flex, .cmn-tab-head-2 > li:first-child {
margin-left: 0;
}
.cmn-tab-head-2 {
font-size: 24px;
padding-right: 25px;
}
.cmn-tab-head-2 > li {
margin-right: 0;
margin-left: 58px;
}
.cmn-tab-head-2 > li a {
display: block;
padding-top: 14px;
padding-bottom: 14px;
}
.cmn-tab-head-2 > li a:after {
bottom: 10px;
}
.component > .ctn-slides {
min-height: 523px;
padding-bottom: 0;
}
.ctn-slides .items-slides {
height: 523px;
}
.ctn-slides.owl-carousel .items-slides {
height: auto;
}
.ctn-slides > .items-slides img, .ctn-slides.owl-carousel {
width: 1100px;
}
.component-slide .owl-prev {
left: 110px;
}
.component-slide .owl-next {
right: 110px;
}
.group-ctn-box {
bottom: 67px;
margin-bottom: 0;
}
.group-ctn-box > div {
min-height: 112px;
}
.group-ctn-box h3 {
font-size: 26px;
line-height: 18px;
margin-bottom: 5px;
}
.price-txt, .price-txt-2 {
font-size: 60px;
}
.price-txt span, .price-txt-2 span {
font-size: 22px;
right: -14px;
top: 0;
}
.price-txt-2 {
margin-bottom: 23px;
}
.abs-txt-mini {
font-size: 20px;
margin-bottom: 48px;
}
.box-main-inner > .splitbox-ctn .splitbox-left {
max-width: 700px;
width: 82.35294117647059%;
margin: 20px auto 60px;
}
.box-main-inner > .splitbox-ctn .splitbox-left .inline-label-2 {
font-size: 32px;
line-height: 0.75em;
}
.box-main-inner > .splitbox-ctn .splitbox-right {
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.box-main-inner .splitbox-right .box-ctn-acd-3 {
padding-left: 10px;
padding-right: 10px;
}
.box-main-inner .splitbox-right .box-ctn-acd {
width: 94.89795918367347%;
margin: 0 auto;
}
.box-main-inner .splitbox-right > .acd-box > h2, .box-main-inner .splitbox-right > .acd-box > h3 {
font-size: 34px;
}
.box-main-inner .splitbox-right .ctn-acd-header h2, .box-main-inner .splitbox-right .ctn-acd-header h3 {
font-size: 32px;
}
.box-main-inner .row-element-4 > div, .box-main-inner .row-element-4 > div:first-child {
width: 45.71428571428571%;
}
.box-main-inner .row-element-4 > div:first-child {
min-width: 45.71428571428571%;
text-align: right;
}
.inline-label-2 .cmn-txt-label {
margin-top: 5px;
}
.row-element-4 .logo-inline > li {
margin-left: 6px;
}
.row-element-4 .logo-inline > li:first-child {
margin-left: 0;
}
.row-element-4 .visa-logo {
width: 40px;
height: 14px;
}
.row-element-4 .mastercard-cmn-logo {
width: 40px;
height: 24px;
}
.row-element-4 .vrf-visa-logo {
width: 40px;
height: 23px;
}
.row-element-4 .mastercard-logo {
width: 50px;
height: 18px;
}
.splitbox-right .box-acd-ctn-inner {
padding: 10px 27px 20px;
text-align: left;
}
.splitbox-right .prg-ctn-2 {
font-size: 26px;
}
.splitbox-right .content-inline > div:first-child {
width: 38.61003861003861%;
max-width: 342px;
}
.splitbox-right .content-inline > div:first-child + div {
margin-top: 0;
margin-left: 30px;
}
.splitbox-right .content-inline > div:first-child + div > h4,
.splitbox-right .content-inline > div:first-child + div .prg-ctn-2 {
text-align: center;
}
.splitbox-right .box-acd-ctn-inner h4 {
font-size: 30px;
margin-bottom: 20px;
text-align: left;
}
.splitbox-right .btn-inline {
width: 255px;
}
.splitbox-right .content-inline > div img {
width: 100%;
}
.splitbox-right .box-acd-ctn-inner, .splitbox-right .inline-block-list > li > div:first-child > span {
font-size: 28px;
}
.splitbox-right .inline-block-list > li > div:first-child {
min-width: 200px;
text-align: right;
}
.splitbox-right .inline-block-list > li {
margin-bottom: 15px;
}
.splitbox-right .logo-list {
max-width: 780px;
}
.slide-nav-prev, .slide-nav-next {
margin-top: -40px;
}
.slide-nav-prev {
left: 10px;
}
.slide-nav-next {
right: 10px;
}
.cmn-paging, .component-slide .owl-dots {
width: auto;
height: 12px;
left: auto;
right: 120px;
bottom: 50px;
margin-bottom: 4.090909090909091%;
}
.cmn-paging {
right: 30px;
bottom: 43px;
margin-bottom: 4.777777777777778%;
-webkit-transform: none;
transform: none;
}
.cmn-paging > span {
width: 10px;
height: 10px;
}
.main-bnr-box .owl-dots {
margin-bottom: 40px;
}
.box-ctn-inner, .slide-box-med, .slide-med-size img, .slide-desc-box:after {
border-radius: 0 0 0 90px;
}
.box-ctn-rotate.-fixcurve .box-ctn-inner,
.box-ctn-rotate.-fixcurve .slide-box-med,
.box-ctn-rotate.-fixcurve .slide-med-size,
.box-ctn-rotate.-fixcurve .owl-item.active .img-slider-list-item img {
border-radius: 0 0 0 90px;
}
.box-content-3 {
max-width: 1100px;
margin: -175px auto 0;
padding-bottom: 5.555555555555556%;
}
.box-content-3:before {
top: 0;
left: 34.44444444444444%;
width: 14px;
margin-top: 3.777777777777778%;
margin-left: -12px;
}
.box-content-3:after {
width: 104.4444444444444%;
margin-bottom: 4.888888888888889%;
}
.box-img-styling .ctn-slides {
min-height: 512px;
min-height: 56.88888888888889vw;
}
.box-content-4 {
margin: -12.44444444444444% auto 6.555555555555556%;
max-width: 1100px;
padding-top: 4.444444444444444%;
margin: -12.44444444444444vw auto 6.555555555555556vw;
}
.box-content-4:before {
margin-top: 3.333333333333333%;
margin-top: 3.333333333333333vw;
padding-bottom: 1.111111111111111%;
}
.box-content-4:after {
margin-bottom: -0.8888888888888889%;
margin-bottom: -0.8888888888888889vw;
padding-bottom: 4.444444444444444%;
}
.box-content-4 .img-box-4, .box-content-4 .img-cmn-screen img {
border-radius: 0 90px;
}
.box-content-4 .-fixcurve .img-box-4, .box-content-4 .-fixcurve .img-cmn-screen img {
border-top-right-radius: 0;
}
.box-content-4 .box-ctn-rotate {
left: -4.888888888888889%;
left: -4.888888888888889vw;
}
.box-content-4 .box-ctn-inner {
margin-top: -2.712815715622077%;
}
.box-ctn-inner > .ar-triangle:first-child {
margin-top: 6.741573033707865%;
}
.box-ctn-inner-2.-style {
padding-top: 9.363295880149813%;
}
.btm-line-long:after {
height: 7px;
}
.tab-inner > li {
border-bottom-width: 7px;
}
.icon-nav > li {
border-radius: 0 10px 10px 0;
}
.icon-nav > .number-one, .tag-box-2 {
border-radius: 0 15px 15px 0;
}
.heading-txt-shadow {
font-size: 32px;
margin-bottom: 10px;
}
.heading-txt-shadow.-large {
font-size: 48px;
}
.mtp-column-wrap {
padding-left: 100px;
padding-right: 100px;
margin-top: 15px;
margin-bottom: 20px;
}
.mtp-col-box-6 > .rows {
width: 49%;
margin-right: 2%;
margin-bottom: 16px;
}
.cmn-list-txt {
font-size: 24px;
}
.cmn-list-txt.-underline > .cmn-list-item > a {
padding-top: 15px;
padding-bottom: 15px;
}
.cmn-list-txt > .cmn-list-item .arw-list-orange {
width: 12px;
height: 19px;
margin-top: 19px;
}
.box-ctn-inner-2 .med-gray-button {
width: 124px;
height: 44px;
}
.box-ctn-inner-2 .med-gray-button .button-txt {
font-family: 'TrueBold';
font-size: 32px;
}
.box-ctn-inner-3 {
margin-top: 30px;
}
.heading-tab > h3 {
font-family: 'TrueMedium';
font-size: 38px;
}
.abs-txt-title {
font-size: 23px;
}
.box-wrap-left, .box-wrap-right {
margin-top: 5%;
}
.box-wrap-left {
width: 33.33333333333333%;
}
.box-ctn-inner:after {
visibility: visible;
margin-bottom: -8%;
}
.slide-desc-box {
min-height: 80px;
}
.slide-desc-box p {
font-size: 24px;
line-height: 20px;
}
.slide-desc-box a {
padding-left: 16.66666666666667%;
}
.box-wrap-right {
width: 66.66666666666667%;
}
.box-ctn-mini {
padding: 2.5% 0 12% 12px;
}
.box-ctn-mini:after {
border-radius: 0 90px 0 0;
}
.box-ctn-mini h2 {
text-align: right;
margin-left: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mini-list-box {
width: 91.83673469387755%;
}
.mini-list-box > li, .mini-list-box .owl-item > li {
height: auto;
}
.mini-list-box .owl-next, .mini-list-box .owl-prev {
width: 13px;
height: 28px;
}
.arw-gray-prev {
width: 12px;
height: 25px;
}
.mini-list-box .owl-prev {
left: -16px;
}
.mini-list-box .owl-next {
right: -16px;
}
.mini-list-box .owl-item {
text-align: center;
}
.mini-list-box .owl-item > li {
display: inline-block;
width: 95.55555555555556%;
}
.mini-list-box .owl-item img {
left: 0;
width: 100%;
-webkit-transform: none;
transform: none;
}
.mini-desc-box {
min-height: 30px;
font-size: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.mini-desc-box p {
padding-left: 8px;
padding-right: 8px;
}
.box-ctn-mini .view-btn {
right: auto;
left: 20px;
margin-left: 3.333333333333333%;
margin-bottom: 32px;
}
.box-style .box-top-inner h1, .box-style .box-top-inner h2 {
margin-top: 9px;
}
.box-top-styling {
min-height: 50px;
padding-top: 60px;
}
.box-style .box-top-styling h1, .box-style .box-top-styling h2 {
margin-top: 9px;
}
.box-top-inner h1 span, .box-top-inner h2 span {
font-size: 34px;
margin-top: 0;
}
.inline-icon {
margin-top: 30px;
}
.box-main-inner .splitbox-left .box-spacing {
padding-top: 0;
padding-bottom: 0;
}
.box-spacing {
width: 96.66666666666667%;
padding-top: 80px;
padding-bottom: 40px;
}
.box-styling {
padding-top: 20px;
}
.title-txt-box .circle-checked-icon, .title-txt-box .info-yellow-icon {
margin-bottom: 25px;
}
.title-txt-box > h2 {
font-size: 48px;
line-height: normal;
margin-bottom: 10px;
}
.title-txt-box > h3 {
font-size: 30px;
}
.title-txt-small {
font-size: 0.7333333333333333em;
}
.form-large {
margin-top: 50px;
margin-bottom: 60px;
}
.form-heading {
margin-bottom: 15px;
}
.box-5 {
max-width: 900px;
font-size: 26px;
padding: 60px 20px;
margin-top: 60px;
}
.box-5-inner > div {
padding-left: 57px;
margin-top: 35px;
}
.box-5 .print-icon {
left: 3px;
}
.box-5 .bubble-small-icon {
margin-top: -3px;
}
.long-box {
max-width: 1010px;
}
.cmn-heading-box, .cmn-footer-box {
padding-left: 25px;
padding-right: 25px;
}
.cmn-heading-box {
font-size: 34px;
min-height: 48px;
}
.cmn-footer-box > div:first-child + div {
margin-left: 2px;
}
.cmn-ctn-list {
font-size: 27px;
}
.cmn-ctn-list > li {
padding-top: 20px;
padding-bottom: 20px;
margin-left: 25px;
margin-right: 25px;
}
.cmn-box-ctn-2 {
width: 600px;
padding: 30px 20px;
}
.cmn-box-ctn-2 > h3 {
margin-bottom: 20px;
}
.cmn-box-ctn-2 .inline-box-inner {
width: auto;
}
.cmn-box-ctn-2 .title-6 {
margin-bottom: 30px;
}
.inline-box-inner .row-element {
margin-bottom: 30px;
}
.box-4 {
display: inline-block;
width: 100%;
padding: 60px 30px;
text-align: center;
vertical-align: top;
box-sizing: border-box;
max-width: 980px;
}
.box-4 .multiple-col-box {
width: 46.42857142857143%;
min-height: 225px;
margin-top: 0;
padding-top: 15px;
padding-bottom: 15px;
}
.box-4 .multiple-col-box:first-child {
line-height: 225px;
margin-left: 0;
padding-top: 15px;
padding-bottom: 15px;
}
.box-4 .multiple-col-box:first-child:after {
width: 8px;
right: -4px;
}
.box-4 .multiple-col-box:first-child:last-child {
line-height: normal;
min-height: 100px;
padding-top: 30px;
padding-bottom: 30px;
}
.box-4 .multiple-col-box .title-4 {
position: static;
display: inline-block;
vertical-align: middle;
}
.box-4 .multiple-col-box .input-xmedium-2 {
margin: 0 auto;
}
.box-4 .circle-box-elm {
position: absolute;
font-size: 30px;
top: 50%;
left: 50%;
width: 50px;
height: 50px;
border-width: 10px;
margin-top: -35px;
margin-left: -35px;
-webkit-transform: none;
transform: none;
}
.box-4 .multiple-col-box:first-child .title-4 {
padding-left: 30px;
padding-right: 30px;
}
.box-4 + .bnr-block-med {
margin-top: -60px;
}
.box-4 .multiple-col-box:first-child:last-child .title-5 {
margin-bottom: 18px;
}
.box-4 .multiple-col-box:first-child:last-child .input-xmedium-2 {
width: 360px;
}
.box-4 .row-element > div {
margin-bottom: 20px;
}
.multiple-col-box {
display: inline-block;
vertical-align: top;
width: 45.83333333333333%;
max-width: 442px;
padding: 15px;
}
.circle-box-elm {
width: 50px;
height: 50px;
font-size: 28px;
border-width: 10px;
}
.circ-box {
width: 30px;
height: 30px;
font-size: 19px;
}
.cmn-form-style .tgl-target-elm.actived {
display: block;
}
.cmn-box-outer {
max-width: 940px;
padding-bottom: 50px;
margin: 0 auto;
}
.cmn-box-outer .cmn-tab-head {
margin-bottom: 50px;
}
.cmn-box-outer .cmn-form-style {
padding: 0;
}
.cmn-desc-box h5 {
font-size: 25px;
}
.cmn-desc-box .cmn-inline-label-2 {
width: 425px;
}
.cmn-desc-box .file-btn {
margin-top: 6px;
margin-right: 7px;
}
.cmn-inline-label-2 .mini-block {
margin-top: 5px;
}
.cmn-desc-list {
margin-top: 15px;
}
.cmn-desc-list > li {
font-size: 23px;
margin-top: 10px;
}
.cmn-desc-list + .cmn-desc-list {
margin-top: 20px;
}
.cmn-form-style .captcha-box {
width: 300px;
margin-top: 40px;
margin-bottom: 25px;
}
.form-btm-part {
margin-top: 50px;
}
.box-6 {
max-width: 960px;
padding-top: 10px;
}
.box-6 .acd-box {
background-color: transparent;
text-align: center;
}
.box-6 .title-4 {
font-size: 37px;
text-align: right;
}
.box-6 .multiple-col-box, .box-6 .acd-ctn-box {
display: inline-block;
vertical-align: middle;
}
.box-6 .multiple-col-box {
width: 25.28735632183908%;
max-width: none;
padding: 0;
min-height: 44px;
margin-right: 15px;
}
.box-6 .acd-ctn-box {
width: 63.2183908045977%;
}
.box-6 .inline-row {
width: 100%;
text-align: left;
padding-bottom: 0;
}
.box-6 .inline-row > div {
width: 48%;
margin-left: 3%;
}
.box-6 .circle-box-elm {
width: 40px;
height: 40px;
margin: -5px 0 0 25.28735632183908%;
border: 0;
background-color: #b6b6b6;
}
.sim-type-box .multiple-col-box, .sim-type-box .acd-ctn-box {
vertical-align: top;
}
.sim-type-box .acd-ctn-box {
text-align: right;
}
.sim-list {
width: 98%;
}
.sim-list > li .sim-img {
max-width: none;
width: 120px;
margin-left: 33px;
}
.sim-list {
padding-top: 25px;
padding-bottom: 30px;
}
.box-7 {
margin-top: 50px;
margin-bottom: 50px;
}
.box-7 .sim-list > li {
width: 500px;
padding: 15px;
}
.box-7 .sim-list > li .sim-img {
width: auto;
}
.box-7 .sim-list .cmn-inline-label {
margin-right: 15px;
}
.box-1 {
width: 96.66666666666667%;
max-width: 1060px;
padding-top: 50px;
padding-bottom: 50px;
}
.box-1.box-spacing {
padding-top: 20px;
}
.box-1 .breadcrumb-box, .box-styling .breadcrumb-box {
margin-bottom: 40px;
}
.box-1 .form-med .btn-inline {
margin-top: 60px;
}
.inline-elm-group {
text-align: center;
}
.inline-row, .inline-row.tgl-target-elm.actived {
display: inline-block;
}
.inline-row {
margin-bottom: 40px;
}
.inline-row > div, .inline-row {
margin-left: 12px;
}
.inline-row > div {
width: auto;
vertical-align: middle;
}
.inline-row:first-child, .inline-row > div:first-child {
margin-left: 0;
}
.inline-row > div, .inline-elm-group .inline-row .inline-row-2 {
margin-top: 0;
}
.inline-row .inline-label {
margin-bottom: 0;
}
.input-tel-number .slcmn-style {
width: 198px;
width: 22vw;
max-width: 200px;
}
.input-tel-number .slc-xs {
width: 105px;
}
.row-element > div {
margin-bottom: 40px;
}
.row-element.-three > div, .row-element.-three > div:first-child + div {
width: 30.6667%;
}
.row-element.-three > div:last-child {
margin-left: 4%;
}
.row-element.-three .input-with-btn .cmn-input {
width: 50px;
display: inline-block;
vertical-align: top;
}
.row-element.-three .input-with-btn.-fix .cmn-input {
width: 115px;
}
.input-with-btn {
text-align: left;
}
.input-with-btn .cmn-button {
margin-top: 0;
}
.input-with-btn .cmn-button.-fright {
float: right;
}
.flex-width > div {
margin-left: 4%;
}
.flex-width > div, .flex-width > div:first-child + div {
width: 48%;
}
.inline-elm-2 > * {
margin-left: 60px;
}
.row-element .inline-elm-2 > * {
margin-bottom: 0;
}
.md-form-box > h3, .md-prg-box h4 {
font-size: 28px;
}
.md-form-box > h3 {
line-height: 1em;
margin-bottom: 30px;
}
.md-prg-box h3 {
max-width: 90%;
font-size: 28px;
line-height: 1.142857142857143em;
margin: 0 auto;
}
.md-txt-list > li, .md-prg-box p {
font-size: 23px;
}
.row-element-2 .radio-list {
margin-top: 22px;
}
.radio-list > li {
display: block;
margin-left: 0;
margin-top: 15px;
}
.radio-list > li:first-child {
margin-top: 0;
}
.contract-box {
position: absolute;
width: 500px;
top: 20px;
left: 70px;
}
.form-flex .two-col-inline {
text-align: center;
margin-top: 40px;
margin-bottom: 60px;
}
.form-flex .two-col-inline > div {
width: 45%;
text-align: center;
margin-top: 0;
}
.inline-elm-5 > .cmn-inline-label, .inline-elm-5 > .cmn-inline-label + div {
width: auto;
}
.inline-elm-5 > .cmn-inline-label + div {
text-align: left;
}
.tt-content-2 {
left: 50%;
right: auto;
margin-left: -56px;
}
.tt-arw-down:before, .tt-arw-down:after {
right: auto;
left: 50%;
margin-right: auto;
}
.tt-arw-down:before {
margin-left: -10px;
}
.tt-arw-down:after {
margin-left: -11px;
}
.box-8 {
max-width: 960px;
margin-left: auto;
margin-right: auto;
margin-top: 60px;
}
.box-8 ~ .inline-elm-3 {
margin-top: 30px;
}
.flex-list-box {
padding-top: 28px;
padding-bottom: 28px;
}
.flex-two-clmn {
margin-top: 45px;
}
.flex-two-clmn .cmn-title, .flex-two-clmn .cmn-title-2 {
font-size: 34px;
}
.flex-two-clmn .cmn-title-sm {
font-size: 23px;
}
.flex-two-clmn .cmn-title-2 {
padding-right: 40px;
}
.flex-two-clmn .hightlight-txt {
font-size: 42px;
}
.flex-two-clmn .hightlight-txt.-med {
font-size: 48px;
}
.flex-two-clmn .sm-txt-size {
font-size: 25px;
}
.flex-two-clmn.-fix, .flex-two-clmn.-full {
margin-left: 12%;
margin-right: 12%;
}
.overlay-box {
font-size: 20px;
}
/* --- FOOTER --- */
.mtp-txt-size-box {
padding-top: 14px;
margin-bottom: 10px;
}
.txt-size-s {
font-size: 25px;
}
.txt-size-m {
font-size: 36px;
}
.txt-size-xxl {
font-size: 83px;
}
.footer-bar-sm {
font-size: 25px;
}
.mtp-lines-box .txt-size-m {
display: block;
line-height: 0.5em;
margin-top: 2px;
}
.footer-inner {
position: relative;
max-width: 1100px;
margin: 0 auto;
}
.footer-content, .feed-box {
width: 96.66666666666667%;
margin: 0 auto;
}
.footer-content .true-logo {
position: absolute;
left: 10px;
top: 22px;
width: 72px;
height: 26px;
}
.footer-list-box {
padding-left: 90px;
padding-top: 25px;
padding-bottom: 10px;
}
.footer-list-box > li {
float: left;
width: 24.13793103448276%;
margin-left: 1.149425287356322%;
}
.footer-list-box > li > h4 {
padding-top: 7px;
padding-bottom: 7px;
padding-left: 30px;
border-bottom: none;
}
.footer-list-box > li > h4:before {
content: "";
display: block;
position: absolute;
left: 30px;
bottom: 0;
width: 130px;
height: 1px;
background-color: #ccc;
}
.footer-list-box > li:first-child, .social-box > li:first-child {
margin-left: 0;
}
.footer-list-box > li .acd-ctn {
max-height: 2000px;
}
.footer-list-box > li h4, .feed-head h5, .feed-list-box > li h6 {
font-size: 22px;
}
.footer-list-box > li h4 {
padding-left: 30px;
}
.footer-list-box > li > h4 .sprite-icons {
left: 0;
}
.footer-list-box > li > h4 .pointer-icon {
left: 8px;
}
.footer-list-box > li > h4 .cart-icon {
left: -4px;
}
.footer-list {
padding-top: 4.16667%;
padding-bottom: 4.16667%;
background-color: #fff;
}
.footer-list > li {
font-size: 18px;
padding-left: 30px;
padding-right: 8px;
margin-top: 4.16667%;
}
.footer-bar-med {
padding-bottom: 14px;
}
.ft-list-sub > li a {
padding-left: 10px;
}
.ft-list-sub > li a:before {
top: 4px;
}
.feed-box {
border-top: 1px solid #ccc;
}
.feed-head {
min-height: 56px;
line-height: 56px;
}
.feed-desc-list > li {
font-size: 20px;
margin-top: 15px;
}
.feed-desc-list > li > div:first-child {
width: 70%;
margin-top: 0;
}
.feed-content {
padding: 30px 20px;
}
.feed-list-box > li:first-child {
margin-bottom: 20px;
}
.feed-list-box .rate-box {
width: 60.24096385542169%;
margin-top: 0;
}
.feed-list-box .feed-contact {
width: 36.14457831325301%;
margin-top: 0;
margin-left: 3.614457831325301%;
}
.feed-contact .cmn-txtarea {
min-height: 92px;
padding: 10px 16px;
}
.feed-contact .btn-float {
text-align: right;
margin-right: 8px;
}
.footer-btm-box {
height: 56px;
line-height: 34px;
}
.abs-btm-box {
right: 12px;
bottom: -56px;
}
.mari-box {
right: 28px;
}
.bubble {
right: 16px;
}
.ft-hpl-txt {
left: 392px;
bottom: 18px;
font-size: 18px;
z-index: 1;
}
.social-box {
position: absolute;
width: auto;
right: 0;
top: 0;
padding-left: 10px;
padding-right: 230px;
z-index: 1;
}
.social-box > li {
width: 30px;
height: 30px;
margin-top: 13px;
margin-bottom: 13px;
margin-left: 8px;
}
.social-box > li:last-child {
margin-right: 0;
}
.copyright {
margin-left: 10px;
}
.footer-styling .ft-hpl-txt {
margin-top: 3px;
}
.component-slide .owl-dot span {
width: 10px;
height: 10px;
}
.owl-dot {
margin-left: 12px;
}
.owl-dot span {
width: 11px;
height: 11px;
}
.arw-nav-prev.slick-arrow {
left: -12px;
}
.arw-nav-next.slick-arrow {
right: -12px;
margin-right: 0;
}
/* --- MODAL --- */
.flex-modal.md-max-scroll {
height: 100%;
}
.md-header {
padding-top: 15px;
padding-bottom: 15px;
}
.md-max-scroll .md-ctn-box-4.md-scrolling {
padding-top: 58px;
}
.md-max-scroll .md-scrolling {
padding-top: 90px;
}
.md-auto-scroll, .md-auto-scroll .ctn-tgl-box, .md-auto-scroll .box-acd-ctn-inner {
height: auto;
}
.md-auto-scroll .ctn-tgl-box .content-inline {
top: 0;
-webkit-transform: none;
transform: none;
}
.md-img-size {
width: 480px;
}
.md-close-btn {
right: 10px;
}
.md-pic .md-img-box .img-cmn-screen {
width: 100%;
}
.md-pic .md-img-box .md-close-btn {
right: 0;
}
.md-header h3, .heading-3 {
font-size: 38px;
}
.md-ctn-box-2, .md-ctn-box-3 {
padding: 25px;
}
.md-cmn-prg {
font-size: 22px;
}
.md-auto-scroll .md-ctn-box-2 {
padding-top: 85px;
max-height: 90vh;
}
.md-scrolling-4 {
bottom: 100px;
padding-top: 80px;
}
.md-ctn-fix-btm {
padding: 12px 10px 12px;
}
.md-ctn-fix-btm .btn-inline {
margin-top: 10px;
}
.middle-prg-ctn > h4 {
font-size: 28px;
line-height: 1em;
}
.text-prg {
font-size: 25px;
}
.md-ctn-box-3 .text-prg {
width: 420px;
}
.prg-ctn-2 {
font-size: 26px;
margin-bottom: 20px;
}
.box-ctn-3 .tbold-xlarge-size {
margin-bottom: 20px;
}
.box-acd-ctn-inner {
padding: 20px 30px;
}
.content-inline > div:first-child, .content-inline > div img {
width: auto;
}
.content-inline > div:first-child {
margin-right: 15px;
}
.box-acd-ctn-inner, .inline-block-list > li > div:first-child > span {
font-size: 26px;
}
.logo-list > li img {
width: 67px;
}
.logo-list-2 > li img {
width: 70px;
}
.logo-list-2 {
margin-top: 30px;
}
.md-ctn-box {
padding: 20px;
}
.md-ctn-box .btn-inline, .md-ctn-box-2 .btn-inline {
margin-top: 30px;
}
.md-med-form-wrap {
padding-bottom: 0;
}
.md-med-form-wrap > h2 {
font-size: 36px;
line-height: 1em;
}
.md-med-form-wrap > h5 {
font-size: 22px;
line-height: 1em;
}
.md-med-form-wrap > h6 {
font-size: 24px;
}
#cvg-modal .md-med-form-wrap {
padding-top: 35px;
}
.md-med-row {
margin-bottom: 25px;
}
.md-modal .cmn-input {
font-size: 27px;
height: 42px;
}
.md-modal .input-inline {
height: 40px;
}
.md-modal .slcm-txt {
font-size: 24px;
}
.md-modal .label-heading.tmed-md-size {
font-size: 26px;
}
.md-modal .custom-select-menu .slcm-txt {
font-size: 20px;
}
.md-modal .sq-select {
height: 42px;
}
.md-modal .row-element .inline-elm-2 {
margin-bottom: 15px;
}
.md-med-form-wrap .medium-modal-title {
font-size: 28px;
margin-bottom: 30px;
}
.md-modal .row-element > div {
margin-bottom: 26px;
}
.md-med-form .captcha-box, .mini-form .captcha-box {
width: 300px;
}
.md-med-form .captcha-box {
margin-bottom: 20px;
}
.md-ctn-box-2 .btn-inline {
margin-bottom: 0;
}
.ajax-sm-box .spinner-box {
margin-top: -20px;
}
.ajax-med-box .spinner-box {
margin-top: -50px;
}
.fix-box-outer {
margin-top: -40px;
}
.fix-ajax-ctn-2 .box-main-outer {
margin-top: 60px;
}
.fix-ajax-ctn-2 .med-box-ctn {
padding-top: 0;
}
/* --- MARI LAUNCHPAD --- */
.md-modal.md-mari-size.md-show {
max-height: none;
overflow: visible;
}
.md-mari-size {
width: 1000px;
}
.dd-list {
width: 256px;
margin-left: 0;
}
.pop-top {
min-height: 100px;
}
.pop-top .pop-top-content {
padding-top: 12px;
float: left;
}
.pop-top .pop-top-content:after {
content: "";
background: #c3c3c3;
display: block;
height: 70px;
width: 1px;
position: absolute;
right: 0px;
top: 10px;
}
.pop-top .mini-box-slide {
float: left;
}
.pop-top-content {
width: 300px;
}
.pop-btm-inner .owl-stage {
padding-top: 30px;
}
.dd-box + .btm-area-box {
border-bottom: none;
}
.mini-box-slide:before {
display: none;
}
.box-list-elm {
width: 930px;
}
.top-area-ctn {
margin-bottom: 5px;
}
.top-area-ctn-2 .mtp-box-2 {
margin-top: 7px;
}
.top-area-ctn-2 .btm-area-box-2, .btm-area-box-2 {
margin-top: 5px;
}
.top-area-ctn-2 .mtp-box-2 > div {
width: 65%;
}
.top-area-ctn-2 .mtp-box-2 > div:first-child {
width: 33%;
}
.card-slide .owl-prev {
left: -28px;
}
.card-slide .owl-next {
right: -26px;
}
.mini-box-slide {
width: 270px;
}
.mtp-box-2 > div {
line-height: 14px;
float: left;
width: 50%;
}
.mtp-box-2 .xs-txt-desc > * {
float: none;
width: auto;
}
.mtp-box-2 .xs-txt-desc div {
width: auto;
}
.mtp-box-2 .xs-txt-desc span {
text-align: left;
width: 100%;
display: block;
}
.mtp-box-2 .xs-txt-desc span br {
display: inline-block;
}
.mtp-box-2 .xs-txt-desc:first-child + .xs-txt-desc span {
text-align: right;
}
.top-area-ctn-2 .sm-txt-desc:first-child {
margin-bottom: 0;
}
.pop-top .mini-box-slide {
margin-top: 4px;
margin-left: 30px;
}
.pop-top-slide .owl-prev, .pop-top-slide .owl-next {
width: 16px;
height: 22px;
margin-top: -12px;
}
.pop-top-slide .owl-prev {
left: -22px;
}
.pop-top-slide .owl-next {
right: -22px;
}
.pop-mini {
right: 120px;
top: -32px;
width: 220px;
min-height: 114px;
padding: 15px;
background-color: #eb232a;
border-radius: 8px;
box-shadow: -4px 4px 6px #666;
}
.pop-mini:after {
margin-top: -18px;
}
.pop-mini .msg-txt {
font-size: 12px;
}
.mari-pop .mari-elm {
top: -50px;
right: -10px;
}
.hl-box {
margin-top: -5px;
}
.btm-area-box {
width: 100%;
}
.btm-area-box .button {
min-width: 56px;
}
.amount-txt {
font-size: 40px;
}
.mini-box-slide .btm-area-box {
margin-top: 16px;
}
.last-col-box .btm-area-box {
margin-top: 25px;
}
.hl-box .hp-link {
margin-top: 10px;
}
.pop-btm {
padding-bottom: 31px;
}
.pop-btm-inner .owl-dot span {
background: #d3d3d3;
width: 12px;
height: 12px;
}
.pop-btm-inner .owl-dot.active span {
background: #ee3d31;
}
.card-slide .owl-dots {
bottom: -14px;
}
.card-box .remark-box {
padding-top: 9px;
}
/* --- MARI POPUP-2 --- */
.md-mari-pop {
width: 864px;
}
.mari-half {
top: -87px;
left: 50px;
width: 276px;
height: 240px;
}
.mari-pop-2 .black-bubble-box {
right: 182px;
top: 25px;
width: 400px;
height: 80px;
line-height: 72px;
box-shadow: -4px -4px 2px #333 inset;
}
.black-bubble-box .bubble-tail {
left: -28px;
top: 31px;
}
.black-bubble-box > p {
min-width: 10px;
width: auto;
font-size: 40px;
line-height: 0.85em;
margin-left: 5px;
margin-right: 5px;
padding: 0;
}
.btn-link-box {
width: 800px;
padding-top: 140px;
}
.btn-link-box > li, .btn-link-box > li > a {
height: 176px;
width: 176px;
line-height: 176px;
}
.btn-link-box h2, .btn-link-box .red-txt-2 {
font-family: "TrueBold";
font-size: 28px;
position: relative;
}
.btn-link-box h3 {
font-size: 28px;
line-height: 0.8em;
}
.btn-link-box .sec-txt3 {
font-family: 'TrueLight';
font-size: 23px;
}
.btn-link-box .sec-txt3 span {
font-family: "TrueBold";
font-size: 28px;
display: block;
margin-bottom: 4px;
}
.btn-link-box > li, .btn-link-box > li:nth-child(2n) {
margin-left: 24px;
}
.ie8 .btn-link-box > li {
margin-left: 24px;
margin-top: 0;
}
.btn-link-box > li:first-child {
margin-left: 0;
}
.btn-link-box > li {
border-right-width: 6px;
border-bottom-width: 6px;
}
.mari-pop-2 {
height: 360px;
background-position: 0 -380px;
}
.btn-link-box .pack-icon, .btn-link-box .mb-upgrade-icon {
width: 110px;
height: 110px;
top: 12px;
}
.btn-link-box .pack-icon {
left: 16px;
}
.btn-link-box .mb-upgrade-icon {
left: 22px;
}
.btn-link-box .mb-pack-app-icon {
left: 28px;
top: 12px;
width: 104px;
height: 104px;
}
.btn-link-box .mtu-icon {
left: 14px;
top: 20px;
width: 160px;
height: 107px;
}
.btn-link-box h2 {
margin-top: 15px;
min-height: 40px;
}
.box-auto-height .ajax-sm-box .spinner-box {
margin-top: -30px;
}
.box-4 .multiple-col-box {
float: none;
width: 45.95238095238095%;
display: inline-block;
vertical-align: top;
}
#map-canvas {
height: 810px;
height: 90vw;
}
.acd-tab-fixed .select-tabs-group, .acd-tab-fixed.spc-tab .select-tabs-group {
margin-top: 600px;
}
.select-tabs-wrap .detail-content {
padding-top: 0;
margin-top: 0;
}
.box-4 .cmn-txt-label-sm-btm-2 {
max-width: 90%;
margin-left: auto;
margin-right: auto;
}
.cmn-txt-label-sm-btm-2 {
font-size: 18px;
line-height: 1em;
}
.cmn-sm-box {
min-width: 150px;
}
.hpl-link-box.pull-right-box {
display: block;
float: right;
}
.hpl-wrap-box .hpl-link-box.pull-right-box {
float: none;
}
.inline-elm-3 .cmn-label-left, .inline-elm-3 .sm-label-left {
max-width: 520px;
}
.row-element .tt-abs {
right: 92px;
top: 21px;
}
.cmn-desc-box-4 .dv-small-img {
display: none;
}
.cmn-desc-box-4 .dv-large-img {
display: block;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-1 {
margin-top: 126.4444444444444%;
}
.abs-bnt-box-2 {
margin-top: 161.2222222222222%;
}
.abs-bnt-box-3 {
margin-top: 970.1111111111111%;
}
.box-th.abs-bnt-box-3 {
margin-top: 989.4444444444444%;
}
.abs-bnt-box-3 .abs-btn-3 {
margin-left: 390px;
margin-left: 43.33333333333333vw;
}
.abs-bnt-box-4 {
margin-top: 995.7777777777778%;
}
.box-th.abs-bnt-box-4 {
margin-top: 1015.555555555556%;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4, .abs-bnt-box-4 .abs-btn-5 {
margin-top: 0;
}
.abs-bnt-box-4 .abs-btn-1 {
margin-left: 10.33333333333333%;
}
.abs-bnt-box-4 .abs-btn-2 {
margin-left: 4.333333333333333%;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4, .abs-bnt-box-4 .abs-btn-5 {
margin-left: 4.444444444444444%;
}
.abs-bnt-box-1 .abs-btn-1 {
margin-left: 31%;
}
.abs-bnt-box-1 .abs-btn-2 {
margin-left: 13.55555555555556%;
}
.abs-btn-style {
width: 110px;
height: 100px;
width: 12.22222222222222vw;
height: 11.11111111111111vw;
}
.ctn-tgl-box .cmn-form-style {
min-height: 437px;
}
.block-ctn-1 {
max-width: 1040px;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
}
.block-ctn-1 .box-ctn-acd-wrap {
margin-top: 80px;
}
.title-text-1 {
/*font-size: 45px;*/
font-size: 27px;
}
.title-text-2 {
font-size: 26px;
}
.prg-txt-1 {
font-size: 23px;
}
.md-ctn-box-2 .prg-txt-1 {
font-size: 22px;
}
.inline-block-col .title-text-1 {
min-height: 50px;
margin-top: 40px;
margin-bottom: 10px;
}
.inline-block-col .prg-txt-1 {
max-width: 90%;
}
.logo-list-3 {
width: 32%;
display: inline-block;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}
.inline-col-inner {
font-size: 20px;
padding-left: 6px;
margin-right: 0;
}
.logo-list-3 > li {
width: 33%;
}
.owl-carousel .owl-item .logo-list-3 > li img, .logo-list-3 > li img {
width: auto;
max-height: 24px;
}
.block-info-2 > .prg-txt-1 {
margin-top: 60px;
}
.tab-head-styling-2 {
width: auto;
max-width: 1060px;
padding-left: 20px;
padding-right: 20px;
}
.tab-head-styling-2 > li {
min-height: 42px;
line-height: 40px;
text-align: center;
}
.tab-head-txt > .tgl-br {
display: inline;
}
.tab-head-styling-2 > .tpr-tab {
margin-top: 48px;
}
.tab-head-txt {
font-size: 31px;
line-height: 0.8333333333333333em;
margin-bottom: 60px;
}
.abs-sub-txt {
clear: none;
font-size: 40px;
margin-right: 17px;
margin-top: 5px;
}
.sub-txt-sm {
font-size: 26px;
}
.heading-tab-2 .sub-txt-sm {
margin-top: 10px;
}
.img-icon-box {
width: 30px;
height: 30px;
}
.img-icon-box img {
width: 18px;
height: 18px;
}
.group-txt-2 .img-icon-box img {
margin-top: -10px;
}
.group-txt-2 .img-icon-box {
right: -26px;
top: 14px;
-webkit-transform: none;
transform: none;
}
.label-heading .cmn-txt-label {
margin-top: 14px;
}
/* --- AUTO COMPLETE --- */
.ui-autocomplete {
width: 549px;
max-height: 400px;
}
body:not(:-moz-handler-blocked) .button-txt-sm {
display: block;
line-height: 0.5em;
}
.banner-info.owl-carousel .owl-dots {
bottom: 10px;
}
.tab-text-box {
font-size: 30px;
text-align: left;
float: right;
}
.tab-text-box + .tab-ctn {
clear: both;
}
.input-combobox .accd-arrow {
right: 15px;
}
/* --- FIREFOX --- */
_:-moz-tree-row(hover), .sq-btn-flex {
line-height: 16px;
}
/* --- SPRITE BU --- */
.truemoveh-icon {
width: 72px;
height: 93px;
}
.trueonline-icon {
width: 102px;
height: 80px;
}
.truevisions-icon {
width: 88px;
height: 80px;
}
.truemoveh-logo {
width: 124px;
height: 20px;
}
.trueonline-logo {
width: 118px;
height: 20px;
}
.truevisions-logo {
width: 125px;
height: 20px;
}
.nav-list-icons-box {
margin-top: 30px;
}
.nav-list-items {
margin-left: 30px;
margin-right: 30px;
}
.grey-cir-box {
width: 140px;
height: 140px;
}
.hpl-wrap-box {
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
}
.hpl-wrap-box .hpl-link-box:first-child {
top: 7px;
}
.hpl-wrap-box .hpl-link-box:first-child + .hpl-link-box.pull-right-box strong, .switch-line-txt {
display: inline-block;
}
.mtp-rows-block {
padding-top: 25px;
padding-bottom: 25px;
}
.tab-heading-block, .rows, .block-inline-wrap {
padding-left: 25px;
padding-right: 25px;
}
.tab-heading-block, .rows .medium-txt {
font-size: 28px;
}
.rows {
font-size: 24px;
}
.rows.-sm {
font-size: 22px;
}
.block-inline-wrap {
margin-top: 40px;
}
.block-inline-wrap .block-inline-item {
display: inline-block;
vertical-align: middle;
max-width: 48%;
min-width: 48%;
margin-left: 1.5%;
margin-top: 0;
}
.block-inline-wrap .block-inline-item:first-child {
margin-left: 0;
min-width: 40%;
}
.filter-menu .tlight-large-size {
display: block;
font-size: 40px;
margin-top: 18px;
}
.filter-menu .select-menu {
width: 300px;
margin-right: 15px;
margin-top: 11px;
margin-bottom: 20px;
}
.filter-menu-nav {
padding-left: 16px;
padding-right: 16px;
}
.filter-menu-list .arw-nav-next.slick-arrow {
right: 0;
}
.box-1 .packbox:first-child {
margin-top: -46px;
}
.file-txt {
font-size: 22px;
}
.display-frame {
display: block;
width: 330px;
padding: 20px 15px;
margin-left: auto;
margin-right: auto;
}
.display-img {
width: 320px;
height: 180px;
}
.display-img.sample-img-1 {
background-size: 78% auto;
}
.chat-bubble-icon {
width: 103px;
height: 100px;
}
.staff-icon {
width: 115px;
height: 100px;
}
.on-web-icon {
width: 103px;
height: 100px;
}
.trueshop-icon {
width: 123px;
height: 100px;
}
.credit-card-icon.-med {
width: 133px;
height: 100px;
}
.tmn-wallet-icon {
width: 124px;
height: 100px;
}
.social-network-icon {
width: 159px;
height: 100px;
}
.data500-icon {
width: 152px;
height: 60px;
}
.idcard-icon {
width: 136px;
height: 100px;
}
.scan-qrcode-icon {
width: 57px;
height: 100px;
}
.sim-checked-icon {
width: 87px;
height: 100px;
}
.tmn-kiosk-icon {
width: 64px;
height: 100px;
}
.header-block {
font-size: 32px;
margin-bottom: 20px;
}
.header-block + .header-title {
margin-bottom: 40px;
}
.header-title {
font-size: 32px;
}
.block-wraper {
padding: 25px 10px 35px;
box-sizing: border-box;
}
.block-wraper .multiple-col-block ~ .title-11 {
margin-top: 25px;
}
.multiple-col-block .col-item {
font-size: 24px;
width: 25%;
padding-bottom: 0;
}
.multiple-col-block .col-item,
.multiple-col-block .col-item:nth-child(1),
.multiple-col-block .col-item:nth-child(2) {
padding-top: 50px;
}
.med-label {
width: 90px;
font-size: 22px;
}
.button-flex .button-txt.-med {
font-size: 24px;
}
.multiple-col-block .col-item .button-flex {
width: 72%;
height: 40px;
margin-left: auto;
margin-right: auto;
}
.multiple-col-block .col-item .col-title,
.multiple-col-block .col-item:nth-child(3) .col-title,
.multiple-col-block .col-item:nth-child(4) .col-title {
min-height: 30px;
margin-top: 20px;
}
.multiple-col-block .col-item .col-title br.toggle {
display: none;
}
.multiple-col-block .col-item:nth-child(1):before,
.multiple-col-block .col-item:nth-child(2):before {
display: none;
}
.multiple-col-block .col-item + .col-item:after {
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 1px;
background-color: #ccc;
}
.multiple-col-block .col-item-inner {
position: relative;
width: 100%;
}
.inline-block-col {
float: left;
width: 33.333%;
margin-bottom: 0;
}
.owl-item .inline-block-col {
float: none;
width: 100%;
}
.mtp-icons-list > .icon-list-item {
margin-left: 35px;
margin-right: 35px;
}
.mtp-icons-list .title {
font-size: 30px;
}
.icon-list-item > img {
height: 100px;
}
.slc-tabs-item {
font-size: 23px;
min-width: 15%;
}
.multiple-col-block.-three {
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}
.multiple-col-block.-three .col-item {
display: block;
width: 33.3333%;
box-sizing: border-box;
padding: 0 10px 0;
}
.multiple-col-block.-three .col-item:nth-child(2):after {
display: block;
}
.multiple-col-block.-three .col-item:nth-child(1) {
padding-left: 0;
}
.multiple-col-block.-three .col-item:nth-child(3) {
padding-right: 0;
}
.multiple-col-block.-three .col-item:nth-child(1),
.multiple-col-block.-three .col-item:nth-child(2) {
padding-top: 0;
}
.multiple-col-block.-three .col-title.-med {
margin-top: 0;
}
.multiple-col-block.-three .col-item .col-title,
.multiple-col-block.-three .col-item:nth-child(3) .col-title {
min-height: 50px;
}
.multiple-col-block.-three .col-item .sprite-icons,
.multiple-col-block.-three .col-item .sprite-icons-2 {
display: block;
margin-left: auto;
margin-right: auto;
}
.multiple-col-block.-three .col-item .sprite-icons + .col-title,
.multiple-col-block.-three .col-item .sprite-icons-2 + .col-title {
min-height: 74px;
}
.multiple-col-block.-three .col-item .data500-icon {
margin-top: 25px;
margin-bottom: 35px;
}
.multiple-col-block.-three .col-item .button-flex.-auto {
max-width: 70%;
margin-left: auto;
margin-right: auto;
}
.table-inner {
clear: both;
padding-top: 20px;
}
.table-scroll-area {
position: relative;
max-height: 188px;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.table-row-list.-head {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.table-row-list.-head .table-list-col {
text-align: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-ms-align-items: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
}
.table-row-list.-head .table-list-col:first-child {
text-align: left;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
/* -ms-align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center; */
}
.table-row-list.-head .table-list-col.-center:first-child {
text-align: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.table-row-list {
width: 100%;
padding-top: 0;
}
.table-row-list.-softgray .table-list-col {
background-color: #f4f4f4;
}
.table-row-list + .table-row-list {
padding-top: 0;
}
.table-row-list {
margin-bottom: 0;
}
.table-row-list:nth-child(odd) {
background-color: #fff;
}
.table-row-list:nth-child(even) {
background-color: #f4f4f4;
}
.table-row-content:nth-child(even),
.owl-item:nth-child(even) .table-row-content {
background-color: #f4f4f4;
}
.table-list-col {
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
text-align: center;
}
.table-list-col.-full, .table-list-col {
width: 15%;
background-color: transparent;
padding-top: 7px;
padding-bottom: 7px;
}
.table-row-list.-head .table-list-col:first-child,
.table-list-col.-full,
.table-list-col.-full:empty + .table-list-col + .table-list-col {
width: 25%;
}
.table-list-col.-full {
font-size: 22px;
text-align: left;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.table-txt-sub {
font-size: 19px;
}
.table-list-col.-hidden-on-large {
display: none;
}
.table-row-heading, .table-row-content {
font-size: 22px;
}
.table-info-box .title-info-list {
margin-bottom: 15px;
}
.block-info-2 .tab-head-styling {
padding-top: 50px;
}
.sim-title {
font-size: 36px;
}
.sim-pic {
width: 140px;
}
.search-area-box .search-title {
font-size: 30px;
}
.search-list-box {
width: 100%;
margin-left: auto;
margin-right: auto;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.search-list-item {
width: 138px;
padding-left: 10px;
padding-right: 10px;
}
.search-txt {
font-size: 20px;
}
.txt-inline-item {
font-size: 24px;
margin-top: 10px;
}
.txt-fix {
font-size: 25px;
}
.price-txt-fix {
font-size: 36px;
}
.tmn-wallet-icon.-small {
width: 42px;
height: 33px;
}
.visa-logo.-small {
width: 48px;
height: 15px;
}
.mastercard-cmn-logo.-small {
width: 41px;
height: 25px;
}
.jcb-logo.-small {
width: 30px;
height: 23px;
}
.flex-col-panel > .-small {
margin-left: 5px;
}
.title-txt-box + .block-wraper {
margin-top: 30px;
}
.block-inline-elm {
margin-bottom: 25px;
}
.block-inline-elm > div {
display: inline-block;
vertical-align: top;
}
.block-inline-elm > div + div {
margin-top: 0;
margin-left: 50px;
}
.txt-inline-item {
width: 21%;
margin-left: 2%;
margin-right: 2%;
}
.md-title-fix.-spacing {
margin-left: 25px;
margin-right: 25px;
}
.owl-item .table-row-list {
width: 100%;
}
.table-scroll-area.owl-carousel .owl-stage-outer {
overflow: visible !important;
-webkit-transform: none !important;
transform: none !important;
}
.table-scroll-area.owl-carousel .owl-stage {
width: auto !important;
-webkit-transform: none !important;
transform: none !important;
}
.table-scroll-area.owl-carousel .owl-item {
float: none !important;
width: auto !important;
}
.table-scroll-area .owl-nav {
display: none;
}
.pack-btn-item.-flexi {
min-height: 40px;
font-size: 24px;
}
.pack-btn-item.-flexi *[class*='app-icon'] {
width: 40px;
height: 40px;
}
.pack-btn-item.-flexi *[class*='app-icon'] + .pack-btn-txt {
margin-left: 40px;
}
.cmn-form-style .pack-btn-item,
.fixedonsmall .pack-btn-item {
width: 260px;
}
.cmn-form-style .pack-btn-item {
margin-left: 30.5927%;
}
.fixedonsmall {
position: absolute;
top: 0;
bottom: auto;
margin-top: 595px;
margin-top: 535px;
}
.main-sec ~ .fixedonsmall {
margin-top: 615px;
margin-top: 559px;
}
.fixedonsmall .pack-btn-item {
left: 50%;
margin-left: 84px;
}
.-fixingbutton .cmn-form-style {
padding-bottom: 60px;
}
.fixed-tab .main-content:first-child .abs-tab,
.fixed-tab .main-content:first-child .check-status-box .abs-tab {
-webkit-transform: none;
transform: none;
padding-top: 0;
}
.combobox-list-item {
font-size: 22px;
padding: 12px 15px;
}
.fixedonsmall.bring-backward {
z-index: 1;
}
.form-heading.-spacetop {
margin-top: 50px;
}
.box-1 .box-5 .btn-inline {
margin-top: 28px;
}
.cmn-tab-head.-fix > li > span,
.cmn-tab-head.-fix > li > a {
font-size: 24px;
padding-top: 0;
padding-bottom: 2px;
}
.cmn-tab-head.-fix .bolder {
font-size: 2em;
}
.cmn-tab-head.-fix > li {
min-width: 170px;
}
.box-top-head-2 .tlight-large-size:first-child {
margin-top: 15px;
}
.box-top-head-2 .tlight-large-size:first-child + .tab-head-styling {
width: auto;
min-width: 100px;
max-width: 800px;
clear: none;
padding-top: 0;
justify-content: flex-end;
}
.full-bnr-content {
margin-top: 25px;
}
.full-bnr-content.-bg1,
.full-bnr-content.-bg2 {
min-height: 41.7778vw;
background-size: 169.0909090909091% 434.78260869565213%;
}
.full-bnr-content.-bg1 {
background-position: 100% 0;
background-position: 100% 61.038961038961034%;
}
.full-bnr-content.-bg2 {
background-position: 100% 30.519480519480517%;
background-position: 100% 91.55844155844156%;
}
.full-bnr-desc {
position: absolute;
padding-top: 0;
font-size: 2.777778vw;
left: auto;
right: 8.111%;
top: 0;
margin-top: 22.88889%;
margin-bottom: 0;
width: 22.6667%;
left: 48%;
right: auto;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.youtube-vdo-iframe {
position: absolute;
left: 1.1111%;
top: 50%;
width: 560px;
height: 315px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.full-bnr-content.-bg2 .youtube-vdo-iframe {
left: auto;
right: 1.1111%;
}
.full-bnr-content.-bg2 .full-bnr-desc {
left: 7%;
right: auto;
margin-top: 15%;
width: 24.6667%;
left: 20%;
margin-top: 31.5%;
}
.full-bnr-desc .bnr-txt-first-line {
position: absolute;
right: -194%;
width: 100%;
top: 0;
margin-top: -35%;
}
.full-bnr-desc .bnr-txt-sec-line {
position: relative;
display: block;
margin-top: 148px;
line-height: 0.8em;
margin-top: 0;
}
.wrap-cont .box-ctn-acd-wrap.style-2 {
margin-bottom: 30px;
}
.wrap-cont .mtp-box > .mtp-col {
margin-bottom: 10px;
}
.wrap-cont .flex-block-wrap {
padding-left: 0;
padding-right: 0;
}
.wrap-cont .flex-block-wrap,
.wrap-cont .heading-tab-2 {
width: 94.4444%;
}
.packbox-list-item,
.wrap-cont .med-box-ctn .brc-wrap-box {
padding-left: 0;
padding-right: 0;
margin-top: 30px;
}
.wrap-cont .med-box-ctn .brc-wrap-box {
max-width: 100%;
width: 100%;
}
.packbox-list-item + .packbox-list-item {
margin-top: 40px;
}
.floating-txt-item {
font-size: 20px;
}
.full-bnr-desc .tgl-br {
display: inline;
}
.sim-name {
font-size: 34px;
}
.sim-thumb {
width: 120px;
margin-left: 20px;
}
.table-info-box .title-info-list {
float: left;
}
.flex-input-box {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.flex-input-box.-four .square-input-box {
width: 18%;
}
.flex-input-box.-four .square-input-box + .square-input-box {
margin-left: 4%;
}
.collapse-expand-block {
padding-bottom: 20px;
margin-bottom: 40px;
background-color: #edeff3;
box-shadow: none;
}
.collapse-title-block .title-3 {
pointer-events: none;
text-align: center;
}
.collapse-expand-block .row-element > div {
margin-bottom: 0;
}
.collapse-expand-block .acd-ctn {
max-height: none;
}
.collapse-expand-block .custom-arrow {
display: none;
}
.collapse-title-block {
min-height: 20px;
border-bottom: 1px solid #fff;
padding-bottom: 10px;
}
.collapse-title-block,
.collapse-expand-block.actived .collapse-title-block {
margin-bottom: 15px;
}
.collapse-expand-block:not(.actived) .floating-input-block .square-input {
font-size: 26px;
}
.small-txt-label {
font-size: 22px;
}
.small-txt-label.-floating {
top: 4px;
}
.med-txt-label.-spacebottom {
margin-bottom: 20px;
}
.the-txt {
font-size: 32px;
}
.the-digit {
font-size: 43px;
}
.the-digit .the-txt {
margin-left: 5px;
}
.border-line-block {
padding-right: 20px;
padding-left: 20px;
margin-bottom: 30px;
}
.flex-row-panel.-fix .flex-col-panel,
.flex-toggle-block {
padding-left: 30px;
padding-right: 30px;
}
.flex-row-panel.-fix .flex-col-panel {
padding-top: 18px;
padding-bottom: 18px;
}
.flex-toggle-block .row-element > div,
.flex-toggle-block .row-element > div:first-child + div {
width: 44%;
}
.flex-toggle-block .row-element > div:first-child + div {
margin-left: 12%;
}
.heading-label {
font-size: 24px;
margin-bottom: 10px;
}
.flex-toggle-block .inline-elm-3 {
margin-top: 0;
}
.box-content-4.-fix {
margin-top: -1.778%;
}
.box-content-4.-fix .slide-med-size .owl-dots {
bottom: 50px;
}
.box-ctn-rotate.-fixcurve .edge-bg-img {
border-bottom-left-radius: 90px;
}
.fiveg-ready-icon {
width: 50px;
height: 50px;
}
.box-list-column .fiveg-ready-icon {
top: -26px;
right: 3px;
}
.orange-4g-5g-icon.posi-st2, .yellow-4g-5g-icon.posi-st2, .gray-4g-5g-icon.posi-st2,
.orange-4g-5g-icon.posi-st3, .yellow-4g-5g-icon.posi-st3, .gray-4g-5g-icon.posi-st3 {
top: 33%;
}
.footer-small-text {
font-size: 18px;
}
.box-content-4.-fix .slide-med-size img {
width: 100%;
}
.truestorecare-icon {
width: 43px;
}
.footer-bar-med.-style .phone-cir-red-icon {
width: 23px;
height: 23px;
}
.txt-size-l {
font-size: 54px;
line-height: 0.75em;
}
.table-row-heading, .table-row-content {
width: 100%;
}
.box-content-4.-hiddencurve .slide-med-size .owl-dots {
bottom: 8px;
}
.box-content-4.-hiddencurve + .box-content.box-style .box-main-inner {
padding-top: 30px;
}
.info-collapse-inner {
padding-top: 25px;
padding-bottom: 25px;
}
.info-collapse-title.-spacingbottom {
margin-bottom: 1em;
}
.packages-block {
font-size: 22px;
width: 25vw;
max-width: 270px;
}
.packages-header {
min-height: 52px;
}
.packages-header-txt {
font-size: 22px;
}
.packages-list .owl-prev {
left: -2px;
}
.packages-list .owl-next {
right: -2px;
}
.wrap-cont .flex-block-wrap ~ .heading-tab-2 + .box-ctn-acd-wrap.style-2 {
margin-bottom: 30px;
}
.youtube-video {
width: 830px;
height: 467px;
}
.youtube-video.-spacebottom {
margin-bottom: 40px;
}
.multiple-col-block {
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.multiple-col-block.-fix .col-item {
width: 32%;
font-size: 28px;
}
.table-info-box .note-txt {
margin-top: 20px;
text-align: right;
}
.mari-action {
bottom: -40px;
}
.mari-btm.-action2 .mari-action {
bottom: -25px;
}
.abs-btm-box, .abs-btm-box.-fix {
bottom: -121px;
}
.remark-text-block {
width: 75%;
margin-top: 30px;
font-size: 25px;
padding: 20px;
}
.remark-text-block .show-on-large {
display: inline;
}
.fix-styling-2 + .remark-text-block {
margin-top: 0;
}
.remark-desc {
font-size: 17px;
}
.free-txt-custom-icon {
margin-top: 11px;
margin-bottom: 10px;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-flow: column wrap;
-webkit-flex-flow: column wrap;
flex-flow: column wrap;
}
.free-txt-title-sm {
margin-bottom: 16px;
}
.free-txt-title-large {
font-size: 120px;
}
.free-txt-title-large .free-txt-title-med {
font-size: 0.7em;
}
}
@media screen and (min-width : 960px) {
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-3 {
margin-top: 973.3333333333333%;
}
.box-th.abs-bnt-box-3 {
margin-top: 995.8333333333333%;
}
.abs-bnt-box-4 {
margin-top: 1002.291666666667%;
}
.box-th.abs-bnt-box-4 {
margin-top: 1022.083333333333%;
}
.sm-banner > li {
font-size: 20px;
}
}
@media screen and (min-width : 1000px) {
.mb-nav-box, header:before, .lang-box:before, .service-menu > li > a:before, .main-menu > li .grey-arw-icon,
.main-menu > .home-menu > a > span, .mari-menu, .tab-holder-box, .fixed-tab .tab-holder-box,
.inline-block-col .title-text-1 .tgl-br, .hidden-on-large {
display: none;
}
.top-menu > li:first-child > a:before, .top-menu > li:first-child > a:after, .box-wrap .tmh-logo, header .home-icon,
.content-bg-full {
display: block;
}
.top-menu > li .arw-red-down {
display: inline-block;
}
.title-txt-box > h3 .tgl-br {
display: inline;
}
/* --- ICONS --- */
.en-flag, .th-flag {
width: 20px;
height: 12px;
}
.vo-wifi-icon {
width: 32px;
height: 32px;
}
header {
top: 0;
height: 150px;
max-width: 1140px;
margin: 0 auto;
z-index: 20;
background-color: rgba(255, 255, 255, 0.7);
border-radius: 0 0 30px 30px;
overflow: visible;
}
.tpr-header header {
background-color: transparent;
border-radius: 0;
}
.ie8 header {
background: url(../images/bg/white-ovl.png) repeat 0 0;
}
.ie8 .tpr-header header {
background: none;
}
header .home-icon {
position: absolute;
top: 50%;
left: 50%;
margin-left: -10px;
margin-top: -8px;
}
.tpr-header {
position: relative;
padding-top: 150px;
}
.top-menu, .lang-box {
width: auto;
}
.desktop .top-menu > .has-submenu:hover > a, .top-menu > .has-submenu.selected > a, .sub-menu, .sub-menu > li {
background-color: #40454F;
}
.tgl-menu-elm {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.top-menu > li, .sub-menu {
position: relative;
}
.top-menu > li {
width: auto;
}
.top-menu > li a {
font-size: 20px;
}
.top-menu > li > a {
min-width: 91px;
height: 28px;
line-height: 28px;
color: #484848;
padding-right: 12px;
padding-left: 15px;
}
.top-menu > li > a:before, .top-menu > li > a:after {
height: 20px;
margin-top: -10px;
}
.top-menu > li > a:before {
left: auto;
right: -1px;
opacity: 1;
}
.top-menu > li > a:after {
left: auto;
right: 0px;
}
.top-menu > li > a, .lang-box, .main-menu > li, .main-menu > .actived, .main-menu > li:active, li.has-submenu.selected {
background-color: transparent;
}
.lang-box, .top-menu {
position: absolute;
top: -84px;
right: 0;
height: 28px;
}
.top-menu {
margin-right: 80px;
}
.lang-box {
width: 55px;
margin-right: 10px;
}
.lang-box > li {
height: 28px;
line-height: 26px;
margin-left: 10px;
}
.sub-menu-wrap {
min-width: 190px;
left: 0;
bottom: auto;
right: auto;
top: 100%;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s cubic-bezier(0.77, 0, 0.175, 1);
transition: max-height 0.3s cubic-bezier(0.77, 0, 0.175, 1);
}
.sub-menu {
padding-bottom: 5px;
border-radius: 0 0 10px 10px;
}
.sub-menu > li {
border-top: none;
}
.sub-menu > li > a {
font-family: 'TrueMedium';
padding: 5px 15px;
}
.sub-menu > li > a:hover {
color: #fff;
}
.box-wrap {
width: auto;
height: 80px;
padding-left: 10px;
padding-right: 10px;
}
.sv-menu {
position: relative;
margin-top: 20px;
}
.service-menu-wrap {
position: relative;
float: right;
width: 819px;
height: 80px;
background-size: 244.2002442002442% 5000%;
background-position: -1181px 0;
}
.service-menu > li {
float: right;
width: 271px;
height: 55px;
margin-right: 3px;
margin-top: 9px;
}
.service-menu > li:first-child {
margin-right: 0;
}
.user-name {
margin-top: 4px;
margin-bottom: 1px;
}
.user-thumb {
left: -10px;
width: 38px;
height: 38px;
margin-top: -23px;
border-width: 3px;
}
.user-info {
margin-left: 45px;
}
.user-info > span {
margin-top: 0;
}
.user-pvl {
right: 5px;
}
.user-pvl .noti-mini {
border-color: #f1f1f1;
}
.menu-txt {
width: auto;
margin-left: 15px;
}
.menu-txt .sec-line-text, .user-info > span {
font-size: 17px;
}
.first-line-text, .sec-line-text {
margin-left: 33px;
}
.first-line-text {
margin-bottom: -26px;
}
.service-menu > li:first-child .sec-line-text {
text-transform: uppercase;
margin-left: 30px;
}
.user-box {
top: 15px;
}
.top-menu-box {
top: 84px;
overflow: visible;
}
.main-menu-box, .main-menu-box.actived {
-webkit-transform: none;
transform: none;
}
.main-menu-box {
position: relative;
top: 0;
margin-top: 16px;
padding-left: 10px;
padding-right: 10px;
}
.main-menu {
overflow: visible;
}
.main-menu > li {
position: relative;
float: left;
min-width: 50px;
margin-left: 17px;
border-top: none;
}
.main-menu > li:after {
content: "";
position: absolute;
left: 50%;
top: -1px;
display: block;
width: 0;
height: 32px;
background-color: #fdbb30;
border-radius: 15px;
border-top: 2px solid #d7a12f;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: width 0.2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
transition: width 0.2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
}
.desktop .main-menu > li:hover:after, .main-menu > .actived:after, .main-menu > li:active:after, .main-menu > .selected:after {
width: 100%;
}
.desktop .main-menu > li:hover > a > span, .main-menu > .actived > a > span, .main-menu > li:active > a > span, .main-menu > .selected > a > span {
color: #fff;
}
.desktop .main-menu > .home-menu:hover .home-icon, .main-menu > .home-menu.actived .home-icon {
background-position: 24.06976744186047% 2.345523329129887%;
}
.ie8.desktop .main-menu > .home-menu:hover .home-icon, .ie8 .main-menu > .home-menu.actived .home-icon {
background-position: -267px -10px;
}
.main-menu > li:first-child {
margin-left: 0;
}
.main-menu > li > a, .main-sub-menu > li > a, .main-sub-menu-2 > li > a {
font-family: 'TrueBold';
}
.main-menu > li > a {
position: relative;
font-size: 25px;
padding: 0 10px;
z-index: 5;
}
.main-menu > li > a > span {
color: #484848;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
}
.main-sub-box {
position: absolute;
left: 50%;
top: 100%;
min-width: 210px;
margin-left: -105px;
border-radius: 0 0 10px 10px;
}
.desktop .has-submenu:hover > .sub-menu-wrap, .has-submenu.selected > .sub-menu-wrap, .desktop .has-submenu:hover > .main-sub-box, .has-submenu.selected > .main-sub-box {
max-height: 600px;
}
.main-sub-menu {
position: relative;
padding-top: 16px;
border-radius: 0 0 10px 10px;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.main-sub-menu > li:last-child, .main-sub-menu-2 > li:last-child {
border-radius: 0 0 12px 12px;
}
.main-sub-menu > li:first-child:before {
content: "";
position: absolute;
top: -10px;
left: 50%;
width: 0;
height: 0;
display: block;
border-color: transparent;
border-style: solid;
border-width: 0 10px 10px;
border-bottom-color: #626262;
margin-left: -10px;
-webkit-transition: border-color 0.3s ease;
transition: border-color 0.3s ease;
}
.desktop .main-sub-menu > li:first-child:hover:before, .main-sub-menu > li:first-child:active:before {
border-bottom-color: #8c8d91;;
}
.main-menu > li > a, .main-sub-menu > li > a, .main-sub-menu-2 > li > a {
min-height: 34px;
line-height: 30px;
padding: 0 15px;
}
.main-menu > li > a {
padding: 0 4px;
}
.main-sub-menu > li > a, .main-sub-menu-2 > li > a {
font-size: 22px;
line-height: 34px;
}
.main-sub-menu-2 > li > a {
padding-left: 25px;
}
.slogan-box {
top: 80px;
margin-top: 3.345498783454988%;
}
/* --- CONTENT --- */
.content-bg-full, .left-bg-btm-2, .right-bg-btm-2 {
position: absolute;
top: 0;
}
.content-bg-full {
width: 2052px;
height: 549px;
left: 50%;
margin-left: -1026px;
z-index: 0;
}
.left-bg-btm-2 {
left: 0;
width: 255px;
height: 358px;
background-position: -1360px -917px;
}
.right-bg-btm-2 {
right: 0;
width: 320px;
height: 549px;
background-position: -1680px -917px;
}
.box-content {
margin-top: -200px;
}
.box-style-2 {
margin-top: -10.5%;
}
.box-content-3 {
margin-top: -184px;
}
.box-content-3:after {
margin-bottom: 5.1%;
}
.box-ctn-inner:after {
margin-bottom: -7.507507507507508%;
}
.box-style-2 + .bnr-box-ctn, .fix-box-outer {
margin-top: -50px;
}
.trueu-bg {
margin-top: -34.53453453453453%;
left: 6.006006006006006%;
width: 87.08708708708709%;
padding-bottom: 76.27627627627628%;
}
.slide-desc-box a {
padding-left: 25px;
padding-bottom: 25px;
}
.slide-desc-box p {
font-size: 30px;
line-height: 22px;
}
.slide-med-size .owl-dot {
margin-left: 10px;
}
.slide-med-size .owl-dot span {
width: 12px;
height: 12px;
}
.box-content-4 {
margin: -11.8% auto 6%;
margin: -11.8vw auto 6vw;
}
.box-content-4:after {
margin-bottom: -0.8%;
}
.box-content.spc-btm {
margin-bottom: -50px;
}
.bnr-img-box:after {
margin-top: -46px;
}
.box-top-2:after {
margin-top: 3.4%;
}
.slc-tabs-item {
/* width: 20%;
font-size: 26px; */
width: auto;
font-size: 23px;
padding: 12px 10px;
border-radius: 8px 8px 0 0;
margin-left: 8px;
}
.select-tabs-wrap .detail-content {
padding-top: 0;
margin-top: 0;
}
.fixed-tab .abs-tab, .bottom .abs-tab, .fixed-tab .fixing-box, .bottom .fixing-box,
.fixed-tab .abs-tab-2, .bottom .abs-tab-2 {
position: relative;
-webkit-transform: none;
transform: none;
}
/* --- FOOTER --- */
.feed-list-box > li:first-child {
width: 11.86623516720604%;
text-align: left;
}
.feed-list-box .rate-box {
width: 53.72168284789644%;
}
.feed-list-box .feed-contact {
width: 30.74433656957929%;
}
/* --- FIX LAZY-LOAD for IE --- */
.ie8 .owl-carousel .owl-item .owl-lazy, .ie9 .owl-carousel .owl-item .owl-lazy {
position: absolute;
}
.ie8 .owl-carousel .owl-item.active .owl-lazy, .ie9 .owl-carousel .owl-item.active .owl-lazy {
position: relative;
}
.ie8 .news-slide-box.owl-carousel .owl-item .owl-lazy, .ie9 .news-slide-box.owl-carousel .owl-item .owl-lazy {
position: relative;
max-height: 250px;
overflow: hidden;
}
.ie8 .box-wrap-right {
max-height: 381px;
overflow: hidden;
}
_:-ms-input-placeholder, :root .owl-carousel .owl-item .owl-lazy {
position: absolute;
}
_:-ms-input-placeholder, :root .owl-carousel .owl-item.active .owl-lazy {
position: relative;
}
_:-ms-input-placeholder, :root .news-slide-box.owl-carousel .owl-item .owl-lazy {
position: relative;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.3s ease 0.3s;
transition: max-height 0.3s ease 0.3s;
}
_:-ms-input-placeholder, :root .news-slide-box.owl-carousel .owl-item.active .owl-lazy {
max-height: 1000px;
-webkit-transition: max-height 0.1s ease;
transition: max-height 0.1s ease;
}
/* --- MARI POP-BTM --- */
.abs-btm-box {
padding-left: 82%;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-1 {
margin-top: 120.2%;
}
.abs-bnt-box-1 .abs-btn-1:first-child {
margin-left: 31.2%;
}
.abs-bnt-box-1 .abs-btn-2 {
margin-left: 14.7%;
}
.abs-bnt-box-2 {
margin-top: 155.4%;
}
.abs-bnt-box-3 {
margin-top: 974.4%;
}
.box-th.abs-bnt-box-3 {
margin-top: 994%;
}
.abs-bnt-box-3 .abs-btn-3 {
margin-left: 43.8%;
}
.abs-bnt-box-4 {
margin-top: 1000.3%;
}
.box-th.abs-bnt-box-4 {
margin-top: 1020%;
}
.abs-bnt-box-4 .abs-btn-2 {
margin-left: 4.4%;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4, .abs-bnt-box-4 .abs-btn-5 {
margin-left: 4.5%;
}
.block-info-2 .inline-col-wrap {
margin-top: 27px;
}
.logo-list-3 {
width: auto;
margin-top: 0;
margin-bottom: 0;
margin-left: 5px;
}
.logo-list-3 > li {
width: 38%;
margin-right: 0;
margin-left: 10px;
}
.logo-list-3 > li:first-child {
margin-left: 0;
}
.inline-block-col .title-text-1 {
min-height: 24px;
}
.med-tab-holder-2 {
height: 68px;
}
.tab-head-styling-2 {
text-align: right;
}
.tab-head-styling-2 > .tpr-tab {
position: relative;
display: inline-block;
left: 0;
right: 0;
margin-top: 0;
width: auto;
min-width: 10px;
padding-left: 0;
padding-right: 0;
margin-left: 20px;
}
.tab-head-txt {
float: left;
width: 33.33333333333333%;
display: inline-block;
font-size: 28px;
margin-top: 9px;
margin-bottom: 0;
vertical-align: bottom;
text-align: left;
}
.full-height-block, .main-sec.full-height-block {
padding-top: 100px;
}
.mb-nav-box.fixed-mb-nav {
position: absolute;
}
.filter-menu .sq-box-shadow {
display: none;
}
.filter-menu-list {
margin-left: auto;
margin-right: auto;
}
.filter-menu-list > .filter-menu-item > a {
padding-top: 10px;
padding-bottom: 10px;
}
.filter-menu-list.owl-carousel .owl-prev {
left: 0;
}
.filter-menu-list.owl-carousel .owl-next {
right: 0;
}
.fixedonsmall .pack-btn-item {
margin-left: 92px;
}
.swiper-container.filter-menu-nav,
.filter-menu-nav {
max-width: 1000px;
padding-left: 15px;
padding-right: 15px;
box-sizing: border-box;
}
.filter-menu-nav,
.filter-menu-list {
background-color: #fff;
}
.youtube-vdo-iframe {
left: 50px;
}
.full-bnr-content.-bg2 .youtube-vdo-iframe {
right: 50px;
}
.wrap-cont .form-row-elm {
width: 95%;
max-width: 1000px;
padding-left: 0;
padding-right: 0;
margin-top: 30px;
margin-bottom: 30px;
}
.flex-block-rows.-threecols .flex-block-cols {
width: 25%;
}
.flex-block-rows.-threecols .flex-block-cols:first-child {
width: 50%;
}
.flex-block-rows.-head .flex-block-cols {
min-height: 50px;
}
.wrap-cont .heading-txt-2 {
margin-bottom: 30px;
}
.banner-info.owl-carousel .owl-dots {
bottom: -3px;
}
.box-content-4.-hiddencurve + .box-content.box-style .box-main-inner {
padding-top: 40px;
}
.live-chat-block {
width: 380px;
height: 700px;
}
}
@media screen and (min-width : 1040px) {
/* --- TXT STYLING --- */
.cmn-txt-label, .cmn-txt-label-btm {
font-size: 20px;
}
.img-box-1 img {
left: 0;
}
.view-btn {
margin-bottom: 90px;
}
.box-content-4 .img-box-4 {
left: 5.090909090909091%;
left: 5.090909090909091vw;
}
/* --- ABSOLUTE BUTTON --- */
.abs-bnt-box-3 .abs-btn-3 {
margin-left: 450px;
}
.abs-bnt-box-4 .abs-btn-1 {
margin-left: 105px;
}
.abs-bnt-box-4 .abs-btn-2 {
margin-left: 45px;
}
.abs-bnt-box-4 .abs-btn-3, .abs-bnt-box-4 .abs-btn-4,
.abs-bnt-box-4 .abs-btn-5 {
margin-left: 46px;
}
.abs-btn-style {
width: 127px;
height: 115px;
}
}
@media screen and (min-width : 1100px) {
.cmn-tab-head .short-text {
display: none;
}
.main-bg-left, .cmn-tab-head .default-text, .img-box-4 .box-ctn-inner-2 + .edge-bg-img {
display: block;
}
.arw-md, .arw-up-md-white, .arw-down-md-white {
width: 13px;
height: 6px;
}
.arw-nav-btn {
margin-left: -15px;
}
.gray-gd-bg-2 {
background: rgb(178,179,182); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IyYjNiNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVmZjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgba(178,179,182,1) 0%, rgba(237,239,243,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(178,179,182,1)), color-stop(100%,rgba(237,239,243,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(178,179,182,1) 0%,rgba(237,239,243,1) 100%); /* W3C */
}
.content-bg {
position: absolute;
top: 0;
left: 50%;
width: 1920px;
height: 651px;
margin-left: -960px;
z-index: 2;
}
.left-bg-btm, .right-bg-btm {
position: absolute;
top: 0;
}
.left-bg-btm {
left: 0;
width: 311px;
height: 347px;
background-position: 0px -793px;
}
.right-bg-btm {
right: 0;
width: 701px;
height: 651px;
background-position: 0px -1350px;
}
.fade-bg-box {
position: absolute;
width: 100%;
height: 510px;
left: 0;
top: 0;
z-index: 1;
}
.main-sec {
min-height: 549px;
}
header {
border-radius: 0 0 50px 50px;
}
.top-menu {
margin-right: 92px;
}
.lang-box {
margin-right: 22px;
}
.box-wrap, .main-menu-box {
top: 0;
padding-left: 20px;
padding-right: 20px;
}
.box-wrap .tmh-logo {
width: 195px;
height: 30px;
margin-top: 22px;
}
.main-menu > li {
margin-left: 30px;
}
.banner-box {
width: 1920px;
/*height: 549px;
overflow: hidden;*/
}
.main-bg-top {
width: 444px;
height: 225px;
padding-bottom: 0;
right: 480px;
}
.main-bg-left {
position: absolute;
left: 0;
bottom: 0;
width: 339px;
height: 469px;
background-position: -1179px -105px;
z-index: 2;
}
.main-bg-right {
width: 827px;
height: 549px;
right: 0;
padding-bottom: 0;
background-size: auto;
background-position: 0 -2836px;
}
.main-bg-right.hidden-bg {
right: -125px;
background-position: -125px -2836px;
}
.slogan-box {
top: 160px;
right: 391px;
width: 273px;
height: 250px;
padding-bottom: 0;
margin-top: 0;
}
.main-banner .owl-dots {
margin-bottom: 136px;
}
.sm-banner > li {
width: 375px;
}
.sm-banner > li:first-child {
width: 168px;
}
.sm-banner > li > a {
padding-top: 18px;
}
.sm-banner-box .owl-item:first-child li:first-child + li > a,
.sm-banner-box .owl-item:first-child + .owl-item li:first-child + li > a {
padding-left: 15px;
padding-right: 15px;
}
.component-slide .owl-dots {
right: 30px;
bottom: 70px;
}
.component-slide .owl-prev {
left: 30px;
}
.component-slide .owl-next {
right: 30px;
}
/* --- CONTENT --- */
.main-content.t-line:after {
left: 50%;
margin-left: -550px;
}
.box-content {
margin-top: -206px;
margin-bottom: 140px;
}
.box-style-2 {
margin-top: -110px;
margin-bottom: 60px;
}
.box-content-3 {
margin-top: -195px;
padding-bottom: 60px;
}
.box-ctn-inner:before {
left: -3px;
}
.mini-desc-box {
font-size: 22px;
}
.main-content .box-content.box-style:first-child .box-top-inner .view-btn, .box-top-inner .view-btn {
right: 0;
margin-right: 34px;
}
.box-img-styling .ctn-slides {
min-height: 602px;
}
.box-img-styling .ctn-slides li img {
width: 1100px;
}
.box-content-4 {
padding-top: 48px;
margin: -128px auto 60px;
}
.box-content-4:before, .box-content-4:after {
width: 1155px;
}
.box-content-4:before {
padding-bottom: 10px;
margin-top: 40px;
}
.box-content-4:after {
/* padding-bottom: 50px;
margin-bottom: -9px; */
padding-bottom: 90px;
margin-bottom: -49px;
}
.box-content-4 .box-ctn-inner {
margin-top: -36px;
}
.box-content-4 .box-ctn-rotate {
width: 1306px;
left: -54px;
}
.box-content-4 .img-box-4 {
left: 56px;
}
.box-content-4:first-child {
margin-top: -103px;
overflow: hidden;
}
.box-content-4.-fix {
margin-top: -16px;
}
.box-ctn-inner > .ar-triangle:first-child {
margin-top: 90px;
}
.fix-height .view-btn {
margin-right: 3.363636363636364%;
margin-bottom: 8.272727272727273%;
}
.icon-nav {
margin-top: 30px;
}
.icon-nav > li {
width: 120px;
height: 68px;
margin-top: 8px;
-webkit-transform: translateX(-40px);
transform: translateX(-40px);
}
.icon-nav > .number-one + li {
margin-top: 24px;
}
.icon-nav > .green-block:first-child, .icon-nav > .red-block:first-child {
margin-top: 66px;
}
.icon-nav > .number-one, .tag-box-2 {
width: 134px;
height: 97px;
}
.box-ctn-inner-2 {
left: 41px;
right: auto;
width: 1018px;
margin-top: 212px;
}
.box-ctn-inner-2.-style {
left: 0;
width: 1100px;
padding-bottom: 90px;
}
.tab-inner > li {
width: 138px;
}
.abs-txt-title {
right: 310px;
}
.heading-txt-shadow, .box-ctn-inner-3, .box-ctn-inner-2 .inline-elm-7, .box-ctn-inner-2 .btn-block {
width: 100%;
}
.map-box {
height: auto;
}
.mtp-column-wrap {
width: 100%;
padding: 0;
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.box-content-4 .slide-med-size .wifi-map img {
left: auto;
width: 100%;
-webkit-transform: none;
transform: none;
}
.wifi-area-box {
height: 350px;
}
.wifi-list-box, .wifi-list-box.owl-carousel {
width: 1000px;
padding: 0;
margin: 0 auto;
}
.box-content-4 .slide-med-size .hpl-link-box {
width: 100%;
margin-top: 40px;
}
.splitbox-right .logo-list {
max-width: 854px;
}
.splitbox-right .logo-list > li, .splitbox-right .logo-list-2 > li {
width: 90px;
max-width: 90px;
}
.bnr-desc-box {
right: 222px;
}
.box-top-2:after {
margin-top: 3.545454545454545%;
}
#map-canvas {
height: 655px;
}
.slide-med-size .map-box > img {
width: 100%;
}
.tab-head-styling-2 {
max-width: 1050px;
padding-left: 25px;
padding-right: 25px;
}
.tab-head-txt {
font-size: 36px;
width: 410px;
margin-top: 4px;
}
.bnr-info-list .abs-txt-anchor {
right: 218px;
font-size: 36px;
min-height: 64px;
line-height: 64px;
}
.abs-sub-txt {
margin-right: 33px;
}
.box-content-4 + .box-content.box-style {
margin-top: -125px;
}
.filter-menu .tlight-large-size {
margin-left: 48px;
}
.filter-menu-list {
white-space: normal;
overflow: visible;
}
.cmn-form-style .pack-btn-item {
margin-left: 211px;
}
.fixedonsmall {
margin-top: 629px;
margin-top: 565px;
}
.main-sec ~ .fixedonsmall {
margin-top: 646px;
margin-top: 589px;
}
.fixedonsmall .pack-btn-item {
margin-left: 123px;
}
.filter-menu-nav .swiper-button-next {
right: -5px;
}
.filter-menu-nav .swiper-button-prev {
left: -5px;
}
.full-bnr-content.-bg1,
.full-bnr-content.-bg2 {
min-height: 460px;
}
.full-bnr-desc {
font-size: 30px;
margin-top: 253px;
}
.youtube-vdo-iframe {
left: 80px;
}
.wrap-cont .med-box-ctn .brc-wrap-box .brc-style.-horizontal {
padding-right: 2.5%;
}
}
@media screen and (min-width : 1140px) {
.bnr-styling {
margin-top: -66px;
}
.abs-btm-box {
padding-left: 1000px;
}
.banner-inner img {
max-height: 549px;
}
}
@media screen and (min-width : 1200px) {
.main-menu > li > a {
padding: 0 12px;
}
.md-mari-size {
width: 1140px;
}
.box-list-elm {
width: 950px;
}
.pop-top-content {
width: auto;
}
.pop-top-content > li:first-child {
width: 244px;
padding-left: 10px;
margin-right: 12px;
}
.dd-list {
width: 220px;
}
.mini-box-slide {
width: 540px;
padding-bottom: 0;
}
.pop-top .mini-box-slide {
margin-left: 18px;
}
.pop-top-slide .owl-prev {
left: -15px;
}
.pop-mini {
width: 150px;
padding-left: 10px;
padding-right: 10px;
}
.pop-slide-ctn {
min-height: 77px;
}
.pop-slide-ctn:after {
content: "";
display: block;
position: absolute;
top: 6px;
right: -7px;
width: 1px;
height: 70px;
background-color: #c3c3c3;
}
.btm-area-box-2 {
margin-top: 3px;
}
.pop-btm-inner .owl-stage {
padding-top: 39px;
}
.card-slide .owl-dots {
bottom: -20px;
}
.mari-pop .mari-elm {
top: -80px;
right: -36px;
width: 180px;
height: 180px;
}
.pop-mini {
width: 190px;
min-width: 120px;
right: 79px;
top: -35px;
}
.pop-mini:after {
margin-top: -27px;
right: -30px;
}
.social-box {
padding-right: 160px;
}
.abs-btm-box {
left: 0;
right: auto;
padding-left: 1005px;
}
.abs-btm-box.-fix {
right: -25px;
}
.mari-btm.-action2,
.mari-btm {
right: auto;
}
.mari-btm {
position: fixed;
bottom: -35px;
}
.mari-btm.-action2 {
bottom: -47px;
}
.mari-action {
bottom: -34px;
}
.mari-btm.-action2 .mari-action {
width: 130px;
height: 167px;
bottom: -25px;
right: -38px;
}
.mari-btm.-action2 .bubble {
padding-right: 90px;
}
.bubble {
height: 55px;
line-height: 53px;
}
.bubble-txt {
font-size: 22px;
}
.filter-menu-item.slick-slide a {
padding-left: 25px;
padding-right: 25px;
}
}
@media screen and (min-width: 1800px) {
.live-chat-block {
left: 50%;
right: auto;
margin-left: 280px;
}
}
/* Custom CSS */
.iphone-banner {
height: 450px;
}
.iphone-banner .banner-text-outer-container {
-webkit-box-sizing: border-box;
box-sizing: border-box;
z-index: 1;
color: #fff;
position: relative;
height: 100%;
max-width: 1100px;
margin: auto;
padding: 0 36px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: left;
}
.iphone-banner .banner-text-container {
max-width: 520px;
}
.iphone-banner h3 {
font-family: 'TrueMedium';
margin-bottom: 32px;
font-size: 38px;
line-height: 36px;
}
.iphone-banner p {
font-size: 18px;
line-height: 26px;
margin-bottom: 48px;
width: 400px;
}
.iphone-banner .banner-button-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.iphone-banner .cmn-button {
margin-right: 12px;
width: 140px;
height: 40px;
border-radius: 8px;
background: -webkit-gradient(linear, left top, left bottom, from(#cecece), to(#fcfcfc));
background: -o-linear-gradient(top, #cecece 0%, #fcfcfc 100%);
background: linear-gradient(to bottom, #cecece 0%, #fcfcfc 100%);
}
.iphone-banner .cmn-button .button-txt {
font-size: 28px;
color: #040404;
font-family: "TrueLight";
}
.iphone-banner img {
margin: auto;
height: 450px;
width: 100%;
position: absolute;
top: 0;
-o-object-fit: cover;
object-fit: cover;
}
.device-grid#grid-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.device-grid#grid-box li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.device-grid#grid-box li .split-box {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.true-point-badge span {
font-size: 14px;
text-align: left;
padding: 4px;
}
.btn-true {
color: #fff;
background: url(../images/bg-red-btn.png) #EC1C24;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 5px;
border: 0;
cursor: pointer;
padding: 16px 24px;
font-size: 28px;
font-family: 'TrueMedium';
}
.desktop .top-menu > li.top-menu-cart:hover > a {
color: #484848;
}
.top-menu-cart svg {
height: 14px;
}
.true-point-badge {
border-radius: 8px;
background: -webkit-gradient(linear, left top, left bottom, from(#d0a96e), to(#facb48));
background: -o-linear-gradient(top, #d0a96e 0%, #facb48 100%);
background: linear-gradient(to bottom, #d0a96e 0%, #facb48 100%);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 8px 12px;
padding: 0 4px;
}
.true-point-badge img {
height: 24px;
margin-left: 4px;
}
.quantity-label {
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.quantity-container {
margin-left: 8px;
border: 1px solid #c5c5c5;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 96px;
height: 36px;
text-align: center;
}
.quantity-btn {
width: 32px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #e6e6e6;
cursor: pointer;
}
.quantity-value {
width: 32px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-left: 1px solid #c5c5c5;;
border-right: 1px solid #c5c5c5;
}
.move-number-container {
padding: 48px 0 16px 0;
border-top: 1px solid #d8d8d8;
margin-top: 48px;
}
.move-number-container h4 {
text-align: center;
font-size: 40px;
line-height: 40px;
font-family: 'TrueBold';
}
.move-number-container .cus-sel-style {
max-width: 220px;
margin: 16px auto;
}
.move-number-container .opt-sel {
height: 56px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 19px;
}
.order-btn-true {
min-width: 165px;
padding: 12px 16px;
}
.true-point-label {
white-space: nowrap;
}
.true-point-logo {
height: 40px;
display: inline-block;
vertical-align: middle;
margin: 0 -4px 4px -4px;
}
.opt-sel.filter-label {
border: none;
text-align: right;
padding-right: 0;
}
@media screen and (min-width: 1000px) {
.main-menu > li {
margin-left: 10px;
}
.main-menu > li a {
padding: 0 8px;
}
}
@media screen and (min-width: 1050px) {
.main-menu > li a {
padding: 0 10px;
}
}
@media screen and (min-width: 1100px) {
.main-menu > li {
margin-left: 12px;
}
.main-menu > li a {
padding: 0 12px;
}
}
@media screen and (min-width: 1200px) {
.main-menu > li {
margin-left: 15px;
}
.main-menu > li a {
padding: 0 12px;
}
}
@media screen and (max-width: 900px) {
.true-point-badge span {
font-size: 12px;
letter-spacing: -0.2px;
}
.true-point-logo {
height: 24px;
margin-left: -6px;
}
.order-btn-true {
font-size: 18px;
min-width: 70px;
padding: 8px 10px;
}
.mini-desc-list > li.true-point-text {
width: 85%;
}
.quantity-container {
width: 64px;
height: 30px;
font-size: 14px;
}
}
@media screen and (max-width: 860px) {
.iphone-banner .banner-text-outer-container {
padding: 0 16px;
}
.iphone-banner .banner-text-container {
max-width: 480px;
width: 65%;
}
.iphone-banner h3 {
margin-bottom: 16px;
font-size: 30px;
line-height: 28px;
}
.iphone-banner p {
font-size: 15px;
line-height: 20px;
margin-bottom: 24px;
width: 100%;
}
.iphone-banner .cmn-button {
width: 120px;
height: 32px;
}
.iphone-banner .cmn-button .button-txt {
font-size: 18px;
}
}
@media screen and (min-width: 480px) {
.ctn-box .ctn-tgl-box:first-child .select-group .inline-icon {
margin-top: 68%;
}
}
@media screen and (min-width: 600px) {
.ctn-box .ctn-tgl-box:first-child .select-group .inline-icon {
margin-top: 58%;
}
}
@media screen and (min-width: 900px) {
.ctn-box .ctn-tgl-box:first-child .select-group .inline-icon {
margin-top: 480px;
}
.split-box .true-point-badge span {
line-height: 20px;
}
}
@media screen and (max-width: 480px) {
.order-btn-true {
min-width: 100px;
padding: 10px 16px;
}
.quantity-container {
margin-left: 4px;
}
.true-point-badge {
padding: 4px 8px;
}
.true-point-badge span {
font-size: 14px;
}
.iphone-banner .banner-text-container {
width: 80%;
}
.iphone-banner h3 {
font-size: 28px;
}
.iphone-banner p {
font-size: 14px;
}
}
.cart-badge-icon {
position: relative;
width: 16px;
display: inline-block;
}
.cart-badge {
position: absolute;
background: #eb232a;
height: 13px;
width: 13px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
color: #fff;
font-size: 14px;
top: 1px;
left: 9px;
font-weight: 600;
}
@media screen and (max-width: 860px) {
.iphone-banner,
.iphone-banner img {
height: 300px;
}
}