@charset "utf-8";
@import url(//fonts.googleapis.com/css?family=Fanwood+Text);
@import url(//fonts.googleapis.com/css?family=Numans);
@import url(//fonts.googleapis.com/css?family=Libre+Baskerville);

a { blr:expression(this.onFocus=this.blur());outline: none;}
a img{  border:none;}
a:focus { -moz-outline-style: none; }
html,body{height: 100%; font-family: Numans,'LiHei Pro', 微軟正黑體, sans-serif;}
body,li,ul,ol,h1,h2,h3.h4,h5,h6 {margin: 0;	padding: 0; list-style:none;}
*{ background-repeat:no-repeat; margin: 0; -webkit-text-size-adjust:none;}
body{ background-color:#f2f2f2;  font-size:12px;}
.clear{ clear:both;}

/*font*/

.index .contentBlock h2,#content .info h2,#content .cart h2,.userInfo h2,.customize h2,.service h2,.login h2,#content h2.title
{ font-family: 'Libre Baskerville','LiHei Pro', 微軟正黑體, serif; }
.index .contentBlock li,.index .more,.path *,.compare .note,
#content td,.sitemap a,#footer .container,.shape li,ul.content > li,
#nav .dropdown ul a,.language .dropdown .hint,#header .login .forget,.login input,
.language h3,.language .dropdown a,.shoppingDetail .total h3,
.customize .p1,.customize .p2,.personalInfo select,.personalInfo input,
.agreement .content h3,ul.content input,#content .preferentail .ui-tabs-panel th
{font-family: Numans,'LiHei Pro', 微軟正黑體, sans-serif;}

#nav a,#header .link a,#header .link div,.function .language .current,
#content .info h3,.result h2,.compare h2,#content th,.bannerSet h2,
.sitemap h4,.login th,.btnSearch,.cart h2,.cart h3,.service h3,.customize h3,.cart .btnSet a,.shoppingDetail dt,.options h4,
.term h4,.term li .btn,.membership h4,.membership .btn
.options h4,.banner_more .btn,.membership li .btn,
#content .correct,#content .wrong,.userInfo .btnSet a,.uploadBtn,
.btnPrint,#content .loginBlock h3,#content .loginBlock .btnLogin,.login#content .btnJoin a,#content .product .detail .price span,
.featureBlock h2,.included li,.grandReport h2,.certification .company,
.member h2,.member h3,#content h3.title,
.preferentail caption,.userInfo .btnSet .join,
#content .preferentail th,.ui-tabs-nav li a
{font-family: 'Fanwood Text','LiHei Pro', 微軟正黑體, serif;}


h1,h2,h3,h4,h5,h6{ color:#33335a;}

/*==transition==*/
a,#content td,.shoppingDetail dd,.term li > div,.term li .btn,.membership li > div,.membership .btn,.uploadBtn,input,#content .loginBlock .btnLogin,#content .btnSearch,
#topHeader img,.bannerSet img
{-webkit-transition:all 0.2s ease-in;  -moz-transition:all 0.2s ease-in; -ms-transition:all 0.2s ease-in;}
.btnLogin,li.cart a,.arrow a
{-webkit-transition:color 0.2s ease-in;  -moz-transition:color 0.2s ease-in; -ms-transition:color 0.2s ease-in;}


#footer{ color:#fff;  -webkit-text-size-adjust:none; clear:both;}
#footer .container{  line-height:30px; text-align:center; font-size:9px;}
#content #footer .container{ width:inherit; padding:inherit; margin:inherit; background-color:inherit;}
#header{ height:130px; border-bottom:5px solid #b3b3b3; position:relative;}
#header .container{ position:relative;}
#content{}
.container{ width:910px; margin:0 auto;}
#footer,#nav{ width:100%; background-color:#34335b; }

#nav{ position:absolute; bottom:0; height:35px;}
#nav > ul{ width:910px; margin:0 auto;   height:35px;}
#nav > ul > li{ float:left; margin:0 7px; padding-right:14px; position:relative; height:35px; background-image:url(../images/global/nav_line.png); background-position:right center;}
#nav > ul > li:last-child{ background-image:none;}
#nav > ul > li.diamond{ margin-left:180px;}
#nav > ul > li > a{ color:#999;  text-decoration:none; font-size:12px; text-transform:uppercase; font-weight:normal;  display:block; width:100%; height:100%; line-height:35px; }
#nav a:hover,#nav .on > a{ color:#fff;}

#nav .dropdown span{ background-image:url(../images/global/subnav_arrow.png); width:7px; height:7px; display:block; top:-7px; position:absolute;}
#nav .diamond .dropdown span{ left:50px;}
#nav .collection .dropdown span{ left:40px;}
#nav .customize .dropdown span{ left:35px;}

#nav .dropdown{ width:247px;  position:absolute; top:35px; left:0; background-color:#b3b3b3;  padding:0 10px;  height:130px; background-image:url(../images/global/subnav_shadow.png); background-position:200px 100px; z-index:50000000; display:none;}
#nav .dropdown ul,#nav .dropdown .img{ float:left; margin-top:15px;}
#nav .dropdown ul{margin-top:25px;}
#nav .dropdown ul{ width:160px; margin-right:5px;}
#nav .dropdown li{ margin-bottom:5px;}
#nav .dropdown ul a{ font-size:11px; -webkit-text-size-adjust:none; text-transform:none; color:#fff; text-decoration:none;}
#nav .dropdown ul a:hover{ color:#33335a; text-decoration:none;}
#nav .dropdown .img{ width:80px; height:80px; background-color:#666;}


.social{ float:left;}
.social li{ float:left;}

#logo{ width:253px; height:58px; margin:0 auto; text-align:center; top:0;  position:relative; padding:0; top:37px;}
#logo a{ padding:0; position:absolute; top:0; left:0;}


#header .function{ width:408px; height:25px; margin-top:15px; margin-right:0px; float:right; position:relative;}
/*#header.tw .function{ width:420px;}*/
.function .link a,.function .link > li > div{ float:left; color:#999; font-size:12px; -webkit-text-size-adjust:none; margin-right:5px; padding-right:5px;text-decoration:none; line-height:20px;  text-transform:uppercase; position:relative;}
#header .link a:hover{ color:#33335a; }


#header .function .link{ margin-right:5px; float:left;}
#header .function .link li{ position:relative;  border-right:1px dotted #33335a; float:left;}

#header .function .link li.login{  margin-left:5px; margin-right:5px;}
#header .login > div{ padding:0 7px;}
#header .link .login > div:hover{ background-color:#33335a; color:#fff;}


.function .cart a{ background-image:url(../images/global/icon_cart.png); padding-left:20px; background-position:0 0;}
.function .cart a:hover{ background-position:0 -20px;}

.function .dropdown{ position:absolute; display:none; z-index:50000000;}

/*language*/
.function .language{ float:left; position:relative;}
.function .language .current{ display:block; background-color:#999; height:20px; padding:0 20px 0 10px; line-height:20px; color:#fff; background-image:url(../images/global/arrow.png);  background-position:95% center; text-decoration:none;}
.function .language .current:hover{ background-color:#33335a;}
.function .current:hover .dropdown,.function .login:hover .dropdown{ display:block;}
.language .dropdown,.login .dropdown
{ position:absolute;top:20px;  background-color:#33335a;/* background-image:url(../images/global/dropdown_bg.png);*/  display:none; z-index:50000000; }
.language .dropdown{  right:0;  /*background-position:-35px 0;*/ width:392px; height:110px;  padding:20px 10px; z-index:50000000;}
/*.tw .language .dropdown{  right:0;  background-position:-49px 0;}*/
.login .dropdown{  right:0px;  background-position:-25px 0; width:340px; height:150px;  padding:15px 20px; z-index:50000000; top:19px;}
.tw .login .dropdown{ background-position:-10px 0;}

.login table{ margin-top:15px; width:350px; display:block; margin:15px auto;}
.login th{ height:25px; font-weight:normal; font-size:13px; width:105px;}
.login th,.login td{ padding-bottom:8px;}

.login th.number{ background-image:url(../images/global/icon_user.png); padding-left:25px; width:90px;}
.login th.password{ background-image:url(../images/global/icon_pw.png); padding-left:25px; width:90px;}

.login input{ border:none; padding:0 5px; background-color:#e6e6e6; width:210px; height:21px; line-height:21px;}
.login .code input{ width:115px; float:left;}
.login .code h3{ background-image:url(../images/global/icon_pcode.png); line-height:25px; padding-left:32px; float:left; color:#fff; font-weight:normal; margin-right:7px; padding-right:7px; border-right:1px solid #fff;}
.login .captcha{ width:100px; height:40px; background-color:#999;}
#header .login .btnLogin{ background-image:url(../images/global/login_btn.png); width:98px; height:44px; line-height:44px; color:#33335a; text-align:center; text-indent:-5px;
position:absolute; right:11px; bottom:10px;}
#header .login .btnLogin:hover{ background-position:bottom left; color:#fff;}
#header .login .forget{ color:#ccc; margin-top:-10px; font-size:11px; -webkit-text-size-adjust:none;}
#header .login .forget:hover{ color:#fff;}

/*social*/
.function  .social{ float:left; margin-right:0px;}
.function  .social li{ width:20px; height:20px; margin-right:5px; float:left;}
.function  .social  a{ display:20px; width:20px; height:100%;  text-indent:-9000px; background-color:#999; float:left; background-image:url(../images/global/share.png);}
.function  .social  a:hover{ background-color:#32345d;}
.social .plurk a{ background-position:0 0;}
.social .twitter a{ background-position:-20px 0;}
.social .sina a{ background-position:-40px 0 ;}
.social .fb a{ background-position:-60px 0;}


/*index Slider*/
.slider .banner{ height:390px;background-color:#ccc;}
.slider .selector{ height:5px; margin-bottom:27px; background-color:#999;}
#topHeader img,.bannerSet img
{-webkit-filter: grayscale(100%); }
#topHeader img:hover,.contentBlock img:hover,.bannerSet img:hover
{-webkit-filter: grayscale(0%);}

/*index ContentBlock*/
.index .contentBlock{ margin-bottom:30px; float:left; width:100%; color:#666;}
.index .contentBlock li{ width:290px; margin-right:20px; float:left; padding-bottom:30px; border-bottom:1px dashed #808080; line-height:19px; position:relative; padding-bottom:27px; font-size:11px; line-height:20px; -webkit-text-size-adjust:none; }
.index .contentBlock li.end{ margin-right:0;}

.index .contentBlock h2{ color:#343259; font-size:16px; font-weight:normal;text-transform:uppercase; margin-bottom:25px; text-align:center; background-image:url(../images/contentblock_h2.gif); background-repeat:repeat-x;}
.index .contentBlock h2 span{ background-color:#f2f2f2;  padding:0 20px;}
.index#content .contentBlock .adjust
{ font-size:11px; -webkit-text-size-adjust:none; background-color:#999; display:block; color:#fff; text-decoration:none; width:37px; text-align:center; height:15px; line-height:15px; float:right; margin-top:5px;}
.index#content .adjust:hover{ background-color:#808080;}
.index .contentBlock .img{ width:290px; height:140px; background-color:#666; margin-bottom:27px; display:block;}


/*page*/
#content .product .info h2,#content.member h2 ,#content h2.title
{ font-size:28px; text-transform:uppercase; font-weight:normal;}
#content .product .info h2{ display:inline; float:left; margin-right:20px; margin-bottom:32px;}

#content .info h3{  font-weight:normal; text-transform:uppercase; margin-bottom:0px; font-size:13px; line-height:13px; margin-bottom:3px;}
.info .share{ margin-top:7px; float:left;}
.info .share li{ display:block; width:20px; height:20px; float:left; margin-right:6px;}
.share li a{ background-color:#999; text-indent:-9000px; display:block; width:100%; height:100%; background-image:url(../images/product/icon.png);}
.share li a:hover{ background-color:#33335a;} 
.share .fb a{ background-position:0 0;}
.share .print a{ background-position:-20px 0;}
.share .email a{ background-position:-40px 0;}

.info .content{ clear:both;}

.result h2,.compare h2{ font-weight:normal; font-size:17px; line-height:16px; margin-bottom:15px;  text-transform:uppercase;}

#content .container { background-color:#e6e6e6; width:810px; margin:30px auto 0 auto; padding:25px 50px 30px 50px; }
.index#content .container{ background-color:transparent; padding:0; width:910px; margin:0 auto;}
.product{ background-image:url(../images/product/product_shadow.png); background-position:110px 314px;}

/*path*/
.path{ margin-bottom:23px; color:#999;}
.path a{ color:#999; text-decoration:none;}
.path a:hover{ color:#33335a;}
.path span{ color:#33335a;}

#content .top,.featureBlock{ margin-bottom:25px; float:left; width:100%;}

#content .top,#content .result,#content .compare,#content .bannerSet,
.cart .btnSet,.cart .delivery,div.membership,.userInfo .btnSet,.login .content,
.featureBlock,.grandReport,.member .container > ul
{background-image:url(../images/product/line.png); background-position:bottom; background-repeat:repeat-x;}


.product .detail table{ width:245px; float:left; margin-right:20px;}
.productDetail .top{ padding-bottom:40px;}
#content .productDetail{ position:relative;}
#content .productDetail .top > .img{ height:288px; margin-right:13px; margin-bottom:10px; background-image:url(../images/product/product_shadow.png); background-position:bottom center;}
#content .productDetail .top > .img,.imgSmall{  background-color:#f2f2f2; border:1px solid #999; }
.productDetail .imgSmall{ position:absolute; width:50px; height:50px; top:360px;}
.productDetail .number1{ left:50px;}
.productDetail .number2{ left:108px;}
.productDetail .number3{ left:250px;}

#content .product .detail  th,#content .product .detail  td
{padding:3px 0;  font-size:11px;}
#content .product .detail  tr:hover td{ background-color:transparent;}
#content .product .detail  th{ width:115px; text-align:left;  background-color:transparent; color:#33335a;}
#content .product .detail  td{ text-align:right;  color:#666;}
#content .product .detail .price{ font-size:16px; float:left; margin-top:80px; text-align:right; width:245px;  color:#33335a;}
#content .product .detail .price span{ font-size:16px; font-size:11px; text-transform:uppercase; float:left; margin-top:3px;}
#content .product .btnCart{ height:35px; line-height:35px; width:177px; margin-top:28px; float:right; margin-right:20px; font-size:15px; background-image:url(../images/product/ico_cart.png); background-position:15px 0px; text-indent:25px;}

.container a{ color:#33335a;}
.container a:hover{ text-decoration:none;}

.featureBlock h2,.grandReport h2,.member h3{ text-transform:uppercase; font-weight:normal;}
.featureBlock,.grandReport{ padding-bottom:20px; margin-bottom:20px;}
.featureBlock .feature,.grandReport .text{ color:#666; margin-right:30px;}
.featureBlock .feature li{ padding-left:10px; background-image:url(../images/cart/dot.png); background-position:left 7px; margin-bottom:3px; line-height:15px;}
.featureBlock .feature,.featureBlock .included,.grandReport > .text,.grandReport .certification{ float:left; width:375px; line-height:20px;}
.included li{ background-color:#33335a; color:#fff; margin-bottom:3px; padding:3px 10px; text-transform:uppercase; background-image:url(../images/product/ico_check.png); background-position:99% center;}
.included li span{  background-image:url(../images/product/star_white.png); background-position:left center; padding-left:20px;}
.included h2{ margin-bottom:25px;}
.included .note{ margin-top:5px;}
.included .note span{ display:block; float:left; width:350px; font-size:11px;}
.included .note span.ico{background-image:url(../images/product/star_purple.png); width:18px; height:9px; background-repeat:repeat-x; margin-right:3px; margin-top:5px;}

.grandReport h2{ margin-bottom:25px;}
.grandReport .logo{ width:100px; height:100px; border:1px solid #33335a; margin-right:5px;}
.grandReport .logo,.grandReport .text{ float:left;}
.grandReport .text p{ margin-bottom:20px; display:block;}
.certification .text{ width:235px; position:relative; padding-top:53px; border-bottom:2px solid #b3b3b3; padding-bottom:5px;}
.certification li{ margin-bottom:20px; float:left; width:100%;}
.certification .company{ font-size:11px; float:left; color:#33335a; margin-top:-5px;}
.certification .company span{ font-size:35px; display:block; margin-top:4px;}
.certification .btnSet{ float:right; padding-top:20px;}
#content .certification .btnSet a{ font-size:11px;}
#content .certification .btnSet a:hover{ text-decoration:underline;}

#content .top .img{ float:left; width:250px; height:250px; margin-right:20px; background-color:#b3b3b3;}
#content .top .info{ float:left; width:535px;}
#content .top .infoBottom{ width:800px; position:relative; z-index:5; margin-top:22px;}

#content ul.content{ width:100%; float:left;}
ul.content > li.end{ margin-right:0;}
ul.content > li.shape{ margin-bottom:13px;}
ul.content > li{ width:250px; float:left;  margin-right:17px; padding-bottom: 13px; display:inline-block;}
ul.content li.shape,ul.content li.precious,/*ul.content li.cut,ul.content li.symmetry,*/
ul.content li.heat,ul.content li.comments
{ width:100%; margin-right:0;}

ul.content > li select{ width:100%;}

.shape li{ float:left;  width:30px;  font-size:9px; text-align:center; -webkit-text-size-adjust:none; margin-right:20px; color:#999; position:relative; height:30px;}
.shape li.on{color:#2d2e3f; background-position:bottom; /*padding-bottom:10px;*/}
.shape .on a{ border-bottom:5px solid #33335a;}
.shape li a{border-bottom:5px solid #e6e6e6; display:block; width:100%; margin-bottom:5px;}

.shape li a span,.shoppingDetail .subulate div{  display:block; height:30px; position:relative; text-indent:-9000px; 
-webkit-transition:color 0.2s ease-in;  -moz-transition:color 0.2s ease-in; -ms-transition:color 0.2s ease-in;  margin-bottom:5px;}



#content .gem1{ width:28px;}
#content .gem2{ width:28px;}
#content .gem3{ width:24px;}
#content .gem4{ width:28px;}
#content .gem5{ width:12px;}
#content .gem6{ width:14px;}
#content .gem7{ width:29px;}
#content .gem8{ width:22px;}
#content .gem9{ width:27px;}
#content .gem10{width:20px;}

#content .ring1{width:24px; height:31px;}
#content .ring2{width:23px; height:31px;}

#content .gold1{width:31px; height:31px;}
#content .gold2{width:31px; height:31px;}


.shape li a:hover span,.shape li.on a span{ background-position:bottom;}

#content .gem1
{ background-image:url(../images/product/gem_1.png);}
#content .gem2{ background-image:url(../images/product/gem_2.png);}
#content .gem3{ background-image:url(../images/product/gem_3.png);}
#content .gem4{ background-image:url(../images/product/gem_4.png);}
#content .gem5{ background-image:url(../images/product/gem_5.png);}
#content .gem6{ background-image:url(../images/product/gem_6.png);}
#content .gem7{ background-image:url(../images/product/gem_7.png);}
#content .gem8{ background-image:url(../images/product/gem_8.png);}
#content .gem9{ background-image:url(../images/product/gem_9.png);}
#content .gem10{ background-image:url(../images/product/gem_10.png);}

#content .ring1{ background-image:url(../images/product/ring_1.png); height:31px;}
#content .ring2{ background-image:url(../images/product/ring_2.png); height:31px;}

#content .gold1{ background-image:url(../images/product/gold_1.png); height:31px;}
#content .gold2{ background-image:url(../images/product/gold_2.png); height:31px;}

#content .shape li a:hover,#content .shape li.on a{ background-color:transparent;}


/* .content > li li a:hover,.content > li li.on a{ background-color:#33335a;} */
.content > li li.on a{ background-color:#33335a;}

li.color li,li.clarity li,li.cut li,li.symmetry li,li.fluorescence li,li.polish li,li.heat li
{float:left; margin-right:1px; font-size:9px;text-align:center;  -webkit-text-size-adjust:none; text-transform:uppercase; line-height:11px;}

#content li.heat{ padding-bottom:10px;}
li.heat li{  width:39px; }
li.color li{  width:34px; }
li.clarity li{  width:30px; }
li.cut li,li.symmetry li,li.polish li{ width:61px;}
li.fluorescence li{  width:49px; }
li.color a,li.clarity a,li.cut li a,li.symmetry li a,li.fluorescence li a,li.polish li a,li.heat a
{ height:10px; display:block; background-color:#999999; margin-bottom:5px;}

#content .top .img .option{ /*margin-top:10px;*/ width:320px; margin-left:-35px; display:inline-block;
transform: scale(0.8,0.8);
-ms-transform: scale(0.8,0.8); /* IE 9 */
-webkit-transform: scale(0.8,0.8); /* Safari and Chrome */
}
.option .checker{ float:left;}
.option label{   -webkit-text-size-adjust:none; text-transform:uppercase; display:block; float:left; width:100px; margin-bottom:2px; }
.option label.fluorescence{ width:120px; }
.option label.typeService{ width:150px;}
.cut .option,.precious .option,.comment .option{ float:left; margin-left:20px;  width:250px;}
.option div.checker { margin-right:0;}



.result{ clear:both; width:100%;}

.result,.compare{ margin-bottom:15px; position:relative; }

#content th,.shoppingDetail dt{ background-color:#33335a; color:#fff; padding:10px 0; text-transform:uppercase; font-weight:normal; text-align:left;}
#content .product td,.shoppingDetail dd,#content .table td,
.cart#content td,.userInfo td
{ padding:10px 0; color:#666; font-size:11px; -webkit-text-size-adjust:none;}
/*#content th.check{ width:55px;}
#content th.number{ width:115px;}
#content th.shape{ width:105px;}
#content th.weight{ width:275px;}
#content th.date{ width:100px;}
#content th.price{ width:120px;}*/

#content .product tr:hover td,#content .product tr:hover td,.shoppingDetail dd:hover{ background-color:#ccc;}

.compare h2{ background-image:url(../images/product/plus.jpg); background-position:left top; padding-left:20px;}
.compare .note{ color:#666; position:absolute; right:0; top:0;}

#content .gray{ color:#666;}
#content td.detail a{ display:block; color:#fff; background-color:#999; text-decoration:none; height:15px; line-height:15px; width:70px; text-align:center; -webkit-text-size-adjust:none; font-size:11px; background-image:url(../images/product/view_arrow.png); background-position:88% center; position:relative;}
#content td.detail a:hover{ background-color:#33335a;}
td.check{ text-align:center;}


.detail .img,.shoppingDetail dd .img,.imgPreview{ width:66px; height:66px;  position:absolute; background-image:url(../images/product/preview.png); padding:2px 2px 2px 10px; display:none;}
div.imgPreview{ display:block; right:-80px;  z-index:2;}
.detail .img img,.shoppingDetail dd .img img,.imgPreview img{ width:66px; height:66px;}
.detail .img{right:-88px; top:-30px; }
.detail .img span,.imgPreview span{ display:block; height:30px; background-position:center bottom; margin-top:18px;}

.bannerSet{ overflow:auto; clear:both; padding-bottom:13px;}
.bannerSet h2{ font-weight:normal; text-transform:uppercase; margin-bottom:11px;}
.bannerSet li{ margin-right:103px; float:left; width:350px; margin-bottom:15px; position:relative;}
.bannerSet li.even{ margin-right:0; border:none;}
.bannerSet li a{ width:335px; height:105px; border:6px solid #ccc; display:block;}
.bannerSet h2{ background-image:url(../images/product/banner_icon.png); height:21px; padding-right:25px; display:inline-block; line-height:21px; margin-bottom:10px;}
.bannerSet h2.precious{ background-position:right 0;}
.bannerSet h2.international{ background-position:right -21px;}
.bannerSet h2.transport{ background-position:right -42px;}
.bannerSet h2.membership{ background-position:right -63px;}


#footer .sitemap{ border-top:30px solid #33335a; background-color:#f2f2f2; padding:20px 0 35px 0; overflow:auto; text-align:left; }
.sitemap > ul{ width:850px; margin:0 auto; overflow:auto;}
.sitemap h4{ font-size:13px; color:#33335a; margin-bottom:15px; text-transform:uppercase;  font-weight:normal;}

.sitemap > ul  li{ float:left; width:130px; margin-right:13px;}
.sitemap > ul > li.last{ margin-right:0;}
.sitemap ul > li li{ margin-bottom:3px; line-height:14px;}
.sitemap a{ color:#666; text-decoration:none; font-size:9px; line-height:8px;}
.sitemap a:hover{ color:#000;}

#content .rangeUI{ width:250px; overflow:hidden;}
.rangeUI .max,.rangeUI .min{ background-color:#f2f2f2; border:1px solid #ccc; font-size:9px; height:15px; width:auto; padding:0 5px;  -webkit-text-size-adjust:none; line-height:15px; color:#333; margin-top:2px; width:50px;}
.rangeUI .max{ float:right;}
.rangeUI .min{ float:left;}

.selectUI{ width:100%; position:relative;}
.selectUI a{  text-decoration:none; font-size:9px;  -webkit-text-size-adjust:none; text-transform:uppercase;}
.selectUI > a{ display:block; border:1px solid #33335a; padding:5px; background-image:url(../images/global/select_arrow.png); background-position:right center; color:#33335a; line-height:15px;}

.selectUI ul{ border:1px solid #33335a; background-color:#e6e6e6;  display:none; position:absolute; left:0; top:28px; width:100%; }
.selectUI ul li{height:20px; line-height:20px;}
.selectUI ul a{ color:#999; display:block;height:100%; padding:0 5px;}
div.selectUI ul a:hover{ background-color:#ccc; color:#33335a;}

.precious .selectUI,.comment .selectUI{ width:255px; float:left;}

.language .hint{ background-image:url(../images/global/icon_language.png); padding-left:25px; font-size:12px; margin-bottom:10px;}
.language .selectUI{ margin-left:5px; width:160px; position:absolute; top:0; right:0;}
.language .selectUI a{  text-decoration:none; font-size:11px;  -webkit-text-size-adjust:none; text-transform:uppercase;}
.language .selectUI > a{ background-color:#e6e6e6; color:#999; }
.language .dropdown > ul{ width:230px; margin-left:30px;}
.language .dropdown > ul > li{ height:28px; margin-bottom:10px; position:relative; width:100%;}
.language li h3{ float:left; width:60px; color:#fff; font-size:11px; font-weight:normal; line-height:30px;}
.language .languageSelect{ z-index:4;}
.language .currenctSelect{ z-index:3;}


#content .btnSearch{ width:250px; height:27px; line-height:27px; float:left;}
#content li.searchBlock { padding-top:27px; height:27px; margin-bottom:20px;}
#content .option .btnSearch{ margin-left:-10px;}



.comment,.precious{ z-index:99999999; position:relative;}
.shipping{ z-index:3; position:relative;}

.comment .selectUI > a span{ margin-top:-5px; margin-left:0px;}

.comment .selectUI a span{ background-image:url(../images/product/select_color.png); height:19px; line-height:19px; background-position:left bottom;display:block; width:19px; height:19px; float:left; margin-right:5px;}
.comment .selectUI li a:hover span{ background-position:left top;}
.selectUI span.color1{ background-color:#ffde00;}
.selectUI span.color2{ background-color:#bbb649;}
.selectUI span.color3{ background-color:#cf6000;}
.selectUI span.color4{ background-color:#ffff00;}
.selectUI span.color5{ background-color:#fbb03b;}
.selectUI span.color6{ background-color:#bb381a;}
.selectUI span.color7{ background-color:#ffaca4;}
.selectUI span.color8{ background-color:#f15a24;}
.selectUI span.color9{ background-color:#d75a24;}
.selectUI span.color10{ background-color:#f13d24;}
.selectUI span.color11{ background-color:#f13d2d;}
.selectUI span.color12{ background-color:#ff0000;}
.selectUI span.color13{ background-color:#ff42ac;}
.selectUI span.color14{ background-color:#ffa7e1;}
.selectUI span.color15{ background-color:#ff7bac;}
.selectUI span.color16{ background-color:#c127ac;}

/*cart*/
.cart h2,.cart h3,.userInfo h2,.customize h2,.service h2,.service h3,.customize h3,.login h2
{font-weight:normal; text-transform:uppercase; }
.cart h2,.userInfo h2,.customize h2,.service h2,.login h2{ font-size:31px; margin-bottom:30px;}
.cart h3,.service h3,.customize h3{ font-size:17px; }

.cart .steps{ width:750px;  margin:0 auto 20px 25px; float:left;}
.cart .steps li{ float:left; width:125px; height:27px; border-top:5px solid #999;  border-bottom:1px solid #808080; padding-left:30px; padding-right:5px; font-size:11px;  -webkit-text-size-adjust:none; color:#999; padding-top:3px; padding-bottom:3px; background-image:url(../images/cart/icon_cart_normal.png);}

.cart .steps li.on{background-image:url(../images/cart/icon_cart_active.png);}

.steps .step1{ background-position:0 0;}
.steps .step2{ background-position:0 -35px;}
.steps .step3{ background-position:0 -70px;}
.steps .step4{ background-position:0 -105px;}

.cart .steps li.arrow{ border:none; width:15px; padding:0 10px; background-image:url(../images/cart/step_arrow.png); background-position:top; height:35px; margin-top:2px;}
.cart .steps li.arrow.on{ background-position:bottom;}
.cart .steps li.on{ border-color:#33335a; color:#33335a;}
.cart .steps .step2{  line-height:27px;}
.cart .content{ margin-bottom:23px; color:#666;}
.cart .content strong{ color:#33335a;}

/*btn*/
.cart .btnSet a,.userInfo .btnSet a,.banner_more .btn,.login .btnJoin a,.login .btnLogin,#content .product .btnCart,.userInfo .btnSet .join,#content .btnSearch
{display:block; background-color:#888; text-align:center; color:#fff; text-transform:uppercase; text-decoration:none; }
.cart .btnSet a:hover,.userInfo .btnSet a:hover,.banner_more .btn:hover,
#content .loginBlock .btnLogin:hover,.login#content .btnJoin a:hover,#content .product .btnCart:hover,.userInfo .btnSet .join:hover,#content .btnSearch:hover
{box-shadow:0px 0px 15px rgba(20%,20%,40%,0.5); background-color:#33335a;}

.cart .btnSet,.userInfo .btnSet{ overflow:auto; padding-bottom:20px; clear:both;}
.cart .btnSet a,.userInfo .btnSet a,.userInfo .btnSet .join{   width:100px; height:27px; line-height:27px; float:left;  margin-right:10px; font-size:13px;}
.cart .btnSet .back,.userInfo .btnSet .back{ margin-left:300px; background-image:url(../images/cart/arrow_pre.png); background-position:20% center;}
.cart .btnSet .next,.banner_more .btn{background-image:url(../images/cart/arrow_next.png)}
.cart .btnSet .next{ background-position:80% center;}
.banner_more .btn{ background-position:96% center;}
.userInfo .btnSet .join{ background-image:url(../images/join/btn_icon.png); background-position:85% -43px; border:none; cursor:pointer;}

.shoppingDetail{ clear:both; margin-top:20px;}
.shoppingDetail .total { border-top:1px solid #bbb; border-bottom:1px solid #bbb; text-align:right; padding:25px 0; margin-bottom:20px; clear:both;}
.shoppingDetail .total h3{ display:inline; font-size:11px; margin-right:0px; padding:5px;  -webkit-text-size-adjust:none; background-color:#33335a; color:#fff; text-transform:none;}

.shoppingDetail  dl{ margin-top:28px;}
.shoppingDetail dt,.shoppingDetail dd { float:left; width:100%;}
.shoppingDetail dt >div,.shoppingDetail dd >div{ float:left; width:70px; }

.shoppingDetail .step1 div.btn{ width:60px; margin-left:20px;}
.btn .add,.btn .minus{ width:12px; height:12px; display:block; text-indent:-9000px; margin:10px auto;}
.btn .add{ background-image:url(../images/cart/icon_plus.png);}
.btn .minus{ background-image:url(../images/cart/icon_delete.png);}

.shoppingDetail .step3 div.number{ margin-left:10px;}
.shoppingDetail .price{ width:160px;}
.shoppingDetail .step1 dt > div.subulate{ margin-left:80px;}
.shoppingDetail .step3 dt > div:nth-child(1){ margin-left:10px;}
.shoppingDetail dd{ padding:25px 0; position:relative;}
.shoppingDetail  dd div{color:#33335a; line-height:28px;}

.shoppingDetail .subulate div{ background-position:bottom; margin-left:15px;}

.shoppingDetail dd .img{ right:-75px; top:5px;}

.step2 .delivery,.step3 .term{ margin-bottom:20px;}
.step2 .delivery li,.step3 .term li{ padding:25px 40px 25px 155px; border-bottom:1px solid #ccc; color:#666; background-position:50px center;}
.delivery li.method1{ background-image:url(../images/cart/icon_delivery_1.png);}
.delivery li.method2{ background-image:url(../images/cart/icon_delivery_2.png);}
.step3 .term li.term1{ background-image:url(../images/cart/credit_card.png);}

.step2 .delivery a,.step3 .term a{ color:#33335a;}

.step2 .term  h4,.membership h4{ font-size:17px; border-top:1px solid  #33335a; border-bottom:1px solid  #33335a; color:#fff; margin-bottom:8px;  padding:2px 0; line-height:39px; text-align:center; text-transform:uppercase; }
.step2 .term h4 span,.membership h4 span{ background-color:#33335a;height:39px; display:block; font-weight:normal;}
.step2 .term > ul,.membership > ul{ float:left; width:100%; margin-bottom:25px; margin-top:20px;}
.step2 .term > ul > li,.membership > ul > li{ width:260px; float:left; margin-right:10px; }
.step2 .term > ul > li:nth-last-child(1),.membership > ul > li:nth-last-child(1){ margin-right:0px; }
.step2 .term > ul > li > div,.membership > ul > li > div{ background-color:#fff; padding:10px; border:3px solid #fff; box-shadow:0px 0px 10px rgba(20%,20%,40%,0.3); color:#666;  font-size:11px;  -webkit-text-size-adjust:none;  position:relative;}
.step2 .term > ul > li > div{height:500px;line-height:22px;}
.step2 .term li .btn,.membership li .btn{ height:35px; display:block; width:155px;  text-align:center; text-transform:uppercase; font-size:17px; text-decoration:none; color:#fff; line-height:35px;} 
.step2 .term li .btn{ position:absolute; bottom:45px;left:50%; margin-left:-72px;}
.membership li .btn{ margin:0 auto 15px auto;}
.step2 .term li  .btn,.membership li .btn{
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #9D9D9D 0%, #33335A 100%);
/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #9D9D9D 0%, #33335A 100%);
/* Opera */ 
background-image: -o-linear-gradient(top, #9D9D9D 0%, #33335A 100%);
/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9D9D9D), color-stop(1, #33335A));
/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #9D9D9D 0%, #33335A 100%);
/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #9D9D9D 0%, #33335A 100%);
}

.step2 .term li .btn:hover,.membership li .btn:hover{
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #2f3188 0%, #33335A 100%);
/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #2f3188 0%, #33335A 100%);
/* Opera */ 
background-image: -o-linear-gradient(top, #2f3188 0%, #33335A 100%);
/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2f3188), color-stop(1, #33335A));
/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #2f3188 0%, #33335A 100%);
/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #2f3188 0%, #33335A 100%);
box-shadow:0px 0px 15px rgba(20%,20%,40%,0.5); background-color:#33335a;
	}
.step2 .term li:hover > div,.membership li:hover > div{ background-color:#fff; padding:10px; border:3px solid #33335a; }



.step2 .term p { height:85px; color:#33335a; padding-top:115px; display:block; background-position:center center; text-decoration:underline;  background-position:center top;}
.term .payment p{ background-image:url(../images/cart/icon_term_1.png);}
.term .bankWire p{ background-image:url(../images/cart/icon_term_2.png);}
.term .creditCard p{ background-image:url(../images/cart/icon_term_3.png);}

.billing,.shoppingAddr{ border-bottom:1px solid #ccc; padding-bottom:50px; margin-bottom:15px;}


.twoColumn { width:100%; float:left; margin-bottom:30px;}
.twoColumn > div{ width:390px; margin-right:20px; float:left;}
.twoColumn > div.even{ margin-right:0px; }

/*customize*/

.customize div.theme{ height:310px; width:100%; margin-bottom:20px; background-color:#bbb;}
.customize h3{ margin-bottom:25px;}
.customize .options{ margin-top:20px;}
.customize .options h4{ margin-bottom:10px; text-transform:uppercase; font-weight:normal;}
.customize  .p1,.customize  .p2{ padding-bottom:20px; color:#666; font-size:11px; line-height:19px;  -webkit-text-size-adjust:none; }

.customize  .flow { float:left; width:100%; border-bottom:1px solid #ccc; margin-bottom:25px;}
.customize  .flow  li{ width:220px; padding-right:68px;  float:left; padding-bottom:70px;}
.customize  .flow  li.flow3,.customize  .flow  li.flow4{ padding-right:0px;}
.customize  .flow  li.flow4,.customize  .flow  li.flow5,.customize  .flow  li.flow6{ float:right; padding-bottom:0px; margin-bottom:25px;}
.customize  .flow  li.flow4{  margin-right:4px;}
.customize  .flow h3{ background-color:#33335a; color:#fff; text-align:center; font-size:13px; padding:3px 0;}
.customize  .flow .inner{ background-image:url(../images/product/line.png); background-repeat:repeat-x; background-position:bottom; height:200px; color:#666; font-size:11px; -webkit-text-size-adjust:none; line-height:15px;}
.customize  .flow .inner span{ color:#33335a;}
.customize  .flow .inner div{background-position:top center; padding-top:95px;}
.customize  .flow1 .inner div{background-image:url(../images/customize/icon_1.png);}
.customize  .flow2 .inner div{background-image:url(../images/customize/icon_2.png);}
.customize  .flow3 .inner div{background-image:url(../images/customize/icon_3.png);}
.customize  .flow4 .inner div{background-image:url(../images/customize/icon_4.png);}
.customize  .flow5 .inner div{background-image:url(../images/customize/icon_5.png);}
.customize  .flow6 .inner div{background-image:url(../images/customize/icon_6.png);}
.customize  .flow1,.customize  .flow2{  background-image:url(../images/customize/customize_arrow_1.png); background-position:245px 95px;}
.customize  .flow5,.customize  .flow6{  background-image:url(../images/customize/customize_arrow_3.png); background-position:245px 95px;}
.customize  .flow3{  background-image:url(../images/customize/customize_arrow_2.png); background-position:100px 274px;}
.customize .p2{ border-top:1px solid #ccc; padding-top:25px;}
.customize .p2 h3{ text-align:center; color:#fff; background-color:#33335a; padding:10px 0; text-transform:uppercase; margin-bottom:0;}
.customize .p2 .img{ height:370px; background-color:#b3b3b3; margin-bottom:10px;}

.banner_more{ background-color:#ccc; clear:both; padding:10px; margin-bottom:25px;}
.banner_more .banner{ background-color:#b3b3b3; height:200px; margin-bottom:30px;}
.banner_more .btn{ margin:0 auto; height:40px; padding:0 10px; text-align:center; font-size:17px; font-size:17px; width:205px; line-height:40px; margin-bottom:30px;}


/*membership*/
div.membership{ clear:both; float:left; width:810px; margin-bottom:25px;}
.membership > ul > li{}
.membership > ul > li > div{ line-height:17px; float:left;}
.membership li li em,.membership li li span{ float:left; display:block;}
.membership li li{ border-bottom:1px solid #ccc; margin-bottom:10px; padding-bottom:10px; padding-left:15px; float:left; width:220px; background-image:url(../images/customize/star.png); background-position:0px 2px;}
.membership li li em{ width:15px; font-style:normal;}
.membership li li span{ float:left; display:block; width:200px;}
.membership li li:nth-last-child(1){ border-color:#33335a;}
.membership li.memberA,.membership li.memberB,.membership li.memberC{ padding-top:70px;}
.membership li.memberA{  background-image:url(../images/customize/member_1.png);  background-position:center 15px;}
.membership li.memberB{  background-image:url(../images/customize/member_2.png);  background-position:center top;}
.membership li.memberB.gray{  background-image:url(../images/customize/member_2_gray.png);}
.membership li.memberC{ background-image:url(../images/customize/member_3.png);  background-position:center 10px;}
#content .membership li.gray div{ background-color:#f5f5f5; color:#999;}
#content .membership li.gray li{  background-image:url(../images/customize/star_gray.png); }
.membership li.gray .btn,.membership li.gray .btn:hover{ background-image:none; background-color:#b8b8b8; box-shadow:none;}
.membership li.gray > div,.membership li.gray:hover > div{border:3px solid #f5f5f5; }
.membership li.gray li:nth-last-child(1){ border-color:#ccc;}
.membership .gray h4 span {background-color: #b8b8b8;}
.membership .gray h4 {border-color:#b8b8b8; }
.membership .selectUI{ margin-bottom:15px;}
#content .membership .selectUI > a{ line-height:10px;}
#content .membership .selectUI ul{ background-color:#fff; padding-bottom:0;}
#content .membership .selectUI li{ padding-bottom:0; margin:0; background-image:inherit; padding-left:0; width:100%;}

/*service*/
.service .theme{ height:310px; margin-bottom:20px;}
#content.service h3{ background-color:#33335a; color:#fff; font-size:17px; display:inline; padding:0 10px;}
#content.service .more-less{ margin-bottom:20px;}
#content.service .more-block{  margin-top:20px; line-height:22px; color:#666; font-size:11px; -webkit-text-size-adjust:none;}
#content.service a.adjust{ color:#33335a; }
#content.service a.what{ display:block; margin-bottom:15px;}
.service .membership{ margin-top:50px;}

#content table.personalInfo{ line-height:15px;}
#content table.personalInfo tr:hover td{ background-color:inherit;}

.personalInfo input[type=text],.personalInfo input[type=password],.personalInfo select,.personalInfo  td  > span{ color:#999; font-size:11px;}
.personalInfo input[type=text],.personalInfo input[type=password],.personalInfo textarea{  margin:0 0 0 0; border:1px solid #33335a; background-color:#e6e6e6; padding:3px 3px; width:175px;}
.personalInfo .error input[type=text],.personalInfo input[type=text]:focus{ border-color:#f15a24;}
.personalInfo .error input[type=text]{ margin-right:5px;}
.personalInfo .error{ background-image:url(../images/member/ico_error.png); padding-right:16px; background-position:right center; display:inline-block;
height:22px;}

.personalInfo input[type=text],.personalInfo select{ margin-right:15px;}
.personalInfo select,.personalInfo .province input{ width:110px; }

.personalInfo tr.addr input,#content .step3 .personalInfo .addr span,.userInfo .personalInfo tr.addr input{ width:555px;}
.member .personalInfo tr.addr input{ width:500px; margin-right:5px;}
/*.personalInfo tr.addr .hint{ margin-left:110px;}*/
#content tr.phoneNumber input.country{ width:75px; margin-right:0;}
#content tr.phoneNumber input.area{ width:45px; margin-right:0;}
#content tr.phoneNumber input.phone{ width:115px; margin-right:10px;}

.personalInfo .date .hint{ margin-left:80px;}
.personalInfo td{ margin-bottom:15px;}
.personalInfo label,.agreement strong label{ background-image:url(../images/cart/dot.png); background-position:left center; padding:0 10px 0 7px; border-right:1px solid #33335a; margin-right:10px;}

.personalInfo .hint{ font-size:9px; color:#666; margin-top:5px;}
.personalInfo .hint span{ display:block; background-image:url(../images/cart/icon_what.png); padding-left:13px; margin-right:5px; color:#33335a; float:left;}

.step3 .personalInfo td > span{ width:120px; margin-right:5px; display:inline-block; font-size:11px; color:#444; }
.step3 .personalInfo span.time{ width:230px;}

.completion{ color:#999; clear:both;  margin-bottom:35px;}
.completion h2{ font-size:31px; margin-bottom:20px; margin-top:35px;}

.completion a{ color:#33335a;}
.completion a:hover{ text-decoration:none;}
.completion p{ margin-bottom:10px;line-height:18px;}

.step4 .btnSet a{ float:none; margin:0 auto;}
.btnPrint{ font-size:17px; text-transform:uppercase; text-decoration:none; margin-bottom:10px; display:block; background-image:url(../images/cart/ico_print.png); padding-left:20px;}
#content .btnPrint:hover{ text-decoration:underline;}
.agreement { margin-bottom:25px;}
.agreement .content{ height:400px; overflow:auto; background-color:#fff; overflow:auto; padding:15px 40px 15px 10px; color:#33335a; margin:15px 0; width:760px;}
.agreement .content p{ margin-bottom:20px;}
.agreement .content  h3{ margin-bottom:10px; font-size:23px;}
.agreement .confirm{ color:#33335a;}
.agreement .confirm .checker{ margin-right:0;}
.agreement .hint{ background-color:#33335a; font-size:11px; color:#fff; display:inline-block; padding:2px 10px;
width:580px;
height:20px;
line-height:20px;
overflow:hidden;
margin-bottom:-10px;
}
.agreement .hint span{
	padding:0; margin:0;
	margin-left:-40px;
	width:115%;
	font-size:12px;
transform: scale(0.85,0.85);
-ms-transform: scale(0.85,0.85); /* IE 9 */
-webkit-transform: scale(0.85,0.85); /* Safari and Chrome */
display:block;}
.agreement > strong{ background-position:0 -450px; color:#33335a; }
.agreement strong label{ font-size:11px;}

.personalInfo strong,.agreement > strong{ background-image:url(../images/join/form_icon.png); padding-left:23px; display:inline-block; height:25px; font-weight:normal;}
.personalInfo strong label,.agreement strong label{ line-height:25px;}
.personalInfo strong.passport{ background-position:0 -25px;}
.personalInfo strong.name,.personalInfo strong.surname,.personalInfo strong.number
{ background-position:0 -50px;}
.personalInfo strong.birthday,.personalInfo .tradingDate strong{ background-position:0 -75px;}
.personalInfo strong.title{ background-position:0 -100px;}
.personalInfo strong.company{ background-position:0 -125px;}
.personalInfo strong.position{ background-position:0 -150px;}
.personalInfo strong.country{ background-position:0 -175px;}
.personalInfo strong.region{ background-position:0 -200px;}
.personalInfo strong.province{ background-position:0 -225px;}
.personalInfo strong.city{ background-position:0 -250px;}
.personalInfo strong.zip{ background-position:0 -275px;}
.personalInfo strong.addr{background-position:0 -300px;}
.personalInfo strong.tel{background-position:0 -325px;}
.personalInfo strong.phone{background-position:0 -350px;}
.personalInfo strong.fax{background-position:0 -375px;}
.personalInfo strong.mail{background-position:0 -400px;}
.personalInfo strong.password{background-position:0 -425px;}

.personalInfo .queryText strong{background-position:0 -450px;}
.personalInfo .orderStatus strong{background-position:0 -525px;}

.personalInfo strong.creditCard{background-position:0 -550px;}
.personalInfo strong.duration{background-position:0 -575px;}
.personalInfo strong.faith{background-position:0 -600px;}

.userInfo .personalInfo{ border-bottom:1px solid #ccc; margin-bottom:10px;}

.personalInfo .addr .hint{ margin-left:150px;}
.userInfo .personalInfo input[type=text]{ width:150px; margin-right:5px;}

.password .pwStrength,.password strong,.password input{ float:left;}
.password .hint{ display:block;  clear:both; margin-left:100px;}

.pwStrength { width:200px; display:inline; margin-left:20px;}
.pwStrength li{ float:left; margin-right:5px; text-align:center; width:30px; font-size:8px; color:#999;}
.pwStrength .on span{ background-color:#33335a;}
.pwStrength .on{ color:#33335a;}
.pwStrength span{ display:block; background-color:#999; height:5px; margin-bottom:3px;}

#content .correct,#content .wrong{text-transform:uppercase; padding:2px 7px 2px 25px; color:#fff; font-size:13px; background-image:url(../images/join/btn_icon.png); height:18px; box-shadow: 0px 0px 15px rgba(20%,20%,40%,0.5); line-height:25px;}
#content .correct{ background-color:#33335a; background-position:0 0; }
#content .wrong{ background-color:#f15a24; background-position:0 -22px;}

.memberProfile .upload{  float:left; margin-right:5px; margin-top:2px;}
.memberProfile .upload input[type=text]{ margin-right:5px;}
/*.memberProfile .uploadBtn{ margin-right:15px;}*/

.upload{ display:inline-block;/* float:right; margin-right:65px;*/ vertical-align:middle; width:230px;}
tr.plan .upload{ position:relative; width:230px; }
#content .upload input[type=text]{ width:130px; margin-right:5px;}
tr.plan .selector{ width:120px;}
tr.plan .hint{ position:absolute; left:40px; top:30px; width:210px; }
tr.plan .hint span{ display:block; float:left; background-image:url(../images/join/what.png); width:12px; height:18px; margin:0 5px 30px 0; padding:0;}


/*==fileInput==*/
::-webkit-file-upload-button { cursor:pointer}

.upload input{ float:left; border:1px solid #c00;}
.uploadBtn{display:block; height: 22px; line-height:25px; width:85px; text-align:center; overflow: hidden; position: relative; cursor:pointer;  background-color:#33335a; font-size:13px; color:#fff; background-image:url(../images/join/btn_icon.png); background-position:98% -66px; text-indent:-5px;}
.uploadBtn:hover{box-shadow: 0px 0px 15px rgba(20%,20%,40%,0.5);}
.uploadBtn input
/*{ border:3px solid #c00; cursor: pointer; margin: 0; opacity: 0; position: absolute; left: 0; top: 0; transform: translate(-300px, 0px) scale(4); filter: alpha(opacity=0); height: 25px; width: 98px;  cursor:pointer; width:100%; height:100%; display:block; z-index:1;  z-index:1111;}*/
{ cursor: pointer; margin: 0; position: absolute; left: 0; top: 0; 
opacity: 0;  filter: alpha(opacity=0);  cursor:pointer; width:100%; height:100%; display:block;  z-index:1111;}


/*==login==*/
.login .block{ width:390px; float:left;}
.login .left{ margin-right:18px;}

.loginBlock{ background-color:#f2f2f2;box-shadow:0px 0px 15px rgba(20%,20%,40%,0.2);}
.loginBlock .head{ background-color:#33335a; padding:10px 30px; color:#fff; text-align:right;}
.loginBlock .bottom{ padding:25px 35px; position:relative; }
#content .loginBlock table{ }
.login h2{line-height:35px;}
#content .loginBlock h3{ color:#33335a; border-color:#33335a;}
#content.login .loginBlock th{ background-color:transparent; color:#33335a; font-size:13px; background-image:none; width:60px;}
#content .loginBlock th,#content .loginBlock td{ padding:0 0 10px 0;}
#content .loginBlock th span{ border-right:1px solid #33335a; display:block; width:30px; text-align:right; padding-right:5px; padding-left:15px;}
#content .loginBlock th.number span{ background-image:url(../images/login/ico_id.png);}
#content .loginBlock th.password span{ background-image:url(../images/login/ico_pw.png);}
#content .loginBlock tr:hover td{ background-color:transparent;}
#content .loginBlock input{ background-color:#ccc; height:27px; line-height:27px; padding:0 5px; color:#33335a; width:250px;}
#content .loginBlock .code input{ width:100px;}
#content .loginBlock .code th{ width:118px;}
#content .loginBlock input:focus{ background-color:#c1c1c1; }
#content.login table{ padding:5px 0; margin:0;}

#content .loginBlock .btnLogin,.login#content .btnJoin a{
color:#fff; width: 80px; height: 28px;  font-size:13px; line-height: 28px; text-align: center; text-indent: -5px; position: absolute; display:block; }
#content .loginBlock .btnLogin{right:35px; bottom:20px; background-image:url(../images/cart/arrow_next.png); background-position:62px center;}
.login .left{ padding-right:30px; width:360px; position:relative;}
.login .left{ line-height:20px; color:#666; font-size:11px;}
.login .left h3{ text-decoration:underline; font-size:11px; font-weight:normal; padding-left:10px; background-image:url(../images/cart/dot.png); background-position:left center;}
.login .left p{ margin-bottom:10px;}
.login .left a:hover{ text-decoration:none;}
#content.login a{ color:#33335a;}
.login .left .btnJoin{  position:absolute; right:0; background-image:url(../images/login/ico_join.png); padding-left:39px;  background-position:left center;  height:27px; width:80px;}
.login .left .btnJoin a{ display:block;}
.login .content{ float:left; padding-bottom:30px;}
.login .pdf,.login .report,.certification .btnSet a{ font-size:9px; text-decoration:none; padding-left:15px;}
.login .pdf,.certification .pdf{ background-image:url(../images/login/ico_pdf.png);  margin-right:5px;}
.login .report,.certification .report{ background-image:url(../images/login/ico_report.png);}
#content.login .pdf:hover,#content.login .report:hover{ text-decoration:underline;}

#content.login .forget{ text-decoration:none;}
#content.login .forget:hover{ text-decoration:underline;}
#content.login .code h3{ background-image:url(../images/login/ico_code.png);}

/*===member===*/
.member h3{ font-size:18px; margin-bottom:20px;}
.member .container > ul{ margin-bottom:40px;}
.member .container > ul > li{ border-bottom:1px solid #bbb; margin-bottom:20px; padding-bottom:20px; width:100%;}
.member .container li.p1{ margin-top:20px;}
#content .purchase { width:100%; float:left;}
#content .purchase li{ width:100%; float:left; margin-bottom:4px; background-image:url(../images/member/ico_plus.png); background-position:left center; padding-left:18px; font-size:11px; line-height:20px;}

/*btn*/
#content .purchase li .buy,#content .btnSubmit{ background-color:#999; color:#fff; padding:0 32px; line-height:20px; font-size:11px; text-decoration:none; height:20px;}
#content .purchase li .buy:hover,#content .btnSubmit:hover{ background-color:#33335a;}
#content .purchase li .buy{ float:left; display:block;}
#content .btnSubmit{ display:inline-block;}


#content .purchase div{ width:200px; float:left;}

#content .purchase span,.time span,.member .p1 .date span,
.history li span,.preferentail li span,.tradeDetail li span
{ color:#f15a24;}

.member .p1{ position:relative;}
.member .p1 .date{ background-image:url(../images/member/ico_date.png); height:28px; padding-left:30px; line-height:28px; margin:20px 0 15px 0;}
.member .p1 .time{ position:absolute; right:0; top:42px;}

.history li div,.preferentail li div{ color:#999;}

.history li,.preferentail .detail li{  margin-bottom:10px; line-height:20px; font-size:11px; padding-left:35px;}

.history li{ background-image:url(../images/member/history_ico1.png);}
.history li.style2{background-image:url(../images/member/history_ico2.png);}

li.tranHistory > ul li,li.profile > ul li,li.setting li{ float:left; width:50%; margin-bottom:10px;}
li.profile > ul,li.setting ul,li.tranHistory > ul{ float:left; width:100%;}

.profile li a,.setting li a,.tranHistory li a{ display:block; height:32px; text-decoration:none;padding-left:30px; line-height:32px; }
li.profile a:hover,li.setting a:hover,li.tranHistory a:hover{ text-decoration:underline;}

.setting ul li a,li.tranHistory > ul li a{ padding-left:35px;}
.profile li.modify a,.profile li.pw a{ }

.setting li.style1{ background-image:url(../images/member/setting_icon1.png);}
.setting li.style2{ background-image:url(../images/member/setting_icon2.png);}
.setting li.style3{ background-image:url(../images/member/setting_icon3.png);}
.setting li.style4{ background-image:url(../images/member/setting_icon4.png);}
.setting li.style5{ background-image:url(../images/member/setting_icon5.png);}
.setting li.style6{ background-image:url(../images/member/setting_icon6.png);}



.profile li.modify a{ background-image:url(../images/login/ico_id.png);}
.profile li.pw a{ background-image:url(../images/login/ico_pw.png);}
.profile li.toPassport{background-image:url(../images/member/ico_passport.png);}

.tranHistory li.orderInquiry a{ background-image:url(../images/member/history_ico1.png);}
.tranHistory li.serviceQuery a{ background-image:url(../images/member/ico_order_detail.png);}

.preferentail .detail{ overflow:auto; margin-bottom:15px; border-bottom:1px solid #ccc; padding-bottom:15px;}
.preferentail .detail li{ width:360px; float:left;}
.preferentail li.style1{ background-image:url(../images/member/preferential_icon1.png);}
.preferentail li.style2{ background-image:url(../images/member/preferential_icon2.png);}
.preferentail li.style3{ background-image:url(../images/member/preferential_icon3.png);}
.preferentail li.style4{ background-image:url(../images/member/preferential_icon4.png);}

.preferentail .twoColumn table{ border:2px solid #33335a;}

.tabsUI{}
.tabsUI .ui-tabs-nav{ background-color:#999; border-top:2px; border-right:2px; border-left:2px; border-color:#33335a; border-style:solid;}
.tabsUI .ui-tabs-nav li{  height:25px;}
.tabsUI .twoTab li{ width:50%;}
.tabsUI .threeTab li{ width:33.33%;}
.tabsUI .ui-tabs-nav li a {	display:block; width:98.5%;	text-align:center;	margin:0 auto; height:100%; color:#fff; font-size:13px; line-height:25px; text-transform:uppercase; background-color:#999;}
#content .tabsUI .ui-tabs-nav li.ui-tabs-active a,#content .tabsUI .ui-tabs-nav li.ui-tabs-active{ background-color:#33335a;}
#content .preferentail .ui-tabs-panel th{ text-transform:none;}

.preferentail caption{ background-color:#33335a; color:#fff; text-transform:uppercase; text-align:center; font-size:17px;}
#content .preferentail .twoColumn th{ padding:5px 0;}
#content .preferentail .twoColumn th,.preferentail .twoColumn td{ font-size:10px; text-align:center;  padding:5px 0;}
.preferentail .twoColumn td{ color:#33335a; border-right:1px solid #e6e6e6;}
.preferentail .twoColumn td.up,.preferentail .twoColumn td.down{ background-position:10% center;}
.preferentail .twoColumn td.up{ background-image:url(../images/member/arrow_up.png);}
.preferentail .twoColumn td.down{ background-image:url(../images/member/arrow_down.png);}
.preferentail .twoColumn tr:nth-child(2n+1) td{ background-color:#ccc;}
.preferentail .twoColumn > div{ width:395px; float:left;}
.preferentail .twoColumn .right{ margin-right:0;}


.clock li{ width:20%; float:left; margin-bottom:30px; color:#333; line-height:20px;}
.clock ul{ overflow:auto; margin-bottom:10px;}
.clock span{ display:block; width:20px; height:20px;  border-radius:50%; float:left;}
.clock strong{ background-image:url(../images/cart/dot.png); padding-left:5px; background-position:left center; margin-left:5px; font-weight:normal;
display:inline-block; width:70px; font-size:11px;}
.clock em{ color:#33335a; font-style:normal; font-weight:bold;}


/*===other Page===*/
#content h3.title{ font-weight:normal; font-size:17px; line-height:16px; margin-bottom:10px;  text-transform:uppercase;}
#content .contentText,#content .contentImg{ margin-bottom:25px;}
#content .contentText{ color:#666; font-size:11px; line-height:19px;}
#content .contentImg{ background-color:#b3b3b3;  height:310px;}
#content hr{ border:none; background-image:url(../images/product/line.png); height:5px; background-repeat:repeat-x; width:100%; margin-bottom:15px;}
#content .table{ margin-bottom:20px; border-left:1px solid #33335a; border-collapse:collapse;}
#content .table th,#content .table td{ border-right:1px solid #33335a; border-bottom:1px solid #33335a; }
#content .table th{  font-size:17px; text-align:center;}
#content .table td{ padding-left:5px;}

/*===== phase2 =====*/

/*===diamond slide===*/
.slider-polish .ui-slider-range{ background-color:#999;}
.label { margin-top:5px;}
.label li{ float:left; color:#ccc; display:block; transform: scale(0.8,0.8);-ms-transform: scale(0.8,0.8);-webkit-transform: scale(0.8,0.8);}
.label li.on{  color:#33335a;}
.fourColumn .label li{ width:25%;  margin:0;}
.fiveColumn .label li{ width:20%;  margin:0;}
.sixColumn .label li{ width:16.6%;  margin:0;}


#content .fourColumn .ui-widget-content{  background:url(../images/product/bg_4column.gif) repeat-x left top;}
#content .fiveColumn .ui-widget-content{  background:url(../images/product/bg_5column.gif) repeat-x left top;}
#content .sixColumn .ui-widget-content{  background:url(../images/product/bg_6column.gif) repeat-x left top;}





#content .fourColumn .ui-widget-header,#content .fiveColumn .ui-widget-header,#content .sixColumn .ui-widget-header
{ background-color:#ccc; background-repeat:repeat-x; background-position:left; }
#content .fourColumn .ui-widget-header{ background-image:url(../images/product/bg_4column_dark.gif);}
#content .fiveColumn .ui-widget-header{ background-image:url(../images/product/bg_5column_dark.gif);}
#content .sixColumn .ui-widget-header{ background-image:url(../images/product/bg_6column_dark.gif);}
/*#content .fourColumn .ui-widget-content,#content .fiveColumn .ui-widget-content,#content .sixColumn .ui-widget-content
{ background-color:transparent; }*/
#content .fourColumn {  background:url(../images/product/bg_4column.gif) repeat-x transparent left top; background-color:transparent;}
#content .fiveColumn {  background:url(../images/product/bg_5column.gif) repeat-x transparent left top; background-color:transparent;}
#content .sixColumn {  background:url(../images/product/bg_6column.gif) repeat-x transparent left top; background-color:transparent;}
.member .section table{ border-bottom:1px solid #ccc; margin-bottom:10px;}
.member .section { margin-bottom:20px; padding-bottom:10px;}
.member table.head{ text-align:center; font-size:12px; margin-bottom:0;}
#content.member table th{ font-size:12px;}
#content .historyList table.head th{ padding:5px 5px;}
.headFixTable .head{}


.historyList .date{ width:45px;}
.historyList .num{ width:66px; }
#content .resultTable td.num,#content .resultTable td.price
{color:#33335a;}
.historyList .logistic{ width:155px;}
.historyList .shipping{ width:105px;}
.historyList .orderStatus{ width:90px;}
.historyList .cancelation{ width:100px;}
.historyList .refund{ width:65px;}
.historyList .replacement{ width:95px;}
.historyList .service{ }
#content.member .table{ width:100%; border-left:0;}
#content.member .table td{ border:none;}
#content .headFixTable .table td{ padding:5px;}
.resultTable{/* margin-bottom:20px;*/}
.resultTable td span{ display:block; transform: scale(0.8,0.8);-ms-transform: scale(0.8,0.8);-webkit-transform: scale(0.8,0.8); }
.resultTable{ position:relative; z-index:1;}
.tableContent{ height:350px;}
.result .tableContent{ height:600px; overflow: auto;}
.compare .tableContent{ height:240px; overflow: auto;}
.member tr:hover td{ background-color:#ccc;}
.preferabtialAccount .detail{ margin-bottom:20px; overflow:auto;}
.preferabtialAccount .detail li{ width:355px; float:left; padding-left:35px; color:#999;}
.preferabtialAccount .detail h5{ color:#333; font-weight:normal;}
.preferabtialAccount .detail h5 span{ color:#f15a24; margin-left:5px;}
#content .tradeDetail{ border-bottom:1px solid #ccc; margin-bottom:20px;}
#content .tradeDetail ul{ margin-bottom:15px; margin-top:10px;}
#content .tradeDetail li{ display:inline; padding-left:10px; background-image:url(../images/cart/dot.png); background-position:left center; margin-right:10px;}
#content .tradeDetail input{ width:80px; text-align:center; color:#33335a; margin:0 5px;}
.tradeDetail .table tr:nth-child(2n+1) td{ background-color:#e0e0e0;}
#content .memberProfile hr,#content .orderDetail hr{ border-bottom:1px solid #ccc; background-image:none; height:1px; margin-bottom:10px;}
#content .memberProfile td{ padding:5px;}
.passportImg img{ border:10px solid #33335a; display:block;}
.orderDetail table td,.customerFeedback td,.tranHistory td,.p1 td{ padding:6px 10px;}
.orderDetail h4 span,.customerFeedback h4 span{ background-image:url(../images/cart/dot.png); padding-left:5px; background-position:left center;}
.orderDetail h4,.customerFeedback h4{line-height:32px; padding-left:32px; background-position:left center;}
#content .orderDetail .threeColumn input{ width:120px;}
#content .orderDetail .oneColumn input{ width:600px;}
.customerFeedback h4{ background-image:url(../images/member/ico_customer_feedback.png); }
.orderDetail h4{ background-image:url(../images/member/ico_order_detail.png); }
#content .customerFeedback input.title{ width:490px;}
#content .customerFeedback textarea{ width:690px; height:85px; display:block; margin:5px 0 5px 70px;}
.tranHistory table.personalInfo{ margin-bottom:20px;}
.personalInfo tr.tradingDate input{ width:80px; margin:0 5px;}
.personalInfo tr.queryText input{ width:215px;}
#content .validCode .hint{ color:#33335a;}
.validCode img{ vertical-align:middle;}
#content .validCode input{ width:50px;}
.passportHint{ margin-left:160px;}
.dropdown .btnSubmit{display: block; width: 85px; height:23px; line-height:22px; background: #E6E6E6; position: absolute; top: 2px; left: 240px; text-align:center; color:#33335a; text-decoration:none;}
.dropdown .btnSubmit:hover{ color:#000; background-color:#fff;}
.overlay{ width:100%; height:100%; display:block; left:0; top:0; position:absolute; background-color:rgba(230,230,230,0.9); z-index:3; border:1px solid #33335a; display:none;}
.overlay .btnReSelect,.overlay .update{ position:absolute; left:50%; top:50%; display:block; text-indent:-90000px;}
.overlay .btnReSelect{ background-image:url(../images/product/btn_reselect.gif); width:139px; height:139px; margin-left:-69px; margin-top:-69px;}
.overlay .update{ background-image:url(../images/product/img_update.gif); width:80px; height:80px; margin-left:-40px; margin-top:-40px;}


/*==toggle==*/
.toggle{ display:inline-block;}
.toggle-slide {  overflow: hidden;  cursor: pointer;  -webkit-touch-callout: none;  -webkit-user-select: none;  -khtml-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  direction: ltr;}
.toggle-slide .toggle-on,.toggle-slide .toggle-off,.toggle-slide .toggle-blob {  float: left;}
.toggle-slide .toggle-blob {  position: relative;  z-index: 99; cursor: hand;  cursor: grab;  cursor: -moz-grab;  cursor: -webkit-grab;}
.toggle-slide {  overflow: hidden;  cursor: pointer;  -webkit-touch-callout: none;  -webkit-user-select: none;  -khtml-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  direction: ltr;}
.toggle-slide .toggle-on,.toggle-slide .toggle-off,.toggle-slide .toggle-blob {    float: left;}
.toggle-slide .toggle-blob {    position: relative;    z-index: 99;    cursor: hand;    cursor: grab;    cursor: -moz-grab;    cursor: -webkit-grab;}
.toggle-light .toggle-slide {  border-radius: 9999px;  box-shadow: 0 0 0 1px #999;}
.toggle-light .toggle-slide .toggle-on,.toggle-light .toggle-slide .toggle-off,.toggle-light .toggle-slide .toggle-blob 
{  font-size: 11px;  font-weight: 500;}
.toggle-light .toggle-slide .toggle-on, .toggle-light .toggle-select .toggle-inner .active 
{  background:#33335a;  box-shadow: inset 2px 2px 6px rgba(0,0,0,0.2);  text-shadow: 1px 1px rgba(0,0,0,0.2);  color: rgba(255,255,255, 0.8);}
.toggle-light .toggle-slide .toggle-off, .toggle-light .toggle-select .toggle-on {  color:#fff;  text-shadow: 0 1px rgba(255,255,255,0.2);   background-color:#808080;}
.toggle-light .toggle-slide .toggle-blob 
{ border-radius: 50px;  background: #cfcfcf;  background: -moz-linear-gradient(bottom,  #cfcfcf 0%, #f5f5f5 100%);  background: -webkit-gradient(linear, left bottom, left top, color-stop(0%,#cfcfcf), color-stop(100%,#f5f5f5));  background: -webkit-linear-gradient(bottom,  #cfcfcf 0%,#f5f5f5 100%);  background: -o-linear-gradient(bottom,  #cfcfcf 0%,#f5f5f5 100%);  background: -ms-linear-gradient(bottom,  #cfcfcf 0%,#f5f5f5 100%);  background: linear-gradient(to top,  #cfcfcf 0%,#f5f5f5 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfcfcf', endColorstr='#f5f5f5',GradientType=0 );  box-shadow: 1px 1px 2px #888;}
.toggle-light .toggle-slide .toggle-blob:hover {  background: #e4e4e4;}


#content .ui-slider-horizontal .ui-slider-handle{ margin:0 0 0 -17px; background-color:#999;}
#content .ui-slider-range + .ui-state-default{ margin:0 0 0 0px; }