/*@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);*/ @font-face {font-family: Helvetica Neue;src: url('HelveticaNeue.woff') format('woff');} @font-face {font-family: MHeiHK;src: url('MHeiHK.woff') format('woff');} html{font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%} body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block} audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none} a{background-color:transparent; color: #000; text-decoration: none; }a:active,a:hover{outline:0; text-decoration: none; }abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%} sub,sup{font-size:12px;line-height:0;position:relative;/*vertical-align:baseline*/}sup{ /*top:-0.5em*/ }sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} @font-face{font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; font-weight:normal;font-style:normal}[class^="w-icon-"],[class*=" w-icon-"]{font-family:'webflow-icons';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-icon-slider-right:before{content:"\e600"}.w-icon-slider-left:before{content:"\e601"}.w-icon-nav-menu:before{content: }.w-icon-arrow-down:before,.w-icon-dropdown-toggle:before{content:"\e603"}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{height:100%} body{margin:0;min-height:100%;background-color:#f2f2f2;font-size:14px;line-height:20px;color:#000}img{max-width:100%;vertical-align:middle;display:inline-block} html.w-mod-touch *{background-attachment:scroll !important}.w-block{display:block}.w-inline-block{max-width:100%;display:inline-block}.w-clearfix:before,.w-clearfix:after{content:" ";display:table}.w-clearfix:after{clear:both}.w-preserve-3d{transform-style:preserve-3d}.w-hidden{display:none}.w-button{display:inline-block;padding:9px 15px;background-color:#3898EC;color:white;border:0;line-height:inherit;text-decoration:none;cursor:pointer;border-radius:0}input.w-button{-webkit-appearance:button}html[data-w-dynpage] [data-w-cloak]{color:transparent !important} /*h1,h2,h3,h4,h5,h6{font-weight:bold;margin-bottom:10px} h1{font-size:38px;line-height:44px;margin-top:0px} h2{font-size:32px;line-height:36px;margin-top:0px} h3{font-size:24px;line-height:30px;margin-top:20px} h4{font-size:18px;line-height:24px;margin-top:10px} h5{font-size:14px;line-height:20px;margin-top:10px} h6{font-size:12px;line-height:18px;margin-top:10px}*/ p{margin-top:0;margin-bottom:10px}a:focus{outline:0}blockquote{margin:0 0 10px 0;padding:10px 20px;border-left:5px solid #E2E2E2;font-size:18px;line-height:22px}figure{margin:0;margin-bottom:10px}figcaption{margin-top:5px;text-align:center}ul,ol{margin-top:0;padding-left:40px}.w-list-unstyled{padding-left:0;list-style:none}.w-embed:before,.w-embed:after{content:" ";display:table}.w-embed:after{clear:both}.w-video{width:100%;position:relative;padding:0}.w-video iframe,.w-video object,.w-video embed{position:absolute;top:0;left:0;width:100%;height:100%}fieldset{padding:0;margin:0;border:0}button,html input[type="button"],input[type="reset"]{border:0;cursor:pointer;-webkit-appearance:button}.w-form{margin:0 0 15px}.w-form-done{display:none;padding:20px;text-align:center;background-color:#dddddd}.w-form-fail{display:none;margin-top:10px;padding:10px;background-color:#ffdede}label{display:block;margin-bottom:5px;font-weight:bold}.w-input,.w-select{display:block;width:100%;height:38px;padding:8px 12px;margin-bottom:10px;font-size:14px;line-height:1.42857143;color:#333333;vertical-align:middle;background-color:#ffffff;border:1px solid #cccccc}.w-input:-moz-placeholder,.w-select:-moz-placeholder{color:#999}.w-input::-moz-placeholder,.w-select::-moz-placeholder{color:#999;opacity:1}.w-input:-ms-input-placeholder,.w-select:-ms-input-placeholder{color:#999}.w-input::-webkit-input-placeholder,.w-select::-webkit-input-placeholder{color:#999}.w-input:focus,.w-select:focus{border-color:#3898EC;outline:0}.w-input[disabled],.w-select[disabled],.w-input[readonly],.w-select[readonly],fieldset[disabled] .w-input,fieldset[disabled] .w-select{cursor:not-allowed;background-color:#eeeeee}textarea.w-input,textarea.w-select{height:auto}.w-select{background-image:-webkit-linear-gradient(white 0, #f3f3f3 100%);background-image:linear-gradient(white 0, #f3f3f3 100%)}.w-select[multiple]{height:auto}.w-form-label{display:inline-block;cursor:pointer;font-weight:normal;margin-bottom:0}.w-checkbox,.w-radio{display:block;margin-bottom:5px;padding-left:20px}.w-checkbox:before,.w-radio:before,.w-checkbox:after,.w-radio:after{content:" ";display:table}.w-checkbox:after,.w-radio:after{clear:both}.w-checkbox-input,.w-radio-input{margin:4px 0 0;margin-top:1px \9;line-height:normal;float:left;margin-left:-20px}.w-radio-input{margin-top:3px}.w-container{margin-left:auto;margin-right:auto;max-width:940px}.w-container:before,.w-container:after{content:" ";display:table}.w-container:after{clear:both}.w-container .w-row{margin-left:-10px;margin-right:-10px}.w-row:before,.w-row:after{content:" ";display:table}.w-row:after{clear:both}.w-row .w-row{margin-left:0;margin-right:0}.w-col{position:relative;float:left;width:100%;min-height:1px;padding-left:5px;padding-right:5px;padding-bottom:20px}.w-col .w-col{padding-left:0;padding-right:0}.w-col-1{width:8.33333333%}.w-col-2{width:16.66666667%}.w-col-3{width:25%}.w-col-4{width:33.33333333%}.w-col-5{width:100%}.w-col-6{width:50%}.w-col-7{width:58.33333333%}.w-col-8{width:66.66666667%}.w-col-9{width:75%}.w-col-10{width:83.33333333%}.w-col-11{width:91.66666667%}.w-col-12{width:100%}.w-hidden-main{display:none !important}@media screen and (max-width:991px){.w-container{max-width:728px}.w-hidden-main{display:inherit !important}.w-hidden-medium{display:none !important}.w-col-medium-1{width:8.33333333%}.w-col-medium-2{width:16.66666667%}.w-col-medium-3{width:25%}.w-col-medium-4{width:33.33333333%}.w-col-medium-5{width:41.66666667%}.w-col-medium-6{width:50%}.w-col-medium-7{width:58.33333333%}.w-col-medium-8{width:66.66666667%}.w-col-medium-9{width:75%}.w-col-medium-10{width:83.33333333%}.w-col-medium-11{width:91.66666667%}.w-col-medium-12{width:100%}.w-col-stack{width:100%;left:auto;right:auto}}@media screen and (max-width:767px){.w-hidden-main{display:inherit !important}.w-hidden-medium{display:inherit !important}.w-hidden-small{display:none !important}.w-row,.w-container .w-row{margin-left:0;margin-right:0}.w-col{width:100%;left:auto;right:auto}.w-col-small-1{width:8.33333333%}.w-col-small-2{width:16.66666667%}.w-col-small-3{width:25%}.w-col-small-4{width:33.33333333%}.w-col-small-5{width:41.66666667%}.w-col-small-6{width:50%}.w-col-small-7{width:58.33333333%}.w-col-small-8{width:66.66666667%}.w-col-small-9{width:75%}.w-col-small-10{width:83.33333333%}.w-col-small-11{width:91.66666667%}.w-col-small-12{width:100%}}@media screen and (max-width:479px){.w-container{max-width:none}.w-hidden-main{display:inherit !important}.w-hidden-medium{display:inherit !important}.w-hidden-small{display:inherit !important}.w-hidden-tiny{display:none !important}.w-col{width:100%}.w-col-tiny-1{width:8.33333333%}.w-col-tiny-2{width:16.66666667%}.w-col-tiny-3{width:25%}.w-col-tiny-4{width:33.33333333%}.w-col-tiny-5{width:41.66666667%}.w-col-tiny-6{width:50%}.w-col-tiny-7{width:58.33333333%}.w-col-tiny-8{width:66.66666667%}.w-col-tiny-9{width:75%}.w-col-tiny-10{width:83.33333333%}.w-col-tiny-11{width:91.66666667%}.w-col-tiny-12{width:100%}}.w-widget{position:relative}.w-widget-map{width:100%;height:400px}.w-widget-map label{width:auto;display:inline}.w-widget-map img{max-width:inherit}.w-widget-map .gm-style-iw{width:90% !important;height:auto !important;top:7px !important;left:6% !important;display:inline;text-align:center;overflow:hidden}.w-widget-map .gm-style-iw+div{display:none}.w-widget-twitter{overflow:hidden}.w-widget-twitter-count-shim{display:inline-block;vertical-align:top;position:relative;width:28px;height:20px;text-align:center;background:white;border:#758696 solid 1px;border-radius:3px}.w-widget-twitter-count-shim *{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.w-widget-twitter-count-shim .w-widget-twitter-count-inner{position:relative;font-size:15px;line-height:12px;text-align:center;color:#999;font-family:serif}.w-widget-twitter-count-shim .w-widget-twitter-count-clear{position:relative;display:block}.w-widget-twitter-count-shim.w--large{width:36px;height:28px;margin-left:7px}.w-widget-twitter-count-shim.w--large .w-widget-twitter-count-inner{font-size:18px;line-height:18px}.w-widget-twitter-count-shim:not(.w--vertical){margin-left:5px;margin-right:8px}.w-widget-twitter-count-shim:not(.w--vertical).w--large{margin-left:6px}.w-widget-twitter-count-shim:not(.w--vertical):before,.w-widget-twitter-count-shim:not(.w--vertical):after{top:50%;left:0;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}.w-widget-twitter-count-shim:not(.w--vertical):before{border-color:rgba(117,134,150,0);border-right-color:#5d6c7b;border-width:4px;margin-left:-9px;margin-top:-4px}.w-widget-twitter-count-shim:not(.w--vertical).w--large:before{border-width:5px;margin-left:-10px;margin-top:-5px}.w-widget-twitter-count-shim:not(.w--vertical):after{border-color:rgba(255,255,255,0);border-right-color:white;border-width:4px;margin-left:-8px;margin-top:-4px}.w-widget-twitter-count-shim:not(.w--vertical).w--large:after{border-width:5px;margin-left:-9px;margin-top:-5px}.w-widget-twitter-count-shim.w--vertical{width:61px;height:33px;margin-bottom:8px}.w-widget-twitter-count-shim.w--vertical:before,.w-widget-twitter-count-shim.w--vertical:after{top:100%;left:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}.w-widget-twitter-count-shim.w--vertical:before{border-color:rgba(117,134,150,0);border-top-color:#5d6c7b;border-width:5px;margin-left:-5px}.w-widget-twitter-count-shim.w--vertical:after{border-color:rgba(255,255,255,0);border-top-color:white;border-width:4px;margin-left:-4px}.w-widget-twitter-count-shim.w--vertical .w-widget-twitter-count-inner{font-size:18px;line-height:22px}.w-widget-twitter-count-shim.w--vertical.w--large{width:76px}.w-widget-gplus{overflow:hidden}.w-background-video{position:relative;overflow:hidden;height:500px;color:white}.w-background-video>video{background-size:cover;background-position:50% 50%;position:absolute;right:-100%;bottom:-100%;top:-100%;left:-100%;margin:auto;min-width:100%;min-height:100%;z-index:-100}.w-slider{position:relative;height:300px;text-align:center;background:#dddddd;clear:both;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0)}.w-slider-mask{position:relative;display:block;overflow:hidden;z-index:1;left:0;right:0;height:100%;white-space:nowrap}.w-slide{position:relative;display:inline-block;vertical-align:top;width:100%;height:100%;white-space:normal;text-align:center}.w-slider-nav{position:absolute;z-index:2;top:auto;right:0;bottom:0;left:0;margin:auto;padding-top:10px;height:40px;text-align:center;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0)}.w-slider-nav.w-round>div{border-radius:100%}.w-slider-nav.w-num>div{width:auto;height:auto;padding:.2em .5em;font-size:inherit;line-height:inherit}.w-slider-nav.w-shadow>div{box-shadow:0 0 3px rgba(51,51,51,0.4)}.w-slider-nav-invert{color:#fff}.w-slider-nav-invert>div{background-color:rgba(34,34,34,0.4)}.w-slider-nav-invert>div.w-active{background-color:#222}.w-slider-dot{position:relative;display:inline-block;width:1em;height:1em;background-color:rgba(255,255,255,0.4);cursor:pointer;margin:0 3px .5em;transition:background-color 100ms,color 100ms}.w-slider-dot.w-active{background-color:#fff}.w-slider-arrow-left,.w-slider-arrow-right{position:absolute;width:80px;top:0;right:0;bottom:0;left:0;margin:auto;cursor:pointer;overflow:hidden;color:white;font-size:40px;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.w-slider-arrow-left [class^="w-icon-"],.w-slider-arrow-right [class^="w-icon-"],.w-slider-arrow-left [class*=" w-icon-"],.w-slider-arrow-right [class*=" w-icon-"]{position:absolute}.w-slider-arrow-left{z-index:3;right:auto}.w-slider-arrow-right{z-index:4;left:auto}.w-icon-slider-left,.w-icon-slider-right{top:0;right:0;bottom:0;left:0;margin:auto;width:1em;height:1em}.w-dropdown{display:inline-block;position:relative;text-align:left;margin-left:auto;margin-right:auto;z-index:900}.w-dropdown-btn,.w-dropdown-toggle,.w-dropdown-link{position:relative;vertical-align:top;text-decoration:none;color:#222222;padding:20px;text-align:left;margin-left:auto;margin-right:auto;white-space:nowrap}.w-dropdown-toggle{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;cursor:pointer;padding-right:40px}.w-dropdown-toggle:focus{outline:0}.w-icon-dropdown-toggle{position:absolute;top:0;right:0;bottom:0;margin:auto;margin-right:20px;width:1em;height:1em}.w-dropdown-list{position:absolute;background:#dddddd;display:none;min-width:100%}.w-dropdown-list.w--open{display:block}.w-dropdown-link{padding:10px 20px;display:block;color:#222222}.w-dropdown-link.w--current{color:#0082f3}.w-nav[data-collapse="all"] .w-dropdown,.w-nav[data-collapse="all"] .w-dropdown-toggle{display:block}.w-nav[data-collapse="all"] .w-dropdown-list{position:static}@media screen and (max-width:991px){.w-nav[data-collapse="medium"] .w-dropdown,.w-nav[data-collapse="medium"] .w-dropdown-toggle{display:block}.w-nav[data-collapse="medium"] .w-dropdown-list{position:static}}@media screen and (max-width:767px){.w-nav[data-collapse="small"] .w-dropdown,.w-nav[data-collapse="small"] .w-dropdown-toggle{display:block}.w-nav[data-collapse="small"] .w-dropdown-list{position:static}.w-nav-brand{padding-left:10px}}@media screen and (max-width:479px){.w-nav[data-collapse="tiny"] .w-dropdown,.w-nav[data-collapse="tiny"] .w-dropdown-toggle{display:block}.w-nav[data-collapse="tiny"] .w-dropdown-list{position:static}}.w-lightbox-backdrop{color:#000;cursor:auto;font-family:serif;font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;letter-spacing:normal;line-height:normal;list-style:disc;text-align:start;text-indent:0;text-shadow:none;text-transform:none;visibility:visible;white-space:normal;word-break:normal;word-spacing:normal;word-wrap:normal;position:fixed;top:0;right:0;bottom:0;left:0;color:#fff;font-family:"Helvetica Neue",Helvetica,Ubuntu,"Segoe UI",Verdana,sans-serif;font-size:17px;line-height:1.2;font-weight:300;text-align:center;background:rgba(0,0,0,0.9);z-index:2000;outline:0;opacity:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-tap-highlight-color:transparent;-webkit-transform:translate(0, 0)}.w-lightbox-backdrop,.w-lightbox-container{height:100%;overflow:auto;-webkit-overflow-scrolling:touch}.w-lightbox-content{position:relative;height:100vh;overflow:hidden}.w-lightbox-view{position:absolute;width:100vw;height:100vh;opacity:0}.w-lightbox-view:before{content:"";height:100vh}.w-lightbox-group,.w-lightbox-group .w-lightbox-view,.w-lightbox-group .w-lightbox-view:before{height:86vh}.w-lightbox-frame,.w-lightbox-view:before{display:inline-block;vertical-align:middle}.w-lightbox-figure{position:relative;margin:0}.w-lightbox-group .w-lightbox-figure{cursor:pointer}.w-lightbox-img{width:auto;height:auto;max-width:none}.w-lightbox-image{display:block;float:none;max-width:100vw;max-height:100vh}.w-lightbox-group .w-lightbox-image{max-height:86vh}.w-lightbox-caption{position:absolute;right:0;bottom:0;left:0;padding:.5em 1em;background:rgba(0,0,0,0.4);text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-lightbox-embed{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.w-lightbox-control{position:absolute;top:0;width:4em;background-size:24px;background-repeat:no-repeat;background-position:center;cursor:pointer;-webkit-transition:all .3s;transition:all .3s}.w-lightbox-left{display:none;bottom:0;left:0;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0yMCAwIDI0IDQwIiB3aWR0aD0iMjQiIGhlaWdodD0iNDAiPjxnIHRyYW5zZm9ybT0icm90YXRlKDQ1KSI+PHBhdGggZD0ibTAgMGg1djIzaDIzdjVoLTI4eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDN2MjNoMjN2M2gtMjZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==")}.w-lightbox-right{display:none;right:0;bottom:0;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMjQgNDAiIHdpZHRoPSIyNCIgaGVpZ2h0PSI0MCI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMC0waDI4djI4aC01di0yM2gtMjN6IiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Im0xIDFoMjZ2MjZoLTN2LTIzaC0yM3oiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+")}.w-lightbox-close{right:0;height:2.6em;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMTggMTciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxNyI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMCAwaDd2LTdoNXY3aDd2NWgtN3Y3aC01di03aC03eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDd2LTdoM3Y3aDd2M2gtN3Y3aC0zdi03aC03eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=");background-size:18px}.w-lightbox-strip{padding:0 1vh;line-height:0;white-space:nowrap;overflow-x:auto;overflow-y:hidden}.w-lightbox-item{display:inline-block;width:10vh;padding:2vh 1vh;box-sizing:content-box;cursor:pointer;-webkit-transform:translate3d(0, 0, 0)}.w-lightbox-active{opacity:.3}.w-lightbox-thumbnail{position:relative;height:10vh;background:#222;overflow:hidden}.w-lightbox-thumbnail-image{position:absolute;top:0;left:0}.w-lightbox-thumbnail .w-lightbox-tall{top:50%;width:100%;-webkit-transform:translate(0, -50%);-ms-transform:translate(0, -50%);transform:translate(0, -50%)}.w-lightbox-thumbnail .w-lightbox-wide{left:50%;height:100%;-webkit-transform:translate(-50%, 0);-ms-transform:translate(-50%, 0);transform:translate(-50%, 0)}.w-lightbox-spinner{position:absolute;top:50%;left:50%;box-sizing:border-box;width:40px;height:40px;margin-top:-20px;margin-left:-20px;border:5px solid rgba(0,0,0,0.4);border-radius:50%;-webkit-animation:spin .8s infinite linear;animation:spin .8s infinite linear}.w-lightbox-spinner:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border:3px solid transparent;border-bottom-color:#fff;border-radius:50%}.w-lightbox-hide{display:none}.w-lightbox-noscroll{overflow:hidden}@media (min-width:768px){.w-lightbox-content{height:96vh;margin-top:2vh}.w-lightbox-view,.w-lightbox-view:before{height:96vh}.w-lightbox-group,.w-lightbox-group .w-lightbox-view,.w-lightbox-group .w-lightbox-view:before{height:84vh}.w-lightbox-image{max-width:96vw;max-height:96vh}.w-lightbox-group .w-lightbox-image{max-width:82.3vw;max-height:84vh}.w-lightbox-left,.w-lightbox-right{display:block;opacity:.5}.w-lightbox-close{opacity:.8}.w-lightbox-control:hover{opacity:1}}.w-lightbox-inactive,.w-lightbox-inactive:hover{opacity:0}.w-richtext:before,.w-richtext:after{content:" ";display:table}.w-richtext:after{clear:both}.w-richtext ol,.w-richtext ul{overflow:hidden}.w-richtext .w-richtext-figure-selected.w-richtext-figure-type-video div:before,.w-richtext .w-richtext-figure-selected[data-rt-type="video"] div:before{outline:2px solid #2895f7}.w-richtext .w-richtext-figure-selected.w-richtext-figure-type-image div,.w-richtext .w-richtext-figure-selected[data-rt-type="image"] div{outline:2px solid #2895f7}.w-richtext figure.w-richtext-figure-type-video>div:before,.w-richtext figure[data-rt-type="video"]>div:before{content:'';position:absolute;display:none;left:0;top:0;right:0;bottom:0;z-index:1}.w-richtext figure{position:relative;max-width:60%}.w-richtext figure>div:before,.w-richtext figure img{cursor:default !important}.w-richtext figure img{width:100%}.w-richtext figure figcaption.w-richtext-figcaption-placeholder{opacity:.6}.w-richtext figure div{font-size:0;color:transparent}.w-richtext figure.w-richtext-figure-type-image,.w-richtext figure[data-rt-type="image"]{display:table}.w-richtext figure.w-richtext-figure-type-image>div,.w-richtext figure[data-rt-type="image"]>div{display:inline-block}.w-richtext figure.w-richtext-figure-type-image>figcaption,.w-richtext figure[data-rt-type="image"]>figcaption{display:table-caption;caption-side:bottom}.w-richtext figure.w-richtext-figure-type-video,.w-richtext figure[data-rt-type="video"]{width:60%;height:0}.w-richtext figure.w-richtext-figure-type-video iframe,.w-richtext figure[data-rt-type="video"] iframe{position:absolute;top:0;left:0;width:100%;height:100%}.w-richtext figure.w-richtext-figure-type-video>div,.w-richtext figure[data-rt-type="video"]>div{width:100%}.w-richtext figure.w-richtext-align-center{margin-right:auto;margin-left:auto;clear:both}.w-richtext figure.w-richtext-align-center.w-richtext-figure-type-image>div,.w-richtext figure.w-richtext-align-center[data-rt-type="image"]>div{max-width:100%}.w-richtext figure.w-richtext-align-normal{clear:both}.w-richtext figure.w-richtext-align-fullwidth{width:100%;max-width:100%;text-align:center;clear:both;display:block;margin-right:auto;margin-left:auto}.w-richtext figure.w-richtext-align-fullwidth>div{display:inline-block;padding-bottom:inherit}.w-richtext figure.w-richtext-align-fullwidth>figcaption{display:block}.w-richtext figure.w-richtext-align-floatleft{float:left;margin-right:15px;clear:none}.w-richtext figure.w-richtext-align-floatright{float:right;margin-left:15px;clear:none}.w-nav{position:relative;background:#dddddd;z-index:1000}.w-nav:before,.w-nav:after{content:" ";display:table}.w-nav:after{clear:both}.w-nav-brand{position:relative;float:left;text-decoration:none;color:#333333}.w-nav-link{position:relative;display:inline-block;vertical-align:middle;text-decoration:none;color:#222222;padding:20px;text-align:left;margin-left:auto;margin-right:auto}.w-nav-link.w--current{color:#0082f3}.w-nav-menu{position:relative;float:right;padding-top:0px}.w--nav-menu-open{display:block !important;position:absolute;top:100%;left:0;right:0;background:#C8C8C8;text-align:center;overflow:visible;min-width:200px}.w--nav-link-open{display:block;position:relative}.w-nav-overlay{position:absolute;overflow:hidden;display:none;top:100%;left:0;right:0;width:100%}.w-nav-overlay .w--nav-menu-open{top:0}.w-nav[data-animation="over-left"] .w-nav-overlay{width:auto}.w-nav[data-animation="over-left"] .w-nav-overlay,.w-nav[data-animation="over-left"] .w--nav-menu-open{right:auto;z-index:1;top:0}.w-nav[data-animation="over-right"] .w-nav-overlay{width:auto}.w-nav[data-animation="over-right"] .w-nav-overlay,.w-nav[data-animation="over-right"] .w--nav-menu-open{left:auto;z-index:1;top:0} .w-nav-button{position:relative;float:right;padding:5px 0px;font-size:24px;display:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.w-nav-button.w--open{background-color:#C8C8C8;color:white}.w-nav[data-collapse="all"] .w-nav-menu{display:none}.w-nav[data-collapse="all"] .w-nav-button{display:block}@media screen and (max-width:991px){.w-nav[data-collapse="medium"] .w-nav-menu{display:none; text-align: left}.w-nav[data-collapse="medium"] .w-nav-button{display:block}}@media screen and (max-width:767px){.w-nav[data-collapse="small"] .w-nav-menu{display:none}.w-nav[data-collapse="small"] .w-nav-button{display:block}.w-nav-brand{padding-left:0px}}@media screen and (max-width:479px){.w-nav[data-collapse="tiny"] .w-nav-menu{display:none}.w-nav[data-collapse="tiny"] .w-nav-button{display:block}}.w-tabs{position:relative}.w-tabs:before,.w-tabs:after{content:" ";display:table}.w-tabs:after{clear:both}.w-tab-menu{position:relative}.w-tab-link{position:relative;display:inline-block;vertical-align:top;text-decoration:none;padding:9px 30px;text-align:left;cursor:pointer;color:#222222;background-color:#dddddd}.w-tab-link.w--current{background-color:#C8C8C8}.w-tab-content{position:relative;display:block;overflow:hidden}.w-tab-pane{position:relative;display:none}.w--tab-active{display:block}@media screen and (max-width:479px){.w-tab-link{display:block}}.w-ix-emptyfix:after{content:""}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.w-dyn-empty{padding:10px;background-color:#dddddd}.w-dyn-bind-empty{display:none !important}.w-condition-invisible{display:none !important} h1 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h2 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h3 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h4 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h5 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h6 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } h7 { font-size: inherit;font-weight: inherit;line-height: 120% !important;color: inherit;margin: 0px !important;display: inline-block; } /*#pagewrap { width: 100%;max-width: 1600px;margin: 0 auto;background-color: #ffffff; }*/ #pagewrap { width: 100%;margin: 0 auto;background-color: #ffffff;overflow: hidden; } .remark { font-size: 12px;line-height: 120%;width: 100%;text-align: left;display: inline-block; } .compremark { font-size: 12px;line-height: 120%;width: 72%;text-align: left;display: inline-block; } .hsofferbut { background: #7337a8;width: auto;font-size: 12px;font-weight: bold;line-height: 100%; color: #ffffff;padding: 6px 10px;display: inline-block;vertical-align: top;text-align: center;border-radius: 3px;transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s;cursor: pointer; } .hsofferbut:hover { background: #e6007e; } .textcolorpup { color: #810581; } .textcolornewpup { color: #774FDA; } .nowrap { white-space: nowrap;color: inherit; } /************************************************************************************ wifi7 *************************************************************************************/ .wcontent { width: 70%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;line-height: 120%; } .wicon { width: 55%;height: auto;display: inline-block; } .wimg { width: 80%;height: auto;display: inline-block; } .wicontxt { width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;line-height: 120%;margin-top: 10px; } .wiconcol-container { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: auto; grid-gap: 10px; width: 80%; } .wiconcol-container2 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: auto; grid-gap: 20px; } .wifilabel { width: auto;height: auto;display: inline-block;font-size: 16px;font-weight: bold;color: #7a53e2;background-color: #fff;padding: 0px 12px 0px 8px;border-radius: 0px 100px 100px 0px;box-shadow: 4px 4px 8px #00000052;position: absolute;top: 10px;left: 0px; } .wifi7 { color: #fff;background-color: #000;background: linear-gradient(90deg,rgba(79, 38, 188, 1) 0%, rgba(79, 38, 188, 1) 100%);box-shadow: 4px 4px 8px #ffffff52; } .wifi7mbbg { background: #ffcaa1;background-image: linear-gradient(90deg, rgba(255, 202, 161, 1) 0%, rgba(255, 230, 194, 1) 100%) !important; } /************************************************************************************ ck *************************************************************************************/ .cktopmsgbox { width: 99%;height: auto;display: inline-block;font-size: 30px;font-weight: bold;color: #fff;text-align: center;line-height: 140%; background: rgb(181,148,201); background: linear-gradient(135deg, rgba(181,148,201,1) 0%, rgba(141,122,211,1) 50%, rgba(123,114,219,1) 100%); padding: 20px 20px;border-radius: 20px;margin: 20px 0px; } .cktopmsgboxen { width: 99%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;color: #fff;text-align: center;line-height: 130%; background: rgb(181,148,201); background: linear-gradient(135deg, rgba(181,148,201,1) 0%, rgba(141,122,211,1) 50%, rgba(123,114,219,1) 100%); padding: 20px 20px;border-radius: 20px;margin: 20px 0px; } .ckmsgbtn { width: auto;height: auto;display:inline-block;padding: 12px 30px;margin: 10px 0px 0px 0px;background-color: #743ad5; border-radius: 100px; font-size: 16px;font-weight: normal;color: #fff;line-height: 100%; cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .ckmsgbtn:hover { background-color: #4200b1; } .ckiconmb { width: 30px;height: auto;display: inline-block;vertical-align: -5px; } /************************************************************************************ table *************************************************************************************/ .set1table { border-collapse: collapse; border: 2px solid #dbdbdb; padding: 0px; text-align: center;font-size: 16px;line-height: 120%;font-weight: normal;padding: 12px 10px; } .set1tablenormal { font-weight: normal; } .set1tabletitle { background: #f8f0ff; border-left: #fff 2px solid;border-right: #fff 2px solid;text-align: center;font-size: 18px;font-weight: bold; } .set1tableL { /*background: #e4eff5;*/background: #f8f0ff;border-left: #fff 2px solid;text-align: left; } .set1tableR { background: #fff; border-right: #fff 2px solid; } .set1tableheader { /*background-image: url(bgheader.jpg);background-size: 100% 100%;*/color: #fff;background-color: #672AA9; } .set1tableheader2 { background: #f5f5f5; color: #000; } .set1tableheaderprc { background: #e9e9e9;color: #672AA9;font-weight: bold;font-size: 120% !important; } .planarrowleftframe { display: none; } .planarrowrightframe { display: none; } .planarrowdownframe { display: none; } .wtable { width: 88%;padding-bottom: 10px;max-width: 1600px; } /************************************************************************************ plan new offer *************************************************************************************/ .pnoframe { width: 80%;height: auto;display: inline-block;border: 2px #774FDA solid;border-radius: 20px;padding: 20px;margin-top: 20px; } .pnotxtframe { max-width: 30%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;line-height: 120%;vertical-align: middle; } .pnosybframe { width: auto;height: auto;display: inline-block;font-size: 32px;font-weight: bold;line-height: 120%;color: #774FDA;margin: 0px 20px;vertical-align: middle; } .pnooffericonfr { width: 100%;height: auto;display: inline-block; } .pnooffericonimg { width: 100px;height: auto;display: inline-block; } /************************************************************************************ mth btn *************************************************************************************/ .mthbtnon { width: 28%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;color: #000;line-height: 120%;background-color: #fff;border: 2px #774fda solid; border-radius: 8px;padding: 14px 0px;margin: 0px 5px;text-align: center; } .mthbtnoff { width: 28%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;color: #000;line-height: 120%;background-color: #fff;border: 2px #e8e8e8 solid; border-radius: 8px;padding: 14px 0px;margin: 0px 5px;text-align: center;cursor: pointer; } .mthbtnoff:hover { background-color: #774fda;border: 2px #774fda solid;color: #fff; } .mthbtntxt { width: 100%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;line-height: 120%;margin-bottom: 10px; } /************************************************************************************ mth btn theme-orange *************************************************************************************/ .mthbtnon.theme-orange { border-color:#fe6843 !important;} .mthbtnoff.theme-orange:hover { background-color: #fe6843 !important;border-color:#fe6843 !important;} /************************************************************************************ plan 3steps *************************************************************************************/ .planstepfr { width: 99%;height: auto;display: inline-block;border: 2px #774FDA solid;border-radius: 36px;margin: 0px 0px 30px 0px;padding: 16px 0px;text-align: center;box-shadow: 0px 2px 10px #0000005c; background: linear-gradient(178deg, rgba(255,255,255,1) 30%, rgba(225,213,255,1) 100%); } .plansteppic { width: 150px;height: auto;display: inline-block;vertical-align: middle; } .plansteptxt { width: auto;height: auto;display: inline-block;font-size: 36px;font-weight: bold;color: #774FDA;line-height: 120%;vertical-align: middle;margin-right: 1.5%; } .plansteptxten { width: auto;height: auto;display: inline-block;font-size: 28px;font-weight: bold;color: #774FDA;line-height: 120%;vertical-align: middle;margin-right: 1.5%; } .planstepiconLfr { width: 50%;height: auto;display: inline-block;vertical-align: middle; } .planstep-container { display: grid;grid-template-columns: 1fr auto 1fr auto 1fr;grid-template-rows: auto;grid-gap: 6px;width: 100%;height: auto;text-align: center; } .planstepiconfr { width: 100%;height: auto;display: inline-block;position: relative; } .planstepiconarrow { width: 100%;height: auto;display: inline-block;margin-top: 45px; } .planstepiconimg { width: 120px;height: auto;display: inline-block; } .planstepiconimgarrow { width: 20px;height: auto;display: inline-block; } .planstepicontxt { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%; } .planstepicontxten { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%; } .plansteptitlespace { padding: 5px 0px 15px 0px !important; } .planstepnofr { width: 30px;height: 30px;font-size: 18px;font-weight: bold;line-height: 100%;color: #fff;position: absolute;top: 5px;left: 5px;background-color: #774FDA;border-radius: 100px;display: flex;justify-content: center;align-items: center; } /************************************************************************************ popup faq *************************************************************************************/ .pfheader { width: 100%;height: auto;display: inline-block;font-size: 28px;font-weight: bold;line-height: 100%;color: #000;text-align: center;margin-bottom: 12px; } .pfsubtitle { width: 100%;height: auto;font-size: 22px;font-weight: bold;line-height: 100%;text-align: left;padding: 12px 0px;text-decoration: underline; } .pfnotd { width: 3%; } .pfqus { width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;line-height: 120%;color: #774FDA;text-align: left;margin-bottom: 5px; } .pfans { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: normal;line-height: 120%;color: #000000;text-align: left;margin-bottom: 20px; } .pfappicon { width: 40px;height: auto;display: inline-block;vertical-align: -13px; } /************************************************************************************ floating banner *************************************************************************************/ .fobannerfr { position: fixed;left: 10px; bottom: 10px;z-index: 90;display: inline-block; } .fobanner { width: 340px;height: auto;display: inline-block;box-shadow: 0px 4px 10px #000000a8; } .fobannerclose { width: 30px;height: auto;display: inline-block;margin-bottom: 5px;cursor: pointer; } .fobannerfrpopup { position: fixed;right: 1.5%; bottom: 5%;z-index: 90;display: inline-block; } .fobannerpopup { width: 180px;height: auto;display: inline-block;filter: drop-shadow(0px 0px 5px #000000a8);opacity: 0.93;cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .fobannerpopup:hover { transform: scale(1.06); } /************************************************************************************ app *************************************************************************************/ .contentwidth { width: 88%;max-width: 1600;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%; } .appstepfr { width: 300px;height: auto;display: inline-block;vertical-align: top;position: relative;margin-top: 20px;text-align: center; } .appstepimg { width: 240px;height: auto;display: inline-block;filter: drop-shadow(2px 4px 5px #dbdbdb); } .appsteparrowfr { width: 30px;height: auto;display: inline-block;vertical-align: top;margin: 0px 20px;margin-top: 110px; } .appsteparrowimg { width: 30px;height: auto;display: inline-block; } .appstepnofr { width: 50px;height: 50px;font-size: 26px;font-weight: bold;line-height: 100%;color: #fff;position: absolute;top: -10px;left: -15px;background-color: #000;border-radius: 100px;display: flex;justify-content: center;align-items: center; } .appsteptxt { width: 100%;height: auto;display: inline-block;font-size: 24px;font-weight: bold;line-height: 120%;text-align: center;margin-top: 20px; } .appdlframe { width: 1100px;height: auto;display: inline-block;text-align: center; } .appdlscreenfr { width: 20%;height: auto;display: inline-block;margin: 2%;vertical-align: middle; } .appdlscreenimg { filter: drop-shadow(0px 5px 15px #00000063); } .appdlcontentfr { width: 60%;height: auto;display: inline-block;text-align: center;vertical-align: middle; } .appdltitle { width: 100%;height: auto;display: inline-block;font-size: 32px;font-weight: bold;line-height: 120%; } .appdlcontent { width: 100%;height: auto;display: inline-block;font-size: 24px;font-weight: bold;line-height: 120%;margin-bottom: 10px; } .appdltab { width: 120px;height: auto;display: inline-block;margin: 0px 5px;vertical-align: middle; } .appdlqr { width: 140px;height: auto;display: inline-block;vertical-align: middle;margin-bottom: 10px; } .appiconfr { width: 150px;height: auto;display: inline-block; } .apptopiconimg { width: 25px;height: auto;display: inline-block;vertical-align: -6px; } .topmenuanibut { background-color: #4a73fb;/*background-color: #00d58b;*/float: right;font-size: 14px;font-weight: bold; color: #fff;padding: 23px 23px;margin: 0px 0.5%;text-decoration: none;border-radius: 100px;line-height: 0%;transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; } .topmenuanibut:hover { background-color: #3a68ff;/*background-color: #00d58b;*/ } .appbtmdlfr { width: 800px;height: auto;display: inline-block;padding: 20px 20px 10px 20px;/*border: 2px #00ec9a solid;*/box-shadow: 0px 3px 15px #b3d1c79e;border-radius: 30px;border: 1px #ffffff9c solid;margin-bottom: 30px;background-size: 120% auto;background-position: bottom; } .appbtmimg { width: 90px;height: auto;display: inline-block;margin-right: 1%; vertical-align: middle; } .appbtmtxtfr { width: 80%;height: auto;display: inline-block;text-align: left;vertical-align: middle; } .appbtmheader { font-size: 26px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 10px 0px;width: 100%; } .appbtmcontent { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%; } .appbtmappicon { width: 100%;height: auto;display: inline-block;border-top: 1px #dbdbdb solid;margin-top: 20px;padding-top: 8px; } .appbtmdlfrnew { width: 80%;height: auto;display: inline-block;padding: 20px;margin-bottom: 30px; } .appbtmtxtfrnew { width: 100%;height: auto;display: inline-block;text-align: center;margin-top: 10px; } .appbtmheadernew { font-size: 30px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 16px 0px;width: 100%; } .appbtmcontentnew { width: 100%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;line-height: 120%; } .appbtmappiconnew { width: 100%;height: auto;display: inline-block;margin-top: 15px; } .appbtm { width: 100%;height: auto;display: inline-block; } .appbtm img { width: 130px;height: auto;display: inline-block; } .appbtmqr { border: 1px #dbdbdb solid;border-radius: 12px;margin-left: 0.5%; } /************************************************************************************ new plan css *************************************************************************************/ .nplantabcolor { padding: 2px 6px;background-color: #774FDA; color: #fff; font-size: 12px; border-radius: 3px; white-space: nowrap;width: auto;display: inline-block;line-height: 100%;vertical-align: 1px;box-shadow: 0px 0px 5px #fff;margin-right: 3px;/*margin-top: 3px;*/ } .nplantabcoloron { padding: 2px 6px;background-color: #fff; color: #774FDA; font-size: 12px; border-radius: 3px; white-space: nowrap;width: auto;display: inline-block;line-height: 100%;vertical-align: 1px;box-shadow: 0px 0px 5px #fff;margin-right: 3px;/*margin-top: 3px;*/ } .nplancol1-container { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; width: 40%; height: auto; text-align: center; margin-top: 48px; } .nplancol4-container { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: auto; grid-gap: 12px; width: 100%; height: auto; text-align: center; margin-top: 48px; } .nplancontainertopen { margin-top: 48px; } .nplancolframe { width: 100%;height: auto;display: inline-block;border: 2px #672AA9 solid;padding: 4px;border-radius: 8px;scroll-snap-align: center;position: relative;box-shadow: 0px 20px 20px #00000017; } .nplancolframetab { border-top-left-radius: 0px; } .nplanoffertabspacetd { line-height: 0%; } .nplanoffertabspace { width: 1px;height: 60px; } .nplanoffertabfrcol1 { width: auto;height: auto;display: inline-block;position: absolute;left: -2px;top: -61px;font-size: 18px;font-weight: bold;line-height: 100%; } .nplanoffertabfrcol1en { left: -2px;top: -61px;font-size: 18px;font-weight: bold;line-height: 100%; } .nplanoffertabfrcol4 { width: auto;height: auto;display: inline-block;position: absolute;left: -2px;top: -61px;font-size: 18px;font-weight: bold;line-height: 100%; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 18px;font-weight: bold;line-height: 100%; } .nplanoffertab { width: auto;height: auto;display: inline-block;color: #fff;background-color: #7a53e2;border: 1px #7a53e2 solid;padding: 6px 14px;border-radius: 8px 8px 0px 0px;margin-right: 1px; } .nplanoffertaben { width: auto;height: auto;display: inline-block;color: #fff;background-color: #7a53e2;border: 1px #7a53e2 solid;padding: 4px 14px 5px 14px;border-radius: 8px 8px 0px 0px;margin-right: 1px; } .nplanoffertabonline { width: auto;height: auto;display: inline-block;color: #672AA9;background-color: #f5f5f5;border: 1px #672AA9 solid;padding: 6px 4px;border-radius: 8px 8px 0px 0px;margin-right: 1px; } .nplanoffertabonlineen { width: auto;height: auto;display: inline-block;color: #672AA9;background-color: #f5f5f5;border: 1px #672AA9 solid;padding: 4px 4px 5px 4px;border-radius: 8px 8px 0px 0px;margin-right: 1px; } .nplanpricedatafr { width: 100%;height: auto;display: inline-block;background-color: #672AA9;border-radius: 6px;padding: 3px 0px 5px 0px; } .nplanpricedata-container { display: grid; grid-template-columns: 1fr auto 1fr; grid-template-rows: auto; grid-gap: 8%; width: 84%; height: auto; text-align: left; margin: 0px 8%; } .nplanpricedatacol2 { width: 100%;height: auto;display: inline-block;vertical-align: top;text-align: left;padding: 10px 0px 12px 0px;line-height: 100%; } .nplanpricedatacollinefr { width: 100%;height: auto;display: inline-block;display: flex;justify-content: center;align-items: center; } .nplanpricedatacolline { width: 1px;height: 50px;display: inline-block;background-color: #ffffff8c; } .nplanpricedatatitle { width: auto;height: auto;display: inline-block;font-size: 12px;font-weight: bold;line-height: 120%;color: #fff;white-space: nowrap; } .nplanpricedatasml { width: auto;height: auto;display: inline-block;font-size: 70%;font-weight: bold;line-height: 100%;color: #fff;font-family: Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; } .nplanpricedata { width: auto;height: auto;display: inline-block;font-size: 40px;font-weight: bold;line-height: 100%;color: #fff;white-space: nowrap;font-family: Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; } .nplanpricedataremark { width: 100%;height: auto;display: inline-block;font-size: 10px;font-weight: bold;line-height: 120%;color: #fff; } .nplanpricedataremarknone { width: 100%;height: auto;display: inline-block;font-size: 10px;font-weight: bold;line-height: 120%;color: #672AA9; } .nplanpricedataspace { width: 24px;height: auto;display: inline-block;vertical-align: middle; } .nplanpricedataframe { width: auto;height: auto;display: inline-block;vertical-align: middle; } .nplanpricedatatable { margin: 10px 0px; } .nplanpricedatatd { width: 5%; } .nplancontentfr { width: 94%;height: auto;display: inline-block;margin: 16px 0px 70px 0px;font-size: 18px;font-weight: bold; } .nplancontentheader { width: 100%;height: auto;display: inline-block;font-size: 22px;font-weight: bold;line-height: 120%;text-align: left;margin-bottom: 5px; } .nplancontentnplanul { width: 100%;height: auto;display: inline-block;text-align: left; } .nplanul { list-style-image: url(pt-np.png);padding-left: 18px;margin-bottom: 16px;line-height: 150%; } .nplanul li { margin: 8px 0px; } .nplanlinone { list-style: none; } .nplanoffer { width: 100%;height: auto;display: inline-block;color: #672AA9;line-height: 120%;text-align: left;position: relative; } .nplanofferopenimg { width: 20px;height: 20px;position: absolute;right: 0;top: 0;display: flex;justify-content: center;align-items: center;cursor: pointer; } .nplanofferfr { width: 100%;height: auto;display: inline-block;background-color: #F5F5F5;border-radius: 6px;margin-top: 8px;padding: 10px 0px; } .nplanoffertxtfr { width: 96%;height: auto;display: inline-block;margin: 8px 0px; } .nplanoffertxticon { width: 18px;height: auto;display: inline-block;margin-right: 1%;vertical-align: middle; } .nplanoffertxt { width: 86%;height: auto;display: inline-block;text-align: left;color: #672AA9;line-height: 120%;vertical-align: middle; } .nplanbtnfr { width: 100%;height: auto;display: inline-block;position: absolute;bottom: 3%;left: 0%;text-align: center; } .nplanbtn { width: 92%;height: auto;display: inline-block;background-color: #672AA9;font-size: 16px;font-weight: bold;line-height: 120%;color: #fff;text-align: center;padding: 10px 0px;border-radius: 100px;cursor: pointer; transition: background 0.5s;-webkit-transition: background 0.5s;-moz-transition: background 0.5s; } .nplanbtn:hover { background-color: #8635dd; } .nplan7day { width: auto;height: auto;display: inline-block;font-size: 28px;font-weight: bold;line-height: 100%;color: #fff; } .nplan7dayen { width: auto;height: auto;display: inline-block;font-size: 24px;font-weight: bold;line-height: 100%;color: #fff; } .nplanpdtimgrent { width: 180px;height: auto;display: inline-block;margin-bottom: 15px; } .nplanaddonframecol1 { width: 40% !important;margin-top: 30px !important;border-radius: 8px; } .nplandatamb { width: 100%;height: auto;display: inline-block;font-size: 14px;font-weight: bold;line-height: 120%;color: #fff; } .nplanimgcol2 { width: 44%;height: auto;display: inline-block;vertical-align: middle;margin-bottom: 15px;text-align: center;line-height: 110%;font-size: 18px;font-weight: bold; } .nplanimgcol2inbtw { width: 8%;height: auto;display: inline-block;vertical-align: middle;text-align: center;font-size: 20px;font-weight: bold;line-height: 100%;margin-bottom: 15px; } .nplanmy3icon { width: 50px;height: auto;display: inline-block;vertical-align: -14px; } .nplanimg { width: 70%;height: auto;display: inline-block; } .nptab { width: auto;height: auto;display: inline-block;font-size: 18px;font-weight: bold;color: #fff;line-height: 100%;background: #7a53e2;padding: 8px 20px;position: absolute;left: 0px; top: -36px;border-radius: 10px 10px 0px 0px; } /************************************************************************************ updated *************************************************************************************/ .planaddonofferbox { width: 100%;height: auto;display: inline-block; background: rgb(214,198,255); background: linear-gradient(90deg, rgba(214,198,255,1) 0%, rgba(122,83,226,1) 20%, rgba(122,83,226,1) 50%, rgba(122,83,226,1) 80%, rgba(214,198,255,1) 100%); box-shadow: 0px 3px 5px #e1e1e1;padding: 10px;font-size: 20px;font-weight: bold;line-height: 120%;color: #fff;margin-bottom: 5px; } /************************************************************************************ problem *************************************************************************************/ .pbcontainer { width: 90%;height: auto;display: inline-block;line-height: 100%;margin: 20px 0px; } .pbgrid-container { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: auto; grid-gap: 20px; } .pbgridcol { width: 100%; display: inline-block; margin: 0px; vertical-align: top; float: left; scroll-snap-align: center; position: relative; line-height: 0%; } .pbimgfr { width: 100%;height: auto;display: inline-block; } .pbimg { width: 80%;height: auto;display: inline-block; } .pbtxt { width: 100%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;line-height: 120%;margin-top: 10px; } /************************************************************************************ watsons *************************************************************************************/ .logombreward { width: auto;height: 80px;display: inline-block;vertical-align: -25px; } .logomb { width: auto;height: 60px;display: inline-block;vertical-align: -16px; } .pricetab { width: auto;height: auto;display: inline-block;background-color: #7920bb;font-size: 18px;font-weight: bold;line-height: 100%;color: #ffffff;position: absolute;top: 3%;right: 3%;padding: 5px 14px; } /************************************************************************************ plan offer *************************************************************************************/ .planoffercol2 { width: 45%;height: auto;display: inline-block;vertical-align: top; } .planoffercolor { width: 5%;height: auto;display: inline-block;vertical-align: top;font-size: 24px;font-weight: bold;line-height: 100%;margin-top: 40px; } .planoffercolor2 { width: 5%;height: auto;display: inline-block;vertical-align: top;font-size: 24px;font-weight: bold;line-height: 100%;margin-top: 120px; } .videopagination { width: 100%;height: 40px;display: inline-block; } .planofferimgtitle { width: 100%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;color: #000;line-height: 110%;margin-bottom: 5px; } .planofferimgtitleen { width: 100%;height: 40px;display: inline-block;font-size: 16px;font-weight: bold;color: #000;line-height: 110%;margin-bottom: 5px; } /************************************************************************************ mb step *************************************************************************************/ .mbstepsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 40px 0px; } .mbstepcontainer { background-color: #fff;width: 80%;max-width: 1200px; height: auto;display: inline-block;text-align: left; } .mbstepsubtitle { font-size: 28px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 20px 0px;width: 100%;height: auto;display: inline-block;text-align: left;border-bottom: 2px #000 solid; } .mbstepsubtitle2 { font-size: 22px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 10px 0px;width: 100%;height: auto;display: inline-block;text-align: left; } .stepframecol5 { width: 18.5%;display: inline-block;text-align:left;font-size: 16px;line-height: 120%;margin: 10px 5px 20px 5px;vertical-align: top;text-align: center; } .stepimg { width: 100%;height: auto; /*border: #4599e1 1px solid;*/margin-bottom: 5px; } .stepno { width: 30px;height: 30px;float: left;margin-right: 5px;border-radius: 100%;background-color: #000;color: #fff;display: flex;justify-content: center;align-items: center;font-size: 18px;font-weight: bold;line-height: 100%; } .steptxtcol4 { width: 90%;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%;margin-top: 5px;text-align: left; } .stepcontent { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: bold;line-height: 120%;margin-top: 15px; } .stepframein3 { width: 60%;display: inline-block;text-align:left;font-size: 16px;line-height: 120%;margin: 10px 0px 20px 0px;vertical-align: top;text-align: center; } .stepframein3col3 { width: 30.8%;display: inline-block;text-align:left;font-size: 16px;line-height: 120%;margin: 0px 5px 0px 5px;vertical-align: top;text-align: center; } .stepplantxt { width: 100%;height: auto;display: inline-block;font-size: 14px;font-weight: bold;color: #672AA9;line-height: 120%;margin: 5px 0px 0px 0px;cursor: pointer; } .stepplanqmark { width: 20px;height: auto;display: inline-block;vertical-align: -4px; } /************************************************************************************ new ui *************************************************************************************/ .whyiconframe { width: 16%;height: auto;display: inline-block;vertical-align: top; } .whyiconimg { width: 55%;height: auto;display: inline-block; } .whyicontxt { width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;line-height: 120%; } .planofferframe { width: 100%;height: auto;display: flex;justify-content: center;align-items: center;text-align: center;margin: 0px 0px 0px 0px;position: relative;font-size: 18px;font-weight: bold;line-height: 120%;/*background-color: #fff;*/ } .planofferframe2 { width: 100%;height: 290px;display: flex;justify-content: center;align-items: center;text-align: center;margin: 0px 0px 20px 0px;position: relative;font-size: 18px;font-weight: bold;line-height: 120%;/*background-color: #fff;*/ } .planoffertxtframe { width: 90%;height: auto;display: inline-block;position: relative; } .planofferopenframerow1 { width: auto;height: auto;display: inline-block;position: absolute;top: -4%;right: -35%; } .planofferopenframerow2 { width: auto;height: auto;display: inline-block;position: absolute;top: 15%;right: -35%; } .planofferopenframerow1en { width: auto;height: auto;display: inline-block;position: absolute;top: -4%;right: -35%; } .planofferopenframerow2en { width: auto;height: auto;display: inline-block;position: absolute;top: 35%;right: -35%; } .planofferopenimg { width: 24px;height: auto;display: inline-block; } .planapplybut { width: auto;height: auto;display:inline-block;padding: 12px 32px;margin: 10px 0px 10px 0px;background-color: #7a53e2;border-radius: 50px; font-size: 20px;font-weight: bold;color: #fff;line-height: 100%; cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .planapplybut:hover { background-color: #4200b1; } .planapplybut2 { width: auto;height: auto;display:inline-block;padding: 12px 32px;margin: 10px 0px 10px 0px;background-image: linear-gradient(to right, #f40993,#bf24b0,#903ccc);border-radius: 50px; font-size: 20px;font-weight: normal;color: #fff;line-height: 100%; cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .planapplybut2:hover { } .planaddonframe { width: 99.4%;height: auto; display: inline-block;border: 2px solid #dbdbdb;margin: 20px 0px;padding: 30px 0px; } .planaddonframecol1 { width: 60%;height: auto; display: inline-block;border: 2px solid #dbdbdb;margin: 20px 0px;padding: 30px 0px; } .planaddontitle { width: 98%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;line-height: 120%;margin-bottom: 20px; } .planaddonsubtitle { width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: normal;line-height: 120%;margin-bottom: 20px; } .planaddonframecol2 { width: 30%;height: auto; display: inline-block;margin: 0px 10px; } .planaddonimg { width: 100px;height: auto; display: inline-block;margin-bottom: 10px; } .planaddonprice { width: 100%;height: auto;display: inline-block;font-size: 26px;font-weight: bold;line-height: 120%; } .planaddonpricedis { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: normal;line-height: 120%;text-decoration: line-through;color: #a0a0a0;margin-bottom: 10px; } .planaddondata { width: 100%;height: auto;display: inline-block;font-size: 28px;font-weight: bold;line-height: 120%;margin-bottom: 10px; } .planaddontxt { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: normal;line-height: 120%; } .planaddonvotxt { width: 100%;height: auto;display: inline-block;font-size: 18px;font-weight: normal;line-height: 120%;margin: 50px 0px 0px 0px; } .planaddonvotxtbold { display: inline-block;font-size: 28px;font-weight: bold;line-height: 120%; } .planiconmb { width: 24px;height: auto;display: inline-block;vertical-align: -6px; } .planmbframe { font-size: 18px;line-height: 120%; width: 100%;height: auto;display: inline-block;background-image: linear-gradient(to right, #caa3f2, #caa3f2, #caa3f2, #b3b2f4, #b4d8f0);padding: 10px 0px; } .planpopupstitletabframe { width: 100%;height: auto;display: inline-block;text-align: left; } .planpopupstitletab { width: auto;height: auto;display: inline-block;font-size: 20px;font-weight: bold;color: #fff; line-height: 100%;padding: 10px 50px 10px 50px;background-color: #8f0ea5; border-radius: 100px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;margin-bottom: 10px; background-image: linear-gradient(to right, #ffffff, #8f0ea5, #8f0ea5, #8f0ea5); } .planpopuppdtframecol4 { width: 34%;height: auto;display: inline-block;float: none;background-color: #fff;vertical-align: top;margin-bottom: 15px;padding: 20px 0px;border-radius: 20px;box-shadow: 0px 4px 12px #ebebeb; } .planpopuppdtspeccol4 { width: 1%;height: auto;display: inline-block; } .planpopuporgprice { font-size: 14px; color: #a0a0a0;width: 100%;height: auto;margin-top: 10px; } .planroutercontainer { width: 100%;height: auto;display: inline-block;vertical-align: bottom; } .planplusrouterfr { width: 100%;height: auto;display: inline-block;margin: 10px 0px;font-size: 30px;font-weight: bold;line-height: 30%;vertical-align: middle; } .planrouterfr { width: 100%;height: auto;display: inline-block;margin: 0px 0px;vertical-align: middle; } .planrouterrentfr { width: 40%;height: auto;display: inline-block;margin: 0px 8px;vertical-align: top;padding: 15px;/*background-color: #fbfbfb;border-radius: 10px;box-shadow: 0px 3px 5px #e1e1e1;*/ } .planroutertxt { width: 100%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;line-height: 120%;margin-bottom: 5px; } .planroutertxten { width: 100%;height: auto;display: inline-block;font-size: 14px;font-weight: bold;line-height: 120%;margin-bottom: 5px; } .planrouteraddon { width: 100%;height: auto;display: inline-block;background-color: #fbfbfb;border-radius: 10px;padding: 8px 0px;margin-top: 10px;font-size: 16px;font-weight: bold;line-height: 120%;box-shadow: 0px 3px 5px #e1e1e1; } .routersection { background-color: #fff;width: 80%;height: auto;display: inline-block;padding: 40px 0px 40px 0px; } .rutopeniconfr { width: auto;height: auto;display: inline-block;vertical-align: -4px; } .rutopenicon { width: 16px;height: 16px;display: flex;justify-content: center;align-items: center;background-color: #460078;border-radius: 50px; } .rutopeniconimg { filter: invert(1); } .rutopentxt { width: auto;height: auto;display: inline-block;font-size: 12px;font-weight: bold;color: #460078;line-height: 120%; } .rutopenmthtxt { width: auto;height: auto;display: inline-block;font-size: 14px;font-weight: bold;line-height: 120%;background-color: #ebebeb;padding: 7px 20px; margin: 2px 0px 0px 0px;border-radius: 18px;border-top-left-radius: 0px;border-top-right-radius: 0px;background-image: linear-gradient(#ffffff, #ebebeb, #ebebeb); } .orgpricetxt { width: 100%;height: auto;display: inline-block;font-size: 14px;font-weight: normal;line-height: 120%;color: #a0a0a0;margin-top: 4px; } .offercontent { font-size: 20px;font-weight: normal;line-height: 140%;color: #000; width: 80%;height: auto;text-align: center;display: inline-block; } .offercontenten { font-size: 18px;font-weight: normal;line-height: 140%;color: #000; width: 80%;height: auto;text-align: center;display: inline-block; } .ltdapplybtn { display: none; } .rutopentxt2 { width: auto;height: auto;display: inline-block;font-size: 16px;font-weight: bold;color: #460078;line-height: 120%;vertical-align: -14px; } .rutopentxt2en { width: auto;height: auto;display: inline-block;font-size: 12px;font-weight: bold;color: #460078;line-height: 120%;vertical-align: -7px; } .pagetablewidth { width: 100%; } .steptablewidth { width: 80%; } /************************************************************************************ Ltd offer *************************************************************************************/ .newminitab { font-size: 14px;color: #fff; line-height: 100%;display: inline-block;background-color: #FF00A6;border-radius: 5px;padding: 4px 10px;vertical-align: 2px; } .ltdoffergrid-container { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; grid-gap: 20px; padding: 5px; } .ltdoffergridcol { width: 60%;display: inline-block;margin: 0px;vertical-align: top;scroll-snap-align: center;border: 2px solid #f3dd88;position: relative; } .ltdoffergridtable {border-collapse: collapse;padding: 0px;text-align: center;font-size: 20px;line-height: 140%;font-weight: bold;background-color: rgba(255, 255, 255, 0.5);text-shadow: 0px 0px 5px #ffffff; } .ltdoffergridtxt { font-size: 20px;font-weight: bold;line-height: 120%;position: absolute;left: 0px;bottom: 0px; } .ltddaysicon { width: auto;height: auto;position: absolute;top: 0%;right: -45%; } .ltddaysiconen { width: auto;height: auto;position: absolute;top: 0%;right: -30%; } .ltdofferplantitle { font-size: 20px;line-height: 120%;width: 100%;height: auto;display: inline-block;margin-bottom: 10px; } .ltdpdtframe1 { width: 43%;height: auto;display: inline-block;text-align: center;font-size: 16px;font-weight: bold; line-height: 120%;vertical-align: top; } .ltdpdtframe2 { width: 43%;height: auto;display: inline-block;text-align: center;font-size: 16px;font-weight: bold; line-height: 120%;vertical-align: top; } .ltdpdtframeor { width: 2%;height: auto;display: inline-block;text-align: center;font-size: 22px;font-weight: bold; line-height: 100%;vertical-align: top;margin-top: 50px; } .ltdpdtimg { width: auto;height: 120px;display: inline-block; } .ltdpdtframemb { width: 100%;height: auto;display: inline-block;text-align: center;font-size: 22px;font-weight: bold; line-height: 100%;margin-top: 5px; } .ltdpdtimgmb { width: auto;height: 40px;display: inline-block;vertical-align: -13px; } .ltdpdtspec { width: 3%;height: auto;display: inline-block; } .ltdicon { width: auto;height: auto;position: absolute;top: -78%;right: -8%; } .ltdiconen { width: auto;height: auto;position: absolute;top: -60%;right: -20%; } .ltdplanmsg { width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;line-height: 120%;padding: 10px 0px;background: #dbdbdb; } .totalkfr { width: auto;height: auto;display: inline-block;cursor: pointer; } .totalkimg { height: 54px !important;vertical-align: -16px !important; } .ltdbannerfr { width: 100%;height: auto;display: inline-block;margin-top: 10px; } /************************************************************************************ article *************************************************************************************/ .atcpageheader { font-size: 32px;font-weight: bold;color: #000; line-height: 120%; display: inline-block;width: 98%;height: auto;text-align: left;margin-bottom: 20px; } .atcsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 60px 0px; } .atccontent { width: 80%;max-width: 1100px;height: auto;display: inline-block; } .atccontentL { width: 75%;height: auto;display: inline-block;float: left;text-align: left; } .atccontentR { width: 25%;height: auto;display: inline-block;float: left;text-align: left; } .atctabletitle { width: 100%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;line-height: 100%;cursor: pointer;text-align: center; } .atctablecontent { width: 98%;height: auto;display: inline-block;background: #f9f9f9;border: 1px solid #aaa;padding: 10px;margin-bottom: 40px; } .atcpointolframe { margin: 15px 0px !important; } .atcpointol { list-style: none;padding-left: 18px;margin: 0px; } .atcpointlink { font-size: 16px;color: #4c4c4c; line-height: 180%; text-decoration: none; } .atcpointlink:hover { text-decoration: underline; } .atctitle { font-size: 28px;font-weight: bold;color: #39007f; line-height: 120%;text-decoration: underline; display: inline-block;width: 98%;height: auto;text-align: left;margin-bottom: 20px; } .atcsubtitle { font-size: 24px;font-weight: bold;color: #39007f; line-height: 120%;display: inline-block;width: 98%;height: auto;text-align: left;margin-bottom: 6px; } .atcsubtitleh4 { font-size: 20px;font-weight: bold;color: #39007f; line-height: 120%;display: inline-block;width: 98%;height: auto;text-align: left;margin-bottom: 6px; } .atccontenttxt { font-size: 18px;color: #4c4c4c;line-height: 140%;display: inline-block;width: 98%;height: auto;text-align: left;margin-bottom: 40px; } .atcbacktopframe { width: 100%;height: auto;display: inline-block;text-align: right; } .atcbacktopimg { width: 20px;height: auto;display: inline-block; } .atcpic { width: 98%;height: auto;display: inline-block;margin: 14px 0px 20px 0px; } .atcsideframe { width: 100%;height: auto;display: inline-block;margin-bottom: 25px; } .atcsidetitle { font-size: 16px;font-weight: bold;color: #39007f; line-height: 120%;display: inline-block;width: 100%;height: auto;text-align: left;margin-bottom: 10px; } .atcsidesubtitle { font-size: 14px;font-weight: normal;color: #666666; line-height: 160%;display: inline-block;width: 100%;height: auto;text-align: left;margin-bottom: 8px; } .atcsidelink { font-size: inherit;font-weight: inherit;color: inherit; text-decoration: none; line-height: inherit;display: inline-block; } .atcsidelink:hover { color: #743ad5; } .atchyperlink { word-break: break-all; } .atcscreenframe { width: 23%;height: auto;display: inline-block;float: left;margin-right: 10px;margin-bottom: 20px;vertical-align: top; } .atcscreenspace { width: 100%;height: 1px;display: inline-block;float: left; } .atcscreenimg { width: 100%;height: auto;display: inline-block;border: 2px #dbdbdb solid; } .atcscreentxt { font-size: 15px;font-weight: bold; color: #4c4c4c;line-height: 140%;display: inline-block;width: 100%;height: auto;text-align: left;text-align: center; } .topmenudlbut { background-color: #f7008e;float: right;font-size: 18px;font-weight: bold; color: #fff;padding: 21px 18px;text-decoration: none;border-radius: 3px;line-height: 0%;margin-right: 20px; -webkit-animation: dlbut 2s infinite alternate; -moz-animation: dlbut 2s infinite alternate; -ms-animation: dlbut 2s infinite alternate; -o-animation: dlbut 2s infinite alternate; animation: dlbut 2s infinite alternate; } @-webkit-keyframes dlbut { from {background-color: #f7008e;} to {background-color: #79008a;} } .atctable { border-collapse: collapse;border: 1px solid #aaa;padding: 8px;font-size: 18px;line-height: 120%;font-weight: normal; } /************************************************************************************ smarthome *************************************************************************************/ .sthmframe { width: 18%;height: auto;display: inline-block;margin: 0px 5px;vertical-align: top; } .sthmtitle { width: 100%;height: auto;display: inline-block;font-size: 22px;font-weight: bold;line-height: 120%;margin: 10px 0px; } .plantab { width: 100%;height: auto;display: inline-block; background: #fff;margin-bottom: 15px;background-image: url(../images/tabline.jpg);background-position: bottom;padding-bottom: 2px;background-repeat: no-repeat;background-size: auto; } .plantabbut1 { width: 32%; height: auto; vertical-align: top; background-color: #f1f1f1; padding: 14px 0px;font-size: 16px;font-weight: bold; color: #bebebe;line-height: 100%; text-align: center;display: inline-block;border-radius: 10px;border-bottom-left-radius: 0px;border-bottom-right-radius: 0px; cursor: pointer; transition: 0.3s; } .plantabbut1:hover { background-color: #7a53e2;color: #fff; } .plantabbut2 { width: 32%; height: auto; vertical-align: top; background-color: #f1f1f1; padding: 14px 0px;font-size: 16px;font-weight: bold; color: #bebebe;line-height: 100%; text-align: center;display: inline-block;border-radius: 10px;border-bottom-left-radius: 0px;border-bottom-right-radius: 0px; cursor: pointer; transition: 0.3s; } .plantabbut2:hover { background-color: #7a53e2;/*background-color: #bc2fac;*/color: #fff; } .plantabbuton1 { background-color: #7a53e2 !important;color: #fff; } .plantabbuton2 { background-color: #7a53e2 !important;color: #fff;/*background-image: linear-gradient(to right, #e92d8a,#bc2fac,#9935c4,#973bc3) !important;*/ } .plantabbuten { font-size: 22px;padding: 12px 0px; } .plantabiconimg { width: 60px;height: auto;display: inline-block;vertical-align: 3px;position: absolute;top: 3px;right: 3px; } /*.plantabiconimg { width: 50px;height: auto;display: inline-block;vertical-align: 3px; }*/ .bbfortresslogo { width: auto;height: 40px;display: inline-block;vertical-align: -9px; } /************************************************************************************ plan *************************************************************************************/ .planarrowleftframe { display: none; } .planarrowrightframe { display: none; } .plantablewidthcol3 { width: 100%;padding-bottom: 10px;max-width: 1600px; } .frameplancol3 { width: 32.6%;display: inline-block;margin: 0px;vertical-align: top;float: left;scroll-snap-align: center; } .frameplanspace { width: 1%;display: inline-block;margin: 0px;vertical-align: top;float: left; } .hs5gtxtwht { color: #ffffff !important; } .vhplanpriceorg { text-decoration: line-through;font-weight: normal;text-shadow: none; } .hsrow2pricebold { font-size: 185%;line-height: 140%;font-weight: bold;color: #ff9100; } .hsrow1new { width: 100%;height:auto;display: inline-block;vertical-align: top;margin: 15px 0px; } .hsrow2new { width: 100%;height:auto;display: inline-block;vertical-align: top;margin: 15px 0px; } .plandataframe1 { width: auto;height: auto;display: inline-block;position: relative; } .vhplanpricebox { position: relative;width: auto;height: auto;display: inline-block; } .vhplandaysicon { width: auto;height: auto;position: absolute;top: 0%;right: -47%; } .plantablewidthcol1 { width: 100%;padding-bottom: 10px;max-width: 1600px; } .frameplancol1 { width: 60%;display: inline-block;margin: 0px;vertical-align: top;scroll-snap-align: center;position: relative; } .plantablewidthcol2 { width: 100%;padding-bottom: 10px;max-width: 1600px; } .frameplancol2 { width: 49.5%;display: inline-block;margin: 0px;vertical-align: top;float: left;scroll-snap-align: center; } .frameplanspace2 { width: 1%;display: inline-block;margin: 0px;vertical-align: top;float: left; } .bbmprutframespace { width: 100%;height: 404px;display: inline-block; } .bbmprutframespaceen { width: 100%;height: 404px;display: inline-block; } .bbmprutframe { width: 90%;height: auto;display: inline-block;border: 2px #fff solid;padding: 10px;border-radius: 20px;background: #fff;box-shadow: 0px 3px 8px #cab6d4; } .bbmpplus { font-size: 24px;font-weight: bold;line-height: 100%;width: 100%;height: auto;display: inline-block;text-align: center;margin: 10px 0px; } .bbmppdtframe { width: 28%;height: auto;display: inline-block;text-align: center;font-size: 16px;font-weight: bold; line-height: 120%;vertical-align: top; } .bbmppdtframeor { width: 4%;height: auto;display: inline-block;text-align: center;font-size: 20px;font-weight: bold; line-height: 100%;vertical-align: top;margin-top: 50px; } .bbmppdtimg { width: 170px;height: auto;display: inline-block; } .bbmppdtimgrent { width: 180px;height: auto;display: inline-block; } .bbmppdttxtL { font-size: 14px;font-weight: bold; line-height: 120%;width: 32%;height: auto;display: inline-block; } .bbmppdttxtR { font-size: 14px;font-weight: bold; line-height: 120%;width: 66%;height: auto;display: inline-block; } .plannewtab { width: auto;height: auto;display: inline-block;background-color: #650093;padding: 5px 10px;position: absolute;left: 5px;top: 5px;font-size: 18px;font-weight: bold;color: #fff; } .planofferbgframe { padding: 8px 25px;border-radius: 5px;background-color: #fdbe7b;border: 5px #f37023 solid; } .planlimitedtab { width: auto;height: auto;display: inline-block;background-color: #f37023;padding: 12px 10px;position: absolute;left: 2px;top: -48px;font-size: 24px;font-weight: bold;color: #fff; } .planlimitedtab2 { width: auto;height: auto;display: inline-block;background-color: #f37023;padding: 5px 12px;font-size: 20px;font-weight: bold;color: #fff; } .planlim { width: auto;height: auto;display: inline-block;background-color: #650093;font-size: 18px;font-weight: bold;line-height: 120%;color: #fff;padding: 10px;vertical-align: middle; } .planlimen { width: auto;height: auto;display: inline-block;background-color: #650093;font-size: 14px;font-weight: bold;line-height: 120%;color: #fff;padding: 10px;vertical-align: middle; } .monthgrid-container { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; grid-gap: 20px; padding: 5px; } .monthgridcol { width: 100%;display: inline-block;margin: 0px;vertical-align: top;float: left;scroll-snap-align: center;border: 2px solid #dbdbdb;position: relative; } .monthgridtable {border-collapse: collapse;padding: 0px;text-align: center;font-size: 20px;line-height: 140%;font-weight: bold;background-color: rgba(255, 255, 255, 0.5);/*text-shadow: 0px 0px 5px #ffffff;*/ } .monthgridtxt { font-size: 20px;font-weight: bold;line-height: 120%;position: absolute;left: 0px;bottom: 0px; } .monthgrid-containercol1 { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; grid-gap: 0px; padding: 5px; margin-top: 30px; width: 50%; } .monthgridcol1 { width: 60%;display: inline-block;margin: 0px;vertical-align: top;scroll-snap-align: center;border: 2px solid #dbdbdb;position: relative; } .monthgrid-containercol2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; grid-gap: 12px; padding: 5px; margin-top: 30px; } .monthgrid-containercol3 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto; grid-gap: 12px; padding: 5px; margin-top: 30px; } /************************************************************************************ 5G live *************************************************************************************/ .about5gsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 60px 0px;/*background-image: url(../images/bg-sectioncolor.jpg);background-size: 100% 100%*/ } .p1table { border-collapse: collapse;border: 2px solid #ffffff;padding: 5px 30px;text-align: left;font-size: 16px;margin-top: 10px;margin-bottom: 35px;background-color: rgba(255, 255, 255, 0.5);color: #000000; } .moheader { font-size: 42px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 20px 0px;width: 100%; } .moheaderen { font-size: 42px; color:#000; font-weight: bold; line-height: 100%;padding: 0px 0px 20px 0px;width: 100%; } .moheaderdesp { font-size: 18px; color:#000; font-weight: normal; line-height: 140%;padding: 0px 0px 20px 0px;width: 83%;text-align: left; } .videonext { right: 5%; } .videoback { left: 5%; } .videonextvas { display: none; } .videobackvas { display: none; } .videonextphone { right: 0%; } .videobackphone { left: 0%; } .drumtxt { font-size: 18px; color:#000; font-weight: normal; line-height: 140%;padding: 20px 0px 20px 0px;width: 60%;text-align: left; } .logo5glive { vertical-align: -5px; } .popuprouterframeL { width: auto;height: auto;position: absolute;bottom: 0px;left: -40px; } .popuprouterframeR { width: auto;height: auto;position: absolute;bottom: 0px;right: -40px; } .popuprouterimg { width: 180px;height: 180px; } .daysicon2 { width: auto;height: auto;position: absolute;top: 0%;right: -36%; } .daysicon2en { width: auto;height: auto;position: absolute;top: 0%;right: -34%; } .daysicon2enmob { display: none; } .daysicon { width: auto;height: auto;position: absolute;top: 0%;right: -36%; } .daysiconen { width: auto;height: auto;position: absolute;top: 0%;right: -24%; } .daysiconenmob { display: none; } .daysiconimg { width: 54px;height: auto;display: inline-block; } .pticon { width: auto;height: auto;position: absolute;top: -55%;right: 0%; } .pticonen { width: auto;height: auto;position: absolute;top: -41%;right: 2%; } .pticonimg { width: 78px;height: auto;display: inline-block; } .pticonimgen { width: 78px;height: auto;display: inline-block; } .pticon2 { width: auto;height: auto;position: absolute;top: -80%;right: -10%; } .pticon2en { width: auto;height: auto;position: absolute;top: -42%;right: 5%; } .pttopspace { margin-top: 50px; } .pticon2a { width: auto;height: auto;position: absolute;top: -80%;right: -10%; } .pticon2aen { width: auto;height: auto;position: absolute;top: -18%;right: -35%; } .pticon2b { width: auto;height: auto;position: absolute;top: -78%;right: -8%; } .pticon2ben { width: auto;height: auto;position: absolute;top: -60%;right: -8%; } .pticon2c { width: auto;height: auto;position: absolute;top: -78%;right: -8%; } .pticon2cen { width: auto;height: auto;position: absolute;top: -51%;right: -4%; } .pticon2bwifi { width: auto;height: auto;position: absolute;top: 56%;right: -20%; } .pticon2bwifien { width: auto;height: auto;position: absolute;top: 65%;right: -3%; } .pticonwifiimg { width: 60px;height: auto;display: inline-block; } .pticon2d { width: auto;height: auto;position: absolute;top: -80%;right: -40%; } .pticon2den { width: auto;height: auto;position: absolute;top: -60%;right: -8%; } .tabletab { width: 100%;display: inline-block;font-size: 18px; text-align: center;font-weight: bold;CURSOR: pointer; } .tabletabimg { vertical-align: -2px; } .hsothersframe { width: 49.5%;display: inline-block;float: left; } .framehsothersmain1 { width: 90%;display: inline-block;border-bottom: #dbdbdb 2px solid;padding: 20px 0px; } .framehsothersmain2 { width: 90%;display: inline-block; } .hsothersrow { width: 100%;height:auto;display: inline-block;vertical-align: top;margin: 0px;color: #000000;font-size: 14px;font-weight: normal; } .hsothersrow1 { width: 32.5%;height:auto;display: inline-block;vertical-align: top;margin: 0px;padding: 20px 0px;line-height: 120%;text-align: center;color: #000000;font-size: 14px;font-weight: normal; } .hsothersspace { width: 1%;display: inline-block;margin: 0px;vertical-align: top;float: left; } /************************************************************************************ 5Gnew *************************************************************************************/ .top5gapplybut { float: right;width: auto;height: auto;display:inline-block;padding: 10px 30px;margin-left: 20px;margin-right: 20px; background-image: url('../images/bg-sectioncolor.jpg');background-size: 100% 100%;font-size: 18px;font-weight: bold;color: #fff;cursor: pointer; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .top5gapplybut:hover { background-size: 180% 100%; } .applybut { width: 340px;height: auto;display:inline-block;padding: 15px 0px;margin: 0px 10px; background-image: url('../images/bg-sectioncolor.jpg');background-size: 100% 100%;font-size: 24px;font-weight: bold;color: #fff;line-height: 100%; cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .applybut:hover { background-size: 180% 100%; } .title5glogo { width: auto;height: 60px;vertical-align: -12px; } .eraimgframe01 { width: 83%;height: 550px;display: inline-block;background-size: cover;text-align: center;color: #fff;border-radius: 10px;background-image: url('../images/bg01.jpg');background-position: center;box-shadow: 0px 0px 5px #000; } .eraimgframe02 { width: 83%;height: 550px;display: inline-block;background-size: cover;text-align: center;color: #fff;border-radius: 10px;background-image: url('../images/photo-part02b.jpg');background-position: center;box-shadow: 0px 0px 5px #000; } .eraimgframe03 { width: 83%;height: 550px;display: inline-block;background-size: cover;text-align: center;color: #fff;border-radius: 10px;background-image: url('../images/bg01.jpg');background-position: center;box-shadow: 0px 0px 5px #000; } .eraimgframe03en { width: 83%;height: 550px;display: inline-block;background-size: auto 100%;text-align: center;color: #fff;border-radius: 280px;background-color: #000000;background-image: url('../images/photo-part02-en.png');background-position: center;box-shadow: 0px 0px 5px #000;background-repeat: no-repeat; } .eraimgframespace { width: 1px;height: 550px;display: inline-block;vertical-align: middle; } .eraimgframecontent { width: 96%;height: auto;display: inline-block;vertical-align: middle; } .eracontenttitle { font-size: 56px;font-weight: bold;line-height: 140%;text-shadow: 0px 0px 10px #000000;font-style: italic; } .eracontenttxt { font-size: 26px;font-weight: bold;line-height: 140%;text-shadow: 0px 0px 10px #000000; } .eradesicon { width: 130px;height: 130px;display: inline-block; } .ntmainphotopcbg { width: 100%;height: auto;background-color: rgba(0, 0, 0, 0.1); } .ntmainphotocontainerpc { width: 90%;height: auto;display: inline-block;line-height: 100%;padding: 25px 0px; } .ntmainphotoframe { width: 30%;height: 480px;display: inline-block;margin: 0px 10px;padding: 10px;box-shadow: 0px 0px 5px #cacaca;position: relative;vertical-align: top;border-radius: 20px;text-align: left;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } /*.ntmainphotoframe:hover { -ms-transform: scale(1.08); -moz-transform: scale(1.06); -webkit-transform: scale(1.06); -o-transform: scale(1.06); transform: scale(1.06); }*/ .ntmainphotoframep1 { /*background-image: url(../images/photo-part02a-mob.jpg);background-size: cover;*/ background-color: #ededed; } .ntmainphotoframep2 { /*background-image: url(../images/photo-part02a-mob.jpg);background-size: cover;*/ background-color: #ededed; } .ntmainphotoframep3 { /*background-image: url(../images/photo-part02a-mob.jpg);background-size: cover;*/ background-color: #ededed; } .ntmainphototxt { width: 100%;height: auto;margin-top: 110px;font-size: 28px; color: #fff;font-weight: bold;text-shadow: 0px 0px 5px #000;} .ntmainphototxten { width: 100%;height: auto;margin-top: 110px;font-size: 22px;line-height: 120%; color: #fff;font-weight: bold;text-shadow: 0px 0px 5px #000;} .ntmainphotobut { width: 100%;height: 238px;display:inline-block;position: absolute;top: 0;left: 0;background-image: url(../images/mainphotover.png);background-size: cover;cursor: pointer;opacity: 0;border-radius: 20px; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .ntmainphotobut:hover { opacity: 1; } .ntmainphotobutxt { color: #fff;font-size: 18px;line-height: 160%;text-align: left;padding: 20px 10px 0px 10px;text-shadow: 0px 0px 5px #000; } .ntmainphotobutxten { color: #fff;font-size: 16px;line-height: 120%;text-align: left;padding: 20px 10px 0px 10px;text-shadow: 0px 0px 5px #000; } .ntboxtitle { font-size: 36px;font-weight: bold;line-height: 120%;color: #000; width: 100%;height: auto;text-align: center;margin: 20px 0px 10px 0px; } .ntboxtitleen { font-size: 34px;font-weight: bold;line-height: 100%;color: #000; width: 100%;height: auto;text-align: center;margin: 20px 0px 10px 0px; } .ntboxul { padding-left: 40px%;text-shadow: 0px 0px 5px #000; } .ntboxli { font-size: 24px;line-height: 120%;color: #fff;padding-bottom: 20px;text-shadow: 0px 0px 10px #000; } .ntdestxt { width: 100%;height: auto;font-size: 22px;font-weight: normal;line-height: 120%;color: #fff;text-align: center; margin: 10px 0px;padding: 15px 0px;background-color: rgba(197, 34, 152, 0.8);border-radius: 50px;text-shadow: 0px 0px 5px #6f0050;display: inline-block; } .ntdestxten { width: 100%;height: auto;font-size: 18px;font-weight: normal;line-height: 120%;color: #fff;text-align: center; margin: 6px 0px;padding: 10px 10px;background-color: rgba(197, 34, 152, 0.8);border-radius: 50px;text-shadow: 0px 0px 5px #6f0050;display: inline-block; } .about5gsection2 { background-color: #ffffff;width: 100%;height: auto;display: inline-block;padding: 60px 0px; } .videocontainerframe { padding: 10px 0px 60px 0px; } .videotxtframe { width: 83%;height: auto;display: inline-block;text-align: left;margin-top: 10px;color: #fff; } .videotxttitkle { font-size: 28px;font-weight: bold;line-height: 120%;color: #000; } .videotxttitkleen { font-size: 24px;font-weight: bold;line-height: 120%;color: #000; } .videotxtcontent { font-size: 18px;line-height: 120%; } .videoiframe { border:none;width: 100%;height: 660px; } .videosliderheight { height: 650px; } .videoiframeen { border:none;width: 100%;height: 700px; } .videosliderheighten { height: 690px; } .plan5gsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 60px 0px; /*background-image: url(../images/bg-sectioncolor04.jpg);background-size: cover;background-repeat: no-repeat;*/ } .liveupimg { width: auto;height: 45px;vertical-align: -10px; } .p3mainphotoframebb { background-color: #fff; width: 88%;height: 610px;display: inline-block;margin: 0px 8px;padding: 10px;box-shadow: 0px 0px 5px #dbdbdb;position: relative;vertical-align: top;border-radius: 20px;text-align: center;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .p3mainphotoframebben { background-color: #fff; width: 88%;height: 610px;display: inline-block;margin: 0px 8px;padding: 10px;box-shadow: 0px 0px 5px #dbdbdb;position: relative;vertical-align: top;border-radius: 20px;text-align: center;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .p3mainphotoframepbb { background-image: url(../images/pic04-tc.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotoframepbben { background-image: url(../images/pic04-en.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotopcbg { width: 100%;height: auto;background-color: rgba(0, 0, 0, 0); } .p3mainphotocontainerpc { width: 90%;height: auto;display: inline-block;line-height: 100%;padding: 25px 0px; } .p3mainphotoframe { background-color: #fff; width: 45%;height: 700px;display: inline-block;margin: 0px 8px;padding: 10px;box-shadow: 0px 0px 5px #dbdbdb;position: relative;vertical-align: top;border-radius: 20px;text-align: center;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .p3mainphotoframeen { background-color: #fff; width: 45%;height: 710px;display: inline-block;margin: 0px 8px;padding: 10px;box-shadow: 0px 0px 5px #dbdbdb;position: relative;vertical-align: top;border-radius: 20px;text-align: center;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } /*.p3mainphotoframe:hover { -ms-transform: scale(1.08); -moz-transform: scale(1.06); -webkit-transform: scale(1.06); -o-transform: scale(1.06); transform: scale(1.06); }*/ .p3mainphotoframep1 { background-image: url(../images/pic01.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotoframep2 { background-image: url(../images/pic02.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotoframep3tc { background-image: url(../images/pic03-tc.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotoframep3en { background-image: url(../images/pic03-en.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphotoframep4 { background-image: url(../images/5glive-p04.jpg);background-size: 100% auto;background-position: bottom;background-repeat: no-repeat; } .p3mainphototxt { width: 100%;height: auto;margin-top: 110px;font-size: 28px; color: #fff;font-weight: bold;text-shadow: 0px 0px 5px #000;} .p3mainphototxten { width: 100%;height: auto;margin-top: 110px;font-size: 22px;line-height: 120%; color: #fff;font-weight: bold;text-shadow: 0px 0px 5px #000;} .p3mainphotobut { width: 100%;height: 238px;display:inline-block;position: absolute;top: 0;left: 0;background-image: url(../images/mainphotover.png);background-size: cover;cursor: pointer;opacity: 0;border-radius: 20px; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .p3mainphotobut:hover { opacity: 1; } .p3mainphotobutxt { color: #fff;font-size: 18px;line-height: 160%;text-align: left;padding: 20px 10px 0px 10px;text-shadow: 0px 0px 5px #000; } .p3mainphotobutxten { color: #fff;font-size: 16px;line-height: 120%;text-align: left;padding: 20px 10px 0px 10px;text-shadow: 0px 0px 5px #000; } .p3newscontainerframe { width: 85%;height: auto;display: inline-block;margin: 10px 0px 60px 0px; } .p3newsframe { width: 28%;height: auto;display: inline-block;vertical-align: top;padding: 0px 10px;text-align: left; } .p3newsphoto { width: 100%;height: auto;display: inline-block;line-height: 0%;background-position: center center; } .p3newscontent { width: 100%;height: auto;display: inline-block;font-size: 16px; line-height: 140%;margin-top: 0px; } .p3newscontenten { width: 100%;height: auto;display: inline-block;font-size: 16px; line-height: 140%;margin-top: 0px; } .p3newscontentbold { font-size: 20px;font-weight: bold;width: 100%;margin: 10px 0px 5px 0px; } .p3newssubtitle { width: auto;height: auto;font-size: 1.6rem;line-height: 100%;background-image: url(../images/mainphotover.png);background-size: cover;padding: 10px 60px 10px 10px; position: absolute;left: -10px;top: 0px;font-weight: bold;color: #fff; z-index:100;} .p3content { width: 75%;height: auto;display: inline-block;color: #000000;font-size: 1rem; font-weight: 500;line-height: 160%; text-align: left;margin-bottom: 10px; } .p3contenten { width: 75%;height: auto;display: inline-block;color: #000000;font-size: 1rem; font-weight: 500;line-height: 160%; text-align: left;margin-bottom: 10px; } .liveiconframe { width: 100%;height: auto;display: inline-block;text-align: center;margin: 10px 0px 5px 0px; } .liveiconimg { width: auto;height: 80px; } .liveboxtitle { font-size: 44px;font-weight: bold;line-height: 120%;color: #000; width: 100%;height: auto;text-align: center;margin: 20px 0px 20px 0px; } .liveboxtitleen { font-size: 38px;font-weight: bold;line-height: 100%;color: #000; width: 100%;height: auto;text-align: center;margin: 20px 0px 20px 0px; } .liveboxul { padding-left: 40px;margin: 0px; } .liveboxli { font-size: 20px;line-height: 120%;color: #000;padding-bottom: 15px; } .liveboxlien { font-size: 19px;line-height: 120%;color: #000;padding-bottom: 15px; } .liveiframe { display: none; } .liveboxcontent { font-size: 20px;font-weight: normal;line-height: 140%;color: #000; width: 80%;height: auto;text-align: left;display: inline-block; } .liveboxcontenten { font-size: 18px;font-weight: normal;line-height: 140%;color: #000; width: 80%;height: auto;text-align: left;display: inline-block; } .liveplanframe { width: 80%;height: auto;display: inline-block; } .tableoff5g {border-collapse: collapse;border: 2px solid #dbdbdb;padding: 0px;text-align: center;font-size: 20px;line-height: 140%;font-weight: bold;background-color: rgba(255, 255, 255, 0.5);text-shadow: 0px 0px 5px #ffffff; } .hs5gtxttitlebg { background-color:#7a53e2; } .hs5grow1 {width: 100%;height: auto;display: inline-block;vertical-align: top;margin: 0px;padding: 15px 0px 15px 0px;color: #fff;position: relative; } .hsrow1databold {font-size: 38px;line-height: 100%;font-weight: bold;color: #fff;text-shadow: 0px 0px 5px #fff; } .hsrow1databolden {font-size: 38px;line-height: 100%;font-weight: bold;color: #fff;text-shadow: 0px 0px 5px #fff; } .framehsmain2 {width: 90%;display: inline-block;border-bottom: #9c9c9c 2px solid;padding: 20px 0px;} .hsrow2 { width: 90%;height: auto;display: inline-block;padding: 40px 0px; border-bottom: #dbdbdb 1px solid; } .hsrow2pricebold1 {font-size: 32px;line-height: 100%;font-weight: bold;color: #7a53e2;} .hsrow2pricebold1en {font-size: 30px;line-height: 100%;font-weight: bold;color: #7a53e2;} .hsrow2pricebold2 {font-size: 34px;line-height: 100%;font-weight: bold;color: #fff;} .hsrow2pricebold2en {font-size: 34px;line-height: 100%;font-weight: bold;color: #fff;} .hsrow2pricebold3 {font-size: 28px;line-height: 100%;font-weight: bold;color: #000000;} .hsrow2greytxt {font-size: inherit;line-height: inherit;color: #810581; } .liveplantxttopup { width: 100%;height: auto; padding: 0px 0px 20px 0px;display: inline-block;font-weight: normal;font-size: 22px;color: #000;line-height: 120% } .hsrow3txtframe { padding-bottom: 15px; } .hsrow3txtleft { padding: 0px 0px 5px 0px;color: #000; } .hsrow3txtrightbold { font-size: inherit;line-height: inherit;color: #000; } .liveplannetpluslivelogo { width: auto;height: 50px;vertical-align: -13px; } .liveupplanframe { width: 100%;height: auto;display: inline-block;border: 2px solid #f3dd88;background-color: rgba(255, 255, 255, 0.5); } .liveupplanframeL { width: 60%;height: auto;float: left;font-size: 20px;font-weight: bold;border-right: 2px solid #dbdbdb; } .liveuppriceframe01 { width: auto;height: auto;display: inline-block;vertical-align: middle;font-size: 16px;position: relative; } .liveuppriceframe02 { width: auto;height: auto;display: inline-block;vertical-align: middle;font-size: 20px;background-color: rgba(0, 0, 0, 0.3);padding: 6px 20px;border-radius: 5px; } .liveuppriceframe02en { width: auto;height: auto;display: inline-block;vertical-align: middle;font-size: 20px;background-color: rgba(0, 0, 0, 0.3);padding: 6px 20px;border-radius: 5px; } .liveuppriceframeplus { width: auto;auto;display: inline-block;vertical-align: middle;font-size: 50px;font-weight: bold;margin: 0px 10px; } .livetimeframe { width: auto;height: auto;display: inline-block;margin: 25px 3px 0px 3px;vertical-align: top;position: relative; } .liveupplanframespace { width: 2px;height: 450px;float: left;margin: 0px 0px;background-color: #dbdbdb; } .liveupplanframeR { width: 40%;height: auto;float: left;font-size: 20px;font-weight: bold; } .liveupplanframeRspace { width: 100%;height: 105px;display: inline-block; } .liveaddonframe { width: 85%;height: auto;display: inline-block;padding: 20px 0px 20px 0px;text-align: center;font-weight: normal; } .liveupul { padding-left: 30px;margin: 0px; } .liveupli { font-size: 18px;line-height: 120%;padding-bottom: 10px; } .liveupremark { font-size: 14px;font-weight: bold;width: 100%;display: inline-block; } .liveupinfo { font-size: 18px;font-weight: bold;line-height: 120%; width: 100%;display: inline-block; } .liveupremark2 { background-image: url("../images/planbg.jpg");background-size: cover;background-position: center; width: 100%;height: auto;display: inline-block;font-size: 20px;font-weight: bold;text-align: center;line-height: 160%;background-color: #f3e4f1;padding: 20px 10px;border-radius: 20px;margin-bottom: 20px; } .liveupremarktxt { width: auto;height: auto;display: inline-block;text-align: left;font-size: 24px;line-height: 120%;text-shadow: -10px 0px 8px #fff; } .liveupremarktxten { width: 78%;height: auto;display: inline-block;text-align: left;font-size: 20px;line-height: 120%;text-shadow: -10px 0px 8px #fff; } .liveupplancoltxt { font-size: 16px;font-weight: bold;line-height: 120%;width: 100%;height: auto;display: inline-block; } .liveupplancoltxtbold { font-size: 22px;font-weight: bold;line-height: 120%;width: 100%;height: auto;display: inline-block; } .liveplandetailbut { font-size: 14px;color: #fff; line-height: 100%;display: inline-block;background-color: #FF00A6;border-radius: 5px;padding: 4px 10px;vertical-align: 2px; cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .liveplandetailbut:hover { background-color:#75009B; } .step5gsection { background-color: #ededed;width: 100%;height: auto;display: inline-block;padding: 60px 0px; /*background-image: url(../images/bg-sectioncolor04.jpg);background-size: cover;background-repeat: no-repeat;*/ } .step5gframe { width: 83%;height: auto;display: inline-block; } .step5gstepframe { width: 25%;height: auto;display: inline-block;vertical-align: top;text-align: center; } .step5gimg { width: 200px;height: auto;padding-bottom: 20px; } .step5gtitle { font-size: 30px;font-weight: bold;line-height: 120%; display: inline-block;width: 100%;height: auto;margin-bottom: 5px; } .step5gcontent { font-size: 20px;font-weight: normal;display: inline-block;width: 100%; } .step5gstepnextframe { width: 3%;height: auto;display: inline-block;vertical-align: top;margin-top: 80px; } .step5gstepnextimg { width: 50px;height: auto; } .step5gcontainerpc { width: auto;height: auto;display: inline-block; } .stepiframe { display: none; } .step5gtxtframe { width: auto; display: inline-block;text-align: center; } .whyiframe { display: none; } .why5gsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 40px 0px 40px 0px; } .swiper-containerV { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .swiper-containerX { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .swiper-container3 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .specframe { width: 100%;height: auto;display: inline-block; } .specpdtframebb { width: 18%;height: auto;display: inline-block;background-color: #fff;vertical-align: top;margin: 0px 10px; } .specpdtframe { width: 22%;height: auto;display: inline-block;float: none;background-color: #fff;margin-bottom: 40px;vertical-align: bottom; } .specpdtframewifi { width: 34%;height: auto;display: inline-block;float: none;background-color: #fff;vertical-align: top;padding: 20px 0px 20px 0px;margin: 0px 10px; } .specpdtframe02 { display: none;background-color: #fff; } .specpdtframe03 { width: 50%;height: 500px;display: inline-block;float: left;background-color: #fff; } .specpdtimg { width: 76%; } .spectxtframe { width: 50%;height: 500px;display: inline-block;background-color: #ededed;float: left;text-align: left; } .specpdtimgwifi { width: 60%; } .specpdtimgwifi2 { width: 60%; } .specspace { width: 1px;height: 500px;display: inline-block;vertical-align: middle; } .speccontent { width: 99%;height: auto;display: inline-block;vertical-align: middle;padding: 40px; } .speccontenttitlebb { font-size: 20px;line-height: 120%;font-weight: bold;padding-bottom: 10px; } .speccontenttitle { font-size: 18px;line-height: 120%;font-weight: bold;padding-bottom: 10px;text-decoration: underline; } .speccontenttxt1 { font-size: 18px;color: #8f0ea5;line-height: 120%;font-weight: bold;width: 100%;height: auto; display: inline-block; } .speccontenttxt2 { font-size: 16px;color: #8f0ea5;line-height: 120%;font-weight: normal;width: 100%;height: auto; display: inline-block; } .specul { padding-left: 30px; } .specli { font-size: 18px;line-height: 120%;padding-bottom: 10px; } .specorgprice { text-decoration: line-through;line-height: 120%; } .specoffertxt { width: 100%;height: auto;display: inline-block;font-size: 16px;font-weight: bold;line-height: 120%;color: #810581; } .onair5gsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 0px 0px 50px 0px;/*background-image: url(../images/bg-sectioncolor02.jpg);background-size: 100% 100%;*/ } .onairdesp { font-size: 18px; color:#000; font-weight: normal; line-height: 140%;padding: 0px 0px 20px 0px;width: 83%;text-align: left; } .shopimg { width: 32%;height: auto;display: inline-block; margin: 0px 5px; } .faq5gsection { background-color: #fff;width: 100%;height: auto;display: inline-block;padding: 60px 0px;/*background-image: url(../images/bg-compare.jpg);background-size: cover;background-repeat: no-repeat;background-position: top center; */} .faqElements {width: 83%;height: auto;display: inline-block;text-align: left;font-size: 26px;font-weight: bold;line-height: 120%;margin: 15px 0px;padding: 15px 35px; background-color: rgba(0, 0, 0, 0.3);border-radius: 50px;text-shadow: 0px 0px 5px #000; } .faqquestionLink { color: #fff;text-decoration: none; } .faqanswer { color: #fff;margin-top: 20px;border-left: 5px solid #dbdbdb;padding: 0px 10px;font-size: 20px;line-height: 120%; } i { border: solid #fff; border-width: 0 3px 3px 0; display: inline-block; padding: 8px; float: right; -webkit-transition-duration: 1s; /* Safari */ transition-duration: 1s; } .up { transform: rotate(-135deg);-webkit-transform: rotate(-135deg); } .down { transform: rotate(45deg);-webkit-transform: rotate(45deg); } .p7planofferframe { width: 83%;height: auto;display: inline-block;border: #f7db87 2px solid;padding: 10px;text-align: left; } .p7planoffercol1 { width: 30%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;font-size: 34px;font-weight: bold;text-align: center; } .p7planoffercol1en { width: 24%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;font-size: 30px;font-weight: bold;text-align: center; } .p7planoffercol2 { width: 30%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;text-align: center; } .p7planoffercol2en { width: 40%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;text-align: center; } .p7planoffercol2txt1 { font-size: 30px;font-weight: bold;line-height: 120%; color: #f7db87;display: inline-block;width: 100%; } .p7planoffercol2txt1en { font-size: 30px;font-weight: bold;line-height: 120%; color: #f7db87;display: inline-block;width: 100%; } .p7planoffercol2txt2space { padding: 26px 0px; } .p7planoffercol2txt2spaceen { padding: 26px 0px; } .p7planoffercol2txt2 { font-size: 65px;font-weight: bold;line-height: 120%; color: #fff;display: inline-block; } .p7planoffercol2txt3 { font-size: 35px;font-weight: bold;line-height: 120%; color: #fff;display: inline-block; } .p7planoffercol2txt4 { font-size: 22px;line-height: 120%; color: #fff;display: inline-block;width: 100%; } .p7planoffercol2txt4en { font-size: 22px;line-height: 120%; color: #fff;display: inline-block;width: 100%; } .p7planoffercol2icon { width: auto;height: 110px;padding: 10px 0px; } .p7planoffercol3 { width: 24%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;text-align: center; } .p7planoffercol3en { width: 28%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff;text-align: center; } .p7planoffercol4 { width: 20%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff; } .p7planoffercolx { width: 6%;height: auto;display: inline-block;vertical-align: middle;line-height: 100%;color: #fff; } .p7hsoffertitle { font-size: 34px;font-weight: bold;line-height: 120%; color: #fff;display: inline-block;width: 83%;text-align: left;padding: 20px 0px 0px 0px; } .p7hsoffertitleen { font-size: 30px;font-weight: bold;line-height: 120%; color: #fff;display: inline-block;width: 83%;text-align: left;padding: 20px 0px 0px 0px; } .swiper-container5 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .p7newscontainerframe { width: 83%;height: auto;display: inline-block;margin: 10px 0px 0px 0px; } .p7sliderframe { padding: 0px 0px; } .vas5gframe { transform: skewX(-5deg);background-color: #000;position: relative;width: 355px;height: 330px; overflow: hidden;line-height: 100%;border: 2px solid #f3dd88;display: inline-block;margin: 0px 20px;vertical-align: top; cursor: pointer; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .vas5gframe:hover { transform: skewX(-5deg) scale(0.95); } .vas5gframeen { transform: skewX(-5deg);background-color: #000;position: relative;width: 355px;height: 380px; overflow: hidden;line-height: 100%;border: 2px solid #f3dd88;display: inline-block;margin: 0px 20px;vertical-align: top; cursor: pointer; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .vas5gframeen:hover { transform: skewX(-5deg) scale(0.95); } .vas5gimage { transform: skewX(5deg);position: absolute;top:0px;left: -10px; width: 370px; } .vas5gtxtframe { transform: skewX(5deg);position: absolute;top:160px;left: 0px;color: #fff;font-size: 18px;font-weight: bold;line-height: 160%;text-align: left;padding: 0px 10px;width: 96%; } .vas5gdataframe { position: absolute;top:140px;right: -8px;color: #fff;font-size: 18px;font-weight: bold;line-height: 120%;text-align: left;padding: 6px 20px 6px 15px;width: auto;background-color: #d3b349;text-shadow: 0px 0px 5px #000; } .vas5gdataframeen { position: absolute;top:140px;right: -8px;color: #fff;font-size: 14px;font-weight: bold;line-height: 120%;text-align: left;padding: 6px 20px 6px 15px;width: auto;background-color: #d3b349;text-shadow: 0px 0px 5px #000; } .vas5gboldtxt { font-size: 32px;font-weight: bold;margin: 10px 0px;display: inline-block;color: #ed0677; } .vas5g4kicon { width: auto;height: 36px;vertical-align: -8px; } .vas5gdataicon { width: auto;height: 26px;vertical-align: -8px; } .vas5gworldofvicon { width: 260px;height: auto;display: inline-block;float: right; } .vasdetailbut { transform: skewX(5deg);font-size: 14px;font-weight: bold;color: #fff; background: url(../images/bg_button.jpg) no-repeat; background-size: 500%; background-position: 0% 95%; margin: 0px 0px 0px 0px; padding: 0px 15px 0px 10px; cursor: pointer; display: inline-block; text-align: center;padding: 10px; position: absolute;bottom:0px;right: -3px; } .vasdetailbut:hover { transform: skewX(5deg);background: url(../images/bg_button.jpg) no-repeat; background-size: 200%; } .vasdetailarrow { width: 15px;height: 15px;vertical-align: -3px; } .phone5gsection { background-color: #ededed;width: 100%;height: auto;display: inline-block;padding: 60px 0px 60px 0px;/*background-image: url(../images/bg-sectioncolor.jpg);background-size: 100% 100%;background-repeat: no-repeat;*/ } .swiper-container7 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .p9sliderframe { width: 83%;height: auto;display: inline-block;margin: 10px 0px 0px 0px; } .phone5gframe { transform: scale(0.95); position: relative;width: 30%;height: auto; line-height: 100%;text-align: left;display: inline-block;margin: 0px 25px;vertical-align: top; transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s; } .phone5gframe:hover { transform: scale(1); } .phonedetailbut { font-size: 14px;font-weight: bold;color: #fff; background-color: #000; margin: 0px 0px 0px 0px; padding: 0px 15px 0px 15px; cursor: pointer; display: inline-block; text-align: center;padding: 10px;margin-top: 10px; } .phone5gpdtname { width: 100%;height: auto; display: inline-block;text-align: left;border-left: 2px solid #2A2A2A;padding-left: 8px; } .phone5gpdtimg { width: 100%;height: auto;display: inline-block; } .livexptitle { font-size: 30px;font-weight: bold;line-height: 120%; display: inline-block;padding: 12px 0px;color: #000; } .livexptxt { font-size: 20px;font-weight: normal;line-height: 120%;color: #000; } .comparecontainerframe { width: 80%;height: auto;display: inline-block; } .compframe01 { font-size: 20px;color: #fff;line-height: 140%; width: 35%;height: auto;display: inline-block;padding: 20px;margin: 0px 20px;background-color:#BD0081;border-radius: 5px;background-size: 100% 100%;vertical-align: top;box-shadow: 0px 0px 10px #515151; } .compframe02 { font-size: 20px;color: #313131;line-height: 140%; width: 35%;height: auto;display: inline-block;padding: 20px;margin: 0px 20px;background-color:#E9E9E9;border-radius: 5px;background-size: 100% 100%;vertical-align: top;box-shadow: 0px 0px 10px #dbdbdb; } .compplantitle { font-size: 24px; font-weight: bold; padding: 10px 0px 10px 0px;display: inline-block;width: 100%;height: auto; } .comptitleicon { width: 140px;vertical-align: -10px; } .comptdframe { padding: 10px 0px 10px 0px;display: inline-block;width: 80%;border-bottom: 1px solid #fff;margin-bottom: 0px; } .comptdexpframe { padding: 0px 0px 20px 0px;display: inline-block;width: 80%;border-bottom: 1px solid #fff;margin-bottom: 10px;height: auto; } .comptdexpframe02 { padding: 0px 0px 20px 0px;display: inline-block;width: 80%;border-bottom: 1px solid #fff;margin-bottom: 10px;height: auto; } .comptdexpframe03 { padding: 0px 0px 20px 0px;display: inline-block;width: 80%;border-bottom: 1px solid #fff;margin-bottom: 10px;height: auto; } .comptdtitle01 { width: 100%;font-size: 18px;line-height: 100%; } .comptdcontent01 { font-size: 22px;font-weight: bold;width: 100%;margin: 10px 0px;display: inline-block; } .comptdcontent01rmk { font-size: 24px;font-weight: bold;color: #ffe686; } .comptdtitle02 { width: 100%;font-size: 18px;line-height: 100%; } .comptdcontent02 { font-size: 22px;font-weight: bold;width: 100%;margin: 5px 0px;display: inline-block; } .comptdcontent02rmk { font-size: 24px;font-weight: bold;color: #745280; } .compplanexptitle01 { font-size: 24px; padding: 10px 0px 10px 0px;display: inline-block;width: 100%;background-color: rgba(0, 0, 0, 0.3);margin-bottom: 20px; } .compplanexptitle02 { font-size: 24px; padding: 10px 0px 10px 0px;display: inline-block;width: 100%;background-color: rgba(0, 0, 0, 0.15);margin-bottom: 20px; } .comptdbold01 { font-size: 100% } .comptdbold02 { font-size: 100% } .for24mth { display: inline-block; } .comptdboxtitle { font-size: 22px;width: 100%;padding: 10px 0px;border-bottom: 1px solid #fff;font-weight: bold; } .comptdboxremark { font-size: 14px;line-height: 100%; } .compboxbg01 {width: 100%;height: auto;display: inline-block;background-color: rgba(0, 0, 0, 0.2);border-radius: 22px;margin: 10px 0px; } .compboxbg02 {width: 100%;height: auto;display: inline-block;background-color: rgba(0, 0, 0, 0.1);border-radius: 22px;margin: 10px 0px; } .compfixprcbox01 { font-weight: bold; width: 100%;height: auto;display: inline-block;background-color: rgba(231, 178, 255, 0.25);margin: 10px 0px 5px 0px;padding: 10px 0px;border-radius: 50px;position: relative; } .compfixprcbox02 { font-weight: bold; width: 100%;height: auto;display: inline-block;background-color: rgba(0, 0, 0, 0.1);margin: 10px 0px 5px 0px;padding: 10px 0px;border-radius: 50px; } .compplus { width: 100%;height: 20px;display: inline-block;font-size: 30px;font-weight: bold;line-height: 100%; } .comptick { width: 50px;height: 50px;display: inline-block;position: absolute;right: 20%; top: 10%; } .compticken { width: 50px;height: 50px;display: inline-block;position: absolute;right: 8%; top: 10%; } /************************************************************************************ main sliderVIDEO *************************************************************************************/ .msstarvideocontainer { position: relative; width: 100%; height: 0; padding-bottom: 41.7%; } .msstarvideo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /************************************************************************************ VIDEO *************************************************************************************/ .starvideoframe5gonair { width: 83%;height: auto;display: inline-block;border-radius: 10px;background-image: url(../images/bg-sectioncolor02.png);background-size: 100% 100%; } .starvideoframe { width: 83%;height: auto;display: inline-block; } .starvideocontainer { position: relative; width: 65%; height: 0; padding-bottom: 35.25%; } .starvideo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /************************************************************************************ sme *************************************************************************************/ .charticon { width: auto; height: 34px; vertical-align: -10px;padding: 5px 0px; } /************************************************************************************ topnav *************************************************************************************/ .topnavframe { width: 100%;display: inline-block;background: #434448;font-size: 16px;line-height: 100%;font-weight: bold; } .topnavbutoff { color: #fff;padding: 15px 30px;display: inline-block;background: #434448;cursor: pointer; } .topnavbutoff:hover { display: inline-block; background-image: -webkit-gradient(linear,right top,left top,from(#743ad5),to(#d53a9d));background-image: -webkit-linear-gradient(right,#743ad5,#d53a9d);background-image: -o-linear-gradient(right,#743ad5 0,#d53a9d 100%);background-image: linear-gradient(270deg,#743ad5 0,#d53a9d); } .topnavbuton { color: #fff;padding: 15px 30px;display: inline-block;background: #434448;background-image: -webkit-gradient(linear,right top,left top,from(#743ad5),to(#d53a9d));background-image: -webkit-linear-gradient(right,#743ad5,#d53a9d);background-image: -o-linear-gradient(right,#743ad5 0,#d53a9d 100%);background-image: linear-gradient(270deg,#743ad5 0,#d53a9d); } .slider { display: flex;font-size: 14px;line-height: 100%;background: #434448;color: #fff;font-weight: bold; } section { padding: 15px 15px;width: auto; scroll-snap-align: center;text-align: center;position: relative;cursor: pointer; } section:hover { background-image: -webkit-gradient(linear,right top,left top,from(#743ad5),to(#d53a9d));background-image: -webkit-linear-gradient(right,#743ad5,#d53a9d);background-image: -o-linear-gradient(right,#743ad5 0,#d53a9d 100%);background-image: linear-gradient(270deg,#743ad5 0,#d53a9d); } .sectionoff { } .sectionon { display: inline-block;background: #434448;background-image: -webkit-gradient(linear,right top,left top,from(#743ad5),to(#d53a9d));background-image: -webkit-linear-gradient(right,#743ad5,#d53a9d);background-image: -o-linear-gradient(right,#743ad5 0,#d53a9d 100%);background-image: linear-gradient(270deg,#743ad5 0,#d53a9d); } /************************************************************************************ solution new *************************************************************************************/ /*.coltablewidth { width: 88.8%; max-width: 1600px; }*/ .coltablewidth { width: 88.8%; } .mainpagepromocolspace { width: 1%;height: auto; display: inline-block;float: left; } .mainpagepromocol3 { width: 32.15%;height: auto; display: inline-block;border: 1px solid #aaa;float: left;margin-bottom: 20px;margin-left: 0.5%;margin-right: 0.5%;cursor: pointer; } .col3L { float: left; } .col3R { float: right; } .mainpagepromocol3photo { width: 100%;height: 215px; display: inline-block;background-size: cover;background-position: center;position: relative; } .mainpagepromocol3photomob { display: none; } .mainpagepromocol3content { width: 100%;height: auto; display: inline-block;position: relative;text-align: center; } .mainpagepromocol3centerframe { vertical-align: middle;display: inline-block;width: 92%;padding: 15px 0px 18px 0px;height: 130px; } .boxsmallcontentline1 { width: 100%;display: inline-block;text-align: center;font-size: 16px;line-height: 120%;color: #000; } .boxsmallcontentline2 { width: 100%;display: inline-block;text-align: center;font-size: 16px;padding-bottom: 30px; } .boxsmallcontentboldtxt { font-size: 1.7rem;color: #f60;font-weight: 700;padding: 0px 4px 0px 4px; } .boxsmallnopad { padding: 0px } .boxsmallcontentboldnormaltxt { font-size: inherit;color: #f60;font-weight: bold; } .boxsmallcontentlinetxt { font-size: inherit;color: #d0d0d0;font-weight: bold;padding: 0px 5px;display: inline-block;vertical-align: 3px; } .boxTitle { position: absolute;bottom: 0px;left: 0px;width: 100%;background-image: -webkit-gradient(linear,right top,left top,from(#743ad5),to(#d53a9d));background-image: -webkit-linear-gradient(right,#743ad5,#d53a9d);background-image: -o-linear-gradient(right,#743ad5 0,#d53a9d 100%);background-image: linear-gradient(270deg,#743ad5 0,#d53a9d); } .boxTitletxt { line-height: 140%;padding: 5px;font-size: 16px;color: #fff;font-weight: 500;text-align: left; } .frametitle { width: 100%;display: inline-block;padding: 0px 0px 25px 0px; } .mainpagetitle { font-size: 2.875em;line-height: 140%;font-weight: 700;width: auto;display: inline-block;vertical-align: top;width: 100%; text-align: left; } .solutionframe { display: inline-block;padding: 0px 0px 50px 0px; } #tmpheight10px {width:10px; clear:both; height: 10px} .languagebut { width: 40px; vertical-align: -8px; } .w-webflow-badge {display: none} .heading-company { font-weight: 700; font-size: 20px; line-height: 26px } .anametop { position:relative; top:-60px; display: block; } .pageheader { position: relative; padding: 80px 10px 140px 10px; } .gototop { width: 100%; text-align:right } .top { width: 23px; height: 20px; margin: 10px 0px 0px 0px; padding: 0px 0px 0px 0px;} .bgaboutus { background-image: url(../images/headerbg_aboutus.jpg); background-position: center -10px; } .abpart1photoarea { width: 56%; display: inline-block; text-align: right; padding-top: 100px; } .abpart1txtarea { width: 42%; display: inline-block; vertical-align: top; } .abpart1photo { width: 1200px } .bgsme { background-image: url(../images/headerbg_sme.jpg); background-position: center -100px; } .bgsectionsme { background-image: url(../images/sme-offerbg.jpg); background-position: center -30px; } .bgsolution { background-image: url(../images/headerbg_solution.jpg); background-position: center -90px; } .bgworld { background-image: url(../images/headerbg_world.jpg); background-position: center -80px; } .part1txtarea { width: 42%; display: inline-block; vertical-align: top; padding-bottom: 50px; } .part1photoarea { width: 56%; display: inline-block; text-align: right; padding-bottom: 30px; } .part1photosize { width: 80%; } .bgpns { background-image: url(../images/headerbg_pns.jpg); background-position: center 0px; } .meetrm { width: 50%; padding: 20px 0px; } .bgevent { background-image: url(../images/headerbg_event.jpg); background-position: center -80px; } .eventdate { font-size: 16px; } .eventtitle { font-size: 20px; font-weight: bold; } .event-photo { width: 110px; height: 110px; margin-right: 20px; float: left; border-radius: 100%; background-color: #212127; background-image: url("../images/eventphoto.jpg"); background-position: 50% 0px; background-size: auto; background-repeat: no-repeat; } .event-photo._1 { background-image: url("../images/eventphoto01.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._2 { background-image: url("../images/eventphoto02.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._3 { background-image: url("../images/eventphoto03.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._4 { background-image: url("../images/eventphoto04.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._5 { background-image: url("../images/eventphoto05.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._6 { background-image: url("../images/eventphoto06.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._7 { background-image: url("../images/eventphoto07.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._8 { background-image: url("../images/eventphoto08.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._9 { background-image: url("../images/eventphoto09.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._10 { background-image: url("../images/eventphoto10.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._11 { background-image: url("../images/eventphoto11.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._12 { background-image: url("../images/eventphoto12.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._13 { background-image: url("../images/eventphoto13.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._14 { background-image: url("../images/eventphoto14.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._15 { background-image: url("../images/eventphoto15.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._17 { background-image: url("../images/eventphoto17.jpg"); background-position: 50% 0px; background-size: auto; } .event-photo._18 { background-image: url("../images/eventphoto18.jpg"); background-position: 50% 0px; background-size: auto; } /**** moplus ****/ .topmsg { font-size: 20px;font-weight: bold;color: #fff; line-height: 100%;width: 100%;display: inline-block;background-color: #0d2c59;text-align: center;padding: 10px 0px; } .moplandata { font-size: 50px;font-weight: bold;color: #fff;line-height: 100%;margin-top: 25px; } .moplandata2 { font-size: 44px;font-weight: bold;color: #fff;line-height: 100%;margin-top: 60px; } .moplandata2en { font-size: 30px;font-weight: bold;color: #fff;line-height: 100%;margin-top: 45px; } .moplandata3 { font-size: 25px;font-weight: bold;color: #fff;line-height: 100%;margin-top: 35px; } .moplandata3en { font-size: 20px;font-weight: bold;color: #fff;line-height: 100%;margin-top: 50px; } .moplandata4 { font-size: 25px;font-weight: bold;color: #fff;line-height: 100%; } .moplandata4en { font-size: 20px;font-weight: bold;color: #fff;line-height: 100%; } .moplandatabg01 { background-color: #02a79d; width: 100%;height: 220px; display: inline-block;text-align: center;padding: 10px 0px;border-radius: 0px;border-bottom-left-radius: 0;border-bottom-right-radius: 0; } .moplandatabg02 { background-color: #02a79d; width: 100%;height: 220px; display: inline-block;text-align: center;padding: 10px 0px;border-radius: 0px;border-bottom-left-radius: 0;border-bottom-right-radius: 0; } .moplandatabg03 { background-color: #02a79d; width: 100%;height: 220px; display: inline-block;text-align: center;padding: 10px 0px;border-radius: 0px;border-bottom-left-radius: 0;border-bottom-right-radius: 0; } .moplanpriceframe { width: 100%;display: inline-block;position: absolute;bottom: 80px;left: 0px;text-align: center; } .moplanpricetxt1 { font-size: 18px;color: #f15a29;font-weight: bold; display: inline-block; } .moplanpricetxt1en { font-size: 16px;color: #f15a29;font-weight: bold; display: inline-block; } .moplanpricetxt2 { font-size: 50px;color: #f15a29;font-weight: bold; display: inline-block; } .moplanpricetxt2en { font-size: 46px;color: #f15a29;font-weight: bold; display: inline-block; } .moplandatatxt { font-size: 18px;font-weight: bold;color: #fff; width: 100%;display: inline-block;text-align: center;line-height: 100%; } .moplandatatxten { font-size: 14px;font-weight: bold;color: #fff; width: 100%;display: inline-block;text-align: center;line-height: 100%; } .moplansup { vertical-align: 30px; } .moplansocialiconframe1 { width: 100%;height: 32px;display: inline-block;text-align: center;padding-top: 10px; } .moplansocialiconframe2 { width: 100%;height: 32px;display: inline-block;text-align: center;padding-top: 10px; } .moplansocialicon { width: 30px; } .moplandatasup { vertical-align: 30px; line-height: 100%; } .moplandatasupen { vertical-align: 16px; line-height: 100%; } .moplanequbut { width: auto;height: auto;display: inline-block;background-color: #f15a29;border-radius: 20px;border: #000 1px solid;box-shadow: 2px 4px 0px #000;color: #fff;font-weight: bold;text-align: left;padding: 20px;cursor: pointer; } .moplanequbuticon { width: auto;height: 50px;vertical-align: -2px; } .moplanequbuttxt1 { font-size: 30px;line-height: 100%;font-weight: bold;color: #fff;display: inline-block; } .moplanequbuttxt2 { font-size: 20px;line-height: 100%;font-weight: bold;color: #fff;display: inline-block; } .moplansubtitleicon { width: auto;height: 28px;vertical-align: -2px; } .moplanlogo1 { width: auto;height: 30px;vertical-align: -10px;margin-right: 30px; } .moplanlogo2 { width: auto;height: 28px;vertical-align: -11px;margin-right: 30px; } .moplanlogo3 { width: auto;height: 38px;vertical-align: -15px; } .moplantitleunderlinetxt { font-size: inherit; width: auto;height: auto;display: inline-block;border-bottom: #f15a29 12px solid;padding-bottom: 4px; } .mologo { height: 38px; width: auto;padding-left: 20px; } .moremarkdesp { font-size: 18px; color:#000; font-weight: normal; line-height: 140%;padding: 0px 0px 0px 0px; } .momainframe1 { width: 23%;display: inline-block;margin: 0px 5px;vertical-align: top;scroll-snap-align: center; } .momainframe2 { width: 23%;display: inline-block;margin: 0px 5px;vertical-align: top;scroll-snap-align: center; } .momainframe3 { width: 23%;display: inline-block;margin: 0px 5px;vertical-align: top;scroll-snap-align: center; } .momainframe4 { width: 23%;display: inline-block;margin: 0px 5px;vertical-align: top;scroll-snap-align: center; } .moplanframe { width: 100%;height: 460px; display: inline-block;border: #02a79d 2px solid;border-radius: 0px;position: relative;text-align: center; } .moplanframe2 { width: 100%;height: 400px; display: inline-block;border: #02a79d 2px solid;border-radius: 0px;position: relative;text-align: left; } .moplanframeen { width: 100%;height: 510px; display: inline-block;border: #02a79d 2px solid;border-radius: 0px;position: relative;text-align: left; } .moplanframe2en { width: 100%;height: 440px; display: inline-block;border: #02a79d 2px solid;border-radius: 0px;position: relative;text-align: left; } .moplantitle { font-size: 24px;color: #585858;font-weight: bold;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 20px 0px 10px 0px; } .moprice { background: #02a79d; width: 100%;height: 120px; display: inline-block;text-align: center;padding: 10px 0px;border-radius: 26px;border-bottom-left-radius: 0;border-bottom-right-radius: 0; } .mopricesup { vertical-align: 60px; line-height: 100%; } .modatagb { font-size: 36px;font-weight: bold;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 0px 0px; } .modatagb2 { font-size: 28px;font-weight: bold;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 0px 0px; } .modatagb2en { font-size: 24px;font-weight: bold;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 0px 0px; } .modata { font-size: 26px;font-weight: normal;color: #000;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 0px 0px; } .modata2 { font-size: 34px;font-weight: bold;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 30px 0px 0px 0px; } .modata3 { font-size: 28px;font-weight: bold;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 30px 0px 0px 0px; } .modatasup { vertical-align: 18px;line-height: 100%; } .modataen { font-size: 24px;font-weight: normal;color: #585858;width: 75%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 0px 0px;width: 100%; } .modata2en { font-size: 25px;font-weight: bold;color: #585858;width: 75%;display: inline-block;text-align: center;line-height: 100%;padding: 40px 0px 0px 0px; } .modata3en { font-size: 24px;font-weight: bold;color: #585858;width: 65%;display: inline-block;text-align: center;line-height: 100%;padding: 40px 0px 0px 0px; } .modatasupen { vertical-align: 12px;line-height: 100%; } .moplantxt { font-size: 14px;color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%; } .moplantxtwht { font-size: 14px;color: #fff;width: 100%;display: inline-block;text-align: center;line-height: 100%; } .moplantxtbold { font-size: 20px;font-weight: bold; color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 20px 0px;position: absolute;bottom: 0px;left: 0px; } .moplantxtbold2 { font-size: 20px;font-weight: bold; color: #585858;width: 100%;display: inline-block;text-align: center;line-height: 100%;padding: 10px 0px 20px 0px;position: absolute;bottom: 0px;left: 0px; } .moplangiftimg { width: 25%;display: inline-block;line-height: 100%;padding-top: 5px;vertical-align: top; } .moplangifttxt { font-size: 16px;font-weight: bold; color: #585858;width: 65%;display: inline-block;text-align: left;line-height: 120%;padding-top: 8px;vertical-align: top; } .modog { width: 110px;position: absolute;bottom: 15px;right: 0px;display: inline-block;line-height: 100%; } .poplimited { width: auto;position: absolute;left: 72px;top: -45px;display: inline-block;line-height: 100%; } .poplimiteden { background: #12a89d; width: 60px;height: 60px; position: absolute;left: -15px;top: -15px;display: inline-block;line-height: 100%;font-weight: bold;color: #fff;font-size: 16px;padding: 15px;border-radius: 50%;text-align: center;line-height: 135%; } .moflagtc { width: 100px; } .moplansubbutframe { width: 100%;display: inline-block;position: absolute;bottom: 30px;left: 0px;text-align: center; } .moplansubbut { width: auto;height: auto;display: inline-block;background-color: #f15a29;border-radius: 8px;border: #000 1px solid;box-shadow: 2px 2px 0px #000;color: #fff;font-weight: bold;text-align: center;padding: 5px 20px;cursor: pointer;transition: background 0.5s; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; } .moplansubbut:hover { background-color: #000000; } .plantablewidthall { width: 1100px; } .newstablewidthall { width: 1100px; } .planarrowleftframe { display: none; } .planarrowrightframe { display: none; } .moplanwhysection { background-color: #f15a29;width: 100%;height: auto;display: inline-block; } .moplanwhysectionwidth { width: 90%; } .moplanwhyiconframe { width: 18%;height: auto;display: inline-block;margin: 0px 8px;text-align: center;vertical-align: top; } .moplanwhyiconimg { width: auto;height: 96px;margin-bottom: 5px; } .moplanwhytxt { font-size: 22px;color: #fff;font-weight: normal;line-height: 140%; } .tab { overflow: hidden;background: #fff;background-image: url(tabline.jpg);background-position: bottom;background-repeat: no-repeat;cursor: pointer;} .tab button { background-color: #a8adc5; float: left; border: none; outline: none; cursor: pointer; padding: 20px 0px; transition: 0.3s; font-size: 40px;font-weight: bold; color: #dedede;line-height: 120%; border-right: #fff 1px solid;text-align: left;transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; } .tab button:hover { background-color: #dde0ef;color: #fff; } .tab button.active { background-color: #0d1123;color: #fff;font-weight: bold;/*text-decoration: underline;text-decoration-color: #000000;*/ } .tabcontent { -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; display: none;position: relative;background-color: #0d1123; } .tabsize { width: 50%;text-align: center !important;border-right: none !important; } .tabmologoimag { width: auto;height: 30px;display: inline-block;vertical-align: -3px; } .tabmologoimag2 { width: auto;height: 20px;display: inline-block;vertical-align: -1px; } .moplanapplyframe { width: 28%;height: auto;display: inline-block;vertical-align: top;text-align: center; } .moplanapplyno { font-size: 30px;color: #fff; line-height: 160%;font-weight: bold;background-color: #00a79d;border-radius: 50%;display: inline-block;width: 50px;height: 50px; } .moplanapplytxt { font-size: 22px;color: #000;font-weight: normal;line-height: 140%; } .moplanapplyimg { width: auto;height: 170px; } .moplanapplyarrowframe { width: 5%;height: auto;display: inline-block;margin-top: 40px; } .moplanapplyarrowimg { width: auto;height: 36px; } .monewsframe { width: 46%;display: inline-block;margin: 0px 10px;vertical-align: top;scroll-snap-align: center;box-shadow: 0px 0px 5px #bababa; } .monewsimg { width: 100%;height: auto;display: inline-block; } .monewscontentframe { padding: 20px 30px;width: 100%;text-align: left; } .monewscontenttitle { font-size: 24px;line-height: 140%;display: inline-block;color: #02a79d;padding-bottom: 15px; } .monewscontenttxt { font-size: 18px;line-height: 160%;display: inline-block;color: #000;padding-bottom: 20px; } .monewsbut { font-size: 16px; width: auto;height: auto;display: inline-block;background-color: #02a79d;color: #fff;font-weight: normal;text-align: center;padding: 10px 40px;cursor: pointer;transition: background 0.5s; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; } .monewsbut:hover { background-color: #000000; } .monewscontentref { font-size: 14px;line-height: 100%;display: inline-block;color: #848484;margin-top: 30px; } .moplan3reesection { background-color: #00a79d;width: 100%;height: auto;display: inline-block; } .moplan3reesectionwidth { width: 1100px;height: 480px;display: inline-block; text-align: left;background-image: url("../images/3reelancer-dog.png");background-position: right bottom;background-size: contain;background-repeat: no-repeat; } .moplan3reetitle { font-size: 30px;font-weight: normal;color: #fff;line-height: 120%;padding-top: 60px;padding-bottom: 20px; } .moplan3reecontent { font-size: 20px;font-weight: normal;color: #fff;line-height: 140%;width: 60%; padding-bottom: 40px; } .mo3reebut { font-size: 16px; width: 220px;height: auto;display: inline-block;background-color: #fa6400;color: #fff;font-weight: normal;text-align: center;padding: 10px 40px;cursor: pointer;transition: background 0.5s; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; } .mo3reebut:hover { background-color: #000000; } .mofootersocialsection { background-color: #000000;color: #ffffff; width: 100%;height: auto;display: inline-block;padding: 30px 0px; } .mofootersocialsectionwidth { width: 1100px;height: auto;display: inline-block; text-align: left; } .mofootersocialsectionL { width: 62%;height: auto;display: inline-block; } .mofootersocialsectionR { width: 35%;height: auto;display: inline-block;text-align: right;float: right; } .mofootersocialtxtlink { font-size: 14px;line-height: 100%;display: inline-block;margin-right: 40px;cursor: pointer; } .mofootersocialicon { width: auto;display: inline-block;font-size: 12px;line-height: 120%;text-align: center;vertical-align: top;margin: 0px 10px;cursor: pointer; } .mofootersocialiconimg { width: auto;height: 44px; } .mofootertncsection { background-color: #302f2f;color: #ffffff; width: 100%;height: auto;display: inline-block;padding: 20px 0px 40px 0px; } .mofootertncsectionwidth { width: 1100px;height: auto;display: inline-block; text-align: left; } .mofootertncsectionL { width: 48%;height: auto;display: inline-block; } .mofootertncsectionR { width: 48%;height: auto;display: inline-block;text-align: right;float: right; } .mofootertnctxtlink { font-size: 12px;line-height: 100%;display: inline-block;cursor: pointer; } .mofootertnctxtcom { font-size: 12px;line-height: 100%;display: inline-block; } /**** form ****/ .forminputtxt { font-size: 16px; width: 100%; padding: 5px; display: inline-block; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; } .formpulldown { border: 1px solid #ccc; border-radius: 5px; padding: 5px 10px; font-size: 16px; width: 100%;background: #ffffff; } .formtextarea { width: 100%; padding: 5px 5px 5px 5px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 5px; font-size: 16px; text-align: left; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; } .formerror { color: #FF0000; } .formsubmit { background: url(../images/bg_button.jpg) no-repeat;background-size: 500%;background-position: 0% 95%;color: #fff;font-size: 20px;text-decoration: none;cursor: pointer;border:none;padding: 5px 20px; } .formsubmit:hover { background: url(../images/bg_button.jpg) no-repeat; background-size: 250%; } .formreset { background-color: #AFAFAF;background-image: -webkit-linear-gradient(top, #AFAFAF, #929292);background-image: -moz-linear-gradient(top, #AFAFAF, #929292);background-image: -ms-linear-gradient(top, #AFAFAF, #929292);background-image: -o-linear-gradient(top, #AFAFAF, #929292);background-image: linear-gradient(to bottom, #AFAFAF, #929292);color: #fff;font-size: 20px;text-decoration: none;cursor: pointer;border:none;padding: 5px 20px; } .formreset:hover { background: #AFAFAF; } .formthx { font-size: 20px;font-weight: bold;line-height: 120%; } .newsletterframe { width: 100%;display: inline-block;background: #e6e7e8;padding: 25px 0px;text-align: center; } .newsletterinputtxt { font-size: 14px; width: 30%; padding: 5px; display: inline-block; border: 1px solid #ccc; box-sizing: border-box;vertical-align: middle; } .newslettersubmit { background: url(../images/bg_button.jpg) no-repeat;background-size: 500%;background-position: 0% 95%;color: #fff;font-size: 18px;text-decoration: none;cursor: pointer;border:none;padding: 5px 30px;vertical-align: middle; } .newslettersubmit:hover { background: url(../images/bg_button.jpg) no-repeat; background-size: 250%; } .newsletterformthx { font-size: 18px;font-weight: bold;line-height: 120%; } /**** form ****/ .bgcontactus { background-image: url(../images/headerbg_contactus.jpg); background-position: center -70px; } .contactusframe { width: 48%; display: inline-block; float: left } .titlekeyf { font-size: 18px; font-weight: bold; line-height: 160%; color: #464646; } .keypoint { font-size: 15px; line-height: 160%; color: #464646; padding-left: 25px; list-style-type: disc; } .keypoint2 { padding: 5px 10px; background-color: #bfbfbf; color: #000000; font-size: 14px; border-radius: 20px; line-height: 200%; } .detailbut { background: url(../images/bg_button.jpg) no-repeat; background-size: 500%; background-position: 0% 95%; margin: 0px 10px 10px 0px; padding: 0px 0px 0px 0px; cursor: pointer; float: none; display: inline-block; text-align: center; } .detailbut:hover { background: url(../images/bg_button.jpg) no-repeat; background-size: 200%; } .detailbuttxt { font-size: 16px; clear: both; color: #FFFFFF; margin: 10px 25px 10px 25px; font-weight: bold; pointer-events: none; } .bgsection2 { background-image: url(../images/bg-icon.jpg); background-position: center; } .videotitle { font-size: 22px; line-height: 38px; color: #ffffff } .videotitle:hover { font-size: 22px; line-height: 38px; color: #94efff } .videotitletxt { font-size: 16px; line-height: 24px; padding-left: 28px; color: #94efff } .displaypc { display: inline-block} .displaymob { display: none } .logo { width: auto; height: 70px; padding-bottom: 15px } #topheight {clear: both;height: 53px} .homeframe1 { width: 66%; text-align: center;display: inline-block;vertical-align: top; } .photocol2homeframe { width: 49.5%; height: 320px; overflow:hidden; border: 4px solid #fff; border-top-width: 4px; border-bottom-width: 4px; display: inline-block; } .homeframe2 { width: 33%; text-align: center;display: inline-block;vertical-align: top; } .photocol1homeframe { width: 100%; height: 643px; overflow:hidden; border: 4px solid #fff; border-top-width: 4px; border-bottom-width: 4px; display: inline-block; } .photocol1frame { width: 100%; height: 260px; overflow:hidden; border: 0px solid #fff; display: inline-block; margin-top: 4px; padding-bottom: 4px; } .photocol1 { font-size: 40px; line-height: 85%; color: #FFFFFF; text-shadow: 1px 1px 6px #000000; font-weight: bold; padding-top: 40px; width: 100%; height: 260px; background-repeat: no-repeat; background-position: center; background-size: cover; text-align: center; text-transform: uppercase; vertical-align: top; cursor: pointer; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; float: left; } .photocol1:hover { -ms-transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); padding-top: 50px } .photocol2frame { width: 49.5%; height: 640px; overflow:hidden; border: 6px solid #fff; border-top-width: 10px; border-bottom-width: 10px; display: inline-block; } .photocol2 { font-size: 40px; line-height: 85%; color: #FFFFFF; font-weight: bold; text-shadow: 1px 1px 6px #000000; padding-top: 40px; width: 100%; height: 640px; background-repeat: no-repeat; background-position: center; background-size: cover; text-align: center; text-transform: uppercase; vertical-align: top; cursor: pointer; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; float: left; } .photocol2:hover { -ms-transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); padding-top: 50px } .photocol3frame { width: 33%; height: 320px; overflow:hidden; border: 4px solid #fff; border-top-width: 4px; border-bottom-width: 4px; display: inline-block; } .photocol3 { font-size: 40px; line-height: 85%; color: #FFFFFF; font-weight: bold; text-shadow: 1px 1px 6px #000000; padding-top: 40px; width: 100%; height: 320px; background-repeat: no-repeat; background-position: center; background-size: cover; text-align: center; text-transform: uppercase; vertical-align: top; cursor: pointer; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; float: left; } .photocol3:hover { -ms-transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); padding-top: 50px } .photodes { font-size: 16px; line-height: 16px; text-transform: none; font-weight: normal; } .contactuspopup { width: 100%; height: 1px; clear: both; position: fixed; bottom: 90px; text-align: right; z-index: 999; padding-right: 30px; } .contactuspopupicon { font-size:10px; font-weight: bold; color: rgba(255, 255, 255, 0); padding-top: 22px; padding-right: 10px; width: 70px; height: 70px; background-color: rgba(156, 0, 255, 0.5); border-radius: 40px; display: inline-block; cursor: pointer; box-shadow: 0px 0px 10px #ffffff; transition: cubic-bezier(0, 0, 0.01, 0.98) 0.5s; -webkit-transition: cubic-bezier(0, 0, 0.01, 0.98) 0.5s; -moz-transition: cubic-bezier(0, 0, 0.01, 0.98) 0.5s; background-image: url(../images/contactus.png); background-repeat: no-repeat; background-position: center; background-size: contain; } .contactuspopupicon:hover { border-radius: 15px; width: 180px; background-position: left; background-size: contain; font-size: 20px; color: rgba(255, 255, 255, 1); } .contactusformframe { width: 49%;display: inline-block;vertical-align: top; } .contactusformtable { width: 90%; } .hrline { text-align: center; width: 60px; } .sectionsmeoffer { position: relative;padding: 60px 10px; } .smesubtitle { font-size: 30px; line-height: 36px; color: #383838; font-weight: 700; } .smesubdes { font-size: 18px; line-height: 26px; color: #383838; font-weight: 700; } .subtitletopline { width: 80px; height: 3px; background-color: #e6007e; display: inline-block; margin-bottom: 15px; } /* ========================================================================== solution ========================================================================== */ .solframe { width: 100%; display: inline-block; text-align: left; } .solstepimg { width: 250px; display: inline-block; text-align: center; vertical-align: top; } .solsteparrow { width: 30px;display: inline-block; padding-top: 50px; } .solsteparrowrotate { transform: rotate(0deg); } .solcctv { width: 1000px; } /* ========================================================================== plan ========================================================================== */ .tmptable { border-collapse: collapse; border: 1px solid #D1D1D1; padding: 10px 5px; text-align: center; height: 20px; font-size:15px; } .tmptableadd { border-collapse: collapse; border: 1px solid #D1D1D1; padding: 10px 5px; text-align: left; height: 20px; font-size:15px; } /*.tablewidth { width: 1100px;max-width: 1600px; }*/ .tablewidth { width: 1100px; } .tablewidthev { width: 100% } .tablewidthplan { width: 100% } .tmptrheader { background-color: #8c3d98; font-weight:bold; height: 40px; color:#FFFFFF; } .stepframe { width: 33%; display: inline-block;vertical-align: top;padding-bottom: 50px; font-size: 16px; } .plantablescroll { padding-top: 10px;padding-bottom: 0px; } .newstablescroll { } .smehsbanner { width: 33%; padding: 5px 5px 5px 0px; display: inline-block; } .smesup { font-size: 12px; vertical-align: 10px; } /* ========================================================================== event6 ========================================================================== */ .evppl {display: inline-block; width: 33%;text-align: center; padding-bottom: 40px; font-size: 18px; vertical-align: top; } .ev6logoframe {display: inline-block; width: 25%;text-align: center; padding-bottom: 40px; font-size: 18px; vertical-align: top; } .ev6logo { width: 180px; } .ev6tabletime { width: 30% } .ev6tabletimeen { width: 30% } .ev6td { font-size: 18px;line-height: 140%; } .ev6tden { font-size: 18px;line-height: 160%; } .ev6name { width: 20%; padding: 5px 5px 0px 0px; display: inline-block; } .ev6nametitle { width: 80%; padding: 5px; display: inline-block; } .ev6li { font-weight: bold; } .ev6nametc { width: 30%; padding: 5px 5px 0px 0px; display: inline-block; } .ev6nametitletc { width: 70%; padding: 5px; display: inline-block; font-weight: bold; } .ev6litc { padding-left: 2px } .ev6comname { width: 25%; padding: 10px 5px 20px 5px; font-weight: bold; border-bottom: #cdcdcd 1px solid; } .ev6comcontent { width: 75%; padding: 10px 5px 20px 5px; border-bottom: #cdcdcd 1px solid; } #tmpheight1px {width:10px; clear:both; height: 1px} #tmpheight5px {width:10px; clear:both; height: 5px} #tmpheight10px {width:10px; clear:both; height: 10px} #tmpheight15px {width:10px; clear:both; height: 15px} #tmpheight20px {width:10px; clear:both; height: 20px} #tmpheight30px {width:10px; clear:both; height: 30px} #tmpheight40px {width:10px; clear:both; height: 40px} #tmpheight50px {width:10px; clear:both; height: 50px} #tmpheight80px {width:10px; clear:both; height: 80px} #tmpheight100px {width:10px; clear:both; height: 100px} .tmpeventtable { padding: 10px 5px; text-align: left; height: 20px; font-size:15px; } .eventtablewidthplan { width: 100% } /************************************************************************************ FOOTER *************************************************************************************/ #pagefooter { width: 100%; height: 60px; clear: both; background: #302f2f; } #pagefooteren { width: 100%; height: 60px; clear: both; background: #302f2f; } #footer { clear: both; } #footer a { color: #fff; } #copyright { font-size: 12px; color: #fff; padding: 20px 0px 0px 10px; float: left; } #chlogo { float: right; padding: 0px 10px 0px 0px; } #chlogoen { float: right; padding: 0px 10px 0px 0px; } /* ========================================================================== Start of CSS ========================================================================== */ /*body { color: #333; font-size: 16px; line-height: 20px; }*/ /*h1 { margin-top: 0px; margin-bottom: 10px; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; font-size: 32px; line-height: 40px; font-weight: 700; } h3 { margin-top: 0px; margin-bottom: 10px; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; font-size: 20px; line-height: 30px; font-weight: 400; } h4 { margin-top: 0px; margin-bottom: 10px; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; font-size: 30px; line-height: 32px; font-weight: 700; }*/ .banner { height: 650px; background-color: #ffffff; background-image: url(".jpg"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } .banner.with-slider { height: 700px; background-image: none; background-size: auto; background-repeat: repeat; } .banner.style-3 { height: 600px; background-image: url(".jpg"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } .navbar { padding: 7px 0px; border-bottom: 1px solid #565656; background-color: transparent; } .navbar.style-2 { /*border-bottom-color: #e1e1e1;*/ background-color: rgb(86, 86, 86); } .nav-link { margin-left: 5px; padding: 10px 25px 10px 25px; /*border: 1px solid transparent;*/ border-radius: 5px; color: #fff; font-size: 14px; font-weight: 400; } .nav-link:hover { /*border-color: hsla(0, 0%, 100%, .38);*/ color: #fff; } .nav-link.no-drop { padding: 10px 10px 10px 10px; } .nav-link.no-drop.w--current { /*border-color: hsla(0, 0%, 100%, .38); */ color: #fff; } .nav-link.no-drop.dark.w--current { /* border-color: #ffffff; */ color: #fff; } .nav-link.dark { color: #fff; font-weight: 700; } .nav-link.dark:hover { /*background-color: #c19a5f;*/ color: #fff; } .arrow-drop { margin-top: 14px; margin-right: 8px; font-size: 12px; } .section { position: relative; padding: 80px 10px; } .section.gray { background-color: #f3f5f7; } .section.no-bottom-margin { padding-bottom: 0px; } .section.with-line { border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; } .section.with-line.more { padding-bottom: 60px; } .section.with-color { background-color: #0f4473; } .section.with-color.with-map { background-image: url("../images/bg-5g.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; } .section.with-color.less-space { padding-top: 40px; padding-bottom: 40px; } .section.with-image { padding-top: 120px; padding-bottom: 120px; background-image: -webkit-linear-gradient(270deg, rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url(".jpg"); background-image: linear-gradient(180deg, rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url(".jpg"); background-position: 0px 0px, 50% 100%; background-size: auto, cover; background-attachment: scroll, fixed; } .container-fluid { display: block; max-width: 100%; margin-right: auto; margin-left: auto; } .container-fluid.center { position: relative; top: 35%; -webkit-transform: translate(0px, -30%); -ms-transform: translate(0px, -30%); transform: translate(0px, -30%); } .container-fluid.center.more { top: 46%; } .heading-1 { font-size: 46px; } .headingland { font-size: 50px; line-height: 80px; } .headinglandsub { font-size: 36px; } .heading-1.smaller { color: #0f2367; font-size: 20px; line-height: 30px; } .heading-1.small { font-size: 28px; } .heading-1.with-color { color: #0f2367; font-size: 18px; line-height: 30px; } .heading-1.pricing-title { font-size: 45px; line-height: 50px; } .heading-1.white { color: #fff; } .heading-1.white.biger { margin-bottom: 20px; font-size: 38px; } .color { color: #0f2367; font-size: 34px; font-weight: 400; } .color.smaller { color: #0f2367; font-size: 22px; } .color.white { color: #fff; } .top-margin { margin-top: 20px; } .top-margin.more { margin-top: 60px; } .top-margin.more.add { margin-top: 80px; } .titledes { color: #464646; font-size: 20px; line-height: 24px; } .paragraph { color: #464646; font-size: 15px; line-height: 30px; } .paragraph.white { color: #fff; } .paragraph.lighter { color: #969696; } .paragraph.more-gray { color: #969696; font-style: italic; } .paragraph.not-block { display: inline-block; padding-right: 15px; border-right: 1px solid #e1e1e1; } .paragraph.not-block.margin { margin-left: 15px; } .paragraph.not-block.margin.no { padding-right: 0px; border-right-style: none; } .paragraph.copy { margin-bottom: 0px; color: #464646; font-size: 12px; } .left-padding { padding-right: 0px; } .line-divider { width: 100%; height: 1px; margin-top: 35px; margin-bottom: 35px; background-color: #e1e1e1; } .div-block { margin-right: 10px; margin-left: 10px; padding: 5px; border: 1px solid #d6d6d6; } .div-block.full { margin-right: 0px; margin-left: 0px; } .light-wrapper:hover { opacity: 0.8; } .heading-2 { color: #363636; font-size: 19px; line-height: 29px; } .heading-2.white { color: #fff; } .logo-slider { top: 19px; height: auto; background-color: transparent; } .slide-nav { position: relative; padding-top: 20px; opacity: 0.7; font-size: 10px; } .slide-nav.white { opacity: 1; } .logo-wrapper { width: 100%; opacity: 0.8; text-align: center; } .logo-wrapper:hover { opacity: 1; } .service-wrapper { padding: 30px 20px 20px; border: 1px solid #d6d6d6; background-color: #fff; } .service-wrapper.add-margin { margin-bottom: 20px; } .service-icon { width: 80px; height: 80px; margin-right: 15px; float: left; background-image: url(".svg"); background-position: 50% 0px; background-size: 45px; background-repeat: no-repeat; } .service-icon.icon-2 { background-image: url(".svg"); background-size: 45px; } .service-icon.icon-3 { background-image: url(".svg"); background-size: 45px; } .service-icon.icon-4 { background-image: url(".svg"); background-size: 45px; } .service-icon.icon-5 { background-image: url(".svg"); background-size: 45px; } .service-icon.icon-6 { background-image: url(".svg"); background-size: 45px; } .service-content { position: relative; overflow: hidden; line-height: 160%; } .heading-4 { font-weight: 700; } .heading-4.biger { font-size: 28px; line-height: 30px; } .heading-4.move { position: relative; top: 4px; } .heading-4.toggle { display: inline-block; } .top-title { margin-bottom: 20px; } .top-title.center { color: #fff; text-align: center; } .top-title.more { margin-bottom: 80px; } .tab-testi { top: 40px; z-index: 3; display: inline-block; background-color: #fff; } .testi-photo { width: 85px; height: 85px; margin-right: 5px; margin-left: 5px; border-radius: 100%; background-image: url(".jpg"); background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; opacity: 1; } .testi-photo:hover { opacity: 0.8; } .testi-photo.w--current { opacity: 1; } .testi-photo.photo-2 { background-image: url(".jpeg"); background-size: contain; } .testi-photo.photo-3 { background-image: url(".jpeg"); background-size: contain; } .testi-photo.photo-3.w--current { opacity: 1; } .testi-wrapper { display: block; width: 100%; margin-right: auto; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; color: #464646; font-size: 18px; line-height: 30px; text-align: left; } .fund-wrapper { padding-top: 20px; padding-bottom: 20px; border-right: 1px solid #d6d6d6; text-align: center; } .fund-wrapper.no-line { border-right-style: none; } .smaller { color: #767676; font-size: 16px; font-weight: 400; } .normal { color: #0f2367; font-size: 17px; font-style: normal; font-weight: 700; } .footer { padding-top: 50px; padding-bottom: 50px; border-top: 1px solid #e1e1e1; background-color: #fff; } .subscribe-wrapper { display: block; width: 50%; margin-right: auto; margin-left: auto; } .sub-field { width: 70%; height: 50px; padding-left: 20px; float: left; border-style: none; } .button { padding: 12px 20px; border-radius: 10px; background-color: #0f2367; } .button:hover { background-color: #212127; } .submit-button { width: 30%; height: 50px; float: left; background-color: #212127; -webkit-transition: all 300ms ease; transition: all 300ms ease; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; } .submit-button:hover { background-color: #3a3a42; } .expert-wrapper { padding: 10px; border: 1px solid #ffffff; background-color: #fff; border-radius: 10px; } .expert-photo { width: 110px; height: 110px; margin-right: 20px; float: left; border-radius: 100%; background-color: #212127; background-image: url("../images/company-gobee.jpg"); background-position: 50% 0px; background-size: auto; background-repeat: no-repeat; } .expert-photo._2 { background-image: url("../images/company-beeinventor.jpg"); background-position: 50% 0px; background-size: auto; } .expert-photo._3 { background-image: url("../images/company-greensafety.jpg"); background-size: auto; } .expert-photo._4 { background-image: url("../images/company-tfs.jpg"); background-size: auto; } .expert-photo._5 { background-image: url("../images/company-opticalsensing.jpg"); background-size: auto; } .expert-content { position: relative; overflow: hidden; } .social-icon { width: 20px; height: 20px; margin-right: 10px; float: left; background-image: url(".png"); background-position: 50% 50%; background-size: 16px; background-repeat: no-repeat; opacity: 0.8; -webkit-transition: all 400ms ease; transition: all 400ms ease; } .social-icon:hover { opacity: 1; } .social-icon.twitter { background-image: url(".png"); } .social-icon.google { background-image: url(".png"); background-size: 20px; } .services-style-2 { margin-bottom: 15px; padding-top: 5px; padding-bottom: 5px; padding-left: 50px; background-image: url(".svg"); background-position: 0px 50%; background-size: 35px; background-repeat: no-repeat; } .services-style-2.icon-2 { background-image: url(".svg"); background-size: 35px; } .services-style-2.icon-3 { background-image: url(".svg"); background-size: 35px; } .services-style-2.icon-4 { background-image: url(".svg"); background-size: 35px; } .services-style-2.icon-5 { background-image: url(".svg"); background-size: 35px; } .services-style-2.icon-6 { background-image: url(".svg"); background-size: 35px; } .text-field { height: 50px; } .text-field.quote { width: 95%; } .text-field.biger { height: auto; padding-bottom: 170px; } .text-field.add-big { height: auto; padding-bottom: 140px; } .toggle-header { position: relative; width: 100%; padding-top: 8px; padding-bottom: 8px; padding-left: 10px; border-bottom: 1px solid #e1e1e1; color: #333; text-decoration: none; } .toggle-header:hover { color: #265796; } .toggle-content { position: relative; overflow: hidden; } .toggle-space { padding: 20px 20px 10px 10px; } .toggle-icon-plus { position: absolute; top: 10px; right: 0px; width: 30px; height: 30px; background-image: url("../images/play.png"); background-position: 50% 50%; background-size: 16px; background-repeat: no-repeat; } .toggle-icon-minus { position: absolute; top: 10px; right: 0px; width: 30px; height: 30px; background-image: url("../images/play.png"); background-position: 50% 50%; background-size: 16px; background-repeat: no-repeat; } .pricing-wrapper { border: 1px solid #e1e1e1; text-align: center; } .top-pricing { padding: 30px 10px 20px; } .top-pricing.fixed { padding-top: 20px; } .option-pricing { margin-top: -1px; padding-top: 10px; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; } .service-style-4 { position: relative; padding: 120px 20px 20px; background-color: #fff; text-align: center; border-radius: 5px; height: 450px; } .center-icon { position: absolute; left: 50%; top: -50px; display: block; width: 150px; height: 150px; border: 1px solid #e1e1e1; border-radius: 100%; background-color: #fff; background-image: url("../images/smeicon01.jpg"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; -webkit-transform: translate(-50%, 0px); -ms-transform: translate(-50%, 0px); transform: translate(-50%, 0px); } .center-icon.ico-2 { background-image: url("../images/smeicon02.jpg"); } .center-icon.ico-3 { background-image: url("../images/smeicon03.jpg"); } .center-icon.ico-4 { background-image: url("../images/icon04.png"); } .center-icon.ico-5 { background-image: url("../images/icon05.png"); } .center-icon.ico-6 { background-image: url("../images/icon06.png"); } .quote-wrapper { padding-right: 150px; padding-left: 60px; background-image: url(".svg"); background-position: 0px 0px; background-size: 40px; background-repeat: no-repeat; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; color: #464646; font-size: 19px; line-height: 30px; } .lightbox-link { position: relative; } .play-icon { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .blog-wrapper { width: 100%; -webkit-transition: all 300ms ease; transition: all 300ms ease; color: #333; text-decoration: none; } .blog-wrapper:hover { color: #0f2367; } .blog-wrapper.add-margin { margin-bottom: 50px; } .blog-image { width: 50%; margin-right: 20px; float: left; border: 1px solid #e1e1e1; } .blog-content { position: relative; overflow: hidden; } .align-center { text-align: center; } .brand { top: 1px; } .line-divider-footer { width: 100%; height: 1px; margin-top: 20px; margin-bottom: 20px; background-color: #e1e1e1; } .copyright { padding-top: 20px; padding-bottom: 20px; border-top: 1px solid #e1e1e1; } .link-copy { display: inline-block; color: #464646; text-decoration: none; } .link-copy:hover { text-decoration: underline; } .link { display: block; } .link-2 { display: inline-block; margin-bottom: 10px; -webkit-transition: all 300ms ease; transition: all 300ms ease; font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; color: #464646; font-size: 16px; text-decoration: none; } .link-2:hover { color: #0f2367; } .sub-banner { height: 350px; background-color: #0f2367; } .div-block-2 { position: relative; display: inline-block; } .utility-page-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100vw; height: 70vh; max-height: 100%; max-width: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-color: #0f2367; } .utility-page-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 400px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; } .utility-page-form { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .dropdown-list { border: 1px solid #e1e1e1; } .dropdown-list.w--open { border-radius: 5px; background-color: #fff; } .drop-link { font-family: MHeiHK, Helvetica Neue, Helvetica, Arial, Microsoft JhengHei, 微軟正黑體, sans-serif; color: #969696; font-size: 15px; } .drop-link:hover { color: #0f2367; } .drop-link.w--current { color: #313131; } .dropdown-link { font-size: 13px; } .image { display: block; margin-right: auto; margin-left: auto; } .slider-banner { height: 100%; background-color: transparent; } .slide-1 { background-image: url("../images/mainslider.jpg"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } .arrow-slider { width: 60px; height: 60px; background-color: #212127; -webkit-transition: all 400ms ease; transition: all 400ms ease; font-size: 20px; } .arrow-slider:hover { background-color: #0f2367; } .biger { font-size: 60px; line-height: 70px; } .biger.more { font-size: 60px; line-height: 60px; } .slide-2 { background-image: url(".jpg"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } .move-down { margin-top: 50px; } .success-message { background-color: #086940; color: #fff; } .scroll-navigation { position: fixed; left: 0px; top: 0px; right: 0px; z-index: 9999; display: none; padding-top: 10px; padding-bottom: 12px; background-color: #fff; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .15); } html.w-mod-js *[data-ix="toggle-content-initial-appear"] { height: 0px; } html.w-mod-js *[data-ix="display-none-nav-scroll-first-appear"] { display: none; } /************************************************************************************ smaller than 1440 *************************************************************************************/ @media screen and (max-width: 1440px) { /************************************************************************************ plan new offer *************************************************************************************/ .pnotxtframe { max-width: 25%; } /************************************************************************************ app *************************************************************************************/ .appdlframe { width: 100%; } .appstepfr { width: 20%; } .appdltab { width: 120px; } .appdlqr { width: 140px; } /************************************************************************************ new plan css *************************************************************************************/ .nplanoffertabfrcol1 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol1en { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 18px; } } /************************************************************************************ smaller than 1366 *************************************************************************************/ @media screen and (max-width: 1366px) { /************************************************************************************ wifi7 *************************************************************************************/ .wiconcol-container { width: 100%; } .wiconcol-container2 { width: 100%; } /************************************************************************************ new plan css *************************************************************************************/ .nplanoffertabfrcol1 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol1en { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 18px; } .nplanpricedataspace { width: 12px; } } @media screen and (max-width: 1280px) { /************************************************************************************ new plan css *************************************************************************************/ .nplanoffertabfrcol1 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol1en { left: -2px;top: -61px; font-size: 18px; } .nplanoffertabfrcol4 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 18px; } .nplanpricedataspace { width: 16px; } } /************************************************************************************ article *************************************************************************************/ .atcsection { padding: 40px 0px; } .atcscreenframe { width: 22%; } .remark { width: 100%; } .compremark { width: 86%; } .videoiframe { border:none;width: 100%;height: 470px; } .videosliderheight { height: 460px; } .videoiframeen { border:none;width: 100%;height: 520px; } .videosliderheighten { height: 510px; } .ntmainphotoframe { height: 350px; } .eradesicon { width: 100px;height: 100px; } .ntboxtitle { font-size: 26px;margin: 10px 0px 8px 0px; } .ntboxtitleen { font-size: 24px;margin: 10px 0px 8px 0px; } .ntdestxt { font-size: 16px;padding: 10px 10px;margin: 5px 0px; } .ntdestxten { font-size: 14px;padding: 8px 5px;margin: 3px 0px; } .liveboxtitle { font-size: 33px; } .liveboxtitleen { font-size: 33px; } .liveboxul { padding-left: 30px; } .liveboxli { font-size: 20px;line-height: 120%;padding-bottom: 10px; } .liveboxlien { font-size: 18px;line-height: 120%;padding-bottom: 10px; } .compframe01 { width: 42% } .compframe02 { width: 42% } .comptdexpframe { width: 90%; } .comptdexpframe02 { width: 90%; } .comptdexpframe03 { width: 90%;height: 110px; } .comparecontainerframe { width: 90%; } .bbmprutframespace { height: 439px; } .bbmprutframespaceen { height: 439px; } } /************************************************************************************ smaller than 1180 *************************************************************************************/ @media screen and (max-width: 1180px) { .appbtmdlfr { width: 90%; } .appbtmdlfrnew { width: 90%; } /************************************************************************************ new plan css *************************************************************************************/ .nplanpricedataspace { width: 12px; } .nplanoffertabfrcol1 { left: -2px;top: -61px;font-size: 17px; } .nplanoffertabfrcol1en { left: -2px;top: -61px; font-size: 17px; } .nplanoffertabfrcol4 { left: -2px;top: -61px;font-size: 17px; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 17px; } } @media screen and (max-width: 1024px) { /************************************************************************************ new plan css *************************************************************************************/ .nplanpricedataspace { width: 10px; } /************************************************************************************ mb step *************************************************************************************/ .stepframein3 { width: 59.7%; } .stepframein3col3 { width: 30.8%;margin: 0px 2px 0px 2px; } .ev6name { width: 30%; } .ev6nametitle { width: 70%; } .ev6nametc { width: 50%; } .ev6nametitletc { width: 50%; } .solstepimg { width: 180px; } .solsteparrow { width: 15px; padding-top: 45px; } .solcctv { width: 700px; } .tablewidth { width: 100% } .plantablewidthall { width: 100%; } .newstablewidthall { width: 100%; } .moplan3reesection { padding: 0px 30px; } .moplan3reesectionwidth { width: 100%;height: 400px; } .mofootersocialsection { padding: 30px 30px; } .mofootersocialsectionwidth { width: 100%; } .mofootertncsection { padding: 30px 30px; } .mofootertncsectionwidth { width: 100%; } .nav-link { font-size: 12px; } .remark { width: 100%; } .compremark { width: 96%; } .popuprouterimg { width: 100px;height: 100px; } .plantab { background-size: 100% 3px; } .plantabbut1 { width: 32%; padding: 15px 0px;font-size: 12px; } .plantabbut2 { width: 32%; padding: 15px 0px;font-size: 12px; } .plantabiconimg { width: 50px; } .daysiconimg { width: 48px; } .planpopupstitletab { font-size: 22px;padding: 10px 40px 10px 50px; } .planpopuppdtframecol4 { width: 46%; } /************************************************************************************ 5G NEW *************************************************************************************/ .about5gsection { padding: 30px 0px; } .why5gsection { padding: 30px 0px; } .step5gsection { padding: 30px 0px; } .onair5gsection { padding: 0px 0px 30px 0px; } .faq5gsection { padding: 30px 0px; } .plan5gsection { padding: 30px 0px; } .phone5gsection { padding: 30px 0px 80px 0px; } .eraimgframe01 { width: 80%;height: 350px;border-radius: 190px; } .eraimgframe02 { width: 80%;height: 350px;border-radius: 190px; } .eraimgframe03 { width: 80%;height: 350px;border-radius: 190px; } .eraimgframe03en { width: 80%;height: 350px;border-radius: 190px; } .eraimgframespace { width: 1px;height: 350px; } .eracontenttitle { font-size: 46px; } .eracontenttxt { font-size: 22px; } .title5glogo { height: 52px; } .moheader { font-size: 32px;padding: 0px 0px 10px 0px; } .moheaderen { font-size: 32px;padding: 0px 0px 10px 0px; } .videocontainerframe { padding: 10px 0px 30px 0px; } .videotxttitkle { font-size: 22px; } .videotxttitkleen { font-size: 22px; } .videotxtcontent { font-size: 16px; } .videoiframe { height: 400px; } .videosliderheight { height: 395px; } .videoiframeen { height: 460px; } .videosliderheighten { height: 455px; } .tab button { padding: 15px 0px; font-size: 28px; } .starvideocontainer { position: relative; width: 68%; height: 0; padding-bottom: 35.25%; } .p3mainphotoframebb { width: 96%;height: 390px;border-radius: 15px;margin: 0px 5px;padding: 6px; } .p3mainphotoframebben { width: 96%;height: 430px;border-radius: 15px;margin: 0px 5px;padding: 6px; } .p3mainphotoframe { width: 44%;height: 550px;border-radius: 15px;margin: 0px 5px;padding: 6px; } .p3mainphotoframeen { width: 44%;height: 650px;border-radius: 15px;margin: 0px 5px;padding: 6px; } .p3mainphototxt { margin-top: 42px;font-size: 24px; } .p3mainphototxten { margin-top: 42px;font-size: 20px; } .p3mainphotobut { height: 138px;top: 90px;left: 0;opacity: 1;border-radius: 15px;border-top-left-radius: 0px;border-top-right-radius: 0px; } .p3mainphotobutxt { font-size: 14px;line-height: 130%;padding: 10px 7px 0px 7px; } .p3mainphotobutxten { font-size: 12px;line-height: 110%;padding: 10px 7px 0px 7px; } .p3newscontent { font-size: 14px; line-height: 140%;margin-top: 0px; } .p3newscontenten { font-size: 14px; line-height: 140%;margin-top: 0px; } .p3newscontentbold { font-size: 16px;margin: 5px 0px 3px 0px; } .hsrow1databold {font-size: 40px; } .hsrow1databolden {font-size: 40px; } .hsrow2pricebold2 { font-size: 30px; } .hsrow2pricebold2en { font-size: 30px; } .liveplanframe { width: 96%; } .liveiconframe { margin: 5px 0px 5px 0px; } .liveiconimg { width: auto;height: 50px; } .liveboxtitle { font-size: 24px;margin: 0px 0px 5px 0px; } .liveboxtitleen { font-size: 24px;margin: 0px 0px 5px 0px; } .liveboxul { padding-left: 20px; } .liveboxli { font-size: 16px;padding-bottom: 10px; } .liveboxlien { font-size: 14px;padding-bottom: 10px; } .liveuppriceframe01 { font-size: 14px;line-height: 120% } .liveuppriceframe02 { font-size: 18px;line-height: 120%; padding: 4px 10px; } .liveuppriceframe02en { font-size: 18px;line-height: 120%; padding: 4px 10px; } .liveuppriceframeplus { font-size: 30px;margin: 0px 5px; } .liveaddonframe { padding: 20px 0px 10px 0px; } .liveupimg { height: 35px;} .step5gtitle { font-size: 24px; } .step5gcontent { font-size: 16px; } .comptick { width: 50px;height: 50px;right: 12%; top: 12%; } .compticken { width: 50px;height: 50px;right: 12%; top: 12%; } .compframe01 { width: 48%;margin: 0px 5px; } .compframe02 { width: 48%;margin: 0px 5px; } .comptdframe { width: 90% } .faqElements {width: 83%;font-size: 20px;margin: 10px 0px;padding: 8px 15px; border-radius: 20px; } .faqanswer { margin-top: 10px;border-left: 3px solid #dbdbdb;padding: 0px 17px;font-size: 16px; } .phone5gframe { width: 29%;margin: 0px 0px 0px 30px; } .phone5gpdtname { font-size: 17px;padding-left: 6px; } .eradesicon { width: 80px;height: 80px; } .ntboxtitle { font-size: 20px;margin: 10px 0px 8px 0px; } .ntboxtitleen { font-size: 16px;margin: 10px 0px 8px 0px; } .ntdestxt { font-size: 15px;padding: 10px 10px;margin: 5px 0px; } .ntdestxten { font-size: 12px;padding: 6px 5px;margin: 3px 0px; } .livexptitle { font-size: 22px;padding: 8px 0px; } .livexptxt { font-size: 16px; } .specframe { background-color: #ededed; } .specpdtframebb { width: 20%;height: auto;background-color: #fff;vertical-align: middle;float: none; } .specpdtframe { width: 23%;height: auto;background-color: #fff;vertical-align: middle;float: none; } .specpdtframewifi { width: 46%;height: auto;background-color: #fff;float: none; } .specpdtframe02 { display: none; } .specpdtframe03 { width: 50%;height: auto;float: none;display: inline-block;background-color: #fff; } .spectxtframe { width: 49%;height: auto;vertical-align: middle;float: none; } .specspace { display: none; } .speccontent { width: 99%;padding: 20px;vertical-align: middle; } .speccontenttitlebb { font-size: 22px;padding-bottom: 10px; } .speccontenttitle { font-size: 16px;padding-bottom: 10px; } .speccontenttxt1 { font-size: 16px; } .speccontenttxt2 { font-size: 16px; } .specul { padding-left: 20px; } .specli { font-size: 16px;padding-bottom: 10px; } /************************************************************************************ solution new *************************************************************************************/ .coltablewidth { width: 96.8%; } .mainpagepromocol3 { width: 32%;height: 365px; margin-bottom: 25px;margin-left: 0.56%;margin-right: 0.56%; } .boxsmallcontentline1 { font-size: 14px; } .boxsmallcontentline2 { font-size: 14px; } .boxsmallcontentboldtxt { font-size: 1.5rem; } .plantablewidthcol1 { width: 96%; } .plantablewidthcol2 { width: 100%; } .plantablewidthcol3 { width: 100%; } .plantablewidthcol4 { width: 96%; } .plantablewidthcol5 { width: 96%; } .freeimg { height: 170px; } .tableoff { font-size: 14px; } .mainpagetitle { font-size: 2em; } .boxTitletxt { font-size: 14px; } /************************************************************************************ topnav *************************************************************************************/ .slider { font-size: 14px; } .slider { scroll-snap-type: mandatory; scroll-snap-points-y: repeat(20vw); scroll-snap-type: x mandatory; display: flex; overflow-x: scroll; font-size: 14px; -webkit-overflow-scrolling:touch; } section { padding: 12px 18px; width: auto; scroll-snap-align: center; text-align: center; position: relative; white-space: nowrap; -webkit-overflow-scrolling:touch; } .nav-link.no-drop { padding: 10px 6px 10px 6px; } } @media (max-width: 991px) { .appbtmdlfr { width: 90%; } .appbtmdlfrnew { width: 90%; } /************************************************************************************ Ltd offer *************************************************************************************/ .ltdicon { top: -79%;right: -8%; } .ltdiconen { top: -43%;right: -16%; } .ltdoffergridcol { width: 90%; } .tablewidth { width: 100% } .plantablewidthall { width: 100%; } .newstablewidthall { width: 100%; } .mofootersocialsectionwidth { width: 100%; } .mofootertncsectionwidth { width: 100%; } .moplanwhyiconframe { width: 16%; } .moplanwhytxt { font-size: 15px;padding-bottom: 25px; } .moplanapplyimg { height: 120px; } .moplanapplytxt { font-size: 16px; } .moplanapplyno { font-size: 24px;width: 40px;height: 40px; } .moplan3reesectionwidth { width: 100%;height: 340px;padding: 0px 30px 0px 30px; } .moplan3reetitle { font-size: 24px;padding-top: 30px; } .moplan3reecontent { font-size: 18px;padding-bottom: 30px;width: 46%; } .mofootersocialsectionwidth { padding: 0px 30px; } .mofootertncsectionwidth { padding: 0px 30px; } .moplandata { font-size: 40px;margin-top: 27px; } .moplandata2 { font-size: 35px;margin-top: 50px; } .moplandatatxt { font-size: 14px; } .modata { font-size: 22px; } .poplimited {left: 35px; } .daysiconimg { width: 54px; } .pticon2 { top: -60%;right: -6%; } .pticon2en { top: -28%;right: -5%; } .pticon2a { top: -80%;right: -10%; } .pticon2aen { top: 9%;right: -28%; } .pticon2b { top: -80%;right: -10%; } .pticon2ben { top: -43%;right: -14%; } .pticon2c { top: -79%;right: -8%; } .pticon2cen { top: -36%;right: 1%; } .pticon2bwifi { top: 55%;right: -18%; } .pticon2bwifien { top: 64%;right: -1%; } .pticon2d { top: -80%;right: -38%; } .pticon2den { top: -43%;right: -14%; } .pticonimgen { width: 60px; } .daysiconen { display: none; } .daysicon2en { display: none; } .daysiconenmob { display: inline-block;position: absolute;right: 5px;bottom: 5px; } .daysicon2enmob { display: inline-block;position: absolute;right: 5px;bottom: 5px; } .planofferopenframerow2en { right: -25%; } /************************************************************************************ 5G NEW *************************************************************************************/ .about5gsection { padding: 30px 0px; } .why5gsection { padding: 30px 0px; } .step5gsection { padding: 30px 0px; } .onair5gsection { padding: 0px 0px 30px 0px; } .faq5gsection { padding: 30px 0px; } .plan5gsection { padding: 30px 0px; } .phone5gsection { padding: 30px 0px 80px 0px; } .eraimgframe01 { width: 80%;height: 250px;border-radius: 190px; } .eraimgframe02 { width: 80%;height: 250px;border-radius: 190px; } .eraimgframe03 { width: 80%;height: 250px;border-radius: 190px; } .eraimgframe03en { width: 80%;height: 250px;border-radius: 190px; } .eraimgframespace { width: 1px;height: 250px; } .eracontenttitle { font-size: 36px; } .eracontenttxt { font-size: 20px; } .comptick { width: 40px;height: 40px;right: 5%; top: 20%; } .compticken { width: 40px;height: 40px;right: 5%; top: 20%; } .videoiframe { height: 330px; } .videosliderheight { height: 325px; } .videoiframeen { height: 420px; } .videosliderheighten { height: 415px; } .p3mainphotoframebb { width: 96%;margin: 0px 5px 10px 5px; } .p3mainphotoframebben { width: 96%;margin: 0px 5px 10px 5px; } .p3mainphotoframe { width: 44%;margin: 0px 5px 10px 5px; } .p3mainphotoframeen { width: 44%;height: 700px; margin: 0px 5px 10px 5px; } .p3mainphototxt { margin-top: 42px;font-size: 20px; } .p3mainphototxten { margin-top: 42px;font-size: 20px; } .p3mainphotobutxt { font-size: 12px;line-height: 130%; } .p3mainphotobutxten { font-size: 11px;line-height: 100%; } .p3newsframe { width: 46%; } .phone5gframe { width: 27%;margin: 0px 0px 0px 30px; } .bbmprutframespace { height: 371px; } .bbmprutframespaceen { height: 409px; } /************************************************************************************ solution new *************************************************************************************/ .coltablewidth { width: 97.5%; } .mainpagepromocolspace { width: 2%; } .mainpagepromocol3 { width: 48.1%;margin-bottom: 25px;margin-left: 0.8%;margin-right: 0.8%; } .mainpagepromosupport { width: 48.1%;margin-bottom: 25px;margin-left: 0.8%;margin-right: 0.8%; } .mainpagetitle { font-size: 2em; } #topheight { clear: both; height: 52px } .photocol3frame { width: 32%; } .solsteparrow { width: 15px; padding-top: 30px; } .solstepimg { width: 135px; } /**** form ****/ .formsubmit { font-size: 16px;padding: 5px 10px; } .formreset { font-size: 16px;padding: 5px 10px; } /**** form ****/ .navbar { /*padding-top: 10px; padding-bottom: 10px;*/ } .navbar.style-2 { /*padding-top: 0px; padding-bottom: 4px;*/ } .navbar.color { background-color: #0f2367; } .heading-1.white.biger { font-size: 35px; } .service-wrapper { margin-bottom: 20px; padding-left: 10px; } .service-icon { width: 60px; height: 60px; } .subscribe-wrapper { width: 70%; } .expert-wrapper { margin-bottom: 20px; } .brand { top: 1px; } .move-down { margin-top: 0px; } .menu-button.w--open { background-color: rgb(86, 86, 86); } .nav-menu { padding: 20px 10px; background-color: rgb(104, 104, 104); } .nav-menu.color { background-color: rgba(0, 0, 0, .9); } .div-block-3 { margin-bottom: 20px; } .div-block-4 { margin-bottom: 20px; } .white-icon { color: #fff; } .white-icon.w--open { background-color: #0f2367; } } @media (max-width: 767px) { .banner { height: 800px; } .left-padding { margin-bottom: 20px; padding-right: 0px; } .div-block.full { margin-bottom: 20px; } .logo-wrapper { margin-bottom: 20px; } .fund-wrapper { border-right-style: none; } .subscribe-wrapper { width: 90%; } .text-field.quote { width: 100%; } .pricing-wrapper { margin-bottom: 20px; } .service-style-4 { margin-bottom: 70px; } .quote-wrapper { padding-right: 0px; } .blog-wrapper { margin-bottom: 20px; } .move-down { margin-bottom: 50px; } .div-block-5 { margin-bottom: 20px; } } @media (max-width: 479px) { body { line-height: 0px; } .planoffercolor2 { width: 100%;font-size: 24px;margin-top: 0px;margin-bottom: 15px; } .steptablewidth { width: 98%; } /************************************************************************************ wifi7 *************************************************************************************/ .wiconcol-container { grid-template-columns: 1fr; grid-gap: 30px; width: 100%; } .wiconcol-container2 { grid-template-columns: 1fr; grid-gap: 30px; width: 100%; } .wcontent { width: 90%;font-size: 18px; } .wicon { width: 40%; } .wimg { width: 60%; } .wicontxt { font-size: 18px;margin-top: 5px; } /************************************************************************************ ck *************************************************************************************/ .cktopmsgbox { font-size: 22px;margin-top: 10px;padding: 25px 15px;width: 96%; } .cktopmsgboxen { font-size: 18px;margin-top: 10px;padding: 25px 15px;width: 96%; } .ckmsgbtn { width: 100%;padding: 12px 10px; } .ckiconmb { width: 22px; } /************************************************************************************ table *************************************************************************************/ .set1table { font-size: 14px; } .set1tableL { padding: 8px 6px; } .set1tableR { padding: 8px 6px; } .set1tabletitle { font-size: 16px; } .wtable { width: 880px; } /************************************************************************************ plan arrow *************************************************************************************/ .planarrowframe { position: relative; } .planarrowleftframe { width: auto;display: inline-block;left: 10px; top: 25% ;z-index: 99;position:absolute; -webkit-animation:aleft 0.5s linear infinite alternate; -moz-animation: aleft 0.5s linear infinite alternate; -ms-animation: aleft 0.5s linear infinite alternate; -o-animation: aleft 0.5s linear infinite alternate; animation: aleft 0.5s linear infinite alternate; } @-webkit-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-moz-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-ms-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-o-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } .planarrowrightframe { width: auto;display: inline-block;right: 10px; top: 25%;z-index: 99;position: absolute; -webkit-animation:aright 0.5s linear infinite alternate; -moz-animation: aright 0.5s linear infinite alternate; -ms-animation: aright 0.5s linear infinite alternate; -o-animation: aright 0.5s linear infinite alternate; animation: aright 0.5s linear infinite alternate; } @-webkit-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-moz-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-ms-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-o-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } .planarrow { width: auto;height: 35px;opacity: 0.12; } .planarrowframe { position: relative; } .planarrowleftframe { width: auto;display: inline-block;left: 10px; top: 25% ;z-index: 99;position:absolute; -webkit-animation:aleft 0.5s linear infinite alternate; -moz-animation: aleft 0.5s linear infinite alternate; -ms-animation: aleft 0.5s linear infinite alternate; -o-animation: aleft 0.5s linear infinite alternate; animation: aleft 0.5s linear infinite alternate; } @-webkit-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-moz-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-ms-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-o-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } .planarrowrightframe { width: auto;display: inline-block;right: 10px; top: 25%;z-index: 99;position: absolute; -webkit-animation:aright 0.5s linear infinite alternate; -moz-animation: aright 0.5s linear infinite alternate; -ms-animation: aright 0.5s linear infinite alternate; -o-animation: aright 0.5s linear infinite alternate; animation: aright 0.5s linear infinite alternate; } @-webkit-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-moz-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-ms-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-o-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } /************************************************************************************ plan new offer *************************************************************************************/ .pnoframe { width: 90%;padding: 12px; } .pnotxtframe { max-width: 92%;font-size: 18px; } .pnosybframe { width: 100%;font-size: 28px;margin: 0px 0px; } /************************************************************************************ floating banner *************************************************************************************/ .fobannerfr { bottom: 9%; } .fobannerfrpopup { right: 2%; bottom: 10%; } /************************************************************************************ plan 3steps *************************************************************************************/ .planstepfr { width: 93%;border-radius: 24px;margin: 0px 0px 20px 0px;padding: 10px 10px; } .plansteppic{ width: 22%;margin-bottom: 12px;vertical-align: middle; } .plansteptxt { width: auto;font-size: 26px;margin-bottom: 12px;margin-right: 0%;vertical-align: middle; } .plansteptxten { width: auto;font-size: 20px;margin-bottom: 12px;margin-right: 0%;vertical-align: middle; } .planstepiconLfr { width: 100%; } .planstepiconarrow { margin-top: 26px; } .planstepiconimg { width: 64px; } .planstepiconimgarrow { width: 12px; } .planstepicontxt { font-size: 16px;margin-bottom: 5px; } .planstepicontxten { font-size: 14px;margin-bottom: 5px; } .plansteptitlespace { padding: 0px 0px 5px 0px !important; } .planstepnofr { width: 22px;height: 22px;font-size: 16px;top: 0px;left: 0px; } /************************************************************************************ popup faq *************************************************************************************/ .pfheader { font-size: 24px; } .pfsubtitle { font-size: 20px; } .pfnotd { width: 7%; } .pfqus { font-size: 18px; } .pfans { font-size: 16px; } .pfappicon { width: 30px;vertical-align: -8px; } /************************************************************************************ floating banner *************************************************************************************/ .fobanner { width: 280px;height: auto;display: inline-block; } .fobannerclose { width: 24px; } .fobannerpopup { width: 130px; } /************************************************************************************ app *************************************************************************************/ .appsteparrowfr { width: 100%;height: auto;margin: 0px 0px;margin-top: 10px; } .appsteparrowimg { width: 30px;transform: rotate(90deg) } .contentwidth { width: 90%; } .appdlframe { width: 100%; } .appdlscreenfr { width: 80%;height: 270px;overflow: hidden;padding: 20px 30px;margin: 0px;margin-bottom: 10px; } .appdlcontentfr { width: 100%; } .appdlcontent { font-size: 18px;text-align: center; } .appdlqr { display: none; } .appdltab { width: 30%;margin: 0px 0px; } .appstepfr { width: 70%; } .appstepimg { width: 70%; } .appstepnofr { top: -5px;left: 5px; } .appsteptxt { font-size: 20px;margin-top: 10px; } .topmenuanibut { margin-right: 4%;font-size: 12px;padding: 18px 12px; } .appdlsection { padding: 15px 0px 30px 0px !important; } .appbtmdlfr { width: 90%;height: auto;display: inline-block;padding: 26px 15px 26px 15px;background-size: cover; } .appbtmtxtfr { width: 96%; } .appbtmheader { font-size: 22px;text-align: center;margin-top: 10px;padding: 0px 0px 5px 0px; } .appbtmcontent { font-size: 16px;text-align: center; } .appbtmappicon { margin-top: 10px;padding-top: 12px; } .appbtmdlfrnew { width: 94%;padding: 15px; } .appbtmqr { display: none !important; } /************************************************************************************ new plan css *************************************************************************************/ .nplancol1-container { width: 99%; margin: 50px 0px 30px 0px; } .nplancol4-container { grid-gap: 12px; width: 1350px; margin: 50px 30px 30px 30px; } .nplancontainertopen { margin-top: 50px; } .nplancolframe { width: 99%;height: auto;display: inline-block;border: 2px #672AA9 solid;padding: 4px;border-radius: 8px;scroll-snap-align: center;box-shadow: 0px 14px 20px #00000017; } .nplancolframeoffer { border-top-left-radius: 0px; } .nplanpricedata { font-size: 46px; } .nplancolframetab { border-top-left-radius: 0px; } .nplanpricedatatitle { font-size: 14px;white-space: nowrap; } .nplanpricedataspace { width: 20px; } .nplanoffertabfrcol1 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol1en { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4 { left: -2px;top: -61px;font-size: 18px; } .nplanoffertabfrcol4en { left: -2px;top: -61px;font-size: 18px; } .nplan7day { font-size: 24px; } .nplan7dayen { font-size: 20px; } .nplanpdtimgrent { width: 150px; } .nplanaddonframecol1 { width: 96% !important; } .nplanimgcol2 { width: 44%;font-size: 16px; } .nplanimg { width: 90%; } /************************************************************************************ updated *************************************************************************************/ .planaddonofferbox { font-size: 18px; } /************************************************************************************ problem *************************************************************************************/ .pbgrid-container { grid-template-columns: 1fr;grid-gap: 20px; } .pbtxt { font-size: 22px;margin-top: 5px; } /************************************************************************************ watsons *************************************************************************************/ .logombreward { height: 40px;vertical-align: -13px; } .logomb { height: 30px;vertical-align: -9px; } /************************************************************************************ mb step *************************************************************************************/ .mbstepsection { padding: 20px 0px; } .mbstepcontainer { width: 90%; } .mbstepsubtitle { font-size: 22px;padding: 0px 0px 10px 0px; } .mbstepsubtitle2 { font-size: 18px;padding: 0px 0px 10px 0px; } .stepframecol5 { width: 46%;margin: 10px 5px 20px 5px; } .steptxtcol4 { width: 100%;font-size: 16px; } .stepcontent { font-size: 16px;margin-top: 15px; } .stepframein3 { width: 100%; } .stepframein3col3 { width: 30%;margin: 0px 3px 0px 3px; } /************************************************************************************ new ui *************************************************************************************/ .whyiconframe { width: 35%;margin-bottom: 10px; } .whyiconimg { width: 70%; } .whyicontxt { font-size: 16px; } .monthgrid-container { grid-template-columns: 1fr;grid-gap: 20px;padding: 5px; } .monthgrid-containercol1 { grid-template-columns: 1fr;grid-gap: 20px;padding: 5px;width: 100%; } .monthgridcol1 { width: 98%; } .monthgrid-containercol2 { grid-template-columns: 1fr;grid-gap: 46px;padding: 5px; } .monthgrid-containercol3 { grid-template-columns: 1fr;grid-gap: 46px;padding: 5px; } .planaddonframe { width: 97%; } .planaddonframecol1 { width: 96%; } .planaddontitle { font-size: 22px; } .planaddonsubtitle { font-size: 18px; } .planaddonframecol2 { width: 90%; } .planaddonprice { font-size: 22px; } .planaddondata { font-size: 26px; } .planaddonvotxt { margin: 30px 0px 0px 0px; } .planaddonvotxtbold { font-size: 26px; } .planaddonimg { width: 80px; } .planaddontxt { font-size: 16px; } .planaddonvotxt { font-size: 16px; } .planofferframe { font-size: 16px;height: auto;padding: 0px 0px;margin: 10px 0px 20px 0px; } .planofferopenframerow1en { top: -4%;right: -42%; } .planofferopenframerow2en { right: -26%; } .planpopupstitletab { font-size: 15px;padding: 8px 30px 8px 40px;margin-bottom: 10px; } .planpopuppdtframecol4 { width: 88%;padding-bottom: 10px;margin-bottom: 20px;line-height: 120%;margin: 4px 4px;box-shadow: 0px 4px 8px #ebebeb; } .planpopuppdtspeccol4 { display: none; } .planiconmb { width: 22px; } .planmbframe { font-size: 16px; } .planrouterfr { font-size: 14px;width: 100%;margin: 0px; } .planrouterrentfr { font-size: 16px;width: 90%;line-height: 120%; } .planroutertxt { font-size: 14px; } .planroutertxten { font-size: 14px; } .planrouteraddon { width: 94%;font-size: 14px; } .routersection { width: 100%;padding: 40px 0px 40px 0px; } .rutopentxt { font-size: 12px; } .rutopenmthtxt { font-size: 12px; } .orgpricetxt { font-size: 12px; } .offercontent { font-size: 16px;width: 90%;text-align: justify; } .offercontenten { font-size: 14px;width: 90%;text-align: justify; } .ltdapplybtn { width: 98%;height: auto;display: inline-block;font-size: 24px;font-weight: bold;color: #fff;/*text-shadow: 0px 0px 5px #fff;*/padding: 26px 0px;position: fixed; bottom: 1.5%;left: 1%; margin-left: 0px;text-align: center;border-radius: 100px;box-shadow: 0px 18px 20px #000;background-color: #672AA9;/*background-image: linear-gradient(to right, #e92d8a,#bc2fac,#9935c4,#973bc3);*/ } /************************************************************************************ ltd offer *************************************************************************************/ .ltdoffergridcol { width: 96%; } .ltddaysicon { top: 0%;right: -38%; } .ltddaysiconen { top: 0%;right: -38%; } .ltdpdtframe1 { width: 43%;font-size: 12px;vertical-align: top; } .ltdpdtframe2 { width: 43%;font-size: 12px;vertical-align: top; } .ltdpdtimg { height: 60px; } .ltdpdtframemb { font-size: 18px; } .ltdicon { top: -83%;right: -22%; } .ltdiconen { top: -52%;right: -16%; } .ltdplanmsg { font-size: 16px; } .ltdpdtspec { display: none; } .top5gapplybut { width: 98%;padding: 26px 0px;font-size: 24px;position: fixed; bottom: 1.5%;left: 1%; margin-left: 0px;text-align: center;border-radius: 10px;box-shadow: 0px 18px 20px #000; } .remark { width: 98%; } .compremark { width: 98%; } .applybut { width: 88%; padding: 15px 0px;margin-bottom: 10px; } .popuprouterframeL { bottom: 0px;right: -30px; } .popuprouterframeR { bottom: 0px;right: -30px; } .popuprouterimg { width: 120px;height: 120px; } .daysicon2 { top: 0%;right: -32%; } .daysicon2en { } .daysicon { top: 0%;right: -38%; } .daysiconen { } .daysiconimg { width: 50px; } .pticon { top: -65%;right: 0%; } .pticonen { top: -43%;right: 0%; } .pticonimg { width: 70px; } .pticonimgen { width: 70px; } .pticon2 { top: -120%;right: -15%; } .pticon2en { top: -43%;right: 2%; } .pticon2a { top: -82%;right: -20%; } .pticon2aen { top: -6%;right: -30%; } .pticon2b { top: -82%;right: -20%; } .pticon2ben { top: -53%;right: -5%; } .pticon2c { top: -100%;right: -15%; } .pticon2cen { top: -62%;right: -8%; } .pticon2bwifi { top: 55%;right: -20%; } .pticon2bwifien { top: 63%;right: -5%; } .pticonwifiimg { width: 50px; } .pticon2d { top: -105%;right: -46%; } .pticon2den { top: -53%;right: -5%; } .tabletab { font-size: 16px; } .tabletabimg { padding: 8px 0px 0px 0px; } .hsothersframe { width: 100%;display: inline-block;float: left;padding-bottom: 10px; } .framehsothersmain1 { padding: 15px 0px; } .hsothersspace { display: none; } .bbmppdttxtL { font-size: 12px; } .bbmppdttxtR { font-size: 12px; } /************************************************************************************ article *************************************************************************************/ .atcpageheader { font-size: 26px; } .atcsection { padding: 30px 0px; } .atccontent { width: 94%; } .atccontentL { width: 100%;float: none; } .atccontentR { width: 100%;float: none; } .atctablecontent { width: 100%; } .atcscreenframe { width: 49%;float: none;margin-right: 0px;margin-bottom: 20px; } .atcscreentxt { font-size: 14px; } .atctitle { font-size: 24px; } .atcsubtitle { font-size: 20px; } .atcsubtitleh4 { font-size: 18px; } .atccontenttxt { font-size: 16px; } .atcpic { margin: 6px 0px 12px 0px; } .atcpointlink { font-size: 14px; } .topmenudlbut { font-size: 16px; } .atctable { font-size: 16px; } /************************************************************************************ smarthome *************************************************************************************/ .sthmframe { width: 40%;margin: 0px 3px 10px 3px; } .sthmtitle { font-size: 16px;margin: 5px 0px; } .plantab { width: 100%;height: auto;margin-bottom: 0px;background-size: 200% 2px;background-image: none; } /*.plantab { width: 100%;height: auto;background-size: 200% 2px; }*/ .plantabbut1 { width: 96%; padding: 15px 0px;font-size: 16px;line-height: 120%;border-radius: 10px;margin-bottom: 10px !important; } .plantabbut2 { width: 96%; padding: 15px 0px;font-size: 16px;line-height: 120%;border-radius: 10px;margin-bottom: 10px !important; } /*.plantabbut2 { width: 30%; padding: 15px 0px;font-size: 14px;line-height: 120%; }*/ .plantabbut2en { font-size: 16px; } .p3mainphotoframepbb { background-image: url(../images/pic04-tc.gif); } .p3mainphotoframepbben { background-image: url(../images/pic04-en.gif); } /************************************************************************************ plan *************************************************************************************/ .planarrowframe { position: relative; } .planarrowleftframe { width: auto;display: inline-block;left: 10px; top: 25% ;z-index: 99;position:absolute; -webkit-animation:aleft 0.5s linear infinite alternate; -moz-animation: aleft 0.5s linear infinite alternate; -ms-animation: aleft 0.5s linear infinite alternate; -o-animation: aleft 0.5s linear infinite alternate; animation: aleft 0.5s linear infinite alternate; } @-webkit-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-moz-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-ms-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @-o-keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } @keyframes aleft { from { left:10px; top:25%;} to { left:0px; top:25%;} } .planarrowrightframe { width: auto;display: inline-block;right: 10px; top: 25%;z-index: 99;position: absolute; -webkit-animation:aright 0.5s linear infinite alternate; -moz-animation: aright 0.5s linear infinite alternate; -ms-animation: aright 0.5s linear infinite alternate; -o-animation: aright 0.5s linear infinite alternate; animation: aright 0.5s linear infinite alternate; } @-webkit-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-moz-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-ms-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @-o-keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } @keyframes aright { from { right:10px; top:25%;} to { right:0px; top:25%;} } .planarrow { width: auto;height: 35px;opacity: 0.12; } .plantablewidthcol3 { width: 1000px; } .frameplancol3 { margin: 0px 3px; } .frameplanspace { display: none; } .plantablewidthcol1 { width: 100%; } .frameplancol1 { margin: 0px 3px;width: 98%;margin-top: 40px; } .plantablewidthcol2 { width: 700px; } .frameplancol2 { margin: 0px 3px;width: 48.5%; } .frameplanspace2 { display: none; } .bbmprutframespace { height: 352px; } .bbmprutframespaceen { height: 386px; } .bbmprutframe { width: 90%; } .bbmpplus { font-size: 22px;font-weight: bold;line-height: 100%;width: 100%;height: auto;display: inline-block;text-align: center;margin: 10px 0px; } .bbmppdtframe { width: 25%;font-size: 12px;vertical-align: top; } .bbmppdtframeor { width: auto;font-size: 14px;margin-top: 0px;margin-top: 30px; vertical-align: top; } .bbmppdtimg { width: 100px; } .bbmppdtimgrent { width: 150px; } .plannewtab { padding: 3px 8px;font-size: 14px; } .planlimitedtab { padding: 18px 10px;left: 2px;top: -42px;font-size: 20px; } .planlimitedtab2 { padding: 5px 8px;font-size: 20px; } .planlim { font-size: 14px; } .planlimen { font-size: 12px; } /************************************************************************************ 5G live *************************************************************************************/ .abouttablewidth { width: 90%; } .moheaderdesp { font-size: 16px;padding: 0px 0px 10px 0px;width: 90%; } .p1table { padding: 2px 5px;margin-bottom: 20px;font-size: 16px; } .moheader { font-size: 26px;padding: 0px 0px 10px 0px;width: 96%;text-align: center; } .moheaderen { font-size: 24px;line-height: 120%; padding: 0px 0px 10px 0px;width: 96%; } .starvideoframe5gonair { width: 90%;height: auto;display: inline-block;background-color: #000; } .starvideoframe { width: 80%;height: auto;display: inline-block;background-color: #000; } .starvideocontainer { position: relative; width: 100%; height: 0; padding-bottom: 57.25%; } .drumtxt { font-size: 16px; line-height: 140%;padding: 10px 0px 10px 0px;width: 80%; } .youtubevideoheight { height: 220px; } .logo5glive { vertical-align: 0px;padding-top: 8px; } /************************************************************************************ 5G NEW *************************************************************************************/ .about5gsection { padding: 30px 0px; } .why5gsection { padding: 40px 0px 40px 0px; } .step5gsection { padding: 30px 0px 30px 0px; } .onair5gsection { padding: 0px 0px 30px 0px;background-size: 200% 100%;background-position: center; } .faq5gsection { padding: 30px 0px;background-size: cover;background-position: top center; } .plan5gsection { padding: 30px 0px;background-size: 200% auto; background-position: top center;background-repeat: no-repeat; } .phone5gsection { padding: 30px 0px 30px 0px; } .liveupimg { height: 25px;vertical-align: -5px; } .title5glogo { height: 35px;vertical-align: -7px; } .eraimgframe01 { width: 98%;height: 260px;border-radius: 150px; } .eraimgframe02 { width: 98%;height: 260px;border-radius: 150px; } .eraimgframe03 { width: 98%;height: 260px;border-radius: 150px;background-image: url('../images/photo-part02-mob-tc.png');background-position: center;background-size: contain;background-repeat: no-repeat;background-color: #000; } .eraimgframe03en { width: 98%;height: 260px;border-radius: 150px;background-image: url('../images/photo-part02-mob-en.png');background-position: center;background-size: contain;background-repeat: no-repeat;background-color: #000; } .eraimgframespace { width: 1px;height: 260px; } .eraimgframecontent { width: 88%; } .eracontenttitle { font-size: 33px;line-height: 100%; } .eracontenttxt { font-size: 18px; } .ntmainphotocontainerpc { display: none; } .ntmainphotoframe { width: 84%;height: 340px; } .eradesicon { width: 80px;height: 80px; } .ntboxtitle { font-size: 26px;margin: 10px 0px 8px 0px; } .ntboxtitleen { font-size: 22px;margin: 10px 0px 8px 0px; } .ntdestxt { font-size: 16px;padding: 10px 8px;margin: 5px 0px; } .ntdestxten { font-size: 14px;padding: 7px 5px;margin: 4px 0px; } .whyiframe { border:none;width: 100%;height: 340px;display: inline-block; } .videocontainerframe { padding: 10px 0px 20px 0px; } .videotxtframe { width: 80%; } .videotxttitkle { font-size: 20px;width: 96%; } .videotxttitkleen { font-size: 18px;line-height: 120%;width: 96%; } .videotxtcontent { font-size: 16px; } .videoiframe { border:none;width: 100%;height: 400px; } .videosliderheight { height: 385px; } .videoiframeen { border:none;width: 100%;height: 520px; } .videosliderheighten { height: 515px; } .swiper-container10 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .swiper-container12 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; } .p3mainphotoframebb { width: 84%;height: 390px;border-radius: 15px; } .p3mainphotoframebben { width: 84%;height: 440px;border-radius: 15px; } .p3mainphotoframe { width: 84%;height: 450px;border-radius: 15px; } .p3mainphotoframeen { width: 84%;height: 470px;border-radius: 15px; } .p3mainphototxt { margin-top: 42px;font-size: 24px; } .p3mainphototxten { margin-top: 35px;font-size: 20px; } .p3mainphotobut { height: 158px;top: 90px;left: 0;opacity: 1;border-radius: 15px;border-top-left-radius: 0px;border-top-right-radius: 0px; } .p3mainphotobutxt { font-size: 16px;line-height: 130%;padding: 10px 7px 0px 7px; } .p3mainphotobutxten { font-size: 14px;line-height: 120%;padding: 6px 3px 0px 3px; } .p3mainphotocontainerpc { display: none; } .p3newscontainerframe { width: 94%;margin: 10px 0px 30px 0px } .p3newsframe { width: 85%; } .liveiframe { border:none;width: 100%;height: 460px;display: inline-block; } .liveboxtitle { font-size: 26px; } .liveboxtitleen { font-size: 25px; } .liveboxul { padding-left: 30px; } .liveboxli { font-size: 18px;line-height: 120%;padding-bottom: 10px; } .liveboxlien { font-size: 16px;line-height: 120%;padding-bottom: 10px; } .liveiconimg { width: auto;height: 80px; } .liveboxcontent { font-size: 16px;width: 96%; } .liveboxcontenten { font-size: 14px;width: 86% } .liveupplanframeL { width: 100%;font-size: 16px;line-height: 100%;border-right: none;border-bottom: 2px solid #dbdbdb;padding-bottom: 0px; } .liveuppriceframe01 { font-size: 14px;line-height: 120% } .liveuppriceframe02 { font-size: 16px;line-height: 120%; padding: 4px 10px; } .liveuppriceframe02en { font-size: 12px;line-height: 120%; padding: 4px 10px; } .liveuppriceframeplus { font-size: 30px;margin: 0px 5px; } .livetimeframe { width: auto;margin: 40px 0px 0px 0px; } .livetimeframemargin { margin-bottom: 0px; } .liveupplanframespace { width: 100%;height: 2px;margin: 10px 0px 20px 0px; } .liveupplanframeR { width: 100%;font-size: 16px;line-height: 100%;margin: 20px 0px 20px 0px;border-left: none; } .liveupplanframeRspace { display: none; } .liveaddonframe { width: 80%;padding: 15px 0px 15px 0px; } .liveupul { padding-left: 20px; } .liveupli { font-size: 16px;padding-bottom: 6px; } .liveupinfo { font-size: 16px; } .liveupremark2 { font-size: 16px;margin-top: 10px;padding: 25px 15px;background-position: -330px;width: 96%; } .liveupremarktxt { font-size: 18px;width: 100%; } .liveupremarktxten { font-size: 16px;width: 100%; } .liveupplancoltxt { font-size: 14px; } .liveupplancoltxtbold { font-size: 18px; } .step5gcontainerpc { display: none; } .stepiframe { border:none;width: 100%;height: 280px;display: inline-block; } .step5gstepframe { width: 65%; } .step5gstepnextframe { width: 100%;margin-top: 10px; margin-bottom: 0px;transform: rotate(90deg); } .step5gstepnextimg { width: 30px; } .step5gimg { width: 180px; } .step5gtitle { font-size: 24px; } .step5gcontent { font-size: 16px;line-height: 120%; } .liveplanframe { width: 96%; } .hs5grow1 { padding: 12px 0px 12px 0px; } .tableoff5g { font-size: 16px; } .framehsmain2 {padding: 10px 0px;} .hsrow1databold { font-size: 36px; } .hsrow1databolden { font-size: 30px; } .hsrow2 { padding: 20px 0px; } .hsrow2pricebold1 { font-size: 30px; } .hsrow2pricebold2 { font-size: 28px; } .hsrow2pricebold2en { font-size: 24px; } .hsrow2pricebold3 { font-size: 26px; } .liveplandetailbut { font-size: 12px; } .liveplantxttopup { padding: 0px 0px 30px 0px;font-size: 18px; } .hsrow3txtframe { padding-bottom: 10px;} .comparecontainerframe { width: 96%;height: auto;display: inline-block; } .compframe01 { font-size: 14px;width: 50%;padding: 5px;margin: 0px 0px 0px 0px;border-radius: 5px;float: left; } .compframe02 { font-size: 14px;width: 50%;padding: 5px;margin: 0px 0px 0px 0px;border-radius: 5px;float: left; } .compplantitle { font-size: 16px; padding: 10px 0px 5px 0px; } .comptitleicon { width: 75px;vertical-align: -3px; } .comptdframe { padding: 0px 0px 10px 0px;width: 100%;margin-bottom: 0px; } .comptdexpframe { padding: 0px 0px 12px 0px;width: 100%;margin-bottom: 10px;height: 50px; } .comptdexpframe02 { padding: 0px 0px 10px 0px;width: 100%;margin-bottom: 5px;height: 90px; } .comptdexpframe03 { padding: 0px 0px 10px 0px;width: 100%;margin-bottom: 5px;height: 70px; } .comptdtitle01 { width: 100%;font-size: 14px; } .comptdcontent01 { font-size: 16px;font-weight: bold;width: 100%; } .comptdcontent01rmk { font-size: 20px;line-height: 120%; } .comptdtitle02 { font-style: italic;width: 100%; } .comptdcontent02 { font-size: 16px;font-weight: bold;width: 100%; } .comptdcontent02rmk { font-size: 20px;line-height: 120%; } .compplanexptitle01 { font-size: 18px; padding: 5px 0px 5px 0px;margin-bottom: 12px; } .compplanexptitle02 { font-size: 18px; padding: 5px 0px 5px 0px;margin-bottom: 12px; } .comptdbold01 { font-size: 140% } .comptdbold02 { font-size: 110% } .for24mth { width: 100%; } .comptdboxtitle { font-size: 16px;padding: 8px 0px; } .comptdboxremark { font-size: 12px; } .compboxbg01 {border-radius: 15px;margin: 5px 0px; } .compboxbg02 {border-radius: 15px;margin: 5px 0px; } .compfixprcbox01 { width: 92%; margin: 10px 0px 5px 0px;padding: 5px 0px;border-radius: 50px; } .compfixprcbox02 { width: 92%; margin: 10px 0px 5px 0px;padding: 5px 0px;border-radius: 50px; } .compplus { font-size: 20px;} .comptick { width: 30px;height: 30px;right: 5%; top: 18%; } .compticken { width: 30px;height: 30px;right: -5%; top: 18%; } .comptdheight01 { height: 80px; } .onairdesp { font-size: 16px;padding: 0px 0px 10px 0px;width: 90%; } .shopimg { width: 100%; margin: 5px 0px; } .faqElements {width: 90%;font-size: 20px;margin: 10px 0px;padding: 8px 15px; border-radius: 20px; } .faqanswer { margin-top: 10px;border-left: 3px solid #dbdbdb;padding: 0px 17px;font-size: 16px; } i { border-width: 0 3px 3px 0;padding: 5px;margin-top: 4px; } .p7planofferframe { padding: 10px;width: 90%; } .p7planoffercol1 { width: 100%;font-size: 20px;padding-bottom: 15px;text-align: center; } .p7planoffercol1en { width: 100%;font-size: 18px;padding-bottom: 15px;text-align: center; } .p7planoffercol2 { width: 50%; } .p7planoffercol2en { width: 50%; } .p7planoffercol3 { width: 30%; } .p7planoffercol3en { width: 30%; } .p7planoffercol4 { width: 100%;padding-top: 15px; } .p7planoffercolx { width: 15%; } .p7planoffercol2txt1 { font-size: 16px; } .p7planoffercol2txt1en { font-size: 14px; } .p7planoffercol2txt2space { padding: 21px 0px; } .p7planoffercol2txt2spaceen { padding: 12px 0px; } .p7planoffercol2txt2 { font-size: 32px; } .p7planoffercol2txt3 { font-size: 16px; } .p7planoffercol2txt4 { font-size: 14px; } .p7planoffercol2txt4en { font-size: 12px; } .p7planoffercol2icon { height: 70px;padding: 5px 0px; } .p7hsoffertitle { font-size: 20px;padding: 15px 0px 0px 0px;text-align: center; } .p7hsoffertitleen { font-size: 18px;padding: 15px 0px 0px 0px;text-align: center; } .p7phoneframe { width: 30%;height: 180px; } .p7phonetxt { font-size: 12px; } .p7offershadow { width: 60px;right: -3px; } .p7newscontainerframe { width: 98%; } .vas5gframe { width: 280px;height: 340px;margin: 0px 15px; } .vas5gframeen { width: 280px;height: 420px;margin: 0px 0px 0px 35px; } .vas5gimage { top:0px;left: -10px; width: 295px; } .vas5gdataframe { font-size: 14px;padding: 4px 15px 4px 10px } .vas5gdataframeen { font-size: 14px;padding: 4px 15px 4px 10px } .videonext { right: 2%;background-size: cover;width: 19px;height: 30px;} .videoback { left: 2%;background-size: cover;width: 19px;height: 30px; } .videonextvas { right: 0%;background-size: cover;width: 19px;height: 30px;display: inline-block; } .videobackvas { left: 0%;background-size: cover;width: 19px;height: 30px;display: inline-block; } .videonextphone { right: 2%;background-size: cover;width: 19px;height: 30px;} .videobackphone { left: 2%;background-size: cover;width: 19px;height: 30px; } .vas5gworldofvicon { width: 240px; padding: 5px; } .p9sliderframe { width: 98%; } .phone5gframe { width: 83%;margin: 0px 0px 0px 30px; } .phone5gpdtname { height: auto; font-size: 16px;padding-left: 6px; } .livexptitle { font-size: 24px;padding: 10px 0px; } .livexptxt { font-size: 16px;line-height: 120%; } .specpdtframebb { width: 40%;height: auto;padding-bottom: 20px; } .specpdtframe { width: 46%;height: auto;float: none;padding-bottom: 20px;vertical-align: bottom;margin-bottom: 20px;padding-bottom: 0px; } .specpdtframewifi { width: 88%;height: auto;float: none;padding: 15px 0px 15px 0px;margin-bottom: 30px; } .specpdtframe02 { width: 100%;height: auto;float: none;display: inline-block;background-color: #fff; } .specpdtframe03 { display: none; } .specpdtimg { width: 80%; } .spectxtframe { width: 100%;height: auto;float: none; } .specpdtimgwifi { width: 76%; } .specpdtimgwifi2 { width: 76%; } .specspace { display: none; } .speccontent { width: 99%;padding: 20px; } .speccontenttxt1 { font-size: 16px; } .speccontenttxt2 { font-size: 14px; } .speccontenttitlebb { font-size: 16px;padding-bottom: 10px; } .speccontenttitle { font-size: 16px;padding-bottom: 10px; } .specul { padding-left: 20px; } .specli { font-size: 16px;padding-bottom: 10px; } .specoffertxt { font-size: 16px; } /************************************************************************************ moplus *************************************************************************************/ .topmsg { font-size: 16px;padding: 7px 0px; } .poplimited { left: 31%; } .moplandatabg01 { height: 220px; } .moplandatabg02 { height: 220px; } .moplandatabg03 { height: 220px; } .olul li { font-size: 12px; } .languagetxt { margin-top: 16px; } .moplanlogo1 { height: 22px;vertical-align: -7px;margin-right: 10px; } .moplanlogo2 { height: 20px;vertical-align: -8px;margin-right: 10px; } .moplanlogo3 { height: 30px;vertical-align: -12px; } .moplansubtitleicon { height: 24px;vertical-align: -3px; } .moplantitleunderlinetxt { border-bottom: #f15a29 7px solid; } .moremarkdesp { font-size: 16px; } .mologo { height: 36px; width: auto; } .momainframe1 { margin: 0px 0px; } .momainframe2 { margin: 0px 0px; } .momainframe3 { margin: 0px 0px; } .momainframe4 { margin: 0px 0px; } .moplanframe { width: 97%;height: 460px; } .moplanframe2 { width: 97%;height: 305px; } .moplanframeen { width: 97%;height: 425px; } .moplanframe2en { width: 97%;height: 360px; } .moplantitle { padding: 10px 0px 10px 0px; } .moprice { font-size: 64px; } .mopricesup { vertical-align: 40px; } .modatagb2 { width: 75%; } .modatagb2en { width: 75%; } .modata { font-size: 26px; } .modataen { font-size: 26px;width: 100%; } .modata2 { font-size: 26px;padding: 20px 0px 0px 0px; } .modata3 { font-size: 26px;padding: 20px 0px 0px 0px;width: 75%; } .modata3en { font-size: 26px;padding: 20px 0px 0px 0px;width: 75%; } .modata2en { font-size: 25px;padding: 15px 0px 0px 0px; } .moplantxt { font-size: 14px; } .moplantxtbold { padding: 10px 0px 10px 0px; } .moplantxtbold2 { padding: 10px 0px 10px 0px;width: 75%; } .modog { width: 88px; } .moplangifttxt { width: 55%; } .moplanwhyiconframe { width: 90%;margin: 0px 0px; } .moplanwhytxt { font-size: 22px; } .moplanapplytxt { font-size: 22px; } .moplanapplyno { font-size: 30px;width: 50px;height: 50px; } .moplanapplyimg { height: 170px; } .tab button { padding: 15px 0px; font-size: 22px; } .tabbuttonen { font-size: 14px !important; } .tabmologoimag { height: 20px; } .tabmologoimag2 { height: 20px; } .moplanapplyframe { width: 90%; } .nav-link.no-drop { padding: 20px 0px 20px 0px; text-align: center; font-size: 20px; line-height: 100%; } .plantablewidthall { width: 1200px; } .plantablescroll { width: 100%; overflow: scroll;-webkit-overflow-scrolling:touch;scroll-snap-type: x mandatory;padding-top: 10px;padding-bottom: 20px; } .planarrowframe { position: relative; } .planarrowleftframe { width: auto;display: inline-block;left: 10px; top: 50% ;z-index: 9999;position:absolute; -webkit-animation:aleft 0.5s linear infinite alternate; -moz-animation: aleft 0.5s linear infinite alternate; -ms-animation: aleft 0.5s linear infinite alternate; -o-animation: aleft 0.5s linear infinite alternate; animation: aleft 0.5s linear infinite alternate; } @-webkit-keyframes aleft { from { left:10px; top:50%;} to { left:0px; top:50%;} } @-moz-keyframes aleft { from { left:10px; top:50%;} to { left:0px; top:50%;} } @-ms-keyframes aleft { from { left:10px; top:50%;} to { left:0px; top:50%;} } @-o-keyframes aleft { from { left:10px; top:50%;} to { left:0px; top:50%;} } @keyframes aleft { from { left:10px; top:50%;} to { left:0px; top:50%;} } .planarrowrightframe { width: auto;display: inline-block;right: 10px; top: 50%;z-index: 9999;position: absolute; -webkit-animation:aright 0.5s linear infinite alternate; -moz-animation: aright 0.5s linear infinite alternate; -ms-animation: aright 0.5s linear infinite alternate; -o-animation: aright 0.5s linear infinite alternate; animation: aright 0.5s linear infinite alternate; } @-webkit-keyframes aright { from { right:10px; top:50%;} to { right:0px; top:50%;} } @-moz-keyframes aright { from { right:10px; top:50%;} to { right:0px; top:50%;} } @-ms-keyframes aright { from { right:10px; top:50%;} to { right:0px; top:50%;} } @-o-keyframes aright { from { right:10px; top:50%;} to { right:0px; top:50%;} } @keyframes aright { from { right:10px; top:50%;} to { right:0px; top:50%;} } .planarrow { width: auto;height: 35px;opacity: 0.12; } .newstablescroll { width: 100%; overflow: scroll;-webkit-overflow-scrolling:touch;scroll-snap-type: x mandatory;padding-top: 10px;padding-bottom: 10px; } .monewsframe { width: 46%; } .monewscontenttitle { font-size: 20px; } .monewscontenttxt { font-size: 14px; } .monewsbut { font-size: 16px;padding: 15px 40px; } .monewscontentref { font-size: 12px; } .newstablewidthall { width: 740px; } .moplan3reesection { padding: 30px 30px 0px 30px; } .moplan3reesectionwidth { width: 100%;height: 530px;padding: 0px 0px 0px 0px; } .moplan3reetitle { font-size: 26px;padding-top: 20px;padding-bottom: 20px; } .moplan3reecontent { font-size: 16px;width: 100%; } .mofootersocialsection { padding: 30px 30px; } .mofootersocialsectionwidth { width: 100%;padding: 0px 0px 0px 0px; } .mofootersocialsectionL { width: 80%; } .mofootersocialsectionR { width: 80%;text-align: left;float: none; } .mofootersocialtxtlink { font-size: 14px;margin-bottom: 30px; } .mofootersocialicon { margin: 20px 10px; } .mofootersocialiconimg { height: 55px; } .mofootertncsection { padding: 15px 30px; } .mofootertncsectionwidth { width: 100%;padding: 0px 0px 0px 0px; } .mofootertncsectionL { width: 100%; } .mofootertncsectionR { width: 100%;text-align: left;float: none; } .mofootertnctxtlink { padding-bottom: 15px; } .moplandata { font-size: 50px;margin-top: 25px; } .moplandata2 { font-size: 40px;margin-top: 60px; } .moplandatatxt { font-size: 18px; } .modata { font-size: 26px; } /************************************************************************************ solution new *************************************************************************************/ .coltablewidth { width: 97%; } .frametitle { padding: 0px 0px 20px 0px; } .framehsprice { width: 100%; } .framehsoffer { width: 100%; } .mainpagepromocol3photomob { display: inline; } .mainpagepromocol3 { width: 98.2%;height: auto;margin-bottom: 25px; } .mainpagepromosupport { width: 98%;margin-bottom: 25px; } .col3L { float: none; } .col3R { float: none; } .mainpagepromocol3photo { width: 100%;height: auto;line-height: 0%;height: 215px; } .mainpagepromocol3.mainslidertxt1 photomob { display: inline; } .boxsmallnopad { padding: 0px 4px 0px 4px; } .frametitle { padding: 0px 0px 20px 0px; } .mainpagetitle { font-size: 1.8em;line-height: 140%; width: 100%; } /************************************************************************************ topnav *************************************************************************************/ .topnavframe { width: 900px;font-size: 14px; } .topnavbutoff { padding: 12px 18px; } .topnavbuton { padding: 12px 18px; } .slider { scroll-snap-type: mandatory; scroll-snap-points-y: repeat(20vw); scroll-snap-type: x mandatory; display: flex; overflow-x: scroll; font-size: 14px; -webkit-overflow-scrolling:touch; } section { padding: 12px 18px; width: auto; scroll-snap-align: center; text-align: center; position: relative; white-space: nowrap; -webkit-overflow-scrolling:touch; } /* ========================================================================== solution ========================================================================== */ .solframe { text-align: center; } .solstepimg { width: 80%; } .solsteparrow { width: 80%; text-align: center; padding-top: 0px; } .solsteparrowrotate { transform: rotate(90deg); } .solcctv { width: 100%; } /**** form ****/ .formsubmit { font-size: 17px;padding: 5px 10px; } .formreset { font-size: 17px;padding: 5px 10px; } .newsletterinputtxt { font-size: 14px; width: 45%; } .newslettersubmit { font-size: 16px;padding: 5px 20px; } /**** form ****/ .section { padding: 40px 10px; } .detailbut { width: 100% } .evppl { width: 48%; padding-bottom: 40px; font-size: 15px; } .ev6logoframe {display: inline-block; width: 48%;text-align: center; padding-bottom: 40px; font-size: 18px; vertical-align: top; } .ev6logo { width: 120px; } .ev6tabletime { width: 50% } .ev6tabletimeen { width: 40% } .ev6td { font-size: 16px } .ev6tden { font-size: 14px } .ev6name { width: 100%; } .ev6nametitle { width: 100%; padding-left: 25px; padding-top: 0px; padding-bottom: 20px; } .ev6nametc { width: 100%; } .ev6nametitletc { width: 100%; padding-left: 27px; padding-top: 0px; padding-bottom: 20px; } .ev6comname { width: 40%; } .ev6comcontent { width: 60%; } .tablewidth { width: 100% } .tablewidthev { width: 100% } .tablewidthplan { width: 580px } .eventtablewidthplan { width: 100% } .tmpeventtable { font-size:14px; } .tmptable { font-size:14px; } .tmptableadd { font-size:14px; } .stepframe { width: 49%; padding-bottom: 30px; font-size: 12px; } .smehsbanner { width: 100%; padding: 0px 0px 20px 0px; } .awplanbutover { width: 96%; margin: 0px 0px 10px 0px } .awplanbut { width: 96%; margin: 0px 0px 10px 0px } .homeframe1 { width: 100%; } .photocol2homeframe { width: 100%; height: 260px; border: 0px solid #fff; } .homeframe2 { width: 100%; } .photocol1homeframe { width: 100%; height: 800px; border: 0px solid #fff; } .photocol1frame { width: 100%; height: 260px; border: 0px solid #fff; margin-top: 0px; } .photocol1 { font-size: 30px; line-height: 85%; width: 100%; height: 260px; padding-top: 20px; background-size: cover; background-position: -770px 0px; } .photocol2frame { width: 100%; height: 380px; border: 0px solid #fff; } .photocol2 { font-size: 30px; line-height: 85%; width: 100%; height: 380px; padding-top: 20px; } .photocol3frame { width: 100%; height: 260px; border: 0px solid #fff; } .photocol3 { font-size: 30px; line-height: 85%; width: 100%; height: 260px; padding-top: 20px; } .photodes { font-size: 15px; line-height: 16px; text-transform: none;} .contactuspopup { bottom: 60px; padding-right: 10px; } .contactuspopupicon { padding-top: 12px; padding-right: 18px; width: 50px; height: 50px; } .contactusformframe { width: 96%;margin-bottom: 50px; } .contactusformtable { width: 100%; } .top-margin.more.add { margin-top: 10px; } .biger { font-size: 34px; line-height: 45px; } .anametop { top: -50px; } .pageheader { padding: 30px 10px 60px 10px; } .bgaboutus { background-size: cover; background-position: center top; } .abpart1photoarea { width: 100%; text-align: center; padding-top: 20px; } .abpart1txtarea { width: 100%; } .abpart1photo { width: 100% } .bgsme { background-size: cover; background-position: center top; } .bgsolution { background-size: cover; background-position: center top; } .bgworld { background-size: cover; background-position: center top; } .part1txtarea { width: 100%; padding-bottom: 0px; } .part1photoarea { width: 100%; text-align: center; padding-bottom: 80px; } .part1photosize { width: 100%; } .bgpns { background-size: cover; background-position: center top; } .meetrm { width: 100%; } .bgevent { background-size: cover; background-position: center top; } .bgcontactus { background-size: cover; background-position: center top; } .contactusframe { width: 100%; padding-bottom: 70px } .titlekeyf { font-size: 16px; } .keypoint { font-size: 16px; } .bgsection2 { background-size: cover; } .bgsection3 { background-size: cover; } .videotitle { font-size: 18px; } .videotitletxt { font-size: 14px; } .displaypc { display: none } .displaymob { display: block } .headingland { font-size: 30px; line-height: 40px; } .headinglandsub { font-size: 26px; } .logo { width: auto; height: 50px; padding-bottom: 5px } #topheight {clear: both;height: 52px} .bgsectionsme { background-image: url(../images/sme-offerbg-mob.jpg); background-position: center top; background-size: cover; } .smesubtitle { font-size: 26px; line-height: 32px; } .paragraph { font-size: 15px; line-height: 24px; } .service-style-4 { height: auto; } .heading-1 { font-size: 32px; } .titledes { color: #464646; font-size: 16px; line-height: 30px; } .slide-1 { background-image: url("../images/mainslider-mob.jpg"); background-size: cover; } .banner.with-slider { height: 500px; } .banner.style-3 { height: 400px; } .section.no-bottom-margin { padding-bottom: 80px; } .heading-1.white.biger { font-size: 30px; } .div-block { margin-bottom: 20px; } .tab-testi { top: auto; } .testi-photo { display: inline-block; } .testi-wrapper { width: 100%; } .subscribe-wrapper { width: 100%; } .sub-field { width: 60%; } .submit-button { width: 40%; } .blog-image { width: 100%; margin-right: 0px; margin-bottom: 20px; float: none; } .biger.more { font-size: 40px; line-height: 50px; } #pagefooter { height: 120px; } }