@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline }
html { line-height: 1 }
ol, ul { list-style: none }
table { border-collapse: collapse; border-spacing: 0 }
caption, th, td { text-align: left; font-weight: normal; vertical-align: middle }
q, blockquote { quotes: none }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none }
a img { border: none }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block }
body { font-family: "微軟正黑體", "Microsoft JhengHei", "Segoe UI Semibold", "Segoe UI", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; width: 100%; font-size: 16px; line-height: 27px; color: #333333 }
@media screen and (-webkit-min-device-pixel-ratio: 0) {
body { font-family: "微軟正黑體", "Microsoft JhengHei", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; font-weight: normal }
}
.header { position: absolute; left: 50px }
.win8text { display: inline-block; }
h1 { font-size: 55px; line-height: 60px; color: #000000 }
h2 { font-size: 16px; color: #000000; font-weight: bold; margin-top: 10px; margin-bottom: 15px; display: none }
h3 { font-size: 21px; color: #fff; margin-bottom: 15px; display: block }
h4 { font-size: 24px; color: #fff; padding-top: 30px; display: block }
a { text-decoration: none; cursor: pointer }
.article { padding-top: 15px; padding-bottom: 15px; display: block; clear: both }
.article2 { clear: both; padding-bottom: 15px }
.article2 span { display: block; font-weight: bold; color: #000000 }
.article3 { width: 700px; font-size: 21px; line-height: 32px;  float: left }
.tiptext { color: #f42e2f; padding: 10px 0 10px 0; }
.BtnMore { margin-left: 20px; height: 25px; width: 90px; font-size: 15px; line-height: 27px; font-weight: bold; background-repeat: no-repeat; background-position: right bottom; cursor: pointer; display: inline-block; vertical-align: middle }
.Btn, .Btn1, .Btn2, .Btn3, .Btn4, .Btn5, .Btn6, .Btn7, .Btn8 { margin: 3px; width: 135px; height: 135px; color: #fff; cursor: pointer; float: left }
.Btn .Box, .Btn1 .Box, .Btn2 .Box, .Btn3 .Box, .Btn4 .Box, .Btn5 .Box, .Btn6 .Box, .Btn7 .Box, .Btn8 .Box { width: 100%; height: 100%; padding-top: 10px; padding-left: 10px; font-size: 16px; line-height: 27px }
.BtnPic { margin: 3px; float: left }
.Btn1 { background-color: #00aeef; }
.Btn2 { background-color: #22ac38; }
.Btn3 { background-color: #ff8a00; }
.Btn4 { background-color: #910091; }
.Btn5 { background-color: #9f0710; }
.Btn6 { background-color: #20489e; }
.Btn7 { background-color: #7f7f7f; }
.Btn8 { background-color: #079f84; }
.LightBox { position: fixed; z-index: 200; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); *filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000, endColorstr=#CC000000);
display: table }
.LightBox div * { vertical-align: middle }
.ImageFrame { width: 100%; height: 100%; display: table-cell; text-align: center; vertical-align: middle }
.ImageFrame img { margin: auto }
.ImageFrame span { height: 100%; display: inline-block }
.AgendaFrame { width: 700px; height: 600px; top: 50%; left: 50%; margin: -300px 0 0 -350px; position: fixed }
.AgendaLink { font-size: 15px; display: inline-block; margin-left: 40px; cursor: pointer; text-decoration: underline }
.AgendaLink img { margin-left: 3px; margin-top: 1px }
.AgendaBtnBlock { position: fixed; width: 140px; height: 140px; top: 50%; left: 50%; margin: -70px 0 0 360px }
.AgendaBtnBlock .JoinBtn, .AgendaBtnBlock .JoinBtn2 { float: none; background-color: #00aeef }
.AgendaTC { color: #fff; font-size: 18px; float: left; margin: 2px }
.AgendaTR { width: 20px; height: 230px; background-repeat: no-repeat; background-position: center center; float: left }
.AgendaTD, .AgendaTD2, .AgendaTD2Index, .AgendaTD3, .AgendaTD4, .AgendaTDIndex { padding: 10px; margin: 2px 0 2px 0 }
.AgendaTD2, .AgendaTD2Index { min-height: 170px; height: auto; min-width: 120px; width: auto }
.AgendaTD3 { min-height: 170px; height: auto; min-width: 145px; width: auto }
.CWTC { color: #fff; font-size: 18px; float: left; margin: 2px }
.CWTD1 { height: 50px; text-align: center; margin: 3px; background-color: #00aeef; width: 200px; line-height: 40px }
.CWTD2 { color: #00aeef; padding: 0px; margin: 0px }
.CWTD3 { font-size: 14px; height: 80px; color: #000000; padding: 0px; margin: 0px }
.CWTD4 { padding: 0px; margin: 0px }
.PartTC { color: #fff; font-size: 18px; float: left; margin: 0 15px 20px 0 }
.PartTD2 { width: 130px; float: left }
.PartTD3 { width: 300px; float: left }
.PosTC { color: #fff; font-size: 18px; margin: 2px }
.PosTD { margin: 3px; padding: 0px; height: 250px; width: 335px; float: left }
.PosTD img { width: 335px }
.PosTD2 { margin: 3px; padding: 10px; min-height: 250px; height: auto; width: 460px; font-size: 15px; float: left; background-color: #ff8a00 }
.PosTD2 span { font-weight: bold }
.EvaTC { color: #fff; font-size: 18px; float: left; margin: 2px }
.EvaTD { margin: 3px; padding: 0px; height: 280px; width: 280px; float: left }
.EvaTD img { width: 280px }
.EvaTD2 { margin: 3px; width: 500px; font-size: 15px; min-height: 280px; height: auto; padding: 0; float: left }
.EvaText1 { font-size: 22px; color: #fff; line-height: 40px; margin: 0 10px }
.EvaText2 { margin: 15px 10px 0 10px; color: #fff }
.EvaText3 { font-size: 13px; color: #fff; text-align: right; margin: 10px; display: block }
.Text1 { clear: both }
.Text2 { padding-top: 5px; padding-left: 10px; padding-right: 10px; font-size: 15px; float: left }
.Text3 { padding-top: 5px; padding-left: 10px; padding-right: 10px; font-size: 15px }
.Text4 { padding-top: 5px; padding-left: 10px; padding-right: 10px; font-size: 13px; line-height: 21px; float: left }
.Cups { clear: both; width: 650px; height: 100px; background-repeat: no-repeat; background-position: center center; background-image: url(../images/cups.png) }
.Cups .CupText { height: 80px; padding-left: 90px; padding-top: 25px; clear: botn; color: #fff; display: block }
.Cups .CupText span { font-size: 13px; color: #fee900; }
.CieLogo { position: absolute; z-index: 30; width: 287px; height: 45px; background: url(../images/MS_Logo.png) no-repeat 0 0; }
#navPC { display: block; }
#navMobile { display: none; }
#sideList { position: fixed; width: 280px; right: -250px; top: 50%; margin: -150px 0 0 0; display: block; z-index: 9998; background: #159aa6; transition: right 0.3s ease-in; -webkit-transition: right 0.3s ease-in; }
#sideList:hover { right: 0px; }
#sideList > ul { position: relative; left: 10px; margin: 10px 0 10px 0; }
#sideList > ul > li { position: relative; font-size: 15px; line-height: 30px; color: #fff; height: 30px; padding: 0 0 0 25px; background: url(../images/side_dot.png) no-repeat 0 center; cursor: pointer; }
#sideList > ul > .current { background: url(../images/side_dot_over.png) no-repeat 0 center; }
#sideList > ul > li:hover { color: #3e4b7e; }
.nav { position: relative; width: 100%; height: 100px; background: #fff; z-index: 9999; }
.nav-fixed { position: fixed; top: -70px; width: 100%; height: 100px; background: #fff; z-index: 9999; }
.navBox { position: absolute; top: 0; left: 50%; width: 1000px; height: 100%; margin: 0 0 0 -500px; }
.navBox > .CieLogo { top: 15px; left: 0; }
.navBox > ul { position: absolute; top: 80px; display: block; }
.navBox > ul > li { position: relative; font-size: 16px; line-height: 16px; color: #000; cursor: pointer; float: left; margin: 0 50px 0 0; padding: 0 0 0 15px; display: block; }
.navBox > ul > li:hover { color: #ea4124; }
.navBox > ul > .arrow-down { background: url(../images/nav_arrow.png) no-repeat 0 center; }
.navBox > ul > .arrow-up { background: url(../images/nav_arrow_up.png) no-repeat 0 center; }
.navborder1 { position: absolute; top: 100%; width: 100%; height: 10px; background: url(../images/nav_border1.png) repeat-x 0 0; }
#cieList { position: absolute; top: 105px; width: 100%; height: 225px; background: #e8e8e8; display: none; }
.cieListBox { position: absolute; top: 20px; left: 50%; width: 1000px; margin: 0 0 0 -500px; }
.cieListBox > ul { position: relative; width: 330px; display: block; float: left; }
.cieListBox > ul > li { color: #159aa6; display: block; cursor: pointer; }
.cieListBox > ul > li:hover { color: #ea4124; }
.cieListBox > ul > .cieClass { color: #000; cursor: auto; }
.cieListBox > ul > .cieClass:hover { color: #000; }
.navborder2 { position: absolute; top: 100%; width: 100%; height: 10px; background: url(../images/nav_border2.png) repeat-x 0 0; }
#NavBottom { display: block }
#NavTopMobile { display: none }
#NavBottomMobile { display: none }
.MobileMenu { z-index: 101; position: fixed; width: 100%; height: 40px; color: #fff; background-color: #282828; top: 0; text-align: right; font-size: 16px; font-weight: bold; display: none }
.MobileMenu span { padding-right: 10px; padding-top: 3px; display: block }
.ReturnBlock { position: absolute; left: -60px; top: -5px; hight: 70px; width: 50px; text-align: center; float: left }
.ReturnBtn { height: 70px; width: 50px; background-repeat: no-repeat; background-position: center bottom; display: block; cursor: pointer }
.PrevBlock { position: absolute; z-index: 71; width: 85px; height: 85px; margin: -40px 0px 0px -580px; top: 50%; left: 50% }
.PrevBtn, .NextBtn { height: 85px; width: 85px; background-repeat: no-repeat; background-position: center top; cursor: pointer; display: block }
.NextBlock { position: absolute; z-index: 72; width: 85px; height: 85px; margin: -40px 0px 0px 512px; top: 50%; left: 50% }
.JoinBlock { position: absolute; z-index: 73; width: 135px; height: 135px; margin: -67px 0px 0px 500px; top: 50%; left: 50% }
.JoinBtn, .JoinBtn2 { margin: 3px; width: 135px; height: 135px; float: left; cursor: pointer }
.JoinBtn .Box, .JoinBtn2 .Box { padding-top: 10px; padding-left: 10px; font-size: 16px; line-height: 27px; color: #fff }
.JoinBtn2 { float: right }
.Dot { position: absolute; z-index: 80; bottom: 5%; width: 100%; text-align: center }
.Dot .BtnOut { background-repeat: no-repeat; background-position: center top; background-image: url(../images/Dot_Out.png); width: 20px; height: 15px; display: inline-block; cursor: pointer }
.Dot .BtnOver { background-repeat: no-repeat; background-position: center top; width: 20px; height: 15px; display: inline-block; cursor: pointer }
#MainPage { position: relative; margin: 0 auto; width: 100%; height: auto; overflow-y: hidden }
#MainPage .section { z-index: 10; height: 700px; overflow: hidden; position: relative; width: 100% }
#MainPage .section .PagetTot { position: relative; height: 100%; width: 100% }
#MainPage .section .PageGroup { position: relative; height: 700px; width: 100% }
#MainPage .section .PageClip { position: relative; height: 700px; width: 100%; overflow: hidden; z-index: 10 }
#MainPage .section .PageFrame { height: 700px; float: left; width: 100%; background-repeat: no-repeat; background-position: center center }
#MainPage .section .PageContent { height: 550px; position: relative; max-width: 990px; *width:990px !important;
margin: 100px auto 50px auto }
#MainPage .section .PageContent .ClipMiddle { position: absolute; top: 140px; left: 50px }
#MainPage .section .PageContent .ClipBottom { position: absolute; bottom: 20px; left: 50px }
#MainPage .section .PageContent .Btn, #MainPage .section .PageContent .Btn1, #MainPage .section .PageContent .Btn2, #MainPage .section .PageContent .Btn3, #MainPage .section .PageContent .Btn4 { vertical-align: middle }
#MainPage .section .PageContent .Btn .Box, #MainPage .section .PageContent .Btn1 .Box, #MainPage .section .PageContent .Btn2 .Box, #MainPage .section .PageContent .Btn3 .Box, #MainPage .section .PageContent .Btn4 .Box { width: auto; height: auto; padding-top: 10px; padding-left: 10px; font-size: 16px; line-height: 27px }
#MainPage #Intro { background-color: #ffffff }
#MainPage #Intro #IntroBg { background: url(../images/background1.jpg) no-repeat center 0; }
#MainPage #Intro #QuizBtn { position: absolute; left: 400px; top: 340px; width: 135px; height: 135px; background-color: #ff0097; cursor: pointer }
#MainPage #Intro #QuizBtn .Box { position: relative; height: 100%; padding-top: 10px; padding-left: 10px; font-size: 16px; line-height: 24px; color: #fff }
#MainPage #Intro #QuizBtn .Box #StartIcon { position: absolute; font-size: 21px; line-height: 27px; bottom: 15px; right: 10px }
#MainPage #Intro #IndexHeader { top: -20px; left: 0px; width: 550px; }
#MainPage #Quiz { background-color: #222222 }
#MainPage #Quiz #QuizClip1 { width: 2000% }
#MainPage #Quiz #QuizClip1 .PageFrame { width: 5% }
#MainPage #Quiz h1 { color: #ff0097 }
#MainPage #Quiz .IconQ { color: #fff; font-size: 72px; line-height: 72px; height: 120px; float: left; margin-right: 20px; display: block; }
#MainPage #Quiz .TextQ { font-size: 30px; line-height: 47px; color: #fff; margin-top: 10px; display: block; }
#MainPage #Quiz .Ans { width: 480px; height: 150px; clear: both; margin: 50px auto 0 auto }
#MainPage #Quiz .IconYes, #MainPage #Quiz .IconYesOver { background: url(../images/Icon_Yes.png) center top no-repeat; width: 150px; height: 150px; margin-right: 10px; cursor: pointer; float: left }
#MainPage #Quiz .IconYesOver { background: url(../images/Icon_Yes_over.png) center top no-repeat }
#MainPage #Quiz .IconNo, #MainPage #Quiz .IconNoOver { background: url(../images/Icon_No.png) center top no-repeat; width: 150px; height: 150px; margin-right: 10px; cursor: pointer; float: left }
#MainPage #Quiz .IconNoOver { background: url(../images/Icon_No_over.png) center top no-repeat }
#MainPage #Quiz .IconOR, #MainPage #Quiz .IconOROver { background: url(../images/Icon_OR.png) center top no-repeat; width: 150px; height: 150px; margin-right: 10px; cursor: pointer; float: left }
#MainPage #Quiz .IconOROver { background: url(../images/Icon_OR_over.png) center top no-repeat }
#MainPage #Quiz .Dot .BtnOver { background-image: url(../images/Dot_Over2.png) }
#MainPage #Quiz .PrevBtn, #MainPage #Quiz .NextBtn { background-image: url(../images/Prev_Btn2.png) }
#MainPage #Quiz .NextBtn { background-image: url(../images/Next_Btn2.png) }
#MainPage #Quiz .ClipMiddle { top: 100px; width: 800px }
#MainPage #Quiz .ClipBottom { bottom: 250px; width: 800px }
#MainPage #CloudCie { background-color: #f8f8f8 }
#MainPage #CloudCie #CloudBg { background-image: url(../images/background3.jpg) }
#MainPage #CloudCie #CloudClip3 { width: 500% }
#MainPage #CloudCie #CloudClip3 .PageFrame { width: 20% }
#MainPage #CloudCie #CloudClip5 { width: 300% }
#MainPage #CloudCie #CloudClip5 .PageFrame { width: 33% }
#MainPage #CloudCie #CloudClip6 { width: 200% }
#MainPage #CloudCie #CloudClip6 .PageFrame { width: 50% }
#MainPage #CloudCie #CloudClip6 .ClipMiddle { top: 120px }
#MainPage #CloudCie #CloudClip7 { width: 200% }
#MainPage #CloudCie #CloudClip7 .PageFrame { width: 50% }
#MainPage #CloudCie #CloudClip7 .Text1 { color: #000000; font-size: 20px; padding: 0px; margin: 0px; font-weight: bold }
#MainPage #CloudCie #CloudClip7 .Text2 { color: #333333; font-size: 13px; line-height: 20px; padding: 0px; margin: 0px }
#MainPage #CloudCie h1 { color: #00aeef }
#MainPage #CloudCie h3 { color: #00aeef }
#MainPage #CloudCie h4 { color: #00aeef }
#MainPage #CloudCie #CloudHeaderIndex { left: 350px }
#MainPage #CloudCie #CloudHeaderIndex h2 { color: #fff; }
#MainPage #CloudCie #CloudHeaderIndex .article { color: #fff; }
#MainPage #CloudCie #CloudBtnIndex { width: 500px; left: 350px; }
#MainPage #CloudCie #BtnCell { width: 500px; min-height: 150px; display: block; }
#MainPage #CloudCie .BtnMore { background-image: url(../images/Icon_More3.jpg); color: #00aeef; }
#MainPage #CloudCie .AgendaTR { background-image: url(../images/Agenda_p3.png) }
#MainPage #CloudCie .AgendaTD, #MainPage #CloudCie .AgendaTD2, #MainPage #CloudCie .AgendaTD2Index, #MainPage #CloudCie .AgendaTD3, #MainPage #CloudCie .AgendaTD4, #MainPage #CloudCie .AgendaTDIndex { background-color: #00aeef }
#MainPage #CloudCie .AgendaTD4 { background-color: #00aeef }
#MainPage #CloudCie .AgendaTDIndex { background-color: #00baff }
#MainPage #CloudCie .AgendaTD2Index { background-color: #00baff }
#MainPage #CloudCie .Dot .BtnOver { background-image: url(../images/Dot_Over3.png) }
#MainPage #CloudCie .PrevBtn, #MainPage #CloudCie .NextBtn { background-image: url(../images/Prev_Btn3.png) }
#MainPage #CloudCie .NextBtn { background-image: url(../images/Next_Btn3.png) }
#MainPage #CloudCie .ReturnBtn { color: #00aeef; background-image: url(../images/Icon_Return3.png) }
#MainPage #CloudCie .JoinBtn, #MainPage #CloudCie .JoinBtn2 { background-color: #00aeef }
#MainPage #DeviceCie { background-color: #30bbe0 }
#MainPage #DeviceCie #DeviceBg { background-image: url(../images/background13.jpg) }
#MainPage #DeviceCie #DeviceClip3 { width: 200% }
#MainPage #DeviceCie #DeviceClip3 .PageFrame { width: 50% }
#MainPage #DeviceCie #DeviceClip3 .AgendaTD2, #MainPage #DeviceCie #DeviceClip3 .AgendaTD2Index { height: auto;overflow:hidden;min-height: 0px; }
#MainPage #DeviceCie h1 { color: #FFF }
#MainPage #DeviceCie h2 { color: #fff;display:block; }
#MainPage #DeviceCie h3 { color: #1d2088; line-height: 32px;font-weight:bold; }
#MainPage #DeviceCie h4 { color: #000 }
#MainPage #DeviceCie .JoinBtn, #MainPage #DeviceCie .JoinBtn2 { background-color: #8cc600 }
#MainPage #DeviceCie .article { color: #000 }
#MainPage #DeviceCie .article3 { color: #1d2088 }
#MainPage #DeviceCie #DeviceHeaderIndex { left: 360px }
#MainPage #DeviceCie #DeviceBtnIndex { left: 360px }
#MainPage #DeviceCie .BtnMore { background-image: url(../images/Icon_More7.jpg); color: #FFF }
#MainPage #DeviceCie  .ClipMiddle { position: absolute; top: 80px; left: 50px }
#MainPage #DeviceCie  .ClipMiddle2 {position: absolute;top: 80px;left: 50px;}
#MainPage #DeviceCie  .ClipMiddle2 .AgendaTC{width: 250px;}
#MainPage #DeviceCie  .AgendaTC .Text1{color: #ffff00;}
#MainPage #DeviceCie  .AgendaTC .Text1.TextSize1{font-size: 15px;}
#MainPage #DeviceCie  .ClipMiddle2 .AgendaTC .Text4{line-height: 24px;}
#MainPage #DeviceCie  .ClipMiddle2 .AgendaTC.bigSize{width: 336px;}
#MainPage #DeviceCie  .ClipMiddle2 .AgendaTC.bigSize .Text4{line-height: 19px;}
#MainPage #DeviceCie .AgendaTR { background-image: url(../images/Agenda_p9.png) }
#MainPage #DeviceCie .AgendaTD, #MainPage #DeviceCie .AgendaTD2, #MainPage #DeviceCie .AgendaTD2Index, #MainPage #DeviceCie .AgendaTD3, #MainPage #DeviceCie .AgendaTD4, #MainPage #DeviceCie .AgendaTDIndex { background-color: #22ac38;padding: 5px 10px 5px 10px; }
#MainPage #DeviceCie .AgendaTR {height: 360px;}
#MainPage #DeviceCie .AgendaTC{width: 419px;}
#MainPage #DeviceCie .AgendaTDIndex { background-color: #009944;height: 22px;padding: 8px; }
#MainPage #DeviceCie .Dot .BtnOver { background-image: url(../images/Dot_Over8.png) }
#MainPage #DeviceCie .PrevBtn, #MainPage #DeviceCie .NextBtn { background-image: url(../images/Prev_Btn8.png) }
#MainPage #DeviceCie .NextBtn { background-image: url(../images/Next_Btn8.png) }
#MainPage #DeviceCie .ReturnBtn { color: #fcee21; background-image: url(../images/Icon_Return9.png) }
#MainPage #DeviceCie .JoinBtn, #MainPage #DeviceCie .JoinBtn2 { background-color: #22ac38 }
#MainPage #DeviceCie .JoinBtn2 { background-color: #22ac38 }
#MainPage #DeviceCie #DeviceClip3 .AgendaTD2.height4{height:350px;}
#MainPage #DeviceCie #DeviceClip3 .AgendaTD2.height3{height:91px;}
#MainPage #DeviceCie #DeviceClip3 .AgendaTD2.height1{height:142px;}
#MainPage #DeviceCie #DeviceClip3 .AgendaTD2.height2{height:166px;}
#MainPage #DeviceCie .BtnMore {width: 90px;display: inline-block;margin: 9px 0 15px 25px;}
#MainPage #DeviceCie .NextBtn span,#MainPage #DeviceCie .PrevBtn span{color: #fcee21;font-size: 18px;position:absolute;bottom:-30px;left:6px;}
#MainPage #ModernOfficeCie { background-color: #ffffff; }
#MainPage #ModernOfficeCie .PageClip { height: 700px }
#MainPage #ModernOfficeCie #ModernBg { background-image: url(../images/background5.jpg) }
#MainPage #ModernOfficeCie #ModernOfficeClip4 { width: 500% }
#MainPage #ModernOfficeCie #ModernOfficeClip4 .PageFrame { width: 20% }
#MainPage #ModernOfficeCie #ModernOfficeClip5 { width: 500% }
#MainPage #ModernOfficeCie #ModernOfficeClip5 .PageFrame { width: 20% }
#MainPage #ModernOfficeCie #ModernOfficeClip6 { width: 500% }
#MainPage #ModernOfficeCie #ModernOfficeClip6 .PageFrame { width: 20% }
#MainPage #ModernOfficeCie #ModernOfficeClip8 { width: 500% }
#MainPage #ModernOfficeCie #ModernOfficeClip8 .PageFrame { width: 20% }
#MainPage #ModernOfficeCie #ModernOfficeClip9 { width: 200% }
#MainPage #ModernOfficeCie #ModernOfficeClip9 .PageFrame { width: 50% }
#MainPage #ModernOfficeCie #ModernOfficeClip10 { width: 200% }
#MainPage #ModernOfficeCie #ModernOfficeClip10 .PageFrame { width: 50% }
#MainPage #ModernOfficeCie #ModernOfficeClip11 { width: 200% }
#MainPage #ModernOfficeCie #ModernOfficeClip11 .PageFrame { width: 50% }
#MainPage #BiCie #BiClip3 { width: 200% }
#MainPage #BiCie #BiClip3 .PageFrame { width: 50% }
#MainPage #ModernOfficeCie h1 { color: #ff8a00 }
#MainPage #ModernOfficeCie h3 { color: #ff8a00; line-height: 32px }
#MainPage #ModernOfficeCie h4 { color: #ff8a00 }
#MainPage #ModernOfficeCie .article3 { color: #ff8a00 }
#MainPage #ModernOfficeCie #ModernOfficeHeaderIndex { left: 350px }
#MainPage #ModernOfficeCie #ModernOfficeBtnIndex { left: 350px }
#MainPage #ModernOfficeCie .BtnMore { background-image: url(../images/Icon_More5.jpg); color: #ff8a00 }
#MainPage #ModernOfficeCie .AgendaTD, #MainPage #ModernOfficeCie .AgendaTD2, #MainPage #ModernOfficeCie .AgendaTD2Index, #MainPage #ModernOfficeCie .AgendaTD3, #MainPage #ModernOfficeCie .AgendaTD4, #MainPage #ModernOfficeCie .AgendaTDIndex { background-color: #ff8a00 }
#MainPage #ModernOfficeCie .AgendaTDIndex { background-color: #ff8a00 }
#MainPage #ModernOfficeCie .AgendaTD2Index { background-color: #ff8a00 }
#MainPage #ModernOfficeCie .Dot .BtnOver { background-image: url(../images/Dot_Over5.png) }
#MainPage #ModernOfficeCie .PrevBtn, #MainPage #ModernOfficeCie .NextBtn { background-image: url(../images/Prev_Btn5.png) }
#MainPage #ModernOfficeCie .NextBtn { background-image: url(../images/Next_Btn5.png) }
#MainPage #ModernOfficeCie .ReturnBtn { color: #ff8a00; background-image: url(../images/Icon_Return5.png) }
#MainPage #ModernOfficeCie .JoinBtn, #MainPage #ModernOfficeCie .JoinBtn2 { background-color: #ff8a00 }
#MainPage #BiCie { background-color: #f5ffe1; }
#MainPage #BiCie #BiBg { background-image: url(../images/background9.jpg) }
#MainPage #BiCie #BiHeaderIndex { left: 350px }
#MainPage #BiCie #BiHeaderIndex h2 { color: #9f0710; }
#MainPage #BiCie #BiHeaderIndex .article { color: #000; }
#MainPage #BiCie #BiBtnIndex { left: 350px; }
#MainPage #BiCie #BtnCell { width: 500px; min-height: 150px; display: block; }
#MainPage #BiCie .BtnMore { background-image: url(../images/Icon_More6.jpg); color: #9f0710; width: 90px }
#MainPage #BiCie .AgendaTR { background-image: url(../images/Agenda_p6.png) }
#MainPage #BiCie .AgendaTD, #MainPage #BiCie .AgendaTD2, #MainPage #BiCie .AgendaTD2Index, #MainPage #BiCie .AgendaTD3, #MainPage #BiCie .AgendaTD4, #MainPage #BiCie .AgendaTDIndex { background-color: #9f0710; }
#MainPage #BiCie .AgendaTD { height: auto; padding: 5px 10px 0px 10px; font-size: 16px; background-color: #cc0000; }
#MainPage #BiCie .AgendaTD2 { height: auto; padding: 0px 10px 0px 10px; min-height: 40px; font-size: 16px; }
.smallt { display: block; font-size: 14px; }
#MainPage #BiCie .AgendaTDIndex { background-color: #9f0710; }
#MainPage #BiCie .AgendaTD2Index { background-color: #9f0710; }
#MainPage #BiCie h1 { color: #9f0710; }
#MainPage #BiCie h3 { color: #9f0710; }
#MainPage #BiCie h4 { color: #9f0710; }
#MainPage #BiCie .article3 { color: #9f0710; }
#MainPage #BiCie .Dot .BtnOver { background-image: url(../images/Dot_Over6.png) }
#MainPage #BiCie .PrevBtn { background-image: url(../images/Prev_Btn6.png) }
#MainPage #BiCie .NextBtn { background-image: url(../images/Next_Btn6.png) }
#MainPage #BiCie .ReturnBtn { color: #9f0710; background-image: url(../images/Icon_Return6.png) }
#MainPage #BiCie .JoinBtn, #MainPage #BiCie .JoinBtn2 { background-color: #9f0710 }
#MainPage .section #BiClip3 .PageContent .ClipMiddle { top: 100px; }
#MainPage #Windows8Cie { background-color: #ecefb2; }
#MainPage #Windows8Cie #Windows8Bg { background-image: url(../images/background10.jpg); background-position: center top; }
#MainPage #Windows8Cie #Windows8HeaderIndex { left: 350px }
#MainPage #Windows8Cie #Windows8HeaderIndex h2 { color: #20489e; }
#MainPage #Windows8Cie #Windows8HeaderIndex .article { color: #000; }
#MainPage #Windows8Cie #Windows8BtnIndex { left: 350px; }
#MainPage #Windows8Cie #BtnCell { width: 500px; min-height: 150px; display: block; }
#MainPage #Windows8Cie .BtnMore { background-image: url(../images/Icon_More7.jpg); color: #20489e; width: 90px; display: block; float: left; margin: 10px 0 15px 25px; }
#MainPage #Windows8Cie .AgendaTR { background-image: url(../images/Agenda_p7.png) }
#MainPage #Windows8Cie .AgendaTD, #MainPage #Windows8Cie .AgendaTD2, #MainPage #Windows8Cie .AgendaTD2Index, #MainPage #Windows8Cie .AgendaTD3, #MainPage #Windows8Cie .AgendaTD4, #MainPage #Windows8Cie .AgendaTDIndex { background-color: #20489e; }
#MainPage #PDWCie { background-color: #f9f9f9; }
#MainPage #PDWCie #PDWBg { background-image: url(../images/background11.jpg); background-position: center top; }
#MainPage #PDWCie #PDWHeaderIndex { left: 350px }
#MainPage #PDWCie #PDWHeaderIndex h2 { color: #7f7f7f; }
#MainPage #PDWCie #PDWHeaderIndex .article { color: #000; }
#MainPage #PDWCie #PDWBtnIndex { bottom: 90px; left: 850px; }
#MainPage #PDWCie #BtnCell { width: 500px; min-height: 150px; display: block; }
#MainPage #PDWCie .BtnMore { background-image: url(../images/Icon_More8.jpg); color: #7f7f7f; width: 90px; display: block; float: left; margin: 10px 0 15px 25px; }
#MainPage #PDWCie h1 { color: #7f7f7f; }
#MainPage #PDWCie .h2pos { display: block; float: left; }
#MainPage #PDWCie h2 { margin: 10px 0 15px 0; padding: 0px; line-height: 27px; color: #7f7f7f; display: block; }
#MainPage #PDWCie h3 { color: #7f7f7f; }
#MainPage #PDWCie h4 { color: #7f7f7f; }
#MainPage #PDWCie .article3 { color: #000; }
#MainPage #PDWCie .JoinBtn, #MainPage #PDWCie .JoinBtn2 { background-color: #7f7f7f; }
#MainPage #HybridCloudCie { background-color: #000; }
#MainPage #HybridCloudCie #HybridCloudBg { background-image: url(../images/background12.jpg); background-position: center top; }
#MainPage #HybridCloudCie #HybridCloudHeaderIndex { left: 350px; }
#MainPage #HybridCloudCie #HybridCloudHeaderIndex h2 { color: #079f84; }
#MainPage #HybridCloudCie #HybridCloudHeaderIndex .article { color: #fff; }
#MainPage #HybridCloudCie #HybridCloudBtnIndex { left: 350px; }
#MainPage #HybridCloudCie #BtnCell { width: 500px; min-height: 150px; display: block; }
#MainPage #HybridCloudCie .BtnMore { background-image: url(../images/Icon_More9.jpg); color: #079f84; width: 90px }
#MainPage #HybridCloudCie .AgendaTR { background-image: url(../images/Agenda_p8.png) }
#MainPage #HybridCloudCie .AgendaTD, #MainPage #HybridCloudCie .AgendaTD2, #MainPage #HybridCloudCie .AgendaTD2Index, #MainPage #HybridCloudCie .AgendaTD3, #MainPage #HybridCloudCie .AgendaTD4, #MainPage #HybridCloudCie .AgendaTDIndex { background-color: #057460; }
#MainPage #HybridCloudCie .AgendaTD { height: auto; padding: 5px 10px 0px 10px; font-size: 16px; background-color: #06987e; }
#MainPage #HybridCloudCie .AgendaTD2 { height: auto; padding: 0px 10px 0px 10px; min-height: 40px; font-size: 16px; }
#MainPage #HybridCloudCie .AgendaTDIndex { background-color: #079f84; }
#MainPage #HybridCloudCie .AgendaTD2Index { background-color: #079f84; }
#MainPage #HybridCloudCie h1 { color: #079f84; line-height: 55px; }
#MainPage #HybridCloudCie h2 { margin: 0; padding: 0px; line-height: 27px; color: #079f84; display: block; }
#MainPage #HybridCloudCie h3 { color: #079f84; }
#MainPage #HybridCloudCie h4 { color: #079f84; }
#MainPage #HybridCloudCie .article3 { color: #079f84; }
#MainPage #HybridCloudCie .Dot .BtnOver { background-image: url(../images/Dot_Over7.png) }
#MainPage #HybridCloudCie .PrevBtn { background-image: url(../images/Prev_Btn7.png) }
#MainPage #HybridCloudCie .NextBtn { background-image: url(../images/Next_Btn7.png) }
#MainPage #HybridCloudCie .ReturnBtn { color: #079f84; background-image: url(../images/Icon_Return8.png) }
#MainPage #HybridCloudCie .JoinBtn, #MainPage #HybridCloudCie .JoinBtn2 { background-color: #079f84; }
#MainPage #HybridCloudCie .JoinBtn .Box {
	position:absolute;
	width:100%;
	height:100%;
}

#MainPage #AzureCie {
	background-color:#63c5f1;
}
#MainPage #AzureCie #AzureBg {
	background-image:url(../images/background14.jpg);
	background-position:center top;
}
#MainPage #AzureCie #AzureHeaderIndex {
	left:230px
}
#MainPage #AzureCie #AzureHeaderIndex h2 {
	color:#2e3192;
}
#MainPage #AzureCie #AzureHeaderIndex .article {
	color:#fff;
}
#MainPage #AzureCie #AzureBtnIndex {
	bottom:90px;
	left:850px;
}
#MainPage #AzureCie #BtnCell {
	width:500px;
	min-height:150px;
	display:block;
}
#MainPage #AzureCie .BtnMore {
	background-image:url(../images/Icon_More10.jpg);
	color:#2e3192;
	width:90px;
	display:block;
	float:left;
	margin:10px 0 15px 25px;
}
#MainPage #AzureCie h1 {
	color:#2e3192;
}
#MainPage #AzureCie .h2pos {
	display:block;
	float:left;
}
#MainPage #AzureCie h2 {
	margin:10px 0 15px 0;
	padding:0px;
	line-height:27px;
	color:#2e3192;
	display:block;
}
#MainPage #AzureCie h3 {
	color:#2e3192;
}
#MainPage #AzureCie h4 {
	color:#2e3192;
}
#MainPage #AzureCie .article3 {
	color:#000;
}
#MainPage #AzureCie .JoinBtn, #MainPage #AzureCie .JoinBtn2 {
	background-color:#2e3192;
}


#MainPage #EvaIntro { background-color: #fafafa }
#MainPage #EvaIntro #IndexHeader { left: 400px }
#MainPage #EvaIntro #EvaIntroBg { background-image: url(../images/background6.jpg) }
#MainPage #EvaIntro #EvaBtnIndex { height: 85px; width: 85px; left: 600px; background-image: url(../images/Tip_Btn3.png); background-repeat: no-repeat; background-position: center center }
#MainPage #EvaIntro h1 { color: #00aeef }
#MainPage #EvaIntro h3 { color: #00aeef }
#MainPage #EvaIntro h4 { color: #00aeef }
#MainPage #CloudEva { background-color: #252525 }
#MainPage #CloudEva #CloudEvaClip1 { width: 500% }
#MainPage #CloudEva .JoinBtn { background-color: #00aeef }
#MainPage #CloudEva #CloudEvaClip1 .PageFrame { width: 20% }
#MainPage #CloudEva #CloudEvaClip1 h1 { color: #00aeef }
#MainPage #CloudEva #CloudEvaClip1 h2 { color: #fff }
#MainPage #CloudEva #CloudEvaClip1 .EvaTD2 { width: 800px; min-height: auto;/* background-color:#00aeef */
}
#MainPage #CloudEva #CloudEvaClip1 .EvaText2 { font-size: 38px; line-height: 52px; }
#MainPage #CloudEva #CloudEvaClip1 .EvaText3 { font-size: 16px; }
#MainPage #CloudEva #CloudEvaClip1 .EvaText2 span { font-family: "新細明體", Arial, Helvetica, sans-serif; }
#MainPage #CloudEva .Dot .BtnOver { background-image: url(../images/Dot_Over3.png) }
#MainPage #CloudEva .PrevBtn, #MainPage #CloudEva .NextBtn { background-image: url(../images/Prev_Btn3.png) }
#MainPage #CloudEva .NextBtn { background-image: url(../images/Next_Btn3.png) }
#MainPage #ModernEva { padding-bottom: 250px; height: 700px; background-color: #252525 }
#MainPage #ModernEva .PageClip { height: 700px }
#MainPage #ModernEva #ModernEvaClip1 { width: 300% }
#MainPage #ModernEva .JoinBtn { background-color: #ff8a00 }
#MainPage #ModernEva #ModernEvaClip1 .PageFrame { width: 33% }
#MainPage #ModernEva #ModernEvaClip1 .EvaTD2 { background-color: #ff8a00; }
#MainPage #ModernEva #ModernEvaClip1 h1 { color: #ff8a00 }
#MainPage #ModernEva #ModernEvaClip1 h2 { color: #fff }
#MainPage #ModernEva .Dot .BtnOver { background-image: url(../images/Dot_Over5.png) }
#MainPage #ModernEva .PrevBtn, #MainPage #ModernEva .NextBtn { background-image: url(../images/Prev_Btn5.png) }
#MainPage #ModernEva .NextBtn { background-image: url(../images/Next_Btn5.png) }
#MainPage #RegIntro { background-color: #f4f8fa; height: 500px; }
#MainPage #RegIntro #RegBg { background-image: url(../images/background7.jpg); height: 500px; }
#MainPage #RegIntro #RegBg .PageContent { height: 350px; }
#MainPage #RegIntro #IndexHeader { left: 400px }
#MainPage #RegIntro #IndexHeader .Text2 { text-indent: -15px }
#MainPage #RegIntro #RegBtnIndex { height: 85px; width: 85px; left: 60%; background-image: url(../images/Tip_Btn3.png); background-repeat: no-repeat; background-position: center center }
#MainPage #RegIntro h1 { color: #00aeef }
#MainPage #RegIntro h3 { color: #00aeef }
#MainPage #RegIntro h4 { color: #00aeef }
#MainPage #VideoIntro { background-color: #fefefe }
#MainPage #VideoIntro #IndexHeader { left: 400px }
#MainPage #VideoIntro #VideoIntroBg { background-image: url(../images/background8.jpg) }
#MainPage #VideoIntro #VideoBtnIndex { height: 85px; width: 85px; left: 600px; background-image: url(../images/Tip_Btn3.png); background-repeat: no-repeat; background-position: center center }
#MainPage #VideoIntro h1 { color: #00aeef }
#MainPage #VideoIntro h3 { color: #00aeef }
#MainPage #VideoIntro h4 { color: #00aeef }
#MainPage #VideoC1 { padding-bottom: 250px; height: 700px; background-color: #252525 }
#MainPage #VideoC1 .PageClip { height: 700px }
#MainPage #VideoC1 .ClipMiddle { top: 100px }
#MainPage #VideoC1 #VideoClip1 { width: 400% }
#MainPage #VideoC1 #VideoClip1 .PageFrame { width: 25% }
#MainPage #VideoC1 #VideoClip1 h1 { color: #00aeef }
#MainPage #VideoC1 #VideoClip1 h2 { color: #00aeef }
#MainPage #VideoC1 .Dot .BtnOver { background-image: url(../images/Dot_Over3.png) }
#MainPage #VideoC1 .PrevBtn, #MainPage #VideoC1 .NextBtn { background-image: url(../images/Prev_Btn3.png) }
#MainPage #VideoC1 .NextBtn { background-image: url(../images/Next_Btn3.png) }
#MainPage #VideoC1 .VideoSize { width: 711px; height: 400px }
.DateFrame, .DateFrame1, .DateFrame2, .DateFrame3, .DateFrame4 { font-size: 24px; line-height: 40px; color: #00aeef; letter-spacing: 2px }
.DateFrame1 { float: left; padding: 20px 0 }
.DateFrame1 input { height: 22px; width: 230px; border: none; margin-left: 8px; margin-right: 25px }
.DateFrame1 span { display: inline-block; text-align: right; width: 200px }
.DateFrame1 select { height: 22px }
.DateFrame2 { clear: both; padding: 20px 0 }
.DateFrame2 span { display: inline-block; text-align: right; width: 200px }
.DateFrame2 input { height: 22px; width: 22px; border: none; margin-left: 8px; margin-right: 10px }
.DateFrame2 li { color: #fff; display: inline-block; font-size: 18px }
.DateFrame2 select { height: 22px }
.DateFrame2 .Other { color: #fff; font-size: 18px }
.DateFrame2 .Other input { width: 200px }
.DateFrame3 { float: left; padding: 20px 0 }
.DateFrame3 input { height: 22px; width: 230px; border: none; margin-left: 8px; margin-right: 25px }
.DateFrame3 span { display: inline-block; text-align: left }
.DateFrame3 select { height: 22px }
.DateFrame4 { clear: both; padding: 20px 0 }
.DateFrame4 span { display: inline-block; text-align: right; width: 200px }
.DateFrame4 input { height: 22px; width: 22px; border: none; margin-left: 8px; margin-right: 10px }
.DateFrame4 li { color: #fff; font-size: 18px }
.DateFrame4 select { height: 22px }
.DateFrame4 .Other { color: #fff; font-size: 18px }
.DateFrame4 .Other input { width: 200px }
.PsText1 { color: #fdff60; font-size: 15px }
.NoteText1 { padding-top: 5px; color: #cacaca; font-size: 13px }
.privacy { font-size: 15px; letter-spacing: 1px; color: #FFFFFF; display: inline; float: left }
.privacy span { display: block; color: #fdff60 }
.privacy .PriText { width: 670px; display: block }
.privacy .CheckBox { width: 35px; height: 100px; float: left }
.privacy .CheckBox input { height: 22px; width: 22px; padding-top: 5px }
.CopyText { font-size: 15px; letter-spacing: 1px; color: #fdff60; width: 850px; display: block; padding-top: 15px; padding-bottom: 15px; clear: both }
.CopyText span { text-decoration: underline; cursor: pointer }
.CopyTextBox { position: fixed; z-index: 200; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); *filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000, endColorstr=#CC000000);
display: block }
.CopyTextContentBG { position: relative; height: 600px; width: 700px; background-color: #cccccc; top: 50%; left: 50%; margin: -300px 0 0 -350px }
.CopyTextContent { margin: 10px 20px 10px 20px; padding: 5px; display: block; clear: both; border: 1px solid #006699; background-color: #ffffff }
.CopyTextContent .CopyBtn { padding-left: 10px; float: right; background-color: #333333; width: 80px; height: 25px; color: #ffffff; font-size: 13px; cursor: pointer }
.CopyTextContent .CopyMail { display: inline }
.CopyTextContent .CopyTitle { display: inline }
.CopyClose { margin: 10px; float: right; background-color: #777777; width: 25px; height: 25px; text-indent: 8px; color: #ffffff; font-size: 13px; cursor: pointer }
.FormGroup { width: 100%; background-color: #252525; z-index: 10 }
.FormGroup .FormFrame { width: 80%; height: auto; max-width: 1024px; *width:1024px !important;
margin: 0 auto; padding: 20px auto }
.formPsText { color: #bbb; margin: 0 0 20px 0; }
.FormGroup .FormFrame .Myheader { padding: 15px 0 }
.FormGroup .FormFrame .Myheader h1 { color: #00aeef }
.FormGroup .Btn2 { margin: 0 15px; width: 135px; height: 135px }
.FormGroup .Btn2 .Box { padding: 0px; padding-top: 50px; font-size: 21px; line-height: 27px; text-align: center }
.NavBottom2, .NavBottom, .NavBottom3, .NavBottom5, .NavBottom6 { position: absolute; height: 50px; background-color: #555555; z-index: 100; width: 100%; top: 6350px; margin-top: -50px }
.NavBottom2 .NavBottomFrame, .NavBottom .NavBottomFrame, .NavBottom3 .NavBottomFrame, .NavBottom5 .NavBottomFrame, .NavBottom6 .NavBottomFrame { width: 100%; height: 100%; max-width: 1024px; *width:1024px !important;
margin: 0 auto }
.NavBottom { position: fixed; top: auto; bottom: 0% }
.NavBottom3 { top: 2250px }
.NavBottom5 { top: 1650px }
.NavBottom6 { top: 1650px; display: none }
.NavBottom4 { position: relative; height: 50px; background-color: #555555; z-index: 100; width: 100%; clear: both }
.NavBottom4 .NavBottomFrame { width: 100%; height: 100%; max-width: 1024px; *width:1024px !important;
margin: 0 auto }
.footer { position: relative; padding: 20px 0 0 0; background-color: #777777; width: 100% }
.footer .Pattern { position: relative; left: 50%; margin: 0 0 0 -512px; width: 1024px; }
.footer .Pattern .PtnPic { float: left }
.footer .Pattern .PtnPic2 { float: right }
.Copyright { color: #fff; padding-top: 10px; padding-bottom: 15px; font-size: 12px; text-align: left; clear: both; display: block; height: 40px; width: 100% }
.Copyright img { margin-right: 15px; float: right }
.Copyright span { display: block; width: 600px; float: left }
.Copyright a { color: #fff; text-decoration: none }
.Copyright a:hover { color: #EEEEEE; text-decoration: none }
#MobileCR { position: relative; display: none }
#regLightBox { position: fixed; height: 100%; width: 100%; z-index: 1000; display: none; }
#regLightBox_black { position: absolute; height: 100%; width: 100%; background-color: #000; opacity: 0.75; filter: alpha(opacity = 75); }
#regLightBox_text { position: absolute; top: 50%; left: 50%; height: 170px; width: 320px; margin: -85px 0 0 -160px; z-index: 2000; background-image: url(../images/reglightbox_bg.png); background-repeat: no-repeat; background-position: center center; }
#regLightBox_text span { position: absolute; display: block; top: 10px; margin: 30px; }
#regLightBox_closeBtn { position: absolute; bottom: 25px; left: 120px; height: 35px; width: 70px; background-image: url(../images/reglightbox_closebtn.png); background-repeat: no-repeat; background-position: 0px 0px; z-index: 3000; cursor: pointer; }
#regLightBox_closeBtn:hover { background-position: 0px -37px; }
#sendLightBox { position: fixed; height: 100%; width: 100%; z-index: 1000; display: none; }
#sendLightBox_black { position: absolute; height: 100%; width: 100%; background-color: #000; opacity: 0.75; filter: alpha(opacity = 75); }
#sendLightBox_text { position: absolute; top: 50%; left: 50%; height: 170px; width: 320px; margin: -85px 0 0 -160px; z-index: 2000; background-image: url(../images/reglightbox_bg.png); background-repeat: no-repeat; background-position: center center; }
#sendLightBox_text span { position: absolute; display: block; top: 65px; left: 90px; }
#sendBox { overflow: hidden; }
#sendingText { position: relative; font-size: 13px; padding: 0; background-color: #999; display: none; }
#sendingText span { position: absolute; top: 50px; left: 20px; }