/* basics */
html{
background:url(images/clouds_bg.jpg) #91e9f2 top left repeat-x fixed;
}
body{
margin:0;
padding:0;
font:12px normal Arial, Helvetica, sans-serif;
background:url(images/bp_bg.png) 50% 50% repeat-y;
background:transparent;
width:100%;
height:100%;
}

#pagewidth{
width:1000px;
text-align:left;
margin:0 auto;
background:#fff;
border-left:1px #73d8e5 solid;
border-right:1px #73d8e5 solid;
}

/* header */
#header{
height:80px;
background:url(images/header_bg.png) top center repeat-x;
width:1000px;
margin:0;
padding:0;
}
#header #logo{
height:80px;
width:225px;
float:left;
display:inline;
margin:0;
padding:0;
}
#header #navi{
height:80px;
width:775px;
float:right;
margin:0;
padding:0;
}
/*jhb_navi1*/
#navi #jhb_navi1{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi1 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi1.png);
text-decoration:none;
}

#navi #jhb_navi1 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi1*/
/*jhb_navi2*/
#navi #jhb_navi2{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi2 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi2.png);
text-decoration:none;
}

#navi #jhb_navi2 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi2*/
/*jhb_navi3*/
#navi #jhb_navi3{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi3 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi3.png);
text-decoration:none;
}

#navi #jhb_navi3 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi3*/
/*jhb_navi4*/
#navi #jhb_navi4{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi4 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi4.png);
text-decoration:none;
}

#navi #jhb_navi4 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi4*/
/*jhb_navi5*/
#navi #jhb_navi5{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi5 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi5.png);
text-decoration:none;
}

#navi #jhb_navi5 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi5*/
/*jhb_navi6*/
#navi #jhb_navi6{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi6 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi6.png);
text-decoration:none;
}

#navi #jhb_navi6 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi6*/
/*jhb_navi7*/
#navi #jhb_navi7{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi7 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi7.png);
text-decoration:none;
}

#navi #jhb_navi7 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi7*/
/*jhb_navi8*/
#navi #jhb_navi8{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
}
#navi #jhb_navi8 a{
margin:0;
padding:0;
width:110px;
height:80px;
float:left;
display:inline;
background-image:url(images/jhb_navi8.png);
text-decoration:none;
}

#navi #jhb_navi8 a:hover{
background-position:bottom;
text-decoration:none;
}
/*end jhb_navi8*/
/* left sidebar */
#left{
width:160px;
float:left;
display:inline;
}
h3{
height:40px;
font:1.25em normal Arial, Helvetica, sans-serif;
text-align:center;
line-height:2.5em;
vertical-align:middle;
margin:0;
padding:0;
color:#444;
background:url(images/h3_bg.png) bottom left no-repeat;
}
#left ul
{
list-style: none;
margin: 0 4px;
padding:0;
border: none;
}

#left ul li
{
text-align:left;
display: block;
margin: 2px 0;
padding: 3px 10px;
letter-spacing:1px;
background:url(images/list_bg.png) bottom left repeat-x;
}
#left ul li a{
display: block;
}
#left ul li a:hover{
background:url(images/linkarrow.gif) #fff top right no-repeat;
}
/* center main content */
#main{
background: #FFFFFF;
float: left;
width:620px;
padding:0 10px;
}
#main1{
background: #FFFFFF;
float: left;
width:620px;
padding:0 10px;
}
#main2{
background: #FFFFFF;
float: left;
width:840px;
padding:0 0px;
}


.smallslider{position:relative;padding:0;margin:0;overflow:hidden;}
.smallslider ul{list-style-type:none;padding:0;margin:0;position: absolute;width:auto;height:auto;}
.smallslider li{margin:0;padding:0;}
.smallslider li a{margin:0;padding:0;}
.smallslider li a img{border:0;padding:0;margin:0;vertical-align:top;}
.smallslider  h3{position:absolute;font-weight:bold;font-size:12px;margin:0;padding:0;text-indent:2%;line-height:26px;z-index:102; width:98%;color:#CCC;}
.smallslider  h3 a{padding:0;margin:0;text-indent:0; }
.smallslider  h3 a:link,.smallslider  h3 a:visited{text-decoration:none;color:#FFFFFF;}
.smallslider  h3 a:hover{text-decoration:underline;color:#FF6600;}
.smallslider li.current-li{}
.smallslider-btns{position:absolute;z-index:103;}
.smallslider-btns span{background-color:#057176;border:1px solid #057176;color:#FFFFFF;cursor:pointer;float:left;font-size:12px;height:16px;line-height:16px;text-align:center; width:16px;}
.smallslider-btns span.current-btn{ background-color:#67bdc2; border:1px solid #67bdc2; color:white; font-size:13px;font-weight:bold;}
.smallslider-lay{position:absolute;background:black;height:26px;width:100%; z-index:101;}
#debug{width:200px;height:200px;border:1px solid;background:#CCC;position:fixed;left:10px;bottom:20px; }
#flashbox{width:620px; height:200px;border:none;}


.adsbox{
width:618px;
height:100px;
padding:0;
margin:4px auto;
border:1px solid #ddd;
}
.picads{
width:309px;
height:100px;
padding:0;
margin:0;
float:left;
display:inline;
overflow:hidden;
}
.txtads{
width:309px;
height:100px;
padding:0;
margin:0;
float:right;
clear:right;
overflow:hidden;
}
.txtads p{
font:1.25em normal Arial, Helvetica, sans-serif;
color:#444;
margin:0;
padding:4px;
letter-spacing:0.1em;
line-height:1.5em;
}
.servicebox{
width:618px;
height:100px;
padding:2px;
margin:2px;
float:left;
display:inline;
overflow:hidden;
}
.servicebox p{
font:1.12em normal Arial, Helvetica, sans-serif;
color:#222;
margin:0;
padding:12px;
letter-spacing:0.1em;
line-height:1.12em;
}
.floatr{
font:1em normal Arial, Helvetica, sans-serif;
float:right;
margin:0 4px;
padding:2px;
line-height:1.5em;
border:1px solid #ddd;
}
.floatr a{
background:#b7ecf3;
padding:2px 8px;
}
.floatr a:hover{
background:#fc0;
}
.infobox{
width:618px;
height:380px;
padding:0;
margin:4px auto;
border:1px solid #ddd;
}
h4{
height:45px;
font:1.25em normal Arial, Helvetica, sans-serif;
text-align:left;
line-height:3.5em;
vertical-align:middle;
margin:0;
padding:0 30px;
color:#444;
background:url(images/h4_bg.png) bottom left no-repeat;
}
.leftinfo{
width:308px;
height:330px;
padding:0;
margin:0;
float:left;
display:inline;
overflow:hidden;
}
.rightinfo{
width:308px;
height:330px;
padding:0;
margin:0;
border-left:1px solid #eee;
float:right;
clear:right;
overflow:hidden;
}
.leftinfo ul,.rightinfo ul
{
list-style: none;
margin: 0 4px;
padding:0;
border: none;
}

.leftinfo ul li,.rightinfo ul li
{
font:1em normal Arial, Helvetica, sans-serif;
text-align:left;
display: block;
margin: 2px 0;
padding: 6px 10px;
letter-spacing:1px;
background:url(images/list_bg.png) bottom left repeat-x;
}
.leftinfo ul li a,.rightinfo ul li a{
display: block;
}
.leftinfo ul li a:hover,.rightinfo ul li a:hover{
background:url(images/linkarrow.gif) #fff top right no-repeat;
}
/* left & main */
#twocols{
width:840px;
float:left;
}

#right{
width:200px;
float:right;
background:#fff;
overflow:hidden;
clear:right;
}
/*jhb_login*/
#right #jhb_login{
margin:0 auto;
padding:0;
float:left;
display:block;
width:200px;
height:40px;

}
#right #jhb_login a{
margin:0 auto;
padding:0;
float:left;
display:block;
text-align:center;
width:200px;
height:40px;
background-image:url(images/login.png);
text-decoration:none;
}

#right #jhb_login a:hover{
background-position:bottom;
text-decoration:none;
}
#right p{
font:1em normal Arial, Helvetica, sans-serif;
color:#444;
margin:0;
padding:0 2px;
letter-spacing:0.1em;
line-height:1.5em;
}
/*end jhb_login*/
/* footer */
#footer{
margin:0;
padding:10px;
height:60px;
background:url(images/footer_bg.gif) #C3D600 bottom left repeat-x;
text-align:center;
clear:both;
}
#footer p{
font:0.88em normal Arial, Helvetica, sans-serif;
color:#555;
letter-spacing:0.1em;
line-height:1.5em;
margin:0;
padding:0;
}
#footer p a{
color:#000;
text-decoration:none;
padding:2px;
}
#footer p a:hover{
color:#fff;
text-decoration:none;
background:#000;
}
/*連結樣式*/
a {noFocusLine:expression(this.onFocus=this.blur())} /* For IE */
:focus {-moz-outline-style: none} /* For Firefox */
a {
color:#006699;
text-decoration:none;
}
a:hover{
color:#ff5500;
text-decoration:none;
}
/* 滑過顯示圖片CSS */
.ddimgtooltip{
box-shadow: 3px 3px 5px #818181; /*shadow for CSS3 capable browsers.*/
-webkit-box-shadow: 3px 3px 5px #818181;
-moz-box-shadow: 3px 3px 5px #818181;
display:none;
position:absolute;
border:1px solid black;
background:white;
color: black;
z-index:2000;
padding: 4px;
}
/* 中央內嵌頁面 */
#ibody{
width:620px;
margin:0 auto;
padding:0;
background:#fff;
}
#ibody2{
width:840px;
margin:0 auto;
padding:0;
background:#fff;
}
#icontent{
width:610px;
margin:0 auto;
padding:0;
}

#icontent h2{
height:40px;
font:1.25em normal Arial, Helvetica, sans-serif;
letter-spacing:0.1em;
text-align:left;
line-height:2.5em;
vertical-align:middle;
margin:0;
padding:0;
color:#000;
/* background:url(images/h4_bg.png) bottom left no-repeat; */
}

#icontent p{
font:1em normal Arial, Helvetica, sans-serif;
color:#444;
margin:0 0 1em;
padding:0;
letter-spacing:0.1em;
line-height:1.5em;
}
#icontent ul
{
list-style: none;
margin: 0px auto;
padding:0;
border: none;
}

#icontent ul li
{
color:#333;
text-align:left;
display: block;
margin: 5px 0;
padding: 0px 0px 0px 25px;
letter-spacing:1px;
vertical-align:baseline;
background:url(images/ic_list_bg.png) top left no-repeat;
border-bottom:1px #eee solid;
list-style-position:inside;
}
#icontent ul.bluedot li
{
color:#333;
text-align:left;
display: block;
margin: 2px 20px;
padding: 2px 0 4px 20px;
letter-spacing:1px;
vertical-align:baseline;
background:url(images/bluedot.png) top left no-repeat;
border-bottom:1px #eee solid;
}
#icontent ul.greendot li
{
color:#333;
text-align:left;
display: block;
margin: 2px 20px;
padding: 3px 0 3px 20px;
letter-spacing:1px;
vertical-align:baseline;
background:url(images/greendot.png) center left no-repeat;
border-bottom:1px #eee solid;
}

#icontent2{
width:800px;
margin:0 20px;
padding:0;
}
#icontent2 h2{
height:40px;
font:1.25em normal Arial, Helvetica, sans-serif;
letter-spacing:0.1em;
text-align:left;
line-height:2.5em;
vertical-align:middle;
margin:0;
padding:0;
color:#000;
/* background:url(images/h4_bg.png) bottom left no-repeat; */
}

#icontent2 p{
font:1em normal Arial, Helvetica, sans-serif;
color:#444;
margin:0 0 0.5em;
padding:0;
letter-spacing:0.1em;
line-height:1.5em;
}
#icontent2 ul
{
list-style: none;
margin: 0px auto;
padding:0;
border: none;
}

#icontent2 ul li
{
color:#333;
text-align:left;
display: block;
margin: 5px 20px;
padding: 0px 0px 0px 25px;
letter-spacing:1px;
line-height:1.5em;
vertical-align:baseline;
background:url(images/ic_list_bg.png) top left no-repeat;
border-bottom:1px #eee solid;
list-style-position:inside;
}
#icontent2 ul.bluedot li
{
color:#333;
text-align:left;
display: block;
margin: 2px 20px;
padding: 2px 0 4px 20px;
letter-spacing:1px;
vertical-align:baseline;
background:url(images/bluedot.png) top left no-repeat;
border-bottom:1px #eee solid;
}
#icontent2 ul.greendot li
{
color:#333;
text-align:left;
display: block;
margin: 2px 20px;
padding: 3px 0 3px 20px;
letter-spacing:1px;
vertical-align:baseline;
background:url(images/greendot.png) center left no-repeat;
border-bottom:1px #eee solid;
}

.h6{
font:15px bold arial;
color:#cc0000;
vertical-align:baseline;
line-height:150%;
margin:0;
padding:0;
}
/* 表格 */
/* table{
font:12px normal Arial, Helvetica, sans-serif;
letter-spacing:1px;
color:#333;
border-top:1px solid #76b1d9;
border-left:1px solid #76b1d9;
margin:10px 0;
}
td{
border-bottom:1px solid #76b1d9;
border-right:1px solid #76b1d9;
background:#f7ffff;
} */
table{
font:12px normal Arial, Helvetica, sans-serif;
letter-spacing:1px;
color:#333;
}
td{
} 
th{
font-weight:normal;
border-bottom:1px solid #76b1d9;
border-right:1px solid #76b1d9;
background:#e5f7ff;
}
.tablenostyle,.tablenostyle td{
border:0;
}
/*中央內頁小項目標題*/
h5{
font-size:15px;
background:url(images/iya.gif) left top no-repeat;
margin:2px;
padding:3px 0 3px 25px;
color:#45740d;
}
.indent{
text-indent: 25px;
}
.caution{
color:#333;
letter-spacing:1px;
padding:5px 5px 5px 25px;
margin:0;
background:url(images/bg_caution.gif) #e9f291 1% 40% no-repeat;
vertical-align:baseline;
line-height:150%;
}
.hr{
margin:10px 0;
padding:0;
display:block;
clear:both;
height:5px;
background:url(images/hr_bg.gif) center left repeat-x;
}
.tableLine {
  border:0px solid #000; 
  border-collpase:collpase;
  background:#fff; 
}



/* css for Dealer page */
#dealer-wapper { width:680px; background:url(images/dealer-banner.jpg) no-repeat; padding:190px 80px 50px; background-color:#FFFFFF; font-size:15px; color:#333333; line-height:30px; }
#dealer-info { width:705px; height:387px; background:url(images/dealer-bg.jpg); margin:10px 0 0 -15px; position:relative; }
#dealer-info1 { position:absolute; top:58px; left:70px; line-height:36px; }
#dealer-info2 { position:absolute; top:326px; left:160px; line-height:36px; font-size:13px; color:#444444; line-height:20px; line-height:22px; }
#dealer-message { width:435px; margin:35px auto; }
#dealer-message p { height:23px; border-bottom:1px solid #cecece; }
#dealer-message span { width:100px; float:left; font-size:13px; background:url(images/dealer-icon.gif) no-repeat; padding:0 0 0 17px; line-height:13px; color:#444444; margin:-3px 10px 0 0; }
.dealer-input1 { border:1px solid #a3ccd4; background-color:#f4f9fa; height:15px; width:300px; margin-top:-5px; }
.dealer-input2 { border:1px solid #a3ccd4; background-color:#f4f9fa; height:15px; width:180px; margin-top:-5px; } 
.dealer-input3 { border:1px solid #a3ccd4; background-color:#f4f9fa; height:15px; width:60px; margin-top:-5px; }
.dealer-input4 { border:1px solid #a3ccd4; background-color:#f4f9fa; height:15px; width:261px; margin-top:-5px; }
#dealer-message strong { font-size:13px; line-height:9px; font-weight:normal; color:#444444; margin-right:5px }
#dealer-textarea { border:1px solid #a3ccd4; background-color:#f4f9fa; height:120px; width:300px; margin-top:-5px; }
.dealer-btn { background:url(images/dealer-btn.gif); width:91px; height:29px; border:0; font-size:12px; color:#555555; }


/*20110901修正Product、Easypage*/
.tag {  font-family: "新細明體"; font-size: 13px; line-height: 21pt;  font-weight: bold; color: #616161;}
.tag a:link { color: #616161; font-weight: bold; text-decoration: none;}
.tag a:visited { color: #616161; font-weight: bold; text-decoration: none;}
.tag a:hover { color: #616161; font-weight: bold; text-decoration: underline;}

.word01 {  font-family: "Arial"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #000000;}
.word01 a:link { color: #000000; font-weight: normal; text-decoration: none;}
.word01 a:visited { color: #000000; font-weight: normal; text-decoration: none;}
.word01 a:hover { color: #000000; font-weight: normal; text-decoration: underline;}

.word02 {  font-family: "Arial"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #ff0000;letter-spacing:0;}
.word02 a:link { color: #ff0000; font-weight: normal; text-decoration: none;}
.word02 a:visited { color: #ff0000; font-weight: normal; text-decoration: none;}
.word02 a:hover { color: #ff0000; font-weight: normal; text-decoration: underline;}

.word03 {  font-family: "Arial"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #000db4;}
.word03 a:link { color: #006699; font-weight: normal; text-decoration: none;}
.word03 a:visited { color: #006699; font-weight: normal; text-decoration: none;}
.word03 a:hover { color: #ff5500; font-weight: normal; text-decoration: underline;}

.ps {  font-family: "Arial"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #454545}
.ps a:link { color: #006699; font-weight: normal; text-decoration: none}
.ps a:visited { color: #006699; font-weight: normal; text-decoration: none;}
.ps a:hover { color: #ff5500; font-weight: normal; text-decoration: underline;}

.bg_nonrepeat {	background-repeat: no-repeat;}

.word04 {  font-family: "微軟正黑體"; font-size: 16px; line-height: 21pt;  font-weight: normal; color: #000000}
.word04 a:link { color: #000000; font-weight: normal; text-decoration: none}
.word04 a:visited { color: #000000; font-weight: normal; text-decoration: none;}
.word04 a:hover { color: #000000; font-weight: normal; text-decoration: underline;}

.word05 {  font-family: "新細明體"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #000000}
.word05 a:link { color: #000000; font-weight: normal; text-decoration: none}
.word05 a:visited { color: #000000; font-weight: normal; text-decoration: none;}
.word05 a:hover { color: #000000; font-weight: normal; text-decoration: underline;}

.word06 {  font-family: "Arial"; font-size: 13px; line-height: 18pt;  font-weight: normal; color: #000db4}
.word06 a:link { color: #006699; font-weight: normal; text-decoration: none}
.word06 a:visited { color: #006699; font-weight: normal; text-decoration: none;}
.word06 a:hover { color: #ff5500; font-weight: normal; text-decoration: underline;}

/* 20111004修正MiniShop */
#mini_shop { width:620px; font-family:Arial; background:url(./images/mini_shop_bg.png) no-repeat; padding-top:160px; }
#mini_shop #menu { text-align:center; }
#mini_shop #menu img { margin:0 3px; border:none; }
#mini_shop b { font-size:15px; color:#077fbb; display:block; clear:both; margin:5px 10px; margin-bottom:10px; }
#mini_shop p { color:#333333; font-size:13px; line-height:30px; margin:0 10px; }
.mini_shop_tab { font-size:13px; color:#333333; margin:10px 0 0 10px; border:1px solid #b3e2eb; border-collapse:collapse; }
.mini_shop_tab td { border-color:#ffffff; }
.mini_shop_tab i { color:#e71818; font-size:13px; font-family:Verdana; font-weight:bold; letter-spacing:-1px; margin-left:3px; font-style:normal; }
#mini_shop span { font-size:13px; color:#333333; font-weight:bold; margin:10px 0 0 10px; display:block; }
