﻿@charset "utf-8";

/********************************************************************************/
/* CSS RESET */
/********************************************************************************/
html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
}
:focus {
    outline: 0;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    font-weight: normal;
    text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}
sup {
    position: relative;
    bottom: 0.3em;
    vertical-align: baseline;
}
sub {
    position: relative;
    bottom: -0.2em;
    vertical-align: baseline;
}
/********************************************************************************/
/* EMBEDDING FONTS */
/* Generated by Font Squirrel (http://www.fontsquirrel.com) */
/********************************************************************************/
@font-face {
    font-family: 'didot_lt_stdregular';
    src: url('../fonts/didotltstd-roman-webfont.eot');
    src: url('../fonts/didotltstd-roman-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/didotltstd-roman-webfont.woff') format('woff'), url('../fonts/didotltstd-roman-webfont.ttf') format('truetype'), url('../fonts/didotltstd-roman-webfont.svg#didot_lt_stdregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'didot_lt_stditalic';
    src: url('../fonts/didotltstd-italic-webfont.eot');
    src: url('../fonts/didotltstd-italic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/didotltstd-italic-webfont.woff') format('woff'), url('../fonts/didotltstd-italic-webfont.ttf') format('truetype'), url('../fonts/didotltstd-italic-webfont.svg#didot_lt_stditalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
/********************************************************************************/
/* DEFAULT VALUE */
/********************************************************************************/
body {
    font-family: Times, 'Microsoft YaHei', 'Microsoft JhengHei', "STHeiti", Times New Roman, serif;
    font-family: Times, Times New Roman, serif;
    font-size: 13px;
    text-align: left;
    color: #000;
    background: #fff;
}
a { text-decoration: none; color: #000; }
a:hover { text-decoration: none; color: #7c8178; }
a img { border: none; }
p {
    text-align: center;
    padding: 5px 0;
    line-height: 18px;
}
.f12 { font-size: 12px; }
.f13 { font-size: 13px; }
.f15 { font-size: 15px; }
.f19 { font-size: 19px !important; line-height: 22px !important; }
.f22 { font-size: 22px; }
.f23 { font-size: 23px; }
.f24 { font-size: 24px !important; }
.f25 { font-size: 25px; }
.f36 { font-size: 36px !important; }
.f120 { font-size: 120px !important; line-height: 110px !important; }
div.spacer10 { clear: both; height: 10px; display: block; }
div.spacer15 { clear: both; height: 15px; display: block; }
div.spacer20 { clear: both; height: 20px; display: block; }
div.spacer35 { clear: both; height: 35px; display: block; }
div.spacer55 { clear: both; height: 55px; display: block; }
.fl { float: left; }
.fr { float: right; }
.tl { text-align: left; }
.tr { text-align: right; }
.tc { text-align: center; }
.underline { text-decoration: underline; }
.il { display: inline; }
.none { display: none; }
/*Example*/

.abs { position: absolute; }
.rel { position: relative; }
.clear { clear: both; }
.hidden { display: none; }
.clearfix:after { content: ""; display: block; font-size: 0; height: 0; overflow: hidden; visibility: hidden; clear: both; }
/********************************************************************************/
/* HEADER */
/********************************************************************************/
.top {
    height: 50px;
    padding: 12px 0 0;
    text-align: center;
}
.logo { margin-top: 4px; }
.logo .img {
    display: inline-block;
    zoom: 1;
    *display: inline;
    width: 138px;
    height: 30px;
    background: url(../images/logo.png) no-repeat;
}
.top .top_left, .top .top_right { position: absolute; top: 12px; }
.top .top_left { left: 20px; }
.top .top_right { right: 20px; text-transform: uppercase; }
.top .block_first {
    float: left;
    padding: 4px 12px 0 0;
}
.top .block {
    float: left;
    padding: 3px 12px 0;
    background: url(../images/util-bar.png) no-repeat 0 4px;
}
.top .top_right .current_lang a { text-decoration: none; color: #7c8178; }
.top .lang_chi { font-size: 12px; line-height: 15px; }
/********************************************************************************/
/* TOPNAV */
/********************************************************************************/
#topnav {
    width: auto;
    height: 30px;
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    font-size: 14px;
    text-transform: uppercase;
}
#topnav ul { text-align: center; }
#topnav ul li {
    display: inline-block;
    zoom: 1;
    *display: inline;
    margin: 0 12px 0 13px;
}
#topnav ul li a { font-size: 15px; color: #6a6a6a; display: block; padding: 9px 0 5px; }
#topnav ul li .current,
#topnav ul li a:hover { color: #000; border-bottom: 2px solid #000; }
/********************************************************************************/
/* FOOTER */
/********************************************************************************/

.footer { position: fixed; z-index: 11; background-color: #fff; bottom: 0; left: 0; width: 100%; }
.bottom {
    height: 26px;
    padding: 15px 0 5px;
    text-align: center;
}
.bottom .block.no-bg { background: none; }
.bottom .block {
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 3px 12px 0;
    background: url(../images/util-bar.png) no-repeat 0 4px;
}
.icon {
    display: inline-block;
    zoom: 1;
    *display: inline;
    margin: 0 2px 0 1px;
}
.main {
    height: 100%;
    overflow-x: hidden;
}
.common_inside {
    color: #000;
    height: 100%;
    margin: 0 auto;
    position: relative;
   /*width: 960px;*/
}
.center-wrapper { position: absolute; left: 50%; top: 50%; }


.main-content { background: #fff; height: 100%; }

/*result panel*/
.subscribe-form {
    color: #FFFFFF;
    height: 25px;
    left: 525px;
    position: absolute;
    top: 455px;
}
.subscribe-input {
    background-color: #A5BAB2;
    border: 0 none;
    color: #FFFFFF;
    height: 100%;
    padding: 0 5px;
    vertical-align: top;
    width: 170px;
}
.do-subscribe {
    background-color: #7B998D;
    border: 0 none;
    color: #FFFFFF;
    cursor: pointer;
    height: 100%;
    line-height: 100%;
    padding: 0 10px;
}
.subscribe-input::-webkit-input-placeholder { color: #FFFFFF; }
.subscribe-input::-moz-placeholder { color: #FFFFFF; }
/* firefox 19+ */
.subscribe-input:-ms-input-placeholder { color: #FFFFFF; }
/* ie */
.subscribe-input:-moz-placeholder { color: #FFFFFF; }
.page-1, .page-6 { font-size: 42px; text-align: center; width: auto; height: 100%; position: relative; }
.page-1-inner { height: 100%; position: relative; }
.main-title { font-size: 100%; line-height: 0.8; margin-bottom: 0.2em }
.main-sub-title { font-size: 50%; font-style: italic; line-height: 1.2; margin-bottom: 0.5em; }
.main-text { font-size: 29%; line-height: 1.3; margin-bottom: 1em; }
.main-text2 { margin-bottom: 0; }
.start-btn { font-size: 29%; text-transform: uppercase; display: inline-block; height: 1.9em; line-height: 1.9em; padding: 0 0.6em; background: #fff; }
.page-1 img, .page-6 img { height: 100%; }
.page-1 .para { width: 469px; color: #fff; right: 35px; position: absolute; top: 50%; }
.wrap { height: 653px; min-height: 653px; }
.eng .main-title { font-family: 'didot_lt_stdregular'; margin-bottom: 0; line-height: 0.9; }
.eng .main-sub-title { line-height: 1; }
.eng .main-text { line-height: 1.1; }
.result-desc { font-family: Times, 'Microsoft JhengHei', serif; padding: 40px 0 10px; }
.result-desc-title { font-size: 18px; font-weight: bold; margin-bottom: 10px; }
.under-line { text-decoration: underline; margin-bottom: 15px; }
.result-desc-text { font-size: 12px; line-height: 18px; margin-bottom: 15px; }
.result-experience-btn { color: #fff; font-size: 16px; text-transform: uppercase; line-height: 28px; display: inline-block; padding: 0 35px; background-color: #000; }
.eng .result-desc-title { font-size: 16px; font-family: 'didot_lt_stdregular'; font-weight: normal; }
.eng .result-desc-text { font-family: 'didot_lt_stdregular'; }
.eng .result-experience-btn { font-size: 15px; padding: 0 10px; }
.emulate-select { color: #fff; display: inline-block; vertical-align: middle; width: 90%; background: url(../images/form-bg.png); position: relative; }
.emulate-select-head { line-height: 18px; height: 18px; padding: 7px 22px 7px 5px; cursor: pointer; background: url(../images/select.png) no-repeat right center; border: 1px solid transparent; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.emulate-select-body { position: absolute; left: 0; z-index: 11; width: 100%; background-color: #fff; display: none; }
.emulate-select-list { color: #000; max-height: 192px; overflow: auto; border: 1px solid #999; background-color: #fff; }
.emulate-select-item { line-height: 30px; height: 30px; padding: 1px 5px; cursor: pointer; }
.emulate-select-item.selected { font-weight: bold; color: #fff; background-color: #99ABA9 }
.emulate-select-item:hover { color: #fff; background-color: #99ABA9 }
.emulate-select.open .emulate-select-head { border-color: #999; }
.emulate-select.open .emulate-select-body { display: block; }
.emulate-select.open.up .emulate-select-body { bottom: 31px; box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.25); }
.emulate-select.open.down .emulate-select-body { top: 31px; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25); }
.emulate-checkbox { display: inline-block; width: 17px; height: 17px; vertical-align: middle; margin: -4px 5px 0 0; background: url(../images/checkbox.png) no-repeat; cursor: pointer; }
.emulate-checkbox.checked { background-position: 0 -17px; }
/* Common */

.page-6 { min-height: 671px; }
.block-form { color: #fff; height: 100%; background: #fff url(../images/form-bg.jpg) scroll no-repeat center; background-size: cover; }
.block-form > img { height: 100%; }
.block-form a { color: inherit; }
.form-box { width: 630px; height: 570px; position: absolute; top: 50%; left: 50%; margin: -278px 0 0 -510px; }
.title { font-family: 'DidotLTStdRegular'; font-size: 56px; font-weight: normal; line-height: 0.9; text-align: center; text-transform: uppercase; margin-bottom: 15px; }
.subtitle { font-family: 'DidotLTStdRegular'; font-style: italic; font-size: 28px; font-weight: normal; line-height: 1.2; text-align: center; margin-bottom: 17px; }
.eng .subtitle { font-size: 25px; margin-bottom: 15px; }
.text { font-size: 16px; line-height: 20px; text-align: center; }
.eng .thank-box .title { font-size: 60px; margin-bottom: 6px; }
.eng .text { line-height: 18px; }
.error-msg { font-size: 16px; line-height: 44px; min-height: 44px; text-align: center; }
.eng .error-msg { min-height: 36px; line-height: 36px; }
.form-wrap { font-size: 16px; line-height: 1; }
.form-label { margin-bottom: 6px; }
.form-row { padding-bottom: 16px; }
.form-item { width: 50%; float: left; }
.input, .select { color: #fff; font-size: 16px; line-height: 28px; border: solid 1px transparent; padding: 4px 5px; height: 34px; width: 90%; border-radius: 0; margin: 0; -o-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.select { color: #8d8d8d; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; border: 1px solid #B8BEC5; background: #fff url(../images/select.png) no-repeat right center; text-indent: 0.01px; text-overflow: ""; }
.input { background: url(../images/form-bg.png); }
.mobile-code { width: 65px; text-align: center; margin-right: 10px; }
.mobile { width: 208px; }
.first-name-wrapper { position: relative; }
.name-title { width: 88px; position: absolute; }
.first-name { width: 184px; margin-left: 100px; }
.form-input-list { margin-bottom: 5px; text-align: left; }
.form-input { position: relative; }
.checkbox-list { line-height: 30px; margin-bottom: 23px; text-align: left; }
.checkbox-list li { position: relative; }
.checkbox { position: absolute; top: 0; left: 0; visibility: hidden; }
.form-btn { text-align: left; }
.form-submit { font-size: 16px; line-height: 28px; text-align: center; color: #000; width: 100px; height: 28px; border: 0; background-color: #fff; cursor: pointer; -webkit-appearance: none; border-radius: 0; }
.prompt { font-size: 14px; line-height: 12px; text-align: left; padding: 36px 47px 0 0; }
.eng .prompt { line-height: 10px; }
.error { color: #f00; }
.error .input,
.error .select,
.error .emulate-select-head { border-color: #f00; }
.block-thank { color: #fff; height: 100%; background: #fff url(../images/form-bg.jpg) scroll no-repeat center; background-size: cover; }
.thank-box { width: 360px; text-align: center; position: absolute; left: 50%; top: 50%; margin-left: -412px; 
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform:translateY(-50%);
 }
.thank-box .title { margin-bottom: 12px; }
.thank-box .text { margin-bottom: 15px; }
.link { font-size: 14px; color: #000; line-height: 28px; display: inline-block; padding: 0 35px; height: 28px; text-transform: uppercase; background-color: #fff; }
.eng .link { font-size: 15px; padding: 0 12px; }
/*.eng .thank-box .title { margin-bottom: 0; }*/
/*@Paul 2014-12-17*/
.medium {padding-bottom: 14px; font-size: 24px; }
.eng .medium { font-size: 28px; }
.italic { font-style: italic; }
.last-named { width: 65px; text-align: center; margin-right: 10px; }
.last-name { width: 190px; }
.ie8-img { position: absolute; top: 0; left: 0; display: none; width: 100%; }
.lte8 .ie8-img { display: block; }