@charset "utf-8";
@import url("reset.css");
/* CSS Document */



/* logo banner區 */

.TOP1{  position:relative; margin:0 auto; width:1004px; height:53px; background-image:url(images/3c_01.gif); background-repeat:no-repeat; background-position:left top; }

.TOP1 .logo{ position:absolute; left:0; top:0}

.TOP1 .banner{ position:absolute; left:221px; top:6px;}

.TOP1 ul{ position:absolute; left:767px; bottom:0;}

.TOP1 li{ float:left;}

.TOP1 li a{ display:block; width:62px; height:18px; background-image:url(images/arrow_icon.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; font-size:12px; color:#16517a; line-height:18px; text-decoration:none; padding-left:12px;}

.TOP1 li a:hover{ color:#16517a; text-decoration:underline;}

.TOP1 li.goods a{ display:block; width:75px; height:18px; background-image:url(images/arrow_icon.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; font-size:12px; color:#16517a; line-height:18px; text-decoration:none; padding-left:12px;}

.TOP1 li.goods a:hover{ color:#16517a; text-decoration:underline;}

/* menu */

.TOP2{  position:relative; margin:0 auto; width:1004px; height:59px; background-image:url(images/hilifemenu_03.gif); background-repeat:no-repeat; background-position:left top; }

.TOP2 ul{ position:absolute; left:11px; top:8px;}

.TOP2 li{ float:left;}

.TOP2 li.home a{ display:block; width:81px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top; height:40px; text-indent:-9999px;}

.TOP2 li.menu1 a{ display:block; width:108px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top;  height:40px; text-indent:-9999px;}

.TOP2 li.menu2 a{ display:block; width:109px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top;  height:40px; text-indent:-9999px;}

.TOP2 li.menu3 a{ display:block; width:113px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top;  height:40px; text-indent:-9999px;}

.TOP2 li.menu4 a{ display:block; width:137px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top;  height:40px; text-indent:-9999px;}


/* 會員專區 */

.TOP2 span ul{ position:absolute; left:727px; top:8px; }

.TOP2 span li{ float:left; margin:0 4px;}

.TOP2 span li.hilife_account a{ display:block; width:121px; height:40px; background-image:url(images/point.gif); background-repeat:repeat; background-position:left top;  text-indent:-9999px;}

.TOP2 span li.hilife_beginner a{  display:block; width:121px; height:40px;  background-image:url(images/point.gif); background-repeat:repeat; background-position:left top; text-indent:-9999px;}

/* 搜尋熱門 */

.TOP3{  position:relative; margin:0 auto; width:1004px; height:34px; background-image:url(images/hilife_04.gif); background-repeat:no-repeat; background-position:left top; }

.TOP3 span.search{ display:block; position:absolute; left:19px; width:265px; height:21px;}

.TOP3 span.search input.key{ background-color:#FFF; padding:2px; font-family:Arial; font-size:12px; color:#808080; border:#7f9db9 solid 1px;}

.TOP3 span.search_btn{ display:block; position:absolute; left:283px; width:56px; height:21px;}

.TOP3 span.hotnews{ display:block; position:absolute; left:350px; width:600px; height:24px; background-image:url(images/hot_news.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; font-size:12px; color:#16517a; line-height:24px; letter-spacing:1px; padding-left:42px;}

.TOP3 span.hotnews a{color:#003151; text-decoration:none;}

.TOP3 span.hotnews a:hover{ text-decoration:underline;}


/* 主要館別促銷 */

.BOX_margin{ margin-bottom:6px;}

.hilife_mainBOX{ background-image:url(images/linebg2.gif); background-repeat:repeat-y; background-position:center top;}

.headline_h2{ font-family:Arial; font-size:16px; color:#16517a; line-height:25px;}

.BG_LINE{ background-image:url(images/mainbanner_bg.gif); background-position:bottom left; background-repeat:repeat-x; padding-bottom:5px;}

.BG_LINE1{ padding-top:5px;}

.product_BOX{font-family:Arial; font-size:12px; color:#282828; line-height:22px; letter-spacing:1px;}

.product_BOX a{ color:#282828; text-decoration:none;}

.product_BOX a:visited{ color:#282828; text-decoration:none;}

.product_BOX a:hover{ text-decoration:underline;}

.product_BOX a:active{ text-decoration:underline;}

.product_BOX span{font-family:Arial; font-size:18px; color:#f64495; font-weight:bold;}

/* 熱門排行 */
.RANK { position:relative; margin:0 auto; width:290px;}

.RANK li.rank_icon1{ display:block; width:290px; height:31px; background-image:url(images/rank_01.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px; padding-left:25px;}
.RANK li.rank_icon1 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon1 a:hover{text-decoration:underline;}

.RANK li.rank_icon2{ display:block; width:290px; height:31px; background-image:url(images/rank_02.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon2 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon2 a:hover{text-decoration:underline;}

.RANK li.rank_icon3{ display:block; width:290px; height:31px; background-image:url(images/rank_03.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon3 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon3 a:hover{text-decoration:underline;}

.RANK li.rank_icon4{ display:block; width:290px; height:31px; background-image:url(images/rank_04.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon4 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon4 a:hover{text-decoration:underline;}

.RANK li.rank_icon5{ display:block; width:290px; height:31px; background-image:url(images/rank_05.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon5 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon5 a:hover{text-decoration:underline;}

.RANK li.rank_icon6{ display:block; width:290px; height:31px; background-image:url(images/rank_06.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon6 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon6 a:hover{text-decoration:underline;}

.RANK li.rank_icon7{ display:block; width:290px; height:31px; background-image:url(images/rank_07.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon7 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon7 a:hover{text-decoration:underline;}

.RANK li.rank_icon8{ display:block; width:290px; height:31px; background-image:url(images/rank_08.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon8 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon8 a:hover{text-decoration:underline;}

.RANK li.rank_icon9{ display:block; width:290px; height:31px; background-image:url(images/rank_09.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon9 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon9 a:hover{text-decoration:underline;}

.RANK li.rank_icon10{ display:block; width:290px; height:31px; background-image:url(images/rank_10.gif); background-repeat:no-repeat; background-position:left top; font-family:Arial; color:#16517a; font-size:12px; line-height:31px;padding-left:25px;}
.RANK li.rank_icon10 a{ color:#16517a; text-decoration:none;}
.RANK li.rank_icon10 a:hover{text-decoration:underline;}
/* 商品分類 */

.AREA1{ position:relative; margin:0 auto; width:172px; height:80px;}

.AREA1 h2{ position:absolute; width:172px; height:26px; background-image:url(images/big_icon.gif); background-position:left top; background-repeat:no-repeat; font-family:Arial; font-size:16px; font-weight:bold; color:#16517a; letter-spacing:1px;
line-height:26px; padding-left:22px;}
.AREA1 h2 a{font-size:16px; color:#16517a; text-decoration:none;}
.AREA1 h2 a:visited{font-size:16px; color:#16517a; text-decoration:none;}
.AREA1 h2 a:hover{ font-size:16px; text-decoration:underline;}
.AREA1 h2 a:active{ font-size:16px; text-decoration:underline;}

.AREA1 p{position:absolute; top:26px; left:22px; width:138px; font-family:Arial; font-size:13px; color:#282828; letter-spacing:1px; line-height:22px;}
.AREA1 p a{ font-size:13px; color:#282828; text-decoration:none;}
.AREA1 p a:visited{ font-size:13px; color:#282828; text-decoration:none;}
.AREA1 p a:hover{font-size:13px; color:#16517a; text-decoration:underline;}
.AREA1 p a:active{font-size:13px; color:#16517a; text-decoration:underline;}


.AREA2{ position:relative; margin:0 auto; width:172px; height:80px;}

.AREA2 h2{ position:absolute; width:172px; height:26px; background-image:url(images/big_icon.gif); background-position:left top; background-repeat:no-repeat; font-family:Arial; font-size:16px; font-weight:bold; color:#16517a; letter-spacing:1px;
line-height:26px; padding-left:22px;}
.AREA2 h2 a{font-size:16px; color:#16517a; text-decoration:none;}
.AREA2 h2 a:visited{font-size:16px; color:#16517a; text-decoration:none;}
.AREA2 h2 a:hover{ font-size:16px; text-decoration:underline;}
.AREA2 h2 a:active{ font-size:16px; text-decoration:underline;}

.AREA2 p{position:absolute; top:26px; left:22px; width:138px; font-family:Arial; font-size:13px; color:#282828; letter-spacing:1px; line-height:22px;}
.AREA2 p a{ font-size:13px; color:#282828; text-decoration:none;}
.AREA2 p a:visited{ font-size:13px; color:#282828; text-decoration:none;}
.AREA2 p a:hover{font-size:13px; color:#16517a; text-decoration:underline;}
.AREA2 p a:active{font-size:13px; color:#16517a; text-decoration:underline;}


.AREA3{ position:relative; margin:0 auto; width:172px; height:100px;}

.AREA3 h2{ position:absolute; width:172px; height:26px; background-image:url(images/big_icon.gif); background-position:left top; background-repeat:no-repeat; font-family:Arial; font-size:16px; font-weight:bold; color:#16517a; letter-spacing:1px;
line-height:26px; padding-left:22px;}
.AREA3 h2 a{font-size:16px; color:#16517a; text-decoration:none;}
.AREA3 h2 a:visited{font-size:16px; color:#16517a; text-decoration:none;}
.AREA3 h2 a:hover{ font-size:16px; text-decoration:underline;}
.AREA3 h2 a:active{ font-size:16px; text-decoration:underline;}

.AREA3 p{position:absolute; top:26px; left:22px; width:138px; font-family:Arial; font-size:13px; color:#282828; letter-spacing:1px; line-height:22px;}
.AREA3 p a{ font-size:13px; color:#282828; text-decoration:none;}
.AREA3 p a:visited{ font-size:13px; color:#282828; text-decoration:none;}
.AREA3 p a:hover{font-size:13px; color:#16517a; text-decoration:underline;}
.AREA3 p a:active{font-size:13px; color:#16517a; text-decoration:underline;}

.AREA4{ position:relative; margin:0 auto; width:172px; height:120px;}

.AREA4 h2{ position:absolute; width:172px; height:26px; background-image:url(images/big_icon.gif); background-position:left top; background-repeat:no-repeat; font-family:Arial; font-size:16px; font-weight:bold; color:#16517a; letter-spacing:1px;
line-height:26px; padding-left:22px;}
.AREA4 h2 a{font-size:16px; color:#16517a; text-decoration:none;}
.AREA4 h2 a:visited{font-size:16px; color:#16517a; text-decoration:none;}
.AREA4 h2 a:hover{ font-size:16px; text-decoration:underline;}
.AREA4 h2 a:active{ font-size:16px; text-decoration:underline;}

.AREA4 p{position:absolute; top:26px; left:22px; width:138px; font-family:Arial; font-size:13px; color:#282828; letter-spacing:1px; line-height:22px;}
.AREA4 p a{ font-size:13px; color:#282828; text-decoration:none;}
.AREA4 p a:visited{ font-size:13px; color:#282828; text-decoration:none;}
.AREA4 p a:hover{font-size:13px; color:#16517a; text-decoration:underline;}
.AREA4 p a:active{font-size:13px; color:#16517a; text-decoration:underline;}

.AREA5{ position:relative; margin:0 auto; width:172px; height:60px;}

.AREA5 h2{ position:absolute; width:172px; height:26px; background-image:url(images/big_icon.gif); background-position:left top; background-repeat:no-repeat; font-family:Arial; font-size:16px; font-weight:bold; color:#16517a; letter-spacing:1px;
line-height:26px; padding-left:22px;}
.AREA5 h2 a{font-size:16px; color:#16517a; text-decoration:none;}
.AREA5 h2 a:visited{font-size:16px; color:#16517a; text-decoration:none;}
.AREA5 h2 a:hover{ font-size:16px; text-decoration:underline;}
.AREA5 h2 a:active{ font-size:16px; text-decoration:underline;}

.AREA5 p{position:absolute; top:26px; left:22px; width:138px; font-family:Arial; font-size:13px; color:#282828; letter-spacing:1px; line-height:22px;}
.AREA5 p a{ font-size:13px; color:#282828; text-decoration:none;}
.AREA5 p a:visited{ font-size:13px; color:#282828; text-decoration:none;}
.AREA5 p a:hover{font-size:13px; color:#16517a; text-decoration:underline;}
.AREA5 p a:active{font-size:13px; color:#16517a; text-decoration:underline;}


/* 版權聲明 */

.COPY_RIGHT_hilife1{ font-family:Arial; color:#525252; font-size:12px; line-height:20px;}